@charset "UTF-8";

.kihei-page {
  color: #231818;
}
.kihei-hero {
  min-height: 510px;
  overflow: hidden;
  background: #fff;
}
.kihei-hero picture,.kihei-hero img{display:block;width:100%;height:100%}.kihei-hero img{min-height:510px;object-fit:cover;object-position:center}

.kihei-menu { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.kihei-menu a, .kihei-menu img { display: block; width: 100%;    height: 100% }

.kihei-intro { padding: 68px 5% 82px; background: #fff url(../../img/renewal/kihei/kihei_bg.png) center bottom / 100% auto no-repeat; text-align: center; }
.kihei-intro__lead { margin: 0 0 85px; font-family: "Zen Old Mincho", serif; font-size: 20px; line-height: 1.8; }
.kihei-intro__body p { margin: 48px 0 0; font-family: "Zen Old Mincho", serif; font-size: 14px; line-height: 2.2; letter-spacing: 0.1em;}

.kihei-ornament-title { margin: 0; font-family: "Sterling Display", "Times New Roman", serif; font-size: 22px; font-weight: 400; text-align: center; }
.kihei-ornament-title span { display: flex; align-items: center; gap: 12px; justify-content: center;     font-weight: 600;
  letter-spacing: 0.095em;
}

.kihei-ornament-title small { display: block; margin-top: 7px; font-family: "Zen Old Mincho", serif; font-size: 12px; letter-spacing: .24em; }
.kihei-ornament-title  small::before, .kihei-ornament-title  small::after {    width: 80px;
    height: 1px;
    background: #a9a9a9;
    content: "";
    display: inline-block;
    margin: 4px 16px; }
.kihei-attractions { padding: 72px 7% 105px; }
.kihei-detail-heading { display: flex; align-items: center; gap: 7px; margin: 0 0 50px; font-family: "Zen Old Mincho", serif; font-size: 20px; font-weight: 500; }
.kihei-detail-heading img { width: 22px; height: auto; }
.kihei-detail-heading small { display: block; margin-top: 3px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;font-size: 11px; font-weight: 400; }

.kihei-attractions__list { display: grid; gap: 38px; margin: 0; padding: 0; list-style: none; text-align: center; }
.kihei-attractions__list li { position: relative; min-height: 140px; }
.kihei-attractions__number{
    position: absolute;
    z-index: 0;
    top: -45px;
    left: 50%;
    color: #f3f3f3;
    font-size: 170px;
    font-weight: 700;
    line-height: 1;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    transform: translateX(-50%);
}
.kihei-attractions__list b, .kihei-attractions__list small { display: block; position: relative; z-index: 1; }
.kihei-attractions__list b { font-size:31px; letter-spacing: .06em; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;    margin-top: 23px;}
.kihei-attractions__list small { margin-top: 10px; font-family: "Zen Old Mincho", serif; font-size: 11px; }

.kihei-types { padding: 78px 0 100px; background: #f1f1f1; }
.kihei-types__lead { margin: 62px 0 70px; font-family: "Zen Old Mincho", serif; font-size: 14px; line-height: 2; text-align: center;letter-spacing: 0.1em; }
.kihei-detail + .kihei-detail { margin-top: 78px; }
.kihei-detail + .kihei-spec-grid { margin-top: 78px; }
.kihei-detail > p { margin: 20px 0 0; font-size: 13px; line-height: 1.55; }
.kihei-detail__image { display: block; width: 78%;     margin: 30px auto; }
.kihei-detail__note { font-size: 11px !important; }
.kihei-material { display: grid; width: 72%; margin: 35px auto 0; text-align: center; }
.kihei-material b { padding: 12px 0 7px; border-bottom: 1px solid #c9ab77; font-size: 25px;  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
.kihei-material b:nth-of-type(2) { border-bottom-color: #aaa; }
.kihei-material span { padding: 10px 0 2px; font-family: "Zen Old Mincho", serif; font-size: 20px; }
.kihei-cut-grid {
  display: grid;
  gap: 34px;
  margin-top: 28px;
}

.kihei-cut-grid article {
  width: 88%;
  margin: 0 auto;
  background: transparent;
}

.kihei-cut-grid img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  aspect-ratio: 1.72;
  object-fit: cover;
}

.gray_bg {
  position: relative;
  z-index: 2;
  width: 80%;
  margin: -30px auto 0;
  padding: 8% 9%;
  background: #eee;
}

.gray_bg h4 {
  margin: 0 0 16px;
  font-size: 14px;
}

.gray_bg p {
  margin: 0;
  font-size: 10px;
  line-height: 1.5;
}
.kihei-detail__image--ami { width: 100%; margin-top: 30px; }
.kihei-detail__picture{display:block}

.kihei-spec-list { margin: 26px 0 0; }
.kihei-spec-list dt { margin-top: 16px; font-size: 19px; font-weight: 700;  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; }
.kihei-spec-list dd { margin: 4px 0 0; font-size: 13px; line-height: 1.45; }

.kihei-page .shopping-guide { margin-top: 108px; }

@media (min-width: 768px) {
  .kihei-main { width: 100%; max-width: none; margin: 0; }
  .kihei-attractions {
    padding: 72px 0% 105px;
}
  .kihei-intro__lead {
    font-size: 30px;
}
  .kihei-hero { width:100%;max-width:none;margin-inline:auto;min-height:0;aspect-ratio:auto; }
  .kihei-hero picture,.kihei-hero img{width:100%;height:auto}
  .kihei-hero img{min-height:0;object-fit:contain;aspect-ratio:auto}
  .kihei-menu{max-width:1100px}
  .kihei-intro{width:min(calc(100% - 80px),1100px);max-width:1100px;margin-inline:auto;    background-position-y: 94%;}
  .kihei-ornament-title {
    font-size: 40px;
  }
  .kihei-ornament-title small {
    font-size: 20px;
  }
  .kihei-intro__body p {
    font-size: 20px;
  }
  .kihei-detail-heading {
    font-size: 28px;
  }
  .kihei-detail-heading img {
    width: 26px;
}
.kihei-detail-heading small {
    font-size: 14px;
}

.kihei-attractions__number {
    font-size: 250px;
  }
.kihei-attractions__list b {
    font-size: 36px;
    margin-top: 65px;
}
.kihei-attractions__list small {
    font-size: 18px;
}
.kihei-types__lead {
    font-size: 20px;
  }
  .kihei-types{width:100%;max-width:none}
  .kihei-types__inner { padding-bottom: 120px; }
  .kihei-types__lead { margin: 72px 0 120px; line-height: 2.1; }

  .kihei-detail + .kihei-detail { margin-top: 130px; }
  .kihei-detail-heading { margin-bottom: 42px; }

  .kihei-detail--material {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    grid-template-rows: auto auto auto 1fr;
    column-gap: 72px;
    align-items: start;
  }
  .kihei-detail--material .kihei-detail-heading { grid-column: 1; grid-row: 1; }
  .kihei-detail--material > p { grid-column: 1; }
  .kihei-detail--material .kihei-detail__image {
    grid-column: 2;
    grid-row: 1 / 5;
    align-self: center;
    width: 100%;
    margin: 0;
  }
  .kihei-detail--material .kihei-material {
    grid-column: 1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    margin-top: 48px;
  }
  .kihei-detail--material .kihei-material b { grid-row: 1; font-size: 25px; }
  .kihei-detail--material .kihei-material span { grid-row: 2; font-size: 20px; }

  .kihei-detail--cut > .kihei-detail-heading { justify-content: center; }
  .kihei-detail--cut > p { margin-bottom: 92px; }
  .kihei-cut-grid { display: grid; grid-template-columns: 1fr; gap: 110px; }
  .kihei-cut-grid article {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr);
    align-items: center;
    width: 100%;
    margin: 0;
  }
  .kihei-cut-grid article:nth-child(even) { grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr); }
  .kihei-cut-grid article:nth-child(even) img { grid-column: 2; }
  .kihei-cut-grid article:nth-child(even) .gray_bg { grid-column: 1; grid-row: 1; }
  .kihei-cut-grid img { width: 100%; aspect-ratio: 1.72; }
  .kihei-cut-grid .gray_bg {
    box-sizing: border-box;
    width: calc(100% + 42px);
    margin: 0 0 0 -42px;
    padding: 44px 48px;
  }
  .kihei-cut-grid article:nth-child(even) .gray_bg { margin: 0 -42px 0 0; }
  .gray_bg h4 { font-size: 20px; }
  .gray_bg p { font-size: 16px; line-height: 1.9; }

  .kihei-spec-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 72px;
    margin-top: 130px;
  }
  .kihei-detail + .kihei-spec-grid { margin-top: 130px; }
  .kihei-spec-grid .kihei-detail {
    display: grid;
    grid-template-rows: auto auto auto;
    margin-top: 0;
  }
  .kihei-spec-grid .kihei-detail-heading { grid-row: 1; justify-content: center; }
  .kihei-spec-grid .kihei-detail > p { display: none; }
  .kihei-spec-grid .kihei-detail__image { grid-row: 3; width: 100%; margin: 42px 0 0; }
  .kihei-spec-list {
    display: grid;
    grid-row: 2;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 28px 34px;
    min-height: 260px;
    margin: 0;
    align-content: start;
  }
  .kihei-spec-list dt,
  .kihei-spec-list dd { margin: 0; }
  .kihei-spec-list dt { font-size: 25px; }
  .kihei-spec-list dd { font-size: 18px; line-height: 1.6; }

.kihei-detail > p {
    font-size: 18px;
}
  .kihei-detail__note { font-size: 16px !important; }
  
  .kihei-detail__picture .kihei-detail__image--ami{width:60%;margin-top:36px;aspect-ratio:1511/676;object-fit:contain}
}
@media (min-width: 1024px) {
  .kihei-attractions__list{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
  .kihei-menu{grid-template-columns:repeat(4,minmax(0,1fr));max-width:100%}
  .kihei-cut-grid{grid-template-columns:1fr;gap:110px}
}
