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

/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
body{line-height:1;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
nav ul{list-style:none;}
a{margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}
table,td{border-collapse:collapse; border-spacing:0;}
/* change border colour to suit your needs */
hr {display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}
input, select {vertical-align:middle;}
*,
*::before,
*::after{box-sizing: border-box;}

html{-webkit-overflow-scrolling: touch; overflow: auto; height: 100%; font-size: 62.5%; /* 16px * 62.5% = 10px */ scroll-behavior: smooth;}
body{
    font-size:1.6rem; line-height: 1.5;
    font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
    overflow-x: hidden; -webkit-text-size-adjust: 100%; color:#333; margin: 0;
}

@media screen and (max-width: 767px){.pc{display:none!important;}}
@media screen and (min-width: 768px){.sp{display:none!important;}}
@media print{.sp{display:none!important;}　.print{display:none!important;}}

.clearfix:after {content: "."; display: block; clear: both; height: 0; visibility: hidden;}
.clearfix {display: inline-block;}
/* WinIE6 below, Exclude MacIE5 \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}

@media screen and (min-width: 768px){
	.hover{opacity:1.0; filter:alpha(opacity=100); /* For IE8 and earlier */}
	.hover:hover{opacity:0.6; filter:alpha(opacity=60); /* For IE8 and earlier */}}

/*float*/
.fL{float:left;}.fR{float:right;}
@media screen and (max-width: 767px){
	.fL_PC,.fR_PC{float:none !important;}.fL_SP{float:left!important;}.fR_SP{float:right!important;}
}
@media screen and (min-width: 768px){
	.fL_PC{float:left!important;}.fR_PC{float:right!important;}
}

/*margin・padding*/
.mt10{margin-top:10px !important;}.mt15{margin-top:15px !important;}.mt20{margin-top:20px !important;}.mt30{margin-top:30px !important;}.mt40{margin-top:40px !important;}.mt50{margin-top:50px !important;}
.mr10{margin-right:10px !important;}.mr15{margin-right:15px !important;}.mr20{margin-right:20px !important;}.mr30{margin-right:30px !important;}.mr40{margin-right:40px !important;}.mr50{margin-right:50px !important;}
.mb10{margin-bottom:10px !important;}.mb15{margin-bottom:15px !important;}.mb20{margin-bottom:20px !important;}.mb30{margin-bottom:30px !important;}.mb40{margin-bottom:40px !important;}.mb50{margin-bottom:50px !important;}
.ml10{margin-left:10px !important;}.ml15{margin-left:15px !important;}.ml20{margin-left:20px !important;}.ml30{margin-left:30px !important;}.ml40{margin-left:40px !important;}.ml50{margin-left:50px !important;}
.m_auto{margin:0 auto;}
.pt10{padding-top:10px !important;}.pt15{padding-top:15px !important;}.pt20{padding-top:20px !important;}.pt30{padding-top:30px !important;}.pt40{padding-top:40px !important;}.pt50{padding-top:50px !important;}
.pr10{padding-right:10px !important;}.pr15{padding-right:15px !important;}.pr20{padding-right:20px !important;}.pr30{padding-right:30px !important;}.pr40{padding-right:40px !important;}.pr50{padding-right:50px !important;}
.pb10{padding-bottom:10px !important;}.pb15{padding-bottom:15px !important;}.pb20{padding-bottom:20px !important;}.pb30{padding-bottom:30px !important;}.pb40{padding-bottom:40px !important;}.pb50{padding-bottom:50px !important;}
.pl10{padding-left:10px !important;}.pl15{padding-left:15px !important;}.pl20{padding-left:20px !important;}.pl30{padding-left:30px !important;}.pl40{padding-left:40px !important;}.pl50{padding-left:50px !important;}

/*font*/
.font_ss{font-size:1.2rem;}.font_s{font-size:1.4rem;}.font_l{font-size:2rem}.lh150{line-height:150%;}.lh200{line-height:200%;}.bold{font-weight:bold;}.font_n{font-size: 1.6rem;}
.textL{text-align:left !important;}.textC{text-align:center !important;}.textR{text-align:right !important;}
.s-1{padding-left:1em; text-indent:-1em;}.s-2{padding-left:2em; text-indent:-2em;}
.blue{color:#0A3E86;}.red{color:#ED1C24;}.white{color:#FFF;}.ore{color:#F15A24;}.green{color:#006837;}.yellow{color:#FFFF00;}

/*link*/
a:link,a:visited{color: #1a6c9e;}

@media (min-width: 768px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}

#pagetop {
    position: fixed;
    right: 10px;
    bottom: 10px;
    margin: 0;
    
}

#pagetop a{
    position: relative;
    display: flex;
    width: 60px;
    height: 60px;
    justify-content: center;
    background:rgba(50,50,50,0.5);
    transition: opacity .6s ease;
    color: #FFF;
    align-items: center;
    text-decoration: none;
    font-size: 40px;
    border-radius:100%;
}

