@charset "UTF-8";

@media screen and (max-width: 750px){
	#request{
		padding-bottom : calc( 70 * 100vw / 750 );
	}
}

@media print,screen and (min-width: 751px){
	#request{
		padding-bottom : 45px;
	}
}

.title{
	display : grid;
	place-items : center start;
	background-color : var(--primary);
	color : #fff;
}

@media screen and (max-width: 750px){
	.title{
		height : calc( 150 * 100vw / 750 );
	}
	.title{
		font-size : 4rem;
		line-height : 1.2;
	}
	.title{
		padding-left : calc( 28 * 100% / 750 );
		padding-right : calc( 28 * 100% / 750 );
	}
}

@media print,screen and (min-width: 751px){
	.title{
		height : 150px;
	}
	.title{
		font-size : 2.8rem;
		line-height : 1.2;
	}
	.title{
		padding-left : 31px;
		padding-right : 31px;
	}
}

@media screen and (max-width: 750px){
	.lede{
		margin-top : calc( ( 30 - 6 ) * 100vw / 750 );
	}
	.lede{
		font-size : 2.6rem;
		line-height : 1.46;
	}
}

@media print,screen and (min-width: 751px){
	.lede{
		margin-top : calc( 45px - 4px );
		text-align : center;
	}
	.lede{
		font-size : 1.6rem;
		line-height : 1.5;
	}
}

.form-request fieldset{
	border : 0;
}

.form-request legend{
	border-left-color : currentColor;
	color : var(--primary);
	background-color : #e5e5e5;
	display : block;
	width : 100%;
	font-weight : 700;
}

.form-request input:where([type="text"] , [type="password"] , [type="email"]){
	background-color : #e5e5e5;
	width : 100%;
}

.form-request input:where([type="text"] , [type="password"] , [type="email"]):-ms-input-placeholder{
	color : #999;
}

.form-request input:where([type="text"] , [type="password"] , [type="email"])::placeholder{
	color : #999;
}

.form-request input:where([type="text"] , [type="password"] , [type="email"]):disabled{
	cursor : inherit;
	background-color : #999;
	color : #ccc;
}

.form-request input[type="radio"]{
	accent-color : black;
}

.form-request select{
	background-color : #e5e5e5;
	width : 100%;
}

.form-request .radios{
	display : flex;
	flex-wrap : wrap;
	align-items : center;
}

.form-request .radios label{
	position : relative;
}

.form-request .radios label input{
	display : none;
}

.form-request .radios label span{
	display : grid;
	align-items : center;
	cursor : pointer;
	position : relative;
}

.form-request .radios label span::before{
	content : "";
	display : grid;
	place-items : center start;
	border-radius : 50%;
	font-size : 0;
	background-color : #e5e5e5;
	font-size : 0;
}

.form-request .radios label input:checked + span:after{
	content : "";
	display : block;
	position : absolute;
	border-radius : 50%;
	font-size : 0;
	background-color : #3e0505;
	top : 50%;
	transform : translateY(-50%);
}

.form-request .checkboxies{
	display : flex;
	flex-wrap : wrap;
}

.form-request .checkboxies label{
	display : grid;
    margin: 5px 0px;
}

.form-request .checkboxies label span{
	cursor : pointer;
	display : grid;
	position : relative;
	align-items : center;
	position : relative;
}

.form-request .checkboxies label span:before{
	content : "";
	flex-shrink : 0;
	display : flex;
	align-items : center;
	justify-content : center;
	font-size : 0;
}

.form-request .checkboxies label input[type="checkbox"]{
	opacity : 0;
	position : absolute;
	visibility : hidden;
}

.form-request .checkboxies label span:before{
	background-color : #cbd5dc;
}

.form-request .checkboxies label input:checked + span:after{
	content : "";
	display : block;
	background : url("../images/ui/icon/check.webp") 0 0 / contain no-repeat;
	position : absolute;
}

