/* ============================================
   Part: FV（ヘッダー画像 + PR表記）
   ============================================ */
.fv {
  position: relative;
  margin: 0 -5px 16px;
}
.fv img {
  width: 100%;
  height: auto;
  display: block;
}
.fv__pr {
  position: absolute;
  right: 4px;
  bottom: 4px;
  font-size: 11px;
  color: #999;
  background: rgba(255, 255, 255, 0.8);
  padding: 1px 6px;
  border-radius: 2px;
}

/* ============================================
   Part: Lead（冒頭リード）
   ============================================ */
.lead {
  margin: 0.8em 0;
  font-size: 18px;
}
.lead strong {
  color: #d21336;
}
.lead:not(.lead--blue) {
  font-size: 20px;
}
.lead--blue {
  margin: 0.3em 0;
}
.lead--blue strong {
  color: #0066CC;
}

/* ============================================
   Part: Balloon（吹き出し）
   ============================================ */
.balloon {
  width: 100%;
  margin: 1.5em 0;
  display: flex;
}
.balloon--right {
  flex-direction: row-reverse;
}
.balloon__icon {
  flex-basis: 80px;
  flex-shrink: 0;
}
.balloon__icon img {
  width: 80px;
  max-width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 50%;
}
.balloon__body {
  background: var(--c-bg-accent);
  margin: 0 14px auto;
  min-height: 27px;
  padding: 5px 13px;
  border-radius: 22px;
  box-shadow: var(--shadow-sm);
  position: relative;
  display: inline-block;
}
.balloon__body::before {
  content: "";
  position: absolute;
  top: 10px;
  width: 24px;
  height: 18px;
}
.balloon .balloon__body::before {
  left: -15px;
  border-right: 12px solid var(--c-bg-accent);
  border-top-right-radius: 100%;
  transform: rotate(285deg);
}
.balloon--right .balloon__body::before {
  right: -15px;
  left: auto;
  border-right: none;
  border-left: 12px solid var(--c-bg-accent);
  border-top-left-radius: 100%;
  border-top-right-radius: 0;
  transform: rotate(75deg);
}
.balloon__body p {
  margin: 0;
  padding: 0;
  letter-spacing: -0.01em;
}

/* ============================================
   Part: Heading (h2)
   ============================================ */
.heading {
  font-size: var(--fs-xl);
  color: var(--c-text-on-primary);
  background: var(--c-primary);
  text-align: center;
  padding: var(--sp-lg) var(--sp-md);
  margin: var(--sp-2xl) -5px var(--sp-lg);
  font-weight: 700;
  line-height: 1.3;
  position: relative;
}
.heading::before {
  display: none;
}

/* ============================================
   Part: Heading Balloon（吹き出し型見出し）
   ============================================ */
.heading-balloon {
  font-size: 20px;
  color: #fff;
  background: var(--c-primary);
  font-weight: 600;
  padding: 1rem;
  border-radius: 5px;
  letter-spacing: .05em;
  text-align: center;
  position: relative;
  margin-bottom: 0;
  line-height: 1.3;
}
.heading-balloon + .comp-table-wrap {
  margin-top: 0;
}
.heading-balloon + :not(.comp-table-wrap) {
  margin-top: 1.5em;
}
.heading-balloon::after {
  content: "";
  position: absolute;
  bottom: -9px;
  left: 1em;
  width: 0;
  height: 0;
  border-width: 20px 20px 0 20px;
  border-style: solid;
  border-color: var(--c-primary) transparent transparent transparent;
}

/* ============================================
   Part: caution-stripe（注意喚起ストライプ）
   ============================================ */
