body.index{color:#fff;}
body.on header{height:100%;}
a{color:#fff;}

header div.main-visual.index {height:calc(100vh - 60px); max-height: 800px; background:#f6f6f6; position: relative;}
header div.main-visual.index a.copy.index{left:0; top:50%; width:450px; height:330px; margin-top: -190px; z-index: 1; transition:all 0.8s ease; opacity: 0; transform: translateY(15px);}
header div.main-visual.index a.copy.index.on{opacity: 1; transform: translateY(0);}
header div.main-visual.index a.copy.index div.copy-inner{width:288px; margin:0 auto; position:absolute; top:50%; left:50%; margin-left:-144px; margin-top:-125px; }
header div.main-visual.index a.copy.index:hover p.button:after{width:10px;}
header div.main-visual.index a.copy.index:hover{opacity:0.8;}

header div.main-visual.index a.copy.index div.copy-inner p.copy-description{margin-bottom:29px;}

header div.main-visual.index div.loadMark{width: 40px; height: 40px; border: 5px solid #e6e6e6; border-top-color: #FFF; border-radius: 50%; animation: spinLoad 1.2s linear 0s infinite; position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto;}

@keyframes spinLoad {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}

ul.main-visual-slider{width:100%; height:100%; overflow: hidden; position: relative;}
ul.main-visual-slider li{width:100%; height:100%;  position: absolute; left: 0; top: 0; opacity: 0; transition: all 2s ease; transform: translateX(3%) scale(1.06);}
ul.main-visual-slider li.active{opacity: 1; transform: translateX(0) scale(1);}
ul.main-visual-slider li.after{opacity: 0; transform: translateX(-5%) scale(1.1);}

ul.slick-dots{position:absolute; right:20px; bottom:82px; list-style: none; opacity: 0; transition: opacity 0.5s ease;}
ul.slick-dots.on{opacity: 1;}
ul.slick-dots li{width:8px; height:8px; display:inline-block!important; margin: 0 6px;  border-radius:50%; background: #FFF; cursor: pointer;}
ul.slick-dots li.active{background: #fe2531;}
ul.slick-dots li:hover{opacity: 0.6;}

header div.main-visual.index div.news{position:absolute; bottom:0; width:100%; height:50px; overflow:hidden; background:linear-gradient(to right,rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.5));}
header div.main-visual.index div.news a:hover{opacity: 0.7;}
header div.main-visual.index div.news div.news-list-wrapper{height:50px; width: calc(100% - 200px); overflow:hidden;}
header div.main-visual.index div.news ul.news-list{width:100%; margin:0 auto; line-height:50px;}
header div.main-visual.index div.news ul.news-list li{font-size:1.45rem; height: 50px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap;}
header div.main-visual.index div.news ul.news-list li a{color:#333;padding:13px 0 13px 60px; box-sizing:border-box; height:24px; line-height:24px;}
header div.main-visual.index div.news ul.news-list li span.no-post{color:#333;padding:13px 0 13px 60px; box-sizing:border-box; height:24px; line-height:24px;}
header div.main-visual.index div.news ul.news-list li span.date{color:#fe2531; font-weight:bold; display:inline-block; margin-right:30px;}
header div.main-visual.index div.news p.archive-button{width:150px; height:24px; background:#fff; position:absolute; top:50%; right:20px; font-size:1.3rem; text-align:center; line-height:24px; border-radius: 12px; transform:translate(0,-50%); }
header div.main-visual.index div.news p.archive-button a {color:#333;}

main section.business{width:100%; height:100%; background-color:#222;}
main section.business div.business-block-wrapper{width:100%; height:100%; padding:15px; box-sizing:border-box; display:flex; justify-content:space-between; align-items: center; flex-wrap:wrap;}
main section.business div.business-block-wrapper div.business-block {width:25%; height:420px; overflow: hidden;}
main section.business div.business-block-wrapper div.business-block div.business-block-back{width:100%; height:100%; background-repeat: no-repeat;background-position:center; background-size:cover; transition:0.4s;}
main section.business div.business-block-wrapper div.business-block a.business-block-link{position:relative; transition:0.4s ease;}
main section.business div.business-block-wrapper div.business-block a.business-block-link:hover{opacity:0.6;}
main section.business div.business-block-wrapper div.business-block a.business-block-link:hover div.business-block-back{transform:scale(1.1);}
main section.business div.business-block-wrapper div.business-block.car div.business-block-back {background-image:url("/images/business-back01.jpg"); background-repeat:no-repeat;}
main section.business div.business-block-wrapper div.business-block.aircraft div.business-block-back{background-image:url("/images/business-back02.jpg"); background-repeat:no-repeat;}
main section.business div.business-block-wrapper div.business-block.products div.business-block-back{background-image:url("/images/business-back03.jpg"); background-repeat:no-repeat;}
main section.business div.business-block-wrapper div.business-block.staffing div.business-block-back{background-image:url("/images/business-back04.jpg"); background-repeat:no-repeat;}

main section.business div.business-block-wrapper div.business-block div.business-block-inner{width:240px; display:flex; justify-content: center; flex-direction: column; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);}
main section.business div.business-block-wrapper div.business-block div.business-block-inner h2.business-block-caption{text-align:center; margin-bottom:30px;}
main section.business div.business-block-wrapper div.business-block div.business-block-inner h2.business-block-caption p{font-family: 'Roboto', sans-serif; font-size:3.6rem; line-height:1.4; margin-bottom:10px;}
main section.business div.business-block-wrapper div.business-block div.business-block-inner h2.business-block-caption span{font-size:1.5rem; line-height:1.7;}
main section.business div.business-block-wrapper div.business-block div.business-block-inner p.business-block-description{font-size:1.5rem; line-height:1.7; margin-bottom:45px; text-align:center;}
main section.business div.business-block-wrapper div.business-block a.business-block-link:hover div.business-block-inner p.button:after{width:10px;}

main section.about.index div.about-block-wrapper {display:flex; flex-wrap:wrap;}
main section.about.index div.about-block-wrapper div.about-block {width:50%; }
main section.about div.about-block-wrapper div.about-block.value div.about-block-inner{width:420px; height:385px; padding-top: 20px;}
main section.about div.about-block-wrapper div.about-block.recruit div.about-block-inner{width:446px; height:434px;}
main section.about.index div.about-block-wrapper div.about-block div.about-block-inner div.copy.bottom{top:50%; left:55%; transform:translate(-60%,-50%); }
main section.about div.about-block-wrapper div.about-block a.about-block-link div.about-block-back{ background-size: cover; background-position: 20% center;}
main section.about div.about-block-wrapper div.about-block.value a.about-block-link div.about-block-back{background-image:url("/images/value-link-back-index.jpg"); background-position: right center;}

/* 英語版 */
header div.main-visual a.copy.en div.copy-inner p.copy-caption {line-height:1.3; font-size:4.4rem; margin-bottom: 16px;}
header div.main-visual.index a.copy.index.en div.copy-inner{width:340px; margin-left: -170px; margin-top: -120px;}

main section.about.index div.about-block-wrapper div.about-block.value div.about-block-inner div.copy.bottom.en{top: 51%; left: 51%; transform: translate(-50%,-50%);}
main section.about.index div.about-block-wrapper div.about-block.recruit div.about-block-inner div.copy.bottom.en{top: 50%; left: 44%; transform: translate(-50%,-50%);}
main section.business.en div.business-block-wrapper div.business-block div.business-block-inner{width: 260px;}


/* タブレット */
@media (max-width: 1100px){

header div.main-visual.index {height: calc(100vh - 50px);}
header div.main-visual.index a.copy.index{left:0; top:50%; width:450px; height:330px; margin-top: -165px; z-index: 1; }
header div.main-visual.index ul.main-visual-slider{margin-bottom:242px; margin-bottom: 262px;}
header div.main-visual.index div.news ul.news-list li a{padding-left:5%;}
header div.main-visual.index div.news ul.news-list li span.no-post{padding-left:5%;}

ul.slick-dots{bottom:70px;}

main section.business div.business-block-wrapper div.business-block{width:50%;}
main section.business div.business-block-wrapper div.business-block{height:350px;}

main section.about div.about-block-wrapper div.about-block{width:100%;}
main section.about div.about-block-wrapper div.about-block.value a.about-block-link div.about-block-back{background-image:url("/images/value-link-back2.jpg"); background-position: -180px center; background-size:1280px 865px;}

main section.about.index div.about-block-wrapper {flex-direction:column;}
main section.about.index div.about-block-wrapper div.about-block{width:100%;}


}


/* スマホ */
@media (max-width: 760px){

.sp{display:block;}
header div.main-visual.index{height:auto;}
header div.main-visual.index ul.main-visual-slider{width:100%; height:240px; z-index: 2;}
header div.main-visual.index div.loadMark{top: 260px; bottom:inherit; margin: 0 auto;}

ul.slick-dots{bottom: 108px; right: 0; margin-right:0; width: 100%; text-align: center;}

header div.main-visual.index a.copy div.copy-inner p.copy-caption{margin-bottom:10px;}
header div.main-visual.index a.copy.index div.copy-inner p.copy-description{margin-bottom:19px;}
header div.main-visual.index a.copy.index{width:calc(100% - 20px); height:250px; border-radius:0; top:270px; left:auto; margin:0 10px; z-index: 3;}
header div.main-visual.index a.copy.index div.copy-inner{width:240px; margin-left:-120px; margin-top: -96px;}
header div.main-visual.index div.news{position:static; width:100%; height:100px; overflow:hidden; z-index: 1;}
header div.main-visual.index div.news p.archive-button{position:static; width:100%; height:50px; position:static; transform:none; background:#f6f6f6;}
header div.main-visual.index div.news p.archive-button a{font-size:1.5rem; font-weight:bold; text-align: center; line-height:50px; background:url("/images/arrow-black-index.png") no-repeat center center; background-size:120px 8px; text-indent: 15px;}
header div.main-visual.index div.news div.news-list-wrapper{background:#fff; width: 100%;}
header div.main-visual.index div.news ul.news-list{height:50px; margin:0 auto; line-height:50px;}
header div.main-visual.index div.news ul.news-list li a{height:50px; padding: 9px 0 13px 5%;}
header div.main-visual.index div.news ul.news-list li span.no-post{height:50px; padding: 0 0 0 5%; display:block; font-size:1.4rem; line-height: 50px;}
header div.main-visual.index div.news ul.news-list li span.date{display:block; font-size:1.3rem; line-height: 1; padding-bottom:1px;}
header div.main-visual.index div.news ul.news-list li span.title{display:block; font-size:1.4rem; line-height: 1.5;}

main section.business div.business-block-wrapper div.business-block div.business-block-inner h2.business-block-caption p{font-size:3.0rem;}

main section.about div.about-block-wrapper div.about-block div.about-block-inner{bottom:-230px;}
main section.about div.about-block-wrapper div.about-block.value a.about-block-link div.about-block-back{background-image:url("/images/value-link-back2.jpg"); background-position: center -90px; background-size:cover;}
main section.about.index div.about-block-wrapper div.about-block.value div.about-block-inner div.copy.bottom{transform:none; margin-top: -82px; margin-left:-120px;}
main section.about.index div.about-block-wrapper div.about-block.recruit div.about-block-back{height: 240px; background-position: center bottom;}
main section.about.index div.about-block-wrapper div.about-block.recruit div.about-block-inner div.copy.bottom{transform:none; margin-top: -46px; margin-left:-128px;}
main section.business div.business-block-wrapper{padding:10px;}
main section.business div.business-block-wrapper div.business-block{width:100%;}

main section.about div.about-block-wrapper div.about-block.value div.about-block-inner{padding-top: 0;}
main section.about.index div.about-block-wrapper div.about-block div.about-block-inner div.copy.bottom{left:50%;}

/* 英語版 */
header div.main-visual.index a.copy.index.en div.copy-inner{ width: 260px; margin-left: -130px; margin-top: -96px;}
header div.main-visual a.copy.en div.copy-inner p.copy-caption{font-size:3.2rem; line-height:1.4;}
main section.about.index div.about-block-wrapper div.about-block.value div.about-block-inner div.copy.bottom.en{transform: none; top:50%; margin-left:-165px;}
main section.about.index div.about-block-wrapper div.about-block.recruit div.about-block-inner div.copy.bottom.en p.copy-caption{line-height: 1.3;}
main section.about.index div.about-block-wrapper div.about-block.recruit div.about-block-inner div.copy.bottom.en{transform: none; width:380px; left: 50%; margin-left:-190px; margin-top: -35px;}

}

@media (max-width: 480px){
main section.about.index div.about-block-wrapper div.about-block.recruit div.about-block-inner div.copy.bottom.en{width:300px; transform: none; top:50%; left:50%; margin-left: -150px; margin-top: -66px;}
main section.about.index div.about-block-wrapper div.about-block.value div.about-block-inner div.copy.bottom.en{width:300px; transform: none; top:50%; left:50%; margin-left: -150px; margin-top: -78px;}
main section.about.index div.about-block-wrapper div.about-block.value  div.about-block-inner div.copy.bottom.en p.copy-description{font-size:1.3rem;}
}