@charset "UTF-8";
:root {
  --color-main: #D8FCD8;
  --color-green: #14804d;
  --color-lime: #33CC66;
  --border-green: #bfe8d2;
  --color-text: #444;
  --color-hover: #FFCC33;
  --color-bg: #fff;
  --font-family: 'Noto Serif JP', serif;
  --font-gothic: 'Noto Sans JP', sans-serif;
  --font-hina: 'Hina Mincho', serif;
  --font-Marcellus: "Marcellus", serif;
  --font-sawarabi: "Sawarabi Mincho", serif;
  --bg-green-gradient: linear-gradient(45deg, #87D5AE, #fff);
  --section-margin: clamp(5rem, 1.44vw, 8rem);
  --header-height: 134px;
  --header-max-width: 1540px;
  --content-max-width: 1240px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

section {
  padding: 60px 0;
  font-family: var(--font-family);
  color: var(--color-text);
}
section h2.section-title {
  font-size: clamp(34px, 1.44vw, 38px);
  text-align: center;
  margin-bottom: 40px;
  color: var(--color-green);
  letter-spacing: 0.15em;
  font-weight: normal;
}
section h2.section-title span {
  display: block;
  font-size: 18px;
  margin-top: 12px;
  letter-spacing: normal;
}
section .section-catch .catch-heading {
  font-size: clamp(24px, 3vw, 48px);
  margin-bottom: 1.5rem;
}
section .section-catch {
  font-family: var(--font-sawarabi);
  text-align: center;
  font-size: clamp(15px, 3vw, 20px);
  margin-bottom: 5rem;
  font-weight: normal;
}
section .image-wrapper {
  margin: 5rem 0;
}
@media (max-width: 767px) {
  section .section-catch .catch-heading {
    line-height: 1.5;
  }
  section .image-wrapper {
    margin: 2.5rem 0;
  }
}

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

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

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

img {
  display: block;
  max-width: 100%;
}

span.note {
  display: block;
  font-size: 12px;
  color: var(--color-text);
  margin-top: 4px;
  text-align: right;
}

p.note-small {
  display: block;
  font-size: 12px;
  color: var(--color-text);
  margin-top: 4px;
  text-align: left;
}

@media (max-width: 767px) {
  .sp-inner-wide {
    padding: 0;
  }
  span.note {
    text-align: left;
  }
}
.columns-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem;
}

.columns-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3rem;
}

.columns-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 3rem;
}

@media (max-width: 767px) {
  .columns-2 {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .columns-3 {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .columns-2.m-col-2 {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
  .columns-3.m-col-3 {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
  }
  .columns-4 {
    gap: 1.5rem;
  }
}
@media (max-width: 480px) {
  .columns-2,
  .columns-2.m-col-2 {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .columns-3,
  .columns-3.m-col-3 {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .columns-2.s-col-2 {
    grid-template-columns: repeat(2, 1fr);
  }
}
.btn-space {
  margin: 5rem 0 0 0;
}
.btn-space a {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 8px 16px;
  font-size: clamp(14px, 3vw, 20px);
  height: 100%;
  color: var(--color-text);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.btn-space a span > small {
  display: block;
  font-size: clamp(12px, 3vw, 18px);
  margin-top: 4px;
  margin-bottom: 0.5rem;
  color: var(--color-text);
  text-align: center;
  transition: all 0.4s ease-in-out;
}
.btn-space a::before {
  content: "";
  width: 40px;
  height: 40px;
  display: inline-block;
  margin-right: 0.5rem;
}
.btn-space .btn-left a {
  background-color: #87D5AE;
  text-decoration: none;
  border-bottom: 6px solid var(--color-green);
}
.btn-space .btn-left a::before {
  background: url("../images/contact_icon.gif") center center no-repeat;
  background-size: contain;
  transition: all 0.4s ease-in-out;
}
.btn-space .btn-left a:hover {
  color: #fff;
  background-color: #007C45;
  border-bottom: 6px solid #336633;
}
.btn-space .btn-left a:hover::before {
  background: url("../images/contact_icon2.gif") center center no-repeat;
  background-size: contain;
}
.btn-space .btn-right a {
  background-color: #FFFF99;
  border-bottom: 6px solid #FF9900;
  color: var(--color-text);
  text-decoration: none;
}
.btn-space .btn-right a::before {
  background: url("../images/financial_icon.gif") center center no-repeat;
  background-size: contain;
  transition: all 0.4s ease-in-out;
}
.btn-space .btn-right a:hover {
  color: #fff;
  background-color: #FF9966;
  border-bottom: 6px solid #CC6633;
}
.btn-space .btn-right a:hover span > small {
  color: #fff;
}
.btn-space .btn-right a:hover::before {
  background: url("../images/financial_icon2.gif") center center no-repeat;
  background-size: contain;
}
@media (max-width: 480px) {
  .btn-space a::before {
    content: "";
    width: 30px;
    height: 30px;
    display: inline-block;
    margin-right: 0.5rem;
  }
}


header#tokiwa-kyukei-header {
  background: rgba(216, 252, 216, 0.8);
  border-bottom: 1px solid #ccc;
  font-family: var(--font-family);
  line-height: 1.5;
  padding-bottom: 12px;
}

#tokiwa-kyukei-header {
  background: var(--color-lime);
  border-bottom: 1px solid var(--border-green);
}
#tokiwa-kyukei-header .header-inner {
  max-width: var(--header-max-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  grid-template-areas: "catch top" "nav   nav";
  row-gap: 6px;
  align-items: center;
}
#tokiwa-kyukei-header .catch {
  grid-area: catch;
  color: var(--color-text);
  font-size: clamp(14px, 1.2vw, 18px);
}
#tokiwa-kyukei-header .kyukei-header-top {
  grid-area: top;
  display: flex;
  align-items: center;
  gap: 24px;
}
#tokiwa-kyukei-header .kyukei-header-top .map a {
  color: var(--color-green);
  text-decoration: none;
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 600;
  display: flex;
  align-items: center;
}
#tokiwa-kyukei-header .kyukei-header-top .map a::before {
  content: "";
  width: 22px;
  height: 22px;
  background: url("../images/map_icon.svg") no-repeat center center;
  display: inline-block;
  background-size: contain;
  margin-right: 0.5rem;
  transition: all 0.4s ease-in-out;
}
#tokiwa-kyukei-header .kyukei-header-top .map a:hover {
  color: var(--color-hover);
}
#tokiwa-kyukei-header .kyukei-header-top .map a:hover::before {
  content: "";
  background: url("../images/map_icon_hover.gif") no-repeat center center;
  display: inline-block;
  background-size: contain;
  margin-right: 0.5rem;
  width: 22px;
  height: 22px;
}
#tokiwa-kyukei-header .kyukei-header-top .btn-link ul {
  display: flex;
  align-items: center;
  gap: 12px;
  list-style: none;
  padding: 0;
  margin: 0;
}
#tokiwa-kyukei-header .kyukei-header-top .btn-link ul li {
  background-color: #fff;
}
#tokiwa-kyukei-header .kyukei-header-top .btn-link a {
  padding: 2px 6px;
  border: 1px solid var(--color-green);
  color: var(--color-green);
  text-decoration: none;
  font-size: clamp(12px, 1.2vw, 18px);
}
#tokiwa-kyukei-header .kyukei-header-top .btn-link a:hover {
  background-color: var(--color-green);
  color: #fff;
}
#tokiwa-kyukei-header .kyukei-header-top .tel {
  text-align: right;
  line-height: 1.2;
}
#tokiwa-kyukei-header .kyukei-header-top .tel a {
  display: block;
  font-size: 32px;
  font-weight: bold;
  color: #000;
  text-decoration: none;
  font-family: var(--font-gothic);
}
#tokiwa-kyukei-header .kyukei-header-top .tel a::before {
  content: "";
  width: 22px;
  height: 22px;
  background: url("../images/tel_icon.svg") no-repeat center center;
  display: inline-block;
  background-size: cover;
  margin-right: 0.5rem;
}
#tokiwa-kyukei-header .kyukei-header-top .tel span {
  font-size: 12px;
  color: var(--color-text);
}
#tokiwa-kyukei-header .main-anchor {
  position: relative;
  grid-area: nav;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  list-style: none;
  padding: 0;
  margin: 0;
}
#tokiwa-kyukei-header .main-anchor li {
  text-align: center;
  font-size: clamp(14px, 1.2vw, 23px);
  line-height: 1.2;
}
#tokiwa-kyukei-header .main-anchor li:first-child {
  border-left: none;
}
#tokiwa-kyukei-header .main-anchor a {
  display: block;
  padding: 8px;
  text-decoration: none;
  color: var(--color-green);
  font-weight: 600;
}
#tokiwa-kyukei-header .main-anchor a span {
  display: block;
  margin-top: 4px;
  font-size: clamp(12px, 1.2vw, 16px);
  font-weight: normal;
}
#tokiwa-kyukei-header .main-anchor a:hover {
  color: var(--color-hover);
}

