@charset "UTF-8";
/*================*/
/*textJustify*/
/*================*/
#diffAppl .voice,
#pickupMenu .notice,
.catMenus h3
{
  text-align:justify;
  text-justify:inter-ideograph;
}

/*================*/
/*common*/
/*================*/

h2{text-align: center;}
.packNotice{
  color: #fec;
  line-height: 1.4;
  font-size: 1.4rem;
}
.packNotice ul li{
  font-weight: normal;
  font-size: 1.4rem;
}

.price,
.premPrice{line-height: 1.5;}

@media screen and (min-width: 640px) { /* 640px以上（pct） */
}
@media screen and (min-width: 900px) { /* 900px以上(pc) */
  .price,
  .premPrice{padding-right: 33px;}
  .price{padding-bottom: 10px;}
}
@media screen and (min-width: 640px) and (max-width: 899px) { /* 640px - 899px(tb) */
  h3{
    font-size: 2.6rem;
    padding: 10px 2%;
  }
  .packNotice,
  .cap{
    padding: 10px 3%;
  }
}
@media screen and (min-width: 480px) and (max-width: 639px) { /* 480px - 639px(lp) */
}
@media screen and (max-width: 899px){ /* 899px以下(nepc) */
  .price{padding: 0 3% 10px;}
  .premPrice{padding: 0 3%;}
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
  .packNotice li{font-size: 1.4rem;}
  .price{padding: 0 2% 10px;}
  .premPrice{padding: 10px 2% 0;}
  h3{
    font-size: 2.0rem;
    padding: 10px 2%;
  }

}
@media screen and (max-width: 479px){ /* 479px以下(sp) */
  .packNotice li{font-size: 1.2rem;}
  h3{
    font-size: 1.7rem;
    padding: 0 2%;
  }
}

@media screen and (min-width: 900px) { /* 900px以上(pc) */
}
@media screen and (min-width: 640px) { /* 640px以上（pct） */
}
@media screen and (min-width: 900px) { /* 900px以上 */
}
@media screen and (min-width: 640px) and (max-width: 899px) { /* 640px - 899px(tb) */
}
@media screen and (min-width: 480px) and (max-width: 639px) { /* 480px - 639px(lp) */
}
@media screen and (max-width: 899px){ /* 899px以下(nepc) */
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
}
@media screen and (max-width: 479px){ /* 479px以下(sp) */
}


/*================*/
/*#topCatch*/
/*================*/
#topCatch{margin: 20px auto;}
@media screen and (min-width: 900px) { /* 900px以上(pc) */
}
@media screen and (min-width: 480px) and (max-width: 639px) { /* 480px - 639px(lp) */
}
@media screen and (max-width: 899px){ /* 899px以下(nepc) */
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
}
@media screen and (max-width: 479px){ /* 479px以下(sp) */
}

/*================*/
/*#headerNotice*/
/*================*/
#headerNotice{
  text-align: center;
  line-height: 1.4;
  font-size: 1.5rem;
  margin: 0 3%;
  color: #ccc;
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
  #headerNotice{font-size: 1.4rem; }
}
@media screen and (max-width: 479px){ /* 479px以下(sp) */
}


/*================*/
/*#newMenu*/
/*================*/
#pickupMenu,
#spMenu,
#spFreeMenu,
#newFreeMenu,
#newMenu{
  position: relative;
  margin: 0 auto 20px;
}
#newFreeMenu,
#newMenu{

}
#newFreeMenu h2,
#newMenu h2{
  position: relative;
  z-index: 10;
  width: 100%;
}
#newFreeMenu h2{}
#newMenu h2{}
#topRecoMenu h2{}
#spRecoMenu h2{margin: 0 auto;padding: 20px 1%;}
#spMenu h2{}
#spFreeMenu h2{}

#newFreeMenu .date,
#newMenu .date{
  color: #4C0066;
  font-weight: bold;
  font-size: 1.6rem;
  line-height: 1;
  text-shadow:
  1px 1px 0px #fff,
  1px 1px 0px #fff,
  2px 2px 0px #fff;
