@charset "utf-8";


/** 22.9.28  ********************************************************
무료체험 예약일시 
******************************************************** */
:root {
    --comment-color: dimgray;
    --border-color: gray;
}



.booking-container {
    background: white;    
}

 
.booking-outline {
    /*margin:5px; */
	height: 100vh;
    padding-top:5px; 
    background: white;    
    border:1px solid #c3c3c3;  
    -moz-border-radius:5px; 
    -webkit-border-radius:5px; 
    border-radius:5px;
  }

.wrapper {
	margin:5px;
    display: block; 
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: center;    
}

.book-close {
	display: block;
	text-align: right;
	font-size: 14px;
	margin-top: 5px;
	margin-right: 5px;
	text-decoration: underline;
	cursor: pointer;
}

.booking-step1, .booking-step2 {
  /*  display: block;  tab test*/
    width: 100%;  
    height : 460px; /*480px;*/
    background-color: white;    
}

.step-title {
    font-size: 18px;
    font-weight: bold;
    color: #6f2b92;
	height: 25px;
	padding-top: 5px;
   /* margin-top: 10px;
	margin-bottom: 10px;*/
}

.step-comment {
    font-size: 13px;
	text-align: left;
    color: var(--comment-color);
    margin-top: 3px;
	margin-bottom: 3px;
}


.step-line {
    width: 100%; 
    border-bottom: 1px solid var(--comment-color);    
}

/*.step_body { text-align: center; }*/

.step1-body, .step2-body { 
	height: 360px; 
	text-align: center; 	
}

.step-body-comment {
    font-size: 13px;
    color: var(--comment-color);
    margin-top: 2px;
    text-align: left;
}

.step-body-comment > li {
    list-style-type: none;
}

.step-legend {
    font-size: 12px; 
    margin-top:.3rem;
	margin-right: 0;
}

.step-bottom {
    height:30px; 
    /*padding-top: 20px; padding-bottom: 20px; */
    font-size: 20px; 
    font-weight: bold; 
    color : #6f2b92; 
    text-align: center;
}


.select_ok {color: #6b1685;}
/*.today {color: #A9A9A9;}*/
.select_no {color: #E5E5E5;}
.current_day {color: #FFFF8D;}



/* 달력 */
a { color:#000000;text-decoration:none; }

.Calendar { 
	text-align:center; 
	font-size: 14px; 
	margin: auto;
}
/*.Calendar > thead > tr > td { width:50px;height:50px; }*/
.Calendar > thead > tr > td { width:54px;height:30px; }
.Calendar > thead > tr:first-child > td { font-weight:bold; }
/*.Calendar > thead > tr:last-child > td { background-color:#90EE90; }*/
.Calendar > thead > tr:last-child > td { background-color:white; }
.Calendar > tbody > tr > td { width:54px;height:52px; line-height: 52px; }


.club_am_time { text-align:center; font-size: 12px;}
.club_am_time > thead > tr > td { width:70px;height:30px; }
.club_am_time > thead > tr:first-child > td { font-weight:bold; }
.club_am_time > thead > tr:last-child > td { background-color:white; }
.club_am_time > tbody > tr > td { width:70px;height:50px; line-height: 50px;}

.club_pm_time { text-align:center; font-size: 12px;}
.club_pm_time > thead > tr > td { width:70px;height:30px; }
.club_pm_time > thead > tr:first-child > td { font-weight:bold; }
.club_pm_time > thead > tr:last-child > td { background-color:white; }
.club_pm_time > tbody > tr > td { width:70px;height:50px; line-height: 50px;}


.club_time { text-align:center; font-size: 14px; margin: auto;}
.club_time > thead > tr > td { width:95px;height:30px; }
.club_time > thead > tr:first-child > td { font-weight:bold; }
.club_time > thead > tr:last-child > td { background-color:white; }
.club_time > tbody > tr > td { width:95px;height:52px; border:1px solid gray;line-height: 52px;}


/********************
무료체험신청 예약 확인 팝업
**********************/
.free-loc-ok{
	position:fixed;
	_position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:9999;
	display:none;
}

.free-info-header {
	margin-top: 20px;
	margin-bottom: 20px;
	font-size:28px;
	font-weight:600;
	line-height:47px;
	color:#444;
	text-align: center;
}
.free-info-header span{
	display:block;
	font-size:24px;
	color:#6f2b91;
}

.free-book-info {
	margin-left : 25px;
	margin-right: 25px;
	font-size: 15px;
	line-height:22px;
	border-top: 1px solid gray; 
	border-bottom: 1px solid gray; 
	padding-top: 15px;
	padding-bottom: 15px;
}

.free-book-info-caption {
	margin-left : 3rem;
	width: 100%;
}

.free-book-info label {
	display:inline-block;
	width: 80px;
	font-weight:600;
	color : #6f2b91;	
}

.free-book-guide {
	margin-top: 18px;
	margin-left : 3rem;
	margin-bottom: 20px;
}


.freepop-ok-btn{
	display:inline-block; 
	background: #6f2b91;
	border-radius: 2px;	
	width: 160px;
	height: 40px;	
	/*margin:20px auto;*/
	text-align: center;
	line-height: 40px;
	color: white;
	font-size: 15px;
	cursor: pointer;
}

/* 무료체험 확인버튼 아이콘 */
.circle-checkbox-icon{
	display: inline-block; /* 영역적용가능해짐 */
	width: 18px; height: 18px;
	border: 2px solid  white;
	box-sizing: border-box;
	border-radius: 10px; /* 모서리둥글게 처리 */
	color: white;
	right: 5px;
	position: relative; top: 4px;
  }

  .circle-checkbox-icon:after{
	content: '\2714'; /* 체크박스 특수문자 */
	font-size: 18px; color: white;
	position: absolute; top: -15px; left: 0;	
  }

/* 무료체험 취소버튼 아이콘 */
.circle-close-icon{
	display: inline-block; /* 영역적용가능해짐 */
	width: 18px; height: 18px;
	border: 2px solid  white;
	box-sizing: border-box;
	border-radius: 10px; /* 모서리둥글게 처리 */
	right: 5px;
	position: relative; top: 4px;
}

.circle-close-icon:after{
	content: '\00d7'; /* X 특수문자 */
	font-size: 18px; color: white;
	position: absolute; top: -13px; left: 2px;	
}

/*
tab display
*/
.tabs {
	display: flex;
	flex-wrap: wrap;
  }
   
  .tabs label {
	order: 1;
	display: block;
	padding: 0.5rem 0.5rem;
	margin-right: 0.2rem;
	cursor: pointer;
	/*background:  #3CC0F8;*/
	background : gray;
	font-weight: bold;
	transition: background ease 0.2s;
  }
   
  .tabs .tab {
	order: 99;
	flex-grow: 1;
	width: 100%;
	display: none;
	padding: 0.5rem;
	background: #fff;
  }
   
  .tabs input[type="radio"] {
	display: none;
  }
   
  .tabs input[type="radio"]:checked + label {
	color: white;
	background: #6f2b91;
  }
   
  .tabs input[type="radio"]:checked + label + .tab {
	display: block;
  }
   

.btn_agree{background:#914bb4;}
/*.btn_disagree{background:#686868;}*/
  /*
  @media (max-width: 45em) {
	.tabs .tab,
	.tabs label {
	  order: initial;
	}
   
	.tabs label {
	  width: 100%;
	  margin-right: 0;
	  margin-top: 0.2rem;
	}
  }
  */