@charset "UTF-8";

/*!
Theme Name: lawson.works Cocoon Child
Description: lawson.works renewal child theme for Cocoon
Theme URI: https://lawson.works/
Author: lawson.works
Author URI: https://lawson.works/
Template:   cocoon-master
Version:    2026.05.06.7
*/

:root {
  --lw-blue: #0b66c3;
  --lw-blue-deep: #084f9c;
  --lw-blue-soft: #e8f3ff;
  --lw-yellow: #ffd84d;
  --lw-ink: #172033;
  --lw-muted: #64748b;
  --lw-line: #dbe5f1;
  --lw-bg: #f6f9fc;
  --lw-card: #ffffff;
}

body {
  background: var(--lw-bg);
  color: var(--lw-ink);
  letter-spacing: 0;
}

body.lw-renewal-active {
  background: #ffffff;
}

body.lw-renewal-active .header-container,
body.lw-renewal-active #navi,
body.lw-renewal-active .breadcrumb,
body.lw-renewal-active .date-tags,
body.lw-renewal-active .under-entry-content,
body.lw-renewal-active #sidebar,
body.lw-renewal-active .sidebar {
  display: none;
}

body.lw-renewal-active #content,
body.lw-renewal-active #content-in,
body.lw-renewal-active .content-in,
body.lw-renewal-active .main,
body.lw-renewal-active .article {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

body.lw-renewal-active #content {
  margin-top: 0;
}

body.lw-renewal-active .entry-content {
  margin: 0;
}

.lw-shell,
.lw-page {
  width: min(1430px, calc(100% - 64px));
  margin: 0 auto;
}

.lw-home {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  background: #ffffff;
  overflow-x: clip;
}

.lw-home-inner {
  width: min(1450px, calc(100% - 64px));
  margin: 0 auto;
}

.lw-topbar {
  position: relative;
  z-index: 5;
  min-height: 76px;
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid #d5e1ef;
  box-shadow: 0 2px 12px rgba(23, 32, 51, 0.06);
}

.lw-topbar-inner {
  display: grid;
  grid-template-columns: auto 1fr minmax(360px, 520px);
  gap: 28px;
  align-items: center;
  min-height: 76px;
}

.lw-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #0557b8;
  font-size: 26px;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.lw-brand:hover {
  color: #0557b8;
  text-decoration: none;
}

.lw-brand em {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  border: 1px solid #0b66c3;
  border-radius: 6px;
  color: #0b66c3;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  padding: 0 9px;
}

.lw-topnav {
  display: flex;
  justify-content: center;
  gap: 52px;
  align-items: center;
}

.lw-topnav a {
  color: #111827;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.lw-topnav a:hover {
  color: var(--lw-blue);
  text-decoration: none;
}

.lw-topnav a.is-active {
  color: var(--lw-blue);
}

.lw-top-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 54px;
  align-items: center;
  min-height: 44px;
  border: 1px solid #cbd7e6;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.lw-top-search input {
  min-width: 0;
  width: 100%;
  min-height: 44px;
  border: 0;
  color: var(--lw-ink);
  font-size: 15px;
  font-weight: 600;
  padding: 0 14px;
}

.lw-top-search button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  min-height: 44px;
  border: 0;
  background: var(--lw-blue);
  color: #fff;
  font-size: 0;
  line-height: 1;
  cursor: pointer;
}

.lw-search-icon {
  display: block;
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.lw-hero,
.lw-panel,
.lw-card,
.lw-product-hero,
.lw-content-section,
.lw-side-panel {
  background: var(--lw-card);
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  box-shadow: 0 14px 38px rgba(15, 52, 91, 0.06);
}

.lw-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 22px;
  align-items: center;
  min-height: auto;
  margin: 12px 0 14px;
  padding: 18px 28px;
  overflow: visible;
  border: 1px solid #d7e5f4;
  border-radius: 8px;
  background:
    linear-gradient(125deg, rgba(11, 102, 195, 0.08) 0%, rgba(255, 255, 255, 0.72) 52%, rgba(255, 216, 77, 0.16) 100%),
    #fff;
  box-shadow: 0 10px 26px rgba(15, 52, 91, 0.05);
}

.lw-hero-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  text-align: left;
}

.lw-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  color: var(--lw-blue-deep);
  font-size: 13px;
  font-weight: 700;
}

.lw-hero .lw-kicker {
  justify-content: flex-start;
  margin-bottom: 8px;
  color: var(--lw-blue-deep);
  font-size: 13px;
}

.lw-hero h1,
.lw-page-title h1,
.lw-product-title {
  margin: 0;
  color: var(--lw-ink);
  font-weight: 800;
  line-height: 1.25;
}

.lw-hero h1 {
  color: var(--lw-ink);
  max-width: 720px;
  font-size: clamp(28px, 2.55vw, 38px);
  line-height: 1.18;
  letter-spacing: 0;
}

