html,body{width:100%;}
body{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #fff;
	background-image: url("../images/background.png");
	background-repeat: repeat;
	background-size: 220px;
}
#wrap {overflow: hidden;}
header{width:100%; height:auto;}
header>nav{width:1000px; margin-left: auto; margin-right: auto; height:100px;}
header>nav>h1{float:left;width: 280px; text-align: left;}
header>nav>h1>a{margin-top: 18px; display: block;}
header>nav>h1>a>img{width:100%;}
header>nav>ul{float:right;width:630px;text-align: right; font-size: 0;}
header>nav>ul>li{display: inline-block; width: 150px; font-size: 14px; color: #ffffff; margin-right: 3%; line-height:100px;}
header>nav>ul>li.nav_list02 {width: 107px;}
header>nav>ul>li.nav_list03 {width: 137px; margin-right: 0;}
header>nav>ul>li>a{color: #fff;}
header>nav>ul>li>a>img {vertical-align: middle;}
.smp{display: none;}

footer{}


div.pagetop {position:fixed; right:20px; display:none; background-color:rgba(0,9,15,0.7); color:#fff; text-decoration:none; font-weight:bold; font-size:11px; width:60px; height:60px; text-align:center; line-height:22px; border-radius:30px;  box-sizing:border-box; cursor: pointer; border:4px solid #fff; z-index: 2;}
div.pagetop>a{color:#fff; line-height: 7;}
div.pagetop:before {content:'\25B2'; position:absolute; top:10px; left:0; width:100%; text-align:center; font-size:20px;}
div.pagetop:hover {opacity:0.7;}

@media screen and (max-width: 768px) {
/*header*/
header{width:100%; background-color:#030000; height:70px;}
header>nav{width:100%; position: relative;}
header>nav>h1{float:left; position:relative;width: 80%; text-align: center; margin-top: 18px;}
header>nav>h1>a{width:200px; margin-top: 0; margin-left: 5%; max-width: 250px;}
header>nav>h1>a>img{width: 200px; height: 32px;}
/*navi*/
header>nav>div#smp-btn {float: right; width: 15%;}
header>nav>div#smp-btn {position: relative; height: 36px; width: 40px; cursor: pointer; float: right; margin: 22px 5% 3% 0;}
header>nav>div#smp-btn span {display: block; position: absolute; height: 4px; width: 100%; background: #b28951; left: 0; -webkit-transition: .35s ease-in-out; -moz-transition: .35s ease-in-out; transition: .35s ease-in-out;}
header>nav>div#smp-btn span:nth-child(1) {top: 0;}
header>nav>div#smp-btn span:nth-child(2) {top: 11px;}
header>nav>div#smp-btn span:nth-child(3) {top: 22px;}
header>nav>div.open span:nth-child(1) { -webkit-transform: translateY(25px) rotate(-315deg); transform: translateY(10px) rotate(-315deg);}
header>nav>div.open span:nth-child(2) {opacity: 0;}
header>nav>div.open span:nth-child(3) {-webkit-transform: translateY(-25px) rotate(315deg); transform: translateY(-12px) rotate(315deg);}
/*menu*/
header>nav>ul {position: absolute; top:70px; width:100%; display: none; width: 100%; background-color: rgba(7,13,19,0.7); z-index: 2;}
header>nav>ul>li {border-bottom: 1px dotted #ccc; width:100%; text-align: left; line-height: 40px;}
header>nav>ul>li:last-child{border-bottom: none;}
header>nav>ul>li>a{display: block; padding: 1.5%; text-indent: 1em;}
header>nav>ul>li>a:link{color:#fff;}
header>nav>ul>li>a:visited{color:#fff;}
header>nav>ul.open {display: block;}
.smp{display: block;}
.pc {display: none;}
}