@charset "utf-8";

@font-face {
    font-family: sans-serif;
    src: local(HiraginoSans-W3);
    font-weight: normal;
}
@font-face {
    font-family: sans-serif;
    src: local(HiraginoSans-W6);
    font-weight: bold;
}
@font-face {
    font-family: 'Hiragino Kaku Gothic Pro W3';
    src: local(HiraginoSans-W3);
    font-weight: normal;
}
@font-face {
    font-family: 'Hiragino Kaku Gothic Pro W3';
    src: local(HiraginoSans-W6);
    font-weight: bold;
}
@font-face {
    font-family: 'ヒラギノ角ゴ Pro W3';
    src: local(HiraginoSans-W3);
    font-weight: normal;
}
@font-face {
    font-family: 'ヒラギノ角ゴ Pro W3';
    src: local(HiraginoSans-W6);
    font-weight: bold;
}
@font-face {
    font-family: 'ヒラギノ角ゴ ProN W3';
    src: local(HiraginoSans-W3);
    font-weight: normal;
}
@font-face {
    font-family: 'ヒラギノ角ゴ ProN W3';
    src: local(HiraginoSans-W6);
    font-weight: bold;
}

/* PC */
@media only screen and (min-width: 1140px) {
  /* override common_r */
  .main-image .showPC {
    display: block !important;
    visibility: visible !important;
  }
  .main-image .showSP {
    display: none !important;
  }
  #mainImg img,
  #mainImg p img,
  #main img {
    width: auto;
    height: auto;
  }

  h1 {
    background-color: transparent !important;
    padding: 0;
  }
  h2,
  h3 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    border-bottom: none !important;
    padding-bottom: 0 !important;
    color: inherit !important;
  }
  h4 {
    margin-top: 0 !important;
    border-left: none;
    padding-left: 0;
  }
  #main p {
    margin-top: 0;
  }
  .attention {
    position: static;
    padding: 0;
    border: none;
    font-size: inherit;
    font-weight: inherit;
  }
  .price, .price span {
    font-size: inherit;
    font-weight: inherit;
    margin-top: 0;
    color: inherit;
    white-space: normal;
  }
  p {
    color: #333;
  }
  figure {
    margin: 0;
  }

  /* wrapper */
  body {
    min-width: 1140px;
  }

  /* copy from /car/commons/css/base.css */
  .contents {
  	margin-left: auto;
    margin-right: auto;
    padding-left: 10px;
    padding-right: 10px;
    width: 100%;
    max-width: 980px;
  }

  /* copy from /car/commons/css/catalog/layout.css */
  #mainContents p {
    line-height: 1.6em;
    padding-top: 10px;
  }
  #mainContents h2, #mainContents h3, #mainContents h4, #mainContents h5, #mainContents h6, #mainContents p {
    padding-top: 10px;
    clear: both;
  }
  #mainContents ul, #mainContents ol {
    padding-top: 10px;
    line-height: 1.57em;
  }

  /* copy from width attribute */
  .passing-txt img,
  .feature__point,
  .feature__safetyKv img,
  .feature__safety img,
  .feature__col img,
  .feature__sscs img,
  .tab__link--carry img,
  .tab__link--superCarry img,
  .tab__figure img,
  .feature__icon img,
  .price__product img,
  .price__details img,
  .modalFeature img,
  .appeal__item img {
    width: 100% !important;
  }
  #sec0 .passing-txt img {
    max-width: 525px;
  }
  #sec0 .feature__point {
    max-width: 90px;
  }
  #sec1 .passing-txt img {
    max-width: 430px;
  }
  #sec1 .feature__point {
    max-width: 105px;
  }
  #sec2 .passing-txt img {
    max-width: 507px;
  }
  #sec2 .feature__point {
    max-width: 112px;
  }
  #sec3 .passing-txt img {
    max-width: 693px;
  }
  #sec3 .feature__point {
    max-width: 113px;
  }
  .feature__safetyKv img {
    display: block;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: -40px;
  }
  .feature__col:first-child h4 img {
    max-width: 221px;
  }
  .feature__col:last-child h4 img {
    max-width: 332px;
  }
  .feature__sscs img {
    max-width: 640px;
  }
  .tab__movieItem > img {
    width: 260px !important;
  }
  .tab__movieBtn img {
    width: 82px !important;
  }
  .feature__icon img {
    max-width: 147px;
  }
  #lineUp .passing-txt img {
    max-width: 145px;
  }
  .price__product img {
    max-width: 340px;
  }
  .price__priceDetails img {
    max-width: 60px;
  }
  .price__performanceDetails > img {
    max-width: 158px;
  }
  .price__performanceDetails .price__block1 img {
    width: 256px;
  }
  .appeal__item img {
    max-width: 160px;
  }

  /* copy from /car/carry/home/css/index.css */
  .tvcm__caption,
  .tab__movieCaption,
  .color__name,
  .price,
  .feature,
  .modalFeature,
  .price__footer {
      font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
      -moz-osx-font-smoothing: grayscale;
      -webkit-font-smoothing: antialiased;
      letter-spacing: 0.05em;
  }

  hr {
      border-width: 0;
      position: relative;
  }

  hr::before {
      content: '';
      position: relative;
      background-color: #eee8de;
      width: 100%;
      height: 2px;
      left: 0;
      top: 0;
      z-index: 1;
      display: block;
  }

  .w-100 {
      width: 100%;
  }

  small {
      font-size: 11px;
      line-height: 1;
      display: inline-block;
      position: relative;
      top: -3px;
  }

  strong {
      font-weight: bold;
  }

  div.title {
      position: relative;
      display: block;
      text-align: center;
  }

  #stage {
      overflow-x: hidden;
  }

  .title__text {
      position: relative;
      padding: 0 0 10px !important;
      display: inline-block;
  }

  .title--default .title__text {
      font-size: 26px;
  }

  .title__text::before {
      content: '';
      width: 100%;
      height: 2px;
      position: absolute;
      bottom: -1px;
      left: 0;
      background-color: #000;
  }

  .title__subtitle {
      color: #9e7a47;
      font-size: 16px;
      margin-top: 15px;
      text-align: center;
      display: block;
  }

  #mainContents a {
      cursor: pointer;
  }

  #scrollDown {
      display: none !important;
  }

  #followMenu {
      top: auto;
  }

  #followMenu.fixed {
      position: fixed !important;
      top: 0 !important;
  }

  .tvcm {
      position: relative;
      text-align: center;
  }

  .tvcm__scroll {
      height: 360px;
      width: 100%;
      overflow: hidden;
  }

  #mainContents .tvcm__scroll ul {
      padding-top: 0;
      line-height: 1;
  }

  .tvcm__scroll li {
      float: left;
  }

  .tvcm__btnWrap {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
  }

  .tvcm__btn {
      position: relative;
      margin-bottom: -10px;
      background-color: transparent;
      outline: none;
      cursor: pointer;
      transition: opacity .3s;
  }

  .tvcm__btn:hover {
      opacity: .7;
  }

  .tvcm__caption {
      margin-top: 16px;
      font-size: 16px;
  }

  .tvcm__caption strong {
      display: inline-block;
      margin-bottom: 12px;
      font-size: 20px;
  }

  .hidden {
      display: none !important;
  }

  .feature {
      margin: 110px auto;
  }

  .feature h2,
  .feature h3,
  .feature h4 {
      text-align: center;
  }

  .feature h2,
  .feature h3 {
      margin-bottom: 20px !important; /* override common_r */
  }

  .feature__section {
      width: 980px;
      margin: 140px auto;
  }

  #mainContents .feature__icon {
      text-align: center;
      margin-bottom: 40px;
      padding-top: 8px;
  }

  .feature__icon li {
      display: inline-block;
  }

  .feature__point {
      margin: 0 0 24px;
  }

  .feature__lineup {
      width: 1140px;
      margin: 0 auto;
  }

  .feature__lineup h3 {
      margin-bottom: 0 !important;
  }

  .feature__lineup img {
    max-width: 100% !important;
  }

  #mainContents .feature__lineup li {
    float: left;
    width: 570px;
  }

  .feature__enclosure {
      padding: 40px;
      background-color: #f1ede2;
  }
  .feature__enclosure + .feature__enclosure {
      margin-top: 10px;
  }
  .feature__enclosure h4 {
      margin-bottom: 40px;
  }

  .feature__row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-right: -24px;
      margin-bottom: 20px;
  }
  .feature__row:last-child {
      margin-bottom: 0;
  }


  .feature__row--point04 {
      display: flex;
      margin-right: -50px;
      position: relative;
  }

  .feature__row--point04 .feature__col--txt {
      padding-top: 20px;
  }

  .feature__section > .feature__row--point04:nth-of-type(1) {
      z-index: 2;
  }

  .feature__section > .feature__row--point04:nth-of-type(2) {
      z-index: 1;
      margin-top: -59px;
      padding-top: 108px;
  }
  .feature__section > .feature__row--point04:nth-of-type(2):before {
      content: "";
      position: absolute;
      display: block;
      top: 1px;
      right: -9999px;
      left: -9999px;
      height: 72px;
      background-color: #f1ede2;
  }

  .feature__row--inner {
      display: flex;
      margin-left: -30px;
      margin-right: 50px;
  }

  .feature__row--point04 > .feature__col:nth-child(1) {
      position: relative;
  }

  .feature__row--point04 > .feature__col:nth-child(1):after {
      content: "";
      position: absolute;
      top: 0;
      right: 23px;
      bottom: 0;
      border-left: solid 2px #f1ede2;
  }

  .feature__enclosure .feature__col {
      width: 378px;
      margin-right: 24px;
      position: relative;
  }

  .feature__enclosure .feature__col--txt {
      width: 340px;
      margin-right: 24px;
      position: relative;
  }
  #mainContents .feature__col h4 {
      text-align: left;
      margin: -5px 0 20px;
      padding: 0;
      font-size: 22px;
      font-weight: bold;
      line-height: 1.5;
  }

  #mainContents .feature__col--txt h4 {
      text-align: left;
      margin: -5px 0 0;
      padding: 0;
      font-size: 22px;
      font-weight: bold;
      line-height: 1.5;
      letter-spacing: 0.025em;
  }

  #mainContents .feature__col--txt h4 strong {
      font-size: 30px;
  }

  #mainContents .feature__col--txt p:first-of-type {
      line-height: 1.75;
      text-align: justify;
      font-size: 16px;
  }

  .feature__enclosure .feature__col--img {
      width: 380px;
      margin-right: 24px;
      text-align: center;
  }

  .feature__enclosure .feature__col--img:first-child {
      margin-top: -20px;
      margin-bottom: -20px;
  }

  .feature__row--point04 .feature__col--txt {
      width: 400px;
      margin-right: 50px;
  }

  .feature__row--inner .feature__col {
      width: 216px;
      margin-left: 30px;
      font-size: 16px;
  }

  .feature__notes {
      font-size: 10px;
      letter-spacing: 0.025em;
  }

  div.feature__row + .feature__notes {
      margin: -20px 0 10px;
  }

  ul.feature__row + .feature__notes {
      margin-top: -10px;
  }


  ul.feature__notes {
      width: 620px;
      margin: 20px auto;
  }

  .feature__notes--center {
      font-size: 10px;
      text-align: center;
      margin: 30px 0 -10px;
      letter-spacing: 0.025em;
  }

  .feature__btn {
      position: absolute;
      top: 73px;
      left: 50%;
      margin-left: -47px;
      background-color: transparent;
      cursor: pointer;
      outline: none;
  }

  .feature__sscs {
      margin: 20px 0 50px !important;
      text-align: center;
  }

  .feature__sscs a {
      transition: .3s;
  }

  .feature__sscs a:hover {
      opacity: .7;
  }

  #sec1 .feature__safety {
    background-color: #fff;
    margin-top: 40px;
    padding: 50px 40px;
  }

  #sec1 .feature__safety .feature__safety-ttl {
    display: block;
    width: 268px;
    margin-left: auto;
    margin-right: auto;
  }

  #sec1 .feature__safety .feature__safety-txt {
    display: block;
    font-size: 15px;
    text-align: center;
    color: #036EB7;
    font-weight: bold;
    padding-top: 30px;
  }

  #sec1 .feature__safety .feature__safety-point {
    display: block;
    margin-top: 40px;
  }

  #sec1 .feature__notes {
    display: block;
    padding-left: 60px;
    padding-right: 60px;
    padding-top: 30px;
  }

  #mainContents .feature__col--txt h4 sup {
      font-size: 0.6em;
      bottom: 0.9ex;
  }

  .tab__list {
      display: flex;
      width: 980px;
      height: 152px;
      margin: 0 auto;
      padding-top: 0 !important;
  }

  .tab__list li {
      width: 490px;
  }

  .tab__link--carry ,
  .tab__link--superCarry {
      position: relative;
      cursor: pointer;
  }

  .tab__link--carry img,
  .tab__link--superCarry  img{
      z-index: 1;
      opacity: 0;
  }

  .tab__link--carry.is-active ,
  .tab__link--superCarry.is-active {
      cursor: default;
  }

  .tab__link--carry.is-active img ,
  .tab__link--superCarry.is-active img {
      opacity: 1;
  }

  .tab__link--carry::before ,
  .tab__link--superCarry::before {
      content: "";
      position: absolute;
      top: 58px;
      bottom: -1px;
      z-index: -1;
      width: 485px;
      transition: .3s;
  }

  .tab__link--carry::before  {
      left: 0;
      right: 5px;
      background-color: #172a88;
  }

  .tab__link--superCarry::before {
      left: 5px;
      right: 0;
      background-color: #f18d00;
  }

  .tab__link--carry::after ,
  .tab__link--superCarry::after {
      content: "";
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 2;
  }

  .tab__link--carry::after {
      background: url(/car/carry/home/img/tab_ttl_carry_off.png) no-repeat left bottom;
      background-size: 485px auto;
  }

  .tab__link--superCarry::after {
      background: url(/car/carry/home/img/tab_ttl_superCarry_off.png) no-repeat right bottom;
      background-size: 485px auto;
  }

  .tab__link--carry:hover::before ,
  .tab__link--superCarry:hover::before {
      top: 32px;
  }

  .tab__link--carry.is-active::after ,
  .tab__link--superCarry.is-active::after {
      opacity: 0;
  }


  .tab__content {
      overflow: hidden;
      padding: 50px 0 30px;
  }

  .tab__content--carry {
      background-color: #172a88;
  }

  .tab__content--superCarry {
      background-color: #f18d00;
  }

  .tab__contentInner {
      width: 980px;
      margin: 0 auto;
  }

  .tab__figure {
      position: relative;
  }

  #mainContents .tab__figure ul {
      padding: 0;
  }

  .tab__comment {
      display: block;
      position: absolute;
      width: 160px;
      height: 74px;
      padding-top: 23px;
      text-align: center;
      background-color: #fff;
      border-radius: 5px;
      box-sizing: border-box;
      transition: all .3s;
      box-shadow: 0 0 10px 0 rgba(0,0,0,.2);
      cursor: pointer;
  }

  .tab__comment--01 {
      bottom: 54px;
      left: 26px;
  }

  .tab__comment--02 {
      bottom: 284px;
      right: 172px;
  }

  .tab__comment--03 {
      right: 70px;
      bottom: 20px;
  }

  .tab__comment--04 {
      bottom: 230px;
      left: 363px;
  }

  .tab__comment--05 {
      right: 30px;
      bottom: 248px;
  }

  .tab__comment--06 {
      right: 227px;
      bottom: 26px;
  }

  .tab__comment:before {
      content: "";
      display: block;
      position: absolute;
      top: -16px;
      left: 50%;
      margin-left: -16px;
      width: 32px;
      height: 32px;
      border-radius: 51%;
  }

  .tab__content--carry .tab__comment:hover {
      background-color: #172a88;
  }

  .tab__content--superCarry .tab__comment:hover {
      background-color: #f18d00;
  }

  .tab__content--carry .tab__comment:before {
      background-color: #172a88;
  }

  .tab__content--superCarry .tab__comment:before {
      background-color: #f18d00;
  }

  .tab__content--carry .tab__comment:hover:before ,
  .tab__content--superCarry .tab__comment:hover:before {
      background-color: #fff;
  }

  .tab__comment:after {
      font-family: HelveticaNeueMed, sans-serif;
      content: "+";
      position: absolute;
      font-size: 24px;
      color: #fff;
      top: -3px;
      left: 50%;
      margin-left: 0.5px;
      line-height: 1;
      transform: translate(-50%,-50%);
  }

  .tab__content--carry .tab__comment:hover:after {
      color: #172a88;
  }

  .tab__content--superCarry .tab__comment:hover:after {
      color: #f18d00;
  }

  .tab__arrow {
      transition: all .3s;
  }

  .tab__arrow:before {
      content: "";
      position: absolute;
      display: block;
      width: 8px;
      height: 8px;
      background-color: #fff;
      border-radius: 51%;
      box-shadow: 0 0 5px 0 rgba(0,0,0,.2);
      box-sizing: border-box;
  }

  .tab__arrow:after {
      content: "";
      position: absolute;
      display: block;
      box-sizing: border-box;
  }

  .tab__comment--01 .tab__arrow:before {
      bottom: 141px;
      right: -89px;
  }

  .tab__comment--01 .tab__arrow:after {
      bottom: 36px;
      right: -86px;
      width: 86px;
      height: 105px;
      border-right: solid 2px #fff;
      border-bottom: solid 2px #fff;
  }

  .tab__comment--02 .tab__arrow:before {
      bottom: -58px;
      left: 50%;
      margin-left: -4px;
      box-shadow: 0 0 5px 0 rgba(0,0,0,.3);
  }

  .tab__comment--02 .tab__arrow:after {
      bottom: -51px;
      left: 50%;
      height: 51px;
      margin-left: -1px;
      border-left: solid 2px #fff;
  }

  .tab__comment--03 .tab__arrow:before {
      top: -50px;
      left: -25px;
  }

  .tab__comment--03 .tab__arrow:after {
      top: -43px;
      left: -22px;
      width: 22px;
      height: 84px;
      border-bottom: solid 2px #fff;
      border-left: solid 2px #fff;
  }

  .tab__comment--04 .tab__arrow:before {
      bottom: -58px;
      left: 50%;
      margin-left: -4px;
  }

  .tab__comment--04 .tab__arrow:after {
      bottom: -52px;
      left: 50%;
      height: 52px;
      margin-left: -1px;
      border-left: solid 2px #fff;
  }

  .tab__comment--05 .tab__arrow:before {
      bottom: 152px;
      left: -49px;
  }

  .tab__comment--05 .tab__arrow:after {
      bottom: 36px;
      left: -46px;
      width: 46px;
      height: 118px;
      border-bottom: solid 2px #fff;
      border-left: solid 2px #fff;
  }

  .tab__comment--06 .tab__arrow:before {
      top: 33px;
      right: -58px;
  }

  .tab__comment--06 .tab__arrow:after {
      bottom: 36px;
      right: -55px;
      width: 55px;
      border-top: solid 2px #fff;
  }

  .tab__content--carry .tab__comment:hover .tab__arrow:before {
      background-color: #172a88;
  }

  .tab__content--superCarry .tab__comment:hover .tab__arrow:before {
      background-color: #f18d00;
  }
  .tab__content--carry .tab__comment:hover .tab__arrow:after {
      border-color: #172a88;
  }

  .tab__content--superCarry .tab__comment:hover .tab__arrow:after {
      border-color: #f18d00;
  }

  .tab__caption {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 110px;
      text-align: center;
      background-color: #fff;
      font-size: 16px;
  }

  #mainContents .tab__caption h4 {
      padding-top: 0;
      font-size: 22px;
      font-weight: bold;
      line-height: 1.2;
  }

  .tab__movieTtl {
      width: 530px;
      height: 220px;
      margin: 70px auto 0;
      padding-top: 25px;
      font-size: 16px;
      text-align: center;
      color: #fff;
      background-color: #000;
      box-sizing: content-box;
  }

  .tab__movieTtl p {
    text-align: inherit !important;
    color: inherit !important;
    font-size: inherit;
  }

  .tab__movieTtl h4 {
      color: #f18d00;
      font-weight: bold;
      font-size: 26px;
      line-height: 1;
  }

  .tab__movieNotes {
      font-size: 10px !important;
  }

  .tab__movieList {
      margin: -80px auto 50px;
  }

  .tab__movieList .mCSB_horizontal.mCSB_inside > .mCSB_container {
      display: flex;
      margin-bottom: 60px;
  }

  .tab__movieList .mCSB_scrollTools .mCSB_draggerContainer {
      cursor: pointer;
  }

  .tab__movieList .mCS-rounded-dark.mCSB_scrollTools {
      opacity: 1;
  }

  .tab__movieList .mCSB_scrollTools.mCSB_scrollTools_horizontal {
      width: 360px;
      height: 20px;
      margin: 0 auto;
  }

  .tab__movieList .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger {
      width: 20px;
      height: 20px;
      overflow: hidden;
  }

  .tab__movieList .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
      background-color: #000;
      width: 20px;
      height: 20px;
      margin: 0;
  }

  .tab__movieList .mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail {
      height: 4px;
      margin: 8px 0;
      background-color: #fff;
      border-radius: 0;
  }

  .tab__movieList figure {
      margin-right: 20px;
      min-width: auto;
  }

  .tab__movieList figure:last-child {
      margin-right: 0;
  }

  .tab__movieItem {
      position: relative;
  }

  .tab__movieCaption {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 64px;
      text-align: center;
      font-size: 16px;
      background-color: #fff;
      letter-spacing: 0;
  }

  .tab__movieBtn {
      position: absolute;
      top: 36px;
      left: 50%;
      margin-left: -41px;
      background-color: transparent;
      cursor: pointer;
      outline: none;
  }

  .lineup {
      margin-bottom: 110px;
  }

  .lineup__ttl {
      text-align: center;
      margin-bottom: 30px;
  }

  .scrollTop {
      position: fixed;
      right: 20px;
      bottom: 20px;
      z-index: 999;
      display: none;
      cursor: pointer;
  }

  .scrollTop__link {
      display: block;
  }

  .scrollTop__img {
      transition: all .3s;
  }

  .scrollTop__link:hover .scrollTop__img {
      opacity: .5;
      transition: .3s;
  }

  .animated {
      opacity: 1;
  }

  .modal {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 9999;
      display: none;
      font-size: 14px;
  }

  .modal .inner {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: inline-block;
    width: 768px;
    transform: translate(-50%, -50%);
  }

  .modal .inner--large {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: inline-block;
    width: 880px;
    transform: translate(-50%, -50%);
  }

  .modal video {
      width: 100%;
      height: auto;
  }

  .modal.is-open {
      opacity: 1;
      display: block;
  }

  .modalBg {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.7);
      cursor: pointer;
  }

  .modal video {
      position: relative;
      z-index: 2;
      display: none;
  }

  .modal video.active {
      display: block;
  }

  .modal .close {
      position: absolute;
      top: 0;
      cursor: pointer;
      display: none;
  }

  .modal .inner .close {
      right: -45px;
      width: 30px;
      height: 30px;
      background-image: url(/car/carry/home/img/btn_close_modal.png);
      background-repeat: no-repeat;
      background-position: center center;
      background-size: cover;
  }

  .modal .inner--large .close {
      right: 0;
      width: 64px;
      height: 64px;
      background-image: url(/car/carry/home/img/btn_close_modal_s.png);
      background-repeat: no-repeat;
      background-position: center center;
      background-size: 24px;
      background-color: #172a88;
  }

  .modal .inner--large .close--super {
      background-color: #f18d00;
  }

  .modal .inner.active .close ,
  .modal .inner--large.active .close {
    display: block;
  }

  .modalFeature {
      padding: 40px 60px;
      background-color: #fff;
      display: none;
  }

  .modalFeature.active {
      display: block;
  }

  .modalFeature__ttl {
      margin: 14px 0 60px !important;
      text-align: center;
  }
  .modalFeature__row {
      display: flex;
  }
  .modalFeature__col--1of3 {
      flex-basis: 270px;
      width: 270px;
  }
  .modalFeature__col--2of3 {
      flex-basis: 490px;
      width: 490px;
  }

  .modalFeature__col--1of2 {
      flex-basis: 380px;
      width: 380px;
  }
  .modalFeature__col--img1 {
      width: 460px;
      margin-right: 20px;
  }
  .modalFeature__col--img2 {
      width: 280px;
  }
  .modalFeature__col--1of2:last-child {
      text-align: right;
  }

  #modal_modal5 .modalFeature__col--1of2:first-child p {
      margin-right: 30px;
  }

  #modal_modal5 .modalFeature__col--1of2:first-child p:first-child {
      margin-top: -10px;
  }

  .modalFeature__subTtl {
      font-size: 18px;
      font-weight: bold;
      margin-top: 7px;
  }

  .modalFeature__notes {
      font-size: 10px;
      letter-spacing: 0.025em;
  }

  .modalFeature__subTtl:first-child {
      margin-top: -10px;
  }

  #modal_modal1 .modalFeature__col--1of3 p:last-of-type {
      margin: 0 40px 16px 0;
  }

  .button {
      font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
      font-weight: bold;
      width: 340px;
      height: 70px;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      background-color: #000;
      font-size: 16px;
      margin: 40px auto 30px;
      transition: all .3s;
  }

  .tab__contentInner .button {
      background-color: #fff;
  }

  .button__txt {
      color: #fff;
      z-index: 2;
  }
  .price__btnGroup .button__txt {
      color: #fff !important;
  }

  .tab__contentInner .button__txt {
      color: #000;
      z-index: 2;
  }

  .button::before {
      content: '';
      position: absolute;
      right: 20px;
      z-index: 2;
      box-sizing: border-box;
      width: 10px;
      height: 10px;
      border-top: solid 2px #fff;
      border-right: solid 2px #fff;
      transform: rotate(45deg);
      transition: all .3s;
  }

  .tab__contentInner .button::before {
      border-color: #000;
  }

  .button::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      z-index: 1;
      -webkit-transform: scale(0, 1);
      -ms-transform: scale(0, 1);
      transform: scale(0, 1);
      -webkit-transform-origin: right top;
      -ms-transform-origin: right top;
      transform-origin: right top;
      background-color: #f1ede2;
      -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
      transition: -webkit-transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
      -o-transition: transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
      transition: transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
      transition: transform 0.4s cubic-bezier(0.86, 0, 0.07, 1), -webkit-transform 0.4s cubic-bezier(0.86, 0, 0.07, 1);
  }

  .tab__contentInner .button::after {
      background-color: #000;
  }
  .feature__enclosure .button::after {
      background-color: #fff;
  }

  .button__wrapper {
      margin: 29px auto 0;
  }

  .button:hover {
      text-decoration: none;
  }

  .button:hover .button__txt {
      color: #000 !important;
  }

  .tab__contentInner .button:hover .button__txt {
      color: #fff !important;
  }

  .button:hover::before {
      border-color: #000;
  }

  .tab__contentInner .button:hover::before {
      border-color: #fff;
  }

  .button:hover:after {
      -webkit-transform: scale(1, 1);
      -ms-transform: scale(1, 1);
      transform: scale(1, 1);
      -webkit-transform-origin: left top;
      -ms-transform-origin: left top;
      transform-origin: left top;
  }

  .price {
      width: 1140px;
      margin: 0 auto 80px;
      padding-bottom: 82px;
      background-color: #fff;
  }

  .price__wrapper {
      padding: 30px 119px 0;
      display: flex;
      align-items: center;
  }

  .price__product {
      width: 340px;
      margin-right: 56px;
  }

  .price__details {
      width: 506px;
      position: relative;
  }

  .price__btnGroup {
      margin-top: 15px;
  }

  .price__btn.button {
      margin: 20px 0 0;
      box-sizing: border-box;
  }

  .price__priceDetails {
      padding-bottom: 20px;
  }

  .tab__content--carry .price__priceDetails {
      border-bottom: 2px solid #172a88;
  }

  .tab__content--superCarry .price__priceDetails {
      border-bottom: 2px solid #f18d00;
  }

  .price__priceDetails p {
      padding-top: 0 !important;
      margin-top: 11px !important;
      line-height: 1 !important;
  }

  .price__priceDetails p:nth-of-type(2) {
      margin-top: 18px;
  }

  .price__priceDetails p:nth-of-type(3) {
      margin-top: 12px;
      line-height: .8 !important;
  }

  .price__ammount {
      font-family: HelveticaNeue, sans-serif;
      font-size: 50px;
  }

  .price__ammount span {
      font-size: 16px;
      font-weight: 400;
      display: inline-block;
      margin-left: 9px;
      font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
      font-weight: 400;
  }

  .price__ammount span:last-of-type {
      font-size: 14px;
      font-weight: 400;
      margin-top: 15px;
      margin-left: 0px;
  }

  .price__performanceDetails {
      margin-top: 22px;
  }

  .price__performanceDetails p {
      padding-top: 0 !important;
  }

  .price__performanceDetails>p:first-of-type {
      font-size: 20px;
      font-weight: bold;
      margin-top: 4px;
      padding-top: 0 !important;
      letter-spacing: 0.025em;
  }

  .price__performanceDetails p:nth-of-type(2) {
      font-size: 14px;
      margin-top: 10px;
      line-height: 1 !important;
      font-weight: bold;
  }

  .price__performanceDetails p:nth-of-type(3) {
      font-size: 14px;
      margin-top: 14px;
      line-height: 1.4 !important;
      letter-spacing: -.95px;
  }

  .price__moreDetails {
      display: flex;
      align-items: center;
  }

  .price__moreDetails div+img {
      margin-top: -30px;
  }

  .price__moreDetails>p {
      font-family: HelveticaNeue, sans-serif;
      font-size: 50px !important;
      margin-right: 10px;
      line-height: 0.8 !important;
  }

  .price__moreDetails div {
      margin-right: 53px;
  }

  .price__moreDetails div p {
      margin-top: 0 !important;
  }

  .price__moreDetails+p {
      margin-top: 8px;
      font-size: 12px;
  }

  .price__block1 {
      margin-top: 30px;
      display: flex;
  }

  .price__block1 div p {
      line-height: 1 !important;
  }

  .price__block1 div p:last-of-type {
      margin-top: 12px;
      font-weight: bold;
  }

  .price__block2 {
        flex-basis: 290px;
        padding: 0 0 0 20px;
        text-align: left !important;
        font-size: 12px;
        letter-spacing: 0;
    }

  .price__footer {
      margin-top: 29px;
      font-size: 12px;
      padding-top: 0 !important;
      padding: 0 50px 0 !important;
  }


  .bounceInUpCustom {
      -webkit-animation: bounceInUpCustom 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
      animation: bounceInUpCustom 1s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
  }

  .js-bounceUp {
      opacity: 0;
  }

  .justify {
      text-align: justify;
      text-justify: inter-ideograph;
      text-justify: newspaper;
  }

  .justify span {
      text-align: left;
      display: inline-block;
  }

  .color {
      width: 1140px;
      margin: -30px auto 0;
      position: relative;
  }

  .color__slider {
      width: 1140px;
      overflow: hidden;
  }

  .color__slide {
      width: 360px;
      margin: 0 -10px;
  }

  .color__imgWrap {
      width: 360px;
      height: 231px;
      padding-top: 115px;
      box-sizing: border-box;
      transition: padding .5s;
  }

  .color__img {
      width: 50%;
      max-height: 100%;
      margin: 0 auto;
      opacity: 0;
  }

  .color__subText {
      font-size: 11px;
      padding-top: 0 !important;
      text-align: center;
      margin-top: 21px;
      line-height: 2 !important;
  }

  .slick-active img {
      transition: width .5s;
  }

  .slick-slide img {
      transition: width .5s;
      opacity: 1;
  }

  .slick-slide.slick-current .color__name,
  .slick-slide.is-active-next .color__name {
      opacity: 1;
      transition: opacity .2s;
      transition-delay: .02s
  }

  .color__name {
      transition: all .2s;
      transition-delay: .02s
  }


  .slick-slide.slick-current .color__imgWrap ,
  .slick-slide.is-active-next .color__imgWrap {
      padding-top: 0;
      transition: padding .5s;
  }

  .slick-slide.slick-current .color__img,
  .slick-slide.is-active-next .color__img {
      width: 100%;
      transition: width .5s;
  }

  .slick-track {
      height: 100%;
  }

  .color .slick-list {
      padding-bottom: 60px !important;
  }

  .color .slick-list::before {
      content: '';
      background-color: #f2f2f2;
      position: absolute;
      width: 100%;
      top: 50px;
      left: 0;
      bottom: 0;
  }

  .color__name {
      margin: 5px -300px 0;
      text-align: center;
      opacity: 0;
      padding-top: 0 !important;
      line-height: 1.5 !important;
  }

  .color__notes {
      display: inline-block;
      margin-top: 7px;
      font-size: 10px;
  }

  .slick-arrow {
      position: absolute;
      cursor: pointer;
      bottom: 20px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 3;
  }

  .color .slick-arrow.previous {
      margin-left: -124px;
  }

  .color .slick-arrow.next {
      margin-left: 124px;
  }

  .color .slick-dots {
      text-align: center;
      padding-top: 0 !important;
      display: inline-block !important;
      position: absolute;
      bottom: 20px;
      left: 50%;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
      z-index: 3;
  }

  .color .slick-dots li {
      height: 14px;
      width: 14px;
      border-radius: 50%;
      display: inline-block;
      margin-right: 15px;
      cursor: pointer;
      border: 2px solid transparent;
      box-sizing: border-box;
  }

  .color .slick-dots li button {
      display: none;
  }

  .color .slick-dots li:first-of-type {
    background-color: #ffffff;
    border: 1px solid #a7b0ba;
  }

  .color .slick-dots li:nth-of-type(2) {
    background-color: #E2E6EB;
  }

  .color .slick-dots li:nth-of-type(3) {
    background-color: #db8d54;
  }

  .color .slick-dots li:nth-of-type(4) {
    background-color: #003F4E;
  }

  .color .slick-dots li:nth-of-type(5) {
    background-color: #7b8579;
  }

  .color .slick-dots li:nth-of-type(6) {
    background-color: #7F9FA6;
  }

  .color .slick-dots li:nth-of-type(7) {
    background-color: #BEBFBA;
    margin-right: 0;
  }

  .color .slick-dots li.slick-active {
      transform: scale(1.3);
  }

  .color .disabled {
      pointer-events: none !important;
      cursor: not-allowed !important;
  }

  .color__slide__NEW {
    color: #ff0000;
    font-weight: bold;
  }

  /* css */
  .passing .passing-box {
    display: block;
    text-align: center;
  }
  .passing .passing-bar {
    position: relative;
    display: inline-block;

    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  .passing .passing-bar:before {
    content: '';
    display: inline-block;
    width: 0;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;

    background: #000;
  }
  .passing .passing-txt {
    opacity: 0;

    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);

  }
  .passing.move .passing-bar:before {
    -webkit-animation: passing-bar 1s ease 0s 1 normal forwards;
    animation: passing-bar 1s ease 0s 1 normal forwards;
  }
  .passing.move .passing-txt {
    -webkit-animation: passing-txt 0s ease .5s 1 normal forwards;
    animation:passing-txt 0s ease .5s 1 normal forwards;
  }

  .tab__content .tab__content-box {
    display: block;
  }
  .tab__content .tab__content-bar {
    position: relative;
    display: block;

    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  .tab__content .tab__content-bar:before ,
  .tab__content .tab__content-bar:after {
    content: '';
    display: inline-block;
    width: 0;
    position: absolute;
    top: -50px;
    bottom: -110px;
    left: 0;
    z-index: 1;
  }
  .tab__content--carry .tab__content-bar:before ,
  .tab__content--superCarry .tab__content-bar:after {
    background: #172a88;
  }
  .tab__content--superCarry .tab__content-bar:before ,
  .tab__content--carry .tab__content-bar:after {
    background: #f18d00;
  }
  .tab__content .tab__content-content {
    opacity: 0;

    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);

  }
  .tab__content.is-active .tab__content-bar:before {
    -webkit-animation: passing-bar .5s ease 0s 1 normal forwards;
    animation: passing-bar 1s ease 0s 1 normal forwards;
  }
  .tab__content.is-active .tab__content-content {
    -webkit-animation: passing-txt 0s ease .5s 1 normal forwards;
    animation:passing-txt 0s ease .5s 1 normal forwards;
  }

  .tab__content.is-hide .tab__content-bar:after {
    -webkit-animation: passing-bar .5s ease 0s 1 normal forwards;
    animation: passing-bar 1s ease 0s 1 normal forwards;
  }

  .js--videoModal {
      transition: all .3s;
  }

  .js--videoModal .playBtn:hover {
      opacity: .5;
      transition: .3s;
  }

  #relatedLink {
      padding-top: 0;
  }

  .safetyItem__video a {
      display: block;
  }

  .js--videoModal:hover,
  .js--videoModal:hover+img {
      opacity: .5;
  }

  .safetyItem__video a {
      display: block;
      position: absolute;
      top: 21%;
      left: 34%;
      z-index: 2;
  }

  .fullHeight {
      height: 100% !important;
  }

  .overflowHide {
      overflow: hidden;
  }
  .appeal {
      position: fixed;
      top: 50%;
      left: 140px; /* 20 */
      z-index: 1000;
      margin-top: 127px;
      opacity: 0;
  }
  .appeal__item {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 160px;
      height: 255px;
      display: none;
  }
}
@media only screen and (min-width: 1140px) and (max-width: 1400px) {
  .color,
  .color__slider,
  .price {
    width: 980px;
  }
  .price__wrapper {
    padding: 30px 39px 0;
  }
  .feature__lineup {
    width: 100%;
    max-width: 1140px;
  }
  #mainContents .feature__lineup li {
    width: 50%;
  }
}

