:root{
  --primary:#252d28;
  --accent:#5e5e5e;
  --bg:#f3eee7;
}
*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}
html{
  font-size:16px;
  scroll-padding:50px;
}
body{
  background:var(--bg);
  color:var(--primary);
  font-family:"Noto Sans JP", sans-serif;
  font-feature-settings:"pwid";
  font-size:.875rem ;
  font-weight:400;
  line-height:1.75;
}
h1, h2, h3, h4, h5, h6{font-weight:normal}
ul, ol, li{list-style-type:none}
table{border-collapse:collapse}
a{
  color:var(--primary);
  text-decoration:none
}
img{
  height:auto;
  max-width:100%;
  transition:filter .15s;
  vertical-align:middle;
}
img[loading="lazy"]{
  background:#959788;
  filter:brightness(0);
}
img[loading="lazy"].loaded{
  background:transparent;
  filter:brightness(1) ;
}
svg{height:auto}
iframe{max-width:100%}
fieldset{border:none}
input{font-size:1rem}
.serif{
  font-family: "Ysabeau SC", "Noto Serif JP", serif;
  font-weight:400;
}
.mplus{
  font-family:"M PLUS Rounded 1c", sans-serif;
  font-weight:400;
}

.bold{font-weight:bold}

/* 配置 */
.flex{display:flex}
.flex_sm, .flex_md, .flex_lg{
  display:flex;
  flex-direction:column;
}
.flwrap{flex-wrap:wrap}
.inblo{display:inline-block}
.tal{text-align:left}
.tar{text-align:right}
.tac{text-align:center}
.center{
  margin-left:auto;
  margin-right:auto;
}
.inner-s{
  margin-left:auto;
  margin-right:auto;
  max-width:85%;
}
.inner{
  margin-left:auto;
  margin-right:auto;
  max-width:90%;
}
.inner-mid{
  margin-left:auto;
  margin-right:auto;
  max-width:95%;
}
.inner-max{
  margin-left:auto;
  margin-right:auto;
  max-width:98%;
}
@media screen and (max-width:767px){
  .none_sm{display:none}
}
@media screen and (min-width:768px){
  html{scroll-padding:70px}
  .flex_sm{flex-direction:row}
  .inner-s{
    max-width:1300px;
    padding-left:15%;
    padding-right:15%;
  }
  .inner{
    max-width:1330px;
    padding-left:8%;
    padding-right:8%;
  }
  .inner-mid{
    max-width:1330px;
    padding-left:5%;
    padding-right:5%;
  }
  .none_md{display:none}
}
@media screen and (min-width:1024px){
  .flex_lg{flex-direction:row}
  .inner{max-width:1470px}
  .inner-mid{max-width:1470px}
}

/*アクセシビリティ対応*/
.sr-only{
  border:0;
  clip-path:inset(50%);
  height:1px;
  margin:-1px;
  overflow:hidden;
  padding:0;
  position:absolute;
  width:1px;
  white-space:nowrap;
}

