/* CSS Document */

body.top .kv{width: 100%; position: relative;}
body.top .kv .slide{position: relative; z-index: 1; width:100%; height:100vh; height:100dvh;}
body.top .kv .slide > *{position: absolute; inset:0; z-index: 1; width: 100%; height: 100%;
opacity:1; transition: opacity 1s;}
body.top .kv .slide > *:first-child{z-index: 3; opacity:1;}
body.top .kv .slide > *:nth-child(n+2):not(:last-child){opacity:0;}
body.top .kv .slide > *:nth-child(n+3):last-child{opacity:1; z-index: 2;}
body.top .kv .slide picture img{width:100%; height:100%;}
body.top .kv .text{color:#FFF;
position: absolute; margin: auto; z-index: 4; width: var(--size-inner-1100);}
body.top .kv .text h2{font-size: min(100px,calc(41 * var(--size-sp))); font-weight: 700; line-height: 1.25em; white-space: pre-wrap;}
body.top .kv .text h2 span{margin: 0 -0.5em;}
body.top .kv .text .en{font-size: 31px; margin-top: calc(1em - 6px);}
@media screen and (min-width: 1000px) {
	body.top .kv .text{text-align: left; bottom: 20%; left: 0; right: 0;}
}
@media screen and (max-width: 999px) {
	body.top .kv .slide{max-height: calc(700 * var(--size-sp));}
	body.top .kv .text{text-align: center; inset:0; width:100%; height:100%;
	display: flex; justify-content: center; align-items: center;}
	/* body.top .kv .text h2{font-size: 41px;} */
}

.top_sec01{padding: min(125px,calc(50 * var(--size-sp-pc1vw))) 0 min(150px,calc(50 * var(--size-sp-pc1vw)));}
.top_sec01 .inner{position: relative;}
.top_sec01 .t{position: relative; z-index: 2;}
.top_sec01 .t h4{margin-top: -0.25em; line-height: 1.5em;}
.top_sec01 .t h4 + *{font-size: min(21px,calc(16 * var(--size-sp))); font-weight: 700; line-height: 2em;
margin-top: min(70px,calc(50 * var(--size-sp)));}
.top_sec01 .p{position: absolute; top:0; right:max(-62px,min(0px,calc((1vw - 11.5px) * -50 / 1.1) ));
width:min(488px,max(340px,calc(340px + (1vw - 10px) * 50 / 1.1))); max-width: 100%; height:100%; z-index: 1;
display: flex; flex-direction: column; justify-content: space-between; align-items: center;}
.top_sec01 .p img{border-radius: var(--size-radius);}
@media screen and (min-width: 1000px) {
	.top_sec01 .p > *:nth-child(1){margin-right: auto;}
	.top_sec01 .p > *:nth-child(1) img{margin-top: -200px;}
	.top_sec01 .p > *:nth-child(2){margin-left: auto;}
	.top_sec01 .p > *:nth-child(3){margin-right: calc(100% * 31 / 488);}
}
@media screen and (max-width: 999px) {
	.top_sec01 .p{width:100%; position: relative; margin-top: calc(1% * 35 / 3.35); gap:0 calc(1% * 17.5 / 3.35); flex-direction: row;}
	.top_sec01 .p > *:nth-child(1) img{margin-top: 0;}
}

:root{
--top_sec02-kasane-mgn:min(70px,calc(35 * var(--size-sp)));
}
.top_sec02{padding: min(125px,calc(50 * var(--size-sp-pc1vw))) 0 min(90px,calc(50 * var(--size-sp-pc1vw)));}
.top_sec02 .inner.kasane{max-width:var(--size-inner-1350); margin-top: var(--top_sec02-kasane-mgn);}
.top_sec02 .inner.kasane dd{border-radius: var(--size-radius); overflow: hidden;}
.top_sec02 .inner.kasane dd + dd{margin-top: 50px;}
.top_sec02 .inner.kasane dd > div{position: absolute; inset:0; width:100%; height:100%; z-index: 2; /* background-color: rgba(0,0,0,0.35); */
	padding: 0 calc(1% * 125 / 13.5);
	display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
}
.top_sec02 .inner.kasane dd > div h4{font-size: min(45px,calc(25 * var(--size-sp))); margin-bottom: 1em;}
.top_sec02 .inner.kasane dd > div h4 + *{font-size: min(18px,calc(16 * var(--size-sp))); line-height: min(40px,calc(30 * var(--size-sp)));}
.top_sec02 .inner.kasane dd > div::before{
	counter-increment: number 1;
	content: counter(number, decimal-leading-zero);
	font-size: min(200px,calc(120 * var(--size-sp))); font-family: var(--font-en);
	position: absolute; top:0; right:0.1em; margin: -0.1em 0;
}
.top_sec02 .kasane > *{top:calc(var(--size-header-H) + var(--top_sec02-kasane-mgn));}
@media screen and (max-width: 999px) {
	.top_sec02 .inner.kasane dd > div{padding-bottom: calc(1% * 40 / 3.35); justify-content: flex-end;}
}

