@charset "UTF-8";

/* ========================================
   @media screen and (min-width: 768px),print
======================================== */
@media screen and (min-width: 768px),print {

/* main-ttl-wrap
-------------------------------------*/
#modelcase .main-ttl-wrap {
  padding: 22.2rem 0 11.65rem;
}
#modelcase .main-ttl-wrap .en {
   font-size: 13px;
   line-height: 1.2307692308;
   letter-spacing: 0em;
   font-weight: 400;
   color: #8E7016;
   text-align: center;
   margin-bottom: 2.3125rem;
 }
 #modelcase .main-ttl-wrap h1 {
   font-size: 32px;
   line-height: 1.625;
   letter-spacing: 0.05em;
   font-weight: 400;
   margin-bottom: 4.15rem;
 }
 #modelcase .main-ttl-wrap .main-txt {
   font-size: 16px;
   line-height: 2;
   letter-spacing: 0.05em;
   font-weight: 400;
   text-align: center;
 }


 /* modelcase
 -------------------------------------*/
 .modelcase {
   background: url(../images/modelcase/modelcase-bg.png)no-repeat bottom center;
   background-size: cover;
   max-width: 1920px;
   margin-inline: auto;
   width: 100%;
 }
 .modelcase h2 {
   font-size: 40px;
   line-height: 1.2;
   letter-spacing: 0em;
   font-weight: 700;
   position: relative;
   padding: 0 0 0 10.6rem;
   display: flex;
   gap: 0.7rem;
   margin-bottom: 7.7rem;
 }
 .modelcase h2::before {
   position: absolute;
   content: "";
   background: #707070;
   width: 8.75rem;
   height: 1px;
   top: 50%;
   left: 0;
   transform: translateY(-50%);
 }
 .modelcase .case-item {
   width: min(95%, 1400px);
   margin-inline: auto;
   display: grid;
   gap: calc(180 / 1920 * 100vw);
   position: relative;
   margin-bottom: calc(240 / 1920 * 100vw);
 }
 .modelcase .case-item::after {
   content: "";
   position: absolute;
   bottom: 30rem;
   left: 50%;
   width: 1px;
   height: 263.5625rem;
   border-left: 1px dotted #707070;
   transform: translateX(-50%);
   pointer-events: none;
 }
 .modelcase .case-item li h3 {
   font-size: clamp(1.75rem, 1.583rem + 0.35vw, 2rem);
   line-height: 1.28125;
   letter-spacing: 0.05em;
   font-weight: 500;
   color: #908672;
   margin-bottom: calc(43 / 1920 * 100vw);
 }
 .modelcase .case-item li .txt {
   font-size: clamp(0.875rem, 0.792rem + 0.17vw, 1rem);
   line-height: 2;
   letter-spacing: 0.05em;
   font-weight: 400;
   margin-bottom: calc(32 / 1920 * 100vw);
 }
 .modelcase .case-item li .txt-box .txt:nth-last-of-type(2) {
   margin-bottom: calc(20 / 1920 * 100vw);
 }
 .modelcase .case-item li .en-txt {
   font-size: clamp(0.625rem, 0.458rem + 0.35vw, 0.875rem);
   line-height: 1.4285714286;
   letter-spacing: 0.05em;
   font-weight: 400;
   color: #908672;
 }
 .modelcase .case-item li .photo img {
   width: 100%;
   height: auto;
 }

 /* odd */
 .modelcase .case-item li:nth-child(odd) {
   display: grid;
   grid-template-columns: 50% 39.7142%;
   gap: 5.25rem;
 }
 .modelcase .case-item li:nth-child(odd) .photo {
   order: 1;
 }
 .modelcase .case-item li:nth-child(odd) .txt-box {
   order: 2;
   margin: calc(109 / 1920 * 100vw) 0 0;
 }

 /* even */
 .modelcase .case-item li:nth-child(even) {
   display: grid;
   grid-template-columns: 44% 50%;
   gap: 5.25rem;
 }
 .modelcase .case-item li:nth-child(even) .txt-box {
   padding-left: 3.75rem;
   margin-top: calc(27 / 1920 * 100vw);
 }

  /* item02 */
 .modelcase .case-item .item02 .en-txt {
   font-size: 12px;
   line-height: 1.6666;
 }

 /* item03 */
 .modelcase .case-item li.item03 .txt-box {
   margin-top: calc(60 / 1920 * 100vw);
 }

 /* item04 */
 .modelcase .case-item li.item04 .txt-box {
   margin-top: calc(55 / 1920 * 100vw);
 }

 /* item05 */
 .modelcase .case-item li.item05 .txt-box {
   margin-top: calc(55 / 1920 * 100vw);
 }

 /* item06 */
 .modelcase .case-item .item06 {
  margin-top: calc(8 / 1920 * 100vw);
 }
 .modelcase .case-item .item06 .txt {
   color: #333333;
 }


