@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,700&display=swap');
.oufont{font-family: 'Montserrat', sans-serif;}


body {
	font-size: 12px;
	font-family:  'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	line-height: 1.8;
	letter-spacing:0;
	color: #000;
	background: #FFF;
	font-weight:400;
}
a {
	text-decoration: none;
	color: #000;
}
a:hover img {
	opacity: 0.7;
}
img {
	vertical-align: top;
}
.pc {
	display: block ;
}
.sp {
	display: none  ;
}
.onlysp{ display:none;}


/* contents */
.contents {
	width:100%; padding:0 60px; box-sizing:border-box; margin-top: 62px;
}


.hedtxt {
    font-size: 12px;
    font-weight: bold;
    text-align: right;
    letter-spacing: 0.085em;
    padding-top: 21px;
    margin-right: -20px;
}


#wrapper {
	width: 100%;
	overflow: hidden;
}
/* header */


#header {
	width: 100%;
	height: 62px;
	background: #fff;
	z-index: 100;
	position: fixed;
	transition: all 0.5s ease;
	
}
#header .headerWrap {
	/*max-width: 1070px;*/
	margin: 0 auto;
	position: relative;
	width: 100%;
	box-sizing: border-box;
	padding: 0 40px;
	
}
#header .headerWrap .logo {
    position: absolute;
    top: 0;
    width: 198px;
    height: auto;
    left: 20px;
}
#header .headerWrap .logo img {
	width: 100%;
	height: auto;
}
#header .headerWrap .nav-header {
	padding-top: 50px;
	text-align: right;
	font-size: 0;
}
#header .headerWrap .nav-header li {
	padding: 0 15px;
	letter-spacing: 0.16em;
	
	border-right:1px solid #e5e5e5;
	font-size: 13px;
	line-height:13px;
	color: #FFF;
	display: inline-block;
}

#header .headerWrap .nav-header li:last-child {
	padding-right: 0;
	border-right: none;
}
#header .headerWrap .nav-rightNav {
	text-align: right;
	position: absolute;
	font-size:12px;
	right: 0;
	top: 0;
	font-size: 0;
}
#header .headerWrap .nav-rightNav li {
	display: inline-block;
	vertical-align: middle;
	padding-left: 5px;
	letter-spacing: 0.1em;
}
#header .headerWrap .nav-rightNav li{ font-size:12px;}
#header .headerWrap .nav-rightNav li.contactBtn{ background:#003f98; text-align:center; padding-left:0; box-sizing:border-box; border:2px solid #004898;}
#header .headerWrap #menu-btn_sp {
	display: none;
}





#header .headerWrap .nav-header li{ position: relative;}
#header .headerWrap .nav-header li a:hover:after{ content: ""; background: url( ../../img/arrow.svg) center top no-repeat;
width: 10px; height: 6px; display: block; background-size: contain; position: absolute; left: 50%; margin-left: -5px; top: 20px;}



.footer{ background: #db0415;}
.footer .inner{ padding: 45px 65px}
.footer h2{ width: 255px; float: left;}
.footer h2 img{ width: 100%;}
.footer .txtCons{ width: 430px; float: right; font-weight: bold; font-size: 10px; line-height: 25px; letter-spacing: 0.085em; color: #fff;}
.footer .txtCons a{ color: #fff;}
.footer .txtCons li{ display: inline-block; padding-right: 15px;}




.scroll {
    position: absolute;
    z-index: 1;
    top: auto;
    right: 28px;
    overflow: hidden;
    width: 1px;
    height: 76px;
    letter-spacing: 0.08em;
    bottom: 1%;
}
.scroll:after, .scroll:before {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 2px;
	height: 100%;
	content: ''
}
.scroll:before {
	z-index: 10;
	-webkit-animation: scroll 2.4s infinite normal;
	animation: scroll 2.4s infinite normal;
	background: #333
}
.scroll:after {
	background: #cacaca
}
@-webkit-keyframes scroll {
0% {
-webkit-transform:translate3d(0, -100%, 0)
}
15% {
-webkit-transform:translate3d(0, -98%, 0)
}
85% {
-webkit-transform:translate3d(0, 98%, 0)
}
100% {
-webkit-transform:translate3d(0, 100%, 0)
}
}
@keyframes scroll {
0% {
transform:translate3d(0, -100%, 0)
}
15% {
transform:translate3d(0, -98%, 0)
}
85% {
transform:translate3d(0, 98%, 0)
}
100% {
transform:translate3d(0, 100%, 0)
}
}



@media screen and (max-width:1000px) {
	.nav-header{ display: none;}
	
	
	#header .headerWrap .logo{ width: 54.666%; margin:0 auto; position: relative; display: block; top: auto; height: auto;
	padding-top: 23px;}
	#header{ position: relative; height: 62px; top: 23px; top: 0;}
	#header .headerWrap{ padding: 0;}
	
}

@media screen and (max-width:1000px) {
	
	.sp{ display: block;}
	.pc{ display: none;}
}
.onlysp{ display:block;}

/* =================
clearfix
================= */
.clearfix:after, .cfx:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* =================