/* イラストの募集（v1。2026-11-12 書き直し）。接頭辞 cb-。共通の部品は va.css（絵の枠 .va-frame もそこ） */

/* ===== 題名の段：左に呼びかけ、右に空きの額3枚と2羽 ===== */
.cb-ph .va-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-areas:"tx wall" "talk wall";gap:10px 48px;align-items:start}
.cb-ph-tx{grid-area:tx}
.cb-ph .lead b{background:linear-gradient(transparent 62%,rgba(238,90,54,.32) 62%)}
.cb-go{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}
.cb-wall{grid-area:wall;position:relative;height:420px;margin-top:8px}
.cb-wall>div{position:absolute}
.cb-wall .f1{left:6%;top:30px;width:40%;transform:rotate(-4deg);z-index:2}
.cb-wall .f2{left:40%;top:0;width:36%;transform:rotate(3deg);z-index:3}
.cb-wall .f3{right:0;top:150px;width:30%;transform:rotate(-1.5deg);z-index:1}
.cb-wall .va-frame .in span{font-size:14px}
.cb-spark{position:absolute;left:36%;top:-14px;width:40px;height:40px;z-index:4;transform:rotate(12deg)}
.cb-spark svg{display:block;width:100%;height:100%}
.cb-talk{grid-area:talk;display:grid;gap:12px;margin-top:6px}
.cb-talk .row{display:flex;align-items:flex-end;gap:16px}
.cb-talk .row.b{justify-content:flex-end}
.cb-talk .va-say{max-width:24em;margin-bottom:26px}
.cb-bird{position:relative;flex:none;display:block}
.cb-bird img{display:block;width:auto;height:112px}
.cb-bird.b img{height:96px}
.cb-bird .va-plate{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%) rotate(-3deg)}
.cb-bird.b .va-plate{transform:translateX(-50%) rotate(3deg)}

