@charset "UTF-8";
/* ============================================================= *

index

* ============================================================= */
body[data-id=index] *[data-intersection] {
  opacity: 0;
  transition: opacity .4s ease-out .2s, translate .4s ease-out .2s;

  translate: 0 30px;
}

body[data-id=index] *[data-intersection][data-intersecting=true] {
  opacity: 1;

  translate: 0 0px;
}

/* p-index-frame
============================== */
.p-index-frame {
  position: fixed;
  inset: 0;
  z-index: 999;
  width: 100%;
  height: 100%;
  color: #fff;
  font-weight: 400;
  font-size: calc(12px + var(--slope-1px) * 13);
  font-family: var(--en-font-family);
  pointer-events: none;

  --gap: calc(35px + var(--slope-1px) * 30);
}

.p-index-frame__belt {
  position: absolute;
  display: flex;
  align-items: center;
  overflow: hidden;
  height: var(--belt-height);
  pointer-events: auto;
}

.p-index-frame__belt._left {
  bottom: 100%;
  left: 0;
  width: calc(var(--vh) * 100);
  background: var(--key-color);
  transform: rotate(90deg);
  transform-origin: bottom left;
}

.p-index-frame__belt._right {
  right: 0;
  bottom: 100%;
  width: calc(var(--vh) * 100);
  background: var(--key-color);
  transform: rotate(-90deg);
  transform-origin: bottom right;
}

.p-index-frame__belt._bottom {
  bottom: 0;
  left: 0;
  width: 100%;
  background: var(--point-color);
}

.p-index-frame__scroll {
  display: flex;
  align-items: center;
  transform: translateX(calc(1px * var(--frameScrollValue) - 100% / 3));
}

.p-index-frame__scroll ._bg {
  display: grid;
  align-items: center;
  grid-template-columns: 6em auto 6em auto;
  grid-template-areas: "before welcome after cars";
  gap: var(--gap);
  padding-inline: calc(var(--gap) * .5);
}

.p-index-frame__scroll ._bg > span:nth-child(1) {
  grid-area: welcome;
}

.p-index-frame__scroll ._bg > span:nth-child(2) {
  grid-area: cars;
}

.p-index-frame__scroll ._bg:before {
  grid-area: before;
}

.p-index-frame__scroll ._bg:after {
  grid-area: after;
}

.p-index-frame__scroll ._bg:before, .p-index-frame__scroll ._bg:after {
  content: "";
  display: block;
  height: 100%;
  background: url(../img/frame-icon.svg) 50% 50%/contain no-repeat;
}

/* p-index-hero
============================== */
.p-index-hero {
  position: relative;
  left: 50%;
  width: var(--hero-width);
  height: var(--hero-height);
  min-height: 570px;
  max-height: calc(var(--inner-width-px) * .75);
  margin-bottom: var(--belt-height);
  padding-inline: 60px 95px;
  transform: translateX(-50%);

  --hero-width: calc(100 * var(--vw) - var(--belt-height) * 2);
  --hero-height: calc(100 * var(--vh) - var(--belt-height) - var(--header-height));
}

@media screen and (max-width: 1300px) {
  .p-index-hero {
    padding-inline: 3%;
  }
}

@media screen and (max-width: 767px) {
  .p-index-hero {
    height: auto;
    min-height: var(--hero-height);
    max-height: none;
    padding-block: 13.63636% 20%;
  }
}

.p-index-hero:before {
  content: "";
  position: absolute;
  top: 50%;
  right: 50%;
  z-index: -1;
  display: block;
  width: calc(100% + var(--hero-height) / tan(8deg));
  height: calc(100% + var(--hero-width) * tan(8deg));
  transition: opacity .3s linear;
  transform: translate3d(50%, -50%, 0px) rotate(8deg);
  transform-origin: top center;
}

body.is-index-mv-slide-moving .p-index-hero:before {
  opacity: 0;
}

body[data-mv-bg-pattern="0"] .p-index-hero:before {
  background-image: radial-gradient(var(--bg-color) 30%, transparent 30%);
  background-size: 18px 18px;
  animation: moveDotsUp .8s linear infinite;
}

body[data-mv-bg-pattern="1"] .p-index-hero:before {
  background-image: linear-gradient(to bottom, transparent calc(100% - 2px), var(--bg-color) calc(100% - 2px), var(--bg-color) 100%), linear-gradient(to right, transparent calc(100% - 2px), var(--bg-color) calc(100% - 2px), var(--bg-color) 100%);
  background-size: 30px 30px;
  animation: moveSquareUp .8s linear infinite;
}

body[data-mv-bg-pattern="2"] .p-index-hero:before {
  background-image: url(../img/pattern-wave.png);
  background-size: 60px 17px;
  animation: moveWaveUp 1s linear infinite;
}

@keyframes moveDotsUp {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 -18px;
  }
}

@keyframes moveSquareUp {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 -30px;
  }
}

@keyframes moveWaveUp {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 -17px;
  }
}

.p-index-hero:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 0;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  background: var(--key-color);
  mask: url(../img/bg-index-hero.svg) 50% 50%/contain repeat;
  pointer-events: none;
}

@media screen and (max-width: 767px) {
  .p-index-hero:after {
    mask: url(../img/bg-index-hero-sp.svg) 50% 0/contain no-repeat;
  }
}

.p-index-hero__inner {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr min(450px, 50%);
  gap: 0 min(3%, 60px);
  width: 100%;
  height: 100%;
  max-width: var(--inner-width-px);
  margin-inline: auto;
}

@media screen and (max-width: 767px) {
  .p-index-hero__inner {
    grid-template-columns: 100%;
    justify-items: center;
  }
}

.p-index-hero__inner:after {
  content: "";
  content: attr(data-cars);
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  color: color-mix(in srgb, var(--point-color) 30%, transparent);
  font-size: calc(60px + var(--slope-1px) * 60);
  font-family: var(--point-en-font-family);
  line-height: .85;
  pointer-events: none;
}

.p-index-hero__title {
  position: relative;
  z-index: 1;
  margin-bottom: 1em;
  color: #fff;
  text-shadow: 3.5px 3.5px 0px #000;
  font-weight: 900;
  font-size: calc(27px + var(--slope-1px) * 21);
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .p-index-hero__title {
    font-size: calc(24px + var(--slope-1px) * 24);
  }
}

.p-index-hero__title span {
  position: relative;
  display: block;
  width: fit-content;
  max-width: 100%;
}

.p-index-hero__title span:after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: -1;

  -webkit-text-stroke: 3px var(--base-color);
}

.p-index-hero__slider {
  position: relative;
  z-index: 1;
}

@media screen and (max-width: 767px) {
  .p-index-hero__slider {
    justify-self: stretch;
  }
}

/* p-index-slider
============================== */
.p-index-slider {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 90.22222%;
  margin-inline: auto;
}

@media screen and (max-width: 767px) {
  .p-index-slider {
    width: 74.24242%;
  }
}

.p-index-slider .c-slider {
  position: relative;
  overflow: visible;
  perspective: 1000px;
}

.p-index-slider .c-slider:before {
  content: "Pickup";
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  display: block;
  padding: .5em;
  border-radius: 5px;
  background: var(--point-color);
  color: #fff;
  font-weight: 400;
  font-size: calc(12px + var(--slope-1px) * 8);
  font-family: var(--en-font-family);
  line-height: 1;
  transform: translateY(-40%) rotate(3deg);
  pointer-events: none;
}

.p-index-slider .c-slider .slick-list {
  overflow: visible;
}

.p-index-slider .c-slider__item {
  position: relative;
  transition: transform .3s ease-in-out, opacity .6s ease-in-out !important;
  transform: rotateY(90deg);
}

.p-index-slider .c-slider__item.slick-current {
  transition: transform .3s ease-in-out .3s, opacity .6s ease-in-out !important;
  transform: rotateY(0deg);
}

.p-index-slider .c-slider__item.is-changing img {
  transform: rotateY(90deg);
}

.p-index-slider .c-slider__item img {
  transform: rotate(calc(var(--deg) * 1deg));
  transform-origin: center center;
}

.p-index-slider-control {
  position: absolute;
  right: calc(100% + 20px);
  bottom: 20px;
  justify-content: flex-end;
}

@media screen and (max-width: 767px) {
  .p-index-slider-control {
    position: static;
    justify-content: center;
    width: 100%;
    margin-top: 8%;
  }
}

/* p-index-information
============================== */
.p-index-information {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 100%;
  gap: calc(10px + var(--slope-1px) * 6);
}

/* p-index-information-nav
============================== */
.p-index-information-nav {
  display: grid;
  align-items: center;
  grid-template-columns: auto 1fr auto;
  gap: 7px 15px;
  padding: calc(15px + var(--slope-1px) * 5);
  border-radius: 20px 20px 0px 20px;
  background: var(--bg-color);
  text-decoration: none;
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1.5;
  transition: all .3s ease-out;
}

@media screen and (max-width: 767px) {
  .p-index-information-nav {
    grid-template-columns: 100%;
  }
}

.p-index-information-nav._important {
  background: var(--key-color);
  color: #fff;
}

.p-index-information-nav:hover {
  filter: brightness(.85);
}

.p-index-information-nav__date {
  display: grid;
  align-items: center;
  align-self: stretch;
  grid-template-columns: auto 1fr;
  gap: calc(8px + var(--slope-1px) * 7);
  text-align: left;
}

@media screen and (min-width: 768px) {
  .p-index-information-nav__date {
    padding-right: 15px;
    border-right: 1px solid;
  }
}

.p-index-information-nav__date:before {
  content: "";
  width: calc(19px + var(--slope-1px) * 6);
  height: calc(19px + var(--slope-1px) * 6);
  background: currentColor;
  mask: var(--icon-info) right center/contain no-repeat;
}

.p-index-information-nav__more {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: 5px;
  font-size: 16px;
  font-family: var(--en-font-family);
}

@media screen and (max-width: 767px) {
  .p-index-information-nav__more {
    display: none;
  }
}

.p-index-information-nav__more:after {
  content: "";
  width: 10px;
  height: 10px;
  background: currentColor;
  mask: var(--icon-angle) right center/contain no-repeat;
}

/* Mut-holidays
============================== */
.Mut-holidays[data-hansha-cd] {
  position: relative;
  z-index: 1;
  z-index: 1;
  margin-bottom: calc(30px + var(--slope-1px) * 15);
  padding-inline: 0;
  border-radius: 20px;
  background: #fff;
}

.Mut-holidays[data-hansha-cd] .Mut-holidays__body {
  font-size: 1.8rem;
}

.Mut-holidays[data-hansha-cd] .Mut-holidays__button {
  width: auto;
  border-color: #000;
}

/* p-index-section
============================== */
.p-index-section {
  position: relative;
  margin-top: calc(50px + var(--slope-1px) * 50);
}

.p-index-section:before {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--key-color);
  mask: url(../img/bg-index.svg) center top/100% auto repeat-y;
}

@media screen and (max-width: 767px) {
  .p-index-section:before {
    mask-image: url(../img/bg-index-sp.svg);
  }
}

/* p-index-nav-list
============================== */
.p-index-nav-list {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(8px + var(--slope-1px) * 7);
}

/* p-index-showroom-category
============================== */
.p-index-showroom-category {
  position: relative;
}

.p-index-showroom-category:before {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--key-color);
  mask: url(../img/bg-index.svg) center top/100% auto repeat-y;
}

@media screen and (max-width: 767px) {
  .p-index-showroom-category:before {
    mask-image: url(../img/bg-index-sp.svg);
  }
}

.p-index-showroom-category .p-index-section:before {
  content: none;
}

/* p-index-showroom-container
============================== */
.p-index-showroom-container {
  position: relative;
  padding-bottom: 157px;
}

@media screen and (max-width: 767px) {
  .p-index-showroom-container {
    padding-bottom: 66px;
  }
}

.p-index-showroom-container:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: -1;
  display: block;
  width: calc(var(--vw) * 100 - var(--belt-height) * 2);
  height: 230px;
  border-top-left-radius: 115px;
  background: var(--bg-color);
  transform: translateX(-50%);
}

@media screen and (max-width: 767px) {
  .p-index-showroom-container:after {
    height: 160px;
    border-top-left-radius: 80px;
  }
}

/* p-index-showroom
============================== */
.p-index-showroom {
  display: grid;
  grid-template-columns: 1fr min(550px, 55%);
  gap: 32px;
  margin-top: calc(18px + var(--slope-1px) * 18);
}

@media screen and (max-width: 767px) {
  .p-index-showroom {
    grid-template-columns: 100%;
  }
}

/* p-index-showroom-slider
============================== */
.p-index-showroom-slider {
  overflow: visible;
}

.p-index-showroom-slider .slick-list {
  overflow: visible;
}

.p-index-showroom-slider-control {
  justify-content: flex-end;
  margin-top: 46px;
}

@media screen and (max-width: 767px) {
  .p-index-showroom-slider-control {
    justify-content: center;
    margin-top: 0;
  }
}

/* p-index-showroom-nav
============================== */
.p-index-showroom-nav {
  position: relative;
  display: block;
  text-decoration: none;
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1.6;
}

@media screen and (max-width: 767px) {
  .p-index-showroom-nav {
    margin-bottom: calc((var(--vw) * 100 - var(--belt-height) * 2) / 260 * 140 * .93 * .92);
    margin-left: 10px;
  }
}

