@charset "UTF-8";
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  padding: 0;
  outline: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

table,
td,
th {
  border: 1px solid #333;
}

html {
  font-size: 100%;
  background-color: #fff;
  word-break: break-word;
}

body {
  min-height: 100vh;
  color: #333;
  overflow-x: hidden;
  font: normal normal normal 14px/1.6 sans-serif;
  background-color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a,
a:active,
a:link,
a:visited {
  text-decoration: none;
  color: inherit;
}

a:hover {
  text-decoration: underline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
dialog,
hr,
img {
  display: block;
}

audio,
canvas,
iframe,
img,
svg,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

button,
input,
select,
textarea {
  font-family: inherit;
}

textarea {
  resize: vertical;
}

input,
select {
  vertical-align: middle;
}

button {
  vertical-align: inherit;
  line-height: inherit;
  cursor: pointer;
  border: none;
}

code,
kbd,
pre,
samp {
  font-family: monospace, sans-serif;
  font-size: 1em;
}

mark {
  background-color: #ff0;
}

small {
  font-size: 80%;
}

img {
  max-inline-size: 100%;
  height: auto;
}

ul,
ol {
  list-style: none;
}

.p-error-wrapper {
  min-height: calc(100vh - 200px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 40px 0;
}

.error-hero {
  width: 100%;
}
.error-hero .inner {
  width: 800px;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}
.error-hero .content {
  text-align: center;
}

.error-title {
  margin-bottom: 30px;
}
.error-title .number {
  display: block;
  font-size: 120px;
  font-weight: 900;
  color: #d4af37;
  line-height: 1;
  font-family: "Jost", sans-serif;
  letter-spacing: 0.05em;
}
@media (max-width: 768px) {
  .error-title .number {
    font-size: 80px;
  }
}
@media (max-width: 480px) {
  .error-title .number {
    font-size: 60px;
  }
}
.error-title .text {
  display: block;
  font-size: 24px;
  font-weight: 500;
  color: #333;
  margin-top: 10px;
  font-family: "Zen Kaku Gothic New", sans-serif;
  letter-spacing: 0.1em;
}
@media (max-width: 768px) {
  .error-title .text {
    font-size: 20px;
  }
}
@media (max-width: 480px) {
  .error-title .text {
    font-size: 16px;
  }
}

.error-message {
  font-size: 16px;
  line-height: 1.8;
  color: #666;
  margin-bottom: 40px;
  font-family: "Zen Kaku Gothic New", sans-serif;
}
@media (max-width: 768px) {
  .error-message {
    font-size: 14px;
    margin-bottom: 30px;
  }
}

.error-actions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.error-actions .btn {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10px;
  padding: 15px 30px;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  border-radius: 50px;
  font-family: "Zen Kaku Gothic New", sans-serif;
}
.error-actions .btn .tt {
  position: relative;
  z-index: 1;
}
.error-actions .btn .ico {
  width: 20px;
  height: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.error-actions .btn .ico svg {
  font-size: 0.8em;
}
.error-actions .btn.btn-primary {
  background-color: #d4af37;
  color: #fff;
}
.error-actions .btn.btn-primary:hover {
  background-color: #c4a030;
  -webkit-transform: translateY(-2px);
      -ms-transform: translateY(-2px);
          transform: translateY(-2px);
  -webkit-box-shadow: 0 5px 15px rgba(212, 175, 55, 0.3);
          box-shadow: 0 5px 15px rgba(212, 175, 55, 0.3);
}
.error-actions .btn.btn-primary:hover .ico {
  -webkit-transform: translateX(5px);
      -ms-transform: translateX(5px);
          transform: translateX(5px);
}
.error-actions .btn.btn-secondary {
  background-color: transparent;
  color: #333;
  border: 2px solid #333;
}
.error-actions .btn.btn-secondary:hover {
  background-color: #333;
  color: #fff;
  -webkit-transform: translateY(-2px);
      -ms-transform: translateY(-2px);
          transform: translateY(-2px);
  -webkit-box-shadow: 0 5px 15px rgba(51, 51, 51, 0.2);
          box-shadow: 0 5px 15px rgba(51, 51, 51, 0.2);
}
.error-actions .btn.btn-secondary:hover .ico {
  -webkit-transform: translateX(5px);
      -ms-transform: translateX(5px);
          transform: translateX(5px);
}
@media (max-width: 480px) {
  .error-actions .btn {
    width: 100%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 12px 20px;
    font-size: 14px;
  }
}

.error-bg {
  margin-top: 40px;
}
@media (max-width: 768px) {
  .error-bg {
    margin-top: 30px;
  }
}

/* style */
/* ======================================================== */
/* 
.zen-kaku-gothic-new-light {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.zen-kaku-gothic-new-regular {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.zen-kaku-gothic-new-medium {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.zen-kaku-gothic-new-bold {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.zen-kaku-gothic-new-black {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 900;
  font-style: normal;
}


// <weight>: Use a value from 100 to 900
// <uniquifier>: Use a unique and descriptive class name

.jost-<uniquifier> {
  font-family: "Jost", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}


.shippori-mincho-regular {
  font-family: "Shippori Mincho", serif;
  font-weight: 400;
  font-style: normal;
}

.shippori-mincho-medium {
  font-family: "Shippori Mincho", serif;
  font-weight: 500;
  font-style: normal;
}

.shippori-mincho-semibold {
  font-family: "Shippori Mincho", serif;
  font-weight: 600;
  font-style: normal;
}

.shippori-mincho-bold {
  font-family: "Shippori Mincho", serif;
  font-weight: 700;
  font-style: normal;
}

.shippori-mincho-extrabold {
  font-family: "Shippori Mincho", serif;
  font-weight: 800;
  font-style: normal;
}

*/
/* ======================================================== */
:root {
  /* flex list */
  --flex-list-column-gap: 0;
  --flex-list-col-num: 0;
  /* color */
  --font-color: #141414;
  --theme-color: #119C63;
  --key01-color: #87DAB7;
  --key02-color: #D6F1E1;
  --key03-color: #FDEED0;
  --key04-color: #F4F4F4;
  --bg01-color: #15AA6C;
  --bg02-color: #F3FFF8;
  --btn01-color: #EE8834;
  --border01-color: #E08031;
  --shadow01-color: #FFD8B7;
  --shasow02-color: #DCF4EA;
  --mark-color: #FFFF0D;
  --border-color: #C9C9C9;
  --border02-color: #d9d9d9;
  --main-width: min(750 / var(--media-width) * 100vw, 750px);
  --media-width: 1920;
  --inner-width: min(690 / var(--media-width) * 100vw, 690px);
}
@media (max-width: 1100px) {
  :root {
    --main-width: 50%;
    --media-width: 1500;
  }
}
@media (max-width: 750px) {
  :root {
    --main-width: 100%;
    --media-width: 750;
  }
}

body {
  background-color: #F3FFF8;
  color: var(--font-color);
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-style: normal;
}
body::before {
  content: "";
  width: 100%;
  height: 6px;
  position: fixed;
  top: 0;
  left: 0;
  background-color: var(--theme-color);
  z-index: 99999;
}

.inner {
  width: calc(var(--inner-width) + 40px);
  max-width: 100%;
  margin: auto;
  padding: 0 20px;
}

.nowrap {
  white-space: nowrap;
  display: inline-block;
}

.hasbg {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  position: relative;
}
.hasbg img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

svg {
  width: 1em;
  min-width: 1em;
  height: 1em;
}

/* ======================================================== */
.pc-slider {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  overflow: hidden;
  z-index: 1;
  border-top: 6px solid var(--theme-color);
}
.pc-slider .slider-bg {
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, -20px);
      -ms-transform: translate(-50%, -20px);
          transform: translate(-50%, -20px);
  width: 100%;
  max-width: 75.1552795031%;
  height: 100%;
  z-index: -1;
}
.pc-slider .slider-bg img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: contain;
     object-fit: contain;
  -o-object-position: bottom center;
     object-position: bottom center;
}

.pc-slider-left {
  position: relative;
  width: calc((100% - var(--main-width)) / 2);
  height: 100%;
  display: grid;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 20px;
}
.pc-slider-left .nav {
  max-width: 343px;
  width: 100%;
  margin: auto;
}
.pc-slider-left .site-nav-list {
  --list-ico-bg-color: var(--theme-color);
  --list-ico-color: #fff;
  font-size: 18.57px;
}
@media (max-width: 1100px) {
  .pc-slider-left {
    width: 50%;
  }
}
@media (max-width: 750px) {
  .pc-slider-left {
    display: none;
  }
}

.pc-slider-right {
  position: relative;
  width: calc((100% - var(--main-width)) / 2);
  height: 100%;
  display: grid;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 20px;
}
.pc-slider-right .nav-contact {
  --con-box-line-color: var(--theme-color);
  font-size: 14px;
  max-width: 343px;
  width: 100%;
  margin: auto;
}
@media (max-width: 1400px) {
  .pc-slider-right .nav-contact .line .tt {
    font-size: 0.8em;
  }
}
.pc-slider-right .nav-contact .site-btn {
  font-size: 20px;
  max-width: 17.15em;
}
@media (max-width: 1100px) {
  .pc-slider-right {
    display: none;
  }
}

main {
  position: relative;
  z-index: 3;
  background-color: #fff;
  width: var(--main-width);
  max-width: 100%;
  height: 100%;
  min-height: 100dvh;
  -webkit-box-shadow: 0 0 8px rgba(180, 180, 180, 0.25);
          box-shadow: 0 0 8px rgba(180, 180, 180, 0.25);
  margin-left: calc((100% - var(--main-width)) / 2);
  border-top: 6px solid var(--theme-color);
}
@media (max-width: 1100px) {
  main {
    width: 50%;
    margin-left: 50%;
    margin-right: 0;
  }
}
@media (max-width: 750px) {
  main {
    width: 100%;
    margin-left: 0;
    padding-top: min(140 / var(--media-width) * 100vw, 140px);
  }
}

/* --------------------------------------------- */
/* site header */
.site-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: min(20 / var(--media-width) * 100vw, 20px);
  padding-bottom: min(20 / var(--media-width) * 100vw, 20px);
}
.site-header .logo {
  color: var(--theme-color);
  font-size: min(28 / var(--media-width) * 100vw, 30px);
  font-weight: 700;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 6px;
  line-height: 1.1;
  text-decoration: none !important;
  -webkit-transition: 0.3s;
  transition: 0.3s;
  margin-left: min(20px, 20 / var(--media-width) * 100vw);
}
.site-header .logo .ico {
  width: min(80 / var(--media-width) * 100vw, 80px);
}
.site-header .logo .txt {
  white-space: nowrap;
}
@media (pointer: fine) {
  .site-header .logo:hover {
    opacity: 0.8;
  }
}
.site-header .right {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: min(24 / var(--media-width) * 100vw, 24px);
}
.site-header .links {
  font-size: min(28.57px, 28.57 / var(--media-width) * 100vw);
  font-weight: 700;
  line-height: 1.08;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: min(12 / var(--media-width) * 100vw, 12px);
}
.site-header .links a {
  width: 3.8151907595em;
  aspect-ratio: 1;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: var(--theme-color);
  color: #fff;
  border-radius: 100%;
  text-decoration: none !important;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media (pointer: fine) {
  .site-header .links a:hover {
    -webkit-box-shadow: 0 0 10px rgba(180, 180, 180, 0.25);
            box-shadow: 0 0 10px rgba(180, 180, 180, 0.25);
  }
}
.site-header .links .tel svg {
  font-size: 1.5400770039em;
}
@media (min-width: 751px) {
  .site-header .links .tel {
    pointer-events: none;
  }
}
.site-header .links .contact {
  background-color: var(--btn01-color);
}
.site-header .site-menu::before {
  content: "";
  position: absolute;
  top: -0.5px;
  left: calc(var(--site-menu-border-radius) * -1);
  width: var(--site-menu-border-radius);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--site-menu-border-radius) at 0 100%, transparent 97%, var(--theme-color) 100%);
}
@media (max-width: 750px) {
  .site-header {
    position: fixed;
    top: 6px;
    left: 0;
    right: 0;
    z-index: 999;
    background-color: #fff;
  }
}

/* site navigation */
.site-nav {
  min-height: 100%;
  background-color: var(--theme-color);
  color: #fff;
  padding: 0 20px;
  padding-bottom: 60px;
  padding-bottom: calc(constant(safe-area-inset-bottom) + 60px);
  padding-bottom: calc(env(safe-area-inset-bottom) + 60px);
}
.site-nav .menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-right: -20px;
}
.site-nav .nav-inner {
  width: calc(650 / var(--media-width) * 100vw);
  max-width: 100%;
  margin: 0 auto;
}

