@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400&family=Noto+Sans+JP:wght@300;400&display=swap');

/* ========================================
   PC_STYLE.CSS  - パーソナルカラーLP改修用追加CSS
   ※ style.css の後に読み込む
======================================== */

/* ------ ② リード文 ------ */
.pc-lead__section {
  padding: 48px 20px 32px;
  text-align: center;
  background: #fff;
}
.pc-lead__inner {
  max-width: 760px;
  margin: 0 auto;
  text-align: left;
}
.pc-lead__sub {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 13px;
  letter-spacing: .1em;
  color: #888;
  text-align: center;
  margin-bottom: 6px;
}
.pc-lead__main {
  font-family: 'Cormorant Garamond', 'Times New Roman', serif;
  font-size: 36px;
  font-weight: 300;
  text-align: center;
  margin: 0 0 24px;
  letter-spacing: .05em;
  line-height: 1.4;
}
.pc-lead__body {
  font-size: 14px;
  line-height: 2;
  color: #333;
  padding: 0 4px;
}
@media screen and (min-width: 768px) {
  .pc-lead__main { font-size: 48px; }
}

/* ------ ③ アンカーナビ ------ */
.pc-nav__section {
  background: #f8f6f4;
  padding: 40px 16px 48px;
}
.pc-nav__inner {
  max-width: 900px;
  margin: 0 auto;
}
.pc-nav__heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: 24px;
  font-weight: 300;
  letter-spacing: .2em;
  text-align: center;
  margin-bottom: 8px;
}
.pc-nav__lead {
  font-size: 13px;
  color: #555;
  text-align: center;
  margin-bottom: 32px;
}

