:root{--icon-gold:#E8B534;--icon-white:#FFFFFF;--icon-emerald:#108B74;}
body#goldcard{--cc-icon-color:var(--icon-gold);}
body#platinumcard{--cc-icon-color:var(--icon-emerald);}
@charset "UTF-8";
:root {
  /* SP文字サイズ調整：全体を一回り大きくし、320〜390px幅で最小13px以上にする */
  --fs-2xs: clamp(13px, 2.9vw, 14px);
  --fs-xs: clamp(13px, 3.1vw, 15px);
  --fs-xs-plus: clamp(13px, 3.2vw, 15px);
  --fs-small: clamp(13px, 3.3vw, 16px);
  --fs-small-plus: clamp(13px, 3.4vw, 16px);
  --fs-base: clamp(13.5px, 3.5vw, 17px);
  --fs-base-plus: clamp(14px, 3.6vw, 17px);
  --fs-medium: clamp(14px, 3.7vw, 18px);
  --fs-medium-plus: clamp(14.5px, 3.8vw, 18px);
  --fs-large: clamp(15px, 3.9vw, 19px);
  --fs-large-plus: clamp(15.5px, 4vw, 19px);
  --fs-xlarge: clamp(16px, 4.1vw, 20px);
  --fs-2xlarge: clamp(16.5px, 4.3vw, 21px);
  --fs-2xlarge-plus: clamp(17px, 4.4vw, 21px);
  --fs-3xlarge: clamp(17.5px, 4.5vw, 22px);
  --fs-4xlarge: clamp(18.5px, 4.7vw, 23px);
  --fs-4xlarge-plus: clamp(19px, 4.8vw, 23px);
  --fs-5xlarge: clamp(19.5px, 4.9vw, 24px);
  --fs-6xlarge: clamp(20px, 5.1vw, 25px);
  --fs-heading-small: clamp(21px, 5.3vw, 27px);
  --fs-heading-medium: clamp(21.5px, 5.4vw, 28px);
  --fs-heading-large: clamp(22px, 5.5vw, 29px);
  --fs-heading-xlarge: clamp(22.5px, 5.6vw, 30px);
  --fs-section-title: clamp(24px, 5.9vw, 32px);
  --fs-article-title: clamp(24px, 6vw, 33px);
  --fs-page-title: clamp(26px, 6.6vw, 36px);
  --fs-icon-large: clamp(28px, 7.4vw, 40px);
  --fs-fv-title-platinum: clamp(38px, 10vw, 52px);
  --fs-fv-title-gold: clamp(42px, 12vw, 60px);
  --fs-modal-close: 16px;
  --fs-scale-medium: 1.125em;
  --fs-scale-large: 1.25em;
  --fs-scale-title-accent: 1.22em;
}
/* --------------------------------------------------------------------------
   Credit card comparison page: SP styles
   -------------------------------------------------------------------------- */

body#goldcard {
  background: #fcfaf5;
  color: #1d2a3a;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", YuGothic, Meiryo, sans-serif;
}

body#goldcard * {
  box-sizing: border-box;
}

body#goldcard img {
  max-width: 100%;
  height: auto;
}

body#goldcard a {
  text-decoration: none;
}

body#goldcard #maincontents {
  width: 100%;
  margin: 0 auto;
  padding: 0 0 0 0;
}

/* First view */
body#goldcard #fv {
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  margin: 0 0 9vw 0;
  padding: 6vw 0;
  border-bottom: 1px solid rgba(216, 199, 159, .55);
  border-radius: 0;
  background:
    radial-gradient(circle at 16% 12%, rgba(242, 169, 0, .16), transparent 42%),
    linear-gradient(180deg, #fffefd 0%, #fcfaf5 86%, #fcfaf5 100%);
  box-shadow: 0 1vw 2vw rgba(29, 42, 58, .08);
}

body#goldcard #fv::before {
  content: "";
  position: absolute;
  z-index: 0;
  width: 94vw;
  height: 70vw;
  right: -14vw;
  top: 6vw;
  background: url("../../images/special/creditcard/fv-bg-sp.png") no-repeat center / contain;
  opacity: 1;
  pointer-events: none;
}

body#goldcard #fv > div {
  position: relative;
  z-index: 1;
  min-width: 0;
}

/* Dissolve the left group on SP so ①②③ become flex items of #fv,
   then reorder to ①→④→②→③ (PC keeps grouped 2-column layout in css/w/). */
body#goldcard #fv > .fv-left { display: contents; }
body#goldcard #fv .fv-left > * { position: relative; z-index: 1; }
body#goldcard #fv .fv-lead { order: 1; padding: 0 4vw;}
body#goldcard #fv > .fv-pickup { order: 2; }
body#goldcard #fv #comparison-switcher { order: 3; }
body#goldcard #fv #comparison-switcher + a { order: 4; }

body#goldcard #fv a,
body#goldcard #fv span {
  display: inline-block;
}

body#goldcard #fv h1 {
  width: fit-content;
  margin: 0;
  min-height: 8.2vw;
  display: inline-flex;
  align-items: center;
  padding: 0 5.2vw;
  clip-path: polygon(0 0, calc(100% - 3.7vw) 0, 100% 50%, calc(100% - 3.7vw) 100%, 0 100%, 2vw 50%);
  background: linear-gradient(90deg, #ffd36a 0%, #f6e3a3 100%);
  color: #1d2a3a;
  font-size: var(--fs-medium-plus);
  font-weight: 900;
  line-height: 1;
  letter-spacing: .03em;
  box-shadow: 0 2vw 5vw rgba(0, 0, 0, .08);
}

body#goldcard #fv h1 span {
  display: inline;
}

body#goldcard #fv .fv-lead > p:nth-of-type(1) {
  margin: 4.6vw 0 0;
  color: #1d2a3a;
  font-size: var(--fs-fv-title-gold);
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: -0.05em;
}

body#goldcard #fv .fv-lead > p:nth-of-type(1) span {
  display: block;
}

body#goldcard #fv .fv-lead > p:nth-of-type(1) span:nth-child(2) em {
  color: #f2a900;
}

body#goldcard #fv .fv-lead > p:nth-of-type(2) {
  margin: 3.4vw 0 0;
  color: #4a5568;
  font-size: var(--fs-large-plus);
  font-weight: 700;
  line-height: 1.8;
}

body#goldcard #fv .fv-lead > p:nth-of-type(2) span {
  display: block;
}

body#goldcard .comparison-switcher ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

body#goldcard #comparison-switcher-1 {
  margin-top: 5.2vw;
  padding: 4vw;
  border: 1px solid #e8e8e8;
  border-radius: 5.4vw 5.4vw 0 0;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}

body#goldcard #coparison-starter {
  position: relative;
  width: 100%;
  min-height: 13.5vw;
  padding: 0 11vw 0 15vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: linear-gradient(135deg, rgb(6, 29, 85) 0%, rgb(11, 52, 120) 100%);
  color: #fff;
  box-shadow: 0 4vw 8vw rgba(6, 29, 85, .26);
  font-size: var(--fs-xlarge);
  font-weight: 900;
  text-align: center;
}

body#goldcard #coparison-starter::before {
content: "";
position: absolute;
left: 2vw;
top: 50%;
width: 9.5vw;
height: 9.5vw;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: rgba(255, 255, 255, .95) url("../../images/special/creditcard/icons/search-gold.svg") no-repeat center / 5vw 5vw;
transform: translateY(-50%);
font-size: var(--fs-2xlarge);
}

body#goldcard #coparison-starter::after {
content: "";
position: absolute;
right: 4.5vw;
top: 50%;
transform: translateY(-50%);
font-size: var(--fs-small);
line-height: 1;
width: 5vw;
height: 5vw;
-webkit-mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; background-color: var(--icon-white);
}

body#goldcard #comparison-switcher-1 > div {
  display: none;
  margin-top: 3vw;
  padding: 3.4vw;
  border: 1px solid #e8e8e8;
  border-radius: 3.4vw;
  background: #fff;
}

body#goldcard #comparison-switcher-1 > div::before {
  content: "比較したい条件を選択してください";
  display: block;
  margin: 0 0 2.4vw;
  color: #687385;
  font-size: var(--fs-small);
  font-weight: 900;
}

body#goldcard #comparison-switcher-1 ul {
  display: flex;
  gap: 2vw;
  overflow-x: auto;
  padding-bottom: 1vw;
  -webkit-overflow-scrolling: touch;
}

body#goldcard #comparison-switcher-1 li {
  flex: 0 0 auto;
}

body#goldcard #comparison-switcher-1 li a {
  min-height: 9vw;
  padding: 0 4vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 999px;
  background: #fffaf0;
  color: #1d2a3a;
  font-size: var(--fs-small-plus);
  font-weight: 900;
  white-space: nowrap;
}

body#goldcard #comparison-switcher-1 li.selected a {
  border-color: #f2a900;
  background: #fff4d6;
}

body#goldcard #comparison-switcher-2 {
  padding: 0 4vw 4vw;
  border: 1px solid #e8e8e8;
  border-top: 0;
  border-radius: 0 0 5.4vw 5.4vw;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}

body#goldcard #comparison-switcher-2 > span {
  display: flex;
  align-items: center;
  gap: 2vw;
  margin: 0 0 3vw;
  padding-top: 4vw;
  border-top: 1px solid #e8e8e8;
  color: #1d2a3a;
  font-size: var(--fs-large);
  font-weight: 900;
}

body#goldcard #comparison-switcher-2 > span::before {
  content: "";
  width: 2vw;
  height: 2vw;
  border-radius: 50%;
  background: #f2a900;
  box-shadow: 0 0 0 1.2vw rgba(242, 169, 0, .16);
}

body#goldcard #comparison-switcher-2 ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.4vw;
}

body#goldcard #fv li[data-comparison="0"] {
  display: none;
}

body#goldcard #comparison-switcher-2 li a {
  min-height: 28vw;
  padding: 3vw 2vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 1px solid #e8e8e8;
  border-radius: 3vw;
  background: #fff;
  color: #1d2a3a;
  text-align: center;
}

body#goldcard #comparison-switcher-2 li a::before {
  width: 9.6vw;
  height: 9.6vw;
  margin-bottom: 2.2vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3vw;
  background: #fff4d6;
  color: #0a2463;
  font-size: var(--fs-5xlarge);
}

body#goldcard #comparison-switcher-2 li.wallet a::before { content: ""; }
body#goldcard #comparison-switcher-2 li.gift a::before { content: ""; }
body#goldcard #comparison-switcher-2 li.point a::before { content: ""; }
body#goldcard #comparison-switcher-2 li.lounge a::before { content: ""; }

body#goldcard #comparison-switcher-2 li a > span:nth-of-type(1) {
  color: #1d2a3a;
  font-size: var(--fs-base);
  font-weight: 900;
  line-height: 1.4;
}

body#goldcard #comparison-switcher-2 li a > span:nth-of-type(2) {
  margin-top: 1.3vw;
  color: #4a5568;
  font-size: var(--fs-xs);
  font-weight: 700;
  line-height: 1.55;
}

body#goldcard #comparison-switcher-2 li.selected a {
  border-color: #f2a900;
  background: #fff4d6;
}

body#goldcard #comparison-switcher-2 + a {
  min-height: 20vw;
  margin-top: 4vw;
  padding: 3.4vw 10vw 3.4vw 18vw;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 4vw;
  background: #fff;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
  color: #1d2a3a;
}

body#goldcard #comparison-switcher-2 + a::before {
  content: "";
  position: absolute;
  left: 4vw;
  top: 50%;
  width: 11vw;
  height: 11vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3vw;
  background: #fff4d6;
  transform: translateY(-50%);
  font-size: var(--fs-heading-small);
}

body#goldcard #comparison-switcher-2 + a::after {
  content: "";
  position: absolute;
  right: 4vw;
  top: 50%;
  transform: translateY(-50%);
  color: #f2a900;
  font-size: var(--fs-icon-large);
}

body#goldcard #comparison-switcher-2 + a span:nth-child(1) {
  color: #1d2a3a;
  font-size: var(--fs-medium-plus);
  font-weight: 900;
}

body#goldcard #comparison-switcher-2 + a span:nth-child(n+2) {
  margin-top: .5vw;
  color: #4a5568;
  font-size: var(--fs-small);
  font-weight: 700;
  line-height: 1.45;
}

/* Pickup */
body#goldcard #fv > div:nth-of-type(1) {
}
body#goldcard #fv > .fv-pickup {
  margin-top: 6vw;
}

body#goldcard #pickup {
  position: relative;
  overflow: hidden;
  border-width: 1px 0;
  border-style: solid;
  border-color: #e8e8e8;
  border-radius: 0;
  background: rgba(255, 255, 255, .97);
  box-shadow: 0 4vw 12vw rgba(29, 42, 58, .10);
}

body#goldcard #pickup h2 {
  margin: 0;
  padding: 5vw 5vw 1vw;
  color: #1d2a3a;
  font-size: var(--fs-heading-large);
  line-height: 1.5;
  font-weight: 900;
  text-align: center;
  letter-spacing: -0.25vw;
}

body#goldcard #pickup h2::after {
  content: "";
  width: 12vw;
  height: .8vw;
  margin: 2.2vw auto 0;
  display: block;
  border-radius: 999px;
  background: #f2a900;
}

body#goldcard #pickup > div {
  margin-top: 3.4vw;
  overflow-x: auto;
  padding: 0 4vw 4vw;
  -webkit-overflow-scrolling: touch;
}

body#goldcard #pickup table {
  width: 100%;
  min-width: 230vw;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}

body#goldcard #pickup table th,
body#goldcard #pickup table td {
  vertical-align: top;
}

body#goldcard #pickup table thead th {
  padding: 2vw 2vw 0;
  background: #fff;
  text-align: center;
}

body#goldcard #pickup table thead th,
body#goldcard #pickup table tbody td { border-left: 1px solid #e8e8e8;}
body#goldcard #pickup table thead th:last-child { border-right: 1px solid #e8e8e8;}

body#goldcard #pickup table thead tr:nth-child(1) th {
  border-top: 1px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8;
}

body#goldcard #pickup table thead tr:nth-child(1) th:first-child { border-left: 1px solid #e8e8e8; border-radius: 3vw 0 0 0; }
body#goldcard #pickup table thead tr:nth-child(1) th:last-child { border-right: 1px solid #e8e8e8; border-radius: 0 3vw 0 0; }

body#goldcard #pickup table thead tr:nth-child(1) th span:nth-child(1) {
  display: block;
  color: #4a5568;
  font-size: var(--fs-small);
  font-weight: 900;
  line-height: 1.4;
}

body#goldcard #pickup table thead tr:nth-child(1) th span:nth-child(2) {
  display: block;
  margin-top: 1vw;
  color: #1d2a3a;
  font-size: var(--fs-2xlarge-plus);
  font-weight: 900;
  line-height: 1.45;
}

body#goldcard #pickup table thead tr:nth-child(2) th span {
  width: fit-content;
  max-width: 94%;
  min-height: 7.8vw;
  margin: 0 auto 2.4vw;
  padding: 1.5vw 3vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #e8b534;
  border-radius: 999px;
  background: #fff;
  color: #f97316;
  font-size: var(--fs-small);
  font-weight: 900;
  line-height: 1.35;
}

body#goldcard #pickup table thead tr:nth-child(2) th img {
  width: 45vw;
  margin: 0 auto 3vw auto;
  display: block;
  border-radius: 2.4vw;
  box-shadow: 0 1.8vw 4vw rgba(0, 0, 0, .12);
}

/* 券面セル（thead 2行目）の表端にも縦罫線を付与し、他の行と罫線を揃える */
body#goldcard #pickup table thead tr:nth-child(2) th:first-child { border-left: 1px solid #e8e8e8; }
body#goldcard #pickup table thead tr:nth-child(2) th:last-child { border-right: 1px solid #e8e8e8; }

body#goldcard #pickup table thead tr:nth-child(3) th {
  padding: 3vw 2vw 3.4vw;
  border-bottom: 1px solid #e8e8e8;
}

body#goldcard #pickup table thead tr:nth-child(3) th:first-child { border-left: 1px solid #e8e8e8; }
body#goldcard #pickup table thead tr:nth-child(3) th:last-child { border-right: 1px solid #e8e8e8; }

