@charset "UTF-8";

/*
Theme Name: シンプルハウス
Theme URI: https://simpled-xh.com
Description: シンプルハウス WordPress Theme
Author: シンプルハウス
Version: 2025_09
Tested up to: 6.8
Requires PHP: 8.3.0
*/

/* basic style setting in utility.css */

/* 変数 */
:root {
  --main_color: #5B4945;
  --bg_color: #E6E5E2;
  --bg_sub_color: #EBEEEF;
}



/*---------------------------------------------------------------------
 共通レイアウト
---------------------------------------------------------------------*/
/* レイアウト */
#main {
width: 100%; background: white;
} /* #main */

/* 共通 */
.inner {width: min(1130px, 100%); margin: auto; padding: 0 20px}
hgroup {
  margin-bottom: 130px;
  h2 {font-size: clamp(2.4rem, 2.033rem + 1.57vw, 3.6rem); text-align: center; line-height: 1; margin-bottom: 20px; letter-spacing: .3em}
  p {font-size: 1.4rem ;margin-bottom: 0; font-weight: 700; text-align: center;}
  p span {margin-left: -1%}
}

.view_more {}
.more_see {margin-bottom: 0}

/* ヘッダーまわり */
header {
  position: sticky; top:0; width: 100%; z-index: 100; background: rgba(255, 255, 255, 0.90);
  .inner {width: min(100%); display: flex; justify-content: space-between; flex-wrap: wrap; align-items: flex-end; padding: 43px 80px 10px 20px; border-bottom: 1px solid #f1f1f1; gap:0; transition: .5s;}
  .title_appeal {display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: center}
  .title_appeal .appeal {width: 80px}
  .site_title {line-height: 1; width: 260px}
  .site_nav_pc ul {display: flex; justify-content: flex-end; gap: 15px}
  .site_nav_pc ul li {line-height: 1.6; font-size: 1.3rem}
  .header_wrap.change_padding {padding-top: 10px}
  .button_container.change_top {top: 26px}
  
  /* current（投稿ページにcurrentには、utility.js にて current-menu-item 付与を指定） */
  .current-menu-item a,
  .current-page-ancestor a {border-bottom: 1px solid var(--main_color); padding-bottom: 1px}
  
  /* current 以外の設定 WordPress のメニュー名を入れる */
  #menu-simpled li { position: relative}
  #menu-simpled li:not(.current-menu-item) a::after {position: absolute; bottom: -1px; left: 0; content: ''; width: 100%; height: 1px; background: var(--main_color);transform: scale(0, 1); transform-origin: left top; transition: transform .3s;}
  #menu-simpled li:not(.current-menu-item) a:hover::after {transform: scale(1, 1);}
  #menu-simpled .sub-menu li a::after {height: 0}
} /* header */

/* 来場予約・資料請求 */
.appeal_btn {
  position: absolute; bottom: 5%; right: 0; z-index: 20;
  li {margin-bottom: 25px;}
  li label:hover,
  li a:hover {opacity: .9}
}

/* NEW マーク */
.new_mark {width: 30px; height: 30px; background: url(img/common/bg_new.svg) no-repeat;} 

/* 一覧のスタイル：ブロック */
.post_line {
  margin-bottom: 80px;
  .inner {width: min(1280px, 100%); }
  .post_line_wrap {gap: 40px}
  article {position: relative;}
  article dt {text-align: center; margin-bottom: 15px}
  article dd h3 {font-size: clamp(1.8rem, 1.6rem + 1vw, 2.6rem); line-height: 1.4; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;} /* 2行目以降は「…」で省略 親の定義 */
  article dd.category_list ul {gap:5px 10px}
  article dd.category_list li {pointer-events:none; margin-right: 5px}
  article dd.tag_list li {pointer-events:none; margin: 0 5px}
  article .new_mark {position: absolute; top: -10px; right: -10px;} /* NEW マーク位置調整 */
} /* .post_line */

#event.post_line {
  .post_line_wrap {gap: 30px 50px}
  dl {display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px;}
  dt {margin-bottom: 0}
  dt:hover {opacity: .6}
  dt img {width: 100%; aspect-ratio: 1/1; object-fit: cover;}
  dd {display: flex; flex-direction: column; justify-content: space-between; height: 100%;}
  dd .info {display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 16px}
  dd .info li {background: white; page: 10px; text-align: center; font-size: 1rem; font-weight: 700}
  dd .note {font-size: 1.2rem; margin-bottom: 16px}
  dd h3 {font-size: 1.5rem; margin-bottom: 24px;}
  dd .lead {font-size: 1.2rem; margin-bottom: 24px; line-height: 1.6}
  dd .detail li {font-size: 1.2rem; margin-bottom: 6px; line-height: 1.2}
}

/* 一覧のスタイル：水平 */
.post_line_horizontal {
  .inner {width: min(1280px, 100%)}
  article:first-of-type a {border-top: 1px solid #707070;} 
  article a {display: block; border-bottom: 1px solid #707070; padding: 50px 0 40px}
  article a:hover {opacity: .8}
  article dl {display: grid; grid-template-columns: 1fr; align-items: center; gap: 5px 30px}
  article dt {font-size: clamp(1.6rem, 1.478rem + 0.52vw, 2rem)}
  article dd {display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: center}
  article dd .cat_name {border: 1px solid #707070; padding: 5px 10px; font-size: 1.4rem; line-height: 1; text-transform: uppercase}
  article dd h3 {line-height: 1.4; font-size: clamp(1.6rem, 1.478rem + 0.52vw, 2rem)}
  article .new_mark {position: absolute; top: 40%; right: 10px;} /* NEW マーク位置調整 */
} /* .post_line_horizontal */

/* Gmap、YouTubeなどコンテンツのレスポンシブ */
iframe.respo {aspect-ratio: 16 / 9; width: 100%; height: 100%; margin-bottom: 50px}

/* Loading */
#loading {position: fixed; width: 100%; height: 100%; z-index: 999; background: var(--bg_color);}
#loading_logo {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.fadeUp {animation-name: fadeUpAnime; animation-duration:0.5s; animation-fill-mode:forwards; opacity: 0;}
@keyframes fadeUpAnime{
  from {opacity: 0;transform: translateY(10px);}
  to {opacity: 1; transform: translateY(0);}
}


/*---------------------------------------------------------------------
 トップページ
---------------------------------------------------------------------*/
.home {
  header {position: fixed}

  #slide {
    .inner {width: min(100%); }
    .swiper-hero {overflow: hidden; position: relative}
    .swiper-slide {text-align: center}
    .swiper-pagination-bullet { opacity: 1; background: white}
    .swiper-pagination-bullet-active { background: var(--main_color); opacity: 1}
    .swiper-button-prev:after, .swiper-button-next:after { color: var(--main_color)}
    .appeal {margin-bottom: 0; max-width: 680px; position: absolute; bottom: 60px; left: 80px; z-index: 20}
  } /* #slide */

  #event {
    hgroup {margin-bottom: 50px}
    background: var(--bg_color); padding: 240px 0 200px;
    .post_line_wrap {margin-bottom: 70px}
    .in_site_link {text-align: center}
    .to_lp a:hover {opacity: .8}
  } /* #event */

  .concept_before {
    position: sticky; top: 0; z-index: 5;
  } /* .concept_before */

  #concept {
    position: relative; z-index: 10; background: white; padding: 140px 0 100px;
    .inside {margin-left: auto; width:88%;}
    .wrap {display: grid; grid-template-columns: 40% 1fr; gap: 30px 60px;}
    .text {position: relative; }
    .text h3 {margin-bottom: 100px}
    .text p {line-height: 3}
    .in_site_link {position: absolute; bottom: 0; right: 0;}
  } /* #concept */

  #features {
    position: relative; z-index: 10; background: var(--bg_sub_color); padding: 120px 0 140px;
    h2 {text-align: center; margin-bottom: 120px}
    .wrap {margin-bottom: 80px; gap: 60px 76px}
    .wrap dt {margin-bottom: 40px; text-align: center}
    .wrap dt:hover {opacity: .7}
    .wrap dd .in_site_link_point {text-align: center; background: white}
    .in_site_link {text-align: center}
  } /* #features */
  
  #lineup {
    position: relative; z-index: 10; background: var(--bg_color); padding: 250px 0 200px;
    .inner {gap:40px 140px}
    dl {display: flex; flex-direction: column; }
    dt {margin-bottom: 46px}
    dt a:hover {opacity: .8}
    dd .name {margin-bottom: 46px}
    dd .type {margin-bottom: 38px; text-align: center}
    .in_site_link {margin-top: auto}
  } /* #lineup */
  
  #works {
    position: relative; z-index: 10; background: var(--bg_color); padding-bottom: 300px;
    h2 {font-size: clamp(3.6rem, 2.253rem + 5.75vw, 8rem); letter-spacing: .28em; color: rgba(91, 73, 69, 0.5); line-height: .9}
    .swiper-works {overflow: hidden; position: relative}
    .swiper-slide {text-align: center}
    .swiper-slide img {width: 100%; aspect-ratio: 2/1; object-fit: cover;}
    .swiper-pagination-bullet { opacity: 1; background: white}
    .swiper-pagination-bullet-active { background: var(--main_color); opacity: 1}
    .swiper-button-prev:after, .swiper-button-next:after { color: var(--main_color)}
    .cover {position: absolute; top: 0; left: 0; z-index: 20; background: rgba(255, 255, 255, 0.6); height: 100%; width: 25%; display: grid; place-items: center;}
    .cover h3 {font-size: clamp(2.8rem, 2.555rem + 1.04vw, 3.6rem); margin-bottom: 18px}
    .cover .in_site_link {text-align: center}
    .copy {position: absolute; bottom: 30px ; right: 60px; margin-bottom: 0; font-size: clamp(2.1rem, 1.824rem + 1.18vw, 3rem); color: white; z-index: 20;text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);} 
    
  } /* #works */
  
  .chunks {
    position: relative; z-index: 10; background: var(--bg_color);
    .inside {margin-left: auto; max-width:1400px; padding-left: 20px}
    h2 {font-size: clamp(2.6rem, 2.294rem + 1.31vw, 3.6rem); letter-spacing: .14em; display: flex; align-items: center; width: 100%; margin-bottom: 120px;}
    h2::after {content: ""; flex-grow: 1; height: 1px;  background-color: var(--main_color); margin-left: 20px; /* 必要に応じて調整 */}
    .inside_wrap {max-width: 1100px; margin: auto}
  } /* .chunks */

  #design_studio {
    position: relative; z-index: 10; margin-bottom: 300px;
    dl {align-items: center; gap: 20px 50px; padding-right: 20px; position: relative;} 
    dt a:hover {opacity: .7}
    dd .logo {margin-bottom: 30px}
    dd .name {font-weight: 700; font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem)}
    dd .in_site_link {position: absolute; bottom: 0; right: 20px;}
  } /* #design_studio */
  
  #model_house {
    position: relative; z-index: 10; margin-bottom: 300px;
    dl {align-items: center; gap: 20px 50px; padding-right: 20px; position: relative;}
    dt a:hover {opacity: .7}
    dd .logo {margin-bottom: 40px}
    dd .name {font-weight: 700; font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem)}
    dd .in_site_link {position: absolute; bottom: 0; right: 20px;}
  } /* #model_house */
  
  #sns {
    position: relative; z-index: 10; margin-bottom: 260px;
    h2 {margin-bottom: 170px}
    .instagram {margin-bottom: 100px; padding-right: 20px}
    .instagram dl {margin-bottom: 80px}
    .instagram dt {text-align: center; margin-bottom: 14px}
    .instagram dd {text-align: center; font-size: 2rem; font-weight: 700}
    .instagram .feed {margin-bottom: 50px}
    .instagram .link {text-align: center; margin-bottom: 0}
    .instagram .link a { color: white; padding: 10px 30px; background: #ADA4A2; width: 220px; line-height: 1; display: inline-block}
    .instagram #sb_instagram .sbi_photo img {width: 100%; aspect-ratio: 4/5 !important; object-fit: cover;}
    .in_site_link {text-align: center}
  } /* #sns */
  
  #catalog {
    position: relative; z-index: 10; padding-bottom: 200px;
    dl {grid-template-columns: 1fr 40%; gap: 30px 40px; align-items: center; margin-bottom: 100px; padding-right: 20px}
    dt {order: 2}
    dd {order: 1}
    dd h3 {margin-bottom: 70px}
    dd p {line-height: 3}
    .in_site_link {text-align: center}
  } /* #catalog */
  
  #land {
    position: relative; z-index: 10; background: white; padding: 140px 0;
    .inner {width: min(1240px, 100%); display: grid; grid-template-columns: 1fr 65%; gap: 20px 60px; align-items:  flex-end;}
    h2 {margin-bottom: 20px}
    .in_site_link {text-align: left}
  } /* #land */

  #news {
    position: relative; z-index: 10; background: var(--bg_color); padding: 240px 0 160px; 
    hgroup {margin-bottom: 70px}
    .post_line_wrap {margin-bottom: 60px}
    .in_site_link {text-align: center}
  } /* #land */
  
  #contact {
    position: relative; z-index: 10; background: var(--bg_color); padding: 240px 0 160px; 
    .inner {width: min(1480px, 100%); }
    hgroup {margin-bottom: 80px}
    .wrap {display: grid; grid-template-columns: 1fr 1fr;}
    .wrap dl {position: relative; display: flex; flex-direction: column; padding: 100px 25px}
    .wrap dl::after {
      position: absolute;
      top: 0;
      right: 0; /* 仕切り線の位置を調整 */
      content: "";
      width: 1px;
      height: 100%;
      background-color: #707070;
    }
    .wrap dl:nth-of-type(3):before {
      position: absolute;
      top: 0;
      left: 0; /* 仕切り線の位置を調整 */
      content: "";
      width: 1px;
      height: 100%;
      background-color: #707070;
    }
    .wrap dt {text-align: center; font-size: clamp(1.8rem, 1.586rem + 0.91vw, 2.5rem); font-weight: 700; letter-spacing: .2em; line-height: 1.4; margin-bottom: 10px}
    .wrap .detail {text-align: center; line-height: 1.4; margin-bottom: 20px}
    .wrap .in_site_link {text-align: center; margin-top: auto;}
  } /* #contact */
} /* home */




