}/**
************************************************************************************
* CSR  : http://clm.lge.com/issue/browse/BTOCSITE-63596
* CODE : Dev - EV00019471 , Prod - EV00007321
* FILE : /kr/event/2024/05/09_lg_deco/eventMainLgDeco.jsp
* DESC : 5월 통합_닷컴 방 꾸미기 이벤트
* PROJ : lge.co.kr 5.0
************************************************************************************
*							Modification History
************************************************************************************
* DATE						AUTHOR				DESCRIPTION
************************************************************************************
* 2024/04/23				신우용				Created
************************************************************************************
**/

/* 이벤트 기본 설정 */
@font-face {
    font-family: 'Pretendard';
    font-weight: 300;
    font-style: normal;
    src: url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Light.eot');
    src: url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Light.eot?#iefix') format('embedded-opentype'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Light.woff2') format('woff2'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Light.woff') format('woff'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Light.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 400;
    font-style: normal;
    src: url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Regular.eot');
    src: url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Regular.eot?#iefix') format('embedded-opentype'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Regular.woff2') format('woff2'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Regular.woff') format('woff'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Regular.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 500;
    font-style: normal;
    src: url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Medium.eot');
    src: url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Medium.eot?#iefix') format('embedded-opentype'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Medium.woff2') format('woff2'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Medium.woff') format('woff'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Medium.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'Pretendard';
    font-weight: 600;
    font-style: normal;
    src: url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Bold.eot');
    src: url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Bold.eot?#iefix') format('embedded-opentype'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Bold.woff2') format('woff2'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Bold.woff') format('woff'),
        url('/kr/event/2024/05/09_lg_deco/fonts/Pretendard-Bold.ttf') format("truetype");
    font-display: swap;
}
* {
	--width: 1380;
}
.evt-func {
	position: relative;
}
.deco-container{
	max-width: 1380px;
  	margin: 0 auto;
}

.deco-container .tab_wrap {
    position: relative;
    overflow: hidden;
}
.deco-container .tab_wrap .tab_inner ul {
    width: 100%;
    display: flex;
    height: 80px;
}
.tab_wrap .tab_inner li {
    flex: 1;
    background-color: #212F25;
    border-right: solid 1px #eee;
    border-bottom: solid 1px #eee;
}
.tab_wrap .tab_inner li:first-child {
    border-left: solid 1px #eee;
}
.tab_wrap .tab_inner li span {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 22px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.4em;
    letter-spacing: -0.02em;
}
.tab_wrap .tab_inner li:nth-child(3) span {
    font-size: 0 !important;
    color: transparent;
    height: 100%;
}
.tab_wrap .tab_inner li:nth-child(3) span::before {
    content: '';
    display: block;
    width: 88px;
    height: 100%;
    background: url(/kr/event/2024/05/09_summer_lge/images/home_tab_ico.png) 50% no-repeat;
    opacity: 0.7;
}
.tab_wrap .tab_inner li.active {
    background-color: #11C09D;
}
.tab_wrap .tab_inner li.active span {
    font-weight: 500;
    font-size: 30px;
    letter-spacing: -0.04em;
  	color: #fff;
}
.tab_wrap .tab_inner li.active:nth-child(3) span::before {
    opacity: 1;
}

.deco-container .swiper-slide{
	background: transparent;
}

.deco-container .swiper-button-next:after, .deco-container  .swiper-button-prev:after{
	display: none;
}

.deco-intro {
  	position: relative;
}
.deco-intro #decoStartBtn{
	position:absolute;
	bottom: 9%;
	left: 29%;
	width: 42%;
	height: 7.2%;
}
.deco-grow {
  	display: none;
  	position: relative;
}

.board-display.mobile-ver{
	display: none;
}

.deco-grow .deco-slide{
	position: absolute;
	width: calc(1040 / var(--width)* 100%);
	top: calc(350 / var(--width)* 100%);
	left: 50%;
	padding: 0 calc(75 / var(--width)* 100%);
	transform: translateX(-50%);
}

