@charset "UTF-8";
/*
---------------------------------------------------------------------------------------------------------------------
トラック運送
---------------------------------------------------------------------------------------------------------------------
*/
#trucking {
  max-width: 840px;
  width: 90%;
  margin: auto;
  padding-top: 60px; }
  @media (min-width: 1024px) {
    #trucking {
      padding-top: 160px; } }
  #trucking .common-title {
    text-align: center; }
  #trucking .trucking-in h3 {
    font-size: 1.25em;
    line-height: 1.4em;
    text-align: justify;
    margin: 40px auto 0; }
    @media (min-width: 1024px) {
      #trucking .trucking-in h3 {
        font-size: 2.25em;
        margin: 60px auto 0; } }
  #trucking .trucking-in .map {
    margin-top: 60px; }
    @media (min-width: 1024px) {
      #trucking .trucking-in .map {
        margin-top: 80px; } }
    #trucking .trucking-in .map ul {
      margin-bottom: 30px;
      width: 100%; }
      @media (min-width: 768px) {
        #trucking .trucking-in .map ul {
          display: flex; } }
      @media (min-width: 1024px) {
        #trucking .trucking-in .map ul {
          margin-bottom: 60px; } }
      #trucking .trucking-in .map ul:last-child {
        margin-bottom: 0; }
      #trucking .trucking-in .map ul li {
        margin-bottom: 60px; }
        @media (min-width: 768px) {
          #trucking .trucking-in .map ul li {
            width: 50%;
            margin-bottom: 0; } }
        @media (min-width: 768px) {
          #trucking .trucking-in .map ul li:first-child {
            padding-right: 5px; } }
        @media (min-width: 1024px) {
          #trucking .trucking-in .map ul li:first-child {
            padding-right: 20px; } }
        @media (min-width: 768px) {
          #trucking .trucking-in .map ul li:last-child {
            padding-left: 5px; } }
        @media (min-width: 1024px) {
          #trucking .trucking-in .map ul li:last-child {
            padding-left: 20px; } }
        #trucking .trucking-in .map ul li h4 {
          font-size: 1.0em;
          text-align: center;
          margin-top: 10px; }
          @media (min-width: 1024px) {
            #trucking .trucking-in .map ul li h4 {
              font-size: 1.375em; } }

.loop-area {
  overflow: hidden;
  position: relative;
  margin-top: 80px; }
  @media (min-width: 1250px) {
    .loop-area {
      margin-top: 120px; } }
  .loop-area .YokoScroll {
    display: flex;
    align-items: center; }
    .loop-area .YokoScroll .slideshow {
      display: flex;
      align-items: center; }
      .loop-area .YokoScroll .slideshow figure {
        margin-right: 10px; }
        @media (min-width: 1024px) {
          .loop-area .YokoScroll .slideshow figure {
            margin-right: 20px; } }
        .loop-area .YokoScroll .slideshow figure:nth-child(even) {
          width: 160px; }
          @media (min-width: 1024px) {
            .loop-area .YokoScroll .slideshow figure:nth-child(even) {
              width: 200px; } }
          @media (min-width: 1250px) {
            .loop-area .YokoScroll .slideshow figure:nth-child(even) {
              width: 400px; } }
        .loop-area .YokoScroll .slideshow figure:nth-child(odd) {
          width: 140px; }
          @media (min-width: 1024px) {
            .loop-area .YokoScroll .slideshow figure:nth-child(odd) {
              width: 170px; } }
          @media (min-width: 1250px) {
            .loop-area .YokoScroll .slideshow figure:nth-child(odd) {
              width: 340px; } }
        .loop-area .YokoScroll .slideshow figure img {
          border-radius: 10px; }
          @media (min-width: 1024px) {
            .loop-area .YokoScroll .slideshow figure img {
              border-radius: 15px; } }
          @media (min-width: 1250px) {
            .loop-area .YokoScroll .slideshow figure img {
              border-radius: 20px; } }
      .loop-area .YokoScroll .slideshow.show1 {
        animation: loop-slide1 80s infinite linear 1s both; }
@keyframes loop-slide1 {
  from {
    transform: translateX(0); }
  to {
    transform: translateX(-100%); } }
