.tis-wrap{display:flex;gap:40px;align-items:stretch;flex-wrap:wrap}
.tis-left{flex:0 0 300px;min-width:220px}
.tis-right{flex:1;min-width:280px;position:relative;border-radius:8px;overflow:hidden;background:#f5f2ef;display:flex;align-items:center;justify-content:center}
.tis-right img,.tis-right video{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s ease;position:relative;display:none}
.tis-right img.is-visible,.tis-right video.is-visible{opacity:1}
.tis-list{list-style:none;margin:0;padding:0;position:relative}
.tis-list:before{content:"";position:absolute;left:9px;top:12px;bottom:12px;width:2px;background:#ddd}
.tis-item{display:flex;align-items:flex-start;gap:14px;padding:16px 0;cursor:pointer;position:relative}
.tis-dot{width:20px;height:20px;border-radius:50%;background:#fff;border:2px solid #c9c9c9;flex-shrink:0;position:relative;z-index:1;transition:border-color .2s ease,background .2s ease}
.tis-dot:after{content:"";position:absolute;inset:4px;border-radius:50%;background:transparent;transition:background .2s ease}
.tis-text{display:flex;flex-direction:column;gap:2px}
.tis-label{font-size:16px;color:#b9b9b9;font-weight:600;transition:color .2s ease}
.tis-desc{font-size:13px;color:#b9b9b9;transition:color .2s ease}
.tis-item.is-active .tis-label{color:#1a1a1a}
.tis-item.is-active .tis-desc{color:#555}
.tis-item.is-active .tis-dot{border-color:#c9a35d}
.tis-item.is-active .tis-dot:after{background:#c9a35d}
.tis-item:hover .tis-label{color:#333}
.tis-mobile-extra{display:none}
@media (max-width:640px){
	.tis-wrap{flex-direction:column;gap:0}
	.tis-left{display:none}
	.tis-right{width:100%;aspect-ratio:16/10;border-radius:14px}
	.tis-mobile-extra{display:block;margin-top:16px}
	.tis-mobile-title{font-size:20px;font-weight:700;color:#1a1a1a;margin-bottom:18px}
	.tis-mobile-nav{display:flex;align-items:center;gap:14px}
	.tis-arrow{width:34px;height:34px;border-radius:50%;border:1px solid #ddd;background:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;line-height:1;color:#555;cursor:pointer;flex-shrink:0;padding:0}
	.tis-arrow:active{background:#f2f2f2}
	.tis-progress{flex:1;display:flex;gap:6px}
	.tis-seg{flex:1;height:4px;border-radius:2px;background:#e2e2e2;transition:background .2s ease}
	.tis-seg.is-active{background:#1a1a1a}
}