/*---------------------------------------------------------------------
 固定ページ共通
---------------------------------------------------------------------*/
#title_head {
  background: var(--bg_color); padding: 180px 0 160px;
  
  hgroup {margin-bottom: 0}
  h2 {line-height: 1; margin-bottom: 18px; font-weight: 500; font-size: clamp(3.6rem, 3.171rem + 1.83vw, 5rem)}
  h2 a {pointer-events:none;}
  p {font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem)}
  p span {margin-left: -2%}
} /* #title_head */

.page #main {background: var(--bg_color);}



/*---------------------------------------------------------------------
 個別ページ
---------------------------------------------------------------------*/
/* コンセプト */
.page-id-37 {
  #primary {
    .inner {padding-bottom: 100px}
    .main_figure {margin-bottom: 130px}
    #philosophy {display: grid; grid-template-columns: 60% 1fr; gap: 30 60px; align-items: flex-end;}
    #philosophy dt {order: 2}
    #philosophy dd {order: 1}
    #philosophy dd h2 {line-height: 1.6; margin-bottom: 80px}
    #philosophy dd p {margin-bottom: 0; line-height: 3}
  }

  #secondary {
     margin-bottom: 240px;
    .inner {width: min(100%); padding: 0}
    dt {max-width: 75%}
    dd {background: var(--bg_color); padding: 50px 50px 0 50px; margin-top: -35%; z-index: 10; position: relative; width: 40%; float: right}
    dd p {margin-bottom: 0; line-height: 3}
  }

  #features {
    background: white;
    .inner {width: min(1080px, 100%); padding: 200px 0 100px}
    h2 {color: #3B535F; text-align: center; font-size: clamp(2.6rem, 2.294rem + 1.31vw, 3.6rem); margin-bottom: 110px}
    .wrap a {background: var(--bg_sub_color) url(img/page/concept_features_arrow.svg) no-repeat center right 50px; display: block; padding: 50px 80px; margin-bottom: 50px; transition: all 0.3s ease;}
    .wrap a:hover {background: var(--bg_sub_color) url(img/page/concept_features_arrow.svg) no-repeat center right 30px; opacity: .7}
    .wrap dl {display: grid; grid-template-columns: 140px 1fr; gap:30px 80px; align-items: center;}
    .wrap dt {text-align: center}
    .wrap dd h3 {line-height: 1.6; font-size: clamp(2.6rem, 2.294rem + 1.31vw, 3.6rem);}
    .wrap dd h3 span {font-size: 1.2rem; margin-left: 10px}
    .wrap dd p {margin-bottom: 0}
  }

  #wrranty {
    background: #EFEDEC; padding: 150px 0;
    hgroup {margin-bottom: 80px}
    hgroup h2 {color: var(--main_color)}
    hgroup p {font-size: clamp(1.6rem, 1.478rem + 0.52vw, 2rem)}
    .lead {margin-bottom: 100px; line-height: 3}
  }

  #good_weak {
     padding: 180px 0px 60px;
    .inner {width: min(1060px, 100%); }
    h2 {font-weight: 500; writing-mode: vertical-rl; margin: auto; line-height: 1.6; letter-spacing: .3em; margin-bottom: 100px; width: 80px}
    .lead {text-align: center; margin-bottom: 80px; line-height: 3}
    .each {border: 1px solid #707070; margin-bottom: 85px; padding: 80px}
    .each h3 {display: flex; justify-content: center; flex-wrap: wrap; gap: 10px 30px; align-items: flex-end; line-height: 1; margin-bottom: 60px; color: #3B535F}
    .each h3 span:nth-of-type(1) {text-align: center; font-size: clamp(2.8rem, 2.555rem + 1.04vw, 3.6rem);}
    .each h3 span:nth-of-type(2) {font-size: 1.5rem}
    .each ol {max-width: 640px; margin: auto}
    .each ol li:after {margin-bottom: .8em}
  }
} /* コンセプト */


/* シンプルな家が良い4つのポイント */
.page-id-54 {
  #title_head {
    background: var(--bg_sub_color);
    h2 {padding-top: 160px; font-size: clamp(2.8rem, 2.555rem + 1.04vw, 3.6rem); margin-bottom: 0}
    p {display: none}
  }

  #main {background: var(--bg_sub_color)}

  .each_wrap {
    .detail .title {margin-bottom: 100px}
    .detail .title dt {text-align: center; margin-bottom: 20px}
    .detail .title dd h3 {font-size: clamp(3.2rem, 2.741rem + 1.96vw, 4.7rem); text-align: center; letter-spacing: .2em; color: #3B535F}
    .detail .title dd p {text-align: center; font-size: clamp(1.6rem, 1.508rem + 0.39vw, 1.9rem); margin-bottom: 0; color: #3B535F}
    .detail h4 {font-size: clamp(2.4rem, 2.216rem + 0.78vw, 3rem); line-height: 2.4; margin-bottom: 80px; color: #3B535F}
    .detail .explanation {line-height: 2.4}
  }

  .design_price {
    margin-bottom: 210px;
    .inner {width: min(100%); padding: 0; grid-template-columns: 45% 1fr; gap: 40px; align-items: center}
    .detail h4 {max-width: 420px; margin-left: auto; margin-right: auto}
    .detail .explanation {max-width: 420px; margin: auto}
  }

  #price {
    .inner {width: min(100%); padding: 0; grid-template-columns: 1fr 45%; gap: 40px;}
    .detail {order: 2}
    .viewmore {margin-top: 20px; background: #9DA9AF}
  }

  .performance_comfortable {
    .detail .title {margin-bottom: 80px}
    .detail h4 {line-height: 1.8; margin-bottom: 40px;}
  }

  #performance {
    margin-bottom: 210px;
    .inner {width: min(1200px, 100%); grid-template-columns: 48% 1fr; gap: 40px ; align-items: center;}
    .explanation {margin-bottom: 10px}
    .note {font-size: 1.2rem}
    .in_site_link {text-align: center}
  }

  #comfortable {
    padding-bottom: 210px;
    .inner {width: min(1200px, 100%); grid-template-columns: 1fr 40%; gap: 40px 80px; align-items: center; margin-bottom: 60px}
    .detail {order: 2}
    .appeal {width: min(1200px, 100%); padding: 0 20px; margin: auto}  
    .appeal li {text-align: center; background: white; padding: 50px; font-size: clamp(1.8rem, 1.586rem + 0.91vw, 2.5rem); line-height: 2; letter-spacing: .2em; color: #3B535F; font-weight: 700}
    .appeal li .number {font-size: clamp(3.6rem, 3.355rem + 1.04vw, 4.4rem); line-height: .6}
    .appeal li .note {font-size: 2.1rem}
    }

  footer {background: var(--bg_sub_color)}
} /* シンプルな家が良い4つのポイント */


/* SDHストラクチャー工法 */
.page-id-147 {

} /* SDHストラクチャー工法 */


/* 商品ラインナップ */
.page-id-29 {
  #list {
    position: relative; z-index: 10; background: var(--bg_color); padding: 100px 0 200px;
    .inner {gap:140px}
    dl {display: flex; flex-direction: column;}
    dt {margin-bottom: 46px}
    dt a:hover {opacity: .7}
    dd .name {margin-bottom: 46px}
    dd .type {margin-bottom: 38px; text-align: center}
    dd .explanation {margin-bottom: 20px}
    dd {margin-top: auto}
  } /* #list */
} /* 商品ラインナップ */



