@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Hina+Mincho&display=swap');

/*================================================
 *  一般・共通設定
================================================*/

/******** 上部帯 ********/
.top_band{
   text-align: center;
   background-color: #0E214D;
   color: #F5F5F5;
}
/******** トップバナー ********/
#topbnr img {
   width: 100%;
   max-height: 300px;
   object-fit: cover;
}

h2{
   font-weight: 600;
   font-size: 22px;
   text-align: center;
   font-family: "Hina Mincho", serif;
   margin: 2em 0 1em 0;
   border-bottom: #181818 dotted 3px;
}

#mail_form{ margin: 2em auto; line-height: 1.2em;}

/** 任意 **/
.optional{
   background-color:#20948B;
   color:#F5F5F5;
   padding: 0.1em 0.5em;
   border-radius: 5px;
   font-size: 12px;
}

/** 必須 **/
.required{
   background-color:#DE7A22;
   color:#F5F5F5;
   padding: 0.1em 0.5em;
   border-radius: 5px;
   font-size: 12px;
}
/** 英語タイトル **/
.eng{
   color:#887B6B;
   padding-left: 0.5em;
   font-size: 12px;
}
#mail_form dt{
   padding-right: 1em;
   font-size: 14px;
   margin: 0.8em 0;
}
#mail_form dd{ margin: 1em 0; }
#mail_form dd input[type="text"], input[type="email"], input[type="reemail"], input[type="tel"] {
   height: 2.4em;
   width: 100%;
   padding: 0 16px;
   border-radius: 4px;
   border: none;
   box-shadow: 0 0 0 2px #6AB187 inset;
   appearance: none;
   -moz-appearance: none;
   background-color: #FFFFF2;
}
#mail_form dd > input:focus {
   outline: 0;
   box-shadow: 0 0 0 2px #F4CC70 inset;
}
#mail_form input[type="radio"] {
   appearance:auto;
	width: 1.2em;
	height: 1.2em;
   margin-right: 0.5em;
   border-radius: 5px;
   accent-color: #0E214D;
}
#mail_form label{
   margin-right: 1em;
}
#mail_form textarea{
   height: 5em;
   width: 100%;
   padding: 0.5em;
   border-radius: 4px;
   border: none;
   box-shadow: 0 0 0 2px #6AB187 inset;
   appearance: none;
   -webkit-appearance: none;
   -moz-appearance: none;
   background-color: #FFFFF2;
   font-weight: 500;
   line-height: 1.3em;
   background-color: #FFFFF2;
}
#mail_form textarea:focus {
   outline: 0;
   box-shadow: 0 0 0 2px #F4CC70 inset;
}

#mail_form input[type="submit"], input[type="reset"]{
   padding: 0.5em 1em;
   letter-spacing: 0.2rem;
   font-size: 16px;
}
.btn_area{ text-align:right; }
.btn_area input[type="submit"], input[type="reset"]{
	display:inline-block;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	width: 120px;
	margin: auto;
	font-weight: bold;
	border: 2px solid #F4CC70;
	color: #F5F5F5;
	transition: 0.5s;
   background-color: #0E214D;
}
.btn_area input[type="submit"]:hover, input[type="reset"]:hover{
	color: #fff;
	background: #DE7A22; 
}
.btn_area p{
   font-size: 14px;
   margin: 1em 0;
}

/*================================================
 *  タブレット向けデザイン
================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */
@media screen and (max-width:979px) {

}


/*================================================
 *  スマートフォン向けデザイン
================================================*/
@media screen and (max-width:767px) {

   #mail_form{ padding: 0 1em; }
   #mail_form dt{ margin: 0; }
   #mail_form dd{ margin: 0.2em 0 1.5em 0; }

   .btn_area p{ font-size: 13px; margin-top: 2em; }

}