@charset "UTF-8";
@import url("global.css");
#header .header .header_logo {
  opacity: 0;
  visibility: hidden;
}
.is-scroll #header .header .header_logo {
  opacity: 1;
  visibility: visible;
}

/* ------------------------------
 Top
------------------------------ */
@keyframes zoomout {
  0% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes jamove {
  0% {
    opacity: 0;
    filter: blur(10px);
    translate: -20px 40px;
  }
  100% {
    opacity: 1;
    filter: none;
    translate: 0;
  }
}
#toparea {
  height: 100svh;
  display: flex;
  position: relative;
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --delay: 0.1s;
}
#toparea #toplogo {
  position: absolute;
  z-index: 1;
  top: 50px;
  left: 50px;
  width: 440px;
  filter: brightness(0) invert(1);
}
#toparea #topslide1 .swiper-container,
#toparea #topslide1 .swiper-wrapper,
#toparea #topslide1 .swiper-slide,
#toparea #topslide1 .slide-img, #toparea #topslide2 .swiper-container,
#toparea #topslide2 .swiper-wrapper,
#toparea #topslide2 .swiper-slide,
#toparea #topslide2 .slide-img {
  height: 100%;
}
#toparea #topslide1 .swiper-slide-active .slide-img img,
#toparea #topslide1 .swiper-slide-duplicate-active .slide-img img,
#toparea #topslide1 .swiper-slide-prev .slide-img img, #toparea #topslide2 .swiper-slide-active .slide-img img,
#toparea #topslide2 .swiper-slide-duplicate-active .slide-img img,
#toparea #topslide2 .swiper-slide-prev .slide-img img {
  animation: zoomout 6s ease-in-out 0s 1;
  animation-fill-mode: both;
}
#toparea #topslide1 {
  position: relative;
  z-index: 0;
  height: 85%;
  width: 43%;
}
#toparea .catchcopy {
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  white-space: nowrap;
  line-height: 1.4;
  letter-spacing: .1em;
  display: inline-block;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc( 100% - ( 43% + 45% ) );
  padding-top: 1em;
  font-size: 42px;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#toparea .catchcopy span {
  display: block;
}
#toparea .splitText .char {
  animation: jamove 1.4s var(--ease-out-quart) calc(var(--delay) * var(--index)) 1;
  animation-fill-mode: both;
}
#toparea #topslide2 {
  margin-top: auto;
  height: 77%;
  width: 45%;
  overflow: hidden;
}

/* ---------- News ---------- */
#top_news {
  position: absolute;
  left: 0;
  top: calc( 85% + 30px );
  bottom: 0;
  width: 43%;
  padding-left: 30px;
  box-sizing: border-box;
}
#top_news .title_box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 1;
  margin-bottom: 15px;
}
#top_news .title_box::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background-color: #D6D6D6;
}
#top_news .title_box .title {
  width: fit-content;
  padding-right: 20px;
  background: #F1F1EF url("../img/bg_texture.jpg") repeat;
  background-size: 375px 375px;
  font-size: 1.125em;
  font-family: "Jost", "Zen Kaku Gothic New", sans-serif;
}
#top_news .title_box .link {
  width: fit-content;
  padding-left: 20px;
  background: #F1F1EF url("../img/bg_texture.jpg") repeat;
  background-size: 375px 375px;
  font-size: .825em;
  font-weight: 600;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#top_news .swiper-container {
  width: 100%;
  height: 30px;
}
#top_news ul.list {
  height: 100%;
}
#top_news ul.list li .inner {
  display: flex;
  align-items: center;
  height: 30px;
  line-height: 30px;
  text-align: left;
  font-size: .94em;
  overflow: hidden;
}
#top_news ul.list li a.inner .text {
  position: relative;
  padding-right: 1.5em;
}
#top_news ul.list li a.inner .text::after {
  content: "\f04b";
  position: absolute;
  right: 0;
  top: 0;
  font-family: 'Font Awesome 6 free','Font Awesome 6 Brands';
  font-weight: 900;
}
@media (any-hover: hover) {
  #top_news ul.list li a.inner:hover {
    opacity: .8;
  }
}
#top_news ul.list li .date {
  display: block;
  position: relative;
  font-family: "Jost", "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  padding-top: 1px;
}
#top_news ul.list li .text {
  display: block;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-weight: 600;
  margin-left: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---------- Main Conetn common ---------- */
body {
  --ttlngtv: -60px;
}

.title_vrt_box .sec_title {
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  white-space: nowrap;
  line-height: 1.4;
  letter-spacing: .1em;
  display: inline-block;
  line-height: 1;
}
.title_vrt_box .sec_title span {
  display: block;
}
.title_vrt_box .sec_title span.en {
  color: #A2A2A2;
  font-family: "Jost", "Zen Kaku Gothic New", sans-serif;
  line-height: 1;
  margin-left: 20px;
  margin-top: .2em;
}
.title_vrt_box .sec_title span.ja {
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-weight: 500;
  font-size: clamp(20px, 3.2vw, 34px);
  letter-spacing: .1em;
}

