@charset "UTF-8";

/*
=================================================================================================
ヘッダー
=================================================================================================
*/
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 90px;
  z-index: 10;
}

.headerList_pc {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  top: 10px;
}

.headerLogo_img {
  width: 150px;
}

.headerList_item_pc {
  color: #fff;
  font-size: 1.8rem;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.5s;
}

.headerList_item_pc:hover {
  color: #b5d5ff;
}

/* スクロールして「scroll-navクラス」がついたときのヘッダーデザイン */
.header.scroll-nav {
  background: #fff;
  /* box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1); */
}

.header.scroll-nav,
.header.scroll-nav .headerList_item_pc {
  color: #444;
}

.header.scroll-nav .headerLogo_img {
  display: none;
}

.header.scroll-nav .headerLogo {
  display: block;
  width: 150px;
  height: 70px;
  background: url(../img/logo_moro-shoji_navy.png)no-repeat top center/contain;
}

.header.scroll-nav .headerList_item_pc:hover {
  color: #adadad;
}

.header_sp {
  display: none;
}

/*上に戻るボタン ----------------------------------*/

#page-top{
  width: 75px;
  height: 75px;
  position: fixed;
  right: 5%;
  bottom: 5%;
  z-index: 2;
  background: #00419A;
  border: 3px solid #fff;
  border-radius: 50%;
}

#page-top span{
  position: absolute;
  top:50%;                           /*上下中央揃えするための処理ー以下4行*/
  left:50%;
  transform:translate(-50%,-50%);
}

#page-top .icon-arrow_up {
  font-size: 2.5rem;
  color: #fff;

}

#page-top:hover{
  background: #006cff;
  transition: 0.5s;
}

/*
=================================================================================================
フッダー
=================================================================================================
*/
.footer {
  background: #262626;
  color: #fff;
}

.footer_blk {
  padding: 50px 0;
  display: flex;
  justify-content: space-between
}

.footerLogo_img {
  width: 200px;
}

[class*="footer_info_"]{
  font-size: 1.8rem;
  line-height: 1.5;
}

.footer_info_tel,
.footer_info_fax {
  display: inline;
}

.footer_info_logo {
  margin-bottom: 10px;
}

.footer_info_companyName {
  font-size: 3.0rem;
}

.footer_sitemap{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.footer_sitemap li {
  width: calc(100%/2);
}


.footer_sitemap a{
  font-size: 1.8rem;
  color: #fff;
  transition: 0.5s;
}

.footer_sitemap a:hover{
  font-size: 1.8rem;
  color: #adadad;
}

.copylight {
  padding-bottom: 50px;
  font-size: 1.4rem;
  text-align: center;
}

/*
=================================================================================================
お問い合わせ
=================================================================================================
*/
#contact {
  margin: 0 !important;
}

.contact {
  padding: 80px 0;
  background: url("../img/contact_back.jpg") no-repeat top center/cover;
  text-align: center;
}

.contact_ttl {
  margin: 0 auto 32px;
  font-size: 4.0rem;
  font-weight: 500;
}

.contact_txt {
  font-size: 2.0rem;
  line-height: 2.0;
  margin-bottom: 16px;
}


.contact_tel {
  margin-bottom: 16px;
  font-size: 8.0rem;
  font-family: 'Urbanist', sans-serif;
  line-height: 1.2;
  pointer-events: none; 
}



.icon-phone {
  font-size: 7.0rem;
  padding-right: 0.05em;
}

.contact_time {
  font-size: 1.8rem;
}

/*
=================================================================================================
下層ページ-----共通部分
=================================================================================================
*/
/*-- ヘッド部分共通 --*/
[class*="Head_img"] {
  width: 100%;
  height: 400px;
  background: pink;
  position: relative;
}

[class*="Head_ttl"] {
  padding-bottom: 15px;
  font-size: 5.0rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  color: #fff;
  position:absolute;
  top: calc(100%/2.5);
  text-shadow: 0 0 15px #000000;
  border-bottom: 3px solid #fff;
}

[class*="Head_ttl"] span{
  font-size: 7.0rem;
  font-weight: 400;
}

/*-- ページ内リンク --*/
#page_nav {
  width: 100%;
  background: #fff;
  top: 50px;
  transition: all 0.5s ease 0s;

}

/*-- スクロールした時にヘッダー下に固定 --*/
#page_nav.m_fixed {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
  position: fixed;
	left: 0;
	top: 90px;
  z-index: 5;
}

.page_nav_list {
  height: 80px;
  display: flex;
}

#page_nav.m_fixed .page_nav_list{
  height: 50px;
}

