@charset "utf-8";

/* ==========================================================
 common
========================================================== */

/* box-transport-02
---------------------------------------------------------- */
.box-transport-02 .row {
  margin-bottom: 40px;
}
.box-transport-02 .row:last-child {
  margin-bottom: 0;
}
  .box-transport-02 .row::before,
  .box-transport-02 .row::after {
    content: '';
    display: table;
  }
  .box-transport-02 .row::after {
    clear: both;
  }
.box-getting {
  height: 200px;
  border: 10px solid #ddd;
  padding: 0 30px;
  position: relative;
}
.box-getting::before,
.box-getting::after {
  content: '';
  display: table;
}
.box-getting::after {
  clear: both;
}
  .box-getting .image {
    position: absolute;
    top: -30px;
    right: 9px;
  }
  .box-getting .box-title {
    position: absolute;
    top: 50%;
    transform: translateY(-60%);
  }
    .box-getting .box-title .ttl-title {
      font-size: 60px;
      font-weight: normal;
      font-family: 'Oswald', sans-serif;
      line-height: 1.2;
      letter-spacing: -0.035em;
    }
    .box-getting .box-title .txt-mute {
      font-size: 24px;
      font-weight: normal;
      letter-spacing: 0;
      font-family: 'Oswald', sans-serif;
    }
  .box-goto-group {
    width: 550px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -240px;
    transform: translateY(-50%);
  }
    .box-goto-group::before,
    .box-goto-group::after {
      content: '';
      display: table;
    }
    .box-goto-group::after {
      clear: both;
    }
    .box-goto-group a {
      height: 90px;
      color: #007ac2;
      font-size: 16px;
      font-family: 'Oswald', sans-serif;
      letter-spacing: 0.3px;
      line-height: 1.2;
      text-align: left;
      border: 1px solid #007ac2;
      border-radius: 3px;
      text-decoration: none;
      margin-right: 20px;
      float: left;
      position: relative;
      transition: all .2s ease-in-out;
      transform: translateZ(0);
    }
      .box-goto-group a:last-child {
        margin-right: 0;
      }
      .box-goto-group a:hover {
        opacity: .8;
      }
      .box-goto-group a span {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
      }
      .box-goto-group .link-goto-shinjuku.type-01 {
        width: 230px;
      }
      .box-goto-group .link-goto-shinjuku.type-01::before {
        content: '';
        width: 28px;
        position: absolute;
        top: 0;
        left: 23px;
        bottom: 0;
        background-image: url('/wordpress/wp-content/themes/odakyu/common/img/getting-around/icon_airplane.png');
        background-repeat: no-repeat;
        background-size: 28px 28px;
        background-position: center center;
      }
      .box-goto-group .link-goto-shinjuku.type-02 {
        width: 290px;
      }
        .box-goto-group .link-goto-shinjuku.type-02::before {
          content: '';
          width: 35px;
          position: absolute;
          top: 0;
          left: 23px;
          bottom: 0;
          background-image: url('/wordpress/wp-content/themes/odakyu/common/img/getting-around/icon_shinkansen.png');
          background-repeat: no-repeat;
          background-size: 35px 29px;
          background-position: center center;
        }
          .box-goto-group .link-goto-shinjuku.type-02 span {
            margin-left: 35px;
          }
.box-transport-02 .row.type-02,
.box-transport-02 .row.type-03 {
  margin: 0 -15px 40px;
}
.box-transport-02 .row .box-col a {
  transition: all .2s ease-in-out;
  display: block;
}
  .box-transport-02 .row .box-col a:hover {
    opacity: .8;
  }
.box-transport-02 .row.type-02 .box-col,
.box-transport-02 .row.type-03 .box-col {
  width: calc(50%);
  padding: 0 15px;
  float: left;
}
  .box-transport-02 .row.type-02 .box-col:last-child,
  .box-transport-02 .row.type-03 .box-col:last-child {
    margin-right: 0;
  }
.box-transport-02 .row.type-03 .box-col {
  width: calc(33.33%);
}

