@charset "UTF-8";
/*==================================================================
    hikaku.css — womens-care.css をベースに拡張
===================================================================*/

/* ----------------------------------------------------------------
   .wrapper / .main / .content / .sidemenu  (#hikaku スコープ)
   womens-care.css は #womens でスコープされているため複製
---------------------------------------------------------------- */
#hikaku .wrapper {
  padding: 24px 0 120px;
}
@media screen and (max-width: 768px) {
  #hikaku .wrapper {
    padding: 30px 0 60px;
  }
}

#hikaku .main {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  padding: 0 20px;
}
@media screen and (max-width: 991px) {
  #hikaku .main {
    display: block;
  }
}

#hikaku .main .content {
  width: calc(100% - 20px - 270px);
  max-width: 960px;
  margin-right: 20px;
  min-width: 0;
}
@media screen and (max-width: 991px) {
  #hikaku .main .content {
    width: 100%;
    max-width: none;
    margin-right: 0;
    padding: 0 0 50px;
  }
}

#hikaku .main .sidemenu {
  width: 250px;
  padding: 30px 20px 20px;
  background-color: #f8f8f8;
  flex-shrink: 0;
  align-self: flex-start;
}
@media screen and (max-width: 991px) {
  #hikaku .main .sidemenu {
    width: 100%;
    padding: 30px 5.6vw 5px;
  }
}

/* ----------------------------------------------------------------
   .annotation
---------------------------------------------------------------- */
.page-hikaku .annotation {
  font-size: 1.2rem;
  color: #999;
}
.page-hikaku .mb10 { margin-bottom: 10px; }

/* ----------------------------------------------------------------
   Hero / FV
---------------------------------------------------------------- */
.hk-hero {
  background: #fff;
}

.hk-hero__cols {
  display: flex;
  align-items: stretch;
  max-width: 1030px;
  margin: 0 auto;
}

.hk-hero__photo {
  flex: 0 0 50%;
  max-width: 50%;
  overflow: hidden;
  background: #f0f0f0;
  min-height: 280px;
}

.hk-hero__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hk-hero__text {
  flex: 0 0 50%;
  max-width: 50%;
  padding: 30px 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
}

.hk-hero__labels {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.hk-label {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 1.2rem;
  font-weight: 700;
  white-space: nowrap;
}

.hk-label--pink  { background: #BEE3F8; color: #333; }
.hk-label--blue  { background: #2B6CB0; color: #fff; }
.hk-label--yellow { background: #F6AD55; color: #333; }

.hk-hero__title {
  font-size: 3.4rem;
  font-weight: 700;
  font-family: 'Oswald', sans-serif;
  color: #333;
  margin: 0 0 14px;
  line-height: 1.2;
}

.hk-hero__lead {
  font-size: 1.3rem;
  line-height: 1.8;
  color: #555;
  margin: 0;
}

.hk-hero__profile {
  margin-top: 16px;
  padding: 10px 14px;
  background: #f5f9ff;
  border-top: 1px solid #BEE3F8;
  border-radius: 4px;
  box-sizing: border-box;
}

.hk-profile-link {
  color: #2B6CB0;
  text-decoration: underline;
  font-size: 1.3rem;
}

.hk-pr-note {
  font-size: 1.1rem;
  color: #999;
  margin: 4px 0 0;
}

.hk-hero__cta {
  background: #2B6CB0;
  text-align: center;
  padding: 20px;
}

.hk-cta-btn {
  display: inline-block;
  background: #F6AD55;
  color: #333;
  font-weight: 700;
  font-size: 1.5rem;
  padding: 14px 32px;
  border: 2px solid #333;
  border-radius: 4px;
  text-decoration: none;
  line-height: 1.5;
}

.hk-anchor-note {
  font-size: 1.1rem;
  color: #888;
  margin: 6px 0 0;
}

/* ----------------------------------------------------------------
   Section common
---------------------------------------------------------------- */
.hk-sec {
  padding: 40px 0;
  border-bottom: 1px solid #eee;
}

/* ----------------------------------------------------------------
   SCORAD section
---------------------------------------------------------------- */
.hk-scorad__title {
  text-align: center;
  font-size: 1.8rem;
  font-weight: 700;
  color: #333;
  margin: 0 0 30px;
  line-height: 1.6;
}

.hk-scorad__title em {
  font-style: normal;
  color: #2B6CB0;
}

.hk-scorad__body {
  display: flex;
  gap: 30px;
  align-items: flex-start;
}

.hk-scorad__img {
  flex: 0 0 240px;
}

.hk-scorad__img img {
  width: 100%;
  height: auto;
  display: block;
}

.hk-scorad__text {
  flex: 1;
  min-width: 0;
}

.hk-scorad__text p {
  font-size: 1.4rem;
  line-height: 1.8;
  color: #555;
  margin: 0 0 16px;
}

.hk-scorad__points {
  list-style: none;
  margin: 0 0 16px;
  padding: 0;
}

.hk-scorad__point {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 16px;
  margin-bottom: 8px;
  font-weight: 700;
  font-size: 1.4rem;
  border-radius: 4px;
  color: #fff;
}

.hk-scorad__point-icon {
  flex-shrink: 0;
  width: 36px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hk-scorad__point-icon img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.hk-scorad__point-text {
  flex: 1;
}

.hk-scorad__point--01 { background: #2B6CB0; }
.hk-scorad__point--02 { background: #4DBCCD; }
.hk-scorad__point--03 { background: #1E4D8C; }

.hk-scorad__summary {
  font-size: 1.2rem;
  font-weight: 600;
  color: #666;
  margin: 10px 0 0;
  padding-top: 8px;
  border-top: 1px solid #BEE3F8;
}

.hk-scorad__doctor {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 30px;
  padding: 18px 22px;
  background: #f9f9f9;
  border-radius: 8px;
}

.hk-scorad__doctor-text {
  font-size: 1.5rem;
  font-weight: 400;
  color: #333;
  margin: 0;
  flex: 1;
}

.hk-scorad__doctor-img img {
  width: 90px;
  height: 90px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}

/* ----------------------------------------------------------------
   Steps (負のスパイラル) — #hikaku スコープ
   womens-care.css の #womens .steps と同じ構造
---------------------------------------------------------------- */
#hikaku .steps {
  padding: 0 0 40px;
}

#hikaku .steps_ttl {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  padding: 25px;
  background-color: #4A90D9;
}
@media screen and (max-width: 768px) {
  #hikaku .steps_ttl {
    padding: 20px 4vw;
  }
}

#hikaku .steps .ttl {
  width: 460px;
  font-weight: 700;
  color: #2B6CB0;
}
@media screen and (max-width: 768px) {
  #hikaku .steps .ttl {
    width: 100%;
  }
}

#hikaku .steps .ttl_main {
  width: 100%;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  font-size: 4rem;
  font-weight: 700;
  line-height: 1.4;
  margin: 0.2em 0;
  padding: 6px 0;
}
@media screen and (max-width: 768px) {
  #hikaku .steps .ttl_main {
    font-size: 2.6rem;
    padding: 5px 0;
  }
}

#hikaku .steps .ttl_main span {
  display: inline;
  font-size: 4rem;
  vertical-align: middle;
}
@media screen and (max-width: 768px) {
  #hikaku .steps .ttl_main span {
    font-size: 2.6rem;
  }
}

#hikaku .steps .ttl_sub {
  display: block;
  font-size: 1.8rem;
  line-height: 1.5;
  color: #fff;
}
@media screen and (max-width: 768px) {
  #hikaku .steps .ttl_sub {
    font-size: 1.5rem;
  }
}

#hikaku .steps .ttl_sub.-right {
  text-align: right;
}

#hikaku .steps_blocks {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px 40px 50px;
  background-color: #EBF5FB;
}
@media screen and (max-width: 768px) {
  #hikaku .steps_blocks {
    padding: 24px 15px 30px;
  }
}

#hikaku .steps_blocks .graph {
  width: 100%;
  max-width: 440px;
  padding: 10px 20px 24px;
  background-color: transparent;
  display: flex;
  justify-content: center;
}

#hikaku .steps_blocks .graph img {
  display: block;
  width: 100%;
  max-width: 400px;
  height: auto;
}

.steps_spiral {
  text-align: center;
  padding: 0 0 24px;
  width: 100%;
}

