/*--------------------*
 *  default settings
 *--------------------*/
*{
  margin: 0px;
  padding: 0px;
}
html{
  overflow-y:scroll;
  -webkit-text-size-adjust: none;
}
IMG{
  vertical-align: bottom;
}
header#header_moon_cp_zap .navi_logo img{
  width: revert-layer;
}
BODY{
  _line-break: strict;
  font-size: 14px;
  margin: 0 auto;
  box-sizing: border-box;
  color:#9A6727;
  background: url(../img/contents/bg_main.jpg);
  font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","Meiryo","メイリオ","Osaka","MS PGothic",arial,helvetica,sans-serif;
}
FORM{
  margin: 0 auto;
  padding: 0;
}
TABLE{
  border-collapse: collapse;
  border-spacing:0px;
  empty-cells: hide;
  text-align: left;
  font-size: 1em;
  border: 0;
  padding: 0;
}
TR, TD, TH, THEAD, TBODY, TFOOT, COLGROUP, COL{}
UL{
  margin: 0;
  list-style-type: disc;
}
OL{
  margin: 0;
  padding: 0;
}
LI{
  margin: 0;
  padding: 0;
}
H1,H2,H3,H4,H5{
  margin: 0 auto;
}
H1 IMG, H2 IMG, H3 IMG, H4 IMG {
    margin: 0 auto;
    width: 100%;
}
P{
  margin: 0 auto;
}
HR{display:none;}
EM{font-style:normal;font-weight:bold;}
H1,H2,H3,H4,H5,H6{
  font-size:1.1em;font-weight: bold;
}

A{color: #ED2C1D;outline : 0;text-decoration:none;}
A:hover{
  text-decoration:none;
}
.icon {
    float: left;
    width: 15%;
}
.icon IMG {
    width: 100%;
}
.img_auto {
  width: 100%;
}
H4 A {
  color:#e6281a;
}
H4 A:hover{
  color:#f5463a;
}
H4 A:visited {
  color:#990000;
}

/*--------------------
common class setting
--------------------*/
.clear{
  clear: both;
  float:none;
  line-height:0px;
  font-size:0px;
  height:0px;
}
.hide{
  display:none;
}
.icon{
  float:left;
  text-align:center;
}
.icon_category{margin-bottom:0px;}
.icon_player{margin-bottom:3px;margin-top:2px;}
.icon_new{margin-bottom:3px;width:50px;}
.free_info {
  padding-top:3px;
  text-align:center;
  color:#e5bc08;
  font-size:1.2em;
}
.pr,
.pr A,
i.price_discount{color:#9A6727;}
.limited{color:#33969b;}
P.pr{}
DIV.pr,
DIV.limited{
  line-height:1.2;
  font-size:12px;
}
.price_discount{
  color:#D0008A;
  text-align:right;
}
.price_normal{text-align:right;}

/*Clear-Fix(IE対策のためセットで利用する)
TAG{
  zoom:100%;
}
TAG:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0.1px;
  font-size: 0.1em;
  line-height: 0;
  clear: both;
}
*/

/*--------------------
#base
--------------------*/
#index_base{
  margin:0px auto;
}
#base{
}
#header_extra{
  margin: 0 auto;
}
.disp_pc #header_extra{
  width: 375px;
}
.disp_pc #base {
  width: 375px;
  margin: 0 auto;
}
/*--------------------*
#header
*--------------------*/
#header H1{
  text-align:center;
}
#extra_header{
  margin:0px auto;
  text-align:center;
}
#index_basebdy{
  margin:0px auto;
}

#basebdy{
  margin:0px auto;
}
#header H1 A{
  display:block;
  margin:0px auto;
}
#extra{
  /* background-color: #C8C09C; */
}
/*--------------------*
#headernavi
*--------------------*/