body#goldcard #pickup table thead tr:nth-child(3) th a {
  min-width: 32vw;
  min-height: 8.6vw;
  padding: 0 4vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d8c79f;
  border-radius: 999px;
  background: #fff;
  color: #1d2a3a;
  font-size: var(--fs-base);
  font-weight: 900;
}

body#goldcard #pickup table thead tr:nth-child(3) th a::after {
  content: "";
  margin-left: 1.5vw;
  color: #f2a900;
}

body#goldcard #pickup table tbody[data-comparison="1"],
body#goldcard #pickup table tbody[data-comparison="2"],
body#goldcard #pickup table tbody[data-comparison="3"],
body#goldcard #pickup table tbody[data-comparison="4"],
body#goldcard #pickup table tbody[data-comparison="5"],
body#goldcard #pickup table tbody[data-comparison="6"] {
  display: none;
}

body#goldcard #pickup table tbody td {
  border-bottom: 1px solid #e8e8e8;
  background: #fff;
}
body#goldcard #pickup table tbody td:first-child { border-left: 1px solid #e8e8e8; }
body#goldcard #pickup table tbody td:last-child { border-right: 1px solid #e8e8e8; }

body#goldcard #pickup table tbody td > div {
  min-height: 23vw;
  padding: 3vw;
  /*display: grid;
  gap: 1.2vw;*/
}

body#goldcard #pickup table tbody td > div > span:nth-child(1) {
  display: block;
  color: #687385;
  font-size: var(--fs-xs-plus);
  font-weight: 900;
  line-height: 1.45;
}

body#goldcard #pickup table tbody td > div > span:nth-child(2) {
  color: #1d2a3a;
  font-size: var(--fs-base-plus);
  font-weight: 800;
  line-height: 1.6;
}

body#goldcard #pickup table tbody td > div > span:nth-child(3) {
  color: #4a5568;
  font-size: var(--fs-xs);
  font-weight: 600;
  line-height: 1.65;
}

body#goldcard #pickup .clear-conditions {
  position: absolute;
  right: 4vw;
  top: 13vw;
}

body#goldcard #pickup .clear-conditions a {
  padding: 1.4vw 3vw;
  display: inline-flex;
  border: 1px solid #e8e8e8;
  border-radius: 999px;
  background: #fff;
  color: #687385;
  font-size: var(--fs-small);
  font-weight: 800;
}

body#goldcard #pickup + div {
  margin-top: 3.4vw;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.4vw;
  flex-wrap: wrap;
}

body#goldcard #pickup + div span {
  color: #1d2a3a;
  font-size: var(--fs-base);
  font-weight: 900;
}

body#goldcard #pickup + div a {
  min-width: 32vw;
  min-height: 9vw;
  padding: 0 4vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: linear-gradient(135deg, rgb(6, 29, 85) 0%, rgb(11, 52, 120) 100%);
  color: #fff;
  font-size: var(--fs-base);
  font-weight: 900;
}

body#goldcard #pickup + div a::after {
content: "";
margin-left: 1.5vw;
font-size: var(--fs-small);
line-height: 1;
width: 3.8vw;
height: 3.8vw;
-webkit-mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; background-color: var(--icon-white);
}

/* Product list */
body#goldcard #items,
body#goldcard #article,
body#goldcard #supervisor-comment {
  margin: 10vw 4vw 0 4vw;
}

body#goldcard #items > h2,
body#goldcard .cc-sectionTitle {
  margin: 0;
  color: #1d2a3a;
  font-size: var(--fs-page-title);
  line-height: 1.45;
  font-weight: 900;
  text-align: center;
}

body#goldcard #items > h2::after,
body#goldcard .cc-sectionTitle::after {
  content: "";
  width: 12vw;
  height: .8vw;
  margin: 2.4vw auto 0;
  display: block;
  border-radius: 999px;
  background: #f2a900;
}

body#goldcard #items > span,
body#goldcard .cc-sectionLead {
  margin: 3vw auto 0;
  display: block;
  color: #4a5568;
  font-size: var(--fs-medium-plus);
  font-weight: 700;
  line-height: 1.9;
  text-align: center;
}

body#goldcard #items > ul {
  margin: 6vw 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 4vw;
}

body#goldcard #items > ul > li {
  padding: 4vw;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 2.2vw;
  row-gap: 0;
  align-content: start;
  border: 1px solid #e8e8e8;
  border-radius: 4.5vw;
  background: #fff;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}

/* SP: spec list flows as a single 2-column grid so the first item (入会特典) can be
   full width while everything from the 2nd item on lines up two per row.
   These rows span both columns. */
body#goldcard #items > ul > li > div,
body#goldcard #items > ul > li > span.application,
body#goldcard #items > ul > li > span.prText {
  grid-column: 1 / -1;
}

body#goldcard #items > ul > li > div {
  display: flex;
  flex-direction: column;
}

body#goldcard #items > ul > li > div > span {
  display: block;
}

body#goldcard #items > ul > li > div > span:nth-of-type(4) {
  order: -1;
}

body#goldcard #items > ul > li > div > span:nth-of-type(4) img {
  width: 58vw;
  margin: 0 auto 4vw;
  display: block;
  border-radius: 2.4vw;
  box-shadow: 0 1.8vw 4vw rgba(0, 0, 0, .10);
}

body#goldcard #items > ul > li > div > span:nth-of-type(1) {
  color: #4a5568;
  font-size: var(--fs-small-plus);
  font-weight: 900;
  line-height: 1.45;
}

body#goldcard #items > ul > li > div > span:nth-of-type(2) {
  margin-top: 1vw;
  color: #1d2a3a;
  font-size: var(--fs-heading-xlarge);
  font-weight: 900;
  line-height: 1.45;
}

body#goldcard #items > ul > li > div > span:nth-of-type(3) {
  width: fit-content;
  margin-top: 2.4vw;
  padding: 1.7vw 3vw;
  border: 2px solid #e8b534;
  border-radius: 999px;
  background: #fff;
  color: #f97316;
  font-size: var(--fs-small);
  font-weight: 900;
  line-height: 1.35;
}

body#goldcard #items > ul > li > span.application {
  order: 1;
  margin-top: auto;
  padding-top: 4vw;
}

body#goldcard #items > ul > li > span.application a {
  min-height: 10vw;
  width: 100%;
  padding: 0 4vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d8c79f;
  border-radius: 999px;
  background: #fff;
  color: #1d2a3a;
  font-size: var(--fs-medium);
  font-weight: 900;
}

body#goldcard #items > ul > li > span.application a::after {
  content: "";
  margin-left: 1.8vw;
  color: #f2a900;
}

body#goldcard #items > ul > li > dl {
  display: contents;
}

body#goldcard #items > ul > li > dl > div {
  margin-top: 2.2vw;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

/* 入会特典 (first spec item) spans the full width; keep the original gap above it */
body#goldcard #items > ul > li > dl.column2 > div:first-child {
  grid-column: 1 / -1;
  margin-top: 4vw;
}

body#goldcard #items > ul > li > dl dt {
  padding: 2vw;
  border: 1px solid #e8e8e8;
  border-radius: 2.2vw 2.2vw 0 0;
  background: #f8f3e8;
  color: #4a5568;
  font-size: var(--fs-xs);
  font-weight: 900;
  line-height: 1.45;
  text-align: center;
}

body#goldcard #items > ul > li > dl dd {
  flex: 1 1 auto;
  min-height: 12vw;
  margin: 0;
  padding: 2.3vw;
  border: 1px solid #e8e8e8;
  border-top: 0;
  border-radius: 0 0 2.2vw 2.2vw;
  background: #fff;
  color: #1d2a3a;
  font-size: var(--fs-small);
  font-weight: 800;
  line-height: 1.55;
  text-align: center;
}
/* 文字修飾 */
#items em {
  color: #f97316;
  font-weight: bold;
  font-style: normal;
}
#items .underline { text-decoration: underline; }
#items .bold { font-weight: bold; }
#items .fs-large { font-size: var(--fs-scale-large); }
#items .fs-medium { font-size: var(--fs-scale-medium); }
/* --------------------------------------------------------------------------
  Modal
   -------------------------------------------------------------------------- */
body#goldcard #items > ul > li > dl dd a.modal-open {
  margin-left: 1vw;
  color: #0b3478;
  font-size: var(--fs-xs);
  font-weight: 900;
  text-decoration: underline;
}
body#goldcard #items > ul > li > span.prText {
  margin-top: 3.5vw;
  padding: 3vw;
  border-radius: 2.4vw;
  background: #fffaf0;
  color: #4a5568;
  font-size: var(--fs-base);
  font-weight: normal;
  line-height: 1.4;
}
/* 文字修飾 */
body#goldcard #items em {
  color: #f97316;
  font-weight: bold;
  font-style: normal;
}
body#goldcard #items .underline { text-decoration: underline; }
body#goldcard #items .bold { font-weight: bold; }
body#goldcard #items .fs-large { font-size: var(--fs-scale-large); }
body#goldcard #items .fs-medium { font-size: var(--fs-scale-medium); }

/* --------------------------------------------------------------------------
  Modal
   -------------------------------------------------------------------------- */
#items div.modal { 
  width: 90vw;
  color: #1d2a3a;
  font-size: var(--fs-medium);
  font-weight: normal;}
.modal div.modal-close {
  position: absolute;
	top: 2vw;
	right: 2vw;
  font-size: var(--fs-modal-close);
}
#items div.modal > div > span {
  display: block;
  text-align: left;
}
#items div.modal > div > span:nth-of-type(1) {
  margin-bottom: 10px;
  color: #1d2a3a;
  font-size: var(--fs-2xlarge);
  font-weight: 900;
}
#items div.modal > div > span:nth-of-type(2) {
  margin-bottom: 8px;
  color: #f97316;
  font-weight: bold;
}

/* --------------------------------------------------------------------------
 Article (reading content — shared styles for gold & platinum)
 -------------------------------------------------------------------------- */

body#goldcard #article {
  padding-top: 10vw;
  border-top: 1px solid rgba(216, 199, 159, .45);
}
body#goldcard .cc-outline,
body#platinumcard .cc-outline {
  margin: 6vw auto 0;
  display: grid;
  gap: 4vw;
}
body#goldcard .cc-pointBox,
body#goldcard .cc-articleBox,
body#platinumcard .cc-pointBox,
body#platinumcard .cc-articleBox {
  padding: 4.5vw;
  border: 1px solid #e8e8e8;
  border-radius: 4vw;
  background: #fff;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}
body#goldcard .cc-pointBox__title,
body#goldcard .cc-articleBox__title,
body#platinumcard .cc-pointBox__title,
body#platinumcard .cc-articleBox__title {
  margin: 0 0 3vw;
  color: #1d2a3a;
  font-size: var(--fs-4xlarge);
  font-weight: 900;
}
body#goldcard .cc-pointList,
body#goldcard .cc-articleList,
body#platinumcard .cc-pointList,
body#platinumcard .cc-articleList {
  margin: 0;
  padding: 0;
  list-style: none;
}
body#goldcard .cc-pointList,
body#platinumcard .cc-pointList {
  display: grid;
  gap: 3vw;
}
body#goldcard .cc-pointList li {
  display: grid;
  grid-template-columns: 6.5vw 1fr;
  gap: 2.2vw;
  color: #4a5568;
  font-size: var(--fs-medium);
  font-weight: 700;
  line-height: 1.75;
}
body#goldcard .cc-icon,
body#platinumcard .cc-icon {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
line-height: 1;
background-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
background-position: center; -webkit-mask-position: center; mask-position: center;
background-size: contain; -webkit-mask-size: contain; mask-size: contain;
}
body#goldcard .cc-icon--check-circle {
width: 5.5vw;
height: 5.5vw;
margin-top: .5vw;
border-radius: 50%;
background: #fff4d6;
color: #f97316;
font-size: var(--fs-base);
font-weight: 900;
background-image: url("../../images/special/creditcard/icons/check-circle-gold.svg");
}
body#goldcard .cc-icon--check-circle::before,
body#platinumcard .cc-icon--check-circle::before { content: ""; }
body#goldcard .cc-icon--chevron-right::before,
body#platinumcard .cc-icon--chevron-right::before { content: ""; }
body#goldcard .cc-icon--external::before,
body#platinumcard .cc-icon--external::before { content: ""; }
body#goldcard .cc-articleList,
body#platinumcard .cc-articleList {
  display: grid;
  gap: 2.4vw;
}
body#goldcard .cc-articleList a,
body#platinumcard .cc-articleList a {
  min-height: 12vw;
  padding: 3vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 3vw;
  border: 1px solid #e8e8e8;
  border-radius: 2.2vw;
  background: #fff;
  color: #1d2a3a;
  font-size: var(--fs-medium);
  font-weight: 800;
  line-height: 1.5;
}
body#goldcard .cc-articleList a .cc-icon,
body#platinumcard .cc-articleList a .cc-icon {
  color: #f2a900;
  font-size: var(--fs-section-title);
}
body#goldcard .cc-articleBody,
body#platinumcard .cc-articleBody {
  margin: 7vw auto 0;
  display: grid;
  gap: 5vw;
}

body#goldcard .cc-articleSection,
body#platinumcard .cc-articleSection {
  padding: 5.5vw 4.5vw;
  border: 1px solid #e8e8e8;
  border-radius: 4.6vw;
  background: #fff;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
  scroll-margin-top: 18vw;
}
body#goldcard .cc-articleSection__header,
body#platinumcard .cc-articleSection__header {
  margin-bottom: 4vw;
}
body#goldcard .cc-articleSection__label,
body#platinumcard .cc-articleSection__label {
  margin: 0 0 2.2vw;
  color: #f97316;
  font-size: var(--fs-small);
  font-weight: 900;
  letter-spacing: .12em;
}
body#goldcard .cc-articleSection__title,
body#goldcard .cc-articleSummary__title,
body#platinumcard .cc-articleSection__title,
body#platinumcard .cc-articleSummary__title {
  margin: 0;
  color: #1d2a3a;
  font-size: var(--fs-article-title);
  line-height: 1.52;
  font-weight: 900;
}
body#goldcard .cc-articleSection__lead,
body#platinumcard .cc-articleSection__lead {
  margin: 3.4vw 0 0;
  color: #4a5568;
  font-size: var(--fs-large);
  font-weight: 800;
  line-height: 1.9;
}
body#goldcard .cc-articleSection__text,
body#goldcard .cc-longReadItem__text,
body#platinumcard .cc-articleSection__text,
body#platinumcard .cc-longReadItem__text {
  display: grid;
  gap: 3.4vw;
}
body#goldcard .cc-articleSection__text p,
body#goldcard .cc-longReadItem__text p,
body#goldcard .cc-articleSummary__text p,
body#goldcard .cc-faqItem__answer p,
body#platinumcard .cc-articleSection__text p,
body#platinumcard .cc-longReadItem__text p,
body#platinumcard .cc-articleSummary__text p,
body#platinumcard .cc-faqItem__answer p {
  margin: 0;
  color: #4a5568;
  font-size: var(--fs-medium-plus);
  font-weight: normal;
  line-height: 2;
}
body#goldcard .cc-readCardGrid,
body#platinumcard .cc-readCardGrid {
  margin-top: 4vw;
  display: grid;
  gap: 3vw;
}
body#goldcard .cc-readCard,
body#platinumcard .cc-readCard {
  padding: 4vw;
  border: 1px solid #e8e8e8;
  border-radius: 3vw;
  background: #f8f3e8;
}
body#goldcard .cc-readCard__title,
body#platinumcard .cc-readCard__title {
  margin: 0;
  color: #1d2a3a;
  font-size: var(--fs-xlarge);
  font-weight: 900;
  line-height: 1.55;
}
body#goldcard .cc-readCard__text,
body#platinumcard .cc-readCard__text {
  margin: 2vw 0 0;
  color: #4a5568;
  font-size: var(--fs-base);
  font-weight: 700;
  line-height: 1.85;
}
body#goldcard .cc-articleSection--longRead,
body#platinumcard .cc-articleSection--longRead {
  padding: 0;
  overflow: hidden;
}
body#goldcard .cc-articleSection--longRead > .cc-articleSection__header,
body#platinumcard .cc-articleSection--longRead > .cc-articleSection__header {
  margin: 0;
  padding: 5.5vw 4.5vw;
  border-bottom: 1px solid #e8e8e8;
  background: linear-gradient(135deg, #fff4d6 0%, #fff 76%);
}
body#goldcard .cc-longReadList,
body#platinumcard .cc-longReadList {
  display: grid;
}
body#goldcard .cc-longReadItem,
body#platinumcard .cc-longReadItem {
  padding: 5.5vw 4.5vw;
  display: grid;
  grid-template-columns: 12vw minmax(0, 1fr);
  gap: 3.5vw;
  border-top: 1px solid #e8e8e8;
  background: #fff;
}
body#goldcard .cc-longReadItem:first-child,
body#platinumcard .cc-longReadItem:first-child {
  border-top: 0;
}
body#goldcard .cc-longReadItem:nth-child(even),
body#platinumcard .cc-longReadItem:nth-child(even) {
  background: #fcfaf5;
}
body#goldcard .cc-longReadItem__number,
body#platinumcard .cc-longReadItem__number {
  width: 11vw;
  height: 11vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 3vw;
  background: #fff4d6;
  color: #f97316;
  font-size: var(--fs-large);
  font-weight: 900;
}
body#goldcard .cc-longReadItem__title,
body#platinumcard .cc-longReadItem__title {
  margin: 0;
  color: #1d2a3a;
  font-size: var(--fs-heading-medium);
  line-height: 1.55;
  font-weight: 900;
}
body#goldcard .cc-longReadItem__summary,
body#platinumcard .cc-longReadItem__summary {
  margin: 3vw 0 0;
  padding: 3vw;
  border-radius: 2.2vw;
  background: #fff4d6;
  color: #1d2a3a;
  font-size: var(--fs-medium);
  font-weight: 900;
  line-height: 1.75;
}
body#goldcard .cc-longReadItem__text,
body#platinumcard .cc-longReadItem__text {
  margin-top: 4vw;
}
body#goldcard .cc-longReadNote,
body#platinumcard .cc-longReadNote {
  margin-top: 4vw;
  padding: 3.5vw;
  border-left: 1vw solid #f2a900;
  border-radius: 2.2vw;
  background: #fff4d6;
}
body#goldcard .cc-longReadNote__title,
body#platinumcard .cc-longReadNote__title {
  margin: 0 0 1.5vw;
  color: #1d2a3a;
  font-size: var(--fs-medium);
  font-weight: 900;
}
body#goldcard .cc-longReadNote p,
body#platinumcard .cc-longReadNote p {
  margin: 0;
  color: #4a5568;
  font-size: var(--fs-base);
  font-weight: 800;
  line-height: 1.85;
}
body#goldcard .cc-faqList,
body#platinumcard .cc-faqList {
  display: grid;
  gap: 2.8vw;
}
body#goldcard .cc-faqItem,
body#platinumcard .cc-faqItem {
  border: 1px solid #e8e8e8;
  border-radius: 3vw;
  background: #f8f3e8;
  overflow: hidden;
}
body#goldcard .cc-faqItem summary,
body#platinumcard .cc-faqItem summary {
  min-height: 13vw;
  padding: 3.5vw 4vw;
  cursor: pointer;
  color: #1d2a3a;
  font-size: var(--fs-large);
  font-weight: 900;
  line-height: 1.6;
}
body#goldcard .cc-faqItem__answer,
body#platinumcard .cc-faqItem__answer {
  padding: 0 4vw 4vw;
  /* CHAPTER6 FAQ: open/close is driven by jQuery (summary click -> slideToggle).
     Start closed here; jQuery reveals via inline display. */
  display: none;
}
/* The jQuery handler calls preventDefault, so <details> never gets [open] and the
   browser keeps the panel collapsed no matter what display jQuery sets. Disable that
   native collapse so jQuery's slideToggle fully controls visibility. */