/* ---------- Event ---------- */
#sec_event {
  margin-top: 140px;
}
#sec_event .wrapper {
  position: relative;
}
#sec_event .title_vrt_box {
  position: absolute;
  left: var(--ttlngtv);
  top: 0;
}
#sec_event .main ul.list {
  display: grid;
  grid-auto-rows: 1fr 1fr;
  grid-template-columns: 65% 1fr;
}
#sec_event .main ul.list li:first-child {
  grid-row: 1 / 3;
  grid-column: 1 / 2;
}
#sec_event .main ul.list li:first-child a {
  width: 100%;
}
#sec_event .main ul.list li a {
  display: block;
  width: 85.7%;
  margin: 0 0 60px auto;
}
#sec_event .main ul.list li a .img {
  width: 100%;
  height: 0;
  padding-top: 66.67%;
  position: relative;
  overflow: hidden;
}
#sec_event .main ul.list li a .img figure {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
#sec_event .main ul.list li a .img figure img {
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
#sec_event .main ul.list li a .img figure::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #1D1D1D;
  mix-blend-mode: multiply;
  opacity: 0;
  z-index: 1;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
#sec_event .main ul.list li a .img figure::after {
  content: "詳しく見る";
  color: #fff;
  position: absolute;
  bottom: 15px;
  right: 40px;
  z-index: 2;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0.2s;
  backface-visibility: hidden;
}
#sec_event .main ul.list li a .text .posttitle {
  margin-block: 15px;
  font-size: 1.0625em;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  line-height: 1.6;
  font-weight: 600;
}
#sec_event .main ul.list li a .text .posttitle .cat {
  display: block;
  white-space: nowrap;
  width: fit-content;
  padding: 2px 8px;
  margin-bottom: 6px;
  background-color: #1A1A3F;
  color: #FFF;
  font-size: 11px;
  font-weight: normal;
  font-family: "Zen Kaku Gothic New", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "游ゴシック Medium", "Yu Gothic Medium", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Meiryo", "メイリオ", Helvetica, sans-serif;
}
#sec_event .main ul.list li a .text .data {
  font-size: .85em;
}
#sec_event .main ul.list li a .text .data > p {
  display: flex;
  align-items: flex-start;
}
#sec_event .main ul.list li a .text .data > p::before {
  display: block;
  text-align: center;
  width: 15px;
  margin-right: 7px;
  font-family: 'Font Awesome 6 free','Font Awesome 6 Brands';
  font-weight: 900;
}
#sec_event .main ul.list li a .text .data > p span {
  display: block;
}
#sec_event .main ul.list li a .text .data > p span.h {
  width: 66px;
  flex-shrink: 0;
}
#sec_event .main ul.list li a .text .data > p span:not([class]) {
  flex-grow: 1;
}
#sec_event .main ul.list li a .text .data > p.day::before {
  content: "\f017";
}
#sec_event .main ul.list li a .text .data > p.place::before {
  content: "\f3c5";
}
@media (any-hover: hover) {
  #sec_event .main ul.list li a:hover .img figure img {
    filter: blur(2px);
  }
  #sec_event .main ul.list li a:hover .img figure::before {
    opacity: .6;
  }
  #sec_event .main ul.list li a:hover .img figure::after {
    opacity: 1;
    translate: 20px 0;
  }
}
#sec_event .main .moreview {
  display: flex;
  justify-content: flex-end;
}

/* ---------- Concept ---------- */
#sec_concept {
  margin-top: 140px;
}
#sec_concept .concept_title {
  display: flex;
}
#sec_concept .concept_title .title_vrt_box {
  padding: 60px calc( ( 100vw - 1200px ) / 2 ) 0 5vw;
}
#sec_concept .concept_title .title_vrt_box span.ja {
  line-height: 1.3;
  font-weight: 400;
  font-size: clamp(25px, 3.4vw, 48px);
  letter-spacing: .1em;
}
#sec_concept .concept_title .img {
  flex-grow: 1;
  height: 36vw;
  min-height: 600px;
  overflow: hidden;
}
#sec_concept .concept_title .img figure {
  height: 100%;
}
#sec_concept .concept_body {
  padding-block: 100px;
  background-color: #E5E5E5;
  position: relative;
}
#sec_concept .concept_body .wave {
  position: absolute;
  z-index: -1;
  right: 0;
  top: 0;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}
#sec_concept .concept_body .wrapper {
  display: flex;
  justify-content: space-between;
}
#sec_concept .concept_body .wrapper .text {
  width: 100%;
  padding-right: 4vw;
  text-align: justify;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#sec_concept .concept_body .wrapper .text > p {
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 1.0625em;
}
#sec_concept .concept_body .wrapper .text > p + p {
  margin-top: 1em;
}
#sec_concept .concept_body .wrapper .text .moreview {
  margin-top: 30px;
}
#sec_concept .concept_body .wrapper .img {
  flex-shrink: 0;
  width: 55%;
  height: 380px;
  overflow: hidden;
}
#sec_concept .concept_body .wrapper .img figure {
  height: 100%;
}