.page_nav_item {
  font-size: 1.6rem;
  line-height: 50px;  /*上下中央にするためにline-heightを親要素の高さと同じに*/
  width: calc(100%/4);
  text-align: center;
}

.page_nav_item a{
  display:block;
  height: 50px;
  color: #444;
  white-space: nowrap;
  transition: 0.5s;
}

.page_nav_item a:hover {
  background: #00419A;
  color: #fff;
  transition: 0.5s;
}

.page_nav_item .icon-arrow_down {
  font-size: 0.8rem;
  margin-left: 5px;
}

/*
=================================================================================================
下層ページ-----事業内容
=================================================================================================
*/
.businessHead_img {
  background: url("../img/head_business.jpg") no-repeat top center/cover;
}

/*-- 事業内容リード部分 --*/
.business_leadBlk {
  position: relative;
  height: 680px;
}

.business_leadBack {
  display: block;
  width: 70vw;
  height: 370px;
  background: #00419A;
  z-index: -5;
  position: absolute;
  top: 0;
}

.business_leadBlk .inner{
  position: relative;
}

.business_leadttl {
  font-size: 3.0rem;
  letter-spacing: 0.05em;
  line-height: 1.83;
  color: #fff;
  position: absolute;
  top: 50px;
  left: 0;
}

.business_leadimg {
  width: 440px;
  height: 320px;
  display: block;
  background: url("../img/logistics_img.jpg") no-repeat top center/cover;
  position: absolute;
  top: 150px;
  right: 0;
}

[class*="business_leadtxt_"] {
  font-size: 1.8rem;
  letter-spacing: 0.03em;
  line-height: 2.0;
  width: 504px;
  text-align: justify;
  position: absolute;
}

.business_leadtxt_01 {
  color: #fff;
  top: 180px;
}

.business_leadtxt_02 {
  top: 400px;
}

/*-- 事業内容 本文 --*/
.business_sec {
  height: 470px;
  margin-bottom: 80px;
}

.business_sec_wrap {
  display: flex;
  justify-content: space-between;
}

#business_sec02 .business_sec_wrap {
  flex-direction: row-reverse;
}

.business_secttl {
  font-size: 3.0rem;
  letter-spacing: 0.02em;
  margin-bottom: 30px;
}
.business_secttl span{
  width: 35px;
  height: 35px;
  display: inline-block;
  border-radius: 50%;
  background: #00264B;
  position: relative;
  top: 5px;
  margin-right: 15px;
}

.business_secttl .icon-check{
  font-size: 1.8rem;
  color: #fff;
  text-align: center;
  width:100%;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

.business_sectxt {
  width: 48%;
  font-size: 1.8rem;
  letter-spacing: 0.02em;
  line-height: 2.0;
  text-align: justify;
}

[class*="business_secimg"] {
  width: 440px;
  height: 320px;
  position: relative;
}

[class*="business_secimg"]::after{
  width: 440px;
  height: 320px;
  display: block;
  content: "";
  background: #E8F2FF;
  position: absolute;
  top: 40px;
  left: 40px;
  z-index: -1;
}

.business_secimg01 {
  background: url("../img/business_img01.jpg") no-repeat top center/cover;
}

.business_secimg02 {
  background: url("../img/business_img02.jpg") no-repeat top center/cover;
}

/*
=================================================================================================
下層ページ-----車両紹介
=================================================================================================
*/
.vehicleHead_img {
  background: url("../img/head_vehicle.jpg") no-repeat top center/cover;
}

/*-- 車両紹介 リード部分 --*/
.vehicle_leadBlk {
  position: relative;
  height: 570px;
  margin: 80px 0;
}

.vehicle_leadBack {
  display: block;
  width: 70vw;
  height: 370px;
  background: #00419A;
  z-index: -5;
  position: absolute;
  top: 0;
}

.vehicle_leadBlk .inner{
  position: relative;
}

.vehicle_leadttl {
  font-size: 3.0rem;
  letter-spacing: 0.05em;
  line-height: 1.83;
  color: #fff;
  position: absolute;
  top: 50px;
  left: 0;
}

.vehicle_leadimg {
  width: 512px;
  height: 328px;
  display: block;
  background: url("../img/vehicle_img.jpg") no-repeat top center/cover;
  position: absolute;
  top: 100px;
  right: 0;
}

.vehicle_leadtxt {
  font-size: 1.8rem;
  letter-spacing: 0.03em;
  line-height: 2.0;
  width: 450px;
  text-align: justify;
  position: absolute;
  color: #fff;
  top: 180px;
}


/*-- 車両紹介 本文 --*/
.vehicle_sec {
  margin-bottom: 120px;
}

#vehicle_sec03 {
  margin-bottom: 240px;
}