.top_sec03{padding: min(125px,calc(50 * var(--size-sp-pc1vw))) 0 min(150px,calc(50 * var(--size-sp-pc1vw)));}
.top_sec03 *[class*="cmn_subt"] + h4{
	margin: min(60px,calc(40 * var(--size-sp))) 0 min(40px,calc(30 * var(--size-sp)));
	font-size: min(47px,calc(20 * var(--size-sp)));
}
.top_sec03 .num_list{margin: min(70px,calc(50 * var(--size-sp))) auto 0; width:100%; max-width: 960px;
gap:min(90px,calc(55 * var(--size-sp))) 0; display: flex; flex-direction: column;}
.top_sec03 .num_list dl{display: flex; justify-content: space-between;}
.top_sec03 .num_list dd{max-width:100%;}
.top_sec03 .num_list dd[delay="0"]{width:27em; display: flex; flex-direction: column; align-items: flex-start;}
.top_sec03 .num_list dd[delay="0"] h5{margin: 1em 0;}
.top_sec03 .num_list .point{color:var(--color-B); font-size: min(20px,calc(13 * var(--size-sp))); font-family: var(--font-en);
gap:1em 0; display: flex; flex-direction: column; align-items: center;}
.top_sec03 .num_list .point::before,
.top_sec03 .num_list .point::after{display: block; margin: -0.2em 0;}
.top_sec03 .num_list .point::before{content: 'POINT';}
.top_sec03 .num_list .point::after{
	counter-increment: number 1;
	content: counter(number, decimal-leading-zero);
	font-size: 5em;
}
.top_sec03 .num_list dd[delay="1"]{width:455px; display: flex; justify-content: center; align-items: center;}
.top_sec03 .num_list dd[delay="1"] img{margin: 0 auto;}
.top_sec03 .num_list img[src*="-point02."]{width:420px;}
.top_sec03 .num_list img[src*="-point03."]{width:350px;}
.top_sec03 .num_list dd[delay="1"] .chart{max-width: 100%; margin-right: auto;
display: flex; flex-direction: column; align-items: center;}
.top_sec03 .num_list dd[delay="1"] .chart > li{
	border:solid 1px var(--color-B-T030); position: relative; border-radius: calc(1em * 60 / 18);
	font-size: min(18px,calc(13 * var(--size-sp))); font-weight: 700;
	width:388px; max-width: 100%; min-height: calc(1em * 60 / 18);
	display: flex; justify-content: center; align-items: center;
}
:root{
--topsec03-point-icon-W:calc(1em * 30 / 18);
--topsec03-point-arrow-border:2px;
--topsec03-point-arrow-W:0.4em;
--topsec03-point-arrow-pad:0.2em;
}
.top_sec03 .num_list dd[delay="1"] .chart > li img{width:var(--topsec03-point-icon-W); height:var(--topsec03-point-icon-W);
position: absolute; margin-left: calc((var(--topsec03-point-icon-W) + 1.5em) * -2);}
.top_sec03 .num_list dd[delay="1"] .chart > div{position: relative; font-size: min(30px,calc(15 * var(--size-sp))); height:max(1em,16px);
display: flex; flex-direction: column; align-items: center;}
.top_sec03 .num_list dd[delay="1"] .chart > div::before{content:''; display: block; flex-grow: 1;
border-left: solid var(--topsec03-point-arrow-border) var(--color-B);}
.top_sec03 .num_list dd[delay="1"] .chart > div:last-of-type{padding-bottom: var(--topsec03-point-arrow-pad);}
.top_sec03 .num_list dd[delay="1"] .chart > div:last-of-type::after{
	content:''; display: block; width:var(--topsec03-point-arrow-W); height:var(--topsec03-point-arrow-W);
	border-bottom: solid var(--topsec03-point-arrow-border) var(--color-B);
	border-left: solid var(--topsec03-point-arrow-border) var(--color-B);
	position: absolute; bottom: calc(var(--topsec03-point-arrow-pad) + 1px); transform: rotate(-45deg);
}
@media screen and (min-width: 1000px) {
	.top_sec03 .num_list dl:nth-of-type(2n){flex-direction: row-reverse;}
}
@media screen and (max-width: 999px) {
	.top_sec03 .num_list dl{gap:35px 0; flex-direction: column; align-items: center;}
	.top_sec03 .num_list dd[delay="1"] .chart{margin-right: 0;}
}

