﻿@charset "UTF-8";
/*!
Theme Name: yoshida
Theme URI: -
Author: pedal
Author URI: -
Description: 吉田建設ウェブサイトテーマ
Version: 1.0.0
License: GPLv2
License URI: https://www.gnu.org/licenses/old-licenses/gpl-2.0.html
Text Domain: -
Tested up to: 6.5
Requires PHP: 8.0
*/
/*--------------------------------------------------------------
>>> コンテンツ詳細
----------------------------------------------------------------
# mixins：mixin定義
# variable：変数定義
# reset：リセットcss
# base：ルートやタグそのものに関する設定
# common：共通
# header：ヘッダー
# footer：フッター

# index：トップページ
# page：固定ページテンプレート
# news：お知らせ（一覧・詳細）
# blog：ブログ（一覧・詳細）
# blog：施工事例（一覧・詳細）
# about：初めての方へ
# commitments：5つのこだわり
# enquiry：お問い合わせ
# staff：スタッフ紹介
# voice：お客様の声
# real-estate：不動産情報
# event：イベント情報
# fullorder：フルオーダー注文住宅
# setonosha：コンセプト住宅 瀬戸の舎 mirai
# diary-new：30年日記30の幸せ（新築）
# building：リノベ・新築共通
# new-house：新築住宅
# renovation：リノベ
# privacypolicy：プライバシーポリシー
# resumulab：暮らし体感モデルハウス りすむ・らぼ
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# reset：リセットcss
--------------------------------------------------------------*/
/*! destyle.css v2.0.2 | MIT License | https://github.com/nicolas-cusan/destyle.css */
/* Reset box-model and set borders */
/* ============================================ */
*,
*::before,
*::after {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
  border-style: solid;
  border-width: 0;
}

html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

/* Document */
/* ============================================ */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Remove gray overlay on links for iOS.
 */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -webkit-tap-highlight-color: transparent; /* 3*/
}

/* Sections */
/* ============================================ */
body {
  margin: 0;
}

/* Headings */
/* ============================================ */
h1 {
  margin: 0.67em 0;
}

/* Lists (enumeration) */
/* ============================================ */
ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Lists (definition) */
/* ============================================ */
dt {
  font-weight: bold;
}

dd {
  margin-left: 0;
}

/* Grouping content */
/* ============================================ */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}

address {
  font-style: inherit;
}

/* Text-level semantics */
/* ============================================ */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content */
/* ============================================ */
/**
 * Prevent vertical alignment issues.
 */
img,
embed,
object,
iframe {
  vertical-align: bottom;
}

/* Forms */
/* ============================================ */
/**
 * Reset form fields to make them styleable
 */
button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 0;
  text-align: inherit;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type=button],
[type=reset],
[type=submit] {
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
}

button[disabled],
[type=button][disabled],
[type=reset][disabled],
[type=submit][disabled] {
  cursor: default;
}

/**
 * Remove the inner border and padding in Firefox.
 */
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Remove padding
 */
option {
  padding: 0;
}

/**
 * Reset to invisible
 */
fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the outline style in Safari.
 */
[type=search] {
  outline-offset: -2px; /* 1 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/**
 * Clickable labels
 */
label[for] {
  cursor: pointer;
}

/* Interactive */
/* ============================================ */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/*
 * Remove outline for editable content.
 */
[contenteditable] {
  outline: none;
}

/* Table */
/* ============================================ */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  vertical-align: top;
}

th {
  font-weight: bold;
}

/*--------------------------------------------------------------
# variable：変数定義
	- font
	- color
	- column
	- breakpoint
--------------------------------------------------------------*/
/* サイズなど
--------------------------------------------- */
:root {
  /* ----- 横幅 ----- */
  --width__max: 1440px;
  --width__section: 1240px;
  --width__page: 760px;
  /* ----- gnav ----- */
  --height__gnav-pc: 120px;
  --height__gnav-sp: 70px;
  /* ----- fixed nav ----- */
  --height__fixednav: 70px;
  /* ----- padding ----- */
  --pt__page-color: 7rem;
  --pb__page-color: 7em;
  --mb__page: 6em;
  --mb__page-title: 3rem;
  --pt__section-color: 5em;
  --pb__section-color: 5em;
  --margin__section-sp: 2em;
  --margin__section: 4em;
  --margin__secTitle-sp: 1.5em;
  --margin__secTitle-tb: 3.5em;
}

/* color
--------------------------------------------- */
:root {
  --color__text: #333333;
  --color__white: #fff;
  --color__accent: #523132;
  --color__background-body: #fff;
  --color__background-body-rgb: 255, 255, 255;
  --color__background-section: #f0efed;
  --color__background-accent: #523132;
  --color__background-part: #d7d4cc;
  --color__background-contact: #d7d4cc;
  --color__background-pagination: #d7d4cc;
  --color__background-black: #333333;
  --color__background-text: #333333;
  --color__border-accent: #523132;
  --color__border-text: #333333;
  --color__border-white: #fff;
  --color__border-input: #bcbcbc;
  --color__blog-president: #aec6d9;
  --color__blog-mie: #e4c59d;
  --color__blog-staff: #8fba94;
  --color__blog-reform: #c9caca;
  --color__sdgs: #b41e6d;
}

.btn.white {
  --color__btn-text: var(--color__accent);
  --color__btn-background: var(--color__white);
  --color__btn-border: var(--color__accent);
  --color__btn-border-hover: var(--color__accent);
  --color__btn-text-hover: var(--color__white);
  --color__btn-background-hover: var(--color__accent);
  --color__btn-arrow-image: url(img/btn_arrow-right-brown.svg);
}

.btn.brown {
  --color__btn-text: var(--color__white);
  --color__btn-background: var(--color__accent);
  --color__btn-border: var(--color__accent);
  --color__btn-border-hover: var(--color__accent);
  --color__btn-text-hover: var(--color__accent);
  --color__btn-background-hover: var(--color__white);
  --color__btn-arrow-image: url(img/btn_arrow-right-white.svg);
}

/* font
--------------------------------------------- */
:root {
  --font__gothic: "TsukuGoPro", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo,
    "Noto Sans CJK JP", sans-serif;
  --font__mincho: "TsukuMinPro", serif;
  --font__weight-light: 300;
  --font__weight-regular: 400;
  --font__weight-demibold: 600;
  --font__weight-bold: 700;
  --font__weight-extrabold: 800;
  --font__line-height-body: 1.75;
  --font__letter-title: 0.2em;
  --font__letter-title-attention: 0.15em;
  --font__letter-text: 0.05em;
  --font__letter-button: 0.1em;
}

/* breakpoint
--------------------------------------------- */
/*--------------------------------------------------------------
# mixins：mixin定義
	- center-block
	- column-with
	- mq-up
	- mq-down
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# base：ルートやタグそのものに関する設定
--------------------------------------------------------------*/
/* ローカルフォント読み込み
--------------------------------------------- */
@font-face {
  font-family: "TsukuMinPro";
  src: url("fonts/FOT-TsukuMinPro-R.otf") format("opentype");
  font-weight: 400;
}
@font-face {
  font-family: "TsukuMinPro";
  src: url("fonts/FOT-TsukuMinPro-D.otf") format("opentype");
  font-weight: 600;
}
@font-face {
  font-family: "TsukuGoPro";
  src: url("fonts/FOT-TsukuGoPro-R.otf") format("opentype");
  font-weight: 400;
}
@font-face {
  font-family: "TsukuGoPro";
  src: url("fonts/FOT-TsukuGoPro-D.otf") format("opentype");
  font-weight: 600;
}
@font-face {
  font-family: "TsukuGoPro";
  src: url("fonts/FOT-TsukuGoPro-B.otf") format("opentype");
  font-weight: 700;
}
@font-face {
  font-family: "TsukuGoPro";
  src: url("fonts/FOT-TsukuGoPro-E.otf") format("opentype");
  font-weight: 800;
}
/* font-sizeの設定
--------------------------------------------- */
*,
::before,
::after {
  --clamp-root-font-size: 16;
  --clamp-slope: calc((var(--clamp-max) - var(--clamp-min)) / (var(--clamp-viewport-max) - var(--clamp-viewport-min)));
  --clamp-y-axis-intersection: calc(var(--clamp-min) - (var(--clamp-slope) * var(--clamp-viewport-min)));
  --clamp-preffered-value: calc(
    var(--clamp-y-axis-intersection) * (1rem / var(--clamp-root-font-size)) + (var(--clamp-slope) * 100vi)
  );
  --clamp: clamp(
    calc(var(--clamp-min) * (1rem / var(--clamp-root-font-size))),
    var(--clamp-preffered-value),
    calc(var(--clamp-max) * (1rem / var(--clamp-root-font-size)))
  );
  font-size: var(--clamp);
}

html {
  scroll-padding-top: var(--height__gnav-sp);
}
@media screen and (min-width: 1280px) {
  html {
    scroll-padding-top: var(--height__gnav-pc);
  }
}

/* body
--------------------------------------------- */
body {
  --clamp-viewport-min: 375;
  --clamp-viewport-max: 1440;
  --clamp-min: 14;
  --clamp-max: 16;
  position: relative;
  background: var(--color__background-body);
  color: var(--color__text);
  font-family: var(--font__gothic);
  line-height: var(--font__line-height-body);
  font-weight: var(--font__weight-demibold);
  -webkit-font-feature-settings: "palt" 1;
          font-feature-settings: "palt" 1;
  letter-spacing: var(--font__letter-text);
}

/*--------------------------------------------------------------
# common：共通
--------------------------------------------------------------*/
/* 全ページ共通設定
--------------------------------------------- */
body a:not(.btn) {
  word-wrap: break-word;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
@media (any-hover: hover) {
  body a:not(.btn):hover {
    opacity: 0.5;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }
}
/* ページ・共通コンポーネント デフォルトマージン打ち消し
  .header
  .common_contact：共通問い合わせ(footer扱い)
  .footer
  .index：トップページ(main内)
--------------------------------------------- */
.header p,
.header h1,
.header h2,
.header h3,
.header h4,
.header h5,
.header dl,
.common_contact p,
.common_contact h1,
.common_contact h2,
.common_contact h3,
.common_contact h4,
.common_contact h5,
.common_contact dl,
.footer p,
.footer h1,
.footer h2,
.footer h3,
.footer h4,
.footer h5,
.footer dl,
.index p,
.index h1,
.index h2,
.index h3,
.index h4,
.index h5,
.index dl,
.commitments p,
.commitments h1,
.commitments h2,
.commitments h3,
.commitments h4,
.commitments h5,
.commitments dl,
.staff p,
.staff h1,
.staff h2,
.staff h3,
.staff h4,
.staff h5,
.staff dl,
.fullorder p,
.fullorder h1,
.fullorder h2,
.fullorder h3,
.fullorder h4,
.fullorder h5,
.fullorder dl,
.setonosha p,
.setonosha h1,
.setonosha h2,
.setonosha h3,
.setonosha h4,
.setonosha h5,
.setonosha dl,
.diary-new p,
.diary-new h1,
.diary-new h2,
.diary-new h3,
.diary-new h4,
.diary-new h5,
.diary-new dl,
.renovation p,
.renovation h1,
.renovation h2,
.renovation h3,
.renovation h4,
.renovation h5,
.renovation dl,
.new-house p,
.new-house h1,
.new-house h2,
.new-house h3,
.new-house h4,
.new-house h5,
.new-house dl,
.about p,
.about h1,
.about h2,
.about h3,
.about h4,
.about h5,
.about dl {
  margin: 0;
}

/* ページ共通設定
--------------------------------------------- */
main:not(.index) {
  padding-top: var(--height__gnav-sp);
}
@media screen and (min-width: 1280px) {
  main:not(.index) {
    padding-top: var(--height__gnav-pc);
  }
}

img {
  width: 100%;
  height: auto;
}

/* ブログ設定
--------------------------------------------- */
.wp-embed-aspect-16-9 iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
}

/* 投稿なしのとき
--------------------------------------------- */
.not-found {
  margin-top: 3em;
  text-align: center;
}

/* 各アイキャッチの縦横比指定
--------------------------------------------- */
.eyecatch img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
  aspect-ratio: 1.5;
}

/* モーダル初期設定
--------------------------------------------- */
:where(dialog) {
  width: unset;
  max-width: unset;
  height: unset;
  max-height: unset;
  padding: unset;
  color: unset;
  background-color: unset;
  border: unset;
  overflow: unset;
}

/* スクリーンリーダー対応
--------------------------------------------- */
/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
  background-color: #eee;
  clip: auto !important;
  clip-path: none;
  color: #444;
  display: block;
  font-size: 1em;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

/* reCAPTCHAバッジを非表示にする
--------------------------------------------- */
.grecaptcha-badge {
  visibility: hidden;
}

