/* 시술사이드페이지 202306 */


/* ================================================================================================================================================================= */
/* 기본 */

/* 체크박스 */
.PriceSideWrap .CheckBox{position:relative;}
.PriceSideWrap .CheckBox input{display:none;}
.PriceSideWrap .CheckBox em{display:table-cell; position:relative; width:auto; text-align:left; vertical-align:middle; font-style:normal; font-weight:normal;}
.PriceSideWrap .CheckBox em b{display:block; position:relative; width:20px; height:20px; border:1px solid #777; border-radius:3px; background-color:#ffffff;}
.PriceSideWrap .CheckBox em b:after{content: ''; display:block; position:absolute; left:6px; top:1px; width:4px; height:11px; border-bottom:3px solid #333; border-right:3px solid #333; transform:rotate( 45deg ); -webkit-transform:rotate( 45deg );-moz-transform:rotate( 45deg ); display:none;}
.PriceSideWrap .CheckBox input:checked ~ em{}
.PriceSideWrap .CheckBox input:checked ~ em b:after{display:block;}
.PriceSideWrap .CheckBox input:checked ~ pre{}

.PriceSideWrap .Radiobox{display:inline-table; position:relative; line-height:1em; table-layout:fixed; vertical-align:middle; cursor:pointer;} 
.PriceSideWrap .Radiobox input{display:none;} /* 일단숨김 */
.PriceSideWrap .Radiobox mark{background:none; margin:0px; padding:0px;}
.PriceSideWrap .Radiobox small{display:table-cell; width:20px; vertical-align:middle;}
.PriceSideWrap .Radiobox small em{display:block; position:relative; width:20px; font-style:normal; font-weight:normal; overflow:hidden;}
.PriceSideWrap .Radiobox small em b{display:block; position:relative; top:0; width:20px; height:20px; border:1px solid #adadad; border-radius:50%; background-color:#ffffff; overflow:hidden;}
.PriceSideWrap .Radiobox small em b:after{content: ''; display:block; position:absolute; top:50%; margin-top:-6px; left:50%; margin-left:-6px; font-size:1em; width:12px; height:12px; background-color:#333; border-radius:50%; display:none;} /* 일단숨김 */
.PriceSideWrap .Radiobox big{display:table-cell; line-height:1.5em; vertical-align:middle; padding-left:5px;}
.PriceSideWrap .Radiobox big p{color:#666; font-size:13pt;}
.PriceSideWrap .Radiobox input:checked ~ * big p{color:#666;}
.PriceSideWrap .Radiobox input:checked ~ * small em{}
.PriceSideWrap .Radiobox input:checked ~ * small em b{border-color:#482b8d;}
.PriceSideWrap .Radiobox input:checked ~ * small em b:after{display:block; color:#482b8d; transition:all 0.2s ease;}
.PriceSideWrap .Radiobox input:checked ~ * big{}
.PriceSideWrap .Radiobox input:disabled ~ * {cursor:no-drop;}
.PriceSideWrap .Radiobox input:disabled ~ * big{color:#a1a1a1;}
.PriceSideWrap .Radiobox input:disabled:checked~ * small em b{border-color:#dddddd;} 
.PriceSideWrap .Radiobox input:disabled:checked~ * small em b:after{color:#dddddd;}
.PriceSideWrap .Radiobox input:checked ~ * small em b{border:1px solid #333;}
.PriceSideWrap .Radiobox input:checked ~ * small em span.Checked{display:block; color:#382f5d;}


/* ================================================================================================================================================================= */
/* 공통 */
.PriceSideWrap{}
.PriceSideWrap > .subTitle{display:none;}
.PriceSideWrap .QuickArea{display:none;}
.PriceSideWrap .Contact_Quick{display:none;}
.PriceSideWrap header.Fixed{position:relative;}
.PriceSideWrap section{position:relative;}
.PriceSideWrap section .Inner{}
.PriceSideWrap .PageTitle{display:block; padding:1em 1.5em; border-radius:12px; margin-bottom:3em; background-color:#f4f4f4;}
.PriceSideWrap .PageTitle *{display:inline-block; line-height:1; color:#333; text-align:left;}
.PriceSideWrap .PageTitle span{font-size:16pt; font-weight:600;}
.PriceSideWrap .MainTitle{display:block; margin-bottom:2em;}
.PriceSideWrap .MainTitle *{display:block; line-height:1; color:#333; text-align:center;}
.PriceSideWrap .MainTitle span{font-size:18pt; font-weight:600;}
.PriceSideWrap .MainTitle em{font-size:13pt; margin-top:1em;}

.clinicSideListWrap{}
.clinicSideListWrap #contents{font-family:'SUIT';}
.clinicSideListWrap button{font-family:'SUIT';}

.cartWrap{}
.cartWrap #contents{font-family:'SUIT'; padding:80px 0;}
.cartWrap button{font-family:'SUIT';}

.reservationWrap{}
.reservationWrap #contents{font-family:'SUIT'; padding:80px 0;}
.reservationWrap button{font-family:'SUIT';}

.certifyWrap{}
.certifyWrap #contents{font-family:'SUIT'; padding:80px 0;}
.certifyWrap button{font-family:'SUIT';}

.reservationChkWrap{}
.reservationChkWrap #contents{font-family:'SUIT'; padding:80px 0;}
.reservationChkWrap button{font-family:'SUIT';}

.reservationChangeWrap{}
.reservationChangeWrap #contents{font-family:'SUIT'; padding:80px 0;}
.reservationChangeWrap button{font-family:'SUIT';}

.preViewGuideWrap{}
.preViewGuideWrap #contents{font-family:'SUIT'; padding:80px 0;}
.preViewGuideWrap button{font-family:'SUIT';}
.preViewGuideWrap .ClinicAll.Inner{width:845px; min-width:845px;}


/* ================================================================================================================================================================= */
/* 시술리스트페이지 */

/* 검색영역 */
.ClinicSearch{position:relative; display:block;}
.ClinicSearch .Inner{display:table; overflow:hidden; padding-bottom:60px;}
	/* ---------------------------------------------- */
	/* 검색어입력 */
	.ClinicSearch .SearchField{position:relative; display:block; width:100%; text-align:right;}
	.ClinicSearch .SearchField .SearchBox{position:relative; display:inline-block; width:35%;}
	.ClinicSearch .SearchField .InputBox{position:relative; display:inline-block; width:85%;}
	.ClinicSearch .SearchField .InputBox input{font-family:'SUIT'; width:100%; height:50px; border:0; border-bottom:2px solid #333; font-size:15pt; color:#000; padding:0 0 0 10px;}
	.ClinicSearch .SearchField .InputBox input::placeholder{color:#bbbbbb;}
	.ClinicSearch .SearchField button.SearchBtn{position:relative; display:inline-block; width:10%; background:none; vertical-align:middle;}
	.ClinicSearch .SearchField button i{color:#333; font-size:19pt;}
	.ClinicSearch .SearchField button:hover i{color:#888;}

	/* ---------------------------------------------- */
	/* 검색결과 */
	.ClinicSearch .SearchResult{position:relative; display:block; width:100%; text-align:left; font-size:15pt;}
	.ClinicSearch .SearchResult b{}


/* -------------------------------------------------------------------------------------------------------------------- */
/* 카테고리메뉴 */
.ClinicCateList{position:relative; display:block;}
.ClinicCateList .Inner{padding-bottom:40px;}
	/* ---------------------------------------------- */
	/* 리스트 */
	.ClinicCateList ul.List{position:relative; display:table; width:100%;}
	.ClinicCateList ul li.TextBox{position:relative; display:inline-table; width:calc(100% / 6); border:1px solid #cdcdcd; margin-top:-1px;}
	.ClinicCateList ul li.TextBox{border-left:none;}
	.ClinicCateList ul li.TextBox:first-child{border-left:1px solid #d9d9d9;}
	.ClinicCateList ul li.TextBox:nth-child(6n+1){border-left:1px solid #d9d9d9;}
	.ClinicCateList ul li a{position:relative; display:table-cell; vertical-align:middle; font-size:12pt; font-weight:500;}
	.ClinicCateList ul li a.Active{font-weight:600;}
	.ClinicCateList ul li a:hover{transition-duration:.3s;}
	.ClinicCateList ul li a div{position:relative; display:block; width:100%; height:3px; opacity:0;} /* 기본숨김 */
	.ClinicCateList ul li a.Active div,
	.ClinicCateList ul li a:hover div{transition-duration:.3s; opacity:1;}
	.ClinicCateList ul li span{position:relative; display:block; width:100%; text-align:center; padding:10px 0 12px 0;}
	
	/* 특정class */
	.ClinicCateList ul li a:not(.Active) .ColorBg{background-color:#bdbdbd;}
	.ClinicCateList ul li a:not(.Active) .ColorTxt{color:#222;}


/* -------------------------------------------------------------------------------------------------------------------- */
/* 시술리스트및 상세(전체) */
.ClinicAllArea{position:relative; display:block;}
.ClinicAllArea .BtnBg{background-color:#333;}
.ClinicAllArea .BtnBd{border:1px solid #333;}
.ClinicAllArea .ClinicAll.Inner{position:relative; display:flex; padding-bottom:100px;}
.ClinicAllArea .ClinicAll > .Left{position:relative; display:block; width:30%; vertical-align:top; margin-right:5%;}
.ClinicAllArea .ClinicAll > .Right{position:relative; display:block; width:65%; vertical-align:top;}
	/* ---------------------------------------------- */
	/* 시술리스트(좌측) */
	.ClinicAllArea .ClinicList{position:relative; display:block; width:100%;}
	.ClinicAllArea .ClinicList ul{position:relative; display:block; width:100%;}
	.ClinicAllArea a{border:1px solid #d9d9d9;}
		/* ----------------------- */
		/* 시술 */
		.ClinicAllArea .ClinicList ul li{position:relative; display:block; width:100%;}
		.ClinicAllArea .ClinicList ul li + li{margin-top:25px;}
		.ClinicAllArea .ClinicList ul li a{position:relative; display:block; width:100%; padding:20px; border-radius:7px;}
		.ClinicAllArea .ClinicList ul li a .Name{position:relative; display:block; width:100%;}
		.ClinicAllArea .ClinicList ul li a .Name p{position:relative; display:table; width:100%; font-size:15pt;}
		.ClinicAllArea .ClinicList ul li a .Name p b{position:relative; display:inline-table; width:92%; font-weight:600; vertical-align:middle;}
		.ClinicAllArea .ClinicList ul li a .Name p span{position:relative; display:inline-table; width:25px; height:25px; text-align:center; border-radius:100px; vertical-align:middle;}
		.ClinicAllArea .ClinicList ul li a .Name p span i{position:relative; display:table-cell; font-size:9pt; color:#fff; vertical-align:middle;}
		.ClinicAllArea .ClinicList ul li .Info{position:relative; display:-webkit-box; width:100%; line-height:1.4; border-top:1px solid #dddddd; padding-top:15px; margin-top:15px;overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; -webkit-line-clamp:2; -webkit-box-orient: vertical;}

		/* ----------------------- */
		/* 특정class */
		.ClinicAllArea li:not(.Active) .ColorBd{border-color:#cdcdcd;}
		.ClinicAllArea li:not(.Active) .ColorBd:hover{border-color:#757575; transition-duration:.3s;}

	/* ---------------------------------------------- */
	/* 시술리스트(우측) */
	.ClinicAllArea .ClinicView{position:relative; display:block; width:100%;}
	.ClinicAllArea .ClinicView > section + section{margin-top:80px;}
		/* ----------------------- */
		/* 썸네일 */
		.ClinicThumb{position:relative; display:block; width:60%; margin:0 auto;}
		.ClinicThumb .ThumbSwiper{position:relative; width:100%; height:auto; margin:0 0 10px 0; overflow:hidden;}
		.ClinicThumb .ThumbSwiper .swiper-button{display:none;}
		.ClinicThumb .ThumbSwiper .swiper-pagination{}
		.ClinicThumb .ThumbSwiper .swiper-pagination{position:absolute !important; left:20% !important; top:80%; width:auto !important; display:block;}
		.ClinicThumb .ThumbSwiper .ThumbBox{ width:auto;}
		.ClinicThumb .ThumbSwiper .ThumbBox img{width:100%;}

		.ClinicThumb .ThumbSmallSwiper{position:relative; width:100%; padding:0; overflow:hidden;}
		.ClinicThumb .ThumbSmallSwiper .swiper-button{display:none;}
		.ClinicThumb .ThumbSmallSwiper .swiper-pagination{}
		.ClinicThumb .ThumbSmallSwiper .swiper-pagination{position:absolute !important; left:20% !important; top:80%; width:auto !important; display:block;}
		.ClinicThumb .ThumbSmallSwiper .ThumbBox{width:80px; height:80px; text-align:center; overflow:hidden; opacity:.3;}
		.ClinicThumb .ThumbSmallSwiper .ThumbBox.swiper-slide-active{opacity:1;}
		.ClinicThumb .ThumbSmallSwiper .ThumbBox img{width:100%;}

		/* ----------------------- */
		/* 시술상품선택 */
		.ClinicSelect{position:relative; display:block;}
			/* 타이틀 */
			.ClinicSelect .Title{position:relative; display:table; width:100%;}
			.ClinicSelect .Title span{position:relative; display:inline-table; font-size:17pt; font-weight:500; line-height:1; vertical-align:middle; color:#333; border-left:3px solid #cdcdcd; padding-left:13px;}
			/* 리스트 */
			.ClinicSelect .ClinicLabel ul.List{position:relative; display:flex; width:100%; flex-wrap:wrap; margin-top:20px; background-color:#f5f5f5; padding:15px;}
			.ClinicSelect .ClinicLabel ul li{position:relative; display:block; width:50%;}
			.ClinicSelect .ClinicLabel ul li > label{position:relative; display:inline-block; width:98.5%; padding:12px; background-color:#fff; box-shadow:0px 3px 7px 0 rgba(0, 0, 0, 0.08);}
			.ClinicSelect .ClinicLabel ul li > label:hover{box-shadow:0px 3px 7px 0 rgba(0, 0, 0, 0.2); transition-duration:200ms;}
			.ClinicSelect .ClinicLabel ul li + li{margin-top:11px;}
			.ClinicSelect .ClinicLabel ul li:nth-child(2){margin-top:0;}
			.ClinicSelect .ClinicLabel ul li:nth-child(odd){text-align:left;}
			.ClinicSelect .ClinicLabel ul li:nth-child(even){text-align:right;}
			.ClinicSelect .ClinicLabel ul li:nth-child(even) > label{text-align:left;}
			.ClinicSelect .ClinicLabel ul li dl{position:relative; display:table; width:100%;}
			.ClinicSelect .ClinicLabel ul li dl dt{position:relative; display:inline-table; width:93%; vertical-align:middle; padding-right:1em;}
			.ClinicSelect .ClinicLabel ul li dl dt *{line-height:1;}
			.ClinicSelect .ClinicLabel ul li dl dd{position:relative; display:inline-table; width:7%; vertical-align:middle; text-align:right;}
			.ClinicSelect .ClinicLabel ul li dl dd *{line-height:1;}
				/* 시술정보 */
				.ClinicSelect .ClinicLabel ul li .Name{color:#333; font-size:13pt; font-weight:500; margin-bottom:0.4em; line-height:1;}
				.ClinicSelect .ClinicLabel ul li .Info{color:#333; font-size:11pt; font-weight:400; margin-bottom:0.6em; line-height:1;}
				.ClinicSelect .ClinicLabel ul li .Price{display:table; width:100%;}
				.ClinicSelect .ClinicLabel ul li .Price span{display:inline-table; font-size:10pt; font-weight:bold;vertical-align:bottom;}
				.ClinicSelect .ClinicLabel ul li .Price span b{font-size:14pt; margin-top:1em; letter-spacing:-1px;}
				.ClinicSelect .ClinicLabel ul li .Price em{display:inline-table; text-decoration:line-through; color:#a5a5a5; font-weight:bold; font-size:10pt; vertical-align:bottom; margin-left:14px;}
				.ClinicSelect .ClinicLabel ul li .Price small{display:inline-table; color:#333; font-weight:bold; font-size:9pt; padding:4px 7px; border:1px solid #333; border-radius:100px; vertical-align:bottom; margin-left:18px;}
		
			/* 버튼류 */
			.ClinicSelect .BtnArea{position:relative; display:block; width:100%; margin-top:20px; background:none; text-align:center; }
			.ClinicSelect button{position:relative; display:inline-block; width:300px; margin:0 3px; font-size:13pt; font-weight:500; padding:13px 0; border-radius:5px; font-family:'SUIT'; border-color:#333;}
			.ClinicSelect button:hover{opacity:.7; transition-duration:.3s;}

		/* ----------------------- */
		/* 랜딩이미지 */
		.ClinicLandImg{position:relative; display:block;}
			/* 이미지 */
			.ClinicLandImg .ThumbBox{position:relative; display:block; text-align:center;}
			.ClinicLandImg .ThumbBox img{position:relative; max-width:100%; margin:0 auto;}

		/* ----------------------- */
		/* 시술타이틀 */
		.ClinicTitle{position:relative; display:block; width:100%; text-align:center;}
			/* 정보 */
			.ClinicTitle .Date{font-size:12pt; font-weight:500; line-height:1; display:block; border-bottom:1px dashed #d7d7d7; margin-bottom:35px; padding-bottom:15px; text-align:right; color:#a1a1a1}
			.ClinicTitle .Name{font-size:22pt; font-weight:600; line-height:1;}
			.ClinicTitle .Info{position:relative; display:block; width:100%; line-height:1.4; margin-top:25px; font-size:14pt;}

		/* ----------------------- */
		/* 랜딩영상영역 */
		.ClinicVideo{position:relative; display:block;}
			/* 영상 */
			.ClinicVideo .VideoArea{content:""; clear:both; display:block; width:100%; position:relative; text-align:center; margin:0 auto;}
			.ClinicVideo .VideoIframe{position:relative; width:100%; margin:0; padding:0; padding-bottom:56.25%;}
			.ClinicVideo .VideoIframe iframe{position:absolute; left:0; width:100%; height:100%;  margin:0; padding:0;}

		/* ----------------------- */
		/* 랜딩상세내용 */
		.ClinicLandDetail{position:relative; display:block;}
		.ClinicLandDetail *{color:#333;}
		.ClinicLandDetail > div + div{padding-top:40px; margin-top:40px; border-top:1px solid #d9d9d9;} /* 상세내용추가시 */
		.ClinicLandDetail .Title{position:relative; display:block; text-align:left; line-height:1; font-size:17pt; font-weight:700; margin-bottom:30px;}
			/* 리스트형 */
			.ClinicLandDetail .LandList{position:relative; display:block;}
			.ClinicLandDetail .LandList .Title{}
			.ClinicLandDetail .LandList ul.List{position:relative; display:block; width:100%; padding-left:8%;}
			.ClinicLandDetail .LandList ul li.TextBox{position:relative; display:block; width:100%;}
			.ClinicLandDetail .LandList ul li.TextBox p{position:relative; display:block; width:100%; font-size:13pt; line-height:1.3; font-weight:normal;}
			.ClinicLandDetail .LandList ul li + li{margin-top:15px;} /* 리스트추가시 */

			/* 문답형 */
			.ClinicLandDetail .LandQna{position:relative; display:block;}
			.ClinicLandDetail .LandQna .Title{}
			.ClinicLandDetail .LandQna .QnaArea{position:relative; display:block; padding-left:8%;}
			.ClinicLandDetail .LandQna .QnaArea .QnaBox{position:relative; display:block;}
			.ClinicLandDetail .LandQna .QnaArea .QnaBox + .QnaBox{margin-top:40px;} /* 문답추가시 */
			.ClinicLandDetail .LandQna .QnaArea .Qusetion{position:relative; display:block; width:100%; text-align:right; overflow:hidden;}
			.ClinicLandDetail .LandQna .QnaArea .Qusetion pre{position:relative; display:block; max-width:80%; white-space:normal; float:right;}
			.ClinicLandDetail .LandQna .QnaArea .Qusetion pre p{font-size:13pt; padding:1.5em 2em; background-color:#555; color:#fff; border-radius:20px; line-height:1.3;}
			.ClinicLandDetail .LandQna .QnaArea .Answer{position:relative; display:inline-block; width:100%; text-align:left; overflow:hidden; margin-top:40px;}
			.ClinicLandDetail .LandQna .QnaArea .Answer pre{position:relative; display:table; max-width:80%; white-space:normal; float:left;}
			.ClinicLandDetail .LandQna .QnaArea .Answer pre p{font-size:13pt; padding:1.5em 2em; background-color:#fff; border:1px solid #cbcbcb; border-radius:20px; line-height:1.3;}
			.ClinicLandDetail .LandQna .QnaArea .Answer .Left{position:relative; display:table-cell; width:110px; vertical-align:bottom;}
			.ClinicLandDetail .LandQna .QnaArea .Answer .Left span{position:relative; display:table-cell; width:80px; height:80px; border-radius:100px; background-color:#ebebeb; vertical-align:middle;}
			.ClinicLandDetail .LandQna .QnaArea .Answer .Left img{position:relative; display:table-cell; width:40%; margin:0 auto; vertical-align:middle;}
			.ClinicLandDetail .LandQna .QnaArea .Answer .Right{position:relative; display:table-cell; max-width:84%; vertical-align:bottom;}

			/* 텍스트형 */
			.ClinicLandDetail .LandText{position:relative; display:block;}
			.ClinicLandDetail .LandText .Title{}
			.ClinicLandDetail .LandText .TextArea{position:relative; display:block; padding-left:8%;}
			.ClinicLandDetail .LandText .TextArea .TextBox{}
			.ClinicLandDetail .LandText .TextArea .TextBox + .TextBox{margin-top:15px;}
			.ClinicLandDetail .LandText .TextArea .TextBox p{line-height:1.3; font-size:13pt;}



/* ================================================================================================================================================================= */
/* 장바구니/예약페이지 */
.cartWrap .HasList{}
.cartWrap .NOList{}
.ReservationArea .BtnBg{background-color:#333;}
.ReservationArea .BtnBd{border:1px solid #333;}
.CartArea fieldset section + section,
.CertifyArea fieldset section + section,
.ReservationChkArea section + section,
.ReservationChangeArea section + section,
.ReservationArea fieldset section + section{margin-top:50px;}

/* -------------------------------------------------------------------------------------------------------------------- */
/* 메인영역 */
section .BigCont{position:relative; display:table; width:95%; margin:0 auto;}

/* -------------------------------------------------------------------------------------------------------------------- */
/* 장바구니,예약시술 */
.AllSection{position:relative; display:table; width:100%; padding:45px; border-radius:15px; border:1px solid #ebebeb; box-shadow:0px 3px 7px 0 rgba(0, 0, 0, 0.1);}
	/* ---------------------------------------------- */
	/* 공통 */
	.AllSection .Cont{}
	.AllSection .Cont + .Cont{margin-top:40px;}
	.AllSection .Cont .Left{}
	.AllSection .Cont .Left label{position:relative; display:table;}
	.AllSection .Cont .Left .CheckBox{position:relative; display:inline-table; vertical-align:middle;}
	.AllSection .Cont .Left .CheckBox em{width:30px;}
	.AllSection .Cont .Left .Info{position:relative; display:inline-table; vertical-align:middle; font-size:14pt; font-weight:600; line-height:1;}
	
	/* ---------------------------------------------- */
	/* 리스트 */
	.AllSection .Cont .ClinicLabel{margin-top:20px; border-top:1px solid #c7c7c7; border-bottom:1px solid #c7c7c7;}
	.AllSection .Cont .ClinicLabel .SelectForm{display:table; width:94%; margin:0 auto;}
	.AllSection .Cont ul.List{}
	.AllSection .Cont ul li{position:relative; padding:20px 10px; display:table; width:100%;}
	.AllSection .Cont ul li:hover{background-image: linear-gradient(to right, #fff 0%, #f8f8f8 5%, #f8f8f8 95%, #fff 100%)}
	.AllSection .Cont ul li:not(:first-child){border-top:1px dotted #c7c7c7; }
	/* 장바구니전용 */
	.cartWrap .AllSection .Cont ul li label{width:100%; display:table;}
		/* 상세 */
		.AllSection .Cont ul li .Cont01{position:relative; display:inline-table; vertical-align:middle; width:5%;}
		.AllSection .Cont ul li .Cont02{position:relative; display:inline-table; vertical-align:middle; width:35%; font-size:13pt;}
		.AllSection .Cont ul li .Cont03{position:relative; display:inline-table; vertical-align:middle; width:30%; font-weight:500; font-size:13pt;}
		.AllSection .Cont ul li .Cont04{position:relative; display:inline-table; vertical-align:middle; width:20%; text-align:center;}
		.AllSection .Cont ul li button{position:relative; display:inline-table; vertical-align:middle; width:10%; background:none; text-align:right; font-size:13pt;}
		/* 정보 */
		.AllSection .Cont .ClinicLabel .Name{position:relative; display:block; font-weight:600;}
		.AllSection .Cont .ClinicLabel .Info{position:relative; display:block; font-size:11pt; margin-top:0.3em; display:none;}
		/* 가격 */
		.AllSection .Cont .Price{position:relative; display:block;}
		.AllSection .Cont .Price em{position:relative; display:inline-block; text-decoration:line-through; color:#a5a5a5; font-weight:500; font-size:12pt;}
		.AllSection .Cont .Price span{position:relative; display:block; font-weight:600; font-size:12pt; margin-top:0.3em;}
		.AllSection .Cont .Price span b{font-size:16pt; margin-right:3px; letter-spacing:-1px;}
		/* 구분 */
		.ReservationArea .AllSection .Cont ul li .Cont04{width:25%;}

	/* ---------------------------------------------- */
	/* 이벤트내역 */
	.AllSection .Event{}
	.AllSection .Event .ChkAll{}

	/* ---------------------------------------------- */
	/* 시술내역 */
	.AllSection .Clinic{}
	.AllSection .Clinic .ChkAll{}


/* -------------------------------------------------------------------------------------------------------------------- */
/* 예약날짜시간 */
.DayTimeSection{position:relative; display:table; width:100%; padding:45px; border-radius:15px; border:1px solid #ebebeb; box-shadow:0px 3px 7px 0 rgba(0, 0, 0, 0.1);}
.DayTimeSection .DayCont{position:relative; display:inline-table; width:50%;}
.DayTimeSection .Info{position:relative; display:block; font-size:13pt; color:#333; font-weight:600; line-height:1; margin-bottom:1em;}
	/* ---------------------------------------------- */
	/* 예약날짜 */
	.DayTimeSection .Left{}
	.DayTimeSection .DayDate{position:relative; display:block; width:95%; padding:1.5em; border-radius:10px; background-color:#efefef;}
		/* 달력 */
		.DayDate.hasDatepicker *{font-family:'SUIT';}
		.DayDate.hasDatepicker{}
			/* 달력시작 */
			.DayDate .ui-datepicker-inline.ui-datepicker.ui-widget.ui-widget-content.ui-helper-clearfix.ui-corner-all{width:100%; border-radius:0; padding:0; }
			.DayDate .ui-datepicker{width:100%;}
			.DayDate .ui-widget-content{border:none; background:none;}
				/* 년도부분 */
				.DayDate .ui-datepicker-header.ui-widget-header.ui-helper-clearfix.ui-corner-all{padding:0; border-radius:0; margin-bottom:0.8em;}
				.DayDate .ui-datepicker-header{background:none;} 
				.DayDate .ui-widget-header{ border:none;}
					.DayDate .ui-datepicker-title *{font-size:12pt; vertical-align:middle; font-weight:600;}
					.DayDate .ui-datepicker-title{background:none; margin:0; color:#1d1d1d; line-height:1;}
					.DayDate .ui-datepicker-title select.ui-datepicker-year,
					.DayDate .ui-datepicker-title select.ui-datepicker-month{display:inline-block; width:auto; font-size:12pt; line-height:1; border:none; background:none;}
					.DayDate .ui-datepicker-title select.ui-datepicker-year{}
					.DayDate .ui-datepicker-title select.ui-datepicker-month{margin-left:0.5em;}
					.DayDate .ui-datepicker-title select{height:auto; margin:0;}
					.DayDate .ui-datepicker-title select option{padding:2px;}
					.DayDate .ui-datepicker-title span{font-weight:600;}
					/* 양쪽방향 */
					.DayDate .ui-widget-content a{top:0;}
					.DayDate .ui-widget-content a span.ui-icon {background-image:url('/css/js/images/ui-icons_444444_256x240.png')}
				/* 날짜부분 */
				.DayDate table.ui-datepicker-calendar *{font-size:12pt; font-weight:500;}
				.DayDate table.ui-datepicker-calendar{margin:0; background-color:#fff; border-radius:10px; overflow:hidden; box-shadow:2px 2px 5px 0px #e5e5e5; border-collapse:inherit;}
				/* 요일 */
				.DayDate table.ui-datepicker-calendar thead{background-color:#f6f6f6;}
				.DayDate table.ui-datepicker-calendar thead th{font-weight:600; padding:0.7em 0; line-height:1;}
				.DayDate table.ui-datepicker-calendar thead th span{}
				.DayDate table.ui-datepicker-calendar thead th.ui-datepicker-week-end{} /* 토일 */
				/* 일자 */
				.DayDate table.ui-datepicker-calendar tbody{}
				.DayDate table.ui-datepicker-calendar td{margin:0px; border:4px solid #fff;}
				.DayDate table.ui-datepicker-calendar a.ui-state-default{color:#1d1d1d; width:95%; margin:0 auto; line-height:1; text-align:center; border:none; background:none; border:1px solid rgba(255, 0, 0, .0); border-radius:100px; padding:0.3em 0;} /* 기본 */
				.DayDate table.ui-datepicker-calendar a.ui-state-default:hover{border:1px solid #111111; transition-duration:.3s;} /* 오버시 */
				.DayDate table.ui-datepicker-calendar a.ui-state-disabled{} /* 빈칸&비활성화 */
				.DayDate table.ui-datepicker-calendar a.ui-state-default.ui-state-active{color:#ffffff; font-weight:bold; background-color:#111111;} /* 선택된상태 */
				.DayDate table.ui-datepicker-calendar span.ui-state-default{color:#646464; line-height:1; text-align:center; font-weight:normal; border:none; background:none; padding:0.3em 0; width:95%; margin:0 auto; border:1px solid rgba(255, 0, 0, .0)} /* 비활성화 */


	/* ---------------------------------------------- */
	/* 예약시간 */
	.DayTimeSection .Right{}
	.DayTimeSection .DayTime{position:relative; display:block; width:95%; padding:1.5em; border-radius:10px; background-color:#efefef; min-height:7em;}
		/* 날짜피커 */
		.DayTime *{font-weight:500;}
		.DayTime{content:""; clear:both; display:block; margin-bottom:2%; overflow:hidden;}
		.DayTime .TimeList{position:relative; display:block; overflow:hidden;}
		.DayTime ul{}
		.DayTime ul li{display:block; float:left; width:20%; text-align:center; margin-top:2.4%;}
		.DayTime ul li:nth-child(-n+5){margin-top:0;}
		.DayTime li:nth-child(2n){margin-left:0px;}
		/* 시간표기 */
		.DayTime label{display:table; width:95%; margin:0 auto; color:#111111; font-size:11pt; line-height:1; vertical-align:middle; border:1px solid #ccc; border-radius:50px; background-color:#ffffff; box-shadow:2px 2px 5px 0px #e5e5e5; cursor:pointer; padding:0.7em 0;}
		.DayTime label span{font-size:9pt; display:none;}
		.DayTime label:hover{border-color:#111111; transition-duration:.3s;}
		/* 예약불가 */
		.DayTime li.Impossible label{color:#cccccc; border:1px solid #dfdfdf; background-color:#f7f7f7;}
		.DayTime li.Impossible label:hover{color:#cccccc; border:1px solid #dfdfdf; background-color:#f7f7f7;}
		/* 예약마감 */
		.DayTime li.TimeEnd{width:100% !important;}
		.DayTime li.TimeEnd label{border:none; background:none; box-shadow:none; cursor:default;}
		.DayTime li.TimeEnd label b{line-height:1.4; color:#444;}
		/* 선택된 */
		.DayTime li.Selected label{color:#ffffff; background-color:#111111;}


/* -------------------------------------------------------------------------------------------------------------------- */
/* 예약자정보입력 */
.InputSection{position:relative; display:table; width:100%; padding:45px; border-radius:15px; border:1px solid #ebebeb; box-shadow:0px 3px 7px 0 rgba(0, 0, 0, 0.1);}
	/* ---------------------------------------------- */
	/* 예약날짜 */
	.InputSection .Left{}
	.InputSection .BigCont{position:relative; display:table; width:95%; margin:0 auto;}
	.InputSection .BigCont .Label{position:relative; display:inline-table; width:80%; margin:0 auto;}
	.InputSection .BigCont .Label + .Label{margin-top:1em;}
	.InputSection .BigCont .Label label + label{margin-left:1em;}
	.InputSection .BigCont .Label span{position:relative; display:inline-table; width:16%; font-size:13pt; color:#333; font-weight:600; line-height:1; vertical-align:middle;}
	.InputSection .BigCont .Label .InputBox{position:relative; display:inline-table; width:61%;}
	.InputSection .BigCont .Label input{font-family:'SUIT'; width:100%; height:44px; border:0; border-bottom:1px solid #c3c3c3; font-size:13pt; color:#000;}
	.InputSection .BigCont .Label input::placeholder{color:#adadad;}
	.InputSection .BigCont .Label.LabelFirst{margin-top:1.5em;}
	
	
/* -------------------------------------------------------------------------------------------------------------------- */
/* 본인인증정보입력 */
.InputCertiSection{position:relative; display:table; width:50%; margin:0 auto; padding:45px; border-radius:15px; border:1px solid #ebebeb; box-shadow:0px 3px 7px 0 rgba(0, 0, 0, 0.1);}
	/* ---------------------------------------------- */
	/* 본인인증 */
	.InputCertiSection .BigCont{position:relative; display:table; width:100%; margin:0 auto;}
	.InputCertiSection .BigCont .Label{position:relative; display:inline-table; width:100%; margin:0 auto;}
	.InputCertiSection .BigCont .Label + .Label{margin-top:2em;}
	.InputCertiSection .BigCont .Label label + label{margin-left:1em;}
	.InputCertiSection .BigCont .Label span{position:relative; display:inline-table; width:16%; font-size:13pt; color:#333; font-weight:600; line-height:1; vertical-align:middle;}
	.InputCertiSection .BigCont .Label .InputBox{position:relative; display:inline-table; width:61%;}
	.InputCertiSection .BigCont .Label input{font-family:'SUIT'; width:100%; height:44px; border:0; border-bottom:1px solid #c3c3c3; font-size:13pt; color:#000;}
	.InputCertiSection .BigCont .Label input::placeholder{color:#adadad;}
	.InputCertiSection .BigCont .Label .ButtonBox{position:relative; display:inline-table; width:23%; text-align:left; padding-left:15px;}
	.InputCertiSection .BigCont .Label button{text-align:left;}
	.InputCertiSection .BigCont .Label.LabelFirst{margin-top:1.5em;}
	.InputCertiSection .BigCont .LabelName{}
	.InputCertiSection .BigCont .LabelNum{}
	.InputCertiSection .BigCont .LabelChk{}
	.InputCertiSection .BigCont .LabelChk .ChkTime{position:absolute; right:3%; top:50%; height:14px; margin-top:-7px; font-size:11pt; color:#ff0000; font-weight:600; line-height:1;}
	.InputCertiSection button{position:relative; display:inline-block; font-size:11pt; font-weight:500; padding:5px 10px; border-radius:4px; border:1px solid #333;}
	.InputCertiSection button:hover{opacity:.7; transition-duration:.3s;}
	
	
/* -------------------------------------------------------------------------------------------------------------------- */
/* 예약정보리스트테이블 */
.TableSection{position:relative; display:table; width:100%; margin:0 auto; padding:45px; border-radius:15px; border:1px solid #ebebeb; box-shadow:0px 3px 7px 0 rgba(0, 0, 0, 0.1);}
	/* ---------------------------------------------- */
	/* 예약정보 */
	.TableSection table *{font-weight:500;}
	.TableSection table{width:100%; margin:0 auto; border-collapse:separate; border-spacing:0 0.8rem; margin-top:-0.8rem; margin-bottom:-0.8rem; position:relative;}
	.TableSection table thead{text-align:center;}
	.TableSection table thead tr{}
	.TableSection table thead tr th{padding:0.6em 0; background-color:#b3b3b3; color:#fff; font-size:13pt; font-weight:500;}
	.TableSection table thead tr th:not(:last-child){border-right:1px solid #c9c9c9;}
	.TableSection table tbody:not(button)*{font-size:12pt;}
	.TableSection table tbody{width:100%; text-align:center;}
	.TableSection table tbody tr{line-height:3rem;}
	.TableSection table tbody tr th{padding:1.2em 0; border-top:1px solid #f1f1f1; border-bottom:1px solid #f1f1f1; border-color:transparent; background-color:#f1f1f1; font-weight:500;}
	.TableSection table tbody tr th:not(:last-child){border-right:1px dashed #d9d9d9;}
	.TableSection table tbody tr th:first-child{border-left:1px solid #f1f1f1;}
	.TableSection table tbody tr th:last-child{border-right:1px solid #f1f1f1;}
	.TableSection table tbody tr:hover th{background-color:#e7e7e7; border-top:1px solid #c9c9c9; border-bottom:1px solid #c9c9c9; transition-duration:.3s;}
	.TableSection table tbody tr:hover th:first-child{border-left:1px solid #c9c9c9;}
	.TableSection table tbody tr:hover th:last-child{border-right:1px solid #c9c9c9;}
	.TableSection table tbody tr th.List div{line-height:1.5; font-weight:500;}
	
	.TableSection button{position:relative; display:inline-block; font-size:11pt; font-weight:500; padding:10px 20px; border-radius:4px;}
	.TableSection button:hover{opacity:.7; transition-duration:.3s;}
	
	
/* -------------------------------------------------------------------------------------------------------------------- */
/* 예약정보변경리스트 */
.ListSection{position:relative; display:table; width:100%; margin:0 auto; padding:45px; border-radius:15px; border:1px solid #ebebeb; box-shadow:0px 3px 7px 0 rgba(0, 0, 0, 0.1);}
	/* ---------------------------------------------- */
	/* 예약변경 */
	.ListSection{position:relative; display:table; width:100%;}
	.ListSection .Left{position:relative; display:inline-table; width:90%; vertical-align:middle;}
	.ListSection .Right{position:relative; display:inline-table; width:10%; vertical-align:middle;}
	.ListSection dl *{font-weight:500; font-size:12pt;}
	.ListSection dl{position:relative; display:table; width:100%;}
	.ListSection dl + dl{margin-top:1em;}
	.ListSection dl dt{position:relative; display:inline-table; width:15%; vertical-align:top;}
	.ListSection dl dd{position:relative; display:inline-table; width:85%; vertical-align:top;}
	
	.ListSection a{position:relative; display:inline-block; font-size:12pt; width:100%; text-align:center; font-weight:500; padding:10px 10px; border-radius:4px; border:1px solid #333;}
	.ListSection a:hover{opacity:.7; transition-duration:.3s;}

	
/* -------------------------------------------------------------------------------------------------------------------- */
/* 개인정보동의 */
.FormAgreeChk{position:relative; display:block; width:95%; overflow:hidden; margin-top:20px; margin:0 auto 0 auto;}
.FormAgreeChk label{position:relative; display:block; vertical-align:middle; line-height:1.2; width:33%;}
	/* 체크박스 */
	.FormAgreeChk .CheckBox{position:relative; display:inline-table; vertical-align:middle;}
	.FormAgreeChk .CheckBox input{display:none;}
	.FormAgreeChk .CheckBox em{display:table-cell; position:relative; text-align:left; vertical-align:middle; font-style:normal; font-weight:normal;}
	.FormAgreeChk .CheckBox em b{display:block; position:relative; width:15px; height:15px; border:1px solid #a5a5a5; border-radius:3px; background-color:#ffffff;}
	.FormAgreeChk .CheckBox em b:after{content: ''; display:block; position:absolute; left:4.5px; top:1px; width:3px; height:7px; border-bottom:2px solid #a5a5a5; border-right:2px solid #a5a5a5; transform:rotate( 45deg ); -webkit-transform:rotate( 45deg );-moz-transform:rotate( 45deg ); display:none;}
	.FormAgreeChk .CheckBox input:checked ~ em{}
	.FormAgreeChk .CheckBox input:checked ~ em b:after{display:block;}
	.FormAgreeChk .CheckBox input:checked ~ pre{}
	/* 텍스트 */
	.FormAgreeChk .TextBox{position:relative; display:inline; vertical-align:middle;}
	.FormAgreeChk .TextBox span{font-size:9pt; color:#888}
	.FormAgreeChk .TextBox a{display:inline-block; text-decoration:underline; font-size:9pt; padding:0; margin:0; width:auto; margin-left:5px; border:none;} 


/* -------------------------------------------------------------------------------------------------------------------- */
/* 비어있을경우 */
.NOList{position:relative; display:block; text-align:center;}
.NOList i{position:relative; display:block; font-size:40pt; color:#ddd;}
.NOList p{position:relative; display:block; font-size:13pt; line-height:1; margin:1em 0 3em 0;}
.NOList .BtnArea{position:relative; display:block; width:100%; margin-top:20px; background:none; text-align:center; }
.NOList a{position:relative; display:inline-block; width:300px; margin:0 3px; font-size:13pt; font-weight:500; padding:13px 0; border-radius:5px; font-family:'SUIT'; border-color:#333;}
.NOList a:hover{opacity:.7; transition-duration:.3s;}


/* -------------------------------------------------------------------------------------------------------------------- */
/* 상단 */
section .TopInfo{position:relative; display:table; width:100%; padding-bottom:20px; margin-bottom:40px; border-bottom:1px solid #333;}
	/* ---------------------------------------------- */
	/* 좌측 */
	.TopInfo .Left{position:relative; display:table-cell; width:50%; vertical-align:bottom;}
	.TopInfo label{position:relative; display:table;}
	.TopInfo .CheckBox{position:relative; display:inline-table; vertical-align:middle;}
	.TopInfo .CheckBox em{width:30px;}
	.TopInfo .Info{position:relative; display:inline-table; vertical-align:middle; font-size:14pt; font-weight:600; line-height:1; margin:0;}
	.TopInfo .Info small{display:block; margin-top:0.8em; color:#888; font-size:12pt;}
	/* 구분 */
	.ReservationArea .TopInfo .Info{font-size:15pt; margin:0;}
	.CertifyArea .TopInfo .Info{font-size:16pt; color:#333;}

	/* ---------------------------------------------- */
	/* 우측 */
	.TopInfo .Right{position:relative; display:table-cell; vertical-align:bottom; width:50%; text-align:right;}
	.TopInfo button{position:relative; display:inline-block; font-size:11pt; font-weight:500; padding:5px 10px; border-radius:4px; border:1px solid #333;}
	.TopInfo button:hover{opacity:.7; transition-duration:.3s;}

	
/* -------------------------------------------------------------------------------------------------------------------- */
/* 팝업 */
.PopArea{position:fixed; top:0; right:0; bottom:0; left:0; z-index:1000; outline:0; display:none;}
.PopArea .PopBg{position:fixed; width:100%; height:100%; z-index:1; background-color:rgb(0 0 0 / 40%);}
.PopArea .PopBox{position:relative; max-width:550px; min-width:550px; z-index:2; display:flex; align-items:center; margin:1em auto; min-height:calc(100% - 2em); transition:transform .3s ease-out,-webkit-transform .3s ease-out; transform:translate(0,0); -webkit-box-align:center;}
.PopArea .PopCont{position:relative; display:flex; width:100%; pointer-events:auto; -webkit-box-orient:vertical; -webkit-box-direction:normal; flex-direction:column; background-clip:padding-box; outline:0; background-color:#fff; border-radius:10px;}
.PopArea .PopTitle{display:flex; -webkit-box-align:start; align-items:flex-start; -webkit-box-pack:justify; justify-content:space-between; padding:0.8em 1.1em; border-bottom:1px solid #e9ecef; border-top-left-radius:10px; border-top-right-radius:10px; background-color:#333; color:#fff; font-size:15pt; line-height:1.5;}
.PopArea .PopText{position:relative; -webkit-box-flex:1; flex:1 1 auto; padding:2.5em 0; background-color:#fff; text-align:center;}
.PopArea .PopText span{font-size:14pt; font-weight:500;}
.PopArea .PopText p{font-size:13pt; margin-top:1.5em;}
.PopArea .PopText i{opacity:.5; margin:0 5px; display:inline-block;}
.PopArea .BtnArea{display:block; width:100%; background-color:#fff; padding:0 0 2em 0; border-bottom-left-radius:10px; border-bottom-right-radius:10px; text-align:center;}
.PopArea button{position:relative; display:inline-block; width:30%; margin:0 3px; font-size:13pt; font-weight:500; padding:13px 0; border-radius:5px; font-family:'SUIT'; color:#333;}
.PopArea button:first-child{background-color:#e9e9e9;}
.PopArea button:hover{opacity:.7; transition-duration:.3s;}
.PopArea button.Close{width:auto; padding:0.6em; margin:-0.6em -0.6em -0.6em auto; background-color:transparent; border:0; -webkit-appearance:none; float:right; font-size:20pt; line-height:1; color:#ddd;}


/* -------------------------------------------------------------------------------------------------------------------- */
/* 버튼류 */
.BtnSection .BtnArea{position:relative; display:block; width:100%; background:none; text-align:center;}
.BtnSection button{position:relative; display:inline-block; width:300px; margin:0 3px; font-size:13pt; font-weight:500; padding:13px 0; border-radius:5px; font-family:'SUIT'; border:#333;}
.BtnSection button:hover{opacity:.7; transition-duration:.3s;}
.BtnSection a{position:relative; display:inline-block; width:300px; margin:0 3px; font-size:13pt; font-weight:500; padding:13px 0; border-radius:5px; font-family:'SUIT'; border:1px solid #333;}
.BtnSection a:hover{opacity:.7; transition-duration:.3s;}
.BtnSection small{display:block; margin-top:1em;}
.BtnSection > p{position:relative; display:block; margin:0 auto; padding:1em 0; text-align:center; color:#333; font-size:13pt; font-weight:500; background-color:#f4f4f4; border-radius:15px; line-height:1.4; margin-top:2em;}
	/* 예약페이지 > 버튼류 */
	.reservationWrap .BtnSection{}
	.reservationWrap .BtnSection > .TextBox{display:block; text-align:center;}
	.reservationWrap .BtnSection > .TextBox p{position:relative; display:inline-block; line-height:1.5; font-size:13pt; font-weight:500; color:#818181; background-color:#f1f1f1; border-radius:15px; padding:1.5em 7em; margin:2em auto;}


/* -------------------------------------------------------------------------------------------------------------------- */
/* 특정class */
.PriceSideWrap .ColorBg{background-color:#d1a28b; color:#fff;}
.PriceSideWrap .ColorTxt{color:#d1a28b;}
.PriceSideWrap .ColorBd{border-color:#d1a28b; background:none;}