@charset "utf-8";
/*------------------------------------------------------------
	汎用スタイル
------------------------------------------------------------*/
/* 81-LXH */
/* clearfix */	
.clearfix:after {content: "";display: block;clear: both;}
/* flex */	
.flex,.flexA,.flexB,.flexC {display: flex;flex-wrap: wrap;}
.flexA {justify-content: space-around;}
.flexB {justify-content: space-between;}
.flexC {justify-content: center;}
/*------------------------------------------------------------
	common
------------------------------------------------------------*/
.zen {
	font-family: "Zen Maru Gothic", serif;
}
.content {
	margin: 0 auto;
	max-width: 127rem;
}
@media all and (max-width: 896px) {
	.content {
		margin: 0 4rem;
		max-width: inherit;
	}
}


.headLine01 {
	margin-bottom: 4.8rem;
	text-align: center;
}
.headLine01 img {
	width: 105rem;
}
.headLine01 .jp {
	margin-top: 1.8rem;
	display: block;
	font-weight: bold;
 font-size: calc(var(--size) * 4.3);
	letter-spacing: 0.1em;
	color: #38ac6c;
}
@media all and (max-width: 896px) {
	.headLine01 .jp {
/*		font-size: 1.75rem;*/
  font-size: calc(var(--size) * 1.8);
	}
}
.headline02 {
	margin-bottom: 2.8rem;
	text-align: center;
	font-weight: bold;
}
.headline02 .en {
	display: block;
	font-family: "Noto Sans", sans-serif;
 font-size: calc(var(--size) * 2.1);
	font-weight: bold;
	letter-spacing: 0.1rem;
	color: #fab445;
}
.headline02 .jp {
 font-size: calc(var(--size) * 3.5);
	letter-spacing: 0.1em;
	color: #38ac6c;
}
@media all and (max-width: 896px) {
	.headline02 .jp {
/*		font-size: 1.75rem;*/
  font-size: calc(var(--size) * 1.75);
		letter-spacing: 0;
		line-height: 1.3;
		display: block;
	}
	.headline02 .en {
/*		font-size: 1.1rem;*/
  font-size: calc(var(--size) * 1.1);
		letter-spacing: 0.05rem;
	}
}