/* 上段：横長ボタン2本 */
.pc-nav__top {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 20px;
}
.pc-nav__btn,
.pc-nav__btn:link,
.pc-nav__btn:visited {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #1a1a1a;
  color: #fff !important;
  text-decoration: none;
  padding: 16px 24px;
  border-radius: 2px;
  font-size: 14px;
  letter-spacing: .05em;
  transition: background .2s;
}
.pc-nav__btn:hover { background: #444; color: #fff !important; }
.pc-nav__btn--wide { width: 100%; }
.pc-nav__icon { font-size: 16px; flex-shrink: 0; }
.pc-nav__label { flex: 1; }
.pc-nav__arrow { font-size: 18px; opacity: .7; }
@media screen and (min-width: 768px) {
  .pc-nav__top { flex-direction: row; }
  .pc-nav__btn--wide { flex: 1; }
}

/* 下段：4タイプカード */
.pc-nav__types {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
@media screen and (min-width: 768px) {
  .pc-nav__types { grid-template-columns: repeat(4, 1fr); }
}
.pc-nav__type,
.pc-nav__type:link,
.pc-nav__type:visited {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px 12px;
  border-radius: 2px;
  text-decoration: none;
  color: #fff !important;
  text-align: center;
  gap: 4px;
  transition: opacity .2s;
}
.pc-nav__type:hover { opacity: .85; }
.pc-nav__type--spring { background: #d9957e; }
.pc-nav__type--summer { background: #7a9bb5; }
.pc-nav__type--autumn { background: #9a7052; }
.pc-nav__type--winter { background: #3d3d5c; }
.pc-nav__type-label {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 15px;
  font-weight: 400;
}
.pc-nav__type-en {
  font-family: 'Cormorant Garamond', serif;
  font-size: 13px;
  letter-spacing: .12em;
  opacity: .85;
}
.pc-nav__type-link {
  font-size: 11px;
  margin-top: 6px;
  opacity: .8;
  border-top: 1px solid rgba(255,255,255,.4);
  padding-top: 6px;
  width: 100%;
}

/* ------ ④ メリット4カード ------ */
.pc-merit__section {
  background: #faf7f3;
  padding: 56px 16px;
}
.pc-merit__inner {
  max-width: 900px;
  margin: 0 auto;
}
.pc-merit__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 32px;
}
@media screen and (min-width: 600px) {
  .pc-merit__grid { grid-template-columns: repeat(2, 1fr); }
}
@media screen and (min-width: 1024px) {
  .pc-merit__grid { grid-template-columns: repeat(4, 1fr); }
}
.pc-merit__card {
  background: #fff;
  border: 1px solid #e8e4df;
  border-radius: 2px;
  padding: 24px 20px;
  text-align: left;
}
.pc-merit__num {
  font-family: 'Times New Roman', '游明朝', 'Yu Mincho', 'YuMincho', 'Hiragino Mincho ProN', serif;
  font-size: 22px;
  font-weight: 400;
  font-variant-numeric: lining-nums;
  color: #c8b49a;
  margin-bottom: 8px;
  letter-spacing: .05em;
  line-height: 1;
}
.pc-merit__title {
  font-size: 13px;
  font-weight: bold;
  color: #222;
  margin-bottom: 10px;
  line-height: 1.5;
}
.pc-merit__body {
  font-size: 12px;
  color: #555;
  line-height: 1.8;
}

/* ------ ⑤ 診断 ------ */
.pc-quiz__section {
  background: #eeebe8;
  padding: 56px 16px;
}
.pc-quiz__inner {
  max-width: 640px;
  margin: 0 auto;
}

/* 進捗バー */
.pc-quiz__progress {
  background: #ddd;
  border-radius: 4px;
  height: 4px;
  margin-bottom: 6px;
}
.pc-quiz__progress-bar {
  background: #9a7052;
  height: 4px;
  border-radius: 4px;
  width: 0%;
  transition: width .3s ease;
}
.pc-quiz__progress-text {
  font-size: 11px;
  color: #888;
  text-align: right;
  margin-bottom: 28px;
}

/* 問 */
.pc-quiz__container {
  background: #fff;
  border-radius: 4px;
  padding: 32px 24px;
}
.pc-quiz__step { display: none; }
.pc-quiz__step.active { display: block; }
.pc-quiz__q {
  font-size: 15px;
  font-weight: bold;
  color: #222;
  margin-bottom: 20px;
  line-height: 1.6;
}
.pc-quiz__choice {
  display: block;
  width: 100%;
  text-align: left;
  background: #f6f4f1;
  border: 1px solid #ddd;
  border-radius: 2px;
  padding: 14px 16px;
  font-size: 13px;
  color: #333;
  cursor: pointer;
  margin-bottom: 12px;
  line-height: 1.6;
  transition: background .15s, border-color .15s;
}
.pc-quiz__choice:hover {
  background: #e8e0d8;
  border-color: #c8b49a;
}
.pc-quiz__back {
  background: none;
  border: none;
  color: #888;
  font-size: 12px;
  cursor: pointer;
  margin-top: 16px;
  padding: 0;
  text-decoration: underline;
}

/* 結果 */
.pc-quiz__result {
  background: #fff;
  border-radius: 4px;
  padding: 40px 24px;
  text-align: center;
}
.pc-quiz__result-badge {
  display: inline-block;
  padding: 6px 20px;
  border-radius: 20px;
  color: #fff !important;
  font-size: 12px;
  letter-spacing: .1em;
  margin-bottom: 16px;
}
.pc-quiz__result-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 26px;
  font-weight: 300;
  margin-bottom: 12px;
}
.pc-quiz__result-body {
  font-size: 13px;
  color: #555;
  line-height: 1.8;
  margin-bottom: 24px;
}
.pc-quiz__result-btn {
  display: inline-block;
  background: #1a1a1a;
  color: #fff !important;
  padding: 14px 32px;
  font-size: 13px;
  letter-spacing: .05em;
  text-decoration: none;
  border-radius: 2px;
  margin-bottom: 16px;
  transition: background .2s;
}
.pc-quiz__result-btn:hover { background: #444; }
.pc-quiz__retry {
  display: block;
  background: none;
  border: 1px solid #bbb;
  color: #888;
  font-size: 12px;
  padding: 8px 20px;
  border-radius: 2px;
  cursor: pointer;
  margin: 0 auto;
  transition: all .15s;
}
.pc-quiz__retry:hover { background: #f0ebe6; }

/* ------ ⑥ 4タイプ共通 ------ */
.pc-section__title {
  font-family: 'Cormorant Garamond', 'Times New Roman', serif;
  font-size: 22px;
  font-weight: 300;
  line-height: 1.6;
  text-align: center;
  margin: 0 0 12px;
  color: #222;
}
.pc-section__lead {
  font-size: 13px;
  color: #555;
  text-align: center;
  line-height: 1.9;
  margin-bottom: 0;
}

.pc-type__section {
  padding: 56px 0 48px;
}
.pc-type__header {
  max-width: 900px;
  margin: 0 auto 32px;
  text-align: center;
  padding: 0 16px;
}
.pc-type__season-label {
  font-size: 12px;
  letter-spacing: .12em;
  color: #999;
  margin-bottom: 4px;
}
.pc-type__season-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px;
  font-weight: 300;
  letter-spacing: .08em;
  margin: 0 0 16px;
}
.pc-type--spring .pc-type__season-title { color: #c07060; }
.pc-type--summer .pc-type__season-title { color: #5e8aaa; }
.pc-type--autumn .pc-type__season-title { color: #8a5e38; }
.pc-type--winter .pc-type__season-title { color: #3a3a55; }

.pc-type__inner {
  max-width: 900px;
  margin: 0 auto 40px;
  padding: 0 16px;
}

/* 特徴：左右レイアウト */
.pc-type__feature {
  max-width: 900px;
  margin: 0 auto 40px;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
@media screen and (min-width: 768px) {
  .pc-type__feature {
    flex-direction: row;
    align-items: flex-start;
    gap: 40px;
  }
  .pc-type__feature-img { flex: 0 0 42%; }
  .pc-type__feature-text { flex: 1; padding-top: 8px; }
}
.pc-type__feature-body {
  font-size: 13px;
  line-height: 1.9;
  color: #444;
  text-align: left;
}

/* カラー選び：4列 */
.pc-color__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
}
@media screen and (min-width: 768px) {
  .pc-color__grid { grid-template-columns: repeat(4, 1fr); }
}
.pc-color__grid li { text-align: center; }
.pc-color__label {
  font-size: 12px;
  line-height: 1.7;
  color: #444;
  text-align: left;
  margin-top: 8px;
}

/* コーデ提案：4列 */
.pc-coord__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
}
@media screen and (min-width: 768px) {
  .pc-coord__grid { grid-template-columns: repeat(4, 1fr); gap: 20px; }
}
.pc-coord__grid .code_lead {
  font-size: 12px;
  color: #555;
  text-align: left;
  margin-top: 6px;
  line-height: 1.7;
}

/* コーデシーズンタイトル */
.pc-coord__season-title {
  font-size: 16px;
  font-weight: bold;
  color: #333;
  margin: 8px 0 16px;
}

/* コーデポイントリスト */
.pc-coord__points {
  list-style: none;
  padding: 0;
  margin: 0 0 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.pc-coord__points li {
  font-size: 13px;
  color: #444;
  line-height: 1.8;
  padding: 14px 16px;
  background: #faf7f3;
  border-left: 3px solid #c8b49a;
  border-radius: 0 2px 2px 0;
}
.pc-coord__points li strong {
  display: block;
  margin-bottom: 4px;
  color: #222;
}

/* コーデ詳細：2列グリッド */
.pc-coord__detail-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}
@media screen and (min-width: 768px) {
  .pc-coord__detail-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; }
}
.pc-coord__detail-block {
  background: #fff;
  border: 1px solid #e8e4df;
}
.pc-coord__detail-text {
  padding: 20px;
}
.pc-coord__detail-heading {
  font-size: 13px;
  font-weight: bold;
  color: #222;
  border-bottom: 1px solid #ddd;
  padding-bottom: 8px;
  margin-bottom: 10px;
  line-height: 1.5;
}
.pc-coord__detail-text p {
  font-size: 12px;
  color: #555;
  line-height: 1.8;
  margin-bottom: 12px;
}
.pc-coord__items-heading {
  font-weight: bold;
  font-size: 12px;
  color: #333;
  border-bottom: 1px solid #ddd;
  padding-bottom: 4px;
  margin: 14px 0 8px;
}
.pc-coord__detail-text .item_name2 {
  display: block;
  font-size: 12px;
  color: #555;
  margin-bottom: 6px;
  line-height: 1.6;
  text-decoration: underline;
}

/* ------ ⑧ アイテムグリッド（BUY NOW 高さ統一） ------ */
.pc-item__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
}
@media screen and (min-width: 600px) {
  .pc-item__grid { grid-template-columns: repeat(3, 1fr); }
}
@media screen and (min-width: 1024px) {
  .pc-item__grid { grid-template-columns: repeat(4, 1fr); gap: 20px; }
}

/* セル：flexboxでBUY NOWを常に最下部に固定 */
.pc-item__cell a {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
}
.pc-item__cell .liquidimg_item {
  width: 100%;
  height: auto;
  display: block;
}
.pc-item__cell .code_lead {
  font-size: 12px;
  color: #333;
  padding: 8px 4px 4px;
  line-height: 1.5;
  flex: 1; /* ← ここでテキスト部分を伸ばす */
}
.pc-item__cell .item_price_center {
  font-size: 12px;
  color: #333;
  text-align: center;
  padding: 0 4px 4px;
}
.pc-item__cell .buy_btn3 {
  background: #808080;
  color: #fff !important;
  padding: 8px;
  font-size: 12px;
  width: 80%;
  margin: 0 auto 8px;
  border-radius: 4px;
  text-align: center;
  /* 高さ統一：常に最下部 */
}

/* ------ セクション共通タイトル ------ */
.pc-section__title {
  font-size: 20px;
  font-weight: 300;
  text-align: center;
  margin-bottom: 12px;
}
@media screen and (min-width: 768px) {
  .pc-section__title { font-size: 24px; }
}

/* ------ フッター ------ */
.pc-footer__section {
  text-align: center;
  padding: 48px 16px 24px;
}
.pc-sns__section {
  text-align: center;
  padding: 16px 0 40px;
}
.pc-sns__inner {
  display: flex;
  justify-content: center;
  gap: 12px;
}

/* ------ 共通ユーティリティ ------ */
hr {
  border: none;
  border-top: 1px solid #e8e4df;
  margin: 0;
}

/* ------ タブ切り替え ------ */
.pc-tab__nav {
  display: flex;
  gap: 0;
  margin-bottom: 32px;
  border-bottom: 2px solid #e0dbd6;
}
.pc-tab__btn {
  flex: 1;
  background: none;
  border: none;
  border-bottom: 3px solid transparent;
  padding: 14px 12px;
  font-size: 13px;
  color: #999;
  cursor: pointer;
  letter-spacing: .04em;
  transition: color .2s, border-color .2s;
  margin-bottom: -2px;
  text-align: center;
  line-height: 1.4;
}
.pc-tab__btn:hover { color: #555; }
.pc-tab__btn.active {
  color: #222;
  border-bottom-color: #9a7052;
  font-weight: bold;
}
.pc-type--summer .pc-tab__btn.active { border-bottom-color: #5e8aaa; }
.pc-type--winter .pc-tab__btn.active { border-bottom-color: #3a3a55; }
.pc-tab__panel { display: block; }

/* ========================================
   DESIGN REFRESH - 見出し統一・仕切り・左揃え・アニメ
======================================== */

/* --- フォント変数（全見出しで統一） --- */
:root {
  --font-serif: 'Times New Roman', '游明朝', 'Yu Mincho', 'Hiragino Mincho ProN', serif;
  --font-sans: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', sans-serif;
}

/* --- 見出し全体リセット（style.css上書き） --- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-serif) !important;
  font-weight: 400 !important;
  font-variant-numeric: lining-nums;
  letter-spacing: .04em;
  line-height: 1.5;
  margin: 0;
}

/* --- ページタイトル（FV下） --- */
.pc-lead__main {
  font-family: var(--font-serif) !important;
  font-size: 32px !important;
  font-weight: 300 !important;
  letter-spacing: .06em;
}
@media screen and (min-width: 768px) {
  .pc-lead__main { font-size: 42px !important; }
}

/* --- セクション大見出し（メリット・診断など） --- */
.pc-section__title {
  font-family: var(--font-serif) !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  text-align: center;
  line-height: 1.7;
  margin-bottom: 12px;
  color: #222;
}
@media screen and (min-width: 768px) {
  .pc-section__title { font-size: 22px !important; }
}

/* --- タイプラベル（イエベ春（スプリング）） --- */
.pc-type__season-label {
  font-family: var(--font-sans) !important;
  font-size: 11px !important;
  letter-spacing: .14em;
  color: #aaa;
  margin-bottom: 4px;
}

/* --- タイプ英字タイトル（Yellow base SPRING など） --- */
.pc-type__season-title {
  font-family: var(--font-serif) !important;
  font-size: 26px !important;
  font-weight: 300 !important;
  letter-spacing: .1em;
  margin: 0 0 16px;
}
@media screen and (min-width: 768px) {
  .pc-type__season-title { font-size: 32px !important; }
}

/* --- コーデ英字タイトル（Yellow base"SPRING" Coordinate） --- */
.contents_title {
  font-family: var(--font-serif) !important;
  font-size: 18px !important;
  font-weight: 300 !important;
  letter-spacing: .08em;
  color: #444;
  margin-bottom: 8px;
}

/* --- コーデシーズン小見出し --- */
.pc-coord__season-title {
  font-family: var(--font-sans) !important;
  font-size: 14px !important;
  font-weight: bold !important;
  color: #333;
  margin: 4px 0 20px;
  letter-spacing: .02em;
}

/* --- アイテムタイトル（Yellow base"SPRING" Item） --- */
.subcontents_title {
  font-family: var(--font-serif) !important;
  font-size: 18px !important;
  font-weight: 300 !important;
  letter-spacing: .08em;
  color: #444;
  margin: 0 0 8px;
}

/* --- chibi_text6（小見出し帯） --- */
.chibi_text6 {
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  font-weight: bold !important;
  letter-spacing: .06em;
  display: inline-block;
  border-top: solid 1px #d1d1d1;
  border-bottom: solid 1px #d1d1d1;
  padding: 4px 6px;
  margin: 20px 0 12px;
}

/* --- chibi_text_title（点線区切り見出し） --- */
.chibi_text_title {
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  font-weight: bold !important;
  border-bottom: 1px dotted #ccc;
  padding-bottom: 6px;
  margin-bottom: 16px;
  color: #333;
  text-align: center;
}

/* --- メリットカードタイトル --- */
.pc-merit__title {
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  font-weight: bold !important;
  line-height: 1.6;
  margin-bottom: 8px;
}

/* =========================================
   タイプセクションの仕切りを強調
========================================= */
.pc-type__section {
  border-top: 1px solid #ddd;
  padding-top: 64px;
}
.pc-type--spring { border-top: 3px solid #d9957e; }
.pc-type--summer { border-top: 3px solid #7a9bb5; }
.pc-type--autumn { border-top: 3px solid #9a7052; }
.pc-type--winter { border-top: 3px solid #3d3d5c; }

/* タイプラベルとタイトルの上に余白（仕切り線の後） */
.pc-type__header {
  padding-top: 16px;
}

/* =========================================
   コーデポイント・本文テキスト → 左揃え統一
========================================= */
.pc-coord__points li {
  text-align: left !important;
}
.pc-coord__points li strong {
  text-align: left !important;
  display: block;
}
.pc-coord__detail-text p {
  text-align: left !important;
  line-height: 1.8;
}
.pc-section__lead {
  text-align: left !important;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 16px;
  color: #555;
  font-size: 13px;
  line-height: 1.9;
}
.chibi_text2 {
  text-align: left !important;
}

/* =========================================
   スクロールアニメーション → さりげなく上品に
   scrolla.js の data-animate を上書き
========================================= */
.animate {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .5s ease, transform .5s ease;
}
.animate.animate__animated,
.animate.animated {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* scrolla が付与する animate__fadeInUp 等をソフトに上書き */
@keyframes pc-fadeUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
.animate__animated.animate__fadeInUp,
.animated.fadeInUp {
  animation: pc-fadeUp .5s ease forwards !important;
}
/* 移動量を最小化：全アニメ系を上書き */
[class*="animate__fade"],
[class*="fadeIn"] {
  animation-duration: .5s !important;
}


/* =========================================
   アイテムグリッド SP3列 / PC6列
========================================= */
.pc-item__grid {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 10px !important;
}
@media screen and (min-width: 1024px) {
  .pc-item__grid {
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 12px !important;
  }
}
/* 6列時はフォント・ボタンをコンパクトに */
@media screen and (min-width: 1024px) {
  .pc-item__cell .code_lead { font-size: 11px; padding: 6px 2px 2px; }
  .pc-item__cell .item_price_center { font-size: 11px; }
  .pc-item__cell .buy_btn3 { font-size: 11px; padding: 6px; }
}


/* =========================================
   解説タブ内 見出し（中央揃え・ライン付き）
========================================= */
.pc-info__heading {
  display: block;
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  font-weight: bold !important;
  letter-spacing: .08em;
  text-align: center !important;
  color: #333;
  margin: 32px auto 14px;
  position: relative;
  padding-bottom: 10px;
}
/* 下線をシンプルな中央線に変更（chibi_text6の枠線スタイルを上書き） */
.pc-info__heading::after {
  content: '';
  display: block;
  width: 40px;
  height: 1px;
  background: #bbb;
  margin: 8px auto 0;
}
/* border-top/bottom は使わない */
.pc-info__heading {
  border: none !important;
  padding: 0 0 0 0;
}

/* =========================================
   カラー小見出し（ベーシックカラー等）
   各タイプカラーで色を変える
========================================= */
.pc-color__sub {
  display: block;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: bold;
  letter-spacing: .06em;
  margin-bottom: 4px;
  padding: 2px 0;
}
.pc-color__sub--spring { color: #c07060; }
.pc-color__sub--summer { color: #5e8aaa; }
.pc-color__sub--autumn { color: #8a5e38; }
.pc-color__sub--winter { color: #3a3a55; }

/* =========================================
   コーデスタイルラベル（フェミニン・カジュアル等）
   chibi_text5 の点線スタイルを廃止しシンプルに
========================================= */
.pc-coord__style-label {
  font-family: var(--font-sans) !important;
  font-size: 12px !important;
  font-weight: bold !important;
  color: #555;
  text-align: center;
  letter-spacing: .06em;
  margin: 0 0 8px;
  padding: 0;
  border: none;
}


/* =========================================
   アイテムグリッド：商品名・価格を左揃えに
========================================= */
.pc-item__cell .code_lead {
  text-align: left !important;
}
.pc-item__cell .item_price_center {
  text-align: left !important;
  padding-left: 4px;
}


/* =========================================
   コーデ詳細：着用アイテムリンク・見出しを左揃えに
========================================= */
.pc-coord__items-heading {
  text-align: left !important;
}
.pc-coord__detail-text .item_name2 {
  text-align: left !important;
  display: block;
}


/* =========================================
   フッター：中央揃え
========================================= */
.pc-footer__section {
  text-align: center;
  padding: 48px 16px 40px;
  border-top: 1px solid #e8e4df;
}
.pc-footer__title {
  font-family: var(--font-serif);
  font-size: 14px;
  font-weight: 300;
  letter-spacing: .08em;
  color: #444;
  margin-bottom: 10px;
}
.pc-footer__copy {
  font-size: 11px;
  color: #aaa;
  letter-spacing: .06em;
}


/* =========================================
   解説タブ → 提案タブへの誘導ボタン
========================================= */
.pc-tab__to-suggest {
  text-align: center;
  margin: 32px 0 8px;
}
.pc-tab__to-suggest-btn {
  display: inline-block;
  background: none;
  border: 1px solid #aaa;
  color: #444;
  font-size: 13px;
  letter-spacing: .08em;
  padding: 12px 32px;
  border-radius: 2px;
  cursor: pointer;
  transition: background .2s, color .2s;
}
.pc-tab__to-suggest-btn:hover {
  background: #1a1a1a;
  color: #fff;
  border-color: #1a1a1a;
}


/* =========================================
   タブボタン：2行テキスト対応
========================================= */
.pc-tab__btn {
  line-height: 1.5;
  padding: 12px 8px !important;
}


/* =========================================
   コーデ詳細：画像の下にテキストを配置
========================================= */
.pc-coord__detail-block {
  display: flex;
  flex-direction: column;
}
.pc-coord__detail-block img {
  width: 100% !important;
  height: auto !important;
  display: block;
}
.pc-coord__detail-text {
  padding: 16px !important;
}

/* =========================================
   コーデレイアウト：幅制御
========================================= */
.pc-coord__layout {
  max-width: 900px;
  margin: 0 auto;
}
.pc-coord__cards td img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
}
.liquidimg_item {
  max-width: 100%;
  height: auto;
  display: block;
}
.pc-coord__detail-grid img.liquidimg_item {
  width: 100%;
  height: auto;
  display: block;
}