/**
************************************************************************************
* CSR  : http://clm.lge.com/issue/browse/BTOCSITE-53398
* CODE : Dev - EV00018951 , Prod - EV00006791
* FILE : /kr/event/2024/01/01_lg_set/eventMainLgSet.jsp
* DESC : 세트모델 사은품 증정 이벤트
* PROJ : lge.co.kr 5.0
************************************************************************************
*							Modification History
************************************************************************************
* DATE						AUTHOR				DESCRIPTION
************************************************************************************
* 2023/12/13				정규진			    Created
* 2024/02/27				정규진			    바닥페이지
* 2024/08/08				김미선			    바닥페이지 수정(제품 삭제&추가)
************************************************************************************
**/

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

/* 참여팝업 */
#agree1_f table tbody tr td:last-child {
	font-size:20px;
  	line-height:30px;
	text-decoration: underline;
}
.font-bold {
    font-weight: bold;
}

/* 사은품1 링크 */
.evt-btn-area.eachLink.link-areaA {
    width: 100%;
    height: 100%;
    top: 0;
}
.evt-btn-area.eachLink.link-areaA div {
    height: 0;
    justify-content: space-between;
    align-items: flex-start;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.evt-btn-area.eachLink.link-areaA .linkA {
    width: calc(660 / var(--width) * 100%);
    margin-top: calc(787 / var(--width) * 100%);
}
.evt-btn-area.eachLink.link-areaA a {
    height: 0;
}
.evt-btn-area.eachLink.link-areaA .linkA a {
    width: calc(195 / 660 * 100%);
    padding-top: calc(243 / 660 * 100%);
}

/* 사은품2 링크 */
.evt-btn-area.eachLink.link-areaC {
    width: 100%;
    height: 100%;
    top: 0;
}
.evt-btn-area.eachLink.link-areaC div {
    height: 0;
    justify-content: space-between;
    align-items: flex-start;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.evt-btn-area.eachLink.link-areaC .linkA {
    width: calc(425 / var(--width) * 100%);
    margin-top: calc(592 / var(--width) * 100%);
}
.evt-btn-area.eachLink.link-areaC a {
    height: 0;
}
.evt-btn-area.eachLink.link-areaC .linkA a {
    width: calc(195 / 425 * 100%);
    padding-top: calc(243 / 425 * 100%);
}

/* 사은품3 링크 */
.evt-btn-area.eachLink.link-areaB {
    width: 100%;
    height: 100%;
    top: 0;
}
.evt-btn-area.eachLink.link-areaB div {
    height: 0;
    justify-content: space-between;
    align-items: flex-start;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.evt-btn-area.eachLink.link-areaB .linkE {
    width: calc(200 / var(--width) * 100%);
    margin-top: calc(591 / var(--width) * 100%);
}
.evt-btn-area.eachLink.link-areaB .linkF {
    width: calc(660 / var(--width) * 100%);
    margin-top: calc(1028 / var(--width) * 100%);
    flex-wrap: wrap;
}
.evt-btn-area.eachLink.link-areaB a {
    height: 0;
}
.evt-btn-area.eachLink.link-areaB .linkE a {
    width: calc(195 / 200 * 100%);
    padding-top: calc(243 / 200 * 100%);
}
.evt-btn-area.eachLink.link-areaB .linkF a {
    width: calc(195 / 660 * 100%);
    padding-top: calc(182 / 660 * 100%);
    margin-bottom: calc(40 / var(--width) * 100%);
}

.evt-btn-area.evt-join-btn {
    width: calc(300 / var(--width) * 100%);
    padding-top: calc(65 / var(--width) * 100%);
    margin-bottom: calc(100 / var(--width) * 100%);
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
}
.evt-btn-area.evt-join-btn a {
    width: 100%;
}
.evt-acco-head.evt-btn-area {
    width: 100%;
    padding-top: calc(80 / var(--width) * 100%);
}
.evt-acco-head.evt-btn-area .evt-acco-btn {
    width: 100%;
    height: 100%;
}
@media screen and (max-width: 767px){
    * {
        --width: 720;
    }
    /* 참여팝업 */
    #agree1_f table tbody tr td:last-child {
        font-size:16px;
        line-height:24px;
    }
    
    /* 사은품1 링크 */
    .evt-btn-area.eachLink.link-areaA .linkA {
        width: calc(510 / var(--width) * 100%);
        margin-top: calc(873 / var(--width) * 100%);
        flex-wrap: wrap;
    }
    .evt-btn-area.eachLink.link-areaA .linkA a {
        width: calc(240 / 510 * 100%);
        padding-top: calc(300 / 510 * 100%);
        margin-bottom: calc(30 / 510 * 100%);
    }

    /* 사은품2 링크 */
    .evt-btn-area.eachLink.link-areaC .linkA {
        width: calc(510 / var(--width) * 100%);
        margin-top: calc(675 / var(--width) * 100%);
    }
    .evt-btn-area.eachLink.link-areaC .linkA a {
        width: calc(200 / 425 * 100%);
        padding-top: calc(252 / 425 * 100%);
    }

    /* 사은품3 링크 */
    .evt-btn-area.eachLink.link-areaB .linkE {
        width: calc(240 / var(--width) * 100%);
        margin-top: calc(674 / var(--width) * 100%);
        flex-wrap: wrap;
    }
    .evt-btn-area.eachLink.link-areaB .linkF {
        width: calc(510 / var(--width) * 100%);
        margin-top: calc(1175 / var(--width) * 100%);
        flex-wrap: wrap;
    }
    .evt-btn-area.eachLink.link-areaB .linkE a {
        width: calc(240 / 240 * 100%);
        padding-top: calc(300 / 240 * 100%);
        margin-bottom: calc(214 / 240 * 100%);
    }
    .evt-btn-area.eachLink.link-areaB .linkF a {
        width: calc(243 / 515 * 100%);
        padding-top: calc(254 / 515 * 100%);
        margin-bottom: calc(30 / 515 * 100%);
    }

    .evt-btn-area.evt-join-btn {
        width: calc(602 / var(--width) * 100%);
        padding-top: calc(89 / var(--width) * 100%);
        margin-bottom: calc(100 / var(--width) * 100%);
    }
    .evt-acco-head.evt-btn-area {
        padding-top: calc(100 / var(--width) * 100%);
    }
}