@charset "UTF-8";




/* CSS STYLE */

html {
	font-size: 2.666666vw;
}
body {
	min-width: 320px;
	font-size: 1.5rem;
	line-height: 1.65;
	letter-spacing: 0.05em;
	color: var(--baseColor);
}

.onlyPC{
	display: none;
}
.onlySP{
	display: block;
}

:root {
  --transition-duration: .3s;
  --transition-timing-function: cubic-bezier(.23, 1, .32, 1);
  --window-width: tan(atan2(100vw, 1px));
  --pc-lr: clamp(4rem,calc(50% - 80rem),16rem);
  --inner:100rem;
  --innerSp: 32.5rem;
  --fontMIN: "Noto Serif JP", sans-serif;
  --fontEN:"Jost",sans-serif;
  --baseColor:#000;
  --blue:#1C2267;
	--red:#CC0000;
}

.min{
	font-family: var(--fontMIN);
	font-weight: 400;
}
.eng{
	font-family: var(--fontEN);
	font-weight: 400;
}

.inview{
  transition: 0.5s;
  opacity: 0;
	&.is-inview {
		opacity: 1;
	}
	&.top{
		transform: translateY(2rem);
		&.is-inview {
			transform: translateY(0);
		}
	}
	&.left{
		transform: translateX(2rem);
		&.is-inview {
			transform: translateX(0);
		}
	}
	&.right{
		transform: translateX(-2rem);
		&.is-inview {
			transform: translateX(0);
		}
	}
}

.accordion-content {
  display: none;
  border:1px solid #F2F2F2;
  border-top:none;
  padding:2rem 2rem 2rem 2rem;
}
.accordion-header span{
  color:#393939;
  position: relative;
  display: inline-block;
}
.accordion-header span:before{
	content:"Q.";
	font-family: var(--fontEN);
	font-weight: 500;
	font-size: 2rem;
	color:#000;
	position: absolute;
	left:2rem;
	top:-0.2rem;
}
.accordion-content span:before{
	content:"A.";
	font-family: var(--fontEN);
	font-weight: 500;
	font-size: 2rem;
	color:#CC0000;
	position: absolute;
	left:0rem;
	top:-0.3rem;
}
.accordion-header {
  background-color: #F2F2F2;
  padding: 2rem 4.5rem 2rem 0rem;
  margin: 1rem 0 0 0;
  transition: background .3s ease;
  cursor: pointer;
  position: relative;
}

.accordion-header::before,
.accordion-header::after{
  position:absolute;
  content:'';
  top:1px;
  right:2rem;
  bottom:0;
  width:1.5rem;
  height:1px;
  margin:auto;
  background:#393939;
}
.accordion-header::after{
  transform:rotate(-90deg);
  transition:transform 0.3s;
}
.accordion-header.active::after{transform:rotate(0deg);}

.accordion-content {
  background-color: #FFF;
}

.accordion-header span{
  padding-left: 6rem;
  position: relative;
  display: inline-block;
}
.accordion-content span{
  padding-left: 4rem;
  position: relative;
  display: inline-block;
}


.tableArea{
	margin-top:1.5rem;
	overflow:hidden;
	img{
		width:100rem;
    max-width: 100rem;
	}
}
.scroll-hint-text{
	margin-top:0;
}