.site-nav-list {
  --list-ico-bg-color: #fff;
  --list-ico-color: var(--theme-color);
  font-size: min(32px, 32 / var(--media-width) * 100vw);
  width: 100%;
}
.site-nav-list li {
  width: 100%;
}
.site-nav-list a {
  padding: 1em 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 20px;
  font-weight: 500;
  text-decoration: none !important;
  border-bottom: 1px solid var(--list-ico-bg-color);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media (pointer: fine) {
  .site-nav-list a:hover .ico {
    -webkit-transform: translateX(20%);
        -ms-transform: translateX(20%);
            transform: translateX(20%);
  }
}
.site-nav-list .ico {
  font-size: 0.375em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 2.5em;
  min-width: 2.5em;
  aspect-ratio: 1;
  border-radius: 100%;
  background-color: var(--list-ico-bg-color);
  color: var(--list-ico-color);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.site-nav-list .ico svg {
  height: 0.6471615721em;
}

/* site menu */
.site-menu {
  --site-menu-border-radius: min(30 / var(--media-width) * 100vw, 30px);
  position: relative;
  width: min(120px, 120 / var(--media-width) * 100vw);
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 0;
  gap: min(15 / var(--media-width) * 100vw, 15px);
  background-color: var(--theme-color);
  border-radius: 0 0 0 var(--site-menu-border-radius);
  cursor: pointer;
}
.site-menu span {
  width: 44.1666666667%;
  height: min(3 / var(--media-width) * 100vw, 3px);
  background-color: #fff;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
/* site footer */
.site-footer {
  background-color: var(--theme-color);
  color: #fff;
  border-radius: min(40 / var(--media-width) * 100vw, 40px) min(40 / var(--media-width) * 100vw, 40px) 0 0;
  padding: min(60 / var(--media-width) * 100vw, 60px) min(30 / var(--media-width) * 100vw, 30px) min(30 / var(--media-width) * 100vw, 30px);
  position: relative;
  z-index: 5;
}
.site-footer .con-logo-add {
  margin-bottom: min(60 / var(--media-width) * 100vw, 60px);
  margin-bottom: min(50 / var(--media-width) * 100vw, 50px);
}
.site-footer .con-logo-add .logo {
  font-size: min(40 / var(--media-width) * 100vw, 40px);
  font-weight: 700;
  text-decoration: none !important;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: baseline;
      align-content: baseline;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: min(10 / var(--media-width) * 100vw, 10px);
  line-height: 1.2;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.site-footer .con-logo-add .logo .ico {
  width: min(50 / var(--media-width) * 100vw, 50px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media (pointer: fine) {
  .site-footer .con-logo-add .logo:hover {
    opacity: 0.8;
  }
}
.site-footer .con-logo-add .address {
  font-size: min(28 / var(--media-width) * 100vw, 28px);
  font-weight: 500;
  margin-top: 0.5357142857em;
}
.site-footer .nav-con-boxes {
  margin-bottom: min(50 / var(--media-width) * 100vw, 50px);
}
.site-footer .links {
  text-align: center;
  margin-bottom: min(20 / var(--media-width) * 100vw, 20px);
}
.site-footer .privacy {
  font-size: min(22 / var(--media-width) * 100vw, 22px);
  font-weight: 500;
  text-align: center;
  color: var(--key01-color);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media (pointer: fine) {
  .site-footer .privacy:hover {
    color: #fff;
  }
}
.site-footer .copyright {
  font-size: min(20 / var(--media-width) * 100vw, 20px);
  font-weight: 500;
  text-align: center;
  color: var(--key01-color);
}

/* nav contact boxes */
.nav-con-boxes {
  background-color: var(--bg01-color);
  border-radius: min(40 / var(--media-width) * 100vw, 40px);
  color: #fff;
  padding: min(50 / var(--media-width) * 100vw, 50px) min(20 / var(--media-width) * 100vw, 20px);
  margin-top: min(68 / var(--media-width) * 100vw, 68px);
  text-align: center;
}

.nav-contact {
  --con-box-line-color: #fff;
  text-align: center;
  font-size: min(24 / var(--media-width) * 100vw, 24px);
}
.nav-contact .tel-con .tt {
  font-size: 1.3333333333em;
  font-weight: 500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.25em;
  margin-bottom: 0.3125em;
}
.nav-contact .tel-con .tel {
  font-size: 3em;
  font-weight: 700;
  color: var(--con-box-line-color);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.1388888889em;
  line-height: 1;
}
.nav-contact .tel-con .tel a {
  text-decoration: none !important;
}
@media (min-width: 751px) {
  .nav-contact .tel-con .tel a {
    pointer-events: none;
  }
}
.nav-contact .tel-con .tel svg {
  font-size: 0.75em;
  -webkit-transform: translateY(10%);
      -ms-transform: translateY(10%);
          transform: translateY(10%);
}
.nav-contact .tel-con .time {
  font-weight: 500;
  margin-top: 1em;
}
.nav-contact .con {
  font-size: 1.3333333333em;
  margin-top: 1.25em;
  padding-top: 1.25em;
  position: relative;
}
.nav-contact .con::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 560px;
  max-width: 91.8032786885%;
  height: 1px;
  border-top: 2px dashed var(--con-box-line-color);
}
.nav-contact .con .tt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.3125em;
  font-weight: 700;
}
.nav-contact .site-btn {
  --btn-bg-color: var(--btn01-color);
  --font-size: 36;
  margin-top: calc(22 / var(--font-size) * 1em);
}
.nav-contact .site-btn .btn {
  font-weight: 700;
  border: calc(4 / var(--font-size) * 1em) solid var(--border01-color);
  -webkit-box-shadow: calc(2 / var(--font-size) * 1em) calc(8 / var(--font-size) * 1em) 0 var(--shadow01-color);
          box-shadow: calc(2 / var(--font-size) * 1em) calc(8 / var(--font-size) * 1em) 0 var(--shadow01-color);
  padding: 1em;
}
@media (pointer: fine) {
  .nav-contact .site-btn .btn:hover {
    -webkit-box-shadow: 0 0 0 var(--shadow01-color);
            box-shadow: 0 0 0 var(--shadow01-color);
    -webkit-transform: translateY(calc(5 / var(--font-size) * 1em));
        -ms-transform: translateY(calc(5 / var(--font-size) * 1em));
            transform: translateY(calc(5 / var(--font-size) * 1em));
  }
}
.nav-contact .line {
  font-size: 0.75em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 0.8em;
  margin-top: 2em;
}
.nav-contact .line a {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 4em;
  aspect-ratio: 1;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
@media (pointer: fine) {
  .nav-contact .line a:hover {
    opacity: 0.8;
  }
}

/* site btn */
.site-btn {
  --btn-bg-color: var(--theme-color);
  --list-ico-bg-color: #fff;
  --list-ico-color: var(--btn-bg-color);
  --font-size: 30;
  font-size: min(var(--font-size) / var(--media-width) * 100vw, var(--font-size) * 1px);
  width: 100%;
  max-width: calc(610 / var(--font-size) * 1em);
  margin: auto;
}
.site-btn .btn {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: var(--btn-bg-color);
  color: #fff;
  text-decoration: none !important;
  border-radius: 100em;
  padding: 1.5em 1em;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media (pointer: fine) {
  .site-btn .btn:hover .ico {
    -webkit-transform: translate(15%, -50%);
        -ms-transform: translate(15%, -50%);
            transform: translate(15%, -50%);
  }
}
.site-btn .tt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: calc(10 / var(--font-size) * 1em);
  font-weight: 500;
}
.site-btn .ico {
  position: absolute;
  top: 50%;
  right: calc(var(--font-size) / 18 * 1em);
  -webkit-transform: translate(0%, -50%);
      -ms-transform: translate(0%, -50%);
          transform: translate(0%, -50%);
  font-size: calc(18 / var(--font-size) * 1em);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 2.5em;
  min-width: 2.5em;
  aspect-ratio: 1;
  border-radius: 100%;
  background-color: var(--list-ico-bg-color);
  color: var(--list-ico-color);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.site-btn .ico svg {
  height: 0.6471615721em;
}

.drop-down-menu {
  position: fixed;
  top: 0;
  left: 50%;
  max-width: var(--main-width);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  width: 100%;
  z-index: 99999;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  transition: 0.4s;
  overflow: hidden;
  overflow-y: auto;
  padding-top: 6px;
  height: 0;
  pointer-events: none;
}
.drop-down-menu .site-nav-list li {
  -webkit-transform: translateY(20%);
      -ms-transform: translateY(20%);
          transform: translateY(20%);
  opacity: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.drop-down-menu .nav-con-boxes {
  -webkit-transform: translateY(20%);
      -ms-transform: translateY(20%);
          transform: translateY(20%);
  opacity: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
@media (max-width: 1100px) {
  .drop-down-menu {
    left: auto;
    right: 0;
    -webkit-transform: translateX(0%);
        -ms-transform: translateX(0%);
            transform: translateX(0%);
  }
}
/* show menu */
.show_menu .site-menu span:nth-child(1) {
  -webkit-transform: translateY(calc(50% + min(16 / var(--media-width) * 100vw, 16px))) rotate(135deg);
      -ms-transform: translateY(calc(50% + min(16 / var(--media-width) * 100vw, 16px))) rotate(135deg);
          transform: translateY(calc(50% + min(16 / var(--media-width) * 100vw, 16px))) rotate(135deg);
}
.show_menu .site-menu span:nth-child(2) {
  -webkit-transform: translateX(80%);
      -ms-transform: translateX(80%);
          transform: translateX(80%);
  opacity: 0;
}
.show_menu .site-menu span:nth-child(3) {
  -webkit-transform: translateY(calc(-50% - min(16 / var(--media-width) * 100vw, 16px))) rotate(-135deg);
      -ms-transform: translateY(calc(-50% - min(16 / var(--media-width) * 100vw, 16px))) rotate(-135deg);
          transform: translateY(calc(-50% - min(16 / var(--media-width) * 100vw, 16px))) rotate(-135deg);
}
.show_menu .drop-down-menu {
  height: 100%;
  min-height: 100vh;
  pointer-events: auto;
}
.show_menu .drop-down-menu .site-nav-list li {
  -webkit-transform: translate(0);
      -ms-transform: translate(0);
          transform: translate(0);
  opacity: 1;
  /* scss for */
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(1) {
  -webkit-transition-delay: calc(0.3s + 1 * 0.1s);
          transition-delay: calc(0.3s + 1 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(2) {
  -webkit-transition-delay: calc(0.3s + 2 * 0.1s);
          transition-delay: calc(0.3s + 2 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(3) {
  -webkit-transition-delay: calc(0.3s + 3 * 0.1s);
          transition-delay: calc(0.3s + 3 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(4) {
  -webkit-transition-delay: calc(0.3s + 4 * 0.1s);
          transition-delay: calc(0.3s + 4 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(5) {
  -webkit-transition-delay: calc(0.3s + 5 * 0.1s);
          transition-delay: calc(0.3s + 5 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(6) {
  -webkit-transition-delay: calc(0.3s + 6 * 0.1s);
          transition-delay: calc(0.3s + 6 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(7) {
  -webkit-transition-delay: calc(0.3s + 7 * 0.1s);
          transition-delay: calc(0.3s + 7 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(8) {
  -webkit-transition-delay: calc(0.3s + 8 * 0.1s);
          transition-delay: calc(0.3s + 8 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(9) {
  -webkit-transition-delay: calc(0.3s + 9 * 0.1s);
          transition-delay: calc(0.3s + 9 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li:nth-child(10) {
  -webkit-transition-delay: calc(0.3s + 10 * 0.1s);
          transition-delay: calc(0.3s + 10 * 0.1s);
}
.show_menu .drop-down-menu .site-nav-list li {
  /* scss for end */
}
.show_menu .drop-down-menu .nav-con-boxes {
  -webkit-transform: translate(0);
      -ms-transform: translate(0);
          transform: translate(0);
  opacity: 1;
  -webkit-transition-delay: 0.9s;
          transition-delay: 0.9s;
}

/* ======================================================== */
/* --------------------------------------------- */
.site-title {
  font-size: min(23 / var(--media-width) * 100vw, 23px);
  text-align: center;
  margin-bottom: min(40 / var(--media-width) * 100vw, 40px);
}
.site-title .en {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 10px;
  color: var(--theme-color);
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.08em;
}
.site-title .en::before {
  content: "";
  display: block;
  width: 10px;
  min-width: 10px;
  aspect-ratio: 1;
  border-radius: 100%;
  background-color: var(--theme-color);
}
.site-title .ja {
  font-size: 1.8em;
  font-weight: 700;
  line-height: 1.25;
}
.site-title .ja .underline {
  position: relative;
  z-index: 3;
  display: inline-block;
  padding-bottom: 0.1923076923em;
}
.site-title .ja .underline::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  -webkit-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  width: 100%;
  height: 0.4807692308em;
  background: var(--key02-color);
  border-radius: 3px;
  display: block;
  z-index: -1;
}
.site-title.left {
  text-align: left;
}
.site-title.left .en {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.section-store {
  padding: min(80 / var(--media-width) * 100vw, 80px) 0;
  position: relative;
  z-index: 4;
  background-color: var(--bg02-color);
  border-radius: min(40 / var(--media-width) * 100vw, 40px);
  margin-top: min(50 / var(--media-width) * 100vw, 50px);
}
.section-store .address {
  text-align: center;
  font-size: min(32px, 32 / var(--media-width) * 100vw);
  font-weight: 500;
}
.section-store .parking {
  margin-top: calc(25 / var(--media-width) * 100vw);
  margin-bottom: calc(50 / var(--media-width) * 100vw);
}
.section-store .parking .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: min(28px, 28 / var(--media-width) * 100vw);
  font-weight: 500;
  line-height: 1.44;
  letter-spacing: 0.02em;
}
.section-store .parking .ttl span {
  background-color: #CFF4DE;
  color: var(--theme-color);
  border-radius: 3px;
  display: inline-block;
  padding: 1px 13px;
}
.section-store .figs {
  --flex-list-col-num: 2;
  --flex-list-column-gap: calc(5 / var(--media-width) * 100vw);
  margin-top: calc(50 / var(--media-width) * 100vw);
  margin-bottom: calc(10 / var(--media-width) * 100vw);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: var(--flex-list-column-gap);
}
.section-store .figs .fig {
  width: calc((100% - var(--flex-list-column-gap) * (var(--flex-list-col-num) - 1)) / var(--flex-list-col-num));
}
.section-store .ggmap {
  width: 100%;
  height: auto;
  aspect-ratio: 684/306.66;
  position: relative;
}
.section-store .ggmap iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.section-store .store-ico {
  width: calc(165 / var(--media-width) * 100vw);
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: translate(min(20 / var(--media-width) * 100vw, 20px), calc(min(50 / var(--media-width) * 100vw, 50px) * -1));
      -ms-transform: translate(min(20 / var(--media-width) * 100vw, 20px), calc(min(50 / var(--media-width) * 100vw, 50px) * -1));
          transform: translate(min(20 / var(--media-width) * 100vw, 20px), calc(min(50 / var(--media-width) * 100vw, 50px) * -1));
}

.section-contact {
  padding: calc(70 / var(--media-width) * 100vw) 0;
  --inner-width: calc(680 / var(--media-width) * 100vw);
  position: relative;
  z-index: 3;
}
.section-contact .boxes {
  padding: calc(60 / var(--media-width) * 100vw) 0;
  background-color: #fff;
  border-radius: calc(40 / var(--media-width) * 100vw);
}
.section-contact .nav-contact {
  --con-box-line-color: var(--theme-color);
}
.section-contact .hasbg {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  width: 100%;
  height: 140%;
}

/* -------------------- */
/* animate */
.normalmove {
  -webkit-transition-duration: 0.6s;
          transition-duration: 0.6s;
  -webkit-transform: translateY(50px);
      -ms-transform: translateY(50px);
          transform: translateY(50px);
  opacity: 0;
}
.normalmove.normalanimate {
  -webkit-transform: translateY(0px);
      -ms-transform: translateY(0px);
          transform: translateY(0px);
  opacity: 1;
}

/* --------------------------------------------- */
/* front page style */
.index-hero {
  position: relative;
  z-index: 3;
  --site-menu-border-radius: min(20 / var(--media-width) * 100vw, 20px);
}
.index-hero .hero-boxes {
  position: relative;
  z-index: 3;
}
.index-hero .hero-boxes .bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: var(--bg02-color);
  z-index: -1;
  width: 100%;
  height: 10.5%;
}
.index-hero .hero-boxes .bottom::before {
  position: absolute;
  top: calc(var(--site-menu-border-radius) * -1);
  left: 0px;
  width: var(--site-menu-border-radius);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--site-menu-border-radius) at 100% 0, transparent 97%, var(--bg02-color) 100%);
}
.index-hero .hero-boxes .bottom::after {
  position: absolute;
  right: calc(var(--site-menu-border-radius) * -1);
  bottom: 0px;
  width: var(--site-menu-border-radius);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--site-menu-border-radius) at 100% 0, transparent 97%, var(--bg02-color) 100%);
}
.index-hero .bg {
  position: relative;
  overflow: hidden;
  aspect-ratio: 250/260;
}
.index-hero .bg img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.index-hero .txt {
  position: absolute;
  top: 0.5604619565em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 0.3057065217em;
  font-weight: 500;
  line-height: 1.06;
  font-size: min(53 / var(--media-width) * 100vw, 53px);
  left: 0.339673913em;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}
.index-hero .txt .col {
  background-color: #fff;
  border-radius: 0.275862069em;
  border: 0.0344827586em solid var(--theme-color);
  padding: 0.0862068966em 0.0862068966em 0.25em;
  -webkit-transition-duration: 0.6s;
          transition-duration: 0.6s;
  -webkit-transform: translateY(50px);
      -ms-transform: translateY(50px);
          transform: translateY(50px);
  opacity: 0;
  -webkit-box-shadow: 0.1034482759em 0.0517241379em 0 var(--theme-color);
          box-shadow: 0.1034482759em 0.0517241379em 0 var(--theme-color);
  padding: 0.1724137931em 0.25em 0.25em;
  -webkit-font-feature-settings: "palt";
          font-feature-settings: "palt";
}
.index-hero .txt .col:nth-child(1) {
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
}
.index-hero .txt .col:nth-child(2) {
  -webkit-transition-delay: 0.3s;
          transition-delay: 0.3s;
}
.index-hero .txt .col:nth-child(3) {
  -webkit-transition-delay: 0.6s;
          transition-delay: 0.6s;
}
.index-hero .txt .small {
  font-size: 0.7866847826em;
  line-height: 1.08;
}
.index-hero .circle {
  font-size: min(28 / var(--media-width) * 100vw, 28px);
  font-weight: 700;
  position: absolute;
  bottom: min(45 / var(--media-width) * 100vw, 45px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.8571428571em;
  z-index: 5;
  bottom: 0;
  right: min(30 / var(--media-width) * 100vw, 30px);
}
.index-hero .circle .col {
  width: 6.75em;
  aspect-ratio: 1;
  background-color: var(--theme-color);
  color: #fff;
  border-radius: 100%;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  line-height: 1.15;
  -webkit-transition-duration: 0.6s;
          transition-duration: 0.6s;
  -webkit-transform: translateY(50px);
      -ms-transform: translateY(50px);
          transform: translateY(50px);
  opacity: 0;
}
.index-hero .circle .col:nth-child(1) {
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}
.index-hero .circle .col:nth-child(2) {
  -webkit-transition-delay: 1.1s;
          transition-delay: 1.1s;
}
.index-hero .circle .col:nth-child(3) {
  -webkit-transition-delay: 1.4s;
          transition-delay: 1.4s;
}
.index-hero .circle .big {
  font-size: 1.1428571429em;
}
.index-hero .circle em {
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.5714285714em;
  font-weight: 500;
  font-style: normal;
  line-height: 1;
}
.index-hero .circle .small {
  font-size: 0.8571428571em;
}
.index-hero .read {
  position: relative;
  z-index: 3;
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  font-weight: 500;
  line-height: 1.7333333333em;
  padding-bottom: 10px;
}
.index-hero .read .tt {
  -webkit-transition-duration: 0.6s;
          transition-duration: 0.6s;
  -webkit-transform: translateY(50px);
      -ms-transform: translateY(50px);
          transform: translateY(50px);
  opacity: 0;
  -webkit-transition-delay: 1.5s;
          transition-delay: 1.5s;
}
.index-hero .read .inner {
  -webkit-transform: translateY(-1.16em);
      -ms-transform: translateY(-1.16em);
          transform: translateY(-1.16em);
}
.index-hero .read .underline {
  position: relative;
  display: inline-block;
}
.index-hero .read .underline::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  -webkit-transform: translate(-50%, -0.1em);
      -ms-transform: translate(-50%, -0.1em);
          transform: translate(-50%, -0.1em);
  width: 100%;
  height: 0.5333333333em;
  background: var(--key02-color);
  border-radius: 3px;
  display: block;
  z-index: -1;
}
.index-hero .read .underline.underline-color2::after {
  background: var(--key03-color);
}
.index-hero .read::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 81.0666666667%;
  height: 100%;
  background-color: var(--bg02-color);
  z-index: -1;
  border-radius: 0 0 40px 0;
}
.index-hero.normalanimate .col {
  -webkit-transform: translateY(0px);
      -ms-transform: translateY(0px);
          transform: translateY(0px);
  opacity: 1;
}
.index-hero.normalanimate .read .tt {
  -webkit-transform: translateY(0px);
      -ms-transform: translateY(0px);
          transform: translateY(0px);
  opacity: 1;
}

.index-peform {
  margin: min(80 / var(--media-width) * 100vw, 80px) auto;
  position: relative;
  z-index: 4;
}
.index-peform .peform {
  margin-top: min(80 / var(--media-width) * 100vw, 80px);
  position: relative;
  z-index: 3;
}
.index-peform .peform::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: calc(100% - min(60 / var(--media-width) * 100vw, 60px));
  height: 100%;
  -webkit-transform: translate(0, min(70 / var(--media-width) * 100vw, 70px));
      -ms-transform: translate(0, min(70 / var(--media-width) * 100vw, 70px));
          transform: translate(0, min(70 / var(--media-width) * 100vw, 70px));
  background-color: var(--bg02-color);
  z-index: -1;
  border-radius: min(40 / var(--media-width) * 100vw, 40px) 0 0 min(40 / var(--media-width) * 100vw, 40px);
}
.index-peform .list {
  --flex-list-col-num: 2;
  --flex-list-column-gap: min(20 / var(--media-width) * 100vw, 20px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-column-gap: var(--flex-list-column-gap);
     -moz-column-gap: var(--flex-list-column-gap);
          column-gap: var(--flex-list-column-gap);
  row-gap: min(80 / var(--media-width) * 100vw, 80px);
}
.index-peform .item {
  width: calc((100% - var(--flex-list-column-gap) * (var(--flex-list-col-num) - 1)) / var(--flex-list-col-num));
  text-decoration: none !important;
}
@media (pointer: fine) {
  .index-peform .item:hover .img img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1);
  }
  .index-peform .item:hover .ico {
    -webkit-transform: translate(10%, 0);
        -ms-transform: translate(10%, 0);
            transform: translate(10%, 0);
  }
}
.index-peform .fig {
  width: 100%;
  aspect-ratio: 335/230;
  border-radius: min(15 / var(--media-width) * 100vw, 15px);
  position: relative;
  z-index: 3;
  background-color: var(--bg02-color);
}
.index-peform .img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  z-index: -1;
  overflow: hidden;
  border-radius: min(15 / var(--media-width) * 100vw, 15px);
}
.index-peform .img img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
}
.index-peform .tt {
  font-size: min(45.28 / var(--media-width) * 100vw, 45.28px);
  font-weight: 500;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  text-orientation: upright;
  background-color: #fff;
  border-radius: 0.2380742049em;
  border: 0.0441696113em solid var(--theme-color);
  -webkit-box-shadow: 0.066254417em 0.066254417em 0 var(--theme-color);
          box-shadow: 0.066254417em 0.066254417em 0 var(--theme-color);
  padding: 0.2208480565em 0.1104240283em;
  line-height: 1.1;
  -webkit-transform: translate(min(27 / var(--media-width) * 100vw, 27px), calc(min(16 / var(--media-width) * 100vw, 16px) * -1));
      -ms-transform: translate(min(27 / var(--media-width) * 100vw, 27px), calc(min(16 / var(--media-width) * 100vw, 16px) * -1));
          transform: translate(min(27 / var(--media-width) * 100vw, 27px), calc(min(16 / var(--media-width) * 100vw, 16px) * -1));
}
.index-peform .arrow {
  --arrow-border-radius: min(15 / var(--media-width) * 100vw, 15px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: absolute;
  bottom: 0;
  right: 0;
  width: min(66 / var(--media-width) * 100vw, 66px);
  aspect-ratio: 1;
  border-radius: var(--arrow-border-radius) 0 min(14 / var(--media-width) * 100vw, 14px) 0;
  background-color: var(--bg02-color);
}
.index-peform .arrow::before {
  content: "";
  position: absolute;
  top: calc(var(--arrow-border-radius) * -1);
  right: 0px;
  width: var(--arrow-border-radius);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--arrow-border-radius) at 0 0, transparent 97%, var(--bg02-color) 100%);
}
.index-peform .arrow::after {
  content: "";
  position: absolute;
  left: calc(var(--arrow-border-radius) * -1);
  bottom: 0px;
  width: var(--arrow-border-radius);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--arrow-border-radius) at 0 0, transparent 97%, var(--bg02-color) 100%);
}
.index-peform .ico {
  background-color: var(--theme-color);
  color: #fff;
  font-size: min(18 / var(--media-width) * 100vw, 18px);
  width: 2.5em;
  aspect-ratio: 1;
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.index-peform .ico svg {
  height: 0.6470588235em;
}
.index-peform .con {
  text-align: center;
  font-size: min(24 / var(--media-width) * 100vw, 24px);
  font-weight: 500;
  line-height: 1.2857142857;
  color: var(--theme-color);
  margin-top: 0.5714285714em;
}
.index-peform .sub {
  font-size: min(32 / var(--media-width) * 100vw, 32px);
  font-weight: 500;
  line-height: 1.6875;
  letter-spacing: 0.04em;
  text-align: center;
  margin-top: min(60 / var(--media-width) * 100vw, 60px);
  margin-bottom: min(40 / var(--media-width) * 100vw, 40px);
}
.index-peform .sub .underline {
  position: relative;
  display: inline-block;
  z-index: 3;
}
.index-peform .sub .underline::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  -webkit-transform: translate(-50%, -0.1em);
      -ms-transform: translate(-50%, -0.1em);
          transform: translate(-50%, -0.1em);
  width: 100%;
  height: 0.5em;
  background: var(--key03-color);
  border-radius: 0.09375em;
  display: block;
  z-index: -1;
}
.index-peform .sub::before {
  content: "";
  display: block;
  width: min(13 / var(--media-width) * 100vw, 13px);
  aspect-ratio: 1;
  border-radius: 100%;
  margin: auto;
  margin-bottom: min(20 / var(--media-width) * 100vw, 20px);
  background-color: var(--theme-color);
}
.index-peform .bottom {
  position: relative;
  z-index: 3;
}
.index-peform .peform-top-ico {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  width: min(418 / var(--media-width) * 100vw, 418px);
  -webkit-transform: translate(0, -55%);
      -ms-transform: translate(0, -55%);
          transform: translate(0, -55%);
}

.index-reason {
  --reason-border-radius: min(20 / var(--media-width) * 100vw, 20px);
  margin: min(80 / var(--media-width) * 100vw, 80px) auto;
}
.index-reason .reasons {
  margin: min(80 / var(--media-width) * 100vw, 80px) auto;
}
.index-reason .reason {
  margin-top: min(80 / var(--media-width) * 100vw, 80px);
}
.index-reason .fig {
  position: relative;
  z-index: 3;
  aspect-ratio: 690/370;
}
.index-reason .fig .img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  z-index: -1;
  border-radius: var(--reason-border-radius);
  overflow: hidden;
}
.index-reason .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.index-reason .fig .number {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(18 / var(--media-width) * 100vw, 18px);
  line-height: 1.5833333333;
  color: var(--theme-color);
  letter-spacing: 0.02em;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: #fff;
  width: 7.5em;
  aspect-ratio: 1;
  border-radius: 0 0 0 var(--reason-border-radius);
}
.index-reason .fig .number::before {
  content: "";
  position: absolute;
  left: calc(var(--reason-border-radius) * -1);
  top: 0px;
  width: var(--reason-border-radius);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--reason-border-radius) at 0 100%, transparent 97%, #fff 100%);
}
.index-reason .fig .number::after {
  content: "";
  position: absolute;
  bottom: calc(var(--reason-border-radius) * -1);
  right: 0px;
  width: var(--reason-border-radius);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--reason-border-radius) at 0 100%, transparent 97%, #fff 100%);
}
.index-reason .fig .en {
  text-transform: uppercase;
}
.index-reason .fig .num {
  font-size: 4em;
  line-height: 1;
  letter-spacing: 0;
}
.index-reason .txt {
  margin-top: min(30 / var(--media-width) * 100vw, 30px);
}
.index-reason .ttl {
  font-size: min(44 / var(--media-width) * 100vw, 44px);
  font-weight: 700;
  line-height: 1.4772727273;
  color: var(--theme-color);
  text-align: center;
}
.index-reason .con {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  margin-top: min(20 / var(--media-width) * 100vw, 20px);
  line-height: 1.6666666667;
}
.index-reason .con strong {
  font-weight: 500;
}

.index-works {
  margin: min(110 / var(--media-width) * 100vw, 110px) auto;
  padding: min(80 / var(--media-width) * 100vw, 80px) 0;
  position: relative;
  z-index: 3;
}
.index-works::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: calc(100% - min(60 / var(--media-width) * 100vw, 60px));
  height: 100%;
  background-color: var(--bg02-color);
  z-index: -1;
  border-radius: 0 min(40 / var(--media-width) * 100vw, 40px) min(40 / var(--media-width) * 100vw, 40px) 0;
}
.index-works .title {
  position: relative;
}
.index-works .title .right {
  position: absolute;
  right: 0;
  top: calc(min(97 / var(--media-width) * 100vw, 97px) * -1);
}
.index-works .title .right .tt {
  font-size: min(28 / var(--media-width) * 100vw, 28px);
  font-weight: 700;
  line-height: 1.7142857143;
  letter-spacing: 0.02em;
  text-align: center;
  background-image: url(../img/bg-dialog-box.webp);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  padding: min(22 / var(--media-width) * 100vw, 22px) min(34 / var(--media-width) * 100vw, 34px) min(58 / var(--media-width) * 100vw, 58px) min(33 / var(--media-width) * 100vw, 33px);
}
.index-works .title .right .tt .underline {
  position: relative;
  z-index: 3;
  display: inline-block;
  color: var(--theme-color);
}
.index-works .title .right .tt .underline::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  -webkit-transform: translate(-50%, -0.1em);
      -ms-transform: translate(-50%, -0.1em);
          transform: translate(-50%, -0.1em);
  width: 100%;
  height: 0.5714285714em;
  background: var(--key03-color);
  border-radius: 0.1071428571em;
  display: block;
  z-index: -1;
}
.index-works .title .right .tt .big {
  font-size: 1.0714285714em;
}
.index-works .title .right .tt .num {
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.5714285714em;
  font-weight: 500;
  line-height: 1;
}
.index-works .title .ico {
  position: absolute;
  top: calc(min(42 / var(--media-width) * 100vw, 42px) * -1);
  left: calc(min(29 / var(--media-width) * 100vw, 29px) * -1);
  width: min(118 / var(--media-width) * 100vw, 118px);
  -webkit-transform: translate(-100%, 0);
      -ms-transform: translate(-100%, 0);
          transform: translate(-100%, 0);
}
.index-works .works {
  --flex-list-column-gap: min(20 / var(--media-width) * 100vw, 20px);
  --flex-list-col-num: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: min(30 / var(--media-width) * 100vw, 30px) var(--flex-list-column-gap);
  margin: min(80 / var(--media-width) * 100vw, 80px) auto min(50 / var(--media-width) * 100vw, 50px);
}
.index-works .work {
  width: calc((100% - var(--flex-list-column-gap) * (var(--flex-list-col-num) - 1)) / var(--flex-list-col-num));
  background-color: #fff;
  border: min(2 / var(--media-width) * 100vw, 2px) solid var(--theme-color);
  overflow: hidden;
  border-radius: min(15 / var(--media-width) * 100vw, 15px);
  text-decoration: none !important;
}
@media (pointer: fine) {
  .index-works .work:hover .fig img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1);
  }
  .index-works .work:hover .arrow .ico {
    -webkit-transform: translate(10%, 0);
        -ms-transform: translate(10%, 0);
            transform: translate(10%, 0);
  }
}
.index-works .fig {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 335/223.03;
  position: relative;
  z-index: 3;
}
.index-works .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
}
.index-works .con {
  padding: min(15 / var(--media-width) * 100vw, 15px) min(20 / var(--media-width) * 100vw, 20px) min(20 / var(--media-width) * 100vw, 20px);
}
.index-works .ttl {
  font-size: min(28 / var(--media-width) * 100vw, 28px);
  font-weight: 700;
  line-height: 1.2857142857;
  letter-spacing: 0.02em;
  color: var(--theme-color);
}
.index-works .addr {
  font-size: min(22 / var(--media-width) * 100vw, 22px);
  font-weight: 500;
  line-height: 1.6363636364;
  letter-spacing: 0.02em;
}
.index-works .tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: min(5 / var(--media-width) * 100vw, 5px);
}
.index-works .tag {
  background-color: var(--theme-color);
  color: #fff;
  font-size: min(18.73 / var(--media-width) * 100vw, 18.73px);
  line-height: 1;
  letter-spacing: 0.02em;
  padding: min(4 / var(--media-width) * 100vw, 4px) min(7 / var(--media-width) * 100vw, 7px);
  border-radius: min(2.55 / var(--media-width) * 100vw, 2.55px);
}
.index-works .bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: min(20 / var(--media-width) * 100vw, 20px);
  margin-top: min(5 / var(--media-width) * 100vw, 5px);
}
.index-works .arrow .ico {
  background-color: var(--theme-color);
  color: #fff;
  font-size: min(18 / var(--media-width) * 100vw, 18px);
  width: 2.5em;
  aspect-ratio: 1;
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.index-works .arrow .ico svg {
  height: 0.6470588235em;
}

.index-news {
  margin: min(110 / var(--media-width) * 100vw, 110px) auto;
  position: relative;
  z-index: 3;
}
.index-news .news {
  margin: min(60 / var(--media-width) * 100vw, 60px) auto;
  border-top: 1px solid var(--border-color);
}
.index-news .item {
  display: block;
  padding: min(40 / var(--media-width) * 100vw, 40px) 0;
  text-decoration: none !important;
  border-bottom: 1px solid var(--border-color);
  font-size: min(28 / var(--media-width) * 100vw, 28px);
  font-weight: 500;
  line-height: 1.44;
  letter-spacing: 0.04em;
  position: relative;
  z-index: 3;
}
.index-news .item::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-color: var(--bg02-color);
  -webkit-transition: 0.2s;
  transition: 0.2s;
  opacity: 0;
}
@media (pointer: fine) {
  .index-news .item:hover::after {
    opacity: 1;
  }
}
.index-news .ttl {
  margin-top: min(8 / var(--media-width) * 100vw, 8px);
  font-size: 1.1428571429em;
}
.index-news .news-top-ico {
  position: absolute;
  z-index: -1;
  top: calc(min(47 / var(--media-width) * 100vw, 47px) * -1);
  right: min(50 / var(--media-width) * 100vw, 50px);
  width: min(133 / var(--media-width) * 100vw, 133px);
}

/* --------------------------------------------- */
/* page style */
.breadcrumbs {
  font-size: min(20 / var(--media-width) * 100vw, 20px);
  color: var(--theme-color);
  padding: 1em 0;
}
.breadcrumbs .breadcrumb {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: min(5 / var(--media-width) * 100vw, 5px);
}
.breadcrumbs a {
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 500;
  color: #000;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
@media (pointer: fine) {
  .breadcrumbs a:hover {
    text-decoration: underline;
    color: var(--theme-color);
  }
}
.breadcrumbs .arrow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.page-hero {
  padding: min(55 / var(--media-width) * 100vw, 55px) 0;
  position: relative;
  z-index: 3;
  margin-bottom: min(66 / var(--media-width) * 100vw, 66px);
}
.page-hero h1 {
  position: relative;
  z-index: 3;
}
.page-hero .en {
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 700;
  font-size: min(40 / var(--media-width) * 100vw, 40px);
  text-transform: uppercase;
  color: #fff;
  text-shadow: -1px -1px 0 var(--theme-color), 1px -1px 0 var(--theme-color), -1px 1px 0 var(--theme-color), 1px 1px 0 var(--theme-color);
}
.page-hero .en.initial {
  text-transform: initial;
}
.page-hero .ja {
  font-weight: 700;
  font-size: min(64 / var(--media-width) * 100vw, 64px);
  line-height: 1;
  letter-spacing: -0.1em;
  margin-top: min(20 / var(--media-width) * 100vw, 20px);
}
.page-hero .ja.initial {
  letter-spacing: 0;
}
.page-hero .icon {
  position: absolute;
  right: min(30 / var(--media-width) * 100vw, 30px);
  bottom: calc(min(30 / var(--media-width) * 100vw, 30px) * -1);
  width: min(310 / var(--media-width) * 100vw, 310px);
  z-index: 1;
}
.page-hero::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 86.1333333333%;
  height: 100%;
  z-index: -1;
  background-color: var(--bg02-color);
  border-radius: 0 min(40 / var(--media-width) * 100vw, 40px) min(40 / var(--media-width) * 100vw, 40px) 0;
}

.page-wrapper {
  margin: min(60 / var(--media-width) * 100vw, 60px) auto min(100 / var(--media-width) * 100vw, 100px);
}

.single-wrapper {
  margin: min(60 / var(--media-width) * 100vw, 60px) auto min(100 / var(--media-width) * 100vw, 100px);
  font-size: min(30 / var(--media-width) * 100vw, 30px);
}

.single-content .wp-block-image {
  margin-top: 1em;
  margin-bottom: 1em;
}
.single-content figure figcaption {
  text-align: center;
  font-size: 12px;
  color: #555d66;
}
.single-content pre {
  margin-top: 1em;
  margin-bottom: 1em;
}
.single-content pre,
.single-content code {
  text-indent: 0;
  letter-spacing: 0;
  font-size: 12px;
}
.single-content p:not(:last-child) {
  margin-bottom: 1em;
}
.single-content > img, .single-content > p > img {
  margin: 1em 0;
}
.single-content > img.aligncenter, .single-content > p > img.aligncenter {
  margin: 20px auto;
}
.single-content > img.alignleft, .single-content > p > img.alignleft {
  margin: 20px 20px 15px 0;
  float: left;
}
.single-content > img.alignright, .single-content > p > img.alignright {
  margin: 20px 0 15px 20px;
  float: right;
}
.single-content > img.alignnone, .single-content > p > img.alignnone {
  margin: 20px 0;
  float: none;
  clear: both;
}
.single-content img {
  height: auto;
  max-width: 100%;
}
.single-content .attachment {
  width: 100%;
}
.single-content .attachment img {
  width: 100%;
}
.single-content > ul {
  padding-left: 1.2em;
  list-style: initial;
  margin: 1.5em 0;
}
.single-content > ol {
  padding-left: 1.2em;
  margin: 1.5em 0;
}
.single-content > figure {
  margin: 1.5em 0;
}
.single-content > figure figcaption {
  width: 100%;
  display: block;
  text-align: center !important;
  opacity: 0.5;
  font-size: 12px;
  line-height: 1.4;
  padding: 0.6em 0;
}
.single-content > h1, .single-content > h2, .single-content > h3, .single-content > h4, .single-content > h5, .single-content > h6 {
  display: block;
  margin: 1.5em 0 1em;
  font-size: 700;
}
.single-content > h1:first-child, .single-content > h2:first-child, .single-content > h3:first-child, .single-content > h4:first-child, .single-content > h5:first-child, .single-content > h6:first-child {
  margin-top: 0;
}
.single-content .wp-block-group {
  padding: 1.25em 2.375em;
}
.single-content a {
  color: var(--theme-color);
  text-decoration: underline;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.single-content a:hover {
  text-decoration: none;
}

/* --------------------------------------------- */
/* page menu */
.p-menu-wrapper .menus-list {
  font-size: min(36 / var(--media-width) * 100vw, 36px);
  font-weight: 500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: min(30 / var(--media-width) * 100vw, 30px);
  margin: min(60 / var(--media-width) * 100vw, 60px) auto;
}
.p-menu-wrapper .menus-list .li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: min(150 / var(--media-width) * 100vw, 150px);
  aspect-ratio: 1;
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  text-align: center;
  cursor: pointer;
  background-color: var(--theme-color);
  color: #fff;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  text-decoration: none !important;
}
@media (pointer: fine) {
  .p-menu-wrapper .menus-list .li:hover {
    -webkit-transform: translateY(5%);
        -ms-transform: translateY(5%);
            transform: translateY(5%);
  }
}
.p-menu-wrapper .menus-list .ico {
  font-size: min(18 / var(--media-width) * 100vw, 18px);
  width: 2.5em;
  aspect-ratio: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: var(--theme-color);
  background-color: #fff;
  border-radius: 100%;
  margin-top: 0.6em;
}
.p-menu-wrapper .menus-list .ico svg {
  -webkit-transform: translateY(10%);
      -ms-transform: translateY(10%);
          transform: translateY(10%);
}
.p-menu-wrapper .service {
  --service-fig-border-radius: min(15 / var(--media-width) * 100vw, 15px);
  margin: min(100 / var(--media-width) * 100vw, 100px) auto min(200 / var(--media-width) * 100vw, 200px);
  padding: min(50 / var(--media-width) * 100vw, 50px) 0;
  position: relative;
  z-index: 3;
}
.p-menu-wrapper .service::after {
  content: "";
  position: absolute;
  top: min(100 / var(--media-width) * 100vw, 100px);
  right: calc(min(30 / var(--media-width) * 100vw, 30px) * -1);
  width: min(651 / var(--media-width) * 100vw, 651px);
  height: 100%;
  z-index: -1;
  background-color: var(--bg02-color);
  border-radius: min(40 / var(--media-width) * 100vw, 40px) 0 0 min(40 / var(--media-width) * 100vw, 40px);
}
@media (max-width: 750px) {
  .p-menu-wrapper .service::after {
    right: -20px;
  }
}
.p-menu-wrapper .service:nth-child(2n)::after {
  left: calc(min(30 / var(--media-width) * 100vw, 30px) * -1);
  border-radius: 0 min(40 / var(--media-width) * 100vw, 40px) min(40 / var(--media-width) * 100vw, 40px) 0;
}
.p-menu-wrapper .service:nth-child(2n) .number {
  background: -webkit-gradient(linear, left top, right top, color-stop(49%, var(--bg02-color)), color-stop(49%, #fff));
  background: linear-gradient(to right, var(--bg02-color) 49%, #fff 49%);
}
.p-menu-wrapper .service:nth-child(2n) .number::after {
  --fig-radius-color: $fff;
}
@media (max-width: 750px) {
  .p-menu-wrapper .service:nth-child(2n)::after {
    left: -20px;
  }
}
.p-menu-wrapper .service .figure {
  position: relative;
  z-index: 3;
  aspect-ratio: 690/390;
}
.p-menu-wrapper .service .img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  border-radius: var(--service-fig-border-radius);
  overflow: hidden;
}
.p-menu-wrapper .service .img img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.p-menu-wrapper .service .name {
  position: absolute;
  top: calc(min(50 / var(--media-width) * 100vw, 50px) * -1);
  left: min(28 / var(--media-width) * 100vw, 28px);
  z-index: 2;
  font-size: min(45.28 / var(--media-width) * 100vw, 45.28px);
  font-weight: 500;
  line-height: 1.1;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  text-orientation: upright;
  background-color: #fff;
  padding: min(10 / var(--media-width) * 100vw, 10px) min(15 / var(--media-width) * 100vw, 15px) min(18 / var(--media-width) * 100vw, 18px) min(15 / var(--media-width) * 100vw, 15px);
  border: min(2 / var(--media-width) * 100vw, 2px) solid var(--theme-color);
  border-radius: min(10 / var(--media-width) * 100vw, 10px);
  -webkit-box-shadow: min(3 / var(--media-width) * 100vw, 3px) min(3 / var(--media-width) * 100vw, 3px) 0 var(--theme-color);
          box-shadow: min(3 / var(--media-width) * 100vw, 3px) min(3 / var(--media-width) * 100vw, 3px) 0 var(--theme-color);
}
.p-menu-wrapper .service .number {
  --fig-radius-width: var(--service-fig-border-radius);
  --fig-radius-color: var(--bg02-color);
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 2;
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(18 / var(--media-width) * 100vw, 18px);
  line-height: 1.5833333333;
  color: var(--theme-color);
  letter-spacing: 0.02em;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: var(--fig-radius-color);
  width: 7.5em;
  aspect-ratio: 1;
  border-radius: var(--fig-radius-width) 0 0 0;
}
.p-menu-wrapper .service .number::before {
  content: "";
  position: absolute;
  left: calc(var(--fig-radius-width) * -1);
  bottom: 0px;
  width: var(--fig-radius-width);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--fig-radius-width) at 0 0, transparent 97%, var(--fig-radius-color) 100%);
}
.p-menu-wrapper .service .number::after {
  content: "";
  position: absolute;
  top: calc(var(--fig-radius-width) * -1);
  right: 0px;
  width: var(--fig-radius-width);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--fig-radius-width) at 0 0, transparent 97%, var(--fig-radius-color) 100%);
}
.p-menu-wrapper .service .number .tt {
  text-transform: uppercase;
}
.p-menu-wrapper .service .number .num {
  font-size: 4em;
  line-height: 1;
  letter-spacing: 0;
}
.p-menu-wrapper .service .content {
  margin: min(32 / var(--media-width) * 100vw, 32px) auto min(50 / var(--media-width) * 100vw, 50px);
}
.p-menu-wrapper .service .ttl {
  font-size: min(40 / var(--media-width) * 100vw, 40px);
  font-weight: 700;
  text-align: center;
  color: var(--theme-color);
  line-height: 1.25;
  margin-bottom: 0.575em;
}
.p-menu-wrapper .service .con {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
}
.p-menu-wrapper {
  /* yane 屋根 */
  /* gaiheki 外壁 */
  /* wetarea 水廻り */
  /* yuka 内装 */
}
.p-menu-wrapper .section-peform-top .figure {
  border-radius: min(15 / var(--media-width) * 100vw, 15px);
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  z-index: 3;
}
.p-menu-wrapper .section-peform-top .figure .ico {
  position: absolute;
  right: 1.5%;
  bottom: 2.5%;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 27%;
}
.p-menu-wrapper .section-peform-top .ttl {
  text-align: center;
  font-size: min(38 / var(--media-width) * 100vw, 38px);
  font-weight: 700;
  line-height: 1.4772727273;
  color: var(--theme-color);
  margin: min(25 / var(--media-width) * 100vw, 25px) auto min(18 / var(--media-width) * 100vw, 18px);
}
.p-menu-wrapper .section-peform-top .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
}
.p-menu-wrapper .section-peform-top .content .note {
  font-size: 0.8em;
}
.p-menu-wrapper .section-features {
  --features-fig-border-radius: min(20 / var(--media-width) * 100vw, 20px);
  margin: min(100 / var(--media-width) * 100vw, 100px) auto;
  padding: min(80 / var(--media-width) * 100vw, 80px) 0;
  position: relative;
  z-index: 3;
}
.p-menu-wrapper .section-features::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - min(120 / var(--media-width) * 100vw, 120px));
  height: 100%;
  border-radius: min(40 / var(--media-width) * 100vw, 40px);
  background-color: var(--bg02-color);
  z-index: -1;
}
.p-menu-wrapper .section-features .list {
  margin-top: min(72 / var(--media-width) * 100vw, 72px);
}
.p-menu-wrapper .section-features .item {
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
}
.p-menu-wrapper .section-features .figure {
  position: relative;
  z-index: 3;
  aspect-ratio: 690/412;
  border-radius: var(--features-fig-border-radius);
}
.p-menu-wrapper .section-features .figure .ico {
  position: absolute;
  left: 1.5%;
  bottom: 2.5%;
  z-index: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 27%;
}
.p-menu-wrapper .section-features .img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  border-radius: var(--features-fig-border-radius);
  overflow: hidden;
}
.p-menu-wrapper .section-features .img img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.p-menu-wrapper .section-features .number {
  --fig-radius-width: var(--features-fig-border-radius);
  --fig-radius-color: #fff;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(18 / var(--media-width) * 100vw, 18px);
  line-height: 1.5833333333;
  color: var(--theme-color);
  letter-spacing: 0.02em;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: var(--fig-radius-color);
  width: 7.5em;
  aspect-ratio: 1;
  border-radius: 0 0 0 var(--fig-radius-width);
  background: -webkit-gradient(linear, left top, right top, color-stop(32%, var(--bg02-color)), color-stop(32%, #fff));
  background: linear-gradient(to right, var(--bg02-color) 32%, #fff 32%);
}
.p-menu-wrapper .section-features .number::before {
  --fig-radius-color: var(--bg02-color);
  content: "";
  position: absolute;
  left: calc(var(--fig-radius-width) * -1);
  top: 0px;
  width: var(--fig-radius-width);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--fig-radius-width) at 0 100%, transparent 97%, var(--fig-radius-color) 100%);
}
.p-menu-wrapper .section-features .number::after {
  content: "";
  position: absolute;
  bottom: calc(var(--fig-radius-width) * -1);
  right: 0px;
  width: var(--fig-radius-width);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--fig-radius-width) at 0 100%, transparent 97%, var(--fig-radius-color) 100%);
}
.p-menu-wrapper .section-features .number .tt {
  text-transform: uppercase;
}
.p-menu-wrapper .section-features .number .num {
  font-size: 4em;
  line-height: 1;
  letter-spacing: 0;
}
.p-menu-wrapper .section-features .ttl {
  font-size: min(40 / var(--media-width) * 100vw, 40px);
  font-weight: 700;
  text-align: center;
  color: var(--theme-color);
  line-height: 1.625;
  margin-top: 0.625em;
  margin-bottom: 0.375em;
}
.p-menu-wrapper .section-features .ttl.ttnowrap {
  width: var(--main-width);
  -webkit-transform: translateX(calc(min(30 / var(--media-width) * 100vw, 30px) * -1));
      -ms-transform: translateX(calc(min(30 / var(--media-width) * 100vw, 30px) * -1));
          transform: translateX(calc(min(30 / var(--media-width) * 100vw, 30px) * -1));
}
@media (max-width: 1100px) {
  .p-menu-wrapper .section-features .ttl.ttnowrap {
    width: calc(100% + 40px);
    -webkit-transform: translateX(-20px);
        -ms-transform: translateX(-20px);
            transform: translateX(-20px);
  }
}
.p-menu-wrapper .section-features .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
}
.p-menu-wrapper .section-features .content strong {
  font-weight: 500;
}
.p-menu-wrapper .section-features .content .note {
  font-size: 0.8em;
}
.p-menu-wrapper .section-features .content .note.mtop {
  margin-top: 0.7916666667em;
}
.p-menu-wrapper .section-features .content .feature-con-bottom {
  margin: 0.5em auto;
}
.p-menu-wrapper .section-features .content .feature-con-bottom img {
  width: 100%;
  display: block;
}
.p-menu-wrapper .section-features .content .feature-con-bottom .note {
  font-size: 0.8333333333em;
  margin: 0.8em auto;
}
.p-menu-wrapper .section-features .content .feature-con-bottom a {
  text-decoration: underline;
  color: var(--theme-color);
}
@media (pointer: fine) {
  .p-menu-wrapper .section-features .content .feature-con-bottom a:hover {
    text-decoration: none;
  }
}
.p-menu-wrapper .section-features .con-fig {
  margin-top: min(10 / var(--media-width) * 100vw, 10px);
}
.p-menu-wrapper .section-peform01 {
  margin: min(100 / var(--media-width) * 100vw, 100px) auto;
  font-size: min(24 / var(--media-width) * 100vw, 24px);
  line-height: 1.44;
}
.p-menu-wrapper .section-peform01 .boxes {
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
}
.p-menu-wrapper .section-peform01 h3 {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  font-weight: 700;
  line-height: 1.3888888889;
  border-bottom: min(5 / var(--media-width) * 100vw, 5px) dotted var(--key01-color);
  padding-bottom: min(8 / var(--media-width) * 100vw, 8px);
  padding-left: min(25 / var(--media-width) * 100vw, 25px);
  position: relative;
  margin-bottom: min(40 / var(--media-width) * 100vw, 40px);
}
.p-menu-wrapper .section-peform01 h3::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: min(10 / var(--media-width) * 100vw, 10px);
  height: 1.3888888889em;
  border-radius: min(5 / var(--media-width) * 100vw, 5px);
  background-color: var(--theme-color);
}
.p-menu-wrapper .section-peform01 .figs {
  --flex-list-column-gap: min(30 / var(--media-width) * 100vw, 30px);
  --flex-list-col-num: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: var(--flex-list-column-gap);
  margin: min(40 / var(--media-width) * 100vw, 40px) auto 0;
}
.p-menu-wrapper .section-peform01 .figs ~ .content {
  margin-top: min(28 / var(--media-width) * 100vw, 28px);
}
.p-menu-wrapper .section-peform01 .figs.two {
  --flex-list-col-num: 2;
}
.p-menu-wrapper .section-peform01 .figs.three {
  --flex-list-col-num: 3;
  --flex-list-column-gap: min(20 / var(--media-width) * 100vw, 20px);
}
.p-menu-wrapper .section-peform01 .figs.four {
  --flex-list-col-num: 2;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.p-menu-wrapper .section-peform01 .col {
  width: calc((100% - var(--flex-list-column-gap) * (var(--flex-list-col-num) - 1)) / var(--flex-list-col-num));
}
.p-menu-wrapper .section-peform01 .col .tt {
  margin-top: min(10 / var(--media-width) * 100vw, 10px);
}
.p-menu-wrapper .section-peform01 .fig {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
  z-index: 3;
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  overflow: hidden;
}
.p-menu-wrapper .section-peform01 .content .note {
  font-size: 0.8em;
}
.p-menu-wrapper .section-peform01 .content .note.mtop {
  margin-top: 0.7916666667em;
}
.p-menu-wrapper .section-voice {
  margin: min(100 / var(--media-width) * 100vw, 100px) auto;
  padding: min(100 / var(--media-width) * 100vw, 100px) 0;
  background-color: var(--bg02-color);
  border-radius: min(40 / var(--media-width) * 100vw, 40px);
}
.p-menu-wrapper .section-voice .list {
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
}
.p-menu-wrapper .section-voice .item {
  position: relative;
  margin-top: min(60 / var(--media-width) * 100vw, 60px);
  border: min(2 / var(--media-width) * 100vw, 2px) solid var(--theme-color);
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  padding: min(40 / var(--media-width) * 100vw, 40px) min(20 / var(--media-width) * 100vw, 20px);
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: min(16 / var(--media-width) * 100vw, 16px);
}
.p-menu-wrapper .section-voice .user {
  width: min(220 / var(--media-width) * 100vw, 220px);
  min-width: min(220 / var(--media-width) * 100vw, 220px);
  margin-bottom: min(180 / var(--media-width) * 100vw, 180px);
}
.p-menu-wrapper .section-voice .fig {
  width: min(180 / var(--media-width) * 100vw, 180px);
  aspect-ratio: 1;
  overflow: hidden;
  margin: auto;
  border-radius: 100%;
  position: relative;
}
.p-menu-wrapper .section-voice .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.p-menu-wrapper .section-voice .tt {
  font-size: min(36 / var(--media-width) * 100vw, 36px);
  font-weight: 500;
  line-height: 1.44;
  color: var(--theme-color);
  margin-top: min(8 / var(--media-width) * 100vw, 8px);
  text-align: center;
}
.p-menu-wrapper .section-voice .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  position: relative;
  line-height: 2;
}
.p-menu-wrapper .section-voice .content::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='2.2em'%3E%3Ccircle cx='3' cy='100%' r='1' fill='%23999'/%3E%3C/svg%3E");
  background-size: min(6 / var(--media-width) * 100vw, 6px) 2em;
  background-repeat: repeat;
}
.p-menu-wrapper .section-voice .ico {
  position: absolute;
  bottom: min(9 / var(--media-width) * 100vw, 9px);
  left: min(17 / var(--media-width) * 100vw, 17px);
  width: min(165 / var(--media-width) * 100vw, 165px);
  aspect-ratio: 165/160;
  z-index: -1;
}
.p-menu-wrapper .section-works {
  margin: min(100 / var(--media-width) * 100vw, 100px) auto;
}
.p-menu-wrapper .section-works .works {
  margin: calc(80 / var(--media-width) * 100vw) auto calc(50 / var(--media-width) * 100vw);
  overflow: hidden;
  --swiper-pagination-bullet-size: min(22 / var(--media-width) * 100vw, 22px);
  --swiper-pagination-bullet-horizontal-gap: min(20 / var(--media-width) * 100vw, 20px);
  --swiper-pagination-color: var(--theme-color);
  --swiper-pagination-bullet-inactive-color: var(--border02-color);
  --swiper-pagination-bullet-inactive-opacity: 1;
}
.p-menu-wrapper .section-works .work {
  display: block;
  background-color: #fff;
  border: calc(2 / var(--media-width) * 100vw) solid var(--theme-color);
  overflow: hidden;
  border-radius: calc(15 / var(--media-width) * 100vw);
  text-decoration: none !important;
}
@media (pointer: fine) {
  .p-menu-wrapper .section-works .work:hover .fig img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1);
  }
  .p-menu-wrapper .section-works .work:hover .arrow .ico {
    -webkit-transform: translate(10%, 0);
        -ms-transform: translate(10%, 0);
            transform: translate(10%, 0);
  }
}
.p-menu-wrapper .section-works .fig {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 335/223.03;
  position: relative;
  z-index: 3;
}
.p-menu-wrapper .section-works .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
}
.p-menu-wrapper .section-works .con {
  padding: calc(15 / var(--media-width) * 100vw) calc(20 / var(--media-width) * 100vw) calc(20 / var(--media-width) * 100vw);
}
.p-menu-wrapper .section-works .ttl {
  font-size: calc(28 / var(--media-width) * 100vw);
  font-weight: 700;
  line-height: 1.2857142857;
  letter-spacing: 0.02em;
  color: var(--theme-color);
}
.p-menu-wrapper .section-works .addr {
  font-size: calc(22 / var(--media-width) * 100vw);
  font-weight: 500;
  line-height: 1.6363636364;
  letter-spacing: 0.02em;
}
.p-menu-wrapper .section-works .tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: calc(5 / var(--media-width) * 100vw);
}
.p-menu-wrapper .section-works .tag {
  background-color: var(--theme-color);
  color: #fff;
  font-size: calc(18.73 / var(--media-width) * 100vw);
  line-height: 1;
  letter-spacing: 0.02em;
  padding: calc(4 / var(--media-width) * 100vw) calc(7 / var(--media-width) * 100vw);
  border-radius: calc(2.55 / var(--media-width) * 100vw);
}
.p-menu-wrapper .section-works .bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: calc(20 / var(--media-width) * 100vw);
  margin-top: calc(5 / var(--media-width) * 100vw);
}
.p-menu-wrapper .section-works .arrow .ico {
  background-color: var(--theme-color);
  color: #fff;
  font-size: calc(18 / var(--media-width) * 100vw);
  width: 2.5em;
  aspect-ratio: 1;
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.p-menu-wrapper .section-works .arrow .ico svg {
  height: 0.6470588235em;
}
.p-menu-wrapper .section-works .swiper-pagination {
  position: initial;
  margin-top: min(40 / var(--media-width) * 100vw, 40px);
}
.p-menu-wrapper .section-works .no-results {
  display: block;
  width: 100%;
  text-align: center;
  padding: min(60 / var(--media-width) * 100vw, 60px) 0;
  color: #999;
  font-size: min(28 / var(--media-width) * 100vw, 28px);
  font-weight: 700;
}
.p-menu-wrapper .section-flow {
  margin: min(100 / var(--media-width) * 100vw, 100px) auto;
  padding: min(100 / var(--media-width) * 100vw, 100px) 0;
  background-color: var(--bg02-color);
  border-radius: min(40 / var(--media-width) * 100vw, 40px);
}
.p-menu-wrapper .section-flow .steps {
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
}
.p-menu-wrapper .section-flow dl {
  position: relative;
  z-index: 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: min(35 / var(--media-width) * 100vw, 35px);
  margin-top: min(60 / var(--media-width) * 100vw, 60px);
}
.p-menu-wrapper .section-flow dl:not(:last-child)::after {
  content: "";
}
.p-menu-wrapper .section-flow dl::after {
  position: absolute;
  top: min(100 / var(--media-width) * 100vw, 100px);
  left: min(44 / var(--media-width) * 100vw, 44px);
  width: 0;
  height: 100%;
  border-left: min(4 / var(--media-width) * 100vw, 4px) dotted var(--theme-color);
  z-index: -1;
}
.p-menu-wrapper .section-flow dt {
  width: min(109 / var(--media-width) * 100vw, 109px);
  aspect-ratio: 1;
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  background-color: var(--theme-color);
  color: #fff;
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(20 / var(--media-width) * 100vw, 20px);
  line-height: 1.44;
}
.p-menu-wrapper .section-flow dt .num {
  font-size: 1.8em;
  line-height: 1;
  font-weight: 700;
  color: var(--mark-color);
}
.p-menu-wrapper .section-flow dd {
  width: 100%;
  margin-top: min(20 / var(--media-width) * 100vw, 20px);
}
.p-menu-wrapper .section-flow .title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: min(10 / var(--media-width) * 100vw, 10px);
  margin-bottom: min(14 / var(--media-width) * 100vw, 14px);
}
.p-menu-wrapper .section-flow .ttl {
  font-size: min(40 / var(--media-width) * 100vw, 40px);
  font-weight: 700;
  line-height: 1.44;
  color: var(--theme-color);
}
.p-menu-wrapper .section-flow .tag {
  display: inline-block;
  font-size: min(24 / var(--media-width) * 100vw, 24px);
  line-height: 1.44;
  font-weight: 700;
  white-space: nowrap;
  border: min(3 / var(--media-width) * 100vw, 3px) solid #FF0000;
  border-radius: min(10 / var(--media-width) * 100vw, 10px);
  color: #FF0000;
  padding: 0 min(10 / var(--media-width) * 100vw, 10px);
}
.p-menu-wrapper .section-flow .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
}
.p-menu-wrapper .section-flow .btns {
  margin-top: min(30 / var(--media-width) * 100vw, 30px);
  width: min(450 / var(--media-width) * 100vw, 450px);
}
.p-menu-wrapper .section-flow .site-btn {
  --font-size: 36;
  --btn-bg-color: var(--theme-color);
  --btn-border-color: #0F935C;
  --btn-shadow01-color: var(--key01-color);
  margin-top: min(26 / var(--media-width) * 100vw, 26px);
}
.p-menu-wrapper .section-flow .site-btn:nth-child(2) {
  --btn-bg-color: var(--btn01-color);
  --btn-border-color: var(--border01-color);
  --btn-shadow01-color: var(--shadow01-color);
}
.p-menu-wrapper .section-flow .site-btn .btn {
  padding: 0.5555555556em 1em;
  border: min(4 / var(--media-width) * 100vw, 4px) solid var(--btn-border-color);
  -webkit-box-shadow: min(2 / var(--media-width) * 100vw, 2px) min(6 / var(--media-width) * 100vw, 6px) 0 var(--btn-shadow01-color);
          box-shadow: min(2 / var(--media-width) * 100vw, 2px) min(6 / var(--media-width) * 100vw, 6px) 0 var(--btn-shadow01-color);
}
.p-menu-wrapper .section-flow .site-btn .btn:hover {
  -webkit-box-shadow: 0 0 0 var(--btn-shadow01-color);
          box-shadow: 0 0 0 var(--btn-shadow01-color);
}
.p-menu-wrapper .section-flow .site-btn .tel .tt {
  font-size: min(48 / var(--media-width) * 100vw, 48px);
  line-height: 1.2;
  -webkit-transform: translateY(-10%);
      -ms-transform: translateY(-10%);
          transform: translateY(-10%);
}
.p-menu-wrapper .section-flow .site-btn .tel .tt svg {
  font-size: 0.9525em;
  -webkit-transform: translateY(10%);
      -ms-transform: translateY(10%);
          transform: translateY(10%);
}
@media (min-width: 751px) {
  .p-menu-wrapper .section-flow .site-btn .tel {
    pointer-events: none;
  }
}
.p-menu-wrapper .section-flow .fig {
  position: relative;
  z-index: 3;
  margin-top: min(32 / var(--media-width) * 100vw, 32px);
  width: min(400 / var(--media-width) * 100vw, 400px);
  aspect-ratio: 400/291;
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  overflow: hidden;
}
.p-menu-wrapper .section-flow .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.p-menu-wrapper .section-flow .note {
  font-size: min(24 / var(--media-width) * 100vw, 24px);
  line-height: 1.44;
  margin-top: min(12 / var(--media-width) * 100vw, 12px);
}
.p-menu-wrapper .section-support {
  margin-bottom: min(129 / var(--media-width) * 100vw, 129px);
}
.p-menu-wrapper .section-support .box {
  margin-top: min(60 / var(--media-width) * 100vw, 60px);
}
.p-menu-wrapper .section-support .ttl {
  font-size: min(44 / var(--media-width) * 100vw, 44px);
  font-weight: 700;
  line-height: 1.4772727273;
  text-align: center;
  margin-bottom: min(20 / var(--media-width) * 100vw, 20px);
  color: var(--theme-color);
}
.p-menu-wrapper .section-support .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
}
.p-menu-wrapper .section-support .list {
  margin: min(40 / var(--media-width) * 100vw, 40px) auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.p-menu-wrapper .section-support .col {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  font-weight: 700;
  line-height: 1.6;
  aspect-ratio: 1;
  width: min(190 / var(--media-width) * 100vw, 190px);
  border-radius: 100%;
  border: min(4 / var(--media-width) * 100vw, 4px) solid var(--theme-color);
  -webkit-box-shadow: 0 min(10 / var(--media-width) * 100vw, 10px) 0 var(--shasow02-color);
          box-shadow: 0 min(10 / var(--media-width) * 100vw, 10px) 0 var(--shasow02-color);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background-image: url(../img/menu/list-bg-support.webp);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 90%;
}
.p-menu-wrapper .section-support .col .color {
  color: var(--theme-color);
}
.p-menu-wrapper .section-support .col .num {
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.4666666667em;
  font-weight: 500;
  line-height: 1;
}
.p-menu-wrapper .section-support .col .underline {
  position: relative;
  z-index: 3;
  display: inline-block;
}
.p-menu-wrapper .section-support .col .underline::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  -webkit-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  width: 100%;
  height: 0.5333333333em;
  background: var(--key03-color);
  border-radius: 3px;
  display: block;
  z-index: -1;
}
.p-menu-wrapper .js-image-popup {
  cursor: pointer;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.p-menu-wrapper .js-image-popup:hover {
  -webkit-transform: scale(1.02);
      -ms-transform: scale(1.02);
          transform: scale(1.02);
}
.p-menu-wrapper .js-image-popup::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: min(60 / var(--media-width) * 100vw, 60px);
  height: min(60 / var(--media-width) * 100vw, 60px);
  background: rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23333'%3E%3Cpath d='M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E");
  background-size: 75% 75%;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  pointer-events: none;
}
.p-menu-wrapper .js-image-popup:hover::after {
  opacity: 1;
}

