w1:root{--green:#064d3b;--paper:#faf8f1;--yellow:#ffdb40}html{scroll-behavior:smooth}body:has(.kotomori-home){background:var(--paper)}body:has(.kotomori-home) .wp-site-blocks>header,body:has(.kotomori-home) .wp-site-blocks>footer,body:has(.kotomori-home) .wp-block-post-title{display:none}body:has(.kotomori-home) .wp-site-blocks>main,body:has(.kotomori-home) .entry-content{margin:0;max-width:none;padding:0}body:has(.kotomori-home) .entry-content>*{max-width:none!important;margin-block:0}.kotomori-home,.kotomori-home *{box-sizing:border-box}.kotomori-home{font-family:Arial,'Hiragino Kaku Gothic ProN','Noto Sans JP',sans-serif;color:var(--green);background:var(--paper);line-height:1.6;overflow:hidden}.kotomori-home h1,.kotomori-home h2,.kotomori-home h3,.kotomori-home p{margin:0}.kotomori-home a{text-decoration:none;color:inherit}.kotomori-home img{display:block;width:100%;height:100%;object-fit:cover}.km-wrap{width:min(94%,1440px);margin:auto}.km-head{display:flex;justify-content:space-between;align-items:center;gap:22px;padding:18px 4%;min-height:82px}.km-logo{font-size:23px;letter-spacing:.18em;font-weight:900;white-space:nowrap}.km-logo span{display:inline-grid;place-items:center;margin-right:11px;border:3px solid;border-radius:50%;width:38px;height:38px;letter-spacing:0}.km-nav{display:flex;gap:clamp(12px,2.5vw,36px);align-items:center;font-size:12px;letter-spacing:.1em;font-weight:800}.km-nav a:hover,.km-link:hover{opacity:.65}.km-pill{display:inline-block;background:var(--green);color:white!important;border-radius:99px;padding:11px 22px;font-size:12px;font-weight:800;white-space:nowrap}.km-hero{position:relative;min-height:clamp(500px,43vw,680px);border-radius:30px;overflow:hidden;background:#44764b url('../images/hero.jpg') 45% center/cover no-repeat}.km-hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 28%,rgba(0,49,31,.83) 100%)}.km-hero-content{position:absolute;top:12%;right:5%;width:45%;color:white}.km-hero h1{font-size:clamp(34px,4.3vw,65px);line-height:1.48;letter-spacing:.1em;font-weight:700}.km-hero-label{font-size:17px;letter-spacing:.25em;font-weight:800;margin-top:16px!important}.km-icons{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:30px}.km-icon{background:#278348;color:white;border-radius:40%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;flex-direction:column;transform:rotate(-4deg);text-align:center}.km-icon:nth-child(2){background:var(--yellow);color:var(--green);transform:rotate(3deg)}.km-icon:nth-child(3){background:#fb8737;transform:rotate(-2deg)}.km-icon:nth-child(4){background:#d75a49;transform:rotate(4deg)}.km-icon span{font-size:clamp(23px,2.6vw,38px);line-height:1}.km-icon b{font-size:clamp(13px,1.7vw,24px);letter-spacing:.05em;margin-top:7px}.km-icon small{font-size:10px}.km-kicker{font-size:11px;font-weight:900;letter-spacing:.2em;margin-bottom:18px!important}.km-about{display:grid;grid-template-columns:30% 43% 1fr;gap:3%;align-items:center;padding:65px 3%}.km-about h2{font-size:clamp(27px,2.7vw,42px);line-height:1.5;letter-spacing:.07em}.km-about-copy>p:not(.km-kicker){font-size:13px;margin-top:16px;line-height:2}.km-link{display:inline-block;border:1.5px solid;border-radius:99px;padding:8px 18px;font-size:11px;font-weight:800;letter-spacing:.1em;margin-top:20px}.km-about-photo{height:345px;overflow:hidden;border-radius:55px 75px 40px 70px;box-shadow:24px 12px 0 var(--yellow)}.km-about-note{font-family:serif;font-size:18px;line-height:2.1;letter-spacing:.12em;justify-self:center}.km-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding-bottom:72px}.km-action-photo{height:210px;border-radius:22px;overflow:hidden}.km-action-bottom{display:flex;align-items:center;gap:14px;position:relative;margin-top:-30px}.km-badge{width:90px;height:90px;flex:none;background:#258349;color:#fff;border-radius:40%;display:flex;justify-content:center;align-items:center;flex-direction:column;line-height:1.2}.km-action:nth-child(2) .km-badge{background:var(--yellow);color:var(--green)}.km-action:nth-child(3) .km-badge{background:#fb8737}.km-action:nth-child(4) .km-badge{background:#d75a49}.km-badge span{font-size:24px}.km-badge b{font-size:16px}.km-badge small{font-size:9px}.km-action-copy{font-size:11px;font-weight:700;padding-top:25px}.km-story{background:var(--green);color:#fff;border-radius:28px;padding:22px;display:grid;grid-template-columns:22% repeat(4,1fr);gap:7px}.km-story-copy{padding:25px 12px}.km-story h2{font-size:clamp(22px,2.2vw,35px);line-height:1.5;letter-spacing:.1em}.km-story-photo{height:235px;overflow:hidden;border-radius:20px}.km-row{display:grid;grid-template-columns:20% 1fr;gap:2.5%;align-items:center;padding:57px 3%}.km-row h2{font-size:clamp(25px,2.6vw,42px);line-height:1.3;letter-spacing:.07em}.km-gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.km-gallery-grid img{height:180px;border-radius:18px}.km-people{background:#e5eee4}.km-people-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.km-people-grid img{height:225px;border-radius:23px}.km-event{background:var(--yellow);border-radius:28px;min-height:145px;display:grid;grid-template-columns:29% 1fr auto;align-items:center;gap:20px;padding:25px 4%;margin:30px auto}.km-event h2{font-size:clamp(35px,4vw,62px);line-height:1}.km-event-date{font-size:clamp(20px,2.4vw,36px);font-weight:900}.km-event-place{font-size:13px;font-weight:800}.km-message{background:var(--green);color:white;padding:55px 0}.km-message-inner{display:flex;justify-content:space-between;align-items:end;gap:30px}.km-message p:last-child{font-size:clamp(23px,2.6vw,42px);line-height:1.7;letter-spacing:.14em}.km-message-mark{letter-spacing:.35em;font-size:17px;line-height:1.8}.km-footer{padding:35px 0 50px;display:flex;justify-content:space-between;font-size:12px}.km-footer b{font-size:20px;letter-spacing:.1em}
@media(max-width:900px){.km-nav a:not(:last-child){display:none}.km-hero{min-height:640px}.km-hero:before{background:linear-gradient(0deg,rgba(0,49,31,.85),transparent 80%)}.km-hero-content{top:auto;bottom:6%;left:5%;right:5%;width:auto}.km-icons{max-width:520px}.km-about{grid-template-columns:1fr 1fr}.km-about-note{display:none}.km-actions{grid-template-columns:repeat(2,1fr)}.km-story{grid-template-columns:repeat(2,1fr)}.km-story-copy{grid-column:span 2}.km-row{grid-template-columns:1fr}.km-row-copy{margin-bottom:23px}.km-event{grid-template-columns:1fr 1fr}.km-event .km-pill{grid-column:span 2;justify-self:start}}
@media(max-width:600px){.km-wrap{width:calc(100% - 28px)}.km-head{padding:12px 15px;min-height:67px}.km-logo{font-size:17px}.km-logo span{width:27px;height:27px;border-width:2px;margin-right:5px}.km-nav .km-pill{font-size:10px;padding:9px 13px}.km-hero{min-height:610px;border-radius:20px;background-position:42% center}.km-hero:before{background:linear-gradient(0deg,rgba(0,43,27,.95),transparent 75%)}.km-hero h1{font-size:clamp(29px,8vw,42px)}.km-hero-label{font-size:12px}.km-icons{gap:5px;margin-top:18px}.km-icon span{font-size:18px}.km-icon b{font-size:11px;margin-top:3px}.km-icon small{font-size:8px}.km-about{display:flex;flex-direction:column;align-items:stretch;padding:55px 4% 45px;gap:25px}.km-about h2{font-size:27px}.km-about-photo{height:270px;box-shadow:12px 10px 0 var(--yellow)}.km-actions{gap:14px;padding-bottom:55px}.km-action-photo{height:125px}.km-action-bottom{display:block;margin-top:-19px}.km-badge{width:67px;height:67px}.km-badge span{font-size:17px}.km-badge b{font-size:11px}.km-badge small{font-size:8px}.km-action-copy{padding:5px 0;font-size:10px}.km-story{padding:12px}.km-story-copy{padding:14px 8px}.km-story-photo{height:145px;border-radius:12px}.km-row{padding:48px 2%}.km-gallery-grid{grid-template-columns:repeat(2,1fr)}.km-gallery-grid img{height:135px}.km-people-grid{grid-template-columns:repeat(2,1fr)}.km-people-grid img{height:150px}.km-people-grid img:last-child{display:none}.km-event{grid-template-columns:1fr;gap:12px;padding:25px;margin:20px auto}.km-event .km-pill{grid-column:auto}.km-message-mark{display:none}.km-footer{flex-direction:column;gap:15px}.km-footer b{font-size:16px}}
/* =========================================================
   KOTOMORI PHOTO GALLERY — FINAL
   ========================================================= */

/* Gallery template only: remove inherited page spacing/title/header/footer. */
body:has(.kg-photo-gallery) {
  background: #f7f4eb;
}
body:has(.kg-photo-gallery) .wp-site-blocks > header,
body:has(.kg-photo-gallery) .wp-site-blocks > footer,
body:has(.kg-photo-gallery) .wp-block-post-title {
  display: none;
}
body:has(.kg-photo-gallery) .wp-site-blocks > main,
body:has(.kg-photo-gallery) .entry-content,
body:has(.kg-photo-gallery) .wp-block-post-content {
  margin: 0;
  padding: 0;
  max-width: none;
}
body:has(.kg-photo-gallery) .entry-content > *,
body:has(.kg-photo-gallery) .wp-block-post-content > * {
  max-width: none !important;
  margin-block: 0;
}

.kg-photo-gallery,
.kg-photo-gallery * { box-sizing: border-box; }

.kg-photo-gallery {
  --kg-green: #075b49;
  --kg-cream: #f7f4eb;
  --kg-line: rgba(7, 91, 73, .22);
  background: var(--kg-cream);
  color: var(--kg-green);
  font-family: Arial, 'Hiragino Kaku Gothic ProN', 'Noto Sans JP', sans-serif;
  overflow: hidden;
}

/* HERO */
.kg-photo-hero {
  position: relative;
  min-height: min(720px, 82vh);
  overflow: hidden;
  background: #173e34;
}
.kg-photo-hero__image,
.kg-photo-hero__overlay { position: absolute; inset: 0; }
.kg-photo-hero__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.kg-photo-hero__overlay {
  background: linear-gradient(90deg, rgba(5,37,29,.80) 0%, rgba(5,37,29,.50) 40%, rgba(5,37,29,.08) 76%);
}
.kg-photo-hero__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: min(1180px, calc(100% - 80px));
  min-height: min(720px, 82vh);
  margin: 0 auto;
  padding: 90px 0;
  color: #fff;
}
.kg-photo-hero__eyebrow {
  margin: 0 0 25px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .24em;
}
.kg-photo-hero__title {
  margin: 0;
  font-size: clamp(52px, 7vw, 94px);
  font-weight: 500;
  line-height: .91;
  letter-spacing: -.045em;
}
.kg-photo-hero__title span { display: block; }
.kg-photo-hero__date {
  margin: 30px 0 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .16em;
}
.kg-photo-hero__description {
  max-width: 430px;
  margin: 34px 0 0;
  font-size: 14px;
  line-height: 2;
  letter-spacing: .04em;
}

