/* 온 슬라이스배너 v1.0.0 */
.onsb{width:100%;box-sizing:border-box}
.onsb *{box-sizing:border-box}
.onsb .onsb-list{display:flex;gap:var(--onsb-gap);height:var(--onsb-h);margin:0!important;padding:0!important;list-style:none!important}
.onsb .onsb-item{position:relative;flex:1 1 0;min-width:0;margin:0!important;padding:0!important;overflow:hidden;border-radius:var(--onsb-r);transition:flex-grow var(--onsb-speed) cubic-bezier(.4,0,.2,1),height var(--onsb-speed) cubic-bezier(.4,0,.2,1);isolation:isolate;list-style:none!important}
.onsb .onsb-item::before{display:none!important}
.onsb .onsb-item.is-on{flex-grow:var(--onsb-grow)}
.onsb .onsb-link{position:absolute;inset:0;display:block;color:var(--onsb-color)!important;text-decoration:none!important;cursor:pointer}
.onsb .onsb-bg{position:absolute;inset:0;background:#333 center/cover no-repeat;transform:scale(1.08);transition:transform calc(var(--onsb-speed) * 2.5) ease}
.onsb .onsb-item.is-on .onsb-bg{transform:scale(1)}
.onsb .onsb-dim{position:absolute;inset:0;background:#000;opacity:var(--onsb-ov);transition:opacity var(--onsb-speed) ease}
.onsb .onsb-item.is-on .onsb-dim{opacity:var(--onsb-ov-on)}
.onsb .onsb-line{position:absolute;inset:15px;border:1px solid rgba(255,255,255,.55);border-radius:max(0px,calc(var(--onsb-r) - 8px));opacity:0;transform:scale(1.04);transition:opacity var(--onsb-speed) ease,transform var(--onsb-speed) ease;pointer-events:none}
.onsb .onsb-item.is-on .onsb-line{opacity:1;transform:scale(1)}
.onsb.onsb-no-line .onsb-line{display:none}

.onsb .onsb-txt{position:absolute;left:50%;top:50%;width:88%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;text-align:center;color:var(--onsb-color)}
.onsb .onsb-t1{display:block;font-size:var(--onsb-ts);font-weight:700;line-height:1.25;letter-spacing:-.02em;white-space:nowrap;color:inherit;text-shadow:0 2px 10px rgba(0,0,0,.25)}
.onsb .onsb-t2{display:block;font-style:normal;font-size:var(--onsb-t2s);font-weight:600;letter-spacing:.14em;line-height:1.3;margin-top:0;color:inherit;max-height:0;opacity:0;overflow:hidden;transition:max-height var(--onsb-speed) ease,opacity var(--onsb-speed) ease}
.onsb .onsb-t3{display:block;font-size:var(--onsb-t3s);line-height:1.6;letter-spacing:.02em;color:inherit;opacity:0;max-height:0;overflow:hidden;margin-top:0;transform:translateY(8px);transition:max-height var(--onsb-speed) ease,opacity var(--onsb-speed) ease,transform var(--onsb-speed) ease,margin var(--onsb-speed) ease}
.onsb .onsb-item.is-on .onsb-t2{max-height:3em;opacity:.9;margin-top:var(--onsb-g1)}
.onsb .onsb-t2{transition:max-height var(--onsb-speed) ease,opacity var(--onsb-speed) ease,margin var(--onsb-speed) ease}
.onsb .onsb-item.is-on .onsb-t3{max-height:8em;opacity:.9;margin-top:var(--onsb-g2);transform:none;transition-delay:calc(var(--onsb-speed) * .4)}

.onsb .onsb-plus{position:absolute;right:0;bottom:0;width:56px;height:56px;border-top-left-radius:min(var(--onsb-r),14px);background:transparent;transition:background-color var(--onsb-speed) ease}
.onsb .onsb-plus::before,.onsb .onsb-plus::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:2px;background:#fff;transform:translate(-50%,-50%)}
.onsb .onsb-plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.onsb .onsb-item.is-on .onsb-plus{background:var(--onsb-point)}
.onsb.onsb-no-plus .onsb-plus{display:none}


/* 전체 폭 */
.onsb.onsb-bleed{position:relative;max-width:none!important}
/* 세로 제목 (슬라이스형 접힌 칸) */
.onsb .onsb-vtt{display:none}
/* 슬라이스형 */
.onsb.onsb-type-slice .onsb-list{gap:0}
.onsb.onsb-type-slice .onsb-item{border-radius:0}
.onsb.onsb-type-slice .onsb-txt{left:clamp(20px,4%,48px);right:clamp(20px,4%,48px);top:auto;bottom:clamp(24px,8%,64px);width:auto;transform:none;align-items:flex-start;text-align:left;opacity:0;transition:opacity var(--onsb-speed) ease}
.onsb.onsb-type-slice .onsb-item.is-on .onsb-txt{opacity:1;transition-delay:calc(var(--onsb-speed) * .5)}
.onsb.onsb-type-slice .onsb-dim{background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.75));opacity:calc(var(--onsb-ov) * 2)}
.onsb.onsb-type-slice .onsb-item.is-on .onsb-dim{opacity:calc(var(--onsb-ov-on) * 2)}
.onsb.onsb-type-slice .onsb-item+.onsb-item::before{content:"";display:block!important;position:absolute;left:0;top:0;bottom:0;width:1px;background:rgba(255,255,255,.18);z-index:2}
.onsb.onsb-type-slice .onsb-plus,.onsb.onsb-type-slice .onsb-line{display:none}
.onsb.onsb-type-slice.onsb-vt .onsb-vtt{display:block;position:absolute;left:50%;bottom:clamp(24px,8%,64px);transform:translateX(-50%);writing-mode:vertical-rl;color:var(--onsb-color);font-size:max(13px,calc(var(--onsb-t2s) + 2px));font-weight:600;letter-spacing:.12em;white-space:nowrap;opacity:.9;transition:opacity calc(var(--onsb-speed) * .6) ease;text-shadow:0 1px 6px rgba(0,0,0,.35)}
.onsb.onsb-type-slice.onsb-vt .onsb-item.is-on .onsb-vtt{opacity:0}

