@charset "utf-8";
/*======================================
	Base
=======================================*/
html {
    overflow-x: hidden;
    overflow-y:scroll;
    font-size: 62.5%; /* -> 10px */
    line-height: 1.8;
}
body {
	font-weight: normal;
	color:#333;
	font-family: "Noto Sans JP", sans-serif;
    /* min-width: 1200px; */
	overflow: hidden;
}
html,body{ width: 100%;}
a img {
	transition: all .3s;
}
a img:hover {
	opacity: 0.6;
	transition: all .3s;
}
a, a:hover {
	transition: all .3s;
}
.flexBox {
	display: flex;
}
.flexWapp{
    flex-wrap: wrap;
}
.container {
	max-width: 1150px;
	margin: 0 auto;
	position: relative;
}
.pc {
	display: block;
}
.sp {
	display: none;
}

/* ------- アンカー位置調整 ------- */
.anchor {
    display: block;
    padding-top: 10vw;
    margin-top: -10vw;
}

/*======================================
	Header
=======================================*/
header {
	background-color: #F2EFEC;
	position: fixed;
    width: 100%;
	min-width: 75rem;
    z-index: 999;
	filter: drop-shadow(0px 0px 5px #aaa);
}
.headerLogo {
	width: 280px;
    margin: 20px 0 20px 20px;
}
header .container {
	max-width: 1362px;
	justify-content: space-between;
	align-items: center;
	width: initial;
}
p.circleMark::after {
    vertical-align: middle;
    margin-left: 6px;
	display: inline-block;
    width: 32px;
}
p.circleMark.red::after {
	content: url(../images/circleRed.svg);
}
p.circleMark.green::after {
	content: url(../images/circleGreen.svg);
}
ul.menuBox.flexBox {
    align-items: center;
}
ul.menuBox a:hover {
    opacity: 0.6;
    transition: all .3s;
}
ul.menuBox.flexBox li {
	margin-right: 20px;
}
p.circleMark {
    font-size: 19.5px;
    font-weight: 900;
}

/* ===============================================
ハンバーガーボタンのスタイリング
=============================================== */
input[type="checkbox"] {
    opacity: 0;
    visibility: hidden;
    position: absolute;
}
.hamburger {
    display: block;
    width: 43px;
    height: 80px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-left: 10px;
    margin-right: 20px;
}
.hamburger span,
.hamburger span::before,
.hamburger span::after {
    position: absolute;
    display: block;
    content: "";
    width: 100%;
    height: 3px;
    background-color: #000;
    transition: all 0.5s;
}
.hamburger span::before {
    top: -10px;
}
.hamburger span::after {
    bottom: -10px;
}
input[type="checkbox"]:checked + .hamburger span {
    background-color: transparent;
}
input[type="checkbox"]:checked + .hamburger span::before {
    top: 0;
    transform: rotate(45deg);
}
input[type="checkbox"]:checked + .hamburger span::after {
    bottom: 0;
    transform: rotate(-45deg);
}
/* ===============================================
メニューのスタイリング
=============================================== */
.nav {
    position: fixed;
    width: 50%;
    height: 100vh;
    top: 108px;
    right: -120%;
    background-color: #000;
    padding: 0;
    opacity: 0.9;
    transition: all 0.5s;
}
.nav__item a {
    display: block;
    font-size: 18px;
    color: #fff;
    border-bottom: 1px solid #ecec;
    padding: 10px 0 10px 50px;
    text-transform: uppercase;
}
.nav__item a:hover {
    color: #0f5474;
    background-color: #fff;
}
input[type="checkbox"]:checked ~ .nav {
    right: 0;
}
ul.menuBox.flexBox li.nav__item, ul.menuBox.flexBox li.nav__subitem {
    margin-right: 0;
}
ul.nav__list li.sp-menu {
    display: none;
}
.nav__subitem a {
    display: block;
    font-size: 18px;
    color: #fff;
    padding: 10px 0 10px 50px;
    text-transform: uppercase;
}
.nav__subitem a:hover {
    color: #0f5474;
    background-color: #fff;
}
.nav__subitem_child a {
    display: block;
    font-size: 15px;
    color: #fff;
    border-top: 2px dotted #ecec;
    padding: 5px 0 5px 10px;
    text-transform: uppercase;
}
.nav__subitem_child a:hover {
    color: #0f5474;
    background-color: #fff;
}
ul.menuBox.flexBox li.nav__subitem_child {
    margin: 0 0 0 50px;
}
.nav__item_topborder {
    border-top: 1px solid #ecec;
}

/*======================================
	hero Area
=======================================*/
.main_visual {
	margin-top: 108px;
    height: calc(100vh - 108px);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
  }
.reservationButton {
	width: 223px;
	position: absolute;
    bottom: 40px;
    right: 60px;
	filter: drop-shadow(0px 0px 5px #333);
}
p.catchCopy {
	font-size: 5.57vw;
    line-height: 1.2;
	font-weight: 900;
	letter-spacing: -2px;
	color: #fff;
	position: absolute;
    top: 0;
    left: 78px;
    text-shadow: 0 5px 10px rgba(3,0,0,0.3), 0 3px 3px rgba(3,0,0,0.3);
}
p.catchCopy span {
    font-size: 4.8rem;
    font-weight: 600;
    letter-spacing: -1px;
}
p.catchCopy img {
    width: 60%;
    margin-top: 30px;
}
/* TOPイメージ 夏バージョン------------------------------------*/
p.catchCopy02 {
	font-size: 5.57vw;
    line-height: 1.2;
	font-weight: 900;
	letter-spacing: -2px;
	color: #425ba8;
	position: absolute;
    top: 0;
    left: 78px;
    text-shadow: 0 5px 10px rgba(1,0,0,0.2), 0 3px 3px rgba(1,0,0,0.2)
}
p.catchCopy02 span {
    font-size: 3.0rem;
    line-height: 1.5;
    font-weight: 600;
    letter-spacing: -1px;
    margin-top: 0.5em;
    display: inline-block;
}
p.catchCopy02 img {
    width: 60%;
    margin-top: 30px;
}
/* TOPイメージ 夏バージョン------------------------------------*/

img.scrollDown {
	width: 111px;
	position: absolute;
	bottom: 0;
	left: calc(50% - 55px);
	transform: translate(calc(-50% - 55px), 0%);
	-webkit-transform: translate(calc(-50% - 55px), 0%);
	-ms-transform: translate(calc(-50% - 55px), 0%);
	margin-bottom: 40px;
	animation-name: scroll-mark;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-duration: 1s;
}
@keyframes scroll-mark {
    0% {
        transform: translate(0,0px);
    }

    100% {
        transform: translate(0,-20px)
    }
}
/*======================================
	main
=======================================*/
section {
	background-color: #F2EFEC;
}
.bgClip {
  background-image: url("../images/camo.webp");
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  background-position: center center;
  background-size: cover;
  margin-left: 50px;
  margin-top: -6px;
}
.bgClip h2 {
  font-weight: 900;
  line-height: 1;
  font-size: min(9.1vw, 15.4rem);
}
.h2Flex {
	align-items: flex-end;
    justify-content: space-between;
	padding-bottom: 0.6vw;
	max-width: 1500px;
	margin: 0 auto;
}
p.h2_sub {
	font-size: 17px;
	font-weight: 900;
	margin-right: 70px;
}
.h2Bg {
    background-color: #fff;
	border-top: 1px solid #00473F;
	border-bottom: 1px solid #00473F;
}
.campaign_banner { margin: 5rem 0; }
.campaign_text_top {
    font-size: 4.0rem;
    line-height: 1.2;
}
/*======================================
	TOP_slick-slider
=======================================*/
#top_main .slick-slider {
	width: 100%;
	margin: 0 auto;
}
#top_main .slick-slider div {
	position: relative;
	background-color: #f2f2f2;
	text-align: left;
}
#top_main .slick-slider div img {
	width: 100%;
	height:calc(100vh - 108px);
	object-fit: cover;
}
#top_main .slick-slider div.slick-list {
	width: 100%;
	left: 0; margin: 0;
}
#top_main .slick-slider div p.catchCopy img {
	width: 60%;
	height: auto;
	margin-top: 30px;
}

