@charset "utf-8";
/*
화사한의원
C00360
*/

/* =================================================================================================================================== */
/* 게시판 */
.boardWrap{}
.boardWrap #contents{padding:100px 0;}
.boardWrap .BoardList_Search fieldset{background:none; border:none; display:flex; align-items:center; gap:0.2em;}
.boardWrap .BoardList_Search fieldset > label:nth-child(1){display:none;}
.boardWrap .BoardList_Search fieldset > label:nth-child(2){background:#fff; border-radius:5px; border:1px solid #c5c5c5; overflow:hidden; height:100%;}
.boardWrap .BoardList_Search fieldset > label:nth-child(2) input{font-size:11pt; line-height:35px; padding:0 0.8em}
.boardWrap .BoardList_Search fieldset > label:nth-child(3){background:none; width:25%;}
.boardWrap .BoardList_Search fieldset > label:nth-child(3) button{background:#393939; border-radius:5px; border:none; overflow:hidden; color:#fff; font-size:11pt; font-weight:500;}

/* 게시판 list */
.boardWrap.ListWrap .BoardBtnList > section{padding-bottom:0;}
/* 게시판 view */
.boardWrap.ViewWrap #contents{padding-top:calc(80px);}
.boardWrap.ViewWrap .boardThumList{margin-top:3em;}
.boardWrap.ViewWrap .lisTable > section{padding-bottom:0;}
.boardWrap.ViewWrap .boardview thead th{color:#222; font-size:16pt; font-weight:600; letter-spacing:-0.7px;}

/* 게시판 3차 메뉴 */
.boardWrap .SubNavApart{padding-bottom:50px;}
.boardWrap .SubNav_Small2{margin:0;}
.boardWrap .SubNav .SubNav_Small2{margin:0; display:none !important;}
.boardWrap .SubNav_Small2 ul{display:flex; align-items:center; gap:var(--px_15); justify-content:space-between;}
.boardWrap .SubNav_Small2 li{display:flex; align-items:center; justify-content:center; width:100%; background-color:#fff; border-radius:var(--px_10); overflow:hidden; }
.boardWrap .SubNav_Small2 li.Action{background-color:var(--color_ee710c);}
.boardWrap .SubNav_Small2 li a{display:block; border:none; border-radius:0; width:100%; background-color:transparent; font-weight:600; font-size:21px; color:var(--color_7); transition:200ms; padding:8px 0px; letter-spacing:-0.5px;}
.boardWrap .SubNav_Small2 li:not(.Action) a:hover{background-color:#d1d1d1; color:var(--color_12);}
.boardWrap .SubNav_Small2 li.Action a{background-color:transparent; color:#fff; font-weight:600;}

/* 게시판 작성페이지 */
.boardWrap.WriteWrap #contents{padding-top:180px;}
.boardWrap.WriteWrap .InnerContainer{width:1000px; min-width:1000px;}
.boardWrap.WriteWrap fieldset .BtnBox{display:flex; gap:var(--px_10); align-items:center; margin:0; justify-content:center; margin-top:var(--px_50);}
.boardWrap.WriteWrap fieldset .BtnBox a{line-height:var(--px_60); height:var(--px_60); font-size:var(--px_20); width:25%; display:block; min-width:auto; padding:0; margin:0; border-radius:7px;}


/* ---------------------------------------------- */
/* 전후사진_cl 전용 */
.boardWrap.BnfWrap.ForC00360 #container{padding:0;}
.boardWrap.BnfWrap.ForC00360 #container > .InnerContainer{min-width:1400px; width:1400px; display:table;}
.boardWrap.BnfWrap.ForC00360 .boardThumList{position:relative; display:inline-table; width:80%; vertical-align:top; padding-left:80px;}
.boardWrap.BnfWrap.ForC00360 .boardThumList *{border:none; padding:0;}
.boardWrap.BnfWrap.ForC00360 .boardThumList ul{}
.boardWrap.BnfWrap.ForC00360 .boardThumList ul li{width:50%; padding:0 1%;}
.boardWrap.BnfWrap.ForC00360 .boardThumList ul li .ImgBox {display:block; width:100%;}
.boardWrap.BnfWrap.ForC00360 .boardThumList ul li .ImgBox .BlindThum{display:block; width:100%; overflow:hidden;}
.boardWrap.BnfWrap.ForC00360 .boardThumList ul li .ImgBox .BlindThum img{display:block; width:100%; cursor:pointer;}
.boardWrap.BnfWrap.ForC00360 .boardThumList ul li .ImgBox .BlindThum img:hover{animation:zoomEffect 0.8s ease forwards;}
.boardWrap.BnfWrap.ForC00360 .boardThumList ul li .ImgBox .Title{padding:13px 0 30px 0;}
.boardWrap.BnfWrap.ForC00360 .boardThumList ul li .ImgBox .Title p{line-height:1.4; font-size:18px; color:#121212; font-weight:500; letter-spacing:-1px;}
.boardWrap.BnfWrap.ForC00360 .BoardList_Search{display:none;}
.boardWrap.BnfWrap.ForC00360 .BoardBtnList{text-align:right;}
.boardWrap.BnfWrap.ForC00360 .BoardBtnList section{display:inline-block; width:80%; padding-left:80px; padding-bottom:0;}
.boardWrap.BnfWrap.ForC00360 .BoardBtnList .BoardList_PageBtn{width:100%;}

/* 전후사진_cl 3차메뉴 */
.boardWrap.BnfWrap.ForC00360 .SubNavApart{position:relative; display:inline-table; width:20%; vertical-align:top;}
.boardWrap.BnfWrap.ForC00360 .SubNavApart .InnerContainer{width:auto; min-width:auto;}
.boardWrap.BnfWrap.ForC00360 .SubNav_Small2{margin:0;}
.boardWrap.BnfWrap.ForC00360 .SubNav_Small2 ul{position:relative; padding:0; background-color:#fff; display:flex; flex-direction:column; gap:15px;}
.boardWrap.BnfWrap.ForC00360 .SubNav_Small2 ul li{position:relative; display:table; width:100%; z-index:1; border:none; border-radius:9px;}
.boardWrap.BnfWrap.ForC00360 .SubNav_Small2 ul li a{background-color:#ededed !important; font-size:13pt; padding:20px; border-radius:9px; transition:300ms all; letter-spacing:-0.5px; font-weight:600; line-height:1; text-align:left; color:#444;}
.boardWrap.BnfWrap.ForC00360 .SubNav_Small2 ul li:not(.Action) a:hover{background-color:#dddcdc !important;}
.boardWrap.BnfWrap.ForC00360 .SubNav_Small2 ul li span{position:relative; display:block; width:100%; text-align:left;}
.boardWrap.BnfWrap.ForC00360 .SubNav_Small2 ul li.Action{z-index:2;}
.boardWrap.BnfWrap.ForC00360 .SubNav_Small2 ul li.Action a{background-color:#9C1C1C !important; color:#fff !important; font-weight:700; box-shadow:0 15px 50px rgba(0,0,0,.2); z-index:2;}
.boardWrap.BnfWrap.ForC00360 .SubNav_Small2 .ColorBg{display:none;}

/* 전후사진_cl 모달 */
.ActiveFixed{overflow:hidden;}
.boardWrap.BnfWrap.ForC00360 .BnfModal{position:fixed; top:0; left:0; width:100%; height:100%; text-align:center; opacity:0; visibility:hidden; z-index:999;}
.boardWrap.BnfWrap.ForC00360 .BnfModal.Active{opacity:1; visibility:visible;}
.boardWrap.BnfWrap.ForC00360 .BnfModal.Active .ModalArea{opacity:1; visibility:visible;}
.boardWrap.BnfWrap.ForC00360 .BnfModal.Active .ModalArea img{opacity:1; visibility:visible; transform:scale(1); /* -webkit-transform:translateY(0); -ms-transform:translateY(0);  transform:translateY(0);  */-webkit-transition:all 0.4s ease-in-out; transition: all 0.4s ease-in-out;}
.boardWrap.BnfWrap.ForC00360 .BnfModal .ModalAreaBg{position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.9); z-index:1;}
.boardWrap.BnfWrap.ForC00360 .BnfModal .ModalArea{position:absolute; width:100%; height:100%; align-items:center; justify-content:center; display:flex; z-index:2; background-color:transparent;/*  transform:translateY(15px); */ opacity:0; visibility:hidden; text-align:right;}
.boardWrap.BnfWrap.ForC00360 .BnfModal .ModalArea img{transform:scale(.5); opacity:0; visibility:hidden;-webkit-transition:all 0.4s ease-in-out; transition: all 0.4s ease-in-out;}
.boardWrap.BnfWrap.ForC00360 .BnfModal .Close{position:absolute; display:block; width:100%; height:100%; left:0; top:0;}
.boardWrap.BnfWrap.ForC00360 .BnfModal i{position:relative; display:block; font-size:25pt; color:#fff; cursor:pointer; line-height:1;}
.boardWrap.BnfWrap.ForC00360 .BnfModal i:hover{color:#bfbfbf; transition-duration:300ms;}
.boardWrap.BnfWrap.ForC00360 .BnfModal pre{display:block; margin-top:1em; max-height:85vh; overflow-y:auto; overflow-x:hidden; text-align:justify;}
.boardWrap.BnfWrap.ForC00360 .BnfModal pre *{color:#fff !important;}
.boardWrap.BnfWrap.ForC00360 .BnfModal pre img{display:block; width:1000px !important; height:600px !important;}
.boardWrap.BnfWrap.ForC00360 .BnfModal pre::-webkit-scrollbar{width:6px; border-radius:100px;}
.boardWrap.BnfWrap.ForC00360 .BnfModal pre::-webkit-scrollbar-thumb{background-color:#666; border-radius:100px;}
.boardWrap.BnfWrap.ForC00360 .BnfModal pre::-webkit-scrollbar-track{background-color:#111;}
.boardWrap.BnfWrap.ForC00360 .BnfModal .TextBox{position:relative; display:block; width:100%;}
.boardWrap.BnfWrap.ForC00360 .BnfModal .Text{position:relative; display:block; text-align:left; line-height:1.1;}
.boardWrap.BnfWrap.ForC00360 .BnfModal .Text01{padding-left:25px; font-size:30px; font-weight:600; letter-spacing:-0.5px; font-family:"Noto Serif KR"; color:#282828; margin-top:15px;}
.boardWrap.BnfWrap.ForC00360 .BnfModal .Text02{padding-left:25px; font-size:20px; font-weight:500; color:#282828; line-height:1.7; margin-top:40px; padding-top:40px; height:280px; letter-spacing:-1px;}
.boardWrap.BnfWrap.ForC00360 .BnfModal .Text02:before{content:''; position:absolute; height:1px; width:100%; left:0; top:0; background-color:#282828;}
@keyframes zoomEffect {
	0%   {transform: scale(1);}
	50%  {transform: scale(1.04);}
	100% {transform: scale(1);}
}

/* 칼럼게시판 */
.goodsWrap.BoardNew.ListWrap .InnerContainer{width:1250px; min-width:1250px}
.goodsWrap.BoardNew .lisTable .Title{}
.goodsWrap.BoardNew .lisTable .Thumb{display:none;}
.goodsWrap.BoardNew .lisTable .Thumb ~ pre{padding:0;}
.goodsWrap.BoardNew .lisTable .Thumb ~ pre .Title{font-size:13pt; letter-spacing:-0.5px; font-weight:600; color:#333;}
.goodsWrap.BoardNew .lisTable .Thumb ~ pre mark{display:none;}


/* =================================================================================================================================== */
/* 문의 */
.contactWrap{}
.contactWrap #contents{padding:100px 0;}
.contactWrap .Footer_Area{padding:0;}
.contactWrap fieldset .BtnBox{display:flex; gap:var(--px_10); align-items:center; margin:0; justify-content:center; margin-top:var(--px_30);}
.contactWrap fieldset .BtnBox > a{line-height:var(--px_60); height:var(--px_60); font-size:var(--px_20); width:25%; display:block; min-width:auto; padding:0; margin:0; border-radius:7px;}
.contactWrap fieldset .BtnBox > button{line-height:var(--px_60); height:var(--px_60); font-size:var(--px_20); width:25%; display:block; min-width:auto; padding:0; margin:0; border-radius:7px;}
.contactWrap fieldset .BtnBox > p{margin:0; width:25%;}
.contactWrap fieldset .BtnBox > p > a,
.contactWrap fieldset .BtnBox > p > span{line-height:var(--px_60); height:var(--px_60); font-size:var(--px_20); width:100%; display:block; min-width:auto; padding:0; margin:0; border-radius:7px;}


/* =================================================================================================================================== */
/* 퀵링크페이지 */
.memberWrap #contents .Inner{margin-top:calc(5vh + 80px); margin-bottom:0; background:none; padding:0;}
.memberWrap #contents .AgreeBox{padding:0 0 70px 0;}
.memberWrap #contents .AgreeBox p{line-height:1;}
.memberWrap .AgreeBox .PrivacyText pre{height:60vh}
.aboutUninsured .Border_healthListArea{padding:calc(1.5em + 80px) 0 70px 0;}


/* =================================================================================================================================== */
/* 키비주얼 섹션 */
.TopVisual{height:800px; padding:0; background-size:cover; background-position:bottom; background-repeat:no-repeat;}
.TopVisual .TopText{position:relative; display:flex; justify-content:center; align-items:center; flex-direction:column; gap:var(--px_25); width:100%; height:100%;}
.TopVisual .TopText > span{color:#9C1C1C; font-size:var(--px_25); letter-spacing:0.7px; font-weight:400; font-family:'Suranna';}
.TopVisual .TopText h2{color:#333; font-size:var(--px_55); font-weight:600;}
.TopVisual .TopText p{color:#484848; position:relative; font-size:var(--px_22); font-weight:400; line-height:1.5; text-align:center; margin-top:var(--px_15);}


/* =================================================================================================================================== */
/* 상품형 시술이벤트 */

/* 리스트페이지 */
.clinicListWrap{}
.clinicListWrap .TopVisual .TopText{gap:var(--px_30)}
.clinicListWrap .TopVisual .TopText > span{font-size:var(--px_35); letter-spacing:2.8px; display:flex; align-items:center; gap:var(--px_13);}

/* 상세페이지 */
.clinicViewWrap{padding-top:80px !important;}
.clinicViewWrap .TopVisual{display:none !important;}

.NC00360.DefaultForm .ClinicCateList ul li.Active a{background-color:#9C1C1C !important;}
.NC00360.DefaultForm .ClinicAllList ul li .Price{color:#9C1C1C !important;}
.NC00360.DefaultForm .ClinicDetailSelect .BtnArea button:nth-child(1){background-color:#9C1C1C !important; flex:1 1 calc(50% - 5px);}
.NC00360.DefaultForm .ClinicDetailSelect .ClinicLabel ul li .Price span b{color:#9C1C1C !important;}


/* =================================================================================================================================== */
/* 의료진소개 */
.doctorContainer{}
.doctorContainer .Section01{}
.doctorContainer .Section01 .contArea{}
.doctorContainer .Section01 .contArea > p{color:#9D8A73; font-size:var(--px_40); font-weight:600;}
.doctorContainer .Section01 .cont02 small{color:#BFAA8F; font-size:var(--px_22); font-weight:400; letter-spacing:1.7px; height:15px; line-height:15px; font-family:'Suranna'; display:block;}
.doctorContainer .Section01 .cont02 .name{color:#333; font-size:var(--px_35); font-weight:600; line-height:1; letter-spacing:-0.3px; margin-bottom:var(--px_20);}
.doctorContainer .Section01 .cont02 .name span{font-size:var(--px_45);}
.doctorContainer .Section01 .cont02 pre.career *{color:#484848; font-size:var(--px_18); line-height:1.9; font-weight:400;}
.doctorContainer .Section01 .cont02 pre.career b{font-weight:600; font-size:var(--px_20);}


/* =================================================================================================================================== */
/* 병원소개 */
.aboutContainer{}
.aboutContainer .Section01{padding:var(--px_130) 0;}
.aboutContainer .Section01 .contArea{padding:var(--px_100); background-color:rgba(255, 255, 255, 0.85);}
.aboutContainer .Section01 .cont01{}
.aboutContainer .Section01 .cont01 *{font-family:'Noto Serif KR';}
.aboutContainer .Section01 .cont01 span{color:#C7B197;}
.aboutContainer .Section01 .cont01 p{color:#333;}

.aboutContainer .Section02{}
.aboutContainer .Section02 .titleArea{}
.aboutContainer .Section02 .titleArea strong{letter-spacing:2.5px !important;}
.aboutContainer .Section02 .contArea{}
.aboutContainer .Section02 .contArea .box{justify-content:flex-start; min-width:300px;}
.aboutContainer .Section02 .contArea .box .imgBox{height:150px; display:flex; align-items:center; margin:0 auto;}
.aboutContainer .Section02 .contArea .box .imgBox img{width:fit-content;}
.aboutContainer .Section02 .contArea .box .textBox{}
.aboutContainer .Section02 .contArea .box .textBox span{color:rgba(72, 72, 72, 0.50);}
.aboutContainer .Section02 .contArea .box .textBox p{color:#848484;}
.aboutContainer .Section02 .contArea .box .line{background-color:#782222; width:30px; height:3px; margin:5px auto;}

.aboutContainer .Section03{}
.aboutContainer .Section03 .contArea .textBox{justify-content:flex-start; min-width:600px;}
.aboutContainer .Section03 .contArea .textBox > div{color:rgba(51, 51, 51, 0.70); font-family:'Noto Serif KR';}
.aboutContainer .Section03 .contArea .textBox > span{color:#C7B197; line-height:42px; height:42px; letter-spacing:1.2px !important; font-family:'Suranna';}
.aboutContainer .Section03 .contArea .textBox > p{color:#848484;}
.aboutContainer .Section03 .contArea .textBox > img{width:fit-content;}
.aboutContainer .Section03 .contArea .textBox > p > b{margin-top:20px; display:block;}
.aboutContainer .Section03 .contArea .textBox > p > b span{margin:0 0 0 15px;}
.aboutContainer .Section03 .contArea .line{background-color:#999; width:100%; height:1px; margin:10px 0;}
.aboutContainer .Section03 .contArea .imgBox{}
.aboutContainer .Section03 .contArea .imgBox img{width:fit-content;}


/* =================================================================================================================================== */
/* 둘러보기 */
.galleryContainer .Section01{}
.galleryContainer .textBox{}
.galleryContainer .textBox strong{color:#9D8A73;}
.galleryContainer .textBox p{color:#484848;}
.galleryContainer .tabBox{}
.galleryContainer .tabBox div{color:#999; padding:19px; min-width:250px; border:1px solid #999; background-color:#fff; transition:200ms; border-radius:10px; text-align:center; display:flex; align-items:center; justify-content:center; cursor:pointer;}
.galleryContainer .tabBox div.active{color:#333; padding:10px; background-color:#EEE8DF;}
.galleryContainer .tabBox div:not(.active):hover{color:#333;}
.galleryContainer .imgBox .tab{display:none; opacity:0; transition:opacity 0.3s ease;}
.galleryContainer .imgBox .tab.active{display:flex; animation:fadeIn 0.3s ease forwards;}
.galleryContainer .imgBox .tab.fadeOut{display:flex; animation:fadeOut 0.3s ease forwards;}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeOut {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(8px); }
}

/* ========================================================================================================================================= */
/* 장비소개 */
.deviceContainer *{}
.deviceContainer{}

	/* ---------------------------------------------- */
	/* 타이틀 */
	.deviceContainer .titleArea{}
	.deviceContainer .titleArea span{color:#9E8260; font-weight:400; letter-spacing:1.7px !important; height:15px; line-height:15px; font-family:'Suranna'; display:block;}
	.deviceContainer .titleArea div{}
	.deviceContainer .titleArea div:after{content:''; width:100%; flex:1; height:1px; background-color:rgba(0, 0, 0, 0.50);}
	
	/* ---------------------------------------------- */
	/* 슬라이드 */
	.deviceContainer .contArea{}
	.deviceContainer .swiper-slide .box{cursor:pointer; width:270px;}
	.deviceContainer .swiper-slide .box .imgBox{position:relative; overflow:hidden;}
	.deviceContainer .swiper-slide .box .imgBox img{ transition:300ms;}
	.deviceContainer .swiper-slide .box .textBox{}
	.deviceContainer .swiper-slide .box .textBox div{font-weight:500; color:#484848; transition:300ms;}
	.deviceContainer .swiper-slide .box:hover .textBox div{color:#9E8260;}
	.deviceContainer .swiper-slide .box:hover .imgBox img{transform:scale(1.03);}
	
	/* ---------------------------------------------- */
	/* 모달 */
	.ActiveFixed{overflow:hidden;}
	.deviceContainer .deviceModal{position:fixed; top:0; left:0; width:100%; height:100%; text-align:center; opacity:0; visibility:hidden; z-index:999;}
	.deviceContainer .deviceModal.active{opacity:1; visibility:visible;}
	.deviceContainer .deviceModal.active .modalArea{opacity:1; visibility:visible; -webkit-transform:translateY(0); -ms-transform:translateY(0);  transform:translateY(0); -webkit-transition:all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
	.deviceContainer .deviceModal .modalAreaBg{position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0, 0, 0, 0.7); z-index:1;}
	.deviceContainer .deviceModal .modalArea{position:absolute; left:50%; top:50%; width:calc(820px + 160px); height:calc(420px + 160px); margin-left:calc((820px + 160px) / -2); margin-top:calc((420px + 160px) / -2); z-index:2; background-color:#fff; padding:80px; transform:translateY(15px); opacity:0; visibility:hidden;}
	.deviceContainer .deviceModal .modalArea > img{position:relative; float:right; width:fit-content;}
	.deviceContainer .deviceModal .textBox{display:flex; flex-direction:column; width:100%; gap:35px; justify-content:flex-start; text-align:left;}
	.deviceContainer .deviceModal .textBox strong{color:#333;}
	.deviceContainer .deviceModal .textBox div{width:100%; height:1px; background:rgba(0, 0, 0, 0.50);}
	.deviceContainer .deviceModal .textBox p{color:#484848; height:254px; word-break:keep-all;}