/* @import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Oswald:wght@200..700&family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&display=swap"); */
@import url(./reset.css);

.pc {
  display: block;
}
.sp {
  display: none;
}

.hover {
  opacity: 1;
  transition: all 0.3s ease;
}
.hover:hover {
  opacity: 0.7;
}

.content {
  width: 1024px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

header {
  width: 100%;
  height: 100px;
  background-color: black;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: fixed;
  z-index: 1000;
}
.header__logo {
  display: flex;
  gap: 33.5px;
  align-items: center;
  font-size: 32px;
  font-family: "Noto Serif JP", serif;
  font-weight: bold;
  color: white;
  text-decoration: none;
  margin-left: 44px;
}
.header__logo span {
  font-family: "Zen Kaku Gothic New", sans-serif;
}
.header__logo__image {
  width: 138.45px;
  height: 61px;
}
.banner {
  background-image: url(../img/banner.webp);
  width: 100%;
  height: 62.60416666666667vw;
  position: relative;
  display: flex;
  justify-content: space-between;
  background-repeat: no-repeat;
  background-size: cover;
}
.banner__shadowleft {
  width: 53.59374999999999vw;
  height: 62.60416666666667vw;
  background: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
  position: absolute;
  top: 0;
  left: 0;
}
.banner__shadowbotton {
  width: 100%;
  height: 12.447916666666666vw;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0),
    rgba(255, 255, 255, 1)
  );
  position: absolute;
  bottom: 0;
}
.banner__left {
  padding-top: 11.145833333333334vw;
  position: relative;
}
.banner__left__exc {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 2.6vw;
  font-weight: bold;
  color: white;
  margin-left: 5.21vw;
}
.banner__left__noun {
  font-family: "Noto Serif JP", serif;
  font-size: 5.625vw;
  font-weight: bold;
  color: white;
  margin-left: 5.21vw;
  line-height: 6.458333333333334vw;
  margin-top: 0;
}
.banner__left__date {
  font-family: "Noto Serif JP", serif;
  font-size: 3.0729166666666665vw;
  font-weight: bold;
  color: white;
  margin-left: 5.21vw;
  line-height: 4.427083333333334vw;
  margin-top: 0.5208333333333333vw;
}
.banner__left__newyear {
  font-family: "Noto Serif JP", serif;
  font-size: 1.8229166666666667vw;
  font-weight: bold;
  color: white;
  margin-left: 5.21vw;
  line-height: 2.604166666666667vw;
  margin-top: 2.34375vw;
}
.banner__comp {
  background: url(../img/comp.webp);
  width: 41.40625vw;
  height: 15.46875vw;
  margin-left: 5.21vw;
  margin-top: 3.0729166666666665vw;
  background-repeat: no-repeat;
  background-size: cover;
  display: inline-block;
}
.comp__date {
  font-family: "Noto Serif JP", serif;
  font-size: 2.55vw;
  font-weight: bold;
  color: #880803;
  padding-top: 1.3vw;
  margin-left: 4.43vw;
}
.comp__date span {
  font-size: 1.67vw;
}
.comp__title {
  font-family: "Noto Serif JP", serif;
  font-size: 2.3958333333333335vw;
  font-weight: bold;
  color: #aa0000;
  margin-top: 2.083333333333333vw;
  margin-left: 1.7708333333333333vw;
}
.comp__desc {
  font-family: "Noto Serif JP", serif;
  font-size: 1.1458333333333333vw;
  color: black;
  margin-top: 1.979166666666667vw;
  margin-left: 1.7708333333333333vw;
  line-height: 1.71875vw;
}
.comp__gift {
  font-family: "Noto Serif JP", serif;
  font-size: 2.34375vw;
  font-weight: bold;
  color: black;
  margin-top: 1.822916666666667vw;
  margin-left: 1.7708333333333333vw;
}
.comp__gift span {
  font-size: 1.5625vw;
}
.banner__right {
  padding-top: 14.48vw;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.banner__type {
  width: 6.62vw;
  height: 17.41vw;
  margin-right: 6.03vw;
}
.banner__reserve {
  width: 12.24vw;
  height: 12.24vw;
  border-radius: 50%;
  background-color: #aa0000;
  box-shadow: 0vw 0.16vw 0.31vw 0vw rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: 0vw 0.16vw 0.31vw 0vw rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0vw 0.16vw 0.31vw 0vw rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: "Zen Kaku Gothic New", sans-serif;
  text-decoration: none;
  gap: 0.5208333333333333vw;
  position: fixed;
  right: 2.9166666666666665vw;
  bottom: 1.5625vw;
  z-index: 1000;
}
.reserve__prem1 {
  font-size: 1.09vw;
  color: white;
}
.reserve__prem2 {
  font-size: 2.24vw;
  color: #f5ff00;
}
.reserve__prem3 {
  font-size: 1.56vw;
  color: white;
}
.reserve__arrow {
  width: 4.91vw;
  height: 0.61vw;
}

.lineup {
  width: 100%;
  height: fit-content;
  background-color: white;
  padding-bottom: 257px;
  padding-top: 149px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.lineup__title {
  font-family: "Noto Serif JP", serif;
  font-size: 50px;
  letter-spacing: 0.1em;
  font-weight: bold;
  color: black;
}
.lineup__car {
  width: 904px;
  display: flex;
  row-gap: 71px;
  margin-top: 69px;
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: wrap;
}
.lineup__each {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.lineup__image {
  width: 431px;
  height: 227px;
}
.lineup__name {
  font-family: "Zen Kaku Gothic New", sans-serif;
  margin-top: 8px;
  font-size: 18px;
  color: black;
}

.videos {
  width: 100%;
  padding-top: 81px;
  padding-bottom: 119px;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: black;
}
.videos__en {
  font-family: "Noto Serif JP", serif;
  font-size: 50px;
  letter-spacing: 0.1em;
  font-weight: bold;
  color: white;
}
.videos__jp {
  font-family: "Noto Serif JP", serif;
  font-size: 20px;
  margin-top: 19px;
  color: white;
}
.video__content {
  font-family: "Zen Kaku Gothic New", sans-serif;
  margin-top: 80px;
  width: 904px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 70px;
}
.each__video {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
}
.video__thumbnail {
  position: relative;
  cursor: pointer;
}
.video__image {
  width: 420px;
  height: 280px;
  border-radius: 20px;
}
.video__overlay {
  width: 420px;
  height: 280px;
  border-radius: 20px;
  position: absolute;
  top: 0;
  left: 0;
}
.video__desc1 {
  font-size: 18px;
  line-height: 30px;
  text-align: center;
  /* 	height: 60px; */
  color: white;
}
.video__desc2 {
  font-size: 16px;
  line-height: 30px;
  text-align: center;
  color: white;
}
#videoModal {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 1001;
  background-color: black;
}
.modal-content {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.close {
  color: white;
  font-size: 100px;
  position: absolute;
  top: 0%;
  right: 1%;
  cursor: pointer;
}
#videoPlayer {
  width: 90%;
}

.about {
  width: 100%;
  padding-top: 188px;
  padding-bottom: 185px;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}
.mini__cooper,
.mini__countryman,
.mini__fivedoor,
.mini__electric {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.mini__countryman {
  margin-top: 196px;
}
.mini__fivedoor {
  margin-top: 181px;
}
.mini__electric {
  margin-top: 181px;
}
.about__title {
  font-family: "Noto Serif JP", serif;
  font-size: 45px;
  line-height: 65px;
  font-weight: 400;
  font-weight: bold;
}
.about__banner {
  width: 100vw;
  margin-top: 50px;
}
.about__signature {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 20px;
  line-height: 30px;
  margin-top: 45px;
  text-align: center;
}
.about__main {
  font-family: "Noto Serif JP", serif;
  font-size: 32px;
  line-height: 46px;
  font-weight: bold;
  text-align: center;
}
.about__main.cooper1 {
  margin-top: 67px;
}
.about__main.cooper2 {
  margin-top: 77px;
}
.about__main.cooper3 {
  margin-top: 77px;
}

.about__main.countryman1 {
  margin-top: 67px;
}
.about__main.countryman2 {
  margin-top: 56px;
}
.about__main.countryman3 {
  margin-top: 65px;
}

.about__main.fivedoor1 {
  margin-top: 97px;
}

.about__main.electric1 {
  margin-top: 67px;
}

.about__left {
  display: flex;
  flex-direction: row;
  gap: 54px;
}
.about__right {
  display: flex;
  flex-direction: row-reverse;
  gap: 54px;
}
.about__left.cooper1 {
  margin-top: 45px;
}
.about__right.cooper2 {
  margin-top: 47px;
}
.about__left.cooper3 {
  margin-top: 50px;
}
.about__right.cooper4 {
  margin-top: 50px;
}

.about__left.countryman1 {
  margin-top: 45px;
}
.about__right.countryman2 {
  margin-top: 50px;
}
.about__left.countryman3 {
  margin-top: 45px;
}

.about__left.fivedoor1 {
  margin-top: 45px;
}

.about__left.electric1 {
  margin-top: 45px;
}

.about__image {
  width: 350px;
  height: 270px;
}
.about__desc {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 20px;
  line-height: 30px;
  width: 500px;
}

.recommend {
  width: 100%;
  padding-top: 81px;
  padding-bottom: 184px;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: black;
}
.recommend__content {
  width: 904px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.recommend__en {
  font-family: "Noto Serif JP", serif;
  font-size: 50px;
  letter-spacing: 0.1em;
  font-weight: bold;
  color: white;
}
.recommend__jp {
  font-family: "Noto Serif JP", serif;
  font-size: 20px;
  margin-top: 16px;
  color: white;
}
.recommed__title {
  font-family: "Noto Serif JP", serif;
  font-size: 32px;
  line-height: 46px;
  font-weight: bold;
  color: white;
  margin-top: 96px;
}
.recommend__each {
  display: flex;
  gap: 44px;
  margin-top: 50px;
}
.recommend__image {
  width: 284px;
  height: 284px;
}
.recommend__name {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 20px;
  line-height: 30px;
  margin-top: 15px;
  color: white;
  text-align: center;
}
.recommend__desc {
  width: 576px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 20px;
  line-height: 30px;
  color: white;
}
.recommend__banner {
  width: 904px;
  height: 419px;
  margin-top: 27px;
}

.showroom {
  width: 100%;
  padding-top: 142px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.showroom__content {
  width: 904px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.showroom__en {
  font-family: "Noto Serif JP", serif;
  font-size: 50px;
  letter-spacing: 0.1em;
  font-weight: bold;
}
.showroom__jp {
  font-family: "Noto Serif JP", serif;
  font-size: 20px;
  margin-top: 16px;
}
.showroom__address {
  display: flex;
  margin-top: 66px;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.address__text {
  
}
.address__title {
  font-size: 36px;
  font-family: "Noto Serif JP", serif;
}
.address__desc {
  font-size: 16px;
  line-height: 30px;
  margin-top: 25px;
  font-family: "Zen Kaku Gothic New", sans-serif;
}
.showroom__address__image {
  width: 420px;
  height: 280px;
}
.showroom__map {
  margin-top: 54px;
  width: 904px;
  height: 340px;
}
.showroom__images {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-top: 70px;
}
.showroom__image {
  width: 420px;
  height: 280px;
}

.faq {
  width: 100%;
  padding-top: 147px;
  padding-bottom: 239px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.faq__content {
  width: 904px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.faq__en {
  font-family: "Noto Serif JP", serif;
  font-size: 50px;
  letter-spacing: 0.1em;
  font-weight: bold;
}
.faq__jp {
  font-family: "Noto Serif JP", serif;
  font-size: 20px;
  margin-top: 16px;
}
.faq__list {
  margin-top: 59px;
  display: flex;
  flex-direction: column;
  gap: 45px;
}
.faq__each {
  width: 904px;
  font-family: "Zen Kaku Gothic New", sans-serif;
}
.faq__q {
  font-size: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid black;
  width: 100%;
}
.faq__a {
  font-size: 16px;
  margin-top: 20px;
  line-height: 30px;
}

footer {
  width: 100%;
  background-color: black;
  height: 78px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.footer__content {
  width: 904px;
  display: flex;
  justify-content: space-between;
  font-family: "Zen Kaku Gothic New", sans-serif;
}
.footer__corp {
  font-size: 16px;
  color: white;
}
.footer__link {
  font-size: 16px;
  color: white;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
}
.footer__link__img {
  width: 20px;
  height: 20px;
}

.test__drive {
  width: 100%;
  padding-top: 234px;
  padding-bottom: 132px;
  display: flex;
  flex-direction: column;
  align-items: center;
  overflow: hidden;
}
.drive__en {
  font-family: "Oswald", sans-serif;
  font-size: 50px;
  letter-spacing: 0.1em;
  font-weight: bold;
}
.drive__jp {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 20px;
  margin-top: 19px;
}
.forms {
  font-family: "Zen Kaku Gothic New", sans-serif;
  width: 850px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  margin-top: 100px;
}
.screen-reader-response {
  display: none;
}
.form__container {
  display: flex;
  gap: 40px;
  width: 850px;
}
.form__label {
  width: 178px;
  min-height: 140px;
  padding-left: 17px;
  background-color: #e3e3e3;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.label__title {
  font-size: 20px;
}
.label__required {
  font-size: 14px;
  padding: 4px 9px;
  background-color: #9a0000;
  width: fit-content;
  color: white;
  margin-top: 10px;
}
.label__hint {
  font-size: 14px;
  margin-top: 16px;
  line-height: 24px;
}
.form__fields__outer {
  display: flex;
  flex-direction: column;
  /* 	justify-content: center; */
}
.form__fields {
  padding: 30px 0;
  display: flex;
  align-items: center;
  gap: 13px;
}
.form__hint {
  font-size: 16px;
  position: absolute;
  margin-top: 90px;
}
.drive__radio {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.drive__date__container p {
  display: flex;
  position: relative;
}
.drive__date {
  width: 242px;
  height: 50px;
  margin: 0;
  padding: 0 0 0 12px;
  box-sizing: border-box;
  font-size: 18px;
}
.drive__date__img {
  width: 50px;
  height: 50px;
  position: absolute;
  right: 0;
}
.drive__hour {
  width: 242px;
  height: 50px;
  font-size: 18px;
  padding: 0 12px;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url(../img/dropdown.svg);
  background-repeat: no-repeat;
  background-position-x: 100%;
  border: 1px solid gray;
  color: black;
  background-size: contain;
}
.drive__name {
  width: 242px;
  height: 50px;
  font-size: 18px;
  padding: 0 0 0 12px;
  box-sizing: border-box;
}
.drive__phone {
  width: 242px;
  height: 50px;
  font-size: 18px;
  padding: 0 0 0 12px;
  box-sizing: border-box;
}
.drive__mail {
  width: 400px;
  height: 50px;
  font-size: 18px;
  padding: 0 0 0 12px;
  box-sizing: border-box;
}
.line {
  width: 100%;
  height: 1px;
  background-color: black;
}
.drive__submit {
  margin-top: 88px;
  width: 300px;
  height: 60px;
  border-radius: 30px;
  background-color: #9a0000;
  border: none;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 20px;
  color: white;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  place-content: center;
  font-size: 20px;
}

.wpcf7-list-item {
  position: relative;
  display: inline-block;
  margin: 0;
  /* optional width if you want */
}

.wpcf7-list-item input[type="radio"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 10; /* above label */
}

/* Style label as before */
.wpcf7-list-item-label {
  padding-left: 30px;
  cursor: pointer;
  position: relative;
  user-select: none;
  display: inline-block;
  line-height: 21px;
  font-size: 18px;
}

/* square box */
.wpcf7-list-item-label::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 0;
  width: 20px;
  height: 20px;
  border: 1px solid #707070;
  background: white;
  box-sizing: border-box;
  transition: border-color 0.2s ease;
}

/* red check */
.wpcf7-list-item input[type="radio"]:checked + .wpcf7-list-item-label::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 3px;
  width: 6px;
  height: 12px;
  border: solid red;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* hover effect */
.wpcf7-list-item-label:hover::before {
  border-color: #999;
}

.wpcf7-not-valid-tip {
  display: block;
  margin-top: 10px;
  position: absolute;
  color: red;
  font-size: 16px;
}

.wpcf7-response-output {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  text-align: center;
  margin-top: 20px !important;
  color: red;
  font-family: "Zen Kaku Gothic New", sans-serif;
  line-height: 1.5em;
  font-size: 16px;
}
.drive__hour__container .wpcf7-not-valid-tip {
  margin-top: 31px;
  margin-left: -259px;
}
.wpcf7-spinner {
  display: none;
}

.drive__complete {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-size: 18px;
  line-height: 34px;
  margin-top: 135px;
  text-align: center;
}

@media screen and (max-width: 1024px) {
  .content {
    width: 100vw;
  }

  header {
    height: 9.77vw;
  }

  .header__logo {
    gap: 3.27vw;
    font-size: 3.13vw;
    margin-left: 4.3vw;
  }

  .header__logo__image {
    width: 13.52vw;
    height: 5.96vw;
  }

  .lineup {
    padding-bottom: 25.1vw;
    padding-top: 14.55vw;
  }

  .lineup__title {
    font-size: 4.88vw;
  }

  .lineup__car {
    width: 88.28vw;
    row-gap: 6.93vw;
    margin-top: 6.74vw;
  }

  .lineup__image {
    width: 42.09vw;
    height: 22.17vw;
  }

  .lineup__name {
    margin-top: 0.78vw;
    font-size: 1.76vw;
  }

  .videos {
    padding-top: 7.91vw;
    padding-bottom: 11.62vw;
  }

  .videos__en {
    font-size: 4.88vw;
  }

  .videos__jp {
    font-size: 1.95vw;
    margin-top: 1.86vw;
  }

  .video__content {
    margin-top: 7.81vw;
    width: 88.28vw;
    row-gap: 6.84vw;
  }

  .each__video {
    gap: 2.73vw;
  }

  .video__image,
  .video__overlay {
    width: 41.02vw;
    height: 27.34vw;
    border-radius: 1.95vw;
  }

  .video__desc1 {
    font-size: 1.76vw;
    line-height: 2.93vw;
    /* 		height: 5.86vw; */
  }

  .video__desc2 {
    font-size: 1.56vw;
    line-height: 2.93vw;
  }

  .close {
    font-size: 9.765625vw;
  }

  .about {
    padding-top: 18.359375vw;
    padding-bottom: 18.066406vw;
  }
  .mini__countryman {
    margin-top: 19.140625vw;
  }
  .mini__fivedoor {
    margin-top: 17.675781vw;
  }
  .mini__electric {
    margin-top: 17.675781vw;
  }
  .about__title {
    font-size: 4.394531vw;
    line-height: 6.347656vw;
  }
  .about__banner {
    margin-top: 4.882812vw;
  }
  .about__signature {
    font-size: 1.953125vw;
    line-height: 2.929688vw;
    margin-top: 4.394531vw;
  }
  .about__main {
    font-size: 3.125vw;
    line-height: 4.492188vw;
  }
  .about__main.cooper1 {
    margin-top: 6.542969vw;
  }
  .about__main.cooper2 {
    margin-top: 7.519531vw;
  }
  .about__main.cooper3 {
    margin-top: 7.519531vw;
  }

  .about__main.countryman1 {
    margin-top: 6.542969vw;
  }
  .about__main.countryman2 {
    margin-top: 5.46875vw;
  }
  .about__main.countryman3 {
    margin-top: 6.347656vw;
  }

  .about__main.fivedoor1 {
    margin-top: 9.472656vw;
  }

  .about__main.electric1 {
    margin-top: 6.542969vw;
  }

  .about__left {
    gap: 5.273438vw;
  }
  .about__right {
    gap: 5.273438vw;
  }
  .about__left.cooper1 {
    margin-top: 4.394531vw;
  }
  .about__right.cooper2 {
    margin-top: 4.589844vw;
  }
  .about__left.cooper3 {
    margin-top: 4.882812vw;
  }
  .about__right.cooper4 {
    margin-top: 4.882812vw;
  }

  .about__left.countryman1 {
    margin-top: 4.394531vw;
  }
  .about__right.countryman2 {
    margin-top: 4.882812vw;
  }
  .about__left.countryman3 {
    margin-top: 4.394531vw;
  }

  .about__left.fivedoor1 {
    margin-top: 4.394531vw;
  }

  .about__left.electric1 {
    margin-top: 4.394531vw;
  }

  .about__image {
    width: 34.179688vw;
    height: 26.367188vw;
  }
  .about__desc {
    font-size: 1.953125vw;
    line-height: 2.929688vw;
    width: 48.828125vw;
  }

  .recommend {
    width: 100%;
    padding-top: 7.910156vw;
    padding-bottom: 17.96875vw;
  }
  .recommend__content {
    width: 88.28125vw;
  }
  .recommend__en {
    font-size: 4.882812vw;
  }
  .recommend__jp {
    font-size: 1.953125vw;
    margin-top: 1.5625vw;
  }
  .recommed__title {
    font-size: 3.125vw;
    line-height: 4.492188vw;
    margin-top: 9.375vw;
  }
  .recommend__each {
    gap: 4.296875vw;
    margin-top: 4.882812vw;
  }
  .recommend__image {
    width: 27.734375vw;
    height: 27.734375vw;
  }
  .recommend__name {
    font-size: 1.953125vw;
    line-height: 2.929688vw;
    margin-top: 1.464844vw;
  }
  .recommend__desc {
    width: 56.25vw;
    font-size: 1.953125vw;
    line-height: 2.929688vw;
  }
  .recommend__banner {
    width: 88.28125vw;
    height: 40.917969vw;
    margin-top: 2.636719vw;
  }

  .showroom {
    padding-top: 13.8671875vw;
  }

  .showroom__content {
    width: 88.28vw;
  }

  .showroom__en {
    font-size: 4.88vw;
  }

  .showroom__jp {
    font-size: 1.95vw;
    margin-top: 1.56vw;
  }

  .showroom__address {
    margin-top: 6.45vw;
  }

  .address__title {
    font-size: 3.52vw;
  }

  .address__desc {
    font-size: 1.56vw;
    line-height: 2.93vw;
    margin-top: 2.44vw;
  }

  .showroom__address__image {
    width: 41.02vw;
    height: 27.34vw;
  }

  .showroom__map {
    margin-top: 5.27vw;
    width: 88.28vw;
    height: 33.2vw;
  }

  .showroom__images {
    margin-top: 6.84vw;
  }

  .showroom__image {
    width: 41.02vw;
    height: 27.34vw;
  }

  .faq {
    padding-top: 14.36vw;
    padding-bottom: 23.34vw;
  }

  .faq__content {
    width: 88.28vw;
  }

  .faq__en {
    font-size: 4.88vw;
  }

  .faq__jp {
    font-size: 1.95vw;
    margin-top: 1.56vw;
  }

  .faq__list {
    margin-top: 5.76vw;
    gap: 4.39vw;
  }

  .faq__each {
    width: 88.28vw;
  }

  .faq__q {
    font-size: 2.34vw;
    padding-bottom: 1.95vw;
    border-bottom: 1px solid black;
  }

  .faq__a {
    font-size: 1.56vw;
    margin-top: 1.95vw;
    line-height: 2.93vw;
  }

  footer {
    height: 7.62vw;
  }

  .footer__content {
    width: 88.28vw;
  }

  .footer__corp {
    font-size: 1.56vw;
  }

  .footer__link {
    font-size: 1.56vw;
    gap: 0.98vw;
  }

  .footer__link__img {
    width: 1.95vw;
    height: 1.95vw;
  }

  .test__drive {
    padding-top: 22.85vw;
    padding-bottom: 12.89vw;
  }

  .drive__en {
    font-size: 4.88vw;
  }

  .drive__jp {
    font-size: 1.95vw;
    margin-top: 1.86vw;
  }

  .forms {
    width: 83.01vw;
    gap: 0.98vw;
    margin-top: 9.77vw;
  }

  .form__container {
    gap: 3.91vw;
    width: 83.01vw;
  }

  .form__label {
    width: 17.38vw;
    min-height: 13.67vw;
    padding-left: 1.66vw;
  }

  .label__title {
    font-size: 1.95vw;
  }

  .label__required {
    font-size: 1.37vw;
    padding: 0.39vw 0.88vw;
    margin-top: 0.98vw;
  }

  .label__hint {
    font-size: 1.37vw;
    margin-top: 1.56vw;
    line-height: 2.34vw;
  }

  .form__fields {
    padding: 2.93vw 0;
    gap: 1.27vw;
  }

  .form__hint {
    font-size: 1.5625vw;
    margin-top: 8.7890625vw;
  }

  .drive__radio {
    gap: 1.76vw;
  }

  .drive__date,
  .drive__hour,
  .drive__name,
  .drive__phone {
    width: 23.63vw;
    height: 4.88vw;
    font-size: 1.76vw;
    padding-left: 1.17vw;
  }

  .drive__date__img {
    width: 4.88vw;
    height: 4.88vw;
  }

  .drive__hour {
    padding: 0 1.17vw;
  }

  .drive__mail {
    width: 39.06vw;
    height: 4.88vw;
    font-size: 1.76vw;
    padding-left: 1.17vw;
  }

  .line {
    height: 0.098vw;
  }

  .drive__submit {
    margin-top: 8.59vw;
    width: 29.3vw;
    height: 5.86vw;
    border-radius: 2.93vw;
    font-size: 1.953125vw;
  }

  .wpcf7-list-item-label {
    padding-left: 2.93vw;
    line-height: 2.05078125vw;
    font-size: 1.7578125vw;
  }

  .wpcf7-list-item-label::before {
    top: 0.2vw;
    width: 1.95vw;
    height: 1.95vw;
    border: 0.098vw solid #707070;
  }

  .wpcf7-list-item input[type="radio"]:checked + .wpcf7-list-item-label::after {
    left: 0.59vw;
    top: 0.29vw;
    width: 0.59vw;
    height: 1.17vw;
    border-width: 0 0.2vw 0.2vw 0;
  }

  .wpcf7-not-valid-tip {
    margin-top: 0.98vw;
    font-size: 1.5625vw;
  }

  .wpcf7-response-output {
    margin-top: 1.95vw !important;
    font-size: 1.5625vw;
  }
  .drive__hour__container .wpcf7-not-valid-tip {
    margin-top: 3.02734375vw;
    margin-left: -25.29296875vw;
  }

  .drive__complete {
    font-size: 1.76vw;
    line-height: 3.32vw;
    margin-top: 13.18vw;
  }
}

@media screen and (max-width: 640px) {
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
  header {
    height: 18.67vw;
  }
  .header__logo {
    gap: 0;
    font-size: 5.33vw;
    justify-content: space-between;
    width: 83.73vw;
    margin: 0 auto;
  }
  .header__logo__image {
    width: 19.37vw;
    height: 8.53vw;
  }

  .banner {
    height: fit-content;
    flex-direction: column;
    background-size: contain;
    justify-content: flex-start;
    background-image: url(../img/banner-sp.webp);
    background-color: white;
  }
  .banner__shadowleft {
    width: 46.4vw;
    height: 128.27vw;
    top: 18.67vw;
  }
  .banner__shadowbotton {
    height: 35.73vw;
    top: 110.93vw;
  }
  .banner__left {
    padding-top: 18.666667vw;
  }
  .banner__left__exc {
    font-size: 4vw;
    margin-left: 8vw;
  }
  .banner__left__noun {
    font-size: 10.666667vw;
    margin-left: 7.733333vw;
    line-height: 12.266667vw;
    margin-top: 4.533333vw;
    text-shadow: 0.8vw 0vw 0.8vw rgba(0, 0, 0, 0.16);
  }
  .banner__left__date {
    font-size: 5.866667vw;
    margin-left: 7.733333vw;
    line-height: 8.266667vw;
    margin-top: 0.8vw;
    text-shadow: 0.8vw 0vw 0.8vw rgba(0, 0, 0, 0.6);
  }
  .banner__left__newyear {
    font-size: 5.333333vw;
    line-height: 8vw;
    margin-left: 7.733333vw;
    margin-top: 6.133333vw;
    text-shadow: 0.8vw 0vw 0.8vw rgba(0, 0, 0, 0.6);
  }

  .banner__comp {
    width: 84.269333vw;
    height: 108.882667vw;
    margin-left: 7.466667vw;
    margin-top: 48.8vw;
    background-image: url(../img/comp-sp.webp);
  }
  .comp__date {
    font-size: 6.67vw;
    padding-top: 6.93vw;
    margin-left: 14.93vw;
  }
  .comp__date span {
    font-size: 4.27vw;
  }
  .comp__title {
    font-size: 8.266667vw;
    margin-top: 3.466667vw;
    margin-left: 6.4vw;
    line-height: 12vw;
  }
  .comp__desc {
    font-size: 3.466667vw;
    margin-top: 7.546667vw;
    margin-left: 6.4vw;
    line-height: 5.333333vw;
  }

  .comp__gift {
    font-size: 8vw;
    margin-top: 2.666667vw;
    margin-left: 6.4vw;
    line-height: 10.666667vw;
  }
  .comp__gift span {
    font-size: 5.6vw;
  }
  .banner__right {
    padding-top: 0;
    top: 72.5vw;
    position: absolute;
  }
  .banner__type {
    width: 15.91vw;
    height: 41.85vw;
    margin-right: auto;
    margin-left: 17.68vw;
  }
  .banner__reserve {
    width: 26.13vw;
    height: 26.13vw;
    gap: 1.33vw;
    bottom: 4vw;
    right: 3.73vw;
  }
  .reserve__prem1 {
    font-size: 2.13vw;
  }
  .reserve__prem2 {
    font-size: 4.53vw;
  }
  .reserve__prem3 {
    font-size: 3.2vw;
  }
  .reserve__arrow {
    width: 10.47vw;
    height: 1.3vw;
  }

  .lineup {
    padding-bottom: 20.266667vw;
    padding-top: 16vw;
  }
  .lineup__title {
    font-size: 8vw;
  }
  .lineup__car {
    width: fit-content;
    row-gap: 5.07vw;
    margin-top: 5.07vw;
    justify-content: center;
  }
  .lineup__image {
    width: 84vw;
    height: 41.07vw;
  }
  .lineup__name {
    margin-top: 2.67vw;
    font-size: 3.73vw;
  }
  .videos {
    padding-top: 21.07vw;
    padding-bottom: 18.4vw;
  }
  .videos__en {
    font-size: 8vw;
  }
  .videos__jp {
    font-size: 5.33vw;
    margin-top: 8vw;
  }
  .video__content {
    margin-top: 23.2vw;
    width: 83.73vw;
    row-gap: 13.33vw;
  }
  .each__video {
    gap: 8vw;
  }
  .video__image,
  .video__overlay {
    width: 84vw;
    height: 56vw;
    border-radius: 5.33vw;
  }
  .video__desc1 {
    font-size: 4.8vw;
    line-height: 8vw;
    /* 		height: 14.93vw; */
  }
  .video__desc2 {
    font-size: 4.27vw;
    line-height: 8vw;
  }
  .close {
    font-size: 18.67vw;
    right: 3%;
  }

  .about {
    padding-top: 26.933333vw;
    padding-bottom: 25.866667vw;
  }
  .mini__countryman,
  .mini__fivedoor,
  .mini__electric,
  .mini__fivedoor {
    margin-top: 25.066667vw;
  }

  .about__title {
    font-size: 8vw;
    line-height: 11.733333vw;
    text-align: center;
  }
  .about__banner {
    margin-top: 13.333333vw;
  }
  .about__signature {
    font-size: 5.333333vw;
    line-height: 8vw;
    margin-top: 12vw;
  }
  .about__main {
    font-size: 5.866667vw;
    line-height: 8vw;
  }
  .about__main.cooper1 {
    margin-top: 16.533333vw;
  }
  .about__main.cooper2 {
    margin-top: 23.466667vw;
  }
  .about__main.cooper3 {
    margin-top: 14.4vw;
  }

  .about__main.countryman1 {
    margin-top: 15.733333vw;
  }
  .about__main.countryman2 {
    margin-top: 14.4vw;
  }
  .about__main.countryman3 {
    margin-top: 14.4vw;
  }

  .about__main.fivedoor1 {
    margin-top: 15.733333vw;
  }

  .about__main.electric1 {
    margin-top: 15.733333vw;
  }

  .about__left,
  .about__right {
    flex-direction: column;
    gap: 7.466667vw;
  }
  .about__left.cooper1 {
    margin-top: 12.533333vw;
  }
  .about__right.cooper2 {
    margin-top: 16vw;
  }
  .about__left.cooper3 {
    margin-top: 5.333333vw;
  }
  .about__right.cooper4 {
    margin-top: 8.8vw;
  }

  .about__left.countryman1 {
    margin-top: 8.8vw;
  }
  .about__right.countryman2 {
    margin-top: 8vw;
  }
  .about__left.countryman3 {
    margin-top: 8vw;
  }

  .about__left.fivedoor1 {
    margin-top: 7.733333vw;
  }

  .about__left.electric1 {
    margin-top: 7.733333vw;
  }

  .about__image {
    width: 84vw;
    height: 64.8vw;
  }
  .about__desc {
    font-size: 5.333333vw;
    line-height: 8vw;
    width: 84vw;
  }

  .recommend {
    width: 100%;
    padding-top: 21.866667vw;
    padding-bottom: 20vw;
  }
  .recommend__content {
    width: 83.733333vw;
  }
  .recommend__en {
    font-size: 8vw;
  }
  .recommend__jp {
    font-size: 5.333333vw;
    margin-top: 8vw;
  }
  .recommed__title {
    font-size: 5.866667vw;
    line-height: 10.666667vw;
    margin-top: 23.466667vw;
    text-align: center;
  }
  .recommend__each {
    gap: 6.933333vw;
    margin-top: 8vw;
    flex-direction: column;
    align-items: center;
  }
  .recommend__image {
    width: 75.733333vw;
    height: 75.733333vw;
  }
  .recommend__name {
    font-size: 5.333333vw;
    line-height: 8vw;
    margin-top: 6.666667vw;
  }
  .recommend__desc {
    width: 83.733333vw;
    font-size: 5.333333vw;
    line-height: 8vw;
  }
  .recommend__banner {
    width: 83.733333vw;
    height: 38.933333vw;
    margin-top: 5.6vw;
  }

  .showroom {
    padding-top: 36vw;
  }
  .showroom__content {
    width: 83.73vw;
  }
  .showroom__en {
    font-size: 8vw;
  }
  .showroom__jp {
    font-size: 5.33vw;
    margin-top: 6.67vw;
  }
  .showroom__address {
    margin-top: 13.33vw;
    flex-direction: column-reverse;
    gap: 8.27vw;
  }
  .address__title {
    font-size: 9.6vw;
    text-align: center;
  }
  .address__desc {
    font-size: 4.27vw;
    line-height: 8vw;
    margin-top: 6.67vw;
    text-align: center;
  }
  .showroom__address__image {
    width: 83.73vw;
    height: 56vw;
  }
  .showroom__map {
    margin-top: 16vw;
    width: 83.73vw;
    height: 51.47vw;
  }
  .showroom__images {
    margin-top: 12.53vw;
  }
  .showroom__image {
    width: 38.93vw;
    height: 26.13vw;
  }
  .faq {
    padding-top: 27.73vw;
    padding-bottom: 12.27vw;
  }
  .faq__en {
    font-size: 8vw;
  }
  .faq__jp {
    font-size: 5.33vw;
    margin-top: 8vw;
  }
  .faq__list {
    margin-top: 13.6vw;
    gap: 18.67vw;
  }
  .faq__each {
    width: 83.73vw;
  }
  .faq__q {
    font-size: 5.33vw;
    padding-bottom: 5.33vw;
    border-bottom: 1px solid black;
  }
  .faq__a {
    font-size: 4.27vw;
    margin-top: 5.33vw;
    line-height: 8vw;
  }
  footer {
    height: 25.87vw;
  }
  .footer__content {
    width: 83.73vw;
    flex-direction: column-reverse;
    justify-content: center;
  }
  .footer__link {
    font-size: 4.27vw;
    gap: 2.67vw;
  }
  .footer__link__img {
    width: 5.33vw;
    height: 5.33vw;
  }
  .footer__corp {
    font-size: 4.27vw;
    margin-top: 2.67vw;
    text-align: center;
  }
  .test__drive {
    padding-top: 44vw;
    padding-bottom: 26.4vw;
  }
  .drive__en {
    font-size: 8vw;
  }
  .drive__jp {
    font-size: 5.33vw;
    margin-top: 6.67vw;
  }
  .forms {
    width: 83.73vw;
    gap: 9.07vw;
    margin-top: 14.4vw;
  }
  .form__container {
    gap: 8vw;
    width: 83.73vw;
    flex-direction: column;
  }
  .form__label {
    width: 83.73vw;
    min-height: 22.13vw;
    padding-left: 4.53vw;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    flex-wrap: wrap;
    align-content: center;
    row-gap: 2.13vw;
  }
  .label__title {
    font-size: 5.33vw;
  }
  .label__required {
    font-size: 3.73vw;
    padding: 1.6vw 2.4vw;
    margin-top: 0;
    margin-left: 4.27vw;
  }
  .form__fields {
    padding: 0;
    gap: 4.27vw;
    flex-direction: column;
    align-items: start;
  }
  .label__hint {
    font-size: 3.73vw;
    margin-top: 0;
    line-height: normal;
  }
  .drive__radio {
    gap: 5.33vw;
  }
  .wpcf7-list-item-label {
    padding-left: 8vw;
    line-height: 5.333333333333334vw;
    font-size: 4.266666666666667vw;
  }
  .wpcf7-list-item-label::before {
    top: 0;
    width: 5.33vw;
    height: 5.33vw;
    border: 1px solid #707070;
  }
  .wpcf7-list-item input[type="radio"]:checked + .wpcf7-list-item-label::after {
    left: 1.33vw;
    top: 0;
    width: 2.13vw;
    height: 3.47vw;
    border-width: 0 0.53vw 0.53vw 0;
  }
  .drive__date,
  .drive__hour,
  .drive__name,
  .drive__phone {
    width: 64.53vw;
    height: 13.33vw;
    font-size: 4.8vw;
    padding-left: 3.2vw;
  }
  .drive__date__img {
    width: 13.33vw;
    height: 13.33vw;
  }
  .form__hint {
    font-size: 4.27vw;
    margin-top: 10.67vw;
    position: relative;
    line-height: 8vw;
  }
  .drive__mail {
    width: 83.73vw;
    height: 13.33vw;
    font-size: 4.8vw;
    padding-left: 3.2vw;
  }
  .drive__submit {
    margin-top: 22.67vw;
    width: 80vw;
    height: 16vw;
    border-radius: 8vw;
    font-size: 5.33vw;
  }
  .wpcf7-not-valid-tip {
    margin-top: 5.33vw;
    position: relative;
    font-size: 3.733333333333334vw;
  }
  .wpcf7-response-output {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    width: 83.73vw;
    margin-top: 5.333333333333334vw !important;
    font-size: 3.733333333333334vw;
  }
  .drive__hour__container .wpcf7-not-valid-tip {
    margin-top: 10px;
    margin-left: 0;
    position: absolute;
  }
  .line {
    display: none;
  }
  .drive__complete {
    font-size: 4.8vw;
    line-height: 9.066666666666666vw;
    margin-top: 14.399999999999999vw;
    width: 83.73333333333333vw;
    text-align: left;
  }
}
/* sign */