
@import url('http://fonts.googleapis.com/earlyaccess/notosanskr.css');
@import url('http://fonts.googleapis.com/css?family=Noto+Sans');
@import url('http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css');

*{letter-spacing:-0.05em;}

/* 웹폰트 */
@font-face {
    font-family: 'Spoqa Han Sans';
    font-weight: 700;
    src: local('Spoqa Han Sans Bold'),
    url('/web/css/webfont/SpoqaHanSansBold.woff2') format('woff2'),
    url('/web/css/webfont/SpoqaHanSansBold.woff') format('woff'),
    url('/web/css/webfont/SpoqaHanSansBold.ttf') format('truetype');
}

@font-face {
    font-family: 'Spoqa Han Sans';
    font-weight: 400;
    src: local('Spoqa Han Sans Regular'),
    url('/web/css/webfont/SpoqaHanSansRegular.woff2') format('woff2'),
    url('/web/css/webfont/SpoqaHanSansRegular.woff') format('woff'),
    url('/web/css/webfont/SpoqaHanSansRegular.ttf') format('truetype');
}

@font-face {
    font-family: 'Spoqa Han Sans';
    font-weight: 300;
    src: local('Spoqa Han Sans Light'),
    url('/web/css/webfont/SpoqaHanSansLight.woff2') format('woff2'),
    url('/web/css/webfont/SpoqaHanSansLight.woff') format('woff'),
    url('/web/css/webfont/SpoqaHanSansLight.ttf') format('truetype');
}

@font-face {
    font-family: 'Spoqa Han Sans';
    font-weight: 100;
    src: local('Spoqa Han Sans Thin'),
    url('/web/css/webfont/SpoqaHanSansThin.woff2') format('woff2'),
    url('/web/css/webfont/SpoqaHanSansThin.woff') format('woff'),
    url('/web/css/webfont/SpoqaHanSansThin.ttf') format('truetype');
}


html,  body{padding:0; margin:0; font-family:'Spoqa Han Sans', 'Noto Sans KR', sans-serif; font-size:18px;}
p{margin:0;}
ul{padding:0; margin:0;}
li{list-style:none;}
a{text-decoration:none;}
button{ outline:none; cursor:pointer;}

/* header */
#head{width:100%; height:180px; background:#fff;position:fixed; z-index:99999999; border-bottom:1px solid #e1e1e1;}
#head .top{width:1200px; height:120px; background:#fff; margin:0 auto; position:relative;}
#head .top .call{text-transform:uppercase; top:25px; position:absolute;}
#head .top .call span{color:#39afcc; font-family: 'Noto Sans', sans-serif; font-size:1.2em;}
#head .top .call p{color:#45637d; font-size:30px; font-weight:bold;}
#head .top .logo {display:flex; height:120px; justify-content:center; align-items:center;}
#head .top .smap{
	width:60px; height:60px; background:url(../image/smap_img_off.jpg)no-repeat; position:absolute; right:0; top:30px;
	cursor:pointer; transition: all 0.5s ease 0.1s;
}
#head .top .smap:hover{background:url(../image/smap_img_on.jpg)no-repeat;}

#head .gnb{width:100%; height:60px; border-top:1px solid #d7d7d7; background:#fff; box-sizing:border-box;}
#head .gnb ul{width:1020px; margin:0 auto;}
#head .gnb ul li.first_depth{float:left; width:170px;}
#head .gnb ul li.first_depth a{
	float:left; width:170px; background:#fff; text-align:center; line-height:56px; font-size:18px; color:#363636;
}
#head .gnb ul li.first_depth:hover{border-bottom:3px solid #4271c0;}

/*nav*/
#nav_wrap{ width:100%; position:relative; /*100%2�ܸ޴� �ٽɺκ�!!*/ z-index:10;} 
#nav_wrap>nav{width:910px; height:59px; margin:0 auto; background-color:#fff; }	/*진료예약 1030 */