.steps_spiral img {
  max-width: 460px;
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

#hikaku .steps_list {
  width: 100%;
  display: flex;
  flex-flow: row nowrap;
  gap: 16px;
  align-items: stretch;
}
@media screen and (max-width: 768px) {
  #hikaku .steps_list {
    flex-direction: column;
    gap: 12px;
  }
}

#hikaku .steps_item {
  flex: 1;
  min-width: 0;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
}
@media screen and (max-width: 768px) {
  #hikaku .steps_item {
    flex: none;
  }
}

#hikaku .steps_item .icon {
  margin-right: 15px;
}

#hikaku .num-icon {
  display: inline-block;
  font-size: 5.5rem;
  font-family: 'Oswald', sans-serif;
  font-weight: 200;
  letter-spacing: 0.05em;
  text-align: center;
  position: relative;
}

#hikaku .num-icon span {
  display: block;
  font-size: 1.1rem;
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
  letter-spacing: normal;
  position: absolute;
  top: -0.5em;
  left: 50%;
  transform: translateX(-50%);
  color: #7B4949;
  white-space: nowrap;
}

#hikaku .num-icon.-w {
  color: #fff;
}

#hikaku .num-icon.-w span {
  color: rgba(255,255,255,0.7);
}

#hikaku .steps_item .txt {
  font-size: 1.6rem;
  line-height: 1.4;
  color: #fff;
  font-weight: 700;
}

#hikaku .steps_item .txt span {
  font-size: 1.8rem;
  display: inline;
  font-weight: 700;
  color: #fff;
}
@media screen and (max-width: 768px) {
  #hikaku .steps_item .txt span {
    font-size: 1.6rem;
  }
}

#hikaku .steps_item .heading {
  padding: 16px 20px;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  gap: 12px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

/* POINT heading: パステルカラー（イラストの円と同系色） */
#hikaku .steps_item .heading.-s01 { background-color: #FDEAEA; }
#hikaku .steps_item .heading.-s01 .num-icon { color: #C0504D; }
#hikaku .steps_item .heading.-s01 .num-icon span { color: rgba(192,80,77,0.75); }
#hikaku .steps_item .heading.-s01 .txt,
#hikaku .steps_item .heading.-s01 .txt span { color: #C0504D; }

#hikaku .steps_item .heading.-s02 { background-color: #FEF6D8; }
#hikaku .steps_item .heading.-s02 .num-icon { color: #B8860B; }
#hikaku .steps_item .heading.-s02 .num-icon span { color: rgba(184,134,11,0.75); }
#hikaku .steps_item .heading.-s02 .txt,
#hikaku .steps_item .heading.-s02 .txt span { color: #B8860B; }

#hikaku .steps_item .heading.-s03 { background-color: #C5DDF5; }
#hikaku .steps_item .heading.-s03 .num-icon { color: #3380BC; }
#hikaku .steps_item .heading.-s03 .num-icon span { color: rgba(51,128,188,0.75); }
#hikaku .steps_item .heading.-s03 .txt,
#hikaku .steps_item .heading.-s03 .txt span { color: #3380BC; }

#hikaku .steps_item .detail {
  padding: 16px 18px;
  background-color: #fff;
  flex: 1;
}
@media screen and (max-width: 768px) {
  #hikaku .steps_item .detail {
    padding: 16px;
  }
}

#hikaku .steps_item .detail .explain {
  font-size: 1.4rem;
  line-height: 1.7;
  color: #9098a2;
}

/* ----------------------------------------------------------------
   Doctor quote
---------------------------------------------------------------- */
.hk-quote {
  background: #EBF5FB;
  border-bottom: none;
}

.hk-quote__text {
  font-size: 1.5rem;
  line-height: 1.9;
  color: #333;
  font-weight: 500;
  text-align: center;
}

/* ----------------------------------------------------------------
   Doctor speech
---------------------------------------------------------------- */
.hk-speech {
  padding: 36px 0;
}

.hk-speech__inner {
  display: flex;
  align-items: center;
  gap: 20px;
  max-width: 660px;
  margin: 0 auto;
}

.hk-speech__photo img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  border: 3px solid #BEE3F8;
  flex-shrink: 0;
}

.hk-speech__bubble {
  position: relative;
  background: #fff;
  border: 2px solid #BEE3F8;
  border-radius: 8px;
  padding: 16px 18px;
  flex: 1;
}

.hk-speech__bubble::before {
  content: '';
  position: absolute;
  left: -14px;
  top: 50%;
  transform: translateY(-50%);
  border: 7px solid transparent;
  border-right-color: #BEE3F8;
}

.hk-speech__bubble::after {
  content: '';
  position: absolute;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
  border: 7px solid transparent;
  border-right-color: #fff;
}

.hk-speech__bubble p {
  font-size: 1.4rem;
  line-height: 1.8;
  color: #333;
  margin: 0;
}

.hk-speech__closing-text {
  font-size: 1.6rem !important;
  font-weight: 600;
  color: #2B6CB0 !important;
}

/* ----------------------------------------------------------------
   Q&A section — 4-box grid
---------------------------------------------------------------- */
.hk-qa__title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #333;
  margin: 0 0 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid #2B6CB0;
  text-align: center;
}

.hk-qa__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 24px;
}

.hk-qa__item {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  text-align: center;
}

.hk-qa__item-head {
  width: 100%;
  text-align: left;
  border-bottom: 1px solid #EBF5FB;
  padding-bottom: 8px;
}

.hk-qa__q-num {
  font-family: 'Oswald', sans-serif;
  font-size: 2.2rem;
  font-weight: 700;
  color: #2B6CB0;
  line-height: 1;
}

.hk-qa__illust {
  width: 100%;
  display: flex;
  justify-content: center;
  padding: 0 0 12px;
}

.hk-qa__q-icon {
  width: auto;
  height: 120px;
  max-width: 110px;
  object-fit: contain;
  display: block;
}

.hk-qa__q-text {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #555;
  margin: 0;
  text-align: left;
  flex: 1;
  background: #fff;
  border: 2px solid #BEE3F8;
  border-radius: 10px;
  padding: 12px 14px;
  position: relative;
  width: 100%;
  box-sizing: border-box;
}

.hk-qa__q-text::before {
  content: '';
  position: absolute;
  top: -13px;
  left: 50%;
  transform: translateX(-50%);
  border-width: 0 10px 13px;
  border-style: solid;
  border-color: transparent transparent #BEE3F8;
}

.hk-qa__q-text::after {
  content: '';
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  border-width: 0 8px 10px;
  border-style: solid;
  border-color: transparent transparent #fff;
}

.hk-qa__cta-row {
  text-align: center;
  margin: 4px 0 24px;
}

.hk-qa__cta-wrap {
  margin-top: auto;
}

.hk-qa__cta-btn {
  display: inline-block;
  background: #F6AD55;
  color: #333;
  font-weight: 700;
  font-size: 1.4rem;
  padding: 14px 28px;
  border: 2px solid #333;
  border-radius: 4px;
  text-decoration: none;
  line-height: 1.5;
}

.hk-qa__text p {
  font-size: 1.4rem;
  line-height: 1.8;
  color: #555;
  margin: 0 0 10px;
}

.hk-qa__text .hk-speech__inner {
  max-width: none;
}

/* ----------------------------------------------------------------
   Comparison table — #hikaku .graph .tbl
   womens-care の #womens .graph_ttl / .graph_tbl / .graph .tbl を複製
---------------------------------------------------------------- */
#hikaku .graph_ttl {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 100px;
  background: linear-gradient(135deg, #EBF5FB 0%, #BEE3F8 100%);
  padding: 30px 20px;
  box-sizing: border-box;
}

.hk-graph-ttl-txt {
  font-size: 2.4rem;
  font-weight: 700;
  color: #4e565f;
  text-align: center;
}

@media screen and (max-width: 768px) {
  #hikaku .graph_ttl {
    padding: 28px 20px;
  }
  .hk-graph-ttl-txt {
    font-size: 1.8rem;
  }
}

#hikaku .graph_tbl {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

#hikaku .graph .tbl {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
  font-size: 1.3rem;
  line-height: 1.5;
  font-weight: 700;
}
@media screen and (max-width: 768px) {
  #hikaku .graph .tbl {
    line-height: 1.3;
  }
}