.deco-grow .deco-slide:before{
	content:'';
	display: none;
	position: absolute;
	top:0;
	left: 50%;
	width: calc(656 / var(--width)* 100%);
	height: calc(179 / var(--width)* 100%);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100% auto;
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_clear.png);
	transform: translateX(-50%);
	z-index: 2;
}
.deco-grow.step10 .deco-slide:before{
	display: block;
}
.deco-container .deco-slide .swiper-slide{
	background: transparent;
}

.deco-container .deco-slide .swiper-slide:before{
	content:'';
	display: none;
	position: absolute;
	top:0;
	right:0;
	width: calc(560 / var(--width)* 100%);
	height: calc(142 / var(--width)* 100%);
	background-repeat: no-repeat;
	background-position: right 50%;
	background-size: auto 100%;
	animation: prd-motion ease-in 2s infinite;
	z-index: 2;
}

.deco-container .deco-slide .swiper-slide[aria-disabled="true"]:after{
	content:'';
	position: absolute;
	top:50%;
	left: 50%;
	width: calc(566 / var(--width)* 100%);
	height: calc(234 / var(--width)* 100%);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 100% auto;
	background-image: url(/kr/event/2024/05/09_lg_deco/images/room_lock.png);
	transform: translate(-50%, -50%);
	z-index: 2;
}
.deco-container .deco-slide .swiper-slide[aria-disabled="false"]:after{
    display: none;
}
.step0 .deco-slide .swiper-slide:before, .step1 .deco-slide .swiper-slide.room1:before{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_comment_step1.png);
}
.step2 .deco-slide .swiper-slide:before{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_comment_step2.png);
}
.step3 .deco-slide .swiper-slide:before{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_comment_step3.png);
}
.step4 .deco-slide .swiper-slide:before{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_comment_step4.png);
}
.step5 .deco-slide .swiper-slide:before{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_comment_step5.png);
}
.step6 .deco-slide .swiper-slide:before{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_comment_step6.png);
}
.step7 .deco-slide .swiper-slide:before{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_comment_step7.png);
}
.step8 .deco-slide .swiper-slide:before{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_comment_step8.png);
}
.step9 .deco-slide .swiper-slide:before{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/img_room_comment_step9.png);
}

.step0 .deco-slide .swiper-slide.room1:before,
.step1 .deco-slide .swiper-slide.room1:before,
.step2 .deco-slide .swiper-slide.room1:before,
.step3 .deco-slide .swiper-slide.room1:before{
	display: block;
}

.step4 .deco-slide .swiper-slide.room2:before,
.step5 .deco-slide .swiper-slide.room2:before,
.step6 .deco-slide .swiper-slide.room2:before,
.step7 .deco-slide .swiper-slide.room2:before{
	display: block;
}

.step8 .deco-slide .swiper-slide.room3:before,
.step9 .deco-slide .swiper-slide.room3:before{
	display: block;
}

.deco-grow .deco-moving img{
	width: auto;
  	height: 100%;
}
.deco-grow .deco-slide .swiper-button-prev,.deco-grow .deco-slide .swiper-button-next{
	top: 50%;
	width: calc(65 / var(--width)* 100%);
    height: calc(312 / var(--width)* 100%);
	margin-top: 0;
	background-size: 100% auto;
	transform: translateY(-50%);
}

.deco-grow .deco-slide .swiper-button-prev {
    background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_deco_prev.png);
    left: 0;
}

.deco-grow .deco-slide .swiper-button-next {
    background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_deco_next.png);
    right: 0;
}

.board-cnt{
	position: absolute;
	width: calc(1040 / var(--width)* 100%);
	bottom: calc(80 / var(--width)* 100%);
	left: 50%;
	padding-right: calc(288 / var(--width)* 100%);
	background-color: #ffeed0;
    background-repeat: no-repeat;
	background-position: left top;
	background-size: 100% auto;
	background-image: url(/kr/event/2024/05/09_lg_deco/images/bg_board.png);
	border-radius: 15px;
	transform: translateX(-50%);
}