/*======================================
	INVITATION
=======================================*/
#invitationArea {
    background-color: #f2efec;
}
img.invitationImage {
    padding: 1.6vw 0;
    display: block;
    width: 50%;
    margin: 0 auto;
}
.camoButton {
    width: 50%;
    text-align: center;
    font-size: 3rem;
    font-weight: 900;
    color: #fff;
    background-image: url(../images/camo01.webp);
    background-repeat: no-repeat;
    background-size: cover;
    height: 184px;
    line-height: 184px;
    background-position: center;
    letter-spacing: 4px;
    transition: all .3s;
}
.camoButton a {
    display: block;
}
.camoButton:hover {
    opacity: 0.7;
    transition: all .3s;
}
.camoButton:first-child {
    border-right: 1px solid #fff;
}
/*-------------▼2025.04.04追加▼ ---------------*/
.camoButton_head {
    width: 100%;
    text-align: center;
    font-size: 3rem;
    font-weight: 900;
    color: #fff;
    background-image: url(../images/redBack.svg);
    background-repeat: no-repeat;
    background-size: cover;
    height: 120px;
    line-height: 120px;
    background-position: center;
    letter-spacing: 4px;
    transition: all .3s;
}
.camoButton_head a {
    display: block;
}
.camoButton_head:hover {
    opacity: 0.7;
    transition: all .3s;
}
/*-------------▼2024.11.08追加▼ ---------------*/
.camoButton_under {
    width: 100%;
    text-align: center;
    font-size: 3rem;
    font-weight: 900;
    color: #fff;
    background-image: url(../images/camo02.png);
    background-repeat: no-repeat;
    background-size: cover;
    height: 120px;
    line-height: 120px;
    background-position: center;
    letter-spacing: 4px;
    transition: all .3s;
}
.camoButton_under a {
    display: block;
}
.camoButton_under:hover {
    opacity: 0.7;
    transition: all .3s;
}
/*------------- ▲2024.11.08追加▲ ---------------*/

.whiteLine_bottom {
    border-bottom: 1px solid #fff;
}
.redBack {
    background-image: url(../images/redBack.svg);
    background-repeat: repeat-x;
    background-size: cover;
    width: 100%;
    height: 186px;
    font-size: 3rem;
    font-weight: 900;
    letter-spacing: 4px;
    color: #fff;
    text-align: center;
    padding-top: 15px;
}
.redBack .flexBox {
    justify-content: center;
    margin-top: 10px;
    padding: 0 20px;
}
.redBack .flexBox p {
    background-color: #fff;
    color: #d61518;
    width: 332px;
    height: 67px;
    line-height: 67px;
    font-size: 2.1rem;
    letter-spacing: 2px;
    border-radius: 9px;
    filter: drop-shadow(0px 0px 4px #666);
    transition: all .2s;
}
.redBack p.button01 {
    margin-right: 30px;
}
.redBack p.button01 a, .redBack p.button02 a {
    display: block;
}
.redBack p.button01:hover, .redBack p.button02:hover {
    background-color: #d61518;
    color: #fff;
    transition: all .2s;
}
.member_rec {
    background: #e3223e;
    padding: 2rem 0 3rem;
    color: #fff;
    text-align: center;
}
.member_rec p {
	font-size: 2.5rem;
    font-weight: 600;
}
.member_rec a:hover{ opacity: 0.6; }
.member_rec img { width: 60%; }

.member_rec_btn a {
    width: 50%;
    background: #00473F;
    margin: 2rem auto;
    padding: 2rem;
    font-size: 2rem;
    font-weight: 600;
    color: #fff;
    border-radius: 10px;
    display: block;
}

/*======================================
	ABOUT
=======================================*/
#aboutArea .container p {
    font-weight: 900;
    padding: 14vw 2vw 14vw 20px;
    font-size: min(2vw, 1.8vw);
}
@media (767px <= width <= 1150px) {
    #aboutArea .container p {
        padding: 14vw 2vw 14vw 10vw;
    }
}
#aboutArea .imageBox {
    position: relative;
}
#aboutArea .imageBox img {
	position: absolute;
}
#aboutArea .btn_wrapper { padding: 0 20px 80px; }
#aboutArea p.moreButton {
	background-color: #000;
	color: #fff;
	width: 158px;
	text-align: center;
	margin: 50px auto 0;
	height: 39px;
	line-height: 39px;
	border-radius: 16px;
	font-size: 13px;
    transition: 0.3s;
    z-index: 2;
    position: relative;
}
#aboutArea p.moreButton:hover {
    background-color: #fff;
	color: #000;
    transition: 0.3s;
    border: #000 1px solid;
}
#aboutArea p.moreButton a {
	display: block;
}
img.aboutImage01, img.aboutImage02, img.aboutImage03, img.aboutImage04, img.aboutImage05, img.aboutImage06  {
    opacity: 0;
    transition: all 2.0s ease;
    position: relative;
}
img.aboutImage01.show, img.aboutImage02.show, img.aboutImage03.show, img.aboutImage04.show, img.aboutImage05.show, img.aboutImage06.show {
    opacity: 1;
    transform: none;
    position: relative;
    left: 0;
}
img.aboutImage01.show {
    top: -1vw;
    left: 20vw;
    width: 18vw;
}
img.aboutImage01 {
    top: -10vw;
    left: 30vw;
}
img.aboutImage02.show {
    top: 6vw;
    left: 0px;
    width: 18vw;
}
img.aboutImage02 {
    top: -6vw;
    left: -10px;
}
img.aboutImage03.show {
    top: 17vw;
    left: 31vw;
    width: 10vw;
}
img.aboutImage03 {
    top: 17vw;
    left: 80vw;
}
img.aboutImage04.show {
    top: 24vw;
    left: 10vw;
    width: 16vw;
}
img.aboutImage04 {
    top: 24vw;
    left: -30vw;
}
img.aboutImage05.show {
    top: 31.5vw;
    left: 24vw;
    width: 13vw;
}
img.aboutImage05 {
    top: 40vw;
    left: 40vw;
}
img.aboutImage06.show {
    top: 42vw;
    left: 7vw;
    width: 11vw;
}
img.aboutImage06 {
    top: 60vw;
    left: -7vw;
}
/*======================================
	POINT
=======================================*/
#pointArea {
	height: 854px;
}
.bg-triangle01 {
    height: 0;
    border-left: 0px solid transparent;
    border-right: 117px solid transparent;
    border-top: 325px solid #00473f;
    width: 48%;
    z-index: 2;
	margin-top: 55px;
}
.bg-triangle02 {
    height: 0;
    border-right: 0px solid transparent;
    border-left: 117px solid transparent;
    border-bottom: 325px solid #00473f;
    width: 48%;
    z-index: 2;
	position: absolute;
	right:0;
	top: 257px;
}
#pointArea .contents {
	position: relative;
}
.clip-path01 {
	width: 646px;
    height: 325px;
    clip-path: polygon(0 0, 646px 0px, 529px 325px, 0 325px);
    position: absolute;
    font-size: 20px;
    background-image: url(../images/point01.jpg);
    background-color: #000;
    background-size: cover;
    top: -270px;
    left: 50%;
    margin-left: -580px;
}
.clip-path01:hover, .clip-path02:hover {
    transform: scale(1.1);
    transition: 0.3s;
    opacity: 0.7;
}
.clip-path02 {
	width: 646px;
    height: 325px;
    clip-path: polygon(117px 0, 646px 0, 646px 325px, 0 325px);
    position: absolute;
    font-size: 20px;
    background-image: url(../images/point02.jpg);
    background-size: cover;
    top: -120px;
    left: 50%;
    margin-left: -70px;
}
#pointArea a.clip-path01 p {
    writing-mode: vertical-rl;
    background-color: #000;
    color: #fff;
    font-size: 23px;
    font-weight: 900;
    letter-spacing: 2px;
    width: 53px;
    height: 325px;
    text-align: center;
    line-height: 53px;
    left: 0;
    position: relative;
}
#pointArea a.clip-path02 p {
    writing-mode: vertical-rl;
    background-color: #000;
    color: #fff;
    font-size: 23px;
    font-weight: 900;
    letter-spacing: 2px;
    width: 53px;
    height: 325px;
    text-align: center;
    line-height: 53px;
    left: 593px;
    position: relative;
}
.box-shadow{
    filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.7));
    z-index: 2;
    position: relative;
 }
 @media (767px <= width <= 1200px) {
    #pointArea {
        height: 60vw;
    }
    .bg-triangle01 {
        border-right: 9vw solid transparent;
        border-top: 23vw solid #00473f;
        margin-top: 4vw;
    }
    .bg-triangle02 {
        border-left: 9vw solid transparent;
        border-bottom: 23vw solid #00473f;
        top: 20vw;
    }
    .clip-path01 {
        width: 47vw;
        height: 23vw;
        clip-path: polygon(0 0, 47vw 0px, 37vw 25vw, 0 25vw);
        top: -19vw;
        margin-left: -41.5vw;
    }
    #pointArea a.clip-path01 p {
        font-size: 2vw;
        width: 5vw;
        height: 23vw;
        line-height: 5vw;
    }
    .clip-path02 {
        width: 43vw;
        height: 23vw;
        clip-path: polygon(10vw 0, 47vw 0, 47vw 25vw, 0 25vw);
        top: -7vw;
        margin-left: -6.5vw;
    }
    #pointArea a.clip-path02 p {
        font-size: 2vw;
        width: 5vw;
        height: 23vw;
        line-height: 5vw;
        left: 42vw;
    }
}
/*======================================
	POINT--scrollAnimation
=======================================*/
.scrollAnimationLeft, .scrollAnimationRight {
	opacity: 0;
	transition: all 2.0s ease;
	position: relative;
}
.scrollAnimationLeft {
	left: 100px;
}
.scrollAnimationRight {
	left: -100px;
}
.scrollAnimationLeft.show, .scrollAnimationRight.show {
	opacity: 1;
	transform: none;
	position: relative;
	left: 0;
}
/*======================================
	COACH
=======================================*/
#coachArea .container {
    width: 1092px;
    padding: 60px 20px 80px;
}
#coachArea .textBox {
	width: 528px;
	font-size: 14.8px;
	font-weight: 500;
	line-height: 1.4;
	text-align: justify;
}
#coachArea .textBox p.name {
    font-size: 22.6px;
    font-weight: 900;
    text-align: right;
	margin-bottom: 30px;
}
#coachArea .textBox p.name span {
	font-size: 13.6px;
}
#coachArea .textBox p.name_r {
    font-size: 22.6px;
    font-weight: 900;
    text-align: left;
	margin-bottom: 30px;
}
#coachArea .textBox p.name_r span {
	font-size: 13.6px;
}