.p-index-showroom-nav:before {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 40px 40px 0px 40px;
  background: var(--point-color);
  opacity: .5;
  transition: all .2s ease-out;

  rotate: 3deg;
}

.p-index-showroom-nav:hover:before {
  rotate: 0deg;
}

.p-index-showroom-nav__contents {
  position: relative;
  z-index: 2;
  padding: calc(22px + var(--slope-1px) * 17) calc(22px + var(--slope-1px) * 20) calc(27px + var(--slope-1px) * 15);
  border: 3px solid var(--key-color);
  border-radius: 40px 40px 0px 40px;
  background-color: #fff;
  background-image: linear-gradient(90deg, #efefef 1px, transparent 1px), linear-gradient(#efefef 1px, transparent 1px);
  background-position: center center;
  background-size: 16px 16px;
}

.p-index-showroom-nav__head {
  display: flex;
  align-items: center;
  gap: calc(6px + var(--slope-1px) * 5);
  width: fit-content;
  margin-bottom: calc(20px + var(--slope-1px) * 6);
  padding: calc(12px + var(--slope-1px) * 3) calc(17px + var(--slope-1px) * 3) calc(12px + var(--slope-1px) * 3) calc(14px + var(--slope-1px) * 3);
  border-radius: 50px;
  background: var(--point-color);
  color: #fff;
  font-weight: 700;
  font-size: calc(18px + var(--slope-1px) * 6);
  line-height: 1;
}

.p-index-showroom-nav__head:before {
  content: "";
  flex-shrink: 0;
  width: calc(8px + var(--slope-1px) * 4);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: currentColor;
}

.p-index-showroom-nav__body {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(18px + var(--slope-1px) * 2);
}

.p-index-showroom-nav__body > p {
  margin-block: var(--leading-trim);
}

.p-index-showroom-nav__image {
  position: absolute;
  top: 40%;
  left: -85%;
  z-index: 0;
  overflow: hidden;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 550 / 300;
  border: 3px solid var(--key-color);
  border-radius: 40px;
  transition: all .2s ease-out;

  rotate: -5deg;
}

@media screen and (max-width: 767px) {
  .p-index-showroom-nav__image {
    top: 93%;
    left: -10px;
    z-index: -1;
    width: 92%;
    aspect-ratio: 260 / 140;
    border-radius: 20px;
  }
}

.p-index-showroom-nav:hover .p-index-showroom-nav__image {
  rotate: -4deg;
}

.p-index-showroom-nav__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* p-index-blog-container
============================== */
.p-index-blog-container {
  position: relative;
  margin-top: 0;
  padding-block: calc(35px + var(--slope-1px) * 30) calc(50px + var(--slope-1px) * 50);
}

.p-index-blog-container:after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  z-index: -1;
  display: block;
  width: calc(var(--vw) * 100 - var(--belt-height) * 2);
  height: 100%;
  border-bottom-right-radius: calc(var(--vw) * 30 - var(--belt-height) * 2);
  background: var(--bg-color);
  transform: translateX(-50%);
}

@media screen and (max-width: 767px) {
  .p-index-blog-container:after {
    border-bottom-right-radius: calc(var(--vw) * 50 - var(--belt-height) * 2);
  }
}

/* p-index-blog
============================== */
.p-index-blog {
  position: relative;
}

@media screen and (max-width: 767px) {
  .p-index-blog {
    margin-top: calc(22px + var(--slope-1px) * 10);
  }
}

.p-index-blog__foot {
  position: absolute;
  right: 0;
  bottom: 0;
}

@media screen and (max-width: 767px) {
  .p-index-blog__foot {
    position: static;
    display: flex;
    justify-content: center;
    margin-top: calc(25px + var(--slope-1px) * 5);
  }
}

/* p-index-blog-slider
============================== */
.p-index-blog-slider {
  width: 1030px;
  max-width: 100%;
  margin-inline: auto;
}

.p-index-blog-slider__body {
  overflow: visible;
}

@media screen and (min-width: 768px) {
  .p-index-blog-slider__body {
    display: grid;
    grid-template-columns: repeat(3, calc((100% - var(--gap) * 2) / 3));
    gap: var(--gap);

    --gap: calc(28px + var(--slope-1px) * 28);
  }
}

.p-index-blog-slider__body .slick-list {
  overflow: visible;
}

@media screen and (min-width: 768px) {
  .p-index-blog-slider__item:nth-child(1) {
    margin-top: 100px;
  }
  .p-index-blog-slider__item:nth-child(2) {
    margin-top: 50px;
  }
}

.p-index-blog-slider-control {
  justify-content: center;
  margin-top: calc(20px + var(--slope-1px) * 10);
}

@media screen and (min-width: 768px) {
  .p-index-blog-slider-control {
    display: none;
  }
}

/* p-index-blog-nav
============================== */
.p-index-blog-nav {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  padding-left: calc(20px + var(--slope-1px) * 2);
  text-decoration: none;
  transition: all .3s ease-out;
}

@media screen and (max-width: 767px) {
  .p-index-blog-nav {
    width: 80%;
    margin-inline: auto;
  }
}

.p-index-blog-nav._new:before {
  content: "New";
  position: absolute;
  top: calc(-5px + var(--slope-1px) * -6);
  right: calc(5px + var(--slope-1px) * 15);
  z-index: 3;
  padding: 6px calc(6px + var(--slope-1px) * 2);
  border-radius: 5px;
  background: var(--point-color);
  color: #fff;
  font-size: calc(12px + var(--slope-1px) * 2);
  font-family: var(--en-font-family);
  line-height: 1;

  rotate: 5deg;
}

.p-index-blog-nav__image {
  position: relative;
  width: 100%;
  aspect-ratio: 282 / 300;
  margin-bottom: 30px;
}

.p-index-blog-nav__image img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 3px solid var(--key-color);
  border-radius: 40px 40px 0 40px;
}

.p-index-blog-nav__image:before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 40px 40px 0 40px;
  background: var(--key-color);
  opacity: .5;
  transition: all .2s ease-out;

  rotate: 3deg;
}

.p-index-blog-nav:hover .p-index-blog-nav__image:before {
  rotate: 0deg;
}

.p-index-blog-nav__head {
  position: absolute;
  bottom: 100%;
  left: 0;
  display: inline-grid;
  grid-template-columns: auto 1fr;
  gap: 1em;
  padding-top: 11px;
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1;
  transform: rotate(90deg);
  transform-origin: bottom left;
}

.p-index-blog-nav__title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
  font-size: calc(16px + var(--slope-1px) * 2);
  line-height: 1;
}

.p-index-blog-nav__text {
  display: -webkit-box;
  align-self: stretch;
  overflow: hidden;
  margin-top: 15px;
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1.5;

  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
          line-clamp: 2;
}

/* p-index-maintenance
============================== */
.p-index-maintenance {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: calc(25px + var(--slope-1px) * 10) 56px;
}

@media screen and (max-width: 767px) {
  .p-index-maintenance {
    grid-template-columns: 100%;
  }
}

.p-index-maintenance__nav {
  padding-top: calc(25px + var(--slope-1px) * 11);
}

.p-index-maintenance__text {
  width: fit-content;
  max-width: 100%;
  margin-block: var(--leading-trim) calc(var(--leading-trim) + 25px);
  margin-inline: auto;
}

@media screen and (min-width: 768px) {
  .p-index-maintenance__text {
    word-break: keep-all;
    overflow-wrap: anywhere;
  }
}

/* p-index-maintenance-reservation
============================== */
.p-index-maintenance-reservation {
  position: relative;
  display: block;
  text-decoration: none;
}

@media screen and (max-width: 767px) {
  .p-index-maintenance-reservation {
    width: calc(100% - 10px);
    margin-inline: auto;
  }
}

.p-index-maintenance-reservation:before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 40px 40px 0 40px;
  background: var(--point-color);
  opacity: .5;
  transition: all .2s ease-out;

  rotate: -2deg;
}

.p-index-maintenance-reservation:hover:before {
  rotate: 0deg;
}

.p-index-maintenance-reservation__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: min(300px, 40%) 1fr;
  gap: calc(15px + var(--slope-1px) * 10) 35px;
  overflow: hidden;
  padding: 30px 44px;
  border: 3px solid var(--key-color);
  border-radius: 40px 40px 0px 40px;
  background: #fff;
}

@media screen and (max-width: 1000px) {
  .p-index-maintenance-reservation__inner {
    grid-template-columns: 100%;
    padding: calc(20px + var(--slope-1px) * 10) calc(20px + var(--slope-1px) * 10) calc(25px + var(--slope-1px) * 5);
  }
}

.p-index-maintenance-reservation__inner:before {
  content: "";
  position: absolute;
  top: 50%;
  right: 50%;
  z-index: 0;
  display: block;
  width: 150%;
  height: 150%;
  background-image: radial-gradient(#f3f3f3 30%, transparent 30%);
  background-size: 18px 18px;
  transform: translate3d(50%, -50%, 0px) rotate(8deg);
  transform-origin: center center;
}

.p-index-maintenance-reservation__inner > * {
  position: relative;
  z-index: 1;
}

.p-index-maintenance-reservation__image {
  overflow: hidden;
  border-radius: 20px 20px 0px 20px;
}

.p-index-maintenance-reservation__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-index-maintenance-reservation__contents {
  display: grid;
  align-self: center;
  grid-template-columns: 100%;
  gap: calc(15px + var(--slope-1px) * 11);
}

.p-index-maintenance-reservation__text {
  margin-block: var(--leading-trim);
  word-break: keep-all;
  overflow-wrap: anywhere;
  font-size: calc(14px + var(--slope-1px) * 4);
}

.p-index-maintenance-reservation__nav {
  display: flex;
  align-items: center;
  gap: calc(2px + var(--slope-1px) * 3);
  width: fit-content;
  margin-block: var(--leading-trim);
  color: var(--key-color);
  text-decoration: underline;
  font-weight: 700;
  font-size: calc(16px + var(--slope-1px) * 8);
  transition: all .2s ease-out;
}

@media screen and (max-width: 767px) {
  .p-index-maintenance-reservation__nav {
    margin-inline: auto;
  }
}

.p-index-maintenance-reservation__nav:after {
  content: "";
  display: block;
  width: calc(11px + var(--slope-1px) * 4);
  height: calc(11px + var(--slope-1px) * 4);
  background: currentColor;
  mask: var(--icon-angle) 50% 50%/contain no-repeat;
}

.p-index-maintenance-reservation:hover .p-index-maintenance-reservation__nav {
  text-underline-offset: .15em;
}

/* p-index-usedcar
============================== */
.p-index-usedcar {
  position: relative;
  display: grid;
  grid-template-columns: 100%;
  gap: 25px 0;
  margin-top: calc(68px + var(--slope-1px) * 7);
  padding-top: calc(50px + var(--slope-1px) * 50);
  padding-bottom: calc(35px + var(--slope-1px) * 30);
}

.p-index-usedcar:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  z-index: -1;
  display: block;
  width: calc(var(--vw) * 100 - var(--belt-height) * 2);
  height: 100%;
  border-top-left-radius: calc(var(--vw) * 30 - var(--belt-height) * 2);
  background: var(--bg-color);
  transform: translateX(-50%);
}

@media screen and (max-width: 767px) {
  .p-index-usedcar:before {
    border-top-left-radius: calc(var(--vw) * 50 - var(--belt-height) * 2);
  }
}

.p-index-usedcar:after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--key-color);
  mask: url(../img/bg-index.svg) center top/100% auto repeat-y;
}

@media screen and (max-width: 767px) {
  .p-index-usedcar:after {
    mask-image: url(../img/bg-index-sp.svg);
  }
}

@media screen and (min-width: 768px) {
  .p-index-usedcar__count {
    position: absolute;
    top: 0;
    right: 0;
    width: 380px;
  }
}

.p-index-usedcar__foot {
  display: flex;
  justify-content: center;
}

@media screen and (min-width: 768px) {
  .p-index-usedcar__foot {
    justify-content: flex-end;
    margin-top: -35px;
  }
}

/* p-index-usedcar-count
============================== */
.p-index-usedcar-count {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: calc(15px + var(--slope-1px) * 5);
  width: 100%;
  padding-block: calc(22px + var(--slope-1px) * 8);
  border-radius: 20px;
  background: rgba(255, 255, 255, .8);
  text-align: left;
}

@media screen and (min-width: 768px) {
  .p-index-usedcar-count {
    border-radius: 0 0 20px 20px;
  }
}

.p-index-usedcar-count__text {
  margin-block: var(--leading-trim);
  font-size: calc(14px + var(--slope-1px) * 4);
  line-height: 1.6;
}

.p-index-usedcar-count__contents {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--point-color);
}

.p-index-usedcar-count__head {
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-size: calc(14px + var(--slope-1px) * 4);
  line-height: 1.3;
}

.p-index-usedcar-count__body {
  margin-block: var(--leading-trim);
  font-size: calc(18px + var(--slope-1px) * 4);
}

.p-index-usedcar-count__body em {
  display: inline-block;
  font-weight: 400;
  font-size: calc(55px + var(--slope-1px) * 0);
  font-family: var(--en-font-family);
  line-height: .9;
}