/* PHOTO STORY */
.kg-photo-story { padding: 72px 0 110px; }
.kg-photo-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-flow: dense;
  gap: 10px;
  width: min(1180px, calc(100% - 80px));
  margin: 0 auto;
}
.kg-photo {
  grid-column: span 4;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background: rgba(7,91,73,.06);
}
.kg-photo--portrait { aspect-ratio: 3 / 4; }
.kg-photo__button {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  cursor: zoom-in;
  overflow: hidden;
}
.kg-photo__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .65s cubic-bezier(.2,.7,.2,1), opacity .3s ease;
}
.kg-photo__button:hover .kg-photo__image { transform: scale(1.025); }

/* Editorial rhythm. Dense auto-placement prevents large accidental holes. */
.kg-photo--1  { grid-column: span 8; aspect-ratio: 4 / 3; }
.kg-photo--2,
.kg-photo--3  { grid-column: span 4; }
.kg-photo--4  { grid-column: 1 / -1; aspect-ratio: 16 / 7; margin: 42px 0; }
.kg-photo--5,
.kg-photo--6,
.kg-photo--7  { grid-column: span 4; }
.kg-photo--8  { grid-column: 1 / -1; aspect-ratio: 16 / 8; margin: 58px 0 18px; }
.kg-photo--9,
.kg-photo--10 { grid-column: span 6; aspect-ratio: 4 / 3; }
.kg-photo--11 { grid-column: span 7; aspect-ratio: 4 / 3; margin-top: 58px; }
.kg-photo--12 { grid-column: span 5; aspect-ratio: 3 / 4; margin-top: 58px; }

