@charset "utf-8";

/*==========================================================================
Layout Style
==========================================================================*/
#wrap { position:relative; width:100%;  padding-top:110px;  }
#header { position:absolute; z-index:6666;top:0; width:100%; overflow:hidden; padding:45px 0 6px;background:url(../images/common/htop_bg.png) repeat-x; }
		
#header h1.logo { position:absolute; left:50%; top:46px; z-index:9999; margin:0 0 0 -498px; }
#header div.quick { position:absolute; top:0px;height:27px;left:50%; margin:0 0 0 330px; width:160px; }
#header div.quick .menu{position:absolute;top:0px; right:0px; width:400px;height:30px; color:#fff;  }
#header div.quick .menu ul {float:right;margin:0 0px 0 0}
#header div.quick .menu ul li{float:left;display:inline-block; padding-left:15px; font-size:.90em; margin:4px 10px 0 6px; background:url(../images/common/bar.gif) no-repeat 0px 5px;}
#header div.quick .menu ul li:first-child{background:none;}
#header div.quick .menu ul li a{color:#999; }
#header div.quick .menu:after{content:"";display:block; clear:both;}
#header div.quick .menu .icon {position:absolute; top:0; right:0; z-index:3333}

#header .subLine { position:absolute; left:0; bottom:0; z-index:2; display:block; width:100%; height:6px; background:url(../images/common/header_bg.png) 0 100% repeat-x; } /* 스크립트 추가영역 */
#header .gnbWrap { position:relative; width:100%; overflow:hidden;  background:url(../images/common/header_bg.png) 50% 65px repeat-x;  }
#header .gnbWrap .subLine { position:absolute; left:0; top:65px; z-index:2; display:block; width:100%; height:6px;} /* 스크립트 추가영역 */
#header .gnb { width:620px; height:65px; margin:0 auto; overflow:hidden; padding-left:390px; border-bottom:0px solid #f00  }
#header .gnb strong { display:block; }
#header .gnb strong a { display:block; height:65px; overflow:hidden; letter-spacing:-1000px; color:#fff; background:url(../images/common/gnb_menu.png) 0 0 no-repeat; }
#header .gnb .active strong a, #header .gnb strong a:hover, #header .gnb strong a:focus { height:62px; border-bottom:3px solid #1474d3;}
#header .gnb li.g1 strong a { width:65px; background-position:-0 0;  }
#header .gnb li.g2 strong a { width:75px; background-position:-150px 0; }
#header .gnb li.g3 strong a { width:65px; background-position:-300px 0; }
#header .gnb li.g4 strong a { width:90px; background-position:-450px 0; }
#header .gnb li.g5 strong a { width:60px; background-position:-600px 0; }
#header .gnb li.g1.active strong a { background-position:0 -65px; }
#header .gnb li.g2.active strong a { background-position:-150px -65px; }
#header .gnb li.g3.active strong a { background-position:-300px -65px; }
#header .gnb li.g4.active strong a { background-position:-450px -65px; }
#header .gnb li.g5.active strong a { background-position:-600px -65px; }
#header .gnb > li { display:none; float:left;padding-left:28px; padding-right:28px; background:url("") 0 31px no-repeat; }
#header .gnb > li:first-child { margin-left:0; padding-left:0; background:none; }
#header .gnb li.g1, #header .gnb li.g2, #header .gnb li.g3, #header .gnb li.g4, #header .gnb li.g5, #header .gnb li.g6{ display:block; }
#header .gnb .dep2 { display:block; margin-right:-28px; padding:21px 0 10px; border:0px solid #f00 }
#header .gnb .dep2 > li {margin-bottom:10px; margin-left:-0px;width:80px;}
#header .gnb .dep2 > li.w2 {  }
#header .gnb .dep2 > li.w2 a{letter-spacing:-.10em;}
#header .gnb .dep2 > li a {padding-left:0px;color:#555; font-size:1.05em; line-height:1.3;    letter-spacing:-.05em;  }
#header .gnb .dep2 a.active {  padding-left:0px; color:#000 !important;  }
#header .gnb .dep2 a:hover { color:#333 !important; text-decoration:underline }
#header .gnb .dep3 { display:none; }