#coachArea .photo {
	width: 264px;
    height: 264px;
    border-radius: 132px;
	background-position: center;
}
#coachArea .coachBox01 .photo {
    background-image: url(../images/coach01.jpg);
    background-size: 145%;
	margin-left: 40px;
}
#coachArea .coachBox02 .photo {
    background-image: url(../images/coach02.jpg);
    background-size: 145%;
	margin-right: 20px;
}
#coachArea .coachBox03 .photo {
    background-image: url(../images/coach03.jpg);
    background-size: 170%;
	margin-left: 40px;
}
#coachArea .coachBox04 .photo {
    background-image: url(../images/coach04.jpg);
    background-size: 145%;
	margin-right: 40px;
}
#coachArea .coachBox04 {
    margin-top: 20px;
}
#coachArea .container .flexBox {
	align-items: center;
}
#coachArea .coachBox02, #coachArea .coachBox04 {
	flex-direction: row-reverse;
}
#coachArea p.moreButton {
	background-color: #000;
	color: #fff;
	width: 158px;
	text-align: center;
	margin: 50px auto 0;
	height: 39px;
	line-height: 39px;
	border-radius: 16px;
	font-size: 13px;
    transition: 0.3s;
}
#coachArea p.moreButton:hover {
    background-color: #fff;
	color: #000;
    transition: 0.3s;
    border: #000 1px solid;
}
#coachArea p.moreButton a, #newsArea p.moreButton a {
	display: block;
}
.coach01, .coach02, .coach03, .coach04 {
    transform: scale(0, 0);
}
.coach01.show, .coach02.show, .coach03.show, .coach04.show {
    transform: scale(1, 1);
    transition: 1s all;
}
@media (767px <= width <= 1200px) {
    #coachArea .container {
        width: 100%
    }
    #coachArea .textBox {
        width: 42vw;
    }
}
/*======================================
	NEWS
=======================================*/
section#newsArea {
    padding-bottom: 7rem;
}
#newsArea .container {
	font-size: 14px;
	padding: 50px 30px 70px;
}
#newsArea a.flexBox .border {
    border-left: 1px solid #484848;
    height: 24px;
}
#newsArea article {
    border-top: none;
    border-bottom: 1px solid #484848;
	font-weight: 500;
    transition: 0.2s;
}
#newsArea article:hover {
    background-color: #00473f8c;
    color: #fff;
    transition: 0.2s;
}
#newsArea article:first-of-type {
    border-top: 1px solid #484848;
}
#newsArea a .newsTitle {
    padding: 18px 24px;
    display: block;
}
#newsArea a .newsTitle::after {
    content: "＞";
    padding-left: 1em;
}
#newsArea .container .flexBox {
    align-items: center;
}
h3 {
	font-size: 29px;
	font-weight: 900;
	margin-bottom: 22px;
}
#newsArea .date {
    width: 130px;
}
.flexBox.h3_and_more {
    justify-content: space-between;
}
#newsArea p.moreButton {
	background-color: #e50012;
	color: #fff;
	width: 92px;
	text-align: center;
	height: 34px;
	line-height: 34px;
	font-size: 14px;
	margin-bottom: 16px;
    transition: 0.3s;
}
#newsArea p.moreButton:hover {
    background-color: #fff;
	color: #e50012;
    border: 1px solid #e50012;
    transition: 0.3s;
}
.topicsArea {
	background-color: #00473f;
	color: #fff;
    padding-bottom: 6.7rem;
    position: relative;
}
#newsArea .topicsArea .title {
    padding: 0;
    margin-right: 20px;
    line-height: 1.5;
}
#newsArea .topicsArea .container {
	padding: 50px 30px 0;
}
#newsArea .topicsArea article {
    border-bottom: none;
}
@media (767px <= width <= 1200px) {
    #newsArea .topicsArea .date {
        font-size: 1.2rem;
    }
    #newsArea .topicsArea .title {
        font-size: 1.4rem;
    }
}
/*======================================
	TOPICS-slick
=======================================*/
.topicsArea article img {
    object-fit: cover;
    height: 200px;
    width: 100%;
    margin-bottom: 1vw;
}
.topicsArea article .date {
    font-size: 1.36rem;
}
.topicsArea article .title {
    font-size: 1.66rem;
}
.slick-list {
    width: calc(363px* 5);
    left: 50%;
    margin-left: calc(363px* -5 / 2);
    padding: 0 !important;
}
.slick-prev {
    left: 50%;
    z-index: 1;
    transform: scale(1.4, 2) translate(-430px, -26px);
}
.slick-next {
    right: 50%;
    z-index: 1;
    transform: scale(1.4, 2) translate(430px, -26px);
}
.slick-prev:before {
    content: '<';
}
.slick-next:before {
    content: '>';
}
.transparent-left, .transparent-right {
    background-color: #00473f;
    opacity: .6;
    width: 400px;
    height: 330px;
    position: absolute;
    left: calc(50% - 200px);
    top: 120px;
}
.transparent-left {
    transform: translateX(745px);
}
.transparent-right {
    transform: translateX(-745px);
}
.topicsArea article a:hover {
    opacity: 0.7;
}
.topicsArea article img:hover {
    opacity: initial;
}
@media (767px <= width <= 1200px) {
    .slick-list {
        width: calc(24.3vw* 5);
        margin-left: calc(24.3vw* -5 / 2);
    }
    .topicsArea article img {
        height: 14vw;
    }
    .transparent-left, .transparent-right {
        width: 30vw;
        height: 28vw;
        left: calc(50% - 200px);
    }
    .transparent-left, .transparent-right {
        width: 24.3vw;
        height: 26vw;
        left: calc(50% - -60.6vw);
    }
    .transparent-left {
        transform: translateX(-121.4vw);
    }
    .transparent-right {
        transform: translateX(-24.1vw);
    }
    .slick-prev {
        transform: scale(1.4, 2) translate(-30vw, -3vw);
    }
    .slick-next {
        transform: scale(1.4, 2) translate(30vw, -3vw);
    }
}
/*======================================
	MEMBER
=======================================*/
.memberImage {
	height: 707px;
	background-image: url(../images/memberImage.jpg);
	background-position: center;
	background-size: cover;
	color: #fff;
    text-align: center;
}
.memberImage p {
    font-size: 2.0rem;
    line-height: 2;
    text-align: center;
    font-weight: 900;
    padding-top: 168px;
    text-shadow: 0px 0px 4px #000;
}
#memberArea p.button {
    text-shadow: none;
    background-color: #e50012;
    padding-top: 0;
    height: 59px;
    line-height: 59px;
    border-radius: 21px;
    width: 466px;
    margin: 20px auto;
    transition: 0.2s;
}
#memberArea p.button:hover {
    color: #e50012;
    background-color: #fff;
    transition: 0.2s;
}
#memberArea p.button a {
    display: block;
}
@media (767px <= width <= 1150px) {
    .memberImage {
        height: 50vw;
    }
    .memberImage p {
        padding-top: 5vw;
    }
}

