@charset "utf-8";
/* CSS Document */

/*共通カラー*/
:root{--white:#ffffff;--title-green:#599602;--titleback-green:#8cc63f;--background-green:#f1f5e2;--title-black:#555555;--fover-red:#ff0000;}

/*フォントサイズ*/
body h1{font-size:34px;}body h2{font-size:28px;}body h3{font-size:32px;}body p{font-size:100%}
@media(width <= 767px){body h1{font-size:24px;}body h2{font-size:24px;}}@media(width <= 420px){body h2{font-size:20px;}body h3{font-size:24px;}}

@media(width <= 990px){main{padding-top:14vw;}}

/*下に緑線の共通タイトル*/
.under-green-title :is(h1,h2){color:var(--title-black);text-align:center;line-height:1.3333;position:relative;padding-bottom:30px;padding-top:10px;margin-bottom:30px;}
.under-green-title :is(h1,h2)::before{background-color:var(--titleback-green);content:"";width:160px;height:4px;position:absolute;bottom:0;left:calc(50% - 80px);box-sizing:border-box;}

/*同タイトルの右イメージ画像*/
.title-right-img{margin-right: -40px;width: calc(50vw + 90px);height: 320px;position: relative;}
.title-right-img::before{background: linear-gradient(-90deg, rgba(255, 255, 255, 0), white);left: 0;content: "";width: 120px;height: 100%;position: absolute;top: 0;}
.title-right-img img{width:100%;max-width:calc(800px + 90px);height:100%;object-fit:cover;vertical-align:middle;}
@media(width <= 1300px){.title-right-img{width:50%;}}
@media(width <= 990px){.title-right-img{margin:0 auto;width:calc(50vw + 90px);height:calc(20vw + 20px);}}

/*グリーン背景文字白の共通タイトル*/
.green-title{width:100%;}
.green-title h2{margin: 60px auto 20px;border: 4px solid var(--titleback-green);border-radius: 30px;background-color:var(--titleback-green);color:var(--white);line-height: 54px;text-align: center;max-width: 640px;height: 60px;}
@media(width <= 990px){.green-title h2{margin: 20px auto 10px;}}@media(width <= 767px){.green-title h2{margin: 20px auto 10px;}}
.green-title h3{text-align:center;color:var(--title-black);}

/**===お知らせ===**/
/*===イベント情報===*/
#top-event{width: 100%;background-color:var(--white);padding:20px 10px 0px;text-align-last: center;}
.oshirase {
	border: 1px solid #86bc42;
	padding: 1vw;
	background-color: #ffffff;
	max-width: 1280px;
	margin: 0 auto;
}
.oshirase img {
	width: 100%;
	padding-bottom: 1vw;
}
/*お知らせ一覧ボタン*/
#top-event .news-button,#full-movie {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    outline: none;
    font-weight: bold;
    cursor: pointer;
    padding: 10px 20px;
} {
  display: inline-block;
  text-align: center;
  text-decoration: none;
  outline: none;
  font-weight: bold;
  cursor: pointer;
  padding: 10px 20px;
}
#top-event .news-button span,#full-movie span {
	color: #fff;
}#top-event .news-button span:hover,#full-movie span:hover {
	color: #86bc42
}
a.news-button::before,
a.news-button::after,
#full-movie::before,
#full-movie::after{
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
a.news-button,
a.news-button::before,
a.news-button::after,
#full-movie,
#full-movie::before,
#full-movie::after{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}
a.news-button,
#full-movie{
  position: relative;
  z-index: 2;
  border: 2px solid #86bc42;
  color: #fff;
  line-height: 30px;
}
a.news-button:hover,#full-movie:hover {
  background-color: #fff;
  border-color: #86bc42;
  color: #86bc42;
}
a.news-button a:hover,#full-movie:hover {
  color: #86bc42;
}
a.news-button::before,
a.news-button::after,
#full-movie::before,
#full-movie::after{
  top: 0;
  width: 50%;
  height: 100%;
  background: #86bc42;
}
a.news-button::before,#full-movie::before {
  right: 0;
}
a.news-button::after,#full-movie::after {
  left: 0;
}
a.news-button:hover::before,
a.news-button:hover::after,
#full-movie:hover::before,
#full-movie:hover::after{
  width: 0;
}