@media screen and (max-width: 750px){
	.form-request{
		margin-top : calc( ( 56 - 6 ) * 100vw / 750 );
	}
	.form-request legend{
		border-left-width : calc( 10 * 100vw / 750 );
	}
	.form-request legend{
		font-size : 3.4rem;
		line-height : 1.2;
	}
	.form-request legend{
		padding-top : calc( 19.6 * 100vw / 750 );
		padding-bottom : calc( 19.6 * 100vw / 750 );
		padding-left : calc( 22 * 100% / 690 );
		padding-right : calc( 32 * 100% / 690 );
	}
	.form-request input:where([type="text"] , [type="password"] , [type="email"]) , .form-request select{
		padding-left : 1.6rem;
		padding-right : 1.6rem;
		height : calc( 80 * 100vw / 750 );
	}
	.form-request input:where([type="text"] , [type="password"] , [type="email"]) , .form-request select{
		font-size : 2.6rem;
		line-height : 1.2;
	}
	.form-request .radios{
		column-gap : calc( 62 * 100% / 690 );
		row-gap : calc( 14 * 100vw / 750 );
		padding-left : calc( 20 * 100% / 690 );
		padding-top : calc( 24 * 100vw / 750 );
		padding-bottom : calc( 10 * 100vw / 750 );
	}
	.form-request .radios span{
		grid-template-columns : 3rem auto;
		column-gap : 1.1rem;
		font-size : 2.6rem;
	}
	.form-request .radios span:before{
		height : calc( 30 * 100vw / 750 );
	}
	.form-request .radios input:checked + span:after{
		width : 1.5rem;
		height : calc( 15 * 100vw / 750 );
		left : .75rem;
	}
	.form-request .kinds input{
		margin-top : calc( 14 * 100vw / 750 );
	}
	.form-request .checkboxies{
		align-items : center;
		column-gap : calc( 48 * 100% / 690 );
		row-gap : calc( 14 * 100vw / 750 );
	}
	.form-request .checkboxies label span{
		grid-template-columns : 4rem 1fr;
		column-gap : .8rem;
		font-size : 2.6rem;
	}
	.form-request .checkboxies label span:before{
		height : calc( 40 * 100vw / 750 );
		background-color : #e5e5e5;
	}
	.form-request .checkboxies label input:checked + span:after{
		width : 3.9rem;
		height : calc( 33 * 100vw / 750 );
		top : calc( 7 * 100vw / 750 );
		left : -.1rem;
	}
}

@media print,screen and (min-width: 751px){
	.form-request{
		margin-top : calc( 48px - 4px );
	}
	.form-request legend{
		border-left-width : 5px;
		font-size : 3rem;
		padding-top : 25px;
		padding-bottom : 25px;
		padding-left : 23px;
		padding-right : 28px;
	}
	.form-request input:where([type="text"] , [type="password"] , [type="email"]) , .form-request select{
		padding-left : 19px;
		padding-right : 19px;
		height : 40px;
	}
	.form-request input:where([type="text"] , [type="password"] , [type="email"]) , .form-request select{
		font-size : 1.6rem;
		line-height : 1.5;
	}
	.form-request .radios{
		column-gap : 62px;
		padding-left : 14px;
	}
	.form-request .radios span{
		grid-template-columns : 15px auto;
		column-gap : 11px;
		font-size : 1.6rem;
	}
	.form-request .radios span:before{
		height : 15px;
	}
	.form-request .radios input:checked + span:after{
		width : 9px;
		height : 9px;
		left : 3px;
	}
	.form-request .kinds{
		display : grid;
		grid-template-columns : auto 100px 380px 1fr;
		align-items : center;
	}
	.form-request .kinds > label{
		padding-left : 45px;
		font-size : 1.6rem;
	}
	.form-request .kinds input:-ms-input-placeholder{
		font-size : 0;
	}
	.form-request .kinds input::placeholder{
		font-size : 0;
	}
	.form-request .s{
		width : 280px;
	}
	.form-request .m{
		width : 380px;
	}
	.form-request .l{
		width : 580px;
	}
	.form-request .xl{
		width : 780px;
	}
	.form-request .checkboxies{
		column-gap : 28px;
		padding-left : 12px;
		align-items : center;
	}
	.form-request .checkboxies label span{
		grid-template-columns : 20px 1fr;
		column-gap : 8px;
		font-size : 1.6rem;
	}
	.form-request .checkboxies label span:before{
		height : 20px;
		background-color : #cbd5dc;
	}
	.form-request .checkboxies label input:checked + span:after{
		width : 22px;
		height : 19px;
		top : 3px;
		left : -1px;
	}
}

.list table{
	display : block;
	width : 100%;
}

