@charset "utf-8";
/*
theme Name: AB_brand site
Author: XXXX
Description: original theme
version： 1.0.0
*/

/* *************************************************************** */
/* グローバル変数定義                                                 */
/* *************************************************************** */
/*                                                                 */
/*                                                                 */
/*                                                                 */
/*                                                                 */
/* *************************************************************** */
:root {
  --global_color: #fff;
  --transparent_color: transparent;

  --Background-accent-orange: #fff8ec;
  --Background-invert: #3d3d3d;
  --Background-mv: #101010;
  --Background-primary: #fff;
  --Background-secondary: #f5f5f5;
  --Background-tertiary: #002368;
  --Background-modal: rgba(0, 0, 0, 0.8);
  --Background-scroll-hint: rgba(41, 41, 41, 0.8);

  --Button-Disable-foreground: #bdbdbd;
  --Button-Elevate-background: #fff;
  --Button-Elevate-foreground: #3d3d3d;
  --Button-Icon-outline: #3d3d3d;
  --Button-Icon-background: #fff;
  --Button-Outlined-background: #fff;
  --Button-Outlined-foreground: #3d3d3d;
  --Button-Outlined-outline: #bdbdbd;
  --Button-Primary-background: #fa6703;
  --Button-Primary-foreground: #fff;
  --Button-Secondary-background: #525252;
  --Button-Secondary-foreground: #fff;

  --Border-secondary: #f5f5f5;

  --Tag-background-focused: #525252;
  --Tag-foreground-enabled: #3d3d3d;
  --Tag-foreground-disable: #bdbdbd;
  --Tag-outline-enabled: #bdbdbd;
  --Tag-outline-disable: #bdbdbd;
  --Tag-background-enabled: #fff;
  --Surface-primary: #fff;
  --Orange-200: #ffdda7;
  --Orange-300: #ffc36e;
  --Neutral-300: #bdbdbd;
  --Neutral-400: #989898;
  --Neutral-500: #7c7c7c;
  --Icon-primary: #292929;
  --Icon-invert: #fff;
  --Icon-accent-orange: #fa6703;
  --Icon-disabled: #bdbdbd;

  --Table-cell-title-border: #bdbdbd;
  --Table-cell-title: #dcdcdc;
  --Table-border: #dcdcdc;

  --Text-primary: #292929;
  --Text-secondary: #3d3d3d;
  --Text-tertiary: #656565;
  --Text-accent-orange: #fa6703;
  --Text-invert: #fff;

  --Text-Field-border-enabled: #989898;
  --Text-Field-border-focused: #3d3d3d;
  --Text-Field-placeholder-enabled: #bdbdbd;
  --Text-Field-placeholder-focused: #3d3d3d;
  --Text-Field-background: #fff;

  --TextLink-Primary-default: #3d3d3d;
  --TextLink-Secondary-default: #5d80b1;

  --Divider-primary: #f5f5f5;
  --Divider-secondary: #fff;
  --Overlay-primary: rgba(0, 0, 0, 0.1);
  --box-shadow-color: rgba(41, 41, 41, 0.1);
  --Surface-secondary: #f5f5f5;
  --Surface-secondary-opacity-80: rgba(245, 245, 245, 0.8);

  --primary_font: "Noto Sans JP", sans-serif;
  --secondary_font: "Outfit";
  --primary_font_combine: "Noto Sans JP";

  --Typography-FontSize-fontsize-1: 12px;
  --Typography-FontSize-fontsize-2: 12px;
  --Typography-FontSize-fontsize-3: 14px;
  --Typography-FontSize-fontsize-4: 16px;
  --Typography-FontSize-fontsize-5: 18px;
  --Typography-FontSize-fontsize-7: 19px;
  --Typography-FontSize-fontsize-8: 24px;
  --Typography-FontSize-fontsize-9: 32px;
  --Typography-FontSize-fontsize-9_sp: 22px;
  --Typography-FontSize-fontsize-10: 30px;

  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semi-bold: 600;
  --font-weight-bold: 700;

  --Typography-LineHeight-lineheight-10: 1;
  --Typography-LineHeight-lineheight-11: 1.1;
  --Typography-LineHeight-lineheight-12: 1.2;
  --Typography-LineHeight-lineheight-13: 1.3;
  --Typography-LineHeight-lineheight-14: 1.4;
  --Typography-LineHeight-lineheight-15: 1.5;
  --Typography-LineHeight-lineheight-16: 1.6;

  --Typography-LetterSpacing-letterspacing-0: 0;
  --Typography-LetterSpacing-letterspacing-1: 0.7px;
  --Typography-LetterSpacing-letterspacing-2: 0.9px;
  --Typography-LetterSpacing-letterspacing-3: 1.1px;
  --Typography-LetterSpacing-letterspacing-4: 1.3px;
  --Typography-LetterSpacing-letterspacing-5: 1.4px;
  --Typography-LetterSpacing-letterspacing-5_sp: 1.1px;
  --Typography-LetterSpacing-letterspacing-6: 1.9px;

  --Spacing-spacing-0: 0;
  --Spacing-spacing-1: 0.3rem;
  --Spacing-spacing-2: 0.5rem;
  --Spacing-spacing-3: 1rem;
  --Spacing-spacing-4: 1rem;
  --Spacing-spacing-5: 1.5rem;
  --Spacing-spacing-5_fixed: 24px;
  --Slide_Spacing-spacing-5: 24px;
  --Spacing-spacing-6: 2rem;
  --Spacing-spacing-7: 2rem;
  --Spacing-spacing-7_fixed: 32px;
  --Spacing-spacing-8: 2.5rem;
  --Spacing-spacing-9: 3rem;
  --Spacing-spacing-10: 3.5rem;
  --Spacing-spacing-11: 4rem;
  --Spacing-spacing-11_fixed: 64px;
  --Spacing-spacing-12: 5rem;
  --Spacing-spacing-13: 6rem;
  --Spacing-spacing-14: 7rem;
  --Spacing-spacing-15: 7.5rem;
  --Spacing-spacing-18: 7.5rem;

  --Radius-radius-0: 0;
  --Radius-radius-1: 6px;
  --Radius-radius-2: 8px;
  --Radius-radius-3: 16px;
  --Radius-radius-4: 32px;
  --Radius-radius-5: 80px;
  --Radius-radius-10: 80px;
  --Radius-radius-full: 1000px;
  --Radius-radius-50: 50%;

  --Corner-small: 8px;

  --Opacity-hover: 0.6;
  --Opacity-hidden: 0;
  --Opacity-visibility: 1;
  --Opacity-tag_inactive: 0.8;

  --Transition-primary: 0.3s;
  --Transition-secondary: 0.5s;
  --Transition-tertiary: 0.8s;
  --Transition-quinary: 0.2s;
}
@media (max-width: 1600px) {
  :root {
    --Slide_Spacing-spacing-5: 21px;
  }
}
@media (max-width: 1400px) {
  :root {
    --Spacing-spacing-5: 1.3rem;
    --Slide_Spacing-spacing-5: 16.9px;
    --Spacing-spacing-11: 3rem;
    --Spacing-spacing-14: 5.5rem;
    --Spacing-spacing-18: 5rem;
  }
}

/* PC（画面サイズ：大） */
@media (max-width: 1199px) {
  :root {
    --Slide_Spacing-spacing-5: 15.6px;
  }
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  :root {
    --Slide_Spacing-spacing-5: 14.3px;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  :root {
    --Typography-FontSize-fontsize-1: 0.9rem;
    --Typography-FontSize-fontsize-2: 1rem;
    --Typography-FontSize-fontsize-3: 1.2rem;
    --Typography-FontSize-fontsize-4: 1.5rem;
    --Typography-FontSize-fontsize-5: 1.7rem;
    --Typography-FontSize-fontsize-8: 2rem;
    --Typography-FontSize-fontsize-9: 2.2rem;
    --Typography-FontSize-fontsize-10: 2.8rem;

    --Typography-LetterSpacing-letterspacing-1: 0.4px;
    --Typography-LetterSpacing-letterspacing-2: 0.6px;
    --Typography-LetterSpacing-letterspacing-3: 0.8px;
    --Typography-LetterSpacing-letterspacing-4: 1px;
    --Typography-LetterSpacing-letterspacing-5: 1.1px;
    --Typography-LetterSpacing-letterspacing-6: 1.5px;

    --Spacing-spacing-1: 0.2rem;
    --Spacing-spacing-2: 0.4rem;
    --Spacing-spacing-3: 0.8rem;
    --Spacing-spacing-4: 1.2rem;
    --Spacing-spacing-5: 1.6rem;
    --Spacing-spacing-5_fixed: 1.6rem;
    --Slide_Spacing-spacing-5: 16px;
    --Spacing-spacing-6: 2rem;
    --Spacing-spacing-7: 2.4rem;
    --Spacing-spacing-7_fixed: 2.4rem;
    --Spacing-spacing-8: 3.2rem;
    --Spacing-spacing-9: 4rem;
    --Spacing-spacing-10: 4.8rem;
    --Spacing-spacing-11: 5.6rem;
    --Spacing-spacing-11_fixed: 5.6rem;
    --Spacing-spacing-12: 6.4rem;
    --Spacing-spacing-13: 7.2rem;
    --Spacing-spacing-14: 8rem;
    --Spacing-spacing-15: 11.2rem;

    --Radius-radius-4: 20px;
    --Radius-radius-5: 32px;
  }
}

/*cssリセット*/
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
body {
  line-height: 1;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
nav ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}
del {
  text-decoration: line-through;
}
abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid var(--Divider-primary);
  margin: 1em 0;
  padding: 0;
}
input,
select {
  vertical-align: middle;
}

/* mac/ios用スタイルリセット */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="date"],
select {
  font-size: 1rem;
  border: 1px solid #ccc;
  height: 50px;
  -webkit-border-radius: 0;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
input[type="image"],
textarea {
  font-size: 1rem;
  border: 1px solid #ccc;
  -webkit-border-radius: 0;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/*サイト全体の基準となるCSSを記述*/
html {
  font-size: 16px;
  scroll-behavior: smooth;
  overflow-x: hidden;
  overscroll-behavior: none;
}

body {
  /*フォントの指定*/
  font-family:
    var(--primary_font_combine), "Calibri Light", "myriad-pro", "游明朝",
    "YuMincho", "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3",
    "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝";
  font-style: normal;
  letter-spacing: 0;
  color: #000000;
  background-color: var(--global_color);
  overflow-wrap: anywhere; /* 収まらない場合に折り返す */
  word-break: normal; /* 単語の分割はデフォルトに依存 */
  line-break: strict; /* 禁則処理を厳格に適用 */
  overscroll-behavior: none;
  -webkit-overflow-scrolling: touch;
}

/* スクロールバー幅分 */
html:has(.has_child:hover),
html:has(.local_menu_btn.open),
html:has(.modal.active) {
  overflow: hidden;
  padding-right: 6px;
}

html:has(.has_child:hover) .circle_btn_wrap,
html:has(.local_menu_btn.open) .circle_btn_wrap,
html:has(.modal.active) .circle_btn_wrap {
  right: calc(var(--Spacing-spacing-13) + 6px);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  html:has(.hamburger_overlay.active) {
    overflow: hidden;
  }
  /* スクロールバー幅分 */
  html:has(.has_child:hover),
  html:has(.local_menu_btn.open),
  html:has(.modal.active),
  html:has(.hamburger_overlay.active),
  html:has(.hamburger_overlay.active) .sp_header_wrap {
    padding-right: 4px;
  }
  html:has(.hamburger_overlay.active) .nav_overlay_content {
    width: calc(100% - 4px - var(--Spacing-spacing-7) * 2);
    padding-right: calc(var(--Spacing-spacing-7) + 4px);
  }
  html:has(.has_child:hover) .floating_btn_wrap:not(:has(.floating_btn_flex)),
  html:has(.local_menu_btn.open)
    .floating_btn_wrap:not(:has(.floating_btn_flex)),
  html:has(.modal.active) .floating_btn_wrap:not(:has(.floating_btn_flex)),
  html:has(.hamburger_overlay.active)
    .floating_btn_wrap:not(:has(.floating_btn_flex)) {
    left: calc(50% - (4px / 2) - ((34.2rem + 1rem * 2) / 2));
  }

  html:has(.has_child:hover) .floating_btn_wrap:has(.floating_btn_flex),
  html:has(.local_menu_btn.open) .floating_btn_wrap:has(.floating_btn_flex),
  html:has(.modal.active) .floating_btn_wrap:has(.floating_btn_flex),
  html:has(.hamburger_overlay.active)
    .floating_btn_wrap:has(.floating_btn_flex) {
    width: calc(100% - 4.5% * 2 - 4px);
  }

  html:has(.hamburger_overlay.active) header {
    position: fixed;
  }
  html:has(.hamburger_overlay.active) main {
    padding-top: 6.4rem;
  }
  html:has(.hamburger_overlay.active) header:has(#login_info_wrap) ~ main {
    padding-top: calc(6.4rem + 5.7rem);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  header:has(#login_info_wrap) ~ main {
    padding-top: 5.7rem;
  }
}
img {
  width: 100%;
  height: auto;
}
img.border_radius_img {
  border-radius: var(--Radius-radius-2);
  border: 1px solid var(--Neutral-300);
}
.bk_pc_1199,
.bk_pc_767 {
  display: block;
}
.bk_sp_1199,
.bk_sp_767,
.bk_sp_374 {
  display: none;
}

a {
  text-decoration: none;
}
a,
button,
input[type="submit"],
input[type="button"] {
  transition: var(--Transition-primary);
  cursor: pointer;
}
a:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
  opacity: var(--Opacity-hover);
  transition: var(--Transition-primary);
}
a button:hover {
  opacity: var(--Opacity-visibility);
}
ul,
ol {
  list-style: none;
}

@media (max-width: 1600px) {
  html {
    font-size: 14px;
  }
}
@media (max-width: 1400px) {
  html {
    font-size: 13px;
  }
}
/* PC（画面サイズ：大） */
@media (max-width: 1199px) {
  html {
    font-size: 12px;
  }
  .bk_pc_1199 {
    display: none;
  }
  .bk_sp_1199 {
    display: block;
  }
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  html {
    font-size: 11px;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  html {
    font-size: 10px;
  }
  .bk_pc_767 {
    display: none;
  }
  .bk_sp_767 {
    display: block;
  }
}
@media (max-width: 374px) {
  .bk_sp_374 {
    display: block;
  }
}

/* ***************************************************************
  common
******************************************************************



*************************************************************** */
h1,
h2 {
  font-family: var(--primary_font);
  color: var(--Text-primary);
  font-size: var(--Typography-FontSize-fontsize-9);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-5);
  position: relative;
  margin-bottom: var(--Spacing-spacing-6);
}
h1[data-title]::after,
h2[data-title]::after {
  content: attr(data-title);
  color: var(--Text-accent-orange);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-medium);
  line-height: 20px;
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-3);
  position: absolute;
  top: 0;
  left: calc(20px + var(--Spacing-spacing-1));
  text-transform: capitalize;
}
h1[data-title]::before,
h2[data-title]::before {
  display: block;
  content: "";
  background-image: url(images/icon_accent.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  position: relative;
  vertical-align: middle;
  top: 0;
  left: 0;
}
h1:has(img) {
  margin: 0;
  line-height: 0;
  padding: 0;
}
h1 + p:not(:has(+ .btn_wrap)) {
  margin-bottom: var(--Spacing-spacing-9);
}
h3,
.store_list_wrap article h2 {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
h3 {
  font-family: var(--primary_font);
}
.store_list_wrap article h2 {
  font-family: var(--secondary_font);
}
.store_list_wrap section h2::before,
.store_list_wrap section h2::after {
  display: none;
}
h4 {
  font-family: var(--primary_font);
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
p {
  color: var(--Text-secondary);
}
p,
span,
a {
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
a:has(img) {
  line-height: 0;
}
a:has(img)::after {
  display: none !important;
}
dt {
  font-family: var(--primary_font);
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
dd {
  font-family: var(--primary_font);
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
a {
  color: var(--TextLink-Secondary-default);
}
small {
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
a.icon_blank::after,
.banner_link_list li a[target] span::after,
.modal_switch a[target]:not(:has(button)) span::after,
.modal_switch_right ul a[target] span::after {
  display: inline-block;
  content: "";
  background-image: url(images/icon_link.svg);
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
}
a.text_link {
  display: block;
}
a.text_link::after {
  content: " \f054";
  font-family: "Font Awesome 6 Free";
  font-weight: 700;
  display: contents;
  font-size: 1rem;
  position: relative;
  vertical-align: middle;
}
a.text_link_icon::after {
  content: "　";
  background-image: url(images/icon_link_blue.svg);
  width: 24px;
  height: 24px;
  display: inline-block;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  a.text_link::after {
    font-size: 1.4rem;
  }
  small a.text_link::after {
    top: -2px;
  }
}

input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  background-image: url(images/icon_cancel.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
}
button,
.btn_wrap button.primary_btn {
  width: 320px;
  height: 64px;
  padding: 0 var(--Spacing-spacing-8);
  border-radius: var(--Radius-radius-full);
  color: var(--Button-Primary-foreground);
  background-color: var(--Button-Primary-background);
  text-align: center;
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-3);
  text-decoration: none;
  border: none;
  position: relative;
}
button span,
.btn_wrap button.primary_btn span {
  font-size: var(--Typography-FontSize-fontsize-7);
  line-height: var(--Typography-LineHeight-lineheight-15);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  display: flex;
  justify-content: center;
  align-items: center;
}
button.primary_btn span::before,
.accordion_container .accordion_heading_text::before,
.scroll_control .accordion_contents_wrap .accordion_detail_text::before,
.floating_btn button span::before,
#top .floating_btn button span::before {
  display: inline-block;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 24px;
  height: 24px;
  position: relative;
  vertical-align: middle;
  margin-right: var(--Spacing-spacing-2);
}
.circle_btn_wrap button span::before {
  display: inline-block;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 40px;
  height: 40px;
  position: relative;
  vertical-align: middle;
}
button span::after {
  display: inline-block;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  position: absolute;
  vertical-align: middle;
  top: calc(50% - 10px);
  right: 12px;
}

input[type="submit"] {
  border-radius: var(--Radius-radius-full);
  background: var(--Button-Primary-background);
  color: var(--Button-Primary-foreground);
  border: none;
}
.btn_wrap a {
  display: inline-block;
}
.btn_wrap button,
.store_list_wrap button {
  border: 1px solid var(--Button-Outlined-outline);
  background-color: var(--Button-Outlined-background);
}
.btn_wrap button span,
.store_list_wrap button span {
  font-size: var(--Typography-FontSize-fontsize-5);
  color: var(--Button-Outlined-foreground);
}
.btn_wrap button span {
  font-weight: var(--font-weight-normal);
}

.btn_wrap button.primary_btn span {
  color: var(--Button-Primary-foreground);
  font-weight: var(--font-weight-bold);
}

.store_list_wrap button span {
  color: var(--Button-Outlined-foreground);
  font-weight: var(--font-weight-normal);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-3);
}

nav .include_accordion button span::before,
.include_accordion button span::after,
.store_list_wrap button span::before {
  display: none;
}
.btn_wrap button span::after,
.store_list_wrap button span::after {
  background-image: url(images/icon_arrow-right.svg);
}
.btn_wrap button.primary_btn span::after,
article.container aside button span::after,
button.primary_icon_btn span::after,
.floating_btn button span::after {
  background-image: url(images/icon_arrow-right_wh.svg);
}

.store_list_wrap button {
  width: 184px;
  height: 48px;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  button,
  .btn_wrap button.primary_btn {
    width: 29.4rem;
    height: 5.6rem;
  }
  .btn_wrap button {
    width: 18.4rem;
  }
  .btn_wrap button,
  .store_list_wrap button {
    height: 44px;
  }
}

/* スクロールバー */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background-color: var(--transparent_color);
}
::-webkit-scrollbar-thumb {
  border-radius: var(--Radius-radius-full);
  background: var(--Neutral-300);
}
::-webkit-scrollbar-button,
::-webkit-scrollbar-corner,
::-webkit-resizer {
  display: none;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  ::-webkit-scrollbar {
    width: 4px;
  }
}

/* ボタン内丸枠矢印画像 */
nav:has(+ .local_menu_btn) li a::after,
.topics_list li article::after,
#post_switch_section .post_switch_wrap a p::after,
#floating_window_text_wrap::after,
.area_store .area_store_list_wrap h4::after,
#modal_links a::after,
.pit_menu_list li a div::after,
.ab_store_list h3::after,
.modal_switch a:not(:has(button))::after,
.modal_switch_right ul a::after {
  display: inline-block;
  content: "";
  background-image: url(images/icon_circle_arrow.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 32px;
  min-width: 32px;
  height: 32px;
  padding: 0;
  position: relative;
  vertical-align: middle;
  left: 0;
}

#floating_window_text_wrap[href^="#"]::after {
  transform: rotate(90deg);
}

/* ローカルメニュー */
.circle_btn_wrap {
  display: flex;
  gap: var(--Spacing-spacing-6);
  position: fixed;
  left: auto;
  right: var(--Spacing-spacing-13);
  bottom: var(--Spacing-spacing-6);
  background-color: var(--transparent_color);
  z-index: 100;
}
.circle_btn {
  border-radius: var(--Radius-radius-full);
  box-shadow: 0 0 12px 0 var(--box-shadow-color);
  display: flex;
  width: 132px;
  height: 132px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1/1;
  background: var(--Icon-primary);
  padding: var(--Spacing-spacing-3) var(--Spacing-spacing-5);
  gap: var(--Spacing-spacing-1);
  z-index: 100;
  transition: var(--Transition-secondary);
}
.circle_btn_wrap .circle_btn {
  position: relative;
  left: 0;
  bottom: 0;
}
.circle_btn.local_menu_btn {
  position: fixed;
  left: 12%;
  bottom: var(--Spacing-spacing-6);
}
.circle_btn.floating_hidden {
  opacity: var(--Opacity-hidden);
  visibility: hidden;
  transition: var(--Transition-secondary);
}
.circle_btn img {
  width: 32px;
  height: 32px;
}
.circle_btn span {
  color: var(--Icon-invert);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.circle_btn_wrap .circle_btn {
  background-color: var(--Button-Primary-background);
  padding: 0 var(--Spacing-spacing-4) var(--Spacing-spacing-2);
  gap: var(--Spacing-spacing-2);
}
.circle_btn_wrap .circle_btn img {
  width: 40px;
  height: 40px;
}
.circle_btn_wrap .circle_btn span {
  color: var(--Button-Primary-foreground);
  font-family: var(--primary_font);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-3);
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-2);
}
.circle_btn_wrap .circle_btn.cart_btn span {
  line-height: var(--Typography-LineHeight-lineheight-10);
}
.circle_btn_wrap .circle_btn.app_btn span {
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-11);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
.circle_btn span::after {
  display: none;
}
div.local_menu_wrap {
  position: fixed;
  height: 80vh;
  z-index: 100;
}
#menu_icon,
#menu_text {
  opacity: var(--Opacity-visibility);
  transition: opacity var(--Transition-primary);
  display: inline-block;
}
.circle_btn.local_menu_btn.open {
  transform: rotate(-90deg);
  transition: var(--Transition-secondary);
  left: 330px;
}
nav:has(+ .local_menu_btn) {
  position: fixed;
  border-radius: 0 var(--Radius-radius-4) var(--Radius-radius-4) 0;
  background: var(--Background-secondary);
  box-shadow:
    0 1px 2px 0 var(--box-shadow-color),
    0 0 20px 0 var(--box-shadow-color);
  opacity: var(--Opacity-hidden);
  transition: var(--Transition-secondary);
  width: calc(400px - 6px);
  border-right: solid 6px var(--Background-secondary);
  z-index: 101;
  pointer-events: none;
  top: 5.6rem;
  left: -100%;
}
nav:has(+ .local_menu_btn.open) {
  opacity: var(--Opacity-visibility);
  transition: var(--Transition-secondary);
  pointer-events: all;
  left: 0;
}
nav:has(+ .local_menu_btn) ul {
  overflow: scroll;
  height: calc(91vh - 5.6rem);
}

nav:has(+ .local_menu_btn) p,
nav:has(+ .local_menu_btn) li {
  border-bottom: solid 1px var(--Divider-primary);
  padding: var(--Spacing-spacing-5) var(--Spacing-spacing-7);
}
nav:has(+ .local_menu_btn) li:last-child {
  border: none;
}
nav:has(+ .local_menu_btn) li {
  display: flex;
  padding: var(--Spacing-spacing-5) var(--Spacing-spacing-7);
  justify-content: space-between;
  align-items: center;
}
:has(+ .local_menu_btn) p {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-8);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
}
nav:has(+ .local_menu_btn) a {
  overflow: hidden;
  color: var(--Text-primary);
  text-overflow: ellipsis;
  font-family: var(--primary_font);
  font-weight: var(--font-weight-normal);
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.sp_local_menu_btn {
  display: none;
}
.local_menu_overlay {
  pointer-events: none;
}
@media (max-width: 1400px) {
  /* ローカルメニュー */
  .circle_btn.local_menu_btn {
    left: 5%;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  nav:has(+ .local_menu_btn) {
    top: 6.4rem;
    width: calc(81% - 6px);
  }
  .circle_btn {
    transition: 0s;
  }
  .circle_btn:not(.local_menu_btn) {
    display: none;
  }
  .circle_btn.local_menu_btn {
    border-radius: var(--Radius-radius-0) var(--Radius-radius-0)
      var(--Radius-radius-2) var(--Radius-radius-2);
    display: flex;
    transform: rotate(-90deg);
    transform-origin: top left;
    padding: var(--Spacing-spacing-3) var(--Spacing-spacing-5);
    align-items: center;
    gap: var(--Spacing-spacing-2);
    width: fit-content;
    height: fit-content;
    position: fixed;
    left: 0;
    top: 85vh;
    bottom: 0;
    flex-direction: row-reverse;
    justify-content: center;
    aspect-ratio: auto;
    white-space: nowrap;
  }
  .circle_btn.local_menu_btn.open {
    left: 81%;
  }
  .local_menu_btn img {
    width: 24px;
    height: 24px;
  }
  nav .sp_local_menu_btn {
    left: 378px;
  }
  .local_menu_btn.open + .local_menu_overlay {
    position: absolute;
    background-color: var(--transparent_color);
    width: 100vw;
    height: 100vh;
    pointer-events: all;
  }
}

/* 見出しありリスト */
.list_style_disc,
.accordion_container .accordion_contents_wrap .accordion_detail_text li,
.subhead_inner ul,
.guideline_change ul,
.modal_switch_right .modal_caption_wrap ul {
  list-style: disc;
  margin-left: 21px;
}

/* テーブル */
table {
  width: auto; /* 重要 */
  width: 100%;
  table-layout: auto; /* デフォルトだが明示 */
}
/* 枠線・角丸 */
.table_frame {
  overflow: hidden; /* ← 角丸クリップ */
}
.table_frame table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: none;
  position: relative;
}
/* 最終行の下線を消す */
.table_frame tbody tr:last-child td {
  border-bottom: none;
}
table::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: var(--Radius-radius-2);
  border: 1px solid var(--Table-border);
  pointer-events: none;
}
.table_caption {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  text-align: left;
  margin-bottom: var(--Spacing-spacing-2);
}
table th,
table td {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-normal);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  vertical-align: middle;
}
th.cell_nowrap,
td.cell_nowrap {
  white-space: nowrap;
  width: 1%;
}
table thead th:first-child {
  border-radius: var(--Radius-radius-2) 0 0;
}
table thead th:last-child {
  border-radius: 0 var(--Radius-radius-2) 0 0;
}

