/**
************************************************************************************
* CSR  : http://clm.lge.com/issue/browse/BTOCSITE-69761
* CODE : Dev - EV00019681 , Prod - EV00007541
* FILE : /kr/event/2024/07/05_standbyme_7month/eventMainStandbyme7month.jsp
* DESC : 스탠바이미 7월 광고 연계 기획전
* PROJ : lge.co.kr 5.0
************************************************************************************
*							Modification History
************************************************************************************
* DATE						AUTHOR				DESCRIPTION
************************************************************************************
* 2024/06/24				임명미				Created
************************************************************************************
**/

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

.tabs-wrap{
	position: sticky;
	top: 0;
	z-index: 10;
}
.tabs-wrap .tabs {
    display: flex;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}
.tabs-wrap .tabs li{
	flex: 1;
	padding: 0;
	margin: 0;
}
.tabs-wrap .tabs li a{
	display: block;
	width:100%;
	height:100%;
	background-position: left top;
	background-repeat: no-repeat;
	background-size: 100% auto;
}
.tabs-wrap .tabs .standbyme_sns.on a{
	background-image:url(/kr/event/2024/07/05_standbyme_7month/images/tab01_active.jpg);
}
.tabs-wrap .tabs .standbyme_time.on a{
	background-image:url(/kr/event/2024/07/05_standbyme_7month/images/tab02_active.jpg);
}
.tabs-wrap .tabs .standbyme_special.on a{
	background-image:url(/kr/event/2024/07/05_standbyme_7month/images/tab03_active.jpg);
}

/* -- 유튜브 플레이-- */
.evt-youtube-area {
	position: absolute;
	overflow: hidden;
	bottom: calc(126 / var(--width) * 100%);
	left: 50%;
	width: calc(722 / var(--width) * 100%);
	height: calc(519 / var(--width) * 100%);
	transform: translateX(-50%);
}
.btn-youtube-play {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	/* border-radius: 19px; */
	overflow: hidden;
}
.btn-youtube-play img {
	height: 100%;
}
.btn-youtube-play.fadeOut {
	z-index: -1;
}
.evt-youtube-player {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	border-radius: 19px;
}

/* -- 버튼 공통 -- */
.evt-btn-area {
    width: calc(640 / var(--width) * 100%);
    padding-top: calc(80 / var(--width) * 100%);
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}
.evt-btn-area div, .evt-btn-area a {
    width: 100%;
    height: 100%;
}

/* 공유 인증하기 */
.evt-btn-area.evt-join-one {
    bottom: calc(213 / var(--width) * 100%);
}
/* 스탠바이미 인증하기 */
.evt-btn-area.evt-join-two {
    bottom: calc(179 / var(--width) * 100%);
}

/* 해시태그 버튼 */
.evt-btn-area.evt-hash-area{
	padding-top: calc(70 / var(--width) * 100%);
    bottom: calc(488 / var(--width)* 100%);
}
.evt-btn-area.evt-hash-area button, .evt-btn-area.evt-hash-area a {
	width: 50%;
}

/* -- 특별혜택전 상풍 링크 -- */
.standbyme-link{
	position: relative;
}
.standbyme-link:first-of-type{
	padding-top:60px;
  	background-color:#ffeddf;
}
.standbyme-link ul{
	position: absolute;
	bottom: calc(191 / var(--width)* 100%);
	left: 50%;
	width: calc(744 / var(--width)* 100%);
	height: calc(1005 / var(--width)* 100%);
	transform: translateX(-50%);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.standbyme-link:nth-child(1) ul{
	bottom: calc(170 / var(--width)* 100%);
	height: calc(882 / var(--width)* 100%);
}
.standbyme-link.finish:before{
	content:'해당 제품은 행사 종료되었습니다.';
  	display:flex;
  	position: absolute;
  	top:0;
  	left:0;
  	width:100%;
    height:100%;
    font-size: 32px;
    font-weight: 500;
    color: #fff;
    background: rgba(0,0,0,.8);
  	align-items: center;
  	justify-content: center;
    z-index: 1;
}
.standbyme-link ul > li{
	position: relative;
	flex: 1;
	height: 100%;
	margin: 0 calc(20 / var(--width)* 100%);
}
.standbyme-link ul > li a{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:100%;
}

/* 유의사항 */
.evt-acco-head{
	top: 0;
	bottom: initial;
	width: 100%;
	padding-top: calc(104 / var(--width)* 100%);
}
.evt-acco-head button{
	width: 100%;
}

/* 참여하기 팝업 1  > 초대권 선택 */
[id*=eventJoinStandbyme7month] .select-list-wrap > ul {
	margin-top: -22px;
	margin-left: -23px;
	padding-bottom: 5px;
}

/* 참여하기 팝업 2  > 스탠바이미 제품 소지 여부 */
[id*=eventJoinStandbyme7month] .select-list-wrap>ul{
	margin-left: -35px;
}
[id*=eventJoinStandbyme7month] .select-list-wrap>ul>li{
	width: auto;
}
/* 참여팝업 2 > 개인정보 수집 이용 동의 스타일 */
#snsAgree1_f table tbody td {
	font-weight: bold;
}
#snsAgree1_f table tbody tr td:last-child {
	font-size:20px;
  	line-height:30px;
	text-decoration: underline;
}

