* {
	box-sizing: border-box;
}

html, body {
	width: 100%;
	height: 100%;
	background: #222B31;
}

img {
	position: absolute;
	display: inline-block;
	width: 240px;
	height: 370px;
	cursor: pointer;
}

.iso-wrapper {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
}

#movie-left,
#movie-bottom,
#movie-right {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

#movie-left {
	width: 800px;
	height: 800px;
}
#movie-bottom {
	width: 800px;
	height: 800px;
	background: white;
}
#movie-right {
	background: black;
	width: 800px;
	height: 800px;
}

#movie-images {
	width: 100%;
	height: 100%;
}

#m1 {
	top: 20px; left: 20px;
}
#m2 {
	top: 20px; left: 280px;
}
#m3 {
	top: 20px; left: 540px;
}
#m4 {
	top: 410px; left: 20px;
}
#m5 {
	top: 410px; left: 280px;
}
#m6 {
	top: 410px; left: 540px;
}
.veil {
	position: absolute;
	top: 0; left: 0;
	pointer-events: none;
	background: rgba(0, 0, 0, 0.5);
	width: 800px;
	height: 800px;
}

.disabled {
	cursor: initial;
	z-index: 0;
	animation-name: fadeout;
	animation-duration: 2s;
    animation-fill-mode: forwards; /* 마지막 프레임에 멈추도록 함 */
    animation-timing-function: linear;
}

.selected {
	cursor: initial;
	z-index: 1;
	animation-name: growup;
	animation-duration: 2s;
    animation-fill-mode: forwards; /* 마지막 프레임에 멈추도록 함 */
    animation-timing-function: cubic-bezier(.02,.73,.56,.99);
}

@keyframes fadeout {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes growup {
    to {
		left: 40px;
		top: 40px;
		width: 720px;
		height: 720px;
    }
}

.seat{
	position: absolute;
	width: 100%;
	height: 200px;
	background: #822638;
	display: flex;
	justify-content: space-around;
	align-items: center;
}
#seat0{
	bottom: 600px;
}
#seat1{
	bottom: 400px;
}
#seat2{
	bottom: 200px;
}
#seat3{
	bottom: 0;
}

.chair {
	display: flex;
	width: 100px;
	height: 100px;
	justify-content: center;
	align-items: center;
}

.chair-leg-left {
	position: absolute;
	width: 15px;
	height: 100px;
	left: 0;
	background: #616261;
}
.chair-leg-right {
	position: absolute;
	width: 15px;
	height: 100px;
	right: 0;
	background: #616261;
}
.chair-pillar-top {
	position: absolute;
	width: 15px;
	height: 15px;
	top: 0;
}
.chair-pillar-bottom {
	position: absolute;
	width: 15px;
	height: 15px;
	bottom: 0;
}
.chair-cushion {
	background: #F35A60;
	width: 110px;
	height: 110px;
}
.chair-back {
	background: #F98280;
	position: absolute;
	width: 100%;
	height: 30px;
	bottom: 0;
}