/* ---------- Works ---------- */
#sec_works {
  margin: 140px 0 0 calc( ( 100vw - 1200px ) / 2 );
  position: relative;
}
#sec_works .title_vrt_box {
  position: absolute;
  left: -110px;
  top: 0;
}
#sec_works .main {
  width: 100%;
  overflow: hidden;
}
#sec_works .main .list .slick-list {
  padding: 0 240px 0 0 !important;
}
#sec_works .main .list .item {
  margin-right: 60px;
}
#sec_works .main .list .item a {
  display: block;
}
#sec_works .main .list .item a .ph {
  width: 100%;
  height: 0;
  padding-top: 61%;
  overflow: hidden;
  position: relative;
}
#sec_works .main .list .item a .ph img {
  position: absolute;
  left: 0;
  top: 0;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
#sec_works .main .list .item a .ph::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #1D1D1D;
  mix-blend-mode: multiply;
  opacity: 0;
  z-index: 1;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
#sec_works .main .list .item a .ph::after {
  content: "もっと見る";
  color: #fff;
  position: absolute;
  bottom: 15px;
  right: 40px;
  z-index: 2;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0.2s;
  backface-visibility: hidden;
}
#sec_works .main .list .item a .posttitle {
  margin-top: 10px;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 1.125em;
  line-height: 1.6;
  font-weight: 600;
}
@media (any-hover: hover) {
  #sec_works .main .list .item a:hover .ph img {
    filter: blur(2px);
  }
  #sec_works .main .list .item a:hover .ph::before {
    opacity: .6;
  }
  #sec_works .main .list .item a:hover .ph::after {
    opacity: 1;
    translate: 20px 0;
  }
}
#sec_works .slick-dots {
  margin-top: 40px;
  display: flex;
  align-items: center;
  width: fit-content;
  gap: 10px;
}
#sec_works .slick-dots > li {
  line-height: 0;
}
#sec_works .slick-dots > li.slick-active button {
  background-color: #1D1D1D;
}
#sec_works .slick-dots > li button {
  font-size: 0;
  width: 10px;
  height: 10px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  background-color: #A2A2A2;
}
#sec_works .slick-dots > li button:hover {
  cursor: pointer;
}
#sec_works .moreview {
  margin-top: -20px;
  position: relative;
  z-index: 3;
  display: flex;
  justify-content: flex-end;
}

/* ---------- Policy ---------- */
#sec_policy {
  margin-top: 170px;
  background-color: #E5E5E5;
  padding-bottom: 170px;
  position: relative;
}
#sec_policy::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 20%;
  background: #F1F1EF url("../img/bg_texture.jpg") repeat;
  background-size: 375px 375px;
}
#sec_policy .wrapper {
  position: relative;
  z-index: 2;
}
#sec_policy .title_vrt_box {
  position: absolute;
  right: var(--ttlngtv);
  top: 0;
}
#sec_policy ol.list {
  display: flex;
  flex-direction: row-reverse;
  margin-right: 40px;
}
#sec_policy ol.list li {
  width: 33.33%;
  padding-right: 50px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#sec_policy ol.list li .item_inner .imgarea {
  position: relative;
  z-index: 2;
  margin-bottom: 60px;
}
#sec_policy ol.list li .item_inner .imgarea .img {
  position: relative;
  aspect-ratio: 1 / 1.3;
  overflow: hidden;
}
#sec_policy ol.list li .item_inner .imgarea .img::before {
  content: "";
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(145deg, rgba(229, 229, 229, 0) 0, rgba(229, 229, 229, 0) 80%, rgba(229, 229, 229, 0.8) 100%);
}
#sec_policy ol.list li .item_inner .imgarea .img figure picture {
  display: block;
}
#sec_policy ol.list li .item_inner .imgarea .img figure img {
  height: 120%;
}
#sec_policy ol.list li .item_inner .imgarea .number {
  position: absolute;
  z-index: 5;
  right: 12px;
  bottom: -40px;
  line-height: 1;
  display: flex;
  align-items: flex-start;
  font-family: "Jost", "Zen Kaku Gothic New", sans-serif;
  font-size: clamp(50px, 5.4vw, 66px);
  color: #1A1A3F;
}
#sec_policy ol.list li .item_inner .imgarea .number::before {
  content: "#";
  font-size: 60%;
}
#sec_policy ol.list li .item_inner .text::before {
  content: "";
  display: block;
  width: 100%;
  height: 10px;
  clip-path: polygon(0 9px, 45% 9px, 50% 0, 55% 9px, 100% 9px, 100% 100%, 54.9% 100%, 50% 1px, 45.1% 100%, 0 100%);
  background-color: #1D1D1D;
}
#sec_policy ol.list li .item_inner .text dl {
  padding-top: 25px;
}
#sec_policy ol.list li .item_inner .text dl dt {
  text-align: center;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-weight: 600;
  font-size: clamp(21px, 1.8vw, 24px);
  margin-bottom: 15px;
}
#sec_policy ol.list li .item_inner .text dl dd {
  text-align: justify;
  font-size: .94em;
}
#sec_policy ol.list li .item_inner .text .moreview {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
}
#sec_policy ul.banner {
  margin-top: 120px;
  display: flex;
  column-gap: 40px;
}
#sec_policy ul.banner li {
  width: 50%;
}
#sec_policy ul.banner li a {
  display: block;
  background-color: #1A1A3F;
  color: #FFF;
  padding: 30px 60px 30px 30px;
  position: relative;
}
#sec_policy ul.banner li a::after {
  content: "\f054";
  position: absolute;
  right: 30px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-family: 'Font Awesome 6 free','Font Awesome 6 Brands';
  font-weight: 900;
  font-size: 18px;
  line-height: 1;
}
#sec_policy ul.banner li a p {
  line-height: 1.4;
}
#sec_policy ul.banner li a p.en {
  font-size: .83em;
  font-family: "Jost", "Zen Kaku Gothic New", sans-serif;
}
#sec_policy ul.banner li a p.ja {
  font-size: clamp(18px, 1.8vw, 22px);
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
@media (any-hover: hover) {
  #sec_policy ul.banner li a:hover {
    -webkit-border-top-left-radius: 20px;
    border-top-left-radius: 20px;
    -webkit-border-bottom-right-radius: 20px;
    border-bottom-right-radius: 20px;
  }
}