/* Main Slider */
.visual_bg { position:relative;width:100%;  height:560px; padding:0; margin:0; background:url(../images/main/visual_bg.png) repeat-x;  overflow:hidden;}
/* main visual */
#visual-wrap{position:relative; z-index:1; min-width:980px; height:560px; }
#visual-wrap .controller{position:absolute; width:11px; height:15px; overflow:hidden; z-index:101; left:50%; top:435px; margin-left:-50px;}
#visual-wrap .controller a{position:absolute; left:0; top:0;display:block; width:11px; height:15px;  font-size:0; line-height:0; color:#e0d6c8; display:none;}
#visual-wrap .controller a.pause.on{background:url(../images/main/btn_stop2.png) no-repeat; display:block;}
#visual-wrap .controller a.play.on{background:url(../images/main/btn_play2.png) no-repeat; display:block;}
#visual-wrap .arrow #prev {display:block;position:absolute;right:50%;top:220px;z-index:10;margin-right:530px;}
#visual-wrap .arrow #next {display:block;position:absolute;left:50%;top:220px;z-index:10;margin-left:520px;}
#mainVisual{height:480px; padding-left:26px; text-align:center;}
#mainVisual p{position:absolute; left:0; top:0; height:450px; width:100%; font-size:0; line-height:0;}
#mainVisual a.page{position:relative; top:435px; z-index:101; display:inline-block; width:13px; height:13px; margin:0 3px; vertical-align:top; font-size:0; line-height:0; color:#826746; background:url(../images/main/btn_imgnavi2.png) no-repeat;}
#mainVisual a.page.active{background:url(../images/main/btn_imgnavi2_on.png) no-repeat !important; width:28px !important; height:13px; color:#981921;}
#mainVisual p#visual01 {z-index:5}
#mainVisual p#visual01 span {display:block;width:100%;height:560px;background:url(../images/main/main_visual01_1.png) no-repeat center bottom;}
#mainVisual p#visual02 span {display:block;width:100%;height:560px;background:url(../images/main/main_visual02_.png) no-repeat center bottom;}


/* Main Contents  */
.container {position:relative; clear:both; width:1225px; margin:20px auto; }

/* 클리닉 바로가기 */
#quick_clinic {position:relative; float:left; width:1225px; height:235px;overflow:hidden;margin:-155px 0 40px 0; z-index:100 }
#quick_clinic #clinic01 a {position:relative; float:left; width:245px; height:235px; background:#eeeff1 url(../images/main/clinic01_off.png) no-repeat center 75px}
#quick_clinic #clinic01 a h2 {width:100%; float:left; margin:30px 0 0; color:#333; text-align:center;  font-size:1.70em; line-height:1.10em; font-weight:bold;}
#quick_clinic #clinic01 a .text {float:left; width:100%; margin:125px 0 0; text-align:center; color:#494a4a; font-size:1.10em; font-weight:bold;}
#quick_clinic #clinic01 a:hover { background:#f97a0d url(../images/main/clinic01_on.png) no-repeat center 75px}
#quick_clinic #clinic01 a:hover h2 {width:100%; float:left; margin:30px 0 0; color:#fff; text-align:center;  font-size:1.70em; font-weight:bold;}
#quick_clinic #clinic01 a:hover .text {float:left; width:100%; margin:125px 0 0; text-align:center; color:#fff; font-size:1.10em; font-weight:bold;}

#quick_clinic #clinic02 a {position:relative; float:left; width:245px; height:235px; background:#d7d8da url(../images/main/clinic05_off.png) no-repeat center 67px}
#quick_clinic #clinic02 a h2 {width:100%; float:left; margin:30px 0 0; color:#333; text-align:center;  font-size:1.70em; line-height:1.10em; font-weight:bold;}
#quick_clinic #clinic02 a .text {float:left; width:100%; margin:125px 0 0; text-align:center; color:#494a4a; font-size:1.10em; font-weight:bold;}
#quick_clinic #clinic02 a:hover { background:#8ec911 url(../images/main/clinic05_on.png) no-repeat center 67px}
#quick_clinic #clinic02 a:hover h2 {width:100%; float:left; margin:30px 0 0; color:#fff; text-align:center;  font-size:1.70em; line-height:1.10em; font-weight:bold;}
#quick_clinic #clinic02 a:hover .text {float:left; width:100%; margin:125px 0 0; text-align:center; color:#fff; font-size:1.10em; font-weight:bold;}