body#goldcard .cc-faqItem::details-content,
body#platinumcard .cc-faqItem::details-content {
  content-visibility: visible;
}
body#goldcard .cc-articleSummary,
body#platinumcard .cc-articleSummary {
  border-color: #d8c79f;
  background: linear-gradient(135deg, #fff4d6 0%, #fff 74%);
}
body#goldcard .cc-articleSummary__text,
body#platinumcard .cc-articleSummary__text {
  margin-top: 3.5vw;
  display: grid;
  gap: 3.4vw;
}

/* --------------------------------------------------------------------------
   FV condition switcher: preact HTML structure
   -------------------------------------------------------------------------- */

body#goldcard .clear-conditions {
  display: none;
}

body#goldcard ul.comparison-switcher {
  margin: 0;
  padding: 0;
  list-style: none;
}

body#goldcard #comparison-switcher {
  position: relative;
  margin: 5.2vw 4vw 0 4vw;
  padding: 4vw;
  border: 1px solid #e8e8e8;
  border-radius: 5.4vw;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}

body#goldcard #comparison-switcher > span {
  display: block;
}

body#goldcard #comparison-switcher > span:first-child {
  display: flex;
  align-items: center;
  gap: 2vw;
  margin: 0;
  /*padding-right: 21vw;*/
  color: #1d2a3a;
  font-size: var(--fs-large);
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: -0.05em;
}

body#goldcard #comparison-switcher > span:first-child::before {
  content: "";
  width: 2vw;
  height: 2vw;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #f2a900;
  box-shadow: 0 0 0 1.2vw rgba(242, 169, 0, .16);
}

body#goldcard #comparison-switcher > span.clear-conditions {
  position: absolute;
  right: 3.4vw;
  top: 3.4vw;
  margin: 0;
}

body#goldcard #comparison-switcher > span.clear-conditions a {
  padding: 1.4vw 3vw;
  border: 1px solid #e8e8e8;
  border-radius: 999px;
  background: #fff;
  color: #687385;
  font-size: var(--fs-small);
  font-weight: 800;
  line-height: 1.3;
}

body#goldcard #comparison-switcher > span:nth-of-type(3) {
  margin-top: 1.6vw;
  color: #687385;
  font-size: var(--fs-small);
  font-weight: 700;
  line-height: 1.7;
}

body#goldcard #comparison-switcher > div {
  margin-top: 3vw;
}

body#goldcard #comparison-switcher > div > ul.comparison-switcher:first-of-type {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.4vw;
}

body#goldcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li:not([data-comparison="0"]) a {
  position: relative;
  min-height: 16vw;
  padding: 2.5vw 3vw 2.5vw 14.5vw;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 3.4vw;
  background: #fff;
  color: #1d2a3a;
  text-align: left;
  box-shadow: 0 2vw 4.4vw rgba(29, 42, 58, .05);
}

body#goldcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li:not([data-comparison="0"]) a::before {
  position: absolute;
  left: 3vw;
  top: 50%;
  width: 9vw;
  height: 9vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 2.7vw;
  background: #fff4d6;
  color: #0a2463;
  transform: translateY(-50%);
  font-size: var(--fs-2xlarge);
}

body#goldcard #comparison-switcher li.wallet a::before { content: ""; }
body#goldcard #comparison-switcher li.gift a::before { content: ""; }
body#goldcard #comparison-switcher li.point a::before { content: ""; }

body#goldcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a > span:nth-of-type(1) {
  color: #1d2a3a;
  font-size: var(--fs-medium);
  font-weight: 900;
  line-height: 1.45;
}

body#goldcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a > span:nth-of-type(2) {
  margin-top: .6vw;
  color: #4a5568;
  font-size: var(--fs-xs);
  font-weight: 700;
  line-height: 1.55;
}

body#goldcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.selected a {
  border-color: #f2a900;
  background: #fff4d6;
}

body#goldcard #fv #comparison-switcher-more {
width: fit-content;
margin: 3vw auto 0;
display: flex;
align-items: center;
justify-content: center;
gap: 1.5vw;
color: #0b3478;
font-size: var(--fs-small);
font-weight: 900;
line-height: 1.5;
}


body#goldcard #comparison-switcher-more + ul.comparison-switcher {
  display: none;
  margin: 2.6vw 0 0;
  padding: 2.4vw;
  border: 1px dashed #d8c79f;
  border-radius: 3.4vw;
  background: #fff;
}

body#goldcard #comparison-switcher-more + ul.comparison-switcher li {
  display: inline-block;
  margin: 1vw .8vw 1vw 0;
}

body#goldcard #comparison-switcher-more + ul.comparison-switcher li a {
  min-height: 8.8vw;
  padding: 0 3.6vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 999px;
  background: #fffaf0;
  color: #1d2a3a;
  font-size: var(--fs-small);
  font-weight: 900;
  line-height: 1.3;
}

body#goldcard #comparison-switcher-more + ul.comparison-switcher li.selected a {
  border-color: #f2a900;
  background: #fff4d6;
}

body#goldcard #comparison-switcher + a {
  min-height: 20vw;
  margin: 4vw 4vw 0 4vw;
  padding: 3.4vw 10vw 3.4vw 18vw;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 4vw;
  background: #fff;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
  color: #1d2a3a;
}

body#goldcard #comparison-switcher + a::before {
  content: "";
  position: absolute;
  left: 4vw;
  top: 50%;
  width: 11vw;
  height: 11vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3vw;
  background: #fff4d6;
  transform: translateY(-50%);
  font-size: var(--fs-heading-small);
}

body#goldcard #comparison-switcher + a::after {
  content: "";
  position: absolute;
  right: 4vw;
  top: 50%;
  transform: translateY(-50%);
  color: #f2a900;
  font-size: var(--fs-icon-large);
}

body#goldcard #comparison-switcher + a span:nth-child(1) {
  color: #1d2a3a;
  font-size: var(--fs-medium-plus);
  font-weight: 900;
}

body#goldcard #comparison-switcher + a span:nth-child(n+2) {
  margin-top: .5vw;
  color: #4a5568;
  font-size: var(--fs-small);
  font-weight: 700;
  line-height: 1.45;
}

body#goldcard #pickup table tbody tr.emphasis td > div {
  background: linear-gradient(180deg, #fffaf0 0%, #fff 100%);
}

body#goldcard #pickup table tbody tr.emphasis td > div > span:nth-child(1) {
  display: block;
  color: #d88900;
}

body#goldcard #pickup table thead tr:nth-child(3) th a,
body#goldcard #items > ul > li > span.application a {
  border-color: rgb(6, 29, 85);
  background: linear-gradient(135deg, rgb(6, 29, 85) 0%, rgb(11, 52, 120) 100%);
  color: #fff;
  font-size: var(--fs-small);
  box-shadow: 0 2.4vw 4.8vw rgba(6, 29, 85, .18);
}

body#goldcard #pickup table thead tr:nth-child(3) th a::before,
body#goldcard #items > ul > li > span.application a::before {
  content: none;
  color: #fff;
  font-size: var(--fs-medium);
  font-weight: 900;
  line-height: 1;
display: none;
}

body#goldcard #pickup table thead tr:nth-child(3) th a::after,
body#goldcard #items > ul > li > span.application a::after {
color: #fff;
font-size: var(--fs-small);
content: "";
width: 3.8vw;
height: 3.8vw;
margin-left: .55em;
display: inline-block;
-webkit-mask: url("../../images/special/creditcard/icons/external.svg") center / contain no-repeat; mask: url("../../images/special/creditcard/icons/external.svg") center / contain no-repeat; background-color: var(--icon-white);
}
/* Initial state for condition reset links; jQuery shows these after a condition is selected. */
body#goldcard #fv .clear-conditions {
  display: none;
}
body#goldcard #items > ul > li > div + span.application {
  order: 0;
  margin-top: 4vw;
  padding-top: 0;
}


/* --------------------------------------------------------------------------
   Credit card SVG icons and comparison glow effect
   -------------------------------------------------------------------------- */


body#goldcard #comparison-switcher-2 li a::before,
body#goldcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li:not([data-comparison="0"]) a::before {
  content: "";
  background-color: #fff4d6;
  background-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  background-position: center; -webkit-mask-position: center; mask-position: center;
  background-size: 5.6vw 5.6vw; -webkit-mask-size: 5.6vw 5.6vw; mask-size: 5.6vw 5.6vw;
}
body#goldcard #comparison-switcher-2 li.wallet a::before,
body#goldcard #comparison-switcher li.wallet a::before { -webkit-mask-image: url("../../images/special/creditcard/icons/wallet.svg"); mask-image: url("../../images/special/creditcard/icons/wallet.svg"); background-color: var(--icon-gold); }
body#goldcard #comparison-switcher-2 li.gift a::before,
body#goldcard #comparison-switcher li.gift a::before { -webkit-mask-image: url("../../images/special/creditcard/icons/gift.svg"); mask-image: url("../../images/special/creditcard/icons/gift.svg"); background-color: var(--icon-gold); }
body#goldcard #comparison-switcher-2 li.point a::before,
body#goldcard #comparison-switcher li.point a::before { -webkit-mask-image: url("../../images/special/creditcard/icons/point.svg"); mask-image: url("../../images/special/creditcard/icons/point.svg"); background-color: var(--icon-gold); }
body#goldcard #comparison-switcher-2 li.lounge a::before,
body#goldcard #comparison-switcher li.lounge a::before { -webkit-mask-image: url("../../images/special/creditcard/icons/lounge.svg"); mask-image: url("../../images/special/creditcard/icons/lounge.svg"); background-color: var(--icon-gold); }
body#goldcard #comparison-switcher-2 li.family a::before,
body#goldcard #comparison-switcher li.family a::before { -webkit-mask-image: url("../../images/special/creditcard/icons/family.svg"); mask-image: url("../../images/special/creditcard/icons/family.svg"); background-color: var(--icon-gold); }
body#goldcard #comparison-switcher-2 li.conditions a::before,
body#goldcard #comparison-switcher li.conditions a::before { -webkit-mask-image: url("../../images/special/creditcard/icons/conditions.svg"); mask-image: url("../../images/special/creditcard/icons/conditions.svg"); background-color: var(--icon-gold); }
body#goldcard #comparison-switcher-2 + a::before,
body#goldcard #comparison-switcher + a::before {
  content: "";
  background: #fff4d6 url("../../images/special/creditcard/icons/book-gold.svg") no-repeat center / 6.3vw 6.3vw;
}
body#goldcard #comparison-switcher-2 + a::after,
body#goldcard #comparison-switcher + a::after {
  content: "";
  width: 4.8vw;
  height: 4.8vw;
  -webkit-mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; background-color: var(--icon-gold);
  font-size: var(--fs-small);
}


body#goldcard .cc-icon::before { content: "" !important; }


body#goldcard .cc-icon--chevron-right { -webkit-mask-image: url("../../images/special/creditcard/icons/chevron-right.svg"); mask-image: url("../../images/special/creditcard/icons/chevron-right.svg"); background-color: var(--icon-gold); }
body#goldcard .cc-icon--external { -webkit-mask-image: url("../../images/special/creditcard/icons/external.svg"); mask-image: url("../../images/special/creditcard/icons/external.svg"); background-color: var(--icon-gold); }
body#goldcard #pickup table tbody[data-comparison="7"],
body#goldcard #pickup table tbody[data-comparison="8"] { display: none; }
body#goldcard #pickup.is-highlight {
  animation: ccGoldPickupGlow .72s ease-out;
}
@keyframes ccGoldPickupGlow {
  0% { box-shadow: 0 18px 50px rgba(29, 42, 58, .10), 0 0 0 0 rgba(232, 181, 52, .82); }
  45% { box-shadow: 0 18px 50px rgba(29, 42, 58, .10), 0 0 0 2.1vw rgba(232, 181, 52, .38), 0 0 8vw rgba(232, 181, 52, .34); }
  100% { box-shadow: 0 18px 50px rgba(29, 42, 58, .10), 0 0 0 0 rgba(232, 181, 52, 0); }
}


/* --------------------------------------------------------------------------
   Platinum card page: SP base styles
   -------------------------------------------------------------------------- */

body#platinumcard {
background: #05080f;
color: #f8f9fb;
font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", YuGothic, Meiryo, sans-serif;
--platinum-accent: #108b74;
--platinum-accent-2: #1aa488;
--platinum-orange: #ff7043;
--platinum-gray-bg: #f5f6f8;
}

body#platinumcard * {
  box-sizing: border-box;
}

body#platinumcard img {
  max-width: 100%;
  height: auto;
}

body#platinumcard a {
  text-decoration: none;
}

body#platinumcard #maincontents {
  width: 100%;
  margin: 0 auto;
  padding: 0 0 0 0;
}