/* PC+TAB */
@media only screen and (min-width: 751px) {
  #main-image .showPC {
    display: block !important;
    visibility: visible !important;
  }
  #main-image .showSP {
    display: none !important;
  }

  .fold {
      position: relative;
  }

  .fold__kv {
      width: 50% !important; /* override common_r*/
      float: left;
    }

    .fold__kv--full {
        width: 100% !important;
  }

  .fold__text {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 19vw !important; /* override common_r*/
      max-width: 240px;
      transform: translate(-50%, -50%);
  }

  .fold__notes {
      clear: both;
      position: absolute;
      right: 5px;
      bottom: 5px;
  }

  .fold__scrollDown {
      position: absolute;
      bottom: 30px;
      left: 30px;
      z-index: 2;
      width: 26px;
      height: 128px;
      display: flex;
      flex-direction: column;
      align-items: center;
      box-sizing: border-box;
      transform: translate(-50%, 0);
      cursor: pointer;
  }

  .fold__scrollText {
      z-index: 1;
      position: relative;
      width: 26px;
      height: 128px;
  }

  .fold__scrollArrow {
      position: absolute;
      bottom: 51px;
      left: 50%;
      z-index: 2;
      display: block;
      width: 7px;
      height: 7px;
      margin-left: -4px;
      background-color: #fff;
      border-radius: 4px;
      -webkit-animation: scrollDown 3s infinite;
      animation: scrollDown 3s infinite;
      box-sizing: border-box;
  }
}

