/**
************************************************************************************
* CSR      : http://clm.lge.com/issue/browse/BTOCSITE-102009
* CODE     : Dev - EV00021081 / PE00416001 , Prod - EV00008771 / PE00821001
* FILE     : /kr/event/2026/01/02_pc_teasing/css/event.css
* DESC     : 26년 아카데미 페스티벌 사전알림신청 개발 요청
* PROJ     : lge.co.kr 5.0
************************************************************************************
*							Modification History
************************************************************************************
* DATE						AUTHOR				DESCRIPTION
************************************************************************************
* 2025/11/27				김기범				Created
* 2025/12/31				신우용				Modify(티징기획전 대응)
************************************************************************************
**/
.pc-teasing-container {
    overflow: hidden;
    position: relative;
    padding: 72px 0 80px;
}

.pc-teasing-container:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1010px;
    background: linear-gradient(180deg, #D9DFE2 0%, #FAFAFA 27%, #E8EBED 56%, #D3DADE 75%, #C8D4DC 100%);
    z-index: -1;
}

.pc-teasing-container * {
    font-family: 'pretendard';
    --width: 1380;
}

.evt-func {
    position: relative;
}

.sub-tit {
    margin-bottom: 16px;
    font-size: 14px;
}

.pc-teasing-form-wrap form,
.pc-teasing-form-wrap form .evt-func {
    height: 100%;
}

.pc-teasing-form-wrap .chk-wrap input+label {
    width: 100%;
    height: 100%;
    font-size: 16px;
    line-height: 1.2;
    color: #43474D;
    padding-left: 24px;
}

.pc-teasing-container .chk-wrap input+label::after {
    top: 0;
    width: 20px;
    height: 20px;
}

.pc-teasing-container .chk-wrap input+label::after {
    background-image: url(/kr/event/2026/01/02_pc_teasing/images/btn-checkbox-off-48.svg)
}

.pc-teasing-container .chk-wrap input:checked+label::after {
    background-image: url(/kr/event/2026/01/02_pc_teasing/images/btn-checkbox-on-48.svg)
}

.pc-teasing-form-wrap .btn-wrap {
    margin: 42px 0;
    text-align: center;
}

.pc-teasing-form-wrap .btn-wrap button {
    width: 260px;
    height: 56px;
    background-image: url('/kr/event/2026/01/02_pc_teasing/images/btn_teasing_join.png');
    background-size: 100% auto;
    background-position: center center;
    background-repeat: no-repeat;
}

.evt-acco-area {
    width: calc(1146 / var(--width)*100%);
    margin: calc(24 / var(--width) * 100%) auto 0;
}

.evt-acco-area .evt-acco-head button {
    display: inline-flex;
    height: 24px;
    font-size: 13px;
    line-height: 1.4;
    gap: 6px;
    align-items: center;
    justify-content: center;
}