@media screen and (max-width: 750px){
	.list table{
		margin-top : calc( 31 * 100vw / 750 );
	}
	.list tbody{
		display : block;
		width : 100%;
	}
	.list tbody tr{
		display : grid;
		border : calc( 5 * 100vw / 750 ) solid #e5e5e5;
		width : 100%;
		padding-top : calc( 10 * 100vw / 750 );
		padding-bottom : calc( 10 * 100vw / 750 );
		grid-template-columns : calc( 573 * 100% / 680 ) 1fr;
		align-items : center;
		row-gap : calc( ( 17 - 3 - 2.2 ) * 100vw / 750 );
		position : relative;
	}
	.list tbody tr + tr{
		margin-top : calc( 30 * 100vw / 750 );
	}
	.list tbody tr:before{
		position : absolute;
		top : calc( 10 * 100vw / 750 );
		left : calc( 573 * 100% / 680 );
		content : "";
		display : block;
		width : calc( 2 * 100% / 680 );
		height : calc( 100% - ( 20 * 100vw / 750 ) );
		background-color : #e5e5e5;
	}
	.list tbody td:nth-of-type(1){
		padding-left : calc( 20 * 100% / 573 );
		padding-right : calc( 13 * 100% / 573 );
		grid-row : 1;
		grid-column : 1;
		font-weight : 700;
	}
	.list tbody td:nth-of-type(1){
		font-size : 3rem;
		line-height : 1.2;
	}
	.list tbody td:nth-of-type(1){
		color : #575757;
		padding-top : calc( ( 12 - 3 ) * 100vw / 750 );
	}
	.list tbody td:nth-of-type(2){
		padding-left : calc( 20 * 100% / 573 );
		padding-right : calc( 13 * 100% / 573 );
	}
	.list tbody td:nth-of-type(2){
		font-size : 2.2rem;
		line-height : 1.2;
	}
	.list tbody td:nth-of-type(2){
		grid-column : 1;
		grid-row : 2;
		padding-bottom : calc( ( 16 - 2.2 ) * 100vw / 750 );
	}
	.list tbody td:nth-of-type(3){
		grid-column : 2;
		grid-row : 1/3;
	}
	.list tbody button{
		display : flex;
		flex-direction : column;
		align-items : center;
		justify-content : center;
		text-align : center;
		width : 100%;
		height : 100%;
	}
	.list tbody button img{
		height : calc( 44 * 100vw / 750 );
	}
	.list tbody button span{
		margin-top : calc( 11 * 100vw / 750 );
		font-size : 2.2rem;
	}
}

@media print,screen and (min-width: 751px){
	.list table{
		margin-top : 21px;
	}
	.list thead{
		display : block;
	}
	.list thead tr{
		display : grid;
		grid-template-columns : 680px 380px 80px;
		column-gap : 20px;
		grid-template-rows : 53px;
	}
	.list thead th{
		display : grid;
		background-color : #95a8b2;
		color : #fff;
		font-size : 1.8rem;
		padding-left : 18px;
		padding-right : 18px;
		place-items : center;
	}
	.list thead th:not(:last-of-type){
		place-items : center left;
	}
	.list tbody{
		display : block;
	}
	.list tbody tr{
		display : grid;
		border-bottom : 1px solid #c9c9c9;
		grid-template-rows : auto;
		grid-template-columns : 700px 400px 80px;
	}
	.list tbody td:nth-of-type(-n+2){
		font-size : 1.8rem;
		line-height : 1.2;
	}
	.list tbody td:nth-of-type(-n+2){
		padding-top : 25.2px;
		padding-bottom : 25.2px;
		padding-left : 18px;
		padding-right : 38px;
		color : #333;
	}
	.list tbody button{
		width : 100%;
		height : 100%;
		display : grid;
		place-items : center;
	}
	.list tbody img{
		height : 24px;
	}
}

.logins{
	display : grid;
}

.logins input[type="submit"]{
	display : grid;
	place-items : center;
	background-color : var(--primary);
	color : #fff;
	height : 100%;
}

.logins a{
	text-decoration : underline;
	justify-self : start;
}

@media screen and (max-width: 750px){
	.logins{
		grid-template-columns : calc( 450 * 100% / 690 ) calc( 230 * 100% / 690 );
		column-gap : calc( 10 * 100% / 690 );
		grid-template-rows : auto calc( ( 22 - 6 ) * 100vw/ 750 ) calc( 80 * 100vw/ 750 ) calc( 11 * 100vw/ 750 ) calc( 80 * 100vw/ 750 )  calc( 25 * 100vw/ 750 ) auto;
		margin-top : calc( ( 19 - 4 ) * 100vw / 750 );
	}
	.logins p{
		font-size : 2.6rem;
		line-height : 1.46;
	}
	.logins p{
		grid-row : 1;
		grid-column : 1/3;
	}
	.logins input[type="email"]{
		grid-row : 3;
		grid-column : 1/3;
	}
	.logins input[type="password"]{
		grid-row : 5;
		grid-column : 1;
	}
	.logins input[type="submit"]{
		font-size : 2.6rem;
		grid-row : 5;
		grid-column : 2;
	}
	.logins a{
		font-size : 2.6rem;
		grid-row : 7;
		grid-column : 1/3;
	}
}