/* IE8〜11はMS明朝 */
@media screen\0 {

    .tvcm__caption,
    .color__name,
    .price__footer {
        font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic", Osaka, "ＭＳ Ｐゴシック", sans-serif;
        letter-spacing: 0;
    }
}

/*custom animation*/
@-webkit-keyframes bounceInUpCustom {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 80px, 0);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(0, -20px, 0);
    }

    75% {
        -webkit-transform: translate3d(0, 10px, 0);
    }

    90% {
        -webkit-transform: translate3d(0, -5px, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
    }
}

@keyframes bounceInUpCustom {
    0% {
        opacity: 0;
        transform: translate3d(0, 80px, 0);
    }

    60% {
        opacity: 1;
        transform: translate3d(0, -20px, 0);
    }

    75% {
        transform: translate3d(0, 10px, 0);
    }

    90% {
        transform: translate3d(0, -5px, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes scrollDown {
    0% {
        -webkit-transform: translate(0, 0);
    }

    20% {
        -webkit-transform: translate(0, 44px);
    }

    40% {
        -webkit-transform: translate(0, 0);
    }

    100% {
        -webkit-transform: translate(0, 0);
    }
}

@keyframes scrollDown {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }

    20% {
        -webkit-transform: translate(0, 44px);
        transform: translate(0, 44px);
    }

    40% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }

    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

/* animation */
@-webkit-keyframes passing-bar{
	0% {
		left: 0;
		right: auto;
		width: 0;
	}
	50% {
		left: 0;
		right: auto;
		width: 100%;
	}
	51% {
		left: auto;
		right: 0;
		width: 100%;
	}
	100% {
		left: auto;
		right: 0;
		width: 0;
	}
}
@keyframes passing-bar{
	0% {
		left: 0;
		width: 0;
	}
	50% {
		left: 0;
		width: 100%;
	}
	51% {
		left: 0;
		width: 100%;
	}
	100% {
		left: 100%;
		width: 0;
	}
}
@-webkit-keyframes passing-txt{
	0% { opacity: 0; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes passing-txt{
	0% { opacity:0; }
	50% { opacity:0; }
	100% { opacity:1; }
}

/* SP */
@media only screen and (max-width: 1140px) {
  .main-stage .showPC {
    display: none !important;
  }
  .main-stage .showSP {
    display: block !important;
    max-width: 710px;
    margin: 0 auto;
  }
  /* override common_r */
  h1 {
    background-color: transparent !important;
    padding: 0;
  }
  h2,
  h3 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    border-bottom: none !important;
    padding-bottom: 0 !important;
    color: inherit !important;
  }
  h3 {
    font-weight: normal;
  }
  h3 span {
    padding-bottom: 0;
  }
  h4 {
    margin-top: 0 !important;
    border-left: none;
    padding-left: 0;
  }
  h5 {
    margin-top: 0 !important;
  }
  #main p {
    margin-top: 0;
    padding-top: 10px; /* copy from clgCommon.css*/
  }
  .price, .price span {
    font-size: inherit;
    font-weight: inherit;
    margin-top: 0;
    color: inherit;
    white-space: normal;
  }
  p {
    color: #333;
    text-align: left;
  }

  /* wrapper */
  .main-stage {
    margin-top: 0 !important;
  }

  .main-stage * {
    line-height: 1.85;
  }

  /*------------------------------
  *
  * base
  *
  *------------------------------*/
  #tvcm,
  #feature,
  #carryModal {
      box-sizing: border-box;
  }

  #tvcm *,
  #feature *,
  #carryModal * {
      box-sizing: inherit;
  }

  #feature img,
  .lineup__section img,
  #carryModal img {
      max-width: 100%;
      height: auto;
  }
  .lineup__section .simulation__steps img{
    max-width: inherit;
  }

  #tvcm button,
  #carryModal button {
      border-radius: 0;
      -webkit-box-sizing: content-box;
      -webkit-appearance: button;
      -moz-appearance: button;
          appearance: button;
      border: none;
      box-sizing: border-box;
      cursor: pointer;
      background: none;
      padding: 0;
  }

  #tvcm button::-webkit-search-decoration,
  #carryModal button::-webkit-search-decoration {
      display: none;
  }

  #tvcm button::focus,
  #carryModal button::focus {
      outline-offset: -2px;
  }

  /*
  #stage {
      line-height: 1.85;
  }
  */

  strong {
      font-weight: bold;
  }

  .button {
      font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, sans-serif;
      font-weight: bold;
      height: 13.33vw; /* 50px */
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      background-color: #000;
      color: #fff !important;
      font-size: 3.2vw; /* 12px */
      margin: 40px auto 30px;
      transition: all .3s;
  }

  .button::before {
      content: '';
      background-image: url(/car/carry/home/img/btn-arrow.png);
      position: absolute;
      width: 8px;
      height: 14px;
      top: 50%;
      right: 4%;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
      transition: all .3s;
  }

  #relativeList {
      line-height: 1.3;
  }

  #relativeList li .carName {
      font-family: Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  }
  /*------------------------------
  *
  * common
  *
  *------------------------------*/
  .carry-note {
      font-size: 2.6667vw;
      line-height: 1.8;
      padding-top: 4px;
  }

  .text__blue {
      color: #004ea2;
  }

  .bounceInUp {
      -webkit-animation-name: bounceInUpCustomSP;
              animation-name: bounceInUpCustomSP;
      -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
              animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  .animated {
      opacity: 1;
  }

  .js-bounceUp {
      opacity: 0;
  }

  .scrollTop {
      position: fixed;
      right: 1.3333vw;
      bottom: 2.6667vw;
      z-index: 4;
      display: none;
      cursor: pointer;
  }

  .scrollTop__link {
      display: block;
  }

  .scrollTop__img {
      width: 10.6667vw;
  }

  .hidden {
      display: none !important;
  }


  /*------------------------------
  *
  * txt fade
  *
  *------------------------------*/
  .show {
      opacity: 0;
      -webkit-transition: opacity .6s ease;
      transition: opacity .6s ease;
  }

  .isPlay .show {
      opacity: 1;
  }

  .show--01 {
      -webkit-transition-delay: 1s;
              transition-delay: 1s;
  }

  .show--02 {
      -webkit-transition-delay: 2.2s;
              transition-delay: 2.2s;
  }

  .show--03 {
      -webkit-transition-delay: 2.8s;
              transition-delay: 2.8s;
  }

  .appeal {
      padding-top: 0;
      margin: 0 20px 20px !important; /* override */
  }
  /*------------------------------
  *
  * main image
  *
  *------------------------------*/
  #mainContents .mainImage {
      position: relative;
  }

  #mainContents .mainImage img {
      width: 100%;
      margin: 0;
  }

  #mainContents .mainImage .scroll {
      position: absolute;
      left: 4%;
      bottom: calc(20 / 375 * 100vw);
      width: 16.5px;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
  }

  #mainContents .mainImage .scroll .arrow {
      width: 7px;
      height: 7px;
      margin-left: -4.25px;
      background-color: #fff;
      border-radius: 4px;
      position: absolute;
      z-index: 1;
      left: 50%;
      top: 57px;
      -webkit-animation: scrollDownSP 3s infinite;
              animation: scrollDownSP 3s infinite;
  }

  #feature {
    padding-top: 30px; /* TVCM非表示時 */
  }
  /*------------------------------
  *
  * g-nav
  *
  *------------------------------*/
  .fixed {
      position: fixed;
      width: 100%;
  }

  .nav {
      position: relative;
  }

  .nav__header {
      opacity: 0;
      -webkit-transform: translateY(-12vw);
      transform: translateY(-12vw);
      transition: opacity 0s .3s, -webkit-transform .3s;
      -webkit-transition: opacity 0s .3s, -webkit-transform .3s;
      transition: transform .3s, opacity 0s .3s;
      transition: transform .3s, opacity 0s .3s, -webkit-transform .3s;
  }

  .nav__header.is-view {
      transition: -webkit-transform .3s;
      -webkit-transition: -webkit-transform .3s;
      transition: transform .3s;
      transition: transform .3s, -webkit-transform .3s;
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
  }

  .nav__header {
      width: 100%;
      height: 11.733vw;
      padding: 0 3.7vw;
      background-color: #000;
      box-sizing: border-box;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
      position: fixed;
      top: 0;
      left: 0;
      z-index: 61;
  }

  .nav__header.fixed {
      position: fixed;
      z-index: 50;
  }

  .nav__logo {
      width: 105px;
      height: 100%;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
  }

  .nav__img {
      width: 30.6667vw;
      vertical-align: middle;
  }

  .nav__header .nav__btn {
      width: 4.8vw;
      height: 3.467vw;
      position: relative;
  }

  .nav__header .nav__btn span {
      display: block;
      width: 100%;
      height: 2px;
      background-color: #fff;
  }

  .nav__btn span + span {
      margin-top: 1.333vw;
  }

  .nav__btn.is-active span + span {
      margin-top: 0;
  }

  .nav__btn span {
      transition: opacity .3s, -webkit-transform .3s;
      -webkit-transition: opacity .3s, -webkit-transform .3s;
      transition: transform .3s, opacity .3s;
      transition: transform .3s, opacity .3s, -webkit-transform .3s;
  }

  .nav__btn.is-active span:nth-child(1) {
      position: absolute;
      top: 50%;
      -webkit-transform: translateY(-50%) rotate(225deg);
      transform: translateY(-50%) rotate(225deg);
  }

  .nav__btn.is-active span:nth-child(2) {
      opacity: 0;
      margin-top: 1.333vw;
  }

  .nav__btn.is-active span:nth-child(3) {
      position: absolute;
      top: 50%;
      -webkit-transform: translateY(-50%) rotate(-225deg);
      transform: translateY(-50%) rotate(-225deg);
  }

  .g-nav-overlay {
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.7);
      position: fixed;
      top: 0;
      left: 0;
      z-index: 59;
      pointer-events: none;
      opacity: 0;
      -webkit-transition: opacity .5s;
      transition: opacity .5s;
  }

  .g-nav-list.is-active {
      -webkit-transform: translateY(11.733vw);
      transform: translateY(11.733vw);
      opacity: 1;
      z-index: 60;
      display: block;
  }

  .g-nav-list.is-active + .g-nav-overlay {
      pointer-events: auto;
      opacity: 1;
  }

  .g-nav-list {
      opacity: 0;
      -webkit-transform: translateY(-600px);
      transform: translateY(-600px);
      transition: -webkit-transform .5s;
      -webkit-transition: -webkit-transform .5s;
      transition: transform .5s;
      transition: transform .5s, -webkit-transform .5s;
      position: fixed;
      top: 0;
      width: 100%;
  }

  .g-nav-list li {
      box-sizing: border-box;
  }

  .g-nav-list a {
      display: block;
      width: 100%;
      height: 100%;
      color: #000;
      box-sizing: border-box;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: start;
      -webkit-justify-content: flex-start;
          -ms-flex-pack: start;
              justify-content: flex-start;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
      padding: 0 20px;
  }

  .g-nav-list .list-1 {
      border-bottom: solid 1px #000;
  }

  .g-nav-list .list-1 li {
      width: 100%;
      height: 58px;
  }

  .g-nav-list .list-1 li + li a {
      border-top: solid 1px #000;
  }

  .g-nav-list .list-1 a {
      background-color: #fff;
      font-size: 19px;
  }

  .g-nav-list .list-1 i {
      display: block;
      width: 41px;
      text-align: center;
      margin-right: 1em;
  }

  .g-nav-list .list-1 i img {
      margin: auto;
  }

  .g-nav-list .list-2 {
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: stretch;
      -webkit-align-items: stretch;
          -ms-flex-align: stretch;
              align-items: stretch;
      -webkit-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
  }

  .g-nav-list .list-2 li {
      background: #fff;
      border-top: solid 1px #000;
      width: 50%;
      height: 46px;
  }

  .g-nav-list .list-2 li:nth-child(odd) a {
      border-right: solid 1px #000;
  }

  .g-nav-list .list-2 a {
      background-color: #fff;
      font-size: 14px;
  }

  .g-nav-list .list-2 i {
      display: block;
      width: 31px;
      text-align: center;
      margin-right: 0.5em;
  }

  .g-nav-list i img {
      width: 30px;
  }

  /*------------------------------
  *
  * navigation
  *
  *------------------------------*/

  .nav-header {
      height: 44px;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: justify;
      -webkit-justify-content: space-between;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
      padding: 0 25px 0 20px;
  }

  .spMenu {
      width: 100%;
      position: absolute;
      top: 44px;
      height: 2000px;
  }

  .spnav {
      width: 18px;
      height: 13px;
      margin-left: auto;
      position: relative;
  }

  .spnav span {
      width: 100%;
      height: 1px;
      display: inline-block;
      background-color: #fff;
  }

  .spnav span:nth-child(1) {
      position: absolute;
      top: 0;
      left: 0;
      -webkit-transition: all .2s ease;
      transition: all .2s ease;
  }

  .spnav span:nth-child(2) {
      position: absolute;
      top: 6px;
      left: 0;
      opacity: 1;
      -webkit-transition: all .2s ease;
      transition: all .2s ease;
  }

  .spnav span:nth-child(3) {
      position: absolute;
      bottom: 0;
      left: 0;
      -webkit-transition: all .2s ease;
      transition: all .2s ease;
  }

  .spnav.active span:nth-child(1) {
      position: absolute;
      top: 6px;
      left: 0;
      -webkit-transform: rotate(45deg);
              transform: rotate(45deg);
      -webkit-transition: all .2s ease;
      transition: all .2s ease;
  }

  .spnav.active span:nth-child(2) {
      opacity: 0;
      -webkit-transition: all .2s ease;
      transition: all .2s ease;
  }

  .spnav.active span:nth-child(3) {
      position: absolute;
      bottom: 6px;
      left: 0;
      -webkit-transform: rotate(-45deg);
              transform: rotate(-45deg);
      -webkit-transition: all .2s ease;
      transition: all .2s ease;
  }

  .navIcon {
      width: 37px;
      height: 37px;
      display: inline-block;
  }

  .ico01 {
      background: url(/car/sp/carry/img/ico_nav01.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico02 {
      background: url(/car/sp/carry/img/ico_nav02.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico03 {
      background: url(/car/sp/carry/img/ico_nav03.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico04 {
      background: url(/car/sp/carry/img/ico_nav04.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico05 {
      background: url(/car/sp/carry/img/ico_nav05.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico06 {
      background: url(/car/sp/carry/img/ico_nav06.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico07 {
      background: url(/car/sp/carry/img/ico_nav07.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico08 {
      background: url(/car/sp/carry/img/ico_nav08.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico09 {
      background: url(/car/sp/carry/img/ico_nav09.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico10 {
      background: url(/car/sp/carry/img/ico_nav10.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico11 {
      background: url(/car/sp/carry/img/ico_nav11.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  .ico12 {
      background: url(/car/sp/carry/img/ico_nav12.png) no-repeat 0 50%;
      background-size: 37px 37px;
  }

  /*------------------------------
  *
  * tv cm
  *
  *------------------------------*/
  #tvcm {
      margin-top: 8vw;
      padding: 11.37vw 5.333vw 60px;
      text-align: center;
  }

  #tvcm .tvcm__movie {
      position: relative;
      margin: 0 -5.333vw;
  }

  #tvcm .tvcm__scroll img {
      height: 210px;
  }

  #tvcm .tvcm__scroll {
      margin-bottom: 20px;
  }

  #tvcm .tvcm__scroll li {
      width: 50%;
  }

  #tvcm .tvcm__btnWrap {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
  }

  #tvcm .tvcm__btnWrap img {
      width: 50%;
  }

  #tvcm .tvcm__caption {
      font-size: 12px;
  }

  #tvcm .tvcm__caption strong {
      font-size: 14px;
  }

  /*------------------------------
  *
  * feature
  *
  *------------------------------*/

  #feature h2 {
      margin: 0 auto 20px;
  }

  .passing .passing-box {
    display: block;
    text-align: center;
  }
  .passing .passing-bar {
    position: relative;
    display: inline-block;

    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  .passing .passing-bar:before {
    content: '';
    display: inline-block;
    width: 0;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;

    background: #000;
  }
  .passing .passing-txt {
    opacity: 0;

    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);

  }
  .passing.move .passing-bar:before {
    -webkit-animation: passing-barSP 1s ease 0s 1 normal forwards;
    animation: passing-barSP 1s ease 0s 1 normal forwards;
  }
  .passing.move .passing-txt {
    -webkit-animation: passing-txtSP 0s ease .5s 1 normal forwards;
    animation:passing-txtSP 0s ease .5s 1 normal forwards;
  }

  .passing .passing-txt img {
    vertical-align: bottom;
  }

  #feature h2:first-child {
      width: 315px;
      padding-bottom: 20px !important;
  }

  .feature__lineup {
      margin: 0 20px 90px;
  }

  .feature__lineup li {
      margin-bottom: 20px;
  }

  .feature__section {
      margin-bottom: 60px;
  }

  #feature .feature__section:nth-of-type(3) {
      padding-top: 30px;
  }

  .feature__section h3 {
      text-align: center;
      margin-bottom: 5px !important;
  }

  .feature__section .feature__ttl {
      display: inline-block;
  }

  .feature__section:first-of-type h3 .feature__ttl {
      width: 260px;
  }

  .feature__section:nth-of-type(2) h3 .feature__ttl {
      width: 300px;
  }

  .feature__section:nth-of-type(3) h3 .feature__ttl {
      width: 320px;
  }

  .feature__section:nth-of-type(4) h3 .feature__ttl {
      width: 320px;
  }

  .feature__section .feature__point {
      display: inline-block;
      width: 70px;
      margin-bottom: 18px;
  }

  .feature__section .feature__icon {
      padding-top: 10px;
      text-align: center;
      margin-bottom: 10px;
  }

  .feature__section .feature__icon li {
      display: inline-block;
      margin: 0 2px;
      width: 88px;
  }

  .feature__section .feature__safetyKv {
      padding: 0 20px;
  }

  .feature__section .feature__function {
      margin: 16px 0;
  }

  .feature__section .feature__enclosure {
      background-color: #f1ede2;
      padding: 20px;
  }

  .feature__section .feature__enclosure .feature__safetyTxt {
      margin: 0 auto 30px;
      width: 180px;
  }

  .feature__enclosure {
      margin-bottom: 80px;
  }

  .feature__enclosure .feature__col {
      position: relative;
      margin-bottom: 20px;
  }

  .feature__enclosure .feature__btn {
      position: absolute;
      top: 50%;
      left: 50%;
      margin-top: -28px;
      margin-left: -28px;
      background-color: transparent;
      border: none;
      cursor: pointer;
      outline: none;
      width: 56px;
  }

  .feature__enclosure .feature__class {
      font-size: 10px;
  }

  .feature__enclosure .feature__notes {
      padding-top: 10px;
      font-size: 10px;
  }

  .feature__enclosure .button {
      margin: 30px auto 0;
  }

  .feature__sscs {
      margin: 10px 0 30px !important;
      text-align: center;
  }

  #sec1-sp .feature__safetyKv {
    margin-bottom: -148px;
  }

  #sec1-sp .feature__safety {
    background-color: #fff;
    margin-top: 148px;
    padding: 40px 20px;
  }

  #sec1-sp .feature__safety .feature__safety-ttl {
    display: block;
    width: 268px;
    margin-left: auto;
    margin-right: auto;
  }

  #sec1-sp .feature__safety .feature__safety-txt {
    display: block;
    font-size: 16px;
    text-align: center;
    color: #036EB7;
    font-weight: bold;
    padding-top: 35px;
  }

  #sec1-sp .feature__safety .feature__safety-point {
    display: block;
    margin-top: 40px;
  }

  #sec1-sp .feature__notes {
    display: block;
    padding-top: 30px;
  }

  .tab {
      margin-top: 30px;
      margin-bottom: 1px;
  }

  .tab__content {
      overflow: hidden;
      padding-bottom: 20px;
  }

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

  .tab__list li {
      display: inline-block;
      vertical-align: bottom;
      width: 49%;
  }

  .tab__link--carry, .tab__link--superCarry {
      position: relative;
      cursor: pointer;
  }

  .tab__content--carry {
      background-color: #172a88;
  }

  .tab__link--carry:before {
      background-color: #172a88;
  }

  .tab__link--carry:before, .tab__link--superCarry:before {
      content: "";
      display: block;
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 1;
      transition: background .3s;
  }

  .tab__link--superCarry:before {
      background-color: #f18d00;
  }

  .tab__link--carry:after {
      background: url(/car/carry/home/img/sp/feature_icon_carry2_off.png) no-repeat center bottom;
      background-size: contain;
  }

  .tab__link--superCarry:after {
      background: url(/car/carry/home/img/sp/feature_icon_superCarry2_off.png) no-repeat center bottom;
      background-size: contain;
  }

  .tab__link--carry::after, .tab__link--superCarry::after {
      content: "";
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 2;
  }

  .tab__link--carry.is-active::after, .tab__link--superCarry.is-active::after {
      opacity: 0;
  }

  .tab__link--carry img, .tab__link--superCarry img {
      position: relative;
      top: 0;
      z-index: 2;
      opacity: 0;
  }

  .tab__link--carry.is-active img, .tab__link--superCarry.is-active img {
      opacity: 1;
  }

  .tab__content .tab__content-box {
    display: block;
  }
  .tab__content .tab__content-bar {
    position: relative;
    display: block;

    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  .tab__content .tab__content-bar:before ,
  .tab__content .tab__content-bar:after {
    content: '';
    display: inline-block;
    width: 0;
    position: absolute;
    top: 0;
    bottom: -20px;
    left: 0;
    z-index: 1;
  }
  .tab__content--carry .tab__content-bar:before ,
  .tab__content--superCarry .tab__content-bar:after {
    background: #172a88;
  }
  .tab__content--superCarry .tab__content-bar:before ,
  .tab__content--carry .tab__content-bar:after {
    background: #f18d00;
  }
  .tab__content .tab__content-content {
    opacity: 0;

    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);

  }
  .tab__content.is-active .tab__content-bar:before {
    -webkit-animation: passing-barSP .3s ease 0s 1 normal forwards;
    animation: passing-barSP .6s ease 0s 1 normal forwards;
  }
  .tab__content.is-active .tab__content-content {
    -webkit-animation: passing-txtSP 0s ease .3s 1 normal forwards;
    animation:passing-txtSP 0s ease .3s 1 normal forwards;
  }

  .tab__content.is-hide .tab__content-bar:after {
    -webkit-animation: passing-barSP .3s ease 0s 1 normal forwards;
    animation: passing-barSP .6s ease 0s 1 normal forwards;
  }

  .tab__contentInner {
    padding: 20px;
  }

  .tab__contentInner .button {
      background: #fff;
      color: #000 !important;
      margin: 40px auto 0;
  }

  .tab__contentInner .button:before {
      background-image: url(/car/carry/home/img/sp/btn-arrow-black.png);
      background-size: contain;
  }

  .tab__contentInner .carImg {
      position: relative;
  }

  .tab__contentInner .carImg .btn-plus {
      top: 0;
      position: absolute;
      z-index: 2;
      width: 11.6667vw;
      background: none;
      border: none;
  }

  .tab__content--carry .tab__contentInner .carImg .btn-plus--01 {
      top: 31.8667vw;
      left: 8.4vw;
  }

  .tab__content--carry .tab__contentInner .carImg .btn-plus--02 {
      top: 23.9333vw;
      right: 27.3333vw;
  }

  .tab__content--carry .tab__contentInner .carImg .btn-plus--03 {
      top: 46.26667vw;
      right: 14.2vw;
  }

  .tab__content--superCarry .tab__contentInner .carImg .btn-plus--01 {
      top: 34.8667vw;
      left: 29.4vw;
  }

  .tab__content--superCarry .tab__contentInner .carImg .btn-plus--02 {
      top: 3.9333vw;
      right: 27.3333vw;
  }

  .tab__content--superCarry .tab__contentInner .carImg .btn-plus--03 {
      top: 51.26667vw;
      right: 6.2vw;
  }

  .tab__caption {
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      background-color: #fff;
      font-size: 16px;
      padding: 20px 10px;
  }

  .tab__caption h4 {
      font-weight: bold;
      line-height: 1.4375;
  }

  .tab__caption p {
      padding-top: 5px;
      line-height: 1.66;
      text-align: inherit;
  }

  .tab__content--superCarry {
      background-color: #f18d00;
  }

  .tab__movie {
      padding: 0;
  }

  .tab__movieTtl {
      margin: 0 auto;
      padding: 25px 0 50px;
      margin: 40px 20px 0;
      font-size: 14px;
      text-align: center;
      color: #fff;
      background-color: #000;
      line-height: 1.66;
  }

  .tab__movieTtl h4 {
      color: #f18d00;
      font-weight: bold;
      font-size: 16px;
  }

  .tab__movieTtl p {
      padding-top: 6px;
      color: inherit;
      text-align: inherit;
  }

  .tab__movieNotes {
      font-size: 10px;
  }

  .tab__movieItem {
      position: relative;
  }

  .tab__movieBtn {
      border: none;
      position: absolute;
      top: 26%;
      left: 50%;
      margin-left: -38px;
      background-color: transparent;
      cursor: pointer;
      outline: none;
  }
  .tab__movieBtn img {
    max-width: 82px !important;
  }

  .tab__movieList {
      margin: -40px auto 0;
      width: 80%;
  }

  .tab__movieList .slick-prev,
  .tab__movieList .slick-next {
      font-size: 0;
      line-height: 0;
      position: absolute;
      top: 46%;
      display: block;
      height: 16px;
      width: 22px;
      -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
      transform: translate(0, -50%);
      cursor: pointer;
      color: transparent;
      border: none;
      outline: none;
      background: transparent;
  }

  .tab__movieList .slick-prev {
      background: url(/car/carry/home/img/sp/btn-super_carry_arrow_left.png) transparent no-repeat;
      background-size: contain;
      left: -25px;
  }

  .tab__movieList .slick-next {
      background: url(/car/carry/home/img/sp/btn-super_carry_arrow_right.png) transparent no-repeat;
      background-size: contain;
      right: -35px;
  }

  .tab__movieList .slick-dots {
      display: flex;
      justify-content: center;
      margin: 16px;
  }

  .tab__movieList .slick-dots li {
      display: inline-block;
      height: 10px;
      width: 10px;
      border-radius: 10px;
      background: #fff;
      margin: 0 6px;
  }

  .tab__movieList .slick-dots li button {
      display: none;
  }

  .tab__movieList .slick-dots .slick-active {
      background: #000;
  }

  .tab__movieList .slick-dots li button {
      font-size: 0;
  }

  .tab__movieCaption {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 60px;
      text-align: center;
      font-size: 12px;
      background-color: #fff;
  }


  .feature__measures {
      padding: 0 20px 0;
  }

  .feature__measures .feature__enclosure {
      padding-left: 20px;
      padding-right: 20px;
      margin-bottom: 20px;
  }

  .feature__measures .feature__enclosure .feature__col--txt {
      margin-top: 20px;
      font-size: 20px;
  }

  .feature__measures .feature__enclosure {
      font-size: 16px;
  }

  .feature__measures .feature__enclosure .feature__notes {
      font-size: 10px;
  }

  .feature__measures .feature__enclosure .feature__col--txt h4 {
      font-weight: bold;
      font-size: 16px;
      line-height: 1.375;
  }

  .feature__measures .feature__enclosure .feature__col--txt strong {
      font-size: 20px;
  }

  .feature__measures .feature__enclosure .feature__col--txt sup {
      font-size: 10px;
  }

  .feature__comment {
      font-size: 10px;
      padding: 0 40px 20px;
  }

  .feature__row--point04 .feature__col--img {
      position: relative;
  }

  .feature__row--point04 .feature__col--img img {
      position: relative;
      z-index: 2;
  }

  .feature__row--point04 .feature__col--img:before {
      content: "";
      position: absolute;
      display: block;
      bottom: -10px;
      width: 100%;
      height: 40px;
      background-color: #f1ede2;
      z-index: 0;
  }

  .feature__row--point04 .feature__col--txt {
      border-bottom: 1px solid #f1ede2;
      padding-bottom: 20px;
      margin: 20px 40px 0;
  }

  .feature__row--point04 .feature__col--txt h4 {
      font-size: 16px;
      font-weight: bold;
      margin-bottom: -6px;
  }

  .feature__row--point04 .feature__col--txt p {
      padding-top: 6px;
  }

  .feature__row--point04 .feature__col--txt .feature__notes {
      font-size: 10px;
  }

  .feature__row--point04Slide {
      padding-top: 20px;
  }

  .feature__row--point04Slide h4 {
      font-size: 16px;
      padding: 0 40px;
      font-weight: bold;
      line-height: 1.375;
  }

  .feature__row--point04Slide p {
      line-height: 1.66;
  }

  .feature__row--point04Slide .slick-prev,
  .feature__row--point04Slide .slick-next {
      font-size: 0;
      line-height: 0;
      position: absolute;
      top: 50%;
      display: block;
      padding: 0;
      -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
      transform: translate(0, -50%);
      cursor: pointer;
      color: transparent;
      border: none;
      outline: none;
      background: transparent;
      z-index: 8;
  }

  .feature__row--point04Slide .slick-prev {
      left: 0;
  }

  .feature__row--point04Slide .slick-next {
      right: 0;
  }

  .feature__row--point04Slide .slick-prev:before {
      content: "";
      background: url(/car/carry/home/img/sp/feature_slideLeft.png) no-repeat;
      background-size: contain;
      display: block;
      height: 70px;
      width: 30px;
  }

  .feature__row--point04Slide .slick-next:before {
      content: "";
      background: url(/car/carry/home/img/sp/feature_slideRight.png) no-repeat;
      background-size: contain;
      display: block;
      height: 70px;
      width: 30px;
  }

  .feature__row--point04Slide .feature__row--inner {
      display: flex;
      padding: 0 40px;
  }

  .feature__row--point04Slide .feature__row--inner .feature__col {
      flex: 1 1;
      padding: 10px;
  }

  .feature__row--point04Inner {
      padding: 0 40px;
  }

  .feature__row--point04Slide .slick-disabled {
      display: none !important;
  }

  .feature__row--point04Inner .feature__notes {
      font-size: 10px;
      margin-top: -10px;
  }

  /*----------------------------------------

      LINE UP

  ----------------------------------------*/

  .lineup__section h3 {
      text-align: center;
      font-size: 14px;
  }

  .lineup__section h3 .lineup__point {
      display: inline-block;
      width: 100px;
  }

  .lineup__section h3 img {
      width: 100%;
  }

  .typeOfCar {
      position: relative;
      padding-bottom: 26.6667vw;
      background: #f2f2f2;
      margin-top: 30px;
      padding: 10px 10.6667vw 0;
  }

  .typeOfCar .color__slider {
      margin: -36px -10.6667vw 20px;
  }

  .typeOfCar .color__slider .slick-slide {
      padding: 0 10.6667vw;
  }

  .typeOfCar .color__slider p {
      text-align: center;
      margin: 16px -10px;
      font-size: 10px;
  }

  .typeOfCar span.color__notes {
      display: inline-block;
      font-size: 10px;
      text-align: left;
  }

  .typeOfCar .slick-prev,
  .typeOfCar .slick-next {
      position: absolute;
      bottom: 4px;
      width: 13px;
      height: 21.5px;
      background-position: left center;
      background-size: cover !important;
      background-repeat: no-repeat;
      font-size: 0;
      line-height: 0;
      cursor: pointer;
      color: transparent;
      border: none;
      outline: none;
      background: transparent;
      z-index: 1;
  }

  .typeOfCar .slick-prev {
      left: 11vw;
      background-image: url(/car/carry/home/img/sp/color_left_arrow02.png);
  }

  .typeOfCar .slick-next {
      background-image: url(/car/carry/home/img/sp/color_right_arrow02.png);
      right: 14vw;
  }

  .typeOfCar .slick-dots {
      text-align: center;
      width: 100%;
  }

  .typeOfCar .slick-dots li {
      height: 14px;
      width: 14px;
      border-radius: 50%;
      display: inline-block;
      margin-right: 15px;
      cursor: pointer;
      border: 2px solid transparent;
      box-sizing: border-box;
  }

  .typeOfCar .slick-dots li button {
      display: none;
  }

  .color__slide__NEW {
    color: #ff0000;
    font-weight: bold;
  }

  .typeOfCar .slick-dots li:first-of-type {
    background-color: #fff;
    border: 1px solid #a7b0ba;
  }

  .typeOfCar .slick-dots li:nth-of-type(2) {
    background-color: #E2E6EB;
  }

  .typeOfCar .slick-dots li:nth-of-type(3) {
    background-color: #db8d54;
  }

  .typeOfCar .slick-dots li:nth-of-type(4) {
    background-color: #003F4E;
  }

  .typeOfCar .slick-dots li:nth-of-type(5) {
    background-color: #7b8579;
  }

  .typeOfCar .slick-dots li:nth-of-type(6) {
    background-color: #7F9FA6;
  }

  .typeOfCar .slick-dots li:nth-of-type(7) {
    background-color: #BEBFBA;
  }

  .typeOfCar .slick-dots li.slick-active {
      transform: scale(1.3);
  }

  .typeOfCar h3 {
      margin-bottom: 1.5vw;
  }

  .typeOfCar p {
      padding-top: 0 !important;
  }

  .typeOfCar .typeOfCar__content {
      background: #fff;
      margin: 0 -10.6667vw;
      padding: 30px 5.333vw;
  }

  .typeOfCar .carImg {
      text-align: center;
      /* margin-bottom: -1.6667vw; */
  }

  .typeOfCar .carImg img {
      width: 68vw !important;
      height: auto;
  }

  .typeOfCar .price {
      padding-bottom: 6vw;
      margin-bottom: 3.2vw;
  }

  .typeOfCar .price h3 {
      text-align: left;
      margin-bottom: 0.8vw;
  }

  .tab__content--carry .typeOfCar .price {
      border-bottom: 2px solid #172a88;
  }

  .tab__content--superCarry .typeOfCar .price {
      border-bottom: 1px solid #f18d00;
  }

  .typeOfCar .price h3 img {
      width: 12.266vw !important;
  }

  .typeOfCar .price-txt01 {
      font-size: 2.6667vw;
      margin-bottom: 1.6vw !important;
  }

  .typeOfCar .spec {
      font-family: "Hiragino Kaku Gothic Pro";
      font-weight: bold;
      font-size: 2.6667vw;
  }

  .typeOfCar .price__ammount span {
      font-size: 3.7333vw;
      font-weight: 400;
  }

  .typeOfCar .price__ammount span.sum {
      font-family: "HelveticaNeue";
      font-size: 9.8667vw;
      line-height: 1;
  }

  .typeOfCar .price__ammount .tax {
      display: block;
      padding-top: 1.3333vw;
      line-height: 1;
      font-size: 2.6667vw;
  }

  .typeOfCar .performance h3 img {
      width: 31.7333vw !important;
  }

  .typeOfCar .performance .jc08 {
      display: inline-block;
      margin-bottom: -.8vw;
      width: 11.6vw !important;
  }

  .typeOfCar .performance .price-icon {
      width: 18.9333vw !important;
  }

  .typeOfCar .performance {
      padding-bottom: 8vw;
  }

  .typeOfCar .performance h3 {
      text-align: left;
      margin-bottom: 2.333vw !important;
  }

  .typeOfCar .performance > p:nth-child(2) {
      font-size: 3.7333vw;
      font-weight: bold;
      line-height: 1.43;
      margin-bottom: 1.6vw !important;
  }

  .typeOfCar .performance > p:nth-child(2) .txt {
      font-size: 2.933vw;
  }

  .typeOfCar .performance p {
      font-size: 2.6667vw;
  }

  .typeOfCar .performance p.num {
      font-family: "HelveticaNeue";
      font-size: 9.8667vw;
      font-weight: 200;
      line-height: 1;
      padding-right: 2.6667vw;
  }

  .typeOfCar .performance p.kml {
      padding-top: 5px;
      font-size: 3.7333vw;
  }

  .typeOfCar .performance .price-icon {
      padding-left: 2.6667vw;
  }

  .typeOfCar .performance .note {
      padding-top: 2.6667vw !important;
      line-height: 1.8;
  }

  .typeOfCar .price__moreDetails {
      line-height: 1;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
  }

  .typeOfCar .price__moreDetails * {
    line-height: 1;
  }

  .typeOfCar small {
      font-size: 2.6667vw;
      vertical-align: super;
  }

  .typeOfCar .price__btn {
      font-size: 3.2vw;
      width: 78.6667vw;
      height: 13.3333vw;
      padding: 5.0667vw;
      width: 100%;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -webkit-align-items: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
      -webkit-justify-content: center;
          -ms-flex-pack: center;
              justify-content: center;
      position: relative;
      background-color: #000;
      color: #fff !important;
      margin: 0 auto;
      font-weight: bold;
      margin-top: 20px;
      box-sizing: border-box;
      text-align: center;
  }

  .typeOfCar .price__btn:first-of-type {
      margin-top: 0;
  }

  .typeOfCar .price__btn::before {
      content: '';
      background-image: url(/car/carry/home/img/sp/btn-arrow.png);
      position: absolute;
      width: 1.8667vw;
      height: 3.2vw;
      background-size: 1.8667vw 3.2vw;
      top: 50%;
      right: 24px;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      -webkit-transition: all .2s;
      transition: all .2s;
  }

  /*----------------------------------------

      modal

  ----------------------------------------*/
  #carryModal {
      position: fixed;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      overflow: auto;
      -webkit-overflow-scrolling: touch;
      overflow-scrolling: touch;
      z-index: 9999;
      display: none;
      overflow: auto;
  }

  #carryModal .inner {
      display: table;
      padding: 0 5.3333vw;
      width: 100%;
      height: 100%;
  }

  #carryModal .inner-block {
      display: table-cell;
      vertical-align: middle;
  }

  #carryModal.is-open {
      opacity: 1;
      display: block;
  }

  #carryModal img {
      width: 100%;
  }

  #carryModal .modal-box {
      position: relative;
      background-color: #fff;
      box-shadow: 0px 0px 24px 0px rgba(2, 0, 0, 0.6);
      display: none;
  }

  #carryModal .modal-box.active {
      display: block;
  }

  #carryModal .modal-box h3 {
      font-size: 5.3333vw;
      font-weight: bold;
      line-height: 1.4;
      text-align: center;
  }

  #carryModal .modal-box h4 {
      font-weight: bold;
  }

  #carryModal .modal-box small {
      font-size: 2.6667vw;
      vertical-align: super;
  }

  #carryModal .modal__header {
      padding: 10.6666vw 0 5.3333vw;
  }

  #carryModal .modal__bottom {
      padding: 3.4667vw 6.6667vw 5.733vw;
  }

  #carryModal .modal__bottom .txt {
      padding-top: 4px;
      font-size: 3.2vw;
  }

  #carryModal .modal__row {
      box-sizing: border-box;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
  }

  #carryModal .modal__row .modal__img {
      flex-basis: 50%;
      padding-right: 2vw;
      box-sizing: border-box;
  }

  #carryModal .modal__row .modal__txt {
      flex-basis: 50%;
      padding-left: 2vw;
      box-sizing: border-box;
  }

  #carryModal .modal__txt {
      margin-bottom: 3.2vw;
      line-height: 1.6;
  }

  #carryModal .modal__txt h4 {
    line-height: inherit !important;
  }

  #carryModal .modal__txt p:nth-child(1) {
      padding-top: 0 !important;
  }

  #carryModal .modal__img {
      text-align: center;
      margin-bottom: 2.6666vw;
  }

  #carryModal .bg {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.7);
      z-index: -1;
  }

  #carryModal .close {
      position: absolute;
      top: 0;
      right: 0;
      width: 35px;
      height: 35px;
      background-image: url(/car/carry/home/img/sp/btn_close_modal.png);
      background-size: 18px 18px;
      background-repeat: no-repeat;
      background-position: center center;
      cursor: pointer;
  }

  #carryModal .modal-box--01 .close ,
  #carryModal .modal-box--02 .close ,
  #carryModal .modal-box--03 .close {
      background-color: #172a88;
  }

  #carryModal .modal-box--04 .close ,
  #carryModal .modal-box--05 .close ,
  #carryModal .modal-box--06 .close {
      background-color: #f18d00;
  }
  #carryModal .modal-box--01 .modal__header ,
  #carryModal .modal-box--02 .modal__header ,
  #carryModal .modal-box--03 .modal__header {
      color: #172a88;
  }

  #carryModal .modal-box--04 .modal__header ,
  #carryModal .modal-box--05 .modal__header ,
  #carryModal .modal-box--06 .modal__header {
      color: #f18d00;
  }

  .modal__sup {
      margin-right: 30px;
  }
  /*------------------------------
  *
  * video modal
  *
  *------------------------------*/
  .movieModal {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 1000;
      text-align: center;
      display: none;
  }

  .movieModal .bg {
      position: absolute;
      top: 0;
      left: 0;
      z-index: 1;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.7);
  }

  .movieModal video {
      position: relative;
      z-index: 2;
      display: none;
  }

  .movieModal video:focus {
      outline: none;
  }

  .movieModal video.active {
      display: block;
  }

  .movieModal .portrait {
      position: relative;
      display: inline-block;
      height: 100%;
  }

  .movieModal .portrait video {
      width: auto;
      height: 100%;
      margin: 0 auto;
  }

  .movieModal .landscape {
      position: absolute;
      top: 50%;
      left: 50%;
      z-index: 2;
      display: inline-block;
      width: 80%;
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
  }

  .movieModal .landscape video {
      height: auto;
      width: 100%;
  }

  .movieModal .close {
      position: absolute;
      top: -130px;
      right: 0;
      z-index: 2;
      content: '';
      width: 5.7333vw;
      height: 5.7333vw;
      background-image: url(/car/carry/home/img/sp/btn_close.png);
      background-repeat: no-repeat;
      background-position: center center;
      background-size: cover;
      cursor: pointer;
      display: none;
  }

  .movieModal .landscape .close {
      top: -30px;
  }

  .movieModal .portrait.active .close,
  .movieModal .landscape.active .close {
      display: block;
  }

  #tax{
    margin-bottom:30px;
  }
}