#hikaku .graph .tbl th {
  padding: 12px 8px;
  background-color: #f8f8f7;
  border: solid 1px #dedede;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
  font-size: 1.2rem;
}

#hikaku .graph .tbl td {
  padding: 12px 8px;
  background-color: #fff;
  border: solid 1px #dedede;
  text-align: center;
  vertical-align: middle;
}

#hikaku .graph .tbl td dl dt {
  font-size: 1.3rem;
  line-height: 1.4;
  margin-bottom: 8px;
}

#hikaku .graph .tbl td dl dt em {
  display: block;
  font-size: 0.9rem;
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  color: #9b9b9b;
}

#hikaku .graph .tbl td dl dt .rank {
  margin-bottom: 6px;
}

#hikaku .graph .tbl td dl dt .icon {
  display: inline-block;
  padding: 0.3em 0.5em;
  font-size: 0.9rem;
  line-height: 1;
  font-weight: 500;
  font-family: 'Montserrat', sans-serif;
  color: #fff;
}

#hikaku .graph .tbl td dl dt .icon.-no1    { background-color: #988537; }
#hikaku .graph .tbl td dl dt .icon.-no2    { background-color: #afbbc6; }
#hikaku .graph .tbl td dl dt .icon.-no3    { background-color: #845c2e; }
#hikaku .graph .tbl td dl dt .icon.-no-other { background-color: #aaa; }

/* 比較表 商品画像 — 高さ統一・幅は自動 */
#hikaku .graph .tbl td dd {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 90px;
}

#hikaku .graph .tbl td dd img {
  height: 80px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}

#hikaku .graph .tbl td .icon {
  display: block;
  font-size: 3rem;
}

#hikaku .graph .tbl td .icon.-icon01 { color: #2B6CB0; }
#hikaku .graph .tbl td .icon.-icon03 { color: #ccc; }

#hikaku .graph .tbl td .btn {
  display: inline-block;
  padding: 0.6em 0.8em;
  line-height: 1;
  color: #212c38;
  border: solid 2px #4e565f;
  background-color: #F6AD55;
  font-size: 1.2rem;
  text-decoration: none;
  white-space: nowrap;
}

#hikaku .graph .tbl td .btn:hover { opacity: 0.6; }

#hikaku .graph .tbl td .btn.-gray {
  background-color: #9b9b9b;
  color: #fff;
  border: solid 2px #f0f0f0;
}

/* ----------------------------------------------------------------
   Sidemenu — #hikaku スコープ
---------------------------------------------------------------- */
#hikaku .sidemenu_ttl {
  font-size: 1.5rem;
  line-height: 1.4;
  font-weight: 700;
  text-align: center;
  padding-bottom: 10px;
  margin-bottom: 24px;
  position: relative;
}

#hikaku .sidemenu_ttl::before {
  display: block;
  content: "";
  width: 25px;
  height: 3px;
  background-color: #F6AD55;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

#hikaku .sidemenu_item {
  text-align: center;
  padding: 16px 12px 20px;
  border-radius: 10px;
  background-color: #fff;
  box-shadow: 4px 4px 8px #eaeaea, -4px -4px 8px #ffffff;
  margin-bottom: 20px;
}

/* .sidemenu_item--compact は現在未使用（NO.4〜9もNO.1〜3と同じ構造を使用） */

#hikaku .sidemenu_item .rank {
  margin-bottom: 6px;
}

#hikaku .sidemenu_item .icon {
  display: inline-block;
  padding: 0.3em 0.5em;
  font-size: 0.9rem;
  line-height: 1;
  font-weight: 500;
  font-family: 'Montserrat', sans-serif;
  color: #fff;
}

#hikaku .sidemenu_item .icon.-no1      { background-color: #988537; }
#hikaku .sidemenu_item .icon.-no2      { background-color: #afbbc6; }
#hikaku .sidemenu_item .icon.-no3      { background-color: #845c2e; }
#hikaku .sidemenu_item .icon.-no-other { background-color: #aaa; }

#hikaku .sidemenu_item .ttl {
  font-size: 1.4rem;
  line-height: 1.4;
  font-weight: 700;
  margin-bottom: 8px;
}

#hikaku .sidemenu_item .ttl em {
  display: block;
  font-size: 0.9rem;
  font-family: 'Montserrat', sans-serif;
  font-weight: 500;
  color: #9b9b9b;
}

#hikaku .sidemenu_item .img {
  margin-bottom: 8px;
}

/* サイドメニュー TOP3 商品画像 — 高さ統一 */
#hikaku .sidemenu_item .img img {
  height: 120px;
  width: auto;
  max-width: 140px;
  object-fit: contain;
}

/* compact（NO.4〜9）内の画像 */
#hikaku .sidemenu_item.sidemenu_item--compact .img {
  margin-bottom: 0;
  flex-shrink: 0;
}

#hikaku .sidemenu_item.sidemenu_item--compact .img img {
  height: 52px;
  width: auto;
  max-width: 52px;
  object-fit: contain;
}

#hikaku .sidemenu_item .txt {
  font-size: 1.1rem;
  line-height: 1.5;
  margin-bottom: 8px;
  color: #555;
}

#hikaku .sidemenu_item .btn a {
  display: inline-block;
  padding: 6px 14px;
  background-color: #2B6CB0;
  color: #fff;
  font-size: 1.2rem;
  font-weight: 700;
  text-decoration: none;
  border-radius: 4px;
}

#hikaku .sidemenu_item .btn a:hover { opacity: 0.7; }

@media screen and (max-width: 991px) {
  #hikaku .sidemenu_list {
    display: flex;
    flex-flow: row wrap;
    gap: 16px;
  }
  #hikaku .sidemenu_item {
    width: calc((100% - 32px) / 3);
    margin-bottom: 0;
  }
  #hikaku .sidemenu_item.sidemenu_item--compact {
    width: calc((100% - 16px) / 2);
  }
}

@media screen and (max-width: 768px) {
  #hikaku .sidemenu_list {
    display: block;
  }
  #hikaku .sidemenu_item {
    width: 100%;
    margin-bottom: 16px;
  }
}

/* sp-flex layout for sidemenu items */
#hikaku .sp-flex {
  display: block;
}
@media screen and (max-width: 768px) {
  #hikaku .sp-flex {
    display: flex;
    flex-flow: row nowrap;
    justify-content: center;
    gap: 12px;
  }
  #hikaku .sp-flex .img {
    margin-bottom: 0;
  }
  #hikaku .sp-flex_right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-align: left;
  }
}

/* ----------------------------------------------------------------
   運営者情報
---------------------------------------------------------------- */
.hk-operator {
  padding: 18px 0;
  text-align: center;
  border-bottom: 1px solid #eee;
}

.hk-operator__link {
  font-size: 1.4rem;
  color: #2B6CB0;
  text-decoration: underline;
}

/* ----------------------------------------------------------------
   コラム
---------------------------------------------------------------- */
.hk-column {
  padding: 30px 0 50px;
}

.hk-column__title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #333;
  margin: 0 0 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid #2B6CB0;
}

.hk-column__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 28px;
}

.hk-column__list li a {
  font-size: 1.3rem;
  color: #555;
  text-decoration: underline;
}

.hk-column__list li a:hover { color: #2B6CB0; }

/* ----------------------------------------------------------------
   Column Links Grid
---------------------------------------------------------------- */
.hk-column-links {
  padding: 30px 0 40px;
  border-top: 1px solid #eee;
}

.hk-column-links__title {
  font-size: 1.8rem;
  font-weight: 700;
  color: #333;
  margin: 0 0 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid #2B6CB0;
}

.hk-column-links__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

.hk-column-links__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 16px 10px;
  background: #EBF5FB;
  border-radius: 8px;
  text-decoration: none;
  color: #333;
  gap: 6px;
  transition: background 0.2s;
  text-align: center;
  border: 1px solid #BEE3F8;
}

.hk-column-links__item:hover {
  background: #BEE3F8;
}

.hk-column-links__icon {
  font-size: 2.2rem;
  line-height: 1;
}

.hk-column-links__text {
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.4;
  color: #333;
}

.hk-column-links__more {
  font-size: 1.1rem;
  color: #2B6CB0;
  font-weight: 500;
}

/* ----------------------------------------------------------------
   Profile Modal
---------------------------------------------------------------- */
.hk-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hk-modal[hidden] { display: none; }

.hk-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
  cursor: pointer;
}