/* After the opening sequence, repeat a photo-book rhythm every 8 images. */
.kg-photo:nth-child(8n + 13) { grid-column: span 8; aspect-ratio: 4 / 3; margin-top: 52px; }
.kg-photo:nth-child(8n + 14) { grid-column: span 4; margin-top: 52px; }
.kg-photo:nth-child(8n + 15),
.kg-photo:nth-child(8n + 16),
.kg-photo:nth-child(8n + 17) { grid-column: span 4; }
.kg-photo:nth-child(8n + 18) { grid-column: 1 / -1; aspect-ratio: 16 / 8; margin: 52px 0 12px; }
.kg-photo:nth-child(8n + 19),
.kg-photo:nth-child(8n + 20) { grid-column: span 6; aspect-ratio: 4 / 3; }

/* FOOTER NAV */
.kg-photo-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: min(1180px, calc(100% - 80px));
  margin: 0 auto;
  padding: 32px 0 72px;
  border-top: 1px solid var(--kg-line);
}
.kg-photo-footer__back {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: var(--kg-green);
  text-decoration: none;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
}
.kg-photo-footer__back span { font-size: 18px; transition: transform .25s ease; }
.kg-photo-footer__back:hover span { transform: translateX(-5px); }
.kg-photo-footer__meta { font-size: 9px; font-weight: 700; letter-spacing: .18em; }

/* LIGHTBOX */
.kotomori-lightbox {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px;
  background: rgba(4,18,15,.94);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease, visibility .3s ease;
}
.kotomori-lightbox--open { opacity: 1; visibility: visible; }
.kotomori-lightbox__image {
  display: block;
  max-width: 92vw;
  max-height: 88vh;
  width: auto;
  height: auto;
  object-fit: contain;
}
.kotomori-lightbox__close {
  position: absolute;
  top: 24px;
  right: 30px;
  width: 48px;
  height: 48px;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 38px;
  font-weight: 200;
  line-height: 1;
  cursor: pointer;
}
body.kotomori-lightbox-open { overflow: hidden; }

/* TABLET */
@media (max-width: 900px) {
  .kg-photo-hero__content,
  .kg-photo-grid,
  .kg-photo-footer { width: calc(100% - 48px); }
  .kg-photo-story { padding: 48px 0 80px; }
}

/* MOBILE */
@media (max-width: 700px) {
  .kg-photo-hero { min-height: 610px; }
  .kg-photo-hero__content {
    justify-content: flex-end;
    width: calc(100% - 36px);
    min-height: 610px;
    padding: 58px 0;
  }
  .kg-photo-hero__overlay {
    background: linear-gradient(0deg, rgba(4,36,28,.90) 0%, rgba(4,36,28,.30) 70%, rgba(4,36,28,.08) 100%);
  }
  .kg-photo-hero__title { font-size: clamp(46px, 14vw, 58px); }
  .kg-photo-hero__description { max-width: 320px; margin-top: 24px; font-size: 13px; line-height: 1.9; }

  .kg-photo-story { padding: 12px 0 62px; }
  .kg-photo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: dense;
    width: calc(100% - 20px);
    gap: 5px;
  }
  .kg-photo,
  .kg-photo--portrait,
  .kg-photo:nth-child(n) {
    grid-column: span 1;
    margin: 0;
    aspect-ratio: 4 / 5;
  }
  .kg-photo--1,
  .kg-photo--4,
  .kg-photo--8,
  .kg-photo:nth-child(8n + 13),
  .kg-photo:nth-child(8n + 18) {
    grid-column: 1 / -1;
    aspect-ratio: 4 / 3;
  }
  .kg-photo--4,
  .kg-photo--8,
  .kg-photo:nth-child(8n + 13),
  .kg-photo:nth-child(8n + 18) { margin: 28px 0; }

  .kg-photo-footer { width: calc(100% - 28px); padding: 24px 0 46px; }
  .kg-photo-footer__meta { display: none; }
  .kotomori-lightbox { padding: 18px; }
  .kotomori-lightbox__close { top: 10px; right: 10px; }
}
/* =========================================================
   KOTOMORI PHOTO GALLERY
   VOL.1 FINAL EDITORIAL LAYOUT
   2026.10
   ========================================================= */


