@charset "UTF-8";
/* CSS Document */

img { width: auto; max-width: 100%; height: auto;}
.comingSoon { cursor: default;}

#header { }
#headerBox { display: block; width: 100%; box-sizing: border-box; padding: 0 20px; max-width: 1000px; margin: 0 auto; }
#headerBox h1 { font-size: 10px; line-height: 1.2em; margin: 0 0 10px 0;}
#headerBox h2 { width: 36.97%; float: left; }
#headerBox .btnBox { padding: 0.52% 0; width:38.54%;  line-height: 1; float: right;}
#headerBox .btnBox ul {}
#headerBox .btnBox ul li { width: 48.64%; float: left; margin: 0 2.72% 0 0;}
#headerBox .btnBox ul li a { display: block;}
#headerBox .btnBox ul li a:hover { opacity: 0.7; }
#headerBox .btnBox ul li a.comingSoon,
#headerBox .btnBox ul li a.comingSoon:hover { opacity: 0.2;}
#headerBox .btnBox ul li:last-of-type {margin: 0; }

#gNavi { background: #ef8754; line-height: 1; }
#gNavi ul { display: block; width: 100%; box-sizing: border-box; padding: 0 20px; max-width: 1000px; margin: 0 auto;}
#gNavi ul li { display: block; width: 12.5%; background: #fff; float: left;}
#gNavi ul li a { display: block; background: #ef8754; padding: 8.33% 0; position: relative;}
#gNavi ul li a:hover { display: block; opacity: 0.7;}
#gNavi ul li a:before { width: 1px; left: -0.5px; top:25%; height: 50%; content: ''; position: absolute; background: #fff;}
#gNavi ul li a:after { width: 1px; right: -0.5px; top:25%; height: 50%; content: ''; position: absolute; background: #fff;}
#gNavi ul li a.comingSoon,
#gNavi ul li a.comingSoon:hover { opacity: 1; }
#gNavi ul li a.comingSoon img,
#gNavi ul li a.comingSoon:hover img{ opacity: 0.2; }
/* #gNavi ul li:nth-of-type(5) { display:none; } */

#content { margin: 0 auto 0 auto; }


#footerBnr { padding: 65px 0; }
#footerBnr ul { display: block; width: 100%; box-sizing: border-box; padding: 0 20px; max-width: 1000px; margin: 0 auto; }
#footerBnr ul li { width: 48.43%; float: left;}
#footerBnr ul li:last-of-type { float: right;}
#footerBnr ul li a { display: block;}
#footerBnr ul li a:hover { opacity: 0.7; }
#footerBnr ul li a.comingSoon,
#footerBnr ul li a.comingSoon:hover { opacity: 0.2;}
#footer { background: #fff0da; }
#footerBox { display: block; width: 100%; box-sizing: border-box; padding: 20px; max-width: 1000px; margin: 0 auto; }
#footerBox .logoBox { width: 28.85%; float: left;}
#footerBox .telBox { width: 64.47%; float: right;}
#copyright { background: #ef8754; }
#copyright address { display: block; width: 100%; box-sizing: border-box; padding: 0.5em 20px; max-width: 1000px; margin: 0 auto; font-size: 10px; text-align: center; color: #fff;}

#footerSpBnr { display:none; background:#00b7ee; position:fixed; bottom:0; left:0; width:100%; margin:0; padding:0; z-index:99999999; }
#footerSpBnr ul { width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; }
#footerSpBnr ul li { margin:0; }
#footerSpBnr ul li:nth-of-type(1)  { flex-grow:0; flex-shrink:1; flex-basis:40%; }
#footerSpBnr ul li:nth-of-type(2)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li:nth-of-type(3)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li:nth-of-type(4)  { flex-grow:0; flex-shrink:1; flex-basis:20%;}
#footerSpBnr ul li a,
#footerSpBnr ul li a:hover { display:block;  text-align:center; line-height:1; }
#footerSpBnr ul li a img { width:100%; height:auto; }

@media screen and (max-width:768px) {
	#headerBox { padding: 10px 20px;}
	#headerBox h1 { display: none;}
	
	#gNavi ul li { width: 25%;}
	#gNavi ul li:nth-of-type(4n+1) { clear: both;}
	
	#footerBnr {  padding: 6.71% 0; }
	#footerBnr ul li { width: 100%; float: none; margin: 0 0 10px 0;}
	#footerBnr ul li:last-of-type { margin: 0; float: none;}
	
	#footerBox .logoBox { width: 44.74%; float: none; margin: 0 auto 10px auto;}
	#footerBox .telBox { width:100%; float: none;}
	
	#footerSpBnr { display:block; }
	#footer { padding:0 0 20% 0; }
}