.sp-slide-menu {
  display: none;
}

.catch-sp {
  display: none;
}

  header#tokiwa-kyukei-header .sp-menu {
    display: block;
  }
  header#tokiwa-kyukei-header .hamburger {
    position: fixed;
    top: 10px;
    right: 10px;
    width: 43px;
    height: 43px;
    background: var(--color-green);
    border: none;
    cursor: pointer;
    z-index: 1100;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.4s ease;
  }
  header#tokiwa-kyukei-header .hamburger span {
    position: absolute;
    left: 50%;
    width: 26px;
    height: 2px;
    background: #fff;
    transform: translateX(-50%);
    transition: transform 0.4s ease, opacity 0.3s ease;
  }
  header#tokiwa-kyukei-header .hamburger span:nth-child(1) {
    top: 11px;
  }
  header#tokiwa-kyukei-header .hamburger span:nth-child(2) {
    top: 20px;
  }
  header#tokiwa-kyukei-header .hamburger span:nth-child(3) {
    top: 29px;
  }
  header#tokiwa-kyukei-header .hamburger.is-open {
    transform: translateX(-85vw);
    background: none;
  }
  header#tokiwa-kyukei-header .hamburger.is-open span:nth-child(1) {
    transform: translate(-50%, 9px) rotate(45deg);
  }
  header#tokiwa-kyukei-header .hamburger.is-open span:nth-child(2) {
    opacity: 0;
  }
  header#tokiwa-kyukei-header .hamburger.is-open span:nth-child(3) {
    transform: translate(-50%, -9px) rotate(-45deg);
  }