;
}
#pickupMenu .notice.privacy{
  width: 520px;
  margin: 10px auto;
  padding: 10px;
  font-size: 1.4rem;
  line-height: 1.4;
  color: #ccc;
  border: 1px solid #666;
  box-shadow: 0 0 50px -10px rgba(0, 0, 0, 0.5) inset;
}
#pickupMenu .notice.privacy li{
  list-style-type: disc;
  list-style-position: inside;
}
@media screen and (min-width: 900px) { /* 900px以上(pc) */
  #newFreeMenu,
  #newMenu{
    /*padding: 50px;*/
  }
  #newFreeMenu .date,
  #newMenu .date{
    margin-top: -2px;
    margin-right: 24px;
    text-align: right;
  }
}
@media screen and (min-width: 640px) and (max-width: 899px) { /* 640px - 899px(tb) */
  #newFreeMenu .date,
  #newMenu .date{
    margin-top: 15px;
    margin-right: 22px;
    text-align: right;
  }
}
@media screen and (min-width: 480px) and (max-width: 639px) { /* 480px - 639px(lp) */
}
@media screen and (max-width: 899px){ /* 899px以下(nepc) */
  #pickupMenu .imgMenuLinks{
    margin-top: 0 !important;
    padding-top: 0;
  }
  #newFreeMenu h2 img,
  #newMenu h2 img{
    width: 300px;
    margin-top: -75px;
  }

}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
  #newFreeMenu .date,
  #newMenu .date{
    margin-top: 0px;
    margin-right: 22px;
    text-align: right;
  }
  #pickupMenu.frm9{
    background: none;
    padding: 0;
  }
  #firstPickupMenu .inner > div{
    padding: 10px 1%;
  }
  #firstPickupMenu .inner > div a{
    padding: 10px 0;
    font-size: 1.8rem;
    line-height: 1.6;
    color:rgb(0, 235, 255);
  }
  #firstPickupMenu .inner > h3{
    display: inline-block;
    width: 49%;
    margin: 5px 0;
    padding: 0;
  }
  #firstPickupMenu{
    margin: 0 3px;
  }
}
@media screen and (max-width: 479px){ /* 479px以下(sp) */
  #firstPickupMenu .inner > div a{font-size: 1.5rem; }
  #newFreeMenu h2,
  #newMenu h2{
    z-index: 200;
  }
  #newFreeMenu h2 img,
  #newMenu h2 img{
    width: 250px;
    margin-top: -55px;
  }
}


/*================*/
/*#diffAppl*/
/*================*/
#diffAppl{
  position: relative;
}
#diffAppl .frm2{max-width: 808px;}
#diffAppl .frm2::after{
  top: -19px;
  transform:rotateX(180deg);
}
#diffAppl .inner > div {
  position: relative;
}
#diffAppl .inner > div {
  margin: 3%;
  position: relative;
}
#diffAppl .inner > div > div{
}
#diffAppl .inner > div > p{
  color: #181E35;
  font-size: 1.8rem;
  line-height: 1.4;
  background-color: #fff;
  padding: 30px;
  border-radius: 30px;
  position: relative;
  max-width: 560px;
  margin:-9% 0 0 24%;
}
#diffAppl .inner > div > p > img{
  float: right;
  margin-left: 20px;
}
#diffAppl .inner .menuTitle{
  padding: 10px 0 0 3%;
}
#diffAppl .inner .menuTitle .icon{
  width: 100px;
  height: 100px;
}
#diffAppl .inner .menuTitle h3{
  padding-left: 10px;
}

