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

/****************************************
		1. 基本設定 
*****************************************/

/*
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 3.3.0
build: 3167
　↓YUI3 CSS Reset　ブラウザー固有のスタイルをリセットします↓　*/
body,div,dl,dt,dd,
ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,code,form,fieldset,legend,
input,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}

/*
Copyright (c) 2010, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.com/yui/license.html
version: 3.3.0
build: 3167
↓YUI3 CSS Fonts　フォントサイズを相対指定する↓*/


/*---↓リンクに対する共通設定↓---*/
*{
	margin:0;
	padding:0;
	line-height:1.5;
	list-style:none;
	text-decoration:none;
	box-sizing:border-box;
	color:#252525;
	font-family: Noto, 游ゴシック, YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.row{
	display: flex;
    justify-content: space-between;
}
img{
	vertical-align:middle;
}
html{
    scroll-behavior: smooth;
}


/*＝＝＝＝ヘッダー＝＝＝＝*/
header{
	position:fixed;
	top:0;
	width:100%;
	height:80px;
	z-index:10000;
}
nav{
	font-size:14px;
	width:90%;
	margin:0 auto;
	min-width:1250px;
	max-width:1400px;
	padding:8px 0;
}	
header .row{
	align-items: center;
}
nav ul{
	min-width: 870px;
}
nav div:first-of-type{
	margin-right:20px;
	width:180px;
}
nav div:last-of-type{
	width:140px;
}
nav div img{
	width:100%;
	height:auto;
}


.white_back{
	margin: 0 0 0 auto;
    width: 25%;
    min-width: 102px;
    height: 105px;
    margin-top: 9px;
    position: absolute;
    right: 0;
    z-index: -1;
	}
.header_contact{
	padding:15px 0;
    text-align: right;
	width:90%;
    min-width: 1250px;
    max-width: 1400px;
    margin: 0 auto;
}
.header_contact ul{
	width: 182px;
    text-align: center;
    margin: 0 0 0 auto;
}
.hc_01{
	font-size:14px;
	background: linear-gradient(transparent 55%, rgba(255,255,51,0.7) 10%);
	margin-bottom:2px;
}
.hc_02 , .hc_03{
	font-size:18px;
	font-weight:bold;
	color:#00419a;
	margin-bottom:2px;
}
@media screen and (max-width: 1550px) {
	.white_back{
		width:20%;
	}
}

/*ホバー*/
nav li a{
  position: relative;
  display: inline-block;
  text-decoration: none;
  font-weight:bold;
}
nav li a::after{
  position: absolute;
  bottom: -8px;
  left: 0;
  content: '';
  width: 100%;
  height: 2px;
  background: #00419a;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
}
nav li a:hover::after{
  bottom: -4px;
  opacity: 1;
  visibility: visible;
}

nav div img:hover{
	opacity:0.5;
}
	


/*＝＝＝＝FOOTER＝＝＝＝*/
.footer_wave{
	width:100%;
	background:#fff;
}
.footer_wave img{
	width:100%;
}
footer{
	background:#00419a;
	height: 500px;
	position:relative;
}
footer .top{
	position:absolute;
	top:-15px;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
footer p ,footer li a{
	color:#fff;
}
.arrow {
  position: relative;
  display: inline-block;
  padding-left: 18px;
  padding-bottom:8px;
  color: #333;
  text-decoration: none;
}
.arrow:before {
  content: '';
  width: 15px;
  height: 15px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: -3px;
  margin-top: -9px;
}
.arrow:after {
  content: '';
  width: 4px;
  height: 4px;
  border: 0;
  border-top: solid 2px #00419a;
  border-right: solid 2px #00419a;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -4px;
  transform: rotate(45deg);
}
footer .row{
	width: 1200px;
    margin: 0 auto 55px;
}
.footer_img img{
	width:200px;
	height:auto;
}
footer p{
	margin-top:20px;
	line-height:1.7;
}
.address{
	text-align:center;
}
.copy{
	text-align: center;
    font-size: 12px;
	color:#fff;
}
#under_wrapper{
	background:#002251;
	padding:6px 0;
}

/*ホバー*/
footer .top:hover{
	top:-25px;
    transition-duration: 0.5s;
}
footer li a{
	position: relative;
	display: inline-block;
	text-decoration: none;
	font-size:14px;
}
footer li a::after{
	position: absolute;
	bottom: -8px;
	left: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: #fff;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
}
footer li a:hover::after{
	bottom: -4px;
	opacity: 1;
	visibility: visible;
}