.deco-grow .board-display{
	padding: calc(50 / var(--width)* 100%) 0 calc(65 / var(--width)* 100%) calc(65 / var(--width)* 100%);
}
.deco-grow .title-cnt{
	display: flex;
	padding-bottom: calc(30 / var(--width)* 100%);
	justify-content: space-between;
	align-items: center;
}
.deco-grow .title-cnt .title{
	font-size:22px;
	font-weight: 600;
	letter-spacing:-0.5px;
	font-family: 'Pretendard';
	color: #7D4B00;
}
.deco-grow .title-cnt .deco-count{
	display: flex;
  	align-items: center;
}
.deco-grow .title-cnt .deco-count > *{
	display: inline-flex;
	position:relative;
	font-size: 18px;
	line-height: 32px;
	color: #7D4B00;
	font-weight: 600;
	align-items: center;
	font-family: 'Pretendard';
}
.deco-grow .title-cnt .deco-count > * + *{
	margin-left: 50px;
}
.deco-grow .title-cnt .deco-count > *:before{
	content:'';
	display:inline-block;
	width: 32px;
	height: 32px;
	margin-right: 10px;
	background-image:url('/kr/event/2024/05/09_lg_deco/images/ico_point.svg');
	background-repeat:no-repeat;
	background-position:center center;
	background-size:100% auto;
	vertical-align: middle;
}
.deco-grow .title-cnt .deco-count > .unit:after{
	content:'';
	position:absolute;
	top: 50%;
	right: -20px;
	width: 1px;
	height: 22px;
	background-color: #E5CDA6;
	transform:translateY(-50%);
}
.deco-grow .title-cnt .deco-count > .level{
	line-height: 28px;
}
.deco-grow .title-cnt .deco-count > .level:before{
	width: 28px;
	height: 28px;
	background-image:url('/kr/event/2024/05/09_lg_deco/images/ico_level.svg');
}

.deco-grow .board-tab{
	position: relative;
  	display: flex;
	margin: calc(40 / var(--width)* 100%) 0;
	text-align: left;
	background: transparent;
	top: auto !important;
}

.deco-grow .board-tab .tab-button{
	display:inline-block;
	width: 36px;
	height: 34px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 100% auto;
	vertical-align: middle;
	cursor: pointer;
  	align-items: center;
}
.deco-grow .board-tab .tab-button.prev{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_tab_prev.png);
}
.deco-grow .board-tab .tab-button.next{
	background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_tab_next.png);
}
.deco-grow .board-tab .tabs{
  	display: inline-block;
	margin: 0 10px;
	vertical-align: middle;
}
.deco-grow .board-tab .tabs>li{
  	display: inline-block;
	width: 60px;
	height: 32px;
	margin-left: 8px;
	padding: 0;
	border:2px solid rgba(125,75,0,.3);
	border-radius: 8px;
  	vertical-align: middle;
}
.deco-grow .board-tab .tabs>li:first-child{
	margin-left: 0;
}
.deco-grow .board-tab .tabs>li>a{
  	display: block;
	font-size: 18px;
	line-height: 30px;
	font-weight: 500;
	font-family: 'Pretendard';
	color: #baa863;
	text-align:center;
}

.deco-grow .board-tab .tabs>li.active{
	background-color: #07c189;
	border:2px solid #17a077;
}
.deco-grow .board-tab .tabs>li.active>a{
	color: #fff;
}

.board-display .progress-bar{
	width: 100%;
	height: 32px;
	background-color: #f4fff7;
	border-radius: 15px;
}
.board-display .progress-bar > div{
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 100%;
	border-radius: 15px;
	box-shadow: 0 1px 0 0 rgba(0,0,0,0.25) inset;
}
.board-display .progress-bar .gsap{
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 100%;
	border:2px solid #DB5948;
	background-color: #FF705D;
	border-radius: 15px;
	z-index: 10;
}
.step0 .board-display .progress-bar .gsap{
	border-width: 0;
}
.board-cnt .btn-wrap{
	position: absolute;
	top: 0;
	right: 0;
	width: calc(364 / var(--width)* 100%);
  	height: 100%;
	padding: calc(34 / var(--width)* 100%) calc(32 / var(--width)* 100%);
}
.board-cnt .btn-wrap > div{flex-direction: column;display: flex;justify-content: space-between;}
.board-cnt .btn-wrap a{
	display: block;
	width:100%;
	height:78px;
	background-image: url('/kr/event/2024/05/09_lg_deco/images/btn_room.png');
	background-repeat:no-repeat;
	background-position:center center;
	background-size:100% auto;
}
.board-cnt .btn-wrap a:nth-child(2){
	background-image: url('/kr/event/2024/05/09_lg_deco/images/btn_point.png');
}
.board-cnt .btn-wrap a + a{
	margin-top: calc(35 / var(--width)* 100%);
}
                        