#headernavi ul {
  -moz-box-sizing: border-box;
  border-collapse: separate;
  border-spacing: 5px;
  display: table;
  table-layout: fixed;
  width: 100%;
  padding:0;
}
#headernavi li{
  display:table-cell;
}
#headernavi li a{ 
  color: #303030;
  display:block;
  text-align:center;
  line-height: 3em;
  border: 1px solid #737373;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  background: -moz-linear-gradient(
        top,
        #F8C8B1 0%,
        #F5AA95 50%,
        #D0917F 50%,
        #BA9685);
    background: -webkit-gradient(
        linear, left top, left bottom,
        from(#F8C8B1),
        color-stop(0.50, #F5AA95),
        color-stop(0.50, #D0917F),
        to(#BA9685));
    -moz-box-shadow:
        0px 1px 3px rgba(000,000,000,0.5),
        inset 0px 0px 1px rgba(255,255,255,0.5);
    -webkit-box-shadow:
        0px 1px 3px rgba(000,000,000,0.5),
        inset 0px 0px 1px rgba(255,255,255,0.5);
    box-shadow:
        0px 1px 3px rgba(000,000,000,0.5),
        inset 0px 0px 1px rgba(255,255,255,0.5);
}
#headernavi li div{ 
  color: #DDD;
  line-height: 3em;
  text-align:center;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  background: -moz-linear-gradient(
    top,
    #D0917F 0%,
    #BA9685);
  background: -webkit-gradient(
    linear, left top, left bottom,
    from(#D0917F),
    to(#BA9685));
  -moz-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 0px rgba(18,11,1,1);
  -webkit-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 0px rgba(18,11,1,1);
  box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 0px rgba(18,11,1,1);
}


/*--------------------*
#extra
*--------------------*/
#extra{
    text-align: left;
    margin-top:10px;
}
#extra .pr {
  color: #FF8080;
  text-align: left;
}
#rec_single .pr {
  font-size: 9px;
}
/*--------------------*
#topicpath
*--------------------*/
#topicpath{
    color: #4F0000;
    font-size: 70%;
    text-align: left;
    margin: 1% 0;
    padding:0 10px;
}

/*--------------------*
#page_ttl
*--------------------*/
#page_ttl{
  width: 100%;
  margin: 0 auto 15px;
  background-attachment: scroll;
  background-clip: border-box;
  background-color: transparent;
  background-image: url("../img/contents/page_ttl.png");
  background-origin: padding-box;
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
#page_ttl H2 .page_title {
    color: #EFEFEF;
    font-size: 14px;
    padding: 6% 0 5%;
}
#page_ttl H2 {
    margin: 0 auto;
    text-align: center;
    width: 90%;
}
/*--------------------*
#menu_ttl,#menu_ttl_next,menu_ttle
*--------------------*/
#menu_ttl,
#menu_ttl_next,
.menu_ttle {
  width: 100%;
  background: url(../img/contents/page_ttl.png);
  background-size: 100% 100%;
}
#menu_ttl .title_desing,
#menu_ttl_next .title_desing,
.menu_ttle .title_desing {
  width: 100%;
}
#menu_ttl H2,
#menu_ttl_next H2,
.menu_ttle H2 {
  display: table;
  margin: 0 auto;
  text-align: left;
  width: 75%;
}
#menu_ttl .menu_icon,
#menu_ttl_next .menu_icon,
.menu_ttle .menu_icon {
    display: table-cell;
    vertical-align: middle;
}
#menu_ttl H2 .icon_category,
#menu_ttl_next H2 .icon_category,
.menu_ttle H2 .icon_category {
    padding-bottom: 7%;
}
#menu_ttl H2 .title,
#menu_ttl_next H2 .title,
.menu_ttle H2 .title {
  margin-top:17px; color:#DEB887;
}
.menu_title {
    color: #EFEFEF;
    display: table-cell;
    font-size: 14px;
    padding: 12% 0 12% 1em;
    vertical-align: middle;
    width: 80%;
}
.menu_caption {
  margin: 0 auto;
  text-align: left;
  width: 90%;
}
/*--------------------*
#menu_header / #next_info
  一部無料の料金案内は #next_info（本文の下）に置く
*--------------------*/
#menu_header{
  margin:2% 0;
}
#menu_header P,
#next_info P{
  padding:5px 10px;
  text-align: left;
  width: 90%;
  margin: 0 auto;
}
#menu_header P.price_normal STRONG,
#next_info P.price_normal STRONG {
  color: #FF80FF;
}
#menu_header P.pr,
#menu_header P.pr A{color:#d00079;font-weight:bold;}
#menu_header P.price STRONG,
#next_info P.price STRONG{color:#C000C0;}
#menu_header P.price STRONG.y_price,
#next_info P.price STRONG.y_price{color:#E74949;}
#menu_header P.attention A,
#next_info P.attention A{color:#E74949;}
#menu_header P.attention STRONG,
#next_info P.attention STRONG{color:#E74949;}
/*--------------------*
#menu_caption
*--------------------*/
#menu_caption{
  margin:15px auto 10px;
}
#menu_caption P{
  padding-bottom:5px;
  text-align:center;
  color:#FFF5DA;
}
#menu_caption P.pr,
#menu_caption P.pr A{color:#ECB452;}
#menu_caption P.attention{color:#FFF5DA;}
#menu_caption P.attention STRONG{color:F0AA28;}

