
.disp_pc #header_extra{width:640px;margin:0 auto;}
.disp_sp #header_extra{width:375px;margin:0 auto 2%;}

#base {
  max-width: 640px;
  margin: 0 auto;
}
.contents_wrap{
  max-width: 640px;
  margin: 0 auto;
  padding-bottom: 3%;
}
#header .header_img {
  width:100%;
  height:auto;
}
#nav li {
  display: table-cell;
  text-align: center;
}
#nav a p {
  background-repeat: no-repeat;
}
#top_bg {
  background: url(../img/contents/navi/navi_bg.png) no-repeat 50% top / 100% auto;
  padding: 5px 4px 2px;
  margin: 0 0 2%;
}
[id$="_group"] .severalmenu {
  width: 86%;
  margin: 0 auto;
  position: relative;
}
.disp_sp .severalmenu .menu_info {
  min-height: 70px;
}
.disp_pc .severalmenu .menu_info {
  min-height: 90px;
}
.disp_pc #new_group .menu_info,
.disp_pc #free_group .menu_info,
.disp_pc #allmenus .menu_ttl {
  margin: 0 0 0 90px;
}
H3 A, A H3{
  line-height:1.4em;
}
.disp_pc [id$="_group"] h3 {
  font-size: 1.5em;
}
.disp_pc .severalmenu .caption {
  font-size: 1.1em;
  line-height: 1.6em;
}
.disp_pc #feature p {
  font-size: 1.1em;
  width: 90%;
  margin: 1% auto 1%;
}
.disp_pc #free_group .section_bdy {
  padding-bottom: 75px;
}
#topicpath a {
  text-decoration: underline;
}
.telling h2 {
  position: relative;
  top: -1px;
}
.disp_pc .telling LI{
  font-size: 1.2em;
  background-size: 24px auto;
  background-position: 0 10px;
}
.disp_pc .telling .section_ftr {
  padding-bottom: 10%;
}
.disp_pc #attention {
  width: 90%;
  text-align: left;
}
.disp_pc #attention h3{
  text-align:center;
  font-size:1.1em;
  font-weight:bold;
  margin-bottom:3%;
}
#attention a {
  color: #f9488a;
  text-decoration: underline;
}

/*--------------------*
.menu_title
*--------------------*/
.disp_pc .menu_title h2{
  font-size:1.6em;
  line-height: 1.3em;
  padding: 4% 0 2% 90px;
}

[class^="menu_category_"]{
  background-position:left center;
  background-repeat:no-repeat;
}
.disp_pc [class^="menu_category_"]{
  background-size:80px 80px;
  height: 80px;
}
.disp_sp  [class^="menu_category_"]{
  background-size:60px 60px;
  height: 60px;
}

/*--------------------*
.icon_category_
*--------------------*/
.disp_pc .menu_title_inner {
  width: 89%;
  margin: 0 auto;
}
.disp_pc [class^="icon_category_"]{
  width:80px;
  height:80px;
}
[class^="icon_category_"]{
  display:inline-block;
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;
  background-size:100% 100%;
  vertical-align:middle;
}
.disp_pc #base .icon{
  width: 80px;
  height: 80px;
}
#base .icon{
  position:absolute;
  top: 5px;
  left: 0;
}
.disp_sp  [class^="icon_category_"]{
    width:60px;
    height:60px;
  }