/* p-index-usedcar-slider
============================== */
.p-index-usedcar-slider {
  position: relative;
  left: 50%;
  overflow: hidden;
  width: calc(var(--slide-width) * 3);
  margin-top: -10px;
  padding-top: 10px;
  transform: translateX(-50%);

  --slide-width: calc(var(--vw) * 100 / 1366 * 420);
}

@media screen and (max-width: 1200px) {
  .p-index-usedcar-slider {
    --slide-width: 420px;
  }
}

@media screen and (max-width: 767px) {
  .p-index-usedcar-slider {
    --slide-width: calc(265px + var(--slope-1px) * 155);
  }
}

.p-index-usedcar-slider__body {
  overflow: visible;
}

.p-index-usedcar-slider__body .slick-list {
  overflow: visible;
}

.p-index-usedcar-slider__item {
  padding-inline: calc(var(--slide-width) / 420 * 20);
  opacity: 0;
  transition: all .6s ease;
  transform: rotate(-14deg) translateY(calc(tan(14deg) * var(--slide-width)));
  transform-origin: center bottom;
}

.p-index-usedcar-slider__item.slick-active {
  opacity: 1;
}

.p-index-usedcar-slider__item.slick-current.slick-active {
  transform: rotate(-7deg) translateY(calc(tan(7deg) * .5 * var(--slide-width)));
}

.p-index-usedcar-slider__item.slick-current.slick-active ~ * {
  transform: none;
}

.p-index-usedcar-slider__item.slick-current.slick-active + * + * {
  transform: rotate(7deg) translateY(calc(tan(7deg) * .5 * var(--slide-width)));
}

.p-index-usedcar-slider__item.slick-current.slick-active + * + * + * {
  transform: rotate(14deg) translateY(calc(tan(14deg) * var(--slide-width)));
}

.p-index-usedcar-slider__item.first-to-last[data-slick-index="-2"] {
  opacity: 0;
  transform: rotate(-14deg) translateY(calc(tan(14deg) * var(--slide-width)));
}

.p-index-usedcar-slider__item.first-to-last[data-slick-index="-1"] {
  opacity: 1;
  transform: rotate(-7deg) translateY(calc(tan(7deg) * .5 * var(--slide-width)));
}

.p-index-usedcar-slider__item.first-to-last[data-slick-index="0"] {
  opacity: 1;
  transform: none;
}

.p-index-usedcar-slider__item.first-to-last[data-slick-index="1"] {
  opacity: 1;
  transform: rotate(7deg) translateY(calc(tan(7deg) * .5 * var(--slide-width)));
}

.p-index-usedcar-slider__item.first-to-last[data-slick-index="2"] {
  opacity: 0;
  transform: rotate(14deg) translateY(calc(tan(14deg) * var(--slide-width)));
}

.p-index-usedcar-slider__item.last-to-first[data-slick-index="4"] {
  opacity: 0;
  transform: rotate(-14deg) translateY(calc(tan(14deg) * var(--slide-width)));
}

.p-index-usedcar-slider__item.last-to-first[data-slick-index="5"] {
  opacity: 1;
  transform: rotate(-7deg) translateY(calc(tan(7deg) * .5 * var(--slide-width)));
}

.p-index-usedcar-slider__item.last-to-first[data-slick-index="6"] {
  opacity: 1;
  transform: none;
}

.p-index-usedcar-slider__item.last-to-first[data-slick-index="7"] {
  opacity: 1;
  transform: rotate(7deg) translateY(calc(tan(7deg) * .5 * var(--slide-width)));
}

.p-index-usedcar-slider__item.last-to-first[data-slick-index="8"] {
  opacity: 0;
  transform: rotate(14deg) translateY(calc(tan(14deg) * var(--slide-width)));
}

.p-index-usedcar-slider-control {
  justify-content: center;
  margin-top: calc(20px + var(--slope-1px) * 24);
}

/* p-index-usedcar-nav
============================== */
.p-index-usedcar-nav {
  position: relative;
  display: block;
  width: 100%;
  text-decoration: none;
}

.p-index-usedcar-nav:before {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 40px 40px 0px 40px;
  background: var(--point-color);
  opacity: .5;
  transition: all .2s ease-out;

  rotate: 3deg;
}

.p-index-usedcar-nav:hover:before {
  rotate: 0deg;
}

.p-index-usedcar-nav__inner {
  position: relative;
  z-index: 1;
  overflow: hidden;
  width: 100%;
  border: 3px solid var(--key-color);
  border-radius: 40px 40px 0px 40px;
  background: #fff;
}

.p-index-usedcar-nav__image {
  width: 100%;
  aspect-ratio: 380 / 260;
}

.p-index-usedcar-nav__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-index-usedcar-nav__contents {
  display: grid;
  grid-template-columns: 100%;
  gap: 10px;
  padding: 18px 17px calc(20px + var(--slope-1px) * 6);
}

.p-index-usedcar-nav__name {
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-size: calc(14px + var(--slope-1px) * 4);
  line-height: 1.1;
}

.p-index-usedcar-nav__data {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: calc(12px + var(--slope-1px) * 3);
  line-height: 1;
}

.p-index-usedcar-nav__data dl {
  display: grid;
  align-items: center;
  grid-template-columns: auto 1fr;
  gap: 5px;
}

.p-index-usedcar-nav__data dt {
  padding: 6px;
  border-radius: 8px 8px 0px 8px;
  background: var(--bg-color);
}

.p-index-usedcar-nav__price {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(10px + var(--slope-1px) * 4);
}

.p-index-usedcar-nav__price dl {
  display: grid;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid;
  font-weight: 700;
  font-size: calc(12px + var(--slope-1px) * 2);
}

.p-index-usedcar-nav__price dl:last-child {
  color: #cf2424;
}

.p-index-usedcar-nav__price dt {
  margin-block: var(--leading-trim);
}

.p-index-usedcar-nav__price dd {
  margin-block: var(--leading-trim);
}

.p-index-usedcar-nav__price dd em {
  font-size: calc(20px + var(--slope-1px) * 4);
  line-height: 1.1;
}

/* p-index-recruit
============================== */
.p-index-recruit {
  position: relative;
  padding-block: calc(60px + var(--slope-1px) * 46) calc(44px + var(--slope-1px) * 37);
}

.p-index-recruit:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: calc(var(--vw) * 100 - var(--belt-height) * 2);
  height: 100%;
  background-image: radial-gradient(#f3f3f3 30%, transparent 30%);
  background-size: 18px 18px;
  transform: translateX(-50%);
  clip-path: polygon(0 0, 100% 0, 0 100%);
}

.p-index-recruit-nav {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 350px;
  text-decoration: none;

  --radius: 80px;
}

@media screen and (max-width: 767px) {
  .p-index-recruit-nav {
    width: 96.55172%;
    height: auto;
    margin-inline: auto;

    --radius: 40px;
  }
}

.p-index-recruit-nav:before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--radius) var(--radius) 0px var(--radius);
  background: var(--key-color);
  opacity: .5;
  transition: all .2s ease-out;

  rotate: -2deg;
}

@media screen and (max-width: 767px) {
  .p-index-recruit-nav:before {
    rotate: -3deg;
  }
}

.p-index-recruit-nav:hover:before {
  rotate: 0deg;
}

.p-index-recruit-nav__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 54px;
  min-height: 100%;
  padding: var(--padding);
  border: 3px solid var(--point-color);
  border-radius: var(--radius) var(--radius) 0px var(--radius);
  background: url(../img/frame-icon.svg) right var(--padding) bottom calc(var(--padding) - 7px) / calc(70px + var(--slope-1px) * 80) auto no-repeat, url(../img/pattern-wave.png) 50% 50%/60px 17px repeat;
  background-color: #fff;

  --padding: calc(17px + var(--slope-1px) * 20);
}

@media screen and (max-width: 767px) {
  .p-index-recruit-nav__inner {
    gap: calc(25px + var(--slope-1px) * 10);
  }
}

.p-index-recruit-nav__inner:before, .p-index-recruit-nav__inner:after {
  content: "";
  position: absolute;
  display: block;
  border-radius: 20px 20px 0px 20px;
}

@media screen and (max-width: 767px) {
  .p-index-recruit-nav__inner:before, .p-index-recruit-nav__inner:after {
    position: static;
  }
}

.p-index-recruit-nav__inner:before {
  top: var(--padding);
  right: var(--padding);
  width: min(320px, 56.14035%);
  aspect-ratio: 320 / 180;
  margin-bottom: 10px;
  margin-left: auto;
  background: url(../img/nav-recruit-02.jpg) 50% 50%/contain no-repeat;
}

.p-index-recruit-nav__inner:after {
  bottom: var(--padding);
  left: var(--padding);
  width: min(256px, 44.91228%);
  aspect-ratio: 256 / 144;
  margin-top: 10px;
  margin-right: auto;
  background: url(../img/nav-recruit-01.jpg) 50% 50%/contain no-repeat;
}

.p-index-recruit-nav__head {
  position: absolute;
  top: calc(-25px + var(--slope-1px) * -16);
  left: calc(23px + var(--slope-1px) * 32);
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 8px;
  background: #fff;
  color: var(--point-color);
  font-weight: 700;
  font-size: calc(14px + var(--slope-1px) * 6);
  line-height: 1;
  writing-mode: vertical-rl;
}

.p-index-recruit-nav__head:after {
  content: attr(data-en);
  font-weight: 900;
  font-size: calc(30px + var(--slope-1px) * 10);
  line-height: .8;
}

.p-index-recruit-nav__body {
  position: relative;
  z-index: 1;
}

.p-index-recruit-nav__lead {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: calc(15px + var(--slope-1px) * 10);
  margin-bottom: 1em;
  color: #fff;
  text-align: center;
  text-shadow: 3.5px 3.5px 0px #000;
  font-weight: 900;
  font-size: calc(30px + var(--slope-1px) * 12);
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .p-index-recruit-nav__lead {
    font-size: calc(20px + var(--slope-1px) * 20);
  }
}

.p-index-recruit-nav__lead p {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(15px + var(--slope-1px) * 10) 0;
}

@media screen and (max-width: 767px) {
  .p-index-recruit-nav__lead p {
    flex-direction: column;
  }
}

.p-index-recruit-nav__lead span {
  position: relative;
  display: block;
  width: fit-content;
  max-width: 100%;
  margin-block: var(--leading-trim);
}

.p-index-recruit-nav__lead span:before {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 0;

  -webkit-text-stroke: 3px var(--base-color);
}

.p-index-recruit-nav__lead span:after {
  content: attr(data-text);
  position: absolute;
  inset: 0;
  z-index: 1;
}

.p-index-recruit-nav__foot {
  display: flex;
  align-items: center;
  gap: calc(2px + var(--slope-1px) * 4);
  width: fit-content;
  margin-block: var(--leading-trim);
  margin-inline: auto;
  color: var(--key-color);
  text-decoration: underline;
  font-weight: 700;
  font-size: calc(16px + var(--slope-1px) * 8);
  transition: all .2s ease-out;
}

.p-index-recruit-nav__foot:after {
  content: "";
  display: block;
  flex-shrink: 0;
  width: calc(11px + var(--slope-1px) * 4);
  height: calc(11px + var(--slope-1px) * 4);
  background: currentColor;
  mask: var(--icon-angle) 50% 50%/contain no-repeat;
}

.p-index-recruit-nav:hover .p-index-recruit-nav__foot {
  text-underline-offset: .15em;
}

/* p-index-topics
============================== */
.p-index-topics {
  position: relative;
  display: grid;
  align-items: flex-start;
  grid-template-columns: auto 1fr;
  gap: calc(25px + var(--slope-1px) * 5) 70px;
  padding-block: calc(30px + var(--slope-1px) * 70) calc(60px + var(--slope-1px) * 6);
}

@media screen and (max-width: 767px) {
  .p-index-topics {
    grid-template-columns: 100%;
  }
}

.p-index-topics:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: -1;
  display: block;
  width: calc(var(--vw) * 100 - var(--belt-height) * 2);
  height: 100%;
  background-image: radial-gradient(#f3f3f3 30%, transparent 30%);
  background-size: 18px 18px;
  transform: translateX(-50%);
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
}

.p-index-topics:after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--key-color);
  mask: url(../img/bg-index-topics.svg) center calc(30px + var(--slope-1px) * 70) / 100% auto no-repeat;
}

@media screen and (max-width: 767px) {
  .p-index-topics:after {
    mask-image: url(../img/bg-index-topics-sp.svg);
  }
}

.p-index-topics__head {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(25px + var(--slope-1px) * 11);
}

/* ============================================================= *

lineup - rich

* ============================================================= */
/* p-lineup-menu
=============================== */
@media screen and (max-width: 767px) {
  .p-lineup-menu__desktop {
    display: none;
  }
}

.p-lineup-menu__mobile {
  display: none;
}

@media screen and (max-width: 767px) {
  .p-lineup-menu__mobile {
    display: block;
  }
}

.p-lineup-menu-tab {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14em, 1fr));
  gap: 8px;
  font-size: calc(13px + var(--slope-1px) * 2);
}

.p-lineup-menu-tab__button {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 4.57143em;
  padding: 1em;
  outline: none;
  border: 0;
  border-radius: 6px;
  background: var(--bg-color);
  font-weight: 500;
  line-height: 1.28571;
  cursor: pointer;
  transition: all .3s ease-out;
  appearance: none;
}

.p-lineup-menu-tab__button:hover {
  background: var(--base-color);
  color: #fff;
}

