.precious-page { overflow-x: hidden; color: #111; }
.precious-hero { position: relative; }
.precious-hero picture { display: block; }
.precious-hero img { display: block; width: 100%; }
.precious-hero__title { position: absolute; top: 10%; left: 8%; margin: 0; }
.precious-intro { padding-top: 72px; padding-bottom: 110px; }
.precious-intro h2 { margin-bottom: 46px; }
.precious-intro p { max-width: 860px; margin-inline: auto; }
.precious-gem { position: relative; padding: 74px 0 115px; background: #153d70 url("../../img/renewal/3preciousgemstones/3preciousgemstones_bg.png") center top / cover no-repeat; }
.precious-gem__inner { position: relative; z-index: 1; }

.precious-slider__main { display: grid; width: min(74%, 620px); margin: 0 auto; aspect-ratio: 1; place-items: center; }
.precious-slider__main img { width: 100%; height: 100%; object-fit: contain; }
.precious-slider__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 24px auto 0; }
.precious-slider__thumb { padding: 0; overflow: hidden; background: #fff; border: 1px solid transparent; cursor: pointer; }
.precious-slider__thumb.is-active { border-color: #225C8D; }
.precious-slider__thumb img { width: 100%; aspect-ratio: 1.35; object-fit: contain; }
.precious-gem__copy { width: 95%; margin: 65px auto 0; }
.precious-gem__copy h3 { margin: 0 0 34px; font-size: 22px; font-weight: 500; line-height: 1.65; text-align: center; }
.precious-gem__copy p { margin: 0; font-size: 15px; line-height: 1.9; }
.precious-gem__button { display: grid; width: min(78%, 430px); min-height: 54px; margin: 62px auto 0; border: 1px solid #777; border-radius: 999px; place-items: center; font-size: 16px; }
.precious-rare { padding: 100px 0 120px; background: #f8f8f8; }
.precious-rare__heading { width: min(74%, 540px); margin: 0 auto 25px; padding-bottom: 20px; border-bottom: 1px solid #111; font-family: "Zen Old Mincho", "Yu Mincho", serif; font-size: 25px; font-weight: 600; text-align: center; }
.precious-rare__lead { margin: 0 0 64px; font-family: "Zen Old Mincho", "Yu Mincho", serif; font-size: 20px; line-height: 1.7; text-align: center; font-weight: 600; }
.precious-rare__list { display: grid; gap: 90px; }
.precious-rare__item h3 { position: relative; margin: 0 0 25px; padding-left: 40px; font-size: 16px; font-weight: 500; line-height: 1.55; letter-spacing: .04em; }
.precious-rare__item h3::before { position: absolute; top: .75em; left: 0; width: 25px; height: 1px; background: #111; content: ""; }
.precious-rare__item h3 span { display: block; }
.precious-rare__item img { width: 100%; border-radius: 8px 8px 0 0; }
.precious-rare__item p { margin: 30px 0 0; font-size: 15px; line-height: 2; }
@media (min-width: 768px) {
  .precious-gem { padding: 105px 0 120px; }
  .precious-gem__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto auto auto auto;
    column-gap: 72px;
    align-items: start;
  }

  .precious-slider {
    grid-column: 1;
    grid-row: 3 / 5;
    min-width: 0;
  }
  .precious-slider__main {
    width: 300px;
    height: 300px;
    margin-top: 22px;
    aspect-ratio: auto;
  }
  .precious-slider__main img {
    width: 300px;
    height: 300px;
    object-fit: contain;
  }
  .precious-slider__thumbs {
    max-width: 520px;
    margin: 28px auto 50px;
  }
  .precious-gem__copy { display: contents; }
  .precious-gem__copy h3 {
    grid-column: 1 / -1;
    grid-row: 2;
    margin: 0 0 54px;
    padding: 32px 0;
    color: #fff;
    font-family: "Zen Old Mincho", "Yu Mincho", serif;
    font-size: 25px;
  }
  .precious-gem__copy p {
    grid-column: 2;
    grid-row: 3;
    font-size: 18px;
    line-height: 2;
  }
  .precious-gem__button {
    grid-column: 2;
    grid-row: 4;
    width: min(88%, 430px);
    margin-top: 58px;
    border: 0;
    border-radius: 0;
    color: #fff;
    background: #78a5d5;
        margin: 62px auto 50px;
  }
  #sapphire .precious-slider { grid-column: 2; }
  #sapphire .precious-gem__copy p,
  #sapphire .precious-gem__button { grid-column: 1; }

  .precious-rare__heading {
    width: auto;
    margin-bottom: 34px;
    padding-bottom: 0;
    border-bottom: 0;
    font-size: 38px;
            padding-top: 70px;
  }
  .precious-rare__lead { margin-bottom: 78px; }
  .precious-rare__lead br { display: none; }
  .precious-rare__list { grid-template-columns: 1fr; gap: 76px; }
  .precious-rare__item {
    display: grid;
    grid-template-columns: minmax(0, 38%) minmax(0, 1fr);
    column-gap: 42px;
    align-items: start;
  }
  .precious-rare__item h3 {
    grid-column: 1 / -1;
    margin-bottom: 30px;
    font-size: 22px;
  }
  .precious-rare__item h3::before { 

  }
  .precious-rare__item h3 span { 

  }
  .precious-rare__item img { grid-column: 1; }
  .precious-rare__item p {
    grid-column: 2;
    margin: 0;
    font-size: 18px;
    line-height: 2;
  }
}
@media (max-width: 767px) {
  .precious-intro { padding-top: 64px; padding-bottom: 100px; }
  .precious-slider__main { width: 72%; }
  .precious-slider__thumbs { gap: 5px; margin-top: 19px; }
  .precious-gem__copy { margin-top: 56px; }
  .precious-gem__copy h3 { font-size: 18px; }
  .precious-gem__copy p { font-size: 13px; }
  .precious-rare__item p { font-size: 13px; }
}

/* 統合したPC表示 */
@media (min-width:768px){
  .precious-hero{max-width:1920px;max-height:none;margin-inline:auto;overflow:hidden}
  .precious-hero img{width:100%;height:auto;min-height:0;object-fit:contain;object-position:center}
  .precious-hero__title{top:35%;left:7%}
  .precious-section{max-width:1100px;margin-right:auto;margin-left:auto}
}
