@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900&display=swap&subset=japanese');

html,body{width:100%;}
body{font-family:'Noto Sans JP', sans-serif;}
header{width:100%; background-color:#453d37; height:80px;}
header>nav{width:1080px; margin-left: auto; margin-right: auto; position: relative;}
header>nav>h1{float:left;width: 180px; text-align: left; margin-right: 15px;}
header>nav>h1>a{margin-top: 13px; display: block;}
header>nav>h1>a>img{width:100%;}
header>nav>ul.main-menu>li.only-sp { display: none; }
header>nav>ul.main-menu{float:left;width:730px;text-align: left; font-size: 0; padding-top: 7px;}
header>nav>ul.main-menu>li{display: inline-block; font-size: 14px; color: #ffffff; text-align: center;}
header>nav>ul.main-menu>li.only-pc{width: 9%; margin: 25px 10px;}
header>nav>ul.main-menu>li.list-01{width: 10%;}
header>nav>ul.main-menu>li.list-03{width: 11%;}
header>nav>ul.main-menu>li.list-04{width: 13%;}
header>nav>ul.main-menu>li.list-06 {
	width: 150px;
	height: auto;
}
header>nav>ul.main-menu>li img {
	width: 100%;
	height: auto;
}
header>nav>ul.main-menu>li:last-child{margin-right: 0;}
header>nav>ul.main-menu>li>a{color: #fff;text-decoration: none;font-weight: bold;}
/*
header>nav>ul.main-menu>li.list-01>a>span {
	display: block;
	font-size: 12px;
}
*/
header>nav>ul.contact-menu{
	position: absolute;
	top: 0;
	right: 0;
}
header>nav>ul.contact-menu li {
	width: 90px;
	height: auto;
	float: left;
	margin: 0;
	padding: 0;
}
header>nav>ul.contact-menu li img {
	width: 100%;
	height: auto;
}
.smp{display: none;}

div.pagetop {position:fixed; right:20px; display:none; text-decoration:none; font-weight:bold; width:60px; height:60px; cursor: pointer; z-index: 2;}
div.pagetop img {
	width: 100%;
	height: auto;
}
div.pagetop:before {position:absolute; top:10px; left:0; width:100%;}
div.pagetop:hover {opacity:0.7;}

footer{ background: #ffffff; }
footer#footer .footer-top {
	width: 100%;
	height: auto;
	background-color: #eadac1;
	padding: 20px 0;
}
footer#footer .footer-top .main-title {
	width: 20%;
	height: auto;
	margin: 0 auto;
}
footer#footer .footer-top .main-title img {
	width: 100%;
	height: auto;
}
footer#footer .footer-top ul.footer-menu {
	width: 850px;
	margin: 0 auto;
	text-align: center;
}
footer#footer .footer-top ul.footer-menu>li{width: 8%; display: inline-block; font-size: 14px; text-align: center; margin: 15px 10px;}
footer#footer .footer-top ul.footer-menu>li.list-01{width:9%;}
footer#footer .footer-top ul.footer-menu>li.list-03{width:10%;}
footer#footer .footer-top ul.footer-menu>li.list-04{width:12%;}
footer#footer .footer-top ul.footer-menu>li.list-06{width:13%;}
footer#footer .footer-top ul.footer-menu>li:last-child{margin-right: 0;}
/*
footer#footer .footer-top ul.footer-menu>li.list-01>a>span {
	display: block;
	font-size: 12px;
}
*/
footer#footer .footer-top ul.footer-menu>li img {
	width: 100%;
	height: auto;
}
footer#footer .footer-top a,
footer#footer .footer-top a:visited,
footer#footer .footer-top a:active {
	color: #453d37;
	text-decoration: none;
}
footer#footer .footer-bottom {
	width: 100%;
	height: auto;
	background-color: #453d37;
	padding: 20px 0;
}
footer#footer .footer-bottom .c-right {
	color: #ffffff;
	text-align: center;
	font-size: 0.8em;
}

@media screen and (max-width: 768px) {
/*header*/
header{width:100%; background-color:#453d37; height:70px; position: fixed; z-index: 6;}
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:120px; margin-top: 0; margin-left: 5%; max-width: 120px;}
header>nav>h1>a>img{width: 120px; height: 32px;}
/*navi*/
header>nav>ul.main-menu{width:100%;text-align: center; font-size: 0;}
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: #fff; 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.contact-menu {display: none;}
header>nav>ul.main-menu>li { margin: 0; }
/*
header>nav>ul.main-menu>li.list-01>a>span.only-pc { display: inline-block; }
*/
header>nav>ul.main-menu>li.only-pc { display: none; }
header>nav>ul.main-menu>li.only-sp { display: inline-block; }
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;}
footer#footer .footer-top .main-title {
	width: 40%;
	margin: 0 auto 20px;
}
footer#footer .footer-top ul.footer-menu {
    width: 100%;
    margin: 0 auto 20px;
}
footer#footer .footer-top ul.footer-menu>li {
    width: 21%;
    display: inline-block;
    font-size: 14px;
    text-align: center;
    margin: 3% 2%;
}
footer#footer .footer-top ul.footer-menu>li.list-01{width:23%;}
footer#footer .footer-top ul.footer-menu>li.list-03{width:25%;}
footer#footer .footer-top ul.footer-menu>li.list-04{width:31%;}
footer#footer .footer-top ul.footer-menu>li.list-06{width:32%;}

}