@charset "UTF-8";

@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Noto+Serif+JP:wght@400;500;700&display=swap");

/* ---------------------------------------------------------------------------
//  base
--------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  .header .nav {
    display: block;
  }
  header .navigation {
    display: none !important;
  }
  .sp {
    display: block;
  }
  .pc {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none !important;
  }
  *::before,
  *::after {
    box-sizing: border-box;
  }
  html,
  body {
    width: 100%;
    height: 100%;
  }
  html {
    overflow-y: visible;
  }
  html > * {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
  body {
    min-width: 100%;
    overflow-x: hidden;
  }
  body.fixed {
    position: fixed;
    width: 100%;
    height: 100%;
  }
  img,
  iframe {
    border: 0;
    vertical-align: bottom;
  }
  img {
    width: 100%;
    height: auto;
  }
  ul,
  ol {
    list-style-type: none;
  }
  a {
    text-decoration: none;
  }
  mark {
    font-weight: bold;
    color: inherit;
    background-color: transparent;
  }
  em {
    font-style: normal;
  }
  address {
    font-style: normal;
  }
  table {
    border-collapse: collapse;
    border-spacing: 0;
  }
  input,
  select {
    vertical-align: baseline;
  }

  .cf::after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
  }

  :root {
    --sans: "Noto Sans JP", sans-serif;
    --serif: "Noto Serif JP", serif;
    --fz10: 10px;
    --fz11: 11px;
    --fz12: 12px;
    --fz13: 13px;
    --fz14: 14px;
    --fz15: 15px;
    --fz16: 16px;
    --fz18: 18px;
    --fz20: 20px;
    --grn: #0f3630;
  }

  /* ---------------------------------------------------------------------------
//  all
--------------------------------------------------------------------------- */
  body {
    font-family: var(--sans) !important;
    font-weight: 400 !important;
    font-size: var(--fz12) !important;
    color: #000 !important;
    line-height: 1.8 !important;
    background: #fff !important;
  }
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-weight: 500 !important;
    line-height: 1.4 !important;
  }
  a {
    color: #000;
  }

  .preload a {
    transition: none !important;
  }

  .wrap {
    min-width: 360px;
    margin: 0 auto;
    padding-top: 60px;
  }
  .inner {
    width: 100%;
    height: 100%;
    padding: 0 20px;
    margin: 0 auto;
    position: relative;
  }

  ul.indent li {
    text-indent: -1em;
    padding-left: 1em;
  }
  ul.dot li::before {
    content: "・";
  }
  ol.num {
    counter-reset: li;
  }
  ol.num > li {
    text-indent: -1.2em;
    padding-left: 1.2em;
  }
  ol.num > li:before {
    content: counter(li) ".";
    counter-increment: li;
    padding-right: 5px;
  }
  ol.brackets {
    counter-reset: li;
  }
  ol.brackets > li {
    text-indent: -1.55em;
    padding-left: 1.55em;
  }
  ol.brackets > li:nth-child(n + 10) {
    text-indent: -2.1em;
    padding-left: 2.1em;
  }
  ol.brackets > li:before {
    content: "(" counter(li) ")";
    counter-increment: li;
    padding-right: 5px;
  }
  hr {
    display: block;
    height: 1px;
    border: none;
    border-top: 1px solid #c0c0c0;
    margin: 1em 0;
  }
  hr.m2 {
    display: block;
    height: 1px;
    border: none;
    border-top: 1px solid #c0c0c0;
    margin: 2em 0;
  }
  img.cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  img.contain {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .text-overflow {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }
  .sml {
    font-size: 85%;
    line-height: 1.5;
  }
  .t-center {
    text-align: center;
  }
  .t-right {
    text-align: right;
  }
  p.indent {
    text-indent: -1em;
    padding-left: 1em;
  }

  .flex {
    display: flex;
    justify-content: space-between;
  }
  .flex.jstart {
    justify-content: flex-start;
  }
  .flex.jend {
    justify-content: flex-end;
  }
  .flex.jcenter {
    justify-content: center;
  }
  .flex.fwrap {
    flex-wrap: wrap;
  }
  .flex.fwrap.bottom > * {
    margin-bottom: 20px;
  }
  .flex.istart {
    align-items: flex-start;
  }
  .flex.iend {
    align-items: flex-end;
  }
  .flex.icenter {
    align-items: center;
    text-decoration: none;
	width:100%;
  }
  .title_left {
    display: flex;
     width: 100%;
    }
  .flex.half > * {
    width: 48.5%;
  }
  .flex.half50 > * {
    width: 50%;
  }
  .flex.third > * {
    width: 31%;
  }
  .flex.quarter > * {
    width: 24%;
  }
  .flex.reverse {
    flex-flow: row-reverse;
  }
  .flex.third.fwrap::after {
    content: "";
    width: 31%;
    display: block;
  }
  .flex.quarter.fwrap::before {
    content: "";
    width: 24%;
    display: block;
    order: 1;
  }
  .flex.quarter.fwrap::after {
    content: "";
    width: 24%;
    display: block;
  }
  .text .icon img{
    display: none;
  }

  /* ---------------------------------------------------------------------------
//  header
--------------------------------------------------------------------------- */
  header {
    min-width: 360px;
    width: 100%;
    height: 60px;
    padding: 0 10px 0 20px;
    background: rgba(255, 255, 255, 0.95);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.1);
  }
  header .flex {
    height: 100%;
  }
  header .logo {
    width: 146px;
    margin-right: 10px;
  }
  header .anniversary {
    width: 29px;
  }
  header .icon {
    width: 21px;
    margin-left: 10px;
  }
  header a.trigger {
    width: 40px;
    height: 40px;
    margin-left: 10px;
  }

  header a.trigger {
    background: url(../img/menu-on.png) center center / 30px no-repeat;
  }
  header a.trigger.active {
    background: url(../img/menu-off.png) center center / 30px no-repeat;
  }

  header .line {
    width: 1px;
    height: 30px;
    border-left: 1px solid rgba(0, 0, 0, 0.3);
    opacity: 0.5;
  }

  /* ---------------------------------------------------------------------------
//  nav
--------------------------------------------------------------------------- */

  .nav {
    display: none;
    position: fixed;
    top: 60px;
    left: 0;
    width: 100%;
    height: calc(100vh - 60px);
    background: rgba(255, 255, 255, 0.95);
    z-index: 9998;
    border-top: 1px solid rgba(0, 0, 0, 0.2);
  }
  .nav-scroll {
    width: 100%;
    height: 100%;
    overflow-y: auto;
  }

  .mainmenu {
    padding-bottom: 80px;
  }
  .mainmenu .main .item {
    font-size: var(--fz14);
    font-weight: 500;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  }
  .mainmenu .main a {
    display: block;
    padding: 12px 20px;
    position: relative;
  }
  .mainmenu .main a::after {
    content: "❯";
    font-size: 12px;
    color: #8c8c8c;
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
  }

  .mainmenu .main .parent {
    padding: 12px 20px;
    position: relative;
  }
  .mainmenu .main .parent::after {
    content: "";
    background: url(../img/aco-down.png) center center / cover no-repeat;
    width: 13px;
    height: 8px;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
  }
  .mainmenu .main .parent.active::after {
    background: url(../img/aco-up.png) center center / cover no-repeat;
  }

  .mainmenu .main .child {
    display: none;
    border-top: 1px solid rgba(0, 0, 0, 0.2);
  }
  .mainmenu .main .child a {
    display: block;
    font-size: var(--fz12);
    font-weight: 400;
    padding: 8px 20px 8px 0;
    margin-left: 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  }
  .mainmenu .main .child a:last-child {
    border-bottom: none;
  }

  .mainmenu .btn {
    padding: 20px 20px 0;
  }
  .mainmenu .btn a {
    display: block;
    border: 1px solid var(--grn);
    font-size: var(--fz14);
    font-weight: 500;
    color: var(--grn);
    padding: 12px 15px;
    position: relative;
    margin-bottom: 15px;
  }
  .mainmenu .btn a::after {
    content: "❯";
    font-size: 12px;
    color: #8c8c8c;
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
  }
  .mainmenu .btn a::before {
    content: "";
    display: inline-block;
    margin-right: 8px;
  }
  .mainmenu .btn a.contact::before {
    background: url(../img/icon-mail.png) center center / contain no-repeat;
    width: 24px;
    height: 24px;
    vertical-align: -7px;
  }
  .mainmenu .btn a.request::before {
    background: url(../img/icon-request.png) center center / contain no-repeat;
    width: 18px;
    height: 24px;
    vertical-align: -9px;
  }
  .mainmenu .btn a.reserve::before {
    background: url(../img/icon-reserve.png) center center / contain no-repeat;
    width: 24px;
    height: 24px;
    vertical-align: -7px;
  }

  .mainmenu .bnr {
    padding: 20px 20px 0;
  }
  .mainmenu .bnr a {
    display: block;
    background: var(--grn);
    font-size: var(--fz14);
    font-weight: 500;
    color: #fff;
    padding: 12px 15px;
    position: relative;
    margin-bottom: 15px;
  }
  .mainmenu .bnr a::after {
    content: "";
    display: block;
    background: url(../img/icon-link-w.png) center center / contain no-repeat;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }

  .mainmenu .little {
    padding: 0 20px 20px;
  }
  .mainmenu .little li {
    margin-bottom: 5px;
  }
  .mainmenu .sns {
    padding: 0 20px;
  }
  .mainmenu .sns a {
    width: 24px;
    margin: 0 5px;
  }

  /* --------------------------------------------------------------------------- */

  nav.bottom {
    min-width: 360px;
    width: 100%;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 9999;
    background: var(--grn);
    padding: 10px;
  }
  nav.bottom .flex > div {
    width: calc(100% / 3);
    border-right: 1px solid rgba(255, 255, 255, 0.5);
  }
  nav.bottom .flex > div:last-child {
    border-right: none;
  }
  nav.bottom a {
    display: block;
    padding: 2px 0;
    color: #fff;
    text-align: center;
    font-size: var(--fz13);
    position: relative;
  }
  nav.bottom a::before {
    content: "";
    display: inline-block;
    margin-right: 6px;
    vertical-align: middle;
  }
  nav.bottom div:nth-child(1) a::before {
    background: url(../img/nav-bottom1.png) center center / contain
      no-repeat;
    width: 17px;
    height: 22px;
  }
  nav.bottom div:nth-child(2) a::before {
    background: url(../img/nav-bottom2.png) center center / contain
      no-repeat;
    width: 22px;
    height: 22px;
  }
  nav.bottom div:nth-child(3) a::before {
    background: url(../img/nav-bottom3.png) center center / contain
      no-repeat;
    width: 17px;
    height: 21px;
  }

  /* --------------------------------------------------------------------------- */

  nav.pagelink {
    padding: 20px;
    background: #f5f5f5;
  }
  nav.pagelink a {
    background: #fff;
    padding: 20px 10px;
    text-align: center;
    margin-bottom: 10px;
  }
  nav.pagelink dt {
    font-size: var(--fz14);
    font-weight: 500;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
  }
  nav.pagelink dd {
    font-size: var(--fz11);
    min-height: 3.6em;
  }

  nav.pagelink.top-page {
    background: #fff;
    padding: 40px 20px;
  }

  .pagelink.top-page .grid2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 0 auto 20px;
  }
  .pagelink.top-page .grid2 a {
    margin: 0 !important;
    background-color: #fff;
    color: #000;
    text-decoration: none;
    padding: 20px 10px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: background-color 0.3s ease;
  }
  .pagelink.top-page .grid2 a:hover {
    background-color: #eee;
  }

  nav.pagelink.top-page .grid2 a {
    background: #8e8e8e;
    color: #fff;
  }

  nav.pagelink.top-page .zeh-bnr {
    margin-top: 10px;
    display: block;
    background: none;
    border: 1px solid var(--grn);
    color: var(--grn);
    text-align: center;
    font-size: var(--fz14);
    padding: 15px;
    position: relative;
  }

  /* ---------------------------------------------------------------------------
//  aside
--------------------------------------------------------------------------- */
  .contact-box {
    padding: 20px;
    background: #757575;
  }
  .contact-box .request {
    background: #fff;
  }
  .contact-box .request .image {
    width: 40%;
  }
  .contact-box .request .text {
    width: 60%;
    padding: 20px 30px 20px 20px;
    position: relative;
    text-decoration: none;
  }
  .contact-box .request .text::after {
    content: "❯";
    color: var(--grn);
    font-size: 16px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }

  .contact-box .request h2 {
    font-family: var(--sans);
    font-size: var(--fz14);
  }
  .contact-box .request h2::before {
    content: "";
    display: inline-block;
    margin-right: 6px;
    vertical-align: middle;
    background: url(../img/icon-request.png) center center / contain
      no-repeat;
    width: 18px;
    height: 24px;
  }
  .contact-box .request p {
    font-size: var(--fz11) !important;
  }

  .contact-box .contact {
    margin-bottom: 20px;
  }
  .contact-box .contact h2 {
    font-family: var(--sans);
    font-size: var(--fz20) !important;
    font-weight: 400 !important;
    background: var(--grn);
    color: #fff;
    padding: 10px 20px;
    margin-bottom: 0;
  }
  .contact-box .contact h2 span {
    font-size: var(--fz12);
  }
  .contact-box .contact .contact-btn {
    background: #fff;
    padding: 0 20px;
    margin-top: 5px;
    height: 86px;
    position: relative;
  }
  .contact-box .contact .contact-btn::after {
    content: "❯";
    color: var(--grn);
    font-size: 16px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }
  .contact-box .contact .contact-btn .icon {
    width: 29px;
    margin-right: 20px;
  }
  .contact-box .contact .contact-btn .num {
    font-size: 24px;
    letter-spacing: 0.1em;
    line-height: 1.2;
  }
  .contact-box .contact .contact-text {
    font-size: var(--fz16);
  }

  /* ---------------------------------------------------------------------------
//  footer
--------------------------------------------------------------------------- */
  footer .bg1 {
    background: var(--grn);
    color: #fff;
    padding: 40px 0 20px;
  }
  footer .logo {
    width: 164px;
    margin: 0 auto 40px;
  }

  .foot {
    border-top: 1px solid #fff;
  }
  .foot .main a {
    color: #fff;
    padding: 12px 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    position: relative;
  }
  .foot .main a::after {
    content: "❯";
    font-size: 10px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }

  .foot .btn {
    margin-top: 20px;
  }
  .foot .btn a {
    border: 1px solid rgba(255, 255, 255, 0.8);
    font-size: var(--fz12);
    font-weight: 500;
    color: #fff;
    padding: 10px;
    position: relative;
  }
  .foot .btn a::after {
    content: "❯";
    font-size: 10px;
    position: absolute;
    top: 50%;
    right: 7px;
    transform: translateY(-50%);
  }

  .foot .bnr {
    margin-top: 20px;
  }
  .foot .bnr a {
    background: #fff;
    font-size: var(--fz12);
    font-weight: 500;
    color: var(--grn);
    padding: 10px;
    position: relative;
  }
  .foot .bnr a::after {
    content: "";
    display: block;
    background: url(../img/icon-link.png) center center / cover no-repeat;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%);
  }

  .foot .little {
    margin-top: 20px;
  }
  .foot .little a {
    color: #fff;
    margin: 0 0.5em;
  }
  .foot .sns {
    margin-top: 20px;
  }
  .foot .sns a {
    width: 24px;
    margin: 0 5px;
  }
  .foot .sns a > img {
    filter: brightness(0) invert(1);
  }
  footer .add {
    border-top: 1px solid #fff;
    margin-top: 20px;
    padding-top: 20px;
  }
  footer .add p + p {
    margin-top: 1em;
  }
  footer .add .tel {
    display: table;
    margin: 1em auto 0;
    font-size: var(--fz16);
    letter-spacing: 0.1em;
    color: #fff;
  }
  footer .bg2 {
    background: #0f3630;
    color: #fff;
    text-align: center;
    font-size: var(--fz10);
    padding: 20px 0 100px;
  }

  #topbtn {
    position: fixed;
    right: 10px;
    bottom: 60px;
    z-index: 9999;
    width: 30px;
    height: 30px;
  }
  #topbtn a {
    display: block;
  }

  /* ---------------------------------------------------------------------------
//  common
--------------------------------------------------------------------------- */

  .pankz {
    padding: 20px 0;
    font-size: var(--fz11);
  }
  .pankz a {
    text-decoration: underline;
  }
  .pankz li {
    display: inline-block;
  }
  .pankz li::after {
    content: "❯";
    font-size: 80%;
    vertical-align: 1px;
    margin: 0 0.6em;
  }
  .pankz li:last-child::after {
    content: none;
  }

  h2 {
    font-family: var(--serif);
    font-size: var(--fz16) !important;
    margin-bottom: 0.5em;
  }
  h2.line {
    border-bottom: 1px solid #c0c0c0;
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
  }

  .more-round {
    display: table;
    margin: 2em auto 0;
    border: 1px solid #5a5a5a;
    font-size: var(--fz10);
    padding: 5px 40px;
    border-radius: 100px;
    position: relative;
  }
  .more-round::after {
    content: "❯";
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }

  .more-round.white {
    border: 1px solid #fff;
    color: #fff;
    background: rgba(255, 255, 255, 0.2);
  }

  .more-external {
    display: table;
    margin: 2em auto 0;
    border: 1px solid #000;
    font-size: var(--fz13);
    padding: 10px 40px;
    position: relative;
  }
  .more-external::after {
    content: "";
    display: block;
    background: url(../img/icon-link.png) center center / cover no-repeat;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%);
  }

  .more-grn {
    display: block;
    background: var(--grn);
    color: #fff;
    text-align: center;
    padding: 10px;
    margin-top: 1em;
    position: relative;
  }
  .more-grn::after {
    content: "❯";
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
  }

  .link-border {
    margin-top: 15px;
    display: block;
    border: 1px solid var(--grn);
    color: var(--grn);
    text-align: center;
    font-size: var(--fz14);
    padding: 10px;
    position: relative;
  }
  .link-border::after {
    content: "❯";
    font-size: 12px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }

  table.default {
    width: 100%;
  }
  table.default th,
  table.default td {
    padding: 8px 5px;
    border: 1px solid #aaa;
    font-size: var(--fz10);
    text-align: center;
  }
  table.default th {
    background: #f8f8f8;
    font-weight: 400;
  }
  table.default .left {
    text-align: left;
  }
  table.default .big {
    font-size: var(--fz11);
    font-weight: 500;
  }

  .faq dt {
    display: flex;
    align-items: flex-start;
    padding: 10px 40px 10px 0;
    position: relative;
  }
  .faq dt::before {
    content: "Q";
    font-size: 15px;
    color: #fff;
    font-weight: 700;
    background: #aaa;
    width: 25px;
    height: 25px;
    margin-right: 10px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .faq dt p {
    width: calc(100% - 35px);
    font-weight: 500;
    padding-top: 0.2em;
  }

  .faq dt::after {
    content: "";
    background: url(../img/aco-down.png) center center / cover no-repeat;
    width: 13px;
    height: 8px;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }
  .faq dt.active::after {
    background: url(../img/aco-up.png) center center / cover no-repeat;
  }

  .faq dd {
    display: none;
  }
  .faq dd > div {
    display: flex;
    align-items: flex-start;
    padding: 0 20px 10px 0;
    margin-bottom: 20px;
    position: relative;
  }
  .faq dd > div::before {
    content: "A";
    font-size: 15px;
    color: #fff;
    font-weight: 700;
    background: var(--grn);
    width: 25px;
    height: 25px;
    margin-right: 10px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .faq dd p {
    width: calc(100% - 35px);
  }
  .faq dd p a {
    text-decoration: underline;
  }

  .faq.open dt::after {
    content: none;
  }
  .faq.open dd::after {
    content: none;
  }
  .faq.open dd {
    display: block;
  }

  /* ---------------------------------------------------------------------------
//  page
--------------------------------------------------------------------------- */
  .page--top .wrap {
    padding-top: 0;
  }

  .top-mv {
    position: relative;
    border: 1px solid white;
    width: 100%;
  }
  .red_txt {
    padding: 10px 20px;
    text-align: center;
    bottom: 48.4px;
    left: 0;
    right: 0;
    margin: auto;
    font-size: 18px;
    position: absolute;
    width: 310px;
    font-weight: bold;
    border: solid 2px #d74514;
    background: rgba(255, 255, 255, 0.8);
    color: #d74514;
  }
  .top-mv h1 {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    font-family: var(--serif);
    font-size: var(--fz18);
    color: #fff;
    letter-spacing: 0.08em;
    text-shadow: 1px 0 5px rgba(0, 0, 0, 0.5), -1px 0 5px rgba(0, 0, 0, 0.5),
      0 1px 5px rgba(0, 0, 0, 0.5), 0 -1px 5px rgba(0, 0, 0, 0.5);
  }
  .top-mv h2 {
    width: 100%;
    text-align: center;
    position: absolute;
    top: calc(50% + 70px);
    left: 0;
    transform: translateY(-50%);
    font-family: var(--serif);
    font-size: var(--fz14) !important;
    color: #fff;
    letter-spacing: 1.12px;
    text-shadow: 1px 0 5px rgba(0, 0, 0, 0.5), -1px 0 5px rgba(0, 0, 0, 0.5),
      0 1px 5px rgba(0, 0, 0, 0.5), 0 -1px 5px rgba(0, 0, 0, 0.5);
  }
  .top-mv h2 span {
    border: solid 1px;
    padding: 10px 20px;
    display: inline-block;
  }
  .top-mv div {
    overflow: hidden;
    width: 100%;
    height:calc(100dvh - 108px);
  }
  .top-mv div img {
    width: 100%;
    height:100%;
    object-fit: cover;
  }
  .top-section {
    position: relative;
    margin-top: 70px;
  }

  .event-list {
    border-bottom: 1px solid #c0c0c0;
    padding-bottom: 20px;
    margin-bottom: 50px !important;
  }
  .event-list h3 {
    font-size: var(--fz13) !important;
    margin: 0.5em 0;
  }
  .event-list dl dt {
    width: 3em;
    float: left;
    clear: left;
  }
  .event-list dl dd {
    padding-left: 3em;
  }

  .top-bnr .bnr {
    margin-top: 20px;
  }
  .top-bnr .bnr a {
    display: block;
  }

  .top-event-banners {
    background: #fff;
    padding: 30px 20px 20px;
  }

  .top-event-banners .inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .top-event-banners .banner-item a,
  .top-event-banners .banner-item img {
    display: block;
    width: 100%;
  }

  .top-event-banners .banner-item img {
    height: auto;
  }

  .top-pickup a {
    display: block;
  }
  .top-pickup .inner > h2 {
    font-size: var(--fz16);
  }
  .top-pickup .title {
    font-weight: 500;
    text-align: center;
    margin-top: 0.5em;
    font-size: var(--fz12);
  }

  .top-lifestyle-text {
    padding-top: 360px;
    margin-top: 100px;
    position: relative;
    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
    background-color: transparent;
  }
  .top-lifestyle-text::after {
    content: "";
    display: block;
    background: url(../img/top-lifestyle-text.jpg) center center / cover
      no-repeat;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
  }
  .top-lifestyle-text .text {
    padding: 50px;
    background: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.8) 100%
    );
    color: #fff;
  }
  .top-lifestyle-text h2 {
    font-size: var(--fz20) !important;
    text-align: center;
    margin-bottom: 1em;
  }
  h2.top-head {
    font-size: var(--fz20) !important;
    text-align: center;
    color: var(--grn);
    margin-bottom: 1em;
  }

  .top-lifestyle h2 + p {
    text-align: center;
    color: var(--grn);
    margin: -1em 0 1.5em;
  }
  #lifestyle-tabs {
    border: 1px solid #d8d8d8;
  }
  .lifestyle-cnt .item {
    position: relative;
  }
  .lifestyle-cnt .item h3 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 10px;
    position: absolute;
    top: 0;
    left: 0;
    font-family: var(--serif);
    font-size: var(--fz18);
    color: #fff;
    z-index: 3;
  }
  .lifestyle-cnt h3::before {
    content: "";
    margin-right: 5px;
    width: 60px;
    height: 48px;
  }
  .lifestyle-cnt #ls-cnt1 h3::before {
    background: url(../img/icon/lifestyle-icon01.png) center center / contain
      no-repeat;
    filter: brightness(0) invert(1);
  }
  .lifestyle-cnt #ls-cnt2 h3::before {
    background: url(../img/icon/lifestyle-icon02.png) center center / contain
      no-repeat;
    filter: brightness(0) invert(1);
  }
  .lifestyle-cnt #ls-cnt3 h3::before {
    background: url(../img/icon/lifestyle-icon03.png) center center / contain
      no-repeat;
    filter: brightness(0) invert(1);
  }
  .lifestyle-cnt #ls-cnt4 h3::before {
    background: url(../img/icon/lifestyle-icon04.png) center center / contain
      no-repeat;
    filter: brightness(0) invert(1);
  }
  .lifestyle-cnt #ls-cnt5 h3::before {
    background: url(../img/icon/lifestyle-icon05.png) center center / contain
      no-repeat;
    filter: brightness(0) invert(1);
  }

  .lifestyle-cnt .photo {
    position: relative;
  }

  .lifestyle-cnt .photo::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.25);
    z-index: 2;
  }

  .lifestyle-cnt .more-round {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
  }
  .lifestyle-nav .btn {
    text-align: center;
    font-size: var(--fz14);
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
  }
  .lifestyle-nav.flex #ls-btn1 {
    width: 100%;
    border-bottom: 1px solid;
    border-image: linear-gradient(
        to right,
        #fff 6%,
        #d8d8d8 6%,
        #d8d8d8 94%,
        #fff 94%
      )
      1;
  }
  .lifestyle-nav.flex #ls-btn2 {
    border-bottom: 1px solid;
    border-image: linear-gradient(
        to right,
        #fff 6%,
        #d8d8d8 6%,
        #d8d8d8 94%,
        #fff 94%
      )
      1;
  }
  .lifestyle-nav.flex #ls-btn3 {
    border-left: 1px solid;
    border-image: linear-gradient(
        to bottom,
        #fff 8%,
        #d8d8d8 8%,
        #d8d8d8 92%,
        #fff 92%
      )
      1;
  }
  .lifestyle-nav.flex #ls-btn4 {
    border-right: 1px solid;
    border-image: linear-gradient(
        to bottom,
        #fff 8%,
        #d8d8d8 8%,
        #d8d8d8 92%,
        #fff 92%
      )
      1;
  }
  .lifestyle-nav.flex #ls-btn5 {
    border-top: 1px solid;
    border-image: linear-gradient(
        to right,
        #fff 6%,
        #d8d8d8 6%,
        #d8d8d8 94%,
        #fff 94%
      )
      1;
  }

  .lifestyle-nav .btn::before {
    content: "";
    margin-right: 5px;
    width: 45px;
    height: 36px;
  }
  .lifestyle-nav #ls-btn1::before {
    background: url(../img/lifestyle-icon01.png) center center / contain
      no-repeat;
  }
  .lifestyle-nav #ls-btn2::before {
    background: url(../img/lifestyle-icon02.png) center center / contain
      no-repeat;
  }
  .lifestyle-nav #ls-btn3::before {
    background: url(../img/lifestyle-icon03.png) center center / contain
      no-repeat;
  }
  .lifestyle-nav #ls-btn4::before {
    background: url(../img/lifestyle-icon04.png) center center / contain
      no-repeat;
  }
  .lifestyle-nav #ls-btn5::before {
    background: url(../img/lifestyle-icon05.png) center center / contain
      no-repeat;
  }

  .lifestyle-nav .btn::after {
    content: "";
    width: 0;
    height: 10px;
    background: var(--grn);
    position: absolute;
    right: 0;
    bottom: 0;
    transition: all 0.3s;
    transform-origin: right;
  }
  .lifestyle-nav .btn.tab-active::after {
    width: 90%;
  }
  .lifestyle-nav .btn#ls-btn1.tab-active::after {
    width: 94%;
  }

  .top-column {
    background: #f5f5f5;
    padding: 20px 0;
  }
  .top-column .box {
    background: #fff;
    padding: 30px;
  }
  .top-column .icon {
    width: 55px;
    margin: 0 auto 5px;
  }
  .top-column h2 + p {
    text-align: center;
    color: var(--grn);
    margin: -1em 0 1.5em;
  }
  .top-column .item {
    margin-bottom: 25px;
  }
  .top-column .photo {
    width: 40%;
  }
  .top-column .text {
    width: 55%;
  }
  .top-column h3 {
    font-size: var(--fz12);
  }

  .top-column2 {
    background: #f5f5f5;
    padding: 20px 0;
  }
  .top-column2 .box {
    background: #fff;
    padding: 30px;
  }
  .top-column2 h2 {
    text-align: center;
    border-bottom: 1px solid #c0c0c0;
    padding-bottom: 0.6em;
    margin-bottom: 1em;
  }

  .top-column2 .item {
    margin-bottom: 25px;
  }
  .top-column2 .photo {
    width: 40%;
  }
  .top-column2 .text {
    width: 55%;
  }
  .top-column2 p {
    font-weight: 500;
  }

  .top-example .icon {
    width: 52px;
    margin: 0 auto 5px;
  }
  .example-list .item {
    display: block;
    margin: 0 3px 6px;
  }
  .example-list .flex .item {
    width: calc(50% - 3px);
    margin: 0 0 6px;
  }

  .example-list .item .box {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 110%;
  }
  .example-list .item .photo {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
  }
  .example-list .item .photo::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 2;
  }
  .example-list .item .text {
    width: 100%;
    padding: 0 20px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    z-index: 3;
  }
  .example-list .item h3 {
    font-family: var(--serif);
    font-size: var(--fz14);
    text-align: center;
    color: #fff;
  }
  .example-list .item .cat {
    margin: 0.5em auto 0;
    text-align: center;
  }
  .example-list .item .cat li {
    display: inline-block;
    font-family: var(--serif);
    font-size: var(--fz10);
    color: #fff;
    background: #000;
    padding: 2px 8px;
    margin: 0 2px 4px;
  }
  .tax-example-cat .example-list .cat-floor,
  .tax-example-cat .example-list .cat-building,
  .tax-example-cat .example-list .cat-price,
  .tax-example-cat .example-list .detail_container {
    display: none;
  }
  .top-example .more-round {
    margin: 50px auto 0;
  }

  .top-modelhouse {
    background: var(--grn);
    color: #fff;
    padding: 40px 0 30px;
  }
  .top-modelhouse h2 {
    font-size: var(--fz20) !important;
    text-align: center;
    margin-bottom: 1em;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .top-modelhouse h2::before {
    content: "";
    display: block;
    background: url(../img/icon-modelhouse.png) center center / contain
      no-repeat;
    width: 52px;
    height: 47px;
    margin-right: 10px;
  }
  .top-modelhouse h2 + p {
    text-align: center;
    margin-bottom: 20px;
  }
  .top-modelhouse .item {
    border: 2px solid #fff;
    position: relative;
  }
  .modelhouse-link {
    display: block;
    width: 100%;
    color: inherit;
    text-decoration: none;
  }
  .top-modelhouse .more-round {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
  }
  #modelhouse-nav {
    margin-top: 10px;
  }
  #modelhouse-nav .btn {
    height: 80px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 5px 0;
  }
  #modelhouse-nav .btn.tab-active {
    border: 2px solid #fff;
  }
  #modelhouse-nav h3 {
    font-family: var(--serif);
    font-size: var(--fz12);
  }
  #modelhouse-nav p {
    font-size: var(--fz10);
    margin-top: 5px;
  }

  .top-streethouse {
    background: #f5f5f5;
    padding: 60px 0 40px;
  }
  .top-streethouse h2 {
    width: 240px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
  }
  .top-streethouse h3 {
    font-size: var(--fz14);
    color: var(--grn);
    text-align: center;
    margin-top: 30px;
  }

  .top-streethouse .photos {
    margin-top: -20px;
  }
  .top-streethouse .photos > div {
    width: calc(50% - 1px);
    margin-bottom: 1px;
  }
  .top-streethouse .photos > div:nth-child(even) {
    width: 50%;
  }
  .top-streethouse .bg {
    font-size: var(--fz14);
    color: #fff;
    text-align: center;
    background: var(--grn);
    padding: 5px;
    margin-top: 1px;
  }

  .top-lineup .image {
    margin-bottom: 1.5em;
  }

  .top-voice h2 {
    border-bottom: 1px solid #c0c0c0;
    padding-bottom: 0.6em;
    margin-bottom: 1em;
  }
  .top-voice .item {
    margin-bottom: 25px;
  }
  .top-voice .photo {
    width: 40%;
  }
  .top-voice .text {
    width: 55%;
  }
  .top-voice h3 {
    font-size: var(--fz12);
    color: #8e8e8e;
    margin-bottom: 1em;
  }

  .top-message {
    background: #e1e1e1;
    padding: 60px 0;
  }
  .top-message h3 {
    font-family: var(--serif);
    font-size: var(--fz14);
    font-weight: 500;
    text-align: center;
    margin-bottom: 1em;
  }
  .top-message p {
    font-family: var(--serif);
    font-size: var(--fz13);
  }
  .top-message p + p {
    margin-top: 1.8em;
  }

  .top-news h2 {
    font-family: var(--sans);
    font-size: var(--fz20) !important;
    font-weight: 400 !important;
    text-align: center;
    letter-spacing: 0.2em;
    color: var(--grn);
    margin-bottom: 1em;
  }
  .top-news > .inner {
    padding-bottom: 40px;
  }

  .news-list {
    margin: 0;
  }
  .news-list a {
    display: block;
    margin-bottom: 1em;
  }
  .news-list .date {
    color: #8e8e8e;
  }