/* First view */
body#platinumcard #fv {
display: flex;
flex-direction: column;
position: relative;
overflow: hidden;
margin: 0;
padding: 7vw 0 8vw 0;
border: 0;
border-radius: 0;
background: radial-gradient(circle at 75% 16%, rgba(30,224,196,.10), transparent 30%),
    linear-gradient(90deg, rgba(3,8,15,.94) 0%, rgba(3,8,15,.66) 48%, rgba(3,8,15,.94) 100%),
    url("../../images/special/creditcard/photos/bg_mv.webp") no-repeat,
    #05080f;
box-shadow: none;
border-color: rgba(255,255,255,.11);
background-size: 200vw; -webkit-mask-size: 200vw; mask-size: 200vw;
background-position: top -10vw right -75vw; -webkit-mask-position: top -10vw right -75vw; mask-position: top -10vw right -75vw;
}

body#platinumcard #fv::before {
content: "";
position: absolute;
z-index: 0;
width: 100%;
height: 100%;
right: 0;
top: 0;
background: linear-gradient(180deg, rgba(5,8,15,.82) 0%, rgba(5,8,15,.54) 100%),
    url("../../images/special/creditcard/photos/bg_mv.webp") no-repeat center / cover;
opacity: .62;
pointer-events: none;
left: auto;
display: none;
}

body#platinumcard #fv > div {
  position: relative;
  z-index: 1;
  min-width: 0;
}

/* Dissolve the left group on SP so ①②③ become flex items of #fv,
   then reorder to ①→④→②→③ (PC keeps grouped 2-column layout in css/w/). */
body#platinumcard #fv > .fv-left { display: contents; }
body#platinumcard #fv .fv-left > * { position: relative; z-index: 1; }
body#platinumcard #fv .fv-lead { order: 1; }
body#platinumcard #fv > .fv-pickup { order: 2; }
body#platinumcard #fv #comparison-switcher { order: 3; }
body#platinumcard #fv #comparison-switcher + a { order: 4; }

body#platinumcard #fv a,
body#platinumcard #fv span {
  /*display: inline-block;*/
}

body#platinumcard #fv h1 {
width: fit-content;
margin: 0;
min-height: 8.8vw;
display: inline-flex;
align-items: center;
padding: 0 6vw;
clip-path: polygon(0 0, calc(100% - 3vw) 0, 100% 50%, calc(100% - 3vw) 100%, 0 100%, 2vw 50%);
background: linear-gradient(90deg, #c7ccd4 0%, #f7f7f7 48%, #aeb4bd 100%);
color: #111820;
font-size: var(--fs-medium-plus);
font-weight: 900;
line-height: 1;
letter-spacing: .03em;
box-shadow: none;
}

body#platinumcard #fv h1 span {
  display: inline;
}

body#platinumcard #fv .fv-lead { margin: 0 4vw; }
body#platinumcard #fv .fv-lead > p:nth-of-type(1) {
margin: 4.6vw 0 0;
color: #fff;
font-size: var(--fs-fv-title-platinum);
font-weight: 600;
line-height: 1.26;
letter-spacing: -.04em;
font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
}

body#platinumcard #fv .fv-lead > p:nth-of-type(1) span {
  display: block;
}

body#platinumcard #fv .fv-lead > p:nth-of-type(1) span:nth-child(2) em {
color: transparent;
background: linear-gradient(180deg, #ffffff 0%, #c3c6ca 52%, #8e949b 100%);
-webkit-background-clip: text;
background-clip: text;
}

body#platinumcard #fv .fv-lead > p:nth-of-type(2) {
margin: 3.4vw 0 0;
color: rgba(255,255,255,.86);
font-size: var(--fs-large-plus);
font-weight: 700;
line-height: 1.8;
}

body#platinumcard #fv .fv-lead > p:nth-of-type(2) span {
  /*display: block;*/
}

body#platinumcard .comparison-switcher ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

body#platinumcard #comparison-switcher-1 {
margin-top: 5vw;
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
}

body#platinumcard #coparison-starter {
  position: relative;
  width: 100%;
  min-height: 13.5vw;
  padding: 0 11vw 0 15vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: linear-gradient(135deg, rgb(6, 29, 85) 0%, rgb(11, 52, 120) 100%);
  color: #fff;
  box-shadow: 0 4vw 8vw rgba(6, 29, 85, .26);
  font-size: var(--fs-xlarge);
  font-weight: 900;
  text-align: center;
}

body#platinumcard #coparison-starter::before {
content: "";
position: absolute;
left: 2vw;
top: 50%;
width: 9.5vw;
height: 9.5vw;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background: rgba(255, 255, 255, .95) url("../../images/special/creditcard/icons/search-emerald.svg") no-repeat center / 5vw 5vw;
transform: translateY(-50%);
font-size: var(--fs-2xlarge);
}

body#platinumcard #coparison-starter::after {
content: "";
position: absolute;
right: 4.5vw;
top: 50%;
transform: translateY(-50%);
font-size: var(--fs-small);
line-height: 1;
width: 5vw;
height: 5vw;
-webkit-mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; background-color: var(--icon-white);
}

body#platinumcard #comparison-switcher-1 > div {
display: none;
margin-top: 3vw;
padding: 3.4vw;
border: 1px solid #e8e8e8;
border-radius: 3.4vw;
background: rgba(4,14,22,.96);
border-color: rgba(255,255,255,.18);
}

body#platinumcard #comparison-switcher-1 > div::before {
  content: "比較したい条件を選択してください";
  display: block;
  margin: 0 0 2.4vw;
  color: #687385;
  font-size: var(--fs-small);
  font-weight: 900;
}

body#platinumcard #comparison-switcher-1 ul {
  display: flex;
  gap: 2vw;
  overflow-x: auto;
  padding-bottom: 1vw;
  -webkit-overflow-scrolling: touch;
}

body#platinumcard #comparison-switcher-1 li {
  flex: 0 0 auto;
}

body#platinumcard #comparison-switcher-1 li a {
  min-height: 9vw;
  padding: 0 4vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 999px;
  background: #fffaf0;
  color: #1d2a3a;
  font-size: var(--fs-small-plus);
  font-weight: 900;
  white-space: nowrap;
}

body#platinumcard #comparison-switcher-1 li.selected a {
  border-color: #f2a900;
  background: #fff4d6;
}

body#platinumcard #comparison-switcher-2 {
  padding: 0 4vw 4vw;
  border: 1px solid #e8e8e8;
  border-top: 0;
  border-radius: 0 0 5.4vw 5.4vw;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}

body#platinumcard #comparison-switcher-2 > span {
  display: flex;
  align-items: center;
  gap: 2vw;
  margin: 0 0 3vw;
  padding-top: 4vw;
  border-top: 1px solid #e8e8e8;
  color: #1d2a3a;
  font-size: var(--fs-large);
  font-weight: 900;
}

body#platinumcard #comparison-switcher-2 > span::before {
  content: "";
  width: 2vw;
  height: 2vw;
  border-radius: 50%;
  background: #f2a900;
  box-shadow: 0 0 0 1.2vw rgba(242, 169, 0, .16);
}

body#platinumcard #comparison-switcher-2 ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.4vw;
}

body#platinumcard #comparison-switcher-2 li a {
  min-height: 28vw;
  padding: 3vw 2vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 1px solid #e8e8e8;
  border-radius: 3vw;
  background: #fff;
  color: #1d2a3a;
  text-align: center;
}

body#platinumcard #comparison-switcher-2 li a::before {
  width: 9.6vw;
  height: 9.6vw;
  margin-bottom: 2.2vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3vw;
  background: #fff4d6;
  color: #0a2463;
  font-size: var(--fs-5xlarge);
}

body#platinumcard #comparison-switcher-2 li[data-comparison="1"] a::before { content: ""; }
body#platinumcard #comparison-switcher-2 li[data-comparison="2"] a::before { content: ""; }
body#platinumcard #comparison-switcher-2 li[data-comparison="3"] a::before { content: ""; }
body#platinumcard #comparison-switcher-2 li[data-comparison="4"] a::before { content: ""; }

body#platinumcard #comparison-switcher-2 li a > span:nth-of-type(1) {
  color: #1d2a3a;
  font-size: var(--fs-base);
  font-weight: 900;
  line-height: 1.4;
}

body#platinumcard #comparison-switcher-2 li a > span:nth-of-type(2) {
  margin-top: 1.3vw;
  color: #4a5568;
  font-size: var(--fs-xs);
  font-weight: 700;
  line-height: 1.55;
}

body#platinumcard #comparison-switcher-2 li.selected a {
  border-color: #f2a900;
  background: #fff4d6;
}

body#platinumcard #comparison-switcher-2 + a {
  min-height: 20vw;
  margin-top: 4vw;
  padding: 3.4vw 10vw 3.4vw 18vw;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 4vw;
  background: #fff;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
  color: #1d2a3a;
}

body#platinumcard #comparison-switcher-2 + a::before {
  content: "";
  position: absolute;
  left: 4vw;
  top: 50%;
  width: 11vw;
  height: 11vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3vw;
  background: #fff4d6;
  transform: translateY(-50%);
  font-size: var(--fs-heading-small);
}

body#platinumcard #comparison-switcher-2 + a::after {
  content: "";
  position: absolute;
  right: 4vw;
  top: 50%;
  transform: translateY(-50%);
  color: #f2a900;
  font-size: var(--fs-icon-large);
}

body#platinumcard #comparison-switcher-2 + a span:nth-child(1) {
  color: #1d2a3a;
  font-size: var(--fs-medium-plus);
  font-weight: 900;
}

body#platinumcard #comparison-switcher-2 + a span:nth-child(n+2) {
  margin-top: .5vw;
  color: #4a5568;
  font-size: var(--fs-small);
  font-weight: 700;
  line-height: 1.45;
}

/* Pickup */
body#platinumcard #fv > .fv-pickup {
  margin-top: 8vw;
  padding: 0 0 4vw 0;
  background-color: rgba(255,255,255,0.15);
}

body#platinumcard #pickup {
  position: relative;
  overflow: hidden;
  border: 1px solid #e8e8e8;
  border-radius: 0;
  background: rgba(3,8,15,.56);
  box-shadow: none;
  border-color: rgba(255,255,255,.20);
  backdrop-filter: blur(3px);
  border-width: 1px 0;
}

body#platinumcard #pickup h2 {
  margin: 0;
  padding: 5vw 5vw 1vw;
  color: #fff;
  font-size: var(--fs-6xlarge);
  line-height: 1.55;
  font-weight: bold;
  text-align: center;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
  letter-spacing: -0.08em;
}
body#platinumcard #pickup h2 em {
  font-style: normal;
  color: var(--platinum-orange);
}

body#platinumcard #pickup h2::after {
  content: "";
  width: 50vw;
  height: .8vw;
  margin: 2.2vw auto 0;
  display: block;
  border-radius: 999px;
  transform: scaleX(-1);
}

body#platinumcard #pickup > div {
  margin-top: 3.4vw;
  overflow-x: auto;
  padding: 0 4vw 4vw;
  -webkit-overflow-scrolling: touch;
}

body#platinumcard #pickup table {
  width: 100%;
  min-width: 230vw;
  border-radius: 4vw 4vw 0 0;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  background-color: rgba(0,0,0,0.5);
}

body#platinumcard #pickup table th,
body#platinumcard #pickup table td {
  vertical-align: top;
}

body#platinumcard #pickup table thead th {
  padding: 2vw 2vw 0;
  background: #fff;
  text-align: center;
}

body#platinumcard #pickup table thead th + th,
body#platinumcard #pickup table tbody td + td {
  border-left: 1px solid #e8e8e8;
}

body#platinumcard #pickup table thead tr:nth-child(1) th {
  border-top: 1px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8;
}

body#platinumcard #pickup table thead tr:nth-child(1) th:first-child { border-left: 1px solid #e8e8e8; border-radius: 3vw 0 0 0; }
body#platinumcard #pickup table thead tr:nth-child(1) th:last-child { border-right: 1px solid #e8e8e8; border-radius: 0 3vw 0 0; }

body#platinumcard #pickup table thead tr:nth-child(1) th span:nth-child(1) {
  display: block;
  color: #4a5568;
  font-size: var(--fs-small);
  font-weight: 900;
  line-height: 1.4;
}

body#platinumcard #pickup table thead tr:nth-child(1) th span:nth-child(2) {
  display: block;
  margin-top: 1vw;
  color: #1d2a3a;
  font-size: var(--fs-2xlarge-plus);
  font-weight: 900;
  line-height: 1.45;
}

body#platinumcard #pickup table thead tr:nth-child(2) th span {
width: fit-content;
max-width: 94%;
min-height: 7.8vw;
margin: 0 auto 2.4vw;
padding: 1.5vw 3vw;
display: inline-flex;
align-items: center;
justify-content: center;
border: 0;
border-radius: 2vw;
background: linear-gradient(180deg, #ffffff 0%, #e5e2dc 100%);
color: #111820;
font-size: var(--fs-small);
font-weight: 900;
line-height: 1.35;
border-color: #108b74;
}

body#platinumcard #pickup table thead tr:nth-child(2) th img {
  width: 45vw;
  margin: 0 auto;
  display: block;
  border-radius: 2.4vw;
  box-shadow: 0 1vw 5vw rgba(256,256,256, 0.5);
}

/* 券面セル（thead 2行目）の表端にも縦罫線を付与し、他の行と罫線を揃える */
body#platinumcard #pickup table thead tr:nth-child(2) th:first-child { border-left: 1px solid #e8e8e8; }
body#platinumcard #pickup table thead tr:nth-child(2) th:last-child { border-right: 1px solid #e8e8e8; }

body#platinumcard #pickup table thead tr:nth-child(3) th {
  padding: 3vw 2vw 3.4vw;
  border-bottom: 1px solid #e8e8e8;
}

body#platinumcard #pickup table thead tr:nth-child(3) th:first-child { border-left: 1px solid #e8e8e8; }
body#platinumcard #pickup table thead tr:nth-child(3) th:last-child { border-right: 1px solid #e8e8e8; }

body#platinumcard #pickup table thead tr:nth-child(3) th a {
  min-width: 32vw;
  min-height: 8.6vw;
  padding: 0 4vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 2em;
  background: #fff;
  color: #1d2a3a;
  font-size: var(--fs-base);
  font-weight: 900;
}

body#platinumcard #pickup table thead tr:nth-child(3) th a::after {
  content: "";
  margin-left: 1.5vw;
  color: #f2a900;
}

body#platinumcard #pickup table tbody[data-comparison="1"],
body#platinumcard #pickup table tbody[data-comparison="2"],
body#platinumcard #pickup table tbody[data-comparison="3"],
body#platinumcard #pickup table tbody[data-comparison="4"],
body#platinumcard #pickup table tbody[data-comparison="5"],
body#platinumcard #pickup table tbody[data-comparison="6"] {
  display: none;
}

body#platinumcard #pickup table tbody td {
  border-bottom: 1px solid #e8e8e8;
  background: #fff;
}
body#platinumcard #pickup table tbody td:first-child { border-left: 1px solid #e8e8e8; }
body#platinumcard #pickup table tbody td:last-child { border-right: 1px solid #e8e8e8; }

body#platinumcard #pickup table tbody td > div {
  min-height: 23vw;
  padding: 3vw;
  /*display: grid;
  gap: 1.2vw;*/
  background: rgba(255,255,255,.025);
}

body#platinumcard #pickup table tbody td > div > span:nth-child(1) {
  display: block;
  color: rgba(255,255,255,.72);
  font-size: var(--fs-base);
  font-weight: 900;
  line-height: 1.45;
}

body#platinumcard #pickup table tbody td > div > span:nth-child(2) {
color: rgba(255,255,255,.93);
font-size: var(--fs-medium);
font-weight: bold;
line-height: 1.4;
}

body#platinumcard #pickup table tbody td > div > span:nth-child(3) {
color: rgba(255,255,255,.68);
font-size: var(--fs-xs);
font-weight: 600;
line-height: 1.65;
}

body#platinumcard #pickup .clear-conditions {
  position: absolute;
  right: 4vw;
  top: 12vw;
}

body#platinumcard #pickup .clear-conditions a {
  padding: 1.4vw 3vw;
  display: inline-flex;
  border: 1px solid #e8e8e8;
  border-radius: 999px;
  background: #fff;
  color: #687385;
  font-size: var(--fs-small);
  font-weight: 800;
}

body#platinumcard #pickup + div {
  margin-top: 3.4vw;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.4vw;
  flex-wrap: wrap;
}

body#platinumcard #pickup + div span {
  color: #1d2a3a;
  font-size: var(--fs-base);
  font-weight: 900;
}

