@charset "utf-8";
/*==============================
common
==============================*/

section img {display: block;}
#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;}
@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;}
}
@media screen and (max-width: 750px) {
.pcOnly { display: none;}
}

/*==============================
 section common
==============================*/
.bg_clb{background: #faf8f4; }
.bg_txb{background: url("../images/bg_txb.jpg"); background-position: top center; width: 100%;height: 100%;background-size: 100% auto;}
.bg_blueimg{background: url("../images/bg_blueimg.jpg"); background-position: top center; width: 100%;height: 100%;background-size: cover;}
.bg_whiteimg{background: url("../images/bg_whiteimg.jpg") repeat-y; background-position: top center; width: 100%;height: 100%;}
.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);}
@media screen and (min-width: 751px) {
.inner {max-width: 750px; margin: 0 auto;}
}
@media screen and (max-width: 750px) {
.h2unline {font-size: 2.4rem;}
}


/*==============================
  p-floating
==============================*/
#floating {position: fixed;width: 90%;bottom: 0;left: 0;right: 0;margin: auto;z-index: 1000;display: none;}
#floating a {}

@media screen and (min-width: 751px) {
#floating {max-width: 550px;}
}
@media screen and (max-width: 750px) {
}


/*==============================
  header
==============================*/
#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%);}
}

/*==============================
  cta_induction
==============================*/
#cta_induction .induction_price {position: relative;}
#cta_induction.fv_cta .cta_downarr {position: absolute;width: 19.46%;top:55%;left: 16%;animation: arrow-move 2s infinite ease-in-out;}
#cta_induction .cta_downarr {position: absolute;width: 17.46%;top:49%;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;}


/*==============================
  ukomiStar
==============================*/
#ukomiStar .inner {width: 95%;margin: auto;}
#ukomiStar h2 {width: 73.33%; padding: calc(100em/16) 0 calc(50em/16);margin: 0 auto;text-align: center;}
#ukomiStar .reviewWidget_title {padding: calc(20em/16) 0 calc(10em/16);text-align: left;width: auto;font-size: 1.8rem;color: #7c7c7c;}
#ukomiStar .ukomiLink {width: 33.33%;margin: calc(50em/16) auto 0;}
#ukomiStar .ukomiLink a {}
#ukomiStar .ukomiCode .review-summary-container .starRating span {font-size: 2.8rem;}
#ukomiStar .ukomiCode .review-summary-container .starRating .reviewNumber {line-height: 1;}
#ukomiStar .u-komi-sorting-btn-form-data:nth-of-type(5) {display:none!important;}
#ukomiStar .ukomiReview .singleReview_body p {text-align-last: left;font-size: 16px;line-height: 1.6;}
@media screen and (max-width: 750px) {
#ukomiStar.reviewWidget_title {margin-top: 0;font-size: 2.4rem;}
}


/*==============================
  point
==============================*/
#point {background: url("../images/point_bg.jpg") repeat-y;background-size: 100% auto;}
#point .point02 .structure {position: relative;overflow: hidden;}
#point .point02 .structure .ball {position: absolute;width: 26.8%;top: 41.25%;left: 0;right: 0;margin: 0 auto;bottom: 0;}
#point .point02 .structure .ball img {margin-top: -180%;opacity: 0;}



/*==============================
  coupon
==============================*/
#coupon .copy-coupon {width: 81.33%;top:48.33%;left: 0;right: 0;margin: 0 auto;}

/*==============================
  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;}
}


/*==============================
 ukomiGallery
==============================*/
#ukomiGallery {margin: calc(75em/16) 0 0;}
#ukomiGallery .inner {width: 94%;margin: 0 auto;}
@media screen and (max-width: 750px) {
}


/*==============================
 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:42.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:13%;left: 0;right: 0; margin: 0 auto ;text-align: center;}
#form .itemshingle .formBtn .buttonCartin {top:18%;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 {padding: calc(80em/16) 0 0;background: #fff;;}
#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 { 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%); }
#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); }
}