/* TOPニュースをタブ切り替え表示 */
.news-tabs>.tab-panel {
  display: flex;
}
.news-tabs>.tab-panel>li {
  width: stretch;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1em;
  border: 1px solid #c9c9c9;
  margin-inline: -0.5px;
  color: #777;
  cursor: pointer;
}
.news-tabs>.tab-panel>li.is-active {
  border-color: #333;
  border-bottom-color: transparent;
  position: relative;
  z-index: 1;
  color: #333;
}
.tab-content {
  margin-top: 16px;
}
.tab-content .js-tab-content {
  display: none;
}
.tab-content .js-tab-content.is-active {
  display: block;
}


  .top-instagram {
    margin: 70px 0;
  }
  .top-instagram .icon {
    width: 34px;
    margin: 0 auto 20px;
  }
  .top-instagram .inner a.more-round {
    margin: 6em auto 2px !important;
  }

  /* --------------------------------------------------------------------------- */
  /* --------------------------------------------------------------------------- */

  .page--sec .end {
    height: 70px;
  }
  .sec-section {
    position: relative;
    margin-top: 70px;
  }
  .sec-mv h1 {
    background: var(--grn);
    color: #fff;
    font-size: var(--fz16);
    padding: 8px 20px;
    margin-bottom: 2px;
  }
  .sec-chosen .image {
    margin-bottom: 10px;
  }

  .sec-first .link {
    margin-top: 40px;
  }

  .sec-concept .image {
    margin: 1em 0;
  }
  .sec-concept p + p {
    margin-top: 1em;
  }

  .sec-design .num {
    width: 100px;
    position: absolute;
    top: -10px;
    right: 20px;
  }
  .sec-design .image {
    margin: 10px 0;
  }

  .sec-style .item {
    margin-top: 60px;
  }
  .sec-style h2 {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
  }
  .sec-style h2::before {
    content: "";
    margin-right: 5px;
    width: 45px;
    height: 36px;
  }

  .sec-style .style1 h2::before {
    background: url(../img/lifestyle-icon01.png) center center / contain
      no-repeat;
  }
  .sec-style .style2 h2::before {
    background: url(../img/lifestyle-icon02.png) center center / contain
      no-repeat;
  }
  .sec-style .style3 h2::before {
    background: url(../img/lifestyle-icon03.png) center center / contain
      no-repeat;
  }
  .sec-style .style4 h2::before {
    background: url(../img/lifestyle-icon04.png) center center / contain
      no-repeat;
  }
  .sec-style .style5 h2::before {
    background: url(../img/lifestyle-icon05.png) center center / contain
      no-repeat;
  }

  .style-mv {
    position: relative;
  }
  .style-mv .copy {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.7));
  }
  .style-mv .icon {
    width: 60px;
    margin: 0 auto 5px;
  }
  .style-mv h2 {
    font-size: var(--fz18);
    color: #fff;
    text-align: center;
  }

  .style-single .bnr {
    display: block;
  }
  .style-single p + p {
    margin-top: 1.8em;
  }
  .style-single .image {
    margin: 10px 0;
  }
  .style-single .example-list {
    margin-top: 30px;
  }

  .style-bg {
    background: #f5f5f5;
    padding: 40px 0;
  }
  .style-bg .subtitle {
    display: table;
    background: var(--grn);
    color: #fff;
    font-size: var(--fz12);
    font-weight: 500;
    padding: 2px 10px;
    margin-bottom: 10px;
  }
  .style-bg .image {
    margin: 10px 0;
  }
  .style-feature + .style-feature {
    margin-top: 50px;
  }

  .courtyard-plan .item {
    margin-top: 20px;
    padding: 20px;
    border: 3px solid #e6e6e6;
  }
  .courtyard-plan h3 {
    font-size: var(--fz14);
    text-align: center;
  }

  .garage-price {
    margin-top: 20px;
  }
  .garage-price h3 {
    font-size: var(--fz13);
    margin-bottom: 5px;
  }
  .garage-price dl {
    margin-bottom: 1em;
  }
  .garage-price dl dt {
    width: 18em;
    float: left;
    clear: left;
  }
  .garage-price dl dd {
    padding-left: 18em;
  }

  .style-external {
    border: 20px solid var(--grn);
    padding: 30px 0;
  }
  .style-external .image {
    margin: 10px 0;
  }

  .lineup-mv {
    position: relative;
  }
  .lineup-mv .copy {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.7));
  }
  .lineup-mv h2 {
    font-size: var(--fz18);
    color: #fff;
    text-align: center;
  }
  .lineup-mv p {
    font-size: var(--fz14);
    font-weight: 500;
    color: #fff;
    text-align: center;
  }
  .lineup-mv .box {
    display: table;
    margin: 5px auto 0;
    font-size: var(--fz12);
    background: #fff;
    color: #000;
    padding: 3px 10px;
  }

  .sec-lineup1 {
    margin-top: 30px;
  }

  .sec-lineup2 .feature {
    margin: 10px 0;
  }
  .sec-lineup2 .feature li {
    display: inline-block;
    font-weight: 500;
    border: 1px solid #000;
    padding: 2px 8px;
    margin-right: 5px;
  }

  .sec-spec-select {
    background: #f5f5f5;
    padding: 40px 0;
  }
  .spec-select-w {
    background: none;
    padding: 40px 0 0;
  }
  .sec-spec-select h3 {
    font-size: var(--fz13);
    font-weight: 500;
  }
  .sec-spec-select3 p + h3 {
    margin-top: 1.8em;
  }
  .spec-select {
    margin-bottom: 30px;
  }
  .spec-select:last-child {
    margin-bottom: 0;
  }
  .spec-select.flex .image {
    width: 120px;
    height: 120px;
  }
  .spec-select.flex .text {
    width: calc(100% - 130px);
  }
  .spec-select .text .more-round {
    margin-top: 1em;
    padding: 2px 30px;
  }

  .sec-spec-select.select-frame {
    background: none;
    padding: 30px 0 0;
  }
  .select-frame .frame {
    border: 1px solid #c0c0c0;
    padding: 20px;
  }

  .sec-lineup-sec .photo {
    margin: 15px 0;
  }
  .lineup-item-slide .slide-image {
    width: 100%;
    height: 0;
    padding-top: 100%;
    margin-bottom: 20px;
    background: #f5f5f5;
    position: relative;
  }
  .lineup-item-slide .slide-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    position: absolute;
    top: 0;
    left: 0;
  }

  .sec-lineup-sec .recommend li {
    background: #e2e2e2;
    padding: 15px;
    border-radius: 20px;
    margin-bottom: 10px;
  }

  .sec-example-single.sec-lineup-slide {
    margin-top: 70px;
  }

  .lineup-type {
    border: 2px solid #707070;
    margin-top: 20px;
    text-align: center;
  }
  .lineup-type p {
    background: #707070;
    color: #fff;
    font-size: var(--fz14);
    font-weight: 500;
    padding: 8px;
  }
  .lineup-type dl {
    padding: 5px;
  }
  .lineup-type dt {
    font-size: var(--fz16);
    font-weight: 500;
  }

  .sec-lineup-sec h3 {
    margin: 1em 0 0.5em;
    font-size: var(--fz14);
  }
  .sec-lineup-sec h2 + h3 {
    margin: 0 0 0.5em;
    font-size: var(--fz14);
  }
  .sec-lineup-sec .note {
    margin-top: 1em;
    font-size: var(--fz11);
  }

  .sec-lineup-sec .more-grn {
    padding: 20px 10px;
  }

  .sec-guide .link {
    margin-top: 40px;
  }

  .structure-subtitle {
    display: inline-block;
    border: 1px solid #fff;
    font-size: var(--fz12);
    padding: 1px 8px;
    vertical-align: 2px;
    margin-right: 10px;
  }
  .sec-structure-nav {
    margin: 30px 0;
  }
  .sec-structure-nav .btn {
    background: #d0d0d0;
    color: #fff;
    text-align: center;
    padding: 10px;
    margin-bottom: 10px;
  }
  .sec-structure-nav .btn.active {
    background: var(--grn);
  }

  .sec-structure .title {
    margin-bottom: 20px;
  }
  .sec-structure h2 {
    font-family: var(--sans);
  }
  .sec-structure h3 {
    color: #fff;
    text-align: center;
    padding: 8px;
    background: #707070;
    margin: 2em 0 0.8em;
  }
  .sec-structure h4 {
    font-size: var(--fz12);
    font-weight: 700;
    margin-top: 1em;
  }

  .sec-structure .structure-subtitle {
    border: 1px solid #000;
  }
  .sec-structure .image {
    margin: 15px 0;
  }
  .sec-structure-bg {
    background: #f5f5f5;
    padding: 30px 0;
  }
  .sec-structure-bg h2 {
    text-align: center;
    margin: 1em 0;
  }
  .sec-structure-bg h2:first-child {
    margin-top: 0;
  }

  .sec-structure-nav-foot a {
    display: block;
    font-size: var(--fz14);
    color: var(--grn);
    border-bottom: 1px solid var(--grn);
    padding: 2px 5px;
    position: relative;
    margin-bottom: 8px;
  }
  .sec-structure-nav-foot a.active {
    font-weight: 700;
  }
  .sec-structure-nav-foot a::after {
    content: "❯";
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }

  .sec-sw1 .image {
    width: 300px;
    margin: 20px auto 0;
  }

  .sec-sw2 {
    margin-top: 140px;
    background: #f5f4f0;
    padding: 60px 0;
  }
  .sec-sw2 .box {
    background: #fff;
    padding: 30px 20px;
    margin-bottom: 30px;
  }
  .sec-sw2 .image1 {
    width: 220px;
    margin: -160px auto 20px;
  }
  .sec-sw2 .hoy {
    width: 150px;
    margin: 0 auto 20px;
  }
  .sec-sw2 h3 {
    font-size: var(--fz14);
  }
  .sec-sw2 .award {
    margin-top: 20px;
  }
  .sec-sw2 .award .logo {
    width: 75px;
    margin-right: 20px;
  }
  .sec-sw2 .award .text {
    width: calc(100% - 95px);
  }
  .sec-sw2 .image2 {
    margin-top: 20px;
  }
  .sec-sw2 .image3 {
    margin: 20px 0;
  }

  .sec-sw-nav h2 {
    font-size: var(--fz20);
    text-align: center;
    color: var(--grn);
    margin-bottom: 1em;
  }
  .sec-sw-nav a {
    display: block;
    border: 1px solid var(--grn);
    font-size: var(--fz14);
    color: var(--grn);
    padding: 15px;
    margin-bottom: 1em;
    position: relative;
  }
  .sec-sw-nav a::after {
    content: "❯";
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
  }
  .sec-sw-nav a.active {
    background: var(--grn);
    color: #fff;
  }

  .sw-subtitle {
    display: inline-block;
    border: 1px solid #fff;
    font-size: var(--fz12);
    padding: 1px 8px;
    vertical-align: 2px;
    margin-right: 10px;
  }
  .sw-point-copy {
    font-size: var(--fz18);
    line-height: 1.6;
    text-align: center;
    margin: 20px 0 10px;
  }

  .sw-point-default h3 {
    font-size: var(--fz14);
    text-align: center;
    color: #fff;
    background: #5f5e5e;
    padding: 5px;
    margin: 20px 0 10px;
  }
  .sw-point-default .image {
    margin: 15px 0;
  }
  .sw-point-default .label {
    border: 2px solid #434040;
    margin-top: 20px;
    text-align: center;
  }
  .sw-point-default .label .head {
    background: #f5f4f0;
    font-family: var(--serif);
    font-size: var(--fz16);
    font-weight: 500;
    padding: 8px;
  }
  .sw-point-default .label .text {
    padding: 8px;
    background: #434040;
    font-size: var(--fz16);
    font-weight: 500;
    color: #fff;
  }
  .sw-point-default .cap {
    margin-top: 0.5em;
  }

  .sw-point-default .notes,
  .sw-point-bg .notes {
    font-size: 85%;
    text-indent: -1em;
    padding-left: 1em;
    line-height: 1.6;
    margin-top: 8px;
  }

  .sw-point-bg {
    background: #f5f4f0;
    padding: 40px 0;
  }
  .sw-point-bg .logo {
    width: 180px;
    margin: 0 auto 20px;
  }
  .sw-point-bg h2 .sub {
    font-size: var(--fz12);
    display: block;
  }
  .sw-point-bg h3 {
    font-size: var(--fz14);
    margin-bottom: 10px;
  }
  .sw-point-bg .box {
    padding: 20px;
    background: #fff;
    margin-top: 20px;
  }
  .sw-point-bg .frame {
    border: 1px solid #b4b4b4;
    padding: 10px 15px;
    margin-top: 15px;
  }

  .sw-point-bg .feature .item {
    background: #ebe8e8;
    height: 80px;
    border-radius: 8px;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  .sw-point-bg .feature h4 {
    font-size: var(--fz14);
    font-family: var(--serif);
    margin-bottom: 5px;
  }
  .sw-point-bg .feature p {
    line-height: 1.4;
    font-size: var(--fz11);
  }
  .sw-point-bg .image {
    margin: 15px 0;
  }

  .sw-point2-img1 {
    margin: -90px auto 0;
    width: 200px;
  }
  .sw-point2-img2 {
    margin: -60px auto 20px;
    width: 140px;
  }

  .sw-point2 {
    margin-top: 90px;
  }
  .sw-point2 .border {
    border: 6px solid #e6e6e6;
    padding: 20px;
  }
  .sw-point2 .frame {
    border: 1px solid #b4b4b4;
    padding: 10px 15px;
    margin-top: 15px;
  }

  .sw-point3 {
    margin-top: 90px;
  }
  .sw-point3-bg {
    padding-bottom: 90px;
  }
  .sw-point3-2 {
    margin-top: 70px;
  }
  .sw-point3-img1 {
    margin: -80px auto 20px;
    width: 300px;
  }
  .sw-point3-img2 {
    margin: -160px auto 10px;
    width: 260px;
  }
  .sw-point3-2 .border {
    border: 6px solid #e6e6e6;
    padding: 20px;
  }
  .sw-point3-2 .logo {
    width: 80px;
    margin: 0 auto 10px;
  }
  .sw-point3-2 ul {
    margin-top: 10px;
  }
  .sw-point3-bg .box {
    margin-bottom: 30px;
  }

  .sw-point3-report .item {
    margin-bottom: 40px;
  }
  .sw-point3-report h3 {
    font-size: var(--fz14);
    margin-bottom: 5px;
  }
  .sw-point3-report .bg {
    display: table;
    background: #666464;
    color: #fff;
    font-size: var(--fz12);
    font-weight: 500;
    padding: 2px 10px;
    margin-bottom: 5px;
  }
  .sw-point3-report .image {
    margin: 10px 0;
  }

  .sw-point4 {
    margin-top: 110px;
    position: relative;
  }
  .sw-point4 h3.serif {
    margin-top: 40px;
    font-family: var(--serif);
    font-size: var(--fz14);
  }

  .sw-point4::before {
    content: "";
    display: block;
    background: url(../img/sw-point4-01.png) center center / contain no-repeat;
    width: 228px;
    height: 134px;
    position: absolute;
    top: -94px;
    right: 0;
  }
  .sw-point4 .box:first-child {
    margin-top: 0;
  }
  .sw-point4 h3.lgrn {
    display: table;
    background: #6fa795;
    color: #fff;
    font-size: var(--fz12);
    font-weight: 500;
    padding: 5px 10px;
    margin: 20px 0 0;
  }
  .sw-point4 h4.bg {
    background: #666464;
    color: #fff;
    font-size: var(--fz12);
    font-weight: 500;
    text-align: center;
    padding: 5px 10px;
    margin: 10px 0 5px;
  }
  .sw-point4 .border {
    border: 1px solid #6fa795;
    padding: 20px;
  }
  .sw-point4 .border h4 {
    color: #6fa795;
    font-family: var(--serif);
    font-size: var(--fz15);
    margin-bottom: 5px;
  }
  .sw-point4 .border h5 {
    color: #6fa795;
    font-family: var(--serif);
    font-size: var(--fz14);
    margin-bottom: 5px;
  }
  .sw-point4 .frame-lgrn {
    border: 1px solid #6fa795;
    padding: 15px;
  }
  .sw-point4 .frame-lgrn h3 {
    color: #6fa795;
    text-align: center;
  }
  .point4-zeh {
    margin-top: 40px;
  }
  .point4-zeh h3 {
    color: #6fa795;
    text-align: center;
    margin-top: 20px;
  }
  .point4-zeh .graph {
    margin-bottom: 10px;
  }

  .sw-point7 .item {
    margin-bottom: 40px;
  }
  .sw-point7-img1 {
    margin: 0 auto 10px;
    width: 140px;
  }
  .sw-point7-img2 {
    margin: 0 auto 10px;
    width: 100px;
  }

  .sec-zeh h2 {
    font-size: var(--fz20);
    text-align: center;
    color: var(--grn);
    margin-bottom: 1em;
  }
  .sec-zeh h3.bg {
    background: #0d6a38;
    color: #fff;
    font-size: var(--fz14);
    padding: 8px;
    margin-bottom: 1em;
  }
  .sec-zeh1 .box {
    border: 1px solid #acacac;
    padding: 20px;
  }
  .sec-zeh1 .image01 {
    margin-bottom: 30px;
  }
  .sec-zeh1 .box-grn {
    background: #0d6a38;
    color: #fff;
    text-align: center;
    padding: 10px;
    margin-bottom: 1em;
  }
  .sec-zeh1 .box-grn h4 {
    font-size: var(--fz14);
    margin-bottom: 6px;
  }
  .sec-zeh1 .box-grn p {
    font-size: var(--fz10);
  }

  .sec-zeh2,
  .sec-zeh3,
  .sec-zeh4 {
    margin-top: 50px;
  }
  .sec-zeh2 hr,
  .sec-zeh3 hr,
  .sec-zeh4 hr {
    margin-bottom: 40px;
  }

  .sec-zeh3 .box {
    border: 5px solid #e6e6e6;
    padding: 20px;
    position: relative;
    margin-bottom: 50px;
  }
  .sec-zeh3 .box::after {
    content: "";
    border: solid transparent;
    border-width: 30px 80px;
    border-top-color: #e6e6e6;
    position: absolute;
    bottom: -64px;
    left: 50%;
    transform: translateX(-50%);
  }
  .sec-zeh3 .box h3 {
    font-size: var(--fz14);
    color: #c33939;
  }
  .sec-zeh3 .box p + h3 {
    margin-top: 30px;
  }
  .sec-zeh3 .image06 {
    margin-top: 10px;
  }
  .sec-zeh3 h4 {
    font-size: var(--fz14);
    margin-bottom: 0.5em;
  }
  .sec-zeh3 .image07 {
    margin: 10px 0 30px;
  }
  .sec-zeh3 .image08 {
    width: 120px;
    margin: 10px auto 30px;
  }
  .sec-zeh3 .logo {
    width: 200px;
    margin: 0 auto;
  }
  .sec-zeh3 .border {
    border: 1px solid #acacac;
    padding: 20px;
    margin-top: 20px;
  }
  .sec-zeh3 .image09,
  .sec-zeh3 .image10 {
    margin-top: 20px;
  }

  .sec-mv .modelhouse-top {
    position: relative;
  }
  .sec-mv .modelhouse-top .copy {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.7));
  }
  .sec-mv .modelhouse-top .copy h2 {
    font-size: var(--fz16);
    color: #fff;
    text-align: center;
  }

  .sec-modelhouse .icon {
    width: 52px;
    margin: 30px auto 10px;
  }
  .modelhouse-item {
    margin-bottom: 60px;
  }
  .modelhouse-item h3 {
    font-size: var(--fz15);
    margin-bottom: 10px;
  }
  .modelhouse-item h3 span {
    display: inline-block;
    background: var(--grn);
    font-size: var(--fz12);
    color: #fff;
    padding: 2px 8px;
    vertical-align: 1px;
    margin-right: 7px;
  }

  .modelhouse-item .image {
    position: relative;
  }
  .modelhouse-item .image p {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    font-family: var(--serif);
    font-size: var(--fz16);
    color: #fff;
    text-align: center;
    text-shadow: 1px 0 5px rgba(0, 0, 0, 0.5), -1px 0 5px rgba(0, 0, 0, 0.5),
      0 1px 5px rgba(0, 0, 0, 0.5), 0 -1px 5px rgba(0, 0, 0, 0.5);
  }

  .modelhouse-item dl {
    margin-top: 10px;
  }
  .modelhouse-item dl dt {
    width: 5em;
    float: left;
    clear: left;
  }
  .modelhouse-item dl dd {
    padding-left: 6em;
  }
  .modelhouse-reserve {
    display: block;
    background: #fca457;
    padding: 20px 0;
    color: #fff;
    text-align: center;
    font-size: var(--fz14);
    border-radius: 8px;
    position: relative;
  }
  .modelhouse-reserve::before {
    content: "";
    display: inline-block;
    margin-right: 6px;
    vertical-align: middle;
    background: url(../img/nav-bottom2.png) center center / contain no-repeat;
    width: 22px;
    height: 22px;
  }

  .sec-mv .modelhouse {
    position: relative;
  }
  .sec-mv .modelhouse::after {
    content: "";
    display: block;
    background: url(../img/icon-modelhouse.png) center center / cover no-repeat;
    width: 52px;
    height: 47px;
    position: absolute;
    top: 20px;
    left: calc(50% - 26px);
  }

  .modelhouse-single .image {
    margin-top: 15px;
  }

  .modelhouse-slide .photo {
    width: 100%;
    height: 0;
    padding-top: 100%;
    margin-bottom: 20px;
    background: #f5f5f5;
    position: relative;
  }
  .modelhouse-slide .photo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    position: absolute;
    top: 0;
    left: 0;
  }

  .modelhouse-slide p {
    margin-top: 0.5em;
    font-size: var(--fz11);
    padding: 0 20px;
  }

  .modelhouse-single h3 {
    font-size: var(--fz14);
    border-bottom: 1px solid #c0c0c0;
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
  }
  .modelhouse-single .award-bnr {
    margin-top: 20px;
  }

  .modelhouse-other-slide h3 {
    font-size: var(--fz14);
    text-align: center;
    margin: 10px 0 5px;
  }
  .modelhouse-other-slide p {
    text-align: center;
    margin-bottom: 5px;
  }

  .modelhouse-outline {
    margin-top: 20px;
  }
  .modelhouse-outline dt {
    width: 6em;
    float: left;
    clear: left;
  }
  .modelhouse-outline dd {
    padding-left: 7em;
  }
  .modelhouse-single .googlemap {
    width: 100%;
    height: 300px;
    margin-bottom: 15px;
  }
  .modelhouse-single .googlemap iframe {
    width: 100%;
    height: 100%;
  }
  .modelhouse-single .map {
    margin-bottom: 15px;
  }

  .sec-company .outline dt {
    width: 6em;
    float: left;
    clear: left;
    width: 9em;
  }
  .sec-company .outline dd {
    padding-left: 7em;
    margin-bottom: 1em;
    padding-left: 10em;
  }
  .sec-company .history dt {
    width: 8em;
    float: left;
    clear: left;
  }
  .sec-company .history dd {
    padding-left: 8em;
    margin-bottom: 1em;
  }
  .sec-company .googlemap {
    width: 100%;
    height: 250px;
    margin-bottom: 10px;
  }
  .sec-company .googlemap iframe {
    width: 100%;
    height: 100%;
  }

  .sec-philosophy .image {
    margin-top: 15px;
  }
  .sec-philosophy h3 {
    font-size: var(--fz14);
  }
  .sec-philosophy h4 {
    font-size: var(--fz13);
    color: #fff;
    background: var(--grn);
    padding: 4px 8px;
    margin: 1em 0 0.5em;
  }
  .sec-philosophy h5 {
    font-size: var(--fz13);
    margin-bottom: 0.5em;
  }

  .sec-message p + p {
    margin-top: 1.8em;
  }
  .sec-message .name {
    text-align: right;
  }

  .sec-awards-head {
    margin-top: 30px;
  }
  .awards .item .image {
    margin-bottom: 10px;
  }
  .awards .item {
    margin-bottom: 30px;
  }
  .awards .item:last-child {
    margin-bottom: 0;
  }
  .awards .item h3 {
    font-size: var(--fz14);
    margin-bottom: 2px;
  }

  .sec-example .icon {
    width: 52px;
    margin: 30px auto 20px;
  }
  .sec-example .filter {
    display: block;
    border: 1px solid #707070;
  }
  .sec-example .filter .title {
    font-size: var(--fz14);
    text-align: center;
    padding: 10px;
    position: relative;
  }
  .sec-example .filter .title::after {
    content: "＋";
    font-size: 12px;
    position: absolute;
    top: 12px;
    right: 15px;
  }
  .sec-example .filter .title.active::after {
    content: "－";
  }
  .sec-example .filter .select {
    display: none;
    padding: 10px 20px 20px;
  }

  .sec-example .filter .select p {
    font-size: var(--fz13);
    font-weight: 500;
    border-bottom: 1px solid #c0c0c0;
    padding-bottom: 0.2em;
    margin-bottom: 0.2em;
  }
  .sec-example .filter .select p span {
    font-size: var(--fz10);
    font-weight: 400;
  }
  .sec-example .filter .select div {
    line-height: 2.2;
    margin-bottom: 20px;
  }
  .sec-example .filter .select label {
    width: 49%;
    display: inline-block;
  }
  .sec-example .filter .select input[type="radio"] {
    transform: scale(1.2);
    vertical-align: -2px;
    margin-right: 0.2em;
  }
  .sec-example .filter input[type="submit"] {
    font-family: var(--sans);
    font-weight: 700;
    font-size: var(--fz13);
    background: var(--grn);
    display: block;
    width: 100%;
    height: 50px;
    line-height: 50px;
    border: none;
    text-align: center;
    color: #fff;
    cursor: pointer;
    position: relative;
    -webkit-appearance: none;
    margin: 20px auto 0;
  }

  .sec-example h2.search {
    text-align: center;
    margin-bottom: 20px;
  }

  .sec-example-single {
    margin-top: 40px;
  }
  .sec-example-single .mainphoto .photo {
    width: 100%;
    height: 0;
    padding-top: 100%;
    margin-bottom: 20px;
    background: #f5f5f5;
    position: relative;
  }
  .sec-example-single .mainphoto .photo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    position: absolute;
    top: 0;
    left: 0;
  }
  .sec-example-single .mainphoto .text {
    padding: 0 20px;
  }
  .sec-example-single2 .outline dt {
    width: 6em;
    float: left;
    clear: left;
  }
  .sec-example-single2 .outline dd {
    padding-left: 7em;
    margin-bottom: 0.5em;
  }
  .sec-example-single2 .cat {
    margin-top: 30px;
  }
  .sec-example-single2 .cat li {
    display: inline-block;
    margin: 0 5px 5px 0;
  }
  .sec-example-single2 .cat li a {
    display: block;
    background: #999;
    color: #fff;
    padding: 2px 8px;
  }

  .sec-voice-list {
    margin-top: 30px;
  }
  .voice-list .item {
    margin-bottom: 40px;
  }
  .voice-list .photo {
    height: 100px;
    margin-bottom: 5px;
  }
  .voice-list .title {
    font-weight: 500;
  }
  .voice-list .text {
    font-size: var(--fz11);
  }
  .voice-list .more-grn {
    font-size: var(--fz11);
    padding: 8px;
  }

  .sec-voice-single {
    margin-top: 30px;
  }
  .sec-voice-single .name {
    font-size: var(--fz14);
    text-align: right;
  }
  .sec-voice-single .content {
    margin-top: 30px;
  }
  .sec-voice-single .wp-block-image {
    margin: 1em auto;
  }

  .faq-menu .btn {
    border: 1px solid var(--grn);
    font-size: var(--fz11);
    color: var(--grn);
    padding: 5px;
    text-align: center;
    margin-bottom: 6px;
  }
  .faq-menu .btn.tab-active {
    background: var(--grn);
    color: #fff;
  }
  .faq-cnt {
    margin-top: 30px;
  }

  .sec-news {
    margin-top: 30px;
  }
  .news-single .title {
    border-bottom: 1px solid #c0c0c0;
    padding-bottom: 1em;
    margin-bottom: 1em;
  }
  .news-single .photo {
    margin-bottom: 20px;
  }
  .news-single .date {
    color: #8e8e8e;
    font-weight: 500;
  }

  .sec-event {
    margin-top: 30px;
  }
  .sec-event .event-list {
    border: none;
    padding: 0;
    margin: 0;
  }
  .sec-event .item {
    margin-bottom: 50px;
  }

  .event-single .photo {
    margin-bottom: 20px;
  }
  .event-single dl dt {
    width: 3em;
    float: left;
    clear: left;
  }
  .event-single dl dd {
    padding-left: 3em;
  }

  .news-single .wp-block-image,
  .event-single .wp-block-image {
    margin: 1em auto;
  }
  .news-single h2.wp-block-heading,
  .event-single h2.wp-block-heading {
    font-family: var(--sans);
    margin: 1em 0 0.5em;
    border-bottom: 1px solid #c0c0c0;
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
  }
  .news-single h3.wp-block-heading,
  .event-single h3.wp-block-heading {
    font-family: var(--sans);
    font-size: var(--fz14);
    margin: 1em 0 0.5em;
  }

  .event-single .sub01 {
    color: var(--grn);
    text-align: center;
  }
  .event-single .sub02 {
    font-family: var(--serif);
    background: var(--grn);
    color: #fff;
    font-size: var(--fz16);
    padding: 8px 20px;
    text-align: center;
    margin-top: 10px;
  }
  .event-single:has(.sub01) dl {
    display: none;
  }
  .event-single:has(.sub01) .photo {
    border: solid 5px var(--grn);
    border-top: none;
  }
  .event-single:has(.sub01) hr {
    margin: 40px 0;
    display: block;
    height: 1px;
    border: none;
    border-top: 1px solid #c0c0c0;
  }
  .event-single .sub03 {
    color: var(--grn);
    display: flex;
    gap: 3px;
    margin-bottom: 1em !important;
  }
  .event-single .sub03_1 {
    font-family: var(--serif) !important;
    border: solid 1px #c0c0c0;
    font-size: var(--fz16);
    padding: 8px 20px;
    text-align: center;
    margin-top: 10px;
  }
  .event-single .sub04 {
    font-size: var(--fz14);
    font-weight: bold;
    margin-bottom: 1em !important;
    font-family: var(--serif);
  }
  .event-single .sub03::before {
    content: "●";
  }
  .event-single:has(.sub01) table {
    table-layout: auto;
  }
  .event-single:has(.sub01) table th,
  .event-single:has(.sub01) table td {
    border: solid 1px #c0c0c0;
  }

  .sec-privacypolicy {
    margin-top: 30px;
  }
  .sec-privacypolicy .frame {
    border: 1px solid #b4b4b4;
    padding: 15px 20px;
  }

  .sec-privacypolicy h3 {
    font-size: var(--fz13);
    margin-top: 2em;
  }

  .sec-contact {
    margin-top: 20px;
  }

  .sec-404 {
    padding-top: 100px;
    text-align: center;
  }
  .sec-404 h2 {
    font-family: var(--sans);
    font-weight: 500;
    font-size: 100px;
    color: #929292;
    line-height: 1;
    margin-bottom: 0;
  }
  .sec-404 h3 {
    font-family: var(--sans);
    font-weight: 500;
    font-size: 30px;
    color: #929292;
    line-height: 1;
    margin-bottom: 30px;
  }

  .sec-thanks {
    padding-top: 40px;
    text-align: center;
  }

  /* --------------------------------------------------------------------------- */

  .sec-concept-top {
    margin-top: 20px;
  }
  .sec-concept-top h2 {
    text-align: center;
    font-family: var(--sans);
    font-size: var(--fz20);
    color: var(--grn);
    margin: 40px 0 1em;
    display: flex;
    align-items: center;
  }
  .sec-concept-top h2:before,
  .sec-concept-top h2:after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--grn);
    display: block;
  }
  .sec-concept-top h2:before {
    margin-right: 0.8em;
  }
  .sec-concept-top h2:after {
    margin-left: 0.8em;
  }

  .concept-item {
    margin-bottom: 60px;
  }
  .concept-item h3 {
    margin-top: 10px;
  }
  .concept-item dl {
    margin-top: 5px;
  }
  .concept-item dl dt {
    width: 5em;
    float: left;
    clear: left;
  }
  .concept-item dl dd {
    padding-left: 6em;
  }

  .sec-concept-single {
    margin-top: 30px;
  }
  .sec-concept-single .main {
    margin-bottom: 1em;
  }
  .sec-concept-single .wp-block-image {
    margin: 1em 0;
  }

  .concept-floor {
    width: calc(100% + 40px);
    margin: 0 -20px;
    background: #e9e9e9;
    padding: 20px;
    margin-top: 30px;
  }
  .concept-floor h3 {
    text-align: center;
  }
  .concept-floor .image {
    margin-top: 15px;
  }

  .concept-outline {
    border: 1px solid #757575;
    padding: 10px;
    margin-top: 30px;
  }
  .concept-outline h3 {
    text-align: center;
    margin-bottom: 10px;
  }
  .concept-outline dt {
    width: 6em;
    float: left;
    clear: left;
  }
  .concept-outline dd {
    padding-left: 7em;
  }

  .concept-spec {
    border: 1px solid #757575;
    padding: 10px;
    margin-top: 30px;
  }
  .concept-spec h3 {
    text-align: center;
    margin-bottom: 10px;
  }
  .concept-spec dt {
    width: 10em;
    float: left;
    clear: left;
  }
  .concept-spec dd {
    padding-left: 10em;
  }
 .request::after {
  display:none;
  }
  /* --------------------------------------------------------------------------- */
  /* --------------------------------------------------------------------------- */

  html .wp-pagenavi {
    display: table;
    margin: 20px auto 0;
  }
  html .wp-pagenavi span.current {
    border-color: var(--grn);
    background: var(--grn);
    color: #fff;
  }

  .red_fix {
    width: 100%;
    background: #d74514;
    color: #fff;
    text-align: center;
    position: fixed;
    bottom: 48.4px;
    z-index: 9999;
    font-size: 14px;
  }
  /* /////////////////////////////////////////////////////////////////////////// */
  /* /////////////////////////////////////////////////////////////////////////// */
  /* /////////////////////////////////////////////////////////////////////////// */

  @media screen and (min-width: 767.8px) {
    :root {
      --fz10: 12px;
      --fz11: 13px;
      --fz12: 14px;
      --fz13: 15px;
      --fz14: 16px;
      --fz15: 18px;
      --fz16: 19px;
      --fz18: 20px;
      --fz20: 22px;
    }
    .wrap {
      width: 768px;
    }
    header {
      width: 768px;
      left: calc(50% - 384px);
    }
    nav.bottom {
      width: 768px;
      left: calc(50% - 384px);
    }
    .nav {
      width: 768px;
      left: calc(50% - 384px);
    }
  } /**/
}