.p-lineup-menu-tab__button.is-current {
  background: var(--key-color);
  color: #fff;
}

.p-lineup-menu-tab__button > span:not(:last-child):after {
  content: "\FF0F";
}

.p-lineup-menu-select {
  width: 100%;
  padding: 1em 2.66667em 1em .66667em;
  outline: none;
  border: 1px solid var(--border-color);
  border-radius: 4px;
  background-color: #fff;
  background-image: url(/common-lineup/v2/img/icon/down.svg);
  background-position: right 1em center;
  background-size: 1em 1em;
  background-repeat: no-repeat;
  color: currentColor;
  font-size: 12px;
  font-family: inherit;
  line-height: 1;
  cursor: pointer;
  appearance: none;
}

/* p-lineup-section
=============================== */
.p-lineup-section {
  display: none;
  margin: calc(50px + var(--slope-1px) * 30) 0;
}

.p-lineup-section.is-current {
  display: block;
}

.p-lineup-section:last-child {
  margin-bottom: 0 !important;
}

.p-lineup-section__head {
  margin-block: var(--leading-trim) .8em;
  font-weight: bold;
  font-size: calc(16px + var(--slope-1px) * 8);
}

/* p-lineup-models
=============================== */
.p-lineup-models {
  margin-top: calc(40px + var(--slope-1px) * 10);
}

.p-lineup-models__head {
  margin-block: var(--leading-trim) 1em;
  font-weight: bold;
  font-size: calc(18px + var(--slope-1px) * 6);
}

/* p-lineup-list
=============================== */
.p-lineup-list {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + var(--gap));
  margin-top: calc(var(--gap) * -1);
  margin-left: calc(var(--gap) * -1);

  --gap: calc(5px + var(--slope-1px) * 10);
}

.p-lineup-list__item {
  flex-shrink: 0;
  width: 25%;
  padding-top: var(--gap);
  padding-left: var(--gap);
}

@media screen and (max-width: 767px) {
  .p-lineup-list__item {
    width: 33.33333%;
  }
}

@media screen and (max-width: 560px) {
  .p-lineup-list__item {
    width: 50%;
  }
}

@media screen and (max-width: 767px) {
  .p-lineup-list-scroll .p-lineup-list {
    flex-wrap: nowrap;
    width: 100%;
    margin-left: 0;
  }
  .p-lineup-list-scroll .p-lineup-list__item {
    width: calc(50vw - var(--inner-padding) - var(--gap) / 2);
    padding-left: 0;
  }
  .p-lineup-list-scroll .p-lineup-list__item:not(:first-child) {
    margin-left: var(--gap);
  }
}

/* p-lineup-item
=============================== */
.p-lineup-item {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: 17.5% 10%;
  border: 1px solid var(--border-color);
  background: #fff;
}

.p-lineup-item__head {
  min-height: 0%;
  margin-bottom: 1.5em;
}

.p-lineup-item__body {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  width: 100%;
}

.p-lineup-item__name {
  margin-block: var(--leading-trim);
  text-align: center;
  font-weight: bold;
  font-size: calc(14px + var(--slope-1px) * 3);
  line-height: 1.4;
}

.p-lineup-item__name span {
  display: inline-block;
}

.p-lineup-item__text {
  flex-grow: 1;
  margin-block: 1.07143em var(--leading-trim);
  padding-top: calc(1.14286em + var(--leading-trim));
  border-top: 1px solid var(--border-color);
  font-size: calc(12px + var(--slope-1px) * 2);
  line-height: 1.71429;
}

.p-lineup-item__foot {
  margin-top: 1.5em;
}

.p-lineup-item__link + .p-lineup-item__link {
  margin-top: calc(6px + var(--slope-1px) * 3);
}

.p-lineup-item__button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 3.33333em;
  margin: 0 auto;
  border: 0;
  border-radius: 6px;
  background: var(--key-color);
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: calc(13px + var(--slope-1px) * 2);
  transition: all .3s ease-out;
}

@media screen and (min-width: 768px) {
  .p-lineup-item__button {
    max-width: 13.33333em;
  }
}

.p-lineup-item__button > i {
  display: flex;
  justify-content: center;
  align-items: center;
  width: .9em;
  height: .9em;
  margin-left: .35em;
}

.p-lineup-item__button:hover {
  opacity: .7;
}

.p-lineup-item__button._detail {
  border: 1px solid var(--base-color);
  background: transparent;
  color: var(--base-color);
}

.p-lineup-item__button._detail:hover {
  background: var(--base-color);
  color: #fff;
  opacity: 1;
}

.p-lineup-item__button.is-disabled {
  opacity: .2;
  pointer-events: none;
}

/* ============================================================= *

lineup - defualt

* ============================================================= */
.CMN-L {
  width: 100%;
}

.CMN-L__title {
  margin-top: -3rem;
  padding-top: 3rem;
}

.CMN-L__titleInner {
  margin-bottom: 1.15385em;
  letter-spacing: .125em;
  font-weight: bold;
  font-size: 1.625em;
}

.CMN-L__titleInner img {
  opacity: 0;
}

/* anchor button
=============================== */
.CMN-L__anchorBtn {
  position: relative;
  margin-bottom: 5em;
}

.CMN-L__anchorBtn > * {
  position: relative;
  z-index: 1;
}

.CMN-L__anchorBtn-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: -1%;
}

.CMN-L__anchorBtn-item {
  display: inline-block;
  max-width: 22%;
  margin: 1%;
  word-spacing: normal;
  letter-spacing: normal;
  font-size: 1rem;
}

.CMN-L__anchorBtn-item a {
  display: block;
  transition: all .3s ease-out;
}

.CMN-L__anchorBtn-item a:hover {
  opacity: .7;
  transform: translateY(2px);
}

.CMN-L__anchorBtn-item img {
  border: 0;
}

/* anchor text link
=============================== */
.CMN-L__anchorText {
  display: none;
}

/* car list
=============================== */
.CMN-L__car {
  margin-top: 3rem;
  margin-bottom: 6rem;
}

.CMN-L__carList {
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
  width: 100%;
}

.CMN-L__carItem {
  display: flex;
  flex-direction: column;
  width: 24%;
  margin: .5%;
  border: 1px solid #aaa;
  background: #fff;
}

.CMN-L__carItem img {
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .CMN-L__carItem {
    width: 32.3333%;
  }
}

@media screen and (max-width: 560px) {
  .CMN-L__carItem {
    width: 49%;
  }
}

.CMN-L__carItem-icon {
  overflow: hidden;
  margin-bottom: 10px;
}

.CMN-L__carItem-exhaust {
  display: inline-block;
  float: left;
}

.CMN-L__carItem-mileage {
  display: inline-block;
  float: right;
  min-width: 48%;
  text-align: right;
}

.CMN-L__carItem-mileage img {
  display: inline;
}

.CMN-L__carItem-img {
  margin-bottom: 5px;
  text-align: center;
}

.CMN-L__carItem-img img {
  border: 0;
}

.CMN-L__carItem-head {
  padding: 1em;
}

.CMN-L__carItem-head a .CMN-L__carItem-name {
  color: var(--base-color);
  text-decoration: underline;
}

.CMN-L__carItem-head a:hover .CMN-L__carItem-name {
  text-decoration: none;
}

.CMN-L__carItem-name {
  padding: .5em 0;
  text-align: center;
  letter-spacing: .02em;
  font-weight: bold;
}

.CMN-L__carItem-spec {
  padding: 1.2em 1.8em;
  background: var(--bg-color);
  font-size: .875em;
}

@media screen and (max-width: 767px) {
  .CMN-L__carItem-spec {
    margin: auto 0;
    padding: 1em;
  }
}

.CMN-L__carItem-specItem {
  overflow: hidden;
  margin-bottom: 8px;
}

.CMN-L__carItem-specItem:last-child {
  margin-bottom: 0;
}

.CMN-L__carItem-specItem h5 {
  display: inline-block;
  float: left;
  padding-right: 1em;
  line-height: inherit;
}

.CMN-L__carItem-specItem p {
  display: inline-block;
  float: left;
}

.CMN-L__carItem-fuel2 {
  margin-top: 8px;
  padding: 1em;
  color: #023994;
  text-align: center;
  font-weight: bold;
  font-size: .875em;
}

.CMN-L__carItem-fuel2Inner {
  overflow: hidden;
}

.CMN-L__carItem-fuel2Inner img {
  margin-top: -3px;
}

/* page top
=============================== */
.CMN-L__pageTop {
  display: none;
}

/* caution
=============================== */
.CMN-L__cautionList {
  font-size: calc(12px + var(--slope-1px) * 1);
  line-height: 1.8;
}

.CMN-L__cautionItem {
  margin-bottom: 6px;
  padding-left: 1em;
  text-align: justify;
  text-indent: -1em;
  text-justify: auto;
}

.CMN-L__cautionItem--star {
  color: #023994;
}

.CMN-L__cautionItem--star:before {
  content: "\2605";
}

.CMN-L__cautionItem:before {
  content: "\25cf";
}

.CMN-L__cautionItem--asterisk:before {
  content: "\203B";
}

/* zankure
=============================== */
#zenkoku_zankure a {
  display: inline-block;
  transition: all .4s cubic-bezier(.165, .84, .44, 1);
  transition: all .3s ease-out;
}

#zenkoku_zankure a:hover {
  opacity: .7;
}

/* ============================================================= *

detail

* ============================================================= */
/* democar title
=============================== */
body[data-id="detail"] .c-democar-container .ATC-title-text {
  display: none;
}

body[data-id="detail"] .c-democar-container .ATC-title-text + .car-contents-demo-caution {
  margin-top: 0;
}

body[data-id="detail"] .CMN-CMP-body__list {
  display: flex;
  flex-wrap: wrap;
  max-width: 100%;
}

body[data-id="detail"] .CMN-CMP-body__item {
  float: none;
}

body[data-id="detail"] .CMN-CMP-body__item:first-child:last-child {
  margin: 0 auto;
}

/* p-lineup-detail
=============================== */
.p-lineup-detail {
  padding: calc(25px + var(--slope-1px) * 15);
  border: 1px solid var(--border-color);
  border-radius: calc(20px + var(--slope-1px) * 20);
  background: #fff;
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1.875;
}

.p-lineup-detail__inner {
  max-width: 900px;
  margin: 0 auto;
}

.p-lineup-detail__head {
  text-align: center;
}

.p-lineup-detail__title {
  /* -0.4375em for line-height offset */
  margin-top: -.4375em;
  margin-bottom: .5625em;
  font-weight: bold;
  font-size: 3.2rem;
  line-height: 1.875;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail__title {
    font-size: pxToRemt(20);
  }
}

.p-lineup-detail__lead {
  margin-bottom: -.375em;
  padding-top: .77885em;
  border-top: 1px solid #ccc;
  font-size: 2.6rem;
  line-height: 1.52941;
}

@media screen and (min-width: 768px) {
  .p-lineup-detail__lead span {
    display: inline-block;
  }
}

@media screen and (max-width: 767px) {
  .p-lineup-detail__lead {
    text-align: left;
    font-size: pxToRemt(17);
  }
}

.p-lineup-detail__hero {
  margin-top: 6%;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail__hero {
    margin-top: 9.83607%;
  }
}

.p-lineup-detail__hero img {
  width: 100%;
}

.p-lineup-detail__body {
  width: 100%;
  max-width: 650px;
  margin: 6.88889% auto;
  font-weight: 400;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail__body {
    margin: 9.18033% auto;
  }
}

.p-lineup-detail__foot {
  margin-top: 6.88889%;
}

.p-lineup-detail-image:not(:first-child) {
  margin-top: 8.92308%;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail-image:not(:first-child) {
    margin: 10.4918% auto;
  }
}

.p-lineup-detail-text:not(:first-child) {
  margin-top: 10%;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail-text:not(:first-child) {
    margin: 9.18033% auto;
  }
}

.p-lineup-detail-text__head {
  /* -0.25em for line-height offset */
  margin-top: -.25em;
  margin-bottom: 1.25em;
  font-size: 2.6rem;
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail-text__head {
    font-size: pxToRemt(17);
  }
}

.p-lineup-detail-text__body {
  /* -0.4375em for line-height offset */
  margin-top: -.4375em;
  margin-bottom: -.4375em;
  line-height: 1.875;
}

.p-lineup-detail-banner {
  position: relative;
  overflow: hidden;
  padding: 6rem 4.44444%;
  border: 1px solid;
  border-radius: .6rem;
  line-height: 1.41667;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail-banner {
    padding: pxToRemt(20) 1em;
    font-size: pxToRemt(12);
  }
}

.p-lineup-detail-banner__inner {
  display: grid;
  grid-template-rows: 1fr auto 1fr;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "detailImage detailHead"
 "detailImage detailBody"
 "detailImage detailFoot";

  grid-column-gap: 40px;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail-banner__inner {
    grid-template-rows: auto auto auto;
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "detailImage detailHead"
 "detailImage detailBody"
 "detailFoot detailFoot";

    grid-column-gap: 1.33333em;
  }
}

.p-lineup-detail-banner__image {
  display: flex;
  align-items: center;
  grid-area: detailImage;
}

.p-lineup-detail-banner__image img {
  width: 100%;
}