table tbody tr:last-child th {
  border-radius: 0 0 0 var(--Radius-radius-2);
}
table th,
table td {
  height: 37px;
}
table th {
  padding: var(--Spacing-spacing-3);
  background-color: var(--Table-cell-title);
  text-align: left;
}
table td {
  padding: var(--Spacing-spacing-3);
  background-color: var(--Surface-primary);
  border-bottom: 1px solid var(--Table-border);
  max-width: 310px;
}
table thead th:not(:last-child) {
  border-right: 1px solid var(--Table-cell-title-border);
}
table tbody th {
  border-right: 1px solid var(--Table-border);
  border-bottom: 1px solid var(--Table-cell-title-border);
}
table tbody tr:first-child th {
  border-top: 1px solid var(--Table-cell-title-border);
}
table td:not(:last-child) {
  border-right: 1px solid var(--Table-border);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  table th,
  table td {
    height: 26px;
  }
}

.table_block + small {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  margin-top: var(--Spacing-spacing-2);
  display: block;
}
.table_scroll_wrap {
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-mask-image: none;
  mask-image: none;
  -ms-overflow-style: none;
  scrollbar-width: none;
  transition:
    mask-image var(--Transition-quinary) ease,
    -webkit-mask-image var(--Transition-quinary) ease;
}

.table_scroll_wrap::-webkit-scrollbar {
  display: none;
}
.table_scroll_wrap.gradation {
  -webkit-mask-image: linear-gradient(
    to right,
    var(--Background-accent-orange) 85%,
    transparent 95%
  );
  mask-image: linear-gradient(
    to right,
    var(--Background-accent-orange) 85%,
    transparent 95%
  );
}

.table_scroll_wrap .swipe_hint_wrap {
  border-radius: var(--Radius-radius-2);
  background-color: var(--Background-scroll-hint);
  padding: var(--Spacing-spacing-5);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-4);
  width: fit-content;
  position: absolute;
  top: calc((100% - 103px) / 2);
  opacity: var(--Opacity-hidden);
  visibility: hidden;
  left: 50%;
  animation: scroll-hint-animation 2s infinite ease;
  transform: translate(-45%);
  transition: var(--Transition-primary);
}
.table_scroll_wrap .swipe_hint_wrap img {
  width: 40px;
  height: 40px;
}
.table_scroll_wrap .swipe_hint_wrap span {
  color: var(--Icon-invert);
  display: block;
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-13);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  th.sp_nowrap,
  td.sp_nowrap {
    white-space: nowrap;
    width: 1%;
    min-width: none;
  }
  th.cell_wrap {
    min-width: 326px;
  }
  @keyframes scroll-hint-animation {
    0% {
      transform: translate(-55%);
    }
    50% {
      transform: translate(-45%);
    }
    100% {
      transform: translate(-55%);
    }
  }
  .table_scroll_wrap .swipe_hint_wrap.round_trip {
    opacity: var(--Opacity-visibility);
    visibility: visible;
  }
}
/* インジケーター */
.indicator_button_wrap {
  display: flex;
  justify-content: center;
  column-gap: var(--Spacing-spacing-5);
}
.indicator_button_wrap.none {
  display: none;
}
.indicator_button_wrap button {
  width: 20px;
  height: 20px;
  background-color: var(--transparent_color);
  padding: 0;
}
.indicator_button_wrap button img {
  width: 20px;
  height: 20px;
}
.indicator_button_wrap button.prev img {
  transform: rotateY(180deg);
}
.indicate_wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}
.indicate_wrap .dot {
  width: 6px;
  height: 6px;
  border-radius: var(--Radius-radius-full);
  background-color: var(--Icon-disabled);
  transition: var(--Transition-primary);
}
.indicate_wrap .dot.active {
  background-color: var(--Icon-accent-orange);
}

/* 全体 */
main > article,
main > div {
  background-color: var(--Background-accent-orange);
}
.container_radius {
  border-radius: var(--Radius-radius-5) var(--Radius-radius-5) 0 0;
  margin-top: -80px;
}
.container {
  width: 90%;
  max-width: 800px;
  margin: auto;
  padding: var(--Spacing-spacing-8) 0 var(--Spacing-spacing-12);
}
.container:has(.top_aside) {
  padding: var(--Spacing-spacing-7) 0 var(--Spacing-spacing-12);
}
.service_page .grey_background > .container {
  padding: 0 0 var(--Spacing-spacing-9);
}
.grey_background,
.white_background,
.blue_background {
  width: 100vw;
  margin: 0 calc(50% - 50vw);
}
.grey_background {
  background-color: var(--Background-secondary);
}
.white_background {
  background-color: var(--Background-primary);
}
.blue_background {
  background-color: var(--Background-tertiary);
}
.blue_background p {
  color: var(--Text-invert);
}
.orange_background {
  background-color: var(--Background-accent-orange);
}
.contents {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-9);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .container {
    width: 92%;
    padding-bottom: var(--Spacing-spacing-11);
  }
  .container_radius {
    border-radius: var(--Radius-radius-5) var(--Radius-radius-5) 0 0;
    margin-top: -32px;
  }
}

.mv_img_wrap,
.mv_img_wrap_2 {
  width: 100%;
  background-size: cover;
  background-position: center;
  position: relative;
  z-index: -1;
  overflow: hidden;
  background-color: var(--Background-mv);
}
.mv_img_wrap:before {
  content: "";
  background: inherit;
  -webkit-filter: blur(10px);
  -moz-filter: blur(10px);
  -o-filter: blur(10px);
  -ms-filter: blur(10px);
  filter: blur(10px);
  position: absolute;
  top: -10px;
  left: -10px;
  right: -10px;
  bottom: -10px;
  z-index: -1;
}
.mv_img_wrap img {
  width: 56.3rem;
  margin: auto;
  display: block;
}
.mv_img_wrap_2 img {
  width: 80rem;
  margin: auto;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .mv_img_wrap:before {
    display: none;
  }
  .mv_img_wrap img,
  .mv_img_wrap_2 img {
    width: 100%;
  }
}

/* section */
article.container section,
article.container aside {
  padding: var(--Spacing-spacing-8) var(--Spacing-spacing-11);
}
article.container section,
article.container section article,
article.container aside {
  background-color: var(--global_color);
  border-radius: var(--Radius-radius-4);
}
article.container section article {
  padding: 0;
}
article.container section.background_none,
article.container aside.background_none {
  padding: 0;
  background-color: var(--transparent_color);
  border-radius: 0;
}
article.container section.background_none article {
  padding: var(--Spacing-spacing-7) var(--Spacing-spacing-11);
}
article.container .accordion_container_list article.accordion_container {
  padding: var(--Spacing-spacing-8) var(--Spacing-spacing-11)
    var(--Spacing-spacing-9);
}
article.container section + small {
  display: block;
  margin-top: var(--Spacing-spacing-1);
  color: var(--Text-secondary);
}
.text_link {
  display: inline-flex;
  align-items: center;
  width: fit-content;
}
.text_link,
.accordion_container p a {
  text-decoration: underline;
  text-underline-offset: 5px;
}
article.container aside {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
}
article.container aside div:has(h2) {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-bottom: calc(var(--Spacing-spacing-6) + var(--Spacing-spacing-3));
}
article.container aside div h2 {
  margin-bottom: 0;
}
article.container aside .aside_btn_list_wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--Spacing-spacing-5);
}
article.container aside div img {
  width: 8.3rem;
}
article.container aside:has(h2[data-title="Service"]) div img {
  width: 4rem;
}

/* ボタン内アイコン */
button.shop_btn span::before,
.floating_btn button.shop_btn span::before,
.circle_btn_wrap button.shop_btn span::before {
  background-image: url(images/icon_shop_wh.svg);
}
button.app_btn span::before,
.floating_btn button.app_btn span::before,
.circle_btn_wrap button.app_btn span::before {
  background-image: url(images/icon_app_wh.svg);
}
button.cart_btn span::before,
.floating_btn button.cart_btn span::before,
.circle_btn_wrap button.cart_btn span::before {
  background-image: url(images/icon_cart_wh.svg);
}
button.calendar_btn span::before,
.floating_btn button span::before,
.circle_btn_wrap button span::before {
  background-image: url(images/icon_calendar_wh.svg);
}
button.event_btn span::before {
  background-image: url(images/icon_event_wh.svg);
}
button.location_btn span::before {
  background-image: url(images/icon_location_wh.svg);
}
button.map_btn span::before {
  background-image: url(images/icon_map_wh.svg);
}

article.container aside.caption_article {
  padding: var(--Spacing-spacing-7) var(--Spacing-spacing-11);
  align-items: flex-start;
}
article.container aside.caption_article h3 {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
article.container aside.caption_article p {
  margin-top: var(--Spacing-spacing-3);
  text-align: left;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  article.container section {
    padding: var(--Spacing-spacing-8) var(--Spacing-spacing-5);
  }
  article.container section.background_none article {
    padding: var(--Spacing-spacing-7) var(--Spacing-spacing-5);
  }
  article.container .accordion_container_list article.accordion_container {
    padding: var(--Spacing-spacing-8) var(--Spacing-spacing-5)
      var(--Spacing-spacing-9);
  }
  article.container section + small,
  small .text_link {
    display: inline;
  }
  small .text_link {
    border-bottom: none;
  }
  article.container aside {
    padding: var(--Spacing-spacing-8) var(--Spacing-spacing-5)
      var(--Spacing-spacing-9);
  }
  article.container aside {
    flex-direction: column;
  }
  article.container aside:has(h2[data-title="Service"]) div img {
    width: 5rem;
  }
}

/* 中央寄せボタンwrap */
.btn_wrap {
  padding: var(--Spacing-spacing-7) 0 var(--Spacing-spacing-8);
  text-align: center;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .btn_wrap {
    padding-bottom: var(--Spacing-spacing-11);
  }
}

/* アコーディオンメニュー */
.include_accordion {
  width: 100%;
  padding: 0;
}
.include_accordion li {
  list-style: none;
}
.accordion_wrap {
  margin-bottom: 1rem;
}
.accordion_wrap:last-child {
  margin-bottom: 0;
}
.include_accordion .accordion_contents_wrap {
  height: 0;
  padding: 0;
  overflow: hidden;
  transition: var(--Transition-secondary);
  background-color: var(--transparent_color);
  margin: 0;
}
.include_accordion li.active button::after {
  transition: var(--Transition-quinary);
}
.scroll_control .accordion_contents_wrap .accordion_detail_text {
  display: flex;
  align-items: flex-start;
}
.scroll_control,
.scroll_control li,
.scroll_control button {
  width: 100%;
}
.scroll_control > li {
  border-bottom: solid 1px var(--Divider-primary);
  margin: 0;
}
.scroll_control a,
.scroll_control button {
  padding: var(--Spacing-spacing-6) 0;
}
.scroll_control .accordion_contents_wrap ul {
  display: block;
}
.scroll_control .accordion_contents_wrap ul a {
  padding: var(--Spacing-spacing-6) var(--Spacing-spacing-7);
}
.scroll_control li {
  position: relative;
}
.scroll_control button {
  border: none;
}
.scroll_control li button {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.scroll_control li button::after,
.scroll_control .accordion_contents_wrap .accordion_detail_text::before {
  display: inline-block;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 24px;
  height: 24px;
  top: 0;
  right: 0;
  position: relative;
  transition: var(--Transition-primary);
}

/* タブ切り替え */
.tab_switch {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--Spacing-spacing-6) 2.5rem;
  margin-bottom: var(--Spacing-spacing-6);
}
.tab_switch div:has(h1) {
  max-width: 43rem;
}
.tab_switch h1 {
  margin-bottom: 0;
}
/* タブ */
.tab_area {
  position: relative;
}
.tab_btn_wrap {
  display: flex;
  overflow-x: auto;
  white-space: nowrap;
  gap: var(--Spacing-spacing-5);
}
.tab_area img {
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  transition: opacity var(--Transition-primary) ease;
  pointer-events: none;
  z-index: 35;
  cursor: pointer;
  opacity: var(--Opacity-hidden);
  pointer-events: none;
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .tab_area img {
    display: none;
  }
}
.tab_switch .tab_btn_wrap,
.area_tag_list {
  display: flex;
  align-items: center;
  overflow: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.area_tag_list {
  position: relative;
  z-index: 10;
}
.tab_switch .tab_btn_wrap::-webkit-scrollbar,
.area_tag_list::-webkit-scrollbar {
  display: none;
}
/* タブボタン */
.tab_switch label,
.area_tag_list li a,
.area_tag_list li span {
  padding: var(--Spacing-spacing-2) var(--Spacing-spacing-4);
  border-radius: var(--Radius-radius-full);
  background-color: var(--Tag-background-enabled);
  border: solid 1px var(--Tag-outline-enabled);
  text-align: center;
  display: block;
}
.tab_switch label,
.area_tag_list li a {
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
  color: var(--Tag-foreground-enabled);
  white-space: nowrap;
  cursor: pointer;
}
.tab_switch label:hover {
  opacity: var(--Opacity-hover);
  transition: var(--Transition-primary);
}
.area_tag_list li span {
  border: 1px solid var(--Tag-outline-disable);
  color: var(--Tag-foreground-disable);
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-15);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
  white-space: nowrap;
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  /* タブボタン */
  .tab_switch .tab_btn_wrap,
  .area_tag_list {
    flex-wrap: wrap;
  }
  .area_tag_list {
    gap: var(--Spacing-spacing-3);
  }
}
/* ラジオ非表示 */
.tab_switch input {
  display: none;
}
/* コンテンツ非表示 */
.tab_content {
  display: none;
  width: 100%;
  padding: 1.5em 0;
}
/* 選択されたタブ＋コンテンツ表示 */
.tab_switch input:checked + label,
.area_tag_list li.select a {
  background-color: var(--Tag-background-focused);
  border: solid 1px var(--Tag-background-focused);
  pointer-events: none;
}
.tab_switch input:checked + label,
.area_tag_list li.select a {
  color: var(--Button-Secondary-foreground);
  font-weight: var(--font-weight-semi-bold);
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  /* タブ切り替え */
  .tab_switch {
    flex-wrap: wrap;
    margin-bottom: var(--Spacing-spacing-3);
  }
  .tab_switch div {
    max-width: 100%;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  /* タブ */
  .tab_area {
    width: 100%;
  }
  .tab_btn_wrap {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    padding-right: 40px; /* 右端スクロールヒント用の余白 */
    scroll-behavior: smooth;
    /* 右端フェード */
    -webkit-mask-image: linear-gradient(
      to right,
      var(--Background-accent-orange) 75%,
      transparent 95%
    );
    mask-image: linear-gradient(
      to right,
      var(--Background-accent-orange) 75%,
      transparent 95%
    );
    transition:
      mask-image var(--Transition-quinary) ease,
      -webkit-mask-image var(--Transition-quinary) ease;
  }
  .tab_btn_wrap.no_fade {
    -webkit-mask-image: none;
    mask-image: none;
  }
  /* スクロールヒントアイコン */
  .tab_area img {
    right: 0;
    opacity: var(--Opacity-hidden);
    pointer-events: none;
  }
  .tab_area img.btn_display {
    pointer-events: auto; /* クリック可能に */
    opacity: var(--Opacity-visibility);
  }
  .tab_area img.btn_display:hover {
    opacity: var(--Opacity-hover);
    transition: var(--Transition-primary);
  }
}
/* アコーディオンメニュー */
.accordion_container_list {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-5);
}
.accordion_container_list h3 {
  color: var(--Text-primary);
  font-size: var(--Typography-FontSize-fontsize-9_sp);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-5);
  margin-bottom: var(--Spacing-spacing-6);
}
.accordion_container .contents_wrap {
  padding-bottom: var(--Spacing-spacing-9);
}
.accordion_container ul li {
  width: 100%;
}
.accordion_container ul button {
  width: 100%;
  height: auto;
  text-align: left;
  border-radius: 0;
  background-color: var(--transparent_color);
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-normal);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  display: flex;
  gap: var(--Spacing-spacing-5);
  border-bottom: solid 0 var(--Divider-primary);
  transition: var(--Transition-primary);
}
.accordion_container ul .accordion_btn.active {
  border-bottom: solid 1px var(--Divider-primary);
}
.accordion_container ul button,
.accordion_container .accordion_contents_wrap .accordion_detail_text {
  padding: var(--Spacing-spacing-5) 0;
}
.accordion_container.qa_accordion ul:not(:has(h3)) li:first-child button {
  padding-top: 0;
}
.accordion_container .accordion_contents_wrap .accordion_detail_text,
.accordion_container .accordion_contents_wrap dt,
.accordion_container .accordion_contents_wrap dd {
  opacity: var(--Opacity-hidden);
  transition: var(--Transition-secondary);
}
.accordion_btn {
  border-radius: 0;
}
.accordion_btn.active + .accordion_contents_wrap .accordion_detail_text,
.accordion_btn.active + .accordion_contents_wrap dt,
.accordion_btn.active + .accordion_contents_wrap dd {
  opacity: var(--Opacity-visibility);
  transition: var(--Transition-secondary);
}
.nav_overlay_content .accordion_contents_wrap li {
  opacity: var(--Opacity-hidden);
  transition: var(--Transition-tertiary);
}
.nav_overlay_content .accordion_btn.active + .accordion_contents_wrap li {
  opacity: var(--Opacity-visibility);
  transition: var(--Transition-tertiary);
}
.accordion_container .accordion_contents_wrap .accordion_detail_text span,
.accordion_container .accordion_contents_wrap .accordion_detail_text li {
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  color: var(--Button-Outlined-foreground);
}
.accordion_container .accordion_contents_wrap .accordion_detail_text li {
  width: calc(100% - 24px);
}
.accordion_container p a {
  padding: 0;
}
.accordion_container .scroll_control li button span::before,
.accordion_container
  .scroll_control
  .accordion_contents_wrap
  .accordion_detail_text::before {
  height: var(--Typography-LineHeight-lineheight-16);
  top: 2px;
}
.accordion_container .scroll_control li button span::before {
  content: url(images/icon_question.svg);
}
.accordion_container
  .scroll_control
  .accordion_contents_wrap
  .accordion_detail_text::before {
  content: url(images/icon_answer.svg);
}
.accordion_container .scroll_control li button::after {
  content: url(images/icon_plus.svg);
}
.accordion_container .scroll_control li button.active::after {
  content: url(images/icon_minus.svg);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .accordion_container .scroll_control li button span::before,
  .accordion_container
    .scroll_control
    .accordion_contents_wrap
    .accordion_detail_text::before {
    top: 1px;
  }
}
/* フローティングボタン */
.floating_btn_wrap {
  position: fixed;
  bottom: 0;
  left: calc(50% - ((34.2rem + 1rem * 2) / 2));
  background-color: var(--transparent_color);
  padding-bottom: 2rem;
  z-index: 95;
}
.floating_btn_wrap.floating_hidden {
  opacity: var(--Opacity-hidden);
  visibility: hidden;
  transition: var(--Transition-secondary);
}
.floating_btn {
  border-radius: var(--Radius-radius-full);
  background: var(--Surface-secondary-opacity-80);
  backdrop-filter: blur(4px);
  padding: 1rem;
}
.floating_btn a {
  line-height: 0;
}
.floating_btn button {
  width: 34.2rem;
  box-shadow: 0 0 12px 0 var(--box-shadow-color);
}
.floating_btn button span {
  font-size: clamp(10px, 6vw, 19px);
  white-space: nowrap;
}
.floating_btn_wrap:has(.floating_btn_flex) {
  left: 4.5%;
  width: calc(100% - 4.5% * 2);
}
.floating_btn_flex {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-3);
  width: calc((100% - 1rem * 2));
}
.floating_btn_flex a {
  width: 50%;
}
.floating_btn_flex button {
  width: 100%;
}
.floating_btn_flex a::before,
.floating_btn_flex a::after,
.floating_btn_flex button span::before,
.floating_btn_flex button span::after {
  display: none;
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .floating_btn_wrap {
    transition: var(--Transition-secondary);
  }
  .floating_btn_flex {
    display: none;
  }
}
@media (max-width: 480px) {
  .floating_btn_flex a button {
    width: 100%;
    padding: 0 var(--Spacing-spacing-5);
  }
}
@media (max-width: 374px) {
  .floating_btn_wrap {
    left: calc(50% - ((95vw + 1rem * 2) / 2));
  }
  .floating_btn button {
    width: 95vw;
  }
}
@media (max-width: 360px) {
  .floating_btn_flex a button {
    padding: 0 var(--Spacing-spacing-3);
  }
  .floating_btn_flex a span {
    font-size: var(--Typography-FontSize-fontsize-4);
  }
}