.policy_end {
  width: 100%;
  height: 0;
  padding-top: 49%;
  overflow: hidden;
  clip-path: inset(0);
}
.policy_end span {
  position: fixed;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100svh;
}

/* ---------- Modelhouse ---------- */
#sec_modelhouse {
  margin-top: 160px;
}
#sec_modelhouse .wrapper {
  position: relative;
}
#sec_modelhouse .title_vrt_box {
  position: absolute;
  left: var(--ttlngtv);
  top: 0;
}
#sec_modelhouse .main ul.list {
  display: grid;
  gap: 0 3vw;
  grid-template-columns: repeat(3, 1fr);
}
#sec_modelhouse .main ul.list li {
  display: contents;
}
#sec_modelhouse .main ul.list li a {
  display: grid;
  gap: 0;
  text-align: center;
  grid-template-rows: subgrid;
  grid-row: span 5;
}
#sec_modelhouse .main ul.list li a .img {
  width: 100%;
  height: 0;
  padding-top: 100%;
  position: relative;
  overflow: hidden;
}
#sec_modelhouse .main ul.list li a .img figure {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
#sec_modelhouse .main ul.list li a .img figure img {
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
#sec_modelhouse .main ul.list li a .img figure::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #1D1D1D;
  mix-blend-mode: multiply;
  opacity: 0;
  z-index: 1;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
#sec_modelhouse .main ul.list li a .img figure::after {
  content: "詳細ページへ";
  color: #fff;
  position: absolute;
  bottom: 15px;
  right: 40px;
  z-index: 2;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0.2s;
  backface-visibility: hidden;
}
#sec_modelhouse .main ul.list li a .modelname {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding-top: 20px;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: clamp(18px, 2vw, 20px);
  line-height: 1.6;
  font-weight: 600;
}
#sec_modelhouse .main ul.list li a .posttitle {
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-size: 17px;
  border-top: 1px solid #ddd;
  padding-top: 15px;
  margin-top: 15px;
}
#sec_modelhouse .main ul.list li a .add {
  font-size: .8em;
  color: #706D65;
}
#sec_modelhouse .main ul.list li a .moreview {
  margin-top: 20px;
}
#sec_modelhouse .main ul.list li a .moreview .more {
  margin-inline: auto;
}
@media (any-hover: hover) {
  #sec_modelhouse .main ul.list li a:hover .img figure img {
    filter: blur(2px);
  }
  #sec_modelhouse .main ul.list li a:hover .img figure::before {
    opacity: .6;
  }
  #sec_modelhouse .main ul.list li a:hover .img figure::after {
    opacity: 1;
    translate: 20px 0;
  }
  #sec_modelhouse .main ul.list li a:hover .text .moreview .more {
    background-position: bottom left;
    background-size: 100% 1px;
  }
}

/* ---------- Staff Blog ---------- */
#sec_staffblog {
  margin-top: 140px;
  background-color: #fff;
  padding-block: 100px;
}
#sec_staffblog .title_vrt_box {
  display: flex;
  justify-content: center;
}
#sec_staffblog .title_vrt_box .sec_title {
  margin-left: 2em;
}
#sec_staffblog .main {
  padding-top: 30px;
  position: relative;
}
#sec_staffblog .main ul.list {
  display: grid;
  column-gap: 1.5vw;
  grid-template-columns: repeat(4, 1fr);
}
#sec_staffblog .main ul.list li a {
  display: block;
}
#sec_staffblog .main ul.list li a .img {
  margin-bottom: 20px;
}
#sec_staffblog .main ul.list li a .img figure {
  width: 100%;
  height: 0;
  padding-top: 66.67%;
  position: relative;
  overflow: hidden;
}
#sec_staffblog .main ul.list li a .img figure img {
  position: absolute;
  left: 0;
  top: 0;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
#sec_staffblog .main ul.list li a .img figure::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #1D1D1D;
  mix-blend-mode: multiply;
  opacity: 0;
  z-index: 1;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