/* ラインナップ > La Class */
.page-id-79 {
  #lead {
    margin-bottom: 200px;
    .inner {width: min(1600px, 100%);  padding: 0; display: grid; grid-template-columns: 45% 1fr; gap: 30px; align-items: flex-end;}
    .detail {display: grid; place-items: center;}
    .detail .inside {max-width: 430px; }
    .detail h2 {margin-bottom: 60px; text-align: center}
    .detail h3 {margin-bottom: 80px; text-align: center}
    .detail dl {border-bottom: 1px solid silver; display: grid; grid-template-columns: 30% 1fr; gap: 20px; font-size: clamp(1.8rem, 1.678rem + 0.52vw, 2.2rem)}
    .detail dt {margin-bottom: 0; font-size: 1.6rem;}
    .detail dd {margin-bottom: 0; font-size: 1.6rem; text-align: right}
    .detail p {margin-bottom: 0; text-align: right; font-size: 1.6rem}
  }

  #summary {
    padding-bottom: 200px;
    .text {line-height: 2.6}
    .figure {margin-bottom: 70px}
    .appeal {display: grid; grid-template-columns: 150px 1fr; gap: 20px 150px; align-items: center; margin-bottom: 50px}
    .appeal dt {font-size: clamp(2.4rem, 2.216rem + 0.78vw, 3rem); font-weight: 700; letter-spacing: .2em; color: var(--main_color)}
  }
  .matrix {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(4, auto);
    gap: 4px;
    margin-bottom: 20px;
  }
  .matrix div {
    background: #f7f5f3;
    border: 1px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 20px 10px;
    font-size: 16px;
    line-height: 1.6;
  }
  /* 特定のセルを拡大 */
  .jiyu {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
    font-weight: bold;
    font-size: 20px;
  }
  .taishin {
    grid-column: 3 / 4;
    grid-row: 1 / 3;
    font-weight: bold;
    font-size: 20px;
  }
  .hosho20 {
    grid-column: 4 / 5;
    grid-row: 3 / 5;
    font-weight: bold;
    font-size: 20px;
  }
  .note {line-height: 1.4; margin-bottom: 150px; font-size: 1.2rem}
  .detail {
    gap: 120px;
    dl {display: flex; flex-direction: column;}
    dt {margin-bottom: 30px}
    dd h3 {font-size: clamp(1.8rem, 1.678rem + 0.52vw, 2.2rem); text-align: center; line-height: 1.6; margin-bottom: 32px; letter-spacing: .02em}
    dd h3 span {font-size: clamp(1.6rem, 1.539rem + 0.26vw, 1.8rem)}
    .in_site_link {margin-top: auto}
  }
} /* ラインナップ > La Class */


/* ラインナップ > mini prot */
.page-id-81 {
  #lead {
    margin-bottom: 200px;
    .inner {width: min(100%); padding: 0; display: grid; grid-template-columns: 45% 1fr; gap: 30px; align-items: center;}
    .detail .inside {max-width: 430px; margin: auto}
    .detail h2 {margin-bottom: 60px; text-align: center}
    .detail h3 {text-align: center}
  }

  #summary {
    padding-bottom: 60px;
    .text {line-height: 2.6}
    .figure {margin-bottom: 70px}
    .appeal {display: grid; grid-template-columns: 240px 1fr; gap: 20px 60px; align-items: center; margin-bottom: 50px}
    .appeal dt {font-size: clamp(2.4rem, 2.216rem + 0.78vw, 3rem); font-weight: 700; letter-spacing: .2em}
  }

  #intro {
    padding-bottom: 100px;
    .swiper-mini {overflow: hidden; position: relative}
    .swiper-slide {text-align: center}
    .swiper-wrapper {transition-timing-function: linear;}
  }

  #link {
    .inner {padding-bottom: 180px}
    a {border: 1px solid #575757; padding: 50px 50px 38px; display: block}
    a:hover {background: white; border-color: var(--bg_color)}
    h2 {text-align: center; margin-bottom:30px; line-height: 1}
    p {text-align: center; font-size: clamp(1.6rem, 1.539rem + 0.26vw, 1.8rem); margin-bottom: 0} 
    p:nth-of-type(1) {line-height: 1;display: flex; justify-content: center; align-items: center; gap: 10px; }
    p:nth-of-type(1)::after {content: url(img/home/ex_link.svg)}

  }
} /* ラインナップ > mini prot */


/* 施工事例 */
.page-id-35 {
  #slide{
    margin-bottom: 160px;
    .swiper-works-page {overflow: hidden; position: relative}
    .swiper-slide {text-align: center}
    .swiper-pagination-bullet { opacity: 1; background: white}
    .swiper-pagination-bullet-active { background: var(--main_color); opacity: 1}
    .swiper-button-prev:after, .swiper-button-next:after { color: var(--main_color)}
  }

  .post_line {
    margin-bottom: 0; padding-bottom: 100px;
    .inner {padding: 100px; background: white}
    .post_line_wrap {gap: 120px}
    h3 {font-size: 1.4rem; margin-bottom: 30px}
    a:hover {opacity: .7}
  }
} /*  施工事例 */


/* デザインスタジオ */
.page-id-30 {
  #primary {margin-bottom: 100px}

  #lead {
    margin-bottom: 80px;
    .lead {margin-bottom: 40px}
    .lead h2 {margin-bottom: 20px}
    .detail {display: grid; grid-template-columns: 40% 1fr; gap: 40px 60px;}
    .text {margin-bottom: 20px; line-height: 2.4}
    .info dl {display: grid; grid-template-columns: 100px 1fr; gap: 20px; }
    .info dl:last-of-type {margin-bottom: 30px}
    .in_site_link {text-align: center}
    a.see_more {background: #9DA9AF; font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem); display: block; padding: 20px} 
    .map iframe {aspect-ratio: 16 / 9; width: 100%; height: 100%;}
  } 

  #scene {
    padding-bottom: 100px;
    .wp-block-image {margin-bottom: 30px}
    .in_site_link {text-align: center}
    a.see_more {background: #9DA9AF; font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem); padding: 20px; width: 400px} 
  }
} /* デザインスタジオ */


/* モデルハウス */
.page-id-33 {
  #lead {
    .main_figure {margin-bottom: 150px}
    dl {margin-bottom: 180px}
    dt {font-size: clamp(1.8rem, 1.586rem + 0.91vw, 2.5rem); margin-bottom: 80px; text-align: center}
    dd {text-align: center}
    .logo {margin-bottom: 80px}
    .name {font-size: clamp(2.8rem, 2.616rem + 0.78vw, 3.4rem); margin-bottom: 40px}
    .in_site_link {text-align: center}
    a.see_more {background: #9DA9AF; font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem); padding: 20px; width: 400px} 
  }
  
  #summary {
    .scene dl {margin-bottom: 180px}
    .scene dt {margin-bottom: 6px}
    .scene dd {font-size: 1.2rem}
    .floor {padding: 150px 180px; background: white; margin-bottom: 240px}
    .floor dl {display: flex; gap: 10px 30px; }
    .floor dl:not(:last-child) { margin-bottom: 180px}
    .floor dt {font-size: clamp(2rem, 1.878rem + 0.52vw, 2.4rem); line-height: 1;} 
    .spec {padding-bottom: 160px}
    .spec dl {display: grid; grid-template-columns: 100px 1fr; gap: 20px;}
    .map {margin-bottom: 120px}
    .in_site_link {text-align: center}
    a.see_more {background: #9DA9AF; font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem); padding: 20px; width: 400px} 
  }

  #form_wrap {
  }
} /* モデルハウス */


/* 土地情報 */
.page-id-39 {
  #title_head {
    h2 {line-height: 1;display: flex; justify-content: center; align-items: center; gap: 30px; font-size: clamp(2.8rem, 2.616rem + 0.78vw, 3.4rem)}
    h2::before {content: url(img/page/land_search_icon.svg)}
    p {display: none}
  }

  #search {
    margin-bottom: 160px;
    hr:nth-of-type(1) {margin-bottom: 60px}
    h3 {font-size: clamp(1.8rem, 1.678rem + 0.52vw, 2.2rem); text-align: center; margin-bottom: 60px}
    ul {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; gap:7px; margin-bottom: 50px; }
    li {text-align: center}
    li a {display: block; padding: 10px; font-size: clamp(1.6rem, 1.539rem + 0.26vw, 1.8rem); background: white}
    .all_view {margin-bottom: 60px; text-align: center}
    .all_view a {padding: 10px; font-size: clamp(1.6rem, 1.539rem + 0.26vw, 1.8rem); background: white; width: 300px; display: inline-block;}
    a:hover {opacity: .7}
  }
  
  #result {
    .each:not(:last-child) {margin-bottom: 200px}
    .title {display: flex; flex-wrap: wrap; gap: 10px 30px; align-items: center; margin-bottom: 40px}
    .title dt {background: var(--main_color); padding: 4px 20px; line-height: 1.6; font-size: clamp(1.6rem, 1.478rem + 0.52vw, 2rem); color: white}
    .title h3 {line-height: 1.6; }
    .wrap {grid-template-columns: 55% 1fr; gap: 30px 60px;}
    .wrap dl {display: grid; grid-template-columns: 80px 1fr; gap: 10px 40px; border-bottom: 1px solid var(--main_color); padding-bottom: 7px; margin-bottom: 7px}
    .wrap dl a {background: #CECDCA; color: #000000; padding: 4px 10px 6px; border-radius: 30px; line-height: 1; margin-left: 6px; text-transform: uppercase; font-size: 1rem}
    .wrap dl a:hover {opacity: .7}
    .wrap p {border-bottom: 1px solid var(--main_color); padding-bottom: 7px;}
    .to_contact {text-align: center; margin-bottom: 0}
    .to_contact a {padding: 14px 50px; font-size: clamp(1.6rem, 1.539rem + 0.26vw, 1.8rem); background: #ADA4A2; display: inline-block; color: white}
    .to_contact a:hover {opacity: .7}
  }
} /* 土地情報 */


/* 会社概要 */
.page-id-40 {
  #title_head {
    padding: 300px 0 60px;
    .inner {width: min(1280px, 100%);}
    h2 {text-align: left;}
    p { text-align: left;}
    p span {margin-left: 0;}
  }

  #lead {
    padding-bottom: 80px;
    .inner {width: min(100%); padding: 0; gap: 30px 80px; align-items: flex-end; grid-template-columns: 1fr 1fr;}
    .detail {padding-right: 20px}
    dl {margin-bottom: 26px; }
    .in_site_link {text-align: left}
  }

  #model {
     background: linear-gradient(180deg,var(--bg_color) 0%,var(--bg_color) 8%, white 8%,white 100%);
    .inside {max-width:1380px; margin-left: auto; display: grid; grid-template-columns: 26% 1fr; gap: 50px; align-items: flex-end}
    .info {padding-left: 20px}
    .logo {text-align: center; margin-bottom: 30px}
    .name {text-align: center; font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem); font-weight: 700; margin-bottom: 70px}
    .detail {margin-bottom: 20px}
    .detail dl {display: flex; flex-wrap: wrap; }
    .detail dt {font-size: 1.2rem}
    .detail dd {font-size: 1.2rem}
    .in_site_link {text-align: center;}
    .see_more {background: #9DA9AF; width: 100%}
  }

  #map {
    background: linear-gradient(90deg,white 0%,white 50%,var(--bg_color) 50%,var(--bg_color) 100%);
    .inner {padding: 50px; background: white} 
    iframe {aspect-ratio: 16 / 9; width: 100%; height: 100%;}
  }

  footer {padding-top: 280px}
} /* 会社概要 */