/* header */
.nav-toggle{
  cursor:pointer;
  font-size:.875rem ;
  height:30px;
  padding-top:24px;
  position:fixed;
  right:5%;
  text-align:center;
  top:18px;
  transition:transform .5s;
  width:40px;
  z-index:101;
}
.nav-toggle:hover{opacity:.7}
.nav-toggle span{
  background:var(--primary);
  display:block;
  height:2px;
  left:0;
  opacity:1;
  position:absolute;
  -webkit-transition:.3s ease-in-out;
  transition:.3s ease-in-out;
  width:38px;
}
.nav-toggle span:nth-child(1){top:0}
.nav-toggle span:nth-child(2){top:10px}
.nav-toggle span:nth-child(3){top:20px}
.nav-toggle.on span:nth-child(1){
  top:10px;
  transform:rotate(35deg);
}
.nav-toggle.on span:nth-child(2){opacity:0}
.nav-toggle.on span:nth-child(3){
  top:10px;
  transform:rotate(-35deg);
}
.nav-toggle.on div{opacity:0}
.header{
  font-family: "Ysabeau SC", "Noto Sans JP", serif;
  position:relative;
  z-index:1000;
}
.header .inner{position:relative}
.top-menu{
  height:0;
  justify-content:space-between;
}
.gnav{
  background:rgba(255,255,255,.95);
  height:100lvh;
  overflow-x:scroll;
  padding:70px 0 20px;
  position:fixed;
  top:-200vh;
  -webkit-transition:.5s ease-in-out;
  transition:.5s ease-in-out;
  width:100%;
}
.gnav.menu-open{top:0}
.gnav a{display:block}
.header{position:fixed}
.header .menu-open .header-logo{opacity:0}
.header-logo{
  left:5%;
  opacity:1;
  position:fixed;
  top:10px;
  transition:.5;
  z-index:101;
}
.header-logo svg{
  height:40px;
  width:auto;
}
.header-logo:hover .logo_color{fill:var(--primary)}
.header-logo .logo_color{fill:#475d50}
.gnav-wrap{gap:2em 130px}
.gnav-menu{
  flex-wrap:wrap;
  font-size:1rem;
  justify-content:space-around;
  line-height:2.6;
}
.home .gnav-scroll{background:inherit}
.gnav-scroll{
  background:var(--bg);
  display:flex;
  height:58px;
  left:0;
  position:fixed;
  top:0;
  width:100%;
  z-index:90;
}
.gnav-scroll .inner{
  align-items:center;
  justify-content:center;
}
.scroll .nav-toggle .tac{display:none}
.nav-toggle.on~.gnav-scroll{opacity:0}
.gnav-scroll.menu-open{background:inherit}
.gnav-scroll.menu-open .logo{display:none}
.gnav-scroll.menu-open ul{display:none}
.page-container{padding:60px 0}
@media (min-width:768px){
  .gnav-scroll{
    align-items:center;
    height:70px;
    justify-content:flex-end;
    margin-left:auto;
    padding-right:130px;
  }
  .gnav-scroll ul{
    align-items:center;
    gap:2rem
  }
  .gnav-scroll a:hover{color:var(--accent)}
  .gnav a:hover{color:var(--accent)}
  .gnav-sns{
    display:flex;
    justify-content:center;
    margin:44px auto 0;
    max-width:350px;
  }
  .page-container{padding:72px 0 120px}
  .header-logo svg{height:52px}
  .nav-toggle{
    padding-top:26px;
    right:40px;
    top:24px;
    width:38px;
  }
  .gnav-wrap{justify-content:flex-end}
  .gnav{
    height:100lvh;
    padding:100px 0 140px;
  }
  .gnav-menu{font-size:1.6rem}
  .gnav_btn a{
    background:var(--accent);
    color:#fff !important;
    display:block;
    padding:.5em 1em;
  }
  .gnav_btn:hover a{background:var(--primary)}
}
@media screen and (min-width:1024px){
  .gnav-scroll{padding-right:150px}
  .gnav-scroll ul{gap:3rem}
}

/*footer*/
.footer{
  background:#737373;
  color:#fff;
  line-height:2;
}
.footer a{
  color:#fff;
  transition:color .15s;
}
.footer-contact_item{
  max-width:100%;
  width:300px;
}
.footer-top{
  font-family:"Verdana", "Noto Sans JP", sans-serif;
  font-size:1.25rem;
  padding:1em 0;
}
.footer-middle{
  border-top:1px solid;
  padding:2em 0;
}
.footer-contact-wrap{margin-top:2em}
.footer-menu{font-family: "Ysabeau SC", "Noto Sans JP", serif;}
.footer-menu-wrap{margin-top:1.5em}
.footer-menu a:hover{text-decoration:underline}
.footer-bottom{
  align-items:center;
  border-top:1px solid;
  line-height:1;
  justify-content:space-between;
  padding:1.3em;
}
.footer-logo-wrap, .footer-sns-wrap{align-items:center}
.footer-logo-wrap{gap:24px}
.footer-logo-wrap svg{width:46px}
.footer-logo-wrap img{width:42px}
.footer-sns-wrap{gap:30px}
.footer-sns-wrap svg{width:26px}
.footer-bottom .logo_color{
  fill:#fff;
  transition:fill .15s;
}
.footer-bottom a:hover .logo_color{fill:#ccc}
@media screen and (max-width:767px){
  .footer-contact-wrap{
    flex-direction:column;
    gap:18px;
    align-items:center;
  }
  .footer-logo-wrap, .footer-sns-wrap{justify-content:center}
}
@media screen and (min-width:768px){
  .footer-top{font-size:1.875rem}
  .footer-contact-wrap, .footer-menu-wrap, .footer-bottom{
    gap:66px;
    justify-content:center;
  }
  .footer-menu ul{width:max-content}
  .footer-menu:first-of-type ul{margin-left:auto}
  .footer-logo-wrap{justify-content:flex-end}
  .footer-menu, .footer-logo-wrap, .footer-sns-wrap{
    max-width:100%;
    width:300px;
  }
}

/*parts*/
.hero{
  background-size:cover;
  height:240px;
  line-height:1.25;
  padding:6% 0 40px;
  position:relative;
  width:100%;
}
.hero_ttl{
  color:#fff;
  font-family: "Ysabeau SC", "Noto Sans JP", serif;
  font-size:1.25rem;
  font-weight:400;
  text-shadow:2px 2px 3px #000;
}
.ttl-wrap{
  padding-top:40px;
  padding-bottom:20px;
}
.ttl{
  font-family: "Ysabeau SC", "Noto Sans JP", serif;
  font-size:1rem;
  font-weight:600;
}
.page_ttl{
  font-family: "Ysabeau SC", "Noto Sans JP", serif;
  font-size:1.25rem;
  font-weight:400;
}
.link_brd{
  border-bottom:1px solid;
  display:inline-block;
  padding:0 10px 4px;
}
.link_brd:hover{border-color:transparent}
.btn{
  border:1px solid;
  display:inline-block;
  min-width:230px;
  padding:.7em;
  transition:.15s;
}
.btn:hover{background:var(--accent)}
.ico-arrow_r{width:30px}
.arrow_r-arr{fill:#fff}
.arrow_r-bg{fill:var(--accent)}
.ico_right{
  align-items:center;
  column-gap:30px;
  display:inline-flex;
  justify-content:center;
}
.ico_right:hover .arrow_r-bg{fill:var(--primary)}
.ico-bottm{
  display:inline-block;
  text-align:center;
}
.media-card{gap:20px}
.media-card_ttl{
  font-size:1rem;
  margin-bottom:.6em;
}
.media-card_img{
  aspect-ratio:7 / 4;
  overflow:hidden;
}
.media-card_img img{
  height:100%;
  object-fit:cover;
  width:100%;
}
.tinfo-wrap:hover .media-card_img img{filter:brightness(58%)}
.tinfo-wrap:hover .link_brd{border-color:transparent}
.text-box{line-height:1.75}
.text-box+.text-box{margin-top:4.5em}
.text-box .ttl+p{margin-top:1.5em}
.text-box p+p{margin-top:1.5em}
.list-wrap{
  display:grid;
  font-family:"Noto Sans JP", serif;
  gap:0 20px;
  grid-template-columns:max-content 1fr;
}
.list-wrap dt{grid-column:1}
.list-wrap dd{grid-column:2}
@media screen and (max-width:767px){
  .hero_ttl{
    left:5%;
    position:absolute;
    top:36%;
  }
}
@media screen and (min-width:768px){
  .hero{
    aspect-ratio:2000 / 487;
    height:auto;
  }
  .hero_ttl{font-size:1.75rem}
  .ttl-wrap{padding-bottom:30px}
  .ttl{font-size:1.25rem}
  .page_ttl{font-size:1.75rem}
  .btn{font-size:1rem}
  .media-card{gap:32px}
  .media-card_img{
    aspect-ratio:16 / 9;
    width:40%}
  .media-card_main{width:60%}
  .media-card_ttl{
    font-size:1.375rem;
    margin-bottom:1em;
  }
  .media-car p+p{margin-bottom:1.8em}
}
@media screen and (min-width:1024px){
  .media-card{gap:54px}
}

/*slick*/
.slick-dots{
  display:flex;
  justify-content:center;
  margin-top:20px;
  width:100%;
}
.slick-dots button{
  border:2px solid var(--primary);
  border-radius:50%;
  height:12px;
  margin:0 4px;
  width:12px;
  color:transparent;
  outline:none;
  background:transparent;
}
.slick-dots .slick-active button, .slick-dots button:hover{background:var(--primary)}
.slick-slider svg{
  position:absolute;
  top:calc(50% - 30px);
  translate:0 -50%;
  width:30px;
  z-index:1;
}
.slick-slider svg:first-of-type{left:2%}
.slick-slider svg:last-of-type{right:2%}
.slick-slide img{width: 100%;}

/**/
#loader{
  background-color:var(--bg);
  height:100vh;
  position:fixed;
  width:100%;
  z-index:1001;
}
#loader.loaded{animation:fadeOut 1s forwards}
@keyframes fadeOut{
  from{opacity:1}
  to{
    opacity:0;
    visibility:hidden;
    z-index:-1;
  }
}
.spinner{
  animation:spin 2.5s linear infinite;
  border:4px solid rgba(0, 0, 0, 0.1);
  border-radius:50%;
  border-top-color:#5E8B6D;
  height:40px;
  left:50%;
  position:fixed;
  top:50%;
  translate:-50% -50%;
  width:40px;
}
@keyframes spin{
  to{transform:rotate(360deg)}
}

/*top*/
.home.head-scroll{background:rgba(243,238,231,0)}
.home.head-scroll .gnav-scroll{background:rgba(243, 238, 231, 1)}
.home .header-logo .logo_color{fill:#fff}
.home .header-logo:hover .logo_color{fill:#bbb}
.home.head-scroll .header-logo .logo_color{fill:#475d50}
.home.head-scroll .header-logo:hover .logo_color{fill:var(--primary)}
.home .gnav-scroll a, .home .nav-toggle{color:#fff}
.home .gnav-scroll a:hover{color:var(--primary)}
.home .nav-toggle.on{color:var(--primary)}
.home.head-scroll .gnav-scroll a, .home.head-scroll .nav-toggle{color:var(--primary)}
.home.head-scroll .gnav-scroll a:hover{color:var(--accent)}
.home .nav-toggle span{background:#fff}
.home .nav-toggle.on span{background:var(--primary)}
.home.head-scroll .nav-toggle span{background:var(--primary)}
.hero_home{
  aspect-ratio:1000 / 920;
  background-image:url(img/top/hero_sp.webp);
  background-repeat:no-repeat;
  background-size:100% auto;
  color:#fff;
  height:auto;
  padding:0;
  position:relative;
}
.hero_home .hero_ttl{
  font-size:clamp(1.25rem, 0.611rem + 3.15vw, 2.125rem);
  font-weight:bold;
  line-height:1.5;
  text-shadow:initial;
  position:absolute;
  right:3%;
  top:100px;
}
.main-home .link_brd{
  font-size:.5625rem;
  font-weight:bold;
}
.home_ttl{
  font-family: "Ysabeau SC", "Noto Sans JP", serif;
  font-size:1.25rem;
  font-weight:600;
}
.sec-hconsept{
  font-size:1rem;
  padding:3em 0;
}
.sec-hconsept p+p{margin-top:1.5em}
.sec-hconsept .link_brd{margin-top:6em}
.sec-tinfo{
  background:#fff;
  padding:.6em 0 .8em;
}
.art-tinfo{
  margin-top:2px;
  padding:1.6em 0;
}
.art-tinfo .media-card_ttl{
  font-weight:bold;
  margin-top:.8em;
}
.sec-tplan{padding:2em 0}
.sec-tplan .home_ttl{margin-bottom:1.5em}
.sec-tplan .home_ttl span{font-size:180%}
.sec-tplan .home_ttl img{
  margin-left:.8em;
  width:180px;
}
.tplan-wrap{
  gap:20px 8%;
  margin-top:34px;
}
.tplan_img{margin-bottom:1em}
.tplan_item:hover .tplan_img img{filter:brightness(58%)}
.tplan_ttl{
  font-size:1rem;
  line-height:1.5;
}
.tplan_ttl .ico-arrow_r{
  margin-top:4px;
  width:26px;
}
.tplan_ttl:hover .arrow_r-bg, .tplan_item:hover .arrow_r-bg{fill:var(--primary)}
.sec-tmenu{padding:1em 0 3em}
.tmenu-wrap{
  display:grid;
  gap:4px;
  grid-template-columns:repeat(2, 1fr);
}
.tmenu_card{
  align-items:center;
  aspect-ratio:510 / 440;
  background-size:cover;
  background-position:50%;
  color:#fff;
  display:flex;
  flex-direction:column;
  justify-content:center;
  position:relative;
}
.tmenu_card .small{font-size:66%}
.tmenu_card img{
  left:50%;
  position:absolute;
  top:50%;
  translate:-50% -50%;
}
.tmenu_card:hover img{filter:brightness(58%)}
.tmenu_txt{
  align-content:center;
  font-size:1rem;
  font-weight:bold;
  line-height:1.3;
  min-height:4em;
  text-shadow:2px 2px 3px #000;
  z-index:1;
}
.tmenu_ico{
  display:block;
  fill:#fff;
  margin-top:9px;
  width:20px;
  visibility:hidden;
  z-index:1;
}
.tmenu_card:hover .tmenu_ico{visibility:inherit}
@media screen and (max-width:767px){
  .tplan_img{
    padding:0 12%;
    text-align:center;
  }
  .tplan_item:last-of-type .tplan_img{padding:0}
}
@media screen and (min-width:768px){
  .hero_home{
    aspect-ratio:2000 / 1500;
    background-image:url(img/top/hero_m.webp);
    height:auto;
  }
  .hero_home .hero_ttl{
    font-size:clamp(1.75rem, -1rem + 4.3vw, 3.125rem);
    font-weight:400;
    right:8%;
    top:14%;
  }
  .sec-hconsept{padding:3.4em 0 4.5em}
  .sec-tinfo{padding:2em 0}
  .art-tinfo{padding:2em 0}
  .art-tinfo .media-card_ttl{margin-top:2em}
  .sec-tplan .home_ttl img{
    margin-left:1.5em;
    vertical-align:bottom;
    width:240px;
  }
  .tplan-wrap{
    justify-content:space-between;
    margin-top:46px;
    padding-left:5%;
    padding-right:5%;
  }
  .tplan_item{
    align-items:center;
    display:flex;
    flex-basis:30%;
    flex-direction:column;
  }
  .tplan_img{
    align-items:flex-end;
    display:flex;
    flex-grow:1;
  }
  .tplan_item:nth-of-type(1) .tplan_img img{margin-bottom:14%}
  .tplan_item:nth-of-type(3) .tplan_img img{
    margin-bottom:33%;
    scale:1.4;
  }
  .tplan_ttl{font-size:1.125rem}
  .tplan_ttl .ico-arrow_r{
    margin-top:12px;
    width:30px;
  }
  .sec-tmenu{padding:4em 0}
  .tmenu-wrap{grid-template-columns:repeat(4, 1fr)}
}
@media screen and (min-width:1024px){
  .tmenu_txt{font-size:1.5rem}
  .tmenu_ico{width:26px}
}
@media screen and (min-width:1536px){
  .sec-tmenu{margin-bottom:8em}
  .tmenu-wrap{gap:20px}
}

/*plan*/
.main-plan{padding-bottom:0}
.plan-wrap{
  position:relative;
}
.sec-atelier{
  background:url(img/plan/hero-atelier.webp) no-repeat var(--accent) 0 0;
  background-size:100%;
}
.sec-hygge{
  background:url(img/plan/hero-hygge.webp) no-repeat var(--accent) 0 0;
  background-size:100%;
}
.sec-campa{
  background:url(img/plan/hero-campa.webp) no-repeat var(--accent) 0 0;
  background-size:100%;
}
.plan_ttl{
  color:#fff;
  font-family: "Ysabeau SC", "Noto Sans JP", serif;
  font-size:1rem;
  left:5%;
  padding-top:9%;
  top:0;
}
.plan_ttl h1{font-size:5vw}
.plan-card-wrap{
  background:rgba(0, 0, 0, .5);
  color:#fff;
  margin-top:clamp(5.625rem, -6.875rem + 33.33vw, 9.125rem);
  padding:36px 0;
  z-index:1;
  width:100%;
}
.plan-img-wrap{
  background:#fff;
  padding:30px 0;
}
.plan-img{position:relative}
.plan-img_item{
  margin:10px 0;
  position:relative;
}
.plan-img_item img{width:100%}
.plan_info{
  align-items:baseline;
  bottom:0;
  justify-content:space-between;
  left:0;
  line-height:1;
  padding-left:10px;
  position:absolute;
  width:100%;
}
.plan_size{font-size:1.25rem}
.sec-planmenu{
  background:#fff;
  padding-bottom:70px;
}
.plan_menu{justify-content:space-around}
@media screen and (min-width:768px){
  .plan_ttl{
    left:inherit;
    padding-top:10%;
  }
  .plan_ttl h1{font-size:clamp(1.875rem, -0.188rem + 4.3vw, 3.25rem)}
  .plan-card-wrap{margin-top:clamp(9.375rem, 1.875rem + 15.63vw, 11.875rem)}
  .plan-img-wrap{padding:60px 3% 90px;  }
  .plan-img{
    gap:5%;
    justify-content:space-evenly;
  }
  .plan_size{font-size:1.75rem}
  .plan-img_item{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    margin:0;
  }
}
@media screen and (min-width:1024px){
  .plan-card-wrap{margin-top:clamp(11.875rem, -0.625rem + 19.53vw, 15rem)}
}
@media screen and (min-width:1280px){
  .plan-card-wrap{margin-top:clamp(15rem, -17.308rem + 40.38vw, 28.125rem)}
}

/*modelhouse*/
.model-wrap{padding-bottom:5em}
.vr-wrap{
  gap:12px 1%;
  margin-top:30px
}
.vr_map{position:relative}
.vr_map img{width:100%}
.spot{
  background:url(img/mdlh/vr-spot.png) 50% 100% no-repeat;
  cursor:pointer;
  display:block;
  font-weight:bold;
  padding-bottom:28px;
  position:absolute;
  transform:translate(-50%,-50%);
  white-space:nowrap;
}
.vr_bed{left:14%; top:48%}
.vr_terrace{left:50%;top:17%}
.vr_living{left:36%;top:48%}
.vr_kitchen{left:68%;top:48%}
.vr_panorama{
  height:200px;
  width:100%;
}
.model-slick .slick-slide>div{padding:4%}
@media (min-width:768px){
  .model-wrap{
    font-size:1rem;
    padding-bottom:7em;
  }
  .vr_map{width:46%}
  .vr_panorama{
    height:auto;
    width:54%;
  }
}
@media (min-width:1024px){
  .spot{font-size:1.2rem}
  .model-slick .slick-slide>div{padding:6%}
  .model-slick svg:first-of-type{left:1%}
  .model-slick svg:last-of-type{right:1%}
}

/*flow*/
.hero_flow{
  background-image:url(img/flow/hero-flow.webp);
  background-position:80%;
}
.flow-wrap{
  counter-reset:cnt;
  line-height:1.2;
  padding:1em 0 3em;
  width:100%;
}
.flow-wrap li{
  display:grid;
  grid-template-columns:107px 1fr;
  grid-template-rows:repeat(2, max-content);
}
.flow_time{
  align-content:center;
  font-size:.625rem;
  grid-area:1 / 1 / 2 / 2;
  position:relative;
  text-align:center;
  vertical-align:middle;
  width:90px;
}
.flow_time::after{
  align-items:center;
  background:var(--bg);
  border:1px solid gray;
  border-radius:50%;
  content:counter(cnt) "";
  counter-increment:cnt;
  display:flex;
  font-family:sans-serif;
  height:17px;
  justify-content:center;
  position:absolute;
  left:98px;
  top:50%;
  translate:0 -50%;
  width:17px;
  z-index:1;
}
.flow_time.on::after{
  background:gray;
  color:#fff;
}
.flow_ttl::after{
  height:100%;
  top:30px;
}
.flow_ttl{
  align-content:center;
  font-size:.75rem;
  grid-area:1 / 2 / 2 / 3;
  padding:14px 0 14px 20px;
  position:relative;
}
.flow_ttl::before{
  content:"＋";
  position:absolute;
  right:0;
  top:50%;
  translate:0 -50%;
  transition:.15s;
}
.flow_ttl.open::before{rotate:45deg}
.flow_ttl p{
  border-bottom:1px solid var(--primary);
  padding:16px 0;
}
.flow_ttl:hover{color:var(--accent)}
.flow_txt{
  display:none;
  font-size:.6875rem;
  grid-area:2 / 2 / 3 / 3;
  padding:2px 0 4px 20px;
  position:relative;
}
.flow_ttl::after, .flow_txt::after{
  background:var(--primary);
  content:"";
  left:0;
  position:absolute;
  width:1px;
}
.flow_ttl:hover::after, .flow_txt:hover::after{background:var(--accent)}
.flow_ttl::after{top:30px}
.flow_ttl.last::after,.flow_txt.last::after{content:inherit}
.flow_txt::after{
  bottom:-30px;
  top:0;
}
.flow_btn:hover{color:#fff}
@media screen and (min-width:768px){
  .flow-wrap{padding-top:10em}
  .flow-wrap li{grid-template-columns:220px 1fr}
  .flow_time{
    font-size:1rem;
    padding:36px 0;
    width:180px;
  }
  .flow_time::before{width:2px}
  .flow_time::after{
    border-width:2px;
    font-size:1.75rem;
    height:50px;
    left:194px;
    width:50px;
  }
  .flow_ttl{
    font-size:1.25rem;
    padding:20px 0 20px 20px;
  }
  .flow_ttl::after{top:40px}
  .flow_ttl p{margin-left:40px}
  .flow_txt{
    font-size:1rem;
    line-height:1.75;
    padding:16px 0 10px 60px;
  }
  .flow_txt::after{bottom:-50px}
}

/*concept*/
.hero_concept{
  background-image:url(img/concept/hero-concept.webp);
  background-position:50%;
}
.concept-wrap{padding-top:3em}
.concept-btn{margin-top:100px}
.concept-btn a:hover .ico{background:var(--primary)}
@media screen and (min-width:768px){
  .concept-wrap{padding-top:6em}
  .concept-wrap .text-box{font-size:1rem}
}

/*about us*/
.hero_aboutus{
  background-image:url(img/aboutus/hero-aboutus_sp.webp);
  background-position:80% 84%;
}
.sec-aboutus{padding-top:3em}
.aboutus-wrap{
  line-height:2;
  margin-bottom:4em;
}
.aboutus_ttl{
  font-family: "Ysabeau SC", "Noto Sans JP", serif;
  font-size:1rem;
  font-weight:600;
  margin-bottom:1.5em;
}
.aboutus-wrap p+p{margin-top:2em}
.profile-wrap{margin-top:40px}
.about_ttl{
  align-items:baseline;
  border-bottom:1px solid;
  justify-content:center;
  margin-bottom:10px;
}
.about_ttl h2{font-size:1rem}
.about_ttl p{margin-left:1em}
.prof-sec .list-wrap{margin-top:10px}
.prof-ml{height:.875rem}
.history-sec{margin-top:30px}
.aboutus_btn{margin-top:50px}
.aboutus_btn .btn:hover{color:#fff}
@media screen and (min-width:768px){
  .hero_aboutus{background-image:url(img/aboutus/hero-aboutus.webp)}
  .aboutus-wrap{
    margin-bottom:5em;
    text-align:center;
  }
  .aboutus_ttl{
    font-size:1.25rem;
    margin-bottom:2em
  }
  .aboutus-slick .slick-dots{margin-top:30px}
  .aboutus-slick .slick-slide>div{padding:3%}
}
@media screen and (min-width:1024px){
  .profile-wrap{
    align-items:first baseline;
    justify-content:space-between;
    margin-top:70px;
    position:relative;
  }
  .profile-wrap::before{
    background:var(--primary);
    bottom:0;
    content:"";
    height:85%;
    left:50%;
    position:absolute;
    translate:-50% 0;
    width:1px;
  }
  .about_ttl{margin-bottom:0}
  .about_ttl h2{font-size:1.25rem}
  .prof_company{margin-top:1em}
  .history-sec .list-wrap{
    line-height:2.16;
    margin-top:0.8em;
  }
  .prof-sec, .history-sec{width:45%}
}
@media screen and (min-width:1280px){
  .aboutus-slick svg:first-of-type{left:5%}
  .aboutus-slick svg:last-of-type{right:5%}

}

/*location*/
.location-wrap{
  gap:20px;
  line-height:1.75;
}
.location_ttl{margin-bottom:1.5em}
.location_txt{margin-bottom:3em}
.location_txt p+p{margin-top:1.5em}
.location_access{margin-bottom:3em}
@media screen and (min-width:768px){
  .location-wrap{
    display:grid;
    grid-template-columns:55% 45%;
    grid-template-rows:repeat(3, max-content);
    grid-column-gap:50px;
  }
  .location_ttl{
    grid-area:1 / 1 / 2 / 2;
    margin-bottom:1em;
  }
  .location_txt{
    font-size:1rem;
    grid-area:2 / 1 / 3 / 2;
    margin-bottom:2em;
  }
  .location_access{
    grid-area:1 / 2 / 3 / 3;
    margin-bottom:2em;
  }
}

/*QA*/
.qa-wrap{margin-top:2em}
.qa-box+.qa-box{margin-top:4.5em}
.qa_item{position:relative}
.item_q{border-bottom:1px dashed var(--accent)}
.item_q h3{
  font-size:1rem;
  font-weight:600;
}
.item_q h3, .item_a p{margin:6px 0 18px 10px}
.q, .a{font-size:1.375rem}
@media screen and (max-width:767px){
  .a{
    display:block;
    position:relative;
    width:100%;
  }
  .a::before{
    content:"＞";
    font-size:1rem;
    position:absolute;
    right:0;
    rotate:90deg;
    translate:0 -50%;
    top:50%;
  }
  .a.open::before{rotate:-90deg}
  .answer-hidden{display:none}
}
@media (min-width:768px){
  .qa-wrap{margin-top:4em}
  .qa-box{
    border-radius:6px;
    font-size:1rem;
    padding:0 20px;
  }
  .item_q h3, .qa_item{
    align-items:flex-start;
    display:flex;
    padding:0 20px 0 0px;
  }
  .item_q h3{font-size:1.25rem}
  .q, .a{
    font-size:2rem;
    line-height:1;
    padding-right:24px;
  }
  .qa_item{padding:1em 20px}
  .item_q h3, .item_a p{margin:0}
  .toggle-arrow{display:none}
}

/***ArchiveCategory***/
.narrow-cat{
  line-height:1;
  gap:16px;
  padding:18px 0;
}
.narrow-cat+.narrow-cat{border-top:1px dashed var(--accent)}
.narrow-cat a{display:block}
.narrow-cat_ttl{
  font-family: "Ysabeau SC", "Noto Sans JP", serif;
  font-size:.75rem
}
.narrow-cat_tag{
  font-size:.725rem;
  gap:10px 16px;
  width:100%;
}
.narrow-cat_tag a{
  background:#fff;
  border:1px solid var(--accent);
  color:var(--accent);
  display:block;
  padding:1px 20px 3px;
  transition:.15s;
}
.narrow-cat_tag .current a, .narrow-cat_tag a:hover{
  background:var(--accent);
  color:#fff;
}
.narrow_key a{border-radius:16px}
@media (min-width:768px){
  .cat-wrap{margin-top:20px}
  .narrow-cat{padding:8px 0}
  .narrow-cat_ttl{
    font-size:1rem;
    width:124px;
  }
  .narrow-cat_tag{gap:10px}
}

/*post*/
.post-wrap{gap:5% 100px;
  padding:0 16px 2em
}
.post-body{margin-top:96px}
.post_ttl{
  font-size:1.5rem;
  font-weight:bold;
  line-height:1.55;
  margin-top:2.5em;
}
.post-main h2{
  border-top:2px solid var(--primary);
  border-bottom:2px solid var(--primary);
  color:var(--primary);
  font-size:1.3125rem;
  line-height:1.5;
  margin:1.7em 0;
  padding:.75em 0;
  position:relative;
}
.post-main h3{
  background:rgba(94, 139, 109, .07);
  border-bottom:3px solid #5E8B6D;
  color:var(--primary);
  font-size:1rem;
  margin:2.2em 0 1.8em;
  padding:.6em .7em .5em;
}
.post-main h4{
  position:relative;
  color:var(--primary);
  font-size:.875rem;
  padding-left:1.5em;
  margin:2.5em 0;
  line-height:.7em;
}
.post-main h4:before{
  content:url(img/ico-arrow.svg);
  height:16px;
  left:0;
  position:absolute;
  top:-3px;
  width:16px;
}
.post-main p+p, .post-main iframe+p{margin-top:2em}
.post-main p+.gallery, .post-main .gallery+p{margin-top:.63em}
.post-main p+iframe{margin-top:1.4em !important}
.post-main .gallery+p{margin-top:1em}
.post-main p br{margin-bottom:.5em}
.post-main a{display:inline-block}
.post-main a:has(img){display:block;}
.post-main .alignleft{
  display:block;
  margin-right:auto;
}
.post-main .aligncenter{
  display:block;
  margin-left:auto;
  margin-right:auto;
}
.post-main .alignright{
  display:block;
  margin-left:auto;
}
.sec-post{line-height:2}
.sec-post a:hover{text-decoration:underline}
.post-main p+table{margin-top:1em}
.post-main table, .post-main td{border:1px solid}
.post-main td{
  line-height:1.25;
  padding:1em;
}
.post-main .box{
  background:#dcdcdc;
  border-radius:8px;
  margin-top:1.5em;
  padding:1em;
  width:100%;
}
.post-main .sns{margin-top:3em}
.post-main .sns svg{width:26px}
.gallery{
  display:flex;
  flex-wrap:wrap;
  gap:10px 2%;
  justify-content:center;
}
.gallery a{display:block}
.gallery img{width:100%}
.gallery+.gallery{margin-top:10px}
.gallery-item{text-align:center}
.gallery-columns-1 .gallery-item{width:100%}
.gallery-columns-2 .gallery-item,.gallery-columns-4 .gallery-item,.gallery-columns-7 .gallery-item,.gallery-columns-8 .gallery-item{width:calc((100% - 2%) / 2)}
.gallery-columns-3 .gallery-item,.gallery-columns-5 .gallery-item,.gallery-columns-6 .gallery-item,.gallery-columns-9 .gallery-item{width:calc((100% - 4%) / 3)}
.wp-caption{max-width:100%;}
.post-head, .post-foot{
  align-items:center;
  gap:4px;
}
.post-head{
  border-bottom:1px solid var(--accent);
  font-size:.875rem;
  padding:1em 0;
}
.post-foot {font-size: .75rem;}
.post-info{
  border-bottom:1px solid var(--accent);
  gap:10px;
  padding:10px 0;
}
.post_cat{
  font-weight:bold;
  gap:.5em;
}
.post_cat a{text-decoration:underline}
.post_cat a:hover{text-decoration:none}
.post_key{
  font-size:.75rem;
  gap:10px;
  margin-left:auto;
}
.post-foot{
  border-bottom:1px solid var(--accent);
  border-top:1px solid var(--accent);
  margin-top:86px;
  padding:10px 0;
}
.post-foot .post_cat{margin-left:auto}
.post-foot .post_key{width:100%}
.sns{
  gap:30px;
  justify-content:center;
}
.sns .logo_color{
  fill:var(--accent);
  transition:.15s;
}
.sns a:hover .logo_color{fill:var(--primary)}
.pager{
  align-items:flex-end;
  padding-top:40px;
}
.page_btn:hover{color:#fff}
.post-aside{
  margin-top:236px;
  width:100%;
}
.post-aside h2{
  border-bottom:1px solid var(--accent);
  font-family: "Ysabeau SC", "Noto Sans JP", serif;
  font-size:1rem;
}
.post-aside h3{
  font-size:1rem;
  font-weight:600;
}
.aside-post a{margin:22px 0 24px;}
.aside-post-img{
  flex:none;
  margin-right:10px;
}
.aside-post-img img{
  background:#fff;
  height:50px;
  object-fit:cover;
  width:50px
}
.aside-post a:hover .aside-post-img img{filter:brightness(58%)}
.aside-arc{
  font-size:1rem;
  line-height:2;
}
.post-aside ul a:hover{color:var(--accent)}
#toc_container{margin-bottom:50px !important;}
@media (min-width:768px){
  .post-info{padding:5px 0}
  .post-info .time{margin-right:32px}
  .aside-post a{margin:26px 0}
  .gallery{gap:16px 2%}
  .gallery-columns-4 .gallery-item{width:calc((100% - 6%) / 4)}
  .gallery-columns-5 .gallery-item{width:calc((100% - 8%) / 5)}
  .gallery-columns-6 .gallery-item{width:calc((100% - 10%) / 6)}
  .gallery-columns-7 .gallery-item{width:calc((100% - 12%) / 7)}
  .gallery-columns-8 .gallery-item{width:calc((100% - 14%) / 8)}
  .gallery-columns-9 .gallery-item{width:calc((100% - 16%) / 9)}
  .gallery+.gallery{margin-top:16px}
}
@media (min-width:1024px){
  .main-post{width:720px;}
  .post-wrap{
    margin:auto;
    max-width:100%;
    padding:0 30px 0 50px;
    width:1260px;
  }
  .post-body{margin-top:118px}
  .post_ttl{
    font-size:2.25rem;
    margin-top:.725em;
  }
  .post-aside{
    margin-top:1.2em;
    width:280px
  }
  .post-main h2{font-size:1.5rem;}
  .post-main h3{font-size:1.1875rem;}
  .post-main h3{font-size:1rem;}
  .pager{padding-top:5.5em}
  .pager>div{flex-basis:130px}
}
@media screen and (min-width:1080px){
  .post-wrap{padding:0 20px 0 40px;}
  #toc_container{margin-bottom:80px !important;}
}
/*pagination*/
.arc-pagination{
  align-items:center;
  gap:1.5em;
  justify-content:center;
  margin-top:3em;
}
.page-numbers{
  color:var(--accent);
  font-weight:bold;
  transition:.15s;
}
a.page-numbers:hover{color:var(--primary)}
.next-wrap{margin-left:auto}
.prev-wrap{margin-right:auto}
.prev-warp, .next-wrap{width:26px}
.ico-prev, .ico-next{
  display:block;
  width:26px;
}
.prev-brd, .prev-arr, .next-brd, .next-bg,
.prev-wrap:hover .prev-bg, .next-wrap:hover .next-arr{fill:var(--accent)}
.next-arr, .prev-wrap:hover .prev-arr{fill:#fff}
.prev-bg, .next-wrap:hover .next-bg{fill:transparent}

.page-numbers.current{color:var(--primary)}
.page-link, .page-item.current{border-radius:4px}
.page-link{
  height:48px;
  width:48px;
}
.page-prev{margin-right:auto}
.page-next{margin-left:auto}
.page-prev a, .page-next a{
  display:block;
  font-size:.75rem;
  height:20px;
  line-height:16px;
  width:clamp(4.375rem, 2.112rem + 9.79vw, 8.375rem);
}
.page_btn{min-width:clamp(8.125rem, 6.357rem + 7.65vw, 11.25rem)}
.page-prev a{
  background:url(img/ico-before.png) no-repeat 0 100%;
  text-align:right
}
.page-next a{background:url(img/ico-next.png) no-repeat 100% 100%}
.page-prev a:hover, .page-next a:hover{color:var(--accent)}
@media (max-width:1023px){
  .page-number{
    margin-top:40px;
    width:100%;
  }
  .page-numbers.dots{margin:0 -1em}
}
@media (min-width:1024px){
  .arc-pagination{margin-top:6em}
  .page-number{
    column-gap:30px;
    font-size:1.6rem
  }
  .page-prev a, .page-next a{
    font-size:1.125rem;
    line-height:12px;
    width:120px;
  }
  .page_btn{min-width:180px}
  .prev-warp, .next-wrap{width:30px}
  .ico-prev, .ico-next{width:30px}
  .next-wrap{margin-left:50px}
  .prev-wrap{margin-right:50px}
}
@media (min-width:1280px){
  .page-prev a, .page-next a{width:134px;}
  .page_btn{min-width:230px}
}

/*BLOG-archive*/
.blog-body{
  display:grid;
  gap:20px;
  grid-template-columns:repeat(2, 1fr);
  margin-top:36px;
}
.art-blog{
  aspect-ratio:250 / 320;
  background-position:50%;
  background-size:cover;
  position:relative;
}
.art-blog a{
  display:block;
  height:100%;
}
.art-blog_img{
  object-fit:cover;
  height:100%;
  left:50%;
  position:absolute;
  top:50%;
  translate:-50% -50%;
  width:100%;
}
.art-blog a:hover img{filter:brightness(58%)}
.art-blog_date{
  border-bottom:1px solid;
  padding-bottom:3px;
}
.art-blog-content{
  background:rgba(0, 0, 0, .65);
  bottom:0;
  color:#fff;
  display:flex;
  flex-direction:column;
  font-size:.75rem;
  left:0;
  line-height:1.4;
  min-height:34%;
  justify-content:center;
  padding:10px 16px;
  position:absolute;
  text-align:center;
  width:100%;
}
.art-blog_ttl{
  font-size:inherit;
  margin-top:3px;
}
@media (min-width:768px){
  .blog-body{
    gap:40px;
    grid-template-columns:repeat(4, 1fr);
    margin-top:80px;
  }
}
@media (min-width:1280px){
  .blog-body{
    gap:56px;
    grid-template-columns:repeat(5, 1fr);  }
}
/*BLOG-article*/
.aside-blog-cat{
  line-height:1.9;
  margin:16px 0 52px;
}
.aside-blog-key{
  flex-wrap:wrap;
  gap:6px 10px;
  margin:20px 0 52px;
}
.aside-blog-post{
  font-size:.75rem;
  line-height:1.5;
  margin:22px 0 56px;
}
.aside-blog-arc{margin-top:12px;}
@media screen and (min-width:1024px){
  .column-card{gap:20px 60px}
  .aside-blog-cat{
    font-size:1rem;
    margin:14px 0 54px;
  }
  .aside-blog-key{
    gap:4px 10px;
    margin-bottom:56px;
  }
  .aside-blog-post{margin:26px 0 46px}
}

/*COLUMN-archive*/
.column-body{margin-top:36px}
@media screen and (min-width:768px){
  .column-body{margin-top:80px}
}
/*COLUMN-article*/
.column-card{gap:20px}
.column-card+.column-card{margin-top:40px}
.column-card_link{
  display:block;
  width:100%;
}
.column-card_link+.column-card_link{margin-top:40px}
.column-card_img{
  aspect-ratio:16 / 9;
  filter:drop-shadow(4px 4px 4px var(--accent));
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
  overflow:hidden;
  width:100%;
}
.column-card_img img{
  height:100%;
  object-fit:cover;
  width:100%;
}
.column-card_link:hover .column-card_img img{filter:brightness(58%)}
.column-card_ttl{
  font-size:1rem;
  line-height:1.5;
}
.aside-column-cat{
  font-size:1.3125rem;
  line-height:2.1;
  margin:20px 0 108px;
}
.aside-column-key{
  font-size:.75rem;
  flex-wrap:wrap;
  gap:10px 20px;
  margin:22px 0 144px;
}
.aside-column-post{
  font-size:.75rem;
  line-height:1.5;
  margin:26px 0 114px;
}
.aside-column-arc{margin-top:12px;}
@media screen and (min-width:768px){
  .column-card{gap:20px 40px}
  .column-card_ttl{font-size:1.25rem}
  .column-card_txt{
    font-size:1rem;
    margin-top:1em
  }
  .column-card_img{
    height:150px;
    width:236px;
  }
  .column-card-content{width:calc(100% - 260px)}
}
@media screen and (min-width:1024px){
  .column-card{gap:20px 60px}
  .aside-column-key{margin-bottom:116px;}
  .aside-column-arc{margin-top:14px;}
  .aside-column-post{margin-bottom:166px}
}

/*tax-archive*/
.tax_ttl{
  font-size:1.125rem;
  margin-top:1.5em;
}
.tax-body{margin-top:24px}
@media screen and (min-width:768px){
  .tax_ttl{
    font-size:1.5rem;
    margin-top:2.5em;
  }
  .tax-body{margin-top:34px}
}

/*contact*/
.contact_txt{margin-bottom:3em}
.form-step{
  justify-content:space-between;
  position:relative;
}
.form-step::before{
  background:var(--accent);
  content:"";
  height:2px;
  left:50%;
  position:absolute;
  top:13px;
  transform:translateX(-50%);
  width:calc(100% - 36px);
}
.form-step li{
  padding-top:40px;
  position:relative;
  text-align:center;
}
.form-step li::before{
  background:var(--accent);
  border-radius:50%;
  content:"";
  height:28px;
  left:50%;
  position:absolute;
  top:0;
  transform:translateX(-50%);
  width:28px;
  z-index:1;
}
.form-step li.on::after{
  background:var(--bg);
  border-radius:50%;
  content:"";
  height:14px;
  left:50%;
  position:absolute;
  top:7px;
  transform:translateX(-50%);
  width:14px;
  z-index:1;
}
.form-wrap{margin-top:3em}
.form_box+.form_box{margin-top:1.7em}
.req, .any, .form_box label, .form_box legend{font-weight:bold}
.req::before, .any::before{
  color:#fff;
  display:inline-block;
  font-size:.75rem;
  margin-right:.8em;
  padding:0 8px 2px;
  text-align:center;
}
.req::before{
  background:#252D28;
  content:"\5FC5\9808";
}
.any::before{
  background:#bbb;
  content:"\4EFB\610F";
}
.form_item{
  gap:0.4em 1em;
  margin-top:.6em;
}
.form_item input,.form_item textarea{
  border:1px solid var(--accent);
  padding:6px 12px;
}
.form_item select{
  background:#fff;
  border:1px solid var(--accent);
  padding:6px 12px;
}
input[type="checkbox"]{margin-right:.5em}
.input_s{width:200px}
.input_l{width:100%}
.check_txt{
  background:#fff;
  border:1px solid var(--accent);
  height:150px;
  margin:1em 0;
  overflow-y:scroll;
  padding:6px 12px;
  width:100%;
}
.btn-wrap_form{
  align-items:center;
  gap:20px;
  margin-top:28px;
  justify-content:center;
}
.btn_next{
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
}
.btn_next:hover, .btn_prev:hover{
  background:var(--primary);
  border-color:var(--primary);
}
.btn_prev{background:#fff}
.btn_prev:hover{color:#fff}
.thanks-wrap{margin-top:5em}
.thanks_ttl{font-size:1.125rem}
.thanks_txt{margin-top:1em}
.thanks_btn{margin-top:8em}
.screen-reader-response, .wpcf7-spinner{display:none}
.wpcf7-not-valid-tip{color:#f00}
.wpcf7-list-item{margin-left:0}
.wpcf7-list-item+.wpcf7-list-item{margin-left:1em}
@media screen and (min-width:768px){
  .contact-wrap{padding-top:3em}
  .contact_txt{margin-bottom:7em}
  .form-wrap{margin-top:7em}
  .form_box+.form_box{margin-top:5em}
  .form_item{
    align-items:center;
    margin-top:1em;
  }
  .btn-wrap_form{
    gap:60px;
    margin-top:70px;
  }
  .thanks_ttl{font-size:1.25rem}
}

/*404*/
.notfound-wrap{padding-top:3em}
.notfound_btn{margin-top:5em}
@media screen and (min-width:768px){
  .notfound-wrap{padding-top:6em}
  .notfound_btn{margin-top:9em}
}