@charset "utf-8";

/*=====================================================
COMMON-LAYOUT
======================================================*/

.wrap{
	overflow: hidden;
	position: relative;
	padding-top:109px;
}

div#header_wrap{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width:100%;
	background: #FFFFFF;
	z-index: 65535;
}

div#header_wrap:before{
	content: "";
	pointer-events: none;
	position: fixed;
	top: 45px;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.5);
	opacity: 0;
	transition: all 0.5s ease-in-out 0s;
}

body.nav_open div#header_wrap:before{
	pointer-events: all;
	opacity: 1;
}

div#header{
	margin:0 auto;
	position:relative;
	max-width:1024px;
	padding:0 20px;
	height:109px;
	box-sizing: border-box;
}

div#header h1{
	position:absolute;
	top:-100px;
}

div#header h2{
	position:absolute;
	top: 5px;
	left:20px;
	line-height:0;
	font-size:0;
}

ul.headnavi{
	position:absolute;
	top:0;
	right:20px;
	font-size:0;
	line-height:0;
	letter-spacing: -0.4em;
}

ul.headnavi li{
	display: inline-block;
	vertical-align: middle;
	padding-left:20px;
}

ul.pc_nav{
	position:absolute;
	bottom:0;
	right:20px;
	font-size:0;
	line-height:0;
	border-right:solid 1px #5D5D5D;
}

ul.pc_nav li{
	float:left;
	width:150px;
	border-left:solid 1px #5D5D5D;
}

ul.pc_nav li>a{
	display:block;
	position:relative;
	padding:5px 10px 10px;
	text-align: center;
}

ul.headnavi_s{
	position:absolute;
	top:0;
	right:0;
	font-size:0;
	line-height:0;
	display: none;
}

ul.headnavi_s li{
	float: left;
}

ul.headnavi_s li img{
	height: 45px;
}

body:not(.nav_open) ul.headnavi_s li.nav_btn img.on{
	display: none;
}

.nav_open ul.headnavi_s li.nav_btn img.off{
	display: none;
}

.official{
	text-align: center;
	padding:20px 20px 20px;
}

div#gnavi_wrap .tel{
	text-align: center;
	padding:0px 20px 20px;
}


div#gnavi_wrap{
	position:fixed;
	background: #FFFFFF;
	top: 45px;
	left: 0;
	right: 0;
	display:none;
	z-index: 65535;
}

ul.sp_nav {
	/* position:absolute; */
	/* top:0; */
	/* left:0; */
	/* right:0; */
	border-bottom: 1px solid #d7d7d7;
	z-index:9999;
}
.sp_nav li {
	/* float:left; */
	/* width:25%; */
	border-top: 1px solid #d7d7d7;
	box-sizing: border-box;
	/* text-align:center; */
	line-height:40px;
}
.sp_nav li a {
	padding: 0 10px;
	display:block;
	position: relative;
	/* background:#EEE; */
	/* color:#333; */
}
.sp_nav li a:after {
	content:">";
	position: absolute;
	right: 10px;
	font-size: 150%;
	line-height: 1;
	transform: scaleX(0.5) translateY(-50%);
	top: 50%;
	
}
.sp_nav li a.cr,.sp_nav li a:hover {
	text-decoration:none;
	/* background:rgba(255,255,255,0.5); */
}


.sp_nav li.inq {
	width:50%;
}

.sp_nav li.inq a {
	text-decoration:none;
	background:#900;
	color:#FFF;
}

div.container{
	max-width:1024px;
	margin:0 auto;
	padding:50px 20px;
}

footer{
	background: #f5f3ee;
}

footer address{
	padding-top:15px;
	text-align: center;
	font-style: normal;
	font-size:12px;
}

.pagetop{
	position: fixed;
	bottom: 0;
	right: 0;
	padding:5px 15px;
	background: rgba(0,0,0,0.75);
	color: #FFFFFF;
	font-size:16px;
	text-align: center;
	transition: all 0.5s ease-in-out 0s;
	opacity: 0;
	pointer-events: none;
}

.pagetop a:before{
	content:"\025b2";
	font-size: 60%;
	vertical-align: middle;
	display: inline-block;
	padding-right:1em;
}

.pagetop:hover{
	background: rgba(0,0,0,1);
}

.scrolled .pagetop{
	opacity: 1;
	pointer-events: all;
}


@media screen and (max-width: 960px){

	div#header h2{
		top: 10px;
	}

}

@media screen and (max-width: 767px){
	
	div#header{
		height:45px;
	}
	
	.wrap{
		padding-top:45px;
	}


	ul.headnavi{
		display:none;
	}
	
	ul.headnavi_s{
		display: block;
	}

	ul.pc_nav{
		display:none;
	}
	
	div#header h2{
		top: 5px;
		left: 10px;
		width:117px;
	}

	footer address{
		font-size:10px;
		padding-bottom:30px;
	}

}


@media screen and (max-width: 600px){

	.sp_nav li {
		/* width:50%; */
	}
	.sp_nav li.inq {
		width:100%;
	}
	
	.pagetop{
		padding:5px 10px;
		font-size:14px;
	}

	
	
}