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

Custom Properties

* ============================================================= */
:root {
  /* utility */
  --vw: 1vw;
  --vh: 1vh;
  --slope-1px: clamp(0px, -.95663px + .2551vw, 1px);
  --leading-trim: calc((1em - 1lh) / 2);
  --vh-initial: 1vh;
  /* color */
  --base-color: #000;
  --sub-text-color: #7d7d7c;
  --key-color: #dcccb1;
  --point-color: #404040;
  --bg-color: #f4f1e8;
  --bg-color-dark: #1c262e;
  --border-color: #d8d3c6;
  --border-color-dark: #7a7a72;
  /* layouts */
  --header-height: 119px;
  --sticky-height: 0px;
  --inner-width: 1200;
  --inner-width-px: calc(var(--inner-width) * 1px);
  --inner-padding: calc(26px + var(--slope-1px) * 14);
  --inner-overflow: calc(var(--vw) * 50 - var(--inner-width-px) * .5);
  --base-border-radius: 5px;
  /* text */
  --line-height: 1.7;
  --line-space: (var(--line-height) - 1)/2;
  /* font size */
  --base-font-size: 16;
  /* font family */
  --base-font-family: Roboto, "Noto Sans JP", sans-serif;
  --en-font-family: "Cormorant Garamond", serif;
  --point-font-family: "Shippori Mincho B1", serif;
  /* svg icon */
  --icon-angle: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M5.33351 2.53182C5.24789 2.61799 5.19995 2.73366 5.19995 2.85411C5.19995 2.97455 5.24789 3.09022 5.33351 3.17639L10.1172 8.00002L5.33351 12.8227C5.24789 12.9089 5.19995 13.0245 5.19995 13.145C5.19995 13.2654 5.24789 13.3811 5.33351 13.4673C5.37513 13.5093 5.42489 13.5427 5.47986 13.5655C5.53482 13.5883 5.59388 13.6 5.65354 13.6C5.7132 13.6 5.77225 13.5883 5.82722 13.5655C5.88218 13.5427 5.93194 13.5093 5.97356 13.4673L11.0606 8.33678C11.1499 8.24668 11.2 8.12584 11.2 8.00002C11.2 7.87421 11.1499 7.75337 11.0606 7.66327L5.97356 2.53279C5.93194 2.49077 5.88218 2.45738 5.82722 2.43457C5.77225 2.41177 5.7132 2.40002 5.65354 2.40002C5.59388 2.40002 5.53482 2.41177 5.47986 2.43457C5.42489 2.45738 5.37513 2.49077 5.33351 2.53279V2.53182Z" fill="black"/></svg>');
  --icon-arrow-up: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 20 20"><path fill="%23fff" fill-rule="evenodd" d="M9.67 3.1367a.4667.4667 0 0 1 .66 0L16.8633 9.67a.4666.4666 0 1 1-.6599.66l-5.7367-5.7367v11.94a.4667.4667 0 0 1-.9334 0v-11.94L3.7966 10.33a.4668.4668 0 0 1-.66-.66L9.67 3.1367Z" clip-rule="evenodd"/></svg>');
  --icon-arrow-down: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="%23000" d="M13.668 5.1336A.4572.4572 0 0 0 13.3457 5a.4574.4574 0 0 0-.3223.1336L8.1998 9.9173 3.3771 5.1336A.4572.4572 0 0 0 3.055 5a.4572.4572 0 0 0-.4205.28.4534.4534 0 0 0 0 .3473.4472.4472 0 0 0 .0982.1463l5.1304 5.0871A.4783.4783 0 0 0 8.1998 11c.1258 0 .2467-.05.3368-.1393l5.1304-5.087a.446.446 0 0 0 .0983-.1464.4534.4534 0 0 0 0-.3474.446.446 0 0 0-.0983-.1463h.001Z"/></svg>');
  --icon-arrow-down-white: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 16"><path fill="%23fff" d="M13.668 5.1336A.4572.4572 0 0 0 13.3457 5a.4574.4574 0 0 0-.3223.1336L8.1998 9.9173 3.3771 5.1336A.4572.4572 0 0 0 3.055 5a.4572.4572 0 0 0-.4205.28.4534.4534 0 0 0 0 .3473.4472.4472 0 0 0 .0982.1463l5.1304 5.0871A.4783.4783 0 0 0 8.1998 11c.1258 0 .2467-.05.3368-.1393l5.1304-5.087a.446.446 0 0 0 .0983-.1464.4534.4534 0 0 0 0-.3474.446.446 0 0 0-.0983-.1463h.001Z"/></svg>');
  --icon-blank: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 15 14"><path fill="%23000" fill-rule="evenodd" d="M3.5835 3.7a.45.45 0 0 1 0-.9h7.5a.45.45 0 0 1 .45.45v7.5a.45.45 0 1 1-.9 0V4.3365l-6.7318 6.7317a.4499.4499 0 0 1-.6363 0 .4499.4499 0 0 1 0-.6363L9.997 3.7H3.5835Z" clip-rule="evenodd"/></svg>');
  --icon-plus: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 22 22"><path fill="%23d9d9c9" fill-rule="evenodd" d="M11 3.3a.6079.6079 0 0 1 .6079.6079v6.4842h6.4843a.6079.6079 0 0 1 0 1.2158h-6.4843v6.4842a.6079.6079 0 1 1-1.2157 0v-6.4842H3.9079a.608.608 0 0 1 0-1.2158h6.4843V3.9079A.6078.6078 0 0 1 11 3.2999Z" clip-rule="evenodd"/></svg>');
  --icon-minus: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 22 22"><path fill="%23d9d9c9" fill-rule="evenodd" d="M3.3 11c0-.3037.2722-.55.608-.55h14.1842c.3357 0 .6078.2463.6078.55 0 .3038-.2721.55-.6078.55H3.9079c-.3357 0-.6079-.2462-.6079-.55Z" clip-rule="evenodd"/></svg>');
  --icon-close: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 28 28"><path fill="%23fff" d="M.7748.7748c-1.033 1.0331-1.033 2.708 0 3.7412l9.4841 9.4839-9.484 9.4842c-1.0332 1.0331-1.0332 2.7081 0 3.7411 1.033 1.0331 2.708 1.0331 3.741 0L14 17.741l9.4842 9.4842c1.0331 1.0331 2.7081 1.0331 3.7411 0 1.0331-1.033 1.0331-2.708 0-3.7411l-9.4842-9.4842 9.4842-9.484c1.0331-1.033 1.0331-2.708 0-3.741-1.0332-1.0331-2.708-1.0331-3.7411 0L14 10.2589 4.5159.7748c-1.033-1.033-2.708-1.033-3.741 0Z"/></svg>');
}

@media screen and (max-width: 767px) {
  :root {
    --header-height: 77px;
    --sticky-height: 62px;
  }
}

:root body[data-id=index] {
  --header-height: 128px;
}

@media screen and (max-width: 767px) {
  :root body[data-id=index] {
    --header-height: 77px;
  }
}

@media screen and (max-width: 1280px) {
  :root {
    --inner-overflow: var(--inner-padding);
  }
}

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

Base

* ============================================================= */
*,
*:before,
*:after {
  box-sizing: border-box;
}

html {
  height: 100%;
  margin: 0;
  padding: 0;
  font-size: 62.5%;
}

body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  background: var(--bg-color);
  color: var(--base-color);
  letter-spacing: .03em;
  font-weight: 350;
  font-size: calc(14px + var(--slope-1px) * 2);
  font-family: var(--base-font-family);
  line-height: var(--line-height);
  -webkit-text-size-adjust: 100%;
}

img {
  display: block;
  height: auto;
  max-width: 100%;
}

svg {
  display: block;
  width: 100%;
}

svg path:not([fill]) {
  fill: currentColor;
}

a {
  color: currentColor;
  text-decoration: underline;
}

a:hover {
  text-decoration: none;
}

@media screen and (min-width: 768px) {
  a[href^="tel:"] {
    text-decoration: none !important;
    cursor: text;
    pointer-events: none;
  }
}

button {
  cursor: pointer;
}

sup {
  vertical-align: super;
  font-size: 70%;
}

sub {
  vertical-align: sub;
  font-size: 70%;
}

*[data-toggle-id] {
  display: none;
}

*[data-intersection][data-intersection-fade] {
  opacity: 0;
  transition: all .5s ease-out .2s;
}

*[data-intersection][data-intersection-fade][data-intersecting=true] {
  opacity: 1;
  transition: all .5s ease-out .2s;
}

*[data-intersection][data-intersection-fadeup] {
  opacity: 0;
  transition: all .5s ease-out .2s;

  translate: 0px 20px;
}

*[data-intersection][data-intersection-fadeup][data-intersecting=true] {
  opacity: 1;
  transition: all .5s ease-out .2s;

  translate: 0px 0px;
}

*[data-intersection][data-intersection-scale] {
  opacity: 0;
  transition: all .5s ease-out .2s;
  transform: scale(.9);
}

*[data-intersection][data-intersection-scale][data-intersecting=true] {
  opacity: 1;
  transition: all .5s ease-out .2s;
  transform: scale(1);
}

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

Wrapper

* ============================================================= */
.l-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
  margin: 0 auto;
  box-shadow: 0 0 40px 40px rgba(204, 0, 0, .15);
}

@media screen and (max-width: 767px) {
  .l-wrapper {
    min-width: 0;
  }
}

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

Header

* ============================================================= */
/* l-header
============================== */
.l-header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100%;
  height: var(--header-height);
}

@media screen and (min-width: 768px) {
  body[data-id=index] .l-header {
    --inner-padding: calc(26px + var(--slope-1px) * 30);
  }
}

.l-header__inner {
  display: flex;
  align-items: center;
  gap: 2em;
  width: 100%;
  height: 100%;
  padding-right: calc(var(--inner-padding) + 44px + var(--slope-1px) * 4);
}

/* l-header-logo
============================== */
.l-header-logo {
  align-self: stretch;
  width: calc(275px + var(--slope-1px) * 88);
  max-width: 73.33333%;
  margin-right: auto;
}

@media screen and (max-width: 767px) {
  .l-header-logo {
    max-width: none;
  }
}

body[data-id=index] .l-header-logo {
  background: var(--bg-color);
  opacity: 0;
  transition: opacity .6s ease-out 3s, transform .6s ease-out 3s;
  transform: translateY(-20px);
}

body[data-id=index].is-loaded .l-header-logo {
  opacity: 1;
  transform: translateY(0);
}

.l-header-logo a {
  display: flex;
  align-items: center;
  height: 100%;
  padding-inline: var(--inner-padding);
  transition: all .3s ease-out;
}

.l-header-logo a img {
  transition: opacity .3s;
}

.l-header-logo a:hover img {
  opacity: .7;
}

/* l-header-menu
============================== */
body[data-id=index] .l-header-menu {
  display: none;
}

@media screen and (max-width: 1300px) {
  .l-header-menu {
    display: none;
  }
}

.l-header-menu__list {
  display: flex;
  margin-right: 56px;
}

.l-header-menu__handle {
  display: flex;
  align-items: center;
  height: var(--header-height);
  padding-inline: .94444em;
  text-decoration: none;
  font-weight: 500;
  font-size: clamp(17px, -2.69697px + 1.51515vw, 18px);
  font-family: var(--point-font-family);
}

.l-header-menu__drawer {
  display: none;
}

/* l-header-toggle
============================== */
.l-header-toggle {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1;
  z-index: 10;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
  width: calc(44px + var(--slope-1px) * 4);
  height: var(--header-height);
  margin-right: var(--inner-padding);
  outline: none;
  border: 0;
  border-radius: 0;
  background: none;
  color: var(--base-color);
  font-size: inherit;
  transition: all .3s ease-out;
  appearance: none;
}

body[data-id=index] .l-header-toggle {
  opacity: 0;
  transition: opacity .6s ease-out 3s, transform .6s ease-out 3s;
  transform: translateY(-20px);
}

body[data-id=index].is-loaded .l-header-toggle {
  opacity: 1;
  transform: translateY(0);
}

.l-header-toggle > span {
  display: block;
  width: 100%;
  height: 1px;
  background: currentColor;
  transition: opacity .2s;
}

.l-header-toggle:before, .l-header-toggle:after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: currentColor;
  transition: translate .2s .2s, transform .2s;
  transform-origin: 50% 50%;
}

body.is-toggle-menu-open .l-header-toggle:before, body.is-toggle-menu-open .l-header-toggle:after {
  transition: translate .2s, transform .2s .2s;
}

