/* ================================================================
   privilege2.css — タウンハウジングの特典_2 (pv2-)
   ================================================================ */

/* ── Hero ── */
.pv2-hero {
  position: relative;
  overflow: hidden;
  /*background: linear-gradient(135deg, #004077 0%, #005fa3 60%, #1a7ab8 100%);*/
  background: #f5f5f5;
  min-height: clamp(280px, 35vw, 500px);
}

.pv2-hero__geo {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
.pv2-hero__geo span {
  position: absolute;
  display: block;
  background: rgba(180,180,180,0.18);
  transform: rotate(45deg);
  transform-origin: center;
}
.pv2-hero__geo span:nth-child(1) { width: 340px; height: 340px; top: -80px;  left: -60px; }
.pv2-hero__geo span:nth-child(2) { width: 240px; height: 240px; top: 60px;   left: 80px;  background: rgba(160,160,160,0.12); }
.pv2-hero__geo span:nth-child(3) { width: 400px; height: 400px; top: 100px;  left: -120px; background: rgba(200,200,200,0.10); }
.pv2-hero__geo span:nth-child(4) { width: 200px; height: 200px; top: 200px;  left: 200px;  background: rgba(150,150,150,0.10); }
.pv2-hero__geo span:nth-child(5) { width: 280px; height: 280px; top: -40px;  left: 180px;  background: rgba(170,170,170,0.08); }

.pv2-hero .hero__wrap {
  /*position: relative;*/
  z-index: 1;
  display: flex;
  align-items: center;
  gap: clamp(20px, 4vw, 60px);
  max-width: 1400px;
  margin: 0 auto;
  padding: clamp(40px, 5vw, 80px) clamp(20px, 5vw, 60px) clamp(60px, 7vw, 100px);
}

.pv2-hero__inner {
  flex: 1;
  min-width: 0;
}

.pv2-hero__title-box {
  display: inline-block;
  /*background: #009A59;*/
  padding: clamp(8px,1vw,12px) clamp(16px,2vw,28px);
  margin-bottom: 16px;
}
.pv2-hero__title-box h1 {
  font-size: clamp(22px, 3.2vw, 46px);
  font-weight: 700;
  /*color: #fff;*/
  letter-spacing: .04em;
  line-height: 1.25;
}

.pv2-hero__subtitle {
    font-size: clamp(13px, 1.4vw, 18px);
    /* color: rgba(255, 255, 255, .9); */
    line-height: 1.7;
    background-image: url(../img/title_bg.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    padding: 40px;
    max-width: 520px;
}

.pv2-hero__photo {
  /*flex: 0 0 auto;
  width: clamp(200px, 38%, 540px);*/
      position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 55%;
    z-index: 1;
    pointer-events: none;
    overflow: hidden;
}
.pv2-hero__photo img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 4px;
    object-fit: cover;
}

/* ── Content layout ── */
.pv2-content {
  /*background: #f0f0f0;*/
  padding: clamp(32px,4vw,64px) 0 clamp(48px,6vw,80px);
}
.pv2-content__grid {
  display: grid;
  grid-template-columns: 1fr clamp(220px, 19.7%, 278px);
  gap: clamp(20px, 3vw, 40px);
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 clamp(16px, 4vw, 60px);
  align-items: start;
}

.pv2-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(24px, 3vw, 40px);
}

/* ── Catch / intro ── */
.pv2-catch {
  background: #fff;
  border-radius: 4px;
  padding: clamp(20px, 3vw, 36px);
}

.pv2-catch__banner {
  position: relative;
  background: #C4E5E7;
  padding: clamp(16px, 2vw, 24px) clamp(24px, 4vw, 48px);
  margin-bottom: 20px;
  clip-path: polygon(12px 0, 100% 0, calc(100% - 12px) 100%, 0 100%);
}

.pv2-catch__heading {
  font-size: clamp(15px, 1.6vw, 20px);
  font-weight: 700;
  color: #333;
  line-height: 1.65;
  text-align: center;
}

.pv2-catch__lead {
  text-align: center;
  padding-bottom: 4px;
  border-bottom: 1px solid #ccc;
}
.pv2-catch__lead p {
  font-size: 14px;
  color: #E87450;
  line-height: 1.8;
}

/* ── Section header ── */
.pv2-section-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 4px;
}
.pv2-section-header__bar {
  width: 4px;
  height: 36px;
  background: #009A59;
  flex-shrink: 0;
  border-radius: 2px;
}
.pv2-section-header__title {
  font-size: clamp(17px, 1.8vw, 24px);
  font-weight: 700;
  color: #333;
  letter-spacing: .03em;
}