body#platinumcard #pickup + div a {
  min-width: 32vw;
  min-height: 9vw;
  padding: 0 4vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: linear-gradient(135deg, rgb(6, 29, 85) 0%, rgb(11, 52, 120) 100%);
  color: #fff;
  font-size: var(--fs-base);
  font-weight: 900;
}

body#platinumcard #pickup + div a::after {
content: "";
margin-left: 1.5vw;
font-size: var(--fs-small);
line-height: 1;
width: 3.8vw;
height: 3.8vw;
-webkit-mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; background-color: var(--icon-white);
}

/* Product list */
body#platinumcard #items,
body#platinumcard #article,
body#platinumcard #supervisor {
margin-top: 10vw;
padding: 6vw 4vw;
border-radius: 5vw;
background: #fff;
color: #1d2a3a;
box-shadow: 0 4vw 12vw rgba(0,0,0,.16);
}

body#platinumcard #items > h2,
body#platinumcard .cc-sectionTitle {
margin: 0;
color: #1d2a3a;
font-size: var(--fs-page-title);
line-height: 1.45;
font-weight: 900;
text-align: center;
}

body#platinumcard #items > h2::after,
body#platinumcard .cc-sectionTitle::after {
  content: "";
  width: 50vw;
  height: .8vw;
  margin: 2.4vw auto 0;
  display: block;
  border-radius: 999px;
  background: #f2a900;
}

body#platinumcard #items > span,
body#platinumcard .cc-sectionLead {
  margin: 3vw auto 0;
  display: block;
  color: #4a5568;
  font-size: var(--fs-medium-plus);
  font-weight: 700;
  line-height: 1.9;
  text-align: center;
}

body#platinumcard #items > ul {
  margin: 6vw 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 4vw;
}

body#platinumcard #items > ul > li {
  padding: 4vw;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 2.2vw;
  row-gap: 0;
  align-content: start;
  border: 2px solid rgba(256,256,256, 0.2);
  border-radius: 4.5vw;
  background: rgba(0,0,0,0.85);
  box-shadow: 0 3vw 10vw rgba(5,8,15,.12);
}

/* SP: spec list flows as a single 2-column grid so the first item (入会特典) can be
   full width while everything from the 2nd item on lines up two per row.
   These rows span both columns. */
body#platinumcard #items > ul > li > div,
body#platinumcard #items > ul > li > span.application,
body#platinumcard #items > ul > li > span.prText {
  grid-column: 1 / -1;
}

body#platinumcard #items > ul > li > div {
  display: flex;
  flex-direction: column;
}

body#platinumcard #items > ul > li > div > span {
  display: block;
}

body#platinumcard #items > ul > li > div > span:nth-of-type(4) {
  order: -1;
}

body#platinumcard #items > ul > li > div > span:nth-of-type(4) img {
  width: auto;
  max-width: 58vw;
  max-height: 40vw;
  margin: 0 auto 4vw;
  display: block;
  border-radius: 2.4vw;
  box-shadow: 0 1vw 5vw rgba(255,255,255, 0.5);
}

body#platinumcard #items > ul > li > div > span:nth-of-type(1) {
  color: #999;
  font-size: var(--fs-base);
  font-weight: 900;
  line-height: 1.45;
}

body#platinumcard #items > ul > li > div > span:nth-of-type(2) {
  margin-top: 1vw;
  color: #FFF;
  font-size: var(--fs-heading-xlarge);
  font-weight: 900;
  line-height: 1.45;
}

body#platinumcard #items > ul > li > div > span:nth-of-type(3) {
  width: fit-content;
  margin-top: 2.4vw;
  padding: 1.7vw 3vw;
  border: 2px solid #e8b534;
  border-radius: 999px;
  background: #fff;
  color: #f97316;
  font-size: var(--fs-small);
  font-weight: 900;
  line-height: 1.35;
}

body#platinumcard #items > ul > li > span.application {
  order: 1;
  margin-top: auto;
  padding-top: 4vw;
}

body#platinumcard #items > ul > li > span.application a {
  min-height: 10vw;
  width: 100%;
  padding: 0 4vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d8c79f;
  border-radius: 999px;
  background: #fff;
  color: #1d2a3a;
  font-size: var(--fs-medium);
  font-weight: 900;
}

body#platinumcard #items > ul > li > span.application a::after {
  content: "";
  margin-left: 1.8vw;
  color: #f2a900;
}

body#platinumcard #items > ul > li > dl {
  display: contents;
}

body#platinumcard #items > ul > li > dl > div {
  margin-top: 2.2vw;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

/* 入会特典 (first spec item) spans the full width; keep the original gap above it */
body#platinumcard #items > ul > li > dl.column2 > div:first-child {
  grid-column: 1 / -1;
  margin-top: 4vw;
}

body#platinumcard #items > ul > li > dl dt {
  padding: 2vw;
  border: 1px solid rgba(256,256,256,0.25);
  border-radius: 2vw 2vw 0 0;
  background: rgba(256,256,256,0.05);
  color: #ccc;
  font-size: var(--fs-base);
  font-weight: bold;
  line-height: 1.45;
  text-align: center;
}

body#platinumcard #items > ul > li > dl dd {
  flex: 1 1 auto;
  min-height: 9.5vw;
  margin: 0;
  padding: 2.3vw;
  border: 1px solid rgba(256,256,256,0.25);
  border-top: 0;
  border-radius: 0 0 2.2vw 2.2vw;
  background: rgba(256,256,256,0.15);
  color: #fff;
  font-size: var(--fs-small);
  font-weight: 800;
  line-height: 1.55;
  text-align: center;
}

body#platinumcard #items > ul > li > dl dd a.modal-open {
  margin-left: 1vw;
  color: #0b3478;
  font-size: var(--fs-xs);
  font-weight: 900;
  text-decoration: underline;
}

body#platinumcard #items > ul > li > span.prText {
  margin-top: 3.5vw;
  padding: 3vw;
  border-radius: 2.4vw;
  background: rgba(256,256,256,0.15);
  color: #cccccc;
  font-size: var(--fs-base);
  font-weight: normal;
  line-height: 1.4;
}

/* --------------------------------------------------------------------------
 Article: platinum-specific reading-content overrides
 -------------------------------------------------------------------------- */

body#platinumcard #article {
padding-top: 10vw;
border-top: 1px solid rgba(216, 199, 159, .45);
margin: 0 calc(50% - 50vw);
padding: 14vw 4vw 4vw 4vw;
border: 0;
border-radius: 0;
background: var(--platinum-gray-bg) !important;
box-shadow: none;
color: #1d2a3a;
}
body#platinumcard .cc-pointList li {
  display: grid;
  grid-template-columns: 6.5vw 1fr;
  gap: 2.2vw;
  color: #4a5568;
  font-size: var(--fs-base);
  font-weight: bold;
  line-height: 1.75;
}
body#platinumcard .cc-icon--check-circle {
width: 5.5vw;
height: 5.5vw;
margin-top: .5vw;
border-radius: 50%;
background: #fff4d6;
color: #f97316;
font-size: var(--fs-base);
font-weight: 900;
background-image: url("../../images/special/creditcard/icons/check-circle-emerald.svg");
}
/* supervisor section */

/*************************************************/
#supervisor-comment {
  margin: 0;
	padding: 2vw;
	background-color: #fff;
	border: 1px solid #ccc;
  border-radius: 4vw;
  border-color: #e8e8e8;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}
#supervisor {
  margin: 0;
  padding: 6vw 4vw 0 4vw;
}
#supervisor div.fpProfile {
  margin: 0 0;
  padding: 2vw;
  border-color: #e8e8e8;
  border-radius: 4vw;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}
#supervisor-comment h4,
#supervisor div.fpProfile h4 {
	margin: 2vw 1vw ;
	padding: .5em 5em .4em .5em;
	font-size: var(--fs-large);
	font-weight: bold;
	line-height: 1.6;
	border-left: none;
  background: #f8f3e8;
  color: #1d2a3a;
}
#supervisor-comment p {
  margin: 4vw 2vw;
}

body#platinumcard section#supervisor-comment {
  margin: 0 0;
  padding: 4vw 4vw 4vw 4vw;
  background: var(--platinum-gray-bg);
  border-radius: 0;
  border: none;
  box-shadow: none;
}
body#platinumcard section#supervisor-comment h4 {
  margin: 0 auto;
  padding: 5.5vw 4.5vw 0 4.5vw;
	color: var(--platinum-accent);
  background-color: transparent;
  border-width: 1px 1px 0 1px;
  border-color: rgba(16,139,116,.28);
  border-style: solid;
	border-radius: 4vw 4vw 0 0;
  background-color: #fff;
}
body#platinumcard section#supervisor-comment p {
	margin: 0 0;
  padding: 3vw 4.5vw 5.5vw 4.5vw;
	border-width: 0 1px 1px 1px;
	border-radius: 0 0 4vw 4vw;
  border-color: rgba(16,139,116,.28);
  border-style: solid;
	font-size: var(--fs-medium-plus);
	line-height: 1.6;
	color: #4a5568;
  background-color: #fff;
}
body#platinumcard section#supervisor {
  margin: 0;
  padding: 6vw 4vw 0 4vw;
  border: none;
  border-radius: 0;
	background: linear-gradient(180deg, var(--platinum-gray-bg, #f5f6f8) 0%, #555 70%,rgba(63, 69, 71, 0.9) 100%);
	box-shadow: none;
	color: #1d2a3a;
}
body#platinumcard #supervisor div.fpProfile {
  margin: 0 0;
  padding: 2vw;
  border-color: #e8e8e8;
  border-radius: 4vw;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}
/********************************************************************/
section#reference {
  margin: 0 0;
	padding: 8vw 6vw 0 6vw;}
section#guardWording {
  margin: 0 0;
	padding: 8vw 6vw 8vw 6vw;}
  #platinumcard section#reference,
  #platinumcard section#guardWording { background-color: rgba(63, 69, 71, 0.9);}

section#reference h4 {
	margin: 0 auto;
	padding: 0 0 ;
	font-size: var(--fs-large);
  font-weight: bold;
	line-height: 1.6;
}
  #platinumcard section#reference h4 { color: #fff;}

ul.referenceLinks {
	margin: 2vw auto 0 auto;
	font-size: var(--fs-medium);
	line-height: 1.4;
}
  .cc-articleBody ul.referenceLinks { margin: 1em 0 0 0;}
ul.referenceLinks a {
  display: block;
  padding-left: 1.5em;
  text-indent: -1.5em;}
  #goldcard ul.referenceLinks a { color: #0b3478 !important;}
  #platinumcard ul.referenceLinks a { color: #52e5d4 !important}
  #platinumcard .cc-articleBody ul.referenceLinks a { color: var(--platinum-accent) !important;}
/* 参考リンクの左端にアイコンを表示 */
ul.referenceLinks a::before,
ul.referenceLinks a::before {
  content: "";
  display: inline-block;
  width: var(--fs-5xlarge);
  height: var(--fs-5xlarge);
  margin-right: 0;
  vertical-align: -0.35em;
  -webkit-mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat;
  mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat;
}
  /* 色はページごとに指定 */
  #goldcard ul.referenceLinks a::before { background-color: var(--icon-gold); }
  #platinumcard ul.referenceLinks a::before { background-color: #52e5d4; }
  #platinumcard .cc-articleBody ul.referenceLinks a::before { background-color: var(--platinum-accent);}

  

section#guardWording ul {
	margin: 0 0 0 1em;
	font-size: var(--fs-base);
	line-height: 1.6;
}
section#guardWording ul li {
  display: block;
  text-indent: -1em;
}
section#guardWording ul li:before {
  content:"※";
}

body#platinumcard section#guardWording ul { 
  padding: 0 0 0 0;
  color: #fff;}




/* --------------------------------------------------------------------------
   FV condition switcher: preact HTML structure
   -------------------------------------------------------------------------- */

body#platinumcard .clear-conditions {
  display: none;
}

body#platinumcard ul.comparison-switcher {
  margin: 0;
  padding: 0;
  list-style: none;
}

body#platinumcard #comparison-switcher {
  position: relative;
  margin-top: 5.2vw;
  padding: 4vw;
  border: 1px solid #e8e8e8;
  border-radius: 5.4vw;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
}

body#platinumcard #comparison-switcher > span {
  display: block;
}

body#platinumcard #comparison-switcher > span:first-child {
  display: flex;
  align-items: center;
  gap: 2vw;
  margin: 0;
  padding-right: 21vw;
  color: #1d2a3a;
  font-size: var(--fs-large);
  font-weight: 900;
  line-height: 1.5;
}

body#platinumcard #comparison-switcher > span:first-child::before {
  content: "";
  width: 2vw;
  height: 2vw;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #f2a900;
  box-shadow: 0 0 0 1.2vw rgba(242, 169, 0, .16);
}

body#platinumcard #comparison-switcher > span.clear-conditions {
  position: absolute;
  right: 3.4vw;
  top: 3.4vw;
  margin: 0;
}

body#platinumcard #comparison-switcher > span.clear-conditions a {
  padding: 1.4vw 3vw;
  border: 1px solid #e8e8e8;
  border-radius: 999px;
  background: #fff;
  color: #687385;
  font-size: var(--fs-small);
  font-weight: 800;
  line-height: 1.3;
}

body#platinumcard #comparison-switcher > span:nth-of-type(3) {
margin-top: 1.6vw;
color: rgba(255,255,255,.72);
font-size: var(--fs-small);
font-weight: 700;
line-height: 1.7;
}

body#platinumcard #comparison-switcher > div {
  margin-top: 3vw;
}

body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2.4vw;
}

body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a {
  position: relative;
  min-height: 16vw;
  padding: 2.5vw 3vw 2.5vw 14.5vw;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 3.4vw;
  background: #fff;
  color: #1d2a3a;
  text-align: left;
  box-shadow: 0 2vw 4.4vw rgba(29, 42, 58, .05);
}

body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a::before {
  position: absolute;
  left: 3vw;
  top: 50%;
  width: 9vw;
  height: 9vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 2.7vw;
  background: #fff4d6;
  color: #0a2463;
  transform: translateY(-50%);
  font-size: var(--fs-2xlarge);
}

body#platinumcard #comparison-switcher li[data-comparison="1"] a::before { content: ""; }
body#platinumcard #comparison-switcher li[data-comparison="2"] a::before { content: ""; }
body#platinumcard #comparison-switcher li[data-comparison="3"] a::before { content: ""; }

body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a > span:nth-of-type(1) {
  color: #1d2a3a;
  font-size: var(--fs-medium);
  font-weight: 900;
  line-height: 1.45;
}

body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a > span:nth-of-type(2) {
  margin-top: .6vw;
  color: #4a5568;
  font-size: var(--fs-xs);
  font-weight: 700;
  line-height: 1.55;
}

body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.selected a {
  border-color: #f2a900;
  background: #fff4d6;
}

body#platinumcard #fv #comparison-switcher-more {
  margin: 3vw auto 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5vw;
  color: #52e5d4;
  font-size: var(--fs-small);
  font-weight: 900;
  line-height: 1.5;
}

body#platinumcard #comparison-switcher-more::after {
  content: "";
  box-sizing: border-box;
  width: 4.4vw;
  height: 4.4vw;
  flex: 0 0 4.4vw;
  display: inline-block;
  border: 1px solid rgba(16,139,116,.8);
  border-radius: 999px;
  background-color: rgba(16,139,116,.18);
  background-image:
    linear-gradient(var(--platinum-accent-3, #22d4b5), var(--platinum-accent-3, #22d4b5)),
    linear-gradient(var(--platinum-accent-3, #22d4b5), var(--platinum-accent-3, #22d4b5));
  background-position: center, center; -webkit-mask-position: center, center; mask-position: center, center;
  background-repeat: no-repeat, no-repeat; -webkit-mask-repeat: no-repeat, no-repeat; mask-repeat: no-repeat, no-repeat;
  background-size: 2.1vw .34vw, .34vw 2.1vw; -webkit-mask-size: 2.1vw .34vw, .34vw 2.1vw; mask-size: 2.1vw .34vw, .34vw 2.1vw;
}
body#platinumcard #comparison-switcher-more.open::after,
body#platinumcard #comparison-switcher-more.opened::after {
  background-size: 2.1vw .34vw, 0 0; -webkit-mask-size: 2.1vw .34vw, 0 0; mask-size: 2.1vw .34vw, 0 0;
}

body#platinumcard #comparison-switcher-more + ul.comparison-switcher {
display: none;
margin: 2.6vw 0 0;
padding: 2.4vw;
border: 1px dashed #d8c79f;
border-radius: 3.4vw;
background: rgba(4,14,22,.78);
border-color: rgba(255,255,255,.18);
}

body#platinumcard #comparison-switcher-more + ul.comparison-switcher li {
  display: inline-block;
  margin: 1vw .8vw 1vw 0;
}