@media screen and (min-width: 768px) {
#PC------------------------{}
    #tokiwa-kyukei-header .hamburger {
      display: none!important;
    }
}
@media screen and (min-width: 768px) and (max-width: 969px){
#TABLET------------------------{}
	.sp-slide-menu,
    #tokiwa-kyukei-header .hamburger {
      	display: block!important;
    }
    #tokiwa-kyukei-header .kyukei-header-top {
        padding-right: 50px;
    }
	#mv-hero {
  		margin-top: 20px!important;
	}
  	.catch-sp {
	  	font-size: 16px!important;
		top: 18px!important;
  	}
	.main-anchor,
	.sp-slide-menu .sns-icons {
  		margin-top: 20px!important;
  	}
}
@media (max-width: 969px) {
  body.is-fixed {
    overflow: hidden;
  }
  .sp-slide-menu {
    position: fixed;
    top: 0;
    right: 0;
    width: 85vw;
    height: 100vh;
    height: 100dvh; /* 動的に高さを調整 */
    padding-bottom: env(safe-area-inset-bottom); /* ホームバー分の余白を強制確保 */
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    background: #fff;
    z-index: 1100;
    transform: translateX(100%);
    transition: transform 0.4s ease;
  }
  .sp-slide-menu.is-open {
    transform: translateX(0);
  }
  .catch-sp {
    display: block;
    position: absolute;
    left: 20px;
    top: 12px;
    color: var(--color-text);
    font-family: var(--font-family);
    font-size: clamp(13px, 1.2vw, 16px);
  }
  header#tokiwa-kyukei-header {
    height: 54px;
    background: none;
    border-bottom: none;
    overflow: visible;
  }
  header#tokiwa-kyukei-header .catch {
    display: none;
  }
  header#tokiwa-kyukei-header .kyukei-header-top {
    display: none;
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp {
    transform: translateX(100%);
    width: 85vw;
    display: block;
    transition: transform 0.4s ease;
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp .map a {
    color: var(--color-green);
    text-decoration: none;
    font-size: clamp(14px, 1.2vw, 18px);
    font-weight: 600;
    display: flex;
    align-items: center;
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp .map a::before {
    content: "";
    width: 22px;
    height: 22px;
    background: url("../images/map_icon.svg") no-repeat center center;
    display: inline-block;
    background-size: contain;
    margin-right: 0.5rem;
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp .btn-link ul {
    display: flex;
    align-items: center;
    gap: 12px;
    list-style: none;
    padding: 0;
    margin: 0;
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp .btn-link ul li {
    background-color: #fff;
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp .btn-link a {
    padding: 2px 6px;
    border: 1px solid var(--color-green);
    color: var(--color-green);
    text-decoration: none;
    font-size: clamp(12px, 1.2vw, 18px);
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp .tel {
    text-align: right;
    line-height: 1.2;
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp .tel a {
    display: block;
    font-size: 32px;
    font-weight: bold;
    color: #000;
    text-decoration: none;
    font-family: var(--font-gothic);
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp .tel a::before {
    content: "";
    width: 22px;
    height: 22px;
    background: url("../images/tel_icon.svg") no-repeat center center;
    display: inline-block;
    background-size: cover;
    margin-right: 0.5rem;
  }
  header#tokiwa-kyukei-header .kyukei-header-top-sp .tel span {
    font-size: 12px;
    color: var(--color-text);
  }
  header#tokiwa-kyukei-header.is-open .kyukei-header-top-sp {
    right: 0;
    position: relative;
    z-index: 1050;
    display: block;
    transform: translateX(0);
    background-color: #fff;
  }
  header#tokiwa-kyukei-header .main-anchor {
    width: 80vw;
    display: grid;
    grid-template-columns: 1fr;
    position: fixed;
    transform: translateX(100%);
    transition: transform 0.4s ease;
  }
  header#tokiwa-kyukei-header .main-anchor.is-open {
    position: absolute;
    top: 100%;
    right: 0;
    background: #fff;
    padding: 12px 0;
    z-index: 1050;
    transform: translateX(0);
  }
  header#tokiwa-kyukei-header .main-anchor.is-open li {
    font-size: clamp(14px, 4vw, 24px);
    line-height: 1.2;
    padding: 8px 0;
  }
  .menu-overlay {
    position: fixed;
    inset: 0;
    background: #87D5AE;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease;
  }
  .menu-overlay.is-active {
    opacity: 0.9;
    visibility: visible;
  }
  .sp-slide-menu {
    display: flex;
    padding: 14px 14px;
    font-family: var(--font-family);
    flex-direction: column;
    justify-content: space-between;
    gap: 1rem;
  }
  .sp-slide-menu .tel {
    text-align: right;
    line-height: 1.2;
  }
  .sp-slide-menu .tel a {
    display: block;
    font-size: 28px;
    font-weight: bold;
    color: #000;
    text-decoration: none;
    font-family: var(--font-gothic);
  }
  .sp-slide-menu .tel a::before {
    content: "";
    width: 22px;
    height: 22px;
    background: url("../images/tel_icon.svg") no-repeat center center;
    display: inline-block;
    background-size: cover;
    margin-right: 0.5rem;
  }
  .sp-slide-menu .tel span {
    font-size: 12px;
    color: var(--color-text);
  }
  .sp-slide-menu .tel {
    text-align: center;
  }
  .sp-slide-menu .btn-link ul {
    display: flex;
    align-items: center;
    gap: 12px;
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .sp-slide-menu .btn-link ul li {
    background-color: #fff;
  }
  .sp-slide-menu .btn-link a {
    padding: 2px 6px;
    border: 1px solid var(--color-green);
    color: var(--color-green);
    text-decoration: none;
    font-size: clamp(12px, 1.2vw, 18px);
  }
  .sp-slide-menu .btn-link a:hover {
    background-color: var(--color-green);
    color: #fff;
  }
  .sp-slide-menu .btn-link ul {
    justify-content: center;
    margin: 2rem 0;
    gap: 2rem;
  }
  .sp-slide-menu .btn-link ul li {
    display: inline-block;
  }
  .sp-slide-menu .btn-link ul li a {
    font-size: clamp(16px, 5vw, 18px);
    padding: 6px 12px;
    display: block;
  }
  .sp-slide-menu .main-anchor li {
    text-align: center;
    font-size: clamp(14px, 1.2vw, 23px);
    line-height: 1.2;
  }
  .sp-slide-menu .main-anchor li:first-child {
    border-left: none;
  }
  .sp-slide-menu .main-anchor a {
    display: block;
    padding: 5px 0;
    text-decoration: none;
    color: var(--color-green);
    font-weight: 600;
  }
  .sp-slide-menu .main-anchor a span {
    display: block;
    margin-top: 4px;
    font-size: clamp(12px, 1.2vw, 16px);
    font-weight: normal;
  }
  .sp-slide-menu .main-anchor a:hover {
    color: var(--color-hover);
  }
  .sp-slide-menu .main-anchor li {
    padding: 1rem 0;
  }
  .sp-slide-menu .main-anchor li a {
    font-size: clamp(16px, 5vw, 23px);
  }
  .sp-slide-menu .main-anchor li a span {
    font-size: clamp(14px, 5vw, 16px);
  }
  .sp-slide-menu .main-anchor li {
    border-bottom: 1px dotted var(--color-green);
  }
  .sp-slide-menu .sns-icons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
  }
  .sp-slide-menu .sns-icons > li {
    width: 40px;
  }
  .sp-slide-menu .map a {
    color: var(--color-green);
    text-decoration: none;
    font-size: clamp(14px, 1.2vw, 18px);
    font-weight: 600;
    display: flex;
    align-items: center;
  }
  .sp-slide-menu .map a::before {
    content: "";
    width: 22px;
    height: 22px;
    background: url("../images/map_icon.svg") no-repeat center center;
    display: inline-block;
    background-size: contain;
    margin-right: 0.5rem;
    transition: all 0.4s ease-in-out;
  }
  .sp-slide-menu .map a:hover {
    color: var(--color-hover);
  }
  .sp-slide-menu .map a:hover::before {
    content: "";
    background: url("../images/map_icon_hover.gif") no-repeat center center;
    display: inline-block;
    background-size: contain;
    margin-right: 0.5rem;
    width: 22px;
    height: 22px;
  }
  .sp-slide-menu .map {
    margin: 1rem 0 0;
  }
  .sp-slide-menu .map a {
    font-size: clamp(16px, 5vw, 23px);
    justify-content: center;
    font-weight: normal;
  }
}
@media (max-width: 767px) and (max-width: 375px) {
  .sp-slide-menu .main-anchor li {
    padding: 0;
  }
  .sp-slide-menu .main-anchor li a {
    font-size: clamp(16px, 3.5vw, 23px);
  }
  .sp-slide-menu .main-anchor li a span {
    font-size: clamp(14px, 4.5vw, 16px);
  }
  .sp-slide-menu .main-anchor li {
    border-bottom: 1px dotted var(--color-green);
  }
}
#mv-hero {
  margin-top: 120px;
  padding-bottom: 80px;
  font-family: var(--font-family);
}
#mv-hero .mv-hero {
  position: relative;
}
#mv-hero .mv-hero .mv-hero-title {
  width: 20%;
  height: auto;
  position: absolute;
  left: 0;
  z-index: 1;
}
#mv-hero .mv-hero .main-visual {
  position: relative;
  width: 94%;
  z-index: 0;
  top: 60px;
  margin-left: auto;
}
#mv-hero .mv-hero .mv-main {
  position: relative;
  padding-top: 1rem;
}
#mv-hero .mv-hero .mv-main .mv-midashi {
  position: absolute;
  top: 5%;
  right: 5%;
  width: 46%;
}
#mv-hero .mv-hero .mv-text {
  position: relative;
  width: 80%;
  margin-left: auto;
}
#mv-hero .mv-hero .mv-text .text-yokoku {
  position: absolute;
  bottom: 0;
  right: 0;
  font-size: 12px;
  line-height: 1.6;
}
#mv-hero .mv-hero .mv-text .text-honban {
  font-family: var(--font-hina);
  position: absolute;
  bottom: 0;
  right: 0;
  color: var(--color-green);
  font-size: clamp(30px, 4vw, 50px);
}
@media (max-width: 767px) {
  #mv-hero {
    margin-top: 27px;
    padding-bottom: 0;
  }
  #mv-hero .mv-hero .main-visual {
    position: relative;
    width: 100%;
    top: -90px;
    display: flex;
    flex-direction: column;
    margin-bottom: -90px;
  }
  #mv-hero .mv-hero .mv-main figure img {
    aspect-ratio: 390/268;
    object-fit: cover;
  }
  #mv-hero .mv-hero .mv-main figure {
    margin-bottom: 0.5rem;
  }
  #mv-hero .mv-hero .mv-main .mv-midashi {
    width: 54%;
    top: auto!important;
    bottom: 16%;
    left: 3%;
    /*transform: translateX(-50%);*/
  }
	span.note {
  		font-size: 11px;
	}
  #mv-hero .mv-hero .mv-text {
    padding-left: 8px;
    padding-right: 8px;
    order: 3;
    position: static;
    width: 100%;
  }
  #mv-hero .mv-hero .mv-text .text-yokoku {
    position: static;
    margin-top: 10px;
    text-align: left;
  }
  #mv-hero .mv-hero .mv-text .text-honban {
    position: static;
    font-size: clamp(30px, 5vw, 40px);
    text-align: center;
  }
  #mv-hero .mv-hero span.note {
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: 20px;
  }
  #mv-hero .mv-hero .mv-hero-title {
    width: 40%;
    margin: auto;
    position: relative;
  }
}