body.is-toggle-menu-open .l-header-toggle > span {
  opacity: 0;
}

body.is-toggle-menu-open .l-header-toggle:before {
  transform: rotate(15deg);

  translate: 0 7px;
}

body.is-toggle-menu-open .l-header-toggle:after {
  transform: rotate(-15deg);

  translate: 0 -7px;
}

/* l-header-toggle-menu
============================== */
.l-header-toggle-menu {
  position: fixed;
  inset: 0;
  visibility: hidden;
  width: 100%;
  height: 100%;
  background: #fff;
  opacity: 0;
  transition: all .3s ease-out;
  pointer-events: none;
}

body.is-toggle-menu-open .l-header-toggle-menu {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.l-header-toggle-menu__inner {
  display: grid;
  grid-template-columns: 100%;
  gap: 64px;
  overflow-y: auto;
  width: 100%;
  max-height: 100%;
  padding: var(--header-height) var(--inner-padding) var(--inner-padding);
}

@media screen and (max-width: 767px) {
  .l-header-toggle-menu__inner {
    gap: 32px;
  }
}

.l-header-toggle-menu__body {
  width: 1200px;
  max-width: 100%;
  margin-inline: auto;
  border-top: 1px solid var(--border-color-dark);
}

@media screen and (min-width: 768px) {
  .l-header-toggle-menu__body {
    border-top: 0;
  }
  .l-header-toggle-menu__body .c-sitemap-box__head {
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-color);
  }
  .l-header-toggle-menu__body .c-sitemap-box__body {
    padding-left: 0;
  }
}

.l-header-toggle-menu__foot {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 36px 16px;
  width: 1200px;
  max-width: 100%;
  margin-inline: auto;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .l-header-toggle-menu__foot {
    grid-template-columns: 100%;
    gap: 24px 0;
  }
}

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

Main

* ============================================================= */
/* main
=============================== */
.l-main {
  position: relative;
  flex-grow: 1;
  overflow: hidden;
  width: 100%;
  max-height: 100%;
  padding: 0;
  padding-top: var(--header-height);
}

body[data-id=index] .l-main {
  overflow: unset;
  padding-top: 0;
}

.l-main__breadcrumbs {
  padding-inline: var(--inner-padding);
}

.l-main__head {
  position: relative;
  display: flex;
  align-items: center;
  gap: 26px;
  width: 100%;
  max-width: calc(var(--inner-width-px) + var(--inner-padding) * 2);
  margin-inline: auto;
  padding: calc(26px + var(--slope-1px) * 22) var(--inner-padding);
}

.l-main__head:has(.c-showroom-head-info) {
  flex-wrap: wrap;
}

.l-main__head:has(.c-page-title:not([data-en])) {
  margin-bottom: calc(32px + var(--slope-1px) * 8);
  padding-top: calc(32px + var(--slope-1px) * 16);
  padding-bottom: 0;
}

@media screen and (max-width: 767px) {
  .l-main__head {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media screen and (max-width: 960px) {
  .l-main__head:has(.c-sr-head-info) {
    flex-direction: column;
    align-items: stretch;
  }
}

.l-main__head-sub {
  flex-shrink: 0;
}

.l-main__body {
  width: 100%;
  max-width: calc(var(--inner-width-px) + var(--inner-padding) * 2);
  margin-inline: auto;
  padding-inline: var(--inner-padding);
}

.l-main__breadcrumbs + .l-main__body {
  margin-top: calc(36px + var(--slope-1px) * 36);
}

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

Footer

* ============================================================= */
/* l-footer
============================== */
.l-footer {
  padding: 40px var(--inner-padding) 48px;
  background: #1c262e;
  color: #fff;
}

@media screen and (max-width: 767px) {
  .l-footer {
    padding-block: 32px;
  }
}

.l-footer__inner {
  width: var(--inner-width-px);
  max-width: 100%;
  margin-inline: auto;
}

/* l-footer-pagetop
============================== */
.l-footer-pagetop__link {
  display: block;
  width: 20px;
  height: 20px;
  margin-left: auto;
  background: currentColor;
  mask: var(--icon-arrow-up) 50% 50%/contain no-repeat;
  font-size: 0;
  transition: all .2s ease-out;
}

.l-footer-pagetop__link:hover {
  translate: 0px -3px;
}

/* l-footer-sitemap
============================== */
.l-footer-sitemap {
  margin-top: 16px;
  border-top: 1px solid var(--border-color-dark);
}

@media screen and (min-width: 768px) {
  .l-footer-sitemap {
    padding-top: 72px;
  }
}

/* l-footer-info
============================== */
.l-footer-info {
  margin-block: var(--leading-trim);
  margin-top: 88px;
  text-align: right;
  font-size: calc(12px + var(--slope-1px) * 1);
  line-height: 2;
}

@media screen and (max-width: 767px) {
  .l-footer-info {
    margin-top: 48px;
    text-align: center;
  }
}

.l-footer-info__profile > span {
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .l-footer-info__profile > span {
    display: block;
  }
}

.l-footer-info__profile > span:not(:first-child)::before {
  content: "\FF0F";
}

@media screen and (max-width: 767px) {
  .l-footer-info__profile > span:not(:first-child)::before {
    content: none;
  }
}

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

Sticky

* ============================================================= */
/* l-sticky
============================== */
.l-sticky {
  position: fixed;
  right: 0;
  bottom: 50%;
  z-index: 1000;
  transform: translateY(50%);
}

@media screen and (max-width: 767px) {
  .l-sticky {
    position: sticky;
    bottom: 0;
    width: 100%;
    opacity: 0;
    transition: all .4s ease-out;
    transform: none;
    transform: translateY(50%);
    pointer-events: none;
  }
  body.is-sticky .l-sticky {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
  }
}

/* l-sticky-nav
============================== */
.l-sticky-nav {
  display: grid;
  grid-template-columns: repeat(var(--length), auto);
  gap: 8px;
  writing-mode: vertical-lr;

  --length: 3;
}

.l-sticky-nav:has(.l-sticky-nav__item:nth-child(4)) {
  --length: 4;
}

@media screen and (max-width: 767px) {
  .l-sticky-nav {
    grid-template-columns: repeat(var(--length), 1fr);
    gap: 1px;
    border-top: 1px solid var(--border-color-dark);
    background: var(--border-color-dark);
    writing-mode: horizontal-tb;
  }
}

/* l-sticky-button
============================== */
.l-sticky-button {
  display: grid;
  align-items: center;
  grid-template-rows: 100%;
  grid-template-columns: 22px auto;
  gap: 8px;
  justify-items: center;
  block-size: 62px;
  padding: 12px 14px 18px;
  background: var(--base-color);
  color: #fff;
  text-decoration: none;
  letter-spacing: .3em;
  font-weight: 600;
  font-size: 16px;
  font-family: var(--point-font-family);
  line-height: 1;
  transition: all .2s;
}

@media screen and (max-width: 767px) {
  .l-sticky-button {
    grid-template-rows: 20px auto;
    grid-template-columns: 100%;
    block-size: calc(var(--sticky-height) - 1px);
    padding: 10px 10px 14px;
    letter-spacing: 0;
    font-size: 14px;
  }
}

.l-sticky-button._primary {
  background: #ad8b52;
}

.l-sticky-button:hover {
  opacity: .7;
}

.l-sticky-button > i svg path {
  fill: currentColor;
}

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

Modal

* ============================================================= */
/* l-modal
=============================== */
.l-modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100005;
  display: none;
  visibility: hidden;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: calc(var(--vh) * 5) var(--inner-padding);
  background: rgba(51, 51, 51, .9);
  opacity: 0;
  pointer-events: none;
}

.l-modal.is-show {
  display: flex;
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.l-modal__inner {
  position: relative;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  max-width: 1040px;
  max-height: fit-content;
  margin: auto;
  opacity: 0;
  transition: all .6s .6s;
}

.l-modal.is-show .l-modal__inner {
  opacity: 1;
}

.l-modal__bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  font-size: 0;
  opacity: 0;
}

.l-modal__contents {
  position: relative;
  z-index: 1;
  overflow-y: auto;
  width: 100%;
  max-height: calc(var(--vh) * 90);
  padding: calc(25px + var(--slope-1px) * 15) calc(20px + var(--slope-1px) * 20) calc(30px + var(--slope-1px) * 18);
  background: #fff;
}

.l-modal__close {
  position: absolute;
  top: 2px;
  right: 2px;
  z-index: 4;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 44px;
  height: 44px;
  outline: none;
  border: 0;
  border-radius: 0;
  background: transparent;
  background: var(--icon-close) 50% 50%/40% 40% no-repeat var(--base-color);
  color: #fff;
  line-height: 1;
  transition: all .3s ease-out;
  appearance: none;
}

.l-modal__close:hover {
  opacity: .7;
}

.l-modal__close span {
  display: none;
}

/* l-modal-select
=============================== */
.l-modal-select__head:before {
  content: "";
  flex-shrink: 0;
  width: calc(10px + var(--slope-1px) * 2);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: var(--key-light-color);
}

.l-modal-select__body {
  padding-top: 1.83333em;
}

.l-modal-select__lead {
  padding-bottom: 1.83333em;
  font-size: 15px;
  line-height: 1.6;
}

.l-modal-select__lead em {
  color: var(--key-text-color);
  font-weight: 700;
}

.l-modal-select__nav {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));
  gap: calc(10px + var(--slope-1px) * 10);
}

.l-modal-select__nav .c-cars-nav {
  border: 1px solid var(--border-color);
}

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

Block

* ============================================================= */
/* c-youtube-block
============================== */
.c-youtube-block {
  width: 980px;
  max-width: 100%;
  aspect-ratio: 560 / 315;
  margin-inline: auto;
}

.c-youtube-block iframe {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

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

Grid

* ============================================================= */
/* tile
=============================== */
.c-tile-grid {
  display: flex;
  flex-wrap: wrap;
}

.c-tile-grid__item {
  width: 50%;
}

@media screen and (max-width: 767px) {
  .c-tile-grid[data-col-tablet="1"] .c-tile-grid__item {
    width: 100%;
  }
}

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

Navigation

* ============================================================= */
/* c-breadcrumbs
=============================== */
.c-breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px calc(5px + var(--slope-1px) * 2);
  padding-block: calc(10px + var(--slope-1px) * 2);
  font-weight: 350;
  font-size: calc(12px + var(--slope-1px) * 1);

  border-block: 1px solid var(--border-color);
}

.c-breadcrumbs > li {
  display: flex;
  align-items: center;
  gap: calc(5px + var(--slope-1px) * 2);
  margin-block: var(--leading-trim);
}

.c-breadcrumbs > li + li:before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  background: currentColor;
  mask: url(../img/icon/bread-arrow.svg) 50% 50%/contain no-repeat;
}

.c-breadcrumbs > li a {
  text-decoration: underline;
}

.c-breadcrumbs > li a:hover {
  text-decoration: none;
}

/* c-button
============================== */
.c-button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(2px + var(--slope-1px) * 6);
  width: 100%;
  padding: 16px 8px;
  border: 0;
  border-radius: 0;
  background: var(--base-color);
  color: #fff;
  text-decoration: none;
  font-size: calc(15px + var(--slope-1px) * 3);
  transition: opacity .2s;
}

.c-button:not(._center) {
  padding-inline: 12px;
  font-size: calc(18px + var(--slope-1px) * 2);
}

.c-button:hover {
  opacity: .8;
}

.c-button._text-center {
  position: relative;
  padding-inline: calc(20px + var(--slope-1px) * 13);
}

.c-button._text-center:after {
  position: absolute;
  top: 0;
  right: 8px;
  bottom: 0;
  margin-block: auto;
}

.c-button > i {
  display: block;
  flex-shrink: 0;
  gap: calc(2px + var(--slope-1px) * 2);
  width: calc(20px + var(--slope-1px) * 4);
  aspect-ratio: 1 / 1;
}

.c-button:not(._center) > i {
  width: calc(25px + var(--slope-1px) * 5);
}

.c-button > i svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.c-button > i svg path {
  fill: currentColor;
}

.c-button[href] {
  --icon: var(--icon-angle);
}

.c-button[href^="tel:"], .c-button[target="_blank"] {
  --icon: var(--icon-blank);
}

.c-button.js-scroll {
  --icon: var(--icon-angle);
}

.c-button[href]:after {
  content: "";
  z-index: 0;
  display: block;
  flex-shrink: 0;
  width: calc(14px + var(--slope-1px) * 3);
  aspect-ratio: 1 / 1;
  margin-left: calc(5px + var(--slope-1px) * 3);
  background: #fff;
  background: currentColor;
  mask: var(--icon) 50% 50%/contain no-repeat;
}