/* ---------------------------------------------------------
   BASE
   --------------------------------------------------------- */

.kg-photo-gallery {
  --kg-green: #075b49;
  --kg-cream: #f7f4eb;
  --kg-line: rgba(7, 91, 73, .20);

  width: 100%;
  margin: 0;
  padding: 0;

  background: var(--kg-cream);
  color: var(--kg-green);

  overflow: hidden;
}


/* WordPress側の余白を解除 */

body:has(.kg-photo-gallery) .wp-site-blocks > header,
body:has(.kg-photo-gallery) .wp-site-blocks > footer,
body:has(.kg-photo-gallery) .wp-block-post-title {
  display: none;
}

body:has(.kg-photo-gallery) .wp-site-blocks > main,
body:has(.kg-photo-gallery) .entry-content {
  width: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body:has(.kg-photo-gallery) .entry-content > * {
  max-width: none !important;
  margin-block: 0;
}


/* =========================================================
   HERO
   ========================================================= */

.kg-photo-hero {
  position: relative;

  width: 100%;
  min-height: min(720px, 82vh);

  overflow: hidden;
  background: #173e34;
}


.kg-photo-hero__image,
.kg-photo-hero__overlay {
  position: absolute;
  inset: 0;
}


.kg-photo-hero__img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center;
}


.kg-photo-hero__overlay {
  background:
    linear-gradient(
      90deg,
      rgba(5, 37, 29, .78) 0%,
      rgba(5, 37, 29, .48) 38%,
      rgba(5, 37, 29, .12) 72%,
      rgba(5, 37, 29, .03) 100%
    );
}


.kg-photo-hero__content {
  position: relative;
  z-index: 2;

  display: flex;
  flex-direction: column;
  justify-content: center;

  width: min(1280px, calc(100% - 96px));
  min-height: min(720px, 82vh);

  margin: 0 auto;
  padding: 90px 0;

  color: #fff;
}


.kg-photo-hero__eyebrow {
  margin: 0 0 24px;

  font-size: 10px;
  font-weight: 700;
  line-height: 1;

  letter-spacing: .26em;
}


.kg-photo-hero__title {
  margin: 0;

  font-size: clamp(56px, 7.2vw, 104px);
  font-weight: 500;
  line-height: .88;

  letter-spacing: -.05em;
}


.kg-photo-hero__title span {
  display: block;
  margin-top: 8px;
}


.kg-photo-hero__description {
  width: min(100%, 430px);

  margin: 38px 0 0;

  font-size: 13px;
  line-height: 2;

  letter-spacing: .045em;
}


/* =========================================================
   PHOTO STORY
   ========================================================= */

.kg-photo-story {
  width: 100%;

  padding: 88px 0 130px;
}


.kg-photo-grid {
  display: grid;

  grid-template-columns: repeat(12, minmax(0, 1fr));

  /*
   * dense にすることで、
   * 写真枚数によって発生する不自然な空白を詰める。
   */
  grid-auto-flow: dense;

  gap: 12px;

  width: min(1320px, calc(100% - 72px));

  margin: 0 auto;
}


.kg-photo {
  position: relative;

  min-width: 0;

  margin: 0;

  overflow: hidden;
}


.kg-photo__button {
  display: block;

  width: 100%;
  height: 100%;

  margin: 0;
  padding: 0;

  border: 0;
  outline: 0;

  background: transparent;

  cursor: zoom-in;

  overflow: hidden;
}


.kg-photo__image {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transform: scale(1);

  transition:
    transform .7s cubic-bezier(.2, .7, .2, 1),
    opacity .35s ease;
}


.kg-photo__button:hover .kg-photo__image {
  transform: scale(1.025);
}


/* =========================================================
   VOL.1 EDITORIAL LAYOUT
   ========================================================= */


/*
 * 01
 * 最初は大きく。
 */

.kg-photo--1 {
  grid-column: 1 / 9;

  aspect-ratio: 4 / 3;
}


/*
 * 02 / 03
 * HEROの右側に2枚。
 */

.kg-photo--2 {
  grid-column: 9 / 13;

  aspect-ratio: 4 / 3;
}


.kg-photo--3 {
  grid-column: 9 / 13;

  aspect-ratio: 4 / 3;
}


/*
 * 04
 * 最初の章を区切る横長写真。
 */

.kg-photo--4 {
  grid-column: 1 / 13;

  aspect-ratio: 16 / 7;

  margin-top: 72px;
}


/*
 * 05 / 06 / 07
 * 3枚組。
 */

.kg-photo--5 {
  grid-column: 1 / 5;

  aspect-ratio: 4 / 3;
}


.kg-photo--6 {
  grid-column: 5 / 9;

  aspect-ratio: 4 / 3;
}


.kg-photo--7 {
  grid-column: 9 / 13;

  aspect-ratio: 4 / 3;
}


/*
 * 08
 * 大判。
 */

.kg-photo--8 {
  grid-column: 2 / 12;

  aspect-ratio: 16 / 9;

  margin-top: 88px;
}


