/*
Theme Name:  Kurosawa Koumuten
Theme URI:
Author:  Kurosawa Koumuten
Author URI:
Description:
Version: 1.0
Requires at least: 5.9
Tested up to: 6.0
Requires PHP: 5.6
Version: 1.0
*/
/**
* Remove the margin in all browsers.
*/
/* base font family
--------------------------------------------- */
/* @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500;1,600;1,700&display=swap');
:root {
  /* --gothic:"游ゴシック体", "游ゴシック", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "Yu Gothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif; */
  /* --yumincho:"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS P	Mincho","Times New Roman", serif; */
  --noto-sans: NotoSansJP,'Noto Sans JP', sans-serif ;
  --noto-serif: NotoSerifJP, 'Noto Serif JP', serif;
  --cormorant-garamond :"Cormorant Garamond", serif;
}
*,
html,
body {
  margin: 0;
  padding: 0;
}
*:focus {
  outline: none;
}
*,
:after,
:before {
    background-repeat: no-repeat;
    box-sizing: inherit;
}
:after,
:before {
    text-decoration: inherit;
    vertical-align: inherit;
}

/**
  * Render the `main` element consistently in IE.
  */
main {
  display: block;
  width: 100%;
}
/**
  * 1. Add the correct box sizing in Firefox.
  * 2. Show the overflow in Edge and IE.
  */
hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}
/**
  * 1. Correct the inheritance and scaling of font size in all browsers.
  * 2. Correct the odd `em` font sizing in all browsers.
  */
pre {
  font-size: 15px;
}
/**
  * Remove the gray background on active links in IE 10.
  */
a {
  background-color: transparent;
}
/**
  * 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;
}
/**
  * Add the correct font weight in Chrome, Edge, and Safari.
  */
b,
strong {
  font-weight: 700;
}
/**
  * 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-size: 15px;
}
/**
  * 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;
}
/**
  * Remove the border on images inside links in IE 10.
  */
img {
  border-style: none;
}
/* Forms
    ========================================================================== */
/**
  * 1. Change the font styles in all browsers.
  * 2. Remove the margin in Firefox and Safari.
  */
button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

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

/**
  * Remove the inheritance of text transform in Edge, Firefox, and IE.
  * 1. Remove the inheritance of text transform in Firefox.
  */
button,
select {
  text-transform: none;
}
/**
  * Correct the inability to style clickable types in iOS and Safari.
  */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  appearance: button;
}
/**
  * 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: none;
}
/**
  * Correct the padding in Firefox.
  */
fieldset {
  border: none;
}
/**
  * 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 {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}
/**
  * Add the correct vertical alignment in Chrome, Firefox, and Opera.
  */
progress {
  vertical-align: baseline;
}
/**
  * Remove the default vertical scrollbar in IE 10+.
  */
textarea {
  overflow: auto;
}

/**
  * 1. Add the correct box sizing in IE 10.
  * 2. Remove the padding in IE 10.
  */
[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}
/**
  * 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 odd appearance in Chrome and Safari.
  * 2. Correct the outline style in Safari.
  */
[type="search"] {
  -webkit-appearance: textfield;
  appearance: textfield;
  outline-offset: -2px;
}
/**
  * Remove the inner padding in Chrome and Safari on macOS.
  */
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
  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;
  appearance: button;
  font: inherit;
}
/*
  * Add the correct display in Edge, IE 10+, and Firefox.
  */
details {
  display: block;
}
/*
  * Add the correct display in all browsers.
  */
summary {
  display: list-item;
}
/**
  * Add the correct display in IE 10+.
  */
template {
  display: none;
}
/**
  * Add the correct display in IE 10.
  */
[hidden] {
  display: none;
}
/* Box sizing
--------------------------------------------- */
*,
*::before,
*::after {
  box-sizing: inherit;
}
html {
  box-sizing: border-box;
}

/* Forms
--------------------------------------------- */
button,
input,
select,
optgroup,
textarea {
  line-height: 1.5;
  background: none;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
  border: inherit;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
  border: none;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
  border:none;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
  outline:none;
}
textarea {
  width: 100%;
}
select {
    text-transform: none;
    background-color: transparent;
    border-style: none;
    color: inherit;
}
select::-ms-expand {
    display: none;
}
select::-ms-value {
    color: currentColor;
}
input, select {
  -webkit-appearance: none;
  appearance: none;
}
html {
  box-sizing: border-box;
  overflow-y: scroll;
}
/* header and text
--------------------------------------------- */
h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
  padding: 0;
  font-weight: normal;
}
dfn,
cite,
em,
i {
  font-style: inherit;
}
.single-content em {font-style:revert;}
blockquote {
  margin: 0;
}
address {
  margin: 0;
  font-style: normal;
}
pre {
  line-height: 1.5;
  max-width: 100%;
  overflow: auto;
}
abbr,
acronym {
  border-bottom: 1px dotted #666;
  cursor: help;
}

mark,
ins {
  text-decoration: none;
}
mark {
  background: #FEE400;
}

big {
  font-size: 125%;
}
hr {
  background-color: #ccc;
  border: 0;
  height: 1px;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
  /* list
--------------------------------------------- */
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
blockquote, q {
  quotes: none;
}

dl,
dt,
dd {
  width:100%;
  margin: 0;
  padding: 0;
  margin-inline-start: 0;
}
/* Make sure embeds and iframe fit their containers.
--------------------------------------------- */
embed,
iframe,
object {
  max-width: 100%;
}
img {
  height: auto;
  max-width: 100%;
  object-fit: cover;
}
figure {
  margin:0;
}

/* Links
--------------------------------------------- */
a {
  text-decoration: none;
}
a:focus {
  outline: 0;
}
a:hover,
a:active {
  outline: 0;
}
a[href^="tel"],
a[href^="mailto"] {
  text-decoration: none;
}
a[x-apple-data-detectors] {
  color: inherit !important;
  text-decoration: none !important;
  font-size: inherit !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}
/*--------------------------------------------------------------
# Basics
--------------------------------------------------------------*/

/* base color
--------------------------------------------- */
:root {
  --font-color: #222222;
  --white:#FFFFFF;

}

/* Elements
--------------------------------------------- */
html {
  -ms-touch-action: manipulation;	
  touch-action: manipulation;
}
body {
  font-family:var(--noto-serif);
  color: var(--font-color);
  font-size: 15px;
  line-height: 1.7;
  font-weight: 400;
  overflow-x: hidden;
}
/*
layout
--------------------------------------------- */
@media screen and (min-width:0px) {
  .container {
    display: block;
    width: 100%;
  }
}
@media screen and (max-width:767px) {
  .container {
    max-width: 520px;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
  }
}
@media screen and (min-width: 768px) and (max-width:1024px) {
  .container {
    max-width: 768px;
    margin: 0 auto;
    padding: 0 20px;
  }
}
@media screen and (min-width: 1025px) {
  .container {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 20px;
  }
}
/*
br tag
------------------------------*/
@media screen and (min-width:375px) {
  .sm-only {
    display: none;
  }
}
@media screen and (max-width:1024px){
  .pc-only {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .tb-only,.lg-only {
    display: none;
  }
}
@media screen and (min-width: 768px) {
  .sp-only{
    display: none;
  }
}
@media screen and (min-width:1025px) {
  .sp-only,.tb-only,.md-only{
    display: none;
  }
}
/*
HEADER
--------------------------------------------- */
@media screen and (max-width:1024px) {
  .site-header {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .site-header.subpage {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999;
  }
  .site-header__headline {
    display: -webkit-box;
    width: 100%;
    font-size: 10px;
    line-height: 14px;
    color: #888888;
    font-weight: 500;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    padding: 3px 20px;
  }
  .site-header__menu {
    display: none;
    width: 100%;
    background-color: var(--white);
  }
  .site-header.subpage .site-header__menu {
    display: block;
  }
  .site-header__menu > .container {
    max-width: 100%;
  }
  .site-header__wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 55px;
  }
  .site-header__logo {
    display: block;
    width: 196px;
  }
  .site-header__logo:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-header__logo > picture {
    display: block;
    width: 100%;
  }
  .site-header__logo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  /*hamberger*/
  .mobile-nav-trigger {
    display: block;
    width: 40px;
    height: 45px;
    margin-top: 5px;
  }
  .mobile-nav-trigger > div {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    height: 24px;
  }
  .mobile-nav-trigger > i {
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 21px;
    color: var(--font-color);
    font-weight: 500;
  }
  .mobile-nav-trigger > div > span {
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--font-color);
    transition: transform 0.5s ease;
  }
  .mobile-nav-trigger.active > div {
    position: relative;
  }
  .mobile-nav-trigger.active > div > span {
    position: absolute;
    width: 100%;
  }
  .mobile-nav-trigger.active > div > span:nth-child(1) {
    top: 5px;
    right: 0;
    transform: translateY(7px) rotate(-32deg);
  }
  .mobile-nav-trigger.active > div > span:nth-child(2) {
    display: none;
  }
  .mobile-nav-trigger.active > div > span:nth-child(3) {
    bottom: 3px;
    right: 0;
    transform: translateY(-7px) rotate(32deg);
  }
  .site-header__nav-pc {
    display: none;
  }
  @keyframes stickyslideDown {
    0% {
      transform: translateY(-100%);
      visibility: visible;
    }
    100% {
      transform: translateY(0);
    }
  }
  .site-header__menu.sticky,
  .site-header__menu.fixed {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    display: block;
    height: 55px;
    animation-name: stickyslideDown;
    animation-duration: 0.2s;
    animation-fill-mode: both;
  }
}
@media screen and (min-width:1025px) {
  .site-header {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .site-header__headline {
    display: -webkit-box;
    width: 100%;
    font-size: 13px;
    line-height: 20px;
    color: #888888;
    font-weight: 500;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    padding: 10px 15px;
  }
  .site-header__menu {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .site-header__wrap {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    height: 60px;
  }
  .site-header__logo {
    display: none;
    width: calc(220/1140 * 100%);
  }
  .site-header__logo:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-header__logo > picture {
    display: block;
    width: 100%;
  }
  .site-header__logo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .mobile-nav-trigger {
    display: none;
  }
  .site-header__nav-pc {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    width: calc(100% - (220/1140 * 100%));
  }
  .site-header__nav-pc > li {
    display: flex;
    width: auto;
  }
  .site-header__nav-pc > li + li {
    padding-left: 35px;
  }
  .site-header__nav-pc > li > a,
  .site-header__nav-pc > li > span {
    font-size: 14px;
    letter-spacing: 0.07em;
    font-weight: 500;
    line-height: 30px;
    color: var(--font-color);
    margin: 15px 0;
  }
  .site-header__nav-pc > li > span {
    cursor: pointer;
  }
  .site-header__nav-pc > li > a:hover,
  .site-header__nav-pc > li > span:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-header__nav-pc > li.has-child {
    position: relative;
  }
  .site-header__subnav-pc {
    position: absolute;
    top: 60px;
    left: 0;
    z-index: 99;
    display: block;
    width: 190px;
    height: 0;
    background-color: transparent;
    transition: 0.5s ease;
    overflow: hidden;
  }
  .site-header__nav-pc > li.has-child:hover > .site-header__subnav-pc {
    height: 142px;
  }
  .site-header__subnav-pc > li {
    display: flex;
    align-items: center;
    width: 100%;
    background-color: rgba(51,51,51,.85);
  }
  .site-header__subnav-pc > li + li {
    margin-top: 2px;
  }
  .site-header__subnav-pc > li > a {
    display: block;
    width: 100%;
    font-size: 12px;
    color: var(--white);
    letter-spacing: 0.05em;
    font-weight: 500;
    line-height: 16px;
    padding: 15px;
  }
  .site-header__subnav-pc > li:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .site-header__subnav-pc > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }

  @keyframes stickyslideDown {
    0% {
      transform: translateY(-100%);
      visibility: visible;
    }
    100% {
      transform: translateY(0);
    }
  }
  .site-header__menu.sticky {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    height: 60px;
    animation-name: stickyslideDown;
    animation-duration: 0.2s;
    animation-fill-mode: both;
  }
  .site-header__menu.sticky .site-header__logo {
    display: block;
  }
}
/*
NAVIGATION - mobile
--------------------------------------------- */
@media screen and (max-width:1024px) {
  .site-nav-mobile {
    position: fixed;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color:rgba(0,0,0,.6);
    padding-left: 20px;
    z-index: 992;
    transform: translateY(-150%);
    transition: transform 0.3s ease;
  }
  .site-nav-mobile.active {
    transform: translateY(0);
  }
  .site-nav-mobile-outer {
    display: block;
    width: 100%;
    background-color: rgba(255,255,255,0.9);
    padding-top: 55px;
  }
  .site-nav-mobile__wrap {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: 100%;
    height: calc(100vh - 70px);
    overflow-y: scroll;
    padding-top: 2px;
  }
  /*menu wrap*/
  .site-nav-mobile__inner {
    display: block;
    width: 100%;
    background-color: transparent;
    padding-bottom: 80px;
  }
  .site-nav-mobile__block {
    display: block;
    width: 100%;
  }
  .site-nav-mobile__block + .site-nav-mobile__block {
    margin-top: 2px;
  }
  .site-nav-mobile__block-title {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 40px;
    font-size: 17px;
    font-weight: 700;
    color: var(--white);
    font-family: var(--noto-serif);
    line-height: 1;
    letter-spacing: 0.07em;
    padding: 0 20px 0 40px;
    background: rgba(51,51,51,0.85);
  }
  .site-nav-mobile__block-title > .child-trigger {
    position: absolute;
    top: 0;
    right: 30px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    width: 12px;
    height: 40px;
  }
  .site-nav-mobile__block-title > .child-trigger > i {
    position: relative;
    display: block;
    width: 12px;
    height: 12px;
  }
  .site-nav-mobile__block-title > .child-trigger > i::before,
  .site-nav-mobile__block-title > .child-trigger > i::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: var(--white);
  }
  .site-nav-mobile__block-title > .child-trigger > i::before {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .site-nav-mobile__block-title > .child-trigger > i::after {
    top: 50%;
    left: 50%;
    transform: rotate(90deg) translate(-50%,-50%);
    transform-origin: 0 50%;
    transition: 0.3s ease;
  }
  .site-nav-mobile__block-title.active > .child-trigger > i::after {
    top: 50%;
    left: 50%;
    transform: rotate(0) translate(-50%,-50%);
    transform-origin: 0 50%;
  }
  .site-nav-mobile__list {
    display: none;
    width: 100%;
    padding: 20px 20px 20px 50px;
  }
  .site-nav-mobile__list > li {
    position: relative;
    display: flex;
    align-items: flex-start;
    width: 100%;
  }
  .site-nav-mobile__list > li.child-page {
    padding-left: 10px;
  }
  .site-nav-mobile__list > li:nth-child(n+2){
    margin-top: 25px;
  }
  .site-nav-mobile__list > li > a {
    display: flex;
    align-items: center;
    width: auto;
    font-size:15px;
    font-weight: 500;
    color: var(--blue);
    line-height: 19.5px;
  }
  .site-nav-mobile__list > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
}
@media screen and (min-width:1025px) {
  .site-nav-mobile {
    display: none;
  }
}
/*
FOATING NAV
--------------------------------------------- */
@media screen and (max-width:1024px) {
  .site-floating-menu {
    position: fixed;
    bottom: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 45px;
    z-index: 997;
    transform: translateY(150%);
    transition: transform 0.3s ease;
  }
  .site-floating-menu.active {
    transform: translateY(0);
  }
  .site-floating-menu__wrap {
    display: flex;
    justify-content: space-between;
    max-width: 480px;
    width: 100%;
    height: 50px;
    margin: 0 auto;
  }
  .site-floating-menu__wrap > a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 33.333333%;
    height: 45px;
    border: 1px solid #333333;
  }
  .site-floating-menu__wrap > a > span {
    font-size: 15px;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0.15rem;
    color: var(--white);
  }
  .site-floating-menu__books {
    background-color: #333333;
  }
  .site-floating-menu__contact {
    background-color: var(--white);
  }
  .site-floating-menu__contact > span {
    color: #333333 !important;
  }
  .site-floating-menu__reserve {
    background-color: #01444D;
  }
}
@media screen and (min-width:1025px) {
  .site-floating-menu {
    position: fixed;
    top: 50%;
    right: 5px;
    display: block;
    z-index: 997;
    transform: translate(150%,-50%);
    transition: transform 0.3s ease;
  }
  .site-floating-menu.active {
    transform: translate(0,-50%);
  }
  .site-floating-menu__wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    width: 45px;
  }
  .site-floating-menu__wrap > a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 45px;
    height: 160px;
    border: 1px solid #333333;
  }
  .site-floating-menu__wrap > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .site-floating-menu__wrap > a + a {
    margin-top: 5px;
  }
  .site-floating-menu__wrap > a > span {
    font-size: 16px;
    writing-mode: vertical-lr;
    line-height: 20px;
    letter-spacing: 0.1rem;
    color: var(--white);
  }
  .site-floating-menu__books {
    background-color: #333333;
  }
  .site-floating-menu__contact {
    background-color: var(--white);
  }
  .site-floating-menu__contact > span {
    color: #333333 !important;
  }
  .site-floating-menu__reserve {
    background-color: #01444D;
  }
}
/*
BUTTON
--------------------------------------------- */
@media screen and (min-width:0px) {
  /*site-btn*/
  .site-btn {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 290px;
    width: 100%;
    padding-left: 50px;
    transition: 0.3s ease;
  }
  .site-btn > span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 50px;
    border: 1px solid var(--font-color);
    color: var(--font-color);
    font-size: 15px;
    line-height: 1;
    font-weight: 500;
  }
  .site-btn::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    display: block;
    width: 60px;
    height: 1px;
    background-color: var(--font-color);
    transition: 0.3s ease;
  }
  .site-btn:hover > span {
    color: var(--white);
    background-color: #333333;
  }
  .site-btn:hover::before {
    left: 25px;
  }
  /*btn-arrow*/
  .btn-arrow {
    position: relative;
    display: block;
    width: 90px;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: var(--font-color);
    padding-right: 50px;
    background-image: url(./assets/images/icon-arrow.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 30px auto;
  }
  .btn-arrow:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  /*btn-text*/
  .btn-text {
    display: block;
    width: auto;
    font-size: 15px;
    line-height: 28px;
    color: #01444D;
    letter-spacing: 0.07em;
    padding-right: 15px;
    background-image: url(./assets/images/btn-arrow-bl.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 7.41px auto;
  }
  .btn-text:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
}
/*
FOOTER
--------------------------------------------- */
/*layout*/
@media screen and (min-width:0px) {
  .site-footer {
    display: block;
    width: 100%;
  }
}
/*footer main*/
@media screen and (max-width:767px) {
  .site-footer-cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-top: 50px;
    background-color: var(--white);
  }
  .site-footer-link {
    position: relative;
    display: block;
    width: 100%;
  }
  .site-footer-link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-footer-link__title {
    position: absolute;
    left: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    padding: 0 0 40px 40px;
  }
  .site-footer-link__title > span:nth-child(1) {
    font-size: 15px;
    color: var(--white);
    line-height: 21px;
    font-weight: 300;
  }
  .site-footer-link__title > span:nth-child(2) {
    font-size: 23px;
    color: var(--white);
    line-height: 30px;
    padding-right: 23px;
    background-image: url(./assets/images/icon-btn.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 13px auto;
    margin-top: 5px;
  }
  .site-footer-link__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-height: 280px;
    overflow: hidden;
  }
  .site-footer-link__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) {
  .site-footer-cta {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding-top: 100px;
    background-color: var(--white);
  }
  .site-footer-link {
    position: relative;
    display: block;
    width: 33.333333%;
  }
  .site-footer-link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-footer-link__title {
    position: absolute;
    left: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    padding: 0 0 40px 40px;
  }
  .site-footer-link__title > span:nth-child(1) {
    font-size: 15px;
    color: var(--white);
    line-height: 21px;
    font-weight: 300;
  }
  .site-footer-link__title > span:nth-child(2) {
    font-size: 23px;
    color: var(--white);
    line-height: 30px;
    padding-right: 23px;
    background-image: url(./assets/images/icon-btn.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 13px auto;
    margin-top: 10px;
  }
  .site-footer-link__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 280px;
    overflow: hidden;
  }
  .site-footer-link__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .site-footer-link__figure {
    height: 200px;
  }
}
/*main*/
@media screen and (max-width:1024px) {
  .site-footer__main {
    position: relative;
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .scroll-top {
    position: absolute;
    bottom: 20px;
    left: 0;
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-end;
    align-items: flex-end;
    height: 135px;
    width: 20px;
    cursor: pointer;
  }
  .scroll-top:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .scroll-top::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    width: 1px;
    height: 60px;
    background: var(--font-color);
  }
  .scroll-top > span {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 20px;
    height: 70px;
    font-size: 13px;
    line-height: 1;
    font-weight: 500;
    word-break: keep-all;
    writing-mode: vertical-rl;
  }
  .site-footer__main-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .site-footer__logo {
    display: block;
    width: 210px;
  }
  .site-footer__logo:hover {
    transform: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-footer__logo > picture {
    display: block;
    width: 100%;
  }
  .site-footer__logo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .site-footer__phone {
    display: block;
    width: auto;
    font-size: 20px;
    line-height: 1;
    font-weight: 500;
    color: var(--font-color);
    padding-left: 35px;
    background-image: url(./assets/images/icon-freedial.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 30px auto;
    margin-top: 25px;
    letter-spacing: 0.05em;
  }
  .site-footer__phone:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-footer__txt {
    display: block;
    width: auto;
    font-size: min(11px + (12 - 11) * ((100vw - 320px) / (375 - 320)), 12px);
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.07em;
    margin-top: 10px;
  }
  .site-footer__address {
    display: block;
    width: auto;
    font-size: min(11px + (13 - 11) * ((100vw - 320px) / (375 - 320)), 13px);
    font-weight: 500;
    margin-top: 20px;
    letter-spacing: 0;
  }
}
@media screen and (min-width:1025px) {
  .site-footer__main {
    position: relative;
    display: block;
    width: 100%;
    padding: 60px 0;
    background-color: var(--white);
  }
  .scroll-top {
    display: none;
  }
  .site-footer__main-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .site-footer__logo {
    display: block;
    width: 350px;
  }
  .site-footer__logo:hover {
    transform: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-footer__logo > picture {
    display: block;
    width: 100%;
  }
  .site-footer__logo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .site-footer__phone {
    display: block;
    width: auto;
    font-size: 20px;
    line-height: 1;
    font-weight: 500;
    color: var(--font-color);
    padding-left: 35px;
    background-image: url(./assets/images/icon-freedial.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 30px auto;
    margin-top: 25px;
    letter-spacing: 0.05em;
  }
  .site-footer__phone:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-footer__txt {
    display: block;
    width: auto;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.07em;
    margin-top: 6px;
  }
  .site-footer__address {
    display: block;
    width: auto;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.07em;
    margin-top: 10px;
  }
}
/*sns*/
@media screen and (max-width:1024px) {
  .site-footer__sns {
    display: none;
  }
}
@media screen and (min-width:1025px) {
  .site-footer__sns {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .site-footer__sns > li {
    display: flex;
    align-items: center;
    width: auto;
  }
  .site-footer__sns > li + li {
    margin-left: 15px;
  }
  .site-footer__sns > li > a {
    display: block;
    height: 25px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% auto;
  }
  .site-footer__sns > li > a.instagram {
    width: 25px;
    background-image: url(./assets/images/icon-instagram.png);
  }
  .site-footer__sns > li > a.facebook {
    width: 25.13px;
    background-image: url(./assets/images/icon-facebook.png);
  }
  .site-footer__sns > li > a.x {
    width: 27.58px;
    background-image: url(./assets/images/icon-x.png);
  }
  .site-footer__sns > li > a.youtube {
    width: 29.35px;
    background-image: url(./assets/images/icon-youtube.png);
  }
  .site-footer__sns > li > a.tiktok {
    width: 21.82px;
    background-image: url(./assets/images/icon-tiktok.png);
  }
  .site-footer__sns > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
/*footer menu*/
@media screen and (max-width:1024px) {
  .site-footer__nav {
    display: none;
  }
}
@media screen and (min-width:1025px) {
  .site-footer__nav {
    display: block;
    width: 100%;
    padding: 60px 0 160px;
    background-color: #888888;
  }
  .site-footer__menu-wrap {
    display: flex;
    justify-content: space-between;
    max-width: 940px;
    width: 100%;
    margin: 0 auto;
  }
  .site-footer__menu-col {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: auto;
  }
  .site-footer__menu-col:not(:last-child) {
    padding-right: 80px;
  }
  .site-footer__menu-col:not(:last-child)::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 40px;
    display: block;
    width: 1px;
    height: calc(100% - 80px);
    background-color: #C7C7C7;
  }
  .site-footer__menu-box {
    display: block;
    width: auto;
  }
  .site-footer__menu-col:not(:first-child) {
    padding-top: 40px;
  }
  .site-footer__menu-col:not(:first-child) .site-footer__menu-box + .site-footer__menu-box {
    margin-top: 45px;
  }
  .site-footer__menu-title {
    display: block;
    width: auto;
    font-size: 17px;
    font-weight: 700;
    color: var(--white);
    line-height: 25px;
    margin-bottom: 15px;
  }
  a.site-footer__menu-title:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-footer__menu-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: auto;
    padding-left: 10px;
  }
  .site-footer__menu-list > li {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .site-footer__menu-list > li + li {
    margin-top: 15px;
  }
  .site-footer__menu-list > li > a {
    display: block;
    width: auto;
    font-size: 13px;
    font-weight: 500;
    line-height: 26px;
    color: var(--white);
  }
  .site-footer__menu-list > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
}
/*rights*/
@media screen and (max-width:1024px) {
  .site-footer__rights {
    display: block;
    width: 100%;
    background-color: var(--white);
    border-bottom: 20px solid #01444D;
  }
  .site-footer__rights-txt {
    display: block;
    width: 100%;
    font-size: 10px;
    line-height: 20px;
    color: #01444D;
    text-align: center;
    padding: 10px 0;
  }
}
@media screen and (min-width:1025px) {
  .site-footer__rights {
    display: block;
    width: 100%;
    background-color: var(--white);
    border-bottom: 20px solid #01444D;
  }
  .site-footer__rights-txt {
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #01444D;
    text-align: center;
    padding: 10px 0;
  }
}
/*
PAGE - main
--------------------------------------------- */
.noitem-txt {
  display: block;
  width: 100%;
  font-size: 15px;
  line-height: 30px;
  text-align: center;
}
@media screen and (max-width:1024px) {
  .main {
    display: block;
    width: 100%;
  }
}
@media screen and (min-width:1025px) {
  .main {
    display: block;
    width: 100%;
  }
}
/*
PAGE - mv
--------------------------------------------- */
@media screen and (max-width:767px) {
  .page-mv {
    display: block;
    width: 100%;
    margin-top: 75px;
    background-color: var(--white);
  }
  .page-mv__wrap {
    position: relative;
    display: block;
    width: 100%;
  }
  .site-header__mvlogo {
    position: absolute;
    top: 30px;
    left: 50px;
    display: none;
    width:264px;
  }
  .site-header__mvlogo:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-header__mvlogo > picture {
    display: block;
    width: 100%;
  }
  .site-header__mvlogo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .page-mv__figure {
    display: block;
    width: 100%;
  }
  .page-mv__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .page-mv {
    display: block;
    width: 100%;
    margin-top: 75px;
    background-color: var(--white);
  }
  .page-mv__wrap {
    display: block;
    width: 100%;
  }
  .site-header__mvlogo {
    position: absolute;
    top: 30px;
    left: 50px;
    display: none;
    width:224px;
  }
  .site-header__mvlogo:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-header__mvlogo > picture {
    display: block;
    width: 100%;
  }
  .site-header__mvlogo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .page-mv__figure {
    display: block;
    width: 100%;
  }
  .page-mv__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:1025px) {
  .page-mv {
    display: block;
    width: 100%;
    padding-left: max(20px, calc((100% - 1140px)/2));
    background-color: var(--white);
  }
  .page-mv__wrap {
    position: relative;
    display: block;
    width: 100%;
  }
  .site-header__mvlogo {
    position: absolute;
    top: 30px;
    left: 50px;
    display: block;
    width:264px;
  }
  .site-header__mvlogo:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .site-header__mvlogo > picture {
    display: block;
    width: 100%;
  }
  .site-header__mvlogo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .page-mv__figure {
    display: block;
    width: 100%;
  }
  .page-mv__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*
PAGE - Breadcrumb
--------------------------------------------- */
@media screen and (min-width: 0px) {
  .breadcrumb-wrapper {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 20px 0;
    background-color: var(--white);
  }
  .gi-breadcrumbs {
    display: block;
    width: 100%;
    margin: 0 auto;
  }
  .gi-breadcrumbs__list {
    display:flex;

    justify-content: flex-end;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
  }
  .gi-breadcrumbs__list > li {
    display: block;
    width: auto;
    font-size: 14px;
    line-height:20px;
    color:var(--font-color);
    font-weight: 400;
    letter-spacing: 0.1em;
  }
  .gi-breadcrumbs__list > li:not(:first-child){
    position: relative;
    padding-left: 20px;
  }
  .gi-breadcrumbs__list > li:not(:first-child)::before{
    content: "＞";
    position: absolute;
    top: 0;
    left: 4px;
    display: block;
    font-size: 10px;
    line-height:20px;
    color:var(--font-color);
    font-weight: 400;
    text-decoration:none;
  }
  .gi-breadcrumbs__list > li:not(:first-child)::after,
  .gi-breadcrumbs__item:not(:last-child)::after {
    display: none !important;
  }
  .gi-breadcrumbs__list > li:not(:last-child) {
    padding-right: 5px;
  }
  .gi-breadcrumbs__link,
  .gi-breadcrumbs__link > span {
    display: block;
    width: auto;
    font-size: 14px;
    line-height:20px;
    color: var(--font-color);
  }
  .gi-breadcrumbs__item:last-child > .gi-breadcrumbs__link > span {
    color:var(--font-color);
    font-weight: 400;
  }
  .gi-breadcrumbs__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
}
@media screen and (max-width: 1024px) {
  .breadcrumb-wrapper {
    padding: 10px 0;
  }
  .gi-breadcrumbs__list > li {
    font-size: 11px;
    text-decoration: none;
  }
  .gi-breadcrumbs__list > li:not(:first-child){
    padding-left: 15px;
  }
  .gi-breadcrumbs__link,
  .gi-breadcrumbs__link span {
    font-size: 11px;
  }
  .gi-breadcrumbs__link,
  .gi-breadcrumbs__link > span,
  .gi-breadcrumbs__item:last-child > .gi-breadcrumbs__link > span {
    text-decoration: none;
  }
}
/*
PAGE - 404
--------------------------------------------- */
@media screen and (max-width:767px) {
  .not-found {
    display: block;
    width: 100%;
    padding: 50px 0 100px;
    background-color: var(--white);
  }
  .not-found__body {
    display: block;
    width: 100%;
    margin: 0 auto;
  }
  .not-found__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .not-found__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 1;
    letter-spacing: 0.07em;
  }
  .not-found__header > span:nth-child(2) {
    font-size: min(24px + (30 - 24) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .not-found__text {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 2;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .not-found__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .not-found {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .not-found__body {
    display: block;
    width: 100%;
    margin: 0 auto;
  }
  .not-found__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .not-found__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 0.07em;
  }
  .not-found__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 50px;
  }
  .not-found__text {
    display: block;
    max-width: 800px;
    width: 100%;
    font-size: 16px;
    line-height: 2;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin: 80px auto 0;
  }
  .not-found__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 80px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .not-found__header > span:nth-child(2) {
    font-size: 30px;
  }
}
/*
PAGE - home
--------------------------------------------- */
/*scroll*/
@media screen and (max-width:1024px) {
  .home-mv__scroll {
    display: none;
  }
}
@media screen and (min-width:1025px) {
  .home-mv__scroll {
    position: absolute;
    bottom: -200px;
    left: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 20px;
    height: 410px;
    z-index: 99;
  }
  .home-mv__scroll > span {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 14px;
    font-size: 14px;
    color: #333333;
    font-weight: 500;
    writing-mode: vertical-lr;
    letter-spacing: 0.1em;
    line-height: 1;
  }
  .home-mv__scroll::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    width: 1px;
    height: 350px;
    background-color: #333333;
  }
}
/*container*/
@media screen and (max-width:768px) {
  .home-mv-contents {
    position: relative;
    display: block;
    width: 100%;
    background-color: var(--white);
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-mv-contents {
    position: relative;
    display: block;
    width: 100%;
    background-color: var(--white);
  }
}
@media screen and (min-width:1025px) {
  .home-mv-contents {
    position: relative;
    display: block;
    width: 100%;
    background-color: var(--white);
  }
}
/*logo*/
@media screen and (max-width:767px) {
  .home-mv-logo {
    position: absolute;
    top: 20px;
    left: 0;
    z-index: 9;
    display: block;
    width: 100%;
  }
  .home-mv-logo__body {
    display: block;
    width: 100%;
    padding: 0 20px;
  }
  .home-mv-logo__logo {
    display: block;
    width: 195px;
  }
  .home-mv-logo__logo:hover {
    transition: opcity 0.3s ease;
    opacity: 0.7;
  }
  .home-mv-logo__logo > picture {
    display: block;
    width: 100%;
  }
  .home-mv-logo__logo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-mv-logo {
    position: absolute;
    top: 30px;
    left: 0;
    z-index: 9;
    display: block;
    width: 100%;
  }
  .home-mv-logo__body {
    display: block;
    width: 100%;
    padding: 0 50px;
  }
  .home-mv-logo__logo {
    display: block;
    width: min(264px + (364 - 264) * ((100vw - 768px) / (1024 - 768)), 364px);
  }
  .home-mv-logo__logo:hover {
    transition: opcity 0.3s ease;
    opacity: 0.7;
  }
  .home-mv-logo__logo > picture {
    display: block;
    width: 100%;
  }
  .home-mv-logo__logo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:1025px) {
  .home-mv-logo {
    position: absolute;
    top: 30px;
    left: 0;
    z-index: 9;
    display: block;
    width: 100%;
    padding-left: 113px;
  }
  .home-mv-logo__body {
    display: block;
    width: 100%;
    padding: 0 50px;
  }
  .home-mv-logo__logo {
    display: block;
    width: 364px;
  }
  .home-mv-logo__logo:hover {
    transition: opcity 0.3s ease;
    opacity: 0.7;
  }
  .home-mv-logo__logo > picture {
    display: block;
    width: 100%;
  }
  .home-mv-logo__logo > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*slogan*/
@media screen and (max-width:767px) {
  .home-mv-slogan {
    position: absolute;
    bottom: 50px;
    left: 0;
    z-index: 99;
    display: block;
    width: 100%;
  }
  .home-mv-slogan__body {
    display: block;
    width: 100%;
    padding: 020px;
  }
  .home-mv-slogan__txt {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    color: var(--white);
  }
  .home-mv-slogan__txt > span:nth-child(1) {
    font-size: 22px;
    font-weight: 500;
    line-height: 30px;
  }
  .home-mv-slogan__txt > span:nth-child(2) {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    margin-top: 10px;
  }
  .home-mv-slogan__txt > span:nth-child(3) {
    font-size: min(12px + (14 - 12) * ((100vw - 320px) / (375 - 320)), 14px);
    font-weight: 500;
    line-height: 14px;
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-mv-slogan {
    position: absolute;
    bottom: 45px;
    left: 0;
    z-index: 99;
    display: block;
    width: 100%;
  }
  .home-mv-slogan__body {
    display: block;
    width: 100%;
    padding: 0 min(30px + (80 - 30) * ((100vw - 768px) / (1024 - 768)), 80px);
  }
  .home-mv-slogan__txt {
    display: flex;
    flex-direction: column;
    width: 100%;
    color: var(--white);
  }
  .home-mv-slogan__txt > span:nth-child(1) {
    font-size: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 40px;
  }
  .home-mv-slogan__txt > span:nth-child(2) {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 30px;
    margin-top: 20px;
  }
  .home-mv-slogan__txt > span:nth-child(3) {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 20px;
    margin-top: 15px;
  }
}
@media screen and (min-width:1025px) {
  .home-mv-slogan {
    position: absolute;
    bottom: 45px;
    left: 0;
    z-index: 99;
    display: block;
    width: 100%;
    padding-left: 113px;
  }
  .home-mv-slogan__body {
    display: block;
    width: 100%;
    padding: 0 80px;
  }
  .home-mv-slogan__txt {
    display: flex;
    flex-direction: column;
    width: 100%;
    color: var(--white);
  }
  .home-mv-slogan__txt > span:nth-child(1) {
    font-size: 36px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 50px;
  }
  .home-mv-slogan__txt > span:nth-child(2) {
    font-size: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 40px;
    margin-top: 20px;
  }
  .home-mv-slogan__txt > span:nth-child(3) {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 30px;
    margin-top: 15px;
  }
}
/*mv*/
@media screen and (max-width:767px) {
  .home-mv {
    position: relative;
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  /*slide images*/
  .main-visual__wrap {
    position: relative;
    display: block;
    width: 100%;

  }
  .home-mv__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: calc(100vh - 20px);
    overflow: hidden;
  }
  .home-mv__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-mv {
    position: relative;
    display: block;
    width: 100%;
    height: 600px;
    background-color: var(--white);
  }
  /*slide images*/
  .main-visual__wrap {
    position: relative;
    display: block;
    width: 100%;
    height: calc(600px - 20px);
    z-index: 1;
  }
  .home-mv__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: calc(600px - 20px);
    overflow: hidden;
  }
  .home-mv__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:1025px) {
  .home-mv {
    position: relative;
    display: block;
    width: 100%;
    height: calc(100vh - 100px);
    background-color: var(--white);
    padding-left: 113px;
  }
  /*slide images*/
  .main-visual__wrap {
    display: block;
    width: 100%;
    height: calc(100vh - 100px);
    z-index: 1;
  }
  .home-mv__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: calc(100vh - 100px);
    overflow: hidden;
  }
  .home-mv__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
/*mv - main-slider*/
@media screen and (max-width:767px) {
  .home-mv-contents.has-slide .home-mv-slogan {
    bottom: 85px;
  }
  .home-mv__slide {
    position: relative;
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .main-slider {
    position: relative;
    display: block;
    width: 100%;
    padding-bottom: 30px;
    z-index: 1;
  }
  .main-slider .swiper-wrapper,
  .main-slider .swiper-wrapper > .swiper-slide {
    width: 100%;
    height: 100%;
  }
  .slide-wrapper {
    position: relative;
    display: block;
    width: 100%;
  }
  .main-slider__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: calc(100vh - 20px);
    overflow: hidden;
  }
  .main-slider__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .main-slider .swiper-slide-active:not(.first) .main-slider__figure > img,
  .main-slider .swiper-slide-duplicate-active:not(.first) .main-slider__figure > img,
  .main-slider .swiper-slide-prev:not(.first) .main-slider__figure > img {
    animation: ImgAnime 10s linear;
    transform: scale(1);
  }
  @keyframes ImgAnime {
    0% {
      opacity: 1;
      transform: scale(1.2);
      animation-timing-function: ease-out;
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  /*pagination*/
  .main-slider .swiper-pagination {
    bottom: 10px;
    display: flex;
    justify-content: right;
    align-items: center;
    width: 100%;
    padding: 0 20px;
  }
  .main-slider .swiper-pagination-bullet {
    display: block;
    width: 7px;
    height: 7px;
    border-radius: 4px;
    background-color: #333333;
    opacity: 0.3;
    margin: 0 6px !important;
  }
  .main-slider .swiper-pagination-bullet-active {
    background-color: #333333;
    opacity: 1;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-mv-contents.has-slide .home-mv-slogan {
    bottom: 75px;
  }
  .home-mv__slide {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .main-slider {
    position: relative;
    display: block;
    width: 100%;
    padding-bottom: 30px;
    z-index: 1;
  }
  /*slide*/
  .main-slider .swiper-wrapper,
  .main-slider .swiper-wrapper > .swiper-slide {
    width: 100%;
    height: 100%;
  }
  .slide-wrapper {
    position: relative;
    display: block;
    width: 100%;
  }
  .main-slider__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 570px;
    overflow: hidden;
  }
  .main-slider__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .main-slider .swiper-slide-active:not(.first) .main-slider__figure > img,
  .main-slider .swiper-slide-duplicate-active:not(.first) .main-slider__figure > img,
  .main-slider .swiper-slide-prev:not(.first) .main-slider__figure > img {
    animation: ImgAnime 10s linear;
    transform: scale(1);
  }
  @keyframes ImgAnime {
    0% {
      opacity: 1;
      transform: scale(1.2);
      animation-timing-function: ease-out;
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  /*pagination*/
  .main-slider .swiper-pagination {
    bottom: 10px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    max-width: 768px;
    width: 100%;
    padding: 0 20px;
    left: 50%;
    transform: translateX(-50%);
  }
  .main-slider .swiper-pagination-bullet {
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 4px;
    background-color: #333333;
    opacity: 0.3;
    margin: 0 8px !important;
  }
  .main-slider .swiper-pagination-bullet-active {
    background-color: #333333;
    opacity: 1;
  }
}
@media screen and (min-width:1025px) {
  .home-mv-contents.has-slide .home-mv-slogan {
    bottom: 75px;
  }
  .home-mv__slide {
    position: relative;
    display: block;
    width: 100%;
    background-color: var(--white);
    padding-left: 113px;
  }
  .main-slider {
    position: relative;
    display: block;
    width: 100%;
    height: calc(100vh - 100px + 30px);
    padding-bottom: 30px;
    background-color: var(--white);
  }
  /*slide*/
  .main-slider .swiper-wrapper,
  .main-slider .swiper-wrapper > .swiper-slide {
    width: 100%;
    height: 100%;
  }
  .slide-wrapper {
    position: relative;
    display: block;
    width: 100%;
  }
  .main-slider__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: calc(100vh - 100px);
    overflow: hidden;
  }
  .main-slider__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .main-slider .swiper-slide-active:not(.first) .main-slider__figure > img,
  .main-slider .swiper-slide-duplicate-active:not(.first) .main-slider__figure > img,
  .main-slider .swiper-slide-prev:not(.first) .main-slider__figure > img {
    animation: ImgAnime 7.5s linear;
    transform: scale(1);
  }
  @keyframes ImgAnime {
    0% {
      opacity: 1;
      transform: scale(1.2);
      animation-timing-function: ease-out;
    }
    100% {
      opacity: 1;
      transform: scale(1);
    }
  }
  /*pagination*/
  .main-slider .swiper-pagination {
    bottom: 10px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    max-width: 1180px;
    width: 100%;
    padding: 0 20px;
    left: 50%;
    transform: translateX(-50%);
  }
  .main-slider .swiper-pagination-bullet {
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 4px;
    background-color: #333333;
    opacity: 0.3;
    margin: 0 10px !important;
  }
  .main-slider .swiper-pagination-bullet-active {
    background-color: #333333;
    opacity: 1;
  }
}
/*home-concept*/
@media screen and (max-width:767px) {
  .home-concept {
    display: block;
    width: 100%;
    padding: 80px 0;
    background-color: var(--white);
  }
  .home-concept__body {
    display: block;
    width: 100%;
  }
  .home-concept__header {
    display: block;
    width: 100%;
    font-size: 24px;
    line-height: 40px;
    text-align: center;
    margin-bottom: 50px;
  }
  .home-concept__txt {
    display: block;
    width: 100%;
    letter-spacing: 0.07em;
    text-align: center;
  }
  .home-concept__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .home-concept {
    display: block;
    width: 100%;
    padding: 100px 0 80px;
    background-color: var(--white);
  }
  .home-concept__body {
    display: block;
    width: 100%;
  }
  .home-concept__header {
    display: block;
    width: 100%;
    font-size: 34px;
    line-height: 54px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-bottom: 50px;
  }
  .home-concept__txt {
    display: block;
    width: 100%;
    letter-spacing: 0.07em;
    text-align: center;
  }
  .home-concept__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
/*home-reason*/
@media screen and (max-width:767px) {
  .home-reason {
    position: relative;
    display: block;
    width: 100%;
    padding: 0 0 100px;
    background-color: var(--white);
  }
  .home-reason::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    display: block;
    max-width: 520px;
    width: 100%;
    height: 100px;
    background-image: url(./assets/images/home/reason/5reason.png);
    background-repeat: no-repeat;
    background-position: right top;
    background-size: 100% auto;
  }
  .home-reason__body {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
  }
  .home-reason__hgroup {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: 100%;
  }
  .home-reason__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .home-reason__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
  }
  .home-reason__header > span:nth-child(2) {
    font-size: 40px;
    font-weight: 500;
    line-height: 57px;
    letter-spacing: 0;
  }
  .home-reason__subtitle {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: 100%;
    margin-top: 40px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: left top 30px;
    background-size: 100% 1px;
  }
  .home-reason__subtitle > p {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: auto;
    padding-left: 10px;
    background-color: var(--white);
  }
  .home-reason__subtitle > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    text-align: right;
  }
  .home-reason__subtitle > span:nth-child(2) {
    font-size: 23px;
    font-weight: 500;
    line-height: 30px;
    text-align: right;
  }
  .home-reason__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .home-reason-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
  }
  .home-reason-box + .home-reason-box {
    margin-top: 50px;
  }
  .home-reason-box__title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 40px;
  }
  .home-reason-box__title > span {
    font-size: 22px;
    writing-mode: vertical-lr;
    line-height: 28px;
    letter-spacing: 0.1rem;
  }
  .home-reason-box__figure {
    display: block;
    width: calc(100% - 40px);
  }
  .home-reason-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-reason-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .home-reason__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .home-reason {
    display: block;
    width: 100%;
    padding: 80px 0 100px;
    background-color: var(--white);
  }
  .home-reason > .container {
    background-image: url(./assets/images/home/reason/5reason.png);
    background-repeat: no-repeat;
    background-position: right top;
    background-size: calc(1066/1140 * 100%) auto;
  }
  .home-reason__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .home-reason__hgroup {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: 100%;
  }
  .home-reason__header {
    display: flex;
    flex-direction: column;
    width: auto;
  }
  .home-reason__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    letter-spacing: 0.1em;
  }
  .home-reason__header > span:nth-child(2) {
    font-size: 60px;
    line-height: 86px;
    letter-spacing: 0.1em;
  }
  .home-reason__subtitle {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: 100%;
    margin-top: 20px;
  }
  .home-reason__subtitle > p {
    position: relative;
    display: flex;
    flex-direction: column;
    width: auto;
    padding-left: 130px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: left top 30px;
    background-size: 106px 1px;
  }
  .home-reason__subtitle > span:nth-child(1) {
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.1em;
  }
  .home-reason__subtitle > span:nth-child(2) {
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
  }
  .home-reason__main {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    align-items: flex-start;
    width: 100%;
    margin-top: 80px;
  }
  .home-reason-box {
    display: flex;
    flex-wrap: wrap;
  }
  .home-reason-box:nth-child(1) {
    width: calc(440/1040 * 100%);
    margin-right: calc(120/1040 * 100%);
  }
  .home-reason-box:nth-child(2) {
    width: calc(440/1040 * 100%);
    margin-top: 90px;
    margin-right: calc(40/1040 * 100%);
  }
  .home-reason-box:nth-child(3) {
    width: calc(500/1040 * 100%);
    margin-right: calc(70/1040 * 100%);
    margin-top: 30px;
  }
  .home-reason-box:nth-child(4) {
    width: calc(470/1040 * 100%);
    margin-top: 125px;
  }
  .home-reason-box:nth-child(5) {
    width: calc(520/1040 * 100%);
    margin-top: 40px;
  }
  .home-reason-box__title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 70px;
  }
  .home-reason-box__title > span {
    font-size: 32px;
    writing-mode: vertical-lr;
    line-height: 39px;
    letter-spacing: 0.1rem;
  }
  .home-reason-box__figure {
    display: block;
    width: calc(100% - 70px);
  }
  .home-reason-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-reason-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    letter-spacing: 0.05em;
    margin-top: 25px;
  }
  .home-reason-box:nth-child(n+3) > .home-reason-box__txt {
    padding-left: 70px;
  }
  .home-reason__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 85px;
  }
}
/*home-lineup*/
@media screen and (max-width:767px) {
  .home-lineup {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .home-lineup__hgroup {
    display: block;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 50px;
    background-image: url(./assets/images/home/lineup/lineup.png);
    background-repeat: no-repeat;
    background-position: top 15px center;
    background-size: auto 53.89px;
  }
  .home-lineup__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .home-lineup__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .home-lineup__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 57px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .home-lineup-box {
    display: block;
    width: 100%;
    padding: 80px 0 250px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .home-lineup-box.comfort {
    background-image: url(./assets/images/home/lineup/lineup-sp1.jpg);
  }
  .home-lineup-box.dellacasa {
    background-image: url(./assets/images/home/lineup/lineup-sp2.jpg);
    margin-top: 1px;
  }
  .home-lineup-box__content {
    display: block;
    width: 100%;
  }
  .home-lineup-box__title {
    display: block;
    width: 100%;
    font-size: min(30px + (38 - 30) * ((100vw - 320px) / (375 - 320)), 38px);
    font-weight: 400;
    line-height: 30px;
    color: var(--white);
    letter-spacing: 0;
  }
  .home-lineup-box__title > small {
    font-size: min(18px + (20 - 18) * ((100vw - 320px) / (375 - 320)), 20px);
    padding-left: 10px;
    letter-spacing: -0.05em;
  }
  .home-lineup-box__main {
    position: relative;
    display: block;
    width: 100%;
    padding: 30px 0;
  }
  .home-lineup-box__main::before {
    content: "";
    position: absolute;
    top: 0;
    right: 50%;
    display: block;
    width: 50vw;
    height: 100%;
    background-color: rgba(0,0,0,0.61);
  }
  .home-lineup-box__main::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    display: block;
    width: 50vw;
    height: 100%;
    background-color: rgba(0,0,0,0.61);
  }
  .home-lineup-box__txt {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .home-lineup-box__btns {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    margin-top: 30px;
  }
  .site-btn.comfort > span {
    color: var(--white);
    background: linear-gradient(#746847 0%, #3a3424 100%);
  }
  .site-btn.comfort::before {
    background-color: var(--white);
  }
  .site-btn.comfort:hover > span {
    background:#333333;
  }
  .site-btn.dellacasa > span {
    color: var(--white);
    background: linear-gradient(#0a1f3c 0%, #000b1a 100%);
  }
  .site-btn.dellacasa::before {
    background-color: var(--white);
  }
  .site-btn.dellacasa:hover > span {
    background:#333333;
  }
}
@media screen and (min-width:768px) {
  .home-lineup {
    display: block;
    width: 100%;
    padding: 80px 0 0;
    background-color: var(--white);
  }
  .home-lineup__hgroup {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 40px;
    background-image: url(./assets/images/home/lineup/lineup.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .home-lineup__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .home-lineup__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 31px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .home-lineup__header > span:nth-child(2) {
    font-size: 60px;
    line-height: 80px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .home-lineup-box {
    display: block;
    width: 100%;
    padding: 80px 0 90px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .home-lineup-box.comfort {
    background-image: url(./assets/images/home/lineup/lineup-pc1.jpg);
  }
  .home-lineup-box.dellacasa {
    background-image: url(./assets/images/home/lineup/lineup-pc2.jpg);
    margin-top: 1px;
  }
  .home-lineup-box__content {
    display: block;
    width: 50%;
  }
  .home-lineup-box.dellacasa .home-lineup-box__content {
    margin-left: auto;
  }
  .home-lineup-box__title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 400;
    line-height: 30px;
    color: var(--white);
  }
  .home-lineup-box.comfort .home-lineup-box__title {
    padding-left: calc(150/570 * 100%);
  }
  .home-lineup-box.dellacasa .home-lineup-box__title {
    padding-left: calc(60/570 * 100%);
  }
  .home-lineup-box__title > small {
    font-size: 20px;
    padding-left: 10px;
  }
  .home-lineup-box__main {
    position: relative;
    display: block;
    width: 100%;
  }
  .home-lineup-box.comfort .home-lineup-box__main {
    padding: calc(40/570 * 100%) calc(30/570 * 100%) calc(40/570 * 100%) calc(150/570 * 100%);
  }
  .home-lineup-box.dellacasa .home-lineup-box__main {
    padding: calc(40/570 * 100%) calc(150/570 * 100%) calc(40/570 * 100%) calc(30/570 * 100%);
  }
  .home-lineup-box__main::after {
    content: "";
    position: absolute;
    top: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: rgba(0,0,0,0.61);
  }
  .home-lineup-box.comfort .home-lineup-box__main::after {
    right: 0;
  }
  .home-lineup-box.dellacasa .home-lineup-box__main::after {
    left: 0;
  }
  .home-lineup-box__txt {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .home-lineup-box__btns {
    display: flex;
    align-items: flex-start;
    width: 100%;
    margin-top: 22px;
  }
  .home-lineup-box.comfort .home-lineup-box__btns {
    padding-left: calc(100/570 * 100%);
  }
  .site-btn.comfort > span {
    color: var(--white);
    background: linear-gradient(#746847 0%, #3a3424 100%);
  }
  .site-btn.comfort::before {
    background-color: var(--white);
  }
  .site-btn.comfort:hover > span {
    background:#333333;
  }
  .home-lineup-box.dellacasa .home-lineup-box__btns {
    justify-content: center;
  }
  .site-btn.dellacasa > span {
    color: var(--white);
    background: linear-gradient(#0a1f3c 0%, #000b1a 100%);
  }
  .site-btn.dellacasa::before {
    background-color: var(--white);
  }
  .site-btn.dellacasa:hover > span {
    background:#333333;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-lineup-box__content {
    width: 65%;
  }
}
/*home-gallery*/
@media screen and (max-width:767px) {
  .home-gallery {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .home-gallery__body {
    display: block;
    width: 100%;
  }
  .home-gallery__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    font-size: 32px;
    line-height: 46px;
    letter-spacing: 0;
    padding-left: 10px;
  }
  .home-gallery__header > small {
    font-size: 16px;
    line-height: 23px;
    margin-top: 5px;
  }
  .home-gallery__items {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 10px;
    row-gap: 10px;
    width: 100%;
    margin-top: 30px;
  }
  .home-gallery__item {
    position: relative;
    display: block;
    width: 100%;
    padding-top: calc(162.5/162.5 * 100%);
    overflow: hidden;
  }
  .home-gallery__item-title {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 5px;
    font-size: 14px;
    line-height: 20px;
    color: var(--white);
    text-align: center;
    background-color: rgba(0,0,0,0.5);
    transform: translateY(100%);
    transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    overflow: hidden;
  }
  .home-gallery__item:hover > .home-gallery__item-title {
    transform: translateY(0);
  }
  .home-gallery__item-figure {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .home-gallery__item-figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .home-gallery__btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .site-btn.gallery_reform {
    margin-top: 20px;
  }
  .site-btn.gallery_reform {
    max-width: 318px;
    width: 100%;
  }
  .site-btn.gallery_reform > span {
    width: 100%;
  }
}
@media screen and (min-width:768px) {
  .home-gallery {
    display: block;
    width: 100%;
    padding: 100px 0 80px;
    background-color: var(--white);
  }
  .home-gallery__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .home-gallery__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 50px;
    letter-spacing: 0;
  }
  .home-gallery__header > small {
    font-size: 20px;
    padding-left: 20px;
  }
  .home-gallery__items {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-template-rows: auto;
    column-gap: 15px;
    row-gap: 15px;
    max-width: 925px;
    width: 100%;
    margin: 50px auto 0;
  }
  .home-gallery__item {
    position: relative;
    display: block;
    width: 100%;
    padding-top: calc(220/220 * 100% );
    overflow: hidden;
  }
  .home-gallery__item-title {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 15px;
    font-size: 15px;
    line-height: 27px;
    color: var(--white);
    text-align: center;
    background-color: rgba(0,0,0,0.5);
    transform: translateY(100%);
    transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    overflow: hidden;
  }
  .home-gallery__item:hover > .home-gallery__item-title {
    transform: translateY(0);
  }
  .home-gallery__item-figure {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .home-gallery__item-figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .home-gallery__btns {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 50px;
  }
  .site-btn.gallery_reform {
    margin-left: 70px;
  }
  .site-btn.gallery_reform > span {
    width: 268px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-gallery__item-title {
    font-size: 14px;
  }
}
/*home-model*/
@media screen and (max-width:767px) {
  .home-model {
    display: block;
    width: 100%;
    padding: 80px 0;
    background-color: var(--white);
  }
  .home-model__hgroup {
    display: block;
    width: 100%;
    margin: 0 auto;
    background-image: url(./assets/images/home/model/model.png);
    background-repeat: no-repeat;
    background-position: top 10px center;
    background-size: 287.6px auto;
  }
  .home-model__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .home-model__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .home-model__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 57px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .home-model__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    padding: 50px 0;
    margin: 0 auto;
  }
  .home-model__main {
    display: block;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .home-model-box {
    position: relative;
    display: block;
    width: 100%;
    padding: 30px 20px 66px;
  }
  .home-model-box__btn {
    position: absolute;
    bottom: -36px;
    right: 0;
    display: block;
    width: 120px;
    font-size: 15px;
    font-weight: 500;
    line-height: 26px;
    color: var(--white);
    padding-right: 40px;
    background-image: url(./assets/images/icon-arrow-wh.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 30px auto;
  }
  .home-model-box__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .home-model-box + .home-model-box {
    margin-top: 20px;
  }
  .home-model-box:nth-child(odd)::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: #34474A;
  }
  .home-model-box:nth-child(even)::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: #1D2633;
  }
  .home-model-box__wrap {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .home-model-box__figure {
    display: block;
    width: 100%;
  }
  .home-model-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-model-box__content {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .home-model-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 400;
    color: var(--white);
    line-height: 37px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--white);
  }
  .home-model-box__address {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 2;
    text-align: justify;
    word-break: break-all;
    margin-top: 15px;
  }
  .home-model-box__officehour {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 2;
    text-align: justify;
    word-break: break-all;
  }
  .home-model-box__officehour > span {
    padding-right: 20px;
  }
  .home-model-box__columns {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: 10px;
    width: 100%;
    margin-top: 15px;
  }
  .home-model-box__thumb {
    display: block;
    width: 100%;
  }
  .home-model-box__thumb > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-model__btns {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .home-model {
    display: block;
    width: 100%;
    padding: 70px 0 120px;
    background-color: var(--white);
  }
  .home-model__hgroup {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
    background-image: url(./assets/images/home/model/model.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: calc(866.6/1366 * 100%) auto;
  }
  .home-model__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .home-model__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 31px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .home-model__header > span:nth-child(2) {
    font-size: 60px;
    line-height: 80px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .home-model__txt {
    display: block;
    max-width: 730px;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    padding: 80px 0 40px;
    margin: 0 auto;
  }
  .home-model__main {
    display: block;
    width: 100%;
  }
  .home-model-box {
    position: relative;
    display: block;
    width: calc(1090/1140 * 100%);
  }
  .home-model-box__btn {
    position: absolute;
    bottom: 0;
    right: 0;
    display: block;
    width: 120px;
    font-size: 15px;
    font-weight: 500;
    line-height: 26px;
    color: var(--white);
    padding-right: 40px;
    background-image: url(./assets/images/icon-arrow-wh.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 30px auto;
    transform: translateX(150px);
  }
  .home-model-box__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .home-model-box + .home-model-box {
    margin-top: 20px;
  }
  .home-model-box:nth-child(odd) {
    padding: 30px calc(350/1090 * 100%) 30px 0;
  }
  .home-model-box:nth-child(even) {
    margin-left: auto;
    padding: 30px calc(260/1090 * 100%) 30px calc(90/1090 * 100%);
  }
  .home-model-box:nth-child(odd)::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: #34474A;
  }
  .home-model-box:nth-child(even)::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: #1D2633;
  }
  .home-model-box__wrap {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .home-model-box__figure {
    display: block;
    width: calc(300/740 * 100%);
  }
  .home-model-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-model-box__content {
    display: block;
    width: calc(440/740 * 100%);
  }
  .home-model-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 400;
    color: var(--white);
    line-height: 37px;
    padding: 0 0 15px min(50px + (115 - 50) * ((100vw - 1025px) / (1200 - 1025)),115px);
    border-bottom: 1px solid var(--white);
    letter-spacing: 0.07em;
  }
  .home-model-box__address {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 2;
    text-align: justify;
    word-break: break-all;
    padding-left: min(50px + (115 - 50) * ((100vw - 1025px) / (1200 - 1025)),115px);
    margin-top: 16px;
  }
  .home-model-box__officehour {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 2;
    text-align: justify;
    word-break: break-all;
    padding-left: min(50px + (115 - 50) * ((100vw - 1025px) / (1200 - 1025)),115px);
  }
  .home-model-box__officehour > span {
    padding-right: 20px;
  }
  .home-model-box__columns {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: 10px;
    width: 100%;
    padding-left: min(50px + (115 - 50) * ((100vw - 1025px) / (1200 - 1025)),115px);
    margin-top: 23px;
  }
  .home-model-box__thumb {
    display: block;
    width: 100%;
  }
  .home-model-box__thumb > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-model__btns {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-model-box:nth-child(odd) {
    padding: 30px calc(90/1090 * 100%) 66px 0;
  }
  .home-model-box:nth-child(even) {
    padding: 30px calc(90/1090 * 100%) 66px calc(90/1090 * 100%);
  }
  .home-model-box__btn {
    bottom: -36px;
    transform: translateX(0);
  }
  .home-model-box__content {
    width: calc(400/740 * 100%);
  }
  .home-model-box__title {
    font-size: 22px;
  }
}
/*home-living*/
@media screen and (max-width:767px) {
  .home-living {
    display: block;
    width: 100%;
    padding: 80px 0;
    background-image: url(./assets/images/home/living-sp.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .home-living__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .home-living__header {
    font-size: min(25px + (28 - 25) * ((100vw - 320px) / (375 - 320)), 28px);
    color: var(--white);
    line-height: 40px;
    text-align: center;
    letter-spacing: 0;
  }
  .home-living__txt {
    font-size: 15px;
    line-height: 25.5px;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .home-living__list {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 15px;
    max-width: 318px;
    width: 100%;
    margin-top: 50px;
  }
  .home-living__list > li {
    display: block;
    width: 100%;
  }
  .home-living__list > li > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 70px;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: #333333;
    background-color: var(--white);
    background-image: linear-gradient(#01444D,#01444D);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 10px 100%;
    transition: 0.3s ease;
  }
  .home-living__list > li > a:hover {
    color: var(--white);
    background-size: 100% 100%;
  }
}
@media screen and (min-width:768px) {
  .home-living {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-image: url(./assets/images/home/living-pc.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .home-living__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .home-living__header {
    font-size: 33px;
    color: var(--white);
    line-height: 50px;
    text-align: center;
    letter-spacing: 0;
  }
  .home-living__txt {
    font-size: 15px;
    line-height: 25.5px;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .home-living__list {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-template-rows: auto;
    column-gap: 20px;
    row-gap: 20px;
    max-width: 994px;
    width: 100%;
    margin-top: 50px;
  }
  .home-living__list > li {
    display: block;
    width: 100%;
  }
  .home-living__list > li > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 86px;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: #333333;
    background-color: var(--white);
    background-image: linear-gradient(#01444D,#01444D);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 10px 100%;
    transition: 0.3s ease;
  }
  .home-living__list > li > a:hover {
    color: var(--white);
    background-size: 100% 100%;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-living__txt {
    font-size: 13px;
  }
  .home-living__list > li > a {
    height: 76px;
    font-size: 15px;
  }
}
/*home-post*/
@media screen and (max-width:767px) {
  .home-post {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .home-post__body {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .home-post__column {
    display: block;
    width: 100%;
  }
  .home-post__column:nth-child(1) {
    position: relative;
    padding:100px 0;
    background-color: #E8EBEB;
  }
  .home-post__column:nth-child(1)::before {
    content: "";
    position: absolute;
    top: 0;
    right: 50%;
    display: block;
    width: 50vw;
    height: 100%;
    background-color: #E8EBEB;
  }
  .home-post__column:nth-child(1)::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    display: block;
    width: 50vw;
    height: 100%;
    background-color: #E8EBEB;
  }
  .home-post__column:nth-child(2) {
    padding:100px 0;
  }
  .home-post__hgroup {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
  }
  .home-post__title {
    display: flex;
    flex-direction: column;
    width: auto;
    margin-bottom: 50px;
  }
  .home-post__title > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
    letter-spacing: 0.1em;
  }
  .home-post__title > span:nth-child(2) {
    font-size: 26px;
    font-weight: 500;
    line-height: 37px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
}
@media screen and (min-width:768px) {
  .home-post {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
    background-image: linear-gradient(#E8EBEB,#E8EBEB);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 50% 100%;
  }
  .home-post__body {
    display: flex;
    justify-content: space-between;
  }
  .home-post__column {
    display: block;
    width: 50%;
  }
  .home-post__column:nth-child(1) {
    padding-right: calc(40/1140 * 100%);
  }
  .home-post__column:nth-child(2) {
    padding-left: calc(40/1140 * 100%);
  }
  .home-post__hgroup {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
    margin-bottom: 50px;
  }
  .home-post__title {
    display: flex;
    flex-direction: column;
    width: auto;
  }
  .home-post__title > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    letter-spacing: 0.1em;
  }
  .home-post__title > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
  }
  .home-post__hgroup > a {
    margin-bottom: 20px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-post__title > span:nth-child(2) {
    font-size: 32px;
    line-height: 60px;
  }
}
/*home-post - news*/
@media screen and (max-width:767px) {
  .home-news-items {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .home-news-items > li {
    display: flex;
    align-items: center;
    width: 100%;
  }
  .home-news-items > li:not(:last-child) {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--white);
  }
  .home-news-items > li:not(:first-child) {
    padding-top: 25px;
  }
  .home-news-item {
    display: flex;
    flex-direction: column;
    width: auto;
  }
  .home-news-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-news-item__date {
    font-size: 13px;
    font-weight: 500;
    line-height: 19px;
    letter-spacing: 0.1em;
    color: #01444D;
  }
  .home-news-item__title {
    display: -webkit-box;
    width: auto;
    font-size: 15px;
    line-height: 25.5px;
    color: var(--font-color);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) {
  .home-news-items {
    display: block;
    width: 100%;
  }
  .home-news-items > li {
    display: flex;
    align-items: center;
    width: 100%;
  }
  .home-news-items > li:not(:last-child) {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--white);
  }
  .home-news-items > li:not(:first-child) {
    padding-top: 25px;
  }
  .home-news-item {
    display: flex;
    flex-direction: column;
    width: auto;
  }
  .home-news-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-news-item__date {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #01444D;
  }
  .home-news-item__title {
    display: -webkit-box;
    width: auto;
    font-size: 15px;
    line-height: 25.5px;
    color: var(--font-color);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    margin-top: 10px;
  }
}
/*home-post - event*/
@media screen and (max-width:767px) {
  .home-event-items {
    display: block;
    width: 100%;
    padding-left: 20px;
    margin-top: 30px;
  }
  .home-event-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .home-event-item + .home-event-item {
    margin-top: 20px;
  }
  .home-event-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-event-item__figure {
    display: block;
    width: 83px;
  }
  .home-event-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-event-item__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: calc(100% - 83px - 30px);
  }
  .home-event-item__badge {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 27px;
    padding: 0 15px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    color: var(--white);
    letter-spacing: 0.05em;
  }
  .home-event-item__badge.new {
    background-color: #C1BC00;
  }
  .home-event-item__badge.finish {
    background-color: #888888;
  }
  .home-event-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 15px;
    line-height: 19.5px;
    font-weight: 500;
    color: var(--font-color);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin-top: 10px;
  }
  .home-event-item__time {
    display: -webkit-box;
    width: 100%;
    font-size: 14px;
    line-height: 21px;
    color: #888888;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    margin-top: 10px;
    padding-left: 25px;
    background-image: url(./assets/images/icon-calendar.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 20px auto;
  }
}
@media screen and (min-width:768px) {
  .home-event-items {
    display: block;
    width: 100%;
    padding-left: 20px;
  }
  .home-event-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .home-event-item + .home-event-item {
    margin-top: 20px;
  }
  .home-event-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-event-item__figure {
    display: block;
    width: 83px;
  }
  .home-event-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-event-item__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: calc(100% - 83px - 30px);
  }
  .home-event-item__badge {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 27px;
    padding: 0 15px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    color: var(--white);
    letter-spacing: 0.05em;
  }
  .home-event-item__badge.new {
    background-color: #C1BC00;
  }
  .home-event-item__badge.finish {
    background-color: #888888;
  }
  .home-event-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 17px;
    line-height: 25.5px;
    font-weight: 500;
    color: var(--font-color);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    margin-top: 10px;
  }
  .home-event-item__time {
    display: -webkit-box;
    width: 100%;
    font-size: 14px;
    line-height: 21px;
    color: #888888;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    margin-top: 10px;
    padding-left: 25px;
    background-image: url(./assets/images/icon-calendar.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 20px auto;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-event-item__content {
    width: calc(100% - 83px - 15px);
  }
}
/*home-voice*/
@media screen and (max-width:767px) {
  .home-voice {
    display: block;
    width: 100%;
    padding: 50px 0 306px;
    background-image: url(./assets/images/voice/bg-sp.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .home-voice__body {
    display: block;
    width: 100%;
  }
  .home-voice__content {
    display: block;
    width: 100%;
    padding: 40px 20px;
    background-color: rgba(255,255,255,0.95);
  }
  .home-voice__header {
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 37px;
    letter-spacing: 0;
  }
  .home-voice__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 26px;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .home-voice__btns {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin-top: 20px;
  }
  .home-voice__btns > a {
    max-width: 290px;
    width: 100%;
  }
}
@media screen and (min-width:768px) {
  .home-voice {
    display: block;
    width: 100%;
    padding: 82px 0 83px;
    background-image: url(./assets/images/voice/bg-pc.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .home-voice__body {
    display: flex;
    justify-content: flex-end;
    max-width: 1100px;
    width: 100%;
    margin: 0 auto;
  }
  .home-voice__content {
    display: block;
    width: calc(550/1100 * 100%);
    padding: calc(40/1100 * 100%) calc(60/1100 * 100%);
    background-color: rgba(255,255,255,0.95);
  }
  .home-voice__header {
    display: block;
    width: 100%;
    font-size: 33px;
    line-height: 47px;
    letter-spacing: 0;
  }
  .home-voice__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 26px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .home-voice__btns {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-voice__content {
    width: calc(650/1100 * 100%);
  }
}
/*home-sns*/
@media screen and (max-width:767px) {
  .home-sns {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .home-sns__header {
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 26px;
    text-align: center;
    margin-bottom: 30px;
  }
  .home-sns__list {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .home-sns__list > li {
    display: flex;
    align-items: flex-start;
    width: auto;
  }
  .home-sns__list > li + li {
    margin-left: 20px;
  }
  .home-sns__link {
    display: flex;
    align-items: center;
    width: 40px;
  }
  .home-sns__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-sns__icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
  }
  .home-sns__icon > img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
  }
  .home-sns__link > p {
    display: none;
  }
}
@media screen and (min-width:768px) {
  .home-sns {
    display: block;
    width: 100%;
    padding: 45px 0;
    background-color: var(--white);
  }
  .home-sns__header {
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 26px;
    text-align: center;
    margin-bottom: 38px;
  }
  .home-sns__list {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .home-sns__list > li {
    display: flex;
    align-items: flex-start;
    width: auto;
  }
  .home-sns__list > li + li {
    margin-left: 40px;
  }
  .home-sns__link {
    display: flex;
    align-items: center;
    width: auto;
  }
  .home-sns__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-sns__icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
  }
  .home-sns__icon > img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
  }
  .home-sns__link > p {
    font-size: 15px;
    font-weight: 600;
    line-height: 20px;
    color: var(--font-color);
    padding-left: 20px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-sns__list > li + li {
    margin-left: 20px;
  }
  .home-sns__link > p {
    font-size: 14px;
    padding-left: 10px;
  }
}
/*home-links*/
@media screen and (max-width:767px) {
  .home-links {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 2px;
    row-gap: 2px;
    width: 100%;
    background-color: var(--white);
  }
  .home-link {
    position: relative;
    display: block;
    width: 100%;
  }
  .home-link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-link__title {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    display: block;
    width: 100%;
    font-size: 18px;
    color: var(--white);
    font-weight: 400;
    line-height: 29px;
    text-align: center;
  }
  .home-link__figure {
    display: block;
    width: 100%;
  }
  .home-link__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .home-links {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-template-rows: auto;
    column-gap: 2px;
    row-gap: 2px;
    width: 100%;
    background-color: var(--white);
  }
  .home-link {
    position: relative;
    display: block;
    width: 100%;
  }
  .home-link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-link__title {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    display: block;
    width: 100%;
    font-size: 19px;
    color: var(--white);
    font-weight: 400;
    line-height: 1;
    text-align: center;
  }
  .home-link__figure {
    display: block;
    width: 100%;
  }
  .home-link__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .home-link__title {
    font-size: 14px;
  }
}
/*home-note*/
@media screen and (max-width:767px) {
  .home-note {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #E8EBEB;
  }
  .home-note__body {
    display: block;
    width: 100%;
  }
  .home-note__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-bottom: 30px;
  }
  .home-note__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0;
  }
  .home-note__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    letter-spacing: 0;
    margin-top: 5px;
  }
  .home-note-items {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 20px;
    row-gap: 30px;
    width: 100%;
  }
  .home-note-item {
    display: block;
    width: 100%;
  }
  .home-note-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-note-item__figure {
    display: block;
    width: 100%;
  }
  .home-note-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-note-item__date {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 20px;
    color: #333333;
    margin-top: 15px;
  }
  .home-note-item__title {
    display: -webkit-box;
    width: auto;
    font-size: 15px;
    line-height: 19.5px;
    color: var(--font-color);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    margin-top: 10px;
  }
  .home-note__btns {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .home-note {
    display: block;
    width: 100%;
    padding: 85px 0 84px;
    background-color: #E8EBEB;
  }
  .home-note__body {
    display: block;
    max-width: 980px;
    width: 100%;
    margin: 0 auto;
  }
  .home-note__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-bottom: 40px;
  }
  .home-note__header > span:nth-child(1) {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0;
  }
  .home-note__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    letter-spacing: 0;
  }
  .home-note-items {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    column-gap: calc(20/980 * 100%);
    width: 100%;
  }
  .home-note-item {
    display: block;
    width: 100%;
  }
  .home-note-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-note-item__figure {
    display: block;
    width: 100%;
  }
  .home-note-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .home-note-item__date {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 20px;
    color: #333333;
    margin-top: 15px;
  }
  .home-note-item__title {
    display: -webkit-box;
    width: auto;
    font-size: 15px;
    line-height: 19.5px;
    color: var(--font-color);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin-top: 10px;
  }
  .home-note__btns {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 50px;
  }
}
/*home-banner*/
@media screen and (max-width:767px) {
  .home-banner {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .home-banner__wrap {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 0px;
    width: 100%;
  }
  .home-banner__link {
    display: block;
    width:100%;
  }
  .home-banner__link + .home-banner__link {
    margin-top: 20px;
  }
  .home-banner__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-banner__link > picture {
    display: block;
    width: 100%;
  }
  .home-banner__link > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .home-banner {
    display: block;
    width: 100%;
    padding: 100px 0 0;
    background-color: var(--white);
  }
  .home-banner__wrap {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    column-gap: 20px;
    width: 100%;
  }
  .home-banner__link {
    display: block;
    width:100%;
  }
  .home-banner__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .home-banner__link > picture {
    display: block;
    width: 100%;
  }
  .home-banner__link > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:1025px) {
  .home-banner > .container {
    max-width: 1260px;
  }
}
/*
PAGE - reason
--------------------------------------------- */
@media screen and (max-width:767px) {
  .reason {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .reason > .container {
    padding: 0;
  }
  .reason__header {
    position: relative;
    display: flex;
    flex-direction: column;
    width: calc(100% - 20px);
    margin: 0 auto;
    padding: 50px 10px 0;
    background-image: url(./assets/images/reason/reason.png);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 100% auto;
    margin:0 10px 50px;
  }
  .reason__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0.1em;
  }
  .reason__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .reason__header > span:nth-child(2) i {
    font-size: 40px;
  }
  .reason-main {
    display: block;
    width: 100%;
  }
  .reason-box {
    display: block;
    width: 100%;
    overflow: hidden;
  }
  .reason-box__figure {
    display: block;
    width: 100%;
  }
  .reason-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reason-content-wrap {
    position: relative;
    z-index: 1;
    background-color: var(--white);
  }
  .reason-content {
    display: block;
    width: 100%;
    padding:30px 0 100px;
  }
  .reason-content__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-bottom: 30px;
  }
  .reason-content__title > span:nth-child(1) {
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0.05em;
  }
  .reason-content__title > span:nth-child(2) {
    font-size: min(40px + (50 - 40) * ((100vw - 320px) / (375 - 320)), 50px);
    font-weight: 500;
    line-height: 60px;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
    margin-top: 5px;
  }
  .reason-content__block {
    display: block;
    width: 100%;
  }
  .reason-content__block-title {
    display: block;
    width: 100%;
    font-size: min(24px + (28 - 24) * ((100vw - 320px) / (375 - 320)), 28px);
    line-height: 39px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    letter-spacing: 0.1em;
  }
  .reason-content__block-txt {
    display: block;
    width: 100%;
    font-size: 15;
    line-height: 28px;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .reason-content__block-btns {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: 100%;
    margin-top: 30px;
  }
  .reason-content__block-btns > a > span {
    font-size: min(13px + (15 - 13) * ((100vw - 320px) / (375 - 320)), 15px);
  }
  .site-btn.technical {
    max-width: 260px;
    width: 100%;
    margin-left: calc(30/585 * 100%);
    margin-top: 30px;
  }
  .site-btn.health {
    max-width: 345px;
    width: 100%;
  }
  .site-btn.master {
    width: 240px;
  }
}
@media screen and (min-width:768px) {
  .reason {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .reason__header {
    position: relative;
    display: flex;
    flex-direction: column;
    max-width: 1050px;
    width: 100%;
    margin: 0 auto;
    padding: 85px 10px 45px;
    background-image: url(./assets/images/reason/reason.png);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 100% auto;
  }
  .reason__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 32px;
    letter-spacing: 0.07em;
  }
  .reason__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: -15px;
  }
  .reason__header > span:nth-child(2) i {
    font-size: 84px;
  }
  .reason-main {
    display: block;
    width: 100%;
  }
  .reason-box {
    display: block;
    width: 100%;
    overflow: hidden;
  }
  .reason-box:nth-child(even) {
    background-color: #F9F8F6;
  }
  .reason-box__figure {
    display: block;
    width: 100%;
  }
  .reason-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reason-content-wrap {
    position: relative;
    z-index: 1;
    background-color: var(--white);
  }
  .reason-content {
    position: relative;
    z-index: 1;
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 120px;

  }

  .reason-content__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 50px 0 30px;
  }
  .reason-content__title > span:nth-child(1) {
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.05em;
  }
  .reason-content__title > span:nth-child(2) {
    font-size: 80px;
    font-weight: 500;
    line-height: 90px;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
    margin-top: 20px;
  }
  .reason-content__block {
    display: block;
    width: calc(585/900 * 100%);
    margin-left: auto;
  }
  .reason-content__block-title {
    display: block;
    width: 100%;
    font-size: 40px;
    line-height: 50px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    letter-spacing: 0.1em;
  }
  .reason-content__block-txt {
    display: block;
    width: 100%;
    font-size: 15;
    line-height: 28px;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .reason-content__block-btns {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    margin-top: 40px;
  }
  .site-btn.technical {
    width: 260px;
    margin-left: calc(30/585 * 100%);
  }
  .site-btn.health {
    max-width: 345px;
  }
  .site-btn.master {
    width: 240px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .reason__header > span:nth-child(2) {
    font-size: 40px;
    margin-top: -15px;
  }
  .reason__header > span:nth-child(2) i {
    font-size: 74px;
  }
  .reason-content__block {
    width: calc(685/900 * 100%);
  }
  .reason-content__title > span:nth-child(2) {
    font-size: 70px;
    line-height: 80px;
  }
  .reason-content__block-title {
    font-size: 34px;
    line-height: 44px;
  }
}
/*
PAGE - reason
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .design-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .design-intro__body {
    display: block;
    width: 100%;
  }
  .design-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    background-image: url(./assets/images/design/design.png);
    background-repeat: no-repeat;
    background-position: top 10px center;
    background-size: calc(297.59/335 * 100%) auto;
  }
  .design-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
  }
  .design-intro__header > span:nth-child(2) {
    font-size: 30px;
    font-weight: 500;
    line-height: 48px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .design-intro__txt {
    display: block;
    width: 100%;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .design-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .design-intro__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .design-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 60px;
    background-image: url(./assets/images/design/design.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .design-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .design-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .design-intro__txt {
    display: block;
    width: 100%;
    text-align: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .design-intro__header {
    padding-bottom: 40px;
  }
  .design-intro__header > span:nth-child(2) {
    font-size: 32px;
    line-height: 50px;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .design-feature {
    display: block;
    width: 100%;
  }
  .design-feature__hgroup {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: #F9F8F6;
  }
  .design-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .design-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .design-feature__header > span:nth-child(2) {
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .design-nav {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 1px;
    width: 100%;
  }
  .design-nav-menu {
    position: relative;
    display: block;
    width: 100%;
  }
  .design-nav-menu:hover::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(51,51,51,0.85);
    transition: 0.3s ease;
  }
  .design-nav-menu__title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 34px;
    font-weight: 500;
    color: var(--white);
    font-family: var(--cormorant-garamond);
    text-align: center;
    overflow: hidden;
  }
  .design-nav-menu__title > span {
    display: block;
    width: 100%;
    line-height: 34px;
    line-height: 34px;
    font-size: min(24px + (28 - 24) * ((100vw - 320px) / (375 - 320)), 28px);
    transition: 0.3s ease;
  }
  .design-nav-menu__title > span:nth-child(2) {
    transform: translateY(100%);
  }
  .design-nav-menu:hover .design-nav-menu__title > span:nth-child(1) {
    transform: translateY(-100%);
  }
  .design-nav-menu:hover .design-nav-menu__title > span:nth-child(2) {
    transform: translateY(-100%);
  }
  .design-nav-menu__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 150px;
    overflow: hidden;
  }
  .design-nav-menu__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: 0.3s ease;
  }
  .design-nav-menu:hover .design-nav-menu__figure > img {
    transform: scale(1.15);
  }
}
@media screen and (min-width:768px) {
  .design-feature {
    display: block;
    width: 100%;
  }
  .design-feature__hgroup {
    display: block;
    width: 100%;
    padding: 100px 0 50px;
    background-color: #F9F8F6;
  }
  .design-feature__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .design-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .design-feature__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .design-nav {
    display: grid;
    grid-template-columns: repeat(5,1fr);
    column-gap: 1px;
    width: 100%;
  }
  .design-nav-menu {
    position: relative;
    display: block;
    width: 100%;
  }
  .design-nav-menu:hover::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(51,51,51,0.85);
    transition: 0.3s ease;
  }
  .design-nav-menu__title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 26px;
    overflow: hidden;
    font-weight: 500;
    color: var(--white);
    font-family: var(--cormorant-garamond);
    text-align: center;
  }
  .design-nav-menu__title > span {
    display: block;
    width: 100%;
    height: 26px;
    line-height: 26px;
    font-size: min(16px + (22 - 16) * ((100vw - 768px) / (1366 - 768)), 22px);
    transition: 0.3s ease;
  }
  .design-nav-menu__title > span:nth-child(2) {
    transform: translateY(100%);
  }
  .design-nav-menu:hover .design-nav-menu__title > span:nth-child(1) {
    transform: translateY(-100%);
  }
  .design-nav-menu:hover .design-nav-menu__title > span:nth-child(2) {
    transform: translateY(-100%);
  }
  .design-nav-menu__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 500px;
    overflow: hidden;
  }
  .design-nav-menu__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: 0.3s ease;
  }
  .design-nav-menu:hover .design-nav-menu__figure > img {
    transform: scale(1.15);
  }
}
/*main*/
@media screen and (max-width:767px) {
  .design-feature-main {
    display: block;
    width: 100%;
  }
  .design-feature-box {
    display: block;
    width: 100%;
    padding:50px 0 50px;
    background-color: var(--white);
  }
  .design-feature-box:nth-child(even) {
    background-color: #F9F8F6;
  }
  .design-feature-box__wrap {
    position: relative;
    display: block;
    width: 100%;
  }
  .design-feature-box__title {
    display: flex;
    align-items: flex-start;
    margin-left: 5px;
  }
  .design-feature-box__title > span:nth-child(1) {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 40px;
    font-size:40px;
    font-weight: 500;
    line-height: 50px;
    writing-mode: vertical-lr;
    letter-spacing: 0.1em;
    margin-right: 5px;
    font-family: var(--cormorant-garamond);
  }
  .design-feature-box__title > span:nth-child(2) {
    display: flex;
    justify-content: flex-start;
    text-align: left;
    word-break: break-all;
    width: 20px;
    font-size: 20px;
    line-height: 20px;
    writing-mode: vertical-lr;
    letter-spacing: 0.1em;
  }
  .design-feature-box__content {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    padding-bottom: 50px;
    margin-top: 50px;
  }
  .design-feature-box__figure {
    display: block;
    width: 100%;
    margin-bottom: 50px;
  }
  .design-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .design-feature-box__block {
    display: flex;
    justify-content: center;
    max-width: 520px;
    width: 100%;
    margin: 0 auto;
  }
  .design-feature-box__txt {
    position: relative;
    z-index: 2;
    display: block;
    width:100%;
    padding: 20px;
    background-color: var(--white);
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    letter-spacing: 0.07em;
  }
  .design-feature-box:nth-child(even) .design-feature-box__txt {
    background-color: #F9F8F6;
  }
  .design-feature-box__bg {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(188/375 * 100%);
    height: 100%;
    overflow: hidden;
  }
  .design-feature-box__bg > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) {
  .design-feature-main {
    display: block;
    width: 100%;
  }
  .design-feature-box {
    display: block;
    width: 100%;
    padding:100px 0 100px max(20px,((100% - 1366px)/2));
    background-color: var(--white);
  }
  .design-feature-box:nth-child(even) {
    background-color: #F9F8F6;
  }
  .design-feature-box__wrap {
    position: relative;
    display: block;
    width: 100%;
    padding: 100px 0 0 0;
  }
  .design-feature-box__title {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: flex-start;
  }
  .design-feature-box__title > span:nth-child(1) {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: min(45px + (60 - 45) * ((100vw - 768px) / (1366 - 768)), 60px);
    font-size: min(30px + (50 - 30) * ((100vw - 768px) / (1366 - 768)), 50px);
    font-weight: 500;
    line-height: 50px;
    writing-mode: vertical-lr;
    letter-spacing: 0.1em;
    font-family: var(--cormorant-garamond);
  }
  .design-feature-box__title > span:nth-child(2) {
    display: flex;
    justify-content: flex-start;
    text-align: left;
    word-break: break-all;
    width: min(16px + (20 - 16) * ((100vw - 768px) / (1366 - 768)), 20px);
    font-size: min(16px + (20 - 16) * ((100vw - 768px) / (1366 - 768)), 20px);
    line-height: 20px;
    writing-mode: vertical-lr;
    letter-spacing: 0.1em;
  }
  .design-feature-box__content {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    padding-bottom: 100px;
  }
  .design-feature-box__figure {
    display: block;
    width: 100%;
    padding-left: min(85px + (163 - 85) * ((100vw - 768px) / (1366 - 768)), 163px);
  }
  .design-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .design-feature-box__block {
    display: flex;
    justify-content: center;
    max-width: 1386px;
    width: 100%;
    margin-top: -100px;
    padding-right: 20px;
  }
  .design-feature-box__txt {
    position: relative;
    z-index: 2;
    display: block;
    width:min(485px + (685 - 485) * ((100vw - 768px) / (1366 - 768)), 685px);
    padding: min(30px + (50 - 30) * ((100vw - 768px) / (1366 - 768)), 50px);
    background-color: var(--white);
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    letter-spacing: 0.07em;
  }
  .design-feature-box:nth-child(even) .design-feature-box__txt {
    background-color: #F9F8F6;
  }
  .design-feature-box__bg {
    position: absolute;
    bottom: 0;
    left: 0;
    display: block;
    width: min(400px + (600 - 400) * ((100vw - 768px) / (1920 - 768)), 600px);
  }
  .design-feature-box__bg > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*
PAGE - master
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .master-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .master-intro__body {
    display: block;
    width: 100%;
  }
  .master-intro__header {
    display: flex;
    flex-direction: column;
    width: calc(100% + 40px);
    background-image: url(./assets/images/master/master.png);
    background-repeat: no-repeat;
    background-position: top 10px center;
    background-size: 100% auto;
    margin-left: -20px;
    padding: 0 20px;
  }
  .master-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
  }
  .master-intro__header > span:nth-child(2) {
    font-size: 30px;
    font-weight: 500;
    line-height: 48px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .master-intro__txt {
    display: block;
    width: 100%;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
    letter-spacing: 0.07em;
  }
}
@media screen and (min-width:768px) {
  .master-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .master-intro__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .master-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 40px 0 50px;
    background-image: url(./assets/images/master/master.png);
    background-repeat: no-repeat;
    background-position: left top 40px;
    background-size: auto calc(100% - 40px);
  }
  .master-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .master-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .master-intro__txt {
    display: block;
    width: 100%;
    text-align: center;
    letter-spacing: 0.07em;
  }
}
/*main*/
@media screen and (max-width:767px) {
  .master-main {
    display: block;
    width: 100%;
  }
  .master-box {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .master-box:nth-child(odd) {
    background-color: #F9F8F6;
  }
  .master-box__wrap {
    display: block;
    width: 100%;
  }
  .master-box_figure {
    display: block;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .master-box__content {
    position: relative;
    z-index: 1;
    display: block;
    width:100%;
    padding: 20px;
    background-color: rgba(255,255,255,0.95);
    margin-top: -20px;
  }
  .master-box:nth-child(even) .master-box__content {
    margin-left: auto;
    background-color: rgba(249,248,246,0.95);
  }
  .master-box__title {
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 34px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .master-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .master-main {
    display: block;
    width: 100%;
  }
  .master-box {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .master-box:nth-child(odd) {
    background-color: #F9F8F6;
  }
  .master-box__wrap {
    position: relative;
    display: block;
    width: 100%;
    padding-top:min(375px + (450 - 375) * ((100vw - 1025px) / (1140 - 1025)), 450px);
  }
  .master-box_figure {
    position: absolute;
    top: 0;
    display: block;
    width: calc(940/1140 * 100%);
  }
  .master-box:nth-child(odd) .master-box_figure {
    right: 0;
  }
  .master-box:nth-child(even) .master-box_figure {
    left: 0;
  }
  .master-box__content {
    position: relative;
    z-index: 1;
    display: block;
    width: calc(570/1140 * 100%);
    padding: calc(50/1140 * 100%);
    background-color: rgba(255,255,255,0.95);
  }
  .master-box:nth-child(even) .master-box__content {
    margin-left: auto;
    background-color: rgba(249,248,246,0.95);
  }
  .master-box__title {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .master-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .master-box__wrap {
    padding-top: 250px;
  }
  .master-box__title {
    font-size: 26px;
    line-height: 45px;
  }
  .master-box__txt {
    margin-top: 30px;
  }
}
/*
PAGE - flow
--------------------------------------------- */
@media screen and (max-width:767px) {
  .flow {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .flow__body {
    display: block;
    width: 100%;
  }
  .flow__header {
    display: flex;
    flex-direction: column;
    width: calc(100% + 40px);
    background-image: url(./assets/images/flow/flow.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
    margin-left: -20px;
    padding: 0 20px 50px;
  }
  .flow__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
  }
  .flow__header > span:nth-child(2) {
    font-size: 32px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .flow__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
    letter-spacing: 0.07em;
  }
  .flow-list {
    display: block;
    width: 100%;
    margin: 0 auto;
    padding: 80px 0;
  }
  .flow-list > li {
    position: relative;
    display: block;
    width: 100%;
    padding: 20px;
    border: 1px solid #D3D3D3;
  }
  .flow-list > li + li {
    margin-top: 30px;
  }
  .flow-list > li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: calc(20px + 80px);
    left: 43px;
    display: block;
    width: 1px;
    height: calc(100% - 20px - 80px + 31px);
    background-color: #D3D3D3;
  }
  .flow-list > li > .question {
    position: relative;
    display: flex;
    align-items: flex-start;
    width: 100%;
    min-height: 70px;
    padding: 0 0 0 50px;
  }
  .flow-list > li > .question > .question-txt {
    display: none;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 70px;
  }
  .flow-list > li > .question.active > .question-txt {
    display: block;
  }
  .flow-list > li > .question > .question-txt > small {
    font-size: 15px;
  }
  .question-badge {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    width: 46px;
  }
  .question-badge > i {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 20px;
  }
  .question-badge > span {
    font-size: 40px;
    font-weight: 500;
    line-height: 50px;
  }
  .flow-list > li > .question > i {
    position: absolute;
    top: 20px;
    right: 0;
    display: block;
    width: 30px;
    height: 30px;
  }
  .flow-list > li > .question > i::before,
  .flow-list > li > .question > i::after {
    content: "";
    position: absolute;
    transform: translate(-50%,-50%);
    display: block;
    background-color: #222222;
  }
  .flow-list > li > .question > i::before {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
  }
  .flow-list > li > .question > i::after {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
    transform: rotate(90deg) translate(-50%,-50%);
    transform-origin: 0 50%;
    transition: 0.3s ease;
  }
  .flow-list > li > .question.active > i::after {
    top: 50%;
    left: 50%;
    transform: rotate(0deg) translate(-50%,-50%);
    transform-origin: 0 0%;
  }
  .flow-list > li > .answer {
    display: none;
    width: 100%;
  }
  .answer-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px 0 0 50px;
  }
  .answer-figure {
    display: block;
    width: 100%;
  }
  .answer-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .answer-content {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .answer-txt {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.07em;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
  }
  .answer-btns {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin-top: 20px;
  }
  .answer-btns > a {
    font-size: 14px;
  }
  .flow-schedule {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-image: url(./assets/images/flow/bg-sp.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .flow-schedule__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .flow-schedule__title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 35px;
    color: #EFE3A6;
    letter-spacing: 0.03em;
    text-align: center;
    margin-bottom: 30px;
  }
  .flow-schedule__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 30px;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .flow-schedule__txt2 {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 30px;
    color: #EFE3A6;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .flow-schedule__txt2 + .flow-schedule__txt {
    margin-top: 10px;
  }
  .flow-schedule__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  .flow-schedule__btns > a {
    max-width: 385px;
  }
  .flow-schedule__btns > a::before {
    background-color: #EFE3A6;
  }
  .flow-schedule__btns > a > span {
    border: 1px solid #EFE3A6;
    color: var(--white);
    background-color: #222222;
    font-size: min(11px + (15 - 11) * ((100vw - 320px) / (375 - 320)), 15px);
  }
}
@media screen and (min-width:768px) {
  .flow {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .flow__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .flow__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0 0 50px;
    background-image: url(./assets/images/flow/flow.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .flow__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .flow__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .flow__txt {
    display: block;
    width: 100%;
    text-align: center;
    letter-spacing: 0.07em;
  }
  .flow-list {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
    padding: 100px 0;
  }
  .flow-list > li {
    position: relative;
    display: block;
    width: 100%;
    padding: 30px;
    border: 1px solid #D3D3D3;
  }
  .flow-list > li + li {
    margin-top: 60px;
  }
  .flow-list > li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: calc(30px + 90px);
    left: 55px;
    display: block;
    width: 1px;
    height: calc(100% - 30px - 90px + 61px);
    background-color: #D3D3D3;
  }
  .flow-list > li > .question {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 90px;
    padding: 0 40px 0 110px;
  }
  .flow-list > li > .question > .question-txt {
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 40px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
  }
  .flow-list > li > .question > .question-txt > small {
    font-size: 20px;
  }
  .question-badge {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    width: 60px;
  }
  .question-badge > i {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 20px;
  }
  .question-badge > span {
    font-size: 50px;
    font-weight: 500;
    line-height: 70px;
  }
  .flow-list > li > .question > i {
    position: absolute;
    top: 30;
    right: 0;
    display: block;
    width: 30px;
    height: 30px;
  }
  .flow-list > li > .question > i::before,
  .flow-list > li > .question > i::after {
    content: "";
    position: absolute;
    transform: translate(-50%,-50%);
    display: block;
    background-color: #222222;
  }
  .flow-list > li > .question > i::before {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
  }
  .flow-list > li > .question > i::after {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
    transform: rotate(90deg) translate(-50%,-50%);
    transform-origin: 0 50%;
    transition: 0.3s ease;
  }
  .flow-list > li > .question.active > i::after {
    top: 50%;
    left: 50%;
    transform: rotate(0deg) translate(-50%,-50%);
    transform-origin: 0 0%;
  }
  .flow-list > li > .answer {
    display: none;
    width: 100%;
  }
  .answer-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: 10px 0 0 110px;
  }
  .answer-figure {
    display: block;
    width: calc(230/728 * 100%);
  }
  .answer-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .answer-content {
    display: block;
    width: calc(474/728 * 100%);
  }
  .answer-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
  }
  .answer-btns {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin-top: 20px;
  }
  .flow-schedule {
    display: block;
    width: 100%;
    padding: 80px 0 50px;
    background-image: url(./assets/images/flow/bg-pc.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .flow-schedule__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .flow-schedule__title {
    display: block;
    width: 100%;
    font-size: 36px;
    font-weight: 500;
    line-height: 50px;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
    margin-bottom: 50px;
  }
  .flow-schedule__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 30px;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: center;
  }
  .flow-schedule__txt2 {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: center;
    margin-top: 10px;
  }
  .flow-schedule__txt2 + .flow-schedule__txt {
    margin-top: 10px;
  }
  .flow-schedule__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  .flow-schedule__btns > a {
    max-width: 385px;
  }
  .flow-schedule__btns > a::before {
    background-color: var(--white);
  }
  .flow-schedule__btns > a > span {
    border: 1px solid var(--white);
    color: var(--white);
    background-color: #222222;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .flow-list > li > .question {
    padding: 0 40px 0 90px;
  }
  .flow-list > li > .question > .question-txt {
    font-size: 24px;
  }
  .flow-list > li > .question > .question-txt > small {
    font-size: 18px;
  }
  .answer-wrap {
    padding: 10px 0 0 90px;
  }
}
/*
PAGE - japanese
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .japanese-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-image: url(./assets/images/japanese/japanese.png);
    background-repeat: no-repeat;
    background-position: top 55px center;
    background-size: auto 53px;
  }
  .japanese-intro__body {
     display: block;
     width: 100%;
  }
  .japanese-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .japanese-intro__header > span:nth-child(1) {
    font-size: min(15px + (16 - 15) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .japanese-intro__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .japanesex-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .japanese-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-image: url(./assets/images/japanese/japanese.png);
    background-repeat: no-repeat;
    background-position: left top 85px;
    background-size: auto 185px;
  }
  .japanese-intro__body {
     display: block;
     max-width: 1040px;
     width: 100%;
     margin: 0 auto;
  }
  .japanese-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .japanese-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .japanese-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .japanesex-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-top: 90px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .japanesex-intro__txt {
    font-size: 13px;
  }
}
/*charm*/
@media screen and (max-width:767px) {
  .japanese-charm {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-image: url(./assets/images/japanese/bg-pc.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .japanese-charm__content {
    display: block;
    max-width: 335px;
    width: 100%;
    margin: 0 auto;
  }
  .japanese-charm__content > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .japanese-charm {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-image: url(./assets/images/japanese/bg-pc.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .japanese-charm__content {
    display: block;
    max-width: 665px;
    width: 100%;
    margin: 0 auto;
  }
  .japanese-charm__content > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*points*/
@media screen and (max-width:767px) {
  .japanese-points {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
    margin-top: 50px;
  }
  .japanese-points__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .japanese-points__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .japanese-points__header > span:nth-child(2) {
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .japanese-points__header > span:nth-child(2) > em {
    font-size: 40px;
  }
  .japanese-points__main {
    display: block;
    max-width: 520px;
    width: 100%;
    margin: 50px auto 0;
    padding: 0 20px;
  }
  .japanese-point {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
  }
  .japanese-point + .japanese-point {
    margin-top: 50px;
  }
  .japanese-point:nth-child(even) {
    flex-direction: row-reverse;
  }

  .japanese-point__title {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
    width: auto;
  }
  .japanese-point__title > span:nth-child(1) {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 20px;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: 0.5em;
    writing-mode: vertical-lr;
    text-align: center;
    word-break: break-all;
    padding-bottom: 40px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 1px 30px;
  }
  .japanese-point__title > span:nth-child(2) {
    display: flex;
    flex-direction: column-reverse;
    width: auto;
    font-size: 30px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: left;
    writing-mode: vertical-lr;
    word-break: break-all;
    padding: 0 20px;
  }
  .japanese-point__title > span:nth-child(2) > i {
    padding-top: 60px;
  }
  .japanese-point__figure {
    display: block;
    width: calc(100/335 * 100%);
  }
  .japanese-point__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .japanese-point__content {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .japanese-point__content-figure {
    display: block;
    width: 100%;
  }
  .japanese-point__content-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .japanese-point__content-txt {
    display: block;
    width: 100%;
    padding: 30px 0;
    font-size: 15px;
    line-height: 2;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .japanese-point:nth-child(even) .japanese-point__content-txt {
    margin-left: auto;
  }
}
@media screen and (min-width:768px) {
  .japanese-points {
    display: block;
    width: 100%;
    padding: 150px 0;
    background-color: #F9F8F6;
  }
  .japanese-points__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .japanese-points__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .japanese-points__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .japanese-points__header > span:nth-child(2) > em {
    font-size: 88px;
  }
  .japanese-points__main {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 100px auto 0;
  }
  .japanese-point {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: calc(1200/1366 * 100%);
    padding-top: 100px;
  }
  .japanese-point + .japanese-point {
    margin-top: 100px;
  }
  .japanese-point:nth-child(odd) {
    margin-left: auto;
  }
  .japanese-point:nth-child(even) {
    flex-direction: row-reverse;
  }
  .japanese-point:nth-child(2) {
    width: calc(1250/1366 * 100%);
  }
  .japanese-point__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 150px;
  }
  .japanese-point:nth-child(2) .japanese-point__title {
    width: 200px;
  }
  .japanese-point__title > span:nth-child(1) {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 24px;
    font-size: 24px;
    line-height: 24px;
    letter-spacing: 0.5em;
    writing-mode: vertical-lr;
    text-align: center;
    word-break: break-all;
    padding-bottom: 60px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 1px 30px;
  }
  .japanese-point__title > span:nth-child(2) {
    display: flex;
    flex-direction: column-reverse;
    width: auto;
    font-size: 50px;
    line-height: 70px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: left;
    writing-mode: vertical-lr;
    word-break: break-all;
    margin-top: 20px;
  }
  .japanese-point__title > span:nth-child(2) > i {
    padding-top: 60px;
  }
  .japanese-point__figure {
    position: absolute;
    top: 0;
    display: block;
    width: calc(250/1200 * 100%);
  }
  .japanese-point:nth-child(odd) .japanese-point__figure {
    left: 150px;
  }
  .japanese-point:nth-child(even) .japanese-point__figure {
    right: 150px;
  }
  .japanese-point:nth-child(2) .japanese-point__figure {
    right: 200px;
  }
  .japanese-point__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .japanese-point__content {
    position: relative;
    z-index: 1;
    display: block;
    width: calc(100% - 150px);
  }
  .japanese-point:nth-child(2) .japanese-point__content {
    width: calc(100% - 200px);
  }
  .japanese-point__content-figure {
    display: block;
    width: 100%;
  }
  .japanese-point:nth-child(odd) .japanese-point__content-figure {
    padding-left: calc(192.9/1050 * 100%);
  }
  .japanese-point:nth-child(even) .japanese-point__content-figure {
    padding-right: calc(192.9/1050 * 100%);
  }
  .japanese-point__content-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .japanese-point__content-txt {
    display: block;
    padding: calc(50/1050 * 100%);
    width: calc(820/1050 * 100%);
    font-size: 15px;
    line-height: 2;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .japanese-point:nth-child(even) .japanese-point__content-txt {
    margin-left: auto;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .japanese-point__title > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
  }
}
/*culture*/
@media screen and (max-width:767px) {
  .japanese-culture {
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
  }
  .japanese-culture__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 50px 20px;
    background-color: #40392D;
  }
  .japanese-culture__header {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: min(19px + (20 - 19) * ((100vw - 320px) / (375 - 320)), 20px);
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: justify;
    word-break: break-all;
  }
  .japanese-culture__txt {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .japanese-culture > picture {
    display: flex;
    width: 50%;
  }
  .japanese-culture > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .japanese-culture {
    position: relative;
    display: block;
    width: 100%;
  }
  .japanese-culture__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 400px;
    min-height: 350px;
    padding: 40px 20px;
    background-color: #40392D;
    margin: 0 auto;
  }
  .japanese-culture__header {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .japanese-culture__txt {
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .japanese-culture > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 400px)/2);
    height: 100%;
    overflow: hidden;
  }
  .japanese-culture > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .japanese-culture__figure1 {
    left: 0;
  }
  .japanese-culture__figure2 {
    right: 0;
  }
}
@media screen and (min-width:1025px) {
  .japanese-culture {
    position: relative;
    display: block;
    width: 100%;
  }
  .japanese-culture__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 555px;
    width: 100%;
    padding: 70px 50px;
    background-color: #40392D;
    margin: 0 auto;
  }
  .japanese-culture__header {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 50px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .japanese-culture__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .japanese-culture > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 555px)/2);
    height: 100%;
    overflow: hidden;
  }
  .japanese-culture > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .japanese-culture__figure1 {
    left: 0;
  }
  .japanese-culture__figure2 {
    right: 0;
  }
}
/*
PAGE - plusone
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .plusone-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-image: url(./assets/images/plusone/plusone.png);
    background-repeat: no-repeat;
    background-position: top 55px center;
    background-size: auto 53px;
  }
  .plusone-intro__body {
     display: block;
     width: 100%;
  }
  .plusone-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .plusone-intro__header > span:nth-child(1) {
    font-size: min(15px + (16 - 15) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .plusone-intro__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .plusone-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .plusone-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-image: url(./assets/images/plusone/plusone.png);
    background-repeat: no-repeat;
    background-position: top 85px center;
    background-size: auto 153.2px;
  }
  .plusone-intro__body {
     display: block;
     max-width: 1040px;
     width: 100%;
     margin: 0 auto;
  }
  .plusone-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .plusone-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .plusone-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .plusone-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .plusone-intro__txt {
    font-size: 13px;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .plusone-feature {
    display: block;
    width: 100%;
  }
  .plusone-feature__hgroup {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: #F9F8F6;
  }
  .plusone-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .plusone-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .plusone-feature__header > span:nth-child(2) {
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .plusone-feature__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .plusone-feature-nav {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 1px;
    width: 100%;
    background-color: var(--white);
  }
  .plusone-feature-nav__link {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 200px;
    overflow: hidden;
  }
  .plusone-feature-nav__title {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    transform: translate(-50%,-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: rgba(51,51,51,0.45);
  }
  .plusone-feature-nav__title > span:nth-child(1) {
    font-size: 26px;
    color: var(--white);
    line-height: 30px;
    font-weight: 700;
    font-family: var(--cormorant-garamond);
    letter-spacing: 0.1em;
  }
  .plusone-feature-nav__title > span:nth-child(2) {
    font-size: 15px;
    color: var(--white);
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .plusone-feature-nav__figure {
    position: relative;
    display: block;
    width: 100%;
  }
  .plusone-feature-nav__figure::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(rgba(51,51,51,0),rgba(51,51,51,0));
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 0.3s ease;
  }
  .plusone-feature-nav__link:hover .plusone-feature-nav__figure::before {
    background-image: linear-gradient(rgba(51,51,51,0.4),rgba(51,51,51,0.4));
    background-blend-mode: multiply;
  }
  .plusone-feature-nav__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: 0.3s ease;
  }
  .plusone-feature-nav__link:hover .plusone-feature-nav__figure > img {
    transform: scale(1.10);
  }
}
@media screen and (min-width:768px) {
  .plusone-feature {
    display: block;
    width: 100%;
  }
  .plusone-feature__hgroup {
    display: block;
    width: 100%;
    padding: 100px 0 50px;
    background-color: #F9F8F6;
  }
  .plusone-feature__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .plusone-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .plusone-feature__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .plusone-feature__txt {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 30px auto 0;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .plusone-feature-nav {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    column-gap: 1px;
    width: 100%;
    background-color: var(--white);
  }
  .plusone-feature-nav__link {
    position: relative;
    display: block;
    width: 100%;
  }
  .plusone-feature-nav__title {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    transform: translate(-50%,-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: rgba(51,51,51,0.45);
  }
  .plusone-feature-nav__title > span:nth-child(1) {
    font-size: min(20px + (26 - 20) * ((100vw - 768px) / (1366 - 768)), 26px);
    color: var(--white);
    line-height: 30px;
    font-weight: 700;
    font-family: var(--cormorant-garamond);
    letter-spacing: 0.1em;
  }
  .plusone-feature-nav__title > span:nth-child(2) {
    font-size: min(13px + (15 - 13) * ((100vw - 768px) / (1366 - 768)), 15px);
    color: var(--white);
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .plusone-feature-nav__figure {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 500px;
    overflow: hidden;
  }
  .plusone-feature-nav__figure::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(rgba(51,51,51,0),rgba(51,51,51,0));
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    transition: 0.3s ease;
  }
  .plusone-feature-nav__link:hover .plusone-feature-nav__figure::before {
    background-image: linear-gradient(rgba(51,51,51,0.8),rgba(51,51,51,0.4));
    background-blend-mode: multiply;
  }
  .plusone-feature-nav__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.3s ease;
  }
  .plusone-feature-nav__link:hover .plusone-feature-nav__figure > img {
    transform: scale(1.10);
  }
}
/*main*/
@media screen and (max-width:767px) {
  .plusone-feature-main {
    display: block;
    width: 100%;
  }
  .plusone-feature-box {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .plusone-feature-box:nth-child(even) {
    background-color: #F9F8F6;
  }
  .plusone-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-bottom: 30px;
  }
  .plusone-feature-box__title > span:nth-child(1) {
    font-size: 40px;
    font-family: var(--cormorant-garamond);
    font-weight: 600;
    line-height: 48px;
  }
  .plusone-feature-box__title > span:nth-child(2) {
    font-size: 16px;
    font-weight: 600;
    line-height: 30px;
    margin-top: 5px;
  }
  .plusone-feature-box__figure {
    display: block;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .plusone-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .plusone-feature-box__content {
    position: relative;
    z-index: 1;
    display: block;
    width: calc(100% + 40px);
    background-color:#F9F8F6;
    margin-left: -20px;
    padding: 30px 20px;
  }
  .plusone-feature-box:nth-child(even) .plusone-feature-box__content {
    background-color: var(--white);
  }
  .plusone-feature-box__content-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .plusone-feature-box__content-block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .plusone-feature-box__content-title {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid var(--font-color);
    margin-bottom: 30px;
  }
  .plusone-feature-box__items {
    display: block;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
  }
  .plusone-feature-box:nth-child(even) .plusone-feature-box__items {
    background-color: #F9F8F6;
  }
  .plusone-feature-box__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .plusone-feature-box__item + .plusone-feature-box__item {
    margin-top: 40px;
  }
  .plusone-feature-box__item-figure {
    display: block;
    width: 140px;
  }
  .plusone-feature-box__item-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .plusone-feature-box__item-content {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .plusone-feature-box__item-title {
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 26px;
    font-weight: 600;
    letter-spacing: 0.05em;
    margin-bottom: 15px;
  }
  .plusone-feature-box__item-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .plusone-feature__summary {
    display: block;
    width: 100%;
    padding-top: 50px;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
  }
}
@media screen and (min-width:768px) {
  .plusone-feature-main {
    display: block;
    width: 100%;
  }
  .plusone-feature-box {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .plusone-feature-box:nth-child(even) {
    background-color: #F9F8F6;
  }
  .plusone-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0 auto 30px;
  }
  .plusone-feature-box__title > span:nth-child(1) {
    font-size: 50px;
    font-family: var(--cormorant-garamond);
    font-weight: 600;
    line-height: 60px;
  }
  .plusone-feature-box__title > span:nth-child(2) {
    font-size: 20px;
    font-weight: 600;
    line-height: 30px;
    margin-top: 5px;
  }
  .plusone-feature-box__figure {
    display: block;
    width: 100%;
  }
  .plusone-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .plusone-feature-box__content {
    position: relative;
    z-index: 1;
    display: block;
    width: calc(900/1140 * 100%);
    padding: calc(50/1140 * 100%);
    background-color:#F9F8F6;
    margin: -90px auto 0;
  }
  .plusone-feature-box:nth-child(even) .plusone-feature-box__content {
    background-color: var(--white);
  }
  .plusone-feature-box__content-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .plusone-feature-box__content-block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .plusone-feature-box__content-title {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .plusone-feature-box__items {
    display: block;
    width: 100%;
    padding: calc(30/800 * 100%);
    background-color: var(--white);
  }
  .plusone-feature-box:nth-child(even) .plusone-feature-box__items {
    background-color: #F9F8F6;
  }
  .plusone-feature-box__item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .plusone-feature-box__item + .plusone-feature-box__item {
    margin-top: 40px;
  }
  .plusone-feature-box__item-figure {
    display: block;
    width: calc(140/740 * 100%);
  }
  .plusone-feature-box__item-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .plusone-feature-box__item-content {
    display: block;
    width: calc(580/740 * 100%);
  }
  .plusone-feature-box__item-title {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    font-weight: 600;
    letter-spacing: 0.05em;
    margin-bottom: 15px;
  }
  .plusone-feature-box__item-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .plusone-feature__summary {
    display: block;
    width: 100%;
    padding-top: 100px;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
  }
}
/*
PAGE - health
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .health-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
    background-image: url(./assets/images/health/health.png);
    background-repeat: no-repeat;
    background-position: top 75px center;
    background-size: 100% auto;
  }
  .health-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
    margin: 0 auto;
  }
  .health-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .health-intro__header > span:nth-child(2) {
    font-size: 32px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .health-intro__main {
    display: block;
    width: 100%;
  }
  .health-intro__figure {
    display: block;
    width: 100%;
  }
  .health-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .health-intro__content {
    display: block;
    width: 100%;
  }
  .health-intro__content-wrap {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .health-intro__content-title {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 42px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .health-intro__content-txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.07em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) {
  .health-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .health-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    padding-bottom: 100px;
    margin: 0 auto;
    background-image: url(./assets/images/health/health.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% auto;
  }
  .health-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .health-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .health-intro__main {
    position: relative;
    display: block;
    width: 100%;
  }
  .health-intro__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 700px;
    overflow: hidden;
  }
  .health-intro__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .health-intro__content {
    position: absolute;
    bottom: 50px;
    left: 0;
    display: block;
    width: 100%;
  }
  .health-intro__content-wrap {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .health-intro__content-title {
    display: block;
    width: calc(520/1040 * 100%);
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
  }
  .health-intro__content-txt {
    display: block;
    width: calc(520/1040 * 100%);
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.07em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .health-intro__content-title {
    font-size: 36px;
    line-height: 50px;
    margin-bottom: 40px;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .health-feature {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .health-feature__body {
    display: block;
    width: 100%;
  }
  .health-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .health-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .health-feature__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .health-feature__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .health-feature__main > article {
    width: 100%;
  }
  .health-feature__main > article + article {
    margin-top: 50px;
  }
  .health-feature-box {
    display: block;
  }
  .health-feature-box__title {
    display: block;
    width: 100%;
    font-size: min(24px + (26 - 24) * ((100vw - 320px) / (375 - 320)), 26px);
    line-height: 37px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .health-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .health-feature-box__figure1 {
    display: block;
    width: 100%;
    margin: 30px auto 0;
  }
  .health-feature-box picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .health-feature-box picture > .caption {
    display: block;
    width: 100%;
    font-size: min(12px + (14 - 12) * ((100vw - 320px) / (375 - 320)), 14px);
    color: #888888;
    line-height: 20px;
    text-align: right;
    word-break: break-all;
    margin-top: 5px;
  }
  .health-feature-box__figure2 {
    display: block;
    width: 100%;
    margin: 30px auto 0;
  }
  .health-feature-box__btns {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .health-feature-box__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 50px;
    border: 1px solid #333333;
    font-size: 15px;
    line-height: 1;
    font-size: 500;
    color: #333333;
    padding: 0 10px;
  }
  .health-feature-box__btn:hover  {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .health-feature-flexbox {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .health-feature-flexbox__content {
    display: block;
    width: 100%;
  }
  .health-feature-flexbox__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .health-feature-flexbox__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .health-feature-flexbox__figure .flexbox-caption {
    display: block;
    width: 100%;
    font-size: min(12px + (14 - 12) * ((100vw - 320px) / (375 - 320)), 14px);
    line-height: 25.5px;
    text-align: center;
    margin-top: 10px;
  }
  .health-feature-box__figure3 {
    display: block;
    width: 100%;
    margin: 30px auto 0;
  }
}
@media screen and (min-width:768px) {
  .health-feature {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .health-feature__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .health-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .health-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .health-feature__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .health-feature__main {
    display: block;
    width: 100%;
    margin-top: 90px;
  }
  .health-feature__main > article {
    width: 100%;
  }
  .health-feature__main > article + article {
    margin-top: 150px;
  }
  .health-feature-box {
    display: block;
  }
  .health-feature-box__title {
    display: block;
    width: 100%;
    font-size: min(33px + (34 - 33) * ((100vw - 1025px) / (1366 - 1025)), 34px);
    line-height: 50px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .health-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .health-feature-box__figure1 {
    display: block;
    width: calc(777.67/1040 * 100%);
    margin: 30px auto 0;
  }
  .health-feature-box picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .health-feature-box picture > .caption {
    display: block;
    width: 100%;
    font-size: 14px;
    color: #888888;
    line-height: 20px;
    text-align: right;
    margin-top: 5px;
  }
  .health-feature-box__figure2 {
    display: block;
    width: calc(506.47/1040 * 100%);
    margin: 50px auto 0;
  }
  .health-feature-box__btns {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .health-feature-box__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 50px;
    border: 1px solid #333333;
    font-size: 15px;
    line-height: 1;
    font-size: 500;
    color: #333333;
    padding: 0 10px;
  }
  .health-feature-box__btn:hover  {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .health-feature-flexbox {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .health-feature-flexbox__content {
    display: block;
    width: calc(500/1040 * 100%);
    padding-top: 30px;
  }
  .health-feature-flexbox__figure {
    display: block;
    width: calc(500/1040 * 100%);
  }
  .health-feature-flexbox__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .health-feature-flexbox__figure .flexbox-caption {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 25.5px;
    text-align: center;
    margin-top: 10px;
  }
  .health-feature-box__figure3 {
    display: block;
    width: calc(800/1040 * 100%);
    margin: 30px auto 0;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .health-feature-box__title {
    font-size: 25px;
    line-height: 40px;
    letter-spacing: 0;
    margin-bottom: 20px;
  }
}
/*
PAGE - maintenance
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .maintenance-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
    background-image: url(./assets/images/maintenance/warranty.png);
    background-repeat: no-repeat;
    background-position: left top 120px;
    background-size: auto 60px;
  }
  .maintenance-intro__body {
    display: block;
    width: 100%;
  }
  .maintenance-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .maintenance-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .maintenance-intro__header > span:nth-child(2) {
    font-size: 32px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .maintenance-intro__txt {
    display: block;
    width: 100%;
    text-align: center;
    word-break: break-all;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .maintenance-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
    background-image: url(./assets/images/maintenance/warranty.png);
    background-repeat: no-repeat;
    background-position: left top 85px;
    background-size: auto 153.2px;
  }
  .maintenance-intro__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .maintenance-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 85px;
  }
  .maintenance-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .maintenance-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .maintenance-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .maintenance-feature {
    display: block;
    width: 100%;
    padding-bottom: 50px;
    background-color: var(--white);
  }
  .maintenance-feature__body {
    display: block;
    width: 100%;
  }
  .maintenance-feature__header {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .maintenance-feature__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .maintenance-feature-box {
    display: block;
    width: 100%;
  }
  .maintenance-feature-box + .maintenance-feature-box {
    margin-top: 80px;
  }
  .maintenance-feature-box__flexbox {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .maintenance-feature-box__content {
    display: block;
    width: 100%;
  }
  .maintenance-feature-box__title {
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 37px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .maintenance-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .maintenance-feature-box__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .maintenance-feature-box__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .maintenance-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-feature-box__block {
    display: block;
    width: 100%;
    margin: 50px auto 0;
  }
  .maintenance-feature-box__block-title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    padding-left: 10px;
    border-left: 3px solid #333333;
    margin-bottom: 30px;
  }
  .maintenance-feature-box__block-flex {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .maintenance-feature-box__block-tbl {
    width: 100%;
    border-bottom:1px solid #DDDDDD;
  }
  .maintenance-feature-box__block-tbl tr th {
    display: block;
    width: 100%;
    background-color: #F7F7F7;
    padding: 15px 0;
    font-size: 15px;
    font-weight: 500;
    color: #70634D;
    line-height: 20px;
    text-align: center;
    vertical-align: text-top;
    border-bottom:1px solid #DDDDDD;
    border-top:1px solid #DDDDDD;
  }
  .maintenance-feature-box__block-tbl tr td {
    display: block;
    width: 100%;
    padding: 15px 20px;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0;
    text-align: justify;
    word-break: break-all;
    vertical-align: text-top;
  }
  .maintenance-feature-box__block-figure1 {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .maintenance-feature-box__block-figure1 > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-feature-box__block-figure2 {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .maintenance-feature-box__block-figure2 > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-warranty {
    display: block;
    width: 100%;
    padding: 30px;
    background-color: #F9F8F6;
  }
  .maintenance-warranty__title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    color: #A8A781;
    text-align: center;
  }
  .maintenance-warranty__wrap {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 30px;
    width: 100%;
    margin-top: 30px;
  }
  .maintenance-warranty-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .maintenance-warranty-box > picture {
    display: block;
    width: 150px;
  }
  .maintenance-warranty-box > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-warranty-box > p {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 22.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .maintenance-equipment {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 20px;
    row-gap: 30px;
    width: 100%;
    padding: 20px;
    background-color: #F9F8F6;
    margin-top: 30px;
  }
  .maintenance-equipment-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .maintenance-equipment-box > picture {
    display: block;
    width: 100%;
  }
  .maintenance-equipment-box > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-equipment-box > h5 {
    display: block;
    width: 100%;
    font-size: min(12px + (15 - 12) * ((100vw - 320px) / (375 - 320)), 15px);
    line-height: 20px;
    font-weight: 500;
    text-align: center;
    margin-top: 10px;
  }
  .maintenance-feature-box__list {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .maintenance-feature-box__list > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    text-align: justify;
    word-break: break-all;
    padding-left: 24px;
    letter-spacing: 0.07em;
  }
  .maintenance-feature-box__list > li > span {
    position: absolute;
    left: 0;
  }
  .maintenance-feature-box__list > li + li {
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) {
  .maintenance-feature {
    display: block;
    width: 100%;
    padding-bottom: 100px;
    background-color: var(--white);
  }
  .maintenance-feature__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .maintenance-feature__header {
    display: block;
    width: 100%;
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .maintenance-feature__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .maintenance-feature-box {
    display: block;
    width: 100%;
  }
  .maintenance-feature-box + .maintenance-feature-box {
    margin-top: 150px;
  }
  .maintenance-feature-box__flexbox {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .maintenance-feature-box__content {
    display: block;
    width: calc(480/1040 * 100%);
  }
  .maintenance-feature-box__title {
    display: block;
    width: 100%;
    font-size: 34px;
    line-height: 50px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .maintenance-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .maintenance-feature-box__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .maintenance-feature-box__figure {
    display: block;
    width: calc(510/1040 * 100%);
  }
  .maintenance-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-feature-box__block {
    display: block;
    max-width: 940px;
    width: 100%;
    margin: 50px auto 0;
  }
  .maintenance-feature-box__block-title {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 40px;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .maintenance-feature-box__block-flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-start;
    width: 100%;
  }
  .maintenance-feature-box__block-tbl {
    width: calc(505/940 * 100%);
    border-top:1px solid #DDDDDD;
  }
  .maintenance-feature-box__block-tbl tr th {
    width: 115px;
    background-color: #F7F7F7;
    padding: 15px 0;
    font-size: 15px;
    font-weight: 500;
    color: #70634D;
    line-height: 20px;
    text-align: center;
    vertical-align: text-top;
    border-bottom:1px solid #DDDDDD;
  }
  .maintenance-feature-box__block-tbl tr td {
    width: calc(100% - 115px);
    padding: 15px 20px;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0;
    text-align: justify;
    word-break: break-all;
    vertical-align: text-top;
    border-bottom:1px solid #DDDDDD;
  }
  .maintenance-feature-box__block-figure1 {
    display: block;
    width: calc(375/940 * 100%);
  }
  .maintenance-feature-box__block-figure1 > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-feature-box__block-figure2 {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .maintenance-feature-box__block-figure2 > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-warranty {
    display: block;
    width: 100%;
    padding: 50px 100px;
    background-color: #F9F8F6;
  }
  .maintenance-warranty__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 600;
    line-height: 40px;
    color: #A8A781;
    text-align: center;
  }
  .maintenance-warranty__wrap {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: calc(70/740 * 100%);
    width: 100%;
    margin-top: 30px;
  }
  .maintenance-warranty-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .maintenance-warranty-box > picture {
    display: block;
    width: calc(150/200 * 100%);
  }
  .maintenance-warranty-box > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-warranty-box > p {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 22.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .maintenance-equipment {
    display: grid;
    grid-template-columns: repeat(6,1fr);
    column-gap: 18px;
    width: 100%;
    padding: 20px 30px;
    background-color: #F9F8F6;
    margin-top: 30px;
  }
  .maintenance-equipment-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .maintenance-equipment-box > picture {
    display: block;
    width: 100%;
  }
  .maintenance-equipment-box > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .maintenance-equipment-box > h5 {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
    text-align: center;
    margin-top: 10px;
  }
  .maintenance-feature-box__list {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .maintenance-feature-box__list > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    text-align: justify;
    word-break: break-all;
    padding-left: 24px;
    letter-spacing: 0.07em;
  }
  .maintenance-feature-box__list > li > span {
    position: absolute;
    left: 0;
  }
  .maintenance-feature-box__list > li + li {
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .maintenance-feature-box__title {
    font-size: 30px;
  }
  .maintenance-equipment-box > h5 {
    font-size: 12px;
    letter-spacing: 0;
  }
}
/*support*/
@media screen and (max-width:767px) {
  .maintenance-support {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .maintenance-support__body {
    display: block;
    width: 100%;
  }
  .maintenance-support__header {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .maintenance-support__flexbox {
    display: flex;
   flex-direction: column;
    width: 100%;
    margin-top: 50px;
  }
  .maintenance-support__content {
    display: block;
    width: 100%;
  }
  .maintenance-support__title {
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 37px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .maintenance-support__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .maintenance-support__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .maintenance-support__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .maintenance-support__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .maintenance-support {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .maintenance-support__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .maintenance-support__header {
    display: block;
    width: 100%;
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .maintenance-support__flexbox {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
  .maintenance-support__content {
    display: block;
    width: calc(480/1040 * 100%);
  }
  .maintenance-support__title {
    display: block;
    width: 100%;
    font-size: 34px;
    line-height: 50px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .maintenance-support__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .maintenance-support__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .maintenance-support__figure {
    display: block;
    width: calc(510/1040 * 100%);
  }
  .maintenance-support__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .maintenance-support__title {
    font-size: 30px;
  }
}
/*
PAGE - model2
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .model2-intro {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .model2-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 50px;
    background-image: url(./assets/images/model2/model.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: auto 53px;
  }
  .model2-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model2-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .model2-intro__header > span:nth-child(2) {
    display: flex;
    flex-direction: column;
    font-size: 30px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .model2-intro__header > span:nth-child(2) > small {
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 20px;
    margin-top: 5px;
  }
  .model2-intro__banner {
    display: block;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .model2-intro__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model2-intro-block {
    display: block;
    width: 100%;
    padding: 30px 0;
  }
  .model2-intro-block__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 20px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 50px 1px;
  }
  .model2-intro-block__title > span:nth-child(1) {
    font-size: 28px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model2-intro-block__title > span:nth-child(2) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    letter-spacing: 0.2em;
    margin-top: 5px;
  }
  .model2-intro-block__subtitle {
    display: block;
    width: 100%;
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .model2-intro-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .model2-intro {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .model2-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 65px;
    background-image: url(./assets/images/model2/model.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: auto 153.2px;
  }
  .model2-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model2-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .model2-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .model2-intro__header > span:nth-child(2) > small {
    font-size: 34px;
  }
  .model2-intro__banner {
    display: block;
    width: 100%;
  }
  .model2-intro__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model2-intro-block {
    display: block;
    width: 100%;
    padding: calc(50/1140* 100%);
  }
  .model2-intro-block__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 30px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 50px 1px;
  }
  .model2-intro-block__title > span:nth-child(1) {
    font-size: 50px;
    font-weight: 500;
    line-height: 60px;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model2-intro-block__title > span:nth-child(2) {
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0.2em;
    margin-top: 5px;
  }
  .model2-intro-block__subtitle {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .model2-intro-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .model2-intro__header > span:nth-child(2) {
    display: flex;
    flex-direction: column;
  }
  .model2-intro__header > span:nth-child(2) > small {
    display: block;
    width: 100%;
    line-height: 40px;
  }
  .model2-intro-block__title > span:nth-child(1) {
    font-size: 38px;
  }
  .model2-intro-block__subtitle {
    font-size: 30px;
  }
}
/*reserve*/
@media screen and (max-width:767px) {
  .model2-reserve1 {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .model2-reserve2 {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .model2-reserve__link {
    position: relative;
    display: block;
    width: 100%;
  }
  .model2-reserve__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .model2-reserve__link-title {
    position: absolute;
    bottom: 10px;
    right: 0;
    display: flex;
    flex-direction: column;
    width: auto;
    padding:0 10px 0 20px;
    border-left: 1px solid var(--white);
    color: var(--white);
  }
  .model2-reserve__link-title > span:nth-child(1) {
    font-size: 15px;
    line-height: 20px;
  }
  .model2-reserve__link-title > span:nth-child(2) {
    font-size: 24px;
    line-height: 30px;
    margin-top: 10px;
  }
  .model2-reserve__link-figure {
    display: block;
    width: 100%;
  }
  .model2-reserve__link-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .model2-reserve1 {
    display: block;
    width: 100%;
    padding: 50px 0 100px;
    background-color: var(--white);
  }
  .model2-reserve2 {
    display: block;
    width: 100%;
    padding: 100px 0 0;
    background-color: var(--white);
  }
  .model2-reserve__link {
    position: relative;
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model2-reserve__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .model2-reserve__link-title {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    width: calc(400/1040 * 100%);
    padding-left: calc(50/1040 * 100%);
    border-left: 1px solid var(--white);
    color: var(--white);
  }
  .model2-reserve__link-title > span:nth-child(1) {
    font-size: 18px;
    line-height: 20px;
  }
  .model2-reserve__link-title > span:nth-child(2) {
    font-size: 33px;
    line-height: 40px;
    margin-top: 10px;
  }
  .model2-reserve__link-figure {
    display: block;
    width: 100%;
  }
  .model2-reserve__link-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .model2-reserve__link-title {
    width: calc(550/1040 * 100%);
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .model2-feature {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .model2-feature .container {
    max-width: 100%;
    padding: 0;
  }
  .model2-feature__body {
    display: block;
    width: 100%;
  }
  .model2-feature__header {
    display: flex;
    flex-direction: column;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
  .model2-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model2-feature__header > span:nth-child(2) {
    font-size: 28px;
    line-height: 36px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model2-feature__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .model2-feature-box {
    display: block;
    width: 100%;
    background-image: linear-gradient(#F5F5F5,#F5F5F5);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 100% calc(100% - 100px);
  }
  .model2-feature-box + .model2-feature-box {
    margin-top: 80px;
  }
  .model2-feature-box__flex {
    display: flex;
    flex-direction: column;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
  .model2-feature-box__flex img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model2-feature-box__figure1 {
    display: block;
    width: calc(208.13/335 * 100%);
  }
  .model2-feature-box:nth-child(even) .model2-feature-box__flex .model2-feature-box__figure1 {
    margin-left: auto;
  }
  .model2-feature-box__figure2 {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .model2-feature-box__content {
    display: block;
    max-width: 520px;
    width: 100%;
    padding: 30px 20px;
    margin: 0 auto;
  }
  .model2-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model2-feature-box__title > span:nth-child(1) {
    font-size: min(23px + (28 - 23) * ((100vw - 320px) / (375 - 320)), 28px);
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model2-feature-box__title > span:nth-child(2) {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .model2-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .model2-feature-box__figure-fullwidth {
    display: block;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
  .model2-feature-box__figure-fullwidth > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .model2-feature {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .model2-feature__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model2-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model2-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model2-feature__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model2-feature__main {
    display: block;
    width: 100%;
    margin-top: 100px;
  }
  .model2-feature-box {
    display: block;
    width: 100%;
  }
  .model2-feature-box + .model2-feature-box {
    margin-top: 100px;
  }
  .model2-feature-box__flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background-image: linear-gradient(#F5F5F5,#F5F5F5);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: calc(990/1040 * 100%) 100px;
  }
  .model2-feature-box:nth-child(even) .model2-feature-box__flex {
    flex-direction: row-reverse;
  }
  .model2-feature-box__flex img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model2-feature-box__figure1 {
    display: block;
    width: calc(390/1040 * 100%);
  }
  .model2-feature-box__figure2 {
    display: block;
    width: calc(600/1040 * 100%);
  }
  .model2-feature-box__content {
    display: block;
    width: calc(990/1040 * 100%);
    padding: 30px calc(50/1040 * 100%);
    background-color: #F5F5F5;
  }
  .model2-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model2-feature-box__title > span:nth-child(1) {
    font-size: 50px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model2-feature-box__title > span:nth-child(2) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .model2-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .model2-feature-box__figure-fullwidth {
    display: block;
    width: 100%;
  }
  .model2-feature-box__figure-fullwidth > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .model2-feature__header > span:nth-child(2) {
    font-size: 36px;
  }
  .model2-feature-box__title > span:nth-child(1) {
    font-size: 40px;
    line-height: 50px;
  }
}
/*location*/
@media screen and (max-width:767px) {
  .model2-location {
    display: block;
    width: 100%;
    padding-top: 50px;
    background-color: #F9F8F6;
  }
  .model2-location__body {
    display: block;
    width: 100%;
  }
  .model2-location__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model2-location__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model2-location__header > span:nth-child(2) {
    font-size: min(23px + (26 - 23) * ((100vw - 320px) / (375 - 320)), 26px);
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model2-location__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 20px;
  }
  .model2-location__tbl {
    width: 100%;
  }
  .model2-location__tbl tr th {
    width: 80px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: #01444D;
    padding: 10px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
    vertical-align: text-top;
  }
  .model2-location__tbl tr td {
    width: calc(100% - 80px);
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    padding: 10px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
  }
  .model2-location__figure {
    width: 100%;
    margin-top: 30px;
  }
  .model2-location__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .model2-location {
    display: block;
    width: 100%;
    padding-top: 100px;
    background-color: #F9F8F6;
  }
  .model2-location__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model2-location__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model2-location__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model2-location__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model2-location__main {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
  .model2-location__tbl {
    width: calc(495/1040 * 100%);
  }
  .model2-location__tbl tr th {
    width: 100px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: #01444D;
    padding: 20px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
    vertical-align: text-top;
  }
  .model2-location__tbl tr td {
    width: calc(100% - 100px);
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    padding: 20px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
  }
  .model2-location__figure {
    width: calc(495/1040 * 100%);
  }
  .model2-location__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*access*/
@media screen and (max-width:767px) {
  .model2-access {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .model2-access__body {
    display: block;
    width: 100%;
  }
  .model2-access__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model2-access__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model2-access__header > span:nth-child(2) {
    font-size: min(23px + (26 - 23) * ((100vw - 320px) / (375 - 320)), 26px);
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model2-access__map {
    display: block;
    width: 100%;
    height: 335px;
    overflow: hidden;
    margin-top: 30px;
  }
  .model2-access__map > iframe {
    width: 100%;
    height: 100%;
  }
  .model2-access__block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .model2-access__block > dt {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    padding-left: 15px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    border-left: 5px solid #DBDBDB;
  }
  .model2-access__block > dd {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
}
@media screen and (min-width:768px) {
  .model2-access {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .model2-access__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model2-access__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model2-access__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model2-access__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model2-access__map {
    display: block;
    width: 100%;
    height: 400px;
    overflow: hidden;
    margin-top: 50px;
  }
  .model2-access__map > iframe {
    width: 100%;
    height: 100%;
  }
  .model2-access__block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .model2-access__block > dt {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    padding-left: 15px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    border-left: 5px solid #DBDBDB;
  }
  .model2-access__block > dd {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
}
/*
PAGE - longtrem
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .longtrem-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
    background-image: url(./assets/images/longtrem/longtrem.png);
    background-repeat: no-repeat;
    background-position: left top 50px;
    background-size: auto 60px;
  }
  .longtrem-intro__body {
    display: block;
    width: 100%;
  }
  .longtrem-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .longtrem-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .longtrem-intro__header > span:nth-child(2) {
    font-size: 32px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .longtrem-intro__title {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 37px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .longtrem-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
  }
  .longtrem-intro__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
}
@media screen and (min-width:768px) {
  .longtrem-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
    background-image: url(./assets/images/longtrem/longtrem.png);
    background-repeat: no-repeat;
    background-position: left top 85px;
    background-size: auto 194.4px;
  }
  .longtrem-intro__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .longtrem-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 100px;
  }
  .longtrem-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .longtrem-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .longtrem-intro__title {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
  }
  .longtrem-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
  }
  .longtrem-intro__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
}
/*merit*/
@media screen and (max-width:767px) {
  .longtrem-merit {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .longtrem-merit__body {
    display: block;
    width: 100%;
  }
  .longtrem-merit__header {
    display: block;
    width: 100%;
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    font-weight: 500;
    line-height: 45px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
  }
  .longtrem-merit__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .longtrem-merit__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .longtrem-merit-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
  }
  .longtrem-merit-box + .longtrem-merit-box {
    margin-top: 50px;
  }
  .longtrem-merit-box__content {
    display: block;
    width: 100%;
  }
  .longtrem-merit-box_title {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    font-size: min(21px + (26 - 21) * ((100vw - 320px) / (375 - 320)), 26px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    text-align: center;
    word-break: break-all;
  }
  .longtrem-merit-box_title > span {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 75px;
  }
  .longtrem-merit-box_title > span > i {
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0;
  }
  .longtrem-merit-box_title > span > em {
    font-size: 60px;
    line-height: 70px;
    font-weight: 500;
    letter-spacing: 0;
  }
  .longtrem-merit-box__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .longtrem-merit-box__figure {
    display: block;
    width: 180px;
    margin-top: 20px;
  }
  .longtrem-merit-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .longtrem-merit-box__row {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 20px;
  }
  .longtrem-merit-box__row > dt {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 124px;
    height: 33px;
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
  }
  .longtrem-merit-box__row > dt.blue {
    border: 1px solid #3D97D5;
    color: #3D97D5;
  }
  .longtrem-merit-box__row > dt.red {
    border: 1px solid #A93434;
    color: #A93434;
  }
  .longtrem-merit-box__row > dd {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 23px;
    font-weight: 500;
    padding: 5px 0;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) {
  .longtrem-merit {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .longtrem-merit__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .longtrem-merit__header {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
  }
  .longtrem-merit__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .longtrem-merit__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .longtrem-merit-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: calc(40/1040 * 100%) calc(30/1040 * 100%);
    background-color: var(--white);
  }
  .longtrem-merit-box + .longtrem-merit-box {
    margin-top: 50px;
  }
  .longtrem-merit-box__content {
    display: block;
    width: calc(742/980 * 100%);
  }
  .longtrem-merit-box_title {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 90px;
    padding-left: 95px;
    font-size: 34px;
    font-weight: 500;
    line-height: 48px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .longtrem-merit-box_title > span {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 75px;
  }
  .longtrem-merit-box_title > span > i {
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0;
  }
  .longtrem-merit-box_title > span > em {
    font-size: 60px;
    line-height: 70px;
    font-weight: 500;
    letter-spacing: 0;
  }
  .longtrem-merit-box__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 15px;
  }
  .longtrem-merit-box__figure {
    display: block;
    width: calc(208/980 * 100%);
  }
  .longtrem-merit-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .longtrem-merit-box__row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 15px;
  }
  .longtrem-merit-box__row > dt {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 124px;
    height: 33px;
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
  }
  .longtrem-merit-box__row > dt.blue {
    border: 1px solid #3D97D5;
    color: #3D97D5;
  }
  .longtrem-merit-box__row > dt.red {
    border: 1px solid #A93434;
    color: #A93434;
  }
  .longtrem-merit-box__row > dd {
    display: block;
    width: calc(100% - 144px);
    font-size: 15px;
    line-height: 23px;
    font-weight: 500;
    padding: 5px 0;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .longtrem-merit-box_title {
    font-size: 26px;
    letter-spacing: 0.07em;
  }
}
/*basic*/
@media screen and (max-width:767px) {
  .longtrem-basic {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .longtrem-basic__header {
    display: block;
    width: 100%;
  }
  .longtrem-basic__header {
    display: block;
    width: 100%;
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
    letter-spacing: 0;
  }
  .longtrem-basic__figure {
    display: block;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .longtrem-basic__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .longtrem-basic-block {
    display: block;
    width: 100%;
    margin: 50px auto 0;
    background-color: #F9F8F6;
    padding: 20px;
  }
  .longtrem-basic-block__title {
    display: block;
    width: 100%;
    font-size: min(18px + (20 - 18) * ((100vw - 320px) / (375 - 320)), 20px);
    font-weight: 500;
    line-height: 30px;
    padding-left: 15px;
    border-left: 3px solid var(--font-color);
    margin-bottom: 30px;
  }
  .longtrem-basic-block__tbl {
    width: 100%;
    border-collapse: collapse;
    border-bottom:1px solid #DDDDDD;
  }
  .longtrem-basic-block__tbl tr th {
    display: block;
    width: 100%;
    background-color: #F7F7F7;
    padding: 15px;
    font-size: 15px;
    font-weight: 500;
    color: #70634D;
    line-height: 28px;
    text-align: center;
    vertical-align: text-top;
    border-top:1px solid #DDDDDD;
    border-bottom:1px solid #DDDDDD;
    border-left:1px solid var(--white);
    border-right:1px solid var(--white);
  }
  .longtrem-basic-block__tbl tr td {
     display: block;
    width: 100%;
    padding: 15px;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0;
    text-align: justify;
    word-break: break-all;
    vertical-align: text-top;
    background-color: var(--white);
  }
}
@media screen and (min-width:768px) {
  .longtrem-basic {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .longtrem-basic__header {
    display: block;
    max-width: 1060px;
    width: 100%;
    margin: 0 auto;
  }
  .longtrem-basic__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
  }
  .longtrem-basic__figure {
    display: block;
    width: 100%;
  }
  .longtrem-basic__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .longtrem-basic-block {
    display: block;
    width: calc(900/1040 * 100%);
    margin: 50px auto 0;
    background-color: #F9F8F6;
    padding: calc(50/1040 * 100%);
  }
  .longtrem-basic-block__title {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 40px;
    padding-left: 15px;
    border-left: 5px solid var(--font-color);
    margin-bottom: 30px;
  }
  .longtrem-basic-block__tbl {
    width: 100%;
    border-collapse: collapse;
    border-top:1px solid #DDDDDD;
  }
  .longtrem-basic-block__tbl tr th {
    width: 160px;
    background-color: #F7F7F7;
    padding: 15px 20px;
    font-size: 15px;
    font-weight: 500;
    color: #70634D;
    line-height: 28px;
    text-align: left;
    vertical-align: text-top;
    border-bottom:1px solid #DDDDDD;
  }
  .longtrem-basic-block__tbl tr td {
    width: calc(100% - 160px);
    padding: 15px 20px;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0;
    text-align: justify;
    word-break: break-all;
    vertical-align: text-top;
    border-bottom:1px solid #DDDDDD;
    background-color: var(--white);
  }
}
/*flow*/
@media screen and (max-width:767px) {
  .longtrem-flow {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .longtrem-flow__body {
    display: block;
    width: 100%;
  }
  .longtrem-flow__header {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 40px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .longtrem-flow__block {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
  }
  .longtrem-flow-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .longtrem-flow-box + .longtrem-flow-box {
    margin-top: 10px;
  }
  .longtrem-flow-box__title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.1em;
    text-align: center;
    margin-bottom: 10px;
  }
  .longtrem-flow-box.application > .longtrem-flow-box__title {
    color: #70634D;
  }
  .longtrem-flow-box.construct > .longtrem-flow-box__title {
    color: #00444D;
  }
  .longtrem-flow-box__list {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 30px;
    width: 100%;
  }
  .longtrem-flow-box__list > li {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 60px;
    font-size: 15px;
    line-height: 1;
    color: var(--white);
  }
  .longtrem-flow-box__list.application > li {
    background-color: #70634D;
  }
  .longtrem-flow-box__list.construct > li {
    background-color: #01444D;
  }
  .longtrem-flow-box__list > li:not(:last-child)::after {
    content: "";
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 20px 0px 20px;
  }
  .longtrem-flow-box__list.application > li:not(:last-child)::after {
    border-color: #70634D transparent transparent transparent;
  }
  .longtrem-flow-box__list.construct > li:not(:last-child)::after {
    border-color: #01444D transparent transparent transparent;
  }
  .longtrem-procedure__block {
    display: block;
    width: 100%;
    margin: 50px auto 0;
  }
  .longtrem-procedure {
    display: block;
    width: 100%;
  }
  .longtrem-procedure.application {
    padding-bottom: 30px;
    border-bottom: 1px solid #D3D3D3;
  }
  .longtrem-procedure.construct {
    padding-top: 30px;
  }
  .longtrem-procedure__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .longtrem-procedure__title.application {
    color: #70634D;
  }
  .longtrem-procedure__title.construct {
    color: #00444D;
  }
  .longtrem-procedure__step {
    display: block;
    width: 100%;
  }
  .longtrem-procedure__step > li {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .longtrem-procedure__step > li:not(:last-child) {
    padding-bottom: 55px;
    background-repeat: no-repeat;
    background-position: left 22px bottom 15px;
    background-size: 25px auto;
  }
  .longtrem-procedure__step.application > li:not(:last-child) {
    background-image: url(./assets/images/longtrem/arrow-brn.png);
  }
  .longtrem-procedure__step.construct > li:not(:last-child) {
    background-image: url(./assets/images/longtrem/arrow-bl.png);
  }
  .longtrem-procedure__step-title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
  }
  .longtrem-procedure__step.application .longtrem-procedure__step-title {
    color: #70634D;
  }
  .longtrem-procedure__step.construct .longtrem-procedure__step-title {
    color: #00444D;
  }
  .longtrem-procedure__step-title > small {
    font-size: 16px;
  }
  .longtrem-procedure__step-txt {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-top: 5px;
  }
}
@media screen and (min-width:768px) {
  .longtrem-flow {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .longtrem-flow__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .longtrem-flow__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
  }
  .longtrem-flow__block {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: calc(50/1040 * 100%) calc(75/1040 * 100%);
    background-color: var(--white);
  }
  .longtrem-flow-box {
    display: block;
  }
  .longtrem-flow-box + .longtrem-flow-box {
    margin-top: 10px;
  }
  .longtrem-flow-box.application {
    width: 100%;
  }
  .longtrem-flow-box.construct {
    width: calc(740/890 * 100%)
  }
  .longtrem-flow-box__title {
    display: block;
    width: 100%;
    font-size: 22px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 10px;
  }
  .longtrem-flow-box.application > .longtrem-flow-box__title {
    color: #70634D;
  }
  .longtrem-flow-box.construct > .longtrem-flow-box__title {
    color: #00444D;
  }
  .longtrem-flow-box__list {
    display: grid;
    column-gap: 22px;
    width: 100%;
  }
  .longtrem-flow-box__list.application {
    grid-template-columns: repeat(6,1fr);
  }
  .longtrem-flow-box__list.construct {
    grid-template-columns: repeat(5,1fr);
  }
  .longtrem-flow-box__list > li {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 60px;
    font-size: 15px;
    line-height: 1;
    color: var(--white);
  }
  .longtrem-flow-box__list.application > li {
    background-color: #70634D;
  }
  .longtrem-flow-box__list.construct > li {
    background-color: #01444D;
  }
  .longtrem-flow-box__list > li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 0;
    right: -12px;
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 0px 30px 12px;
  }
  .longtrem-flow-box__list.application > li:not(:last-child)::after {
    border-color: transparent transparent transparent #70634D;
  }
  .longtrem-flow-box__list.construct > li:not(:last-child)::after {
    border-color: transparent transparent transparent #01444D;
  }
  .longtrem-procedure__block {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    width: calc(900/1040 * 100%);
    margin: 50px auto 0;
  }
  .longtrem-procedure {
    display: block;
    width: 100%;
  }
  .longtrem-procedure.application {
    padding-right: calc(50/450 * 100%);
    border-right: 1px solid #D3D3D3;
  }
  .longtrem-procedure.construct {
    padding-left: calc(50/450 * 100%);
  }
  .longtrem-procedure__title {
    display: block;
    width: 100%;
    font-size: 34px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
  }
  .longtrem-procedure__title.application {
    color: #70634D;
  }
  .longtrem-procedure__title.construct {
    color: #00444D;
  }
  .longtrem-procedure__step {
    display: block;
    width: 100%;
  }
  .longtrem-procedure__step > li {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .longtrem-procedure__step > li:not(:last-child) {
    padding-bottom: 55px;
    background-repeat: no-repeat;
    background-position: left 22px bottom 15px;
    background-size: 25px auto;
  }
  .longtrem-procedure__step.application > li:not(:last-child) {
    background-image: url(./assets/images/longtrem/arrow-brn.png);
  }
  .longtrem-procedure__step.construct > li:not(:last-child) {
    background-image: url(./assets/images/longtrem/arrow-bl.png);
  }
  .longtrem-procedure__step-title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
  }
  .longtrem-procedure__step.application .longtrem-procedure__step-title {
    color: #70634D;
  }
  .longtrem-procedure__step.construct .longtrem-procedure__step-title {
    color: #00444D;
  }
  .longtrem-procedure__step-title > small {
    font-size: 16px;
  }
  .longtrem-procedure__step-txt {
    display: block;
    width: 100%;
    font-size: min(18px + (20 - 18) * ((100vw - 1025px) / (1140 - 1025)), 20px);
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-top: 5px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .longtrem-flow__block {
    padding: 20px 30px;
  }
  .longtrem-flow-box__list > li {
    height: 50px;
    font-size: 12px;
  }
  .longtrem-flow-box__list > li:not(:last-child)::after {
    border-width: 25px 0px 25px 12px;
  }
  .longtrem-procedure__title {
    font-size: 30px;
    line-height: 44px;
    margin-bottom: 30px;
  }
  .longtrem-procedure__block {
    width: calc(960/1040 * 100%);
    margin: 30px auto 0;
  }
  .longtrem-procedure__step-txt {
    font-size:15px;
  }
}
/*cta*/
@media screen and (max-width:767px) {
  .longtrem-cta {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: #666666;
  }
  .longtrem-cta__body {
    display: block;
    width: 100%;
  }
  .longtrem-cta__main {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .longtrem-cta__header {
    display: block;
    width: 100%;
    font-size: min(20px + (22 - 20) * ((100vw - 320px) / (375 - 320)), 22px);
    font-weight: 500;
    line-height: 40px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
    letter-spacing: 0;
  }
  .longtrem-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .longtrem-cta__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 30px;
  }
  .longtrem-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .longtrem-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .longtrem-cta__figure {
    display: block;
    width: 100%;
  }
  .longtrem-cta__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .longtrem-cta {
    position: relative;
    display: block;
    width: 100%;
    padding: 85px 0;
    background-color: #666666;
  }
  .longtrem-cta__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .longtrem-cta__main {
    display: block;
    width: calc(455/1040 * 100%);
  }
  .longtrem-cta__header {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 50px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .longtrem-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .longtrem-cta__btns {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .longtrem-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .longtrem-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .longtrem-cta__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .longtrem-cta__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .longtrem-cta {
    padding: 60px 0;
  }
  .longtrem-cta__header {
    font-size: 21px;
    line-height: 40px;
    margin-bottom: 20px;
  }
}
/*
PAGE - family
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .family-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
    background-image: url(./assets/images/family/family.png);
    background-repeat: no-repeat;
    background-position: left top 75px;
    background-size: auto 48.05px;
  }
  .family-intro__body {
    display: block;
    width: 100%;
  }
  .family-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 30px;
  }
  .family-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .family-intro__header > span:nth-child(2) {
    font-size: 32px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .family-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .family-intro__title {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 45px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin: 50px 0 30px;
  }
  .family-intro__columns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .family-intro__col-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .family-intro__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .family-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .family-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
    background-image: url(./assets/images/family/family.png);
    background-repeat: no-repeat;
    background-position: left top 85px;
    background-size: auto 153.2px;
  }
  .family-intro__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .family-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 85px;
  }
  .family-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .family-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .family-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
  }
  .family-intro__title {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin: 50px 0;
  }
  .family-intro__columns {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .family-intro__col-txt {
    display: block;
    width: calc(480/1040 * 100%);
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .family-intro__figure {
    display: block;
    width: calc(510/1040 * 100%);
  }
  .family-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*type*/
@media screen and (max-width:767px) {
  .family-type {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .family-type__header {
    display: block;
    width: 100%;
    font-size: min(20px + (23 - 20) * ((100vw - 320px) / (375 - 320)), 23px);
    font-weight: 500;
    line-height: 33px;
    text-align: center;
  }
  .family-type__header > span {
    font-size: min(42px + (52 - 42) * ((100vw - 320px) / (375 - 320)), 52px);
  }
  .family-type__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .family-type-box {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-top: 30px;
  }
  .family-type-box::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 70px;
    height: 70px;
    background-repeat: no-repeat;
    background-position: right top;
    background-size: 100% auto;
  }
  .family-type-box:nth-child(1)::before {
    background-image: url(./assets/images/family/badge1.png);
  }
  .family-type-box:nth-child(2)::before {
    background-image: url(./assets/images/family/badge2.png);
  }
  .family-type-box:nth-child(3)::before {
    background-image: url(./assets/images/family/badge3.png);
  }
  .family-type-box + .family-type-box {
    margin-top: 80px;
  }
  .family-type-box__figure {
    display: block;
    width: 100%;
  }
  .family-type-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .family-type-box__content {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .family-type-box__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 37px;
    text-align: center;
    margin-bottom: 30px;
  }
  .family-type-box__subtitle {
    display: block;
    width: 100%;
    font-size:22px;
    line-height: 30px;
    color: #A5A47F;
    font-weight: 500;
    padding-bottom: 5px;
    text-decoration: underline;
    text-underline-offset: 10px;
  }
  .family-type-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 15px;
  }
  .family-type-box__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .family-type-box__list  {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 15px;
  }
  .family-type-box__list > dt {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 124px;
    height: 33px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
  }
  .family-type-box__list.merit > dt {
    border: 1px solid #3D97D5;
    color: #3D97D5;
  }
  .family-type-box__list.demerit > dt {
    border: 1px solid #A93434;
    color: #A93434;
  }
  .family-type-box__list > dd {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 22.5px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
    padding-left: 20px;
  }
  .family-type-box__list > dd::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
  }
  .family-type-box__list.merit > dd::before {
    background-color: #3D97D5;
  }
  .family-type-box__list.demerit > dd::before {
    background-color: #A93434;
  }
}
@media screen and (min-width:768px) {
  .family-type {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .family-type__header {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
    margin: 0 auto;
  }
  .family-type__header > span {
    font-size: 88px;
  }
  .family-type__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .family-type-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
  }
  .family-type-box:nth-child(even) {
    flex-direction: row-reverse;
  }
  .family-type-box + .family-type-box {
    margin-top: 100px;
  }
  .family-type-box__figure {
    display: block;
    width: 50%;
  }
  .family-type-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .family-type-box__content {
    display: block;
    width: calc(520/1140 * 100%);
    background-repeat: no-repeat;
    background-position: right top;
    background-size: 119px auto;
    padding-top: 80px;
  }
  .family-type-box:nth-child(1) .family-type-box__content {
    background-image: url(./assets/images/family/badge1.png);
  }
  .family-type-box:nth-child(2) .family-type-box__content {
    background-image: url(./assets/images/family/badge2.png);
  }
  .family-type-box:nth-child(3) .family-type-box__content {
    background-image: url(./assets/images/family/badge3.png);
  }
  .family-type-box__title {
    display: block;
    width: 100%;
    font-size: 34px;
    font-weight: 500;
    line-height: 50px;
    margin-bottom: 30px;
  }
  .family-type-box__subtitle {
    display: block;
    width: 100%;
    font-size:22px;
    line-height: 30px;
    color: #A5A47F;
    font-weight: 500;
    padding-bottom: 5px;
    text-decoration: underline;
    text-underline-offset: 10px;
  }
  .family-type-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 15px;
  }
  .family-type-box__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .family-type-box__list  {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 15px;
  }
  .family-type-box__list > dt {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 124px;
    height: 33px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
  }
  .family-type-box__list.merit > dt {
    border: 1px solid #3D97D5;
    color: #3D97D5;
  }
  .family-type-box__list.demerit > dt {
    border: 1px solid #A93434;
    color: #A93434;
  }
  .family-type-box__list > dd {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 22.5px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
    padding-left: 20px;
  }
  .family-type-box__list > dd::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
  }
  .family-type-box__list.merit > dd::before {
    background-color: #3D97D5;
  }
  .family-type-box__list.demerit > dd::before {
    background-color: #A93434;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .family-type-box__content {
    background-size: 80px auto;
    padding-top: 60px;
  }
  .family-type-box__title {
    font-size: 30px;
    line-height: 40px;
    margin-bottom: 20px;
  }
}
/*merit*/
@media screen and (max-width:767px) {
  .family-merit {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .family-merit__body {
    display: block;
    width: 100%;
  }
  .family-merit__header {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 45px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
  }
  .family-merit__main {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .family-merit-box {
    display: block;
    width: 100%;
    background-color: #F9F8F6;
  }
  .family-merit-box + .family-merit-box {
    margin-top: 50px;
  }
  .family-merit-box__hgroup {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .family-merit-box__badge {
    display: block;
    width: 132px;
    height: 50px;
    background-color: #B9B89C;
    font-size: 30px;
    color: var(--white);
    line-height: 1;
    font-weight: 500;
    padding: 10px 0;
    text-align: center;
  }
  .family-merit-box__badge > small {
    font-size: 16px;
    font-family: var(--cormorant-garamond);
    line-height: 1;
    padding-right: 5px;
  }
  .family-merit-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    line-height: 30px;
    color: #70634D;
    padding: 20px;
    text-align: justify;
    word-break: break-all;
  }
  .family-merit-box__columns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0 20px 20px;
  }
  .family-merit-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .family-merit-box__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .family-merit-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .family-merit {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .family-merit__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .family-merit__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
  }
  .family-merit__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .family-merit-box {
    display: block;
    width: 100%;
    background-color: #F9F8F6;
  }
  .family-merit-box + .family-merit-box {
    margin-top: 80px;
  }
  .family-merit-box__hgroup {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .family-merit-box__badge {
    display: block;
    width: 156px;
    height: 100px;
    background-color: #B9B89C;
    font-size: 50px;
    color: var(--white);
    line-height: 60px;
    font-weight: 500;
    padding: 20px 0;
    text-align: center;
  }
  .family-merit-box__badge > small {
    font-size: 20px;
    font-family: var(--cormorant-garamond);
    line-height: 1;
    padding-right: 10px;
  }
  .family-merit-box__title {
    display: block;
    width: calc(100% - 156px - 30px);
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    color: #70634D;
    text-align: justify;
    word-break: break-all;
  }
  .family-merit-box__columns {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: calc(30/1040 * 100%);
  }
  .family-merit-box__txt {
    display: block;
    width: calc(590/980 * 100%);
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .family-merit-box__figure {
    display: block;
    width: calc(360/980 * 100%);
  }
  .family-merit-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*cta*/
@media screen and (max-width:767px) {
  .family-cta {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: #666666;
  }
  .family-cta__body {
    display: block;
    width: 100%;
  }
  .family-cta__main {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .family-cta__header {
    display: block;
    width: 100%;
    font-size: min(20px + (22 - 20) * ((100vw - 320px) / (375 - 320)), 22px);
    font-weight: 500;
    line-height: 40px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
    letter-spacing: 0;
  }
  .family-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .family-cta__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 30px;
  }
  .family-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .family-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .family-cta__figure {
    display: block;
    width: 100%;
  }
  .family-cta__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .family-cta {
    position: relative;
    display: block;
    width: 100%;
    padding: 85px 0;
    background-color: #666666;
  }
  .family-cta__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .family-cta__main {
    display: block;
    width: calc(455/1040 * 100%);
  }
  .family-cta__header {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 50px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .family-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .family-cta__btns {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .family-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .family-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .family-cta__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .family-cta__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .family-cta {
    padding: 60px 0;
  }
  .family-cta__header {
    font-size: 21px;
    line-height: 40px;
    margin-bottom: 20px;
  }
}
/*
PAGE - sdgs
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .sdgs-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .sdgs-intro__body {
    display: block;
    width: 100%;
  }
  .sdgs-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    background-image: url(./assets/images/sdgs/sdgs.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
  }
  .sdgs-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .sdgs-intro__header > span:nth-child(2) {
    font-size: 32px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .sdgs-intro__columns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 50px;
  }
  .sdgs-intro__col-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .sdgs-intro__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .sdgs-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .sdgs-intro__figure-caption {
    display: block;
    width: 100%;
    text-align: right;
    font-size: 14px;
    color: #888888;
    line-height: 25.5px;
    margin-top: 5px;
  }
  .sdgs-intro__figure-caption > a {
    color: #888888;
    text-decoration: underline;
  }
  .sdgs-intro__figure-caption > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
}
@media screen and (min-width:768px) {
  .sdgs-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .sdgs-intro__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .sdgs-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
    background-image: url(./assets/images/sdgs/sdgs.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .sdgs-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .sdgs-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .sdgs-intro__columns {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
  .sdgs-intro__col-txt {
    display: block;
    width: calc(480/1040 * 100%);
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .sdgs-intro__figure {
    display: block;
    width: calc(480/1040 * 100%);
  }
  .sdgs-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .sdgs-intro__figure-caption {
    display: block;
    width: 100%;
    text-align: right;
    font-size: 14px;
    color: #888888;
    line-height: 25.5px;
    margin-top: 5px;
  }
  .sdgs-intro__figure-caption > a {
    color: #888888;
    text-decoration: underline;
  }
  .sdgs-intro__figure-caption > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .sdgs-feature {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .sdgs-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .sdgs-feature__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .sdgs-feature__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    margin-top: 10px;
  }
  .sdgs-feature__main {
    display: block;
    width: 100%;
  }
  .sdgs-feature-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 50px 0;
  }
  .sdgs-feature-box:nth-child(even) {
    background-color: #F9F8F6;
  }
  .sdgs-feature-box__body {
    display: block;
    width: 100%;
  }
  .sdgs-feature-box__content {
    display: block;
    width: 100%;
  }
  .sdgs-feature-box:nth-child(even) .sdgs-feature-box__content {
    margin-left: auto;
  }
  .sdgs-feature-box__badge {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    line-height: 34px;
    letter-spacing: 0.05em;
  }
  .sdgs-feature-box__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .sdgs-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .sdgs-feature-box__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .sdgs-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .sdgs-feature__figure {
    display: block;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin-top: 30px;
  }
  .sdgs-feature__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .sdgs-feature {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .sdgs-feature__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .sdgs-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .sdgs-feature__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .sdgs-feature__main {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 100px auto 0;
  }
  .sdgs-feature-box {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: min(690px + (768 - 690) * ((100vw - 1025px) / (1366 - 1025)), 768px);
  }
  .sdgs-feature-box + .sdgs-feature-box {
    margin-top: 100px;
  }
  .sdgs-feature-box:nth-child(even) {
    background-color: #F9F8F6;
  }
  .sdgs-feature-box__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .sdgs-feature-box__content {
    display: block;
    width: calc(470/1040 * 100%);
    padding: 80px 0;
  }
  .sdgs-feature-box:nth-child(even) .sdgs-feature-box__content {
    margin-left: auto;
  }
  .sdgs-feature-box__badge {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.05em;
  }
  .sdgs-feature-box__title {
    display: block;
    width: 100%;
    font-size: 48px;
    font-weight: 500;
    line-height: 60px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .sdgs-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .sdgs-feature-box__figure {
    display: block;
    width: calc(350/470 * 100%);
    margin-top: 50px;
  }
  .sdgs-feature-box:nth-child(3) .sdgs-feature-box__figure {
    width: 100%;
  }
  .sdgs-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .sdgs-feature__figure {
    position: absolute;
    top: 0;
    display: block;
    width: calc(633/1366 * 100%);
    height: 100%;
  }
  .sdgs-feature-box:nth-child(odd) .sdgs-feature__figure {
    right: 0;
  }
  .sdgs-feature-box:nth-child(even) .sdgs-feature__figure {
    left: 0;
  }
  .sdgs-feature__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .sdgs-feature-box__title {
    font-size: 40px;
  }
}
/*partner*/
@media screen and (max-width:767px) {
  .sdgs-partner {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .sdgs-partner__body {
    display: block;
    width: 100%;
  }
  .sdgs-partner__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .sdgs-partner__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .sdgs-partner__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .sdgs-partner-box {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .sdgs-partner-box__title {
    display: block;
    width: 100%;
    font-size: min(18px + (20 - 18) * ((100vw - 320px) / (375 - 320)), 20px);
    font-weight: 500;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
    padding-left: 10px;
    border-left: 3px solid #333333;
    margin-bottom: 30px;
  }
  .sdgs-partner-box__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .sdgs-partner-box__content1 {
    display: block;
    width: 100%;
  }
  .sdgs-partner-box__content2 {
    display: block;
    width: 100%;
  }
  .sdgs-partner-box > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .sdgs-partner-box__figure1 {
    display: block;
    max-width: 255px;
    width: 100%;
    margin-top: 30px;
  }
  .sdgs-partner-box__figure2 {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .sdgs-partner-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .sdgs-partner-box__caption {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    color: #888888;
    letter-spacing: 0.07em;
    text-align: right;
    margin-top: 10px;
  }
  .sdgs-partner-box__caption > a {
    color: #888888;
    text-decoration: underline;
  }
  .sdgs-partner-box__caption > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .sdgs-partner-block {
    display: block;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
    margin-top: 50px;
  }
  .sdgs-partner-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .sdgs-partner-block__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .sdgs-partner-block__content {
    display: block;
    width: 100%;
  }
  .sdgs-partner-block__title {
    display: block;
    width: 100%;
    font-size: min(16px + (18 - 16) * ((100vw - 320px) / (375 - 320)), 18px);
    color: #A5A47F;
    font-weight: 500;
    line-height: 22px;
    padding-bottom: 4px;
    text-decoration: underline;
    text-underline-offset: 10px;
    margin-bottom: 20px;
  }
  .sdgs-partner-block__title + p {
    font-size: 14px;
    line-height: 24px;
  }
  .sdgs-partner-block__figure {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .sdgs-partner-block__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .sdgs-partner-block__cols + p {
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .sdgs-partner {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .sdgs-partner__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .sdgs-partner__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .sdgs-partner__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .sdgs-partner__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .sdgs-partner-box {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .sdgs-partner-box__title {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 40px;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .sdgs-partner-box__cols {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .sdgs-partner-box + .sdgs-partner-box .sdgs-partner-box__cols {
    flex-direction: row-reverse;
  }
  .sdgs-partner-box__content1 {
    display: block;
    width: calc(740/1040 * 100%);
  }
  .sdgs-partner-box__content2 {
    display: block;
    width: calc(590/1040 * 100%);
  }
  .sdgs-partner-box > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .sdgs-partner-box__figure1 {
    display: block;
    width: calc(250/1040 * 100%);
  }
  .sdgs-partner-box__figure2 {
    display: block;
    width: calc(400/1040 * 100%);
  }
  .sdgs-partner-box__txt {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .sdgs-partner-box__caption {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    color: #888888;
    letter-spacing: 0.07em;
    text-align: right;
    margin-top: 10px;
  }
  .sdgs-partner-box__caption > a {
    color: #888888;
    text-decoration: underline;
  }
  .sdgs-partner-box__caption > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .sdgs-partner-block {
    display: block;
    max-width: 900px;
    width: 100%;
    padding: calc(50/1040 * 100%);
    background-color: var(--white);
    margin: 100px auto 0;
  }
  .sdgs-partner-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
  }
  .sdgs-partner-block__txt.center {
    text-align: center;
  }
  .sdgs-partner-block__cols {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-top: 50px;
  }
  .sdgs-partner-block__content {
    display: block;
    width: calc(480/800 * 100%);
  }
  .sdgs-partner-block__title {
    display: block;
    width: 100%;
    font-size: 22px;
    color: #A5A47F;
    font-weight: 500;
    line-height: 22px;
    padding-bottom: 4px;
    text-decoration: underline;
    text-underline-offset: 10px;
    margin-bottom: 20px;
  }
  .sdgs-partner-block__title + p {
    font-size: 14px;
    line-height: 24px;
  }
  .sdgs-partner-block__figure {
    display: block;
    width: calc(275/800 * 100%);
  }
  .sdgs-partner-block__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .sdgs-partner-block__cols + p {
    margin-top: 50px;
  }
}
/*
PAGE - concept
--------------------------------------------- */
@media screen and (max-width:767px) {
  .concept {
    display: block;
    width: 100%;
    padding: 0 0 810px;
  }
  .concept-parallax {
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100vh;
    background-image: url(./assets/images/concept/bg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .concept__body {
    display: block;
    width: 100%;
    background-color: var(--white);
    padding-top: 50px;
  }
  .concept-hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/concept/concept.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: min(375px,100%) auto;
  }
  .concept__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
    margin: 0 auto;
  }
  .concept__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .concept__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .concept-main {
    display: block;
    width: 100%;
  }
  .concept-box {
    display: block;
    width: 100%;
  }
  .concept-box__figure {
    display: block;
    width: 100%;
  }
  .concept-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .concept-box__content {
    display: block;
    width: 100%;
    margin: 0 auto;
    padding: 30px 0 80px;
  }
  .concept-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0;
    margin-bottom: 30px;
  }
  .concept-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.03em;
    text-align: justify;
    word-break: break-all;
  }
  .concept-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0 0 100px;
  }
  .concept-block__figure {
    display: block;
    max-width: 300px;
    width: 100%;
  }
  .concept-block__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .concept-block__col {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .concept-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.03em;
    text-align: justify;
    word-break: break-all;
  }
  .concept-block__col-figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .concept-block__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .concept {
    display: block;
    width: 100%;
    padding: 0 0 580px;
  }
  .concept-parallax {
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100vh;
    background-image: url(./assets/images/concept/bg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .concept__body {
    display: block;
    width: 100%;
    background-color: var(--white);
    padding-top: 85px;
  }
  .concept-hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/concept/concept.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 100%;
  }
  .concept__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    padding-bottom: 50px;
    margin: 0 auto;
  }
  .concept__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .concept__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .concept-main {
    display: block;
    width: 100%;
  }
  .concept-box {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
  }
  .concept-box__figure {
    display: block;
    width: calc(1253/1366 * 100%);
  }
  .concept-box:nth-child(odd) .concept-box__figure {
    margin-left: auto;
  }
  .concept-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .concept-box__content {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    padding: 150px 0;
  }
  .concept-box__title {
    display: block;
    width: 100%;
    font-size: 40px;
    font-weight: 500;
    line-height: 60px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
  }
  .concept-box__txt {
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 2;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .concept-block {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: 50px 0 150px;
  }
  .concept-block__figure {
    display: block;
    width: calc(520/1140 * 100%);
  }
  .concept-block__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .concept-block__col {
    display: block;
    width: calc(570/1140 * 100%);
  }
  .concept-block__txt {
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 2;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .concept-block__col-figure {
    display: block;
    width: calc(500/570 * 100%);
    margin: 150px 0 0 auto;
  }
  .concept-block__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .concept-box__title {
    font-size: 34px;
  }
}
/*
PAGE - comfort
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .comfort-intro {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .comfort-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/comfort/lineup.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: min(335px,100%) auto;
    padding-bottom: 50px;
  }
  .comfort-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .comfort-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .comfort-intro__header > span:nth-child(2) {
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .comfort-intro__header > span:nth-child(2) > small {
    font-size: 20px;
    padding-left: 10px;
  }
  .comfort-intro__slide {
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .comfort-intro__slide .swiper-wrapper {
    width: 100%;
  }
  .comfort-intro__slide .swiper-slide{
    width: 100%;
  }
  .comfort-intro__slide-figure {
    display: block;
    width: 100%;
  }
  .comfort-intro__slide-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .comfort-intro__slide .swiper-button-prev {
    width: 35px;
    height: 35px;
    left: 10px;
    background-image: url(./assets/images/comfort/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 2px);
  }
 .comfort-intro__slide .swiper-button-next {
    width: 35px;
    height: 35px;
    right: 10px;
    background-image: url(./assets/images/comfort/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 2px);
  }
  .comfort-intro__slide .swiper-button-next::after, .comfort-intro__slide .swiper-button-prev::after {
    font-size: 0;
  }
  .comfort-intro__main {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 50px;
  }
  .comfort-intro__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .comfort-intro__title > span:nth-child(1) {
    font-size: 40px;
    font-family: var(--cormorant-garamond);
    font-weight: 500;
    line-height: 48px;
    letter-spacing: 0.05em;
  }
  .comfort-intro__title > span:nth-child(2) {
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
  }
  .comfort-intro__content {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .comfort-intro__subtitle {
    display: block;
    width: 100%;
    font-size: min(20px + (24 - 20) * ((100vw - 320px) / (375 - 320)), 24px);
    font-weight: 500;
    line-height: 38px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
  }
  .comfort-intro_txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
}
@media screen and (min-width:768px) {
  .comfort-intro {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .comfort-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/comfort/lineup.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: calc(985/1140 * 100%) auto;
    padding-bottom: 65px;
  }
  .comfort-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .comfort-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .comfort-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .comfort-intro__header > span:nth-child(2) > small {
    font-size: 34px;
  }
  .comfort-intro__slide {
    width: 100%;
  }
  .comfort-intro__slide .swiper-wrapper {
    width: 100%;
  }
  .comfort-intro__slide .swiper-slide{
    width: 100%;
  }
  .comfort-intro__slide-figure {
    display: block;
    width: 100%;
  }
  .comfort-intro__slide-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .comfort-intro__slide .swiper-button-prev {
    width: 35px;
    height: 35px;
    left: 30px;
    background-image: url(./assets/images/comfort/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
 .comfort-intro__slide .swiper-button-next {
    width: 35px;
    height: 35px;
    right: 30px;
    background-image: url(./assets/images/comfort/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
  .comfort-intro__slide .swiper-button-next::after, .comfort-intro__slide .swiper-button-prev::after {
    font-size: 0;
  }
  .comfort-intro__main {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-top: 115px;
  }
  .comfort-intro__title {
    display: flex;
    flex-direction: column;
    width: calc(500/1140 * 100%);
  }
  .comfort-intro__title > span:nth-child(1) {
    font-size: 80px;
    font-family: var(--cormorant-garamond);
    font-weight: 500;
    line-height: 90px;
    letter-spacing: 0.05em;
  }
  .comfort-intro__title > span:nth-child(2) {
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0.2em;
  }
  .comfort-intro__content {
    display: block;
    width: calc(580/1140 * 100%);
  }
  .comfort-intro__subtitle {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 60px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-top: 20px;
  }
  .comfort-intro_txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .comfort-intro__subtitle {
    font-size: 28px;
    line-height: 50px;
    letter-spacing: 0;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .comfort-feature {
    display: block;
    width: 100%;
    background-color: var(--white);
    padding-bottom: 50px;
  }
  .comfort-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0 auto;
    padding: 100px 0 50px;
  }
  .comfort-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .comfort-feature__header > span:nth-child(2) {
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 10px;
  }
  .comfort-feature__header > span:nth-child(2) > em {
    font-size: 68px;
  }
  .comfort-feature__main {
    display: block;
    width: 100%;
  }
  .comfort-feature-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .comfort-feature-box:nth-child(odd) {
    background-color: #F5F5F5;
  }
  .comfort-feature-box__content {
    display: block;
    width: 100%;
    padding: 50px 0;
  }
  .comfort-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .comfort-feature-box__title > span:nth-child(1) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .comfort-feature-box__title > span:nth-child(2) {
    font-size: 32px;
    line-height: 46px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .comfort-feature-box__title > span:nth-child(3) {
    font-size: min(14px + (16 - 14) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .comfort-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .comfort-feature-box__btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #DBDBDB;
  }
  .comfort-feature-box__btns-txt {
    display: block;
    width: min(280px,100%);
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
  }
  .comfort-feature-box__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: min(280px, 100%);
    height: 56px;
    border: 1px solid var(--font-color);
    font-size: 18px;
    font-weight: 500;
    color: var(--font-color);
    line-height: 1;
  }
  .comfort-feature-box__btn:nth-child(n+2) {
    margin-top: 30px;
  }
  .comfort-feature-box__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .comfort-feature-box__figure {
    display: block;
    width: 100%;
  }
  .comfort-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .comfort-feature {
    display: block;
    width: 100%;
    background-color: var(--white);
    padding-bottom: 100px;
  }
  .comfort-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 100px 0;
  }
  .comfort-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .comfort-feature__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .comfort-feature__header > span:nth-child(2) > em {
    font-size: 88px;
  }
  .comfort-feature__main {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
  }
  .comfort-feature-box {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: min(576.267px + (768 - 576.267) * ((100vw - 1025px) / (1140 - 1025)), 768px);
  }
  .comfort-feature-box:nth-child(odd) {
    background-color: #F5F5F5;
  }
  .comfort-feature-box__content {
    display: block;
    width: calc(470/1140 * 100%);
    padding: 80px 0;
  }
  .comfort-feature-box:nth-child(even) .comfort-feature-box__content {
    margin-left: auto;
  }
  .comfort-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .comfort-feature-box__title > span:nth-child(1) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .comfort-feature-box__title > span:nth-child(2) {
    font-size: min(50px + (58 - 50) * ((100vw - 1025px) / (1140 - 1025)), 58px);
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .comfort-feature-box__title > span:nth-child(3) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .comfort-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .comfort-feature-box__btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    margin-top: 50px;
    padding-top: 50px;
    border-top: 1px solid #DBDBDB;
  }
  .comfort-feature-box__btns-txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
  }
  .comfort-feature-box__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(50% - 15px);
    height: 56px;
    border: 1px solid var(--font-color);
    font-size: 18px;
    font-weight: 500;
    color: var(--font-color);
    line-height: 1;
  }
  .comfort-feature-box__btn:nth-child(n+4) {
    margin-top: 20px;
  }
  .comfort-feature-box__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .comfort-feature-box__figure {
    position: absolute;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .comfort-feature-box:nth-child(odd) .comfort-feature-box__figure {
    right: 0;
  }
  .comfort-feature-box:nth-child(even) .comfort-feature-box__figure {
    left: 0;
  }
  .comfort-feature-box__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .comfort-feature-box__title > span:nth-child(2) {
    font-size: 38px;
    line-height: 50px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .comfort-feature-box__title > span:nth-child(3) {
    font-size: 14px;
    line-height: 20px;
  }
  .comfort-feature-box__btn {
    width: calc(50% - 8px);
    height: 50px;
    font-size: 15px;
  }
}
/*banner*/
@media screen and (max-width:767px) {
  .comfort-banner {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .comfort-link {
    display: flex;
   flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .comfort-link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .comfort-link__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    color: var(--font-color);
    padding-bottom: 30px;
  }
  .comfort-link__title > span:nth-child(1) {
    font-size: 56px;
    font-family: var(--cormorant-garamond);
    font-weight: 500;
    line-height: 68px;
    letter-spacing: 0.05em;
  }
  .comfort-link__title > span:nth-child(2) {
    font-size: 15px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
  }
  .comfort-link__figure {
    display: block;
    width: 100%;
  }
  .comfort-link__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .comfort-banner {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .comfort-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .comfort-link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .comfort-link__title {
    display: flex;
    flex-direction: column;
    width: calc(400/1140 * 100%);
    color: var(--font-color);
  }
  .comfort-link__title > span:nth-child(1) {
    font-size: 76px;
    font-family: var(--cormorant-garamond);
    font-weight: 500;
    line-height: 90px;
    letter-spacing: 0.05em;
  }
  .comfort-link__title > span:nth-child(2) {
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
  }
  .comfort-link__figure {
    display: block;
    width: calc(740/1140 * 100%);
  }
  .comfort-link__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .comfort-link__title > span:nth-child(1) {
    font-size: 50px;
    line-height: 70px;
  }
  .comfort-link__title > span:nth-child(2) {
    font-size: 16px;
    line-height: 20px;
  }
}
/*
PAGE - dellacasa
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .dellacasa-intro {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .dellacasa-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/dellacasa/lineup.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: min(335px,100%) auto;
    padding-bottom: 50px;
  }
  .dellacasa-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .dellacasa-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .dellacasa-intro__header > span:nth-child(2) {
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .dellacasa-intro__header > span:nth-child(2) > small {
    font-size: 20px;
    padding-left: 10px;
  }
  .dellacasa-intro__slide {
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .dellacasa-intro__slide .swiper-wrapper {
    width: 100%;
  }
  .dellacasa-intro__slide .swiper-slide{
    width: 100%;
  }
  .dellacasa-intro__slide-figure {
    display: block;
    width: 100%;
  }
  .dellacasa-intro__slide-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .dellacasa-intro__slide .swiper-button-prev {
    width: 35px;
    height: 35px;
    left: 10px;
    background-image: url(./assets/images/dellacasa/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 2px);
  }
 .dellacasa-intro__slide .swiper-button-next {
    width: 35px;
    height: 35px;
    right: 10px;
    background-image: url(./assets/images/dellacasa/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 2px);
  }
  .dellacasa-intro__slide .swiper-button-next::after, .dellacasa-intro__slide .swiper-button-prev::after {
    font-size: 0;
  }
  .dellacasa-intro__main {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 50px;
  }
  .dellacasa-intro__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .dellacasa-intro__title > span:nth-child(1) {
    font-size: 40px;
    font-family: var(--cormorant-garamond);
    font-weight: 500;
    line-height: 48px;
    letter-spacing: 0.05em;
  }
  .dellacasa-intro__title > span:nth-child(2) {
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
  }
  .dellacasa-intro__content {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .dellacasa-intro__subtitle {
    display: block;
    width: 100%;
    font-size: min(20px + (24 - 20) * ((100vw - 320px) / (375 - 320)), 24px);
    font-weight: 500;
    line-height: 38px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
  }
  .dellacasa-intro_txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
}
@media screen and (min-width:768px) {
  .dellacasa-intro {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .dellacasa-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/dellacasa/lineup.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: calc(985/1140 * 100%) auto;
    padding-bottom: 65px;
  }
  .dellacasa-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .dellacasa-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .dellacasa-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .dellacasa-intro__header > span:nth-child(2) > small {
    font-size: 34px;
  }
  .dellacasa-intro__slide {
    width: 100%;
  }
  .dellacasa-intro__slide .swiper-wrapper {
    width: 100%;
  }
  .dellacasa-intro__slide .swiper-slide{
    width: 100%;
  }
  .dellacasa-intro__slide-figure {
    display: block;
    width: 100%;
  }
  .dellacasa-intro__slide-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .dellacasa-intro__slide .swiper-button-prev {
    width: 35px;
    height: 35px;
    left: 30px;
    background-image: url(./assets/images/dellacasa/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
 .dellacasa-intro__slide .swiper-button-next {
    width: 35px;
    height: 35px;
    right: 30px;
    background-image: url(./assets/images/dellacasa/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
  .dellacasa-intro__slide .swiper-button-next::after, .dellacasa-intro__slide .swiper-button-prev::after {
    font-size: 0;
  }
  .dellacasa-intro__main {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-top: 115px;
  }
  .dellacasa-intro__title {
    display: flex;
    flex-direction: column;
    width: calc(500/1140 * 100%);
  }
  .dellacasa-intro__title > span:nth-child(1) {
    font-size: 80px;
    font-family: var(--cormorant-garamond);
    font-weight: 500;
    line-height: 90px;
    letter-spacing: 0.05em;
  }
  .dellacasa-intro__title > span:nth-child(2) {
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0.2em;
  }
  .dellacasa-intro__content {
    display: block;
    width: calc(580/1140 * 100%);
  }
  .dellacasa-intro__subtitle {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 60px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-top: 20px;
  }
  .dellacasa-intro_txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .dellacasa-intro__subtitle {
    font-size: 28px;
    line-height: 50px;
    letter-spacing: 0;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .dellacasa-feature {
    display: block;
    width: 100%;
    background-color: var(--white);
    padding-bottom: 50px;
  }
  .dellacasa-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0 auto;
    padding: 100px 0 50px;
  }
  .dellacasa-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .dellacasa-feature__header > span:nth-child(2) {
    font-size: min(24px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 10px;
  }
  .dellacasa-feature__header > span:nth-child(2) > em {
    font-size: 68px;
  }
  .dellacasa-feature__main {
    display: block;
    width: 100%;
  }
  .dellacasa-feature-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .dellacasa-feature-box:nth-child(odd) {
    background-color: #F5F5F5;
  }
  .dellacasa-feature-box__content {
    display: block;
    width: 100%;
    padding: 50px 0;
  }
  .dellacasa-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .dellacasa-feature-box__title > span:nth-child(1) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .dellacasa-feature-box__title > span:nth-child(2) {
    font-size: 32px;
    line-height: 46px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .dellacasa-feature-box__title > span:nth-child(3) {
    font-size: min(14px + (16 - 14) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .dellacasa-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .dellacasa-feature-box__btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #DBDBDB;
  }
  .dellacasa-feature-box__btns-txt {
    display: block;
    width: min(280px,100%);
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
  }
  .dellacasa-feature-box__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: min(280px, 100%);
    height: 56px;
    border: 1px solid var(--font-color);
    font-size: 18px;
    font-weight: 500;
    color: var(--font-color);
    line-height: 1;
  }
  .dellacasa-feature-box__btn:nth-child(n+2) {
    margin-top: 30px;
  }
  .dellacasa-feature-box__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .dellacasa-feature-box__figure {
    display: block;
    width: 100%;
  }
  .dellacasa-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .dellacasa-feature {
    display: block;
    width: 100%;
    background-color: var(--white);
    padding-bottom: 100px;
  }
  .dellacasa-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 100px 0;
  }
  .dellacasa-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .dellacasa-feature__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .dellacasa-feature__header > span:nth-child(2) > em {
    font-size: 88px;
  }
  .dellacasa-feature__main {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
  }
  .dellacasa-feature-box {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: min(576.267px + (768 - 576.267) * ((100vw - 1025px) / (1140 - 1025)), 768px);
  }
  .dellacasa-feature-box:nth-child(odd) {
    background-color: #F5F5F5;
  }
  .dellacasa-feature-box__content {
    display: block;
    width: calc(470/1140 * 100%);
    padding: 80px 0;
  }
  .dellacasa-feature-box:nth-child(even) .dellacasa-feature-box__content {
    margin-left: auto;
  }
  .dellacasa-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .dellacasa-feature-box__title > span:nth-child(1) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .dellacasa-feature-box__title > span:nth-child(2) {
    font-size: min(50px + (58 - 50) * ((100vw - 1025px) / (1140 - 1025)), 58px);
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .dellacasa-feature-box__title > span:nth-child(3) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .dellacasa-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .dellacasa-feature-box__btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    margin-top: 50px;
    padding-top: 50px;
    border-top: 1px solid #DBDBDB;
  }
  .dellacasa-feature-box__btns-txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-bottom: 10px;
  }
  .dellacasa-feature-box__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(50% - 15px);
    height: 56px;
    border: 1px solid var(--font-color);
    font-size: 18px;
    font-weight: 500;
    color: var(--font-color);
    line-height: 1;
  }
  .dellacasa-feature-box__btn:nth-child(n+4) {
    margin-top: 20px;
  }
  .dellacasa-feature-box__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .dellacasa-feature-box__figure {
    position: absolute;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .dellacasa-feature-box:nth-child(odd) .dellacasa-feature-box__figure {
    right: 0;
  }
  .dellacasa-feature-box:nth-child(even) .dellacasa-feature-box__figure {
    left: 0;
  }
  .dellacasa-feature-box__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .dellacasa-feature-box__title > span:nth-child(2) {
    font-size: 38px;
    line-height: 50px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .dellacasa-feature-box__title > span:nth-child(3) {
    font-size: 14px;
    line-height: 20px;
  }
  .dellacasa-feature-box__btn {
    width: calc(50% - 8px);
    height: 50px;
    font-size: 15px;
  }
}
/*banner*/
@media screen and (max-width:767px) {
  .dellacasa-banner {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .dellacasa-link {
    display: flex;
   flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .dellacasa-link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .dellacasa-link__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    color: var(--font-color);
    padding-bottom: 30px;
  }
  .dellacasa-link__title > span:nth-child(1) {
    font-size: 56px;
    font-family: var(--cormorant-garamond);
    font-weight: 500;
    line-height: 68px;
    letter-spacing: 0.05em;
  }
  .dellacasa-link__title > span:nth-child(2) {
    font-size: 15px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
  }
  .dellacasa-link__figure {
    display: block;
    width: 100%;
  }
  .dellacasa-link__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .dellacasa-banner {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .dellacasa-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .dellacasa-link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .dellacasa-link__title {
    display: flex;
    flex-direction: column;
    width: calc(400/1140 * 100%);
    color: var(--font-color);
  }
  .dellacasa-link__title > span:nth-child(1) {
    font-size: 76px;
    font-family: var(--cormorant-garamond);
    font-weight: 500;
    line-height: 90px;
    letter-spacing: 0.05em;
  }
  .dellacasa-link__title > span:nth-child(2) {
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
  }
  .dellacasa-link__figure {
    display: block;
    width: calc(740/1140 * 100%);
  }
  .dellacasa-link__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .dellacasa-link__title > span:nth-child(1) {
    font-size: 50px;
    line-height: 70px;
  }
  .dellacasa-link__title > span:nth-child(2) {
    font-size: 16px;
    line-height: 20px;
  }
}
/*
PAGE - hotel-like
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .hotel-like-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .hotel-like-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 20px;
    background-image: url(./assets/images/hotel-like/hotel-like.png);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: auto 53px;
  }
  .hotel-like-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .hotel-like-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hotel-like-intro__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .hotel-like-intro__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .hotel-like-intro__content-wrap {
    display: block;
    width: 100%;
  }
  .hotel-like-intro__content {
    display: block;
    width: 100%;
  }
  .hotel-like-intro__title {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 45px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .hotel-like-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .hotel-like-intro__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .hotel-like-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .hotel-like-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .hotel-like-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 65px;
    background-image: url(./assets/images/hotel-like/hotel-like.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .hotel-like-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .hotel-like-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hotel-like-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .hotel-like-intro__main {
    position: relative;
    display: block;
    width: 100%;
  }
  .hotel-like-intro__content-wrap {
    position: absolute;
    bottom: 50px;
    left: 0;
    display: block;
    width: 100%;
  }
  .hotel-like-intro__content {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .hotel-like-intro__title {
    display: block;
    width: 100%;
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .hotel-like-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }

  .hotel-like-intro__figure {
    display: block;
    width: 100%;
  }
  .hotel-like-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .hotel-like-feature {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .hotel-like-feature__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 30px;
  }
  .hotel-like-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .hotel-like-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hotel-like-feature__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hotel-like-feature__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .hotel-like-feature__main {
    display: block;
    width: 100%;
  }
  .hotel-like-feature-box {
    display: block;
    width: 100%;
  }
  .hotel-like-feature-box__main {
    display: block;
    width: 100%;
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 100px 0 225px;
  }
  .hotel-like-feature-box:nth-child(1) .hotel-like-feature-box__main {
    background-image: url(./assets/images/hotel-like/beauty/hotel-like-sp.jpg);
  }
  .hotel-like-feature-box:nth-child(2) .hotel-like-feature-box__main {
    background-image: url(./assets/images/hotel-like/space/hotel-like.jpg);
  }
  .hotel-like-feature-box:nth-child(3) .hotel-like-feature-box__main {
    background-image: url(./assets/images/hotel-like/light/hotel-like.jpg);
  }
  .hotel-like-feature-box:nth-child(4) .hotel-like-feature-box__main {
    background-image: url(./assets/images/hotel-like/storage/hotel-like.jpg);
  }
  .hotel-like-feature-box__content {
    display: block;
    max-width: 335px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 100px;
    color: var(--white);
  }
  .hotel-like-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .hotel-like-feature-box__title > span:nth-child(1) {
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hotel-like-feature-box__title > span:nth-child(2) {
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .hotel-like-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 40px;
  }
  /*slide*/
  .hotel-like-feature-gallery {
    position: relative;
    z-index: 1;
    display: block;
    max-width: 375px;
    width: 100%;
    margin: -225px auto 0;
    padding:0 10px 50px;
  }
  .hotel-like-feature-gallery__silde {
    display: block;
    width: 100%;
    padding:0 10px 50px;
  }
  .hotel-like-feature-gallery__silde .swiper-wrapper {
    width: 100%;
  }
  .hotel-like-feature-gallery__silde .swiper-slide {
    width: 100%;
  }
  .hotel-like-feature-gallery__content {
    display: block;
    width: 100%;
  }
  .hotel-like-feature-gallery__content > picture {
    display: block;
    width: 100%;
  }
  .hotel-like-feature-gallery__content > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .hotel-like-feature-gallery__caption {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-top: 20px;
  }
  /*navigation*/
  .hotel-like-feature-gallery .swiper-button-prev {
    width: 35px;
    height: 35px;
    top: 230px;
    left: 0;
    background-image: url(./assets/images/comfort/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);*/
  }
 .hotel-like-feature-gallery .swiper-button-next {
    width: 35px;
    height: 35px;
    top: 230px;
    right: 0;
    background-image: url(./assets/images/comfort/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);*/
  }
  .hotel-like-feature-gallery .swiper-button-next::after, .hotel-like-feature-gallery .swiper-button-prev::after {
    font-size: 0;
  }
  /*swiper-pagination*/
  .hotel-like-feature-gallery .swiper-pagination {
    bottom: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .hotel-like-feature-gallery .swiper-pagination-bullet {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    border: 1px solid #D3D3D3;
    background-color: transparent;
    opacity: 1;
    margin: 0 10px !important;
  }
  .hotel-like-feature-gallery .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #D3D3D3;
  }
}
@media screen and (min-width:768px) {
  .hotel-like-feature {
    display: block;
    width: 100%;
    padding: 100px 0 0;
    background-color: var(--white);
  }
  .hotel-like-feature__hgroup {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 50px;
  }
  .hotel-like-feature__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .hotel-like-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hotel-like-feature__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hotel-like-feature__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .hotel-like-feature__main {
    display: block;
    width: 100%;
  }
  .hotel-like-feature-box {
    display: block;
    width: 100%;
  }
  .hotel-like-feature-box__main {
    display: block;
    width: 100%;
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 100px 0 300px;
  }
  .hotel-like-feature-box:nth-child(1) .hotel-like-feature-box__main {
    background-image: url(./assets/images/hotel-like/beauty/hotel-like-pc.jpg);
  }
  .hotel-like-feature-box:nth-child(2) .hotel-like-feature-box__main {
    background-image: url(./assets/images/hotel-like/space/hotel-like.jpg);
  }
  .hotel-like-feature-box:nth-child(3) .hotel-like-feature-box__main {
    background-image: url(./assets/images/hotel-like/light/hotel-like.jpg);
  }
  .hotel-like-feature-box:nth-child(4) .hotel-like-feature-box__main {
    background-image: url(./assets/images/hotel-like/storage/hotel-like.jpg);
  }
  .hotel-like-feature-box__content {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 100px;
    color: var(--white);
  }
  .hotel-like-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .hotel-like-feature-box__title > span:nth-child(1) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hotel-like-feature-box__title > span:nth-child(2) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .hotel-like-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 40px;
  }
  /*slide*/
  .hotel-like-feature-gallery {
    position: relative;
    z-index: 1;
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: -300px auto 0;
    padding-bottom: 100px;
  }
  .hotel-like-feature-gallery__silde {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .hotel-like-feature-gallery__silde .swiper-wrapper {
    width: 100%;
  }
  .hotel-like-feature-gallery__silde .swiper-slide {
    width: 450px;
  }
  .hotel-like-feature-gallery__content {
    display: block;
    width: 100%;
  }
  .hotel-like-feature-gallery__content > picture {
    display: block;
    width: 100%;
  }
  .hotel-like-feature-gallery__content > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .hotel-like-feature-gallery__caption {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-top: 20px;
  }
  /*navigation*/
  .hotel-like-feature-gallery .swiper-button-prev {
    width: 35px;
    height: 35px;
    left: 30px;
    background-image: url(./assets/images/comfort/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 50px);
  }
 .hotel-like-feature-gallery .swiper-button-next {
    width: 35px;
    height: 35px;
    right: 30px;
    background-image: url(./assets/images/comfort/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 50px);
  }
  .hotel-like-feature-gallery .swiper-button-next::after, .hotel-like-feature-gallery .swiper-button-prev::after {
    font-size: 0;
  }
  /*swiper-pagination*/
  .hotel-like-feature-gallery .swiper-pagination {
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .hotel-like-feature-gallery .swiper-pagination-bullet {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    border: 1px solid #D3D3D3;
    background-color: transparent;
    opacity: 1;
    margin: 0 10px !important;
  }
  .hotel-like-feature-gallery .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #D3D3D3;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .hotel-like-feature-gallery__silde .swiper-slide {
    width: 350px;
  }
}
/*summary*/
@media screen and (max-width:767px) {
  .hotel-like-summary {
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
  }
  .hotel-like-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 50px 20px;
    background-color: #333333;
  }
  .hotel-like-summary__header {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: min(19px + (20 - 19) * ((100vw - 320px) / (375 - 320)), 20px);
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: justify;
    word-break: break-all;
  }
  .hotel-like-summary__txt {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .hotel-like-summary-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 300px;
    width: 100%;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    margin-top: 30px;
  }
  .hotel-like-summary-btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .hotel-like-summary > picture {
    display: flex;
    width: 50%;
  }
  .hotel-like-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .hotel-like-summary {
    position: relative;
    display: block;
    width: 100%;
  }
  .hotel-like-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 400px;
    padding: 40px 20px;
    background-color: #333333;
    margin: 0 auto;
  }
  .hotel-like-summary__header {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .hotel-like-summary__txt {
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .hotel-like-summary-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 300px;
    width: 100%;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    margin-top: 30px;
  }
  .hotel-like-summary-btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .hotel-like-summary > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 400px)/2);
    height: 100%;
    overflow: hidden;
  }
  .hotel-like-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .hotel-like-summary__figure1 {
    left: 0;
  }
  .hotel-like-summary__figure2 {
    right: 0;
  }
}
@media screen and (min-width:1025px) {
  .hotel-like-summary {
    position: relative;
    display: block;
    width: 100%;
  }
  .hotel-like-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 555px;
    width: 100%;
    padding: 70px 50px;
    background-color: #333333;
    margin: 0 auto;
  }
  .hotel-like-summary__header {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 50px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .hotel-like-summary__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .hotel-like-summary-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 300px;
    width: 100%;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    margin-top: 30px;
  }
  .hotel-like-summary-btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .hotel-like-summary > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 555px)/2);
    height: 100%;
    overflow: hidden;
  }
  .hotel-like-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .hotel-like-summary__figure1 {
    left: 0;
  }
  .hotel-like-summary__figure2 {
    right: 0;
  }
}
/*
PAGE - garage
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .garage-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .garage-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/garage/garage.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto 53px;
  }
  .garage-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .garage-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .garage-intro__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .garage-intro__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .garage-intro__content-wrap {
    display: block;
    width: 100%;
  }
  .garage-intro__content {
    display: block;
    width: 100%;
  }
  .garage-intro__title {
    display: block;
    width: 100%;
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 45px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .garage-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .garage-intro__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .garage-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .garage-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .garage-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 65px;
    background-image: url(./assets/images/garage/garage.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .garage-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .garage-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .garage-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .garage-intro__main {
    position: relative;
    display: block;
    width: 100%;
  }
  .garage-intro__content-wrap {
    position: absolute;
    bottom: 50px;
    left: 0;
    display: block;
    width: 100%;
  }
  .garage-intro__content {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .garage-intro__title {
    display: block;
    width: 100%;
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .garage-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .garage-intro__figure {
    display: block;
    width: 100%;
  }
  .garage-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*about*/
@media screen and (max-width:767px) {
  .garage-about {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .garage-about__figure {
    display: block;
    width: 100%;
  }
  .garage-about__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .garage-about__content {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    padding: 20px;
    background-color: rgba(255,255,255,0.9);
    margin-top: -30px;
  }
  .garage-about__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .garage-about__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) {
  .garage-about {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .garage-about__figure {
    display: block;
    width: 100%;
  }
  .garage-about__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .garage-about__content {
    position: relative;
    z-index: 1;
    display: block;
    width: calc(767/1140 * 100%);
    padding: calc(50/1140 * 100%);
    background-color: rgba(255,255,255,0.9);
    margin-top: calc(-85/1140 * 100%);
  }
  .garage-about__title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 50px;
  }
  .garage-about__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .garage-about__content {
    width: calc(867/1140 * 100%);
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .garage-feature {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .garage-feature__body {
    display: block;
    width: 100%;
  }
  .garage-feature__header {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 45px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .garage-feature__main {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .garage-feature-box {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .garage-feature-box + .garage-feature-box {
    margin-top: 100px;
  }
  .garage-feature-box__figure {
    display: block;
    width: 100%;
  }
  .garage-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .garage-feature-box__content {
    display: block;
    width: 100%;
    padding-top: 20px;
  }
  .garage-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .garage-feature-box__title > span:nth-child(1) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .garage-feature-box__title > span:nth-child(2) {
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .garage-feature-box__title > span:nth-child(3) {
    font-size: min(16px + (18 - 16) * ((100vw - 320px) / (375 - 320)), 18px);
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .garage-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .garage-feature-box__content-figure {
    display: block;
    width: calc(167.5/335 * 100%);
    margin-top: 30px;
  }
  .garage-feature-box__content-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .garage-feature-box:nth-child(even) .garage-feature-box__content-figure {
    margin-left: auto;
  }
}
@media screen and (min-width:768px) {
  .garage-feature {
    display: block;
    width: 100%;
    padding: 150px 0;
    background-color: var(--white);
  }
  .garage-feature__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .garage-feature__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .garage-feature__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .garage-feature-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .garage-feature-box + .garage-feature-box {
    margin-top: 150px;
  }
  .garage-feature-box:nth-child(odd) {
    flex-direction: row-reverse;
  }
  .garage-feature-box__figure {
    display: block;
    width: calc(520/1040 * 100%);
  }
  .garage-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .garage-feature-box__content {
    display: block;
    width: calc(470/1040 * 100%);
    padding-top: calc(50/1040 * 100%);
  }
  .garage-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .garage-feature-box__title > span:nth-child(1) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .garage-feature-box__title > span:nth-child(2) {
    font-size: 42px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .garage-feature-box__title > span:nth-child(3) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .garage-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .garage-feature-box__content-figure {
    display: block;
    width: calc(250/470 * 100%);
    margin-top: 50px;
  }
  .garage-feature-box__content-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .garage-feature-box:nth-child(even) .garage-feature-box__content-figure {
    margin-left: auto;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .garage-feature-box__title > span:nth-child(2) {
    font-size: 32px;
    line-height: 50px;
  }
  .garage-feature-box__title > span:nth-child(3) {
    font-size: 16px;
    line-height: 20px;
  }
}
/*summary*/
@media screen and (max-width:767px) {
  .garage-summary {
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
  }
  .garage-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 50px 20px;
    background-color: #01444D;
  }
  .garage-summary__header {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: min(19px + (20 - 19) * ((100vw - 320px) / (375 - 320)), 20px);
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: justify;
    word-break: break-all;
  }
  .garage-summary__txt {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .garage-summary > picture {
    display: flex;
    width: 50%;
  }
  .garage-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .garage-summary {
    position: relative;
    display: block;
    width: 100%;
  }
  .garage-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 400px;
    padding: 40px 20px;
    background-color: #01444D;
    margin: 0 auto;
  }
  .garage-summary__header {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .garage-summary__txt {
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .garage-summary > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 400px)/2);
    height: 100%;
    overflow: hidden;
  }
  .garage-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .garage-summary__figure1 {
    left: 0;
  }
  .garage-summary__figure2 {
    right: 0;
  }
}
@media screen and (min-width:1025px) {
  .garage-summary {
    position: relative;
    display: block;
    width: 100%;
  }
  .garage-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 555px;
    width: 100%;
    padding: 70px 50px;
    background-color: #01444D;
    margin: 0 auto;
  }
  .garage-summary__header {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 50px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .garage-summary__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .garage-summary > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 555px)/2);
    height: 100%;
    overflow: hidden;
  }
  .garage-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .garage-summary__figure1 {
    left: 0;
  }
  .garage-summary__figure2 {
    right: 0;
  }
}
/*
PAGE - hiraya
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .hiraya-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .hiraya-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/hiraya/hiraya.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto 53px;
  }
  .hiraya-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .hiraya-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hiraya-intro__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .hiraya-intro__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .hiraya-intro__content-wrap {
    display: block;
    width: 100%;
  }
  .hiraya-intro__content {
    display: block;
    width: 100%;
  }
  .hiraya-intro__title {
    display: block;
    width: 100%;
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 45px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .hiraya-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .hiraya-intro__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .hiraya-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .hiraya-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .hiraya-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 65px;
    background-image: url(./assets/images/hiraya/hiraya.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .hiraya-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .hiraya-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hiraya-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .hiraya-intro__main {
    position: relative;
    display: block;
    width: 100%;
  }
  .hiraya-intro__content-wrap {
    position: absolute;
    bottom: 50px;
    left: 0;
    display: block;
    width: 100%;
  }
  .hiraya-intro__content {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .hiraya-intro__title {
    display: block;
    width: 100%;
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .hiraya-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .hiraya-intro__figure {
    display: block;
    width: 100%;
  }
  .hiraya-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*points*/
@media screen and (max-width:767px) {
  .hiraya-points {
    display: block;
    width: 100%;
    padding: 50px 0 100px;
    background-color: var(--white);
    background-image: linear-gradient(#F9F8F6,#F9F8F6);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% 300px;
  }
  .hiraya-points__header {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 45px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .hiraya-points__main {
    display: block;
    width: 100%;
  }
  .hiraya-point {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .hiraya-point:nth-child(odd) {
    background-color: #F9F8F6;
  }
  .hiraya-point__figure {
    display: block;
    width: 100%;
    overflow: hidden;
  }
  .hiraya-point__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .hiraya-point__content {
    display: block;
    width: 100%;
    padding: 20px 0 40px;
  }
  .hiraya-point__hgroup {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .hiraya-point__badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 65px;
  }
  .hiraya-point__badge > span:nth-child(1) {
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hiraya-point__badge > span:nth-child(2) {
    font-size: 60px;
    line-height: 60px;
    font-weight: 500;
  }
  .hiraya-point__title {
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 37px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: center;
    margin-top: 10px;
  }
  .hiraya-point__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .hiraya-points {
    display: block;
    width: 100%;
    padding: 50px 0 150px;
    background-color: var(--white);
  }
  .hiraya-points__header {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
    margin: 0 auto;
    padding-bottom: 50px;
  }
  .hiraya-points__header {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
  }
  .hiraya-points__main {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
  }
  .hiraya-point {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 430px;
  }
  .hiraya-point:nth-child(odd) {
    background-color: #F9F8F6;
  }
  .hiraya-point + .hiraya-point {
    margin-top: 3px;
  }
  .hiraya-point__figure {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .hiraya-point__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .hiraya-point__content {
    display: block;
    width: calc(520/1140 * 100%);
    margin-left: auto;
    padding: 40px 0;
  }
  .hiraya-point__hgroup {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .hiraya-point__badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 65px;
  }
  .hiraya-point__badge > span:nth-child(1) {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .hiraya-point__badge > span:nth-child(2) {
    font-size: 60px;
    line-height: 60px;
    font-weight: 500;
  }
  .hiraya-point__title {
    display: block;
    width: calc(100% - 65px - 20px);
    font-size: 34px;
    line-height: 50px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .hiraya-point__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25px;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .hiraya-point__badge > span:nth-child(2) {
    font-size: 50px;
    line-height: 50px;
  }
  .hiraya-point__title {
    font-size: 26px;
    line-height: 40px;
    letter-spacing: 0.05em;
  }
}
/*attract*/
@media screen and (max-width:767px) {
  .hiraya-attract {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: #F9F8F6;
  }
  .hiraya-attract__header {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 45px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .hiraya-attract-box {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .hiraya-attract-box__slide {
    display: block;
    width: 100%;
  }
  .hiraya-attract-box__slide .swiper-wrapper {
    width: 100%;
  }
  .hiraya-attract-box__slide .swiper-slide {
    max-width: 375px;
    width: calc(100% - 40px);
  }
  .hiraya-attract-box__figure {
    display: block;
    width: 100%;
  }
  .hiraya-attract-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  /*navigation*/
  .hiraya-attract-box__slide .swiper-button-prev {
    width: 35px;
    height: 35px;
    left: 10px;
    background-image: url(./assets/images/comfort/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
 .hiraya-attract-box__slide .swiper-button-next {
    width: 35px;
    height: 35px;
    right: 10px;
    background-image: url(./assets/images/comfort/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
  .hiraya-attract-box__slide .swiper-button-next::after, .hiraya-attract-box__slide .swiper-button-prev::after {
    font-size: 0;
  }
  /*swiper-pagination*/
  .hiraya-attract-box__slide .swiper-pagination {
    bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .hiraya-attract-box__slide .swiper-pagination-bullet {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    border: 1px solid #D3D3D3;
    background-color: transparent;
    opacity: 1;
    margin: 0 10px !important;
  }
  .hiraya-attract-box__slide .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #D3D3D3;
  }
  .hiraya-attract-box__main {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 50px 0;
  }
  .hiraya-attract-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .hiraya-attract-box__title > span:nth-child(1) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .hiraya-attract-box__title > span:nth-child(2) {
    font-size: min(35px + (39 - 35) * ((100vw - 320px) / (375 - 320)), 39px);
    line-height: 50px;
    font-weight: 500;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .hiraya-attract-box__content {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .hiraya-attract-box__content-title {
    display: block;
    width: 100%;
    font-size: min(24px + (26 - 24) * ((100vw - 320px) / (375 - 320)), 26px);
    font-weight: 500;
    line-height: 39px;
    text-align: justify;
    word-break: break-all;
    letter-spacing: 0.1em;
    margin-bottom: 30px;
  }
  .hiraya-attract-box__content-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .hiraya-attract-box__content-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 284px;
    width: 100%;
    height: 51px;
    border: 1px solid var(--font-color);
    font-size: 15px;
    font-weight: 500;
    color: var(--font-color);
    line-height: 1;
    letter-spacing: 0;
    margin: 30px auto 0;
  }
  .hiraya-attract-box__content-btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .hiraya-attract-box + .hiraya-attract-box {
    margin-top: 50px;
  }

}
@media screen and (min-width:768px) {
  .hiraya-attract {
    display: block;
    width: 100%;
    padding: 150px 0 100px;
    background-color: #F9F8F6;
  }
  .hiraya-attract__header {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin: 0 auto;
    padding-bottom: 50px;
  }
  .hiraya-attract-box {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .hiraya-attract-box__slide {
    display: block;
    width: 100%;
  }
  .hiraya-attract-box__slide .swiper-wrapper {
    width: 100%;
  }
  .hiraya-attract-box__slide .swiper-slide {
    max-width: 1140px;
    width: calc(100% - 40px);
  }
  .hiraya-attract-box__figure {
    display: block;
    width: 100%;
  }
  .hiraya-attract-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  /*navigation*/
  .hiraya-attract-box__slide .swiper-button-prev {
    width: 35px;
    height: 35px;
    left: 80px;
    background-image: url(./assets/images/comfort/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
 .hiraya-attract-box__slide .swiper-button-next {
    width: 35px;
    height: 35px;
    right: 80px;
    background-image: url(./assets/images/comfort/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
  .hiraya-attract-box__slide .swiper-button-next::after, .hiraya-attract-box__slide .swiper-button-prev::after {
    font-size: 0;
  }
  /*swiper-pagination*/
  .hiraya-attract-box__slide .swiper-pagination {
    bottom: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .hiraya-attract-box__slide .swiper-pagination-bullet {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    border: 1px solid #D3D3D3;
    background-color: transparent;
    opacity: 1;
    margin: 0 10px !important;
  }
  .hiraya-attract-box__slide .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #D3D3D3;
  }
  .hiraya-attract-box__main {
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 150px 0;
  }
  .hiraya-attract-box__title {
    display: flex;
    flex-direction: column;
    width: calc(435/1140 * 100%);
    padding: 0 calc(50/1140 * 100%);
  }
  .hiraya-attract-box__title > span:nth-child(1) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .hiraya-attract-box__title > span:nth-child(2) {
    font-size: 79px;
    line-height: 90px;
    font-weight: 500;
    letter-spacing: 0.1em;
    font-family: var(--cormorant-garamond);
  }
  .hiraya-attract-box__content {
    display: block;
    width: calc(615/1140 * 100%);
  }
  .hiraya-attract-box__content-title {
    display: block;
    width: 100%;
    font-size: 40px;
    font-weight: 500;
    line-height: 57px;
    text-align: justify;
    word-break: break-all;
    letter-spacing: 0.1em;
    margin-bottom: 30px;
  }
  .hiraya-attract-box__content-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .hiraya-attract-box__content-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 344px;
    width: 100%;
    height: 56px;
    border: 1px solid var(--font-color);
    font-size: 18px;
    font-weight: 500;
    color: var(--font-color);
    line-height: 1;
    letter-spacing: 0;
    margin: 30px 0 0 auto;
  }
  .hiraya-attract-box__content-btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .hiraya-attract-box + .hiraya-attract-box {
    margin-top: 100px;
  }
  .hiraya-attract-box + .hiraya-attract-box .hiraya-attract-box__main {
    flex-direction: row-reverse;
  }
  .hiraya-attract-box + .hiraya-attract-box .hiraya-attract-box__content-btn {
    margin: 30px 0 0 0;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .hiraya-attract-box__slide .swiper-slide {
    width: 728px;
  }
  .hiraya-attract-box__main {
    padding: 100px 0;
  }
  .hiraya-attract-box__title > span:nth-child(1) {
    font-size: 20px;
    line-height: 30px;
  }
  .hiraya-attract-box__title > span:nth-child(2) {
    font-size: 40px;
    line-height: 50px;
    letter-spacing: 0.05em;
  }
  .hiraya-attract-box__content-title {
    font-size: 24px;
    line-height: 40px;
    letter-spacing: 0.05em;
    margin-bottom: 20px;
  }
}
/*summary*/
@media screen and (max-width:767px) {
  .hiraya-summary {
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
  }
  .hiraya-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 50px 20px;
    background-color: #333333;
  }
  .hiraya-summary__header {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: min(19px + (20 - 19) * ((100vw - 320px) / (375 - 320)), 20px);
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: justify;
    word-break: break-all;
  }
  .hiraya-summary__txt {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .hiraya-summary > picture {
    display: flex;
    width: 50%;
  }
  .hiraya-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .hiraya-summary {
    position: relative;
    display: block;
    width: 100%;
  }
  .hiraya-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 400px;
    min-height: 350px;
    padding: 40px 20px;
    background-color: #333333;
    margin: 0 auto;
  }
  .hiraya-summary__header {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .hiraya-summary__txt {
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .hiraya-summary > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 400px)/2);
    height: 100%;
    overflow: hidden;
  }
  .hiraya-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .hiraya-summary__figure1 {
    left: 0;
  }
  .hiraya-summary__figure2 {
    right: 0;
  }
}
@media screen and (min-width:1025px) {
  .hiraya-summary {
    position: relative;
    display: block;
    width: 100%;
  }
  .hiraya-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 555px;
    width: 100%;
    min-height: 530px;
    padding: 70px 50px;
    background-color: #333333;
    margin: 0 auto;
  }
  .hiraya-summary__header {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 50px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .hiraya-summary__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .hiraya-summary > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 555px)/2);
    height: 100%;
    overflow: hidden;
  }
  .hiraya-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .hiraya-summary__figure1 {
    left: 0;
  }
  .hiraya-summary__figure2 {
    right: 0;
  }
}
/*
PAGE - final-abode
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .final-abode-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .final-abode-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/final-abode/final-abode.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto 53px;
  }
  .final-abode-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .final-abode-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .final-abode-intro__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .final-abode-intro__main {
    display: block;
    width: 100%;
    padding: 50px 0 30px;
  }
  .final-abode-intro__content {
    display: block;
    width: 100%;
  }
  .final-abode-intro__title {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 45px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .final-abode-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .final-abode-intro__list-wrap {
    display: block;
    width: calc(100% + 20px);
    margin: 30px 0 0 -10px;
  }
  .final-abode-intro__list {
    display: block;
    width: 100%;
    padding: 20px;
    background-color: rgba(39,39,39,0.9);
  }
  .final-abode-intro__list > li {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    color: var(--white);
    line-height: 22.5px;
    text-align: justify;
    word-break: break-all;
    padding-left: 30px;
    background-image: url(./assets/images/final-abode/icon-check.png);
    background-repeat: no-repeat;
    background-position: left top 5px;
    background-size: 20px auto;
  }
  .final-abode-intro__list > li + li {
    margin-top: 20px;
  }
  .final-abode-intro__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .final-abode-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .final-abode-intro__summary {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .final-abode-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .final-abode-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 65px;
    background-image: url(./assets/images/final-abode/final-abode.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .final-abode-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .final-abode-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .final-abode-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .final-abode-intro__main {
    display: block;
    width: 100%;
    padding: 230px 0;
    background-image: url(./assets/images/final-abode/final-abode-pc.jpg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
  }
  .final-abode-intro__content {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .final-abode-intro__title {
    display: block;
    width: 100%;
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  }
  .final-abode-intro__txt {
    display: block;
    max-width: 683px;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
    text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  }
  .final-abode-intro__list-wrap {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: -165px auto 0;
  }
  .final-abode-intro__list {
    display: block;
    width: 560px;
    padding: calc(30/1040 * 100%);
    background-color: rgba(39,39,39,0.9);
  }
  .final-abode-intro__list > li {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    color: var(--white);
    line-height: 22.5px;
    text-align: justify;
    word-break: break-all;
    padding-left: 30px;
    background-image: url(./assets/images/final-abode/icon-check.png);
    background-repeat: no-repeat;
    background-position: left top 8px;
    background-size: 20px auto;
  }
  .final-abode-intro__list > li + li {
    margin-top: 20px;
  }
  .final-abode-intro__figure {
    display: none;
  }
  .final-abode-intro__summary {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin: 50px auto 0;
  }
}
/*advice*/
@media screen and (max-width:767px) {
  .final-abode-advice {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .final-abode-advice__header {
    display: block;
    width: 100%;
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    font-weight: 500;
    line-height: 45px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .final-abode-advice__main {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .final-abode-advice-box {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .final-abode-advice-box + .final-abode-advice-box {
    margin-top: 80px;
  }
  .final-abode-advice-box__figure {
    display: block;
    width: 100%;
  }
  .final-abode-advice-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .final-abode-advice-box__content{
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .final-abode-advice-box__title {
    display: block;
    width: 100%;
    font-size: min(22px + (26 - 22) * ((100vw - 320px) / (375 - 320)), 26px);
    font-weight: 500;
    line-height: 38px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .final-abode-advice-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .final-abode-advice {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .final-abode-advice__header {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin: 0 auto;
  }
  .final-abode-advice__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .final-abode-advice-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .final-abode-advice-box:nth-child(even) {
    flex-direction: row-reverse;
  }
  .final-abode-advice-box + .final-abode-advice-box {
    margin-top: 150px;
  }
  .final-abode-advice-box__figure {
    display: block;
    width: 50%;
  }
  .final-abode-advice-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .final-abode-advice-box__content{
    display: block;
    width: calc(515/1140 * 100%);
  }
  .final-abode-advice-box__title {
    display: block;
    width: 100%;
    font-size: 34px;
    font-weight: 500;
    line-height: 50px;
    letter-spacing: 0.1em;
    padding: 30px 0;
    text-align: justify;
    word-break: break-all;
  }
  .final-abode-advice-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .final-abode-advice-box__title {
    font-size: 25px;
    line-height: 40px;
    letter-spacing: 0;
    padding: 20px 0;
  }
}
/*flow*/
@media screen and (max-width:767px) {
  .final-abode-flow {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .final-abode-flow__body {
    display: block;
    width: 100%;
  }
  .final-abode-flow__header {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 45px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .final-abode-flow__list {
    padding: 30px 0 0;
  }
}
@media screen and (min-width:768px) {
  .final-abode-flow {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .final-abode-flow__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .final-abode-flow__header {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .final-abode-flow__list {
    padding: 50px 0 0;
  }
}
/*cta*/
@media screen and (max-width:767px) {
  .final-abode-cta {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: #666666;
  }
  .final-abode-cta__body {
    display: block;
    width: 100%;
  }
  .final-abode-cta__main {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .final-abode-cta__header {
    display: block;
    width: 100%;
    font-size: min(20px + (22 - 20) * ((100vw - 320px) / (375 - 320)), 22px);
    font-weight: 500;
    line-height: 40px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
    letter-spacing: 0;
  }
  .final-abode-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .final-abode-cta__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 30px;
  }
  .final-abode-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .final-abode-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .final-abode-cta__figure {
    display: block;
    width: 100%;
  }
  .final-abode-cta__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .final-abode-cta {
    position: relative;
    display: block;
    width: 100%;
    padding: 85px 0;
    background-color: #666666;
  }
  .final-abode-cta__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .final-abode-cta__main {
    display: block;
    width: calc(455/1040 * 100%);
  }
  .final-abode-cta__header {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 50px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .final-abode-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .final-abode-cta__btns {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .final-abode-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .final-abode-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .final-abode-cta__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .final-abode-cta__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .final-abode-cta {
    padding: 60px 0;
  }
  .final-abode-cta__header {
    font-size: 21px;
    line-height: 40px;
    margin-bottom: 20px;
  }
}
/*
PAGE - lands
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .lands-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .lands-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/lands/lands.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto 53px;
  }
  .lands-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .lands-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .lands-intro__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .lands-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top:30px;
  }
}
@media screen and (min-width:768px) {
  .lands-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .lands-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 65px;
    background-image: url(./assets/images/lands/lands.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .lands-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .lands-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .lands-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .lands-intro__txt {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
    margin: 30px auto 0;
  }
}
/*case*/
@media screen and (max-width:767px) {
  .lands-case {
    display: block;
    width: 100%;
    padding: 0 0 50px;
    background-color: var(--white);
  }
  .lands-case__body {
    display: block;
    width: 100%;
  }
  .lands-case__header {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 45px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
  }
  .lands-case__main {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .lands-case-box {
    display: block;
    width: 100%;
    background-color: #F9F8F6;
  }
  .lands-case-box + .lands-case-box {
    margin-top: 50px;
  }
  .lands-case-box__hgroup {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .lands-case-box__badge {
    display: block;
    width: 132px;
    height: 50px;
    background-color: #B9B89C;
    font-size: 30px;
    color: var(--white);
    line-height: 1;
    font-weight: 500;
    padding: 10px 0;
    text-align: center;
  }
  .lands-case-box__badge > small {
    font-size: 16px;
    font-family: var(--cormorant-garamond);
    line-height: 1;
    padding-right: 5px;
  }
  .lands-case-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    line-height: 30px;
    color: #70634D;
    padding: 20px;
    text-align: justify;
    word-break: break-all;
  }
  .lands-case-box__columns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0 20px 20px;
  }
  .lands-case-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .lands-case-box__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .lands-case-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .lands-case {
    display: block;
    width: 100%;
    padding: 0 0 100px;
    background-color: var(--white);
  }
  .lands-case__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .lands-case__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
  }
  .lands-case__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .lands-case-box {
    display: block;
    width: 100%;
    background-color: #F9F8F6;
  }
  .lands-case-box + .lands-case-box {
    margin-top: 80px;
  }
  .lands-case-box__hgroup {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .lands-case-box__badge {
    display: block;
    width: 156px;
    height: 100px;
    background-color: #B9B89C;
    font-size: 50px;
    color: var(--white);
    line-height: 60px;
    font-weight: 500;
    padding: 20px 0;
    text-align: center;
  }
  .lands-case-box__badge > small {
    font-size: 20px;
    font-family: var(--cormorant-garamond);
    line-height: 1;
    padding-right: 10px;
  }
  .lands-case-box__title {
    display: block;
    width: calc(100% - 156px - 30px);
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    color: #70634D;
    text-align: justify;
    word-break: break-all;
  }
  .lands-case-box__columns {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: calc(30/1040 * 100%);
  }
  .lands-case-box__txt {
    display: block;
    width: calc(590/980 * 100%);
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .lands-case-box__figure {
    display: block;
    width: calc(360/980 * 100%);
  }
  .lands-case-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*points*/
@media screen and (max-width:767px) {
  .lands-points {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .lands-points__header {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 45px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .lands-points__main {
    display: block;
    width: 100%;
    margin: 50px auto 0;
  }
  .lands-point {
    position: relative;
    display: block;
    width: 100%;
    min-height: 351px;
  }
  .lands-point + .lands-point {
    margin-top: 80px;
  }
  .lands-point__figure {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 520px;
    width: 100%;
    padding: 0 20px 35px;
    margin: 0 auto;
  }
  .lands-point__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .lands-point__figure > .badge {
    position: absolute;
    bottom: 0;
    left: 20px;
    z-index: 1;
    display: block;
    width: 80px;
    height: auto;
    mix-blend-mode: color-burn;
  }
  .lands-point__content {
    display: block;
    width: 100%;
    margin-left: auto;
    padding-top: 30px;
  }
  .lands-point__title {
    display: block;
    width: 100%;
    font-size: min(24px + (26 - 24) * ((100vw - 320px) / (375 - 320)), 26px);
    font-weight: 500;
    line-height: 38px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .lands-point__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .lands-point__txt > span {
    font-size: 18px;
    font-weight: 600;
  }
  .lands-point__row {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 10px;
    border-bottom: 1px solid #D3D3D3;
    margin-top: 30px;
  }
  .lands-point__row + .lands-point__row {
    padding-top: 10px;
    margin-top: 0;
  }
  .lands-point__row > dt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 26px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: #70634D;
  }
  .lands-point__row > dd {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 25.5px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) {
  .lands-points {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .lands-points__header {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin: 0 auto;
  }
  .lands-points__main {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 50px auto 0;
  }
  .lands-point {
    position: relative;
    display: block;
    width: 100%;
    min-height: 351px;
  }
  .lands-point + .lands-point {
    margin-top: 100px;
  }
  .lands-point__figure {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    padding-right: 100px;
  }
  .lands-point__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .lands-point__figure > .badge {
    position: absolute;
    top: 33px;
    right: 5px;
    z-index: 1;
    display: block;
    width: 120px;
    height: auto;
    mix-blend-mode: color-burn;
  }
  .lands-point__content {
    display: block;
    width: 50%;
    padding-right: calc(50/1140 * 100%);
    margin-left: auto;
    padding-top: 80px;
  }
  .lands-point__title {
    display: block;
    width: 100%;
    font-size: 34px;
    font-weight: 500;
    line-height: 50px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .lands-point__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .lands-point__txt > span {
    font-size: 18px;
    font-weight: 600;
  }
  .lands-point__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-bottom: 10px;
    border-bottom: 1px solid #D3D3D3;
    margin-top: 30px;
  }
  .lands-point__row + .lands-point__row {
    padding-top: 10px;
    margin-top: 0;
  }
  .lands-point__row > dt {
    display: block;
    width: 130px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: #70634D;
  }
  .lands-point__row > dd {
    display: block;
    width: calc(100% - 130px);
    font-size: 15px;
    font-weight: 500;
    line-height: 25.5px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .lands-point__figure {
    padding-right: 70px;
  }
  .lands-point__figure > .badge {
    width: 80px;
  }
  .lands-point__content {
    padding-top: 50px;
  }
  .lands-point__title {
    font-size: 30px;
    line-height: 40px;
  }
  .lands-point__row > dt {
    width: 100px;
  }
  .lands-point__row > dd {
    width: calc(100% - 100px);
  }
}
/*flow*/
@media screen and (max-width:767px) {
  .lands-flow {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .lands-flow__body {
    display: block;
    width: 100%;
  }
  .lands-flow__header {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 45px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .lands-flow__list {
    padding: 30px 0 0;
  }
  .answer-txt__txt-list {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.07em;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    margin-top: 10px;
  }
  .answer-txt__txt-list > span {
    position: absolute;
    left: 0;
  }
  .answer-txt + .answer-txt {
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) {
  .lands-flow {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .lands-flow__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .lands-flow__header {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .lands-flow__list {
    padding: 50px 0 0;
  }
  .answer-txt__txt-list {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.07em;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    margin-top: 10px;
  }
  .answer-txt__txt-list > span {
    position: absolute;
    left: 0;
  }
  .answer-txt + .answer-txt {
    margin-top: 10px;
  }
}
/*cta*/
@media screen and (max-width:767px) {
  .lands-cta {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: #01444D;
  }
  .lands-cta__body {
    display: block;
    width: 100%;
  }
  .lands-cta__main {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .lands-cta__header {
    display: block;
    width: 100%;
    font-size: min(20px + (22 - 20) * ((100vw - 320px) / (375 - 320)), 22px);
    font-weight: 500;
    line-height: 40px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
    letter-spacing: 0;
  }
  .lands-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .lands-cta__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 30px;
  }
  .lands-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .lands-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .lands-cta__figure {
    display: block;
    width: 100%;
  }
  .lands-cta__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .lands-cta {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 483px;
    padding: 85px 0;
    background-color: #01444D;
  }
  .lands-cta__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .lands-cta__main {
    display: block;
    width: calc(455/1040 * 100%);
  }
  .lands-cta__header {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 50px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .lands-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .lands-cta__btns {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .lands-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .lands-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .lands-cta__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .lands-cta__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .lands-cta {
    padding: 60px 0;
  }
  .lands-cta__header {
    font-size: 21px;
    line-height: 40px;
    margin-bottom: 20px;
  }
}
/*
PAGE - child-rearing
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .child-rearing-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .child-rearing-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/child-rearing/child-rearing.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto 53px;
  }
  .child-rearing-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .child-rearing-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .child-rearing-intro__header > span:nth-child(2) {
    font-size: min(25px + (32 - 25) * ((100vw - 320px) / (375 - 320)), 32px);
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .child-rearing-intro__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .child-rearing-intro__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .child-rearing-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .child-rearing-intro__content-wrap {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .child-rearing-intro__content {
    display: block;
    width: 100%;
  }
  .child-rearing-intro__title {
    display: block;
    width: 100%;
    font-size: min(24px + (28 - 24) * ((100vw - 320px) / (375 - 320)), 28px);
    line-height: 42px;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-intro__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }

}
@media screen and (min-width:768px) {
  .child-rearing-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .child-rearing-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 65px;
    background-image: url(./assets/images/child-rearing/child-rearing.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto 100%;
  }
  .child-rearing-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .child-rearing-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .child-rearing-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .child-rearing-intro__main {
    position: relative;
    display: block;
    width: 100%;
  }
  .child-rearing-intro__content-wrap {
    position: absolute;
    bottom: 80px;
    left: 0;
    display: block;
    width: 100%;
  }
  .child-rearing-intro__content {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .child-rearing-intro__title {
    display: block;
    width: 50%;
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-intro__txt {
    display: block;
    width: 50%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .child-rearing-intro__figure {
    display: block;
    width: 100%;
  }
  .child-rearing-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .child-rearing-intro__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 626px;
  }
  .child-rearing-intro__figure > img {
    height: 100%;
    object-position: center;
  }
  .child-rearing-intro__title {
    font-size: 30px;
    line-height: 40px;
  }
}
/*living*/
@media screen and (max-width:767px) {
  .child-rearing-living {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .child-rearing-living__body {
    display: block;
    width: 100%;
  }
  .child-rearing-living__header {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 45px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .child-rearing-living__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 25.5px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-living__main {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 40px;
    max-width: 246px;
    width: 100%;
    margin: 50px auto 0;
  }
  .child-rearing-living-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
  .child-rearing-living-box__figure {
    display: block;
    max-width: 200px;
    width: 100%;
  }
  .child-rearing-living-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .child-rearing-living-box__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 20px;
  }
  .child-rearing-living-box__title > span:nth-child(1) {
    font-size: 18px;
    line-height: 24px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .child-rearing-living-box__title > span:nth-child(2) {
    font-size: 24px;
    line-height: 36px;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: #70634D;
    text-align: center;
  }
}
@media screen and (min-width:768px) {
  .child-rearing-living {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .child-rearing-living__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .child-rearing-living__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .child-rearing-living__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-living__main {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: calc(30/1040 * 100%);
    max-width: 900px;
    width: 100%;
    margin: 50px auto 0;
  }
  .child-rearing-living-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
  .child-rearing-living-box__figure {
    display: block;
    max-width: 251px;
    width: 100%;
  }
  .child-rearing-living-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .child-rearing-living-box__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 20px;
  }
  .child-rearing-living-box__title > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-align: center;
  }
  .child-rearing-living-box__title > span:nth-child(2) {
    font-size: 28px;
    line-height: 40px;
    font-weight: 600;
    letter-spacing: 0.1em;
    color: #70634D;
    text-align: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .child-rearing-living__txt {
    font-size: 15px;
  }
  .child-rearing-living-box__title > span:nth-child(1) {
    font-size: 18px;
    line-height: 24px;
  }
  .child-rearing-living-box__title > span:nth-child(2) {
    font-size: 24px;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .child-rearing-feature {
    display: block;
    width: 100%;
  }
  .child-rearing-feature-box {
    display: block;
    width: 100%;
    padding: 50px 0;
  }
  .child-rearing-feature-box:nth-child(even) {
    background-color: #F9F8F6;
  }
  .child-rearing-feature-box__body {
    display: block;
    width: 100%;
  }
  .child-rearing-feature-box__hgroup {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .child-rearing-feature-box__title {
    display: flex;
    flex-direction: column;
    width: calc(237/335 * 100%);
  }
  .child-rearing-feature-box__title > span:nth-child(1) {
    font-size: min(15px + (18 - 15) * ((100vw - 320px) / (375 - 320)), 18px);
    font-weight: 500;
    line-height: 26px;
    letter-spacing: 0.1em;
  }
  .child-rearing-feature-box__title > span:nth-child(2) {
    font-size: 30px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.1em;
  }
  .child-rearing-feature-box__figure {
    display: block;
    width: calc(98/335 * 100%);
  }
  .child-rearing-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .child-rearing-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .child-rearing-feature-main {
    display: block;
    width: 100%;
    margin: 50px auto 0;
  }
  .child-rearing-feature-block {
    display: block;
    width: 100%;
  }
  .child-rearing-feature-block + .child-rearing-feature-block {
    margin-top: 50px;
  }
  .child-rearing-feature-block__hgroup {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .child-rearing-feature-block__badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 65px;
  }
  .child-rearing-feature-block__badge > span:nth-child(1) {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .child-rearing-feature-block__badge > span:nth-child(2) {
    font-size: 60px;
    line-height: 60px;
    font-weight: 500;
  }
  .child-rearing-feature-block__title {
    display: block;
    width: 100%;
    font-size: min(24px + (26 - 24) * ((100vw - 320px) / (375 - 320)), 26px);
    line-height: 37px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: center;
    margin-top: 10px;
  }
  .child-rearing-feature-block__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .child-rearing-feature-block__col {
    display: block;
    width: 100%;
  }
  .child-rearing-feature-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-feature-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-feature-block__caption {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    margin-top: 10px;
  }
  .child-rearing-feature-block__caption > span {
    position: absolute;
    left: 0;
  }
  .child-rearing-feature-block__caption > a {
    color: var(--font-color);
    text-decoration: underline;
  }
  .child-rearing-feature-block__caption > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .child-rearing-feature-block__figure {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .child-rearing-feature-block__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .child-rearing-feature {
    display: block;
    width: 100%;
  }
  .child-rearing-feature-box {
    display: block;
    width: 100%;
    padding: 100px 0;
  }
  .child-rearing-feature-box:nth-child(even) {
    background-color: #F9F8F6;
  }
  .child-rearing-feature-box__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .child-rearing-feature-box__hgroup {
    display: flex;
    align-items: center;
    width: 100%;
  }
  .child-rearing-feature-box__title {
    display: flex;
    align-items: flex-end;
    width: auto;
  }
  .child-rearing-feature-box__title > span:nth-child(1) {
    font-size: 22px;
    font-weight: 500;
    line-height: 31px;
    letter-spacing: 0.1em;
  }
  .child-rearing-feature-box__title > span:nth-child(2) {
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    padding-left: 10px;
  }
  .child-rearing-feature-box__figure {
    display: block;
    width: 98px;
    margin-left: 20px;
  }
  .child-rearing-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .child-rearing-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .child-rearing-feature-main {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 50px auto 0;
  }
  .child-rearing-feature-block {
    display: block;
    width: 100%;
  }
  .child-rearing-feature-block + .child-rearing-feature-block {
    margin-top: 50px;
  }
  .child-rearing-feature-block__hgroup {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .child-rearing-feature-block__badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 65px;
  }
  .child-rearing-feature-block__badge > span:nth-child(1) {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .child-rearing-feature-block__badge > span:nth-child(2) {
    font-size: 60px;
    line-height: 60px;
    font-weight: 500;
  }
  .child-rearing-feature-block__title {
    display: block;
    width: calc(100% - 65px - 20px);
    font-size: 34px;
    line-height: 50px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-feature-block__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 30px;
  }
  .child-rearing-feature-box:nth-child(even) .child-rearing-feature-block__cols {
    flex-direction: row-reverse;
  }
  .child-rearing-feature-block__col {
    display: block;
    width: calc(450/900 * 100%);
  }
  .child-rearing-feature-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-feature-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-feature-block__caption {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    margin-top: 10px;
  }
  .child-rearing-feature-block__caption > span {
    position: absolute;
    left: 0;
  }
  .child-rearing-feature-block__caption > a {
    color: var(--font-color);
    text-decoration: underline;
  }
  .child-rearing-feature-block__caption > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .child-rearing-feature-block__figure {
    display: block;
    width: calc(400/900 * 100%);
  }
  .child-rearing-feature-block__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*cta*/
@media screen and (max-width:767px) {
  .child-rearing-cta {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: #70634D;
  }
  .child-rearing-cta__body {
    display: block;
    width: 100%;
  }
  .child-rearing-cta__main {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .child-rearing-cta__header {
    display: block;
    width: 100%;
    font-size: min(20px + (22 - 20) * ((100vw - 320px) / (375 - 320)), 22px);
    font-weight: 500;
    line-height: 40px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
    letter-spacing: 0;
  }
  .child-rearing-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-cta__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 30px;
  }
  .child-rearing-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .child-rearing-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .child-rearing-cta__figure {
    display: block;
    width: 100%;
  }
  .child-rearing-cta__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .child-rearing-cta {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 483px;
    padding: 85px 0;
    background-color: #70634D;
  }
  .child-rearing-cta__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .child-rearing-cta__main {
    display: block;
    width: calc(455/1040 * 100%);
  }
  .child-rearing-cta__header {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 50px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .child-rearing-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .child-rearing-cta__btns {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .child-rearing-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .child-rearing-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .child-rearing-cta__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .child-rearing-cta__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .child-rearing-cta {
    padding: 60px 0;
  }
  .child-rearing-cta__header {
    font-size: 21px;
    line-height: 40px;
    margin-bottom: 20px;
  }
}
/*
PAGE - technical
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .technical-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .technical-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/technical/technical.png);
    background-repeat: no-repeat;
    background-position: left top 26px;
    background-size: auto 60px;
  }
  .technical-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .technical-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .technical-intro__header > span:nth-child(2) {
    font-size: min(23px + (26 - 23) * ((100vw - 320px) / (375 - 320)), 26px);
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .technical-intro__main {
    display: block;
    width: 100%;
    padding-top: 50px;
  }
  .technical-intro__txt {
    display: block;
    width: 100%;
    font-size: min(13px + (15 - 13) * ((100vw - 320px) / (375 - 320)), 15px);
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
  }
  .technical-intro__title {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 40px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding: 50px 0 30px;
  }
  .technical-intro__title + .technical-intro__txt {
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) {
  .technical-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .technical-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/technical/technical.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 150px;
  }
  .technical-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .technical-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .technical-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .technical-intro__main {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    padding-top: 100px;
  }
  .technical-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
  }
  .technical-intro__title {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding: 100px 0 50px;
  }
  .technical-intro__title + .technical-intro__txt {
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .technical-feature {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .technical-feature__body {
    display: block;
    width: 100%;
  }
  .technical-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .technical-feature__header > span:nth-child(1) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .technical-feature__header > span:nth-child(2) {
    font-size: min(22px + (26 - 22) * ((100vw - 320px) / (375 - 320)), 26px);
    font-weight: 500;
    line-height: 37px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .technical-feature__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .technical-feature__figure {
    display: block;
    width: calc(900/1040 * 100%);
    margin: 0 auto;
  }
  .technical-feature__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-feature__list {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .technical-feature__list > li {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
  }
  .technical-feature__list > li + li {
    margin-top: 30px;
  }
  .technical-feature__list-figure {
    display: block;
    max-width: 175px;
    width: 100%;
  }
  .technical-feature__list-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-feature__list-content {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .technical-feature__list-title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 600;
    line-height: 35px;
    letter-spacing: 0.07em;
    text-align: center;
  }
  .technical-feature__list > li:nth-child(1) .technical-feature__list-title {
    color: #515151;
  }
  .technical-feature__list > li:nth-child(2) .technical-feature__list-title {
    color: #70634D;
  }
  .technical-feature__list > li:nth-child(3) .technical-feature__list-title {
    color: #01444D;
  }
  .technical-feature__list-subtitle {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: 0.08em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .technical-feature__list > li:nth-child(1) .technical-feature__list-subtitle {
    color: #515151;
  }
  .technical-feature__list > li:nth-child(2) .technical-feature__list-subtitle {
    color: #70634D;
  }
  .technical-feature__list > li:nth-child(3) .technical-feature__list-subtitle {
    color: #01444D;
  }
  .technical-feature__list-subtitle > span {
    text-decoration: underline;
    text-underline-offset: 5px;
  }
  .technical-feature__list-txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0.08em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .technical-feature__block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .technical-feature__block-title {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 28.6px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 10px;
    border-left: 5px solid #333333;
  }
  .technical-feature__block-cols {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 30px;
  }
  .technical-feature__block-col {
    display: block;
    width: 100%;
  }
  .technical-feature__block-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .technical-feature__block-txt > span {
    font-size: 18px;
    font-weight: 600;
  }
  .technical-feature__block-caption {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    margin-top: 20px;
  }
  .technical-feature__block-caption > span {
    position: absolute;
    left: 0;
  }
  .technical-feature__block-figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .technical-feature__block-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .technical-feature {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .technical-feature__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .technical-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .technical-feature__header > span {
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .technical-feature__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .technical-feature__figure {
    display: block;
    width: calc(900/1040 * 100%);
    margin: 0 auto;
  }
  .technical-feature__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-feature__list {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .technical-feature__list > li {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: calc(40/1040 * 100%) calc(30/1040 * 100%);
    background-color: var(--white);
  }
  .technical-feature__list > li + li {
    margin-top: 30px;
  }
  .technical-feature__list-figure {
    display: block;
    width: calc(175/980 * 100%);
  }
  .technical-feature__list-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-feature__list-content {
    display: block;
    width: calc(775/980 * 100%);
  }
  .technical-feature__list-title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 600;
    line-height: 37px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .technical-feature__list > li:nth-child(1) .technical-feature__list-title {
    color: #515151;
  }
  .technical-feature__list > li:nth-child(2) .technical-feature__list-title {
    color: #70634D;
  }
  .technical-feature__list > li:nth-child(3) .technical-feature__list-title {
    color: #01444D;
  }
  .technical-feature__list-subtitle {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: 0.08em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .technical-feature__list > li:nth-child(1) .technical-feature__list-subtitle {
    color: #515151;
  }
  .technical-feature__list > li:nth-child(2) .technical-feature__list-subtitle {
    color: #70634D;
  }
  .technical-feature__list > li:nth-child(3) .technical-feature__list-subtitle {
    color: #01444D;
  }
  .technical-feature__list-subtitle > span {
    text-decoration: underline;
    text-underline-offset: 5px;
  }
  .technical-feature__list-txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0.08em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .technical-feature__block {
    display: block;
    width: 100%;
    margin-top: 100px;
  }
  .technical-feature__block-title {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
  }
  .technical-feature__block-cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 30px;
  }
  .technical-feature__block-col {
    display: block;
    width: calc(480/1040 * 100%);
  }
  .technical-feature__block-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .technical-feature__block-txt > span {
    font-size: 18px;
    font-weight: 600;
  }
  .technical-feature__block-caption {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    margin-top: 10px;
  }
  .technical-feature__block-caption > span {
    position: absolute;
    left: 0;
  }
  .technical-feature__block-figure {
    display: block;
    width: calc(510/1040 * 100%);
  }
  .technical-feature__block-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*section*/
@media screen and (max-width:767px) {
  .technical-section {
    display: block;
    width: 100%;
    padding: 50px 0;
  }
  .technical-section.white {
    background-color: var(--white);
  }
  .technical-section.grey {
    background-color: #F9F8F6;
  }
  .technical-section__body {
    display: block;
    width: 100%;
  }
  .technical-section__header {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .technical-section__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.08em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .technical-section__txt > span {
    font-size: 18px;
    font-weight: 600;
  }
  .technical-section__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .technical-section__col {
    display: flex;
    flex-direction: column;
    align-items: center;
    width:100%;
    padding: 20px 10px;
  }
  .technical-section__col:nth-child(1) {
    background-color: #E5ECED;
  }
  .technical-section__col:nth-child(2) {
    background-color: #EFE8DD;
    margin-top: 50px;
  }
  .technical-section__col-figure {
    display: block;
    width: 100%;
  }
  .technical-section__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-section__col-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 20px;
  }
  .technical-section__col-title > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .technical-section__col-title > span:nth-child(2) {
    font-size: min(22px + (24 - 22) * ((100vw - 320px) / (375 - 320)), 24px);
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-align: center;
  }
  .technical-section__col:nth-child(1) .technical-section__col-title > span:nth-child(2) {
    color: #01444D;
  }
  .technical-section__col:nth-child(2) .technical-section__col-title > span:nth-child(2) {
    color: #6D0C0C;
  }
  .technical-section__col-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .technical-section-block {
    display: block;
    width: 100%;
  }
  .technical-section-block + .technical-section-block {
    margin-top: 100px;
  }
  .technical-section-block__title {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 28.6px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .technical-section-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .technical-section-flex {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-bottom: 50px;
  }
  .technical-section-flex__col {
    display: block;
    width: 100%;
  }
  .technical-section-flex__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .technical-section-flex__caption {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    margin-top: 10px;
  }
  .technical-section-flex__caption > span {
    position: absolute;
    left: 0;
  }
  .technical-section-flex__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .technical-section-flex__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-section-list {
    display: block;
    width: 100%;
  }
  .technical-section-list > li {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px;
    border: 1px solid #A5A47F;
  }
  .technical-section-list > li + li {
    margin-top: 50px;
  }
  .technical-section-list__figure {
    display: block;
    width: 100%;
  }
  .technical-section-list__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-section-list__content {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .technical-section-list__title {
    display: block;
    width: 100%;
    font-size: min(20px + (24 - 20) * ((100vw - 320px) / (375 - 320)), 24px);
    line-height: 35px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: center;
    margin-bottom: 20px;
  }
  .technical-section-list__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) {
  .technical-section {
    display: block;
    width: 100%;
    padding: 100px 0;
  }
  .technical-section.white {
    background-color: var(--white);
  }
  .technical-section.grey {
    background-color: #F9F8F6;
  }
  .technical-section__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .technical-section__header {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .technical-section__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 32px;
    letter-spacing: 0.08em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .technical-section__txt > span {
    font-size: 18px;
    font-weight: 600;
  }
  .technical-section__cols {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .technical-section__col {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(495/1040 * 100%);
    padding: calc(30/1040 * 100%);
  }
  .technical-section__col:nth-child(1) {
    background-color: #E5ECED;
  }
  .technical-section__col:nth-child(2) {
    background-color: #EFE8DD;
  }
  .technical-section__col-figure {
    display: block;
    width: 100%;
  }
  .technical-section__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-section__col-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 20px;
  }
  .technical-section__col-title > span:nth-child(1) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .technical-section__col-title > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .technical-section__col:nth-child(1) .technical-section__col-title > span:nth-child(2) {
    color: #01444D;
  }
  .technical-section__col:nth-child(2) .technical-section__col-title > span:nth-child(2) {
    color: #6D0C0C;
  }
  .technical-section__col-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .technical-section-block {
    display: block;
    width: 100%;
  }
  .technical-section-block + .technical-section-block {
    margin-top: 100px;
  }
  .technical-section-block__title {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .technical-section-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .technical-section-flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 80px;
  }
  .technical-section-flex__col {
    display: block;
    width: calc(480/1040 * 100%);
  }
  .technical-section-flex__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .technical-section-flex__caption {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    margin-top: 10px;
  }
  .technical-section-flex__caption > span {
    position: absolute;
    left: 0;
  }
  .technical-section-flex__figure {
    display: block;
    width: calc(510/1040 * 100%);
  }
  .technical-section-flex__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-section-list {
    display: block;
    width: 100%;
  }
  .technical-section-list > li {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: calc(40/1040 * 100%) calc(30/1040 * 100%);
    border: 1px solid #A5A47F;
  }
  .technical-section-list > li + li {
    margin-top: 50px;
  }
  .technical-section-list__figure {
    display: block;
    width: calc(280/978 * 100%);
  }
  .technical-section-list__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .technical-section-list__content {
    display: block;
    width: calc(670/978 * 100%);
  }
  .technical-section-list__title {
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 37px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 20px;
  }
  .technical-section-list__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .technical-section__col-title > span:nth-child(2) {
    font-size: 26px;
  }
}
/*
PAGE - comfortable
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .comfortable-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .comfortable-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/comfortable/comfortable.png);
    background-repeat: no-repeat;
    background-position: left top 23px;
    background-size: auto 60px;
  }
  .comfortable-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .comfortable-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .comfortable-intro__header > span:nth-child(2) {
    font-size: 32px;
    line-height: 42px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .comfortable-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    padding: 50px 0 50px;
  }
  .comfortable-intro__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .comfortable-intro__col {
    display: block;
    width: 100%;
  }
  .comfortable-intro__col-title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .comfortable-intro__col-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .comfortable-intro__figure {
    display: block;
    width: calc(100% + 40px);
    margin-top: 30px;
  }
  .comfortable-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .comfortable-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .comfortable-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/comfortable/comfortable.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 150px;
    padding-bottom: 60px;
  }
  .comfortable-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .comfortable-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .comfortable-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .comfortable-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    padding: 30px 0 50px;
  }
  .comfortable-intro__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .comfortable-intro__col {
    display: block;
    width: calc(490/1140 * 100%);
    margin-left: calc(50/1140 * 100%);
    padding-top: calc(50/1140 * 100%);
  }
  .comfortable-intro__col-title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .comfortable-intro__col-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .comfortable-intro__figure {
    display: block;
    width: calc(550/1140 * 100%);
  }
  .comfortable-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*advice*/
@media screen and (max-width:767px) {
  .comfortable-advice {
    display: block;
    width: 100%;
    padding: 70px 0 100px;
    background-color: #F9F8F6;
  }
  .comfortable-advice__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .comfortable-advice__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    letter-spacing: 0.1em;
  }
  .comfortable-advice__header > span:nth-child(2) {
    font-size: 30px;
    font-weight: 500;
    line-height: 45px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .comfortable-advice__main {
    display: block;
    width: 100%;
  }
  .comfortable-advice-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .comfortable-advice-box + .comfortable-advice-box {
    margin-top: 100px;
  }
  .comfortable-advice-box__figure {
    display: block;
    width: 100%;
  }
  .comfortable-advice-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .comfortable-advice-box__content {
    display: block;
    width: 100%;
  }
  .comfortable-advice-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding:50px 0 30px;
  }
  .comfortable-advice-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) {
  .comfortable-advice {
    display: block;
    width: 100%;
    padding: 100px 0 150px;
    background-color: #F9F8F6;
  }
  .comfortable-advice__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 50px;
  }
  .comfortable-advice__header > span:nth-child(1) {
    font-size: 22px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.1em;
  }
  .comfortable-advice__header > span:nth-child(2) {
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .comfortable-advice__main {
    display: block;
    width: 100%;
  }
  .comfortable-advice-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .comfortable-advice-box + .comfortable-advice-box {
    margin-top: 150px;
  }
  .comfortable-advice-box:nth-child(even) {
    flex-direction: row-reverse;
  }
  .comfortable-advice-box__figure {
    display: block;
    width: 50%;
  }
  .comfortable-advice-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .comfortable-advice-box__content {
    display: block;
    width: calc(520/1140 * 100%);
  }
  .comfortable-advice-box__title {
    display: block;
    width: 100%;
    font-size: 34px;
    font-weight: 500;
    line-height: 50px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding:30px 0;
  }
  .comfortable-advice-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
}
/*cta*/
@media screen and (max-width:767px) {
  .comfortable-cta {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: #333333;
  }
  .comfortable-cta__body {
    display: block;
    width: 100%;
  }
  .comfortable-cta__main {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .comfortable-cta__header {
    display: block;
    width: 100%;
    font-size: min(20px + (22 - 20) * ((100vw - 320px) / (375 - 320)), 22px);
    font-weight: 500;
    line-height: 40px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
    letter-spacing: 0;
  }
  .comfortable-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .comfortable-cta__btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .comfortable-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 215px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .comfortable-cta_btn + .comfortable-cta_btn {
    margin-top: 30px;
  }
  .comfortable-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .comfortable-cta__figure {
    display: block;
    width: 100%;
  }
  .comfortable-cta__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .comfortable-cta {
    position: relative;
    display: block;
    width: 100%;
    padding: 115px 0;
    background-color: #333333;
  }
  .comfortable-cta__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .comfortable-cta__main {
    display: block;
    width: calc(455/1040 * 100%);
  }
  .comfortable-cta__header {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 50px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .comfortable-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .comfortable-cta__btns {
    display: flex;
    width: 100%;
    margin-top: 30px;
  }
  .comfortable-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 215px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .comfortable-cta_btn + .comfortable-cta_btn {
    margin-left: 30px;
  }
  .comfortable-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .comfortable-cta__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .comfortable-cta__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .comfortable-cta {
    padding: 80px 0;
  }
  .comfortable-cta__header {
    font-size: 21px;
    line-height: 40px;
    margin-bottom: 20px;
  }
  .comfortable-cta_btn + .comfortable-cta_btn {
    margin-left: 15px;
  }
}
/*
PAGE - money
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .money-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .money-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/money/money.png);
    background-repeat: no-repeat;
    background-position: left top 23px;
    background-size: auto 60px;
  }
  .money-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .money-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .money-intro__header > span:nth-child(2) {
    font-size: 32px;
    line-height: 42px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .money-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding: 50px 0 50px;
  }
  .money-intro-box {
    display: block;
    width: 100%;
  }
  .money-intro-box__title {
    display: block;
    width: 100%;
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .money-intro-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-intro-block {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .money-intro-cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .money-intro-graph {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .money-intro-graph__img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .money-intro-graph__img > li {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    font-size: 13px;
    font-weight: 500;
    line-height: 17px;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: center;
  }
  .money-intro-graph__img > li:nth-child(1) {
    background-color: #01444D;
    width: calc(100% - 67px - 33px);
  }
  .money-intro-graph__img > li:nth-child(2) {
    background-color: #A5A47F;
    width: 67px;
  }
  .money-intro-graph__img > li:nth-child(3) {
    background-color: #7E434F;
    width: 33px;
  }
  .money-intro-graph__plus {
    display: block;
    width: 95px;
    height: 43px;
    padding-left: 25px;
    margin-top: 10px;
    background-image: url(./assets/images/money/icon-plus.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 15px auto;
  }
  .money-intro-graph__plus > span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 43px;
    font-size: 16px;
    color: var(--white);
    font-weight: 500;
    letter-spacing: 0.07em;
    background-color: #70634D;
  }
  .money-intro-graph__caption {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 20px;
  }
  .money-intro-graph__caption > li {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.07em;
    padding-left: 28px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 14px 14px;
  }
  .money-intro-graph__caption > li + li {
    margin-top: 10px;
  }
  .money-intro-graph__caption > li:nth-child(1) {
    background-image: linear-gradient(#01444D,#01444D);
  }
   .money-intro-graph__caption > li:nth-child(2) {
    background-image: linear-gradient(#A5A47F,#A5A47F);
  }
   .money-intro-graph__caption > li:nth-child(3) {
    background-image: linear-gradient(#7E434F,#7E434F);
  }
  .money-intro-block__tbl {
    display: block;
    width: 100%;
    margin: 35px 0 30px;
  }
  .money-intro-block__row {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 10px;
    border-bottom: 1px solid #D3D3D3;
  }
  .money-intro-block__row + .money-intro-block__row {
    padding-top: 10px;
  }
  .money-intro-block__row > dt {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 600;
    line-height: 26px;
    color: #7E434F;
  }
  .money-intro-block__row:nth-child(1) > dt {
    color: #01444D;
  }
  .money-intro-block__row:nth-child(2) > dt {
    color: #A5A47F;
  }
  .money-intro-block__row > dd {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 5px;
  }
}
@media screen and (min-width:768px) {
  .money-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .money-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/money/money.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 150px;
    padding-bottom: 60px;
  }
  .money-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .money-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .money-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .money-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    padding: 30px 0 0;
  }
  .money-intro-box {
    display: block;
    max-width: 1040px;
    width: 100%;
    padding-top: 150px;
    margin: 0 auto;
  }
  .money-intro-box__title {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .money-intro-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-intro-block {
    display: block;
    max-width: 800px;
    width: 100%;
    margin: 30px auto 0;
  }
  .money-intro-cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .money-intro-graph {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(550/800 * 100%);
  }
  .money-intro-graph__img {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .money-intro-graph__img > li {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100px;
    font-size: 16px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.07em;
  }
  .money-intro-graph__img > li:nth-child(1) {
    background-color: #01444D;
    width: calc(100% - 110px - 55px);
  }
  .money-intro-graph__img > li:nth-child(2) {
    background-color: #A5A47F;
    width: 110px;
  }
  .money-intro-graph__img > li:nth-child(3) {
    background-color: #7E434F;
    width: 55px;
  }
  .money-intro-graph__plus {
    display: block;
    width: 95px;
    height: 43px;
    padding-left: 25px;
    margin-top: 10px;
    background-image: url(./assets/images/money/icon-plus.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 15px auto;
  }
  .money-intro-graph__plus > span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 43px;
    font-size: 16px;
    color: var(--white);
    font-weight: 500;
    letter-spacing: 0.07em;
    background-color: #70634D;
  }
  .money-intro-graph__caption {
    display: flex;
    flex-direction: column;
    width: calc(200/800 * 100%);
  }
  .money-intro-graph__caption > li {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.07em;
    padding-left: 28px;
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 14px 14px;
  }
  .money-intro-graph__caption > li + li {
    margin-top: 10px;
  }
  .money-intro-graph__caption > li:nth-child(1) {
    background-image: linear-gradient(#01444D,#01444D);
  }
   .money-intro-graph__caption > li:nth-child(2) {
    background-image: linear-gradient(#A5A47F,#A5A47F);
  }
   .money-intro-graph__caption > li:nth-child(3) {
    background-image: linear-gradient(#7E434F,#7E434F);
  }
  .money-intro-block__tbl {
    display: block;
    width: 100%;
    margin: 50px 0;
  }
  .money-intro-block__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-bottom: 10px;
    border-bottom: 1px solid #D3D3D3;
  }
  .money-intro-block__row + .money-intro-block__row {
    padding-top: 10px;
  }
  .money-intro-block__row > dt {
    display: block;
    width: 130px;
    font-size: 16px;
    font-weight: 600;
    line-height: 26px;
    color: #7E434F;
  }
  .money-intro-block__row:nth-child(1) > dt {
    color: #01444D;
  }
  .money-intro-block__row:nth-child(2) > dt {
    color: #A5A47F;
  }
  .money-intro-block__row > dd {
    display: block;
    width: calc(100% - 130px);
    font-size: 15px;
    line-height: 26px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .money-intro-graph__caption {
    width: calc(220/800 * 100%);
  }
}
/*loan*/
@media screen and (max-width:767px) {
  .money-loan {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .money-loan__body {
    display: block;
    width: 100%;
  }
  .money-loan__header {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 44px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .money-loan__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .money-loan__col-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-loan__col-figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .money-loan__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .money-loan__main {
    display: block;
    width: 100%;
  }
  .money-loan-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px;
    border: 1px solid #A5A47F;
    margin-top: 50px;
  }
  .money-loan-box__figure {
    display: block;
    width: 100%;
  }
  .money-loan-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .money-loan-box__content {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .money-loan-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-bottom: 15px;
  }
  .money-loan-box__txt {
    display: block;
    width: 100%;
    font-size: min(14px + (16 - 14) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 28px;
    font-weight: 500;
    text-align: center;
  }
  .money-loan-box__row  {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 15px;
  }
  .money-loan-box__row > dt {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 124px;
    height: 33px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
  }
  .money-loan-box__row.merit > dt {
    border: 1px solid #3D97D5;
    color: #3D97D5;
  }
  .money-loan-box__row.demerit > dt {
    border: 1px solid #A93434;
    color: #A93434;
  }
  .money-loan-box__row > dd {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 22.5px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
    padding-left: 20px;
  }
  .money-loan-box__row > dd::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
  }
  .money-loan-box__row.merit > dd::before {
    background-color: #3D97D5;
  }
  .money-loan-box__row.demerit > dd::before {
    background-color: #A93434;
  }
  .money-loan__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .money-loan {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .money-loan__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .money-loan__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .money-loan__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .money-loan__col-txt {
    display: block;
    width: calc(480/1040 * 100%);
    font-size: 15px;
    line-height: 25px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-loan__col-figure {
    display: block;
    width: calc(510/1040 * 100%);
  }
  .money-loan__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .money-loan__main {
    display: block;
    width: 100%;
  }
  .money-loan-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: calc(40/1040 * 100%) calc(30/1040 * 100%);
    background-color: var(--white);
    margin-top: 50px;
  }
  .money-loan-box__figure {
    display: block;
    width: calc(280/980 * 100%);
  }
  .money-loan-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .money-loan-box__content {
    display: block;
    width: calc(670/980 * 100%);
  }
  .money-loan-box__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 37px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 15px;
  }
  .money-loan-box__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
  }
  .money-loan-box__row  {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-top: 15px;
  }
  .money-loan-box__row > dt {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 124px;
    height: 33px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
  }
  .money-loan-box__row.merit > dt {
    border: 1px solid #3D97D5;
    color: #3D97D5;
  }
  .money-loan-box__row.demerit > dt {
    border: 1px solid #A93434;
    color: #A93434;
  }
  .money-loan-box__row > dd {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 22.5px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
    padding-left: 20px;
  }
  .money-loan-box__row > dd::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
  }
  .money-loan-box__row.merit > dd::before {
    background-color: #3D97D5;
  }
  .money-loan-box__row.demerit > dd::before {
    background-color: #A93434;
  }
  .money-loan__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
/*aid*/
@media screen and (max-width:767px) {
  .money-aid {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .money-aid__body {
    display: block;
    width: 100%;
  }
  .money-aid__header {
    display: block;
    width: 100%;
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 45px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .money-aid__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .money-aid__col-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-aid__col-figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .money-aid__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .money-aid-box {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .money-aid-box__title {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 28.6px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .money-aid-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-aid-box__list {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-top: 30px;
  }
  .money-aid-box__list > li {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
    color: #70634D;
    letter-spacing: 0.07em;
    padding-left: 20px;
    background-image: url(./assets/images/money/checked.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 15px auto;
  }
  .money-aid-box__list > li + li {
    margin-top: 20px;
  }
  .money-aid__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .money-aid {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .money-aid__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .money-aid__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .money-aid__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .money-aid__col-txt {
    display: block;
    width: calc(480/1040 * 100%);
    font-size: 15px;
    line-height: 25px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-aid__col-figure {
    display: block;
    width: calc(510/1040 * 100%);
  }
  .money-aid__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .money-aid-box {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .money-aid-box__title {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .money-aid-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-aid-box__list {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% - 25px);
    margin-left: -25px;
    padding-top: 10px;
  }
  .money-aid-box__list > li {
    display: block;
    width: auto;
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
    color: #70634D;
    letter-spacing: 0.07em;
    padding-left: 20px;
    background-image: url(./assets/images/money/checked.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 15px auto;
    margin: 20px 0 0 25px;
  }
  .money-aid__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
/*cta*/
@media screen and (max-width:767px) {
  .money-cta {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: #01444D;
  }
  .money-cta__body {
    display: block;
    width: 100%;
  }
  .money-cta__main {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .money-cta__header {
    display: block;
    width: 100%;
    font-size: min(20px + (22 - 20) * ((100vw - 320px) / (375 - 320)), 22px);
    font-weight: 500;
    line-height: 40px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
    letter-spacing: 0;
  }
  .money-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-cta__figure {
    display: block;
    width: 100%;
  }
  .money-cta__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .money-cta {
    position: relative;
    display: block;
    width: 100%;
    padding: 80px 0;
    background-color: #01444D;
  }
  .money-cta__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .money-cta__main {
    display: block;
    width: calc(455/1040 * 100%);
  }
  .money-cta__header {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 50px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .money-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .money-cta__btns {
    display: flex;
    width: 100%;
    margin-top: 30px;
  }
  .money-cta__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .money-cta__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .money-cta {
    padding: 80px 0;
  }
  .money-cta__header {
    font-size: 21px;
    line-height: 40px;
    margin-bottom: 20px;
  }
}
/*
PAGE - iso
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .iso-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .iso-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/iso/iso.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 60px;
  }
  .iso-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .iso-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .iso-intro__header > span:nth-child(2) {
    font-size: 32px;
    line-height: 42px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .iso-intro-about {
    display: block;
    width: 100%;
    padding: 50px 0 0;
  }
  .iso-intro-about__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .iso-intro-about__main {
    display: block;
    width: 100%;
  }
  .iso-intro-about__content {
    display: block;
    width: 100%;
  }
  .iso-intro-about__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .iso-intro-about__txt > span {
    color: #01444D;
    font-weight: 600;
  }
  .iso-intro-about__figure {
    display: block;
    max-width: 520px;
    width: 100%;
    margin: 30px auto 0;
    padding: 0 20px;
  }
  .iso-intro-about__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .iso-intro-block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .iso-intro-block__title {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 10px;
    border-left: 3px solid #333333;
    margin-bottom: 30px;
  }
  .iso-intro-block__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .iso-intro-block__col-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .iso-intro-block__col-figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .iso-intro-block__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .iso-intro-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .iso-intro-block__list {
    display: block;
    width: 100%;
    padding: 30px 0 0 0;
  }
  .iso-intro-block__list > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-break: 22px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding: 0 0 0 25px;
  }
  .iso-intro-block__list > li > span {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 20px;
    line-height: 30px;
    color: #A5A47F;
  }
  .iso-intro-block__list > li + li {
    margin-top: 20px;
  }
}
@media screen and (min-width:768px) {
  .iso-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .iso-intro__hgroup {
    display: block;
    width: 100%;
  }
  .iso-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    background-image: url(./assets/images/iso/iso.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
    padding-bottom: 60px;
  }
  .iso-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .iso-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .iso-intro-about {
    display: block;
    width: 100%;
    padding: 50px 0 0;
  }
  .iso-intro-about__title {
    display: block;
    max-width: 900px;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
    margin: 0 auto;
  }
  .iso-intro-about__main {
    position: relative;
    display: block;
    max-width: 1366px;
    width: 100%;
    min-height: 400px;
    margin: 0 auto;
  }
  .iso-intro-about__content {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .iso-intro-about__txt {
    display: block;
    width: calc(450/900 * 100%);
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .iso-intro-about__txt > span {
    color: #01444D;
    font-weight: 600;
  }
  .iso-intro-about__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: calc(633/1366 * 100%);
  }
  .iso-intro-about__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .iso-intro-block {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 50px auto 0;
  }
  .iso-intro-block__title {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .iso-intro-block__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .iso-intro-block__col-txt {
    display: block;
    width: calc(450/900 * 100%);
    font-size: 15px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .iso-intro-block__col-figure {
    display: block;
    width: calc(400/900 * 100%);
  }
  .iso-intro-block__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .iso-intro-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .iso-intro-block__list {
    display: block;
    width: 100%;
    padding: 30px 0 0 30px;
  }
  .iso-intro-block__list > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-break: 22px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding: 7px 0 7px 40px;
  }
  .iso-intro-block__list > li > span {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 25px;
    line-height: 36px;
    color: #A5A47F;
  }
  .iso-intro-block__list > li + li {
    margin-top: 20px;
  }
}
/*ninntei*/
@media screen and (max-width:767px) {
  .iso-certify {
    display: block;
    width: 100%;
    padding-bottom: 50px;
    background-color: #F9F8F6;
  }
  .iso-banner {
    display: block;
    width: 100%;
  }
  .iso-banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .iso-certify__main {
    display: block;
    width: 100%;
    margin: 50px auto 0;
  }
  .iso-certify__header {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 45px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .iso-certify__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .iso-certify__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .iso-certify__figure {
    display: block;
    max-width: 295px;
    width: 100%;
    margin-top: 30px;
  }
  .iso-certify__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .iso-certify {
    display: block;
    width: 100%;
    padding-bottom: 100px;
    background-color: #F9F8F6;
  }
  .iso-banner {
    display: block;
    width: 100%;
  }
  .iso-banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .iso-certify__main {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 100px auto 0;
  }
  .iso-certify__header {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .iso-certify__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .iso-certify__txt {
    display: block;
    width: calc(550/900 * 100%);
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .iso-certify__figure {
    display: block;
    width: calc(300/900 * 100%);
  }
  .iso-certify__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*
PAGE - privacy
--------------------------------------------- */
@media screen and (max-width:767px) {
  .privacy {
    display: block;
    width: 100%;
    padding-top: 50px;
    background-color: var(--white);
  }
  .privacy__body {
    display: block;
    width: 100%;
  }
  .privacy__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .privacy__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .privacy__header > span:nth-child(2) {
    font-size: 32px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .privacy__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .privacy__txt > a {
    color: var(--font-color);
  }
  .privacy__txt > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .privacy__txt + .privacy__txt {
    margin-top: 15px;
  }
  .privacy-box {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .privacy-box__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 37px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 10px;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#DBDBDB,#DBDBDB);
    background-repeat: no-repeat,no-repeat;
    background-position: bottom left, bottom left;
    background-size: 55px 3px, 100% 3px;
    margin-bottom: 20px;
  }
  .privacy-box__subtitle {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    color: #666666;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin: 50px 0 20px;
  }
  .privacy-list {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .privacy-list > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 22.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 35px;
  }
  .privacy-list > li > span {
    position: absolute;
    left: 0;
  }
  .privacy-list > li + li {
    margin-top: 15px;
  }
  .privacy__caption {
    display: block;
    width: 100%;
    font-size: 13px;
    line-height: 23.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 15px;
  }
}
@media screen and (min-width:768px) {
  .privacy {
    display: block;
    width: 100%;
    padding-top: 80px;
    background-color: var(--white);
  }
  .privacy__body {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .privacy__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .privacy__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .privacy__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .privacy__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .privacy__txt > a {
    color: var(--font-color);
  }
  .privacy__txt > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .privacy__txt + .privacy__txt {
    margin-top: 15px;
  }
  .privacy-box {
    display: block;
    width: 100%;
    margin-top: 70px;
  }
  .privacy-box__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 43px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 10px;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#DBDBDB,#DBDBDB);
    background-repeat: no-repeat,no-repeat;
    background-position: bottom left, bottom left;
    background-size: 126px 3px, 100% 3px;
    margin-bottom: 40px;
  }
  .privacy-box__subtitle {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin: 70px 0 30px;
  }
  .privacy-list {
    display: block;
    max-width: 835px;
    width: 100%;
    margin-top: 30px;
  }
  .privacy-list > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 22.5px;
    text-align: justify;
    word-break: break-all;
    padding-left: 35px;
  }
  .privacy-list > li > span {
    position: absolute;
    left: 0;
  }
  .privacy-list > li + li {
    margin-top: 15px;
  }
  .privacy__caption {
    display: block;
    width: 100%;
    font-size: 13px;
    line-height: 23.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 15px;
  }
}
/*
PAGE - history
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .history-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .history-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/history/history.png);
    background-repeat: no-repeat;
    background-position: left top 23px;
    background-size: auto 60px;
  }
  .history-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .history-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .history-intro__header > span:nth-child(2) {
    font-size: 32px;
    line-height: 42px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .history-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding: 50px 0 0;
  }
}
@media screen and (min-width:768px) {
  .history-intro {
    display: block;
    width: 100%;
    padding: 85px 0 50px;
    background-color: var(--white);
  }
  .history-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/history/history.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: auto 150px;
    padding-bottom: 60px;
  }
  .history-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .history-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .history-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .history-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    padding: 30px 0 0;
  }
}
/*main*/
@media screen and (max-width:767px) {
  .history-main {
    display: block;
    width: 100%;
    padding: 30px 0;
    background-color: #F9F8F6;
  }
  .history-main > .container {
    padding: 0 10px;
  }
  .history-timeline {
    display: block;
    width: 100%;
    background-image: url(./assets/images/history/history-bg.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px 100%;
  }
  .history-timeline > li {
    position: relative;
    display: block;
    width: 100%;
    padding: 50px 0 0 35px;
  }
  .history-timeline > li::before {
    content: "";
    position: absolute;
    top: calc(50px + 20px);
    left: 5px;
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    border: 1px solid #A5A47F;
    background-color: var(--white);
  }
  .history-timeline > li::after {
    content: "";
    position: absolute;
    top: calc(50px + 20px + 5px);
    left: calc(5px + 10px);
    display: block;
    width: calc(35px - 5px - 10px);
    height: 1px;
    background-color: #A5A47F;
  }
  .history-timeline__badge {
    display: flex;
    align-items: flex-end;
    width: 100%;
  }
  .history-timeline__badge > span {
    color: #A5A47F;
  }
  .history-timeline__badge > span.year {
    font-size: 40px;
    font-size: 500;
    line-height: 1;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .history-timeline__badge > span.date {
    font-size: 16px;
    font-size: 500;
    line-height: 1;
    letter-spacing: 0.1em;
    padding-left: 20px;
  }
  .history-timeline__title {
    display: block;
    width: 100%;
    font-size:20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .history-timeline__title  > small {
    font-size: 15px;
  }
  .history-timeline__content .history-timeline__title {
    margin-top: 0;
    line-height: 40px;
  }
  .history-timeline__title + .history-timeline__txt {
    margin-top: 30px;
  }
  .history-timeline__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
  }
  .history-timeline__content {
    display: block;
    width: 100%;
  }
  .history-timeline__picture {
    display: block;
    width: 100%;
  }
  .history-timeline__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .history-timeline__block {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    margin-top: 30px;
  }
  .history-timeline__block-title {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 33px;
    border: 1px solid #70634D;
    padding: 5px 20px;
    font-size: 16px;
    font-weight: 500;
    line-height: 22.5px;
    color: #70634D;
  }
  .history-timeline__block-list {
    display: block;
    width: 100%;
    margin-top: 10px;
  }
  .history-timeline__block-list > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 22.5px;
    text-align: justify;
    word-break: break-all;
    padding-left: 25px;
  }
  .history-timeline__block-list > li + li {
    margin-top: 15px;
  }
  .history-timeline__block-list > li::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #70634D;
  }
  .history-timeline__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .history-timeline__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .history-timeline-slide {
    display: block;
    width: 100%;
    padding-left: 20px;
    margin-top: 30px;
  }
  .history-timeline-slide > .swiper-wrapper {
    width: 100%;
    height:  min(175px + (317 - 175) * ((100vw - 320px) / (500 - 320)), 317px);
  }
  .slide1966 > .swiper-wrapper {
    height: min(263.5px + (450 - 263.5) * ((100vw - 320px) / (500 - 320)), 477px);
  }
  .history-timeline-slide > .swiper-slide {
    width: 100%;
  }
  .history-timeline__slide {
    display: block;
    width: 100%;
  }
  .history-timeline__slide > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .history-timeline-slide .swiper-pagination {
    top: 50% !important;
    transform: translateY(-50%);
    left: 0 !important;
    right: auto !important;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 20px !important;
    height: 100%;
  }
  .history-timeline-slide .swiper-pagination-bullet {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: transparent;
    border: 1px solid #A5A47F;
    opacity: 1;
    margin: 6px 0 !important;
  }
  .history-timeline-slide .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #A5A47F;
  }
  .history-timeline__box {
    display: block;
    width: 100%;
    margin-top: 10px;
  }
  .history-timeline__box + .history-timeline__box {
    margin-top: 20px;
  }
  .history-timeline__month {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    color: #A5A47F;
    letter-spacing: 0.1em;
    line-height: 26px;
  }
  .history-timeline > li:last-child {
    padding-bottom: 30px;
  }
  .history-timeline > li:last-child .history-timeline__badge > span.year {
    font-size: 40px;
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) {
  .history-main {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .history-timeline {
    display: block;
    width: 100%;
    background-image: url(./assets/images/history/history-bg.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 30px 100%;
  }
  .history-timeline > li {
    position: relative;
    display: block;
    width: 100%;
    padding: 50px 0 0 120px;
  }
  .history-timeline > li::before {
    content: "";
    position: absolute;
    top: calc(50px + 35px);
    left: 10px;
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    border: 1px solid #A5A47F;
    background-color: var(--white);
  }
  .history-timeline > li::after {
    content: "";
    position: absolute;
    top: calc(50px + 35px + 5px);
    left: calc(10px + 10px);
    display: block;
    width: calc(120px - 20px - 10px);
    height: 1px;
    background-color: #A5A47F;
  }
  .history-timeline__badge {
    display: flex;
    align-items: flex-end;
    width: 100%;
  }
  .history-timeline__badge > span {
    color: #A5A47F;
  }
  .history-timeline__badge > span.year {
    font-size: 70px;
    font-size: 500;
    line-height: 1;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .history-timeline__badge > span.date {
    font-size: 20px;
    font-size: 500;
    line-height: 1;
    letter-spacing: 0.1em;
    padding-left: 20px;
  }
  .history-timeline__title {
    display: block;
    width: 100%;
    font-size: min(26px + (28 - 26) * ((100vw - 1025px) / (1140 - 1025)), 28px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .history-timeline__title  > small {
    font-size: 18px;
  }
  .history-timeline__content .history-timeline__title {
    margin-top: 0;
    line-height: 45px;
    padding-bottom: 30px;
  }
  .history-timeline__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 30px;
  }
  .history-timeline__content {
    display: block;
    width: calc(550/1020 * 100%);
  }
  .history-timeline__picture {
    display: block;
    width: calc(440/1020 * 100%);
  }
  .history-timeline__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .history-timeline__block {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    margin-top: 30px;
  }
  .history-timeline__block-title {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 33px;
    border: 1px solid #70634D;
    padding: 5px 20px;
    font-size: 15px;
    font-weight: 500;
    line-height: 22.5px;
    color: #70634D;
  }
  .history-timeline__block-list {
    display: block;
    width: 100%;
    margin-top: 10px;
  }
  .history-timeline__block-list > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 22.5px;
    text-align: justify;
    word-break: break-all;
    padding-left: 25px;
  }
  .history-timeline__block-list > li + li {
    margin-top: 15px;
  }
  .history-timeline__block-list > li::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #70634D;
  }
  .history-timeline__figure {
    display: block;
    width: 100%;
    padding-left: 20px;
  }
  .history-timeline__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .history-timeline-slide {
    display: block;
    width: 100%;
    padding-left: 20px;
  }
  .history-timeline-slide > .swiper-wrapper {
    width: 100%;
    height:  min(252px + (450 - 252) * ((100vw - 1025px) / (1100 - 1025)), 300px);
  }
  .slide1966 > .swiper-wrapper {
    height: min(378px + (450 - 378) * ((100vw - 1025px) / (1100 - 1025)), 450px);
  }
  .history-timeline-slide > .swiper-slide {
    width: 100%;
  }
  .history-timeline__slide {
    display: block;
    width: 100%;
  }
  .history-timeline__slide > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .history-timeline-slide .swiper-pagination {
    top: 50% !important;
    transform: translateY(-50%);
    left: 0 !important;
    right: auto !important;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 20px !important;
    height: 100%;
  }
  .history-timeline-slide .swiper-pagination-bullet {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: transparent;
    border: 1px solid #A5A47F;
    opacity: 1;
    margin: 6px 0 !important;
  }
  .history-timeline-slide .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #A5A47F;
  }
  .history-timeline__box {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .history-timeline__box + .history-timeline__box {
    margin-top: 50px;
  }
  .history-timeline__month {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    color: #A5A47F;
    letter-spacing: 0.1em;
    line-height: 30px;
  }
  .history-timeline > li:last-child {
    padding-bottom: 30px;
  }

  .history-timeline > li:last-child .history-timeline__badge > span.year {
    font-size: 60px;
    margin-top: 15px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px){
  .history-timeline__title {
    font-size: 18px;
    line-height: 25px;
    letter-spacing: 0.05em;
  }
  .history-timeline__title > small {
    font-size: 14px;
  }
  .history-timeline-slide > .swiper-wrapper {
    width: 100%;
    height: 173px;
  }
  .slide1966 > .swiper-wrapper {
    height: 260px;
  }
}
/*
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .zeh-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .zeh-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .zeh-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    background-image: url(./assets/images/zeh/zeh.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: auto 60px;
  }
  .zeh-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .zeh-intro__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 1;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .zeh-intro__header > span:nth-child(2) > small {
    font-size: 15px;
    line-height: 1;
  }
  .zeh-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-top: 50px;
  }
  .zeh-intro__about {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .zeh-intro__about-body {
    display: block;
    width: 100%;
  }
  .zeh-intro__about-title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 44px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .zeh-intro__about-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .zeh-intro__about-feature {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 30px;
    max-width: 900px;
    width: 100%;
    margin-top: 30px;
  }
  .zeh-intro__about-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .zeh-intro__about-figure {
    display: block;
    width: calc(250/350 * 100%)
  }
  .zeh-intro__about-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .zeh-intro__about-subtitle {
    display: block;
    width: 100%;
    font-size: 27px;
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 40px;
    text-align: center;
    margin: 20px 0;
  }
  .zeh-intro__about-box:nth-child(1) > .zeh-intro__about-subtitle {
    color: #AF3000;
  }
  .zeh-intro__about-box:nth-child(2) > .zeh-intro__about-subtitle {
    color: #206771;
  }
  .zeh-intro__about-box:nth-child(3) > .zeh-intro__about-subtitle {
    color: #547101;
  }
  .zeh-intro__about-calulate {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 185px;
    width: 100%;
    margin: 50px auto 0;
  }
  .zeh-intro__about-calulate_title {
    display: block;
    width: 100%;
    font-size: 27px;
    font-weight: 500;
    letter-spacing: 0.2em;
    line-height: 40px;
    text-align: center;
    padding-bottom: 20px;
  }
  .zeh-intro__about-calulate__figure {
    display: block;
    width: 100%;
  }
  .zeh-intro__about-calulate__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .zeh-intro__target {
    display: block;
    width: 100%;
  }
  .zeh-intro__target-body {
    display: block;
    width: 100%;
  }
  .zeh-intro__target-header {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 44px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .zeh-intro__target-header > small {
    font-size: 16px;
    padding-right: 5px;
  }
  .zeh-intro__target-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .zeh-intro__target-tbl {
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
    border-collapse: collapse;
    border-top: 1px solid #DDDDDD;
  }
  .zeh-intro__target-tbl tr th {
    width: 110px;
    background-color: #F7F7F7;
    padding: 15px 0;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.1em;
    line-height: 20px;
    text-align: center;
    border-bottom: 1px solid #DDDDDD;
  }
  .zeh-intro__target-tbl tr td {
    width: calc(100% - 110px);
    padding: 15px 0;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.1em;
    line-height: 20px;
    text-align: right;
    border-bottom: 1px solid #DDDDDD;
  }
  .zeh-intro__target-tbl_row {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0 5px;
  }
  .zeh-intro__target-tbl_row > dt {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.05em;
    line-height: 20px;
    text-align: center;
  }
  .zeh-intro__target-tbl_row > dd {
    display: block;
    width: 100%;
    padding: 0 20px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.05em;
    line-height: 20px;
    text-align: center;
  }
}
@media screen and (min-width:768px) {
  .zeh-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .zeh-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 100px;
  }
  .zeh-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    background-image: url(./assets/images/zeh/zeh.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .zeh-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .zeh-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .zeh-intro__header > span:nth-child(2) > small {
    font-size: 34px;
  }
  .zeh-intro__txt {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
    margin: 100px auto 0;
  }
  .zeh-intro__about {
    display: block;
    width: 100%;
    padding-bottom: 100px;
  }
  .zeh-intro__about-body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .zeh-intro__about-title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .zeh-intro__about-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .zeh-intro__about-feature {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: calc(50/1040 * 100%);
    max-width: 900px;
    width: 100%;
    margin: 50px auto 0;
  }
  .zeh-intro__about-box {
    display: block;
    width: 100%;
  }
  .zeh-intro__about-figure {
    display: block;
    width: 100%
  }
  .zeh-intro__about-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .zeh-intro__about-subtitle {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 40px;
    text-align: center;
    margin: 20px 0;
  }
  .zeh-intro__about-box:nth-child(1) > .zeh-intro__about-subtitle {
    color: #AF3000;
  }
  .zeh-intro__about-box:nth-child(2) > .zeh-intro__about-subtitle {
    color: #206771;
  }
  .zeh-intro__about-box:nth-child(3) > .zeh-intro__about-subtitle {
    color: #547101;
  }
  .zeh-intro__about-calulate {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 900px;
    width: 100%;
    margin: 100px auto 0;
  }
  .zeh-intro__about-calulate_title {
    display: block;
    width: 110px;
    font-size: 27px;
    font-weight: 500;
    letter-spacing: 0.2em;
    line-height: 40px;
  }
  .zeh-intro__about-calulate__figure {
    display: block;
    width: calc(100% - 110px);
  }
  .zeh-intro__about-calulate__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .zeh-intro__target {
    display: block;
    width: 100%;
  }
  .zeh-intro__target-body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .zeh-intro__target-header {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .zeh-intro__target-header > small {
    font-size: 22px;
    padding-right: 10px;
  }
  .zeh-intro__target-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .zeh-intro__target-tbl {
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
    border-collapse: collapse;
    border-top: 1px solid #DDDDDD;
  }
  .zeh-intro__target-tbl tr th {
    width: 140px;
    background-color: #F7F7F7;
    padding: 15px 20px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.1em;
    line-height: 20px;
    text-align: right;
    border-bottom: 1px solid #DDDDDD;
  }
  .zeh-intro__target-tbl tr td {
    width: calc(100% - 140px);
    padding: 15px 0;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.1em;
    line-height: 20px;
    text-align: right;
    border-bottom: 1px solid #DDDDDD;
  }
  .zeh-intro__target-tbl_row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .zeh-intro__target-tbl_row > dt {
    display: block;
    width: 50%;
    padding: 0 20px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.1em;
    line-height: 20px;
    text-align: left;
  }
  .zeh-intro__target-tbl_row > dd {
    display: block;
    width: 50%;
    padding: 0 20px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.1em;
    line-height: 20px;
    text-align: left;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .zeh-intro__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 54px;
  }
  .zeh-intro__header > span:nth-child(2) > small {
    font-size: 30px;
  }
}
/*zeh-merit*/
@media screen and (max-width:767px) {
  .zeh-merits {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .zeh-merits__header {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 45px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
  }
  .zeh-merits__main {
    display: block;
    width: 100%;
    margin: 50px auto 0;
  }
  .zeh-merit {
    position: relative;
    display: block;
    width: 100%;
    min-height: 351px;
  }
  .zeh-merit + .zeh-merit {
    margin-top: 80px;
  }
  .zeh-merit__figure {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 520px;
    width: 100%;
    padding: 0 20px 35px;
    margin: 0 auto;
  }
  .zeh-merit__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .zeh-merit__figure > .badge {
    position: absolute;
    bottom: 0;
    left: 20px;
    z-index: 1;
    display: block;
    width: 80px;
    height: auto;
    mix-blend-mode: color-burn;
  }
  .zeh-merit__content {
    display: block;
    width: 100%;
    margin-left: auto;
    padding-top: 30px;
  }
  .zeh-merit__title {
    display: block;
    width: 100%;
    font-size: min(24px + (26 - 24) * ((100vw - 320px) / (375 - 320)), 26px);
    font-weight: 500;
    line-height: 38px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .zeh-merit__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .zeh-merit__txt > span {
    font-size: 18px;
    font-weight: 600;
  }
}
@media screen and (min-width:768px) {
  .zeh-merits {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .zeh-merits__header {
    display: block;
    max-width: 1040px;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin: 0 auto;
  }
  .zeh-merits__main {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 50px auto 0;
  }
  .zeh-merit {
    position: relative;
    display: block;
    width: 100%;
    min-height: 351px;
  }
  .zeh-merit + .zeh-merit {
    margin-top: 100px;
  }
  .zeh-merit__figure {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    padding-right: 100px;
  }
  .zeh-merit__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .zeh-merit__figure > .badge {
    position: absolute;
    top: 33px;
    right: 5px;
    z-index: 1;
    display: block;
    width: 120px;
    height: auto;
    mix-blend-mode: color-burn;
  }
  .zeh-merit__content {
    display: block;
    width: 50%;
    padding-right: calc(50/1140 * 100%);
    margin-left: auto;
    padding-top: 80px;
  }
  .zeh-merit__title {
    display: block;
    width: 100%;
    font-size: 34px;
    font-weight: 500;
    line-height: 50px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .zeh-merit__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .zeh-merit__txt > span {
    font-size: 18px;
    font-weight: 600;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .zeh-merit__figure {
    padding-right: 70px;
  }
  .zeh-merit__figure > .badge {
    width: 80px;
  }
  .zeh-merit__content {
    padding-top: 50px;
  }
  .zeh-merit__title {
    font-size: 30px;
    line-height: 40px;
  }
}
/*
PAGE - company
--------------------------------------------- */
@media screen and (max-width:767px) {
  .company {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .company__body {
    display: block;
    width: 100%;
  }
  .company__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .company__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .company__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .company-profile {
    width: 100%;
    border-collapse: collapse;
  }
  .company-profile tr th {
    display: block;
    width: 100%;
    font-size: 17px;
    font-weight: 500;
    letter-spacing: 0.2em;
    color: #A5A47F;
    line-height: 25px;
    padding: 20px 0 10px;
    text-align: left;
    vertical-align: top;
  }
  .company-profile tr td {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 25px;
    padding: 0 0 20px;
    text-align: left;
    border-bottom: 1px solid #EFEFEF;
  }
  .company-profile__row {
    display: block;
    width: 100%;
  }
  .company-profile__row + .company-profile__row {
    margin-top: 15px;
  }
  .company-profile__row > dt {
    position: relative;
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
  }
  .company-profile__row > dt > span {
    position: absolute;
    left: 0;
    color: #A5A47F;
    font-size: 12px;
  }
  .company-profile__row > dt + dt,
  .company-profile__row > dd + dt {
    padding-left: 0;
    color: #A5A47F;
  }
  .company-profile__row > dd {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
  }
  .company-profile tr td a {
    color: var(--font-color);
  }
  .company-profile tr td a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .company-profile__list {
    display: block;
    width: 100%;
  }
  .company-profile__list > li {
    position: relative;
    display: block;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
  }
  .company-profile__list > li + li {
    margin-top: 10px;
  }
  .company-profile__list > li::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #ACACAC;
  }
  .company-iso {
    display: block;
    width: 100%;
    margin-top: 80px;
  }
  .company-iso__title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
    padding-left: 10px;
    border-left: 3px solid #DBDBDB;
  }
  .company-iso__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 20px;
  }
  .company-iso__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    letter-spacing: 0.07em;
    font-weight: 400;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .company-iso__figure {
    display: block;
    width: calc(300/350 * 100%);
    margin-top: 20px;
  }
  .company-iso__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .company-iso__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .company {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .company__body {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .company__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .company__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .company__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .company-profile {
    max-width: 860px;
    width: 100%;
    border-collapse: collapse;
  }
  .company-profile tr th {
    width: 200px;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.2em;
    color: #A5A47F;
    line-height: 26px;
    padding: 30px 0;
    text-align: left;
    border-bottom: 1px solid #EFEFEF;
    vertical-align: top;
  }
  .company-profile tr td {
    width: calc(100% - 200px);
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 26px;
    padding: 30px 0;
    text-align: left;
    border-bottom: 1px solid #EFEFEF;
  }
  .company-profile__row {
    display: block;
    width: 100%;
  }
  .company-profile__row + .company-profile__row {
    margin-top: 15px;
  }
  .company-profile__row > dt {
    position: relative;
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
  }
  .company-profile__row > dt > span {
    position: absolute;
    left: 0;
    color: #A5A47F;
    font-size: 12px;
  }
  .company-profile__row > dt + dt,
  .company-profile__row > dd + dt {
    padding-left: 0;
    color: #A5A47F;
  }
  .company-profile__row > dd {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
  }
  .company-profile tr td a {
    color: var(--font-color);
  }
  .company-profile tr td a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .company-profile__list {
    display: block;
    width: 100%;
  }
  .company-profile__list > li {
    position: relative;
    display: block;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
  }
  .company-profile__list > li::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #ACACAC;
  }
  .company-iso {
    display: block;
    width: 100%;
    margin-top: 80px;
  }
  .company-iso__title {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 40px;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
  }
  .company-iso__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 30px;
  }
  .company-iso__txt {
    display: block;
    width: calc(550/900 * 100%);
    font-size: 15px;
    letter-spacing: 0.07em;
    font-weight: 400;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .company-iso__figure {
    display: block;
    width: calc(300/900 * 100%);
  }
  .company-iso__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .company-iso__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
/*
PAGE - sitemap
--------------------------------------------- */
@media screen and (max-width:767px) {
  .sitemap {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .sitemap__body {
    display: block;
    width: 100%;
  }
  .sitemap__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .sitemap__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .sitemap__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .sitemap-cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .sitemap-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .sitemap-col + .sitemap-col {
    margin-top: 40px;
  }
  .sitemap-col__title {
    display: block;
    width: auto;
    font-size: 17px;
    font-weight: 500;
    line-height: 25px;
    padding-bottom: 15px;
    color: #01444D;
  }
  .sitemap-col__list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    padding-left: 20px;
  }
  .sitemap-col__list + .sitemap-col__title {
    margin-top: 40px;
  }
  .sitemap-col__list > li {
    display: flex;
    align-items: flex-start;
    width: 100%;
  }
  .sitemap-col__list > li + li {
    margin-top: 20px;
  }
  .sitemap-col__list > li > a {
    display: block;
    width: auto;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    color: var(--font-color);
  }
  .sitemap-col__list > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) {
  .sitemap {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .sitemap__body {
    display: block;
    max-width: 860px;
    width: 100%;
    margin: 0 auto;
  }
  .sitemap__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .sitemap__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .sitemap__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .sitemap-cols {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .sitemap-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: auto;
  }
  .sitemap-col__title {
    display: block;
    width: auto;
    font-size: 17px;
    font-weight: 500;
    line-height: 25px;
    padding-bottom: 15px;
    color: #01444D;
  }
  .sitemap-col__list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: auto;
    padding-left: 10px;
  }
  .sitemap-col__list + .sitemap-col__title {
    margin-top: 80px;
  }
  .sitemap-col__list > li {
    display: flex;
    align-items: flex-start;
    width: auto;
  }
  .sitemap-col__list > li + li {
    margin-top: 20px;
  }
  .sitemap-col__list > li > a {
    display: block;
    width: auto;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    color: var(--font-color);
  }
  .sitemap-col__list > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .sitemap-col__list > li > a {
    font-size: 12px;
  }
}
/*
ARCHIVE pagination
--------------------------------------------- */
@media screen and (min-width:0px) {
  .pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 80px;
  }
  .pagination > .page-numbers {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    font-size: 16px;
    line-height: 1;
    font-weight: 500;
    color: #01444D;
    background-color: var(--white);
  }
  .pagination > .page-numbers:nth-child(n+2) {
    margin-left: 15px;
  }
  .pagination > .page-numbers.dots {
    background-color: transparent;
    border: none;
    width: auto;
  }
  .pagination > .page-numbers:hover {
    transition:  opacity 0.3s ease;
    opacity: 0.7;
  }
  .pagination > .page-numbers.current{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    text-align: center;
    background-color:#01444D;
    color: var(--white);
    pointer-events: none;
  }
  .pagination > .prev.page-numbers,
  .pagination > .next.page-numbers {
    display: flex;
    align-items: center;
    width: auto;
    height: 40px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 10px 15px;
  }
  .pagination > .prev.page-numbers {
    padding-left: 14px;
    background-image: url(./assets/images/prev.png);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 6.85px 13.98px;
    margin-right: 10px;
  }
  .pagination > .next.page-numbers {
    padding-right: 14px;
    background-image: url(./assets/images/next.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 6.85px 13.98px;
    margin-left: 10px;
  }
}
@media screen and (max-width:767px) {
  .pagination {
    margin-top: 50px;
  }
}
/*
ARCHIVE - gallery
--------------------------------------------- */
@media screen and (max-width:767px) {
  .gallery-archive {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .gallery-archive__body {
    display: block;
    width: 100%;
  }
  .gallery-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .gallery-archive__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .gallery-archive__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .gallery-archive__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .gallery-archive__nav {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .gallery-archive__nav-title {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    padding-bottom: 30px;
  }
  .gallery-archive__nav-title > span {
    display: block;
    width: auto;
    font-size: 15px;
    font-weight: 500;
    color: #A5A47F;
    line-height: 24px;
    letter-spacing: 0.05em;
  }
  .gallery-archive__nav-list {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 10px;
    row-gap: 10px;
    width: 100%;
  }
  .gallery-archive__nav-list > li {
    display: block;
    width: 100%;
  }
  .gallery-archive__nav-list > li > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 35px;
    border: 1px solid #A5A47F;
    background-color: #F4F4E7;
    font-size: min(12px + (14 - 12) * ((100vw - 320px) / (375 - 320)), 14px);
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.07em;
    color: #A5A47F;
    text-align: center;
  }
  .gallery-archive__nav-list > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery-archive__nav-list > li > a.current {
    pointer-events: none;
    background-color: #A5A47F;
    color: var(--white);
  }
  .gallery-archive__main {
    display: block;
    width: 100%;
    margin-top: 80px;
  }
  .gallery-archive-items {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 40px;
    width: 100%;
  }
  .gallery-archive-item {
    display: block;
    width: 100%;
  }
  .gallery-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery-archive-item__figure {
    display: block;
    width: 100%;
  }
  .gallery-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .gallery-archive-item__area {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    color: #A5A47F;
    line-height: 25px;
    letter-spacing: 0.07em;
    padding: 10px;
  }
  .gallery-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 16px;
    line-height: 22px;
    color: var(--font-color);
    font-weight: 500;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    padding: 0 10px;
  }
}
@media screen and (min-width:768px) {
  .gallery-archive {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .gallery-archive__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .gallery-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .gallery-archive__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .gallery-archive__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .gallery-archive__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
    margin: 0 auto;
  }
  .gallery-archive__nav {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .gallery-archive__nav-title {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    padding-bottom: 30px;
  }
  .gallery-archive__nav-title > span {
    display: block;
    width: auto;
    font-size: 20px;
    font-weight: 500;
    color: #A5A47F;
    line-height: 24px;
    letter-spacing: 0.05em;
  }
  .gallery-archive__nav-list {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-template-rows: auto;
    column-gap: 15px;
    row-gap: 15px;
    width: 100%;
  }
  .gallery-archive__nav-list > li {
    display: block;
    width: 100%;
  }
  .gallery-archive__nav-list > li > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 50px;
    border: 1px solid #A5A47F;
    background-color: #F4F4E7;
    font-size: min(12px + (16 - 12) * ((100vw - 1025px) / (1140 - 1025)), 16px);
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: 0.07em;
    color: #A5A47F;
    text-align: center;
    container-name: menubox;
  }
  @container menubox (min-width: 100px) {
    .gallery-archive__nav-list > li > a {
      font-size: min(8px + (16 - 8) * ((100vw - 768px) / (1140 - 768)), 16px);
    }
  }
  .gallery-archive__nav-list > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery-archive__nav-list > li > a.current {
    pointer-events: none;
    background-color: #A5A47F;
    color: var(--white);
  }
  .gallery-archive__main {
    display: block;
    width: 100%;
    margin-top: 80px;
  }
  .gallery-archive-items {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-template-rows: auto;
    column-gap: calc(25/1040 * 100%);
    row-gap: 50px;
    width: 100%;
  }
  .gallery-archive-item {
    display: block;
    width: 100%;
  }
  .gallery-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery-archive-item__figure {
    display: block;
    width: 100%;
  }
  .gallery-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .gallery-archive-item__area {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    color: #A5A47F;
    line-height: 25px;
    letter-spacing: 0.07em;
    padding: 10px;
  }
  .gallery-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 16px;
    line-height: 22px;
    color: var(--font-color);
    font-weight: 500;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    padding: 0 10px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .gallery-archive__nav-list > li > a {
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.05em;
  }
}
/*
ARCHIVE - gallery_reform
--------------------------------------------- */
@media screen and (max-width:767px) {
  .gallery_reform-archive {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .gallery_reform-archive__body {
    display: block;
    width: 100%;
  }
  .gallery_reform-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .gallery_reform-archive__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .gallery_reform-archive__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .gallery_reform-archive__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .gallery_reform-archive__nav {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .gallery_reform-archive__nav-title {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    padding-bottom: 30px;
  }
  .gallery_reform-archive__nav-title > span {
    display: block;
    width: auto;
    font-size: 15px;
    font-weight: 500;
    color: #A5A47F;
    line-height: 24px;
    letter-spacing: 0.05em;
  }
  .gallery_reform-archive__nav-list {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 10px;
    row-gap: 10px;
    width: 100%;
  }
  .gallery_reform-archive__nav-list > li {
    display: block;
    width: 100%;
  }
  .gallery_reform-archive__nav-list > li > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 35px;
    border: 1px solid #658C90;
    background-color: #EAF0F0;
    font-size: min(10px + (13 - 10) * ((100vw - 320px) / (375 - 320)), 13px);
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.05em;
    color: #658C90;
    text-align: center;
  }
  .gallery_reform-archive__nav-list > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery_reform-archive__nav-list > li > a.current {
    pointer-events: none;
    background-color: #658C90;
    color: var(--white);
  }
  .gallery_reform-archive__main {
    display: block;
    width: 100%;
    margin-top: 80px;
  }
  .gallery_reform-archive-items {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 40px;
    width: 100%;
  }
  .gallery_reform-archive-item {
    display: block;
    width: 100%;
  }
  .gallery_reform-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery_reform-archive-item__figure {
    display: block;
    width: 100%;
  }
  .gallery_reform-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .gallery_reform-archive-item__area {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    color: #658C90;
    line-height: 25px;
    letter-spacing: 0.07em;
    padding: 10px;
  }
  .gallery_reform-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 16px;
    line-height: 22px;
    color: var(--font-color);
    font-weight: 500;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    padding: 0 10px;
  }
}
@media screen and (min-width:768px) {
  .gallery_reform-archive {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .gallery_reform-archive__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .gallery_reform-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .gallery_reform-archive__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .gallery_reform-archive__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .gallery_reform-archive__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
    margin: 0 auto;
  }
  .gallery_reform-archive__nav {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .gallery_reform-archive__nav-title {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    padding-bottom: 30px;
  }
  .gallery_reform-archive__nav-title > span {
    display: block;
    width: auto;
    font-size: 20px;
    font-weight: 500;
    color: #658C90;
    line-height: 24px;
    letter-spacing: 0.05em;
  }
  .gallery_reform-archive__nav-list {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-template-rows: auto;
    column-gap: 15px;
    row-gap: 15px;
    width: 100%;
  }
  .gallery_reform-archive__nav-list > li {
    display: block;
    width: 100%;
  }
  .gallery_reform-archive__nav-list > li > a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 50px;
    border: 1px solid #658C90;
    background-color: #EAF0F0;
    font-size: min(12px + (16 - 12) * ((100vw - 768px) / (1140 - 768)), 16px);
    font-weight: 500;
    line-height: 1.1px;
    letter-spacing: 0.07em;
    color: #658C90;
    container-name: menuboxreform;
  }
  @container menuboxreform (min-width: 100px) {
    .gallery-archive__nav-list > li > a {
      font-size: min(8px + (16 - 8) * ((100vw - 768px) / (1140 - 768)), 16px);
    }
  }
  .gallery_reform-archive__nav-list > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery_reform-archive__nav-list > li > a.current {
    pointer-events: none;
    background-color: #658C90;
    color: var(--white);
  }
  .gallery_reform-archive__main {
    display: block;
    width: 100%;
    margin-top: 80px;
  }
  .gallery_reform-archive-items {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-template-rows: auto;
    column-gap: calc(25/1040 * 100%);
    row-gap: 50px;
    width: 100%;
  }
  .gallery_reform-archive-item {
    display: block;
    width: 100%;
  }
  .gallery_reform-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery_reform-archive-item__figure {
    display: block;
    width: 100%;
  }
  .gallery_reform-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .gallery_reform-archive-item__area {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    color: #658C90;
    line-height: 25px;
    letter-spacing: 0.07em;
    padding: 10px;
  }
  .gallery_reform-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 16px;
    line-height: 22px;
    color: var(--font-color);
    font-weight: 500;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    padding: 0 10px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .gallery_reform-archive__nav-list > li > a {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.02em;
  }
}
/*
ARCHIVE - voice
--------------------------------------------- */
@media screen and (max-width:767px) {
  .post-type-archive-voice .site-footer-cta {
    padding-top: 0;
  }
  .voice-archive {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: #F9F8F6;
  }
  .voice-archive__body {
    display: block;
    width: 100%;
  }
  .voice-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .voice-archive__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .voice-archive__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .voice-archive__main {
    display: block;
    width: 100%;
  }
  .voice-archive-items {
    display: block;
    width: 100%;
  }
  .voice-archive-items > li {
    display: block;
    width: 100%;
    padding-bottom: 20px;
    border-bottom: 1px solid #FFFFFF;
  }
  .voice-archive-items > li:not(:first-child) {
    padding-top: 20px;
  }
  .voice-archive-item {
    display: block;
    width: 100%;
  }
  .voice-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .voice-archive-item__date {
    display: block;
    width: auto;
    font-size: 15px;
    letter-spacing: 0.07em;
    line-height: 20px;
    color: #888888;
  }
  .voice-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    color: var(--font-color);
    font-weight: 500;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) {
  .post-type-archive-voice .site-footer-cta {
    padding-top: 0;
  }
  .voice-archive {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: #F9F8F6;
  }
  .voice-archive__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .voice-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .voice-archive__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .voice-archive__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .voice-archive__main {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .voice-archive-items {
    display: block;
    width: 100%;
  }
  .voice-archive-items > li {
    display: block;
    width: 100%;
    padding-bottom: 20px;
    border-bottom: 1px solid #FFFFFF;
  }
  .voice-archive-items > li:not(:first-child) {
    padding-top: 20px;
  }
  .voice-archive-item {
    display: block;
    width: 100%;
  }
  .voice-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .voice-archive-item__date {
    display: block;
    width: auto;
    font-size: 15px;
    letter-spacing: 0.07em;
    line-height: 20px;
    color: #888888;
  }
  .voice-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 18px;
    line-height: 27px;
    color: var(--font-color);
    font-weight: 500;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    margin-top: 10px;
  }
}
/*
ARCHIVE - blog
--------------------------------------------- */
@media screen and (max-width:767px) {
  .blog-archive {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .blog-archive__body {
    display: block;
    width: 100%;
  }
  .blog-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .blog-archive__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .blog-archive__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
}
@media screen and (min-width:768px) {
  .blog-archive {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .blog-archive__body {
    display: block;
    max-width: 1090px;
    width: 100%;
    margin: 0 auto;
  }
  .blog-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .blog-archive__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .blog-archive__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
}
/*blog layout*/
@media screen and (max-width:1024px) {
  .blog-wrap {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .blog-main {
    display: block;
    width: 100%;
  }
  .blog-sidebar {
    display: block;
    width: 100%;
    margin-top: 60px;
  }
}
@media screen and (min-width:1025px) {
  .blog-wrap {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .blog-main {
    display: block;
    width: calc(100% - 300px - 90px);
  }
  .blog-sidebar {
    display: block;
    width: 300px;
  }
}
/*items*/
@media screen and (max-width:767px) {
  .blog-archive-items {
    display: grid;
    grid-template-columns:repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: calc(20/350 * 100%);
    row-gap: 30px;
    width: 100%;
  }
  .blog-archive-item__link {
    display: block;
    width: 100%;
  }
  .blog-archive-item__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .blog-archive-item__figure {
    display: block;
    width: 100%;
  }
  .blog-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .blog-archive-item__date {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    line-height: 17px;
    letter-spacing: 0.1em;
    color: #01444D;
    padding: 10px 0 5px;
  }
  .blog-archive-item__categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 5px);
    margin-left: -5px;
  }
  .blog-archive-item__category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 20px;
    background-color: #01444D;
    font-size: 10px;
    font-weight: 400;
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 5px;
    margin: 5px 0 0 5px;
  }
  .blog-archive-item__category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .blog-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    color: var(--font-color);
    letter-spacing: 0.07em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .blog-archive-item__title:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) {
  .blog-archive-items {
    display: grid;
    grid-template-columns:repeat(3,1fr);
    grid-template-rows: auto;
    column-gap: calc(20/700 * 100%);
    row-gap: 50px;
    width: 100%;
  }
  .blog-archive-item__link {
    display: block;
    width: 100%;
  }
  .blog-archive-item__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .blog-archive-item__figure {
    display: block;
    width: 100%;
  }
  .blog-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .blog-archive-item__date {
    display: block;
    width: 100%;
    font-size: 12px;
    font-weight: 500;
    line-height: 17px;
    letter-spacing: 0.1em;
    color: #01444D;
    margin-top: 10px;
  }
  .blog-archive-item__categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 5px);
    margin-left: -5px;
  }
  .blog-archive-item__category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 24px;
    background-color: #01444D;
    font-size: 10px;
    font-weight: 400;
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 5px;
    margin: 5px 0 0 5px;
  }
  .blog-archive-item__category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .blog-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 25px;
    color: var(--font-color);
    letter-spacing: 0.07em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-align: justify;
    word-break: break-all;
    margin-top: 15px;
  }
  .blog-archive-item__title:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
/*title*/
@media screen and (min-width:0px) {
  .blog-sidebar__title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 30px;
    padding-bottom: 30px;
  }
  .blog-sidebar__title > small {
    font-size: 12px;
    line-height: 1;
  }
}
/*search form*/
@media screen and (min-width:0px) {
  .blog-search-form {
    display: block;
    width: 100%;
  }
  .searchform {
    display: flex;
    justify-content: space-between;
    max-width: 300px;
    width: 100%;
    height: 40px;
    background-color: var(--white);
    border: 1px solid #ACACAC;
    border-radius: 5px;
  }
  .searchform > button {
    display: block;
    width: 49px;
    height: 38px;
    border: none;
    background-image: url(./assets/images/icon-search.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px auto;
    cursor: pointer;
  }
  .searchform > input[type="text"] {
    width: calc(100% - 49px);
    height: 38px;
    border: none;
    padding: 0 10px;
    font-size: 15px;
    line-height: 38px;
    background: transparent;
  }
  .searchform > input[type="text"]::placeholder {
    color: #ACACAC;
    font-weight: 500;
  }
}
/*ranking*/
@media screen and (min-width:0px) {
  .blog-ranking {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .blog-ranking__items {
    display: block;
    width: 100%;
  }
  .blog-ranking__items > li {
    display: block;
    width: 100%;
    padding: 10px;
  }
  .blog-ranking__items > li + li {
    margin-top: 10px;
  }
  .blog-ranking__item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .blog-ranking__item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .blog-ranking__thumb {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 107px;
    height: 80px;
    overflow: hidden;
  }
  .blog-ranking__thumb > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .blog-ranking__item-title {
    display: -webkit-box;
    width: calc(100% - 107px - 10px);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: var(--font-color);
    letter-spacing: 0.07em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .blog-ranking__items {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 30px;
    row-gap: 30px;
    width: 100%;
  }
  .blog-ranking__items > li + li {
    margin-top: 0;
  }
}
/*categoreis*/
@media screen and (min-width:0px) {
  .blog-sidebar-category {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .blog-sidebar__categories {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    width: calc(100% + 10px);
    margin-left: -10px;
    margin-top: -10px;
  }
  .blog-sidebar__catetory {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 28px;
    background-color: #01444D;
    font-size: 12px;
    /*font-weight: 700;*/
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 10px;
    margin: 10px 0 0 10px;
  }
  .blog-sidebar__catetory:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
/*archives*/
@media screen and (min-width:0px) {
  .blog-sidebar-archives {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .archive-month {
    display: block;
    width: 100%;
    padding-left: 10px;
  }
  .archive-month > li {
    display: flex;
    align-items: center;
    width: 100%;
  }
  .archive-month > li:nth-child(n+2) {
    margin-top: 10px;
  }
  .archive-month > li > a {
    display: block;
    width: auto;
    font-size: 15px;
    line-height: 24px;
    font-weight: 500;
    letter-spacing: 0.07em;
    color: var(--font-color);
  }
  .archive-month > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .archive-nested {
    display: block;
    width: 100%;
    margin-top: 10px;
    padding-left: 10px;
  }
  .archive-nested > li {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .archive-nested > li:nth-child(n+2) {
    margin-top: 10px;
  }
  .archive-nested > li.has_child {
    position: relative;
  }
  .archive-nested > li.has_child > span {
    position: absolute;
    top: 8px;
    right: 45%;
    width: 25px;
    height: 7px;
    background-image: url(./assets/images/archive.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    cursor: pointer;
    transition: transform 0.3s ease-in;
  }
  .archive-nested > li.has_child > span.active {
    transform: rotate(-180deg);
  }
  .archive-nested  > li > a {
    display: block;
    width: auto;
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.07em;
    color: var(--font-color);
  }
  .archive-nested > li > .sub-archive-nested {
    display: none;
    width: 100%;
    padding-left: 10px;
    margin-top: 5px;
  }
  .archive-nested > li > .sub-archive-nested > li {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .archive-nested > li > .sub-archive-nested > li:nth-child(n+2) {
    margin-top: 5px;
  }
  .archive-nested > li > .sub-archive-nested > li > a {
    display: block;
    width: auto;
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.07em;
    color: var(--font-color);
  }
  .archive-nested  > li > a:hover,
  .archive-nested > li > .sub-archive-nested > li > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .blog-archives__wrap {
    max-width: 300px;
  }
}
/*
ARCHIVE - topics
--------------------------------------------- */
@media screen and (max-width:767px) {
  .topics-archive {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: #F9F8F6;
  }
  .topics-archive__body {
    display: block;
    width: 100%;
  }
  .topics-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .topics-archive__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .topics-archive__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .topics-archive__main {
    display: block;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
  }
  .topics-archive-items {
    display: block;
    width: 100%;
  }
  .topics-archive-items > li {
    display: block;
    width: 100%;
    padding: 0 0 20px;
    border-bottom: 1px solid #F5F5F5;
  }
  .topics-archive-items > li:not(:first-child) {
    padding-top: 20px;
  }
  .topics-archive-item {
    display: flex;
    flex-direction: column;
    align-self: flex-start;
    width: 100%;
  }
  .topics-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .topics-archive-item__date {
    display: block;
    width: auto;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 20px;
    color: #01444D;
  }
  .topics-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    color: var(--font-color);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin-top: 5px;
  }
}
@media screen and (min-width:768px) {
  .topics-archive {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: #F9F8F6;
  }
  .topics-archive__body {
    display: block;
    max-width: 1000px;
    width: 100%;
    margin: 0 auto;
  }
  .topics-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .topics-archive__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .topics-archive__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .topics-archive__main {
    display: block;
    width: 100%;
    padding: calc(80/1000 * 100%) calc(120/1000 * 100%);
    background-color: var(--white);
  }
  .topics-archive-items {
    display: block;
    width: 100%;
  }
  .topics-archive-items > li {
    display: block;
    width: 100%;
    padding: 0 20px 20px 20px;
    border-bottom: 1px solid #F5F5F5;
  }
  .topics-archive-items > li:not(:first-child) {
    padding-top: 20px;
  }
  .topics-archive-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .topics-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .topics-archive-item__date {
    display: block;
    width: 130px;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 24px;
    color: #01444D;
  }
  .topics-archive-item__title {
    display: -webkit-box;
    width: calc(100% - 130px);
    font-size: 15px;
    line-height: 25.5px;
    color: var(--font-color);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
}
/*
SINGLE - content
--------------------------------------------- */
@media screen and (max-width:767px) {
  .single-content {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .single-content.single-content__area{
    margin-top:0;
  }
  /*H tag*/
  .single-content:not(:where(.voice-single__content, .single-content__area)) h2,
  .single-content.single-content__area h2:not(:first-child) {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 55px 2px,100% 2px;
  }
  .single-content:not(.voice-single__content) h2:not(:first-child) {
    margin-top: 50px;
  }
  .single-content h3 {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 3px solid #DBDBDB;
  }
  .single-content h3:not(:first-child) {
    margin-top: 50px;
  }
  .single-content h4 {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: #A5A47F;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 5px;
    border-bottom: 1px solid #A5A47F;
  }
  .single-content h4:not(:first-child) {
    margin-top: 50px;
  }
  .single-content h5 {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
    color: #01444D;
    text-align: justify;
    word-break: break-all;
  }
  .single-content h5:not(:first-child) {
    margin-top: 50px;
  }
 .single-content h6 {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
  }
  .single-content h6:not(:first-child) {
    margin-top: 50px;
  }
  /*P tag*/
  .single-content p {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    line-height: 25.5px;
  }
  .single-content p:not(:first-child) {
    margin-top: 30px;
  }
  .single-content p a {
    font-weight: 500;
    text-decoration: underline;
    color: var(--font-color);
  }
  .single-content p a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  /*ul*/
  .single-content ul {
    display: block;
    width: 100%;
    margin: 0 auto;
  }
  .single-content ul > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    font-weight: 500;
  }
  .single-content ul > li:nth-child(n+2){
    margin-top: 15px;
  }
  .single-content ul > li::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    display: block;
    width: 10px;
    height: 10px;
    background-color: #01444D;
    border-radius: 5px;
  }
  .single-content ul:not(:first-child) {
    margin-top: 50px;
  }
  /*ol*/
  .single-content ol {
    display: block;
    width: 100%;
    margin: 0 auto;
  }
  .single-content ol > li {
    position:relative;
    display:block;
    width:100%;
    counter-increment:number;
    line-height:28px;
    text-align: justify;
    word-break: break-all;
    padding: 2px 0 2px 30px;
    font-weight: 500;
  }
  .single-content ol > li + li {
    margin-top: 10px;
  }
  .single-content ol > li:before {
    counter-increment:li;
    content:counter(number,decimal-leading-zero);
    position:absolute;
    top:3px;
    left:0;
    font-size:20px;
    line-height:25px;
    color:#01444D;
    font-weight:400;
  }
  .single-content > ol:not(:first-child){
    margin-top: 50px;
  }
  .single-content.voice-single__content > ol:not(:first-child){
    margin-top: 20px;
    margin-left:1em;
    padding-bottom:20px;
  }
  /*table*/
  .single-content .wp-block-table {
    margin: 0 auto;
    overflow-x: scroll;
    padding-bottom: 20px;
  }
  .single-content .wp-block-table::-webkit-scrollbar {
    background: #D3D3D3;
    width: 10px;
    height: 10px;
  }
  .single-content .wp-block-table::-webkit-scrollbar-thumb {
    background-color: #01444D;
    width: 5px;
  }
  .single-content .wp-block-table table tr td {
    border: 2px solid #E9E9E9;
    background-color: #FBFBFB;
    padding: 20px 15px;
    width: 190px;
  }
  .single-content .wp-block-table table tr:not(:first-child) td {
    border-bottom: 2px solid var(--white);
  }
  .single-content .wp-block-table table tr:last-child td {
    border-bottom: 2px solid #E9E9E9;
  }
  .single-content .wp-block-table table tr:first-child td {
    color: var(--white);
    background-color: #ACACAC;
    font-weight: 500;
  }
  .single-content .wp-block-table table tr td:first-child {
    font-weight: 500;
  }
  /*two-column table*/
  .single-content .wp-block-table.two-column {
    padding-bottom: 0;
    overflow-x: hidden;
    border: 1px solid #D5DCDE;
  }
  .single-content .wp-block-table.two-column table tr:first-child td {
    background-color: transparent;
    color: var(--font-color);
    font-weight: 500;
    text-align: center;
  }
  .single-column__content .wp-block-table.two-column table tr:first-child td {
    background-color: var(--white);
  }
  .single-content .wp-block-table.two-column table tr td {
    border: none;
    background-color: transparent;
    padding: 0 0;
  }
  .single-column__content .wp-block-table.two-column table tr td {
    background-color: var(--white);
  }
  .single-content .wp-block-table.two-column table tr td {
    display: block;
    width: 100%;
    padding: 10px ;
    border-top: 0;
  }
  .single-content .wp-block-table.two-column table tr:not(:last-child) td {
    border-bottom: 1px solid #D5DCDE;
  }
  .single-content .wp-block-table.two-column table tr td:first-child {
    background-color: #F7F7F7;
    border: none;
    font-weight: 500 !important;
    text-align: center;
    border-bottom: 1px solid #D5DCDE;
  }
  .single-content .wp-block-table.two-column table tr td:last-child {
    line-height: 25.5px;
    font-weight: 400;
    text-align: left;
  }
  .single-content .wp-block-table:not(:first-child) {
    margin-top: 50px;
  }
  /*text links*/
  .single-content ul li a,
  .single-content ol li a,
  .single-content table tr td a
  {
    color: var(--font-color);
    font-weight: 600;
    text-decoration: underline;
  }
  .single-content p a:hover,
  .single-content ul li a:hover,
  .single-content ol li a:hover,
  .single-content table tr td a:hover
  {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  /*youtube iframe*/
  .single-content .wp-block-embed__wrapper {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: calc(75% * 0.75);
  }
  .single-content .wp-block-embed__wrapper > iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  /*blocks*/
  .single-content > .wp-block-image:not(:first-child),
  .single-content > .wp-block-columns:not(:first-child),
  .single-content > .wp-block-image:not(:first-child),
  .single-content > .wp-block-gallery:not(:first-child),
  .single-content > .wp-block-embed:not(:first-child),
  .single-content > .wp-block-media-text:not(:first-child) {
    margin-top: 30px;
  }
  /*group*/
  .single-content > .wp-block-group {
    padding: 30px;
    border-radius: 10px;
    border: 1px solid #e5e5e5;
  }
  .single-content > .wp-block-group:not(:first-child) {
    margin-top: 50px;
  }
  /*blockquote*/
  .single-content > .wp-block-quote {
    padding: 30px;
    border-radius: 10px;
    background-color: #f8f8f8;
    border: 1px solid #e5e5e5;
  }
  .single-content > .wp-block-quote:not(:first-child) {
    margin-top: 30px;
  }
  /*detail*/
  .single-content > .wp-block-details > summary {
    font-size: 15px;
    font-weight: 500;
  }
  .single-content > .wp-block-details:not(:first-child) {
    margin-top: 30px;
  }
  .single-content .scroll-txt {
    display:block;
    width: 100%;
    font-size: 13px;
    line-height: 20px;
    margin-top: 10px !important;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) {
  .single-content {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .single-content.single-content__area{
    margin-top:0;
  }
  /*H tag*/
  .single-content:not(:where(.voice-single__content, .single-content__area)) h2,
  .single-content.single-content__area h2:not(:first-child) {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 126px 2px,100% 2px;
  }

  .single-content:not(.voice-single__content) h2:not(:first-child) {
    margin-top: 50px;
  }
  .single-content h3 {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 34px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding-left:20px;
    border-left: 5px solid #DBDBDB;
  }
  .single-content h3:not(:first-child) {
    margin-top: 50px;
  }
  .single-content h4 {
    display: block;
    width: 100%;
    font-size: 22px;
    font-weight: 500;
    line-height: 24px;
    color: #A5A47F;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 5px;
    /* text-decoration: underline;
    text-underline-offset: 8px; */
    border-bottom: 2px solid #A5A47F;
  }
  .single-content h4:not(:first-child) {
    margin-top: 50px;
  }
  .single-content h5 {
    display: block;
    width: 100%;
    font-size: 22px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
    color: #01444D;
    text-align: justify;
    word-break: break-all;
  }
  .single-content h5:not(:first-child) {
    margin-top: 50px;
  }
  .single-content h6 {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
  }
  .single-content h6:not(:first-child) {
    margin-top: 50px;
  }
  /*P tag*/
  .single-content p {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    line-height: 25.5px;
    letter-spacing: 0.07em;
  }
  .single-content p:not(:first-child) {
    /* margin-top: 40px; */
    margin-top: 20px;
  }
  .single-content.voice-single__content p:not(:first-child) {
    padding-bottom: 20px;
    margin-left:1em;
  }
  .single-content p a {
    font-weight: 500;
    text-decoration: underline;
    color: var(--font-color);
  }
  .single-content p a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  /*ul*/
  .single-content ul {
    display: block;
    width: 100%;
    margin: 0 auto;
  }
  .single-content ul > li {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    font-weight: 500;
  }
  .single-content ul > li:nth-child(n+2){
    margin-top: 15px;
  }
  .single-content ul > li::before {
    content: "";
    position: absolute;
    top: 13px;
    left: 0;
    display: block;
    width: 10px;
    height: 10px;
    background-color:#01444D;
    border-radius: 5px;
  }
  .single-content ul:not(:first-child) {
    margin-top: 50px;
  }
  /*ol*/
  .single-content ol {
    display: block;
    width: 100%;
    margin: 0 auto;
  }
  .single-content ol > li {
    position:relative;
    display:block;
    width:100%;
    counter-increment:number;
    font-size: 15px;
    line-height:30px;
    text-align: justify;
    word-break: break-all;
    padding: 0 0 0 37px;
    font-weight: 500;
  }
  .single-content ol > li + li {
    margin-top: 15px;
  }
  .single-content ol > li:before {
    counter-increment:li;
    content:counter(number,decimal-leading-zero);
    position:absolute;
    top:0;
    left:0;
    font-size:20px;
    line-height:30px;
    color:#01444D;
    font-weight:500;
  }
  .single-content > ol:not(:first-child){
    margin-top: 50px;
  }
  .single-content.voice-single__content > ol:not(:first-child){
    margin-top: 20px;
    margin-left:1em;
    padding-bottom:20px;
  }
  /*table*/
  .single-content .wp-block-table {
    margin: 0 auto;
  }
  .single-content .wp-block-table table tr td {
    border: 2px solid #E9E9E9;
    background-color: #FBFBFB;
    padding: 20px 15px;
  }
  .single-content .wp-block-table table tr:not(:first-child) td {
    border-bottom: 2px solid var(--white);
  }
  .single-content .wp-block-table table tr:last-child td {
    border-bottom: 2px solid #E9E9E9;
  }
  .single-content .wp-block-table table tr:first-child td {
    background-color: #ACACAC;
    color: var(--white);
    font-size: 15px;
    text-align: center;
  }
  /*two-column table*/
  /*.single-content .wp-block-table.two-column {
    padding: 20px;
  }*/
  .single-content .wp-block-table.two-column table tr:first-child td {
    background-color: transparent;
    color: var(--font-color);
    font-weight: 400;
  }
  .single-column__content .wp-block-table.two-column table tr:first-child td {
    background-color: red;
  }
  .single-content .wp-block-table.two-column table tr td {
    border: none;
    background-color: transparent;
    padding: 0 0;
    text-align: left;
  }
  .single-column__content .wp-block-table.two-column table tr td {
    background-color: var(--white);
  }
  .single-content .wp-block-table.two-column table tr td {
    padding: 20px;
    vertical-align: middle;
    border-bottom: 1px solid #CECECE;
    line-height: 30px;
  }
  .single-content .wp-block-table.two-column table tr td:first-child {
    width: 180px;
    text-align: center;
    background-color: #F7F7F7;
  }
  .single-content .wp-block-table.two-column table tr:first-child td {
    border-top: 1px solid #CECECE;
  }
  .single-content .wp-block-table:not(:first-child) {
    margin-top: 50px;
  }
  /*text links*/
  .single-content ul li a,
  .single-content ol li a,
  .single-content table tr td a
  {
    color: var(--font-color);
    font-weight: 600;
    text-decoration: underline;
  }
  .single-content p a:hover,
  .single-content ul li a:hover,
  .single-content ol li a:hover,
  .single-content table tr td a:hover
  {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  /*youtube iframe*/
  .single-content .wp-block-embed__wrapper {
    position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: calc(75% * 0.75);
  }
  .single-content .wp-block-embed__wrapper > iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  /*blocks*/
  .single-content > .wp-block-image:not(:first-child),
  .single-content > .wp-block-columns:not(:first-child),
  .single-content > .wp-block-image:not(:first-child),
  .single-content > .wp-block-gallery:not(:first-child),
  .single-content > .wp-block-embed:not(:first-child),
  .single-content > .wp-block-media-text:not(:first-child) {
    margin-top: 50px;
  }
  /*group*/
  .single-content > .wp-block-group {
    padding: 30px;
    border-radius: 20px;
    border: 1px solid #e5e5e5;
  }
  .single-content > .wp-block-group:not(:first-child) {
    margin-top: 50px;
  }
  /*blockquote*/
  .single-content > .wp-block-quote {
    padding: 30px;
    border-radius: 10px;
    background-color: #f8f8f8;
    border: 1px solid #e5e5e5;
  }
  .single-content > .wp-block-quote:not(:first-child) {
    margin-top: 30px;
  }
  /*detail*/
  .single-content > .wp-block-details > summary {
    font-size: 16px;
    font-weight: 500;
  }
  .single-content > .wp-block-details:not(:first-child) {
    margin-top: 30px;
  }
  .single-content .scroll-txt {
    display: none;
  }
}
/*
SINGLE - topics
--------------------------------------------- */
@media screen and (max-width:767px) {
  .topics-single {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: #F9F8F6;
  }
  .topics-single__body {
    display: block;
    width: 100%;
  }
  .topics-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .topics-single__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .topics-single__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .topics-single__main {
    display: block;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
  }
  .topics-single__main {
    display: block;
    width: 100%;
    padding: calc(100/1000 * 100%) calc(70/1000 * 100%);
    background-color: var(--white);
  }
  .topics-single__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 55px 2px,100% 2px;
  }
  .topics-single__date {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 24px;
    padding: 10px 0 0;
  }
  .topics-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .topics-single {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: #F9F8F6;
  }
  .topics-single__body {
    display: block;
    max-width: 1000px;
    width: 100%;
    margin: 0 auto;
  }
  .topics-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .topics-single__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .topics-single__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .topics-single__main {
    display: block;
    width: 100%;
    padding: calc(100/1000 * 100%) calc(70/1000 * 100%);
    background-color: var(--white);
  }
  .topics-single__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 126px 2px,100% 2px;
  }
  .topics-single__date {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 24px;
    padding: 20px 0 0;
  }
  .topics-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
/*
SINGLE - blog
--------------------------------------------- */
@media screen and (max-width:767px) {
  .single-blog-categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 5px);
    margin-left: -5px;
    margin-top: -5px;
    margin-bottom: 20px;
  }
  .single-blog-category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 24px;
    background-color: #888888;
    font-size: 10px;
    font-weight: 400;
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 5px;
    margin: 5px 0 0 5px;
  }
  .single-blog-category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .single-blog__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 55px 2px,100% 2px;
  }
  .single-blog__date {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 24px;
    padding: 20px 0 0;
  }
  .blog-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .single-blog-categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 5px);
    margin-left: -5px;
    margin-top: -5px;
    margin-bottom: 20px;
  }
  .single-blog-category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 24px;
    background-color: #888888;
    font-size: 10px;
    font-weight: 400;
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 5px;
    margin: 5px 0 0 5px;
  }
  .single-blog-category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .single-blog__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 126px 2px,100% 2px;
  }
  .single-blog__date {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 24px;
    padding: 20px 0 0;
  }
  .blog-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
/*
SINGLE - gallery
--------------------------------------------- */
@media screen and (max-width:767px) {
  .gallery-single {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .gallery-single__body {
    display: block;
    width: 100%;
  }
  .gallery-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .gallery-single__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .gallery-single__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .gallery-single-categories {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    width: calc(100% + 5px);
    margin-left: -5px;
    margin-top: -5px;
    padding-bottom: 10px;
    background-image: linear-gradient(#DBDBDB,#DBDBDB);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: calc(100% - 5px) 1px;
  }
  .gallery-single-category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 27px;
    background-color: #A5A47F;
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    padding: 0 15px;
    margin: 5px 0 0 5px;
  }
  .gallery-single-category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery-single-area {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    padding-top: 10px;
  }
  .gallery-single-area > span {
    position: relative;
    display: block;
    width: auto;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 30px;
    color: #A5A47F;
    padding-left: 30px;
    background-image: url(./assets/images/gallery/icon-place.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .gallery-single-title {
    display: block;
    width: 100%;
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .gallery-single-content {
    max-width: 900px;
    margin: 70px auto 0;
  }
  .gallery-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .gallery-single {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .gallery-single__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .gallery-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .gallery-single__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .gallery-single__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .gallery-single-categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 10px);
    margin-left: -10px;
    margin-top: -10px;
    padding-bottom: 20px;
    background-image: linear-gradient(#DBDBDB,#DBDBDB);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: calc(100% - 10px) 1px;
  }
  .gallery-single-category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 40px;
    background-color: #A5A47F;
    /*font-size: 20px;*/
    font-weight: 500;
    color: var(--white);
    padding: 0 20px;
    margin: 10px 0 0 10px;
  }
  .gallery-single-category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery-single-area {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    padding-top: 10px;
  }
  .gallery-single-area > span {
    position: relative;
    display: block;
    width: auto;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 30px;
    color: #A5A47F;
    padding-left: 30px;
    background-image: url(./assets/images/gallery/icon-place.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .gallery-single-title {
    display: block;
    width: 100%;
    font-size: 32px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 46px;
    text-align: center;
    margin-top: 10px;
  }
  .gallery-single-content {
    max-width: 900px;
    margin: 70px auto 0;
  }
  .gallery-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  .two-column.feature {
    max-width: 750px;
    margin: 0 auto;
  }
}
/*gallery*/
@media screen and (max-width:767px) {
  .single-gallary {
    display: block;
    width: calc(100% + 20px);
    margin-top: 30px;
    margin-left: -10px;
  }
  /*main*/
  .frame-wrap {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    padding: 0 20px;
  }
  .frame-wrap .swiper-wrapper {
    width: 100%;
  }
  .frame-wrap .swiper-slide {
    width: 100%;
  }
  .frame-wrap .swiper-slide .swiper-slide__block {
    display: block;
    width: 100%;
  }
  .frame-wrap .swiper-slide .swiper-slide__block picture {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 210px;
    background: #F9F9F2;
    overflow: hidden;
  }
  .frame-wrap .swiper-slide .swiper-slide__block picture img {
    display: block;
    width: auto;
    height: 100%;
    object-fit: cover;
  }
  .frame-wrap .swiper-slide .swiper-slide__block p {
    display: block;
    width:100%;
    text-align: center;
    word-break: break-all;
    font-size: 15px;
    line-height: 32px;
    padding: 20px 0;
  }
  .frame-wrap .swiper-button-prev {
    width: 15px;
    height: 24px;
    left: 0;
    background-image: url(./assets/images/gallery/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);
  }
  .frame-wrap .swiper-button-next {
    width: 15px;
    height: 24px;
    right: 0;
    background-image: url(./assets/images/gallery/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);
  }
  .frame-wrap .swiper-navigation-icon {
    display: none;
  }
  .frame-wrap .swiper-button-next::after,
  .frame-wrap .swiper-button-prev::after {
    font-size: 0;
  }
  /*thumbnail*/
  .thumbnail-wrap {
    display: block;
    width: 100%;
    margin: 20px auto 0 auto;
    padding: 0 10px;
  }
  .thumbnail-wrap .swiper-wrapper {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
    column-gap: 10px;
    row-gap: 10px;
  }
  .thumbnail-wrap .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100% !important;
    cursor: pointer;
  }
  .thumbnail-wrap__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 108px;
    overflow: hidden;
  }
  .thumbnail-wrap__figure > img {
    display: block;
    width: auto;
    height: 100%;
    object-fit: cover;
  }
  .thumbnail-wrap .swiper-slide-thumb-active {
    opacity: 1;
  }
}
@media screen and (min-width:768px) {
  .single-gallary {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  /*main*/
  .frame-wrap {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    padding: 0 50px;
  }
  .frame-wrap .swiper-wrapper {
    width: 100%;
  }
  .frame-wrap .swiper-slide {
    width: 100%;
  }
  .frame-wrap .swiper-slide .swiper-slide__block {
    display: block;
    width: 100%;
  }
  .frame-wrap .swiper-slide .swiper-slide__block picture {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    aspect-ratio: 3/2;
    overflow: hidden;
    background: #F9F9F2;
  }
  .frame-wrap .swiper-slide .swiper-slide__block picture img {
    display: block;
    width: auto;
    height: 100%;
    object-fit: cover;
  }
  .frame-wrap .swiper-slide .swiper-slide__block p {
    display: block;
    width:100%;
    text-align: center;
    word-break: break-all;
    font-size: 15px;
    font-weight: 500;
    line-height: 32px;
    padding: 20px 0;
  }
  .frame-wrap .swiper-button-prev {
    width: 25px;
    height: 40px;
    left: 0;
    background-image: url(./assets/images/gallery/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
  .frame-wrap .swiper-button-next {
    width: 25px;
    height: 40px;
    right: 0;
    background-image: url(./assets/images/gallery/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 5px);
  }
  .frame-wrap .swiper-navigation-icon {
    display: none;
  }
  .frame-wrap .swiper-button-next::after,
  .frame-wrap .swiper-button-prev::after {
    font-size: 0;
  }
  /*thumbnail*/
  .thumbnail-wrap {
    display: block;
    width: 100%;
    margin: 30px auto 0 auto;
    box-sizing: border-box;
  }
  .thumbnail-wrap .swiper-wrapper {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: auto;
    column-gap: 10px;
    row-gap: 10px;
  }
  .thumbnail-wrap .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100% !important;
    cursor: pointer;
  }
  .thumbnail-wrap__figure {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    aspect-ratio: 3/2;
    overflow: hidden;
  }
  .thumbnail-wrap__figure > img {
    display: block;
    width: auto;
    height: 100%;
    object-fit: cover;
  }
  .thumbnail-wrap .swiper-slide-thumb-active {
    opacity: 1;
  }
}
/*
SINGLE - gallery-reform
--------------------------------------------- */
@media screen and (max-width:767px) {
  .gallery-reform-single {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .gallery-reform-single__body {
    display: block;
    width: 100%;
  }
  .gallery-reform-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .gallery-reform-single__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .gallery-reform-single__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .gallery-reform-single-categories {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    width: calc(100% + 5px);
    margin-left: -5px;
    margin-top: -5px;
    padding-bottom: 10px;
    background-image: linear-gradient(#DBDBDB,#DBDBDB);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: calc(100% - 5px) 1px;
  }
  .gallery-reform-single-category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 27px;
    background-color: #708B8E;
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    padding: 0 15px;
    margin: 5px 0 0 5px;
  }
  .gallery-reform-single-category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery-reform-single-area {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    padding-top: 10px;
  }
  .gallery-reform-single-area > span {
    position: relative;
    display: block;
    width: auto;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 30px;
    color: #708B8E;
    padding-left: 30px;
    background-image: url(./assets/images/gallery_reform/icon-place.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .gallery-reform-single-title {
    display: block;
    width: 100%;
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .gallery-reform-single-content {
    max-width: 900px;
    margin: 70px auto 0;
  }
  .gallery-reform-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .gallery-reform-single {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .gallery-reform-single__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .gallery-reform-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .gallery-reform-single__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .gallery-reform-single__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .gallery-reform-single-categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 10px);
    margin-left: -10px;
    margin-top: -10px;
    padding-bottom: 20px;
    background-image: linear-gradient(#DBDBDB,#DBDBDB);
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: calc(100% - 10px) 1px;
  }
  .gallery-reform-single-category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 40px;
    background-color: #708B8E;
    /*font-size: 20px;*/
    font-weight: 500;
    color: var(--white);
    padding: 0 20px;
    margin: 10px 0 0 10px;
  }
  .gallery-reform-single-category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .gallery-reform-single-area {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    padding-top: 10px;
  }
  .gallery-reform-single-area > span {
    position: relative;
    display: block;
    width: auto;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.07em;
    line-height: 30px;
    color: #708B8E;
    padding-left: 30px;
    background-image: url(./assets/images/gallery_reform/icon-place.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .gallery-reform-single-title {
    display: block;
    width: 100%;
    font-size: 32px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 46px;
    text-align: center;
    margin-top: 10px;
  }
  .gallery-reform-single-content {
    max-width: 900px;
    margin: 70px auto 0;
  }
  .gallery-reform-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  .two-column.feature {
    max-width: 750px;
    margin: 0 auto;
  }
}
/*before after*/
@media screen and (max-width:767px) {
  .reform-beforeafter {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 30px;
    width: 100%;
    margin-top: 50px;
  }
  .reform-beforeafter-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: flex-start;
    width: 100%;
  }
  /* .reform-beforeafter-box > picture { */
  .reform-beforeafter-box > div {
    display: block;
    width: calc(237/495 * 100%);
  }
  /* .reform-beforeafter-box > picture > img { */
  .reform-beforeafter-box > div > a > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
    aspect-ratio: 1 / 1;
  }
  /* .reform-beforeafter-box > picture > .caption, */
  .reform-beforeafter-box > div > .caption {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 26px;
    text-align: center;
    color: #01444D;
    padding: 10px 0;
  }
  .reform-beforeafter-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .reform-beforeafter-box__txt > br + br {
    display: none;
  }
}
@media screen and (min-width:768px) {
  .reform-beforeafter {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: calc(50/1040 * 100%);
    row-gap: 50px;
    width: 100%;
    margin-top: 50px;
  }
  .reform-beforeafter-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-content: flex-start;
    width: 100%;
  }
  /* .reform-beforeafter-box > picture { */
  .reform-beforeafter-box > div {
    display: block;
    width: calc(237/495 * 100%);
  }
  /* .reform-beforeafter-box > picture > img { */
  .reform-beforeafter-box > div > a > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
    aspect-ratio: 1 / 1;
  }
  /* .reform-beforeafter-box > picture > .caption, */
  .reform-beforeafter-box > div > .caption{
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 26px;
    text-align: center;
    color: #01444D;
    padding: 10px 0;
  }
  .reform-beforeafter-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .reform-beforeafter-box__txt > br + br {
    display: none;
  }
}
/*
SINGLE - voice
--------------------------------------------- */
@media screen and (max-width:767px) {
  .single-voice .site-footer-cta {
    padding-top: 0;
  }
  .voice-single {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: #F9F8F6;
  }
  .voice-single__body {
    display: block;
    width: 100%;
  }
  .voice-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .voice-single__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .voice-single__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .voice-single__main {
    display: block;
    width: 100%;
  }
  .voice-single__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 55px 2px,100% 2px;
  }
  .voice-single__date {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 24px;
    padding: 10px 0 0;
  }
  .voice-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  /* .voice-single__content .question { */
  .single-content.voice-single__content h2{
    display: block;
    width: 100%;
    font-size: 17px;
    font-weight: 500;
    color: #01444D;
    margin-top: 30px;
    padding-bottom: 10px;
    border-bottom: 1px solid #E2E8ED;
  }
  /* .voice-single__content .question + .answer { */
  .single-content.voice-single__content h2 + p{
    padding: 20px 10px;
    margin-top: 0;
  }
}
@media screen and (min-width:768px) {
  .single-voice .site-footer-cta {
    padding-top: 0;
  }
  .voice-single {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: #F9F8F6;
  }
  .voice-single__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .voice-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .voice-single__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .voice-single__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .voice-single__main {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .voice-single__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 126px 2px,100% 2px;
  }
  .voice-single__date {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 24px;
    padding: 20px 0 0;
  }
  .voice-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  /* .voice-single__content .question { */
  .single-content.voice-single__content h2{
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    color: #01444D;
    /* margin-top: 30px; */
    margin-top: 50px;
    padding-bottom: 20px;
    border-bottom: 1px solid #E2E8ED;
  }
  /* .voice-single__content .question + .answer { */
  .single-content.voice-single__content h2 + .answer{
    padding: 20px;
    margin-top: 0;
  }
}
/*
ARCHIVE - event
--------------------------------------------- */
@media screen and (max-width:767px) {
  .event-archive {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .event-archive__body {
    display: block;
    width: 100%;
  }
  .event-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .event-archive__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .event-archive__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .event-archive__main {
    display: block;
    width: 100%;
  }
  .event-archive-items {
    display: block;
    width: 100%;
  }
  .event-archive-item {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .event-archive-item + .event-archive-item {
    margin-top: 30px;
  }
  .event-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .event-archive-item__tags {
    display: flex;
    align-items: flex-start;
    width: 100%;
  }
  .event-archive-item__status {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 63px;
    height: 30px;
    padding: 0 15px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    color: var(--white);
    letter-spacing: 0.05em;
    margin-right: 10px;
  }
  .event-archive-item__status.new {
    background-color: #C1BC00;
  }
  .event-archive-item__status.finish {
    background-color: #888888;
  }
  .event-archive-item__reserve-sp  {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 72px;
    height: 30px;
    background-color: #01444D;
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.05em;
    line-height: 1;
    margin-right: 15px;
  }
  .event-archive-item__figure {
    display: block;
    width: 100%;
    margin-top: 10px;
  }
  .event-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .event-archive-item__content {
    display: block;
    width: 100%;
    padding: 20px 10px;
  }
  .event-archive-item__badges {
    display: flex;
    align-items: center;
    width: 100%;
  }
  .event-archive-item__reserve {
    display: none;
  }
  .event-archive-item__type {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 31px;
    border: 1px solid var(--font-color);
    font-size: 15px;
    font-weight: 500;
    color: var(--font-color);
    letter-spacing: 0.05em;
    line-height: 1;
    padding: 0 15px;
  }
  .event-archive-item__title {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 30px;
    color: var(--font-color);
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding: 20px 0;
    border-bottom: 1px dashed #DBDBDB;
  }
  .event-archive-item__period {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 21px;
    color: #888888;
    font-weight: 500;
    margin-top: 20px;
    padding-left: 30px;
    background-image: url(./assets/images/event/icon-calander.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .event-archive-item__place {
	  display: block;
    width: 100%;
    font-size: 14px;
    line-height: 30px;
    color: #888888;
    font-weight: 500;
    margin-top: 15px;
    padding-left: 30px;
    background-image: url(./assets/images/event/icon-place.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
}
@media screen and (min-width:768px) {
  .event-archive {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .event-archive__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .event-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .event-archive__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .event-archive__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .event-archive__main {
    display: block;
    max-width: 820px;
    width: 100%;
    margin: 0 auto;
  }
  .event-archive-items {
    display: block;
    width: 100%;
  }
  .event-archive-item {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .event-archive-item + .event-archive-item {
    margin-top: 60px;
  }
  .event-archive-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .event-archive-item__tags {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: flex-start;
    width: 100%;
  }
  .event-archive-item__status {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 27px;
    padding: 0 15px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    color: var(--white);
    letter-spacing: 0.05em;
  }
  .event-archive-item__status.new {
    background-color: #C1BC00;
  }
  .event-archive-item__status.finish {
    background-color: #888888;
  }
  .event-archive-item__reserve-sp {
    display: none;
  }
  .event-archive-item__figure {
    display: block;
    width: calc(200/820 * 100%);
  }
  .event-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .event-archive-item__content {
    display: block;
    width: calc(100% - (200/820 * 100%));
    padding: calc(50/820 * 100%) calc(60/820 * 100%) 0;
  }
  .event-archive-item__badges {
    display: flex;
    align-items: center;
    width: 100%;
  }
  .event-archive-item__reserve {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 31px;
    background-color: #01444D;
    font-size: 15px;
    /*font-weight: 500;*/
    color: var(--white);
    letter-spacing: 0.05em;
    line-height: 1;
    padding: 0 15px;
    margin-right: 15px;
  }
  .event-archive-item__type {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 31px;
    border: 1px solid var(--font-color);
    font-size: 15px;
    font-weight: 500;
    color: var(--font-color);
    letter-spacing: 0.05em;
    line-height: 1;
    padding: 0 15px;
  }
  .event-archive-item__title {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    color: var(--font-color);
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding: 20px 0;
    border-bottom: 1px solid #DBDBDB;
  }
  .event-archive-item__period {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 21px;
    color: #888888;
    font-weight: 500;
    margin-top: 20px;
    padding-left: 30px;
    background-image: url(./assets/images/event/icon-calander.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .event-archive-item__place {
	  display: block;
    width: 100%;
    font-size: 14px;
    line-height: 30px;
    color: #888888;
    font-weight: 500;
    margin-top: 15px;
    padding-left: 30px;
    background-image: url(./assets/images/event/icon-place.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
}
/*
SINGLE - event
--------------------------------------------- */
@media screen and (max-width:767px) {
  .event-single {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .event-single__body {
    display: block;
    width: 100%;
  }
  .event-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .event-single__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .event-single__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .event-single__main {
    display: block;
    width: 100%;
  }
  .event-single__tags {
    display: flex;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 20px;
  }
  .event-single__status {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 63px;
    height: 30px;
    padding: 0 15px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    color: var(--white);
    letter-spacing: 0.05em;
    margin-right: 10px;
  }
  .event-single__status.new {
    background-color: #C1BC00;
  }
  .event-single__status.finish {
    background-color: #888888;
  }
  .event-single__reserve  {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 72px;
    height: 30px;
    background-color: #01444D;
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.05em;
    line-height: 1;
    margin-right: 15px;
  }
  .event-single__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 55px 2px,100% 2px;
    margin-bottom: 20px;
  }
  .event-single__period {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 21px;
    color: #888888;
    font-weight: 500;
    margin-top: 20px;
    padding-left: 30px;
    background-image: url(./assets/images/event/icon-calander.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .event-single__place {
	  display: block;
    width: 100%;
    font-size: 14px;
    line-height: 30px;
    color: #888888;
    font-weight: 500;
    margin-top: 15px;
    padding-left: 30px;
    background-image: url(./assets/images/event/icon-place.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .event-single__btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 50px;
  }
  .event-single__btns > a + a {
    margin-top: 30px;
  }
  .event-single__btns > .reserve-btn > span {
    color: var(--white);
    background-color: #01444D;
  }
}
@media screen and (min-width:768px) {
  .event-single {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .event-single__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .event-single__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .event-single__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .event-single__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .event-single__main {
    display: block;
    max-width: 820px;
    width: 100%;
    margin: 0 auto;
  }
  .event-single__tags {
    display: flex;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 20px;
  }
  .event-single__status {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 63px;
    height: 30px;
    padding: 0 15px;
    font-size: 15px;
    /*font-weight: 700;*/
    line-height: 1;
    color: var(--white);
    letter-spacing: 0.05em;
    margin-right: 10px;
  }
  .event-single__status.new {
    background-color: #C1BC00;
  }
  .event-single__status.finish {
    background-color: #888888;
  }
  .event-single__reserve  {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 72px;
    height: 30px;
    background-color: #01444D;
    font-size: 15px;
    /*font-weight: 500;*/
    color: var(--white);
    letter-spacing: 0.05em;
    line-height: 1;
    margin-right: 15px;
  }
  .event-single__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 126px 2px,100% 2px;
    margin-bottom: 20px;
  }
  .event-single__period {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 21px;
    color: #888888;
    font-weight: 500;
    margin-top: 20px;
    padding-left: 30px;
    background-image: url(./assets/images/event/icon-calander.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .event-single__place {
	  display: block;
    width: 100%;
    font-size: 14px;
    line-height: 30px;
    color: #888888;
    font-weight: 500;
    margin-top: 15px;
    padding-left: 30px;
    background-image: url(./assets/images/event/icon-place.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 20px auto;
  }
  .event-single__btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 50px;
  }
  .event-single__btns > a + a {
    margin-top: 30px;
  }
  .event-single__btns > .reserve-btn > span {
    color: var(--white);
    background-color: #01444D;
  }
}
/*
FORM - main
--------------------------------------------- */
@media screen and (max-width:767px) {
  .site-form {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .site-form__body {
    display: block;
    width: 100%;
  }
  .site-form__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .site-form__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .site-form__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .site-form__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    letter-spacing: 0.07em;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .site-form__mandatory-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    letter-spacing: 0.07em;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .site-form__mandatory-txt > span {
    color: #DE0F0F;
  }
}
@media screen and (min-width:768px) {
  .site-form {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .site-form__body {
    display: block;
    max-width: 970px;
    width: 100%;
    margin: 0 auto;
  }
  .site-form__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .site-form__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .site-form__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .site-form__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    letter-spacing: 0.07em;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .site-form__mandatory-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    letter-spacing: 0.07em;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .site-form__mandatory-txt > span {
    color: #DE0F0F;
  }
}
/*layout*/
@media screen and (max-width:767px) {
  .site-form__wrap {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .form-wrap {
    display: block;
    width: 100%;
  }
  .form-wrap > li {
    display: block;
    width: 100%;
  }
  .form-wrap > li + li {
    margin-top: 20px;
  }
  .input-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .input-label {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 100%;
    padding-bottom: 10px;
  }
  .input-label > .label {
    display: block;
    width: auto;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 23px;
  }
  .input-label > .label > small {
    font-size: 15px;
    line-height: 20px;
  }
  .input-label > .mandatory {
    display: block;
    width: auto;
    font-size: 15px;
    font-weight: 500;
    line-height: 23px;
    color: #DE0F0F;
    padding-left: 5px;
  }
  .input-label > small {
    width: 100%;
    font-size: 12px;
    line-height: 16px;
    color: #DE0F0F;
  }
  .input-field {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    width: 100%;
  }
}
@media screen and (min-width:768px) {
  .site-form__wrap {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .form-wrap {
    display: block;
    width: 100%;
  }
  .form-wrap > li {
    display: block;
    width: 100%;
  }
  .form-wrap > li + li {
    margin-top: 40px;
  }
  .input-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .input-label {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 320px;
    padding-right: 20px;
  }
  .input-label > .label {
    display: block;
    max-width: 230px;
    width: auto;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 26px;
  }
  .input-label > .label > small {
    font-size: 15px;
    line-height: 20px;
  }
  .input-label > .mandatory {
    display: block;
    width: auto;
    font-size: 15px;
    font-weight: 500;
    line-height: 26px;
    color: #DE0F0F;
    padding-left: 10px;
  }
  .input-label > small {
    max-width: 230px;
    width: 100%;
    font-size: 15px;
    line-height: 20px;
    color: #DE0F0F;
  }
  .input-field {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    width: calc(100% - 320px);
  }
}
/*form*/
@media screen and (min-width:0px) {
  .input-field input[type="text"] {
    max-width: 500px;
    width: 100%;
    height: 50px;
    border-radius: 5px;
    background-color: #F5F5F5;
    font-size: 16px;
    font-weight: 500;
    padding: 15px 20px;
    line-height: 20px;
    border: none;
    font-family: var(--noto-sans);
  }
  .input-field input[type="text"]::placeholder {
    color: #888888;
    font-weight: 500;
  }
  /*radio*/
  .checkbox-wrap-column {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .input-field .horizontal-item {
    margin-left: 0 !important;
  }
  .checkbox-wrap-column span + span {
    margin-top: 10px;
  }
  .input-field input[type="checkbox"] {
    display: none;
  }
  .input-field input[type="checkbox"] + span {
    position: relative;
    display: block;
    width: auto;
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    padding-left: 30px;
  }
  .input-field input[type="checkbox"] + span::before {
    content: "";
    position: absolute;
    top: 6px;
    left: 0;
    display: block;
    width: 18px;
    height: 18px;
    background-image: url(./assets/images/checkbox.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  .input-field input[type="checkbox"]:checked + span::after {
    content: "";
    position: absolute;
    top: 6px;
    left: 0;
    display: block;
    width: 18px;
    height: 18px;
    background-image: url(./assets/images/checkedbox.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  /*address*/
  .input-field.address {
    display: flex;
    flex-direction: column;
  }
  .input-field.address > div {
    width: 100%;
  }
  .input-field.address > div:nth-child(n+2){
    margin-top: 20px;
  }
  .zip-block {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
  }
  .field-label {
    display: block;
    width: 30px;
    font-size: 16px;
    line-height: 30px;
    font-weight: 500;
    font-family: var(--noto-sans);
  }
  .zip-block input[name="zip-num"] {
    width: 150px;
  }
  .search-address {
    position: absolute;
    top: 4px;
    left: calc(30px + 150px + 10px);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 102px;
    height: 41px;
    font-size: 15px;
    background-color: #888888;
    color: var(--white);
    font-family: var(--noto-sans);
    font-weight: 500;
    cursor: pointer;
  }
  .search-address:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .input-field select {
    position: relative;
    width: 100%;
    height: 50px;
    border: none;
    font-size: 16px;
    font-weight: 500;
    padding: 15px 35px 15px 20px;
    border-radius: 5px;
    line-height: 20px;
    background-image: url(./assets/images/icon-select.png);
    background-repeat: no-repeat;
    background-position: right 20px center;
    background-size: 14px 8px;
    background-color: #F8F8F8;
    font-family: var(--noto-sans);
  }
  .input-field select:has(option:checked[value=""]) {
    color: #888888;
    font-family: var(--noto-sans);
    font-weight: 500;
  }
  .input-field select[name="prefecture"] {
    max-width: 315px;
  }
  .input-field select[name="move"] {
    max-width: 300px;
  }
  .mail-txt {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 24px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  /*radio*/
  .radio-wrap {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 100%;
  }
  .input-field input[type="radio"] {
    display: none;
  }
  .input-field input[type="radio"] + span {
    position: relative;
    display: block;
    width: auto;
    font-size: 16px;
    line-height: 30px;
    font-weight: 400;
    padding-left: 40px;
  }
  .radio-wrap > span {
    margin-right: calc(50/650 * 100%);
  }
  .input-field input[type="radio"] + span::before {
    content: "";
    position: absolute;
    top: 5px;
    left: 0;
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    border: 1px solid #CDD6DD;
  }
  .input-field input[type="radio"]:checked + span::after {
    content: "";
    position: absolute;
    top: 9px;
    left: 4px;
    display: block;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: var(--font-color);
  }
  .contacts-txt {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 24px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .contacts-txt + .contacts-txt {
    margin-top: 0;
  }
  .contacts-txt > a {
    color: #A5A47F;
    font-weight: 600;
  }
  .contacts-txt > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  /*textarea*/
  .input-field textarea {
    max-width: 500px;
    width: 100%;
    height: 200px;
    border-radius: 5px;
    background-color: #F8F8F8;
    font-size: 16px;
    font-weight: 500;
    padding: 15px 20px;
    line-height: 20px;
    border: none;
    font-family: var(--noto-sans);
    resize: none;
  }
  .input-field textarea::placeholder {
    color: #888888;
    font-weight: 500;
  }
  .form-title {
    display: block;
    width: 100%;
    font-size: 27px;
    font-weight: 500;
    color: #01444D;
    letter-spacing: 0.1em;
    line-height: 40px;
    text-align: justify;
    word-break: break-all;
    padding: 80px 0 50px;
  }
  /*land*/
  .land-block {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .land-txt {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 24px;
    text-align: justify;
    word-break: break-all;
  }
  .land-block-cols {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 100%;
  }
  .land-block-cols > div {
    display: flex;
    align-items: flex-start;
    width: auto;
    margin-top: 10px;
  }
  .land-block-cols > div > label {
    display: block;
    width: auto;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 50px;
    padding-right: 15px;
  }
  .land-block-cols > div > p {
    display: block;
    width: auto;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 50px;
    padding-left: 15px;
  }
  .land-address-has {
    max-width: 180px !important;
  }
  .land-size-has {
    max-width: 100px !important;
  }
  .have-land-address {
    margin-right: calc(40/650 * 100%);
  }
  .land-place-no {
    max-width: 180px !important;
  }
  .land-district-no {
    max-width: 180px !important;
  }
  .no-land-place {
    margin-right: calc(40/650 * 100%);
  }
  .land-block-cols + .land-block-cols {
    margin-top: 10px;
  }
  .land-size-no {
    max-width: 100px !important;
  }
  .checkbox-wrap {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 100%;
    padding-bottom: 10px;
  }
  .checkbox-wrap > span {
    margin-right: calc(40/650 * 100%);
  }
  .checkbox-media {
    display: grid;
    grid-template-columns: calc(370/650 * 100%) calc(280/650 * 100%);
    grid-template-rows: auto;
    width: 100%;
    padding-bottom: 10px;
  }
  .checkbox-know {
    display: grid;
    grid-template-columns: calc(160/500 * 100%) calc(210/500 * 100%) calc(130/500 * 100%);
    grid-template-rows: auto;
    max-width: 500px;
    width: 100%;
    padding-bottom: 10px;
  }
  .input-field .error {
    display: block;
    width: 100%;
    color: #DE0F0F;
    font-size: 14px;
    line-height: 1;
    font-family: var(--noto-sans);
    margin-top: 10px;
  }
  /*agree*/
  .form-agree {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 80px;
  }
  .field-agree-checkbox__txt.confirm {
    display: none;
  }
  .field-agree-checkbox {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    align-items: flex-start;
    max-width: 330px;
    width: auto;
  }
  .field-agree-checkbox .mwform-checkbox-field  {
    order: 1;
  }
  .field-agree-checkbox .field-agree-checkbox__txt {
    order: 2;
  }
  .field-agree-checkbox .error  {
    order: 3;
    display: block;
    width: 100%;
    color: #DE0F0F;
    font-size: 14px;
    line-height: 1;
    font-family: var(--noto-sans);
    margin-top: 10px;
  }
  .agree {
    display: none;
  }
  .agree + span {
    position: relative;
    display: flex;
    align-items: center;
    width: 20px;
    height: 20px;
    font-size: 15px;
    line-height: 20px;
    padding: 0 0 0 30px;
    overflow: hidden;
  }
  .agree + span::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(./assets/images/checkbox.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  .agree:checked + span::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(./assets/images/checkedbox.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
  .field-agree-checkbox__txt {
    display: block;
    width: calc(100% - 30px);
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0.08em;
    text-align: justify;
    word-break: break-all;
  }
  .field-agree-checkbox__txt > a {
    color: #A5A47F;
  }
  .field-agree-checkbox__txt > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (max-width:767px) {
  .radio-wrap > span {
    margin-right: 10px;
  }
  .input-field input[type="radio"] + span {
    padding-left: 25px;
  }
  .input-field textarea {	
    padding: 10px;
    line-height: 2;
    height: 220px;
  }
  .form-title {
    font-size: 20px;
    line-height: 30px;
    padding: 50px 0 30px;
  }
  .checkbox-media {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    width: 100%;
    padding-bottom: 10px;
  }
  .checkbox-know {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    width: 100%;
    padding-bottom: 10px;
  }
  .checkbox-wrap > span {
    width: 33.333333%;
    margin-right: 0;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .form-title {
    font-size: 25px;
  }
  .input-field input[type="checkbox"] + span {
    font-size: 14px;
  }
  .checkbox-media {
    grid-template-columns: calc(420/650 * 100%) calc(230/650 * 100%);
  }
}
/*btn*/
@media screen and (min-width:0px) {
  .confirm-btn,
  .back-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 280px;
    height: 51px;
    border: 1px solid var(--font-color);
    cursor: pointer;
  }
  .confirm-btn > span,
  .back-btn > span {
    font-size: 15px;
    font-weight: 500;
    left: 0.07em;
    line-height: 1;
    color: var(--font-color);
  }
  .confirm-btn:hover,
  .back-btn:hover {
    transition: 0.3s ease;
    border: 1px solid var(--font-color);
    opacity: 0.85;
  }
  .submit-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 280px;
    height: 51px;
    background-color: var(--font-color);
    cursor: pointer;
  }
  .submit-btn > span {
    font-size: 15px;
    font-weight: 500;
    left: 0.07em;
    line-height: 1;
    color: var(--white);
  }
  .submit-btn > span:hover {
    transition: 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (max-width:767px) {
  .form-btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 50px;
  }
  .form-btns > button + button {
    margin-top: 25px;
  }
}
@media screen and (min-width:768px) {
  .form-btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  .form-btns > button + button {
    margin-left: calc(70/970 * 100%);
  }
}
/*confirm*/
@media screen and (min-width:0px) {
  .site-form__wrap.confirm .input-field {
    font-family: var(--noto-sans);
    font-size: 16px;
    font-weight: 500;
  }
  .site-form__wrap.confirm .search-address,
  .site-form__wrap.confirm .mail-txt,
  .site-form__wrap.confirm .contacts-txt,
  .site-form__wrap.confirm .site-form__wrap.confirm .contacts-txt,
  .site-form__wrap.confirm .field-agree-checkbox {
    display: none;
  }
  .site-form__wrap.confirm .land-block-cols > div > label,
  .site-form__wrap.confirm .land-block-cols > div > p {
    line-height: 27.2px;
  }
  .site-form__wrap.confirm .checkbox-know {
    max-width: 100%;
  }
  .site-form__wrap.confirm .field-agree-checkbox__txt.confirm {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0.08em;
    text-align: center;
  }
  .site-form__wrap.confirm .field-agree-checkbox__txt.confirm > a {
    color: #A5A47F;
  }
  .site-form__wrap.confirm .field-agree-checkbox__txt.confirm > a:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
/*thanks*/
@media screen and (max-width:7687px) {
  .site-form-thanks__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    letter-spacing: 0.07em;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .site-form-thanks__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  .site-form-thanks__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 280px;
    height: 51px;
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
    color: var(--font-color);
    border: 1px solid var(--font-color);
  }
  .site-form-thanks__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) {
  .site-form-thanks__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    letter-spacing: 0.07em;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .site-form-thanks__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  .site-form-thanks__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 280px;
    height: 51px;
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
    color: var(--font-color);
    border: 1px solid var(--font-color);
  }
  .site-form-thanks__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
/*
FORM - books
--------------------------------------------- */
@media screen and (max-width:767px) {
  .books-columns {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 70px;
    width: 100%;
    margin-top: 70px;
  }
  .books-box {
    position: relative;
    display: block;
    width: 100%;
    background-color: #F5F5F5;
    padding: 40px 20px 20px;
  }
  .books-box__badge {
    position: absolute;
    top: -40px;
    right: 0;
    display: block;
    width: auto;
    font-size: 75px;
    line-height: 1;
    color: #DDDDDD;
    font-weight: 500;
  }
  .books-box__figure {
    display: block;
    width: 100%;
  }
  .books-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .books-box__title {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    line-height: 28.5px;
    letter-spacing: 0.05em;
    text-align: center;
    padding: 20px 0 0;
  }
  .books-box__txt {
    display: block;
    width: 100%;
    font-size: 13px;
    font-weight: 500;
    line-height: 21.5px;
    letter-spacing: 0.05em;
    text-align: center;
    padding: 10px 0 0;
  }
}
@media screen and (min-width:768px) {
  .books-columns {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: calc(30/970 * 100%);
    width: 100%;
    margin-top: 60px;
  }
  .books-box {
    position: relative;
    display: block;
    width: 100%;
    background-color: #F5F5F5;
    padding: 45px 15px 35px;
  }
  .books-box__badge {
    position: absolute;
    top: -40px;
    right: 0;
    display: block;
    width: auto;
    font-size: 75px;
    line-height: 1;
    color: #DDDDDD;
    font-weight: 500;
  }
  .books-box__figure {
    display: block;
    width: 100%;
  }
  .books-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .books-box__title {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    line-height: 28.5px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding: 20px 5px 0;
  }
  .books-box__txt {
    display: block;
    width: 100%;
    font-size: 13px;
    font-weight: 500;
    line-height: 21.5px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding: 10px 5px 0;
  }
}
/*
FORM - reserve
--------------------------------------------- */
@media screen and (max-width:767px) {
  .place-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .place-wrap span + span {
    margin-top: 20px;
  }
  .place-wrap input[type="text"] {
    max-width: calc(500px - 25px);
    margin: 10px 0 0 25px;
  }
  .place-wrap input[type="text"] + span {
    margin-top: 20px;
  }
  .place-wrap img {
    display: block;
    max-width: 460px;
    width: calc(100% - 25px);
    margin: 10px 0 0 25px;
    object-fit: cover;
  }
  .place-wrap img + span {
    margin-top: 20px;
  }
  .place-wrap .error {
    order: 11;
  }
}
@media screen and (min-width:768px) {
  .place-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .place-wrap span + span {
    margin-top: 20px;
  }
  .place-wrap input[type="text"] {
    max-width: calc(500px - 40px);
    margin: 10px 0 0 40px;
  }
  .place-wrap input[type="text"] + span {
    margin-top: 20px;
  }
  .place-wrap img {
    display: block;
    max-width: 230px;
    width: calc(100% - 40px);
    margin: 10px 0 0 40px;
    object-fit: cover;
  }
  .place-wrap img + span {
    margin-top: 20px;
  }
  .place-wrap .error {
    order: 11;
  }
}
/*reserve day*/
@media screen and (max-width:767px) {
  .date-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
  }
  .date-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
    align-items: flex-start;
  }
  .date-box + .date-box {
    margin-top: 20px;
  }
  .date-box > p {
    display: block;
    width: 80px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 50px;
  }
  .date-box > .reserve {
    width: calc(100% - 80px);
  }
  .date-box > .day {
    width: calc(100% - 80px);
    margin-left: auto;
    margin-top: 20px;
  }
  .input-field .hasDatepicker {
    padding-left: 50px !important;
    background-image: url(./assets/images/icon-calendar.png);
    background-repeat: no-repeat;
    background-position: left 20px center;
    background-size: 20px auto;
  }
}
@media screen and (min-width:768px) {
  .date-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 500px;
    width: 100%;
  }
  .date-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: flex-start;
  }
  .date-box + .date-box {
    margin-top: 20px;
  }
  .date-box > p {
    display: block;
    width: 80px;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.04em;
    line-height: 50px;
  }
  .date-box > .reserve {
    width: calc(100% - 80px - 200px - 20px);
  }
  .date-box > .day {
    width: 200px;
  }
  .input-field .hasDatepicker {
    padding-left: 50px !important;
    background-image: url(./assets/images/icon-calendar.png);
    background-repeat: no-repeat;
    background-position: left 20px center;
    background-size: 20px auto;
  }
}
/*confirm*/
@media screen and (min-width:0px) {
  .site-form__wrap.confirm img {
    display: none;
  }
  .site-form__wrap.confirm .date-box > p {
    line-height: 27.2px;
  }
  .site-form__wrap.confirm .checkbox-know {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    max-width: 100%;
    width: 100%;
  }
}
/*
PAGE - model1
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .model1-intro {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .model1-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 50px;
    background-image: url(./assets/images/model1/model.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: auto 53px;
  }
  .model1-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model1-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .model1-intro__header > span:nth-child(2) {
    display: block;
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (390 - 320)), 30px);
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .model1-intro__header > span:nth-child(2) > small {
    font-size: min(14px + (18 - 14) * ((100vw - 320px) / (390 - 320)), 18px);
    line-height: 20px;
  }
  .model1-intro__banner {
    display: block;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .model1-intro__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model1-intro-block {
    display: block;
    width: 100%;
    padding: 30px 0;
  }
  .model1-intro-block__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 20px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 50px 1px;
  }
  .model1-intro-block__title > span:nth-child(1) {
    font-size: min(22px + (28 - 22) * ((100vw - 320px) / (390 - 320)), 28px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model1-intro-block__title > span:nth-child(2) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    letter-spacing: 0.2em;
    margin-top: 5px;
  }
  .model1-intro-block__subtitle {
    display: block;
    width: 100%;
    font-size: min(26px + (30 - 26) * ((100vw - 320px) / (375 - 320)), 30px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .model1-intro-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .model1-intro {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .model1-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 50px;
    background-image: url(./assets/images/model1/model.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 153.2px;
  }
  .model1-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model1-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .model1-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .model1-intro__header > span:nth-child(2) > small {
    font-size: 34px;
  }
  .model1-intro__banner {
    display: block;
    width: 100%;
  }
  .model1-intro__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model1-intro-block {
    display: block;
    width: 100%;
    padding: calc(50/1140* 100%);
  }
  .model1-intro-block__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 30px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 50px 1px;
  }
  .model1-intro-block__title > span:nth-child(1) {
    font-size: 50px;
    font-weight: 500;
    line-height: 60px;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model1-intro-block__title > span:nth-child(2) {
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0.2em;
    margin-top: 5px;
  }
  .model1-intro-block__subtitle {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .model1-intro-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .model1-intro-block__title > span:nth-child(1) {
    font-size: 38px;
  }
  .model1-intro-block__subtitle {
    font-size: 30px;
  }
}
/*reserve*/
@media screen and (max-width:767px) {
  .model1-reserve1 {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .model1-reserve2 {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .model1-reserve__link {
    position: relative;
    display: block;
    width: 100%;
  }
  .model1-reserve__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .model1-reserve__link-title {
    position: absolute;
    bottom: 10px;
    right: 0;
    display: flex;
    flex-direction: column;
    width: auto;
    padding:0 10px 0 20px;
    border-left: 1px solid var(--white);
    color: var(--white);
  }
  .model1-reserve__link-title > span:nth-child(1) {
    font-size: 15px;
    line-height: 20px;
  }
  .model1-reserve__link-title > span:nth-child(2) {
    font-size: 24px;
    line-height: 30px;
    margin-top: 10px;
  }
  .model1-reserve__link-figure {
    display: block;
    width: 100%;
  }
  .model1-reserve__link-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .model1-reserve1 {
    display: block;
    width: 100%;
    padding: 50px 0 100px;
    background-color: var(--white);
  }
  .model1-reserve2 {
    display: block;
    width: 100%;
    padding: 100px 0 0;
    background-color: var(--white);
  }
  .model1-reserve__link {
    position: relative;
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model1-reserve__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .model1-reserve__link-title {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    width: calc(400/1040 * 100%);
    padding-left: calc(50/1040 * 100%);
    border-left: 1px solid var(--white);
    color: var(--white);
  }
  .model1-reserve__link-title > span:nth-child(1) {
    font-size: 18px;
    line-height: 20px;
  }
  .model1-reserve__link-title > span:nth-child(2) {
    font-size: 33px;
    line-height: 40px;
    margin-top: 10px;
  }
  .model1-reserve__link-figure {
    display: block;
    width: 100%;
  }
  .model1-reserve__link-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .model1-reserve__link-title {
    width: calc(550/1040 * 100%);
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .model1-feature {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .model1-feature .container {
    max-width: 100%;
    padding: 0;
  }
  .model1-feature__body {
    display: block;
    width: 100%;
  }
  .model1-feature__header {
    display: flex;
    flex-direction: column;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
  .model1-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model1-feature__header > span:nth-child(2) {
    font-size: 28px;
    line-height: 36px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model1-feature__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .model1-feature-box {
    display: block;
    width: 100%;
    background-image: linear-gradient(#F5F5F5,#F5F5F5);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 100% calc(100% - 100px);
  }
  .model1-feature-box + .model1-feature-box {
    margin-top: 80px;
  }
  .model1-feature-box__flex {
    display: flex;
    flex-direction: column;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
  .model1-feature-box__flex img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model1-feature-box__figure1 {
    display: block;
    width: calc(208.13/335 * 100%);
  }
  .model1-feature-box:nth-child(even) .model1-feature-box__flex .model1-feature-box__figure1 {
    margin-left: auto;
  }
  .model1-feature-box__figure2 {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .model1-feature-box__content {
    display: block;
    max-width: 520px;
    width: 100%;
    padding: 30px 20px;
    margin: 0 auto;
  }
  .model1-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model1-feature-box__title > span:nth-child(1) {
    font-size: min(23px + (28 - 23) * ((100vw - 320px) / (375 - 320)), 28px);
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model1-feature-box__title > span:nth-child(2) {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .model1-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .model1-feature-box__figure-fullwidth {
    display: block;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
  .model1-feature-box__figure-fullwidth > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .model1-feature {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .model1-feature__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model1-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model1-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model1-feature__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model1-feature__main {
    display: block;
    width: 100%;
    margin-top: 100px;
  }
  .model1-feature-box {
    display: block;
    width: 100%;
  }
  .model1-feature-box + .model1-feature-box {
    margin-top: 100px;
  }
  .model1-feature-box__flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background-image: linear-gradient(#F5F5F5,#F5F5F5);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: calc(990/1040 * 100%) 100px;
  }
  .model1-feature-box:nth-child(even) .model1-feature-box__flex {
    flex-direction: row-reverse;
  }
  .model1-feature-box__flex img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model1-feature-box__figure1 {
    display: block;
    width: calc(390/1040 * 100%);
  }
  .model1-feature-box__figure2 {
    display: block;
    width: calc(600/1040 * 100%);
  }
  .model1-feature-box__content {
    display: block;
    width: calc(990/1040 * 100%);
    padding: 30px calc(50/1040 * 100%);
    background-color: #F5F5F5;
  }
  .model1-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model1-feature-box__title > span:nth-child(1) {
    font-size: 50px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model1-feature-box__title > span:nth-child(2) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .model1-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .model1-feature-box__figure-fullwidth {
    display: block;
    width: 100%;
  }
  .model1-feature-box__figure-fullwidth > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .model1-feature__header > span:nth-child(2) {
    font-size: 36px;
  }
  .model1-feature-box__title > span:nth-child(1) {
    font-size: 40px;
    line-height: 50px;
  }
}
/*location*/
@media screen and (max-width:767px) {
  .model1-location {
    display: block;
    width: 100%;
    padding-top: 50px;
    background-color: #F9F8F6;
  }
  .model1-location__body {
    display: block;
    width: 100%;
  }
  .model1-location__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model1-location__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model1-location__header > span:nth-child(2) {
    font-size: min(23px + (26 - 23) * ((100vw - 320px) / (375 - 320)), 26px);
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model1-location__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 20px;
  }
  .model1-location__tbl {
    width: 100%;
  }
  .model1-location__tbl tr th {
    width: 80px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: #01444D;
    padding: 10px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
    vertical-align: text-top;
  }
  .model1-location__tbl tr td {
    width: calc(100% - 80px);
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    padding: 10px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
  }
  .model1-location__figure {
    width: 100%;
    margin-top: 30px;
  }
  .model1-location__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .model1-location {
    display: block;
    width: 100%;
    padding-top: 100px;
    background-color: #F9F8F6;
  }
  .model1-location__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model1-location__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model1-location__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model1-location__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model1-location__main {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
  .model1-location__tbl {
    width: calc(495/1040 * 100%);
  }
  .model1-location__tbl tr th {
    width: 100px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: #01444D;
    padding: 20px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
    vertical-align: text-top;
  }
  .model1-location__tbl tr td {
    width: calc(100% - 100px);
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    padding: 20px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
  }
  .model1-location__figure {
    width: calc(495/1040 * 100%);
  }
  .model1-location__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*access*/
@media screen and (max-width:767px) {
  .model1-access {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .model1-access__body {
    display: block;
    width: 100%;
  }
  .model1-access__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model1-access__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model1-access__header > span:nth-child(2) {
    font-size: min(23px + (26 - 23) * ((100vw - 320px) / (375 - 320)), 26px);
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model1-access__map {
    display: block;
    width: 100%;
    height: 335px;
    overflow: hidden;
    margin-top: 30px;
  }
  .model1-access__map > iframe {
    width: 100%;
    height: 100%;
  }
  .model1-access__block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .model1-access__block > dt {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    padding-left: 15px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    border-left: 5px solid #DBDBDB;
  }
  .model1-access__block > dd {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .model1-access__block > dd > p {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
  }
  .model1-access__block > dd > p + p {
    margin-top: 20px;
  }
  .model1-access__block > dd > p::before {
    content: "";
    position: absolute;
    top: 13px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #A5A47F;
  }
}
@media screen and (min-width:768px) {
  .model1-access {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .model1-access__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model1-access__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model1-access__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model1-access__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model1-access__map {
    display: block;
    width: 100%;
    height: 400px;
    overflow: hidden;
    margin-top: 50px;
  }
  .model1-access__map > iframe {
    width: 100%;
    height: 100%;
  }
  .model1-access__block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .model1-access__block > dt {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    padding-left: 15px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    border-left: 5px solid #DBDBDB;
  }
  .model1-access__block > dd {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .model1-access__block > dd > p {
    position: relative;
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
  }
  .model1-access__block > dd > p + p {
    margin-top: 20px;
  }
  .model1-access__block > dd > p::before {
    content: "";
    position: absolute;
    top: 13px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #A5A47F;
  }
}
/*
PAGE - super_insulated
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .super_insulated-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-image: url(./assets/images/super_insulated/super_insulated.png);
    background-repeat: no-repeat;
    background-position: top 55px center;
    background-size: auto 53px;
  }
  .super_insulated-intro__body {
     display: block;
     width: 100%;
  }
  .super_insulated-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .super_insulated-intro__header > span:nth-child(1) {
    font-size: min(15px + (16 - 15) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .super_insulated-intro__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .super_insulated-intro__txt {
    display: block;
    width: 100%;
    font-size: min(14px + (16 - 14) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .super_insulated-intro {
    display: block;
    width: 100%;
    padding: 85px 0 50px;
    background-image: url(./assets/images/super_insulated/super_insulated.png);
    background-repeat: no-repeat;
    background-position: left top 85px;
    background-size: auto 153.2px;
  }
  .super_insulated-intro__body {
     display: block;
     max-width: 1040px;
     width: 100%;
     margin: 0 auto;
  }
  .super_insulated-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .super_insulated-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .super_insulated-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .super_insulated-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-top: 90px;
  }
}
/*about*/
@media screen and (max-width:767px) {
  .super_insulated-about {
    display: block;
    width: 100%;
    padding: 0 0 50px;
  }
  .super_insulated-about__body {
    display: block;
    width: 100%;
  }
  .super_insulated-about__header {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 37px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .super_insulated-about__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    font-weight: 400;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .super_insulated-about__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .super_insulated-about__memo {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
    padding-left: 20px;
  }
  .super_insulated-about__memo > span {
    position: absolute;
    left: 0;
  }
  .super_insulated-about__content {
    display: block;
    width: 100%;
  }
  .super_insulated-about__box {
    display: block;
    width: 100%;
    padding-top: 50px;
  }
  .super_insulated-about__title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 3px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .super_insulated-about__cols {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .super_insulated-about__col {
    display: block;
    width: 100%;
  }
  .super_insulated-about__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .super_insulated-about__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .super_insulated-about__col-figure {
    display: block;
    width: 100%;
    margin: 30px auto 0;
  }
  .super_insulated-about__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .super_insulated-about__block {
    display: block;
    width: 100%;
    margin: 30px auto 0;
    padding: 30px 10px;
    background-color: #F9F8F6;
  }
  .super_insulated-about__block > li {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .super_insulated-about__block > li + li {
    margin-top: 40px;
  }
  .super_insulated-about__block-figure {
    display: block;
    width: 100%;
  }
  .super_insulated-about__block-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
    background-color: #F9F8F6;
  }
  .super_insulated-about__block-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    background-color: var(--white);
    padding: 20px 10px;
  }
  .super_insulated-about__block-title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 30px;
    color: #A5A47F;
    text-align: center;
    padding-bottom: 15px;
  }
  .super_insulated-about__imgs {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .super_insulated-about__img {
    display: block;
    width: 100%;
    padding: 20px;
    background-color: #FCE8DD;
  }
  .super_insulated-about__img + .super_insulated-about__img {
    margin-top: 40px;
  }
  .super_insulated-about__img > picture {
    display: block;
    width: 100%;
  }
  .super_insulated-about__img > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .super_insulated-about__img-caption {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    color: #BC5238;
    letter-spacing: 0.05em;
    line-height: 30px;
    text-align: center;
    margin-top: 20px;
  }
}
@media screen and (min-width:768px) {
  .super_insulated-about {
    display: block;
    width: 100%;
    padding: 0 0 100px;
  }
  .super_insulated-about__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .super_insulated-about__header {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .super_insulated-about__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    font-weight: 400;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .super_insulated-about__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .super_insulated-about__memo {
    position: relative;
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
    padding-left: 20px;
  }
  .super_insulated-about__memo > span {
    position: absolute;
    left: 0;
  }
  .super_insulated-about__content {
    display: block;
    width: 100%;
  }
  .super_insulated-about__box {
    display: block;
    width: 100%;
    padding-top: 100px;
  }
  .super_insulated-about__title {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 34px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding-left: 20px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .super_insulated-about__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .super_insulated-about__col {
    display: block;
    width: calc(480/1040 * 100%);
  }
  .super_insulated-about__figure {
    display: block;
    width: calc(510/1040 * 100%);
  }
  .super_insulated-about__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .super_insulated-about__col-figure {
    display: block;
    width: calc(400/480 * 100%);
    margin: 30px auto 0;
  }
  .super_insulated-about__col-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .super_insulated-about__block {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 30px auto 0;
    padding: calc(30/1040 * 100%);
    background-color: #F9F8F6;
  }
  .super_insulated-about__block > li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .super_insulated-about__block > li + li {
    margin-top: 40px;
  }
  .super_insulated-about__block-figure {
    display: block;
    width: calc(326/840 * 100%);
  }
  .super_insulated-about__block-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
    background-color: #F9F8F6;
  }
  .super_insulated-about__block-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: calc(100% - (326/840 * 100%));
    padding: calc(30/514 * 100%);
    background-color: var(--white);
    min-height: 262.5px;
  }
  .super_insulated-about__block-title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 30px;
    color: #A5A47F;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 15px;
  }
  .super_insulated-about__imgs {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-top: 30px;
  }
  .super_insulated-about__img {
    display: block;
    width: calc(495/1040 * 100%);
    padding: calc(30/1040 * 100%);
    background-color: #FCE8DD;
  }
  .super_insulated-about__img > picture {
    display: block;
    width: 100%;
  }
  .super_insulated-about__img > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .super_insulated-about__img-caption {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    color: #BC5238;
    letter-spacing: 0.05em;
    line-height: 30px;
    text-align: center;
    margin-top: 20px;
  }
}
/*cta*/
@media screen and (max-width:767px) {
  .super_insulated-cta {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: #01444D;
  }
  .super_insulated-cta__body {
    display: block;
    width: 100%;
  }
  .super_insulated-cta__main {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .super_insulated-cta__header {
    display: block;
    width: 100%;
    font-size: min(20px + (22 - 20) * ((100vw - 320px) / (375 - 320)), 22px);
    font-weight: 500;
    line-height: 40px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
    letter-spacing: 0;
  }
  .super_insulated-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .super_insulated-cta__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 30px;
  }
  .super_insulated-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .super_insulated-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .super_insulated-cta__figure {
    display: block;
    width: 100%;
  }
  .super_insulated-cta__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .super_insulated-cta {
    position: relative;
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #01444D;
  }
  .super_insulated-cta__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .super_insulated-cta__main {
    display: block;
    width: calc(455/1040 * 100%);
  }
  .super_insulated-cta__header {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 50px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-bottom: 30px;
  }
  .super_insulated-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    color: var(--white);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .super_insulated-cta__btns {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .super_insulated-cta_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 230px;
    height: 51px;
    border: 1px solid var(--white);
    font-size: 15px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
  }
  .super_insulated-cta_btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .super_insulated-cta__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50%;
    height: 100%;
    overflow: hidden;
  }
  .super_insulated-cta__figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .super_insulated-cta {
    padding: 60px 0;
  }
  .super_insulated-cta__header {
    font-size: 21px;
    line-height: 40px;
    margin-bottom: 20px;
  }
}
/*
PAGE - model3
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .model3-intro {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .model3-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 50px;
    background-image: url(./assets/images/model3/model.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: auto 53px;
  }
  .model3-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model3-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .model3-intro__header > span:nth-child(2) {
    display: flex;
    flex-direction: column;
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (390 - 320)), 30px);
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .model3-intro__header > span:nth-child(2) > small {
    font-size: min(14px + (18 - 14) * ((100vw - 320px) / (390 - 320)), 18px);
    line-height: 20px;
  }
  .model3-intro__banner {
    display: block;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .model3-intro__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model3-intro-block {
    display: block;
    width: 100%;
    padding: 30px 0;
  }
  .model3-intro-block__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 20px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 50px 1px;
  }
  .model3-intro-block__title > span:nth-child(1) {
    font-size: min(22px + (28 - 22) * ((100vw - 320px) / (390 - 320)), 28px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model3-intro-block__title > span:nth-child(2) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    letter-spacing: 0.2em;
    margin-top: 5px;
  }
  .model3-intro-block__subtitle {
    display: block;
    width: 100%;
    font-size: min(22px + (26 - 22) * ((100vw - 320px) / (375 - 320)), 26px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .model3-intro-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .model3-intro {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .model3-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 50px;
    background-image: url(./assets/images/model3/model.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 153.2px;
  }
  .model3-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model3-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .model3-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .model3-intro__header > span:nth-child(2) > small {
    font-size: 34px;
  }
  .model3-intro__banner {
    display: block;
    width: 100%;
  }
  .model3-intro__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model3-intro-block {
    display: block;
    width: 100%;
    padding: calc(50/1140* 100%);
  }
  .model3-intro-block__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 30px;
    background-image: linear-gradient(var(--font-color),var(--font-color));
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 50px 1px;
  }
  .model3-intro-block__title > span:nth-child(1) {
    font-size: 50px;
    font-weight: 500;
    line-height: 60px;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model3-intro-block__title > span:nth-child(2) {
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0.2em;
    margin-top: 5px;
  }
  .model3-intro-block__subtitle {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .model3-intro-block__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .model3-intro-block__title > span:nth-child(1) {
    font-size: 38px;
  }
  .model3-intro-block__subtitle {
    font-size: 30px;
  }
  .model3-intro__header > span:nth-child(2) {
    display: flex;
    flex-direction: column;
  }
  .model3-intro__header > span:nth-child(2) > small {
    line-height: 1;
  }
}
/*reserve*/
@media screen and (max-width:767px) {
  .model3-reserve1 {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .model3-reserve2 {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .model3-reserve__link {
    position: relative;
    display: block;
    width: 100%;
  }
  .model3-reserve__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .model3-reserve__link-title {
    position: absolute;
    bottom: 10px;
    right: 0;
    display: flex;
    flex-direction: column;
    width: auto;
    padding:0 10px 0 20px;
    border-left: 1px solid var(--white);
    color: var(--white);
  }
  .model3-reserve__link-title > span:nth-child(1) {
    font-size: 15px;
    line-height: 20px;
  }
  .model3-reserve__link-title > span:nth-child(2) {
    font-size: 24px;
    line-height: 30px;
    margin-top: 10px;
  }
  .model3-reserve__link-figure {
    display: block;
    width: 100%;
  }
  .model3-reserve__link-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .model3-reserve1 {
    display: block;
    width: 100%;
    padding: 50px 0 100px;
    background-color: var(--white);
  }
  .model3-reserve2 {
    display: block;
    width: 100%;
    padding: 100px 0 0;
    background-color: var(--white);
  }
  .model3-reserve__link {
    position: relative;
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model3-reserve__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.7;
  }
  .model3-reserve__link-title {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    width: calc(400/1040 * 100%);
    padding-left: calc(50/1040 * 100%);
    border-left: 1px solid var(--white);
    color: var(--white);
  }
  .model3-reserve__link-title > span:nth-child(1) {
    font-size: 18px;
    line-height: 20px;
  }
  .model3-reserve__link-title > span:nth-child(2) {
    font-size: 33px;
    line-height: 40px;
    margin-top: 10px;
  }
  .model3-reserve__link-figure {
    display: block;
    width: 100%;
  }
  .model3-reserve__link-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .model3-reserve__link-title {
    width: calc(550/1040 * 100%);
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .model3-feature {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .model3-feature .container {
    max-width: 100%;
    padding: 0;
  }
  .model3-feature__body {
    display: block;
    width: 100%;
  }
  .model3-feature__header {
    display: flex;
    flex-direction: column;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
  .model3-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model3-feature__header > span:nth-child(2) {
    font-size: 28px;
    line-height: 36px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model3-feature__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .model3-feature-box {
    display: block;
    width: 100%;
    background-image: linear-gradient(#F5F5F5,#F5F5F5);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: 100% calc(100% - 100px);
  }
  .model3-feature-box + .model3-feature-box {
    margin-top: 80px;
  }
  .model3-feature-box__flex {
    display: flex;
    flex-direction: column;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
  .model3-feature-box__flex img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model3-feature-box__figure1 {
    display: block;
    width: calc(208.13/335 * 100%);
  }
  .model3-feature-box:nth-child(even) .model3-feature-box__flex .model3-feature-box__figure1 {
    margin-left: auto;
  }
  .model3-feature-box__figure2 {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .model3-feature-box__content {
    display: block;
    max-width: 520px;
    width: 100%;
    padding: 30px 20px;
    margin: 0 auto;
  }
  .model3-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model3-feature-box__title > span:nth-child(1) {
    font-size: min(23px + (28 - 23) * ((100vw - 320px) / (375 - 320)), 28px);
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model3-feature-box__title > span:nth-child(2) {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .model3-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .model3-feature-box__figure-fullwidth {
    display: block;
    max-width: 520px;
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
  .model3-feature-box__figure-fullwidth > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .model3-feature {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .model3-feature__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model3-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model3-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model3-feature__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model3-feature__main {
    display: block;
    width: 100%;
    margin-top: 100px;
  }
  .model3-feature-box {
    display: block;
    width: 100%;
  }
  .model3-feature-box + .model3-feature-box {
    margin-top: 100px;
  }
  .model3-feature-box__flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    background-image: linear-gradient(#F5F5F5,#F5F5F5);
    background-repeat: no-repeat;
    background-position: left bottom;
    background-size: calc(990/1040 * 100%) 100px;
  }
  .model3-feature-box__flex.row-reverse {
    flex-direction: row-reverse;
  }
  .model3-feature-box__flex img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .model3-feature-box__figure1 {
    display: block;
    width: calc(600/1040 * 100%);
  }
  .model3-feature-box__figure2 {
    display: block;
    width: calc(390/1040 * 100%);
  }
  .model3-feature-box__content {
    display: block;
    width: calc(990/1040 * 100%);
    padding: 30px calc(50/1040 * 100%);
    background-color: #F5F5F5;
  }
  .model3-feature-box__title {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model3-feature-box__title > span:nth-child(1) {
    font-size: 50px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.05em;
    font-family: var(--cormorant-garamond);
  }
  .model3-feature-box__title > span:nth-child(2) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .model3-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .model3-feature-box__figure-fullwidth {
    display: block;
    width: 100%;
  }
  .model3-feature-box__figure-fullwidth > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .model3-feature__header > span:nth-child(2) {
    font-size: 36px;
  }
  .model3-feature-box__title > span:nth-child(1) {
    font-size: 40px;
    line-height: 50px;
  }
}
/*location*/
@media screen and (max-width:767px) {
  .model3-location {
    display: block;
    width: 100%;
    padding-top: 50px;
    background-color: #F9F8F6;
  }
  .model3-location__body {
    display: block;
    width: 100%;
  }
  .model3-location__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model3-location__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model3-location__header > span:nth-child(2) {
    font-size: min(23px + (26 - 23) * ((100vw - 320px) / (375 - 320)), 26px);
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model3-location__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 20px;
  }
  .model3-location__tbl {
    width: 100%;
  }
  .model3-location__tbl tr th {
    width: 80px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: #01444D;
    padding: 10px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
    vertical-align: text-top;
  }
  .model3-location__tbl tr td {
    width: calc(100% - 80px);
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    padding: 10px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
  }
  .model3-location__figure {
    width: 100%;
    margin-top: 30px;
  }
  .model3-location__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .model3-location {
    display: block;
    width: 100%;
    padding-top: 100px;
    background-color: #F9F8F6;
  }
  .model3-location__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model3-location__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model3-location__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model3-location__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model3-location__main {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
  .model3-location__tbl {
    width: calc(495/1040 * 100%);
  }
  .model3-location__tbl tr th {
    width: 100px;
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    color: #01444D;
    padding: 20px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
    vertical-align: text-top;
  }
  .model3-location__tbl tr td {
    width: calc(100% - 100px);
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;
    padding: 20px 0;
    text-align: left;
    border-bottom: 1px solid #D3D3D3;
  }
  .model3-location__figure {
    width: calc(495/1040 * 100%);
  }
  .model3-location__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*access*/
@media screen and (max-width:767px) {
  .model3-access {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .model3-access__body {
    display: block;
    width: 100%;
  }
  .model3-access__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model3-access__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model3-access__header > span:nth-child(2) {
    font-size: min(23px + (26 - 23) * ((100vw - 320px) / (375 - 320)), 26px);
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model3-access__map {
    display: block;
    width: 100%;
    height: 335px;
    overflow: hidden;
    margin-top: 30px;
  }
  .model3-access__map > iframe {
    width: 100%;
    height: 100%;
  }
  .model3-access__block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .model3-access__block > dt {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    padding-left: 15px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    border-left: 5px solid #DBDBDB;
  }
  .model3-access__block > dd {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
}
@media screen and (min-width:768px) {
  .model3-access {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .model3-access__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .model3-access__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .model3-access__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .model3-access__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .model3-access__map {
    display: block;
    width: 100%;
    height: 400px;
    overflow: hidden;
    margin-top: 50px;
  }
  .model3-access__map > iframe {
    width: 100%;
    height: 100%;
  }
  .model3-access__block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .model3-access__block > dt {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    padding-left: 15px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    border-left: 5px solid #DBDBDB;
  }
  .model3-access__block > dd {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
}
/*
PAGE - award
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .award-intro {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .award-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 50px;
    background-image: url(./assets/images/award/award.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: auto 53px;
  }
  .award-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .award-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .award-intro__header > span:nth-child(2) {
    display: flex;
    flex-direction: column;
    font-size: min(24px + (30 - 24) * ((100vw - 320px) / (390 - 320)), 30px);
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .award-intro-main {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 540px;
    width: 100%;
    padding: 0 20px;
    margin: 50px auto 0;
  }
  .award-intro-main__content {
    display: flex;
    align-items: center;
    width: 100%;
  }
  .award-intro-main__wrap {
    display: block;
    width: 100%;
  }
  .award-intro-main__title {
    display: block;
    width: 100%;
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (390 - 320)), 30px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .award-intro-main__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .award-intro-main__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .award-intro-main__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .award-intro-main__gallery {
    width: 100%;
    margin-top: 30px;
  }
  .award-intro-main__gallery picture {
    display: block;
    width: 100%;
  }
  .award-intro-main__gallery picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .award-intro-main__gallery-thumb {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: 5px;
  }
  .award-intro-main__gallery-main {
    display: block;
    width: 100%;
    margin-top: 5px;
  }
}
@media screen and (min-width:768px) {
  .award-intro {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .award-intro__hgroup {
    display: block;
    width: 100%;
    padding-bottom: 50px;
    background-image: url(./assets/images/award/award.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 153.2px;
  }
  .award-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .award-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .award-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .award-intro-main {
    display: flex;
    justify-content: space-between;
    max-width: 1366px;
    width: 100%;
    margin: 50px auto 0;
  }
  .award-intro-main__content {
    display: flex;
    align-items: center;
    width: 50%;
  }
  .award-intro-main__wrap {
    display: block;
    max-width: 540px;
    width: 100%;
    padding: 0 calc(50/683 * 100%) 0 20px;
    margin-left: auto;
  }
  .award-intro-main__title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .award-intro-main__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .award-intro-main__figure {
    display: block;
    width: 50%;
  }
  .award-intro-main__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .award-intro-main__gallery {
    display: block;
    width: 50%;
  }
  .award-intro-main__gallery picture {
    display: block;
    width: 100%;
  }
  .award-intro-main__gallery picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .award-intro-main__gallery-thumb {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: 10px;
  }
  .award-intro-main__gallery-main {
    display: block;
    width: 100%;
    margin-top: 10px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .award-intro-main__wrap {
    display: block;
    max-width: 384px;
    padding: 0 20px 0 20px;
  }
  .award-intro-main__title {
    font-size: 28px;
    line-height: 45px;
    letter-spacing: 0.05em;
    padding-bottom: 20px;
  }
  .award-intro-main__txt {
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.05em;
  }
}
/*main*/
@media screen and (max-width:767px) {
  .award-main {
    position: relative;
    display: block;
    width: 100%;
    padding: 50px 0 80px;
    background-color: var(--white);
  }
  .award-main::before {
    content: "";
    position: absolute;
    top: 50px;
    left: 5px;
    display: block;
    width: 40px;
    height: 100%;
    background-image: url(./assets/images/award/award2.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 100% auto;
  }
  .award-main__body {
    display: block;
    max-width: 540px;
    width: 100%;
    margin: 0 auto;
  }
  .award-main-box {
    display: block;
    width: 100%;
    padding: 0 20px;
    background-image: linear-gradient(#F5F5F5,#F5F5F5);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% 500px;
  }
  .award-main-box + .award-main-box {
    margin-top: 50px;
  }
  .award-main-hgroup {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    padding-top: 50px;
  }
  .award-main__header {
    display:flex;
    flex-direction: column;
    width: 100%;
    color: #70634D;
  }
  .award-main__header > span:nth-child(1) {
    font-family: var(--cormorant-garamond);
    font-size: min(19px + (22 - 19) * ((100vw - 320px) / (375 - 320)), 22px);
    font-weight: 500;
    line-height: 26px;
  }
  .award-main__header > span:nth-child(1) > i {
    font-family: var(--noto-serif);
    font-size: min(17px + (20 - 17) * ((100vw - 320px) / (375 - 320)), 20px);
  }
  .award-main__header > span:nth-child(2) {
    font-size: min(13px + (15 - 13) * ((100vw - 320px) / (375 - 320)), 15px);
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 35px;
  }
  .award-main-box__figure {
    position: relative;
    z-index: 1;
    display: block;
    max-width: 335px;
    width: 100%;
    margin: 30px auto 0;
  }
  .award-main-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .award-main-box__block {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    margin: 30px auto 0;
  }
  .award-main-box__block img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .award-main-box__block > div > picture {
    display: block;
    width: 100%;
  }
  .award-main-box__block-row1 {
    order: 1;
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 20px;
  }
  .award-main-box__block-row1 > picture {
    width: calc(175/335 * 100%) !important;
  }
  .award-main-box__block-row2 {
    order: 4;
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .award-main-box:nth-child(odd) .award-main-box__block-row3 {
    order: 2;
    display: block;
    width: calc(51% - 10px);
    margin-right: 20px;
  }
  .award-main-box:nth-child(even) .award-main-box__block-row3 {
    order: 3;
    display: block;
    width: calc(51% - 10px);
  }
  .award-main-box__block-row3 > picture + picture {
    margin-top: 20px;
  }
  .award-main-box:nth-child(odd) .award-main-box__block-row4 {
    order: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width: calc(49% - 10px);
  }
  .award-main-box:nth-child(even) .award-main-box__block-row4 {
    order: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width: calc(49% - 10px);
    margin-right: 20px;
  }
}
@media screen and (min-width:768px) {
  .award-main {
    display: block;
    width: 100%;
    padding: 100px 0 200px;
    background-color: var(--white);
    background-image: url(./assets/images/award/award2.png);
    background-repeat: no-repeat;
    background-position: left top 100px;
    background-size: 80px auto;
  }
  .award-main__body {
    display: block;
    max-width: 1366px;
    width: 100%;
    padding: 0 min(20px + (50 - 20) * ((100vw - 1025px) / (1366 - 1025)), 50px);
    margin: 0 auto;
  }
  .award-main-box {
    display: block;
    max-width: 1153px;
    width: 100%;
    margin-left: auto;
  }
  .award-main-box + .award-main-box {
    margin-top: 100px;
  }
  .award-main-hgroup {
    display: block;
    width: calc(990/1153 * 100%);
    padding: 50px 50px 100px;
    background-color: #F5F5F5;
  }
  .award-main__header {
    display:flex;
    flex-direction: column;
    width: 100%;
    color: #70634D;
  }
  .award-main__header > span:nth-child(1) {
    font-family: var(--cormorant-garamond);
    font-size: min(40px + (50 - 40) * ((100vw - 1025px) / (1366 - 1025)), 50px);
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 60px;
  }
  .award-main__header > span:nth-child(1) > i {
    font-family: var(--noto-serif);
    font-size: min(30px + (40 - 30) * ((100vw - 1025px) / (1366 - 1025)), 40px);
  }
  .award-main__header > span:nth-child(2) {
    font-size: min(20px + (24 - 20) * ((100vw - 1025px) / (1366 - 1025)), 24px);
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 35px;
  }
  .award-main-box__figure {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    padding-left: 30px;
    margin-top: -50px;
  }
  .award-main-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .award-main-box__block {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: calc(263/1153 * 100%) calc(470/1153 * 100%) calc(170.63/1153 * 100%) calc(160/1153 * 100%);
    column-gap: calc(20/1153 * 100%);
    padding-left: 30px;
    width: 100%;
    margin-top: -50px;
  }
  .award-main-box__block img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .award-main-box__block > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
  .award-main-box__block > div > picture {
    display: block;
    width: 100%;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .award-main__body {
    max-width: 984px;
    padding: 0 20px;
  }
  .award-main-box {
    width: min(728px + (836 - 728) * ((100vw - 768px) / (1024 - 768)), 836px);
  }
  .award-main-hgroup {
    padding: 30px 30px 60px;
  }
  .award-main-box__figure {
    padding-left: 20px;
    margin-top: -40px;
  }
}
/*media*/
@media screen and (max-width:767px) {
  .award-media {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
    background-image: url(./assets/images/award/media.png);
    background-repeat: no-repeat;
    background-position: left 5px top;
    background-size: 40px auto;
  }
  .award-media__body {
    display: block;
    width: 100%;
  }
  .award-media__header {
    display: block;
    width: 100%;
    font-size: min(28px + (30 - 28) * ((100vw - 320px) / (375 - 320)), 30px);
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .award-media__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .award-media__main {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 20px;
    row-gap: 20px;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
    margin-top: 30px;
  }
  .media-img {
    display: block;
    width: 100%;
  }
  .media-img > picture {
    display: block;
    width: 100%;
  }
  .media-img > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .media-img > h3 {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 20px;
    margin-top: 5px;
    text-align: center;
    color: var(--font-color);
  }
}
@media screen and (min-width:768px) {
  .award-media {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
    background-image: url(./assets/images/award/media.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 80px auto;
  }
  .award-media__body {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .award-media__header {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .award-media__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .award-media__main {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-template-rows: auto;
    column-gap: 30px;
    row-gap: 30px;
    width: 100%;
    padding: 30px;
    background-color: var(--white);
    margin-top: 50px;
  }
  .media-img {
    display: block;
    width: 100%;
  }
  .media-img > picture {
    display: block;
    width: 100%;
  }
  .media-img > picture > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .media-img > h3 {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 20px;
    margin-top: 5px;
    text-align: center;
    color: var(--font-color);
  }
}
/*
ARCHIVE - area
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .area-archive__intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .area-archive__intro-body {
    display: block;
    width: 100%;
  }
  .area-archive__intro-header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .area-archive__intro-header > span:nth-child(1) {
    font-size: min(15px + (16 - 15) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .area-archive__intro-header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .area-archive__intro-cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .area-archive__intro-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .area-archive__intro-figure {
    display: block;
    width: calc(300/335 * 100%);
    margin-top: 30px;
  }
  .area-archive__intro-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .area-archive__intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .area-archive__intro-body {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .area-archive__intro-header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .area-archive__intro-header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .area-archive__intro-header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .area-archive__intro-cols {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .area-archive__intro-txt {
    display: block;
    width: calc(430/900 * 100%);
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .area-archive__intro-figure {
    display: block;
    width: calc(410/900 * 100%);
  }
  .area-archive__intro-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*map*/
@media screen and (max-width:767px) {
  .area-archive__map {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .area-archive__map > .container {
    padding: 0;
  }
  .area-archive__map-figure {
    display: block;
    width: 100%;
  }
  .area-archive__map-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .area-archive__map {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .area-archive__map-figure {
    display: block;
    width: 100%;
  }
  .area-archive__map-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*main*/
@media screen and (max-width:767px) {
  .area-archive__main {
    display: block;
    width: 100%;
    padding-top: 80px;
    background-color: var(--white);
  }
  .area-archive__main-body {
    display: block;
    width: 100%;
  }
  .area-archive-box {
    display: block;
    width: 100%;
  }
  .area-archive-box + .area-archive-box {
    margin-top: 50px;
  }
  .area-archive-box__hgroup {
    position: relative;
    display: block;
    width: 100%;
  }
  .area-archive-box__title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    display: block;
    width: 100%;
    font-size: 30px;
    font-family: var(--noto-serif);
    font-weight: 500;
    letter-spacing: 0.2em;
    line-height: 40px;
    color: var(--white);
    text-align: center;
  }
  .area-archive-box__img {
    display: block;
    width: 100%;
  }
  .area-archive-box__img > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .area-archive-block {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .area-archive-block__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 55px 2px,100% 2px;
  }
  .area-archive-block__list {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 13px;
    row-gap: 20px;
    width: 100%;
    margin-top: 30px;
  }
  .area-archive-block__list > li {
    display: block;
    width: 100%;
  }
  .area-item {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 38px;
    border: 1px solid #333333;
    border-radius: 10px;
    font-size: min(14px + (16 - 14) * ((100vw - 320px) / (375 - 320)), 16px);
    color: #333333;
    font-family: var(--noto-serif);
    text-align: center;
    line-height: 20px;
  }
  .area-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) {
  .area-archive__main {
    display: block;
    width: 100%;
    padding-top: 100px;
    background-color: var(--white);
  }
  .area-archive__main-body {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .area-archive-box {
    display: block;
    width: 100%;
  }
  .area-archive-box + .area-archive-box {
    margin-top: 140px;
  }
  .area-archive-box__hgroup {
    position: relative;
    display: block;
    width: 100%;
  }
  .area-archive-box__title {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    display: block;
    width: 100%;
    font-size: 30px;
    font-family: var(--noto-serif);
    font-weight: 500;
    letter-spacing: 0.2em;
    line-height: 40px;
    color: var(--white);
    text-align: center;
  }
  .area-archive-box__img {
    display: block;
    width: 100%;
  }
  .area-archive-box__img > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .area-archive-block {
    display: block;
    width: 100%;
    margin-top: 80px;
  }
  .area-archive-block__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 126px 2px,100% 2px;
  }
  .area-archive-block__list {
    display: grid;
    grid-template-columns: repeat(5,1fr);
    grid-template-rows: auto;
    column-gap: 13px;
    row-gap: 25px;
    width: 100%;
    margin-top: 25px;
  }
  .area-archive-block__list > li {
    display: block;
    width: 100%;
  }
  .area-item {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 40px;
    border: 1px solid #333333;
    border-radius: 10px;
    font-size: 17px;
    color: #333333;
    font-family: var(--noto-serif);
    text-align: center;
    line-height: 20px;
  }
  .area-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .area-item {
    font-size: 14px;
  }
}
/*
SINGLE - area
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .area-single-intro {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .area-single-intro__body {
    display: block;
    width: 100%;
  }
  .area-single-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .area-single-intro__header > span:nth-child(1) {
    font-size: min(15px + (16 - 15) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .area-single-intro__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .area-single-intro__content {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .area-single-intro__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-family: var(--noto-serif);
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 40px;
    text-align: center;
    padding-bottom: 20px;
    background-image: linear-gradient(#01444D,#01444D);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 60px 3px;
  }
  .area-single-intro__txt {
    display: block;
    width: 100%;
    font-size:min(20px + (24 - 20) * ((100vw - 320px) / (375 - 320)), 24px);
    font-family: var(--noto-serif);
    font-weight: 500;
    letter-spacing: 0.02em;
    line-height: 36px;
    text-align: center;
    margin-top: 50px;
  }
  .area-single-intro__banner {
    position: relative;
    display: block;
    width: 100%;
  }
  .area-single-intro__banner-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    display: block;
    width: 100%;
  }
  .area-single-intro__banner-title {
    display: block;
    width: 100%;
    font-size:min(18px + (22 - 18) * ((100vw - 320px) / (375 - 320)), 22px);
    font-family: var(--noto-serif);
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.1em;
    line-height: 40px;
    text-align: center;
  }
  .area-single-intro__banner-figure {
    display: block;
    width: 100%;
  }
  .area-single-intro__banner-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .area-single-intro {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .area-single-intro__body {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .area-single-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .area-single-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .area-single-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .area-single-intro__content {
    display: block;
    width: 100%;
    padding-bottom: 60px;
  }
  .area-single-intro__title {
    display: block;
    width: 100%;
    font-size: 40px;
    font-family: var(--noto-serif);
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 50px;
    text-align: center;
    padding-bottom: 40px;
    background-image: linear-gradient(#01444D,#01444D);
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 126px 3px;
  }
  .area-single-intro__txt {
    display: block;
    width: 100%;
    font-size: 30px;
    font-family: var(--noto-serif);
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 50px;
    text-align: center;
    margin-top: 60px;
  }
  .area-single-intro__banner {
    position: relative;
    display: block;
    width: 100%;
  }
  .area-single-intro__banner-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    display: block;
    width: 100%;
  }
  .area-single-intro__banner-title {
    display: block;
    width: 100%;
    font-size: 25px;
    font-family: var(--noto-serif);
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.1em;
    line-height: 40px;
    text-align: center;
  }
  .area-single-intro__banner-figure {
    display: block;
    width: 100%;
  }
  .area-single-intro__banner-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*content*/
@media screen and (max-width:767px) {
  .area-single-content {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .area-single-content__body {
    display: block;
    width: 100%;
  }
  .area-single-content__title,
  .single-content__area > h2{
    display: block;
    width: 100%;
    font-size: min(16px + (20 - 16) * ((100vw - 320px) / (375 - 320)), 20px);
    font-family: var(--noto-serif);
    font-weight: 500;
    letter-spacing: 0.02em;
    line-height: 36px;
    text-align: center;
  }
}
@media screen and (min-width:768px) {
  .area-single-content {
    display: block;
    width: 100%;
    padding: 80px 0 130px;
    background-color: var(--white);
  }
  .area-single-content__body {
    display: block;
    max-width: 740px;
    width: 100%;
    margin: 0 auto;
  }
  .area-single-content__title,
  .single-content__area > h2{
    display: block;
    width: 100%;
    font-size: 30px;
    font-family: var(--noto-serif);
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 50px;
    text-align: center;
  }
  .single-content__area > h2{margin-bottom:50px;}
}
/*building*/
@media screen and (max-width:767px) {
  .area-building {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .area-building__body {
    display: block;
    width: 100%;
  }
  .area-building-main {
    display: block;
    width: 100%;
    padding-top: 20px;
    background-image: url(./assets/images/area/building.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 44.24px;
  }
  .area-building-main__header {
    display: block;
    width: 100%;
    font-size: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 60px;
  }
  .area-building-main__txt {
    display: block;
    width: 100%;
    margin: 30px 0 0 0;
    font-size: 15px;
    font-weight: 400;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .area-building__figure {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .area-building__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .area-building {
    display: block;
    width: 100%;
    background-color: var(--white);
    padding-bottom: 130px;
  }
  .area-building__body {
    position: relative;
    display: block;
    max-width: 1366px;
    width: 100%;
    min-height: min(545.5px + (607 - 545.5) * ((100vw - 1025px) / (1366 - 1025)), 607px);
    margin: 0 auto;
    background-image: url(./assets/images/area/building.png);
    background-repeat: no-repeat;
    background-position: left min(113px + (233 - 113) * ((100vw - 1025px) / (1366 - 1025)), 233px) top;
    background-size: auto 153px;
  }
  .area-building-main {
    display: block;
    width: 100%;
    padding-top: 70px;
  }
  .area-building-main__header {
    display: block;
    width: 50%;
    font-size: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 75px;
  }
  .area-building-main__txt {
    display: block;
    width: calc(430/1140 * 100%);
    margin: 45px 0 0 calc(120/1140 * 100%);
    font-size: 15px;
    font-weight: 400;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .area-building__figure {
    position: absolute;
    top: 150px;
    right: 0;
    display: block;
    width: 50%;
  }
  .area-building__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .area-building__body {
    background-size: auto 100px;
  }
  .area-building-main {
    padding-top: 50px;
  }
  .area-building-main__header {
    font-size: 40px;
    line-height: 55px;
  }
  .area-building-main__txt {
    display: block;
    width: calc(450/1140 * 100%);
    margin: 30px 0 0 calc(80/1140 * 100%);
  }
  .area-building__figure {
    top: 100px;
  }
}
/*area-lineup*/
@media screen and (max-width:767px) {
  .area-lineup {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .area-lineup__hgroup {
    display: block;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 50px;
    background-image: url(./assets/images/home/lineup/lineup.png);
    background-repeat: no-repeat;
    background-position: top 15px center;
    background-size: auto 53.89px;
  }
  .area-lineup__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .area-lineup__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .area-lineup__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 57px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .area-lineup-box {
    display: block;
    width: 100%;
    padding: 80px 0 250px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .area-lineup-box.comfort {
    background-image: url(./assets/images/home/lineup/lineup-sp1.jpg);
  }
  .area-lineup-box.dellacasa {
    background-image: url(./assets/images/home/lineup/lineup-sp2.jpg);
    margin-top: 1px;
  }
  .area-lineup-box__content {
    display: block;
    width: 100%;
  }
  .area-lineup-box__title {
    display: block;
    width: 100%;
    font-size: min(30px + (38 - 30) * ((100vw - 320px) / (375 - 320)), 38px);
    font-weight: 400;
    line-height: 30px;
    color: var(--white);
    letter-spacing: 0;
  }
  .area-lineup-box__title > small {
    font-size: min(18px + (20 - 18) * ((100vw - 320px) / (375 - 320)), 20px);
    padding-left: 10px;
    letter-spacing: -0.05em;
  }
  .area-lineup-box__main {
    position: relative;
    display: block;
    width: 100%;
    padding: 30px 0;
  }
  .area-lineup-box__main::before {
    content: "";
    position: absolute;
    top: 0;
    right: 50%;
    display: block;
    width: 50vw;
    height: 100%;
    background-color: rgba(0,0,0,0.61);
  }
  .area-lineup-box__main::after {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    display: block;
    width: 50vw;
    height: 100%;
    background-color: rgba(0,0,0,0.61);
  }
  .area-lineup-box__txt {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .area-lineup-box__btns {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    margin-top: 30px;
  }
  .site-btn.comfort > span {
    color: var(--white);
    background: linear-gradient(#746847 0%, #3a3424 100%);
  }
  .site-btn.comfort::before {
    background-color: var(--white);
  }
  .site-btn.comfort:hover > span {
    background:#333333;
  }
  .site-btn.dellacasa > span {
    color: var(--white);
    background: linear-gradient(#0a1f3c 0%, #000b1a 100%);
  }
  .site-btn.dellacasa::before {
    background-color: var(--white);
  }
  .site-btn.dellacasa:hover > span {
    background:#333333;
  }
}
@media screen and (min-width:768px) {
  .area-lineup {
    display: block;
    width: 100%;
    padding: 80px 0 0;
    background-color: var(--white);
  }
  .area-lineup__hgroup {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 40px;
    background-image: url(./assets/images/home/lineup/lineup.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 100%;
  }
  .area-lineup__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .area-lineup__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 31px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .area-lineup__header > span:nth-child(2) {
    font-size: 60px;
    line-height: 80px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .area-lineup-box {
    display: block;
    width: 100%;
    padding: 80px 0 90px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .area-lineup-box.comfort {
    background-image: url(./assets/images/home/lineup/lineup-pc1.jpg);
  }
  .area-lineup-box.dellacasa {
    background-image: url(./assets/images/home/lineup/lineup-pc2.jpg);
    margin-top: 1px;
  }
  .area-lineup-box__content {
    display: block;
    width: 50%;
  }
  .area-lineup-box.dellacasa .area-lineup-box__content {
    margin-left: auto;
  }
  .area-lineup-box__title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 400;
    line-height: 30px;
    color: var(--white);
  }
  .area-lineup-box.comfort .area-lineup-box__title {
    padding-left: calc(150/570 * 100%);
  }
  .area-lineup-box.dellacasa .area-lineup-box__title {
    padding-left: calc(60/570 * 100%);
  }
  .area-lineup-box__title > small {
    font-size: 20px;
    padding-left: 10px;
  }
  .area-lineup-box__main {
    position: relative;
    display: block;
    width: 100%;
  }
  .area-lineup-box.comfort .area-lineup-box__main {
    padding: calc(40/570 * 100%) calc(30/570 * 100%) calc(40/570 * 100%) calc(150/570 * 100%);
  }
  .area-lineup-box.dellacasa .area-lineup-box__main {
    padding: calc(40/570 * 100%) calc(150/570 * 100%) calc(40/570 * 100%) calc(30/570 * 100%);
  }
  .area-lineup-box__main::after {
    content: "";
    position: absolute;
    top: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: rgba(0,0,0,0.61);
  }
  .area-lineup-box.comfort .area-lineup-box__main::after {
    right: 0;
  }
  .area-lineup-box.dellacasa .area-lineup-box__main::after {
    left: 0;
  }
  .area-lineup-box__txt {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
  }
  .area-lineup-box__btns {
    display: flex;
    align-items: flex-start;
    width: 100%;
    margin-top: 22px;
  }
  .area-lineup-box.comfort .area-lineup-box__btns {
    padding-left: calc(100/570 * 100%);
  }
  .site-btn.comfort > span {
    color: var(--white);
    background: linear-gradient(#746847 0%, #3a3424 100%);
  }
  .site-btn.comfort::before {
    background-color: var(--white);
  }
  .site-btn.comfort:hover > span {
    background:#333333;
  }
  .area-lineup-box.dellacasa .area-lineup-box__btns {
    justify-content: center;
  }
  .site-btn.dellacasa > span {
    color: var(--white);
    background: linear-gradient(#0a1f3c 0%, #000b1a 100%);
  }
  .site-btn.dellacasa::before {
    background-color: var(--white);
  }
  .site-btn.dellacasa:hover > span {
    background:#333333;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .area-lineup-box__content {
    width: 65%;
  }
}
/*area-gallery*/
@media screen and (max-width:767px) {
  .area-gallery {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .area-gallery__body {
    display: block;
    width: 100%;
  }
  .area-gallery__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    font-size: 32px;
    line-height: 46px;
    letter-spacing: 0;
    padding-left: 10px;
  }
  .area-gallery__header > small {
    font-size: 16px;
    line-height: 23px;
    margin-top: 5px;
  }
  .area-gallery__items {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 10px;
    row-gap: 10px;
    width: 100%;
    margin-top: 30px;
  }
  .area-gallery__item {
    position: relative;
    display: block;
    width: 100%;
    padding-top: calc(162.5/162.5 * 100%);
    overflow: hidden;
  }
  .area-gallery__item-title {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 5px;
    font-size: 14px;
    line-height: 20px;
    color: var(--white);
    text-align: center;
    background-color: rgba(0,0,0,0.5);
    transform: translateY(100%);
    transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    overflow: hidden;
  }
  .area-gallery__item:hover > .area-gallery__item-title {
    transform: translateY(0);
  }
  .area-gallery__item-figure {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .area-gallery__item-figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .area-gallery__btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .site-btn.gallery_reform {
    margin-top: 20px;
  }
  .site-btn.gallery_reform {
    max-width: 318px;
    width: 100%;
  }
  .site-btn.gallery_reform > span {
    width: 100%;
  }
}
@media screen and (min-width:768px) {
  .area-gallery {
    display: block;
    width: 100%;
    padding: 100px 0 80px;
    background-color: var(--white);
  }
  .area-gallery__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .area-gallery__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 50px;
    letter-spacing: 0;
  }
  .area-gallery__header > small {
    font-size: 20px;
    padding-left: 20px;
  }
  .area-gallery__items {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    grid-template-rows: auto;
    column-gap: 15px;
    row-gap: 15px;
    max-width: 925px;
    width: 100%;
    margin: 50px auto 0;
  }
  .area-gallery__item {
    position: relative;
    display: block;
    width: 100%;
    padding-top: calc(220/220 * 100% );
    overflow: hidden;
  }
  .area-gallery__item-title {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 15px;
    font-size: 15px;
    line-height: 20px;
    color: var(--white);
    text-align: center;
    background-color: rgba(0,0,0,0.5);
    transform: translateY(100%);
    transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
    overflow: hidden;
  }
  .area-gallery__item:hover > .area-gallery__item-title {
    transform: translateY(0);
  }
  .area-gallery__item-figure {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  .area-gallery__item-figure > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .area-gallery__btns {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 50px;
  }
  .site-btn.gallery_reform {
    margin-left: 70px;
  }
  .site-btn.gallery_reform > span {
    width: 268px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .area-gallery__item-title {
    font-size: 14px;
  }
}
/*area-model*/
@media screen and (max-width:767px) {
  .area-model {
    display: block;
    width: 100%;
    padding: 80px 0 0;
    background-color: var(--white);
  }
  .area-model__hgroup {
    display: block;
    width: 100%;
    margin: 0 auto;
    background-image: url(./assets/images/home/model/model.png);
    background-repeat: no-repeat;
    background-position: top 10px center;
    background-size: 287.6px auto;
  }
  .area-model__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .area-model__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .area-model__header > span:nth-child(2) {
    font-size: 40px;
    line-height: 57px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .area-model__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    padding: 50px 0;
    margin: 0 auto;
  }
  .area-model__main {
    display: block;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .area-model-box {
    position: relative;
    display: block;
    width: 100%;
    padding: 30px 20px 66px;
  }
  .area-model-box__btn {
    position: absolute;
    bottom: -36px;
    right: 0;
    display: block;
    width: 130px;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: var(--white);
    padding-right: 40px;
    background-image: url(./assets/images/icon-arrow-wh.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 30px auto;
  }
  .area-model-box__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .area-model-box + .area-model-box {
    margin-top: 20px;
  }
  .area-model-box:nth-child(odd)::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: #34474A;
  }
  .area-model-box:nth-child(even)::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: #1D2633;
  }
  .area-model-box__wrap {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .area-model-box__figure {
    display: block;
    width: 100%;
  }
  .area-model-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .area-model-box__content {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .area-model-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 400;
    color: var(--white);
    line-height: 37px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--white);
  }
  .area-model-box__address {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 2;
    text-align: justify;
    word-break: break-all;
    margin-top: 15px;
  }
  .area-model-box__officehour {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 2;
    text-align: justify;
    word-break: break-all;
  }
  .area-model-box__officehour > span {
    padding-right: 20px;
  }
  .area-model-box__columns {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: 10px;
    width: 100%;
    margin-top: 15px;
  }
  .area-model-box__thumb {
    display: block;
    width: 100%;
  }
  .area-model-box__thumb > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .area-model__btns {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .area-model {
    display: block;
    width: 100%;
    padding: 70px 0 0;
    background-color: var(--white);
  }
  .area-model__hgroup {
    display: block;
    max-width: 1366px;
    width: 100%;
    margin: 0 auto;
    background-image: url(./assets/images/home/model/model.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: calc(866.6/1366 * 100%) auto;
  }
  .area-model__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .area-model__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 31px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .area-model__header > span:nth-child(2) {
    font-size: 60px;
    line-height: 80px;
    letter-spacing: 0.1em;
    text-align: center;
  }
  .area-model__txt {
    display: block;
    max-width: 730px;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    text-align: justify;
    word-break: break-all;
    padding: 80px 0 40px;
    margin: 0 auto;
  }
  .area-model__main {
    display: block;
    width: 100%;
  }
  .area-model-box {
    position: relative;
    display: block;
    width: calc(1090/1140 * 100%);
  }
  .area-model-box__btn {
    position: absolute;
    bottom: 0;
    right: 0;
    display: block;
    width: 130px;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: var(--white);
    padding-right: 40px;
    background-image: url(./assets/images/icon-arrow-wh.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 30px auto;
    transform: translateX(150px);
  }
  .area-model-box__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .area-model-box + .area-model-box {
    margin-top: 20px;
  }
  .area-model-box:nth-child(odd) {
    padding: 30px calc(350/1090 * 100%) 30px 0;
  }
  .area-model-box:nth-child(even) {
    margin-left: auto;
    padding: 30px calc(260/1090 * 100%) 30px calc(90/1090 * 100%);
  }
  .area-model-box:nth-child(odd)::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: #34474A;
  }
  .area-model-box:nth-child(even)::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: #1D2633;
  }
  .area-model-box__wrap {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .area-model-box__figure {
    display: block;
    width: calc(300/740 * 100%);
  }
  .area-model-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .area-model-box__content {
    display: block;
    width: calc(440/740 * 100%);
  }
  .area-model-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 400;
    color: var(--white);
    line-height: 37px;
    padding: 0 0 15px min(50px + (115 - 50) * ((100vw - 1025px) / (1200 - 1025)),115px);
    border-bottom: 1px solid var(--white);
    letter-spacing: 0.07em;
  }
  .area-model-box__address {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 2;
    text-align: justify;
    word-break: break-all;
    padding-left: min(50px + (115 - 50) * ((100vw - 1025px) / (1200 - 1025)),115px);
    margin-top: 16px;
  }
  .area-model-box__officehour {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 400;
    color: var(--white);
    line-height: 2;
    text-align: justify;
    word-break: break-all;
    padding-left: min(50px + (115 - 50) * ((100vw - 1025px) / (1200 - 1025)),115px);
  }
  .area-model-box__officehour > span {
    padding-right: 20px;
  }
  .area-model-box__columns {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: 10px;
    width: 100%;
    padding-left: min(50px + (115 - 50) * ((100vw - 1025px) / (1200 - 1025)),115px);
    margin-top: 23px;
  }
  .area-model-box__thumb {
    display: block;
    width: 100%;
  }
  .area-model-box__thumb > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .area-model__btns {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .area-model-box:nth-child(odd) {
    padding: 30px calc(90/1090 * 100%) 66px 0;
  }
  .area-model-box:nth-child(even) {
    padding: 30px calc(90/1090 * 100%) 66px calc(90/1090 * 100%);
  }
  .area-model-box__btn {
    bottom: -36px;
    transform: translateX(0);
  }
  .area-model-box__content {
    width: calc(400/740 * 100%);
  }
   .home-model-box__title {
    font-size: 22px;
  }
}
/*
ARCHIVE - note
--------------------------------------------- */
@media screen and (max-width:767px) {
  .note-archive {
    display: block;
    width: 100%;
    padding: 50px 0 0;
    background-color: var(--white);
  }
  .note-archive__body {
    display: block;
    width: 100%;
  }
  .note-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .note-archive__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .note-archive__header > span:nth-child(2) {
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (375 - 320)), 30px);
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
}
@media screen and (min-width:768px) {
  .note-archive {
    display: block;
    width: 100%;
    padding: 85px 0 0;
    background-color: var(--white);
  }
  .note-archive__body {
    display: block;
    max-width: 1090px;
    width: 100%;
    margin: 0 auto;
  }
  .note-archive__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .note-archive__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .note-archive__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
}
/*note layout*/
@media screen and (max-width:1024px) {
  .note-wrap {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .note-main {
    display: block;
    width: 100%;
  }
  .note-sidebar {
    display: block;
    width: 100%;
    margin-top: 60px;
  }
}
@media screen and (min-width:1025px) {
  .note-wrap {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .note-main {
    display: block;
    width: calc(100% - 300px - 90px);
  }
  .note-sidebar {
    display: block;
    width: 300px;
  }
}
/*items*/
@media screen and (max-width:767px) {
  .note-archive-items {
    display: grid;
    grid-template-columns:repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: calc(20/350 * 100%);
    row-gap: 30px;
    width: 100%;
  }
  .note-archive-item__link {
    display: block;
    width: 100%;
  }
  .note-archive-item__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .note-archive-item__figure {
    display: block;
    width: 100%;
  }
  .note-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .note-archive-item__date {
    display: block;
    width: 100%;
    font-size: 14px;
    font-weight: 500;
    line-height: 17px;
    letter-spacing: 0.1em;
    color: #01444D;
    padding: 10px 0 5px;
  }
  .note-archive-item__categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 5px);
    margin-left: -5px;
  }
  .note-archive-item__category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 20px;
    background-color: #888888;
    font-size: 10px;
    font-weight: 400;
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 5px;
    margin: 5px 0 0 5px;
  }
  .note-archive-item__category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .note-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    color: var(--font-color);
    letter-spacing: 0.07em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .note-archive-item__title:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) {
  .note-archive-items {
    display: grid;
    grid-template-columns:repeat(3,1fr);
    grid-template-rows: auto;
    column-gap: calc(20/700 * 100%);
    row-gap: 50px;
    width: 100%;
  }
  .note-archive-item__link {
    display: block;
    width: 100%;
  }
  .note-archive-item__link:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .note-archive-item__figure {
    display: block;
    width: 100%;
  }
  .note-archive-item__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .note-archive-item__date {
    display: block;
    width: 100%;
    font-size: 12px;
    font-weight: 500;
    line-height: 17px;
    letter-spacing: 0.1em;
    color: #01444D;
    margin-top: 10px;
  }
  .note-archive-item__categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 5px);
    margin-left: -5px;
  }
  .note-archive-item__category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 24px;
    background-color: #888888;
    font-size: 10px;
    font-weight: 400;
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 5px;
    margin: 5px 0 0 5px;
  }
  .note-archive-item__category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .note-archive-item__title {
    display: -webkit-box;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 25px;
    color: var(--font-color);
    letter-spacing: 0.07em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-align: justify;
    word-break: break-all;
    margin-top: 15px;
  }
  .note-archive-item__title:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
/*title*/
@media screen and (min-width:0px) {
  .note-sidebar__title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 30px;
    padding-bottom: 30px;
  }
  .note-sidebar__title > small {
    font-size: 12px;
    line-height: 1;
  }
}
/*search form*/
@media screen and (min-width:0px) {
  .note-search-form {
    display: block;
    width: 100%;
  }
}
/*ranking*/
@media screen and (min-width:0px) {
  .note-ranking {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .note-ranking__items {
    display: block;
    width: 100%;
  }
  .note-ranking__items > li {
    display: block;
    width: 100%;
    padding: 10px;
  }
  .note-ranking__items > li + li {
    margin-top: 10px;
  }
  .note-ranking__item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .note-ranking__item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .note-ranking__thumb {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 107px;
    height: 80px;
    overflow: hidden;
  }
  .note-ranking__thumb > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .note-ranking__item-title {
    display: -webkit-box;
    width: calc(100% - 107px - 10px);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: var(--font-color);
    letter-spacing: 0.07em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .note-ranking__items {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 30px;
    row-gap: 30px;
    width: 100%;
  }
  .note-ranking__items > li + li {
    margin-top: 0;
  }
}
/*categoreis*/
@media screen and (min-width:0px) {
  .note-sidebar-category {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .note-sidebar__categories {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    width: calc(100% + 10px);
    margin-left: -10px;
    margin-top: -10px;
  }
  .note-sidebar__catetory {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 28px;
    background-color: #888888;
    font-size: 12px;
    /*font-weight: 700;*/
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 10px;
    margin: 10px 0 0 10px;
  }
  .note-sidebar__catetory:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
/*archives*/
@media screen and (min-width:0px) {
  .note-sidebar-archives {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .note-archives__wrap {
    max-width: 300px;
  }
}
/*
SINGLE - note
--------------------------------------------- */
@media screen and (max-width:767px) {
  .single-note-categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 5px);
    margin-left: -5px;
    margin-top: -5px;
    margin-bottom: 20px;
  }
  .single-note-category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 24px;
    background-color: #888888;
    font-size: 10px;
    font-weight: 400;
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 5px;
    margin: 5px 0 0 5px;
  }
  .single-note-category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .single-note__title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    line-height: 30px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 55px 2px,100% 2px;
  }
  .single-note__date {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 24px;
    padding: 20px 0 0;
  }
  .note-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .single-note-categories {
    display: flex;
    align-items: flex-start;
    width: calc(100% + 5px);
    margin-left: -5px;
    margin-top: -5px;
    margin-bottom: 20px;
  }
  .single-note-category {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 24px;
    background-color: #888888;
    font-size: 10px;
    font-weight: 400;
    font-family: var(--noto-sans);
    color: var(--white);
    padding: 0 5px;
    margin: 5px 0 0 5px;
  }
  .single-note-category:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .single-note__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.07em;
    padding-bottom: 10px;
    text-align: justify;
    word-break: break-all;
    background-image: linear-gradient(#01444D,#01444D),linear-gradient(#CECECE,#CECECE);
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, left bottom;
    background-size: 126px 2px,100% 2px;
  }
  .single-note__date {
    display: block;
    width: 100%;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.07em;
    line-height: 24px;
    padding: 20px 0 0;
  }
  .note-single__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
}
/*
PAGE - reform
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .reform-intro {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .reform-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/reform/reform.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 60px;
  }
  .reform-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .reform-intro__header > span:nth-child(1) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
  }
  .reform-intro__header > span:nth-child(2) {
    display: block;
    font-size: min(25px + (30 - 25) * ((100vw - 320px) / (390 - 320)), 30px);
    font-weight: 500;
    line-height: 44px;
    letter-spacing: 0.05em;
    margin-top: 5px;
  }
  .reform-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .reform-intro {
    display: block;
    width: 100%;
    padding: 85px 0 100px;
    background-color: var(--white);
  }
  .reform-intro__hgroup {
    display: block;
    width: 100%;
    background-image: url(./assets/images/reform/reform.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: auto 167px;
  }
  .reform-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .reform-intro__header > span:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
  }
  .reform-intro__header > span:nth-child(2) {
    font-size: 44px;
    font-weight: 500;
    line-height: 70px;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .reform-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-top: 80px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .reform-intro-block__title > span:nth-child(1) {
    font-size: 38px;
  }
  .reform-intro__txt {
    font-size: 14px;
    letter-spacing: 0.05em;
  }
}
/*about*/
@media screen and (max-width:767px) {
  .reform-about {
    display: block;
    width: 100%;
    padding-bottom: 80px;
    background-color: var(--white);
  }
  .reform-about__figure {
    display: block;
    width: 100%;
  }
  .reform-about__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-about__content {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    background-color: rgba(255,255,255,0.9);
    padding: 20px;
    margin-top: -50px;
  }
  .reform-about__header {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 36px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .reform-about__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .reform-about__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .reform-about-main {
    display: block;
    width: 100%;
    margin: 80px auto 0;
  }
  .reform-about-box {
    display: block;
    width: 100%;
  }
  .reform-about-box + .reform-about-box {
    margin-top: 100px;
  }
  .reform-about-box__figure {
    display: block;
    width: 100%;
  }
  .reform-about-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-about-box__cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 50px;
  }
  .reform-about-box__title {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .reform-about-box__title > span:nth-child(1) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .reform-about-box__title > span:nth-child(2) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .reform-about-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
}
@media screen and (min-width:768px) {
  .reform-about {
    display: block;
    width: 100%;
    padding-bottom: 200px;
    background-color: var(--white);
  }
  .reform-about__figure {
    display: block;
    width: 100%;
  }
  .reform-about__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-about__content {
    position: relative;
    z-index: 1;
    display: block;
    width: calc(735/1140 * 100%);
    background-color: rgba(255,255,255,0.9);
    padding: calc(50/1140 * 100%);
    margin-top: -170px;
  }
  .reform-about__header {
    display: block;
    width: 100%;
    font-size: min(32px + (38 - 32) * ((100vw - 1025px) / (1140 - 1025)), 38px);
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .reform-about__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .reform-about__txt > span {
    font-size: 18px;
    font-weight: 500;
  }
  .reform-about-main {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 100px auto 0;
  }
  .reform-about-box {
    display: block;
    width: 100%;
  }
  .reform-about-box + .reform-about-box {
    margin-top: 150px;
  }
  .reform-about-box__figure {
    display: block;
    width: 100%;
  }
  .reform-about-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-about-box__cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    margin-top: 50px;
  }
  .reform-about-box:nth-child(even) .reform-about-box__cols {
    flex-direction: row-reverse;
  }
  .reform-about-box__title {
    display: flex;
    flex-direction: column;
    width: calc(400/1040 * 100%);
  }
  .reform-about-box__title > span:nth-child(1) {
    font-size: min(50px + (58 - 50) * ((100vw - 1025px) / (1140 - 1025)), 58px);
    line-height: 60px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .reform-about-box__title > span:nth-child(2) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .reform-about-box__txt {
    display: block;
    width: calc(600/1040 * 100%);
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .reform-about-box:nth-child(even) .reform-about-box__title {
    width: calc(450/1040 * 100%);
  }
  .reform-about-box:nth-child(even) .reform-about-box__txt {
    width: calc(500/1040 * 100%);
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .reform-about__header {
    font-size: 24px;
    line-height: 35px;
    padding-bottom: 30px;
  }
  .reform-about-box__title > span:nth-child(1) {
    font-size: 40px;
    line-height: 50px;
    letter-spacing: 0.07em;
  }
  .reform-about-box__title > span:nth-child(2) {
    font-size: 18px;
    margin-top: 5px;
  }
}
/*feature*/
@media screen and (max-width:767px) {
  .reform-feature {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .reform-feature__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .reform-feature__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .reform-feature__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 45px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .reform-feature__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .reform-feature-box {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .reform-feature-box + .reform-feature-box {
    margin-top: 80px;
  }
  .reform-feature-box__figure {
    display: block;
    width: 100%;
  }
  .reform-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-feature-box__content {
    display: block;
    width: 100%;
    padding-top: 30px;
  }
  .reform-feature-box__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 35px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .reform-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .reform-feature__block {
    display: block;
    width: 100%;
    margin: 50px auto 0;
  }
  .reform-feature__block-title {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 28.6px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 10px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 40px;
  }
  .reform-feature__block-wrap {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: auto;
    column-gap: 10px;
    row-gap: 20px;
    padding: 10px;
    background-color: var(--white);
  }
  .reform-feature__block-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
  }
  .reform-feature__block-figure {
    display: block;
    width: 100%;
  }
  .reform-feature__block-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-feature__block-subtitle {
    display: block;
    width: 100%;
    font-size: min(13px + (15 - 13) * ((100vw - 320px) / (375 - 320)), 15px);
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.05em;
    margin-top: 10px;
    text-align: center;
  }
  .reform-feature__block-box:last-child .reform-feature__block-subtitle {
    text-align: left;
  }
}
@media screen and (min-width:768px) {
  .reform-feature {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .reform-feature__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .reform-feature__header > span:nth-child(1) {
    font-size: 22px;
    line-height: 30px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .reform-feature__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 10px;
  }
  .reform-feature__main {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .reform-feature-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .reform-feature-box:nth-child(even) {
    flex-direction: row-reverse;
  }
  .reform-feature-box + .reform-feature-box {
    margin-top: 100px;
  }
  .reform-feature-box__figure {
    display: block;
    width: 50%;
  }
  .reform-feature-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-feature-box__content {
    display: block;
    width: calc(520/1140 * 100%);
    padding-top: 30px;
  }
  .reform-feature-box__title {
    display: block;
    width: 100%;
    font-size: 34px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .reform-feature-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .reform-feature__block {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 100px auto 0;
  }
  .reform-feature__block-title {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding-left: 15px;
    border-left: 5px solid #DBDBDB;
    margin-bottom: 30px;
  }
  .reform-feature__block-wrap {
    display: grid;
    grid-template-columns: repeat(5,1fr);
    grid-template-rows: auto;
    column-gap: 20px;
    row-gap: 30px;
    padding: calc(40/1040 * 100%);
    background-color: var(--white);
  }
  .reform-feature__block-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
  }
  .reform-feature__block-figure {
    display: block;
    width: 100%;
  }
  .reform-feature__block-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-feature__block-subtitle {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: 0.05em;
    margin-top: 10px;
    text-align: center;
  }
  .reform-feature__block-box:last-child .reform-feature__block-subtitle {
    text-align: left;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .reform-feature__header > span:nth-child(2) {
    font-size: 34px;
  }
  .reform-feature-box__content {
    padding-top: 20px;
  }
  .reform-feature-box__title {
    font-size: 28px;
    letter-spacing: 0.07em;
    line-height: 45px;
    padding-bottom: 20px;
  }
  .reform-feature__block-subtitle {
    font-size: 13px;
  }
}
/*gallery*/
@media screen and (max-width:767px) {
  .reform-gallery {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: var(--white);
  }
  .reform-gallery__body {
    display: block;
    width: 100%;
  }
  .reform-gallery__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .reform-gallery__header > span:nth-child(1) {
    font-size: 32px;
    line-height: 46px;
    font-weight: 500;
  }
  .reform-gallery__header > span:nth-child(2) {
    font-size: min(14px + (16 - 14) * ((100vw - 320px) / (375 - 320)), 16px);
    line-height: 23px;
    font-weight: 500;
    margin-top: 5px;
  }
  .reform-gallery-items {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    grid-template-rows: auto;
    row-gap: 30px;
    width: 100%;
    margin-top: 30px;
  }
  .reform-gallery-item {
    display: block;
    width: 100%;
  }
  .reform-gallery-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .reform-gallery-figure {
    display: block;
    width: 100%;
  }
  .reform-gallery-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-gallery-item__title {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 25px;
    color: var(--font-color);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 10px;
  }
  .reform-gallery__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  .reform-gallery__btns > a {
    max-width: 240px;
  }
}
@media screen and (min-width:768px) {
  .reform-gallery {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: var(--white);
  }
  .reform-gallery__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .reform-gallery__header {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-end;
    width: 100%;
  }
  .reform-gallery__header > span:nth-child(1) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    padding-right: 10px;
  }
  .reform-gallery__header > span:nth-child(2) {
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    padding-bottom: 5px;
  }
  .reform-gallery-items {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: 25px;
    width: 100%;
    margin-top: 50px;
  }
  .reform-gallery-item {
    display: block;
    width: 100%;
  }
  .reform-gallery-item:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
  .reform-gallery-figure {
    display: block;
    width: 100%;
  }
  .reform-gallery-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-gallery-item__title {
    display: block;
    width: 100%;
    font-size: 15px;
    font-weight: 500;
    line-height: 25px;
    color: var(--font-color);
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .reform-gallery__btns {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 50px;
  }
  .reform-gallery__btns > a {
    max-width: 240px;
  }
}
/*flow*/
@media screen and (max-width:767px) {
  .reform-flow {
    display: block;
    width: 100%;
    padding: 50px 0;
    background-color: #F9F8F6;
  }
  .reform-flow__body {
    display: block;
    width: 100%;
  }
  .reform-flow__header {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 45px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .reform-flow-list {
    display: block;
    width: 100%;
  }
  .reform-flow-list > li {
    position: relative;
    display: block;
    width: 100%;
    padding: 20px;
    border: 1px solid #D3D3D3;
    background-color: var(--white);
  }
  .reform-flow-list > li + li {
    margin-top: 30px;
  }
  .reform-flow-list > li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: calc(20px + 80px);
    left: 43px;
    display: block;
    width: 1px;
    height: calc(100% - 20px - 80px + 31px);
    background-color: #D3D3D3;
  }
  .reform-flow-list > li > .question {
    position: relative;
    display: flex;
    align-items: flex-start;
    width: 100%;
    min-height: 70px;
    padding: 0 0 0 50px;
  }
  .reform-flow-list > li > .question > .question-txt {
    display: none;
    width: 100%;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    margin-top: 70px;
  }
  .reform-flow-list > li > .question.active > .question-txt {
    display: block;
  }
  .reform-flow-list > li > .question > .question-txt > small {
    font-size: 15px;
  }
  .reform-flow-list .question-badge {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    width: 46px;
  }
  .reform-flow-list .question-badge > i {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 20px;
  }
  .reform-flow-list .question-badge > span {
    font-size: 40px;
    font-weight: 500;
    line-height: 50px;
  }
  .reform-flow-list > li > .question > i {
    position: absolute;
    top: 20px;
    right: 0;
    display: block;
    width: 30px;
    height: 30px;
  }
  .reform-flow-list > li > .question > i::before,
  .reform-flow-list > li > .question > i::after {
    content: "";
    position: absolute;
    transform: translate(-50%,-50%);
    display: block;
    background-color: #222222;
  }
  .reform-flow-list > li > .question > i::before {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
  }
  .reform-flow-list > li > .question > i::after {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
    transform: rotate(90deg) translate(-50%,-50%);
    transform-origin: 0 50%;
    transition: 0.3s ease;
  }
  .reform-flow-list > li > .question.active > i::after {
    top: 50%;
    left: 50%;
    transform: rotate(0deg) translate(-50%,-50%);
    transform-origin: 0 0%;
  }
  .reform-flow-list > li > .answer {
    display: none;
    width: 100%;
  }
  .reform-flow-list .answer-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 20px 0 0 50px;
  }
  .reform-flow-list .answer-figure {
    display: block;
    width: 100%;
  }
  .reform-flow-list .answer-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-flow-list .answer-content {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .reform-flow-list .answer-txt {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0.07em;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
  }
  .reform-flow-list .answer-btns {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin-top: 20px;
  }
  .reform-flow-list .answer-btns > a {
    font-size: 14px;
  }
}
@media screen and (min-width:768px) {
  .reform-flow {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F9F8F6;
  }
  .reform-flow__body {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .reform-flow__header {
    display: block;
    width: 100%;
    font-size: 38px;
    line-height: 55px;
    letter-spacing: 0.1em;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .reform-flow-list {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .reform-flow-list > li {
    position: relative;
    display: block;
    width: 100%;
    padding: 30px;
    border: 1px solid #D3D3D3;
    background-color: var(--white);
  }
  .reform-flow-list > li + li {
    margin-top: 60px;
  }
  .reform-flow-list > li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: calc(30px + 90px);
    left: 55px;
    display: block;
    width: 1px;
    height: calc(100% - 30px - 90px + 61px);
    background-color: #D3D3D3;
  }
  .reform-flow-list > li > .question {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 90px;
    padding: 0 40px 0 110px;
  }
  .reform-flow-list > li > .question > .question-txt {
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 40px;
    font-weight: 500;
    text-align: justify;
    word-break: break-all;
  }
  .reform-flow-list > li > .question > .question-txt > small {
    font-size: 20px;
  }
  .reform-flow-list .question-badge {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    width: 60px;
  }
  .reform-flow-list .question-badge > i {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 20px;
  }
  .reform-flow-list .question-badge > span {
    font-size: 50px;
    font-weight: 500;
    line-height: 70px;
  }
  .reform-flow-list > li > .question > i {
    position: absolute;
    top: 30;
    right: 0;
    display: block;
    width: 30px;
    height: 30px;
  }
  .reform-flow-list > li > .question > i::before,
  .reform-flow-list > li > .question > i::after {
    content: "";
    position: absolute;
    transform: translate(-50%,-50%);
    display: block;
    background-color: #222222;
  }
  .reform-flow-list > li > .question > i::before {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
  }
  .reform-flow-list > li > .question > i::after {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 1px;
    transform: rotate(90deg) translate(-50%,-50%);
    transform-origin: 0 50%;
    transition: 0.3s ease;
  }
  .reform-flow-list > li > .question.active > i::after {
    top: 50%;
    left: 50%;
    transform: rotate(0deg) translate(-50%,-50%);
    transform-origin: 0 0%;
  }
  .reform-flow-list > li > .answer {
    display: none;
    width: 100%;
  }
  .reform-flow-list .answer-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    padding: 10px 0 0 110px;
  }
  .reform-flow-list .answer-figure {
    display: block;
    width: calc(230/728 * 100%);
  }
  .reform-flow-list .answer-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .reform-flow-list .answer-content {
    display: block;
    width: calc(474/728 * 100%);
  }
  .reform-flow-list .answer-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    font-weight: 400;
    text-align: justify;
    word-break: break-all;
  }
  .reform-flow-list .answer-btns {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin-top: 20px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .reform-flow-list > li > .question {
    padding: 0 40px 0 90px;
  }
  .reform-flow-list > li > .question > .question-txt {
    font-size: 24px;
  }
  .reform-flow-list > li > .question > .question-txt > small {
    font-size: 18px;
  }
  .reform-flow-list .answer-wrap {
    padding: 10px 0 0 90px;
  }
}
/*summary*/
@media screen and (max-width:767px) {
  .reform-summary {
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 100%;
  }
  .reform-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 50px 20px;
    background-color: #01444D;
  }
  .reform-summary__header {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: min(16px + (20 - 16) * ((100vw - 320px) / (375 - 320)), 20px);
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.02em;
    text-align: justify;
    word-break: break-all;
  }
  .reform-summary__txt {
    display: block;
    max-width: 520px;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .reform-summary > picture {
    display: flex;
    width: 50%;
  }
  .reform-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .reform-summary {
    position: relative;
    display: block;
    width: 100%;
  }
  .reform-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 400px;
    min-height: 350px;
    padding: 40px 20px;
    background-color: #01444D;
    margin: 0 auto;
  }
  .reform-summary__header {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 40px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .reform-summary__txt {
    display: block;
    width: 100%;
    font-size: 12px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .reform-summary > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 400px)/2);
    height: 100%;
    overflow: hidden;
  }
  .reform-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .reform-summary__figure1 {
    left: 0;
  }
  .reform-summary__figure2 {
    right: 0;
  }
}
@media screen and (min-width:1025px) {
  .reform-summary {
    position: relative;
    display: block;
    width: 100%;
  }
  .reform-summary__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 555px;
    width: 100%;
    min-height: 530px;
    padding: 135px 40px;
    background-color: #01444D;
    margin: 0 auto;
  }
  .reform-summary__header {
    display: block;
    width: 100%;
    font-size: 28px;
    line-height: 50px;
    font-weight: 500;
    color: var(--white);
    letter-spacing: 0.03em;
    text-align: center;
  }
  .reform-summary__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 2;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: center;
    margin-top: 30px;
  }
  .reform-summary > picture {
    position: absolute;
    top: 0;
    display: flex;
    width: calc((100% - 555px)/2);
    height: 100%;
    overflow: hidden;
  }
  .reform-summary > picture > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .reform-summary__figure1 {
    left: 0;
  }
  .reform-summary__figure2 {
    right: 0;
  }
}
/*
PAGE - renk
--------------------------------------------- */
/*intro*/
@media screen and (max-width:767px) {
  .renk-intro {
    display: block;
    width: 100%;
    padding: 50px 0 50px;
    background-color: var(--white);
  }
  .renk-intro__hgroup {
    display: block;
    width: 100%;
  }
  .renk-intro__header {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .renk-intro__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .renk-intro__header > span:nth-child(2) {
    font-size: min(23px + (24 - 23) * ((100vw - 320px) / (375 - 320)), 24px);
    line-height: 40px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .renk-intro__main {
    display: block;
    width: 100%;
    padding-top: 50px;
  }
  .renk-intro__txt {
    display: block;
    width: 100%;
    font-size: min(13px + (15 - 13) * ((100vw - 320px) / (375 - 320)), 15px);
    line-height: 25.5px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .renk-intro__logo {
    display: block;
    max-width: 335px;
    width: 100%;
    margin: 50px auto 0;
  }
}
@media screen and (min-width:768px) {
  .renk-intro {
    display: block;
    width: 100%;
    padding: 85px 0 50px;
    background-color: var(--white);
  }
  .renk-intro__hgroup {
    display: block;
    width: 100%;
  }
  .renk-intro__header {
    display: flex;
    flex-direction: column;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .renk-intro__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .renk-intro__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .renk-intro__main {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    padding-top: 100px;
  }
  .renk-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    margin-top: 50px;
  }
  .renk-intro__logo {
    display: block;
    width: calc(583.92/1040 * 100%);
    margin: 50px auto 0;
  }
  .renk-intro__logo > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
/*main*/
@media screen and (max-width:767px) {
  .renk-main {
    display: block;
    width: 100%;
    background-color: #F1F7F7;
  }
  .renk-main__banner {
    display: block;
    width: 100%;
  }
  .renk-main__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-main__header {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    line-height: 36px;
    text-align: center;
    padding: 30px 0;
    letter-spacing: 0.1em;
  }
  .renk-main__header > span {
    font-size: 26px;
    color: #5FA29F;
  }
  .renk-main__about {
    display: block;
    width: calc(100% + 40px);
    margin-left: -20px;
  }
  .renk-main__about > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .renk-main {
    display: block;
    width: 100%;
    background-color: #F1F7F7;
  }
  .renk-main__banner {
    display: block;
    width: 100%;
  }
  .renk-main__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-main__header {
    display: block;
    width: 100%;
    font-size: 28px;
    font-weight: 500;
    line-height: 50px;
    text-align: center;
    padding: 50px 0;
    letter-spacing: 0.1em;
  }
  .renk-main__header > span {
    font-size: 36px;
    color: #5FA29F;
  }
  .renk-main__about {
    display: block;
    width: 100%;
  }
  .renk-main__about > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .renk-main__header {
    font-size: 26px;
  }
}
/*reason*/
@media screen and (max-width:767px) {
  .renk-reason {
    display: block;
    width: 100%;
    padding: 100px 0 50px;
    margin: 0 auto;
  }
  .renk-reason__title {
    display: block;
    width: 100%;
    font-size: min(27px + (30 - 27) * ((100vw - 320px) / (375 - 320)), 30px);
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height:44px;
    padding-bottom: 50px;
  }
  .renk-reason__title > small {
    font-size: 20px;
  }
  .renk-reason__title > small > i {
    color: #5FA29F;
  }
  .renk-reason__cols {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .renk-reason__col {
    display: block;
    width: 100%;
  }
  .renk-reason__col + .renk-reason__col {
    margin-top: 50px;
  }
  .renk-reason__col > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-reason__col:nth-child(2) {
    margin-top: 50px;
  }
  .renk-reason__col:nth-child(3) {
    margin-top: 100px;
  }
}
@media screen and (min-width:768px) {
  .renk-reason {
    display: block;
    max-width: 1040px;
    width: 100%;
    padding: 100px 0;
    margin: 0 auto;
  }
  .renk-reason__title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height:55px;
    padding-bottom: 50px;
  }
  .renk-reason__title > small {
    font-size: 30px;
  }
  .renk-reason__title > small > i {
    color: #5FA29F;
  }
  .renk-reason__cols {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
  .renk-reason__col {
    display: block;
    width: calc(313/1040 * 100%);
  }
  .renk-reason__col > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-reason__col:nth-child(2) {
    margin-top: 50px;
  }
  .renk-reason__col:nth-child(3) {
    margin-top: 100px;
  }
}
/*assets*/
@media screen and (max-width:767px) {
  .renk-assets {
    display: block;
    width: 100%;
  }
  .renk-assets__content {
    display: block;
    width: 100%;
  }
  .renk-assets__title {
    display: block;
    width: 100%;
    font-size: min(23px + (25 - 23) * ((100vw - 320px) / (375 - 320)), 25px);
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 36px;
    text-align: justify;
    word-break: break-all;
  }
  .renk-assets__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .renk-assets__list {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .renk-assets__list > li {
    position: relative;
    display: block;
    width: 100%;
    padding-left: 20px;
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    color: #01444D;
    text-align: justify;
    word-break: break-all;
  }
  .renk-assets__list > li + li {
    margin-top: 10px;
  }
  .renk-assets__list > li::before {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #01444D;
  }
  .renk-assets__figure {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .renk-assets__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) {
  .renk-assets {
    position: relative;
    display: block;
    max-width: 1266px;
    width: 100%;
    min-height: 450px;
    margin: 0 auto;
  }
  .renk-assets__content {
    display: block;
    max-width: 1040px;
    width: 100%;
    padding-right: 50%;
    margin: 0 auto;
  }
  .renk-assets__title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
  }
  .renk-assets__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 50px;
  }
  .renk-assets__list {
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .renk-assets__list > li {
    position: relative;
    display: block;
    width: 100%;
    padding-left: 20px;
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    color: #01444D;
    text-align: justify;
    word-break: break-all;
  }
  .renk-assets__list > li + li {
    margin-top: 10px;
  }
  .renk-assets__list > li::before {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #01444D;
  }
  .renk-assets__figure {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: calc(553/1266 * 100%);
  }
  .renk-assets__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .renk-assets__title {
    font-size: 30px;
    line-height: 40px;
  }
  .renk-assets__txt {
    margin-top: 30px;
  }
  .renk-assets__list {
    margin-top: 30px;
  }
}
/*finance*/
@media screen and (max-width:767px) {
  .renk-finance {
    display: block;
    width: 100%;
    padding: 50px 0 100px;
  }
  .renk-finance__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 1040px;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
    border-radius: 5px;
  }
  .renk-finance__figure {
    display: block;
    width: 100%;
  }
  .renk-finance__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
    border-radius: 5px;
  }
  .renk-finance__content {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .renk-finance__title {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 35px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 10px;
  }
  .renk-finance__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) {
  .renk-finance {
    display: block;
    width: 100%;
    padding: 110px 0 100px;
  }
  .renk-finance__body {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1040px;
    width: 100%;
    padding: calc(35/1140 * 100%);
    background-color: var(--white);
    margin: 0 auto;
    border-radius: 5px;
  }
  .renk-finance__figure {
    display: block;
    width: calc(373/970 * 100%);
  }
  .renk-finance__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
    border-radius: 5px;
  }
  .renk-finance__content {
    display: block;
    width: calc(557/970 * 100%);
  }
  .renk-finance__title {
    display: block;
    width: 100%;
    font-size: 32px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 46px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 20px;
  }
  .renk-finance__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
}
/*plan*/
@media screen and (max-width:767px) {
  .renk-plan {
    display: block;
    width: 100%;
    background-color: #F1F7F7;
    padding-bottom: 50px;
  }
  .renk-main__banner {
    display: block;
    width: 100%;
  }
  .renk-main__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-plan__body {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    margin-top: -100px;
    border-radius: 5px;
    overflow: hidden;
  }
  .renk-plan__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-top: 50px;
    padding-bottom: 30px;
    background-color: rgba(255,255,255,0.9);
  }
  .renk-plan__header > span:nth-child(1) {
    font-size: 20px;
    line-height: 29px;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #5FA29F;
  }
  .renk-plan__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .renk-plan__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    background-color: rgba(255,255,255,0.9);
  }
  .renk-plan__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-top: 30px;
    background-color: rgba(255,255,255,0.9);
    padding-bottom: 50px;
    border-radius: 0 0 5px 5px;
  }
  .renk-plan-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0 10px;
  }
  .renk-plan-box + .renk-plan-box {
    margin-top: 30px;
  }
  .renk-plan-box__figure {
    display: block;
    width: calc(230/315 * 100%);
  }
  .renk-plan-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-plan-box__title {
    display: block;
    width: 100%;
    font-size: 26px;
    line-height: 37px;
    font-weight: 500;
    letter-spacing: 0.06em;
    color: #5FA29F;
    text-align: center;
    margin-top: 20px;
  }
  .renk-plan-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    margin-top: 20px;
    text-align: justify;
    word-break: break-all;
  }
  .renk-plan-box__tbl {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .renk-plan-box__row {
    display: flex;
    justify-content: space-between;
    width: 100%;
    border-bottom: 1px solid #DDDDDD;
  }
  .renk-plan-box__row > dt {
    display: block;
    width: 100px;
    padding: 10px 0 10px 10px;
    font-size: min(13px + (15 - 13) * ((100vw - 320px) / (375 - 320)), 15px);
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: #368582;
  }
  .renk-plan-box__row > dd {
    display: block;
    width: calc(100% - 100px);
    padding: 10px;
    font-size: min(13px + (15 - 13) * ((100vw - 320px) / (375 - 320)), 15px);
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .renk-plan__banner {
    position: relative;
    display: block;
    width: 100%;
    margin-top: 50px;
  }
  .renk-plan__banner-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: calc(100% - 40px);
    padding: 20px;
    background-color: rgba(255,255,255,0.8);
    border-radius: 5px;
  }
  .renk-plan__banner-title {
    display: block;
    width: 100%;
    font-size: min(15px + (20 - 15) * ((100vw - 320px) / (375 - 320)), 20px);
    font-weight: 500;
    letter-spacing: 0.06em;
    line-height: 30px;
    text-align: center;
    padding-bottom: 13px;
  }
  .renk-plan__banner-txt {
    display: block;
    width: 100%;
    font-size: min(12px + (14 - 12) * ((100vw - 320px) / (375 - 320)), 14px);
    line-height: 1.85;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .renk-plan__banner-figure {
    display: block;
    width: 100%;
  }
  .renk-plan__banner-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
    border-radius: 5px;
  }
}
@media screen and (min-width:768px) {
  .renk-plan {
    display: block;
    width: 100%;
    background-color: #F1F7F7;
    padding-bottom: 100px;
  }
  .renk-main__banner {
    display: block;
    width: 100%;
  }
  .renk-main__banner > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-plan__body {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    padding: calc(100/1140 * 100%) calc(50/1140 * 100%);
    background-color: rgba(255,255,255,0.9);
    margin-top: -150px;
    border-radius: 5px;
  }
  .renk-plan__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding-bottom: 50px;
  }
  .renk-plan__header > span:nth-child(1) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #5FA29F;
  }
  .renk-plan__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .renk-plan__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
  }
  .renk-plan__main {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-top: 50px;
  }
  .renk-plan-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(327/1040 * 100%);
  }
  .renk-plan-box__figure {
    display: block;
    width: calc(230/327 * 100%);
  }
  .renk-plan-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-plan-box__title {
    display: block;
    width: 100%;
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.06em;
    color: #5FA29F;
    text-align: center;
    margin-top: 20px;
  }
  .renk-plan-box__txt {
    display: block;
    width: 100%;
    min-height: 112px;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    margin-top: 20px;
    text-align: justify;
    word-break: break-all;
  }
  .renk-plan-box__tbl {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .renk-plan-box__row {
    display: flex;
    justify-content: space-between;
    width: 100%;
    border-bottom: 1px solid #DDDDDD;
  }
  .renk-plan-box__row > dt {
    display: block;
    width: 105px;
    padding: 10px 5px 10px 10px;
    font-size: min(12px + (15 - 12) * ((100vw - 1025px) / (1140 - 1025)), 15px);
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: #368582;
  }
  .renk-plan-box__row > dd {
    display: block;
    width: calc(100% - 105px);
    padding: 10px;
    font-size: min(12px + (15 - 12) * ((100vw - 1025px) / (1140 - 1025)), 15px);
    line-height: 20px;
    font-weight: 500;
    letter-spacing: 0.05em;
  }
  .renk-plan__banner {
    position: relative;
    display: block;
    width: 100%;
    margin-top: 85px;
  }
  .renk-plan__banner-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: calc(720/1040 * 100%);
    padding: calc(30/1040 * 100%);
    background-color: rgba(255,255,255,0.8);
    border-radius: 5px;
  }
  .renk-plan__banner-title {
    display: block;
    width: 100%;
    font-size: 26px;
    font-weight: 500;
    letter-spacing: 0.06em;
    line-height: 37px;
    text-align: center;
    padding-bottom: 13px;
  }
  .renk-plan__banner-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
  }
  .renk-plan__banner-figure {
    display: block;
    width: 100%;
  }
  .renk-plan__banner-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
    border-radius: 5px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .renk-plan-box__txt {
    min-height: 140px;
    font-size: 13px;
  }
  .renk-plan-box__row > dt {
    width: 65px;
    padding: 10px 5px;
    font-size: 11px;
    letter-spacing: 0;
    color: #368582;
  }
  .renk-plan-box__row > dd {
    width: calc(100% - 65px);
    padding: 10px 5px;
    font-size: 11px;
    letter-spacing: 0;
  }
  .renk-plan__banner-title {
    font-size: 18px;
    line-height: 27px;
    padding-bottom: 5px;
  }
  .renk-plan__banner-txt {
    font-size: 13px;
    line-height: 20px;
  }
}
/*work*/
@media screen and (max-width:767px) {
  .renk-work {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .renk-work__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 50px 0 50px;
  }
  .renk-work__header > span:nth-child(1) {
    font-size: 20px;
    line-height: 29px;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #5FA29F;
  }
  .renk-work__header > span:nth-child(2) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .renk-work__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    padding-bottom: 50px;
  }
  .renk-work__title {
    display: block;
    width: 100%;
    font-size: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 35px;
    text-align: center;
    padding-bottom: 30px;
  }
  .renk-work__title > span {
    color: #FF523E;
  }
  .renk-work__intro {
    display: block;
    width: 100%;
  }
  .renk-work__intro-figure {
    display: block;
    width: 100%;
  }
  .renk-work__intro-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-work__intro-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    padding:30px 0 50px;
  }
  .renk-work__intro-cols {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .renk-work__intro-col {
    display: block;
    width: calc(295/335 * 100%);
  }
  .renk-work__intro-col > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-work__intro-tbl {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .renk-work__intro-tbl_row {
    display: flex;
    flex-direction: column;
    width: 100%;
  }
  .renk-work__intro-tbl_row:not(:last-child) {
    border-bottom: 1px solid #DBDBDB;
  }
  .renk-work__intro-tbl_row > dt {
    display: block;
    width: 1100%;
    padding: 10px 0;
    font-size: 15px;
    font-weight: 500;
    line-height: 25.5px;
    letter-spacing: 0.07em;
  }
  .renk-work__intro-tbl_row > dd {
    display: block;
    width: 100%;
    padding: 10px 0;
    font-size: 15px;
    font-weight: 500;
    line-height: 25.5px;
    letter-spacing: 0.07em;
  }
}
@media screen and (min-width:768px) {
  .renk-work {
    display: block;
    width: 100%;
    background-color: var(--white);
  }
  .renk-work__header {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 100px 0 50px;
  }
  .renk-work__header > span:nth-child(1) {
    font-size: 30px;
    line-height: 44px;
    font-weight: 500;
    letter-spacing: 0.1em;
    color: #5FA29F;
  }
  .renk-work__header > span:nth-child(2) {
    font-size: 38px;
    line-height: 55px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .renk-work__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    padding-bottom: 50px;
  }
  .renk-work__title {
    display: block;
    width: 100%;
    font-size: 32px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 46px;
    text-align: center;
    padding-bottom: 30px;
  }
  .renk-work__title > span {
    color: #FF523E;
  }
  .renk-work__intro {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
  }
  .renk-work__intro-figure {
    display: block;
    width: 100%;
  }
  .renk-work__intro-figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-work__intro-txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: center;
    padding:30px 0 50px;
  }
  .renk-work__intro-cols {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .renk-work__intro-col {
    display: block;
    width: calc(470/1040 * 100%);
  }
  .renk-work__intro-col > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-work__intro-tbl {
    display: block;
    width: 50%;
  }
  .renk-work__intro-tbl_row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .renk-work__intro-tbl_row:not(:last-child) {
    border-bottom: 1px solid #DBDBDB;
  }
  .renk-work__intro-tbl_row > dt {
    display: block;
    width: 180px;
    padding: 20px 10px 20px 20px;
    font-size: 15px;
    font-weight: 500;
    line-height: 25.5px;
    letter-spacing: 0.07em;
  }
  .renk-work__intro-tbl_row > dd {
    display: block;
    width: calc(100% - 180px);
    padding: 20px 20px 20px 10px;
    font-size: 15px;
    font-weight: 500;
    line-height: 25.5px;
    letter-spacing: 0.07em;
  }
}
/*before after*/
@media screen and (max-width:767px) {
  .renk-work-ba {
    display: block;
    width: 100%;
    padding: 50px 0;
  }
  .renk-work-ba__title {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
    padding:0 0 30px;
  }
  .renk-work-ba-sildes {
    position: relative;
    display: block;
    width: calc(100% + 40px);
    padding: 0 25px 30px;
    margin-left: -20px;
  }
  .renk-work-ba-sildes::before,
  .renk-work-ba-sildes::after {
    content: "";
    position: absolute;
    top: 0;
    z-index: 5;
    display: block;
    width: 25px;
    height: 100%;
    background-color: var(--white);
  }
  .renk-work-ba-sildes::before {
    left: 0;
  }
  .renk-work-ba-sildes::after {
    right: 0;
  }
  .renk-work-ba-sildes > .swiper-wrapper {
    width: 100%;
  }
  .renk-work-ba-sildes > .swiper-wrapper > .swiper-slide {
    width: 100%;
  }
  .renk-work-ba__figure {
    display: block;
    width: 100%;
    padding: 20px;
    background-color: #DCF2F2;
    border-radius: 5px;
    box-sizing: border-box;
    overflow: hidden;
  }
  .renk-work-ba__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  /*navigation*/
  .renk-work-ba-sildes .swiper-button-prev {
    width: 13px;
    height: 21px;
    top: 50%;
    left: 4px;
    background-image: url(./assets/images/renk/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);*/
  }
 .renk-work-ba-sildes .swiper-button-next {
    width: 13px;
    height: 21px;
    top: 50%;
    right: 5px;
    background-image: url(./assets/images/renk/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);*/
  }
  .renk-work-ba-sildes .swiper-navigation-icon, .renk-work-ba-sildes .swiper-navigation-icon {
    display: none;
  }
  /*swiper-pagination*/
  .renk-work-ba-sildes .swiper-pagination {
    bottom: 2px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .renk-work-ba-sildes .swiper-pagination-bullet {
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #D3D3D3;
    opacity: 1;
    margin: 0 5px !important;
  }
  .renk-work-ba-sildes .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #5FA29F;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .renk-work-ba {
    display: block;
    width: 100%;
    padding: 100px 0;
  }
  .renk-work-ba__title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
    padding:0 0 30px;
  }
  .renk-work-ba-sildes {
    position: relative;
    display: block;
    width: calc(100% + 40px);
    padding: 0 25px 30px;
    margin-left: -20px;
  }
  .renk-work-ba-sildes::before,
  .renk-work-ba-sildes::after {
    content: "";
    position: absolute;
    top: 0;
    z-index: 5;
    display: block;
    width: 25px;
    height: 100%;
    background-color: var(--white);
  }
  .renk-work-ba-sildes::before {
    left: 0;
  }
  .renk-work-ba-sildes::after {
    right: 0;
  }
  .renk-work-ba-sildes > .swiper-wrapper {
    width: 100%;
  }
  .renk-work-ba-sildes > .swiper-wrapper > .swiper-slide {
    width: 100%;
  }
  .renk-work-ba__figure {
    display: block;
    width: 100%;
    padding: calc(50/1040 * 100%) calc(30/1040 * 100%);
    background-color: #DCF2F2;
    border-radius: 5px;
    box-sizing: border-box;
    overflow: hidden;
  }
  .renk-work-ba__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  /*navigation*/
  .renk-work-ba-sildes .swiper-button-prev {
    width: 20px;
    height: 33px;
    top: 50%;
    left: 0;
    background-image: url(./assets/images/renk/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);*/
  }
 .renk-work-ba-sildes .swiper-button-next {
    width: 20px;
    height: 33px;
    top: 50%;
    right: 0;
    background-image: url(./assets/images/renk/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);*/
  }
  .renk-work-ba-sildes .swiper-navigation-icon, .renk-work-ba-sildes .swiper-navigation-icon {
    display: none;
  }
  /*swiper-pagination*/
  .renk-work-ba-sildes .swiper-pagination {
    bottom: 2px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .renk-work-ba-sildes .swiper-pagination-bullet {
    display: block;
    width: 14px;
    height: 14px;
    border-radius: 7px;
    background-color: #D3D3D3;
    opacity: 1;
    margin: 0 5px !important;
  }
  .renk-work-ba-sildes .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #5FA29F;
  }
}
@media screen and (min-width:1025px) {
  .renk-work-ba {
    display: block;
    width: 100%;
    padding: 100px 0;
  }
  .renk-work-ba__title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    letter-spacing: 0.1em;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
    padding:0 50px 30px;
  }
  .renk-work-ba-sildes {
    position: relative;
    display: block;
    width: 100%;
    padding: 0 50px 30px;
  }
  .renk-work-ba-sildes::before,
  .renk-work-ba-sildes::after {
    content: "";
    position: absolute;
    top: 0;
    z-index: 5;
    display: block;
    width: 50px;
    height: 100%;
    background-color: var(--white);
  }
  .renk-work-ba-sildes::before {
    left: 0;
  }
  .renk-work-ba-sildes::after {
    right: 0;
  }
  .renk-work-ba-sildes > .swiper-wrapper {
    width: 100%;
  }
  .renk-work-ba-sildes > .swiper-wrapper > .swiper-slide {
    width: 100%;
  }
  .renk-work-ba__figure {
    display: block;
    width: 100%;
    padding: calc(50/1040 * 100%) calc(30/1040 * 100%);
    background-color: #DCF2F2;
    border-radius: 5px;
    box-sizing: border-box;
    overflow: hidden;
  }
  .renk-work-ba__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  /*navigation*/
  .renk-work-ba-sildes .swiper-button-prev {
    width: 25px;
    height: 40px;
    top: 50%;
    left: 0;
    background-image: url(./assets/images/renk/prev.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);*/
  }
 .renk-work-ba-sildes .swiper-button-next {
    width: 25px;
    height: 40px;
    top: 50%;
    right: 0;
    background-image: url(./assets/images/renk/next.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*margin-top: calc(0px - (var(--swiper-navigation-size)/ 2) - 20px);*/
  }
  .renk-work-ba-sildes .swiper-navigation-icon, .renk-work-ba-sildes .swiper-navigation-icon {
    display: none;
  }
  /*swiper-pagination*/
  .renk-work-ba-sildes .swiper-pagination {
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .renk-work-ba-sildes .swiper-pagination-bullet {
    display: block;
    width: 14px;
    height: 14px;
    border-radius: 7px;
    background-color: #D3D3D3;
    opacity: 1;
    margin: 0 5px !important;
  }
  .renk-work-ba-sildes .swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #5FA29F;
  }
}
/*voice*/
@media screen and (max-width:767px) {
  .renk-voice {
    display: block;
    width: 100%;
    padding-bottom: 50px;
  }
  .renk-voice__title {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 30px;
  }
  .renk-voice__title > span:nth-child(1) {
    font-size: 30px;
    font-weight: 500;
    line-height: 44px;
  }
  .renk-voice__title > span:nth-child(2) {
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
    color: #01444D;
    margin-top: 5px;
  }
  .renk-voice__main {
    display: block;
    width: 100%;
  }
  .renk-voice-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .renk-voice-box + .renk-voice-box {
    margin-top: 40px;
  }
  .renk-voice-box__figure {
    display: block;
    width: calc(180/335 * 100%);
  }
  .renk-voice-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-voice-box__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin-top: 30px;
  }
  .renk-voice-box__badge {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 30px;
    border-radius: 15px;
    padding: 0 20px;
    background-color: #01444D;
    font-size: min(13px + (15 - 13) * ((100vw - 320px) / (375 - 320)), 15px);
    font-weight: 500;
    line-height: 1;
    color: var(--white);
    letter-spacing: 0.1em;
  }
  .renk-voice-box__title {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 500;
    line-height: 30px;
    color: #333333;
    margin-top: 15px;
    text-align: justify;
    word-break: break-all;
  }
  .renk-voice-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    margin-top: 15px;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) {
  .renk-voice {
    display: block;
    max-width: 1040px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 100px;
  }
  .renk-voice__title {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    width: 100%;
    padding-bottom: 50px;
  }
  .renk-voice__title > span:nth-child(1) {
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    padding-right: 20px;
  }
  .renk-voice__title > span:nth-child(2) {
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    color: #01444D;
    padding-bottom: 5px;
  }
  .renk-voice__main {
    display: block;
    width: 100%;
  }
  .renk-voice-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .renk-voice-box:nth-child(even) {
    flex-direction: row-reverse;
  }
  .renk-voice-box + .renk-voice-box {
    margin-top: 70px;
  }
  .renk-voice-box__figure {
    display: block;
    width: calc(200/1040 * 100%);
  }
  .renk-voice-box__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-voice-box__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: calc(810/1040 * 100%);
  }
  .renk-voice-box__badge {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: 30px;
    border-radius: 15px;
    padding: 0 20px;
    background-color: #01444D;
    font-size: 15px;
    font-weight: 500;
    line-height: 1;
    color: var(--white);
    letter-spacing: 0.1em;
  }
  .renk-voice-box__title {
    display: block;
    width: 100%;
    font-size: 22px;
    font-weight: 500;
    line-height: 40px;
    color: #333333;
    margin-top: 15px;
  }
  .renk-voice-box__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    margin-top: 15px;
  }
  .renk-voice-box:nth-child(even) .renk-voice-box__content {
    align-items: flex-end;
  }
  .renk-voice-box:nth-child(even) .renk-voice-box__title {
    text-align: right;
  }
  .renk-voice-box:nth-child(even) .renk-voice-box__txt {
    text-align: right;
  }
}
/*partner*/
@media screen and (max-width:767px) {
  .renk-partner {
    display: block;
    width: 100%;
    padding: 80px 0 50px;
    background-color: #F1F7F7;
  }
  .renk-partner-intro {
    display: block;
    width: 100%;
  }
  .renk-partner-intro__figure {
    display: block;
    width: calc(100% + 40px);
    margin-left:-20px;
  }
  .renk-partner-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-partner-intro__content {
    position: relative;
    z-index: 1;
    display: block;
    width: calc(100% + 20px);
    padding: 20px;
    background-color: rgba(255,255,255,0.95);
    border-radius: 5px;
    margin-top: -100px;
    margin-left: -10px;
  }
  .renk-partner-intro__header {
    display: block;
    width: 100%;
    font-size: 20px;
    font-weight: 500;
    line-height: 30px;
    text-align: justify;
    word-break: break-all;
  }
  .renk-partner-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 20px;
  }
  .renk-partner-intro__list {
    display: block;
    width: 100%;
    margin-top: 20px;
  }
  .renk-partner-intro__list > li {
    position: relative;
    display: block;
    width: 100%;
    padding-left: 20px;
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    color: #01444D;
    text-align: justify;
    word-break: break-all;
  }
  .renk-partner-intro__list > li + li {
    margin-top: 10px;
  }
  .renk-partner-intro__list > li::before {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #01444D;
  }
}
@media screen and (min-width:768px) {
  .renk-partner {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-color: #F1F7F7;
  }
  .renk-partner-intro {
    display: block;
    max-width: 1070px;
    width: 100%;
    margin: 0 auto;
  }
  .renk-partner-intro__figure {
    display: block;
    width: calc(1020/1070 * 100%);
    margin-left: auto;
  }
  .renk-partner-intro__figure > img {
    display: block;
    width: 100%;
    object-fit: cover;
  }
  .renk-partner-intro__content {
    position: relative;
    z-index: 1;
    display: block;
    width: calc(920/1070 * 100%);
    padding: calc(50/1070 * 100%);
    background-color: rgba(255,255,255,0.95);
    border-radius: 5px;
    margin-top: -105px;
  }
  .renk-partner-intro__header {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 20px;
  }
  .renk-partner-intro__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    text-align: justify;
    word-break: break-all;
    margin-top: 30px;
  }
  .renk-partner-intro__list {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
  .renk-partner-intro__list > li {
    position: relative;
    display: block;
    width: 100%;
    padding-left: 20px;
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    color: #01444D;
    text-align: justify;
    word-break: break-all;
  }
  .renk-partner-intro__list > li + li {
    margin-top: 10px;
  }
  .renk-partner-intro__list > li::before {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    display: block;
    width: 5px;
    height: 5px;
    border-radius: 3px;
    background-color: #01444D;
  }
}
/*faq*/
@media screen and (max-width:767px) {
  .renk-faq {
    display: block;
    width: 100%;
    padding-top: 100px;
  }
  .renk-faq__title {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 40px;
    letter-spacing: 0.1em;
    text-align: center;
    padding-bottom: 30px;
  }
  .renk-faq-list {
    display: block;
    width: 100%;
  }
  .renk-faq-list > li {
    display: block;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
    border-radius: 5px;
  }
  .renk-faq-list > li + li {
    margin-top: 50px;
  }
  .renk-faq-question {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 40px;
    font-size: 16px;
    font-weight: 500;
    line-height: 28px;
    font-family: var(--noto-serif);
    color: #5FA29F;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding: 0 25px 0px 40px;
  }
  .renk-faq-question::before {
    content: "Q";
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    background-color: #5FA29F;
    border-radius: 20px;
    color: var(--white);
    font-family: var(--noto-serif);
    font-size: 20px;
    font-weight: 500;
    padding-bottom: 5px;
  }
  .renk-faq-question > i {
    position: absolute;
    top: 13px;
    right: 0;
    display: block;
    width: 15px;
    height: 15px;
  }
  .renk-faq-question > i::before,
  .renk-faq-question > i::after {
    content: "";
    position: absolute;
    transform: translate(-50%,-50%);
    display: block;
    background-color: #5FA29F;
  }
 .renk-faq-question > i::before {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 2px;
  }
  .renk-faq-question > i::after {
    top: calc(50% - 0.035rem);
    left: calc(50% - 0.045rem);
    width: 100%;
    height: 2px;
    transform: rotate(90deg) translate(-50%,-50%);
    transform-origin: 0 50%;
    transition: 0.3s ease;
  }
  .renk-faq-question.active > i::after {
    top: 50%;
    left: 50%;
    transform: rotate(0deg) translate(-50%,-50%);
    transform-origin: 0 0%;
  }
  .renk-faq-answer__wrap {
    display: none;
    width: 100%;
  }
  .renk-faq-answer__main {
    position: relative;
    display: block;
    width: 100%;
    padding: 15px 0 0 40px;
    margin-top: 15px;
    border-top: 1px solid #E9E9E9;
  }
  .renk-faq-answer__main::before {
    content: "A";
    position: absolute;
    top: 15px;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 30px;
    height: 30px;
    color: #5FA29F;
    font-family: var(--noto-serif);
    font-size: 20px;
    font-weight: 500;
    padding-bottom: 5px;
  }
  .renk-faq-answer__txt {
    display: block;
    width: 100%;
    font-size: 14px;
    line-height: 26px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
  }
}
@media screen and (min-width:768px) {
  .renk-faq {
    display: block;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
    padding-top: 100px;
  }
  .renk-faq__title {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: center;
    padding-bottom: 50px;
  }
  .renk-faq-list {
    display: block;
    width: 100%;
  }
  .renk-faq-list > li {
    display: block;
    width: 100%;
    padding: 20px;
    background-color: var(--white);
    border-radius: 5px;
  }
  .renk-faq-list > li + li {
    margin-top: 50px;
  }
  .renk-faq-question {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 40px;
    font-size: 20px;
    font-weight: 500;
    line-height: 40px;
    font-family: var(--noto-serif);
    color: #5FA29F;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
    padding: 0 30px 0px 50px;
  }
  .renk-faq-question::before {
    content: "Q";
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    background-color: #5FA29F;
    border-radius: 20px;
    color: var(--white);
    font-family: var(--noto-serif);
    font-size: 26px;
    font-weight: 500;
    padding-bottom: 5px;
  }
  .renk-faq-question > i {
    position: absolute;
    top: 11px;
    right: 5px;
    display: block;
    width: 20px;
    height: 20px;
  }
  .renk-faq-question > i::before,
  .renk-faq-question > i::after {
    content: "";
    position: absolute;
    transform: translate(-50%,-50%);
    display: block;
    background-color: #5FA29F;
  }
 .renk-faq-question > i::before {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 2px;
  }
  .renk-faq-question > i::after {
    top: calc(50% - 0.035rem);
    left: calc(50% - 0.045rem);
    width: 100%;
    height: 2px;
    transform: rotate(90deg) translate(-50%,-50%);
    transform-origin: 0 50%;
    transition: 0.3s ease;
  }
  .renk-faq-question.active > i::after {
    top: 50%;
    left: 50%;
    transform: rotate(0deg) translate(-50%,-50%);
    transform-origin: 0 0%;
  }
  .renk-faq-answer__wrap {
    display: none;
    width: 100%;
  }
  .renk-faq-answer__main {
    position: relative;
    display: block;
    width: 100%;
    padding: 25px 0 0 50px;
    margin-top: 25px;
    border-top: 1px solid #E9E9E9;
  }
  .renk-faq-answer__main::before {
    content: "A";
    position: absolute;
    top: 25px;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    color: #5FA29F;
    font-family: var(--noto-serif);
    font-size: 26px;
    font-weight: 500;
    padding-bottom: 5px;
  }
  .renk-faq-answer__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.05em;
    text-align: justify;
    word-break: break-all;
  }
}
/*cta*/
@media screen and (max-width:767px) {
  .renk-cta {
    display: block;
    width: 100%;
    padding: 100px 0;
    background-image: url(./assets/images/renk/cta-sp.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .renk-cta__body {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .renk-cta__content {
    display: block;
    width: 100%;
    padding-bottom: 30px;
  }
  .renk-cta__header {
    display: block;
    width: 100%;
    font-size: 30px;
    font-weight: 500;
    line-height: 44px;
    color: var(--white);
    text-align: center;
    padding-bottom: 20px;
  }
  .renk-cta__txt {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
  }
  .renk-cta__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 335px;
    width: 100%;
    height: 80px;
    font-size: min(20px + (24 - 20) * ((100vw - 320px) / (375 - 320)), 24px);
    font-weight: 500;
    color: var(--white);
    line-height: 1;
    letter-spacing: 0.07em;
    background-color: #28CBC3;
    background-image: url(./assets/images/renk/icon-btn.png);
    background-repeat: no-repeat;
    background-position: right 20px center;
    background-size: 12px auto;
  }
  .renk-cta__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) {
  .renk-cta {
    display: block;
    width: 100%;
    padding: 135px 0;
    background-image: url(./assets/images/renk/cta-pc.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
  .renk-cta__body {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
  }
  .renk-cta__content {
    display: block;
    width: calc(430/900 * 100%);
  }
  .renk-cta__header {
    display: block;
    width: 100%;
    font-size: 48px;
    font-weight: 500;
    line-height: 60px;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
    padding-bottom: 20px;
  }
  .renk-cta__txt {
    display: block;
    width: 100%;
    font-size: 15px;
    line-height: 28px;
    letter-spacing: 0.07em;
    color: var(--white);
    text-align: justify;
    word-break: break-all;
  }
  .renk-cta__btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: calc(400/900 * 100%);
    height: 120px;
    font-size: 26px;
    font-weight: 500;
    color: var(--white);
    line-height: 1;
    letter-spacing: 0.07em;
    background-color: #28CBC3;
    background-image: url(./assets/images/renk/icon-btn.png);
    background-repeat: no-repeat;
    background-position: right 20px center;
    background-size: 12px auto;
  }
  .renk-cta__btn:hover {
    transition: opacity 0.3s ease;
    opacity: 0.85;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .renk-cta__btn {
    height: 100px;
    font-size: 20px;
  }
}
/*
PAGE - r-reserve, confirm, thanks
--------------------------------------------- */
@media screen and (max-width:767px) {
  .r-reserve__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .r-reserve__header > span:nth-child(1) {
    font-size: 16px;
    line-height: 23px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .r-reserve__header > span:nth-child(2) {
    font-size: min(20px + (24 - 20) * ((100vw - 320px) / (375 - 320)), 24px);
    line-height: 36px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .site-form__subtitle {
    display: block;
    width: 100%;
    font-size: 24px;
    font-weight: 500;
    line-height: 35px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 30px;
  }
  .r-reserve-mandatory {
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) {
  .r-reserve__header {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding-bottom: 50px;
  }
  .r-reserve__header > span:nth-child(1) {
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    letter-spacing: 0.1em;
  }
  .r-reserve__header > span:nth-child(2) {
    font-size: 44px;
    line-height: 64px;
    font-weight: 500;
    letter-spacing: 0.1em;
    margin-top: 5px;
  }
  .site-form__subtitle {
    display: block;
    width: 100%;
    font-size: 38px;
    font-weight: 500;
    line-height: 55px;
    letter-spacing: 0.1em;
    text-align: justify;
    word-break: break-all;
    padding-bottom: 50px;
  }
  .r-reserve-mandatory {
    margin-top: 30px;
  }
}
@media screen and (min-width:768px) and (max-width:1024px) {
  .r-reserve__header > span:nth-child(2) {
    font-size: 40px;
  }
}

.no-img div{
width:100%;
aspect-ratio: 1;
height: max-content;
background-color: #f6f6f6;
}