@charset "Shift_JIS";

*{
	margin:0;
	padding:0;
	font-weight: normal;
}

body{
	font-size: 20px;
	color: #133456;
	letter-spacing:1px;
	background: #fff;
	font-family: 'Noto Sans JP', sans-serif;
	overflow-x:hidden;
}


* html body {background: #fff;}
*+first-child:html body {}

a img{border:none;}
a{color: #133456;text-decoration:none;}
a:hover{font-weight: bold;}
.clear{clear:both;}
a:hover img{filter:alpha(opacity=70);-moz-opacity: 0.7;opacity: 0.7;}

.ImgRight{ float:right;}
.ImgLeft{ float:left;}


.text_center{text-align:center;}
.text_right{text-align:right;}
strong{font-weight: bold;}
.mt5{margin-top:5px;}
.mt30{margin-top:30px;}
.mb150{margin-bottom:150px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}
.mr20{margin-right:20px;}
.mt20{margin-top:20px;}
.pt200{padding-top:200px;}
.mb20{margin-bottom:20px;}
.mr10{margin-right:10px;}
.ml30{ margin-left:30px;}
.mb5{margin-bottom:5px;}
.mb30{margin-bottom:30px;}
.left{ float:left;}
.right{ float:right;}

/* clearfix */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.clear_both {clear:both;}


.sp{display: none;}
.pc{display: block;}
p{margin-bottom: 20px;}
p.topText{font-size:40px; text-align: center; color: #FFF; background-color: rgba(255,39,72,1.00); font-weight: bold; padding: 10px 0; margin-bottom:20px; letter-spacing: 5px;}

.wrap{width:100%;}
.wrap img{max-width: 100%;}
.header{width:100%; max-width: 750px; overflow: hidden; margin: 0 auto 0px;}
.header p{margin-bottom: 0;}
.header h1{width:45%; max-width: 300px; float: left; margin-bottom: 20px;}
.header h1 img{width:180px;}
.header h1 .title{font-size: 30px; display: block; font-weight: bold; letter-spacing:20px; text-align-last:right;}
.header h1 .driver{text-align: right; font-size: 14px; display: block; padding-right: 20px;}

.header .contact{display: inline-block; float: right; max-width:280px; font-size: 0;}
.header .contact a{font-weight: bold;}
.header .contact .lst{font-size: 10px; display: inline-block; vertical-align: middle; width:58%;}
.header .contact .rst{font-size: 10px; display: inline-block; vertical-align: middle; width:38%; text-align: right;}
.header .contact .phone{ clear: both; font-size: 30px; font-weight: bold; letter-spacing: 2px; white-space: nowrap; text-align: right; margin-bottom: 2px; line-height: 120%;}
.header .contact .mail{font-size: 20px; font-weight: bold; letter-spacing: 1px; white-space: nowrap; margin-bottom: 5px; text-align: right; line-height: 120%;}
.header .contact .fb{width:25%; max-width:30px; float: right;}
.header .nav{clear: both; background-color: rgba(255,39,72,1.00); padding-left: 2.5%; box-sizing: border-box; width:100%; overflow: hidden;}
.header .nav li{ list-style: none; width:19.5%; float: left; border-left: 1px solid #FFF; margin: 0; padding: 0;}
.header .nav li a{color: #FFF; font-size:16px; text-align: left; padding: 5px 10px; display: block; box-sizing: border-box; width:100%;}
.header .main {margin-bottom: 5%;}
.header .main p{font-size: 10px; text-align: right; letter-spacing: 0;}




.cBlock{width:90%; max-width: 680px; margin: 0 auto 12%; font-size: 0; clear: both;}
.cBlock p{font-size: 16px;}
.cBlock h2{text-align: center; font-size: 40px; margin-bottom: 20px; }
.cBlock .read{text-align:left; font-size: 30px; margin-bottom: 10px; font-weight: bold;}

#use .an{font-size: 10px;}

#spec .lBox{display: inline-block; vertical-align: middle;width:55%;}
#spec .lBox h2{ text-align: left;}
#spec .rBox{display: inline-block; vertical-align: middle; width:40%; margin-left: 3%;}

#driver .lBox{display: inline-block; vertical-align: middle;width:20%; margin-right: 5%;}
#driver .rBox h2{ text-align: left;}
#driver .rBox{display: inline-block; vertical-align: middle; width:74%;}
#driver .name{text-align: right; margin-top: -20px;}

.serviceBox{width:31%; max-width:240px; display: inline-block;   margin: 1%; overflow: hidden; padding: 4% 0 18%; background-color:rgba(19,52,86,1.00); border-radius: 20px; }
.serviceBoxA{background-image: url("../images/ex1.svg");}
.serviceBoxB{background-image: url("../images/ex2.svg");}
.serviceBoxC{background-image: url("../images/ex3.svg");}
.serviceBoxD{background-image: url("../images/ex4.svg");}
.serviceBoxE{background-image: url("../images/ex5.svg");}
.serviceBoxF{background-image: url("../images/ex6.svg");}
.serviceBox img{}

.serviceBox:hover img{transform: scale(1.2,1.2); transition: 0.2s; }


.footer{width:100%; overflow: hidden; margin: 0 auto 0px; background-image: url("../images/foot.svg"); background-size: contain; padding-top: 10%; background-color:#133456; background-repeat:repeat-x; background-position: top; padding-bottom: 30px; }

.footer footer{width:90%; max-width: 750px; margin: auto; overflow: hidden; margin-bottom: 0}
.footer p{margin-bottom: 0; color: #FFF;}
.footer .footLogo{display: inline-block;max-width: 300px; float: left; margin-bottom: 20px;}
.footer .footLogo img{width:180px;}
.footer .footLogo .title{font-size: 30px; display: block; font-weight: bold; letter-spacing:20px; text-align: justify;}
.footer .footLogo .driver{text-align: right; font-size: 14px; display: block; padding-right: 20px;2.1vw}


.footer .contact{display: inline-block;float: right; max-width:280px; font-size: 0;}
.footer .contact a{color: #FFF!important; font-weight: bold;}
.footer .contact .lst{font-size: 12px; display: inline-block; vertical-align: middle; width:58%;}
.footer .contact .rst{font-size: 12px; display: inline-block; vertical-align: middle; width:38%; text-align: right;}
.footer .contact .phone{ clear: both; font-size: 30px; font-weight: bold; letter-spacing: 5px; white-space: nowrap;}
.footer .contact .mail{font-size: 20px; font-weight: bold; letter-spacing: 3px; white-space: nowrap; margin-bottom: 5px;}
.footer .contact .fb{width:25%; max-width:30px; float: right;}

.demo001{max-width: 120px; text-align: right; width:20%; float: right; font-size: 10px ;text-align: center; overflow: hidden; margin-bottom: -50px; letter-spacing: 0; }
.demo001 img{max-width: 45px;width:60%; overflow: hidden; }








@media only screen and (max-width: 750px) {
.wrap{overflow: hidden!important; width:100%;}
.sp{display: block;}
.pc{display:none;}
p{margin-bottom: 5%;}

p.topText{font-size:5vw;padding: 2% 0; margin-bottom:3%; letter-spacing: 0vw;}
.header h1{margin-left: 5%;}
.header h1 .title{font-size: 4.9vw; letter-spacing: 2.1vw; white-space: nowrap;text-align: right;}
.header h1 .driver{font-size: 2.2vw; text-align: right; padding-right: 2vw;}
.header .contact{ display: inline-block;margin-right: 5%;}
.header .contact .lst{font-size: 1.5vw;width:48%; white-space: nowrap;}
.header .contact .rst{font-size: 1.5vw;width:50%;}
.header .contact .phone{font-size: 4.5vw; text-align: right; letter-spacing: 0.2vw;}
.header .contact .mail{font-size: 3vw; text-align: right; letter-spacing: 0;}

.header .nav li a{ font-size:2.7vw; padding:10% 4%; }

.cBlock {}
.cBlock p{font-size: 3.2vw; line-height: 120%; letter-spacing: 0!important;}
.cBlock h2{font-size: 6vw!important; margin-bottom: 5%;}
.cBlock .read{font-size: 4.5vw; margin-bottom: 5%;}

#spec .lBox{display: inline-block; vertical-align: middle;width:55%;}
#spec .lBox h2{ text-align: left;}
#spec .rBox{display: inline-block; vertical-align: middle; width:40%;}


#driver .lBox{vertical-align: middle;width:28%; margin-right: 5%;}
#driver .rBox{display: inline-block; vertical-align: middle; width:66%;}



.footer{background-size:auto 100%; padding-top: 25%; background-position: top;}

.footer footer{width:90%; max-width: 750px; margin: auto; overflow: hidden; margin-bottom: 0;}
.footer p{margin-bottom: 0; color: #FFF;}

.footer .footLogo .title{font-size: 4.9vw; letter-spacing: 2.1vw; white-space: nowrap;text-align: right;}
.footer .footLogo .driver{font-size: 2.2vw; text-align: right; padding-right: 2vw;}
.footer .contact{ display: inline-block;}
.footer .contact a{color: #FFF!important; font-weight: bold;}
.footer .contact .lst{font-size: 1.5vw;display: inline-block; white-space: nowrap; float: left;}
.footer .contact .rst{ display: inline-block; float: right; font-size: 1.5vw;}
.footer .contact .phone{font-size: 4.5vw; text-align: right; letter-spacing: 0.5vw;}
.footer .contact .mail{font-size: 3vw; text-align: right; letter-spacing: 0;}




}