/* 都道府県一覧のCSS */
.area_list dt {
  width: 100%;
  padding: var(--Spacing-spacing-3) 0;
  border-bottom: solid 1px var(--Background-secondary);
}
.area_list dt a,
.modal_content dl dt button {
  font-weight: var(--font-weight-bold);
  color: var(--Text-secondary);
  display: flex;
  align-items: center;
  width: fit-content;
}
.modal_content dl dt button {
  height: auto;
  background-color: var(--transparent_color);
}
.area_list dt a::after,
.modal_content dl dt button::after {
  display: inline-block;
  content: "";
  background-image: url(images/icon_chevron_right.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 24px;
  height: 24px;
  position: relative;
  vertical-align: middle;
}
.area_list dt + div,
.area_list .accordion_contents_wrap,
.modal_content dl div {
  display: flex;
  flex-wrap: wrap;
}
.area_list dt + div {
  padding: var(--Spacing-spacing-5) 0 var(--Spacing-spacing-6);
  gap: var(--Spacing-spacing-5);
}
.area_list .accordion_contents_wrap {
  display: flex;
  gap: var(--Spacing-spacing-5);
}
.area_list .accordion_btn.active + .accordion_contents_wrap {
  margin: var(--Spacing-spacing-5) var(--Spacing-spacing-0)
    var(--Spacing-spacing-6);
}
.area_list dd,
.area_list .accordion_contents_wrap li,
.modal_content dl div dd {
  width: calc((100% - var(--Spacing-spacing-5) * 4) / 5);
  height: fit-content;
}
.area_list dd a {
  width: 100%;
}
.area_list dd a,
.area_list dd span,
.area_list .accordion_contents_wrap li a,
.modal_content dl div button,
#area_link_accordion .accordion_contents_wrap button {
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: var(--Radius-radius-full);
  border: 1px solid var(--Button-Outlined-outline);
  background-color: var(--Button-Outlined-background);
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
  color: var(--Button-Outlined-foreground);
  padding: 0;
}
#area_link_accordion .accordion_contents_wrap button::after {
  display: none;
}
.modal_content dl div button {
  width: 100%;
  font-weight: var(--font-weight-normal);
}
.area_list .accordion_contents_wrap li {
  border: none;
}
.area_list .accordion_contents_wrap a {
  padding: 0;
}
.area_list .accordion_contents_wrap a::after {
  display: none;
}
.area_list dd span,
.modal_content dl div button[data-category=""] {
  color: var(--Button-Disable-foreground);
  opacity: var(--Opacity-tag_inactive);
  pointer-events: none;
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  .area_list dd,
  .area_list .accordion_contents_wrap li,
  .modal_content dl div dd {
    width: calc((100% - var(--Spacing-spacing-5) * 3) / 4);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .area_list dd,
  .area_list .accordion_contents_wrap li,
  .modal_content dl div dd {
    width: calc((100% - var(--Spacing-spacing-5) * 2) / 3);
  }
  .area_list dt + div {
    padding-bottom: calc(var(--Spacing-spacing-6) + var(--Spacing-spacing-3));
  }
}

/* ***************************************************************
  header
******************************************************************



*************************************************************** */
header {
  position: sticky;
  top: 0;
  width: calc(100% - 7rem * 2);
  z-index: 1000;
  background-color: var(--Surface-primary);
  padding: 1rem 7rem;
  transition: var(--Transition-secondary);
}
header.with_scroll {
  box-shadow: 0 2px 16px 0 var(--box-shadow-color);
}
header > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 3.6rem;
}
.header_logo {
  width: 17.5rem;
  margin-left: 0;
}

.header_nav_wrap {
  display: flex;
}
header nav,
header nav ul,
.header_nav_wrap > div,
header nav dl {
  display: flex;
  align-items: center;
}
header nav ul span,
header nav ul a,
header nav p,
header nav .login_info_wrap p span,
header nav dt,
header nav dd {
  font-family: var(--primary_font);
  color: var(--Text-primary);
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  text-decoration: none;
}
header.bk_pc_767 nav > ul > .has_child > span,
header.bk_pc_767 nav > ul > li > a {
  font-weight: var(--font-weight-bold);
}
.header_nav_wrap > ul > li > a:hover {
  opacity: var(--Opacity-visibility);
}
header nav p,
header nav .login_info_wrap p span,
header nav dt,
header nav dd {
  font-weight: var(--font-weight-medium);
  color: var(--Text-secondary);
}
@media (max-width: 1600px) {
  header {
    width: calc(100% - 4rem * 2);
    padding: 1rem 4rem;
  }
}
/* PC（画面サイズ：大） */
@media (max-width: 1199px) {
  header {
    width: calc(100% - 2rem * 2);
    padding: 1rem 2rem;
  }
}
@media (max-width: 1199px) and (min-width: 991px) {
  header nav ul span,
  header nav ul a,
  header nav p,
  header nav .login_info_wrap p span,
  header nav dt,
  header nav dd {
    font-size: var(--Typography-FontSize-fontsize-3);
  }
}
@media (max-width: 991px) and (min-width: 767px) {
  header nav ul span,
  header nav ul a,
  header nav p,
  header nav .login_info_wrap p span,
  header nav dt,
  header nav dd {
    font-size: 12px;
    padding: 0 0;
  }
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .icon_blank::after,
  .header_nav_wrap li > a::after {
    width: 24px;
    height: 24px;
    top: -2px;
    left: var(--Spacing-spacing-1);
    vertical-align: middle;
  }
}
/* ログイン情報 */
header nav dl {
  margin-top: var(--Spacing-spacing-2);
}
header #btn_login {
  display: flex;
  align-items: center;
  gap: var(--Spacing-spacing-2);
  width: auto;
  height: 3rem;
}
header #btn_login img {
  width: 1.5rem;
  height: 1.5rem;
  aspect-ratio: 1/1;
}
@media (max-width: 1600px) and (min-width: 1199px) {
  header #btn_login {
    font-size: var(--Typography-FontSize-fontsize-4);
    padding: 0 var(--Spacing-spacing-5);
  }
}
@media (max-width: 1240px) and (min-width: 991px) {
  header #btn_login {
    font-size: var(--Typography-FontSize-fontsize-3);
    padding: 0 var(--Spacing-spacing-4);
  }
}
@media (max-width: 991px) and (min-width: 767px) {
  header #btn_login {
    font-size: 11px;
  }
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  header #btn_login {
    padding: 0 1rem;
  }
}

/* ヘッダーメニュー */
.header_nav_wrap > ul {
  column-gap: var(--Spacing-spacing-10);
}
.header_nav_wrap > div {
  margin-left: var(--Spacing-spacing-10);
  gap: var(--Spacing-spacing-5);
}
.has_child > .login_info_wrap {
  padding: 1rem 0;
}
.has_child > .login_info_wrap p {
  display: flex;
  width: 155px;
}
.header_nav_wrap .has_child > .login_info_wrap p span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  opacity: var(--Opacity-visibility);
  visibility: visible;
}
@media (max-width: 1400px) {
  .header_nav_wrap > ul {
    column-gap: 2rem;
  }
  .header_nav_wrap > div {
    margin-left: 2rem;
  }
}
/* PC（画面サイズ：大） */
@media (max-width: 1199px) {
  .has_child > .login_info_wrap p {
    width: 123px;
  }
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  .header_nav_wrap > div {
    margin-left: var(--Spacing-spacing-2);
    gap: var(--Spacing-spacing-2);
  }
  .has_child > .login_info_wrap p {
    width: 107px;
  }
}

/* サブメニュー */
.header_nav_wrap .has_child {
  cursor: pointer;
}
.header_nav_wrap .has_child > span,
.header_nav_wrap > ul > li > a,
.header_nav_wrap .has_child dl {
  position: relative;
}
.header_nav_wrap .has_child > span,
.header_nav_wrap > ul > li > a {
  padding: 0 0 2rem;
}
.header_nav_wrap .has_child > span::after,
.header_nav_wrap .has_child dl::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  background: var(--Text-accent-orange);
  left: 0;
  top: auto;
  transform: scale(0, 0);
  transform-origin: center top;
  transition: transform var(--Transition-primary);
}
.header_nav_wrap > ul > li > a::after {
  display: inline-block;
  content: "";
  background-image: url(images/icon_arrow-right_or.svg);
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
  opacity: var(--Opacity-hidden);
  transition: var(--Transition-primary);
  width: 20px;
  height: 20px;
}
.header_nav_wrap .has_child > span::after,
.header_nav_wrap > ul > li > a::after {
  bottom: 1rem;
}
.header_nav_wrap .has_child dl::after {
  bottom: 0;
}
.header_nav_wrap .has_child:hover > span::after,
.header_nav_wrap .has_child > span:hover::after,
.header_nav_wrap .has_child > span:has(+ div:hover)::after,
.header_nav_wrap .has_child:hover dl::after {
  transform: scale(1, 1);
}
.header_nav_wrap > ul > li > a:hover::after {
  opacity: var(--Opacity-visibility);
  transition: var(--Transition-primary);
}
.has_child > span + div,
.has_child > .login_info_wrap + div {
  position: absolute;
  top: 5.6rem;
  left: 10%;
  background-color: var(--Surface-primary);
  transition: var(--Transition-secondary);
  z-index: 10;
  width: calc(80% - var(--Spacing-spacing-18) * 2);
  border-radius: 0 0 var(--Radius-radius-10) var(--Radius-radius-10);
  display: flex;
  padding: 0 var(--Spacing-spacing-18);
  justify-content: space-between;
  align-items: flex-start;
  height: 0;
  max-height: fit-content;
}
.header_nav_wrap .has_child > div span,
.has_child ul {
  opacity: var(--Opacity-hidden);
  visibility: hidden;
  transition: var(--Transition-secondary);
  pointer-events: none;
}
.has_child > span + div > div > span {
  color: var(--Text-secondary);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-8);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  display: block;
  width: 100%;
  border-bottom: solid 1px var(--Button-Outlined-outline);
  padding: var(--Spacing-spacing-5) 0;
  margin-bottom: var(--Spacing-spacing-3);
}
.has_child > span + div > div > span:nth-of-type(2) {
  margin-top: var(--Spacing-spacing-7);
}
.has_child:hover > span + div,
.has_child:hover > .login_info_wrap + div {
  cursor: pointer;
  transition: var(--Transition-secondary);
  cursor: default;
  padding: var(--Spacing-spacing-9) var(--Spacing-spacing-18)
    var(--Spacing-spacing-11);
  height: 100vh;
}
.has_child:hover ul,
.has_child:hover > span + div,
.has_child:hover > .login_info_wrap + div {
  pointer-events: all;
}
.header_nav_wrap .has_child:hover > div span,
.has_child:hover ul {
  opacity: var(--Opacity-visibility);
  visibility: visible;
  transition: var(--Transition-secondary);
}
header:has(.has_child:hover) + .overlay {
  opacity: var(--Opacity-hidden);
}
header:has(.has_child:hover) + .overlay {
  background: var(--Overlay-primary);
  position: fixed;
  height: 100vh;
  width: 100vw;
  left: 0;
  top: 0;
  z-index: 99;
  transition: var(--Transition-secondary);
  opacity: var(--Opacity-visibility);
}
.has_child ul,
.has_child > span + div > div {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 70%;
  gap: 0;
  pointer-events: none;
}
.has_child > span + div > div {
  overflow: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
  max-height: calc(
    95vh - 5.4rem - 1rem * 2 - var(--Spacing-spacing-3) -
      var(--Spacing-spacing-11)
  );
}
.has_child > span + div > div::-webkit-scrollbar {
  display: none;
}
.has_child > span + div > div ul {
  width: 100%;
}
.has_child ul li {
  width: calc(50% - var(--Spacing-spacing-5) - var(--Spacing-spacing-3));
  padding: var(--Spacing-spacing-5) var(--Spacing-spacing-3)
    var(--Spacing-spacing-5) var(--Spacing-spacing-5);
  align-items: center;
}
header .has_child > div > span {
  color: var(--Text-primary);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-8);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  display: block;
  padding: var(--Spacing-spacing-5) 0;
}
header .has_child > div > span::before {
  display: inline-block;
  content: "";
  background-image: url(images/icon_accent.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 40px;
  height: 40px;
  position: relative;
  vertical-align: middle;
  top: 0;
  padding-right: var(--Spacing-spacing-3);
}
.header_nav_wrap a + div {
  position: absolute;
  left: 10%;
  opacity: var(--Opacity-hidden);
  visibility: hidden;
  transition: var(--Transition-secondary);
  z-index: 10;
  width: calc(80% - var(--Spacing-spacing-18) * 2);
  border-radius: 0 0 var(--Radius-radius-10) var(--Radius-radius-10);
  padding: 3rem;
  display: flex;
  padding: var(--Spacing-spacing-11) var(--Spacing-spacing-18);
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
}
.header_nav_wrap a + div ul {
  display: flex;
  flex-wrap: wrap;
  width: 55rem;
  column-gap: 1rem;
}
.header_nav_wrap a + div li {
  width: calc(
    (
        100% - 1rem - var(--Spacing-spacing-3) * 2 - var(--Spacing-spacing-5) *
          2
      ) /
      2
  );
  padding: var(--Spacing-spacing-5) var(--Spacing-spacing-3)
    var(--Spacing-spacing-5) var(--Spacing-spacing-5);
}

.has_child ul a {
  font-size: var(--Typography-FontSize-fontsize-7);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.has_child ul a span {
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-normal);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.has_child ul a::before {
  display: inline-block;
  content: "";
  background-image: url(images/icon_arrow-right_or.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  position: relative;
  vertical-align: middle;
  padding-right: var(--Spacing-spacing-3);
}
@media (max-width: 1600px) {
  .header_nav_wrap .has_child > span + div {
    left: 7.5%;
    width: calc(85% - var(--Spacing-spacing-18) * 2);
  }
  .has_child > span + div > div {
    max-height: calc(
      90vh - 5.4rem - 1rem * 2 - var(--Spacing-spacing-3) -
        var(--Spacing-spacing-11)
    );
  }
}
@media (max-width: 1600px) and (min-width: 767px) {
  header .has_child > div > span,
  .has_child > span + div > div > span {
    font-size: 20px;
  }
  .has_child ul a {
    font-size: 16px;
  }
  .has_child ul a span {
    font-size: 12px;
  }
}
@media (max-width: 1400px) {
  .header_nav_wrap .has_child > span + div {
    left: 5%;
    width: calc(90% - var(--Spacing-spacing-18) * 2);
  }
  .header_nav_wrap > ul > li > a::after {
    width: 18px;
    height: 18px;
  }
}
@media (max-width: 1240px) {
  .header_nav_wrap .has_child > span + div {
    left: 3%;
    width: calc(94% - var(--Spacing-spacing-18) * 2);
  }
}
/* PC（画面サイズ：大） */
@media (max-width: 1199px) {
  .header_nav_wrap > ul > li > a::after {
    width: 14px;
    height: 14px;
  }
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  .header_nav_wrap .has_child > span + div,
  .has_child > .login_info_wrap + div {
    display: block;
  }
  .has_child ul,
  .has_child > span + div > div {
    width: 100%;
  }
  .has_child > span + div > div {
    max-height: calc(
      80vh - 5.4rem - 1rem * 2 - var(--Spacing-spacing-3) -
        var(--Spacing-spacing-11)
    );
  }
}

/* 検索フォーム */
#header_form_wrap {
  position: absolute;
  width: calc(100% - 7rem * 2);
  z-index: 100;
  top: 0;
  left: 0;
  font-family: var(--primary_font);
  background-color: var(--Text-Field-background);
  padding: 1rem 7rem;
  opacity: var(--Opacity-hidden);
  visibility: hidden;
  transition: var(--Transition-secondary);
}
#header_form_wrap.open_menu {
  opacity: var(--Opacity-visibility);
  visibility: visible;
  transition: var(--Transition-secondary);
}
#header_form_wrap nav {
  display: flex;
  gap: var(--Spacing-spacing-5);
}
header nav button.btn_search {
  width: 3rem;
  height: 3rem;
  border-radius: var(--Radius-radius-50);
  border: 1px solid var(--Button-Icon-outline);
  background: var(--Button-Icon-background);
  padding: 0;
}
header nav button img {
  width: 1.5rem;
  height: 1.5rem;
  margin: auto;
  display: block;
}
header form {
  position: relative;
}
header form input[type="search"] {
  display: flex;
  width: 420px;
  height: 48px;
  padding: 0 var(--Spacing-spacing-13) 0
    calc(var(--Spacing-spacing-6) + 20px + var(--Spacing-spacing-3));
  align-items: center;
  gap: var(--Spacing-spacing-3);
  border-radius: var(--Radius-radius-full);
  border: 1px solid var(--Text-Field-border-enabled);
  background: var(--Text-Field-background);
  color: var(--Text-Field-placeholder-focused);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-3);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: 0.8px;
}
header form input[type="search"]::placeholder {
  color: var(--Text-Field-placeholder-enabled);
}
header form input[type="search"]:active,
header form input[type="search"]:focus {
  outline: none;
  border: solid 1px var(--Text-Field-border-focused);
}
header form::before {
  display: inline-block;
  content: "";
  background-image: url(images/icon_link-1.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 20px;
  height: 48px;
  left: var(--Spacing-spacing-6);
  position: absolute;
}
header form input[type="submit"] {
  position: absolute;
  top: 6px;
  right: var(--Spacing-spacing-3);
  height: 36px;
  padding: 0 var(--Spacing-spacing-4);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-3);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
}
.sp_header_wrap,
.sp_header_list {
  display: flex;
}
.sp_header_list span {
  color: var(--Text-secondary);
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-2);
  font-weight: var(--font-weight-semi-bold);
  line-height: 0.9;
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
.sp_header_list a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: var(--Spacing-spacing-3);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-2);
  font-weight: var(--font-weight-semi-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
  color: var(--Text-secondary);
  width: 7rem;
  height: 5.6rem;
}
.sp_header_list img {
  width: 24px;
  height: 24px;
  aspect-ratio: 1/1;
}
@media (max-width: 1600px) {
  #header_form_wrap {
    width: calc(100% - 4rem * 2);
    padding: 1rem 4rem;
  }
}
/* PC（画面サイズ：大） */
@media (max-width: 1199px) {
  #header_form_wrap {
    width: calc(100% - 2rem * 2);
    padding: 1rem 2rem;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  header {
    width: 100%;
    padding: 0;
  }
  header > div:has(.header_logo_wrap) {
    width: calc(100% - var(--Spacing-spacing-5));
    padding: var(--Spacing-spacing-2) 0 var(--Spacing-spacing-2)
      var(--Spacing-spacing-5);
    background-color: var(--Surface-primary);
    position: relative;
    z-index: 1000;
    transition: var(--Transition-secondary);
  }
  header.with_menu_scroll > div:has(.header_logo_wrap) {
    box-shadow: 0 2px 16px 0 var(--box-shadow-color);
  }
  header > div {
    height: 5.6rem;
  }
  header > div.login_info_wrap {
    height: 4rem;
  }
  header form::before {
    height: 58px;
  }
  header form input[type="search"] {
    height: 56px;
    padding: 0 var(--Spacing-spacing-4) 0
      calc(var(--Spacing-spacing-6) + 20px + var(--Spacing-spacing-3));
    font-size: var(--Typography-FontSize-fontsize-5);
    line-height: var(--Typography-LineHeight-lineheight-16);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-3);
  }
}
@media (max-width: 480px) {
  .sp_header_list {
    margin-right: 4rem;
  }
}

header > div.login_info_wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-1);
  text-align: center;
  padding: var(--Spacing-spacing-3) var(--Spacing-spacing-5);
  opacity: var(--Opacity-hidden);
  visibility: hidden;
  position: absolute;
  left: 0;
  background-color: var(--Surface-primary);
  width: calc(100% - var(--Spacing-spacing-5) * 2);
  transition: var(--Transition-secondary);
  border-top: solid 1px var(--Divider-primary);
}
header > div.login_info_wrap.open {
  opacity: var(--Opacity-visibility);
  visibility: visible;
  transition: var(--Transition-secondary);
}
header:has(+ .local_menu_wrap .circle_btn.local_menu_btn.open)
  > div.login_info_wrap {
  opacity: var(--Opacity-hidden);
  visibility: hidden;
}
header > div.login_info_wrap div {
  display: flex;
  column-gap: var(--Spacing-spacing-3);
}
header > div.login_info_wrap span {
  color: var(--Text-primary);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-3);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
header > div.login_info_wrap div > span:first-of-type {
  display: flex;
  max-width: calc(100vw - 13rem);
}
header > div.login_info_wrap div > span:first-of-type span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ハンバーガーメニュー */
.hamburger_overlay {
  top: 0;
  right: 0;
  z-index: 1000;
  width: 70px;
  height: 64px;
  border: none;
  background: var(--transparent_color);
  cursor: pointer;
  padding: 0;
}
.hamburger_overlay_line {
  position: absolute;
  left: auto;
  right: 27px;
  width: 17px;
  height: 1.5px;
  background-color: var(--Icon-primary);
  transition: all var(--Transition-primary);
}
.hamburger_overlay_line:nth-of-type(1) {
  top: 24px;
}
.hamburger_overlay_line:nth-of-type(2) {
  top: 31px;
}
.hamburger_overlay_line:nth-of-type(3) {
  top: 38px;
}
.hamburger_overlay.active .hamburger_overlay_line:nth-of-type(1) {
  transform: translateY(6px) rotate(-45deg);
}
.hamburger_overlay.active .hamburger_overlay_line:nth-of-type(2) {
  opacity: var(--Opacity-hidden);
}
.hamburger_overlay.active .hamburger_overlay_line:nth-of-type(3) {
  transform: translateY(-8px) rotate(45deg);
}
@media (max-width: 480px) {
  .hamburger_overlay_line {
    left: 0;
    width: 17px;
  }
  .hamburger_overlay {
    top: 20px;
    right: 15px;
    width: 24px;
    height: 24px;
  }
  .hamburger_overlay_line:nth-of-type(1) {
    top: 5px;
  }
  .hamburger_overlay_line:nth-of-type(2) {
    top: 11px;
  }
  .hamburger_overlay_line:nth-of-type(3) {
    top: 17px;
  }
  .hamburger_overlay.active .hamburger_overlay_line:nth-of-type(1) {
    transform: translateY(4px) rotate(-45deg);
  }
}

