@charset "utf-8";

.pc_ver { display:block !important }
.m_ver { display:none !important }

@media screen and (max-width:600px){
	.m_ver { display:block !important }
	.pc_ver { display:none !important }
}

a.btn_more{display:inline-block; padding:10rem 25rem; border:2px solid #fff; background-size:14rem; border-radius:30rem; color:#fff; font-size:15rem}
a.btn_more:hover{background-color:#324471; border:2px solid #324471; }

a.btn2_more{transform: rotate(-0.03deg);display:inline-block; padding:10rem 25rem; background-color:#324471; font-weight:500; border:2px solid #324471; background-size:14rem; border-radius:30rem; color:#fff; font-size:15rem}
a.btn2_more:hover{background-color:#fff; border:2px solid #324471; color:#324471; }

/* pop layer */
#popLayerBg { position:fixed; z-index:99; width:100%; height:100%; background:#000; opacity:0.8; filter:alpha(opacity=80); display:none }
.pop_layer { z-index:100; display:none; position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); background:#fff; border-radius:0; box-shadow:0 0 5px rgba(0,0,0,0.6); }
.pop_layer > header { background:#576f8d; height:46px; border-radius:0; }
.pop_layer > header h2 { text-align:center; font-family:nanumsquare; font-size:18px; font-weight:500; color:#fff; line-height:42px; }
.pop_layer .btn_close { position:absolute; top:12px; right:12px; display:block; font-size:20rem; text-align:center; width:20rem; height:20rem; line-height:20px; text-indent:-9000px; background:url(../img/btn_close.png) no-repeat; background-size:100% }
.pop_layer > header + .con { padding:30rem; padding-bottom:40rem }
.pop_layer .btn_add i { font-size:19rem }
.pop_layer .btn_area { text-align:center; margin:30rem 0 0 0 }
.pop_layer .btn_area .btn { min-width:150rem }

.wrap {width:1400rem; margin:0 auto; position:relative }

#header {height: 100rem;position:fixed;top:0;lefT:0;width:100%;z-index:100;color:#fff; transition:all .3s;display: flex;align-items: flex-start;justify-content: space-between;}
#header h1 {z-index:51; position:absolute; left:0; top:14rem; font-size:0; text-align:center;}
#header h1 a {width: 247rem;height: 67rem;background-size:100%;background-image: url(../img/layout/logo.png);display: block;}
#header .gnb {position: relative;margin:0 auto;/* text-align:right; */float: right;}
#header .gnb:before{content:'';position:absolute;left:0;top:0;display:block;}
#header .gnb > ul{display:inline-block; margin-top:34rem; margin-right:20px; }

#header .gnb .depth1 {margin: 0 15rem;position:relative;min-width:90rem;display: inline-block; text-align:center;}
#header .gnb .depth1 > a {position: relative; display: block; color:#000;display:inline-block;font-size: 20rem; letter-spacing:-.5px; font-weight:600;font-family:'Pretendard';}
#header .gnb .depth1 ul {display: none;    width: 240px; padding: 20px 30px;    box-sizing: border-box;    background-color: #fff;    position: absolute;    top: 66px;    left: 50%;    transform: translateX(-50%);}
#header .gnb .depth1 ul li{text-align:center;}
#header .gnb .depth2 > a {display:inline-block;font-weight:500;font-size:16rem;line-height:1.4;padding:7rem 0;letter-spacing:-1px;font-family:'Pretendard';color: #333;word-break: keep-all;}
#header .btn_user { float:right; margin:35rem 0 0 0; display:block; font-size:19px }
#header .user { float:right; right:-35rem; margin-top:28rem; padding:5rem 0;  transition:all .3s }
#header .user ul {display: flex; align-items: center; justify-content: center;gap:10px;  }
#header .user li a {font-size:12rem; font-weight:600;  text-align:center; color:#fff; }
#header .user li img {border-radius:500rem;}
#header .user.on { opacity:1 }
#header .gnb .depth1 > a:before {background:#665643;margin-top: 63rem;content:"";height:3px;left:0px; position: absolute;width:0%;transition:0.3s;}
#header .gnb .depth1:hover > a:before { width:100%; }

#header.down {height: 450rem; background: #fff;}
#header.down a {}
#header.down .gnb .depth1 > a { margin-bottom:8rem; color:#000;}
#header.down .gnb .depth1 ul { height:100%; overflow:visible  }
#header.down .gnb .depth2 > a:hover { color:#000  }

#header.on { background:#fff; }
#header.on a {}
#header.on .gnb .depth1 > a { margin-bottom:8rem; color:#111;}
#header.down .gnb .depth2 > a{color:#000;}
#header.on .user li a {color:#333;}

header:hover {
    background: rgba(255,255,255,1);
    backdrop-filter: blur(10px);
}

#header:hover .gnb .depth1 > a {color:#000;}
#header:hover .gnb .depth1:hover > a {color:#665643;}
#header:hover .user li a {color:#333;}

.header-login{position:absolute; right:0; top:-6rem; display:flex; align-items:center;}
.header-login a{color:#fff; white-space:nowrap;}
.header-inner.wrap{}
.header-login li:nth-child(1) a{color:#248689;}
.header-login  a{display:block; padding:8rem 14rem; background:#fff; font-weight:500; font-size:15rem; text-align:center; min-width:82rem;}
.header-login li:nth-child(2) a{background:#15686c;}

.mobile-nav { display: none; }
.mobile-nav.on {    display: block;    width: 360px; height: 100vh;    background-color: rgba(255,255,255,1);    position: absolute;    top: 0;    right: 0;    padding: 60px 40px 0px 40px;    box-sizing: border-box;    z-index: 100;}
.mobile-nav ul .depth1 {    margin-bottom: 10px;    background: url(../img/layout/plus.png) no-repeat 260px 15px;    background-size: 10px auto;}
.mobile-nav .depth1.on {    background: url(../img/layout/minus.png) no-repeat 260px 15px;    background-size: 10px auto;}
.mobile-nav ul .depth1 a {    font-size: 18rem; line-height: 46px; color: #222;}
.mobile-nav ul .depth1 ul {    display: none;}
.mobile-nav.on ul .depth1 > ul.on {    display: block;}

.mobile-nav .depth2 { padding-left: 20px; }
.mobile-nav .depth2 > a {font-size: 13rem; line-height: 1.2; color: #555; opacity: 0.7;}

/* footer */
#footer { padding:50rem 0; margin:0rem 0 0 0; background:#000; font-size:16rem; color:#fff}
#footer b{display:block; margin-bottom:8rem; color:#fff;}
#footer h1 { float:left }
#footer h1 a { text-indent:-9000px; font-size:0; width:200rem; height:29rem; background-image:url(../img/ci.png); background-position:0 29rem; display:block; overflow:hidden; background-size:100% }
#footer nav { position:absolute; right:0; top:0 }
#footer nav li {position:relative; border:1px solid #fff; border-radius:5px; padding:2px 10px; display:inline-block; }
#footer nav li a { color:#fff; }
#footer .list_info li{word-break: keep-all; line-height:1.7; float:left; font-weight:200; margin-right:30rem; }
#footer .list_info li:nth-child(6n){clear:both;}
#footer dl{line-height:2;}
#footer dt, #footer dd { display:inline-block }
#footer dd { margin:0 15rem 0 0rem }
#footer .copyright {font-weight:300; margin:30rem 0 0 0; font-size:15rem; color:#fff; opacity:0.38}

#footer #top_btn { border:0; background:rgba(185,130,103,0.7); font-size:30rem; color:#fff; right:30px; bottom:30px; border-radius:100px; }
#footer #top_btn:hover { background:#756267; }
#footer #top_btn i { vertical-align:2rem }



@media (min-width:2000px){

}


@media (max-width:1480px){
	.wrap{width:100%; padding:0 10rem;}
	
	#header h1{left:30rem}
}


@media (max-width:1023px) {
	#header { height:80rem }
	#header::before{height:80rem}
	#header.down { height:0 }
	#header h1 {left:15rem;top: 0;}
	#header h1 a{width:120rem; height:29rem; margin:25rem 0;}
	
	.header-login{right:65rem; top:20rem}
	#header .btn_user { position:absolute; right:70rem; top:25rem; font-size:22rem; z-index:8; float:none; margin:0 }
	#header .btn_gnb { position:absolute; right:20rem; top:22rem; font-size:22rem; z-index:115; color:#333;}
	#header .btn_gnb.on { color:#111; transform:rotate(-90deg) }
	#header .btn_gnb.on .fa-bars:before{content: "\f00d";}
	#header .gnb { position:fixed; width:100%; background:#fff; height:100%; top:0; right:-100%; margin:0; float:none; z-index:9; transition:all .3s }
	#header .gnb.on {z-index:11; right:0;}
	#header .gnb > ul{display:block; margin-top:80rem; padding-top:40rem; border-top:1rem solid #ddd;}
	#header .gnb:before{display:none;}
	#header .gnb .depth1 > a {}
	#header.down .gnb a { color: #fff }
	#header.down .btn_gnb {color:#111;}
	#header.down .gnb .depth1 > a { margin-bottom:0 }
	#header.down .gnb .depth1:hover > a { color:#fff }
	#header .gnb.on .depth1 ul {display:none;height: auto;position: static; padding:20rem; background:#f8f8f8; border-top:1rem solid #b77f63; transition: none;}
	#header .gnb.on .depth1 ul li a{display:block; padding:0 0 14rem 0; color:#222; text-align:left;}
	#header .gnb.on .depth1 ul li:last-child a{padding-bottom:0}

	#header .gnb .depth1 > a:before { display:none }
	#header .gnb .depth1 {float:none;margin-bottom:20rem;text-align: left;display: block;}
	#header .gnb .depth1 > a {display:block; height:auto; padding-bottom:12rem; line-height:1; color:#222; }

	#header .user { right:68rem; top:26rem }
	#header .user.on a { color:rgba(0,0,0,0.7) }

	#header.on { background:#fff }
	#header.on .btn_gnb {color:#111;}
	#header.on .gnb a { color:#222; font-size:20rem; }
	#header.on .gnb .depth1 ul li a{font-size:17rem;}

	#footer { padding:30rem 0 }
	#footer h1 { display:none }
	#footer .f_left { float:none !important; margin:0; }
	#footer nav { position:static; margin:0 0 10rem }
	#footer nav li { margin:0 17px 0 0 }
}


@media (max-width:860px){	
	#header .gnb .depth1 {margin-bottom:10rem}
	#header .user { margin-right:37rem; margin-top:22rem;  }
	#footer #top_btn { display:none; font-size:17rem; bottom:60rem; right:10rem; width:30px; height:30px; line-height:30px; }
}



@media (max-width:540px) {

	#header .gnb{width:100%}
	#header .btn_gnb{top:21rem}
	
	.header-login{top:25rem; right:49rem}
	.header-login a{min-width:55rem;padding: 6rem 10rem;font-size:13rem;}
	
	a.btn_more{padding: 5rem 10rem; font-size:12rem}
	a.btn2_more{padding: 5rem 10rem; font-size:12rem}

	#footer{font-size:12rem}
	#footer .list_info li{clear:both;}
	#footer .list_info li:after{display:none;}

	#footer nav {margin-top:20rem;}
	#footer .copyright { font-size:12rem;}
}






/* quick-nav */
.quick-nav {  position: fixed;  bottom: 50%;  transform:translateY(50%);  right: 10px;  width: 84px;  z-index: 9;    background:#fff;   border:1px solid #f7f7f7; border-radius:10px;    overflow:hidden;}
.quick-nav ul{padding:0px 12px;}
.quick-nav li{position:relative;}
.quick-nav li.btn_counsel{display:none;}
.quick-nav li a{display:block;padding:16px 0 12px;text-align:center;border-bottom:1px solid rgba(117,98,103,0.2);}
.quick-nav li:last-child a{border-bottom:0;}
.quick-nav li a:hover{opacity:0.8;}
.quick-nav li a img{width:28px;display:block;margin:0 auto;}
.quick-nav li a figure{margin:0;}
.quick-nav li a figcaption{padding-top:8px;font-size:12px;color:#756267;}
.quick-nav li:nth-child(1) a figcaption{padding-top:8px;font-size:15px;font-weight:600;color:#b77f63; line-height:1.2;}

.quick-nav li.last a{background:#de797f;flex-direction:column;gap:2px;border:0;}
.quick-nav li.last a img{width:8px;}
.quick-nav li.last a figcaption{display:block;font-size:11px;letter-spacing:0;font-weight:600;color:#fff;}
    
@media (max-width: 1500px) { 
    
    .quick-nav{position:fixed;bottom:0;left:0;right:unset;width:100%;height:60px;top:unset;right:unset;transform:none;border:0;border-radius:0;}
    .quick-nav .btn-quick-top{display:none;}
    .quick-nav ul{display:flex;align-items:center;flex-direction:row;gap:0;padding:0;margin:0;}
    .quick-nav ul li{flex:1;padding-left:0;}
    .quick-nav li.btn_counsel{display:block;}
    .quick-nav li a{height:100%;padding:10px 0;border:0;border-right:1px solid rgba(255,255,255,0.2);}
    .quick-nav ul li img{width:24px;}
    .quick-nav ul li figcaption{display:block;text-align:center;padding-top:5px;font-size:10px;}
	.quick-nav li:nth-child(1) a figcaption {font-size:10px; color:#756267; font-weight:400;padding-top:5px;}
    
    .quick-nav li.last{display:none;}
}


.sec_reservation { background: url("../img/layout/reservation_bg.jpg") no-repeat center /cover; height: 400px; display: flex; align-items: center;justify-content: center;} 
.sec_reservation .wrap { width: 100%; } 
.sec_reservation .tt {text-align:center; } 
.sec_reservation .tt i {display:block; margin-bottom:20rem; } 
.sec_reservation .tt i img {width:50rem; } 
.sec_reservation .tt h2{font-size:28rem;font-weight:600;line-height:120%;letter-spacing:-1px;overflow:hidden;color:#fff; }
.sec_reservation .tt p a{display:flex;justify-content:center;align-items:center;width:200px;height:45px;margin:30px auto 0;padding:0 20px;font-size:16rem;border-radius:50px;color:#fff; background:#b98267;}

@media all and (max-width: 1023px){
    .sec_reservation { height: 300px; } 
	.sec_reservation .tt i img {width:40rem; } 
    .sec_reservation .tt h2 {font-size:18rem; letter-spacing:-.5px; line-height:1.5; }
	.sec_reservation .tt p a{font-size:13rem;}
}




/* 공통 레이어 팝업 샘플 */
.layer-popup {position: fixed; top: 0; left: 0; width: 100%; height: 100%; padding: 0px; background-color: rgba(17, 23, 29, 0.70); visibility: hidden; opacity: 0; z-index: 10000;}
.layer-popup.on {visibility: visible; opacity: 1; transition: all 0.3s;}
.layer-popup .popup-inner {display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 920px; width: 100%; max-height: 100%; padding: 80px 60px; background-color: #fff; overflow: hidden; overflow-y: auto; animation: fadeInUpLayer 0.3s;}
.layer-popup.on .popup-inner {display: block;}
.layer-popup .popup-inner .close-btn {position: absolute; top: 30px; right: 50px; width: 32px; height: 32px; background: transparent url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 26L26 6' stroke='%23333333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M26 26L6 6' stroke='%23333333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A"); border: 0; cursor: pointer; transition: all 0.3s;}
.layer-popup .popup-inner .close-btn:hover, .layer-popup .popup-inner .close-btn:focus {transform: rotate(180deg);}
.layer-popup p {font-size:13rem; font-weight:500; color:#000; margin-top:10rem; }

@media (max-width:1280px) {
	.layer-popup .popup-inner {padding: 55px 10px 50px;}
	.layer-popup .popup-inner .close-btn {top: 20px; right: 25px;}

}
@keyframes fadeInUpLayer {
  0% {opacity: 0; transform: translate(-50%, -40%);}
  100% {opacity: 1; transform: translate(-50%, -50%);}
}


.dental-table {    width: 100%;    border-collapse: collapse;    background-color: #ffffff;    box-shadow: 0 4px 6px rgba(0,0,0,0.05);    border-radius: 8px;    overflow: hidden;    border: 1px solid #d7ccc8;}
.dental-table th {    background-color: #5d4037;     color: #ffffff;    font-weight: 600;    padding: 12px 10px;    font-size: 14rem;    border: 1px solid #4e342e;}
.dental-table td {word-break: keep-all;  font-weight:500;  padding: 10px;    font-size: 14rem;    color: #333;     border: 1px solid #efebe9;    text-align: center;}

.font-code {    color: #795548;}
.font-price {    font-weight: 600;    color: #3e2723;    text-align: right;    padding-right: 15px !important;}
.remark {    font-size: 11px;    color: #8d6e63;}

@media all and (max-width: 650px){
	.dental-table th { font-size: 11rem; padding: 12px 0px;  }
	.dental-table td { font-size: 11rem;  padding: 10px 0; }
}

.sec_table {    max-width: 900px;    margin: 50rem auto 0;    background-color: #ffffff;    padding: 30px;    border-radius: 12px;   border: 1px solid #e0d4c3;}
.sec_table h2 {  word-break: keep-all;  text-align: center;    font-size: 20rem;    font-weight: 600;    color: #3e2723;    margin-top: 0;    margin-bottom: 5px;}
.sec_table .subtitle {    text-align: center;    font-size: 14rem;    color: #795548;    margin-bottom: 25px;}
.sec_table h3 { word-break: keep-all;   font-size: 18rem; font-weight:600;   color: #4e342e;    border-left: 4px solid #8d6e63;    padding-left: 10px;    margin-top: 35px;    margin-bottom: 15px;}

.brown-table {    width: 100%;    border-collapse: collapse;    margin-bottom: 10px;    border-top: 2px solid #5d4037;}
.brown-table th {    background-color: #6d4c41;     color: #ffffff;    font-weight: 600;    padding: 12px 8px;    font-size: 14rem;    border: 1px solid #5d4037;}
.brown-table td { word-break: keep-all;  font-weight:500;  padding: 10px;    font-size: 14rem;    color: #333;     border: 1px solid #efebe9;    text-align: center;}

.brown-table tbody tr:nth-child(even) {    background-color: #fdfbf9;}
.text-left {    text-align: left !important;    padding-left: 15px !important;}
.text-right {    text-align: right !important;    padding-right: 15px !important;}
.font-code {    color: #8d6e63;    font-weight: bold;}
.font-price {    font-weight: 600;    color: #3e2723;}
.brown-table .doc-list {    margin: 0;    text-align: left;}
.brown-table .doc-list dd { display:block;   margin-bottom: 4px;}

@media all and (max-width: 650px){
    .sec_table {padding: 30px 10px;  }
	.sec_table h2 { font-size: 16rem;}
	.sec_table .subtitle {  font-size: 12rem;  }
	.sec_table h3 {    font-size: 15rem;}
	.brown-table th {padding: 12px 0px;   font-size: 11rem;  }
	.brown-table td {padding: 10px 0;   font-size: 11rem;  }
}