/*--------------------------------------------------------------
# header：ヘッダー
--------------------------------------------------------------*/
/* 
  lg未満→ハンバーガー
  lg以上→リスト表示
--------------------------------------------- */
.common_header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  height: var(--height__gnav-sp);
  padding: 1em 1em;
  --clamp-min: 16;
  --clamp-max: 16;
  -webkit-transition: background-color 0.5s;
  transition: background-color 0.5s;
}
@media screen and (min-width: 1280px) {
  .common_header {
    height: var(--height__gnav-pc);
    padding: 1em 3em;
  }
}
.common_header h1 {
  margin: 0;
}
.common_header h1 a {
  display: block;
}
.common_header h1 .logo {
  width: 160px;
}
@media screen and (min-width: 1280px) {
  .common_header h1 .logo {
    width: 200px;
  }
}
.common_header .gnav_btn {
  position: relative;
  display: -ms-grid;
  display: grid;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 40px;
  height: 40px;
  text-align: end;
}
@media (any-hover: hover) {
  .common_header .gnav_btn:hover .icon_open::before {
    translate: -8px 0;
  }
  .common_header .gnav_btn:hover .icon_open::after {
    translate: 8px 0;
  }
  .common_header .gnav_btn:hover .icon_close::before, .common_header .gnav_btn:hover .icon_close::after {
    rotate: 0deg;
  }
}
@media screen and (min-width: 1280px) {
  .common_header .gnav_btn {
    display: none;
  }
}
.common_header dialog {
  --duration: 0.5s;
  top: 0;
  bottom: 0;
  left: auto;
  right: 0;
  display: -ms-grid;
  display: grid;
      grid-template-areas: "info" "menu";
  -ms-grid-rows: auto 1fr;
  grid-template-rows: auto 1fr;
  width: min(100svi, 440px);
  padding: 0 1em 1em;
  margin: 0;
  background-color: var(--color__background-body);
  -webkit-transition: translate var(--duration);
  transition: translate var(--duration);
  translate: 100%;
}
.common_header dialog[data-active=true] {
  translate: 0;
}
.common_header dialog::-ms-backdrop {
  backdrop-filter: blur(4px);
  -ms-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.common_header dialog::backdrop {
  backdrop-filter: blur(4px);
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.common_header dialog:not([data-active=true])::-ms-backdrop {
  opacity: 0;
}
.common_header dialog:not([data-active=true])::backdrop {
  opacity: 0;
}
.common_header .gnav_info {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: info;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: var(--height__gnav-sp);
}
.common_header .gnav_info .gnav_logo {
  display: block;
  width: 160px;
}
.common_header .gnav_list-sp {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  grid-area: menu;
  padding: 1em 1em 0;
  -webkit-padding-after: var(--spacing-xl);
          padding-block-end: var(--spacing-xl);
  overflow: auto;
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
}
.common_header .gnav_list-sp .gnav_item:not(:last-child) {
  border-bottom: 1px solid #b3b3b3;
}
.common_header .gnav_list-sp .gnav_icon {
  padding: 1em 0;
}
.common_header .gnav_list-sp .gnav_icon a {
  display: inline-flex;
  justify-content: flex-start;
}
.common_header .gnav_list-sp .gnav_icon img {
  width: 40px;
  height: auto;
}
.common_header .gnav_list-sp .gnav_item a {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.5em 0;
}
.common_header .gnav_list-sp .gnav_item a::after {
  content: "";
  display: block;
  width: 8px;
  height: 16px;
  margin-right: 10px;
  -o-object-fit: contain;
     object-fit: contain;
  background-image: url(img/header_arrow.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
.common_header .gnav_list-pc {
  display: none;
}
@media screen and (min-width: 1280px) {
  .common_header .gnav_list-pc {
    font-family: var(--font__mincho);
    font-weight: var(--font__weight-regular);
    display: -ms-grid;
    display: grid;
    gap: 3rem;
    -ms-grid-columns: auto 3rem auto 3rem auto 3rem auto 3rem auto 3rem auto 3rem auto 3rem auto;
    grid-template-columns: repeat(8, auto);
    letter-spacing: var(--font__letter-text);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.common_header .gnav_list-pc img {
  width: 40px;
  height: auto;
}
.common_header.scroll {
  background-color: var(--color__background-body);
  -webkit-transition: background-color 0.7s;
  transition: background-color 0.7s;
}

.icon_open,
.icon_close {
  position: relative;
  display: inline-block;
  block-size: 3px;
}
.icon_open::after, .icon_open::before,
.icon_close::after,
.icon_close::before {
  content: "";
  position: absolute;
  inset: 0;
}

.icon_open {
  width: calc(100% - 8px);
  translate: 8px 0;
  background-color: var(--color__background-text);
}
.icon_open::after, .icon_open::before {
  background-color: inherit;
  -webkit-transition: translate 0.3s;
  transition: translate 0.3s;
}
.icon_open::before {
  width: calc(100% + 8px);
  translate: -8px -8px;
}
.icon_open::after {
  width: calc(100% - 8px);
  translate: 8px 8px;
}

.icon_close {
  width: 100%;
  block-size: 3px;
  background-color: transparent;
}
.icon_close::after, .icon_close::before {
  width: 100%;
  background-color: var(--color__background-text);
  -webkit-transition: rotate 0.3s;
  transition: rotate 0.3s;
}
.icon_close::before {
  rotate: 30deg;
}
.icon_close::after {
  rotate: -30deg;
}

/*--------------------------------------------------------------
# fixednav：ページ上部のナビゲーション
--------------------------------------------------------------*/
.fixed_nav {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 999;
  width: 100%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
@media screen and (min-width: 1280px) {
  .fixed_nav {
    left: auto;
    right: -3px;
    right: 0;
    top: 300px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
}
.fixed_nav .nav_list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 5px 1fr 5px 1fr 5px 1fr;
  grid-template-columns: repeat(4, 1fr);
  -webkit-column-gap: 5px;
     -moz-column-gap: 5px;
          column-gap: 5px;
  width: 100%;
  padding: 5px;
}
@media screen and (min-width: 1280px) {
  .fixed_nav .nav_list {
    display: block;
    width: 100%;
    padding: 0;
  }
}
.fixed_nav .nav_list li:nth-child(1) .btn {
  --background__color: #a19885;
}
.fixed_nav .nav_list li:nth-child(2) .btn {
  --background__color: #505f60;
}
.fixed_nav .nav_list li:nth-child(3) .btn {
  --background__color: #887b71;
}
.fixed_nav .nav_list li:nth-child(4) .btn {
  --background__color: #684a4b;
}
.fixed_nav .btn {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  height: 50px;
  background-color: var(--background__color);
  border-radius: 10px;
  color: var(--color__white);
  line-height: 1.3;
  font-size: 12px;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
@media screen and (min-width: 1280px) {
  .fixed_nav .btn {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 150px;
    height: 95px;
    padding: 0 0.5em 0 1em;
    border-radius: 12px 0 0 12px;
    -webkit-box-shadow: 3px 3px rgba(4, 0, 0, 0.3);
            box-shadow: 3px 3px rgba(4, 0, 0, 0.3);
    text-align: start;
    font-size: 16px;
  }
  .fixed_nav .btn::after {
    content: "";
    position: absolute;
    right: 1em;
    display: inline-block;
    width: 9px;
    height: 12px;
    -o-object-fit: contain;
       object-fit: contain;
    background-image: url(img/arrow_right-small-white.png);
    background-size: contain;
    background-repeat: no-repeat;
  }
}
@media (any-hover: hover) {
  .fixed_nav .btn:hover {
    --background__color-hover: color-mix(in srgb, var(--background__color) 80%, black);
    background-color: var(--background__color-hover);
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
  }
}

/*--------------------------------------------------------------
# footer：フッター
--------------------------------------------------------------*/
.common_contact {
  background-color: var(--color__background-contact);
}
.common_contact .contact_list {
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  padding: 0 2em;
}
@media screen and (min-width: 1280px) {
  .common_contact .contact_list {
    padding: 2em;
    -ms-grid-columns: (1fr)[4];
    grid-template-columns: repeat(4, 1fr);
  }
}
.common_contact .contact_item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 2em 0;
  text-align: center;
}
@media screen and (min-width: 1280px) {
  .common_contact .contact_item {
    padding: 1.5em 0;
  }
}
.common_contact .contact_item:not(:last-child) {
  border-bottom: 1px solid var(--color__border-text);
}
@media screen and (min-width: 1280px) {
  .common_contact .contact_item:not(:last-child) {
    border-bottom: none;
    border-right: 1px solid var(--color__border-text);
  }
}
.common_contact .contact_item p:first-child {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  --clamp-min: 23;
  --clamp-max: 27;
  color: var(--color__accent);
}
.common_contact .contact_item p:last-child {
  margin-top: 0.5em;
  --clamp-min: 13;
  --clamp-max: 15;
}

.footer {
  padding: 2em 0 var(--height__fixednav);
  background-color: var(--color__background-accent);
  color: var(--color__white);
  --clamp-min: 13;
  --clamp-max: 15;
}
@media screen and (min-width: 1280px) {
  .footer {
    padding: 3.75em 0;
  }
}
.footer .footer_contents {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  row-gap: 3em;
  width: calc(100% - 4rem);
  padding-bottom: 2em;
  border-bottom: 1px solid var(--color__border-white);
}
@media screen and (min-width: 768px) {
  .footer .footer_contents {
    row-gap: 0;
  }
}
@media screen and (min-width: 1280px) {
  .footer .footer_contents {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    width: 100%;
    padding: 0 2rem 2em;
  }
}
@media screen and (min-width: 768px) {
  .footer .footer_nav .footer_list {
    -webkit-column-count: 3;
       -moz-column-count: 3;
            column-count: 3;
    -webkit-column-gap: 3em;
       -moz-column-gap: 3em;
            column-gap: 3em;
    -webkit-column-fill: balance;
       -moz-column-fill: balance;
            column-fill: balance;
  }
}
.footer .footer_nav .footer_item {
  padding: 0.5em 1em;
  border-bottom: 1px solid var(--color__white);
}
.footer .footer_nav .footer_item.noborder {
  padding-bottom: 0;
  border-bottom: none;
}
@media screen and (min-width: 768px) {
  .footer .footer_nav .footer_item {
    padding: 0.5em 0;
    border-bottom: none;
  }
  .footer .footer_nav .footer_item.noborder {
    padding-bottom: 0.5em;
  }
  .footer .footer_nav .footer_item.break-after {
    -webkit-column-break-after: column;
       -moz-column-break-after: column;
            break-after: column;
  }
}
.footer .footer_nav .footer_subitem {
  margin: 0.25em 0 0 1em;
  font-weight: var(--font__weight-regular);
  --clamp-min: 13;
  --clamp-max: 13;
}
.footer .footer_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 1280px) {
  .footer .footer_info {
    display: block;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
}
.footer .footer_info .logo {
  width: 213px;
  height: auto;
  margin-bottom: 1em;
}
.footer .footer_info .number {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.footer .footer_info .sns_list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 40px 16px 40px 16px 40px 16px 40px;
  grid-template-columns: repeat(4, 40px);
  -webkit-column-gap: 16px;
     -moz-column-gap: 16px;
          column-gap: 16px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-top: 1.5em;
}
@media screen and (min-width: 1280px) {
  .footer .footer_info .sns_list {
    -ms-grid-columns: (30px)[4];
    grid-template-columns: repeat(4, 30px);
  }
}
.footer .footer_info .icon {
  width: 100%;
  height: auto;
}
.footer .copyright {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  width: calc(100% - 4rem);
  padding: 1em 0 0;
  --clamp-min: 13;
  --clamp-max: 13;
  text-align: right;
  line-height: 1.2;
}
@media screen and (min-width: 768px) {
  .footer .copyright {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    text-align: start;
  }
}
@media screen and (min-width: 1280px) {
  .footer .copyright {
    width: 100%;
    padding: 1em 2rem 0;
  }
}

/*--------------------------------------------------------------
# index：トップページ（front-page）
--------------------------------------------------------------*/
/* index限定のmixin
--------------------------------------------- */
/* index
--------------------------------------------- */
.index {
  --padding-sec-sp: 3em;
  --padding-sec-pc: 5em;
  /* fv
  --------------------------------------------- */
  /* イベント情報
  --------------------------------------------- */
  /* お客さまの声
  --------------------------------------------- */
  /* 体感型モデルハウス
  --------------------------------------------- */
  /* 施工事例
  --------------------------------------------- */
  /* 「吉田建設」CHANNEL
  --------------------------------------------- */
  /* 初めての方へ
  --------------------------------------------- */
  /* 5つのこだわり
  --------------------------------------------- */
  /* 30年日記
  --------------------------------------------- */
  /* 吉田建設ができること
  --------------------------------------------- */
  /* モデルハウス
  --------------------------------------------- */
  /* ブログ
  --------------------------------------------- */
}
.index .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: 2em;
}
.index .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 32;
}
.index .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .index .sec_title {
    margin-bottom: 3em;
  }
}
.index .swiper-button-prev,
.index .swiper-button-next {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  -webkit-box-shadow: 3px 3px 1px rgba(4, 0, 0, 0.4);
          box-shadow: 3px 3px 1px rgba(4, 0, 0, 0.4);
}
@media screen and (min-width: 768px) {
  .index .swiper-button-prev,
  .index .swiper-button-next {
    width: 55px;
    height: 55px;
  }
}
.index .swiper-button-prev::after,
.index .swiper-button-next::after {
  content: "";
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: contain;
}
.index .swiper-button-prev::after {
  background-image: url(img/about/showroom_prev.svg);
}
.index .swiper-button-next::after {
  background-image: url(img/about/showroom_next.svg);
}
.index .fv {
  background-color: #f0efed;
  border-bottom: 1px solid #b3b3b3;
}
@media screen and (min-width: 768px) {
  .index .fv {
    border-bottom: none;
  }
}
.index .fv .fv_outer {
  position: relative;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(20%, 130px) 50px 1fr;
  grid-template-columns: minmax(20%, 130px) 50px 1fr;
  -ms-grid-rows: var(--height__gnav-sp) 1fr 50px;
  grid-template-rows: var(--height__gnav-sp) 1fr 50px;
}
.index .fv .fv_outer > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.index .fv .fv_outer > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
}
.index .fv .fv_outer > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.index .fv .fv_outer > *:nth-child(4) {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
}
.index .fv .fv_outer > *:nth-child(5) {
  -ms-grid-row: 2;
  -ms-grid-column: 2;
}
.index .fv .fv_outer > *:nth-child(6) {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
}
.index .fv .fv_outer > *:nth-child(7) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.index .fv .fv_outer > *:nth-child(8) {
  -ms-grid-row: 3;
  -ms-grid-column: 2;
}
.index .fv .fv_outer > *:nth-child(9) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
@media screen and (min-width: 768px) {
  .index .fv .fv_outer {
    -ms-grid-columns: minmax(20%, 300px) 50px 1fr;
    grid-template-columns: minmax(20%, 300px) 50px 1fr;
    -ms-grid-rows: var(--height__gnav-sp) 1fr 50px;
    grid-template-rows: var(--height__gnav-sp) 1fr 50px;
  }
  .index .fv .fv_outer > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .fv .fv_outer > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .index .fv .fv_outer > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .index .fv .fv_outer > *:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .index .fv .fv_outer > *:nth-child(5) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .index .fv .fv_outer > *:nth-child(6) {
    -ms-grid-row: 2;
    -ms-grid-column: 3;
  }
  .index .fv .fv_outer > *:nth-child(7) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .index .fv .fv_outer > *:nth-child(8) {
    -ms-grid-row: 3;
    -ms-grid-column: 2;
  }
  .index .fv .fv_outer > *:nth-child(9) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
}
@media screen and (min-width: 1280px) {
  .index .fv .fv_outer {
    position: relative;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: minmax(20%, 300px) 80px 1fr;
    grid-template-columns: minmax(20%, 300px) 80px 1fr;
    -ms-grid-rows: var(--height__gnav-pc) 1fr 80px;
    grid-template-rows: var(--height__gnav-pc) 1fr 80px;
  }
  .index .fv .fv_outer > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .fv .fv_outer > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .index .fv .fv_outer > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .index .fv .fv_outer > *:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .index .fv .fv_outer > *:nth-child(5) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .index .fv .fv_outer > *:nth-child(6) {
    -ms-grid-row: 2;
    -ms-grid-column: 3;
  }
  .index .fv .fv_outer > *:nth-child(7) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .index .fv .fv_outer > *:nth-child(8) {
    -ms-grid-row: 3;
    -ms-grid-column: 2;
  }
  .index .fv .fv_outer > *:nth-child(9) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
}
.index .fv .fv_outer .lead {
  --font-size: 24px;
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1/3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-right: 50px;
  padding-top: calc(var(--height__gnav-sp) + 1em);
  padding-bottom: 2em;
  background-color: #b9b2a8;
  letter-spacing: var(--font__letter-title);
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  -webkit-font-feature-settings: "pkna";
          font-feature-settings: "pkna";
}
@media screen and (min-width: 768px) {
  .index .fv .fv_outer .lead {
    --font-size: 44px;
    padding-top: calc(var(--height__gnav-sp) + 3em);
    padding-bottom: 4em;
  }
}
@media screen and (min-width: 1280px) {
  .index .fv .fv_outer .lead {
    padding-right: 80px;
    padding-top: var(--height__gnav-pc);
  }
}
.index .fv .fv_outer .lead p:first-of-type {
  margin-left: 0.2em;
  font-size: var(--font-size);
  line-height: 1.5;
}
.index .fv .fv_outer .lead p:first-of-type span {
  display: block;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  margin-top: auto;
  font-size: var(--font-size);
}
@media screen and (min-width: 768px) {
  .index .fv .fv_outer .lead p:first-of-type span {
    height: auto;
    margin-top: calc(var(--font-size) * 2.2);
  }
}
.index .fv .fv_outer .lead p:last-of-type {
  --clamp-max: 12;
  line-height: 1.3;
}
@media screen and (min-width: 768px) {
  .index .fv .fv_outer .lead p:last-of-type {
    margin-top: calc(var(--font-size) * 2.2);
    line-height: 2;
    --clamp-max: 16;
  }
}
.index .fv .fv_outer .swiper-fv {
  --swiper-pagination-bottom: -6%;
  --swiper-pagination-bullet-inactive-color: #999999;
  --swiper-pagination-bullet-inactive-opacity: 1;
  --swiper-pagination-color: #000000;
  -ms-grid-column: 2;
  -ms-grid-column-span: 2;
  grid-column: 2/4;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/4;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .index .fv .fv_outer .swiper-fv .swiper-pagination {
    display: none;
  }
}
.index .fv .fv_outer .swiper-fv .swiper-wrapper,
.index .fv .fv_outer .swiper-fv .swiper-slide {
  height: 100% !important;
}
@media screen and (min-width: 1280px) {
  .index .fv .fv_outer .swiper-fv .swiper-wrapper,
  .index .fv .fv_outer .swiper-fv .swiper-slide {
    height: auto;
  }
}
.index .fv .fv_outer .swiper-fv img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.index .fv .fv_outer .phrase {
  display: none;
}
@media screen and (min-width: 768px) {
  .index .fv .fv_outer .phrase {
    position: absolute;
    left: 2em;
    bottom: -50px;
    z-index: 1;
    display: block;
    width: 50%;
    max-width: 650px;
  }
}
.index .fv .index_news {
  width: calc(100% - 2em);
  padding: 1em 1em;
  margin-inline: auto;
  margin-top: 3em;
  border-top: 1px solid #b3b3b3;
}
@media screen and (min-width: 768px) {
  .index .fv .index_news {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: end;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    padding-right: 5em;
    padding-block: 3em;
    margin: 0;
    border-top: none;
  }
}
.index .fv .index_news h1 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  padding-right: 2em;
  text-transform: uppercase;
  --clamp-min: 14;
  --clamp-max: 21;
}
.index .fv .index_news .content {
  display: -ms-grid;
  display: grid;
  row-gap: 0.5em;
  margin-block: 0.5em;
}
@media screen and (min-width: 768px) {
  .index .fv .index_news .content {
    display: -ms-grid;
    display: grid;
    row-gap: 1em;
    padding-block: 1em;
    padding-inline: 3em 2em;
    margin-block: 0;
    border-left: 1px solid var(--color__border-text);
  }
}
.index .fv .index_news .content a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  --clamp-min: 12;
  --clamp-max: 15;
}
.index .fv .index_news .content a .date {
  display: none;
}
@media screen and (min-width: 768px) {
  .index .fv .index_news .content a .date {
    display: block;
  }
}
.index .fv .index_news .content a h2,
.index .fv .index_news .content a span {
  font-weight: var(--font__weight-regular);
}
@media screen and (min-width: 768px) {
  .index .fv .index_news .content a h2,
  .index .fv .index_news .content a span {
    font-weight: var(--font__weight-demibold);
  }
}
.index .fv .index_news .content a h2 {
  max-width: 230px;
}
.index .fv .index_news .content a span {
  display: none;
}
@media screen and (min-width: 768px) {
  .index .fv .index_news .content a span {
    display: block;
  }
}
.index .fv .index_news .more {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 120px;
  border-bottom: 1px solid var(--color__border-text);
  --clamp-min: 12;
  --clamp-max: 14;
}
.index .fv .index_news .more:after {
  content: "";
  display: block;
  width: 6px;
  height: 12px;
  background-image: url(img/arrow_right-black.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .index .fv .index_news .more:after {
    width: 8px;
    height: 16px;
  }
}
@media screen and (min-width: 768px) {
  .index .fv .index_news .more {
    padding: 0.2em;
  }
}
.index .index_event {
  width: 100%;
  max-width: 1000px;
  margin-inline: auto;
  padding-block: var(--padding-sec-sp);
  font-weight: var(--font__weight-regular);
  --clamp-min: 10;
  --clamp-max: 16;
}
@media screen and (min-width: 768px) {
  .index .index_event {
    padding-block: var(--padding-sec-pc);
  }
}
.index .index_event .swiper-event {
  position: relative;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .index .index_event .swiper-event {
    padding-inline: 1em;
  }
  .index .index_event .swiper-event .swiper-wrapper {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 2em 0.75fr;
    grid-template-columns: 1fr 0.75fr;
    -ms-grid-rows: auto 1em auto 1em auto;
    grid-template-rows: repeat(3, auto);
    gap: 1em 2em;
  }
  .index .index_event .swiper-event .swiper-wrapper > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .index_event .swiper-event .swiper-wrapper > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .index .index_event .swiper-event .swiper-wrapper > *:nth-child(3) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .index .index_event .swiper-event .swiper-wrapper > *:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
  .index .index_event .swiper-event .swiper-wrapper > *:nth-child(5) {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
  }
  .index .index_event .swiper-event .swiper-wrapper > *:nth-child(6) {
    -ms-grid-row: 5;
    -ms-grid-column: 3;
  }
}
@media screen and (min-width: 768px) {
  .index .index_event .swiper-event .swiper-button-prev,
  .index .index_event .swiper-event .swiper-button-next {
    display: none;
  }
}
.index .index_event article .meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-block: 0.5em;
  font-weight: var(--font__weight-regular);
}
.index .index_event article .meta p {
  display: -ms-grid;
  display: grid;
  place-content: center;
  padding: 0 0.5em;
}
.index .index_event article .meta .reservation {
  margin-right: 0.5em;
  background-color: var(--color__background-text);
  color: var(--color__white);
}
.index .index_event article .meta .cat_item {
  border: 1px solid var(--color__border-text);
}
.index .index_event article .title {
  --clamp-min: 12;
  --clamp-max: 20;
}
.index .index_event article .date {
  --clamp-max: 18;
}
.index .index_event article .eyecatch img {
  height: auto;
}
@media screen and (min-width: 768px) {
  .index .index_event article:first-of-type {
    -ms-grid-column: 1;
    -ms-grid-column-span: 1;
    grid-column: 1/2;
    -ms-grid-row: 1;
    -ms-grid-row-span: 3;
    grid-row: 1/4;
  }
  .index .index_event article:not(:first-of-type) {
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
    grid-column: 2/3;
    height: auto;
  }
  .index .index_event article:not(:first-of-type) a {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1em 1fr;
    grid-template-columns: repeat(2, 1fr);
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
  }
  .index .index_event article:not(:first-of-type) .meta {
    margin-top: 0;
  }
}
.index .index_event .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  width: 65%;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .index .index_event .btn {
    height: 48px;
  }
}
.index .index_event .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .index .index_event .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .index .index_event .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.index .index_voice {
  position: relative;
  padding-top: var(--padding-sec-sp);
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .index .index_voice {
    padding-top: var(--padding-sec-pc);
  }
}
.index .index_voice > .title {
  position: relative;
  z-index: 1;
  max-width: calc(1140px + 6em);
  margin-inline: auto;
  padding-top: 5em;
  padding-bottom: 2em;
}
@media screen and (min-width: 768px) {
  .index .index_voice > .title {
    padding-top: 5em;
    padding-bottom: 3em;
  }
}
.index .index_voice > .title .bg_left,
.index .index_voice > .title .bg_right {
  position: absolute;
  z-index: 0;
}
.index .index_voice > .title .bg_left {
  left: 1.5em;
  bottom: 20%;
  width: 13%;
  max-width: 350px;
}
@media screen and (min-width: 768px) {
  .index .index_voice > .title .bg_left {
    bottom: 10%;
    width: 24%;
  }
}
.index .index_voice > .title .bg_right {
  right: 2em;
  bottom: 15%;
  width: 15%;
  max-width: 430px;
}
@media screen and (min-width: 768px) {
  .index .index_voice > .title .bg_right {
    bottom: 10%;
    right: 1%;
    width: 33%;
  }
}
.index .index_voice > .title::before, .index .index_voice > .title::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset-inline: 0;
  display: block;
  width: calc(100% - 2em);
  max-width: 1140px;
  margin: auto;
  background-color: #d2cabd;
}
@media screen and (min-width: 768px) {
  .index .index_voice > .title::before, .index .index_voice > .title::after {
    width: calc(100% - 6em);
  }
}
.index .index_voice > .title::before {
  top: 0;
  height: 35%;
  clip-path: polygon(38% 0%, 62% 0%, 100% 100%, 0% 100%);
}
@media screen and (min-width: 420px) {
  .index .index_voice > .title::before {
    height: 50%;
  }
}
@media screen and (min-width: 768px) {
  .index .index_voice > .title::before {
    height: 60%;
  }
}
.index .index_voice > .title::after {
  bottom: 0;
  height: 65%;
}
@media screen and (min-width: 420px) {
  .index .index_voice > .title::after {
    height: 50%;
  }
}
@media screen and (min-width: 768px) {
  .index .index_voice > .title::after {
    height: 40%;
  }
}
.index .index_voice .catch {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  position: relative;
  z-index: 1;
  text-align: center;
  --clamp-min: 12;
  --clamp-max: 16;
}
@media screen and (min-width: 768px) {
  .index .index_voice .catch::before {
    content: "「理想の住まい」を叶えた\a先輩オーナーさんから\aお話をおうかがいします。";
    position: absolute;
    top: -30%;
    right: 11%;
    z-index: 1;
    font-family: var(--font__gothic);
    font-weight: var(--font__weight-demibold);
    -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
    -webkit-font-feature-settings: "pkna";
            font-feature-settings: "pkna";
    font-size: 15px;
    text-align: start;
    line-height: 2.5;
    white-space: pre;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_voice .catch::before {
    right: 13%;
    font-size: 19px;
  }
}
.index .index_voice .catch img {
  max-width: 220px;
}
@media screen and (min-width: 420px) {
  .index .index_voice .catch img {
    max-width: 300px;
  }
}
@media screen and (min-width: 768px) {
  .index .index_voice .catch img {
    margin-block: 1em;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_voice .catch img {
    max-width: 400px;
  }
}
.index .index_voice .catch h1 {
  font-weight: var(--font__weight-regular);
}
.index .index_voice .content {
  position: relative;
  padding-bottom: 3em;
}
.index .index_voice .content::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: block;
  width: calc(100% - 2em);
  max-width: 1140px;
  height: 100%;
  margin-inline: auto;
  background-color: #d2cabd;
}
@media screen and (min-width: 768px) {
  .index .index_voice .content {
    padding-inline: 1em;
  }
  .index .index_voice .content::before {
    width: calc(100% - 6em);
  }
}
.index .index_voice .swiper-voice {
  width: 100%;
  max-width: 1240px;
  margin-inline: auto;
  --clamp-min: 14;
  --clamp-max: 18;
  position: relative;
  overflow: hidden;
  padding-bottom: 6px;
  padding-right: 6px;
}
@media screen and (min-width: 768px) {
  .index .index_voice .swiper-voice .swiper-button-prev,
  .index .index_voice .swiper-voice .swiper-button-next {
    display: none;
  }
  .index .index_voice .swiper-voice .swiper-wrapper {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1em 1fr 1em 1fr;
    grid-template-columns: repeat(3, 1fr);
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_voice .swiper-voice .swiper-wrapper {
    -webkit-column-gap: 3em;
       -moz-column-gap: 3em;
            column-gap: 3em;
  }
}
.index .index_voice article {
  -webkit-box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
          box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
}
@media screen and (min-width: 768px) {
  .index .index_voice article {
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .index .index_voice article a {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 30px 1fr 30px;
    grid-template-columns: 30px 1fr 30px;
    -ms-grid-rows: 1fr 30px auto;
    grid-template-rows: 1fr 30px auto;
    -webkit-box-shadow: none;
            box-shadow: none;
  }
  .index .index_voice article a > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .index_voice article a > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .index .index_voice article a > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .index .index_voice article a > *:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .index .index_voice article a > *:nth-child(5) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .index .index_voice article a > *:nth-child(6) {
    -ms-grid-row: 2;
    -ms-grid-column: 3;
  }
  .index .index_voice article a > *:nth-child(7) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .index .index_voice article a > *:nth-child(8) {
    -ms-grid-row: 3;
    -ms-grid-column: 2;
  }
  .index .index_voice article a > *:nth-child(9) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_voice article a {
    -ms-grid-columns: 30px 1fr 70px;
    grid-template-columns: 30px 1fr 70px;
    -ms-grid-rows: 1fr 30px auto;
    grid-template-rows: 1fr 30px auto;
  }
  .index .index_voice article a > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .index_voice article a > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .index .index_voice article a > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .index .index_voice article a > *:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .index .index_voice article a > *:nth-child(5) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .index .index_voice article a > *:nth-child(6) {
    -ms-grid-row: 2;
    -ms-grid-column: 3;
  }
  .index .index_voice article a > *:nth-child(7) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .index .index_voice article a > *:nth-child(8) {
    -ms-grid-row: 3;
    -ms-grid-column: 2;
  }
  .index .index_voice article a > *:nth-child(9) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
}
.index .index_voice article .eyecatch {
  -ms-grid-column: 2;
  -ms-grid-column-span: 2;
  grid-column: 2/4;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
}
@media screen and (min-width: 768px) {
  .index .index_voice article .eyecatch {
    -webkit-box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
            box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
  }
}
.index .index_voice article .info {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1/3;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/4;
  background-color: var(--color__background-body);
}
@media screen and (min-width: 768px) {
  .index .index_voice article .info {
    -webkit-box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
            box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
  }
}
.index .index_voice article h2 {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.5em 1em;
  margin-inline: auto;
  --clamp-min: 12;
  --clamp-max: 19;
  font-weight: var(--font__weight-demibold);
}
@media screen and (min-width: 768px) {
  .index .index_voice article h2 {
    padding: 1em;
  }
}
.index .index_voice article .more {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  width: 100%;
  padding-inline: 1em;
  padding-block: 0.5em;
  border-top: 2px dotted #808080;
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .index .index_voice article .more {
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
    padding-block: 0.5em 1em;
  }
}
.index .index_voice article .more::after {
  content: "";
  display: block;
  width: 6px;
  height: 12px;
  background-image: url(img/arrow_right-black.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .index .index_voice article .more::after {
    width: 8px;
    height: 16px;
  }
}
.index .index_voice .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 2em;
  --clamp-max: 16;
}
@media screen and (min-width: 768px) {
  .index .index_voice .btn {
    height: 48px;
  }
}
.index .index_voice .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .index .index_voice .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .index .index_voice .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.index .index_resumulab {
  margin-inline: auto;
  --clamp-min: 14;
  --clamp-max: 18;
  padding-block: var(--padding-sec-sp);
  padding-top: var(--padding-sec-sp);
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .index .index_resumulab {
    padding-top: var(--padding-sec-pc);
  }
}
.index .index_resumulab img {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto 40px;
  display: block;
}
.index .index_works {
  --clamp-min: 14;
  --clamp-max: 18;
  padding-top: var(--padding-sec-sp);
  padding-bottom: var(--mb__page);
  /*background-color: var(--color__background-section);*/
}
@media screen and (min-width: 768px) {
  .index .index_works {
    padding-top: var(--padding-sec-pc);
  }
}
.index .index_works .content {
  width: 100%;
  max-width: 1140px;
  margin-inline: auto;
  position: relative;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: auto 2em auto 2em auto 2em auto;
  grid-template-rows: repeat(4, auto);
  row-gap: 2em;
  width: 80%;
}
@media screen and (min-width: 768px) {
  .index .index_works .content {
    -ms-grid-columns: 1fr 2em 1fr 2em 1fr;
    grid-template-columns: repeat(3, 1fr);
    -ms-grid-rows: auto 3em auto;
    grid-template-rows: repeat(2, auto);
    gap: 3em 2em;
    width: calc(100% - 2em);
  }
  .index .index_works .content > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .index_works .content > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .index .index_works .content > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 5;
  }
  .index .index_works .content > *:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .index .index_works .content > *:nth-child(5) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
  .index .index_works .content > *:nth-child(6) {
    -ms-grid-row: 3;
    -ms-grid-column: 5;
  }
  .index .index_works .content::before {
    content: "吉田建設とお客さまが、いっしょに考え、\a欲しかった暮らしをつくってきた家たち。\aその一部をご紹介します。";
    position: absolute;
    top: 10%;
    left: 0;
    z-index: 1;
    line-height: 2.5;
    letter-spacing: var(--font__letter-title);
    white-space: pre;
    --clamp-min: 12;
    --clamp-max: 18;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_works .content {
    width: 100%;
  }
  .index .index_works .content::before {
    top: 13%;
  }
}
.index .index_works article .title {
  background-color: var(--color__background-body);
  -webkit-box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
          box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
}
@media screen and (min-width: 768px) {
  .index .index_works article .title {
    -webkit-box-shadow: none;
            box-shadow: none;
  }
}
.index .index_works article h2 {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  padding: 0.5em 1em;
  --clamp-min: 12;
  --clamp-max: 19;
  font-weight: var(--font__weight-demibold);
}
@media screen and (min-width: 768px) {
  .index .index_works article h2 {
    padding: 1em;
  }
}
.index .index_works article .more {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  width: 100%;
  padding-inline: 1em;
  padding-block: 0.5em;
  border-top: 2px dotted #808080;
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .index .index_works article .more {
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
    padding-block: 0.5em 1em;
  }
}
.index .index_works article .more::after {
  content: "";
  display: block;
  width: 6px;
  height: 12px;
  background-image: url(img/arrow_right-black.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .index .index_works article .more::after {
    width: 8px;
    height: 16px;
  }
}
@media screen and (min-width: 768px) {
  .index .index_works article:first-of-type {
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
    grid-column: 1/4;
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    grid-row: 1/2;
  }
  .index .index_works article:first-of-type a {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 40px 1.5fr;
    grid-template-columns: 1fr 40px 1.5fr;
    -ms-grid-rows: 1fr auto 40px;
    grid-template-rows: 1fr auto 40px;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
  }
  .index .index_works article:first-of-type a > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .index_works article:first-of-type a > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .index .index_works article:first-of-type a > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .index .index_works article:first-of-type a > *:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .index .index_works article:first-of-type a > *:nth-child(5) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .index .index_works article:first-of-type a > *:nth-child(6) {
    -ms-grid-row: 2;
    -ms-grid-column: 3;
  }
  .index .index_works article:first-of-type a > *:nth-child(7) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .index .index_works article:first-of-type a > *:nth-child(8) {
    -ms-grid-row: 3;
    -ms-grid-column: 2;
  }
  .index .index_works article:first-of-type a > *:nth-child(9) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
  .index .index_works article:first-of-type .eyecatch {
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    grid-row: 1/3;
    -ms-grid-column: 2;
    -ms-grid-column-span: 2;
    grid-column: 2/4;
  }
  .index .index_works article:first-of-type .title {
    -ms-grid-row: 2;
    -ms-grid-row-span: 2;
    grid-row: 2/4;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
  }
  .index .index_works article:first-of-type h2 {
    padding-inline: 3em;
    padding-block: 2em;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_works article:first-of-type a {
    -ms-grid-columns: 1fr 40px minmax(50%, 700px);
    grid-template-columns: 1fr 40px minmax(50%, 700px);
  }
}
.index .index_works .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  width: 60%;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .index .index_works .btn {
    height: 48px;
  }
}
.index .index_works .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .index .index_works .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .index .index_works .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 768px) {
  .index .index_works .btn {
    width: 80%;
  }
}
.index .index_youtube {
  --clamp-min: 14;
  --clamp-max: 18;
  padding-top: var(--padding-sec-sp);
  padding-bottom: var(--mb__page);
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .index .index_youtube {
    padding-top: var(--padding-sec-pc);
  }
}
.index .index_youtube .subcopy {
  margin: 0 auto;
  padding-bottom: 50px;
  width: 80%;
  max-width: 1140px;
  box-sizing: border-box;
}
@media screen and (min-width: 768px) {
  .index .index_youtube .subcopy {
    width: calc(100% - 2em);
  }
}
.index .index_youtube .content {
  width: 100%;
  max-width: 1140px;
  margin-inline: auto;
  position: relative;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: auto 2em auto 2em auto;
  grid-template-rows: repeat(3, auto);
  row-gap: 2em;
  width: 80%;
}
@media screen and (min-width: 768px) {
  .index .index_youtube .content {
    -ms-grid-columns: 1fr 2em 1fr 2em 1fr;
    grid-template-columns: repeat(3, 1fr);
    -ms-grid-rows: auto 3em auto;
    grid-template-rows: repeat(2, auto);
    gap: 3em 2em;
    width: calc(100% - 2em);
  }
  .index .index_youtube .content > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .index_youtube .content > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .index .index_youtube .content > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 5;
  }
  .index .index_youtube .content > *:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .index .index_youtube .content > *:nth-child(5) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
  .index .index_youtube .content > *:nth-child(6) {
    -ms-grid-row: 3;
    -ms-grid-column: 5;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_youtube .content {
    width: 100%;
  }
  .index .index_youtube .content::before {
    top: 13%;
  }
}
.index .index_youtube article .eyecatch img {
  border-radius: 20px;
}
.index .index_youtube article h2 {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.5em 1em;
  --clamp-min: 12;
  --clamp-max: 19;
  font-weight: var(--font__weight-demibold);
}
@media screen and (min-width: 768px) {
  .index .index_youtube article h2 {
    padding: 1em 0;
    font-size: 16px;
  }
}
.index .index_youtube article .more {
  font-size: 12px;
}
@media screen and (min-width: 1280px) {
  .index .index_youtube article:first-of-type a {
    -ms-grid-columns: 1fr 40px minmax(50%, 700px);
    grid-template-columns: 1fr 40px minmax(50%, 700px);
  }
}
.index .index_youtube .youtubeBtn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 396px;
  height: 34px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  border: none;
  width: 60%;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .index .index_youtube .youtubeBtn {
    height: 49px;
  }
}
.index .index_youtube .youtubeBtn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .index .index_youtube .youtubeBtn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .index .index_youtube .youtubeBtn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 768px) {
  .index .index_youtube .youtubeBtn {
    width: 80%;
  }
}
.index .index_about {
  --clamp-min: 14;
  --clamp-max: 18;
  position: relative;
  padding-bottom: var(--padding-sec-sp);
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .index .index_about {
    padding-bottom: var(--padding-sec-pc);
  }
}
.index .index_about::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: 100%;
  height: 95%;
  background-color: #d8d5cd;
}
@media screen and (min-width: 768px) {
  .index .index_about::before {
    height: 80%;
  }
}
.index .index_about .keyvisual {
  padding-top: 6em;
  position: relative;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .index .index_about .keyvisual {
    padding-top: 5em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .index .index_about .keyvisual .title {
    margin-left: auto;
    padding-left: 1em;
  }
  .index .index_about .keyvisual .sec_title {
    margin-bottom: 1em;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_about .keyvisual {
    padding-top: 6em;
  }
}
.index .index_about .keyvisual .bg {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  width: 100%;
}
.index .index_about .keyvisual .lead {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .index .index_about .keyvisual .lead {
    margin: 0 auto;
    letter-spacing: var(--font__letter-title);
    -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
    -webkit-font-feature-settings: "pkna";
            font-feature-settings: "pkna";
    font-size: 10px;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_about .keyvisual .lead {
    font-size: 14px;
  }
}
@media screen and (min-width: 1440px) {
  .index .index_about .keyvisual .lead {
    font-size: 18px;
  }
}
.index .index_about .keyvisual .concept {
  display: block;
  margin-top: 2em;
  text-align: center;
  --clamp-min: 10;
  --clamp-max: 15;
}
@media screen and (min-width: 768px) {
  .index .index_about .keyvisual .concept {
    margin-top: 0;
  }
}
.index .index_about .keyvisual .concept img {
  width: 33%;
  max-width: 160px;
}
@media screen and (min-width: 768px) {
  .index .index_about .keyvisual .concept img {
    width: 80%;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_about .keyvisual .concept img {
    width: 100%;
    max-width: 180px;
  }
}
.index .index_about .keyvisual .clip {
  position: relative;
  width: 100%;
  -webkit-margin-start: auto;
          margin-inline-start: auto;
  margin-bottom: 1.5em;
  -webkit-mask-image: url(img/mask_movie.svg);
          mask-image: url(img/mask_movie.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: right top;
          mask-position: right top;
}
@media screen and (min-width: 768px) {
  .index .index_about .keyvisual .clip {
    width: 80%;
    max-width: 900px;
    margin-bottom: 0;
    -webkit-margin-start: 0;
            margin-inline-start: 0;
  }
  .index .index_about .keyvisual .clip::before {
    font-family: var(--font__mincho);
    font-weight: var(--font__weight-regular);
    content: "世界に一つしかない\a「わが家」をつくり上げる。";
    position: absolute;
    right: 5%;
    top: 10%;
    z-index: 1;
    text-shadow: 3px 3px 3px rgba(0, 0, 0, 0.67);
    -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
    -webkit-font-feature-settings: "pkna";
            font-feature-settings: "pkna";
    white-space: pre;
    letter-spacing: var(--font__letter-title);
    font-size: 18px;
    color: var(--color__white);
  }
}
@media screen and (min-width: 1280px) {
  .index .index_about .keyvisual .clip {
    width: 70%;
    max-width: none;
  }
  .index .index_about .keyvisual .clip::before {
    right: 6%;
    font-size: 25px;
  }
}
@media screen and (min-width: 1440px) {
  .index .index_about .keyvisual .clip {
    width: 70%;
  }
  .index .index_about .keyvisual .clip::before {
    font-size: 32px;
  }
}
.index .index_about .keyvisual .clip video {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.index .index_about .keyvisual .clip svg {
  position: absolute;
  right: 0;
  top: 0;
}
.index .index_about .keyvisual .clip path {
  -webkit-transform: scale(0.0011410575, 0.001723811);
          transform: scale(0.0011410575, 0.001723811);
}
.index .index_about .about_list {
  width: 100%;
  max-width: 1140px;
  margin-inline: auto;
  position: relative;
  z-index: 1;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: auto 2em auto 2em auto 2em auto;
  grid-template-rows: repeat(4, auto);
  row-gap: 2em;
  width: 80%;
}
@media screen and (min-width: 768px) {
  .index .index_about .about_list {
    -ms-grid-columns: 1fr 3em 1fr;
    grid-template-columns: repeat(2, 1fr);
    -ms-grid-rows: auto 5em auto;
    grid-template-rows: repeat(2, auto);
    gap: 5em 3em;
    width: calc(100% - 2em);
    margin-top: 2em;
  }
  .index .index_about .about_list > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .index_about .about_list > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .index .index_about .about_list > *:nth-child(3) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .index .index_about .about_list > *:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_about .about_list {
    width: 100%;
  }
}
.index .index_about .about_list li {
  -webkit-box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
          box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
}
.index .index_about .about_list li a {
  display: block;
  background-color: var(--color__background-body);
}
.index .index_about .about_list li h2 {
  padding-block: 1em;
  font-weight: var(--font__weight-demibold);
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .index .index_about .about_list li h2 {
    padding-inline: 1.5em;
    text-align: left;
  }
}
.index .index_about .about_list li .more {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  width: 100%;
  padding-inline: 1em;
  padding-block: 0.5em;
  border-top: 2px dotted #808080;
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .index .index_about .about_list li .more {
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
    padding-block: 0.5em 1em;
  }
}
.index .index_about .about_list li .more::after {
  content: "";
  display: block;
  width: 6px;
  height: 12px;
  background-image: url(img/arrow_right-black.svg);
  background-size: contain;
  background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .index .index_about .about_list li .more::after {
    width: 8px;
    height: 16px;
  }
}
.index .index_commitment {
  width: 100%;
  max-width: 1000px;
  margin-inline: auto;
  --clamp-min: 14;
  --clamp-max: 18;
  padding-block: var(--padding-sec-sp);
}
@media screen and (min-width: 768px) {
  .index .index_commitment {
    padding-block: var(--padding-sec-pc);
  }
}
.index .index_commitment .content {
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  row-gap: 1em;
  padding-inline: 1em;
}
@media screen and (min-width: 768px) {
  .index .index_commitment .content {
    -ms-grid-columns: 1fr 3em 1fr;
    grid-template-columns: repeat(2, 1fr);
    -ms-grid-columns: auto 3em auto;
    grid-template-columns: auto auto;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 0 3em;
  }
}
.index .index_commitment .content img {
  max-width: 280px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .index .index_commitment .content img {
    max-width: 530px;
  }
}
.index .index_commitment .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  width: 65%;
  margin-top: 1em;
}
@media screen and (min-width: 768px) {
  .index .index_commitment .btn {
    height: 48px;
  }
}
.index .index_commitment .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .index .index_commitment .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .index .index_commitment .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 768px) {
  .index .index_commitment .btn {
    width: auto;
  }
}
.index .index_30diary {
  --clamp-min: 14;
  --clamp-max: 18;
  padding-block: var(--padding-sec-sp);
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .index .index_30diary {
    padding-block: var(--padding-sec-pc);
  }
}
.index .index_30diary .lead {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .index .index_30diary .lead br.sp {
    display: none;
  }
}
.index .index_30diary .content {
  width: 100%;
  max-width: 870px;
  margin-inline: auto;
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -ms-grid;
  display: grid;
  row-gap: 1em;
  padding-inline: 1em;
  margin-inline: auto;
  margin-top: 1em;
  letter-spacing: var(--font__letter-title);
  text-align: center;
  --clamp-min: 15;
  --clamp-max: 25;
}
@media screen and (min-width: 768px) {
  .index .index_30diary .content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 0;
  }
}
.index .index_30diary .content a,
.index .index_30diary .content div {
  display: block;
  width: 80%;
  max-width: 360px;
  margin-inline: auto;
}
.index .index_service {
  --clamp-min: 14;
  --clamp-max: 18;
  padding-block: var(--padding-sec-sp);
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .index .index_service {
    padding-block: var(--padding-sec-pc);
  }
}
.index .index_service .card_list {
  width: 100%;
  max-width: 1140px;
  margin-inline: auto;
}
.index .index_service .card_list .card_item > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
  aspect-ratio: 1.5;
  display: block;
  width: 90%;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item > img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
}
.index .index_service .card_list .card_item .text {
  position: relative;
  display: -ms-grid;
  display: grid;
  row-gap: 1em;
  width: 90%;
  padding: 1.5em 1em;
  margin-inline: auto;
  color: var(--color__white);
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item .text {
    width: 100%;
  }
}
.index .index_service .card_list .card_item .text p {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  font-weight: var(--font__weight-regular);
  line-height: 1.3;
  --clamp-min: 16;
  --clamp-max: 16;
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item .text p {
    line-height: 1.5;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_service .card_list .card_item .text p {
    line-height: 2;
  }
}
.index .index_service .card_list .card_item .text::before {
  content: "";
  display: block;
  position: absolute;
  top: 1.5em;
  left: 1.5em;
  z-index: 1;
  height: 34px;
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item .text::before {
    top: 2em;
    left: 2em;
    height: 52px;
  }
}
.index .index_service .card_list .card_item .card_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
}
.index .index_service .card_list .card_item .card_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 20;
  --clamp-max: 27;
}
.index .index_service .card_list .card_item .card_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.index .index_service .card_list .card_item .card_title .ja {
  border-color: var(--color__border-white);
  line-height: 1.2;
  --clamp-min: 20;
  --clamp-max: 27;
}
.index .index_service .card_list .card_item .card_title .en {
  padding-top: 0.5em;
  margin-top: 0.5em;
  --clamp-min: 12;
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item .card_title .en {
    padding: 1em 1em 0;
    margin-top: 1em;
  }
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item:nth-of-type(1), .index .index_service .card_list .card_item:nth-of-type(2) {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 2fr 3fr;
    grid-template-columns: 2fr 3fr;
  }
  .index .index_service .card_list .card_item:nth-of-type(1) img, .index .index_service .card_list .card_item:nth-of-type(2) img {
    -ms-grid-row: 1;
        grid-row-start: 1;
    -ms-grid-column: 2;
        grid-column-start: 2;
  }
  .index .index_service .card_list .card_item:nth-of-type(1) .text, .index .index_service .card_list .card_item:nth-of-type(2) .text {
    -ms-grid-row: 1;
        grid-row-start: 1;
    -ms-grid-column: 1;
        grid-column-start: 1;
    height: 470px;
    place-content: center;
    row-gap: 2em;
  }
}
.index .index_service .card_list .card_item:nth-of-type(1) .text {
  background-color: #a19885;
}
.index .index_service .card_list .card_item:nth-of-type(1) .text::before {
  width: 12px;
  background-image: url(img/index/service_01-number.svg);
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item:nth-of-type(1) .text::before {
    width: 19px;
  }
}
.index .index_service .card_list .card_item:nth-of-type(2) {
  margin-top: 2em;
}
.index .index_service .card_list .card_item:nth-of-type(2) .text {
  background-color: #505f60;
}
.index .index_service .card_list .card_item:nth-of-type(2) .text::before {
  width: 20px;
  background-image: url(img/index/service_02-number.svg);
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item:nth-of-type(2) .text::before {
    width: 34px;
  }
}
.index .index_service .card_list .card_item:nth-of-type(3) {
  margin-top: 2em;
}
.index .index_service .card_list .card_item:nth-of-type(3) .text {
  background-color: #887b71;
  margin-bottom: 2em;
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item:nth-of-type(3) .text {
    margin-bottom: 0em;
  }
  .index .index_service .card_list .card_item:nth-of-type(3) .text::after {
    content: "";
    display: block;
    position: absolute;
    bottom: -3.5em;
    left: 0;
    width: 100%;
    height: 3.5em;
    background-color: #887b71;
  }
  .index .index_service .card_list .card_item:nth-of-type(3) .text br {
    display: none;
  }
}
.index .index_service .card_list .card_item:nth-of-type(3) .text::before {
  width: 20px;
  background-image: url(img/index/service_03-number.svg);
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item:nth-of-type(3) .text::before {
    width: 36px;
  }
}
.index .index_service .card_list .card_item:nth-of-type(3) .swiper-service {
  position: relative;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .index .index_service .card_list .card_item:nth-of-type(3) .swiper-service {
    width: calc(100% - 4em);
    margin-inline: auto;
  }
  .index .index_service .card_list .card_item:nth-of-type(3) .swiper-service .swiper-wrapper {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 3em 1fr 3em 1fr;
    grid-template-columns: repeat(3, 1fr);
    -webkit-column-gap: 3em;
       -moz-column-gap: 3em;
            column-gap: 3em;
  }
  .index .index_service .card_list .card_item:nth-of-type(3) .swiper-service .swiper-button-prev,
  .index .index_service .card_list .card_item:nth-of-type(3) .swiper-service .swiper-button-next {
    display: none;
  }
}
.index .index_service .card_list .card_item:nth-of-type(3) a {
  font-weight: var(--font__weight-regular);
}
.index .index_service .card_list .card_item:nth-of-type(3) a .meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-block: 1em 0.5em;
  --clamp-min: 10;
  --clamp-max: 15;
}
.index .index_service .card_list .card_item:nth-of-type(3) a .meta .cat_item {
  display: -ms-grid;
  display: grid;
  place-content: center;
  padding: 0 0.5em;
  background-color: var(--color__background-body);
  border: 1px solid var(--color__border-text);
  --clamp-max: 14;
}
.index .index_service .card_list .card_item:nth-of-type(3) a h3 {
  --clamp-min: 12;
  --clamp-max: 19;
}
.index .index_service .card_list .card_item:nth-of-type(3) a .info_list {
  margin-top: 1em;
  border-bottom: 1px dashed #808080;
  text-align: center;
  --clamp-min: 11;
  --clamp-max: 18;
}
.index .index_service .card_list .card_item:nth-of-type(3) a .info_list li {
  border-top: 1px dashed #808080;
}
.index .index_service .card_list .card_item:nth-of-type(3) a .info_list li .price {
  color: #005b6a;
  font-weight: var(--font__weight-bold);
}
.index .index_service .card_list .card_item:nth-of-type(3) .btn {
  border: 2px solid var(--color__border-accent);
  margin-top: 2em;
}
.index .index_service .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  width: 60%;
  border: none;
}
@media screen and (min-width: 768px) {
  .index .index_service .btn {
    height: 48px;
  }
}
.index .index_service .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .index .index_service .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .index .index_service .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 768px) {
  .index .index_service .btn {
    width: 100%;
  }
}
.index .index_modelhouse {
  --clamp-min: 14;
  --clamp-max: 18;
  padding-block: var(--padding-sec-sp);
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .index .index_modelhouse {
    padding-block: var(--padding-sec-pc);
  }
}
.index .index_modelhouse .content {
  width: 100%;
  max-width: 1140px;
  margin-inline: auto;
  padding-left: 1em;
  padding-right: 1em;
}
@media screen and (min-width: 1280px) {
  .index .index_modelhouse .content {
    padding-left: 0em;
    padding-right: 0em;
  }
}
@media screen and (min-width: 768px) {
  .index .index_modelhouse .content .card {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
  }
  .index .index_modelhouse .content .card > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .index .index_modelhouse .content .card > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .index .index_modelhouse .content .card > img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
    overflow: hidden;
    -ms-grid-column: 2;
        grid-column-start: 2;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_modelhouse .content .card {
    -ms-grid-columns: 1fr 600px;
    grid-template-columns: 1fr 600px;
  }
}
.index .index_modelhouse .content .card div {
  -ms-grid-column: 1;
      grid-column-start: 1;
  -ms-grid-row: 1;
      grid-row-start: 1;
  display: -ms-grid;
  display: grid;
  place-items: center;
  -ms-flex-line-pack: center;
      align-content: center;
  row-gap: 1em;
  background-color: #a19885;
  padding: 1em;
  color: var(--color__white);
}
@media screen and (min-width: 768px) {
  .index .index_modelhouse .content .card div {
    row-gap: 2em;
    padding: 3em;
  }
}
@media screen and (min-width: 1280px) {
  .index .index_modelhouse .content .card div br {
    display: none;
  }
}
.index .index_modelhouse .content .card .logo {
  width: 60%;
  max-width: 280px;
}
.index .index_modelhouse .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  width: 60%;
  border: none;
}
@media screen and (min-width: 768px) {
  .index .index_modelhouse .btn {
    height: 48px;
  }
}
.index .index_modelhouse .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .index .index_modelhouse .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .index .index_modelhouse .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 768px) {
  .index .index_modelhouse .btn {
    width: 80%;
  }
}
.index .index_blog {
  --clamp-min: 14;
  --clamp-max: 18;
  padding-top: var(--padding-sec-sp);
  padding-bottom: var(--mb__page);
}
@media screen and (min-width: 768px) {
  .index .index_blog {
    padding-top: var(--padding-sec-pc);
  }
}
.index .index_blog .swiper-blog {
  position: relative;
  overflow: hidden;
  padding-bottom: 4px;
}
.index .index_blog .swiper-wrapper {
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
.index .index_blog article {
  height: auto;
  background-color: var(--color__background-body);
  -webkit-box-shadow: 4px 4px 1px rgba(4, 0, 0, 0.2);
          box-shadow: 4px 4px 1px rgba(4, 0, 0, 0.2);
}
.index .index_blog article a {
  display: block;
  height: 100%;
  padding: 1em;
  --clamp-min: 10;
  --clamp-max: 15;
  font-weight: var(--font__weight-regular);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.index .index_blog article .meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-block: 0.5em;
}
.index .index_blog article .meta p {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.index .index_blog article .meta p.cat_item {
  padding: 0 0.2em;
  background-color: var(--color__cat);
}
.index .index_blog article .meta p.cat_item.president-blog {
  --color__cat: #aec6d9;
}
.index .index_blog article .meta p.cat_item.mie-diary {
  --color__cat: #e4c59d;
}
.index .index_blog article .meta p.cat_item.staff-blog {
  --color__cat: #8fba94;
}
.index .index_blog article .meta p.cat_item.reform-after-blog {
  --color__cat: #c9caca;
}
.index .index_blog article h2 {
  --clamp-min: 12;
  --clamp-max: 15;
  font-weight: var(--font__weight-regular);
}
.index .index_blog .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  width: 60%;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .index .index_blog .btn {
    height: 48px;
  }
}
.index .index_blog .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .index .index_blog .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .index .index_blog .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 768px) {
  .index .index_blog .btn {
    width: 80%;
  }
}

