@charset "utf-8";

@media screen and (max-width: 767px) {}
@media screen and (min-width: 768px) {}
@media screen and (min-width: 768px) and (max-width: 1023px) {}
/*-------------------------------------------------
レイアウト
-------------------------------------------------*/
body{
	text-align:left;
	font-size: 100%;
	line-height:1.5;
	letter-spacing:0.02em;
	color:#040000;
	background:#ffffff;
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic",'ヒラギノ角ゴ ProN W3','メイリオ', 'Meiryo', sans-serif;
	font-variant: normal;
	padding-bottom:0px;
	overflow-x: hidden;
	-webkit-text-size-adjust: 100%;
	}
#wrap{ width: 100%; height: 100%; position: relative;}
.inner{ margin-right:auto; margin-left:auto;}
.inner:before{content:" ";display:table;}
.inner:after{ clear:both;}

/*ブラウザサイズ別指定*/
@media screen and (max-width: 767px) {
#wrap{}
.inner{ margin-right:20px; margin-left:20px;}
}
@media screen and (min-width: 768px) , print{
.inner{ max-width:1240px;}
.container{ margin-right:20px; margin-left:20px;}
}

/*-----------------------------------------------------
header
-----------------------------------------------------*/
#header_frame{}
.second_header_frame{ background: rgba(255,255,255,1.0);}

.header_title{ float: left;}