@media screen and (min-width: 640px) { /* 640px以上（pct） */
  #diffAppl .inner > div {
    /*margin: 20px 20px 20px 60px;*/
  }
}
@media screen and (min-width: 900px) { /* 900px以上(pc) */
}
@media screen and (min-width: 640px) and (max-width: 899px) { /* 640px - 899px(tb) */
}
@media screen and (min-width: 480px) and (max-width: 639px) { /* 480px - 639px(lp) */
}
@media screen and (max-width: 899px){ /* 899px以下(nepc) */
  #diffAppl .inner > div > p{
    max-width: 100%;
    margin:0 1%;
  }
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
  #diffAppl .inner > div > p > img{
    width: 25%;
  }
  #diffAppl .inner > div > p{
    padding: 13px;
    border-radius: 20px;
    font-size: 1.6rem;
  }
}
@media screen and (max-width: 479px){ /* 479px以下(sp) */
}


/*================*/
/*#top_benefit*/
/*================*/
#top_benefit{
  text-align: center;
  margin: 50px auto 30px;
}
#top_benefit ul{margin: 30px auto;}
#top_benefit li{
  display: inline-block;
}



/*================*/
/*#catMenu*/
/*================*/
#catMenu{
  margin: 40px auto;
  position: relative;
}

/*================*/
/*.catNavi*/
/*================*/
.catNavi{
  position: relative;
  text-align: center;
  margin: 20px auto;
}
.catNavi a{
  display: inline-block;
  max-width: 32%;
  cursor: pointer;
}
/*.catNavi a.on img{opacity: 0.9; }*/
/*.catNavi a.on2 img{opacity: 0.8; }*/
/*.catNavi a:nth-of-type(1).on,*/
/*.catNavi a:nth-of-type(1).on2{background-color: #f00; }*/
/*.catNavi a:nth-of-type(2).on,*/
/*.catNavi a:nth-of-type(2).on2{background-color: #ff0; }*/
/*.catNavi a:nth-of-type(3).on,*/
/*.catNavi a:nth-of-type(3).on2{background-color: #00f; }*/

@media screen and (min-width: 640px) { /* 640px以上（pct） */
}
@media screen and (min-width: 900px) { /* 900px以上(pc) */
}
@media screen and (min-width: 640px) and (max-width: 899px) { /* 640px - 899px(tb) */
}
@media screen and (min-width: 480px) and (max-width: 639px) { /* 480px - 639px(lp) */
}
@media screen and (max-width: 899px){ /* 899px以下(nepc) */
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
}
@media screen and (max-width: 479px){ /* 479px以下(sp) */
}

/*================*/
/*.catMenuTitles*/
/*================*/
.catMenuTitles{
  position: relative;
  margin: 0 auto;
  text-align: center;
  max-width: 820px;
}

/*.catMenus.cat1 {background-color:#3E0B1E; }
.catMenus.cat2 {background-color:#342C07; }
.catMenus.cat3 {background-color:#002135; }
*/

@media screen and (min-width: 900px) { /* 900px以上 */
}


.catMenus{
  position: relative;
  margin: 0 auto 20px;
  padding-top: 20px;
}

.catMenus > ul{
}
.catMenus > ul > li.catBox{
  position: relative;
  float: left;
  /*margin-bottom: 20px;*/
  border: 3px solid #000;
  border-width: 1px 3px;
}

.catMenus li.on .title{
  -webkit-transition: all .25s ease;
  -moz-transition: all .25s ease;
  -ms-transition: all .25s ease;
  -o-transition: all .25s ease;
  transition: all .25s ease;
}
.catMenus.cat1 li.on .title{box-shadow: 0 0 70px 70px rgba(65, 31, 41, 0.5) inset;}
.catMenus.cat2 li.on .title{box-shadow: 0 0 70px 70px rgba(64, 47, 32, 0.5) inset;}
.catMenus.cat3 li.on .title{box-shadow: 0 0 70px 70px rgba(33, 52, 63, 0.5) inset;}
/**/
/*.cat1 .catBox:nth-of-type(odd) .menuTitle{background: url(../img/bg_ptn6d.jpg) 0 0 repeat;}*/
/*.cat1 .catBox:nth-of-type(even) .box{background: url(../img/bg_ptn6d.jpg) 0 0 repeat;}*/
/*.cat2 .catBox:nth-of-type(odd) .menuTitle{background: url(../img/bg_ptn6e.jpg) 0 0 repeat;}*/
/*.cat2 .catBox:nth-of-type(even) .box{background: url(../img/bg_ptn6e.jpg) 0 0 repeat;}*/
/*.cat3 .catBox:nth-of-type(odd) .menuTitle{background: url(../img/bg_ptn6f.jpg) 0 0 repeat;}*/
/*.cat3 .catBox:nth-of-type(even) .box{background: url(../img/bg_ptn6f.jpg) 0 0 repeat;}*/
/**/

