진행 중인 장면에서 관련된 보조 장면으로 잠시 빠졌다가 본 장면으로 돌아옵니다.
<div class="frame">
<div class="shot main"><i class="person"></i><i class="table"></i><b>MAIN ACTION</b></div>
<div class="shot insert"><i class="object"></i><b>DETAIL INSERT</b></div>
<div class="timeline"><span>A</span><i></i><b>INSERT</b><i></i><span>A</span><em></em></div>
</div>.frame{position:absolute;inset:0;overflow:hidden;background:var(--bg)}
.shot{position:absolute;inset:0 0 22%;display:grid;place-items:center;overflow:hidden}
.main{background:linear-gradient(145deg,#d7e2d4,#93b3a9);animation:main 3.6s steps(1,end) infinite}
.insert{background:linear-gradient(145deg,#e6c68e,#cc805f);opacity:0;animation:insert 3.6s steps(1,end) infinite}
.person{position:absolute;left:21%;bottom:0;width:24%;height:66%;border-radius:45% 45% 0 0;background:var(--accent-2)}
.person:before{content:"";position:absolute;left:30%;top:-31%;width:40%;aspect-ratio:1;border-radius:50%;background:#d39a72}
.table{position:absolute;right:9%;bottom:9%;width:38%;height:21%;background:#71533d;transform:skewY(-8deg)}
.object{width:clamp(48px,26vmin,145px);aspect-ratio:1;border-radius:50% 50% 13% 50%;background:var(--accent);transform:rotate(35deg);box-shadow:0 0 0 18px rgba(255,255,255,.22)}
.shot b{position:absolute;left:6%;bottom:7%;font:700 clamp(9px,2.3vmin,13px) ui-monospace,monospace;letter-spacing:.13em;color:var(--fg)}
.timeline{position:absolute;left:7%;right:7%;bottom:6%;height:12%;display:flex;align-items:center;justify-content:space-between;color:var(--fg);font:700 clamp(8px,2vmin,11px) ui-monospace,monospace;letter-spacing:.08em}
.timeline i{position:absolute;left:20%;right:20%;height:2px;background:var(--line)}
.timeline b{position:absolute;left:50%;transform:translateX(-50%);background:var(--bg);padding:0 5px;color:var(--accent-3)}
.timeline em{position:absolute;left:50%;top:0;bottom:0;width:2px;background:var(--accent);animation:cursor 3.6s linear infinite}
@keyframes main{0%,39.9%{opacity:1}40%,59.9%{opacity:0}60%,100%{opacity:1}}
@keyframes insert{0%,39.9%{opacity:0}40%,59.9%{opacity:1}60%,100%{opacity:0}}
@keyframes cursor{from{left:0}to{left:100%}}탁자 앞에서 이야기하다 손에 든 물건을 보여 주는 것처럼, 본 장면을 잠깐 벗어나 관련된 세부 장면을 삽입합니다. 장면의 정보나 반응을 보탭니다.
본 장면을 끊고 보조 샷을 잠시 배치한 뒤 원래 장면으로 돌아옵니다. 돌아올 때 동작이나 시선이 이어지도록 두 샷의 순간을 맞추면 자연스럽습니다.
컷어웨이는 전환 효과 이름이 아니라 편집 구조입니다. 동시 진행 장면을 번갈아 보여 주는 교차 편집과 달리, 본 장면의 맥락을 보완하는 샷을 끼웁니다.
설명 중인 물건이나 화자의 반응을 보여 주고 싶을 때 쓰세요. 본 장면으로 돌아올 지점을 미리 정해 맥락을 잃지 않게 하세요.