.deco-grow .deco-moving{
	overflow: hidden;
	position: relative;
	height: 590px;
}

.deco-grow .deco-moving video{
  	position: absolute;
  	top: 50%;
    left: 50%;
	width: 100%;
    transform: translate(-50%, -50%);
  	object-fit: inherit;
}

.deco-level-chk{
	position: absolute;
	width: calc(1040 / var(--width)* 100%);
	top: calc(420 / var(--width)* 100%);
	left: 50%;
	padding: 0 calc(60 / var(--width)* 100%);
	transform: translateX(-50%);
}
.deco-level-chk .swiper-slide{
	width: calc(260 / 1040 * 100%);
}
.deco-level-chk .swiper-button-prev,.deco-level-chk  .swiper-button-next{
	top: 50%;
	width: calc(36 / var(--width)* 100%);
	height: calc(189 / var(--width)* 100%);
	margin-top: 0;
	background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_slide_level.png);
	background-size: 100% auto;
	transform: translateY(-50%);
}

.deco-level-chk .swiper-button-prev {
    left: 0;
    transform: translateY(-50%) rotate(-180deg);
}

.deco-level-chk .swiper-button-next {
    right: 0;
}
.deco-level-chk .swiper-pagination{
    display: none;
}

/* 응모횟수 */
#decoKakaoCheckDrawPop {
	max-width: 482px;
	background: transparent;
	border-radius: 0;
}
#decoKakaoCheckDrawPop .mobile{
	display: none;
}
#decoKakaoCheckDrawPop .pop-conts.no-footer:after {
	display: none;
}
#decoKakaoCheckDrawPop .share-pop-bg{
	padding: 0 27px;
	position: relative;
}

#decoKakaoCheckDrawPop .kakao-cnt {
	position: absolute;
	top: 54.8%;
	left: 0;
	width: 100%;
	font-size: 32px;
	font-weight: bold;
	text-align: center;
	line-height: 1.4;
}
#decoKakaoCheckDrawPop .kakao-cnt span {
	color: #00b66a;
}

#decoKakaoCheckDrawPop .btn-wrap {
	position: absolute;
	bottom: 5.7%;
	left: 13.2%;
	width: 73.4%;
	height: 32%;
}

#decoKakaoCheckDrawPop .btn-wrap > div {
	display: flex;
	width: 100%;
	height: 100%;
	flex-direction: column;
	justify-content: space-between;
}
#decoKakaoCheckDrawPop .btn-wrap a:nth-child(1){
	display: block;
	width: 100%;
	height: 40px;
}
#decoKakaoCheckDrawPop .btn-wrap a:nth-child(2){
	display: block;
	width: 100%;
	height: 80px;
}
#decoKakaoCheckDrawPop .btn-pop-close {
	position: absolute;
	top: 125px;
	right: 10px;
	width: 70px;
	height: 70px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% auto;
	background-image: url(/kr/event/2024/05/09_lg_deco/images/popup_mission_close.png);
}
#decoKakaoCheckDrawPop .btn-pop-close:before{
	display: none;
}

/* 미션 팝업 */
#decoMissionPop {
	max-width: 454px;
	background: transparent;
	border-radius: 0;
	position: relative;
}
#decoMissionPop .mobile{
	display: none;
}
#decoMissionPop .mission-bg{
	padding: 27px;
}
#decoMissionPop .pop-conts {
	padding: 0;
	position: absolute;
	top: 129px;
	left: 27px;
	width: calc(100% - 54px);
	height: calc(100% - 129px);
}