/*--------------------------------------------------------------
# page：固定ページテンプレート
--------------------------------------------------------------*/
.page {
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: var(--width__page);
  margin-inline: auto;
  margin-bottom: var(--mb__page);
}
@media screen and (min-width: 1280px) {
  .page {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.page .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
}
.page .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.page .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.page article h2 {
  --clamp-min: 20;
  --clamp-max: 25;
}
.page article h3 {
  --clamp-min: 18;
  --clamp-max: 21;
}
.page article p {
  text-align: justify;
}
.page article ul,
.page article ol {
  padding-left: 2em;
}
.page article ul li,
.page article ol li {
  text-indent: -1em;
}
.page .not-found h1 {
  --clamp-min: 18;
  --clamp-max: 24;
}
.page .not-found a {
  color: var(--color__accent);
}

/*--------------------------------------------------------------
# news：お知らせ
--------------------------------------------------------------*/
.news {
  /* 一覧・詳細 共通
  --------------------------------------------- */
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: var(--width__page);
  margin-inline: auto;
  margin-bottom: var(--mb__page);
  /* コンテンツ（all：一覧）
  --------------------------------------------- */
  /* コンテンツ（single：詳細）
  --------------------------------------------- */
}
@media screen and (min-width: 1280px) {
  .news {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.news .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
}
.news .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.news .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.news .all article {
  --clamp-min: 14;
  --clamp-max: 18;
  padding-block: 1em;
  padding-inline: 1.5em 0.5em;
  border-bottom: 2px dotted var(--color__text);
}
.news .all article a {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1em 7px;
  grid-template-columns: 1fr 7px;
  -ms-grid-rows: auto 0 auto;
  grid-template-rows: repeat(2, auto);
  grid-auto-flow: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 1em;
  width: 100%;
}
.news .all article a > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.news .all article a > *:nth-child(2) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.news .all article a > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.news .all article a > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
@media screen and (min-width: 420px) {
  .news .all article a {
    -ms-grid-columns: auto 1fr 7px;
    grid-template-columns: auto 1fr 7px;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    -webkit-box-pack: left;
        -ms-flex-pack: left;
            justify-content: left;
  }
  .news .all article a > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .news .all article a > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .news .all article a > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
}
.news .all article a::after {
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
  content: "";
  display: block;
  width: 7px;
  height: 14px;
  background-image: url(img/news/article_arrow.png);
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (min-width: 420px) {
  .news .all article a::after {
    grid-row: auto;
  }
}
.news .all article .date {
  margin: 0;
  font-weight: var(--font__weight-demibold);
}
.news .all article .title {
  margin: 0;
  font-weight: var(--font__weight-demibold);
}
@media screen and (min-width: 420px) {
  .news .all article .title {
    text-align: justify;
  }
}
.news .all .pagination {
  margin-top: 5em;
}
.news .all .pagination .nav-links {
  --clamp-min: 14;
  --clamp-max: 18;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  font-weight: var(--font__weight-regular);
}
.news .all .pagination .prev,
.news .all .pagination .next {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 12px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: contain;
}
.news .all .pagination .prev {
  background-image: url(img/pagination_all-prev.png);
}
.news .all .pagination .next {
  background-image: url(img/pagination_all-next.png);
}
.news .all .pagination .page-numbers {
  color: #848484;
}
.news .all .pagination .current {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 30px;
  height: 30px;
  background-color: var(--color__background-pagination);
  border-radius: 50%;
  color: var(--color__accent);
}
.news .all .pagination .dot {
  color: #848484;
}
.news .single .entry_title {
  --clamp-min: 14;
  --clamp-max: 18;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 1em;
  margin-bottom: 2em;
  border-bottom: 2px dotted var(--color__text);
}
.news .single .entry_title .entry_date {
  font-weight: var(--font__weight-demibold);
  margin: 0 1em 0 0;
}
.news .single .entry_title h1 {
  margin: 0;
  font-size: inherit;
  font-weight: var(--font__weight-demibold);
}
.news .single .entry_content {
  word-wrap: break-word;
}
.news .single .entry_content p {
  padding-inline: 1em;
}
.news .single .entry_content h2 {
  --clamp-min: 20;
  --clamp-max: 24;
  font-weight: var(--font__weight-bold);
  margin-block: 1.5em 0.5em;
  padding-inline: 1em;
}
.news .single .entry_content h3 {
  --clamp-min: 18;
  --clamp-max: 20;
  font-weight: var(--font__weight-bold);
  margin-block: 1.2em 0.5em;
  padding-inline: 1em;
}
.news .single .entry_content h4 {
  --clamp-min: 16;
  --clamp-max: 18;
  font-weight: var(--font__weight-bold);
  margin-block: 1em 0.5em;
  padding-inline: 1em;
}
.news .single .entry_content ul {
  list-style: disc;
  padding-left: 2.5em;
  margin: 1em 0;
}
.news .single .entry_content ol {
  list-style: decimal;
  padding-left: 2.5em;
  margin: 1em 0;
}
.news .single .pagination {
  --clamp-min: 14;
  --clamp-max: 16;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  row-gap: 1em;
  margin-top: 3em;
  font-weight: var(--font__weight-regular);
  margin-top: 5em;
}
.news .single .pagination .prev a,
.news .single .pagination .next a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
}
@media screen and (min-width: 420px) {
  .news .single .pagination .prev a,
  .news .single .pagination .next a {
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
  }
}
.news .single .pagination .prev a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-right: auto;
}
.news .single .pagination .prev a::before {
  content: "";
  display: block;
  width: 12px;
  height: 24px;
  background-image: url(img/pagination_single-prev.png);
  background-repeat: no-repeat;
  background-size: contain;
}
.news .single .pagination .next a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
}
.news .single .pagination .next a::after {
  content: "";
  display: block;
  width: 12px;
  height: 24px;
  background-image: url(img/pagination_single-next.png);
  background-repeat: no-repeat;
  background-size: contain;
}
.news .single .pagination .back {
  text-align: center;
}
.news .single .pagination .back a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 0.5em 0.5em;
  margin-inline: auto;
  border-bottom: 1px solid var(--color__text);
}

/*--------------------------------------------------------------
/* index_faq
--------------------------------------------- */
.index .index_faq {
  padding: 80px 5%;
}
.index .index_faq_banner {
  display: flex;
  align-items: stretch;
  background-color: #f1eee9;
  text-decoration: none;
  color: var(--color__text);
  max-width: 1200px;
  margin: 2em auto 0;
  overflow: hidden;
  transition: opacity 0.2s;
}
.index .index_faq_banner:hover {
  opacity: 0.8;
}
.index .index_faq_banner_img {
  flex: 0 0 40%;
  padding: 60px;
}
.index .index_faq_banner_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.index .index_faq_banner_text {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 40px 48px;
}
.index .index_faq_banner_body {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.index .index_faq_banner .title {
  font-size: 2em;
  font-family: var(--font__mincho);
  letter-spacing: 0.05em;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.index .index_faq_banner .sub {
  font-size: 0.95em;
  font-family: var(--font__mincho);
  margin-top: 0 !important;
  margin-bottom: 2em !important;
}
.index .index_faq_banner .more {
  font-size: 1.5em;
  text-align: right;
  border-top: 2px dotted var(--color__border-text);
  padding-top: 1em;
  letter-spacing: 0.1em;
}

/* faq：よくあるご質問
--------------------------------------------- */
.faq .faq_fv {
  position: relative;
}
.faq .faq_fv img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  object-position: center 55%;
  display: block;
}
.faq .faq_fv::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 1;
}
.faq .faq_fv .fv_text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  z-index: 2;
  width: 100%;
  padding: 0 5%;
}
.faq .faq_fv .fv_text .sec_title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.3em;
}
.faq .faq_fv .fv_text .sec_title .ja {
  color: #fff;
  font-family: var(--font__mincho);
  font-size: 2.4em;
  padding-bottom: 0.3em;
  border-bottom: 2px solid #fff;
}
.faq .faq_fv .fv_text .sec_title .en {
  color: #fff;
  font-family: var(--font__mincho);
  font-size: 1.1em;
}
.faq .faq_fv .fv_text p {
  margin-top: 1.4em;
  font-size: 1.1em;
  font-family: var(--font__mincho);
  letter-spacing: 0.05em;
}
.faq .faq_outer {
  max-width: 1100px;
  margin: 0 auto;
  padding: 60px 5% 80px;
  background-color: #f1f0ee;
}
.faq main,
.faq {
  background-color: #f1f0ee;
}
.faq .faq_nav {
  margin-bottom: 60px;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}
.faq .faq_nav_row {
  display: flex;
  gap: 3em;
}
.faq .faq_nav_row:last-child .faq_nav_btn {
  border-bottom: 1px solid var(--color__border-accent);
}
.faq .faq_nav_btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.2em 1em;
  background-color: transparent;
  text-decoration: none;
  color: var(--color__text);
  font-family: var(--font__mincho);
  font-size: 1.4em;
  font-weight: bold;
  letter-spacing: var(--font__letter-title);
  line-height: 1.2;
  border-top: 1px solid var(--color__border-accent);
  transition: opacity 0.2s;
}
.faq .faq_nav_btn:hover {
  opacity: 0.7;
}
.faq .faq_nav_btn .chevron {
  font-size: 0.85em;
  color: var(--color__text);
  flex-shrink: 0;
}
.faq .faq_section {
  margin-bottom: 60px;
}
.faq .faq_section_title {
  font-family: var(--font__mincho);
  font-size: 1.6em;
  text-align: center;
  margin-bottom: 0;
  letter-spacing: 0.1em;
}
.faq .faq_section_title::after {
  content: '';
  display: block;
  width: 10em;
  margin: 0.5em auto 0;
  height: 1px;
  background-color: #604b4c;
}
.faq .faq_list {
  display: flex;
  flex-direction: column;
}
.faq .faq_item {
  margin-bottom: 8px;
}
.faq .faq_q {
  display: flex;
  align-items: center;
  gap: 1em;
  padding: 1.1em 1.2em;
  cursor: pointer;
  background-color: #dbd7cb;
  border-radius: 6px;
  transition: background-color 0.2s;
}
.faq .faq_item.is-open .faq_q {
  border-radius: 6px 6px 0 0;
}
.faq .faq_q:hover {
  background-color: #cdc9bc;
}
.faq .faq_q .label {
  font-size: 1.5em;
  color: #5d3238;
  flex-shrink: 0;
  font-weight: bold;
  font-family: var(--font__mincho);
}
.faq .faq_q > span:nth-child(2) {
  flex: 1;
  line-height: 1.6;
  font-size: 1.2em;
  font-family: var(--font__mincho);
}
.faq .faq_q .icon {
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  position: relative;
}
.faq .faq_q .icon::before,
.faq .faq_q .icon::after {
  content: '';
  position: absolute;
  background-color: var(--color__text);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.faq .faq_q .icon::before {
  width: 10px;
  height: 1px;
}
.faq .faq_q .icon::after {
  width: 1px;
  height: 10px;
  transition: transform 0.3s;
}
.faq .faq_item.is-open .faq_q .icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
}
.faq .faq_a {
  display: none;
  flex-direction: row;
  align-items: baseline;
  gap: 1em;
  padding: 1.2em 1.2em 1.4em;
  background-color: #f1f0ee;
  border: 1px solid #dbd7cb;
  border-radius: 0 0 6px 6px;
  margin-bottom: 1.5em;
  line-height: 1.9;
}
.faq .faq_item.is-open .faq_a {
  display: flex;
}
.faq .faq_a .label {
  font-size: 1.5em;
  color: #9c1a1c;
  flex-shrink: 0;
  font-weight: bold;
  font-family: var(--font__mincho);
  line-height: 1;
  margin-top: 0;
  align-self: flex-start;
}
.faq .faq_a div {
  flex: 1;
}
.faq .faq_a p {
  margin-top: 0;
  margin-bottom: 0.8em;
  line-height: 1.9;
}
.faq .faq_a a {
  color: #5d3238;
  font-weight: bold;
  text-decoration: underline;
}
.faq .faq_a p:last-child {
  margin-bottom: 0;
}
@media screen and (max-width: 767px) {
  .index .index_faq {
    padding: 60px 6%;
  }
  .index .index_faq_banner .title {
    display: none;
  }
  .index .index_faq_banner {
    flex-direction: column;
    margin: 2em auto 0;
  }
  .index .index_faq_banner_img {
    padding: 20px 20px 0;
  }
  .index .index_faq_banner_img img {
    height: auto;
    object-fit: unset;
  }
  .index .index_faq_banner_text {
    padding: 20px 24px 24px;
  }
  .faq .faq_fv img {
    height: 240px;
    object-position: center 50%;
  }
  .faq .faq_nav {
    grid-template-columns: 1fr;
  }
}

# blog：ブログ
--------------------------------------------------------------*/
/* 一覧・詳細 共通
--------------------------------------------- */
.blog {
  padding-top: var(--pt__page-color);
  background-color: var(--color__background-section);
}
.blog.p {
  padding-bottom: var(--pb__page-color);
}
.blog.m {
  margin-bottom: var(--pb__page-color);
}
.blog .blog_outer {
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
      grid-template-areas: "title" "contents" "pagination" "sidebar";
  -webkit-column-gap: 3em;
     -moz-column-gap: 3em;
          column-gap: 3em;
  padding: 0 1em;
}
@media screen and (min-width: 768px) {
  .blog .blog_outer {
    padding-inline: 3em;
  }
}
@media screen and (min-width: 1280px) {
  .blog .blog_outer {
    width: 100%;
    max-width: var(--width__max);
    margin-inline: auto;
    -ms-grid-columns: minmax(210px, auto) 1fr;
    grid-template-columns: minmax(210px, auto) 1fr;
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
        grid-template-areas: ". title" "sidebar contents";
  }
}
.blog .page_title {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: title;
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
}
.blog .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.blog .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.blog .page_title .subtitle {
  display: block;
  margin-top: 1em;
  font-family: var(--font__gothic);
}
.blog .cat_item.president-blog {
  background-color: var(--color__blog-president);
}
.blog .cat_item.mie-diary {
  background-color: var(--color__blog-mie);
}
.blog .cat_item.staff-blog {
  background-color: var(--color__blog-staff);
}
.blog .cat_item.reform-after-blog {
  background-color: var(--color__blog-reform);
}
.blog .related {
  padding-top: 5em;
  padding-inline: 1em calc(1em + 5px);
  margin-top: 5em;
  background-color: var(--color__background-body);
}
@media screen and (min-width: 768px) {
  .blog .related {
    padding-inline: 3em;
  }
}
@media screen and (min-width: 1280px) {
  .blog .related {
    padding-inline: 5em;
  }
}
.blog .related .related_list {
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1em 1fr;
  grid-template-columns: repeat(2, 1fr);
  gap: 1em;
  padding-bottom: 5px;
}
@media screen and (min-width: 768px) {
  .blog .related .related_list {
    -ms-grid-columns: (1fr)[4];
    grid-template-columns: repeat(4, 1fr);
  }
}
@media screen and (min-width: 1280px) {
  .blog .related .related_list {
    -webkit-column-gap: 2em;
       -moz-column-gap: 2em;
            column-gap: 2em;
  }
}
.blog .related .related_list a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 100%;
  padding: 1em;
  background-color: var(--color__background-body);
  -webkit-box-shadow: 5px 5px 1px rgba(4, 0, 0, 0.2);
          box-shadow: 5px 5px 1px rgba(4, 0, 0, 0.2);
  border: 1px solid #c9caca;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  --clamp-min: 13;
  --clamp-max: 15;
}
@media (any-hover: hover) {
  .blog .related .related_list a:hover {
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-transform: translate(5px, 5px);
            transform: translate(5px, 5px);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    opacity: 0.8;
  }
}
.blog .related .related_list p {
  margin: 0;
}
.blog .related .related_list .info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 1em 0 0.5em;
  font-weight: var(--font__weight-regular);
}
.blog .related .related_list .title {
  margin: 0;
  font-weight: var(--font__weight-regular);
}
.blog .related .related_list .cat_item {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0em 0.2em;
  background-color: var(--color__cat);
  font-weight: var(--font__weight-regular);
}
.blog .related .related_list .cat_item.president-blog {
  --color__cat: #aec6d9;
}
.blog .related .related_list .cat_item.mie-diary {
  --color__cat: #e4c59d;
}
.blog .related .related_list .cat_item.staff-blog {
  --color__cat: #8fba94;
}
.blog .related .related_list .cat_item.reform-after-blog {
  --color__cat: #c9caca;
}
.blog .related .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .blog .related .btn {
    height: 48px;
  }
}
.blog .related .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .blog .related .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .blog .related .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}

/* 共通サイドバー
--------------------------------------------- */
.blog .sidebar {
  -ms-grid-row: 4;
  -ms-grid-column: 1;
  grid-area: sidebar;
  display: -ms-grid;
  display: grid;
  -webkit-column-gap: 2em;
     -moz-column-gap: 2em;
          column-gap: 2em;
  row-gap: 2em;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  margin-top: 5em;
  --clamp-min: 18;
  --clamp-max: 20;
}
@media screen and (min-width: 420px) {
  .blog .sidebar {
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    row-gap: 3em;
  }
}
@media screen and (min-width: 1280px) {
  .blog .sidebar {
    -ms-grid-columns: auto;
    grid-template-columns: auto;
    row-gap: 5em;
    margin-top: 0;
  }
}
.blog .sidebar_title {
  padding-bottom: 0.3em;
  margin-bottom: 1em;
  --clamp-min: 18;
  --clamp-max: 20;
  font-weight: var(--font__weight-bold);
}
.blog .sidebar_title:not(.calendar) {
  border-bottom: 1px solid #b7b7b7;
}
.blog .sidebar_list {
  display: -ms-grid;
  display: grid;
  --clamp-min: 18;
  --clamp-max: 18;
}
.blog .sidebar_list a:not([class]) {
  border-bottom: 1px solid var(--color__text);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
@media (any-hover: hover) {
  .blog .sidebar_list a:not([class]):hover {
    border-bottom-color: transparent;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
  }
}
.blog .sidebar_list.category {
  row-gap: 1em;
}
.blog .sidebar_list.category .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 100%;
  height: 23px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 18;
  --clamp-max: 20;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: auto;
  border: none;
}
@media screen and (min-width: 768px) {
  .blog .sidebar_list.category .btn {
    height: 38px;
  }
}
.blog .sidebar_list.category .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .blog .sidebar_list.category .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .blog .sidebar_list.category .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.blog .sidebar_list.category .btn.president-blog {
  background-color: #aec6d9;
}
.blog .sidebar_list.category .btn.mie-diary {
  background-color: #e4c59d;
}
.blog .sidebar_list.category .btn.staff-blog {
  background-color: #8fba94;
}
.blog .sidebar_list.category .btn.reform-after-blog {
  background-color: #c9caca;
}
.blog .sidebar_list.category .btn::after {
  width: 6px;
  height: 12px;
  background-image: url(img/blog/cat_arrow.svg);
}
.blog .sidebar_list.newest, .blog .sidebar_list.month, .blog .sidebar_list.previous {
  row-gap: 0.5em;
  --clamp-min: 16;
  --clamp-max: 18;
}
.blog .sidebar_list .sidebar_list {
  margin: 0.5em 0 0 1em;
}
.blog .tonewest {
  display: block;
  width: 100%;
  padding: 0.2em 0;
  margin-top: 1em;
  border: 1px solid var(--color__border-text);
  text-align: center;
  --clamp-min: 16;
  --clamp-max: 18;
}
.blog .wp-calendar-table {
  width: 100%;
  text-align: center;
  --clamp-min: 15;
  --clamp-max: 15;
}
.blog .wp-calendar-table thead {
  border-bottom: 3px double #b7b7b7;
}
.blog .wp-calendar-table tr {
  border-bottom: 1px solid #b7b7b7;
}
.blog .wp-calendar-table a {
  position: relative;
  z-index: 1;
  display: block;
  color: var(--color__accent);
}
.blog .wp-calendar-table a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  width: 20px;
  height: 20px;
  margin: auto;
  border-radius: 50%;
  background-color: #d7d4cc;
}
.blog .wp-calendar-nav {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 0.2em;
  --clamp-min: 15;
  --clamp-max: 15;
}
.blog .link_prev {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 10px 0.5em 1fr 0.5em auto;
  grid-template-columns: 10px 1fr auto;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
}
.blog .link_prev::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  margin-right: 0.5em;
}
.blog .link_prev.president-blog::before {
  background-color: var(--color__blog-president);
}
.blog .link_prev.mie-diary::before {
  background-color: var(--color__blog-mie);
}
.blog .link_prev.staff-blog::before {
  background-color: var(--color__blog-staff);
}
.blog .link_prev.reform-after-blog::before {
  background-color: var(--color__blog-reform);
}
.blog .link_prev::after {
  content: "";
  display: block;
  width: 6px;
  height: 12px;
  background-image: url(img/blog/cat_arrow.svg);
}
.blog .accordion {
  list-style: none;
}
.blog .accordion .button {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
.blog .accordion .button span {
  border-bottom: 1px solid var(--color__border-text);
  line-height: 1;
}
.blog .accordion .button::after {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  margin-left: 0.5em;
  background-image: url(img/blog/year_open.svg);
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 1;
}
.blog .accordion .button[aria-expanded=true]::after {
  background-image: url(img/blog/year_close.svg);
}
.blog .accordion .panel {
  height: 0;
  opacity: 0;
  visibility: hidden;
}
.blog .accordion .panel.active {
  height: auto;
  -webkit-transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out;
  transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out;
  opacity: 1;
  visibility: visible;
}

/* コンテンツ（all：一覧）
--------------------------------------------- */
.blog .all {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  grid-area: contents;
}
.blog .all .content {
  display: -ms-grid;
  display: grid;
  row-gap: 1.5em;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
}
@media screen and (min-width: 420px) {
  .blog .all .content {
    -ms-grid-columns: 1fr 1.5em 1fr;
    grid-template-columns: 1fr 1fr;
    -webkit-column-gap: 1.5em;
       -moz-column-gap: 1.5em;
            column-gap: 1.5em;
  }
}
@media screen and (min-width: 768px) {
  .blog .all .content {
    -webkit-column-gap: 2em;
       -moz-column-gap: 2em;
            column-gap: 2em;
    row-gap: 3em;
  }
}
.blog .all .content a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 100%;
  padding: 1em;
  background-color: var(--color__background-body);
  -webkit-box-shadow: 5px 5px 1px rgba(4, 0, 0, 0.2);
          box-shadow: 5px 5px 1px rgba(4, 0, 0, 0.2);
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  --clamp-min: 14;
  --clamp-max: 18;
}
@media (any-hover: hover) {
  .blog .all .content a:hover {
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-transform: translate(5px, 5px);
            transform: translate(5px, 5px);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    opacity: 0.8;
  }
  .blog .all .content a:hover .btn {
    background-color: var(--color__background-black);
    color: var(--color__white);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
  }
  .blog .all .content a:hover .btn::after {
    background-image: url(img/blog/blog_arrow-hover.png);
  }
}
.blog .all .content p {
  margin: 0;
}
.blog .all .content .info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 0.3em;
  margin: 1em 0 0.5em;
}
.blog .all .content .title {
  margin: 0;
  font-weight: var(--font__weight-demibold);
  --clamp-min: 18;
  --clamp-max: 21;
}
.blog .all .content .overview {
  margin: 0.5em 0 1em;
}
.blog .all .content .cat_item {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0.1em 1em;
  --clamp-min: 14;
  --clamp-max: 15;
  font-weight: var(--font__weight-regular);
}
.blog .all .content .btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: 35px;
  padding: 0 0.6em 0 1em;
  -webkit-margin-start: auto;
          margin-inline-start: auto;
  border: 1px solid var(--color__text);
  border-radius: 9999px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  --clamp-min: 14;
  --clamp-max: 15;
}
.blog .all .content .btn::after {
  content: "";
  display: block;
  width: 8px;
  height: 15px;
  margin-left: 0.4em;
  background-image: url(img/blog/blog_arrow.png);
  background-repeat: no-repeat;
  background-size: contain;
}
@media screen and (min-width: 420px) {
  .blog .all .content .btn::after {
    grid-row: auto;
  }
}
.blog .all .pagination {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
  grid-area: pagination;
  margin-top: 5rem;
}
.blog .all .pagination .nav-links {
  --clamp-min: 14;
  --clamp-max: 18;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  font-weight: var(--font__weight-regular);
}
.blog .all .pagination .prev,
.blog .all .pagination .next {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 12px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: contain;
}
.blog .all .pagination .prev {
  background-image: url(img/pagination_all-prev.png);
}
.blog .all .pagination .next {
  background-image: url(img/pagination_all-next.png);
}
.blog .all .pagination .page-numbers {
  color: #848484;
}
.blog .all .pagination .current {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 30px;
  height: 30px;
  background-color: var(--color__background-pagination);
  border-radius: 50%;
  color: var(--color__accent);
}
.blog .all .pagination .dot {
  color: #848484;
}

/* コンテンツ（single：詳細）
--------------------------------------------- */
.blog .single {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  grid-area: contents;
  --clamp-min: 14;
  --clamp-max: 18;
}
.blog .single .entry_header {
  --clamp-min: 14;
  --clamp-max: 18;
  margin-bottom: 2em;
}
.blog .single .entry_header .cat_item {
  display: inline-block;
  margin: 0;
  padding: 0.1em 1em;
  --clamp-min: 14;
  --clamp-max: 23;
}
.blog .single .entry_header .date {
  margin: 0;
  font-weight: var(--font__weight-regular);
  --clamp-min: 14;
  --clamp-max: 20;
}
.blog .single .entry_header h1 {
  margin: 0.5em 0;
  font-weight: var(--font__weight-demibold);
  --clamp-min: 20;
  --clamp-max: 35;
  line-height: 1.2;
}
.blog .single .pagination {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
  grid-area: pagination;
  margin-top: 5rem;
  --clamp-min: 14;
  --clamp-max: 16;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr;
  row-gap: 1em;
  margin-top: 3em;
  font-weight: var(--font__weight-regular);
}
.blog .single .pagination .prev a,
.blog .single .pagination .next a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
}
@media screen and (min-width: 420px) {
  .blog .single .pagination .prev a,
  .blog .single .pagination .next a {
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
  }
}
.blog .single .pagination .prev a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-right: auto;
}
.blog .single .pagination .prev a::before {
  content: "";
  display: block;
  width: 12px;
  height: 24px;
  background-image: url(img/pagination_single-prev.png);
  background-repeat: no-repeat;
  background-size: contain;
}
.blog .single .pagination .next a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
}
.blog .single .pagination .next a::after {
  content: "";
  display: block;
  width: 12px;
  height: 24px;
  background-image: url(img/pagination_single-next.png);
  background-repeat: no-repeat;
  background-size: contain;
}
.blog .single .pagination .back {
  text-align: center;
}
.blog .single .pagination .back a {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 0.5em 0.5em;
  margin-inline: auto;
  border-bottom: 1px solid var(--color__text);
}

/* PC版サイドバー「最新の記事」: 15文字幅で折り返し */
@media screen and (min-width: 1280px) {
  .blog .sidebar_list.newest li a {
    display: block;
    max-width: 15em;
    white-space: normal;
    word-break: break-all;
  }
}

/* コラムカテゴリー色 */
.blog .cat_item.column {
  background-color: #b48082;
}
.blog .sidebar_list.category .btn.column {
  background-color: #b48082;
}

/* ブログ記事本文の箇条書き（●） */
.blog .single .entry_content ul {
  list-style: disc;
  padding-left: 1.5em;
  margin: 1em 0;
}
.blog .single .entry_content ol {
  list-style: decimal;
  padding-left: 1.5em;
  margin: 1em 0;
}
.blog .single .entry_content ul li,
.blog .single .entry_content ol li {
  margin-bottom: 0.5em;
}

/* ブログ記事本文の見出しサイズ */
.blog .single .entry_content h2 {
  --clamp-min: 20;
  --clamp-max: 24;
  font-weight: var(--font__weight-bold);
  margin: 1.5em 0 0.5em;
}
.blog .single .entry_content h3 {
  --clamp-min: 18;
  --clamp-max: 20;
  font-weight: var(--font__weight-bold);
  margin: 1.2em 0 0.5em;
}
.blog .single .entry_content h4 {
  --clamp-min: 16;
  --clamp-max: 18;
  font-weight: var(--font__weight-bold);
  margin: 1em 0 0.5em;
}

/* modal-voice タイトル */
.modal_title {
  --clamp-min: 20;
  --clamp-max: 26;
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  text-align: center;
  margin-bottom: 1em;
}

/*--------------------------------------------------------------
# works：施工事例
--------------------------------------------------------------*/
.works {
  margin-bottom: var(--mb__page);
  /* ----- 詳細 ----- */
  /* fv
  --------------------------------------------- */
  /* コンテンツ（all：一覧 / single:共通）
  --------------------------------------------- */
  /* コンテンツ（all：一覧）
  --------------------------------------------- */
  /* コンテンツ（single：詳細）
  --------------------------------------------- */
}
.works .single .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 320px;
  height: 41px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 3em;
  width: calc(100% - 2em);
}
@media screen and (min-width: 768px) {
  .works .single .btn {
    height: 56px;
  }
}
.works .single .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .works .single .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .works .single .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.works .single .btn::after {
  display: none;
}
.works .single .btn::before {
  content: "";
  position: absolute;
  left: 1em;
  display: inline-block;
  width: 12px;
  height: 20px;
  background-image: url(img/works/btn_arrow-white.png);
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
}
.works .fv {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
  height: 280px;
}
@media screen and (min-width: 768px) {
  .works .fv {
    height: 100%;
    max-height: 570px;
  }
}
.works .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
  margin-top: 5em;
}
.works .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.works .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.works .tag_list {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.5em;
  padding: 0 1em;
}
.works .tag_list .tag_item {
  display: block;
  padding: 0 1em;
  background-color: var(--color__background-body);
  border: 1px solid var(--color__border-text);
  --clamp-min: 12;
  --clamp-max: 17;
}
.works .tag_list .tag_item.all {
  background-color: var(--color__background-text);
  color: var(--color__white);
}
.works .tag_list .tag_item.current {
  background-color: var(--color__background-part);
}
.works .all .content,
.works .single .content {
  padding-left: 1em;
  padding-right: 1em;
  margin-top: 3em;
}
@media screen and (min-width: 1280px) {
  .works .all .content,
  .works .single .content {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.works .all .content .tag_list,
.works .single .content .tag_list {
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
  padding: 1em 0.5em 0;
}
.works .all .content .tag_list .tag_item,
.works .single .content .tag_list .tag_item {
  --clamp-max: 14;
}
.works .all .content {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  gap: 2em 1em;
}
@media screen and (min-width: 420px) {
  .works .all .content {
    -ms-grid-columns: 1fr 2.5em 1fr;
    grid-template-columns: repeat(2, 1fr);
    gap: 3em 2.5em;
  }
}
@media screen and (min-width: 768px) {
  .works .all .content {
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3, 1fr);
  }
}
.works .all .content article {
  padding: 1em;
  --clamp-min: 14;
  --clamp-max: 18;
}
.works .all .content article:hover {
  background-color: #f0efed;
}
.works .all .content article a:hover {
  opacity: 1;
}
.works .all .content article .title {
  padding: 1em;
  margin: 0;
  border-bottom: 2px dotted var(--color__text);
  font-weight: var(--font__weight-demibold);
}
.works .all .pagination {
  margin-top: 3em;
}
.works .all .pagination .nav-links {
  --clamp-min: 14;
  --clamp-max: 18;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  font-weight: var(--font__weight-regular);
}
.works .all .pagination .prev,
.works .all .pagination .next {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 12px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: contain;
}
.works .all .pagination .prev {
  background-image: url(img/pagination_all-prev.png);
}
.works .all .pagination .next {
  background-image: url(img/pagination_all-next.png);
}
.works .all .pagination .page-numbers {
  color: #848484;
}
.works .all .pagination .current {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 30px;
  height: 30px;
  background-color: var(--color__background-pagination);
  border-radius: 50%;
  color: var(--color__accent);
}
.works .all .pagination .dot {
  color: #848484;
}
.works .single .content {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  --clamp-min: 14;
  --clamp-max: 18;
}
.works .single .content .entry_meta {
  width: 100%;
  max-width: 740px;
  margin: 2em auto 2em;
}
.works .single .content .entry_meta::before {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  content: "施工事例";
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 0.5em;
  margin: 0 auto 0.5em;
  border-bottom: 1px solid var(--color__border-text);
  letter-spacing: var(--font__letter-title);
}
.works .single .content .entry_meta h1 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  margin: 0;
  --clamp-min: 18;
  --clamp-max: 25;
  letter-spacing: var(--font__letter-title);
}
.works .single .content .entry_content h2,
.works .single .content .entry_content h3,
.works .single .content .entry_content p {
  max-width: 810px;
  margin-inline: auto;
}
.works .single .content .entry_content h2 {
  --clamp-min: 20;
  --clamp-max: 24;
  font-weight: var(--font__weight-bold);
  margin-block: 1.5em 0.5em;
}
.works .single .content .entry_content h3 {
  --clamp-min: 18;
  --clamp-max: 20;
  font-weight: var(--font__weight-bold);
  margin-block: 1.2em 0.5em;
}
.works .single .content .entry_content h4 {
  --clamp-min: 16;
  --clamp-max: 18;
  font-weight: var(--font__weight-bold);
  margin-block: 1em 0.5em;
}
.works .single .content .entry_content ul {
  list-style: disc;
  padding-left: 1.5em;
  margin: 1em 0;
}
.works .single .content .entry_content ol {
  list-style: decimal;
  padding-left: 1.5em;
  margin: 1em 0;
}
.works .single .content .entry_content img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 1000px;
  margin-block: 2em;
  margin-inline: auto;
}