.catMenus li.catBox > *{
  position: relative;
  z-index: 10;
}
.catMenus li.catBox{
  position: relative;
  font-size: 1.3rem;
  background-image:
  url(../img/frm2_T.jpg),
  url(../img/frm2_B.jpg),
  url(../img/frm2_L.jpg),
  url(../img/frm2_R.jpg);
  background-repeat:
  repeat-x,
  repeat-x,
  repeat-y,
  repeat-y;
  background-position:
  center top,
  center bottom,
  left top,
  right top;
  /*margin: 0 auto;*/
  padding: 12px;
}
.catMenus.cat1 li.catBox{box-shadow: 0 0 0px 12px #a227534d inset; }
.catMenus.cat2 li.catBox{box-shadow: 0 0 0px 12px #c975244d inset; }
.catMenus li.catBox .inner{box-shadow: 0 0 5px 0 #000 inset; }
.catMenus li.catBox .menuTitle{
  background-image:
  linear-gradient(to bottom, rgba(255,255,255,0.3) 0%,rgba(140,188,255,0.1) 70%),
  url(../img/bg_ptn01.png);
  background-position: 0 0;

}
.catMenus li.catBox .box{
  background-image:
  url(../img/bg_ptn05.png),
  linear-gradient(to right, rgb(50,0,0) 0%,rgb(126,43,93) 50%,rgb(50,0,0) 100%);
  background-repeat: repeat;
  background-position: 0 0;
}
.catMenus.cat1 li.catBox .box{
  background-image:
  url(../img/bg_ptn05.png),
  linear-gradient(to right, rgb(50,0,0) 0%,rgb(111,61,84) 50%,rgb(50,0,0) 100%);
}
.catMenus.cat2 li.catBox .box{
  background-image:
  url(../img/bg_ptn05.png),
  linear-gradient(to right, rgb(50,50,0) 0%,rgb(111, 84, 61) 50%,rgb(50,50,0) 100%);
}
.catMenus.cat3 li.catBox .box{
  background-image:
  url(../img/bg_ptn05.png),
  linear-gradient(to right, rgb(0,0,50) 0%,rgb(61, 84, 111) 50%,rgb(0,0,50) 100%);
}


@media screen and (min-width: 640px) { /* 640px以上（pct） */
}
@media screen and (min-width: 900px) { /* 900px以上(pc) */
}
@media screen and (min-width: 640px) and (max-width: 899px) { /* 640px - 899px(tb) */
}
@media screen and (min-width: 480px) and (max-width: 639px) { /* 480px - 639px(lp) */
}
@media screen and (max-width: 899px){ /* 899px以下(nepc) */
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
}

@media screen and (max-width: 479px){ /* 479px以下(sp) */
  .catMenus li.catBox{
    background-size: auto;
    padding: 12px;
  }
}
@media screen and (max-width: 399px){ /* 399px以下(sp_s) */
}


.catMenus .menuTitle:after{
  content: '';
  display: block;
  background: rgb(53,44,32);
  background: -moz-linear-gradient(left, rgba(53,44,32,1) 0%, rgba(154,133,94,1) 50%, rgba(53,44,32,1) 100%);
  background: -webkit-linear-gradient(left, rgba(53,44,32,1) 0%,rgba(154,133,94,1) 50%,rgba(53,44,32,1) 100%);
  background: linear-gradient(to right, rgba(53,44,32,1) 0%,rgba(154,133,94,1) 50%,rgba(53,44,32,1) 100%);
  max-width: 860px;
  height: 2px;
  margin: 0 auto;
}
.catMenus li h3{
  line-height: 1.4;
}
.catMenus li h3 a{
  display: block;
  color: #30003F;
}
.catMenus li.on h3 a,
.catMenus li h3 a:hover{
  color: #ff0;
  text-shadow: 0 0 2px #ccf;
}

.catMenus li .cap{
  font-size: 1.8rem;
  line-height: 1.6;
  color: #fff;
}

.catMenus .packNotice{
  width: auto;
}



@media screen and (min-width: 640px) { /* 640px以上（pct） */
  .catMenus li .cap{
    font-size: 1.6rem;
    padding: 4%;
  }
  .catMenus .packNotice{
    padding: 0 20px;

  }
}
@media screen and (min-width: 900px) { /* 900px以上(pc) */
  #catMenu{ width: 840px; }
  .catMenus > ul{
    /*padding: 30px;*/
  }
  .catMenus > ul > li{
    float: left;
  }
  .catMenus .catBoxS{
    width: 396px;
    margin: 0 0 15px 15px;
  }
  .catMenus li .icon{
    margin: 2px 5px 0;
  }
  .catMenus li.catBoxS .icon{margin: 5px 7px 0;}
  .catMenus li h3{
    font-size: 1.95rem;
    padding: 0 4% 0 1%;
  }
  .catMenus li.catBoxS .cap{height: 170px;}
  .catMenus li.catBox .cap{font-size: 1.5rem;}

  .catMenus .catBoxL h3{
    font-size: 3rem;
    padding-right: 14px;
    width: 88%;
  }
  .catMenus .catBoxS h3{
    width: 73%;
  }
  .catMenus .catBoxL{
    width: 808px;
    margin: 0 0 15px 15px;
  }
  .catMenus .catBoxL .cap{
    padding: 14px;
  }
  .catMenus .catBoxL .packNotice{margin-left: 80px;}
  .catMenus .premPrice,
  .catMenus .price{
    padding-right: 4%;
  }
  .catMenus .catBoxL .premPrice,
  .catMenus .catBoxL .price{
    padding-right: 14px;
  }
}
@media screen and (min-width: 640px) and (max-width: 899px) { /* 640px - 899px(tb) */
}
@media screen and (min-width: 480px) and (max-width: 639px) { /* 480px - 639px(lp) */
  .catMenus .title h3{font-size: 2.2rem; }
}
@media screen and (max-width: 899px){ /* 899px以下(nepc) */
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
  .catMenus > ul > li.catBox{margin-bottom: 0;cursor: pointer;}
  .catMenus li .cap{display: none;}
  .catMenus {padding-top: 0;}
  .catMenus .title{margin-bottom: 16px;}
}
@media screen and (max-width: 479px){ /* 479px以下(sp) */
  .catMenus .title h3{font-size: 2.2rem; }
}
@media screen and (max-width: 399px){ /* 399px以下(sp_s) */
  .catMenus .title h3{font-size: 1.8rem; }
}

/*================*/
/*top_start diff*/
/*================*/
/*#newFreeMenu, #newMenu{display: none;}*/
/*#spRecoMenu{display: none;}*/


/*#topCatch{margin-bottom: -55px;}*/
@media screen and (min-width: 900px) { /* 900px以上(pc) */
  /*#topCatch{margin-bottom: -75px;}*/
}
@media screen and (min-width: 480px) and (max-width: 639px) { /* 480px - 639px(lp) */
}
@media screen and (max-width: 899px){ /* 899px以下(nepc) */
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
}
@media screen and (max-width: 479px){ /* 479px以下(sp) */
}

/*================*/
/*.smp_change*/
/*================*/
@media screen and (min-width: 640px) { /* 640px以上（pct） */
  /*#pickupMenuSMP{display: none;}*/
}
@media screen and (max-width: 639px){ /* 639px以下(smp) */
/*#pickupMenu,
#spMenu,
#spFreeMenu,
#spCatch{display: none;}
*/
}