/*======================================
	Common_Top
=======================================*/
#lower section { background: #fff; font-family: "Shippori Mincho", serif; }
#lower section.gray { background: #b58450; "Shippori Mincho", serif; }
.contents_visual {
    margin-top: 8rem;
    height: 300px;
    background-position: center center;
    background-image: url(../images/common/lower_top_image.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}
#lower .reservationButton {
    width: 223px;
    position: absolute;
    top: 250px;
    right: 60px;
    filter: drop-shadow(0px 0px 5px #333);
}
#lower .contents {
    max-width: 1150px;
    padding: 1.5rem 0 1rem;
    text-align: center;
    margin: 0 auto;
}
.lower_ttl {
    font-size: 3.5rem;
    line-height: 1.2;
    border-bottom: 3px solid #006c51;
    margin: 0 auto;
    padding-bottom: 1.0rem;
}
#lower p.lead {
    font-size: 1.8rem;
    line-height: 4.5rem;
    display: inline-block;
    margin: 3rem 0;
}
#lower p.ttl {
    font-size: 3.5rem;
    line-height: 1.3;
}
#lower p.subttl {
    font-size: 2.8rem;
    line-height: 1.3;
}
#lower p.body_txt {
	font-size: 1.8rem;
	line-height: 1.8;
	font-family: "Noto Sans JP", sans-serif;
}
#lower p.body_txt a:hover { opacity: 0.6; }

#lower p.textBox {
    font-size: 1.5rem;
    line-height: 1.6;
    text-align: justify;
}
#lower p.textBoxG {
    font-size: 1.5rem;
    line-height: 1.6;
    text-align: justify;
    font-family: "Noto Sans JP", sans-serif;
}

#lower p.moreButton {
    background-color: #000;
    color: #fff;
    width: 158px;
    text-align: center;
    margin: 30px 0 0;
    height: 39px;
    line-height: 39px;
    border-radius: 16px;
    font-size: 13px;
    transition: 0.3s;
}
#lower p.moreButton:hover {
    background-color: #fff;
	color: #000;
    transition: 0.3s;
    border: #000 1px solid;
}
#lower p.moreButton a {
	display: block;
}

/*======================================
	WhatsNew/Topics Page
=======================================*/
#lower section.whatsnew_bk {
    background: #e0e1d7;
    padding: 0;
    font-family: "Noto Sans JP", sans-serif; font-weight: 400;
}
#lower #newsArea .container {
	font-size: 14px;
    text-align: left;
	padding: 0;
}
.detail_data {
    font-size: 1.4rem;
    text-align: left;
    border-bottom: 2px dotted #8f8f8f;
    margin: 0.5rem 0 1.5rem;
    font-family: "Noto Sans JP", sans-serif; font-weight: 400;
}
.detail_back {
    font-size: 1.4rem;
    text-align: right;
    border-top: 2px dotted #8f8f8f;
    margin-top: 2rem;
    font-family: "Noto Sans JP", sans-serif; font-weight: 400;
}
.detail_back a:hover { opacity: 0.6; }