@media print,screen and (min-width: 751px){
	.logins{
		align-items : center;
		grid-template-columns : 300px 380px 280px 180px;
		column-gap : 20px;
		row-gap : calc( 17px - 4px );
		grid-template-rows : 40px auto;
		margin-top : calc( 19px - 4px );
	}
	.logins p{
		font-size : 1.6rem;
		line-height : 1.5;
	}
	.logins p{
		grid-column : 1;
		grid-row : 1;
	}
	.logins input[type="email"]{
		grid-column : 2;
		grid-row : 1;
	}
	.logins input[type="password"]{
		grid-column : 3;
		grid-row : 1;
	}
	.logins input[type="submit"]{
		grid-column : 4;
		grid-row : 1;
		font-size : 1.6rem;
	}
	.logins a{
		grid-column : 2;
		grid-row : 2;
		font-size : 1.6rem;
		margin-left : 13px;
	}
}

@media screen and (max-width: 750px){
	.user{
		margin-top : calc( 66 * 100vw / 750 );
	}
}

@media print,screen and (min-width: 751px){
	.user{
		margin-top : 102px;
	}
}

@media screen and (max-width: 750px){
	.conditions{
		margin-top : calc( 82 * 100vw / 750 );
	}
}

@media print,screen and (min-width: 751px){
	.conditions{
		margin-top : 48px;
	}
}

.datalist > div > dt label{
	background-color : #95a8b2;
	display : grid;
	color : #fff;
}

.datalist > div > dt label:not(.required){
	place-items : start;
}

.datalist > div > dt label.required:after{
	content : "必須";
	display : grid;
	place-items : center;
	background-color : #a40000;
}

.datalist .names{
	display : grid;
}

@media screen and (max-width: 750px){
	.datalist > div + div{
		margin-top : calc( 30 * 100vw / 750 );
	}
	.datalist > div > dt label{
		font-size : 2.6rem;
		line-height : 1.2;
	}
	.datalist > div > dt label{
		padding-left : calc( 14 * 100% / 690 );
		padding-right : calc( 10 * 100% / 690 );
		padding-top : calc( 10 * 100vw / 750 );
		padding-bottom : calc( 9 * 100vw / 750 );
		min-height : calc( 53 * 100vw / 750 );
	}
	.datalist > div > dt label.required{
		grid-template-columns : 1fr calc( 90 * 100% / 666 );
	}
	.datalist > div > dt label.required:after{
		height : calc( 34 * 100vw / 750 );
		font-size : 2rem;
	}
	.datalist > div > dd{
		margin-top : calc( 12 * 100vw / 750 );
	}
	.datalist .names-sp{
		display : grid;
	}
	.datalist .names , .datalist .names-sp{
		grid-template-columns : repeat(2,calc( 330 * 100% / 690 ));
		justify-content : space-between;
	}
	.datalist .inputs input + input{
		margin-top : calc( 10 * 100vw / 750 );
	}
	.datalist .up , .datalist .down{
		font-size : 2.6rem;
		line-height : 1.2;
	}
	.datalist .up{
		padding-top : calc( ( 10 - 2.6 ) * 100vw / 750 );
		padding-bottom : calc( 28.8 * 100vw / 750 );
	}
	.datalist .down{
		padding-top : calc( ( 6 - 2.6 ) * 100vw / 750 );
		padding-bottom : calc( 9.8 * 100vw / 750 );
	}
}

@media print,screen and (min-width: 751px){
	.datalist{
		display : grid;
		grid-template-columns : repeat(2 , 50%);
	}
	.datalist > div{
		display : grid;
		grid-template-columns : 180px 1fr;
		column-gap : 20px;
	}
	.datalist > div:not(:last-of-type){
		border-bottom : 1px solid #c9c9c9;
	}
	.datalist > div:not(:first-of-type){
		padding-top : 8px;
	}
	.datalist > div:not(:last-of-type){
		padding-bottom : 8px;
	}
	.datalist > div:not(.half-pc){
		grid-column : 1/3;
	}
	.datalist > div.half-pc{
		grid-template-columns : 180px 380px;
	}
	.datalist > div > dt label{
		padding-top : 17px;
		padding-bottom : 16px;
		padding-left : 10px;
		padding-right : 18px;
		font-size : 1.6rem;
		font-weight : 500;
		min-height : 20px;
		height : 100%;
	}
	.datalist > div > dt label.required{
		grid-template-columns : 1fr 35px;
	}
	.datalist > div > dt label.required:after{
		height : 20px;
		font-size : 1rem;
	}
	.datalist > div > dd{
		padding-top : 6.5px;
		padding-bottom : 6.5px;
	}
	.datalist .names{
		grid-template-columns : repeat(2,380px);
		column-gap : 20px;
	}
	.datalist .inputs input + input{
		margin-top : 10px;
	}
	.datalist .up , .datalist .down{
		font-size : 1.6rem;
		line-height : 1.5;
	}
	.datalist .up{
		padding-top : calc( 17px - 4px );
		padding-bottom : calc( 5px - 4px );
	}
	.datalist .down{
		padding-top : calc( 5px - 4px );
		padding-bottom : calc( 17px - 4px );
	}
}

