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

/*-----------------------------------------------
#005ABE
-----------------------------------------------*/

/* title */
#title {
padding: 80px 4% 30px 4%;
}
#title .text {
max-width: 35em;
margin: auto;
}
#title h1 {
font-family: "Shippori Mincho B1", serif;
font-size: 3.5vw;
font-weight: 400;
line-height: 1.25;
text-align: center;
letter-spacing: 0.1em;
}
#title .en {
margin-top: 0.5em;
padding-top: 0.5em;
font-family: "Shippori Mincho B1", serif;
font-size: 2vw;
text-align: center;
border-top: 1px solid #000;
}
@media screen and (max-width: 799px) {
	#title {
	padding: 10% 4% 4% 4%;
	}
	#title h1 {
	font-size: 6vw;
	}
	#title .en {
	font-size: 1.5vw;
	}
}

/* tel */
#tel {
padding: 40px 4%;
}
#tel .inner {
max-width: 1000px;
margin: auto;
}
#tel .tel {
margin-top: 2%;
text-align: center;
}
#tel .tel dt {
font-size: 1.25em;
}
#tel .tel a {
color: #005ABE;
}
#tel .tel strong {
font-size: 2em;
font-weight: 400;
}
@media screen and (max-width: 799px) {
	#tel {
	padding: 8% 4%;
	}
	#tel .tel dt {
	font-size: 1em;
	}
}

/* form */
#form {
padding: 50px 4%;
color: #FFF;
background: #005ABE;
}
#form .inner {
max-width: 1000px;
margin: auto;
}
#form .text {
margin-top: 4%;
text-align: center;
}
#form table {
width: 80%;
margin: auto;
margin-top: 4%;
}
#form tr {
border-top: 1px dotted #FFF;
border-bottom: 1px dotted #FFF;
}
#form th {
width: 16em;
padding: 1em 0;
font-weight: 400;
color: #FFF;
vertical-align: middle;
}
#form td {
padding: 1em 0 1em 1em;
font-weight: 500;
color: #FFF;
}
#form th span {
display: block;
float: right;
padding: 0.25em 0.65em;
font-size: 0.75em;
font-weight: 400;
color: #000;
background: #FFED55;
border-radius: 2em;
}
#form .error {
display: block;
margin-top: 0.5em;
font-weight: 500;
color: #FFED55;
}
#form .zip {
width: 100%;
max-width: 10em;
}
#form .name,
#form .kana,
#form .tel {
width: 100%;
max-width: 25em;
}
#form .mail,
#form .address,
#form .message {
width: 100%;
}
#form .address {
margin-top: 0.5em;
}
#form .message {
height: 15em;
}
#form .subject,
#form .reply {
display: flex;
}
#form .subject li:not(:first-child),
#form .reply li:not(:first-child) {
margin-left: 1em;
}
@media screen and (max-width: 799px) {
	#form {
	padding: 8% 4%;
	}
	#form table {
	width: 100%;
	}
	#form th {
	display: block;
	width: 100%;
	padding: 4% 0 2% 0;
	}
	#form td {
	display: block;
	width: 100%;
	padding: 0 0 4% 0;
	}
}


/* confirm */
#confirm {
padding: 50px 4%;
color: #FFF;
background: #005ABE;
}
#confirm .inner {
max-width: 1000px;
margin: auto;
}
#confirm .text {
margin-top: 4%;
text-align: center;
}
#confirm table {
width: 80%;
margin: auto;
margin-top: 4%;
}
#confirm tr {
border-top: 1px dotted #FFF;
border-bottom: 1px dotted #FFF;
}
#confirm th {
width: 12em;
padding: 1em 0;
font-weight: 500;
color: #FFF;
vertical-align: middle;
}
#confirm td {
padding: 1em 0 1em 1em;
font-weight: 400;
color: #FFF;
}
@media screen and (max-width: 799px) {
	#confirm {
	padding: 8% 4%;
	}
	#confirm table {
	width: 100%;
	}
	#confirm th {
	display: block;
	width: 100%;
	padding: 4% 0 2% 0;
	}
	#confirm td {
	display: block;
	width: 100%;
	padding: 0 0 4% 0;
	}
}