.evt-acco-area .evt-acco-head button:after {
    content: '';
    display: inline-flex;
    width: 12px;
    height: 12px;
    background-image: url('/kr/event/2026/01/02_pc_teasing/images/ico_arrow.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% auto;
    transform: rotate(0deg);
    transition: transform 0.3s;
}

.evt-acco-area .evt-acco-head button[aria-expanded="true"]:after {
    transform: rotate(180deg);
}

.evt-acco-area .evt-acco-cont.unfolded {
    margin-top: 30px;
}


form.teasing-plan {
    position: absolute;
    top: 46.1%;
    width: 100%;
    height: 8.364%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
}

form.teasing-plan * {
    font-family: 'Pretendard';
}

form.teasing-plan .form-wrap {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
form.teasing-plan .form-wrap .forms{
    background: #000;
}
form.teasing-plan .chk-wrap input+label {
    padding-left: 24px;
    font-size: 16px;
    line-height: 1.4;
    letter-spacing: -0.4px;
    color: #fff;
    text-align: left;
}

form.teasing-plan .chk-wrap .btn-pop-open {
    text-decoration: underline;
    display: inline;
}

form.teasing-plan .chk-wrap input+label:after {
    background-image: url('/kr/event/2026/01/02_pc_teasing/images/btn-checkbox-off-48-w.svg');
    width: 20px;
    height: 20px;
}

form.teasing-plan .chk-wrap input:checked+label:after {
    background-image: url('/kr/event/2026/01/02_pc_teasing/images/btn-checkbox-on-48-w.svg');
}

form.teasing-plan .joinChkBtn {
    display: inline-block;
    width: calc(460 / 1380 * 100%);
    height: calc(760 / 1380 * 100%);
    background-color: #fff;
    color: #111;
    font-size: 15px;
    font-weight: 500;
    border-radius: 8px;
}

@media screen and (max-width: 1460px) {
    .pc-teasing-container {
        padding: calc(72 / 1480 * 100vw) 0 calc(80 / 1480 * 100vw);
    }

    .pc-teasing-container:before {
        height: calc(1010 / 1480 * 100vw);
    }

    .pc-teasing-form-wrap .chk-wrap input+label {
        font-size: calc(16 / 1480 * 100vw);
        padding-left: calc(24 / 1480 * 100vw);
    }

    .pc-teasing-container .chk-wrap input+label::after {
        width: calc(20 / 1480 * 100vw);
        height: calc(20 / 1480 * 100vw);
    }

    .pc-teasing-form-wrap .btn-wrap {
        margin: calc(42 / 1480 * 100vw) 0;
    }

    .pc-teasing-form-wrap .btn-wrap button {
        width: calc(260 / 1480 * 100vw);
        height: calc(56 / 1480 * 100vw);
    }

    .evt-acco-area .evt-acco-head button {
        font-size: calc(13 / 1480 * 100vw);
    }

    .evt-acco-area .evt-acco-head button:after {
        width: calc(12 / 1480 * 100vw);
        height: calc(12 / 1480 * 100vw);
    }

    .evt-acco-area .evt-acco-cont.unfolded {
        margin-top: calc(30 / 1480 * 100vw);
    }


    form.teasing-plan .chk-wrap input+label {
        padding-left: calc(24 / 1480 * 100vw);
        font-size: calc(16 / 1480 * 100vw);
    }

    form.teasing-plan .chk-wrap input+label:after {
        width: calc(20 / 1480 * 100vw);
        height: calc(20 / 1480 * 100vw);
    }

    form.teasing-plan .joinChkBtn {
        font-size: calc(15 / 1480 * 100vw);
    }
}

@media screen and (max-width: 767px) {
    .pc-teasing-container {
        padding: calc(32 / 390 * 100vw) 0 calc(40 / 390 * 100vw);
    }

    .pc-teasing-container:before {
        height: calc(980 / 390 * 100vw);
    }

    .pc-teasing-form-wrap {
        padding: 0 calc(20 / 390 * 100vw);
    }

    .pc-teasing-form-wrap .chk-wrap input+label {
        font-size: calc(14 / 390 * 100vw);
        padding-left: calc(22 / 390 * 100vw);
        text-align: left;
    }

    .pc-teasing-container .chk-wrap input+label::after {
        width: calc(16 / 390 * 100vw);
        height: calc(16 / 390 * 100vw);
    }

    .pc-teasing-form-wrap .btn-wrap {
        margin: calc(24 / 390 * 100vw) 0;
    }

    .pc-teasing-form-wrap .btn-wrap button {
        width: 100%;
        height: calc(48 / 390 * 100vw);
        background-image: url('/kr/event/2026/01/02_pc_teasing/images/m_btn_teasing_join.png');
    }

    .evt-acco-area {
        width: calc(350 / 390 * 100vw);
        margin: calc(12 / 390 * 100vw) auto 0;
    }

    .evt-acco-area .evt-acco-head button {
        font-size: calc(13 / 390 * 100vw);
    }

    .evt-acco-area .evt-acco-head button:after {
        width: calc(12 / 390 * 100vw);
        height: calc(12 / 390 * 100vw);
    }

    .evt-acco-area .evt-acco-cont.unfolded {
        margin-top: calc(30 / 390 * 100vw);
    }

    form.teasing-plan {
		top: 49%;
        width: calc(350 / 390 * 100vw);
        height: calc(106 / 390 * 100vw);
        padding: 0;
        background: #010101;
    }

    form.teasing-plan .chk-wrap input+label {
        padding-left: calc(20 / 390 * 100vw);
        font-size: calc(14 / 390 * 100vw);
    }

    form.teasing-plan .chk-wrap input+label:after {
        width: calc(16 / 390 * 100vw);
        height: calc(16 / 390 * 100vw);
    }

    form.teasing-plan .joinChkBtn {
        width: 100%;
        height: calc(48 / 390 * 100vw);
        font-size: calc(15 / 390 * 100vw);
    }
}