.c-button.js-scroll:after {
  rotate: 90deg;
}

.c-button:not(._center):after {
  margin-left: auto;
}

/* c-category-nav
============================== */
.c-category-nav-section {
  position: relative;
  padding-block: calc(25px + var(--slope-1px) * 15);
}

.c-category-nav-section:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  display: block;
  width: var(--width);
  height: 100%;
  background: var(--bg-color);
  transform: translateX(-50%);

  --width: calc(var(--vw) * 100);
}

@media screen and (max-width: 767px) {
  .c-category-nav-section:before {
    --width: calc(100% + var(--inner-padding) * 2);
  }
}

.c-category-nav-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: calc(15px + var(--slope-1px) * 15) calc(10px + var(--slope-1px) * 20);
}

@media screen and (max-width: 767px) {
  .c-category-nav-grid {
    grid-template-columns: repeat(auto-fill, minmax(265px, 1fr));
  }
}

/* c-banner
============================== */
.c-banner {
  display: block;
  transition: all .2s ease-out;
}

.c-banner:hover {
  opacity: .7;
}

/* c-border-nav
============================== */
.c-border-nav {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 32px;
  max-width: 100%;
  margin-top: var(--leading-trim);
  padding-bottom: calc(15px + var(--leading-trim));
  color: currentColor;
  text-align: left;
  text-decoration: none;
  font-size: calc(15px + var(--slope-1px) * 3);
  line-height: 1.4;
}

@media screen and (max-width: 767px) {
  .c-border-nav {
    gap: calc(13px + var(--slope-1px) * 2);
  }
}

.c-border-nav._small {
  gap: 10px;
  padding-bottom: 12px;
  font-size: calc(14px + var(--slope-1px) * 1);
}

.c-border-nav:after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-left: auto;
  background: currentColor;
  mask: var(--icon-angle) 50% 50%/contain no-repeat;
}

a[target="_blank"] .c-border-nav:after, .c-border-nav[target="_blank"]:after {
  mask-image: var(--icon-blank);
}

.c-border-nav:before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
  width: 100%;
  height: 1px;
  background: var(--key-color);
  background: currentColor;
  transition: all .2s ease-out;
  transform-origin: right bottom;
}

a:hover .c-border-nav:before, .c-border-nav:hover:before {
  transform: scaleX(0);
}

@media screen and (min-width: 768px) {
  .c-button-container .c-border-nav {
    min-width: 200px;
  }
}

/* c-anchor-nav-grid
============================== */
.c-anchor-nav-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 14px;
}

.c-anchor-nav-grid:not(:first-child) {
  margin-top: calc(40px + var(--slope-1px) * 8);
}

.c-anchor-nav-grid:not(:last-child) {
  margin-bottom: calc(40px + var(--slope-1px) * 8);
}

@media screen and (max-width: 767px) {
  .c-anchor-nav-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (max-width: 560px) {
  .c-anchor-nav-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* c-anchor-nav
============================== */
.c-anchor-nav {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 32px;
  max-width: 100%;
  margin-top: var(--leading-trim);
  padding-bottom: calc(10px + var(--leading-trim));
  color: currentColor;
  text-decoration: none;
  font-size: calc(13px + var(--slope-1px) * 1);
  line-height: 1.7;
}

@media screen and (max-width: 560px) {
  .c-anchor-nav {
    gap: 6px;
  }
}

.c-anchor-nav:after {
  content: "";
  flex-shrink: 0;
  width: 13px;
  height: 13px;
  margin-left: auto;
  background: currentColor;
  mask: var(--icon-angle) 50% 50%/contain no-repeat;

  rotate: 90deg;
}

.c-anchor-nav:before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
  width: 100%;
  height: 1px;
  background: var(--key-color);
  background: currentColor;
  transition: all .2s ease-out;
  transform-origin: right bottom;
}

@media (any-hover: hover) {
  .c-anchor-nav:hover:before {
    transform: scaleX(0);
  }
}

.c-anchor-nav span {
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.c-button-container .c-anchor-nav {
  min-width: 200px;
}

/* c-button-container
============================== */
.c-button-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px calc(17px + var(--slope-1px) * 3);
  width: 100%;
  margin-top: calc(40px + var(--slope-1px) * 40);
}

.c-button-container._closer {
  margin-top: calc(30px + var(--slope-1px) * 10);
}

.c-button-container:first-child {
  margin-top: 0;
}

@media screen and (max-width: 560px) {
  .c-button-container:has(.c-border-nav) {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
  }
}

.c-button-container._flexible .c-button {
  max-width: fit-content;
  padding: 0 1.5em;
}

/* banner
=============================== */
.c-banner {
  display: block;
  overflow: hidden;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  transition: opacity .2s;
}

.c-banner:hover {
  opacity: .7;
}

/* detailed banner
=============================== */
.c-detailed-banner {
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
  width: 100%;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  background: #fff;
  text-decoration: none;
  transition: opacity .2s;
}

.c-detailed-banner:hover {
  opacity: .7;
}

.c-detailed-banner__image {
  width: 50%;
}

.c-detailed-banner__image img {
  width: 100%;
}

@media screen and (max-width: 767px) {
  .c-detailed-banner__image {
    order: -1;
    width: 100%;
  }
}

.c-detailed-banner__text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 50%;
  padding: 2.54237% 3.38983%;
  font-size: calc(12px + var(--slope-1px) * 3);
}

@media screen and (max-width: 767px) {
  .c-detailed-banner__text {
    width: 100%;
    padding: 2.66667em;
  }
}

.c-detailed-banner__head {
  margin-block: var(--leading-trim);
  text-decoration: underline;
  font-weight: bold;
  font-size: calc(18px + var(--slope-1px) * 3);
}

.c-detailed-banner__body {
  margin-block: 1.5em var(--leading-trim);
}

/* tab
=============================== */
.c-tab {
  margin-bottom: 72px;
  padding-inline: 20px;
  border-bottom: 1px solid;

  --col: 2;
}

.c-tab._x3 {
  --col: 3;
}

.c-tab:not(:first-child) {
  margin-top: calc(32px + var(--slope-1px) * 8);
}

@media screen and (max-width: 767px) {
  .c-tab {
    margin-bottom: 26px;
  }
}

.c-tab__list {
  display: grid;
  grid-template-columns: repeat(var(--col), calc((100% - var(--gap) * (var(--col) - 1)) / var(--col)));
  gap: var(--gap);
  width: calc(100% + var(--gap) * 2);
  margin-inline: calc(var(--gap) * -1);

  --gap: 10px;
}

.c-tab__item {
  z-index: 1;
  display: flex;
  justify-content: center;
  align-items: stretch;
  margin-bottom: -1px;
}

.c-tab__button {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: visible;
  width: 100%;
  padding-block: calc(14px + var(--slope-1px) * 14);
  outline: none;
  border: 1px solid var(--base-color);
  border-bottom-width: 2px;
  border-radius: 0;
  background: var(--base-color);
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-weight: 350;
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1.5;
  cursor: pointer;
  transition: background .2s;
}

.c-tab__button:after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  z-index: 2;
  display: block;
  width: 100%;
  border-bottom: 1px solid var(--base-color);
}

@media screen and (max-width: 767px) {
  .c-tab__button {
    font-size: .98214em;
  }
}

.c-tab__button.is-current {
  border: 1px solid var(--base-color);
  background: var(--bg-color);
  color: var(--base-color);
}

.c-tab__button.is-current:after {
  border-bottom-color: var(--bg-color);
}

/* for tab.js view control */
:is(*[data-tab-id], .js-tab-channel) {
  display: none;
}

:is(*[data-tab-id], .js-tab-channel).is-current {
  display: block;
}

thead:is(*[data-tab-id], .js-tab-channel).is-current {
  display: table-header-group;
}

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

Section

* ============================================================= */
.c-section {
  position: relative;
  margin-block: calc(40px + var(--slope-1px) * 43);
}

.c-section:first-child {
  margin-top: 14px;
}

.c-section + .c-section {
  margin-top: calc(56px + var(--slope-1px) * 40);
}

.c-section._slim {
  width: 800px;
  max-width: 100%;
  margin-inline: auto;
}

.c-section._bg {
  margin-block: calc(35px + var(--slope-1px) * 30);
  padding-block: calc(35px + var(--slope-1px) * 30);
}

.c-section._bg:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  z-index: -1;
  width: var(--width);
  height: 100%;
  background: var(--bg-color);
  transform: translateX(-50%);

  --width: calc(var(--vw) * 100);
}

@media screen and (max-width: 767px) {
  .c-section._bg:before {
    --width: calc(100% + var(--inner-padding) * 2);
  }
}

.c-section._bg\:dark {
  color: #fff;
}

.c-section._bg\:dark:after {
  background: var(--point-color);
}

.c-section__head {
  position: relative;
  z-index: 1;
  margin-bottom: calc(25px + var(--slope-1px) * 15);
}

.c-section._bg\:dark .c-section__head {
  --point-color: #fff;
}

.c-section__body {
  position: relative;
  z-index: 1;
}

/* inner section
=============================== */
.c-inner-section:not(:first-child) {
  margin-top: calc(40px + var(--slope-1px) * 24);
}

.c-inner-section + .c-inner-section {
  margin-top: calc(40px + var(--slope-1px) * 8);
}

body[data-id=ownership] .c-inner-section + .c-inner-section {
  margin-top: calc(64px + var(--slope-1px) * 32);
}

.c-inner-section__head {
  margin-bottom: calc(24px + var(--slope-1px) * 8);
}

/* c-grid-section
============================== */
.c-grid-section {
  display: grid;
  gap: calc(30px + var(--slope-1px) * 20);
  justify-items: center;
}

@media screen and (max-width: 767px) {
  .c-grid-section {
    width: calc(100% + var(--contents-padding));
    margin-inline: calc(var(--contents-padding) * -.5);
  }
}

.c-grid-section + .c-grid-section {
  margin-top: calc(50px + var(--slope-1px) * 30);
  padding-top: calc(50px + var(--slope-1px) * 30);
  border-top: 1px solid var(--border-color);
}

.c-grid-section__head {
  text-align: center;
}

.c-grid-section__body {
  width: 100%;
}

.c-grid-section__foot {
  width: 285px;
  max-width: 100%;
}

@media screen and (min-width: 768px) {
  .c-grid-section {
    align-items: center;
    grid-template-columns: 1fr 280px;
    justify-items: stretch;
  }
  .c-grid-section__head {
    text-align: left;
  }
  .c-grid-section__body {
    grid-column: span 2;
  }
  .c-grid-section__foot {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    width: auto;
  }
}

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

slider

* ============================================================= */
/* c-slider-control
============================== */
.c-slider-control {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(24px + var(--slope-1px) * 8);
}

.c-slider-control__count {
  position: relative;
  display: flex;
  width: calc(51px + var(--slope-1px) * 42);
  height: calc(42px + var(--slope-1px) * 32);
  font-weight: 400;
  font-family: var(--point-font-family);
  line-height: 1;
}

.c-slider-control__count ._current {
  font-size: calc(24px + var(--slope-1px) * 24);
}

.c-slider-control__count ._slash {
  position: absolute;
  top: calc(6px + var(--slope-1px) * 14);
  right: calc(4px + var(--slope-1px) * 4);
  display: block;
  width: calc(48px + var(--slope-1px) * 16);
  height: 1px;
  background: #c9c9c7;
  font-size: 0;
  transform: rotate(-45deg);
  transform-origin: right top;
}

.c-slider-control__count ._total {
  margin-top: auto;
  margin-left: auto;
  color: #c9c9c7;
  font-size: calc(15px + var(--slope-1px) * 5);
}

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

Table

* ============================================================= */
/* scroll container
=============================== */
.c-table-container {
  position: relative;
  overflow: auto;
  width: 100%;
  background: linear-gradient(to left, rgba(255, 255, 255, 0), #fff 15px) 0 0/50px 100%, linear-gradient(to left, rgba(255, 255, 255, 0), rgba(0, 0, 0, .2)) 0 0/20px 100%, linear-gradient(to right, rgba(255, 255, 255, 0), #fff 15px) right/50px 100%, linear-gradient(to right, rgba(255, 255, 255, 0), rgba(0, 0, 0, .2)) right/20px 100%;
  background-color: #fff;
  background-attachment: local, scroll, local, scroll;
  background-repeat: no-repeat;
}

.c-table-container + .c-table-container {
  margin-top: calc(30px + var(--slope-1px) * 20);
}

.c-table-container > * {
  min-width: 58em;
}

/* data table
=============================== */
.c-data-table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid var(--border-color);
  border-left: 1px solid var(--border-color);
  color: var(--base-color);
  font-size: calc(15px + var(--slope-1px) * 1);
}