/* ===== 1. 載る場所 ===== */
.cb-where{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.cb-where .va-card{padding:22px 22px 24px}
.cb-where .en,.cb-gal .en{font-family:var(--en);font-weight:800;font-size:11px;letter-spacing:.1em;color:var(--coral)}
.cb-where h3,.cb-gal h3{font-weight:900;font-size:24px;letter-spacing:-.03em;margin:4px 0 10px}
.cb-where p{font-size:14.5px;line-height:1.8;color:var(--ink2)}
.cb-where p b{color:var(--ink)}
.cb-where .va-note{margin-top:10px}
.cb-where .va-link{display:inline-block;margin-top:12px}

/* ===== 2. 載せる絵・載せない絵（OK／NGの判を押した2列） ===== */
.cb-rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.cb-rules .col{border:var(--bd);background:var(--paper);box-shadow:var(--sh)}
.cb-rules h3{padding:10px 18px;border-bottom:var(--bd);font-weight:900;font-size:17px;background:var(--teal);color:#fff}
.cb-rules .ng h3{background:var(--ink)}
.cb-rules ul{padding:6px 18px 10px}
.cb-rules li{display:flex;gap:14px;align-items:flex-start;padding:12px 0;border-bottom:1.5px dashed var(--line)}
.cb-rules li:last-child{border-bottom:0}
.cb-rules .mk{flex:none;display:grid;place-items:center;width:44px;height:44px;border:2.5px solid currentColor;border-radius:999px;font-family:var(--en);font-weight:800;font-size:11px;letter-spacing:.04em;transform:rotate(-10deg)}
.cb-rules .mk.ok{color:var(--teal)}
.cb-rules .mk.ng{color:var(--coral)}
.cb-rules li b{display:block;font-weight:900;font-size:15.5px;line-height:1.5;color:var(--ink)}
.cb-rules li small{display:block;font-size:13px;line-height:1.7;color:var(--mute);margin-top:2px}

/* ===== 3. 応募のしかた ===== */
.cb-how{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:start}
.cb-steps li{display:flex;gap:18px;padding:16px 0;border-bottom:1.5px dashed var(--line)}
.cb-steps li:first-child{border-top:var(--bd)}
.cb-steps li:last-child{border-bottom:var(--bd)}
.cb-steps .n{flex:none;font-family:var(--en);font-weight:800;font-size:30px;line-height:1;color:var(--coral);width:36px}
.cb-steps h3{font-weight:900;font-size:18px;line-height:1.4}
.cb-steps p{font-size:14px;line-height:1.8;color:var(--ink2);margin-top:4px}
.cb-mail{border:var(--bd);background:var(--paper);box-shadow:8px 8px 0 var(--ink)}
.cb-mail .cap{display:flex;gap:10px;align-items:baseline;padding:11px 18px;background:var(--ink);color:#bdb8ab;font-family:var(--px);font-size:11px}
.cb-mail .cap b{font-family:var(--jp);font-weight:900;font-size:14px;color:var(--paper2)}
.cb-mail dl{padding:8px 18px 4px}
.cb-mail dl>div{display:grid;grid-template-columns:minmax(0,13em) minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1.5px dashed var(--line);font-size:13.5px;line-height:1.6}
.cb-mail dt{font-weight:700;color:var(--ink)}
.cb-mail dd{color:var(--ink2)}
.cb-mail dd i{display:block;height:1.2em;border-bottom:1.5px dotted var(--mute)}
.cb-mail .act{display:flex;flex-wrap:wrap;gap:12px;padding:14px 18px 6px}
.cb-mail .va-note{padding:0 18px 14px}

/* ===== 4. お約束（インクの地） ===== */
.cb-promise{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1.5px solid #4a4741}
.cb-promise li{padding:18px 20px 6px 0;border-right:1.5px dashed #4a4741;margin-right:20px}
.cb-promise li:last-child{border-right:0;margin-right:0}
.cb-promise b{display:block;font-weight:900;font-size:17px;line-height:1.45;color:var(--paper2)}
.cb-promise b::before{content:"";display:block;width:26px;height:8px;background:var(--coral);transform:skewX(-20deg);margin-bottom:12px}
.cb-promise span{display:block;font-size:13.5px;line-height:1.8;color:#bdb8ab;margin-top:6px}

/* ===== 5. おわりに（お願いの一言とボタン。真ん中にそろえる） ===== */
.cb-ty{display:grid;justify-items:center;text-align:center;gap:12px;padding:8px 0}
.cb-ty-h{font-weight:900;font-size:clamp(26px,3.2vw,40px);line-height:1.35;letter-spacing:-.03em;color:var(--ink);font-feature-settings:"palt"}
.cb-ty-p{max-width:36em;font-size:15.5px;line-height:1.9;color:var(--ink2)}
.cb-ty-go{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:10px}

@media (max-width:980px){
  .cb-ph .va-in{grid-template-columns:1fr;grid-template-areas:"tx" "wall" "talk"}
  .cb-wall{height:330px;max-width:560px}
  .cb-where{grid-template-columns:1fr}
  .cb-how{grid-template-columns:1fr}
  .cb-promise{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cb-promise li:nth-child(2){border-right:0;margin-right:0}
}
@media (max-width:620px){
  .cb-wall{height:260px}
  .cb-wall .va-frame{padding:6px 6px 0}
  .cb-wall .va-frame figcaption{font-size:9px;padding:5px 0 6px}
  .cb-wall .va-frame figcaption b{font-size:10px}
  .cb-wall .va-frame .in span{font-size:11px}
  .cb-wall .va-frame .in b{font-size:8px}
  .cb-wall .f1{left:0;width:44%}
  .cb-wall .f2{left:38%;width:40%}
  .cb-wall .f3{top:120px;width:32%}
  .cb-bird img{height:84px}
  .cb-bird.b img{height:72px}
  .cb-talk .va-say{font-size:14px}
  .cb-rules{grid-template-columns:1fr}
  .cb-mail dl>div{grid-template-columns:1fr;gap:2px}
  .cb-promise{grid-template-columns:1fr}
  .cb-promise li{border-right:0;margin-right:0;border-bottom:1.5px dashed #4a4741;padding-bottom:16px}
}
.cb-wall .f3 figcaption span:last-child{display:none}

/* 2026-11-15：載せる絵は運営者が選ぶ・応募の決まり（応募規約）・Gmail で書く */
.cb-nb{display:inline-block}
.cb-pick{width:100%;margin-top:28px;padding:14px 18px;border:2px dashed var(--ink);background:var(--paper2);font-size:14.5px;line-height:1.85;color:var(--ink2)}
.cb-pick b{display:block;font-weight:900;font-size:16px;color:var(--ink)}
.cb-mail .att dd{font-size:13px;line-height:1.7;color:var(--ink2)}
.cb-mail .act{display:flex;flex-wrap:wrap;gap:10px}
.cb-terms-link{padding:0 18px 16px!important;margin-top:-6px}
.cb-terms-link .va-link{font-size:inherit}

/* ===== 題名の段の右の図：イーゼル（判断 ARTWALL「b」。2026-11-15 描き直し） ===== */
.cb-wall{height:auto;min-height:0}
.cb-wall>.cb-easel{position:relative}
.cb-easel{width:min(400px,66%);aspect-ratio:400/600;margin-left:2%}
.cb-easel svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.cb-easel .legs{z-index:0}
.cb-easel .front{z-index:2}
/* キャンバス：受け台の上に立つ（下の端＝受け台の上の面）。上は留め具の下 */
.cb-easel .cv{position:absolute;z-index:1;left:12.5%;width:75%;bottom:28.67%;aspect-ratio:4/5;display:grid;place-items:center;text-align:center;
  background:repeating-linear-gradient(-45deg,transparent 0 11px,rgba(21,21,21,.045) 11px 12px),var(--paper2);border:3px solid var(--ink);box-shadow:7px 7px 0 var(--ink)}
.cb-easel .cv::before{content:"";position:absolute;inset:14px;border:1.5px dashed var(--mute);pointer-events:none}
.cb-easel .cv p{position:relative;display:grid;gap:4px}
.cb-easel .cv b{font-family:var(--cur);font-weight:700;font-size:clamp(26px,3vw,40px);line-height:1;color:var(--coral);transform:rotate(-4deg)}
.cb-easel .cv span{font-weight:900;font-size:clamp(16px,1.7vw,22px);line-height:1.45;letter-spacing:.02em;color:var(--ink)}
.cb-easel .cb-spark{left:auto;right:6%;top:4%}
/* 立てかけた額：イーゼルの右の脚の方へ傾ける */
.cb-wall .lean{position:absolute;right:0;bottom:0;width:30%;transform:rotate(-6deg);transform-origin:100% 100%;z-index:3}
.cb-wall .lean .va-frame{box-shadow:6px 4px 0 var(--ink)}
@media (min-width:981px){.cb-wall{align-self:center}}
@media (max-width:980px){.cb-easel{width:min(320px,64%)}.cb-wall{height:auto!important}}
@media (max-width:620px){.cb-easel .cv::before{inset:9px}.cb-easel .cv span{font-size:14px}}

/* ===== 送り方の札（応募フォーム／メール） ===== */
.cb-tabs{position:relative;z-index:1;display:flex;gap:6px;margin-bottom:-2px}
.cb-tabs button{font-family:var(--jp);font-weight:900;font-size:14px;line-height:1.4;padding:10px 18px 9px;border:var(--bd);border-bottom:0;background:var(--paper);color:var(--ink2);cursor:pointer}
.cb-tabs button:hover{color:var(--coral-d)}
.cb-tabs button[aria-selected="true"]{background:var(--ink);color:var(--paper2)}
.cb-tabs button:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
.cb-send>.cb-terms-link{padding:14px 2px 0!important;margin:0}
@media (max-width:620px){.cb-tabs button{flex:1;padding:10px 8px 9px;font-size:13px}}