/* category news */
.p-about-wrapper .about .figure {
  border-radius: min(15 / var(--media-width) * 100vw, 15px);
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.p-about-wrapper .about .ttl {
  text-align: center;
  font-size: min(44 / var(--media-width) * 100vw, 44px);
  font-weight: 700;
  line-height: 1.4772727273;
  color: var(--theme-color);
  margin: min(25 / var(--media-width) * 100vw, 25px) auto min(18 / var(--media-width) * 100vw, 18px);
}
.p-about-wrapper .about .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
}
.p-about-wrapper .about .bottom {
  margin-top: min(30 / var(--media-width) * 100vw, 30px);
}
.p-about-wrapper .features {
  --features-fig-border-radius: min(20 / var(--media-width) * 100vw, 20px);
  margin: min(80 / var(--media-width) * 100vw, 80px) auto;
}
.p-about-wrapper .features .list {
  margin-top: min(80 / var(--media-width) * 100vw, 80px);
}
.p-about-wrapper .features .item {
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
}
.p-about-wrapper .features .figure {
  position: relative;
  z-index: 3;
  aspect-ratio: 690/370;
  border-radius: var(--features-fig-border-radius);
}
.p-about-wrapper .features .img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  border-radius: var(--features-fig-border-radius);
  overflow: hidden;
}
.p-about-wrapper .features .img img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.p-about-wrapper .features .number {
  --fig-radius-width: var(--features-fig-border-radius);
  --fig-radius-color: #fff;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: min(18 / var(--media-width) * 100vw, 18px);
  line-height: 1.5833333333;
  color: var(--theme-color);
  letter-spacing: 0.02em;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: var(--fig-radius-color);
  width: 7.5em;
  aspect-ratio: 1;
  border-radius: 0 0 0 var(--fig-radius-width);
}
.p-about-wrapper .features .number::before {
  content: "";
  position: absolute;
  left: calc(var(--fig-radius-width) * -1);
  top: 0px;
  width: var(--fig-radius-width);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--fig-radius-width) at 0 100%, transparent 97%, var(--fig-radius-color) 100%);
}
.p-about-wrapper .features .number::after {
  content: "";
  position: absolute;
  bottom: calc(var(--fig-radius-width) * -1);
  right: 0px;
  width: var(--fig-radius-width);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--fig-radius-width) at 0 100%, transparent 97%, var(--fig-radius-color) 100%);
}
.p-about-wrapper .features .number .tt {
  text-transform: uppercase;
}
.p-about-wrapper .features .number .num {
  font-size: 4em;
  line-height: 1;
  letter-spacing: 0;
}
.p-about-wrapper .features .ttl {
  font-size: min(40 / var(--media-width) * 100vw, 40px);
  font-weight: 700;
  text-align: center;
  color: var(--theme-color);
  line-height: 1.625;
  margin-top: 0.625em;
  margin-bottom: 0.375em;
}
.p-about-wrapper .features .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
}
.p-about-wrapper .features .content strong {
  font-weight: 500;
}
.p-about-wrapper .message {
  --fig-radius-width: min(20 / var(--media-width) * 100vw, 20px);
  --fig-radius-color: var(--bg02-color);
  margin: min(95 / var(--media-width) * 100vw, 95px) auto;
  padding: min(95 / var(--media-width) * 100vw, 95px) 0 min(90 / var(--media-width) * 100vw, 90px);
  background-color: var(--bg02-color);
  border-radius: min(40 / var(--media-width) * 100vw, 40px);
}
.p-about-wrapper .message .user {
  position: relative;
  z-index: 3;
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
}
.p-about-wrapper .message .fig {
  aspect-ratio: 689/744;
  position: relative;
  z-index: 2;
  border-radius: var(--fig-radius-width);
  overflow: hidden;
}
.p-about-wrapper .message .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.p-about-wrapper .message .info {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 2;
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.44;
  padding: min(30 / var(--media-width) * 100vw, 30px) min(20 / var(--media-width) * 100vw, 20px) min(5 / var(--media-width) * 100vw, 5px) min(38 / var(--media-width) * 100vw, 38px);
  text-align: right;
  background-color: var(--bg02-color);
  border-radius: var(--fig-radius-width) 0 0 0;
}
.p-about-wrapper .message .info .name {
  font-family: "Shippori Mincho", serif;
  font-size: 1.6em;
  font-weight: 600;
}
.p-about-wrapper .message .info::before {
  content: "";
  position: absolute;
  left: calc(var(--fig-radius-width) * -1);
  bottom: 0px;
  width: var(--fig-radius-width);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--fig-radius-width) at 0 0, transparent 97%, var(--fig-radius-color) 100%);
}
.p-about-wrapper .message .info::after {
  content: "";
  position: absolute;
  top: calc(var(--fig-radius-width) * -1);
  right: 0px;
  width: var(--fig-radius-width);
  aspect-ratio: 1;
  background: radial-gradient(circle var(--fig-radius-width) at 0 0, transparent 97%, var(--fig-radius-color) 100%);
}
.p-about-wrapper .message .ttl {
  margin: min(45 / var(--media-width) * 100vw, 45px) auto min(38 / var(--media-width) * 100vw, 38px);
  line-height: 1.44;
  font-weight: 700;
  color: var(--theme-color);
  /* 0422 */
  font-size: min(48 / var(--media-width) * 100vw, 48px);
}
.p-about-wrapper .message .con {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
}
.p-about-wrapper .staff {
  margin: min(95 / var(--media-width) * 100vw, 95px) auto;
}
.p-about-wrapper .staff .site-title {
  margin-bottom: 0;
}
.p-about-wrapper .staff .item {
  padding: min(50 / var(--media-width) * 100vw, 50px) 0;
  margin-top: min(20 / var(--media-width) * 100vw, 20px);
}
.p-about-wrapper .staff .item:not(:first-child) {
  border-top: min(5 / var(--media-width) * 100vw, 5px) dotted var(--key01-color);
}
.p-about-wrapper .staff .item.hidden {
  display: none;
}
.p-about-wrapper .staff .info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: min(23 / var(--media-width) * 100vw, 23px);
}
.p-about-wrapper .staff .fig {
  position: relative;
  z-index: 3;
  width: min(308 / var(--media-width) * 100vw, 308px);
  min-width: min(308 / var(--media-width) * 100vw, 308px);
  aspect-ratio: 308/372;
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  overflow: hidden;
}
.p-about-wrapper .staff .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.p-about-wrapper .staff .tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  gap: min(10 / var(--media-width) * 100vw, 10px);
  margin-bottom: min(18 / var(--media-width) * 100vw, 18px);
}
.p-about-wrapper .staff .tag {
  display: inline-block;
  color: var(--theme-color);
  border: 1px solid var(--theme-color);
  border-radius: 5px;
  padding: 0.1em 0.5em;
}
.p-about-wrapper .staff .name {
  font-size: min(40 / var(--media-width) * 100vw, 40px);
  line-height: 1.44;
  font-weight: 700;
}
.p-about-wrapper .staff .kana {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.44;
  font-weight: 500;
}
.p-about-wrapper .staff .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  margin-top: 1em;
  line-height: 1.44;
  padding-right: 1em;
}
.p-about-wrapper .staff .site-btn {
  margin-top: min(5 / var(--media-width) * 100vw, 5px);
}
.p-about-wrapper .area {
  margin: min(95 / var(--media-width) * 100vw, 95px) auto min(100 / var(--media-width) * 100vw, 100px);
  padding: min(100 / var(--media-width) * 100vw, 100px) 0;
  position: relative;
  z-index: 3;
}
.p-about-wrapper .area .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
  margin: min(60 / var(--media-width) * 100vw, 60px) auto min(50 / var(--media-width) * 100vw, 50px);
}
.p-about-wrapper .area .content strong {
  font-weight: 500;
}
.p-about-wrapper .area::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: calc(100% - min(120 / var(--media-width) * 100vw, 120px));
  height: 100%;
  background-color: var(--bg02-color);
  border-radius: min(40 / var(--media-width) * 100vw, 40px) 0 0 min(40 / var(--media-width) * 100vw, 40px);
  z-index: -1;
}
.p-about-wrapper .company {
  margin-bottom: min(140 / var(--media-width) * 100vw, 140px);
}
.p-about-wrapper .company .list {
  border-top: 1px solid var(--border-color);
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
}
.p-about-wrapper .company dl {
  border-bottom: 1px solid var(--border-color);
  padding: min(35 / var(--media-width) * 100vw, 35px) 0;
  font-size: min(24 / var(--media-width) * 100vw, 24px);
  line-height: 1.5;
}
.p-about-wrapper .company dt {
  font-size: 1.25;
  font-weight: 700;
  color: var(--theme-color);
}
.p-about-wrapper .company dd {
  margin-top: min(5 / var(--media-width) * 100vw, 5px);
}

