@charset "UTF-8";


.index11{
  font-family: "游ゴシック", YuGothic, "Noto Sans JP", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  letter-spacing: 0;
}
.index11 img{
/*  width:100%;*/
  max-width:100%;
}
.index11 h2 img{
  width:auto;
}
.index11 a:hover img,
.index11 button:hover img{
  opacity:.8;
}
.pc-on {
  display: block !important;
}
.sp-on {
  display: none !important;
}

@media only screen and (max-width: 960px){
  .hdr_box{
    height:63px !important;
  }
  .pc-on {
    display: none !important;
  }
  .sp-on {
    display: block !important;
  }
}
@media only screen and (max-width: 750px){
  #block-sns ul li .sp-on {
    display: none !important;
  }
}
/* .cta
==============================================*/
.index11 .cta{
  background:url(../../../img/usr/lp/index11/menu_bg_sp.png) no-repeat right top;
  background-size:100% auto;
}
.index11 .cta .menu08{
  border:2px solid #1e7fb8;
  margin:min(5.3vw, 40px) 3.2vw 0;
  border-radius:16px;
  background:#fff;
  border-radius:16px;
  padding-bottom:1em;
}
.index11 .cta .menu08 h3{
  background: #1e7fb8;
  padding:0;
  text-align:center;
  position:relative;
  border-radius:14px 14px 0 0;
}
.index11 .cta .menu08 h3 img{
  margin:0 auto;
}
.index11 .cta .menu16{
  border:2px solid #e4603c;
  margin:min(5.3vw, 40px) 3.2vw;
  border-radius:16px;
  background:#fff;
  padding-bottom:1em;
}
.index11 .cta .menu16 h3{
  background: #e4603c;
  padding:0;
  text-align:center;
  position:relative;
  border-radius:14px 14px 0 0;
}
.index11 .cta .menu16 h3 img{
  margin:0 auto;
}
.index11 .cta .menu08 h3 img.baloon,
.index11 .cta .menu16 h3 img.baloon{
  position:absolute;
  top:-10px;
  left:8.4%;
  width:15.2%;
}
.index11 .cta .number-area{
  padding:min(5.3vw, 40px) min(5.3vw, 40px) min(2.65vw, 20px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.index11 .cta .number-area .img{
  width:100%;

  font-size:2.3vw;
  text-align:center;
}
.index11 .cta .number-area .price_lp{
  position:relative;
}
.index11 .cta .number-area .price_lp p{
  position:absolute;
  text-align:right;
  font-size:14px;
  font-weight:normal;
  right:0;
  top:33%;
}
.index11 .cta .number-area .img img{
  margin-bottom:0.5em;
}
.index11 .cta .number-area .txt p{
  font-size:4vw;
  font-weight:bold;
  margin-bottom:0.2em;
}
.index11 .cta .number-area .txt p .cost{
  font-size:8vw;
  color:#b71b2c;
  font-weight:bold;
}
.index11 .cta .number-area .txt p .cost span{
  font-size:4.6vw;
  font-weight:bold;
}
.index11 .cta .number-area .txt p .tax{
  font-size:2.7vw;
  font-weight:normal;
}
.index11 .cta .number-area .txt p.postage{
  font-weight:normal;
  background:#eee;
  text-align:center;
  margin-bottom:0.5em;
}
.index11 .cta .menu16 .number-area .txt p.postage{
  background:#b71b2c;
  color:#fff;
}
.index11 .cta .number-area .txt p.postatt{
  font-weight:normal;
  background:#eee;
  text-align:center;
  margin-bottom:0.5em;
  padding:5px 0;
  font-size:16px;
}
.index11 .cta .menu16 .number-area .txt p.postatt{
  background:#b71b2c;
  color:#fff;
  padding:5px 0;
  font-size:16px;
}
@media only screen and (max-width: 960px){
 .index11 .cta .number-area .txt p.postatt{
   background:#eee;
   margin-bottom:0.5em;
   padding:0.6em 0;
   font-size:3.3vw;
 }
 .index11 .cta .menu16 .number-area .txt p.postatt{
   background:#b71b2c;
   color:#fff;
   padding:0.6em 0;
   font-size:3.3vw;
 }
  .index11 .cta .number-area .price_lp p{
    display:none;
  }
}
.index11 .cta .number-area .txt .cart_table{
  width:100%;
  border-top:1px solid #b5b5b5;
  margin:0 !important;
}
.index11 .cta .number-area .txt .cart_table th,
.index11 .cta .number-area .txt .cart_table td{
  padding-top:1em;
  font-size:4vw;
}
.index11 .cta .number-area .txt .cart_table td select{
  width: calc(100% - 1em);
  height:1.6em;
}
.index11 .cta button{
  border:0;
  background:#fff;
  width:100%;
  cursor:pointer;  
}
.index11 .cta a.goformbtn{
  display:block;
  text-align:center;
  padding:0 min(5.3vw, 40px);
}
.index11 .cta a.goformbtn img{
  width:100%;
  margin:0 auto;
}
.index11 .cta button img{
  width:calc(100% - min(10.6vw, 80px));
}
.index11 .cta p{
  font-size:18px;
  font-weight:bold;
  text-align:center;
  margin-bottom:0;
}
.index11 .cta p.att{
  font-size:14px;
  font-weight:normal;
  margin:1em 0 0;
}
.index11 .cta .set{
  margin: 0 20px min(2.65vw, 20px);
  background:#EEEEEE;
  position:relative;
  text-align:center;
  font-size:18px;
  font-weight:bold;
}
.index11 .cta .set::after{
  content:"▼";
  position:absolute;
  right:2em;
  top:0.5em;
}
.index11 .cta .set.no::after{
  content:"▲";
}
.index11 .cta .set .setBtn{
  position:relative;
  cursor:pointer;
  font-weight:bold;
  padding:10px;
}
.index11 .cta .set .setBtn .ico{
  position:absolute;
  right:min(2.65vw, 20px);
  width:6.16%;
  top:50%;
  transform: translateY(-50%);
  -webkit- transform: translateY(-50%);
}
.index11 .cta .set .setBtn .ico.no{
  display:none;
}
.index11 .cta .set .toggle{
  display:none;
  background:#fff;
}
.index11 .cta .set ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap:20px 0 ;
  padding: min(2.6vw, 20px) 0 0;
}
.index11 .cta .set ul li{
  width:49%;
}
.index11 .cta .set ul li a{
  color:#000;
  text-decoration:none;
  font-size: 2vw;
}
.index11 .cta .set ul li a img{
  margin-bottom:0.5em;
}
.index11 .cta .set ul li a span{
  font-weight:bold;
}
.index11 .cta .set .toggle p{
  font-size: 2vw;
  font-weight:bold;
  margin-top:min(2.65vw, 20px);
}
.index11 .cta .telBox{
  background:url(../../../img/usr/lp/index11/bg_contact.jpg);
  padding:min(5.3vw, 40px);
}
.index11 .cta .telBox .tel{
  position:relative;
  width:100%;
  margin:0 auto 4.0em;
}
.index11 .cta .telBox .tel span{
  position:absolute;
  display:block;
  width:100%;
  left:4.2em;
  top:11.0em;
  font-size:2.2vw;
  font-weight:bold;
  text-align:left;
}
.index11 .cta .telBox .fax{
  position:relative;
  width:88%;
  margin:min(2.65vw, 20px) auto 0;
}
.index11 .cta .telBox .fax span{
  position:absolute;
  display:block;
  width:58%;
  right:0;
  bottom:0.5em;
  font-size:2.2vw;
  font-weight:bold;
  text-align:left;
}
.index11 .cta .telBox .fax span a{
  font-weight:bold;
}
.index11 .cta .cta-btn{
  margin:0 20px;
  display:block;
}
.index11 .cta .cta-btn img{
  max-width:100%;
}

@media only screen and (min-width: 961px){
  .index11 .cta{
    background:url(../../../img/usr/lp/index11/menu_bg.png) no-repeat left top;
    background-size:auto auto;
    padding:0;
  }
  .index11 .cta .menu{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    max-width:960px;
    margin:0 auto;
    padding:0 10px 40px;
  }
  .index11 .cta h2{
    width:100%;
  }
  .index11 .cta h2 img{
    width:auto;
  }
  .index11 .cta .menu08,
  .index11 .cta .menu16{
    width:48.5%;
    margin:30px 0 0;
  }
  .index11 .cta .number-area .img{
    width: 160px;
    margin-right: 18px;
    font-size: 12px;
  }
  .index11 .cta .number-area .price_lp{
    width: calc(100% - 180px);
  }
  .index11 .cta .number-area{
    padding:20px;
  }
  .index11 .cta .number-area .txt p{
    font-size:20px;
    line-height: 1.2;
  }
  .index11 .cta .number-area .txt p .cost{
    font-size:44px;
  }
  .index11 .cta .number-area .txt p .cost span{
    font-size:24px;
  }
  .index11 .cta .number-area .txt p .tax{
    font-size:14px;
  }
  .index11 .cta .number-area .txt .cart_table th,
  .index11 .cta .number-area .txt .cart_table td{
    font-size:20px;
  }
  .index11 .cta button img {
      width: calc(100% - 40px);
  }
  .index11 .cta a.goformbtn{
    padding:0 20px;
  }

  .index11 .cta .set ul li a,
  .index11 .cta .set ul li span,
  .index11 .cta .set .toggle p{
    font-size:15px;
  }
  .index11 .cta .set .toggle p{
    margin-top:0;
  }
  .list_even{
    margin-left:0;
  }
  .index11 .cta .telBox{
    width:100%;
    margin:0 auto;
    background:url(../../../img/usr/lp/index11/bg_contact.jpg);
    padding:40px 0 60px;
  }
  .index11 .cta .telBox .inner{
    width:800px;
    margin:0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .index11 .cta .telBox .inner>a{
    width:420px;
  }
  .index11 .cta .telBox .tel{
    width:420px;
    margin: 0;
  }
  .index11 .cta .telBox .tel span {
    font-size: 12px;
    width: 100%;
    left: 15px;
    top: 115px;
  }
  .index11 .cta .telBox .fax{
    width:360px;
    margin: 0;
  }
  .index11 .cta .fax img{
    width:320px;
  }
  .index11 .cta .telBox .fax span {
    font-size: 12px;
    width: 60%;
    bottom: 0;
  }

}
/* .index11_01
==============================================*/

@media only screen and (min-width: 961px){
  .index11_01{
    background:url(../../../img/usr/lp/index11/osusume_bg01.jpg) no-repeat center top;
    background-size:100% auto;
  }
  .index11_01 .inner{
    background:url(../../../img/usr/lp/index11/osusume_bg02.png) no-repeat center bottom;
    background-size:100% auto;
    padding:0 0 100px;
  }
  .index11_01 h2 img{
    width:auto;
    margin:0 auto 100px;
  }
  .index11_01 .inner>.pc-on{
    max-width:960px;
    width:calc(100% - 20px);
    margin:0 auto;
  }
}
/* .index11_02
==============================================*/
.index11_02 h2{
  position:relative;
  z-index:2;
}
.index11_02 h2 img{
  width:100%;
}
.index11_02 .point01{
  margin-top:-2.2vw;
}
.index11_02 .point01,
.index11_02 .point02,
.index11_02 .point03{
  position:relative;
}
.index11_02 p{
  font-size:3.8vw;
  width:calc(100% - min(22vw, 200px));
  position:absolute;
  left:min(11vw, 100px);
  top:100vw;
}
.index11_02 .point01 p{
  top:102vw;
}
.index11_02 p strong{
  font-weight:bold;
  color:#b71b2c;
}
@media only screen and (min-width: 961px){
  .index11_02{
    background:url(../../../img/usr/lp/index11/point_bg.jpg) ;
    background-size:100% auto;
    padding:0 0 60px;
  }
  .index11_02>.pc-on{
    width:890px;
    margin:50px auto 0;
  }
  .index11_02 .point01{
    margin-top:0;
  }
  .index11_02 p{
    font-size:18px;
    width:40%;
    left:40px;
  }
  .index11_02 .point01 p{
    top:200px;
  }
  .index11_02 .point02 p{
    top:260px;
  }
  .index11_02 .point03 p{
    top:215px;
  }
}

/* .index11_03
==============================================*/
.index11_03{
  background:url(../../../img/usr/lp/index11/voice_bg02_sp.jpg) no-repeat center bottom;
  background-size:100% auto;
  padding-bottom:5.3vw;
}
.index11_03 .voice{
  margin:4.8vw 4.8vw 0;
  border:3px solid #1e7fb8;
  border-radius:0.8em;
  background:url(../../../img/usr/lp/index11/bg_contact.jpg);
  font-size:4vw;
}
.index11_03 .voice p{
  font-size:3.8vw;
  line-height:1.6;
  margin-bottom:0;
}
.index11_03 .voice p strong{
  font-weight:bold;
  color:#b71b2c;
}
.index11_03 .voice .inner{
  padding:3.65vw 4.6vw;
}
.index11_03 .voice01 .inner{
  background:url(../../../img/usr/lp/index11/voice_img01_sp.png) no-repeat right bottom;
  background-size:50% auto;
}
.index11_03 .voice02 .inner{
  background:url(../../../img/usr/lp/index11/voice_img02_sp.png) no-repeat right 7vw bottom;
  background-size:42% auto;
}
.index11_03 .voice03 .inner{
  background:url(../../../img/usr/lp/index11/voice_img03_sp.png) no-repeat right bottom;
  background-size:60% auto;
}

@media only screen and (min-width: 961px){
  .index11_03{
    background:#cae3ff url(../../../img/usr/lp/index11/voice_bg02.jpg) no-repeat center bottom;
    background-size:100% auto;
    padding-bottom:0;
  }
  .index11_03>.inner{
    background:url(../../../img/usr/lp/index11/voice_bg01.png) no-repeat center top;
    background-size:auto 446px;
    padding-bottom:60px;
  }
  .index11_03 h2 img{
    width:auto;
  }
  .index11_03 .voice{
    max-width:860px;
    width:calc(100% - 20px);
    margin:35px auto 0;
    font-size:20px;
  }
  .index11_03 .voice .inner {
    padding: 35px;
  }
  .index11_03 .voice01{
    margin:200px auto 0;
  }
  .index11_03 .voice01 .inner{
    background:url(../../../img/usr/lp/index11/voice_img01.png) no-repeat right center;
    background-size:auto auto;
  }
  .index11_03 .voice02 .inner{
    background:url(../../../img/usr/lp/index11/voice_img02.png) no-repeat left center;
    background-size:auto auto;
  }
  .index11_03 .voice03 .inner{
    background:url(../../../img/usr/lp/index11/voice_img03.png) no-repeat right bottom;
    background-size:auto auto;
  }
  .index11_03 .voice p{
    font-size:20px;
    width:580px;
    box-sizing: content-box;
  }
  .index11_03 .voice02 p{
    padding-left:226px;
  }

}

/* .index11_04
==============================================*/
.index11_04 .txt{
  position:relative;
}
.index11_04 .txt p{
  position:absolute;
  width:90.4vw;
  background:#fff;
  padding:4.8vw 0;
  box-sizing:border-box;
  bottom:4.8vw;
  text-align:center;
  font-size:3.2vw;
  left: 50%;
  transform: translateX(-50%);
  -webkit- transform: translateX(-50%);
}
@media only screen and (min-width: 961px){
  .index11_04{
    background:url(../../../img/usr/lp/index11/kodawari_bg.png) no-repeat center center;
    background-size:cover;
  }
  .index11_04 h2{
    overflow:hidden;
    height:266px;
    width:100%;
    position:relative;
  }
  .index11_04 h2 img{
    width:1455px;
    max-width:1455px;
    position:absolute;
    top:0;
    left: 50%;
    transform: translateX(-50%);
    -webkit- transform: translateX(-50%);
  }
  .index11_04>.pc-on{
    max-width:980px;
    width:calc(100% - 20px);
    margin:20px auto 0;
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    gap:40px;
  }
  .index11_04>.pc-on>img{
    width:min(100% , 960px);
  }
  .index11_04 .txt{
    width:100%;
    position:relative;
    height:1060px;
  }
  .index11_04 .txt>img{
    width:960px;
    margin:0 auto;
  }
  .index11_04 .txt p{
    font-size:17px;
    width:654px;
    padding:20px 0;
    bottom:60px;

  }

}

/* .index11_05
==============================================*/
.index11_05{
  background:#f7f7ee;
  padding-bottom: 10vw;
}
.index11_05 .tit{
  width:78.13vw;
  margin:0 auto 20px;
}
.index11_05 a{
  margin: 5vw 10vw 0;
  display:block;
}
.index11_05 .menu{
  margin:0 3.2vw 20px;
}
.index11_05 .menu li{
  width:100%;
}
.index11_05 .menu li img{
  margin:0 auto;
}
.index11_05 .menu .slick-arrow{
  width:4.7vw;
  position:absolute;
  top:28%;
  z-index:10;
  cursor:pointer;
}
.index11_05 .menu .slick-arrow:hover{
  opacity:.8;
}
.index11_05 .menu .slick-arrow:first-of-type{
  left:-3.2vw
}
.index11_05 .menu .slick-arrow:last-of-type{
  right:-3.2vw
}
@media only screen and (min-width: 961px){
  .index11_05{
    padding-bottom: 60px;
  }
  .index11_05>.pc-on{
    width:960px;
    margin:0 auto;
  }
  .index11_05>.pc-on.tit{
    width:min(68.42%, 609px);
    margin:0 auto 40px;
  }
  .index11_05 a{
    width:420px;
    margin: 0 auto;
    display:block;
  }
  .index11_05 .menu{
    max-width:890px;
    margin:0 auto 40px;
  }
  .index11_05 .menu li{
    padding:0 15px;
    box-sizing:content-box;
  }
  .index11_05 .menu .slick-arrow{
    width:33px;
    position:absolute;
    top:28%;
  }
  .index11_05 .menu .slick-arrow:first-of-type{
    left:0;
  }
  .index11_05 .menu .slick-arrow:last-of-type{
    right:0;
  }
}

/* .index11_06
==============================================*/
.index11_06 .tokuten{
  position:relative;
}
.index11_06 .tokuten p{
  position:absolute;
  width:60vw;
  left:10vw;
  font-size:3.2vw;
  top:16.26vw;
}
.index11_06 .tokuten p span{
  font-size:6.4vw;
  font-weight:bold;
  display:block;
  line-height:1.25;
}
.index11_06 .tokuten p span strong{
  font-weight:bold;
  color:#b71b2c;
}
.index11_06 .tokuten.tokuten03 p span{
  font-size:5.7vw;
}
.index11_06 .tokuten p span.read{
  font-size:3.2vw;
  display:block;
  margin-bottom:0.5em;
}
.index11_06 .tokuten p.att{
  width:80%;
  left:10%;
  text-align:right;
  font-size:2.4vw;
  top:auto;
  bottom:1.5em;
}

@media only screen and (min-width: 961px){
  .index11_06{
    background:url(../../../img/usr/lp/index11/tokuten_bg.jpg) no-repeat center center;
    background-size:cover;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0 20px;
    padding:0 0 60px;
  }
  .index11_06 h2{
    width:100%;
    margin-bottom:15px;
  }
  .index11_06 h2 img{
    width:auto;
  }
  .index11_06 .tokuten{
    width:270px;
  }
  .index11_06 .tokuten p{
    width:calc(100% - 30px);
    left:15px;
    font-size:18px;
    top:86px;
  }
  .index11_06 .tokuten p span,
  .index11_06 .tokuten.tokuten03 p span{
    font-size:30px;
    text-align:center;
    margin-bottom:0.5em;
  }
  .index11_06 .tokuten p span.read{
    font-size:15px;
  }
  .index11_06 .tokuten p.att{
    width:80%;
    left:10%;
    text-align:right;
    font-size:13px;
    top:auto;
    bottom:0.8em;
  }
}

/* .index11a
==============================================*/
/* 3つの特典
----------------------------------------------*/
.index11a_01{
  background:url(../../../img/usr/lp/index11a/tokuten_bg_sp.png) no-repeat center center;
  background-size:cover;
}
.index11a_01.index11a_03{
  background:url(../../../img/usr/lp/index11a/tokuten_bg02_sp.png) no-repeat center center;
  background-size:cover;
}
.index11a_01 .inner{
  padding:40px 0;
  margin:0 3.2vw;
}
.index11a_01 .inner .tit{
  width:70vw;
  margin:0 auto 20px;
}
.index11a_01.index11a_03 .inner .tit{
  margin:0 auto 20px;
}
.index11a_01 .inner .img{
  width:100%;
  margin:0 auto 20px;
}
.index11a_01 .inner .img2{
  width:100%;
  margin:0 0 20px 2.5vw;
}
.index11a_01 .inner .txt{
  width:100%;
  margin:0 auto;
}
@media only screen and (min-width: 961px){
  .index11a_01{
    background:url(../../../img/usr/lp/index11a/tokuten_bg.png) no-repeat center center;
    background-size:cover;
  }
  .index11a_01.index11a_03{
    background:url(../../../img/usr/lp/index11a/tokuten_bg02.png) no-repeat center center;
    background-size:cover;
  }
  .index11a_01 .inner{
    max-width:890px;
    margin:0 auto;
    padding:80px 0;
  }
  .index11a_01 .inner .tit{
    width:min(60% , 536px);
    margin:0 auto 20px;
  }
  .index11a_01.index11a_03 .inner .tit{
    margin:0 auto 40px;
  }
  .index11a_01 .inner .img{
    width:min(57.3% , 510px);
    margin:0 auto 40px;
  }
  .index11a_01 .inner .img2{
    width:min(80.34% , 715px);
    margin:0 auto 20px;
  }
  .index11a_01 .inner .txt{
    width:min(57.8% , 515px);
    margin:0 auto;
  }
}

/* 15周年
----------------------------------------------*/
.index11a_02{
  background:url(../../../img/usr/lp/index11a/anniv_bg_sp.png) no-repeat center center;
  background-size:cover;
}
.index11a_02 .inner{
  padding:40px 0;
  margin:0 3.2vw;
}
.index11a_02 .inner .tit{
  width:70vw;
  margin:0 auto 10px;
}
.index11a_02 .inner .img{
  width:50vw;
  margin:0 auto 10px;
}
.index11a_02 .inner .txt{
  width:90%;
  margin:0 auto;
}
@media only screen and (min-width: 961px){
  .index11a_02{
    background:url(../../../img/usr/lp/index11a/anniv_bg.png) no-repeat center center;
    background-size:cover;
  }
  .index11a_02 .inner{
    max-width:890px;
    margin:0 auto;
    padding:60px 0;
  }
  .index11a_02 .inner .tit{
    width:min(47.42% , 422px);
    margin:0 auto 20px;
  }
  .index11a_02 .inner .img{
    width:min(27.75% , 247px);
    margin:0 auto 20px;
  }
  .index11a_02 .inner .txt{
    width:min(57.8% , 514px);
    margin:0 auto;
  }


}


@media only screen and (max-width: 960px) {
  /* 1. 隙間の原因になっているhdr_boxの高さをゼロにする */
  .hdr_box {
    height: 0px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 2. FV（ファーストビュー）自体の上の余白も念のためゼロにする */
  #hanpukai_ti {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
}