.p-lineup-detail-banner__head {
  display: flex;
  align-items: flex-end;
  grid-area: detailHead;
  padding-bottom: .6em;
  font-weight: bold;
  font-size: 1.5em;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail-banner__head {
    padding-bottom: .4em;
    font-size: pxToRemt(13);
  }
}

.p-lineup-detail-banner__body {
  grid-area: detailBody;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail-banner__body {
    display: flex;
    align-items: flex-start;
  }
}

.p-lineup-detail-banner__foot {
  display: flex;
  align-items: flex-start;
  grid-area: detailFoot;
  padding-top: .5em;
}

@media screen and (max-width: 767px) {
  .p-lineup-detail-banner__foot {
    justify-content: center;
    padding-top: 1.15385em;
    font-size: pxToRemt(13);
  }
}

.p-lineup-detail-banner__foot a:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
}

.p-lineup-detail-caution {
  display: block;
  /* -0.5em for line-height offset */
  margin-top: 2.83333em;
  margin-bottom: -.5em;
  font-size: 1.2rem;
  line-height: 2;
}

/* ============================================================= *

Newcar

* ============================================================= */
.p-newcar-contents > div {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.p-newcar-contents > div#zenkoku_zankure {
  justify-content: center;
}

.p-newcar-contents br {
  display: none;
}

.p-newcar-contents object {
  float: left;
  width: 50%;
  padding: 1rem;
}

.p-newcar-contents div[id^="img600"] {
  float: left;
  width: 50%;
  padding: 1rem;
}

@media screen and (max-width: 560px) {
  .p-newcar-contents div[id^="img600"] {
    width: 100%;
    padding: .75rem 0;
  }
  .p-newcar-contents div[id^="img600"]:first-child {
    padding-top: 0;
  }
}

.p-newcar-contents div[id^="img600"] a {
  display: block;
  transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.p-newcar-contents div[id^="img600"] a:hover {
  opacity: .7;
}

.p-newcar-contents div[id^="img600"] a img {
  width: 100%;
}

.p-newcar-contents table {
  width: 100%;
  padding: 3rem 0;
  border-spacing: 1rem 0;
  border-collapse: separate;
  table-layout: fixed;
}

.p-newcar-contents table a {
  display: block;
  transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.p-newcar-contents table a:hover {
  opacity: .7;
}

.p-newcar-contents table img {
  width: 100%;
  height: auto;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .p-newcar-contents table tr:first-child {
    display: none;
  }
}

/* ============================================================= *

Special Car

* ============================================================= */
.p-specialcar-contents .frame-c {
  clear: both;
  width: 100%;
  padding: 5rem 0 0;
}

.p-specialcar-contents .frame-c::after {
  content: "";
  display: block;
  clear: both;
  width: 0;
  height: 0;
}

.p-specialcar-contents .frame-c:first-child {
  padding-top: 0;
}

.p-specialcar-contents .frame-c * {
  text-align: left !important;
}

.p-specialcar-contents .frame-c .mainimg-cw {
  float: left;
  overflow: hidden;
  width: 20rem;
  vertical-align: top;
  font-size: 1.2rem;
}

@media screen and (max-width: 560px) {
  .p-specialcar-contents .frame-c .mainimg-cw {
    float: none;
    width: 100%;
    max-width: 400px;
    margin: 0 auto 2rem;
  }
}

.p-specialcar-contents .frame-c .mainimg-cw a {
  display: block;
  margin: 0 auto 1em;
  transition: all .3s ease-out;
  transition: all .3s ease-out;
}

.p-specialcar-contents .frame-c .mainimg-cw a:hover {
  opacity: .7;
}

.p-specialcar-contents .frame-c .mainimg-cw a img {
  float: none;
  margin-right: 0;
}

.p-specialcar-contents .frame-c .mainimg-cw img {
  float: left;
  margin-right: .5em;
}

.p-specialcar-contents .frame-c .mainimg-cw .gas {
  overflow: hidden;
}

.p-specialcar-contents .frame-c .maintxt-cw {
  overflow: hidden;
  padding-left: 2rem;
  background-image: none;
  vertical-align: top;
}

@media screen and (max-width: 560px) {
  .p-specialcar-contents .frame-c .maintxt-cw {
    padding-left: 0;
  }
}

.p-specialcar-contents .frame-c ul.n-cw {
  padding: 0 0 1em 1.5em;
  list-style-type: disc;
  font-size: 1.4rem;
}

.p-specialcar-contents .frame-c ul.n-cw li {
  list-style-position: outside;
  list-style-type: disc;
}

.p-specialcar-contents .frame-c .cartype-w {
  padding: 0 0 5px 0;
  font-size: 1.4rem;
}

.p-specialcar-contents .frame-c .carname-cw {
  margin: 0 0 1.5rem;
  padding-left: 0;
  border-bottom: 1px solid var(--key-color);
  font-size: 2rem;
}

.p-specialcar-contents .frame-c .carname-cw a {
  color: var(--key-color);
  text-decoration: none;
}

.p-specialcar-contents .frame-c .carname-cw a:hover {
  text-decoration: underline;
}

.p-specialcar-contents .frame-c .spacialeq-cw {
  margin: 0 0 5px;
  font-size: 1.6rem;
}

.p-specialcar-contents .frame-c .clear-toku {
  height: 0;
}

.p-specialcar-contents .corner-cw {
  display: none;
}

/* ============================================================= *

Demo Car

* ============================================================= */
body[data-id=democar] .ATC-shop-list-table-tel:before {
  background: currentColor;
  mask: url('data:image/svg+xml;utf8, <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 21 21"><path fill="%23000" d="M18.0299 10.2298c-.0616-2.0236-.8083-3.7417-2.24-5.1544-1.4316-1.413-3.1726-2.1498-5.2229-2.2106V1.2822c1.2472.0271 2.4149.2793 3.5031.7568 1.0883.4775 2.0389 1.1173 2.8517 1.9193.8127.8022 1.4609 1.7402 1.9447 2.8141.4839 1.074.7396 2.2265.767 3.4574h-1.6036Zm-4.2763 0c-.0616-.8455-.394-1.5675-.9972-2.166-.6031-.5984-1.3329-.9247-2.1894-.9788V5.5024c1.3007.0541 2.4088.5346 3.3243 1.4414.9156.907 1.4043 2.0023 1.4659 3.286h-1.6036Zm4.7058 9.2519c-2.0147 0-4.0387-.4623-6.0721-1.3869-2.0332-.9245-3.903-2.2287-5.6094-3.9126-1.6995-1.684-3.0177-3.5277-3.9545-5.531C1.8863 6.648 1.418 4.6522 1.418 2.664c0-.3165.1069-.582.3207-.7966.2138-.2143.481-.3215.8018-.3215h3.4868c.27 0 .508.087.7144.2609.2063.1737.3376.3884.3937.644l.6128 3.1043c.0424.288.0335.5355-.0267.7424-.0604.207-.1687.3808-.325.5215l-2.469 2.372a14.6147 14.6147 0 0 0 1.362 2.0381 20.1613 20.1613 0 0 0 1.6581 1.8349 18.3415 18.3415 0 0 0 1.8709 1.6132c.6607.4964 1.3741.9583 2.1403 1.3858l2.399-2.3881c.1673-.1718.3699-.2922.6078-.3613.2377-.069.4847-.0859.7411-.0507l2.9686.5966c.2699.0704.4902.2063.6609.4078.1707.2015.2561.4301.2561.6858v3.4207c0 .3165-.1086.5803-.3258.7913-.2174.211-.4865.3165-.8072.3165ZM4.1688 7.6937l1.908-1.8017c.0342-.0271.0565-.0643.0668-.1116a.243.243 0 0 0-.005-.1319l-.4648-2.3577c-.0137-.054-.0377-.0945-.072-.1216-.0341-.0271-.0787-.0406-.1335-.0406H3.182a.1406.1406 0 0 0-.1029.0406.1373.1373 0 0 0-.0409.1015c.0547.721.1743 1.4533.3587 2.1971.1843.744.4415 1.486.7719 2.226Zm9.301 9.1179a11.0913 11.0913 0 0 0 2.2172.7478c.7698.1723 1.489.2748 2.1577.3073a.1408.1408 0 0 0 .1029-.0406.1372.1372 0 0 0 .0412-.1016V15.505c0-.0542-.0138-.0981-.0412-.1319-.0274-.0338-.0685-.0574-.1232-.071l-2.2451-.4505c-.0411-.0135-.0771-.0152-.1079-.005-.0309.0102-.0635.0322-.0979.066l-1.9037 1.899Z"/></svg>') 50% 50%/contain no-repeat;
}

body[data-id=democar] .ATC-car-contents-header > ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--index-anchor-button-column-gap);
  max-width: 390px;
  margin-left: auto;
}

@media screen and (max-width: 560px) {
  body[data-id=democar] .ATC-car-contents-header > ul {
    margin-right: auto;
  }
}

body[data-id=democar] .ATC-car-contents-header > ul > li {
  margin-left: 0;
}

body[data-id=democar] .ATC-car-contents-header > ul > li a {
  width: 100%;
}

/* ============================================================= *

showroom/index.html

* ============================================================= */
/* p-showroom-map
============================== */
.p-showroom-map {
  overflow: hidden;
  width: 100%;
  height: 400px;
  border-radius: 40px;
  background: var(--bg-color);
}

/* p-showroom-list
============================== */
.p-showroom-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(30px + var(--slope-1px) * 20) calc(25px + var(--slope-1px) * 15);
}

@media screen and (max-width: 767px) {
  .p-showroom-list {
    grid-template-columns: repeat(auto-fill, minmax(calc(250px + var(--slope-1px) * 50), 1fr));
  }
}

/* p-showroom-nav
============================== */
.p-showroom-nav {
  position: relative;
  display: block;
  text-decoration: none;
}

.p-showroom-nav:before {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 40px 40px 0px 40px;
  background: var(--point-color);
  opacity: .5;
  transition: all .2s ease-out;

  rotate: 2deg;
}

.p-showroom-nav:hover:before {
  rotate: 0deg;
}

.p-showroom-nav__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 3px solid var(--key-color);
  border-radius: calc(20px + var(--slope-1px) * 20) calc(20px + var(--slope-1px) * 20) 0 calc(20px + var(--slope-1px) * 20);
}

.p-showroom-nav__image {
  overflow: hidden;
}

.p-showroom-nav__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all .2s ease-out;
}

.p-showroom-nav:hover .p-showroom-nav__image img {
  transform: scale(1.03);
}

.p-showroom-nav__contents {
  position: relative;
  flex-grow: 1;
  padding: calc(20px + var(--slope-1px) * 5) calc(20px + var(--slope-1px) * 5) calc(25px + var(--slope-1px) * 5);
  background-color: #fff;
  background-image: linear-gradient(90deg, #efefef 1px, transparent 1px), linear-gradient(#efefef 1px, transparent 1px);
  background-position: center center;
  background-size: 16px 16px;
}

.p-showroom-nav__head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 20px 12px;
  margin-bottom: calc(20px + var(--slope-1px) * 5);
  line-height: 1;
}

.p-showroom-nav__body {
  display: grid;
  align-items: flex-start;
  grid-template-columns: auto 1fr;
  gap: calc(18px + var(--slope-1px) * 2) 1em;
  font-size: calc(14px + var(--slope-1px) * 2);
}

.p-showroom-nav__title {
  display: flex;
  align-items: center;
  gap: calc(6px + var(--slope-1px) * 5);
  width: fit-content;
  padding: calc(12px + var(--slope-1px) * 3) calc(17px + var(--slope-1px) * 3) calc(12px + var(--slope-1px) * 3) calc(14px + var(--slope-1px) * 3);
  border-radius: 50px;
  background: var(--point-color);
  color: #fff;
  font-weight: 700;
  font-size: calc(16px + var(--slope-1px) * 5);
  line-height: 1;
}

.p-showroom-nav__title:before {
  content: "";
  flex-shrink: 0;
  width: calc(8px + var(--slope-1px) * 4);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: currentColor;
}

.p-showroom-nav__data {
  display: contents;
}

.p-showroom-nav__data > dt {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: .3em;
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-weight: 700;
}

.p-showroom-nav__data > dd {
  margin-block: var(--leading-trim);
}

.p-showroom-nav__address {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1em;
}

/* ============================================================= *

Sr

* ============================================================= */
/* p-sr-slider
============================== */
.p-sr-slider {
  position: relative;
  left: 50%;
  overflow: hidden;
  width: calc(var(--vw) * 100);
  max-width: calc(var(--slide-width) + var(--slide-width) * .688 * 2);
  margin-bottom: calc(25px + var(--slope-1px) * 15);
  transform: translateX(-50%);

  --slide-width: 840px;
}

.p-sr-slider__inner {
  width: var(--slide-width);
  max-width: 86.95652%;
  margin-inline: auto;
}

.p-sr-slider__list {
  position: relative;
  overflow: visible;
  width: 200%;
  margin-inline: auto;

  --radius: calc(20px + var(--slope-1px) * 20);
}

.p-sr-slider__list .slick-list {
  overflow: visible;
}

.p-sr-slider__item {
  position: relative;
  padding-inline: calc(6px + var(--slope-1px) * 14);
}

.p-sr-slider__item img {
  border: 3px solid transparent;
  border-radius: var(--radius);
  transition: all .4s ease;
  transform: scale(.688);
  transform-origin: bottom center;
}

