/**
************************************************************************************
* CSR  : http://clm.lge.com/issue/browse/BTOCSITE-66618
* CODE : Dev - EV00019581 , Prod - EV00007451
* FILE : /kr/event/2024/06/04_lg_coupon/eventMainLgCoupon.jsp
* DESC : [6월 통합기획전] 닷컴 쿠폰(웰컴웨딩)
* PROJ : lge.co.kr 5.0
************************************************************************************
*							Modification History
************************************************************************************
* DATE						AUTHOR				DESCRIPTION
************************************************************************************
* 2024/05/23				신우용				Created
************************************************************************************
**/

/* 이벤트 기본 설정 */
* {
	--width: 1380;
}
.evt-func {
	position: relative;
}
.coupon-container{
	margin-bottom: calc(50 / var(--width) * 100%);
}
.coupon-container .evt-acco-head.evt-btn-area{
	top: 0;
	left: 50%;
	width: calc(330 / var(--width) * 100%);
	margin-top: calc(188 / var(--width) * 100%);
	padding-top: calc(50 / var(--width) * 100%);
	transform: translateX(-50%);
}
.coupon-container .evt-acco-area:nth-of-type(2) .evt-acco-head.evt-btn-area{
	margin-top: calc(173 / var(--width) * 100%);
}
.coupon-container .evt-acco-head.evt-btn-area button{
	width: 100%;
}
.coupon-container .evt-acco-head.evt-btn-area a{
	position: absolute;
	bottom: 0;
	right: 0;
	width: calc(60 / 330 * 100%);
	height: calc(1240 / 330 * 100%);
	cursor: pointer;
	z-index: 1;
}

.coupon-container .evt-step{
	position: relative;
}
.coupon-container .evt-step a{
	position:absolute;
	left: 50%;
	top: calc(120 / var(--width) * 100%);
	width: calc(720 / var(--width) * 100%);
	height: calc(600 / var(--width) * 100%);
	transform: translateX(-50%);
}
.coupon-container .evt-step a + a{
	top: calc(780 / var(--width) * 100%);
}
@media screen and (max-width: 767px){
    * {
		--width: 720;
	}
	.coupon-container .evt-acco-head.evt-btn-area {
	    width: calc(300 / var(--width) * 100%);
	    margin-top: calc(175 / var(--width) * 100%);
	}
	.coupon-container .evt-acco-area:nth-of-type(2) .evt-acco-head.evt-btn-area{
		margin-top: calc(160 / var(--width) * 100%);
	}
	.coupon-container .evt-acco-head.evt-btn-area a {
	    width: calc(60 / 300 * 100%);
	    height: calc(1050 / 300 * 100%);
	}
	.coupon-container .evt-step a{
		top: 4.4vw;
		width: 87vw;
		height: 16.3vw;
	}
	.coupon-container .evt-step a + a{
		top: 23.1vw;
	}
}