.shoplist .shopTextItem .shopName,
.shoplist .shopTextItem .shopIntro,
.shoplist .shopLinks a,
.shoplist .shopMessageToggle {
  overflow-wrap: anywhere;
}

.shoplist .shopTextItem .shopIntro {
  margin: 0 0 25px;
}

.shoplist .shopTextItem .shopLogo {
  display: block;
  width: min(200px, 70%);
  height: auto;
  aspect-ratio: 3 / 2;
  margin: 0 auto 20px;
  object-fit: contain;
}

@media screen and (min-width: 768px) {
  .shoplist .shopTextItem .modalItems:has(.has-shop-logo),
  .shoplist .shopTextItem .modalContent:has(.has-shop-logo) {
    min-width: 0;
    margin: 0;
  }

  .shoplist .shopTextItem .modalInner.has-shop-logo {
    display: grid;
    /* At the full row width, 580px of text plus 42px reaches the date column. */
    grid-template-columns: clamp(400px, 50%, 580px) minmax(0, 200px);
    column-gap: 42px;
    align-items: start;
    max-width: none;
  }

  .shoplist .shopTextItem .has-shop-logo .shopLogo {
    grid-column: 2;
    grid-row: 1 / span 2;
    width: min(200px, 100%);
    margin: 0;
  }

  .shoplist .shopTextItem .has-shop-logo .shopIntro {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    max-width: 580px;
  }

  .shoplist .shopTextItem .has-shop-logo .shopModalLinks {
    grid-column: 1;
    grid-row: 2;
  }
}

.access .accessNote {
  font-size: 0.85em;
}

#access {
  scroll-margin-top: 81px;
}

.kv:before {
  content: '';
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.24) 0%,
    rgba(255, 255, 255, 0.14) 42%,
    rgba(255, 255, 255, 0.06) 100%
  );
  pointer-events: none;
}

.kv {
  background-color: #fff;
}

.kv .kvSlider,
.kv .kvText,
.kv .scroller {
  opacity: 0;
}

.kv.kv-ready .kvSlider,
.kv.kv-ready .kvText,
.kv.kv-ready .scroller {
  opacity: 1;
  transition: opacity 0.35s ease;
}

.kv .kvText,
.kv .scroller {
  z-index: 2;
}

.kv .siteLogo img {
  filter: drop-shadow(0 3px 14px rgba(0, 0, 0, 0.42));
}

.kv .kvBox {
  position: relative;
}

.shoplist .shopModalLinks {
  display: none;
}

.shoplist .shopTextItem.links-only .shopLinks a {
  display: none;
}

.shoplist .shopTextItem.links-only .shopModalLinks {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 0 0 10px;
  font-family: 'Roboto', sans-serif;
  font-size: 1.2rem;
  font-weight: bold;
  letter-spacing: 0.05em;
}

.shoplist .shopTextItem.links-only .shopModalLinks a {
  border-bottom: 1px solid currentColor;
  color: #111;
  line-height: 1.4;
  text-decoration: none;
}

.fesContents .contentsBox .photo:before {
  background-color: #edece6;
}

.fesContents .contentsBox .workshopList {
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
  letter-spacing: 0.05em;
}

.fesContents .contentsBox .workshopList li {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  column-gap: 0.5em;
  margin: 0 0 8px;
}

.fesContents .contentsBox .workshopDate {
  white-space: nowrap;
}

.fesContents .contentsBox p.workshopNote {
  margin-bottom: 18px;
}

.fesContents .contentsBox p.workshopButtonWrap {
  margin-bottom: 0;
}

.fesContents .contentsBox .workshopButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 220px;
  min-height: 48px;
  padding: 0 28px;
  border: 1px solid #8f6a43;
  border-radius: 999px;
  background: #8f6a43;
  color: #fff;
  font-weight: bold;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
}

.fesContents .contentsBox .workshopButton:hover {
  background: #fff8ec;
  color: #6f4f31;
  text-decoration: none;
}

.blogContents .journalAuthorImage {
  width: 100%;
  margin: 42px auto 34px;
}

.blogContents .journalAuthorImage img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (min-width: 768px) and (max-width: 999px) {
  .shoplist {
    padding-right: 24px;
    padding-left: 24px;
  }

  .shoplist .shopTextItem {
    grid-template-columns: minmax(0, 320px) minmax(0, 1fr) 160px 110px 130px 42px 24px;
    column-gap: 10px;
  }
}

@media screen and (min-width: 768px) {
  .shoplist .shopLinks {
    font-weight: normal;
  }

  .shoplist .shopTextItem .shopIntro {
    max-width: clamp(560px, 46vw, 680px);
  }
}