/*--------------------------------------------------------------
# about：初めての方へ
--------------------------------------------------------------*/
.about {
  margin-bottom: var(--mb__page);
  /* fv
  --------------------------------------------- */
  /* コンセプト
  --------------------------------------------- */
  /* 吉田のあゆみ
  --------------------------------------------- */
  /* スタッフ紹介
  --------------------------------------------- */
  /* ショールーム
  --------------------------------------------- */
  /* イメージ画像（家族）
  --------------------------------------------- */
  /* アフターサービス
  --------------------------------------------- */
  /* 吉田建設ファミリーズクラブ
  --------------------------------------------- */
  /* 環境や未来への取り組み
  --------------------------------------------- */
  /* 会社概要
  --------------------------------------------- */
  /* アクセス
  --------------------------------------------- */
}
.about .about_fv {
  --clamp-min: 14;
  --clamp-max: 18;
  background-color: var(--color__background-section);
  padding-top: var(--pt__section-color);
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .about .about_fv {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 5fr;
    grid-template-columns: 1fr 5fr;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
@media screen and (min-width: 1280px) {
  .about .about_fv {
    -ms-grid-columns: 1fr 5fr;
    grid-template-columns: 1fr 5fr;
  }
}
.about .about_fv .catch {
  padding-left: 5%;
  height: -webkit-max-content;
  height: -moz-max-content;
  height: max-content;
  margin-bottom: 1em;
}
@media screen and (min-width: 420px) {
  .about .about_fv .catch {
    padding-left: 3em;
  }
}
@media screen and (min-width: 768px) {
  .about .about_fv .catch {
    text-align: right;
  }
}
.about .about_fv .catch p {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  position: relative;
  z-index: 1;
  letter-spacing: var(--font__letter-title);
  --clamp-min: 24;
  --clamp-max: 26;
}
@media screen and (min-width: 768px) {
  .about .about_fv .catch p {
    display: inline-block;
    letter-spacing: var(--font__letter-title);
    -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
    -webkit-font-feature-settings: "pkna";
            font-feature-settings: "pkna";
    text-align: left;
  }
}
@media screen and (min-width: 1280px) {
  .about .about_fv .catch p {
    --clamp-max: 35;
  }
}
.about .about_fv .clip {
  position: relative;
  z-index: 1;
  width: 100%;
  -webkit-margin-start: auto;
          margin-inline-start: auto;
  -webkit-mask-image: url(img/mask_movie.svg);
          mask-image: url(img/mask_movie.svg);
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: right top;
          mask-position: right top;
}
.about .about_fv .clip video {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.about .about_fv .menu {
  position: relative;
  background-color: var(--color__background-part);
  width: 100%;
  padding-bottom: 3em;
  margin-top: -100px;
}
@media screen and (min-width: 768px) {
  .about .about_fv .menu {
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    grid-column: 1/3;
  }
}
@media screen and (min-width: 1440px) {
  .about .about_fv .menu {
    margin-top: -150px;
  }
}
.about .about_fv .menu .bg {
  position: relative;
  top: -30px;
  left: 0;
  z-index: 0;
  display: block;
  max-width: 750px;
  max-height: 140px;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: left;
     object-position: left;
}
@media screen and (min-width: 768px) {
  .about .about_fv .menu .bg {
    top: -50px;
    width: 50%;
    max-height: -webkit-fit-content;
    max-height: -moz-fit-content;
    max-height: fit-content;
  }
}
.about .about_fv .menu .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
}
.about .about_fv .menu .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.about .about_fv .menu .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.about .about_fv .menu_list {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  gap: 1.5em;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  padding: 0 1.75em;
}
@media screen and (min-width: 768px) {
  .about .about_fv .menu_list {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 1280px) {
  .about .about_fv .menu_list {
    -ms-grid-columns: (1fr)[4];
    grid-template-columns: repeat(4, 1fr);
  }
}
.about .about_fv .menu_item {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  border-bottom: 1px solid var(--color__border-accent);
}
.about .about_fv .menu_item a {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  padding: 0.5em 1em 1em 0.5em;
  --clamp-min: 14;
  --clamp-max: 20;
  color: var(--color__accent);
  letter-spacing: var(--font__letter-title);
  line-height: 1.2;
}
.about .about_fv .menu_item a::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 8px;
  margin-bottom: 0.4em;
  -o-object-fit: contain;
     object-fit: contain;
  background-image: url(img/about/menu_arrow.png);
  background-size: contain;
  background-repeat: no-repeat;
}
.about .about_concept {
  padding-left: 1em;
  padding-right: 1em;
  --clamp-min: 14;
  --clamp-max: 18;
  position: relative;
  margin-top: var(--margin__section);
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: auto auto;
  grid-template-columns: auto auto;
      grid-template-areas: "title title" "left contents";
  place-content: center;
  overflow: hidden;
}
@media screen and (min-width: 1280px) {
  .about .about_concept {
    padding-left: 0em;
    padding-right: 0em;
  }
}
@media screen and (min-width: 1280px) {
  .about .about_concept {
    -ms-grid-columns: 380px auto 400px;
    grid-template-columns: 380px auto 400px;
        grid-template-areas: ". title right" "left contents right" "left contents right" "left contents right";
  }
  .about .about_concept > .page_title {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
  }
  .about .about_concept > .all {
    -ms-grid-row: 2;
    -ms-grid-row-span: 3;
    -ms-grid-column: 2;
  }
  .about .about_concept > .single {
    -ms-grid-row: 2;
    -ms-grid-row-span: 3;
    -ms-grid-column: 2;
  }
}
.about .about_concept .contents {
  -ms-grid-row: 2;
  -ms-grid-column: 2;
  grid-area: contents;
}
.about .about_concept .sec_title {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-area: title;
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.about .about_concept .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.about .about_concept .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .about .about_concept .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.about .about_concept .text {
  grid-area: text;
  display: -ms-grid;
  display: grid;
  row-gap: 2em;
  margin-bottom: 3em;
  line-height: 2.65;
}
.about .about_concept .left {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
  --fontsize__catch: 24px;
  grid-area: left;
  position: relative;
  width: calc(var(--fontsize__catch) + 2em);
  margin-top: 0.5em;
}
@media screen and (min-width: 768px) {
  .about .about_concept .left {
    --fontsize__catch: 32px;
    width: calc(var(--fontsize__catch) * 2 + 5em);
  }
}
@media screen and (min-width: 1280px) {
  .about .about_concept .left {
    --fontsize__catch: 45px;
    width: auto;
  }
}
.about .about_concept .catch {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  -webkit-font-feature-settings: "pkna";
          font-feature-settings: "pkna";
  font-size: var(--fontsize__catch);
  letter-spacing: 8px;
}
@media screen and (min-width: 768px) {
  .about .about_concept .catch {
    line-height: 1.5;
  }
}
@media screen and (min-width: 1280px) {
  .about .about_concept .catch {
    padding-right: 1em;
    margin-left: auto;
  }
}
.about .about_concept .catch br {
  display: none;
}
@media screen and (min-width: 768px) {
  .about .about_concept .catch br {
    display: inline;
  }
}
.about .about_concept .right {
  grid-area: right;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 2em;
}
.about .about_concept img {
  position: absolute;
  z-index: -1;
  opacity: 0.3;
}
@media screen and (min-width: 1280px) {
  .about .about_concept img {
    position: relative;
    display: block;
    opacity: 1;
  }
}
.about .about_concept img.one {
  top: 50%;
  left: -74px;
  width: 80vw;
  max-width: 426px;
}
@media screen and (min-width: 420px) {
  .about .about_concept img.one {
    left: -150px;
  }
}
@media screen and (min-width: 768px) {
  .about .about_concept img.one {
    top: auto;
    left: auto;
    right: 1em;
    max-width: 380px;
  }
}
@media screen and (min-width: 1280px) {
  .about .about_concept img.one {
    top: 3em;
    left: -74px;
    width: 100%;
  }
}
.about .about_concept img.two {
  top: 2%;
  right: -120px;
  width: 100%;
  max-width: 610px;
}
@media screen and (min-width: 1280px) {
  .about .about_concept img.two {
    top: 0;
    right: 0;
    width: 610px;
  }
}
.about .about_concept img.three {
  bottom: 0;
  right: 1em;
  width: 50%;
  max-width: 290px;
}
@media screen and (min-width: 1280px) {
  .about .about_concept img.three {
    right: 0;
    width: 290px;
    margin-left: 1em;
  }
}
.about .about_concept br {
  display: none;
}
@media screen and (min-width: 420px) {
  .about .about_concept br {
    display: inline;
  }
}
.about .about_history {
  padding-left: 1em;
  padding-right: 1em;
  --clamp-min: 14;
  --clamp-max: 18;
  background-color: var(--color__background-section);
  padding-top: var(--pt__section-color);
  padding-bottom: var(--pb__section-color);
  margin-top: var(--margin__section);
}
@media screen and (min-width: 1280px) {
  .about .about_history {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.about .about_history .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.about .about_history .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.about .about_history .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .about .about_history .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.about .about_history img {
  display: block;
  max-width: 655px;
  margin-inline: auto;
}
.about .about_history .contents {
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: justify;
}
.about .about_history h3 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  margin: 1.5em 0;
  --clamp-min: 18;
  --clamp-max: 25;
  text-align: center;
  letter-spacing: var(--font__letter-title);
}
.about .about_history .text {
  display: -ms-grid;
  display: grid;
  row-gap: 1em;
}
.about .about_history strong {
  display: block;
  --clamp-min: 18;
  --clamp-max: 25;
  font-weight: var(--font__weight-demibold);
}
.about .about_history br {
  display: none;
}
@media screen and (min-width: 420px) {
  .about .about_history br {
    display: inline;
  }
}
.about .about_staff {
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  --clamp-min: 14;
  --clamp-max: 18;
  margin-top: var(--margin__section);
}
.about .about_staff .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
  margin-top: 2em;
}
.about .about_staff .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.about .about_staff .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .about .about_staff .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.about .about_staff .contents {
  padding-left: 1em;
  padding-right: 1em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: justify;
}
@media screen and (min-width: 1280px) {
  .about .about_staff .contents {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.about .about_staff .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .about .about_staff .btn {
    height: 48px;
  }
}
.about .about_staff .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .about .about_staff .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .about .about_staff .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 1280px) {
  .about .about_staff .btn {
    margin-top: 3em;
  }
}
.about .about_staff br {
  display: none;
}
@media screen and (min-width: 420px) {
  .about .about_staff br {
    display: inline;
  }
}
.about .about_showroom {
  --clamp-min: 14;
  --clamp-max: 18;
  background-color: var(--color__background-section);
  padding-bottom: var(--pb__section-color);
  margin-top: var(--margin__section);
}
.about .about_showroom .swiper {
  width: 100%;
}
.about .about_showroom .swiper .swiper-slide {
  height: auto;
}
.about .about_showroom .swiper .swiper-button-prev,
.about .about_showroom .swiper .swiper-button-next {
  height: 55px;
  width: 55px;
}
.about .about_showroom .swiper .swiper-button-prev::after,
.about .about_showroom .swiper .swiper-button-next::after {
  content: "";
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: contain;
}
.about .about_showroom .swiper .swiper-button-prev::after {
  background-image: url(img/about/showroom_prev.svg);
}
.about .about_showroom .swiper .swiper-button-next::after {
  background-image: url(img/about/showroom_next.svg);
}
.about .about_showroom .contents {
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  padding-left: 1em;
  padding-right: 1em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: justify;
}
@media screen and (min-width: 1280px) {
  .about .about_showroom .contents {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.about .about_showroom h2 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  margin: 1.5em 0 1em;
  --clamp-min: 18;
  --clamp-max: 25;
  text-align: center;
  letter-spacing: var(--font__letter-title);
}
.about .about_showroom br {
  display: none;
}
@media screen and (min-width: 420px) {
  .about .about_showroom br {
    display: inline;
  }
}
.about .about_image {
  height: 200px;
}
@media screen and (min-width: 420px) {
  .about .about_image {
    height: 280px;
  }
}
@media screen and (min-width: 768px) {
  .about .about_image {
    height: 380px;
  }
}
@media screen and (min-width: 1280px) {
  .about .about_image {
    height: 480px;
  }
}
@media screen and (min-width: 1280px) {
  .about .about_image {
    height: 580px;
  }
}
.about .about_image img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
  -o-object-position: bottom 0 right 30%;
     object-position: bottom 0 right 30%;
}
.about .about_afterservice {
  padding-left: 1em;
  padding-right: 1em;
  margin-top: var(--margin__section);
}
@media screen and (min-width: 1280px) {
  .about .about_afterservice {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.about .about_afterservice .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.about .about_afterservice .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.about .about_afterservice .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .about .about_afterservice .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.about .about_afterservice .content {
  --clamp-min: 14;
  --clamp-max: 18;
  display: -ms-grid;
  display: grid;
  justify-items: center;
  row-gap: 1em;
}
@media screen and (min-width: 768px) {
  .about .about_afterservice .content {
    row-gap: 2em;
  }
}
.about .about_afterservice .content img {
  display: block;
  width: 90%;
  max-width: 650px;
}
.about .about_afterservice .content br {
  display: none;
}
@media screen and (min-width: 768px) {
  .about .about_afterservice .content br {
    display: inline;
  }
}
.about .about_yfc {
  padding-left: 1em;
  padding-right: 1em;
  --clamp-min: 14;
  --clamp-max: 18;
  background-color: var(--color__background-section);
  padding-top: var(--pt__section-color);
  padding-bottom: var(--pb__section-color);
  margin-top: var(--margin__section);
}
@media screen and (min-width: 1280px) {
  .about .about_yfc {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.about .about_yfc .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.about .about_yfc .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.about .about_yfc .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .about .about_yfc .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.about .about_yfc .contents {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  row-gap: 2em;
}
@media screen and (min-width: 1280px) {
  .about .about_yfc .contents {
    -ms-grid-columns: auto 500px;
    grid-template-columns: auto 500px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    row-gap: 0;
  }
}
.about .about_yfc .text {
  text-align: justify;
}
.about .about_yfc h3 {
  margin-bottom: 0.5em;
  font-weight: var(--font__weight-bold);
  --clamp-min: 16;
  --clamp-max: 21;
}
.about .about_yfc .img {
  -webkit-box-ordinal-group: 0;
      -ms-flex-order: -1;
          order: -1;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 100px 1fr;
  grid-template-columns: 1fr 100px 1fr;
  -ms-grid-rows: 1fr 70px 1fr;
  grid-template-rows: 1fr 70px 1fr;
  max-width: 500px;
}
.about .about_yfc .img > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.about .about_yfc .img > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
}
.about .about_yfc .img > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.about .about_yfc .img > *:nth-child(4) {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
}
.about .about_yfc .img > *:nth-child(5) {
  -ms-grid-row: 2;
  -ms-grid-column: 2;
}
.about .about_yfc .img > *:nth-child(6) {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
}
.about .about_yfc .img > *:nth-child(7) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.about .about_yfc .img > *:nth-child(8) {
  -ms-grid-row: 3;
  -ms-grid-column: 2;
}
.about .about_yfc .img > *:nth-child(9) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
@media screen and (min-width: 1280px) {
  .about .about_yfc .img {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
.about .about_yfc .img img:first-of-type {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1/3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
}
.about .about_yfc .img img:last-of-type {
  -ms-grid-column: 2;
  -ms-grid-column-span: 2;
  grid-column: 2/4;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/4;
}
.about .about_yfc br {
  display: none;
}
@media screen and (min-width: 420px) {
  .about .about_yfc br {
    display: inline;
  }
}
.about .about_sdgs {
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  --clamp-min: 14;
  --clamp-max: 18;
  margin-top: var(--margin__section);
}
@media screen and (min-width: 1280px) {
  .about .about_sdgs {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.about .about_sdgs .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.about .about_sdgs .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.about .about_sdgs .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .about .about_sdgs .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.about .about_sdgs .sec_title .en {
  text-transform: none;
}
.about .about_sdgs .contents {
  display: -ms-grid;
  display: grid;
  row-gap: 2em;
  margin-inline: auto;
}
@media screen and (min-width: 1280px) {
  .about .about_sdgs .contents {
    -ms-grid-columns: 400px auto;
    grid-template-columns: 400px auto;
    row-gap: 0;
    max-width: none;
  }
}
.about .about_sdgs img {
  width: 90%;
  max-width: 400px;
  margin-inline: auto;
}
@media screen and (min-width: 1280px) {
  .about .about_sdgs img {
    width: 100%;
  }
}
.about .about_sdgs .text {
  display: -ms-grid;
  display: grid;
  place-content: center;
  text-align: justify;
}
.about .about_sdgs br {
  display: none;
}
@media screen and (min-width: 420px) {
  .about .about_sdgs br {
    display: inline;
  }
}
.about .about_sdgs .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 200px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .about .about_sdgs .btn {
    height: 48px;
  }
}
.about .about_sdgs .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .about .about_sdgs .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .about .about_sdgs .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 1280px) {
  .about .about_sdgs .btn {
    margin-top: 3em;
  }
}
.about .about_sdgs dialog {
  --duration: 0.5s;
  width: min(90%, var(--width__section));
  height: 80%;
  margin: auto;
  background-color: var(--color__background-body);
  -webkit-transition: opacity var(--duration), scale var(--duration);
  transition: opacity var(--duration), scale var(--duration);
  contain: strict;
  width: 90%;
  max-width: 1040px;
}
.about .about_sdgs dialog:not([data-active=true]) {
  opacity: 0;
  scale: 0.95;
}
.about .about_sdgs dialog::-ms-backdrop {
  backdrop-filter: blur(4px);
  -ms-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.about .about_sdgs dialog::backdrop {
  backdrop-filter: blur(4px);
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.about .about_sdgs dialog:not([data-active=true])::-ms-backdrop {
  opacity: 0;
}
.about .about_sdgs dialog:not([data-active=true])::backdrop {
  opacity: 0;
}
.about .about_sdgs dialog .dialog_content {
  height: 100%;
  overflow: auto;
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
}
.about .about_sdgs dialog .dialog_close {
  position: absolute;
  right: 1.5rem;
  top: 1.5rem;
  display: inline-block;
  width: 45px;
  height: 45px;
}
.about .about_sdgs dialog .dialog_close:focus {
  outline: none;
}
.about .about_sdgs dialog .dialog_close .icon_close {
  position: absolute;
  inset: 0;
  width: 100%;
  block-size: 1px;
  margin: auto;
  background-color: transparent;
}
.about .about_sdgs dialog .dialog_close .icon_close::after, .about .about_sdgs dialog .dialog_close .icon_close::before {
  content: "";
  width: 100%;
  background-color: var(--color__background-text);
  -webkit-transition: rotate 0.3s;
  transition: rotate 0.3s;
}
.about .about_sdgs dialog .dialog_close .icon_close::before {
  rotate: 45deg;
}
.about .about_sdgs dialog .dialog_close .icon_close::after {
  rotate: -45deg;
}
@media (any-hover: hover) {
  .about .about_sdgs dialog .dialog_close:hover .icon_close::before, .about .about_sdgs dialog .dialog_close:hover .icon_close::after {
    rotate: 0deg;
  }
}
.about .about_sdgs dialog .dialog_content {
  padding: 1em;
}
@media screen and (min-width: 768px) {
  .about .about_sdgs dialog .dialog_content {
    padding: 3em 0.5em 0.5em;
  }
}
.about .about_sdgs dialog .meta {
  max-width: 870px;
  margin-inline: auto;
  text-align: center;
}
.about .about_sdgs dialog .meta img {
  width: 130px;
}
.about .about_sdgs dialog .meta h1 {
  margin-top: 0.5em;
  border-bottom: 8px solid var(--color__sdgs);
  text-align: center;
  --clamp-min: 20;
  --clamp-max: 35;
}
.about .about_sdgs dialog .meta .lead {
  margin-block: 0.5em;
  --clamp-min: 16;
  --clamp-max: 20;
}
.about .about_sdgs dialog .meta .sign {
  text-align: right;
}
.about .about_sdgs dialog .content {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  -ms-grid-rows: auto 1em auto 1em auto 1em auto 1em auto 1em auto 1em auto 1em auto 1em auto 1em auto;
  grid-template-rows: repeat(10, auto);
      grid-template-areas: "header" "." "." "." "." "." "." "." "." "footer";
  gap: 1em;
  padding: 2em 0;
  background-image: url(img/about/sdgs_line.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: bottom;
}
@media screen and (min-width: 768px) {
  .about .about_sdgs dialog .content {
    -ms-grid-columns: 1fr 2em 260px;
    grid-template-columns: 1fr 260px;
    -ms-grid-rows: auto 2em auto 2em auto 2em auto 2em auto 2em auto;
    grid-template-rows: repeat(6, auto);
        grid-template-areas: "header header" ". ." ". ." ". ." ". ." "footer footer";
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 2em;
    padding: 2em 1.5em 3em;
  }
}
.about .about_sdgs dialog .content .content_header {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: header;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 1em;
  margin-inline: auto;
  --clamp-min: 16;
  --clamp-max: 30;
  background-color: var(--color__sdgs);
  border-radius: 9999px;
  color: var(--color__white);
}
@media screen and (min-width: 768px) {
  .about .about_sdgs dialog .content .content_header {
    padding-inline: 1.5em;
  }
}
.about .about_sdgs dialog .content .text {
  --clamp-min: 14;
  --clamp-max: 16;
}
.about .about_sdgs dialog .content .text h3 {
  --clamp-min: 16;
  --clamp-max: 22;
}
.about .about_sdgs dialog .content .text h3::before {
  content: "♦︎";
  display: inline-block;
  margin-right: 0.5em;
  color: var(--color__sdgs);
}
.about .about_sdgs dialog .content .text dt {
  --clamp-min: 12;
  --clamp-max: 15;
}
@media screen and (min-width: 768px) {
  .about .about_sdgs dialog .content .text p {
    padding-left: 3em;
  }
  .about .about_sdgs dialog .content .text dl {
    padding-left: 2em;
  }
  .about .about_sdgs dialog .content .text dd {
    padding-left: 1em;
  }
}
.about .about_sdgs dialog .content .content_footer {
  -ms-grid-row: 19;
  -ms-grid-column: 1;
  grid-area: footer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
      -ms-flex-direction: column-reverse;
          flex-direction: column-reverse;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  width: 100%;
  padding: 1em;
  border: 1px solid #bcbcbc;
  --clamp-min: 14;
  --clamp-max: 16;
}
@media screen and (min-width: 768px){
  .about .about_sdgs dialog .content .content_header {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
  .about .about_sdgs dialog .content .content_footer {
    -ms-grid-row: 11;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
}
@media screen and (min-width: 768px) {
  .about .about_sdgs dialog .content .content_footer {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}
.about .about_sdgs dialog .content .content_footer .footer_title {
  --clamp-min: 18;
  --clamp-max: 21;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .about .about_sdgs dialog .content .content_footer .footer_title {
    text-align: left;
  }
}
.about .about_sdgs dialog .content .content_footer img {
  max-width: 220px;
}
.about .about_profile {
  padding-left: 1em;
  padding-right: 1em;
  background-color: var(--color__background-section);
  padding-top: var(--pt__section-color);
  padding-bottom: var(--pb__section-color);
  margin-top: var(--margin__section);
}
@media screen and (min-width: 1280px) {
  .about .about_profile {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.about .about_profile .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.about .about_profile .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.about .about_profile .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .about .about_profile .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.about .about_profile .profile_list {
  display: -ms-grid;
  display: grid;
  row-gap: 0.5em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: var(--width__section);
  padding: 2em 1em 3em;
  margin-inline: auto;
  border-top: 1px solid var(--color__border-text);
  border-bottom: 1px solid var(--color__border-text);
}
@media screen and (min-width: 768px) {
  .about .about_profile .profile_list {
    padding: 2em 3em 3em;
  }
}
.about .about_profile .profile_item {
  --clamp-min: 14;
  --clamp-max: 18;
}
@media screen and (min-width: 768px) {
  .about .about_profile .profile_item {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 90px 0.5em 1fr;
    grid-template-columns: 90px 1fr;
    -webkit-column-gap: 0.5em;
       -moz-column-gap: 0.5em;
            column-gap: 0.5em;
  }
}
.about .about_profile .profile_item dt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: var(--font__weight-demibold);
}
@media screen and (min-width: 768px) {
  .about .about_profile .profile_item dt {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
.about .about_profile .profile_item dt::after {
  content: "：";
}
.about .about_access {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  margin-top: var(--margin__section);
}
.about .about_access .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.about .about_access .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.about .about_access .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .about .about_access .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.about .about_access .contents {
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: 650px;
  margin-inline: auto;
}
@media screen and (min-width: 1280px) {
  .about .about_access .contents {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.about .about_access .map {
  width: 100%;
  height: 430px;
}
.about .about_access .map iframe {
  width: 100%;
  height: 100%;
}
.about .about_access .address {
  --clamp-min: 14;
  --clamp-max: 18;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 2em auto 0;
}

/*--------------------------------------------------------------
# commitments：5つのこだわり
--------------------------------------------------------------*/
/* 家づくりのこと
--------------------------------------------- */
.commitments {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  margin-bottom: var(--mb__page);
  text-align: center;
  --clamp-min: 14;
  --clamp-max: 18;
}
.commitments .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
}
.commitments .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.commitments .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.commitments .accordion {
  margin-top: 2em;
}
.commitments .accordion:nth-of-type(odd) .button img,
.commitments .accordion:nth-of-type(odd) .button::before {
  border-radius: 0 30px 30px 0;
}
@media screen and (min-width: 1280px) {
  .commitments .accordion:nth-of-type(odd) .button img,
  .commitments .accordion:nth-of-type(odd) .button::before {
    border-radius: 0 100px 100px 0;
  }
}
.commitments .accordion:nth-of-type(even) .button img,
.commitments .accordion:nth-of-type(even) .button::before {
  border-radius: 30px 0 0 30px;
}
@media screen and (min-width: 1280px) {
  .commitments .accordion:nth-of-type(even) .button img,
  .commitments .accordion:nth-of-type(even) .button::before {
    border-radius: 100px 0 0 100px;
  }
}
.commitments .accordion:nth-of-type(1) .button::before {
  content: "1.地域密着";
}
.commitments .accordion:nth-of-type(2) .button::before {
  content: "2.自社大工";
}
.commitments .accordion:nth-of-type(3) .button::before {
  content: "3.建築士とつくる家";
}
.commitments .accordion:nth-of-type(4) .button::before {
  content: "4.高耐震・高断熱・高気密";
}
.commitments .accordion:nth-of-type(5) .button::before {
  content: "5.暮らしをデザイン";
}
.commitments .accordion .button {
  position: relative;
  display: block;
  --clamp-min: 20;
  --clamp-max: 55;
}
.commitments .accordion .button::before {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -ms-grid;
  display: grid;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: start;
  position: absolute;
  width: 100%;
  height: 100%;
  padding-left: 1em;
  background-color: rgba(38, 38, 38, 0.65);
  letter-spacing: var(--font__letter-title);
  color: var(--color__white);
  opacity: 1;
}
.commitments .accordion .button::after {
  content: "";
  position: absolute;
  right: 1em;
  top: 50%;
  z-index: 2;
  translate: 0 -50%;
  display: inline-block;
  width: 2em;
  height: 2em;
  -o-object-fit: contain;
     object-fit: contain;
  background-image: url(img/commitments/commitments_open.svg);
  background-size: contain;
  background-repeat: no-repeat;
  opacity: 1;
}
.commitments .accordion .button img {
  -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.6);
          box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.6);
}
.commitments .accordion .button[aria-expanded=true]::before, .commitments .accordion .button[aria-expanded=true]::after {
  opacity: 0;
}
.commitments .accordion .panel {
  height: 0;
  overflow: hidden;
  opacity: 0;
  width: 100%;
  max-width: 810px;
  padding-inline: 1em;
  margin-inline: auto;
}
.commitments .accordion .panel.active {
  padding-left: 1em;
  padding-right: 1em;
  height: auto;
  padding-block: 3em;
  -webkit-transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out;
  transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out;
  opacity: 1;
}
@media screen and (min-width: 1280px) {
  .commitments .accordion .panel.active {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.commitments .accordion .panel:not(#commitments-four) section:not(:last-child) {
  margin-bottom: 2em;
}
.commitments .accordion .panel .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: inline-block;
  line-height: 1;
  padding: 0 0.2em 0.5em;
  margin: 0 auto 1em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  --clamp-min: 20;
  --clamp-max: 32;
}
.commitments .accordion .panel .sec_subtitle {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  --clamp-min: 18;
  --clamp-max: 21;
  text-align: center;
  margin-bottom: 0.5em;
  letter-spacing: var(--font__letter-title);
}
.commitments .accordion .panel p {
  text-align: start;
  letter-spacing: var(--font__letter-text);
}
.commitments .accordion .panel .photo {
  max-width: 400px;
  margin-bottom: 1em;
}
.commitments .accordion .panel hr {
  margin-bottom: 2em;
  color: #a1a1a1;
}
.commitments #commitments-four {
  max-width: 1240px;
}
.commitments #commitments-four .outer {
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  grid-auto-columns: 1fr;
  row-gap: 2em;
  margin-inline: auto;
}
.commitments #commitments-four .menu_list {
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: (auto)[6];
  grid-template-rows: repeat(6, auto);
  border-bottom: 1px solid var(--color__border-text);
  width: 80%;
  max-width: 1080px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .menu_list {
    width: 100%;
    -ms-grid-columns: (auto)[6];
    grid-template-columns: repeat(6, auto);
    border-bottom: none;
    border-left: 1px solid var(--color__border-text);
  }
}
.commitments #commitments-four .menu_list a {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: block;
  padding: 0.5em 0;
  border-top: 1px solid var(--color__border-text);
  --clamp-min: 14;
  --clamp-max: 21;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .menu_list a {
    padding: 0;
    border-top: none;
    border-right: 1px solid var(--color__border-text);
  }
}
.commitments #commitments-four .wrapper {
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  grid-auto-columns: 1fr;
  row-gap: 4em;
  text-align: left;
}
.commitments #commitments-four .container:not(:last-child) {
  padding-bottom: 3em;
  border-bottom: 1px solid #000;
}
.commitments #commitments-four .container:nth-of-type(1) img.one {
  max-width: 615px;
}
.commitments #commitments-four .container:nth-of-type(1) img.two {
  max-width: 455px;
}
.commitments #commitments-four .container:nth-of-type(2) img.one {
  max-width: 810px;
}
.commitments #commitments-four .container:nth-of-type(2) img.two {
  max-width: 700px;
}
.commitments #commitments-four .container:nth-of-type(2) img.three {
  max-width: 470px;
}
.commitments #commitments-four .container:nth-of-type(3) img.one {
  max-width: 655px;
}
.commitments #commitments-four .container:nth-of-type(4) img.one {
  max-width: 805px;
}
.commitments #commitments-four .container:nth-of-type(5) img.one {
  max-width: 365px;
}
.commitments #commitments-four .container:nth-of-type(6) img.one {
  max-width: 780px;
}
.commitments #commitments-four .subsection {
  display: -ms-grid;
  display: grid;
  justify-items: center;
  width: 100%;
  max-width: 1080px;
  padding-block: 1em;
  margin-inline: auto;
  background-color: var(--color__background-section);
  border-radius: 0 50px 50px 50px;
}
.commitments #commitments-four .subsection a:not([class]) {
  padding-bottom: 3px;
  border-bottom: 1px solid var(--color__border-text);
}
.commitments #commitments-four .subsection_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  width: 100%;
  padding-left: 0.5em;
  margin-bottom: 0.2em;
  --clamp-min: 30;
  --clamp-max: 72;
  opacity: 0.4;
  letter-spacing: var(--font__letter-title);
  font-weight: var(--font__weight-demibold);
}
.commitments #commitments-four .red {
  margin: 0 auto 0.5em;
  border: 1px solid #e43e26;
  color: #e43e26;
  line-height: 1.2;
}
.commitments #commitments-four .red span {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.commitments #commitments-four .red.strong {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  padding: 0.5em;
  letter-spacing: var(--font__letter-title);
  font-weight: var(--font__weight-demibold);
  --clamp-min: 14;
  --clamp-max: 26;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .red.strong {
    padding: 0.5em 1em;
  }
}
.commitments #commitments-four .red.strong .br-sp {
  display: inline;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .red.strong .br-sp {
    display: none;
  }
}
.commitments #commitments-four .red.data {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 100%;
  padding: 1em;
  --clamp-min: 14;
  --clamp-max: 20;
}
.commitments #commitments-four h4 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 0.5em;
  margin-inline: auto;
  letter-spacing: var(--font__letter-title);
  --clamp-min: 16;
  --clamp-max: 26;
}
.commitments #commitments-four h4.round {
  padding: 0 1em;
  border-radius: 50px;
  background-color: var(--color__background-body);
}
.commitments #commitments-four h4.attention {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four h4.attention {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-column-gap: 0.5em;
       -moz-column-gap: 0.5em;
            column-gap: 0.5em;
  }
}
.commitments #commitments-four h4.attention span {
  display: -ms-grid;
  display: grid;
  place-content: center;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0.2em;
  border: 1px solid #e43e26;
  color: #e43e26;
  letter-spacing: var(--font__letter-text);
  line-height: 1;
  --clamp-min: 12;
  --clamp-max: 19;
}
.commitments #commitments-four .box {
  width: calc(100% - 2em);
  max-width: 940px;
  padding: 1.5em;
  border-radius: 20px;
  background-color: var(--color__background-body);
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .box {
    padding: 1.5em 3em;
    border-radius: 30px;
  }
}
@media screen and (min-width: 1280px) {
  .commitments #commitments-four .box {
    width: 100%;
  }
}
.commitments #commitments-four .no-box {
  display: -ms-grid;
  display: grid;
  justify-items: center;
  grid-auto-columns: 1fr;
  row-gap: 1em;
  width: calc(100% - 2em);
  max-width: 850px;
  padding: 0 1em 2em;
  margin-inline: auto;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .no-box {
    width: 100%;
  }
}
.commitments #commitments-four .no-box:not(:last-of-type) {
  border-bottom: 1px solid #a1a1a1;
}
.commitments #commitments-four .no-box.small {
  padding: 0;
  margin-top: 1em;
  text-align: center;
}
.commitments #commitments-four .no-box.small div {
  width: 100%;
}
.commitments #commitments-four .no-box.bg-white {
  padding: 1em;
  margin-bottom: 1em;
  background-color: var(--color__background-body);
}
.commitments #commitments-four .no-box div {
  width: 100%;
}
.commitments #commitments-four .no-box .text-center {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
.commitments #commitments-four .superwall {
  display: -ms-grid;
  display: grid;
  justify-items: center;
  row-gap: 1em;
  max-width: 850px;
  padding-bottom: 2em;
  margin-inline: 1em;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .superwall {
    -ms-grid-columns: minmax(40%, 470px) 2em 1fr;
    grid-template-columns: minmax(40%, 470px) 1fr;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-column-gap: 2em;
       -moz-column-gap: 2em;
            column-gap: 2em;
  }
}
.commitments #commitments-four .superwall .grid {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 2em 1fr;
  grid-template-columns: 1fr 1fr;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-column-gap: 2em;
     -moz-column-gap: 2em;
          column-gap: 2em;
  margin-top: 1.5em;
}
@media screen and (min-width: 420px) {
  .commitments #commitments-four .superwall .grid {
    -ms-grid-columns: 124px 180px;
    grid-template-columns: 124px 180px;
  }
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .superwall .grid {
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
.commitments #commitments-four .catch {
  margin-bottom: 0.5em;
  text-align: center;
}
.commitments #commitments-four .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 380px;
  height: 47px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .btn {
    height: 62px;
  }
}
.commitments #commitments-four .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .commitments #commitments-four .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.commitments #commitments-four .tonext {
  display: -ms-grid;
  display: grid;
  justify-items: center;
}
.commitments #commitments-four .tonext span {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: inline-block;
  letter-spacing: var(--font__letter-title);
  --clamp-min: 14;
  --clamp-max: 27;
}
.commitments #commitments-four .tonext img {
  width: 25px;
  height: 25px;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .tonext img {
    width: 45px;
    height: 45px;
  }
}
.commitments #commitments-four .tomenu {
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  width: 100%;
  max-width: 1080px;
  margin: 1em auto 0;
}
.commitments #commitments-four .tomenu a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.commitments #commitments-four .tomenu span {
  margin-right: 0.5em;
  --clamp-min: 14;
  --clamp-max: 18;
}
.commitments #commitments-four .tomenu img {
  width: 25px;
  height: 25px;
}
@media screen and (min-width: 768px) {
  .commitments #commitments-four .tomenu img {
    width: 45px;
    height: 45px;
  }
}
.commitments #commitments-five .one {
  max-width: 420px;
  margin-bottom: 0;
}
.commitments #commitments-five .two {
  max-width: 790px;
}
.commitments #commitments-five .three {
  max-width: 370px;
}
.commitments .banner {
  display: block;
  width: calc(100% - 2em);
  max-width: 1230px;
  -webkit-margin-before: 2em;
          margin-block-start: 2em;
  margin-inline: auto;
  -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.6);
          box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.6);
}

/*--------------------------------------------------------------
# enquiry：お問い合わせ
--------------------------------------------------------------*/
.enquiry {
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: var(--width__page);
  margin-inline: auto;
  width: 100%;
  max-width: 880px;
  margin-bottom: var(--mb__page);
}
@media screen and (min-width: 1280px) {
  .enquiry {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.enquiry .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
}
.enquiry .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.enquiry .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.enquiry .lead {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
.enquiry .lead p:not(:last-child) {
  margin-bottom: 1em;
}
.enquiry .lead.thanks {
  width: 100%;
  max-width: 740px;
  padding: 3em 0;
  margin-inline: auto;
  background-color: #f3f3f3;
  border-radius: 20px;
  text-align: center;
  --clamp-min: 14;
  --clamp-max: 18;
}
.enquiry .must {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 5px;
  border-radius: 50%;
  background-color: #c21b2c;
}
.enquiry .note {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.enquiry .note .must {
  margin-right: 5px;
}
.enquiry p {
  margin: 0;
}
.enquiry .tobusiness {
  width: 100%;
  padding: 2em 0;
  max-width: 780px;
  margin: 2em auto 3em;
  border-top: 1px solid var(--color__border-text);
  border-bottom: 1px solid var(--color__border-text);
}
.enquiry .tobusiness .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  width: 100%;
  max-width: 500px;
  padding: 1em 0;
  margin-inline: auto;
  border-width: 1px;
  border-style: solid;
  border-radius: 10px;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__background-contact);
  border-color: var(--color__border-accent);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  --clamp-min: 16;
  --clamp-max: 20;
}
.enquiry .tobusiness .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 9px;
  height: 16px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(img/contact/tobusiness_arrow.svg);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
@media screen and (min-width: 420px) {
  .enquiry .tobusiness .btn br {
    display: none;
  }
}
@media (any-hover: hover) {
  .enquiry .tobusiness .btn:hover {
    background-color: var(--color__btn-background-hover);
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
  }
}
.enquiry form {
  margin-inline: auto;
  --clamp-min: 16;
  --clamp-max: 18;
}
.enquiry form .form_item {
  display: -ms-grid;
  display: grid;
  grid-auto-columns: auto;
  row-gap: 0.5em;
  width: 100%;
  padding: 1.5em 0;
  margin: 0;
  border-bottom: 1px solid var(--color__border-input);
}
@media screen and (min-width: 768px) {
  .enquiry form .form_item {
    -ms-grid-columns: 300px 2em minmax(auto, 580px);
    grid-template-columns: 300px minmax(auto, 580px);
    row-gap: 0;
    -webkit-column-gap: 2em;
       -moz-column-gap: 2em;
            column-gap: 2em;
    padding: 0;
  }
}
.enquiry form dt {
  font-weight: var(--font__weight-bold);
}
@media screen and (min-width: 768px) {
  .enquiry form dt {
    padding: 1.5em 0;
  }
}
.enquiry form dt p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
}
.enquiry form dt .attention {
  font-weight: var(--font__weight-demibold);
  color: #c21b2c;
  letter-spacing: 0;
  line-height: 1.2;
  --clamp-min: 12;
  --clamp-max: 15;
}
@media screen and (min-width: 768px) {
  .enquiry form dd {
    padding: 1.5em 0;
  }
}
.enquiry form dd p {
  display: -ms-grid;
  display: grid;
  row-gap: 0.5em;
}
.enquiry form dd select,
.enquiry form dd input:not([type=checkbox]) {
  width: 100%;
  height: 42px;
  padding-inline: 1em;
  border: 1px solid var(--color__border-input);
}
.enquiry form dd input[type=checkbox] {
  width: 20px;
  height: 20px;
  border: 1px solid var(--color__border-input);
  -webkit-appearance: auto;
     -moz-appearance: auto;
          appearance: auto;
}
.enquiry form dd textarea {
  width: 100%;
  height: 210px;
  padding: 0.5em 1em;
  border: 1px solid var(--color__border-input);
}
.enquiry form dd .postcode p {
  display: -ms-grid;
  display: grid;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-grid-columns: auto 0.5em 200px;
  grid-template-columns: auto 200px;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 0.5em;
}
.enquiry form dd .prefectures {
  position: relative;
  width: 140px;
  background-image: url(img/contact/select_arrow.svg);
  background-position: right 1em center;
  background-repeat: no-repeat;
  background-size: 14px 7px;
}
.enquiry form dd .phone {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(auto, 150px) 5px 10px 5px minmax(auto, 150px) 5px 10px 5px minmax(auto, 150px);
  grid-template-columns: minmax(auto, 150px) 10px minmax(auto, 150px) 10px minmax(auto, 150px);
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 5px;
     -moz-column-gap: 5px;
          column-gap: 5px;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
.enquiry form dd .phone .hyphen {
  display: block;
  width: 100%;
  height: 1px;
  background-color: var(--color__border-text);
}
.enquiry form dd.subject .wpcf7-form-control {
  display: -ms-grid;
  display: grid;
  row-gap: 0.5em;
}
.enquiry form dd.subject .wpcf7-list-item {
  margin: 0;
}
.enquiry form dd.subject label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
}
.enquiry form dd ::-webkit-input-placeholder {
  color: #8a8a8a;
}
.enquiry form dd ::-moz-placeholder {
  color: #8a8a8a;
}
.enquiry form dd :-ms-input-placeholder {
  color: #8a8a8a;
}
.enquiry form dd ::-ms-input-placeholder {
  color: #8a8a8a;
}
.enquiry form dd ::placeholder {
  color: #8a8a8a;
}
.enquiry form .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 220px;
  height: 41px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 2em;
}
@media screen and (min-width: 768px) {
  .enquiry form .btn {
    height: 56px;
  }
}
.enquiry form .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .enquiry form .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .enquiry form .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.enquiry form .btn::after {
  display: none;
}
.enquiry form .btn.gray {
  background-color: #808080;
  border-color: #808080;
  color: var(--color__white);
}
@media (any-hover: hover) {
  .enquiry form .btn.gray:hover {
    background-color: var(--color__white);
    color: #808080;
  }
}
.enquiry form .wpcf7-not-valid-tip {
  position: absolute;
  left: 0;
  z-index: 1;
  width: 100%;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  padding: 5px;
  background-color: #c21b2c;
  color: var(--color__white);
  font-weight: inherit;
  line-height: 1;
  font-size: 12px;
}
.enquiry form .wpcf7-not-valid-tip::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 0;
  right: 0;
  margin-inline: auto;
  width: 15px;
  height: 12.9903810568px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  background-color: #c21b2c;
}
.enquiry form .wpcf7-spinner {
  display: none;
}
.enquiry form .wpcf7-response-output {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  padding: 0;
  margin-bottom: 0;
  border: none;
  color: #c21b2c;
}
.enquiry form .confirm .form_item {
  padding: 1em;
}
.enquiry form .confirm .form_item:nth-child(odd) {
  background-color: #f3f3f3;
}
.enquiry form .confirm .form_item:first-child {
  border-top: 1px solid var(--color__border-input);
}
@media screen and (min-width: 768px) {
  .enquiry form .confirm .form_item {
    padding: 0;
  }
  .enquiry form .confirm .form_item dt {
    display: -ms-grid;
    display: grid;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: end;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: 100%;
    padding-right: 2em;
    border-right: 1px solid var(--color__border-input);
  }
}
@media screen and (min-width: 768px) {
  .enquiry form .confirm .form_item dd {
    padding-right: 2em;
  }
}
.enquiry form .confirm .form_item dd .phone {
  -ms-grid-columns: -webkit-max-content 10px -webkit-max-content 10px -webkit-max-content;
  -ms-grid-columns: max-content 10px max-content 10px max-content;
  grid-template-columns: -webkit-max-content 10px -webkit-max-content 10px -webkit-max-content;
  grid-template-columns: max-content 10px max-content 10px max-content;
}
@media screen and (min-width: 768px) {
  .enquiry form .btns p {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-column-gap: 2em;
       -moz-column-gap: 2em;
            column-gap: 2em;
  }
  .enquiry form .btns p .btn {
    margin-inline: 0;
  }
}
.enquiry form .attention {
  --clamp-min: 12;
  --clamp-max: 14;
  text-align: center;
}