@media screen and (max-width: 767px){
    * {
		--width: 720;
	}
	.tabs-wrap{
    	top: 46px;
    }
  	.header.helloBar~.mobile-nav-wrap ~ #content .event-container .tabs-wrap {
		top: 88px;
	}
	.tabs-wrap .tabs .standbyme_sns.on a{
		background-image:url(/kr/event/2024/07/05_standbyme_7month/images/m_tab01_active.jpg);
	}
	.tabs-wrap .tabs .standbyme_time.on a{
		background-image:url(/kr/event/2024/07/05_standbyme_7month/images/m_tab02_active.jpg);
	}
	.tabs-wrap .tabs .standbyme_special.on a{
		background-image:url(/kr/event/2024/07/05_standbyme_7month/images/m_tab03_active.jpg);
	}

	/* -- 유튜브 플레이-- */
	.evt-youtube-area {
		bottom: calc(60 / var(--width) * 100%);
		width: calc(642 / var(--width) * 100%);
		height: calc(229 / var(--width) * 100%);
	}
	.evt-youtube-player {
		border-radius: 10px;
	}

	/* -- 버튼 공통 -- */
	.mdevice .evt-btn-area {
		padding-top: calc(100 / var(--width) * 100%);
	}

	/* 공유 인증하기 */
	.mdevice .evt-btn-area.evt-join-one {
		bottom: calc(110 / var(--width) * 100%);
	}
	/* 스탠바이미 인증하기 */
	.mdevice .evt-btn-area.evt-join-two {
		bottom: calc(88 / var(--width) * 100%);
	}

	/* 해시태그 버튼 */
	.mdevice .evt-btn-area.evt-hash-area{
		width: calc(640 / var(--width)* 100%);
		padding-top: calc(81 / var(--width) * 100%);
		bottom: calc(255 / var(--width)* 100%);
	}

	/* -- 특별혜택전 상풍 링크 -- */
	.standbyme-link ul{
		bottom: calc(98 / var(--width)* 100%);
		width: calc(665 / var(--width)* 100%);
		height: calc(525 / var(--width)* 100%);
	}
	.standbyme-link:nth-child(1) ul{
		bottom: calc(83 / var(--width)* 100%);
		height: calc(432 / var(--width)* 100%);
	}
	.standbyme-link ul > li{
		margin: 0 calc(10 / var(--width)* 100%);
	}
	.standbyme-link.finish:before{
        font-size:4.8vw;
    }
	/* 유의사항 */
	.evt-acco-head{
		padding-top: calc(130 / var(--width)* 100%) !important;
	}

	/* 참여하기 팝업 1  > 초대권 선택 */
	[id*=eventJoinStandbyme7month]  .select-list-wrap > ul {
		margin-top: -12px;
		margin-left: -12px;
	}

	/* 참여하기 팝업 2  > 스탠바이미 제품 소지 여부 */
	[id*=eventJoinStandbyme7month]  .select-list-wrap>ul{
		margin-left: -12px;
	}
	[id*=eventJoinStandbyme7month]  .select-list-wrap>ul>li{
		width: 100%;
	}

	
}