/*--------------------
#footer
--------------------*/
#footer{;
  text-align:center;
  min-height:1%;
  _height:1%;
}
#footer ADDRESS,
#footer EM{
  text-decoration:none;
  font-style:normal;
}
#footer UL{list-style-type:none;}
#footer LI{
  display:inline;
}
/**/
#footernavi {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  color: #efefef;
  padding: 10px 20px;
  background: -moz-linear-gradient(
    top,
    #46412E 0%,
    #46412E 50%,
    #100E02 50%,
    #100E02);
  background: -webkit-gradient(
    linear, left top, left bottom, 
    from(#46412E),
    color-stop(0.50, #46412E),
    color-stop(0.50, #100E02),
    to(#100E02));
  -moz-border-radius: 0px;
  -webkit-border-radius: 0px;
  border-radius: 0px;
  -moz-box-shadow:
   0px 1px 3px rgba(000,000,000,0.5),
  inset 0px 0px 1px rgba(255,255,255,0.6);
  -webkit-box-shadow:
   0px 1px 3px rgba(000,000,000,0.5),
  inset 0px 0px 1px rgba(255,255,255,0.6);
  box-shadow:
   0px 1px 3px rgba(000,000,000,0.5),
  inset 0px 0px 1px rgba(255,255,255,0.6);
  text-shadow:
  0px -1px 0px rgba(000,000,000,1),
  0px 1px 0px rgba(255,255,255,0.2);
}
#footernavi A{color:#F9EED9;}
#footernavi SPAN{color:#ECD07C;}
/* リンク名の途中で折り返さないようにする */
#footernavi UL{
  margin:0;
  padding:0;
}
#footernavi LI{
  display:inline-block;
  white-space:nowrap;
}
/**/
#footerCopy{padding:25px 0px 20px;}
#zapCopy{margin-top:10px;color:#9A6727;}
#ispCopy{margin-top:10px;}
#ispInfo{margin-top:10px;}
#ispInfo DIV{padding-bottom:5px;}

/*--------------------*
#maintenance
*--------------------*/
#maintenance{
  margin: 15px auto 15px auto;
  font-size: 1em;
  text-align: center;
  background:#EEE8AA;
  color: #996633;
}
#maintenance #maintenancebody{
  border: 3px double #FF6633;
  padding:10px 5px;
}
#maintenance #maintenance_title{
  padding-bottom:4px;
  font-weight: bold;
  font-size: 1.25em;
  color: #FF6633;
}
#maintenance P.maintenanceDate{
  margin: 0 auto 5px;
  text-align: center;
  font-weight: bold;
  color: #996633;
}
#maintenance P.maintenanceComment{
  text-align: left;
  line-height: 1.3;
  text-align: center;
}
#maintenance A{
  color:#FFF!important;
  background:#6D2A00!important;
}
/*--------------------*
#free_group
*--------------------*/
#free_group{
  margin: auto;
}