.p-contact-wrapper .contact-top {
  background-color: var(--theme-color);
  position: relative;
  padding: min(30 / var(--media-width) * 100vw, 30px) min(35 / var(--media-width) * 100vw, 35px);
  border-radius: min(40 / var(--media-width) * 100vw, 40px);
}
.p-contact-wrapper .contact-top .box {
  background-color: var(--bg01-color);
  border-radius: min(40 / var(--media-width) * 100vw, 40px);
  padding: min(30 / var(--media-width) * 100vw, 30px) min(20 / var(--media-width) * 100vw, 20px) min(45 / var(--media-width) * 100vw, 45px);
  color: #fff;
  text-align: center;
}
.p-contact-wrapper .contact-top .ttl {
  font-size: min(36 / var(--media-width) * 100vw, 36px);
  line-height: 1.44;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.p-contact-wrapper .contact-top .call {
  font-size: min(32 / var(--media-width) * 100vw, 32px);
  font-weight: 700;
  line-height: 1.44;
  letter-spacing: 0.04em;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: var(--key01-color);
  padding: min(3 / var(--media-width) * 100vw, 3px) min(10 / var(--media-width) * 100vw, 10px);
  margin: min(20 / var(--media-width) * 100vw, 20px) auto min(30 / var(--media-width) * 100vw, 30px);
}
.p-contact-wrapper .contact-top .num {
  font-size: min(72 / var(--media-width) * 100vw, 72px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.04em;
}
.p-contact-wrapper .contact-top .num a {
  text-decoration: none !important;
}
@media (min-width: 751px) {
  .p-contact-wrapper .contact-top .num a {
    pointer-events: none;
  }
}
.p-contact-wrapper .contact-boxes {
  margin: min(100 / var(--media-width) * 100vw, 100px) auto;
}
.p-contact-wrapper .contact-boxes .list {
  margin-bottom: min(90 / var(--media-width) * 100vw, 90px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.p-contact-wrapper .contact-boxes .list li {
  border: min(3 / var(--media-width) * 100vw, 3px) solid var(--font-color);
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  font-size: min(36 / var(--media-width) * 100vw, 36px);
  font-weight: 700;
  line-height: 1.8055555556;
  padding: min(6 / var(--media-width) * 100vw, 6px) min(20 / var(--media-width) * 100vw, 20px);
  width: min(150 / var(--media-width) * 100vw, 150px);
  text-align: center;
  position: relative;
}
.p-contact-wrapper .contact-boxes .list li:not(:last-child)::after {
  content: "";
}
.p-contact-wrapper .contact-boxes .list li::after {
  position: absolute;
  top: 50%;
  right: calc(min(41 / var(--media-width) * 100vw, 41px) * -1);
  display: block;
  width: min(40 / var(--media-width) * 100vw, 40px);
  aspect-ratio: 39.57/21;
  background-image: url(../img/arrow-right-font-color.svg);
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  -webkit-transform: translate(100%, -50%);
      -ms-transform: translate(100%, -50%);
          transform: translate(100%, -50%);
}
.p-contact-wrapper .contact-boxes .list .active {
  border-color: var(--theme-color);
  background-color: var(--theme-color);
  color: #fff;
}
.p-contact-wrapper .contact-boxes .list .active::after {
  background-image: url(../img/arrow-right-theme-color.svg);
}
.p-contact-wrapper .contact-boxes .form dl {
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
  margin-bottom: min(60 / var(--media-width) * 100vw, 60px);
}
.p-contact-wrapper .contact-boxes .form dt {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  font-weight: 700;
  line-height: 1.6666666667;
}
.p-contact-wrapper .contact-boxes .form dt .tt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: min(10 / var(--media-width) * 100vw, 10px);
}
.p-contact-wrapper .contact-boxes .form dt .tt > p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: min(10 / var(--media-width) * 100vw, 10px);
}
.p-contact-wrapper .contact-boxes .form dt .note {
  font-size: min(24 / var(--media-width) * 100vw, 24px);
  font-weight: 400;
  line-height: 1.44;
}
.p-contact-wrapper .contact-boxes .form dd {
  margin-top: min(25 / var(--media-width) * 100vw, 25px);
  font-size: min(30 / var(--media-width) * 100vw, 30px);
}
.p-contact-wrapper .contact-boxes .form dd .note {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  font-weight: 400;
  line-height: 1.44;
}
.p-contact-wrapper .contact-boxes .form .must {
  font-size: min(24 / var(--media-width) * 100vw, 24px);
  font-weight: 700;
  line-height: 1.44;
  color: #FF0000;
  border: min(3 / var(--media-width) * 100vw, 3px) solid #FF0000;
  border-radius: min(10 / var(--media-width) * 100vw, 10px);
  padding: min(1 / var(--media-width) * 100vw, 1px) min(10 / var(--media-width) * 100vw, 10px);
}
.p-contact-wrapper .contact-boxes .form input[type=text],
.p-contact-wrapper .contact-boxes .form input[type=email],
.p-contact-wrapper .contact-boxes .form input[type=tel] {
  font-size: 1em;
  width: 100%;
  padding: min(18 / var(--media-width) * 100vw, 18px) min(20 / var(--media-width) * 100vw, 20px);
  height: min(80 / var(--media-width) * 100vw, 80px);
  border: none;
  background-color: var(--key04-color);
  border-radius: min(10 / var(--media-width) * 100vw, 10px);
}
.p-contact-wrapper .contact-boxes .form textarea {
  font-size: 1em;
  width: 100%;
  padding: min(18 / var(--media-width) * 100vw, 18px) 1em;
  height: min(272 / var(--media-width) * 100vw, 272px);
  resize: none;
  border: none;
  background-color: var(--key04-color);
  border-radius: min(10 / var(--media-width) * 100vw, 10px);
}
.p-contact-wrapper .contact-boxes .form select {
  font-size: 1em;
  width: 100%;
  padding: min(18 / var(--media-width) * 100vw, 18px) min(20 / var(--media-width) * 100vw, 20px);
  height: min(80 / var(--media-width) * 100vw, 80px);
  border: none;
  background-color: var(--key04-color);
  border-radius: min(10 / var(--media-width) * 100vw, 10px);
}
.p-contact-wrapper .contact-boxes .form .name-box p {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: min(30 / var(--media-width) * 100vw, 30px);
}
.p-contact-wrapper .contact-boxes .form .name-box .wpcf7-form-control-wrap {
  width: calc(50% - min(30 / var(--media-width) * 100vw, 30px));
}
.p-contact-wrapper .contact-boxes .form .add-txt {
  margin: min(30 / var(--media-width) * 100vw, 30px) auto min(20 / var(--media-width) * 100vw, 20px);
}
.p-contact-wrapper .contact-boxes .form .privacy {
  text-align: center;
  margin: min(85 / var(--media-width) * 100vw, 85px) auto min(55 / var(--media-width) * 100vw, 55px);
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.44;
}
.p-contact-wrapper .contact-boxes .form .privacy a {
  color: var(--theme-color);
  text-decoration: underline;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
@media (pointer: fine) {
  .p-contact-wrapper .contact-boxes .form .privacy a:hover {
    text-decoration: none;
  }
}
.p-contact-wrapper .contact-boxes .form .submit .site-btn {
  position: relative;
  z-index: 3;
}
.p-contact-wrapper .contact-boxes .form .submit .site-btn .btn {
  width: 100%;
  font-size: 1em;
  border: none;
  cursor: pointer;
}
.p-contact-wrapper .contact-boxes .form .submit .site-btn .ico p {
  line-height: 1;
}
@media (pointer: fine) {
  .p-contact-wrapper .contact-boxes .form .submit .site-btn:has(.btn:hover) .ico {
    -webkit-transform: translate(15%, -50%);
        -ms-transform: translate(15%, -50%);
            transform: translate(15%, -50%);
  }
}
.p-contact-wrapper .contact-boxes .form .submit .wpcf7-spinner {
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transform: translate(100%, 0);
      -ms-transform: translate(100%, 0);
          transform: translate(100%, 0);
  margin: 0;
}
.p-contact-wrapper .contact-boxes .form .submit .previous {
  margin-top: min(40 / var(--media-width) * 100vw, 40px);
  --btn-bg-color: var(--font-color);
}
.p-contact-wrapper .contact-boxes .hope-menu {
  --flex-list-column-gap: min(30 / var(--media-width) * 100vw, 30px);
  --flex-list-col-num: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: var(--flex-list-column-gap);
}
.p-contact-wrapper .contact-boxes .hope-menu .wpcf7-list-item {
  width: calc((100% - var(--flex-list-column-gap) * (var(--flex-list-col-num) - 1)) / var(--flex-list-col-num));
  margin: 0;
}
.p-contact-wrapper .contact-boxes .hope-menu label {
  width: 100%;
  display: block;
  background-color: var(--key04-color);
  padding: min(18 / var(--media-width) * 100vw, 18px) min(30 / var(--media-width) * 100vw, 30px);
  border-radius: min(10 / var(--media-width) * 100vw, 10px);
  font-weight: 500;
  cursor: pointer;
}
.p-contact-wrapper .contact-boxes .hope-menu label input {
  display: none;
}
.p-contact-wrapper .contact-boxes .hope-menu label input:checked + .wpcf7-list-item-label::after {
  content: "✔";
  color: #fff;
}
.p-contact-wrapper .contact-boxes .hope-menu label input:checked + .wpcf7-list-item-label::before {
  background-color: var(--font-color);
}
.p-contact-wrapper .contact-boxes .hope-menu .wpcf7-list-item-label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  gap: min(20 / var(--media-width) * 100vw, 20px);
  position: relative;
}
.p-contact-wrapper .contact-boxes .hope-menu .wpcf7-list-item-label::before {
  display: inline-block;
  width: min(30 / var(--media-width) * 100vw, 30px);
  aspect-ratio: 1;
  border: none;
  position: relative;
  background-color: #fff;
  -webkit-transform: translateY(12%);
      -ms-transform: translateY(12%);
          transform: translateY(12%);
}
.p-contact-wrapper .contact-boxes .hope-menu .wpcf7-list-item-label::after {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 1em;
  width: min(30 / var(--media-width) * 100vw, 30px);
  aspect-ratio: 1;
  line-height: 1;
  -webkit-transform: translate(10%, 30%);
      -ms-transform: translate(10%, 30%);
          transform: translate(10%, 30%);
}
.p-contact-wrapper .contact-boxes .wpcf7-not-valid-tip {
  margin-top: 0.5em;
}
.p-contact-wrapper .contact-boxes .confirm dd {
  width: 100%;
  padding: min(18 / var(--media-width) * 100vw, 18px) min(20 / var(--media-width) * 100vw, 20px);
  min-height: min(80 / var(--media-width) * 100vw, 80px);
  border: none;
  background-color: var(--key04-color);
  border-radius: min(10 / var(--media-width) * 100vw, 10px);
}
.p-contact-wrapper .contact-boxes .confirm .hope-list {
  --flex-list-column-gap: min(30 / var(--media-width) * 100vw, 30px);
  --flex-list-col-num: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: var(--flex-list-column-gap);
  padding: 0;
  min-height: 0;
  border-radius: 0;
  background: none;
}
.p-contact-wrapper .contact-boxes .confirm .hope-list .item {
  width: calc((100% - var(--flex-list-column-gap) * (var(--flex-list-col-num) - 1)) / var(--flex-list-col-num));
  margin: 0;
  background-color: var(--key04-color);
  padding: min(18 / var(--media-width) * 100vw, 18px) min(30 / var(--media-width) * 100vw, 30px);
  border-radius: min(10 / var(--media-width) * 100vw, 10px);
}
.p-contact-wrapper .contact-boxes .confirm .name-box {
  width: 50%;
}
.p-contact-wrapper .contact-boxes .thanks-boxes h2 {
  text-align: center;
  font-size: min(44 / var(--media-width) * 100vw, 44px);
  font-weight: 700;
  line-height: 1.4772727273;
  color: var(--theme-color);
}
.p-contact-wrapper .contact-boxes .thanks-boxes .figure {
  margin: min(50 / var(--media-width) * 100vw, 50px) auto;
}
.p-contact-wrapper .contact-boxes .thanks-boxes .content {
  margin: min(50 / var(--media-width) * 100vw, 50px) auto;
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  line-height: 1.6666666667;
}

.p-case-wrapper .cats .list {
  --flex-list-column-gap: min(30 / var(--media-width) * 100vw, 30px);
  --flex-list-col-num: 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-column-gap: var(--flex-list-column-gap);
     -moz-column-gap: var(--flex-list-column-gap);
          column-gap: var(--flex-list-column-gap);
  row-gap: min(20 / var(--media-width) * 100vw, 20px);
}
.p-case-wrapper .cats .list li {
  width: calc((100% - var(--flex-list-column-gap) * (var(--flex-list-col-num) - 1)) / var(--flex-list-col-num));
}
.p-case-wrapper .cats .list li a {
  width: 100%;
  display: block;
  border: 2px solid var(--theme-color);
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  color: var(--theme-color);
  font-size: min(36 / var(--media-width) * 100vw, 36px);
  font-weight: 500;
  line-height: 1.08;
  padding: min(25 / var(--media-width) * 100vw, 25px);
  text-align: center;
  cursor: pointer;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  text-decoration: none !important;
}
@media (pointer: fine) {
  .p-case-wrapper .cats .list li a:hover {
    background-color: var(--theme-color);
    color: #fff;
  }
}
.p-case-wrapper .cats .list .active a {
  background-color: var(--theme-color);
  color: #fff;
}
.p-case-wrapper .section-works {
  margin-top: min(100 / var(--media-width) * 100vw, 100px);
  position: relative;
  z-index: 5;
}
.p-case-wrapper .section-works .works {
  --flex-list-column-gap: calc(20 / var(--media-width) * 100vw);
  --flex-list-col-num: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: calc(60 / var(--media-width) * 100vw) var(--flex-list-column-gap);
  margin: min(60 / var(--media-width) * 100vw, 60px) auto;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.p-case-wrapper .section-works .work {
  width: calc((100% - var(--flex-list-column-gap) * (var(--flex-list-col-num) - 1)) / var(--flex-list-col-num));
  background-color: #fff;
  border: calc(3 / var(--media-width) * 100vw) solid var(--theme-color);
  overflow: hidden;
  border-radius: calc(15 / var(--media-width) * 100vw);
  text-decoration: none !important;
}
@media (pointer: fine) {
  .p-case-wrapper .section-works .work:hover .fig img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1);
  }
  .p-case-wrapper .section-works .work:hover .arrow .ico {
    -webkit-transform: translate(10%, 0);
        -ms-transform: translate(10%, 0);
            transform: translate(10%, 0);
  }
}
.p-case-wrapper .section-works .fig {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 335/223.03;
  position: relative;
  z-index: 3;
}
.p-case-wrapper .section-works .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
}
.p-case-wrapper .section-works .con {
  padding: calc(15 / var(--media-width) * 100vw) calc(20 / var(--media-width) * 100vw) calc(20 / var(--media-width) * 100vw);
}
.p-case-wrapper .section-works .ttl {
  font-size: calc(28 / var(--media-width) * 100vw);
  font-weight: 700;
  line-height: 1.2857142857;
  letter-spacing: 0.02em;
  color: var(--theme-color);
}
.p-case-wrapper .section-works .addr {
  font-size: calc(22 / var(--media-width) * 100vw);
  font-weight: 500;
  line-height: 1.6363636364;
  letter-spacing: 0.02em;
}
.p-case-wrapper .section-works .tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: calc(5 / var(--media-width) * 100vw);
}
.p-case-wrapper .section-works .tag {
  background-color: var(--theme-color);
  color: #fff;
  font-size: calc(18.73 / var(--media-width) * 100vw);
  line-height: 1;
  letter-spacing: 0.02em;
  padding: calc(4 / var(--media-width) * 100vw) calc(7 / var(--media-width) * 100vw);
  border-radius: calc(2.55 / var(--media-width) * 100vw);
}
.p-case-wrapper .section-works .bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: calc(20 / var(--media-width) * 100vw);
  margin-top: calc(5 / var(--media-width) * 100vw);
}
.p-case-wrapper .section-works .arrow .ico {
  background-color: var(--theme-color);
  color: #fff;
  font-size: calc(18 / var(--media-width) * 100vw);
  width: 2.5em;
  aspect-ratio: 1;
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.p-case-wrapper .section-works .arrow .ico svg {
  height: 0.6470588235em;
}
.p-case-wrapper .section-works {
  /* --- */
}
.p-case-wrapper .section-works .no-results {
  display: block;
  width: 100%;
  text-align: center;
  padding: min(60 / var(--media-width) * 100vw, 60px) 0;
  color: #999;
  font-size: min(28 / var(--media-width) * 100vw, 28px);
  font-weight: 700;
}
.p-case-wrapper .section-works.loading {
  position: relative;
}
.p-case-wrapper .section-works.loading .tt {
  -webkit-animation: case-loading-pulse 1.5s ease-in-out infinite;
          animation: case-loading-pulse 1.5s ease-in-out infinite;
}
@-webkit-keyframes case-loading-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}
@keyframes case-loading-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}
.p-case-wrapper .section-works::before {
  position: absolute;
  width: var(--main-width);
  height: calc(100% + min(60 / var(--media-width) * 100vw, 60px));
  top: calc(min(30 / var(--media-width) * 100vw, 30px) * -1);
  left: 50%;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  background-color: rgba(255, 255, 255, 0.5);
  z-index: 5;
  backdrop-filter: blur(min(10 / var(--media-width) * 100vw, 10px));
}
.p-case-wrapper .pagination {
  margin: min(60 / var(--media-width) * 100vw, 60px) auto;
}
.p-case-wrapper {
  /* *********************** */
}
.p-case-wrapper .has-js_href {
  position: relative;
}
.p-case-wrapper .js_href {
  position: absolute;
  top: -10px;
}
@media (max-width: 750px) {
  .p-case-wrapper .js_href {
    top: calc(min(140 / var(--media-width) * 100vw, 140px) * -1 - 10px);
  }
}