.hk-modal__content {
  position: relative;
  background: #fff;
  border-radius: 8px;
  padding: 40px 28px 28px;
  max-width: 480px;
  width: 90%;
  z-index: 1;
  text-align: center;
}

.hk-modal__close {
  position: absolute;
  top: 10px;
  right: 14px;
  background: none;
  border: none;
  font-size: 2.2rem;
  cursor: pointer;
  color: #666;
  line-height: 1;
}

.hk-modal__title {
  font-size: 1.8rem;
  font-weight: 700;
  margin: 0 0 18px;
}

.hk-modal__img img {
  width: 180px;
  height: auto;
  border-radius: 8px;
  margin-bottom: 14px;
}

.hk-modal__text {
  font-size: 1.4rem;
  color: #555;
  line-height: 1.8;
}

/* ----------------------------------------------------------------
   Responsive — mobile
---------------------------------------------------------------- */
@media (max-width: 600px) {
  .hk-hero__cols {
    flex-direction: column;
  }

  .hk-hero__photo,
  .hk-hero__text {
    flex: none;
    max-width: 100%;
    width: 100%;
  }

  .hk-hero__title { font-size: 2.6rem; }

  .hk-scorad__body { flex-direction: column; }

  .hk-scorad__img {
    flex: none;
    width: 100%;
    max-width: 220px;
    margin: 0 auto;
  }

  .hk-scorad__doctor { flex-direction: column; text-align: left; }

  .hk-qa__grid { grid-template-columns: 1fr; }
  .hk-qa__q-icon { max-width: 120px; }

  .hk-column-links__grid { grid-template-columns: 1fr 1fr; }

  .hk-column__list { grid-template-columns: 1fr; }
}

/* ================================================================
   LP-style Design Improvements — reference design adaptation
================================================================ */

/* ----------------------------------------------------------------
   Hero — FV image replaces text/photo cols (legacy styles removed)
---------------------------------------------------------------- */

/* ----------------------------------------------------------------
   Section eyebrow text
---------------------------------------------------------------- */
.hk-eyebrow {
  display: block;
  font-family: 'Oswald', sans-serif;
  font-size: 1.1rem;
  font-weight: 400;
  letter-spacing: 0.3em;
  color: #2B6CB0;
  text-transform: uppercase;
  margin-bottom: 8px;
}

/* ----------------------------------------------------------------
   Section header with decorative watermark background text
---------------------------------------------------------------- */
.hk-sec-head {
  position: relative;
  overflow: hidden;
  text-align: center;
  padding: 8px 0 14px;
  width: 100%;
}

.hk-sec-head[data-bg-text]::before {
  content: attr(data-bg-text);
  position: absolute;
  top: -0.1em;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'Oswald', sans-serif;
  font-size: 9rem;
  font-weight: 700;
  color: rgba(43, 108, 176, 0.07);
  white-space: nowrap;
  pointer-events: none;
  letter-spacing: 0.05em;
  line-height: 1;
  z-index: 0;
}

.hk-sec-head > * {
  position: relative;
  z-index: 1;
}

/* ----------------------------------------------------------------
   Pale blue "card" section background
---------------------------------------------------------------- */
.hk-sec--blue {
  background: #EBF5FB;
  border-radius: 12px;
  padding: 30px 24px 32px !important;
  margin-bottom: 4px;
}

.hk-sec--blue .hk-eyebrow {
  color: #1E4D8C;
}

/* ----------------------------------------------------------------
   SCORAD — intro layout (image + text)
---------------------------------------------------------------- */
/* SCORAD — desc text centered below title */
.hk-scorad__desc {
  font-size: 1.4rem;
  line-height: 1.8;
  color: #555;
  text-align: center;
  margin: 0 0 20px;
}

.hk-scorad__desc-note {
  font-size: 1.2rem;
  color: #888;
}

/* SCORAD — 2-column: image + points */
.hk-scorad__intro {
  display: flex;
  gap: 28px;
  align-items: stretch;
  margin-bottom: 28px;
}

.hk-scorad__intro-img {
  flex: 0 0 360px;
  max-width: 360px;
}

.hk-scorad__intro-right {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 0;
}

.hk-scorad__intro-img img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

/* SCORAD図のキャプション */
.hk-scorad__fig-caption {
  text-align: center;
  margin: 0;
  line-height: 1.4;
}
.hk-scorad__fig-caption--top {
  font-size: 1.2rem;
  font-weight: 700;
  color: #333;
  margin-bottom: 6px;
}
.hk-scorad__fig-caption--bottom {
  font-size: 1.0rem;
  color: #777;
  margin-top: 6px;
}

/* ----------------------------------------------------------------
   SCORAD points — 3-column vertical card layout
   (overrides the previous horizontal flex style)
---------------------------------------------------------------- */
.hk-scorad__points {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between;
  flex: 1;
  gap: 0;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

.hk-scorad__point {
  position: relative;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  text-align: left !important;
  padding: 20px 24px !important;
  border-radius: 6px !important;
  gap: 0 !important;
  margin-bottom: 0 !important;
  margin-top: 22px !important;
  flex: 1;
}

.hk-scorad__point-tag {
  position: absolute;
  top: -18px;
  left: 0;
  font-family: 'Oswald', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: #2B6CB0;
  background: none;
  padding: 0;
  line-height: 1.4;
  white-space: nowrap;
}

.hk-scorad__point-tag em {
  font-style: normal;
  font-size: 1.2rem;
  font-weight: 700;
  margin-left: 2px;
}

.hk-scorad__point-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
}

.hk-scorad__point-label {
  font-family: 'Oswald', sans-serif;
  font-size: 0.95rem;
  font-weight: 400;
  letter-spacing: 0.15em;
  color: rgba(255,255,255,0.8);
  margin-bottom: 2px;
}

.hk-scorad__point-num {
  font-family: 'Oswald', sans-serif;
  font-size: 4rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
}

.hk-scorad__point-icon {
  width: 52px !important;
  height: 52px !important;
  background: none !important;
  border-radius: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 0;
  box-sizing: border-box;
  flex-shrink: 0;
}

.hk-scorad__point-icon img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

.hk-scorad__point-text {
  font-size: 1.7rem !important;
  font-weight: 700;
  line-height: 1.4;
  color: #fff !important;
  flex: 1;
  margin: 0;
}

/* ----------------------------------------------------------------
   Quote section — featured blue band
---------------------------------------------------------------- */
.hk-quote--featured {
  background: linear-gradient(135deg, #1E4D8C 0%, #2B6CB0 100%);
  border-radius: 12px;
}

.hk-quote--featured .hk-quote__text {
  color: #fff;
  font-size: 1.55rem;
  line-height: 2.0;
  position: relative;
  padding: 0 20px;
}

.hk-quote--featured .hk-quote__text::before,
.hk-quote--featured .hk-quote__text::after {
  content: '"';
  font-family: Georgia, serif;
  font-size: 4rem;
  color: rgba(255,255,255,0.3);
  line-height: 0;
  vertical-align: -0.5em;
  display: inline-block;
  margin: 0 4px;
}

.hk-quote--featured .hk-quote__text::before { content: '\201C'; }
.hk-quote--featured .hk-quote__text::after  { content: '\201D'; }

/* ----------------------------------------------------------------
   Comparison table — sec-head treatment
---------------------------------------------------------------- */
#hikaku .graph_ttl {
  flex-direction: column;
}

#hikaku .graph_ttl .hk-sec-head {
  padding-bottom: 0;
}

/* ----------------------------------------------------------------
   Responsive for new LP styles
---------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  .hk-sec-head[data-bg-text]::before {
    font-size: 5rem;
  }

  .hk-scorad__desc {
    text-align: left;
  }

  .hk-scorad__intro {
    flex-direction: column;
  }

  .hk-scorad__intro-img {
    flex: none;
    max-width: 160px;
    margin: 0 auto;
  }

  .hk-scorad__intro-right {
    width: 100%;
  }

  .hk-scorad__points {
    width: 100%;
    gap: 16px;
  }

  .hk-scorad__point-num {
    font-size: 3rem;
  }

  .hk-scorad__point-text {
    font-size: 1.1rem !important;
  }
}

@media (max-width: 600px) {
  .hk-scorad__points {
    gap: 8px !important;
  }

  .hk-scorad__point {
    padding: 16px 8px !important;
    gap: 6px !important;
  }

  .hk-scorad__point-num {
    font-size: 2.8rem;
  }

  .hk-quote--featured .hk-quote__text {
    font-size: 1.35rem;
    padding: 0 6px;
  }
}

/* ----------------------------------------------------------------
   Hero FV image (replaces cols + photo layout)
---------------------------------------------------------------- */
/* ----------------------------------------------------------------
   FV — HTML/CSS オーバーレイ方式
---------------------------------------------------------------- */
.hk-hero__fv {
  position: relative;
  width: 100%;
  overflow: hidden;
  line-height: 1;
}