/* ── Cards grid ── */
.pv2-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(12px, 1.6vw, 20px);
}

.pv2-card {
  display: flex;
  flex-direction: column;
}

.pv2-card__frame {
  /*background: #C4E5E7;*/
  border: 2px solid #8ECECE;
  /*border-radius: 10px;*/
  padding: 0 0 clamp(16px, 2vw, 24px);
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* ── Ribbon banner ── */
.pv2-card__ribbon {
  display: flex;
  justify-content: center;
  margin: clamp(16px, 2vw, 24px) 0 clamp(12px, 1.5vw, 18px);
  background-image: url(../img/ribbon.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.pv2-card__ribbon-text {
  position: relative;
  display: inline-block;
  /* background: #8ECECE; */
  padding: 8px clamp(12px, 2vw, 20px) 24px;
  font-size: clamp(12px, 1.1vw, 14px);
  font-weight: 600;
  color: #333;
  text-align: center;
  white-space: nowrap;
}

/*.pv2-card__ribbon-text::before,
.pv2-card__ribbon-text::after {
  content: '';
  position: absolute;
  top: 10px;
  width: 18px;
  height: 100%;
  background: #8ECECE;
}*/

.pv2-card__ribbon-text::before { left: -18px; }
.pv2-card__ribbon-text::after  { right: -18px; }

/* ── Card body ── */
.pv2-card__body {
  padding: 0 clamp(12px, 2vw, 20px);
  text-align: center;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(8px, 1vw, 12px);
}

.pv2-card__desc {
  font-size: 13px;
  color: #444;
  line-height: 1.7;
}

.pv2-card__value {
  font-size: clamp(16px, 1.8vw, 22px);
  font-weight: 700;
  color: #E87450;
  line-height: 1.4;
}
.pv2-card__value .pv2-card__prefix {
  font-size: 13px;
  font-weight: 400;
  color: #555;
}

.pv2-card__divider {
  width: 80%;
  height: 1px;
  background: #8ECECE;
  margin: 4px 0;
}

.pv2-card__note {
  font-size: 12px;
  color: #555;
  line-height: 1.5;
}
.pv2-card__note-small {
  font-size: 12px;
  color: #555;
  line-height: 1.5;
}

/* Card bottom layout (icon + note) */
.pv2-card__bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  width: 100%;
  gap: 8px;
  margin-top: auto;
}

/* Gift box icon – CSS art */
.pv2-card__icon--gift {
  flex-shrink: 0;
  width: clamp(44px, 5vw, 60px);
  height: clamp(44px, 5vw, 60px);
  position: relative;
}
/*.pv2-card__icon--gift::before {
  content: '';
  position: absolute;
  inset: 20% 10% 0;
  border: 2px solid #8ECECE;
  border-top: none;
  background: transparent;
}
.pv2-card__icon--gift::after {
  content: '';
  position: absolute;
  top: 16%;
  left: 5%;
  right: 5%;
  height: 22%;
  border: 2px solid #8ECECE;
  background: transparent;
}*/

/* Coupon box in card 3 */
.pv2-card__coupon-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 20px 0 8px;
  gap: 12px;
}
.pv2-card__coupon-box {
  border: 2px dashed #C8A832;
  background: rgba(248,185,0,.12);
  color: #7a6210;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .12em;
  padding: 8px 28px;
}
.pv2-card__coupon-deco {
  display: inline-block;
  width: 12px;
  height: 12px;
  border: 2px solid #8ECECE;
  transform: rotate(45deg);
  flex-shrink: 0;
}
/* ----------------------------------------------------------
   6. Coupon section
   ---------------------------------------------------------- */
.privilege-coupon {
  background: #f6fcf9;
  border: 1px solid rgba(0, 154, 89, 0.2);
  border-radius: 14px;
  padding: clamp(22px, 2.29vw, 36px) clamp(24px, 2.5vw, 40px);
  margin-bottom: clamp(32px, 3.33vw, 56px);
  display: flex;
  gap: clamp(20px, 2.5vw, 40px);
  align-items: flex-start;
  margin-top: 30px;
}

.privilege-coupon__icon {
  flex-shrink: 0;
  width: clamp(52px, 5.2vw, 80px);
  height: clamp(52px, 5.2vw, 80px);
  background: #009A59;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(22px, 2.29vw, 36px);
  color: #fff;
}

.privilege-coupon__content {
  flex: 1;
  min-width: 0;
}

.privilege-coupon__title {
  font-size: clamp(15px, 1.15vw, 18px);
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 10px;
}

.privilege-coupon__steps {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.privilege-coupon__step {
  display: flex;
  /*align-items: baseline;*/
  align-items: center;
  gap: 10px;
  font-size: clamp(12px, 0.83vw, 13px);
  color: #444;
  line-height: 1.7;
}
.privilege-tokuten__note {
    padding: 10px 20px;
    background-color: #009a59;
    color: #FFF;
    font-size: 1.2em;
    border-radius: 5px;
}

.privilege-coupon__step-num {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  background: #009A59;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
}

.privilege-coupon__note {
  font-size: 11px;
  color: #999;
  line-height: 1.7;
  margin: 0;
  padding-top: 10px;
  border-top: 1px solid rgba(0, 154, 89, 0.15);
  text-align: left;
}

/* ── Notes section ── */
.pv2-notes {
  background: #fff;
  border-radius: 4px;
  padding: clamp(16px, 2.5vw, 28px) clamp(16px, 2.5vw, 28px);
}
.pv2-notes p {
  font-size: 14px;
  color: #333;
  line-height: 1.8;
}
.pv2-notes__list {
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
  border-top: 1px solid #ddd;
  padding-top: 14px;
}
.pv2-notes__list li {
  font-size: 13px;
  color: #555;
  line-height: 1.7;
}

/* ── Print section ── */
.pv2-print {
  background: #fff;
  border-radius: 4px;
  padding: clamp(20px, 2.5vw, 32px) clamp(16px, 2.5vw, 28px);
  display: flex;
  align-items: center;
  gap: clamp(16px, 3vw, 40px);
  flex-wrap: wrap;
}
.pv2-print__text {
  flex: 1;
  min-width: 200px;
}
.pv2-print__text p {
  font-size: 14px;
  color: #333;
  line-height: 2;
}
.pv2-print__btn-wrap {
  flex-shrink: 0;
}
.pv2-print__btn {
  display: flex;
  align-items: center;
  gap: 20px;
  background: #F8B900;
  border: none;
  border-radius: 8px;
  padding: clamp(14px, 1.5vw, 20px) clamp(20px, 2.5vw, 32px);
  cursor: pointer;
  min-width: clamp(220px, 28vw, 340px);
  justify-content: space-between;
  transition: opacity .2s;
}
.pv2-print__btn:hover { opacity: .85; }
.pv2-print__btn span {
  font-size: clamp(13px, 1.2vw, 16px);
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
}
.pv2-print__btn svg {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
}

/* ── Store section ── */
.pv2-store {
  background: #fff;
  border-radius: 4px;
  padding: clamp(16px, 2.5vw, 28px);
}
.pv2-store__lead {
  font-size: 14px;
  color: #333;
  margin-bottom: 12px;
}
.pv2-store__btn {
  display: flex;
  align-items: center;
  gap: 20px;
  background: #009A59;
  border-radius: 8px;
  padding: clamp(14px, 1.5vw, 20px) clamp(20px, 2.5vw, 32px);
  text-decoration: none;
  min-width: clamp(220px, 28vw, 340px);
  max-width: 360px;
  justify-content: space-between;
  transition: opacity .2s;
}
.pv2-store__btn:hover { opacity: .85; }
.pv2-store__btn span {
  font-size: clamp(13px, 1.2vw, 16px);
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
}
.pv2-store__btn svg {
  flex-shrink: 0;
  width: 50px;
  height: 40px;
}

/* ----------------------------------------------------------
   8. Store CTA
   ---------------------------------------------------------- */
.privilege-store {
  margin-bottom: clamp(32px, 3.33vw, 56px);
}

.privilege-store__inner {
  background: #efefef;
  border-radius: 14px;
  padding: clamp(24px, 2.5vw, 40px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.privilege-store__text-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.privilege-store__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.18em;
  color: #009A59;
  text-transform: uppercase;
  margin: 0;
}

.privilege-store__title {
  font-size: clamp(16px, 1.35vw, 22px);
  font-weight: 700;
  color: #333;
  margin: 0;
  line-height: 1.3;
}

.privilege-store__desc {
  font-size: clamp(12px, 0.83vw, 13px);
  color: #333;
  margin: 0;
  line-height: 1.7;
}

.privilege-store__btn {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: clamp(12px, 1.04vw, 16px) clamp(24px, 2.08vw, 36px);
  background: #009A59;
  color: #fff;
  border-radius: 100px;
  font-size: clamp(13px, 0.94vw, 14px);
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 4px 16px rgba(0, 154, 89, 0.4);
  transition: box-shadow 0.24s, transform 0.24s;
}

.privilege-store__btn:hover {
  box-shadow: 0 8px 24px rgba(0, 154, 89, 0.5);
  transform: translateY(-2px);
}

.privilege-store__btn::after {
  content: '→';
  transition: transform 0.22s;
}

.privilege-store__btn:hover::after {
  transform: translateX(4px);
}
/* ----------------------------------------------------------
   9. Cross-promotion banner (coop)
   ---------------------------------------------------------- */
.privilege-crosslink {
  background: linear-gradient(135deg, #f0f8f4 0%, #e6f4ed 100%);
  border: 1px solid rgba(0, 154, 89, 0.2);
  border-radius: 14px;
  padding: clamp(20px, 2.08vw, 32px) clamp(22px, 2.29vw, 36px);
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  transition: box-shadow 0.24s, transform 0.24s;
  margin-bottom: clamp(16px, 1.67vw, 24px);
}

.privilege-crosslink:hover {
  box-shadow: 0 6px 24px rgba(0, 154, 89, 0.15);
  transform: translateY(-2px);
}

.privilege-crosslink__icon {
  flex-shrink: 0;
  width: clamp(44px, 4.17vw, 64px);
  height: clamp(44px, 4.17vw, 64px);
  background: #009A59;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(20px, 2.08vw, 32px);
  color: #fff;
}

.privilege-crosslink__content {
  flex: 1;
  min-width: 0;
}

.privilege-crosslink__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #009A59;
  text-transform: uppercase;
  margin: 0 0 4px;
}

.privilege-crosslink__title {
  font-size: clamp(14px, 1.04vw, 16px);
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 4px;
  line-height: 1.4;
}

.privilege-crosslink__desc {
  font-size: clamp(11px, 0.73vw, 12px);
  color: #666;
  margin: 0;
  line-height: 1.6;
}

.privilege-crosslink__arrow {
  flex-shrink: 0;
  font-size: 18px;
  color: #009A59;
  transition: transform 0.22s;
}

.privilege-crosslink:hover .privilege-crosslink__arrow {
  transform: translateX(4px);
}
.inline_block{
  display: inline-block;
}
/* ================================================================
   Responsive
   ================================================================ */

/* 1200px */
@media (max-width: 1200px) {
  .pv2-hero .hero__wrap { padding-left: 32px; padding-right: 32px; }
}

/* 1024px */
@media (max-width: 1024px) {
  .pv2-content__grid {
    grid-template-columns: 1fr clamp(200px, 24%, 240px);
    gap: 20px;
  }
  .pv2-cards { grid-template-columns: 1fr 1fr; gap: 12px; }
  .pv2-card__value { font-size: clamp(14px, 1.8vw, 18px); }
  .pv2-print { flex-direction: column; align-items: flex-start; }
}

/* 768px */
@media (max-width: 768px) {
  .pv2-hero .hero__wrap { flex-direction: column; }
  .pv2-hero__photo { width: 100%; max-width: 400px; margin: 0 auto; }
  .pv2-content__grid { grid-template-columns: 1fr; }
  .pv2-cards { grid-template-columns: 1fr 1fr; gap: 10px; }
  .pv2-card__ribbon-text { font-size: 11px; padding: 6px 10px; }
  .pv2-card__value { font-size: 15px; }
  .pv2-catch__banner { clip-path: none; border-radius: 4px; }
}

/* 480px */
@media (max-width: 480px) {
  .pv2-cards { grid-template-columns: 1fr; }
  .pv2-card__frame { padding-bottom: 20px; }
  .pv2-hero__title-box h1 { font-size: 22px; }
  .pv2-print__btn,
  .pv2-store__btn { min-width: 0; width: 100%; }
  .pv2-hero .hero__wrap {
    flex-direction: column-reverse;
    padding: 0;
    gap: 0;
    }
    .pv2-hero__subtitle {
    padding: 20px 40px;
  }
  .pv2-hero__title-box {
    margin-bottom: 0;
}
.privilege-store__inner {
    flex-direction: column;
}
.privilege-store__btn {
    width: 100%;
    justify-content: center;
}
.privilege-crosslink__icon{
  display: none;
}


}