.p-news-wrapper {
  margin: calc(110 / var(--media-width) * 100vw) auto;
  position: relative;
  z-index: 3;
}
.p-news-wrapper .news {
  margin: calc(60 / var(--media-width) * 100vw) auto;
  border-top: 1px solid var(--border-color);
}
.p-news-wrapper .item {
  display: block;
  padding: calc(40 / var(--media-width) * 100vw) 0;
  text-decoration: none !important;
  border-bottom: 1px solid var(--border-color);
  font-size: calc(28 / var(--media-width) * 100vw);
  font-weight: 500;
  line-height: 1.44;
  letter-spacing: 0.04em;
  position: relative;
  z-index: 3;
}
.p-news-wrapper .item::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-color: var(--bg02-color);
  -webkit-transition: 0.2s;
  transition: 0.2s;
  opacity: 0;
}
@media (pointer: fine) {
  .p-news-wrapper .item:hover::after {
    opacity: 1;
  }
}
.p-news-wrapper .ttl {
  margin-top: calc(8 / var(--media-width) * 100vw);
  font-size: 1.1428571429em;
}
.p-news-wrapper .news-top-ico {
  position: absolute;
  z-index: -1;
  top: calc(-47 / var(--media-width) * 100vw);
  right: calc(50 / var(--media-width) * 100vw);
  width: calc(133 / var(--media-width) * 100vw);
}