/* TAB (based on SP) */
@media only screen and (min-width: 751px) and (max-width: 1140px) {
  #carryModal .inner {
    max-width: 768px;
    margin: 0 auto;
  }
  .carry-note {
    font-size: 20px;
  }
  .tab__contentInner .carImg .btn-plus {
    width: 87px;
  }
  .tab__content--carry .tab__contentInner .carImg .btn-plus--01 {
    top: 239px;
    left: 63px;
  }

  .tab__content--carry .tab__contentInner .carImg .btn-plus--02 {
    top: 179px;
    right: 204px;
  }

  .tab__content--carry .tab__contentInner .carImg .btn-plus--03 {
    top: 347px;
    right: 106px;
  }

  .tab__content--superCarry .tab__contentInner .carImg .btn-plus--01 {
    top: 261px;
    left: 220px;
  }

  .tab__content--superCarry .tab__contentInner .carImg .btn-plus--02 {
    top: 29px;
    right: 204px;
  }

  .tab__content--superCarry .tab__contentInner .carImg .btn-plus--03 {
    top: 384px;
    right: 46px;
  }
  .typeOfCar {
    padding-bottom: 200px;
    padding: 10px 80px 0;
  }

  .typeOfCar .color__slider {
    margin: -36px -81px 20px;
  }

  .typeOfCar .color__slider .slick-slide {
    padding: 0 80px;
  }

  .typeOfCar .slick-prev {
    left: 120px;
  }

  .typeOfCar .slick-next {
    right: 150px;
  }


  .typeOfCar h3 {
    margin-bottom: 11px;
  }

  .typeOfCar .typeOfCar__content {
    margin: 0 -81px;
    padding: 30px 39px;
  }

  .typeOfCar .carImg img {
    width: 510px !important;
  }

  .typeOfCar .price {
    padding-bottom: 45px;
    margin-bottom: 24px;
  }

  .typeOfCar .price h3 {
    margin-bottom: 6px;
  }

  .typeOfCar .price h3 img {
    width: 91px !important;
  }

  .typeOfCar .price-txt01 {
    font-size: 20px;
    margin-bottom: 12px !important;
  }

  .typeOfCar .spec {
    font-size: 20px;
  }

  .typeOfCar .price__ammount span {
    font-size: 27px;
  }

  .typeOfCar .price__ammount span.sum {
    font-size: 74px;
  }

  .typeOfCar .price__ammount .tax {
    padding-top: 9px;
    font-size: 20px;
  }

  .typeOfCar .performance h3 img {
    width: 237px !important;
  }

  .typeOfCar .performance .jc08 {
    margin-bottom: -6px;
    width: 87px !important;
  }

  .typeOfCar .performance .price-icon {
    width: 141px !important;
  }

  .typeOfCar .performance {
    padding-bottom: 60px;
  }

  .typeOfCar .performance h3 {
    margin-bottom: 17px !important;
  }

  .typeOfCar .performance > p:nth-child(2) {
    font-size: 27px;
    margin-bottom: 12px !important;
  }

  .typeOfCar .performance > p:nth-child(2) .txt {
    font-size: 21px;
  }

  .typeOfCar .performance p {
    font-size: 20px;
  }

  .typeOfCar .performance p.num {
    font-size: 74px;
    padding-right: 20px;
  }

  .typeOfCar .performance p.kml {
    font-size: 27px;
  }

  .typeOfCar .performance .price-icon {
    padding-left: 20px;
  }

  .typeOfCar .performance .note {
    padding-top: 20px !important;
  }

  .typeOfCar small {
    font-size: 20px;
  }

  .typeOfCar .price__btn {
    font-size: 24px;
    width: 590px;
    height: 99px;
    padding: 38px;
  }

  .typeOfCar .price__btn::before {
    width: 14px;
    height: 24px;
    background-size: 14px 24px;
  }

  #carryModal .inner {
    padding: 0 39px;
  }

  #carryModal .modal-box h3 {
    font-size: 39px;
  }

  #carryModal .modal-box small {
    font-size: 20px;
  }

  #carryModal .modal__header {
    padding: 79px 0 39px;
  }

  #carryModal .modal__bottom {
    padding: 26px 50px 42px;
  }

  #carryModal .modal__bottom .txt {
    font-size: 24px;
  }

  #carryModal .modal__row .modal__img {
    padding-right: 15px;
  }

  #carryModal .modal__row .modal__txt {
    padding-left: 15px;
  }

  #carryModal .modal__txt {
    margin-bottom: 24px;
  }

  #carryModal .modal__img {
    margin-bottom: 19px;
  }

  .movieModal .close {
    width: 42px;
    height: 42px;
  }

  .button {
      height: 100px;
      font-size: 24px;
  }
}