body#platinumcard #comparison-switcher-more + ul.comparison-switcher li a {
  min-height: 8.8vw;
  padding: 0 3.6vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 999px;
  background: #fffaf0;
  color: #1d2a3a;
  font-size: var(--fs-small);
  font-weight: 900;
  line-height: 1.3;
}

body#platinumcard #comparison-switcher-more + ul.comparison-switcher li.selected a {
  border-color: #f2a900;
  background: #fff4d6;
}

body#platinumcard #comparison-switcher + a {
  min-height: 20vw;
  margin: 4vw;
  padding: 3.4vw 10vw 3.4vw 18vw;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid #e8e8e8;
  border-radius: 4vw;
  background: #fff;
  box-shadow: 0 2.6vw 7vw rgba(29, 42, 58, .08);
  color: #1d2a3a;
}

body#platinumcard #comparison-switcher + a::before {
  content: "";
  position: absolute;
  left: 4vw;
  top: 50%;
  width: 11vw;
  height: 11vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3vw;
  background: #fff4d6;
  transform: translateY(-50%);
  font-size: var(--fs-heading-small);
}

body#platinumcard #comparison-switcher + a::after {
  content: "";
  position: absolute;
  right: 4vw;
  top: 50%;
  transform: translateY(-50%);
  color: #f2a900;
  font-size: var(--fs-icon-large);
}

body#platinumcard #comparison-switcher + a span:nth-child(1) {
  color: #1d2a3a;
  font-size: var(--fs-medium-plus);
  font-weight: 900;
}

body#platinumcard #comparison-switcher + a span:nth-child(n+2) {
  margin-top: .5vw;
  color: #4a5568;
  font-size: var(--fs-small);
  font-weight: 700;
  line-height: 1.45;
}

body#platinumcard #pickup table tbody tr.emphasis td {
  background: linear-gradient(180deg, rgba(119, 68, 107, .55) 0%, rgba(255,255,255,.025) 100%);
}
body#platinumcard #pickup table tbody tr.emphasis td > div {
  background: transparent;
  color: #77446B;
}

body#platinumcard #pickup table tbody tr.emphasis td > div > span:nth-child(1) {
color: rgba(255,255,255,.78);
}

body#platinumcard #pickup table thead tr:nth-child(3) th a,
body#platinumcard #items > ul > li > span.application a {
border-color: #108b74;
background: linear-gradient(135deg, #108b74 0%, #1aa488 100%);
color: #fff;
font-size: var(--fs-medium);
box-shadow: 0 3vw 6vw rgba(16,139,116,.28);
}

body#platinumcard #pickup table thead tr:nth-child(3) th a::before,
body#platinumcard #items > ul > li > span.application a::before {
content: none !important;
color: #fff;
font-size: var(--fs-medium);
font-weight: 900;
line-height: 1;
display: none !important;
}

body#platinumcard #pickup table thead tr:nth-child(3) th a::after,
body#platinumcard #items > ul > li > span.application a::after {
color: #fff;
font-size: var(--fs-small);
content: "";
width: 3.8vw;
height: 3.8vw;
margin-left: .55em;
display: inline-block;
-webkit-mask: url("../../images/special/creditcard/icons/external.svg") center / contain no-repeat; mask: url("../../images/special/creditcard/icons/external.svg") center / contain no-repeat; background-color: var(--icon-white);
}
/* Initial state for condition reset links; jQuery shows these after a condition is selected. */
body#platinumcard #fv .clear-conditions {
  display: none;
}
body#platinumcard #items > ul > li > div + span.application {
  order: 0;
  margin-top: 4vw;
  padding-top: 0;
}


/* --------------------------------------------------------------------------
   Credit card SVG icons and comparison glow effect
   -------------------------------------------------------------------------- */


body#platinumcard #comparison-switcher-2 li a::before,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a::before {
content: "" !important;
background-color: rgba(255,255,255,.12) !important;
background-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat !important; mask-repeat: no-repeat !important;
background-position: center !important; -webkit-mask-position: center !important; mask-position: center !important;
background-size: 5.7vw 5.7vw !important; -webkit-mask-size: 5.7vw 5.7vw !important; mask-size: 5.7vw 5.7vw !important;
position: absolute;
top: 3.2vw;
left: 50%;
width: 13.2vw;
height: 13.2vw;
margin: 0;
border-radius: 999px;
transform: translateX(-50%);
display: block !important;
box-shadow: 0 0 0 1px rgba(255,255,255,.16), 0 2vw 5vw rgba(0,0,0,.24);
opacity: 1;
}
body#platinumcard #comparison-switcher-2 li.point a::before,
body#platinumcard #comparison-switcher li.point a::before {
-webkit-mask-image: url("../../images/special/creditcard/icons/point.svg"); mask-image: url("../../images/special/creditcard/icons/point.svg"); background-color: var(--icon-emerald);
}
body#platinumcard #comparison-switcher-2 li.concierge a::before,
body#platinumcard #comparison-switcher li.concierge a::before {
-webkit-mask-image: url("../../images/special/creditcard/icons/concierge.svg"); mask-image: url("../../images/special/creditcard/icons/concierge.svg"); background-color: var(--icon-emerald);
}
body#platinumcard #comparison-switcher-2 li.lounge a::before,
body#platinumcard #comparison-switcher li.lounge a::before {
-webkit-mask-image: url("../../images/special/creditcard/icons/lounge.svg"); mask-image: url("../../images/special/creditcard/icons/lounge.svg"); background-color: var(--icon-emerald);
}
body#platinumcard #comparison-switcher-2 li.gift a::before,
body#platinumcard #comparison-switcher li.gift a::before {
-webkit-mask-image: url("../../images/special/creditcard/icons/concierge.svg"); mask-image: url("../../images/special/creditcard/icons/concierge.svg"); background-color: var(--icon-emerald);
}
body#platinumcard #comparison-switcher-2 li.wallet a::before,
body#platinumcard #comparison-switcher li.wallet a::before {
-webkit-mask-image: url("../../images/special/creditcard/icons/wallet.svg"); mask-image: url("../../images/special/creditcard/icons/wallet.svg"); background-color: var(--icon-emerald);
}
body#platinumcard #comparison-switcher-2 li.hotel_discounts a::before,
body#platinumcard #comparison-switcher li.hotel_discounts a::before {
-webkit-mask-image: url("../../images/special/creditcard/icons/hotel.svg"); mask-image: url("../../images/special/creditcard/icons/hotel.svg"); background-color: var(--icon-emerald);
}
body#platinumcard #comparison-switcher-2 + a::before,
body#platinumcard #comparison-switcher + a::before {
  content: "" !important;
  background: #fff4d6 url("../../images/special/creditcard/icons/book-emerald.svg") no-repeat center / 6.3vw 6.3vw;
  -webkit-mask-image: url("../../images/special/creditcard/icons/book.svg") !important; mask-image: url("../../images/special/creditcard/icons/book.svg") !important; background-color: var(--icon-white) !important;
  background-color: rgba(255,255,255,.10) !important;
  background-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat !important; mask-repeat: no-repeat !important;
  background-position: center !important; -webkit-mask-position: center !important; mask-position: center !important;
  background-size: 6.2vw 6.2vw !important; -webkit-mask-size: 6.2vw 6.2vw !important; mask-size: 6.2vw 6.2vw !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.16);
}
body#platinumcard #comparison-switcher-2 + a::after,
body#platinumcard #comparison-switcher + a::after {
content: "";
width: 4.8vw;
height: 4.8vw;
-webkit-mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; mask: url("../../images/special/creditcard/icons/chevron-right.svg") center / contain no-repeat; background-color: var(--icon-emerald);
font-size: var(--fs-small);
-webkit-mask-image: url("../../images/special/creditcard/icons/chevron-right.svg") !important; mask-image: url("../../images/special/creditcard/icons/chevron-right.svg") !important; background-color: var(--icon-white) !important;
}


body#platinumcard .cc-icon::before { content: "" !important; }


body#platinumcard .cc-icon--chevron-right {
-webkit-mask-image: url("../../images/special/creditcard/icons/chevron-right.svg"); mask-image: url("../../images/special/creditcard/icons/chevron-right.svg"); background-color: var(--icon-emerald);
}
body#platinumcard .cc-icon--external {
-webkit-mask-image: url("../../images/special/creditcard/icons/external.svg"); mask-image: url("../../images/special/creditcard/icons/external.svg"); background-color: var(--icon-emerald);
}
body#platinumcard #pickup table tbody[data-comparison="7"],
body#platinumcard #pickup table tbody[data-comparison="8"] { display: none; }


/* --------------------------------------------------------------------------
   Platinum card page theme
   -------------------------------------------------------------------------- */


body#platinumcard #maincontents > .breadcrumbs,
body#platinumcard #maincontents > .breadcrumbs a { color: rgba(255,255,255,.72); }


body#platinumcard #comparison-switcher-1,
body#platinumcard #comparison-switcher-2,
body#platinumcard #comparison-switcher {
  border-color: rgba(255,255,255,.10);
  background: rgba(7,13,24,.84);
  box-shadow: 0 3vw 8vw rgba(0,0,0,.28);
}
body#platinumcard #coparison-starter,
body#platinumcard #pickup + div a,
body#platinumcard #pickup table thead tr:nth-child(3) th a,
body#platinumcard #items > ul > li > span.application a {
  border-color: #108b74;
  background: linear-gradient(135deg, #108b74 0%, #1aa488 100%);
  box-shadow: 0 3vw 6vw rgba(16,139,116,.28);
}
body#platinumcard #comparison-switcher-1 > div,
body#platinumcard #comparison-switcher-2 li a,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher,
body#platinumcard #comparison-switcher-2 + a,
body#platinumcard #comparison-switcher + a {
  border-color: rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: #f8f9fb;
}
body#platinumcard #comparison-switcher-1 > div::before,
body#platinumcard #comparison-switcher-2 > span,
body#platinumcard #comparison-switcher > span:first-child,
body#platinumcard #comparison-switcher-2 li a > span:nth-of-type(1),
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a > span:nth-of-type(1),
body#platinumcard #comparison-switcher-2 + a span:nth-child(1),
body#platinumcard #comparison-switcher + a span:nth-child(1) { color: #f8f9fb; }
body#platinumcard #comparison-switcher-2 li a > span:nth-of-type(2),
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a > span:nth-of-type(2),
body#platinumcard #comparison-switcher-2 + a span:nth-child(n+2),
body#platinumcard #comparison-switcher + a span:nth-child(n+2),
body#platinumcard #comparison-switcher > span:nth-of-type(3) { color: rgba(255,255,255,.72); }
body#platinumcard #comparison-switcher-1 li a,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li a,
body#platinumcard #comparison-switcher > span.clear-conditions a,
body#platinumcard #pickup .clear-conditions a {
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.08);
  color: #f8f9fb;
}
body#platinumcard #comparison-switcher-1 li.selected a,
body#platinumcard #comparison-switcher-2 li.selected a,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.selected a,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li.selected a {
  border-color: #108b74;
  background: rgba(16,139,116,.18);
}
body#platinumcard #comparison-switcher-2 > span::before,
body#platinumcard #comparison-switcher > span:first-child::before,
body#platinumcard #pickup h2::after,
body#platinumcard #items > h2::after,
body#platinumcard .cc-sectionTitle::after { background: #108b74; }
body#platinumcard #comparison-switcher-2 > span::before,
body#platinumcard #comparison-switcher > span:first-child::before {
box-shadow: 0 0 0 1.2vw rgba(16,139,116,.20);
display: none;
}


body#platinumcard #pickup h2,
body#platinumcard #pickup + div { color: #f8f9fb; }


body#platinumcard #comparison-switcher-2 li a::before,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a::before,
body#platinumcard #comparison-switcher-2 + a::before,
body#platinumcard #comparison-switcher + a::before { background-color: rgba(16,139,116,.16); }


body#platinumcard #comparison-switcher-2 li.dining a::before,
body#platinumcard #comparison-switcher li.dining a::before { -webkit-mask-image: url("../../images/special/creditcard/icons/dining.svg"); mask-image: url("../../images/special/creditcard/icons/dining.svg"); background-color: var(--icon-emerald); }
body#platinumcard #comparison-switcher-2 li.family a::before,
body#platinumcard #comparison-switcher li.family a::before { -webkit-mask-image: url("../../images/special/creditcard/icons/family.svg"); mask-image: url("../../images/special/creditcard/icons/family.svg"); background-color: var(--icon-emerald); }


body#platinumcard #pickup.is-highlight { animation: ccPlatinumPickupGlow .72s ease-out; }
@keyframes ccPlatinumPickupGlow {
  0% { box-shadow: 0 5vw 14vw rgba(0,0,0,.34), 0 0 0 0 rgba(16,139,116,.82); }
  45% { box-shadow: 0 5vw 14vw rgba(0,0,0,.34), 0 0 0 2.1vw rgba(16,139,116,.38), 0 0 8vw rgba(16,139,116,.34); }
  100% { box-shadow: 0 5vw 14vw rgba(0,0,0,.34), 0 0 0 0 rgba(16,139,116,0); }
}

/* --------------------------------------------------------------------------
   Platinum visual theme: SP adjustments
   -------------------------------------------------------------------------- */


body#platinumcard #comparison-switcher-1 li a,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li a {
  border-color: rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);
}

body#platinumcard #comparison-switcher-2,
body#platinumcard #comparison-switcher {
  margin: 8vw 4vw 0 4vw;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body#platinumcard #comparison-switcher-2 > span,
body#platinumcard #comparison-switcher > span:first-child {
  display: block;
  margin: 0 0 3vw;
  padding: 0;
  color: #fff;
  font-size: var(--fs-3xlarge);
  font-weight: 600;
  border: 0;
}


body#platinumcard #comparison-switcher-2 ul,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.8vw;
}

body#platinumcard #comparison-switcher-2 li[data-comparison="5"],
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type > li[data-comparison="5"] {
  display: none !important;
}

body#platinumcard #fv li[data-comparison="0"],
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.point,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.concierge,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li.lounge,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li.hotel_discounts,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li.dining_discounts { display: none; }

body#platinumcard #comparison-switcher-2 li a,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a {
  min-height:42vw;
  padding: 4vw 2vw 3.5vw ;
  justify-content: flex-end;
  align-items: center;
  overflow: hidden;
  border-color: rgba(255,255,255,.26);
  border-radius: 1.5vw;
  box-shadow: none;
  text-align: center;
}
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.dining_discounts a {
	background:
	linear-gradient(180deg, rgba(3,8,15,.15) 0%, rgba(3,8,15,.5) 40%, rgba(3,8,15,.99) 95%),
	url("../../images/special/creditcard/photos/bg_dining_discounts.webp") top center / auto 120% no-repeat;
}
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.hotel_discounts a {
	background:
	linear-gradient(180deg, rgba(3,8,15,.15) 0%, rgba(3,8,15,.5) 40%, rgba(3,8,15,.99) 80%),
	url("../../images/special/creditcard/photos/bg_hotel_discounts.webp") bottom 50px center / auto 120% no-repeat;
}
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.lounge a { 
	background:
	linear-gradient(180deg, rgba(3,8,15,.15) 0%, rgba(3,8,15,.5) 40%, rgba(3,8,15,.99) 80%), 
	url("../../images/special/creditcard/photos/bg_lounge.webp") bottom 50px right / auto 120% no-repeat;
}
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.lounge a,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.hotel_discounts a,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.dining_discounts a {
  background-repeat: no-repeat, no-repeat; -webkit-mask-repeat: no-repeat, no-repeat; mask-repeat: no-repeat, no-repeat;
  background-origin: border-box, border-box;
  background-clip: border-box, border-box;
}


body#platinumcard #comparison-switcher-2 li a > span:nth-of-type(1),
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a > span:nth-of-type(1) {
  color: #fff;
  font-size: var(--fs-small-plus);
  font-weight: 600;
  text-align: center;
}

