/**
************************************************************************************
* CSR      : http://clm.lge.com/issue/browse/BTOCSITE-74016
* CODE     : Dev - EV00019881, Prod - EV00007721
* FILE     : /kr/event/2024/09/03_lg_raffle/
* DESC     : 9월 통합_래플 이벤트
* PROJ     : lge.co.kr 5.0
************************************************************************************
*							Modification History
************************************************************************************
* DATE						AUTHOR				DESCRIPTION
************************************************************************************
* 2024/08/16				신우용				Created
************************************************************************************
**/

/* 이벤트 기본 설정 */
* {
    --width: 1380;
}

.evt-func {
    position: relative;
}

#agreeRaffle1_f table tbody td:nth-child(3) {
	font-weight: bold;
    line-height: 1.5;
    text-decoration: underline;
}
.raffle-container .evt-func:last-of-type {
    display: none;
}
.raffle-container .swiper-button-next:after, .raffle-container .swiper-button-prev:after{
	display: none;
}

.raffle-container .raffle-swiper {
    overflow: hidden;
    position: relative;
}
.raffle-container .raffle-time{
	position: absolute;
    display: flex;
    top: calc(488 / var(--width)* 100%);
    left: 50%;
    width: 100%;
    height: calc(60 / var(--width)* 100%);
    font-size: 16px;
    font-family: 'Pretendard';
    font-weight: 500;
    color: #fff;
    justify-content: center;
    align-items: center;
    letter-spacing: -0.9px;
    transform: translateX(-50%);
}
.raffle-container .raffle-time em{
	display:inline-block;
  	margin-right: 12px;
    color: #FFE4B0;
    font-weight: 600;
  	vertical-align:middle;
}
.raffle-container .raffle-swiper .swiper-container {
    position: absolute;
   	top: calc(555 / var(--width)* 100%);
    left: 50%;
    width: calc(740 / var(--width)* 100%);
    height: calc(558 / var(--width)* 100%);
    transform: translateX(-50%);
}
.raffle-container .raffle-swiper .swiper-container .swiper-wrapper {
    height: 100%;
}
.raffle-container .raffle-swiper .swiper-wrapper .swiper-slide {
    position: relative;
    background-color: transparent;
}

.raffle-container .raffle-swiper .swiper-slide .week-content {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 100% auto;
}

.raffle-container .raffle-swiper .swiper-slide.week1 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week1.png);
}

.raffle-container .raffle-swiper .swiper-slide.week2 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week2.png);
}

.raffle-container .raffle-swiper .swiper-slide.week3 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week3.png);
}

.raffle-container .raffle-swiper .swiper-slide.week4 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week4.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="2"] .swiper-slide.week1 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week1_end.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="3"] .swiper-slide.week1 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week1_end.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="3"] .swiper-slide.week2 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week2_end.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="4"] .swiper-slide.week1 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week1_end.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="4"] .swiper-slide.week2 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week2_end.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="4"] .swiper-slide.week3 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week3_end.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="5"] .swiper-slide.week1 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week1_end.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="5"] .swiper-slide.week2 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week2_end.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="5"] .swiper-slide.week3 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week3_end.png);
}

.raffle-container .raffle-swiper .swiper-container[data-raffle="5"] .swiper-slide.week4 .week-content {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/img_raffle_week4_end.png);
}

.raffle-container .swiper-button-prev, .raffle-container .swiper-button-next {
  	display: none !important;
    width: calc(80 / 740 * 100%);
    height: calc(174 / 740 * 100%);
    margin-top: 0;
    z-index: 10;
    cursor: pointer;
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
    background-position: center;
    background-repeat: no-repeat;
}

.raffle-container .swiper-button-prev, .raffle-container .swiper-container-rtl .swiper-button-next {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/btn_raffle_slide.svg);
    left: 0;
    transform: translateY(-50%) rotate(-180deg);
}

.raffle-container .swiper-button-next, .raffle-container .swiper-container-rtl .swiper-button-prev {
    background-image: url(/kr/event/2024/09/03_lg_raffle/images/btn_raffle_slide.svg);
    right: 0;
    transform: translateY(-50%);
}

.evt-btn-area.raffle-btn{
    bottom: 0;
    margin-bottom: calc(50 / var(--width)* 100%);
    padding-bottom: calc(122 / var(--width)* 100%);
}
.evt-btn-area.raffle-btn > div{
	left: 50%;
	width: calc(560 / var(--width)* 100%);
	justify-content: space-between;
	transform: translateX(-50%);
}
.evt-btn-area.raffle-btn > div [class*="-group"]{
    position: static;
    height: 100%;
    margin: 0 calc(20 / var(--width)* 100%);
    flex-direction: column;
}
.evt-btn-area.raffle-btn button{
    width: 100%;
}

.next-week{
  	display: none;
    position: relative;
}
.raffle-trailer{
	position: absolute;
	top: 50%;
	left: 50%;
	width: calc(640 / var(--width)* 100%);
	transform: translate(-50%,-50%);
}