.c-data-table._fixed {
  table-layout: fixed;
}

.c-data-table th,
.c-data-table td {
  height: 4.4375em;
  padding: 10px 12px;
  border-right: 1px solid var(--border-color);
  border-bottom: 1px solid var(--border-color);
  text-align: center;
}

.c-data-table th span {
  display: block;
  font-size: 1.06667em;
}

.c-data-table th span span {
  display: inline;
  font-size: .875em;
}

.c-data-table th > span {
  display: block;
  margin-top: .25em;
  font-size: .93333em;
}

.c-data-table thead th {
  background: #666;
  color: #fff;
}

.c-data-table thead td {
  font-size: .86667em;
}

.c-data-table tbody th {
  background: #666;
  color: #fff;
}

.c-data-table tbody td {
  width: 16.66667%;
}

.c-data-table tbody td em {
  color: var(--key-color);
  font-weight: bold;
}

.c-data-table tbody ._total td {
  color: #c00;
}

.c-data-table-detail {
  display: block;
  width: fit-content;
  margin-inline: auto;
  margin-top: 3px;
  padding: 8px;
  border: 1px solid #fff;
  color: #fff;
  text-decoration: none;
  font-size: calc(12px + var(--slope-1px) * 2);
  line-height: 1;
  transition: all .2s;
}

.c-data-table-detail:hover {
  background: #fff;
  color: #666;
}

/* profile table
=============================== */
.c-profile-table {
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid var(--border-color);
  font-size: calc(15px + var(--slope-1px) * 1);
  line-height: 1.7;
}

.c-profile-table th,
.c-profile-table td {
  padding: calc(20px + var(--slope-1px) * 7) 0;
  border-bottom: 1px solid var(--border-color);
  vertical-align: top;
}

.c-profile-table th {
  width: calc(70px + var(--slope-1px) * 20);
  font-weight: normal;
}

.c-profile-table td {
  padding-left: 1em;
}

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

Text

* ============================================================= */
/* lead
=============================== */
.c-lead {
  text-align: center;
  font-size: calc(14px + var(--slope-1px) * 1);
}

.c-lead > p {
  margin-block: var(--leading-trim);
}

.c-lead > p em {
  font-weight: bold;
  font-size: 1.33333em;
}

.c-lead > p + p {
  margin-top: 1em;
}

/* c-text
============================== */
.c-text {
  margin-block: var(--leading-trim) calc(40px + var(--leading-trim));
  font-size: calc(15px + var(--slope-1px) * 1);
  line-height: 1.7;
}

/* c-notes
=============================== */
.c-notes {
  display: grid;
  grid-template-columns: 100%;
  gap: .7em;
  margin-top: calc(30px + var(--slope-1px) * 2);
  font-size: calc(12px + var(--slope-1px) * 1);
  line-height: 1.7;
}

.c-notes > li {
  margin-block: var(--leading-trim);
  padding-left: 1em;
  text-indent: -1em;
}

.c-notes > li:before {
  content: "\203b";
}

.c-notes > li._number {
  padding-left: 2em;
  text-indent: -2em;
}

.c-notes._dot > li:before {
  content: "\30fb";
}

.c-notes._square > li:before {
  content: "\25a0";
}

.c-notes._star > li:before {
  content: "\2605";
}

.c-notes > li._dot:before {
  content: "\30fb";
}

.c-notes > li._square:before {
  content: "\25a0";
}

.c-notes > li._star:before {
  content: "\2605";
}

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

title

* ============================================================= */
/* c-page-title
=============================== */
.c-page-title {
  position: relative;
  flex-grow: 1;
  width: fit-content;
  max-width: var(--inner-width-px);
  margin-block: var(--leading-trim);
  font-weight: 400;
  font-size: calc(24px + var(--slope-1px) * 8);
  font-family: var(--point-font-family);
  line-height: 1.1;
}

@media screen and (max-width: 767px) {
  .c-page-title {
    width: 100%;
  }
}

.c-page-title[data-en] {
  padding-block: calc(13.5px + var(--slope-1px) * 8.5);
  font-size: calc(32px + var(--slope-1px) * 16);
}

.c-page-title[data-en]:after {
  content: attr(data-en);
  position: absolute;
  top: 50%;
  left: calc(var(--inner-overflow) * -1);
  z-index: -1;
  color: #e9e4d7;
  text-transform: capitalize;
  letter-spacing: .05em;
  font-weight: 700;
  font-style: normal;
  font-size: calc(80px + var(--slope-1px) * 48);
  font-family: var(--en-font-family);
  line-height: 1;
  transform: translateY(-50%);
}

/* c-section-title
=============================== */
.c-section-title {
  position: relative;
  margin-block: var(--leading-trim);
  word-break: keep-all;
  overflow-wrap: anywhere;
  font-weight: 400;
  font-size: calc(26px + var(--slope-1px) * 6);
  font-family: var(--point-font-family);
  line-height: 1.5;
}

/* c-sub-title
============================== */
.c-sub-title {
  position: relative;
  margin-bottom: calc(24px + var(--slope-1px) * 8 + var(--leading-trim));
  padding-top: calc(21px + var(--leading-trim));
  border-top: 1px solid var(--border-color);
  font-weight: 400;
  font-size: calc(22px + var(--slope-1px) * 4);
  font-family: var(--point-font-family);
  line-height: 1.5;
}

.c-sub-title:has(i) {
  display: flex;
  align-items: center;
  gap: .5em;
}

.c-sub-title:has(i) > i {
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 2.44444em;
  height: 2.44444em;
  border: 1px solid;
  font-style: normal;
  font-size: calc(14px + var(--slope-1px) * 4);
  font-family: var(--base-font-family);
}

.c-sub-title:after {
  content: "";
  position: absolute;
  top: -1px;
  left: 0;
  display: block;
  width: 30px;
  height: 1px;
  background: currentColor;
}

@media screen and (min-width: 768px) {
  .c-sub-title {
    max-width: fit-content;
  }
}

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

Blog

* ============================================================= */
.c-blog-container__table {
  width: 100%;
}

.c-blog-container__td > article {
  padding: calc(24px + var(--slope-1px) * 24);
  border: 1px solid var(--border-color);
}

.c-blog-container__td > article + article {
  margin-top: calc(26px + var(--slope-1px) * 14);
}

.c-blog-container img {
  display: inline;
}

.c-blog-container .blog__header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px 1em;
  width: 100%;
  margin-bottom: calc(24px + var(--slope-1px) * 12);
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border-color);
}

@media screen and (max-width: 767px) {
  .c-blog-container .blog__header {
    flex-direction: column;
    align-items: flex-start;
  }
}

.c-blog-container .blog__title {
  margin-block: var(--leading-trim);
  font-weight: 350;
  font-size: calc(16px + var(--slope-1px) * 6);
  line-height: 1.4;
}

.c-blog-container .blog__date {
  margin-block: var(--leading-trim);
  margin-left: auto;
  color: var(--sub-text-color);
  font-weight: 400;
  font-size: calc(13px + var(--slope-1px) * 1);
}

.c-blog-container .blog__body {
  word-break: break-all;
}

.c-blog-container .blog__body img {
  height: auto;
  max-width: 1180px;
}

@media screen and (max-width: 767px) {
  .c-blog-container .blog__body img {
    max-width: 100%;
  }
}

.c-blog-container .blog__paging {
  text-align: right;
  font-size: calc(13px + var(--slope-1px) * 2);
}

.c-blog-container .blog__paging:first-child {
  margin-bottom: calc(24px + var(--slope-1px) * 8);
}

.c-blog-container .blog__paging:last-child {
  margin-top: calc(24px + var(--slope-1px) * 8);
}

/* c-blog-slider
============================== */
.c-blog-slider {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 112px 74px;
}

@media screen and (max-width: 767px) {
  .c-blog-slider {
    display: block;
    width: calc(100% + var(--inner-padding));
    margin-inline: calc(var(--inner-padding) * -.5);
  }
}

@media screen and (min-width: 768px) {
  .c-blog-slider__item:nth-child(2n+1) {
    position: relative;
    top: 80px;
  }
}

@media screen and (max-width: 767px) {
  .c-blog-slider__item {
    padding-inline: calc(var(--inner-padding) * .5);
  }
}

/* c-blog-slider-control
============================== */
.c-blog-slider-control {
  display: flex;
  margin-top: 40px;
}

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

/* c-blog-slider-foot
============================== */
.c-blog-slider-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: 118px;
}

@media screen and (max-width: 767px) {
  .c-blog-slider-foot {
    margin-top: 48px;
  }
}

/* c-blog-nav
============================== */
.c-blog-nav {
  display: flex;
  align-items: center;
  gap: 32px;
  text-decoration: none;
  transition: opacity .3s;
}

@media screen and (max-width: 767px) {
  .c-blog-nav {
    opacity: 1 !important;

    translate: 0px 0px !important;
  }
}

@media screen and (max-width: 767px) {
  .c-blog-nav:not(._slider) {
    flex-direction: column;
  }
}

@media screen and (max-width: 560px) {
  .c-blog-nav {
    flex-direction: column;
  }
}

.c-blog-nav:hover {
  opacity: .7;
}

.c-blog-nav__image {
  position: relative;
  flex-shrink: 0;
  overflow: hidden;
  overflow: hidden;
  width: 200px;
  aspect-ratio: 1 / 1;
  transition: transform .6s cubic-bezier(.65, 0, .35, 1);
  transform-origin: left top;
}

@media screen and (min-width: 768px) {
  .c-blog-nav__image {
    max-width: 40%;
  }
  .c-blog-nav[data-intersection] .c-blog-nav__image {
    transform: scaleY(0);
  }
  .c-blog-nav[data-intersecting="true"] .c-blog-nav__image {
    transform: scaleY(1);
  }
}

@media screen and (max-width: 767px) {
  .c-blog-nav:not(._slider) .c-blog-nav__image {
    width: 100%;
  }
}

@media screen and (max-width: 560px) {
  .c-blog-nav._slider .c-blog-nav__image {
    width: 61.9195%;
  }
}

.c-blog-nav[data-intersection] .c-blog-nav__image:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  background: var(--key-color);
  transition: transform .6s cubic-bezier(.65, 0, .35, 1) .5s;
  transform-origin: right bottom;
}

@media screen and (max-width: 767px) {
  .c-blog-nav[data-intersection] .c-blog-nav__image:before {
    transform: scaleY(0) !important;
  }
}

.c-blog-nav[data-intersecting="true"] .c-blog-nav__image:before {
  transform: scaleY(0);
}

.c-blog-nav__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s;
}

.c-blog-nav:hover .c-blog-nav__image img {
  transform: scale(1.05);
}

.c-blog-nav__contents {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(24px + var(--slope-1px) * 2);
}

.c-blog-nav__title {
  overflow: hidden;
  margin-block: var(--leading-trim);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: calc(16px + var(--slope-1px) * 6);
}

.c-blog-nav._slider .c-blog-nav__title {
  font-size: calc(20px + var(--slope-1px) * 2);
}

.c-blog-nav__text {
  display: -webkit-box;
  overflow: hidden;
  margin-block: var(--leading-trim);
  text-overflow: ellipsis;
  font-size: calc(13px + var(--slope-1px) * 3);

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

.c-blog-nav._slider .c-blog-nav__text {
  font-size: calc(15px + var(--slope-1px) * 1);
}

.c-blog-nav__date {
  margin-block: var(--leading-trim);
  font-size: calc(12px + var(--slope-1px) * 2);
}

.c-blog-nav._slider .c-blog-nav__date {
  font-size: 14px;
}

.c-blog-nav__shop {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-block: var(--leading-trim);
  font-size: calc(12px + var(--slope-1px) * 1);
}

.c-blog-nav._slider .c-blog-nav__shop {
  font-size: 13px;
}

@media screen and (max-width: 767px) {
  .c-blog-nav._slider .c-blog-nav__shop {
    font-size: 14px;
  }
}

.c-blog-nav__shop:before {
  content: "";
  display: block;
  flex-grow: 1;
  height: 1px;
  background: var(--border-color);
  transition: transform .3s;
  transform-origin: right center;
}

.c-blog-nav:hover .c-blog-nav__shop:before {
  transform: scaleX(0);
}

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

contact

* ============================================================= */
/* c-contact
============================== */
.c-contact {
  position: relative;
  left: 50%;
  width: var(--width);
  padding: 0 var(--inner-padding) var(--inner-padding);
  transform: translateX(-50%);

  --width: calc(var(--vw) * 100);
}

@media screen and (max-width: 767px) {
  .c-contact {
    --width: calc(100% + var(--inner-padding) * 2);
  }
}

@media screen and (max-width: 767px) {
  .c-contact {
    padding: 0 10px 10px;
  }
}

.c-contact__inner {
  padding: 120px var(--inner-padding) 100px;
  background: url(../img/bg-contact.jpg) 50% 50%/cover no-repeat;
  color: #fff;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .c-contact__inner {
    padding: 64px 39px;
    background-image: url(../img/bg-contact-sp.jpg);
  }
}

