/*  영역  */	
body {font-family: 'Noto Sans KR', dotum, sans-serif;font-size: 16px;font-weight: 400;letter-spacing: -0.04em; }
input, button, select {margin: 0;padding: 0;}
input[type="submit"]{cursor: pointer;}
button {cursor: pointer;}

/* 길이 자르기 */
.ellips_ {overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}

/*  전체 영역  */	
#wrap {width: 100%;min-width: 1680px;height: auto !important;height: 100%;min-height: 100%;overflow-y: hidden;font-family: 'Noto Sans Kr';letter-spacing: -0.04em;}

/* TM */	
.tm {float: right;position: absolute;z-index: 1;right: 50px;top: 30px;color:#fff;}
.tm a {color: #000;text-decoration: none;}
.tm a:hover {color: #000;text-decoration: none;}
.tm a svg {margin: 0 5px;}

.span_ll {padding: 0 5px;font-family: 'dotum';font-size: 14px;font-weight:normal;}

/* 사이트맵 */
.btn-open-popup {display: inline-block;position: absolute;z-index: 99;float: right;width: 50px;right: 30px;margin: 32px 0 0 22px;cursor: pointer;}
.gnb_menu_btn {position: relative; }

/* 메인영상 */
.video_wrap { display:inline-block; width:100%; height:1245px; padding-bottom: 56.25%;  /* 16:9 비율을 유지하기 위해 */ position:relative; overflow:hidden; }
.video { display:inline-block; position:absolute; z-index:1;  width:100%; height:100%; margin:0 auto; left:0; right:0; top:0; bottom:0; }
.video_bg { display:block;width:100%; height:100%; position:absolute; z-index:1; background-image: url('../images/MainVisual/bg_mv.png');}
.video_txt { width:100%; text-align:center; position:absolute; z-index:2; top:38%; font-family:'SOGANG'; color:#fff; line-height:70px;}
.video_txt { opacity: 0; font-size:10px; transform: translateY(-60px); /* 위에서 시작 */ transition: all 1s ease;}
.video_txt.show { opacity: 1; font-size:40px; transform: translateY(0); /* 제자리로 이동 */}

@media only screen and (min-width:1024px){
	.video_wrap { min-width:1680px; height:0; padding-bottom: 56.25%; top:0px; }
}


/* 진료과목 */
.sec1_container {width: 100%;height: 710px;position: relative;text-align: center;margin-top: 40px;font-family: 'Noto Sans Kr'}
.sec1_wrap {display: inline-block:;width: 1700px;margin: 0 auto}
.sec1_wrap .box {width: 400px;text-align: left}
.sec1_wrap .box > p:nth-child(1) {font-size: 45px;font-weight: 500;font-family: 'SOGANG'; }
.sec1_wrap .box > p:nth-child(2) {font-size: 18px;font-weight: 300;line-height: 28px;}
.sec1_wrap .box1 {}
@media only screen and (max-width:1921px){
	.sec1_wrap {display: inline-block:;width: 1400px;margin: 0 auto}
}

.slide-wrap {float: right;width: 1700px;margin-top: -105px}
.slide {position: relative;right: 0px}
.slide .slick-list {margin:0}
.slick-slide {margin:0}
.item {width:550px;margin: 0 5px;text-align:left;cursor: pointer}
.item > p:nth-child(2) {font-family: 'Noto Sans Kr';font-size: 25px;font-weight: 600;padding-top: 25px}
.item > p:nth-child(3) {font-family: 'Noto Sans Kr';font-size: 18px;font-weight: 300;line-height: 28px;padding-top: 20px}

@media only screen and (max-width:1921px){
	.slide {position: relative;right: -430px}
}
@media only screen and (max-width:1681px){
	.slide {position: relative;right: -480px}
}

#slider1 .slick-dots {text-align: left; margin-top: 50px; }
#slider1 .slick-dots li {display: inline-block;margin: 0; }
#slider1 .slick-dots li button {font-size: 0;line-height: 0;width: 150px;height:4px;border: none;background-color: #eee;border-radius: 0%;cursor: pointer}
#slider1 .slick-dots li.slick-active button {background-color: #333}
#slider1 .slick-dots li button:hover {background-color: #333}

/* 해온치과의 특별함 */
.sec2_container {width: 100%;height: 1050px;position: relative;text-align: center;padding-top: 120px;font-family: 'Noto Sans Kr';background-color: #f5f5f5}
.sec2_container > p:nth-child(1) {font-size: 20px;font-weight: 300}
.sec2_container > p:nth-child(2) {font-size: 45px;font-family: 'SOGANG';line-height: 90px;}
.sec2_container > p:nth-child(3) {font-size: 20px;font-weight: 300;line-height: 28px}
.sec2_wrap {display: inline-block:;width: 1380px;margin: 0 auto}

.sec2_acco {}
.sec2_acco .acco_wrap {display:flex;margin-top: 60px}
.sec2_acco .acco_wrap .box {width: 100%;height: 550px;position: relative;cursor: pointer;transition: 0.8s;border-radius:10px;}
.sec2_acco .acco_wrap .box:after {content:'';display: block;width: 100%;height: 100%;background: rgba(0 0 0 / 55%);position: absolute;top: 0;left: 0;transition: 0.3s;opacity:0;border-radius:10px;}
.sec2_acco .acco_wrap .box:before {content:'';display: block;width: 100%;height: 550px;position: absolute;bottom: 0;left: 0;opacity: 0;transition: 0.3s}
.sec2_acco .acco_wrap .box + .box {margin-left: 20px}
.sec2_acco .acco_wrap .box.big {width: 100%}
.sec2_acco .acco_wrap .box.big:before {transition: 0.3s;opacity: 1}
.sec2_acco .acco_wrap .box.small { width: 490px;transition: 0.8s; position: relative;}
.sec2_acco .acco_wrap .box.small:after {transition: 0.8s;opacity: 1}
.sec2_acco .acco_wrap .bg1 {background-image:url("../images/sec2_img1.png");background-position: center;background-size: cover}
.sec2_acco .acco_wrap .bg2 {background-image:url("../images/sec2_img2.png");background-position: center;background-size: cover}
.sec2_acco .acco_wrap .bg3 {background-image:url("../images/sec2_img3.png");background-position: center;background-size: cover}
.sec2_acco .acco_wrap .txt_wrap { width:490px; position: absolute;bottom: 50px;left: 45px;text-align: left;transition: 0.5s}
.sec2_acco .acco_wrap .txt_wrap > p:nth-child(1) {display: inline-block; width:150px; line-height:40px; text-align:center;font-family: 'Noto Sans Kr';color: #fff;font-size: 18px;font-weight: 400;text-transform:initial;background:#009FB8;border-radius:5px;}
.sec2_acco .acco_wrap .txt_wrap > p:nth-child(2) { padding: 5px 0 15px 0;font-family: 'Noto Sans Kr';color:#fff;font-size: 23px;font-weight: 500;letter-spacing:-0.05em;}
.sec2_acco .acco_wrap .txt_wrap > p:nth-child(2).txt_size {font-size: 23px}
.sec2_acco .acco_wrap .txt_wrap > p:nth-child(3) {font-family: 'Noto Sans Kr';color: #fff;font-size: 18px;font-weight: 300;letter-spacing:-0.05em;}
.sec2_acco .acco_wrap .txt_wrap > p:nth-child(3).txt_size {position:absolute; margin-top:5px; left:72%;font-family: 'roboto';color: #fff;font-size: 20px;}
.sec2_acco .acco_wrap .hover {bottom: 40px;opacity: 0;transition: 0.5s}
/*.sec2_acco .acco_wrap .box.big .txt_wrap {opacity: 0;transition: 0.5s}*/
.sec2_acco .acco_wrap:hover .txt_wrap {opacity: 0;}
.sec2_acco .acco_wrap .box.big .hover {opacity: 1;transition: 0.5s}

/* 걸어온길 */
.sec3_container { display: none; width: 100%;height: 850px;position: relative;text-align: center; margin-top:-5px; padding-top: 200px;font-family: 'Noto Sans Kr';background:url('../images/sec3_bg.jpg') no-repeat center center;background-size:cover;}
.sec3_container > p:nth-child(1) { text-align:center; font-family:'SOGANG'; font-size:60px; color:#fff; font-weight:500;letter-spacing:-0.05em; }
.sec3_wrap { display: inline-block; width: 1370px; height:220px; margin:0 auto; margin-top:150px; border-left:1px #ddd solid;}
.sec3_wrap .box { float:left; width: 455px; margin:0; text-align:center;  border-right:1px #ddd solid;}
.sec3_wrap .box > p:nth-child(1) { text-align:center; font-family:'Noto Sans Kr'; font-size:25px; color:#fff; font-weight:400;letter-spacing:-0.05em; }
.sec3_wrap .box > p:nth-child(2) { text-align:center; padding:30px 0; font-family:'NotoSerifKR-Bold'; font-size:70px; color:#fff; font-weight:300;letter-spacing:-0.05em; }
.sec3_wrap .box > p:nth-child(3) { text-align:center; font-family:'Noto Sans Kr'; font-size:22px; color:#fff; font-weight:300;letter-spacing:0.03em; }

/* 의료진 소개 */
.sec4_container {width: 100%;height:1000px;position: relative;text-align: center;padding-top: 100px;font-family: 'Noto Sans Kr';background:#f5f5f5;}
.sec4_wrap {display: inline-block;width: 1400px;margin: 0 auto}
.sec4_wrap .box {float: left;width: 550px;text-align: left;padding:90px 0 0;}
.sec4_wrap .box > p:nth-child(1) { font-size: 22px;font-weight: 400; }
.sec4_wrap .box > p:nth-child(1) strong { margin-right:10px; font-family:'SOGANG'; font-size: 60px;font-weight:normal;}
.sec4_wrap .box > p:nth-child(2) {font-size: 20px;font-weight: 300;line-height: 80px}
.sec4_wrap .box > p:nth-child(3) {padding-top: 0px;font-size: 20px;font-weight: 300;line-height: 30px}
.sec4_wrap .box1 {float: left;width: 850px;text-align: left;bottom: 0}

/* 시스템 */
.sec5_container {width: 100%;height:1050px;position: relative;text-align: center;padding-top: 130px;font-family: 'Noto Sans Kr';background:url('../images/sec5_bg.jpg') no-repeat center center;background-size:cover;}
.sec5_wrap {display: inline-block;width: 1500px;margin: 0 auto}
.sec5_wrap .box {float: left;width: 1250px;text-align: center;}
.sec5_wrap .box > p:nth-child(1) { float: left;width:380px; font-size: 20px;font-weight: 300;line-height: 30px;letter-spacing:-0.05em; }
.sec5_wrap .box > p:nth-child(1) strong { font-size: 23px;font-weight:600;line-height: 70px;}
.sec5_wrap .box > p:nth-child(2) { float: left;margin-top:100px; width:380px; font-size: 20px;font-weight: 300; line-height: 30px;letter-spacing:-0.05em; }
.sec5_wrap .box > p:nth-child(2) strong { font-size: 23px;font-weight:600;line-height: 70px;}
.sec5_wrap .box > p:nth-child(3) { float: left;margin-top:200px; width:380px; font-size: 20px;font-weight: 300;line-height: 30px;letter-spacing:-0.05em;  }
.sec5_wrap .box > p:nth-child(3) strong { font-size: 23px;font-weight:600;line-height: 70px;}
.sec5_wrap .box1 {float: right; position:absolute; left:52%;width: 660px;text-align: right;}
.sec5_wrap .box1 > p:nth-child(1) { font-family:'SOGANG'; font-size: 55px; }
.sec5_wrap .box1 > p:nth-child(2) {padding-top:15px; font-size: 20px;font-weight: 300;line-height: 30px}

/* 서브 비쥬얼 */
#visual_sub {display: inline-block;position: relative;z-index: 1;width: 100%;margin-top:-100px }
.VisualTxt { position: absolute; top: 190px; width: 100%; text-align: center; z-index: 2; }
.VisualTxt > p:nth-child(1) {font-family: 'Noto Sans KR';color: #000;font-size: 18px;font-weight: 300;line-height: 30px;opacity:1; /*text-shadow:1px 1px 1px rgb(0,0,0 0.5);*/}
.VisualTxt > p:nth-child(2) {font-family: 'SOGANG';color: #000;font-size: 45px;font-weight: normal;line-height: 90px;letter-spacing: -0.06em;opacity:1; /*text-shadow:1px 1px 1px rgb(0,0,0 0.5);*/}
.VisualTxt > p:nth-child(3) {font-family: 'Noto Sans KR';color: #000;font-size: 18px;font-weight: 300;line-height: 20px;opacity:1; /*text-shadow:1px 1px 1px rgb(0,0,0 0.5);*/}
.visual_sub_wrap {position: relative;overflow: hidden;}
.visual_sub_wrap .back_img { position: relative; width: 100%; transform: scale(1.1); filter: blur(10px); transition: all 1s cubic-bezier(0.3, 0, 0.5, 1); z-index: 1; }
.visual_sub_wrap.on .back_img { transform: scale(1); filter: blur(0); }
.VisualTxt_a { position: absolute; top: 130px; width: 100%; text-align: center; z-index: 2; /*관리자페이지*/}


/* 서브 주메뉴 */
#snb_container {display: inline-block;position: relative;z-index: 1;width: 100%;height: 50px;margin: 30px 0 10px 0;text-align:center}
#snb_wrap {width: 1300px;margin: 0 auto;text-align: center}

/* 서브 타이틀 */
.snb_tit { width:100%; margin:0 auto; text-align:center; margin-top:70px; }
.snb_tit .bo_tit { display:inline-block; width:100%; font-family: 'SOGANG';color: #000;font-size: 40px;font-weight: 500; line-height:60px;  }
.snb_tit .bo_line { display:inline-block; width:50px; height:1px; margin:0 auto; background:#444; } 

/*  서브 내용 부  */
#container{ display:inline-block; position:relative; z-index:1; width:100%; text-align:center; top:0; }
#board { display:block; position:relative; top:0; text-align:center; }
#board .bo_webpage { z-index:1; width:100%; min-height:700px; margin-top:0px; height:auto !important; } 
#board .bo_board { width:1300px; min-height:700px; padding:60px 0 70px 0; text-align:left; margin:0 auto; height:auto !important; } 


/* COPYRIGHT */
#foot {display: flex;width: 100%;background: #f5f5f5}
.copyright {width: 1400px;margin: 0 auto;padding: 120px 0}
.cont_left {float: left;width: 750px}
.cont_right {float: right;width: 600px; padding-left:20px;}
.cont_right .hname {font-size: 15px;}
.cont_right .hname strong { font-family: 'SOGANG';font-size: 32px;font-weight:normal;line-height:45px;}
.cont_right .memo {padding-top:20px;font-size: 18px;font-weight:300}
.cont_right .tel {display: inline-block;width: 100%;margin-top: 30px}
.cont_right .tel > p:nth-child(1) {float: left;width: 120px;font-size: 23px;font-weight: 500;line-height:45px;}
.cont_right .tel > p:nth-child(2) {float: left;font-size: 40px;font-weight: bold; font-family: 'arial';}
.cont_right .time {display: inline-block;width: 100%;margin-top: 15px}
.cont_right .time > p:nth-child(1) {float: left;width: 115px;font-size: 23px;font-weight: 500}
.cont_right .time > p:nth-child(2) {float: left;font-size: 18px;font-weight: 300;line-height: 27px;letter-spacing: -0.02em}
.cont_right .time > p:nth-child(2) span {font-weight: 400}
.cont_right .add {display: inline-block;width: 100%;margin-top: 20px}
.cont_right .add > p:nth-child(1) {float: left;width: 120px;font-size: 23px;font-weight: 500}
.cont_right .add > p:nth-child(2) {float: left;font-size: 18px;font-weight: 300;line-height: 27px;}

#tail {display: inline-block;width: 100%;text-align:center;padding: 50px 0;background: #222}
.tail_wrap {width: 1400px;margin: 0 auto;text-align: left;letter-spacing: 0}
.tail_logo {float:left;width:260px}
.tail_add {float:left;width:1040px;font-size: 14px;color: #fff;line-height: 27px}
.tail_menu {padding: 0 0 13px;font-size: 14px;font-weight: 300}
.tail_menu a {color: #fff;text-decoration: none; }
.tail_line {display: inline-block;color: #ccc;line-height: 12px;margin: 0 9px}

/* 우측 퀵메뉴 */
.layer-sns { width:170px; float:right; position:fixed; z-index:3; right:20px; bottom:130px; animation: ani 0.8s infinite alternate; }
.layer-sns a { display:block; margin:0 0 8px 0; padding:0 0 0 15px; width:170px; height:40px; line-height:40px; font-size:15px; border:1px #aaa solid; background:#fff; border-radius:40px; transition: all .5s ease;}
.layer-sns a:hover {  background:#000; color:#fff; border:1px #000 solid; text-decoration:none; transition: all .5s ease; }
.layer-sns a img { margin:0 6px 0 0; vertical-align:middle; }
.layer-sns a:hover img { filter: brightness(1000%); vertical-align:middle; }
@keyframes ani {
  from { transform: translateY(6%); }
  to { transform: translateY(0%); }
}

/*  로그인/회원가입 head  */
#head_content {display: block;position: relative;width: 100%;top:0px;text-align: center; border-top:0px #ccc solid; }
#head_content #head {width: 55%;margin: 0 auto}
#head_content #head .cont { width: 100%;min-height:750px;text-align: left;margin:0 auto;margin-top:1px; padding:20px 0 70px 0;}

/* Go Top 버튼 */
.go-top { position: fixed; z-index:3; bottom: 60px; right: 75px; text-align:center;font-weight:bold; width:45px; height:45px; line-height:45px;background: #02A9C1; color: #fff; border-radius: 45px; font-size: 14px;opacity: 0;   pointer-events: none; /* 안 보일 때 클릭 방지 */ transition: opacity 0.6s ease, transform 0.6s ease; transform: translateY(20px); transition: all .5s ease;}
.go-top.show {color: #fff; opacity: 1; pointer-events: auto; transform: translateY(0); }
.go-top:hover { bottom: 55px; right: 70px; color: #fff; text-align:center;width:55px; height:55px; line-height:55px;  text-decoration: none; transition: all .5s ease; }
.go-top span { display: inline-block; transition: transform 0.3s ease;}
.go-top:hover span { transform: translateY(-10px);}

/* 게시판 카테고리 통합 */
#bo_cate {width: 20%;height: 40px;line-height: 38px; margin-bottom: 28px; border-bottom: 0px #ccc solid; }
#bo_cate h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
#bo_cate ul { display: flex;width: 100%;height: 40px;padding: 0;margin: 0;}
#bo_cate li {flex: 1;list-style: none;height: 40px;display: flex; }

#bo_cate li a {flex: 1;display: flex;align-items: center;justify-content: center; background:#eee;font-size:17px;padding: 0 10px;text-align: center;cursor: pointer;transition: 0.3s;box-sizing: border-box;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
#bo_cate li a:focus, 
#bo_cate li a:hover, 
#bo_cate li a:active {background: #273CA5;color: #fff;text-decoration: none;}
#bo_cate #bo_cate_on {background: #273CA5;color: #fff;}
#bo_cate > ul > li::after { display:none;}

/* 게시판 검색창 통합 */
#bo_sch input[type=text]:focus {
border: 0px !important;
}
#bo_sch select:focus {
border: 0px !important;
}


/* 버튼 */
.btn, a.btn{ 
-webkit-transition: background-color 0.3s ease-out;
-moz-transition: background-color 0.3s ease-out;
-o-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;}

.btn3, a.btn3{ 
-webkit-transition: background-color 0.3s ease-out;
-moz-transition: background-color 0.3s ease-out;
-o-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;}

.btn-more a {position:relative;display:inline-block;overflow:hidden;color:#fff;-webkit-transition: all .8s ease;-moz-transition: all .8s ease;transition: all .8s ease}
.btn-more a:before {content:"";position:absolute;top:0;left:0;bottom:0;right:-120px;display:block;border-right:0px solid transparent;border-bottom:100px #eee solid;z-index:-1;transform: translateX(-100%);-webkit-transition: all .8s ease;-moz-transition: all .8s ease;transition: all .8s ease}
.btn-more a:hover:before {transform: translateX(0)}

/* 더보기 버튼 공통 */
.btn_more:hover .toggler{opacity:1;
	transform:rotate(360deg);
	-webkit-transform:rotate(360deg);
	-moz-transform:rotate(360deg);
	-o-transform:rotate(360deg));
	-ms-transform:rotate(360deg);
}

.toggler{ display:inline-block; position:absolute;z-index:20; margin-left:660px; top:55px; width:40px;height:40px; border:none;}
.toggler{
	-webkit-transform:rotate(0deg);
	-moz-transform:rotate(0deg);
	-ms-transform:rotate(0deg);
	-o-transform:rotate(0deg);
	transform:rotate(0deg);
	-webkit-transition:all .s ease;
	-moz-transition:all .6s ease;
	-ms-transition:all .6s ease;
	-o-transition:all .6s ease;
	transition:all .6s ease;
}
.toggler:before,.toggler:after{content:'';display:block;position:absolute;background-color:#000; }
.toggler:before{ top:0px;left:50%;margin-left:-2px;width:3px;height:100%;}
.toggler:after{ left:0px;top:50%;margin-top:-2px;width:100%;height:3px;}