.nav_overlay {
  flex-direction: column;
  align-items: flex-start;
  position: fixed;
  top: 5.6rem;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: var(--transparent_color);
  visibility: hidden;
  opacity: var(--Opacity-hidden);
  transition: all var(--Transition-primary);
  z-index: 99;
}
.nav_overlay.active {
  visibility: visible;
  opacity: var(--Opacity-visibility);
}
.nav_overlay_content {
  width: calc(100% - var(--Spacing-spacing-7) * 2);
  background: var(--Surface-primary);
  padding: 0 var(--Spacing-spacing-7);
  overflow: scroll;
  max-height: 90vh;
}
.nav_overlay_content form {
  padding: var(--Spacing-spacing-5) 0;
}
header .nav_overlay_content form input[type="search"] {
  width: 100%;
}
.nav_overlay .overlay {
  background-color: var(--Background-modal);
  position: fixed;
  height: 100vh;
  width: 100vw;
  left: 0;
  top: 0;
  z-index: -1;
  opacity: var(--Opacity-hidden);
  visibility: hidden;
  pointer-events: none;
}
/* アコーディオンメニュー */
header .scroll_control {
  align-items: flex-start;
  flex-direction: column;
  gap: 0;
  padding-bottom: 6.4rem;
}
header .scroll_control .accordion_contents_wrap ul a,
header .scroll_control .accordion_heading_text {
  padding-right: calc(var(--Spacing-spacing-7) + var(--Spacing-spacing-3));
}
header .scroll_control > li > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: var(--font-weight-medium);
}

header .scroll_control > li:last-child {
  border-bottom: none;
}
header .scroll_control .accordion_contents_wrap ul a {
  display: block;
  width: calc(100%- (var(--Spacing-spacing-7) + var(--Spacing-spacing-3)));
}
header .scroll_control > li > a::after {
  display: inline-block;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
  width: 24px;
  height: 24px;
  background-image: url(images/icon_arrow-right_or.svg);
}
header .scroll_control li button::after {
  background-image: url(images/icon_plus_or.svg);
}
header .scroll_control li button.active::after {
  background-image: url(images/icon_minus_or.svg);
}
header .accordion_btn {
  overflow: hidden;
  color: var(--Text-primary);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  background: none;
  border-bottom: solid 1px var(--Divider-primary);
}
header .accordion_contents_wrap li a::after {
  display: none;
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  .header_logo_wrap {
    align-items: flex-start;
  }
  .header_logo_wrap span {
    margin-left: 10px;
  }
  .header_logo {
    width: 12.5rem;
  }
}

.accordion_heading_text {
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  display: flex;
  align-items: flex-start;
  text-align: left;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .nav_overlay {
    top: 6.4rem;
  }
  .nav_overlay.active .overlay {
    opacity: var(--Opacity-visibility);
    visibility: visible;
  }
  .header_logo_wrap {
    font-size: 1.2rem;
  }
  .header_logo_wrap span {
    margin-left: 6px;
  }
  .header_logo {
    width: 138px;
    height: 28px;
  }
}
@media (max-width: 374px) {
  .header_logo {
    width: 100px;
    height: auto;
  }
}

/* ***************************************************************
  footer
******************************************************************



*************************************************************** */
footer {
  font-family: var(--primary_font);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  background-color: var(--Background-invert);
  padding: var(--Spacing-spacing-7) var(--Spacing-spacing-9)
    var(--Spacing-spacing-5);
}
footer > div,
footer > ul,
footer > a {
  max-width: 1280px;
}
footer small {
  overflow: hidden;
  color: var(--Text-invert);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-1);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  text-transform: uppercase;
}
footer a {
  text-decoration: none;
}
footer button {
  background-color: var(--transparent_color);
  color: var(--Text-invert);
  border: none;
  padding: var(--Spacing-spacing-4) 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-3);
}
footer button span {
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
footer button img {
  width: 24px;
  height: 24px;
  filter: brightness(100);
}
footer > div {
  display: flex;
  align-items: center;
  gap: var(--Spacing-spacing-14);
}
footer > div:has(dl) {
  align-items: flex-start;
}
footer div dl {
  width: calc(100% / 4);
}
footer ul {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-8) var(--Spacing-spacing-10);
  list-style: none;
}
footer > ul {
  margin: var(--Spacing-spacing-11) 0;
  flex-wrap: wrap;
}
footer ul a {
  color: var(--Text-invert);
  text-decoration: none;
  font-family: var(--primary_font);
  font-weight: var(--font-weight-bold);
}
footer ul a:not(:has(img)) {
  line-height: 0;
}
footer a[target="_blank"]::after,
footer a[target="yoyaku"]::after,
footer a[target="shop"]::after,
footer a[target="arta"]::after,
footer a[target="copo"]::after {
  filter: brightness(100);
  width: 16px;
  height: 16px;
  top: 0;
  left: var(--Spacing-spacing-2);
  padding-right: var(--Spacing-spacing-2);
}
footer .sns_list {
  gap: var(--Spacing-spacing-11);
  align-items: center;
  margin: var(--Spacing-spacing-8) auto;
}
footer .sns_list ul {
  gap: var(--Spacing-spacing-5);
}
footer ul img {
  width: 40px;
}
footer > div span {
  margin-right: var(--Spacing-spacing-11);
}
footer > div span:has(+ ul) {
  color: var(--Text-accent-orange);
  font-family: var(--secondary_font);
  font-size: 17px;
  font-weight: var(--font-weight-medium);
  line-height: 130%;
  letter-spacing: 0.3px;
  text-transform: capitalize;
  margin: 0;
}
footer dl div {
  display: flex;
  flex-wrap: wrap;
  gap: var(--Spacing-spacing-5) var(--Spacing-spacing-8);
  justify-content: left;
  margin-top: var(--Spacing-spacing-5);
}
footer dt,
footer dd a {
  color: var(--Text-invert);
}
footer dt {
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  padding-bottom: var(--Spacing-spacing-5);
  border-bottom: solid 1px var(--Text-invert);
}
footer dd {
  display: inline-block;
}
footer dd a {
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
footer #copyright {
  flex-direction: column;
  align-items: center;
  row-gap: var(--Spacing-spacing-4);
}
footer #copyright img {
  width: 200px;
}
/* PC（画面サイズ：大） */
@media (max-width: 1199px) {
  footer ul {
    column-gap: var(--Spacing-spacing-5);
  }
  footer > ul a {
    font-size: var(--Typography-FontSize-fontsize-4);
  }
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  footer {
    padding: var(--Spacing-spacing-6) var(--Spacing-spacing-7)
      var(--Spacing-spacing-5);
  }
  footer > div:has(dl) {
    flex-wrap: wrap;
  }
  footer div dl {
    width: calc((100% - var(--Spacing-spacing-14)) / 2);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  footer a[target]::after {
    top: 2px;
  }
  footer .sns_list {
    justify-content: center;
    max-width: none;
    width: 100%;
  }
  footer ul img {
    width: 3.2rem;
  }
  footer div dl {
    width: 100%;
  }
  footer > ul {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ***************************************************************
  index.html
******************************************************************
 トップのCSS


*************************************************************** */
#top .white_background article.container section {
  padding: 0;
  background-color: var(--transparent_color);
}
#top .mv_wrap h1 img {
  width: 72%;
  margin: auto auto 14px;
  padding-top: calc(11px + var(--Spacing-spacing-3));
}
#top .white_background h2,
#top #top_sale_campaign h2 {
  margin-top: var(--Spacing-spacing-8);
}

#top .container_radius {
  overflow-x: hidden;
}
#top .container {
  max-width: 1280px;
  padding: 0;
}
#top .contents {
  gap: 0;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #top .mv_wrap h1 img {
    width: 100%;
    padding-top: var(--Spacing-spacing-3);
  }
}
/* タグ */
.service_item_list li div span,
.pickup_list .pickup_thumbnail_wrap span {
  display: flex;
  padding: 0 var(--Spacing-spacing-4);
  justify-content: center;
  align-items: center;
  border-radius: var(--Radius-radius-full);
  border: 1px solid var(--Button-Outlined-outline);
  background: var(--Button-Outlined-background);
  color: var(--Button-Outlined-foreground);
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-15);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
  height: 36px;
  display: flex;
  align-items: center;
  column-gap: var(--Spacing-spacing-1);
}
.service_item_list li div span::before,
.pickup_list .pickup_thumbnail_wrap span::before {
  display: inline-block;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  aspect-ratio: 1/1;
  position: relative;
  vertical-align: middle;
  top: 0;
  padding-right: var(--Spacing-spacing-1);
}
.service_list li div span::before {
  background-image: url(images/icon_spanner.svg);
}
.item_list li div span::before,
.pickup_list .pickup_thumbnail_wrap span::before {
  background-image: url(images/icon_book.svg);
}
/* PC（画面サイズ：大）~ スマートフォン（画面サイズ：小） */
@media (max-width: 1199px) and (min-width: 767px) {
  .service_item_list li div span,
  .pickup_list .pickup_thumbnail_wrap span {
    font-size: var(--Typography-FontSize-fontsize-2);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .service_item_list.service_list li div span {
    font-size: var(--Typography-FontSize-fontsize-5);
    line-height: var(--Typography-LineHeight-lineheight-14);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-3);
    padding: 0 var(--Spacing-spacing-7);
    height: 42px;
  }
  .service_item_list.item_list li div span,
  .pickup_list .pickup_thumbnail_wrap span {
    line-height: var(--Typography-LineHeight-lineheight-13);
    height: 30px;
  }
  .service_item_list.service_list li div span::before {
    width: 24px;
    height: 24px;
  }
}

/* スライドショー */
.slideshow_container {
  width: 100%;
  max-width: calc(1280px + var(--Spacing-spacing-5));
  margin: 0 auto;
  position: relative;
  padding-bottom: var(--Spacing-spacing-7);
}
.slideshow_wrap {
  overflow: hidden;
}
.slideshow_track {
  display: flex;
  transition: transform var(--Transition-secondary) ease;
  align-items: center;
  align-self: stretch;
}
.slideshow_track.no_transition {
  transition: none;
}
.slideshow_track li {
  flex: 0 0 calc((100% - var(--Slide_Spacing-spacing-5) * 3) / 3);
  padding: 0 calc(var(--Slide_Spacing-spacing-5) / 2);
}
[data-slides-per-view="4"] .slideshow_track li {
  flex: 0 0 calc((100% - var(--Slide_Spacing-spacing-5) * 4) / 4);
}
/* 中央のスライドを大きく表示 */
[data-center-large="true"] .slideshow_track li {
  flex: auto;
  z-index: 10;
  position: relative;
}

.slideshow_track li img {
  width: 100%;
  object-fit: contain;
  display: block;
}
/* コントロール */
.slideshow_controls {
  padding-top: var(--Spacing-spacing-5);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .slideshow_track li {
    flex: 0 0 calc((100% - var(--Slide_Spacing-spacing-5) * 3) / 3);
  }
  [data-slides-per-view="4"] .slideshow_track li {
    flex: 0 0 calc((100% - var(--Slide_Spacing-spacing-5) * 4) / 1.3);
  }
}

/* バナー */
#top article.container aside.aside_contents,
#top article.container aside.aside_contents a {
  position: relative;
}
#top article.container aside.aside_contents {
  align-items: normal;
}
#top article.container aside.aside_contents a {
  z-index: 10;
  margin: auto;
}
#top article.container aside.aside_contents a img {
  width: 100%;
  max-width: 537px;
}
article.container aside.top_app_banner {
  margin: var(--Spacing-spacing-9) 0;
}
#top article.container aside.top_netshop_banner {
  padding: 0 var(--Spacing-spacing-7) var(--Spacing-spacing-9);
}
#top article.container aside.top_netshop_banner > img,
#top article.container aside.top_magazine_banner > img {
  position: absolute;
  left: auto;
}
#top article.container aside.top_netshop_banner > img {
  width: 280px;
  height: 207px;
  aspect-ratio: 280/207;
  left: auto;
  right: var(--Spacing-spacing-7);
  bottom: 17px;
  z-index: 0;
}
#top article.container aside.top_magazine_banner > img {
  width: 198px;
  height: auto;
  right: -13px;
  bottom: 0;
}
/* PC（画面サイズ：大）*/
@media (max-width: 1199px) {
  #top article.container aside.top_magazine_banner {
    gap: var(--Spacing-spacing-2);
  }
  #top article.container aside.top_magazine_banner > img {
    width: 111px;
    right: 0;
    bottom: -57px;
    margin: auto 0 auto auto;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #top article.container aside.top_netshop_banner {
    padding: 0 0 var(--Spacing-spacing-9);
  }
  #top article.container aside.top_netshop_banner > img {
    width: 211px;
    height: 157px;
    aspect-ratio: 211/157;
    left: auto;
    right: -60px;
    bottom: -70px;
  }
}

/* フローティング */
#floating_window_wrap {
  position: fixed;
  bottom: 0;
  left: var(--Spacing-spacing-13);
  bottom: var(--Spacing-spacing-6);
  z-index: 95;
  border-radius: var(--Radius-radius-3);
  border: 1px solid var(--Border-secondary);
  background: var(--Background-primary);
  box-shadow: 0 0 12px 0 var(--box-shadow-color);
  max-width: calc(94.5vw - var(--Spacing-spacing-13) * 2 - 296px);
}
#floating_window_wrap.floating_hidden,
#floating_window_wrap.floating_window_hidden {
  opacity: var(--Opacity-hidden);
  visibility: hidden;
  pointer-events: none;
  transition: var(--Transition-secondary);
}
#floating_window_title_wrap {
  display: flex;
  padding: var(--Spacing-spacing-2) var(--Spacing-spacing-5);
  border-radius: var(--Radius-radius-3) var(--Radius-radius-3) 0 0;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  background: var(--Surface-secondary);
}

#floating_window_title_wrap span {
  color: var(--Text-secondary);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-12);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-3);
}
#floating_window_wrap button {
  background-color: var(--transparent_color);
  width: auto;
  height: auto;
  padding: 0;
}
#floating_window_text_wrap {
  display: flex;
  padding: var(--Spacing-spacing-3) var(--Spacing-spacing-5);
  align-items: center;
  gap: var(--Spacing-spacing-3);
  align-self: stretch;
}
#floating_window_text_wrap span {
  display: block;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-4);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}

#floating_window_wrap img {
  display: flex;
  width: 24px;
  height: 24px;
  padding: 2px;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1/1;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #floating_window_wrap {
    max-width: 92%;
    left: 4%;
    bottom: calc(
      var(--Spacing-spacing-3) * 2 + 56px + var(--Spacing-spacing-5) + 2rem
    );
  }
  #floating_window_title_wrap {
    display: none;
  }
  #floating_window_text_wrap span {
    -webkit-line-clamp: 2;
  }
}

#top .circle_btn,
#top .floating_btn_flex button {
  background-color: var(--Button-Elevate-background);
}
#top button.circle_btn span::before,
#top .floating_btn button.calendar_btn span::before {
  background-image: url(images/icon_calendar.svg);
}
#top button.shop_btn span::before,
#top .floating_btn button.shop_btn span::before {
  background-image: url(images/icon_shop.svg);
}
#top .circle_btn_wrap .circle_btn span,
#top .floating_btn button span {
  color: var(--Button-Elevate-foreground);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .mv_wrap .slideshow_container {
    width: 70%;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .mv_wrap .slideshow_track li {
    flex: 0 0 calc((100% - var(--Spacing-spacing-5) * 2) / 2);
  }
  .mv_wrap .indicator_button_wrap {
    padding-bottom: 32px;
  }
}

/* MV下テキスト */
.mv_btm_wrap {
  display: flex;
  padding: var(--Spacing-spacing-9) 0 var(--Spacing-spacing-7);
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-5);
}
.mv_btm_wrap img {
  width: 39px;
  height: 49px;
  aspect-ratio: 39/49;
}
.mv_btm_wrap p {
  color: var(--Text-primary);
  font-size: var(--Typography-FontSize-fontsize-8);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
}
#top .orange_background .container {
  padding: var(--Spacing-spacing-11) 0 var(--Spacing-spacing-15);
}
#top .orange_background .contents {
  gap: var(--Spacing-spacing-9);
}
/* 店舗を探す */
/* PC（画面サイズ：大）以上 */
@media (min-width: 1199px) {
  #top article.container #top_ctr_aside {
    flex-direction: row;
  }
  #top article.container aside div:has(h2) {
    width: auto;
    margin-bottom: 0;
  }
}
#top article.container aside div:has(button) {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: var(--Spacing-spacing-5) var(--Spacing-spacing-7);
}
article.container #top_ctr_aside img {
  width: 160px;
  aspect-ratio: 97/60;
}
/* PC（画面サイズ：大）以上 */
@media (max-width: 1199px) {
  #top article.container aside div:has(button) {
    flex-wrap: wrap;
  }
  article.container #top_ctr_aside img {
    width: 83px;
  }
}

/* サービス・商品 */
.service_item_list li {
  position: relative;
}
.service_item_list li img {
  border-radius: var(--Radius-radius-2);
}
.service_item_list li a > div {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  position: absolute;
  width: calc(100% - var(--Spacing-spacing-5) * 3);
  bottom: 0;
}
.slideshow_container .service_list a > div {
  padding: var(--Spacing-spacing-5);
  gap: var(--Spacing-spacing-5);
  height: calc(100% - var(--Spacing-spacing-5) * 2);
}
.slideshow_container .item_list a > div {
  padding: var(--Spacing-spacing-7) var(--Spacing-spacing-5);
  gap: var(--Spacing-spacing-4);
  height: calc(100% - var(--Spacing-spacing-7) * 2);
}
#service_item_section .slideshow_container {
  padding-bottom: var(--Spacing-spacing-8);
}

.service_item_list li div h3 {
  color: var(--global_color);
  font-size: var(--Typography-FontSize-fontsize-10);
  line-height: var(--Typography-LineHeight-lineheight-15);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-6);
}
.service_item_list.item_list li div h3 {
  font-size: var(--Typography-FontSize-fontsize-8);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
}
.service_item_list li div p {
  color: var(--global_color);
  font-size: var(--Typography-FontSize-fontsize-7);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
  margin-top: var(--Spacing-spacing-1);
}

/* PC（画面サイズ：大）~ タブレット（画面サイズ：中） */
@media (max-width: 1199px) and (min-width: 991px) {
  .service_item_list li div p {
    font-size: var(--Typography-FontSize-fontsize-4);
  }
}
/* タブレット（画面サイズ：中）~ スマートフォン（画面サイズ：小） */
@media (max-width: 991px) and (min-width: 767px) {
  .service_item_list li div h3,
  .service_item_list.item_list li div h3 {
    font-size: var(--Typography-FontSize-fontsize-7);
  }
  .service_item_list li div p {
    font-size: var(--Typography-FontSize-fontsize-2);
  }
  .slideshow_container .item_list a > div {
    width: calc(100% - var(--Spacing-spacing-4) * 3);
    padding: var(--Spacing-spacing-5) var(--Spacing-spacing-4);
  }
}

/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .service_item_list li img {
    object-fit: cover;
  }
  .service_list li img {
    aspect-ratio: 320 / 427;
  }
  .item_list li img {
    aspect-ratio: 224 / 299;
  }
  #service_item_section .slideshow_container {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
  }
  .slideshow_container .slideshow_track.service_list a > div {
    width: calc(100% - var(--Spacing-spacing-5) * 3);
    padding: 0 var(--Spacing-spacing-6) var(--Spacing-spacing-7);
    gap: var(--Spacing-spacing-6);
    align-self: stretch;
  }
  .slideshow_container .slideshow_track.service_list li {
    flex: 0 0 320px;
    padding: 0 0 0 var(--Spacing-spacing-5);
  }
  [data-slides-per-view="4"] .slideshow_track.item_list li {
    flex: 0 0 224px;
    padding: 0 0 0 var(--Spacing-spacing-5);
  }
  .service_item_list.item_list li div h3 {
    font-size: var(--Typography-FontSize-fontsize-9);
  }
}

/* ピットサービス予約 */
.pit_service_list {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  align-content: flex-start;
  gap: var(--Spacing-spacing-5);
  align-self: stretch;
  flex-wrap: wrap;
  margin-top: var(--Spacing-spacing-7);
  padding-bottom: calc(var(--Spacing-spacing-12) + 80px);
}
.pit_service_list li {
  display: flex;
  align-items: center;
  gap: var(--Spacing-spacing-2);
  border-radius: var(--Radius-radius-3);
  background-color: var(--Surface-primary);
  box-shadow:
    0 1px 2px 0 var(--box-shadow-color),
    0 0 20px 0 var(--box-shadow-color);
  width: calc((100% - var(--Spacing-spacing-5) * 5) / 6);
}
.pit_service_list li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: var(--Spacing-spacing-2);
  padding: var(--Spacing-spacing-5) var(--Spacing-spacing-5)
    var(--Spacing-spacing-7);
  width: 100%;
}
.pit_service_list li img {
  width: 48px;
  height: 48px;
}
.pit_service_list li h3 {
  text-align: center;
  font-weight: var(--font-weight-medium);
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  .pit_service_list li {
    width: calc((100% - var(--Spacing-spacing-5) * 3) / 3);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .pit_service_list {
    padding-bottom: calc(var(--Spacing-spacing-12) + 32px);
  }
  .pit_service_list li a {
    padding-bottom: var(--Spacing-spacing-6);
  }
  .pit_service_list li {
    width: calc((100% - var(--Spacing-spacing-5)) / 2);
  }
}

/* おすすめ */
.post_list {
  display: flex;
  margin-top: var(--Spacing-spacing-2);
  align-items: flex-start;
  gap: var(--Spacing-spacing-7);
  align-self: stretch;
}
.post_list li {
  width: calc(100% / 3);
}
.post_list img {
  display: flex;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  object-fit: cover;
  aspect-ratio: 126/53;
  border-radius: var(--Corner-small);
}
.post_list div {
  display: flex;
  justify-content: space-between;
  margin: var(--Spacing-spacing-3) 0 var(--Spacing-spacing-1);
}
.post_list time {
  color: var(--Text-secondary);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-13);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.post_list span {
  color: var(--Neutral-400);
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-13);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
}
.post_list p {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  align-self: stretch;
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .post_list p {
    font-size: var(--Typography-FontSize-fontsize-4);
  }
}

/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .post_list {
    margin-top: var(--Spacing-spacing-5);
    flex-wrap: wrap;
  }
  .post_list li {
    width: 100%;
  }
  .post_list div {
    margin-bottom: var(--Spacing-spacing-3);
  }
  .post_list time {
    line-height: var(--Typography-LineHeight-lineheight-12);
  }
}

