@charset "utf-8";
/*==============================
common
==============================*/

#pcBg {position: fixed;background: url("../images/bg.jpg") no-repeat; background-position: top center; width: 100%;height: 100%;z-index: -1;}
#content {background: #fff; max-width: 600px; margin: 0 auto;}
#l-wrapper img {display:block;}
@media screen and (min-width: 751px) {
#l-wrapper {min-width:750px;}
#content {box-shadow: 6px 0px 5px -5px rgb(28 10 0 / 10%), -6px 0px 5px -5px rgb(28 10 0 / 10%);}
.spOnly { display: none!important;}
}
@media screen and (max-width: 750px) {
.pcOnly { display: none!important;}
}

/*==============================
 section common
==============================*/
.inner {width: 100%;}
.h2unline {text-align: left;padding-bottom: calc(15em / 16);font-size: 2.8rem;border-bottom: 1px solid #bebebe;margin-bottom: calc(30em / 16);}
.bg_clb{background: #faf8f4; }
.bg_clb02{background: #f6f1ea;}
.bg_txb{background: url("../images/bg_txb.jpg"); background-position: top center; width: 100%;height: 100%;background-size: 100% auto;}
.bg_txb02{background: url("../images/about_bg.jpg"); background-position: top center; width: 100%;height: 100%;background-size: 100% auto;}
.bg_blue{background: linear-gradient(92deg, rgba(181, 217, 228, 1), rgba(157, 201, 219, 1));}
.bg_blue02{background: linear-gradient(92deg, rgba(100, 186, 207, 1), rgba(72, 167, 193, 1));}
.bg_blueimg{background: url("../images/bg_ograimg.jpg"); background-position: top center; width: 100%;height: 100%;}
@media screen and (min-width: 751px) {
.inner {max-width: 750px; margin: 0 auto;}
}
@media screen and (max-width: 750px) {
.h2unline {font-size: 2.4rem;}
}

/*==============================
  fv
==============================*/
#fv .fvMain {position: relative;}
#fv .fvMain .fvball{position: absolute;width: 32%;z-index: 1;}
#fv .fvMain .fvball.fvball01{bottom: 3.125%;left: 4%;}
#fv .fvMain .fvball.fvball02{bottom: -2.083%;left: 0;right: 0;margin: 0 auto;}
#fv .fvMain .fvball.fvball03{bottom: 4.166%;right: 4%;}
#fv .fvMain .fvball.fvball01 img {animation: move-y1 1.5s infinite alternate ease-in-out;}
@keyframes move-y1 {
0% { transform: translateY(-4%);}
100% { transform: translateY(4%);}
}
#fv .fvMain .fvball.fvball02 img {animation: move-y2 1.7s infinite alternate ease-in-out;}
@keyframes move-y2 {
0% { transform: translateY(-4%);}
100% { transform: translateY(4%);}
}
#fv .fvMain .fvball.fvball03 img {animation: move-y2 1.6s infinite alternate ease-in-out;}
@keyframes move-y2 {
0% { transform: translateY(-4%);}
100% { transform: translateY(4%);}
}


/*==============================
  fv_cta_induction
==============================*/
#cta_induction.fv_cta .bg_ogra { background:url('../images/fv_cta_bg.png') no-repeat top center / 100%,linear-gradient(90deg, rgba(251,183,99,1) 0%, rgba(239,124,77,1) 100%);}

/*==============================
  p-floating
==============================*/
#floating {position: fixed;bottom: 0;left: 0;right: 0;margin: auto;z-index: 1000;display: none;}
#floating a { position: absolute; z-index: 100; bottom: 0; left: 0; right: 0;width:93.06% ; margin: 0 auto;}
@media screen and (min-width: 751px) {
#floating a {max-width: 600px; margin: 0 auto;}
#floating a img {width:93.06% ; margin: 0 auto;}
}


/*==============================
  cta_induction
==============================*/
#cta_induction .cta_bg {background:url('../images/cta_induction_bg.png') no-repeat top center / 100%;}
#cta_induction .induction_price {position: relative;}
#cta_induction .cta_downarr {position: absolute;width: 17.46%;top:35%;left: 17%;animation: arrow-move 2s infinite ease-in-out;}
@keyframes arrow-move {
  0%, 20%, 50%, 80%, 100% { transform: translateY(0);}
  48% {transform: translateY(-20px);}
  60% {transform: translateY(-15px);}
}
#cta_induction .induction_btn {position: relative;}
#cta_induction .btn_anchor {position: absolute;width: 93.06%;top:0;left: 0;right: 0;margin: 0 auto;}


/*==============================
review
==============================*/
#review{margin: calc(75em/16) 0 0;}
#review .inner {width: 95%;margin: 0 auto;}
#review .reviewWidget_title {padding: calc(20em/16) 0 calc(10em/16);text-align: left;width: auto;font-size: 1.8rem;color: #7c7c7c;}
#review h2 {width: 73.33%; padding: 0 0 calc(60em/16);margin: 0 auto;text-align: center;}
#review .ukomiCode .review-summary-container .starRating span {font-size: 2.8rem;}
#review .ukomiCode .review-summary-container .starRating .reviewNumber {line-height: 1;}
#review .u-komi-sorting-btn-form-data:nth-of-type(5) {display:none!important;}
#review .ukomiReview .singleReview_body p {text-align-last: left;font-size: 16px;line-height: 1.6;}
@media screen and (max-width: 750px) {
#review.reviewWidget_title {margin-top: 0;font-size: 2.4rem;}
}


/*==============================
  point
==============================*/
#point .inner {overflow: hidden;}
.thermoimg {display: flex;}
.thermoimg .img {width: 52.66%;}
.thermoimg .gif {width: 47.33%;}
#point .point02 .answer {position: relative;}
#point .point02 .answer .ballsozai {position: absolute;width: 22.93%;top: 29.45%;left: 2%;}
#point .point02 .answer .ballsozai img {margin-left: -180%;margin-top: -100%;}
#point .point02 .structure {position: relative;overflow: hidden;}
#point .point02 .structure .balltamotsu {position: absolute;width: 26.8%;top: 31.25%;left: 0;right: 0;margin: 0 auto;bottom: 0;}
#point .point02 .structure .balltamotsu img {margin-top: -180%;opacity: 0;}
#point .point02 .point03scene {position: relative;}
#point .point02 .point03scene .balldakara {position: absolute;width: 22.66%;top:-8%;left: 0;right: 0;margin: 0 auto;}

/*==============================
  about
==============================*/
#about .demonsoku{position: relative;}
#about .demonsoku .balldemonsoku {position: absolute;width: 22.93%;top:22.29%;left: 1.5%;}
#about .demonsoku .balldemonsoku img {margin-left: -180%;margin-top: -100%;}
#about .demontest{position: relative;}
#about .demontest .balldemontest {position: absolute;width: 22.93%;top:23.33%;left: 1.5%;}
#about .demontest .balldemontest img {margin-left: -180%;margin-top: -100%;}


/*==============================
  contact
==============================*/
#contact .contactTell {position: relative;}
#contact .contactTell a {position: absolute;width: 50%;margin: 0 auto;top:0;left: 0;right: 0;}
@media screen and (min-width: 751px) { 
#contact a[href*="tel:"] {pointer-events: none;cursor: default;text-decoration: none;}
}



/*==============================
 form
==============================*/
#form .formguid .formguiditem {display: flex;}
#form .formguid .formguiditem .guidsingle,
#form .formguid .formguiditem .guidset {position: relative;}
#form .formguid .formguiditem .guidset .btn,
#form .formguid .formguiditem .guidsingle .btn {position: absolute;width: 71.46%;bottom: 3%;}
#form .formguid .formguiditem .guidset .btn {right: 19%;}
#form .formguid .formguiditem .guidsingle .btn {left: 19%;}
#form .coupon-box {position: initial;}
#form .coupon-box .copy-coupon {position: initial;}
#form .formColor,
#form .formSize {position: relative;}
#form .formColor .radio_content.secount fieldset {top:40.4%;}
#form .formSize .radio_content.secount fieldset {top:33.4%;}
#form .radio_content.type2 fieldset {display: flex;justify-content: space-between;}
#form .formColor label {position: relative;}
#form .formColor label::before {position: absolute;content: "";width:30px;height: 30px;border-radius: 50%;left: 0;right: 0;top:24%;margin: 0 auto;}
#form .formColor label.ColorP::before {background: #cdbebc;}
#form .formColor label.ColorB::before {background: #12061c;}
#form .formColor label.Colorg::before {background: #c2c3c5;}
#form .radio_content.secount fieldset {position: absolute; width: 74.66%;left: 0;right: 0;margin: 0 auto;}
#form .radio_content.secount fieldset .radio-inline__label { width: 32.14%; padding: calc(35em/16) 0 ; border: solid 1px #eaeaea;font-weight: 600;margin: 0;}
#form .formColor .radio_content.secount fieldset .radio-inline__label {padding: calc(50em/16) 0 calc(15em/12) ; }
#form .radio_content.secount fieldset .radio-inline__label:first-of-type {margin-left: 0;}
#form .radio-inline__input:checked + .radio-inline__label {border: solid 2px #442513; background: #442513;}
#form .sizechart .titsizechart{position: relative;}
#form .sizechart .titsizechart:after{content: '';width: 9px;height: 9px;border: 0px;border-top: solid 2px #442513;border-right: solid 2px #442513;-ms-transform: rotate(45deg);-webkit-transform: rotate(135deg);transform: rotate(135deg);position: absolute;top: 50%;right: 16%;margin-top: -8px;}
#form .sizechart .titsizechart.active:after{content: ''; width: 9px;height: 9px;border: 0px;border-top: solid 2px #442513;border-right: solid 2px #442513;-ms-transform: rotate(-45deg);-webkit-transform: rotate(-45deg);transform: rotate(-45deg);position: absolute;top: 50%;right: 16%;margin-top: -3px;}
#form .radio_content.type2.mt_type01,
#form .radio_content.type2.mt_type02 {padding: 0;margin: 0;}
#form .formBtn {position: relative;}
#form .formBtn .buttonCartin {position: absolute;width: 93.06%;top:8%;left: 0;right: 0; margin: 0 auto ;text-align: center;}
#form .itemshingle .formBtn .buttonCartin {top:8%;left: 0;right: 0; margin: 0 auto ;text-align: center;}
#form .formBtn .buttonCartin .btnbox {position: relative;}
#form .formBtn .buttonCartin .btnbox .btnball {position: absolute;width:34.66%; left: 0;right: 0;margin: 0 auto;top: -5%;}
@media all and (max-width: 750px){
#form .formColor .radio_content.secount fieldset .radio-inline__label {padding: calc(50em/14) 0 calc(15em/18) ; }
#form .formColor label::before {top:20%;}
}
/*==============================
 faq
==============================*/
#faq {margin: calc(80em/16) 0 0;}
#faq .inner {width: 90%;margin: 0 auto;}
#faq .faq_contents h2{text-align: center;font-size: 2.8rem;font-weight: 600; padding-bottom: calc(40em/16);/*border-bottom: 1px solid #bebebe;*/letter-spacing: 0.4rem;color: #442513;}
#faq .faq_contents .faq_content{margin-bottom: 5rem;margin: 0 auto;}
#faq .faq_contents .faq_content.faq02,
#faq .faq_contents .faq_content.faq03 {margin-top: calc(60em/16);}
#faq .faq_contents .faq_content h3{font-size: 2rem;font-weight: bold;margin-bottom: calc(20em/16);}
#faq .faq_contents .faq_content .faq_content_block{padding: 0;}
#faq .faq_contents .faq_content .faq_content_block .faq_block{margin-bottom: 1rem;}
#faq .faq_content .faq_content_block .faq_block .faq_txt a {color: #4d3fe1; text-decoration: underline;}
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_tit{text-align: left; border: solid 1px #d6d6d6;margin-bottom: 0rem;font-size: 1.6rem;padding: 1.4rem;border-left: solid 7px #f28e1e;background: #ffffff;border-radius: 4px;position: relative;cursor: pointer;line-height: 1.8;}
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_tit.active,
#faq .faq_contents .faq_content2 .faq_content_block .faq_block .faq_tit.active{
font-weight: bold;color: #f28e1e;border-radius: 4px 4px 0 0;z-index: 10;}
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_tit:after{content: '';width: 9px;height: 9px;border: 0px;border-top: solid 2px #f28e1e;border-right: solid 2px #f28e1e;-ms-transform: rotate(45deg);-webkit-transform: rotate(135deg);transform: rotate(135deg);position: absolute;top: 50%;right: 20px;margin-top: -8px;}
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_tit.active:after{
content: ''; width: 9px;height: 9px;border: 0px;border-top: solid 2px #f28e1e;border-right: solid 2px #f28e1e;-ms-transform: rotate(-45deg);-webkit-transform: rotate(-45deg);transform: rotate(-45deg);position: absolute;top: 50%;right: 20px;margin-top: -3px;}
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_txt{line-height: 1.8;padding: 1.5rem;font-size: 1.6rem; background: #f7f7f7;border: solid 1px #ccc;border-top: none;text-align: left;}
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_txt p .txt_link{display: block;margin-top: 1rem;}
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_txt p .underline{border-bottom: solid 1px #000;}
#faq .faq_contents .faq_content2 .faq_content_block .faq_block .faq_txt .block,
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_txt .block{
margin-top: 1.5rem;border: solid 1px #ccc;background: #fff;padding: 1rem;border-radius: 6px;}
#faq .c_red{color: #ff0000;}
#faq .bold{font-weight:bold;}
#faq .faq_contents .faq_content.block{display: block;}
#faq .ba_img{text-align: center;margin-top: 3rem;display: inline-block;background: #fff;padding: 1.5rem;border: solid 1px #ccc;border-radius: 5px;margin-bottom: 20px;}
#faq .ba_img .flex{display: flex;justify-content: center;}
#faq .ba_img .flex > div {margin: 0 1rem;text-align: center;}
#faq .ba_img .flex > div img{max-width: 15rem;margin-bottom: 0.5rem;}
#faq .ba_img .flex > div p{}

@media all and (max-width: 750px){
#faq .faq_contents .faq_content .faq_content_block {padding: 0rem;}
#faq .faq_contents h2 {text-align: center;font-size: 2.4rem;padding: 1.4rem 0;margin-bottom: 3rem;max-width: 100%;width: 100%;}
#faq .ba_img{text-align: center;margin-top: 3rem;display: inline-block;background: #fff;padding: 3%;border: solid 1px #ccc;border-radius: 5px;}
#faq .ba_img .flex{display: flex;justify-content: center;}
#faq .ba_img .flex > div {margin: 0 1%;text-align: center;width: 48%;}
#faq .ba_img .flex > div img{max-width: 100%;margin-bottom: 0.5rem;}
#faq .ba_img .flex > div p{}
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_tit{padding-right: 4rem;}
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_txt p,
#faq .faq_contents .faq_content .faq_content_block .faq_block .faq_txt{font-size: 1.7rem;}
}

/*==============================
 footer
==============================*/
#footer .inner {width: calc(340 / 375* 100%);margin: 0 auto; }
#footer .cm-f__guide { display: block; padding: calc(120em/48) calc(73em/48); }
#footer .cm-f__guideTitle { margin: 0 0 calc(90em/49); font-size: calc(49em/48); }
#footer .cm-f__guideList { display: block; margin-bottom: calc(-78em/48); }
#footer .cm-f__guideListItem { font-size: calc(37em/48); margin-bottom: calc(78em/48); }
#footer .cm-f__btm {text-align: center; margin-top: calc(114em/48); flex-direction: column-reverse; }
#footer .cm-f__btmContactBlock { text-align: center;}
#footer .cm-f__btmContactBlock:not(:first-of-type) { margin-top: calc(133em/48); }
#footer .cm-f__btmContactBlock .title { font-size: calc(30em/48); }
#footer .cm-f__btmContactBlock .body { display: block; margin-top: calc(37em/48); }
#footer .cm-f__btmContactBlock:nth-of-type(1) .body__tel img, #footer .cm-f__btmContactBlock:nth-of-type(2) .body__tel img {display:inline-block;}
#footer .cm-f__btmContactBlock:nth-of-type(1) .body__tel img { width: calc(626/680*100%); }
#footer .cm-f__btmContactBlock:nth-of-type(2) .body__tel img { width: calc(630/680*100%); }
#footer .cm-f__btmContactBlock .body__txt { margin: calc(55em/22) 0 0; font-size: calc(22em/48); justify-content: center; }
#footer .cm-f__btmContactBtn { margin: calc(45em/16) auto 0; font-size: calc(30em/48); }
#footer .cm-f__btmLogo { margin-top: calc(200em/48); text-align: center; }
#footer .cm-f__btmLogo img { width: calc(296/680*100%);display: inline-block;}
#footer .cm-f__copy { margin: calc(105em/48) 0 0 calc(-35/680*100%); width: calc(750/680*100%); border-top-width: 1px; padding: calc(40em/48) calc(20em/48) 0; }
#footer .cm-f__copy small { font-size: calc(14em/48); }

@media screen and (min-width: 751px) {
#footer .cm-f__guideTitle {font-size: calc(17em / 16);}
#footer .cm-f__guideList { display: flex; justify-content: space-between;flex-wrap: wrap;}
#footer .cm-f__guideListItem {font-size: calc(14em / 16); margin-bottom: calc(22em / 14); }
#footer .cm-f__btmContactBlock:nth-of-type(1) .body__tel img,
#footer .cm-f__btmContactBlock:nth-of-type(2) .body__tel img {width:41.33%;}
#footer .cm-f__btmContactBlock .title {font-size: calc(17em / 16);}
#footer .cm-f__btmContactBlock .body__txt {font-size: calc(17em / 16); margin: calc(25em/22) 0 0;}
#footer .cm-f__btmContactBtn {width: 35%; margin-top: calc(60em / 16);}
#footer .cm-f__btmContactBtn .target {font-size: calc(26em / 16);}
#footer .cm-f__btmContactBtn .txt {font-size: calc(26em / 16); margin-top: calc(12em / 17);}
#footer .cm-f__btmLogo {width: 46.93%;text-align: center;margin: calc(200em/48) auto 0;}
#footer .cm-f__copy {margin-top: calc(105em / 16); padding-top: calc(40em / 16);}
#footer .cm-f__copy small { font-size: calc(14em/16); }
}