/*======================================
	Members Page
=======================================*/
.members_sub_ttl {
	font-size: 2.3rem;
	line-height: 1.8;
	letter-spacing: -1px;
}
.members_wrapper {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.members_wrapper_item {
    width: 48%;
    padding: 2rem 0;
    font-size: 1.8rem;
    line-height: 1.5;
    font-family: "Noto Sans JP", sans-serif;
}
.members_title {
    border-bottom: 2px solid #e3223e;
    color: #e3223e;
    font-size: 4.5rem;
    line-height: 1.2;
    padding-bottom: 1.2rem;
    font-weight: 800;
}
.members_title_under {
    border-bottom: 2px solid #006c51;
    color: #006c51;
    font-size: 4.5rem;
    line-height: 1.2;
    padding-bottom: 1.2rem;
    font-weight: 800;
}
.members_title_ex {
    border-bottom: 2px solid #886dcc;
    color: #886dcc;
    font-size: 4.5rem;
    line-height: 1.2;
    padding-bottom: 1.2rem;
    font-weight: 800;
}

.members_belt {
    background: #e3223e;
    color: #fff;
    font-size: 2.5rem;
    padding: 0.3rem 1rem;
    text-align: left;
    border-radius: 8px;
}
.members_belt_under {
    background: #006c51;
    color: #fff;
    font-size: 2.5rem;
    padding: 0.3rem 1rem;
    text-align: left;
    border-radius: 8px;
}
.members_belt_under {
    background: #006c51;
    color: #fff;
    font-size: 2.5rem;
    padding: 0.3rem 1rem;
    text-align: left;
    border-radius: 8px;
}
.members_belt_ex {
    background: #886dcc;
    color: #fff;
    font-size: 2.5rem;
    padding: 0.3rem 1rem;
    text-align: left;
    border-radius: 8px;
}
.members_leftbelt_red {
    border-left: 10px solid #e3223e;
    text-align: left;
    padding: 0 15px 0;
}
.members_leftbelt_green {
    border-left: 10px solid #006c51;
    text-align: left;
    padding: 0 15px 0;
}
.members_leftbelt_ex {
    border-left: 10px solid #886dcc;
    text-align: left;
    padding: 0 15px 0;
}

/*
.members_leftbelt_pink {
    border-left: 10px solid #ca7098;
    text-align: left;
    padding: 0 15px 0;
}
.members_leftbelt_bronze {
    border-left: 10px solid #b58450;
    text-align: left;
    padding: 0 15px 0;
}
.members_leftbelt_platinum {
    border-left: 10px solid #5fbfae;
    text-align: left;
    padding: 0 15px 0;
}
*/

.members_wrapper_item p.ttl {
    font-size: 3.5rem;
    line-height: 1.3;
}
.members_wrapper_item span {
    font-size: 4.5rem;
    font-weight: 900;
    line-height: 1.3;
}
.members_off {
    font-size: 1.5rem;
    color: #fff;
    margin-top: 0.8rem;
    padding: 5px;
    text-align: center;
}
.members_waku {
    background: #f2efec;
    padding: 15px;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.members_waku_left {
    background: #c2a46f;
    padding: 5px 15px;
    color: #fff;
    border-radius: 8px;
    line-height: 1.3;
}
.members_waku_right {
    font-size: 1.6rem;
    line-height: 1.2;
    text-align: left;
    margin-left: 10px;
}
.members_waku_right p.indent {
    padding-left: 1em;
    text-indent: -1em;
}

/*-----------------------土日プラン追加での枠 ----------------------------*/
.members_waku02 {
    background: #f2efec;
    padding: 15px;
    border-radius: 8px;
    width: 100%;
}
.members_waku02_ttl {
	font-size: 1.8rem;
    background: #c2a46f;
    margin-bottom: 0.3em;
    padding: 5px 15px;
    color: #fff;
    border-radius: 8px;
    line-height: 1.3;
}
.members_waku02_item {
	width: fit-content;
	margin: 0 auto;
}
.members_waku02_cont {
	font-family: "Noto Sans JP", sans-serif;
    font-size: 1.6rem;
    line-height: 1.2;
    text-align: left;
    margin-left: 10px;
}
.members_waku02_cont p.indent {
    padding-left: 1em;
    text-indent: -1em;
}
/*-----------------------土日プラン追加での枠 ----------------------------*/

#lower .contents .attention {
    border: 1px solid #e3223e;
    border-radius: 8px;
    padding: 15px;
    color: #e3223e;
    font-size: 1.6rem;
    line-height: 1.6;
}

.red_bk { background: #ff6c64; border-radius: 5px; }
.blue_bk { background: #678fd8; border-radius: 5px; }
.gray_bk {
    background: #b58450;
    margin: 5rem 0;
}

.campaign_text {
    font-size: 3.2rem;
    line-height: 1.2;
    color: #fff;
}
.appli_text {
    border: 1px solid #678fd8;
    padding: 20px;
    color: #678fd8;
    border-radius: 8px;
    font-size: 1.5rem;
}
.exp_course_btn a {
    width: 50%;
    background: #886dcc;
    margin: 2rem auto;
    padding: 2rem;
    font-size: 2rem;
    font-weight: 600;
    color: #fff;
    border-radius: 10px;
    display: block;
}
.exp_course_btn a:hover{ opacity: 0.6; }

/*======================================
	Experi_course page
=======================================*/
.ex_course_sub_ttl {
    font-size: 2.6rem;
    line-height: 1.2;
    letter-spacing: -1px;
    margin-bottom: 1.5rem;
    padding-left: 1em;
    text-indent: -1em;
    text-align: left;
}
.ex_course_wrapper {
    border: 2px solid #d8cfc0;
    border-radius: 8px;
    padding: 40px;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: left;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
.ex_course_wrapper_left {
    width: 60%;
}
.ex_course_wrapper_left p {
	font-size: 1.5rem;
	margin-top: 0.8em;
}

.ex_course_wrapper_left02 {
    width: 48%;
}
.ex_course_wrapper_left02 p {
	font-size: 1.5rem;
	margin-top: 0.8em;
}
.ex_course_wrapper_right02 {
    width: 48%;
}

.ex_course_wrapper_right {
    width: 35%;
}
.ex_course_wrapper p.ttl {
    font-size: 2.5rem;
    line-height: 1.5;
    margin-bottom: 1.5rem;
}
.ex_course_wrapper .exp_course_btn a {
    width: 50%;
    background: #886dcc;
    margin: 2rem 0;
    padding: 2rem;
    font-size: 2rem;
    font-weight: 600;
    text-align: center;
    color: #fff;
    border-radius: 10px;
    display: block;
}
.ex_course_wrapper .exp_course_btn a:hover{ opacity: 0.6; }
.ex_course_wrapper img { width: 100%; }
.ex_course_wrapper_shitaya { font-size: 3rem; color:#886dcc; }

/*======================================
	Reservation_Info page
=======================================*/
.ex_course_wrapper span {
    font-size: 1.5rem;
    border-bottom: 1px dotted #000;
    padding-bottom: 2px;
}
.ex_btn_wrapper {
    display: flex;
    width: 80%;
}
.ex_btn_self, .ex_btn_lesson {
    width: 300px;
}
.ex_btn_self a {
    font-size: 1.8rem;
    padding: 1.5rem;
    color: #fff;
    display:block;
    background: #e3223e;
    border-radius: 10px;
    margin: 5px 5px 20px;
}
.ex_btn_lesson a {
    font-size: 1.8rem;
    padding: 1.5rem;
    color: #fff;
    display:block;
    background: #00473F;
    border-radius: 10px;
    margin: 5px 5px 20px;
}
.ex_btn_self a:hover, .ex_btn_lesson a:hover, .ex_course_wrapper_left a:hover, .ex_course_wrapper_right a:hover { opacity: 0.6; }

/*======================================
	Features page
=======================================*/
.features_title {
    border-bottom: 2px solid #e3223e;
    color: #e3223e;
    font-size: 4.5rem;
    line-height: 1.2;
    padding-bottom: 1.2rem;
    font-weight: 800;
}
.features_wrapper {
    background: #cfd1c3;
    margin-top: 3rem;
}
#lower section.features_bk {
    background: #e0e1d7;
    padding: 6rem 10rem 5rem;
    position: relative;
}
.shitaya {
    position: absolute;
	top: -15px;
	left: calc(50% - 50px);
}
.shitaya_green {
    margin-top: 1rem;
}
.features_lead {
    font-size: 2.5rem;
    line-height: 1.5;
    text-align: center;
    padding: 1.2rem 0;
}
.features_txt {
    font-size: 2.2rem;
    line-height: 2;
    text-align: left;
    border-top: 2px solid #fff;
    padding: 1.2rem 0;
}
.features_txt:last-child {
    border-bottom: 2px solid #fff;
}
.features_txt02 {
    font-size: 2.2rem;
    line-height: 1.6;
    text-align: left;
    padding: 1rem 0;
}
.feature_machine_wrapper {
    display: flex;
	justify-content: center;
    align-items: center;
}
.feature_machine_wrapper_item, .system_wrapper_item, .coach_wrapper_item, .machine_wrapper_item {
	width: 50%;
}
.feature_machine_wrapper_item img {
    width: 100%!important;
    margin-top: 0!important;
}
.img_boredr {
    border: 15px solid #9e9d9d;
    border-radius: 8px;
}
.system_wrapper {
    background-image: url(../images/features/system_back.svg);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: cover;
    margin-top: 3rem;
    padding: 4rem 10rem 5rem;
    text-align: center;
}
.system_wrapper_item img {
    width: 100%;
}
.coach_img {
    margin-top: -15rem;
}
.method_wrapper, .feature_system_wrapper {
    display: flex;
    justify-content:space-between;
    flex-wrap: wrap;
}
.method_wrapper_item {
    width: 28%;
}
.method_wrapper img {
    width: 80%;
    margin-top: 50px;
}
.method_banner {
    border: 1px solid #e3223e;
    border-radius: 8px;
    padding: 15px;
    color: #e3223e;
    font-size: 2.6rem;
    line-height: 1.6;
}
.method_wrapper_01item {
    width: 30%;
}
.method_wrapper_02item {
    width: 68%;
    padding-right: 1.5rem;
}
.method_wrapper_01item img {
    margin-top: 0;
}

.feature_sys_wrapper_01item {
    width: 38%;
}
.feature_sys_wrapper_02item {
    width: 60%;
    padding: 0 1.5rem 1.5rem 0;
}
.feature_sys_wrapper_01item img {
    margin-top: 0;
}
.feature_sys_wrapper_02item span {
    font-size: 70%;
}

.features_back {
    background-image: url(../images/features/features_back.svg);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
}
.features_sys_back {
    background-image: url(../images/features/features_system_back.svg);
    background-repeat: no-repeat;
    background-position: top;
    background-size: contain;
}
.features_under_wrapper {
    display: flex;
    padding: 2rem 0;
    margin: 5rem 0;
    text-align: center;
}
.features_under_wrapper_item {
    width: 50%;
    padding: 2rem 0;
    font-size: 1.8rem;
    line-height: 1.5;
}
.features_under_wrapper_item p img {
    width: 100%;
}
.green_shitaya {
    margin: 1rem 0 -5rem;
    z-index: 3;
    position: relative;
}

.coach_wrapper_item {
    padding: 1rem 2rem;
}
.coach_wrapper_item img {
    width: 100%;
}
.improvement {
    border: 10px solid #004740;
    border-radius: 8px;
}
.improvement02 {
    border: 10px solid #e3223e;
    border-radius: 8px;
}
.pag_l {padding-left: 2rem;}

.introduction_wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.machine_item {
	width: 48%;
}
.machine_text {
	font-size: 1.4rem;
	line-height: 2.0rem;
	padding: 1rem;
    text-align: left;
}
.machine_wrapper_item img { width: 100%; }

/*======================================
	Facilities page
=======================================*/
.facilities_wrapper {
    border: 2px solid #004740;
    border-radius: 8px;
    padding: 40px;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: left;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.facilities_wrapper_left, .facilities_wrapper_right {
    width: 48%;
}
.facilities_wrapper_item {
    width: 31.5%;
    font-size: 1.6rem;
    line-height: 2.5rem;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    margin: 10px 0;
}

#lower .facilities_wrapper p.ttl {
    font-size: 2.5rem;
    line-height: 1.5;
    margin-bottom: 1.0rem;
}
.facilities_wrapper img, .facilities_wrapper_bless img { width: 100%; }

.facilities_wrapper_bless {
    padding: 40px 0;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: left;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.facilities_wrapper_bless_item {
    width: 48%;
}

/*======================================
	Contact page
=======================================*/
.contact_wrapper {
    border: 2px solid #004740;
    border-radius: 8px;
    padding: 40px;
    font-size: 1.8rem;
    line-height: 1.5;
    text-align: left;
}
.contact_wrapper_inner {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    border-bottom: 1px solid #006c51;
	padding: 2rem 0;
}
.contact_wrapper_left {
    width: 40%;
}
.contact_wrapper_right {
    width: 58%;
}
.contact_wrapper_item {
    width: 31.5%;
    font-size: 1.6rem;
    line-height: 2.5rem;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: 400;
    margin: 10px 0;
}

#lower .contact_wrapper p.ttl {
    font-size: 2.5rem;
    line-height: 1.5;
    margin-bottom: 1.0rem;
}

.contact_formwrapper {
    padding: 5px 8px;
    font-size: 100%;
    background: #FFF;
    color: #333;
    border: 1px solid #CCC;
    box-sizing: border-box;
}
textarea {
    padding: 5px 8px;
    font-size: 100%;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #CCC;
}
.formBtnCont {
    text-align: center;
    margin-top: 30px;
}
.formBtnCont input[type="submit"] {
    padding: 12px 0;
    text-align: center;
    color: #FFF;
    font-size: 116%;
    letter-spacing: 0.02em;
    word-spacing: 0;
    cursor: pointer;
    width: 20%;
    font-weight: normal;
    margin: 0 auto;
    background: #00473F;
    border-radius: 10px;
}
.formBtnCont input[type="submit"]:hover { opacity: 0.6; }
/*======================================
	FAQ
=======================================*/
.sub_ttl {
	font-size: 2.8rem;
	line-height: 3.8rem;
	letter-spacing: -1px;
}
.faq_wrapper {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1.0rem;
}
.faq_Q {
	width: 50px;
	height: 50px;
	background: #009270;
	color: #fff;
	font-size: 3.0rem;
	padding: 0.7rem;
	border-radius: 50%;
	line-height: 1;
}
.faq_A {
	width: 50px;
	height: 50px;
	background: #4f1fde;
	color: #fff;
	font-size: 3.0rem;
	padding: 0.7rem;
	border-radius: 50%;
	line-height: 1;
}
.faq_txt {
	font-size: 1.6rem;
	width: 93%;
	text-align: left;
	line-height: 1.5;
}
.faq_border {
	border-bottom: 1px solid #009270;
	padding-top: 1.0rem;
}
.bk_gray {
	background: #e4e5ee;
	border-radius: 10px;
}
.faq_txt tr {
	border-bottom: 2px dotted #9b9b9d;
	padding: 5px 0;
	display: flex;;
}
.faq_txt tr:last-child { border-bottom: none; }
.faq_txt .td_wrap {
	width: 35%;
}
.faq_wrapper a:hover { opacity: 0.6; }

/*======================================
	footer
=======================================*/
p.footer-trialButton, p.footer-reservationButton {
    background-color: #00473F;
    color: #fff;
    font-size: 2.1rem;
    font-weight: 900;
    width: 458px;
    height: 167px;
    line-height: 167px;
    border-radius: 14px;
    text-align: center;
    text-decoration-color: #fff;
    text-decoration-line: underline;
    text-decoration-thickness: 2.6px;
    text-underline-offset: 12px;
    transition: 0.2s;
}
p.footer-trialButton:hover, p.footer-reservationButton:hover {
    background-color: #00473f8c;
    color: #00473F;
    text-decoration-color: #00473F;
    transition: 0.2s;
}
p.footer-trialButton {
    margin-right: 32px;
}
p.footer-trialButton a, p.footer-reservationButton a {
    display: block;
}
.justify-content-center {
    justify-content: center;
    margin:100px 30px 43px 30px;
}
footer .redBack {
    height: 141px;
}
footer .redBack .flexBox {
    margin-top: 30px;
}
.footerLogo a {
    width: 440px;
    height: auto;
    margin: 100px auto 30px;
    display: block;
}
.bottomArea {
    font-size: 1.3rem;
    background-color: #00473F;
    color: #fff;
    justify-content: space-between;
    padding: 0 40px;
    height: 37px;
    line-height: 37px;
}
p.name_address {
    font-size: 1.6rem;
    line-height: 2.3rem;
    font-weight: 500;
    text-align: center;
    margin: 34px auto 0;
    padding: 20px;
    border-top: 1px solid #00473F;
    width: 50%;
}
.footer_link_wrapper {
    width: fit-content;
    margin: 0 auto 7em;
}
.footer_link_wrapper a:hover { opacity: 0.6; }
.footer_link {
    font-size: 1.8rem;
    font-weight: 800;
    padding: 0.5em 1.5em;
    color: #e30b20;
    border: 2px solid #e30b20;
    border-radius: 10px;
}

/*------------------------------------------------------------メディアクエリ------------------------------------------------------------*/

@media only screen and (max-width: 767px) {
    .container {
        max-width: 100%;
    }
    .pc {
    	display: none;
    }
    .sp {
        display: block;
    }
/*======================================
Header
=======================================*/
    header {
        min-width: initial;
    }
    header .container {
        max-width: initial;
    }
    .headerLogo {
        width: 160px;
        margin: 10px 0 10px 20px;
    }
    li.pc-menu {
        display: none;
    }
    .hamburger {
        height: 59px;
    }

/* ===============================================
メニューのスタイリング
=============================================== */
    .nav {
        width: 70%;
        top: 59px;
        padding-top: 2rem;
    }
    .nav__item a, .nav__subitem a {
        font-size: 16px;
        padding: 5px 0 5px 1em;
    }
    ul.menuBox.flexBox li.nav__subitem_child {
        margin: 0 0 0 15px;
        /* margin: 0 0 0 1.8em; */
    }
    .nav__subitem_child a {
        font-size: 13px;
        padding: 5px 0 5px 8px;
    }
    input[type="checkbox"]:checked ~ .nav {
        right: 0;
    }
    ul.menuBox.flexBox li.nav__item {
        margin-right: 0;
    }
    ul.nav__list li.sp-menu {
        display: block;
        padding-left: 16px;
        margin-bottom: 10px;
    }
    p.circleMark {
        font-size: 16px;
    }
    p.circleMark::after {
        width: 24px;
        position: relative;
        top: 2px;
    }
    ul.menuBox.flexBox li {
        margin-right: 0;
        color: #fff;
    }
/*======================================
hero Area
=======================================*/
    p.catchCopy {
        font-size: 11vw;
        line-height: 1.3;
        letter-spacing: -0.5vw;
        top: 2%;
        left: 5vw;
    }
    p.catchCopy span {
        font-size: 6vw;
        line-height: 1.2;
        letter-spacing: 0;
        display: inline-block;
    }
    p.catchCopy img {
        width: 80%;
        margin-top: 10px;
    }
/* TOPイメージ 夏バージョン------------------------------------*/
    p.catchCopy02 {
        font-size: 11vw;
        line-height: 1.3;
        letter-spacing: -0.5vw;
        top: 2%;
        left: 5vw;
    }
    p.catchCopy02 span {
        font-size: 4.7vw;
        letter-spacing: 0;
    }
    p.catchCopy02 img {
        width: 80%;
        margin-top: 10px;
    }
/* TOPイメージ 夏バージョン------------------------------------*/
    
    .reservationButton {
        width: 28vw;
        bottom: 12vw;
        right: 4vw;
    }
    img.scrollDown {
        width: 16vw;
        left: calc(50% - 8vw);
        transform: translate(calc(-50% - 8vw), 0%);
        -webkit-transform: translate(calc(-50% - 8vw), 0%);
        -ms-transform: translate(calc(-50% - 55px), 0%);
        margin-bottom: 4vw;
    }
/*======================================
main
=======================================*/
    p.h2_sub {
        font-size: 3vw;
        margin-right: 4%;
        text-align: right;
        line-height: 1.4;
        position: relative;
        top: -3vw;
    }
    .bgClip {
        margin-left: 6%;
        margin-top: 0;
    }
    .bgClip h2 {
        font-size: 11vw;
        margin: 2vw 0;
    }
    .campaign_banner { margin: 1.5rem 0; }
    .campaign_text_top {
        font-size: 2.5rem;
    }
	.main_visual {
        margin-top: 59px;
        height: calc(100vh - 59px);
    }
/*======================================
	TOP_slick-slider
=======================================*/
#top_main .slick-slider {
	width: 100%;
	margin: 0 auto;
}
#top_main .slick-slider div img {
	height:calc(100vh - 59px);
}

/*======================================
　　INVITATION
=======================================*/
    img.invitationImage {
        width: 90%;
    }
    .camoButton {
        width: 50%;
        font-size: 3.5vw;
        height: 14vw;
        line-height: 14vw;
        letter-spacing: 2px;
    }
    .camoButton_head {
        width: 100%;
        font-size: 3.5vw;
        line-height: 1.4;
        height: 6.5em;
        letter-spacing: 2px;
        padding: 2em 0;
    }
    .camoButton_under {
        width: 100%;
        font-size: 3.5vw;
        height: 14vw;
        line-height: 14vw;
        letter-spacing: 2px;
    }
    .redBack .flexBox {
        margin-top: 1vw;
        padding: 0;
    }
    .redBack .flexBox p {
        width: 44%;
        font-size: 4vw;
        height: 10vw;
        line-height: 10vw;
        letter-spacing: 0;
    }
    .redBack {
        height: 30vw;
        font-size: 5.6vw;
        letter-spacing: 0.2vw;
        padding-top: 2vw;
    }
    .redBack p.button01 {
        margin-right: 4vw;
    }
    .member_rec {
    	padding: 2rem 0;
    }
    .member_rec p {
    	font-size: 1.5rem;
    }
    .member_rec img { width: 100%; }
    .member_rec_btn a {
    	width: 80%;
    	font-size: 1.3rem;
    	padding: 1.5rem;
    }
/*======================================
　　ABOUT
=======================================*/
#aboutArea .flexBox.h2Flex {
    display: flex;
}
#aboutArea .flexBox {
    display: block;
}
#aboutArea .container p {
    padding: 10vw 0 6vw 5%;
    font-size: 4vw;
}
#aboutArea .imageBox {
    height: 125vw;
    margin-top: 20px;
    transform: scale(2.4) translate(30vw, 32vw);
}
/*======================================
　　POINT
=======================================*/
    #pointArea {
        height: 140vw;
    }
    .bg-triangle01 {
        border-right: 13vw solid transparent;
        border-top: 44vw solid #00473f;
        margin-top: 9vw;
        width: 70%;
    }
    .bg-triangle02 {
        border-left: 13vw solid transparent;
        border-bottom: 44vw solid #00473f;
        top: 55vw;
        width: 70%;
    }
    .clip-path01 {
        width: 77vw;
        height: 44vw;
        clip-path: polygon(0 0, 77vw 0px, 55vw 77vw, 0 44vw);
        top: -38vw;
        margin-left: -40vw;
    }
    .clip-path02 {
        width: 77vw;
        height: 52vw;
        clip-path: polygon(14vw 0, 77vw 0, 77vw 44vw, 0 44vw);
        top: 17vw;
        margin-left: -40.5vw;
    }
    #pointArea a.clip-path01 p {
        font-size: 4vw;
        width: 8vw;
        height: 38vw;
        line-height: 8vw;
    }
    #pointArea a.clip-path02 p {
        font-size: 4vw;
        width: 8vw;
        height: 44vw;
        line-height: 8vw;
        left: 69vw;
    }