header{
	background:#FFF;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding:1.5rem 5.5rem 1.5rem 1.5rem;
	box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.07);
  position: fixed;
  width: 100%;
  left: 0;
	top: 0;
	z-index: 99;
  .logo{
		display: block;
    width: 16.3rem;
  }
	.navBtn{
		position: absolute;
		right: 1rem;
		top: 1.5rem;
		background: #373737;
		width: 4rem;
		height: 4rem;
		border-radius: 0.5rem;
		&::before,
		&::after{
			width: 1.6rem;
			height: 1px;
			content: '';
			display: block;
			background: #fff;
			position: absolute;
			inset: 0;
			margin: auto;
		}
		&::before{
			transform: translateY(-0.5rem);
		}
		&::after{
			transform: translateY(0.5rem);
		}
		span{
			width: 1.6rem;
			height: 1px;
			display: block;
			background: #fff;
			position: absolute;
			inset: 0;
			margin: auto;
		}
		&:hover{
			cursor: pointer;
		}
	}
	nav{
		position: absolute;
		right: -35.5rem;
		top: 0;
		background: #373737;
		color: #fff;
		width: 35.5rem;
		height: 100svh;
		padding:0 0 0 5rem;
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 2rem;
		transition: 0.3s;
		&.open{
			right: 0;
		}
		.closeBtn{
			width: 1.5rem;
			height: 1.5rem;
			position: absolute;
			right: 2.5rem;
			top: 2.5rem;
			&::before,
			&::after{
				content: '';
				display: block;
				background: #fff;
				width: 1px;
				height: 1.8rem;
				position: absolute;
				inset: 0;
				margin: auto;
			}
			&::before{
				rotate:45deg;
			}
			&::after{
				rotate:-45deg;
			}
			&:hover{
				cursor: pointer;
			}
		}
		ul{
			li{
				font-size: 1.6rem;
				&:not(:last-child){
					margin-bottom: 1.5rem;
				}
				
			}
		}
		ul li a,
		a.corp{
			color: #fff;
		}
		a.corp{
			&::after{
				content: '';
				background: url(../img/icon_outer.svg) no-repeat center center/1.6rem;
				width: 1.6rem;
				height: 1.2rem;
				display: inline-block;
				margin-left: 0.5rem;
			}
		}
		.btn.contact{
			width: 22rem;
			height: 5.8rem;
			background: url(../img/icon_contact.svg) no-repeat var(--blue) left 2.5rem center/2rem;
			font-size: 1.6rem;
			padding-left: 2.5rem;
		}
	}
}
.btn{
	&.contact{
		font-weight: 500;
		font-size: 1.3rem;
		display: flex;
		align-items: center;
		justify-content: center;
		background: var(--blue);
		color: #fff;
		border-radius: 0.5rem;
		width: 11rem;
		height: 4rem;
		text-align: center;
	}
}


.main_v{
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	padding-top: 7rem;
	height: 67rem;
	.m_text{
		padding-top: 14rem;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		align-content: flex-start;
		gap: 0 1rem;
		position: absolute;
		inset: 0;
		margin: auto;
		z-index: 2;
	}
	h1{
		text-align: center;
		color: #fff;
		font-size: 4.7rem;
		letter-spacing: 0.07em;
		line-height: calc(56/47);
		margin-bottom: 2rem;
		text-shadow: 0.1rem 0.1rem rgba(0,0,0,0.3);
		width: 100%;
		span{
			&.one{
				display: inline-block;
				padding-left: 2.2rem;
			}
			&.bd{
				position: relative;
				z-index: 1;
				display: inline-block;
				transform: translateX(1rem);
				padding: 0 0.5rem;
				&::before{
					content: '';
					display: block;
					width: 100%;
					height: 1rem;
					background: linear-gradient(90deg,rgba(28, 34, 103, 1) 0%, rgba(28, 34, 103, 0) 100%);
					position: absolute;
					left: 0;
					bottom:0;
					z-index: -1;
				}
			}
		}
	}
	p{
		color: #fff;
		text-shadow: 0.1rem 0.1rem rgba(0,0,0,0.3);
		font-size: 1.8rem;
		line-height: calc(28/18);
		text-align: center;
		margin-bottom: 3rem;
		width: 100%;
		transition-delay: 0.2s;
	}
	dl{
		width: 10.4rem;
		height: 10.4rem;
		border-radius: 100%;
		border: 1px solid var(--blue);
		background: rgba(255,255,255,0.8);
		text-align: center;
		line-height: 1;
		transition-delay: 0.4s;
		&:nth-of-type(2){
			transition-delay: 0.5s;
		}
		&:nth-of-type(3){
			transition-delay: 0.6s;
		}
		dt{
			padding-top: 2.6rem;
			font-size: 1.1rem;
			font-weight: 500;
			margin-bottom: 0.5rem;
		}
		dd{
			font-size: 1rem;
			font-weight: 500;
			.tar{
				text-align: right;
				display: block;
				padding-right: 1.5rem;
			}
			.eng{
				color: var(--blue);
				font-size: 3.5rem;
				letter-spacing: -0.05em;
				padding: 0 0.4rem 0 0;
			}
			&.small{
				padding-top: 0;
				.eng{
					font-size: 3.3rem;
				}
			}
		}
	}
	.swiper{
		width: 100%;
		height: 100%;
		.swiper-slide-active div,
		.swiper-slide-duplicate-active div,
		.swiper-slide-prev div {
			animation: zoom 8s linear 0s normal both;
		}
		.swiper-slide{
			div{
				width: 100%;
				height: 100%;
				img{
					object-fit: cover;
					width: 100%;
					height: 100%;
				}
			}
		}
	}
}
@keyframes zoom {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15);
  }
}