#pagetop a:hover {
    opacity: .3;
}

@media screen and (max-width:767px) {
	#pagetop a {
		width: 50px;
		height: 50px;
	}
}

header{
	width: 100%;
	border-top: 10px #00559B solid;
	padding: 0 1em;
	margin: 0 0 60px 0;
}

header > div{
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	max-width: 1200px;
	width: 100%;
	margin: 30px auto 0;
}

h1{
	width: 40%;
	font-weight: normal;
	font-size: 1.4rem;
}

h1 > img{
	display: block;
	width: 100%;
	margin: 0 0 1em 0;
}

nav a:link,nav a:visited{
	display: inline-block;
	color: #333;
	font-size: 1.8rem;
	text-decoration: none;
	position: relative;
  	transition: .3s;
}

nav a::after{
	position: absolute;
	bottom: 0;
	left: 50%;
	content: '';
	width: 0;
	height: 2px;
	background-color: #00559B;
	transition: .3s;
	transform: translateX(-50%);
}

nav a:hover::after{
	width: 100%;
	color: #00559B;
}

nav > ul{
	display: flex;
}

nav > ul > li{
	margin: 0 0 0 3em;
}

@media screen and (max-width: 767px){
	header > div{
	flex-flow: column;
	justify-content: center;
	align-items: center;
	max-width: 768px;
	margin: 20px auto 0;
	}
	
	h1{
	width: 100%;
	margin: 0 0 20px 0;
	}

	h1 > img{
		width: 80%;
		margin: 0 auto 1em;
	}
	
	h1 > p{
		text-align: center;
	}
	
	nav{
		width: 100%;
	}
	
	nav a:link,nav a:visited{
	font-size: 1.6rem;
	}

	nav > ul{
		justify-content: center;
		align-items: center;
	}

	nav > ul > li{
		margin: 0;
		padding: 0 1em;
	}
	
	nav > ul > li + li{
		border-left: 1px solid #333;
	}
}


.top_img{
	display: flex;
	justify-content: space-between;
	max-width: 1200px;
	width: 100%;
	margin: 0 auto 80px;
	padding: 0 3em;
}

.animation_L{
	width: 48%;
}

.animation_L p{
	display: inline-block;
	font-size: 3.8vw;
	font-weight: bold;
	line-height: 100%;
	padding: 0.2em;
	margin: 0 0 0.3em 0;
	background: #000;
	color: #fff;
}

.animation_R{
	width: 52%;
}

.animation_R img{
	width: 100%;
}

@media screen and (max-width: 767px){
	.top_img{
	max-width: 768px;
	width: 100%;
	padding: 0 1.5em;
	}
}

@media screen and (min-width: 1200px){
	.animation_L p{
	font-size: 4.4rem;
	}	
}

h2{
	color: #00559B;
	font-size: 4.0rem;
	text-align: center;
	letter-spacing: 1.1rem;
	margin: 0 0 50px 0;
}

h2:after{
  	content: attr(data-title);
	color: #7FAACD;
	display: block;
	font-size: 1.6rem;
	margin: -5px 0 0 -0.8em;
	letter-spacing: normal;
}

h3{
	font-size: 3.0rem;
	color: #00559B;
	border-left: solid 6px #7FAACD;
	padding: 0.1em 0.4em;
	margin: 0 0 30px 0;
}

@media screen and (max-width: 767px){
	h2{
	font-size: 3.0rem;
	}
	
	h3{
	font-size: 2.4rem;
	}
}

#corp,#recruit{
	max-width: 1200px;
	width: 100%;
	margin: 0 auto 80px;
	padding: 1em 1em 0;
}

dl.history,dl.data {
	display: flex;
	flex-flow: row wrap;
	width: 100%;
	font-size: 1.8rem;
	margin: 0 0 80px 0;
}

.history dt {
	flex-basis: 20%;
	padding: 1.5em;
	color: #00559B;
	font-weight: bold;
}

.history dd {
	flex-basis: 80%;
	padding: 1.5em;
}