/**===お問い合わせボタン===**/
:is(.mail-button,.line-button) {margin-top: 60px;display: flex;justify-content: center;}
:is(.mail-button,.line-button) a{max-width: 360px;width: 360px;margin: 0 10px;border: 1px solid #333;background-color:var(--white);font-size: 1.125rem;font-weight: 700;display: flex;align-items: center;justify-content: center;height: 70px;transition: .3s;appearance: none;}
:is(.mail-button,.line-button) a:hover{background:#ffbbbb;}
.mail-button p{background: url("../images/mail-img.svg") no-repeat;}
.line-button p {background: url("../images/line-img.svg") no-repeat;}
:is(.mail-button,.line-button) p{background-size:25px;background-position:left center;padding:10px 0 10px 45px;}


/*===ローディング画面 表示非表示===*/
#loading{width:100vw;height:100vh;transition:all 1s;background-color:var(--white);/* 以下のコードを追加 */position: fixed;top: 0;left: 0;z-index: 9999;}
.loaded{opacity: 0;visibility: hidden;}
/*===ページトップボタン===*/
#pageTop{position:fixed;right:20px;bottom:20px;cursor:pointer;z-index:9999;}
#pageTop img{width:80px;height:65px;}
#pageTop img:hover{opacity:0.5;}
/*お問い合わせリンク*/
#side-mail-form{position:fixed;bottom:20px;left:-10;z-index:990;}
#side-mail-form a{cursor:pointer;}
#side-mail-form img:hover{opacity:0.5;}
#close-mail-form {position: absolute;-webkit-border-radius:50%;border-radius:50%;right:-11px;top:-25px;width:50px;}
#mail-btn{width:230px;}
/*===ヘッダーPC===*/
/*htmlへヘッダー読み込みタグ*/
#header-menu{width:100%;}
#header-nav a:hover{color:var(--fover-red);}
/*header.html内の実際のタグ*/
#header-nav{/*はじめの高さを設定*/width:100%;height:80px;background-color:var(--white);}
/*PC画面メニュー*/
#nav-pc {width:100%;height:80px;overflow: hidden;text-decoration:none;justify-content:space-between;display:flex;flex-wrap:nowrap;}
#nav-pc .header-logo {display:flex;align-items:center;}
#nav-pc .logo-title{width:120px;align-items:center;height:100%;display:flex;}
#nav-pc .logo-coment{padding-left:10px;text-align:left;color:#555;height:100%;align-items:center;display:flex;}
#nav-pc .menu-pc{justify-content:flex-end;display:flex;}
#nav-pc .menu-pc-items {/*font-size: 1.2vw;*/color:#555;padding-right:1vw;align-items:center;display:flex;height:100%;}
#nav-pc .invoice-pc{height:60px;}
@media(width >= 1200px){#header-nav{padding:0 40px;}}
/*PC画面時　bootstrapのcol-lg&col-md*/
@media(width >= 991px){#header-inner{display:none;}#sandwich_menu{display:none;}#nav-sf{display:none;}}
/*HeightMinというクラス名がついたら高さを小さく、上部固定に*/
/*タブレット＆スマホ画面*/
@media screen and (width <= 990px){#header-menu{height:14vw;position:fixed;z-index:999;}#nav-pc{display:none;}#nav-sf{display:none;}#header-nav {height:14vw;overflow:hidden;display:flex;flex-wrap:nowrap;padding:0 1px;}#header-inner{width:84%;left:0;display:flex;vertical-align:top;ext-align:left;}#header-inner .logo-title{width:calc(100% / 10 * 3);padding:1vw 0 0;}#header-inner .logo-coment {width:calc(100% / 10 * 7);font-size:3vw;padding:2vw 0 0 1vw;}#sandwich_menu{justify-content:flex-end;position:relative;width:16%;height:14vw;top:-2.2vw;right:0;}#sandwich_menu:hover{cursor:pointer;}}
/*HeightMinというクラス名がついたら高さを小さく、上部固定に*/
@media(width <= 767px){#header-inner .logo-coment{padding:3vw 0 0 1vw;}}
@media(width <= 300px) {#header-inner .logo-title{padding: 2vw 0 0 0.5vw;}#header-inner .logo-coment{display: none;}#sandwich_menu{width: 34%;}}

/*サンドウィッチメニューアイコン*/
#nav_toggle-title{display: block;position: absolute;vertical-align: text-top;width: 70%;height: 100%;top: 2vw;left: 0%;}
#nav_toggle-title p{display: block;margin-top: 30%;/*font-weight: bold;*//*font-size: 3vw;*/}
#nav_toggle{display: block;width: 50%;height:100%;position:absolute;top:40%;right:0%;z-index:1000;}
#nav_toggle div{position: relative;}
#nav_toggle span{display: block;height:3px;background:#555;position:absolute;width:100%;right:10px;-webkit-transition: 0.5s ease-in-out;-moz-transition: 0.5s ease-in-out;transition: 0.5s ease-in-out;}
#nav_toggle span:nth-child(1){top:0px;}
#nav_toggle span:nth-child(2){top:3vw;}
#nav_toggle span:nth-child(3){top:6vw;}
/*==サンドウィッチメニュー開閉ボタンopen時==*/
.open #nav_toggle{top: 50%;}
.open #nav_toggle span:nth-child(1){top: 12px;-webkit-transform: rotate(135deg);-moz-transform: rotate(135deg);transform: rotate(135deg);}
.open #nav_toggle span:nth-child(2){width: 0;left: 40%;}
.open #nav_toggle span:nth-child(3){top: 12px;-webkit-transform: rotate(-135deg);-moz-transform: rotate(-135deg);transform: rotate(-135deg);}
#nav-sf{position: absolute;z-index: 999;top: 14vw;width: 100%;background-color: rgba(255,255,255,1.0);left: 0;padding: 6vw 1vw 1vw 1vw;border-bottom: #ff0000 solid 2px;/*font-size: 6vw;*/line-height: 10vw;}
#nav-sf ul li.tel-sf p{line-height: 5.5vw;/*font-size: 4vw;*/color: #ff0000;/*font-weight: bold;*/}
#nav-sf ul li.tel-sf p.tel-number{background: url("../images/tel-img.png") no-repeat;/*font-size: 6vw;*/background-size: 5vw;background-position: left;vertical-align: middle;padding-left: 6vw;}
#nav-sf ul.main-menu{margin: 0;}
#nav-sf ul.main-menu li{border-top: 1px solid rgba(181,189,204,0.5);}
#nav-sf ul.main-menu li , #nav-pc ul.main-menu_s li,#nav-sf div.ko_midashi2{border-bottom: 1px solid rgba(181,189,204,0.5);/*font-size: 20px;*/}
#nav-sf div.ko_midashi a,#nav-sf div.ko_midashi2 a{display: block;color: #333;background: url("https://kuraka-g.com/assets/images/click03.svg") no-repeat 20px center;background-size: 20px 20px;padding: 20px 10px;background-color: #F4FFFA;}
#nav-sf div.ko_midashi a:hover, h2.midashi:hover, #nav-pc ul.main-menu_s a:hover,#nav-sf div.ko_midashi2 a:hover{background-color: #FFEEF2;cursor: pointer;}
#nav-sf div.ko_midashi span,#nav-sf div.ko_midashi2 span{display:block;padding-left:44px;color:#333;}
#nav-sf h2.midashi span, #nav-pc ul.main-menu_s span,#nav-sf div.ko_midashi2 span{display:block;padding-left:34px;color:#333;/*font-size: 4vw;*//*font-weight: 400;*/}
#nav-sf .main-menu li h2, #nav-pc ul.main-menu_s li a{display:block;color:#333;padding:20px 10px;}
#nav-sf a span:hover{color:#ff0000;}
#nav-sf h2.midashi{background: url("https://kuraka-g.com/assets/images/click01.svg") no-repeat 10px center;background-size:20px 20px;}
#nav-sf h2.midashi2{background: url("https://kuraka-g.com/assets/images/click02.svg") no-repeat 10px center;background-size:20px 20px;background-color:#FFEEF2;}
#nav-sf ul.main-menu_s a{background: url("https://kuraka-g.com/assets/images/click03.svg") no-repeat 10px center;background-size:20px 20px;}
#nav-sf ul.sf-under {margin:1vw 0;}
#nav-sf ul li.invoice-sf img{max-width:480px;width:60%;margin:1vw auto;}
/*スリックスライダー*/
.slider4-wrap{width:100%;margin:0 auto;position:relative;}
.slider-4 .slick-slide {height:100%;overflow:hidden;}
.slider-4 .slick-slide img{display:block;width:100%;height:100%;object-fit:cover;}
.dots-4 .slick-dots{text-align:left;}
.dots-4 .slick-dots ul{list-style: none;}
.dots-4 .slick-dots li {display: nline-block;color:#fff;}
.dots-4 .slick-dots button{display: block;width:10px;height:10px;margin:6px;font-size:0;padding:0;border:0;outline:none;cursor:pointer;background:#f1f5e2;border-radius:50%;}
.dots-4 .slick-dots .slick-active button{background:#007e34;text-decoration:none;}
/*トップメニュー*/
#top-menu{width:86%;margin:4vw auto;display:flex;flex-wrap:wrap;}
#top-menu div{width: calc(100%/7);}
.menu-banner{margin: 1vw 0;}
.menu-banner h4{color: #fff;}
.menu-banner a{width: 90%;display:block;text-align:center;padding:0.5vw 0 0.1vw;border-radius:6px;background-repeat:no-repeat;background-position:100% 0;background-size:200% auto;background-image: linear-gradient(to right,#8cc63f 0%,#8cc63f 50%,#599602 50%,#599602 100%);box-shadow:0 3px 10px rgb(0 0 0 / 16%);transition:background-position ease 0.4s;text-align:center;color:#fff;text-decoration:none;/*font-weight: bold;*//*font-size: 1vw;*/}
.menu-banner a:hover{background-position: 0 0;}
.menu-banner img{width: 30%;}
@media(991px <= width <= 1199px){#top-menu{width: 90%;argin:4vw auto;}#top-menu div{width:calc(100%/4);}.menu-banner a{width:90%;font-size:2vw;}}
@media(768 <= width <= 990px){#top-menu{width:90%;}#top-menu div {width: calc(100%/4);}.menu-banner a {width: 90%;/*font-size: 2.5vw;*/}}
@media(width <= 767px){#top-menu {width:86%;}#top-menu div{width: calc(100%/2);padding:0 2vw;}.menu-banner a{width:100%;/*font-size: 3.5vw;*/padding:2vw 0 0;}.menu-banner h4{margin:1vw 0;padding:0 0 1vw;}}
/*===フッター===*/
#footer-menu{background:#fff;background-size:cover;border-top:1px solid #599602;}
#footer-menu .copyright{width:100%;background:#599602;text-align:center;padding:1vw 0;etter-spacing:1px;}
#footer-menu .copyright p{color: #fff;}
#footer-menu .footer-contents{display:flex;align-items:center;justify-content:space-between;width:60%;margin-left:25%;padding:40px 0;text-align:left;}
#footer-menu .footer-center,#footer-menu .footer-left,#footer-menu .footer-right{width:30%;}
#footer-menu .footer-contents h1,#footer-menu .footer-contents h2,#footer-menu .footer-contents h3,#footer-menu .footer-contents p{color: #555;}
#footer-menu .footer-contents a p:hover{color: #ff0000;}
#footer-menu .footer-left h1{font-size:26px;font-weight:500;}
#footer-menu .footer-contents h2,#footer-menu .footer-contents h3{font-size:100%}
#footer-menu img.footer-logo{width:40%;}
#footer-menu img.footer-kuraka{width:50%;margin-top:10px;}
@media(991px <= width <= 1199px){#footer-menu .footer-contents{width:80%;margin:0 auto;padding:20px;}#footer-menu .copyright{padding:10px 0 60px;}}
@media(768px <= width <= 990px){#footer-menu .footer-contents{width:100%;margin:0 auto;padding:20px;}#footer-menu .footer-left{width:50%;margin:20px 0;}#footer-menu .footer-center{width: 25%;}#footer-menu .footer-right{width:25%;padding-bottom:20px;}#footer-menu .footer-contents p{line-height: 30px;}#footer-menu .copyright{padding:10px 0 100px;}#footer-menu img.footer-logo{width: 30%;}#footer-menu img.footer-kuraka{width:30%;margin-top:10px;}}
@media screen and (max-width: 767px){#footer-menu .footer-contents{margin:0 auto;display:block;width:100%;padding:20px;}#footer-menu .footer-left{width:100%;margin:20px 0;}#footer-menu .footer-center{width:100%;}#footer-menu .footer-right{width:100%;padding-bottom:20px;}#footer-menu .footer-contents p{line-height:30px;}#footer-menu .copyright{padding:10px 0 100px;}#footer-menu img.footer-logo{width:40%;}#footer-menu img.footer-kuraka{width:50%;margin-top:10px;}}
/*フッター矢印*/
.arrow{position:relative;display:inline-block;padding:0.3vw 0 0 3vw;color:#eee;vertical-align:middle;text-decoration:none;}
.arrow::before,.arrow::after{position:absolute;top:0;bottom:0;left:0;margin:auto;content:"";vertical-align: middle;}
.footer-yajirusi::before{width:1vw;height:1vw;-webkit-border-radius:50%;border-radius:50%;background: #fff;}
.footer-yajirusi::after{left:0.4vw;box-sizing:border-box;width:0.2vw;height:0.2vw;border:0.2vw solid transparent;border-left:0.3vw solid #000;}
/**色のみ**/
/*コロナ対策*/
.corona{border:1px solid #76cebf;background-color: #fff;}
.corona h1{color: #76cebf;}
.corona h3{color: #555;}
/*トップページ最短で・・・・*/
.contest-trainer h1,.contest-trainer h2{color: #ff0000;}
/*ダイエット・ボディメイク・健康増進アイコンタイトル*/
.contents02 h3{color:#8c6239;}
a.contents02link:hover,a.contents02link:hover h3{color: #ff7bac;}
/*ダイエット・ボディメイク・健康増進枠線*/
#contents02diet,#contents02makeup,#contents02health{border: 1px solid #8c6239;}
#contents02diet p,#contents02makeup p,#contents02health p,.contents02title h2{color:#555555;}
#contents02diet li p,#contents02makeup li p,#contents02health li p{color: #8c6239;}
/*店内紹介・・個室というプライベートな空間で*/
.servis .coment02 p{color:#8c6239;}
div.good-under h3{color:#8c6239;}
.free-space h3{color:#555555;}
.free-space p{color:#555555;}
.free-space-row p{color:#555555;}
.free-space h4{color:#ff0000;}
.free-space h5{color:#8c6239;}
/*アップルフィットのトレーナーは数々のプロ集団です*/
.top-trainer h2{color:#ff0000;}
.top-trainer li h3{color:#8c6239;}
.top-trainer li p{color: #555555;}
.top-trainer li h4{color: #ff0000;}
/***パンくずリスト***/
.Breadcrumb{width:80%;margin:0 auto;list-style:none;text-align:left;}
.Breadcrumb a{text-decoration:none;}
@media(width <= 990px){.Breadcrumb{width:100%;padding:10px 0 10px 10px;}}