/* item07 08 */
 .modelcase .case-item .item07 h3,
 .modelcase .case-item .item08 h3 {
   color: #F0EFEB;
 }
 .modelcase .case-item .item07 .en-txt,
 .modelcase .case-item .item08 .en-txt {
   color: #D1D1D1;
 }

  /* item07 */
  .modelcase .case-item .item07 {
    margin-top: calc(12 / 1920 * 100vw);
   }
   .modelcase .case-item li.item07 .txt-box {
    margin-top: calc(74 / 1920 * 100vw);
  }
 .modelcase .case-item .item07 .txt {
   color: #F0EFEB;
 }

   /* item08 */
   .modelcase .case-item .item08 {
    margin-top: calc(-14 / 1920 * 100vw);
   }
   .modelcase .case-item li.item08 .txt-box {
    margin-top: calc(25 / 1920 * 100vw);
  }
 .modelcase .case-item .item08 .txt {
   color: #E9E8E4;
 }


 .modelcase .bottom-photo {
   position: relative;
 }
 .modelcase .bottom-photo .photo {
   max-width: 1920px;
   margin-inline: auto;
   width: 100%;
 }
 .modelcase .bottom-photo .photo img {
   width: 100%;
   height: auto;
 }
 .modelcase .bottom-photo .txt {
   position: absolute;
   bottom: 5.95rem;
   left: 50%;
   transform: translateX(-50%);
   font-size: clamp(1.25rem, 1.083rem + 0.35vw, 1.5rem);
   line-height: 1.7083333333;
   letter-spacing: 0.05em;
   font-weight: 500;
   color: #FFFFFF;
 }


 /* sec
 -------------------------------------*/
 .sec .en-ttl {
    font-size: 20px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 0.05em;
    color: #908672;
    text-align: center;
    margin-bottom: 1rem;
 }
 .sec h2 {
    font-size: 24px;
    font-weight: 500;
    line-height: 1.7083;
    letter-spacing: 0.05em;
    text-align: center;
 }

 
 /* lineup
 -------------------------------------*/
 .lineup {
  padding-top: 11.35rem;
  margin-bottom: 10rem;
 }
 .lineup h2 {
  margin-bottom: 3.4rem;
 }
 .lineup .item {
  width: min(95%, 1040px);
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 2.5rem;
  justify-content: center;
 }

 /* gallery
 -------------------------------------*/
 .gallery h2 {
  margin-bottom: 5rem;
 }
 .gallery .btn {
  margin-left: auto;
  width: 6.625rem;
  position: relative;
  top: -8rem;
  margin-bottom: -2.65rem;
 }
 .gallery .btn a {
    font-size: 12px;
    line-height: 1.25;
}
 .gallery  .inner {
  width: min(95%, 1325px);
  margin-inline: auto;
  padding-bottom: 15rem;
 }
 .gallery .system-list {
  gap: 2.5rem;
 }
 .gallery .system-list li:nth-child(4) {
  display: none;
  }
  .gallery .system-pic {
    margin-bottom: 0.8rem;
}
  .gallery .system-pic img {
    height: 17.313rem;
}
  .gallery .system-area {
    font-size: 11px;
    line-height: 2;
    color: #1C1C1C;
    margin-bottom: 0.5rem;
}
  .gallery .system-ttl-01 {
    font-size: 20px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.05em;
    border-bottom: 1px solid #1C1C1C;
    display: inline-block;
}
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1500px)
======================================== */
@media screen and (min-width:768px) and (max-width:1500px) {
  .modelcase .case-item::after{
    height: 83.1%;
    bottom: 9.3%;
  }
  .modelcase .case-item li:nth-child(odd),
  .modelcase .case-item li:nth-child(even) {
    gap: calc(84 / 1500 * 100vw);
  }
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1000px)
======================================== */
@media screen and (min-width:768px) and (max-width:1000px) {
  .modelcase .case-item::after{
    height: 83.8%;
    bottom: 11%;
  }
}