/* カタログ請求 */
.page-id-96 {
  header {position: fixed}

  #title_head {
    min-height: 1050px; background:  url(img/page/catalog_head_bg.jpg); background-size: cover; background-position: 50% 50%; padding-top: 300px;
    .inner {width: min(1280px, 100%);}
    h2 {text-align: left; text-shadow: 1px 2px 3px white; }
    p {display: none}
  }

  #lead {
    padding: 160px 0;
    dl {display: grid; grid-template-columns: 55% 1fr; gap: 0 80px; align-items: center;}
    dt {order: 2}
    dd h2 {margin-bottom: 30px}
    }

  #form_wrap {
    background: white; padding: 160px 0;
    .inner {width: min(1000px, 100%); }
    h2 {text-align: center; color: #B45050; margin-bottom: 40px}
    .explanation {text-align: center; margin-bottom: 10px}
    .note {text-align: center; font-size: 1.2rem; margin-bottom: 100px}
    .form_note { text-align: center; font-size: 1.2rem; padding-top: 20px; margin-bottom: 40px}
    .form_note a {text-decoration: underline}

    #snow-monkey-form-178 {display: none} /* 一旦非表示 */
  }
} /* カタログ請求 */

/* 無料相談 */
.page-id-98 {
  #title_head {display: none}

  #lead {
    background: white; padding: 160px 0 60px;
    h2 {text-align: center; color: #B45050; margin-bottom: 40px}
    .explanation {text-align: center; margin-bottom: 10px}
    .note {text-align: center; font-size: 1.2rem; margin-bottom: 0}
  }

  #form_wrap {
    .inner {width: min(1000px, 100%); }
    background: white; padding-bottom: 160px;
    .form_note { text-align: center; font-size: 1.2rem; padding-top: 20px; margin-bottom: 40px}
    .message .smf-item__label__text::before {display: block;}
    .form_note a {text-decoration: underline}
  }
} /* 無料相談 */

/* thanks ページ */
.page-id-191, .page-id-197, .page-id-219 {
  #title_head {padding-bottom: 100px}
  .entry_content {padding: 0 20px 180px; max-width: 720px; margin: auto}
}



/* プライバシーポリシー */
.page-id-3 {
  #title_head {
    padding-bottom: 40px;
    hgroup h2 {display: none}
    hgroup p {text-align: left}
  }

  #privacy {
    padding: 0 20px; padding-bottom: 100px;
    .inner {background: white; padding: 120px 80px; height: 580px; overflow: hidden scroll ;;}
    .each:not(:last-child) {margin-bottom: 40px}
    .each h3 { line-height: 1.4;display: flex; align-items: center; gap: 2px; font-size: 1.5rem; font-weight: 500; margin-bottom: 6px}
    .each ul.buret li {line-height: 1.8}
    .each ul.buret li:after {margin-bottom: 3px}
    .detail_01 h3::before {content: "1.";}
    .detail_02 h3::before {content: "2.";}
    .detail_03 h3::before {content: "3.";}
    .detail_04 h3::before {content: "4.";}
    .detail_05 h3::before {content: "5.";}
    .detail_06 h3::before {content: "6.";}
    .detail_07 h3::before {content: "7.";}
    .detail_08 h3::before {content: "8.";}
    .detail_09 h3::before {content: "9.";}
    .detail_10 h3::before {content: "10.";}
    .detail_11 h3::before {content: "11.";}
  }
} /* プライバシーポリシー */




/*---------------------------------------------------------------------
 フォーム snow monkey form
---------------------------------------------------------------------*/
.snow-monkey-form {
  .smf-form--simple-table .smf-item {padding: 60px 0; gap: 10px 40px}
  .smf-item {margin-bottom: 20px; padding-bottom: 20px; border-top: 1px solid #707070;}
  .smf-item:last-of-type {border-bottom: 1px solid #707070;}
  .smf-item__label {margin-bottom: 10px}
  .smf-item__label__text {position: relative; padding-left: 60px;}
  .smf-item__label__text::before {position: absolute; content: '必須'; background: white; top: 50%; transform: translateY(-50%); left: 0; border-radius: 2px; font-size: 1.2rem; font-weight: 500; color: #B45050; padding: 4px 6px; border: 1px solid #B45050; border-radius: 5px; line-height: 1}
  .shikichi_place .smf-item__label__text::before,
  .message .smf-item__label__text::before {display: none;}
  .smf-form .smf-placeholder input,
  .smf-form .smf-placeholder textarea {background: #F9F1ED; border: 1px solid #B55050;}
  .smf-form .smf-placeholder textarea {line-height: 1.5}
  .tel .smf-text-control__control,
  .email .smf-text-control__control,
  .shikichi_place .smf-text-control__control {width: 100%}
  .smf-radio-buttons-control__control {display: flex; flex-wrap: wrap; gap:10px 50px}

  .smf-form .smf-placeholder input:checked {background-color: #3a87fd; border-color: #3a87fd;}

  .smf-radio-buttons-control span {line-height: 1.8}
  .smf-control-description {font-size: 1.2rem}

  .name .smf-item__controls {display: flex; flex-wrap: wrap; gap:10px 30px}
  .name .smf-item__controls input {width: 280px}
  .name .smf-control-description {font-size: 1.4rem; font-weight: 700}
  .furigana .smf-item__controls {display: flex; flex-wrap: wrap; gap:10px 30px}
  .furigana .smf-item__controls input {width: 280px}
  .furigana .smf-control-description {font-size: 1.4rem; font-weight: 700}
  .zip .smf-control-description {font-size: 1.4rem; font-weight: 700}

  input::placeholder {color: silver}
  textarea::placeholder {color: silver}

  /* 送信ボタン */
  .smf-action {text-align: center}
  .smf-action .smf-button-control__control {letter-spacing: .15em; padding: 10px 50px; background: #B45050; border-color: #B45050; transition: all 0.3s ease; color: white}
  .smf-action .smf-button-control__control:hover { opacity: .8}
} /* .snow-monkey-form  */

/* 確認画面 */
[data-screen="confirm"] .smf-form--simple-table .smf-item {padding: 20px 0 10px;}
[data-screen="confirm"] .address .smf-placeholder {line-height: 1.5}
[data-screen="confirm"] .message .smf-placeholder {line-height: 1.5; padding-bottom: 20px}

/* 送信後画面 */
[data-screen="complete"] p {padding: 0; text-align: center}

/* 郵便番号　ハイフン無しで！の削除 */
#autozip {display: none !important;} 




/*---------------------------------------------------------------------
 アーカイブ カテゴリ ニュース共通
---------------------------------------------------------------------*/
.archive {}
.category {}

/* イベント情報 */
.page-id-27 {
 #main {background: var(--bg_color); padding-bottom: 100px}
}

/* 一覧のページナビ */
.wp-pagenavi {
  text-align: center; padding-bottom: 50px; line-height: 1.6;
  a {background:#f2f2f2 ; color: var(--main_color)}
  span.current {color :#ffffff; background: var(--main_color); border: none;}
  span.pages {display: none !important}
} /* .wp-pagenavi */

#main .wp-pagenavi a, #main .wp-pagenavi span {
  border: none;
  font-size: clamp(1.6rem, 1.447rem + 0.65vw, 2.1rem);
  padding: .2em .8em;
  margin: 5px;
  transition: all .3s ease;
  display: inline-block
} /* #main .wp-pagenavi a */

#main .wp-pagenavi a:hover {background: var(--main_color); color: white;}



/*---------------------------------------------------------------------
 投稿ページ共通
---------------------------------------------------------------------*/
.single {
  #content .inner {}
  
  .entry_title {line-height: 1.4}
  .entry_meta {
    margin-bottom: 10px;
    .date {margin-bottom: 5px}
    .category_list a {margin-right: 5px}
    .tag_list a {margin-right: 5px}
  } /* .entry_meta */
  
  .entry_content {
    padding-bottom: 100px; word-wrap: break-word; /* 折り返し解除 */
    h2 {margin-bottom: 50px; line-height: 1.6; font-weight: 700; word-break: auto-phrase; font-size: clamp(2.4rem, 2.278rem + 0.52vw, 2.8rem)}
    h3 {font-size: clamp(2rem, 1.878rem + 0.52vw, 2.4rem); margin-bottom: 20px; padding-bottom: 10px; font-weight: 700; border-bottom: 1px solid silver;}
    a img {pointer-events: none;} /* 画像にリンクがついてもリンク解除 */
    a img:hover {opacity: .8}
    figure {margin-bottom: 20px} /* 画像 */
    figure a { display: block}
    figcaption {margin-top: 6px; font-size: 1.2rem; line-height: 1.4} /* キャプション */
    p {margin-bottom: 50px; line-height: 2.6}
    a {color: var(--main_color); text-decoration: underline}
    ul {margin-bottom: 30px}
    .wp-block-file a {text-decoration: underline}
    .wp-block-file a:last-child {display: none}
    a[href$=".pdf"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_pdf_18.svg) no-repeat left center;}
    a[href$=".doc"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_docx_18.svg) no-repeat left center;}
    a[href$=".docx"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_docx_18.svg) no-repeat left center;}
    a[href$=".xls"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_xlsx_18.svg) no-repeat left center;}
    a[href$=".xlsx"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_xlsx_18.svg) no-repeat left center;}
    a[href$=".csv"] {display: inline-block; padding: 2px 0 2px 26px; background: url(img/post/icon_csv_18.svg) no-repeat left center;}
    .wp-block-quote {background: #EBEBEB url(img/post/quote_bk.svg) no-repeat 30px 30px; padding: 80px 30px 30px 30px; border-radius: 30px; margin-bottom: 30px} /* 引用ブロック */
    .wp-block-quote cite {font-size: 1.2rem;} /* 引用 */
    .wp-block-quote cite a { text-decoration: underline} /* 引用 */
    .wp-block-quote cite::before {content: "引用元"; padding-right: 10px} /* 引用 */
    .wp-block-cover p {color: white} /* カバー */
    .wp-block-table table { margin-bottom: 10px} /* カバー */
    .wp-block-columns {gap:30px 70px}
    .wp-block-columns p {margin-bottom: 15px}
    .wp-block-columns ul {margin-bottom: 15px}
    .wp-block-columns figure { margin-bottom: 0}
    .wp-block-gallery ul {margin-bottom: 0}
    .wp-block-button a {color: white; font-weight: bold; transition: all 0.3s ease;} /* ボタン */
    .wp-block-button a:hover {opacity: .8} /* ボタン */
    .wp-block-gallery {display: flex; flex-wrap: wrap;} /* ギャラリー縦並びになってしまう事の対処 */
    .wp-element-caption a {color: var(--main_color); border-bottom: 1px solid var(--main_color); display: inline-block} /* キャプションにリンクがある場合 */
    .youtube_movie {aspect-ratio: 16 / 9; width: 100%; height: 100%; margin-bottom: 20px} /* YouTube 埋め込み対応（utility.js にてjquery でクラス追加） */
    .google_map {aspect-ratio: 16 / 9; width: 100%; height: 100%; margin-bottom: 20px} /* Google Map 埋め込み対応（utility.js にてjquery でクラス追加） */
    .has-small-font-size { font-size: 1.2rem !important} /* フォントサイズ */
    .has-medium-font-size { font-size: clamp(1.4rem, 1.339rem + 0.26vw, 1.6rem)!important}
    .has-large-font-size { font-size: clamp(1.7rem, 1.669rem + 0.13vw, 1.8rem)!important}
    .has-x-large-font-size { font-size: clamp(1.8rem, 1.739rem + 0.26vw, 2rem)!important}
  } /* .entry_content */
} /* single */

.single-events {
  #main {background: var(--bg_color)}
  .summary {
    margin-bottom: 160px;
    .main_figure {margin-bottom: 12px}
    .info {display: flex; justify-content: flex-end; flex-wrap: wrap; gap:8px 16px; margin-bottom: 60px}
    .info li {font-size: 1rem; padding: 3px 20px; min-width: 120px; background: white; text-align: center}
    .entry_title {margin-bottom: 26px}
    .lead {margin-bottom: 60px}
    .detail {margin-bottom: 50px}
    .detail li {margin-bottom: .1em; line-height: 1.6; margin-bottom: 10px}
    .event_sub_figure {margin-bottom: 80px}
    .in_site_link {text-align: center}
  }
  hr.break {margin-bottom: 50px}
  .event_info {
    padding-bottom: 80px;
    dl {display: flex; flex-wrap: wrap; }
    .in_site_link {text-align: center;}
  }
}

.single-work {
  #title_head {
    padding-top: 260px;
    .inner {width: min(100%); padding: 0 70px}
    h2 {text-align: left; }
    p {text-align: left}
  }
  
  #content {
    background: var(--bg_color);
    .entry_content {padding-bottom: 0}
    .lead {display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; align-items: flex-end; margin-bottom: 60px}
    .lead h2 {margin-bottom: 10px}
    .lead p {margin-bottom: 0}
    .main_figure {margin-bottom: 80px}
    .wp-block-image {margin-bottom: 80px}
    .wp-block-columns {gap:20px}
    .in_site_link {text-align: center; padding-bottom: 180px}
  }
}

.single-post {
  #title_head {
    padding: 300px 0 160px;
    .inner {width: min(1280px, 100%);}
    h2 {text-align: left;}
    p { text-align: left;}
    p span {margin-left: 0;}
  }

  #content {
    background: var(--bg_color);
    .inner {width: min(1280px, 100%);}
    .inside {max-width: 800px}
    .entry_title {margin-bottom: 30px}
    .entry_meta {display: flex; flex-wrap: wrap; align-items: center; gap:10px; margin-bottom: 80px}
    .category_list {line-height: 1; gap:5px}
    .category_list a {border: 1px solid var(--main_color); padding: 6px 10px; pointer-events:none;}
    .date {line-height: 1; margin-bottom: 0}
    .in_site_link {padding-bottom: 300px}
  }
}