/*======================================
　　COACH
=======================================*/
    #coachArea .container {
        width: 100%;
        padding: 8vw 4% 12vw;
    }
    #coachArea .coachBox01.flexBox,  #coachArea .coachBox03.flexBox {
        flex-direction: column-reverse;
    }
    #coachArea .coachBox02, #coachArea .coachBox04 {
        flex-direction: column-reverse;
    }
    #coachArea .textBox {
        width: 100%;
        font-size: 14px;
    }
    #coachArea .textBox p.name, #coachArea .textBox p.name_r {
        font-size: 5vw;
        font-weight: 900;
        text-align: center;
        margin-bottom: 2vw;
        margin-top: 4vw;
    }
    #coachArea .textBox p.name span, #coachArea .textBox p.name_r span {
        font-size: 3.6vw;
    }
    .coachBox01, .coachBox02, .coachBox03, .coachBox04 {
        margin-bottom: 6vw;
    }
    #coachArea .coachBox01 .photo,  #coachArea .coachBox03 .photo {
        margin-left: 0vw;
    }
    #coachArea .coachBox02 .photo {
        margin-right: 0vw;
    }
    #coachArea .coachBox04 .photo {
        margin-right: 0vw;
    }
/*======================================
　　NEWS
=======================================*/
#newsArea .container .flexBox {
    display: block;
}
#newsArea .container .flexBox.h3_and_more {
    display: flex;
    z-index: 2;
    position: relative;
}
#newsArea a.flexBox .border {
    border-left: 0;
    height: initial;
}
#newsArea a .newsTitle {
    padding: 0;
    display: block;
    line-height: 1.4;
}
#newsArea article {
    padding: 2vw 0;
}
#newsArea .container {
    padding: 8vw 4% 14vw;
}
.topicsArea {
    background-color: #00473f;
    color: #fff;
    padding-bottom: 10vw;
}
#newsArea p.moreButton {
    width: 23vw;
    height: 8vw;
    line-height: 8vw;
    font-size: 3.4vw;
    margin-bottom: 1vw;
}
/*======================================
    TOPICS-slick
=======================================*/
    .slick-list {
        width: calc(80vw* 3);
        left: 50%;
        margin-left: calc(80vw* -3 / 2);
    }
    .transparent-left {
        transform: translateX(-52vw);
    }
    .transparent-right {
        transform: translateX(40vw);
    }
    .transparent-left, .transparent-right {
        width: 12vw;
        height: 100%;
        left: calc(50% - 0px);
        top: 0;
        background-color: #00473f;
    }
    .slick-prev {
        transform: scale(1.4, 2) translate(-33vw, -3vw);
    }
    .slick-next {
        transform: scale(1.4, 2) translate(34vw, -3vw);
    }
    #newsArea .topicsArea article {
        padding: 2vw 0;
    }
    .topicsArea {
        padding-bottom: 10vw;
    }
    h3 {
        font-size: 7vw;
        font-weight: 900;
        margin-bottom: 2vw;
    }
    .topicsArea article .title {
        font-size: 4vw;
    }
    .topicsArea article .title {
        font-size: 4vw;
    }