/*--------------------------------------------------------------
# staff：スタッフ紹介
--------------------------------------------------------------*/
.staff {
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  --clamp-min: 14;
  --clamp-max: 18;
  margin-bottom: var(--mb__page);
}
@media screen and (min-width: 1280px) {
  .staff {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.staff .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
}
.staff .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.staff .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.staff .lead {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
.staff .staff_list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 10px 1fr;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-top: 2.5em;
}
@media screen and (min-width: 420px) {
  .staff .staff_list {
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (min-width: 768px) {
  .staff .staff_list {
    -ms-grid-columns: 1fr 20px 1fr 20px 1fr 20px 1fr;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
  }
}
@media screen and (min-width: 1280px) {
  .staff .staff_list {
    -ms-grid-columns: (1fr)[5];
    grid-template-columns: repeat(5, 1fr);
  }
}
.staff .staff_item {
  position: relative;
}
.staff .staff_item .image_small {
  margin-bottom: 0.5em;
  aspect-ratio: 1;
}
@media screen and (min-width: 768px) {
  .staff .staff_item .image_small {
    margin-bottom: 1em;
  }
}
.staff .staff_item .image_small img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 20px;
}
.staff .staff_item .info {
  text-align: center;
}
.staff .staff_item .info p {
  line-height: 1;
}
.staff .staff_item .info h2 {
  font-weight: var(--font__weight-demibold);
}
@media (any-hover: hover) {
  .staff .staff_item:hover {
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }
}
@media (any-hover: hover) and (any-hover: hover) {
  .staff .staff_item:hover:hover {
    opacity: 0.5;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }
}
.staff .dialog_open {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  border-radius: 20px 20px 0 0;
}
.staff dialog {
  --duration: 0.5s;
  width: min(90%, var(--width__section));
  height: 80%;
  margin: auto;
  background-color: var(--color__background-body);
  -webkit-transition: opacity var(--duration), scale var(--duration);
  transition: opacity var(--duration), scale var(--duration);
  contain: strict;
  max-width: 860px;
  -webkit-box-shadow: 7px 7px 5px rgba(0, 0, 0, 0.57);
          box-shadow: 7px 7px 5px rgba(0, 0, 0, 0.57);
  border-radius: 30px;
  border: 1px solid #727171;
}
.staff dialog:not([data-active=true]) {
  opacity: 0;
  scale: 0.95;
}
.staff dialog::-ms-backdrop {
  backdrop-filter: blur(4px);
  -ms-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.staff dialog::backdrop {
  backdrop-filter: blur(4px);
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.staff dialog:not([data-active=true])::-ms-backdrop {
  opacity: 0;
}
.staff dialog:not([data-active=true])::backdrop {
  opacity: 0;
}
.staff dialog .dialog_content {
  height: 100%;
  overflow: auto;
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
}
.staff dialog .dialog_close {
  position: absolute;
  right: 1.5rem;
  top: 1.5rem;
  display: inline-block;
  width: 45px;
  height: 45px;
}
.staff dialog .dialog_close:focus {
  outline: none;
}
.staff dialog .dialog_close .icon_close {
  position: absolute;
  inset: 0;
  width: 100%;
  block-size: 1px;
  margin: auto;
  background-color: transparent;
}
.staff dialog .dialog_close .icon_close::after, .staff dialog .dialog_close .icon_close::before {
  content: "";
  width: 100%;
  background-color: var(--color__background-text);
  -webkit-transition: rotate 0.3s;
  transition: rotate 0.3s;
}
.staff dialog .dialog_close .icon_close::before {
  rotate: 45deg;
}
.staff dialog .dialog_close .icon_close::after {
  rotate: -45deg;
}
@media (any-hover: hover) {
  .staff dialog .dialog_close:hover .icon_close::before, .staff dialog .dialog_close:hover .icon_close::after {
    rotate: 0deg;
  }
}
.staff .dialog_content {
  padding: 3em 2em;
}
@media screen and (min-width: 768px) {
  .staff .dialog_content {
    display: -ms-grid;
    display: grid;
        grid-template-areas: "left right" "bottom bottom";
    -ms-grid-columns: 300px 2em 1fr;
    grid-template-columns: 300px 1fr;
    -ms-grid-rows: auto 0.5em 1fr;
    grid-template-rows: auto 1fr;
    gap: 0.5em 2em;
    padding-block: 3em;
  }
  .staff .dialog_content > .left {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
  }
  .staff .dialog_content > .right {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 3;
  }
}
.staff .dialog_content .left {
  width: 100%;
  aspect-ratio: 1;
  margin-bottom: 1rem;
}
@media screen and (min-width: 768px) {
  .staff .dialog_content .left {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    grid-area: left;
    aspect-ratio: 2/2.5;
    margin-bottom: 0;
  }
}
.staff .dialog_content .left img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.staff .dialog_content .right {
  grid-area: right;
}
.staff .dialog_content .right .name {
  padding: 0 1rem 0.5rem;
  --clamp-min: 18;
  --clamp-max: 21;
  border-bottom: 1px dashed var(--color__border-text);
}
.staff .dialog_content .right .name .post {
  margin-left: 0.5em;
}
.staff .dialog_content .right dl div {
  padding: 1rem;
  border-bottom: 1px dashed var(--color__border-text);
}
.staff .dialog_content .right dl .flex {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.staff .dialog_content .right dl dt {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.staff .dialog_content .bottom {
  grid-area: bottom;
}
@media screen and (min-width: 1280px){
  .blog .page_title {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .blog .sidebar {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .blog .all {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .blog .single {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .about .about_concept .contents {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .about .about_concept > .contents {
    -ms-grid-row: 2;
    -ms-grid-row-span: 3;
    -ms-grid-column: 2;
  }
  .about .about_concept .sec_title {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .about .about_concept > .sec_title {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
    -ms-grid-column-span: 1;
  }
  .about .about_concept .left {
    -ms-grid-row: 2;
    -ms-grid-row-span: 3;
    -ms-grid-column: 1;
  }
  .about .about_concept .right {
    -ms-grid-row: 1;
    -ms-grid-row-span: 4;
    -ms-grid-column: 3;
  }
  .staff .dialog_content .left {
    -ms-grid-row: 2;
    -ms-grid-row-span: 3;
    -ms-grid-column: 1;
  }
  .staff .dialog_content .right {
    -ms-grid-row: 1;
    -ms-grid-row-span: 4;
    -ms-grid-column: 3;
  }
}
@media screen and (min-width: 768px){
  .staff .dialog_content > .left {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 1;
  }
  .staff .dialog_content > .right {
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    -ms-grid-column: 3;
  }
  .staff .dialog_content .bottom {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 3;
  }
}
.staff .dialog_content .bottom dt,
.staff .dialog_content .bottom dd {
  padding: 1rem;
}
.staff .dialog_content .bottom dt {
  -ms-flex-negative: 1;
      flex-shrink: 1;
  border-bottom: 1px dashed var(--color__border-text);
  --clamp-min: 18;
  --clamp-max: 21;
}
.staff .dialog_content .bottom .link {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0.5rem 1rem;
  border-top: 1px dashed var(--color__border-text);
  border-bottom: 1px dashed var(--color__border-text);
  font-weight: var(--font__weight-bold);
}
.staff .dialog_content .bottom .link::after {
  content: "";
  display: inline-block;
  width: 10px;
  height: 21px;
  margin-left: 2rem;
  background-image: url(img/staff/link_arrow.svg);
  background-repeat: no-repeat;
  background-size: contain;
}

/*--------------------------------------------------------------
# voice：お客様の声
--------------------------------------------------------------*/
/* voice一覧・詳細共通
--------------------------------------------- */
.voice {
  --clamp-min: 14;
  --clamp-max: 18;
  padding-bottom: var(--mb__page);
  background-color: var(--color__background-section);
}
.voice dialog {
  --duration: 0.5s;
  width: min(90%, var(--width__section));
  height: 80%;
  margin: auto;
  background-color: var(--color__background-body);
  -webkit-transition: opacity var(--duration), scale var(--duration);
  transition: opacity var(--duration), scale var(--duration);
  contain: strict;
}
.voice dialog:not([data-active=true]) {
  opacity: 0;
  scale: 0.95;
}
.voice dialog::-ms-backdrop {
  backdrop-filter: blur(4px);
  -ms-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.voice dialog::backdrop {
  backdrop-filter: blur(4px);
  -webkit-transition: opacity 0.5s;
  transition: opacity 0.5s;
}
.voice dialog:not([data-active=true])::-ms-backdrop {
  opacity: 0;
}
.voice dialog:not([data-active=true])::backdrop {
  opacity: 0;
}
.voice dialog .dialog_content {
  height: 100%;
  overflow: auto;
  -ms-scroll-chaining: none;
      overscroll-behavior: contain;
}
.voice dialog .modal_close {
  position: absolute;
  right: 1.5rem;
  top: 1.5rem;
  display: inline-block;
  width: 45px;
  height: 45px;
}
.voice dialog .modal_close:focus {
  outline: none;
}
.voice dialog .modal_close .icon_close {
  position: absolute;
  inset: 0;
  width: 100%;
  block-size: 1px;
  margin: auto;
  background-color: transparent;
}
.voice dialog .modal_close .icon_close::after, .voice dialog .modal_close .icon_close::before {
  content: "";
  width: 100%;
  background-color: var(--color__background-body);
  -webkit-transition: rotate 0.3s;
  transition: rotate 0.3s;
}
.voice dialog .modal_close .icon_close::before {
  rotate: 45deg;
}
.voice dialog .modal_close .icon_close::after {
  rotate: -45deg;
}
@media (any-hover: hover) {
  .voice dialog .modal_close:hover .icon_close::before, .voice dialog .modal_close:hover .icon_close::after {
    rotate: 0deg;
  }
}
.voice dialog .dialog_content {
  background-color: var(--color__background-section);
}
.voice dialog .dialog_content h1 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  padding-block: 1.5em 1em;
  margin: 0;
  background-color: var(--color__background-accent);
  text-align: center;
  color: var(--color__white);
  font-weight: var(--font__weight-regular);
  --clamp-min: 20;
  --clamp-max: 32;
}
@media screen and (min-width: 768px) {
  .voice dialog .dialog_content h1 br {
    display: none;
  }
}
.voice dialog .dialog_content .outer {
  padding: 1em;
}
@media screen and (min-width: 768px) {
  .voice dialog .dialog_content .outer {
    padding: 1em 2em 3em;
  }
}
@media screen and (min-width: 1280px) {
  .voice dialog .dialog_content .outer {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 400px 1fr;
    grid-template-columns: 400px 1fr;
        grid-template-areas: "img text" "cta cta";
  }
  .about .about_concept .text {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
}
.voice dialog .dialog_content .outer > img {
  display: none;
}
@media screen and (min-width: 1280px) {
  .voice dialog .dialog_content .outer > img {
    display: block;
  }
}
@media screen and (min-width: 1280px) {
  .voice dialog .dialog_content .outer .flow_list {
    margin-top: 2em;
  }
}
.voice dialog .dialog_content .outer .flow_item .number {
  width: 100%;
  padding: 1em;
}
@media screen and (min-width: 768px) {
  .voice dialog .dialog_content .outer .flow_item .number {
    display: -ms-grid;
    display: grid;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
        grid-template-areas: "img text";
    -ms-grid-columns: 40px 1em 1fr;
    grid-template-columns: 40px 1fr;
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
  }
  .voice dialog .dialog_content .outer .flow_item .number > .text {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
}
.voice dialog .dialog_content .outer .flow_item .number img {
  width: auto;
  height: 40px;
}
@media screen and (min-width: 768px) {
  .voice dialog .dialog_content .outer .flow_item .number img {
    grid-area: img;
  }
}
.voice dialog .dialog_content .outer .flow_item .number h2,
.voice dialog .dialog_content .outer .flow_item .number p {
  margin: 0;
}
.voice dialog .dialog_content .outer .flow_item .number h2 {
  --clamp-min: 20;
  --clamp-max: 21;
  font-weight: var(--font__weight-extrabold);
}
.voice dialog .dialog_content .outer .flow_item .number .text {
  grid-area: text;
}
.voice dialog .dialog_content .outer .flow_item .number:not(:last-of-type) {
  border-bottom: 1px dashed var(--color__border-text);
}
.voice dialog .dialog_content .outer .flow_item:not(:last-of-type):after {
  content: "";
  display: block;
  width: 49px;
  height: 42px;
  margin-inline: auto;
  background-image: url(img/voice/flow_arrow.svg);
  background-repeat: no-repeat;
  background-size: contain;
}
.voice dialog .dialog_content .outer .cta {
  grid-area: cta;
  text-align: center;
}
.voice dialog .dialog_content .outer .cta p {
  color: var(--color__accent);
  font-weight: var(--font__weight-extrabold);
  --clamp-min: 20;
  --clamp-max: 21;
}
.voice dialog .dialog_content .outer .cta .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 480px;
  height: 47px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 0.5em;
}
@media screen and (min-width: 768px) {
  .voice dialog .dialog_content .outer .cta .btn {
    height: 62px;
  }
}
.voice dialog .dialog_content .outer .cta .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .voice dialog .dialog_content .outer .cta .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .voice dialog .dialog_content .outer .cta .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.voice .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 460px;
  height: 47px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 2em auto 0;
}
@media screen and (min-width: 768px) {
  .voice .btn {
    height: 62px;
  }
}
.voice .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .voice .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .voice .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.voice .related {
  margin-top: 5em;
}
.voice .related a:not(.back) {
  position: relative;
}
.voice .related a:not(.back)::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background-color: var(--color__background-text);
  opacity: 0;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
@media (any-hover: hover) {
  .voice .related a:not(.back):hover {
    opacity: 1;
  }
  .voice .related a:not(.back):hover::before {
    opacity: 0.65;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }
  .voice .related a:not(.back):hover p {
    opacity: 1;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
  }
}
.voice .related p {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 100%;
  padding-inline: 2em;
  height: 100%;
  margin: 0;
  color: var(--color__white);
  --clamp-min: 14;
  --clamp-max: 19;
  word-break: keep-all;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
}
.voice .related .back {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.5em 1em;
  margin-inline: auto;
  margin-top: 1em;
  border: 1px solid var(--color__border-accent);
  background-color: var(--color__background-body);
  -webkit-box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
          box-shadow: 6px 6px 1px rgba(4, 0, 0, 0.2);
  color: var(--color__accent);
}
.voice .related .back img {
  width: 100%;
  max-width: 180px;
}

/* voice一覧
--------------------------------------------- */
.voice .all {
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  position: relative;
}
@media screen and (min-width: 1280px) {
  .voice .all {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.voice .all > header {
  position: relative;
  z-index: 1;
  padding-top: 1em;
}
@media screen and (min-width: 768px) {
  .voice .all > header {
    padding-top: 3em;
  }
}
.voice .all > header .bg_left,
.voice .all > header .bg_right {
  position: absolute;
  top: 0;
  z-index: 0;
  width: 30%;
  max-width: 340px;
}
.voice .all > header .bg_left {
  left: 0;
}
@media screen and (min-width: 768px) {
  .voice .all > header .bg_left {
    left: 3%;
  }
}
.voice .all > header .bg_right {
  right: 0;
}
@media screen and (min-width: 768px) {
  .voice .all > header .bg_right {
    right: 3%;
  }
}
.voice .all > header::before, .voice .all > header::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset-inline: 0;
  display: block;
  width: 100%;
  max-width: 1140px;
  margin: auto;
  background-color: #d2cabd;
}
.voice .all > header::before {
  top: 0;
  height: 50%;
  clip-path: polygon(32% 0%, 68% 0%, 100% 100%, 0% 100%);
}
@media screen and (min-width: 768px) {
  .voice .all > header::before {
    height: 60%;
    clip-path: polygon(38% 0%, 62% 0%, 100% 100%, 0% 100%);
  }
}
.voice .all > header::after {
  bottom: 0;
  height: 50%;
}
@media screen and (min-width: 768px) {
  .voice .all > header::after {
    height: 40%;
  }
}
.voice .all .not-found {
  width: 100%;
  max-width: 1140px;
  padding: 2em 1em;
  margin-top: 0;
  margin-inline: auto;
  background-color: #d2cabd;
}
.voice .all .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  position: relative;
  z-index: 1;
  text-align: center;
  --clamp-min: 12;
  --clamp-max: 16;
}
.voice .all .page_title img {
  max-width: 220px;
}
@media screen and (min-width: 420px) {
  .voice .all .page_title img {
    max-width: 300px;
  }
}
@media screen and (min-width: 768px) {
  .voice .all .page_title img {
    max-width: 400px;
  }
}
.voice .all .page_title h1 {
  font-weight: var(--font__weight-regular);
}
.voice .all .lead {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  padding-inline: 1em;
  margin-bottom: 0;
}
.voice .all .lead br {
  display: none;
}
@media screen and (min-width: 768px) {
  .voice .all .lead br {
    display: inline;
  }
}
.voice .all .content {
  width: 100%;
  max-width: 1140px;
  padding: 2em 1em;
  margin-inline: auto;
  background-color: #d2cabd;
}
@media screen and (min-width: 768px) {
  .voice .all .content {
    padding: 3em;
  }
}
.voice .all .cat_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  max-width: 1140px;
  padding-top: 2em;
  margin-inline: auto;
  background-color: #d2cabd;
  --clamp-min: 14;
  --clamp-max: 15;
}
.voice .all .cat_list a {
  display: block;
  height: 100%;
  padding-inline: 0.5em;
  border-bottom: 1px solid var(--color__border-text);
}
.voice .all .cat_list a.current {
  --color__gray: #785e5b;
  border-color: var(--color__gray);
  color: var(--color__gray);
}
@media (any-hover: hover) {
  .voice .all .cat_list a:hover {
    border-bottom: none;
  }
}
.voice .all .cat_list.wide {
  letter-spacing: 0.5em;
}
.voice .all .cat_list.wide a {
  padding-right: 0;
}
.voice .all .article_outer {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: repeat(1, 1fr);
  gap: 1em;
}
@media screen and (min-width: 420px) {
  .voice .all .article_outer {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 768px) {
  .voice .all .article_outer {
    gap: 2em;
  }
}
.voice .all article {
  position: relative;
}
.voice .all article .info {
  background-color: var(--color__background-body);
}
.voice .all article .info p,
.voice .all article .info h2 {
  margin: 0;
}
.voice .all article .info h2 {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 1em;
  padding-top: 1em;
  font-weight: var(--font__weight-demibold);
}
@media screen and (min-width: 768px) {
  .voice .all article .info h2 {
    word-break: keep-all;
  }
}
.voice .all article .info .cat_item {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0 0.5em;
  margin: 0 0.5em 0.5em auto;
  color: var(--color__white);
  --clamp-min: 12;
  --clamp-max: 14;
}
.voice .all article .info .cat_item.new {
  background-color: #a19885;
}
.voice .all article .info .cat_item.renova {
  background-color: #505f60;
}
.voice .all article .info .more {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  --clamp-min: 14;
  --clamp-max: 14;
  padding: 0.5em;
  border-top: 1px dotted #808080;
  line-height: 1;
}
.voice .all article .info .more img {
  width: 9px;
  height: 19px;
}
.voice .all .pagination {
  margin-top: 3em;
}
.voice .all .pagination .nav-links {
  --clamp-min: 14;
  --clamp-max: 18;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  font-weight: var(--font__weight-regular);
}
.voice .all .pagination .prev,
.voice .all .pagination .next {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 12px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: contain;
}
.voice .all .pagination .prev {
  background-image: url(img/pagination_all-prev.png);
}
.voice .all .pagination .next {
  background-image: url(img/pagination_all-next.png);
}
.voice .all .pagination .page-numbers {
  color: #848484;
}
.voice .all .pagination .current {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 30px;
  height: 30px;
  background-color: var(--color__background-pagination);
  border-radius: 50%;
  color: var(--color__accent);
}
.voice .all .pagination .dot {
  color: #848484;
}

/* voice詳細
--------------------------------------------- */
.voice .single {
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
}
@media screen and (min-width: 1280px) {
  .voice .single {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.voice .single .entry_header {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2em 1fr 2em;
  grid-template-columns: 2em 1fr 2em;
  -ms-grid-rows: 1fr 2em auto;
  grid-template-rows: 1fr 2em auto;
  width: 100%;
  margin-bottom: 1em;
}
.voice .single .entry_header > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.voice .single .entry_header > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 2;
}
.voice .single .entry_header > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.voice .single .entry_header > *:nth-child(4) {
  -ms-grid-row: 2;
  -ms-grid-column: 1;
}
.voice .single .entry_header > *:nth-child(5) {
  -ms-grid-row: 2;
  -ms-grid-column: 2;
}
.voice .single .entry_header > *:nth-child(6) {
  -ms-grid-row: 2;
  -ms-grid-column: 3;
}
.voice .single .entry_header > *:nth-child(7) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.voice .single .entry_header > *:nth-child(8) {
  -ms-grid-row: 3;
  -ms-grid-column: 2;
}
.voice .single .entry_header > *:nth-child(9) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
@media screen and (min-width: 768px) {
  .voice .single .entry_header {
    -ms-grid-columns: 2em auto auto;
    grid-template-columns: 2em auto auto;
    -ms-grid-rows: 1fr 5em auto;
    grid-template-rows: 1fr 5em auto;
  }
  .voice .single .entry_header > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .voice .single .entry_header > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .voice .single .entry_header > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .voice .single .entry_header > *:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .voice .single .entry_header > *:nth-child(5) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .voice .single .entry_header > *:nth-child(6) {
    -ms-grid-row: 2;
    -ms-grid-column: 3;
  }
  .voice .single .entry_header > *:nth-child(7) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .voice .single .entry_header > *:nth-child(8) {
    -ms-grid-row: 3;
    -ms-grid-column: 2;
  }
  .voice .single .entry_header > *:nth-child(9) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
}
.voice .single .entry_header p,
.voice .single .entry_header h1 {
  margin: 0;
}
.voice .single .entry_header .eyecatch {
  -ms-grid-column: 2;
  -ms-grid-column-span: 2;
  grid-column: 2/4;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
}
.voice .single .entry_header .entry_meta {
  -ms-grid-column: 1;
      grid-column-start: 1;
  grid-column: 1/3;
  -ms-grid-row: 2;
  -ms-grid-row-span: 2;
  grid-row: 2/4;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 1em;
  -webkit-box-shadow: 6px 6px 1px rgba(0, 0, 0, 0.2);
          box-shadow: 6px 6px 1px rgba(0, 0, 0, 0.2);
}
@media screen and (min-width: 768px) {
  .voice .single .entry_header .entry_meta {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 240px 500px;
    grid-template-columns: 240px 500px;
  }
}
.voice .single .entry_header .entry_meta .left {
  display: -ms-grid;
  display: grid;
  place-content: center;
  padding: 1em;
  background-color: var(--color__background-accent);
  color: var(--color__white);
  text-align: center;
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .voice .single .entry_header .entry_meta .left {
    padding: 0;
  }
}
.voice .single .entry_header .entry_meta .left img {
  max-width: 140px;
}
@media screen and (min-width: 768px) {
  .voice .single .entry_header .entry_meta .left img {
    max-width: 184px;
  }
}
.voice .single .entry_header .entry_meta .right {
  display: -ms-grid;
  display: grid;
  padding: 1em;
  background-color: var(--color__background-body);
}
@media screen and (min-width: 768px) {
  .voice .single .entry_header .entry_meta .right {
    padding: 1.5em 2em;
  }
}
.voice .single .entry_header .entry_meta .right .entry_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.voice .single .entry_header .entry_meta .right .entry_info p:not([class]) {
  color: var(--color__accent);
  --clamp-min: 16;
  --clamp-max: 24;
}
.voice .single .entry_header .entry_meta .right .entry_info .entry_cat {
  display: inline-block;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  margin-left: 1em;
  color: var(--color__white);
  line-height: 1;
  --clamp-min: 12;
  --clamp-max: 14;
}
.voice .single .entry_header .entry_meta .right .entry_info .entry_cat.new {
  padding: 0.5em 0.5em 0.5em 1em;
  background-color: #a19885;
  letter-spacing: 0.5em;
}
.voice .single .entry_header .entry_meta .right .entry_info .entry_cat.renova {
  padding: 0.5em 1em;
  background-color: #505f60;
}
.voice .single .entry_header .entry_meta .right .entry_title {
  font-weight: var(--font__weight-demibold);
  --clamp-min: 16;
  --clamp-max: 24;
}
@media screen and (min-width: 768px) {
  .voice .single .entry_header .entry_meta .right .entry_title {
    word-break: keep-all;
  }
}
.voice .single .entry_content {
  width: 100%;
  max-width: 800px;
  margin-inline: auto;
}
.voice .single .entry_content .entry_intro {
  display: -ms-grid;
  display: grid;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-column-gap: 1.5em;
     -moz-column-gap: 1.5em;
          column-gap: 1.5em;
  padding-top: 1em;
  margin-bottom: 2em;
  border-top: 1px dashed var(--color__border-accent);
  border-bottom: 1px dashed var(--color__border-accent);
  color: var(--color__accent);
}
.voice .single .entry_content .entry_intro br {
  display: none;
}
@media screen and (min-width: 768px) {
  .voice .single .entry_content .entry_intro {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-grid-columns: 90px 1fr;
    grid-template-columns: 90px 1fr;
    padding-top: 0;
  }
  .voice .single .entry_content .entry_intro br {
    display: inline;
  }
}
.voice .single .entry_content .entry_intro > img {
  -ms-grid-column-align: center;
      justify-self: center;
  width: 90px;
}
.voice .single .entry_content h2 {
  display: inline-block;
  border-bottom: 1px solid var(--color__border-text);
  font-weight: var(--font__weight-demibold);
  --clamp-min: 20;
  --clamp-max: 25;
}
.voice .single .entry_content h3 {
  font-weight: var(--font__weight-demibold);
  --clamp-min: 18;
  --clamp-max: 21;
}
.voice .single .entry_content p {
  text-align: justify;
}
.voice .single .entry_content ul,
.voice .single .entry_content ol {
  padding-left: 2em;
}
.voice .single .entry_content ul li,
.voice .single .entry_content ol li {
  text-indent: -1em;
}
.voice .single .entry_footer {
  width: 100%;
  max-width: 800px;
  margin-inline: auto;
}
.voice .single .entry_family {
  display: -ms-grid;
  display: grid;
  margin-top: 3em;
}
@media screen and (min-width: 768px) {
  .voice .single .entry_family {
    -ms-grid-columns: 440px 1fr;
    grid-template-columns: 440px 1fr;
  }
}
.voice .single .entry_family > dl {
  display: -ms-grid;
  display: grid;
  -ms-flex-line-pack: center;
      align-content: center;
  row-gap: 1em;
  height: 100%;
  padding: 2.5em;
  margin: 0;
  background-color: var(--color__background-body);
}
@media screen and (min-width: 768px) {
  .voice .single .entry_family > dl {
    padding-block: 0;
  }
}
.voice .single .entry_family > dl div {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 100px 0.5em auto;
  grid-template-columns: 100px auto;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
  border-bottom: 1px dashed var(--color__border-text);
}
.voice .single .entry_family > dl dt {
  font-weight: var(--font__weight-demibold);
}

/*--------------------------------------------------------------
# real-estate：不動産
--------------------------------------------------------------*/
.real-estate {
  margin-bottom: var(--mb__page);
  /* header
  --------------------------------------------- */
  /* コンテンツ（all：一覧 / single:共通）
  --------------------------------------------- */
  /* コンテンツ（all：一覧）
  --------------------------------------------- */
  /* コンテンツ（single：詳細）
  --------------------------------------------- */
}
.real-estate .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
  margin-top: 2.25em;
}
.real-estate .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.real-estate .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.real-estate .cat_list {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.5em;
  padding: 0 1em;
}
.real-estate .cat_item {
  display: block;
  padding: 0 1em;
  background-color: var(--color__background-body);
  border: 1px solid var(--color__border-text);
  --clamp-min: 14;
  --clamp-max: 17;
}
.real-estate .cat_item.current {
  background-color: var(--color__background-part);
}
.real-estate .all .content,
.real-estate .single .content {
  padding-left: 1em;
  padding-right: 1em;
  margin-top: 3em;
}
@media screen and (min-width: 1280px) {
  .real-estate .all .content,
  .real-estate .single .content {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.real-estate .all .content {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  gap: 2em;
}
@media screen and (min-width: 420px) {
  .real-estate .all .content {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 768px) {
  .real-estate .all .content {
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3, 1fr);
  }
}
.real-estate .all .content article {
  padding: 1em;
}
.real-estate .all .content article:hover {
  background-color: #f0efed;
}
.real-estate .all .content article a:hover {
  opacity: 1;
}
.real-estate .all .content article p {
  margin: 0;
}
.real-estate .all .content article .meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-block: 0.5em;
  font-weight: var(--font__weight-regular);
  --clamp-min: 14;
  --clamp-max: 16;
}
.real-estate .all .content article .meta .cat_item {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0 0.5em;
  --clamp-min: 12;
  --clamp-max: 16;
}
.real-estate .all .content article .title {
  margin: 0;
  font-weight: var(--font__weight-demibold);
  --clamp-min: 16;
  --clamp-max: 21;
}
.real-estate .all .content article .info_list {
  margin-top: 0.5em;
  font-weight: var(--font__weight-regular);
  text-align: center;
}
.real-estate .all .content article .info_list li {
  border-bottom: 2px dotted var(--color__text);
}
.real-estate .all .content article .info_list li .price {
  color: #005b6a;
  font-weight: var(--font__weight-bold);
}
.real-estate .all .pagination {
  margin-top: 3em;
}
.real-estate .all .pagination .nav-links {
  --clamp-min: 14;
  --clamp-max: 18;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  font-weight: var(--font__weight-regular);
}
.real-estate .all .pagination .prev,
.real-estate .all .pagination .next {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 12px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: contain;
}
.real-estate .all .pagination .prev {
  background-image: url(img/pagination_all-prev.png);
}
.real-estate .all .pagination .next {
  background-image: url(img/pagination_all-next.png);
}
.real-estate .all .pagination .page-numbers {
  color: #848484;
}
.real-estate .all .pagination .current {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 30px;
  height: 30px;
  background-color: var(--color__background-pagination);
  border-radius: 50%;
  color: var(--color__accent);
}
.real-estate .all .pagination .dot {
  color: #848484;
}
.real-estate .single .content {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  --clamp-min: 14;
  --clamp-max: 18;
}
.real-estate .single .content .entry_meta {
  width: 100%;
  max-width: 740px;
  margin: 2em auto 2em;
}
.real-estate .single .content .entry_meta::before {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  content: "不動産情報";
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 0.5em;
  margin: 0 auto 0.5em;
  border-bottom: 1px solid var(--color__border-text);
  letter-spacing: var(--font__letter-title);
}
.real-estate .single .content .entry_meta h1 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  margin: 0;
  --clamp-min: 18;
  --clamp-max: 25;
  letter-spacing: var(--font__letter-title);
}
.real-estate .single .content .entry_meta .tag_list {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
  gap: 0.5em;
  padding-top: 0.5em;
}
.real-estate .single .content .entry_meta .tag_list .tag_item {
  display: block;
  padding: 0 1em;
  border: 1px solid var(--color__border-text);
  --clamp-min: 12;
  --clamp-max: 14;
}
.real-estate .single .content .entry_content {
  max-width: 740px;
  margin-inline: auto;
}
.real-estate .single .content .entry_content .entry_info {
  display: -ms-grid;
  display: grid;
  place-content: center;
  padding: 1em 0;
  border-top: 1px solid var(--color__border-text);
  border-bottom: 1px solid var(--color__border-text);
}
.real-estate .single .content .entry_content .entry_info p {
  margin: 0;
}
.real-estate .single .content .entry_content .entry_info .school {
  display: block;
  padding-left: 1em;
  white-space: pre-line;
}
.real-estate .single .content .entry_content h2,
.real-estate .single .content .entry_content h3,
.real-estate .single .content .entry_content p {
  max-width: 810px;
  margin-inline: auto;
}
.real-estate .single .content .entry_content img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 1000px;
  margin-block: 2em;
  margin-inline: auto;
}
.real-estate .single .content .btn.back {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 320px;
  height: 41px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 3em;
  width: calc(100% - 2em);
  background-color: #d7d4cc;
  border-color: transparent;
  color: var(--color__accent);
}
@media screen and (min-width: 768px) {
  .real-estate .single .content .btn.back {
    height: 56px;
  }
}
.real-estate .single .content .btn.back::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .real-estate .single .content .btn.back::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .real-estate .single .content .btn.back:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.real-estate .single .content .btn.back::after {
  display: none;
}
.real-estate .single .content .btn.back::before {
  content: "";
  position: absolute;
  left: 1em;
  display: inline-block;
  width: 11px;
  height: 22px;
  background-image: url(img/real-estate/arrow_back.svg);
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
}
@media (any-hover: hover) {
  .real-estate .single .content .btn.back:hover {
    background-color: var(--color__background-body);
    border-color: var(--color__border-accent);
    color: var(--color__accent);
  }
}
.real-estate .single .content .btn.round {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 200px;
  height: 185px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  margin-inline: auto;
  margin-top: 3em;
  text-align: left;
  --clamp-min: 16;
  --clamp-max: 20;
}
@media screen and (min-width: 768px) {
  .real-estate .single .content .btn.round {
    height: 200px;
  }
}
.real-estate .single .content .btn.round::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .real-estate .single .content .btn.round::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .real-estate .single .content .btn.round:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}

/*--------------------------------------------------------------
# real-estate：不動産
--------------------------------------------------------------*/
.event {
  margin-bottom: var(--mb__page);
  /* header
  --------------------------------------------- */
  /* コンテンツ（all：一覧 / single:共通）
  --------------------------------------------- */
  /* コンテンツ（all：一覧）
  --------------------------------------------- */
  /* コンテンツ（single：詳細）
  --------------------------------------------- */
}
.event .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--mb__page-title);
  margin-top: 2.25em;
}
.event .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.event .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
.event .cat_list {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.5em;
  padding: 0 1em;
}
.event .cat_item {
  display: block;
  padding: 0 1em;
  --clamp-min: 14;
  --clamp-max: 17;
  border: 1px solid var(--color__border-text);
}
.event .cat_item.current {
  background-color: var(--color__background-part);
}
.event .all .content,
.event .single .content {
  padding-left: 1em;
  padding-right: 1em;
  margin-top: 3em;
}
@media screen and (min-width: 1280px) {
  .event .all .content,
  .event .single .content {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.event .all .content {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  gap: 2em;
}
@media screen and (min-width: 420px) {
  .event .all .content {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 768px) {
  .event .all .content {
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3, 1fr);
  }
}
.event .all .content article {
  padding: 1em;
}
.event .all .content article:hover {
  background-color: #f0efed;
}
.event .all .content article a:hover {
  opacity: 1;
}
.event .all .content article p {
  margin: 0;
}
.event .all .content article .meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-block: 0.5em;
  font-weight: var(--font__weight-regular);
}
.event .all .content article .meta .reservation {
  padding: 0 0.5em;
  margin-right: 0.5em;
  background-color: var(--color__background-text);
  color: var(--color__white);
  --clamp-min: 14;
  --clamp-max: 16;
}
.event .all .content article .meta .cat_item {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0 0.5em;
  --clamp-min: 12;
  --clamp-max: 16;
}
.event .all .content article .title {
  margin: 0;
  font-weight: var(--font__weight-demibold);
  --clamp-min: 16;
  --clamp-max: 20;
}
.event .all .content article .date {
  font-weight: var(--font__weight-regular);
  --clamp-min: 16;
  --clamp-max: 18;
}
.event .all .pagination {
  margin-top: 3em;
}
.event .all .pagination .nav-links {
  --clamp-min: 14;
  --clamp-max: 18;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 1em;
     -moz-column-gap: 1em;
          column-gap: 1em;
  font-weight: var(--font__weight-regular);
}
.event .all .pagination .prev,
.event .all .pagination .next {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 12px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: contain;
}
.event .all .pagination .prev {
  background-image: url(img/pagination_all-prev.png);
}
.event .all .pagination .next {
  background-image: url(img/pagination_all-next.png);
}
.event .all .pagination .page-numbers {
  color: #848484;
}
.event .all .pagination .current {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 30px;
  height: 30px;
  background-color: var(--color__background-pagination);
  border-radius: 50%;
  color: var(--color__accent);
}
.event .all .pagination .dot {
  color: #848484;
}
.event .single .content {
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
  --clamp-min: 14;
  --clamp-max: 18;
}
.event .single .content .entry_meta {
  width: 100%;
  max-width: 740px;
  margin: 2em auto 2em;
}
.event .single .content .entry_meta p {
  margin: 0;
}
.event .single .content .entry_meta .entry_info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  margin-bottom: 0.5em;
  font-weight: var(--font__weight-regular);
}
.event .single .content .entry_meta .entry_info .reservation {
  padding: 0 0.5em;
  background-color: var(--color__background-text);
  color: var(--color__white);
  --clamp-min: 14;
  --clamp-max: 18;
}
.event .single .content .entry_meta .entry_info .cat_item {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0 0.5em;
  margin-left: 0.5em;
  --clamp-min: 14;
  --clamp-max: 18;
}
.event .single .content .entry_meta h1 {
  margin: 0;
  --clamp-min: 18;
  --clamp-max: 25;
  font-weight: var(--font__weight-bold);
}
.event .single .content .entry_meta .date {
  --clamp-min: 18;
  --clamp-max: 25;
  font-weight: var(--font__weight-regular);
}
.event .single .content .entry_content {
  max-width: 740px;
  margin-inline: auto;
}
.event .single .content .entry_content h2,
.event .single .content .entry_content h3,
.event .single .content .entry_content p {
  max-width: 810px;
  margin-inline: auto;
}
.event .single .content .entry_content h2 {
  --clamp-min: 20;
  --clamp-max: 24;
  font-weight: var(--font__weight-bold);
  margin-block: 1.5em 0.5em;
}
.event .single .content .entry_content h3 {
  --clamp-min: 18;
  --clamp-max: 20;
  font-weight: var(--font__weight-bold);
  margin-block: 1.2em 0.5em;
}
.event .single .content .entry_content h4 {
  --clamp-min: 16;
  --clamp-max: 18;
  font-weight: var(--font__weight-bold);
  margin-block: 1em 0.5em;
}
.event .single .content .entry_content ul {
  list-style: disc;
  padding-left: 1.5em;
  margin: 1em 0;
}
.event .single .content .entry_content ol {
  list-style: decimal;
  padding-left: 1.5em;
  margin: 1em 0;
}
.event .single .content .entry_content img {
  display: block;
  width: 100%;
  margin-block: 2em;
  margin-inline: auto;
}
.event .single .content .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 320px;
  height: 41px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 3em;
  width: calc(100% - 2em);
  --clamp-min: 18;
  --clamp-max: 25;
}
@media screen and (min-width: 768px) {
  .event .single .content .btn {
    height: 56px;
  }
}
.event .single .content .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .event .single .content .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .event .single .content .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.event .single .content .back {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  margin-top: 2em;
  border-bottom: 1px solid var(--color__border-accent);
  white-space: nowrap;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
@media (any-hover: hover) {
  .event .single .content .back:hover {
    border-bottom-color: transparent;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
  }
}

/*--------------------------------------------------------------
# fullorder：トップページ
--------------------------------------------------------------*/
.fullorder {
  margin-bottom: var(--mb__page);
  --clamp-min: 14;
  --clamp-max: 18;
}
.fullorder .fv img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
  height: 220px;
}
@media screen and (min-width: 420px) {
  .fullorder .fv img {
    height: 280px;
  }
}
@media screen and (min-width: 768px) {
  .fullorder .fv img {
    height: 100%;
    max-height: 650px;
  }
}
.fullorder .fullorder_outer {
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  margin-top: var(--margin__section-sp);
}
@media screen and (min-width: 1280px) {
  .fullorder .fullorder_outer {
    padding-left: 0em;
    padding-right: 0em;
  }
}
@media screen and (min-width: 768px) {
  .fullorder .fullorder_outer {
    margin-top: var(--margin__section);
  }
}
.fullorder .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  text-align: center;
  line-height: 1;
  margin-bottom: 2em;
}
.fullorder .page_title .small {
  display: block;
  width: 100%;
  letter-spacing: var(--font__letter-title);
  --clamp-min: 16;
  --clamp-max: 18;
}
.fullorder .page_title .large {
  display: inline-block;
  padding: 0.5em 0.5em 0 0.5em;
  margin-top: 0.5em;
  border-top: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  --clamp-min: 21;
  --clamp-max: 25;
}
.fullorder .lead {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 710px;
  margin-inline: auto;
}
.fullorder .lead h2 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  margin-bottom: 0.5em;
  --clamp-min: 18;
  --clamp-max: 25;
  text-align: center;
  letter-spacing: var(--font__letter-title);
}
.fullorder .design_list {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  -ms-grid-rows: auto 1em auto 1em auto;
  grid-template-rows: repeat(3, auto);
  row-gap: 1em;
  padding: 2em 1em;
}
@media screen and (min-width: 768px) {
  .fullorder .design_list {
    -ms-grid-columns: 1fr 1em 1fr 1em 1fr;
    grid-template-columns: repeat(3, 1fr);
    gap: 0 1em;
    padding-inline: 0;
    padding-block: 3em 5em;
  }
}
@media screen and (min-width: 1280px) {
  .fullorder .design_list {
    -webkit-column-gap: 2em;
       -moz-column-gap: 2em;
            column-gap: 2em;
  }
}
.fullorder .design_list .design_item {
  padding: 1em;
  border: 3px solid var(--color__border-accent);
}
.fullorder .design_list .design_item .strong {
  margin-bottom: 0.2em;
  font-weight: var(--font__weight-extrabold);
  text-align: center;
  text-wrap: balance;
  --clamp-min: 18;
  --clamp-max: 24;
}
.fullorder .content {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  row-gap: 2em;
}
@media screen and (min-width: 768px) {
  .fullorder .content {
    row-gap: 4em;
  }
}
.fullorder .content section {
  display: -ms-grid;
  display: grid;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  row-gap: 1em;
}
@media screen and (min-width: 768px) {
  .fullorder .content section {
    -ms-grid-columns: 1fr 3em 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto 0 auto;
    grid-template-rows: repeat(2, auto);
    gap: 0 3em;
  }
  .fullorder .content section > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .fullorder .content section > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .fullorder .content section > *:nth-child(3) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .fullorder .content section > *:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
}
@media screen and (min-width: 1280px) {
  .fullorder .content section {
    -ms-grid-columns: 720px 1fr;
    grid-template-columns: 720px 1fr;
  }
}
.fullorder .content h3 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  margin-bottom: 0.5em;
  --clamp-min: 18;
  --clamp-max: 21;
  letter-spacing: var(--font__letter-title);
}
.fullorder .content .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 41px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .fullorder .content .btn {
    height: 56px;
  }
}
.fullorder .content .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .fullorder .content .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .fullorder .content .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 768px) {
  .fullorder .content .btn {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    max-width: 370px;
    height: 41px;
    padding-inline: 1.5em;
    border-width: 2px;
    border-style: solid;
    border-radius: 9999px;
    --clamp-min: 14;
    --clamp-max: 18;
    text-align: center;
    letter-spacing: var(--font__letter-button);
    color: var(--color__btn-text);
    background-color: var(--color__btn-background);
    border-color: var(--color__btn-border);
    -webkit-transition: color 0.5s, background-color 0.5s;
    transition: color 0.5s, background-color 0.5s;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-inline: auto;
  }
}
@media screen and (min-width: 768px) and (min-width: 768px) {
  .fullorder .content .btn {
    height: 56px;
  }
}
@media screen and (min-width: 768px) {
  .fullorder .content .btn::after {
    content: "";
    position: absolute;
    right: 1em;
    display: inline-block;
    width: 8px;
    height: 14px;
    -o-object-fit: contain;
       object-fit: contain;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: var(--color__btn-arrow-image);
  }
}
@media screen and (min-width: 768px) and (min-width: 768px) {
  .fullorder .content .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media screen and (min-width: 768px) and (any-hover: hover) {
  .fullorder .content .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.fullorder p br {
  display: none;
}
@media screen and (min-width: 768px) {
  .fullorder p br {
    display: inline;
  }
}

/*--------------------------------------------------------------
# setonosha：コンセプト住宅 瀬戸の舎 mirai
--------------------------------------------------------------*/
.setonosha {
  margin-bottom: var(--mb__page);
  --clamp-min: 14;
  --clamp-max: 18;
}
.setonosha .fv img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
  height: 220px;
}
@media screen and (min-width: 420px) {
  .setonosha .fv img {
    height: 280px;
  }
}
@media screen and (min-width: 768px) {
  .setonosha .fv img {
    height: 100%;
    max-height: 650px;
  }
}
.setonosha .setonosha_outer {
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  margin-top: 2em;
}
@media screen and (min-width: 1280px) {
  .setonosha .setonosha_outer {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.setonosha .page_title {
  text-align: center;
}
.setonosha .page_title img {
  max-width: 280px;
  margin-bottom: 2em;
}
.setonosha .page_title h1 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  text-align: center;
  line-height: 1;
  margin-bottom: 2em;
}
.setonosha .page_title h1 .small {
  width: 100%;
  letter-spacing: var(--font__letter-title);
  --clamp-min: 16;
  --clamp-max: 18;
}
.setonosha .page_title h1 .large {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  padding: 0.5em 0.5em 0 0.5em;
  margin-top: 0.5em;
  border-top: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  --clamp-min: 21;
  --clamp-max: 25;
}
.setonosha .lead {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 740px;
  margin-inline: auto;
}
.setonosha .lead h2 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  margin-bottom: 0.5em;
  --clamp-min: 18;
  --clamp-max: 25;
  text-align: center;
  letter-spacing: var(--font__letter-title);
}
.setonosha .concept_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 1em 2em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-block: 2em;
  margin-inline: auto;
}
@media screen and (min-width: 420px) {
  .setonosha .concept_list {
    gap: 0 2em;
  }
}
@media screen and (min-width: 768px) {
  .setonosha .concept_list {
    gap: 0 3em;
    padding-inline: 0;
    padding-block: 3em 5em;
  }
}
.setonosha .concept_list .concept_item {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background-color: #e0d7d0;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .setonosha .concept_list .concept_item {
    display: -ms-grid;
    display: grid;
    place-content: center;
    width: 250px;
    height: 250px;
    border-radius: 50%;
    background-color: #e0d7d0;
    text-align: center;
  }
}
.setonosha .concept_list .concept_item .strong {
  font-weight: var(--font__weight-extrabold);
  --clamp-min: 18;
  --clamp-max: 24;
}
.setonosha .data {
  display: -ms-grid;
  display: grid;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-column-gap: 3em;
     -moz-column-gap: 3em;
          column-gap: 3em;
  row-gap: 1em;
}
@media screen and (min-width: 1280px) {
  .setonosha .data {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 800px 3em 1fr;
    grid-template-columns: 800px 1fr;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-column-gap: 3em;
       -moz-column-gap: 3em;
            column-gap: 3em;
    padding-right: 1em;
  }
}
.setonosha .data > div {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}
.setonosha .data p {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 1em 0em 0;
  margin-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-text);
  text-transform: capitalize;
  --clamp-min: 21;
  --clamp-max: 25;
}
.setonosha .data dl {
  --clamp-min: 13;
  --clamp-max: 15;
}
.setonosha .data dl > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.setonosha .data dl:last-of-type {
  margin-block: 1em 2em;
}
.setonosha .data dl dt {
  font-weight: var(--font__weight-demibold);
}
.setonosha .data .floor {
  max-width: 460px;
}
.setonosha .content {
  width: 100%;
  max-width: 920px;
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1em 1fr;
  grid-template-columns: repeat(2, 1fr);
  -ms-grid-rows: auto 1em auto 1em auto 1em auto 1em auto 1em auto;
  grid-template-rows: repeat(6, auto);
  gap: 1em;
  margin-top: 3em;
}
.setonosha .content > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.setonosha .content > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.setonosha .content > *:nth-child(3) {
  -ms-grid-row: 3;
  -ms-grid-column: 1;
}
.setonosha .content > *:nth-child(4) {
  -ms-grid-row: 3;
  -ms-grid-column: 3;
}
.setonosha .content > *:nth-child(5) {
  -ms-grid-row: 5;
  -ms-grid-column: 1;
}
.setonosha .content > *:nth-child(6) {
  -ms-grid-row: 5;
  -ms-grid-column: 3;
}
.setonosha .content > *:nth-child(7) {
  -ms-grid-row: 7;
  -ms-grid-column: 1;
}
.setonosha .content > *:nth-child(8) {
  -ms-grid-row: 7;
  -ms-grid-column: 3;
}
.setonosha .content > *:nth-child(9) {
  -ms-grid-row: 9;
  -ms-grid-column: 1;
}
.setonosha .content > *:nth-child(10) {
  -ms-grid-row: 9;
  -ms-grid-column: 3;
}
.setonosha .content > *:nth-child(11) {
  -ms-grid-row: 11;
  -ms-grid-column: 1;
}
.setonosha .content > *:nth-child(12) {
  -ms-grid-row: 11;
  -ms-grid-column: 3;
}
.setonosha .content > div:first-of-type {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1/3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
}
.setonosha .content .text {
  padding: 1em 0.5em;
}
.setonosha .content br {
  display: none;
}
@media screen and (min-width: 1280px) {
  .setonosha .content br {
    display: inline;
  }
}