.comBtnBox {
	margin: 0 auto;
	width: 92rem;
}
ul.comBtn {
	margin-top: 2rem;
	display: flex;
	gap: 1rem;
}
ul.comBtn li {
	width: calc(50% - 0.5rem);
}
.comBtn a {
	padding: 2rem 6.7rem 2rem 5rem;
	height: 100%;
/* min-height: 133px;*/
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	color: #38ac6c;
	font-size: calc(var(--size) * 2.5);
	font-weight: bold;
	background: #fff url(../images/ico_arrow_01.png) no-repeat right 0.5rem bottom 0.5rem / 3.4rem;
	border: 0.5rem solid #7aac6b;
	border-radius: 3rem;
	box-shadow: 1rem 2rem 1rem rgba(0, 0, 0, 0.16);
}
.comBtn .enTtl {
	min-width: 11rem;
	padding-top: 0.2rem;
	position: absolute;
	left: 4.5rem;
	top: 2rem;
	font-size: 1.8rem;
	font-family: "Zen Maru Gothic", serif;
	letter-spacing: -0.02em;
	transform: rotate(90deg);
	transform-origin: left top;
	border-top: 0.1rem solid #67cbb0;
}
.comBtn .ttl {
	display: block;
	margin-left: 2rem;
	font-size: calc(var(--size) * 4.3);
	letter-spacing: 0.05em;
}
.comBtn .ttl img {
	margin: -1.2rem 0.7rem 0 0;
	vertical-align: middle;
	width: 5.3rem;
}
ul.comBtn li a {
	display: block;
 height: 100%;
	font-size: calc(var(--size) * 2.3);
 padding: 2rem 1rem 2rem 3rem;
 line-height: 1.7;
 min-height: auto;
}
ul.comBtn .ttl {
	margin: 0.5rem 0 0 0;
 font-size: calc(var(--size) * 2.78);
 line-height: 1.4;
}
.comBtn .mypage a {
	color: #FAB445;
	border-color: #FAB445;
	background-image: url(../images/ico_arrow_02.png);
}
.comBtn .mypage .enTtl {
	border-color: #f8b445;
}
.comBtn .training a {
	color: #43bfba;
	border-color: #87c0ba;
	background-image: url(../images/ico_arrow_03.png);
}
.comBtn .training .ttl img {
	margin-top: 0;
}
.comBtn .training .enTtl {
	border-color: #67cbb0;
}
@media all and (min-width: 898px) {
	.comBtn a:hover {
		opacity: 0.7;
	}
}
@media all and (max-width: 896px) {
	.comBtnBox {
  display: block;
		margin: 0 1.5rem;
		width: auto;
	}
	.comBtn a {
  display: block;
		height: auto;
		padding: 1.5rem 2rem 1.5rem 2.5rem;
/*		font-size: 1.2rem;*/
  font-size: calc(var(--size) * 1.4);
		border-width: 0.3rem;
		border-radius: 1.5rem;
		background-size: 2rem;
		background-position: right 0.3rem bottom 0.2rem;
		box-shadow: 0 1rem 0.5rem rgba(0, 0, 0, 0.16);
	}
	.comBtn .enTtl {
		min-width: 5.5rem;
		top: 1rem;
		left: 2.2rem;
		font-size: 0.9rem;
		letter-spacing: -0.1em;
		text-align: left;
	}
	.comBtn .txt {
		width: 8.4rem;
		line-height: 2.05;
	}
 .service div.comBtn .txt{
  font-size: calc(var(--size) * 1.7);
  line-height: 1.3;
 }
 .service div.comBtn .ttl{
  font-size: calc(var(--size) * 2.2);
 }
 .service .comBtn .txt{
  font-size: calc(var(--size) * 1.6);
 }
	.comBtn .ttl {
		margin-left: 1.5rem;
  font-size: calc(var(--size) * 1.9);
	}
 ul.comBtn .ttl{
  margin-left: 0;
  font-size: calc(var(--size) * 2.5);
 }
	.comBtn .ttl img {
		margin: -0.6rem 1rem 0 0;
		width: 2.6rem;
	}
	ul.comBtn {
		margin-top: 1.5rem;
		gap: 0.8rem;
  display: block;
	}
	ul.comBtn li {
  width: 100%;
  margin-top: 1.5rem;
	}
	ul.comBtn li a {
  padding: 1rem 2rem;
  font-size: calc(var(--size) * 1.6);
  text-align: center;
  line-height: 1;
	}
 ul.comBtn li a .txt{
  line-height: 1.5;
 }
	ul.comBtn li .ttl img {
		display: block;
		margin: 0 auto 0.8rem;
		width: 3.8rem;
	}
	.comBtn .mypage .ttl {
  font-size: calc(var(--size) * 2.5);
	}
	ul.comBtn .training .ttl img {
		width: 3.7rem;
	}
 .service .comBtn .ttl {
  margin-left: 0;
  font-size: calc(var(--size) * 2.2);
	}
}

/* headLine03 */
.headLine03 {
	margin-bottom: 2.9rem;
	text-align: center;
 font-size: calc(var(--size) * 4.1);
	letter-spacing: 0.08em;
}
@media all and (max-width: 896px) {
	.headLine03 {
		margin-bottom: 1.5rem;
/*		font-size: 1.8rem;*/
  font-size: calc(var(--size) * 1.8);
		line-height: 1.8;
	}

}


/* centerTxt */
.centerTxt {
	margin-bottom: 9.8rem;
	text-align: center;
	font-weight: 500;
	font-size: 2.2rem;
 font-size: calc(var(--size) * 2.2);
	line-height: 1.47;
	letter-spacing: 0.1em;
}
@media all and (max-width: 896px) {
	.centerTxt {
  font-size: calc(var(--size) * 1.5);
  margin-bottom: 2rem;
  text-align: left;
  line-height: 1.7;
	}
}