body#platinumcard #comparison-switcher-2 li a > span:nth-of-type(2),
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a > span:nth-of-type(2) {
  margin-top: 2vw;
  color: rgba(255,255,255,.82);
  font-size: var(--fs-2xs);
  text-align: center;
  letter-spacing: -0.01vw;
}

/* SP: align the inner text rows of the three platinum FV comparison cards. */
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li:is(.lounge, .hotel_discounts, .dining_discounts) a > span {
  width: 100%;
  box-sizing: border-box;
  display: block;
}

body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li:is(.lounge, .hotel_discounts, .dining_discounts) a > span:nth-of-type(1) {
  min-height: 2.4em;
  line-height: 1.2;
}

body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li:is(.lounge, .hotel_discounts, .dining_discounts) a > span:nth-of-type(2) {
  min-height: 4em;
  line-height: 1.3;
}


body#platinumcard #comparison-switcher-2 + a,
body#platinumcard #comparison-switcher + a {
  border-color: rgba(255,255,255,.26);
  background: rgba(4,13,21,.58);
  box-shadow: none;
}

body#platinumcard #comparison-switcher-2 + a span:nth-child(1),
body#platinumcard #comparison-switcher + a span:nth-child(1) {
  color: #fff;
}

body#platinumcard #comparison-switcher-2 + a span:nth-child(n+2),
body#platinumcard #comparison-switcher + a span:nth-child(n+2) {
  color: rgba(255,255,255,.76);
}



body#platinumcard #pickup table thead th,
body#platinumcard #pickup table thead tr:nth-child(1) th,
body#platinumcard #pickup table thead tr:nth-child(2) th,
body#platinumcard #pickup table thead tr:nth-child(3) th,
body#platinumcard #pickup table tbody td {
  border-color: rgba(255,255,255,.18) !important;
  background: transparent;
}

body#platinumcard #pickup table thead tr:nth-child(1) th span:nth-child(1),
body#platinumcard #pickup table thead tr:nth-child(1) th span:nth-child(2) {
  color: #fff;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", serif;
}


body#platinumcard #pickup table tbody tr.emphasis td > div > span:nth-child(2) {
  display: block;
  color: var(--platinum-orange);
  font-size: var(--fs-4xlarge-plus);
  font-weight: bold;
  line-height: 1.25;
  text-shadow: 0 0 4vw rgba(255,112,67,.22);
}

body#platinumcard #article .cc-sectionTitle,
body#platinumcard #article .cc-articleSection__title,
body#platinumcard #article .cc-articleSummary__title,
body#platinumcard #article .cc-pointBox__title,
body#platinumcard #article .cc-articleBox__title,
body#platinumcard #article .cc-longReadItem__title {
  color: #1d2a3a;
}

body#platinumcard #article .cc-sectionLead,
body#platinumcard #article .cc-articleSection__lead,
body#platinumcard #article .cc-articleSection__text p,
body#platinumcard #article .cc-longReadItem__text p,
body#platinumcard #article .cc-articleSummary__text p,
body#platinumcard #article .cc-faqItem__answer p,
body#platinumcard #article .cc-readCard__text,
body#platinumcard #article .cc-pointList li,
body#platinumcard #article .cc-articleList a {
  color: #4a5568;
}

body#platinumcard #article .cc-sectionTitle::after {
background: var(--platinum-accent);
}

body#platinumcard #article .cc-pointBox,
body#platinumcard #article .cc-articleBox,
body#platinumcard #article .cc-articleSection {
border-color: #dfe3e8;
background: #fff;
box-shadow: 0 2.6vw 7vw rgba(29,42,58,.07);
}

body#platinumcard #article .cc-articleSection__label {
  color: #687385;
}

body#platinumcard #article .cc-articleSection--longRead > .cc-articleSection__header {
border-bottom-color: #dfe3e8;
background: linear-gradient(135deg, rgba(16,139,116,.10) 0%, #fff 76%);
}

body#platinumcard #article .cc-longReadItem {
  border-top-color: #dfe3e8;
  background: #fff;
}

body#platinumcard #article .cc-longReadItem:nth-child(even) {
  background: #f7f8f9;
}

body#platinumcard #article .cc-longReadItem__number,
body#platinumcard #article .cc-longReadItem__summary,
body#platinumcard #article .cc-readCard,
body#platinumcard #article .cc-faqItem {
  background: #eef0f2;
  color: #1d2a3a;
}

body#platinumcard #article .cc-longReadNote {
border-left-color: var(--platinum-accent);
background: #eef6f4;
}

body#platinumcard #article .cc-articleSummary {
border-color: rgba(16,139,116,.28);
background: linear-gradient(135deg, rgba(16,139,116,.10) 0%, #fff 74%);
}


/* --------------------------------------------------------------------------
   Platinum finishing styles: SP icons and section accents
   -------------------------------------------------------------------------- */
body#platinumcard #comparison-switcher-2 li.concierge a::before,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.concierge a::before {
	background-image: url("../../images/special/creditcard/icons/concierge-white.svg") !important;
}
body#platinumcard #comparison-switcher-2 li.lounge a::before,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.lounge a::before {
	background-image: url("../../images/special/creditcard/icons/lounge-white.svg") !important;
}
body#platinumcard #comparison-switcher-2 li.hotel_discounts a::before,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.hotel_discounts a::before {
	background-image: url("../../images/special/creditcard/icons/hotel-white.svg") !important;
}
body#platinumcard #comparison-switcher-2 li.dining_discounts a::before,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.dining_discounts a::before {
	background-image: url("../../images/special/creditcard/icons/dining-white.svg") !important;
}

body#platinumcard #pickup h2 .cc-pickupTitleText {
  display: inline-block;
  line-height: 1.42;
}
body#platinumcard #pickup h2 .cc-pickupTitleAccent {
  color: var(--platinum-orange);
  font-size: var(--fs-scale-title-accent);
  font-weight: 800;
  letter-spacing: .03em;
  text-shadow: 0 1vw 4vw rgba(255,112,67,.22);
}


body#platinumcard #items {
  margin: 0 calc(50% - 50vw);
  padding: 14vw 4vw 14vw;
  border: 0;
  border-radius: 0;
  background: linear-gradient(180deg, #05080f 0%, var(--platinum-gray-bg) 5%) !important;
  box-shadow: none;
  color: #1d2a3a;
}
body#platinumcard #items > h2 {
  color: #fff;
  text-shadow: 0 1vw 4vw rgba(0,0,0,.26);
}
body#platinumcard #items > h2::after {
  background: var(--platinum-accent);
}
body#platinumcard #items > span {
  color: rgba(255,255,255,.78);
}


body#platinumcard #article .cc-articleSection__label,
body#platinumcard #article .cc-pointBox__title,
body#platinumcard #article .cc-articleBox__title,
body#platinumcard #article .cc-articleSummary__title {
  color: var(--platinum-accent);
}


body#platinumcard #article .cc-longReadItem__number {
  border: 1px solid rgba(16,139,116,.22);
  background: #e8f4f1;
  color: var(--platinum-accent);
}
body#platinumcard #article .cc-longReadItem__summary,
body#platinumcard #article .cc-readCard,
body#platinumcard #article .cc-faqItem {
  background: #eef6f4;
  color: #1d2a3a;
}


body#platinumcard #article .cc-articleList a:hover {
  border-color: var(--platinum-accent);
  background: #eef6f4;
}
body#platinumcard #article .cc-icon--check-circle {
  background-image: url("../../images/special/creditcard/icons/check-circle-emerald.svg");
}
body#platinumcard #article .cc-icon--chevron-right {
  -webkit-mask-image: url("../../images/special/creditcard/icons/chevron-right.svg"); mask-image: url("../../images/special/creditcard/icons/chevron-right.svg"); background-color: var(--icon-emerald);
}
body#platinumcard #article .cc-icon--external {
  -webkit-mask-image: url("../../images/special/creditcard/icons/external.svg"); mask-image: url("../../images/special/creditcard/icons/external.svg"); background-color: var(--icon-emerald);
}

/* --------------------------------------------------------------------------
 SVG icon display integration: class-only icons and shared rules
 -------------------------------------------------------------------------- */
/* HTML should use only the icon name as the class, e.g. class="wallet". */
/* The申込条件 icon uses conditions.svg / class="conditions". */

/* goldcard: feature-label icon variables. */
body#goldcard .gift { --cc-feature-icon: url("../../images/special/creditcard/icons/gift.svg"); }
body#goldcard .wallet { --cc-feature-icon: url("../../images/special/creditcard/icons/wallet.svg"); }
body#goldcard .point { --cc-feature-icon: url("../../images/special/creditcard/icons/point.svg"); }
body#goldcard .star { --cc-feature-icon: url("../../images/special/creditcard/icons/star.svg"); }
body#goldcard .lounge { --cc-feature-icon: url("../../images/special/creditcard/icons/lounge.svg"); }
body#goldcard .plane-shield { --cc-feature-icon: url("../../images/special/creditcard/icons/plane-shield.svg"); }
body#goldcard .bag-shield { --cc-feature-icon: url("../../images/special/creditcard/icons/bag-shield.svg"); }
body#goldcard .family { --cc-feature-icon: url("../../images/special/creditcard/icons/family.svg"); }
body#goldcard .etc { --cc-feature-icon: url("../../images/special/creditcard/icons/etc.svg"); }
body#goldcard .brand { --cc-feature-icon: url("../../images/special/creditcard/icons/brand.svg"); }
body#goldcard .conditions { --cc-feature-icon: url("../../images/special/creditcard/icons/conditions.svg"); }
body#goldcard .concierge { --cc-feature-icon: url("../../images/special/creditcard/icons/concierge.svg"); }
body#goldcard .hotel { --cc-feature-icon: url("../../images/special/creditcard/icons/hotel.svg"); }
body#goldcard .dining { --cc-feature-icon: url("../../images/special/creditcard/icons/dining.svg"); }
body#goldcard .baggage { --cc-feature-icon: url("../../images/special/creditcard/icons/baggage.svg"); }

/* platinumcard: feature-label icon variables. */
body#platinumcard .gift { --cc-feature-icon: url("../../images/special/creditcard/icons/gift.svg"); }
body#platinumcard .wallet { --cc-feature-icon: url("../../images/special/creditcard/icons/wallet.svg"); }
body#platinumcard .point { --cc-feature-icon: url("../../images/special/creditcard/icons/point.svg"); }
body#platinumcard .star { --cc-feature-icon: url("../../images/special/creditcard/icons/star.svg"); }
body#platinumcard .lounge { --cc-feature-icon: url("../../images/special/creditcard/icons/lounge.svg"); }
body#platinumcard .plane-shield { --cc-feature-icon: url("../../images/special/creditcard/icons/plane-shield.svg"); }
body#platinumcard .bag-shield { --cc-feature-icon: url("../../images/special/creditcard/icons/bag-shield.svg"); }
body#platinumcard .family { --cc-feature-icon: url("../../images/special/creditcard/icons/family.svg"); }
body#platinumcard .etc { --cc-feature-icon: url("../../images/special/creditcard/icons/etc.svg"); }
body#platinumcard .brand { --cc-feature-icon: url("../../images/special/creditcard/icons/brand.svg"); }
body#platinumcard .conditions { --cc-feature-icon: url("../../images/special/creditcard/icons/conditions.svg"); }
body#platinumcard .concierge { --cc-feature-icon: url("../../images/special/creditcard/icons/concierge.svg"); }
body#platinumcard .hotel { --cc-feature-icon: url("../../images/special/creditcard/icons/hotel.svg"); }
body#platinumcard .dining { --cc-feature-icon: url("../../images/special/creditcard/icons/dining.svg"); }
body#platinumcard .baggage { --cc-feature-icon: url("../../images/special/creditcard/icons/baggage.svg"); }

/* goldcard: FV condition-card icon variables. */
body#goldcard #comparison-switcher li.gift,
body#goldcard #comparison-switcher-2 li.gift { --cc-condition-icon: url("../../images/special/creditcard/icons/gift-gold.svg"); }
body#goldcard #comparison-switcher li.wallet,
body#goldcard #comparison-switcher-2 li.wallet { --cc-condition-icon: url("../../images/special/creditcard/icons/wallet-gold.svg"); }
body#goldcard #comparison-switcher li.point,
body#goldcard #comparison-switcher-2 li.point { --cc-condition-icon: url("../../images/special/creditcard/icons/point-gold.svg"); }
body#goldcard #comparison-switcher li.star,
body#goldcard #comparison-switcher-2 li.star { --cc-condition-icon: url("../../images/special/creditcard/icons/star-gold.svg"); }
body#goldcard #comparison-switcher li.lounge,
body#goldcard #comparison-switcher-2 li.lounge { --cc-condition-icon: url("../../images/special/creditcard/icons/lounge-gold.svg"); }
body#goldcard #comparison-switcher li.family,
body#goldcard #comparison-switcher-2 li.family { --cc-condition-icon: url("../../images/special/creditcard/icons/family-gold.svg"); }
body#goldcard #comparison-switcher li.conditions,
body#goldcard #comparison-switcher-2 li.conditions { --cc-condition-icon: url("../../images/special/creditcard/icons/conditions-gold.svg"); }
body#goldcard #comparison-switcher li.concierge,
body#goldcard #comparison-switcher-2 li.concierge { --cc-condition-icon: url("../../images/special/creditcard/icons/concierge-gold.svg"); }
body#goldcard #comparison-switcher li.hotel,
body#goldcard #comparison-switcher-2 li.hotel { --cc-condition-icon: url("../../images/special/creditcard/icons/hotel-gold.svg"); }
body#goldcard #comparison-switcher li.hotel_discounts,
body#goldcard #comparison-switcher-2 li.hotel_discounts { --cc-condition-icon: url("../../images/special/creditcard/icons/hotel-gold.svg"); }
body#goldcard #comparison-switcher li.dining,
body#goldcard #comparison-switcher-2 li.dining { --cc-condition-icon: url("../../images/special/creditcard/icons/dining-gold.svg"); }
body#goldcard #comparison-switcher li.dining_discounts,
body#goldcard #comparison-switcher-2 li.dining_discounts { --cc-condition-icon: url("../../images/special/creditcard/icons/dining-gold.svg"); }

/* platinumcard: FV condition-card icon variables. */
body#platinumcard #comparison-switcher li.gift,
body#platinumcard #comparison-switcher-2 li.gift { --cc-condition-icon: url("../../images/special/creditcard/icons/gift-emerald.svg"); }
body#platinumcard #comparison-switcher li.wallet,
body#platinumcard #comparison-switcher-2 li.wallet { --cc-condition-icon: url("../../images/special/creditcard/icons/wallet-emerald.svg"); }
body#platinumcard #comparison-switcher li.point,
body#platinumcard #comparison-switcher-2 li.point { --cc-condition-icon: url("../../images/special/creditcard/icons/point-emerald.svg"); }
body#platinumcard #comparison-switcher li.star,
body#platinumcard #comparison-switcher-2 li.star { --cc-condition-icon: url("../../images/special/creditcard/icons/star-emerald.svg"); }
body#platinumcard #comparison-switcher li.lounge,
body#platinumcard #comparison-switcher-2 li.lounge { --cc-condition-icon: url("../../images/special/creditcard/icons/lounge-emerald.svg"); }
body#platinumcard #comparison-switcher li.family,
body#platinumcard #comparison-switcher-2 li.family { --cc-condition-icon: url("../../images/special/creditcard/icons/family-emerald.svg"); }
body#platinumcard #comparison-switcher li.conditions,
body#platinumcard #comparison-switcher-2 li.conditions { --cc-condition-icon: url("../../images/special/creditcard/icons/conditions-emerald.svg"); }
body#platinumcard #comparison-switcher li.concierge,
body#platinumcard #comparison-switcher-2 li.concierge { --cc-condition-icon: url("../../images/special/creditcard/icons/concierge-emerald.svg"); }
body#platinumcard #comparison-switcher li.hotel,
body#platinumcard #comparison-switcher-2 li.hotel { --cc-condition-icon: url("../../images/special/creditcard/icons/hotel-emerald.svg"); }
body#platinumcard #comparison-switcher li.hotel_discounts,
body#platinumcard #comparison-switcher-2 li.hotel_discounts { --cc-condition-icon: url("../../images/special/creditcard/icons/hotel-emerald.svg"); }
body#platinumcard #comparison-switcher li.dining,
body#platinumcard #comparison-switcher-2 li.dining { --cc-condition-icon: url("../../images/special/creditcard/icons/dining-emerald.svg"); }
body#platinumcard #comparison-switcher li.dining_discounts,
body#platinumcard #comparison-switcher-2 li.dining_discounts { --cc-condition-icon: url("../../images/special/creditcard/icons/dining-emerald.svg"); }

