@charset "UTF-8";

/* =========================================================
   フリーペーパー「adtown」専用
   ※既存の pages.css / luxury-background_cont.css を生かす
========================================================= */

.adtown-paper-page{
  position:relative;
}

/* =========================================================
   HERO
========================================================= */

.adtown-paper-page .page-hero{
  padding-bottom:110px;
}

.adtown-paper-page .page-hero h1{
  max-width:980px;
  letter-spacing:-.045em;
}

.adtown-paper-page .page-hero h1 span{
  color:#F21163;
}

.adtown-paper-page .paper-hero-lead{
  max-width:760px;
  font-size:16px;
  line-height:2;
}

/* =========================================================
   INTRO
========================================================= */

.paper-seo-intro{
  padding:115px 40px;
}

.paper-seo-intro-inner{
  max-width:1160px;
  margin:0 auto;
}

.paper-seo-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:90px;
  align-items:start;
}

.paper-seo-heading h2{
  margin:0;
  font-size:clamp(38px,4.4vw,64px);
  line-height:1.2;
  letter-spacing:-.045em;
  font-weight:800;
}

.paper-seo-heading h2 span{
  color:#F21163;
}

.paper-seo-copy p{
  margin:0 0 22px;
  font-size:14px;
  line-height:2.1;
  color:#687777;
}

.paper-answer-box{
  margin-top:32px;
  padding:26px 28px;
  border-left:3px solid #F21163;
  background:rgba(255,255,255,.72);
}

.paper-answer-box strong{
  display:block;
  margin-bottom:8px;
  font-size:14px;
  color:#142121;
}

.paper-answer-box p{
  margin:0;
  color:#142121;
}

/* =========================================================
   AREA / KEYWORD CONTEXT
========================================================= */

.paper-area-section{
  padding:110px 40px;
}

.paper-area-inner{
  max-width:1160px;
  margin:0 auto;
}

.paper-section-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:40px;
  margin-bottom:45px;
}

.paper-section-head h2{
  margin:12px 0 0;
  font-size:clamp(34px,4vw,58px);
  line-height:1.2;
  letter-spacing:-.04em;
}

.paper-section-head h2 span{
  color:#F21163;
}

.paper-section-head > p{
  max-width:430px;
  margin:0;
  font-size:13px;
  line-height:1.9;
  color:#687777;
}

.paper-area-list{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.paper-area-card{
  position:relative;
  min-height:230px;
  padding:30px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(20,33,33,.08);
  transition:transform .35s ease,box-shadow .35s ease;
}

.paper-area-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 45px rgba(20,33,33,.08);
}

.paper-area-card .num{
  display:block;
  margin-bottom:24px;
  font:700 10px Inter,sans-serif;
  letter-spacing:.14em;
  color:#F21163;
}

.paper-area-card h3{
  margin:0 0 12px;
  font-size:23px;
  line-height:1.4;
}

.paper-area-card p{
  margin:0;
  color:#687777;
  font-size:13px;
  line-height:1.9;
}

/* =========================================================
   AD VALUE
========================================================= */

.paper-ad-value{
  max-width:none;
  padding-left:max(40px,calc((100vw - 1160px)/2));
  padding-right:max(40px,calc((100vw - 1160px)/2));
  background:#101818;
  color:#fff;
}

.paper-ad-value .paper-section-head h2{
  color:#fff;
}

.paper-ad-value .paper-section-head > p{
  color:#aabbbb;
}

.paper-ad-value .section-label{
  color:#7ed5d5;
}

.paper-ad-list{
  border-top:1px solid #344242;
}

.paper-ad-item{
  display:grid;
  grid-template-columns:55px 1fr 1.15fr 28px;
  gap:20px;
  align-items:center;
  padding:28px 0;
  border-bottom:1px solid #344242;
}

.paper-ad-item .num{
  color:#7ed5d5;
  font:600 10px Inter,sans-serif;
}

.paper-ad-item strong {
  color: #222;
  font-size: 20px;
  font-weight: 700;
}

.paper-ad-item p{
  margin:0;
  color:#9babab;
  font-size:12px;
  line-height:1.8;
}

.paper-ad-item b{
  color:#F21163;
  font-size:20px;
  font-weight:400;
}

/* =========================================================
   ADVERTISER TYPES
========================================================= */

.paper-target-section{
  padding:115px 40px;
}

