@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Noto+Sans+JP:wght@100..900&display=swap');
*{
	box-sizing: border-box;
}

.w1200,
.w1000{
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	color: #333;
	font-weight: 500;
}
.w1200{
	max-width: 1200px;
}

.ttl01{
	line-height: 1;
	margin-bottom: 50px;
	span{
		display: block;
		text-align: center;
	}
	.en{
		font-family: "Montserrat", sans-serif;
		color: #F7C530;
		font-weight: bold;
		font-size: 18px;
		margin-bottom: 10px;
	}
	.ja{
		font-weight: 500;
		font-size: 38px;
	}
	.white{
		color: #fff;
	}
}

#emergency_area{
	background: #EDEDED;
	padding: 30px 0;
	.ttl{
		font-size: 20px;
		margin-bottom: 8px;
		font-weight: bold;
	}
	.text01{
		font-size: 16px;
		line-height: 1.8;
		font-weight: bold;
	}
	.text02{
		font-size: 20px;
		color: #E70509;
		font-weight: bold;
		margin-top: 18px;
		line-height: 1;
	}
	.text03{
		line-height: 1;
		margin-top: 15px;
		a{
			color: #333;
			font-weight: 600;
			font-size: 16px;
			&:hover{
				color: #0084BB;
			}
		}
	}
}

#mv{
	background: url(../images/top/mv_bg.jpg) no-repeat center / cover;
	overflow: hidden;
	.w1000{
		display: flex;
		align-items: center;
		height: calc(100vh - 80px);
		padding-bottom: 50px;
	}
	.box{
		position: relative;
		margin-left: 130px;
		width: 870px;
	}
	.w_text{
		max-width: 628px;
	}
	h2{
		max-width: fit-content;
		margin-bottom: 55px;
		position: relative;
		&:before{
			position: absolute;
			left: -660px;
			top: -35px;
			content: '';
			display: block;
			width: 1319px;
			height: auto;
			aspect-ratio: 1319 / 433;
			background: url(../images/top/wave.svg) no-repeat left top / 100% auto;
			mix-blend-mode: overlay;
		}
		span{
			display: block;
			&:nth-child(1){
				background: #fff;
				width: 510px;
				height: 50px;
				border-radius: 50px;
				text-align: center;
				font-size: 25px;
				line-height: 50px;
				margin: 0 auto 18px;
				position: relative;
				&:before{
					position: absolute;
					left: 50%;
					transform: translate(-50%, 0);
					bottom: -12px;
					content: '';
					display: block;
					width: 37px;
					height: 26px;
					background: #ffffff;
					clip-path: polygon(0 0, 100% 0%, 50% 100%);
				}
			}
			&:nth-child(2){
				width: 627px;
			}
		}
	}
	.no1{
		z-index: 3;
		position: absolute;
		top: 0;
		right: 0;
		width: 255px;
	}
	.free{
		position: relative;
		margin: 0 auto 40px;
		width: 414px;
		height: 91px;
		background: linear-gradient(279.27deg, #264457 2.93%, #387EAA 100%);
		border-radius: 10px;
		color: #fff;
		text-align: center;
		padding-top: 14px;
		box-shadow: 4px 4px 4px rgba(255, 255, 255, 0.25);
		.fs32{
			font-size: 32px;
		}
		.fs33{
			font-size: 33px;
		}
		.fs16{
			font-size: 16px;
		}
		.text01{
			letter-spacing: 0.01em;
			.img{
				display: inline-block;
				width: 112px;
				margin: 0 4px;
				position: relative;
				top: 3px;
			}
		}
		.text02{
			position: absolute;
			font-size: 12px;
			top: 26px;
			right: 14px;
		}
	}
	.flex{
		color: #fff;
		display: flex;
		margin-bottom: 10px;
		gap: 0 18px;
		padding-left: 5px;
		
		.murai{
			position: relative;
			background: #0084BB;
			width: 296px;
			height: 110px;
			border-radius: 13px;
			box-shadow: 4px 4px 4px rgba(255, 255, 255, 0.25);
			padding-left: 162px;
			padding-top: 22px;
			&:before{
				position: absolute;
				top: -30px;
				left: 18px;
				content: '';
				display: block;
				aspect-ratio: 1/1;
				width: 133px;
				height: auto;
				background: url(../images/top/murai.png) no-repeat center / cover;
			}
			.text01{
				font-size: 12px;
				line-height: 1.5;
				margin-bottom: 3px;
			}
			.text02{
				font-size: 18px;
			}
		}
		.right{
			font-size: 16px;
			line-height: 1.6;
			width: 261px;
		}
	}
	.asterisk{
		color: #fff;
		font-size: 9px;
		line-height: 1.4;
		padding-left: 5px;
	}
}

#fix_cta{
	position: fixed;
	z-index: 5;
	right: 25px;
	bottom: 35px;
	width: 408px;
	height: 160px;
	background-image: url(../images/top/fix_cta_bg.png),url(../images/top/fix_cta_bg_hover.png);
	background-size: cover,0 0;
	border-radius: 30px;
	text-align: center;
	text-decoration: none;
	color: #333;
	font-weight: 500;
	line-height: 1;
	padding-top: 12px;
	&:hover{
		background-size: 0 0, cover;
		.fs36{
			color: #F7C530;
		}
		.text01{
			color: #fff;
		}
		.text03{
			background: #F7C530;
		}
	}
	.fs16{
		font-size: 16px;
	}
	.fs24{
		font-size: 24px;
	}
	.fs36{
		font-size: 36px;
		color: #0084BB;
	}
	.text01{
		margin-bottom: 13px;
	}
	.text02{
		font-size: 10px;
		max-width: fit-content;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 2px;
		span{
			margin: 0 10px;
		}
		&:before,&:after{
			position: relative;
			top: 3px;
			content: '';
			display: inline-block;
			width: 1px;
			background: #333;
			height: 14px;
		}
		&:before{
			transform: rotate(-30deg);
		}
		&:after{
			transform: rotate(30deg);
		}
	}
	.text03{
		width: 230px;
		height: 45px;
		background: #fff;
		box-shadow: 0 6px 0 #63580C;
		border-radius: 10px;
		margin: 0 auto 10px;
		font-size: 18px;
		line-height: 45px;
		padding-right: 10px;
		position: relative;
		&:before{
			position: absolute;
			top: 50%;
			transform: translate(0, -50%);
			right: 15px;
			content: '';
			display: block;
			width: 7px;
			height: auto;
			aspect-ratio: 7/12;
			background: url(../images/top/arrow.svg) no-repeat center / cover;
		}
	}
	.text04{
		font-size: 10px;
		
	}
}

#voice{
	padding: 60px 0 80px;
	h2{
		font-weight: 500;
		text-align: center;
		line-height: 1;
		margin-bottom: 50px;
		span{
			display: block;
			&:first-child{
				font-size: 28px;
				margin-bottom: 6px;
			}
			&:last-child{
				font-size: 40px;
			}
			
		}
	}
	ul{
		display: grid;
		grid-template-columns: repeat(3,1fr);
		gap: 20px;
		font-weight: 500;
	}
	li{
		padding: 30px 20px 20px;
		background: #FFFFFF;
		box-shadow: 0 0 20px rgba(0, 0, 0, 0.25);
		border-radius: 9px;
		&:nth-child(1){
			.top{
				background: url(../images/top/icon01.svg) no-repeat left top / 60px auto;
			}
		}
		&:nth-child(2){
			.top{
				background: url(../images/top/icon02.svg) no-repeat left top / 50px auto;
			}
		}
		&:nth-child(3){
			.top{
				padding-left: 63px;
				background: url(../images/top/icon03.svg) no-repeat left top / 50px auto;
			}
		}
	}
	.top{
		border-bottom: solid 2px #29ABE2;
		margin-bottom: 10px;
		padding-bottom: 10px;
		padding-left: 72px;
		.name{
			font-size: 14px;
			margin-bottom: 8px;
			line-height: 1;
		}
		h3{
			font-size: 18px;
			line-height: 1.3;
			letter-spacing: 0.08em;
			font-weight: 500;
			span{
				background: linear-gradient(transparent 68%, #FFEF74 68%,#FFEF74 92%,transparent 92%);
			}
		}
	}
	.bottom{
		font-size: 16px;
		line-height: 1.8;
		span{
			background: linear-gradient(transparent 68%, #FFEF74 68%,#FFEF74 92%,transparent 92%);
		}
	}
}

#media{
	background: #C9E7FF url(../images/top/bg_media.jpg) no-repeat center / auto 100%;
	padding: 80px 0;
	h2{
		text-align: center;
		font-weight: 500;
		line-height: 1;
		margin-bottom: 40px;
		>span{
			display: block;
			&:nth-child(1){
				font-size: 28px;
				margin-bottom: 10px;
			}
			&:nth-child(2){
				font-size: 40px;
				max-width: fit-content;
				margin: 0 auto;
				color: #058FCC;
				position: relative;
				padding-left: 7px;
				padding-bottom: 7px;
				span{
					position: relative;
					z-index: 3;
				}
				&:after{
					position: absolute;
					bottom: 0;
					left: 0;
					border-radius: 5px;
					content: '';
					display: block;
					width: 99%;
					height: 18px;
					background: #FFEF74;
				}
			}
		}
	}
	.lead{
		text-align: center;
		font-size: 18px;
		line-height: 1.6;
		margin-bottom: 40px;
	}
	.grid{
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0 35px;
		margin-bottom: 40px;
		p{
			font-size: 16px;
			text-align: center;
		}
	}
	.youtube {
		width: 100%;
		aspect-ratio: 16 / 9;
		margin-bottom: 8px;
	}
	.youtube iframe {
		width: 100%;
		height: 100%;
	}
	.flex{
		display: flex;
		justify-content: space-between;
		line-height: 1.6;
		>div{
			dl{
				&:not(:last-child){
					margin-bottom: 25px;
				}
			}
		}
	}
	dt{
		color: #0084BB;
		font-size: 24px;
	}
	dd{
		font-size: 16px;
	}
}

