@charset "utf-8";
/* ==========================================================================
   plan.html 専用スタイル（プランページ）
   ========================================================================== */

#page-plan{
  --p-navy:#1f3d2e;
  --p-accent:#70a19a;
  --p-mint:#e4ecea;
  --p-text:#2c2a24;
  --p-sub:#5a5648;
  --p-font-serif:'Noto Serif JP', serif;
}

#page-plan *{box-sizing:border-box;}
#page-plan img{max-width:100%; height:auto; display:block;}

#page-plan .pc{display:block;}
#page-plan .sp{display:none;}
@media screen and (max-width:960px){
  #page-plan .pc{display:none;}
  #page-plan .sp{display:block;}
}

/* ---------- hero ---------- */
#page-plan .p-hero{
  position:relative;
  width:100%;
  aspect-ratio:16/3.75;
  overflow:hidden;
}
@media screen and (max-width:768px){
  #page-plan .p-hero{
    aspect-ratio:4/3;
  }
  #page-plan .p-hero__obi img{
    -webkit-transform:scaleY(1);
            transform:scaleY(1);
  }
}
#page-plan .p-hero__bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  -o-object-fit:cover;
     object-fit:cover;
  -o-object-position:center;
     object-position:center;
}
#page-plan .p-hero__obi{
  position:absolute;
  top:50%;
  left:0;
  width:100%;
  -webkit-transform:translateY(-50%);
          transform:translateY(-50%);
  line-height:0;
}
#page-plan .p-hero__obi img{
  width:100%;
  height:auto;
  display:block;
  -webkit-transform:scaleY(.667);
          transform:scaleY(.667);
}
#page-plan .p-hero__title{
  position:absolute;
  top:50%;
  left:50%;
  -webkit-transform:translate(-50%,-50%);
          transform:translate(-50%,-50%);
  font-family:'Lato', sans-serif;
  font-weight:400;
  font-size:32px;
  letter-spacing:.3em;
  color:var(--p-navy);
  white-space:nowrap;
}
@media screen and (max-width:600px){
  #page-plan .p-hero__title{
    font-size:20px;
    letter-spacing:.2em;
  }
}

/* ---------- list area ---------- */
#page-plan .p-list{
  background:var(--p-mint);
  padding:60px 20px;
}
@media screen and (max-width:768px){
  #page-plan .p-list{
    padding:30px 12px;
  }
}

/* ---------- card ---------- */
#page-plan .p-card{
  max-width:900px;
  margin:0 auto;
  background:#fff;
  box-shadow:0 4px 16px rgba(31,61,46,.08);
  padding:0 0 40px;
}
#page-plan .p-card:not(:last-child){
  margin-bottom:50px;
}

#page-plan .p-card__bar{
  background:var(--p-accent);
  color:#fff;
  text-align:center;
  font-family:var(--p-font-serif);
  font-size:22px;
  letter-spacing:.1em;
  padding:16px 10px;
  margin-bottom:30px;
}
@media screen and (max-width:600px){
  #page-plan .p-card__bar{
    font-size:16px;
    padding:12px 10px;
  }
}

#page-plan .p-card__type{
  text-align:center;
  font-family:var(--p-font-serif);
  font-size:28px;
  color:var(--p-text);
  letter-spacing:.05em;
  margin-bottom:20px;
}
#page-plan .p-card__type .p-card__wic{
  font-size:18px;
}
@media screen and (max-width:600px){
  #page-plan .p-card__type{font-size:20px;}
  #page-plan .p-card__type .p-card__wic{font-size:14px;}
}

#page-plan .p-card__spec{
  display:flex;
  justify-content:center;
  gap:40px;
  text-align:center;
  font-size:18px;
  color:var(--p-text);
  letter-spacing:.03em;
  margin-bottom:8px;
}
#page-plan .p-card__spec--sub{
  font-size:16px;
  color:var(--p-sub);
  margin-bottom:30px;
}
@media screen and (max-width:600px){
  #page-plan .p-card__spec{
    gap:16px;
    font-size:16px;
  }
  #page-plan .p-card__spec--sub{
    font-size:15px;
  }
}
@media screen and (max-width:420px){
  #page-plan .p-card__spec{
    flex-direction:column;
    gap:4px;
  }
}

#page-plan .p-card__zumen{
  max-width:520px;
  margin:0 auto;
  padding:0 20px;
}

/* ---------- 注釈 ---------- */
#page-plan .td-inner{
  max-width:1120px;
  margin:0 auto;
  padding:0 20px;
}
#page-plan .td-notes{
  background:#fff;
  padding:40px 0 60px;
}
#page-plan .td-notes__list{
  border-top:1px solid #232323;
  padding-top:16px;
  list-style:none;
  margin:0;
}
#page-plan .td-notes__list li{
  font-size:11.5px;
  line-height:1.8;
  color:#232323;
}
@media screen and (max-width:600px){
  #page-plan .td-notes__list li{font-size:9.5px; line-height:1.6;}
}