.tc{
	text-align: center;
}




.second_block{
	margin:-4rem auto 0;
	background:#FFF;
	border-radius: 1rem;
	z-index: 1;
    position: relative;
	width: calc(100% - 2rem);
	text-align: center;
	padding:3rem 0 0 0;
	h2{
		font-size: 2.1rem;
		font-weight: 500;
		color:#000;
	}
	ul{
		display: flex;
		justify-content: space-between;
		margin:2rem auto 0;
		flex-wrap: wrap;
		li{
			width:90%;
			max-width: 90%;
			background:#F8F8F8;
			text-align: center;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 1.4rem;
			font-weight: 500;
			padding:1.5rem 0;
			margin:0 auto 1rem;
			em{
				display: contents;
				color:#B1384D;
				font-weight: 500;
			}
			&:nth-child(1){
				transition-delay: 0.1s;
			}
			&:nth-child(2){
				transition-delay: 0.2s;
			}
			&:nth-child(3){
				transition-delay: 0.3s;
			}
			&:nth-child(4){
				transition-delay: 0.4s;
			}
		}
	}
}


.base_block{
	width: calc(100% - 4rem);
	margin:6rem auto 0;
	.en_ttl{
		background:url(../../assets/img/pict01.svg) center top no-repeat;
		background-size: 3rem auto;
		text-align: center;
		font-family: var(--fontEN);
		font-weight: 500;
		color:#B4B4B4;
		font-size: 1.3rem;
		padding:6rem 0 0 0;
	}
	h2{
		font-size: 2.4rem;
		font-weight: 500;
		text-align: center;
		margin:2rem 0 3rem 0;
		color:#000;
	}
	.point_img{
		max-width:100%;
		margin:3rem auto 0;
	}
}

.img_base{
	width: 100%;
	margin:6rem auto 0;
	aspect-ratio: 345/200;
	overflow: hidden;
	position: relative;
	img{
		height: 28rem;
		max-width: inherit;
		width: auto;
		&.center{
			margin-left: -9.3rem;
		}
		&.img03{
			height: 32rem;
		}
	}
}




.reason{
	width: 100%;
	background:#F6F6F6;
	margin:-6rem auto 0;
	padding:12rem 0 2rem 0;
	.en_ttl{
		background:url(../../assets/img/pict01.svg) center top no-repeat;
		background-size: 3rem auto;
		text-align: center;
		font-family: var(--fontEN);
		font-weight: 500;
		color:#B4B4B4;
		font-size: 1.3rem;
		padding:6rem 0 0 0;
	}
	h2{
		font-size: 2.4rem;
		font-weight: 500;
		text-align: center;
		margin:3rem 0;
		color:#000;
	}
	h2.logo_text{
		display: flex;
		justify-content: center;
		align-items: center;
    flex-wrap: wrap;
    vertical-align: text-top;
    display: block;
		img{
			margin:auto;
      width: 21rem;
		}
	}
	.reason_area{
		width: calc(100% - 4rem);
		display: flex;
		justify-content: space-between;
		margin: 0rem auto 4rem;
    flex-wrap: wrap;
		img{
			width: 100%;
			margin-right:0rem;
		}
		.reason_text{
			display: flex;
			flex-direction: column;
			justify-content: center;
      h3{
        font-size: 2rem;
        font-weight:500;
        margin-bottom:2rem;
        position: relative;
        padding-left:4rem;
        color:#000;
        margin-top:2rem;
				&::before{
					font-family: var(--fontEN);
					font-weight: 500;
					color:#1C2267;
					position: absolute;
					font-size: 1.7rem;
					left:0;
					top:0.3rem;
				}
      }
      h3.no1:before{
        content:"01";
      }
      h3.no2:before{
        content:"02";
      }
      h3.no3:before{
        content:"03";
      }
      h3.no4:before{
        content:"04";
      }
		}
	}
  .reason_area.sp .photo{
    order:1;
  }
  .reason_area.sp .reason_text{
    order:2;
  }
}