#quick_clinic #clinic03 a {position:relative; float:left; width:245px; height:235px; background:#eeeff1 url(../images/main/clinic03_off.png) no-repeat center 75px}
#quick_clinic #clinic03 a h2 {width:100%; float:left; margin:30px 0 0; color:#333; text-align:center;  font-size:1.70em; line-height:1.10em; font-weight:bold;}
#quick_clinic #clinic03 a .text {float:left; width:100%; margin:125px 0 0; text-align:center; color:#494a4a; font-size:1.10em; font-weight:bold;}
#quick_clinic #clinic03 a:hover { background:#7952b6 url(../images/main/clinic03_on.png) no-repeat center 75px}
#quick_clinic #clinic03 a:hover h2 {width:100%; float:left; margin:30px 0 0; color:#fff; text-align:center;  font-size:1.70em; font-weight:bold;}
#quick_clinic #clinic03 a:hover .text {float:left; width:100%; margin:125px 0 0; text-align:center; color:#fff; font-size:1.10em; font-weight:bold;}


#quick_clinic #clinic04 a {position:relative; float:left; width:245px; height:235px; background:#a2a7b3 url(../images/main/clinic02_off.png) no-repeat center 67px}
#quick_clinic #clinic04 a h2 {width:100%; float:left; margin:30px 0 0; color:#fff; text-align:center;  font-size:1.70em; line-height:1.10em; font-weight:bold;}
#quick_clinic #clinic04 a .text {float:left; width:100%; margin:125px 0 0; text-align:center; color:#fff; font-size:1.10em; font-weight:bold;}
#quick_clinic #clinic04 a:hover { background:#1980c2 url(../images/main/clinic02_on.png) no-repeat center 67px}


#quick_clinic #clinic05 a {position:relative; float:left; width:245px; height:235px; background:#5f636c url(../images/main/clinic04_off.png) no-repeat center 67px}
#quick_clinic #clinic05 a h2 {width:100%; float:left; margin:30px 0 0; color:#fff; text-align:center;  font-size:1.70em; line-height:1.10em; font-weight:bold;}
#quick_clinic #clinic05 a .text {float:left; width:100%; margin:125px 0 0; text-align:center; color:#fff; font-size:1.10em; font-weight:bold;}
#quick_clinic #clinic05 a:hover { background:#da71b1 url(../images/main/clinic04_on.png) no-repeat center 67px}