#sec_staffblog .main ul.list li a .img figure::after {
  content: "記事を読む";
  color: #fff;
  position: absolute;
  bottom: 15px;
  right: 40px;
  z-index: 2;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0.2s;
  backface-visibility: hidden;
}
#sec_staffblog .main ul.list li a .text .posttitle {
  font-weight: 600;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#sec_staffblog .main ul.list li a .text .postdata {
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#sec_staffblog .main ul.list li a .text .postdata .date {
  display: block;
  font-family: "Jost", "Zen Kaku Gothic New", sans-serif;
  font-size: .875em;
  color: #8D8D8D;
}
#sec_staffblog .main ul.list li a .text .postdata .author {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
#sec_staffblog .main ul.list li a .text .postdata .author span {
  display: block;
}
#sec_staffblog .main ul.list li a .text .postdata .author span.name {
  font-weight: 500;
  font-size: .8125em;
  margin-right: 10px;
}
#sec_staffblog .main ul.list li a .text .postdata .author span.ph {
  width: 38px;
  height: 38px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  overflow: hidden;
}
@media (any-hover: hover) {
  #sec_staffblog .main ul.list li a:hover .img figure img {
    filter: blur(2px);
  }
  #sec_staffblog .main ul.list li a:hover .img figure::before {
    opacity: .6;
  }
  #sec_staffblog .main ul.list li a:hover .img figure::after {
    opacity: 1;
    translate: 20px 0;
  }
}
#sec_staffblog .main .moreview {
  position: absolute;
  right: 0;
  top: -1.2em;
}
#sec_staffblog ul.links {
  margin-top: 70px;
  display: flex;
  column-gap: 20px;
}
#sec_staffblog ul.links li {
  width: calc( 100% / 3 );
}
#sec_staffblog ul.links li a {
  display: block;
  background-color: #1A1A3F;
  -webkit-border-top-left-radius: 20px;
  border-top-left-radius: 20px;
  -webkit-border-bottom-right-radius: 20px;
  border-bottom-right-radius: 20px;
  padding: 30px 60px 30px 30px;
  position: relative;
  font-size: 1.125em;
  color: #fff;
  font-weight: 600;
  font-family: "Zen Old Mincho", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#sec_staffblog ul.links li a::after {
  content: "\f054";
  position: absolute;
  right: 30px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  font-family: 'Font Awesome 6 free','Font Awesome 6 Brands';
  font-weight: 900;
  font-size: 18px;
  line-height: 1;
}
@media (any-hover: hover) {
  #sec_staffblog ul.links li a:hover {
    background-color: #1A1A3F;
    color: #FFF;
  }
  #sec_staffblog ul.links li a:hover::after {
    color: #FFF;
  }
}

/* ---------- Reform ---------- */
#sec_reform {
  margin-top: 140px;
}
#sec_reform .title_vrt_box {
  left: var(--ttlngtv);
}
#sec_reform .block_body .img {
  width: 56.67%;
}
#sec_reform .block_body .text {
  padding-left: 2.5vw;
}

/* ---------- Special ---------- */
#sec_special {
  margin-block: 50px 130px;
}
#sec_special .title_vrt_box {
  right: var(--ttlngtv);
}
#sec_special .block_body {
  flex-direction: row-reverse;
}
#sec_special .block_body .img {
  width: 47.83%;
}
#sec_special .block_body .text {
  padding-right: 3.5vw;
}

