@charset "utf-8"; /* CSS Document */ a:hover{text-decoration: none;} p, li, dt, dd{font-size: 100%; line-height: 1.3;} img{width: 100%; height: auto;} /*---------------------------------------------------------------------------- *** mainsection ----------------------------------------------------------------------------*/ #wrap{min-width: 1200px;width: 100%;margin:0 auto;} #leftBox{width: 760px;position:relative; float: left;} .mainSection > .mainSectionInner{margin: 0 auto; padding: 0px 0 0px;} .mainSection .secBox > .sectionInner{max-width: 960px;margin: 0 auto 10px;padding: 20px 20px 20px;background:#fff;border-radius: 10px;overflow: hidden;box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.1);} .mainSection .secBox > .sectionInner .contentsBox{max-width: 100%;margin: 0 auto;} .mainSection .secBox .inSec{width:auto;margin:0 auto;} .mainSection .titleBox{margin: 0 0 20px;} .mainSection .titleBox .ttl-h2{text-align:center;color: #242424;} .mainSection .titleBox .txtTop{font-size:22px; display:block; line-height:1.2; font-weight: bold;} .mainSection .titleBox .txtTop .color{color: #008EA5;} .mainSection .titleBox .txtBottom{font-size:12px; display:block; line-height:1.2;} .mainSection .titleBox .subTtl{text-align:center;font-size:16px;line-height: 1.5;} #asideSec .rightSectionInner > .secBox > .sectionInner{max-width: 190px;margin: 0 auto 20px; background:#fff;border-radius: 10px;overflow: hidden;box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.1);} #asideSec .secBox > .sectionInner .contentsBox{max-width: 100%;margin: 0 auto;width: 100%;} #asideSec .secBox .inSec{width:auto;margin:0 auto;} #asideSec .titleBox{margin: 0 0 10px;} #asideSec .titleBox .ttl-h2{text-align:center; font-weight: bold;} #asideSec .titleBox .txtTop{font-size:16px; display:block; line-height:1.2;} #asideSec .titleBox .txtBottom{font-size:12px; display:block; line-height:1.2;} #asideSec .titleBox .subTtl{text-align:center; font-size:16px;} /* slick */ .mainViewInner .slick-dots li{ position:relative; display:inline-block; width:10px; height:10px; margin:0 5px; padding:0; cursor:pointer;} .mainViewInner .slick-dots li button{ font-size:0; line-height:0; display:block; width:10px; height:10px; padding:5px; cursor:pointer; color:transparent; border:0; outline:none; background:transparent;} .mainViewInner .slick-dots li button:hover, .mainViewInner .slick-dots li button:focus{ outline:none;} .mainViewInner .slick-dots li button:hover:before, .mainViewInner .slick-dots li button:focus:before{ opacity:1;} .mainViewInner .slick-dots li button:before{ font-size:10px; line-height:10px; position:absolute; top:0; left:0; width:10px; height:10px; content:''; border-radius:50%; border:2px solid #000; text-align:center; opacity:.25; color:black; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; box-sizing:border-box;} .mainViewInner .slick-dots li.slick-active button:before{ opacity:.75; color:black; background:#000;} /*ファーストビュー*/ #mainView .mainViewInner{background: url(../img/top/fv_bgi01.jpg) no-repeat top center #fff; background-size: 100%; position: relative;max-width: 960px; height: 290px; border-radius: 10px 10px 0 0; box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.1);} #mainView .mainViewInner .titleBox{width: 355px; margin: 0 auto;} #mainView .mainViewInner .img_left{position: absolute; bottom: 2em; left: 1.5em; width: 210px; height: auto;} /*----- ホットトピックス -----*/ #hotTopicsSec{width:100%;} #hotTopicsSec > .sectionInner{padding: 10px 20px;max-width: 100%;display: flex;flex-wrap: wrap;overflow: initial; position: relative; border-radius: 0 0 10px 10px;} #hotTopicsSec > .sectionInner .titleBox{width:100%;} #hotTopicsSec > .sectionInner .contentsBox{margin: 0 0px 0 0;padding: 0 0px 0 0;} #hotTopicsSec > .sectionInner .contentsBox .contentsBoxInner{width: 580px;margin: 0 0px 0 0;padding: 0 20px 0 0;} #hotTopicsSec > .sectionInner .pickupBox{width: 135px;position: absolute; right: 1em; bottom: 1em;} #hotTopicsSec > .sectionInner .pickupBox p{padding:0;} #hotTopicsSec > .sectionInner .pickupBox img{width:100%; height:auto;} #hotTopicsSec #slickSlideBox{height: 85px;} #hotTopicsSec #slickSlideBox .slick-dotted.slick-slider{margin-bottom:0;} #hotTopicsSec #slickSlideBox .slick-list .slick-slide{} #hotTopicsSec #slickSlideBox .slick-list .slick-slide{position:relative;padding:0 5px;} #hotTopicsSec #slickSlideBox .slick-list .slick-slide:not(.slick-current){opacity:0.5;} #hotTopicsSec #slickSlideBox .slick-dots li button:before{border-color:#333333;} #hotTopicsSec #slickSlideBox .slick-dots li.slick-active button:before{ opacity:.75;} #hotTopicsSec #slickSlideBox .slick-dotted.slick-slider:before{content:"";display:block;width: 40px;height:100%;position:absolute;top:0;left: 0px;z-index: 1;} #hotTopicsSec #slickSlideBox .slick-dotted.slick-slider:after{content:"";display:block;width: 40px;height:100%;position:absolute;top:0;right: 0px;z-index: 1;} #hotTopicsSec #slickSlideBox .pcNone{display:none;} #hotTopicsSec #slickSlideBox .spNone{} #hotTopicsSec .slick-prev:before, #hotTopicsSec .slick-next:before{display:none;} #hotTopicsSec .slick-prev, #hotTopicsSec .slick-next{z-index:2;top:50%;transform: translate(0,-50%);} #hotTopicsSec .slick-prev{left: 5px;background:url("../img/top/ht_slider_arrow_l.png") no-repeat center/cover;} #hotTopicsSec .slick-next{right: 5px;background:url("../img/top/ht_slider_arrow_r.png") no-repeat center/cover;} /*24/7ワークアウトの特徴*/ #featureSec .featureBox{width: 33%;} #featureSec .featureBox .subttl{color: #fff; font-weight: bold; padding: 0.7em 0; line-height: 1.2; font-size: 14px;} #featureSec .menuBox.featureBox .subttl{background: #1E9EBD;} #featureSec .trainerBox.featureBox .subttl{background: #5994E9;} #featureSec .mealBox.featureBox .subttl{background: #876CEB;} #featureSec .featureBox .txtBox{margin: 0.5em auto; font-size: 12px;} #featureSec .featureBox .btnBox a{display: inline-block; border-radius: 50vw; position: relative; color: #333333; padding: 0.5em 0; width: 40%; margin: 0 auto; border: solid 1px #4d4d4d; font-size: 12px;} #featureSec .featureBox .btnBox a::after{content: ""; position: absolute; top: 50%; right: 5px; width: 5px; height: 5px; border-right: 2px solid #aaaaaa; border-top: 2px solid #aaaaaa; transform: translate(-50%, -50%) rotate(45deg);} /*自慢のトレーナー*/ #trainerSec .contentsBox{width: 80%; margin: 0 auto;} #trainerSec .trainerBox{background: #f7f7f7; width: 24%; padding: 0.8em 0;} #trainerSec .trainerBox .img{width: 50%; margin: 0 auto;} #trainerSec .trainerBox .txtBox{font-weight: bold; margin-top: 0.8em; font-size: 13px;} #trainerSec .trainerBox .txtBox span{display: block; font-size: 10px;} #trainerSec .linkBox{gap: 1em; margin-top: 1em;} #trainerSec .linkBox .btnBox{width: 28%;} #trainerSec .linkBox .btnBox a{display: inline-block; border-radius: 50vw; position: relative; color: #333333; padding: 0.5em 0; width: 100%; margin: 0 auto; border: solid 1px #4d4d4d; font-size: 12px;} #trainerSec .linkBox .btnBox a::after{content: ""; position: absolute; top: 50%; right: 5px; width: 5px; height: 5px; border-right: 2px solid #aaaaaa; border-top: 2px solid #aaaaaa; transform: translate(-50%, -50%) rotate(45deg);} /*コース・料金*/ #courseSec .recommen-3plan{position: relative; margin-bottom: 25px;} #courseSec .recommen-3plan-title{background: #0097a7; color: #fff; text-align: center; font-size: 20px; font-weight: 600; padding: 10px;} #courseSec .free-plan-icon-wrap{position: absolute; top: -2rem; right: 3rem;} #courseSec .free-plan-icon{position: relative; background: #fff031; border: 2px solid #0097a7; border-radius: 999px; display: inline-block; width: 6rem; height: 6rem;} #courseSec .free-plan-icon span{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 14px; white-space: nowrap; text-align: center; font-weight: 700; line-height: 1.5;} #courseSec .m-plan{display: flex; flex-wrap: wrap; justify-content: space-between;} #courseSec .m-plan__contents{background-color: #f7f7f7; box-shadow: 2px 2px 2px rgba(0, 0, 0, .2); border-radius: 5px; height: 100%; padding: 20px 15px; text-align: center;} #courseSec .m-plan__heading{border-bottom: 1px solid #c9a67f; margin-bottom: 10px; padding-bottom: 10px;} #courseSec .m-plan__icn{background-color: #fff; border-radius: 100px; color: #f2385f; display: inline-block; font-size: 12px; font-weight: 700; line-height: 1; margin-bottom: 10px; padding: 6px 22px;} #courseSec .m-plan__ttl{font-size: 22px; font-weight: 700; line-height: 1;} #courseSec .m-plan__txt{font-size: 12px; font-weight: 700; line-height: 1.5;} #courseSec .m-plan__txt-price{font-size: 22px; font-family: Roboto, sans-serif;} #courseSec .m-plan__txt-num{font-size: 16px;} #courseSec .m-txt--color{color: #c9a67f;} #courseSec .caption{font-size: 12px;} #courseSec .btnBox{margin-top: 1em;} #courseSec .btnBox a{display: inline-block; border-radius: 50vw; position: relative; color: #333333; padding: 0.5em 0; width: 25%; margin: 0 auto; border: solid 1px #4d4d4d; font-size: 12px;} #courseSec .btnBox a::after{content: ""; position: absolute; top: 50%; right: 5px; width: 5px; height: 5px; border-right: 2px solid #aaaaaa; border-top: 2px solid #aaaaaa; transform: translate(-50%, -50%) rotate(45deg);} /*他のパーソナルジムとの比較*/ #hikakuSec .new-course-top-table-wrap{margin-top: 1.5rem;} #hikakuSec .new-course-top-table-wrap table{width: 100%; text-align: center;} #hikakuSec .new-course-top-table-wrap thead th:first-child{background-color: #ffffff; border-top: none; border-left: 1px solid #ffffff;} #hikakuSec .new-course-top-table-wrap th:nth-child(2){background-color: rgb(238, 57, 95); position: relative; border-right: solid 4px white; border-left: solid 4px white; color: #fff; font-size: 16px} #hikakuSec .new-course-top-table-wrap th:nth-child(2)::before{content: ""; width: 100%; height: 10px; position: absolute; background-color: rgb(238, 57, 95); border-radius: 10px 10px 0 0; left: 0; bottom: 100%;} #hikakuSec .new-course-top-table-wrap th:nth-child(3){background-color: #999999; color: #fff; border-top: none; border-right: solid 1px white;} #hikakuSec .new-course-top-table-wrap th:nth-child(4){background-color: #666666; color: #fff; border-top: none;} #hikakuSec .new-course-top-table-wrap th{font-weight: bold;} #hikakuSec .new-course-top-table-wrap th, .new-course-top-table-wrap td{border-bottom: 1px solid #e5e5e5; padding: 10px; width: 200px; vertical-align: middle; font-size: 12px; line-height: 1.4;} #hikakuSec .new-course-top-table-wrap td:nth-child(2){border: solid 4px rgb(238, 57, 95); border-top: solid 1px #e5e5e5; border-bottom: none; background: #FDF7E5; font-weight: 800; font-size: 16px; line-height: 1.4; word-break: keep-all;} #hikakuSec .new-course-top-table-wrap .caption{font-size: 12px;} #hikakuSec .new-course-top-table-wrap tr:last-child td:nth-child(2){border-bottom: solid 4px rgb(238, 57, 95);} sup{font-size: .5em; vertical-align: super;} /*お申込からご来店までの流れ*/ #flowSec .m-contact-popup-step{margin-left: auto; margin-right: auto; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content;} #flowSec .m-img-txt {display: flex; justify-content: center; align-items: center;} #flowSec .m-img-txt__img {-webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; width: 30%;} #flowSec .m-contact-popup-step__ttl{-webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 10px;} #flowSec .m-img-txt__contents:not(:first-child) {margin-left: 50px; width: 40%;} #flowSec .m-contact-popup-step__ttl-num {margin-right: 12px; color: #c9a67f; font-weight: 700;} #flowSec .m-contact-popup-step__ttl-txt {font-size: 16px; font-weight: 700;} #flowSec .m-txt:not(:first-child) {margin-top: 16px; font-size: 12px} #flowSec .m-list--border > .m-list__item:before {content: "- ";} #flowSec .m-list__item{padding-left: 1em; text-indent: -1em; font-size: 12px} #flowSec .m-contact-popup-step__item:not(:first-child) {margin-top: 15px;} #flowSec .m-contact-popup__txt{color: #c9a67f; font-size: 16px; font-weight: bold;} #flowSec .m-contact-popup__contents {height: 100%; overflow: auto; position: relative; padding: 0 100px 80px 100px; z-index: 2;} #flowSec .m-btn-outer:not(:first-child) {margin-top: 20px;} #flowSec .m-btn-outer {display: flex; flex-wrap: wrap; -webkit-box-pack: center; justify-content: center;} #flowSec .m-btn__txt {top: 2px;} #flowSec .m-btn--l {padding: 20px 35px;} #flowSec .m-btn {align-items: center; border-radius: 100vw; display: inline-flex; font-size: 20px; font-weight: 700; justify-content: center; line-height: 1.5; padding: 10px 30px; position: relative; cursor: pointer; overflow: hidden;} #flowSec a.m-btn--secondary {background-color: #E56E9F; border-color: #E56E9F; color: #fff;} /*お役立ちコラム*/ #columnSec .swiper-container{margin: 0 auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1;} #columnSec .swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;transition-property:transform;transition-property:transform,-webkit-transform;transition-property:transform,-webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box;} #columnSec .swiper-slide {-ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; transition-property: transform, -webkit-transform;} #columnSec .m-column__item {display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; position: relative;} #columnSec .m-column__img {height: 150px;} #columnSec .m-column__img {border-radius: 5px; overflow: hidden; width: 100%;} #columnSec .m-column__img img {height: 150px; -webkit-transition: -webkit-transform .5s cubic-bezier(.785, .135, .15, .86); transition: -webkit-transform .5s cubic-bezier(.785, .135, .15, .86); transition: transform .5s cubic-bezier(.785, .135, .15, .86); transition: transform .5s cubic-bezier(.785, .135, .15, .86), -webkit-transform .5s cubic-bezier(.785, .135, .15, .86);} #columnSec .m-column__img img {border-radius: 5px; width: 100%; -o-object-fit: cover; object-fit: cover; font-family: 'object-fit: cover'; overflow: hidden;} #columnSec .m-column__contents {display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column;} #columnSec .m-column__ttl {font-weight: 700; font-size: 12px;} #columnSec .m-column__tag {color: #999; font-size: 12px; font-weight: 700; margin-top: 16px;} #columnSec .m-column__tag::before {content: "●"; color: #c9a67f; margin-right: .5em;} #columnSec .m-column__contents {margin-top: 16px;} #columnSec .btnBox{margin-top: 1em;} #columnSec .btnBox a{display: inline-block; border-radius: 50vw; position: relative; color: #333333; padding: 0.5em 0; width: 25%; margin: 0 auto; border: solid 1px #4d4d4d; font-size: 12px;} #columnSec .btnBox a::after{content: ""; position: absolute; top: 50%; right: 5px; width: 5px; height: 5px; border-right: 2px solid #aaaaaa; border-top: 2px solid #aaaaaa; transform: translate(-50%, -50%) rotate(45deg);} /*全国90店舗以上！*/ #othersServiceSec .storeSec{padding: 20px 15px; position: relative;} #othersServiceSec .storeSec .txtTop{color: #ED5466; font-size: 13px;} #othersServiceSec .storeSec .txtTop span{font-size: 30px;} #othersServiceSec .storeSec .bg_img{position: absolute; right: 0.3em; top: 2.5em; width: 70px; height: auto; z-index: 1;} #othersServiceSec .storeSec ul{gap: 0.5em; position: relative; z-index: 2;} #othersServiceSec .storeSec li{width: calc(95% / 2); color: #4d4d4d;} #othersServiceSec .storeSec li a{background: #fff; border: solid 1px #4d4d4d; width: 100%; display: block; padding: 0.5em 0; font-weight: bold; font-size: 12px} #othersServiceSec .storeSec .btn a{display: block; width: 100%; color: #fff; font-weight: bold; padding: 0.5em 0 0.5em 1em; margin-top: 0.5em; background: url(../img/common/gnav_contents01.png) no-repeat center left 35px / 15px auto, #0CBAB9; font-size: 16px;} /*バナー*/ #othersServiceSec .bannerSec{padding: 10px 15px;} /*お知らせ*/ #othersServiceSec .newsSec{padding: 20px 15px;} #othersServiceSec .newsSec ul{overflow: auto; height: 300px; border: solid 1px #b3b3b3; scrollbar-width: thin} #othersServiceSec .newsSec ul li{border-bottom: #b3b3b3 1px dashed; padding: 10px 5px;} #othersServiceSec .newsSec ul li dt{font-size: 12px; margin-bottom: 5px;} #othersServiceSec .newsSec ul li.news dt:after {content: "ニュース"; line-height: 1; background: #0CBAB9; color: #fff; text-align: center; padding: 2px 7px; font-size: 70%; margin-left: 5px;} #othersServiceSec .newsSec ul li.media dt:after{content: "メディア"; line-height: 1; background: #F79D43; color: #fff; text-align: center; padding: 2px 7px; font-size: 70%; margin-left: 5px;} #othersServiceSec .newsSec ul li dd{font-size: 12px;} /*オープン情報*/ #othersServiceSec .openSec{padding: 20px 15px 5px;} #othersServiceSec .openSec ul{overflow: auto; height: 300px; border: solid 1px #b3b3b3; scrollbar-width: thin} #othersServiceSec .openSec ul li{border-bottom: #b3b3b3 1px dashed; padding: 10px 5px;} #othersServiceSec .openSec ul li dt{font-size: 12px; margin-bottom: 5px;} #othersServiceSec .openSec ul li.new dt:after {content: "新規OPEN"; line-height: 1; background: #ED5466; color: #fff; text-align: center; padding: 2px 7px; font-size: 70%; margin-left: 5px;} #othersServiceSec .openSec ul li.renew dt:after{content: "リニューアル"; line-height: 1; background: #F79D43; color: #fff; text-align: center; padding: 2px 7px; font-size: 70%; margin-left: 5px;} #othersServiceSec .openSec ul li.transfer dt:after{content: "移転リニューアル"; line-height: 1; background: #0CBAB9; color: #fff; text-align: center; padding: 2px 7px; font-size: 70%; margin-left: 5px;} #othersServiceSec .openSec ul li dd{font-size: 12px;} @media screen and (max-width: 767px) { #leftBox{width: 100%; float: none;} .rightSection{float: none; width: 100%;} /*---------------------------------------------------------------------------- *** mainsection ----------------------------------------------------------------------------*/ #wrap{min-width: 0;width: 100%;margin:0 auto;} .mainSection{max-width: 100%;position:relative;} .mainSection > .mainSectionInner{margin: 0 auto; padding: 0px 0 0px;} .mainSection .secBox > .sectionInner{max-width: 95%;margin: 0 auto 2em;padding: 10% 5% 10%;background:#fff;border-radius: 5px;overflow: hidden;box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.1);} .mainSection .secBox > .sectionInner .secBox > .sectionInner{box-shadow:none;} .mainSection .secBox > .sectionInner .contentsBox{max-width: 100%;margin: 0 auto;} .mainSection .secBox .inSec{width:auto;margin:0 auto;} .mainSection .titleBox{margin: 0 0 1em;} .mainSection .titleBox .ttl-h2{text-align:center;color: #242424; font-size: 250%;} .mainSection .titleBox .txtTop{font-size: 22px;display:block;line-height:1.2;} .mainSection .titleBox .txtBottom{font-size: 14px;display:block;line-height:1.2;} .mainSection .titleBox .subTtl{text-align:center; font-size:100%;} .mainSection .moreBtn{text-align:center; margin:1em 0 0; padding:0;} .mainSection .moreBtn a{border: 1px solid #4d4d4d;color: #4d4d4d;display:inline-block;font-size: 160%;line-height:1;padding: 0.5em 2.5em 0.5em 2em;border-radius:30px;text-decoration:none;background: url(/images/top_230801/arrow_gray_r.png) no-repeat center right 1em / 0.6em auto;} #asideSec .rightSectionInner > .secBox > .sectionInner{max-width: 100%;margin: 0 auto 2em;background:#fff;border-radius: 5px;overflow: hidden;box-shadow: 0px 0px 2px 2px rgba(0,0,0,0.1); width: 95%;} #asideSec .secBox > .sectionInner .contentsBox{max-width: 100%;margin: 0 auto;width: 100%;} #asideSec .secBox .inSec{width:auto;margin:0 auto;} #asideSec .titleBox{margin: 0 0 1em;} #asideSec .titleBox .ttl-h2{text-align:center; position: relative; z-index: 3;} #asideSec .titleBox .txtTop{font-size:24px; display:block; line-height:1.2;} #asideSec .titleBox .txtBottom{font-size:21px; display:block; line-height:1.2;} #asideSec .titleBox .subTtl{text-align:center; font-size:100%;} /* slick */ .mainSection .slick-dots li{position:relative;display:inline-block;width:10px;height:10px;margin: 0 2px;padding:0;cursor:pointer;} .mainSection .slick-dots li button{ font-size:0; line-height:0; display:block; width:10px; height:10px; padding:5px; cursor:pointer; color:transparent; border:0; outline:none; background:transparent;} .mainSection .slick-dots li button:hover, .mainSection .slick-dots li button:focus{ outline:none;} .mainSection .slick-dots li button:hover:before, .mainSection .slick-dots li button:focus:before{ opacity:1;} .mainSection .slick-dots li button:before{ font-size:10px; line-height:10px; position:absolute; top:0; left:0; width:10px; height:10px; content:''; border-radius:50%; border:2px solid #000; text-align:center; opacity:.25; color:black; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; box-sizing:border-box;} .mainSection .slick-dots li.slick-active button:before{ opacity:.75; color:black; background:#000;} /*ファーストビュー*/ #mainView .mainViewInner{background: url(../img/top/fv_bgi01_sp.jpg) no-repeat top center / 100% auto #fff; border-radius: 0; height: auto;} #mainView .mainViewInner .titleBox{width: 58%; padding: 2% 0 4%;} /*フォーム*/ .formLinkBox .formLinkBoxInner{padding: 5% 3%; background: #fff;} .formLinkBox .btnStore{margin-bottom: 2%;} .formLinkBox .btnTrial{margin-right: 1%; width: 49%;} .formLinkBox .btnLine{margin-left: 1%; width: 49%;} .formLinkBox .formTel{margin: 1em auto 0; width: 65%;} /*----- ホットトピックス -----*/ #hotTopicsSec > .sectionInner{padding: 0 3% 10%; border-radius: 0; box-shadow: none;} #hotTopicsSec > .sectionInner .pickupBox{position: relative; width: 100%; right: auto; bottom: auto;} #hotTopicsSec > .sectionInner .contentsBox .contentsBoxInner{width: 100%;} #hotTopicsSec > .sectionInner .pickupBox .mg{margin: 0 2% 2%;} /*24/7ワークアウトの特徴*/ #featureSec .featureBox{width: 100%; margin-bottom: 2em;} #featureSec .featureBox.mealBox{margin-bottom: 0;} #featureSec .contentsBox .dispFlex{display: block;} #featureSec .featureBox .subttl{font-size: 17px;} #featureSec .featureBox .txtBox{font-size: 14px; margin: 1em auto;} #featureSec .featureBox .btnBox a{font-size: 14px;} /*自慢のトレーナー*/ #trainerSec .contentsBox{width: 100%;} #trainerSec .trainerBox{width: 49%; margin-bottom: 2%;} #trainerSec .trainerBox .txtBox{font-size: 17px;} #trainerSec .trainerBox .txtBox span{font-size: 12px;} #trainerSec .linkBox{display: block;} #trainerSec .linkBox .btnBox{width: 55%; margin: auto;} #trainerSec .linkBox .btnBox.trainer{margin-bottom: 0.5em;} #trainerSec .linkBox .btnBox a{font-size: 14px;} /*コース・料金*/ #courseSec .recommen-3plan-title{font-size: 17px;} #courseSec .free-plan-icon-wrap{top: -1.5rem; right: -0.7rem;} #courseSec .free-plan-icon{width: 4.2rem; height: 4.2rem;} #courseSec .free-plan-icon span{font-size: 10px;} #courseSec .m-plan .m-plan__item{width: 100%;} #courseSec .m-plan .m-plan__item:not(:first-child) {margin-top: calc(40 / 750 * 100vw);} #courseSec .m-plan__icn{font-size: 14px;} #courseSec .m-plan__txt{font-size: 14px; width: 85%; margin: auto;} #courseSec .btnBox a{font-size: 14px; width: 60%;} /*他のパーソナルジムとの比較*/ #hikakuSec .new-course-top-txt{text-align: center; line-height: 1; margin: 2rem 0.4rem; font-size: 29px; font-size: 1.2rem;} #hikakuSec .new-course-top-nyukai{margin: auto; justify-content: center; align-items: center; width: 100%; display: flex;} #hikakuSec .new-course-top-nyukai > div {font-size: 22px; font-size: 1.46667rem; text-align: center; font-weight: 700; margin-bottom: 2rem; border-bottom: 1px solid;} #hikakuSec .new-course-top-nyukai span{font-size: 1rem; font-weight: 500;} #hikakuSec .new-course-top-table-wrap{margin-top: 3rem;} #hikakuSec .new-course-top-table-wrap table {width: 100%; text-align: center;} #hikakuSec .new-course-top-table-wrap th, #hikakuSec .new-course-top-table-wrap td {border-bottom: 1px solid #e5e5e5; padding: 10px; width: 200px; vertical-align: middle;} #hikakuSec .new-course-top-table-wrap th {font-weight: bold;} #hikakuSec .new-course-top-table-wrap thead th:first-child {background-color: #ffffff; border-top: none; border-left: 1px solid #ffffff;} #hikakuSec .new-course-top-table-wrap th:nth-child(3) {background-color: #999999; color: #fff; border-top: none; border-right: solid 1px white;} #hikakuSec .new-course-top-table-wrap th:nth-child(4) {background-color: #666666; color: #fff; border-top: none;} #hikakuSec .new-course-top-table-wrap th:nth-child(2) {background-color: rgb(238, 57, 95); position: relative; font-size: 1.5rem; border-right: solid 4px white; border-left: solid 4px white; color: #fff} #hikakuSec .new-course-top-table-wrap th:nth-child(2)::before {content: ""; width: 100%; height: 10px; position: absolute; background-color: rgb(238, 57, 95); border-radius: 10px 10px 0 0; left: 0; bottom: 100%;} #hikakuSec .new-course-top-table-wrap td:nth-child(2) {border: solid 4px rgb(238, 57, 95); border-top: solid 1px #e5e5e5; border-bottom: none; background: #FDF7E5; font-weight: 800; font-size: 1.2rem; word-break: keep-all;} #hikakuSec .new-course-top-table-wrap tr:last-child td:nth-child(2) {border-bottom: solid 4px rgb(238, 57, 95);} #hikakuSec .new-course-top-table-wrap .caption {font-size: 12px; font-size: 14px;} #hikakuSec .br-break-sp {display: none;} #hikakuSec .caption {font-size: 12px; font-size: .8rem;} #hikakuSec .new-course-top-table-wrap th, #hikakuSec .new-course-top-table-wrap td {font-size: 14px;} #hikakuSec .new-course-top-table-wrap td:nth-child(2) {font-size: 17px;} #hikakuSec .new-course-top-table-wrap th:nth-child(2) {font-size: 17px;} #hikakuSec .contentsBox {height: auto; overflow: scroll hidden; } #hikakuSec .new-course-top-table-wrap table {white-space: nowrap;} #hikakuSec .new-course-top-txt {font-size: 14px; font-size: 3.65059vw; line-height: 1.4;} #hikakuSec .new-course-top-nyukai > div {font-size: 4.6vw; font-size: 17px;} #hikakuSec .br-break-sp {display: block;} /*お申込からご来店までの流れ*/ #flowSec .m-contact-popup__contents{padding: 0 calc(30 / 750 * 100vw) calc(120 / 750 * 100vw) calc(30 / 750 * 100vw);} #flowSec .m-contact-popup-step{margin-top: calc(50 / 750 * 100vw);} #flowSec .m-img-txt{flex-wrap: wrap;} #flowSec .m-img-txt__img{-webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; width: 100%;} #flowSec .m-img--spfit{margin-right: 0; margin-left: 0;} #flowSec .m-img picture{display: block;} #flowSec .m-img-txt__contents{margin-top: calc(40 / 750 * 100vw); -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; width: 100%;} #flowSec .m-contact-popup-step__ttl{margin-bottom: calc(8 / 750 * 100vw); display: block;} #flowSec .m-txt:not(:first-child){margin-top: 0; font-size: 14px;} #flowSec .m-contact-popup-step__ttl-num{margin-bottom: calc(6 / 750 * 100vw); font-size: 17px} #flowSec .m-contact-popup-step__ttl-txt{font-size: 17px;} #flowSec .m-img-txt__contents:not(:first-child){margin-left: 0; width: 100%} #flowSec .m-txt:not(:last-child){margin-bottom: calc(30 / 750 * 100vw);} #flowSec .m-contact-popup__txt{font-size: 14px;} #flowSec .m-btn{font-size: 14px;} /*お役立ちコラム*/ #columnSec .m-column{margin-left: calc(-60 / 750 * 100vw); margin-right: calc(-60 / 750 * 100vw);} #columnSec .m-column__slider{overflow: hidden;} #columnSec .m-column__img{height: calc(232 / 750 * 100vw);} #columnSec .m-column__img img{height: calc(232 / 750 * 100vw);} #columnSec .m-column__contents{margin-top: calc(20 / 750 * 100vw);} #columnSec .m-column__ttl{font-size: 14px;} #columnSec .m-column__tag{font-size: 14px; margin-bottom: calc(24 / 750 * 100vw);} #columnSec .btnBox a{font-size: 14px; width: 55%;} /*スライダー*/ .m-slider .swiper-pagination-bullet{height: 12px; width: 12px;} .m-slider .swiper-pagination-bullet:not(:first-child) {margin-left: 4px;} .m-slider .swiper-pagination-bullet:before {height: 4px; width: 4px;} .m-slider .swiper-pagination-fraction {font-size: 11px; font-size: .73333rem} .m-slider__Nav{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;line-height:1;margin-top:10px;position:relative} .m-slider .swiper-button-next, .m-slider .swiper-button-prev{background-image:none;margin:0;left:auto;position:relative;right:auto;height:32px;width:32px} .m-slider .swiper-button-next:before,.m-slider .swiper-button-prev:before{background-image:none;border-top:solid 2px #1a1a1a;border-right:solid 2px #1a1a1a;content:"";display:block;height:6px;left:50%;position:absolute;top:50%;width:6px;z-index:1} .m-slider .swiper-button-prev:before {-webkit-transform: translate(-50%, -50%) rotate(-135deg); -ms-transform: translate(-50%, -50%) rotate(-135deg); transform: translate(-50%, -50%) rotate(-135deg)} .m-slider .swiper-button-next:before {-webkit-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg)} .m-slider .swiper-pagination {position: static; margin: 0 23px} .m-slider .swiper-pagination-bullet{background:0 0;display:inline-block;margin:0;left:auto;opacity:1;position:relative;right:auto;height:22px;vertical-align:middle;width:22px} .m-slider .swiper-pagination-bullet:before{background:#e5e5e5;-webkit-box-sizing:content-box;box-sizing:content-box;border-radius:10px;content:"";display:block;height:7px;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-transition:width .4s ease-out;transition:width .4s ease-out;position:absolute;top:50%;width:7px;z-index:1} .m-slider .swiper-pagination-bullet-active:before {background: #fff; border: 2px solid #c9a67f} .m-slider .swiper-pagination-fraction{color:#999;font-family:Roboto,sans-serif;font-size:12px;font-size:.8rem;font-weight:700;width:auto} .m-slider .swiper-pagination-current{margin-right: .5em} .m-slider .swiper-pagination-total{color: #1a1a1a; margin-left: .5em} /*全国90店舗以上！*/ #othersServiceSec .storeSec{padding: 10% 5% 10%;} #othersServiceSec .storeSec .txtTop{font-size: 26px;} #othersServiceSec .storeSec .txtTop span{font-size: 55px;} #othersServiceSec .storeSec .bg_img{width: 120px;} #othersServiceSec .storeSec li{width: calc(97% / 2);} #othersServiceSec .storeSec li a{font-size: 19px;} #othersServiceSec .storeSec .btn a{font-size: 20px; background: url(../img/common/gnav_contents01.png) no-repeat center left 110px / 15px auto, #0CBAB9;} /*お知らせ*/ #othersServiceSec .newsSec{padding: 10% 5% 10%;} #othersServiceSec .newsSec ul li dt{font-size: 14px;} #othersServiceSec .newsSec ul li dd{font-size: 14px;} /*オープン情報*/ #othersServiceSec .openSec{padding: 10% 5% 0;} #othersServiceSec .openSec ul li dt{font-size: 14px;} #othersServiceSec .openSec ul li dd{font-size: 14px;} }