/*======================================
　　MEMBER
=======================================*/
    #memberArea p.button {
        width: 80%;
    }
    .memberImage p {
        font-size: 4vw;
        padding-top: 26vw;
    }
    .memberImage {
        height: 130vw;
    }
    #memberArea p.button {
        margin: 10vw auto 0;
    }
    .justify-content-center {
        justify-content: center;
        margin: 15vw 0 5vw;
    }
    p.footer-trialButton, p.footer-reservationButton {
        font-size: 3.5vw;
        width: 45%;
        height: 18vw;
        line-height: 15vw;
        border-radius: 2vw;
    }
    p.footer-trialButton {
        margin-right: 3vw;
    }
    
/*======================================
	Common_Top
=======================================*/
	.contents_visual {
        height: 10rem;
        margin-top: 5rem;
    }
    #lower .contents {
		padding: 1.5rem 1.5rem;
	}
    #lower .reservationButton {
        width: 28vw;
        top: 21vw;
        right: 4vw;
    }
	.lower_ttl {
		font-size: 2.5rem;
        border-bottom: 2px solid #006c51;
    }
    #lower p.lead {
        font-size: 1.6rem;
        line-height: 2.5rem;
        margin: 1.5rem 0;
        padding: 0 1rem;
    }
	#lower p.body_txt {
		font-size: 1.4rem;
		line-height: 1.5;
		text-align: left;
	}
    #lower p.textBox {
        font-size: 1.2rem;
    }
    #lower p.textBoxG {
        font-size: 1.2rem;
    }
    #lower p.moreButton {
        margin: 30px 0;
    }
    #lower p.ttl {
        font-size: 2.6rem;
    }
    #lower p.subttl {
        font-size: 2.2rem;
    }