/* 注目記事 */
#topics_section {
  padding-bottom: var(--Spacing-spacing-9);
}
.topics_list {
  display: flex;
  margin-top: var(--Spacing-spacing-3);
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: var(--Spacing-spacing-5);
  align-self: stretch;
}
.topics_list li {
  width: 100%;
}
.topics_list li article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: var(--Spacing-spacing-5);
}
.topics_list li:not(:last-child) article {
  padding-bottom: var(--Spacing-spacing-5);
  border-bottom: solid 1px var(--Divider-primary);
}
.topics_list li p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* 取り付け工賃コミコミセット */
.pickup_list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--Spacing-spacing-8) var(--Spacing-spacing-5);
}
.pickup_list li {
  width: calc((100% - var(--Spacing-spacing-5) * 5) / 6);
}
.pickup_list li article {
  display: flex;
  flex-direction: column;
  row-gap: var(--Spacing-spacing-3);
}
.pickup_list li .pickup_thumbnail_wrap {
  position: relative;
}
.pickup_list .pickup_thumbnail_wrap img {
  border-radius: var(--Radius-radius-2);
  aspect-ratio: 1/1;
}
.pickup_list .pickup_thumbnail_wrap span {
  position: absolute;
  bottom: 8px;
  left: auto;
  right: 8px;
}
.pickup_list li h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  align-self: stretch;
}
.pickup_list li p {
  overflow: hidden;
  font-size: var(--Typography-FontSize-fontsize-4);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  align-self: stretch;
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  .pickup_list li {
    width: calc((100% - var(--Spacing-spacing-5) * 2) / 3);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .pickup_list li {
    width: calc((100% - var(--Spacing-spacing-5)) / 2);
  }
}

.ctr_btn_wrap {
  display: flex;
  padding: var(--Spacing-spacing-7) 0 var(--Spacing-spacing-8);
  flex-direction: column;
  align-items: center;
  gap: var(--Spacing-spacing-3);
}
.ctr_btn_wrap p img {
  width: 24px;
  height: 24px;
}
.ctr_btn_wrap p span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-3);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-1);
}
.ctr_btn_wrap p span b {
  color: var(--Text-secondary);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-semi-bold);
  line-height: var(--Typography-LineHeight-lineheight-15);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .ctr_btn_wrap p img {
    width: 20px;
    height: 20px;
  }
  .ctr_btn_wrap p span b {
    line-height: var(--Typography-LineHeight-lineheight-13);
  }
}

.top_banner_wrap {
  display: flex;
  padding: var(--Spacing-spacing-7) 0 var(--Spacing-spacing-13);
  justify-content: center;
  align-items: flex-start;
  gap: var(--Spacing-spacing-3) var(--Spacing-spacing-14);
}
.top_banner_wrap a {
  width: 41%;
}
.top_banner_wrap img {
  object-fit: contain;
  border-radius: var(--Radius-radius-2);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .top_banner_wrap {
    flex-direction: column;
  }
  .top_banner_wrap a {
    width: 100%;
  }
}

/* 特集/セール・キャンペーン */
article.container:has(#top_campaign_sale_list) {
  padding-top: var(--Spacing-spacing-11);
}
#top_campaign_sale_list section {
  background-color: var(--transparent_color);
  padding: 0;
}
#top_campaign_sale_list ul {
  display: flex;
  gap: var(--Spacing-spacing-5);
}
#top_campaign_sale_list ul li {
  width: calc((100% - var(--Spacing-spacing-5) * 5) / 6);
}
#top_campaign_sale_list ul p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  align-self: stretch;
  overflow: hidden;
  font-size: var(--Typography-FontSize-fontsize-4);
  margin-top: var(--Spacing-spacing-3);
}
#top_campaign_sale_list .btn_wrap {
  padding-bottom: var(--Spacing-spacing-8);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  #top_sale_campaign .btn_wrap:last-of-type {
    padding-bottom: var(--Spacing-spacing-13);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #top_campaign_sale_list ul {
    width: 100%;
    margin: 0 calc(50% - 50vw);
    padding: 0 4%;
    overflow-x: scroll;
    scrollbar-width: none; /* Firefox */
  }
  #top_campaign_sale_list ul::-webkit-scrollbar {
    display: none; /* WebKit */
  }
  #top_campaign_sale_list ul li {
    min-width: 163px;
  }
}

/* CM・動画 */
#cm_movie_section .slideshow_track img {
  border-radius: var(--Radius-radius-2);
}
#cm_movie_section .slideshow_track p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  align-self: stretch;
  margin-top: var(--Spacing-spacing-5);
  min-height: 58px;
}
#cm_movie_section .btn_wrap {
  padding-top: var(--Spacing-spacing-0);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  #cm_movie_section .btn_wrap {
    padding-bottom: var(--Spacing-spacing-13);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #cm_movie_section .slideshow_wrap {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
  }
  #cm_movie_section .slideshow_track p {
    margin-top: var(--Spacing-spacing-3);
    min-height: 55px;
  }
}
/* NEWS */
.container:has(#post_switch_section) {
  padding: var(--Spacing-spacing-12) 0;
}
.contents#post_switch_section {
  gap: var(--Spacing-spacing-8);
}
#post_switch_section .post_switch_wrap .tab_switch {
  margin-bottom: var(--Spacing-spacing-6);
}
#post_switch_section .post_switch_wrap ul {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-7);
  gap: var(--Spacing-spacing-6);
}
#post_switch_section .post_switch_wrap ul li:not(:last-child) a {
  padding-bottom: var(--Spacing-spacing-6);
  border-bottom: solid 1px var(--Divider-primary);
  display: block;
}
#post_switch_section .post_switch_wrap ul div {
  display: flex;
  align-items: center;
  gap: var(--Spacing-spacing-3);
  margin-bottom: var(--Spacing-spacing-2);
}
#post_switch_section .post_switch_wrap time {
  color: var(--Text-secondary);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-13);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
#post_switch_section .post_switch_wrap span {
  color: var(--Text-tertiary);
  font-size: var(--Typography-FontSize-fontsize-3);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
#post_switch_section .post_switch_wrap p {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--Spacing-spacing-5);
}
#post_switch_section .post_switch_wrap p span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-normal);
}

/* 新着情報/新店オープン情報 */
#top_news_section {
  z-index: 5;
}

/* バナー一覧 */
.banner_link_list {
  display: flex;
  flex-wrap: wrap;
  padding: var(--Spacing-spacing-12) 0;
  align-items: flex-start;
  align-content: flex-start;
  gap: var(--Spacing-spacing-7) var(--Spacing-spacing-5);
  align-self: stretch;
}
.banner_link_list li {
  width: calc((100% - var(--Spacing-spacing-5) * 3) / 4);
}
.banner_link_list li span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  align-self: stretch;
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-3);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
  margin-top: var(--Spacing-spacing-1);
}
.banner_link_list li a[target] span::after {
  width: 19px; /* 見切れ防止の為、大きめに設定 */
  height: 16px;
  top: -2px;
  left: var(--Spacing-spacing-1);
  vertical-align: middle;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .banner_link_list {
    padding: var(--Spacing-spacing-11) 0;
  }
  .banner_link_list li {
    width: calc((100% - var(--Spacing-spacing-5)) / 2);
  }
}

/* ***************************************************************
  b1_autobacs.html / b2_exp_top.html / sa.html
******************************************************************
 オートバックスページ/オートバックスエクスプレス/スーパーオートバックスのCSS


*************************************************************** */
.store_contents_wrap p {
  font-size: var(--Typography-FontSize-fontsize-4);
}

/* ***************************************************************
  b1_autobacs.html / b2_exp_top.html
******************************************************************
 オートバックスページ/オートバックスエクスプレスのCSS


*************************************************************** */
.store_contents_wrap ul {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-7);
  padding-top: var(--Spacing-spacing-5);
}
.store_contents_wrap ul li {
  display: flex;
  gap: var(--Spacing-spacing-3);
}
.store_contents_wrap ul img {
  width: 310px;
  aspect-ratio: 181 / 121;
  object-fit: cover;
  border-radius: var(--Radius-radius-2);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #autobacs_express .btn_wrap button {
    width: 18.4rem;
  }
  .store_contents_wrap ul li {
    flex-direction: column;
  }
  .store_contents_wrap ul img {
    width: 100%;
  }
}
/* ***************************************************************
  sa.html
******************************************************************
スーパーオートバックスとはページのCSS


*************************************************************** */
#super_autobacs .contents_wrap .event_guidance_wrap {
  display: flex;
  padding-bottom: var(--Spacing-spacing-5);
  flex-direction: column;
  align-items: flex-start;
  gap: var(--Spacing-spacing-3);
}
#super_autobacs .contents_wrap img {
  border-radius: var(--Radius-radius-2);
}
#super_autobacs .contents_wrap .btn_wrap {
  padding: var(--Spacing-spacing-3) 0 var(--Spacing-spacing-7);
}
#super_autobacs .caption_wrap {
  padding: 0;
}
#super_autobacs .caption_wrap span {
  font-size: var(--Typography-FontSize-fontsize-4);
}

/* ***************************************************************
  b3_asm.html
******************************************************************
 レカロ専門店 ASMページのCSS


*************************************************************** */
h2:has(+ .store_info_list_wrap) {
  margin-bottom: calc(var(--Spacing-spacing-6) + var(--Spacing-spacing-5));
}
.store_info_list_wrap dl div {
  border-bottom: solid 1px var(--Divider-primary);
  padding: var(--Spacing-spacing-3) 0;
}
.store_info_list_wrap dl div:first-of-type {
  padding-top: 0;
}
.store_info_list_wrap dl div:last-of-type {
  padding-bottom: 0;
  border-bottom: none;
}
.store_info_list_wrap dl dt {
  margin-bottom: var(--Spacing-spacing-1);
}
.store_info_list_wrap ul {
  flex-direction: column;
  grid-area: var(--Spacing-spacing-7);
}
.store_info_list_wrap ul li {
  width: 100%;
}
.store_info_list_wrap > ul > li:first-child {
  margin-bottom: var(--Spacing-spacing-7);
}
.store_info_list_wrap > a {
  margin-bottom: var(--Spacing-spacing-7);
}
.store_info_list_wrap h3 {
  display: inline-block;
  border-bottom: 2px solid var(--Orange-300);
  margin-bottom: var(--Spacing-spacing-3);
}
.store_info_list_wrap .btn_wrap {
  padding-bottom: 0;
}
#store_information_wrap {
  display: flex;
  align-items: flex-start;
  gap: var(--Spacing-spacing-3);
}
#store_information_wrap img,
#store_information_wrap dl {
  width: 100%;
}
#store_information_wrap {
  flex-direction: column;
}
#store_information_wrap img {
  aspect-ratio: 568 / 378;
  object-fit: contain;
  border-radius: var(--Radius-radius-2);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #asm .btn_wrap button {
    width: 26.2rem;
  }
}

/* ***************************************************************
  b4_exp_tenpo.html
******************************************************************
 店舗一覧ページのCSS


*************************************************************** */
.store_list_wrap {
  display: flex;
  flex-wrap: wrap;
  gap: var(--Spacing-spacing-5);
}
.store_list_wrap > li {
  width: calc((100% - var(--Spacing-spacing-5)) / 2);
}
article.container .store_list_wrap article {
  padding: var(--Spacing-spacing-5) var(--Spacing-spacing-5)
    var(--Spacing-spacing-7);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  height: calc(100% - var(--Spacing-spacing-5) - var(--Spacing-spacing-7));
  background-color: var(--global_color);
  border-radius: var(--Radius-radius-4);
}
.store_list_wrap article h2 {
  margin: var(--Spacing-spacing-3) 0 var(--Spacing-spacing-2);
}
.store_list_wrap article h2::before,
.store_list_wrap article h2::after {
  display: none;
}
.store_list_wrap ul li span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-3);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
.store_list_wrap ul li,
.area_store .area_store_list_wrap li li {
  display: flex;
  align-items: flex-start;
  column-gap: var(--Spacing-spacing-2);
  border-top: solid 1px var(--Divider-primary);
  padding: var(--Spacing-spacing-2) 0;
}
.store_list_wrap ul li:last-child {
  padding-bottom: 0;
}
.area_store .area_store_list_wrap li li:last-child {
  border-bottom: solid 1px var(--Divider-primary);
}
.store_list_wrap ul li a {
  text-decoration: underline;
  text-underline-offset: 5px;
}
.store_list_wrap ul li::before,
.area_store .area_store_list_wrap li li::before {
  display: inline-block;
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  width: 24px;
  height: 24px;
  position: relative;
  vertical-align: middle;
}
.store_list_wrap ul li:first-child::before,
.area_store .area_store_list_wrap li li:first-child::before {
  background-image: url(images/icon_location.svg);
}
.store_list_wrap ul li:nth-child(2)::before,
.area_store .area_store_list_wrap li li:nth-child(2)::before {
  background-image: url(images/icon_tel_bk.svg);
}
.store_list_wrap ul li:last-child::before {
  background-image: url(images/icon_time.svg);
}
.store_list_wrap img {
  border-radius: var(--Radius-radius-2);
  aspect-ratio: 363 / 241;
  object-fit: cover;
}
.store_list_wrap .btn_wrap {
  padding: var(--Spacing-spacing-7) 0 0;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .store_list_wrap > li {
    width: 100%;
  }
  .store_list_wrap ul li span {
    font-size: var(--Typography-FontSize-fontsize-4);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  }
}

/* ***************************************************************
  b5_top.html
******************************************************************
 エンジンオイル・タイヤ交換、車検に関するよくある質問ページのCSS


*************************************************************** */
#qa .contents_wrap {
  background-color: var(--global_color);
  border-radius: var(--Radius-radius-4);
  padding: var(--Spacing-spacing-8) var(--Spacing-spacing-11)
    var(--Spacing-spacing-9);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #qa .contents_wrap {
    padding: var(--Spacing-spacing-8) var(--Spacing-spacing-5)
      var(--Spacing-spacing-9);
  }
}
/* ***************************************************************
  b6_top.html
******************************************************************
 おとなの自動車保険ページのCSS


*************************************************************** */
#sompo_shop article.container section {
  padding: var(--Spacing-spacing-6) var(--Spacing-spacing-11);
}
.caption_wrap {
  display: flex;
  padding: var(--Spacing-spacing-8) 0 var(--Spacing-spacing-12);
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  background-color: var(--global_color);
}
.caption_wrap .contents {
  margin: auto;
  gap: 0;
}
.caption_wrap p {
  display: flex;
  align-items: flex-start;
  max-width: 800px;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #sompo_shop article.container section {
    padding: var(--Spacing-spacing-5) var(--Spacing-spacing-5)
      var(--Spacing-spacing-6);
  }
  #sompo_shop article.container section + small,
  small .text_link {
    font-size: var(--Spacing-spacing-5);
  }
  .caption_wrap .contents {
    width: 95%;
  }
}

/* ***************************************************************
  service共通
******************************************************************



*************************************************************** */
/* 目次 */
.service_page section.index_wrap {
  padding: var(--Spacing-spacing-8) var(--Spacing-spacing-11) 0;
}
.service_page section.index_wrap h2 {
  color: var(--Text-primary);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-9_sp);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-5_sp);
  left: 0;
  margin-top: 0;
}
.service_page section.index_wrap h2::before {
  display: none;
}

/* ページ内遷移 */
.transition_title {
  padding-top: 5.6rem;
}
h1[data-title].transition_title::after,
h2[data-title].transition_title::after {
  top: 5.6rem;
}
.transition_title,
.service_page
  .grey_background
  + .background_none
  h2.transition_title:first-of-type {
  margin-top: -5.6rem;
}
.service_page h2.transition_title {
  margin-top: calc(-5.6rem + var(--Spacing-spacing-8));
}
.service_page section:has(h2#qanda) .accordion_container {
  padding: var(--Spacing-spacing-8) var(--Spacing-spacing-11);
}
.service_page section:has(h2#store-list),
.service_page section:has(h2#pit-news) {
  padding-top: 0;
}
.service_page section:has(h2#store-list) {
  padding-bottom: var(--Spacing-spacing-9);
}
section:has(h2#pit-news) {
  padding-bottom: var(--Spacing-spacing-5);
}
section.index_wrap h2::before {
  display: none;
}
.subhead_wrap h3 {
  color: var(--Text-accent-orange);
  font-size: var(--Typography-FontSize-fontsize-8);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  margin-bottom: var(--Spacing-spacing-3);
}
.subhead_inner {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-3);
}
.subhead_wrap .subhead_inner h3 {
  margin-bottom: 0;
}
.subhead_inner:not(:last-of-type) {
  margin-bottom: var(--Spacing-spacing-7);
}
/* 目次 */
.index_wrap li a {
  display: flex;
  color: var(--Text-secondary);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-4);
  padding: var(--Spacing-spacing-5) 0;
  border-bottom: solid 1px var(--Divider-primary);
}
.index_wrap ul ul a::before {
  display: inline-block;
  content: "";
  background-image: url(images/icon_subitem.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 24px;
  height: 24px;
  position: relative;
  vertical-align: middle;
  top: 0;
  padding-right: var(--Spacing-spacing-2);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .service_page section.index_wrap {
    padding: var(--Spacing-spacing-8) var(--Spacing-spacing-5) 0;
  }
  .service_page section.index_wrap h2 {
    font-size: var(--Typography-FontSize-fontsize-5);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  }
  .transition_title {
    padding-top: 6.4rem;
  }
  h1[data-title].transition_title::after,
  h2[data-title].transition_title::after {
    top: 6.4rem;
  }
  .transition_title,
  .service_page
    .grey_background
    + .background_none
    h2.transition_title:first-of-type {
    margin-top: -6.4rem;
  }
  .service_page h2.transition_title {
    margin-top: calc(-6.4rem + var(--Spacing-spacing-8));
  }
  .service_page section:has(h2#qanda) .accordion_container {
    padding: var(--Spacing-spacing-8) var(--Spacing-spacing-5);
  }
}
.service_page section h2 {
  position: relative;
  z-index: 10;
  left: 8px;
  margin-top: var(--Spacing-spacing-8);
}
.service_page section h2::before {
  display: block;
  content: "";
  background-image: url(images/icon_accent_large.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 64px;
  height: 64px;
  position: absolute;
  vertical-align: middle;
  top: 5rem;
  left: -13px;
  z-index: -1;
}
.service_page section h2 + p a {
  text-decoration: underline;
  text-underline-offset: 5px;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .service_page section h2 {
    line-height: var(--Typography-LineHeight-lineheight-14);
  }
  .service_page section h2::before {
    width: 48px;
    height: 48px;
    top: 5.6rem;
  }
}
/* CTA要素 */
article.container .contents .top_aside,
article.container .contents .mid_aside {
  flex-direction: row;
  align-items: center;
}
article.container .contents .top_aside {
  padding: var(--Spacing-spacing-8) var(--Spacing-spacing-11);
}
article.container .contents .mid_aside {
  padding: var(--Spacing-spacing-8) var(--Spacing-spacing-12);
  gap: var(--Spacing-spacing-5);
  justify-content: center;
}
article.container .contents .top_aside div,
article.container .contents .mid_aside div {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: var(--Spacing-spacing-5);
  margin: auto;
  width: 100%;
}
article.container .contents .top_aside > img,
article.container .contents .mid_aside > img {
  width: 36%;
}
article.container .contents .top_aside p,
article.container .contents .mid_aside p {
  display: flex;
  flex-direction: column;
}
article.container .contents .mid_aside p small {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
article.container .contents .top_aside p span,
article.container .contents .mid_aside p span,
article.container .contents .mid_aside p small {
  text-align: center;
}
article.container .contents .top_aside p span,
article.container .contents .mid_aside p span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  display: flex;
  justify-content: center;
  align-items: center;
}
article.container .contents .mid_aside p span:has(img) {
  color: var(--Text-accent-orange);
  line-height: var(--Typography-LineHeight-lineheight-15);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
}
article.container .contents .top_aside p span:has(img),
article.container .contents .mid_aside p span:has(img) {
  display: flex;
  align-items: flex-end;
}
article.container .contents .top_aside p span:has(img),
article.container .contents .top_aside p span.cta_text_wrap,
article.container .contents .mid_aside p span:has(img),
article.container .contents .mid_aside p span.cta_text_wrap {
  font-size: var(--Typography-FontSize-fontsize-7);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
}
article.container .contents .top_aside p b,
article.container .contents .mid_aside p b {
  font-size: var(--Typography-FontSize-fontsize-8);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
}
article.container .contents .top_aside p span.cta_text_wrap,
article.container .contents .mid_aside p span.cta_text_wrap {
  display: block;
}
article.container .contents .top_aside p img,
article.container .contents .mid_aside p img {
  width: 32px;
  height: 32px;
}
.top_aside button {
  width: 400px;
  height: 80px;
}
.top_aside button span {
  font-size: var(--Typography-FontSize-fontsize-8);
  line-height: var(--Typography-LineHeight-lineheight-11);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
}

.top_aside p small {
  color: var(--Text-secondary);
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-3);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .top_aside button span::before {
    width: 40px;
    height: 40px;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  article.container .contents .top_aside {
    width: calc(100vw - var(--Spacing-spacing-8) * 2);
    margin: 0 calc(50% - 50vw);
    background-color: var(--transparent_color);
    padding: var(--Spacing-spacing-0) var(--Spacing-spacing-8);
  }
  article.container .contents .mid_aside {
    padding: var(--Spacing-spacing-8) var(--Spacing-spacing-5)
      var(--Spacing-spacing-9);
  }
  article.container .contents .top_aside,
  article.container .contents .mid_aside {
    flex-direction: column;
    align-items: center;
    gap: var(--Spacing-spacing-3);
  }
  article.container .contents .top_aside div {
    row-gap: var(--Spacing-spacing-3);
  }
  article.container .contents .mid_aside div {
    row-gap: var(--Spacing-spacing-7);
  }
  article.container .contents .mid_aside div:not(.aside_btn_list_wrap) {
    row-gap: 0;
  }
  article.container .contents .top_aside p span {
    font-size: var(--Typography-FontSize-fontsize-3);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
  }
  article.container .contents .mid_aside p span:first-of-type {
    line-height: var(--Typography-LineHeight-lineheight-13);
  }
  article.container .contents .top_aside p span:last-of-type,
  article.container .contents .mid_aside p span:last-of-type {
    font-size: var(--Typography-FontSize-fontsize-5);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  }
  article.container .contents .top_aside p b {
    font-size: var(--Typography-FontSize-fontsize-5);
    line-height: var(--Typography-LineHeight-lineheight-16);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  }
  article.container .contents .mid_aside p b {
    font-size: var(--Typography-FontSize-fontsize-9);
    line-height: var(--Typography-LineHeight-lineheight-14);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
    margin-top: 4.5px;
  }
  article.container .contents .mid_aside p small {
    margin-bottom: var(--Spacing-spacing-5);
  }
  article.container .contents .top_aside p img,
  article.container .contents .mid_aside p img {
    width: 20px;
    height: 20px;
  }
  article.container .contents .mid_aside img.bk_sp_767 {
    width: 160px;
    height: auto;
  }
  article.container .contents .mid_aside img.bk_sp_767.cta_img_01 {
    margin: var(--Spacing-spacing-6) auto var(--Spacing-spacing-5);
  }
  article.container .contents .mid_aside img.bk_sp_767.cta_img_02 {
    margin: var(--Spacing-spacing-6) auto var(--Spacing-spacing-3);
  }
  .top_aside button {
    width: 294px;
    height: 56px;
  }
  .top_aside button span {
    font-size: var(--Typography-FontSize-fontsize-7);
    line-height: var(--Typography-LineHeight-lineheight-14);
  }
}
@media (max-width: 375px) {
  article.container .contents .mid_aside a:has(button),
  article.container .contents .mid_aside button {
    width: 100%;
  }
  article.container .contents .mid_aside button.app_btn span {
    font-size: var(--Typography-FontSize-fontsize-4);
  }
}

.area_list .accordion_heading_text {
  font-weight: var(--font-weight-bold);
}
.area_list .accordion_heading_text span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-normal);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}