.p-sr-slider__item.slick-prev-slide img {
  transform-origin: bottom right;
}

.p-sr-slider__item.slick-next-slide img {
  transform-origin: bottom left;
}

.p-sr-slider__item.slick-current-slide img {
  border-color: var(--key-color);
  transform: scale(1);
  transform-origin: bottom center;
}

.p-sr-slider-control {
  justify-content: center;
  margin-top: calc(20px + var(--slope-1px) * 10);
}

/* p-sr-nav
============================== */
.p-sr-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 32px;
  margin-bottom: calc(30px + var(--slope-1px) * 20);
  padding: calc(15px + var(--slope-1px) * 10) calc(20px + var(--slope-1px) * 10);
  border-radius: 20px 20px 0px 20px;
  background: var(--key-color);
  color: #fff;
}

@media screen and (max-width: 767px) {
  .p-sr-nav {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 10px;
  }
}

/* p-sr-information
============================== */
.p-sr-information {
  display: grid;
  align-items: flex-start;
  grid-template-columns: 1fr 450px;
  gap: 25px 50px;
  margin-top: 25px;
}

@media screen and (max-width: 767px) {
  .p-sr-information {
    grid-template-columns: 100%;
  }
}

/* p-sr-profile
=============================== */
.p-sr-profile {
  width: 100%;
  background: var(--border-dashed);
  background-position: left top;
  font-size: calc(14px + var(--slope-1px) * 2);
}

.p-sr-profile__item {
  display: flex;
  align-items: center;
  gap: 0 1em;
  padding: 22px 15px 20px 15px;
  background: var(--border-dashed);
}

.p-sr-profile__head {
  width: 5.25em;
  font-weight: 700;
}

.p-sr-profile__body {
  display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
  gap: 0 .5em;
}

.p-sr-profile-tel a {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--base-color) !important;
  font-weight: bold;
  font-size: calc(18px + var(--slope-1px) * 4);
}

.p-sr-profile-tel img, .p-sr-profile-tel svg {
  width: 1em;
  height: 1em;
}

.p-sr-profile-tel svg path {
  fill: currentColor;
}

/* p-sr-facility
=============================== */
.p-sr-facility {
  border-radius: 20px;
  background: var(--bg-color);
}

.p-sr-facility__head {
  padding-block: calc(15px + var(--slope-1px) * 5) calc(14px + var(--slope-1px) * 4);
  border-bottom: 1px solid var(--border-color);
  text-align: center;
  font-weight: 700;
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1;
}

.p-sr-facility__body {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(8px + var(--slope-1px) * 2) calc(8px + var(--slope-1px) * 6);
  padding: calc(15px + var(--slope-1px) * 2) calc(19px + var(--slope-1px) * 1) calc(15px + var(--slope-1px) * 5);
}

@media screen and (max-width: 767px) {
  .p-sr-facility__body {
    gap: 15px;
  }
}

.p-sr-facility__item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 400;
  font-size: calc(12px + var(--slope-1px) * 2);
  line-height: 1.25;
}

.p-sr-facility__item > figure {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(25px + var(--slope-1px) * 5);
  aspect-ratio: 1 / 1;
  padding: 6px;
  border-radius: 5px;
  background: #fff;
}

.p-sr-facility__item > figure svg {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.p-sr-facility__item > figure svg path {
  fill: currentColor;
}

.p-sr-facility__item._inactive {
  display: none;
}

/* p-sr-map
============================== */
.p-sr-map {
  overflow: hidden;
  width: 100%;
  height: calc(345px + var(--slope-1px) * 55);
  border-radius: 40px;
  background: var(--bg-color);
}

.p-sr-map iframe {
  width: 100%;
  height: 100%;
}

/* p-sr-access
=============================== */
.p-sr-access {
  display: grid;
  grid-template-columns: 100%;
  gap: 0;
  margin-top: calc(20px + var(--slope-1px) * 10);
  background: var(--border-dashed);
  background-position: left top;
  line-height: 1.5;
}

.p-sr-access__item {
  display: grid;
  align-items: flex-start;
  grid-template-columns: 6.2em 1fr;
  gap: 15px 2em;
  padding: 20px 15px;
  background: var(--border-dashed);
}

@media screen and (max-width: 767px) {
  .p-sr-access__item {
    grid-template-columns: 100%;
  }
}

.p-sr-access__item > dt {
  margin-block: var(--leading-trim);
  font-weight: 700;
  font-size: calc(14px + var(--slope-1px) * 2);
}

.p-sr-access__item > dd {
  margin-block: var(--leading-trim);
  font-size: calc(14px + var(--slope-1px) * 3);
  line-height: 1.5;
}

/* blog
=============================== */
.p-sr-blog .blog__paging {
  display: none;
}

.p-sr-blog .blog__title span {
  display: none;
}

/* p-sr-contact
=============================== */
.p-sr-contact {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(35px + var(--slope-1px) * 10) 63px;
}

@media screen and (max-width: 767px) {
  .p-sr-contact {
    grid-template-columns: 100%;
  }
}

/* p-sr-contact-section
=============================== */
.p-sr-contact-section__head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-block: var(--leading-trim) calc(1em + var(--leading-trim));
  font-weight: 700;
  font-size: calc(18px + var(--slope-1px) * 4);
}

.p-sr-contact-section__head:before {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 15px;
  height: 3px;
  border-radius: 3px;
  background: currentColor;
}

/* p-sr-contact-list
=============================== */
.p-sr-contact-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(17px + var(--slope-1px) * 1) calc(12px + var(--slope-1px) * 5);
}

/* p-sr-car-slider
============================== */
.p-sr-car-slider {
  width: calc(100% + 20px + var(--slope-1px) * 10);
  margin-inline: calc(-10px + var(--slope-1px) * -5);
}

@media screen and (min-width: 768px) {
  .p-sr-car-slider {
    margin-bottom: -20px;
  }
}

.p-sr-car-slider__control {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-top: 15px;
  color: #ccc;
}

/* p-sr-topics
============================== */
.p-sr-topics {
  display: grid;
  grid-template-columns: 342px 1fr;
  gap: 30px 45px;
}

@media screen and (max-width: 767px) {
  .p-sr-topics {
    grid-template-columns: 100%;
  }
}

@media screen and (max-width: 767px) {
  .p-sr-topics__slider {
    padding-inline: 3.47826%;
  }
}

.p-sr-topics__contents {
  display: grid;
  align-self: flex-start;
  grid-template-columns: 100%;
  gap: calc(20px + var(--slope-1px) * 10);
}

.p-sr-topics-slider-control {
  justify-content: center;
  margin-top: 20px;
}

/* p-sr-notfound
============================== */
.p-sr-notfound {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  text-align: center;
}

/* ============================================================= *

Staff

* ============================================================= */
.p-staff-contents .ATC-shop-contents-staff {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 10px;
}

@media screen and (max-width: 767px) {
  .p-staff-contents .ATC-shop-contents-staff {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 560px) {
  .p-staff-contents .ATC-shop-contents-staff {
    grid-template-columns: 100%;
  }
}

.p-staff-contents .ATC-shop-contents-staff-list {
  overflow: hidden;
  border: 1px solid var(--border-color);
  border-radius: 20px;
  background: #fff;
  font-size: calc(13px + var(--slope-1px) * 2);
}

.p-staff-contents .ATC-shop-contents-staff-list > ul {
  padding: calc(20px + var(--slope-1px) * 4);
}

.p-staff-contents .ATC-shop-contents-staff-list.is-notready {
  width: 100%;
  border: 0;
}

.p-staff-contents .ATC-photo-thumb-frame {
  overflow: hidden;
  width: 100%;
  aspect-ratio: 4 / 3;
  margin-inline: auto;
  line-height: 0;
}

.p-staff-contents .ATC-photo-thumb-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-staff-contents .ATC-shop-contents-staff-list-name {
  display: flex;
  align-items: center;
  gap: .5em 1em;
  overflow: hidden;
  margin-bottom: 1.17647em;
  padding-bottom: .88235em;
  border-bottom: 1px solid var(--border-color);
  font-weight: bold;
  font-size: 1.0625em;
}

.p-staff-contents .ATC-shop-contents-staff-list-name > div {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: .25em 1em;
  color: #fff;
  text-align: center;
  font-size: .76471em;
  line-height: 1.2;
}

.p-staff-contents .ATC-staff-type-bg01,
.p-staff-contents .ATC-staff-type-bg10 {
  background: #ef929d;
}

.p-staff-contents .ATC-staff-type-bg02 {
  background: #8399d2;
}

.p-staff-contents .ATC-staff-type-bg03,
.p-staff-contents .ATC-staff-type-bg04,
.p-staff-contents .ATC-staff-type-bg05 {
  background: #72c5bd;
}

.p-staff-contents .ATC-staff-type-bg06,
.p-staff-contents .ATC-staff-type-bg07,
.p-staff-contents .ATC-staff-type-bg08,
.p-staff-contents .ATC-staff-type-bg09 {
  background: #ee9100;
}

.p-staff-contents .ATC-shop-contents-staff-list-qualification {
  /* -0.375em for line-height offset */
  margin-top: -.375em;
  margin-bottom: -.375em;
}

.p-staff-contents .ATC-staff-type-color01,
.p-staff-contents .ATC-staff-type-color10 {
  color: #dd2e43;
}

.p-staff-contents .ATC-staff-type-color02 {
  color: #3a5fbc;
}

.p-staff-contents .ATC-staff-type-color03,
.p-staff-contents .ATC-staff-type-color04,
.p-staff-contents .ATC-staff-type-color05 {
  color: #2caa9e;
}

.p-staff-contents .ATC-staff-type-color06,
.p-staff-contents .ATC-staff-type-color07,
.p-staff-contents .ATC-staff-type-color08,
.p-staff-contents .ATC-staff-type-color09 {
  color: #ee9100;
}

.p-staff-contents .ATC-shop-contents-staff-list-comment {
  /* -0.375em for line-height offset */
  margin-top: .85577em;
  margin-bottom: -.375em;
}

.p-staff-contents .ATC-shop-contents-staff-list-comment.is-empty {
  padding: 0;
  background: transparent;
}

/* ============================================================= *

Maintenance

* ============================================================= */
/* schedule
=============================== */
.p-maintenance-schedule {
  position: relative;
  width: 100%;
  margin-inline: auto;

  --desktop-row-gap: 40;
  --mobile-column-gap-px: 20px;
  --mobile-row-gap-px: calc(12px + var(--slope-1px) * 8);
  --mobile-option-width-px: calc(60px + var(--slope-1px) * 20);
  --mobile-row-height-px: 60px;
  --mobile-head-width-px: 60px;
  --sch-wrap-width: 1000;
  --sch-wrap-padding-left: 20;
  --sch-wrap-padding-right: 20;
  --sch-dot-width: 12;
  --sch-dot-border-width: 4;
  --sch-border-color: #fff;
  --sch-line-width: 4;
  --sch-line-height: 40;
  --sch-line-color: #e6e6e6;
  --sch-item-width: 80;
  --sch-item-min-width: calc((var(--sch-wrap-width) - var(--sch-wrap-padding-left) - var(--sch-wrap-padding-right)) / 12);
  --sch-link-width: 60;
  --sch-link-height: 220;
  --sch-link-border-height: calc(1px * (var(--desktop-row-gap) + (var(--sch-item-width) - var(--sch-dot-width) - var(--sch-dot-border-width) * 2) / 2 + var(--sch-dot-border-width)));
  --sch-border-width: 4;
}

.p-maintenance-schedule:not(:first-child) {
  margin-top: calc(30px + var(--slope-1px) * 20);
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule {
    display: flex;
    flex-wrap: wrap;
  }
}

.p-maintenance-schedule__body {
  position: relative;
  display: flex;
  justify-content: space-between;
  width: 100%;
  padding-right: calc(100% * var(--sch-wrap-padding-right) / var(--sch-wrap-width));
  padding-left: calc(100% * var(--sch-wrap-padding-left) / var(--sch-wrap-width));
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule__body {
    flex-direction: column;
    justify-content: flex-start;
    width: calc(100% - var(--mobile-option-width-px));
    padding-right: 3%;
    padding-left: 0;
  }
}

.p-maintenance-schedule__body:before {
  content: "";
  position: absolute;
  bottom: calc(1px * (var(--sch-link-height) + var(--desktop-row-gap)));
  left: 0;
  display: block;
  width: 100%;
  height: calc(1px * var(--sch-line-height));
  margin-bottom: calc((100% / var(--sch-wrap-width) * var(--sch-item-min-width) - (1px * var(--sch-line-height))) / 2);
  background: var(--sch-line-color);
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule__body:before {
    top: 10px;
    right: initial;
    left: calc(var(--mobile-head-width-px) * .25);
    width: calc(var(--mobile-head-width-px) * .5);
    height: 100%;
    padding-top: 0;

    translate: none;
  }
}

.p-maintenance-schedule__foot {
  display: flex;
  overflow: hidden;
  width: 100%;
  margin-top: 1.875em;
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule__foot {
    width: var(--mobile-option-width-px);
    height: 100%;
    margin-top: 0;
  }
}

/* timeline */
.p-maintenance-schedule-timeline {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 8.33333%;
  max-width: calc(var(--sch-item-width) * 1px);
  font-size: calc(15px + var(--slope-1px) * 3);
  font-size: calc(13px + var(--slope-1px) * 3);
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-timeline {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 100%;
  }
  .p-maintenance-schedule-timeline + .p-maintenance-schedule-timeline {
    margin-top: var(--mobile-row-gap-px);
  }
}

.p-maintenance-schedule-timeline__head {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  margin-bottom: calc(1px * var(--desktop-row-gap));
  padding-top: 100%;
}

._primary .p-maintenance-schedule-timeline__head,
._emphasise .p-maintenance-schedule-timeline__head {
  z-index: 3;
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-timeline__head {
    display: flex;
    flex-shrink: 0;
    justify-content: center;
    align-items: center;
    width: var(--mobile-head-width-px);
    height: var(--mobile-head-width-px);
    margin: 0;
    padding: 0;
  }
  .p-maintenance-schedule-timeline:first-child .p-maintenance-schedule-timeline__head {
    width: 100%;
    font-weight: bold;
  }
}

.p-maintenance-schedule-timeline__head:before {
  content: "";
  position: absolute;
  inset: 0;
  display: block;
  box-sizing: content-box;
  width: calc(1px *  var(--sch-dot-width));
  height: calc(1px *  var(--sch-dot-width));
  margin: auto;
  border: calc(1px * var(--sch-dot-border-width)) solid var(--sch-border-color);
  border-radius: 50%;
  background: var(--sch-line-color);
}

.p-maintenance-schedule-timeline__head span {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: calc(100% / var(--sch-item-width) * 10) .5em;
  width: 100%;
  height: 100%;
  background: #666;
  color: #fff;
  line-height: 1;
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-timeline__head span {
    position: static;
    top: initial;
    right: initial;
    bottom: initial;
    left: initial;
    flex-direction: row;
    margin: initial;
  }
}

@media screen and (max-width: 560px) {
  .p-maintenance-schedule-timeline__head span {
    font-weight: bold;
    font-size: 100%;
  }
}

.p-maintenance-schedule-timeline__head span > i {
  display: block;
  width: calc(100% / var(--sch-item-width) * 27);
  min-height: 0%;
  max-width: 27px;
}

._emphasise .p-maintenance-schedule-timeline__head span {
  background: var(--key-color);
}

.p-maintenance-schedule-timeline__head:after {
  content: "";
  position: absolute;
  top: calc(50% + 1px * var(--sch-dot-width) / 2);
  right: 0;
  left: 0;
  display: block;
  box-sizing: content-box;
  width: calc(1px * var(--sch-line-width));
  height: calc(50% + 1px * var(--desktop-row-gap));
  margin: 0 auto;
  border-width: 0 calc(1px * var(--sch-dot-border-width));
  border-style: solid;
  border-color: var(--sch-border-color);
  background: var(--sch-line-color);
}

._primary .p-maintenance-schedule-timeline__head:after {
  background: #666;
}

._emphasise .p-maintenance-schedule-timeline__head:after {
  background: var(--key-color);
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-timeline__head:after {
    top: 0;
    bottom: 0;
    left: calc(50% + 1px * var(--sch-dot-width) / 2);
    width: var(--mobile-head-width-px);
    height: calc(1px * var(--sch-line-width));
    margin: auto 0;
    padding-top: 0;
    border-width: calc(1px * var(--sch-dot-border-width)) 0;
  }
}

.p-maintenance-schedule-timeline:not(:has(.p-maintenance-schedule-timeline__body)) .p-maintenance-schedule-timeline__head:after {
  content: none;
}

.p-maintenance-schedule-timeline__body {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: calc(100% / var(--sch-item-width) * var(--sch-link-width));
  height: calc(1px * var(--sch-link-height));
  border-width: calc(1px * var(--sch-border-width));
  border-style: solid;
  border-color: var(--sch-line-color);
  background: #fff;
  text-decoration: none;
  line-height: 1;
  transition: all .2s ease-out;
}

._primary .p-maintenance-schedule-timeline__body {
  border-color: #666;
}

._emphasise .p-maintenance-schedule-timeline__body {
  border-color: var(--key-color);
  color: var(--key-color);
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-timeline__body {
    flex-direction: row;
    width: calc(100% - var(--mobile-head-width-px) - var(--mobile-column-gap-px));
    height: var(--mobile-row-height-px);
    margin-left: var(--mobile-column-gap-px);
    padding: .8em 0;
  }
}

a.p-maintenance-schedule-timeline__body {
  font-weight: bold;
}

a.p-maintenance-schedule-timeline__body:after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 1em;
  left: 0;
  display: block;
  width: .75em;
  height: .75em;
  margin: 0 auto;
  background: transparent;
  mask: var(--icon-angle) 50% 50%/contain no-repeat;
  transition: all .2s ease-out;
  transform: rotate(90deg);
}