/*
 * 09 / 10
 * 左右2枚。
 */

.kg-photo--9 {
  grid-column: 1 / 7;

  aspect-ratio: 4 / 3;

  margin-top: 20px;
}


.kg-photo--10 {
  grid-column: 7 / 13;

  aspect-ratio: 4 / 3;

  margin-top: 20px;
}


/*
 * 11
 * 左に寄せる。
 */

.kg-photo--11 {
  grid-column: 1 / 8;

  aspect-ratio: 4 / 3;

  margin-top: 92px;
}


/*
 * 12
 * 少し下げて右側へ。
 */

.kg-photo--12 {
  grid-column: 8 / 13;

  aspect-ratio: 3 / 4;

  margin-top: 145px;
}


/*
 * 13
 * 再び大判。
 */

.kg-photo--13 {
  grid-column: 1 / 13;

  aspect-ratio: 16 / 8;

  margin-top: 88px;
}


/*
 * 14 / 15 / 16
 * 3枚の写真でテンポを作る。
 */

.kg-photo--14 {
  grid-column: 1 / 5;

  aspect-ratio: 3 / 4;
}


.kg-photo--15 {
  grid-column: 5 / 9;

  aspect-ratio: 3 / 4;
}


.kg-photo--16 {
  grid-column: 9 / 13;

  aspect-ratio: 3 / 4;
}


/*
 * 17 / 18
 * 左右非対称。
 */

.kg-photo--17 {
  grid-column: 1 / 8;

  aspect-ratio: 16 / 10;

  margin-top: 80px;
}


.kg-photo--18 {
  grid-column: 8 / 13;

  aspect-ratio: 4 / 5;

  margin-top: 140px;
}


/*
 * 19
 * 全幅で一度リセット。
 */

.kg-photo--19 {
  grid-column: 1 / 13;

  aspect-ratio: 16 / 8;

  margin-top: 90px;
}


/*
 * 20 / 21
 */

.kg-photo--20 {
  grid-column: 1 / 7;

  aspect-ratio: 4 / 3;
}


.kg-photo--21 {
  grid-column: 7 / 13;

  aspect-ratio: 4 / 3;
}


/*
 * 22
 * 少し小さめに中央。
 */

.kg-photo--22 {
  grid-column: 3 / 11;

  aspect-ratio: 16 / 10;

  margin-top: 90px;
}


/*
 * 23 / 24 / 25
 * 終盤の3枚組。
 */

.kg-photo--23 {
  grid-column: 1 / 5;

  aspect-ratio: 4 / 3;

  margin-top: 82px;
}


.kg-photo--24 {
  grid-column: 5 / 9;

  aspect-ratio: 4 / 3;

  margin-top: 82px;
}


.kg-photo--25 {
  grid-column: 9 / 13;

  aspect-ratio: 4 / 3;

  margin-top: 82px;
}


/*
 * 26
 * ラストへ向かう大判。
 */

.kg-photo--26 {
  grid-column: 1 / 13;

  aspect-ratio: 16 / 8;

  margin-top: 92px;
}


/*
 * 27 / 28
 */

.kg-photo--27 {
  grid-column: 1 / 7;

  aspect-ratio: 4 / 3;
}


.kg-photo--28 {
  grid-column: 7 / 13;

  aspect-ratio: 4 / 3;
}


/*
 * 29
 * Vol.1の最後。
 */

.kg-photo--29 {
  grid-column: 2 / 12;

  aspect-ratio: 16 / 9;

  margin-top: 90px;
}


/* =========================================================
   30枚目以降
   Vol.2〜Vol.4でも破綻しないフォールバック
   ========================================================= */

.kg-photo:nth-child(n+30) {
  grid-column: span 4;

  aspect-ratio: 4 / 3;

  margin-top: 12px;
}


/*
 * 30枚目以降も、ときどき大きくする。
 */

.kg-photo:nth-child(9n+30) {
  grid-column: 1 / 13;

  aspect-ratio: 16 / 8;

  margin-top: 80px;
}


/* =========================================================
   BOTTOM NAVIGATION
   ========================================================= */

.kg-photo-footer {
  display: flex;

  justify-content: space-between;
  align-items: center;

  width: min(1240px, calc(100% - 72px));

  margin: 0 auto;

  padding: 34px 0 78px;

  border-top: 1px solid var(--kg-line);
}


.kg-photo-footer__back {
  display: inline-flex;

  align-items: center;

  gap: 15px;

  color: var(--kg-green);

  text-decoration: none;

  font-size: 11px;
  font-weight: 700;

  letter-spacing: .14em;
}


.kg-photo-footer__back span {
  display: inline-block;

  font-size: 20px;
  line-height: 1;

  transition: transform .25s ease;
}


.kg-photo-footer__back:hover span {
  transform: translateX(-6px);
}


.kg-photo-footer__meta {
  font-size: 9px;
  font-weight: 700;

  letter-spacing: .22em;
}


/* =========================================================
   LIGHTBOX
   ========================================================= */

.kotomori-lightbox {
  position: fixed;

  inset: 0;

  z-index: 99999;

  display: flex;

  align-items: center;
  justify-content: center;

  padding: 50px;

  background: rgba(4, 18, 15, .95);

  opacity: 0;
  visibility: hidden;

  transition:
    opacity .3s ease,
    visibility .3s ease;
}


.kotomori-lightbox--open {
  opacity: 1;
  visibility: visible;
}


.kotomori-lightbox__image {
  display: block;

  width: auto;
  height: auto;

  max-width: 92vw;
  max-height: 90vh;

  object-fit: contain;
}


