/*
Theme Name: YOKOTA 2019
Version: 1.0
Author: Manae Ohigashi
*/
@charset "UTF-8";
/**********************************************************************
				RESET
**********************************************************************/
* { font-family: "Microsoft YaHei", sans-serif;}
html, body { width: 100%; height: 100%;}
/*-- RESET STYLE --*/
html,body,div,span,
applet,object,iframe,
h2,h1,h2,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,
dd,dl,dt,li,ol,ul,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: normal;
	font-style: normal;
	font-size: 16px;
	}
table {
	border-collapse: collapse;
	border-spacing: 0;
	}
ol,ul,li {
	list-style: none;
	}
q:before,q:after,
blockquote:before,blockquote:after {
	content: "";
	}
h2,h1,h2,h4,h5,h6,strong,h2 em,h1 em, h2 em,h4 em,h5 em,h6 em,strong em,h2 a,h1 a,h2 a,h4 a,h5 a,h6 a {
	font-weight: bold;
	}
h2{font-size: 26px;margin:10px; }
        
* {
	box-sizing: border-box;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-ms-box-sizing: border-box;
		-o-box-sizing: border-box;
}
button:focus { outline: none;}
input[type="button"],
input[type="submit"] {
    -webkit-appearance: none;
    border: 0;
}
a {
  color: inherit;
  text-decoration: none; /* 可选，移除下划线 */
}
input:focus,
textarea:focus,
select:focus { outline: none;}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #4e4e4e inset;
    -webkit-text-fill-color: #fff;
}
input::placeholder { color: #ababab;}
select { cursor: pointer;}
/* clear */
ul:after,
ol:after {
    content: ".";
    clear: both;
    display: block;
    font-size: 0.1em;
    height: 0.1px;
    line-height: 0;
    visibility: hidden;
    width: 0.1px;
} 
.clear { clear:both;}
/* forIE clear */
.clear {
    clear: both;
    height: 0.1px;
    margin: 0px;
    padding: 0px;
    width: 0.1px;
}
a img,
a:hover img { backface-visibility: hidden; zoom: 1;}
button {
        background-color: transparent;
        border: none;
        cursor: pointer;
        outline: none;
        padding: 0;
        appearance: none;
}
/**********************************************************************
				BASE
**********************************************************************/
body {
    background-color: #fff;
    color: #00133e;
    font-size: 14px;
    line-height: 28px;
    overflow-x: hidden;
}
h1, h2, h3, h4, h5 { font-weight: normal;}
img { width: 100%; height: auto; display: block;}
.floatL { float: left; left: 0;}
.floatR { float: right; right: 0;}
.PCnone { display: none!important;}
/*-- TEXT SIZE --*/
.fontS { font-size: 12px;}
.fontM { font-size: 16px; letter-spacing: 0;}
.fontL { font-size: 33px; letter-spacing: 0.1rem;}
/*-- TEXT STYLE --*/
.fontJP { font-family: "Microsoft YaHei", serif;}
.fontEN { font-family: 'Microsoft YaHei', serif; font-style: italic; letter-spacing: 0.2rem;}
.fontNM {  font-family: "Microsoft YaHei", sans-serif;}
.bld { font-weight: bold;}
/*-- TEXT ALIGN --*/
.textL { text-align: left!important;}
.textR { text-align: right!important;}
.textC { text-align: center!important;}
/*-- TEXT COLOR --*/
.clrWH { color: #fff;}
.clrNV { color: #3a4567;}
.clrR { color: #e73828;}
/*-- ANIMATION --*/
ul.slimmenu li a,
.moreBtn .btnTxt,
.footNav ul li a,
.fade, a img, input[type="submit"] {
    text-decoration: none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    transition: all  0.3s ease;
}
/*-- BASE DECO --*/
.mainCnt { width: 80%; max-width: 1400px; margin: 0 auto;}
.cntBox {
    background-color: #fff;
    padding: 40px 3%;
    border-radius: 3px;
    color: #06163c;
}
.cntBox .title {
    font-size: 22px;
    font-family: "Microsoft YaHei", serif;
    letter-spacing: 0.1rem;
    color: #06163c;
    display: inline-block;
    position: relative;
    margin-bottom: 50px;
}
.cntBox .title:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -20px;
    display: inline-block;
    width: 50px;
    height: 2px;
    background-color: #d22b1a;
}
.secTitle { font-size: 25px; letter-spacing: 0.1rem; margin-bottom: 50px; text-align: center;}
/*-- LINK --*/
a { text-decoration: none;}
.moreBtn {
    position: relative;
    color: #d22b1a;
    font-size: 20px;
    letter-spacing: 0.1rem;
    display: block;
    padding-right: 50px;
    background-image: url('images/btnArrowR.svg');
    background-repeat: no-repeat;
    background-position: top 8px right;
    background-size: 50px;
    margin: 40px 0 0;
    display: inline-block;
}
.moreBtn .btnTxt {
    color: #d22b1a;
    font-size: 20px;
    letter-spacing: 0.1rem;
    background-color: #fff;
    display: inline-block;
    padding: 0 15px 0 0;
    position: relative;
    left: 0;
}
.moreBtn:hover .btnTxt { left: 20px;}
.moreBtn.bdr {
    padding: 12px 70px 12px 25px;
    border: 1px #d22b1a solid;
    background-position: top 20px right 20px;
    background-color: #fff;
}
.moreBtn.bdr .btnTxt { font-size: 17px;}
.moreBtn.redBG { background-color: #d22b1a; background-image: url('images/btnArrowWH.svg');}
.moreBtn.redBG .btnTxt { color: #fff; background-color: #d22b1a;}
.moreBtn.bdr.blue { border: 1px #001b59 solid; background-image: url('images/btnArrowBL.svg');}
.moreBtn.bdr.blue .btnTxt { color: #001b59;}
#pageCatch {
    width: 100%;
    height: 350px;
    background-color: #f1f1f1;
    background-image: url('images/pageCatch.jpg');
    background-repeat: no-repeat;
    background-size: auto 390px;
    background-position: left -100px center;
    display: table;
    padding: 0 50px 0 600px;
}
#pageCatch .title {
    visibility: hidden;
    display: table-cell;
    vertical-align: middle;
    font-size: 35px;
    letter-spacing: 0.3rem;
}
#pageCatch .title span {
    display: block;
    font-size: 18px;
    font-style: inherit;
    margin: -10px 0 10px 6px;
}
.pageSec { padding: 100px 0;}
.pageSecTitle {
    font-size: 28px;
    letter-spacing: 0.1rem;
    font-family: "Microsoft YaHei", serif;
    display: block;
    position: relative;
    margin-bottom: 80px;
    z-index: 100;
}
.pageSecTitle:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -30px;
    display: inline-block;
    width: 50px;
    height: 2px;
    background-color: #d22b1a;
}
/**********************************************************************
				HEADER
**********************************************************************/
header {
    width: 100%;
    background-color: #fff;
    padding: 25px 5%;
}
header h1 { height: 55px;}
ul.slimmenu { width: calc(100% - 350px); text-align: right;}
ul.slimmenu li {
    float: none;
    background-color: transparent;
    border: 0;
}
ul.slimmenu li a {
    padding: 12px;
    color: #06163c;
     
    font-size: 18px;
}
ul.slimmenu li a:hover { background-color: #fff; color: #D22B1A;}
ul.slimmenu li.recruitBnt { margin-left: 10px;}
ul.slimmenu li.recruitBnt a {
    color: #fff;
    padding: 7px 10px 8px 12px;
    background-color: #d22b1a;
    border-radius: 3px;
}
ul.slimmenu li.recruitBnt a:hover { background-color: #ea433b;}
ul.slimmenu li.recruitBnt a img {
    width: 20px;
    display: inline-block;
    margin-left: 7px;
    vertical-align: -2px;
}
ul.slimmenu li .sub-toggle { display: none;}
ul.slimmenu li>ul {
    width: 250px;
    background-color: transparent;
    left: 50%;
    margin-left: -125px;
    padding: 14px 0 0 0;
    text-align: left;
    background-image: url('./san.png');
    background-size: auto 15px;
    background-repeat: no-repeat;
    background-position: center top;
    margin-top: 0;
}
ul.slimmenu li>ul li { background-color: #06163c; width: 100%;}
ul.slimmenu li>ul li.fst { padding-top: 20px;}
ul.slimmenu li>ul li.lst { padding-bottom: 20px;}
ul.slimmenu li>ul li a {
    color: #fff;
    text-align: left;
    display: block;
    width: 100%;
    padding: 7px 25px;
}
ul.slimmenu li>ul li a:hover { background-color: #19326a; color: #fff;}

/**********************************************************************
				FOOTER
**********************************************************************/
#PageTopBtn {
    position: fixed;
    bottom: 90px;
    right: 20px;
    z-index: 9999;
}
#PageTopBtn a {
    display: block;
    width: 50px;
    height: 50px;
    background-color: #d22b1a;
    background-image: url('images/btn-pagetop.svg');
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: center center;
    opacity: 0;
}
#PageTopBtn.show-pagetopBtn a { opacity: 1;}
#footContact {
    background-color: #f1f1f1;
    position: relative;
    background-image: url('images/contactBG.svg');
    background-repeat: no-repeat;
    background-position: left 10% center;
    background-size: auto 110%;
}
#footContact .mainCnt { padding: 8% 0 6%;}
#footContact .cnt {
    width: calc(100% - 400px);
    float: left;
    padding-left: 25%;
}
#footContact .cnt .title {
    font-size: 50px;
    display: inline-block;
    position: relative;
    margin-bottom: 80px;
}
#footContact .cnt .title:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -30px;
    display: inline-block;
    width: 50px;
    height: 2px;
    background-color: #d22b1a;
}
#footContact .moreBtn, #footContact .moreBtn .btnTxt { background-color: #f1f1f1;}
footer {
    background-color: #d22c1b;
    color: #f1f1f1;
    padding: 5% 0 30px;
    text-align: center;
    font-size: 11px;
    line-height: 21px;
}
footer img { width: 80px; margin: 0 auto 20px;}
.footNav { padding: 0 5%; margin-top: 3%;}
.footNav ul { width: calc(100% - 300px); text-align: right;}
.footNav ul li { display: inline-block; margin: 0 10px;}
.footNav ul li a { color: #ffe3e3; font-size: 12px;}
.footNav ul li a:hover { color: #fff;}
.footNav p { width: 300px; text-align: left;}
/**********************************************************************
				TOP
**********************************************************************/
#topKV {
    width: 100%;
    height: 80vh;
    min-height: 600px;
    background-color: #000;
    position: relative;
    display: table;
}
#topKV .cnt {
    padding: 0 10%;
    display: table-cell;
    vertical-align: middle;
    position: relative;
    z-index: 10;
    text-shadow: 1px 2px 7px #444;
}
#topKV .cnt .catch {
    font-size: 40px;
    line-height: 80px;
    color: #fff;
    margin-top:  50px;
}
#topKV .cnt .catch span { margin-right: 30px;}
#topKV .cnt .sub {
    font-size: 28px;
    color: #fff;
    margin: 40px 0 25px 30px;
}
#topKV .cnt .txt {
    color: #fff;
    margin-left: 30px;
}
#slide_wrapp {
    position: absolute;
    overflow: hidden;
    z-index: 9;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.9;
}
#slide_wrapp .slide_item {
  opacity: 0;
  transform: scale(1);
  transition: opacity 2s linear, transform 7.5s linear;
  position: relative;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
}
#slide_wrapp .slide_item:not(:first-child) { position: absolute; top: 0; left: 0;}
#slide_wrapp .slide_item.show_ { opacity: 1;}
#slide_wrapp .slide_item.zoom_ { transform: scale(1.1);}
#slide_wrapp .slide_item img { display: block;}
#topIntro { background-color: #f1f1f1; padding-bottom: 5%;}
#topIntro .cntBox {
    width: 31.33%;
    margin-top: -50px;
    margin-right: 3%;
    position: relative;
    z-index: 10;
	min-height: 390px;
}
#topIntro .cntBox.floatR { margin-right: 0;}
#topIntro .cntBox span {
    color: #D22B1A;
    font-size: 18px;
    letter-spacing: 0.1rem;
    line-height: 25px;
    text-align: left;
    width: 100%;
    display: block;
    margin: 0 0 10px 0;
    height: 40px;
}
#topIntro .moreBtn { float: right;}
#topAbout {
    width: 100%;
    min-height: 450px;
    padding: 8% 0;
    background-image: url('./women.jpg');
    background-repeat: no-repeat;
    background-size: auto 700px;
    background-position: left -100px top -40px;
    background-color: #fafafa;
}
#topAbout .cnt { width: calc(100% - 600px); float: right;}
#topAbout .cnt .title { font-size: 25px; line-height: 33px; margin: 40px 0;}
#topClient {
    background-color: #06163c;
    background-image: url('./hangye.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 8% 0;
}
#topClient .clientList li {
    display: inline-block;
    vertical-align: top;
    width: 22.7%;
    margin: 1%;
    padding: 3%;
    font-size: 12px;
    line-height: 20px;
}
#topClient .clientList li .title { font-size: 20px; margin-top: 10px; letter-spacing: 0;}
#topClient .clientList li .moreBtn { float: right;}
#topRecruit { position: relative;}
#topRecruit .cnt {
    width: 500px;
    margin: 0 auto;
    padding: 6% 0;
    text-align: center;
}
#topRecruit .cnt img {
    width: 80%;
    max-width: 300px;
    margin: 0 auto;
    margin-bottom: 30px;
}
#topRecruit .bg {
    width: calc(50% - 250px);
    max-width: 650px;
    height: 100%;
    position: absolute;
    top: 0;
    background-position: top right;
    background-repeat: no-repeat;
    background-size: 105% auto;
}
#topRecruit .bg2 { background-position: top left;}
/**********************************************************************
				ABOUT US
**********************************************************************/
#concept .mainCnt { position: relative; padding: 60px 0 0;}
#concept .cnt {
    font-size: 24px;
    line-height: 45px;
    width: 50%;
    position: relative;
    z-index: 10;
    padding: 60px;
}
#concept .image {
    position: absolute;
    width: 65%;
    height: 100%;
    background-image: url('images/aboutus/bg01.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    top: 0;
    right: 0;
    z-index: 1;
}
#greeting {
    background-color: #f1f1f1;
    background-image: url('images/aboutus/img01.png');
    background-repeat: no-repeat;
    background-size: auto 900px;
    background-position: left 15% bottom;
    position: relative;
    padding-bottom: 60px;
}
#greeting .name {
    font-weight: bold;
    font-size: 16px;
    text-align: right;
    margin-top: 30px;
    display: block;
}
#greeting .name small {font-size: 12px; line-height: 15px; display: block;}
#greeting .cnt {
    width: calc(100% - (15% + 300px));
    float: right;
    margin-top: -50px;
    font-size: 13px;
    line-height: 26px;
}
#greeting .cnt .catch { font-size: 23px; line-height: 35px; margin-bottom: 35px; margin-left: -100px;}
#company .mainCnt { position: relative;}
.companyList { width: 47%;}
.companyList .cnt {
    width: 100%;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px #dee1e8 solid;
}
.companyList .cnt.last { border-bottom: 0;}
.companyList dt { width: 100px; float: left;}
.companyList dd { width: calc(100% - 130px); float: right;}
#company iframe { width: 100%; height: 40vh; min-height: 300px; margin-top: 60px;}
#office {
    background-color: #06163c;
    background-image: url('images/topClientBG.jpg');
    background-repeat: repeat;
    background-size: 100% auto;
    background-position: top center;
}
#office .pageSecTitle, .pageSecTitle.center { text-align: center; margin-top: 40px;}
#office .pageSecTitle:before, .pageSecTitle.center:before { left: calc(50% - 25px);}
#office .pageSecTitle.second { margin-top: 100px;}