.hk-hero__fv-bg {
  width: 100%;
  height: auto;
  display: block;
}

.hk-hero__fv-inner {
  position: absolute;
  top: 0;
  left: 5%;
  width: 45%;
  height: 100%;
  padding: 5% 4% 5% 4%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
}

/* バッジ */
.hk-hero__badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.hk-hero__badge {
  display: inline-block;
  font-size: 1.3rem;
  font-weight: 700;
  padding: 5px 14px;
  border-radius: 50px;
  line-height: 1.4;
  letter-spacing: 0.02em;
}

.hk-hero__badge--dark {
  background: #1E4D8C;
  color: #fff;
}

.hk-hero__badge--light {
  background: #6DB8E8;
  color: #fff;
}

/* メインタイトル */
.hk-hero__title {
  font-size: 4.2rem;
  font-weight: 700;
  color: #1E4D8C;
  line-height: 1.2;
  margin: 0 0 12px;
  letter-spacing: -0.01em;
}

/* 説明文 */
.hk-hero__body {
  font-size: 1.55rem;
  line-height: 1.8;
  color: #333;
  margin: 0 0 16px;
}

/* プロフィール */
.hk-hero__profile {
  border-top: 1px solid rgba(43,108,176,0.2);
  padding-top: 10px;
  background: none;
  border-radius: 0;
  padding-left: 0;
  padding-right: 0;
}

.hk-hero__profile-sup {
  font-size: 1.2rem;
  color: #555;
  margin: 0 0 3px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.hk-hero__profile-label {
  font-size: 1.1rem;
  font-weight: 700;
  color: #2B6CB0;
  letter-spacing: 0.08em;
}

.hk-hero__profile-name {
  font-size: 1.7rem;
  font-weight: 700;
  color: #1E4D8C;
  margin: 0 0 6px;
}

.hk-hero__profile-bio {
  font-size: 1.3rem;
  line-height: 1.7;
  color: #555;
  margin: 0 0 8px;
}

.hk-hero__profile-link {
  font-size: 1.4rem;
  color: #2B6CB0;
  text-decoration: underline;
  font-weight: 600;
}

.hk-hero__profile-link:hover {
  color: #1E4D8C;
}

/* CTA */
.hk-hero__cta-wrap {
  max-width: 1030px;
  margin: 0 auto;
  padding: 20px 24px 0;
  text-align: center;
}

.hk-hero__cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: linear-gradient(135deg, #1E4D8C 0%, #2B6CB0 100%);
  color: #fff;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  padding: 18px 36px;
  border-radius: 50px;
  text-decoration: none;
  box-shadow: 0 4px 16px rgba(30,77,140,0.3);
  transition: opacity 0.2s, transform 0.2s;
  letter-spacing: 0.02em;
}

.hk-hero__cta-btn:hover {
  opacity: 0.88;
  transform: translateY(-2px);
}

.hk-hero__cta-arrow {
  font-size: 2.2rem;
  line-height: 1;
  font-weight: 300;
}

.hk-hero__cta-sub {
  margin-top: 10px;
  font-size: 1.3rem;
  line-height: 1.6;
}

.hk-hero__cta-sub .hk-profile-link {
  color: #BEE3F8;
  text-decoration: underline;
}

.hk-hero__cta-sub .hk-pr-note {
  color: rgba(255,255,255,0.55) !important;
  font-size: 1.1rem;
}

/* FV内 PR注釈 — 右端縦書き */
.hk-hero__pr-note {
  position: absolute;
  right: 10px;
  bottom: 24px;
  margin: 0;
  font-size: 1.0rem;
  color: rgba(80,80,80,0.6);
  letter-spacing: 0.04em;
  pointer-events: none;
  line-height: 1;
}

/* Hero → content wave */
.hk-hero__wave {
  background: #2B6CB0;
  line-height: 0;
  margin: 0;
}

.hk-hero__wave svg {
  display: block;
  width: 100%;
  height: 60px;
}

/* ----------------------------------------------------------------
   Steps — wave separators
---------------------------------------------------------------- */
.steps_wave {
  line-height: 0;
  overflow: hidden;
  display: block;
}

.steps_wave svg {
  display: block;
  width: 100%;
  height: 50px;
}

.steps_wave--top {
  background: #fff;       /* white above, pale blue SVG fill */
  margin-bottom: -2px;
}

.steps_wave--bottom {
  background: #EBF5FB;    /* pale blue above, white SVG fill */
  margin-top: -2px;
}

/* ----------------------------------------------------------------
   Steps title — card redesign
---------------------------------------------------------------- */
#hikaku .steps_ttl--card {
  background: #EBF5FB !important;
  border-radius: 0 !important;
  padding: 24px 28px 28px !important;
  justify-content: center !important;
}

#hikaku .steps_ttl__inner {
  display: flex;
  align-items: center;
  gap: 24px;
  max-width: 680px;
  width: 100%;
}

#hikaku .steps_ttl__text-col {
  flex: 1;
  min-width: 0;
  text-align: center;
}

#hikaku .steps_ttl__lead {
  font-size: 1.3rem;
  color: #555;
  font-weight: 400;
  margin: 0 0 4px;
  line-height: 1.5;
}

#hikaku .steps_ttl__heading {
  font-size: 2.4rem;
  font-weight: 700;
  color: #1E4D8C;
  line-height: 1.4;
  margin: 0 0 18px;
}

#hikaku .steps_ttl__heading em {
  font-style: normal;
  color: #2B6CB0;
}

#hikaku .steps_ttl__heading strong {
  color: #1E4D8C;
}

#hikaku .steps_ttl__pts {
  display: flex;
  align-items: center;
}

#hikaku .steps_ttl__pt {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 68px;
  height: 68px;
  background: #fff;
  border-radius: 50%;
  border: 2px solid #BEE3F8;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(43,108,176,0.1);
}

#hikaku .steps_ttl__pt-num {
  font-family: 'Oswald', sans-serif;
  font-size: 1.6rem;
  font-weight: 700;
  color: #2B6CB0;
  line-height: 1;
}

#hikaku .steps_ttl__pt-lbl {
  font-size: 1.1rem;
  font-weight: 700;
  color: #333;
  line-height: 1.3;
}

#hikaku .steps_ttl__sep {
  flex: 1;
  height: 2px;
  background: linear-gradient(to right, #BEE3F8, #4DBCCD);
  min-width: 12px;
}

#hikaku .steps_ttl__dr-img {
  flex-shrink: 0;
}

#hikaku .steps_ttl__dr-img img {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid #2B6CB0;
  display: block;
  box-shadow: 0 2px 8px rgba(43,108,176,0.2);
}

@media screen and (max-width: 768px) {
  #hikaku .steps_ttl--card {
    padding: 20px 16px 24px !important;
  }

  #hikaku .steps_ttl__inner {
    gap: 16px;
    max-width: 100%;
  }

  #hikaku .steps_ttl__heading {
    font-size: 1.9rem;
  }

  #hikaku .steps_ttl__pt {
    width: 58px;
    height: 58px;
  }

  #hikaku .steps_ttl__pt-num {
    font-size: 1.4rem;
  }

  #hikaku .steps_ttl__pt-lbl {
    font-size: 1rem;
  }

  #hikaku .steps_ttl__dr-img img {
    width: 72px;
    height: 72px;
  }
}

@media (max-width: 600px) {
  #hikaku .steps_ttl__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }

  #hikaku .steps_ttl__dr-img {
    align-self: center;
  }
}

/* ----------------------------------------------------------------
   Doctor Profile Section (②)
---------------------------------------------------------------- */
#hikaku .hk-dr-profile {
  background: #fff;
  padding: 20px 24px 20px;
  border-bottom: 1px solid #E2EBF6;
}