.c-contact__head {
  display: grid;
  gap: calc(32px + var(--slope-1px) * 11);
  margin-bottom: calc(40px + var(--slope-1px) * 24);
}

.c-contact__title {
  margin-block: var(--leading-trim);
  font-weight: 400;
  font-size: calc(24px + var(--slope-1px) * 12);
  font-family: var(--point-font-family);
}

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

.c-contact__body {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 40px 16px;
  width: 100%;
  max-width: 1120px;
  margin-inline: auto;
}

@media screen and (max-width: 767px) {
  .c-contact__body {
    grid-template-columns: 100%;
    max-width: 277px;
  }
}

/* c-contact-nav
============================== */
.c-contact-nav {
  display: grid;
  gap: 10px;
}

.c-contact-nav[data-intersection]:nth-child(2) {
  transition-delay: .4s !important;
}

.c-contact-nav[data-intersection]:nth-child(3) {
  transition-delay: .6s !important;
}

.c-contact-nav__head {
  margin-block: var(--leading-trim);
  font-size: calc(13px + var(--slope-1px) * 1);
}

.c-contact-nav__body {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(6px + var(--slope-1px) * 4);
  padding-block: calc(14px + var(--slope-1px) * 10);
  background: #fff;
  color: var(--base-color);
  text-decoration: none;
  font-size: calc(16px + var(--slope-1px) * 4);
  transition: opacity .2s;
}

.c-contact-nav__body:hover {
  opacity: .7;
}

.c-contact-nav__body._black {
  background: var(--base-color);
  color: #fff;
}

.c-contact-nav__body > i {
  display: block;
  flex-shrink: 0;
  width: calc(24px + var(--slope-1px) * 6);
  aspect-ratio: 1 / 1;
}