@media screen and (max-width: 767px) {
  a.p-maintenance-schedule-timeline__body:after {
    top: 0;
    right: 1em;
    bottom: 0;
    left: auto;
    margin: auto 0;
    background: currentColor;
    transform: none;
  }
}

a.p-maintenance-schedule-timeline__body:hover:after {
  background: currentColor;
}

/* option */
.p-maintenance-schedule-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-inline: calc(100% / var(--sch-wrap-width) * var(--sch-wrap-padding-left)) calc(100% / var(--sch-wrap-width) * var(--sch-wrap-padding-right));
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-option {
    flex-direction: column;
    justify-content: flex-start;
    height: 100%;
  }
}

.p-maintenance-schedule-option__head {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(100% / 12);
  height: 4.85714em;
  background: var(--bg-color);
  text-align: center;
  letter-spacing: -.04em;
  font-weight: bold;
  font-size: calc(12px + var(--slope-1px) * 2);
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-option__head {
    width: 100%;
    height: var(--mobile-row-height-px);
    line-height: 1.25;
  }
}

@media screen and (max-width: 560px) {
  .p-maintenance-schedule-option__head {
    width: 100%;
    line-height: 1.25;
  }
}

.p-maintenance-schedule-option__body {
  width: calc(100% / 12 * 11);
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-option__body {
    display: flex;
    flex-grow: 1;
    justify-content: space-around;
    width: 100%;
    margin: 0;
    padding-top: var(--mobile-row-gap-px);
  }
}

.p-maintenance-schedule-option__timeline {
  position: relative;
  display: flex;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-option__timeline {
    flex-direction: column;
    justify-content: flex-start;
    width: 40%;
    height: 100%;
  }
}

.p-maintenance-schedule-option__timeline:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 5%;
  display: block;
  width: 100%;
  height: 1px;
  margin: auto;
  border-width: 1px 0 0 0;
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-option__timeline:before {
    top: auto;
    left: 0;
    width: 1px;
    height: calc(100% + var(--mobile-row-gap-px));
    margin: 0 auto;
    border-top-width: 0;
    border-top-width: 0;
    border-left-width: 1px;
  }
}

.p-maintenance-schedule-option__timeline._mamoru:before {
  border-style: dashed;
  border-color: #8dc21f;
}

.p-maintenance-schedule-option__timeline._ciao:before {
  border-style: solid;
  border-color: #0068b7;
}

.p-maintenance-schedule-option__timeline > span {
  display: block;
  width: 9.09091%;
  height: 37px;
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-option__timeline > span {
    width: 100%;
    height: var(--mobile-row-height-px);
  }
  .p-maintenance-schedule-option__timeline > span + span {
    margin-top: var(--mobile-row-gap-px);
  }
}

.p-maintenance-schedule-option__timeline > span._on {
  position: relative;
}

.p-maintenance-schedule-option__timeline > span._on:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 1em;
  height: 1em;
  margin: auto;
  border-radius: 50%;
}

@media screen and (max-width: 560px) {
  .p-maintenance-schedule-option__timeline > span._on:before {
    width: 12px;
    height: 12px;
  }
}

.p-maintenance-schedule-option__timeline._mamoru > span:before {
  background: #8dc21f;
}

.p-maintenance-schedule-option__timeline._ciao > span:before {
  background: #0068b7;
}

/* note */
.p-maintenance-schedule-note {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-top: 2em;
  font-size: calc(12px + var(--slope-1px) * 2);
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-note {
    flex-direction: column-reverse;
    width: 100%;
    line-height: 2;
  }
}

.p-maintenance-schedule-note__sub {
  line-height: 2;
}

.p-maintenance-schedule-note__sub li:before {
  content: "\25cf";
}

.p-maintenance-schedule-note__sub li:first-of-type:before {
  color: #8dc21f;
}

.p-maintenance-schedule-note__sub li:nth-of-type(2):before {
  color: #0068b7;
}

.p-maintenance-schedule-note__main {
  text-align: right;
}

@media screen and (max-width: 767px) {
  .p-maintenance-schedule-note__main {
    margin-bottom: 1em;
    text-align: left;
  }
}

/* p-maintenance-menu
=============================== */
.p-maintenance-menu {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 35px;
  padding-top: calc(40px + var(--slope-1px) * 25);
  font-size: calc(13px + var(--slope-1px) * 2);
}

@media screen and (max-width: 767px) {
  .p-maintenance-menu {
    grid-template-columns: repeat(2, 1fr);
    gap: 25px calc(15px + var(--slope-1px) * 10);
  }
}

.p-maintenance-menu__item .c-button {
  max-width: 100%;
}

.p-maintenance-menu__item > p {
  margin-block: calc(1em + var(--leading-trim)) var(--leading-trim);
}

/* p-maintenance-afterservice
=============================== */
.p-maintenance-afterservice {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(265px, 1fr));
  gap: 15px;
  margin-top: calc(15px + var(--slope-1px) * 15);
}

/* ============================================================= *

Inspection

* ============================================================= */
.p-inspection-necessary {
  display: flex;
  justify-content: center;
  margin-top: 2em;
  border-top: 1px solid;
}

.p-inspection-necessary__list {
  display: flex;
  flex-wrap: wrap;
  max-width: 980px;
  margin-top: 1em;
}

.p-inspection-necessary__list > li {
  position: relative;
  width: 32%;
  margin-top: 1.5em;
  padding-left: 1.25em;
  font-weight: bold;
}

.p-inspection-necessary__list > li:nth-child(3n+2) {
  width: 24%;
}

.p-inspection-necessary__list > li:nth-child(3n) {
  width: 44%;
}

@media screen and (max-width: 767px) {
  .p-inspection-necessary__list > li:nth-child(2n+1) {
    width: 40%;
  }
  .p-inspection-necessary__list > li:nth-child(2n) {
    width: 60%;
  }
}

@media screen and (max-width: 560px) {
  .p-inspection-necessary__list > li {
    width: 100% !important;
  }
}

.p-inspection-necessary__list > li:before {
  content: "";
  position: absolute;
  top: .475em;
  left: 0;
  display: block;
  box-sizing: border-box;
  width: .8em;
  height: .8em;
  margin: auto 0;
  border: 1px solid;
  border-radius: 2px;
}

/* ============================================================= *

Ciao

* ============================================================= */
.p-ciao-heading {
  position: relative;
  margin-top: 12.5%;
  margin-bottom: calc(50px + var(--slope-1px) * 30);
  padding-bottom: calc(35px + var(--slope-1px) * 10);
}

@media screen and (max-width: 560px) {
  .p-ciao-heading {
    margin-top: 18.33333%;
  }
}

.p-ciao-heading:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: 0;
  display: block;
  width: calc(var(--vw) * 100);
  height: 100%;
  background: #ecf1f5;
  transform: translateX(-50%);
}

.p-ciao-heading__head {
  position: relative;
  z-index: 1;
  width: 29.16667%;
  margin: 0 auto -5.83333%;
  transform: translateY(-50%);
}

@media screen and (max-width: 560px) {
  .p-ciao-heading__head {
    width: 58.33333%;
    margin: 0 auto -11.66667%;
  }
}