.vehicle_secttl {
  font-size: 3.0rem;
  letter-spacing: 0.02em;
  margin-bottom: 30px;
}

.vehicle_secttl span{
  width: 35px;
  height: 35px;
  display: inline-block;
  border-radius: 50%;
  background: #00264B;
  position: relative;
  top: 5px;
  margin-right: 15px;
}

.vehicle_secttl .icon-check{
  font-size: 1.8rem;
  color: #fff;
  text-align: center;
  width:100%;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

.vehicle_imgBlk {
  display: flex;
  justify-content: space-around;
}

[class*="vehicle_secimg"] {
  width: 440px;
  height: 320px;
  background: #fff;
}

.vehicle_secimg01-1{
  background: url("../img/vehicle_large_alumi-wing01.jpg") no-repeat top center/cover;
}

.vehicle_secimg01-2 {
  background: url("../img/vehicle_large_alumi-wing02.jpg") no-repeat top center/cover;
}

.vehicle_secimg02-1 {
  background: url("../img/vehicle_medium_alumi-wing01.jpg") no-repeat top center/cover;
}
.vehicle_secimg02-2 {
  background: url("../img/vehicle_medium_alumi-wing02.jpg") no-repeat top center/cover;
}

.vehicle_secimg03-1 {
  background: url("../img/vehicle_trailer_wing01.jpg") no-repeat top center/cover;
}


/*
=================================================================================================
下層ページ-----安全への取り組み
=================================================================================================
*/
.safetyHead_img {
  background: url("../img/head_safety.jpg") no-repeat top center/cover;
}

/*-- 安全への取り組み リード部分 --*/
.safety_leadBlk {
  position: relative;
  height: 300px;
  margin: 80px 0;
}

.safety_leadBack01 {
  display: block;
  width: 70vw;
  height: 250px;
  background: #00419A;
  z-index: -5;
  position: absolute;
  top: 0;
}

.safety_leadBack02 {
  display: block;
  width: 70vw;
  height: 250px;
  background: #E8F2FF;
  z-index: -6;
  position: absolute;
  bottom: 0;
  right: 0;
}

.safety_leadBlk .inner{
  position: relative;
}

.safety_leadttl {
  font-size: 3.0rem;
  letter-spacing: 0.05em;
  line-height: 1.83;
  font-weight: 500;
  color: #fff;
  position: absolute;
  top: 60px;
  left: 0;
}

/*-- 安全への取り組み 本文 --*/
.safety_sec {
  margin-bottom: 80px;
}

.safety_sec_wrap {
  display: flex;
  justify-content: space-between;
}

#safety_sec02 .safety_sec_wrap,
#safety_sec04 .safety_sec_wrap {
  flex-direction: row-reverse;
}

.safety_secttl {
  font-size: 3.0rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin-bottom: 30px;
}

.safety_secttl span{
  width: 35px;
  height: 35px;
  display: inline-block;
  border-radius: 50%;
  background: #00264B;
  position: relative;
  top: 5px;
  margin-right: 15px;
}

.safety_secttl .icon-check{
  font-size: 1.8rem;
  color: #fff;
  text-align: center;
  width:100%;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

.safety_sectxt {
  width: 48%;
  font-size: 1.8rem;
  letter-spacing: 0.02em;
  line-height: 2.0;
  text-align: justify;
}

[class*="safety_secimg"] {
  width: 440px;
  height: 320px;
  background: pink;
  position: relative;
}

[class*="safety_secimg"]::after{
  width: 440px;
  height: 320px;
  display: block;
  content: "";
  background: #E8F2FF;
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: -1;
}

.safety_secimg01 {
  background: url("../img/safety_img01.jpg") no-repeat top center/cover;
}

.safety_secimg02 {
  background: url("../img/safety_img02.jpg") no-repeat top center/cover;
}

.safety_secimg03 {
  background: url("../img/safety_img03.jpg") no-repeat top center/cover;
}

.safety_secimg04 {
  background: url("../img/safety_img04.jpg") no-repeat top center/cover;
}

/*
=================================================================================================
下層ページ-----会社案内
=================================================================================================
*/

.companyHead_img {
  background: url("../img/head_company.jpg") no-repeat top center/cover;
}

[class*="companyTtl_"] {
  margin-bottom: 30px;
  padding: 15px;
  width: 50%;
  font-size: 3.0rem;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0.1em;
  display: inline-block;
  background: #00419A;
  position: relative;
}

[class*="companyTtl_"]::after{
  position: absolute;
  top: 0;
  left: 100%;
  width: 0;
  height: 0;
  content: '';
  border-width: 60px 30px 0 0;
  border-style: solid;
  border-color: #00419A transparent transparent transparent;
}

/*-- ごあいさつ  --*/
#company section {
  margin: 80px 0;
}