#hikaku .hk-dr-profile__inner {
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

/* 写真なしレイアウト — FV左テキスト直下に縦並びで */
#hikaku .hk-dr-profile__inner--no-photo {
  max-width: 1030px;
  margin: 0 auto;
  display: block;
  padding: 0 0 0 4px;
}

#hikaku .hk-dr-profile__photo-col {
  flex-shrink: 0;
}

#hikaku .hk-dr-profile__photo-wrap {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  overflow: hidden;
  background: #EBF5FB;
  border: 3px solid #BEE3F8;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

#hikaku .hk-dr-profile__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* fallback if image missing */
  background: #EBF5FB;
}

#hikaku .hk-dr-profile__label {
  font-size: 1rem;
  color: #2B6CB0;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin: 0 0 2px;
}

#hikaku .hk-dr-profile__clinic {
  font-size: 1.1rem;
  color: #555;
  margin: 0 0 2px;
}

#hikaku .hk-dr-profile__name {
  font-size: 1.6rem;
  font-weight: 700;
  color: #1E4D8C;
  margin: 0 0 8px;
}

#hikaku .hk-dr-profile__bio {
  font-size: 1.2rem;
  line-height: 1.7;
  color: #555;
  margin: 0 0 10px;
}

#hikaku .hk-dr-profile__link {
  display: inline-block;
  font-size: 1.2rem;
  color: #2B6CB0;
  text-decoration: underline;
  font-weight: 600;
  transition: color 0.2s;
}

#hikaku .hk-dr-profile__link:hover {
  color: #1E4D8C;
}

@media (max-width: 600px) {
  #hikaku .hk-dr-profile__inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  #hikaku .hk-dr-profile__photo-wrap {
    width: 80px;
    height: 80px;
  }
}

/* ----------------------------------------------------------------
   Interview Modal (③)
---------------------------------------------------------------- */
#hikaku .hk-interview-modal {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s;
}

#hikaku .hk-interview-modal.is-open {
  pointer-events: auto;
  opacity: 1;
}

#hikaku .hk-interview-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(10, 30, 60, 0.55);
  cursor: pointer;
}

#hikaku .hk-interview-modal__panel {
  position: relative;
  z-index: 1;
  background: #fff;
  border-radius: 12px;
  max-width: 620px;
  width: 90%;
  max-height: 80vh;
  overflow-y: auto;
  padding: 36px 32px;
  box-shadow: 0 8px 40px rgba(10,30,60,0.2);
  transform: translateY(20px);
  transition: transform 0.3s;
}

#hikaku .hk-interview-modal.is-open .hk-interview-modal__panel {
  transform: translateY(0);
}

#hikaku .hk-interview-modal__close {
  position: absolute;
  top: 12px;
  right: 16px;
  background: none;
  border: none;
  font-size: 2.2rem;
  color: #888;
  cursor: pointer;
  line-height: 1;
  padding: 4px 8px;
}

#hikaku .hk-interview-modal__close:hover {
  color: #333;
}

#hikaku .hk-interview-modal__ttl-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}

#hikaku .hk-interview-modal__ttl-photo {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid #BEE3F8;
  background: #EBF5FB;
}

#hikaku .hk-interview-modal__ttl-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

#hikaku .hk-interview-modal__ttl {
  font-size: 2.2rem !important;
  font-weight: 700 !important;
  color: #1E4D8C !important;
  line-height: 1.6;
  margin: 0 !important;
  padding: 16px 20px;
  text-indent: 0 !important;
  background: linear-gradient(135deg, #EBF5FB 0%, #D6EAF8 100%);
  border-left: 5px solid #2B6CB0;
  border-radius: 0 8px 8px 0;
  letter-spacing: 0.02em;
  flex: 1;
}

#hikaku .hk-interview-modal__content p {
  font-size: 1.3rem;
  line-height: 1.9;
  color: #444;
  margin: 0 0 16px;
  text-indent: 1em;
}

/* ----------------------------------------------------------------
   Q&A closing text (⑨)
---------------------------------------------------------------- */
#hikaku .hk-qa__closing-wrap {
  padding: 20px 0 10px;
}

#hikaku .hk-qa__closing {
  font-size: 1.3rem;
  line-height: 1.8;
  color: #2B6CB0;
  font-weight: 600;
  border-top: 2px solid #BEE3F8;
  padding-top: 16px;
  margin: 0;
}

/* ----------------------------------------------------------------
   PC/SP 出し分け
---------------------------------------------------------------- */
/* PC: FV内の body + profile を表示 */
.hk-pc-only {
  display: block;
}
/* SP: FV外のinfo セクション非表示 */
.hk-hero__sp-info {
  display: none;
}

/* ----------------------------------------------------------------
   Hero FV — SP (smartphone) レイアウト
---------------------------------------------------------------- */
@media screen and (max-width: 768px) {
  /* FV inner: 高さ100%いっぱいに広げてバッジ+タイトルを頭上位置に、bodyを最下部に */
  .hk-hero__fv-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 25vw 5vw 5vw;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    box-sizing: border-box;
  }

  /* body text を FV内最下部に押し下げ */
  .hk-hero__fv-inner .hk-hero__body {
    margin-top: auto;
    font-size: 1.2rem;
    line-height: 1.7;
    margin-bottom: 0;
    background: rgba(255,255,255,0.82);
    padding: 8px 10px;
    border-radius: 6px;
  }

  /* PC用 profile を FV内で非表示 */
  .hk-pc-only {
    display: none !important;
  }

  /* SP用: FV下のinfo セクション表示 */
  .hk-hero__sp-info {
    display: block;
    background: #fff;
    padding: 0 16px 12px;
  }

  .hk-hero__sp-info .hk-hero__body {
    font-size: 1.3rem;
    line-height: 1.8;
    color: #333;
    margin: 0 0 14px;
  }

  /* SP: FV内PR注釈 */
  .hk-hero__pr-note {
    font-size: 0.9rem;
    right: auto;
    left: 8px;
    bottom: 2px;
    color: rgba(60,60,60,0.55);
  }

  .hk-hero__sp-info .hk-hero__profile {
    border-top: 1px solid rgba(43,108,176,0.2);
    padding-top: 12px;
    background: none;
    border-radius: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .hk-hero__sp-info .hk-hero__profile-sup {
    font-size: 1.1rem;
  }

  .hk-hero__sp-info .hk-hero__profile-name {
    font-size: 1.5rem;
  }

  .hk-hero__sp-info .hk-hero__profile-bio {
    font-size: 1.1rem;
    line-height: 1.7;
  }

  .hk-hero__sp-info .hk-hero__profile-link {
    font-size: 1.2rem;
  }

  /* FV内バッジ・タイトルのSPサイズ調整 */
  .hk-hero__badges {
    gap: 6px;
    margin-bottom: 6px;
  }

  .hk-hero__badge {
    font-size: 1.1rem;
    padding: 4px 10px;
  }

  /* CTA ボタン */
  .hk-hero__cta-wrap {
    padding: 14px 16px 0;
  }

  .hk-hero__cta-btn {
    font-size: 1.3rem;
    padding: 14px 20px;
    border-radius: 40px;
    gap: 6px;
  }

  .hk-hero__cta-arrow {
    font-size: 1.8rem;
  }

  /* ---- モーダル SP 調整 ---- */
  #hikaku .hk-interview-modal__panel {
    padding: 24px 18px;
  }

  #hikaku .hk-interview-modal__ttl-photo {
    width: 58px;
    height: 58px;
  }

  #hikaku .hk-interview-modal__ttl {
    font-size: 1.6rem !important;
    padding: 10px 12px;
    line-height: 1.5;
  }

  #hikaku .hk-interview-modal__ttl-row {
    gap: 12px;
    margin-bottom: 18px;
  }

  #hikaku .hk-interview-modal__content p {
    font-size: 1.25rem;
    line-height: 1.85;
    margin: 0 0 12px;
  }

  /* ---- Q&A SP 調整 ---- */
  .hk-qa__grid {
    grid-template-columns: 1fr;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
    gap: 24px;
  }

  .hk-qa__item {
    align-items: center;
  }

  .hk-qa__illust {
    padding: 0 0 6px;
    justify-content: center;
  }

  .hk-qa__q-icon {
    height: 100px;
    max-width: 96px;
    display: block;
    margin: 0 auto;
  }

  .hk-qa__q-text {
    font-size: 1.3rem;
    width: 100%;
  }

  /* ---- SCORAD SP 調整 ---- */
  .hk-scorad__title {
    font-size: 1.6rem;
    margin: 0 0 18px;
  }

  .hk-scorad__desc {
    font-size: 1.3rem;
  }

  /* SCORAD 画像を画面幅90%に */
  .hk-scorad__intro-img {
    width: 90% !important;
    max-width: 90% !important;
    flex: none !important;
    margin: 0 auto !important;
  }

  /* SCORAD POINTボックス: テキスト大きく、余白を詰める */
  .hk-scorad__point {
    padding: 12px 16px !important;
    margin-top: 18px !important;
  }

  .hk-scorad__point-text {
    font-size: 1.5rem !important;
  }

  /* スパイラル見出し: 「負のスパイラル」を改行 */
  #hikaku .steps_ttl__heading strong {
    display: block;
  }

  /* スパイラル 01/02/03 数字を小さく・縦幅を詰める */
  #hikaku .num-icon {
    font-size: 3.2rem;
  }

  #hikaku .steps_item .heading {
    padding: 10px 16px;
  }

  /* FV: 260810修正でSPも HTML/CSS オーバーレイ方式（fv_sp.png不使用）。
     レイアウトはファイル末尾「260810 修正対応」ブロック参照 */

  /* スパイラルタイトル: 大きく・中央揃え・下の余白を詰める */
  #hikaku .steps_ttl__text-col {
    text-align: center !important;
    width: 100%;
  }

  #hikaku .steps_ttl__lead {
    text-align: center !important;
    font-size: 1.3rem;
  }

  #hikaku .steps_ttl__heading {
    font-size: 2.2rem !important;
    text-align: center !important;
    margin: 0 0 4px;
  }

  #hikaku .steps_ttl--card {
    padding: 16px 20px 16px !important;
  }

  #hikaku .steps_blocks {
    padding: 6px 15px 30px;
  }
}

