@charset "utf-8";
/*

HTML5 CSS Reset
Based on Eric Meyer's CSS Reset
and html5doctor.com HTML5 Reset

Copyright (c) 2011 736 Computing Services Limited
Released under the MIT license. http://opensource.736cs.com/licenses/mit

*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, audio, canvas, details, figcaption,
figure, footer, header, hgroup, mark, menu, meter, nav,
output, progress, section, summary, time, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

body {
	line-height: 1;
}

article, aside, dialog, figure, footer, header, 
hgroup, nav, section, blockquote { 
	display: block;
}

nav ul {
	list-style: none;
}

ol {
	list-style: none;
}

ul {
	list-style: none;
}

ul li {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

ins {
	text-decoration: underline;
}

del {
	text-decoration: line-through;
}

mark {
	background: none;
}

abbr[title], dfn[title] {
	border-bottom:1px dotted #000;
	cursor:help;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
	text-align:left;
}
table th {
	font-weight:normal;
}

hr {
	display: block;
	height: 1px;
	border: 0;	
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0;
}

input[type="submit"], input[type="button"], button {
    padding: 0 !important;
    margin: 0 !important;
}

input, select, a img {
	vertical-align: middle;
}

/* clearfix */
.clearfix:after,div:after{
	content: "."; 
	display: block; 
	height: 0; 
	font-size:0;	
	clear: both; 
	visibility:hidden;
}
.clearfix,div {display: inline-block;} 
* html .clearfix,* html div {height: 1%;}
.clearfix, div {display:block;}

html{
	font-family:sans-serif;
}
.header_gb{
	width:100%;
	max-width:960px;
	margin:3% auto;
	margin-bottom:0;
}
.header_logo{
	display:inline-block;
	float:left;
	width:30%;
	height:auto;
}
.header_logo_sp{
	display:none;
	float:left;
	width:80%;
	height:auto;
}
.header_menu{
	display:inline-block;
	float:right;
	width: 65%;
	margin-top: 7%;
	margin-left: 4%;
}
.header_menu_ua{
	display:none;
	opacity:0;
	position:absolute;
	width:50%;
	left:45%;
	margin-top:13%;
	z-index:999;
}
.header_menu_sp{
	display:none;
	float:right;
	width:19%;
	height:auto;
	//text-align:center;
	//background-color:#59b1eb;
	//padding:2% 0;
	margin-top: 4%;
}
.header_menu a{
	text-decoration: none;
}
.header_menu::before,
.header_menu::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.header_menu,
.header_menu::before,
.header_menu::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	
	-webkit-transition: all .4s;
	-moz-transition: all .4s;
	-ms-transition: all .4s;
	transition: all .4s;
}
.header_span{
	display:inline-block;
	width:16%;
	color:#fff;
	text-align:center;
	font-weight:bold;
	padding:2% 0;
	margin-left:-1%;
	border:solid 2px #000;
}
.header_span_ua{
	display:block;
	width:100%;
	font-size:40px;
	padding:5% 0;
	text-decoration: none;
	border:solid 6px #000;
}
.footer{
    width:80%;
    float: left;
    border-bottom:8px solid #000;
    margin-bottom:50px;
    padding-bottom:0.5%;
}
.footer img{
	display:inline-block;
}
.field_logo{
	width:20%;
	height:auto;
	margin-left:10%;
}
.sns{
	width:5%;
	height:auto;
	margin-left:2%;
	margin-bottom:-5%;
}
@media screen and (max-width: 600px) {
	.header_gb{
		position:relative;
	}
	.header_logo{
		display:none;
	}
	.header_logo_sp{
		display:inline-block;
	}
	.header_menu{
		display:none;
		opacity:0;
		position:absolute;
		width:50%;
		left:45%;
		margin-top:13%;
		z-index:999;
	}
	.header_menu_sp{
		display:inline-block;
	}
	.header_span{
		display:block;
		width:100%;
		padding:5% 0;
		text-decoration: none;
	}
	.footer{
		border-bottom:4px solid #000;
		width:90%;
	}
	.field_logo{
		width:40%;
		margin-left:5%;
	}
	.sns{
		width:13%;
		height:auto;
		margin-left:2%;
		margin-bottom:-5%;
	}
}