section#features {
  padding-bottom: 0;
}
section#features .features {
  padding: 60px 0;
  background: url("../images/bg_greengradation.png") no-repeat center;
  background-size: cover;
}
section#features .features-list {
  margin: auto;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 3rem;
  padding-left: 8px;
  padding-right: 8px;
}
@media (max-width: 767px) {
  section#features {
    padding-top: 20px;
  }
  section#features .features {
    padding: 30px 0;
  }
  section#features .features-list {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
  }
}

section#info h2.section-title-img {
  text-align: center;
}
section#info h2.section-title-img img {
  max-width: 160px;
  margin: 0 auto 3rem;
}
section#info .info-list {
  max-width: 80%;
  margin: auto;
}
section#info .info-list ul {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}
section#info .info-list ul li {
  flex: 0 1 auto;
  font-size: clamp(22px, 1.8vw, 24px);
  line-height: 1.4;
  padding: 8px 0;
  border-bottom: 1px dotted var(--border-green);
}
section#info .info-list ul li time {
  margin-right: 1rem;
}
section#info .info-list ul li a {
  color: var(--color-text);
  text-decoration: none;
}
@media (max-width: 768px) {
  section#info .info-list {
    max-width: 100%;
    row-gap: 1rem;
  }
  section#info .info-list ul li {
    font-size: clamp(18px, 1.8vw, 20px);
  }
  section#info .info-list ul li time {
    display: block;
  }
}

