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


/*index.html*/

#loading {
	display: flex;
	justify-content: center;
	align-content: center;
	width: 100vw;
	height: 100vh;
	background-color: #fff;
	transition: all 1.2s;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}

#loading-logo {
	width: 240px;
	height: 126px;
	margin-top: 40vh;
	background-image: url("../image/logo.svg");
	background-repeat: no-repeat;
	background-size: contain;
	animation: happen 1.2s;
}

@keyframes happen {
  0% {
    opacity: 0;
  } 100% {
    opacity: 1;
  }
}


.loaded {
	opacity: 0;
	visibility: hidden;
}

.heroimage {
	margin: 0 auto 4.8rem;
	display: flex;
	justify-content: flex-end;
}

.herocatch {
	position:relative;
	width: 20%;
	z-index: 50;
	line-height: 1.2;
}


.white-block, .black-block {
	position: absolute;
	bottom: 16px;
	left: 0;
	width: 100%;
	letter-spacing: 0rem;
}


.black-block  {
	-webkit-background-clip: text;
	-moz-background-clip:text;
	-webkit-background-clip:text;
	-o-background-clip:text;
	-ms-background-clip:text;
	z-index: 1;
	overflow: hidden;
	color: rgb(33,109,54);
}

.black-block > p {
	font-weight: 800;
	display:block;
	font-size: 14.0rem;
}

.catch-lh {
	line-height: 1.0!important;
}

.black-block > p > span {
	font-weight: 800;
	color: transparent;
	line-height: 1.2!important;
	font-size: 8.0rem;
}

.white-block > p {
	color: #fff;
	font-weight: 800;
	display:block;
	font-size: 14.0rem;
}

.white-block > p > span {
	font-weight: 800;
	line-height: 1.2!important;
	font-size: 8.0rem;
}

.swiper-container {
	width: 100%;
	height: 640px;
}

.swiper-slide {
	background-size: cover;
	background-position: center;
}

.slider-1 {
	background-image:url("../image/top/slider-1.jpg");
}

.slider-2 {
	background-image:url("../image/top/slider-2.jpg");
}

.slider-3 {
	background-image:url("../image/top/slider-3.jpg");
}

.fontcolorandweight {
	color: rgb(33,109,54);
	font-weight: bold;
}

.fontcolorandweight2 {
	color: rgb(100,165,49);
	font-weight: bold;
}

.fontcolorandweight3 {
	color: orange;
	font-weight: bold;
}

.top_point {
	display: flex;
	width: 100%;
	background: gray;
	align-items: center;
	justify-content: center;
	padding: 1.6rem;
	margin-bottom: 4.0rem;
}

.top_point > p {
	color: #fff;
	font-size: 2.4rem;
}

.pgname {
	position: absolute;
	top: 4px;
	left: 4px;
	padding: 4px 8px;
	background: rgba(80,80,80,0.8);
	color: #fff;
	font-size: 2.0rem;
	font-weight: bold;
}
.pgname span {
	font-size: 1.2rem;
	color: #fff;
}

.pgapeal {
	position: absolute;
	top: 4px;
	left: 4px;
	font-size: 4.8rem;
	font-weight: bold;
	letter-spacing: 0.4;
	line-height: 1;
	padding: 16px;
	background: rgb(100,165,49);
	color: #fff;
}



.pgsum {
	position: absolute;
	bottom: 2.4rem;
	right: 8px;
	padding: 16px;
	background: rgba(80,80,80,0.8);
	color: #fff;
}

.pgsum-point {
	font-size: 2.4rem;
	font-weight: bold;
}

.pgsum-point::after {
    content: '';
    display: block;
    margin: 0.2rem auto 0;
    height: 1px;
    background:#B3D300;
	background:-moz-linear-gradient(left,);
	background:-webkit-linear-gradient();
}