@media screen and (min-width: 768px) {
  .demo-shop-images .shopHoverPreview {
    position: fixed;
    z-index: 2;
    top: 96px;
    right: 40px;
    width: 300px;
    aspect-ratio: 3 / 2;
    background: url("../img/contents-1.jpg") center / cover no-repeat;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.16);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, background-image 0.2s ease;
  }

  .demo-shop-images .shoplist:has(.shopTextItem:hover) .shopHoverPreview,
  .demo-shop-images .shoplist:has(.shopTextItem.is-open) .shopHoverPreview {
    opacity: 1;
  }

  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 1):hover) .shopHoverPreview,
  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 1).is-open) .shopHoverPreview {
    background-image: url("../img/contents-1.jpg");
  }

  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 2):hover) .shopHoverPreview,
  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 2).is-open) .shopHoverPreview {
    background-image: url("../img/contents-3%202.jpg");
  }

  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 3):hover) .shopHoverPreview,
  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 3).is-open) .shopHoverPreview {
    background-image: url("../wp/wp-content/uploads/2020/12/33_br.jpg");
  }

  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 4):hover) .shopHoverPreview,
  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 4).is-open) .shopHoverPreview {
    background-image: url("../wp/wp-content/uploads/2020/12/23_oo-2.jpg");
  }

  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 5):hover) .shopHoverPreview,
  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n + 5).is-open) .shopHoverPreview {
    background-image: url("../wp/wp-content/uploads/2020/12/15.jpg");
  }

  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n):hover) .shopHoverPreview,
  .demo-shop-images .shoplist:has(.shopTextItem:nth-child(6n).is-open) .shopHoverPreview {
    background-image: url("../wp/wp-content/uploads/2019/05/2D0A8041-1-840x560.jpg");
  }
}

@media screen and (min-width: 1200px) {
  .shoplist .shopTextItem .shopIntro {
    max-width: 620px;
  }
}

@media screen and (max-width: 767px) {
  .kv .kvBox:after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.26);
    pointer-events: none;
  }

  .kv .siteLogo {
    width: min(calc(390 / 750 * 100vw), 220px);
  }

  .fesConcept .conceptSubTitle:before {
    width: 100%;
  }

  .shoplist .shopTextItem:hover,
  .shoplist .shopTextItem.is-open {
    background: transparent;
  }

  .shoplist .categoryTitle {
    margin-top: 40px;
    font-size: 1.7rem;
  }

  .shoplist .shopTextItem {
    padding-right: 0;
    padding-left: 0;
  }

  .demo-shop-images .shoplist .shopTextItem .modalInner:before {
    content: "";
    display: block;
    width: 100%;
    max-width: 720px;
    aspect-ratio: 3 / 2;
    margin: 0 0 16px;
    background: url("../img/contents-1.jpg") center / cover no-repeat;
  }

  .demo-shop-images .shoplist .shopTextItem:nth-child(6n + 2) .modalInner:before {
    background-image: url("../img/contents-3%202.jpg");
  }

  .demo-shop-images .shoplist .shopTextItem:nth-child(6n + 3) .modalInner:before {
    background-image: url("../wp/wp-content/uploads/2020/12/33_br.jpg");
  }

  .demo-shop-images .shoplist .shopTextItem:nth-child(6n + 4) .modalInner:before {
    background-image: url("../wp/wp-content/uploads/2020/12/23_oo-2.jpg");
  }

  .demo-shop-images .shoplist .shopTextItem:nth-child(6n + 5) .modalInner:before {
    background-image: url("../wp/wp-content/uploads/2020/12/15.jpg");
  }

  .demo-shop-images .shoplist .shopTextItem:nth-child(6n) .modalInner:before {
    background-image: url("../wp/wp-content/uploads/2019/05/2D0A8041-1-840x560.jpg");
  }

  .shoplist .shopTextItem .shopName {
    font-size: 1.35rem;
  }

  .shoplist .shopTextItem .shopMeta {
    font-size: 1rem;
  }

  .shoplist .shopTextItem .date li {
    padding: 4px 6px 3px;
    font-size: 0.8rem;
    line-height: 1.15;
  }

  .shoplist .shopTextItem .shopIntro {
    margin: 0 0 10px;
    font-size: 1.1rem;
  }

  .fesContents .contentsBox .workshopList li {
    display: block;
    padding-left: 0;
    text-indent: 0;
  }

  .fesContents .contentsBox .workshopDate {
    display: block;
    margin-right: 0;
  }

  .fesOutline .outline p,
  .shoplist .shopBox .shopName,
  .modalContent .shopText p,
  .bloglist .blogLead,
  .bloglist .blogBox .blogName {
    font-size: 1.1rem;
  }

  .shoplist .hint,
  .bloglist .hint {
    font-size: 1rem;
  }

  .shoplist .shopTextItem:not(.no-message) .shopLinks a {
    display: none;
  }

  .shoplist .shopModalLinks {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin: 0 0 10px;
    font-family: 'Roboto', sans-serif;
    font-size: 1.1rem;
    font-weight: bold;
    letter-spacing: 0.05em;
  }

  .shoplist .shopModalLinks a {
    border-bottom: 1px solid currentColor;
    color: #111;
    line-height: 1.4;
    text-decoration: none;
  }

  .shoplist .shopMessageToggle {
    right: 0;
    width: 12px;
    height: 12px;
  }

  .bloglist .blogBox .blogName {
    font-size: 1.15rem;
  }
}