/* ================================================================
   260604 修正対応（指示書 ①〜㉖）
================================================================ */

/* ① FV: 下のコンテンツ（content960+gap20+sidebar250=最大1230px）と横幅を揃える */
.hk-hero__fv {
  max-width: 1230px;
  margin: 0 auto;
}
/* PCのみ: 下のセクションと同じ左右余白(20px)を付けてエッジを揃える */
@media screen and (min-width: 769px) {
  .hk-hero {
    padding: 0 20px;
  }
}

/* ⑤ PR注釈: FVと直下コンテンツの間に中央配置 */
.hk-hero__pr-note {
  position: static;
  right: auto;
  bottom: auto;
  text-align: center;
  max-width: 1230px;
  margin: 0 auto;
  padding: 12px 36px;
  font-size: 1.1rem;
  color: #999;
  letter-spacing: 0.02em;
  line-height: 1.5;
  pointer-events: auto;
}

/* ④ インタビューモーダル: ✕を上部固定＆大きく / 本文のみスクロール / 外側スクロール連鎖を抑止 */
#hikaku .hk-interview-modal__panel {
  padding: 0;
  overflow: visible;
  display: flex;
  flex-direction: column;
}
#hikaku .hk-interview-modal__content {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  max-height: 82vh;
  padding: 60px 32px 32px;
  border-radius: 12px;
}
#hikaku .hk-interview-modal__close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 46px;
  height: 46px;
  padding: 0;
  font-size: 3rem;
  color: #fff;
  background: #2B6CB0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
  box-shadow: 0 2px 8px rgba(10,30,60,0.25);
}
#hikaku .hk-interview-modal__close:hover {
  background: #1E4D8C;
  color: #fff;
}

/* ⑦ 画像タップ拡大オーバーレイ */
.js-zoom-img { cursor: zoom-in; }
.hk-zoom {
  position: fixed;
  inset: 0;
  z-index: 9500;
  background: rgba(0,0,0,0.85);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s;
}
.hk-zoom.is-open {
  opacity: 1;
  pointer-events: auto;
}
.hk-zoom__img {
  max-width: 92%;
  max-height: 90vh;
  width: auto;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.5);
  background: #fff;
}
.hk-zoom__close {
  position: absolute;
  top: 16px;
  right: 20px;
  width: 48px;
  height: 48px;
  font-size: 3.2rem;
  line-height: 1;
  color: #fff;
  background: rgba(0,0,0,0.4);
  border: 2px solid rgba(255,255,255,0.6);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ⑧ SCORAD POINTボックス: スパイラル画像の実際の色（パステル）に統一
   炎症=赤(ペールピンク)・かゆみ=黄(ペールイエロー)・睡眠=青(ペールブルー) */
.hk-scorad__point--01 { background: #FBE1E4; }
.hk-scorad__point--02 { background: #FDEBB1; }
.hk-scorad__point--03 { background: #B0D5F9; }
.hk-scorad__point--01 .hk-scorad__point-text { color: #C0392B !important; }
.hk-scorad__point--02 .hk-scorad__point-text { color: #A8780A !important; }
.hk-scorad__point--03 .hk-scorad__point-text { color: #1E4D8C !important; }

/* ⑨ まとめ文: 重要なので大きく */
.hk-scorad__summary {
  font-size: 1.7rem;
  font-weight: 700;
  color: #1E4D8C;
  text-align: center;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 2px solid #BEE3F8;
}

/* ⑪ 負のスパイラル見出し: 重要なので大きく */
#hikaku .steps_ttl__lead {
  font-size: 2.1rem;
  font-weight: 700;
  color: #1E4D8C;
}
#hikaku .steps_ttl__heading {
  font-size: 3rem;
}

/* ⑭ 引用文: 左揃え＋テキスト幅のみ少し狭く（背景ボックス幅はそのまま） */
.hk-quote__text,
.hk-quote--featured .hk-quote__text {
  text-align: left;
}
.hk-quote--featured .hk-quote__text {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

/* ⑫ スパイラルのイラストをもっと大きく */
.steps_spiral img {
  max-width: 780px;
}

/* ⑭ 引用文: 文字を少し大きく */
.hk-quote--featured .hk-quote__text {
  font-size: 1.8rem;
  line-height: 1.95;
}

/* ⑲ 比較表 行見出し: 大きな見出し＋小さな補足 */
#hikaku .graph .tbl th .hk-tbl-key {
  display: block;
  font-size: 2rem;
  font-weight: 700;
  color: #DB4D44;
  line-height: 1.2;
}
#hikaku .graph .tbl th .hk-tbl-sub {
  display: block;
  font-size: 1.1rem;
  font-weight: 700;
  color: #4e565f;
  margin-top: 3px;
}

/* ================================================================
   SP (smartphone) — 260604 修正
================================================================ */
@media screen and (max-width: 768px) {
  /* ⑤ PR注釈 SP */
  .hk-hero__pr-note {
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
    font-size: 1rem;
    padding: 10px 14px;
  }

  /* ④ モーダル SP: 本文スクロール領域の余白調整 */
  #hikaku .hk-interview-modal__content {
    padding: 56px 18px 24px;
    max-height: 80vh;
  }

  /* ⑪ スパイラル見出し SP: 少し大きく */
  #hikaku .steps_ttl__heading {
    font-size: 2.4rem !important;
  }
  #hikaku .steps_ttl__lead {
    font-size: 1.7rem !important;
    font-weight: 700;
    color: #1E4D8C;
  }

  /* ⑭ 引用文 SP */
  .hk-quote--featured .hk-quote__text {
    font-size: 1.5rem;
  }

  /* ⑲ 比較表 行見出し SP */
  #hikaku .graph .tbl th .hk-tbl-key {
    font-size: 1.7rem;
  }

  /* ㉖ 医師の吹き出し SP: 吹き出しボックスを上・先生の丸写真を右下に配置し、
     しっぽは右下の写真に向ける */
  .hk-speech__inner {
    flex-direction: column-reverse;
    align-items: flex-end;
    gap: 0;
    max-width: 100%;
  }
  .hk-speech__photo {
    margin-top: 10px;
    margin-right: 20px;
  }
  .hk-speech__bubble {
    width: 100%;
  }
  /* 吹き出しのしっぽを右下（丸写真の方向）に */
  .hk-speech__bubble::before {
    left: auto;
    right: 50px;
    top: 100%;
    bottom: auto;
    transform: none;
    border: 9px solid transparent;
    border-top-color: #BEE3F8;
    border-right-color: transparent;
  }
  .hk-speech__bubble::after {
    left: auto;
    right: 52px;
    top: calc(100% - 3px);
    bottom: auto;
    transform: none;
    border: 7px solid transparent;
    border-top-color: #fff;
    border-right-color: transparent;
  }
}