.kotomori-lightbox__close {
  position: absolute;

  top: 22px;
  right: 28px;

  width: 48px;
  height: 48px;

  padding: 0;

  border: 0;

  background: transparent;

  color: #fff;

  font-size: 38px;
  font-weight: 200;
  line-height: 1;

  cursor: pointer;
}


body.kotomori-lightbox-open {
  overflow: hidden;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 960px) {

  .kg-photo-hero__content {
    width: calc(100% - 56px);
  }


  .kg-photo-grid {
    width: calc(100% - 48px);

    gap: 8px;
  }


  .kg-photo-footer {
    width: calc(100% - 48px);
  }


  .kg-photo--4,
  .kg-photo--8,
  .kg-photo--13,
  .kg-photo--19,
  .kg-photo--22,
  .kg-photo--26,
  .kg-photo--29 {
    margin-top: 58px;
  }


  .kg-photo--11,
  .kg-photo--17,
  .kg-photo--23,
  .kg-photo--24,
  .kg-photo--25 {
    margin-top: 50px;
  }


  .kg-photo--12,
  .kg-photo--18 {
    margin-top: 90px;
  }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

  .kg-photo-hero {
    min-height: 600px;
  }


  .kg-photo-hero__content {
    justify-content: flex-end;

    width: calc(100% - 36px);
    min-height: 600px;

    padding: 55px 0;
  }


  .kg-photo-hero__overlay {
    background:
      linear-gradient(
        0deg,
        rgba(4, 36, 28, .90) 0%,
        rgba(4, 36, 28, .52) 38%,
        rgba(4, 36, 28, .08) 82%
      );
  }


  .kg-photo-hero__eyebrow {
    margin-bottom: 18px;

    font-size: 9px;
  }


  .kg-photo-hero__title {
    font-size: clamp(48px, 15vw, 66px);

    line-height: .9;
  }


  .kg-photo-hero__description {
    max-width: 320px;

    margin-top: 26px;

    font-size: 12px;

    line-height: 1.9;
  }


  .kg-photo-story {
    padding: 14px 0 72px;
  }


  .kg-photo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    grid-auto-flow: dense;

    width: calc(100% - 20px);

    gap: 5px;
  }


  /*
   * PC用の配置を全部リセット。
   */

  .kg-photo,
  .kg-photo:nth-child(n+30),
  .kg-photo:nth-child(9n+30) {
    grid-column: span 1;
    grid-row: auto;

    margin: 0;

    aspect-ratio: 4 / 5;
  }


  /*
   * スマホではストーリーの節目だけ全幅。
   */

  .kg-photo--1,
  .kg-photo--4,
  .kg-photo--8,
  .kg-photo--13,
  .kg-photo--19,
  .kg-photo--22,
  .kg-photo--26,
  .kg-photo--29 {
    grid-column: 1 / -1;

    aspect-ratio: 4 / 3;
  }


  .kg-photo--4,
  .kg-photo--8,
  .kg-photo--13,
  .kg-photo--19,
  .kg-photo--22,
  .kg-photo--26,
  .kg-photo--29 {
    margin: 32px 0;
  }


  /*
   * 縦写真はスマホで自然な比率に。
   */

  .kg-photo--12,
  .kg-photo--14,
  .kg-photo--15,
  .kg-photo--16,
  .kg-photo--18 {
    aspect-ratio: 3 / 4;
  }


  .kg-photo-footer {
    width: calc(100% - 28px);

    padding: 24px 0 48px;
  }


  .kg-photo-footer__back {
    font-size: 10px;
  }


  .kg-photo-footer__meta {
    display: none;
  }


  .kotomori-lightbox {
    padding: 16px;
  }


  .kotomori-lightbox__close {
    top: 10px;
    right: 10px;
  }
}
/* =========================================================
   KOTOMORI / GALLERY INDEX
   ========================================================= */

.kg-index {
  --green: #075b49;
  --cream: #f7f4eb;
  --yellow: #ffd735;

  width: 100%;
  margin: 0;
  background: var(--cream);
  color: var(--green);
}

body:has(.kg-index) .wp-block-post-title {
  display: none;
}

body:has(.kg-index) .entry-content,
body:has(.kg-index) main {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}


/* HERO */

.kg-index-hero {
  padding: 150px 0 115px;
}

.kg-index-hero__inner {
  width: min(1240px, calc(100% - 80px));
  margin: 0 auto;
}

.kg-index-eyebrow {
  margin: 0 0 28px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .25em;
}

.kg-index-title {
  margin: 0;

  font-size: clamp(68px, 8vw, 130px);
  font-weight: 500;
  line-height: .9;
  letter-spacing: -.06em;
}

.kg-index-lead {
  max-width: 520px;
  margin: 55px 0 0;

  font-size: 14px;
  line-height: 2.1;
  letter-spacing: .04em;
}


/* GALLERY LIST */

.kg-index-list {
  width: min(1240px, calc(100% - 80px));
  margin: 0 auto;
  padding-bottom: 130px;
}

.kg-index-card {
  display: block;
  color: var(--green);
  text-decoration: none;
}

.kg-index-card__image {
  overflow: hidden;
  border-radius: 26px;
}

.kg-index-card__image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 8;
  object-fit: cover;

  transition: transform .7s cubic-bezier(.2,.7,.2,1);
}

a.kg-index-card:hover .kg-index-card__image img {
  transform: scale(1.025);
}

.kg-index-card__body {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;

  gap: 30px;
  padding: 24px 3px 0;
}

.kg-index-card__label {
  margin: 0 0 6px;

  font-size: 9px;
  font-weight: 700;
  letter-spacing: .22em;
}