.c-contact-nav__body > i :is(img, svg) {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.c-contact-nav__body > i svg path {
  fill: currentColor;
}

.c-contact-nav__body:after {
  content: "";
  position: absolute;
  top: 0;
  right: calc(20px + var(--slope-1px) * 12);
  bottom: 0;
  display: block;
  width: calc(12px + var(--slope-1px) * 2);
  aspect-ratio: 1 / 1;
  margin-block: auto;
  background: currentColor;
  mask: var(--icon-angle) 50% 50%/contain no-repeat;
}

.c-contact-nav__body[target="_blank"]:after {
  mask-image: var(--icon-blank);
}

.c-contact-nav__foot {
  margin-block: var(--leading-trim);
  font-size: calc(13px + var(--slope-1px) * 1);
}

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

democar

* ============================================================= */
/* ATC-DEMOCAR
============================== */
.ATC-DEMOCAR {
  --key-color: var(--base-color);
  --detail-thumb-head-bg: var(--base-color);
  --detail-thumb-head-color: #fff;
  --index-anchor-button-bg: transparent;
  --index-anchor-button-border-radius: 0;
  --index-anchor-button-border: 1px solid var(--base-color);
  --index-anchor-button-color: var(--base-color);
  --index-shop-head-bg: #666;
  --index-shop-head-color: #fff;
  --index-shop-body-bg: transparent;
  --list-table-body-bg-other: #fff;
  --list-table-head-bg: #666;
  --list-table-head-color: #fff;
}

.ATC-DEMOCAR .ATC-title-text {
  margin-top: var(--leading-trim);
  padding-bottom: 0;
  border-bottom: 0;
  font-weight: 400;
  font-size: calc(26px + var(--slope-1px) * 6);
  font-family: var(--point-font-family);
}

.ATC-DEMOCAR .ATC-title-text-basic {
  font-weight: 400;
  font-size: calc(18px + var(--slope-1px) * 4);
  font-family: var(--point-font-family);
}

.ATC-DEMOCAR .ATC-car-contents-header > ul > li a {
  font-weight: 350;
}

.ATC-DEMOCAR .ATC-shop-list-table td.ATC-shop-list-table-shop {
  font-weight: 400;
}

.ATC-DEMOCAR th:first-child .ATC-car-contents-demo-sort > li a {
  border: 1px solid currentColor !important;
  border-radius: 0;
  background: transparent !important;
  color: #fff !important;
}

.ATC-DEMOCAR .ATC-car-contents-demo-list-status {
  margin-bottom: 15px;
  padding-top: 0;
  padding-bottom: 1em;
  border-bottom: 1px solid var(--border-color);
  background: transparent;
  color: var(--base-color);
  line-height: 1;
}

.ATC-DEMOCAR .ATC-car-contents-demo-list-btn a {
  border-radius: 0;
  font-weight: normal;
}

.ATC-DEMOCAR .ATC-car-contents-demo-list-contents td:last-child a {
  border-radius: 0;
}

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

faq

* ============================================================= */
/* c-faq
============================== */
.c-faq {
  border-bottom: 1px solid var(--border-color);
}

.c-faq:first-child {
  border-top: 1px solid var(--border-color);
}

.c-faq__head button {
  display: flex;
  align-items: center;
  gap: 16px;
  overflow: hidden;
  width: 100%;
  padding: calc(32px + var(--leading-trim)) 16px;
  outline: none;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: currentColor;
  text-align: left;
  font-size: calc(15px + var(--slope-1px) * 1);
  line-height: 1.7;
  appearance: none;
}

.c-faq__head button:before {
  content: "Q";
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 32px;
  aspect-ratio: 1 / 1;
  background: #666;
  color: #fff;
  font-size: 18px;
}

.c-faq__head button:after {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  margin-left: auto;
  background: currentColor;
  mask: var(--icon-plus) 50% 50%/contain no-repeat;
}

.c-faq__head button.is-open:after {
  mask-image: var(--icon-minus);
}

.c-faq__hide {
  display: none;
}

.c-faq__body {
  margin-block: var(--leading-trim);
  padding-inline: 64px;
  padding-bottom: 40px;
  font-size: calc(15px + var(--slope-1px) * 1);
  line-height: 1.7;
}

@media screen and (max-width: 767px) {
  .c-faq__body {
    padding-inline: 16px;
  }
}

.c-faq__body > p + p {
  margin-top: 1em;
}

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

guide

* ============================================================= */
/* c-newcar-guide
============================== */
.c-newcar-guide {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr min(60%, 748px);
  gap: calc(20px + var(--slope-1px) * 4);
  margin-bottom: calc(48px + var(--slope-1px) * 24);
  padding-block: 24px;
  font-size: calc(14px + var(--slope-1px) * 2);

  border-block: 1px solid var(--border-color);
}

@media screen and (max-width: 1024px) {
  .c-newcar-guide {
    grid-template-columns: 100%;
  }
}

.c-newcar-guide__text {
  margin-block: var(--leading-trim);
  word-break: keep-all;
  overflow-wrap: anywhere;
}

@media screen and (max-width: 560px) {
  .c-newcar-guide__text {
    word-break: initial;
    overflow-wrap: initial;
  }
}

.c-newcar-guide__nav {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(12px + var(--slope-1px) * 4);
}

@media screen and (max-width: 767px) {
  .c-newcar-guide__nav {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  }
}

/* c-newcar-guide-nav
============================== */
.c-newcar-guide-nav {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: #fff;
  text-decoration: none;
  font-weight: 350;
  font-size: calc(14px + var(--slope-1px) * 2);
  transition: all .2s;
}

.c-newcar-guide-nav:hover {
  opacity: .7;
}

.c-newcar-guide-nav__image {
  width: 120px;
}

.c-newcar-guide-nav__text {
  display: grid;
  flex-grow: 1;
  align-items: center;
  grid-template-columns: 1fr 13px;
  gap: .5em;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.c-newcar-guide-nav__text:after {
  content: "";
  display: block;
  width: 13px;
  height: 13px;
  background: currentColor;
  mask: var(--icon-angle) 50% 50%/contain no-repeat;
}

/* c-guide-flow
============================== */
.c-guide-flow__item {
  display: grid;
  align-items: center;
  grid-template-columns: 100%;
  gap: 8px 24px;
}

.c-guide-flow__item:not(:first-child) {
  padding-top: 32px;
}

@media screen and (min-width: 768px) {
  .c-guide-flow__item {
    grid-template-columns: var(--number-width) 1fr;
    background: linear-gradient(#666 0%, #666 100%) calc(var(--number-width) * .5) var(--bg-position-y)/1px var(--bg-size-y) no-repeat;

    --number-width: 72px;
    --bg-position-y: 0px;
    --bg-size-y: 100%;
  }
  .c-guide-flow__item:first-child {
    --bg-position-y: 100%;
    --bg-size-y: 50%;
  }
  .c-guide-flow__item:last-child {
    --bg-size-y: 50%;
  }
}

.c-guide-flow__number {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  gap: 10px 8px;
  width: var(--number-width);
  aspect-ratio: 1 / 1;
  background: #666;
  color: #fff;
  text-align: center;
  font-weight: 300;
  font-size: calc(24px + var(--slope-1px) * 6);
  line-height: 1;
}

@media screen and (max-width: 767px) {
  .c-guide-flow__number {
    flex-direction: row;
    height: calc(40px + var(--slope-1px) * 10);
    aspect-ratio: unset;
  }
}

.c-guide-flow__number:before {
  content: "STEP";
  font-size: calc(12px + var(--slope-1px) * 1);
  line-height: 1;
}

.c-guide-flow__contents {
  display: grid;
  align-items: center;
  grid-template-columns: 38.46154% 1fr;
  gap: 48px;
  padding: calc(24px + var(--slope-1px) * 8) calc(24px + var(--slope-1px) * 8) 32px;
  border: 1px solid var(--border-color);
}

@media screen and (max-width: 767px) {
  .c-guide-flow__contents {
    grid-template-columns: 100%;
    gap: 32px;
  }
}

.c-guide-flow__image {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  overflow: hidden;
  aspect-ratio: 68 / 38;
}

.c-guide-flow__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.c-guide-flow__head {
  margin-block: var(--leading-trim);
  font-weight: 350;
  font-size: calc(20px + var(--slope-1px) * 4);
}

.c-guide-flow__body {
  display: grid;
  grid-template-columns: 100%;
  gap: .7em;
  margin-top: 24px;
}

.c-guide-flow__body > p {
  margin-block: var(--leading-trim);
}

.c-guide-flow__body > ul {
  margin-block: var(--leading-trim);
  letter-spacing: 0;
}

.c-guide-flow__body > ul > li {
  padding-left: 1em;
  text-indent: -1em;
}

.c-guide-flow__body > ul > li:before {
  content: "\30fb";
}

.c-guide-flow__foot {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  margin-top: 40px;
}

.c-guide-flow__foot .c-border-nav {
  min-width: calc(125px + var(--slope-1px) * 75);
}

/* c-guide-reservation
============================== */
.c-guide-reservation {
  padding: calc(32px + var(--slope-1px) * 24) 48px;
  background: #fff;
}

@media screen and (max-width: 767px) {
  .c-guide-reservation {
    position: relative;
    left: 50%;
    width: calc(100 * var(--vw));
    padding-inline: var(--inner-padding);
    transform: translateX(-50%);
  }
}

.c-guide-reservation__head {
  margin-bottom: calc(32px + var(--slope-1px) * 8);
}

.c-guide-reservation__body {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(24px + var(--slope-1px) * 8);
}

.c-guide-reservation__lead {
  margin-block: var(--leading-trim);
}

.c-guide-reservation__button {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 24px;
  width: 100%;
}

.c-guide-reservation__button .c-button {
  max-width: 340px;
}

.c-guide-reservation-item {
  display: grid;
  align-items: center;
  grid-template-columns: 155px 1fr;
  gap: 32px 24px;
  padding-block: 24px;
  border-top: 1px solid var(--border-color);
}

@media screen and (max-width: 767px) {
  .c-guide-reservation-item {
    grid-template-columns: 100%;
  }
}

.c-guide-reservation-item:last-child {
  border-bottom: 1px solid var(--border-color);
}

.c-guide-reservation-item__head {
  display: grid;
  align-items: center;
  grid-template-columns: calc(24px + var(--slope-1px) * 8) 1fr;
  gap: 8px;
  font-size: calc(18px + var(--slope-1px) * 4);
}

.c-guide-reservation-item__head > i {
  display: block;
  aspect-ratio: 1 / 1;
}

.c-guide-reservation-item__head > i :is(img, svg) {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.c-guide-reservation-item__body {
  font-size: calc(15px + var(--slope-1px) * 1);
}

.c-guide-reservation-item__body > p {
  margin-block: var(--leading-trim);
}

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

Maintenance

* ============================================================= */
/* c-inspection-detail
============================== */
.c-inspection-detail {
  display: grid;
  grid-template-columns: 100%;
  gap: .7em;
  margin-block: 24px;
  font-size: calc(15px + var(--slope-1px) * 1);
}

.c-inspection-detail > li {
  margin-block: var(--leading-trim);
  padding-left: 1em;
  text-indent: -1em;
}

.c-inspection-detail > li:before {
  content: "\30fb";
}

/* c-reservation-nav
============================== */
.c-reservation-nav {
  display: grid;
  grid-template-columns: max(600px, 50%) 1fr;
  background: var(--base-color);
  color: #fff;
  text-decoration: none;
  transition: all .3s ease-out;
}

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

.c-reservation-nav:hover {
  opacity: .8;
}

.c-reservation-nav__contents {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 12px;
  padding: 40px;
}

@media screen and (max-width: 767px) {
  .c-reservation-nav__contents {
    padding: 16px;
  }
}

.c-reservation-nav__head {
  align-self: stretch;
  padding: calc(8px + var(--slope-1px) * 2);
  background: #fff;
  color: var(--base-color);
  text-align: center;
  line-height: 1;
}

.c-reservation-nav__body {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: calc(20px + var(--slope-1px) * 4);
  line-height: 1.5;
}

@media screen and (max-width: 767px) {
  .c-reservation-nav__body {
    align-self: stretch;
  }
}

.c-reservation-nav__body > i {
  display: block;
  flex-shrink: 0;
  width: calc(30px + var(--slope-1px) * 2);
  aspect-ratio: 1 / 1;
  margin-right: 8px;
}

@media screen and (max-width: 767px) {
  .c-reservation-nav__body > i {
    margin-left: auto;
  }
}

.c-reservation-nav__body > i :is(img, svg) {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.c-reservation-nav__body span {
  display: block;
  margin-block: var(--leading-trim);
  word-break: keep-all;
  overflow-wrap: anywhere;
  line-height: 1.5;
}

.c-reservation-nav__body:after {
  content: "";
  flex-shrink: 0;
  width: calc(18px + var(--slope-1px) * 2);
  aspect-ratio: 1 / 1;
  margin-left: 12px;
  background: currentColor;
  mask: var(--icon-blank) 50% 50%/contain no-repeat;
}

@media screen and (max-width: 767px) {
  .c-reservation-nav__body:after {
    margin-left: auto;
  }
}

.c-reservation-nav__image {
  overflow: hidden;
}

.c-reservation-nav__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all .3s ease-out;
}

.c-reservation-nav:hover .c-reservation-nav__image img {
  transform: scale(1.03);
}

/* c-maintenance-reason-nav
============================== */
.c-maintenance-reason-nav {
  display: flex;
  justify-content: center;
  margin-top: calc(32px + var(--slope-1px) * 8);
}

/* c-inspection-checkpoint
============================== */
.c-inspection-checkpoint {
  display: grid;
  align-items: center;
  grid-template-columns: 41.66667% 1fr;
  gap: 32px 40px;
}

@media screen and (max-width: 767px) {
  .c-inspection-checkpoint {
    grid-template-columns: 100%;
  }
}

.c-inspection-checkpoint-figure {
  position: relative;
  aspect-ratio: 500 / 205;
}

.c-inspection-checkpoint-figure__image {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 81%;
  margin: auto;
  transform: translate3d(-55%, -45%, 0px);
}

.c-inspection-checkpoint-figure__pointer {
  position: relative;
  z-index: 1;
}

.c-inspection-checkpoint-figure__pointer._check1 {
  padding-top: 9%;
}

.c-inspection-checkpoint-figure__pointer :is(img, svg) {
  width: 100%;
  height: auto;
}

.c-inspection-checkpoint-nav {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: calc(13px + var(--slope-1px) * -1);
}

.c-inspection-checkpoint-button {
  display: flex;
  align-items: center;
  gap: 8px;
  height: calc(48px + var(--slope-1px) * 2);
  padding: 8px calc(12px + var(--slope-1px) * 4);
  border: 1px solid var(--base-color);
  color: var(--base-color);
  text-decoration: none;
  letter-spacing: 0;
  font-size: calc(14px + var(--slope-1px) * 2);
}

a.c-inspection-checkpoint-button {
  transition: all .2s;
}

a.c-inspection-checkpoint-button:hover {
  background: var(--base-color);
  color: #fff;
}

a.c-inspection-checkpoint-button:after {
  content: "";
  display: block;
  flex-shrink: 0;
  width: calc(16px + var(--slope-1px) * 6);
  aspect-ratio: 1 / 1;
  margin-left: auto;
  background: currentColor;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 22 22"><path fill="%23000" fill-rule="evenodd" d="M7.2771 3.3082a7.3335 7.3335 0 0 1 8.5995 11.2721l3.1049 3.1049a.9166.9166 0 0 1 0 1.2963.9166.9166 0 0 1-1.2963 0l-3.1049-3.1049A7.3337 7.3337 0 0 1 2.75 10.0835a7.3335 7.3335 0 0 1 4.5271-6.7753Zm2.8064 1.2751a5.5 5.5 0 1 0 0 11.0004 5.5006 5.5006 0 0 0 5.0816-3.3953 5.501 5.501 0 0 0-1.1923-5.9941 5.501 5.501 0 0 0-3.8893-1.611Zm0 1.8336a.9167.9167 0 0 1 .9167.9167v1.8333h1.8333a.9166.9166 0 0 1 .9166.9166.9167.9167 0 0 1-.9166.9167h-1.8333v1.8333a.9167.9167 0 0 1-.9167.9166.9166.9166 0 0 1-.9166-.9166v-1.8333H7.3336a.9167.9167 0 0 1 0-1.8333h1.8333V7.3336a.9166.9166 0 0 1 .9166-.9167Z" clip-rule="evenodd"/></svg>') 50% 50%/contain no-repeat;
}

/* c-inspection-checkpoint-detail
=============================== */
.c-inspection-checkpoint-detail {
  padding: calc(25px + var(--slope-1px) * 5);
  border: 1px solid var(--border-color);
}

.c-inspection-checkpoint-detail__col {
  display: flex;
  flex-wrap: wrap;
  gap: .8em 4em;
}

@media screen and (max-width: 767px) {
  .c-inspection-checkpoint-detail__col {
    flex-direction: column;
  }
}

.c-inspection-checkpoint-detail__col._col {
  flex-direction: column;
}

.c-inspection-checkpoint-detail__col > li {
  display: flex;
  margin-block: var(--leading-trim);
  line-height: 1.5;
}

@media screen and (min-width: 768px) {
  .c-inspection-checkpoint-detail__col > li {
    flex-grow: 1;
    width: fit-content;
    min-width: calc(50% - 2em);
    max-width: 100%;
  }
}

.c-inspection-checkpoint-detail__col > li:before {
  content: "\25cf";
}

/* c-inspection-checkpoint-notes
============================== */
.c-inspection-checkpoint-notes {
  width: fit-content;
  max-width: 100%;
  margin-top: 24px;
  font-size: calc(12px + var(--slope-1px) * 1);
}

@media screen and (min-width: 768px) {
  .c-inspection-checkpoint-notes {
    margin-left: auto;
  }
}

.c-inspection-checkpoint-notes > li {
  padding-left: 1em;
  text-indent: -1em;
}

/* c-maintenance-service
=============================== */
.c-maintenance-service {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(425px, 1fr));
  gap: calc(40px + var(--slope-1px) * 24) 40px;
  padding-top: calc(40px + var(--slope-1px) * 8);
  border-top: 1px solid var(--border-color);
}

.c-maintenance-service._no-border {
  margin-top: calc(56px + var(--slope-1px) * 32);
  padding-top: 0;
  border-top: 0;
}

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

.c-maintenance-service:has(.c-maintenance-service__item:first-child:last-child) {
  display: flex;
  flex-direction: column;
  align-items: center;
}

@media screen and (min-width: 768px) {
  .c-maintenance-service__item:first-child:last-child {
    width: calc(50% - 20px);
  }
}

/* c-maintenance-service-block
============================== */
.c-maintenance-service-block {
  display: grid;
  grid-template-columns: 100%;
  gap: calc(12px + var(--slope-1px) * 6);
  margin-inline: auto;
  text-align: center;
  text-decoration: none;
}

.c-maintenance-service-block__lead {
  margin-block: var(--leading-trim);
  font-size: calc(13px + var(--slope-1px) * 1);
}

.c-maintenance-service-block__lead._mamoru {
  --theme-color: #8dc21f;
}

.c-maintenance-service-block__lead._ciao {
  --theme-color: #0068b7;
}

.c-maintenance-service-block__lead:is(._mamoru, ._ciao) {
  display: flex;
  justify-content: center;
}

.c-maintenance-service-block__lead:is(._mamoru, ._ciao):before {
  content: "\25cf";
  order: -1;
  color: var(--theme-color);
}

.c-maintenance-service-block__lead:is(._mamoru, ._ciao):after {
  content: "\ff1a";
  order: -1;
}

.c-maintenance-service-block__banner {
  border: 1px solid var(--border-color);
  background: #fff;
  transition: opacity .2s;
}

.c-maintenance-service-block__banner img {
  margin-inline: auto;
}

.c-maintenance-service-block:hover .c-maintenance-service-block__banner {
  opacity: .7;
}

.c-maintenance-service-block__desc {
  margin-block: var(--leading-trim);
  text-align: left;
  font-size: calc(14px + var(--slope-1px) * 1);
}

/* c-maintenance-menu
============================== */
.c-maintenance-menu {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: calc(17px + var(--slope-1px) * 7);
}

body[data-id="maintenance"] .c-maintenance-menu__item[data-id="maintenance"] {
  display: none;
}

body[data-id="check_free"] .c-maintenance-menu__item[data-id="check_free"] {
  display: none;
}

body[data-id="check12"] .c-maintenance-menu__item[data-id="check12"] {
  display: none;
}

body[data-id="check_safety"] .c-maintenance-menu__item[data-id="check_safety"] {
  display: none;
}

body[data-id="inspection"] .c-maintenance-menu__item[data-id="inspection"] {
  display: none;
}

/* c-maintenance-menu-nav
============================== */
.c-maintenance-menu-nav {
  display: block;
  height: 100%;
  padding: 32px 24px;
  border: 1px solid var(--base-color);
  text-decoration: none;
  transition: all .2s;
}

.c-maintenance-menu-nav:hover {
  background: var(--base-color);
  color: #fff;
}

.c-maintenance-menu-nav__head {
  display: grid;
  align-items: center;
  grid-template-columns: auto 1fr auto;
  gap: calc(6px + var(--slope-1px) * 2);
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid;
  line-height: 1;
}

.c-maintenance-menu-nav__head:before {
  content: "";
  display: block;
  width: calc(22px + var(--slope-1px) * 2);
  aspect-ratio: 1 / 1;
  background: currentColor;
  mask: url(../img/icon/reservation.svg) 50% 50%/contain no-repeat;
}

.c-maintenance-menu-nav__head:after {
  content: "";
  display: block;
  width: 13px;
  aspect-ratio: 1 / 1;
  background: currentColor;
  mask: var(--icon-angle) 50% 50%/contain no-repeat;
}

.c-maintenance-menu-nav__body {
  margin-block: var(--leading-trim);
  font-size: calc(14px + var(--slope-1px) * 1);
}

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

nearby

* ============================================================= */
/* c-nearby-block
============================== */
@media screen and (min-width: 768px) {
  .c-nearby-block {
    padding: 32px 4.66667%;
    border: 1px solid var(--border-color);
  }
}

.c-nearby-block__head {
  margin-bottom: 24px;
}

/* c-nearby-search
=============================== */
.c-nearby-search {
  width: 100%;
  margin: 0 auto;
}

.c-nearby-search__notes {
  text-align: center;
  letter-spacing: 0;
  font-size: 1.4rem;
}

.c-nearby-search__form {
  display: flex;
  overflow: hidden;
  width: 100%;
  height: calc(48px + var(--slope-1px) * 12);
}

.c-nearby-search__input {
  flex-grow: 1;
  overflow: hidden;
}

.c-nearby-search__input input {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 1.2em .75em;
  outline: none;
  border: 0;
  border-radius: 0;
  background: #fff;
  line-height: 28px;
}

@media screen and (max-width: 767px) {
  .c-nearby-search__input input {
    font-size: 16px;
  }
}

@media screen and (max-width: 560px) {
  .c-nearby-search__input input::placeholder {
    font-size: 15px;
  }
}

.c-nearby-search__button {
  flex-shrink: 0;
  overflow: hidden;
  min-width: 0%;
}

.c-nearby-search__button button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: calc(3px + var(--slope-1px) * 1);
  width: calc(100px + var(--slope-1px) * 10);
  height: 100%;
  margin: 0;
  padding-inline: 8px;
  outline: none;
  border: 0;
  border-radius: 0;
  background: var(--base-color);
  color: #fff;
  font-weight: 350;
  font-size: calc(15px + var(--slope-1px) * 1);
  cursor: pointer;
  transition: opacity .2s ease-out;
}

.c-nearby-search__button button:hover {
  opacity: .8;
}

.c-nearby-search__button button > i {
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: calc(18px + var(--slope-1px) * 2);
  min-width: 0%;
  aspect-ratio: 1 / 1;
}

.c-nearby-search__button button > i svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.c-nearby-search__button button > i svg path {
  fill: currentColor;
}

@media screen and (max-width: 767px) {
  .c-nearby-search__button button {
    width: auto;
  }
}

.c-nearby-search__gps {
  display: none;
}

@media screen and (max-width: 767px) {
  .c-nearby-search__gps {
    display: block;
    margin-top: 16px;
  }
}

/* c-nearby-result
=============================== */
.c-nearby-result {
  display: none;
}

.c-nearby-result__list {
  display: none;
  margin-top: calc(40px + var(--slope-1px) * 24);
}

.c-nearby-result__foot {
  margin-top: calc(24px + var(--slope-1px) * 8);
}

.c-nearby-result__button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(180px + var(--slope-1px) * 100);
  height: 46px;
  margin-inline: auto;
  border: 1px solid var(--border-color);
  background: #fff;
  color: var(--base-color);
  text-decoration: none;
  font-weight: 500;
  font-size: calc(13px + var(--slope-1px) * 1);
  cursor: pointer;
  transition: opacity .3s ease-out;
}

.c-nearby-result__button:hover {
  opacity: .6;
}

.c-nearby-result__loading {
  display: block;
  width: 100%;
  padding: 1em;
  text-align: center;
}

.c-nearby-result__loading:before {
  content: "\691C\7D22\4E2D...";
  color: #fff;
}

/* c-showroom-nearby-item
============================== */
.c-showroom-nearby-item {
  width: 100%;
  padding: calc(20px + var(--slope-1px) * 12) calc(20px + var(--slope-1px) * 4);
  border: 1px solid var(--border-color);
  background: #fff;
  color: var(--base-color);
}

.c-showroom-nearby-item:not(:first-child) {
  margin-top: 24px;
}

.c-showroom-nearby-item__head {
  position: relative;
  display: flex;
  align-items: center;
  padding: 1.8rem 1em;
  background: var(--bg-color);
  color: var(--base-color);
  text-decoration: none;
  font-size: 2rem;
  transition: background .3s ease-out;
}

.c-showroom-nearby-item__head:hover {
  background: var(--border-color);
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item__head {
    flex-wrap: wrap;
    padding-left: 2.5em;
  }
}

.c-showroom-nearby-item__rank {
  margin-right: .75em;
  font-style: normal;
  font-size: calc(20px + var(--slope-1px) * 8);
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item__rank {
    position: absolute;
    top: 2.475rem;
    left: 2rem;
  }
}

.c-showroom-nearby-item__name {
  margin-right: auto;
  color: var(--key-text-color);
  text-decoration: underline;
  font-weight: 500;
  font-size: calc(18px + var(--slope-1px) * 6);
}

.c-showroom-nearby-item__head:hover .c-showroom-nearby-item__name {
  text-decoration: none;
}

.c-showroom-nearby-item__distance {
  margin-left: 2em;
  font-size: calc(14px + var(--slope-1px) * 2);
}

.c-showroom-nearby-item__distance:after {
  content: 'km';
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item__distance {
    width: 100%;
    margin-left: 0;
  }
}

.c-showroom-nearby-item__body {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: calc(28px + var(--slope-1px) * -8) 20px 0;
  font-size: calc(14px + var(--slope-1px) * 2);
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item__body {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    padding-inline: 0;
  }
}

.c-showroom-nearby-item__address {
  display: flex;
  align-items: center;
}

.c-showroom-nearby-item__hour {
  display: flex;
  align-items: center;
}

.c-showroom-nearby-item__close {
  display: flex;
  align-items: center;
  margin-top: .25em;
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item__tel {
    width: 100%;
    margin-top: 12px;
  }
}

.c-showroom-nearby-item__foot {
  margin-top: 40px;
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item__foot {
    margin-top: 16px;
  }
}

.c-showroom-nearby-item-tel {
  display: flex;
  align-items: center;
  color: var(--key-text-color);
  text-decoration: none;
  font-weight: 500;
  font-size: calc(22px + var(--slope-1px) * 10);
  pointer-events: none;
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item-tel {
    pointer-events: auto;
  }
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item-tel {
    display: flex;
    justify-content: center;
    height: 2.18182em;
    border: 1px solid;
  }
}

.c-showroom-nearby-item-tel__icon {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 1.2em;
  height: 1.2em;
  margin-right: 5px;
}

.c-showroom-nearby-item-tel__icon svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.c-showroom-nearby-item-button {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 4.11765em;
  background: #333;
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 1.7rem;
  transition: opacity .3s ease-out;
}

.c-showroom-nearby-item-button:hover {
  opacity: .7;
}

.c-showroom-nearby-item-button:after {
  content: "";
  position: absolute;
  top: 0;
  right: 2rem;
  bottom: 0;
  display: block;
  width: .5em;
  height: .5em;
  margin: auto 0;
  border-top: 2px solid;
  border-right: 2px solid;
  transform: rotate(45deg);
}

.c-showroom-nearby-item-contact {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;

  place-content: center;
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item-contact {
    grid-template-columns: repeat(2, 1fr);
  }
}

.c-showroom-nearby-item-contact__item:first-child:last-child {
  grid-column: 2 / 4;
}

@media screen and (max-width: 767px) {
  .c-showroom-nearby-item-contact__item:first-child:last-child {
    grid-column: span 2;
  }
}

.c-showroom-nearby-item-contact__button {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
  width: 100%;
  height: calc(42px + var(--slope-1px) * 14);
  border: 0;
  background: var(--base-color);
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  font-size: calc(14px + var(--slope-1px) * 4);
  transition: all .2s ease-out;
}

.c-showroom-nearby-item-contact__button:hover {
  opacity: .7;
}

.c-showroom-nearby-item-contact__button > i {
  display: block;
  width: 1.44444em;
  height: 1.44444em;
}

.c-showroom-nearby-item-contact__button > i svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* c-nearby-nav-container
============================== */
.c-nearby-nav-container {
  margin-top: 16px;
}

body[data-id=showroom] .c-nearby-nav-container {
  display: none;
}

@media screen and (min-width: 768px) {
  .c-nearby-nav-container {
    padding-top: 10px;
  }
}

/* c-nearby-nav
============================== */
.c-nearby-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: underline;
  font-size: calc(14px + var(--slope-1px) * 1);
}