.news ul {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

.news ul li {
	width: 23%;
	border: solid 1px #000;
}

.news ul li::before {
	content: "";
	display: block;
	padding-top: 100%;
}


.programLink {
	display: flex;
	justify-content: space-between;
}

.aboutLink {
	display: flex;
	justify-content:  space-between;
}



.plone {
	width: 49%;
	color: /*rgb(100,165,49)*/ #fff;
	font-size: 2.4rem;
	font-weight:800;
	text-align: center;
	background-size: cover;
	background-position: top;
}



.program-sub {
	text-align:left;
	font-size: 2.0rem;
	color: #fff;
}

.darkfilter {
	display: flex;
	justify-content: center;
	align-items: center;
	background: rgba(0,0,0,0.4);
	width: 100%;
	height: 100%;
}

.darkfilter>p,.darkfilter>div>p {
	font-weight: bold;
}

.darkfilter::before {
	content: "";
	display: block;
	padding-top: 100%;
}

.pl-health {
	background-image:url("../image/top/program-link-1.jpeg");
}

.pl-club {
	background-image: url("../image/top/program-link-2.jpeg");
}

.pl-personal {
	background-image: url("../image/top/program-link-3.jpeg");
}

.method {

}

.alone::before {
	content: "";
	display: block;
	padding-top: 32%;
}

.alone {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 49%;
	background-color: gray;
	color: #fff;
	font-size: 1.6rem;
	text-align: center;
}

.point-odd ,.point-even{
	display: flex;
	justify-content: space-between
}

.points-image {
	width: 300px;
	height: 200px;
	border: solid 1px #000;
}

/*ipad縦以下　トップページ*/
@media screen and (max-width: 896px) {

	#loading-logo {
	margin-top: 30vh;
}

	.heroimage {
		padding-bottom: 1.2rem;
		margin: 0 auto 1.2rem;
		justify-content: flex-end;
		flex-direction: column-reverse;
		width: 100%;
	}

	.herocatch {
		margin: 0 auto;
		position:static;
		width: 90%;
		z-index: 1;
	}

	.swiper-container {
		width: 100%;
		height: 440px;
	}

	.white-block, .black-block {
		position: static;
		width: 100%;
		line-height: 1.2!important;
		font-size: 4.0rem;
		font-weight: 700;
	}

	.white-block > p {
	font-size: 4.5rem;
}

.white-block > p > span {
	font-size: 5.6rem;
}

	.black-block > p {
	font-size: 4.5rem;
}

.black-block > p > span {
	font-size: 5.6rem;
}


	.white-block {
		display: none;
	}

	.hero h1 {
		font-size: 2.4rem;
	}

	.top_point {
		padding: 0.6rem;
	}

	.top_point > p {
	    font-size: 1.6rem;
	}

	.pgname {
		font-size: 1.6rem;
	}

	.pgsum {
		padding: 0.8rem;
	}

	.pgsum-point {
		font-size: 1.6rem;
		font-weight: bold;
	}

	.pgapeal {
		top: 4px;
		right: 4px;
		font-size: 1.6rem;
		letter-spacing: 0.4;
		line-height: 1;
		padding: 8px;
	}

	.plone {
		margin-bottom: 0.8rem;
	}

	.pl-health {
	background-image:url("../image/top/program-link-1.jpeg");
}

.pl-club {
	background-image: url("../image/top/program-link-2.jpeg");
}

.pl-personal {
	background-image: url("../image/top/program-link-3.jpeg");
}

	.alone {
		margin-bottom: 0.8rem;
	}
}

@media screen and (max-width: 420px) {

	.programLink {
		flex-direction: column;
	}

	.plone {
		width: 100%;
	}

	.darkfilter::before {
		padding-top: 80%;
	}

	.aboutLink {
		flex-direction: column;
	}

	.alone {
		width: 100%;
		font-size: 1.6rem;
	}

}




/*programpages*/

.program-hero {
	height: 480px;
}

.whitefilter {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	background: rgba(255,255,255,0.1);
	height: 100%;
}

.grayfilter {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	background: rgba(40,40,40,0.3);
	height: 100%;
}

.program-hero h1 {
	font-size: 4.0rem;
	color: #fff;
	font-weight: bold;
}

.program-intro {
	padding: 4.8rem 0;
	margin: 0 auto;
}

.program-intro h2{
	margin: 0 0 4.8rem 0;
	font-size: 3.2rem;
	line-height: 1.6;
}

.program-table {
	margin: 0 0 0 1.6rem;
	font-size: 2.0rem;
}

.program-table td {
	padding: 0.4rem 0;
}