/* 자동 맞춤: --onsb-k(0.6~1)는 스크립트가 배너 폭/1200 으로 계산 */
@media (min-width:769px){
	.onsb.onsb-fit .onsb-t1{font-size:calc(var(--onsb-ts) * var(--onsb-k,1))}
	.onsb.onsb-fit .onsb-t2{font-size:max(10px,calc(var(--onsb-t2s) * var(--onsb-k,1)))}
	.onsb.onsb-fit .onsb-t3{font-size:max(11px,calc(var(--onsb-t3s) * var(--onsb-k,1)))}
	.onsb.onsb-fit .onsb-item.is-on .onsb-t2{margin-top:calc(var(--onsb-g1) * var(--onsb-k,1))}
	.onsb.onsb-fit .onsb-item.is-on .onsb-t3{margin-top:calc(var(--onsb-g2) * var(--onsb-k,1))}
}
/* 모바일 */
@media (max-width:768px){
	.onsb .onsb-list{height:auto;gap:var(--onsb-mo-gap)}
	.onsb .onsb-t1{font-size:var(--onsb-tsm)}
	.onsb .onsb-t2{font-size:var(--onsb-t2sm)}
	.onsb .onsb-t3{font-size:var(--onsb-t3sm);line-height:1.55}
	.onsb .onsb-item.is-on .onsb-t2,.onsb.onsb-mo-grid2 .onsb-t2{margin-top:var(--onsb-g1m)}
	.onsb .onsb-item.is-on .onsb-t3{margin-top:var(--onsb-g2m)}
	.onsb .onsb-line{inset:10px}
	.onsb .onsb-plus{width:40px;height:40px}
	.onsb .onsb-plus::before,.onsb .onsb-plus::after{width:16px}

	.onsb.onsb-mo-accordion .onsb-list{flex-direction:column}
	.onsb.onsb-type-slice .onsb-vtt{display:none!important}
	.onsb.onsb-type-slice .onsb-item+.onsb-item::before{width:auto;height:1px;right:0;bottom:auto}
	.onsb.onsb-type-slice .onsb-txt{opacity:1;bottom:auto;top:50%;transform:translateY(-50%)}
	.onsb.onsb-type-slice.onsb-mo-accordion .onsb-item:not(.is-on) .onsb-t1{font-size:calc(var(--onsb-tsm) * .85)}
	.onsb.onsb-mo-accordion .onsb-item{flex:none;height:var(--onsb-mo-closed)}
	.onsb.onsb-mo-accordion .onsb-item.is-on{height:var(--onsb-mo-open)}
	.onsb.onsb-mo-accordion .onsb-item:not(.is-on) .onsb-plus{width:var(--onsb-mo-closed);max-width:56px;height:100%}

	.onsb.onsb-mo-grid2 .onsb-list{display:grid;grid-template-columns:1fr 1fr}
	.onsb.onsb-mo-grid2 .onsb-item{height:var(--onsb-mo-grid)}
	.onsb.onsb-mo-grid2 .onsb-item:last-child:nth-child(odd){grid-column:1 / -1}
	.onsb.onsb-mo-grid2 .onsb-dim{opacity:var(--onsb-ov-on)}
	.onsb.onsb-mo-grid2 .onsb-bg{transform:none}
	.onsb.onsb-mo-grid2 .onsb-t2{max-height:3em;opacity:.9}
	.onsb.onsb-mo-grid2 .onsb-t3,.onsb.onsb-mo-grid2 .onsb-line{display:none}
	.onsb.onsb-mo-grid2 .onsb-plus{width:32px;height:32px;background:var(--onsb-point)}
	.onsb.onsb-mo-grid2 .onsb-plus::before,.onsb.onsb-mo-grid2 .onsb-plus::after{width:12px}
}
@media (prefers-reduced-motion:reduce){
	.onsb *{transition-duration:.01s!important}
}