/* パンくず */
.breadcrumbs_list {
  padding: var(--Spacing-spacing-5);
  border-top: 1px solid var(--Icon-disabled);
  background: var(--Background-secondary);
}
.breadcrumbs_list ul {
  display: flex;
  align-items: center;
  gap: var(--Spacing-spacing-3);
  width: 90%;
  max-width: 800px;
  margin: auto;
}
.breadcrumbs_list a,
.breadcrumbs_list span {
  color: var(--TextLink-Primary-default);
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  white-space: nowrap;
}
.breadcrumbs_list a {
  display: flex;
  align-items: center;
}
.breadcrumbs_list a::after {
  display: inline-block;
  content: "";
  background-image: url(images/icon_chevron_right.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right;
  width: 24px;
  height: 24px;
  position: relative;
  vertical-align: middle;
  padding-left: var(--Spacing-spacing-3);
}
.breadcrumbs_list li:last-child {
  flex: 1; /* 残り幅を使わせる */
  min-width: 0;
}

.breadcrumbs_list li:last-child span {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .breadcrumbs_list ul {
    width: 100%;
    overflow: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
}

/* モーダル */
.modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--Background-modal);
  justify-content: center;
  align-items: center;
  z-index: 1001;
}
.modal.active {
  display: flex;
}
.modal_content {
  border-radius: var(--Radius-radius-3);
  border: 1px solid var(--Divider-primary);
  background: var(--Background-primary);
  max-width: 800px;
  width: 90%;
  height: 90vh;
  max-height: 598px;
  overflow: hidden;
  padding-bottom: var(--Spacing-spacing-6);
}
.modal_content div:has(h2) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: solid 1px var(--Background-secondary);
  padding: var(--Spacing-spacing-5) var(--Spacing-spacing-11);
}
.modal_content div button.modal_close {
  width: 32px;
  height: 32px;
  padding: 0;
  border-radius: 0;
  background-color: var(--transparent_color);
}
.modal .modal_content h2 {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-8);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  margin-bottom: 0;
  left: 0;
}
.modal_content h2::before,
.modal_content h2::after {
  display: none;
}
.modal_content .area_list {
  overflow-y: scroll;
  max-height: calc(100% - var(--Spacing-spacing-5) * 2 - 1.5rem);
  padding: 0 var(--Spacing-spacing-11);
}
.modal_content dl button {
  padding: 0;
}
.modal + button {
  border-radius: var(--Radius-radius-full);
  border: 1px solid var(--Button-Outlined-outline);
  background-color: var(--Button-Outlined-background);
  display: flex;
  padding: 0 var(--Spacing-spacing-7);
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-2);
  color: var(--Button-Outlined-foreground);
  text-align: center;
  font-weight: var(--font-weight-normal);
  line-height: var(--Typography-LineHeight-lineheight-14);
  width: 240px;
  height: 48px;
  transition: var(--Transition-primary);
}
.modal + button img {
  width: 24px;
  height: 24px;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .modal_content {
    width: 95%;
  }
  .modal_content div:has(h2) {
    padding: var(--Spacing-spacing-5) var(--Spacing-spacing-6);
  }
  .modal_content .area_list {
    padding: var(--Spacing-spacing-3) var(--Spacing-spacing-5) 0;
  }
  .modal + button {
    width: 100%;
    height: 44px;
  }
}

/* 動画再生モーダル */
.video_modal_content {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  position: fixed;
  width: 854px;
  max-width: 90%;
  z-index: 99;
}
iframe#youtubeIframe {
  width: 100%;
  aspect-ratio: 16/9;
  border: none;
}

/* 閉じるボタン */
.close {
  color: var(--global_color);
  font-size: 45px;
  cursor: pointer;
  position: absolute;
  right: 0;
  text-align: center;
  top: -60px;
  z-index: 100;
}

/* ***************************************************************
  c1_top.html
******************************************************************
 セール・キャンペーン、特集一覧ページのCSS


*************************************************************** */
#campaign_sale section:nth-of-type(2) h1 {
  margin-top: var(--Spacing-spacing-8);
}
.container:has(.campaign_sale_list_wrap) {
  padding-bottom: 0;
}
.contents.campaign_sale_list_wrap {
  gap: 0;
}
.campaign_sale_list_wrap ul {
  display: flex;
  flex-wrap: wrap;
  gap: var(--Spacing-spacing-9) var(--Spacing-spacing-5);
}
.campaign_sale_list_wrap li {
  width: calc((100% - var(--Spacing-spacing-5) * 2) / 3);
}
.campaign_sale_list_wrap li p {
  font-size: var(--Typography-FontSize-fontsize-4);
  margin-top: var(--Spacing-spacing-3);
}
.campaign_sale_list_wrap ul + a {
  display: block;
  align-items: center;
  margin: var(--Spacing-spacing-7) 0 var(--Spacing-spacing-13);
  text-decoration: underline;
  text-underline-offset: 5px;
}
.campaign_sale_list_wrap ul + a::after {
  display: inline-block;
  content: "　";
  background-image: url(images/icon_link_blue.svg);
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
  width: 20px;
  height: 20px;
  top: 4px;
  background-position: center right;
  text-decoration: underline;
  text-underline-offset: 1px;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .campaign_sale_list_wrap ul {
    gap: var(--Spacing-spacing-5);
  }
  .campaign_sale_list_wrap li {
    width: calc((100% - var(--Spacing-spacing-5)) / 2);
  }
  .campaign_sale_list_wrap ul + a {
    margin-bottom: var(--Spacing-spacing-8);
  }
  .campaign_sale_list_wrap section:last-of-type ul + a {
    margin-bottom: var(--Spacing-spacing-14);
  }
}

/* ***************************************************************
  c2_top.html/c3_top.html/c4_tire-change.html/c5_top.html/
  c6-1_top.html/c6-2_top.html/c6-3_top.html/c7_top.html
******************************************************************
 共通CSS


*************************************************************** */
/* 店舗での取り扱い方法 */
.explanation_wrap div:not(:last-of-type) {
  border-bottom: solid 1px var(--Divider-primary);
  padding-bottom: var(--Spacing-spacing-5);
  margin-bottom: var(--Spacing-spacing-5);
}
.explanation_wrap div {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-2);
}
.explanation_wrap dd {
  font-size: var(--Typography-FontSize-fontsize-5);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .explanation_wrap div {
    gap: var(--Spacing-spacing-3);
  }
}
/* 手順 */
.procedure_list {
  display: flex;
  flex-direction: column;
  gap: calc(var(--Spacing-spacing-3) * 2 + 8px);
  margin-top: var(--Spacing-spacing-7);
}
.procedure_list > div {
  position: relative;
  display: flex;
  padding: var(--Spacing-spacing-7) var(--Spacing-spacing-11);
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: var(--Spacing-spacing-3);
  align-self: stretch;
  background-color: var(--global_color);
  border-radius: var(--Radius-radius-4);
}
.procedure_list > div:not(:last-of-type)::after {
  display: block;
  content: url(images/arrow_bottom.svg);
  width: 24px;
  height: 8px;
  position: absolute;
  left: calc(50% - 12px);
  bottom: calc(-2px - var(--Spacing-spacing-3));
}
.procedure_list .list_no_wrap {
  display: flex;
  width: calc(62px - var(--Spacing-spacing-3) * 2);
  height: calc(62px - var(--Spacing-spacing-2) * 2);
  padding: var(--Spacing-spacing-2) var(--Spacing-spacing-3);
  flex-direction: column;
  align-items: center;
  gap: var(--Spacing-spacing-0);
  border-radius: var(--Radius-radius-3);
  background: var(--Background-accent-orange);
}
.procedure_list .list_no_wrap span {
  color: var(--Text-accent-orange);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  white-space: nowrap;
}
.procedure_list .list_no_wrap span:first-of-type {
  font-size: var(--Typography-FontSize-fontsize-3);
  line-height: var(--Typography-LineHeight-lineheight-16);
}
.procedure_list .accordion_contents_wrap p {
  padding: 0;
}
.procedure_list dt {
  display: flex;
  align-items: center;
  column-gap: var(--Spacing-spacing-3);
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-8);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  width: 100%;
}
.procedure_list dt:has(+ dd) {
  padding-bottom: var(--Spacing-spacing-3);
  border-bottom: solid 1px var(--Divider-primary);
}
.procedure_list dd {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.procedure_list dd div:has(button) {
  text-align: center;
  margin-top: 24px;
}
.procedure_list dd a {
  display: block;
  margin: var(--Spacing-spacing-3) 0 0;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 5px;
}
.procedure_list .accordion_contents_wrap dd {
  margin-top: 0;
}
.procedure_list .include_accordion .accordion_contents_wrap {
  display: flex;
  flex-direction: column;
  row-gap: var(--Spacing-spacing-3);
}
.procedure_list
  .include_accordion
  .accordion_contents_wrap
  > div:first-of-type {
  margin-top: var(--Spacing-spacing-5);
}
article.container .procedure_list aside {
  border-radius: var(--Radius-radius-2);
  background: var(--Background-secondary);
  padding: var(--Spacing-spacing-2) var(--Spacing-spacing-4);
  margin-top: var(--Spacing-spacing-3);
}
article.container .procedure_list .scroll_control button {
  color: var(--Text-secondary);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  font-weight: var(--font-weight-normal);
  background-color: var(--transparent_color);
  border-radius: 0;
  padding: 0;
  height: fit-content;
}
article.container .procedure_list .scroll_control .accordion_wrap {
  margin: 0;
}
.procedure_list .scroll_control li button span::before {
  content: url(images/icon_hatena.svg);
  background-image: none;
  margin-right: var(--Spacing-spacing-2);
  top: 4px;
  position: relative;
}
.procedure_list
  .scroll_control
  .accordion_contents_wrap
  .accordion_detail_text::before {
  display: none;
}
.procedure_list .scroll_control li button::after {
  content: url(images/icon_plus.svg);
}
.procedure_list .scroll_control li button.active::after {
  content: url(images/icon_minus.svg);
}
.procedure_list .accordion_contents_wrap dt,
.procedure_list .accordion_contents_wrap dd {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.procedure_list .accordion_contents_wrap dd b {
  font-weight: var(--font-weight-bold);
}
.procedure_list .accordion_contents_wrap dt {
  font-weight: var(--font-weight-medium);
  padding-bottom: var(--Spacing-spacing-1);
}
.procedure_list .accordion_contents_wrap dd:has(img) {
  display: flex;
  align-items: center;
  gap: var(--Spacing-spacing-3);
}
.procedure_list .accordion_contents_wrap dd img {
  width: 58px;
  height: 64px;
  aspect-ratio: 58/64;
}
.procedure_list + .caption_article {
  margin-top: var(--Spacing-spacing-3);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .procedure_list > div {
    padding: var(--Spacing-spacing-7) var(--Spacing-spacing-5);
  }
  .procedure_list > div:has(.primary_btn),
  article.container .contents .mid_aside {
    padding-bottom: var(--Spacing-spacing-9);
  }
  .procedure_list > div:not(:last-of-type)::after {
    bottom: calc(-8px - var(--Spacing-spacing-3));
  }
  .procedure_list .list_no_wrap {
    width: calc(52px - var(--Spacing-spacing-3) * 2);
    height: calc(52px - var(--Spacing-spacing-2) * 2);
    min-width: 36px;
    padding: var(--Spacing-spacing-2) var(--Spacing-spacing-3);
    gap: var(--Spacing-spacing-0);
    font-size: var(--Typography-FontSize-fontsize-8);
    font-weight: var(--font-weight-bold);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  }
  .procedure_list .list_no_wrap span:first-of-type {
    line-height: var(--Typography-LineHeight-lineheight-15);
  }
  .procedure_list .list_no_wrap span:last-of-type {
    font-size: var(--Typography-FontSize-fontsize-5);
    font-weight: var(--font-weight-medium);
    line-height: var(--Typography-LineHeight-lineheight-14);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  }
  .procedure_list .accordion_heading_text {
    align-items: flex-start;
  }
  .procedure_list .scroll_control li button span::before {
    top: 3px;
  }
}

/* オレンジ見出し */
.subhead_list div:has(h3) {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-3);
}
.subhead_list h3 {
  margin-bottom: 0;
}

/* 関連費用・作業時間 */
.table_list_wrap {
  display: flex;
  flex-direction: column;
  row-gap: var(--Spacing-spacing-3);
  margin: var(--Spacing-spacing-7) 0;
}
.table_list_wrap li > dl > dt {
  padding: var(--Spacing-spacing-2) var(--Spacing-spacing-5);
  border-radius: var(--Radius-radius-2);
  background-color: var(--Orange-200);
  width: 100%;
}
.table_list_wrap .category_list_wrap,
.table_list_notitle_wrap {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 8px;
}
.table_list_wrap .category_list_wrap > dd,
.table_list_notitle_wrap > div,
#vehicle_inspection .table_list_notitle_wrap > div > div {
  padding: var(--Spacing-spacing-3) var(--Spacing-spacing-5);
  background-color: var(--global_color);
  border-radius: var(--Radius-radius-2);
}
.table_list_wrap .category_list_wrap > dd,
.table_list_notitle_wrap > div {
  width: calc(50% - (8px / 2) - var(--Spacing-spacing-5) * 2);
}
.table_list_wrap dd dt,
.table_list_notitle_wrap dt {
  border-bottom: solid 1px var(--Divider-primary);
  padding-bottom: var(--Spacing-spacing-2);
  margin-bottom: var(--Spacing-spacing-2);
}
.table_list_wrap .category_list_wrap dd dd,
.table_list_notitle_wrap dd {
  display: flex;
  align-items: center;
  font-size: var(--Typography-FontSize-fontsize-5);
  gap: calc(var(--Spacing-spacing-1) * 2) var(--Spacing-spacing-5);
}
.table_list_wrap .category_list_wrap dd b,
.table_list_notitle_wrap dd b {
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  color: var(--Text-secondary);
}
.table_list_notitle_wrap dd a {
  text-decoration: underline;
  text-underline-offset: 5px;
}
.table_list_wrap .category_list_wrap dd b {
  text-align: center;
}
.table_list_wrap .category_list_wrap dd b span,
.table_list_notitle_wrap dd b span {
  font-size: var(--Typography-FontSize-fontsize-3);
  font-weight: var(--font-weight-normal);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
.table_list_wrap + section p {
  margin-top: var(--Spacing-spacing-3);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .table_list_wrap {
    row-gap: var(--Spacing-spacing-7);
  }
  .table_list_wrap .category_list_wrap > dd,
  .table_list_notitle_wrap > div {
    width: calc(100% - var(--Spacing-spacing-5) * 2);
  }
  .table_list_wrap dd dt {
    margin-bottom: var(--Spacing-spacing-3);
  }
}

/* 地域 */
.none_icon_accordion .scroll_control button span::before {
  display: none;
}

/* ニュース */
article.container p + article.post_switch_wrap {
  padding: var(--Spacing-spacing-5) 0 0;
}
.post_switch_wrap .tab_switch {
  margin-bottom: var(--Spacing-spacing-3);
}
.post_switch_wrap .detail_list {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-7);
  padding: 0 0 var(--Spacing-spacing-8);
}
article.container p + article.post_switch_wrap .detail_list {
  padding-top: var(--Spacing-spacing-5);
}

/* YouTubeサムネ */
.movie_list {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-7);
}
.movie_list img {
  transition: var(--Transition-primary);
  border-radius: var(--Radius-radius-2);
}
.movie_list img:hover {
  opacity: var(--Opacity-hover);
  transition: var(--Transition-primary);
  cursor: pointer;
}
.movie_list + p {
  margin-top: var(--Spacing-spacing-3);
}

/* タブ切り替え */
.tab_content_all,
.tab_content_change_2,
.tab_content_change_3,
.tab_content_change_4,
.tab_content_change_5,
.tab_content_change_6,
.tab_content_change_7,
.tab_content_change_8,
.tab_content_change_9 {
  display: none;
}
.tab_switch .tab_content_all:has(~ div input#tab1:checked),
.tab_switch .tab_content_change_2:has(~ div input#tab2:checked),
.tab_switch .tab_content_change_3:has(~ div input#tab3:checked),
.tab_switch .tab_content_change_4:has(~ div input#tab4:checked),
.tab_switch .tab_content_change_5:has(~ div input#tab5:checked),
.tab_switch .tab_content_change_6:has(~ div input#tab6:checked),
.tab_switch .tab_content_change_7:has(~ div input#tab7:checked),
.tab_switch .tab_content_change_8:has(~ div input#tab8:checked),
.tab_switch .tab_content_change_9:has(~ div input#tab9:checked),
.tab_switch:has(input#tab1:checked) ~ .tab_content_all,
.tab_switch:has(input#tab2:checked) ~ .tab_content_change_2,
.tab_switch:has(input#tab3:checked) ~ .tab_content_change_3,
.tab_switch:has(input#tab4:checked) ~ .tab_content_change_4,
.tab_switch:has(input#tab5:checked) ~ .tab_content_change_5,
.tab_switch:has(input#tab6:checked) ~ .tab_content_change_6,
.tab_switch:has(input#tab7:checked) ~ .tab_content_change_7,
.tab_switch:has(input#tab8:checked) ~ .tab_content_change_8,
.tab_switch:has(input#tab9:checked) ~ .tab_content_change_9 {
  display: block;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .post_switch_wrap .tab_switch .tab_btn_wrap {
    padding: 0;
    width: 100%;
    margin: 0 auto;
  }
}

/* もっと見る */
.detail_list li {
  position: relative;
}
.detail_list li .img_box {
  width: 100%;
  line-height: 0;
}
.detail_list li img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: var(--Corner-small);
  border: 1px solid var(--Button-Outlined-outline);
}
.title_box {
  margin-top: var(--Spacing-spacing-3);
}
.title_box div {
  display: flex;
  justify-content: space-between;
}
.title_box time {
  color: var(--Text-secondary);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-12);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.title_box span {
  color: var(--Neutral-500);
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-15);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
}
.title_box p {
  overflow: hidden;
  color: var(--Text-secondary);
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  font-weight: var(--font-weight-normal);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.more_button {
  display: block;
}
.more_button button {
  left: -4rem;
  border-radius: 0 0 var(--Radius-radius-4) var(--Radius-radius-4);
  color: var(--Text-secondary);
  font-family: var(--primary_font);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-medium);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  height: auto;
  background-color: var(--transparent_color);
  padding: var(--Spacing-spacing-6) 0;
  width: calc(100% + var(--Spacing-spacing-11) * 2);
  position: relative;
}
.more_button button span {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-3);
  width: 100%;
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.more_button button span::after {
  display: inline-block;
  content: "";
  background-image: url(images/icon_plus.svg);
  background-size: contain;
  background-repeat: no-repeat;
  width: 24px;
  height: 24px;
  position: relative;
  vertical-align: middle;
  top: 0;
  right: 0;
}
.more_button.close_state button span::after {
  background-image: url(images/icon_minus.svg);
}
.post_hidden {
  display: none;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .detail_list li {
    width: 100%;
  }
  .title_box span {
    line-height: var(--Typography-LineHeight-lineheight-13);
  }
  .more_button button {
    width: 100%;
    padding: var(--Spacing-spacing-6) 0;
    margin: auto;
    left: 0;
  }
}
/* バナー */
article.container aside.aside_contents {
  padding: 0;
  background-color: var(--transparent_color);
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-3);
}
article.container aside.aside_contents div {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: var(--Spacing-spacing-1);
  margin-bottom: 0;
}
article.container aside.aside_contents div h2 {
  color: var(--Text-secondary);
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-5);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
article.container aside.aside_contents div img {
  width: 20px;
  height: 20px;
  aspect-ratio: 1/1;
}
article.container aside.aside_contents img {
  object-fit: contain;
  border-radius: var(--Corner-small);
}
article.container aside.aside_contents img + p {
  width: 100%;
}

/* ***************************************************************
  c2_top.html
******************************************************************
 カーエレクトロニクス関連ページのCSS


*************************************************************** */
#car_electronics .grey_background .container:has(.mid_aside) {
  padding-bottom: var(--Spacing-spacing-10);
}
#car_electronics .mid_aside a:first-of-type button span::before {
  background-image: url(images/icon_shop_wh.svg);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  #car_electronics section:has(.procedure_list) + aside {
    margin-top: calc(var(--Spacing-spacing-10) - var(--Spacing-spacing-9));
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #car_electronics .grey_background .container:has(.mid_aside) {
    padding-bottom: var(--Spacing-spacing-9);
  }
}

/* ***************************************************************
  c3_top.html
******************************************************************
 車検関連ページのCSS


*************************************************************** */
/* お知らせ */
#news_section {
  padding-bottom: var(--Spacing-spacing-9);
}
#news_section h2 {
  margin-top: 0;
  left: 0;
}
#news_section h2::before {
  display: none;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #news_section {
    padding: var(--Spacing-spacing-5);
  }
  #news_section h2 {
    font-size: var(--Typography-FontSize-fontsize-8);
    margin-bottom: var(--Spacing-spacing-3);
  }
}

/* 特徴 */
#features_list {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-7);
}
.marker_text_wrap div,
#features_list section {
  border-radius: var(--Radius-radius-4);
  background-color: var(--Background-primary);
  padding: var(--Spacing-spacing-7) var(--Spacing-spacing-5);
}
/* 文字マーカーあり一覧 */
dl.marker_text_wrap {
  display: flex;
  gap: 16px;
  align-self: stretch;
}
.marker_text_wrap div {
  width: calc((100% - 16px * 2) / 3);
}
.marker_text_wrap dd {
  font-size: var(--Typography-FontSize-fontsize-5);
  margin-top: var(--Spacing-spacing-2);
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}
.marker_text_wrap dd span,
.marker_text_wrap p span,
.marker_text span {
  background: linear-gradient(transparent 70%, var(--Orange-200) 70%);
}
.marker_text_wrap dd small,
.marker_text_wrap dd small a {
  font-size: var(--Typography-FontSize-fontsize-3);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
.marker_text_wrap dd small {
  color: var(--Text-secondary);
}
.marker_text_wrap dd small a {
  text-decoration: underline;
  text-underline-offset: 5px;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  dl.marker_text_wrap {
    flex-direction: column;
    border-radius: var(--Radius-radius-4);
    background-color: var(--Background-primary);
    gap: var(--Spacing-spacing-5);
    padding: var(--Spacing-spacing-7) var(--Spacing-spacing-5);
  }
  .marker_text_wrap dd {
    margin-top: var(--Spacing-spacing-1);
    row-gap: var(--Spacing-spacing-1);
  }
  .marker_text_wrap div {
    width: 100%;
    background-color: var(--transparent_color);
    padding: 0;
    border-radius: 0;
  }
  .marker_text_wrap div:not(:last-of-type) {
    padding-bottom: var(--Spacing-spacing-5);
    border-bottom: solid 1px var(--Divider-primary);
  }
}
/* 画像あり */
#features_list article ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: var(--Spacing-spacing-5);
  align-self: stretch;
  margin-top: var(--Spacing-spacing-5);
}
#features_list article ul li {
  width: calc((93% - var(--Spacing-spacing-5) * 3) / 4);
}
#features_list article ul li img {
  border-radius: var(--Radius-radius-2);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #features_list article ul li {
    width: calc((100% - var(--Spacing-spacing-5)) / 2);
  }
}

/* 車検の費用 */
#vehicle_inspection #price + p {
  position: relative;
  z-index: 1;
}
#vehicle_inspection .table_list_notitle_wrap dd > span:first-of-type {
  min-width: 160px;
}
#vehicle_inspection .table_list_notitle_wrap > div:last-of-type {
  padding: 0;
  background-color: var(--transparent_color);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  align-self: stretch;
  gap: 8px;
  width: calc(50% - (8px / 2));
}
#vehicle_inspection .table_list_notitle_wrap > div > div {
  width: calc(100% - var(--Spacing-spacing-5) * 2);
}
#vehicle_inspection .table_list_notitle_wrap > div:last-of-type dd {
  display: block;
}
#cost_overview_wrap.subhead_list p small {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  margin-bottom: var(--Spacing-spacing-3);
  display: block;
}
/* 各店の車検費用・特典情報 */
#cost_overview_wrap .area_list .accordion_heading_text {
  align-items: flex-end;
}
/* 車検費用の目安 */
#vehicle_inspection .subhead_list:has(h4) article {
  padding: var(--Spacing-spacing-5);
}
#vehicle_inspection .subhead_list:has(h4) article dl {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
  gap: var(--Spacing-spacing-5);
}
#vehicle_inspection .aside_contents p {
  width: 100%;
}
#cost_overview_wrap .accordion_container {
  padding: var(--Spacing-spacing-6) var(--Spacing-spacing-11)
    var(--Spacing-spacing-7);
}
#cost_overview_wrap .accordion_container ul li:first-child button {
  padding-top: 0;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  /* 車検の費用 */
  #vehicle_inspection .table_list_notitle_wrap > div:last-of-type {
    width: 100%;
  }
  /* 車検費用の目安 */
  #cost_overview_wrap .accordion_container {
    padding: var(--Spacing-spacing-5) var(--Spacing-spacing-5) 0;
  }
  #cost_overview_wrap .accordion_wrap:last-child .accordion_btn,
  #cost_overview_wrap .scroll_control .accordion_wrap:last-child {
    border-bottom: none;
  }
}