.program-content {
	display:flex;
	padding: 10.4rem 0;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

.program-content-article {
	width: 50%;
}

.program-content-article h2 {
	font-size: 2.4rem;
	font-weight: bolder;
	padding: 0 0 0 1.6rem;
	margin-bottom: 3.2rem;
}

.program-content-article p {
	font-size: 2.0rem;
	line-height: 1.6;
}

.program-content-photo {
	width: 40%;
	padding-top: 26%;
	background-position: top;
	background-size: cover;
	background-repeat: no-repeat;
}

.ph-health {
	background-image:url("../image/top/slider-1.jpg");
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.program-health-1 {
	background-image:url("../image/health/health-1.jpeg");
	}

.program-health-2 {
	background-image:url("../image/health/health-2.jpeg");
	}

.program-health-3 {
	background-image:url("../image/health/health-3.jpeg");
	}

.program-health-4 {
	background-image:url("../image/health/health-4.jpeg");
	}


.ph-club {
	background-image:url("../image/top/slider-2.jpg");
	background-position: top;
	background-size: cover;
	background-repeat: no-repeat;
}

.program-club-1 {
	background-image:url("../image/club/club-1.jpeg");
	}

.program-club-2 {
	background-image:url("../image/club/club-2.jpeg");
	}

.program-club-3 {
	background-image:url("../image/club/club-3.jpeg");
	}

.program-club-4 {
	background-image:url("../image/club/club-4.jpg");
	}

.ph-personal {
	background-image:url("../image/top/slider-3.jpg");
	background-position: top;
	background-size: cover;
	background-repeat: no-repeat;
}

.program-personal-1 {
	background-image:url("../image/personal/personal-1.jpeg");
	}

.program-personal-2 {
	background-image:url("../image/personal/personal-2.jpeg");
	}

.program-personal-3 {
	background-image:url("../image/personal/personal-3.jpeg");
	}

.program-personal-4 {
	background-image:url("../image/personal/personal-4.jpeg");
	}

.program-personal-5 {
	background-image:url("../image/personal/personal-5.jpg");
	}

.gray-gra {
	background:linear-gradient(to right, #F7F7F7 88%, #fff 88%);
}

@media screen and (max-width: 896px) {

	.swiper-container {
		margin: 0 0 0.8rem 0;
	}

	.black-block >  span, .white-block > span {
		line-height: 2.2rem!important;
	}

	.program-content-photo {
		width: 100%;
		padding-top: 66%;
		margin: 0 0 1.6rem 0;
	}

	.program-content-article {
		width: 100%;
	}

	.gray-gra {
	background:#F7F7F7;
	}

	.mail-icon, .tel-icon {
		width: 33%;
	}

	.fa-envelope, .fa-phone {
		font-size: 4.8rem;
	}

	.program-intro {
		padding: 2.4rem 0;
		margin: 0 auto;
	}

	.program-intro h2{
		margin: 0 0 2.4rem 0;
		font-size: 2.0rem;
	}

	.program-content {
		padding: 5.6rem 0;

	}


}


/*about.html*/

.about-hero {
	display: flex;
	justify-content: center;
	align-items: center;
	background: gray;
	height: 24.0rem;
}

.about-hero h1 {
	color: #fff;
}

.bg-arch-logo{
  display:block;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:url("../image/logo.png") center no-repeat;
  background-size:contain;
	z-index: -50;
}


.three-points-container {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;

}

.three-points {
	width: 28%;
	height: 325px;
	text-align: center;
	padding: 2%;
}

.three-points h3 {
	font-size: 2.0rem;
	text-align: center;
	margin: 0 0 2.4rem 0;
}

.three-points h3::after {
	content: '';
    display: block;
    margin: 2.4rem auto 0;
    width: 4.0rem;
    height: 2px;
    background:rgb(100,165,49);
}

.three-points p {
	font-size: 1.6rem;
	text-align: left;
}

.trainer {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 100%;
}

.trainer-left {
	width: 40%;
}

.trainer-one {
	background-image:url("../image/about/trainer-1.jpeg");
	padding-top:50%;
	background-position: top;
	background-size: cover;
}

.trainer-two {
	background-image:url("../image/about/trainer-2.jpeg");
	padding-top:26%;
	background-position: top;
	background-size: cover;
}

.trainer-name {
	margin: 0 0 1.6rem 0;
	padding-left: 1.2rem;
	text-align: left;
	font-size: 2.0rem;
}

.trainer-right {
	width: 48%;
}


.profile {
	margin: 0 0 2.0rem 0;
	font-size: 1.6rem;
}

.license {
	margin: 0 0 1.6rem 0;
	font-size: 1.2rem;
}

.license span {
	padding: 0 0 0 0.8rem;
	border-left: solid 2px #FCB30B;
}

.message {
	margin: 0 0 1.6rem 0;
	font-size: 1.2rem;
}

.message span {
	padding: 0 0 0 0.8rem;
	border-left: solid 2px #FCB30B;
}

.pc-content {
	margin: 0 0 8.0rem 0;
}

.pc-content h4 {
	margin: 0 0 1.6rem 0;
	padding-left: 1.2rem;
	text-align: left;
	font-size: 2.4rem;
}

.bg-logo {
	background-image: url("../image/about/pc-logo.jpeg");
	width: 40%;
	padding-top: 26%;
	background-repeat: no-repeat;
	background-position: top;
	background-size: contain;
	margin: 0 auto 4.8rem;
}

.pc-case {
	padding: 3.2rem;
	margin: 0 0 4.8rem 0;
}

.pc-content-block {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 100%;
}

.pc-content .heading {
	text-align: left;
}

.pc-content .article {
	width: 50%;
}

.pc-image-one {
	background-image:url("../image/about/aboutpc-1.jpeg");
	width: 40%;
	padding-top:26%;
	background-position: top;
	background-size: cover;
}

.pc-image-two {
	background-image:url("../image/about/aboutpc-2.jpg");
	width: 40%;
	padding-top:26%;
	background-position: top;
	background-size: cover;
}

.pc-image-three {
	background-image:url("../image/about/aboutpc-3.jpg");
	width: 40%;
	padding-top:26%;
	background-position: top;
	background-size: cover;
}

.pc-image-four {
	background-image:url("../image/about/aboutpc-4.jpg");
	width: 40%;
	padding-top:26%;
	background-position: top;
	background-size: cover;
}

.pc-image-five {
	background-image:url("../image/about/aboutpc-5.jpg");
	width: 40%;
	padding-top:26%;
	background-position: top;
	background-size: cover;
}

.pc-image-six {
	background-image:url("../image/about/aboutpc-6.jpg");
	width: 40%;
	padding-top:26%;
	background-position: top;
	background-size: cover;
}

.pc-image-seven {
	background-image:url("../image/about/aboutpc-7.jpg");
	width: 40%;
	padding-top:26%;
	background-position: top;
	background-size: cover;
}

.pc-image-eight {
	background-image:url("../image/about/aboutpc-8.jpg");
	width: 40%;
	padding-top:40%;
	margin: 0 auto;
	background-position: top;
	background-size: cover;
}

.pc-image-nine {
	background-image:url("../image/about/aboutpc-9.jpg");
	width: 40%;
	padding-top:26%;
	margin: 0 auto;
	background-position: top;
	background-size: cover;
}

.name {
	margin: 0 0 1.6rem 0;
	padding-left: 1.2rem;
	text-align: left;
	font-size: 2.0rem;
}

.qanda {
	font-size: 1.6rem;
	margin: 3.2rem 0 0 0;
	padding: 0.8rem;
	background:#fff;
}

.question {

}

@media screen and (max-width: 896px) {

	.three-points-container {
		flex-direction: column
	}

	.three-points {
		width: 96%;
		height: auto;
		margin: 0 0 3.2rem 0;
	}

	.trainer {
		flex-direction: column;
		width: 100%;
	}

	.trainer-left {
		width: 100%;
	}

	.trainer-right {
		width: 100%;
	}

	.trainer-one, .trainer-two {
		width: 100%;
		margin: 0 0 1.6rem 0;
		padding-top: 100%;
	}

	.bg-logo {
		width: 100%;
		padding-top: 66%;
		margin: 0 auto 1.6rem;
	}



	.pc-content-block {
		flex-direction: column;
	}

	.pc-content .article {
		width: 100%;
	}

	.pc-image-one,.pc-image-two,.pc-image-three,.pc-image-four,.pc-image-five,.pc-image-six,.pc-image-seven,.pc-image-nine {
		width: 100%;
		padding-top: 66%;
		margin: 0 0 1.6rem 0;
	}

	.pc-image-eight {
		width: 100%;
		padding-top: 100%;
		margin: 0 auto 1.6rem;
}

	.pc-image-eight {

	}

	.pc-case {
	padding: 1.2rem;
}

}


/*compliance.html*/

.comtable {
	margin: 0 0 8.0rem 0;
	border: solid 1px ;
}

.bg-green {
	background-color: green;
}