.history dt.even,.history dd.even{
	background: #F2F6FA;
}

.data dt {
	flex-basis: 20%;
	padding: 1.5em;
	font-weight: bold;
	border-bottom: #CCC 1px solid;
}

.data dd {
	flex-basis: 80%;
	padding: 1.5em;
	border-bottom: #CCC 1px solid;
}

.data dt.end,.data dd.end {
	border-bottom: none;
}

@media screen and (max-width: 767px) {
	dl.history,dl.data {
		flex-flow: column;
	}
	
	.history dt {
		flex-basis: 100%;
		padding: 1.5em 1.5em 0.5em 1.5em;
	}
	
	.history dd,.data dd {
		flex-basis: 100%;
		padding: 0.5em 1.5em 1.5em 1.5em;
	}
	
	.data dt {
		flex-basis: 100%;
		padding: 1.5em 1.5em 0.5em 1.5em;
		border-bottom: none;
	}
}

#job{
	width: 100%;
	margin: 0 0 80px 0;
	padding: 20px 1em 0;
	background: #F2F6FA;
}

#job > div{
	max-width: 1200px;
	width: 100%;
	margin: 0 auto 80px;
	padding: 60px 1em 80px;
}

h4{
	font-size: 2.6rem;
	color: #00559B;
	margin: 0 0 0.8em 0;
}

h4 > span{
	display: block;
}

.job_inner{
	display: flex;
	width: 100%;
	background: #fff;
	padding: 2.4em;
	box-shadow: 5px 5px 8px rgba(0, 0, 0, .3);
}

.job_inner .inner_L{
	width: 64%;
}

.job_inner .inner_R{
	display: flex;
	align-items: center;
	width: 36%;
	padding-left: 3em;
}

.job_inner .inner_R img{
	width: 100%;
}

@media screen and (max-width: 767px) {
	h4{
	font-size: 2.2rem;
	color: #00559B;
	margin: 0 0 0.8em 0;
	}
	
	.job_inner{
	display: block;
	padding: 1.5em;
	}

	.job_inner .inner_L{
	width: 100%;
	}

	.job_inner .inner_R{
	display: block;
	width: 100%;
	padding: 2em 1em 1em;
	}
}

#info{
	width: 100%;
	background: #F0F0F0;
	padding: 2em 0 60px;
}

#info > div{
	display: flex;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 2em 1em 0;
	justify-content: space-between;
}

.info_inner{
	width: 48%;
	background: #fff;
	text-align: center;
}

.info_inner > a:link{
	display: block;
	text-decoration: none;
	width: 100%;
	height: 100%;
	padding: 1.5em 1em;
}

.info_inner > a > p:first-child{
	font-weight: bold;
	color: #00559B;
	font-size: 2.2rem;
	margin-bottom: 10px;
}

.info_inner > a > p:nth-child(2){
	font-weight: bold;
	font-size: 3.0rem;
	margin-bottom: 10px;
	color: #333;
}

.info_inner > a > p:last-child{
	color: #333;
}

@media screen and (min-width: 768px){
	.info_title {
		position: relative;
		text-align: center;
		font-weight: bold;
		font-size: 2.0rem;
	}

	.info_title:before,
	.info_title:after {
		position: relative;
		display: inline-block;
		content: "";
		background: #333;
		width: 1px;
		height: 1.2em;
		margin: 0 0.5em;
		margin-top: -.3em;
		vertical-align: middle;
	}

	.info_title:before {
		transform: rotate(-35deg);
		margin: -0.3em 1em 0;
	}

	.info_title:after {
		transform: rotate(35deg);
	}
	
	a[href*="tel:"] {
		pointer-events: none;
		cursor: default;
		text-decoration: none;
	}
	
	a[href*="mailto:"] {
		pointer-events: none;
		cursor: default;
		text-decoration: none;
	}
}

@media screen and (max-width: 767px) {
	.info_title {
		text-align: center;
		font-weight: bold;
		font-size: 1.8rem;
	}
	
	#info > div{
		display: block;
	}
	
	.info_inner{
		width: 100%;
	}
	
	#info > div .info_inner:first-child{
		margin-bottom: 20px;
	}

	.info_inner > a > p:first-child{
		font-size: 1.8rem;
	}

	.info_inner > a > p:nth-child(2){
		font-size: 2.4rem;
	}
}

footer{
	text-align: center;
	font-size: 1.2rem;
	color: #fff;
	background: #00559B;
	padding: 2em 1em;
}