.features_list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin:3rem auto 0;
	li{
		width: 100%;
		max-width: 100%;
    margin:0rem 0 4rem 0;
		transition-delay: 0.1s;
		&:last-child{
			margin-bottom: 0;
		}
		.eng{
			color: var(--navy);
			font-size: 1.4rem;
			font-weight: 500;
			margin-bottom: 1.5rem;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			gap: 1.5rem;
			&::after{
				content: '';
				display: block;
				width: 3.5rem;
				height: 1px;
				background: var(--blue);
			}
		}
		img{
			border-radius: 1rem;
		}
		div{
			font-size: 2rem;
			font-weight: 500;
			color:#000;
			margin:1.5rem 0;
		}
	}
}



.conv_block{
	margin:6rem auto;
	background-image: linear-gradient(129deg, #363c82, #1c2267);
	padding:4rem 0;
	.ir{
		width: calc(100% - 4rem);
		margin:auto;
		text-align: center;
		div{
			font-size: 2.4rem;
			color:#FFF;
			font-weight: 500;
		}
		p{
			color:#FFF;
			margin:1rem 0 0 0;
			transition-delay: 0.2s;
		}
		a{
			background:#FFF url(../../assets/img/link_arw.svg) right 1.5rem center no-repeat;
			background-size: 3.6rem 3.6rem;
			padding:1.2rem 2rem;
			border-radius: 0.6rem;
			font-size: 1.6rem;
			font-weight:500;
			display: inline-block;
			margin:2rem auto 0;
      width: 100%;
			transition-delay: 0.3s;
		}
	}
}
.conv_block.extra_bottom{
	margin:15rem auto 0;
}




.tableArea{
	overflow:auto;
	margin:4rem auto 0;
	table{
		width: 100rem;
		th,td{
			border: 1px solid #707070;
			text-align: center;
			vertical-align: middle;
		}
		thead{
			td{
				width: 17rem;
			}
			th{
				width: 27.5rem;
				background: #F8F8F8;
				font-size: 1.8rem;
				font-weight: 500;
				padding: 2.5rem;
				img{
					width: 19rem;
				}
				&:nth-child(2){
					background-color: #fff;
					border-top: 6px solid var(--blue);
					border-left: 6px solid var(--blue);
					border-right: 6px solid var(--blue);
				}
			}
		}
		tbody{
			th{
				background: #B7B7B7;
				color: #fff;
				font-weight: bold;
				font-weight: 500;
				line-height: calc(25/16);
			}
			td{
				line-height: calc(28/16);
				padding: 1.5rem 0;
				&:nth-child(2){
					font-weight: bold;
					border-left: 6px solid var(--blue);
					border-right: 6px solid var(--blue);
				}
			}
			tr{
				&:last-child{
					td{
						&:nth-child(2){
							border-bottom: 6px solid var(--blue);
						}
					}
				}
			}
		}
	}
}
.scroll-hint-text{
	margin-top:0;
}


.series_sb{
	font-size:1.8rem;
	font-weight: 500;
	color:#000;
	position: relative;
	&:before{
		content:"－";
		color:#ABABAB;
		padding-right:2rem;
	}
	&:after{
		content:"－";
		color:#ABABAB;
		padding-left:2rem;
	}
}


.series_list{
	display: flex;
	justify-content:center;
	flex-wrap: wrap;
	margin:4rem auto 0;
	gap: 4rem 3rem;
	.single{
		width: 100%;
		position: relative;
		padding-top: 12.5rem;
		transition-delay: 0.1s;
		.ph{
			position: absolute;
			left: 0;
			right: 0;
			top: 0;
			z-index: 1;
			width: auto;
			height: 17rem;
			img{
				width: auto;
				height: 100%;
				margin: 0 auto;
				display: block;
			}
		}
		.cont{
			background: #F6F6F6;
			border-radius: 1rem;
			padding: 7.5rem 5rem 5rem;
		}
		.ttl{
			margin-bottom: 2rem;
			display: flex;
			gap: 2rem;
			align-items: center;
			justify-content: flex-start;
			span{
				background: var(--blue);
				color: #fff;
				border-radius: 10rem;
				padding: 1rem 2rem;
				line-height: 1;
				font-size: 1.3rem;
				font-weight: 500;
			}
		}
		h3{
			position: relative;
			padding-left: 2rem;
			font-size: 2rem;
			font-weight: 500;
			&::before{
				content: '';
				width: 0.6rem;
				height: 0.6rem;
				display: block;
				border-radius: 100%;
				background: var(--blue);
				position: absolute;
				left: 0;
				top: 0;
				bottom: 0;
				margin: auto;
			}
		}
		dl{
			font-size: 1.4rem;
			&:not(:last-child){
				margin-bottom: 1.5rem;
			}
			dt{
				font-weight: 600;
			}
			dd{
				img{
					mix-blend-mode: multiply;
				}
			}
		}
	}
}


.bottom_txt{
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	background: url(../../assets/img/line01.svg) left center no-repeat ,  url(../../assets/img/line02.svg) right center no-repeat;
	background-size: contain;
  margin: 4rem auto 0;
  padding:0 3rem;
  font-size: 1.4rem;
}





.case_area.mg{
	margin-top:3rem;
}
.case_area{
	margin-top:2rem;
	background:#F6F6F6;
	border-radius: 1rem;
	display: flex;
	padding:2rem;
	justify-content: space-between;
	align-items: center;
  flex-wrap: wrap;
	img{
		width:100%;
	}
	.case_text{
		.case_en{
			font-family: var(--fontEN);
			font-weight: 500;
			font-size: 1.3rem;
			color:#000;
      		margin:2rem 0 0 0;
		}
		h3{
			font-size: 2.1rem;
			color:#000;
			margin:1rem 0 2rem 0;
			font-weight: 500;
		}
		dl.assignment{
			display: flex;
			justify-content: space-between;
			padding:0 0 3rem 0;
			position: relative;
			dt{
				width: 11rem;
				font-size: 1.4rem;
				margin-right:1rem;
				span{
					background:#FFF;
					display: block;
					border-radius: 10rem;
					text-align: center;
					padding:0.3rem 0;
				font-size: 1.4rem;
				}
				&::before{
					content: '';
					display: block;
					background: url(../img/arw.svg) no-repeat center center/1.6rem;
					width: 1.6rem;
					height: calc(100% - 3rem);
					position: absolute;
					left: 4.8rem;
					bottom: 0;
					margin: auto;
				}
			}
			dd{
				flex: 1;
				font-size: 1.4rem;
			}
		}
		dl.results{
			display: flex;
			justify-content: space-between;
			dt{
				width: 11rem;
				font-size: 1.4rem;
				margin-right:1rem;
				span{
					background:#1C2267;
					display: block;
					color:#FFF;
					border-radius: 10rem;
					text-align: center;
					padding:0.2rem 0;
				}
			}
			dd{
				color:#1C2267;
				flex: 1;
				font-size: 1.4rem;
			}
		}
	}
}

.case_area.sp .photo{
  order:1;
}
.case_area.sp .case_text{
  order:2;
}



.pickup{
	width: calc(100% - 10rem);
	margin:4rem auto 0;
	display: flex;
	justify-content: center;
	gap:1rem;
  flex-wrap: wrap;
	li{
		width:100%;
		background:#393939;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 1.6rem;
		color:#FFF;
		border-radius: 1rem;
		flex-direction: column;
		padding:1.5rem 2rem;
		span{
			font-size: 2rem;
			em{
				font-size: 4rem;
				font-family: var(--fontEN);
				font-weight: 500;
				line-height:1;
			}
		}
	}
}


.base_block.wide{
	width: 100%;
	max-width: inherit;
	.tc,
	.job_list{
		width: 33.5rem;
		margin: 0 auto;
	}
}
.logo_ttl{
	font-size:2.4rem;
	font-weight: 500;
	color:#000;
	position: relative;
}

.job_list{
	display: flex;
	justify-content: center;
	margin:3rem auto 0;
	gap:0.8rem;
  flex-wrap: wrap;
	li{
		background:#F6F6F6;
		border-radius: 6rem;
		padding:0.5rem 1rem;
    font-size: 1.2rem;
	}
}



.logo_list{
	margin-top: 3.5rem;
	.swiper-wrapper {
		transition-timing-function: linear;
	}
	.swiper-slide{
		border:1px solid #E1E1E1;
		border-radius: 0.5rem;
		background:#FFF;
		padding:0.2rem 1rem;
		img {
			height: auto;
			width: 100%;
		}
	}
}




.flow_area{
	position: relative;
	ul{
		display: flex;
		justify-content: center;
    flex-wrap: wrap;
    margin:3rem auto 0;
    justify-content: space-between;
    padding:0 2rem;
		li{
			width: 46%;
			text-align: center;
			color:#000;
			background:#FFF;
      margin:0 0 4rem 0;
			span.eng{
				font-size: 1.5rem;
				font-weight: 500;
				color: var(--blue);
				line-height: 1;
				padding-bottom: 1rem;
			}
			img{
				margin-bottom:1rem;
        width: 100%;
			}
			small{
				font-size: 1.2rem;
				letter-spacing: 0;
			}
		}
	}
}

.gray_area{
	display:inline-block;
	text-align: center;
	background:#F3F3F3;
	padding:2rem 2rem;
	margin:0rem auto 0;
}

.form{
	margin: 6rem auto 0;
	width: 100%;
	background:#F6f6f6;
	padding: 5rem 0;
	.inner{
		width: 33.5rem;
		margin: 0 auto;
	}
	h2{
		font-size: 2.4rem;
		font-weight: 500;
		text-align: center;
		margin: 0 0 3rem;
	}
	dl{
		&:not(:last-child){
			margin-bottom: 2rem;
		}
		dt{
			width: 100%;
			font-weight: bold;
			line-height: calc(25/16);
			position: relative;
			display: flex;
			align-items: center;
			justify-content: flex-start;
			gap: 1rem;
			margin-bottom: 0.8rem;
			.required{
				display: block;
				background: var(--red);
				color: #fff;
				font-size: 1.1rem;
				font-weight: 500;
				line-height: 1;
				padding: 0.3rem 0.5rem 0;
				height: 1.8rem;
			}
		}
		dd{
			width: 100%;
			.error{
				color: var(--red);
				margin-top: 0.3rem;
			}
		}
	}
	input,
	textarea{
		font-family: "Noto Sans JP", sans-serif;
		display: block;
		width: 100%;
		padding: 1rem;
		border: 1px solid #A4A4A4;
		border-radius: 0.5rem;
		&::placeholder{
			color: #D4D4D4;
		}
		&[type=submit]{
			background: url(../img/link_arw_white.svg) no-repeat var(--blue) right 2rem center/3rem;
			padding-right: 3rem;
			display: block;
			width: 100%;
			height: 6rem;
			color: #fff;
			font-size: 1.8rem;
			font-weight: 500;
			margin: 0 auto;
			border: none;
			text-align: center;
			transition: 0.3s;
			&:hover{
				cursor: pointer;
				opacity: 0.7;
			}
		}
	}
	textarea{
		resize: horizontal;
		height: 14.4rem;
	}
	.calendar{
		position: relative;
		input[type="date"]{
			background-image: url(../img/icon_calendar.svg);
			background-repeat: no-repeat;
			background-position: left 1.5rem center;
			background-size: 2.7rem;
			padding-left: 5rem;
			&::-webkit-inner-spin-button{
				-webkit-appearance: none;
			}
			&::-webkit-clear-button{
				-webkit-appearance: none;
			}
			&::-webkit-calendar-picker-indicator{
				position: absolute;
				left: 0;
				top: 0;
				bottom: 0;
				margin: auto;
				padding: 0;
				background: transparent;
				color: transparent;
				cursor: pointer;
				height: 100%;
				width: 100%;
			}
		}
	}

	.checkbox{
		display: flex;
		flex-wrap: wrap;
		gap: 0.5rem 2rem;
		input{
			display: none;
			&+span,
			&+div{
				padding-left: 2.3rem;
				position: relative;
				display: block;
				min-height: 1.8rem;
				&::before,
				&::after{
					content: '';
					display: block;
					position: absolute;
					left: 0;
					top: 0.3rem;
					margin: auto;
					background: #fff;
					transition: 0.3s;
					width: 1.8rem;
					height: 1.8rem;
				}
				&::before{
					border: 1px solid #A4A4A4;
				}
				&::after{
					background: url(../img/icon_check.svg) no-repeat left 0.4rem top 0.4rem /1.1rem;
					opacity: 0;
				}
			}
			&:checked{
				&+span,
				&+div{
					&::after{
						opacity: 1;
					}
				}
			}
			
		}
	}
	.privacy{
		margin-bottom: 3.5rem;
		.box{
			background: #fff;
			border: 1px solid #A4A4A4;
			padding: 1.5rem;
			border-radius: 0.5rem;
			height: 18rem;
			overflow-y: scroll;
			margin-bottom: 2.5rem;
		}
		.ttl{
			font-weight: 500;
			margin-bottom: 1rem;
		}
		.cont{
			font-size: 1.3rem;
			line-height: calc(20/13);
		}
		.checkbox{
			display: flex;
			justify-content: center;
			font-size: 1.4rem;
			&:hover{
				cursor: pointer;
			}
		}
	}
}


footer{
	background:#FFF;
	padding:4rem 0;
	font-family: var(--fontEN);
	font-weight: 400;
	font-size: 1.4rem;
	color:#4E4E4E;
	text-align: center;
	div{
		width: 33.5rem;
		max-width: 110rem;
		margin: 0 auto;
		display: flex;
		flex-direction: column-reverse;
		gap: 2rem;
		align-items: center;
	}
	a.corp{
		position: relative;
		&::after{
			content: '';
			background: url(../img/icon_outer.svg) no-repeat center center/1.6rem;
			width: 1.6rem;
			height: 1.2rem;
			display: inline-block;
			margin-left: 0.5rem;
		}
	}
}


.conv_block.extra_bottom{
	margin:6rem auto 0;
}


.completePage{
	background: #F9F9F9;
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5rem;
	.base_block{
		padding-top: 13rem;
		margin: auto auto 0;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	h1{
		background: url(../../assets/img/pict01.svg) center top no-repeat;
    background-size: 3rem auto;
		text-align: center;
		font-weight: 500;
		font-size: 2.4rem;
		padding: 5.5rem 0 0 0;
		margin-bottom: 2.5rem;
	}
	p{
		margin-bottom: 5rem;
	}
	.btn{
		background: #656565;
		color: #fff;
		width: 20rem;
		height: 5rem;
		border-radius: 0.5rem;
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
		position: relative;
		&:hover{
			opacity: 0.7;
		}
		&::after{
			content: '';
			display: block;
			width: 0.7rem;
			height: 0.7rem;
			border-right: 1px solid #fff;
			border-top: 1px solid #fff;
			rotate: 45deg;
			position: absolute;
			right: 2rem;
			top: 0;
			bottom: 0;
			margin: auto;
		}
	}
	footer{
		background: transparent;
		border-top: 1px solid #C5C5C5;
		margin-top: auto;
		width: 100%;
	}
}