.company_greetingBlk {
  display: flex;
  justify-content: space-between;
  /* margin-bottom: 40px; */
}

.company_greeting_lead {
  font-size: 3.0rem;
  padding: 30px 0;
}

[class*="company_greeting_txt"] {
  font-size: 1.8rem;
  letter-spacing: 0.02em;
  line-height: 2.0;
  text-align: justify;
}
.company_greeting_txt01,
.company_greeting_txt03 {
  width: 504px;
}

.company_greeting_txt02 {
  margin: 50px 0;
}

[class*="company_greeting_img"] {
  width: 440px;
  height: 320px;
  display: block;
  background: pink;
  position: relative;
}

[class*="company_greeting_img"]::after{
  width: 440px;
  height: 320px;
  display: block;
  content: "";
  background: #00419A;
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: -1;
}

.company_greeting_img01 {
  background: url("../img/greeting_img01.jpg") no-repeat top center/cover;
}

.company_greeting_img02 {
  background: url("../img/greeting_img02.jpg") no-repeat top center/cover;
}

/*-- 会社理念  --*/
.company_slogan {
  height: 500px;
}

.companyTtl_slogan {
  margin-bottom: 0;
  position: relative;
  top: 30px;
}

.company_slogan_wrap {
  width: 100%;
  height: 300px;
  display: block;
  background: #E8F2FF;
  position: relative;
  z-index: -5;
}

.company_slogan_txt {
  font-size: 3.0rem;
  letter-spacing: 0.05em;
  line-height: 2;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width: 80%;
}

.company_slogan_img {
  width: 500px;
  height: 270px;
  display: block;
  background: url("../img/company-slogan_img.png") no-repeat top center/cover;
  position: absolute;
  bottom: -170px;
  right: -48px;
}

/*-- 会社概要  --*/
.company_profile {
  width: 100%;
  height: 750px;
  display: block;
  background: url("../img/company_profile_back.jpg") no-repeat top right/cover;
}

.company_profile_table{
  width: 100%;
  font-size: 2.0rem;
  line-height: 1.75;
}

.company_profile_table .font_bold {
  font-size: 2.2rem;
  font-weight: bold;
  }

.company_profile_table th{
  width: 15%;
  /* color: #10419A; */
}

.company_profile_table td{
  padding: 15px 0;
}

/*-- アクセス  --*/
.company_access_name {
  font-size: 2.5rem;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.05em;
}

.company_access_add {
  font-size: 1.6rem;
  letter-spacing: 0.05em;
}

.company_map {
  width: 100%;
  height: 540px;
}

/*
=================================================================================================
下層ページ-----採用情報
=================================================================================================
*/

#recruit section {
  margin: 40px 0 80px;
}

.recruitHead_img {
  background: url("../img/head_recruit.jpg") no-repeat top center/cover;
}

.recruitLead_wrap {
  padding: 20px 40px;
  width: 100%;
  background: #E8F2FF;
  box-sizing: border-box;
  border-radius: 10px;
}

.recruit_lead {
  margin-bottom: 16px;
  font-size: 1.8rem;
  letter-spacing: 0.01em;
  line-height: 1.8;
}

.recruit_strong {
  font-size: 2.2rem;
  letter-spacing: 0.1em;
  font-weight: bold;
  color: #C50018;
  display: inline-block;
}

/*-- ご応募はこちらボタン  --*/
.linkRecruit_blk {
  margin: 30px 0 30px auto;  /*ブロック要素を右寄せするためにmargin-left: auto; */
  display: block;
  width: 240px;
  height: 60px;
  font-size: 2.0rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  color: #00419A;
  border: solid 3px #00419A;
  background: #fdffd8;
  position: relative;
  transition: 0.5s;
}

.linkRecruit_txt {
  text-align: center;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:100%;
}

.linkRecruit_blk:hover{
  color: #fff;
  background: #00419A;
}

/*-- 中型(4t)ドライバー募集 募集要項  --*/
.recruit_typeTtl {
  padding: 15px;
  font-size: 3.0rem;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0.1em;
  background: #00419A;
}
.recruit_table {
  width: 100%;
}

.recruit_table tr{
  width: 100%;
  border-bottom: 1px solid #888;

}

.recruit_table th{
  width: 20%;
  font-size: 2.0rem;
  background: #E8F2FF;

}