/* ========================================
   @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {
/* main-ttl-wrap
-------------------------------------*/
#modelcase .main-ttl-wrap {
  padding: 54vw 0 22.8vw;
}
#modelcase .main-ttl-wrap .en {
  font-size:3.14vw;
  line-height: 1.2307692308;
  letter-spacing: 0em;
  font-weight: 400;
  color: #8E7016;
  text-align: center;
  margin-bottom: 12.5vw;
 }
 #modelcase .main-ttl-wrap h1 {
  font-size:4.831vw;
  line-height: 1.75;
  letter-spacing: 0.05em;
  font-weight: 400;
  margin-bottom: 7.6vw;
 }
 #modelcase .main-ttl-wrap .main-txt {
  font-size:3.382vw;
   line-height: 2.285714;
   letter-spacing: 0.05em;
   font-weight: 400;
   text-align: center;
 }


 /* modelcase
 -------------------------------------*/
 .modelcase {
  background: url(../images/modelcase/modelcase-bg_sp.png)no-repeat bottom center;
  background-size: cover;
}
.modelcase h2 {
  font-size:5.797vw;
  line-height: 1.2083333;
  letter-spacing: 0em;
  font-weight: 700;
  position: relative;
  padding: 0 0 0 11vw;
  display: flex;
  gap: 0.4vw;
  margin-bottom: 14.5vw;
}
.modelcase h2::before {
  position: absolute;
  content: "";
  background: #707070;
  width: 9vw;
  height: 0.2vw;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.modelcase .case-item {
  width: 94vw;
  margin-inline: auto;
  display: grid;
  gap: 28.6vw;
  position: relative;
  margin-bottom: 57vw;
}
.modelcase .case-item li {
  display: grid;
  position: relative;
}
.modelcase .case-item li::after {
  content: "";
  position: absolute;
  bottom: -23.4vw;
  left: 50%;
  width: 0.2vw;
  height: 14.5vw;
  border-left: 0.2vw dotted #707070;
  transform: translateX(-50%);
  pointer-events: none;
}
.modelcase .case-item li:nth-child(7)::after,
.modelcase .case-item li:nth-child(8)::after{
  border-left: 0.2vw dotted #fff;
}
.modelcase .case-item li .txt-box {
  display: contents;
}
.modelcase .case-item li h3 {
  font-size:6.763vw;
  line-height: 1.464285;
  letter-spacing: 0.05em;
  font-weight: 500;
  color: #908672;
  margin-bottom: 2.8vw;
  order: 1;
  width: 82.126vw;
  margin-inline: auto;
}
.modelcase .case-item li .txt {
  font-size:3.382vw;
  line-height: 2.285714;
  letter-spacing: 0.05em;
  font-weight: 400;
  margin-bottom: 0vw;
  order: 3;
  width: 82.126vw;
  margin-inline: auto;
}
.modelcase .case-item li .txt-box .txt:nth-last-of-type(2) {
  margin-bottom: 7.3vw;
}
.modelcase .case-item li .en-txt {
  font-size:2.415vw;
  line-height: 1.8;
  letter-spacing: 0.05em;
  font-weight: 400;
  color: #C0BAAF;
  order: 4;
  width: 82.126vw;
  margin-inline: auto;
  text-align: right;
}
.modelcase .case-item li .photo {
  order: 2;
  margin-bottom: 6.2vw;
}
.modelcase .case-item li .photo img {
  width: 100%;
  height: auto;
}
 /* item01 */
.modelcase .case-item .item01 .txt-box .txt:nth-last-of-type(2) {margin-bottom: 4.8vw;}
 /* item02 */
.modelcase .case-item .item02 .txt-box .txt:nth-last-of-type(2) {margin-bottom: 4.8vw;}

/* item07 08 */
.modelcase .case-item .item07 h3,
.modelcase .case-item .item08 h3 {
  color: #FFFFFF;
}
.modelcase .case-item .item07 .txt,
.modelcase .case-item .item08 .txt {
  color: #FFFFFF;
}
.modelcase .case-item .item07 .en-txt,
.modelcase .case-item .item08 .en-txt {
  color: #D1D1D1;
}

.modelcase .bottom-photo {
  position: relative;
}
.modelcase .bottom-photo .photo {
  max-width: 100vw;
  margin-inline: auto;
  width: 100%;
}
.modelcase .bottom-photo .photo img {
  width: 100%;
  height: auto;
}
.modelcase .bottom-photo .txt {
  position: absolute;
  bottom: 9vw;
  left: 50%;
  transform: translateX(-50%);
  font-size:4.831vw;
  line-height: 1.6;
  letter-spacing: 0.05em;
  font-weight: 500;
  color: #FFFFFF;
  width: 81.4vw;
}

 /* sec
 -------------------------------------*/
 .sec .en-ttl {
  font-size:3.865vw;
  font-weight: 400;
  line-height: 1.1875;
  letter-spacing: 0.05em;
  color: #908672;
  text-align: center;
  margin-bottom: 1.8vw;
}
.sec h2 {
  font-size:4.831vw;
  font-weight: 500;
  line-height: 1.75;
  letter-spacing: 0.05em;
  text-align: center;
}

 /* lineup
 -------------------------------------*/
 .lineup {
  padding-top: 29vw;
  margin-bottom: 19vw;
 }
 .lineup h2 {
  margin-bottom: 11.4vw;
 }
 .lineup .item {
  width: 89.375vw;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4.8vw 2.4vw;
 }

  /* gallery
 -------------------------------------*/
 .gallery h2 {
  margin-bottom: 5vw;
 }
 .gallery .btn {
  width: 29.72vw;
  position: relative;
  top: 1vw;
  margin: 0 0 8vw auto;
 }
 .gallery .btn a {
  font-size:3.382vw;
  line-height: 1.21428;
}
 .gallery  .inner {
  width: 89.375vw;
  margin-inline: auto;
  padding-bottom: 33.2vw;
 }
 .gallery .system-list {
  gap: 4.4vw 2.415vw;
 }
  .gallery .system-pic {
    margin-bottom: 1.9vw;
}
  .gallery .system-pic img {
    height: 29vw;
}
  .gallery .system-area {
    font-size:2.898vw;
    line-height: 2;
    color: #1C1C1C;
}
  .gallery .system-ttl-01 {
    font-size:3.623vw;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.05em;
    border-bottom: 0.2vw solid #1C1C1C;
    display: inline-block;
}
}