/*---------------------------------------------------------------------
 Not 404
---------------------------------------------------------------------*/
.error404 {
  #title_head, #breadcrumb {display: none}
  #main {background: var(--bg_color); background-size: cover; background-position: 50% 50%; min-height: 50vh; display: grid; place-items: center;}
  #main dt {color: var(--main_color); font-size: clamp(2.7rem, 2.25rem + 2.25vw, 4.5rem); text-align: center}
  #main dd {color: var(--main_color); font-size: clamp(1.2rem, 1rem + 1vw, 2rem); text-align: center}
} /* error404 */


/*---------------------------------------------------------------------
 footer
---------------------------------------------------------------------*/
footer {
  width: 100%; padding: 100px 0 170px; background: var(--bg_color);
  .inner {display: grid; grid-template-columns: 50% 1fr; gap: 30px 80px ;}
  .info h2 {margin-bottom: 40px;}
  .info h2 a:hover {opacity: .6}
  .info dt {font-weight: 700; margin-bottom: 16px; font-size: clamp(1.2rem, 1.108rem + 0.39vw, 1.5rem)}
  .info dd {font-size: 1.2rem; line-height: 1.8}
  .sns {display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px 30px; margin-top: 20px; align-items: center; margin-bottom: 60px}
  .sns a:hover {opacity: .8}
  .link nav {display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 50px 40px}
  .link h3 {font-size: 1.8rem;}
  .link li {font-size: 1.2rem; margin-bottom: 4px}
  .link li li {padding-left: 20px}
  .link nav ul li a {position: relative; display: inline-block; padding-left: 12px; text-decoration: none;}
  .link nav ul li a:before {
    content: '';
    width: 5px;
    height: 5px;
    border: 0;
    border-top: solid 1px var(--main_color);
    border-right: solid 1px var(--main_color);
    position: absolute;
    top: 42%;
    left: 0;
    transform: rotate(45deg);
  } 
  .link nav ul li li a {padding-left: 8px;}
  .link nav ul li li a:before {content: '●'; border: none; top: 0;}

} /* footer */



/*---------------------------------------------------------------------
 css hack
---------------------------------------------------------------------*/
/* Edge */
@supports (-ms-ime-align: auto) {
  .sample {}
}

/* Firefox */
@-moz-document url-prefix() {
  .sample {}
}

/* Safari */
::-webkit-full-page-media, :future, :root .class_name {
  .sample {}
}


/*---------------------------------------------------------------------
 print
---------------------------------------------------------------------*/
@media print {
  body {-webkit-print-color-adjust: exact;} /* Chrome 背景色強制印刷 */
  a[href]:after {content: "" !important;}
  abbr[title]:after {content: "" !important;}
  .show-for-small-only {display: none !important}
  .pagetop.show {display: none !important}
  body, h1, h2, h3, h4, h5, h6, li, dt, dd, p, th, td, .mincho {font-family: sans-serif !important} /* Chrome印刷で日本語が表示されない対応 */
}


/*---------------------------------------------------------------------
 modal
---------------------------------------------------------------------*/
.open-modal:hover {cursor: pointer;}
@media (max-width: 500px) {.wrap {width: 100%;}}
.modal .checkbox{display: none;}

/* Gray background */
.modal .modal-overlay{
  opacity: 0;
  transition: all 0.3s ease;
  width: 50%;
  position: absolute;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: -100;
  transform: scale(1);
  display: flex;
  background-color:rgba(173, 164, 162, 0.98);
}