#features{
	padding: 100px 0 65px;
	h2{
		position: relative;
		line-height: 1;
		margin: 0 auto 80px;
		max-width: fit-content;
		&:before{
			position: absolute;
			top: 0;
			left: -145px;
			content: '';
			display: block;
			aspect-ratio: 360 / 190;
			width: 360px;
			height: auto;
			background: url(../images/top/wave2.svg) no-repeat center / cover;
		}
		.row1,.row2{
			display: block;
			text-align: center;
		}
		.row1{
			font-weight: 600;
			color: #0084BB;
			font-size: 26px;
		}
		.c_yellow{
			color: #F7C530;
		}
		.fs62{
			font-weight: bold;
			font-size: 62px;
		}
		.fs30{
			font-size: 30px;
		}
		.fs48{
			font-size: 48px;
		}
	}
	.num{
		font-family: "Montserrat", sans-serif;
		font-weight: bold;
		color: #F9D56A;
		line-height: 1;
		font-size: 100px;
	}
	h3{
		font-weight: 500;
		font-size: 35px;
		line-height: 1.4;
		margin-bottom: 30px;
		span{
			color: #E70509;
			font-weight: bold;
		}
	}
	h4{
		font-size: 24px;
		font-weight: bold;
		color: #0084BB;
	}
	.text{
		font-size: 20px;
		line-height: 1.8;
	}
	.f01{
		padding-left: 100px;
		padding-top: 10px;
		background: url(../images/top/features01.jpg) no-repeat center right / 626px auto;
		margin-bottom: 100px;
	}
	.f02{
		margin-bottom: 100px;
		display: flex;
		justify-content: space-between;
		padding-left: 25px;
		.w_video{
			width: 600px;
			
			.br{
				overflow: hidden;
				border-radius: 15px;
			}
		}
		.box{
			width: 512px;
		}
	}
	.f03{
		padding-left: 100px;
		background: url(../images/top/features03.jpg) no-repeat top right 48px / 560px auto;
		min-height: 510px;
		padding-top: 20px;
		.box{
			max-width: 372px;
		}
		
	}
}

#flow{
	background: linear-gradient(279.27deg, #264457 2.93%, #387EAA 100%);
	padding: 80px 0 200px;
	position: relative;
	z-index: 2;

	ol{
		position: relative;
		max-width: 952px;
		list-style: none;
		color: #fff;
		display: grid;
		grid-template-columns: repeat(3,1fr);
		gap: 56px;
		&:before{
			position: absolute;
			top: 31px;
			left: 50%;
			transform: translate(-50%, 0);
			content: '';
			display: block;
			width: 630px;
			height: 3px;
			background: #fff;
		}
		li{
			position: relative;
			z-index: 2;
			&:nth-child(1){
				.text{
					background: url(../images/top/step01.svg) no-repeat center 24px / 70px auto;
				}
			}
			&:nth-child(2){
				.text{
					background: url(../images/top/step02.svg) no-repeat center 24px / 70px auto;
				}
			}
			&:nth-child(3){
				.text{
					background: url(../images/top/step03.svg) no-repeat center 24px / 70px auto;
				}
			}
		}
		.step{
			font-family: "Montserrat", sans-serif;
			border: solid 1px #333;
			color: #333;
			font-weight: bold;
			font-size: 32px;
			width: 130px;
			height: 64px;
			margin: 0 auto;
			background: #fff;
			border-radius: 50px;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.text{
			font-size: 18px;
			line-height: 1.6;
			padding-top: 118px;
		}
	}
	.sp_scroll{
		display: none;
	}
}

#flow_cta{
	position: absolute;
	z-index: 3;
	left: 50%;
	transform: translate(-50%, 0);
	bottom: -133px;
	width: 720px;
	height: 266px;
	background-image: url(../images/top/flow_cta_bg.png),url(../images/top/flow_cta_bg_hover.png);
	background-size: cover,0 0;
	border-radius: 30px;
	text-align: center;
	text-decoration: none;
	color: #333;
	font-weight: 500;
	line-height: 1;
	padding-top: 40px;
	&:hover{
		background-size: 0 0, cover;
		.fs40{
			color: #F7C530;
		}
		.text01{
			color: #fff;
		}
		.text03{
			background: #F7C530;
		}
	}
	.fs16{
		font-size: 16px;
	}
	.fs28{
		font-size: 28px;
	}
	.fs40{
		font-size: 40px;
		color: #0084BB;
	}
	.text01{
		margin-bottom: 32px;
	}
	.text02{
		font-size: 14px;
		max-width: fit-content;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 6px;
		span{
			margin: 0 10px;
		}
		&:before,&:after{
			position: relative;
			top: 3px;
			content: '';
			display: inline-block;
			width: 1px;
			background: #333;
			height: 18px;
		}
		&:before{
			transform: rotate(-30deg);
		}
		&:after{
			transform: rotate(30deg);
		}
	}
	.text03{
		width: 304px;
		height: 60px;
		background: #fff;
		box-shadow: 0 6px 0 #63580C;
		border-radius: 10px;
		margin: 0 auto 14px;
		font-size: 20px;
		line-height: 60px;
		padding-right: 10px;
		position: relative;
		&:before{
			position: absolute;
			top: 50%;
			transform: translate(0, -50%);
			right: 15px;
			content: '';
			display: block;
			width: 7px;
			height: auto;
			aspect-ratio: 7/12;
			background: url(../images/top/arrow.svg) no-repeat center / cover;
		}
	}
	.text04{
		font-size: 14px;

	}
}

#news{
	.ttl01{
		margin-bottom: 40px;
	}
	padding: 210px 0 80px;
	background: #EDEDED url(../images/top/bg_news.png) no-repeat right bottom / 491px auto;
	ul{
		margin-bottom: 40px;
	}
	li{
		border-bottom: solid 1px #8D8D8D;
		display: flex;
		padding: 22px 0;
		a{
			text-decoration: none;
			color: #333;
			font-size: 18px;
			display: flex;
			&:hover{
				color: #0084BB;
			}
		}
	}
	.cat{
		min-width: 110px;
	}
	.date{
		font-size: 16px;
		font-weight: bold;
		color: #8D8D8D;
		width: 190px;
	}
	.w_text{
		width: calc(100% - 190px);
	}
	
	.textonly{
		a{
			pointer-events: none;
			cursor: default;
		}
	}
	.btn{
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		width: 156px;
		height: 42px;
		background: linear-gradient(93.22deg, #159BD6 4.58%, #27CFF0 95.47%);
		border-radius: 20px;
		font-size: 16px;
		color: #FFFFFF;
		text-decoration: none;
		margin: 0 auto;
		&:hover{
			background: linear-gradient(93.22deg, #264457 4.58%, #387EAA 95.47%);
		}
	}
}

#qa{
	padding: 80px 0 100px;
	.ttl01{
		margin-bottom: 40px;
	}
}

#qa_list{
	display: grid;
	gap: 20px;
	
	.q{
		position: relative;
		background: #E1F1FE;
		padding: 25px 98px 25px 105px;
		border-radius: 10px;
		cursor: pointer;
		&.open{
			color: #fff;
			border-radius: 10px 10px 0 0;
			background: linear-gradient(110.63deg, #149AD6 25.12%, #27CFF0 79.51%);
			&:before,&:after{
				background: #fff;
			}
			&:before{
				opacity: 0;
			}
		}
		&:before,&:after{
			top: 50%;
			right: 40px;
			content: '';
			display: block;
			width: 17px;
			height: 3px;
			background: #333;
			position: absolute;
		}
		&:before{
			transform: rotate(90deg);
			margin-top: 1px;
		}
		
		.ic{
			position: absolute;
			top: 50%;
			transform: translate(0, -50%);
			left: 40px;
			font-size: 32px;
		}
		.text{
			font-size: 16px;
			line-height: 1.6;
		}
	}
	.a{
		padding: 26px 40px 26px 100px;
		letter-spacing: 0;
		gap: 40px;
		background: #FFFFFF;
		box-shadow: 0 0 10px rgba(0, 51, 72, 0.3);
		border-radius: 0 0 10px 10px;
		position: relative;
		display: none;
		.ic{
			position: absolute;
			top: 50%;
			transform: translate(0, -50%);
			left: 40px;
			font-size: 32px;
			color: #0084BB;
		}
		.text{
			font-size: 16px;
			line-height: 1.6;
			margin-bottom: 1.75em;
			&:last-child{
				margin-bottom: 0;
			}
		}
	}
}