.disp_sp  #base .icon{
    width: 60px;
    height: 60px;
}
.icon_category_1 { background-image:url(../img/contents/icon/1.jpg); }
.icon_category_2 { background-image:url(../img/contents/icon/2.jpg); }
.icon_category_3 { background-image:url(../img/contents/icon/3.jpg); }
.icon_category_4 { background-image:url(../img/contents/icon/4.jpg); }
.icon_category_5 { background-image:url(../img/contents/icon/5.jpg); }
.icon_category_6 { background-image:url(../img/contents/icon/6.jpg); }
.icon_category_7 { background-image:url(../img/contents/icon/7.jpg); }
.icon_category_8 { background-image:url(../img/contents/icon/8.jpg); }
.icon_category_9 { background-image:url(../img/contents/icon/9.jpg); }
.icon_category_10{ background-image:url(../img/contents/icon/10.jpg);}
.icon_category_11{ background-image:url(../img/contents/icon/11.jpg);}
.icon_category_12{ background-image:url(../img/contents/icon/12.jpg);}
.icon_category_13{ background-image:url(../img/contents/icon/13.jpg);}
.icon_category_14{ background-image:url(../img/contents/icon/14.jpg);}
.icon_category_15{ background-image:url(../img/contents/icon/15.jpg);}
.icon_category_16{ background-image:url(../img/contents/icon/16.jpg);}
.icon_category_17{ background-image:url(../img/contents/icon/17.jpg);}
.icon_category_18{ background-image:url(../img/contents/icon/18.jpg);}
.icon_category_19{ background-image:url(../img/contents/icon/19.jpg);}
.icon_category_20{ background-image:url(../img/contents/icon/20.jpg);}
.icon_category_21{ background-image:url(../img/contents/icon/21.jpg);}
.icon_category_22{ background-image:url(../img/contents/icon/22.jpg);}
.icon_category_23{ background-image:url(../img/contents/icon/23.jpg);}
.icon_category_24{ background-image:url(../img/contents/icon/24.jpg);}
.icon_category_25{ background-image:url(../img/contents/icon/25.jpg);}
.icon_category_26{ background-image:url(../img/contents/icon/26.jpg);}
.icon_category_27{ background-image:url(../img/contents/icon/27.jpg);}
.icon_category_28{ background-image:url(../img/contents/icon/28.jpg);}
.icon_category_29{ background-image:url(../img/contents/icon/29.jpg);}
.icon_category_30{ background-image:url(../img/contents/icon/30.jpg);}
.icon_category_31{ background-image:url(../img/contents/icon/31.jpg);}
.icon_category_32{ background-image:url(../img/contents/icon/32.jpg);}
.icon_category_33{ background-image:url(../img/contents/icon/33.jpg);}
.icon_category_34{ background-image:url(../img/contents/icon/34.jpg);}
.icon_category_35{ background-image:url(../img/contents/icon/35.jpg);}
.icon_category_36{ background-image:url(../img/contents/icon/36.jpg);}
.icon_category_37{ background-image:url(../img/contents/icon/37.jpg);}
.icon_category_38{ background-image:url(../img/contents/icon/38.jpg);}
.icon_category_39{ background-image:url(../img/contents/icon/39.jpg);}
.icon_category_40{ background-image:url(../img/contents/icon/40.jpg);}
.icon_category_41{ background-image:url(../img/contents/icon/41.jpg);}
.icon_category_42{ background-image:url(../img/contents/icon/42.jpg);}

/*---------------------------
 * index
 *---------------------------*/
#allmenus .severalmenu {
  width: 95%;
  margin: 0 auto;
  position: relative;
}
#allmenus .severalmenu .caption ,
.price_normal {
  color: #1F2121;
}
#allmenus a { text-decoration: none; }
#header_nav a p {
  background-repeat: no-repeat;
}
.disp_pc #allmenus H3 {
  font-size: 1.5em;
}
#new_group h2 {
  padding: 0 0 4%;
}

/*---------------------------
 * faq
 *---------------------------*/
.disp_pc #faqSection h2 {
  font-size: 1.5em;
}
.disp_pc #faqSection h3 {
  font-size: 1.3em;
}
.disp_pc #faqSection .detail_txt p {
  font-size: 1.1em;
}

/*---------------------------
 * attention
 *---------------------------*/
.disp_pc #attention H3 ,
.disp_pc #attention {
  font-size: 1.1em;
}
#attention{
  width:90%;
  margin:0 auto;
}
.disp_sp #attention{
  font-size: 0.9em;
}
#attention h3{
  text-align:center;
  font-size:1.2em;
  font-weight:bold;
  margin-bottom:3%;
}
#attention ol,
#attention ul {
  list-style: none;
}
.disp_sp #attention h3{
  font-size:1.1em;
}
#attention P,
#attention li{
  line-height: 1.6;
  text-align: left;
}
#attention a{
  color: #f9488a;
}

/*----------------------------*
 accordion
*-----------------------------*/
#allmenus .more,
#allmenus .close{
  font-size: 16px;
  background: linear-gradient(to bottom, #FFFFC7, #FFE65B);
  border: 2px solid #432312;
  border-radius: 50px;
  color:#432312;
  cursor:pointer;
  width: 280px;
  height: 48px;
  margin: 20px auto 0;
  text-align:center;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
}
.disp_pc #allmenus .more,
.disp_pc #allmenus .close{
  font-size: 18px;
  width: 330px;
}
#allmenus .more > span,
#allmenus .close > span{
  width: 100%;
}

#allmenus .more .mark,
#allmenus .close .mark{
  position: relative;
  font-weight: bold;
}
#allmenus .more .mark::after,
#allmenus .close .mark::after{
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 2px #432312;
  border-right: solid 2px #432312;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: -1em;
  bottom: 0;
  margin: auto;
}