.lw-hero h1 span {
  display: block;
}

.lw-lead {
  margin: 14px 0 22px;
  color: var(--lw-muted);
  font-size: 16px;
  line-height: 1.8;
}

.lw-hero .lw-lead {
  max-width: 780px;
  margin: 7px 0 12px;
  color: var(--lw-muted);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.55;
}

.lw-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 54px;
  gap: 0;
  align-items: center;
  max-width: 720px;
  min-height: 44px;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
}

.lw-hero .lw-search {
  width: min(760px, 100%);
  max-width: none;
  margin: 0;
  min-height: 44px;
  border-color: var(--lw-line);
  box-shadow: none;
  padding: 0;
}

.lw-hero .lw-search input[type="search"] {
  min-height: 44px;
  border: 0;
  font-size: 15px;
  font-weight: 600;
}

.lw-hero .lw-search button {
  min-width: 54px;
  width: 54px;
  min-height: 44px;
  border-radius: 0;
  font-size: 0;
}

.lw-search input[type="search"],
.lw-search input[type="text"],
.lw-filter-input,
.lw-sort-select {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #fff;
  color: var(--lw-ink);
  font-size: 15px;
  padding: 0 14px;
}

.lw-search input[type="search"],
.lw-search input[type="text"] {
  min-width: 0;
  min-height: 44px;
  border: 0;
  border-radius: 0;
  font-weight: 600;
}

.lw-search button,
.lw-button,
.lw-card-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border: 0;
  border-radius: 8px;
  background: var(--lw-blue);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  padding: 0 18px;
  cursor: pointer;
}

.lw-search button {
  flex: 0 0 54px;
  width: 54px;
  min-width: 54px;
  border-radius: 0;
  padding: 0;
}

.lw-search button:hover,
.lw-button:hover,
.lw-card-link:hover {
  background: var(--lw-blue-deep);
  color: #fff;
  text-decoration: none;
}

.lw-cocoon-ad-slot {
  margin: 18px 0;
}

.lw-cocoon-affiliate-links,
.lw-affiliate-links {
  width: 100%;
  margin: 12px 0 0;
}

.lw-cocoon-affiliate-links .product-item-buttons,
.lw-cocoon-affiliate-links .amazon-item-buttons,
.lw-affiliate-links {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  align-items: stretch;
}

.lw-cocoon-affiliate-links .product-item-buttons > div,
.lw-cocoon-affiliate-links .amazon-item-buttons > div {
  min-width: 0;
  margin: 0;
}

.lw-cocoon-affiliate-links .shoplinkrakuten { order: 1; }
.lw-cocoon-affiliate-links .shoplinkyahoo { order: 2; }
.lw-cocoon-affiliate-links .shoplinkamazon { order: 3; }

.lw-cocoon-affiliate-links a,
.lw-affiliate-link {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 14px;
  gap: 8px;
  align-items: center;
  width: 100%;
  min-height: 44px;
  border: 1px solid #cfd9e7;
  border-radius: 8px;
  background: #fff;
  color: #111827;
  font-size: 13px;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
  padding: 0 12px !important;
  position: relative;
  overflow: hidden;
}

.lw-cocoon-affiliate-links a::after,
.lw-affiliate-link::after {
  content: "›";
  justify-self: end;
  color: #0b3d78;
  font-size: 18px;
  line-height: 1;
}

.lw-cocoon-affiliate-links a:hover,
.lw-affiliate-link:hover {
  border-color: var(--lw-blue);
  background: #f8fbff;
  color: #111827;
  text-decoration: none;
}

.lw-cocoon-affiliate-links a > img:not(.lw-affiliate-logo-img) {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.lw-affiliate-logo-img {
  display: block !important;
  justify-self: start;
  width: 30px !important;
  height: 26px !important;
  max-width: 30px !important;
  max-height: 26px !important;
  object-fit: contain;
  position: static !important;
  inset: auto !important;
  float: none !important;
  margin: 0 !important;
  opacity: 1 !important;
  transform: none !important;
}

.lw-affiliate-label {
  display: block;
  justify-self: center;
  min-width: 0;
  max-width: 100%;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  overflow-wrap: normal;
  text-overflow: ellipsis;
  word-break: keep-all;
}

.lw-chips,
.lw-segments,
.lw-meta-list,
.lw-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.lw-chip,
.lw-segment,
.lw-badge {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

.lw-hero .lw-chips {
  justify-content: flex-start;
  margin-top: 0;
}

.lw-hero .lw-chip {
  min-height: 28px;
  justify-content: center;
  border: 1px solid var(--lw-line);
  background: #fff;
  color: var(--lw-blue-deep);
  font-size: 12px;
}

.lw-hero .lw-chip:hover {
  background: var(--lw-blue-soft);
  color: var(--lw-blue-deep);
  text-decoration: none;
}

.lw-popular-keywords {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}

.lw-popular-keywords > span {
  color: var(--lw-muted);
  font-size: 12px;
  font-weight: 800;
}

.lw-home-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
  color: var(--lw-muted);
  font-size: 12px;
}

.lw-home-stats span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border: 1px solid #cfdced;
  border-radius: 999px;
  background: #fff;
  padding: 0 10px;
}