/*======================================
	WhatsNew/Topics Page
=======================================*/
    #lower section.whatsnew_bk {
	    padding: 0 1rem;
    }
    .detail_data,.detail_back {
        font-size: 1.2rem;
    }

/*======================================
	Members Page
=======================================*/
	.members_sub_ttl {
		font-size: 1.8rem;
		line-height: 1.3;
        margin-bottom: 5px;
	}
	.members_wrapper_item {
        width: 100%;
	}
    .members_wrapper_item {
        font-size: 1.2rem;
    }
    .members_title, .members_title_under, .members_title_ex {
        font-size: 3.5rem;
    }
    .members_belt, .members_belt_under, .members_belt_ex {
        font-size: 2.0rem;
    }
    .members_wrapper_item p.ttl {
        font-size: 2.6rem;
    }
    .members_wrapper_item span {
        font-size: 3.5rem;
    }
    .members_off {
    	font-size: 1.3rem;
    }
    .members_waku {
        flex-wrap: wrap;
    }
    .members_waku_left {
        font-size: 1.8rem;
        margin-bottom: 1.5rem;
        padding: 8px 30px;
    }
    .members_waku_right {
        font-size: 1.3rem;
        margin-left: 0;
    }
    #lower .contents .attention {
    	font-size: 1.4rem;
        text-align: left;
    }
    .exp_course_btn a {
        font-size: 1.6rem;
        width: 80%;
    }
    .campaign_text {
    	font-size: 2.8rem;
    }
    .appli_text {
        font-size: 1.2rem;
        line-height: 1.3;
    }

/*======================================
	Experi_course page
=======================================*/
    .ex_course_wrapper {
        font-size: 1.5rem;
    }
    .ex_course_wrapper .exp_course_btn a {
        width: 100%;
        padding: 1.5rem;
    }
    .ex_course_wrapper_left, .ex_course_wrapper_right {
        width: 100%;
    }
    .ex_course_wrapper_left p {
    	font-size: 1.2rem;
    }
    .ex_course_wrapper_right {
        margin-top: 1.4rem;
    }

    .ex_course_wrapper_left02, .ex_course_wrapper_right02 {
        width: 100%;
    }
    .ex_course_wrapper_left02 p {
    	font-size: 1.2rem;
    }
    .ex_course_wrapper_right02 {
        margin: 1.4rem 0;
    }

/*======================================
	Reservation_Info page
=======================================*/
    .ex_course_wrapper span {
        font-size: 1.2rem;
    }
    .ex_btn_wrapper {
        width: 100%;
        justify-content: center;
    }
    .ex_btn_self, .ex_btn_lesson {
        width: 98%;
    }
    .ex_btn_self a, .ex_btn_lesson a  {
        font-size: 1.5rem;
    }
/*======================================
	Facilities page
=======================================*/
    .facilities_wrapper {
        font-size: 1.3rem;
    }
    #lower .facilities_wrapper p.ttl {
        font-size: 1.6rem;
    }
    .facilities_wrapper_left, .facilities_wrapper_right {
        width: 100%;
    }
    .facilities_wrapper_right {
        margin-top: 1.4rem;
    }
    .facilities_wrapper_bless {
        padding: 10px;
    }
    .facilities_wrapper_bless_item {
        width: 100%;
        margin: 10px 0;
    }

    .facilities_wrapper_item {
        width: 100%;
        font-size: 1.2rem;
        line-height: 1.8rem;
    }

/*======================================
	Contact page
=======================================*/
    .contact_wrapper {
        font-size: 1.3rem;
    }
    #lower .contact_wrapper p.ttl {
        font-size: 1.6rem;
    }
    .contact_wrapper_left, .contact_wrapper_right {
        width: 100%;
    }
    .contact_wrapper_right {
        margin-top: 1.4rem;
    }
    .contact_wrapper_bless {
        padding: 10px;
    }
    .formBtnCont input[type="submit"] {
        width: 60%;
    }

/*======================================
	Features page
=======================================*/
    #lower section.features_bk, .system_wrapper {
        padding: 0 1rem 3rem;
    }
    .features_title {
        font-size: 3.0rem;
    }
    .features_lead {
        font-size: 1.7rem;
    }
    .features_txt {
        font-size: 1.5rem;
        padding: 0.8rem 0;
    }
    .features_txt02 {
        font-size: 1.3rem;
        padding: 0.8rem 0;
    }
    .shitaya {
        width: 20%;
        margin-top: -2rem;
        position: unset;
    }
    .shitaya_green {
        width: 20%;
        margin: -0.5rem 0 -1.5rem;
    }
    .img_boredr {
        border: 8px solid #9e9d9d;
        border-radius: 4px;
    }
    .system_wrapper_item {
        width: 100%;
        margin: 10px 0;
    }
    .coach_img {
        margin-top: -5rem;
    }
    .method_wrapper {
        padding: 0 1.5rem;
    }
    .method_wrapper_item {
        width: 43%;
    }
    .method_wrapper img {
        width: 100%;
        margin-top: 30px;
    }
    .method_wrapper_01item img {
        margin-top: 0;
        padding: 10px 0;
    }
    .method_wrapper_02item {
        padding-right: 0.5rem;
    }
    .method_banner {
        font-size: 1.8rem;
    }
    .features_back {
        background-image: url(../images/features/features_back_sp.svg);
        background-position: center;
    }
    .features_under_wrapper {
        margin: 0;
    }
    .features_under_wrapper_item {
        font-size: 1.4rem;
    }
    .green_shitaya {
        margin: 0.5rem 0 -1.2rem;
    }
    .green_shitaya img {
        width: 20%;
        
    }

    .feature_sys_wrapper_01item {
        width: 30%;
    }
    .feature_sys_wrapper_02item {
        width: 68%;
        padding: 0 1.5rem 0 0;
    }
    .feature_sys_wrapper_01item img {
        width: 100%;
    }
    .features_sys_back {
        background-image: url(../images/features/features_system_back_sp.svg);
        background-size: cover;
        background-position: center;
        height: 160px;
    }
    .coach_wrapper_item {
        width: 100%;
        padding: 1rem 2rem;
    }
    .improvement {
        border: 7px solid #004740;
        border-radius: 4px;
    }
    .improvement02 {
        border: 7px solid #e3223e;
        border-radius: 4px;
    }
    .pag_l {padding-left: 0;}
    .machine_wrapper_item { width: 100%; }
    
/*======================================
	FAQ
=======================================*/
	.faq_Q, .faq_A {
		margin-right: 1rem;
		height: 47px;
	}
	.faq_txt tr {
    	flex-wrap: wrap;
	}
	.faq_txt .td_wrap {
    	width: 100%;
	}
/*======================================
footer
=======================================*/
    img.footerLogoImage {
        width: 70vw;
        margin: 0 auto;
        display: block;
    }
    .footerLogo a {
        width: auto;
        margin: 16vw auto 5vw;
    }
    .bottomArea {
        height: auto;
        text-align: center;
        flex-direction: column-reverse;
    }
    footer .redBack .flexBox {
        margin-top: 2vw;
    }
    footer .redBack {
        height: 21vw;
    }
    .bottomArea {
        padding: 4vw 4% 6vw;

    }
    p.name_address {
    	width: 90%
    }
    .footer_link_wrapper {
    	margin: 0 auto 5em;
    }
     .footer_link {
        font-size: 1.3rem;
    }
}