:root{
--topsec03-menu-arrow-W:40px;
--topsec03-menu-arrow-W-hover:70px;
}
.top_sec03 .box_menu{margin-top: min(180px,calc(55 * var(--size-sp-pc1vw))); display: flex; justify-content: space-between;}
.top_sec03 .box_menu dd[p] > *{width:100%;
border-radius: var(--size-radius-sp8); overflow: hidden;}
.top_sec03 .box_menu dd[a],
.top_sec03 .box_menu dd[a] > *{display: flex; justify-content: center; align-items: center;}
.top_sec03 .box_menu dd[a] > *{position: absolute; margin: 0 auto; background: var(--grad-BK);
width:1em; height:1em; border-radius: 100%;
transition: width var(--transition-fast)
					 ,height var(--transition-fast)
					 ,opacity var(--transition-fast);
}
.top_sec03 .box_menu dd[a] > * svg{width:calc(100% * 25 / 70);}
.top_sec03 .box_menu dd[a] > * svg[fn="arrow-btn"] *{stroke:#FFF;}
.top_sec03 .box_menu dt{text-align: center; white-space: pre-wrap;
font-size: 16px; font-weight: 400;
transition: font-size var(--transition-fast)
					 ,font-weight var(--transition-fast);}


.top_sec03 .box_company{margin-top: 290px; display: flex; justify-content: space-between; align-items: flex-end;}
.top_sec03 .box_company > *{width:500px; max-width: 48%;}
.top_sec03 .box_company .L{
	height:min(260px,calc(174 * var(--size-sp))); background: var(--grad-BK); border-radius: var(--size-radius-sp8);
	font-size: min(50px,calc(34 * var(--size-sp))); font-family: var(--font-en);
	display: flex; justify-content: center; align-items: center;
}
.top_sec03 .box_company .btn{margin-top: min(70px,calc(56 * var(--size-sp)));}
@media screen and (min-width: 1000px) {
	.top_sec03 .box_menu{height:410px;}
	.top_sec03 .box_menu > *{width:calc(1% * 200 / 11); transition: width var(--transition-fast);}
	.top_sec03 .box_menu > *:hover{width:calc(1% * 250 / 11);}
	.top_sec03 .box_menu dd[p] > *{transition: margin-top var(--transition-fast);}
	.top_sec03 .box_menu > *:hover dd[p] > *{margin-top: -50px;}
	.top_sec03 .box_menu dd[a]{font-size: var(--topsec03-menu-arrow-W); margin-bottom: 25px;
		transition: margin-bottom var(--transition-fast);
	}
	.top_sec03 .box_menu > *:hover dd[a]{font-size: var(--topsec03-menu-arrow-W-hover); margin-bottom: 50px;}
	.top_sec03 .box_menu dd[a] > *{opacity:0;}
	.top_sec03 .box_menu > *:hover dd[a] > *{opacity:1;}
	.top_sec03 .box_menu dt{margin: 0 -2em -100%;}
	.top_sec03 .box_menu > *:hover dt{font-size: 24px; font-weight: 700;}
	.top_sec03 .box_company .R > .L{display: none;}
}
@media screen and (max-width: 999px) {
	:root{
	--topsec03-menu-arrow-Wsp:min(var(--topsec03-menu-arrow-W-hover),calc(44.8 * var(--size-sp)));
	}
	.top_sec03 .box_menu,
	.top_sec03 .box_company{flex-direction: column;}
	.top_sec03 .box_menu{gap:40px 0;}
	.top_sec03 .box_menu > *{width:100%;}
	.top_sec03 .box_menu dl{display: flex; flex-direction: column;}
	.top_sec03 .box_menu dd[a]{font-size: var(--topsec03-menu-arrow-Wsp);}
	.top_sec03 .box_menu dt{padding-top: calc(var(--topsec03-menu-arrow-Wsp) / 2 + 0.75em); font-size: 18px; font-weight: 700;}
	.top_sec03 .box_company{margin-top: calc(50 * var(--size-sp));}
	.top_sec03 .box_company > *{width: 100%; max-width: 100%;}
	.top_sec03 .box_company > .L{display: none;}
	.top_sec03 .box_company .cmn_subt2{margin-bottom: 1em;}
	.top_sec03 .box_company .btn{display: flex; justify-content: center; align-items: center;}
}

.top_news{background-color: var(--color-B-T010); padding: min(110px,calc(50 * var(--size-sp))) 0;}
.top_news .inner{
	/* max-width:var(--size-inner-980); */
	position: relative;
	display: flex; justify-content: space-between;
}
@media screen and (min-width: 1000px) {
	.top_news .inner{min-height: 172px;}
	.top_news .inner .news_list{flex-grow: 1; max-width: 630px;}
	.top_news .inner .more{position: absolute; left:0; bottom:0;}
}
@media screen and (max-width: 999px) {
	.top_news .inner{flex-direction: column;}
	.top_news .inner .more{order:1; display: flex; justify-content: flex-end;}
	.top_news .inner .more > .btn_more{font-size: min(18px,calc(14 * var(--size-sp))); margin-top: calc(-1em * 28 / 18);}
	.top_news .inner .more > .btn_more svg{height: calc(1em * 28 / 18);}
	.top_news .inner .news_list{order:2; margin-top: 30px;}
	.top_news .inner .news_list dl{gap: 0.5em 0; flex-wrap: wrap;}
	.top_news .inner .news_list dl dt,
	.top_news .inner .news_list dl dt a{width:100%;}
	.top_news .inner .news_list dl dt a{display: block;}
}