/* Platinum large FV service cards use white icons on the dark image cards. */
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.gift { --cc-condition-icon: url("../../images/special/creditcard/icons/gift-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.wallet { --cc-condition-icon: url("../../images/special/creditcard/icons/wallet-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.point { --cc-condition-icon: url("../../images/special/creditcard/icons/point-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.star { --cc-condition-icon: url("../../images/special/creditcard/icons/star-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.lounge { --cc-condition-icon: url("../../images/special/creditcard/icons/lounge-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.family { --cc-condition-icon: url("../../images/special/creditcard/icons/family-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.conditions { --cc-condition-icon: url("../../images/special/creditcard/icons/conditions-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.concierge { --cc-condition-icon: url("../../images/special/creditcard/icons/concierge-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.hotel { --cc-condition-icon: url("../../images/special/creditcard/icons/hotel-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.hotel_discounts { --cc-condition-icon: url("../../images/special/creditcard/icons/hotel-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.dining { --cc-condition-icon: url("../../images/special/creditcard/icons/dining-white.svg"); }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li.dining_discounts { --cc-condition-icon: url("../../images/special/creditcard/icons/dining-white.svg"); }

/* Article-list SVG icons. */
body#goldcard .cc-icon--chevron-right,
body#goldcard .cc-icon--external,
body#platinumcard .cc-icon--chevron-right,
body#platinumcard .cc-icon--external {
width: 4.2vw;
height: 4.2vw;
display: inline-block;
flex: 0 0 4.2vw;
}

body#goldcard .cc-articleList a .cc-icon,
body#platinumcard .cc-articleList a .cc-icon {
width: 4.2vw;
height: 4.2vw;
}

body#goldcard .cc-icon,
body#platinumcard .cc-icon {
  background-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  background-position: center; -webkit-mask-position: center; mask-position: center;
  background-size: contain; -webkit-mask-size: contain; mask-size: contain;
}
body#goldcard .cc-icon::before,
body#platinumcard .cc-icon::before { content: "" !important; }

/* FV condition cards and expanded condition chips. */
body#goldcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li { --cc-condition-icon-size: 5.6vw 5.6vw; }
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li { --cc-condition-icon-size: 7.7vw 7.7vw; }
body#goldcard #comparison-switcher-2 li,
body#platinumcard #comparison-switcher-2 li { --cc-condition-icon-size: 5.6vw 5.6vw; }
body#goldcard #comparison-switcher-more + ul.comparison-switcher li,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li { --cc-condition-icon-size: contain; }

body#goldcard #comparison-switcher-more + ul.comparison-switcher li a,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li a {
gap: 1.3vw;
}

body#goldcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li:not([data-comparison="0"]) a::before,
body#goldcard #comparison-switcher-2 li a::before,
body#goldcard #comparison-switcher-more + ul.comparison-switcher li a::before,
body#platinumcard #comparison-switcher > div > ul.comparison-switcher:first-of-type li a::before,
body#platinumcard #comparison-switcher-2 li a::before,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li a::before {
content: "";
background-image: var(--cc-condition-icon) !important;
background-repeat: no-repeat !important; -webkit-mask-repeat: no-repeat !important; mask-repeat: no-repeat !important;
background-position: center !important; -webkit-mask-position: center !important; mask-position: center !important;
background-size: var(--cc-condition-icon-size, contain) !important; -webkit-mask-size: var(--cc-condition-icon-size, contain) !important; mask-size: var(--cc-condition-icon-size, contain) !important;
}

body#goldcard #comparison-switcher-more + ul.comparison-switcher li a::before,
body#platinumcard #comparison-switcher-more + ul.comparison-switcher li a::before {
width: 4vw;
height: 4vw;
flex: 0 0 4vw;
display: inline-block;
}


/* Other-condition opener: restore the plus icon. */
body#goldcard #comparison-switcher-more::after {
  content: "";
  box-sizing: border-box;
  width: 4.4vw;
  height: 4.4vw;
  flex: 0 0 4.4vw;
  display: inline-block;
  border: 1px solid rgba(216,137,0,.8);
  border-radius: 999px;
  background-color: #fff4d6;
  background-image:
    linear-gradient(#d88900, #d88900),
    linear-gradient(#d88900, #d88900);
  background-position: center, center; -webkit-mask-position: center, center; mask-position: center, center;
  background-repeat: no-repeat, no-repeat; -webkit-mask-repeat: no-repeat, no-repeat; mask-repeat: no-repeat, no-repeat;
  background-size: 2.1vw .34vw, .34vw 2.1vw; -webkit-mask-size: 2.1vw .34vw, .34vw 2.1vw; mask-size: 2.1vw .34vw, .34vw 2.1vw;
}

body#goldcard #comparison-switcher-more.open::after,
body#goldcard #comparison-switcher-more.opened::after {
  background-size: 2.1vw .34vw, 0 0; -webkit-mask-size: 2.1vw .34vw, 0 0; mask-size: 2.1vw .34vw, 0 0;
}


/* Comparison-table, card-detail and modal label icons. */
body#goldcard #pickup table tbody td > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage),
body#goldcard #items > ul > li > dl dt:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage),
body#goldcard #items div.modal > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage),
body#platinumcard #pickup table tbody td > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage),
body#platinumcard #items > ul > li > dl dt:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage),
body#platinumcard #items div.modal > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage) {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 1.1vw;
}

body#goldcard #pickup table tbody td > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before,
body#goldcard #items > ul > li > dl dt:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before,
body#goldcard #items div.modal > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before,
body#platinumcard #pickup table tbody td > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before,
body#platinumcard #items > ul > li > dl dt:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before,
body#platinumcard #items div.modal > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before {
content: "";
width: 3.5vw;
height: 3.5vw;
flex: 0 0 3.5vw;
display: inline-block;
-webkit-mask-image: var(--cc-feature-icon); mask-image: var(--cc-feature-icon); background-color: var(--cc-icon-color);
background-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
background-position: center; -webkit-mask-position: center; mask-position: center;
background-size: contain; -webkit-mask-size: contain; mask-size: contain;
}

body#goldcard #pickup table tbody td > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before,
body#goldcard #items div.modal > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before,
body#platinumcard #pickup table tbody td > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before,
body#platinumcard #items div.modal > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before {
width: 3.5vw;
height: 3.5vw;
flex-basis: 3.5vw;
}

body#platinumcard #pickup table tbody td > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before,
body#platinumcard #items div.modal > div > span:is(.gift, .wallet, .point, .star, .lounge, .plane-shield, .bag-shield, .family, .etc, .brand, .conditions, .concierge, .hotel, .dining, .baggage)::before {
filter: drop-shadow(0 0 1.3vw rgba(16,139,116,.24));
}

/* Detail modal links use an information icon. */
body#goldcard #fv a.modal-open,
body#platinumcard #fv a.modal-open,
body#goldcard #items > ul > li > dl dd a.modal-open,
body#platinumcard #items > ul > li > dl dd a.modal-open {
  width: 4.6vw;
  height: 4.6vw;
  margin-left: 1.3vw;
  display: inline-flex;
  position: relative;
  overflow: hidden;
  white-space: nowrap;
  color: transparent !important;
  align-items: center;
  justify-content: center;
  vertical-align: -1vw;
  border: 1px solid rgba(29, 42, 58, .14);
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 .25vw 1vw rgba(29, 42, 58, .08);
  font-size: var(--fs-small);
  line-height: 1;
  text-decoration: none;
}
body#goldcard #fv a.modal-open::before,
body#platinumcard #fv a.modal-open::before,
body#goldcard #items > ul > li > dl dd a.modal-open::before,
body#platinumcard #items > ul > li > dl dd a.modal-open::before {
  content: "";
  width: 4.6vw;
  height: 4.6vw;
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  background-position: center; -webkit-mask-position: center; mask-position: center;
  background-size: contain; -webkit-mask-size: contain; mask-size: contain;
}
body#goldcard #fv a.modal-open::before,
body#goldcard #items > ul > li > dl dd a.modal-open::before { background-image: url("../../images/special/creditcard/icons/detail-gold.svg"); }
body#platinumcard #fv a.modal-open::before,
body#platinumcard #items > ul > li > dl dd a.modal-open::before { background-image: url("../../images/special/creditcard/icons/detail-emerald.svg"); }

/* Platinum service cards: center the icon lane. */


#article h2.cc-sectionTitle span {
  display: block;
  line-height: 1.42;
}

/* ==========================================================================
 離脱防止ポップアップ（レコメンド） SP  ※creditcard.css内で意匠上書き（v2）
   #modal-recommend-8 : ゴールド / #modal-recommend-9 : プラチナ
   SPは縦1列のタイル積み。構成はPC同様（dt / dd[キャッチ+券面] / dd[ボタン]）
 ========================================================================== */

/* ---- 共通レイアウト（SP：縦1列タイル） --------------------------------- */
body#goldcard #modal-recommend-8 .modal-body > p,
body#platinumcard #modal-recommend-9 .modal-body > p {
	text-align: center;
	line-height: 1.6;
	font-size: var(--fs-small);
}
body#goldcard #modal-recommend-8 .modal-body dl.items,
body#platinumcard #modal-recommend-9 .modal-body dl.items {
	display: block;
	margin: 3vw 0 0;
	background-color: transparent;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div,
body#platinumcard #modal-recommend-9 .modal-body dl.items > div {
	margin: 0 0 4vw;
	padding: 5vw 4vw;
	border: 1px solid transparent;
	border-radius: 14px;
	background: transparent;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div:last-child,
body#platinumcard #modal-recommend-9 .modal-body dl.items > div:last-child {
	margin-bottom: 0;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dt,
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dt {
	display: flex;
	flex-direction: column;
	gap: 2px;
	width: 100%;
	margin: 0 0 3vw;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dt > span:nth-of-type(1),
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dt > span:nth-of-type(1) {
	font-size: var(--fs-small);
	font-weight: normal;
	line-height: 1.3;
	letter-spacing: .04em;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dt > span:nth-of-type(2),
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dt > span:nth-of-type(2) {
	font-size: var(--fs-large);
	font-weight: bold;
	line-height: 1.32;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dd:nth-of-type(1),
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dd:nth-of-type(1) {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	margin: 0;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dd:nth-of-type(1) > img,
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dd:nth-of-type(1) > img {
	display: block;
	width: 100%;
	max-width: 300px;
	height: auto;
	border-radius: 10px;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dd:nth-of-type(2),
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dd:nth-of-type(2) {
	width: 100%;
	margin-top: 4vw;
	text-align: center;
}
body#goldcard #modal-recommend-8 .modal-body dl.items a,
body#platinumcard #modal-recommend-9 .modal-body dl.items a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45em;
	min-width: 60vw;
	padding: 3.5vw 1.4em;
	border-radius: 999px;
	font-weight: bold;
	font-size: var(--fs-base);
	text-decoration: none;
	color: #fff;
}
body#goldcard #modal-recommend-8 .modal-body dl.items a::after,
body#platinumcard #modal-recommend-9 .modal-body dl.items a::after {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	-webkit-mask: url("../../images/special/creditcard/icons/external.svg") center / contain no-repeat;
	        mask: url("../../images/special/creditcard/icons/external.svg") center / contain no-repeat;
	background-color: #fff;
}

/* ---- ゴールド意匠（クリーム基調 × ゴールド／ネイビー：リッチ） ---------- */
body#goldcard #modal-recommend-8.modal.modal-recommend {
	border: 1px solid rgba(216, 199, 159, .7);
	box-shadow: 0 16px 44px rgba(29, 42, 58, .3);
}
body#goldcard #modal-recommend-8 .modal-head {
	background: linear-gradient(90deg, #e9b84a 0%, #f8dd8f 48%, #e6ad3c 100%);
	border-bottom: 1px solid rgba(184, 142, 19, .45);
}
body#goldcard #modal-recommend-8 .modal-head h3 { color: #1d2a3a; }
body#goldcard #modal-recommend-8 .modal-close { color: #1d2a3a; }
body#goldcard #modal-recommend-8 .modal-body {
	background: linear-gradient(180deg, #fffdf8 0%, #fbf5e9 100%);
}
body#goldcard #modal-recommend-8 .modal-body > p { color: #55606d; }
body#goldcard #modal-recommend-8 .modal-body dl.items > div {
	background: #ffffff;
	border-color: rgba(216, 199, 159, .6);
	box-shadow: 0 5px 14px rgba(29, 42, 58, .08);
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dt > span:nth-of-type(1) { color: #6b7280; }
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dt > span:nth-of-type(2) { color: #1d2a3a; }
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dd:nth-of-type(1) > span {
	position: relative;
	display: inline-block;
	margin: 0 0 5vw;
	padding: 1.8vw 4vw;
	border-radius: 10px;
	background: #ffedd0;
	color: #b5610d;
	font-weight: bold;
	font-size: var(--fs-base);
	line-height: 1.25;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dd:nth-of-type(1) > span::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -8px;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-bottom: 0;
	border-top-color: #ffedd0;
}
body#goldcard #modal-recommend-8 .modal-body dl.items > div > dd:nth-of-type(1) > img {
	box-shadow: 0 6px 16px rgba(29, 42, 58, .18);
}
body#goldcard #modal-recommend-8 .modal-body dl.items a {
	background: linear-gradient(180deg, #1c327f 0%, #11205a 100%);
	box-shadow: 0 6px 16px rgba(17, 34, 94, .32);
}

/* ---- プラチナ意匠（チャコール基調 × エメラルド：立体・リッチ） --------- */
body#platinumcard #modal-recommend-9.modal.modal-recommend {
	border: 1px solid rgba(120, 206, 182, .65);
	box-shadow: 0 18px 50px rgba(0, 0, 0, .7);
}
body#platinumcard #modal-recommend-9 .modal-head {
	background: linear-gradient(90deg, #15233c 0%, #123040 100%);
	border-bottom: 3px solid #22d4b5;
}
body#platinumcard #modal-recommend-9 .modal-head h3 { color: #f8f9fb; }
body#platinumcard #modal-recommend-9 .modal-close { color: #f8f9fb; }
body#platinumcard #modal-recommend-9 .modal-body {
	background:
		radial-gradient(180% 95% at 50% -14%,
			rgba(34, 212, 181, .16) 0%,
			rgba(34, 212, 181, .11) 20%,
			rgba(34, 212, 181, .07) 38%,
			rgba(34, 212, 181, .04) 56%,
			rgba(34, 212, 181, .02) 74%,
			rgba(34, 212, 181, .01) 88%,
			rgba(34, 212, 181, 0) 100%),
		linear-gradient(180deg, #243651 0%, #18253c 45%, #0b1119 100%);
}
body#platinumcard #modal-recommend-9 .modal-body > p { color: #c8cfd8; }
body#platinumcard #modal-recommend-9 .modal-body dl.items > div {
	background: linear-gradient(180deg, rgba(9, 16, 26, .5) 0%, rgba(9, 16, 26, .28) 100%);
	border-color: rgba(120, 206, 182, .22);
	box-shadow: 0 8px 22px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 255, 255, .05);
}
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dt > span:nth-of-type(1) { color: rgba(255, 255, 255, .64); }
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dt > span:nth-of-type(2) { color: #f4f6f8; }
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dd:nth-of-type(1) > span {
	position: relative;
	display: inline-block;
	margin: 0 0 5vw;
	padding: 1.8vw 4vw;
	border-radius: 10px;
	background: #f5f3ed;
	color: #14233d;
	font-weight: bold;
	font-size: var(--fs-base);
	line-height: 1.25;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .35);
}
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dd:nth-of-type(1) > span::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -8px;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-bottom: 0;
	border-top-color: #f5f3ed;
}
body#platinumcard #modal-recommend-9 .modal-body dl.items > div > dd:nth-of-type(1) > img {
	box-shadow: 0 8px 22px rgba(0, 0, 0, .6);
}
body#platinumcard #modal-recommend-9 .modal-body dl.items a {
	background: linear-gradient(180deg, #1aa488 0%, #0d7d65 100%);
	box-shadow: 0 8px 20px rgba(13, 125, 101, .4);
}
/* ==== 離脱防止ポップアップ SP ここまで（v2） ==== */