.recruit_table td{
  padding: 20px;
  font-size: 1.8rem;
  letter-spacing: 0.04em;
  line-height: 1.6;
}

  .recruit_accordion {
    width: 600px;
    margin: 40px 0;
  }

  .accordion_header {
    padding: 10px;
    background-color: #10419A;
    font-size: 1.8rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: #fff;
    text-align: center;
    position: relative;
    z-index: +1;
    transition-duration: 0.2s;
  }

  .accordion_header_name {
    display: inline;
    padding: 0 230px;
  }

  .accordion_header .icon-arrow_down {
    font-size: 1.0rem;
    display: inline-block;
    transition: 0.5s;
  }

  .recruit_accordion .open .icon-arrow_down{
    transform: rotateX(180deg);  /* 2D(平面)で回転 */
  }

  .recruit_accordion .accordion_inner {
    display: none;
    padding: 24px;
    border-left: 2px solid #10419A;
    border-right: 2px solid #10419A;
    border-bottom: 2px solid #10419A;
    box-sizing: border-box;
  }

  .route_exam_txt {
    margin: 0;
    word-wrap: break-word;  /* IEやFirefox対応用 */
    overflow-wrap: break-word;
    line-height: 2.0;
  }

/*-- 先輩の声  --*/
.recruit_voiceTtl {
  margin-bottom: 30px;
  padding: 15px;
  width: 50%;
  font-size: 3.0rem;
  color: #fff;
  letter-spacing: 0.1em;
  background: #00419A;
  position: relative;
}

.recruit_voiceTtl::after{
  position: absolute;
  top: 0;
  left: 100%;
  width: 0;
  height: 0;
  content: '';
  border-width: 60px 30px 0 0;
  border-style: solid;
  border-color: #00419A transparent transparent transparent;
}

.recruit_voiceWrap {
  margin: 80px 0;
  display: flex;
  justify-content: space-between;

}

.recruit_voice_name {
  margin-bottom: 20px;
  font-size: 3.0rem;
  color: #00419A;
}

.recruit_voice_txt {
  width: 504px;
  font-size: 1.8rem;
  letter-spacing: 0.02em;
  line-height: 2.2;
  display: block;
  text-align: justify;
}

[class*="recruit_voice_img"] {
  width: 440px;
  height: 320px;
  background: pink;
  position: relative;
}

[class*="recruit_voice_img"]::after{
  width: 440px;
  height: 320px;
  display: block;
  content: "";
  background: #00419A;
  position: absolute;
  top: 30px;
  left: 30px;
  z-index: -1;
}

.recruit_voice_img01 {
  background: url("../img/recruit_img01.jpg") no-repeat top center/cover;
}

.recruit_voice_img02 {
  background: url("../img/recruit_img02.jpg") no-repeat top center/cover;
}

/*
=================================================================================================
下層ページ-----お問い合わせ
=================================================================================================
*/

.contactHead_img {
  background: url("../img/head_contact.jpg") no-repeat top center/cover;
}

.contactBlk {
  margin: 80px 0;
  width: 100%;
  height: 340px;
  background: #E8F2FF;
  position: relative;
  border-radius: 30px;
}

.contactWrap {
  text-align: center;
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:100%;
}

.contact_access {
  margin-bottom: 80px;
}


/*
=============================================================
   common.css 以下スマホサイズ
============================================================
*/