.m_title {position:relative; float:left; width:100%; font-weight:bold; color:#333; font-size:1.30em;}
.btn_more {float:right; width:20px; height:20px;}
.date {float:right; font-size:1em; color:#888;}

/* 공지사항 */
#notice {position:relative; float:left; width:300px; margin:0 50px 0 80px}
#notice ul {float:left; margin:15px 0 0}
#notice ul li {display:block;float:left; width:235px;line-height:1.20em;margin:0 0 10px 0;  background:url(../images/main/dot.png) no-repeat 0 7px; padding:0 0 0 8px; }
#notice ul li a {color:#555; }


/* Quick_menu */
#quick_m {position:relative; float:left; width:420px; height:95px; background:url(../images/main/quick_m.png) no-repeat 0 top}
#quick_m ul {float:left; margin:10px 0 0 0}
#quick_m ul li {display:inline-block; float:left; width:105px; height:85px;}
#quick_m ul li a {display:inline-block; float:left; width:105px; height:85px;}
#quick_m p {position:relative; float:left; margin:60px 0 0; width:100%; font-weight:bold; color:#555; font-size:1.20em; letter-spacing:-.02em; text-align:center;}

/* 고객센터 */
#cs_bx {position:relative; float:left; width:245px; margin:0 80px 0 50px  }
#cs_bx .tit {position:relative; float:left;font-size:1.25em; font-weight:bold; color:#4a4b4c; margin:0; }
#cs_bx .contact {position:relative; float:left; margin:0px 0 0 0px; width:244px; height:50px; background:url(../images/main/icon_call.png) no-repeat right 0px;}
#cs_bx .num1 {position:relative; float:left; font-size:2.00em; line-height:1.00em; font-weight:bold; color:#f9641b; margin:5px 0 0 0px;}

#cs_bx .time_sch {position:relative; float:left; margin:0px 0 0 0px; width:245px; height:140px; background:url(../images/main/icon_clock.png) no-repeat right 5px;}
#cs_bx .day {position:relative; float:left; width:52px; line-height:1.50em;color:#88817c;}
#cs_bx .w_time {position:relative; float:left;width:160px;line-height:1.50em;color:#88817c;}
#cs_bx .sp01 { letter-spacing:-.02em;}
#cs_bx .text01 {position:relative; float:left; width:240px; color:#88817c; margin:2px 0 0;line-height:1.0em;}



/* Footer */
#footer2 {position:relative;float:left; clear:both;width:100%; height:180px; margin:40px auto 0; background:#3e3e3e}
#footer2 .wrap {position:relative; margin:0 auto; width:980px; }
#footer2 .link {position:absolute;top:20px; right:0;  width:400px /*300px*/}
#footer2 .link ul {float:right}
#footer2 .link ul li {display:inline-block; float:left;  font-size:12px;  background:url(../images/common/ds_line02.png) no-repeat left 4px;padding-left:15px; margin:0 0 0 14px;}
#footer2 .link ul li a {  color:#a3a19f}
#footer2 .link ul li a:hover { color:#fff}
#footer2 .link ul li:first-child { background:none;}

#footer2 .add {position:relative;width:700px; float:left; margin:25px 0 0; clear:both; color:#a0a0a0; line-height:1.90em; font-size:12px; font-family:Dotum; }
#footer2 .copyright {position:relative; float:left; width:980px; margin:25px 0 0; border-top:1px solid #4d4d4d; padding:12px 0 0; color:#7f7f7f}

#footer2 .social {position:absolute; top:50px; right:0; width:35px; height:30px; background:url(../images/common/social.png) no-repeat}
#footer2 .social ul {position:relative; float:right;}
#footer2 .social ul li {display:inline-block; float:left; width:35px; height:34px; margin:0 3px 0 0px; text-indent:-9999px }
#footer2 .social ul li a {text-indent:-9999px }

/*
#footer2 .site {position:absolute; top:5px; right:0px;width:157px; z-index:9999;background: url('../images/common/link_site.gif') no-repeat  0; border:0px solid #f00}
#footer2 .relation_site {position:relative; float:right;width:150px; margin:0px 0px 0 0px;}
#footer2 .relation_site .btn {display:inline-block; width:140px; height:22px; padding:3px 0px 0 15px;  font-size:11px; color:#9e9e9e;}
#footer2 .relation_site .list {position:absolute; bottom:28px; right:0px; width:155px;height:18px; padding:3px 0 3px 0px; background:#fff; border:1px solid #e0e0e0; display:none;}
#footer2 .relation_site .list a {display:block;  color:#999; font-size:11px;}
*/


/* mobile */

@media screen and (min-width:400px) and (min-width:1024px){
    /* Main Contents  */
    .container {position:relative; clear:both; width:980px; margin:20px auto; }
    
    /* 클리닉 바로가기 */
    #quick_clinic {position:relative; float:left; width:980px; height:235px;overflow:hidden;margin:-155px 0 40px 0; z-index:100 }
    #quick_clinic #clinic01 a {position:relative; float:left; width:196px; height:235px;}
    #quick_clinic #clinic02 a {position:relative; float:left; width:196px; height:235px;}
    #quick_clinic #clinic03 a {position:relative; float:left; width:196px; height:235px;}
    #quick_clinic #clinic04 a {position:relative; float:left; width:196px; height:235px;}
    #quick_clinic #clinic05 a {position:relative; float:left; width:196px; height:235px;}
    
    /* 공지사항 */
    #notice {position:relative; float:left; width:245px; margin:0 35px 0 0}
    
    /* Quick_menu */
    #quick_m {position:relative; float:left; width:420px; height:95px; background:url(../images/main/quick_m.png) no-repeat 0 top}
    
    /* 고객센터 */
    #cs_bx {position:relative; float:left; width:245px; margin:0 0 0 35px  }
    #cs_bx .time_sch {position:relative; float:left; margin:0px 0 0 0px; width:245px; height:140px; background:url(../images/main/icon_clock.png) no-repeat right 5px;}

}