/* 車検とは */
#vehicle_inspection #preparation + div h4 {
  margin-bottom: var(--Spacing-spacing-2);
}
#vehicle_inspection .subhead_list:has(h4) article dt {
  font-weight: var(--font-weight-medium);
}
#vehicle_inspection .subhead_list:has(h4) article dd {
  font-size: var(--Typography-FontSize-fontsize-5);
  margin-bottom: var(--Spacing-spacing-1);
}
#vehicle_inspection .caption_article {
  margin-top: calc(var(--Spacing-spacing-7) - var(--Spacing-spacing-3));
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  article.container aside.caption_article {
    padding: var(--Spacing-spacing-7) var(--Spacing-spacing-5);
    align-items: flex-start;
  }
}

/* 車検情報一覧 */
#area_link_modal h2 {
  margin: 0;
}
#area_link_modal h2::before {
  display: none;
}
#modal_title span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.modal_content .area_list#modal_links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: var(--Spacing-spacing-4);
  column-gap: var(--Spacing-spacing-11);
}
#modal_links li {
  border-bottom: solid 1px var(--Divider-primary);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .modal_content .area_list#modal_links {
    column-gap: 4rem;
  }
  #modal_links li {
    width: calc((100% - 4rem) / 2);
  }
}

#modal_links a {
  color: var(--Text-secondary);
  padding: var(--Spacing-spacing-4) 0;
  display: inline-block;
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #area_link_modal h2 {
    font-size: var(--Typography-FontSize-fontsize-5);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
    margin: 0;
  }
  #modal_title span {
    font-size: var(--Typography-FontSize-fontsize-4);
  }
  #modal_links li {
    width: 100%;
  }
}
/* YouTubeサムネリスト */
#vehicle_inspection .accordion_container_list + .movie_list {
  margin-top: var(--Spacing-spacing-5);
}

/* ***************************************************************
  c4_tire-change.html/c5_top.html
******************************************************************
 タイヤ交換関連ページのCSS


*************************************************************** */
/* 各ボタンアイコン */
#tire_change .mid_aside .aside_btn_list_wrap a:nth-of-type(2) span::before {
  background-image: url(images/icon_cart_wh.svg);
}
/* タイヤ交換とは */
#tire_change .subhead_inner:not(:last-of-type) {
  padding-bottom: var(--Spacing-spacing-3);
  border-bottom: solid 1px var(--Divider-primary);
}
/* 新規購入と履き替え（入替）の違い */
.menu_category_list {
  display: flex;
  align-items: flex-start;
  column-gap: var(--Spacing-spacing-3);
}
.menu_category_list div {
  display: flex;
  padding: var(--Spacing-spacing-7) var(--Spacing-spacing-5);
  flex-direction: column;
  gap: var(--Spacing-spacing-1);
  align-self: stretch;
  border-radius: var(--Radius-radius-4);
  background: var(--Background-primary);
  width: calc((100% - var(--Spacing-spacing-1)) / 2);
}
.menu_category_list div dd,
.guideline_list dd {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
}
.menu_category_list + p {
  display: flex;
}
.menu_category_list + p small {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-3);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
#tire_change .table_list_wrap .category_list_wrap > dd:nth-last-of-type(2),
#tire_change .table_list_wrap .category_list_wrap > dd:last-of-type {
  display: flex;
  background-color: var(--transparent_color);
}
#tire_change
  .table_list_wrap
  .category_list_wrap
  > dd:nth-last-of-type(2)::before,
#tire_change .table_list_wrap .category_list_wrap > dd:last-of-type::before {
  content: "";
  display: inline-block;
  background-color: var(--global_color);
  width: 8px;
  height: calc(100% + var(--Spacing-spacing-3) * 2);
  top: calc(0px - var(--Spacing-spacing-3));
  left: calc(0px - var(--Spacing-spacing-5));
  position: relative;
  border-radius: var(--Radius-radius-2);
}
/* バナー(タイヤ交換の作業手順) */
.banner_wrap img {
  object-fit: contain;
  border-radius: var(--Radius-radius-2);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  /* 新規購入と履き替え（入替）の違い */
  .menu_category_list {
    flex-direction: column;
  }
  .menu_category_list div {
    width: calc(100% - var(--Spacing-spacing-5) * 2);
  }
  .menu_category_list div:first-of-type {
    border-radius: var(--Radius-radius-4) var(--Radius-radius-4) 0 0;
    padding-bottom: var(--Spacing-spacing-0);
  }
  .menu_category_list div:first-of-type dd {
    border-bottom: solid 1px var(--Divider-primary);
    padding-bottom: var(--Spacing-spacing-5);
  }
  .menu_category_list div:last-of-type {
    border-radius: 0 0 var(--Radius-radius-4) var(--Radius-radius-4);
    padding-top: var(--Spacing-spacing-5);
  }
}
/* ***************************************************************
  c6_top.html/c6-2_top.html/c6-3_top.html
******************************************************************
 バッテリー交換/ワイパー交換/エアコンフィルター交換関連ページのCSS


*************************************************************** */
/* 交換とは */
.guideline_change h3 + p:has(+ .guideline_img_wrap) {
  margin-bottom: calc(var(--Spacing-spacing-7) - var(--Spacing-spacing-3));
}
.guideline_change .guideline_img_wrap {
  display: flex;
  flex-direction: column;
  row-gap: var(--Spacing-spacing-7);
}
.guideline_change .guideline_img_wrap div {
  display: flex;
  flex-direction: column;
  row-gap: var(--Spacing-spacing-3);
}
.subhead_inner li,
.guideline_change li,
.guideline_change .guideline_img_wrap dd {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.guideline_img_wrap img {
  border-radius: var(--Radius-radius-2);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .guideline_change h3 + p {
    margin-bottom: calc(var(--Spacing-spacing-7) - var(--Spacing-spacing-3));
  }
}
/* バッテリー交換/エアコンフィルター交換 */
#battery_change .table_list_notitle_wrap > div,
#ac_filter_change .table_list_notitle_wrap > div {
  width: 100%;
}
/* エアコンフィルター交換 */
#ac_filter_change .guideline_change h3#check + p {
  margin-bottom: 0;
}
/* ***************************************************************
  c7_top.html
******************************************************************
 オイル交換関連ページのCSS


*************************************************************** */
@media (min-width: 767px) {
  #oil_change .top_aside + a {
    width: calc(100% - var(--Spacing-spacing-12) * 2);
    margin: auto;
  }
}

/* オイル交換とは */
.subhead_list {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-9);
  margin-top: var(--Spacing-spacing-7);
}

/* 商品の選び方 */
.or_list_wrap div {
  display: flex;
  align-items: center;
  gap: var(--Spacing-spacing-3);
  align-self: stretch;
  width: 100%;
}
.table_list_wrap:has(.or_list_wrap) {
  margin: 0;
}
.or_list_wrap div dd {
  display: flex;
  padding: var(--Spacing-spacing-4) var(--Spacing-spacing-5);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-2);
  border-radius: var(--Radius-radius-2);
  background: var(--Background-primary);
  width: 100%;
}
.or_list_wrap div span {
  color: var(--Text-secondary);
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-3);
  font-weight: var(--font-weight-normal);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
  white-space: nowrap;
}
#oil_change .movie_list {
  margin-top: var(--Spacing-spacing-7);
}

/* ***************************************************************
  c8_shop_list.html
******************************************************************
 おとなの自動車保険ページのCSS


*************************************************************** */
#sompo_shop_search .contents {
  gap: 0;
}
#sompo_shop_search h2 {
  font-size: var(--Typography-FontSize-fontsize-8);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
}

/* 都道府県タグ一覧 */
.area_tag_wrap {
  margin-bottom: var(--Spacing-spacing-5);
}
.area_tag_wrap h2 {
  font-size: var(--Typography-FontSize-fontsize-8);
  margin: var(--Spacing-spacing-3) 0;
}
/* 店舗一覧 */
.area_store .area_store_list_wrap h3 {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-8);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  margin-bottom: var(--Spacing-spacing-4);
}
#sompo_shop_search .area_store {
  background-color: var(--transparent_color);
  padding: 0;
}
.area_store {
  display: none;
}
.area_store .area_store_list_wrap:not(:last-of-type) {
  margin-bottom: var(--Spacing-spacing-9);
}
.area_store .area_store_list_wrap ul {
  width: 100%;
}
.area_store .area_store_list_wrap > ul {
  display: flex;
  flex-wrap: wrap;
  gap: var(--Spacing-spacing-8);
}
.area_store .area_store_list_wrap > ul > li {
  width: calc(
    (100% - var(--Spacing-spacing-8) * 4 - var(--Spacing-spacing-8)) / 2
  );
  padding: var(--Spacing-spacing-5) var(--Spacing-spacing-8)
    var(--Spacing-spacing-7);
  background-color: var(--global_color);
  border-radius: var(--Radius-radius-4);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  row-gap: var(--Spacing-spacing-7);
}
.area_store .area_store_list_wrap li div {
  width: 100%;
}
.area_store .area_store_list_wrap li h4 {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--Spacing-spacing-2);
  margin-bottom: var(--Spacing-spacing-2);
}
.area_store .area_store_list_wrap li span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-4);
}
.area_store .area_store_list_wrap > p {
  color: var(--Text-tertiary);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .area_tag_wrap h2 {
    margin-top: var(--Spacing-spacing-5);
  }
  .area_store .area_store_list_wrap h3 {
    margin-bottom: var(--Spacing-spacing-5);
  }
  .area_store .area_store_list_wrap > ul {
    row-gap: var(--Spacing-spacing-5);
  }
  .area_store .area_store_list_wrap > ul > li {
    width: calc((100% - var(--Spacing-spacing-5) * 2));
    padding: var(--Spacing-spacing-5) var(--Spacing-spacing-5)
      var(--Spacing-spacing-7);
  }
}

/* ***************************************************************
  d1_top.html
******************************************************************
ピットサービスページのCSS


*************************************************************** */
/* 余白 */
#pit_service .white_background .container {
  padding-bottom: var(--Spacing-spacing-11);
}
#pit_service .grey_background .container,
#pit_service .blue_background .container {
  padding-bottom: var(--Spacing-spacing-9);
}
#pit_service .grey_background .contents {
  row-gap: var(--Spacing-spacing-8);
}
/* 角丸ボタン */
a:has(button.btn_square) {
  width: 100%;
  max-width: 358px;
}
button.btn_square {
  border: none;
  border-radius: var(--Radius-radius-2);
  background: var(--Background-primary);
  box-shadow:
    0 1px 2px 0 var(--box-shadow-color),
    0 0 20px 0 var(--box-shadow-color);
  display: flex;
  width: 100%;
  height: fit-content;
  padding: var(--Spacing-spacing-7_fixed) var(--Spacing-spacing-5_fixed)
    var(--Spacing-spacing-5_fixed);
  flex-direction: column;
  align-items: center;
  gap: var(--Spacing-spacing-3);
}
button.btn_square span::after {
  display: none;
}
button.btn_square img {
  max-width: 214px;
  padding: 0 var(--Spacing-spacing-9);
}
button.btn_square b {
  color: var(--Text-secondary);
  font-family: var(--secondary_font);
  font-size: var(--Typography-FontSize-fontsize-8);
  line-height: var(--Typography-LineHeight-lineheight-12);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-3);
}
button.btn_square span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  font-weight: var(--font-weight-bold);
}
/* 丸枠矢印画像 */
.pit_menu_list li a div::after {
  top: 1px;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  a:has(button.btn_square) {
    max-width: 358px;
  }
  button.btn_square img {
    max-width: 246px;
  }
}
/* サービス紹介 */
#pit_service .btn_wrap button span::after {
  transform: rotate(90deg);
}
#pit_service .white_background .background_none {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#pit_service .white_background .logo_img_autobacs {
  max-width: 320px;
  margin: var(--Spacing-spacing-5) auto;
  display: block;
}
#pit_service .white_background p {
  margin-bottom: var(--Spacing-spacing-7);
}
#pit_service .white_background a {
  display: inline-block;
  margin-top: var(--Spacing-spacing-7);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #pit_service .btn_wrap button:not(.btn_square) {
    width: 29.4rem;
    height: 5.6rem;
  }
  #pit_service .white_background .container {
    padding-top: 0;
  }
  #pit_service .white_background .container .mv_img_autobacs {
    width: 100vw;
  }
  #pit_service .white_background .logo_img_autobacs {
    max-width: 310px;
    width: 90%;
  }
  #pit_service h2[data-title="AUTOBACS Pit Service"] {
    font-size: var(--Typography-FontSize-fontsize-5);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  }
}

/* ピットサービス・メニュー一覧 */
.two_column_list,
.three_column_list {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  align-content: flex-start;
  gap: var(--Spacing-spacing-5);
  align-self: stretch;
}
.two_column_list {
  margin: var(--Spacing-spacing-7) 0 var(--Spacing-spacing-5);
}
.three_column_list {
  margin-bottom: var(--Spacing-spacing-7);
}
.two_column_list li {
  width: calc((100% - var(--Spacing-spacing-5)) / 2);
}
.three_column_list li {
  width: calc((100% - var(--Spacing-spacing-5) * 2) / 3);
}
.two_column_list li button,
.three_column_list li button {
  width: 100%;
  height: 100%;
  border-radius: var(--Radius-radius-4);
  background-color: var(--Surface-primary);
  padding: var(--Spacing-spacing-5_fixed);
  box-shadow:
    0 1px 2px 0 var(--box-shadow-color),
    0 0 20px 0 var(--box-shadow-color);
  display: flex;
  flex-direction: column;
}
.two_column_list li img,
.three_column_list li img {
  border-radius: var(--Radius-radius-2);
}
.two_column_list li h3,
.three_column_list li h3 {
  color: var(--Text-secondary);
  font-weight: var(--font-weight-bold);
  text-align: left;
  margin-top: var(--Spacing-spacing-5);
}
.two_column_list li h3 {
  font-size: var(--Typography-FontSize-fontsize-9);
  line-height: var(--Typography-LineHeight-lineheight-13);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-5);
}
.three_column_list li h3 {
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.two_column_list li p {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-normal);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  margin-top: var(--Spacing-spacing-3);
  padding-top: var(--Spacing-spacing-3);
  border-top: solid 1px var(--Divider-primary);
  text-align: left;
}
#pit_service .caption_wrap p span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-4);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .two_column_list li,
  .three_column_list li {
    width: 100%;
  }
  .three_column_list li button {
    align-items: center;
    flex-direction: row;
    gap: var(--Spacing-spacing-5);
  }
  .three_column_list li h3 {
    margin-top: 0;
  }
  .three_column_list li img {
    width: 50%;
  }
}

/* モーダル */
.modal_pit_service .modal_content {
  max-width: 1280px;
  max-height: 900px;
  padding-bottom: 0;
}

.modal_pit_service .modal_content {
  height: auto;
  max-height: 95vh;
  display: flex;
  flex-direction: column;
}