section#concept {
  background: linear-gradient(to bottom, #D8FCD8 0%, #ffffff 100%);
  background-size: cover;
}

.concept-main {
  position: relative;
  min-height: 550px;
}
.concept-main .concept_m_01 {
  position: absolute;
  top: 0;
  left: 0;
  width: 45%;
  object-fit: cover;
  z-index: 3;
}
.concept-main .concept_m_02 {
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  object-fit: cover;
  z-index: 2;
}
.concept-main .square {
  position: absolute;
  top: 37%;
  left: 48%;
  transform: translateX(-50%);
  aspect-ratio: 4/3;
  width: 39%;
  background-color: #FFFF99;
  z-index: 1;
}
.concept-main .text-block {
  position: absolute;
  bottom: 0;
  z-index: 4;
  font-size: clamp(15px, 1.8vw, 20px);
  width: 46%;
  font-weight: normal;
}
.concept-main .text-block .catch-heading {
  font-size: clamp(20px, 3vw, 32px);
  margin-bottom: 1.8rem;
  line-height: 1.4;
}
@media (max-width: 767px) {
  .concept-main {
    min-height: 580px;
  }
  .concept-main .concept_m_01 {
    top: 18%;
    left: 0;
    width: 45%;
  }
  .concept-main .concept_m_02 {
    top: 0;
    right: 0;
    width: 60%;
  }
  .concept-main .square {
    top: 37%;
    left: 49%;
    width: 50%;
  }
  .concept-main .text-block {
    position: absolute;
    bottom: 17%;
    width: 60%;
  }
}
@media (max-width: 479px) {
  .concept-main {
    min-height: 540px;
  }
  .concept-main .concept_m_01 {
    top: -20px;
    left: 0;
    width: 60%;
  }
  .concept-main .concept_m_02 {
    top: 13%;
    right: 0;
    width: 80%;
  }
  .concept-main .square {
    top: 22%;
    left: 46%;
    width: 75%;
  }
  .concept-main .text-block {
    position: absolute;
    bottom: 5%;
    width: 100%;
  }
}

.concept-block .block-image {
  position: relative;
}
.concept-block .block-image .concept_parts01 {
  position: absolute;
  bottom: 12%;
  right: 4%;
  width: 18%;
  height: 18%;
  object-fit: cover;
}
.concept-block .columns-3.block-part {
  gap: 6rem;
}
.concept-block .columns-3.block-part .item {
  display: flex;
  flex-direction: column;
}
.concept-block .columns-3.block-part .item span {
  margin-top: auto;
  display: block;
  font-size: clamp(12px, 2.6vw, 28px);
  margin-top: 0.5rem;
  text-align: center;
}
.concept-block .columns-3.block-part .item span em {
  font-style: normal;
  font-size: clamp(16px, 2.6vw, 40px);
}
@media (max-width: 767px) {
  .concept-block .columns-3.block-part {
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
  }
}

section#plan {
  background: linear-gradient(to bottom, #fff 0%, #F4EEC2 100%);
}