#decoMissionPop .pop-conts.no-footer:after{
	display: none;
}
#decoMissionPop .mission-list > li{
	display:flex;
	justify-content: flex-end;
	align-items: center;
	height: 93px;
	padding: 0 32px;
}
#decoMissionPop .mission-list > li > button{
	min-width: 63px;
	padding: 5px 15px;
	background-color: #39cca0;
	border: 1px solid #19ac80;
	color: #fff;
	font-size: 15px;
	line-height: 1.4;
}
#decoMissionPop .mission-list > li > button:disabled{
    position:relative;
    background: #ffeed0;
    border-color: #7d4b00;
    color: #baa863;
}

#decoMissionPop .mission-list > li > button:disabled:after{
    content:'완료';
    position:absolute;
    left: 50%;
    background: #ffeed0;
    color: #baa863;
    transform: translateX(-50%);
    z-index: 10;
}
#decoMissionPop .btn-pop-close {
	position: absolute;
	top: 0;
	right: 0;
	width: 70px;
	height: 70px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% auto;
	background-image: url(/kr/event/2024/05/09_lg_deco/images/popup_mission_close.png);
}
#decoMissionPop .btn-pop-close:before{
	display: none;
}

/* 카카오 팝업 */
#decoCheckPop {
	max-width: 454px;
	background: transparent;
	border-radius: 0;
	padding: 27px;
}
#decoCheckPop .mobile{
	display: none;
}
#decoCheckPop .deco-chk-area{
	position: relative;
}
#decoCheckPop .deco-confirm {
	position: absolute;
	top: 142px;
	left: 50%;
	width: 280px;
	padding: 0 24px;
	text-align: right;
	transform: translateX(-50%);
}
#decoCheckPop .deco-confirm p{
	font-size: 26px;
	font-weight: 600;
	color: #7d4b00;
	line-height: 60px;
	font-family: 'Pretendard';
}
#decoCheckPop .deco-confirm p + p{
	margin-top:10px;
}
#decoCheckPop .deco-confirm p span {
    color: #00b66a;
}
#decoCheckPop .pop-conts.no-footer:after {
	display: none;
}
#decoCheckPop .btn-okay{
	position: absolute;
	bottom: 40px;
	left: 60px;
	width: 280px;
	height: 80px;
}
#decoCheckPop #decoCheckPopClose {
	position: absolute;
	top: 0;
	right: 0;
	width: 70px;
	height: 70px;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% auto;
	background-image: url(/kr/event/2024/05/09_lg_deco/images/popup_mission_close.png);
}
#decoCheckPop .btn-pop-close:before{
	display: none;
}