input[type=text].h_search{ border: none; border-bottom: 1px solid #000; background: rgba(255,255,255,0.5);}
input[type=text].h_search:focus{ background: #fff;}
input[type=submit].btn_submit{ background: url(../images/common/icon_search_01.png) no-repeat; background-position: 4px 4px; background-size: 13px 13px; border:none; width:21px; height:21px; vertical-align:middle;}

/*ブラウザサイズ別指定*/
@media screen and (max-width: 767px) {
	#header_frame{ position: fixed; left: 0; top: 0; z-index: 100; width: 100%; padding-bottom: 38px;}
	#header_frame.is-animation{ height: 60px; background: rgba(255,255,255,0.9);-webkit-transition: all 0.3s ease;transition: all 0.3s ease;}
	.second_header_frame{ height: 70px;}
	
	.header_title{ padding-top: 12px; padding-left: 20px;}
	.header_title img{ width: 220px;}
	.header_title.is-animation img{ width: 165px;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;}
	
	.header_search{}
	.header_search .h_search{ width: 80%;}
}
@media screen and (min-width: 768px), print{
	#header_frame{ position: absolute; left: 0; top: 0; z-index: 100; width: 100%; padding-bottom: 38px;}
	.second_header_frame{ height: 100px;}
	
	.header_title{ padding-top: 20px; padding-left: 40px;}
	.header_title img{ width: 220px;}
	
	.box_header_right{ display: -webkit-flex;display: flex; -webkit-justify-content:flex-end;justify-content: flex-end;}
	
	.header_search{ padding-top: 30px; border-left: 1px solid #000; margin-right: 40px;}
	.header_search .h_search{ width: 0; opacity: 0; filter: alpha(opacity=0); -moz-opacity: 0}
	.header_search.show .h_search{ width: 120px; margin-left: 20px; opacity: 1.0; filter: alpha(opacity=100); -moz-opacity: 1.0}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
	.second_header_frame{ height: 80px;}
	
	.header_title{ padding-left: 20px;}
	.header_title img{ width: 165px;}
	
	.header_search{ margin-right: 20px;}
	.header_search .h_search{ width: 50px; margin-left: 20px; opacity: 1.0; filter: alpha(opacity=100); -moz-opacity: 1.0}
	.header_search.show .h_search{ width: 60px}
}


/*-----------------------------------------------------
menu
-----------------------------------------------------*/
/*ブラウザサイズ別指定*/
@media screen and (max-width: 767px) {
	/*ハンバーガー*/
	#menu-icon{ position: fixed; right: 20px; top:20px; z-index: 9999;}
	#menu-icon span{ background: #0072ba; width: 40px; height: 2px; margin-bottom:6px; display:block;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;}

	#menu-icon{ display:inline; cursor:pointer; font-size: 0.6rem; text-align: center; line-height: 1; font-weight: bold; color: #0072ba;}
	#menu-icon.active .first{transform:rotate(45deg);-webkit-transform:rotate(45deg);margin-top:10px;}
	#menu-icon.active .second{transform:rotate(135deg);-webkit-transform:rotate(135deg);position:relative;top:-8px;}
	#menu-icon.active .third{display:none;}
	
	/* menu */
	#menu{ position: fixed; top: 0px; right: 0; z-index: 9000; width:280px; height: 100%; padding-bottom: 100px; overflow-y: scroll; background-color:#fff; transform: translateX(100%); -webkit-transition: all 0.6s ease;transition: all  0.6s ease; border-left: 1px solid #d4e1e6; overflow-x: hidden;}
	#menu.open { transform: translateX(0);}
	.overlay { content: ""; display: block; width: 0; height: 0; background-color: rgba(0, 0, 0, 0.6); position: fixed; top: 0; left: 0; z-index: 4000; opacity: 0; transition: opacity 0.6s;}
	.overlay.open { width: 100vw; height: 100vh; opacity: 1;}

	#menu .header_search{ position: absolute; top: 0; padding: 20px;}
	
	ul.header_menu{ margin-top: 70px; border-top: 1px solid #d4e1e6;}
	ul.header_menu > li{ position: relative; width: 280px; border-bottom: 1px solid #d4e1e6;}
	ul.header_menu > li a{ display: block; width: calc(100% - 51px); padding: 15px 20px; color: #0072ba;}
	.btn_open{ position: absolute; top: 0; right: 0; display: block; content: " "; width: 51px; height: 54px; background: url(../images/common/arrow_b_bl.png) center center no-repeat; background-color: #fff; background-size: 15px 9px; border-left:1px solid #d4e1e6;}
	.btn_open.close{ background: url(../images/common/arrow_t_wh.png) center center no-repeat; background-color: #0072ba;}
	
	.mega_menu{ display: none;}	
	.mega_menu h2{ display: none;}
	.mega_menu ul{ border: none;}
	.mega_menu ul li{ clear: both; border-top: 1px solid #62aede;}
	.mega_menu ul li a{ display: block; width: 100%; padding: 0; background: #0072ba; color: #fff;}
	.mega_menu ul li dl{ height: 56px;}
	.mega_menu ul li dl dt{ width: 30%; height: 56px; float: left;}
	.mega_menu ul li dl dd{ font-size: 0.8em; padding: 21px 20px 21px 35%;}
	
}
@media screen and (min-width: 768px), print{
	/*ハンバーガー*/
	#menu-icon{ display: none;}
	
	/* menu */
	ul.header_menu{ padding-top: 35px; margin-right: 5px; display: -webkit-flex;display: flex; -webkit-justify-content:flex-end;justify-content: flex-end;}
	ul.header_menu > li{ display: block; font-size: 0.9rem; margin: 0 15px;}
	ul.header_menu > li span a{ padding: 35px 0 10px;}
	ul.header_menu > li.active > span{ border-bottom: 1px solid #000;}
	ul.header_menu > li .mega_menu{ transform: translateY(-100%); transition: all 0.5s ease;  opacity: 0; filter: alpha(opacity=0); -moz-opacity: 0}
	ul.header_menu > li.active .mega_menu{ transform: translateY(0); opacity: 1; filter: alpha(opacity=100); -moz-opacity: 1}
	
	.mega_menu{ position: fixed; left: 0; top: 0; z-index: -1; width: 100%; height: auto; background: #fff; padding-top: 56px; border-bottom: 1px solid #e7eceb;}
	.mega_menu .mega_inner{ padding-top: 44px;}
	.mega_menu h2{ float: left; width: 16%; min-width: 150px; text-align: center; font-size: 1.5rem;}
	.mega_menu h2 span{ font-size: 0.7rem;}
	.mega_menu h2 a{ display: block; color: #0072ba; padding-top: 80px;}
	.mega_menu h2 a:hover{ background: #0072ba; color: #fff;}
	.mega_menu h2.rows_1 a{ padding-top: 10px; padding-bottom: 39px;}
	.mega_menu h2.rows_2 a{ padding-bottom: 89px;}
	.mega_menu h2.rows_3 a{ padding-bottom: 210px;}
	.mega_menu h2.rows_4 a{ padding-bottom: 331px;}
	.mega_menu .box_menu_01{ float: right; width: 84%; border-left: 1px solid #e7eceb;}
	.mega_menu ul{ overflow: hidden;}
	.mega_menu ul li{ float: left; width: 33.33%;}
	.mega_menu ul li a{ display: block; height: 120px; background: #fff; color: #0072ba;}
	.mega_menu ul li a:hover{ background: #0072ba; color: #fff;}
	.mega_menu ul li a:hover img{ opacity: 1; filter: alpha(opacity=100); -moz-opacity: 1}
	.mega_menu ul li dl{ display: table;}
	.mega_menu ul li dl dt{ float: left; max-width: 180px; height: 120px; display: table-cell;}
	.mega_menu ul li dl dt img{ width: 100%; height: 100%; object-fit: cover; font-family: 'object-fit: cover;';}
	.mega_menu ul li dl dd{ width: 60%; padding: 0 16px; display: table-cell; vertical-align: middle;}
	
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
	ul.header_menu > li{ font-size: 1.6vw; margin: 0 10px;}
	
	.mega_menu{ display: none;}
}

/*-------------------------------------------------
共通指定
-------------------------------------------------*/
/* TITLE */
h2.contact_title_01{ text-align: center;}
h2.contact_title_01 .title_text_01{ font-size: 0.9rem; color:#0083d6;}
h2.contact_title_01 .title_text_02{ font-size: 1.8rem;}

/*ブラウザサイズ別指定*/
@media screen and (max-width: 767px) {
	/* TITLE */
	h2.contact_title_01{ margin-bottom: 40px;}
}
@media screen and (min-width: 768px), print {
	/* TITLE */
	h2.contact_title_01{ margin-bottom: 60px;}
}

/*-----------------------------------------------------
footer
-----------------------------------------------------*/
/* CONTACT */
.btn_contact_01{ text-align: center;}
.btn_contact_01 a{ display: inline-block; font-size: 1.1rem; font-weight: bold; text-align: center; background-image: url(../images/common/arrow_r_wh.png); background-size: 9px 15px; background-position: 96% center; background-repeat: no-repeat; background-color: #0083d6; color: #fff;}
.btn_contact_01 a:hover{ background-color: #35b1ff;}

#footer_frame{ clear: both; width: 100%; overflow: hidden;}

/* footer_menu */
.footer_menu_frame_01{ overflow: hidden;}
.footer_menu_x1 a:hover{ text-decoration: underline;}
.footer_menu_x1 p{ font-weight: bold; background: url(../images/common/arrow_r_bk.png) left 0.5em no-repeat; background-size: 5px 8px; padding-left: 10px; margin-bottom: 16px;}
.footer_menu_x1 ul{ font-size: 0.8rem; margin-left: 10px;}
.footer_menu_x1 ul li{ margin-bottom: 0.5em;}

ul.list_footer_01{ clear: both; text-align: center; margin-bottom: 16px;}
ul.list_footer_01 li{ display: inline-block; font-size: 0.8rem; border-left: 1px solid #d4e1e6; line-height: 1;}
ul.list_footer_01 li:first-child{ border: none;}
ul.list_footer_01 li a{ padding: 0 16px;}
ul.list_footer_01 li a:hover{ text-decoration: underline;}

/* footer_info */
ul.list_footer_02{ display: -webkit-flex;display: flex; -webkit-justify-content:center;justify-content: center;}
ul.list_footer_02 li{ float: left; font-size: 0.7rem; line-height: 1.2; margin: 0 5px; text-align: center;}
ul.list_footer_02 li a{ display: block; color: #010101;}
ul.list_footer_02 li img{ width: auto; border: 1px solid #d4e1e6; margin-bottom: 10px;}

.footer_info_frame_01{ border-top: 1px solid #d4e1e6;}
.footer_info_frame_01 h2{ width: 220px;}
.footer_info_frame_01 p{ color: #2b2412; font-size: 0.7rem;}

#copy{ font-size: 0.6rem;}

/*ブラウザサイズ別指定*/
@media screen and (max-width: 767px) {
	/* CONTACT */
	.home_contact_frame{ padding: 100px 0;}
	.btn_contact_01 a{ padding: 20px; width: 90%; font-size: 5vw}

	/* footer_menu */
	.footer_menu_frame_01 .footer_menu_x1{ display: none;}
	
	ul.list_footer_01 li{ font-size: 0.9em;}
	ul.list_footer_01 li a{ padding: 0 8px;}
	
	/* footer_info */
	ul.list_footer_02{ padding-top: 20px; margin-bottom: 40px;}
	ul.list_footer_02 li{ width: 40%;}
	ul.list_footer_02 li:nth-child(3n){ width: 20%;}
	ul.list_footer_02 li:nth-child(3n) img{ margin-bottom: 0;}
	ul.list_footer_02 li img{ width: 100%;}
	
	.footer_info_frame_01{ padding-bottom: 20px;}
	.footer_info_frame_01 h2{ margin: 0 auto 20px;}
	.footer_info_frame_01 p{ margin-bottom: 20px;}
}
@media screen and (min-width: 768px), print{	
	/* CONTACT */
	.home_contact_frame{ padding: 100px 0;}
	.btn_contact_01 a{ padding: 30px; width: 100%; max-width: 560px;}

	#footer_frame{ padding-top: 60px;}
	
	/* footer_menu */
	.footer_menu_frame_01{ margin: 0 20px;}
	.footer_menu_x1{ float: left; width: 20%;}
	
	ul.list_footer_01{ padding-top: 80px;}
	
	/* footer_info */
	ul.list_footer_02{ margin-bottom: 60px;}
	ul.list_footer_02 li:nth-child(3n) img{ border: none; margin-bottom: 0;}
	
	.footer_info_frame_01{ padding-top: 40px; padding-bottom: 20px;}
	.footer_info_frame_01 h2{ float: left; margin-left: 20px;}
	.footer_info_frame_01 p{ padding-left: 300px; margin-right: 20px; margin-bottom: 50px;}
	
	#copy{ text-align: right;}
}


/* page-top */
#page-top {
	position: fixed;
/*	font-size: 60%;*/
	margin-bottom:0px;
	line-height: 1.2;
	z-index:700;
}
#page-top a {
	text-decoration: none;
	color: #fff;
	text-align: center;
	font-weight: bold;
	display: block;
	background:#0083d6;
	border-radius:50%;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all  0.3s ease;
}
#page-top a img{
	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity: 100;
}

#page-top a:hover {
	text-decoration: none;
	opacity: 0.5;
	filter: alpha(opacity=50);
	-moz-opacity: 50;
}

/*ブラウザ別サイズ指定*/
@media screen and (max-width: 767px) {
	#page-top { bottom: 20px; right: 10px;}
	#page-top a { width: 45px; height: 45px; padding: 18px 15px;}
	#page-top a img{ width:15px; height: 9px;}
	
	.interview_top{ bottom: 64px!important;}
}
@media screen and (min-width: 768px), print {
	#page-top {	bottom: 20px; right: 20px;}
	#page-top a { width: 45px; height: 45px; padding: 18px 15px;}
	#page-top a img{ width:15px; height: 9px;}
}