.officeList{
	text-align: left;
    display: flex;
    align-content: space-between;
    flex-wrap: wrap;
}

.officeList li{
	width: calc((100% - 3%) / 2);
	margin-bottom: 3%;
}

.officeList li:nth-child(odd){
	margin-right: 3%;
}

/*.officeList { text-align: left;}
.officeList li { width: 47%; margin: 1%; display: inline-block; vertical-align: top;}*/
.officeList li .moreBtn { float: right;}
/**********************************************************************
				BUSINESS
**********************************************************************/
#business { text-align: center;}
#business .title { font-size: 23px;}
#business .cnt { width: 100%; max-width: 750px; margin: 50px auto 70px;}
.anchor a {
    display: inline-block;
    font-size: 25px;
    letter-spacing: 0.1rem;
    text-align: left;
    padding-right: 50px;
    background-image: url('images/btnArrowRbtm.svg');
    background-repeat: no-repeat;
    background-position: right 20px top;
    background-size: auto 100%;
    margin: 0 3% 30px;
}
.anchor a span {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0;
    display: block;
    margin-top: 5px;
}
.secDeco {
    font-size: 70px;
    position: absolute;
    top: -20px;
    left: 10%;
    z-index: 100;
}
.businessSec { background-color: #f6f6f6; position: relative; margin: 120px 0 100px;}
.businessSec .image {
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
.businessSec .image img {
    width: 120px;
    height: 100%;
    float: left;
}
.businessSec .cnt { position: relative; z-index: 100; width: calc(50% + 60px); margin-top: 40px;}
.businessSec .cnt .sub1 { width: 90%;}
.businessSec .cnt .sub2 { width: 80%; margin-top: 15px;}
#logistics .secDeco { left: inherit; right: 10%;}
#logistics.businessSec .image { right: inherit; left: 0;}
#logistics.businessSec .image img { float: right;}
#logistics.businessSec .cnt { float: right;}
#logistics.businessSec .cnt .sub1,
#logistics.businessSec .cnt .sub2 { float: right; clear: both;}
#logistics.businessSec .cnt .pageSecTitle { width: 90%; float: right;}
/**********************************************************************
			 FOR CLIENTS
**********************************************************************/
#topVision .bg-image-loop {
	width: 100%;
	height: 250px; /* 画像の高さを指定 */
	position: relative;
	background: url("images/clients/vision_loopBG.png") repeat-x 0 0;
	background-size: auto 100%;
	animation: bg-slider 23s linear infinite; /* 23sの部分背景画像の約数だとスムーズ */
	padding: 0;
}
@keyframes bg-slider {
	from { background-position: 0 0; }
    to { background-position: -1518px 0; } /* 1518pxとは使用した背景画像の長さ */
}
#topVision .titleBox {
    width: 40%;
    height: 250px;
    background-color: #fff;
    margin: -250px auto 0;
    position: relative;
    padding: 60px 5%;
    display: table;
}
#topVision .wrap { display: table-cell; vertical-align: middle;}
#topVision .cnt {
    width: 100%;
    max-width: 850px;
    text-align: center;
    margin: 80px auto 0;
    font-size: 15px;
    line-height: 32px;
}
.visionList { margin-top: 50px;}
.visionList li { width: calc((100% - 100px) / 3); float: left; margin-right: 50px;}
.visionList li:nth-child(3) { margin-right: 0;}
.visionList li img { margin-bottom: 30px;}
#vision { background-color: #f6f6f6;}
.clientSec img { width: 48.5%; margin: 0;}
.clientSec .cnt { font-size: 13px; line-height: 24px;}
#newbusiness { background-color: #f6f6f6;}
#newbusiness.clientSec img { margin: 0 0 50px 60px;}
#expansion.clientSec img { width: 350px; margin: 0;}
#expansion.clientSec .cnt { width: calc(100% - 430px);}
#movie { background-color: #f1f1f1;}
#movie iframe { width: 47%; height: 350px; margin-bottom: 30px;}
#topClient.clients .clientList { text-align: center;}
#topClient.clients .clientList li { text-align: left; width: 30%; font-size: 13px;}
/**********************************************************************
			 HISTORY
**********************************************************************/
#topVision.history .cnt { font-size: 14px; line-height: 28px;}
#history { padding-bottom: 60px;}
.historySec img { width: 45%; margin: 0 60px 50px 0;}
.historySec img.floatR { margin: 0 0 50px 60px;}
#history2 { background-color: #f6f6f6;}
.historySec img.text { width: 47%; max-width: 450px; margin-bottom: 40px;}
.historySec img.tate { max-width: 300px; margin-top: 50px;}
/**********************************************************************
			OUR BUSINESS
**********************************************************************/
.businessSec.ourbusiness, .logistics.ourbusiness { margin-bottom: 0;}
#outsourcing2 { background-color: #f6f6f6;}
.halfCnt { width: 45%; text-align: center;}
.businessSec.ourbusiness .cnt .sub1, .businessSec.ourbusiness .cnt .sub2 { font-size: 13px; line-height: 24px;}
.technology { margin-top: 100px;}
.areaList {
    margin-top: 50px;
    text-align: center;
    overflow: hidden;
    height: auto;
    width: 100%;
}
.areaList li {
    background-color: #fff;
    width: 29%;
    margin: 2%;
    border-radius: 5px;
    display: inline-block;
    vertical-align: top;
    padding-bottom: 2000px;
    margin-bottom: -2000px;
}
.areaList li .image {
    width: 100%;
    height: 20vh;
    min-height: 180px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
.areaList li .title { font-size: 22px; padding: 30px 20px 0;}
.areaList li .cnt { padding: 30px; text-align: left; font-size: 13px; line-height: 22px;}
.areaList li .cnt b { display: block; font-size: 15px; margin-bottom: 10px;}
.truckList li { width: 29%; margin: 2%; display: inline-block; vertical-align: top; text-align: center;}
.truckList li .title { font-size: 20px; margin-top: 20px;}
#company.ourbusiness { background-color: #f6f6f6; padding-top: 0;}
#company.ourbusiness .companyList { padding: 0 2%;}
#company.ourbusiness dt { font-weight: bold; font-size: 16px;}
/**********************************************************************
			CONTACT
**********************************************************************/
#contactIntro { text-align: center;}
.cntBox .title.center:before { left: 50%; margin-left: -25px;}
.contactList { margin-top: 60px;text-align: center;}
.contactList li {
    border: 1px #c2c7d4 solid;
    width: 100%;
    margin: 0 0 40px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    padding: 70px 3% 50px;
}
.contactList li .cnt { font-size: 13px; line-height: 20px;}
.contactList li.recruit .cnt { margin-bottom: 5px;}
.telCnt { margin-top: 30px;}
.recruit .title { display: block;}
.recruit .telCnt { display: inline-block; margin-top: 0;}
.telCnt .contactNo {
    display: inline-block;
    font-style: inherit;
    height: 40px;
    line-height: 42px;
    font-size: 35px;
    letter-spacing: 0;
    padding-left: 38px;
    background-image: url('images/contact/telIcon.svg');
    background-repeat: no-repeat;
    background-size: auto 100%;
    margin: 0 20px 20px;
}
.telCnt .contactNo.fax { background-image: url('images/contact/faxIcon.svg'); margin-bottom: 0;}
.bnrCnt { margin-top: 40px;}
.bnrCnt a { display: inline-block; margin: 0 10px; vertical-align: top;}
.bnrCnt .moreBtn { height: 65px; padding: 17px 70px 12px 25px; background-position: top 25px right 20px;;}
.bnrCnt img { height: 65px; width: auto; border: 1px #99bbdb solid;}
#contactForm { background-color: #f1f1f1;}
.formBox { background-color: #fff; padding: 80px 50px 50px; width: 100%; margin: 50px 0;}
.contactForm {
    text-align: left;
    width: 100%;
    max-width: 1050px;
    margin: 20px auto 0;
}
.contactForm .formDiv { width: 48%; padding: 12px 0; position: relative;}
.contactForm .longBox { width: 100%; clear: both;}
.contactForm dt {
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 15px;
}
.contactForm dd { width: 100%;}
input[type="text"],
input[type="email"],
input[type="tel"],
select,
textarea {
    width: 100%;
    padding: 0 10px;
    height: 45px;
    background-color: #f1f1f1;
    border: 1px #D9D9D9 solid;
    border-radius: 2px;
    font-size: 16px;
}
textarea { height: 200px; padding: 10px;}
.single .your-subject input[type="text"] {
    pointer-events: none;
    background-color: #fff3f2;
    border: 0;
}
.hissu {
    font-size: 11px;
    padding: 2px 5px 3px;
    background-color: #d32b1a;
    color: #fff;
    margin-left: 15px;
    vertical-align: middle;
}
.check { text-align: center; margin: 10px 0 20px;}
.contactForm input[type="checkbox"] {
    height: 30px;
    width: 30px;
    vertical-align: middle;
    margin-right: 10px;
    cursor: pointer;
}
.contactForm input[type="submit"] {
    width: 100%;
    max-width: 350px;
    border: 0;
    display: block;
    margin: 30px auto 0;
    background-color: #d32b1a;
    color: #ffffff;
    padding: 20px 10px;
    font-size: 20px;
    font-weight: bold;
    cursor: pointer;
    letter-spacing: 2px;
    font-family: "Microsoft YaHei", serif;
}
.contactForm input[type="submit"]:hover { background-color: #f55f50;}
div.wpcf7-validation-errors,
div.wpcf7-response-output,
div.wpcf7-mail-sent-ok {
    background-color: #ffe7e0;
    color: #d32c1b;
    border: 0!important;
    text-align: center;
    padding: 20px!important;
    font-weight: bold;
    font-size: 18px;
}
div.wpcf7-mail-sent-ok {
    background-color: transparent;
    color: #d32b1a;
    font-size: 20px;
    margin: 30px 0!important;
    font-weight: normal;
}
span.wpcf7-not-valid-tip {
    color: #d32c1b!important;
    position: absolute;
    font-size: 12px!important;
}
.sent .contactForm { display: none;}
.frame_form {
    height: 150px;
    max-width: 900px;
    overflow: auto;
    margin: 30px auto 60px;
    border: 1px #ddd solid;
    padding: 3%;
    background-color: #e7f3ed;
}
.contactForm .notice {
    text-align: center;
    line-height: 23px;
    margin: 20px 0;
}
.ajax-loader {
    width: 50px!important;
    height: 50px!important;
    margin: 20px auto 0!important;
    display: block!important;
    background-repeat: no-repeat;
    background-size: cover;
}
.formBox a { text-decoration: underline; color: #d22c1b;}
/**********************************************************************
			PRIVACY
**********************************************************************/
#privacy .pageSecTitle { margin-bottom: 60px; font-size: 24px;}
#privacy .pageSecTitle.second { margin-top: 100px;}
/****************************************  TB (1200px↓) ****************************************/
@media screen and (max-width:1200px) {
/*-------- BASE --------*/
body { font-size: 13px; line-height: 25px;}
.moreBtn { margin: 30px 0 0;}
.secTitle { font-size: 22px; margin-bottom: 40px;}
.cntBox .title { font-size: 18px; letter-spacing: 0;}
#pageCatch {
    height: 250px;
    background-size: auto 270px;
    background-position: left -80px center;
    padding: 0 50px 0 420px;
}
.pageSecTitle { font-size: 24px;}
.pageSec { padding: 70px 0;}
/*-------- HEADER --------*/
header { padding: 20px 3%;}
header h1 { width: 200px; margin-top: 8px;}
ul.slimmenu { width: calc(100% - 250px);}
/*-------- TOP --------*/
#topKV { min-height: 500px;}
#topKV .cnt .catch { font-size: 60px; line-height: 60px;}
#topKV .cnt .sub { font-size: 23px; margin: 20px 0 15px 30px;}
#topKV .cnt .txt { line-height: 22px;}
#topAbout {
    min-height: 350px;
    padding: 5% 0 7%;
    background-size: auto 100%;
    background-position: left -80px top;
}
#topAbout .cnt { width: calc(100% - 350px);}
#topAbout .cnt .title { font-size: 22px; margin: 30px 0;}
#topClient .clientList li { width: 47.5%; padding: 5%;}
#topRecruit .cnt { width: 350px;}
#topRecruit .cnt img { width: 70%;}
#topRecruit .bg { width: calc(50% - 175px);}
#footContact { background-position: left 5% center;}
#footContact .cnt { width: calc(100% - 320px); padding-left: 5%;}
#footContact .cnt .title { font-size: 40px; margin-bottom: 60px;}
/*-------- ABOUT US --------*/
#concept .cnt {
    font-size: 18px;
    line-height: 32px;
    width: 55%;
    padding: 50px;
}
/*-------- FOR CLIENTS --------*/
#movie iframe { height: 250px;}
/*-------- OUR BUSINESS --------*/
.areaList li { width: 45%; padding-bottom: 0; margin-bottom: 0;}
/*-------- CONTACT --------*/
.formBox { padding: 50px 40px 40px;}
}
/****************************************  SP (1024px↓) ****************************************/
@media screen and (max-width:1024px) {
/*-------- BASE --------*/
.PCnone { display: block!important;}
.SPnone { display: none!important;}
.fontL { font-size: 19px; letter-spacing: 0.1rem;}
.button { margin: 30px 0 0; font-size: 16px; padding: 15px 50px 15px 25px;}
.mainCnt { width: 85%;}
.cntBox .title { width: 100%;}
.call { text-decoration: underline; color: #d22b1a;}
#pageCatch {
    height: 150px;
    background-size: auto 150px;
    background-position: left -130px center;
    padding: 0 30px 0 130px;
    margin-top: 55px;
}
#pageCatch .title { font-size: 26px; letter-spacing: 0.2rem;}
#pageCatch .title span { font-size: 13px; margin: -10px 0 5px 6px;}
.pageSec { padding: 50px 0;}
.pageSecTitle { font-size: 22px; margin-bottom: 60px;}
.pageSecTitle:before { bottom: -20px;}
/*-------- HEADER --------*/
header { position: fixed; z-index: 9999; padding: 0; top: 0;}
header h1 { width: 180px; margin: 15px 20px;}
.menu-collapser {
    background-color: transparent;
    text-indent: -9999px;
    width: calc(100% - 250px);
    float: right;
}
.collapse-button, .collapse-button:hover, .collapse-button:focus {
    background-color: transparent;
    right: 20px;
    top: 30px;
    width: 45px;
}
.collapse-button .icon-bar { width: 25px; margin: 5px 0; background-color: #06163c;}
ul.slimmenu {
    width: 100%;
    background-color: #d22c1b;
    text-align: center;
    color: #fff;
    padding: 30px 30px 40px;
    margin-bottom: -1px;
}
ul.slimmenu li a { color: #fff; padding: 15px 0;}
ul.slimmenu.collapsed li a { border-bottom: none;}
ul.slimmenu.collapsed li a:hover { color: #fff; background-color: #d22c1b; border-bottom: 0;}
ul.slimmenu li.recruitBnt { margin-left: 0;}
ul.slimmenu li.recruitBnt a { padding: 15px; margin: 10px auto 0; max-width: 300px; background-color: #011c5a;}
ul.slimmenu li.recruitBnt a:hover { background-color: #011c5a;}
/*-------- FOOTER --------*/
#footContact {
    background-size: 200px auto;
    background-position: top 50px left 20px;
    padding: 80px 0 50px;
}
#footContact .cnt { width: 100%;}
#footContact .moreBtn { width: 100%; max-width: 350px;}
#footContact .moreBtn, #footContact .moreBtn .btnTxt { background-color: #f1f1f1;}
#footContact .cnt .title { font-size: 35px;}
footer { padding: 60px 0; font-size: 10px; line-height: 15px;}
.footNav { margin-top: 40px;}
.footNav ul { width: 100%; float: none; text-align: center;}
.footNav ul li { margin: 0 7px;}
.footNav p { margin-top: 20px; text-align: center; width: 100%;font-size: 14px;}
	.footNav p a{font-size: 14px;}
	
	
	.neirong h2{font-size: 24px;margin: 40px auto 20px ;}
/*-------- TOP --------*/
#topKV {
    height: auto;
    min-height: inherit;
    display: block;
    margin-top: 60px;
    background-color: #01143f;
    padding-bottom: 40px;
}
#slide_wrapp { height: 50vh; opacity: 1;}
#topKV .cnt { width: 100%; padding: 38vh 8% 0; display: block;}
#topKV .cnt .catch {
    font-size: 50px;
    line-height: 50px;
    text-align: right;
    margin-top: 0;
    min-height: 150px;
}
#topKV .cnt .sub { font-size: 22px; margin: 30px 0 20px;}
#topKV .cnt .txt { line-height: 21px; margin-left: 0;}
#topIntro { padding: 30px 0 40px;}
#topIntro .mainCnt { width: 100%;}
#topIntro .cntBox {
    width: 100%;
    margin-top: 35px;
    padding: 40px 20px 20px;
    border-radius: 0;
    min-height: auto;
}
#topIntro .cntBox span { font-size: 29px; margin: -48px 0 15px 0; height: auto;}
	.wen #topKV .cnt {
        width: 100%;
        padding: 6vh 8% 0;
        display: block;
    }
	.zheng .container {
    width: 98%!important;
    margin: 1% auto!important;
    background: #fff;
    overflow: hidden;
}
	.wen #slide_wrapp{        height: auto;}
#topIntro .moreBtn { margin: -30px 0 0;}
#topAbout .cnt { width: 100%;}
#topAbout {
    background-image: url('images/topAboutBG_SP.jpg');
    background-size: 1024px auto;
    background-position: center bottom;
    padding: 40px 0 280px;
    background-color: #f0f0f0;
    text-align: center;
}
#topClient { padding: 60px 0;}
#topClient .clientList li, #topClient.clients .clientList li { width: 100%; padding: 40px; margin: 0 0 20px;}
#topRecruit { padding: 60px 0 230px;}
#topRecruit .cnt { width: 100%; padding: 0 10%;}
#topRecruit .bg {
    width: 52%;
    height: 200px;
    top: initial;
    bottom: 0;
    background-size: auto 350px;
}
/*-------- ABOUT US --------*/
#concept .mainCnt { padding: 0;}
#concept .image {
    position: relative;
    width: 100%;
    height: 20vh;
    min-height: 155px;
}
#concept .cnt {
    width: 100%;
    font-size: 16px;
    line-height: 26px;
    padding: 0;
    margin-top: 30px;
}
#greeting { background-size: 400px auto; background-position: left -35px top -20px;}
#greeting .cnt { width: 100%; margin-top: 0;}
#greeting .cnt .catch { font-size: 18px; line-height: 25px; margin: 0 0 35px 105px;}
#greeting .name { font-size: 13px; margin: 0 0 50px;}
.companyList { width: 100%; font-size: 12px; line-height: 22px;}
.companyList dt { width: 55px;}
.companyList dd { width: calc(100% - 70px);}
#company iframe { height: 30vh; min-height: 200px; margin-top: 20px;}
#office .pageSecTitle, .pageSecTitle.center { margin-top: 20px;}
.officeList li { width: 100%; padding: 40px; margin-bottom: 15px;}
.officeList li:nth-child(odd) {margin-right:unset;}
.officeList li .title { font-size: 20px; letter-spacing: 0;}
.officeList li .cnt { font-size: 13px; line-height: 22px;}
/*-------- BUSINESS --------*/
.anchor a { width: 100%;}
#business .title { font-size: 19px;}
#business .cnt { text-align: left;}
.businessSec { margin: 30px 0; padding: 0;}
.secDeco { font-size: 36px; line-height: 36px; letter-spacing: 0.1rem; top: -15px; left: 7.5%;}
.businessSec .image {
    position: relative;
    width: 100%;
    max-width: 700px;
    height: 30vh;
    min-height: 250px;
    margin: 0 auto;
}
.businessSec .cnt { width: 100%; margin-bottom: 50px;}
.businessSec .cnt .sub1, .businessSec .cnt .sub2, #logistics.businessSec .cnt .pageSecTitle { width: 100%;}
#logistics { margin-top: 80px;}
#logistics .secDeco { right: inherit; left: 7.5%;}
/*-------- FOR CLIENTS --------*/
#pageCatch.forclients .title { font-size: 23px; letter-spacing: 0;}
#topVision .bg-image-loop { height: 150px; animation: bg-slider 50s linear infinite;}
#topVision .titleBox {
    width: 100%;
    max-width: 450px;
    margin: 50px auto;
    padding: 0 40px;
    height: auto;
}
#topVision .cnt {
    font-size: 13px;
    line-height: 24px;
    margin: 0 auto;
    text-align: left;
}
.clientSec img, #newbusiness.clientSec img {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 40px;
    float: none;
}
#newbusiness.clientSec img { max-width: 600px;}
#vision .mainCnt { width: 100%;}
#vision .cnt { width: 85%; margin: 0 auto;}
#expansion.clientSec .cnt { width: 100%; float: none;}
#expansion.clientSec img { width: 100%; max-width: 250px; margin: 40px auto 0; float: none;}
#greeting.clients .cnt .catch { font-size: 15px; line-height: 20px;}
#movie { padding-top: 0; text-align: center;}
#movie iframe {
    width: 100%;
    max-width: 400px;
    float: none;
    height: 200px;
}
/*-------- HISTORY --------*/
#topVision.history { padding-bottom: 0;}
.historySec img, .historySec img.floatR {
    width: 100%;
    max-width: 600px;
    margin: 40px auto;
    display: block;
    float: none;
}
.historySec img.text { width: 100%;}
.companyList.history dt { width: 70px;}
.companyList.history dd { width: calc(100% - 75px);}
/*-------- OUR BUSINESS --------*/
#outsourcing2 { padding-top: 0;}
.halfCnt { width: 100%; margin-bottom: 40px;}
.technology { margin-top: 0;}
.areaList li { width: 100%; margin: 0 0 30px;}
.areaList li .title { font-size: 18px;}
.trucks .pageSecTitle.center { margin-top: 0;}
.truckList li { width: 100%; margin: 0 0 30px;}
#company.ourbusiness dt { width: 75px; font-size: 14px;}
#company.ourbusiness dd { width: calc(100% - 80px);}
/*-------- CONTACT --------*/
.contactList { margin-top: 30px;}
.contactList li { margin: 0 0 20px; padding: 30px;}
.contactList .title { font-size: 20px;}
.telCnt { margin-top: 20px;}
.telCnt .contactNo {
    margin: 0 0 15px;
    font-size: 27px;
    height: 35px;
    line-height: 37px;
    padding-left: 35px;
}
.telCnt .contactNo.call { text-decoration: none; color: #06163c;}
.bnrCnt { margin-top: 20px;}
.bnrCnt a { margin: 0 0 15px;}
.bnrCnt .moreBtn { width: 100%; max-width: 600px;}
.bnrCnt img { width: 100%; height: auto; max-width: 300px;}
.formBox {
    padding: 40px 30px 30px;
    margin: 30px auto 0;
    margin-left: -5%;
    width: 110%;
}
.contactForm .formDiv { width: 100%;}
/*-------- PRIVACY --------*/
#pageCatch .title.privacy { font-size: 20px; letter-spacing: 0;}
#privacy .pageSecTitle { margin-bottom: 50px; font-size: 18px;}
#privacy .pageSecTitle.second { margin-top: 50px;}
}

.wpcf7-submit{
    padding: 20px 50px;
    background: #b72213;
    font-size: 20px;
    color: #fff;
}


/****************************************  SP (600px↓) ****************************************/
@media screen and (max-width:600px) {
/*-------- FOR CLIENTS --------*/
.visionList li { width: 100%; margin-right: 0; margin-bottom: 20px;}
.visionList li img { margin-bottom: 15px;}
.clientSec img { padding: 10px; margin: 0;}
	
	
	
}
/****************************************  reCAPTCHA ****************************************/
.grecaptcha-badge { z-index: 9999!important;}