/* Box */
.modal .modal-wrap {
  background-color: white;
  box-shadow: 3px 3px 3px rgba(0,0,0,0.2);
  padding: 80px 100px 100px;
  width: 60%;
  margin:  auto;
  align-self: flex-start;
  border-radius: 2px;
  transition: all 0.5s ease;
  h2 {text-align: center; margin-bottom: 40px; color: #3B535F; letter-spacing: .08em}
  .wrap {gap: 30px 80px}
  .wrap dt {margin-bottom: 25px}
  .wrap dt a:hover {opacity: .8}
  .wrap dd {text-align: center; line-height: 1.8}
}
.modal .modal-wrap.from-bottom {transform: translateY(100%);}

/* Close button */
.modal .modal-overlay .close {position: absolute; right: 30px; top: 0; font-size: 40px; width: 30px; height: 30px; color: #3B535F; transition: all 0.3s ease;}
.modal .modal-overlay .close:hover{cursor: pointer; opacity: .7;}
.modal .o-close {width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: -100;}
.modal input:checked ~ .o-close {z-index: 9998;}
.modal input:checked ~ .modal-overlay{transform: scale(1); opacity:1; z-index: 9997; overflow: auto;}
.modal input:checked ~ .modal-overlay .modal-wrap {transform: translateY(0); z-index: 9999;}

/* Responsive Design */
/* Tablet size */
@media (max-width: 800px){
.modal .modal-wrap {width: 80%;padding: 20px;}
}

/* Phone size */
@media (max-width: 500px){
.modal .modal-wrap {width: 90%;}
}

/*---------------------------------------------------------------------
 jquery js 関連 css
---------------------------------------------------------------------*/
/* プルダウンメニュー */
.dropmenu {
  li {position: relative;}
  li a {display: block;}
  li ul {position: absolute; z-index: 50; top: 100%; left: -15px; gap:0; flex-wrap: wrap}
  li ul li {overflow: hidden; height: 0; transition: .2s;}
  li ul li a {padding: 10px; background: var(--bg_sub_color); text-align: center; width: 150px; font-size: 1.2rem; border: none}
  > li:hover > a {}
  > li:hover li:hover > a {background:var(--bg_color); }
  > li:hover > ul > li {overflow: visible; height: 30px;}
  > li.menu-item-has-children {position: relative; padding-right: 11px; }/* 1階層目で子アリに▼を表示 */
  > li.menu-item-has-children::after {content: "▼"; font-size: .6rem; position: absolute; right: 0; top: 48%; transform: translateY(-50%) scale(1.5, 1);}
  li ul li ul {top: 0; left: 100%;}
  li:last-child ul li ul {left: -100%; width: 100%;}
  li ul li ul:before {position: absolute; content: ""; top: 15px; left: -20px; border: 5px solid transparent; border-left-color: #454e08;}
  li:last-child ul li ul:before {position: absolute; content: ""; top: 15px; left: 200%; margin-left: -20px; border: 5px solid transparent; border-right-color: #454e08;}
  li ul li:hover > ul > li {overflow: visible; height: 40px;}
  li ul li ul li a {background: #616d0b}
  li:hover ul li ul li a:hover {background: glay}

} /* .dropmenu */



/* ハンバーガーメニュー */
.button_container {position: fixed; top: 48px; right: 35px; height: 27px; width: 35px; cursor: pointer; z-index: 200; transition: .5s;}
.button_container:after {content: ""; position: absolute; top: -18px; right: -13px; z-index: -1; width: 60px; height: 60px;}
.button_container:hover {opacity: .8;}
.button_container.active .top {transform: translateY(13px) translateX(0) rotate(45deg); background: white; z-index: 200}
.button_container.active .middle {opacity: 0; background: white;}
.button_container.active .bottom {transform: translateY(-13px) translateX(0) rotate(-45deg); background: white; z-index: 200}
.button_container span {background: #000000; border: none; height: 1px; width: 100%; position: absolute; top: 0; left: 0; transition: all .35s ease; cursor: pointer;}
.button_container span:nth-of-type(2) {top: 13px;}
.button_container span:nth-of-type(3) {top: 26px;}

/* メニュー内 */
.overlay {
  position: fixed; background: #3B535F; top: 0; left: 0; width: 100%; height: 0%; opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s, height .35s; overflow: auto; z-index: 99;
  .overlay-menu {width: calc(100% - 140px); margin: 50px auto 0}
  .site_logo {margin-bottom: 80px}
  .detail {display: grid; grid-template-columns: 1fr 1fr; gap: 10px 20px;}
  .contact {}
  .contact ul {gap:10px}
  .contact ul li {border: 1px solid white; text-align: center; line-height: 1.6; text-transform: uppercase}
  .contact ul li a {display: block; height: 130px; display: grid; place-items: center;}
  .contact ul li a:hover {background: #364e59;}
  .link {display: flex; justify-content: flex-end; flex-wrap: wrap; gap:30px 60px}
  .link li {font-size: 1.2rem}
  .link a:hover {opacity: .6}
  .link .left ul:nth-of-type(1) {margin-bottom: 30px}
  .link .center h3 {margin-bottom: 20px}
  .link .right li a {position: relative; display: inline-block; padding-left: 12px; text-decoration: none;}
  .link .right li a:before {
    content: '';
    width: 5px;
    height: 5px;
    border: 0;
    border-top: solid 1px white;
    border-right: solid 1px white;
    position: absolute;
    top: 42%;
    left: 0;
    transform: rotate(45deg);
  } 
  .sns {position: absolute; bottom: 70px; right: 70px; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 25px; align-items: center}
  .sns a:hover {opacity: .8}
  h2 {color: white; font-size: 1.8rem}
  h3 {color: white; font-size: 1.8rem}
  li {color: white}
} /* .overlay */

.overlay.open {
  opacity: .98; visibility: visible; height: 100%;
} /* .overlay.open */


/*---------------------------------------------------------------------
 メディアクエリー
---------------------------------------------------------------------*/
/* スマホ以降（639px 以下） */
@media screen and (max-width: 639px) {
  .no_br_sp br {display: none !important}
  br.sp_non {display: none}
  table tr th, table tr td {padding: 0.4em 0.8em; font-size: 1.2rem}
  .single .wp-caption {max-width: 100%}
  .single #single_page_nav ul {justify-content: center}

  .inner {padding: 0 50px}
  hgroup {margin-bottom: 80px}
  hgroup h2 {margin-bottom: 16px}
  hgroup p {font-size: .9rem;}

  #event.post_line .post_line_wrap {gap: 120px}
  #event.post_line dl {grid-template-columns: 1fr;}
  #event.post_line dd .info {margin-bottom: 30px}
  #event.post_line dd h3 {font-size: 2.2rem}
  #event.post_line dd .lead {font-size: 1.4rem}
  #event.post_line dd .detail li {font-size: 1.4rem}

  a.move_arrow_btn.features_more {width:  300px; font-size: 1.2rem; padding: 16px 12px 16px 0}
  a.move_arrow_btn.features_more span {top:17px; right: 10px}
  a.move_arrow_btn.catalog {width:  320px}
  a.move_arrow_btn.features {padding: 8px 10px}
  a.move_arrow_btn.features span {background-size: 10px; top: 12px; right: 0}

 .post_line_horizontal article a {padding: 30px 0 30px}
 .post_line_horizontal article a .cat_name {font-size: 1rem}
 .post_line_horizontal article a dt {font-size: 1.2rem}
 .post_line_horizontal article a h3 {font-size: 1.4rem}

  header {
    .inner {padding-top: 18px}
    h1 {max-width: 160px}
    .appeal {display: none}
  }

  .home {
    #slide .swiper-wrapper img {width: 100%; aspect-ratio: 390/475; object-fit: cover;}
    #slide .appeal {text-align: center; width: 100%; left: 0; bottom: 40px; }
    #slide .appeal img {max-width: 320px}
    .appeal_btn_sp {gap:1px; margin-top: 1px}
    .appeal_btn_sp li label,
    .appeal_btn_sp li a {padding: 10px; background: #3B535F; color: white; letter-spacing: .4em; font-weight: 700; display: block; text-align: center}
    #event {padding-top: 110px; padding-bottom: 120px}
    #event hgroup {margin-bottom: 34px}
    #concept {padding-top: 90px; padding-bottom: 70px}
    #concept .inside {width: min(100%); margin-left: auto; padding: 0 50px} 
    #concept .text h3 {margin-bottom: 50px}
    #concept .text p {margin-bottom: .5lh; line-height: 2}
    #concept .in_site_link {text-align: center;position: relative}
    #features {padding-bottom: 100px}
    #features h2 {margin-bottom: 50px}
    #features .wrap {gap: 60px 25px; margin-bottom: 60px}
    #features .wrap dt {margin-bottom: 30px}
    #features .wrap dd a {font-size: 1rem}
    #lineup {padding-top: 100px; padding-bottom: 110px}
    #lineup hgroup {margin-bottom: 36px}
    #lineup .inner {gap: 220px}
    #lineup dt {margin: 0 calc(50% - 50vw) 30px;}
    #lineup .explanation {margin-bottom: 20px}
    #lineup .in_site_link {text-align: center}
    #works {background: white; padding-top: 65px; padding-bottom: 80px}
    #works hgroup h2 {font-size: 2.4rem; color: var(--main_color)}
    #works hgroup {margin-bottom: 50px}
    #works .swiper-wrapper img {width: 100%; aspect-ratio: 390/475; object-fit: cover;}
    .chunks {padding-top: 100px}
    .chunks .inside {width: min(100%); padding-left: 50px}
    .chunks h2 {margin-bottom: 50px}
    #design_studio {margin-bottom: 80px}
    #design_studio dl {padding-right: 50px}
    #design_studio dd .logo {width: 240px; margin-bottom: 20px}
    #design_studio dd .name {font-size: 1.2rem; margin-bottom: 10px}
    #design_studio dd .in_site_link {position: relative; right: 0}
    #model_house {margin-bottom: 80px}
    #model_house dl {padding-right: 50px}
    #model_house dd .logo {width: 88px; margin-bottom: 20px}
    #model_house dd .name {font-size: 1.2rem; margin-bottom: 10px}
    #model_house dd .in_site_link {position: relative; right: 0}
    #sns {margin-bottom: 20px}
    #sns h2 {margin-bottom: 50px}
    #sns .instagram {padding-right: 50px}
    #sns .instagram dl {margin-bottom: 24px}
    #sns .instagram dt {margin-bottom: 0; width: 62px; margin: auto}
    #sns .instagram .feed {margin-bottom: 20px}
    #catalog {padding-bottom: 0}
    #catalog .inside_wrap {padding-right: 50px;}
    #catalog dl {margin-bottom: 16px; padding-right: 0}
    #catalog dd h3 {margin-bottom: 0}
    #catalog .text {margin-bottom: 30px}
    #catalog a.move_arrow_btn.catalog {width: 100%; font-size: 1.2rem}
    #catalog a.move_arrow_btn.catalog span {top:12px}
    #land {padding: 60px 0 0}
    #land .figure {margin: 0 calc(50% - 50vw);}
    #land .text {margin-bottom: 40px}
    #news {padding-top: 160px}
    #news hgroup {margin-bottom: 30px}
    #contact {padding-top: 0; padding-bottom: 0}
    #contact hgroup {margin-bottom: 40px}
    #contact hr {display: none}
    #contact .wrap {grid-template-columns: 1fr;}
    #contact .wrap .detail {font-size: 1rem}
    #contact .inner {padding: 0}
    #contact .wrap {height: auto}
    #contact .wrap dl {border-top: 1px solid #707070; padding: 50px 25px}
    #contact .wrap dl:last-child {border-bottom: 1px solid var(--main_color)}
    #contact .wrap dl::after {display: none}
    #contact .wrap dl::before {display: none}
   }

   #title_head {
     padding: 80px 0 40px;
     h2 {font-size: 3.3rem}
     p {font-size: 1.3rem}
   }
   
   .page-id-37 {
     #primary .inner {padding-bottom: 40px}
     #primary .main_figure {margin: 0 calc(50% - 50vw) 70px;}
     #primary .main_figure img {width: 100%; aspect-ratio: 390/360; object-fit: cover;}
     #primary #philosophy {grid-template-columns: 1fr;}
     #primary #philosophy dd {margin-bottom: 60px}
     #primary #philosophy dd h2 {margin-bottom: 30px; font-size: 2rem} 
     #primary #philosophy dd p {margin-bottom: 0; font-size: 1.2rem; letter-spacing: .04em; line-height: 2.2}
     #secondary {margin-bottom: 70px}
     #secondary .inner {padding: 0 50px}
     #secondary dl {display: grid; grid-template-columns: 1fr; gap: 20px;}
     #secondary dt {max-width: 150%; order: 2; margin: 0 calc(50% - 50vw) }
     #secondary dd {padding: 0; width: 100%; margin: auto; order: 1; margin-bottom: 26px}
     #secondary dd p {margin-bottom: 0; font-size: 1.2rem; letter-spacing: .04em; line-height: 2.2}
     #features .inner {padding: 70px 0; }
     #features h2 {margin-bottom: 40px; font-size: 1.8rem}
     #features .wrap a {padding: 24px 20px; background-image: none; margin-bottom: 26px}
     #features .wrap a:hover {background-image: none;}
     #features .wrap dl {grid-template-columns: 20% 1fr; gap:40px}
     #features .wrap dt {text-align: center}
     #features .wrap dt img {height: 64px; }
     #features .wrap dd h3 {font-size: 1.9rem; line-height: 1.4; margin-bottom: 10px}
     #features .wrap dd h3 span {font-size: .8rem}
     #features .wrap dd p {font-size: .8rem}
     #wrranty {padding: 60px 0 40px}
     #wrranty hgroup {margin-bottom: 30px}
     #wrranty hgroup h2 {font-size: 1.8rem; margin-bottom: 30px}
     #wrranty hgroup p {font-size: 1.2rem}
     #wrranty .lead {line-height: 2.2; margin-bottom: 30px}
     #good_weak {padding: 60px 0 0; margin-bottom: 0}
     #good_weak h2 {margin-bottom: 60px}
     #good_weak .lead {text-align: justify; line-height: 2.2}
     #good_weak .each h3 {line-height: 1.8}
     #good_weak .each {padding: 70px 20px 30px; margin-bottom: 0}
     #good_weak .each:first-of-type {margin-bottom: 60px}
     #good_weak ol.buret li {font-size: 1.5rem; font-weight: 700; line-height: 2; text-align: center}
     #good_weak ol.buret li:before {text-align: center; display: block; font-size: 1.5rem; }
     #good_weak ol.buret li:after {margin-bottom: 1.2em}
    }

   .page-id-54 {
     #title_head h2 {font-size: 2.1rem; padding-top: 0; line-height: 2; margin-bottom: 40px; line-height: 1.8}
     .each_wrap .detail .title dd h3 {font-size: 3rem}
     .each_wrap .detail .title dd p {font-size: 1.3rem}
     #design .figure {order: 1; margin-bottom: 40px}
     .design_price {margin-bottom: 40px}
     .design_price .detail h4 {font-size: 1.5rem; margin-bottom: 30px; text-align: center; line-height: 1.8} 
     .design_price .detail p {text-align: center; font-size: 1.2rem; margin-bottom: 60px}
     .design_price .detail .title {margin-bottom: 30px}
     .design_price .detail {order: 2; padding: 0 50px}
     #price {margin-bottom: 120px}
     #price .figure {padding: 0 50px}
     #price .inner {gap: 80px}
     #price .detail .explanation {text-align: left}
     #performance .title {margin-bottom: 10px}
     #performance h4 {text-align: center; font-size: 1.5rem; margin-bottom: 20px}
     #comfortable {padding-bottom: 80px}
     #comfortable .inner {margin-bottom: 30px}
     #comfortable .detail {order: 1}
     #comfortable .figure {order: 2}
     #comfortable .title {margin-bottom: 20px}
     #comfortable h4 {text-align: center; font-size: 1.5rem; margin-bottom: 20px}
     #comfortable .explanation {margin-bottom: 0}
     #comfortable .appeal {padding: 0 50px}
     #comfortable .appeal li {padding: 30px}
     #comfortable .appeal li .note {font-size: 1.4rem}

     a.move_arrow_btn.performance {width: 300px; font-size: 1.2rem; padding: 10px}
     a.move_arrow_btn.performance span {top:12px}
   }

   .page-id-29 {
      #list {padding: 0 0 60px}
      #list .in_site_link {text-align: center}
   }

   .page-id-79 {
      #lead {margin-bottom: 30px}
      #lead .inner {grid-template-columns: 1fr;}
      #lead .detail {order: 2; padding: 30px 50px}
      #lead .detail h2 {max-width: 150px; margin: auto auto 80px;}
      #lead .detail h3 {margin-bottom: 20px}
      #lead .detail dt {padding-left: 0; font-size: 1.5rem}
      #lead .detail dd {font-size: 1.5rem}
      #lead .detail p {font-size: 1.5rem}
      #lead .figure {order: 1}
      #summary {padding-bottom: 0}
      #summary .text {line-height: 2.2; margin-bottom: 40px}
      #summary .figure {margin: 0 calc(50% - 50vw) 50px;}
      #summary .appeal {grid-template-columns: 1fr;}
      #summary .appeal dt {text-align: center; font-size: 1.8rem}
      #summary .note {font-size: .8rem; margin-bottom: 80px}

      .matrix {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 3px;
        grid-template-areas:
          "jiyu sdh"
          "jiyu sdh"
          "kiso mamory"
          "pitch senmen"
          "glass taishin"
          "danetsu taishin"
          "hosho20 teiki"
          "hosho20 teiki"
          "kimitsu koudan"
          "interior muku";
      }
      
      .matrix div {
        background: #f7f5f3;
        border: 1px solid #ddd;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 15px 8px;
        font-size: 1rem;
        line-height: 1.5;
      }
      
      /* === 各セル位置指定 === */
      .matrix .jiyu  { grid-area: jiyu; font-size: 1.5rem}
      .matrix div:nth-child(2)  { grid-area: sdh; }
      .matrix div:nth-child(6)  { grid-area: kiso; }
      .matrix div:nth-child(10) { grid-area: mamory; }
      .matrix div:nth-child(14) { grid-area: pitch; }
      .matrix div:nth-child(15) { grid-area: senmen; }
      .matrix div:nth-child(4)  { grid-area: glass; }
      .matrix .taishin          { grid-area: taishin; font-size: 1.5rem}
      .matrix div:nth-child(7)  { grid-area: danetsu; }
      .matrix .hosho20          { grid-area: hosho20; font-size: 1.5rem}
      .matrix div:nth-child(11) { grid-area: teiki; }
      .matrix div:nth-child(5)  { grid-area: kimitsu; }
      .matrix div:nth-child(13) { grid-area: koudan; }
      .matrix div:nth-child(8)  { grid-area: interior; }
      .matrix div:nth-child(16) { grid-area: muku; }
      
      /* === 強調セル（縦長） === */
      .matrix .jiyu,
      .matrix .taishin,
      .matrix .hosho20 {
        font-weight: 700;
        background: #f7f5f3;
      }

      #summary .detail {gap: 90px}
      #summary .detail dd {line-height: 2}
      #summary .detail dd h3 {margin-bottom: 20px}
    }


   .page-id-81 {
      #lead {margin-bottom: 30px}
      #lead .inner {grid-template-columns: 1fr;}
      #lead .detail {order: 2; padding: 30px 50px}
      #lead .detail dt {padding-left: 0; font-size: 1.5rem}
      #lead .detail dd {font-size: 1.5rem}
      #lead .detail p {font-size: 1.5rem}
      #lead .figure {order: 1}
      #summary {padding-bottom: 0}
      #summary .text {line-height: 2}
      #summary .figure {margin: 0 calc(50% - 50vw) 50px; }
      #summary .appeal {grid-template-columns: 1fr;}
      #summary .appeal dt {text-align: center; font-size: 1.8rem}
      #summary .note {font-size: .8rem}
      #link .inner {padding-bottom: 60px}
      #link p:nth-of-type(1) {font-size: 1.2rem; line-height: 1.6; margin-bottom: 20px; gap:0}
      #link p:nth-of-type(1)::after {display: inline-block; transform: scale(0.5);}
      #link .note {font-size: 1rem}
    }

   .page-id-35 {
      #slide {margin-bottom: 80px}
      #slide .swiper-wrapper img {width: 100%; aspect-ratio: 390/360; object-fit: cover;}
      .post_line {padding: 0 50px}
      .post_line .inner {padding: 40px}
      .post_line h3 {font-size: 1.2rem; font-weight: 500}
    }

   .page-id-30 {
      #main .in_site_link {text-align: center}
      #main .in_site_link a.see_more {width: 260px; margin: auto; font-size: 1.2rem; padding: 12px}
      #primary {margin-bottom: 0}
      #lead {padding-top: 60px}
      #lead h2 {font-size: 2rem}
      #lead .detail {grid-template-columns: 1fr;}
      #lead hgroup {text-align: left}
      #lead hgroup h2 {font-size: 3.3rem; text-align: left; font-weight: 500; margin-bottom: 8px; line-height: 1.6}
      #lead hgroup p {font-size: 1.3rem; text-align: left}
      #lead {margin-bottom: 80px}
      #lead .info dl {grid-template-columns: 90px 1fr; margin-bottom: 10px; gap: 10px}
      #lead .info dt {line-height: 1.4}
      #lead .info dd {line-height: 1.4}
      #scene {padding-bottom: 30px}
      #scene .wp-block-columns {gap: 0 30px !important}
    }

   .page-id-33 {
      #title_head .inner {padding: 0 20px}
      #main .in_site_link {text-align: center}
      #main .in_site_link a.see_more {width: 260px; margin: auto; font-size: 1.2rem; padding: 12px}
      #lead .main_figure {margin: 0 calc(50% - 50vw) 50px; }
      #lead dl {margin-bottom: 100px}
      #lead dt {font-size: 1.2rem}
      #lead .logo {width: 150px; margin: auto; margin-bottom: 30px}
      #lead .name {font-size: 1.8rem; font-weight: 700; margin-bottom: 20px}
      #summary .scene dl {margin-bottom: 60px}
      #summary .scene dd {font-size: 1rem; line-height: 1.6}
      #summary .floor {padding: 50px; margin: 0 calc(50% - 50vw) 50px; }
      #summary .floor dl {gap:10px}
      #summary .floor dt {font-size: .8rem}
      #summary .floor dl:not(:last-child) {margin-bottom: 60px}
      #summary .spec {padding-bottom: 0}
      #summary .spec dl {grid-template-columns: 1fr; gap:0; margin-bottom: 20px; line-height: 1.8}
      #summary .map {margin-bottom: 60px}
    }

   .page-id-39 {
      #search .inner {padding: 0}
      #search ul {display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: center; padding: 0 50px; margin-bottom: 16px}
      #search ul li a {font-size: 1rem}
      #search .all_view {margin-bottom: 80px}
      #search .all_view a {font-size: 1rem; max-width: 60%; margin: auto}
      #result .title {gap:10px}
      #result .title dt {font-size: .9rem}
      #result .title dd h3 {font-size: 1.3rem}
      #result .to_contact a {font-size: .9rem; font-weight: 700; padding: 10px 40px}
    }

   .page-id-96 {
      #title_head {min-height: 470px;}
      #title_head h2 {display: none}
      #lead {padding: 60px 0}
      #lead dl {grid-template-columns: 1fr;}
      #lead .sp_title {font-size: 3.3rem; text-align: left; font-weight: 500; margin-bottom: 15px; line-height: 1.6; font-weight: 500; margin-bottom: 140px}
      #lead h2:nth-of-type(2) {font-size: 2rem}
      #form_wrap {padding: 120px 0 80px}
      #form_wrap .explanation {font-size: 1.2rem; letter-spacing: 0}
      #form_wrap .note {font-size: 1rem}
      #form_wrap .smf-item__label {margin-bottom: 0}
      #form_wrap .smf-form--simple-table .smf-item {padding: 30px 0}
   }

   .page-id-98 {
      #lead {padding: 80px 0}
      #lead .explanation {font-size: 1.2rem; letter-spacing: 0}
      #lead .note {font-size: 1rem}
      #form_wrap {padding: 20px 0 60px}
      #form_wrap .smf-item__label {margin-bottom: 0}
      #form_wrap .smf-form--simple-table .smf-item {padding: 30px 0}
   }

   .page-id-40 {
      #title_head {padding-top: 160px}
      #lead {margin-bottom: 100px}
      #lead .inner {padding: 0 50px}
      #lead .figure {margin: 0 calc(50% - 50vw);}
      #model {background: white; padding-top: 80px}
      #model .inside {grid-template-columns: 1fr;}
      #model .info {padding: 0 50px}
      #model .logo h3 {max-width: 180px; margin: auto auto 30px}
      #model .name {margin-bottom: 30px}
      footer {padding-top: 80px}
   }

   .page-id-3 {
      #privacy {padding: 0 50px}
      #privacy .inner {padding: 40px 30px}
   }

   .single-events {
     .summary {margin-bottom: 80px}
     .summary .main_figure {margin: 0 calc(50% - 50vw) 30px;}
     .summary .main_figure img {width: 100%; aspect-ratio: 390/360; object-fit: cover;}
     .summary .info {display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 40px}
     .summary .entry_title {font-size: 2rem}
     .summary .lead {font-size: 1.5rem; font-weight: 700; margin-bottom: 40px}
     .summary .detail {margin-bottom: 70px}
     .summary .event_sub_figure {margin-bottom: 40px}
     .entry_content {padding-bottom: 60px}
     .entry_content h2 {font-size: 1.8rem; margin-bottom: 30px}
     .event_info dl {margin-bottom: 16px;}
     .event_info dl:last-of-type {margin-bottom: 40px}
     .event_info dt {margin-left: -6px}
     .event_info dd {line-height: 1.4; width: 100%}
   }

   .single-work {
      #title_head {
        .inner {padding: 0 50px}
          padding: 100px 0 60px;
          h2 {font-size: 3.3rem}
          p {font-size: 1.3rem}
        }
      #content .lead {margin-bottom: 20px}
      #content .lead h2 {font-size: 1.5rem}
      #content .lead p {font-size: 1.2rem}
      #content .work_kind {text-align: right; width: 100%;}
      #content .work_kind img {width: 60px}
      #content .main_figure {margin: 0 calc(50% - 50vw) 30px;}
      #content .wp-block-image {margin-bottom: 30px}
      #content .in_site_link {padding-bottom: 0}
   }

   .modal {
      .modal-wrap {padding: 40px 60px}
      .modal-wrap .wrap dt {margin-bottom: 10px}
      .modal-overlay .close {top: -30px}
   }

   .overlay {
      .overlay-menu {width: calc(100% - 40px); margin: 10px auto 0}
      .site_logo {width: 160px; margin-bottom: 50px}
      .contact {margin-bottom: 20px}
      .contact h2 {margin-bottom: 6px}
      .contact ul li a {height: 80px}
      .link {gap:20px 60px; margin-bottom: 50px}
      .link {justify-content: flex-start;}
      .link .left ul:nth-of-type(1) {margin-bottom: 18px}
      .link .center h3 {margin-bottom: 6px}
      .sns {position: relative; bottom: 0; right: 0; justify-content: center;}
   }

   .button_container{width: 20px; top: 28px; right:20px}
   .button_container span:nth-of-type(2) {top: 8px;}
   .button_container span:nth-of-type(3) {top: 16px;}
   .button_container.active .top {transform: translateY(8px) translateX(0) rotate(45deg);}
   .button_container.active .bottom {transform: translateY(-8px) translateX(0) rotate(-45deg);}
   header .button_container.change_top {top: 22px}

  footer {
    padding: 80px 0;
    .inner {grid-template-columns: 1fr; padding: 0 50px}
    .info {order: 2;}
    .info h2 {margin-bottom: 20px}
    .info dl {margin-bottom: 40px}
    .info .sns {justify-content: center; margin-bottom: 0}
    .info .sns img {width: 42px}
    .link {order: 1; margin-bottom: 80px}
    .link nav {justify-content: start;}
    .link nav div {width: 100%}
  }
}


/* スマホ〜タブレット共通（1023px 以下） */
@media screen and (max-width: 1023px) {
  .no_br br {display: none !important}
}


/* スマホ「横」向き対応 */
@media screen and (max-width: 940px) and (orientation:landscape) {
  .sample {}
}


/* スマホ以降（375px 以下）iPhone SE */
@media screen and (max-width: 375px) {
  .sample {}
}


/* スマホ以降（320px 以下）旧 iPhone SE */
@media screen and (max-width: 320px) {
  .sample {}
}


/* スマホ以降（321px 以降） */
@media screen and (min-width: 321px) {
  .sample {}
}


/* タブレット対応 */
@media screen and (min-width: 640px) and (max-width: 1024px) {
  .no_br_tb br {display: none !important}
  br.tb_non {display: none}

  .inner {padding: 0 50px}
  hgroup {margin-bottom: 80px}
  hgroup h2 {margin-bottom: 16px}

  .home {
    #slide .appeal {text-align: center; max-width: 100%; left: 0; bottom: 40px; width: 100%;}
    #slide .appeal img {max-width: 420px;}
    #event {padding: 100px 0}
    #event .inner {padding: 0 100px}
    #event .post_line_wrap {gap:80px}
    #concept .inside {width: 95%}
    #features h2 {margin-bottom: 80px}
    #lineup {padding: 120px 0 100px}
    #lineup .inner {gap: 40px 80px}
    #works {padding-bottom: 140px}
    #works h2 {font-size: 5rem}
    #works .cover h3 {font-size: 2.4rem}
    .chunks h2 {margin-bottom: 80px}
    #design_studio {margin-bottom: 180px}
    #model_house {margin-bottom: 180px}
    #model_house dd .logo {margin-bottom: 20px}
    #sns {margin-bottom: 130px}
    #sns h2 {margin-bottom: 80px}
    #sns .instagram dl {margin-bottom: 40px}
    #catalog {padding-bottom: 0}
    #catalog dl {margin-bottom: 40px}
    #catalog dd h3 {margin-bottom: 30px}
    #news {padding-bottom: 0}
    #contact {padding-bottom: 80px}
    #contact .wrap {height: auto; gap:0; grid-template-columns: 1fr 1fr;}
    #contact .wrap dl::after {right: 0}
    #contact .wrap dl:nth-of-type(1),
    #contact .wrap dl:nth-of-type(2) {border-bottom: 1px solid #707070;}
    #contact hr:nth-of-type(2) {margin-top: 0}
    #contact .wrap dl:nth-of-type(1)::before {left: 0; }
    #contact .wrap dl:nth-of-type(3)::before {
      position: absolute;
      top: 0;
      left: 0; /* 仕切り線の位置を調整 */
      content: "";
      width: 1px;
      height: 100%;
      background-color: #707070;
    }
    #contact .wrap dl:nth-of-type(2)::after,
    #contact .wrap dl:nth-of-type(4)::after {right: 0; }
  }

  .page-id-37 {
     #primary #philosophy {grid-template-columns: 1fr;}
     #primary #philosophy dt {text-align: center}
     #primary #philosophy dd {margin-bottom: 60px}
     #secondary {margin-bottom: 60px}
     #secondary dt {max-width: 100%}
     #secondary dd {margin: -8% auto auto; width: 80%; float: none; }
   }

   .page-id-29 {
     #list .inner {gap: 60px}
  }

   .page-id-79 {
     #lead {margin-bottom: 100px}
     #lead .inner {grid-template-columns: 1fr;}
     #lead .figure {order: 1; margin-bottom: 60px}
     #lead .detail {order: 2}
     #summary .detail {gap: 80px}
  }

   .page-id-81 {
     #lead {margin-bottom: 100px}
     #lead .inner {grid-template-columns: 1fr;}
     #lead .figure {order: 1; margin-bottom: 60px}
     #lead .detail {order: 2}
  }

   .page-id-35 {
      #slide {margin-bottom: 80px;}
  }

   .page-id-33 {
      #summary .floor {margin-bottom: 120px}
  }

   .page-id-30 {
     #lead .detail {grid-template-columns: 1fr;}
  }

   .page-id-27 {
      #event {padding: 100px 0}
      #event .inner {padding: 0 100px}
      #event .post_line_wrap {gap:80px; grid-template-columns: 1fr;}
  }

   .page-id-40 {
     #lead {margin-bottom: 160px}
     #lead .inner {grid-template-columns: 1fr;}
     #lead .detail {padding: 0 50px}
     #model .inside {grid-template-columns: 35% 1fr}
     #model h3 {width: 180px; margin: auto auto 16px}
  }

  .page-id-54 {
    .each_wrap .inner {grid-template-columns: 1fr!important}
    .each_wrap .detail { order: 1}
    .each_wrap .figure { order: 2}
    .each_wrap .detail .title {margin-bottom: 60px}
    .each_wrap .detail h4 {margin-bottom: 40px; line-height: 2}
    .design_price .figure {order: 1; margin-bottom: 40px}
    .design_price .detail {order: 2}
    .design_price .detail {padding: 0 50px}
  }

  .overlay .detail {grid-template-columns: 1fr; gap: 60px}
  .overlay .contact h2 {margin-bottom: 20px}
  .overlay .link {justify-content: flex-start;}
  
   .button_container{width: 20px; top: 54px; right:20px}
   .button_container span:nth-of-type(2) {top: 8px;}
   .button_container span:nth-of-type(3) {top: 16px;}
   .button_container.active .top {transform: translateY(8px) translateX(0) rotate(45deg);}
   .button_container.active .bottom {transform: translateY(-8px) translateX(0) rotate(-45deg);}
   header .button_container.change_top {top: 22px}

  footer {
    .inner {grid-template-columns: 32% 1fr; gap:30px}
    .link nav {gap:18px}
  }
}



/* タブレット以降（640px 以降） */
@media screen and (min-width: 640px) {
  .logged-in header {padding-top: 32px; margin-top: -32px} /* ログイン時のアドミンバー対応（ヘッダー） */
  .post_line_horizontal article dl {display: grid; grid-template-columns: 140px 80%;}
  .post_line_horizontal article dt {padding-left: 30px}
  .entry_content .wp-block-table td, .wp-block-table th {padding: 1em;}
}


/* 1024px以降 iPad 横 iPad 12.9 縦 含む */
@media screen and (min-width: 1024px) {
header .site_nav_pc ul { gap: 10px}
}


/* PCモニター（1025px以降） */
@media screen and (min-width: 1025px) {
  .no_br_pc br { display: none}
  br.pc_non {display: none} 
}


/* PCモニター（1080px以降） */
@media screen and (min-width: 1080px) {
  header .inner {padding-left: 40px; padding-right: 90px} 
  header .site_title {width: 240px}
  header .title_appeal .appeal {width: 90px}
  header .site_nav_pc ul {gap: 10px 20px}
}


/* PCモニター（1240px以降） */
@media screen and (min-width: 1240px) {
  .button_container {top: 56px;}
  header .inner {padding-left: 70px; padding-right: 120px}
  header .site_title {width: 290px}
  header .title_appeal {gap:10px 30px}
  header .title_appeal .appeal {width: 110px}
  header .site_nav_pc ul {gap: 10px 26px}
}

/* PCモニター（1380px以降） */
@media screen and (min-width: 1380px) {
  header .inner {padding-left: 70px; padding-right: 120px}
  header .site_title {width: 311px}
  header .title_appeal {gap: 10px 38px}
  header .title_appeal .appeal {width: 132px}
  header .site_nav_pc ul {gap: 10px 38px}
}



/* PCモニター大（1480px以降） */
@media screen and (min-width: 1480px) {
  header .site_nav_pc ul {gap: 10px 48px}
}


/* PCモニター大（1540px以降） */
@media screen and (min-width: 1540px) {
 .page-id-40 #model .inside {margin: auto}
}