/* SP(Small) */
@media only screen and (max-width: 374px) {
  .g-nav-list a {
    padding: 0 5.33333vw;
  }
  .g-nav-list .list-1 a {
    font-size: 19px;
    font-size: 5.06667vw;
  }
  .g-nav-list .list-1 i {
    width: 10.93333vw;
  }
  .g-nav-list .list-2 a {
    font-size: 14px;
    font-size: 3.73333vw;
  }
  .g-nav-list .list-2 i {
    width: 8.26667vw;
  }
  .g-nav-list i img {
    width: 30px;
  }
}

@-webkit-keyframes scrollDownSP {
    0% {
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
    }
    30% {
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
    }
    50% {
      -webkit-transform: translate(0, 40px);
      transform: translate(0, 40px);
    }
    70% {
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
    }
    100% {
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
    }
}

@keyframes scrollDownSP {
    0% {
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
    }
    30% {
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
    }
    50% {
      -webkit-transform: translate(0, 40px);
      transform: translate(0, 40px);
    }
    70% {
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
    }
    100% {
      -webkit-transform: translate(0, 0);
      transform: translate(0, 0);
    }
}


/* animation */
@-webkit-keyframes passing-barSP{
	0% {
		left: 0;
		right: auto;
		width: 0;
	}
	50% {
		left: 0;
		right: auto;
		width: 100%;
	}
	51% {
		left: auto;
		right: 0;
		width: 100%;
	}
	100% {
		left: auto;
		right: 0;
		width: 0;
	}
}

