@charset "UTF-8";
/* *** variables model *** */
/* radius */
/* *** common variables *** */
/* break point */
/* hover style */
/* color */
/* One-Tone */
/* Two-Tone */
/* *** mixins *** */
/* break point */
/* hover */
/* --- 10px = 1rem --- */
.bev-contents {
  /* 共通スタイル */
  /* メインビジュアル */
  /* 4つの基本 */
  /* BEV LINE UP */
  /* HV Link */
}
@media (min-width: 769px) {
  .bev-contents .pc-no-gap {
    gap: 0;
  }
}
.bev-contents .main-visual {
  position: relative;
}
.bev-contents .main-visual .logo-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media (min-width: 769px) {
  .bev-contents .main-visual .logo-wrap {
    width: clamp(24rem, 9.301rem + 19.11vw, 46rem);
  }
}
@media (max-width: 768px) {
  .bev-contents .main-visual .logo-wrap {
    width: clamp(24rem, 0rem + 75vw, 57.6rem);
  }
}
.bev-contents .main-visual .catchcopy {
  margin-block-start: 1em;
  color: var(--white);
  font-weight: var(--fwBold);
  font-feature-settings: "palt";
  letter-spacing: 0.05em;
  text-align: center;
}
@media (min-width: 769px) {
  .bev-contents .main-visual .catchcopy {
    font-size: clamp(1rem, 0.332rem + 0.87vw, 2rem);
  }
}
@media (max-width: 768px) {
  .bev-contents .main-visual .catchcopy {
    font-size: clamp(1rem, -0.071rem + 3.35vw, 2.5rem);
  }
}
.bev-contents .four-basic-area .four-basic-contents {
  background-image: url(/bev/common_bev/images/bg_basic.webp);
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents {
    padding-block: 2.4rem 5.6rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents {
    padding-block-end: 7.2rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents h2.logottl {
  max-width: 340px;
  margin-inline: auto;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li {
  /* タイトル */
  /* コンテンツ */
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li:not(:last-of-type) {
    margin-block-end: 4.8rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li:not(:last-of-type) {
    margin-block-end: var(--contentMg);
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .ls-4basic-inner {
  background: var(--white);
  border-radius: 10px;
  position: relative;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .ls-4basic-inner {
    padding: 4.8rem 4rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .ls-4basic-inner {
    padding: 3.2rem 1.6rem 2rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .ttl_basic {
  margin-inline: auto;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .ttl_basic {
    width: 150px;
    margin-block-end: 2.4rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .ttl_basic {
    width: min(31%, 220px);
    margin-block-end: 2rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .icn_basic {
  margin-inline: auto;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .icn_basic {
    margin-block-end: 1.6rem;
    width: 200px;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .icn_basic {
    margin-block-end: 2rem;
    width: min(31.8%, 480px);
  }
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .txt-qa {
    font-size: 140%;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .txt-qa {
    font-size: 2.4rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .question-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 0.8em;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .question-wrap {
    font-size: 2.4rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .question-wrap {
    font-size: 2.2rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .question-wrap .txt-question {
  padding-inline-start: 0.8em;
  border-inline-start: 1px solid var(--silver);
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .answer-wrap {
  margin-block-start: 2rem;
  padding-block-start: 1.6rem;
  border-block-start: 1px solid var(--silver);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4em 0.8em;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .answer-wrap {
    font-size: 2.4rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .answer-wrap {
    flex-direction: column;
    font-size: 2rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .answer-wrap .txt-answer {
  font-weight: var(--fwBold);
  line-height: 1.4;
  word-break: auto-phrase;
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .answer-wrap .txt-answer {
    text-align: center;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap {
  /* コンポーネント上書き */
  /* Modifier */
  /* タイトル */
  /* ul（flexスタイル） */
  /* 各キホンオリジナルレイアウト */
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap {
    margin-block-start: 4rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap {
    margin-block-start: 2.4rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap.grey-box,
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .grey-box {
  padding: 2.4rem;
  border-radius: 5px;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .grey-box + .grey-box {
  margin-block-start: 0;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .sp-scroll-notice span {
  background-color: var(--white);
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .b-gray {
  border: solid 1px var(--greyK20);
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bg-white-area {
  background-color: var(--white);
  padding: 2rem;
  border-radius: 10px;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .h4ttl {
  line-height: 0;
  text-align: center;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .h4ttl span {
  padding: 0.5rem 2.4rem;
  background-color: var(--white);
  color: var(--keyColor);
  border: 3px solid;
  border-radius: 5px;
  line-height: 1.4;
  font-weight: var(--fwBold);
  display: inline-block;
  word-break: auto-phrase;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .h4ttl span:not(.pc-ver-s) {
    font-size: clamp(2rem, 0.668rem + 1.73vw, 2.4rem);
  }
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .h4ttl span.pc-ver-s {
    padding: 0.5rem 1rem;
    font-size: clamp(1.4rem, 0.068rem + 1.73vw, 1.8rem);
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .h4ttl span {
    font-size: 1.8rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .h5ttl {
  line-height: 0;
  text-align: center;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .h5ttl span {
  padding: 0.4em 1em;
  background-color: var(--keyColor);
  color: var(--white);
  border-width: 3px;
  border-radius: 5px;
  line-height: 1.2;
  font-weight: var(--fwBold);
  display: inline-block;
  word-break: auto-phrase;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .h5ttl span {
    width: min(100%, 330px);
    font-size: clamp(1.4rem, 0.734rem + 0.87vw, 1.6rem);
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .h5ttl span {
    width: 100%;
    font-size: 1.4rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .sub-ttl {
  text-align: center;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .sub-ttl:not(.pc-ver-s) {
    font-size: 2.4rem;
  }
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .sub-ttl.pc-ver-s {
    font-size: 1.8rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .sub-ttl {
    font-size: 1.8rem;
  }
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-list > li:first-of-type {
    width: 36%;
  }
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-list > li:last-of-type {
    flex: 1;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-img-list {
  padding: 0;
  display: flex;
  gap: 1.6rem;
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-img-list {
    flex-direction: column;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-img-list > li {
  display: flex;
  align-items: center;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-img-list > li:first-of-type {
  padding: 1.6rem;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-img-list > li:first-of-type {
    flex-basis: 60%;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-img-list > li:first-of-type {
    justify-content: center;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-img-list > li:last-of-type {
  background-color: #2A589E;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-img-list > li:last-of-type {
    flex: 1;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .charging-img-list > li:last-of-type {
    padding: 1.6rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap p {
  line-height: 1.6;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap p {
    width: fit-content;
    margin-inline: auto;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap .bev-typ-wrap > li:not(:last-of-type) {
  position: relative;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap .bev-typ-wrap > li:not(:last-of-type)::after {
  content: "";
  background-color: var(--black);
  position: absolute;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap .bev-typ-wrap > li:not(:last-of-type)::after {
    width: 1px;
    height: 100%;
    top: 0;
    right: -12px;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap .bev-typ-wrap > li:not(:last-of-type)::after {
    width: 100%;
    height: 1px;
    bottom: -12px;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap .bev-typ-wrap span:not(.no-break) {
  display: block;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap .bev-typ-wrap .label-subaru {
  width: fit-content;
  border: solid 1px currentColor;
  border-radius: 100px;
  font-weight: var(--fwBold);
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap .bev-typ-wrap .label-subaru {
    margin-inline: auto;
    margin-block-end: 1rem;
    padding: 4px 16px;
    font-size: 1.4rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap .bev-typ-wrap .label-subaru {
    margin-block-end: 0.8rem;
    padding: 2px 8px;
    font-size: 1rem;
  }
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .bev-lead-wrap .bev-typ-wrap figure {
    margin-inline: auto;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev th,
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev td {
  padding: 1rem;
  border: solid 1px #B3B3B3;
  text-align: center;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev th,
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev td {
    font-size: clamp(1.4rem, 0.068rem + 1.73vw, 1.8rem);
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev th,
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev td {
    font-size: 1.4rem;
  }
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev th:not(.txt-s),
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev td:not(.txt-s) {
  font-weight: var(--fwBold);
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev th {
  background-color: #E6E6E6;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev th.col1 {
  width: 17.44%;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev th.col2 {
  width: 27.45%;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev td {
  background-color: var(--white);
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev .bg-bev {
  background-color: #DCF5FA;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev .txt-bev {
  color: var(--keyColor);
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev .bg-hv {
  background-color: #D9F7DD;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev .txt-hv {
  color: #39B54A;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev .bg-gs {
  background-color: #F2DADA;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap table.table-bev .txt-gs {
  color: #CC5256;
}
.bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .notice-wrap {
  padding: 0.8rem;
  border: solid 1px var(--greyK80);
  font-weight: 700;
  text-align: center;
}
@media (min-width: 769px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .notice-wrap {
    font-size: 1.4rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .four-basic-area .four-basic-contents .ls-4basic > li .basic-wrap .notice-wrap {
    font-size: 1.2rem;
  }
}
.bev-contents .lineup-area {
  color: var(--white);
  background: var(--black);
}
@media (min-width: 769px) {
  .bev-contents .lineup-area {
    padding-block: 5rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .lineup-area {
    padding-block: 4rem;
  }
}
.bev-contents .lineup-area h2.logottl {
  max-width: 386px;
  margin-inline-start: -28px;
  margin-inline-end: -28px;
}
.bev-contents .lineup-area .item-model .txt-content > div {
  border-bottom: solid 0.01em;
}
.bev-contents .lineup-area .item-model .txt-content > div:not(.txt-link-wrap) {
  padding: 8px 24px 8px 0;
}
@media (min-width: 769px) {
  .bev-contents .lineup-area .item-model .img-wrap {
    flex-basis: 50%;
  }
}
@media (max-width: 768px) {
  .bev-contents .lineup-area .item-model .img-wrap {
    width: calc(100% + 32px);
    margin-inline-start: -16px;
  }
}
.bev-contents .lineup-area .item-model .model-info-wrap span {
  display: block;
}
.bev-contents .lineup-area .item-model .model-info-wrap .model-name {
  font-size: 200%;
}
.bev-contents .lineup-area .item-model .bc_modal_movie {
  width: fit-content;
  padding-inline-end: 24px;
  transition: var(--transition);
}
.bev-contents .lineup-area .item-model .bc_modal_movie::after {
  width: 24px;
  height: 24px;
  top: 50%;
  left: auto;
  right: 0;
  transform: translateY(-50%);
  background-position: center;
  background-size: contain;
}
.bev-contents .lineup-area .item-model .bc_modal_movie:hover {
  text-decoration: underline;
  text-decoration-color: currentColor;
  text-underline-offset: 3px;
}
.bev-contents .hybrid-links-area .hybrid-lead {
  width: fit-content;
  margin-inline: 8%;
  margin-block-end: 3.2rem;
  padding-inline: min(8%, 3.2rem);
  line-height: 1.75;
  position: relative;
}
@media (min-width: 769px) {
  .bev-contents .hybrid-links-area .hybrid-lead {
    font-size: 2rem;
  }
}
@media (max-width: 768px) {
  .bev-contents .hybrid-links-area .hybrid-lead {
    font-size: 1.8rem;
  }
}
.bev-contents .hybrid-links-area .hybrid-lead::before, .bev-contents .hybrid-links-area .hybrid-lead::after {
  content: "";
  width: 2px;
  height: calc(100% + 0.5em);
  background-color: #00406B;
  position: absolute;
  top: 0;
}
.bev-contents .hybrid-links-area .hybrid-lead::before {
  left: 0;
  transform: rotate(-15deg);
}
.bev-contents .hybrid-links-area .hybrid-lead::after {
  right: 0;
  transform: rotate(15deg);
}
.bev-contents .hybrid-links-area a {
  display: block;
  position: relative;
  margin-bottom: 20px;
}
.bev-contents .hybrid-links-area a .arrow-link {
  font-weight: 700;
  color: var(--white);
  position: absolute;
}
@media (min-width: 769px) {
  .bev-contents .hybrid-links-area a .arrow-link {
    top: 50%;
    left: 4%;
    transform: translateY(-50%);
    font-size: clamp(1.2rem, 0.774rem + 0.55vw, 1.4rem);
  }
}
@media (max-width: 768px) {
  .bev-contents .hybrid-links-area a .arrow-link {
    padding-inline-start: 24px;
    bottom: 16px;
    font-size: clamp(1.4rem, 0.686rem + 2.23vw, 2.4rem);
    width: 100%;
  }
}
.bev-contents .hybrid-links-area a .arrow-link::after {
  width: 2em;
  height: 2em;
}
@media (min-width: 769px) {
  .bev-contents .hybrid-links-area a .arrow-link::after {
    right: -4%;
  }
}
@media (max-width: 768px) {
  .bev-contents .hybrid-links-area a .arrow-link::after {
    right: 16px;
  }
}/*# sourceMappingURL=top.css.map */