@media screen and (max-width: 750px){
	.address > div + div{
		margin-top : calc( 10 * 100vw / 750 );
	}
	.address label , .address span{
		font-size : 2.6rem;
	}
}

@media print,screen and (min-width: 751px){
	.address > div + div{
		margin-top : 10px;
	}
	.address label , .address span{
		font-size : 1.6rem;
	}
}

.zip{
	display : grid;
	align-items : center;
}

.zip button{
	display : grid;
	place-items : center;
	background-color : var(--primary);
	color : #fff;
	height : 100%;
}

@media screen and (max-width: 750px){
	.zip{
		grid-template-columns : calc( 120 * 100% / 690 ) calc( 120 * 100% / 690 ) calc( 40 * 100% / 690 ) calc( 140 * 100% / 690 ) 1fr;
	}
	.zip span{
		text-align : center;
	}
	.zip button{
		font-size : 2.6rem;
		margin-left : calc( 20 * 100% / 270 );
	}
}

@media print,screen and (min-width: 751px){
	.zip{
		grid-template-columns : 100px 100px 30px 140px 140px;
	}
	.zip > span{
		padding-left : 11px;
	}
	.zip button{
		font-size : 1.6rem;
		margin-left : 10px;
	}
}

.prefectures{
	display : grid;
	align-items : center;
}

@media screen and (max-width: 750px){
	.prefectures{
		grid-template-columns : calc( 120 * 100% / 690 ) calc( 570 * 100% / 690 );
		row-gap : calc( 10 * 100vw / 750 );
	}
	.prefectures select{
		padding-right : calc( 30 * 100% / 570 );
	}
}

@media print,screen and (min-width: 751px){
	.prefectures{
		grid-template-columns : 100px 280px 120px 380px;
	}
	.prefectures select ~ label{
		padding-left : 19px;
	}
}

.address01 , .address02{
	display : grid;
	align-items : center;
}

@media screen and (max-width: 750px){
	.address01 , .address02{
		grid-template-columns : calc( 120 * 100% / 690 ) calc( 570 * 100% / 690 );
	}
}

@media print,screen and (min-width: 751px){
	.address01 , .address02{
		grid-template-columns : 100px 780px;
	}
}

@media print,screen and (min-width: 751px){
	.email input{
		width : 380px;
	}
}

@media screen and (max-width: 750px){
	.datalist01{
		margin-top : calc( 72 * 100vw / 750 );
	}
}

@media print,screen and (min-width: 1200px){
	.datalist01{
		margin-top : 30px;
	}
	.datalist01 > div:first-of-type{
		border-top : 1px solid #c9c9c9;
		padding-top : 8px;
	}
}

@media screen and (max-width: 750px){
	.datalist02{
		margin-top : calc( 32 * 100vw / 750 );
	}
}

@media print,screen and (min-width: 751px){
	.datalist02{
		margin-top : 20px;
	}
}

.submits input , .submits button{
	display : grid;
	place-items : center;
	color : #fff;
	font-weight : 700;
	margin-left : auto;
	margin-right : auto;
}

.submits input{
	background-color : #daac0a;
}

.submits button{
	background-color : #95a8b2;
}

@media screen and (max-width: 750px){
	.submits{
		margin-top : calc( 66 * 100vw / 750 );
	}
	.submits input , .submits button{
		width : calc( 400 * 100% / 690 );
		font-size : 2.8rem;
	}
	.submits * + *{
		margin-top : calc( 10 * 100vw / 750 );
	}
	.submits input{
		height : calc( 100 * 100vw / 750 );
	}
	.submits button{
		height : calc( 80 * 100vw / 750 );
	}
}

@media print,screen and (min-width: 751px){
	.submits{
		margin-top : 54px;
	}
	.submits input , .submits button{
		width : 335px;
		font-size : 2.4rem;
	}
	.submits * + *{
		margin-top : 10px;
	}
	.submits input{
		height : 100px;
	}
	.submits button{
		height : 60px;
	}
}