/* ---------- Reform & Special Common ---------- */
#sec_reform .wrapper,
#sec_special .wrapper {
  position: relative;
}
#sec_reform .title_vrt_box,
#sec_special .title_vrt_box {
  position: absolute;
  top: 0;
}
#sec_reform .block_body,
#sec_special .block_body {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#sec_reform .block_body .img,
#sec_special .block_body .img {
  flex-shrink: 0;
  height: 380px;
  overflow: hidden;
}
#sec_reform .block_body .img figure,
#sec_special .block_body .img figure {
  width: 100%;
  height: 100%;
  position: relative;
}
#sec_reform .block_body .text,
#sec_special .block_body .text {
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: justify;
}
#sec_reform .block_body .text .moreview,
#sec_special .block_body .text .moreview {
  margin-top: 30px;
}

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

 Responsive-Breakpoint-1 ( 1600px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 1600px) {
  /* ------------------------------
   Top
  ------------------------------ */
  /* ---------- News ---------- */
  #top_news {
    width: 40%;
  }

  /* ---------- Main Conetn common ---------- */
  body {
    --ttlngtv: 5vw;
  }

  /* ---------- Event ---------- */
  #sec_event {
    margin-top: 120px;
  }
  #sec_event .wrapper {
    position: static;
    display: flex;
  }
  #sec_event .title_vrt_box {
    position: static;
    white-space: nowrap;
    padding-right: var(--ttlngtv);
  }
  #sec_event .main {
    flex-grow: 1;
  }

  /* ---------- Concept ---------- */
  #sec_concept {
    margin-top: 120px;
  }
  #sec_concept .concept_title .title_vrt_box {
    padding: 25px 50px 0 5vw;
  }
  #sec_concept .concept_body {
    padding-block: 80px;
  }
  #sec_concept .concept_body .wrapper .img {
    height: 360px;
  }

  /* ---------- Works ---------- */
  #sec_works {
    margin: 120px 0 0 140px;
  }
  #sec_works .title_vrt_box {
    left: -90px;
  }
  #sec_works .main .list .slick-list {
    padding: 0 160px 0 0 !important;
  }
  #sec_works .main .list .item {
    margin-right: 30px;
  }
  #sec_works .slick-dots {
    margin-top: 35px;
  }

  /* ---------- Policy ---------- */
  #sec_policy {
    margin-top: 130px;
    padding-bottom: 130px;
  }
  #sec_policy::before {
    height: 27%;
  }
  #sec_policy .title_vrt_box {
    position: static;
    padding-left: var(--ttlngtv);
    white-space: nowrap;
  }
  #sec_policy .flex_wrap {
    display: flex;
    flex-direction: row-reverse;
  }
  #sec_policy ol.list {
    margin-right: 0;
  }
  #sec_policy ol.list li {
    padding-right: 50px;
  }
  #sec_policy ul.banner {
    margin-top: 80px;
    column-gap: 30px;
  }
  #sec_policy ul.banner li a {
    padding: 25px 50px 25px 20px;
  }
  #sec_policy ul.banner li a::after {
    right: 20px;
  }

  /* ---------- Modelhouse ---------- */
  #sec_modelhouse {
    margin-top: 120px;
  }
  #sec_modelhouse .wrapper {
    position: static;
    display: flex;
  }
  #sec_modelhouse .title_vrt_box {
    position: static;
    white-space: nowrap;
    padding-right: var(--ttlngtv);
  }
  #sec_modelhouse .main {
    flex-grow: 1;
  }

  /* ---------- Staff Blog ---------- */
  #sec_staffblog {
    margin-top: 140px;
    padding-block: 65px 120px;
  }
  #sec_staffblog .title_vrt_box {
    display: flex;
    justify-content: center;
  }
  #sec_staffblog ul.links {
    margin-top: 60px;
  }
  #sec_staffblog ul.links li a {
    padding: 25px 50px 25px 20px;
  }
  #sec_staffblog ul.links li a::after {
    right: 20px;
  }

  /* ---------- Reform ---------- */
  #sec_reform {
    margin-top: 120px;
  }
  #sec_reform .title_vrt_box {
    padding-right: var(--ttlngtv);
  }
  #sec_reform .block_body .text {
    padding-left: 4vw;
  }

  /* ---------- Special ---------- */
  #sec_special {
    margin-block: 50px 100px;
  }
  #sec_special .wrapper {
    flex-direction: row-reverse;
  }
  #sec_special .title_vrt_box {
    padding-left: var(--ttlngtv);
  }
  #sec_special .block_body {
    flex-direction: row-reverse;
  }
  #sec_special .block_body .text {
    padding-right: 4vw;
  }

  /* ---------- Reform & Special Common ---------- */
  #sec_reform .wrapper,
  #sec_special .wrapper {
    position: static;
    display: flex;
  }
  #sec_reform .title_vrt_box,
  #sec_special .title_vrt_box {
    position: static;
    white-space: nowrap;
  }
  #sec_reform .block_body,
  #sec_special .block_body {
    flex-grow: 1;
  }
  #sec_reform .block_body .text .moreview,
  #sec_special .block_body .text .moreview {
    margin-top: 25px;
  }
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-2 ( 1300px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 1300px) {
  .wrapper {
    padding-inline: 50px;
  }

  #toparea #toplogo {
    width: 360px;
    top: 30px;
    left: 35px;
  }
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-3 ( 959px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 959px) {
  .wrapper {
    padding-inline: 5vw;
  }

  /* ------------------------------
   Top
  ------------------------------ */
  #toparea {
    height: auto;
    display: block;
    padding-top: 110px;
  }
  #toparea #toplogo {
    width: 300px;
    filter: none;
    top: 30px;
    left: 30px;
  }
  #toparea #topslide1 {
    height: 70svh;
    width: 76%;
    margin-left: auto;
  }
  #toparea .catchcopy {
    position: absolute;
    z-index: 5;
    top: 0;
    left: 0;
    width: calc( 100% - 76% );
    padding-top: 5em;
  }
  #toparea #topslide2 {
    margin-top: 50px;
    height: 45svh;
    width: 74%;
  }

  /* ---------- News ---------- */
  #top_news {
    margin-top: 45px;
    position: static;
    width: 100%;
    padding-inline: 5vw;
  }

  /* ---------- Main Conetn common ---------- */
  body {
    --ttlngtv: 4vw;
  }

  /* ---------- Event ---------- */
  #sec_event {
    margin-top: 90px;
  }
  #sec_event .title_vrt_box {
    padding-right: var(--ttlngtv);
  }
  #sec_event .main ul.list {
    grid-auto-rows: auto 1fr;
    grid-template-columns: 1fr 1fr;
    gap: 50px 30px;
  }
  #sec_event .main ul.list li:first-child {
    grid-row: 1 / 2;
    grid-column: 1 / 3;
  }
  #sec_event .main ul.list li a {
    display: block;
    width: 100%;
    margin: 0;
  }
  #sec_event .main .moreview {
    margin-top: 30px;
  }

  /* ---------- Concept ---------- */
  #sec_concept {
    margin-top: 90px;
  }
  #sec_concept .concept_title .title_vrt_box {
    padding: 20px 5vw 0 4vw;
  }
  #sec_concept .concept_body {
    padding-block: 65px;
  }
  #sec_concept .concept_body .wrapper .img {
    width: 53%;
  }

  /* ---------- Works ---------- */
  #sec_works {
    margin: 90px 0 0 130px;
  }
  #sec_works .title_vrt_box {
    left: -80px;
  }
  #sec_works .main {
    width: 100%;
    overflow: hidden;
  }
  #sec_works .main .list .item {
    margin-right: 25px;
  }
  #sec_works .slick-dots {
    margin-top: 30px;
  }
  #sec_works .moreview {
    margin-top: -10px;
  }

  /* ---------- Policy ---------- */
  #sec_policy {
    margin-top: 100px;
    padding-bottom: 100px;
  }
  #sec_policy::before {
    height: 20%;
  }
  #sec_policy .title_vrt_box {
    padding-left: var(--ttlngtv);
  }
  #sec_policy ol.list li {
    padding-right: 20px;
  }
  #sec_policy ol.list li .item_inner .imgarea {
    margin-bottom: 40px;
  }
  #sec_policy ol.list li .item_inner .imgarea .number {
    bottom: -20px;
  }
  #sec_policy ol.list li .item_inner .text dl {
    padding-top: 30px;
  }
  #sec_policy ol.list li .item_inner .text .moreview {
    margin-top: 15px;
  }
  #sec_policy ul.banner {
    margin-top: 65px;
    display: block;
  }
  #sec_policy ul.banner li {
    width: 100%;
  }
  #sec_policy ul.banner li + li {
    margin-top: 20px;
  }
  #sec_policy ul.banner li a {
    padding: 25px 40px 25px 20px;
  }
  #sec_policy ul.banner li a p.ja {
    letter-spacing: 0;
  }

  .policy_end {
    padding-top: 60%;
  }

  /* ---------- Modelhouse ---------- */
  #sec_modelhouse {
    margin-top: 100px;
  }
  #sec_modelhouse .title_vrt_box {
    padding-right: var(--ttlngtv);
  }
  #sec_modelhouse .main ul.list {
    gap: 50px 2.5vw;
  }

  /* ---------- Staff Blog ---------- */
  #sec_staffblog {
    margin-top: 90px;
    padding-block: 60px 100px;
  }
  #sec_staffblog .main ul.list {
    gap: 45px 3vw;
    grid-template-columns: repeat(2, 1fr);
  }
  #sec_staffblog ul.links {
    margin-top: 50px;
    column-gap: 15px;
  }
  #sec_staffblog ul.links li a {
    padding: 20px 40px 20px 20px;
  }

  /* ---------- Reform ---------- */
  #sec_reform {
    margin-top: 90px;
  }
  #sec_reform .title_vrt_box {
    padding-right: var(--ttlngtv);
  }

  /* ---------- Special ---------- */
  #sec_special {
    margin-block: 50px 90px;
  }
  #sec_special .title_vrt_box {
    padding-left: var(--ttlngtv);
  }

  /* ---------- Reform & Special Common ---------- */
  #sec_reform .block_body,
  #sec_special .block_body {
    display: block;
  }
  #sec_reform .block_body .img,
  #sec_special .block_body .img {
    width: 100%;
    height: 50vw;
  }
  #sec_reform .block_body .text,
  #sec_special .block_body .text {
    padding: 25px 0 0;
  }
  #sec_reform .block_body .text .moreview,
  #sec_special .block_body .text .moreview {
    margin-top: 25px;
  }
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-4 ( 644px )
 