.paper-target-inner{
  max-width:1160px;
  margin:0 auto;
}

.paper-target-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:90px;
  align-items:start;
}

.paper-target-copy h2{
  margin:12px 0 24px;
  font-size:clamp(34px,4vw,58px);
  line-height:1.2;
  letter-spacing:-.04em;
}

.paper-target-copy h2 span{
  color:#F21163;
}

.paper-target-copy > p{
  margin:0;
  color:#687777;
  font-size:14px;
  line-height:2;
}

.paper-check-list{
  margin:30px 0 0;
  padding:0;
  list-style:none;
  border-top:1px solid #dfe8e8;
}

.paper-check-list li{
  position:relative;
  padding:16px 0 16px 30px;
  border-bottom:1px solid #dfe8e8;
  font-size:13px;
  font-weight:600;
}

.paper-check-list li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:14px;
  color:#F21163;
  font-weight:800;
}

.paper-target-box{
  padding:34px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(20,33,33,.08);
}

.paper-target-box .box-label{
  display:block;
  margin-bottom:18px;
  font:700 10px Inter,sans-serif;
  letter-spacing:.16em;
  color:#F21163;
}

.paper-target-box ul{
  margin:0;
  padding:0;
  list-style:none;
}

.paper-target-box li{
  padding:14px 0;
  border-bottom:1px solid #dfe8e8;
  font-size:13px;
}

.paper-target-box li:last-child{
  border-bottom:0;
}

/* =========================================================
   PAPER ISSUE
========================================================= */

.adtown-paper-page .paper-showcase{
  padding-top:120px;
  padding-bottom:120px;
}

.adtown-paper-page .paper-showcase-grid{
  max-width:1160px;
  margin:0 auto;
}

/* =========================================================
   FAQ
   既存 faq-new を活用し、ページ専用幅だけ調整
========================================================= */

.adtown-paper-page .faq-new{
  background:rgba(255,255,255,.68);
}

.adtown-paper-page .faq-new-inner{
  width:min(1160px,calc(100% - 80px));
}

.adtown-paper-page .faq-new-heading h2 span{
  color:#F21163;
}

/* =========================================================
   CTA
========================================================= */

.adtown-paper-page .cta-strip{
  position:relative;
  overflow:hidden;
}

.adtown-paper-page .cta-strip::after{
  content:"adtown";
  position:absolute;
  right:-3%;
  bottom:-24%;
  font:800 180px Inter,sans-serif;
  letter-spacing:-.08em;
  color:rgba(255,255,255,.08);
  pointer-events:none;
}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:800px){

  .adtown-paper-page .page-hero{
    padding-bottom:75px;
  }

  .adtown-paper-page .paper-hero-lead{
    font-size:14px;
  }

  .paper-seo-intro,
  .paper-area-section,
  .paper-target-section{
    padding:85px 25px;
  }

  .paper-seo-grid,
  .paper-target-grid{
    grid-template-columns:1fr;
    gap:42px;
  }

  .paper-seo-heading h2,
  .paper-target-copy h2{
    font-size:36px;
  }

  .paper-answer-box{
    padding:22px 20px;
  }

  .paper-section-head{
    display:block;
    margin-bottom:35px;
  }

  .paper-section-head > p{
    margin-top:20px;
  }

  .paper-area-list{
    grid-template-columns:1fr;
  }

  .paper-area-card{
    min-height:auto;
  }

  .paper-ad-value{
    padding:85px 25px;
  }

  .paper-ad-item{
    grid-template-columns:38px 1fr 22px;
    gap:12px;
  }

  .paper-ad-item p{
    display:none;
  }

  .adtown-paper-page .paper-showcase{
    padding-top:85px;
    padding-bottom:85px;
  }

  .adtown-paper-page .faq-new-inner{
    width:calc(100% - 36px);
  }

  .adtown-paper-page .cta-strip::after{
    font-size:90px;
  }
}

@media(max-width:480px){

  .paper-answer-box p,
  .paper-target-copy > p{
    font-size:13px;
  }

  .paper-area-card h3{
    font-size:20px;
  }

@media (max-width: 480px) {

  .paper-answer-box p,
  .paper-target-copy > p {
    font-size: 13px;
  }

  .paper-area-card h3 {
    font-size: 20px;
  }

  .paper-ad-item strong {
    color: #222;
    font-size: 16px;
    font-weight: 700;
  }

}

}