/* CSS Document */

#pageTop{
	display: none;
	}

#pagePath{
	display: none;
	}

#wrapper{
	position: relative;
	}

#hero{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 120vh;
	padding: 0;
	background: #072c68;
	}
	#hero:after{
		content: "";
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 20vh;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+100 */
background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
		}
	#hero li{
		height: 120vh;
		}
		#hero li.slide-01{
			display: flex;
			justify-content: center;
			align-items: center;
			padding-bottom: 20vh;
			background: #072c68;
			}
	#hero h1{
		color: #072c68;
		font-weight: 500;
		line-height: 1.4em;
		}
	#hero a{
		position: absolute;
		left: 50%;
		bottom: 20vh;
		margin-bottom: 1em;
		z-index: 1;
		}
	#hero i{
		display: block;
		width: 1em;
		height: 1em;
		margin-left: -0.5em;
		background: rgba(7,44,104,0.8);
		border-radius: 100%;
		fill: #fff;
		}
	#hero svg{
		width: 0.8em;
		height: 0.8em;
		margin: 0.1em;
		transform: rotate(90deg);
		}
	#hero .heroCopy{
		position: absolute;
		top: 0;
		left: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100%;
		padding-bottom: 20vh;
		text-align: center;
		/*filter: drop-shadow(0 0 0.2em #fff);*/
		color: #072c68;
		font-weight: 500;
		line-height: 1.4em;
		z-index: 1;
		opacity: 0;
		font-family: source-han-sans-japanese,sans-serif;
		font-weight: 400;
		font-style: normal;
		}
	#hero .thumb{
		padding-top: 120vh;
		}

#movie{
	position: relative;
	z-index: 0;
	text-align: center;
	padding: 4em 0 0;
	}
	#movie>div{
		/* background: #072c68; */
		}
	#movie dt{
		color: #072c68;
		font-weight: 500;
		font-size: 2.0em;
		}
	#movie dt+dd{
		margin-top: 1em;
		}
	#movie video{
		width: 100%;
		}
		#movie video iframe{
			width: 100%;
			}

#contents{}
	#contents>div>dl:nth-of-type(1) img{
		object-position: 50% 60%;
		background-position: 50% 60%!important;
		}
	#contents dl{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		position: relative;
		width: calc(50% - 0.5em);
		background: #000;
		padding: 1em;
		transition: background 0.2s ease-out;
		}
		#contents dl:hover{
			background: #072c68 !important;
			}
		#contents dl:nth-child(1){
			background: #23af94;
			}
		#contents dl:nth-child(2){
			background: #c497f7;
			}
		#contents dl:nth-child(3){
			background: #135891;
			}
		#contents dl:nth-child(4){
			background: #d6bd51;
			}
		#contents dl:nth-child(5){
			background: #66b5ef;
			}
		#contents dl:nth-child(6){
			background: #ea8cbe;
			}
	#contents dl:nth-of-type(n+3){
		margin-top: 1em;
		}
	#contents dt{
		position: relative;
		width: 100%;
		color: #fff;
		font-weight: 500;
		line-height: 1.4em;
		text-align: center;
		z-index: 1;
		}
	#contents a{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		color: transparent;
		z-index: 1;
		}
	#contents .wrap{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		}
	#contents .thumb{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		padding: 0;
		opacity: 0.5;
		}

#contentsBnr{
	padding-top: 0;
	}
	#contentsBnr li{
		list-style: none;
		}
		#contentsBnr li+li{
			margin-top: 1em
			}

#topics{
	padding: 2em 0;
	}
	#topics h2{
		text-align: center;
		}
	#topics p{
		padding: 2em 1em;
		background: #f2f2f2;
		border-radius: 0.2em;
		text-align: center;
		}
	#topics ul{
		list-style: none;
		border-bottom: 1px solid #ddd;
		}
	#topics li{
		display: flex;
		flex-wrap: wrap;
		padding: 0.8em 0;
		border-top: 1px solid #ddd;
		}
		#topics li:before{
			content: "カテゴリー";
			width: 9em;
			padding: 0.45em 0;
			background: #ccc;
			color: #fff;
			font-size: 0.8em;
			line-height: 1em;
			text-align: center;
			order: 1;
			}
		#topics li a{
			display: inline-block;
			line-height: 1.4em;
			order: 2;
			}
		#topics li time{
			color: #444;
			line-height: 1.4em;
			order: 0;
			width: 6em;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			}
	#topics .topics{}
		#topics .topics:before{
			content: "お知らせ";
			background: #072c68;
			}
	#topics .recruit{}
		#topics .recruit:before{
			content: "採用情報";
			background: #0b8982;
			}
	#topics .emergency{}
		#topics .emergency:before{
			content: "重要なお知らせ";
			background: rgba(207,0,3,1.00);
			}

#appearance{}
	#appearance ul{
		display: flex;
		list-style: none;
		}
	#appearance li{
		width: 33.33%;
		}
	#appearance .thumb{
		padding-top: 40%;
		}

