@charset "utf-8";
/* ヘッダー */
.top-img_container { min-width: 1200px; width: 100%; height: 400px; background: url("../img/top_img.jpg") no-repeat top center;}
.shiro_back { width: 100%; background-color: #fff; position: sticky; top: 0; z-index: 1; }
.top-menu_container { width: 1200px; height: 70px; padding: 0 20px; margin: 20px auto; display: flex; align-items: center; }
.logo {}
.label-kanja { width: 180px; height: 30px; line-height: 30px; font-size: 14px; text-align: center; color: #fff; background: #022fa0; border-radius: 15px; margin: 0 0 0 15px;}
.main_menu { margin: 0 0 0 auto;}
.main_menu ul { display: flex; gap: 30px; text-align: center;}
.main_menu li a { position: relative; display: inline-block; margin-bottom: 1em; text-decoration: none; color: #333; font-weight: bold;}
.main_menu li a:before { content: ''; position: absolute; left: 50%; bottom: 24px;/*線の上下位置*/ display: inline-block; width: 20px;/*線の長さ*/ height: 1px;/*線の太さ*/ -webkit-transform: translateX(-50%); transform: translateX(-50%);/*位置調整*/ background-color: #001A8C;/*線の色*/ transition: width 0.3s }
.main_menu li a:hover:before { width: 100%;}
.main_menu li span { display: inline-block; font-size: 12px; font-family: 'Oswald', sans-serif; font-weight: 400; color: #022fa0; margin: 12px 0 0 0;}
/* 順番 */
.top-img_container { order: 2;}
.top-menu_container { order: 1; }
.main_contents { order: 3; }
footer { order: 4; }
/* アクセス */
.access_area { width: 100%;}
.access_text { width: 100%; text-align: center;}
.access_img  { text-align: center; margin: 30px 0 0 0;}
.access_img img { border: solid 2px #001a8c; border-radius: 15px; }
/* contact */
.contact_area { max-width: 920px; width: 100%; margin: 0 auto; padding: 40px 8%; border: solid 9px #f2f6fa; border-radius: 15px; text-align: center;}
.contact_name { font-size: 24px; line-height: 1.4em; font-weight: 500;}
.contact_name span { margin: 0 10px; }
.contact_line { line-height: 0; margin: 20px 0;}
.contact_tel_area { display: flex; flex-wrap: wrap; justify-content:space-between; align-items: flex-start; max-width: 680px; width: 100%; margin: 0 auto; }
.contact_tel { max-width: 292px; width: 100%;}
.contact_tel img { width: 100%; height: auto; }
.contact_fax { max-width: 307px; width: 100%; margin-top: 6px;}
.contact_mail { font-size: 30px; color: #001a8c; font-weight: bold;}
.contact_mail img { margin-right: 10px; }
.contact_mail span { font-size: 19px; color: #222; font-weight: normal; margin-left: 10px; display: inline-block; }
.contact_mail_text { font-size: 26px; color: #001a8c; font-weight: bold; line-height: 1em; margin-top: 10px;}


@media screen and (max-width: 520px) {
	/* ヘッダー */
	.top-img_container { min-width: 0; width: 100%; height: 350px; background: url("../img/top_img_m.jpg") no-repeat top left;}
	.top-menu_container {width: 100%; height: 50px; padding: 0; margin: 0; aspect-ratio: 32 / 5; }
	.logo { width: auto; height: 50px; padding: 0;}
	.logo img { width: auto; height: 50px; padding: 8px 6px 8px 6px; }
	.label-kanja { width: fit-content; height: fit-content; line-height: 20px; font-size: 8px; margin: 0; padding: 0 8px;}
	nav { display: none;}

	/* アクセス */
	.access_area { width: 100%; text-align: center;}
	.access_text { font-size: 14px; }
	.access_img  { max-width: 450px; margin: 30px auto 0 auto;}
	.access_img img { width: 100%; height: auto; }
	/* contact */
	.contact_area { }
	.contact_name { font-size: 18px; line-height: 1.4em; font-weight: 500;}
	.contact_name span { margin: 0 10px; display: block;}
	.contact_line { line-height: 0; margin: 20px 0;}
	.contact_tel_area { justify-content: center; margin: 0; }
	.contact_tel { margin-bottom: 20px; }
	.contact_tel img { width: 100%; height: auto; }
	.contact_fax { }
	.contact_fax img { width: 100%; height: auto; }
	.contact_mail { font-size: 19px; color: #001a8c; font-weight: bold; line-height: 1em;}
	.contact_mail img { max-width: 32px; width: 100%; height: auto; margin-bottom: 3px; margin-right: 0;  }
	.contact_mail span { font-size: 12px; color: #222; font-weight: normal; margin-left: 10px; display: inline-block; }
	.contact_mail_text { font-size: 12px; color: #001a8c; font-weight: bold; margin-top: 5px;}
	
}