/* 응모횟수 */
#evtKakaoCheckDrawPop {
	max-width: 428px;
	background: transparent;
	border-radius: 0;
}
#evtKakaoCheckDrawPop .mobile{
	display: none;
}
#evtKakaoCheckDrawPop .pop-conts.no-footer:after {
	display: none;
}
#evtKakaoCheckDrawPop .share-pop-bg{
	position: relative;
}

#evtKakaoCheckDrawPop .kakao-cnt {
	position: absolute;
	top: 45.5%;
	left: 0;
	width: 100%;
	font-size: 34px;
	font-weight: 700;
	text-align: center;
	letter-spacing: -1.5px;
	line-height: 1.4;
}
#evtKakaoCheckDrawPop .kakao-cnt span {
	color: #136b81;
}

#evtKakaoCheckDrawPop .btn-pop-close {
	position: absolute;
	top: auto;
    bottom: 27px;
    left: 50%;
    right: auto;
    width: 370px;
    height: 60px;
    transform: translateX(-50%);
}
#evtKakaoCheckDrawPop .btn-pop-close:before{
	display: none;
}

/* 주차별 응모 팝업 */
#evtKakaoCheckWeekPop {
	max-width: 428px;
	background: transparent;
	border-radius: 0;
}
#evtKakaoCheckWeekPop .mobile{
	display: none;
}
#evtKakaoCheckWeekPop .pop-conts.no-footer:after {
	display: none;
}
#evtKakaoCheckWeekPop .share-pop-bg{
	position: relative;
}
#evtKakaoCheckWeekPop .weekend-share{
	position: absolute;
	top: 127px;
	left: 0;
	width: 100%;
}
#evtKakaoCheckWeekPop .weekend-share li{
	display: flex;
	width: 100%;
	height: 54px;
	padding: 0 38px;
	align-items: center;
	justify-content: flex-end;
}
#evtKakaoCheckWeekPop .weekend-share li + li{
	margin-top: 8px;
}
#evtKakaoCheckWeekPop .weekend-share li strong{
	display:inline-flex;
	padding: 0 12px;
	font-size: 26px;
	font-weight: 700;
	text-align: center;
	letter-spacing: -0.5px;
	line-height: 1;
	color: #22434b;
	background-color: #fff;
	align-items: center;
}
#evtKakaoCheckWeekPop .weekend-share li strong [id*="weekShareCnt"]{
	font-size: 35px;
}
#evtKakaoCheckWeekPop .btn-pop-close {
	position: absolute;
	top: auto;
	bottom: 30px;
	left: 50%;
	right: auto;
	width: 370px;
	height: 60px;
	transform: translateX(-50%);
}
#evtKakaoCheckWeekPop .btn-pop-close:before{
	display: none;
}
                          
