/**
************************************************************************************
* CSR  : http://clm.lge.com/issue/browse/BTOCSITE-34163
* CODE : Dev - EV00018321 , Prod - EV00005841
* FILE : /kr/event/2023/07/01_mem_svc/eventMainMemSvc.jsp
* DESC : 3년 무상 SVC 신청 페이지
* PROJ : lge.co.kr 5.0
************************************************************************************
*							Modification History
************************************************************************************
* DATE						AUTHOR				DESCRIPTION
************************************************************************************
* 2023/07/04				신우용				Created
************************************************************************************
**/

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

.tabs-wrap .tabs {
    display: flex;
    margin: 0;
    padding: 0;
}

.tabs-wrap .tabs > li {
    flex-grow: 1;
    margin: 0;
    padding: 0;
}
.tabs-wrap .tabs li.m2{
	margin: 0 -1px;
}
.tabs-wrap .tabs li a {
    display: block;
    height: 0;
    background-size: 100% !important;
	background-repeat: no-repeat;
	background-position: center center;
    padding-top: calc(360 / 1380 * 100%);
}

.tabs-wrap .tabs li.m1 a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/tab_01.jpg);
}

.tabs-wrap .tabs li.m2 a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/tab_03.jpg);
}

.tabs-wrap .tabs li.m3 a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/tab_02.jpg);
}

.tabs-wrap .tabs li.m1.on a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/tab_01_on.jpg);
}

.tabs-wrap .tabs li.m2.on a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/tab_03_on.jpg);
}

.tabs-wrap .tabs li.m3.on a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/tab_02_on.jpg);
}

.mdevice .tabs-wrap .tabs li a {
    padding-top: calc(360 / var(--width) * 100%);
}

.mdevice .tabs-wrap .tabs li.m1 a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/m_tab_01.jpg);
}

.mdevice .tabs-wrap .tabs li.m2 a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/m_tab_03.jpg);
}

.mdevice .tabs-wrap .tabs li.m3 a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/m_tab_02.jpg);
}

.mdevice .tabs-wrap .tabs li.m1.on a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/m_tab_01_on.jpg);
}

.mdevice .tabs-wrap .tabs li.m2.on a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/m_tab_03_on.jpg);
}

.mdevice .tabs-wrap .tabs li.m3.on a {
    background-image: url(/kr/event/2023/07/01_mem_svc/images/m_tab_02_on.jpg);
}

#tab1 .evt-btn-area {
	bottom: 0;
	margin-bottom: calc(60 / 1380 * 100%);
    padding-bottom: calc(55 / 1380 * 100%);
}
#tab1 .evt-btn-area a {
	width: calc(215 / 1380 * 100%);
}

.mdevice #tab1 .evt-btn-area {
	margin-bottom: calc(60 / var(--width) * 100%);
    padding-bottom: calc(55 / var(--width) * 100%);
}
.mdevice #tab1 .evt-btn-area a {
	width: calc(215 / var(--width) * 100%);
}

#tab3 .evt-btn-area {
	bottom: 0;
	margin-bottom: calc(138 / 1380 * 100%);
    padding-bottom: calc(100 / 1380 * 100%);
}
#tab3 .evt-btn-area a {
	width: calc(600 / 1380 * 100%);
}

.mdevice #tab3 .evt-btn-area {
	margin-bottom: calc(138 / var(--width) * 100%);
    padding-bottom: calc(100 / var(--width) * 100%);
}
.mdevice #tab3 .evt-btn-area a {
	width: calc(600 / var(--width) * 100%);
}