@keyframes passing-barSP{
	0% {
		left: 0;
		width: 0;
	}
	50% {
		left: 0;
		width: 100%;
	}
	51% {
		left: 0;
		width: 100%;
	}
	100% {
		left: 100%;
		width: 0;
	}
}

@-webkit-keyframes passing-txtSP{
	0% { opacity: 0; }
	50% { opacity: 0; }
	100% { opacity: 1; }
}

@keyframes passing-txtSP{
	0% { opacity:0; }
	50% { opacity:0; }
	100% { opacity:1; }
}

/*custom animation*/
@-webkit-keyframes bounceInUpCustomSP {
    0%,
    60%,
    75%,
    90%,
    100% {
      -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
      opacity: 0;
    }
    60% {
      opacity: 1;
      -webkit-transform: translate3d(0, -20px, 0);
      transform: translate3d(0, -20px, 0);
    }
    75% {
      opacity: 1;
      -webkit-transform: translate3d(0, 10px, 0);
      transform: translate3d(0, 10px, 0);
    }
    90% {
      opacity: 1;
      -webkit-transform: translate3d(0, -5px, 0);
      transform: translate3d(0, -5px, 0);
    }
    100% {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
}

@keyframes bounceInUpCustomSP {
    0%,
    60%,
    75%,
    90%,
    100% {
      -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
      animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    0% {
      opacity: 0;
      -webkit-transform: translate3d(0, 80px, 0);
      transform: translate3d(0, 80px, 0);
    }
    60% {
      opacity: 1;
      -webkit-transform: translate3d(0, -20px, 0);
      transform: translate3d(0, -20px, 0);
    }
    75% {
      opacity: 1;
      -webkit-transform: translate3d(0, 10px, 0);
      transform: translate3d(0, 10px, 0);
    }
    90% {
      opacity: 1;
      -webkit-transform: translate3d(0, -5px, 0);
      transform: translate3d(0, -5px, 0);
    }
    100% {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
    }
}

/*--------------------
  parts
--------------------*/
.generalBtn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 226px;
  height: 48px;
  margin: 0;
  font-size: 12px;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  background-color: #363636;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: .5s;
  transition: .5s;
}

.generalBtn {
  position: relative;
  color: #FFF;
  line-height: 1;
}
.generalBtn:before {
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	width: 7px;
	height: 10px;
	margin-top: -5px;
  background: center center url(/car/carry/home/img/btn_arrow.png) no-repeat;
  background-size: 7px 10px;
  transition: background-image .5s;
  pointer-events: none;
}

.generalBtn:hover {
  background: #f1ede2;
}

.generalBtn:hover:before {
  background-image: url(/car/carry/home/img/btn_arrow_hover.png);
}

.generalBtn:hover {
  color: #363636;
  text-decoration: none;
}


/* movie modal
-----------------------------------------------------*/
.simulation {
  max-width: 1134px;
  margin: 120px auto 0;
  padding: 0 15px;
  text-align: center;
}

@media screen and (max-width: 750px) {
  .simulation {
    margin: 60px auto 0;
    padding: 0 0;
  }
}

.simulation__title {
  line-height: 1.8;
  font-size: 24px;
  font-weight: bold;
}
@media screen and (max-width: 750px) {
  .simulation__title {
    font-size: 18px;
  }
}

.simulation__banner {
  margin: 20px 0 0;
}

.simulation__banner a {
  display: inline-block;
}

.simulation__banner img {
  max-width: 100%;
}

.simulation__more {
  width: 266px;
  margin: 40px auto;
}

@media screen and (max-width: 750px) {

  .simulation__more {
    width: 100%;
    margin: 40px auto;
  }

  .simulation__more:hover {
    background: #f1ede2;
    color: #363636;
  }
}

.simulation__more:before {
  width: 10px;
  height: 7px;
  margin-top: -2px;
  background-image: url(/car/carry/home/img/btn_arrow_bottom.png);
  background-size: 10px 7px;
}

.simulation__more:hover:before {
  background-image: url(/car/carry/home/img/btn_arrow_bottom_hover.png);
}

@media screen and (max-width: 750px) {
  .simulation__more:hover:before {
    background-image: url(/car/carry/home/img/btn_arrow_bottom_hover.png);
  }
}

.simulation__more.is-show:before {
  background-image: url(/car/carry/home/img/btn_arrow_top.png);
}

.simulation__more.is-show:hover:before {
  background-image: url(/car/carry/home/img/btn_arrow_top_hover.png);
}

@media screen and (max-width: 750px) {
  .simulation__more.is-show:hover:before {
    background-image: url(/car/carry/home/img/btn_arrow_top_hover.png);
  }
}

.simulation__content {
  overflow: hidden;
  max-height: 0;
  background: #F4F4F4;
  -webkit-transition: max-height .8s ease;
  transition: max-height .8s ease;
}

@media screen and (max-width: 750px) {
  .simulation__content {
    background: #F2F2F2;
    margin: 0 -5.3333vw -30px;
  }
}

.simulation__content.is-show {
  max-height: 2000px;
}

.simulation__steps {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 70px 50px 0;
}

@media screen and (max-width: 750px) {
  .simulation__steps {
    margin: 70px 15px 0;
  }
}

@media screen and (max-width: 1140px) {
  .simulation__steps {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 30px 20px 0;
  }
}

.simulation__step {
  position: relative;
  width: 25%;
}

@media screen and (min-width: 1140px) {
  .simulation__step:nth-child(1):before,
  .simulation__step:nth-child(2):before,
  .simulation__step:nth-child(3):before {
    content: "";
    position: absolute;
    top: 50%;
    right: -8px;
    width: 10px;
    height: 16px;
    margin-top: -20px;
    background: center center url(/car/carry/home/img/simulation_step_arrow.png) no-repeat;
    background-size: 10px 16px;
  }
}

@media screen and (max-width: 1140px) {
  .simulation__step {
    width: 50%;
    margin: 15px 0 0;
    padding: 15px;
  }
}

#mainContents p.simulation__stepImage1,
#mainContents p.simulation__stepImage2 {
  max-width: 100%;
}

