@charset "UTF-8";

.inner-container {
	padding: 67px 0 253px;
}
.heading-line {
	font-size: 28px;
	position: relative;
	padding-bottom: 1.3em;
	color: #221814;
	letter-spacing: 0.1em;
	margin-bottom: 74px;
}
.heading-line::after {
	content: "";
	display: block;
	height: 12.05px;
	width: 2.5em;
	background-color: #004da8;
	position: absolute;
	bottom: 0;
	left: 0;
}
.txt-base {
	font-size: 16px;
	line-height: 1.75;
	letter-spacing: 0.084em;
}
.block:first-of-type {
	margin-top: 70px;
}
.block + .block {
	margin-top: 64px;
}
h4 {
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 15px;
}
ul.menulist li {
	padding: 0 0 1em 3em;
	position: relative;
}
ul.menulist li span {
	display: inline-block;
	background: #999;
	height: 3px;
	left: 0;
	position: absolute;
	top: 1em;
	width: 2em;
}
#contactform .l-content {
	background-color: #f1f1f1;
	margin-bottom: 0;
	margin-top: 60px;
	max-width: 1280px;
	padding: 60px 5vw;
	width: 100%;
}
#contactform .l-content .form {
    margin: 50px auto;
    max-width: 900px;
}
#contactform .l-content .form > div {
	margin-bottom: 1em;
	display: flex;
    align-items: flex-start;
	justify-content: space-between;
    gap:10px 20px;
}
#contactform .l-content .form dt {
	font-weight: 600;
	width: 15em;
    display:flex;
    align-items: center;
    justify-content: flex-start;
    gap:2em;
}
#contactform .l-content .form dt label {
    order:2;
}
#contactform .l-content .form dt span {
	color: #fff;
	font-size: 90%;
	padding: 0.5em 0.6em;
	text-align: center;
    order:1;
    line-height:1;
}
#contactform .l-content .form dt span.must {
	background: #004ea2;
}
#contactform .l-content .form dt span.optional {
	background: #999;
}

#contactform .l-content .form dt:has(> [for="privacy"]) {
    visibility: hidden;
}

#contactform .l-content .form dd {
	margin-bottom: 2em;
	flex:1;
}
#contactform .l-content .form dd :is([type="text"], [type="email"], textarea) {
	background: #fff !important;
	border: 1px solid #ccc !important;
	line-height: 1.5em;
	min-height: 4em;
	padding: 1em !important;
    width:100%;
}
#contactform .l-content .form dd label {
    margin-right:1em;
}

#contactform .l-content .form dd[data-form-name="privacy"] > p {
    margin-bottom:20px;
}
#contactform .l-content .form dd[data-form-name="privacy"] > p a {
    text-decoration: underline;
    text-underline-offset: 4px;
}
#contactform .l-content .form dd em {
    display:block;
    color:#e33;
    font-weight:bold;
    font-style:normal;
}

#contactform .l-content.confirm .form dd p {
    display:none;
}

#contactform dd:has(> .button) button {
	background-color: #004ea2;
	background-image: url("/assets/common/images/icon-circle-arrow-fill-white.svg");
	background-position: right 20px center;
	background-repeat: no-repeat;
	background-size: 1.5em;
	border: none;
	color: #fff;
	font-weight: 600;
	padding: 1em 1.5em;
	text-align: left;
	width: 18em;
}
#contactform dd:has(> .button) button:hover {
	background-position: right 10px center;
	transition-property: marin-left;
}


#contactform .buttons {
    display:flex;
    align-items: center;
    justify-content: center;
    gap:20px;
}
#contactform .buttons dl {
    margin:0;
}
#contactform .buttons dl dt {
    display:none !important;
}
#contactform .buttons button {
	border: none;
	color: #fff;
	padding: 1em !important;
	text-align: center !important;
	width: 9em !important;
}
#contactform .buttons button:hover {
	opacity: 0.8;
}
#contactform .buttons .Back.button {
	background: #000;
}
#contactform .buttons .Send.button {
	background: #004ea2;
}

@media screen and (min-width: 1200px) {
	#contactform .l-content {
		margin: 70px auto 0;
		max-width: 1280px;
	}
	#contactform .form {
		margin: 50px auto;
		max-width: 900px;
	}
	#contactform dd:has(> .button) {
		margin: auto;
		max-width: 900px;
	}
}

@media screen and (max-width: 1198.98px) {
	.inner-container {
		padding: 5.583vw 0 21.083vw;
	}
	.heading-line {
		font-size: 2.333vw;
		margin-bottom: 6.167vw;
	}
	.heading-line::after {
		height: 1.004vw;
	}
	.txt-base {
		font-size: 1.333vw;
	}
	.block:first-of-type {
		margin-top: 5.833vw;
	}
	.block + .block {
		margin-top: 5.333vw;
	}
	h4 {
		font-size: 1.5vw;
		margin-bottom: 1.25vw;
	}
}

@media screen and (max-width: 999px) {
	#contactform .form > div {
		flex-direction: column;
	}
    #contactform .l-content {
        padding:60px 5vw 80px;
    }
    #contactform .l-content .txt-base {
        padding-bottom:40px;
    }
    #contactform .l-content .form {
        margin:0 auto;
    }
	#contactform .l-content .form dt {
		font-size: 13px !important;
		width: calc(100% - 10px);
	}
	#contactform .l-content .form dd {
		font-size: 13px !important;
		line-height: 1.3;
		width: calc(100% - 10px);
	}
	#contactform .l-content .form dd label {
		display: inline-block;
		font-size: 13px;
		margin-bottom: 5px;
	}

	#contactform dd:has(> .button) {
		margin: auto !important;
		max-width: 260px;
		padding-left: 0;
	}
}

@media screen and (max-width: 799px) {
	ul.menulist li {
		font-size: 80%;
	}
	#contact p.txt-base {
		font-size: 10px;
	}
}

@media screen and (max-width: 599.98px) {
	.inner-container {
		padding: 12vw 0 29vw;
	}
	.heading-line {
		font-size: 4.45vw;
		margin-bottom: 10.5vw;
	}
	.heading-line::after {
		height: 1.5vw;
	}
	.txt-base {
		font-size: 3vw;
	}
	.block:first-of-type {
		margin-top: 12vw;
	}
	.block + .block {
		margin-top: 11.25vw;
	}
	h4 {
		font-size: 3.35vw;
		margin-bottom: 2vw;
	}
	#contactform .l-content .form dt {
		font-size: 10px;
	}
    #contactform .buttons > div {
        flex:1;
    }
    #contactform .buttons button {
        width: 100% !important;
    }
}