#pageLink{
	padding: 2em 0;
	}
	#pageLink ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		list-style: none;
		}
	#pageLink li{}
		#pageLink li:nth-child(4n+1){
			margin-left: 0;
			}
	#pageLink a{
		display: block;
		background: #fff;
		border: 0.2em solid #072c68;
		color: #072c68;
		fill: #072c68;
		font-weight: 500;
		text-align: center;
		text-decoration: none;
		}
		#pageLink a:hover{
			background: #072c68;
			color: #fff;
			fill: #fff;
			}
	#pageLink i{
		display: block;
		}
		#pageLink i svg{
			vertical-align: top;
			}

#address{
	padding: 4em 0 0;
	background: #f4f3ef;
	}
	#address dl{
		display: flex;
		flex-direction: column;
		align-items: center;
		}
	#address dt{
		display: flex;
		flex-direction: column;
		align-items: center;
		color: #072c68;
		fill: #072c68;
		font-weight: 500;
		}
		#address dt svg{
			margin-top: 0.2em;
			}
	#address dd{
		margin-top: 0.5em;
		font-weight: 500;
		}

#schedule{
	padding: 2em 0;
	background: #f4f3ef;
	}
	#schedule section{
		background: #fff;
		}
	#schedule section+section{
		padding-top: 0;
		}
	#schedule table{
		width: 100%;
		border: 2px solid #072c68;
		border-collapse: collapse;
		}
	#schedule *+table{
		margin-top: 1em;
		}
	#schedule caption{
		padding: 0.5em;
		background: #072c68;
		color: #fff;
		font-weight: 500;
		text-align: center;
		}
	#schedule th,
	#schedule td{
		border: 1px solid #072c68;
		line-height: 1.4em;
		text-align: center;
		}
	#schedule thead{
		background: #072c68;
		color: #fff;
		}
	#schedule tbody{
		background: #fff;
		color: #072c68;
		}
	#schedule [href="healthScreening/form/index.html"]{}
		#schedule [href="healthScreening/form/index.html"]:not(:hover){
			background: #ff8b00;
			}
			#schedule [href="healthScreening/form/index.html"]:hover{
				background: #072c68;
				}


/* for all */
@media (max-width: 1199px) {
/*1199px以下*/
}
@media (max-width: 991px) {
/*991px以下*/
#main{
	padding-top: 100vh;
	}

}


/* for mobile */
@media (max-width: 767px) {
/*767以下px*/
#wrapper{
	padding: 0;
	}
#hero{}
	#hero a{
		bottom: 35vh;
		}
	#hero i{
		font-size: 3em;
		}
	#hero .heroCopy{
		font-size: 1.8em;
		line-height: 1.6em;
		}
#topics{}
	#topics ul{
		margin-left: -1em;
		margin-right: -1em;
		}
	#topics li{
		padding: 1em;
		align-content: center;
		}
		#topics li time{
			margin-right: 0.5em;
			}
		#topics li a{
			width: 100%;
			margin-top: 0.5em;
			}
#address{}
	#address dt{}
		#address dt svg{
			font-size: 2em;
			}
#schedule{}
	#schedule section{
		padding: 1em;
		}
	#schedule th,
	#schedule td{
		padding: 0.5em 0;
		}
#movie{}
	#movie iframe{
		height: 225px;
		}
}
@media (max-width: 767px) and (orientation:portrait) {
/*767px以下 縦向き*/
#movie{}
	#movie dl{
		/* padding: 1em; */
		}
	#movie dt{
		font-size: 1.2em;
		}
#contents{}
	#contents dl{
/*		height: 8em;*/
		height: 6em;
		}
/*	#contents dl+dl{
		height: 6em;
		}*/
	#contents dt{
		font-size: 1.1em;
		}
#pageLink{}
	#pageLink li{
		width: 100%;
		}
		#pageLink li+li{
			margin-top: 1em;
			}
	#pageLink a{
		position: relative;
		padding: 1em;
		padding-left: 2em;
		}
	#pageLink i{
		position: absolute;
		top: 50%;
		left: 1em;
		}
		#pageLink i svg{
			margin-top: -0.5em;
			font-size: 2em;
			vertical-align: top;
			}
#schedule{}
	#schedule table{
		display: flex;
		flex-wrap: wrap;
		}
		#schedule table *{
			display: block;
			}
	#schedule caption{
		width: 100%
		}
	#schedule tr{
		display: flex;
		flex-direction: column;
		}
	#schedule thead{
		width: 3em;
		background: rgba(7,44,104,0.8);
		}
		#schedule thead th,
		#schedule thead td{
			padding: auto 0;
			}
		#schedule thead th{
			color: transparent;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			}
	#schedule tbody{
		display: flex;
		width: calc(100% - 3em);
		}
		#schedule tbody tr{
			width: 50%;
			}
			#schedule tbody tr:first-child:last-child{
				width: 100%;
				}
		#schedule tbody th,
		#schedule tbody td{
			border-left: none;
			}
	#schedule th,
	#schedule td{
		display: block;
		}
		#schedule td{
			border-top: none;
			}
}
@media (max-width: 767px) and (orientation:landscape) {
/*767px以下 横向き*/
#movie{}
	#movie dl{
		/* padding: 2em 4em; */
		}
	#movie dt{
		font-size: 1.2em;
		}
