@charset "UTF-8";

#header_area{
	width:100%;
	background:url(../images/common/gnav_bgup.jpg) repeat-x;
}

#header_area #inner{
	width:1100px;
	margin:0 auto;
	padding-top:3px;
	padding-bottom:1px;
}
@media screen and (max-width : 640px){
#header_area{
	width:100%;
	background:url(../images/common/gnav_bgup.jpg) repeat-x;
	box-sizing:border-box;
	overflow:hidden;
	position:relative;
	height:70px;
}
#header_area #inner{
	width:100%;
	margin:0 auto;
	padding-top:3px;
	padding-bottom:1px;
	position:relative;
}
}
#logo{
	float:left;
	padding-top:22px;
}
@media screen and (max-width : 640px){
#logo{
	float:left;
	padding:20px 10px;
	width:50%;
}
#logo img{
	width:100%;
}
}

#gnav{
	float:right;
	border-right:1px solid #CDEAFA;
}

#gnav li{
	float:left;
	border-left:1px solid #CDEAFA;
}

#gnav li a{
	display:inline-block;
	background:#FFF;
	line-height: 95px;
	padding:0 25px;
	text-decoration:none;
	color:#001823;
}

#gnav li a:hover{
	/*background:#CDEAFA;
	color:#001823 !important;*/
	background:#00A0E8;
	color:#FFF !important;
	transition: .6s;
}

#line_bot{
	width:100%;
	background:url(../images/common/gnav_bot.jpg) repeat-x;
	height:1px;
	clear:both;
}

#page_top{
	float:right;
	padding-top:50px;
	clear:both;
}
@media screen and (max-width : 640px){
#page_top{
	float:right;
	padding-top:20px;
}
}
footer{
	width:100%;
	background:url(../images/common/gnav_bgup.jpg) repeat-x;
	
}

@media screen and (max-width : 640px){
footer{
	width:100%;
	background:url(../images/common/gnav_bgup.jpg) repeat-x;
	box-sizing:border-box;
	overflow:hidden;
}
}
footer #inner{
	width:1100px;
	margin:0 auto;
	padding-top:30px;
	padding-bottom:100px;
}
@media screen and (max-width : 640px){
footer #inner{
	width:100%;
	margin:0 auto;
	padding:10px;
	box-sizing:border-box;
	overflow:hidden;
}
}

#footer_logo img{
	width:201px;
	margin-bottom:20px;
}
.footer_nav li{
	display:inline;
	margin-left:50px;
	font-size:14px;
}
.footer_nav li a{
	text-decoration:none;
}
@media screen and (max-width : 640px){
.footer_nav {
	display:table;
	width:100%;
}
.footer_nav li{
	display:table-cell;
	width:25%;
	margin-left:0;
	font-size:11px;
	text-align:center;
}
}

@media screen and (max-width : 640px){
#sp_menu {
	background-color: #00A0E8;
	position:absolute;
	top:71px;
	left:0;
	color:#000;
	width:100%;
	display:none;
	padding:10px;
	box-sizing: border-box;
	z-index:100;
}

#sp_menu ul li {
	margin-bottom:1px;	
}
#sp_menu ul li a {
	display:block;
	background:#FFF;
	width:100%;
	padding:20px 5px 20px 15px;;	
	display:block;
	box-sizing: border-box;
	font-size:14px;
	text-decoration:none;
	font-size:16px;
}

#sp_menu p#close_btn {
	text-align:center;
}
#sp_menu p#close_btn a{
	background:#FFF;
	box-sizing: border-box;
	color:#00A0E8 !important;
	display:block;
	width:100%;
	clear:both;
	padding:20px 5px;
	margin:10px auto 0;
	text-decoration:none;
	font-size:16px;
}
#header_area #inner #menu_btn {
	position:absolute;
	right:0;
	top:3px;
}

#header_area #inner #menu_btn .menu {
	display: block;
}
#header_area #inner #menu_btn .close {
	display: none;
}
#header_area #inner #menu_btn.open .menu {
	display: none;
}
#header_area #inner #menu_btn.open .close {
	display: block;
}

}

@media screen and (min-width : 641px){


/* -------------------------------------------------------------ヘッダー */
#site_header #sp_menu {
	display: none !important;
}

}