.case {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 24px;
  margin-bottom: 6rem;
}
.case .box {
  display: flex;
  flex-direction: column;
}
.case {
  /* 高さを揃える本体 */
}
.case .media {
  flex: 1;
  width: 100%;
  background: #eee;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.case .media span {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: clamp(8px, 1.5vw, 12px);
  font-size: clamp(10px, 1.5vw, 12px);
  color: #fff;
}
.case .media span.dark {
  color: var(--color-text);
}
.case .big {
  grid-row: 1/3;
}
.case {
  /* small（右側） */
}
.case .box:nth-of-type(2),
.case .box:nth-of-type(3) {
  grid-column: 2;
}
.case img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.case .media.is-text {
  background: #fff;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}
.case .media.is-text h3 {
  font-family: var(--font-sawarabi);
  font-size: clamp(24px, 1.5vw, 34px);
  margin-bottom: 1rem;
  line-height: 1.8;
  margin-bottom: 3.5rem;
}
.case .media.is-text p {
  font-size: clamp(16px, 1.5vw, 20px);
  line-height: 1.8;
  color: #444;
  font-family: var(--font-hina);
}
.case {
  /* キャプション（高さに影響させない） */
}
.case .caption {
  margin-top: 8px;
  font-size: 16px;
  line-height: 1.4;
  color: #666;
}
.case {
  /* ===== 左右反転 ===== */
}
.case.case--reverse .big {
  grid-column: 2;
}
.case.case--reverse .box:nth-of-type(2),
.case.case--reverse .box:nth-of-type(3) {
  grid-column: 1;
}

/* SP */
@media (max-width: 767px) {
  .case {
    display: block;
    margin-bottom: 2rem;
  }
  .case .caption, .case .media.is-text {
    margin-bottom: 1.5rem;
  }
  .case .big {
    grid-row: auto;
  }
  .case .box {
    grid-column: auto;
  }
  .case .media {
    flex: none;
  }
}
.plan-image-main {
  position: relative;
  margin-bottom: 3rem;
}

.plan-midashi-box {
  position: absolute;
  width: 36%;
  top: 0;
  left: 0;
  font-family: var(--font-hina);
}
.plan-midashi-box img {
  max-width: 220px;
  width: 100%;
  margin-bottom: 1rem;
}

.plan-midashi-box p.catch,
.plan-midashi-2 p.catch {
  font-size: clamp(36px, 1.5vw, 48px);
  line-height: 1.4;
  margin-bottom: 2rem;
}
.plan-midashi-box p,
.plan-midashi-2 p {
  font-size: clamp(16px, 1.5vw, 20px);
}

.plan-midashi-2 {
  display: grid;
  grid-template-columns: 20% 1fr;
  margin-bottom: 4rem;
  gap: 2rem;
}

@media (max-width: 767px) {
  .plan-midashi-box {
    position: relative;
    width: 100%;
    margin-top: 2rem;
  }
  .plan-midashi-box img {
    max-width: 180px;
  }
  .plan-midashi-2 {
    display: grid;
    grid-template-columns: 1fr;
    margin-bottom: 4rem;
    gap: 2rem;
  }
  .plan-midashi-2 img {
    max-width: 180px;
  }
}
.plan-container {
  margin-bottom: 10rem;
}
.plan-container ul.madori-detail {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.plan-container ul.madori-detail li {
  font-size: 18px;
}
.plan-container ul.list-detail {
  margin: 3rem 0;
}
.plan-container ul.list-detail > li {
  position: relative;
  font-size: clamp(14px, 1.8vw, 20px);
  padding-left: 1.5em;
  line-height: 1.4;
}
.plan-container ul.list-detail > li::before {
  content: "●";
  margin-right: 4px;
  color: var(--color-green);
  position: absolute;
  left: 0;
  top: 0;
}
.plan-container ul.list-detail > li:not(:first-child) {
  margin-top: 1rem;
}

@media (max-width: 767px) {
  .plan-container {
    margin-bottom: 5rem;
  }
}
.nairan {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  border: 3px solid var(--color-green);
  padding: 10px 6px;
  font-size: clamp(20px, 1.44vw, 32px);
  color: var(--color-green);
  gap: 1rem;
}
.nairan small {
  font-size: clamp(16px, 1.44vw, 22px);
}

.price {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  border-bottom: 1px dotted #000;
  padding: 10px 6px;
  font-size: 20px;
  color: var(--color-text);
  gap: 1rem;
}
.price .left {
  font-size: clamp(12px, 1.44vw, 18px);
  font-weight: normal;
  line-height: 1.15;
  text-align: center;
}
.price .left small {
  font-size: clamp(12px, 1.44vw, 14px);
  display: block;
}
.price .amount {
  font-size: clamp(12px, 1.44vw, 24px);
  line-height: 1.15;
}
.mitei .price .amount {
  font-size: clamp(10px, 1.0vw, 12px);
}
.price .amount em {
  font-style: normal;
  font-weight: bold;
  font-size: clamp(32px, 2.88vw, 46px);
  font-family: var(--font-family);
  letter-spacing: 2px;
}

.plan-img-pc {
  display: block;
}

.plan-img-sp {
  display: none;
}

@media (max-width: 767px) {
  .plan-img-pc {
    display: none;
  }
  .plan-img-sp {
    display: block;
  }
  .plan-img-sp .f2, .plan-img-sp .f1 {
    margin: auto;
  }
  .plan-img-sp .f2 {
    width: 60%;
    margin-bottom: 2rem;
  }
	.plan01-01 .plan-img-sp .f2 {
		width: 55%;
    	margin-right: 7.5%;
  	}
	.plan02-01 .plan-img-sp .f2 {
		width: 55%;
    	margin-left: 7.5%;
  	}
	.plan02-02 .plan-img-sp .f1 {
		width: 92.7%;
  	}
	.plan02-02 .plan-img-sp .f2 {
		width: 51%;
    	margin-left: 9.5%;
  	}
  .plan-img-sp.plan-2 .f2 {
    width: 43%;
    margin-bottom: 2rem;
  }
}

section#quality figure,
section#location figure {
  position: relative;
}
section#quality figure figcaption,
section#location figure figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: clamp(8px, 1.5vw, 12px);
  font-size: clamp(10px, 1.5vw, 12px);
  color: #fff;
}
section#quality figure figcaption.dark,
section#location figure figcaption.dark {
  color: var(--color-text);
}
section#quality .catch-detail,
section#quality .catch-left,
section#quality .catch-right,
section#location .catch-detail,
section#location .catch-left,
section#location .catch-right {
  padding: clamp(30px, 1.4vw, 40px);
}
section#quality .catch-detail h3,
section#quality .catch-left h3,
section#location .catch-detail h3,
section#location .catch-left h3 {
  font-size: clamp(24px, 1.5vw, 34px);
  line-height: 1.6;
  margin-bottom: 3rem;
  /*font-weight: normal;*/
}
section#quality .catch-detail p,
section#quality .catch-left p,
section#location .catch-detail p,
section#location .catch-left p {
  font-size: clamp(14px, 1.5vw, 18px);
  line-height: 2;
  font-family: var(--font-hina);
}
section#quality .catch-detail,
section#location .catch-detail {
  background: var(--bg-green-gradient);
}
section#quality .catch-left,
section#location .catch-left {
  background-color: var(--color-green);
}
section#quality .catch-left h3,
section#location .catch-left h3 {
  color: #FFFF99;
}
section#quality .catch-left p,
section#location .catch-left p {
  color: #fff;
}
section#quality .catch-right,
section#location .catch-right {
  background-color: #FFFF99;
}
section#quality .catch-right h3,
section#location .catch-right h3 {
  font-size: clamp(16px, 1.5vw, 18px);
  margin: 1rem 0;
}
section#quality .catch-right p,
section#location .catch-right p {
  font-size: clamp(12px, 1.5vw, 14px);
  line-height: 1.6;
}