#contents{}
	#contents dl{
/*		height: 10em;*/
		height: 8em;
		}
/*	#contents dl+dl{
		height: 8em;
		}*/
	#contents dt{
		font-size: 1.2em;
		}
#pageLink{}
	#pageLink li{
		width: 10em;
		margin-left: 1em;
		}
	#pageLink a{
		padding: 1em;
		}
	#pageLink i{
		margin-bottom: 1em;
		}
		#pageLink i svg{
			font-size: 5em;
			}
#contactUs{}
	#contactUs dl{
		width: calc(50% - 0.5em);
		}
	#contactUs dl+dl{
		margin-left: 1em;
		}
#schedule{}
	#schedule caption{
		display: none;
		}
	#schedule th{
		width: 12em;
		}
}


/* for tablet */
@media (min-width: 768px) {
/*768px以上*/
#wrapper{
	position: relative;
	}
#hero{}
	#hero i{
		font-size: 4em;
		}
#movie{}
	#movie dl{
		padding: 2em 4em 0 4em;
		}
	#movie dt+dd{
		margin-top: 1em;
		}
	#movie iframe{
		width: 80%;
		}
#topics{}
	#topics li{
		-ms-flex-align: start;
		-webkit-align-items: flex-start;
		align-items: flex-start;
		}
	#topics li time{
		width: 6em;
		margin-right: 1em;
		}
	#topics li span{
		width: 6em;
		}
/*	#topics li a{
		max-width: calc(100% - 14em);
		margin-left: 1em;
		}*/
#address{}
	#address dt{}
		#address dt svg{
			font-size: 2.4em;
			}
#schedule{}
	#schedule section{
		padding: 2em;
		}
	#schedule caption{
		display: none;
		}
	#schedule th,
	#schedule td{
		padding: 0.8em 0;
		}
}
@media (min-width: 768px) and (max-width: 1199px) {
/*768px～1199px*/
}
@media (min-width: 768px) and (max-width: 991px) {
/*768px～991px*/
#hero{}
	#hero .heroCopy{
		font-size: 2.0em;
		}
	#hero p{
		font-size: 1.4em;
		}
#movie{}
	#movie dt{
		font-size: 1.4em;
		}
	#movie iframe{
		height: 365px;
		}
#contents{}
	#contents dl{
/*		height: 18em;*/
		height: 10em;
		}
/*	#contents dl+dl{
		height: 10em;
		}*/
	#contents dt{
		font-size: 1.4em;
		}
#topics{}
    #topics li a{
        width: 100%;
        margin-top: 0.5em;
        }
#pageLink{}
	#pageLink li{
		width: 13em;
		margin-left: 2em;
		}
	#pageLink a{
		padding: 1em;
		font-size: 1.2em;
		}
	#pageLink i{
		margin-bottom: 1em;
		}
		#pageLink i svg{
			font-size: 5em;
			}
#schedule{}
	#schedule td{
		width: 5em;
		}
}


/* for PC */
@media (min-width: 992px) {
/*992px以上*/
#hero{}
	#hero .heroCopy{
		font-size: 3.4em;
		line-height: 1.6em;
		}
#main{
	padding-top: calc(100vh - 7.4em);
	}
#nav{
	background: rgba(7,44,104,0.8);
	}
#hero{}
	#hero p{
		font-size: 1.6em;
		}
#contents{}
	#contents dl{
/*		height: 24em;*/
		height: 18em;
		}
/*	#contents dl+dl{
		height: 18em;
		}*/
#topics{}
	#topics li a{
		max-width: calc(100% - 14em);
		margin-left: 1em;
		}
#pageLink{}
	#pageLink li{
		width: 16em;
		margin-left: 1em;
		}
	#pageLink a{
		padding: 1.5em;
		font-size: 1.4em;
		}
	#pageLink i{
		margin-bottom: 1.5em;
		}
		#pageLink i svg{
			font-size: 5em;
			}
}
@media (min-width: 992px) and (max-width: 1199px) {
/*992px～1199px*/
#movie{}
	#movie dt{
		font-size: 1.8em;
		}
	#movie iframe{
		height: 480px;
		}
#contents{}
	#contents dt{
		font-size: 1.8em;
		}
#schedule{}
	#schedule td{
		width: 6.5em;
		}
}
@media (min-width: 1200px) {
/*1200px以上*/
#movie{}
	#movie>div{
		max-width: 900px;
		}
	#movie dt{
		font-size: 2.0em;
		}
	#movie iframe{
		height: 450px;
		}
#contents{}
	#contents dt{
		font-size: 2.0em;
		}
#schedule{}
	#schedule td{
		width: 7em;
		}
}


/* Edge */
@supports (-ms-ime-align:auto) {
}


/* ie */
@media all and (-ms-high-contrast: none){
}