/*--------------------------------------------------------------
# diary-new：30年日記30の幸せ（新築）
--------------------------------------------------------------*/
.diary-new {
  width: 100%;
  max-width: 980px;
  margin-inline: auto;
  padding-left: 1em;
  padding-right: 1em;
  margin-bottom: var(--mb__page);
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
}
@media screen and (min-width: 1280px) {
  .diary-new {
    padding-left: 0em;
    padding-right: 0em;
  }
}
.diary-new .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.diary-new .page_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.diary-new .page_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .diary-new .page_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.diary-new iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
}
.diary-new span {
  display: inline-block;
}
.diary-new .youtube {
  max-width: 800px;
  margin: 0 auto 3em;
}
.diary-new .catch {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  margin-bottom: 1em;
  --clamp-min: 18;
  --clamp-max: 25;
  letter-spacing: var(--font__letter-title);
}
.diary-new .lead {
  display: -ms-grid;
  display: grid;
  line-height: 2.5;
  margin-bottom: 5em;
}
.diary-new .book h2 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  margin-bottom: 1em;
  --clamp-min: 18;
  --clamp-max: 25;
  letter-spacing: var(--font__letter-title);
}
.diary-new .book .digital {
  max-width: 980px;
  margin: 0 auto 3em;
}
.diary-new .book .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 370px;
  height: 41px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .diary-new .book .btn {
    height: 56px;
  }
}
.diary-new .book .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .diary-new .book .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .diary-new .book .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.diary-new .book .btn:first-of-type {
  margin-bottom: 1em;
}

/*--------------------------------------------------------------
# building：リノベ・新築共通
--------------------------------------------------------------*/
/* fv
--------------------------------------------- */
.building_fv {
  position: relative;
}
.building_fv .page_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: absolute;
  top: 0;
}
.building_fv .page_title .ja {
  display: inline-block;
  padding: 1em 0.5em 0.25em 0.75em;
  margin-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-text);
  line-height: 1.3;
  letter-spacing: var(--font__letter-title);
  --clamp-min: 20;
  --clamp-max: 44;
}
.building_fv .page_title .en {
  display: inline-block;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  text-align: center;
  --clamp-min: 10;
  --clamp-max: 14;
}
.building_fv img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
  height: 220px;
}
@media screen and (min-width: 420px) {
  .building_fv img {
    height: 280px;
  }
}
@media screen and (min-width: 768px) {
  .building_fv img {
    height: 100%;
    max-height: 570px;
  }
}

/* 家づくりのこと
--------------------------------------------- */
.building_about {
  width: 100%;
  max-width: var(--width__max);
  margin-inline: auto;
  margin-top: var(--margin__section-sp);
}
@media screen and (min-width: 768px) {
  .building_about {
    margin-top: var(--margin__section);
  }
}
.building_about .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.building_about .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.building_about .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .building_about .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.building_about .contents {
  display: -ms-grid;
  display: grid;
  row-gap: 2.5em;
}
@media screen and (min-width: 768px) {
  .building_about .contents {
    row-gap: 0;
  }
}
.building_about .accordion {
  display: -ms-grid;
  display: grid;
  row-gap: 1em;
  padding: 0 1em;
}
@media screen and (min-width: 768px) {
  .building_about .accordion {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    row-gap: 0;
    height: 600px;
    padding: 0;
  }
  .building_about .accordion:nth-of-type(odd) .text {
    padding: 0 2.5em 0 1.5em;
  }
  .building_about .accordion:nth-of-type(even) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
  }
  .building_about .accordion:nth-of-type(even) .text {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
    padding: 0 1.5em 0 2.5em;
  }
}
@media screen and (min-width: 1280px) {
  .building_about .accordion {
    height: 500px;
  }
}
.building_about .accordion .img {
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .building_about .accordion .img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
}
.building_about .accordion .text {
  position: relative;
}
.building_about .accordion .button {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 1;
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: 100%;
  height: 5.25em;
  background-color: rgba(var(--color__background-body-rgb), 0.8);
  --clamp-min: 14;
  --clamp-max: 16;
  text-align: center;
}
.building_about .accordion .button[aria-expanded=true] {
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
@media screen and (min-width: 768px) {
  .building_about .accordion .button {
    display: none;
  }
}
.building_about .accordion .button .open {
  display: block;
  width: 55px;
  height: auto;
  margin-inline: auto;
}
.building_about .accordion .panel {
  overflow: hidden;
}
.building_about .accordion .panel h3 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  margin-bottom: 0.5em;
  letter-spacing: var(--font__letter-title);
  --clamp-min: 18;
  --clamp-max: 24;
}
@media screen and (min-width: 768px) {
  .building_about .accordion .panel h3 {
    margin-left: 0;
  }
}
.building_about .accordion .panel h3 span {
  display: block;
}
@media screen and (min-width: 420px) {
  .building_about .accordion .panel h3 span {
    display: inline-block;
  }
}
.building_about .accordion .panel h3 .break {
  display: block;
}
.building_about .accordion .panel p {
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  overflow: hidden;
  text-align: justify;
  max-height: 7em;
  padding: 0 1em;
  --clamp-min: 14;
  --clamp-max: 18;
}
@media screen and (min-width: 768px) {
  .building_about .accordion .panel p {
    display: block;
    max-height: none;
    padding: 0;
  }
}
@media screen and (min-width: 1440px) {
  .building_about .accordion .panel p {
    text-align: start;
  }
}
.building_about .accordion .panel p br {
  display: none;
}
@media screen and (min-width: 1440px) {
  .building_about .accordion .panel p br {
    display: inline;
  }
}
.building_about .accordion .panel p br.br-sp {
  display: inline;
}
.building_about .accordion .panel.active p {
  display: block;
  max-height: 40em;
  -webkit-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.building_about .accordion .panel .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  display: none;
  margin-top: 2em;
  --clamp-max: 16;
}
@media screen and (min-width: 768px) {
  .building_about .accordion .panel .btn {
    height: 48px;
  }
}
.building_about .accordion .panel .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .building_about .accordion .panel .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .building_about .accordion .panel .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 768px) {
  .building_about .accordion .panel .btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.building_about .accordion .panel.active .btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.building_menu {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  padding-bottom: 2em;
  margin-top: var(--margin__section);
  background-color: var(--color__background-section);
}
.building_menu h3 {
  padding: 1em 0;
  margin: 0 0 1em;
  background-color: var(--color__background-accent);
  --clamp-min: 18;
  --clamp-max: 30;
  color: var(--color__white);
  text-align: center;
  letter-spacing: var(--font__letter-title);
  font-weight: var(--font__weight-regular);
}
.building_menu .menu_list {
  display: -ms-grid;
  display: grid;
  row-gap: 0.5em;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  padding: 0 1.75em;
}
@media screen and (min-width: 768px) {
  .building_menu .menu_list {
    -ms-grid-columns: 1fr 1.5em 1fr;
    grid-template-columns: repeat(2, 1fr);
    -ms-grid-rows: 1fr 1.5em 1fr 1.5em 1fr;
    grid-template-rows: repeat(3, 1fr);
    gap: 1.5em;
  }
  .building_menu .menu_list > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .building_menu .menu_list > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .building_menu .menu_list > *:nth-child(3) {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
  }
  .building_menu .menu_list > *:nth-child(4) {
    -ms-grid-row: 3;
    -ms-grid-column: 3;
  }
  .building_menu .menu_list > *:nth-child(5) {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
  }
  .building_menu .menu_list > *:nth-child(6) {
    -ms-grid-row: 5;
    -ms-grid-column: 3;
  }
}
@media screen and (min-width: 1280px) {
  .building_menu .menu_list {
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3, 1fr);
    -ms-grid-rows: (1fr)[2];
    grid-template-rows: repeat(2, 1fr);
  }
  .building_menu .menu_list > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .building_menu .menu_list > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .building_menu .menu_list > *:nth-child(3) {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .building_menu .menu_list > *:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .building_menu .menu_list > *:nth-child(5) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
  .building_menu .menu_list > *:nth-child(6) {
    -ms-grid-row: 2;
    -ms-grid-column: 3;
  }
}
.building_menu .menu_item {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  border-bottom: 1px solid var(--color__border-accent);
}
.building_menu .menu_item a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  padding: 0.5em;
  --clamp-min: 14;
  --clamp-max: 20;
  color: var(--color__accent);
  letter-spacing: var(--font__letter-title);
}
@media screen and (min-width: 768px) {
  .building_menu .menu_item a {
    padding: 0.5em 1em 1em 0.5em;
  }
}
.building_menu .menu_item a::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 8px;
  -o-object-fit: contain;
     object-fit: contain;
  background-image: url(img/arrow_bottom.png);
  background-size: contain;
  background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .building_menu .menu_item a::after {
    width: 20px;
    height: 12px;
  }
}
.building_menu .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 100%;
  height: 47px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  letter-spacing: 0.1em;
  margin-top: 0.5em;
}
@media screen and (min-width: 768px) {
  .building_menu .btn {
    height: 62px;
  }
}
.building_menu .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .building_menu .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .building_menu .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.building_menu .btn .attention {
  display: inline-block;
  --clamp-min: 12;
  --clamp-max: 14;
}

/* デザイン・性能について
--------------------------------------------- */
.building_design {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  margin-top: var(--margin__section-sp);
  position: relative;
}
@media screen and (min-width: 768px) {
  .building_design {
    margin-top: var(--margin__section);
  }
}
.building_design::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 30px;
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .building_design::after {
    display: none;
  }
}
.building_design .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.building_design .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.building_design .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .building_design .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.building_design .contents {
  display: -ms-grid;
  display: grid;
  background-color: var(--color__background-section);
  width: calc(100% - 2em);
  margin-inline: auto;
}
@media screen and (min-width: 420px) {
  .building_design .contents {
    max-width: 560px;
  }
}
@media screen and (min-width: 768px) {
  .building_design .contents {
    -ms-grid-columns: 45% 55%;
    grid-template-columns: 45% 55%;
    -ms-grid-rows: 310px;
    grid-template-rows: 310px;
    width: 100%;
    max-width: none;
  }
  .building_design .contents > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .building_design .contents > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
}
.building_design .contents img {
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .building_design .contents img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
}
.building_design .contents .text {
  --clamp-min: 14;
  --clamp-max: 18;
  display: -ms-grid;
  display: grid;
  place-content: center;
  height: 100%;
  padding: 1em 1em 0;
  text-align: justify;
}
@media screen and (min-width: 420px) {
  .building_design .contents .text {
    width: 100%;
    max-width: 400px;
    padding: 1em 0 0;
    margin-inline: auto;
  }
}
@media screen and (min-width: 768px) {
  .building_design .contents .text {
    padding: 0;
  }
}
.building_design .contents .text .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 260px;
  height: 47px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 1em;
}
@media screen and (min-width: 768px) {
  .building_design .contents .text .btn {
    height: 62px;
  }
}
.building_design .contents .text .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .building_design .contents .text .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .building_design .contents .text .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}

/* 家づくりの流れ
--------------------------------------------- */
.building_flow .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.building_flow .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.building_flow .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .building_flow .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.building_flow .contents {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  width: 100%;
  max-width: 500px;
  padding: 0 1em;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .building_flow .contents {
    display: -ms-grid;
    display: grid;
    place-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -ms-grid-columns: minmax(auto, 210px) 1em minmax(auto, 600px);
    grid-template-columns: minmax(auto, 210px) minmax(auto, 600px);
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
    max-width: none;
  }
}
@media screen and (min-width: 1280px) {
  .building_flow .contents {
    -ms-grid-columns: 210px 2.5em 600px;
    grid-template-columns: 210px 600px;
    -webkit-column-gap: 2.5em;
       -moz-column-gap: 2.5em;
            column-gap: 2.5em;
  }
}
.building_flow .contents img {
  display: none;
}
@media screen and (min-width: 768px) {
  .building_flow .contents img {
    display: block;
  }
}
.building_flow .flow_list {
  display: -ms-grid;
  display: grid;
  row-gap: 3em;
}
.building_flow .flow_item {
  width: 100%;
  --clamp-min: 14;
}
.building_flow .flow_item h3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 1em;
  background-color: var(--color__background-section);
  --clamp-max: 21;
}
.building_flow .flow_item h3 .step_title {
  display: -ms-grid;
  display: grid;
  place-content: center;
  grid-auto-flow: row;
  -ms-grid-columns: auto;
  grid-template-columns: auto;
  padding-inline: 0.5em;
  line-height: 1.3;
}
@media screen and (min-width: 420px) {
  .building_flow .flow_item h3 .step_title {
    -ms-grid-columns: (auto)[2];
    grid-template-columns: repeat(2, auto);
  }
}
.building_flow .flow_item h3 .step {
  display: -ms-grid;
  display: grid;
  place-content: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 0.5em;
  background-color: var(--color__background-accent);
  color: var(--color__white);
  letter-spacing: 0.15em;
}
.building_flow .flow_item .br {
  display: inline-block;
}
.building_flow .flow_sublist {
  display: -ms-grid;
  display: grid;
  place-content: center;
}
.building_flow .flow_subitem {
  --clamp-max: 21;
  text-align: center;
}
.building_flow .flow_subitem:not(:last-child)::after {
  content: "";
  display: block;
  width: 15px;
  height: 12px;
  margin: 0.5em auto;
  -o-object-fit: contain;
     object-fit: contain;
  background-image: url(img/building/flow_arrow.png);
  background-size: contain;
  background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .building_flow .flow_subitem:not(:last-child)::after {
    width: 30px;
    height: 24px;
    margin: 1em auto;
  }
}
.building_flow .flow_subitem .red {
  color: #e43e26;
}
.building_flow .flow_subitem strong {
  font-weight: var(--font__weight-bold);
}
.building_flow .flow_subitem .underline {
  padding-bottom: 0.2em;
  border-bottom: 4px double var(--color__border-accent);
}
.building_flow .flow_subitem .box {
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0.5em 1.5em;
  margin: 1em auto 0;
  border: 1px solid var(--color__border-accent);
  --clamp-max: 19;
}
@media screen and (min-width: 768px) {
  .building_flow .flow_subitem .box {
    display: block;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 0.5em 1.5em;
    margin: 1em auto 0;
    border: 1px solid var(--color__border-accent);
    --clamp-max: 19;
  }
}
.building_flow .flow_subitem dt {
  font-weight: var(--font__weight-demibold);
}
.building_flow .flow_subitem dd {
  max-width: 500px;
  padding: 0.5em;
  margin-top: 0.5em;
  border: 1px solid var(--color__border-accent);
  --clamp-max: 19;
  text-align: justify;
  line-height: 1.3;
}
@media screen and (min-width: 768px) {
  .building_flow .flow_subitem dd {
    padding: 1em 1.5em;
  }
}
@media screen and (min-width: 1280px) {
  .building_flow .flow_subitem dd {
    max-width: 580px;
  }
}
.building_flow .flow_subitem dd li {
  text-indent: -0.6em;
  padding-left: 0.6em;
}
.building_flow .flow_subitem dd .br-sp {
  display: inline;
}
@media screen and (min-width: 768px) {
  .building_flow .flow_subitem dd .br-sp {
    display: none;
  }
}
.building_flow .flow_subitem dd .br-pc {
  display: none;
}
@media screen and (min-width: 768px) {
  .building_flow .flow_subitem dd .br-pc {
    display: inline;
  }
}
.building_flow img {
  display: block;
  width: 100%;
  max-width: 860px;
  height: auto;
  margin-inline: auto;
}