.quality-catch-01, .quality-catch-02 {
  display: grid;
  gap: 0;
  grid-template-columns: 1fr 1fr;
  margin: 5rem 0;
}
.quality-catch-01 img, .quality-catch-02 img {
  aspect-ratio: 4/3;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.quality-catch-03 {
  display: grid;
  gap: 3rem;
}

@media (max-width: 767px) {
  .quality-catch-01, .quality-catch-02 {
    grid-template-columns: 1fr;
  }
}
.quality-taishin,
.quality-kitchen,
.quality-bath,
.quality-wash {
  margin: 3rem 0;
}
.quality-taishin h3,
.quality-kitchen h3,
.quality-bath h3,
.quality-wash h3 {
  text-align: center;
  font-size: clamp(22px, 1.44vw, 24px);
  margin: 1.5rem 0;
  line-height: 1.4;
}
.quality-taishin p,
.quality-kitchen p,
.quality-bath p,
.quality-wash p {
  font-size: clamp(14px, 1.44vw, 18px);
  line-height: 1.8;
  font-family: var(--font-hina);
  font-weight: 400;
}

.quality-wash {
  margin-top: 0;
}

@media (max-width: 480px) {
	
    .plan-midashi-box p.catch,
    .plan-midashi-2 p.catch {
  		font-size:24px!important;
    }
    .quality-taishin h3,
    .quality-kitchen h3,
    .quality-bath h3,
    .quality-wash h3 {
      font-size:16px;
    }
	section#location .item span.lc-name {
  		font-size:16px!important;
	}
  .quality-kitchen,
  .quality-bath,
  .quality-wash {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
	
    section#quality .catch-detail h3,
    section#quality .catch-left h3,
    section#location .catch-detail h3,
    section#location .catch-left h3 {
      font-size:20px;
    }
}
.about-zeh .zeh-top {
  padding: clamp(20px, 1.4vw, 30px);
  background-color: #FFFF99;
}
.about-zeh .zeh-top .heading-zeh {
  display: flex;
  align-items: center;
  text-align: center;
  font-size: clamp(18px, 5vw + 0.5rem, 26px);
}
.about-zeh .zeh-top .heading-zeh::before {
  content: "";
  flex-grow: 1;
  height: 2px;
  background-color: var(--color-green);
  margin-right: 2.8rem;
}
.about-zeh .zeh-top .heading-zeh::after {
  content: "";
  flex-grow: 1;
  height: 2px;
  background-color: var(--color-green);
  margin-left: 2.8rem;
}
.about-zeh .zeh-top .heading-zeh {
  color: var(--color-green);
  font-weight: normal;
  margin-bottom: 1.5rem;
}
.about-zeh .zeh-top h3 {
  text-align: center;
  font-size: clamp(22px, 1.5vw, 34px);
  margin-bottom: 1.5rem;
}
.about-zeh .zeh-top p {
  font-size: clamp(16px, 1.5vw, 20px);
  font-weight: 400;
}
.about-zeh .zeh-bottom {
  padding: clamp(14px, 1.4vw, 10px);
  background-color: var(--color-green);
  color: #fff;
  text-align: center;
  font-size: clamp(16px, 1.5vw, 20px);
  line-height: 1.5;
}

.section-sub-catch {
  margin-bottom: 5rem;
}
.section-sub-catch h3 {
  text-align: center;
  font-size: clamp(21px, 4vw, 34px);
  line-height: 1.8;
  margin: 1.5rem 0;
  font-weight: 400;
}
.section-sub-catch p {
  font-size: clamp(14px, 1.5vw, 20px);
  line-height: 1.8;
  text-align: center;
}
@media (max-width: 480px) {
  .section-sub-catch p {
    text-align: left;
  }
  .section-sub-catch p br {
    display: none;
  }
}

.smart-house-banner {
  margin: 5rem 0;
}
.smart-house-banner img {
  margin-bottom: 1.5rem;
}
.smart-house-banner p {
  font-size: clamp(16px, 1.5vw, 18px);
  text-align: center;
}
@media (max-width: 480px) {
  .smart-house-banner p {
    text-align: left;
  }
}

.sma-house__link-box {
  width: 100%;
  height: auto;
}

.sma-house__link-box > a {
  display: flex;
  justify-content: center;
  width: 100%;
}

.sma-house__link-box > a > img {
  width: 50%;
  margin-bottom: 1.5rem;
}