@media screen and (max-width: 559px) {
  .inner {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
  }


.sp_inner {
  width: 90%;
  margin: 0 auto;
}

  .pc {
    display: none;
  }

  .sp {
    display: block;
  }

  /*
  ============================================
  ヘッダー
  ============================================
  */

  /*ヘッダー--------------------------------*/
  .header_pc {
    display: none;
  }

  .header_sp {
    display: block;
  }

  .header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 90px;
  }

  .headerLogo_img {
    width: 150px;
  }

  /*ハンバーガーメニューの三本線*/
  #nav-toggle {
    position: absolute;
    top: calc(100%/4);
    right: 5%;
    cursor: pointer;
    z-index: 1000;
  }

  .nav_hamburger {
    position: relative;
    width: 50px;
    height: 50px;
    border-radius: 10px;
    background: #fff;
  }

  .nav_hamburger span {
    width: 60%;
    height: 2px;
    left: calc(100%/5);
    display: block;
    background: #000;
    position: absolute;
    transition: transform .3s ease, top .5s ease;
  }

  .nav_hamburger span:nth-child(1) {
    top: 15px;
  }

  .nav_hamburger span:nth-child(2) {
    top: 25px;
  }

  .nav_hamburger span:nth-child(3) {
    top: 35px;
  }

  /*ハンバーガーメニューをクリックした時*/
  .open .nav_hamburger {
    background: none;
  }

  .open .nav_hamburger span:nth-child(1) {
    top: 25px;
    transform: rotate(45deg);
    background: #fff;
  }

  .open .nav_hamburger span:nth-child(2) {
    width: 0;
  }

  .open .nav_hamburger span:nth-child(3) {
    top: 25px;
    transform: rotate(-45deg);
    background: #fff;
  }

  /*ハンバーガーメニュー内のメニュー部分CSS*/
 .header .header_sp {
  background: #00264B;
  color: #fff;
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
  z-index: 990;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 100px;
  transform: translateX(100%);
  transition: transform 1s ease;
 }

 .open .header .header_sp {
    transform: translateX(0) !important;
  }

 .header .header_sp ul{
  display: block;
  position: absolute;
  left: 10%;
 }

 .header .header_sp li {
  position: relative;
  margin: 0;
  height: 10vh;
  text-align: left;
  transform: translateX(200px);
  transition: transform 1.3s ease;
 }

 .open .header .header_sp li {
    transform: translateX(0);
  }

 .header .header_sp li a {
  display: inline-block;
  color: #fff;
  padding: 10px 0;
  font-size: 2.5rem;
  font-weight: 400;
 }

 /*-------------------------------
  * スクロールして「scroll-navクラス」がついたときの
  * ヘッダーデザインを全て非表示にする▼
  *--------------------------------*/

 .header.scroll-nav {
   background: none;
   box-shadow: none;
 }


  /*上に戻るボタン ----------------------------------*/

  #page-top{
    width: 60px;
    height: 60px;
  }

  #page-top .icon-arrow_up {
    font-size: 2.0rem;
  }

  /*
  ============================================
  フッダー
  ============================================
  */

  .footer {
    width: 100%;
    background: #262626;
    color: #fff;
  }

  .footer_blk {
    padding: 0;
    display: block;
  }

  .footer_info {
    text-align: center;
    background: #555555;
    padding: 50px 0;
  }

  .footerLogo_img {
    width: 250px;
  }

  [class*="footer_info_"]{
    line-height: 1.8;
  }

  .footer_info_tel,
  .footer_info_fax {
    display: block;
  }

  .footer_info_logo {
    margin-bottom: 20px;
  }

  .footer_info_companyName {
    font-size: 3.0rem;
  }

  .footer_sitemap{
    padding-bottom: 50px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    text-align: center;
  }

  .footer_sitemap li {
    padding: 30px 0;
    width: calc(100%/2);
  }

  /*
  ============================================
  お問い合わせ
  ============================================
  */
  #contact {
    width: 100%;
  }

  .contact {
    padding: 40px 0;
    background-position: top right;
    text-align: center;
  }

  .contact_ttl {
    margin: 0 auto 20px;
    font-size: 3.0rem;
  }

  .contact_txt {
    font-size: 1.6rem;
    margin-bottom: 20px;
  }


  .contact_tel {
    font-size: 4.0rem;
    pointer-events: auto; 
  }


  .icon-phone {
    font-size: 4.0rem;
    pointer-events: auto; 
  }

  .contact_time {
    font-size: 1.6rem;
  }

  /*
  ============================================
  下層ページ-----共通部分
  ============================================
  */
  /*-- ヘッド部分共通 --*/
  [class*="Head_img"] {
    height: 25vh;
  }

  [class*="Head_ttl"] {
    padding-bottom: 10px;
    font-size: 3.0rem;
    left: 5%;
  }

  [class*="Head_ttl"] span{
    font-size: 5.0rem;
  }

  /*-- ページ内リンク --*/
  /*-- スクロールした時にヘッダー下に固定 --*/
  #page_nav.m_fixed {
    box-shadow: none;
    position: static;
  }

  .page_nav_list {
    margin-bottom: 10px;
    height: 100px;
    flex-wrap: wrap;
  }

  .page_nav_item {
    font-size: 1.4rem;
    width: calc(100%/2);
  }

  .page_nav_item .icon-arrow_down {
    font-size: 0.5rem;
  }

  /*
  ============================================
  下層ページ-----事業内容
  ============================================
  */
  /*-- 事業内容リード部分 --*/
  .business_leadBlk {
    height: 750px;
  }

  .business_leadBack {
    width: 90%;
    height: 250px;
  }

  .business_leadttl {
    font-size: 2.0rem;
    letter-spacing: 0.05em;
    line-height: 1.5;
    top: 10px;
  }

  .business_leadimg {
    width: 100%;
    height: 250px;
    top: 80px;
  }

  [class*="business_leadtxt_"] {
    font-size: 1.6rem;
    line-height: 1.7;
    width: 100%;
  }

  .business_leadtxt_01 {
    color: #444;
    top: 350px;
  }

  .business_leadtxt_02 {
    top: 500px;
  }

  /*-- 事業内容 本文 --*/
  .business_sec {
    height: auto;
    margin-bottom: 40px;
  }

  .business_sec_wrap {
    flex-direction: column;
  }

  #business_sec02 .business_sec_wrap {
    flex-direction: column;
  }

  .business_secttl {
    font-size: 5vw;
    margin-bottom: 15px;
  }
  .business_secttl span{
    width: 25px;
    height: 25px;
    margin-right: 8px;
  }

  .business_secttl .icon-check{
    font-size: 1.2rem;
  }

  .business_sectxt {
    width: 100%;
    font-size: 1.6rem;
    line-height: 1.7;
  }

  [class*="business_secimg"] {
    margin-bottom: 15px;
    width: 100%;
    height: 240px;
  }

  [class*="business_secimg"]::after{
    display: none;
  }

  /*
  ============================================
  下層ページ-----車両紹介
  ============================================
  */

  /*-- 車両紹介 リード部分 --*/
  .vehicle_leadBlk {
    margin: 0;
    height: 500px;
  }

  .vehicle_leadBack {
    width: 90%;
    height: 250px;
  }

  .vehicle_leadBlk .inner{
    position: relative;
  }

  .vehicle_leadttl {
    font-size: 2.0rem;
    letter-spacing: 0.05em;
    line-height: 1.5;
    top: 10px;
  }

  .vehicle_leadimg {
    width: 100%;
    height: 250px;
    top: 80px;
  }

  .vehicle_leadtxt {
    font-size: 1.6rem;
    line-height: 1.7;
    color: #444;
    width: 100%;
    top: 340px;
  }


  /*-- 車両紹介 本文 --*/
  .vehicle_sec {
    margin-bottom: 40px;
  }

  #vehicle_sec03 {
    margin-bottom: 40px;
  }

  .vehicle_secttl {
    font-size: 4.5vw;
    margin-bottom: 15px;
  }

  .vehicle_secttl span{
    width: 25px;
    height: 25px;
    margin-right: 8px;
  }

  .vehicle_secttl .icon-check{
    font-size: 1.2rem;
  }


  [class*="vehicle_secimg"] {
    width: 100%;
    height: auto;
  }

  [class*="vehicle_secimg"]::before {
  content: "";
  display: block;
  padding-top: 75%;
  }

  [class*="vehicle_secimg"]::after{
    display: none;
  }


  /*
  ============================================
  下層ページ-----安全への取り組み
  ============================================
  */

  /*-- 安全への取り組み リード部分 --*/
  .safety_leadBlk {
    margin: 0 0 20px 0;
    position: relative;
    height: 150px;
  }

  .safety_leadBack01 {
    width: 95vw;
    height: 120px;
  }

  .safety_leadBack02 {
    width: 95vw;
    height: 120px;
  }

  .safety_leadttl {
    font-size: 1.8rem;
    line-height: 1.7;
    top: 60px;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
  }

  /*-- 安全への取り組み 本文 --*/
  .safety_sec {
    height: auto;
    margin-bottom: 40px;
  }

  .safety_sec_wrap {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  #safety_sec02 .safety_sec_wrap,
  #safety_sec04 .safety_sec_wrap {
    flex-direction: column;
  }

  .safety_secttl {
    font-size: 5vw;
    letter-spacing: 0.02em;
    margin-bottom: 15px;
  }
  .safety_secttl span{
    width: 25px;
    height: 25px;
    margin-right: 8px;
  }

  .safety_secttl .icon-check{
    font-size: 1.2rem;
  }

  .safety_sectxt {
    width: 100%;
    font-size: 1.6rem;
    line-height: 1.7;
  }

  [class*="safety_secimg"] {
    width: 100%;
    height: auto;
    margin-bottom: 15px;
  }

  [class*="safety_secimg"]::before{
    content: "";
    display: block;
    padding-top: 70%;
  }

  [class*="safety_secimg"]::after{
    display: none;
  }

  /*
  ============================================
  下層ページ-----会社案内
  ============================================
  */

  [class*="companyTtl_"] {
    margin-bottom: 15px;
    padding: 10px;
    font-size: 2.0rem;
  }

  [class*="companyTtl_"]::after{
    border-width: 40px 30px 0 0;
  }

  /*-- ごあいさつ  --*/
  #company section {
    margin: 0 auto 60px; /*TODO マージン最後に調整する*/
  }

  #company_greeting {
    margin: 0 auto 20px !important;
  }

  .company_greetingBlk {
    flex-direction: column;
  }

  .company_greeting_lead {
    font-size: 7vw;
    padding: 15px 0;
  }

  [class*="company_greeting_txt"] {
    font-size: 1.6rem;
  }
  .company_greeting_txt01,
  .company_greeting_txt03 {
    width: 100%;
  }

  .company_greeting_txt01 {
    margin-bottom: 20px;
  }

  .company_greeting_txt02 {
    margin: 0 0 20px 0;
  }

  [class*="company_greeting_img"] {
    width: 100%;
    height: auto;
    margin-bottom: 40px;
  }

  [class*="company_greeting_img"]::before{
    content: "";
    display: block;
    padding-top: 70%;
  }

  [class*="company_greeting_img"]::after{
    width: 100%;
    height: 100%;
    top: 8%;
    left: 5%;
    overflow: hidden;
  }

  /*-- 会社理念  --*/
  .company_slogan {
    height: 300px;
  }

  .companyTtl_slogan {
    position: relative;
    top: 30px;
  }

  .company_slogan_wrap {
    height: 240px;
  }

  .company_slogan_txt {
    font-size: 5vw;
    line-height: 1.8;
    text-align: center;
  }

  .company_slogan_img {
    display: none;
  }

  /*-- 会社概要  --*/
  .company_profile {
    height: 850px;
    background: none;
  }

  .company_profile_table{
    margin: 0 auto;
    width: 90%;
    line-height: 1.5;
    text-align: center;
  }

  .company_profile_table th{
    padding: 3px 0;
    width: 100%;
    color: #707070;
    background: #E8F2FF;
    display: block;
    border-top: 1.5px solid #707070;
  }

  .company_profile_table td{
    padding: 15px 0;
    display: block;
  }

  .company_profile_table tr:last-child{
    border-bottom: 1.5px solid #707070;
  }

  /*-- アクセス  --*/
  .company_access iframe {
    height: 300px;
  }

  .company_access_name {
    margin-top: 0.3em;
    font-size: 2.3rem;
  }

  /*
  ============================================
  下層ページ-----採用情報
  ============================================
  */
  #recruit section {
    margin: 0 0 100px 0;
  }

  .recruitHead_img {
    background: url("../img/head_recruit.jpg") no-repeat top right/cover;
  }

  .recruitLead_wrap {
    margin-bottom: 20px;
    padding: 20px;
  }

  .recruit_lead {
    margin-bottom: 16px;
    font-size: 1.6rem;
  }

  .recruit_strong {
    font-size: 2.0rem;
  }

  .linkRecruit_blk {
    margin: 30px auto 0;
    display: block;
    width: 80%;
    height: 60px;
  }

  .linkRecruit_blk:hover {
    color: #00419A;
    border: solid 3px #00419A;
    background: #fdffd8;
  }

  /*-- 中型(4t)ドライバー募集 募集要項  --*/
  .recruit_typeTtl {
    font-size: 2.0rem;
  }

  .recruit_table th{
    width: 100%;
    padding: 10px 0;
    font-size: 1.8rem;
    display: block;
  }

  .recruit_table td{
    width: 100%;
    padding: 20px 10px;
    font-size: 1.6rem;
    display: block;
    box-sizing: border-box;
  }

  .recruit_accordion {
    width: 85vw;
    margin: 20px auto;
  }

  .accordion_header_name {
    padding: 0 70px;
  }

  .recruit_accordion .accordion_inner {
    padding: 10px;
  }

  .route_exam_txt {
    font-size: 1.6rem;
  }

  /*-- 先輩の声  --*/
  .recruit_voiceTtl {
    margin-bottom: 15px;
    padding: 10px;
    font-size: 2.0rem;
  }

  .recruit_voiceTtl::after{
    border-width: 40px 30px 0 0;
  }

  .recruit_voiceWrap {
    margin: 20px 0 40px 0;
    flex-direction: column-reverse;
  }

  .recruit_voice_name {
    margin: 10px 0;
    font-size: 1.8rem;
    color: #fff;
    text-align: right;
  }

  .recruit_voice_txt {
    width: 100%;
    font-size: 1.6rem;
    line-height: 1.8;
    margin-top: 30px;
  }

  [class*="recruit_voice_img"] {
    width: 100%;
    height: auto;
  }

  [class*="recruit_voice_img"]::before{
    content: "";
    display: block;
    padding-top: 65%;
  }

  [class*="recruit_voice_img"]::after{
    width: 100%;
    height: 100%;
    top: 16%;
    left: 5%;
    overflow: hidden;
  }

  /*
  ============================================
  下層ページ-----お問い合わせ
  ============================================
  */

  .contactBlk {
    margin: 0 0 40px 0;
    height: 250px;
    border-radius: 0;
  }

  .contactWrap .contact_txt {
    font-size: 1.8rem;
    line-height: 1.6;
    margin-bottom: 30px;
  }

  .contact_access iframe {
    height: 250px;
  }

  .contact_access {
    margin-bottom: 80px;
  }

}