------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 644px) {
  /* ------------------------------
   Top
  ------------------------------ */
  #toparea {
    padding-top: 90px;
  }
  #toparea #toplogo {
    width: 260px;
    top: 20px;
    left: 20px;
  }
  #toparea #topslide1 {
    height: 53svh;
    width: 76.8%;
  }
  #toparea .catchcopy {
    padding-top: 5.5em;
    width: calc( 100% - 76.8% );
    font-size: 28px;
  }
  #toparea #topslide2 {
    margin-top: 25px;
    height: 26svh;
    width: 85%;
  }

  /* ---------- News ---------- */
  #top_news {
    margin-top: 20px;
  }
  #top_news .title_box {
    margin-bottom: 5px;
  }

  /* ---------- Main Conetn common ---------- */
  .title_vrt_box {
    width: 40px;
    flex-shrink: 0;
  }
  .title_vrt_box .sec_title span.en {
    margin-left: 7px;
  }

  /* ---------- Event ---------- */
  #sec_event {
    margin-top: 55px;
  }
  #sec_event .main ul.list {
    display: block;
  }
  #sec_event .main ul.list li {
    margin-bottom: 30px;
  }
  #sec_event .main ul.list li:last-child {
    display: none;
  }
  #sec_event .main ul.list li a .text .posttitle .cat {
    padding: 2px 8px;
    margin-right: 8px;
    font-size: 10px;
  }
  #sec_event .main ul.list li a .text .data {
    padding: 10px 20px;
    background-color: #E5E5E5;
  }
  #sec_event .main ul.list li a .text .data > p span.h {
    display: none;
  }

  /* ---------- Concept ---------- */
  #sec_concept {
    margin-top: 60px;
  }
  #sec_concept .concept_title .title_vrt_box {
    width: 80px;
    padding: 15px 5vw;
  }
  #sec_concept .concept_title .img {
    height: 60vw;
    min-height: 300px;
  }
  #sec_concept .concept_body {
    padding-block: 30px 60px;
  }
  #sec_concept .concept_body .wrapper {
    display: block;
  }
  #sec_concept .concept_body .wrapper .text {
    padding: 0 0 45px;
  }
  #sec_concept .concept_body .wrapper .img {
    margin-inline: auto -5vw;
    width: 85vw;
    height: 200px;
  }

  /* ---------- Works ---------- */
  #sec_works {
    margin: 70px 0 0 70px;
  }
  #sec_works .title_vrt_box {
    left: -50px;
  }
  #sec_works .main .list .slick-list {
    padding: 0 !important;
  }
  #sec_works .main .list .item {
    margin-inline: 20px 0;
  }
  #sec_works .main .list .item a .posttitle {
    font-size: 14px;
    margin-right: 5vw;
  }
  #sec_works .slick-dots {
    margin: 20px 0 0 20px;
    gap: 5px;
  }
  #sec_works .slick-dots > li button {
    width: 7px;
    height: 7px;
  }
  #sec_works .moreview {
    margin-top: -15px;
  }

  /* ---------- Policy ---------- */
  #sec_policy {
    margin-top: 80px;
    padding-bottom: 90px;
    background-color: transparent;
  }
  #sec_policy::before {
    display: none;
  }
  #sec_policy ol.list {
    display: block;
    margin-left: -5vw;
    padding-right: 4vw;
  }
  #sec_policy ol.list li {
    width: 100%;
    padding: 0 0 50px;
  }
  #sec_policy ol.list li .item_inner .imgarea .img {
    aspect-ratio: 1.5 / 1;
    margin-bottom: 0;
  }
  #sec_policy ol.list li .item_inner .imgarea .img::before {
    background: linear-gradient(135deg, rgba(229, 229, 229, 0) 0, rgba(229, 229, 229, 0) 70%, rgba(229, 229, 229, 0.9) 100%);
  }
  #sec_policy ol.list li .item_inner .imgarea .number {
    right: 10px;
    bottom: -20px;
  }
  #sec_policy ol.list li .item_inner .text {
    padding: 0 5vw;
  }
  #sec_policy ol.list li .item_inner .text dl {
    padding-top: 15px;
  }
  #sec_policy ol.list li .item_inner .text dl dt {
    margin-bottom: 5px;
  }
  #sec_policy ol.list li .item_inner .text dl dd p {
    font-size: 12px;
  }
  #sec_policy ul.banner {
    margin: 0;
  }
  #sec_policy ul.banner li + li {
    margin-top: 15px;
  }
  #sec_policy ul.banner li a {
    padding: 25px 45px 25px 25px;
  }

  .policy_end {
    padding-top: 90%;
  }

  /* ---------- Modelhouse ---------- */
  #sec_modelhouse {
    margin-top: 60px;
  }
  #sec_modelhouse .main ul.list {
    display: block;
  }
  #sec_modelhouse .main ul.list li {
    display: block;
  }
  #sec_modelhouse .main ul.list li + li {
    margin-top: 50px;
  }
  #sec_modelhouse .main ul.list li a .posttitle {
    margin-top: 0;
    border-top: none;
  }

  /* ---------- Staff Blog ---------- */
  #sec_staffblog {
    margin-top: 60px;
    padding-block: 50px 90px;
  }
  #sec_staffblog .title_vrt_box {
    width: auto;
    display: flex;
    justify-content: center;
  }
  #sec_staffblog .title_vrt_box .sec_title {
    margin-left: 1.5em;
  }
  #sec_staffblog .main {
    position: static;
  }
  #sec_staffblog .main ul.list li:nth-last-child(1), #sec_staffblog .main ul.list li:nth-last-child(2) {
    display: none;
  }
  #sec_staffblog .main ul.list li a {
    display: block;
  }
  #sec_staffblog .main ul.list li a .img {
    margin-bottom: 15px;
  }
  #sec_staffblog .main ul.list li a .text .postdata .author span.name {
    margin-right: 5px;
  }
  #sec_staffblog .main ul.list li a .text .postdata .author span.ph {
    width: 32px;
    height: 32px;
  }
  #sec_staffblog .main .moreview {
    position: static;
    display: flex;
    justify-content: center;
    margin-top: 30px;
  }
  #sec_staffblog ul.links {
    margin-top: 50px;
    display: block;
  }
  #sec_staffblog ul.links li {
    width: 100%;
  }
  #sec_staffblog ul.links li + li {
    margin-top: 10px;
  }
  #sec_staffblog ul.links li a {
    padding: 12px 30px 12px 20px;
  }

  /* ---------- Reform ---------- */
  #sec_reform {
    margin-top: 50px;
  }

  /* ---------- Special ---------- */
  #sec_special {
    margin-block: 60px 70px;
  }

  /* ---------- Reform & Special Common ---------- */
}