.kg-index-card h2 {
  margin: 0;

  font-size: clamp(42px, 5vw, 72px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -.04em;
}

.kg-index-card__arrow {
  padding-bottom: 8px;

  font-size: 10px;
  font-weight: 700;
  letter-spacing: .15em;
}


/* VOL 2–5 */

.kg-index-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  gap: 85px 22px;
  margin-top: 120px;
}

.kg-index-card__placeholder {
  display: flex;
  align-items: flex-end;

  aspect-ratio: 4 / 3;
  padding: 32px;

  border-radius: 22px;
  overflow: hidden;

  background: #dfe9df;
}

.kg-index-card__placeholder > span {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .2em;
}

.kg-index-card--coming {
  opacity: .72;
}


/* VOL.5 */

.kg-index-card--next .kg-index-card__placeholder {
  background: var(--yellow);
}

.kg-index-card--next {
  opacity: 1;
}


/* FOOTER */

.kg-index-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;

  width: min(1240px, calc(100% - 80px));
  margin: 0 auto;

  padding: 34px 0 70px;

  border-top: 1px solid rgba(7,91,73,.2);

  font-size: 9px;
  font-weight: 700;
  letter-spacing: .18em;
}

.kg-index-footer a {
  color: inherit;
  text-decoration: none;
}


/* MOBILE */

@media (max-width: 700px) {

  .kg-index-hero {
    padding: 95px 0 75px;
  }

  .kg-index-hero__inner,
  .kg-index-list,
  .kg-index-footer {
    width: calc(100% - 36px);
  }

  .kg-index-title {
    font-size: 17vw;
  }

  .kg-index-lead {
    margin-top: 38px;
    font-size: 12px;
  }

  .kg-index-list {
    padding-bottom: 75px;
  }

  .kg-index-card__image {
    border-radius: 15px;
  }

  .kg-index-card__image img {
    aspect-ratio: 4 / 3;
  }

  .kg-index-card__body {
    padding-top: 15px;
  }

  .kg-index-card h2 {
    font-size: 42px;
  }

  .kg-index-grid {
    grid-template-columns: 1fr;

    gap: 55px;
    margin-top: 75px;
  }

  .kg-index-card__placeholder {
    border-radius: 15px;
  }

  .kg-index-footer {
    padding-bottom: 40px;
  }

  .kg-index-footer span {
    display: none;
  }
}

/* ==========================================================
   KOTOMORI HOME — 2026 OCTOBER REFINEMENT
   Scoped to HOME only; gallery styles remain unchanged.
   ========================================================== */