/* ================================================================
   260611 修正対応
================================================================ */

/* ⑥ まとめ (Summary) セクション */
.hk-summary {
  margin-top: 12px;
}
.hk-summary__title {
  font-size: 2rem;
  font-weight: 700;
  color: #1E4D8C;
  text-align: center;
  margin: 0 0 20px;
  padding-bottom: 12px;
  border-bottom: 2px solid #BEE3F8;
}
.hk-summary__body p {
  font-size: 1.4rem;
  line-height: 1.95;
  color: #333;
  margin: 0 0 18px;
  text-align: left;
}
.hk-summary__body p:last-child {
  margin-bottom: 0;
}
.hk-summary__em {
  color: #2B6CB0;
  font-weight: 700;
}

@media screen and (max-width: 768px) {
  .hk-summary__title {
    font-size: 1.7rem;
  }
  .hk-summary__body p {
    font-size: 1.3rem;
  }
}

/* ================================================================
   サイドメニュー削除対応（商品一覧の削除）
================================================================ */
/* content を単独で中央配置（サイドバー幅の差し引きを解除） */
#hikaku .main .content {
  width: 100%;
  max-width: 960px;
  margin-right: 0;
}
/* FV・PR注釈を content 幅（最大960px）に合わせて揃える */
.hk-hero__fv {
  max-width: 960px;
}
.hk-hero__pr-note {
  max-width: 960px;
}

/* ================================================================
   260810 修正対応（FV写真のHTML配置・バッジ変更・SPのbake廃止）
================================================================ */
/* PC: fv_bg.png を廃止し、CSSグラデーション背景＋写真左端フェードで自然につなぐ */
@media screen and (min-width: 769px) {
  .hk-hero__fv {
    background: linear-gradient(100deg, #ffffff 0%, #ffffff 36%, #eef4f9 56%, #e9edf0 76%, #e7e8e7 100%);
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(30, 77, 140, 0.08);
    min-height: 480px;
  }

  .hk-hero__fv-bg {
    display: none;
  }

  /* テキストは通常フローに（内容量に応じてボックスが伸びる） */
  .hk-hero__fv-inner {
    position: relative;
    top: auto;
    left: auto;
    width: 56%;
    height: auto;
    padding: 48px 3% 44px 5%;
    justify-content: flex-start;
  }

  .hk-hero__fv-photo {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 42%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 24%);
    mask-image: linear-gradient(to right, transparent 0%, #000 24%);
  }
}

/* SP: fv_sp.png（テキスト・写真bake済み）を廃止し、CSS背景＋HTMLテキスト＋写真で構成 */
@media screen and (max-width: 768px) {
  .hk-hero__fv {
    display: flex;
    flex-direction: column;
    background: linear-gradient(165deg, #ffffff 0%, #eef5fb 55%, #dceaf6 100%);
  }

  .hk-hero__fv-bg {
    display: none;
  }

  .hk-hero__fv-inner {
    order: 1;
    position: static;
    width: 100%;
    height: auto;
    padding: 8vw 5vw 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }

  .hk-hero__title {
    font-size: 2.8rem;
    margin: 0 0 8px;
  }

  .hk-hero__fv-inner .hk-hero__body {
    margin-top: 10px;
    font-size: 1.2rem;
    line-height: 1.7;
    margin-bottom: 0;
    background: none;
    padding: 0;
    border-radius: 0;
    color: #333;
  }

  .hk-hero__fv-photo {
    order: 2;
    position: static;
    display: block;
    width: 100%;
    height: 80vw;
    object-fit: cover;
    object-position: 50% 20%;
    margin: 14px 0 0;
    border-radius: 0;
    box-shadow: none;
  }
}

/* ================================================================
   260813 修正対応（フッター: 運営者情報/プライバシーポリシー リンク）
================================================================ */
.footer_logo .logo_links {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  margin-top: 12px;
  list-style: none;
  padding: 0;
}

.footer_logo .logo_links li:not(:first-child)::before {
  content: "/";
  margin: 0 0.6em;
  color: rgba(255, 255, 255, 0.6);
}

.footer_logo .logo_links a {
  color: #fff;
  font-size: 1.1rem;
  text-decoration: none;
}

.footer_logo .logo_links a:hover {
  text-decoration: underline;
}

/* ================================================================
   260819 修正対応（比較表チェック式・フッター）
================================================================ */
/* 比較表: ○/ー → チェックマーク/空欄 */
#hikaku .graph .tbl td .icon.-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 0 auto;
  border-radius: 50%;
  background: #E8F1FA;
  color: #1E4D8C;
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1;
}

#hikaku .graph .tbl td .icon.-none {
  display: block;
  width: 16px;
  height: 2px;
  margin: 0 auto;
  background: #d9d9d9;
  font-size: 0;
}

@media screen and (max-width: 768px) {
  #hikaku .graph .tbl td .icon.-check {
    width: 30px;
    height: 30px;
    font-size: 1.7rem;
  }
}

/* フッター: ロゴ上のリード文 */
.footer_logo .logo_lead {
  font-size: 1.05rem;
  line-height: 1.5;
  margin-bottom: 6px;
  color: rgba(255, 255, 255, 0.85);
  letter-spacing: 0.02em;
}

/* フッターリンク: 縦並びに（ロゴ枠が狭いため） */
.footer_logo .logo_links {
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.footer_logo .logo_links li:not(:first-child)::before {
  content: none;
  margin: 0;
}

.footer_logo .logo_links a {
  display: inline-block;
  padding-left: 1em;
  position: relative;
  line-height: 1.5;
}

.footer_logo .logo_links a::before {
  content: "›";
  position: absolute;
  left: 0;
  top: 0;
  color: rgba(255, 255, 255, 0.7);
}

/* 比較表 メーカー名: カッコ内を折り返さない */
#hikaku .graph .tbl td .nowrap {
  white-space: nowrap;
  letter-spacing: -0.05em;
}

/* ================================================================
   260821 修正対応（五十音順表記・監修セクション全ページ化）
================================================================ */
#hikaku .graph .tbl th .tbl-th-note {
  display: block;
  font-size: 1.05rem;
  font-weight: 500;
  color: #333;
  letter-spacing: 0;
  margin-top: 2px;
}

/* 監修セクション: 直前コンテンツとの余白 */
#hikaku .col-sec--supervisor {
  margin-top: 48px;
}

@media screen and (max-width: 768px) {
  #hikaku .col-sec--supervisor {
    margin-top: 28px;
  }
}

/* ================================================================
   260907 修正対応（ヘッダー「アレルギーヘルスラボ」→ サイト紹介モーダル）
================================================================ */
.header_ttl .js-sitelabo-open {
  color: #fff;
  text-decoration: none;
  cursor: pointer;
}

.header_ttl .js-sitelabo-open:hover {
  text-decoration: underline;
}

#hikaku .hk-sitelabo-modal__ttl {
  background: #E3F0FA;
  border-left: 4px solid #1E4D8C;
  border-radius: 0 8px 8px 0;
  color: #1E4D8C;
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.4;
  padding: 14px 20px;
  margin: 0 48px 20px 0;
}

#hikaku #hk-sitelabo-modal .hk-interview-modal__content {
  padding: 32px;
}

#hikaku #hk-sitelabo-modal .hk-interview-modal__content > p {
  font-size: 1.45rem;
  line-height: 2;
  color: #333;
  text-indent: 0;
}

@media screen and (max-width: 768px) {
  #hikaku .hk-sitelabo-modal__ttl {
    font-size: 1.6rem;
    padding: 12px 14px;
  }
}

/* ================================================================
   260928 ドメイン表記変更（allergy-health-labo.com）
   SP ヘッダーで URL が2行に折り返さないようにする
================================================================ */
@media screen and (max-width: 768px) {
  #hikaku .header_inner {
    width: auto;
    min-width: 50%;
  }
  #hikaku .header_url {
    white-space: nowrap;
  }
  #hikaku .header_url::before {
    margin-right: 0.8em;
  }
}