@media screen and (max-width: 1460px){
	.deco-grow .deco-moving{
		height: 40.4vw;
	}
	.deco-grow .title-cnt .title {
	    font-size: 1.5vw;
	}
	.deco-grow .title-cnt .deco-count > * {
	    font-size: 1.22vw;
	    line-height: 2.15vw;
	}
	.deco-grow .title-cnt .deco-count > * + * {
	    margin-left: 3.35vw;
	}
	.deco-grow .title-cnt .deco-count > .level {
	    line-height: 1.8vw;
	}
	.deco-grow .title-cnt .deco-count > *:before {
	    width: 2.15vw;
	    height: 2.15vw;
	    margin-right: 0.7vw;
	}
	.deco-grow .title-cnt .deco-count > .level:before {
	    width: 1.8vw;
	    height: 1.8vw;
	}
	.deco-grow .title-cnt .deco-count > .unit:after{
		right: -1.4vw;
		height: 1.4vw;
	}
	.deco-grow .board-tab .tab-button{
		width: 2.35vw;
		height: 2.23vw;
	}
	.deco-grow .board-tab .tabs>li {
	    width: 4.1vw;
	    height: 2.19vw;
	    margin-left: 0.6vw;
	}
	.deco-grow .board-tab .tabs>li>a {
	    font-size: 1.2vw;
	    line-height: 2.05vw;
	}
	.board-display .progress-bar {
	    height: 2.19vw;
	}
	.board-cnt .btn-wrap a {
	    height: 5.34vw;
	}
}
@media screen and (max-width: 767px){
    * {
		--width: 720;
	}
  	.deco-container .tab_wrap .tab_inner ul{
        height: 13.05vw;
    }
  	.tab_wrap .tab_inner li span {
        font-size: 3.05vw;
        letter-spacing: -0.03em;
        font-weight: 500;
    }
  	.tab_wrap .tab_inner li.active span {
        font-size: 3.61vw;
    }
  	.tab_wrap .tab_inner li:nth-child(3) span::before {
        width: 11.97vw;
        background-size: contain;
    }
    .deco-intro #decoStartBtn {
        bottom: 8.1%;
        left: 11%;
        width: 78%;
        height: 10.2%;
    }

	.board-display.pc-ver .title-cnt, .board-display.pc-ver .progress-bar{
		display: none;
	}

	.board-display.mobile-ver{
		display: block;
		overflow: hidden;
		position: absolute;
		top: 46.2vw;
		left: 50%;
		width: calc(625 / var(--width)* 100%);
		padding: 4vw 5vw;
		background-color: #ffeed0;
        background-repeat: no-repeat;
        background-position: left top;
        background-size: 100% auto;
        background-image: url(/kr/event/2024/05/09_lg_deco/images/bg_board_m.png);
		border-radius: 8px;
		transform: translateX(-50%);
	}
	.deco-grow .deco-slide{
	    top: calc(280 / var(--width)* 100%);
	    width: 100%;
	    padding: 0;
	}
	.deco-grow .deco-slide:before{
		top: -12.6vw;
		left: 50%;
		width: calc(625 / var(--width)* 100%);
		height: calc(112 / var(--width)* 100%);
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_clear.png);
		z-index: 2;
	}
	.deco-container .deco-slide .swiper-slide:before{
		right:auto;
		left: 8vw;
		width: calc(560 / var(--width)* 100%);
		height: calc(112 / var(--width)* 100%);
		background-position: left 50%;
	}
	
	.deco-container .deco-slide .swiper-slide[aria-disabled="true"]:after{
		width: 57.8vw;
		height: 14.4vw;
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_room_lock.png);
	}
	
	.step0 .deco-slide .swiper-slide:before, .step1 .deco-slide .swiper-slide.room1:before{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_comment_step1.png);
	}
	.step2 .deco-slide .swiper-slide:before{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_comment_step2.png);
	}
	.step3 .deco-slide .swiper-slide:before{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_comment_step3.png);
	}
	.step4 .deco-slide .swiper-slide:before{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_comment_step4.png);
	}
	.step5 .deco-slide .swiper-slide:before{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_comment_step5.png);
	}
	.step6 .deco-slide .swiper-slide:before{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_comment_step6.png);
	}
	.step7 .deco-slide .swiper-slide:before{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_comment_step7.png);
	}
	.step8 .deco-slide .swiper-slide:before{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_comment_step8.png);
	}
	.step9 .deco-slide .swiper-slide:before{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/m_img_room_comment_step9.png);
	}
	.deco-grow .deco-slide .swiper-button-prev, .deco-grow .deco-slide .swiper-button-next {
	    width: calc(26 / var(--width)* 100%);
	    height: calc(90 / var(--width)* 100%);
	    background-size: 100% auto;
	    transform: translateY(-50%);
	}
    .deco-grow .deco-slide .swiper-button-prev {
	    background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_deco_prev_m_active.png);
      	left: 6.8vw;
	}
	
	.deco-grow .deco-slide .swiper-button-next {
	    background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_deco_next_m_active.png);
      	right: 6.8vw;
	}
	.deco-grow .deco-slide .swiper-button-prev.swiper-button-disabled {
      	width: calc(20 / var(--width)* 100%);
	    background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_deco_prev_m.png);
      	opacity: 1;
	}
	
	.deco-grow .deco-slide .swiper-button-next.swiper-button-disabled {
      	width: calc(20 / var(--width)* 100%);
	    background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_deco_next_m.png);
      	opacity: 1;
	}

	.board-cnt{
		width: calc(625 / var(--width)* 100%);
		bottom: calc(25 / var(--width)* 100%);
		padding: 3.6vw 3.4vw 5.9vw;
		background-color: #f9edc1;
        background-image: url(/kr/event/2024/05/09_lg_deco/images/bg_score_m.png);
      	border-radius: 8px;
	}
	.deco-grow .board-display.pc-ver {
        padding:0;
    }
	.deco-grow .title-cnt {
	    padding-bottom: calc(30 / var(--width)* 100%);
	    border-bottom: 0;
	}
	.deco-grow .title-cnt .title {
        font-size: 3.8vw;
    }
	.deco-grow .title-cnt .deco-count > * {
	    font-size: 3.6vw;
	    line-height: 5.55vw;
	}
	.deco-grow .title-cnt .deco-count > * + * {
	    margin-left: 7.2vw;
	}
	.deco-grow .title-cnt .deco-count > .level {
	    line-height: 5vw;
	}
	.deco-grow .title-cnt .deco-count > *:before {
	    width: 5.55vw;
	    height: 5.55vw;
	    margin-right: 1.5vw;
	}
	.deco-grow .title-cnt .deco-count > .level:before {
	    width: 5vw;
	    height: 5vw;
	}
	.deco-grow .title-cnt .deco-count > .unit:after{
		right: -3.4vw;
		height: 3.4vw;
	}
	.deco-grow .board-tab {
      	display: block;
	    margin: 0;
	    padding: 0 12.4vw;
	}
	.deco-grow .board-tab .tab-button{
		position: absolute;
		top: 0;
		width: 6.81vw;
		height: 6.81vw;
	}
	.deco-grow .board-tab .tab-button.prev{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_tab_prev_m.png);
		left: 0;
	}
	.deco-grow .board-tab .tab-button.next{
		background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_tab_next_m.png);
		right: 0;
	}
	.deco-grow .board-tab .tabs{
		display: flex;
		margin: 0;
	}
	.deco-grow .board-tab .tabs>li {
      	flex: 1;
	    width: 11.1vw;
	    height: 6.66vw;
      	margin-left: 1.5vw;
      	border-width: 1px !important;
	}
	.deco-grow .board-tab .tabs>li>a {
	    font-size: 3.34vw;
	    line-height: 6.56vw;
	}
	.board-display .progress-bar {
	    height: 3.9vw;
	}
	.board-display .progress-bar > div {
	    background-color:#f4fff7;
	}
	.board-cnt .btn-wrap {
	    position: static;
	    width: 100%;
        height: auto;
      	margin-top:3vw;
	    padding: 0;
	}
	.board-cnt .btn-wrap > div {
	    flex-direction: row;
	}
	.board-cnt .btn-wrap a {
	    width: 38.89vw;
	    height: 13.32vw;
      	order: 2;
	}
	.board-cnt .btn-wrap a + a {
	    margin-top: 0;
	    order: 1;
	}
  	.deco-grow .deco-moving{
      	display: flex;
      	height: 77.78vw;
      	padding: 2.8vw 0;
      	justify-content: center;
    }
	.deco-grow .deco-moving img, .deco-grow .deco-moving video{
        flex: 1;
      	height: 100%;
    }

    .deco-level-chk{
		width: calc(640 / var(--width)* 100%);
		top: calc(220 / var(--width)* 100%);
		padding: 0 calc(40 / var(--width)* 100%);
	}
	.deco-level-chk .swiper-slide{
		width: calc(320 / 640 * 100%);
	}
	.deco-level-chk .swiper-button-prev,.deco-level-chk  .swiper-button-next{
		width: calc(36 / var(--width)* 100%);
		height: calc(189 / var(--width)* 100%);
		background-image: url(/kr/event/2024/05/09_lg_deco/images/btn_slide_level.png);
	}

	.deco-level-chk .swiper-pagination{
      	display: block;
		bottom: -7.2vw;
		left: 0;
		width: 100%;
	}
    .deco-level-chk .swiper-pagination-bullet {
	    width: 2.75vw;
	    height: 2.75vw;
	    margin: 0 1vw;
	    background: #fff;
	    opacity: .3;
	}

	.deco-level-chk .swiper-pagination-bullet-active {
	    opacity: 1;
		transition: all .3s ease-in-out;
	}
    
    /* 카카오 횟수 팝업 */
	#decoKakaoCheckDrawPop { 
        left: 50% !important;
		top: 50% !important;
		height: auto;
		min-height: auto !important;
		transform: translate(-50%, -50%) !important;
		width: 90vw;
    }
    #decoKakaoCheckDrawPop .pc{
        display: none;
    }
	#decoKakaoCheckDrawPop .mobile{
        display: block;
    }
    #decoKakaoCheckDrawPop .channel-pop-bg{
        padding:0 4.45vw;
    }
	#decoKakaoCheckDrawPop .kakao-cnt {
	    top: 65.5vw;
	    font-size: 6.4vw;
	}
    #decoKakaoCheckDrawPop .btn-wrap {
        bottom: 7.9vw;
        left: 14vw;
        width: 62.2vw;
        height: 42.2vw;
    }
	#decoKakaoCheckDrawPop .btn-wrap a:nth-child(1){
		height: 9vw;
	}
	#decoKakaoCheckDrawPop .btn-wrap a:nth-child(2){
		height: 13.5vw;
	}
	#decoKakaoCheckDrawPop .btn-pop-close {
        top: 18.5vw;
        right: 3.5vw;
        width: 11.11vw;
        height: 11.11vw;
        background-image: url(/kr/event/2024/05/09_lg_deco/images/m_popup_mission_close.png);
    }
	
    /* 미션팝업 */
	#decoMissionPop{
		left: 50% !important;
		top: 50% !important;
		height: auto;
		min-height: auto !important;
		transform: translate(-50%, -50%) !important;
		width: 83.9vw;
	}
	#decoMissionPop .pc{
        display: none;
    }
	#decoMissionPop .mobile{
        display: block;
    }
	#decoMissionPop .mission-bg{
		padding: 4.45vw;
	}
	#decoMissionPop .pop-conts {
	    top: 25.5vw;
	    height: calc(100% - 22.7vw);
	    /* width: 100%; */
	    left: 4.2vw;
	    width: calc(100% - 8.4vw);
	}
	#decoMissionPop .mission-list > li {
	    height: 18.8vw;
	    padding: 0 5.3vw;
	}
	#decoMissionPop .mission-list > li > button{
    	min-width: 2vw;
    	padding: 1.25vw 3.8vw;
    	font-size: 3.2vw;
 }
	#decoMissionPop .btn-pop-close {
	    width: 11.11vw;
	    height: 11.11vw;
	    background-image: url(/kr/event/2024/05/09_lg_deco/images/m_popup_mission_close.png);
	}
	
	/* 레벨 안내 팝업 */
	#decoCheckPop {
		left: 50% !important;
		top: 50% !important;
		height: auto;
		min-height: auto !important;
		transform: translate(-50%, -50%) !important;
		width: 81.8vw;
		padding: 3.4vw;
	}
    #decoCheckPop .pc{
        display: none;
    }
	#decoCheckPop .mobile{
        display: block;
    }
	#decoCheckPop .deco-confirm {
		top: 27.2vw;
		left: 50%;
		width: 62.2vw;
		padding: 0 4.2vw;
	}
	#decoCheckPop .deco-confirm p{
		font-size: 6.4vw;
		line-height: 14.4vw;
	}
	#decoCheckPop .deco-confirm p + p{
		margin-top: 2.4vw;
	}
	#decoCheckPop .btn-okay{
		bottom: 8vw;
		left: 5.8vw;
		width: 63.4vw;
		height: 13.8vw;
	}
	#decoCheckPop #decoCheckPopClose {
	    width: 11.11vw;
	    height: 11.11vw;
	    background-image: url(/kr/event/2024/05/09_lg_deco/images/m_popup_mission_close.png);
	}
}
@keyframes prd-motion {
    0% {
        transform: translateY(10%);
    }
    50% {
        transform: translateY(0%);
    }
    100% {
        transform: translateY(10%);
    }
}