@media (max-width: 767px) {
  .sma-house__link-box > a {
    flex-direction: column;
  }
  .sma-house__link-box > a > img {
    width: 100%;
  }
  .sma-house__link-box > a > img:first-child {
    margin-bottom: 0;
  }
}
section#location {
  background: linear-gradient(to bottom, #D8FCD8 0%, #FFFFFF 100%);
}
section#location .location {
  margin-bottom: var(--section-margin);
}
section#location .location .columns-3, section#location .location .columns-4 {
  gap: 1.5rem;
}
section#location .location-list-main {
  margin-bottom: var(--section-margin);
}
section#location .location-sub-heading {
  margin: 2rem 0;
  gap: 1.5rem;
}
section#location .location-sub-heading h3 {
  font-size: clamp(22px, 1.5vw, 34px);
  line-height: 1.8;
}
section#location .location-sub-heading p {
  font-size: clamp(14px, 1vw, 18px);
  line-height: 1.8;
}
section#location .item figure {
  margin-bottom: 0.5rem;
}
section#location .item span.lc-name {
  display: block;
  font-size: clamp(18px, 1.5vw, 22px);
  line-height: 1.4;
  font-weight: 600;
}
section#location .item span.lc-distance {
  display: block;
  font-size: clamp(14px, 1.5vw, 16px);
  line-height: 1.4;
  margin-bottom: 1rem;
  font-weight: 600;
}
section#location .item span.lc-open {
  display: block;
  font-size: clamp(14px, 1.5vw, 16px);
  line-height: 1.4;
  font-weight: 400;
}
section#location .item p {
  font-size: clamp(14px, 1.5vw, 16px);
  font-weight: 400;
}
section#location .lc-list-normal h4 {
  background-color: #fff;
  padding: 6px;
  border-bottom: 1px solid var(--color-green);
  font-size: clamp(26px, 1.5vw, 32px);
  font-weight: 600;
  color: var(--color-green);
  margin-bottom: 1rem;
}
section#location .lc-list-normal h4 span {
  font-size: clamp(18px, 1.5vw, 22px);
  font-weight: 400;
  margin-left: 0.5rem;
}
section#location .lc-list-normal {
  margin: auto;
  font-size: clamp(16px, 1.8vw, 18px);
  margin-bottom: calc(var(--section-margin) / 2);
}
section#location .lc-list-normal dl {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
section#location .lc-list-normal dl dd, section#location .lc-list-normal dl dt {
  padding: 10px;
}
section#location .lc-list-normal dl dt {
  display: flex;
  align-items: center;
  width: 50%;
  border-bottom: 1px dotted #444;
	font-size: 1.5rem;
}
section#location .lc-list-normal dl dd {
  /*display: flex;*/
  align-items: center;
  width: 50%;
  margin-left: 0;
  border-bottom: 1px dotted #444;
	  font-size: 1.25rem;
	text-align: right;
}
@media (max-width: 480px) {
  section#location .location-list-sub {
    grid-template-columns: repeat(2, 1fr);
  }
  section#location .lc-list-normal dl dt,
  section#location .lc-list-normal dl dd {
  	font-size: 1.1rem;
  }
}
section#location .mapcode {
  margin-top: 3rem;
}
section#location .mapcode .left p:not(.note-small) {
  font-size: clamp(14px, 1.55vw, 20px);
}
section#location .mapcode .right {
  background-color: #87D5AE;
  padding: 16px;
  display: flex;
  align-items: center;
}
section#location .gmap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 600px;
  margin: 3rem auto;
  background-color: var(--color-green);
  color: #fff;
  text-align: center;
  padding: 2rem 1.5rem;
  font-size: clamp(14px, 3vw, 20px);
  text-decoration: none;
}
section#location .gmap img {
  position: absolute;
  width: 60px;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
}
section#location .gmap span {
  display: flex;
  align-items: center;
  justify-content: center;
}
section#location .gmap span::before {
  content: "";
  display: inline-block;
  width: 30px;
  height: 30px;
  background-image: url(../images/googlemap_icon.gif);
  background-size: contain;
  background-repeat: no-repeat;
  transition: all 0.4 ease-in-out;
}
section#location .gmap::after {
  position: absolute;
  content: "";
  display: inline-block;
  background-image: url(../images/gmap_arrow.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 60px;
  height: 10px;
  right: 10px;
}
section#location .gmap:hover {
  background-color: #99CC99;
  color: var(--color-green);
}
section#location .gmap:hover span::before {
  background-image: url(../images/googlemap_icon_hover.gif);
}
section#location .gmap:hover img {
  filter: brightness(0) saturate(100%) invert(34%) sepia(8%) saturate(6629%) hue-rotate(111deg) brightness(97%) contrast(92%);
}
section#location .gmap:hover::after {
  background-image: url(../images/gmap_arrow_hover.png);
}

section#access {
  background: linear-gradient(to bottom, #fff 0%, #F4EEC2 100%);
}
section#access .distance {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem 8rem;
}
section#access .access-location {
  max-width: 70%;
  margin: auto auto 3rem auto;
}
section#access .access-location figure {
  margin-bottom: 1.5rem;
}
section#access .access-location .lc-name {
  display: block;
  font-size: clamp(18px, 1.5vw, 22px);
  line-height: 1.4;
  margin-bottom: 0.5rem;
  font-weight: normal;
  text-align: center;
}
@media (max-width: 767px) {
  section#access .distance {
    gap: 2rem 4rem;
  }
}
@media (max-width: 767px) {
  section#access .distance {
    gap: 2rem 2rem;
  }
}

.outline-subtitle {
  font-family: var(--font-sawarabi);
  font-size: clamp(22px, 3vw, 26px);
  text-align: center;
  margin-bottom: 1.8rem;
  line-height: 1.5;
}
.outline-subtitle span {
  display: block;
  font-size: clamp(16px, 3vw, 20px);
}

.outline-list {
  max-width: 1240px;
  margin: auto auto 2rem;
  font-size: clamp(16px, 1.8vw, 18px);
}
.outline-list + .outline-subtitle {
  margin-top: 8rem;
}
.outline-list dl {
  display: flex;
  flex-wrap: wrap;
  border-top: 1px solid var(--color-green);
  line-height: 1.4;
}
.outline-list dl dd, .outline-list dl dt {
  padding: 10px 0;
  border-bottom: 1px solid var(--color-green);
}
.outline-list dl dt {
  width: 40%;
}
.outline-list dl dd {
  margin: 0;
  width: 60%;
  padding-left: 1rem;
}
@media (max-width: 480px) {
  .outline-list.m-col-2 {
    gap: 0;
  }
  .outline-list .list-right dl {
    border-top: none;
  }
  .outline-list dl dt,
  .outline-list dl dd {
    font-size: 14px;
  }
}

@media (max-width: 480px) {
	.pc {
		display: none;
	}
}
@media (min-width: 481px) {
	.sp {
		display: none;
	}
	header h1 {
        color: #333;
        font-size: 1.5rem;
        text-align: left;
        font-family: 'Noto Serif JP', serif;
		font-weight: normal;
    }
}