.box-transport-02 .box-col .box-title {
  padding: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.box-transport-02 .type-03 .box-getting {
  height: 175px;
}

.box-getting .box-title .ttl-title,
.box-getting .box-title .ttl-title.type-01 {
  font-size: 44px;
}
.box-getting .box-title .ttl-title.type-02 {
  font-size: 44px;
}
.box-getting .box-title .ttl-title.type-03 {
  font-size: 44px;
}
.box-getting .box-title .ttl-title.type-04 {
  font-size: 28px;
}
.box-getting .box-title .ttl-title.type-05 {
  font-size: 44px;
}

@media only screen and (max-width: 768px) {
.box-transport-02 .row {
 margin-bottom: 30px; 
}
.box-goto-group {
  width: 100%;
  position: relative;
  top: 80px;;
  left: auto;
  margin-left: 0;
  transform: none;
}
.box-transport-02 .row.type-01 .box-getting .image {
  width: 90px;
  height: 90px;
}
.box-transport-02 .row.type-02 .box-getting .image {
  width: 75px;
  height: 75px;
}
.box-transport-02 .row.type-03 .box-getting .image {
  width: 55px;
  height: 55px;
}
  .box-transport-02 .row.type-01 .box-getting .image img,
  .box-transport-02 .row.type-02 .box-getting .image img,
  .box-transport-02 .row.type-03 .box-getting .image img {
    width: 100%;
    display: block;
  }
.box-getting .box-title {
  top: 45px;
}
  .box-getting .box-title .ttl-title,
  .box-getting .box-title .ttl-title.type-01 {
    font-size: 35px;
  }
  .box-getting .box-title .ttl-title.type-02 {
    font-size: 29px;
  }
  .box-getting .box-title .ttl-title.type-03 {
    font-size: 21px;
  }
  .box-getting .box-title .ttl-title.type-04 {
    font-size: 14px;
    font-weight: 500;
  }
  .box-getting .box-title .ttl-title.type-05 {
    font-size: 20px;
  }

  .box-transport-02 .row.type-01 .box-getting .box-title .ttl-title {
    font-size: 35px;
    display: inline-block;
  }
  .box-getting .box-title .txt-mute {
    font-size: 12px;
    display: inline-block;
  }
.box-transport-02 {
  padding: 0 15px;
}
.box-transport-02 .row.type-02,
.box-transport-02 .row.type-03 {
  margin: 0 -3.75px 30px;
}
.box-transport-02 .row.type-02 .box-col,
.box-transport-02 .row.type-03 .box-col {
  padding: 0 3.75px;
}
.box-getting {
  height: 165px;
  border: 5px solid #ddd;
  padding: 0 15px;
}
  .box-transport-02 .row.type-02 {
    margin-bottom: 30px;
  }
  .box-transport-02 .row.type-02 .box-getting {
    height: 100px;
  }
  
.box-transport-02 .type-03 .box-getting {
  height: 125px;
}
.box-goto-group .link-goto-shinjuku.type-01 {
  width: 39.34426229508197%;
  margin-right: 10px;
}
.box-goto-group .link-goto-shinjuku.type-02 {
  width: 55.97541%;
}
.box-goto-group a {
  font-size: 10px;
  height: 60px;
}
.box-goto-group .link-goto-shinjuku.type-01 span {
  margin-left: 45px;
  justify-content: flex-start;
}
.box-goto-group .link-goto-shinjuku.type-02 span {
  margin-left: 50px;
  justify-content: flex-start;
}
.box-goto-group .link-goto-shinjuku.type-01::before {
  content: '';
  width: 20px;
  top: 0;
  left: 15px;
  background-size: 20px 20px;
}
.box-goto-group .link-goto-shinjuku.type-02::before {
  width: 24px;
  left: 15px;
  background-size: 24px 20px;
}

}

@media only screen and (max-width: 320px) {
  .box-goto-group .link-goto-shinjuku.type-01 {
    width: 44.34426229508197%;
  }
  .box-goto-group .link-goto-shinjuku.type-02 {
    width: 50.97541%;
  }
}

/* box-faq
---------------------------------------------------------- */
.box-faq {
  margin-top: 40px;
}
.box-faq .txt-question {
  color: #fff;
  background: #f88932 url(/wordpress/wp-content/themes/odakyu/common/img/support/wifi/ico_question_01.png) 13px center no-repeat;
  font-size: 18px;
  font-family: 'Oswald', sans-serif;
  letter-spacing: 0.8px;
  padding: 30px 38px;
}
.box-faq .txt-answer {
  background: #fef3ea url(/wordpress/wp-content/themes/odakyu/common/img/support/wifi/ico_answer_01.png) 13px top no-repeat;
  font-size: 18px;
  font-family: 'Oswald', sans-serif;
  letter-spacing: 0.5px;
  padding: 30px 38px;
}

@media screen and (max-width: 768px) {
.box-faq { margin-top: 10px;}
  .box-faq .txt-question {
    color: #fff;
    background: #f88932 url(/wordpress/wp-content/themes/odakyu/common/img/support/wifi/ico_question_01.png) 6px center no-repeat;
    -webkit-background-size: 22px auto;
    background-size: 22px auto;
    font-size: 12px;
    letter-spacing: 0.5px;
    padding: 14px 20px 16px;
  }
  .box-faq .txt-answer {
    background: #fef3ea url(/wordpress/wp-content/themes/odakyu/common/img/support/wifi/ico_answer_01.png) 6px top no-repeat;
    -webkit-background-size: 22px auto;
    background-size: 22px auto;
    font-size: 12px;
    letter-spacing: 0.25px;
    padding: 14px 20px 16px;
  }
}
.box-faq.type-02 .txt-question {
  background-color: #6b7c90 !important;
}
.box-faq.type-02 .txt-answer {
  background-color: #f0f2f4 !important;
}
.box-faq.type-03 .txt-question {
  background-color: #f9c231 !important;
}
.box-faq.type-03 .txt-answer {
  background-color: #fbf7eb !important;
}
.box-faq.type-04 .txt-question {
  background-color: #c2af8f !important;
}
.box-faq.type-04 .txt-answer {
  background-color: #fdf9f1 !important;
}

/* box-faq-wrap
---------------------------------------------------------- */
.box-faq-wrap {
  width: 1080px;
  margin: 0 auto 60px;
}
.box-accordian-wrap {
  border: 0;
}
  .box-faq-wrap .ttl-accordian {
    position: relative;
    text-align: left;
  }
  .box-faq-wrap .ttl-accordian::before,
  .box-faq-wrap .ttl-accordian::after {
    position: absolute;
    content: '';
    background-color: #fff;
    -webkit-transition: all 0.2s ease 0s;
    -o-transition: all 0.2s ease 0s;
    transition: all 0.2s ease 0s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  .ttl-accordian.is-open::before {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    opacity: 0;
  }
  .ttl-accordian.is-open::after {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
  }
    .ttl-accordian::before {
      top: 40px;
      right: 37px;
      width: 40px;
      height: 3px;
      opacity: 1;
    }
    .ttl-accordian::after {
      top: 21px;
      right: 55px;
      width: 3px;
      height: 40px;
    }
.box-faq-02 {
  border-top: 1px solid #dddbcf;
}
@media screen and (max-width: 768px) {
  .box-faq-wrap {
    width: 100%;
    margin-bottom: 30px;
  }
    .box-faq-wrap .ttl-accordian {
      min-height: 56px;
      text-align: left;
      padding: 0 20px;
      display: flex;
      align-items: center;
    }
    .box-faq-wrap .ttl-accordian::after {
      top: 50%;
      right: 21px;
      width: 1px;
      height: 15px;
      margin-top: -7.5px;
    }
    .box-faq-wrap .ttl-accordian::before {
      width: 15px;
      height: 1px;
      top: 50%;
      right: 14px;
      margin-top: -.5px;
    }
  .box-accordian-wrap .ttl-cmn-01 .button {
    right: 15px;
  }
}

/* list-faq-02
---------------------------------------------------------- */
.list-faq-02 {}
.list-faq-02 .item {}
  .list-faq-02 .item .box-question {
    background-color: #ff812c;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
  }
    .list-faq-02 .item .box-question .ico-question {
      -webkit-flex: 0 1;
      -ms-flex: 0 1;
      flex: 0 1;
      color: #fff;
      font-size: 18px;
      font-family: 'Oswald', sans-serif;
      letter-spacing: 1px;
      padding: 45px 0 45px 40px;
    }
    .list-faq-02 .item .box-question .txt-question {
      -webkit-flex: 1 0;
      -ms-flex: 1 0;
      flex: 1 0;
      color: #fff;
      font-size: 18px;
      font-family: 'Oswald', sans-serif;
      font-weight: normal;
      letter-spacing: 0.5px;
      padding: 45px 45px 45px 60px;
    }
  .list-faq-02 .item .box-answer {
    background-color: rgba(255, 129, 44, 0.1);
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
    .list-faq-02 .item .box-answer .ico-answer {
      -webkit-flex: 0 1;
      -ms-flex: 0 1;
      flex: 0 1;
      font-size: 18px;
      font-family: 'Oswald', sans-serif;
      letter-spacing: 1px;
      padding: 43px 0 43px 40px;
    }
      .list-faq-02 .item .box-answer .txt-answer .link { text-decoration: underline;}
        .list-faq-02 .item .box-answer .txt-answer .link:hover,
        .list-faq-02 .item .box-answer .txt-answer .link:focus { text-decoration: none;}
    .list-faq-02 .item .box-answer .txt-answer {
      -webkit-flex: 1 0;
      -ms-flex: 1 0;
      flex: 1 0;
      font-weight: normal;
      line-height: 1.9;
      letter-spacing: 0.45px;
      padding: 43px 45px 43px 60px;
    }
@media screen and (max-width: 768px) {
.list-faq-02 {}
  .list-faq-02 .item {}
    .list-faq-02 .item .box-question {
      background-color: #ff812c;
      display: -webkit-flex;
      display: -ms-flex;
      display: flex;
      -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      width: 100%;
    }
      .list-faq-02 .item .box-question .ico-question {
        font-size: 12px;
        padding: 15px 0 20px 20px;
      }
      .list-faq-02 .item .box-question .txt-question {
        font-size: 12px;
        letter-spacing: 0.6px;
        padding: 15px 26px 20px 20px;
      }
    .list-faq-02 .item .box-answer {
      background-color: rgba(255, 129, 44, 0.1);
      display: -webkit-flex;
      display: -ms-flex;
      display: flex;
      -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
    }
      .list-faq-02 .item .box-answer .ico-answer {
        font-size: 12px;
        letter-spacing: 1px;
        padding: 15px 0 15px 20px;
      }
      .list-faq-02 .item .box-answer .txt-answer {
        font-size: 11px;
        line-height: 1.7;
        letter-spacing: 0.3px;
        padding: 15px 26px 17px 20px;
      }
}

/* ==========================================================
 Common 2
========================================================== */


/* box-cmn-related
---------------------------------------------------------- */
.box-cmn-related {
  width: 100%;
  position: relative;
}
  .box-cmn-related .inner {
    width: 1080px;
    margin: 0 auto;
  }
    .box-cmn-related .inner .ttl-cmn-01 {
      margin-bottom: 35px;
    }
  .box-cmn-related .list-related {
    margin: 0 -23px;
    overflow: hidden;
  }
    .box-cmn-related .list-related a {
      height: 100%;
      transition: opacity 0.2s ease-in-out;
      display: block;
      overflow: hidden;
    }
    .box-cmn-related .list-related .item {
      width: 33.33%;
      min-height: 90px;
      padding: 0 23px;
      margin-bottom: 50px;
      overflow: hidden;
      float: left;
    }
    .box-cmn-related .list-related .item:last-child,
    .box-cmn-related .list-related .item:nth-last-child(2),
    .box-cmn-related .list-related .item:nth-last-child(3) {
      margin-bottom: 0;
    }
    .box-cmn-related .list-related .item:nth-child(3n):not(:last-child) {
      margin-bottom: 50px;
    }
      .box-cmn-related .list-related .item:hover a {
        opacity: .8;
      }
      .box-cmn-related .list-related .item .image {
        max-width: 100px;
        float: left;
      }
        .box-cmn-related .list-related .item .image img {
          width: 100%;
          display: block;
        }
      .box-cmn-related .list-related .item dl {
        width: calc(100% - 100px);
        height: 100%;
        background-color: #44b3d5;
        overflow: hidden;
        float: left;
      }
      .box-cmn-related .list-related .item dt {
        width: 100%;
        height: 100%;
        min-height: 90px;
        padding: 10px 34px;
        display: flex;
        align-items: center;
      }
      .box-cmn-related .list-related .item dt,
      .box-cmn-related .list-related .item dd {
        color: #fff;
        font-family: 'Oswald', sans-serif;
        font-size: 18px;
        letter-spacing: .5px;
        font-weight: 300;
        line-height: 1.2;
      }
    .box-cmn-related .list-related .item.type-02 dl {
      background-color: #e25d4b;
    }
    .box-cmn-related .list-related .item.type-03 dl {
      background-color: #007ac2;
    }
    .box-cmn-related .list-related .item.type-04 dl {
      background-color: #004ea2;
    }

@media screen and (max-width: 768px) {
  .box-cmn-related .inner {
    width: 100%;
    padding: 0 15px;
  }
    .box-cmn-related .list-related {
      margin:  0 -7.5px;
    }
      .box-cmn-related .list-related .item {
        width: 50%;
        min-height: 45px;
        padding: 0 7.5px;
        margin-bottom: 15px;
      }
      .box-cmn-related .list-related .item:nth-last-child(2),
      .box-cmn-related .list-related .item:nth-last-child(3) {
        margin-bottom: 15px;
      }
      .box-cmn-related .list-related .item:last-child {
        margin-bottom: 0;
      }
        .box-cmn-related .list-related .item .image {
          max-width: 50px;
        }
        .box-cmn-related .list-related .item dl {
          width: calc(100% - 50px);
        }
        .box-cmn-related .list-related .item dt {
          min-height: 45px;
          font-size: 12px;
          padding: 5px 7px;
        }
        .box-cmn-related .list-related .item:nth-child(3n):not(:last-child) {
          margin-bottom: 15px;
        }
}

@media screen and (max-width: 320px) {
  .box-cmn-related .list-related .item dt {
    font-size: 9px;
  }
}


/* ==========================================================
 Getting Around
========================================================== */
/* box-cmn-romancercar
---------------------------------------------------------- */
.box-cmn-romancacer {
  margin-top: 60px;
  margin-bottom: 60px;
}
@media only screen and (max-width: 768px) {
  .box-cmn-romancacer {
    margin-top: 30px;
    margin-bottom: 30px;
  }
}

/* helper
---------------------------------------------------------- */
.image-container {
  display: block;
  background-position: center center;
  background-size: cover;
  float: left;
}