/*
---------------------------------------------------------------------------------------------------------------------
保有車両
---------------------------------------------------------------------------------------------------------------------
*/
#retention {
  max-width: 1000px;
  width: 100%;
  margin: auto;
  padding-top: 60px; }
  @media (min-width: 1024px) {
    #retention {
      padding-top: 160px; } }
  #retention .common-title {
    text-align: center; }
  #retention .retention-table {
    overflow: scroll;
    margin-top: 30px;
    padding: 0 5% 20px 5%; }
    @media (min-width: 1024px) {
      #retention .retention-table {
        margin-top: 60px;
        padding: 0 2.5%; } }
    @media (min-width: 1250px) {
      #retention .retention-table {
        padding: 0; } }
    #retention .retention-table table {
      border-collapse: collapse;
      width: 100%;
      min-width: 600px; }
      #retention .retention-table table th, #retention .retention-table table td {
        font-size: 0.9em;
        padding: 5px;
        text-align: center; }
        @media (min-width: 1024px) {
          #retention .retention-table table th, #retention .retention-table table td {
            font-size: 1.0em;
            padding: 10px 0; } }
      #retention .retention-table table th {
        border-top: solid 1px #008442;
        border-bottom: solid 1px #008442;
        color: #008442; }
        #retention .retention-table table th.first:first-child {
          border-right: solid 1px #008442; }
        #retention .retention-table table th.first:last-child {
          border-left: solid 1px #008442; }
      #retention .retention-table table td {
        border-bottom: solid 1px #B9B9B9; }
        #retention .retention-table table td.first {
          width: 25%;
          border-right: solid 1px #B9B9B9; }
        #retention .retention-table table td.second {
          width: 25%; }
        #retention .retention-table table td:nth-last-child(4) {
          width: 12.5%; }
        #retention .retention-table table td:nth-last-child(3) {
          width: 12.5%; }
        #retention .retention-table table td:nth-last-child(2) {
          width: 12.5%; }
        #retention .retention-table table td:last-child {
          width: 12.5%;
          border-left: solid 1px #B9B9B9; }
        #retention .retention-table table td.last {
          text-align: right;
          padding-right: 3%; }

/*
---------------------------------------------------------------------------------------------------------------------
車両紹介
---------------------------------------------------------------------------------------------------------------------
*/
#vehicle {
  padding: 80px 0 100px;
  margin-top: 60px;
  background-color: #008442; }
  @media (min-width: 1024px) {
    #vehicle {
      padding: 120px 0 100px;
      margin-top: 160px; } }
  #vehicle .vehicle-in {
    max-width: 1200px;
    width: 90%;
    margin: auto; }
  #vehicle .common-title {
    text-align: center; }
    #vehicle .common-title h3, #vehicle .common-title h2 {
      color: #fff; }
  #vehicle .vehicle-list {
    margin-top: 60px; }
    #vehicle .vehicle-list .o-4column .col-lg-4 {
      padding: 0 10px; }
    #vehicle .vehicle-list .o-4column {
      margin: 0 -10px; }
    @media only screen and (min-width: 768px) {
      #vehicle .vehicle-list .o-4column .col-lg-4 {
        padding: 0 15px; }
      #vehicle .vehicle-list .o-4column {
        margin: 0 -15px; } }
    @media only screen and (min-width: 1250px) {
      #vehicle .vehicle-list .o-4column .col-lg-4 {
        padding: 0 20px; }
      #vehicle .vehicle-list .o-4column {
        margin: 0 -20px; } }
    #vehicle .vehicle-list .vehicle-box {
      margin-bottom: 40px; }
      #vehicle .vehicle-list .vehicle-box img {
        border-radius: 10px; }
        @media (min-width: 1024px) {
          #vehicle .vehicle-list .vehicle-box img {
            border-radius: 20px; } }
      #vehicle .vehicle-list .vehicle-box p {
        font-size: 0.9em;
        font-weight: bold;
        color: #fff;
        margin-top: 5px; }
        @media (min-width: 1024px) {
          #vehicle .vehicle-list .vehicle-box p {
            font-size: 1.0em; } }
      #vehicle .vehicle-list .vehicle-box h6 {
        font-size: 0.8em;
        font-weight: normal;
        color: #fff;
        margin-top: 2px; }
        @media (min-width: 1024px) {
          #vehicle .vehicle-list .vehicle-box h6 {
            font-size: 0.9em; } }