.stripe-danger {
  background-color: #c0392b;
  background: linear-gradient(-45deg,
    var(--st1, var(--c-danger)) 25%, var(--st2, #c0392b) 25%,
    var(--st2, #c0392b) 50%, var(--st1, var(--c-danger)) 50%,
    var(--st1, var(--c-danger)) 75%, var(--st2, #c0392b) 75%,
    var(--st2, #c0392b));
  background-size: 20px 20px;
}
.caution-stripe { margin: 1em 0; padding: 10px; }
.caution-stripe__inner { background: var(--c-bg, #fff); border-radius: var(--radius-md, 8px); overflow: hidden; }
.caution-stripe__header { padding: var(--sp-md) var(--sp-lg); text-align: center; border-bottom: 3px solid var(--c-danger); }
.caution-stripe__badge { display: inline-block; background: var(--c-danger); color: #ff0; font-size: 11px; font-weight: 800; padding: 3px 14px; border-radius: 3px; letter-spacing: 0.15em; margin-bottom: var(--sp-sm); }
.caution-stripe__title { font-size: var(--fs-xl, 20px); font-weight: 800; color: var(--c-danger); margin: 0; line-height: 1.5; }
.caution-stripe__body { padding: var(--sp-md) var(--sp-lg); }
.caution-stripe__list { margin: 0; padding-left: 1.8em; list-style: disc; }
.caution-stripe__list li { margin: 0.6em 0; font-size: var(--fs-md, 16px); line-height: 1.7; }
.caution-stripe__list li::marker { color: #e6b422; font-size: 150%; line-height: 0; }
.caution-stripe__list li strong { color: var(--c-danger); }
.caution-stripe__footer { padding: 0 var(--sp-lg) var(--sp-lg); font-size: var(--fs-sm, 15px); line-height: 1.7; }
.caution-stripe__footer p { margin: 0.3em 0; }

/* ============================================
   Part: numbered-points（番号付きポイント）
   ============================================ */
.numbered-points {
  counter-reset: np-number;
}
.numbered-points__item {
  margin-bottom: 50px;
}
.numbered-points__item:last-child {
  margin-bottom: 10px;
}
.numbered-points__heading {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 18px;
  font-weight: bold;
  margin: 30px 0 0;
  padding-bottom: 5px;
  border-bottom: 3px dotted var(--c-primary);
}
.numbered-points__heading::before {
  content: counter(np-number);
  counter-increment: np-number;
  background: var(--c-primary);
  color: var(--c-text-on-primary);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}
.numbered-points__body {
  display: flex;
  flex-direction: column;
}
.numbered-points__image {
  order: -1;
  margin-bottom: 15px;
}
.numbered-points__image img {
  width: 100%;
  height: auto;
}
.numbered-points__text {
  width: 100%;
}
.numbered-points__text p {
  font-size: 17px;
}
@media (min-width: 768px) {
  .numbered-points__item { margin-bottom: 40px; }
  .numbered-points__item:last-child { margin-bottom: 15px; }
  .numbered-points__body { flex-direction: row; gap: 20px; align-items: center; }
  .numbered-points__image { flex: 0 0 400px; order: 0; margin-bottom: 0; }
  .numbered-points__text { flex: 1; }
}

/* ============================================
   Part: Positioning Map（ポジショニングマップ）
   ============================================ */
.positioning-map {
  text-align: center;
  margin: 1.5em 0;
}
.positioning-map img {
  max-width: 100%;
  height: auto;
  border-radius: var(--radius-md);
}
.positioning-map__placeholder {
  width: 100%;
  height: 300px;
  background: #f0f0f0;
  border: 2px dashed #ccc;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #999;
  font-size: 14px;
}

/* ============================================
   Part: Down Arrow（下矢印・バウンスアニメーション付き）
   ============================================ */
.down-arrow {
  display: flex;
  justify-content: center;
  margin: 1em 0;
  animation: down-arrow-bounce 1.5s ease infinite;
}
.down-arrow > span {
  width: 100px;
  height: 65px;
  padding: 0 10px;
  box-sizing: border-box;
}
.down-arrow > span::before {
  content: "";
  display: block;
  margin: 0 auto;
  width: 50%;
  height: 40%;
  background: #ff6b35;
}
.down-arrow > span::after {
  content: "";
  display: block;
  width: 100%;
  height: 60%;
  background:
    linear-gradient(to top right, transparent 49%, #ff6b35 50%) top left/50% 100% no-repeat,
    linear-gradient(to top left, transparent 49%, #ff6b35 50%) top right/50% 100% no-repeat;
}
@keyframes down-arrow-bounce {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-8px); }
  100% { transform: translateY(0); }
}

/* ============================================
   Part: Comparison Table（商品比較表）
   ============================================ */
.comp-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  text-align: center;
  line-height: 1.25;
}
.comp-table thead tr { background-color: #fff; }
.comp-table thead td { padding: 0.5em; border-right: 2px solid #eee; }
.comp-table thead td img { width: 50px; height: auto; margin: 0 auto; display: block; }
.comp-table__image { border-bottom: none !important; }
.comp-table__image td img { max-width: 100%; height: auto; border-radius: 4px; }
.comp-table .comp-table__product { position: sticky; top: 0; z-index: 9; background: #fff; }
.comp-table .comp-table__product { border-top: none !important; }
.comp-table .comp-table__product td { padding: 0.5em; border-right: 2px solid #eee; border-top: none; vertical-align: middle; }
.comp-table .comp-table__product a { color: #1a0dab; font-weight: bold; font-size: 13px; text-decoration: underline; }
.comp-table th { background-color: #f0f0f0; color: #000; padding: 1em; border-right: 2px solid #fff; font-size: .85em; }
.comp-table tr { background-color: #fff; border: 2px solid #eee; }
.comp-table td { padding: 1em .2em; border-right: 2px solid #eee; text-align: center; vertical-align: top; font-size: 13px; font-weight: bold; }
.comp-table td img.comp-icon { width: 50px; height: auto; margin: 0 auto 4px; display: block; }
.comp-table__image td { padding: 0.5em; border-right: 2px solid #eee; border-bottom: none; text-align: center; vertical-align: middle; }
.comp-table__cta td { vertical-align: bottom; }
.comp-table .comp-btn {
  display: inline-block; width: 100%; font-size: 10px; font-weight: 600;
  background-color: #66cdaa; color: #fff; padding: 1rem 0; border-radius: 0.5rem;
  text-decoration: none; text-align: center; position: relative; overflow: hidden;
  box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,0.5), 7px 7px 20px 0px rgba(0,0,0,0.1), 4px 4px 5px 0px rgba(0,0,0,0.1);
  transition: all 0.3s ease;
}
.comp-table .comp-btn:hover { background: #90ee90; opacity: 0.7; }
.comp-table .comp-btn::before {
  content: ""; position: absolute; top: -180px; left: 0;
  width: 30px; height: 100%; background-color: #fff;
  animation: comp-shiny 3s ease-in-out infinite;
}
@keyframes comp-shiny {
  0%   { transform: scale(0) rotate(45deg); opacity: 0; }
  80%  { transform: scale(0) rotate(45deg); opacity: 0.5; }
  81%  { transform: scale(4) rotate(45deg); opacity: 1; }
  100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
.comp-table .comp-blink { animation: comp-blink 1s ease infinite; color: #ff3333; font-size: 11px; font-weight: bold; }
@keyframes comp-blink { 0% { opacity: 0; } 100% { opacity: 1; } }
.comp-table .comp-marker { background: linear-gradient(transparent 60%, #ffff00 0%); }
.comp-stars { display: inline-flex; gap: 2px; justify-content: center; }
.comp-stars__star,
.comp-stars__star--empty,
.comp-stars__star--half {
  width: 18px; height: 18px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01z' fill='%23ffc107'/%3E%3C/svg%3E") no-repeat center / contain;
}
.comp-stars__star--empty {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01z' fill='%23e0e0e0'/%3E%3C/svg%3E");
}
.comp-stars__star--half {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3ClinearGradient id='h'%3E%3Cstop offset='50%25' stop-color='%23ffc107'/%3E%3Cstop offset='50%25' stop-color='%23e0e0e0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01z' fill='url(%23h)'/%3E%3C/svg%3E");
}
.comp-stars__num { font-size: 16px; font-weight: 800; color: #ff9800; margin-left: 2px; }
@media screen and (max-width: 600px) { .comp-table-wrap { overflow-x: scroll; } }
.note-sup { font-size: 10px; font-weight: normal; vertical-align: super; color: #888; }
.note-annotation { text-align: right; font-size: 10px; color: #888; line-height: 1.5; margin: 4px 0 0; }
.note-annotation p { margin: 0; }

/* ============================================
   Part: Compare Methods（他手段比較表）
   ============================================ */
.compare-methods { overflow-x: auto; }
.compare-methods table { border-collapse: collapse; margin: 0 auto; padding: 0; table-layout: fixed; width: 100%; }
.compare-methods th:nth-child(1),
.compare-methods td:nth-child(1) { width: 45px; border-right: 2px solid var(--c-primary); }
.compare-methods tr { background-color: #fff; padding: .35em; border: 2px solid #eee; }
.compare-methods th { line-height: 1.25; padding: 0.5em; border-right: 2px solid #fff; width: 120px; font-size: .85em; }
.compare-methods td { padding: 0.5em .1em; border-right: 2px solid #eee; text-align: center; font-size: 12px; font-weight: bold; vertical-align: top; }
.compare-methods td img { height: auto; width: 50px; display: block; margin: 0 auto; }
.compare-methods tbody th { color: var(--c-primary); border-right: 2px solid #eee; }
.compare-methods thead tr { background-color: #f0f0f0; color: #333; }
.compare-methods th:nth-child(2),
.compare-methods td:nth-child(2) { background-color: lightyellow; border-left: 2px solid var(--c-primary); border-right: 2px solid var(--c-primary); }
.compare-methods thead th:nth-child(2) { background-color: var(--c-primary); color: #fff; }
.compare-methods tr:first-child th:nth-child(2) { border-top: 2px solid var(--c-primary); }
.compare-methods tr:last-child td:nth-child(2) { border-bottom: 2px solid var(--c-primary); }
.compare-icon { display: inline-block; width: 50px; height: 38px; background-repeat: no-repeat; background-size: contain; }
.compare-icon--bad    { background-image: url('https://adguild-design.pages.dev/parts/img/compare-0.webp'); }
.compare-icon--poor   { background-image: url('https://adguild-design.pages.dev/parts/img/compare-1.webp'); }
.compare-icon--good   { background-image: url('https://adguild-design.pages.dev/parts/img/compare-2.webp'); }
.compare-icon--great  { background-image: url('https://adguild-design.pages.dev/parts/img/compare-3.webp'); }
@media screen and (max-width: 600px) { .compare-methods { overflow-x: scroll; } }

/* ============================================
   Part: Product Card
   ============================================ */
.product-card { border: 6px solid #e8e8e8; border-radius: 4px; padding: 10px; margin: 1.5em 0; }
.product-card strong { color: #d21336; font-style: normal; }
.product-card__title { color: var(--c-text); font-size: 20px; font-weight: bold; border-bottom: 1px dotted #696969; margin: 0; padding-bottom: 8px; display: flex; align-items: flex-end; gap: 8px; }
.product-card__rank { width: 55px; height: 36px; background-repeat: no-repeat; background-size: contain; flex-shrink: 0; }
.product-card__rank--1st { background-image: url('https://adguild-design.pages.dev/parts/img/rank-1st.webp'); }
.product-card__rank--2nd { background-image: url('https://adguild-design.pages.dev/parts/img/rank-2nd.webp'); }
.product-card__rank--3rd { background-image: url('https://adguild-design.pages.dev/parts/img/rank-3rd.webp'); }
.product-card__image { text-align: center; margin: 1em 0; }
.product-card__image img { max-width: 100%; height: auto; }
.product-card__features { margin: 1em 0 0; padding: 0; list-style: none; font-size: 18px; }
.product-card__features > li { position: relative; padding-left: 1.6em; font-weight: 700; }
.product-card__features > li::before {
  content: ""; position: absolute; left: 0; top: 0.25em; width: 1.2em; height: 1.2em;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpolygon%20points%3D%22221.18%2C250.621%20153.547%2C183.836%2091.934%2C245.453%2091.668%2C245.719%2091.668%2C245.719%2091.614%2C245.773%20221.207%2C374.516%20512%2C83.02%20450.121%2C21.14%20450.121%2C21.136%20450.121%2C21.136%20450.062%2C21.082%20407.187%2C64.109%20348.152%2C123.258%22%20fill%3D%22%23df5656%22%2F%3E%3Cpath%20d%3D%22M439.379%2C211.941v-0.113l-50.34%2C50.484V407.5c0%2C18.266-14.883%2C33.078-33.078%2C33.078H83.418c-18.266%2C0-33.078-14.813-33.078-33.078V259.578v-13.66V134.957c0-18.192%2C14.812-33.082%2C33.078-33.082h230.188l6.543-6.539l25.546-25.59l17.809-17.766c-0.023-0.004-0.047-0.004-0.066-0.004l0.074-0.078c-2.446-0.211-4.962-0.36-7.551-0.36H83.418C37.394%2C51.539%2C0%2C89.008%2C0%2C134.957V407.5c0%2C46.028%2C37.394%2C83.418%2C83.418%2C83.418h272.543c45.954%2C0%2C83.418-37.39%2C83.418-83.418V292.227l0.058-80.34L439.379%2C211.941z%22%20fill%3D%22%23df5656%22%2F%3E%3C%2Fsvg%3E");
}
.product-card .highlight { color: #d21336; }
.product-card .highlight2 { color: #ff3333; }
.product-card .marker { background: linear-gradient(transparent 60%, #ffff00 0%); font-weight: bold; }
.product-card .note { font-size: 10px; }
.product-card__spec { width: 100%; table-layout: fixed; border-collapse: collapse; text-align: center; }
.product-card__spec th { border: 1.3px solid #e0e0e0; font-size: 13px; background-color: #f7f7f7; padding: 0.4em; }
.product-card__spec td { border: 1.3px solid #e0e0e0; font-size: 13px; background-color: #fff; padding: 0.4em; font-weight: bold; }
.product-card__detail { margin: 1em 0; }
.product-card__review { font-size: 12px; line-height: 1.2; margin-bottom: 0.5em; }
.product-card__review-inner { padding: 9px 14px; border: 1px solid #E6ECF0; border-radius: 10px; }
.product-card__reviewer { display: flex; align-items: center; gap: 4px; }
.product-card__reviewer-avatar { width: 25px; height: 25px; background-image: url('https://adguild-design.pages.dev/parts/img/review-avatar.webp'); background-repeat: no-repeat; background-size: contain; border-radius: 50%; flex-shrink: 0; }
.product-card__reviewer-info { display: flex; align-items: center; flex-wrap: wrap; color: #765555; }
.product-card__reviewer-name { margin-right: 10px; font-size: 15px; color: var(--c-text); font-weight: bold; }
.product-card__reviewer-age { color: var(--c-text); font-size: 12px; }
.product-card__stars { display: flex; align-items: center; gap: 2px; }
.product-card__star { position: relative; display: inline-block; width: 0; height: 0; margin-left: .5em; margin-right: .5em; margin-bottom: 1em; border-right: .3em solid transparent; border-bottom: .7em solid #FC0; border-left: .3em solid transparent; font-size: 7px; }
.product-card__star::before,
.product-card__star::after { content: ""; display: block; width: 0; height: 0; position: absolute; top: .6em; left: -1em; border-right: 1em solid transparent; border-bottom: .7em solid #FC0; border-left: 1em solid transparent; transform: rotate(-35deg); }
.product-card__star::after { transform: rotate(35deg); }
.product-card__review-tag-wrap { margin: 5px 10px 0; }
.product-card__review-tag { padding: 3px 6px; border: 1px solid #e0e0e0; border-radius: 10px; color: #d2691e; background-color: #f7f7f7; font-size: 10px; }
.product-card__review-text { margin: 10px 0 0; font-size: 15px; }
.product-card__disclaimer { text-align: right; font-size: 10px; color: #888; }
.product-card__cta { display: flex; justify-content: center; margin-top: 1.2em; }
.product-card__cta-inner { flex-basis: 100%; text-align: center; }
.product-card__cta-link { position: relative; font-size: 1.2em; display: block; padding: 1em; text-decoration: none; color: #fff; font-weight: 700; background-color: #66cdaa; border-bottom: solid 3px #3cb371; border-radius: 4px; transition: all 0.2s; }
.product-card__cta-link:hover { transform: translateY(3px); box-shadow: 0px 0px 1px rgba(0,0,0,0.2); border-bottom: solid 1px #3cb371; }
.product-card__blink { animation: product-card-blink 1s ease infinite; color: #ff0000; font-size: 12px; font-weight: bold; }
.product-card__blink p { margin: 0.2em 0; line-height: 1.5; }
@keyframes product-card-blink { 0% { opacity: 0; } 100% { opacity: 1; } }
.product-card__hurdle { color: #ff8c00; font-size: 12px; font-weight: bold; margin: 0.2em 0; line-height: 1.5; }

/* ============================================
   Part: Point Heading（ポイント見出し）
   ============================================ */
.point-heading { position: relative; border-top: solid 2px var(--c-primary); border-bottom: solid 2px var(--c-primary); background: #fff; line-height: 2em; padding: 4px 5px; margin: 32px 0 12px; text-align: left; font-size: 18px; font-weight: bold; }
.point-heading__label { position: absolute; left: 0; bottom: 100%; background: var(--c-primary); color: #fff; border-radius: 5px 5px 0 0; padding: 5px 7px 3px; font-size: 16px; font-weight: bold; line-height: 1; letter-spacing: 0.05em; display: flex; align-items: center; }
.point-heading__label img { width: 13px; height: 16px; margin-right: 6px; }
@media screen and (max-width: 600px) {
  .point-heading { font-size: 18px; line-height: 1.3em; border-top: solid 1px var(--c-primary); border-bottom: solid 1px var(--c-primary); padding: 8px 10px; }
  .point-heading__label { padding: 3px 4px 2px; font-size: 11px; }
  .point-heading__label img { transform: scale(0.8); margin-right: 3px; }
}

/* ============================================
   Part: Caution Box（注意点ボックス）
   ============================================ */
.caution-box { background: #fff9e6; border-left: 4px solid var(--c-warning); padding: 16px; margin: 1em 0; font-size: 14px; line-height: 1.6; }
.caution-box ul { margin: 0.5em 0 0 1.2em; padding: 0; }
.caution-box li { margin-bottom: 0.4em; }

/* ============================================
   Part: Recommend List（こんな人におすすめ！）
   ============================================ */
.recommend { border: 2px solid #f3d1d8; padding: 14px; max-width: 420px; background-color: #fff7f9; border-radius: 16px; box-shadow: 0 4px 8px rgba(243, 209, 216, 0.3); margin: 30px auto; }
.recommend__header { display: flex; align-items: flex-start; justify-content: flex-start; position: relative; margin-bottom: 15px; }
.recommend__illust { width: 64px; height: auto; border-radius: 8px; object-fit: contain; flex-shrink: 0; }
.recommend__title { background-color: #e38a9e; color: #fff; padding: 10px 14px; border-radius: 16px; font-size: 18px; font-weight: bold; position: relative; max-width: 80%; line-height: 1.4; margin-left: 12px; }
.recommend__title::after { content: ""; position: absolute; left: -12px; top: 14px; border-width: 8px 12px 8px 0; border-style: solid; border-color: transparent #e38a9e transparent transparent; }
.recommend__box { background-color: #fffceb; border: 1px solid #e0d9c3; padding: 12px; border-radius: 12px; box-shadow: 0 2px 6px rgba(224, 217, 195, 0.3); margin-top: 10px; }
.recommend__list { padding-left: 24px; margin: 0; list-style: none; font-size: 18px; line-height: 1.8; color: var(--c-text); }
.recommend__list li { position: relative; padding: 8px 0 8px 0.5em; border-bottom: 1px dashed #e0d9c3; font-weight: bold; }
.recommend__list li:last-child { border-bottom: none; }
.recommend__list li::before { content: "\2714"; position: absolute; left: -1.2em; top: 8px; color: #f19c9c; font-size: 16px; }

/* ============================================
   Part: CTA Button（オーラエフェクト付き）
   ============================================ */
.cta-block { text-align: center; margin: 1.5em 0; }
.cta-block__benefit { font-size: 18px; font-weight: bold; color: #e67e22; margin-bottom: 0.5em; }
.cta-aura { position: relative; width: 90%; margin: 0 auto; text-align: center; }
.cta-aura a { display: block; padding: 18px 40px; color: #fff; font-size: 18px; font-weight: bold; line-height: 1.5; text-decoration: none; border-radius: 50px; position: relative; z-index: 1; background: #27ae60; }
.cta-aura::before,
.cta-aura::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50px; z-index: 0; background: #6fcf97; border: 1px solid #6fcf97; }
.cta-aura::before { animation: cta-aura-pulse 2s ease-out infinite; }
.cta-aura::after { animation: cta-aura-pulse 2s ease-out 1s infinite; }
@keyframes cta-aura-pulse { 0% { transform: scale(1, 1); opacity: 1; } 90% { opacity: .1; } 100% { transform: scale(1.2, 1.5); opacity: 0; } }
.cta-aura a span { display: block; position: relative; }
.cta-aura a span::after { content: ""; position: absolute; top: calc(50% - 4px); right: 25px; width: 8px; height: 8px; border-right: 2px solid #fff; border-top: 2px solid #fff; transform: rotate(45deg); }
.cta-block__hurdle { font-size: 16px; font-weight: bold; color: #d21336; margin-top: 0.5em; }

/* ============================================
   Part: Flow Steps（流れ・手順）
   ============================================ */
.flow-steps { counter-reset: flow-number; background: var(--c-bg-accent); padding: 30px 20px; border-radius: var(--radius-md); }
.flow-steps__item { position: relative; padding-left: 60px; padding-bottom: 40px; }
.flow-steps__item:last-child { padding-bottom: 0; }
.flow-steps__item::before { content: ""; position: absolute; left: 21px; top: 44px; bottom: 0; width: 2px; background: var(--c-primary); opacity: 0.3; }
.flow-steps__item:last-child::before { display: none; }
.flow-steps__header { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.flow-steps__number { counter-increment: flow-number; background: var(--c-primary); color: var(--c-text-on-primary); width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: bold; flex-shrink: 0; letter-spacing: 0.05em; position: absolute; left: 0; top: 0; z-index: 1; }
.flow-steps__number::before { content: counter(flow-number, decimal-leading-zero); }
.flow-steps__title { font-size: var(--fs-xl); font-weight: bold; line-height: 1.4; }
.flow-steps__image { margin-bottom: 16px; border-radius: var(--radius-md); overflow: hidden; }
.flow-steps__image img { width: 100%; height: auto; display: block; }
.flow-steps__text { font-size: var(--fs-md); line-height: 1.8; }
.flow-steps__text p { margin: 0.5em 0; }

/* ============================================
   Part: merit-list（箇条書きリスト）
   ============================================ */
.bullet-list { margin: 20px 10px 0 10px; background: #ffefd5; border-radius: var(--radius-md); padding: 15px 10px; color: #3d140a; }
.bullet-list ul { width: 100%; margin: 0; padding: 0; }
.bullet-list li { margin: 0 0 12px 0; padding: 0 0 0 28px; font-size: var(--fs-md); line-height: 1.6; list-style: none; position: relative; }
.bullet-list li::before { content: "\2713"; position: absolute; left: 0; top: 0; font-weight: bold; color: var(--c-main, #e63946); font-size: 18px; line-height: 1.6; }
.bullet-list li:last-child { margin-bottom: 0; }

/* ============================================
   Part: FAQ（よくある質問）
   ============================================ */
.faq { max-width: 750px; width: 100%; margin: auto; font-size: 16px; color: var(--c-text); box-sizing: border-box; background-color: #FFF8E9; padding: 1em; }
.faq > * + * { margin-block-start: 1em; }
.faq__item { background-color: #fff; }
.faq__item[open] .faq__question::after { rotate: 180deg; }
.faq__item[open] .faq__answer { opacity: 1; transform: translateY(0); }
.faq__question { display: block; list-style: none; cursor: pointer; position: relative; padding: 1em 2.5em 1em 1em; font-weight: normal; transition: 0.5s; box-shadow: 0 2px 6px 0px #dedede; border-radius: 5px; line-height: 1; }
.faq__question::-webkit-details-marker { display: none; }
.faq__question::before { content: "Q"; font-family: 'Lexend Deca', sans-serif; font-weight: 500; font-size: 1.4em; color: #4f5ed2; }
.faq__question::after { content: ""; position: absolute; top: calc(50% - 0.625em); right: 1.5em; transition: 0.5s; width: .75em; height: .75em; border-bottom: 4px solid #4f5ed2; border-right: 4px solid #4f5ed2; transform: rotate(45deg); }
.faq__answer { font-weight: 400; padding: 1em; background-color: #fff5f4; margin: .5em 0; opacity: 0; transform: translateY(-10px); transition: transform 0.5s; }
.faq__answer::before { content: "A"; font-family: 'Lexend Deca', sans-serif; font-weight: 500; font-size: 1.4em; color: #f1487c; }
@media screen and (max-width: 550px) { .faq { font-size: 3.6vw; } .faq__question::after { right: 1em; } }

/* ============================================
   Part: Closing（クロージング）
   ============================================ */
.eval-box { font-size: var(--fs-md); max-width: 750px; margin-left: auto; margin-right: auto; }
.eval-box ul { margin: 0; padding: 0; list-style: none; }
.eval-box__title { text-align: center; font-size: 1.5em; font-weight: 600; padding-top: 0.5em; position: relative; width: fit-content; margin: auto; }
.eval-box__title::before { display: none; }
.eval-box__content { margin: 0 2em; padding: 1em; border: solid 3px; border-radius: 10px; }
.eval-box__content li { line-height: 1.5; position: relative; padding-left: 2em; }
.eval-box__content li:not(:first-child) { margin-top: 0.75em; }
.eval-box__content li:not(:last-child) { border-bottom: dashed 2px; padding-bottom: 0.75em; }
.eval-box__content li::before { content: ""; position: absolute; left: 0; top: 0.1em; background: url('https://adguild-design.pages.dev/parts/img/eval-check.webp') no-repeat 0 0 / contain; aspect-ratio: 1 / 1; width: 1.5em; display: block; margin: 0; }
.eval-box--good .eval-box__title { color: #ff5e5e; }
.eval-box--good .eval-box__content { border-color: #ff5e5e; }
.eval-box--good .eval-box__content li:not(:last-child) { border-color: #ff5e5e; }
@media (max-width: 500px) { .eval-box { font-size: 3.3vw; } }
.closing__image { text-align: center; margin: 1.5em 0 0; }
.closing__image img { max-width: 100%; height: auto; }
.closing__placeholder { width: 100%; height: 200px; background: #f0f0f0; border: 2px dashed #ccc; border-radius: 8px; display: flex; align-items: center; justify-content: center; color: #999; font-size: 14px; }
.closing__final { margin: 1.5em 0; line-height: 1.8; font-size: 16px; }
.closing__anxiety { color: #2b72ab; font-weight: bold; font-size: 17px; margin: 0.8em 0 0.3em; }
.closing__nudge { margin: 0.8em 0; }
.closing__nudge strong { background: linear-gradient(transparent 60%, #ffff00 0%); }
.closing__push { text-align: center; font-size: 20px; font-weight: bold; color: #e67e22; margin: 1.5em 0 0.5em; line-height: 1.6; }
.closing__hurdle { text-align: center; font-size: 16px; font-weight: bold; color: #d21336; margin: 0.5em 0; }

/* ============================================
   Part: Shop List（対応エリア一覧）
   ============================================ */
.shop-list { width: 100%; font-size: 16px; }
@media screen and (max-width: 600px) { .shop-list { font-size: 12px; } }
.shop-list__row { width: 100%; display: flex; }
.shop-list__area { width: 22%; flex-shrink: 0; background: color-mix(in srgb, var(--c-primary) 15%, #fff); border: 2px solid color-mix(in srgb, var(--c-primary) 30%, #fff); border-right: none; padding: 0.4em 0; display: flex; }
.shop-list__row + .shop-list__row .shop-list__area { border-top: none; }
.shop-list__area-name { color: var(--c-primary); font-size: 1.1em; font-weight: bold; text-align: center; margin: auto; }
.shop-list__info { flex: 1; padding: 1em; background: #fff; border: 2px solid color-mix(in srgb, var(--c-primary) 30%, #fff); border-left: none; }
.shop-list__row + .shop-list__row .shop-list__info { border-top: none; }
.shop-list__buttons a { color: #1a0dab; text-decoration: underline; white-space: nowrap; font-size: 1em; margin: 0.5em 1em 0.5em 0; display: inline-block; }