.c-nearby-nav:hover {
  text-decoration: none;
}

.c-nearby-nav > i {
  flex-shrink: 0;
  width: calc(24px + var(--slope-1px) * 4);
  aspect-ratio: 1 / 1;
}

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

recommend

* ============================================================= */
/* c-recommend
============================== */
.c-recommend {
  position: relative;
  left: 50%;
  z-index: 1;
  width: var(--width);
  transform: translateX(-50%);

  --width: calc(var(--vw) * 100);
}

@media screen and (max-width: 767px) {
  .c-recommend {
    --width: calc(100% + var(--inner-padding) * 2);
  }
}

.c-recommend__inner {
  position: relative;
  z-index: 6;
  display: grid;
  align-items: center;
  grid-template-columns: 344px calc(100% - 344px);
  grid-template-areas: "head body" "foot body";
  gap: calc(32px + var(--slope-1px) * 8) 0;
  margin-left: var(--inner-overflow);
  padding-block: calc(48px + var(--slope-1px) * 12);
  background: #fff;
}

@media screen and (max-width: 1150px) {
  .c-recommend__inner {
    margin-left: 0;
  }
}

@media screen and (max-width: 767px) {
  .c-recommend__inner {
    grid-template-columns: 100%;
    grid-template-areas: "head" "body" "foot";
    padding-left: var(--inner-padding);
  }
}

.c-recommend__head {
  display: grid;
  align-self: flex-end;
  grid-template-columns: 100%;
  grid-area: head;
  gap: calc(22px + var(--slope-1px) * 3);
  padding-left: 60px;
}

@media screen and (max-width: 767px) {
  .c-recommend__head {
    padding-left: 0;
  }
}

.c-recommend__body {
  grid-area: body;
  overflow: hidden;
}

.c-recommend__foot {
  align-self: flex-start;
  grid-area: foot;
}

.c-recommend__title {
  margin-block: var(--leading-trim);
  font-weight: 400;
  font-size: 30px;
  font-family: var(--point-font-family);
}

.c-recommend__lead {
  margin-block: var(--leading-trim);
}

/* c-recommend-slider
============================== */
.c-recommend-slider {
  width: 105.95745%;
  margin-left: -16px;

  --slider-wrapper-width: calc(100 * var(--vw) - var(--inner-overflow) - 344px);
  --slider-width: calc(var(--slider-wrapper-width) / 940 * 996);
  --slide-width: calc(var(--slider-width) / 3);
  --slide-height: calc(var(--slide-width) - 16px * 2);
}

.c-recommend-slider:not(.slick-initialized) {
  height: var(--slide-height);
}

@media screen and (max-width: 767px) {
  .c-recommend-slider {
    overflow: visible;
    width: 79.43662%;

    --slider-wrapper-width: calc(100 * var(--vw));
    --slider-width: calc(var(--slider-wrapper-width) / 375 * 282);
    --slide-width: calc(var(--slider-width));
  }
  .c-recommend-slider .slick-list {
    overflow: visible;
  }
}

.c-recommend-slider__item {
  width: 332px;
  padding-inline: 16px;
}

.c-recommend-slider__item a {
  display: block;
  transition: all .2s;
}

.c-recommend-slider__item a:hover {
  opacity: .7;
}

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

showroom

* ============================================================= */
/* c-sr-sticky
============================== */
@media screen and (min-width: 768px) {
  .c-sr-sticky {
    display: none !important;
  }
}

/* c-showroom-head-info
============================== */
.c-showroom-head-info {
  display: flex;
  flex-wrap: wrap;
  margin-block: var(--leading-trim);
  font-size: calc(15px + var(--slope-1px) * 1);
}

@media screen and (max-width: 767px) {
  .c-showroom-head-info {
    flex-direction: column;
  }
}

@media screen and (min-width: 768px) {
  .c-showroom-head-info__item:not(:last-child):after {
    content: "\ff5c";
  }
}

/* c-sr-head-info
============================== */
.c-sr-head-info {
  position: relative;
  left: 50%;
  display: grid;
  grid-template-columns: 100%;
  gap: 14px;
  width: calc(100 * var(--vw));
  padding: calc(12px + var(--slope-1px) * 11) var(--inner-padding);
  background: #fff;
  transform: translateX(-50%);
}

@media screen and (min-width: 961px) {
  .c-sr-head-info {
    width: 560px;
    padding-inline: 43px;
  }
}

.c-sr-head-info__button {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 7px;
}

.c-sr-head-info__button ._desktop {
  display: none;
}

@media screen and (min-width: 961px) {
  .c-sr-head-info__button {
    grid-template-columns: 100%;
    grid-row: 2 / 3;
  }
  .c-sr-head-info__button .c-button[href^="tel:"] {
    display: none;
  }
  .c-sr-head-info__button ._desktop {
    display: block;
  }
  .c-sr-head-info__button ._mobile {
    display: none;
  }
}