.lw-home-stats strong {
  margin-left: 4px;
  color: var(--lw-blue-deep);
}

.lw-hero-aside {
  display: flex;
  flex-direction: column;
  align-self: center;
  min-width: 0;
  border: 1px solid #d8e4f2;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 10px 24px rgba(15, 52, 91, 0.06);
  padding: 12px;
}

.lw-hero-aside-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.lw-hero-aside-head span {
  color: var(--lw-ink);
  font-size: 14px;
  font-weight: 800;
}

.lw-hero-aside-head a {
  color: var(--lw-blue-deep);
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.lw-hero-aside-head a:hover {
  color: var(--lw-blue);
  text-decoration: none;
}

.lw-hero-mini-list {
  display: grid;
  gap: 8px;
}

.lw-hero-mini-item {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  min-width: 0;
  border: 1px solid #e0e9f5;
  border-radius: 8px;
  background: #fff;
  color: var(--lw-ink);
  padding: 7px;
  text-decoration: none;
}

.lw-hero-mini-item:hover {
  border-color: #b8d2ee;
  background: #f8fbff;
  color: var(--lw-blue-deep);
  text-decoration: none;
}

.lw-hero-mini-image {
  display: block;
  width: 58px;
  height: 48px;
  overflow: hidden;
  border-radius: 6px;
  background: #eef5fd;
}

.lw-hero-mini-image img,
.lw-hero-mini-image .lw-card-image-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lw-hero-mini-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.lw-hero-mini-copy strong,
.lw-hero-mini-copy em {
  display: block;
  overflow: hidden;
  min-width: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lw-hero-mini-copy strong {
  color: var(--lw-ink);
  font-size: 12px;
  font-weight: 800;
}

.lw-hero-mini-copy em {
  color: var(--lw-muted);
  font-size: 12px;
  font-style: normal;
}

.lw-hero-art {
  position: absolute;
  inset-block: 0;
  width: 330px;
  opacity: 0.2;
  pointer-events: none;
}

.lw-hero-art-left {
  left: 50px;
  background:
    linear-gradient(#fff, #fff) 76px 104px / 4px 122px no-repeat,
    linear-gradient(#fff, #fff) 58px 138px / 76px 5px no-repeat,
    linear-gradient(#fff, #fff) 91px 88px / 4px 48px no-repeat,
    linear-gradient(#fff, #fff) 170px 126px / 180px 5px no-repeat,
    linear-gradient(#fff, #fff) 188px 142px / 4px 118px no-repeat,
    linear-gradient(#fff, #fff) 328px 142px / 4px 118px no-repeat,
    linear-gradient(#fff, #fff) 188px 260px / 144px 5px no-repeat;
}

.lw-hero-art-right {
  right: 50px;
  background:
    radial-gradient(circle at 40px 120px, transparent 0 44px, #fff 45px 48px, transparent 49px) 0 0 / 120px 240px no-repeat,
    linear-gradient(#fff, #fff) 145px 116px / 120px 5px no-repeat,
    linear-gradient(#fff, #fff) 145px 204px / 120px 5px no-repeat,
    linear-gradient(90deg, #fff 0 5px, transparent 5px 115px, #fff 115px 120px) 145px 116px / 120px 92px no-repeat,
    linear-gradient(#fff, #fff) 288px 166px / 70px 5px no-repeat,
    linear-gradient(#fff, #fff) 288px 230px / 70px 5px no-repeat;
}

.lw-chip,
.lw-segment {
  border: 1px solid var(--lw-line);
  background: #fff;
  color: var(--lw-blue-deep);
  padding: 0 12px;
}

.lw-segment.is-active {
  background: var(--lw-blue);
  color: #fff;
  border-color: var(--lw-blue);
}

.lw-badge {
  background: var(--lw-blue-soft);
  color: var(--lw-blue-deep);
  padding: 0 10px;
}

.lw-badge.is-fresh,
.lw-stat strong {
  background: var(--lw-yellow);
  color: #243246;
}

.lw-hero-visual {
  display: grid;
  gap: 12px;
}

.lw-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.lw-stat {
  min-height: 88px;
  border-radius: 8px;
  background: linear-gradient(180deg, #fff, #f5faff);
  border: 1px solid var(--lw-line);
  padding: 14px;
}

.lw-stat span {
  display: block;
  color: var(--lw-muted);
  font-size: 12px;
}

.lw-stat strong {
  display: inline-flex;
  margin-top: 8px;
  border-radius: 999px;
  padding: 5px 8px;
  font-size: 14px;
}

.lw-section-head,
.lw-page-title {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: end;
  margin: 28px 0 18px;
}

.lw-home-section {
  margin-top: 22px;
}

.lw-home-section .lw-section-head {
  margin: 0 0 12px;
  align-items: center;
}

.lw-section-head h2,
.lw-content-section h2,
.lw-side-panel h2,
.lw-side-panel h3 {
  margin: 0;
  color: var(--lw-ink);
  font-size: 22px;
  line-height: 1.35;
}

.lw-home .lw-section-head h2 {
  position: relative;
  padding-left: 18px;
  font-size: 22px;
}

.lw-home .lw-section-head h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;
  width: 5px;
  height: 24px;
  border-radius: 999px;
  background: var(--lw-blue);
}

.lw-home-products {
  padding: 0 0 8px;
}

.lw-home-products > .lw-section-head {
  margin-top: 0;
}

.lw-text-link,
.lw-side-link {
  color: var(--lw-blue);
  font-weight: 800;
  text-decoration: none;
}

.lw-text-link::after,
.lw-side-link::after {
  content: "›";
  padding-left: 8px;
  font-size: 22px;
  line-height: 0;
}

.lw-text-link:hover,
.lw-side-link:hover {
  color: var(--lw-blue-deep);
  text-decoration: none;
}

.lw-section-head p,
.lw-page-title p {
  margin: 6px 0 0;
  color: var(--lw-muted);
}

.lw-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.lw-home-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 22px;
  align-items: start;
}

.lw-grid-home {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}

.lw-grid.is-three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lw-quick-category-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.lw-quick-category-card {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 86px;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #fff;
  color: var(--lw-ink);
  padding: 10px;
  text-decoration: none;
}

.lw-quick-category-card:hover {
  border-color: #b8d2ee;
  background: #f8fbff;
  color: var(--lw-blue-deep);
  text-decoration: none;
}

.lw-quick-category-thumb {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3px;
  width: 96px;
  height: 64px;
  overflow: hidden;
  border: 1px solid #dce8f5;
  border-radius: 6px;
  background: #f0f6ff;
}

.lw-quick-category-thumb.is-count-1 {
  grid-template-columns: 1fr;
}

.lw-quick-category-thumb.is-count-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lw-quick-category-thumb.is-empty {
  display: flex;
  align-items: center;
  justify-content: center;
}

.lw-quick-category-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lw-quick-category-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.lw-quick-category-card strong {
  overflow: hidden;
  font-size: 15px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lw-quick-category-card em {
  color: var(--lw-muted);
  font-size: 13px;
  font-style: normal;
}

.lw-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.lw-home .lw-card {
  border-color: #d8e3f1;
  box-shadow: 0 8px 22px rgba(15, 52, 91, 0.05);
}

.lw-card-image {
  display: block;
  aspect-ratio: 4 / 3;
  background: #eef5fd;
  overflow: hidden;
}

.lw-home .lw-card-image {
  aspect-ratio: 1 / 0.92;
  margin: 12px 12px 0;
  border-radius: 6px;
}

.lw-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lw-card-image-placeholder {
  width: 100%;
  height: 100%;
  background:
    linear-gradient(135deg, rgba(11, 102, 195, 0.08), rgba(255, 216, 77, 0.24)),
    radial-gradient(circle at 70% 25%, rgba(11, 102, 195, 0.12), transparent 32%);
}

.lw-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 14px;
}

.lw-home .lw-card-body {
  padding: 12px 12px 14px;
}

.lw-card h3 {
  margin: 10px 0 8px;
  font-size: 16px;
  line-height: 1.45;
}

.lw-home .lw-card h3 {
  min-height: 44px;
  margin: 10px 0 8px;
  font-size: 14px;
}

.lw-home .lw-card-excerpt {
  display: none;
}

.lw-home .lw-meta-list {
  display: none;
}

.lw-home .lw-card-link {
  display: flex;
  min-height: 40px;
  margin: 16px -12px -14px;
  border-radius: 0;
  background: #f7fbff;
  border-top: 1px solid var(--lw-line);
  color: var(--lw-blue);
  font-size: 13px;
}

.lw-home .lw-card-link:hover {
  background: var(--lw-blue-soft);
  color: var(--lw-blue-deep);
}

.lw-home .lw-badge {
  min-height: 24px;
  padding: 0 9px;
  font-size: 12px;
}

.lw-home .lw-badge.is-fresh {
  display: none;
}

.lw-home-product-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.lw-top-product-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #d8e3f1;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(15, 52, 91, 0.05);
}

.lw-top-product-image {
  display: block;
  aspect-ratio: 16 / 9;
  margin: 10px 10px 0;
  overflow: hidden;
  border-radius: 6px;
  background: #eef5fd;
}

.lw-top-product-image img,
.lw-top-product-image .lw-card-image-placeholder {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lw-top-product-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 10px 12px 12px;
}

.lw-top-product-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  min-height: 24px;
}

.lw-top-flag {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  border-radius: 999px;
  background: var(--lw-blue);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  padding: 0 8px;
  text-decoration: none;
}

.lw-top-flag.is-muted {
  background: var(--lw-blue-soft);
  color: var(--lw-blue-deep);
}

.lw-top-product-card h3 {
  min-height: 42px;
  margin: 8px 0;
  font-size: 15px;
  line-height: 1.45;
}

.lw-top-product-card h3 a {
  color: var(--lw-ink);
  text-decoration: none;
}

.lw-top-product-card h3 a:hover {
  color: var(--lw-blue);
  text-decoration: none;
}

.lw-top-product-meta {
  display: grid;
  gap: 4px;
  margin: 0 0 10px;
  color: var(--lw-muted);
  font-size: 12px;
}

.lw-top-product-meta div {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 8px;
  align-items: baseline;
}

.lw-top-product-meta dt {
  color: #516174;
  font-weight: 800;
}

.lw-top-product-meta dd {
  min-width: 0;
  margin: 0;
  color: var(--lw-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lw-top-product-link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  margin: auto -12px -12px;
  border-top: 1px solid var(--lw-line);
  background: #f7fbff;
  color: var(--lw-blue);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.lw-top-product-link:hover {
  background: var(--lw-blue-soft);
  color: var(--lw-blue-deep);
  text-decoration: none;
}

.lw-card h3 a {
  color: var(--lw-ink);
  text-decoration: none;
}

.lw-card h3 a:hover {
  color: var(--lw-blue);
  text-decoration: none;
}

.lw-card-link {
  margin-top: auto;
}

.lw-card-excerpt {
  color: var(--lw-muted);
  font-size: 13px;
  line-height: 1.65;
}

.lw-meta-list {
  margin: 10px 0 12px;
  color: var(--lw-muted);
  font-size: 12px;
}

.lw-main-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 22px;
  align-items: start;
}

.lw-archive-page {
  padding-bottom: 28px;
}

.lw-archive-title {
  align-items: center;
  margin: 28px 0 18px;
}

.lw-archive-title h1 {
  font-size: clamp(32px, 4vw, 44px);
}

.lw-archive-toolbar {
  grid-template-columns: minmax(280px, 0.9fr) minmax(440px, 1.4fr) 148px;
  align-items: stretch;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 52, 91, 0.05);
  padding: 12px;
}

.lw-archive-search .lw-search {
  max-width: none;
}

.lw-archive-search .lw-search button {
  min-width: 54px;
  padding: 0;
}

.lw-archive-segments {
  flex-wrap: nowrap;
  overflow-x: auto;
}

.lw-archive-segments .lw-segment {
  min-width: 78px;
  justify-content: center;
  border-radius: 6px;
}

.lw-filter-checks {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.lw-filter-check {
  display: grid;
  grid-template-columns: 18px 1fr auto;
  gap: 10px;
  align-items: center;
  min-height: 28px;
  color: var(--lw-ink);
  font-size: 14px;
  text-decoration: none;
}

.lw-filter-check:hover {
  color: var(--lw-blue);
  text-decoration: none;
}

.lw-filter-check > span {
  width: 16px;
  height: 16px;
  border: 1px solid #b8c6d8;
  border-radius: 4px;
  background: #fff;
}

.lw-filter-check.is-active > span {
  border-color: var(--lw-blue);
  background:
    linear-gradient(135deg, transparent 0 45%, #fff 45% 58%, transparent 58%) 3px 1px / 9px 11px no-repeat,
    var(--lw-blue);
}

.lw-filter-check strong {
  font-weight: 500;
}

.lw-filter-check em {
  color: var(--lw-muted);
  font-size: 12px;
  font-style: normal;
}

.lw-archive-page.is-category-archive .lw-page-title {
  align-items: center;
  margin-top: 24px;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(11, 102, 195, 0.08), rgba(255, 216, 77, 0.16)),
    #fff;
  box-shadow: 0 14px 38px rgba(15, 52, 91, 0.06);
  padding: 24px;
}

.lw-archive-page.is-category-archive .lw-page-title h1 {
  font-size: clamp(30px, 4vw, 44px);
}

.lw-archive-page.is-category-archive .lw-archive-layout {
  grid-template-columns: minmax(0, 1fr) 280px;
}

.lw-category-summary {
  margin: 0 0 18px;
}

.lw-category-summary h2 {
  margin: 0 0 8px;
  font-size: 20px;
}

.lw-category-summary p {
  margin: 0;
  color: var(--lw-muted);
  line-height: 1.75;
}

.lw-archive-page.is-category-archive .lw-grid.is-three {
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.lw-archive-description p {
  margin: 8px 0 0;
  color: var(--lw-muted);
  line-height: 1.75;
}

.lw-side {
  display: grid;
  gap: 14px;
}

.lw-side-panel,
.lw-content-section,
.lw-panel {
  padding: 18px;
}

.lw-content-section > h2,
.lw-side-panel > h2,
.lw-panel > h2 {
  margin-top: 0;
}

.lw-content-section > p,
.lw-side-panel > p,
.lw-panel > p {
  margin-top: 10px;
}

.lw-content-section > .lw-note + .lw-button,
.lw-content-section > p + .lw-button,
.lw-panel > .lw-note + .lw-button,
.lw-panel > p + .lw-button,
.lw-side-panel > p + .lw-button {
  margin-top: 14px;
}

.lw-home-side .lw-side-panel {
  padding: 20px 22px;
  border-color: #d8e3f1;
  box-shadow: 0 10px 24px rgba(15, 52, 91, 0.05);
}

.lw-home-side .lw-side-panel h2 {
  font-size: 22px;
}

.lw-category-list {
  display: grid;
  gap: 0;
  margin: 12px 0 16px !important;
  padding: 0 !important;
  list-style: none;
}

.lw-category-list li + li {
  border-top: 1px solid var(--lw-line);
}

.lw-category-list a {
  display: grid;
  grid-template-columns: 30px 1fr auto;
  gap: 10px;
  align-items: center;
  min-height: 46px;
  color: var(--lw-ink);
  text-decoration: none;
}

.lw-category-list a:hover {
  color: var(--lw-blue);
  text-decoration: none;
}

.lw-category-list strong {
  font-size: 14px;
}

.lw-category-list em {
  color: var(--lw-muted);
  font-size: 13px;
  font-style: normal;
}

.lw-cat-icon {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: var(--lw-blue-soft);
}

.lw-cat-sweets { background: #ff4f76; }
.lw-cat-rice { background: #8b949e; clip-path: polygon(50% 0, 100% 86%, 0 86%); }
.lw-cat-bread { background: #f5a623; border-radius: 999px; }
.lw-cat-bento { background: #ff6a00; }
.lw-cat-ice { background: #43a7e8; clip-path: polygon(50% 0, 90% 45%, 62% 100%, 38% 100%, 10% 45%); }
.lw-cat-drink { background: #34a853; border-radius: 999px; }
.lw-cat-default { background: var(--lw-blue-soft); }

.lw-usecase-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.lw-usecase-chip {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  border: 1px solid var(--lw-line);
  border-radius: 999px;
  background: #fff;
  color: var(--lw-blue-deep);
  font-size: 13px;
  font-weight: 800;
  padding: 0 14px;
  text-decoration: none;
}

.lw-usecase-chip:hover {
  background: var(--lw-blue-soft);
  color: var(--lw-blue-deep);
  text-decoration: none;
}

.lw-home-notice {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin: 24px 0 0;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #f8fbff;
  padding: 16px 18px;
}

.lw-home-notice h2 {
  margin: 0 0 6px;
  color: var(--lw-ink);
  font-size: 18px;
}

.lw-home-notice p {
  margin: 0;
  color: var(--lw-muted);
  font-size: 13px;
  line-height: 1.75;
}

.lw-home-notice-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.lw-home-notice .lw-button {
  min-height: 38px;
  min-width: 0;
  white-space: nowrap;
}

.lw-more-row {
  display: flex;
  justify-content: center;
  margin-top: 14px;
  margin-bottom: 4px;
}

.lw-button-outline {
  min-width: 260px;
  border: 1px solid var(--lw-blue);
  background: #fff;
  color: var(--lw-blue);
}

.lw-button-outline:hover {
  background: var(--lw-blue);
  color: #fff;
}

.lw-category-band {
  margin: 14px 0 0;
  padding: 2px 24px 22px;
  border-radius: 8px 8px 0 0;
  background: #f2f7fd;
}

.lw-category-panel {
  box-shadow: none;
}

.lw-side-panel ul,
.lw-content-section ul {
  margin: 12px 0 0;
  padding-left: 1.2em;
}

.lw-filter-bar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  gap: 12px;
  margin: 18px 0;
}

.lw-product-hero {
  display: grid;
  grid-template-columns: minmax(280px, 0.85fr) minmax(0, 1.15fr);
  gap: 26px;
  padding: 24px;
  margin: 24px 0;
}

.lw-product-page .lw-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 18px 0 0;
}

.lw-product-page .lw-product-hero {
  grid-template-columns: minmax(360px, 0.95fr) minmax(0, 0.9fr);
  align-items: start;
  border-color: #d8e3f1;
  box-shadow: 0 12px 32px rgba(15, 52, 91, 0.06);
}

.lw-product-image {
  border-radius: 8px;
  background: #eef5fd;
  overflow: hidden;
  aspect-ratio: 1 / 1;
}

.lw-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.lw-product-title {
  margin: 14px 0;
  font-size: clamp(26px, 3vw, 40px);
}

.lw-product-summary {
  display: grid;
  gap: 8px;
  margin: 16px 0;
}

.lw-product-summary div {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 12px;
  align-items: center;
  min-height: 34px;
}

.lw-product-summary dt {
  color: var(--lw-muted);
  font-weight: 800;
}

.lw-product-summary dd {
  margin: 0;
  color: var(--lw-ink);
  font-size: 17px;
  font-weight: 700;
}

.lw-meta-pending-note {
  margin: 14px 0;
  border: 1px solid #d7e5f4;
  border-radius: 8px;
  background: #f8fbff;
  color: var(--lw-muted);
  font-size: 13px;
  line-height: 1.7;
  padding: 12px 14px;
}

.lw-official-link-row {
  margin: 16px 0 0;
}

.lw-official-button {
  width: 100%;
  min-height: 48px;
  box-shadow: 0 10px 20px rgba(11, 102, 195, 0.18);
}

.lw-product-lower {
  grid-template-columns: minmax(0, 1fr) 340px;
}

.lw-mini-products {
  display: grid;
  gap: 0;
  margin: 12px 0 0 !important;
  padding: 0 !important;
  list-style: none;
}

.lw-mini-products li + li {
  border-top: 1px solid var(--lw-line);
}

.lw-mini-products a {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 12px;
  align-items: center;
  min-height: 72px;
  color: var(--lw-ink);
  text-decoration: none;
}

.lw-mini-products a:hover {
  color: var(--lw-blue);
  text-decoration: none;
}

.lw-mini-thumb {
  display: block;
  width: 54px;
  height: 54px;
  overflow: hidden;
  border-radius: 6px;
  background: #eef5fd;
}

.lw-mini-thumb img,
.lw-mini-thumb .lw-card-image-placeholder {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lw-mini-products strong,
.lw-mini-products em {
  display: block;
}

.lw-mini-products strong {
  font-size: 13px;
  line-height: 1.45;
}

.lw-mini-products em {
  margin-top: 2px;
  color: var(--lw-muted);
  font-size: 12px;
  font-style: normal;
}

.lw-info-table {
  width: 100%;
  border-collapse: collapse;
  margin: 14px 0;
}

.lw-info-table th,
.lw-info-table td {
  border-bottom: 1px solid var(--lw-line);
  padding: 12px 8px;
  vertical-align: top;
}

.lw-info-table th {
  width: 120px;
  color: var(--lw-muted);
  font-weight: 700;
  text-align: left;
}

.lw-info-table td.is-unconfirmed {
  color: var(--lw-muted);
}

.lw-note {
  border-left: 4px solid var(--lw-blue);
  background: var(--lw-blue-soft);
  border-radius: 8px;
  color: #24405f;
  line-height: 1.75;
  margin: 12px 0 0;
  padding: 14px 16px;
}

.lw-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 24px 0;
}

.lw-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  min-height: 38px;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #fff;
  color: var(--lw-blue-deep);
  text-decoration: none;
}

.lw-pagination .current {
  background: var(--lw-blue);
  color: #fff;
  border-color: var(--lw-blue);
}

.lw-static-hero {
  margin: 24px 0 18px;
  padding: 28px;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(11, 102, 195, 0.08), rgba(255, 216, 77, 0.18)),
    #fff;
  box-shadow: 0 14px 38px rgba(15, 52, 91, 0.06);
}

.lw-static-hero h1 {
  margin: 0;
  color: var(--lw-ink);
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 800;
  line-height: 1.25;
}

.lw-static-hero p {
  max-width: 760px;
  margin: 12px 0 20px;
  color: var(--lw-muted);
  line-height: 1.8;
}

.lw-static-hero .lw-search {
  max-width: 820px;
}

.lw-category-hub {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 24px;
}

.lw-category-tile {
  display: grid;
  grid-template-columns: 34px 1fr auto;
  gap: 12px;
  align-items: center;
  min-height: 72px;
  border: 1px solid var(--lw-line);
  border-radius: 8px;
  background: #fff;
  color: var(--lw-ink);
  text-decoration: none;
  padding: 16px;
  box-shadow: 0 10px 24px rgba(15, 52, 91, 0.05);
}

.lw-category-tile:hover {
  border-color: var(--lw-blue);
  color: var(--lw-blue);
  text-decoration: none;
}

.lw-category-tile strong {
  font-size: 16px;
}

.lw-category-tile em {
  color: var(--lw-muted);
  font-size: 13px;
  font-style: normal;
}

.lw-common-footer {
  margin-top: 38px;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  border-top: 1px solid var(--lw-line);
  background: #f8fbff;
}

.lw-common-footer-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  padding: 28px 0;
}

.lw-footer-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--lw-blue-deep);
  font-size: 20px;
  font-weight: 800;
  text-decoration: none;
}

.lw-footer-brand:hover,
.lw-footer-nav a:hover {
  color: var(--lw-blue);
  text-decoration: none;
}

.lw-footer-brand span {
  border: 1px solid var(--lw-blue);
  border-radius: 6px;
  color: var(--lw-blue);
  font-size: 12px;
  padding: 3px 7px;
}

.lw-footer-note {
  max-width: 760px;
  margin: 10px 0 0;
  color: var(--lw-muted);
  font-size: 13px;
  line-height: 1.7;
}

.lw-footer-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 20px;
  justify-content: flex-end;
}

.lw-footer-nav a {
  color: var(--lw-ink);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  .lw-topbar-inner {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 14px 0;
  }

  .lw-brand,
  .lw-topnav {
    justify-content: center;
  }

  .lw-topnav {
    gap: 22px;
  }

  .lw-hero,
  .lw-main-layout,
  .lw-product-hero,
  .lw-home-layout {
    grid-template-columns: 1fr;
  }

  .lw-grid,
  .lw-grid.is-three {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lw-grid-home {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lw-home-product-grid,
  .lw-quick-category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lw-home-notice {
    grid-template-columns: 1fr;
  }

  .lw-home-notice-actions {
    justify-content: flex-start;
  }

  .lw-category-hub {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lw-common-footer-inner {
    grid-template-columns: 1fr;
  }

  .lw-footer-nav {
    justify-content: flex-start;
  }

  .lw-archive-toolbar {
    grid-template-columns: 1fr;
  }
}

/*834px以下*/
@media screen and (max-width: 834px){
  .lw-shell,
  .lw-page,
  .lw-home-inner {
    width: min(100% - 20px, 1180px);
  }

  .lw-hero,
  .lw-product-hero,
  .lw-panel,
  .lw-content-section,
  .lw-side-panel,
  .lw-static-hero {
    padding: 18px;
  }

  .lw-filter-bar,
  .lw-section-head,
  .lw-page-title {
    display: grid;
    grid-template-columns: 1fr;
  }

  .lw-topnav {
    overflow-x: auto;
    justify-content: center;
    gap: 18px;
    width: 100%;
    padding: 0 4px 4px;
  }

  .lw-hero {
    min-height: auto;
    margin-top: 12px;
    padding: 16px 14px;
  }

  .lw-search,
  .lw-top-search,
  .lw-hero .lw-search {
    grid-template-columns: minmax(0, 1fr) 48px;
    width: 100%;
    min-height: 42px;
  }

  .lw-search button,
  .lw-top-search button,
  .lw-hero .lw-search button {
    width: 48px;
    min-width: 48px;
    min-height: 42px;
  }

  .lw-search input[type="search"],
  .lw-search input[type="text"],
  .lw-top-search input,
  .lw-hero .lw-search input[type="search"] {
    min-height: 42px;
  }

  .lw-hero-aside {
    display: none;
  }

  .lw-home-stats {
    display: flex;
    grid-template-columns: none;
  }

  .lw-common-footer-inner {
    width: min(100% - 20px, 1180px);
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  .lw-shell,
  .lw-page,
  .lw-home-inner {
    width: min(100% - 24px, 1180px);
  }

  .lw-topbar {
    min-height: 0;
  }

  .lw-topbar-inner {
    gap: 10px;
    padding: 10px 0 12px;
  }

  .lw-brand {
    gap: 8px;
    font-size: 24px;
  }

  .lw-brand em {
    min-height: 26px;
    font-size: 12px;
    padding: 0 8px;
  }

  .lw-topnav {
    gap: 16px;
  }

  .lw-topnav a {
    font-size: 14px;
  }

  .lw-grid,
  .lw-grid.is-three,
  .lw-stat-grid,
  .lw-grid-home,
  .lw-home-product-grid,
  .lw-quick-category-grid,
  .lw-category-hub {
    grid-template-columns: 1fr;
  }

  .lw-hero h1 {
    font-size: 24px;
    line-height: 1.22;
  }

  .lw-hero .lw-lead {
    font-size: 14px;
  }

  .lw-quick-category-card {
    grid-template-columns: 86px minmax(0, 1fr);
  }

  .lw-quick-category-thumb {
    width: 86px;
    height: 58px;
  }

  .lw-cocoon-affiliate-links .product-item-buttons,
  .lw-cocoon-affiliate-links .amazon-item-buttons,
  .lw-affiliate-links {
    grid-template-columns: 1fr;
  }
}