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

#main {
	height: 100vh;
	padding-top: var(--head_padding_top);
}
#main > .inner{
	width: 100%;
	height: 100%;
	position: relative;
}
#main .splide{
	height: 100%;
}
#main .splide .splide__track {
  height: 100%;
}
#main .splide .splide__list .splide__slide {
  width: 100%;
  height: 100%;
}

#main .txtArea {
  width: fit-content;
	padding: 50px 40px 50px 50px;
	isolation: isolate;
	border-radius: 25px;
	backdrop-filter: blur(5px);
	background: rgba(255,255,255,0.8);
	position: absolute;
	top:50%;
	left:calc((150/var(--vw))*100%);
	transform: translateY(-50%);
}
#main .txtArea .copy01{
  font-size: calc(18/14 * 1em);
	line-height: calc(27/18);
	letter-spacing: 0.15em;
	color: var(--bace);
}
#main .txtArea .copy02{
  font-size: calc(27/14 * 1em);
	line-height: calc(55/26);
	letter-spacing: 0.15em;
	color: var(--cc);
}
#main .txtArea .exArea{
	width: calc(100% - 10px);
	column-gap: 15px;
	margin-top: 15px;
}
#main .txtArea .exArea li{
	color: #FFF;
	background: var(--cc);
  font-size: calc(15/14 * 1em);
	line-height: calc(18/15);
	letter-spacing: 0.15em;
	text-align: center;
	padding: 0.5em 0;
	flex: 1;
}
#main .txtArea .access{
	width: calc(100% - 10px);
	position: relative;
  font-size: calc(15/14 * 1em);
	line-height: calc(18/15);
	color: var(--cc);
	padding: 5px 45px;
	margin-top: 20px;
}
#main .txtArea .access::before,
#main .txtArea .access::after{
	content:'';
	display: block;
	width: 8px;
	height: 100%;
	border: 1px solid var(--cc);
	position: absolute;
	top:0;
}
#main .txtArea .access::before{
	border-right: none;
	left:0;
}
#main .txtArea .access::after{
	border-left: none;
	right:0;
}
#main .txtArea .access p{
  text-align: justify;      /* 全体の両端揃え */
  text-align-last: justify; /* 最終行（1行のみの場合）の両端揃え */
}

#main .txtArea .access p + p{
  margin-top: 0.25em;
}



body.top .top_bnrbox h2{margin-bottom: 60px;}

main .ctaBtList {
	max-width: 800px;
	width: 100%;
	margin: 0 auto;
	column-gap: 25px;
	margin-bottom: 100px;
}
main .ctaBtList li{
	flex: 1;
}
main .ctaBtList li a{
	height: 60px;
	background: #FFF;
	isolation: isolate;
	border-radius: 12px;
	box-shadow: 0px 0px 10px 0px var(--cc_shadow);
	color: var(--cc);
	text-align: center;
	font-size: calc(18/14 * 1em);
	padding: 0.5em 3em;
	position: relative;
}
main .ctaBtList li a::before{
	aspect-ratio: 11/13;
	content: '';
	display: block;
	mask-size: 100% 100%;
	height: 18px;
	mask-image: url('../img/icon_arrow01.svg');
	background: var(--cc);
	position: absolute;
	top:calc(50% - 10px);
	right:20px;
}
main .ctaBtList li.line a::before{
	background: #00b900;
}