@charset "UTF-8";
/* ============================================================
   Coming Soon 単体ページ / HASEKO こども絵画コンテスト2027
   ボディ1240px・下限420px・背景レンガ無限リピート
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&family=Barlow:wght@600;800&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
img{max-width:100%;height:auto;vertical-align:bottom}
rt{font-size:.5em;letter-spacing:0}
body{
  min-width:420px;
  font-family:"kozuka-gothic-pr6n","Kozuka Gothic Pr6N","小塚ゴシック Pr6N","Noto Sans JP",system-ui,sans-serif;
  color:#374254;line-height:1.9;-webkit-font-smoothing:antialiased;
  background:#f7f6f3 url("../img/brick-w.jpg") 0 0/1228.8px 972.4px;
}
a{color:#2C3792}

.cs{padding:0}
.cs__stage{
  max-width:1240px;margin:0 auto;
  box-shadow:-20px 0 10px rgba(110,88,55,.35), 20px 0 10px rgba(110,88,55,.35);
}
/* 黄レンガのアートゾーン */
.cs__art{
  position:relative;
  background:url("../img/brick-y.jpg") 0 0/1228.8px 972.4px;
  padding:clamp(28px,4.4vw,56px) 4% clamp(16px,2vw,26px);
  text-align:center;overflow:hidden;
}
.cs__glow{
  position:absolute;left:50%;top:2%;transform:translateX(-50%);
  width:88%;max-width:1100px;pointer-events:none;
  /* 下端を溶かして黄レンガへ自然に繋ぐ */
  -webkit-mask:linear-gradient(#000 58%, transparent 96%);
          mask:linear-gradient(#000 58%, transparent 96%);
}
.cs__90th{position:relative;display:block;width:clamp(148px,17.8vw,220px);margin-left:auto}
.cs__logo{position:relative;margin:clamp(6px,1.4vw,18px) auto 0;width:min(86%,1010px)}
.cs__row{
  position:relative;display:flex;align-items:center;justify-content:center;
  gap:clamp(4px,1.2vw,16px);margin-top:clamp(10px,1.8vw,24px);
}
.cs__cloud{flex:none;width:clamp(84px,15.5vw,196px)}
.cs__center{flex:none;padding:0 clamp(4px,1.4vw,18px)}
.cs__soon{
  font-family:"Barlow",sans-serif;font-weight:800;letter-spacing:.06em;
  font-size:clamp(28px,5.2vw,64px);line-height:1.1;color:#2C3792;
}
.cs__date{
  margin-top:.4em;font-weight:900;letter-spacing:.14em;
  font-size:clamp(12px,1.75vw,21px);color:#374254;white-space:nowrap;
}
.cs__lead{
  position:relative;margin-top:clamp(16px,2.6vw,34px);
  font-size:clamp(11px,1.5vw,18px);line-height:2.5;font-weight:500;
}
/* 黄→白の波 */
.cs__wave{
  height:clamp(74px,11.5vw,144px);
  background:url("../img/brick-y.jpg") 0 0/1228.8px 972.4px;
  -webkit-mask:url("../img/wave-mask-full.png") center top/auto 100% no-repeat;
          mask:url("../img/wave-mask-full.png") center top/auto 100% no-repeat;
}
/* フッター */
.cs__footer{padding:clamp(26px,4vw,52px) 6% clamp(46px,6vw,80px);text-align:center}
.cs__archive{margin-bottom:clamp(28px,3.6vw,48px)}
.cs__btn{
  display:inline-block;width:min(620px,92%);
  padding:clamp(14px,1.9vw,24px) clamp(18px,2.4vw,32px);
  background:#2C3792;border:2px solid #2C3792;border-radius:8px;
  color:#fff;text-decoration:none;text-align:center;
  box-shadow:0 6px 14px rgba(44,55,146,.22);
  transition:.2s;
}
.cs__btn-sub{
  display:block;font-size:clamp(10.5px,1.15vw,14px);line-height:1.7;
  letter-spacing:.04em;font-weight:700;opacity:.95;
}
.cs__btn-main{
  display:block;margin-top:.3em;
  font-size:clamp(14px,1.75vw,21px);font-weight:900;letter-spacing:.12em;
}
.cs__btn-main::after{content:"　＞"}
.cs__btn:hover{background:#fff;color:#2C3792;transform:translateY(-2px)}
.cs__haseko{width:min(300px,58%)}
.cs__meta{
  margin-top:clamp(28px,4vw,52px);
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;
  gap:.4em clamp(12px,2vw,28px);
  font-size:clamp(10px,1.05vw,13px);line-height:2;color:#5c6470;
}
.cs__copy{font-family:"Barlow",sans-serif;letter-spacing:.02em}

@media(max-width:760px){
  .cs__row{flex-wrap:wrap}
  .cs__center{order:-1;width:100%;padding-bottom:2%}
  .cs__cloud{width:34%}
  .cs__lead{text-align:center}
}