/* v6.3.0 — VARIABLE HEIGHT WEB FLYER */ .entrance-event-public,.entrance-event-archive{max-width:1080px;margin:38px auto 90px;padding:0 18px} .entrance-flyer-switch{display:flex;justify-content:center;gap:8px;margin:0 auto 14px} .entrance-flyer-switch button,.entrance-event-public__tools button{border:3px solid #171717;background:#fff;color:#171717;padding:9px 16px;font-weight:1000;cursor:pointer} .entrance-flyer-switch button[aria-pressed=true]{background:#171717;color:#fff} .entrance-flyer-stage{position:relative;width:min(794px,100%);height:auto!important;margin:0 auto;perspective:1800px} .entrance-flyer-scale{position:relative!important;width:100%!important;height:auto!important;transform:none!important} .entrance-flyer-card{position:relative;width:100%!important;height:auto!important;transform-style:preserve-3d;transition:transform .66s cubic-bezier(.2,.75,.25,1)} .entrance-flyer-card.is-flipped{transform:rotateY(180deg)} .entrance-flyer-side{position:relative!important;width:100%!important;height:auto!important;backface-visibility:hidden;-webkit-backface-visibility:hidden} .entrance-flyer-side--back{position:absolute!important;inset:0!important;transform:rotateY(180deg)} .entrance-event-poster{--accent:#827bb4;box-sizing:border-box;width:100%;height:auto!important;overflow:hidden;background:#fff;color:#161616;border:6px solid #202020;box-shadow:10px 10px 0 #202020;font-family:"Arial Black","Arial Narrow Bold","Noto Sans JP","Yu Gothic",sans-serif} .entrance-event-poster.is-shop{--accent:#827bb4}.entrance-event-poster.is-gym{--accent:#2377c9}.entrance-event-poster.is-away{--accent:#9b60c5}.entrance-event-poster.is-general{--accent:#555} .entrance-event-poster__top{display:flex;justify-content:center;align-items:center;padding:18px 24px 15px;background:#303030;color:var(--accent);border-bottom:6px solid #202020} .entrance-event-poster__top span{font-size:72px;font-style:italic;font-weight:1000;letter-spacing:-.065em;line-height:.82;text-align:center;text-shadow:-4px 4px 0 #fff,4px 4px 0 #fff,4px -4px 0 #fff,-4px -4px 0 #fff;transform:skewX(-7deg)} .entrance-event-poster__title{display:grid;place-items:center;padding:24px 26px 20px;font-size:58px;font-weight:1000;line-height:1.05;text-align:center;transform:translateX(var(--title-indent,0))} /* Left natural height; right image flexes to same row height. */ .entrance-event-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);gap:12px;padding:0 24px 18px;align-items:stretch} .event-primary,.event-visual{min-width:0} .event-primary{display:flex;flex-direction:column} .event-visual{display:flex;flex-direction:column;gap:10px;height:100%} .event-info-stack{display:flex;flex-direction:column;gap:8px} .event-info-line{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:.7em;align-items:start;padding:8px 10px;border:2px solid #202020;border-radius:9px;background:#fff} .event-info-label{font-size:12px;font-weight:1000;line-height:1.2;white-space:nowrap} .event-info-content{min-width:0} .event-date-line{display:flex;align-items:baseline;white-space:nowrap;margin:0;font-size:36px;line-height:.95;overflow:hidden} .event-date-line b{display:flex;align-items:baseline;white-space:nowrap} .event-date-number{font-size:1em}.event-date-unit{font-size:.58em;margin:0 .03em} .event-date-line i{display:flex;align-items:baseline;margin-left:.08em;font-size:.58em;font-style:normal;font-weight:1000} .weekday-paren{color:#111}.is-sat .weekday-char{color:#55b9ef}.is-sun .weekday-char{color:#e53935}.is-holiday .weekday-char{color:#e95420} .event-time-line{margin-top:2px;font-size:23px;line-height:1;text-align:left;white-space:nowrap} .event-info-line.is-place strong{display:block;white-space:nowrap;overflow:hidden;font-size:20px;line-height:1.05} .event-place-address{display:block;margin-top:2px;font-size:9px} /* Fee heading on top + large readable values */ .event-fees-section{padding:9px 10px 10px;border:3px solid var(--accent);border-radius:10px;background:#fff} .event-section-title{display:inline-block;margin-bottom:7px;padding:4px 10px;border-radius:7px;background:var(--accent);color:#fff;font-size:14px;font-weight:1000} .event-fee-list{display:flex;flex-direction:column;gap:7px} .event-fee-item{padding:7px 9px;border-radius:8px;background:#f4f4f6} .event-fee-item.is-featured{outline:2px solid var(--accent);outline-offset:-2px} .event-fee-main{display:flex;align-items:baseline;justify-content:space-between;gap:12px} .event-fee-main b{font-size:17px;line-height:1.15;white-space:nowrap} .event-fee-main strong{font-size:30px;line-height:1;color:var(--accent);white-space:nowrap} .event-fee-item em{display:block;margin-top:3px;font-size:10px;line-height:1.3;font-style:normal} .event-capacity-line{display:flex;align-items:center;gap:10px} .event-capacity-line strong{flex:0 0 auto;font-size:22px;white-space:nowrap} .event-capacity-line em{flex:1 1 auto;font-size:8px;line-height:1.25;font-style:normal} .event-mini-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px} .event-mini-card{min-width:0;padding:7px 8px;border:2px solid #202020;border-radius:9px;background:#fff} .event-mini-card small{display:inline-block;margin-bottom:4px;padding:3px 7px;border-radius:6px;background:#f0f1f4;font-size:10px;font-weight:1000} .event-mini-card strong{display:block;font-size:15px;line-height:1.15}.event-mini-card em{display:block;margin-top:3px;font-size:7.5px;line-height:1.25;font-style:normal} /* Right image follows the LEFT column height. */ .event-main-image{flex:1 1 260px;min-height:260px;display:grid;place-items:center;border:3px solid #9aa3af;border-radius:14px;background:#f2f3f5;overflow:hidden} .event-main-image img{width:100%;height:100%;object-fit:cover}.event-main-image.is-contain img{object-fit:contain}.event-main-image.is-cover img{object-fit:cover} .event-main-image span{color:#9aa3af;font-size:28px;font-weight:1000} .event-winner-prize{flex:0 0 auto;padding:9px 10px;text-align:center;border:3px solid var(--accent);border-radius:14px;background:#fff} .event-winner-prize h3{margin:-9px -10px 8px;padding:7px 10px;background:var(--accent);color:#fff;font-size:20px}.event-winner-prize img{max-width:100%;height:125px;object-fit:contain}.event-winner-prize strong{display:block;margin-top:4px;font-size:22px}.event-winner-prize p{margin:3px 0 0;font-size:11px} .event-other-prizes{flex:0 0 auto;padding:8px;border:3px solid #202020;border-radius:14px}.event-other-prizes h4{margin:0 0 6px;text-align:center}.event-other-prizes>div{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.event-other-prizes article{text-align:center;font-size:9px}.event-other-prizes img{width:100%;aspect-ratio:1;object-fit:contain} /* Lower blocks */ .event-benefits,.event-free-blocks{margin-top:10px;padding:8px;border:3px solid #202020;border-radius:12px;background:#fff} .event-benefits article{display:grid;grid-template-columns:74px 1fr;gap:8px;align-items:center}.event-benefits img{width:74px;height:60px;object-fit:contain} .event-free-blocks article{display:grid;grid-template-columns:auto 1fr;gap:6px}.event-free-blocks img{width:56px;height:48px;object-fit:contain} .event-poster-bottom{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(120px,.7fr) 96px;gap:8px;align-items:end;margin-top:10px} .event-poster-bottom.no-notices.no-organizer{grid-template-columns:96px;justify-content:end}.event-poster-bottom.has-notices.no-organizer{grid-template-columns:minmax(0,1fr) 96px}.event-poster-bottom.no-notices.has-organizer{grid-template-columns:minmax(0,1fr) 96px} .event-notices,.event-organizers,.event-qr{padding:7px 9px;border:2px solid #202020;border-radius:10px;background:#fff}.event-qr{justify-self:end;width:96px;box-sizing:border-box;text-align:center}.event-qr img{width:78px;height:78px}.event-qr a{display:grid;color:#111;text-decoration:none}.event-organizers p{display:grid;grid-template-columns:42px 1fr;gap:4px;margin:0} .entrance-event-public__tools{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:24px 0}.entrance-event-public__tools button{background:#171717;color:#fff} .entrance-event-public__info{max-width:794px;margin:0 auto}.entrance-event-public__description{margin:0 0 24px;padding:18px;border:3px solid #111;background:#fff}.entrance-event-public__reserve{padding:18px;border:4px solid #111;background:#fffdf4;box-shadow:7px 7px 0 #111;scroll-margin-top:30px} /* Mobile = real responsive card, width locked to viewport. */ @media(max-width:650px){ .entrance-event-public{width:100%;max-width:100%;box-sizing:border-box;padding:0 8px;overflow-x:hidden} .entrance-flyer-stage{width:100%;max-width:100%}.entrance-flyer-scale,.entrance-flyer-card,.entrance-event-poster{width:100%!important;max-width:100%!important} .entrance-event-poster{box-shadow:6px 6px 0 #202020} .entrance-event-poster__top{padding:14px 12px 12px}.entrance-event-poster__top span{font-size:11vw;text-shadow:-2px 2px 0 #fff,2px 2px 0 #fff,2px -2px 0 #fff,-2px -2px 0 #fff} .entrance-event-poster__title{padding:18px 14px 16px;font-size:8vw} .entrance-event-layout{grid-template-columns:1fr;gap:10px;padding:0 10px 12px} .event-main-image{min-height:52vw}.event-date-line{font-size:8vw}.event-time-line{font-size:5vw}.event-info-line.is-place strong{font-size:4.8vw} .event-fee-main b{font-size:4.3vw}.event-fee-main strong{font-size:7.2vw}.event-mini-grid{grid-template-columns:1fr 1fr} .event-poster-bottom{grid-template-columns:minmax(0,1fr) 84px!important}.event-organizers{display:none}.event-qr{width:84px}.event-qr img{width:68px;height:68px} } /* Only print mode is A4. */ @media print{ @page{size:A4 portrait;margin:0} body *{visibility:hidden!important} .entrance-flyer-side.is-printing,.entrance-flyer-side.is-printing *{visibility:visible!important} .entrance-flyer-side.is-printing{position:fixed!important;left:0!important;top:0!important;width:210mm!important;height:297mm!important;transform:none!important} .entrance-flyer-side.is-printing .entrance-event-poster{width:210mm!important;max-height:297mm!important;border:0!important;box-shadow:none!important} } /* v6.3.1 — POSTER TYPESETTING / LESS FORM, MORE FLYER */ .entrance-event-poster__title{padding-top:18px!important;padding-bottom:14px!important} .entrance-event-layout{gap:10px!important;padding:0 18px 14px!important} .event-info-stack{gap:4px!important} /* Text rows: remove heavy boxes */ .event-info-line{ border:0!important; border-radius:0!important; background:transparent!important; padding:3px 0!important; column-gap:.65em!important; } .event-info-label{font-size:11px!important;line-height:1.05!important} .event-date-line{font-size:33px!important} .event-time-line{font-size:21px!important;margin-top:0!important} .event-info-line.is-place strong{font-size:19px!important} .event-place-address{font-size:8px!important} /* PARTICIPATION FEE = full-width purple band */ .event-fees-section{ border:0!important; border-radius:0!important; background:transparent!important; padding:0!important; margin-top:2px!important; } .event-fee-band{ width:100%!important; box-sizing:border-box!important; padding:5px 8px!important; margin:0 0 5px!important; background:var(--accent)!important; color:#fff!important; font-size:15px!important; font-weight:1000!important; line-height:1!important; text-align:center!important; border-radius:0!important; } .event-fee-list{gap:2px!important} .event-fee-item, .event-fee-item.is-featured{ background:transparent!important; border:0!important; border-radius:0!important; outline:0!important; padding:4px 2px 5px!important; } .event-fee-item + .event-fee-item{ border-top:1px solid #d8d8df!important; padding-top:6px!important; } .event-fee-main b{font-size:18px!important} .event-fee-main strong{font-size:31px!important} .event-fee-item em{font-size:9px!important;margin-top:1px!important} /* Capacity = one simple line */ .event-info-line.is-capacity{padding-top:4px!important;padding-bottom:4px!important} .event-capacity-line strong{font-size:22px!important} .event-capacity-line em{font-size:8px!important} /* Only compact cards keep borders */ .event-mini-grid{gap:5px!important;margin-top:1px!important} .event-mini-card{ padding:5px 6px!important; border-width:1.5px!important; border-radius:7px!important; } .event-mini-card small{margin-bottom:2px!important;padding:2px 5px!important;font-size:9px!important} .event-mini-card strong{font-size:14px!important} .event-mini-card em{font-size:7px!important;margin-top:1px!important} /* Tighter right side */ .event-visual{gap:8px!important} .event-main-image{min-height:225px!important;flex-basis:225px!important} .event-winner-prize{padding-top:7px!important;padding-bottom:7px!important} .event-winner-prize h3{ margin-top:-7px!important; margin-left:-10px!important; margin-right:-10px!important; margin-bottom:6px!important; padding:6px 10px!important; } .event-winner-prize img{height:110px!important} .event-winner-prize strong{font-size:20px!important} .event-winner-prize p{font-size:9px!important} /* Bottom area tighter */ .event-poster-bottom{margin-top:6px!important} .event-notices,.event-organizers,.event-qr{padding:5px 7px!important;border-width:1.5px!important} .event-organizers p{font-size:10px!important} .event-qr{width:88px!important} .event-qr img{width:70px!important;height:70px!important} @media(max-width:650px){ .entrance-event-layout{padding:0 8px 10px!important} .event-info-stack{gap:3px!important} .event-info-line{padding:2px 0!important} .event-date-line{font-size:7.8vw!important} .event-time-line{font-size:4.6vw!important} .event-info-line.is-place strong{font-size:4.5vw!important} .event-fee-band{font-size:3.8vw!important;padding:4px 6px!important} .event-fee-main b{font-size:4.4vw!important} .event-fee-main strong{font-size:7.1vw!important} .event-fee-item em{font-size:2.4vw!important} .event-main-image{min-height:46vw!important} } /* v6.3.2 FEE ENCLOSURE + RHYTHM */ .event-info-stack{gap:4px!important}.event-info-line{margin:0!important;padding:2px 0!important;border:0!important;background:transparent!important}.event-info-line.is-datetime{padding:2px 0 3px!important}.event-date-line{line-height:1!important}.event-time-line{margin-top:6px!important;line-height:1.05!important}.event-info-line.is-place{padding:2px 0 3px!important}.event-info-line.is-capacity{padding:2px 0!important} .event-fees-section{box-sizing:border-box!important;margin:1px 0!important;padding:0 8px 7px!important;border:2px solid var(--accent)!important;border-radius:9px!important;background:#fff!important;overflow:hidden!important}.event-fee-band{box-sizing:border-box!important;width:calc(100% + 16px)!important;margin:0 -8px 6px!important;padding:5px 8px!important;background:var(--accent)!important;color:#fff!important;font-size:15px!important;font-weight:1000!important;line-height:1.15!important;text-align:center!important;white-space:nowrap!important}.event-fee-list{gap:0!important}.event-fee-item,.event-fee-item.is-featured{margin:0!important;padding:5px 2px!important;border:0!important;border-radius:0!important;outline:0!important;background:transparent!important}.event-fee-item + .event-fee-item{border-top:1px solid #d8d8df!important}.event-fee-main{line-height:1.05!important}.event-fee-main b{font-size:18px!important}.event-fee-main strong{font-size:31px!important}.event-fee-item em{margin-top:3px!important;font-size:9px!important;line-height:1.25!important}.event-mini-grid{margin-top:0!important;gap:5px!important} @media(max-width:650px){.event-info-stack{gap:3px!important}.event-info-line{padding:2px 0!important}.event-info-line.is-datetime{padding-bottom:3px!important}.event-time-line{margin-top:5px!important}.event-fees-section{padding:0 7px 6px!important}.event-fee-band{width:calc(100% + 14px)!important;margin-left:-7px!important;margin-right:-7px!important;margin-bottom:5px!important;font-size:3.8vw!important}} /* v6.4.0 SHOP FIXED A4 */ .entrance-event-poster{width:min(100%,794px)!important;aspect-ratio:210/297!important;min-height:0!important;overflow:hidden!important;background:#fff!important} .entrance-event-poster__type{height:142px!important;min-height:142px!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:0 24px!important;background:#303030!important} .entrance-event-poster__type span,.entrance-event-poster__type strong{font-family:Impact,"Arial Black","Noto Sans JP",sans-serif!important;font-style:italic!important;font-weight:1000!important;font-size:72px!important;line-height:.9!important;letter-spacing:-4px!important;transform:skewX(-8deg)!important;color:var(--accent)!important;-webkit-text-stroke:5px #fff!important;text-shadow:5px 5px 0 rgba(0,0,0,.32)!important;white-space:nowrap!important} .entrance-event-poster__title{min-height:154px!important;padding:22px 30px 15px!important;display:flex!important;align-items:center!important;justify-content:center!important;font-family:"Arial Black","Noto Sans JP",sans-serif!important;font-weight:1000!important;line-height:1.02!important;letter-spacing:-2px!important;text-align:center!important} .entrance-event-layout{display:grid!important;grid-template-columns:44% 56%!important;gap:12px!important;padding:0 22px!important;align-items:start!important} .event-info-stack{display:block!important} .event-info-line{display:grid!important;grid-template-columns:58px minmax(0,1fr)!important;column-gap:7px!important;align-items:start!important;padding:4px 0!important;margin:0!important;border:0!important;background:transparent!important} .event-info-label{padding-top:4px!important;font-size:11px!important;white-space:nowrap!important} .event-date-line{font-size:31px!important;line-height:1!important}.event-time-line{font-size:19px!important;line-height:1!important;margin-top:5px!important} .event-info-line.is-place strong{font-size:18px!important;line-height:1.1!important} .event-fees-section{margin:5px 0 6px!important;border:2px solid var(--accent)!important;border-radius:8px!important;padding:0 8px 6px!important;background:#fff!important;overflow:hidden!important} .event-fee-band{margin:0 -8px 5px!important;width:calc(100% + 16px)!important;min-height:28px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:var(--accent)!important;color:#fff!important;font-size:15px!important;font-weight:1000!important;line-height:1!important} .event-fee-item,.event-fee-item.is-featured{padding:5px 2px!important;border:0!important;background:transparent!important}.event-fee-item+.event-fee-item{border-top:1px solid #d9d9df!important} .event-fee-main b{font-size:16px!important}.event-fee-main strong{font-size:28px!important}.event-fee-item em{font-size:8px!important;line-height:1.15!important} /* compact 2x2: capacity + three existing small attributes */ .event-info-line.is-capacity{float:left!important;width:50%!important;min-height:82px!important;display:block!important;border:1.5px solid #222!important;border-radius:7px 0 0 0!important;padding:6px!important} .event-info-line.is-capacity .event-info-label{display:block!important;padding:0!important;margin-bottom:4px!important;font-size:9px!important}.event-capacity-line{display:flex!important;align-items:baseline!important;gap:6px!important}.event-capacity-line strong{font-size:19px!important}.event-capacity-line em{font-size:7px!important;line-height:1.15!important} .event-mini-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:0!important;margin:0!important} .event-mini-card{min-height:82px!important;border:1.5px solid #222!important;border-radius:0!important;padding:6px!important}.event-mini-card small{display:block!important;width:max-content!important;padding:2px 4px!important;margin:0 0 4px!important;font-size:8px!important}.event-mini-card strong{font-size:12px!important;line-height:1.1!important}.event-mini-card em{font-size:7px!important;line-height:1.1!important} .event-mini-grid .event-mini-card:nth-child(1){border-radius:0 7px 0 0!important}.event-mini-grid .event-mini-card:nth-child(2){border-radius:0 0 0 7px!important}.event-mini-grid .event-mini-card:nth-child(3){border-radius:0 0 7px 0!important}.event-info-stack:after{content:"";display:block;clear:both} .event-visual{gap:8px!important}.event-main-image{height:340px!important;min-height:340px!important;flex-basis:340px!important}.event-winner-prize{min-height:270px!important;padding:8px 10px!important}.event-winner-prize h3{margin:-8px -10px 8px!important;padding:7px 10px!important}.event-winner-prize img{height:135px!important;max-height:135px!important}.event-winner-prize strong{font-size:21px!important}.event-winner-prize p{font-size:9px!important} .event-notices{display:none!important} .event-poster-bottom{margin:12px 22px 0!important;display:grid!important;grid-template-columns:1fr 96px!important;gap:10px!important;align-items:end!important}.event-organizers{min-height:54px!important;padding:7px 10px!important}.event-qr{width:96px!important;padding:5px!important}.event-qr img{width:74px!important;height:74px!important} @media(max-width:820px){.entrance-event-poster{width:100%!important}.entrance-event-poster__type{height:17.9vw!important;min-height:17.9vw!important}.entrance-event-poster__type span,.entrance-event-poster__type strong{font-size:9vw!important;-webkit-text-stroke:.62vw #fff!important;letter-spacing:-.5vw!important}.entrance-event-poster__title{min-height:19.4vw!important;padding:2.7vw 3.8vw 1.9vw!important}.entrance-event-layout{gap:1.5vw!important;padding:0 2.8vw!important}.event-info-line{grid-template-columns:7.3vw minmax(0,1fr)!important;column-gap:.9vw!important;padding:.5vw 0!important}.event-info-label{font-size:1.38vw!important}.event-date-line{font-size:3.9vw!important}.event-time-line{font-size:2.4vw!important;margin-top:.6vw!important}.event-info-line.is-place strong{font-size:2.25vw!important}.event-fees-section{margin:.6vw 0 .75vw!important;padding:0 1vw .75vw!important}.event-fee-band{margin:0 -1vw .6vw!important;width:calc(100% + 2vw)!important;min-height:3.5vw!important;font-size:1.9vw!important}.event-fee-main b{font-size:2vw!important}.event-fee-main strong{font-size:3.5vw!important}.event-fee-item em{font-size:1vw!important}.event-info-line.is-capacity,.event-mini-card{min-height:10.3vw!important;padding:.75vw!important}.event-capacity-line strong{font-size:2.4vw!important}.event-mini-card strong{font-size:1.5vw!important}.event-main-image{height:42.8vw!important;min-height:42.8vw!important;flex-basis:42.8vw!important}.event-winner-prize{min-height:34vw!important}.event-winner-prize img{height:17vw!important;max-height:17vw!important}.event-poster-bottom{margin:1.5vw 2.8vw 0!important;grid-template-columns:1fr 12vw!important}.event-qr{width:12vw!important}.event-qr img{width:9.3vw!important;height:9.3vw!important}} @media print{.entrance-event-poster{width:210mm!important;height:297mm!important;aspect-ratio:auto!important}} /* ========================================================= v6.4.1 — SHOP FIXED TEMPLATE / REAL CLASS FIX ========================================================= */ /* REAL header class is __top, not __type. */ .entrance-event-poster__top{ min-height:148px!important; height:148px!important; display:flex!important; align-items:center!important; justify-content:center!important; padding:0 24px!important; background:#303030!important; border-bottom:6px solid #202020!important; overflow:hidden!important; } .entrance-event-poster__top span{ display:block!important; font-family:Impact,"Arial Black","Noto Sans JP",sans-serif!important; font-style:italic!important; font-weight:1000!important; font-size:74px!important; line-height:.88!important; letter-spacing:-4px!important; transform:skewX(-8deg)!important; color:var(--accent)!important; -webkit-text-stroke:5px #fff!important; text-shadow:5px 5px 0 rgba(0,0,0,.32)!important; white-space:nowrap!important; } /* Event title: loud but fixed. */ .entrance-event-poster__title{ min-height:150px!important; padding:18px 28px 14px!important; font-family:"Arial Black","Noto Sans JP",sans-serif!important; font-size:54px!important; font-weight:1000!important; line-height:1.02!important; letter-spacing:-2px!important; text-align:center!important; text-shadow:2px 2px 0 #fff,4px 4px 0 rgba(0,0,0,.08)!important; } /* Fixed A4 face. */ .entrance-event-poster{ width:min(100%,794px)!important; height:1123px!important; aspect-ratio:210/297!important; overflow:hidden!important; } .entrance-event-layout{ display:grid!important; grid-template-columns:44% 56%!important; gap:12px!important; padding:0 22px!important; align-items:start!important; } /* Keep date/place/fee compact. */ .event-info-stack{gap:4px!important} .event-info-line{ border:0!important; background:transparent!important; padding:3px 0!important; margin:0!important; } .event-info-line.is-datetime{ display:grid!important; grid-template-columns:58px minmax(0,1fr)!important; column-gap:7px!important; } .event-info-line.is-place{ display:grid!important; grid-template-columns:58px minmax(0,1fr)!important; column-gap:7px!important; } .event-info-label{font-size:11px!important;padding-top:4px!important} .event-date-line{font-size:31px!important;line-height:1!important} .event-time-line{font-size:19px!important;line-height:1!important;margin-top:5px!important} .event-info-line.is-place strong{font-size:18px!important;line-height:1.1!important} /* Fee block: one framed unit, purple band. */ .event-fees-section{ margin:5px 0 7px!important; border:2px solid var(--accent)!important; border-radius:8px!important; padding:0 8px 6px!important; background:#fff!important; overflow:hidden!important; } .event-fee-band{ margin:0 -8px 5px!important; width:calc(100% + 16px)!important; min-height:30px!important; display:flex!important; align-items:center!important; justify-content:center!important; background:var(--accent)!important; color:#fff!important; font-size:15px!important; font-weight:1000!important; line-height:1!important; } .event-fee-main b{font-size:16px!important} .event-fee-main strong{font-size:28px!important} .event-fee-item em{font-size:8px!important;line-height:1.15!important} /* THE ACTUAL fixed 2x2 grid. */ .event-fixed-grid{ display:grid!important; grid-template-columns:1fr 1fr!important; grid-template-rows:88px 88px!important; gap:6px!important; margin-top:5px!important; clear:both!important; } .event-fixed-card{ min-width:0!important; padding:7px 8px!important; border:1.5px solid #222!important; border-radius:8px!important; background:#fff!important; overflow:hidden!important; } .event-fixed-card small{ display:inline-block!important; margin-bottom:5px!important; padding:2px 5px!important; border-radius:5px!important; background:#f0f1f4!important; font-size:9px!important; font-weight:1000!important; line-height:1!important; } .event-fixed-card strong{ display:block!important; font-size:14px!important; line-height:1.15!important; } .event-fixed-card em{ display:block!important; margin-top:3px!important; font-size:7px!important; line-height:1.15!important; font-style:normal!important; } .event-fixed-card .event-capacity-line{ display:flex!important; align-items:center!important; gap:6px!important; } .event-fixed-card .event-capacity-line strong{ flex:0 0 auto!important; font-size:21px!important; } .event-fixed-card .event-capacity-line em{ flex:1 1 auto!important; margin:0!important; font-size:7px!important; } .event-fixed-placeholder{ display:grid!important; place-items:center!important; height:48px!important; color:var(--accent)!important; font-family:Impact,"Arial Black",sans-serif!important; font-size:17px!important; font-style:italic!important; opacity:.16!important; } /* Right fixed image/prize seats. */ .event-main-image{ height:350px!important; min-height:350px!important; flex-basis:350px!important; } .event-winner-prize{ min-height:275px!important; padding:8px 10px!important; } .event-winner-prize img{ height:138px!important; max-height:138px!important; } .event-winner-prize strong{font-size:21px!important} .event-winner-prize p{font-size:9px!important} /* No notes on SHOP fixed poster. */ .event-notices{display:none!important} /* Bottom: organizer + QR only. */ .event-poster-bottom{ position:absolute!important; left:22px!important; right:22px!important; bottom:20px!important; display:grid!important; grid-template-columns:1fr 96px!important; gap:10px!important; margin:0!important; align-items:end!important; } .entrance-event-poster{position:relative!important} .event-organizers{min-height:54px!important} .event-qr{width:96px!important} .event-qr img{width:74px!important;height:74px!important} /* Scale fixed A4 as one unit on screen. */ @media(max-width:820px){ .entrance-event-poster{ width:100%!important; height:auto!important; aspect-ratio:210/297!important; } .entrance-event-poster__top{ height:18.6vw!important; min-height:18.6vw!important; } .entrance-event-poster__top span{ font-size:9.3vw!important; -webkit-text-stroke:.63vw #fff!important; letter-spacing:-.5vw!important; } .entrance-event-poster__title{ min-height:18.9vw!important; padding:2.3vw 3.5vw 1.8vw!important; font-size:6.8vw!important; } .entrance-event-layout{ grid-template-columns:44% 56%!important; gap:1.5vw!important; padding:0 2.8vw!important; } .event-info-line.is-datetime, .event-info-line.is-place{ grid-template-columns:7.3vw minmax(0,1fr)!important; column-gap:.9vw!important; } .event-info-label{font-size:1.4vw!important} .event-date-line{font-size:3.9vw!important} .event-time-line{font-size:2.4vw!important} .event-info-line.is-place strong{font-size:2.25vw!important} .event-fee-band{min-height:3.8vw!important;font-size:1.9vw!important} .event-fee-main b{font-size:2vw!important} .event-fee-main strong{font-size:3.5vw!important} .event-fee-item em{font-size:1vw!important} .event-fixed-grid{ grid-template-rows:11.1vw 11.1vw!important; gap:.75vw!important; } .event-fixed-card{padding:.9vw 1vw!important;border-radius:1vw!important} .event-fixed-card small{font-size:1.15vw!important;margin-bottom:.6vw!important} .event-fixed-card strong{font-size:1.75vw!important} .event-fixed-card em{font-size:.9vw!important} .event-fixed-card .event-capacity-line strong{font-size:2.6vw!important} .event-fixed-placeholder{height:6vw!important;font-size:2.1vw!important} .event-main-image{height:44.1vw!important;min-height:44.1vw!important;flex-basis:44.1vw!important} .event-winner-prize{min-height:34.6vw!important} .event-winner-prize img{height:17.4vw!important;max-height:17.4vw!important} .event-poster-bottom{left:2.8vw!important;right:2.8vw!important;bottom:2.5vw!important;grid-template-columns:1fr 12vw!important;gap:1.25vw!important} .event-qr{width:12vw!important} .event-qr img{width:9.3vw!important;height:9.3vw!important} } /* ========================================================= v6.4.2 — STEP 1: PC DISPLAY SIZE ONLY Keep the 794x1123 fixed poster internally and scale the whole finished poster down for desktop viewing. ========================================================= */ @media(min-width:821px){ .entrance-flyer-stage{ position:relative!important; margin:0 auto!important; perspective:1800px!important; overflow:visible!important; } .entrance-flyer-scale{ position:absolute!important; left:0!important; top:0!important; width:794px!important; height:1123px!important; transform-origin:top left!important; transform:scale(var(--desktop-flyer-scale,.72))!important; } .entrance-flyer-card, .entrance-flyer-side, .entrance-event-poster{ width:794px!important; height:1123px!important; max-width:none!important; } } /* Mobile remains full-width and does not inherit desktop scaling. */ @media(max-width:820px){ .entrance-flyer-stage{ width:100%!important; height:auto!important; } .entrance-flyer-scale{ position:relative!important; left:auto!important; top:auto!important; width:100%!important; height:auto!important; transform:none!important; } .entrance-flyer-card, .entrance-flyer-side, .entrance-event-poster{ width:100%!important; height:auto!important; max-width:100%!important; } } /* v6.4.3 — make PC view inspectable + QR bottom-left */ @media(min-width:821px){ .entrance-flyer-scale{ transform:scale(var(--desktop-flyer-scale,.84))!important; } } /* Organizer is not part of the fixed poster. */ .event-organizers{ display:none!important; } /* Bottom area = QR only, aligned left. */ .event-poster-bottom, .event-poster-bottom.has-notices.has-organizer, .event-poster-bottom.has-notices.no-organizer, .event-poster-bottom.no-notices.has-organizer, .event-poster-bottom.no-notices.no-organizer{ left:22px!important; right:22px!important; bottom:20px!important; display:grid!important; grid-template-columns:96px!important; justify-content:start!important; align-items:end!important; margin:0!important; } .event-qr{ grid-column:1!important; justify-self:start!important; width:96px!important; } /* v6.4.4 FOOTER CLEARANCE */ .entrance-event-public{ position:relative!important; box-sizing:border-box!important; padding-bottom:120px!important; margin-bottom:0!important; } .entrance-flyer-stage{ display:block!important; position:relative!important; margin-bottom:24px!important; } .entrance-event-public__tools{ position:relative!important; margin-bottom:28px!important; } .entrance-event-public::after{ content:""; display:block; clear:both; height:1px; } @media(max-width:820px){ .entrance-event-public{padding-bottom:72px!important} .entrance-flyer-stage{margin-bottom:18px!important} } /* v6.4.5 — ACTUAL footer-overlap fix Root cause: .entrance-flyer-stage had height:auto!important, so JS's calculated scaled height could not reserve document flow. */ @media(min-width:821px){ .entrance-flyer-stage{ height:calc(1123px * var(--desktop-flyer-scale,.84))!important; width:calc(794px * var(--desktop-flyer-scale,.84))!important; margin-bottom:28px!important; } } /* ========================================================= v6.5.0 — ABSOLUTE A4 MASTER 794 x 1123 fixed canvas. Every block gets a fixed seat. ========================================================= */ .entrance-event-poster{ position:relative!important; width:794px!important; height:1123px!important; min-width:794px!important; min-height:1123px!important; max-width:794px!important; max-height:1123px!important; aspect-ratio:auto!important; overflow:hidden!important; box-sizing:border-box!important; } /* Header */ .entrance-event-poster__top{ position:absolute!important; left:0!important; top:0!important; width:794px!important; height:150px!important; box-sizing:border-box!important; margin:0!important; padding:0 28px!important; display:flex!important; align-items:center!important; justify-content:center!important; } /* Title */ .entrance-event-poster__title{ position:absolute!important; left:28px!important; top:158px!important; width:738px!important; height:138px!important; box-sizing:border-box!important; margin:0!important; padding:12px 20px!important; display:flex!important; align-items:center!important; justify-content:center!important; overflow:hidden!important; } /* Main content becomes a positioning layer */ .entrance-event-layout{ position:absolute!important; left:22px!important; top:306px!important; width:750px!important; height:695px!important; display:block!important; margin:0!important; padding:0!important; } /* LEFT COLUMN */ .event-primary{ position:absolute!important; left:0!important; top:0!important; width:320px!important; height:620px!important; margin:0!important; padding:0!important; } .event-info-stack{ position:relative!important; width:320px!important; height:620px!important; display:block!important; margin:0!important; padding:0!important; } /* Date/time */ .event-info-line.is-datetime{ position:absolute!important; left:0!important; top:0!important; width:320px!important; height:82px!important; display:grid!important; grid-template-columns:62px 1fr!important; column-gap:8px!important; margin:0!important; padding:4px 2px!important; box-sizing:border-box!important; } /* Place */ .event-info-line.is-place{ position:absolute!important; left:0!important; top:86px!important; width:320px!important; height:48px!important; display:grid!important; grid-template-columns:62px 1fr!important; column-gap:8px!important; margin:0!important; padding:4px 2px!important; box-sizing:border-box!important; } /* Fee block */ .event-fees-section{ position:absolute!important; left:0!important; top:140px!important; width:320px!important; height:190px!important; box-sizing:border-box!important; margin:0!important; padding:0 10px 8px!important; border:2px solid var(--accent)!important; border-radius:8px!important; overflow:hidden!important; background:#fff!important; } .event-fee-band{ height:32px!important; min-height:32px!important; margin:0 -10px 6px!important; width:calc(100% + 20px)!important; display:flex!important; align-items:center!important; justify-content:center!important; } /* Fixed 2x2 matrix */ .event-fixed-grid{ position:absolute!important; left:0!important; top:340px!important; width:320px!important; height:180px!important; display:grid!important; grid-template-columns:157px 157px!important; grid-template-rows:87px 87px!important; gap:6px!important; margin:0!important; padding:0!important; } .event-fixed-card{ width:157px!important; height:87px!important; min-height:87px!important; box-sizing:border-box!important; margin:0!important; padding:7px 8px!important; overflow:hidden!important; } /* RIGHT COLUMN */ .event-visual{ position:absolute!important; left:332px!important; top:0!important; width:418px!important; height:620px!important; display:block!important; margin:0!important; padding:0!important; } /* Main image */ .event-main-image{ position:absolute!important; left:0!important; top:0!important; width:418px!important; height:350px!important; min-height:350px!important; max-height:350px!important; margin:0!important; padding:0!important; box-sizing:border-box!important; overflow:hidden!important; } /* Winner prize */ .event-winner-prize{ position:absolute!important; left:0!important; top:362px!important; width:418px!important; height:258px!important; min-height:258px!important; max-height:258px!important; margin:0!important; padding:8px 10px!important; box-sizing:border-box!important; overflow:hidden!important; } .event-winner-prize img{ height:120px!important; max-height:120px!important; } /* Other prizes, if present, use same right column lower seat instead of extending layout */ .event-other-prizes{ position:absolute!important; left:0!important; top:362px!important; width:418px!important; height:258px!important; box-sizing:border-box!important; overflow:hidden!important; } /* Hide optional blocks from affecting the fixed SHOP template */ .event-benefits, .event-free-blocks, .event-notices{ display:none!important; } /* Bottom seats */ .event-poster-bottom{ position:absolute!important; left:22px!important; top:1008px!important; width:750px!important; height:95px!important; display:block!important; margin:0!important; padding:0!important; } .event-organizers{ display:none!important; } .event-qr{ position:absolute!important; left:0!important; bottom:0!important; width:92px!important; height:92px!important; margin:0!important; padding:4px!important; box-sizing:border-box!important; } /* Keep actual flyer controls outside the poster */ .entrance-flyer-stage{ position:relative!important; margin:0 auto 28px!important; } @media(min-width:821px){ .entrance-flyer-scale{ width:794px!important; height:1123px!important; transform-origin:top left!important; } } /* Mobile: same exact A4, scaled as one object. */ @media(max-width:820px){ .entrance-flyer-stage{ position:relative!important; width:calc(100vw - 16px)!important; height:calc((100vw - 16px) * 1123 / 794)!important; margin:0 auto 18px!important; } .entrance-flyer-scale{ position:absolute!important; left:0!important; top:0!important; width:794px!important; height:1123px!important; transform-origin:top left!important; transform:scale(calc((100vw - 16px) / 794))!important; } .entrance-flyer-card, .entrance-flyer-side, .entrance-event-poster{ width:794px!important; height:1123px!important; min-width:794px!important; min-height:1123px!important; max-width:794px!important; max-height:1123px!important; } } /* Print = true A4 */ @media print{ .entrance-event-poster{ width:210mm!important; height:297mm!important; } } /* v6.5.1 — requested fixed-card details */ .event-fee-item em[data-auto-fee-note]{ display:block!important; width:100%!important; box-sizing:border-box!important; margin:4px 0 0!important; font-size:14px!important; line-height:1.05!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:clip!important; } .event-fixed-card{position:relative!important;display:block!important} .event-fixed-headline{display:flex!important;align-items:baseline!important;gap:7px!important;min-width:0!important} .event-fixed-headline small{flex:0 0 auto!important;margin:0!important} .event-fixed-headline>strong{flex:1 1 auto!important;min-width:0!important;text-align:right!important;white-space:nowrap!important;overflow:hidden!important} .event-fixed-card.is-capacity .event-capacity-number{font-size:27px!important;line-height:1!important;color:var(--accent)!important} .event-fixed-note{ position:absolute!important; left:8px!important;right:8px!important;bottom:7px!important; display:block!important;margin:0!important; font-size:7px!important;line-height:1.15!important;font-style:normal!important; } .event-fixed-card.is-format .event-fixed-headline>strong{font-size:15px!important} .event-items-list{ display:flex!important;flex-wrap:wrap!important;align-content:flex-start!important; gap:3px 0!important;margin-top:5px!important; font-size:12px!important;line-height:1.15!important; } .event-item-word{display:inline-block!important;white-space:nowrap!important;word-break:keep-all!important} .event-item-sep{display:inline!important;margin-right:1px!important} @media(max-width:820px){ .event-fee-item em[data-auto-fee-note]{font-size:14px!important} .event-fixed-card.is-capacity .event-capacity-number{font-size:27px!important} .event-fixed-note{font-size:7px!important} .event-fixed-card.is-format .event-fixed-headline>strong{font-size:15px!important} .event-items-list{font-size:12px!important} } /* ========================================================= v6.5.2 — fixed numeric heights, no percentage math Requested 140% equivalent converted to concrete px values: fee 190 -> 266px fixed cards 87 -> 122px ========================================================= */ /* Participation fee */ .event-fees-section{ top:140px!important; height:266px!important; } /* 2x2 block starts immediately after the enlarged fee block */ .event-fixed-grid{ top:416px!important; width:320px!important; height:250px!important; grid-template-columns:157px 157px!important; grid-template-rows:122px 122px!important; gap:6px!important; } .event-fixed-card{ width:157px!important; height:122px!important; min-height:122px!important; max-height:122px!important; } /* Left column concrete content height */ .event-primary, .event-info-stack{ height:666px!important; } /* Right column uses the remaining width from the same 750px master: 320px left + 12px gap + 418px right = 750px exactly. Height is matched to the enlarged left column. */ .event-visual{ left:332px!important; width:418px!important; height:666px!important; } /* Stretch right-side seats to the exact new left-column height. */ .event-main-image{ width:418px!important; height:378px!important; min-height:378px!important; max-height:378px!important; flex-basis:378px!important; } .event-winner-prize{ top:390px!important; width:418px!important; height:276px!important; min-height:276px!important; max-height:276px!important; } /* QR remains present at bottom-left. */ .event-qr{ display:block!important; visibility:visible!important; left:0!important; bottom:0!important; width:92px!important; height:92px!important; } .event-qr img{ display:block!important; width:74px!important; height:74px!important; margin:0 auto!important; } /* v6.5.3 — final emphasis: date/place + QR deadline */ /* Date and place become deliberate poster headlines without changing fixed seats. */ .event-info-line.is-datetime{ padding:2px 0!important; } .event-info-line.is-datetime .event-info-label, .event-info-line.is-place .event-info-label{ font-size:13px!important; font-weight:1000!important; line-height:1!important; padding-top:5px!important; } .event-date-line{ font-size:36px!important; font-weight:1000!important; letter-spacing:-1.4px!important; line-height:.96!important; } .event-time-line{ font-size:21px!important; font-weight:900!important; margin-top:7px!important; line-height:1!important; } .event-info-line.is-place{ padding:3px 0!important; } .event-info-line.is-place strong{ display:block!important; width:100%!important; font-size:20px!important; font-weight:1000!important; line-height:1.05!important; white-space:nowrap!important; overflow:hidden!important; } /* QR closes the poster at bottom-right. */ .event-poster-bottom{ left:auto!important; right:22px!important; top:998px!important; width:128px!important; height:105px!important; } .event-qr{ left:auto!important; right:0!important; bottom:0!important; width:128px!important; height:105px!important; display:grid!important; grid-template-columns:82px 46px!important; grid-template-rows:82px 23px!important; gap:0!important; padding:0!important; background:#fff!important; } .event-qr a{ grid-column:1!important; grid-row:1 / span 2!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; text-decoration:none!important; } .event-qr img{ width:78px!important; height:78px!important; margin:0!important; } .event-qr a span{ margin-top:2px!important; font-size:9px!important; font-weight:1000!important; line-height:1!important; white-space:nowrap!important; } .event-qr-deadline{ grid-column:2!important; grid-row:1 / span 2!important; align-self:center!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:4px!important; width:46px!important; margin:0!important; padding:4px 2px!important; box-sizing:border-box!important; border-left:2px solid var(--accent)!important; font-size:9px!important; font-weight:900!important; line-height:1.12!important; text-align:center!important; white-space:normal!important; } .event-qr-deadline b{ display:block!important; color:var(--accent)!important; font-size:9px!important; line-height:1!important; white-space:nowrap!important; } /* ========================================================= v6.5.4 — VALUE PLAN Date/place authority + QR as the closing design element. ========================================================= */ /* Date / time: stronger hierarchy inside the existing fixed seat. */ .event-info-line.is-datetime{ grid-template-columns:54px minmax(0,1fr)!important; column-gap:5px!important; } .event-info-line.is-datetime .event-info-label{ font-size:14px!important; font-weight:1000!important; letter-spacing:-.5px!important; } .event-date-line{ font-size:39px!important; font-weight:1000!important; letter-spacing:-1.8px!important; line-height:.92!important; } .event-time-line{ margin-top:8px!important; font-size:23px!important; font-weight:1000!important; letter-spacing:-.7px!important; line-height:.95!important; } /* Venue: same left edge rhythm, bolder and larger, but still one-line. */ .event-info-line.is-place{ grid-template-columns:54px minmax(0,1fr)!important; column-gap:5px!important; } .event-info-line.is-place .event-info-label{ font-size:14px!important; font-weight:1000!important; letter-spacing:-.5px!important; } .event-info-line.is-place strong{ font-size:22px!important; font-weight:1000!important; letter-spacing:-.8px!important; line-height:1!important; white-space:nowrap!important; } /* VALUE QR: compact black/white card in the remaining lower-right space. No organizer, no decorative clutter. */ .event-poster-bottom{ left:auto!important; right:24px!important; top:auto!important; bottom:20px!important; width:214px!important; height:104px!important; margin:0!important; padding:0!important; display:block!important; } .event-qr{ position:absolute!important; inset:0!important; width:214px!important; height:104px!important; box-sizing:border-box!important; display:grid!important; grid-template-columns:92px 1fr!important; grid-template-rows:1fr!important; align-items:center!important; gap:10px!important; padding:6px 10px 6px 6px!important; border:2px solid #1f1f1f!important; border-radius:10px!important; background:#fff!important; box-shadow:4px 4px 0 var(--accent)!important; } .event-qr a{ grid-column:1!important; display:grid!important; grid-template-rows:78px 12px!important; justify-items:center!important; align-items:center!important; width:92px!important; height:92px!important; color:#111!important; text-decoration:none!important; } .event-qr img{ width:78px!important; height:78px!important; margin:0!important; display:block!important; } .event-qr a span{ margin:0!important; font-size:9px!important; font-weight:1000!important; line-height:1!important; letter-spacing:.3px!important; white-space:nowrap!important; } .event-qr-deadline{ position:static!important; grid-column:2!important; display:flex!important; flex-direction:column!important; align-items:flex-start!important; justify-content:center!important; gap:7px!important; width:auto!important; height:auto!important; margin:0!important; padding:0 0 0 10px!important; border:0!important; border-left:2px solid var(--accent)!important; font-size:13px!important; font-weight:1000!important; line-height:1.05!important; text-align:left!important; white-space:nowrap!important; } .event-qr-deadline b{ display:block!important; margin:0!important; color:var(--accent)!important; font-size:10px!important; font-weight:1000!important; line-height:1!important; letter-spacing:.5px!important; white-space:nowrap!important; } /* Old organizer remains completely out of the fixed poster. */ .event-organizers{display:none!important} /* v7.8.0: editor-controlled title/venue sizes with strict line budgets. */ .entrance-event-poster__title{display:-webkit-box!important;-webkit-box-orient:vertical!important;-webkit-line-clamp:2!important;white-space:normal!important;overflow:hidden!important} .event-info-line.is-place strong{display:block!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important} /* ========================================================= v6.5.5 — REFERENCE HEADER + BOTTOM LOCK Reference: original 100大会 flyer. Header = oversized EVENT word, no "SHOP EVENT" visual. QR = bottom-left. Shop/organizer = bottom-right. Never overlap. ========================================================= */ /* Header: recreate the original reference hierarchy: huge italic EVENT, purple fill, pale/white outline, dark concrete strip. */ .entrance-event-poster__top{ height:150px!important; overflow:hidden!important; background: linear-gradient(rgba(38,38,38,.94),rgba(38,38,38,.94)), repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px)!important; } .entrance-event-poster__top .event-type, .entrance-event-poster__top h2, .entrance-event-poster__top strong, .entrance-event-poster__top span{ display:flex!important; align-items:center!important; justify-content:center!important; width:100%!important; height:150px!important; margin:0!important; padding:0!important; font-family:Impact,"Arial Black","Noto Sans JP",sans-serif!important; font-size:112px!important; font-weight:900!important; font-style:italic!important; line-height:.82!important; letter-spacing:-5px!important; text-transform:uppercase!important; color:#8d88bd!important; -webkit-text-stroke:6px #f2f5f7!important; text-shadow:3px 3px 0 rgba(20,20,20,.55)!important; transform:skewX(-5deg) scaleX(.96)!important; transform-origin:center!important; white-space:nowrap!important; } /* Whatever subtype is stored, the visual head is the reference EVENT. */ .entrance-event-poster__top .event-type{ font-size:0!important; } .entrance-event-poster__top .event-type::after{ content:"EVENT"; font-size:112px!important; } /* Bottom is a fixed two-zone lockup. No shared coordinates. */ .event-poster-bottom{ position:absolute!important; left:22px!important; right:22px!important; top:auto!important; bottom:18px!important; width:auto!important; height:108px!important; margin:0!important; padding:0!important; display:grid!important; grid-template-columns:150px minmax(0,1fr)!important; column-gap:24px!important; align-items:end!important; } /* QR: hard left seat */ .event-qr{ position:relative!important; inset:auto!important; grid-column:1!important; width:150px!important; height:108px!important; display:grid!important; grid-template-columns:88px 62px!important; grid-template-rows:108px!important; align-items:center!important; gap:0!important; margin:0!important; padding:5px!important; box-sizing:border-box!important; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; } .event-qr a{ grid-column:1!important; width:88px!important; height:103px!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; } .event-qr img{ width:82px!important; height:82px!important; margin:0!important; } .event-qr a span{ margin-top:3px!important; font-size:10px!important; font-weight:1000!important; line-height:1!important; } .event-qr-deadline{ grid-column:2!important; position:static!important; width:62px!important; height:auto!important; padding:6px 0 6px 8px!important; margin:0!important; border:0!important; border-left:2px solid var(--accent)!important; font-size:10px!important; font-weight:1000!important; line-height:1.18!important; text-align:left!important; align-items:flex-start!important; white-space:normal!important; } .event-qr-deadline b{ font-size:9px!important; margin-bottom:4px!important; } /* Shop/organizer: hard right seat, independent of QR. */ .event-organizers{ position:relative!important; grid-column:2!important; display:flex!important; align-items:flex-end!important; justify-content:flex-end!important; width:100%!important; height:108px!important; margin:0!important; padding:0 4px 10px 0!important; box-sizing:border-box!important; overflow:hidden!important; } .event-organizers p{ display:flex!important; align-items:baseline!important; justify-content:flex-end!important; gap:10px!important; width:100%!important; margin:0!important; padding:0!important; white-space:nowrap!important; } .event-organizers small{ font-size:11px!important; font-weight:900!important; color:#555!important; } .event-organizers strong{ font-size:19px!important; font-weight:1000!important; line-height:1!important; text-align:right!important; white-space:nowrap!important; } /* Even with a long shop name the two bottom zones can never collide. */ .event-poster-bottom.no-organizer::after{ content:"comms shop エントランス"; grid-column:2!important; align-self:end!important; justify-self:end!important; padding:0 4px 14px 0!important; font-size:19px!important; font-weight:1000!important; line-height:1!important; white-space:nowrap!important; } /* ========================================================= v6.5.6 — LEFT INFO / RIGHT QR FINAL LOCK Organizer removed. Date dominates. Left side = information. QR = bottom-right, isolated from all information. ========================================================= */ /* Organizer: fully removed from poster */ .event-organizers{ display:none!important; } .event-poster-bottom.no-organizer::after{ content:none!important; display:none!important; } /* Date gets the strongest information hierarchy on the left */ .event-info-line.is-datetime{ height:92px!important; grid-template-columns:52px minmax(0,1fr)!important; column-gap:4px!important; padding:1px 0!important; } .event-info-line.is-datetime .event-info-label{ font-size:14px!important; font-weight:1000!important; padding-top:6px!important; } .event-date-line{ font-size:43px!important; font-weight:1000!important; letter-spacing:-2px!important; line-height:.9!important; white-space:nowrap!important; } .event-time-line{ font-size:22px!important; font-weight:1000!important; letter-spacing:-.8px!important; line-height:1!important; margin-top:9px!important; white-space:nowrap!important; } /* Place follows immediately; all practical info stays in left column */ .event-info-line.is-place{ top:96px!important; height:48px!important; grid-template-columns:52px minmax(0,1fr)!important; column-gap:4px!important; } .event-info-line.is-place strong{ font-size:21px!important; font-weight:1000!important; } /* Shift the remaining left information down only enough to clear date/place */ .event-fees-section{ top:150px!important; height:266px!important; } .event-fixed-grid{ top:426px!important; } /* Bottom area only owns QR. It has no organizer/shop-name seat anymore. */ .event-poster-bottom{ position:absolute!important; left:auto!important; right:24px!important; top:auto!important; bottom:18px!important; width:150px!important; height:108px!important; display:block!important; margin:0!important; padding:0!important; } /* QR hard-locked to bottom-right */ .event-qr{ position:absolute!important; right:0!important; left:auto!important; bottom:0!important; top:auto!important; width:150px!important; height:108px!important; display:grid!important; grid-template-columns:88px 62px!important; grid-template-rows:108px!important; align-items:center!important; gap:0!important; margin:0!important; padding:5px!important; box-sizing:border-box!important; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; } .event-qr a{ grid-column:1!important; width:88px!important; height:103px!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; } .event-qr img{ width:82px!important; height:82px!important; margin:0!important; } .event-qr a span{ margin-top:3px!important; font-size:10px!important; font-weight:1000!important; line-height:1!important; white-space:nowrap!important; } .event-qr-deadline{ grid-column:2!important; position:static!important; width:62px!important; padding:6px 0 6px 8px!important; margin:0!important; border:0!important; border-left:2px solid var(--accent)!important; font-size:10px!important; font-weight:1000!important; line-height:1.18!important; text-align:left!important; align-items:flex-start!important; white-space:normal!important; } /* v6.5.7 QR HARD LOCK — poster bottom-right only */ .event-poster-bottom{ position:absolute!important;left:620px!important;top:1000px!important; right:auto!important;bottom:auto!important;width:150px!important;height:105px!important; margin:0!important;padding:0!important;display:block!important;z-index:20!important; } .event-qr{ position:absolute!important;left:0!important;top:0!important;right:auto!important;bottom:auto!important; width:150px!important;height:105px!important;margin:0!important;padding:4px!important; box-sizing:border-box!important;display:grid!important;grid-template-columns:86px 56px!important; grid-template-rows:97px!important;align-items:center!important;background:#fff!important; border:0!important;border-radius:0!important;box-shadow:none!important;transform:none!important; } .event-qr a{grid-column:1!important;width:86px!important;height:97px!important} .event-qr img{width:78px!important;height:78px!important} .event-qr-deadline{grid-column:2!important;width:56px!important;box-sizing:border-box!important;padding-left:6px!important} .event-fixed-grid{position:absolute!important;left:0!important;top:426px!important;width:320px!important;height:250px!important;z-index:2!important} .event-fixed-card{position:relative!important;z-index:2!important} @media(max-width:820px){ .event-poster-bottom{left:620px!important;top:1000px!important;width:150px!important;height:105px!important} } /* ========================================================= v6.5.8 — POSTER FOOTER + OVERLAPPING QR Upper layout is untouched. Footer is its own bottom layer; QR intentionally overlaps it. ========================================================= */ /* Black poster footer */ .entrance-event-poster::after{ content:"comms shop エントランス"; position:absolute!important; left:0!important; bottom:0!important; width:794px!important; height:72px!important; box-sizing:border-box!important; display:flex!important; align-items:center!important; justify-content:flex-start!important; padding:0 190px 0 30px!important; background:#171717!important; color:#fff!important; font-family:"Arial Black","Noto Sans JP",sans-serif!important; font-size:23px!important; font-weight:1000!important; line-height:1!important; letter-spacing:.2px!important; z-index:30!important; } /* Bottom wrapper is now only a QR anchor and does not affect upper content. */ .event-poster-bottom{ position:absolute!important; left:auto!important; right:24px!important; top:auto!important; bottom:18px!important; width:158px!important; height:132px!important; margin:0!important; padding:0!important; display:block!important; z-index:40!important; pointer-events:auto!important; } /* QR intentionally crosses the black footer edge. */ .event-qr{ position:absolute!important; left:0!important; top:0!important; right:auto!important; bottom:auto!important; width:158px!important; height:132px!important; box-sizing:border-box!important; display:grid!important; grid-template-columns:104px 54px!important; grid-template-rows:108px 24px!important; align-items:center!important; gap:0!important; margin:0!important; padding:5px!important; background:#fff!important; border:3px solid #171717!important; border-radius:8px!important; box-shadow:4px 4px 0 var(--accent)!important; transform:none!important; z-index:41!important; } .event-qr a{ grid-column:1!important; grid-row:1 / span 2!important; width:104px!important; height:122px!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; color:#111!important; text-decoration:none!important; } .event-qr img{ width:94px!important; height:94px!important; margin:0!important; display:block!important; } .event-qr a span{ margin-top:4px!important; font-size:10px!important; font-weight:1000!important; line-height:1!important; white-space:nowrap!important; } .event-qr-deadline{ position:static!important; grid-column:2!important; grid-row:1 / span 2!important; width:54px!important; height:auto!important; box-sizing:border-box!important; display:flex!important; flex-direction:column!important; align-items:flex-start!important; justify-content:center!important; gap:5px!important; margin:0!important; padding:6px 2px 6px 7px!important; border:0!important; border-left:2px solid var(--accent)!important; font-size:9px!important; font-weight:1000!important; line-height:1.15!important; text-align:left!important; white-space:normal!important; } .event-qr-deadline b{ display:block!important; color:var(--accent)!important; font-size:9px!important; font-weight:1000!important; line-height:1!important; white-space:nowrap!important; } /* No organizer/shop-name markup; footer owns branding. */ .event-organizers{display:none!important} .event-poster-bottom.no-organizer::after{content:none!important;display:none!important} /* Same absolute A4 coordinates on mobile; whole poster scales as one unit. */ @media(max-width:820px){ .entrance-event-poster::after{ width:794px!important; height:72px!important; font-size:23px!important; padding:0 190px 0 30px!important; } .event-poster-bottom{ right:24px!important; bottom:18px!important; width:158px!important; height:132px!important; } } /* ========================================================= v6.5.9 — FOOTER CENTER BRAND + QR FAR RIGHT Bottom black band spans full width. Brand is centered in the poster. QR is anchored from the extreme bottom-right. ========================================================= */ /* Full-width black footer band */ .entrance-event-poster::after{ content:"comms shop エントランス"; position:absolute!important; left:0!important; right:0!important; bottom:0!important; width:794px!important; height:72px!important; box-sizing:border-box!important; display:flex!important; align-items:center!important; justify-content:center!important; padding:0!important; background:#171717!important; color:#fff!important; font-family:"Arial Black","Noto Sans JP",sans-serif!important; font-size:23px!important; font-weight:1000!important; line-height:1!important; letter-spacing:.2px!important; text-align:center!important; z-index:30!important; } /* QR anchor: extreme bottom-right of poster */ .event-poster-bottom{ position:absolute!important; left:auto!important; right:0!important; top:auto!important; bottom:0!important; width:158px!important; height:132px!important; margin:0!important; padding:0!important; display:block!important; z-index:40!important; pointer-events:auto!important; } /* QR itself sits flush to the poster's right and bottom edges */ .event-qr{ position:absolute!important; left:auto!important; right:0!important; top:auto!important; bottom:0!important; width:158px!important; height:132px!important; box-sizing:border-box!important; display:grid!important; grid-template-columns:104px 54px!important; grid-template-rows:108px 24px!important; align-items:center!important; gap:0!important; margin:0!important; padding:5px!important; background:#fff!important; border:3px solid #171717!important; border-right:0!important; border-bottom:0!important; border-radius:8px 0 0 0!important; box-shadow:none!important; transform:none!important; z-index:41!important; } /* Keep QR content unchanged */ .event-qr a{ grid-column:1!important; grid-row:1 / span 2!important; width:104px!important; height:122px!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; color:#111!important; text-decoration:none!important; } .event-qr img{ width:94px!important; height:94px!important; margin:0!important; display:block!important; } .event-qr a span{ margin-top:4px!important; font-size:10px!important; font-weight:1000!important; line-height:1!important; white-space:nowrap!important; } .event-qr-deadline{ position:static!important; grid-column:2!important; grid-row:1 / span 2!important; width:54px!important; height:auto!important; box-sizing:border-box!important; display:flex!important; flex-direction:column!important; align-items:flex-start!important; justify-content:center!important; gap:5px!important; margin:0!important; padding:6px 2px 6px 7px!important; border:0!important; border-left:2px solid var(--accent)!important; font-size:9px!important; font-weight:1000!important; line-height:1.15!important; text-align:left!important; white-space:normal!important; } .event-qr-deadline b{ display:block!important; color:var(--accent)!important; font-size:9px!important; font-weight:1000!important; line-height:1!important; white-space:nowrap!important; } /* No organizer/shop markup in content flow. Footer owns branding. */ .event-organizers{display:none!important} .event-poster-bottom.no-organizer::after{content:none!important;display:none!important} @media(max-width:820px){ .entrance-event-poster::after{ width:794px!important; height:72px!important; font-size:23px!important; padding:0!important; } .event-poster-bottom{ right:0!important; bottom:0!important; width:158px!important; height:132px!important; } } /* ========================================================= v6.6.0 — STRUCTURAL QR FIX QR wrapper now lives directly under .entrance-event-poster. Therefore bottom-right means actual poster bottom-right. ========================================================= */ .entrance-event-poster{ position:relative!important; } /* Footer stays full-width, brand centered. */ .entrance-event-poster::after{ left:0!important; right:0!important; bottom:0!important; width:794px!important; height:72px!important; display:flex!important; align-items:center!important; justify-content:center!important; padding:0!important; text-align:center!important; } /* QR anchor is now relative to the POSTER itself. */ .event-poster-bottom{ position:absolute!important; left:auto!important; right:0!important; top:auto!important; bottom:0!important; width:158px!important; height:132px!important; margin:0!important; padding:0!important; z-index:40!important; display:block!important; } /* QR hard-locked to the extreme right-bottom corner. */ .event-qr{ position:absolute!important; left:auto!important; right:0!important; top:auto!important; bottom:0!important; width:158px!important; height:132px!important; margin:0!important; transform:none!important; } /* Never show organizer here. */ .event-organizers{display:none!important} /* v6.6.1 — 2x2 top labels + viewport auto-fit */ .event-fixed-card{ position:relative!important;overflow:visible!important; padding:22px 9px 8px!important;border:2px solid var(--accent)!important; border-radius:8px!important;background:#fff!important; height:116px!important;min-height:116px!important;max-height:116px!important; } .event-fixed-card>small,.event-fixed-card .event-fixed-headline>small{ position:absolute!important;left:10px!important;top:-11px!important;z-index:4!important; display:flex!important;align-items:center!important;justify-content:center!important; min-width:54px!important;height:22px!important;box-sizing:border-box!important; margin:0!important;padding:0 9px!important;border-radius:5px!important; background:var(--accent)!important;color:#fff!important;font-size:10px!important; font-weight:1000!important;line-height:1!important;white-space:nowrap!important; } .event-fixed-headline{ display:flex!important;align-items:center!important;justify-content:flex-start!important; width:100%!important;min-height:34px!important;gap:0!important; } .event-fixed-headline>strong{flex:1 1 100%!important;text-align:left!important} .event-fixed-card.is-capacity .event-capacity-number{font-size:30px!important;text-align:left!important} .event-fixed-card.is-format .event-fixed-headline>strong{font-size:17px!important;text-align:left!important} .event-items-list{margin-top:0!important;padding-top:1px!important} .event-fixed-grid{ grid-template-rows:116px 116px!important;row-gap:12px!important;height:244px!important; } /* v6.6.3 — corrected layout */ /* 2x2: full-width top labels, same construction as participation fee. */ .event-fixed-card{ position:relative!important;overflow:hidden!important; padding:34px 10px 9px!important; border:2px solid var(--accent)!important;border-radius:8px!important;background:#fff!important; } .event-fixed-card .event-fixed-headline{display:block!important;min-height:0!important} .event-fixed-card .event-fixed-headline>small{ position:absolute!important;left:0!important;right:0!important;top:0!important; width:100%!important;height:27px!important;margin:0!important;padding:0!important; display:flex!important;align-items:center!important;justify-content:center!important; border-radius:0!important;background:var(--accent)!important;color:#fff!important; font-size:10px!important;font-weight:1000!important;line-height:1!important; } .event-fixed-card .event-fixed-headline>strong{display:block!important;width:100%!important;text-align:left!important} .event-fixed-card.is-capacity .event-capacity-number{font-size:30px!important} .event-fixed-note{display:block!important;margin-top:5px!important} .event-items-list{margin-top:0!important} /* QR: actual visual requirement = lower-right AREA, above footer, not over four cards. Keep it independent of the information column. */ .event-poster-bottom{ position:absolute!important; left:auto!important;right:18px!important; top:auto!important;bottom:78px!important; width:158px!important;height:132px!important; margin:0!important;padding:0!important;z-index:60!important; } .event-qr{ position:absolute!important;left:0!important;top:0!important;right:auto!important;bottom:auto!important; width:158px!important;height:132px!important;margin:0!important;transform:none!important; } /* Footer remains its own band. */ .entrance-event-poster::after{z-index:30!important}