.sizeBox {
	margin: -0.7rem 0 0 4.4rem;
}
.sizeBox .title {
	margin: 0 0 0.7rem 0.5rem;
	color: #fff;
	font-size: 1.4rem;
	font-weight: 500;
	letter-spacing: 0.08em;
}
.sizeBox .sizeUl {
	display: flex;
	gap: 0 1rem;
}
.sizeBox .sizeUl li a {
	padding-bottom: 0.2rem;
	width: 3.7rem;
	height: 3.7rem;
	color: #38AC6C;
	font-size: 1.4rem;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 50%;
 line-height: 1;
}
.sizeBox .sizeUl li .on {
	background-color: #38AC6C;
	color: #fff;
}
@media all and (max-width: 898px) {
 .sizeBox{
  display: flex;
  position: fixed;
  margin: 0;
  background-color: #38AC6C;
  z-index: 100;
  justify-content: space-between;
  align-items: center;
  border-radius: 10rem;
  top: 0.9rem;
  right: 7rem;
  width: 25rem;
  padding: 0.8rem 1.5rem;
 }
 .sizeBox .title{
  margin: 0;
  font-weight: bold;
  font-size: 1.5rem;
 }
}
@media (min-width: 500px) and (max-width: 898px) {
 .sizeBox{
  width: 27rem;
  padding: 1rem 2rem;
  top: 1rem;
  right: 8rem;
 }
 .sizeBox.pc{
  display: none;
 }
}
@media all and (min-width: 898px) {
	.sizeBox .sizeUl li a:hover {
		opacity: 0.7;
	}
}
/* fadeInUp */
.fadeInUp {
	opacity: 0;
	transform: translate(0,100px);
	-webkit-transition: all .5s;
	transition: all .25s;
}
.fadeInUp.on {
	opacity: 1;
	transform: translate(0,0);
}
@media (min-width: 500px) and (max-width: 898px) {
 .comBtn .mypage .ttl{
  font-size: calc(var(--size) * 3);
 }
 
}
.top_Btn{
 position: fixed;
 right: 4rem;
 bottom: 4rem;
 border: solid 1px #bbb;
 background-color: #fff;
 z-index: 10;
 border-radius: 100%;
 width: 10rem;
 height: 10rem;
 cursor: pointer;
 transition: .0s!important;
}
.top_Btn p{
 width: fit-content;
 position: absolute;
 left: 0;
 right: 0;
 top: 2rem;
 bottom: 0;
 margin: auto;
 display: flex;
 align-items: center;
 text-align: center;
 line-height: 1.4;
 font-size: 1.6rem;
 font-weight: bold;
 color: #38ac6c;
}
.top_Btn p::after{
 position: absolute;
 content: "";
 display: inline-block;
 vertical-align: middle;
 color: #38ac6c;
 line-height: 1;
 width: 1em;
 height: 1em;
 border: 0.18em solid currentColor;
 border-left: 0;
 border-bottom: 0;
 box-sizing: border-box;
 transform: translateY(25%) rotate(-45deg);
 top: 0;
 left: 0;
 right: 0;
 margin: auto;
 border-radius: 2px;
}
.top_Btn:hover{
 opacity: 0.7;
}
.comBtn.findBtn{
 margin-top: 2rem;
}
.comBtn.findBtn a{
 font-size: calc(var(--size) * 2.78);
}
@media all and (max-width: 898px) {
 .top_Btn{
  width: 9rem;
  height: 9rem;
  right: 2rem;
  bottom: 2rem;
 }
 .top_Btn p::after{
  top: -10%;
  border-radius: 0px;
 }
 .comBtn.findBtn a{
  font-size: calc(var(--size) * 2.1);
 }
}
@media (min-width: 500px) and (max-width: 898px){
 .comBtn.findBtn a{
  font-size: calc(var(--size) * 2.7);
 }
}