.modal_pit_service .modal_switch_wrap {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.modal_pit_service .modal_content .area_store_list_wrap,
.modal_switch_wrap .left_text_wrap {
  flex: none;
}
.modal_switch_left {
  width: 31%;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.modal_switch_left:not(:has(+ .modal_switch_right)) {
  width: 100%;
}
.modal_switch_right {
  width: 69%;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
/* PC（画面サイズ：大） */
@media (max-width: 1199px) {
  .modal_switch_left {
    width: 40%;
  }
  .modal_switch_right {
    width: 60%;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .modal_switch_left,
  .modal_switch_right {
    flex-shrink: 0;
    width: 100%;
  }
}
.modal_pit_service .modal_content article.modal_switch_wrap {
  padding: 0;
}
.modal_pit_service .modal_switch_wrap .left_text_wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--Spacing-spacing-2);
  align-self: stretch;
  padding: var(--Spacing-spacing-2) var(--Spacing-spacing-11)
    var(--Spacing-spacing-3);
  border-bottom: solid 1px var(--Divider-primary);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .modal_pit_service div button.modal_close {
    width: 40px;
    height: 40px;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .modal_pit_service .modal_switch_wrap .left_text_wrap {
    display: none;
  }
}

/* モーダル内コンテンツ */
.switch_list_wrap {
  flex: 1 1 auto;
  display: flex;
  min-height: 0;
  height: 100%;
}
/* モーダル切替ボタン */
.switch_list_wrap button {
  width: 100%;
  height: auto;
  min-height: 44px;
  padding: var(--Spacing-spacing-1) var(--Spacing-spacing-7);
  border: 1px solid var(--Button-Outlined-outline);
  background-color: var(--Button-Outlined-background);
}
.switch_list_wrap button span {
  font-size: var(--Typography-FontSize-fontsize-5);
  color: var(--Button-Outlined-foreground);
  font-weight: var(--font-weight-normal);
  width: calc(100% - var(--Spacing-spacing-11));
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .switch_list_wrap a:not(.btn_active) button span,
  .modal_switch a:not(:has(button)) {
    border-bottom: solid 1px var(--Divider-secondary);
  }
  .switch_list_wrap li:has(+ li .btn_active) button span,
  .switch_list_wrap li button.btn_active span {
    border-bottom: solid 1px var(--transparent_color);
  }
}
.switch_list_wrap .modal_switch_left p {
  margin: 0 var(--Spacing-spacing-5) var(--Spacing-spacing-2);
}
.switch_list_wrap .modal_switch_left p + a {
  margin: 0 var(--Spacing-spacing-5);
}
.switch_list_wrap .modal_switch_left p:not(:has(+ a)),
.switch_list_wrap .modal_switch_left p + a {
  margin-bottom: calc(var(--Spacing-spacing-5) * 2);
}
.switch_list_wrap img {
  border-radius: var(--Radius-radius-2);
}
.modal_switch_left:not(:has(+ .modal_switch_right)) .modal_switch {
  display: flex;
  flex-wrap: wrap;
}
.modal_switch_left:not(:has(+ .modal_switch_right)) .modal_switch li {
  width: calc((100% - var(--Spacing-spacing-5)) / 2);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .modal_switch_left:not(:has(+ .modal_switch_right)) .modal_switch li {
    width: 100%;
    display: inline-flex;
  }
}

.switch_left_wrap {
  height: 100%;
  overflow-y: auto;
  scroll-snap-type: x mandatory;
  background-color: var(--transparent_color);
  padding: var(--Spacing-spacing-6) 0 var(--Spacing-spacing-6)
    var(--Spacing-spacing-6);
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
}

.pit_scroll_wrapper {
  position: relative;
}

/* ネイティブスクロール完全無効化 */
.pit_scroll_content {
  height: 100%;
  overflow-y: auto;
  scrollbar-width: none; /* Firefox */
}
.pit_scroll_content::-webkit-scrollbar {
  display: none; /* WebKit */
}

/* ul内ボタンを透過 */
.pit_scroll_content li button,
.scroll-switch_left_wrap li button,
.scroll-switch_right_wrap li button {
  background: transparent;
}

/* 自作スクロールバー */
.pit_scrollbar {
  position: absolute;
  top: 0;
  right: 8px;
  width: 6px;
  height: 100%;
  pointer-events: none;
}

.pit_thumb {
  width: 6px;
  background: var(--Neutral-300);
  border-radius: var(--Radius-radius-full);
  opacity: 0;
  transition: opacity var(--Transition-quinary);
}

/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .switch_left_wrap {
    background: var(--Background-secondary);
  }
  .pit_scrollbar {
    right: 6px;
  }
  .switch_left_wrap .bk_sp_767 {
    display: none;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .switch_left_wrap {
    padding: var(--Spacing-spacing-3) 0 var(--Spacing-spacing-6);
  }
  .pit_thumb {
    width: 4px;
  }
}
.modal_pit_service .modal_switch_right article.contents_wrap {
  display: flex;
  flex-direction: column;
  row-gap: var(--Spacing-spacing-3);
  padding: var(--Spacing-spacing-6) var(--Spacing-spacing-11);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .modal_pit_service .modal_switch_right article.contents_wrap {
    padding: var(--Spacing-spacing-0) var(--Spacing-spacing-5)
      var(--Spacing-spacing-5);
  }
  .modal_pit_service .modal_switch_right .modal_contents_title {
    padding: var(--Spacing-spacing-3) 0;
    background-color: var(--Surface-primary);
    position: sticky;
    top: 0;
  }
}
/* 左側 */
.modal_switch_left h3 {
  margin: var(--Spacing-spacing-0) var(--Spacing-spacing-11)
    var(--Spacing-spacing-2)
    calc(var(--Spacing-spacing-11) - var(--Spacing-spacing-6));
}
.modal_switch + a {
  display: block;
  margin: calc(var(--Spacing-spacing-5) * 2) var(--Spacing-spacing-11) 0
    var(--Spacing-spacing-6);
}
.modal_switch button {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  padding: 0;
  border: none;
  text-align: left;
  width: 100%;
}
.modal_switch button,
.modal_switch a:not(:has(button)),
.modal_switch_right ul a {
  color: var(--Text-primary);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: var(--font-weight-normal);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
.modal_switch button span,
.modal_switch a:not(:has(button)),
.modal_switch_right ul a {
  padding: var(--Spacing-spacing-5) 0;
}

.modal_switch button span,
.modal_switch a:not(:has(button)) {
  margin: 0 var(--Spacing-spacing-11) 0
    calc(var(--Spacing-spacing-11) - var(--Spacing-spacing-6));
}
.modal_switch button span {
  display: block;
}
.modal_switch_right ul li {
  border-bottom: solid 1px var(--Divider-primary);
}

.modal_switch li button {
  gap: var(--Spacing-spacing-5);
  justify-content: space-between;
  transition: var(--Transition-primary);
  background-color: var(--transparent_color);
  border-radius: var(--Radius-radius-full) 0 0 var(--Radius-radius-full);
}

.modal_switch a:not(:has(button)),
.modal_switch_right ul a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: var(--Spacing-spacing-4);
}
.modal_switch_right ul a {
  width: 100%;
}

.modal_switch a[target]:not(:has(button)) span::after,
.modal_switch_right ul a[target] span::after {
  width: 24px;
  min-width: 24px;
  height: 24px;
  vertical-align: middle;
  top: 0;
  margin-left: var(--Spacing-spacing-2);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .modal_switch li a.btn_active button {
    background-color: var(--Background-primary);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .modal_switch_left h3 {
    margin: 0 var(--Spacing-spacing-5);
  }
  .modal_switch li {
    border-bottom: solid 1px var(--Divider-primary);
  }
  .modal_switch button span,
  .modal_switch a:not(:has(button)) {
    padding: var(--Spacing-spacing-5) var(--Spacing-spacing-7);
    margin: 0;
  }
  .modal_switch button span {
    width: 100%;
  }
  .modal_switch a:not(:has(button)) {
    width: calc(100% - var(--Spacing-spacing-7) * 2);
  }
  .modal_switch a[target]:not(:has(button)) span::after {
    width: 20px;
    height: 20px;
  }
  .modal_switch + a {
    margin: calc(var(--Spacing-spacing-5) * 2) var(--Spacing-spacing-5)
      var(--Spacing-spacing-5);
  }
}

/* 右側 */
.switch_right_wrap {
  display: flex;
  overflow: hidden;
  scroll-behavior: smooth;
  flex: 1 1 auto;
  min-height: 0;
}
.switch_right_wrap .pit_scroll_wrapper {
  width: 100%;
  min-width: 100%;
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .switch_right_wrap a:has(h3) {
    pointer-events: none;
  }
}
.modal_switch_right iframe {
  width: 100%;
  height: 100%;
  aspect-ratio: 16/9;
  border-radius: var(--Radius-radius-2);
}
/* 目役工賃/作業時間 */
.modal_switch_right dl {
  background: var(--Background-secondary);
  border-radius: var(--Radius-radius-3);
  padding: var(--Spacing-spacing-5);
  display: flex;
  flex-direction: column;
  row-gap: calc(var(--Spacing-spacing-2) * 2);
}
.modal_content .modal_switch_right dl > div {
  display: flex;
  align-items: flex-start;
  gap: var(--Spacing-spacing-0) var(--Spacing-spacing-5);
}
.modal_content .modal_switch_right dt,
.modal_content .modal_switch_right dd {
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  font-weight: var(--font-weight-normal);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  color: var(--Text-secondary);
}
.modal_content .modal_switch_right dl dd {
  width: 100%;
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .modal_content .modal_switch_right dl div div,
  .modal_content .modal_switch_right dl > div > dd {
    width: calc(100% - 100px);
  }
}
.modal_content .modal_switch_right dd b {
  font-weight: var(--font-weight-medium);
}
.modal_content .modal_switch_right dd b span {
  font-size: var(--Typography-FontSize-fontsize-3);
  font-weight: var(--font-weight-normal);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .modal_content .modal_switch_right dl > div {
    flex-direction: column;
  }
}

/* 注意書き */
.modal_switch_right small {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-3);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
  display: block;
}
.modal_switch_right p small {
  margin-top: var(--Spacing-spacing-3);
}
.modal_right_banner {
  margin: var(--Spacing-spacing-7) 0;
}
.modal_switch_right ul {
  display: flex;
  flex-wrap: wrap;
}
.modal_switch_right ul:has(a) {
  column-gap: var(--Spacing-spacing-11_fixed);
}

.modal_switch_right ul:has(a) li {
  width: calc((100% - var(--Spacing-spacing-11_fixed)) / 2);
  display: flex;
}

.modal_switch_right .modal_caption_wrap li {
  font-size: var(--Typography-FontSize-fontsize-5);
  line-height: var(--Typography-LineHeight-lineheight-16);
  font-weight: var(--font-weight-normal);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  color: var(--Text-secondary);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .switch_right_wrap a:has(.return_btn) {
    display: none;
  }
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  .modal_switch_right ul:has(a) li {
    width: 100%;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  /* モーダル内コンテンツ */
  .switch_list_wrap {
    width: 100%;
    overflow-x: hidden;
    scroll-behavior: smooth;
  }
  .modal_pit_service .modal_content article.modal_switch_wrap {
    padding: 0;
  }
  /* 右側 */
  .switch_right_wrap {
    scroll-behavior: auto;
  }
  .switch_right_wrap a:has(h3),
  .switch_right_wrap a:has(.return_btn) {
    display: block;
    width: fit-content;
  }
  .switch_right_wrap h3 {
    display: flex;
    align-items: center;
  }
  .switch_right_wrap .return_btn {
    display: flex;
    padding: 0;
    justify-content: center;
    align-items: center;
    gap: var(--Spacing-spacing-2);
    border: none;
    min-height: auto;
    padding: var(--Spacing-spacing-8) var(--Spacing-spacing-0);
  }
  .switch_right_wrap .return_btn span {
    color: var(--Text-secondary);
    font-size: var(--Typography-FontSize-fontsize-5);
    font-weight: var(--font-weight-bold);
    line-height: 24px;
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
    width: auto;
  }

  .switch_right_wrap h3::before,
  .switch_right_wrap .return_btn::before {
    display: inline-block;
    content: "";
    background-image: url(images/icon_chevron_right.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: rotate(180deg);
    width: 24px;
    height: 24px;
    position: relative;
    vertical-align: middle;
  }
}
/* ピットサービス一覧下要素 */
.two_column_list ~ .aside_btn_list_wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: var(--Spacing-spacing-5);
}

/* ピットメニュー */
#pit_service .blue_background h2 img {
  width: 21.4rem;
  margin: auto;
  display: block;
}
#pit_service .blue_background section {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#pit_service .blue_background section > p {
  text-align: center;
}
/* ピットメニュー一覧 */
.pit_menu_list {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  align-content: flex-start;
  gap: var(--Spacing-spacing-5);
  align-self: stretch;
  flex-wrap: wrap;
  margin: var(--Spacing-spacing-7) 0;
}
.pit_menu_list li {
  width: calc((100% - var(--Spacing-spacing-5)) / 2);
}
.pit_menu_list li a {
  display: flex;
  padding: var(--Spacing-spacing-5_fixed);
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: var(--Spacing-spacing-5);
  align-self: stretch;
  border-radius: var(--Radius-radius-4);
  background-color: var(--Surface-primary);
}
.pit_menu_list li a > img {
  border-radius: var(--Radius-radius-2);
}
.pit_menu_list li a div {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: var(--Spacing-spacing-5);
  align-self: stretch;
}
.pit_menu_list li h3 {
  width: 100%;
}
.pit_menu_list li h3 span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-4);
  font-weight: var(--font-weight-normal);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  display: block;
}
#pit_service .blue_background aside {
  background-color: var(--transparent_color);
  border-radius: 0;
  padding: 0;
  row-gap: var(--Spacing-spacing-5);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  /* ピットメニュー */
  #pit_service .blue_background h2 img {
    width: 29.4rem;
  }
  /* ピットメニュー一覧 */
  .pit_menu_list {
    margin-bottom: calc(var(--Spacing-spacing-7) + var(--Spacing-spacing-5));
  }
  .pit_menu_list li {
    width: 100%;
  }
}
/* ピットサービスに関するニュース */
#pit_service article.container > .contents {
  margin-top: var(--Spacing-spacing-9);
}
#pit_service section:has(.post_switch_wrap) {
  margin-bottom: var(--Spacing-spacing-8);
}
/* ピットニュース動画/ */
#pit_service article.container > .contents .background_none p {
  margin-bottom: var(--Spacing-spacing-7);
}
#pit_service .btn_wrap:has(.btn_square) {
  padding: calc(var(--Spacing-spacing-7)) 0 var(--Spacing-spacing-11);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  /* ピットサービスに関するニュース */
  #pit_service article.container > .contents {
    gap: 0;
  }
}

/* ***************************************************************
  d2_top.html
******************************************************************
店舗情報ページのCSS


*************************************************************** */
#store_info article.container {
  padding-bottom: 0;
}
/* 店舗案内 */
.info_banner_list {
  display: flex;
  align-items: flex-start;
  gap: var(--Spacing-spacing-7) var(--Spacing-spacing-6);
  align-self: stretch;
}
.info_banner_list li {
  width: 50%;
}
.info_banner_list li img {
  border-radius: var(--Radius-radius-2);
  box-shadow:
    0 1px 2px 0 var(--box-shadow-color),
    0 0 20px 0 var(--box-shadow-color);
}
#store_info article.container > .background_none {
  padding-bottom: var(--Spacing-spacing-9);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .info_banner_list {
    flex-direction: column;
  }
  .info_banner_list li {
    width: 100%;
  }
}

/* 各種オートバックス店舗のご紹介 */
article.container section.background_none article:has(.ab_store_list) {
  padding: var(--Spacing-spacing-8) var(--Spacing-spacing-11_fixed) 0;
}
.info_banner_list h2 {
  line-height: var(--Typography-LineHeight-lineheight-14);
}
.ab_store_list {
  display: flex;
  flex-wrap: wrap;
  column-gap: calc(var(--Spacing-spacing-6) * 2);
}
.ab_store_list li {
  width: calc(50% - var(--Spacing-spacing-6));
  border-top: solid 1px var(--Divider-primary);
}
.ab_store_list li a,
.ab_store_list li a h3 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: var(--Spacing-spacing-4);
}
.ab_store_list li a {
  padding: var(--Spacing-spacing-5_fixed) 0;
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  .ab_store_list li:nth-last-child(2) {
    border-bottom: solid 1px var(--Divider-primary);
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  article.container section.background_none article:has(.ab_store_list) {
    padding-left: var(--Spacing-spacing-5);
    padding-right: var(--Spacing-spacing-5);
  }
}

.ab_store_list img {
  width: 4rem;
}
.ab_store_list h3 {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  font-weight: 700;
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  width: 100%;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .ab_store_list {
    flex-direction: column;
  }
  .ab_store_list li {
    width: 100%;
  }
  .ab_store_list img {
    width: 6.4rem;
  }
}
/* サービス案内 */
.service_guide_list h2 {
  font-size: var(--Typography-FontSize-fontsize-8);
  font-weight: 700;
  line-height: var(--Typography-LineHeight-lineheight-14);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
  margin-bottom: var(--Spacing-spacing-3);
}
.service_guide_list {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  row-gap: var(--Spacing-spacing-9);
}
.service_guide_list > li {
  width: 100%;
}
.service_guide_list .snap_list {
  display: flex;
  align-items: stretch;
  gap: var(--Spacing-spacing-3);
  flex-wrap: wrap;
}
.service_guide_list .snap_list li {
  width: calc((100% - var(--Spacing-spacing-3)) / 2);
}
.service_guide_list a {
  display: block;
  padding: var(--Spacing-spacing-5_fixed);
  border-radius: var(--Radius-radius-4);
  background-color: var(--Surface-primary);
  box-shadow:
    0 1px 2px 0 var(--box-shadow-color),
    0 0 20px 0 var(--box-shadow-color);
  height: calc(100% - var(--Spacing-spacing-5_fixed) * 2);
}
.service_guide_list a img {
  border-radius: var(--Radius-radius-2);
}
.service_guide_list a h3 {
  margin: var(--Spacing-spacing-3) 0 var(--Spacing-spacing-1);
}
.service_guide_list a p {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
/* スマートフォン（画面サイズ：小）以上 */
@media (min-width: 767px) {
  #store_info .indicator_button_wrap {
    display: none;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .service_guide_list {
    row-gap: 0;
  }
  .service_guide_list .snap_wrapper {
    width: 100vw;
    margin: 0 calc(50% - 50vw);
  }
  .service_guide_list
    li:not(:last-child)
    .snap_wrapper:has(+ .indicator_button_wrap.none) {
    margin-bottom: calc(var(--Spacing-spacing-9) - var(--Spacing-spacing-5));
  }
  .service_guide_list .snap_list {
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
    gap: var(--Spacing-spacing-3);
    align-self: stretch;
    touch-action: pan-y;
    margin-top: calc(0px - var(--Spacing-spacing-3) - var(--Spacing-spacing-5));
    padding: calc(var(--Spacing-spacing-3) + var(--Spacing-spacing-5))
      var(--Spacing-spacing-5);
  }
  .service_guide_list
    li:last-child
    .snap_wrapper:has(+ .indicator_button_wrap.none)
    .snap_list {
    margin-bottom: calc(
      0px - var(--Spacing-spacing-3) - var(--Spacing-spacing-5)
    );
  }
  .service_guide_list .snap_list > li {
    width: 64%;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
  }
  .service_guide_list .snap_list > li img {
    padding-left: 0;
  }
  .service_guide_list li:not(:last-child) .indicator_button_wrap {
    margin-bottom: var(--Spacing-spacing-8);
  }
  .service_guide_list a h3 {
    margin-bottom: var(--Spacing-spacing-2);
  }
  .service_guide_list a p {
    font-size: var(--Typography-FontSize-fontsize-4);
  }
}
/* ***************************************************************
  auticle.html
******************************************************************
ピットサービス詳細ページのCSS


*************************************************************** */
#pit_post .container_radius {
  background-color: var(--Background-secondary);
}
#pit_post h3,
#pit_post h4 {
  color: var(--Text-secondary);
  font-weight: var(--font-weight-bold);
  line-height: var(--Typography-LineHeight-lineheight-14);
  margin-bottom: var(--Spacing-spacing-1);
}
#pit_post h3 {
  font-size: var(--Typography-FontSize-fontsize-9);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-5);
}
#pit_post h4 {
  font-size: var(--Typography-FontSize-fontsize-8);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-4);
}
#pit_post .btm_contents img {
  border-radius: var(--Radius-radius-2);
}
#pit_post .btm_contents .mid_aside img {
  border-radius: var(--Radius-radius-0);
}
#pit_post .btm_contents .detail_list li img {
  border-radius: var(--Corner-small);
}
#pit_post .container {
  padding-top: var(--Spacing-spacing-8);
}
#pit_post .contents {
  row-gap: 0;
}

#pit_post .contents .top_contents {
  position: relative;
  z-index: 15;
}
#pit_post .contents .top_contents > p {
  margin-bottom: var(--Spacing-spacing-8);
}
#pit_post .contents .btm_contents {
  display: flex;
  flex-direction: column;
  row-gap: var(--Spacing-spacing-9);
}

#pit_post .top_aside .aside_btn_list_wrap,
#pit_post .mid_aside .aside_btn_list_wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--Spacing-spacing-5);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #pit_post .top_aside {
    display: flex;
    padding: var(--Spacing-spacing-6) 0;
    flex-direction: column;
    align-items: center;
    border-radius: var(--Radius-radius-4);
    background: var(--Background-primary);
    margin: auto;
    width: 100%;
  }
}
#pit_post article.container .contents .mid_aside > img {
  width: 30%;
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  #pit_post article.container .contents .mid_aside > img {
    width: 26%;
  }
}

#pit_post article.container .btm_contents .gap_wrap {
  display: flex;
  flex-direction: column;
  gap: var(--Spacing-spacing-9);
}
#pit_post article.container .top_aside_block_wrap,
#pit_post article.container .contents_block_wrap {
  display: flex;
  flex-direction: column;
}
#pit_post article.container .top_aside_block_wrap {
  gap: var(--Spacing-spacing-3);
  margin-bottom: var(--Spacing-spacing-8);
}
#pit_post article.container .contents_block_wrap {
  gap: var(--Spacing-spacing-5);
}

.contents_block_wrap dd {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-5);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #pit_post article.container .top_aside_block_wrap {
    margin-bottom: var(--Spacing-spacing-3);
  }
}

#pit_post .mv_img_wrap:before {
  display: block;
  background: rgba(16, 16, 16, 0.8);
  -webkit-filter: blur(0);
  -moz-filter: blur(0);
  -o-filter: blur(0);
  -ms-filter: blur(0);
  filter: blur(0);
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
}

#pit_post .mv_img_wrap .mv_flex_wrap {
  display: flex;
  column-gap: var(--Spacing-spacing-8);
  justify-content: center;
  padding: var(--Spacing-spacing-12) 0 calc(var(--Spacing-spacing-12) + 80px);
  width: 80%;
  max-width: 1280px;
  margin: auto;
}

#pit_post .mv_img_wrap .mv_flex_wrap h1 {
  color: var(--Text-invert);
  font-size: var(--Typography-FontSize-fontsize-10);
  line-height: var(--Typography-LineHeight-lineheight-15);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-6);
  margin: 0;
}
#pit_post .mv_img_wrap img {
  width: 38.8rem;
  object-fit: cover;
}
#pit_post .mv_img_wrap img {
  aspect-ratio: 5/2;
  border-radius: var(--Radius-radius-2);
}
#pit_post .mv_img_wrap img + div {
  padding: var(--Spacing-spacing-5) 0;
}
#pit_post .mv_img_wrap img + div span,
#pit_post .mv_img_wrap img + div time {
  color: var(--Text-invert);
  font-size: var(--Typography-FontSize-fontsize-4);
  line-height: var(--Typography-LineHeight-lineheight-16);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
}
#pit_post .mv_img_wrap img + div time {
  font-family: var(--secondary_font);
  line-height: var(--Typography-LineHeight-lineheight-12);
}
/* PC（画面サイズ：大） */
@media (max-width: 1199px) {
  #pit_post .mv_img_wrap img {
    width: 30rem;
  }
}
@media (max-width: 1199px) and (min-width: 767px) {
  #pit_post .mv_img_wrap .mv_flex_wrap h1 {
    font-size: var(--Typography-FontSize-fontsize-8);
  }
}
/* タブレット（画面サイズ：中）*/
@media (max-width: 991px) {
  #pit_post .mv_img_wrap img {
    width: 25rem;
  }
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #pit_post .mv_img_wrap .mv_flex_wrap {
    flex-direction: column;
  }
  #pit_post .mv_img_wrap .mv_flex_wrap h1 {
    font-size: var(--Typography-FontSize-fontsize-9);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-5);
  }

  #pit_post .mv_img_wrap .mv_flex_wrap {
    padding: var(--Spacing-spacing-5) 0 calc(var(--Spacing-spacing-5) + 32px);
  }
  #pit_post .mv_img_wrap img {
    width: 100%;
    height: auto;
    aspect-ratio: 358/143;
  }
}

/* 横並び記事 */
.pit_flex_wrap {
  display: flex;
  align-items: flex-start;
  gap: var(--Spacing-spacing-5);
  align-self: stretch;
}
.pit_flex_wrap img {
  width: 50%;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  .pit_flex_wrap {
    flex-direction: column;
  }
  .pit_flex_wrap img {
    width: 100%;
  }
}
/* 吹き出し/ブログカード */
#pit_post .speech_bubody_scroll_wraple_wrap article,
#pit_post .blog_card_wrap article {
  display: flex;
  padding: var(--Spacing-spacing-5_fixed);
  justify-content: center;
  gap: var(--Spacing-spacing-3) var(--Spacing-spacing-5);
  position: relative;
}
#pit_post .speech_bubody_scroll_wraple_wrap article {
  align-items: flex-start;
}
#pit_post .blog_card_wrap article {
  align-items: center;
}
/* 吹き出し */
#pit_post .speech_bubody_scroll_wraple_wrap img {
  width: 80px;
  height: 80px;
  aspect-ratio: 1/1;
  border-radius: var(--Radius-radius-full);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #pit_post .speech_bubody_scroll_wraple_wrap article {
    padding: var(--Spacing-spacing-10) var(--Spacing-spacing-3)
      var(--Spacing-spacing-3);
    flex-direction: column;
    margin-top: var(--Spacing-spacing-9);
  }
  #pit_post .speech_bubody_scroll_wraple_wrap img {
    position: absolute;
    left: 16px;
    top: -40px;
  }
}

/* ブログカード */
#pit_post .blog_card_wrap article {
  background-color: var(--Background-primary);
  box-shadow:
    0 1px 2px 0 var(--box-shadow-color),
    0 0 20px 0 var(--box-shadow-color);
}
#pit_post .blog_card_wrap article > div {
  position: relative;
  width: 63%;
}
#pit_post .blog_card_wrap article img {
  border: 1px solid var(--Button-Outlined-outline);
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #pit_post .blog_card_wrap article {
    flex-direction: column;
  }
  #pit_post .blog_card_wrap article > div {
    width: 100%;
  }
}

/* タグ */
#pit_post .blog_card_wrap article > div::before,
#pit_post .detail_list li:first-child .img_box::before {
  position: absolute;
  left: 8px;
  bottom: 8px;
  border-radius: var(--Radius-radius-full);
  height: 30px;
}
#pit_post .blog_card_wrap article > div::before {
  content: "関連記事";
  display: inline-block;
  line-height: 28px;
  border: 1px solid var(--Button-Outlined-outline);
  background: var(--Button-Outlined-background);
  color: var(--Button-Outlined-foreground);
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-4);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
  padding: 0 var(--Spacing-spacing-4);
}

#pit_post .detail_list li:first-child .img_box::before {
  content: "おすすめ";
  display: inline-block;
  line-height: 28px;
  border: 1px solid var(--Orange-300);
  background-color: var(--Background-primary);
  color: var(--Text-accent-orange);
  text-align: center;
  font-size: var(--Typography-FontSize-fontsize-3);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-0);
  padding: 0 var(--Spacing-spacing-3);
}
/* CTR */
#pit_post .mid_aside p span {
  color: var(--Text-secondary);
  font-size: var(--Typography-FontSize-fontsize-7);
  font-weight: var(--font-weight-medium);
  letter-spacing: var(--Typography-LetterSpacing-letterspacing-2);
}
#pit_post .mid_aside p span b {
  margin-top: 0;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #pit_post article.container section:has(.mid_aside) {
    margin-top: var(--Spacing-spacing-9);
  }
  #pit_post .mid_aside p span,
  #pit_post .mid_aside p span b {
    font-size: var(--Typography-FontSize-fontsize-5);
    letter-spacing: var(--Typography-LetterSpacing-letterspacing-1);
  }
}

/* アコーディオンメニュー */
#pit_post
  article.container
  .accordion_container_list
  article.accordion_container {
  margin-bottom: var(--Spacing-spacing-8);
}

/* 関連記事 */
#pit_post .detail_list li:first-child .img_box {
  position: relative;
}
#pit_post section.post_section {
  padding-bottom: var(--Spacing-spacing-5);
}
#pit_post .post_section h2.transition_title {
  margin-top: -5.6rem;
}
/* スマートフォン（画面サイズ：小） */
@media (max-width: 767px) {
  #pit_post .post_section h2.transition_title {
    margin-top: -6.4rem;
  }
}