@media screen and (max-width: 1460px) {
	.raffle-container .raffle-time {
      	font-size: 1.1vw;
    }
}
@media screen and (max-width: 767px) {
    * {
        --width: 720;
    }
	.raffle-container .raffle-time {
        top: calc(221 / var(--width)* 100%);
        width: 100%;
        height: calc(35 / var(--width)* 100%);
        padding-left: calc(150 / var(--width)* 100%);
      	font-size: 3.8vw;
      	justify-content: flex-start;
    }
    .raffle-container .raffle-swiper .swiper-container {
		top: calc(257 / var(--width)* 100%);
        width: calc(655 / var(--width)* 100%);
        height: calc(284 / var(--width)* 100%);
    }
    .raffle-container .raffle-swiper .swiper-slide.week1 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week1.png);
    }
    
    .raffle-container .raffle-swiper .swiper-slide.week2 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week2.png);
    }
    
    .raffle-container .raffle-swiper .swiper-slide.week3 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week3.png);
    }
    
    .raffle-container .raffle-swiper .swiper-slide.week4 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week4.png);
    }
	.raffle-container .raffle-swiper .swiper-container[data-raffle="2"] .swiper-slide.week1 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week1_end.png);
    }

    .raffle-container .raffle-swiper .swiper-container[data-raffle="3"] .swiper-slide.week1 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week1_end.png);
    }

    .raffle-container .raffle-swiper .swiper-container[data-raffle="3"] .swiper-slide.week2 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week2_end.png);
    }

    .raffle-container .raffle-swiper .swiper-container[data-raffle="4"] .swiper-slide.week1 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week1_end.png);
    }

    .raffle-container .raffle-swiper .swiper-container[data-raffle="4"] .swiper-slide.week2 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week2_end.png);
    }

    .raffle-container .raffle-swiper .swiper-container[data-raffle="4"] .swiper-slide.week3 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week3_end.png);
    }

    .raffle-container .raffle-swiper .swiper-container[data-raffle="5"] .swiper-slide.week1 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week1_end.png);
    }

    .raffle-container .raffle-swiper .swiper-container[data-raffle="5"] .swiper-slide.week2 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week2_end.png);
    }

    .raffle-container .raffle-swiper .swiper-container[data-raffle="5"] .swiper-slide.week3 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week3_end.png);
    }

    .raffle-container .raffle-swiper .swiper-container[data-raffle="5"] .swiper-slide.week4 .week-content {
        background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_img_raffle_week4_end.png);
    }
    .raffle-container .swiper-button-prev, .raffle-container .swiper-button-next {
        width: calc(80 / 655 * 100%);
        height: calc(110 / 655 * 100%);
    }
	.raffle-container .swiper-button-prev, .raffle-container .swiper-container-rtl .swiper-button-next,
	.raffle-container .swiper-button-next, .raffle-container .swiper-container-rtl .swiper-button-prev{
		background-image: url(/kr/event/2024/09/03_lg_raffle/images/m_btn_raffle_slide.svg);
	}
    .evt-btn-area.raffle-btn{
	    margin-bottom: calc(20 / var(--width)* 100%);
	    padding-bottom: calc(463 / var(--width)* 100%);
	}
	.evt-btn-area.raffle-btn > div{
      	width: calc(600 / var(--width)* 100%);
		flex-direction: column;
	}
	.evt-btn-area.raffle-btn > div [class*="-group"]{
	    margin: calc(20 / var(--width)* 100%) 0;
	}
	.evt-btn-area.raffle-btn > div [class*="-group"] button:last-of-type{
		height: calc(490 / var(--width)* 100%);
	}
	/* 카카오 횟수 팝업 */
	#evtKakaoCheckDrawPop { 
        left: 50% !important;
		top: 50% !important;
		height: auto;
		min-height: auto !important;
		transform: translate(-50%, -50%) !important;
		width: 75vw;
    }
    #evtKakaoCheckDrawPop .pc{
        display: none;
    }
	#evtKakaoCheckDrawPop .mobile{
        display: block;
    }
	#evtKakaoCheckDrawPop .kakao-cnt {
	    top: 45.2vw;
	    font-size: 6.4vw;
	}
	#evtKakaoCheckDrawPop .btn-pop-close {
        bottom: 5.8vw;
        width: 70.2vw;
        height: 11.4vw;
    }
    
    /* 주차별 카카오 횟수 팝업 */
	#evtKakaoCheckWeekPop { 
        left: 50% !important;
		top: 50% !important;
		height: auto;
		min-height: auto !important;
		transform: translate(-50%, -50%) !important;
		width: 75vw;
    }
    #evtKakaoCheckWeekPop .pc{
        display: none;
    }
	#evtKakaoCheckWeekPop .mobile{
        display: block;
    }
	#evtKakaoCheckWeekPop .weekend-share{
		top: 22.5vw;
	}
	#evtKakaoCheckWeekPop .weekend-share li{
		height: 10vw;
		padding: 0 8.2vw;
	}
	#evtKakaoCheckWeekPop .weekend-share li + li{
		margin-top: 3vw;
	}
	#evtKakaoCheckWeekPop .weekend-share li strong{
		padding: 0 3.4vw;
		font-size: 4.2vw;
	}
	#evtKakaoCheckWeekPop .weekend-share li strong [id*="weekShareCnt"]{
		font-size: 6.8vw;
	}
	#evtKakaoCheckWeekPop .btn-pop-close {
        bottom: 5.8vw;
        width: 70.2vw;
        height: 11.4vw;
    }
}

.tabs-wrap {
    position: sticky;
    overflow: hidden;
    z-index: 5;
    top: 0;
    left: 0;
}
.tabs-wrap .tabs {
    width: 100%;
    display: flex;
    height: 80px;
  	margin: 0;
    padding: 0;
}
.tabs-wrap .tabs li {
  	margin: 0;
    flex: 1;
    background-color: #fffdf7;
}
.tabs-wrap .tabs li.on {
    background-color: #ee9f2a;
    border: 0;
}
.tabs-wrap .tabs li a{
	display: block;
  	width: 100%;
    height: 100%;
}
.tabs-wrap .tabs li span {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 24px;
    font-weight: 500;
    color: #94613d;
    line-height: 1.4em;
    letter-spacing: -0.03em;
    border-left: solid 2px #fceace;
    font-family: 'Tenada';
}
.tabs-wrap .tabs li.on span {
    border-color: #ee9f2a;
    color: #fff;
}
.tabs-wrap .tabs li:first-child.on span {
    border-left: 0;
}
.tabs-wrap .tabs li span em {
    margin-top: 5px;
}

.tab-title{
	display: flex;
    justify-content: center;
    align-items: center;
    height: 120px;
    color: #fff;
    background-color: #ed9393;
    font-size: 24px;
  	font-weight: 600;
}


@media screen and (max-width: 767px){
    .tabs-wrap{top:46px}
    .header.helloBar~.container .tabs-wrap{top:88px}

    .tabs-wrap .tabs {
        height: 13.75vw;
    }
    .tabs-wrap .tabs li span {
        font-size: calc(26/720*100vw);
        letter-spacing: -0.03em;
        font-weight: 500;
    }
    .tabs-wrap .tabs li span em {
        margin-top: 1.11vw;
    }
}	