/* golf reserve */
/* step1 */
#step1{position: relative;}

.month{text-align: center;font-weight: bold;font-size: 1.7rem;}
.week{display:flex;height: 50px;line-height: 50px;}
.week > li{flex:1;font-size: 14px;text-align: center;}
.week > li:first-child{color: red;}
.week > li:last-child{color: blue;}
.days{display:grid;grid-template-columns:repeat(7, 1fr);}
.days > li > div{text-align: center;height: 60px;margin: 0 auto;padding-top: 6px;}
.days > li > div > span{display: block;font-size: .9rem;color: #666;}
.days > li:nth-child(7n){color: #2D6FC4;}
.days > li:nth-child(7n+1){color: #ff6969;}
.today{cursor: pointer;border: 2px solid var(--main-color);background-color: #fff;}
.book{background-color: var(--calendar-bgc) !important;cursor: pointer;}
.selected{background-color: var(--main-color) !important;color: #fff;}
.selected > span{color: #fff !important;}
.book:hover{background-color: var(--main-color) !important;color: #fff;}
.book:hover > span{color: #fff;}
.end{cursor:default;background-color: #D2D2D2;}
.wait{background-color: #E1C794;cursor: pointer;}
.holy{color: #FF6969;}

#step1 .arrow{width: 50px;height: 50px;line-height: 50px;text-align: center;position: absolute;top: 20px;transform: translateY(-50%);font-size: 40px;cursor: pointer;color: #999;}
#step1 .btn_prev{left: 0px;}
#step1 .btn_next{right: 0px;}

.step1_info{margin-top: 50px;line-height: 14px;display: flex;justify-content:center;  align-items: center; margin-bottom: 20px;}
	.step1_info > span{display: inline-block;width: 14px;height: 14px;}
	.step1_info > span:nth-child(1){border: 1px solid var(--main-color);}
	.step1_info > span:nth-child(3){background-color: var(--calendar-bgc);}
	.step1_info > span:nth-child(5){background-color: #D2D2D2;}
	.step1_info > strong{display: inline-block;padding-right: 20px;padding-left: 4px;}


	@media (max-width:768px){
		.calendar-wrap > div{padding: 0;}
		.calendar-wrap > div:nth-child(2){margin-top: 20px;}
        .month{font-size: 20px;}
		.days > li > div{height: 50px;}
		.days > li > div > span{font-size: .8rem;}
		.days > li > div > span > i{display: none;}
        #step1 .arrow{width: 30px;height: 30px;line-height: 30px;font-size: 20px;top: 16px;}
	}

/* step2 */
	#step2{padding-top: 20px;display: none;}
    .tab-golf{width: 100%;margin-bottom: 10px;background-color: #F3F3F5;display: flex;}
	.tab-golf > li{text-align: center;position: relative;flex: 1;}
	.tab-golf > li > a{display: block; color: #888;padding: 18px 0;line-height: 1rem;}
	.tab-golf > li > a.active{color: var(--sub-color);font-weight: 700;border: 1px solid var(--sub-color);border-radius:7px;background-color: #fff;}

	.tab-content{max-height:800px;overflow-y:auto;margin-top: 0;}
    .time-list .btn-main{width: 80px;}
    .time-list tr:hover{background-color: #F9F9F9;}
    .time-list td{padding: 12px 0px;}
    .time-list tr.fee-normal td:nth-child(4){text-align: center;}
    .time-list tr.fee-discount td:nth-child(4){text-decoration: line-through;}
    .time-list span.discount-price{color:#be2626;}
    .time-list .col-1{width: 14%;}
    .time-list .col-2{width: 14%;}
    .time-list .col-3{width: 14%;}
    .time-list .col-4{width: 15%;}
    .time-list .col-5{width: 14%;}
    .time-list .col-6{width: 15%;}
    .time-list .col-7{width: 14%;}

    span.event-name{font-size: 14px;padding: 2px 4px;border-radius: 5px;border: 1px solid #be2626;color: #be2626;}

    .step2_date{text-align: center;color: var(--main-color);padding: 10px;font-size: 16px;font-weight: bold; background-color: #eee;}
	.step2_date > strong{color: #d94040;font-weight: bold;}

    .no_ttime{text-align: center;padding: 20px 0;line-height: 28px;color: #535b5d;}
    .mobile-show{display: none;}


	.qr-box{display: flex; justify-content:center;text-align: left; padding-top: 50px;}
	.qr-box > li + li{margin-left: 30px;}
	ol.numlist > li{padding-bottom: 10px;}

	@media (max-width:768px){
        .time-list,
        span.event-name{font-size: 13px;}
        span.event-name{width: 52px;display: inline-block;padding: 2px 1px;}
		.tab_conts{height: auto;}
        .time-list .btn-main{width: auto;}
        .tab-golf > li > a{padding: 10px 0;}
        .time-list td{padding: 6px 0;}
        .time-list .col-1{width: 11%;}
        .time-list .col-2{width: 11%;}
        .time-list .col-3{width: 13%;}
        .time-list .col-4{width: 17%;}
        .time-list .col-5{width: 17%;}
        .time-list .col-6{width: 17%;}
        .time-list .col-7{width: 14%;}
        .mobile-none{display: none !important;}
        .mobile-show{display: inline-block !important;}


	}

/* step3 */
#step3{display: none;}
#step3 h3{margin-top: 50px;}
#step3 span.line::before {content: "|";display: inline-block;	padding:0 14px;color: #ddd;}
.reserve-info{border-top: 1px solid #000;}
.reserve-info > ul{display: flex;flex-wrap: wrap;align-items: center;justify-content: center;}
.reserve-info > ul.one-line{align-items: flex-start;}
.reserve-info > ul > li{border-bottom: 1px solid #eee;padding: 12px 10px;height: 74px;display: flex;align-items: center;}
.reserve-info > ul > li:nth-child(2n){width: 33%;font-size: 22px;color: var(--main-color);}
.reserve-info > ul > li:nth-child(2n+1){width: 17%;}
.reserve-info > ul.one-line > li:nth-child(2n){width: 83%;}
.reserve-info > ul.one-line > li:nth-child(2n+1){width: 17%;}
.reserve-info s{font-size: 16px;color: #666;margin-right: 10px;}
.reserve-info .time-course-hole > span:not(:last-child)::after{content: '|';margin: 0 10px;color: #ccc;font-size: 18px;}
#step3 span.normalfee{color: #999;text-decoration: line-through;font-size: 1rem;padding-right: 10px;}

.golf-info-box{background-color: #f7f7f7;padding: 50px;margin-top: 30px;}

@media (max-width:992px){
    .reserve-info > ul > li:nth-child(2n),
    .reserve-info > ul.one-line > li:nth-child(2n){width: 65%;font-size: 16px;}
    .reserve-info > ul > li:nth-child(2n+1),
    .reserve-info > ul.one-line > li:nth-child(2n+1){width: 35%;}
    .reserve-info > ul > li{padding: 6px 0;height: 60px;}
    .reserve-info s{font-size: 14px;}
    .reserve-info .time-course-hole > span:not(:last-child)::after{font-size: 16px;}

    .golf-info-box{padding: 10px;}
}

@media (max-width:768px){
    .reserve-info > ul > li{padding: 6px 0;height: 50px;}
}


/* conform */
.grid-list.golf > ul{grid-template-columns: 20% 15% 15% 15% 15% 20%;}
.grid-list.cancel-list > ul{grid-template-columns: repeat(6, 1fr);}
.grid-list.penalty-list > ul{grid-template-columns: repeat(4, 1fr);}

@media (max-width:768px){
    .reserve-conform .grid-list ul{grid-template-columns: 1fr;grid-auto-flow: row;margin-bottom: 20px;border-top: 1px solid #5c5c5c;}
    .reserve-conform .grid-list li{padding: 10px 0;}
    .reserve-conform .grid-list li::before{display: inline-block;width:100px;margin-right: 6px;color: var(--main-color);}
    .reserve-conform .grid-list ul.thead{display: none;border-top: none;}

    .grid-list.golf{border-top: none;}
    .grid-list.golf > ul > li:nth-child(6){border-bottom: none;justify-content: end;}
    .grid-list.golf > ul > li:nth-child(1)::before{content: '예약일자';}
    .grid-list.golf > ul > li:nth-child(2)::before{content: '예약시간';}
    .grid-list.golf > ul > li:nth-child(3)::before{content: '코스';}
    .grid-list.golf > ul > li:nth-child(4)::before{content: '홀';}
    .grid-list.golf > ul > li:nth-child(5)::before{content: '혜택적용';}
    .grid-list.golf > ul > li:nth-child(6)::before{content: '';width: 0;margin-right: 0;}

    .grid-list.cancel-list{border-top: none;}
    .grid-list.cancel-list > ul > li:nth-child(1)::before{content: '예약일자';}
    .grid-list.cancel-list > ul > li:nth-child(2)::before{content: '예약시간';}
    .grid-list.cancel-list > ul > li:nth-child(3)::before{content: '코스';}
    .grid-list.cancel-list > ul > li:nth-child(4)::before{content: '취소일자';}
    .grid-list.cancel-list > ul > li:nth-child(5)::before{content: '비고';}
    .grid-list.cancel-list > ul > li:nth-child(6)::before{content: '구분';}

    .grid-list.penalty-list{border-top: none;}
    .grid-list.penalty-list > ul > li:nth-child(1)::before{content: '예약일자';}
    .grid-list.penalty-list > ul > li:nth-child(2)::before{content: '위약일자';}
    .grid-list.penalty-list > ul > li:nth-child(3)::before{content: '위약내용';}
    .grid-list.penalty-list > ul > li:nth-child(4)::before{content: '예약정지기간';}
}

/* 동반자등록 */
.grid-list.player > ul{grid-template-columns:repeat(5, 1fr);}
.grid-list.player > ul.no-data{grid-template-columns:1fr 2fr 1fr 1fr;}
.grid-list.player > ul a{width: 100px;}
.grid-list.player > ul > li{display: flex;align-items: center;justify-content: center;}

@media (max-width:768px){
    .grid-list.player > ul,
    .grid-list.player > ul.no-data{grid-template-columns: 30% 70%;grid-template-rows: repeat(3, 1fr); width: 100%;border-bottom: 1px solid #e7e7e7;}
    .grid-list.player > ul > li{border-bottom: none; justify-content: start;}
    .grid-list.player > ul > li:nth-child(1){grid-column: 1 / 3;grid-row: 1 / 2;font-size: 16px;color: var(--main-color);}
    .grid-list.player > ul > li:nth-child(2){grid-column: 1 / 2;grid-row: 2 / 3;} 
    .grid-list.player > ul > li:nth-child(3){grid-column: 2 / 3;grid-row: 2 / 3;} 
    .grid-list.player > ul > li:nth-child(4){grid-column: 1 / 2;grid-row: 3 / 4;} 
    .grid-list.player > ul > li:nth-child(5){grid-column: 2 / 3;grid-row: 3 / 4;justify-content: end;} 

    .grid-list.player > ul.no-data > li:nth-child(1){grid-column: 1 / 3;grid-row: 1 / 2;} 
    .grid-list.player > ul.no-data > li:nth-child(2){grid-column: 1 / 3;grid-row: 2 / 3;} 
    .grid-list.player > ul.no-data > li:nth-child(3){grid-column: 1 / 2;grid-row: 3 / 4;} 
    .grid-list.player > ul.no-data > li:nth-child(4){grid-column: 2 / 3;grid-row: 3 / 4;justify-content: end;} 
}

/* 비로그인 실시간예약(golf) 안내 */
.reserve-guest-banner{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:space-between;
	gap:12px 16px;
	margin-bottom:20px;
	padding:14px 16px;
	background:#F3F3F5;
	border-radius:6px;
	border:1px solid #e8e8eb;
}
.reserve-guest-banner > p{
	margin:0;
	flex:1;
	min-width:200px;
	font-size:0.95rem;
	line-height:1.55;
	color:#333;
}
.reserve-guest-banner .btn{flex-shrink:0;align-self:center;}

#step3 .reserve-guest-actions,
.reserve-guest-actions{
	display:flex;
	flex-direction:column;
	align-items:stretch;
	justify-content:center;
	width:100%;
	max-width:420px;
	margin-left:auto;
	margin-right:auto;
	gap:14px;
	padding-top:8px;
}
.reserve-guest-actions > p{
	margin:0;
	font-size:0.95rem;
	line-height:1.55;
	color:#555;
	text-align:center;
}
.reserve-guest-actions .btn{
	width:100%;
	max-width:none;
	min-width:0;
	align-self:stretch;
}

@media (max-width:768px){
	.reserve-guest-banner{
		flex-direction:column;
		align-items:stretch;
		padding:12px 14px;
	}
	.reserve-guest-banner .btn{width:100%;max-width:none;}
	#step3 .reserve-guest-actions{max-width:none;padding-left:0;padding-right:0;}
}