.pagination {
  margin-top: min(80 / var(--media-width) * 100vw, 80px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: min(5 / var(--media-width) * 100vw, 5px);
  font-size: min(28 / var(--media-width) * 100vw, 28px);
}
.pagination .page-numbers {
  width: 2.2em;
  text-align: center;
  color: var(--theme-color);
  font-family: "Jost", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-weight: 700;
  font-size: 1em;
  text-transform: uppercase;
  background: #fff;
  padding: min(5 / var(--media-width) * 100vw, 5px);
  border: 2px solid var(--theme-color);
  opacity: 1;
  text-decoration: none !important;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.pagination .page-numbers:hover, .pagination .page-numbers.current {
  background: var(--theme-color);
  color: #fff;
}
.pagination .prev,
.pagination .next {
  display: none;
  width: 6em;
  text-align: center;
  padding-left: 0;
  padding-right: 0;
}
.pagination .prev i,
.pagination .next i {
  font-size: 1em;
}
.pagination .next i {
  margin-left: min(4 / var(--media-width) * 100vw, 4px);
}
.pagination .prev i {
  margin-right: min(4 / var(--media-width) * 100vw, 4px);
}

.single-news-wrapper {
  margin: min(80 / var(--media-width) * 100vw, 80px) auto min(160 / var(--media-width) * 100vw, 160px);
}
.single-news-wrapper .time {
  font-size: 0.8em;
  margin-bottom: 0.6em;
}
.single-news-wrapper .title {
  color: var(--theme-color);
  font-weight: 700;
  padding-bottom: 0.5em;
  border-bottom: min(4 / var(--media-width) * 100vw, 4px) solid var(--theme-color);
  margin-bottom: 1em;
}
.single-news-wrapper .site-btn {
  margin-top: min(80 / var(--media-width) * 100vw, 80px);
}

.single-case-wrapper .section-single-content .thumbnail {
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  overflow: hidden;
  margin: min(60 / var(--media-width) * 100vw, 60px) auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.single-case-wrapper .section-single-content .title {
  margin-bottom: min(18 / var(--media-width) * 100vw, 18px);
}
.single-case-wrapper .section-single-content .title .top {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: min(18 / var(--media-width) * 100vw, 18px);
}
.single-case-wrapper .section-single-content .title .tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: min(18 / var(--media-width) * 100vw, 18px);
}
.single-case-wrapper .section-single-content .title .tag {
  background-color: var(--theme-color);
  color: #fff;
  font-size: min(24 / var(--media-width) * 100vw, 24px);
  font-weight: 500;
  line-height: 1;
  padding: min(6 / var(--media-width) * 100vw, 6px) min(10 / var(--media-width) * 100vw, 10px);
  border-radius: min(5 / var(--media-width) * 100vw, 5px);
}
.single-case-wrapper .section-single-content .title .addr {
  font-weight: 500;
}
.single-case-wrapper .section-single-content .title .ttl {
  font-size: min(44 / var(--media-width) * 100vw, 44px);
  font-weight: 700;
  line-height: 1.4772727273;
  color: var(--theme-color);
}
.single-case-wrapper .section-single-content .info {
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
}
.single-case-wrapper .section-single-content .info .figs {
  --figs-tt-bg-color: var(--theme-color);
  width: 90.7246376812%;
  max-width: min(626 / var(--media-width) * 100vw, 626px);
  margin: auto;
  overflow: hidden;
  --swiper-pagination-bullet-size: min(22 / var(--media-width) * 100vw, 22px);
  --swiper-pagination-bullet-horizontal-gap: min(20 / var(--media-width) * 100vw, 20px);
  --swiper-pagination-color: var(--theme-color);
  --swiper-pagination-bullet-inactive-color: var(--border02-color);
  --swiper-pagination-bullet-inactive-opacity: 1;
}
.single-case-wrapper .section-single-content .info .figs .tt {
  width: min(152 / var(--media-width) * 100vw, 152px);
  text-transform: uppercase;
  text-align: center;
  padding: min(4 / var(--media-width) * 100vw, 4px) min(10 / var(--media-width) * 100vw, 10px);
  background-color: var(--figs-tt-bg-color);
  color: #fff;
  border-radius: min(10 / var(--media-width) * 100vw, 10px) min(10 / var(--media-width) * 100vw, 10px) 0 0;
}
.single-case-wrapper .section-single-content .info .figs .swiper-pagination {
  position: initial;
  margin-top: min(30 / var(--media-width) * 100vw, 30px);
}
.single-case-wrapper .section-single-content .info .before {
  --figs-tt-bg-color: var(--font-color);
}
.single-case-wrapper .section-single-content .info .triangle {
  display: block;
  width: 0;
  height: 0;
  margin: min(40 / var(--media-width) * 100vw, 40px) auto min(20 / var(--media-width) * 100vw, 20px);
  border: min(47.5 / var(--media-width) * 100vw, 47.5px) solid transparent;
  border-top: min(42 / var(--media-width) * 100vw, 42px) solid var(--key02-color);
  border-bottom: none;
  position: relative;
  z-index: 3;
}
.single-case-wrapper .section-single-content .info .triangle::before {
  content: "";
  position: absolute;
  top: calc(min(10 / var(--media-width) * 100vw, 10px) * -1);
  left: 0;
  width: 0;
  height: 0;
  z-index: 1;
  border: min(47.5 / var(--media-width) * 100vw, 47.5px) solid transparent;
  border-top: min(42 / var(--media-width) * 100vw, 42px) solid var(--theme-color);
  border-bottom: none;
  -webkit-transform: translate(-50%, -100%);
      -ms-transform: translate(-50%, -100%);
          transform: translate(-50%, -100%);
}
.single-case-wrapper .section-single-content .info .fig {
  position: relative;
  z-index: 3;
  overflow: hidden;
  border-radius: 0 min(20 / var(--media-width) * 100vw, 20px) min(20 / var(--media-width) * 100vw, 20px) min(20 / var(--media-width) * 100vw, 20px);
  aspect-ratio: 626/373;
}
.single-case-wrapper .section-single-content .info .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.single-case-wrapper .section-single-content .info .boxes {
  margin: min(60 / var(--media-width) * 100vw, 60px) auto;
  padding: min(10 / var(--media-width) * 100vw, 10px) min(20 / var(--media-width) * 100vw, 20px) min(40 / var(--media-width) * 100vw, 40px);
  background-color: #F8F8F8;
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
}
.single-case-wrapper .section-single-content .info dl {
  padding: min(30 / var(--media-width) * 100vw, 30px) 0;
  border-bottom: min(4 / var(--media-width) * 100vw, 4px) dotted var(--border-color);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  max-width: min(616 / var(--media-width) * 100vw, 616px);
  margin: auto;
}
.single-case-wrapper .section-single-content .info dt {
  font-weight: 700;
  white-space: nowrap;
}
.single-case-wrapper .section-single-content .staff {
  margin: min(60 / var(--media-width) * 100vw, 60px) auto;
}
.single-case-wrapper .section-single-content .staff .ttl {
  font-size: min(36 / var(--media-width) * 100vw, 36px);
  font-weight: 700;
  line-height: 1.3888888889;
  border-bottom: min(5 / var(--media-width) * 100vw, 5px) dotted var(--key01-color);
  padding-bottom: min(8 / var(--media-width) * 100vw, 8px);
  padding-left: min(25 / var(--media-width) * 100vw, 25px);
  position: relative;
  margin-bottom: min(40 / var(--media-width) * 100vw, 40px);
}
.single-case-wrapper .section-single-content .staff .ttl::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: min(10 / var(--media-width) * 100vw, 10px);
  height: min(50 / var(--media-width) * 100vw, 50px);
  border-radius: min(5 / var(--media-width) * 100vw, 5px);
  background-color: var(--theme-color);
}
.single-case-wrapper .section-single-content .staff .content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: min(40 / var(--media-width) * 100vw, 40px);
}
.single-case-wrapper .section-single-content .staff .fig {
  width: min(250 / var(--media-width) * 100vw, 250px);
  min-width: min(250 / var(--media-width) * 100vw, 250px);
  aspect-ratio: 249/315;
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  position: relative;
  z-index: 3;
  overflow: hidden;
}
.single-case-wrapper .section-single-content .staff .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.single-case-wrapper .section-voice {
  margin: min(100 / var(--media-width) * 100vw, 100px) auto;
  padding: min(100 / var(--media-width) * 100vw, 100px) 0;
  background-color: var(--bg02-color);
  border-radius: min(40 / var(--media-width) * 100vw, 40px);
}
.single-case-wrapper .section-voice .list {
  margin-top: min(70 / var(--media-width) * 100vw, 70px);
}
.single-case-wrapper .section-voice .item {
  position: relative;
  z-index: 3;
  margin-top: min(60 / var(--media-width) * 100vw, 60px);
  border: min(2 / var(--media-width) * 100vw, 2px) solid var(--theme-color);
  border-radius: min(20 / var(--media-width) * 100vw, 20px);
  padding: min(40 / var(--media-width) * 100vw, 40px) min(20 / var(--media-width) * 100vw, 20px);
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: min(16 / var(--media-width) * 100vw, 16px);
}
.single-case-wrapper .section-voice .user {
  width: min(220 / var(--media-width) * 100vw, 220px);
  min-width: min(220 / var(--media-width) * 100vw, 220px);
  margin-bottom: min(180 / var(--media-width) * 100vw, 180px);
}
.single-case-wrapper .section-voice .fig {
  width: min(180 / var(--media-width) * 100vw, 180px);
  aspect-ratio: 1;
  overflow: hidden;
  margin: auto;
  border-radius: 100%;
  position: relative;
}
.single-case-wrapper .section-voice .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.single-case-wrapper .section-voice .tt {
  font-size: min(36 / var(--media-width) * 100vw, 36px);
  font-weight: 500;
  line-height: 1.44;
  color: var(--theme-color);
  margin-top: min(8 / var(--media-width) * 100vw, 8px);
  text-align: center;
}
.single-case-wrapper .section-voice .content {
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  position: relative;
  line-height: 2;
}
.single-case-wrapper .section-voice .content::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='2.2em'%3E%3Ccircle cx='3' cy='100%' r='1' fill='%23999'/%3E%3C/svg%3E");
  background-size: min(6 / var(--media-width) * 100vw, 6px) 2em;
  background-repeat: repeat;
}
.single-case-wrapper .section-voice .ico {
  position: absolute;
  bottom: min(9 / var(--media-width) * 100vw, 9px);
  left: min(17 / var(--media-width) * 100vw, 17px);
  width: min(165 / var(--media-width) * 100vw, 165px);
  aspect-ratio: 165/160;
  z-index: -1;
}
.single-case-wrapper .other-works {
  margin: min(100 / var(--media-width) * 100vw, 100px) auto;
}
.single-case-wrapper .other-works .works {
  --flex-list-column-gap: calc(20 / var(--media-width) * 100vw);
  --flex-list-col-num: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: calc(30 / var(--media-width) * 100vw) var(--flex-list-column-gap);
  margin: calc(80 / var(--media-width) * 100vw) auto calc(50 / var(--media-width) * 100vw);
}
.single-case-wrapper .other-works .work {
  width: calc((100% - var(--flex-list-column-gap) * (var(--flex-list-col-num) - 1)) / var(--flex-list-col-num));
  background-color: #fff;
  border: calc(2 / var(--media-width) * 100vw) solid var(--theme-color);
  overflow: hidden;
  border-radius: calc(15 / var(--media-width) * 100vw);
  text-decoration: none !important;
}
@media (pointer: fine) {
  .single-case-wrapper .other-works .work:hover .fig img {
    -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
            transform: scale(1.1);
  }
  .single-case-wrapper .other-works .work:hover .arrow .ico {
    -webkit-transform: translate(10%, 0);
        -ms-transform: translate(10%, 0);
            transform: translate(10%, 0);
  }
}
.single-case-wrapper .other-works .fig {
  width: 100%;
  overflow: hidden;
  aspect-ratio: 335/223.03;
  position: relative;
  z-index: 3;
}
.single-case-wrapper .other-works .fig img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
}
.single-case-wrapper .other-works .con {
  padding: calc(15 / var(--media-width) * 100vw) calc(20 / var(--media-width) * 100vw) calc(20 / var(--media-width) * 100vw);
}
.single-case-wrapper .other-works .ttl {
  font-size: calc(28 / var(--media-width) * 100vw);
  font-weight: 700;
  line-height: 1.2857142857;
  letter-spacing: 0.02em;
  color: var(--theme-color);
}
.single-case-wrapper .other-works .addr {
  font-size: calc(22 / var(--media-width) * 100vw);
  font-weight: 500;
  line-height: 1.6363636364;
  letter-spacing: 0.02em;
}
.single-case-wrapper .other-works .tags {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: calc(5 / var(--media-width) * 100vw);
}
.single-case-wrapper .other-works .tag {
  background-color: var(--theme-color);
  color: #fff;
  font-size: calc(18.73 / var(--media-width) * 100vw);
  line-height: 1;
  letter-spacing: 0.02em;
  padding: calc(4 / var(--media-width) * 100vw) calc(7 / var(--media-width) * 100vw);
  border-radius: calc(2.55 / var(--media-width) * 100vw);
}
.single-case-wrapper .other-works .bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: calc(20 / var(--media-width) * 100vw);
  margin-top: calc(5 / var(--media-width) * 100vw);
}
.single-case-wrapper .other-works .arrow .ico {
  background-color: var(--theme-color);
  color: #fff;
  font-size: calc(18 / var(--media-width) * 100vw);
  width: 2.5em;
  aspect-ratio: 1;
  border-radius: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.single-case-wrapper .other-works .arrow .ico svg {
  height: 0.6470588235em;
}
.single-case-wrapper .other-works .no-results {
  display: block;
  width: 100%;
  text-align: center;
  padding: min(60 / var(--media-width) * 100vw, 60px) 0;
  color: #999;
  font-size: min(28 / var(--media-width) * 100vw, 28px);
  font-weight: 700;
}

.p-privacy-wrapper {
  font-size: min(28 / var(--media-width) * 100vw, 28px);
}
.p-privacy-wrapper h2 {
  color: #fff;
  text-align: center;
  background-color: var(--theme-color);
  padding: 0.4em;
  margin-bottom: 1em;
}
.p-privacy-wrapper h3 {
  border-bottom: min(4 / var(--media-width) * 100vw, 4px) solid var(--theme-color);
  color: var(--theme-color);
  margin-top: 1em;
  margin-bottom: 0.8em;
  padding-bottom: 0.2em;
}
.p-privacy-wrapper .con {
  line-height: 1.8;
}
.p-privacy-wrapper .con ul {
  margin-top: 0.5em;
}

/* ========================================
   画像ポップアップ / Image Popup
   ======================================== */
.image-popup-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 999999;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}
.image-popup-overlay.active {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  opacity: 1;
}

.image-popup-container {
  position: relative;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(0.8);
      -ms-transform: scale(0.8);
          transform: scale(0.8);
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.image-popup-overlay.active .image-popup-container {
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}

.image-popup-close {
  position: absolute;
  top: min(20 / var(--media-width) * 100vw, 20px);
  right: min(20 / var(--media-width) * 100vw, 20px);
  width: min(50 / var(--media-width) * 100vw, 50px);
  height: min(50 / var(--media-width) * 100vw, 50px);
  background: #fff;
  border: none;
  border-radius: 50%;
  font-size: min(30 / var(--media-width) * 100vw, 30px);
  color: #333;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  line-height: 1;
  -webkit-transition: background-color 0.3s ease, -webkit-transform 0.3s ease;
  transition: background-color 0.3s ease, -webkit-transform 0.3s ease;
  transition: background-color 0.3s ease, transform 0.3s ease;
  transition: background-color 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease;
  z-index: 10;
}
.image-popup-close:hover {
  background-color: var(--theme-color);
  color: #fff;
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg);
}

.image-popup-content {
  overflow: hidden;
  max-width: 90%;
  max-height: 90%;
}
.image-popup-content img {
  display: block;
  max-width: 100%;
  max-height: 80vh;
  width: auto;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}