@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;}
body{background:#f9f8f9}

/*----------------------------------------------------------------------------
***                                                              mainsection
----------------------------------------------------------------------------*/
#wrap{min-width: 1200px;width: 100%;margin:0 auto;}
.mainSection > .mainSectionInner{margin: 0 auto; padding: 0;}
.mainSection .secBox{max-width: 960px;margin: 0 auto 10px;padding: 20px 20px 20px;background:#fff;border-radius: 5px;overflow: hidden;border: 1px solid #e0e0e0;}
.mainSection .secBox > .sectionInner{max-width: 800px; margin: 0 auto;}
.mainSection .secBox > .sectionInner .contentsBox{max-width: 100%;margin: 0 auto;}

.mainSection .titleBox{margin: 0 0 1em;}
.mainSection .titleBox .ttl-h2{text-align:center;}
.mainSection .titleBox .txtTop{font-size: 1.6em;display:block;line-height:1.2;font-weight: bold;}
.mainSection .titleBox .txtTop .color{color: #cb0a4d;}
.mainSection .titleBox .txtTop .enrollColor{color: #5d86d3;}
.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;}

.mainSection .m-btn-outer{list-style:none;padding:0;margin:1em 0 0;text-align:center;}
.mainSection .m-btn-outer__item{display:inline-block;width:100%;max-width:340px;}
.mainSection .m-btn{display:flex;align-items:center;justify-content:center;background-image: linear-gradient(-30deg, #ff884d, #e40b4d);color:#ffffff;text-decoration:none;font-weight:bold;border-radius:50vw;padding:15px 20px;font-size:16px;position:relative;box-sizing:border-box;transition:opacity 0.2s;border: none;}
.mainSection .enroll{background:linear-gradient(-30deg, #4ab7b3, #2f6dcf);}
.mainSection .m-btn:hover{opacity:0.9;}
.mainSection .m-btn::after{content:"";position:absolute;right:25px;top:50%;width:8px;height:8px;border-top:2px solid #ffffff;border-right:2px solid #ffffff;transform:translateY(-50%) rotate(45deg);}

/* breadcrumbArea */
#topSec .topSecInner.sectionInner{max-width: 100%;}
#breadcrumbArea ul li{color: #888; font-weight: bold;}
#breadcrumbArea ul li a{color: #888; padding: 0; background: none;}
#breadcrumbArea ul li a::after{content: "/"; padding: 0 0.3em;}

/* topStoreBox */
#topStoreBox{max-width: 730px; margin: 0 auto; padding-top: 2em;}
#topStoreBox .storeTitleBox{display: flex; align-items: flex-start;}
#topStoreBox .storeTitleBox .storeTitleBoxInner{width: calc(100% - 230px);}
#topStoreBox .storeTitleBox .storeTitleBoxInner .store_txt{font-size: 14px; color: #444; filter: drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff);}
#topStoreBox .storeTitleBox .storeTitleBoxInner .ttl-h2{font-size: 36px; font-weight: bold; color: #131412; margin-top: .2em; filter: drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff);}
#topStoreBox .storeTitleBox .storeTitleBoxInner .open{font-size: 25px;font-weight: bold;color: red;}
#topStoreBox .storeTitleBox .storeTitleBoxInner .shortAccessTxt{font-size: 14px; color: #444; padding: .3em 1em 0 .1em; filter: drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff);}
#topStoreBox .storeTitleBox .fvFormLinkBox{width: 230px; margin: 0; box-shadow: none; border-radius: 0; padding: 0;}
#topStoreBox .storeTitleBox .fvFormLinkBox .ttlBox{margin: 0 0 10px;}
#topStoreBox .storeTitleBox .fvFormLinkBox .ttlBox p{font-weight: bold; color: #444; font-size: 14px; text-align: center;}
.mainSection #topStoreBox .storeTitleBox .fvFormLinkBox .m-btn{background-image: linear-gradient(#ff5e78, #ff5e78);}

#topStoreBox .gymBox{display: flex; align-items: flex-start; justify-content: space-between; margin: 1em 0 0;}
#topStoreBox .gymBox .txtBox{width: 315px;}
#topStoreBox .gymBox .txtBox .ttl{max-width: 310px;}
#topStoreBox .gymBox .txtBox .price{margin: 0.7em 0; width: 330px;}
#topStoreBox .gymBox .txtBox .txt02{font-size: 11px; color: #ff4f72; margin-top: 0.3em;}
#topStoreBox .gymBox .txtBox .img{width: 96px; height: auto; top: 10px; right: 0; position: absolute;}
#topStoreBox .gymBox .imgBox{width: 397px;}
#topStoreBox .gymBox .imgBox .img01{margin-bottom: 0.5em;}

#topStoreBox .fvTxt{font-size: 13px; color: #444; margin: .5em 0 1em;}

#storeInfoBox{max-width: 730px; margin: 0 auto;}
#storeInfoBox .fvBnrBox{margin-bottom: 2em;}
#nvIventSec .sectionInner{width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap;}
.photoBox{padding-bottom: 9em;}

#cb1{width: 410px;}
#cb1 h3{background: #777777; color: #fff; font-weight: bold; font-size: 16px; line-height: 26px; margin-bottom: 0.3em;}
#cb1 dl{display: flex; flex-wrap: wrap;}
#cb1 dl dt{font-size: 14px; font-weight: bold; color: #c80b4d; width: 30%; padding: 1em 0.5em; border-top: solid 1px #cccccc;}
#cb1 dl dd{font-size: 14px; color: #444; width: 70%; padding: 1em 0.5em; border-top: solid 1px #cccccc; }
#cb1 dl dt.address{border-top: none;}
#cb1 dl dd.address{border-top: none;}
#cb1 dl dd.tel a{font-size: 20px; font-weight: bold; display: block;line-height: 1; margin-bottom: 0.1em;}
#cb1 dl dd.tel span{font-size: 12px;}
#cb2{width: 300px;}
#cb2 h3{background: #777777; color: #fff; font-weight: bold; font-size: 16px; line-height: 26px; margin-bottom: 0.3em;}
#cb2 .mapBox iframe{width: 300px; height: 200px;}

/*店舗写真スライド*/
#store_photo_slide{margin:0em 0 -8em; padding:1em 0 0; width:100%;}
#store_photo_slide .sectionInner{padding-bottom: 0; display: block;}
#store_photo_slide .slick-slide{text-align:center; outline:0;}
#store_photo_slide .photo_box{margin:0; display:inline-block; text-align:center; padding:0 5px;}
#store_photo_slide .photo_box .box{display:block; width:410px; height:225px; overflow:hidden; background-image:none; background-position:center center; background-repeat:no-repeat; background-size:cover;}
#store_photo_slide .photo_box .photo{visibility:hidden; width:100%; height: 100%; object-fit: cover; object-position: center;}
#store_photo_slide .slick-next, #store_photo_slide .slick-prev{font-size:10px; top:50%; width:2em; height:2em; z-index:1;}
#store_photo_slide .slick-next:before, #store_photo_slide .slick-prev:before{display:none;}
#store_photo_slide .slick-prev{left:-1%;}
#store_photo_slide .slick-next{right:-1%;}


/*navBox*/
#navBox .navList{display: flex; flex-wrap: nowrap; justify-content: space-between;}
#navBox .navList li{width: calc(100% / 4);}
#navBox .navList li:not(:last-child){border-right: 1px solid #ccc;}
#navBox .navList li a{transition: .2s all ease-in-out; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: space-between; align-items: center; background: #fff; padding: 5px .5em; width: 100%; height: 100%; min-height: 75px; font-size: 13px; font-weight: 700; color: #444; text-decoration: none;}
#navBox .navList li .txt{line-height: 1; padding: 0 0 1em 0; font-size: 15px; color: #444;}
#navBox .navList a:after{content: ""; transition: .2s all ease-in-out; display: inline-block; width: 1em; height: 1em; background: transparent; border-bottom: 3px solid #ccc; border-right: 3px solid #ccc; transform: rotate(45deg); color: #fff; padding: 0; line-height: 1; text-align: center; font-size: 10px;}
#navBox .navList a .txt:before{content: ""; display: block; width: 65px; height: 65px; margin: 0 auto 0.5em auto;}
#navBox .navList .nav01 a .txt:before{background: url(/fit/assets/2026/img/gym/store/ico_nav01.png) no-repeat center / 100% auto;}
#navBox .navList .nav02 a .txt:before{background: url(/fit/assets/2026/img/gym/store/ico_nav02.png) no-repeat center / 100% auto;}
#navBox .navList .nav03 a .txt:before{background: url(/fit/assets/2026/img/gym/store/ico_nav03.png) no-repeat center / 100% auto;}
#navBox .navList .nav04 a .txt:before{background: url(/fit/assets/2026/img/gym/store/ico_nav04.png) no-repeat center / 100% auto;}

/*24/7FITの特徴*/
.mainSection .secBox#featureSec > .sectionInner .contentsBox{padding-top: 0;}
#featureSec .featureBox{width: 31%;}
#featureSec .featureBox .subttl{color: #fff;font-weight: bold;padding: 0.7em 0;line-height: 1.2;font-size: 0.9em;min-height: 4em;display: flex;justify-content: center;align-items: center;}
#featureSec .box01.featureBox{margin-right: 2%;margin-bottom: 1em;}
#featureSec .box02.featureBox{margin-right: 2%;margin-bottom: 1em;}
#featureSec .box03.featureBox{margin-bottom: 1em;}
#featureSec .box04.featureBox{margin-right: 2%;}
#featureSec .box05.featureBox{}

#featureSec .box01.featureBox .subttl{background: #ec0461;}
#featureSec .box02.featureBox .subttl{background: #f14363;}
#featureSec .box03.featureBox .subttl{background: #f65857;}
#featureSec .box04.featureBox .subttl{background: #fa8252;}
#featureSec .box05.featureBox .subttl{background: #ffac4d;}
#featureSec .featureBox .txtBox{margin: 0.5em auto;font-size: 0.8em;line-height: 1.4;}
#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);}    

/*コース・料金*/
#courseSec .titleBox{text-align:center;margin-bottom:1em;}
#courseSec .ttl-h2{margin:0;}
.mainSection .secBox#courseSec > .sectionInner .contentsBox{padding: 0 0 1em;}
#courseSec .topTxtBox{background-color: #ffe1e3;padding:1em;text-align:center;margin-bottom:0.5em;}
#courseSec .topTxt{color: #cb0a4d;font-size:1.5em;font-weight:bold;margin:0;letter-spacing:0.03em;}
#courseSec .planBox{background: #ffffe3; padding: 2em 3em; font-size: 90%;}
#courseSec .planBox.bgBlue{background: #e5f6ff;}
#courseSec .planBox.bgPurple{background: #eee5ff;}
#courseSec .planBox.bgGreen{background: #e4ffe6;}
#courseSec .planBox .planDt{font-size: 234%; font-weight: bold; margin-bottom: 0.25em;}
#courseSec .planBox .planDd{margin-top: 0.25em;}
#courseSec .planBox .price{width: 50%;}
#courseSec .planBox .price .subTxt {background-color: #fff;border: solid 2px #c80b4d;border-radius: 1em;text-align: center;color: #c80b4d;padding: 0.2em 1em;font-weight: 500;}
#courseSec .price .priceTxt{font-size: 240%; font-weight: bold; text-align: center;}
#courseSec .planBox .price .priceTxt .num{font-size: 200%; color: #c80b4d; font-weight: 900;}
#courseSec .planBox .price .tax{text-align: center; font-weight: bold;font-size: 130%;}
#courseSec .discountBox {width: 100%;}
#courseSec .discountDl{border: 2px solid #c80b4d;padding: 0.5em 0.75em 1em 1em;border-radius: 0.5em;width: 48%;}
#courseSec .discountDt{font-size: 150%;font-weight: bold;}
#courseSec .discountDt .subTxt{font-size: 60%;}
#courseSec .discountBox .price{font-size: 50%;width: auto;}
#courseSec .discountBox .price .tax{font-size: 160%;}
#courseSec .komeTxt{color: #888;font-size: 75%; margin-top: 1em;}

/*お申込からご来店までの流れ*/
#flowSec .sectionInner{max-width:1000px;box-sizing:border-box;}
#flowSec .titleBox{text-align:center;}
#flowSec .ttl-h2{margin:0;/* color: #cb0a4d; */}
#flowSec .flowOl{list-style:none;padding: 0 3em;margin: 0 0 2em 0;display:flex;}
#flowSec .flowLi{display:flex;flex-direction: column;justify-content: center;align-items: center;margin: 0 0 0.5em;padding: 1em;border: 2px solid #ccc;border-radius: 1em;box-shadow: 0.3em 0.3em 0px 0 #ccc;width: 32%;}
#flowSec .flowLi .step{font-size: 150%; font-weight: bold;}
#flowSec .flowLi .img{width: 90%; max-width: 110px;}

/*web入会*/
#enrollSec .sectionInner{max-width:1000px;box-sizing:border-box;}
#enrollSec .titleBox{text-align:center;}
#enrollSec .ttl-h2{margin:0;/* color: #cb0a4d; */}
#enrollSec .enrollOl{list-style:none;padding: 0 3em;margin: 0 0 2em 0;display:flex;}
#enrollSec .enrollLi{display:flex;flex-direction: column;justify-content: center;align-items: center;margin: 0 0 0.5em;padding: 1em;border: 2px solid #ccc;border-radius: 1em;box-shadow: 0.3em 0.3em 0px 0 #ccc;width: 32%;}
#enrollSec .enrollLi .step{font-size: 150%; font-weight: bold;}
#enrollSec .enrollLi .img{width: 90%; max-width: 110px;}

/*安心、充実の設備・環境*/
#facilitiesSec{}
#facilitiesSec .facilitiesUl{width: 620px;margin: 0 auto 1em;justify-content: center;}
#facilitiesSec .facilitiesLi{border: 2px solid #ccc;border-radius: 0.5em;width: 22.5%;padding: 0.8em 1em 1em;margin-bottom: 0.8em;margin-right: 0.8em;}
#facilitiesSec .facilitiesLi .img{max-width: 80px; margin: 0 auto;}
#facilitiesSec .facilitiesLi .txt{font-size: 80%;text-align: center;}

@media screen and (max-width: 767px) {
	#wrap{min-width: 0;width: 100%;margin:0 auto;}
	.mainSection .secBox{padding: 0; box-shadow: none; max-width: 100%; border-radius: 0; margin: 0; border: none;}
	.mainSection .secBox>.sectionInner{padding: 2em 2.5%; margin-bottom: 0; box-shadow: none; max-width: 95%;}
    .mainSection .titleBox{margin: 0 0 1em;}
    .mainSection .titleBox .ttl-h2{text-align:center; font-size: 250%;}
    .mainSection .titleBox .txtTop{font-size: 0.6em;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 .m-btn-outer__item{max-width:290px;}
    .mainSection .m-btn{padding: 1em 1.2em;font-size: 1em;}
    .mainSection .m-btn::after{right:20px;width:7px;height:7px;}

	/* breadcrumbArea */
	#topSec .topSecInner.sectionInner{}
	#breadcrumbArea{display: block; width: 100%; padding: 0.3em 2.5% 0.3em; position: relative; background:#f9f8f9;}
	
	/* topStoreBox */
	#topStoreBox{max-width: 100%; padding: 0;}
	#topStoreBox .storeTitleBox{display: block;}
	#topStoreBox .storeTitleBox .storeTitleBoxInner{width: 100%;}
	#topStoreBox .gymBox{}
	#topStoreBox .gymBox .txtBox{width: 100%; position: relative; display: flex;}
    #topStoreBox .gymBox .txtBox .ttl{width: 60%;max-width: none;}
	#topStoreBox .gymBox .txtBox .txt02{width: 40%; margin: auto 0 0 1%;}
	#topStoreBox .gymBox .txtBox .fvBg{position: absolute;top: -8vw;right: -8vw; width: 50%;}
	#topStoreBox .gymBox .txtBox .img{}


	
	#topStoreBox .formLinkBox{width: 95%; margin: 1.5em auto 0;}
	#topStoreBox .formLinkBox .fvFormLinkBoxInner{gap: 1em;}

	#storeInfoBox{display: flex;flex-direction: column;}
    .storeBnrSec{order: 2;}
	.photoBox{order: 1; padding-bottom: initial;}
	.fvFormLink{order: 3;}
	#nvIventSec{order: 4;}

	#storeInfoBox .fvBnrBox{margin-bottom: 1.5em;}
	.fvFormLink .fvFormLinkBoxInner{justify-content: space-around;margin-bottom: 1.5em;}
	.fvFormLink .fmBtn{}
	.fvFormLink .telBtn{width: 50%;}
	.mainSection .fvFormLink .m-btn{font-size: 66%;padding-right: 3em;}

	#cb1{width: 100%;}
	#cb2{width: 100%;}
	#cb2 .mapBox iframe{width: 100%;}
	#store_photo_slide{padding: 0em 0 1em; margin: 0;}
	#nvIventSec .sectionInner{padding-bottom: 0;}
	
	/*---- 店舗写真スライド ----*/
	#store_photo_slide{width:100%; order:1;padding-bottom: 0.7em;}
	#store_photo_slide .slick-slide{padding:0 .5em; outline:0;}
	#store_photo_slide #photo_slide{;}
	#store_photo_slide #photo_slide .slick-dotted.slick-slider{margin-bottom:.5em;}
	#store_photo_slide .photo_box{margin:0; padding:0; display:inline-block; text-align:center;}
	#store_photo_slide .photo_box .box{display:block; width:175px; height:120px;; overflow:hidden; background-image:none; background-position:center center; background-repeat:no-repeat; background-size:cover;}
	#store_photo_slide .photo_box .photo{visibility:hidden; width:60vmin;}
	#store_photo_slide .slick-next,.slick-prev{font-size:10px; width:2em; height:2em; z-index:1;}
	#store_photo_slide .slick-next:before,.slick-prev:before{display:none;}
	#store_photo_slide .slick-prev{left:calc(50vw - 117px);}
	#store_photo_slide .slick-next{right:calc(50vw - 117px);}

	/* slick */
	#store_photo_slide .slick-dots{bottom:5%;}
	#store_photo_slide .slick-dots li{font-size:.6rem; position:relative; display:inline-block; width:1em; height:1em; margin:0 .2em; padding:0; cursor:pointer;}
	#store_photo_slide .slick-dots li button{font-size:100%; line-height:0; display:block; width:1em; height:1em; padding:0; cursor:pointer; color:transparent; border:0; outline:none; background:transparent;}
	#store_photo_slide .slick-dots li button:hover,#store_photo_slide .slick-dots li button:focus{outline:none;}
	#store_photo_slide .slick-dots li button:hover:before,#store_photo_slide .slick-dots li button:focus:before{opacity:1;}
	#store_photo_slide .slick-dots li button:before{font-size:100%; line-height:1; position:absolute; top:0; left:0; width:1em; height:1em; content:''; border-radius:50%; border:2px solid #fff; text-align:center; opacity:.25; color:#fff; background:#fff; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; box-sizing:border-box;}
	#store_photo_slide .slick-dots li.slick-active button:before{opacity:1; color:#fff; background:#fff; border:2px solid #fff;}
	
	/* navBox */
	#navBox{background: #fafafa;}
	#navBox .navList li a{background: none; padding: 0 .5em;}
	#navBox .navList li .txt{font-size: 12px; line-height: 1; text-align: center; padding: 0 0 0.1em 0;}
	#navBox .navList a .txt:before{margin: auto; width: 60px; height: 60px;}
	#navBox .navBoxInner{padding: 1em 0;}
	
    /*24/7FITの特徴*/
    #featureSec .featureBox{width: 100%; margin-bottom: 2em;} 
    #featureSec .contentsBox .dispFlex{display: block;}
    #featureSec .featureBox .subttl{font-size: 1.1em;min-height: 2.5em;}
    #featureSec .featureBox .txtBox{font-size: 0.95em;margin: 1em auto;}
    #featureSec .featureBox .btnBox a{font-size: 14px;}
    #featureSec .box01.featureBox{margin-right: 0;}
    #featureSec .box02.featureBox{margin-right: 0;}
    #featureSec .box04.featureBox{margin-right: 0;}
    #featureSec .box05.featureBox{}

    /*コース・料金*/
    #courseSec .titleBox{margin-bottom:1.5em;}
    #courseSec .topTxtBox{padding:0.8em;}
    #courseSec .topTxt{font-size:1.2em;}
    #courseSec .planBox{padding: 1em 2em;flex-wrap: wrap; font-size: 85%;}
    #courseSec .planBox .planDl{width: 100%;}
    #courseSec .planBox .planDt{text-align: center;font-size: 200%;}
    #courseSec .planBox .price{margin: 1em auto 0;width: auto;}
    #courseSec .planBox .price .subTxt{font-size: 85%;}
    #courseSec .planBox .price .priceTxt{font-size: 180%;}
    #courseSec .discountBox {display:block;}
    #courseSec .discountDl{width:100%; margin-bottom:0.5em;}
    #courseSec .discountBox .price{margin: 0 auto;}

    /*お申込からご来店までの流れ*/
    #flowSec .flowOl{margin-bottom: 1em;padding: 0;flex-wrap: wrap;}
    #flowSec .flowLi{width: 100%;flex-direction: row;justify-content: space-between;border-radius: 0.8em;padding: 0.5em 0.8em;margin-bottom: 0.8em;}
    #flowSec .flowLi .img{width: 6em;margin-right: 1em;}
    #flowSec .flowLi .txt{width: calc(100% - 7em);text-align: left;}

    #flowSec .txt{font-size: 0.95em;color:#444;line-height:1.5;}
    #flowSec .m-btn-outer__item{max-width:290px;}
    #flowSec .m-btn{padding: 1em 1.2em;font-size: 1em;}
    #flowSec .m-btn::after{right:20px;width:7px;height:7px;}

    /*web入会*/
    #enrollSec .enrollOl{margin-bottom: 1em;padding: 0;flex-wrap: wrap;}
    #enrollSec .enrollLi{width: 100%;flex-direction: row;justify-content: space-between;border-radius: 0.8em;padding: 0.5em 0.8em;margin-bottom: 0.8em;}
    #enrollSec .enrollLi .img{width: 6em;margin-right: 1em;}
    #enrollSec .enrollLi .txt{width: calc(100% - 7em);text-align: left;}

    #enrollSec .txt{font-size: 0.95em;color:#444;line-height:1.5;}
    #enrollSec .m-btn-outer__item{max-width:290px;}
    #enrollSec .m-btn{padding: 1em 1.2em;font-size: 1em;}
    #enrollSec .m-btn::after{right:20px;width:7px;height:7px;}
	
    /*安心、充実の設備・環境*/
    #facilitiesSec .facilitiesUl{width: 100%; justify-content: center;}
    #facilitiesSec .facilitiesLi{width: 32.5%;margin: 0 1% 0.3em 0;padding: 0.5em 0.25em;}
    #facilitiesSec .facilitiesLi:nth-child(3n){margin-right: 0;}
    #facilitiesSec .facilitiesLi .img{width: 60%;}
    #facilitiesSec .facilitiesLi .txt{font-size: 70%;}
	
}