#free_group H4 A{
  padding:3px 0px;
}
#free_group A H4 A {
  color:#F7DF72;
}
#free_group A:visited{
  color:#7C7039;
}
#free_group .horizon{
  height:11px;
  margin:10px auto;
  border-bottom:1px solid #5D3B28;
}
/*--------------------*
#free_group
*--------------------*/
#free_group{
  margin: 0 auto 20px;
}
#free_group H2 {
  padding: 20px 0 0;
}
#free_group .section_ftr {
  background: url(../img/contents/index_free_under.png) no-repeat 50% bottom;
  padding-bottom: 7%;
  background-size: 100% auto;
}
#free_group .section_hdr {
  padding-top: 1em;
  background-color: #FF8C60;
}
#free_group .menu_bdy {
  background-color: #F6EEE1;
  margin-bottom: 0;
  border: none;
  padding: 0;
  width: 100%;
}
#free_group .menu_ftr {
  background: none;
  border: none;
  border-top: solid 10px #FCC867;
  border-bottom: solid 10px #FCC867;
}
/*--------------------*
#extra_group
*--------------------*/
#extra_group{
  margin: 0 auto;
}
.severalmenu{
  text-align: left;
}
#extra_group .section_bdy{
  margin: 0 auto;
  width: 100%;
  padding: 1% 0 5%;
}
.menu_bdy {
  color: #5A0C08;
  clear: both;
  overflow: hidden;
  display:block;
  background-color:#EDE0C9;
  margin: 5px auto;
  padding:2px;
  width: 92%;
  border: 3px solid #CF9F39;
  /*border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;*/
}
.menu_bdy:nth-of-type(1) {
  margin-top: 0;
}
.menu_ftr {
  overflow: hidden;
  margin: 0 auto;
  padding: 2% 4%;
  border: 1px solid #CF9F39;
  /*border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;*/
  box-shadow: inset 0px 1px 2px 0px #666;
  -webkit-box-shadow: inset 0px 1px 2px 0px #666;
  -moz-box-shadow: inset 0px 1px 2px 0px #666;
  background: -moz-linear-gradient(
    top,
    #bab4a9 0%,
    #f5e7ce 5%,
    #FFF9ED 20%,
    #faf2e3 82%,
    #d3bd94);
  background: -webkit-gradient(
    linear, left top, left bottom, 
    from(#bab4a9),
    color-stop(0.05, #f5e7ce),
    color-stop(0.20, #FFF9ED),
    color-stop(0.82, #faf2e3),
    to(#d3bd94));
}
.price_info {
    font-size: 13px;
    padding-top: 5px;
    text-align: right;
}
.menu_ttl,.menu_info {
  text-align: left;
  margin-left: 18%;
}

/*--------------------*
#free_extra
*--------------------*/
#free_extra{
  color: #5A0C08;
  margin: 20px auto 10px;
}
#free_extra .severalmenu{
  padding: 2% 2%;
  text-align: left;
}
#free_extra .severalmenu.inframe {
  border: solid 1px #9E3311;
}
#free_extra .section_bdy{
  margin: 0 auto;
  width: 100%;
  padding: 1% 0 2%;
}
#free_extra .menu_bdy{
  background-color: #EDE0C9;
  border: 3px solid #9E3311;
  display: block;
  margin: 0 auto 2%;
  padding: 2px;
  width: 92%;
}
#free_extra .menu_bdy .menu_bdy_in{
  margin: 0 auto;
  padding: 2% 4%;
  border: 1px solid #9E3311;
  /*border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;*/
  box-shadow: inset 0px 1px 2px 0px #666;
  -webkit-box-shadow: inset 0px 1px 2px 0px #666;
  -moz-box-shadow: inset 0px 1px 2px 0px #666;
  background: -moz-linear-gradient(
    top,
    #bab4a9 0%,
    #f5e7ce 5%,
    #FFF9ED 20%,
    #faf2e3 82%,
    #d3bd94);
  background: -webkit-gradient(
    linear, left top, left bottom, 
    from(#bab4a9),
    color-stop(0.05, #f5e7ce),
    color-stop(0.20, #FFF9ED),
    color-stop(0.82, #faf2e3),
    to(#d3bd94));
}
.price_info {
    font-size: 13px;
    padding-top: 5px;
    text-align: right;
}
#free_extra .menu_info{margin-left: 18%;}
#free_extra .icon{width: 15%;}
#free_extra .menu_info H4 A{color:#e53a05;}
#free_extra .menu_info H4 A:hover{color:#ed6a55;}
#free_extra .menu_info H4 A:visited{color:#990000;}
#free_extra .horizon{
  height:11px;
  margin:10px auto;
  border-bottom:1px solid #5D3B28;
}
#frm_btn .price_charge .btn,
.mosaic_btn,
.charge_price_btn,
.menu_but .btn {
  font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","Meiryo","メイリオ","Osaka","MS PGothic",arial,helvetica,sans-serif;
  color: #EFEFEF;
  cursor: pointer;
  display: block;
  font-size: 20px;
  margin: 0.5em auto;
  padding: 10px 0;
  text-align: center;
  width: 90%;
  background: -moz-linear-gradient(
    top,
    #ffffff 0%,
    #A667D9 50%,
    #5E0C72 50%,
    #460956);
  background: -webkit-gradient(
    linear, left top, left bottom, 
    from(#ffffff),
    color-stop(0.50, #A667D9),
    color-stop(0.50, #5E0C72),
    to(#460956));
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border: none;
  border-radius: 20px;
  -moz-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 0px rgba(009,012,023,0.8);
  -webkit-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 0px rgba(009,012,023,0.8);
  box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 0px rgba(009,012,023,0.8);
  text-shadow:
    0px -1px 0px rgba(000,000,000,0.2),
    0px 1px 0px rgba(255,255,255,0.4);
}
#frm_btn .price_free a,
.btn_free {
  font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","Meiryo","メイリオ","Osaka","MS PGothic",arial,helvetica,sans-serif;
  color: #EFEFEF;
  text-align: center;
  cursor: pointer;
  display: block;
  font-size: 20px;
  margin: 0.5em auto 0;
  padding: 10px 0;
  width: 90%;
  background: -moz-linear-gradient(
    top,
    #ffffff 0%,
    #F6747C 50%,
    #D91C23 50%,
    #6C0E12);
  background: -webkit-gradient(
    linear, left top, left bottom, 
    from(#ffffff),
    color-stop(0.50, #F6747C),
    color-stop(0.50, #D91C23),
    to(#6C0E12));
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border: none;
  border-radius: 20px;
  -moz-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 0px rgba(009,012,023,0.8);
  -webkit-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 0px rgba(009,012,023,0.8);
  box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 0px rgba(009,012,023,0.8);
  text-shadow:
    0px -1px 0px rgba(000,000,000,0.2),
    0px 1px 0px rgba(255,255,255,0.4);
}
/*=========================================
#rec_double
=========================================*/
#frmInput .c-red {
  color:red;
  font-size:0.8em;
}
/*=========================================
#info_group
=========================================*/
#info_group {
  text-align: center;
}
#info_group H3 {
  color: #E6E6E6;
  text-align: left;
}
#info_group P {
  text-align: left;
}
.rbtn {
  display:block;
  color: #E6E6E6;
  width: 70%;
  text-align:center;
  padding: 2% 3%;
  margin: 0 auto;
  border: 1px solid #737373;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  background: -moz-linear-gradient(
    top,
    #0d0e58 0%,
    #080832 50%,
    #060626 50%,
    #000000);
  background: -webkit-gradient(
    linear, left top, left bottom,
    from(#0d0e58),
    color-stop(0.50, #080832),
    color-stop(0.50, #060626),
    to(#000000));
  -moz-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 1px rgba(255,255,255,0.5);
  -webkit-box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 1px rgba(255,255,255,0.5);
  box-shadow:
    0px 1px 3px rgba(000,000,000,0.5),
    inset 0px 0px 1px rgba(255,255,255,0.5);
}
