/**
************************************************************************************
* CSR  : http://clm.lge.com/issue/browse/BTOCSITE-99774
* CODE : Dev - EV00020811 , Prod - EV00008481
* FILE : /kr/event/2025/07/22_toss/eventMainToss.jsp
* DESC : 에어컨 프로모션 내 난수쿠폰 등록 기능 개발 요청(토스고객)
* PROJ : lge.co.kr 5.0
************************************************************************************
*							Modification History
************************************************************************************
* DATE						AUTHOR				DESCRIPTION
************************************************************************************
* 2025/07/11				신우용				Created
************************************************************************************
**/

/* 이벤트 기본 설정 */
.toss-container * {
	--width: 1000;
}

#tossCouponGroup, .tab_contents #tossCouponGroup{
	display: none; /* 기본 hidden 설정 */
	max-width: 1380px;
	margin: 0 auto;
}
.toss-container .evt-func {
	position: relative;
}
.toss-container .toss-evt-wrap{
	width: calc(1000 / 1380 * 100%);
    margin: 0 auto;
}
.toss-container .toss-evt-wrap > div + div{
	margin-top: calc(40 / var(--width) * 100%);
}

.toss-container .toss-input-wrap{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: calc(370 / var(--width) * 100%);
}

.toss-container .toss-input-wrap .input-wrap,
.toss-container .toss-input-wrap .input-wrap input{
	width: 100%;
	height: 100%;
}
.toss-container .toss-input-wrap .input-wrap input{
	font-family: 'Pretendard';
	font-size: 22px;
	text-align: center;
	border-color: #E2E0DE;
	border-radius: 10px;
	line-height: 1.2;
	background-color: #FFF;
}
.toss-container .toss-input-wrap .input-wrap input:focus{
	border-color: #000;
}
.toss-container #cpTossNumberChkBtn{
	position: absolute;
    bottom: 20.6%;
    left: 0;
    width: 100%;
    height: 37%;
}

.toss-container .evt-acco-head.evt-btn-area {
    top: 0;
    padding-top: calc(36 / var(--width)* 100%);
}

.toss-container .evt-acco-head.evt-btn-area button {
    width: 100%;
}
@media screen and (max-width: 1480px){
	.toss-container .toss-input-wrap .input-wrap input {
		font-size: 1.4865vw;
	}
}
@media screen and (max-width: 767px){
    .toss-container * {
		--width: 624;
	}
	.toss-container .toss-evt-wrap{
		width: calc(624 / 720 * 100vw);
	}
	.toss-container .toss-evt-wrap > div + div{
		margin-top: calc(60 / var(--width) * 100%);
	}
	.toss-container .toss-input-wrap {
		height: calc(220 / var(--width) * 100%);
	}
	.toss-container .toss-input-wrap .input-wrap input {
		width: 100% !important;
		height: 100% !important;
		margin: 0 !important;
		padding: 2.2vw !important;
		font-size: 4.4vw;
		border-radius: 8px;
		transform: none;
	}

	.toss-container #cpTossNumberChkBtn {
		bottom: 19.2%;
		height: 35%;
	}
}