body:has(.kotomori-home) .wp-block-post-content,
body:has(.kotomori-home) .wp-block-post-content > .wp-block-html {
  max-width:none!important;width:100%;margin:0!important;padding:0!important;
}
.kotomori-home{--green:#064d3b;--paper:#faf8f1;--yellow:#ffdb40;}
.kotomori-home .km-wrap{width:min(calc(100% - 64px),1320px);margin-inline:auto}
.kotomori-home .km-head{max-width:1440px;margin-inline:auto}
.kotomori-home .km-hero{min-height:clamp(450px,43vw,650px)}
.kotomori-home .km-hero-content{width:47%;right:5%;top:11%}
.kotomori-home .km-icons{gap:10px;max-width:520px}
.kotomori-home .km-icon{border-radius:44%;min-width:0}
.kotomori-home .km-about{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr) minmax(145px,.65fr);gap:4%;padding:78px 2%}
.kotomori-home .km-about-copy,.kotomori-home .km-about-note{min-width:0}
.kotomori-home .km-about-photo{min-width:0}
.kotomori-home .km-actions{gap:16px;padding-bottom:82px}
.kotomori-home .km-action{min-width:0}
.kotomori-home .km-action-bottom{align-items:center;gap:12px}
.kotomori-home .km-badge{width:72px;height:72px}
.kotomori-home .km-badge b{font-size:13px}
.kotomori-home .km-action-copy{padding-top:22px;line-height:1.65}
.kotomori-home .km-story{display:grid;grid-template-columns:minmax(205px,1.35fr) repeat(4,minmax(0,1fr));gap:10px;align-items:stretch;margin:18px 0 38px;padding:20px;background:var(--green);color:#fff;border-radius:26px}
.kotomori-home .km-story-copy{min-width:0;padding:24px 14px;align-self:center}
.kotomori-home .km-story-photo{min-width:0;height:245px;border-radius:17px;overflow:hidden}
.kotomori-home .km-story-photo img{width:100%;height:100%;object-fit:cover}
.kotomori-home .km-story .km-link{color:#fff}
.kotomori-home .km-row{display:grid;grid-template-columns:minmax(230px,1fr) minmax(0,3.2fr);gap:34px;align-items:center;padding:70px 2%}
.kotomori-home .km-row-copy{min-width:0}
.kotomori-home .km-row-copy h2{overflow-wrap:normal;word-break:normal;line-height:1.35}
.kotomori-home .km-gallery-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.kotomori-home .km-gallery-links .km-link{margin:0;padding:7px 12px;font-size:10px}
.kotomori-home .km-gallery-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;min-width:0}
.kotomori-home .km-gallery-grid img{width:100%;height:195px;object-fit:cover;border-radius:16px}
.kotomori-home .km-people .km-row{grid-template-columns:minmax(240px,1fr) minmax(0,3fr);padding-block:70px}
.kotomori-home .km-people-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;min-width:0}
.kotomori-home .km-people-grid img{width:100%;height:240px;object-fit:cover;border-radius:18px}
.kotomori-home .km-event{display:grid;grid-template-columns:minmax(155px,1fr) minmax(250px,1.4fr) auto;align-items:center;gap:24px;min-height:175px;height:auto;padding:36px 4%;margin:42px 0}
.kotomori-home .km-event-date{line-height:1.2}
.kotomori-home .km-event .km-pill{justify-self:end}
.kotomori-home .km-message{display:block;visibility:visible;opacity:1;height:auto;min-height:0;background:var(--green);color:#fff;padding:64px 0}
.kotomori-home .km-message-inner{display:flex;align-items:center;justify-content:space-between;gap:32px}
.kotomori-home .km-message-inner > div:first-child{min-width:0}
@media(max-width:1000px){
 .kotomori-home .km-nav{gap:14px}
 .kotomori-home .km-story{grid-template-columns:repeat(4,minmax(0,1fr))}
 .kotomori-home .km-story-copy{grid-column:1/-1}
 .kotomori-home .km-story-photo{height:190px}
 .kotomori-home .km-row,.kotomori-home .km-people .km-row{grid-template-columns:minmax(190px,1fr) minmax(0,2.5fr);gap:24px}
 .kotomori-home .km-event{grid-template-columns:1fr 1.5fr}
 .kotomori-home .km-event .km-pill{grid-column:1/-1;justify-self:start}
}
@media(max-width:900px){
 .kotomori-home .km-hero-content{top:auto;bottom:6%;left:5%;right:5%;width:auto}
 .kotomori-home .km-about{grid-template-columns:1fr 1fr}
 .kotomori-home .km-about-note{display:none}
 .kotomori-home .km-row,.kotomori-home .km-people .km-row{grid-template-columns:1fr}
 .kotomori-home .km-row-copy{margin-bottom:0}
}
@media(max-width:600px){
 .kotomori-home .km-wrap{width:calc(100% - 28px)}
 .kotomori-home .km-hero{min-height:610px}
 .kotomori-home .km-about{display:flex;flex-direction:column;align-items:stretch;padding:55px 4% 45px;gap:25px}
 .kotomori-home .km-actions{gap:12px;padding-bottom:55px}
 .kotomori-home .km-action-bottom{display:block;margin-top:-19px}
 .kotomori-home .km-badge{width:67px;height:67px}
 .kotomori-home .km-action-copy{padding:6px 0 0}
 .kotomori-home .km-story{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin:10px 0 24px;padding:12px}
 .kotomori-home .km-story-copy{grid-column:1/-1;padding:18px 10px}
 .kotomori-home .km-story-photo{height:155px;border-radius:12px}
 .kotomori-home .km-row,.kotomori-home .km-people .km-row{padding:48px 2%;gap:22px}
 .kotomori-home .km-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .kotomori-home .km-gallery-grid img{height:145px}
 .kotomori-home .km-people-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .kotomori-home .km-people-grid img{height:160px}
 .kotomori-home .km-people-grid img:last-child{display:block;grid-column:1/-1;height:190px}
 .kotomori-home .km-event{grid-template-columns:1fr;gap:14px;min-height:0;padding:28px;margin:24px 0}
 .kotomori-home .km-event .km-pill{grid-column:auto;justify-self:start}
 .kotomori-home .km-message{padding:48px 0}
 .kotomori-home .km-message-inner{flex-direction:column;align-items:flex-start}
 .kotomori-home .km-message-mark{display:none}
}

/* KOTOMORI PHOTO GALLERY — Navigation */

body:has(.kg-photo-gallery) .kg-photo-gallery nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 14px;
  margin: 4px;
  border: 1px solid rgba(7, 91, 73, .25);
  border-radius: 30px;
  color: #075b49;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  transition: background .2s, color .2s;
}

body:has(.kg-photo-gallery) .kg-photo-gallery nav a:hover {
  background: #075b49;
  color: #fff;
}

@media (max-width: 700px) {
  body:has(.kg-photo-gallery) .kg-photo-gallery nav a {
    min-height: 42px;
    padding: 10px 12px;
    margin: 3px;
    font-size: 11px;
  }
}
@media (min-width: 961px) {
  .kg-photo-gallery .kg-photo-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-auto-flow: row dense;
    gap: 12px;
    width: min(1240px, calc(100% - 80px));
    align-items: start;
  }

  /* Reset the earlier per-photo offsets and placements. */
  .kg-photo-gallery .kg-photo-grid > .kg-photo:nth-child(n) {
    grid-column: span 4;
    grid-row: auto;
    min-width: 0;
    margin: 0;
    aspect-ratio: 4 / 3;
  }

  /* Each six-image chapter: one panorama, a pair, then a trio. */
  .kg-photo-gallery .kg-photo-grid > .kg-photo:nth-child(6n + 1) {
    grid-column: 1 / -1;
    aspect-ratio: 16 / 7;
  }
  .kg-photo-gallery .kg-photo-grid > .kg-photo:nth-child(6n + 2),
  .kg-photo-gallery .kg-photo-grid > .kg-photo:nth-child(6n + 3) {
    grid-column: span 6;
    aspect-ratio: 4 / 3;
  }
  .kg-photo-gallery .kg-photo-grid > .kg-photo:nth-child(6n + 4),
  .kg-photo-gallery .kg-photo-grid > .kg-photo:nth-child(6n + 5),
  .kg-photo-gallery .kg-photo-grid > .kg-photo:nth-child(6n + 6) {
    grid-column: span 4;
    aspect-ratio: 4 / 3;
  }
}

/* KOTOMORI PHOTO GALLERY
   PC版 最終余白調整 */

@media (min-width: 961px) {

  /* 写真同士の余白 */
  .kg-photo-gallery .kg-photo-grid {
    gap: 14px;
  }

  /* 最後の写真を中央に大きく配置 */
  .kg-photo-gallery .kg-photo-grid > .kg-photo:last-child {
    grid-column: 1 / -1;
    width: 100%;
    aspect-ratio: 16 / 8;
    margin: 36px 0 0;
  }

}