@media only screen and (max-width:1240px){
	.w1200{
		padding-left: 30px;
		padding-right: 30px;
	}
	#features{
		.f01{
			padding-left: 0;
			background-size: 65% auto;
		}
		.f02{
			padding-left: 0;
			gap: 0 30px;
		}
		.f03{
			padding-left: 0;
			background-position: top right;
		}
	}
	
}

@media only screen and (min-width:751px) and (max-width:1080px){
	.w1000{
		max-width: calc(1000 / 1080 * 100vw);
	}
	.w1200{
		max-width: calc(1000 / 1080 * 100vw);
		padding-left: 0;
		padding-right: 0;
	}
	.ttl01{
		line-height: 1;
		margin-bottom: calc(50 / 1080 * 100vw);
		span{
			display: block;
			text-align: center;
		}
		.en{
			font-family: "Montserrat", sans-serif;
			color: #F7C530;
			font-weight: bold;
			font-size: calc(18 / 1080 * 100vw);
			margin-bottom: calc(10 / 1080 * 100vw);
		}
		.ja{
			font-weight: 500;
			font-size: calc(38 / 1080 * 100vw);
		}
		.white{
			color: #fff;
		}
	}

	#emergency_area{
		background: #EDEDED;
		padding: calc(30 / 1080 * 100vw) 0;
		.ttl{
			font-size: calc(20 / 1080 * 100vw);
			margin-bottom: calc(8 / 1080 * 100vw);
			font-weight: bold;
		}
		.text01{
			font-size: calc(16 / 1080 * 100vw);
			line-height: 1.8;
			font-weight: bold;
		}
		.text02{
			font-size: calc(20 / 1080 * 100vw);
			color: #E70509;
			font-weight: bold;
			margin-top: calc(18 / 1080 * 100vw);
			line-height: 1;
		}
		.text03{
			line-height: 1;
			margin-top: calc(15 / 1080 * 100vw);
			a{
				color: #333;
				font-weight: 600;
				font-size: calc(16 / 1080 * 100vw);
				&:hover{
					color: #0084BB;
				}
			}
		}
	}

	#mv{
		background: url(../images/top/mv_bg.jpg) no-repeat center / cover;
		overflow: hidden;
		.w1000{
			display: flex;
			align-items: center;
			height: calc(100vh - calc(80 / 1080 * 100vw));
			padding-bottom: calc(50 / 1080 * 100vw);
		}
		.box{
			position: relative;
			margin-left: calc(130 / 1080 * 100vw);
			width: calc(870 / 1080 * 100vw);
		}
		.w_text{
			max-width: calc(628 / 1080 * 100vw);
		}
		h2{
			max-width: fit-content;
			margin-bottom: calc(55 / 1080 * 100vw);
			position: relative;
			&:before{
				position: absolute;
				left: calc(-660 / 1080 * 100vw);
				top: calc(-35 / 1080 * 100vw);
				content: '';
				display: block;
				width: calc(1319 / 1080 * 100vw);
				height: auto;
				aspect-ratio: 1319 / 433;
				background: url(../images/top/wave.svg) no-repeat left top / 100% auto;
				mix-blend-mode: overlay;
			}
			span{
				display: block;
				&:nth-child(1){
					background: #fff;
					width: calc(510 / 1080 * 100vw);
					height: calc(50 / 1080 * 100vw);
					border-radius: calc(50 / 1080 * 100vw);
					text-align: center;
					font-size: calc(25 / 1080 * 100vw);
					line-height: calc(50 / 1080 * 100vw);
					margin: 0 auto calc(18 / 1080 * 100vw);
					position: relative;
					&:before{
						position: absolute;
						left: 50%;
						transform: translate(-50%, 0);
						bottom: calc(-12 / 1080 * 100vw);
						content: '';
						display: block;
						width: calc(37 / 1080 * 100vw);
						height: calc(26 / 1080 * 100vw);
						background: #ffffff;
						clip-path: polygon(0 0, 100% 0%, 50% 100%);
					}
				}
				&:nth-child(2){
					width: calc(627 / 1080 * 100vw);
				}
			}
		}
		.no1{
			z-index: 3;
			position: absolute;
			top: 0;
			right: 0;
			width: calc(255 / 1080 * 100vw);
		}
		.free{
			position: relative;
			margin: 0 auto calc(40 / 1080 * 100vw);
			width: calc(414 / 1080 * 100vw);
			height: calc(91 / 1080 * 100vw);
			background: linear-gradient(279.27deg, #264457 2.93%, #387EAA 100%);
			border-radius: calc(10 / 1080 * 100vw);
			color: #fff;
			text-align: center;
			padding-top: calc(14 / 1080 * 100vw);
			box-shadow: calc(4 / 1080 * 100vw) calc(4 / 1080 * 100vw) calc(4 / 1080 * 100vw) rgba(255, 255, 255, 0.25);
			.fs32{
				font-size: calc(32 / 1080 * 100vw);
			}
			.fs33{
				font-size: calc(33 / 1080 * 100vw);
			}
			.fs16{
				font-size: calc(16 / 1080 * 100vw);
			}
			.text01{
				letter-spacing: 0.01em;
				.img{
					display: inline-block;
					width: calc(112 / 1080 * 100vw);
					margin: 0 calc(4 / 1080 * 100vw);
					position: relative;
					top: calc(3 / 1080 * 100vw);
				}
			}
			.text02{
				position: absolute;
				font-size: calc(12 / 1080 * 100vw);
				top: calc(26 / 1080 * 100vw);
				right: calc(14 / 1080 * 100vw);
			}
		}
		.flex{
			color: #fff;
			display: flex;
			margin-bottom: calc(10 / 1080 * 100vw);
			gap: 0 calc(18 / 1080 * 100vw);
			padding-left: calc(5 / 1080 * 100vw);

			.murai{
				position: relative;
				background: #0084BB;
				width: calc(296 / 1080 * 100vw);
				height: calc(110 / 1080 * 100vw);
				border-radius: calc(13 / 1080 * 100vw);
				box-shadow: calc(4 / 1080 * 100vw) calc(4 / 1080 * 100vw) calc(4 / 1080 * 100vw) rgba(255, 255, 255, 0.25);
				padding-left: calc(162 / 1080 * 100vw);
				padding-top: calc(22 / 1080 * 100vw);
				&:before{
					position: absolute;
					top: calc(-30 / 1080 * 100vw);
					left: calc(18 / 1080 * 100vw);
					content: '';
					display: block;
					aspect-ratio: 1/1;
					width: calc(133 / 1080 * 100vw);
					height: auto;
					background: url(../images/top/murai.png) no-repeat center / cover;
				}
				.text01{
					font-size: calc(12 / 1080 * 100vw);
					line-height: 1.5;
					margin-bottom: calc(3 / 1080 * 100vw);
				}
				.text02{
					font-size: calc(18 / 1080 * 100vw);
				}
			}
			.right{
				font-size: calc(16 / 1080 * 100vw);
				line-height: 1.6;
				width: calc(261 / 1080 * 100vw);
			}
		}
		.asterisk{
			color: #fff;
			font-size: calc(9 / 1080 * 100vw);
			line-height: 1.4;
			padding-left: calc(5 / 1080 * 100vw);
		}
	}

	#fix_cta{
		position: fixed;
		z-index: 5;
		right: calc(25 / 1080 * 100vw);
		bottom: calc(35 / 1080 * 100vw);
		width: calc(408 / 1080 * 100vw);
		height: calc(160 / 1080 * 100vw);
		background-image: url(../images/top/fix_cta_bg.png),url(../images/top/fix_cta_bg_hover.png);
		background-size: cover,0 0;
		border-radius: calc(30 / 1080 * 100vw);
		text-align: center;
		text-decoration: none;
		color: #333;
		font-weight: 500;
		line-height: 1;
		padding-top: calc(12 / 1080 * 100vw);
		&:hover{
			background-size: 0 0, cover;
			.fs36{
				color: #F7C530;
			}
			.text01{
				color: #fff;
			}
			.text03{
				background: #F7C530;
			}
		}
		.fs16{
			font-size: calc(16 / 1080 * 100vw);
		}
		.fs24{
			font-size: calc(24 / 1080 * 100vw);
		}
		.fs36{
			font-size: calc(36 / 1080 * 100vw);
			color: #0084BB;
		}
		.text01{
			margin-bottom: calc(13 / 1080 * 100vw);
		}
		.text02{
			font-size: calc(10 / 1080 * 100vw);
			max-width: fit-content;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: calc(2 / 1080 * 100vw);
			span{
				margin: 0 calc(10 / 1080 * 100vw);
			}
			&:before,&:after{
				position: relative;
				top: calc(3 / 1080 * 100vw);
				content: '';
				display: inline-block;
				width: calc(1 / 1080 * 100vw);
				background: #333;
				height: calc(14 / 1080 * 100vw);
			}
			&:before{
				transform: rotate(-30deg);
			}
			&:after{
				transform: rotate(30deg);
			}
		}
		.text03{
			width: calc(230 / 1080 * 100vw);
			height: calc(45 / 1080 * 100vw);
			background: #fff;
			box-shadow: 0 calc(6 / 1080 * 100vw) 0 #63580C;
			border-radius: calc(10 / 1080 * 100vw);
			margin: 0 auto calc(10 / 1080 * 100vw);
			font-size: calc(18 / 1080 * 100vw);
			line-height: calc(45 / 1080 * 100vw);
			padding-right: calc(10 / 1080 * 100vw);
			position: relative;
			&:before{
				position: absolute;
				top: 50%;
				transform: translate(0, -50%);
				right: calc(15 / 1080 * 100vw);
				content: '';
				display: block;
				width: calc(7 / 1080 * 100vw);
				height: auto;
				aspect-ratio: 7/12;
				background: url(../images/top/arrow.svg) no-repeat center / cover;
			}
		}
		.text04{
			font-size: calc(10 / 1080 * 100vw);

		}
	}

	#voice{
		padding: calc(60 / 1080 * 100vw) 0 calc(80 / 1080 * 100vw);
		h2{
			font-weight: 500;
			text-align: center;
			line-height: 1;
			margin-bottom: calc(50 / 1080 * 100vw);
			span{
				display: block;
				&:first-child{
					font-size: calc(28 / 1080 * 100vw);
					margin-bottom: calc(6 / 1080 * 100vw);
				}
				&:last-child{
					font-size: calc(40 / 1080 * 100vw);
				}

			}
		}
		ul{
			display: grid;
			grid-template-columns: repeat(3,1fr);
			gap: calc(20 / 1080 * 100vw);
			font-weight: 500;
		}
		li{
			padding: calc(30 / 1080 * 100vw) calc(20 / 1080 * 100vw) calc(20 / 1080 * 100vw);
			background: #FFFFFF;
			box-shadow: 0 0 calc(20 / 1080 * 100vw) rgba(0, 0, 0, 0.25);
			border-radius: calc(9 / 1080 * 100vw);
			&:nth-child(1){
				.top{
					background: url(../images/top/icon01.svg) no-repeat left top / calc(60 / 1080 * 100vw) auto;
				}
			}
			&:nth-child(2){
				.top{
					background: url(../images/top/icon02.svg) no-repeat left top / calc(50 / 1080 * 100vw) auto;
				}
			}
			&:nth-child(3){
				.top{
					padding-left: calc(63 / 1080 * 100vw);
					background: url(../images/top/icon03.svg) no-repeat left top / calc(50 / 1080 * 100vw) auto;
				}
			}
		}
		.top{
			border-bottom: solid calc(2 / 1080 * 100vw) #29ABE2;
			margin-bottom: calc(10 / 1080 * 100vw);
			padding-bottom: calc(10 / 1080 * 100vw);
			padding-left: calc(72 / 1080 * 100vw);
			.name{
				font-size: calc(14 / 1080 * 100vw);
				margin-bottom: calc(8 / 1080 * 100vw);
				line-height: 1;
			}
			h3{
				font-size: calc(18 / 1080 * 100vw);
				line-height: 1.3;
				letter-spacing: 0.08em;
				font-weight: 500;
				span{
					background: linear-gradient(transparent 68%, #FFEF74 68%,#FFEF74 92%,transparent 92%);
				}
			}
		}
		.bottom{
			font-size: calc(16 / 1080 * 100vw);
			line-height: 1.8;
			span{
				background: linear-gradient(transparent 68%, #FFEF74 68%,#FFEF74 92%,transparent 92%);
			}
		}
	}

	#media{
		background: #C9E7FF url(../images/top/bg_media.jpg) no-repeat center / auto 100%;
		padding: calc(80 / 1080 * 100vw) 0;
		h2{
			text-align: center;
			font-weight: 500;
			line-height: 1;
			margin-bottom: calc(40 / 1080 * 100vw);
			>span{
				display: block;
				&:nth-child(1){
					font-size: calc(28 / 1080 * 100vw);
					margin-bottom: calc(10 / 1080 * 100vw);
				}
				&:nth-child(2){
					font-size: calc(40 / 1080 * 100vw);
					max-width: fit-content;
					margin: 0 auto;
					color: #058FCC;
					position: relative;
					padding-left: calc(7 / 1080 * 100vw);
					padding-bottom: calc(7 / 1080 * 100vw);
					span{
						position: relative;
						z-index: 3;
					}
					&:after{
						position: absolute;
						bottom: 0;
						left: 0;
						border-radius: calc(5 / 1080 * 100vw);
						content: '';
						display: block;
						width: 99%;
						height: calc(18 / 1080 * 100vw);
						background: #FFEF74;
					}
				}
			}
		}
		.lead{
			text-align: center;
			font-size: calc(18 / 1080 * 100vw);
			line-height: 1.6;
			margin-bottom: calc(40 / 1080 * 100vw);
		}
		.grid{
			display: grid;
			grid-template-columns: 1fr 1fr;
			gap: 0 calc(35 / 1080 * 100vw);
			margin-bottom: calc(40 / 1080 * 100vw);
			p{
				font-size: calc(16 / 1080 * 100vw);
				text-align: center;
			}
		}
		.youtube {
			width: 100%;
			aspect-ratio: 16 / 9;
			margin-bottom: calc(8 / 1080 * 100vw);
		}
		.youtube iframe {
			width: 100%;
			height: 100%;
		}
		.flex{
			display: flex;
			justify-content: space-between;
			line-height: 1.6;
			>div{
				dl{
					&:not(:last-child){
						margin-bottom: calc(25 / 1080 * 100vw);
					}
				}
			}
		}
		dt{
			color: #0084BB;
			font-size: calc(24 / 1080 * 100vw);
		}
		dd{
			font-size: calc(16 / 1080 * 100vw);
		}
	}

	#features{
		padding: calc(100 / 1080 * 100vw) 0 calc(65 / 1080 * 100vw);
		h2{
			position: relative;
			line-height: 1;
			margin: 0 auto calc(80 / 1080 * 100vw);
			max-width: fit-content;
			&:before{
				position: absolute;
				top: 0;
				left: calc(-145 / 1080 * 100vw);
				content: '';
				display: block;
				aspect-ratio: 360 / 190;
				width: calc(360 / 1080 * 100vw);
				height: auto;
				background: url(../images/top/wave2.svg) no-repeat center / cover;
			}
			.row1,.row2{
				display: block;
				text-align: center;
			}
			.row1{
				font-weight: 600;
				color: #0084BB;
				font-size: calc(26 / 1080 * 100vw);
			}
			.c_yellow{
				color: #F7C530;
			}
			.fs62{
				font-weight: bold;
				font-size: calc(62 / 1080 * 100vw);
			}
			.fs30{
				font-size: calc(30 / 1080 * 100vw);
			}
			.fs48{
				font-size: calc(48 / 1080 * 100vw);
			}
		}
		.num{
			font-family: "Montserrat", sans-serif;
			font-weight: bold;
			color: #F9D56A;
			line-height: 1;
			font-size: calc(100 / 1080 * 100vw);
		}
		h3{
			font-weight: 500;
			font-size: calc(35 / 1080 * 100vw);
			line-height: 1.4;
			margin-bottom: calc(30 / 1080 * 100vw);
			span{
				color: #E70509;
				font-weight: bold;
			}
		}
		h4{
			font-size: calc(24 / 1080 * 100vw);
			font-weight: bold;
			color: #0084BB;
		}
		.text{
			font-size: calc(20 / 1080 * 100vw);
			line-height: 1.8;
		}
		.f01{
			padding-left: 0;
			padding-top: calc(10 / 1080 * 100vw);
			background: url(../images/top/features01.jpg) no-repeat center right / calc(626 / 1080 * 100vw) auto;
			margin-bottom: calc(100 / 1080 * 100vw);
		}
		.f02{
			margin-bottom: calc(100 / 1080 * 100vw);
			display: flex;
			justify-content: space-between;
			padding-left: calc(25 / 1080 * 100vw);
			.w_video{
				width: calc(600 / 1080 * 100vw);

				.br{
					overflow: hidden;
					border-radius: calc(15 / 1080 * 100vw);
				}
			}
			.box{
				width: calc(512 / 1080 * 100vw);
			}
		}
		.f03{
			padding-left: 0;
			background: url(../images/top/features03.jpg) no-repeat top right calc(48 / 1080 * 100vw) / calc(560 / 1080 * 100vw) auto;
			min-height: calc(510 / 1080 * 100vw);
			padding-top: calc(20 / 1080 * 100vw);
			.box{
				max-width: calc(372 / 1080 * 100vw);
			}

		}
	}

	#flow{
		background: linear-gradient(279.27deg, #264457 2.93%, #387EAA 100%);
		padding: calc(80 / 1080 * 100vw) 0 calc(200 / 1080 * 100vw);
		position: relative;
		z-index: 2;
		ol{
			position: relative;
			max-width: calc(952 / 1080 * 100vw);
			list-style: none;
			color: #fff;
			display: grid;
			grid-template-columns: repeat(3,1fr);
			gap: calc(56 / 1080 * 100vw);
			&:before{
				position: absolute;
				top: calc(31 / 1080 * 100vw);
				left: 50%;
				transform: translate(-50%, 0);
				content: '';
				display: block;
				width: calc(630 / 1080 * 100vw);
				height: calc(3 / 1080 * 100vw);
				background: #fff;
			}
			li{
				position: relative;
				z-index: 2;
				&:nth-child(1){
					.text{
						background: url(../images/top/step01.svg) no-repeat center calc(24 / 1080 * 100vw) / calc(70 / 1080 * 100vw) auto;
					}
				}
				&:nth-child(2){
					.text{
						background: url(../images/top/step02.svg) no-repeat center calc(24 / 1080 * 100vw) / calc(70 / 1080 * 100vw) auto;
					}
				}
				&:nth-child(3){
					.text{
						background: url(../images/top/step03.svg) no-repeat center calc(24 / 1080 * 100vw) / calc(70 / 1080 * 100vw) auto;
					}
				}
			}
			.step{
				font-family: "Montserrat", sans-serif;
				border: solid calc(1 / 1080 * 100vw) #333;
				color: #333;
				font-weight: bold;
				font-size: calc(32 / 1080 * 100vw);
				width: calc(130 / 1080 * 100vw);
				height: calc(64 / 1080 * 100vw);
				margin: 0 auto;
				background: #fff;
				border-radius: calc(50 / 1080 * 100vw);
				display: flex;
				justify-content: center;
				align-items: center;
			}
			.text{
				font-size: calc(18 / 1080 * 100vw);
				line-height: 1.6;
				padding-top: calc(118 / 1080 * 100vw);
			}
		}
	}

	#flow_cta{
		position: absolute;
		z-index: 3;
		left: 50%;
		transform: translate(-50%, 0);
		bottom: calc(-133 / 1080 * 100vw);
		width: calc(720 / 1080 * 100vw);
		height: calc(266 / 1080 * 100vw);
		background-image: url(../images/top/flow_cta_bg.png),url(../images/top/flow_cta_bg_hover.png);
		background-size: cover,0 0;
		border-radius: calc(30 / 1080 * 100vw);
		text-align: center;
		text-decoration: none;
		color: #333;
		font-weight: 500;
		line-height: 1;
		padding-top: calc(40 / 1080 * 100vw);
		&:hover{
			background-size: 0 0, cover;
			.fs40{
				color: #F7C530;
			}
			.text01{
				color: #fff;
			}
			.text03{
				background: #F7C530;
			}
		}
		.fs16{
			font-size: calc(16 / 1080 * 100vw);
		}
		.fs28{
			font-size: calc(28 / 1080 * 100vw);
		}
		.fs40{
			font-size: calc(40 / 1080 * 100vw);
			color: #0084BB;
		}
		.text01{
			margin-bottom: calc(32 / 1080 * 100vw);
		}
		.text02{
			font-size: calc(14 / 1080 * 100vw);
			max-width: fit-content;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: calc(6 / 1080 * 100vw);
			span{
				margin: 0 calc(10 / 1080 * 100vw);
			}
			&:before,&:after{
				position: relative;
				top: calc(3 / 1080 * 100vw);
				content: '';
				display: inline-block;
				width: calc(1 / 1080 * 100vw);
				background: #333;
				height: calc(18 / 1080 * 100vw);
			}
			&:before{
				transform: rotate(-30deg);
			}
			&:after{
				transform: rotate(30deg);
			}
		}
		.text03{
			width: calc(304 / 1080 * 100vw);
			height: calc(60 / 1080 * 100vw);
			background: #fff;
			box-shadow: 0 calc(6 / 1080 * 100vw) 0 #63580C;
			border-radius: calc(10 / 1080 * 100vw);
			margin: 0 auto calc(14 / 1080 * 100vw);
			font-size: calc(20 / 1080 * 100vw);
			line-height: calc(60 / 1080 * 100vw);
			padding-right: calc(10 / 1080 * 100vw);
			position: relative;
			&:before{
				position: absolute;
				top: 50%;
				transform: translate(0, -50%);
				right: calc(15 / 1080 * 100vw);
				content: '';
				display: block;
				width: calc(7 / 1080 * 100vw);
				height: auto;
				aspect-ratio: 7/12;
				background: url(../images/top/arrow.svg) no-repeat center / cover;
			}
		}
		.text04{
			font-size: calc(14 / 1080 * 100vw);

		}
	}

	#news{
		.ttl01{
			margin-bottom: calc(40 / 1080 * 100vw);
		}
		padding: calc(210 / 1080 * 100vw) 0 calc(80 / 1080 * 100vw);
		background: #EDEDED url(../images/top/bg_news.png) no-repeat right bottom / calc(491 / 1080 * 100vw) auto;
		ul{
			margin-bottom: calc(40 / 1080 * 100vw);
		}
		li{
			border-bottom: solid calc(1 / 1080 * 100vw) #8D8D8D;
			display: flex;
			padding: calc(22 / 1080 * 100vw) 0;
			a{
				text-decoration: none;
				color: #333;
				font-size: calc(18 / 1080 * 100vw);
				display: flex;
				&:hover{
					color: #0084BB;
				}
			}
		}
		.cat{
			min-width: calc(110 / 1080 * 100vw);
		}
		.date{
			font-size: calc(16 / 1080 * 100vw);
			font-weight: bold;
			color: #8D8D8D;
			width: calc(190 / 1080 * 100vw);
		}
		.w_text{
			width: calc(100% - calc(190 / 1080 * 100vw));
		}

		.textonly{
			a{
				pointer-events: none;
				cursor: default;
			}
		}
		.btn{
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			width: calc(156 / 1080 * 100vw);
			height: calc(42 / 1080 * 100vw);
			background: linear-gradient(93.22deg, #159BD6 4.58%, #27CFF0 95.47%);
			border-radius: calc(20 / 1080 * 100vw);
			font-size: calc(16 / 1080 * 100vw);
			color: #FFFFFF;
			text-decoration: none;
			margin: 0 auto;
			&:hover{
				background: linear-gradient(93.22deg, #264457 4.58%, #387EAA 95.47%);
			}
		}
	}

	#qa{
		padding: calc(80 / 1080 * 100vw) 0 calc(100 / 1080 * 100vw);
		.ttl01{
			margin-bottom: calc(40 / 1080 * 100vw);
		}
	}

	#qa_list{
		display: grid;
		gap: calc(20 / 1080 * 100vw);

		.q{
			position: relative;
			background: #E1F1FE;
			padding: calc(25 / 1080 * 100vw) calc(98 / 1080 * 100vw) calc(25 / 1080 * 100vw) calc(105 / 1080 * 100vw);
			border-radius: calc(10 / 1080 * 100vw);
			cursor: pointer;
			&.open{
				color: #fff;
				border-radius: calc(10 / 1080 * 100vw) calc(10 / 1080 * 100vw) 0 0;
				background: linear-gradient(110.63deg, #149AD6 25.12%, #27CFF0 79.51%);
				&:before,&:after{
					background: #fff;
				}
				&:before{
					opacity: 0;
				}
			}
			&:before,&:after{
				top: 50%;
				right: calc(40 / 1080 * 100vw);
				content: '';
				display: block;
				width: calc(17 / 1080 * 100vw);
				height: calc(3 / 1080 * 100vw);
				background: #333;
				position: absolute;
			}
			&:before{
				transform: rotate(90deg);
				margin-top: calc(1 / 1080 * 100vw);
			}

			.ic{
				position: absolute;
				top: 50%;
				transform: translate(0, -50%);
				left: calc(40 / 1080 * 100vw);
				font-size: calc(32 / 1080 * 100vw);
			}
			.text{
				font-size: calc(16 / 1080 * 100vw);
				line-height: 1.6;
			}
		}
		.a{
			padding: calc(26 / 1080 * 100vw) calc(40 / 1080 * 100vw) calc(26 / 1080 * 100vw) calc(100 / 1080 * 100vw);
			letter-spacing: 0;
			gap: calc(40 / 1080 * 100vw);
			background: #FFFFFF;
			box-shadow: 0 0 calc(10 / 1080 * 100vw) rgba(0, 51, 72, 0.3);
			border-radius: 0 0 calc(10 / 1080 * 100vw) calc(10 / 1080 * 100vw);
			position: relative;
			display: none;
			.ic{
				position: absolute;
				top: 50%;
				transform: translate(0, -50%);
				left: calc(40 / 1080 * 100vw);
				font-size: calc(32 / 1080 * 100vw);
				color: #0084BB;
			}
			.text{
				font-size: calc(16 / 1080 * 100vw);
				line-height: 1.6;
				margin-bottom: 1.75em;
				&:last-child{
					margin-bottom: 0;
				}
			}
		}
	}
}

