@charset"utf-8";
/* ==================================色====================================*/
.M100Y100{color:#e50011;} .M100Y100_bak{background-color:#e50011;}
.M80Y20{color:#e85282;}   .M80Y20_bak{background-color:#e85282;}
.M70Y20{color:#eb6d8e;}   .M70Y20_bak{background-color:#eb6d8e;}
.M50Y30{color:#f19b97}    .M50Y30_bak{background-color:#f19b97}
.M100{color:#e4007e;}     .M100_bak{background-color:#e4007e;}
.M50{color:#f09ec1;}      .M50_bak{background-color:#f09ec1;}
.C100M100{color:#611d86;} .C100M100_bak{background-color:#611d86;}
.C100M60{color:#005bac;}  .C100M60_bak{background-color:#005bac;}
.M50Y100{color:#f39700;}  .M50Y100_bak{background-color:#f39700;}
.C100Y100{color:#009943;} .C100Y100_bak{background-color:#009943;}
.K100{color:#231815;}     .K100_bak{background-color:#231815;}
.K70{color:#717071;}      .K70_bak{background-color:#717071;}
.K40{color:#b4b5b5;}      .K40_bak{background-color:#b4b5b5;}
.K30{color:#c9c9ca;}      .K30_bak{background-color:#c9c9ca;}
.K20{color:#dcdcdd;}      .K20_bak{background-color:#dcdcdd;}
.K10{color:#eeefef;}      .K10_bak{background-color:#eeefef;}
.K5{color:#f7f7f7;}       .K5_bak{background-color:#f7f7f7;}
.white{color:#ffffff;}    .white_bak{background-color:#ffffff;}
.pink{color:#eb6d81;}     .pink_bak{background-color:#eb6d81;}

/* ============================Font================================*/
h1{font-size:160%;margin:0px 0px 10px 0px;line-height:1.1em;}
h2{font-size:120%;margin:0px 0px 10px 0px;line-height:1.2em;}
h3{font-size:110%;margin:0px 0px 10px 0px;line-height:1.2em;}
h4{font-size:100%;margin:0px 0px 10px 0px;line-height:1.2em;}
h5{font-size:100%;margin:0px 0px 6px 0px;line-height:1.2em;}

.fon_140_b{font-size:140%;font-weight:bold;}
.fon_120_b{font-size:120%;font-weight:bold;}
.fon_b{font-weight:bold;}
.fon_90{font-size:90%;line-height:1.2em;}
.fon_90_b{font-size:90%;font-weight:bold;line-height:1.2em;}
.fon_80{font-size:80%;line-height:1.2em;}
.fon_80_b{font-size:80%;font-weight:bold;line-height:1.2em;}
.fon_70{font-size:70%;line-height:1.2em;}
.fon_70_b{font-size:70%;font-weight:bold;line-height:1.2em;}

/* ===========================マージン================================*/
.mar_40{margin:40px;overflow:hidden;}
.mar_30{margin:30px;overflow:hidden;}
.mar_20{margin:20px;overflow:hidden;}
.mar_10{margin:10px;overflow:hidden;}
.mar_8{margin:8px;overflow:hidden;}
.mar_6{margin:6px;overflow:hidden;}
.mar_4{margin:4px;overflow:hidden;}
.mar_2{margin:2px;overflow:hidden;}

.mar_top_20{margin-top:20px;}
.mar_top_10{margin-top:10px;}
.mar_top_6{margin-top:6px;}
.mar_top_2{margin-top:2px;}

.mar_rig_20{margin-right:20px;}
.mar_rig_10{margin-right:10px;}
.mar_rig_6{margin-right:6px;}

.mar_bot_20{margin-bottom:20px;}
.mar_bot_10{margin-bottom:10px;}
.mar_bot_6{margin-bottom:6px;}

.mar_lef_20{margin-left:20px;}
.mar_lef_10{margin-left:10px;}
.mar_lef_6{margin-left:6px;}

.specer_20{width:100%;height:20px;float:left;overflow:hidden;}

/* ===========================位置================================*/
.flo_right{float:right;overflow:hidden;}
.flo_left{float:left;overflow:hidden;}

.txt_right{text-align:right;}
.txt_left{text-align:left;}
.txt_center{text-align:center;}

.vertical_t{vertical-align:top;}
.vertical_m{vertical-align:middle;}
.vertical_b{vertical-align:bottom;}

.cr{clear:both;}

/* ===========================サイズ================================*/
.div_full{width:100%;height:auto;overflow:hidden;}
.div_harf{width:48%;height:auto;overflow:hidden;}

/*=========================================================================*/
/*                             　　共通役物　 　　                               */
/*=========================================================================*/
.bor_dot_botom_div_h4{width:100%;height:auto;padding-bottom:4px;margin-bottom:4px;
                      border-bottom:1px dotted #717071;overflow:hidden;}
.bor_dot_botom_div_h10{width:100%;height:auto;padding-bottom:10px;margin-bottom:10px;
                      border-bottom:1px dotted #717071;overflow:hidden;}
.sys_table{width:90%:height:auto;padding:2px;font-size:80%;
           border-collapse:collapse;border:1px solid #717071;}
.sys_table th{text-align:left;width:25%;background-color:#dcdcdd;padding:4px;
            border:1px solid #717071;}
.sys_table tr:nth-child(odd) td{background-color:#ffffff;padding:4px;
          border:1px solid #717071;}
.sys_table tr:nth-child(even) td{background-color:#eeefef;padding:4px;
          border:1px solid #717071;}

.shop_table{width:auto;height:auto;padding:2px;font-size:80%;
           border-collapse:collapse;border:1px solid #717071;}
.shop_table th{text-align:left;background-color:#dcdcdd;padding:4px;
            border:1px solid #717071;}
.shop_table tr:nth-child(odd) td{background-color:#ffffff;padding:4px;
          border:1px solid #717071;}
.shop_table tr:nth-child(even) td{background-color:#eeefef;padding:4px;
          border:1px solid #717071;}

#slidemenu{
 position: fixed;
 top: 80px;
 right: 3px;
 width: 40px;
 height: 40px;
 z-index:100;
}
/* ラジオボタンを消す */
#slidemenu input{
 display: none;
 z-index:9999;
}
/* 開閉ボタン */
#button_open,
#button_close {
    position: fixed;
    top: 80px;
    right: 3px;
    width: 40px;
    height: 40px;
    text-align: right;
    cursor: pointer;
}
/* 初期値はオープンボタンはblock、クローズボタンはnone */
#button_open {
 display: block;
}
#button_close {
 display: none;
}

/****************************************
ボタンのスタイル ここから
****************************************/
#button_open span,
#button_close span {
    margin: 0 auto;
    width: 40px;
    height: 40px;
    display: inline-block;
    position: relative;
    background: #000000;
}
/* 擬似要素で横線を描写（border-top） */
#button_open span:after,
#button_close span:after {
  content: "";
  position: absolute;
  top: 18px;
  left: 8px;
  width: 24px;
  border-top: 3px solid #FFFFFF;
}
/* オープンボタンはbox-shadowを上下に描写して3本線に */
#button_open span:after {
  box-shadow: 0 8px 0 #CACACA, 0 -8px 0 #FFFFFF;
}
/****************************************
ボタンのスタイル ここまで
****************************************/

/****************************************
メニューのスタイル ここから
****************************************/
#menu {
 margin: 0;
 padding: 0;
 width: 0; /* 初期値は横幅が0で見えない状態 */
 position:fixed;
 top: 112px;
 right: 3px;
 color: #FFFFFF;
 z-index: 9999;
 overflow: hidden;
 /* 表示するときにアニメーションさせる */
 -webkit-transition: all ease-in-out;
 -webkit-transition-delay: 0.5s;
 -moz-transition: all ease-in-out 0.5s;
 -o-transition: all ease-in-out 0.5s;
 transition: all ease-in-out 0.5s;
}
#menu ul {
 margin: 0;
 padding: 0;
 color: #FFFFFF;
 border-top: #CACACA;
 text-align: left;
 list-style: none inside;
 z-index: 9999;
}
#menu li {
 margin: 0;
 padding: 0;
 overflow: hidden;
 width: 100%;
 z-index: 9999;
}
#menu li a {
 margin: 0;
 padding: 5px;
 overflow: hidden;
 display: block;
 height: 34px;
 line-height: 34px;
 background: #000000;
 text-decoration: none;
 color: #FFFFFF;
 z-index: 9999;
}
#menu li a:hover {
 background: #454545;
 z-index: 9999;
}
/****************************************
メニューのスタイル ここまで
****************************************/

/****************************************
オープンボタンにチェック時の処理 ここから
****************************************/
/* オープンボタンを非表示 */
#open:checked ~ #button_open {
  display: none;
}
/* クローズボタンを表示 */
#open:checked ~ #button_close {
  display: inline;
}
/* メニューを表示（横幅をつける） */
@media screen and (max-width: 640px) {
   /* 表示領域が640px以上の場合に適用するスタイル */
   #open:checked ~ #menu { width: 60%; }
}
@media screen and (min-width: 641px) {
   /* 表示領域が641px以下の場合に適用するスタイル */
   #open:checked ~ #menu { width: 20%; }
}

/****************************************
オープンボタンにチェック時の処理 ここまで
*****************************************/
/* =========================================================================*/
/*                                 全体指定部                                 */
/* =========================================================================*/

body { 
 /*background-repeat:repeat-x;*/
 margin:0 auto;
 text-align:center;
 color:#333333;
 font-family: Verdana, Roboto, "メイリオ", Meiryo, "Droid Sans", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic", sans-serif;
 line-height:1em;
 -webkit-text-size-adjust: 100%;
 }

td,tr{vertical-align:top;}

img {border:0px;}
a:hover img {
 filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
a:active img {
 filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
a img {
 filter:alpha(opacity=100);
 -moz-opacity: 1;
  opacity: 1;
}