.c-sr-head-info__body {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 12px 14px;
}

.c-sr-head-info__tel {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 32px;
}

@media screen and (max-width: 960px) {
  .c-sr-head-info__tel {
    display: none;
  }
}

.c-sr-head-info__tel > i {
  display: block;
  flex-shrink: 0;
  width: 26px;
}

.c-sr-head-info__item {
  display: block;
  margin-block: var(--leading-trim);
  font-size: 13px;
  line-height: 1.7;
}

@media screen and (max-width: 960px) {
  .c-sr-head-info__item {
    display: flex;
    justify-content: center;
  }
  .c-sr-head-info__item > p + p:before {
    content: "\ff5c";
  }
}

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

Sitemap

* ============================================================= */
/* c-sitemap
============================== */
.c-sitemap {
  display: grid;
  align-items: flex-start;
  grid-template-rows: auto auto auto 1fr;
  grid-template-columns: repeat(5, auto);
  grid-template-areas: "showroom newcar maintenance carlife company" "showroom newcar maintenance campaign company" "showroom usedcar maintenance campaign recruit" "showroom usedcar maintenance campaign contact";
  gap: 48px 46px;
}

@media screen and (max-width: 767px) {
  .c-sitemap {
    grid-template-columns: 100%;
    grid-template-areas: "showroom" "newcar" "usedcar" "maintenance" "carlife" "campaign" "company" "recruit" "contact";
    gap: 0;
  }
}

.c-sitemap__col {
  display: contents;
}

@media screen and (max-width: 767px) {
  .c-sitemap-box {
    border-bottom: 1px solid var(--border-color-dark);
  }
}

.c-sitemap-box[data-category=showroom] {
  grid-area: showroom;
}

.c-sitemap-box[data-category=newcar] {
  grid-area: newcar;
}

.c-sitemap-box[data-category=usedcar] {
  grid-area: usedcar;
}

.c-sitemap-box[data-category=maintenance] {
  grid-area: maintenance;
}

.c-sitemap-box[data-category=carlife] {
  grid-area: carlife;
}

.c-sitemap-box[data-category=campaign] {
  grid-area: campaign;
}

.c-sitemap-box[data-category=company] {
  grid-area: company;
}

.c-sitemap-box[data-category=recruit] {
  grid-area: recruit;
}

.c-sitemap-box[data-category=contact] {
  grid-area: contact;
}

.c-sitemap-box__head {
  line-height: 1;
}

.c-sitemap-box__toggle {
  padding: 0;
  outline: none;
  border: 0;
  background: none;
  color: currentColor;
  text-align: left;
  font-weight: 400;
  font-size: calc(16px + var(--slope-1px) * 2);
  font-family: var(--point-font-family);
  line-height: 1;
  pointer-events: none;
  appearance: none;
}

@media screen and (max-width: 767px) {
  .c-sitemap-box__toggle {
    display: grid;
    align-items: center;
    grid-template-columns: 1fr auto;
    gap: 8px;
    width: 100%;
    padding-block: 20px;
    pointer-events: auto;
  }
  .c-sitemap-box__toggle:after {
    content: "";
    display: block;
    width: 17px;
    aspect-ratio: 1 / 1;
    background: currentColor;
    mask: var(--icon-plus) 50% 50%/contain no-repeat;
  }
  .c-sitemap-box__toggle.is-open:after {
    mask-image: var(--icon-minus);
  }
}

.c-sitemap-box__body {
  padding-top: 24px;
  padding-left: 16px;
  font-size: 13px;
}

@media screen and (min-width: 768px) {
  .c-sitemap-box__body {
    display: block !important;
  }
}

@media screen and (max-width: 767px) {
  .c-sitemap-box__body {
    display: none;
    padding: 16px 0 32px 16px;
  }
}

/* c-sitemap-pages
============================== */
.c-sitemap-pages {
  display: grid;
  gap: 1em;
  line-height: 1.2;
}

.c-sitemap-pages > li {
  margin-block: var(--leading-trim);
}

.c-sitemap-pages > li a {
  text-decoration: none;
}

.c-sitemap-pages > li a:hover {
  text-decoration: underline;
}

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

Topics

* ============================================================= */
/* c-topics
============================== */
.c-topics {
  background: var(--border-dashed);
  background-position: left top;
}

.c-topics__item {
  background: var(--border-dashed);
}

.c-topics .topics-link {
  display: grid;
  grid-template-columns: 100%;
  gap: 10px;
  padding: 15px 15px 20px;
  text-decoration: none;
  font-size: calc(14px + var(--slope-1px) * 2);
  transition: all .2s ease-out;
}

.c-topics .topics-link:hover {
  color: var(--key-color);
}

.c-topics .topics-link__head {
  width: fit-content;
  padding: 8px;
  border-radius: 8px 8px 0px 8px;
  background: var(--key-color);
  color: #fff;
  font-weight: 700;
  font-size: calc(12px + var(--slope-1px) * 2);
  font-size: calc(14px + var(--slope-1px) * 2);
  line-height: 1;
}

.c-topics .topics-link__body {
  margin-block: var(--leading-trim);
  line-height: 1.5;
}

/* c-topics-toggle
============================== */
.c-topics-toggle {
  display: flex;
  align-items: center;
  gap: calc(5px + var(--slope-1px) * 3);
  width: fit-content;
  margin-inline: auto;
  margin-top: calc(20px + var(--slope-1px) * 5);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  font-weight: 400;
  font-size: calc(14px + var(--slope-1px) * 2);
  font-family: var(--en-font-family);
  transition: all .2s ease-out;
}

.c-topics-toggle:hover {
  opacity: .6;
}

.c-topics-toggle:after {
  content: "";
  flex-shrink: 0;
  width: calc(9px + var(--slope-1px) * 1);
  height: calc(9px + var(--slope-1px) * 1);
  background: currentColor;
  mask: var(--icon-angle) 50% 50%/contain no-repeat;
  transform: rotate(90deg);
}

.c-topics-toggle > span:last-child {
  display: none;
}

.c-topics-toggle.is-show > span:first-child {
  display: none;
}

.c-topics-toggle.is-show > span:nth-child(2) {
  display: block;
}

.c-topics-toggle.is-show:after {
  transform: rotate(270deg);
}

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

Scroll Bar

* ============================================================= */
[data-simplebar] {
  position: relative;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: flex-start;
}

.simplebar-wrapper {
  overflow: hidden;
  width: inherit;
  height: inherit;
  max-width: inherit;
  max-height: inherit;
}

.simplebar-mask {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  overflow: hidden;
  width: auto !important;
  height: auto !important;
  margin: 0;
  padding: 0;
  direction: inherit;
}

.simplebar-offset {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-overflow-scrolling: touch;
  box-sizing: inherit !important;
  margin: 0;
  padding: 0;
  resize: none !important;
  direction: inherit !important;
}

.simplebar-content-wrapper {
  position: relative;
  display: block;
  box-sizing: border-box !important;
  width: auto;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  direction: inherit;

  scrollbar-width: none;
  -ms-overflow-style: none;
}

.simplebar-content-wrapper::-webkit-scrollbar,
.simplebar-hide-scrollbar::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.simplebar-content:before,
.simplebar-content:after {
  content: ' ';
  display: table;
}

.simplebar-placeholder {
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  pointer-events: none;
}

.simplebar-height-auto-observer-wrapper {
  position: relative;
  z-index: -1;
  float: left;
  flex-grow: inherit;
  flex-shrink: 0;
  flex-basis: 0;
  overflow: hidden;
  box-sizing: inherit !important;
  width: 100%;
  height: 100%;
  max-width: 1px;
  max-height: 1px;
  margin: 0;
  padding: 0;
  pointer-events: none;
}

.simplebar-height-auto-observer {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  display: block;
  overflow: hidden;
  box-sizing: inherit;
  width: 1000%;
  height: 1000%;
  min-width: 1px;
  min-height: 1px;
  opacity: 0;
  pointer-events: none;
}

.simplebar-track {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
  overflow: hidden;
  background: rgba(200, 200, 200, .3);
  /* pointer-events: none; */
}

[data-simplebar].simplebar-dragging .simplebar-content {
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

[data-simplebar].simplebar-dragging .simplebar-track {
  pointer-events: all;
}

.simplebar-scrollbar {
  position: absolute;
  right: 0;
  left: 0;
  min-height: 10px;
}

.simplebar-scrollbar:before {
  content: '';
  position: absolute;
  right: 2px;
  left: 2px;
  border-radius: 12px;
  background: var(--key-color);
  transition: opacity 0s linear;
}

.simplebar-track.simplebar-vertical {
  top: 0;
  width: 11px;
}

.simplebar-track.simplebar-vertical .simplebar-scrollbar:before {
  top: 2px;
  bottom: 2px;
}

.simplebar-track.simplebar-horizontal {
  bottom: 3px;
  left: 0;
  overflow: visible;
  width: 100%;
  height: 6px;
  max-width: 952px;
  margin: 0 auto;
}

.simplebar-track.simplebar-horizontal.is-fixed {
  position: fixed;
  top: auto;
}

.simplebar-track.simplebar-horizontal .simplebar-scrollbar {
  top: auto;
  right: auto;
  bottom: -3px;
  left: 0;
  width: auto;
  height: 12px;
  min-width: 10px;
  min-height: 0;
  margin: auto 0;
  border-radius: 12px;
  background: var(--key-color);
}

/* Rtl support */
[data-simplebar-direction='rtl'] .simplebar-track.simplebar-vertical {
  right: auto;
  left: 0;
}

.hs-dummy-scrollbar-size {
  position: fixed;
  visibility: hidden;
  overflow-x: scroll;
  overflow-y: hidden;
  width: 500px;
  height: 500px;
  opacity: 0;
  direction: rtl;
}

.simplebar-hide-scrollbar {
  position: fixed;
  left: 0;
  visibility: hidden;
  overflow-y: scroll;

  scrollbar-width: none;
  -ms-overflow-style: none;
}

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

Utility

* ============================================================= */
/* Media Query Setting
====================================== */
.u-tablet-block {
  display: none !important;
}

@media screen and (max-width: 767px) {
  .u-tablet-block {
    display: block !important;
  }
}

.u-tablet-inline-block {
  display: none !important;
}

@media screen and (max-width: 767px) {
  .u-tablet-inline-block {
    display: inline-block !important;
  }
}

.u-tablet-flex {
  display: none !important;
}

@media screen and (max-width: 767px) {
  .u-tablet-flex {
    display: flex !important;
  }
}

@media screen and (max-width: 767px) {
  .u-tablet-none {
    display: none !important;
  }
}

.u-mobile-block {
  display: none !important;
}

@media screen and (max-width: 560px) {
  .u-mobile-block {
    display: block !important;
  }
}

.u-mobile-inline-block {
  display: none !important;
}

@media screen and (max-width: 560px) {
  .u-mobile-inline-block {
    display: inline-block !important;
  }
}

.u-mobile-flex {
  display: none !important;
}

@media screen and (max-width: 560px) {
  .u-mobile-flex {
    display: flex !important;
  }
}

@media screen and (max-width: 560px) {
  .u-mobile-none {
    display: none !important;
  }
}

/* text align
====================================== */
.u-ta-left {
  text-align: left !important;
}

.u-ta-right {
  text-align: right !important;
}

.u-ta-center {
  text-align: center !important;
}

/* display
====================================== */
.u-d-block {
  display: block !important;
}

.u-d-none {
  display: none !important;
}

.u-d-inline {
  display: inline !important;
}

.u-d-ib {
  display: inline-block !important;
}

/* position
====================================== */
.u-pos-static {
  position: static !important;
}

.u-pos-relative {
  position: relative !important;
}

.u-pos-absolute {
  position: absolute !important;
}

.u-pos-fixed {
  position: fixed !important;
}

/* clear
====================================== */
.u-clearfix:after {
  content: "";
  display: block;
  visibility: hidden;
  clear: both;
}

/* other
====================================== */
.u-strong {
  font-weight: bold !important;
}

.u-pointer {
  cursor: pointer;
}

.u-nowrap {
  white-space: nowrap;
}

.u-color-honda {
  color: #cc0000 !important;
}

.u-color-ciao {
  color: #0068b6 !important;
}

.u-color-mamoru {
  color: #8fc31f !important;
}

.u-rotate-90 {
  transform: rotate(90deg);
}

/* animationn
====================================== */
.u-no-transition {
  transition: none !important;
}