/* アフターサービス
--------------------------------------------- */
.building_afterservice {
  padding-inline: 1em;
}
@media screen and (min-width: 1440px) {
  .building_afterservice {
    padding-inline: 0;
  }
}
.building_afterservice .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.building_afterservice .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.building_afterservice .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .building_afterservice .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.building_afterservice .afterservice_contents {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
}
.building_afterservice h3 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  --clamp-min: 18;
  --clamp-max: 21;
  text-align: center;
  --clamp-min: 14;
  margin: 1.5em 0;
}
.building_afterservice img {
  display: block;
  width: 100%;
  max-width: 960px;
  height: auto;
  margin-inline: auto;
}
.building_afterservice .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 280px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 1em;
}
@media screen and (min-width: 768px) {
  .building_afterservice .btn {
    height: 48px;
  }
}
.building_afterservice .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .building_afterservice .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .building_afterservice .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 768px) {
  .building_afterservice .btn {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    max-width: 370px;
    height: 33px;
    padding-inline: 1.5em;
    border-width: 2px;
    border-style: solid;
    border-radius: 9999px;
    --clamp-min: 14;
    --clamp-max: 18;
    text-align: center;
    letter-spacing: var(--font__letter-button);
    color: var(--color__btn-text);
    background-color: var(--color__btn-background);
    border-color: var(--color__btn-border);
    -webkit-transition: color 0.5s, background-color 0.5s;
    transition: color 0.5s, background-color 0.5s;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 4.5em;
  }
}
@media screen and (min-width: 768px) and (min-width: 768px) {
  .building_afterservice .btn {
    height: 48px;
  }
}
@media screen and (min-width: 768px) {
  .building_afterservice .btn::after {
    content: "";
    position: absolute;
    right: 1em;
    display: inline-block;
    width: 8px;
    height: 14px;
    -o-object-fit: contain;
       object-fit: contain;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: var(--color__btn-arrow-image);
  }
}
@media screen and (min-width: 768px) and (min-width: 768px) {
  .building_afterservice .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media screen and (min-width: 768px) and (any-hover: hover) {
  .building_afterservice .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}

/*--------------------------------------------------------------
# new-house：新築住宅
  フォントサイズ切り替えmd
--------------------------------------------------------------*/
.new-house {
  --padding-sec-sp: 4em;
  --padding-sec-pc: 5em;
  /* ラインナップ
  --------------------------------------------- */
  /* 品質保証
  --------------------------------------------- */
  /* 流れ（独自設定のみ）
  --------------------------------------------- */
  /* アフターサービス
  --------------------------------------------- */
  /* 制作事例
  --------------------------------------------- */
}
.new-house .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.new-house .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.new-house .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .new-house .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.new-house .lineup {
  background-color: var(--color__background-section);
  padding-block: var(--padding-sec-sp);
}
@media screen and (min-width: 768px) {
  .new-house .lineup {
    padding-block: var(--padding-sec-pc);
    margin-top: 7em;
  }
}
.new-house .lineup .lineup_list {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  padding-left: 1em;
  padding-right: 1em;
  display: -ms-grid;
  display: grid;
  row-gap: 2em;
}
@media screen and (min-width: 1280px) {
  .new-house .lineup .lineup_list {
    padding-left: 0em;
    padding-right: 0em;
  }
}
@media screen and (min-width: 768px) {
  .new-house .lineup .lineup_list {
    -ms-grid-columns: 1fr 2em 1fr 2em 1fr;
    grid-template-columns: repeat(3, 1fr);
    -webkit-column-gap: 2em;
       -moz-column-gap: 2em;
            column-gap: 2em;
  }
}
.new-house .lineup li {
  --clamp-min: 18;
  --clamp-max: 21;
  display: -ms-grid;
  display: grid;
  row-gap: 1em;
  text-align: center;
}
.new-house .lineup .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 200px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  --clamp-max: 16;
}
@media screen and (min-width: 768px) {
  .new-house .lineup .btn {
    height: 48px;
  }
}
.new-house .lineup .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .new-house .lineup .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .new-house .lineup .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.new-house .lineup .btn.wide {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 280px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  --clamp-max: 16;
}
@media screen and (min-width: 768px) {
  .new-house .lineup .btn.wide {
    height: 48px;
  }
}
.new-house .lineup .btn.wide::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .new-house .lineup .btn.wide::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .new-house .lineup .btn.wide:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.new-house .quality {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  padding-left: 1em;
  padding-right: 1em;
  --clamp-min: 14;
  --clamp-max: 18;
  padding-block: var(--padding-sec-sp);
}
@media screen and (min-width: 1280px) {
  .new-house .quality {
    padding-left: 0em;
    padding-right: 0em;
  }
}
@media screen and (min-width: 768px) {
  .new-house .quality {
    padding-block: var(--padding-sec-pc);
  }
}
.new-house .quality > section {
  --padding-sp: 2em;
  --padding-pc: 3em;
  display: -ms-grid;
  display: grid;
  row-gap: 1em;
  padding-block: var(--padding-sp);
  border-top: 1px solid var(--color__border-text);
}
@media screen and (min-width: 768px) {
  .new-house .quality > section {
    padding-block: var(--padding-pc);
  }
}
.new-house .quality > section:first-of-type {
  padding-top: 0;
  border-top: none;
}
.new-house .quality > section:first-of-type .lead {
  width: 100%;
  max-width: 920px;
  margin-inline: auto;
}
.new-house .quality > section:nth-of-type(4) .side {
  width: 100%;
  max-width: 870px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .new-house .quality > section:nth-of-type(4) .side {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: auto 1em 1fr;
    grid-template-columns: auto 1fr;
    -webkit-column-gap: 1em;
       -moz-column-gap: 1em;
            column-gap: 1em;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.new-house .quality > section:nth-of-type(4) dl {
  --color: #603813;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  padding: 0.5em 1em 0.5em 0.5em;
  border: 1px solid var(--color);
}
@media screen and (min-width: 768px) {
  .new-house .quality > section:nth-of-type(4) dl {
    width: 100%;
    height: 100%;
    margin: 0;
  }
}
.new-house .quality > section:nth-of-type(4) dl dt {
  display: -ms-grid;
  display: grid;
  place-content: center;
  height: 100%;
  padding: 0.5em;
  margin-right: 1em;
  background-color: #cbc0b5;
  border: 1px solid var(--color);
  color: var(--color);
}
.new-house .quality > section:nth-of-type(5) .lead {
  width: 100%;
  max-width: 860px;
  margin-inline: auto;
}
.new-house .quality > section:nth-of-type(6) .yoshida-oath {
  width: 100%;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  margin-inline: auto;
  border: 1px solid var(--color__accent);
}
@media screen and (min-width: 768px) {
  .new-house .quality > section:nth-of-type(6) .yoshida-oath {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: auto auto;
    grid-template-columns: auto auto;
    -ms-grid-rows: (auto)[2];
    grid-template-rows: repeat(2, auto);
  }
  .new-house .quality > section:nth-of-type(6) .yoshida-oath > *:nth-child(1) {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .new-house .quality > section:nth-of-type(6) .yoshida-oath > *:nth-child(2) {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .new-house .quality > section:nth-of-type(6) .yoshida-oath > *:nth-child(3) {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
  }
  .new-house .quality > section:nth-of-type(6) .yoshida-oath > *:nth-child(4) {
    -ms-grid-row: 2;
    -ms-grid-column: 2;
  }
}
.new-house .quality > section:nth-of-type(6) dt {
  --clamp-min: 18;
  --clamp-max: 21;
  color: var(--color__accent);
}
.new-house .quality > section:nth-of-type(6) dt.title {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1/3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
  padding-block: 0.2em;
  border-bottom: 1px solid var(--color__accent);
  text-align: center;
  --clamp-max: 24;
}
.new-house .quality > section:nth-of-type(6) .policy,
.new-house .quality > section:nth-of-type(6) .oath {
  padding: 1em 1.5em;
}
.new-house .quality > section:nth-of-type(6) .policy dd,
.new-house .quality > section:nth-of-type(6) .oath dd {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1.8em 1fr;
  grid-template-columns: 1.8em 1fr;
}
.new-house .quality > section:nth-of-type(6) .oath {
  border-top: 1px solid var(--color__accent);
}
@media screen and (min-width: 768px) {
  .new-house .quality > section:nth-of-type(6) .oath {
    border-top: none;
    border-left: 1px solid var(--color__accent);
  }
}
.new-house .quality > section:last-of-type {
  padding-bottom: 0;
}
.new-house .quality > section:last-of-type .col2 {
  grid-auto-columns: auto;
  grid-auto-rows: 50vw;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (min-width: 768px) {
  .new-house .quality > section:last-of-type .col2 {
    -ms-grid-rows: minmax(auto, 480px);
    grid-template-rows: minmax(auto, 480px);
  }
}
.new-house .quality > section:last-of-type .col2 img {
  width: 100%;
  height: 100%;
  -o-object-fit: scale-down;
     object-fit: scale-down;
}
.new-house .quality > section:last-of-type .col2 img:first-of-type {
  -o-object-position: right;
     object-position: right;
}
.new-house .quality > section:last-of-type .col2 img:last-of-type {
  -o-object-position: left;
     object-position: left;
}
.new-house .quality .grid {
  display: -ms-grid;
  display: grid;
  -webkit-column-gap: 0.5em;
     -moz-column-gap: 0.5em;
          column-gap: 0.5em;
}
.new-house .quality .grid.col2 {
  width: 100%;
  max-width: 910px;
  margin-inline: auto;
  -ms-grid-columns: (1fr)[2];
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 768px) {
  .new-house .quality .grid.col2 {
    -webkit-column-gap: 3em;
       -moz-column-gap: 3em;
            column-gap: 3em;
  }
}
.new-house .quality .grid.col3 {
  -ms-grid-columns: (1fr)[3];
  grid-template-columns: repeat(3, 1fr);
}
@media screen and (min-width: 768px) {
  .new-house .quality .grid.col3 {
    -webkit-column-gap: 2em;
       -moz-column-gap: 2em;
            column-gap: 2em;
  }
}
.new-house .quality h3 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  --clamp-min: 18;
  --clamp-max: 21;
  text-align: center;
  letter-spacing: var(--font__letter-title);
}
.new-house .quality .lead {
  width: 100%;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  margin-inline: auto;
}
.new-house .quality .catch {
  --clamp-min: 16;
  --clamp-max: 20;
  text-align: center;
}
.new-house .quality .catch.red {
  color: #e60012;
}
.new-house .quality .box {
  width: 100%;
  max-width: 950px;
  margin-inline: auto;
  padding: 1em;
  border: 1px solid var(--color__border-text);
}
.new-house .quality .text-center {
  text-align: center;
}
.new-house .building_flow {
  padding-block: var(--padding-sec-sp);
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .new-house .building_flow {
    padding-block: var(--padding-sec-pc);
  }
}
.new-house .building_flow .flow_item h3 {
  background-color: var(--color__background-body);
}
.new-house .building_afterservice {
  background-color: var(--color__background-body);
  padding-block: var(--padding-sec-sp);
}
@media screen and (min-width: 768px) {
  .new-house .building_afterservice {
    padding-block: var(--padding-sec-pc);
  }
}
.new-house .works-part {
  padding-top: var(--padding-sec-sp);
  padding-bottom: var(--mb__page);
  background-color: var(--color__background-section);
}
@media screen and (min-width: 768px) {
  .new-house .works-part {
    padding-top: var(--padding-sec-pc);
  }
}
.new-house .works-part .works_list {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  padding-left: 1em;
  padding-right: 1em;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1em 1fr;
  grid-template-columns: repeat(2, 1fr);
  gap: 1em;
  margin-bottom: 2em;
}
@media screen and (min-width: 1280px) {
  .new-house .works-part .works_list {
    padding-left: 0em;
    padding-right: 0em;
  }
}
@media screen and (min-width: 768px) {
  .new-house .works-part .works_list {
    -ms-grid-columns: 1fr 2em 1fr 2em 1fr;
    grid-template-columns: repeat(3, 1fr);
    gap: 2em;
  }
}
.new-house .works-part .works_item {
  list-style: none;
}
.new-house .works-part .works_item .title {
  --clamp-min: 14;
  --clamp-max: 18;
  padding: 0.5em;
  font-weight: var(--font__weight-regular);
}
@media screen and (min-width: 768px) {
  .new-house .works-part .works_item .title {
    padding: 1em;
  }
}
.new-house .works-part .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 320px;
  height: 41px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .new-house .works-part .btn {
    height: 56px;
  }
}
.new-house .works-part .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .new-house .works-part .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .new-house .works-part .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}

/*--------------------------------------------------------------
# renovation：性能向上リノベーション
--------------------------------------------------------------*/
.renovation {
  --padding-sec-sp: 4em;
  --padding-sec-pc: 5em;
  /* ラインナップ
  --------------------------------------------- */
  /* 流れ（独自設定のみ）
  --------------------------------------------- */
  /* アフターサービス
  --------------------------------------------- */
}
.renovation .lineup {
  background-color: var(--color__background-section);
  padding: 4em 0 2em;
}
@media screen and (min-width: 768px) {
  .renovation .lineup {
    padding: 5em 0;
    margin-top: 7em;
  }
}
.renovation .lineup .sec_title {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1;
  margin-bottom: var(--margin__secTitle-sp);
}
.renovation .lineup .sec_title .ja {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: 0.2em;
  padding-bottom: 0.5em;
  border-bottom: 1px solid var(--color__border-accent);
  letter-spacing: var(--font__letter-title);
  white-space: nowrap;
  --clamp-min: 18;
  --clamp-max: 25;
}
.renovation .lineup .sec_title .en {
  display: inline-block;
  padding-top: 1.25em;
  text-transform: uppercase;
  letter-spacing: var(--font__letter-title-attention);
  --clamp-min: 10;
  --clamp-max: 14;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .sec_title {
    margin-bottom: var(--margin__secTitle-tb);
  }
}
.renovation .lineup .lineup_outer {
  padding: 0 1em;
  max-width: 560px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .lineup_outer {
    max-width: var(--width__section);
  }
}
@media screen and (min-width: 1280px) {
  .renovation .lineup .lineup_outer {
    padding: 0;
  }
}
.renovation .lineup .content {
  display: -ms-grid;
  display: grid;
  place-content: center;
  row-gap: 2em;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .content {
    row-gap: 3.75em;
  }
}
@media screen and (min-width: 768px) {
  .renovation .lineup .content section {
    display: -ms-grid;
    display: grid;
        grid-template-areas: "text text img img" "btn  btn  btn btn";
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    -ms-grid-rows: 350px auto;
    grid-template-rows: 350px auto;
  }
  .renovation .lineup .content section > .text {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
  }
  .renovation .lineup .content section > img {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
    -ms-grid-column-span: 2;
  }
  .renovation .lineup .content section > .text {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
  }
}
@media screen and (min-width: 1280px) {
  .renovation .lineup .content section {
    -ms-grid-rows: 270px auto;
    grid-template-rows: 270px auto;
  }
}
.renovation .lineup .content section .text {
  position: relative;
  display: -ms-grid;
  display: grid;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 1em;
  background-color: var(--color__white);
}
@media screen and (min-width: 768px) {
  .renovation .lineup .content section .text {
    grid-area: text;
    height: 100%;
    padding: 1.5em 2.75em;
  }
  .renovation .lineup .content section .text::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 0px;
    height: 0px;
    border-top: 0px solid transparent;
    border-right: 0px solid transparent;
    border-left: 35px solid #a19885;
    border-bottom: 35px solid transparent;
  }
}
.renovation .lineup .content section .text h3 {
  --clamp-min: 14;
  --clamp-max: 21;
  font-weight: var(--font__weight-extrabold);
}
.renovation .lineup .content section .text p {
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: justify;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .content section .img {
    grid-area: img;
  }
}
.renovation .lineup .content section .img img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
  min-height: 200px;
}
.renovation .lineup .content section .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 300px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  --clamp-max: 16;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 1em;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .content section .btn {
    height: 48px;
  }
}
.renovation .lineup .content section .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .renovation .lineup .content section .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .renovation .lineup .content section .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.renovation .lineup .content section .btn.todiary {
  width: 260px;
}
.renovation .lineup .content section .btn.tofudosan {
  width: 200px;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .content section .btn {
    grid-area: btn;
    margin-top: 1.5em;
  }
  .renovation .lineup .content section .btn.todiary, .renovation .lineup .content section .btn.tofudosan {
    width: 300px;
  }
}
@media screen and (min-width: 1280px){
  .voice dialog .dialog_content .outer .flow_item .number img {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .voice dialog .dialog_content .outer .flow_item .number .text {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .voice dialog .dialog_content .outer .cta {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
  }
  .renovation .lineup .content section .text {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .renovation .lineup .content section .img {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
}
@media screen and (min-width: 768px){
  .voice dialog .dialog_content .outer .flow_item .number > img {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .voice dialog .dialog_content .outer .flow_item .number > .text {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .voice dialog .dialog_content .outer .flow_item .number > .text {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
  }
  .renovation .lineup .content section > .text {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
  }
  .voice dialog .dialog_content .outer .flow_item .number > .img {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .renovation .lineup .content section > .img {
    -ms-grid-row: 1;
    -ms-grid-column: 3;
    -ms-grid-column-span: 2;
  }
  .renovation .lineup .content section .btn {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    -ms-grid-column-span: 4;
  }
}
.renovation .lineup .method {
  padding: 1.5em 1em;
  margin: 2em 0;
  border-top: 1px solid var(--color__border-text);
  border-bottom: 1px solid var(--color__border-text);
}
@media screen and (min-width: 768px) {
  .renovation .lineup .method {
    padding: 4em 1em;
  }
}
.renovation .lineup .method h3 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  --clamp-min: 18;
  --clamp-max: 21;
  text-align: center;
  letter-spacing: var(--font__letter-title);
  margin: 0 0 0.5em;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .method h3 {
    margin: 0 0 2em;
  }
}
@media screen and (min-width: 420px) {
  .renovation .lineup .method h3 br {
    display: none;
  }
}
.renovation .lineup .method .method_list {
  display: -ms-grid;
  display: grid;
  row-gap: 2em;
  max-width: 320px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .method .method_list {
    -ms-grid-columns: 1fr 3em 1fr 3em 1fr;
    grid-template-columns: repeat(3, 1fr);
    -webkit-column-gap: 3em;
       -moz-column-gap: 3em;
            column-gap: 3em;
    row-gap: 0;
    max-width: none;
  }
}
@media screen and (min-width: 1440px) {
  .renovation .lineup .method .method_list {
    -webkit-column-gap: 7em;
       -moz-column-gap: 7em;
            column-gap: 7em;
  }
}
.renovation .lineup .method img {
  width: 100%;
  height: auto;
  padding-right: 1.5em;
}
.renovation .lineup .method h4 {
  --clamp-min: 16;
  --clamp-max: 21;
  margin-top: 1em;
  font-weight: var(--font__weight-bold);
  text-align: center;
}
.renovation .lineup .method p {
  --clamp-min: 14;
  --clamp-max: 18;
  max-width: 240px;
  margin-inline: auto;
  text-align: justify;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .method p {
    max-width: none;
  }
}
.renovation .lineup .superwall {
  position: relative;
  max-width: 950px;
  margin-inline: auto;
}
.renovation .lineup .superwall img {
  width: 100%;
  height: auto;
}
.renovation .lineup .superwall .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 290px;
  height: 33px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  --clamp-max: 16;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 1em;
  margin-inline: auto;
  width: 240px;
}
@media screen and (min-width: 768px) {
  .renovation .lineup .superwall .btn {
    height: 48px;
  }
}
.renovation .lineup .superwall .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .renovation .lineup .superwall .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .renovation .lineup .superwall .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
@media screen and (min-width: 420px) {
  .renovation .lineup .superwall .btn {
    width: 290px;
  }
}
@media screen and (min-width: 1280px) {
  .renovation .lineup .superwall .btn {
    position: absolute;
    right: 2.5%;
    bottom: 28%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
.renovation .lineup .superwall h3 {
  font-family: var(--font__mincho);
  font-weight: var(--font__weight-regular);
  --clamp-min: 18;
  --clamp-max: 21;
  text-align: center;
  letter-spacing: var(--font__letter-title);
  --clamp-min: 12;
  margin: 1em 0 0;
}
.renovation .building_flow {
  padding-block: var(--padding-sec-sp);
  background-color: var(--color__background-body);
}
@media screen and (min-width: 768px) {
  .renovation .building_flow {
    padding-block: var(--padding-sec-pc);
  }
}
.renovation .building_flow .flow_item h3 {
  background-color: var(--color__background-section);
}
.renovation .building_afterservice {
  background-color: var(--color__background-section);
  padding-top: var(--padding-sec-sp);
  padding-bottom: var(--mb__page);
}
@media screen and (min-width: 768px) {
  .renovation .building_afterservice {
    padding-top: var(--padding-sec-pc);
  }
}

/*--------------------------------------------------------------
# privacypolicy：固定ページテンプレート
--------------------------------------------------------------*/
.privacypolicy p {
  font-weight: var(--font__weight-regular);
}
.privacypolicy ul li,
.privacypolicy ol li {
  font-weight: var(--font__weight-regular);
}
.privacypolicy .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  max-width: 220px;
  height: 41px;
  padding-inline: 1.5em;
  border-width: 2px;
  border-style: solid;
  border-radius: 9999px;
  --clamp-min: 14;
  --clamp-max: 18;
  text-align: center;
  letter-spacing: var(--font__letter-button);
  color: var(--color__btn-text);
  background-color: var(--color__btn-background);
  border-color: var(--color__btn-border);
  -webkit-transition: color 0.5s, background-color 0.5s;
  transition: color 0.5s, background-color 0.5s;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-inline: auto;
  margin-top: 3em;
}
@media screen and (min-width: 768px) {
  .privacypolicy .btn {
    height: 56px;
  }
}
.privacypolicy .btn::after {
  content: "";
  position: absolute;
  right: 1em;
  display: inline-block;
  width: 8px;
  height: 14px;
  -o-object-fit: contain;
     object-fit: contain;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: var(--color__btn-arrow-image);
}
@media screen and (min-width: 768px) {
  .privacypolicy .btn::after {
    width: 12px;
    height: 20px;
  }
}
@media (any-hover: hover) {
  .privacypolicy .btn:hover {
    color: var(--color__btn-text-hover);
    background-color: var(--color__btn-background-hover);
    border-color: var(--color__btn-border-hover);
    -webkit-transition: color 0.5s, background-color 0.5s, background-image 0.5s;
    transition: color 0.5s, background-color 0.5s, background-image 0.5s;
  }
}
.privacypolicy .btn::after {
  display: none;
}

/*--------------------------------------------------------------
# resumulab：暮らし体感モデルハウス りすむ・らぼ
--------------------------------------------------------------*/
html {
  scroll-behavior: smooth;
}

.resumulab {
  /* ボタン共通（Aのアイコン相当。%で位置指定するので親.relative必須） */
  /* traditionalページのボタン位置 */
  /* valueページのボタン位置 */
  /* exteriorページのボタン位置 */
}
.resumulab .img-pc {
  display: block;
}
@media (max-width: 768px) {
  .resumulab .img-pc {
    display: none;
  }
}
.resumulab .img-sp {
  display: none;
}
@media (max-width: 768px) {
  .resumulab .img-sp {
    display: block;
  }
}
.resumulab p, .resumulab ul, .resumulab li, .resumulab h1, .resumulab h2, .resumulab h3 {
  margin: 0;
  font-weight: 400;
}
.resumulab h1, .resumulab h2 {
  font-family: "TsukuMinPro", sans-serif;
}
.resumulab .sp-br {
  display: none;
}
@media (max-width: 768px) {
  .resumulab .sp-br {
    display: inline;
  }
}
.resumulab .pc-br {
  display: inline;
}
@media (max-width: 1024px) {
  .resumulab .pc-br {
    display: none;
  }
}
.resumulab .no-sp-br {
  display: inline;
}
@media (max-width: 768px) {
  .resumulab .no-sp-br {
    display: none;
  }
}
.resumulab .space-60-vertical {
  margin-bottom: 90px;
}
.resumulab .arrow {
  width: 28px;
  height: 28px;
  margin-right: 8px;
}
.resumulab .youtube {
  width: 100%;
  aspect-ratio: 16/9;
}
.resumulab .youtube iframe {
  width: 100%;
  height: 100%;
}
.resumulab .midashi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #E6E6E6;
  padding-bottom: 20px;
}
.resumulab .midashi .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  max-width: 1366px;
}
@media (max-width: 768px) {
  .resumulab .midashi .inner {
    padding-right: 1.5em;
  }
}
.resumulab .house-img {
  width: 45%;
  height: auto;
  margin-top: -7em;
}
@media (max-width: 390px) {
  .resumulab .house-img {
    width: 50%;
    margin-top: -3em;
  }
}
.resumulab .logo-cont {
  width: 45%;
  height: auto;
  max-width: 516px;
  margin-right: 210px;
}
@media (max-width: 1280px) {
  .resumulab .logo-cont {
    width: 40%;
    margin-right: 75px;
  }
}
@media (max-width: 1175px) {
  .resumulab .logo-cont {
    margin-top: 15px;
  }
}
@media (max-width: 768px) {
  .resumulab .logo-cont {
    width: 50%;
    margin-right: 0;
  }
}
.resumulab .logo-cont p {
  font-size: 24px;
  font-family: "TsukuMinPro", sans-serif;
  margin: 0 auto;
  margin-bottom: 5px;
}
@media (max-width: 768px) {
  .resumulab .logo-cont p {
    font-size: 20px;
    line-height: 1.4;
  }
}
@media (max-width: 480px) {
  .resumulab .logo-cont p {
    font-size: 16px;
  }
}
.resumulab .logo {
  max-width: 516px;
  height: auto;
  margin-top: 22px;
}
@media (max-width: 768px) {
  .resumulab .logo {
    margin-top: 8px;
  }
}
.resumulab .movie {
  background-color: #E6E6E6;
}
.resumulab .movie .inner {
  margin: 0 75px;
  padding-bottom: 40px;
}
@media (max-width: 768px) {
  .resumulab .movie .inner {
    margin: 0 1em;
  }
}
.resumulab .movie .inner .youtube {
  max-width: 1366px;
  margin: 0 auto;
  padding: 16px;
  border: 1px solid #ccc;
  background: #fff;
  -webkit-box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
          box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
}
@media (max-width: 768px) {
  .resumulab .movie .inner .youtube {
    padding: 10px;
  }
}
.resumulab .lead {
  background-color: #E6E6E6;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 90px;
  -webkit-box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
          box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
}
.resumulab .lead .inner {
  max-width: 1366px;
  padding-bottom: 60px;
}
.resumulab .lead .content {
  width: 100%;
  max-width: 743px;
  margin: 0 auto;
  text-align: center;
  position: relative;
}
@media (max-width: 786px) {
  .resumulab .lead .content {
    padding: 0 1rem;
  }
}
.resumulab .lead .left {
  font-family: "TsukuMinPro", sans-serif;
  text-align: left;
  margin-bottom: 3em;
}
.resumulab .lead .left li {
  font-size: 30px;
}
@media (max-width: 786px) {
  .resumulab .lead .left li {
    font-size: 18px;
  }
}
.resumulab .character {
  width: 200px;
  height: 329px;
  position: absolute;
  bottom: -2em;
  right: -10.5em;
}
@media (max-width: 1110px) {
  .resumulab .character {
    position: static;
    margin-top: 25px;
  }
}
.resumulab .box {
  position: relative;
  border: 3px solid #627357;
  padding: 2.5em 1.5em 1.5em;
  border-radius: 17px;
}
.resumulab .box h2 {
  position: absolute;
  font-family: "TsukuGoPro", sans-serif;
  font-size: 28px;
  font-weight: 600;
  color: #627357;
  top: 0;
  left: 50%;
  padding: 0 1em;
  margin: 0;
  -webkit-transform: translateY(-50%) translateX(-50%);
          transform: translateY(-50%) translateX(-50%);
  background-color: #E6E6E6;
  white-space: nowrap;
  max-width: calc(100% - 2em);
}
@media (max-width: 800px) {
  .resumulab .box h2 {
    position: static;
    -webkit-transform: none;
            transform: none;
    background-color: transparent;
    margin: 0 auto 1em;
    padding: 0;
    white-space: normal;
  }
}
@media (max-width: 800px) {
  .resumulab .box h2 {
    font-size: 24px;
  }
}
.resumulab .box .list {
  text-align: left;
  margin-left: 53px;
}
@media (max-width: 800px) {
  .resumulab .box .list {
    margin-left: 0;
  }
}
.resumulab .box .list-item {
  font-size: 21px;
}
.resumulab .box .list-item::before {
  content: "●";
  color: #627357;
  margin-right: 0.5em;
  font-size: 0.8em;
  line-height: 1;
  display: inline-block;
}
@media (max-width: 768px) {
  .resumulab .box .list-item {
    font-size: 18px;
    margin-bottom: 10px;
  }
}
.resumulab .fukanzu {
  text-align: center;
}
.resumulab .fukanzu .text img {
  width: auto;
  max-width: 200px;
  vertical-align: middle;
}
.resumulab .fukanzu .content {
  margin-bottom: 74px;
}
@media (max-width: 1300px) {
  .resumulab .fukanzu .content {
    margin-bottom: 30px;
  }
}
.resumulab .fukanzu .content li {
  font-size: 21px;
}
@media (max-width: 768px) {
  .resumulab .fukanzu .content li {
    font-size: 16px;
  }
}
.resumulab .fukanzu h2 {
  font-size: 27px;
  margin: 0 0 15px;
}
@media (max-width: 768px) {
  .resumulab .fukanzu h2 {
    font-size: 20px;
  }
}
.resumulab .fukanzu .strong {
  font-family: "TsukuMinPro", sans-serif;
  font-size: 40px;
  margin-bottom: 20px;
}
@media (max-width: 768px) {
  .resumulab .fukanzu .strong {
    font-size: 28px;
  }
}
.resumulab .fukanzu ruby {
  font-family: "TsukuMinPro", sans-serif;
  font-size: 40px;
}
@media (max-width: 768px) {
  .resumulab .fukanzu ruby {
    font-size: 28px;
  }
}
.resumulab .fukanzu rt {
  font-family: "TsukuMinPro", sans-serif;
  font-size: 17px;
  margin-bottom: 7px;
  letter-spacing: -1em;
}
@media (max-width: 768px) {
  .resumulab .fukanzu rt {
    font-size: 14px;
  }
}
.resumulab .fukanzu .link-area {
  position: relative;
  width: 1366px;
  height: 1350px;
  margin: 0 auto;
}
@media (max-width: 1365px) {
  .resumulab .fukanzu .link-area {
    width: 100%;
  }
}
@media (max-width: 1300px) {
  .resumulab .fukanzu .link-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    height: auto;
    gap: 30px;
    padding-bottom: 100px;
  }
  .resumulab .fukanzu .link-area ul {
    display: -ms-grid;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 50px 35px;
    width: 100%;
    padding: 0 3em;
    list-style: none;
  }
}
@media (max-width: 700px) {
  .resumulab .fukanzu .link-area ul {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    padding: 0 1em;
  }
}
.resumulab .fukanzu .link-area .zu {
  width: 717px;
  height: 1074px;
}
@media (max-width: 1300px) {
  .resumulab .fukanzu .link-area .zu {
    width: 100%;
    height: auto;
    max-width: 717px;
  }
}
@media (max-width: 768px) {
  .resumulab .fukanzu .link-area .zu {
    width: 88%;
  }
}
.resumulab .fukanzu .link-area .info-block {
  width: 330px;
  height: auto;
  position: absolute;
}
.resumulab .fukanzu .link-area .info-block:nth-child(1) {
  top: -64px;
  left: 115px;
}
.resumulab .fukanzu .link-area .info-block:nth-child(1) .icon {
  width: 147px;
  height: auto;
}
@media (max-width: 430px) {
  .resumulab .fukanzu .link-area .info-block:nth-child(1) .icon {
    width: 110px;
  }
}
.resumulab .fukanzu .link-area .info-block:nth-child(2) {
  top: 0;
  right: 200px;
}
.resumulab .fukanzu .link-area .info-block:nth-child(2) .icon {
  width: 216px;
  height: auto;
  margin-left: -135px;
}
@media (max-width: 1300px) {
  .resumulab .fukanzu .link-area .info-block:nth-child(2) .icon {
    margin-left: 0;
  }
}
@media (max-width: 430px) {
  .resumulab .fukanzu .link-area .info-block:nth-child(2) .icon {
    width: 157px;
  }
}
.resumulab .fukanzu .link-area .info-block:nth-child(3) {
  top: 458px;
  left: 111px;
}
.resumulab .fukanzu .link-area .info-block:nth-child(3) .icon {
  width: 268px;
  height: auto;
  margin-left: -74px;
}
@media (max-width: 1300px) {
  .resumulab .fukanzu .link-area .info-block:nth-child(3) .icon {
    margin-left: 0;
  }
}
@media (max-width: 430px) {
  .resumulab .fukanzu .link-area .info-block:nth-child(3) .icon {
    width: 195px;
  }
}
.resumulab .fukanzu .link-area .info-block:nth-child(4) {
  top: 427px;
  right: 44px;
}
.resumulab .fukanzu .link-area .info-block:nth-child(4) .icon {
  width: 156px;
  height: auto;
}
@media (max-width: 430px) {
  .resumulab .fukanzu .link-area .info-block:nth-child(4) .icon {
    width: 145px;
  }
}
.resumulab .fukanzu .link-area .info-block:nth-child(5) {
  top: 881px;
  left: 133px;
}
.resumulab .fukanzu .link-area .info-block:nth-child(5) .icon {
  width: 209px;
  height: auto;
}
@media (max-width: 430px) {
  .resumulab .fukanzu .link-area .info-block:nth-child(5) .icon {
    width: 180px;
  }
}
.resumulab .fukanzu .link-area .info-block:nth-child(6) {
  top: 863px;
  right: 224px;
}
.resumulab .fukanzu .link-area .info-block:nth-child(6) .icon {
  width: 228px;
  height: auto;
}
@media (max-width: 430px) {
  .resumulab .fukanzu .link-area .info-block:nth-child(6) .icon {
    width: 185px;
  }
}
.resumulab .fukanzu .link-area .info-block .title {
  font-family: "TsukuMinPro", sans-serif;
  font-size: 25px;
  font-weight: 600;
  color: #627357;
  text-align: left;
}
@media (max-width: 1300px) {
  .resumulab .fukanzu .link-area .info-block .title {
    text-align: center;
    margin-bottom: 5px;
  }
}
.resumulab .fukanzu .link-area .info-block .info {
  font-size: 18px;
  font-weight: 500;
  text-align: left;
  margin-bottom: 5px;
}
@media (max-width: 768px) {
  .resumulab .fukanzu .link-area .info-block .info {
    font-size: 16px;
    text-align: center;
  }
}
.resumulab .fukanzu .link-area .info-block .link {
  font-size: 18px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
}
.resumulab .fukanzu .link-area .info-block .link:hover {
  opacity: 0.7;
}
@media (max-width: 1300px) {
  .resumulab .fukanzu .link-area .info-block .link {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media (max-width: 1300px) {
  .resumulab .fukanzu .link-area .info-block {
    position: static;
    width: 100%;
    text-align: center;
  }
  .resumulab .fukanzu .link-area .info-block .icon {
    margin: 0 auto 10px;
    height: auto;
    margin-left: 0;
  }
}
.resumulab .library {
  -webkit-box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
          box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
  z-index: 100;
  position: relative;
}
.resumulab .library .inner {
  max-width: 1366px;
  padding-bottom: 60px;
  margin: 0 auto;
}
.resumulab .library h2 {
  font-size: 39px;
  text-align: center;
  margin-bottom: 30px;
}
@media (max-width: 768px) {
  .resumulab .library h2 {
    font-size: 30px;
  }
}
.resumulab .library .swiper {
  width: 1366px;
  margin: 0 auto;
}
@media screen and (max-width: 1365px) {
  .resumulab .library .swiper {
    width: 100%;
    padding: 0 16px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}
.resumulab .library .swiper .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
.resumulab .library .swiper .swiper-pagination {
  margin-top: 20px;
  text-align: center;
}
.resumulab .library .swiper .swiper-pagination .swiper-pagination-bullet {
  width: 15px;
  height: 15px;
  background-color: #ffffff;
  opacity: 1;
  margin: 0 6px;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.resumulab .library .swiper .swiper-pagination .swiper-pagination-bullet-active {
  background-color: #000000;
}
.resumulab .syacho {
  background-color: #D7D4CC;
  -webkit-box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
          box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
  margin-bottom: 60px;
}
.resumulab .syacho .inner {
  max-width: 1366px;
  margin: 0 auto;
  padding: 70px 20px 90px;
  overflow-x: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media (max-width: 768px) {
  .resumulab .syacho .inner {
    padding: 50px 1em 100px;
  }
}
.resumulab .syacho h2 {
  font-size: 36px;
  text-align: center;
  margin-bottom: 40px;
}
@media (max-width: 768px) {
  .resumulab .syacho h2 {
    font-size: 28px;
  }
}
.resumulab .syacho .coming {
  font-size: 20px;
  text-align: center;
}
.resumulab .syacho .content {
  display: -ms-grid;
  display: grid;
  gap: 30px;
  -ms-grid-columns: minmax(0, 1fr) 30px minmax(0, 1fr) 30px minmax(0, 1fr);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  list-style: none;
  padding: 0;
  max-width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
@media (max-width: 1365px) {
  .resumulab .syacho .content {
    -ms-grid-columns: (minmax(0, 1fr))[2];
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 768px) {
  .resumulab .syacho .content {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 80px;
  }
}
.resumulab .syacho .content .youtube {
  width: 100%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
}
@media (max-width: 768px) {
  .resumulab .syacho .content .youtube {
    aspect-ratio: auto;
  }
}
.resumulab .syacho .content .youtube iframe {
  width: 100%;
  aspect-ratio: 16/9;
  display: block;
}
.resumulab .syacho .content .youtube .caption {
  margin-top: 20px;
  text-align: center;
  font-size: 22px;
  font-family: "TsukuMinPro", sans-serif;
}
@media (max-width: 768px) {
  .resumulab .syacho .content .youtube .caption {
    font-size: 18px;
    margin-top: 10px;
  }
}
.resumulab .resumu-event {
  -webkit-box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
          box-shadow: 7px 7px 5px rgba(35, 24, 21, 0.3);
  z-index: 100;
  position: relative;
}
.resumulab .resumu-event .inner {
  max-width: 1366px;
  margin: 0 auto;
  text-align: center;
  padding: 0 1em;
  padding-bottom: 70px;
}
.resumulab .resumu-event h2 {
  font-size: 36px;
  font-weight: 400;
  margin-bottom: 20px;
}
@media (max-width: 768px) {
  .resumulab .resumu-event h2 {
    font-size: 30px;
  }
}
.resumulab .resumu-event .info {
  font-size: 23px;
  margin-bottom: 40px;
}
@media (max-width: 768px) {
  .resumulab .resumu-event .info {
    font-size: 18px;
  }
}
.resumulab .resumu-event .content {
  width: 100%;
  max-width: var(--width__section);
  margin-inline: auto;
  display: -ms-grid;
  display: grid;
  gap: 2em;
}
@media screen and (min-width: 420px) {
  .resumulab .resumu-event .content {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 768px) {
  .resumulab .resumu-event .content {
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3, 1fr);
  }
}
.resumulab .resumu-event .content .event-block {
  padding: 1em;
}
.resumulab .resumu-event .content .event-block:hover {
  background-color: #f0efed;
}
.resumulab .resumu-event .content .event-block a:hover {
  opacity: 1;
}
.resumulab .resumu-event .content .event-block p {
  margin: 0;
}
.resumulab .resumu-event .content .event-block .meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-block: 0.5em;
  font-weight: var(--font__weight-regular);
}
.resumulab .resumu-event .content .event-block .meta .reservation {
  font-size: 15px;
  --clamp-root-font-size: 16;
  padding: 0 0.5em;
  margin-right: 0.5em;
  background-color: var(--color__background-text);
  color: var(--color__white);
  --clamp-min: 14;
  --clamp-max: 16;
}
.resumulab .resumu-event .content .event-block .meta .cat_item {
  font-size: 15px;
  --clamp-root-font-size: 16;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0 0.5em;
  --clamp-min: 12;
  --clamp-max: 16;
  border: 1px solid var(--color__border-text);
}
.resumulab .resumu-event .content .event-block .title {
  text-align: left;
  margin: 0;
  font-weight: var(--font__weight-demibold);
  --clamp-min: 16;
  --clamp-max: 20;
}
.resumulab .resumu-event .content .event-block .date {
  text-align: left;
  font-weight: var(--font__weight-regular);
  --clamp-min: 16;
  --clamp-max: 18;
}
.resumulab .access {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 1366px;
  margin: 0 auto;
}
@media (max-width: 1200px) {
  .resumulab .access {
    display: block;
  }
}
.resumulab .access .img-area {
  width: 56%;
}
@media (max-width: 1200px) {
  .resumulab .access .img-area {
    width: 100%;
  }
}
.resumulab .access .info-area {
  width: 44%;
  text-align: center;
  padding: 40px;
}
@media (max-width: 1200px) {
  .resumulab .access .info-area {
    margin: 0 auto;
    width: 100%;
  }
}
@media (max-width: 1200px) {
  .resumulab .access .info-area {
    padding: 40px 1em;
  }
}
.resumulab .access .info-area .logo {
  width: 80%;
  height: auto;
  margin: 0;
  margin-bottom: 18px;
}
.resumulab .access .info-area .yoyaku {
  width: 182px;
  height: auto;
  font-size: 23px;
  font-family: "TsukuMinPro", sans-serif;
  border: solid 1px #523132;
  margin: 0 auto;
  margin-bottom: 30px;
}
@media (max-width: 768px) {
  .resumulab .access .info-area .yoyaku {
    font-size: 20px;
  }
}
.resumulab .access .info-area .content {
  text-align: left;
  margin-bottom: 37px;
}
@media (max-width: 1365px) {
  .resumulab .access .info-area .content {
    width: 390px;
    margin: 0 auto 30px;
  }
}
@media (max-width: 420px) {
  .resumulab .access .info-area .content {
    width: 100%;
  }
}
.resumulab .access .info-area .content li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.resumulab .access .info-area .content .label {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: 6em;
  display: inline-block;
  font-size: 16px;
}
.resumulab .access .info-area .content .text {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 16px;
}
.resumulab .access .map-container {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  height: 0;
  margin: 0 auto;
}
.resumulab .access .map-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
@media (min-width: 768px) {
  .resumulab .access .map-container {
    width: auto;
    height: 303px;
    padding-top: 0;
  }
}
.resumulab .access .btn {
  display: block;
  width: 393px;
  height: 69px;
  padding: 15px 0;
  margin: auto;
  background: #523132;
  color: #FFF;
  text-decoration: none;
  text-align: center;
  border-radius: 34px;
  font-size: 24px;
  margin-top: 30px;
  -webkit-transition-property: background-color;
  transition-property: background-color;
  -webkit-transition-duration: 0.5s;
          transition-duration: 0.5s;
}
@media (max-width: 510px) {
  .resumulab .access .btn {
    width: 94%;
    height: auto;
    font-size: 18px;
  }
}
.resumulab .access .btn:hover {
  background: #225f0d;
}
.resumulab .first {
  position: relative;
  margin-bottom: 7px;
}
.resumulab .first .title-box {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  background-color: #fff;
  text-align: center;
  width: 377px;
  height: 250px;
  padding: 30px;
}
@media (max-width: 768px) {
  .resumulab .first .title-box {
    width: 184px;
    height: 102px;
    padding: 10px 3px;
  }
}
.resumulab .first .sub-logo {
  width: 70%;
  margin-bottom: 21px;
}
@media (max-width: 768px) {
  .resumulab .first .sub-logo {
    width: 65%;
    margin-bottom: 8px;
  }
}
.resumulab .first h1 {
  margin: 0;
  line-height: 1.4;
  font-size: 38.3px;
  margin-bottom: 14px;
}
@media (max-width: 768px) {
  .resumulab .first h1 {
    font-size: 20px;
    margin-bottom: 0;
  }
}
.resumulab .first .english {
  font-size: 18px;
}
@media (max-width: 768px) {
  .resumulab .first .english {
    display: none;
  }
}
.resumulab .links {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  margin-bottom: 50px;
}
@media (max-width: 768px) {
  .resumulab .links {
    margin-bottom: 7px;
  }
}
.resumulab .links .img-pc, .resumulab .links .img-sp {
  display: block;
  width: 100%;
  height: auto;
}
.resumulab .links .img-pc {
  display: block;
}
.resumulab .links .img-sp {
  display: none;
}
@media (max-width: 768px) {
  .resumulab .links .img-pc {
    display: none;
  }
  .resumulab .links .img-sp {
    display: block;
  }
}
.resumulab .button {
  position: absolute;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 7px;
  padding: 12px 15px;
  background-color: rgba(255, 255, 255, 0.75);
  border: 2px solid #2B5844;
  text-decoration: none;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); /* 座標をボタン中心に合わせる */
  -webkit-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
          box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
  -webkit-transition: background-color 0.25s ease, opacity 0.2s ease, -webkit-transform 0.2s ease;
  transition: background-color 0.25s ease, opacity 0.2s ease, -webkit-transform 0.2s ease;
  transition: background-color 0.25s ease, transform 0.2s ease, opacity 0.2s ease;
  transition: background-color 0.25s ease, transform 0.2s ease, opacity 0.2s ease, -webkit-transform 0.2s ease;
  /* SPの見た目（テキストのみ隠して、アイコンは表示） */
}
.resumulab .button.beige {
  border: 2px solid #B87F35;
}
.resumulab .button:hover {
  background-color: #fff;
  opacity: 1;
}
.resumulab .button .button-text {
  font-size: 19px;
  line-height: 1.3;
}
.resumulab .button .button-icon {
  width: 26px;
  height: auto;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
.resumulab .button .button-num {
  display: none;
}
@media (max-width: 820px) {
  .resumulab .button {
    padding: 0;
    width: 48px;
    height: 48px;
    border: none;
    border-radius: 50%;
    background-color: #2B5844;
    border: 2px solid #fff;
    color: #fff;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    font-weight: 700;
    font-size: 16px;
    line-height: 1;
    -webkit-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
  }
  .resumulab .button.beige {
    border: 2px solid #fff;
    background-color: #B87F35;
  }
  .resumulab .button .button-num {
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
  }
  .resumulab .button .button-text, .resumulab .button .button-icon {
    display: none;
  }
}
.resumulab .circle {
  position: absolute;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background-color: #2B5844;
  border: 2px solid #fff;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.resumulab .circle.beige {
  background-color: #B87F35;
}
@media (max-width: 820px) {
  .resumulab .circle {
    width: 48px;
    height: 48px;
  }
}
.resumulab .circle .circle-text {
  color: #fff;
  font-size: 26px;
}
@media (max-width: 820px) {
  .resumulab .circle .circle-text {
    font-size: 16px;
  }
}
.resumulab .comfort {
  /* SPは画像差し替えに合わせて再配置（必要に応じて個別に） */
}
.resumulab .comfort .button-a {
  top: 17%;
  left: 48%;
}
.resumulab .comfort .button-b {
  top: 62%;
  left: 29%;
}
.resumulab .comfort .button-c {
  top: 53%;
  left: 76%;
}
.resumulab .comfort .button-d {
  top: 80%;
  left: 67%;
}
.resumulab .comfort .circle_maru-a {
  top: 27%;
  left: 40%;
}
@media (max-width: 820px) {
  .resumulab .comfort .button-a {
    top: 19%;
    left: 38%;
  }
  .resumulab .comfort .button-b {
    top: 64%;
    left: 24%;
  }
  .resumulab .comfort .button-c {
    top: 56%;
    left: 85%;
  }
  .resumulab .comfort .button-d {
    top: 84%;
    left: 72%;
  }
  .resumulab .comfort .circle_maru-a {
    display: none;
  }
}
.resumulab .traditional {
  /* SPは画像差し替えに合わせて再配置（必要に応じて個別に） */
}
.resumulab .traditional .button-a {
  top: 17%;
  left: 43%;
}
.resumulab .traditional .button-b {
  top: 64%;
  left: 44%;
}
.resumulab .traditional .button-c {
  top: 19%;
  left: 76%;
}
.resumulab .traditional .circle_maru-a {
  top: 26%;
  left: 39%;
}
.resumulab .traditional .circle_maru-b {
  top: 27%;
  left: 72%;
}
@media (max-width: 820px) {
  .resumulab .traditional .button-a {
    top: 21%;
    left: 24%;
  }
  .resumulab .traditional .button-b {
    top: 69%;
    left: 19%;
  }
  .resumulab .traditional .button-c {
    top: 15%;
    left: 74%;
  }
  .resumulab .traditional .circle_maru-a {
    display: none;
  }
  .resumulab .traditional .circle_maru-b {
    display: none;
  }
}
.resumulab .value {
  /* SPは画像差し替えに合わせて再配置（必要に応じて個別に） */
}
.resumulab .value .button-a {
  top: 50%;
  left: 32%;
}
.resumulab .value .button-b {
  top: 56%;
  left: 76%;
}
@media (max-width: 820px) {
  .resumulab .value .button-a {
    top: 69%;
    left: 22%;
  }
  .resumulab .value .button-b {
    top: 54%;
    left: 79%;
  }
}
.resumulab .exterior {
  /* SPは画像差し替えに合わせて再配置（必要に応じて個別に） */
}
.resumulab .exterior .button-a {
  top: 12%;
  left: 51%;
}
.resumulab .exterior .button-b {
  top: 42%;
  left: 66%;
}
.resumulab .exterior .button-c {
  top: 19%;
  left: 76%;
}
.resumulab .exterior .button-d {
  top: 31%;
  left: 14%;
}
.resumulab .exterior .button-e {
  top: 64%;
  left: 15%;
}
.resumulab .exterior .circle_maru-a {
  top: 21%;
  left: 48%;
}
.resumulab .exterior .circle_maru-b {
  top: 40%;
  left: 11%;
}
.resumulab .exterior .circle_maru-c {
  top: 53%;
  left: 70%;
}
@media (max-width: 820px) {
  .resumulab .exterior .button-a {
    top: 13%;
    left: 51%;
  }
  .resumulab .exterior .button-b {
    display: none;
  }
  .resumulab .exterior .button-c {
    top: 25%;
    left: 87%;
  }
  .resumulab .exterior .button-d {
    top: 23%;
    left: 12%;
  }
  .resumulab .exterior .button-e {
    display: none;
  }
  .resumulab .exterior .circle_maru-a {
    display: none;
  }
  .resumulab .exterior .circle_maru-b {
    display: none;
  }
  .resumulab .exterior .circle_maru-c {
    top: 44%;
    left: 72%;
  }
}
.resumulab .floorplan {
  /* SPは画像差し替えに合わせて再配置（必要に応じて個別に） */
}
.resumulab .floorplan .button-a {
  top: 12%;
  left: 51%;
}
.resumulab .floorplan .button-b {
  top: 42%;
  left: 15%;
}
.resumulab .floorplan .button-c {
  top: 63%;
  left: 24%;
}
.resumulab .floorplan .button-d {
  top: 91%;
  left: 77%;
}
.resumulab .floorplan .circle_maru-a {
  top: 72%;
  left: 33%;
}
.resumulab .floorplan .circle_maru-b {
  top: 39%;
  left: 79%;
}
.resumulab .floorplan .circle_maru-c {
  top: 82%;
  left: 71%;
}
.resumulab .floorplan .circle_maru-d {
  top: 81%;
  left: 13%;
}
@media (max-width: 820px) {
  .resumulab .floorplan .button-a {
    display: none;
  }
  .resumulab .floorplan .button-b {
    top: 33%;
    left: 17%;
  }
  .resumulab .floorplan .button-c {
    top: 13%;
    left: 51%;
  }
  .resumulab .floorplan .button-d {
    display: none;
  }
  .resumulab .floorplan .circle_maru-a {
    top: 64%;
    left: 31%;
  }
  .resumulab .floorplan .circle_maru-b {
    top: 33%;
    left: 88%;
  }
  .resumulab .floorplan .circle_maru-c {
    top: 87%;
    left: 75%;
  }
  .resumulab .floorplan .circle_maru-d {
    top: 89%;
    left: 11%;
  }
}
.resumulab .passive {
  /* SPは画像差し替えに合わせて再配置（必要に応じて個別に） */
}
.resumulab .passive .button-a {
  top: 44%;
  left: 39%;
}
.resumulab .passive .button-b {
  top: 22%;
  left: 76%;
}
.resumulab .passive .button-c {
  top: 41%;
  left: 74%;
}
.resumulab .passive .button-d {
  top: 27%;
  left: 57%;
}
.resumulab .passive .button-e {
  top: 55%;
  left: 66%;
}
.resumulab .passive .button-f {
  top: 52%;
  left: 17%;
}
.resumulab .passive .circle_maru-a {
  top: 35%;
  left: 44%;
}
.resumulab .passive .circle_maru-b {
  top: 14%;
  left: 83%;
}
.resumulab .passive .circle_maru-c {
  top: 33%;
  left: 79%;
}
@media (max-width: 820px) {
  .resumulab .passive .button-a {
    display: none;
  }
  .resumulab .passive .button-b {
    display: none;
  }
  .resumulab .passive .button-c {
    display: none;
  }
  .resumulab .passive .button-d {
    display: none;
  }
  .resumulab .passive .button-e {
    top: 57%;
    left: 46%;
  }
  .resumulab .passive .button-f {
    top: 43%;
    left: 15%;
  }
  .resumulab .passive .circle_maru-a {
    top: 26%;
    left: 35%;
  }
  .resumulab .passive .circle_maru-b {
    top: 16%;
    left: 82%;
  }
  .resumulab .passive .circle_maru-c {
    top: 36%;
    left: 62%;
  }
}
.resumulab .colorlabel {
  margin-bottom: 60px;
  position: relative;
}
@media (max-width: 768px) {
  .resumulab .colorlabel {
    margin-bottom: 40px;
  }
}
.resumulab .colorlabel .text {
  font-size: 30px;
  line-height: 1.6;
}
.resumulab .colorlabel .text.white {
  color: #fff;
}
@media (max-width: 900px) {
  .resumulab .colorlabel .text {
    font-size: 24px;
  }
}
.resumulab .colorlabel.value {
  background-color: #2B5844;
}
.resumulab .colorlabel.exterior {
  background-color: #9C543D;
}
.resumulab .colorlabel.comfort {
  background-color: #CBBE8E;
}
.resumulab .colorlabel.traditional {
  background-color: #2E5473;
}
.resumulab .colorlabel.floorplan {
  background-color: #B87F35;
}
.resumulab .colorlabel.passive {
  background-color: #C2A895;
}
.resumulab .inner-label {
  max-width: 1100px;
  height: 135px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 0 1em;
}
.resumulab .inner-label.one {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media (max-width: 768px) {
  .resumulab .inner-label {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    display: block;
    text-align: center;
    padding: 30px 1em 20px;
  }
}
.resumulab .label-img {
  z-index: 100;
  height: auto;
}
@media (max-width: 768px) {
  .resumulab .label-img {
    margin-bottom: 20px;
  }
}
.resumulab .label-img.comfort-1 {
  width: 190px;
  margin-top: 36px;
}
@media (max-width: 900px) {
  .resumulab .label-img.comfort-1 {
    width: 100px;
    margin-top: 0;
  }
}
.resumulab .label-img.comfort-2 {
  width: 154px;
  margin-top: 22px;
}
@media (max-width: 900px) {
  .resumulab .label-img.comfort-2 {
    width: 110px;
    margin-top: 0;
  }
}
.resumulab .label-img.comfort-3 {
  width: 123px;
  margin-top: 0;
}
@media (max-width: 900px) {
  .resumulab .label-img.comfort-3 {
    width: 80px;
  }
}
.resumulab .label-img.comfort-4 {
  position: absolute;
  width: 70px;
  margin-top: 0;
  margin-right: 530px;
}
@media (max-width: 768px) {
  .resumulab .label-img.comfort-4 {
    position: static;
    margin: 0 auto;
    margin-bottom: 20px;
    width: 60px;
  }
}
.resumulab .label-img.traditional-1 {
  width: 180px;
}
@media (max-width: 900px) {
  .resumulab .label-img.traditional-1 {
    width: 100px;
  }
}
.resumulab .label-img.traditional-2 {
  width: 153px;
}
@media (max-width: 900px) {
  .resumulab .label-img.traditional-2 {
    width: 100px;
  }
}
.resumulab .label-img.value-1 {
  width: 78px;
}
@media (max-width: 900px) {
  .resumulab .label-img.value-1 {
    width: 50px;
  }
}
.resumulab .label-img.value-2 {
  width: 153px;
}
@media (max-width: 900px) {
  .resumulab .label-img.value-2 {
    width: 100px;
  }
}
.resumulab .label-img.exterior-1 {
  width: 123px;
}
@media (max-width: 900px) {
  .resumulab .label-img.exterior-1 {
    width: 110px;
  }
}
.resumulab .label-img.exterior-2 {
  width: 100px;
  margin-top: -43px;
  margin-right: 28px;
}
@media (max-width: 920px) {
  .resumulab .label-img.exterior-2 {
    width: 70px;
    margin-bottom: -41px;
  }
}
@media (max-width: 768px) {
  .resumulab .label-img.exterior-2 {
    width: 70px;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}
.resumulab .label-img.exterior-3 {
  width: 145px;
}
@media (max-width: 900px) {
  .resumulab .label-img.exterior-3 {
    width: 100px;
  }
}
.resumulab .label-img.floorplan-1 {
  width: 77px;
}
@media (max-width: 900px) {
  .resumulab .label-img.floorplan-1 {
    width: 75px;
  }
}
.resumulab .label-img.floorplan-2 {
  width: 150px;
  margin-right: 30px;
}
@media (max-width: 819px) {
  .resumulab .label-img.floorplan-2 {
    width: 120px;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}
.resumulab .label-img.floorplan-3 {
  width: 70px;
  margin-left: 80px;
}
@media (max-width: 900px) {
  .resumulab .label-img.floorplan-3 {
    width: 66px;
    margin-left: 0;
  }
}
.resumulab .label-img.floorplan-4 {
  width: 68px;
  margin-left: 80px;
}
@media (max-width: 900px) {
  .resumulab .label-img.floorplan-4 {
    width: 78px;
    margin-left: 0;
  }
}
.resumulab .label-img.passive-1 {
  width: 117px;
  margin-left: 80px;
}
@media (max-width: 900px) {
  .resumulab .label-img.passive-1 {
    width: 78px;
    margin-left: 0;
  }
}
.resumulab .label-img.passive-2 {
  width: 100px;
  margin-top: -43px;
  margin-right: 28px;
}
@media (max-width: 920px) {
  .resumulab .label-img.passive-2 {
    width: 70px;
    margin-bottom: -41px;
  }
}
@media (max-width: 768px) {
  .resumulab .label-img.passive-2 {
    width: 70px;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}
.resumulab .label-img.passive-3 {
  width: 142px;
  margin-left: 80px;
}
@media (max-width: 900px) {
  .resumulab .label-img.passive-3 {
    width: 87px;
    margin-left: 0;
  }
}
.resumulab .label-img.passive-4 {
  width: 172px;
}
@media (max-width: 900px) {
  .resumulab .label-img.passive-4 {
    width: 100px;
  }
}
.resumulab .hammers {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 768px) {
  .resumulab .hammers {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 35px;
  }
}
.resumulab .icon-hammer {
  width: 127px;
  height: auto;
  z-index: 100;
}
@media (max-width: 900px) {
  .resumulab .icon-hammer {
    width: 75px;
  }
}
.resumulab .icon-saw {
  width: 105px;
  height: auto;
  z-index: 100;
}
@media (max-width: 900px) {
  .resumulab .icon-saw {
    width: 75px;
  }
}
.resumulab .fukidashi {
  position: relative;
  display: inline-block;
  margin-right: 20px;
  padding: 13px 10px;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  border-radius: 9.6px;
  background-color: #fff;
  text-align: left;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.5;
  color: #000000;
}
@media (max-width: 768px) {
  .resumulab .fukidashi {
    padding: 10px;
    font-size: 16px;
  }
}
.resumulab .fukidashi::after {
  content: "";
  position: absolute;
  top: 63%;
  right: 0;
  border-style: solid;
  border-width: 6.5px 0 6.5px 26px;
  border-color: transparent transparent transparent #fff;
  translate: 100% -50%;
}
@media (max-width: 900px) {
  .resumulab .resumu-sub .inner {
    padding: 0 1em;
  }
}
.resumulab .cols-1 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: 40px;
  max-width: 889px;
  margin: 0 auto;
  margin-bottom: 50px;
}
@media (max-width: 768px) {
  .resumulab .cols-1 {
    gap: 24px;
    margin-bottom: 40px;
  }
}
.resumulab .cols-2 {
  max-width: 1052px;
  height: auto;
  margin: 0 auto;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  margin-bottom: 80px;
}
@media (max-width: 900px) {
  .resumulab .cols-2 {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 24px;
  }
}
.resumulab .col2-item {
  text-align: center;
  position: relative;
  border: 4px dotted #B87F35;
  border-right: none;
  padding: 15px 25px;
}
.resumulab .col2-item:last-child {
  border: 4px dotted #B87F35;
}
.resumulab .col2-item.yoko {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media (max-width: 900px) {
  .resumulab .col2-item.yoko {
    display: block;
  }
}
@media (max-width: 900px) {
  .resumulab .col2-item {
    border-right: 4px dotted #B87F35;
  }
}
.resumulab .col2-item h3 {
  font-size: 20px;
  text-align: center;
  margin-top: 15px;
  margin-bottom: 15px;
}
.resumulab .col2-item .comfort-text {
  font-size: 18px;
  text-align: left;
}
@media (max-width: 768px) {
  .resumulab .col2-item .comfort-text {
    font-size: 16px;
  }
}
.resumulab .col2-item .text {
  font-size: 18px;
  text-align: left;
}
@media (max-width: 768px) {
  .resumulab .col2-item .text {
    font-size: 16px;
  }
}
.resumulab .col2-item .text.yoko {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 18px;
}
@media (max-width: 900px) {
  .resumulab .col2-item .text.yoko {
    margin-left: 0;
  }
}
.resumulab .cols-1-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  border: 4px dotted #B87F35;
  max-width: 1052px;
  height: auto;
  margin: 0 auto;
  padding: 25px 25px;
  gap: 20px;
}
.resumulab .cols-1-box.pass {
  margin-top: -4px;
}
@media (max-width: 900px) {
  .resumulab .cols-1-box {
    display: block;
    padding: 25px;
  }
}
.resumulab .cols-1-box.none {
  border: none;
  gap: 20px;
  padding: 0;
  margin-bottom: 30px;
}
.resumulab .col-1-media {
  position: relative;
  width: 50%;
}
@media (max-width: 900px) {
  .resumulab .col-1-media {
    width: 100%;
  }
}
.resumulab .col-1-imges {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-right: 30px;
}
@media (max-width: 900px) {
  .resumulab .col-1-imges {
    display: block;
    margin-right: 0;
  }
}
.resumulab .col-1-text {
  width: 50%;
}
@media (max-width: 900px) {
  .resumulab .col-1-text {
    width: 100%;
  }
}
.resumulab .col-1-text h3 {
  font-size: 22px;
  color: #B87F35;
}
@media (max-width: 768px) {
  .resumulab .col-1-text h3 {
    font-size: 20px;
  }
}
.resumulab .col-1-text p {
  font-size: 18px;
}
@media (max-width: 768px) {
  .resumulab .col-1-text p {
    font-size: 16px;
  }
}
.resumulab .col-badge {
  position: absolute;
  top: 40px;
  left: 40px;
  z-index: 2;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-decoration: none;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  padding: 0;
  width: 65px;
  height: 65px;
  border-radius: 50%;
  background-color: #2B5844;
  border: 2px solid #fff;
  color: #fff;
  font-weight: 700;
  font-size: 23px;
  line-height: 1;
}
.resumulab .col-badge.beige {
  background-color: #B87F35;
}
@media (max-width: 900px) {
  .resumulab .col-badge.beige {
    top: 30px;
    left: 30px;
  }
}
@media (max-width: 768px) {
  .resumulab .col-badge {
    width: 48px;
    height: 48px;
    font-size: 16px;
  }
}
.resumulab .col-badge.none {
  display: none;
}
@media (max-width: 768px) {
  .resumulab .col-badge.one {
    top: 10px;
    left: 10px;
  }
}
.resumulab .col-text {
  max-width: 1052px;
  height: auto;
  margin: 0 auto;
}
.resumulab .col-text p {
  font-size: 20px;
}
@media (max-width: 768px) {
  .resumulab .col-text p {
    font-size: 18px;
  }
}
.resumulab .col-text p .highlight {
  font-size: 20px;
  color: #B87F35;
}
@media (max-width: 768px) {
  .resumulab .col-text p .highlight {
    font-size: 18px;
  }
}
.resumulab .accent-box {
  max-width: 890px;
  height: auto;
  text-align: center;
  margin: 0 auto;
  margin-bottom: 80px;
  padding: 15px 0;
  color: #B87F35;
  border: 4px solid #B87F35;
  border-radius: 22px;
}
.resumulab .accent-box .red {
  color: #B03630;
  font-size: 26px;
}
@media (max-width: 768px) {
  .resumulab .accent-box .red {
    font-size: 22px;
    line-height: 1.6;
  }
}
.resumulab .accent-box h3 {
  font-size: 26px;
}
@media (max-width: 768px) {
  .resumulab .accent-box h3 {
    font-size: 22px;
    line-height: 1.6;
  }
}
.resumulab .accent-box p {
  font-size: 22px;
}
@media (max-width: 768px) {
  .resumulab .accent-box p {
    font-size: 18px;
    line-height: 1.6;
  }
}
.resumulab .accent-box-red {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  max-width: 1052px;
  height: auto;
  text-align: center;
  margin: 0 auto;
  margin-bottom: 80px;
  padding: 30px 10px;
  color: #fff;
  background-color: #983800;
}
@media (max-width: 940px) {
  .resumulab .accent-box-red {
    display: block;
    padding: 25px 20px;
  }
}
.resumulab .accent-box-red p {
  font-size: 21px;
  font-family: "TsukuMinPro", sans-serif;
  text-align: left;
  margin: 0 auto;
}
@media (max-width: 768px) {
  .resumulab .accent-box-red p {
    font-size: 18px;
    line-height: 1.6;
  }
}
.resumulab .accent-box-red .hammer-comfort {
  position: absolute;
  width: 87px;
  height: auto;
  -webkit-transform: scale(-1, 1);
          transform: scale(-1, 1);
  top: 11%;
  left: 9%;
}
@media (max-width: 940px) {
  .resumulab .accent-box-red .hammer-comfort {
    position: static;
    margin-bottom: 20px;
  }
}
.resumulab .highlight-box {
  background-color: #B87F35;
  max-width: 1052px;
  height: auto;
  margin: 0 auto;
  text-align: center;
  padding: 15px 25px;
  margin-bottom: -4px;
}
.resumulab .highlight-box.comfort {
  margin-top: -4px;
  margin-bottom: 90px;
}
@media (max-width: 768px) {
  .resumulab .highlight-box {
    text-align: left;
  }
}
.resumulab .highlight-box p {
  font-size: 21px;
  color: #fff;
  font-family: "TsukuGoPro", sans-serif;
}
@media (max-width: 768px) {
  .resumulab .highlight-box p {
    font-size: 18px;
  }
}
.resumulab .cols-3 {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 24px 1fr 24px 1fr;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  max-width: 1052px;
  margin: 0 auto;
  margin-bottom: 80px;
}
@media (max-width: 1024px) {
  .resumulab .cols-3 {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 767px) {
  .resumulab .cols-3 {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}
.resumulab .cols-3 .col-item {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 336px;
  height: 224px;
  padding: 15px;
  border: 3px solid #B87F35;
  border-radius: 20px;
  margin: 0 auto;
}
.resumulab .cols-3 .col-item:first-child {
  background-color: #B87F35;
}
.resumulab .cols-3 .col-3-num {
  position: absolute;
  top: 0;
  left: 5%;
  font-size: 33px;
  color: #B87F35;
}
.resumulab .cols-3 h3 {
  color: #fff;
  font-size: 22px;
}
.resumulab .cols-3 p {
  font-size: 18px;
  letter-spacing: -0.6px;
  margin-bottom: -15px;
}
.resumulab .traditional-media {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 20px 1fr 20px 1fr 20px 1fr;
  grid-template-columns: repeat(4, 1fr);
  -ms-grid-rows: auto;
  grid-template-rows: auto;
  gap: 20px;
  max-width: 1052px;
  margin: 0 auto;
  margin-bottom: 60px;
  /* 画像の共通スタイル */
  /* === PCレイアウト === */
  /* 2行目: subを1列で4つ */
  /* === タブレット（2列） === */
}
.resumulab .traditional-media > *:nth-child(1) {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
}
.resumulab .traditional-media > *:nth-child(2) {
  -ms-grid-row: 1;
  -ms-grid-column: 3;
}
.resumulab .traditional-media > *:nth-child(3) {
  -ms-grid-row: 1;
  -ms-grid-column: 5;
}
.resumulab .traditional-media > *:nth-child(4) {
  -ms-grid-row: 1;
  -ms-grid-column: 7;
}
.resumulab .traditional-media .tra-media {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}
.resumulab .traditional-media .main-area-1 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-area: 1/1/2/3;
}
.resumulab .traditional-media .main-area-2 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 3;
  -ms-grid-column-span: 2;
  grid-area: 1/3/2/5;
}
.resumulab .traditional-media .sub-area-1 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-area: 2/1/3/2;
}
.resumulab .traditional-media .sub-area-2 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-area: 2/2/3/3;
}
.resumulab .traditional-media .sub-area-3 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 3;
  -ms-grid-column-span: 1;
  grid-area: 2/3/3/4;
}
.resumulab .traditional-media .sub-area-4 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 4;
  -ms-grid-column-span: 1;
  grid-area: 2/4/3/5;
}
@media (max-width: 1024px) {
  .resumulab .traditional-media {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
    /* === スマホ（1列） === */
  }
  .resumulab .traditional-media .traditional-item {
    grid-area: auto !important;
  }
  .resumulab .traditional-media .main-area-1,
  .resumulab .traditional-media .main-area-2 {
    grid-column: 1/-1;
  }
}
@media (max-width: 1024px) and (max-width: 768px) {
  .resumulab .traditional-media {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}
.resumulab .floorplan-media {
  max-width: 1052px;
  margin: 0 auto;
  margin-bottom: 40px;
}
.resumulab .floorplan-media .top,
.resumulab .floorplan-media .bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 20px;
}
@media (max-width: 1040px) {
  .resumulab .floorplan-media .top {
    display: block;
  }
}
@media (max-width: 700px) {
  .resumulab .floorplan-media .bottom {
    display: block;
  }
}
.resumulab .point-box {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
  background-color: #E8D6BE;
  border: 5px solid #B87F35;
  border-radius: 56px;
  padding: 20px 20px;
}
.resumulab .point-box .content {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media (max-width: 768px) {
  .resumulab .point-box .content {
    display: block;
  }
}
.resumulab .point-box h3 {
  font-size: 40px;
  font-weight: 600;
}
@media (max-width: 820px) {
  .resumulab .point-box h3 {
    font-size: 30px;
  }
}
.resumulab .point-box img {
  width: 130px;
  height: auto;
  margin-top: -32px;
  margin-right: 28px;
}
@media (max-width: 768px) {
  .resumulab .point-box img {
    width: 88px;
    margin-top: 10px;
    margin-right: 0;
    margin-bottom: 15px;
  }
}
.resumulab .point-box p {
  width: 70%;
  font-size: 20px;
  text-align: left;
}
@media (max-width: 768px) {
  .resumulab .point-box p {
    width: 100%;
    font-size: 18px;
  }
}
.resumulab .col-img {
  display: block;
  height: auto;
  margin: 0 auto;
  margin-bottom: 25px;
}
@media (max-width: 900px) {
  .resumulab .col-img {
    margin-bottom: 20px;
  }
}
.resumulab .col-img.comfort-1 {
  width: 340px;
  margin-left: 30px;
}
@media (max-width: 900px) {
  .resumulab .col-img.comfort-1 {
    width: 260px;
    margin-left: auto;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.comfort-2 {
  width: 372px;
  margin-right: 25px;
  margin-bottom: 49px;
}
@media (max-width: 900px) {
  .resumulab .col-img.comfort-2 {
    width: 280px;
    margin-right: auto;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.comfort-3 {
  width: 100%;
  padding: 27px;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.comfort-3 {
    width: 300px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.comfort-4 {
  width: 372px;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.comfort-4 {
    width: 250px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.traditional-1 {
  width: 100%;
}
@media (max-width: 900px) {
  .resumulab .col-img.traditional-1 {
    max-width: 500px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.traditional-2 {
  width: 50%;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.traditional-2 {
    max-width: 550px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.traditional-3 {
  width: 207px;
  height: 234px;
  -o-object-fit: cover;
     object-fit: cover;
  margin-right: 15px;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.traditional-3 {
    width: 100%;
    height: 280px;
    max-width: 550px;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.traditional-4 {
  width: 207px;
  height: 234px;
  -o-object-fit: cover;
     object-fit: cover;
  margin-right: 15px;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.traditional-4 {
    width: 100%;
    height: 280px;
    max-width: 550px;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.traditional-5 {
  width: 207px;
  height: 234px;
  -o-object-fit: cover;
     object-fit: cover;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.traditional-5 {
    width: 100%;
    height: 280px;
    max-width: 550px;
    margin: 0 auto;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.value-1 {
  width: 350px;
}
@media (max-width: 900px) {
  .resumulab .col-img.value-1 {
    width: 270px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.value-2 {
  width: 325px;
}
@media (max-width: 900px) {
  .resumulab .col-img.value-2 {
    width: 270px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.value-3 {
  width: 95%;
}
@media (max-width: 900px) {
  .resumulab .col-img.value-3 {
    width: 300px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.exterior-1 {
  width: 100%;
}
@media (max-width: 900px) {
  .resumulab .col-img.exterior-1 {
    max-width: 500px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.exterior-2 {
  width: 100%;
}
@media (max-width: 900px) {
  .resumulab .col-img.exterior-2 {
    max-width: 500px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.exterior-3 {
  width: 100%;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.exterior-3 {
    max-width: 500px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.exterior-4 {
  width: 100%;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.exterior-4 {
    max-width: 500px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.exterior-5 {
  max-width: 684px;
  width: 100%;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.exterior-5 {
    max-width: 500px;
  }
}
.resumulab .col-img.floorplan-1 {
  width: 245px;
  margin-top: 20px;
}
@media (max-width: 900px) {
  .resumulab .col-img.floorplan-1 {
    width: 185px;
  }
}
.resumulab .col-img.floorplan-2 {
  width: 382px;
  margin-top: 70px;
}
@media (max-width: 900px) {
  .resumulab .col-img.floorplan-2 {
    width: 265px;
    margin-top: 50px;
  }
}
.resumulab .col-img.floorplan-3 {
  width: 100%;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.floorplan-3 {
    max-width: 500px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.floorplan-4 {
  width: 390px;
  margin-top: 45px;
  margin-bottom: 50px;
}
@media (max-width: 900px) {
  .resumulab .col-img.floorplan-4 {
    width: 220px;
  }
}
.resumulab .col-img.floorplan-5 {
  width: 285px;
  margin-top: 70px;
}
@media (max-width: 900px) {
  .resumulab .col-img.floorplan-5 {
    width: 265px;
    margin-top: 50px;
  }
}
.resumulab .col-img.floorplan-6 {
  width: 580px;
}
@media (max-width: 900px) {
  .resumulab .col-img.floorplan-6 {
    width: 100%;
    max-width: 700px;
  }
}
.resumulab .col-img.floorplan-7 {
  width: 47%;
}
@media (max-width: 900px) {
  .resumulab .col-img.floorplan-7 {
    width: 100%;
    max-width: 600px;
    margin-top: 30px;
    margin-bottom: 35px;
  }
}
.resumulab .col-img.floorplan-8 {
  width: 320px;
}
@media (max-width: 1000px) {
  .resumulab .col-img.floorplan-8 {
    width: 220px;
  }
}
.resumulab .col-img.passive-1 {
  width: 100%;
}
@media (max-width: 900px) {
  .resumulab .col-img.passive-1 {
    max-width: 500px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.passive-2 {
  width: 187px;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.passive-2 {
    max-width: 135px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.passive-3 {
  width: 100%;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.passive-3 {
    max-width: 500px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.passive-4 {
  width: 63%;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.passive-4 {
    width: 230px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.passive-5 {
  width: 100%;
  padding: 27px;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.passive-5 {
    width: 300px;
    margin-bottom: 20px;
  }
}
.resumulab .col-img.passive-6 {
  width: 100%;
  margin-bottom: 0;
}
@media (max-width: 900px) {
  .resumulab .col-img.passive-6 {
    max-width: 400px;
    margin-bottom: 20px;
  }
}
.resumulab .back-content {
  text-align: center;
  margin-bottom: 90px;
}
@media (max-width: 900px) {
  .resumulab .back-content {
    margin-left: -20px;
  }
}
.resumulab .btn-back {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 8px;
  padding: 10px 14px;
  -webkit-transition: background-color 0.2s ease, color 0.2s ease;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.resumulab .btn-back:hover {
  opacity: 0.7;
}
.resumulab .btn-back__icon {
  width: 50px;
  height: auto;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
}
@media (max-width: 820px) {
  .resumulab .btn-back__icon {
    width: 35px;
  }
}
.resumulab .btn-back__text {
  white-space: nowrap;
  font-size: 32px;
}
@media (max-width: 820px) {
  .resumulab .btn-back__text {
    font-size: 22px;
  }
}
/*# sourceMappingURL=style.css.map */