.p-ciao-heading__body {
  position: relative;
  z-index: 1;
  width: 736px;
  margin: calc(35px + var(--slope-1px) * 10) auto 0;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

@media screen and (max-width: 767px) {
  .p-ciao-heading__body {
    width: 100%;
  }
}

.p-ciao-heading-lead {
  margin-block: 1em var(--leading-trim);
  text-align: center;
  font-weight: bold;
  font-size: calc(15px + var(--slope-1px) * 3);
  line-height: 1.6;
}

.p-ciao-heading-lead em {
  padding: 0 .25em;
  color: #0068b7;
}

.p-ciao-heading-merit {
  display: flex;
  justify-content: space-between;
  margin-top: calc(30px + var(--slope-1px) * 20);
}

@media screen and (max-width: 560px) {
  .p-ciao-heading-merit {
    justify-content: space-around;
  }
}

.p-ciao-heading-merit__item {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 560px) {
  .p-ciao-heading-merit__item {
    flex-direction: column;
    text-align: center;
  }
}

.p-ciao-heading-merit__head {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3.33333em;
  height: 3.33333em;
  border-radius: 50%;
  background: #0068b7;
  color: #fff;
  font-weight: bold;
  font-size: calc(20px + var(--slope-1px) * 10);
}

.p-ciao-heading-merit__body {
  padding-left: .5em;
  font-weight: bold;
  line-height: 1.5;
}

@media screen and (max-width: 560px) {
  .p-ciao-heading-merit__body {
    padding-top: .5em;
    padding-left: 0;
  }
}

/* ============================================================= *

Carcare

* ============================================================= */
.p-carcare-contents {
  width: 100%;
  max-width: fit-content;
  margin: 0 auto;
}

.p-carcare-contents > * {
  width: 100%;
  max-width: fit-content;
  margin: 0 auto;
}

.p-carcare-contents a[name] {
  display: block;
  visibility: hidden;
  margin-top: -90px;
  /* headerの高さ分相殺 */
  padding-top: 90px;
  pointer-events: none;
}

@media screen and (max-width: 1366px) {
  .p-carcare-contents a[name] {
    margin-top: calc(-22.70934px - 4.92611vw);
    padding-top: calc(22.70934px + 4.92611vw);
  }
}

@media screen and (max-width: 767px) {
  .p-carcare-contents a[name] {
    margin-top: -70px;
    padding-top: 70px;
  }
}

/* ============================================================= *

htc

* ============================================================= */
.p-htc {
  position: relative;
  left: 50%;
  width: calc(var(--vw) * 100);
  padding: calc(30px + var(--slope-1px) * 10) 0;
  background: #f3f3f3;
  transform: translateX(-50%);
}

.p-htc__head {
  background: url(/htc/bg_htc.gif) bottom center repeat-x;
  background-size: contain;
}

.p-htc__head > p, .p-htc__body > p {
  width: 1200px;
  max-width: 87.84773%;
  margin: 0 auto;
}

/* ============================================================= *

Campaign

* ============================================================= */
.p-campaign-contents .CMN-CMP-car-select__head {
  margin-top: 0;
  padding-top: 0;
}

.p-campaign-contents .CMN-CMP-car-select__item {
  max-width: 32%;
  transition: all .3s ease-out;
}

.p-campaign-contents .CMN-CMP-car-select__item:hover {
  opacity: .7;
}

.p-campaign-contents .CMN-CMP-car-article__title {
  background: var(--base-color);
  color: #fff;
  font-weight: bold;
}

.p-campaign-contents .CMN-CMP-car-article__carIcon img {
  max-width: 50%;
}

.p-campaign-contents .CMN-CMP-body__item a {
  transition: all .3s ease-out;
}

.p-campaign-contents .CMN-CMP-body__item a:hover {
  opacity: .7;
}

/* leaflet
=============================== */
.p-campaign-leaflet-list {
  display: flex;
  justify-content: center;
}

@media screen and (max-width: 560px) {
  .p-campaign-leaflet-list {
    flex-direction: column;
  }
}

.p-campaign-leaflet-list__item {
  padding: 1em;
}

.p-campaign-leaflet-list__item p {
  border: 1px solid;
}

.p-campaign-leaflet-list__item .c-button {
  margin-top: 1em;
  font-size: 1em;
}

/* ============================================================= *

Environment

* ============================================================= */
.p-environment-fig {
  position: relative;
  margin: 0 auto;
  padding: calc(50px + var(--slope-1px) * 50) var(--inner-padding);
  background-color: #fff;
  color: #b28146;
  font-size: calc(13px + var(--slope-1px) * 2);
  line-height: 2;
}

@media screen and (max-width: 560px) {
  .p-environment-fig {
    width: calc(100% + var(--contents-padding));
    margin-inline: calc(var(--contents-padding) * -.5);
  }
}

.p-environment-fig sub {
  display: inline-block;
  font-size: 65%;
}

.p-environment-fig:before, .p-environment-fig:after {
  content: "";
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: 50px;
  background-size: contain;
  background-repeat: repeat-x;
}

.p-environment-fig:before {
  top: 10px;
  background-image: url(/environment/direction/common/img/bgHeaderTop.gif);
  background-position: center top;
}

.p-environment-fig:after {
  bottom: 10px;
  background-image: url(/environment/direction/common/img/bgHeaderBottom.gif);
  background-position: center bottom;
}

.p-environment-fig__head {
  padding: 0 0 1em;
  color: #6eb92b;
  text-align: center;
  font-weight: bold;
  font-size: calc(16px + var(--slope-1px) * 8);
  line-height: 1.8;
}

.p-environment-fig__frame {
  position: relative;
  padding: 1.4em;
  background: #eff7e4;
  font-size: 1.125em;
}

.p-environment-fig__frame em {
  display: block;
  font-size: 1.16667em;
}

.p-environment-fig__body {
  max-width: 55em;
  margin: 0 auto;
  padding: 0;
  background: url(/environment/direction/common/img/character_img01.jpg) left bottom no-repeat;
}

.p-environment-fig__body dl {
  display: table;
  width: 100%;
  margin-bottom: 20px;
}

@media screen and (max-width: 560px) {
  .p-environment-fig__body dl {
    display: block;
  }
}

.p-environment-fig__body dt {
  display: table-cell;
  width: 6em;
  padding-bottom: 5px;
}

.p-environment-fig__body dt:before {
  content: "\25a0";
}

@media screen and (max-width: 560px) {
  .p-environment-fig__body dt {
    display: block;
  }
}

.p-environment-fig__body dd {
  display: table-cell;
  text-align: justify;
  text-justify: auto;
}

@media screen and (max-width: 560px) {
  .p-environment-fig__body dd {
    display: block;
  }
}

.p-environment-fig__body dd p {
  margin-bottom: 8px;
}

.p-environment-fig__body dd ol {
  padding-left: 1.5em;
}

.p-environment-fig__body dd li {
  margin-bottom: 5px;
  list-style: decimal;
  list-style-position: outside;
}

.p-environment-fig__title {
  margin-bottom: 2em;
  background: url(/environment/direction/common/img/bg_policyTitle.gif) center center repeat-x;
  text-align: center;
  font-weight: bold;
  font-size: calc(16px + var(--slope-1px) * 4);
}

@media screen and (max-width: 767) {
  .p-environment-fig__title {
    background-size: auto 3px;
  }
}

.p-environment-fig__title span {
  display: inline-block;
  padding: 0 15px;
  background: #fff;
}

.p-environment-fig__sign {
  padding-bottom: 15px;
  text-align: right;
}

/* ============================================================= *

Welcome

* ============================================================= */
/* heading
=============================== */
.p-welcome-heading {
  position: relative;
  left: 50%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  min-height: calc(368px + var(--slope-1px) * 132);
  padding: 40px var(--inner-padding);
  font-size: calc(16px + var(--slope-1px) * 10);
  transform: translateX(-50%);
}

@media screen and (min-width: 768px) {
  .p-welcome-heading {
    aspect-ratio: 2 / 1;
  }
}

.p-welcome-heading__img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}

.p-welcome-heading__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-welcome-heading__box {
  position: relative;
  z-index: 2;
  color: #fff;
  text-align: center;
  letter-spacing: normal;
}

.p-welcome-heading__title {
  text-shadow: 1px 1px 1em #9a9696;
  font-weight: bold;
  font-size: 1.53846em;
}

.p-welcome-heading__comment {
  margin-top: 4em;
}

.p-welcome-heading__txt {
  margin-top: 1.23077em;
  text-shadow: 1px 1px 1.25em #9a9696;
  word-break: keep-all;
  overflow-wrap: anywhere;
  line-height: 1.8;
}

/* content
=============================== */
.p-welcome-content {
  width: 100%;
  padding-top: calc(50px + var(--slope-1px) * 50);
}

.p-welcome-content__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 1200px;
  max-width: 87.84773%;
  margin: 0 auto;
}

.p-welcome-content__item {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  width: 31%;
}

@media screen and (max-width: 767px) {
  .p-welcome-content__item {
    flex-direction: row;
    width: 100%;
    margin: 0 auto;
  }
  .p-welcome-content__item + .p-welcome-content__item {
    margin-top: 5em;
  }
}

@media screen and (max-width: 560px) {
  .p-welcome-content__item {
    width: 94%;
  }
}

.p-welcome-content__img {
  width: 100%;
  min-height: 0%;
}

@media screen and (max-width: 767px) {
  .p-welcome-content__img {
    width: 50%;
    padding-right: 5%;
  }
}

@media screen and (max-width: 560px) {
  .p-welcome-content__img {
    width: 100%;
    padding-right: 0;
  }
}

.p-welcome-content__text {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .p-welcome-content__text {
    width: 50%;
    margin-top: 0;
  }
}

@media screen and (max-width: 560px) {
  .p-welcome-content__text {
    width: 100%;
    margin-top: 20px;
  }
}

.p-welcome-content__head {
  margin-bottom: auto;
}

.p-welcome-content__title {
  margin-bottom: .83333em;
  padding-bottom: 1.11111em;
  border-bottom: 1px solid var(--border-color);
  color: var(--key-color);
  text-align: center;
  letter-spacing: normal;
  font-weight: bold;
  font-size: calc(16px + var(--slope-1px) * 2);
}

.p-welcome-content__btn {
  margin-top: 1.625em;
  font-size: .875em;
}

@media screen and (max-width: 560px) {
  .p-welcome-content__btn {
    font-size: 1em;
  }
}

.p-welcome-content__btn > .c-button + .c-button {
  margin-top: .5em;
}

/* ============================================================= *

Terms of use

* ============================================================= */
/* block
=============================== */
.p-terms-block {
  font-size: .9375em;
}

.p-terms-block + .p-terms-block {
  margin-top: 5rem;
  padding-top: 4.5rem;
  background: linear-gradient(to right, var(--border-color) 0px, var(--border-color) 2px, transparent 2px, transparent 4px) left top/4px 1px repeat-x;
}

.p-terms-block__head {
  margin-bottom: 4rem;
}

/* text
=============================== */
.p-terms-text {
  /* -0.5em for line-height offset */
  margin-top: -.5em;
  margin-bottom: -.5em;
  line-height: 2;
}

/* plugin
=============================== */
.p-terms-plugin {
  margin-top: 1.46667em;
  border: 1px solid var(--border-color);
}

.p-terms-plugin__link {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2.33333em;
  text-decoration: none;
  transition: all .3s ease-out;
}

.p-terms-plugin__link:hover {
  opacity: .7;
}

@media screen and (max-width: 560px) {
  .p-terms-plugin__link {
    flex-direction: column;
  }
}

.p-terms-plugin__logo {
  margin: 0 1em 0 0;
}

@media screen and (max-width: 560px) {
  .p-terms-plugin__logo {
    margin: 0 0 1em 0;
  }
}

/* ssl
=============================== */
.p-terms-ssl {
  margin-top: 3.21429em;
  font-size: .93333em;
}

.p-terms-ssl__head {
  font-weight: bold;
}

.p-terms-ssl__block:not(:first-child) {
  margin-top: 1.78571em;
}

.p-terms-ssl__item {
  /* -0.375em for line-height offset */
  margin-top: 1.625em;
  margin-bottom: -.375em;
  padding-left: 1em;
}

.p-terms-ssl__item > p {
  position: relative;
  margin-bottom: .5em;
}

.p-terms-ssl__item > p:before {
  content: "\30fb";
  position: absolute;
  top: 0;
  left: -1em;
}

.p-terms-ssl__item > ul > li a {
  position: relative;
  display: inline-block;
  padding-left: 1em;
}

.p-terms-ssl__item > ul > li a:before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
}

.p-terms-ssl__foot {
  margin-top: 2.28571em;
}

/* ============================================================= *

Privacy Policy

* ============================================================= */
/* lead
=============================== */
.p-privacy-lead {
  /* -0.5em for line-height offset */
  margin-top: -.5em;
  margin-bottom: -.5em;
  line-height: 2;
}

/* main
=============================== */
.p-privacy-main {
  counter-reset: privacy-main;
  word-break: break-all;
}

.p-privacy-main__item {
  counter-increment: privacy-main;
  position: relative;
  padding-left: 1.78571em;
}

.p-privacy-main__item + .p-privacy-main__item {
  /* -0.375em for line-height offset */
  margin-top: 2.91071em;
  margin-bottom: -.375em;
}

.p-privacy-main__title {
  font-weight: bold;
}

.p-privacy-main__title:before {
  content: counter(privacy-main) ".";
  position: absolute;
  top: 0;
  left: 0;
}

/* sub
=============================== */
.p-privacy-sub {
  counter-reset: privacy-sub;
  margin-top: 1em;
}

.p-privacy-sub__item {
  counter-increment: privacy-sub;
  position: relative;
  margin-left: 2.5em;
}

.p-privacy-sub__item + .p-privacy-sub__item {
  margin-top: .25em;
}

.p-privacy-sub__item:first-child:last-child {
  margin-left: 0;
}

.p-privacy-sub__item:first-child:last-child:before {
  content: none;
}

.p-privacy-sub__item:before {
  content: counter(privacy-sub, lower-roman) ".";
  position: absolute;
  top: 0;
  left: -2.5em;
  width: 1.42857em;
  text-align: right;
}

/* detail
=============================== */
.p-privacy-detail {
  margin: .35em 0 .75em 1em;
  font-size: .92857em;
}

.p-privacy-detail__head:before {
  content: "\25cf";
}

/* sign
=============================== */
.p-privacy-sign {
  margin-top: 6rem;
  text-align: right;
}

/* banner
=============================== */
.p-privacy-banner {
  display: flex;
  justify-content: center;
  margin-top: 6rem;
}

.p-privacy-banner a {
  transition: all .3s ease-out;
}

.p-privacy-banner a:hover {
  opacity: .7;
}

/* ============================================================= *

Information

* ============================================================= */
/* .p-information-contents .blog__paging {
  display: none;
}
 */