nav>ul>li{float:left; height:60px; margin:0 49px;}
nav>ul>li>.hv{height:60px; line-height:60px; color:#363636; text-align:center;}			
nav ul li .hv a{padding:20px 0 16px; color:#363636; font-size:1em;}/*hover�ÿ� borderȿ������ �е��ֱ�*/
/*nav ul li span{margin-right:124px;}/*���� ��޴����� ����
nav ul li:last-of-type span{margin-right:0;}*/
	
			
nav ul li .drop{
	position:absolute; /*100%2�ܸ޴� �ٽɺκ�!!*/
	width:100%; left:0; top:60px; /*nav_wrap(�θ�)�������� ���������� 60px(�θ����)������*/ 
	background:rgba(66,113,192,0.9); opacity:0;
	overflow:hidden;
	height:0 ;
}

/*nav ul li:hover .drop{display:block;}*/
nav ul li:hover .hv a{color:#000;} 
nav ul li .hv a:hover{border-bottom:2px solid #4271c0; color:#4271c0;}



.dropin{width:1200px; margin:0 auto;}

nav ul li .dropmenu{float:left; top:0;} 
nav ul li .dropmenu > ul{float:left; display:flex; align-items:center; height:200px;}
nav ul li .dropmenu > ul li{margin-right:50px; width:200px;}
nav ul li .dropmenu > ul li:last-of-type{margin-right:0;}
/*��Ӹ޴��ȿ� ���θ޴� ������ div�� �������ֱ� ������ float:left�� �ι� �����������. div�� ul��*/


/* ��Ӹ޴�css*/
.dropmenu .gnb_tit{
	float:left; font-size:30px; font-weight:400; color:#fff; height:200px; width:155px; display:flex; align-items:center;
	border-right:1px solid rgba(255,255,255,0.3); margin-right:45px;
}
.dropin p a{color:#fff; font-weight:400; font-size:1.1em; }
.dropin p .arrow{color:#bbcb43; font-weight:bold; margin-right:0;}
.dropin .subm_txt{font-size:0.8em; color:rgba(255,255,255,0.6); line-height:20px !important; display:inline-block; margin-right:0;}
.dropin ul li a{display:inline-block; margin-bottom:7px;}
.dropin ul li a:hover{text-decoration:underline; color:#fff;}

nav ul li .dropmenu{margin:40px 0;}

	/* ����ȳ� gnb */
.dropmenu p.two_ex{display:inline-block; position:absolute; margin-top:25px;}
.dropmenu p.two_ex:hover{text-decoration:underline; color:#fff;}

.dropmenu .two_dep{font-size:18px; color:#fff;}
.dropmenu li.thr_dep, .dropmenu li.thr_dep a{color:#fff; font-size:15px;}

.dropmenu .diagnosis01{display:block; margin:-25px 0 0 110px;}
.dropmenu .diagnosis01 li{float:left; width:140px; margin-right:0;}
.dropmenu .diagnosis01 li a{font-size:1.1em; opacity:0.7; font-weight:300; letter-spacing:-0.03em;}
.dropmenu .diagnosis01 li a .s_arrow{color:#bbcb43;}
.dropmenu .diagnosis01 li a:hover{opacity:1;}
/* nav// */


/* footer */
#footer{width:100%; height:170px; background:#f1f1f1;}
#footer .footer_con{width:1200px; margin:0 auto; padding:30px 0;}
#footer .footer_con .logo {display:flex; height:110px; align-items:center; float:left;}
#footer .footer_con .txt_box{margin-left:50px; float:left;}
#footer .footer_con .txt_box .terms_box{font-size:0.8em;}
#footer .footer_con .txt_box span{margin:0 5px; color:#ccc;}
#footer .footer_con .txt_box .terms_box a{color:#898989;}
#footer .footer_con .txt_box .terms_box a:hover{text-decoration:underline;}
#footer .footer_con .txt_box .info_txt{color:#898989; line-height:1.8; font-size:13px; margin-top:17px;}
#footer .footer_con .txt_box .copy{color:#c2c2c2; font-size:12px; margin-top:10px;}
#footer .footer_con .family_site{ float:right; display:flex; height:110px; align-items:center;}
#footer .footer_con .family_site select{
	border:1px solid #ccc; width:200px; height:50px; background:#f1f1f1; color:#959595; padding:0 10px;
	-webkit-appearance: none; /* 화살표 없애기 for chrome*/
    -moz-appearance: none;    /* 화살표 없애기 for firefox*/
	appearance: none;         /* 화살표 없애기 공통*/
	background: url('/web/image/family_arrow.png') no-repeat 95% 50%; /* 화살표 아이콘 추가 */  
}
#footer .footer_con .family_site .nopay_btn{background:url('/web/image/main/nopay_btn.jpg'); border:0; width:140px; height:50px; margin-right:10px; text-indent:100%; white-space:nowrap; overflow:hidden; font-size:0px;}

select::-ms-expand {
   display: none;            /* 화살표 없애기 for IE10, 11*/
}


/* 진료안내 좌측퀵메뉴 */
.diagnosis_side{    
	position: absolute;
    padding: 20px;
    background: #328DDC;
    color: white;
    font-weight: bold;
    z-index: 99999; 
    left:0;
    top: 30%;
    cursor: pointer;
	border-radius:0 10px 10px 0;
	box-shadow:-2px 8px 17px 2px rgba(0,0,0,0.2);
}
.diagnosis_side ul{
	width: 220px;
    background: /*#39AFCC*/#fff;
    position: absolute;
    left: -220px;
    top: 0;
	box-sizing:border-box;
	border-radius:0 0 10px 0;
	box-shadow:-2px 8px 17px 2px rgba(0,0,0,0.2);
} 
/*
.diagnosis_side li{ border-bottom:1px solid rgba(255,255,255,0.3); padding:10px 0px;}
.diagnosis_side li a{color:#fff; font-weight:400; font-size:16px; transition:all 0.5s;}
.diagnosis_side li:hover a{color:rgba(255, 240, 182,1); font-weight:500;}
.diagnosis_side li:last-child{ border:none;}*/
.diagnosis_side li{ border-bottom:1px solid rgba(0,0,0,0.1); padding:12px 0px; background:#fff;}
.diagnosis_side li a{color:#555; font-weight:400; font-size:16px; transition:all 0.5s;}
.diagnosis_side li:hover{background:#39AFCC;}
.diagnosis_side li:hover a{color:rgba(255, 240, 182,1); font-weight:500;}
.diagnosis_side li:last-child{ border:none; border-radius:0 0 10px 0;}
/* 진료안내 좌측퀵메뉴// */


/* 사이트맵 */
.siteMap{
	background-color : rgba(0,0,0,0.8);
	z-index : 99999999;
	position : fixed;
	width : 100%;
	height : 100%;
	display:none; 
	transition:all 0.5s;
}
.siteMenu{    
	display:none;
	z-index: 9999999999;
    background: #39afcc;
    width: 100%;
    margin: 70px auto;
    height: 750px;
	transition:all 0.5s;
	padding:110px 50px 150px;
	box-sizing:border-box;
}
.siteMenu .close{
	font-size: 30px;
    font-weight: bold;
    margin-right: 10px;
    position: absolute;
    margin-top: -70px;
    left: 50%;
    color: white;
	transition:all 0.5s;
}
.siteMenu ul{ width: 100%; float: left; height: 80px; display:flex; align-items:center; border-bottom: 1px solid rgba(255,255,255,0.4);}
.siteMenu ul a{ color:rgba(255,255,255,0.8); transition:all 0.5s;}
.siteMenu ul a:hover{text-decoration:underline; color:#fff;}
.siteMenu ul span{ float: left; margin-right: 35px; width:200px; font-weight: 400;}
.siteMenu ul span a{font-size: 25px; color:rgba(255, 240, 182, 0.94); transition:all 0.5s;}
.siteMenu ul li{ width: auto; float: left; text-align: center; margin-right: 13px;}
.siteMenu ul:last-of-type{border:0;}


