/**
************************************************************************************
* CODE : Dev - EV00020501 , Prod - EV00008191
* FILE : /kr/event/2025/05/02_styler_pe/eventMainStylerReview.jsp
* DESC : 스타일러 런칭 프로모션 -구매 인증 이벤트 5월 페이지 분리
* PROJ : lge.co.kr 5.0
************************************************************************************
*							Modification History
************************************************************************************
* DATE						AUTHOR				DESCRIPTION
************************************************************************************
* 2025/05/02				김기범				Created
************************************************************************************
**/

/* 이벤트 기본 설정 */
* {
	--width: 1380;
}
.evt-func {
	position: relative;
}

/* 레이어 팝업 아코디언 */
.layer-pop .evt-acco-area{
	margin-top:24px;
}
.layer-pop .pop-conts.academy-pop .form-wrap .forms .conts .evt-acco-area .sn-number-wrap{
	padding:12px 24px;
}
.layer-pop .evt-acco-head{
	top: 12px;
    height: 27px;
    padding: 0 12px;
	z-index:1;
}
.layer-pop .evt-btn-area .evt-acco-btn{
	width:100%;
}
.layer-pop .evt-acco-cont{
	position:relative;
}
.layer-pop .evt-acco-cont:after{
	content:'';
	position: absolute;
	top: 10px;
	right: 16px;
	width: 32px;
	height: 32px;
	background: url(/lg5-common/images/icons/btn-down-16-black.svg) no-repeat 50% 50%;
	transition: all .3s;
}
.layer-pop .evt-acco-cont.unfolded:after{
	transform: rotate(180deg);
}

/* 아코디언 버튼 */
.evt-acco-func .evt-btn-area {
	padding-top: calc(80 / var(--width) * 100%);
}
.evt-acco-func .evt-btn-area  button {
	width: 100%;
}

/* 참여팝업 버튼 */
.evt-btn-area.styler-join{
    bottom: 0;
    margin-bottom: calc(168 / var(--width)* 100%);
    padding-bottom: calc(96 / var(--width)* 100%);
}

.evt-btn-area.styler-join a{
    width: calc(500 / var(--width)* 100%);
}

.evt-btn-area.styler-join2{
    bottom: 0;
    margin-bottom: calc(160 / var(--width)* 100%);
    padding-bottom: calc(155 / var(--width)* 100%);
}
.evt-btn-area.styler-join2 > div{
	flex-direction: column;
	justify-content: space-between;
}
.evt-btn-area.styler-join2 a{
    width: calc(490 / var(--width)* 100%);
    height: calc(935 / var(--width)* 100%);
}
.evt-btn-area.styler-join2 a:last-child{
	height: calc(550 / var(--width)* 100%);
}

@media screen and (max-width: 767px){
    * {
		--width: 720;
	}
    #eventJoinStylerReview .pop-conts.academy-pop .form-wrap .forms .conts .sn-number-wrap .tit{
    	font-size: 14px;
    }
    #eventJoinStylerReview .serial-input-wrap .box .input-wrap{
		margin-bottom: 0 !important;
	}

    .evt-btn-area.styler-join{
        padding-bottom: calc(98 / var(--width)* 100%);
    }
    .evt-btn-area.styler-join a{
        width: calc(640 / var(--width)* 100%);
    }

	.evt-btn-area.styler-join2{
	    margin-bottom: calc(150 / var(--width)* 100%);
	    padding-bottom: calc(165 / var(--width)* 100%);
	}
	.evt-btn-area.styler-join2 a{
	    width: calc(620 / var(--width)* 100%);
	}
}