@media only screen and (min-width:751px){
	#flow{
		.sp_scroll{
			display: none !important;
		}
	}
}
@media only screen and (max-width:750px){
	.w1000,.w1200{
		padding-left: calc(20 / 375 * 100vw);
		padding-right: calc(20 / 375 * 100vw);
	}
	.ttl01{
		line-height: 1;
		margin-bottom: calc(40 / 375 * 100vw);
		.en{
			font-size: calc(18 / 375 * 100vw);
			margin-bottom: calc(10 / 375 * 100vw);
		}
		.ja{
			font-weight: 500;
			font-size: calc(28 / 375 * 100vw);
		}
		.white{
			color: #fff;
		}
	}
	#emergency_area{
		background: #EDEDED;
		padding: calc(30 / 375 * 100vw) 0;
		.ttl{
			font-size: calc(20 / 375 * 100vw);
			margin-bottom: calc(8 / 375 * 100vw);
			font-weight: bold;
		}
		.text01{
			font-size: calc(14 / 375 * 100vw);
			line-height: 1.8;
			font-weight: bold;
		}
		.text02{
			font-size: calc(18 / 375 * 100vw);
			color: #E70509;
			font-weight: bold;
			margin-top: calc(18 / 375 * 100vw);
			line-height: 1;
		}
		.text03{
			line-height: 1;
			margin-top: calc(15 / 375 * 100vw);
			a{
				color: #333;
				font-weight: 600;
				font-size: calc(14 / 375 * 100vw);
				&:hover{
					color: #0084BB;
				}
			}
		}
	}


	#mv{
		background: url(../images/top/mv_bg_sp.jpg) no-repeat center / cover;
		overflow: hidden;
		.w1000{
			display: flex;
			align-items: center;
			height: calc(100vh - calc(50 / 375 * 100vw));
			height: calc(100svh - calc(50 / 375 * 100vw));
			padding-bottom: calc(50 / 375 * 100vw);
			padding-left: 0;
			padding-right: 0;
		}
		.box{
			position: relative;
			margin-left: 0;
			width: 100%;
		}
		.w_text{
			max-width: calc(628 / 375 * 100vw);
		}
		h2{
			max-width: fit-content;
			margin: 0 auto calc(30 / 375 * 100vw);

			position: relative;
			&:before{
				position: absolute;
				left: calc(-12 / 375 * 100vw);
				top: calc(15 / 375 * 100vw);
				width: calc(375 / 375 * 100vw);
				height: auto;
				aspect-ratio: 375 / 190;
				background: url(../images/top/wave_sp.svg) no-repeat left top / 100% auto;
			}
			span{
				position: relative;
				z-index: 2;
				display: block;
				&:nth-child(1){
					width: calc(270 / 375 * 100vw);
					height: calc(37 / 375 * 100vw);
					border-radius: calc(50 / 375 * 100vw);
					font-size: calc(16 / 375 * 100vw);
					line-height: calc(37 / 375 * 100vw);
					margin: 0 auto calc(15 / 375 * 100vw);
					position: relative;
					&:before{
						position: absolute;
						left: 50%;
						transform: translate(-50%, 0);
						bottom: calc(-8 / 375 * 100vw);
						content: '';
						display: block;
						width: calc(28 / 375 * 100vw);
						height: calc(16 / 375 * 100vw);
						background: #ffffff;
						clip-path: polygon(0 0, 100% 0%, 50% 100%);
					}
				}
				&:nth-child(2){
					width: calc(352 / 375 * 100vw);
				}
			}
		}
		.no1{
			z-index: 3;
			position: absolute;
			bottom: revert;
			top: calc(228 / 375 * 100vw);
			right: calc(8 / 375 * 100vw);
			width: calc(140 / 375 * 100vw);
		}
		.free{
			margin: 0 auto calc(40 / 375 * 100vw);
			width: calc(346 / 375 * 100vw);
			height: calc(67 / 375 * 100vw);
			border-radius: calc(10 / 375 * 100vw);
			padding-top: calc(10 / 375 * 100vw);
			box-shadow: calc(4 / 375 * 100vw) calc(4 / 375 * 100vw) calc(4 / 375 * 100vw) rgba(255, 255, 255, 0.25);
			.fs32{
				font-size: calc(29 / 375 * 100vw);
			}
			.fs33{
				font-size: calc(29 / 375 * 100vw);
			}
			.fs16{
				font-size: calc(14 / 375 * 100vw);
			}
			.text01{
				letter-spacing: 0.01em;
				.img{
					display: inline-block;
					width: calc(80 / 375 * 100vw);
					margin: 0 calc(4 / 375 * 100vw);
					position: relative;
					top: calc(3 / 375 * 100vw);
				}
			}
			.text02{
				position: absolute;
				font-size: calc(9 / 375 * 100vw);
				top: calc(15 / 375 * 100vw);
				right: calc(14 / 375 * 100vw);
			}
		}
		.flex{
			color: #fff;
			display: flex;
			flex-wrap: wrap;
			margin-bottom: calc(20 / 375 * 100vw);
			gap: 0 calc(18 / 375 * 100vw);
			padding-left: 0;
			.left,.right{
				width: 100%;
			}
			.murai{
				position: relative;
				background: #0084BB;
				width: calc(345 / 375 * 100vw);
				height: calc(80 / 375 * 100vw);
				border-radius: calc(10 / 375 * 100vw);
				box-shadow: calc(4 / 375 * 100vw) calc(4 / 375 * 100vw) calc(4 / 375 * 100vw) rgba(255, 255, 255, 0.25);
				padding-left: calc(112 / 375 * 100vw);
				padding-top: calc(12 / 375 * 100vw);
				margin: 0 auto;
				&:before{
					position: absolute;
					top: calc(-25 / 375 * 100vw);
					left: calc(10 / 375 * 100vw);
					content: '';
					display: block;
					aspect-ratio: 1/1;
					width: calc(95 / 375 * 100vw);
					height: auto;
					background: url(../images/top/murai.png) no-repeat center / cover;
				}
				.text01{
					font-size: calc(10 / 375 * 100vw);
					line-height: 1.5;
					margin-bottom: calc(3 / 375 * 100vw);
				}
				.text02{
					font-size: calc(15 / 375 * 100vw);
				}
			}
			.right{
				margin-top: calc(16 / 375 * 100vw);
				font-size: calc(15 / 375 * 100vw);
				line-height: 1.6;
				width: calc(200 / 375 * 100vw);
				margin-left: calc(15 / 375 * 100vw);
			}
		}
		.asterisk{
			color: #fff;
			font-size: calc(9 / 375 * 100vw);
			line-height: 1.4;
			padding-left: 0;
			margin-left: calc(15 / 375 * 100vw);
			max-width: calc(202 / 375 * 100vw);
		}
	}

	#fix_cta{
		position: fixed;
		z-index: 5;
		right: revert;
		bottom: 0;
		left: 0;
		width: 100%;
		height: calc(100 / 375 * 100vw);
		background: url(../images/top/fix_cta_bg_sp.png) no-repeat center / cover;
		border-radius: calc(15 / 375 * 100vw);
		text-align: center;
		text-decoration: none;
		color: #333;
		font-weight: 500;
		line-height: 1;
		padding-top: 0;
		&:hover{
			background-size: cover;
			.fs36{
				color: #0084BB;
			}
			.text01{
				color: #333;
			}
			.text03{
				background: #fff;
			}
		}
		.fs16{
			font-size: calc(13 / 375 * 100vw);
		}
		.fs24{
			font-size: calc(18 / 375 * 100vw);
		}
		.fs36{
			font-size: calc(28 / 375 * 100vw);
		}
		.text01{
			position: absolute;
			margin-bottom: 0;
			top: calc(18 / 375 * 100vw);
			left: calc(36 / 375 * 100vw);
			.fs16{
				display: block;
				&:first-child{
					margin-bottom: calc(3 / 375 * 100vw);
				}
				&:last-child{
					margin-top: calc(6 / 375 * 100vw);
				}
			}

		}
		.sp_right{
			position: absolute;
			right: calc(30 / 375 * 100vw);
			top: calc(17 / 375 * 100vw);
		}
		.text02{
			font-size: calc(10 / 375 * 100vw);
			max-width: fit-content;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: calc(2 / 375 * 100vw);
			span{
				margin: 0 calc(5 / 375 * 100vw);
			}
			&:before,&:after{
				position: relative;
				top: calc(3 / 375 * 100vw);
				content: '';
				display: inline-block;
				width: calc(1 / 375 * 100vw);
				background: #333;
				height: calc(14 / 375 * 100vw);
			}
			&:before{
				transform: rotate(-30deg);
			}
			&:after{
				transform: rotate(30deg);
			}
		}
		.text03{
			width: calc(172 / 375 * 100vw);
			height: calc(32 / 375 * 100vw);
			background: #fff;
			box-shadow: 0 calc(4 / 375 * 100vw) 0 #63580C;
			border-radius: calc(7 / 375 * 100vw);
			margin: 0 auto calc(6 / 375 * 100vw);
			font-size: calc(14 / 375 * 100vw);
			line-height: calc(32 / 375 * 100vw);
			padding-right: 0;
			position: relative;
			text-align: left;
			padding-left: calc(23 / 375 * 100vw);
			&:before{
				position: absolute;
				top: 50%;
				transform: translate(0, -50%);
				right: calc(22 / 375 * 100vw);
				content: '';
				display: block;
				width: calc(7 / 375 * 100vw);
				height: auto;
				aspect-ratio: 7/12;
				background: url(../images/top/arrow.svg) no-repeat center / cover;
			}
		}
		.text04{
			font-size: calc(9 / 375 * 100vw);
			letter-spacing: 0;
		}
	}

	#voice{
		padding: calc(60 / 375 * 100vw) 0 calc(60 / 375 * 100vw);
		h2{
			margin-bottom: calc(50 / 375 * 100vw);
			span{
				display: block;
				&:first-child{
					font-size: calc(18 / 375 * 100vw);
					margin-bottom: calc(6 / 375 * 100vw);
				}
				&:last-child{
					font-size: calc(28 / 375 * 100vw);
				}

			}
		}
		ul{
			grid-template-columns: 1fr;
			gap: calc(20 / 375 * 100vw);
		}
		li{
			padding: calc(30 / 375 * 100vw) calc(20 / 375 * 100vw) calc(20 / 375 * 100vw);
			background: #FFFFFF;
			box-shadow: 0 0 calc(20 / 375 * 100vw) rgba(0, 0, 0, 0.25);
			border-radius: calc(9 / 375 * 100vw);
			&:nth-child(1){
				.top{
					background: url(../images/top/icon01.svg) no-repeat left top / calc(60 / 375 * 100vw) auto;
				}
			}
			&:nth-child(2){
				.top{
					background: url(../images/top/icon02.svg) no-repeat left top / calc(50 / 375 * 100vw) auto;
				}
			}
			&:nth-child(3){
				.top{
					padding-left: calc(63 / 375 * 100vw);
					background: url(../images/top/icon03.svg) no-repeat left top / calc(50 / 375 * 100vw) auto;
				}
			}
		}
		.top{
			border-bottom: solid calc(2 / 375 * 100vw) #29ABE2;
			margin-bottom: calc(10 / 375 * 100vw);
			padding-bottom: calc(10 / 375 * 100vw);
			padding-left: calc(72 / 375 * 100vw);
			.name{
				font-size: calc(14 / 375 * 100vw);
				margin-bottom: calc(8 / 375 * 100vw);
				line-height: 1;
			}
			h3{
				font-size: calc(18 / 375 * 100vw);
				line-height: 1.3;
				letter-spacing: 0.08em;
				font-weight: 500;
				span{
					background: linear-gradient(transparent 68%, #FFEF74 68%,#FFEF74 92%,transparent 92%);
				}
			}
		}
		.bottom{
			font-size: calc(14 / 375 * 100vw);
			line-height: 1.8;
			span{
				background: linear-gradient(transparent 68%, #FFEF74 68%,#FFEF74 92%,transparent 92%);
			}
		}
	}

	#media{
		background: #C9E7FF url(../images/top/bg_media.jpg) no-repeat center / auto 100%;
		padding: calc(60 / 375 * 100vw) 0;
		h2{
			text-align: center;
			font-weight: 500;
			line-height: 1;
			margin-bottom: calc(30 / 375 * 100vw);
			>span{
				display: block;
				&:nth-child(1){
					font-size: calc(18 / 375 * 100vw);
					margin-bottom: calc(10 / 375 * 100vw);
				}
				&:nth-child(2){
					font-size: calc(24 / 375 * 100vw);
					max-width: fit-content;
					letter-spacing: 0;
					padding-left: calc(7 / 375 * 100vw);
					padding-bottom: calc(7 / 375 * 100vw);
					&:after{
						border-radius: calc(5 / 375 * 100vw);
						height: calc(12 / 375 * 100vw);
					}
				}
			}
		}
		.lead{
			text-align: center;
			font-size: calc(14 / 375 * 100vw);
			line-height: 1.6;
			margin-bottom: calc(40 / 375 * 100vw);
			br{
				display: none;
				text-align: left;
			}
		}
		.grid{
			grid-template-columns: 1fr;
			gap: calc(35 / 375 * 100vw);
			margin-bottom: calc(40 / 375 * 100vw);
			p{
				font-size: calc(13 / 375 * 100vw);
				text-align: center;
				letter-spacing: 0;
			}
		}
		.youtube {
			width: 100%;
			aspect-ratio: 16 / 9;
			margin-bottom: calc(5 / 375 * 100vw);
		}
		.youtube iframe {
			width: 100%;
			height: 100%;
		}
		.flex{
			display: flex;
			justify-content: space-between;
			line-height: 1.6;
			flex-wrap: wrap;
			gap: calc(25 / 375 * 100vw);
			>div{
				width: 100%;
				dl{
					&:not(:last-child){
						margin-bottom: calc(25 / 375 * 100vw);
					}
				}
			}
		}
		dt{
			color: #0084BB;
			font-size: calc(18 / 375 * 100vw);
		}
		dd{
			font-size: calc(14 / 375 * 100vw);
		}
	}

	#features{
		padding: calc(60 / 375 * 100vw) 0 calc(60 / 375 * 100vw);
		h2{
			margin: 0 auto calc(100 / 375 * 100vw);
			max-width: fit-content;
			&:before{
				position: absolute;
				top: 0;
				left: calc(-115 / 375 * 100vw);
				content: '';
				display: block;
				aspect-ratio: 360 / 190;
				width: calc(290 / 375 * 100vw);
				height: auto;
				background: url(../images/top/wave2.svg) no-repeat center / cover;
			}

			.row1,.row2{
				display: block;
				text-align: center;
			}
			.row1{
				font-weight: 600;
				color: #0084BB;
				font-size: calc(20 / 375 * 100vw);
			}
			.fs62{
				font-size: calc(46 / 375 * 100vw);
			}
			.fs30{
				font-size: calc(26 / 375 * 100vw);
			}
			.fs48{
				font-size: calc(32 / 375 * 100vw);
			}
		}
		.row{
			position: relative;
		}
		.num{
			position: absolute;
			top: calc(-2 / 375 * 100vw);
			left: 0;
			font-family: "Montserrat", sans-serif;
			font-weight: bold;
			color: #F9D56A;
			line-height: 1;
			font-size: calc(36 / 375 * 100vw);
			text-align: center;
		}
		h3{
			font-weight: 500;
			font-size: calc(24 / 375 * 100vw);
			line-height: 1.4;
			margin-bottom: calc(10 / 375 * 100vw);
			padding-left: calc(60 / 375 * 100vw);
			span{
				color: #E70509;
				font-weight: bold;
			}
		}
		h4{
			font-size: calc(18 / 375 * 100vw);
			font-weight: bold;
			color: #0084BB;
		}
		.text{
			font-size: calc(15 / 375 * 100vw);
			line-height: 1.4;
		}
		.f01{
			padding-left: 0;
			padding-top: 0;
			background: url(../images/top/features01.jpg) no-repeat center bottom / 100% auto;
			margin-bottom: calc(40 / 375 * 100vw);
			padding-bottom: calc(160 / 375 * 100vw);
		}
		.f02{
			margin-bottom: calc(50 / 375 * 100vw);
			display: flex;
			flex-wrap: wrap;
			padding-left: 0;
			flex-direction: column-reverse;
			.w_video{
				width: 100%;
				margin-top: calc(15 / 375 * 100vw);
				.br{
					border-radius: calc(15 / 375 * 100vw);
				}
			}
			.box{
				width: 100%;
			}
		}
		.f03{
			padding-left: 0;
			background: url(../images/top/features03.jpg) no-repeat bottom center / 100% auto;
			min-height: 0;
			padding-top: 0;
			padding-bottom: calc(330 / 375 * 100vw);
			.box{
				max-width: 100%;
			}

		}
	}

	#flow{
		background: linear-gradient(279.27deg, #264457 2.93%, #387EAA 100%);
		padding: calc(60 / 375 * 100vw) 0 calc(90 / 375 * 100vw);
		position: relative;
		z-index: 2;
		.sp_scroll_area{
			overflow: auto;
			padding-right: calc(20 / 375 * 100vw);
		}
		.w1000{
			padding-right: 0;
			position: relative;
		}
		ol{
			position: relative;
			width: calc(630 / 375 * 100vw);
			list-style: none;
			color: #fff;
			display: grid;
			grid-template-columns: repeat(3,1fr);
			gap: calc(30 / 375 * 100vw);
			&:before{
				position: absolute;
				top: calc(22 / 375 * 100vw);
				left: 50%;
				transform: translate(-50%, 0);
				content: '';
				display: block;
				width: calc(520 / 375 * 100vw);
				height: calc(3 / 375 * 100vw);
				background: #fff;
			}
			li{
				position: relative;
				z-index: 2;
				&:nth-child(1){
					.text{
						background: url(../images/top/step01.svg) no-repeat center calc(24 / 375 * 100vw) / calc(50 / 375 * 100vw) auto;
					}
				}
				&:nth-child(2){
					.text{
						background: url(../images/top/step02.svg) no-repeat center calc(24 / 375 * 100vw) / calc(50 / 375 * 100vw) auto;
					}
				}
				&:nth-child(3){
					.text{
						background: url(../images/top/step03.svg) no-repeat center calc(24 / 375 * 100vw) / calc(50 / 375 * 100vw) auto;
					}
				}
			}
			.step{
				font-family: "Montserrat", sans-serif;
				border: solid calc(1 / 375 * 100vw) #333;
				color: #333;
				font-weight: bold;
				font-size: calc(24 / 375 * 100vw);
				width: calc(106 / 375 * 100vw);
				height: calc(48 / 375 * 100vw);
				margin: 0 auto;
				background: #fff;
				border-radius: calc(50 / 375 * 100vw);
				display: flex;
				justify-content: center;
				align-items: center;
			}
			.text{
				font-size: calc(16 / 375 * 100vw);
				line-height: 1.6;
				padding-top: calc(82 / 375 * 100vw);
			}
		}
		.sp_scroll{
			z-index: 3;
			top: calc(170 / 375 * 100vw);
			left: 50%;
			transform: translate(-50%, 0);
			display: block;
			position: absolute;
			cursor: pointer;
			width: calc(75 / 375 * 100vw);
			margin-left: calc(10 / 375 * 100vw);
		}
	}

	#flow_cta{
		position: absolute;
		z-index: 5;
		right: revert;
		bottom: calc(-140 / 375 * 100vw);
		width: calc(100% - calc(30 / 375 * 100vw));
		height: calc(100 / 375 * 100vw);
		background: url(../images/top/fix_cta_bg_sp.png) no-repeat center / cover;
		border-radius: calc(15 / 375 * 100vw);
		text-align: center;
		text-decoration: none;
		color: #333;
		font-weight: 500;
		line-height: 1;
		padding-top: 0;
		&:hover{
			background-size: cover;
			.fs36{
				color: #0084BB;
			}
			.text01{
				color: #333;
			}
			.text03{
				background: #fff;
			}
		}
		.fs16{
			font-size: calc(13 / 375 * 100vw);
		}
		.fs28{
			font-size: calc(18 / 375 * 100vw);
		}
		.fs40{
			font-size: calc(28 / 375 * 100vw);
		}
		.text01{
			position: absolute;
			margin-bottom: 0;
			top: calc(18 / 375 * 100vw);
			left: calc(16 / 375 * 100vw);
			.fs16{
				display: block;
				&:first-child{
					margin-bottom: calc(3 / 375 * 100vw);
				}
				&:last-child{
					margin-top: calc(6 / 375 * 100vw);
				}
			}

		}
		.sp_right{
			position: absolute;
			right: calc(20 / 375 * 100vw);
			top: calc(17 / 375 * 100vw);
		}
		.text02{
			font-size: calc(10 / 375 * 100vw);
			max-width: fit-content;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: calc(2 / 375 * 100vw);
			span{
				margin: 0 calc(5 / 375 * 100vw);
			}
			&:before,&:after{
				position: relative;
				top: calc(3 / 375 * 100vw);
				content: '';
				display: inline-block;
				width: calc(1 / 375 * 100vw);
				background: #333;
				height: calc(14 / 375 * 100vw);
			}
			&:before{
				transform: rotate(-30deg);
			}
			&:after{
				transform: rotate(30deg);
			}
		}
		.text03{
			width: calc(172 / 375 * 100vw);
			height: calc(32 / 375 * 100vw);
			background: #fff;
			box-shadow: 0 calc(4 / 375 * 100vw) 0 #63580C;
			border-radius: calc(7 / 375 * 100vw);
			margin: 0 auto calc(6 / 375 * 100vw);
			font-size: calc(14 / 375 * 100vw);
			line-height: calc(32 / 375 * 100vw);
			padding-right: 0;
			position: relative;
			text-align: left;
			padding-left: calc(23 / 375 * 100vw);
			&:before{
				position: absolute;
				top: 50%;
				transform: translate(0, -50%);
				right: calc(22 / 375 * 100vw);
				content: '';
				display: block;
				width: calc(7 / 375 * 100vw);
				height: auto;
				aspect-ratio: 7/12;
				background: url(../images/top/arrow.svg) no-repeat center / cover;
			}
		}
		.text04{
			font-size: calc(9 / 375 * 100vw);
			letter-spacing: 0;
		}
	}

	#news{

		padding: calc(100 / 375 * 100vw) 0 calc(80 / 375 * 100vw);
		background: #EDEDED url(../images/top/bg_news.png) no-repeat right bottom / 60% auto;
		.ttl01{
			margin-bottom: calc(40 / 375 * 100vw);
		}
		ul{
			margin-bottom: calc(40 / 375 * 100vw);
		}
		li{
			position: relative;
			border-bottom: solid calc(1 / 375 * 100vw) #8D8D8D;
			display: flex;
			flex-wrap: wrap;
			padding: calc(22 / 375 * 100vw) 0;
			a{
				text-decoration: none;
				color: #333;
				font-size: calc(15 / 375 * 100vw);
				display: block;
				&:hover{
					color: #0084BB;
				}
			}
		}
		.cat{
			position: absolute;
			top: calc(22 / 375 * 100vw);
			left: calc(150 / 375 * 100vw);
			min-width: calc(110 / 375 * 100vw);
			font-size: calc(14 / 375 * 100vw);
		}
		.date{
			font-size: calc(14 / 375 * 100vw);
			font-weight: bold;
			color: #8D8D8D;
			width: 100%;
			margin-bottom: calc(10 / 375 * 100vw);

		}
		.w_text{
			width: 100%;
		}

		.textonly{
			a{
				pointer-events: none;
				cursor: default;
			}
		}
		.btn{
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			width: calc(156 / 375 * 100vw);
			height: calc(42 / 375 * 100vw);
			background: linear-gradient(93.22deg, #159BD6 4.58%, #27CFF0 95.47%);
			border-radius: calc(20 / 375 * 100vw);
			font-size: calc(16 / 375 * 100vw);
			color: #FFFFFF;
			text-decoration: none;
			margin: 0 auto;
			&:hover{
				background: linear-gradient(93.22deg, #264457 4.58%, #387EAA 95.47%);
			}
		}
	}

	#qa{
		padding: calc(60 / 375 * 100vw) 0 calc(80 / 375 * 100vw);
		.ttl01{
			margin-bottom: calc(40 / 375 * 100vw);
		}
	}

	#qa_list{
		display: grid;
		gap: calc(20 / 375 * 100vw);
		.q{
			position: relative;
			background: #E1F1FE;
			padding: calc(25 / 375 * 100vw) calc(48 / 375 * 100vw) calc(25 / 375 * 100vw) calc(55 / 375 * 100vw);
			border-radius: calc(10 / 375 * 100vw);
			cursor: pointer;
			&.open{
				color: #fff;
				border-radius: calc(10 / 375 * 100vw) calc(10 / 375 * 100vw) 0 0;
				background: linear-gradient(110.63deg, #149AD6 25.12%, #27CFF0 79.51%);
				&:before,&:after{
					background: #fff;
				}
				&:before{
					opacity: 0;
				}
			}
			&:before,&:after{
				top: 50%;
				right: calc(20 / 375 * 100vw);
				content: '';
				display: block;
				width: calc(17 / 375 * 100vw);
				height: calc(3 / 375 * 100vw);
				background: #333;
				position: absolute;
			}
			&:before{
				transform: rotate(90deg);
				margin-top: calc(1 / 375 * 100vw);
			}

			.ic{
				position: absolute;
				top: 50%;
				transform: translate(0, -50%);
				left: calc(17 / 375 * 100vw);
				font-size: calc(24 / 375 * 100vw);
			}
			.text{
				font-size: calc(15 / 375 * 100vw);
				line-height: 1.4;
			}
		}
		.a{
			padding: calc(26 / 375 * 100vw) calc(40 / 375 * 100vw) calc(26 / 375 * 100vw) calc(55 / 375 * 100vw);
			letter-spacing: 0;
			gap: calc(40 / 375 * 100vw);
			background: #FFFFFF;
			box-shadow: 0 0 calc(10 / 375 * 100vw) rgba(0, 51, 72, 0.3);
			border-radius: 0 0 calc(10 / 375 * 100vw) calc(10 / 375 * 100vw);
			position: relative;
			display: none;
			.ic{
				position: absolute;
				top: 50%;
				transform: translate(0, -50%);
				left: calc(17 / 375 * 100vw);
				font-size: calc(24 / 375 * 100vw);
				color: #0084BB;
			}
			.text{
				font-size: calc(14 / 375 * 100vw);
				line-height: 1.6;
				margin-bottom: 1.75em;
				&:last-child{
					margin-bottom: 0;
				}
			}
		}
	}

}