@media (max-width: 960px) {
  .simulation__stepImage1 {
    width: 66.5% !important;
    max-width: 98px !important;
  }
}

@media (max-width: 960px) {
  .simulation__stepImage2 {
    max-width: 146px  !important;
  }
}


#mainContents p.simulation__stepHeading {
  margin: 5px 0 12px;
  padding: 0;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}

@media screen and (max-width: 750px) {
  #mainContents p.simulation__stepHeading {
    margin: 5px -15px 12px;
    font-size: 4.2vw;
  }
}

.simulation__stepText {
  margin: 18px 0 0;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
}

@media screen and (max-width: 750px) {
  .simulation__stepText {
    margin: 10px -15px 0;
    font-size: 3.0vw;
  }

 .typeOfCar p.simulation__stepText{
    padding-top: 10px !important;
 }
}

.simulation__movie {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 432px;
  margin: 50px auto 0;
  cursor: pointer;
}

@media screen and (max-width: 750px) {
  .simulation__movie {
    margin: 30px auto 0;
    padding: 0 15px;
  }
}

.simulation__movie img {
  max-width: 100%;
}

@media not all and (max-width: 750px) {
  .simulation__movie:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    width: 50px;
    height: 50px;
    background: url(/car/carry/home/img/btn_play_white.svg) center center no-repeat;
    background-size: contain;
    transform: translate(-50%,-50%);
  }

  .simulation__movie img {
    position: relative;
    z-index: 1;
    width: 100%;
    cursor: pointer;
    transition: transform 0.4s ease;
  }

  .simulation__movie:hover img {
    transform: scale(1.1);
  }
}

#mainContents p.simulation__note {
  padding: 70px 60px 60px;
  font-size: 10px;
  text-align: left;
}

@media screen and (max-width: 750px) {
#mainContents p.simulation__note {
    padding: 0 15px 60px;
  }
}

@media screen and (max-width: 750px) {
#mainContents p.simulation__note {
    margin: 30px 0 0;
    padding: 0 30px 60px;
    font-size: 11px;
  }
}

#main .color-variations {
  margin: 50px auto 38px;
}

#main .color-variations-img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 1100px;
  width: 100%;
}

@media screen and (max-width: 750px) {
  #main .color-variations {
    margin: 40px auto 28px;
  }

  #main .color-variations-img {
    max-width: calc(325 / 375 * 100vw);
  }
}

@media (max-width: 960px) and (min-width: 751px) {
  /* override common_r */
  #main .color-variations .showPC {
    visibility: visible;
  }
}