@charset 'utf-8'; @import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css); @import url(base/default.css); @import url(class.css); @import url(futra.css); @import url(keyframes.css); @import url(fonts.css); @import url(main.css); * { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body, html { height:100% } .red { color:#ed5b51!important } .rel { position:relative } .abs { position:absolute } .left { float:left } .right { float:right } #bo_v_con { text-align : left !important } .container { width:1200px; margin:0 auto } .margin-top-10 { margin-top:10px } .margin-top-15 { margin-top:15px } .margin-top-20 { margin-top:20px } .margin-top-30 { margin-top:30px } .margin-top-80 { margin-top:80px } .padding-btm-70 { padding-bottom:70px; } .text-center { text-align:center; } article { padding:0; margin:0 } .bg-skyblue { background : #f3f8ff } /** paging **/ .paging { text-align:center; margin:50px 0 } .paging img { vertical-align:middle } .paging > div { display:inline-block; } .paging a { display:block; float:left; border:1px solid #d8dad5; border-left:0; width:33px; padding:10px 0; font-size:12px; color:#666; background:#fff; transition:background ease .3s, color ease .3s; -webkit-transition:background ease .3s, color ease .3s } .paging >div a:nth-child(2) { border-left:1px solid #d8dad5 } .paging a.prev, .paging a.next { border:0; margin:0 5px; padding:13px 0; font-size:10px; } .paging a:hover, .paging a.active { background:#0d1a3d; color:#fff; } .paging a.prev:hover, .paging a.prev.active, .paging a.next:hover, .paging a.next.active { background:#fff; color:#0d1a3d } .scroller { font-size:14px; } .scroller.policy { color:#252525 } .scroller h2 { font-size:13px; color:#252525; font-weight:600 } .scroller p { margin:40px 0; line-height:20px; font-weight:400 } .scroller p span { display:block; color:#ed5b51 } .block-hidden { display:none } .block-visible { display:block } .cancel { transition:background ease .3s, color ease .3s; -webkit-transition:background ease .3s, color ease .3s; padding:10px 30px; background:#a6a6a6; border:1px solid #a6a6a6; color:#fff; display:inline-block; } .submit { transition:background ease .3s, color ease .3s; -webkit-transition:background ease .3s, color ease .3s; padding:10px 30px; background:#0d1a3d; border:1px solid #0d1a3d; color:#fff; display:inline-block } .cancel:hover, .cancel.active { background:#fff; color:#a6a6a6 } .submit:hover, .submit.active { background:#fff; color:#0d1a3d; } .cover { background-size:cover!important; position:absolute; width:100%; height:100%; } .btn-file { transition:background ease .3s, color ease .3s; -webkit-transition:background ease .3s, color ease .3s; background:#eee; display:inline-block; text-align:center; border:1px solid #e0e0e0; color:#67696b; font-weight:500; padding:12px 0; width:115px; } .btn-file:hover, .btn-file.active { background:#fff; } section .more { position:absolute; right:0px; font-size:11px; bottom:5px; color:#a6a6a6; font-weight:400; } section .more img { margin-left:10px } /** checkbox, radio **/ span.radio, span.checkbox { cursor:pointer } span.radio aside, span.checkbox aside { display:none } span.radio label, span.checkbox label { vertical-align:middle; margin:0 5px; font-size:15px; color:#807979 } span.radio em { vertical-align:middle; display:inline-block; position:relative; width:6px; height:6px; padding:4px; overflow:hidden; border-radius:50%; border:1px solid #ddd } span.radio i { vertical-align:middle; display:inline-block; width:6px; height:6px; background:#ed5b51; border-radius:50%; position:absolute; top:50%; left:50%; margin-left:-3px; margin-top:-3px; } span.radio i { opacity:0; transition:opacity ease .4s; -webkit-transition:opacity ease .4s; filter:alpha(opacity=0) } span.radio.active i { opacity:1 } .ie9 span.radio.active i, .ie8 span.radio.active i, .ie7 span.radio.active i { filter:alpha(opacity=100) } span.checkbox { } span.checkbox em { vertical-align:middle; display:inline-block; width:17px; height:17px; border:1px solid #d9d9d9; position:relative } span.checkbox em img { position:absolute; top:50%; left:50%; margin-left:-5px; margin-top:-4px } span.checkbox em img { opacity:0; transition:opacity ease .4s; -webkit-transition:opacity ease .4s; filter:alpha(opacity=0) } span.checkbox.active img { opacity:1 } .ie9 span.checkbox.active img, .ie8 span.checkbox.active img, .ie7 span.checkbox.active img { filter:alpha(opacity=100) } h3.title { text-transform:uppercase; background:url(../img/common/icon/title-bleat.png) left 45% no-repeat; padding:10px; padding-left:35px; color:#3b3333; font-weight:600; font-size:24px; } h3.title i { color:#808080 } h3.title span { margin:0 5px; color:#999191; font-size:13px; } h3.title.top0 { background-position:0px 0px } button { cursor:pointer; transition:background ease .3s, color ease .3s; -webkit-transition:background ease .3s, color ease .3s } button.more { cursor:pointer; text-transform:uppercase; margin-top:25px; font-weight:500; background:transparent; padding:10px 20px; border:1px solid #3e3530 } button.more { transition:background ease .3s, color .3s; -webkit-transition:background ease .3s, color .3s } button.more:hover { background:#3e3530; color:#fff; } header { position:relative; z-index:100; background : #fff; opacity : 0.9; border-bottom : 1px solid #e1e3e3 } header .logo { padding:10px 0; position:relative; width : 200px; z-index: 9999 } header .logo a { display:block; } header .gnb { width:600px; margin:0 auto; position:relative } header .gnb .depth1 li { text-align:center; float:left; background : url('../img/common/header/nav-bg.gif') no-repeat right center; } header .gnb .depth1 li:last-child { background : none } header .gnb .depth1 li a { color:#434343; display:inline-block; padding:13px 0; font-size:18px; position:relative; font-weight:600 } header .gnb .depth1 li:hover a, header .gnb .depth1 li.active a { color:#0189da } .ie8 header .gnb .depth1 a span, .ie7 header .gnb .depth1 a span { display:none } .ie8 header .gnb .depth1 li:hover span, .ie7 header .gnb .depth1 li:hover span { display:block } header li a { transition:color ease .3s; -webkit-transition:color ease .3s; color:#382924 } header li a:hover { color:#2165c0 } header .utils { position:absolute; right:0; top:24px; z-index: 999 } header .utils a { padding:10px 0; font-size:14px; font-weight:500 } header .utils a span { display:block; padding-top:10px; font-weight:800 } header .utils i { font-size:12px; margin:0 5px } header .utils span { transition:color ease .4s; -webkit-transition:color ease .4s } header .utils em { position:relative; width:29px; height:27px; display:block; margin:0 auto } header .utils img { margin-right:5px } header nav { overflow:hidden; height:0; position:absolute; width:100%; top:71px; } header.sub nav > div { background:#F2F2F2 } header nav > div { opacity:0; -webkit-transform:translateY(-100px); -moz-transform:translateY(-100px); -ms-transform:translateY(-100px); transform:translateY(-100px); -webkit-transition:-webkit-transform ease .4s, opacity ease .4s; -moz-transition:-moz-transform ease .4s, opacity ease .4s; -ms-transition:-ms-transform ease .4s, opacity ease .4s; transition:transform ease .4s, opacity ease .4s; } header nav ul { float:left; height:270px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box } header nav li { padding:0; text-align:left; text-align:center; } header nav li a { position:relative; font-weight:500; display:inline-block; padding:3px 0; font-size:16px; color:#434343 } header nav li a:hover { color:#0b5697 } header nav li.active { color:#0b5697 } header nav li a em { display:inline-block; width:10px; padding:0; margin:0; height:1px; background:#fff; overflow:hidden; position:relative; top:-6px; transition:width ease .6s, background ease .4s; -webkit-transition:width ease .6s, background ease .4s} header nav li a:hover em, header nav li a.active em { width:100%; background:#0b5697 } header nav dl { padding-left:2px } header nav dl dd { padding-top:10px; } header nav dl dd img { margin-right:5px; position:relative; top:-1px} header .gnb .depth2 { z-index:100; transition:height ease .4s; -webkit-transition:height ease .4s } header .gnb .depth2.open > div { transform:translateY(0px); -webkit-transform:translateY(0px); opacity:1 } .sub-head { position:relative; height:335px; max-height:335px } .sub-head img { max-width:100%; min-width:600px; width:100%; height:auto } .sub-head .linemap { text-align:right; position:absolute; right:0; bottom:76px } .sub-head .linemap h2 { color:#ed5b51; font-size:60px } .sub-head .linemap a { color:#4e3436; font-size:14px; padding:0 5px } .sub-head .linemap i { color:#4e3436; font-size:14px } header .gnbBlock { position : absolute; top:9px; width : 100% } footer p { padding:3px 0; } footer { font-size:13px; font-weight:500; color:#666; position:relative; padding:20px 10px; border-top : 1px solid #e5e5e5; text-align:left; /*box-shadow:0px -1px 1px 1px rgba(0,0,0, .1)*/ } footer address { font-size:13px; font-weight:500; color:#666; } footer h1 { margin-bottom : 15px; } footer h1 span { display : inline-block; margin-right : 10px; padding-right : 10px; border-right : 1px solid #d2d2d2} footer h1 span:last-child { margin-right : 0; padding-right : 0; border-right : none; } footer h1 span a { display : block; color : #666666; font-size : 13px; font-weight : 500 } footer .quick-top { position:absolute; left:90%; margin-left:-32.5px; top:-70px; } footer .quick-top img { position:relative; z-index:10 } footer .right { margin-top : 20px } /** 모바일 해더 **/ header .mnb { display:none; position:absolute; width:30px; right:0px; top:50%; margin-top:-12px; perspective:800px; -webkit-perspective:800px } header .mnb span { display:block; left:0; top:0; width:100%; height:4px; margin:3px 0; background:#195999 } header .mnb span { transition:transform ease .4s, opacity ease .4s; -webkit-transition:transform ease .4s, opacity ease .4s } header .mnb span:nth-child(1) { -webkit-animation-delay:.1s; animation-delay:.1s } header .mnb span:nth-child(2) { -webkit-animation-delay:.3s; animation-delay:.3s } header .mnb span:nth-child(3) { -webkit-animation-delay:.5s; animation-delay:.5s } header .mnb.active span:nth-child(1) { transform:translateY(7px) rotate(45deg); -webkit-transform:translateY(7px) rotate(45deg) } header .mnb.active span:nth-child(2) { opacity:0; } header .mnb.active span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); -webkit-transform:translateY(-6px) rotate(-45deg) } /** 모바일 메뉴 **/ .gnb-mobile { overflow:hidden; left:0; height:0; position:absolute; top : 57px; z-index:500; width:100% } .gnb-mobile ul { width:80%; margin:0 auto; text-align:left; position:relative; border-top:2px solid #195999; border-bottom:2px solid #195999 } .gnb-mobile li { background:#fff; margin:1px 0; border-top:1px solid #ebebeb } .gnb-mobile li.first { border-top:0 } /*.gnb-mobile li.active > a { color:#195999 }*/ .gnb-mobile li > a { display:block; padding:10px 15px; font-size:16px; font-weight:500; } .gnb-mobile li dd { margin:1px 0 } .gnb-mobile li dd.active a { color:#000 } .gnb-mobile li dd > a { font-weight:500; display:block; padding:10px 20px; font-size:14px; color:#A7A7A7; background:#F5F5F5 } .gnb-mobile .depth3 > a { margin:1px 0; display:block; padding:10px 20px; font-size:13px; color:#A7A7A7; background:#F5F5F5 } .gnb-mobile .depth3 > a img { margin-right:5px } .gnb-mobile .depth2 { height:0; overflow:hidden; transition:height ease .4s; -webkit-transition:height ease .4s; } .gnb-mobile .overlay { background:#fff; opacity:1; position:absolute; top:0; left:0; width:100%; height:100%; } .mobile-view { display:none } section.main { overflow:hidden } /** 의료진 **/ section.doctors { margin-top : -60px !important; } section.doctors .doctors-vs{ background : url('../img/sub/doctors/doctor-vs.png') no-repeat center top; background-size : cover; padding : 180px 0 0 0; } section.doctors .doctors-head { color:#fff; background:#3674a9; } section.doctors .doctors-head .quick-link { border-left:1px solid #4a82b2; border-right:1px solid #306898; border-bottom:1px solid #306898; padding:10px 0; width:25%; float:left; text-align:center; font-size:18px; color:#fff; -webkit-box-sizing:border-box;-moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box } section.doctors .doctors-head .quick-link a { padding:6px 0; color:#fff; display:block; } section.doctors .doctors-head .quick-link.first { border-left:0 } section.doctors .doctors-head .quick-link.last { background:#3e9cd4; border-right:0; border-bottom:0; border-left:0; } section.doctors .doctors-list { height:420px; position:relative; overflow:hidden; background:url( '../img/main/doctors/bg.png') center bottom no-repeat; } section.doctors .doctors-list .doctor-Info { height:420px; float:left; width:300px } section.doctors .doctors-list .doctor-Info .doctor-img { text-align:center; perspective:600px; -webkit-perspective:600px; overflow:hidden; width:100%; height:330px; background:#fff; transition:background ease .6s; } section.doctors .doctors-list .doctor-Info .doctor-img img { max-width:300px; max-height:330px; width:100%; height:100%; transition:transform ease .6s; -webkit-transition:-webkit-transform ease .6s; } section.doctors .doctors-list .doctor-Info .doctor-img:hover { background:#d5d5d5; } section.doctors .doctors-list .doctor-Info .doctor-img:hover img { transform:translateZ(50px); -webkit-transform:translateZ(50px); } section.doctors .doctors-list .doctor-Info .doctor-name { height:90px; text-align:center; color:#fff } section.doctors .doctors-list .doctor-Info .doctor-name span { display:block; padding-top:16px; font-size:24px; font-weight:500 } section.doctors .doctors-list .doctor-Info .doctor-name p { font-size:17px; margin-top:5px } section.doctors .doctors-list article:nth-child(1n) .doctor-name { background:#4e4f5d } section.doctors .doctors-list article:nth-child(2n) .doctor-name { background:#616270 } section.doctors .doctors-list article:nth-child(3n) .doctor-name { background:#6d6e7c } section.doctors .doctors-list article:nth-child(4n) .doctor-name { background:#7e7f89 } section.doctors .doctors-list .arrow { position:absolute; bottom:30px } section.doctors .doctors-list .arrow.prev { left:0 } section.doctors .doctors-list .arrow.next { right:0 } section.doctors .slider { width:10000px; position:relative; transition:transform ease .8s; -webkit-transition:transform ease .8s; -moz-transition:transform ease .8s; } section.doctors .menu { } section.doctors .spine-doctor { background : url('../img/sub/doctors/spine-doctor_new.png') no-repeat bottom 1px center; background-size : 100% auto; max-width : 1050px; margin : 0 auto } section.doctors .joint-doctor { background : url('../img/sub/doctors/joint-doctor.png') no-repeat bottom 1px center; background-size : 90% auto; max-width : 890px; margin : 0 auto } section.doctors .pain-doctor { background : url('../img/sub/doctors/pain-doctor.png') no-repeat bottom 1px center; background-size : 90% auto; max-width : 912px; margin : 0 auto } section.doctors .center-doctor { background : url('../img/sub/doctors/center-doctor.png') no-repeat bottom 1px center; background-size : 100% auto; max-width : 558px; margin : 0 auto } section.doctors .internist-doctor { background : url("../img/sub/doctors/internist-doctor.png") no-repeat bottom 1px center; background-size:47% auto; max-width: 558px; margin: 0 auto;} section.doctors .menu .tab { position:relative; cursor:pointer; cursor:pointer; perspective:600px; -webkit-perspective:800px; float:left; text-align:center; height : 520px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box } section.doctors .spine-doctor .tab:first-child{ width : 24%; } section.doctors .spine-doctor .tab:nth-child(2) { width : 12%; } section.doctors .spine-doctor .tab:nth-child(3) { width : 16%; } section.doctors .spine-doctor .tab:nth-child(4) { width : 16%; } section.doctors .spine-doctor .tab:nth-child(5) { width : 16%; } section.doctors .spine-doctor .tab:last-child { width : 16%; } section.doctors .joint-doctor .tab:first-child { width : 33%; } section.doctors .joint-doctor .tab:nth-child(2) { width : 33%; } /* section.doctors .joint-doctor .tab:nth-child(3) { width : 34%; } */ section.doctors .joint-doctor .tab:last-child { width : 34%; } section.doctors .pain-doctor .tab:first-child { width : 30% } section.doctors .pain-doctor .tab:nth-child(2) { width : 25% } section.doctors .pain-doctor .tab:nth-child(3) { width : 25% } section.doctors .pain-doctor .tab:last-child { width : 20% } section.doctors .center-doctor .tab:first-child { width : 52%; } section.doctors .center-doctor .tab:last-child { width : 48%; } section.doctors .menu .tab span { display:block; text-align:center; position:relative; } section.doctors .menu .tab span { transition:color ease .6s; -webkit-transition:color ease .6s; } section.doctors .menu .tab span img { transition:opacity ease .6s; -webkit-transition:opacity ease .6s; } section.doctors .menu .tab span img.on { opacity:0; position:absolute; left:50%; top:0; margin-left:-30px } section.doctors .menu .tab span.name { margin-top:30px; font-size:20px; color:#333 } section.doctors .menu .tab i { transition:color ease .6s; -webkit-transition:color ease .6s; font-weight:500; padding:5px 0; display:block; opacity:.6; filter:alpha(opacity=60); font-size:12px; color:#333; text-transform:uppercase } section.doctors .menu .tab .overlay { opacity:0; transform:translateZ(400px); -webkit-transform:translateZ(400px); transition:transform ease .6, opacity ease .6s; -webkit-transition:-webkit-transform ease .6s, opacity ease .6s; -ms-transition:-ms-transform ease .6s, opacity ease .6s; } section.doctors .spine-doctor .tab .overlay.img1 a { position : absolute; top : 20px; left : -174px; } section.doctors .spine-doctor .tab .overlay.img2 a { position : absolute; top : -75px; left : -155px;} section.doctors .spine-doctor .tab .overlay.img3 a { position : absolute; top : -90px; left: 110px; } section.doctors .spine-doctor .tab .overlay.img4 a { position : absolute; top : 30px; left: 100px; } section.doctors .spine-doctor .tab .overlay.img5 a { position : absolute; top : 40px; left: -40px; } section.doctors .spine-doctor .tab .overlay.img6 a { position : absolute; top : 28px; left: 90px; } section.doctors .joint-doctor .tab .overlay.img1 a { position : absolute; top : -175px; left : -30px; } section.doctors .joint-doctor .tab .overlay.img2 a { position : absolute; top : -120px; left : 210px;} section.doctors .joint-doctor .tab .overlay.img3 a { position : absolute; top : -70px; right: -35px; } section.doctors .joint-doctor .tab .overlay.img4 a { position : absolute; top : -70px; left: -30px; } section.doctors .pain-doctor .tab .overlay.img1 a { position : absolute; top : 0px; left : -68px; } section.doctors .pain-doctor .tab .overlay.img2 a { position : absolute; top : -117px; right : 160px;} section.doctors .pain-doctor .tab .overlay.img3 a { position : absolute; top : -78px; right: -95px; } section.doctors .pain-doctor .tab .overlay.img4 a { position : absolute; top : 0px; right: -110px; } section.doctors .center-doctor .tab .overlay.img1 a { position : absolute; top : 0px; left : -210px; } section.doctors .center-doctor .tab .overlay.img2 a { position : absolute; top : 0px; right : -215px;} section.doctors .internist-doctor .tab .overlay.img1 a { position : absolute; top:0px; left:-60px;} section.doctors .menu .tab .number { transition:background ease .6s; -webkit-transition:background ease .6s; display:inline-block; width:36px; height:36px; text-align:center; background:#4c96d7; border-radius:50% } section.doctors .menu .tab .number i { transition:color ease .6s; -webkit-transition:color ease .6s; position:relative; color:#fff; top:7px; opacity:1 } section.doctors .menu .tab em { display:block; padding:20px 0; } section.doctors .menu .tab:hover .overlay { transform:translateZ(0px); -webkit-transform:translateZ(0px); -ms-transform:translateZ(0px); opacity:1 } section.doctors .menu .tab:hover .number { background:#fff } section.doctors .menu .tab:hover .rel > i, section.doctors .menu .tab:hover span, section.doctors .menu .tab.active .rel > i { color:#fff } section.doctors .menu .tab:hover .number i { color:#4c96d7 } section.doctors .menu .tab:hover .on { opacity:1 } section.doctors .menu .tab:hover .off { opacity:0 } .ie9 section.doctors .menu .tab .overlay, .ie8 section.doctors .menu .tab .overlay, .ie7 section.doctors .menu .tab .overlay { display:none } .ie9 section.doctors .menu .tab:hover .overlay, .ie9 section.doctors .menu .tab.active .overlay, .ie8 section.doctors .menu .tab:hover .overlay, .ie8 section.doctors .menu .tab.active .overlay, .ie7 section.doctors .menu .tab:hover .overlay .ie7 section.doctors .menu .tab.active .overlay { display:block; opacity:1 } section.doctors .tab-content { /*margin-top:100px*/ } section.doctors .tab-content .box-header { padding:50px 0; text-align:center } section.doctors .tab-content .box-header span { display:block; padding:15px 0; font-size:18px; color:#4c96d7; font-weight:600; } section.doctors .tab-content .box-header h2 { color:#333; font-size:24px; font-weight:600 } section.doctors .tab-content .spine { } section.doctors .tab-content .spine h3 strong { display : block; font-size : 28px; color : #333333; font-weight : bold; margin-bottom : 10px } section.doctors .tab-content .spine h3 { font-size:28px; color:#333333; position:relative; } section.doctors .tab-content .spine h3 .more { position:absolute; right:0; } section.doctors .tab-content .spine .left { width : 45%; box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box;} section.doctors .tab-content .spine .right { width:50%; box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box; } section.doctors .tab-content .spine .right .inner > p { position : absolute; width : 100%; text-align : right; bottom : 0; right : 0 } section.doctors .tab-content .spine .right a { display : inline-block; width : 32px; height : 32px; transition : all .3s ease } section.doctors .tab-content .spine .right a.doctor-facebook { background : url('../img/sub/doctors/doctor-facebook.jpg') no-repeat; background-position : 0 -32px; } section.doctors .tab-content .spine .right a.doctor-blog { background : url('../img/sub/doctors/doctor-blog.jpg') no-repeat; background-position : 0 -32px; } section.doctors .tab-content .spine .right a.doctor-kakao { background : url('../img/sub/doctors/doctor-kakao.jpg') no-repeat; background-position : 0 -32px; } section.doctors .tab-content .spine .right a:hover { background-position : 0 0; } section.doctors .tab-content .spine .left > img { width : 100%; height : auto !important; } section.doctors .tab-content .spine ul { margin-top : 20px; } section.doctors .tab-content .spine ul li { background : url('../img/sub/doctors/doctor-list-bg.gif') no-repeat left center; font-size : 15px; color: #333333; padding-left : 15px; margin-bottom : 20px} section.doctors .tab-content .spine .sub-list > p { background : url('../img/common/icon/list-bg-square.gif') no-repeat left center; font-size : 15px; color : #333; padding-left : 15px; margin-left : 20px; margin-bottom : 20px; } section.doctors .tab-content .box { overflow:hidden; height:0; opacity:0; /*transition:height ease .6s. opacity ease .6s; -webkit-transition:height ease .6s, opacity ease .6s; -ms-transition:height ease .6s, opacity ease .6s;*/ } section.doctors .tab-content .box > div { } /** 상세 **/ section.doctors { perspective:600px; -webkit-perspective:600px; } section.doctors .detailView { margin-top:100px } section.doctors .detailView .bg { height:194px; background:#0e6ec1 } section.doctors .detailView .category { background:#fff; } section.doctors .detailView .title { position:relative } section.doctors .detailView .title h2 { font-size:32px; color:#fff; font-weight:600; } section.doctors .detailView .title p { color:#fff; font-size:12px; padding:5px 0; text-transform:uppercase } section.doctors .detailView .title a.close { position:absolute; right:0; top:0 } section.doctors .detailView .category { background:#fff; margin-top:20px } section.doctors .detailView .category .tab { text-align:center } section.doctors .detailView .category .tab a { border:1px solid #dadada; font-weight:600; color:#616161; padding:22px 0; display:block; font-size:18px; transition:color ease .6s; -webkit-transition:color ease .6s; } section.doctors .detailView .category .tab a:hover { color:#000 } section.doctors .detailView .category .tab a img { display:none } section.doctors .detailView .category .tab a span { display:block; padding:5px 0; } section.doctors .detailView .category .tab.active a { border:0; font-weight:500; color:#000 } section.doctors .detailView .category .tab.active a img { display:inline } section.doctors .detailView .detailInfo { margin-top:70px; display:none } section.doctors .detailView .detailInfo.active { display:block } section.doctors .detailView hgroup { margin-bottom:20px; } section.doctors .detailView .detailInfo .list { margin-top:20px } section.doctors .detailView .detailInfo .list article { width:49%; border:1px solid #e5e5e7; box-shadow:1px 1px 1px 1px rgba(0,0,0,.05); -webkit-box-shadow:1px 1px 1px 1px rgba(0,0,0,.05) } section.doctors .detailView .detailInfo .list article .inner { width:92%; margin:30px auto } section.doctors .detailView .detailInfo .list article h2 { color:#333; font-size:17px; font-weight:600; position:relative; padding-bottom:15px; } section.doctors .detailView .detailInfo .list article h2:after { content:''; position:absolute; width:20px; height:1px; background:#4c96d7; bottom:0; left:0; } section.doctors .detailView .detailInfo .list article h2 a { position:absolute; right:0; font-size:11px; color:#727272 } section.doctors .detailView .detailInfo .list article h2 a i { color:#0189da; margin:0 3px } section.doctors .detailView .detailInfo .list article p { margin-top:20px; line-height:20px; font-size:14px; color:#727272 } section.doctors .detailView .hidden-content { perspective:600px; -webkit-perspective:600px; } section.doctors .detailView .hidden-content .close { position:absolute; right:20px; top:20px } section.doctors .detailView .hidden-content .view { display:none; width:98%; margin:40px auto; position:relative; border:1px solid #e5e5e7; background:#f7f8f8 } section.doctors .detailView .view.active { display:block; animation:pageAnimateIn ease .4s both; -webkit-animation:pageAnimateIn ease .4s both } section.doctors .detailView .hidden-content .view em { top:-25px } section.doctors .detailView .hidden-content .view em.top-left { position:absolute; left:70px; } section.doctors .detailView .hidden-content .view em.top-right { position:absolute; right:40%;} section.doctors .detailView .hidden-content .view em.point1 { position:absolute; left:85px; } section.doctors .detailView .hidden-content .view em.point2 { position:absolute; left:330px; } section.doctors .detailView .hidden-content .view em.point3 { position:absolute; left:565px; } section.doctors .detailView .hidden-content .view em.point4 { position:absolute; left:810px; } section.doctors .detailView .hidden-content .view em.point5 { position:absolute; left:1045px;} section.doctors .detailView .hidden-content .view p em { top:1px } section.doctors .detailView .hidden-content .view .inner { margin:20px auto; width:94%; } section.doctors .detailView .hidden-content .view .inner > div { width:50%; } section.doctors .detailView .hidden-content .view .inner h2 { font-size:16px; color:#016cda; font-weight:500 } section.doctors .detailView .hidden-content .view .inner span { display:block; padding:5px 0; color:#000 } section.doctors .detailView .hidden-content .view .inner p { width:80%; margin:5px 0; position:relative; padding-left:13px; line-height:20px } section.doctors .detailView .hidden-content .view .inner p i { position:absolute; left:0 } section.doctors .detailView .hidden-content .view .inner p em { font-weight:600; position:absolute; left:5px } section.doctors .detailView .hidden-content .view .inner p.first { margin-top:15px } section.doctors .detailView .hidden-content .view .inner .txt-block { padding:15px 0; } section.doctors .detailView .hidden-content .view .inner .txt-block b { font-weight:400; color:#000 } section.doctors .detailView .hidden-content .view .footer { text-align:right; padding:10px 20px; padding-top:0 } section.doctors .detailView .hidden-content .view .picture { display:inline-block; font-weight:500; } section.doctors .detailView .hidden-content .view .picture span { display:none } section.doctors .detailView .hidden-content .view .picture:hover span { display:inline } section.doctors .detailView .view dl { margin-top:50px } section.doctors .detailView .view dt { color:#333; font-size:17px; font-weight:500 } section.doctors .detailView .view dd { margin:10px 0; padding-left:25px; position:relative; color:#727272; font-size:14px } section.doctors .detailView .view dd span { position:absolute; left:5px; } .popup-picture { z-index:100; position:fixed; width:100%; height:100%; left:0; top:0; } .popup-picture .overlay { position:absolute; width:100%; height:100%; top:0; left:0; background:#000; opacity:.7; filter:alpha(opacity=70); } .popup-picture .close { position:absolute; } .popup-picture .image { position:absolute; } section.doctors .detailView .detailInfo .list .tab2-head .icon { cursor:pointer; float:left; width:20%; text-align:center } section.doctors .detailView .detailInfo .list .tab2-head .icon span { display:inline-block; position:relative; perspective:600; -webkit-perspective:600; } section.doctors .detailView .detailInfo .list .tab2-head .icon span .on { position:absolute; top:0; left:0; opacity:0; transform:translateZ(100px); -webkit-transform:translateZ(100px); transition:transform ease .4s, opacity ease .4s; -webkit-transition:transform ease .4s, opacity ease .4s; } section.doctors .detailView .detailInfo .list .tab2-head .icon em { margin:10px 0; display:inline-block; width:20px; height:1px; background:#0189da } section.doctors .detailView .detailInfo .list .tab2-head .info { margin-top:30px } section.doctors .detailView .detailInfo .list .tab2-head .info h2 { height:40px; font-size:17px; color:#333; font-weight:600 } section.doctors .detailView .detailInfo .list .tab2-head .info p { padding:10px 0; width:80%; margin:0 auto; line-height:22px; font-size:14px } section.doctors .detailView .detailInfo .list .tab2-head .icon:hover span .on, section.doctors .detailView .detailInfo .list .tab2-head .icon.active span .on { opacity:1; transform:translateZ(0px); -webkit-transform:translateZ(0px); } section.doctors .detailView .tab2-2-head { padding-bottom:50px; border-bottom:1px solid #e5e5e7 } section.doctors .detailView .tab2-2 .hidden-content .view { border:0px } section.doctors .detailView .tab2-2-h2 { position:relative; margin-left:30px } section.doctors .detailView .tab2-2-h2 h2 { font-size:21px; color:#333; font-weight:500 } section.doctors .detailView .tab2-2-h2 p { margin-top:20px; font-size:14px; color:#727272; line-height:22px } section.doctors .detailView .detailInfo-tab3 { display:block } section.doctors .detailView .detail-header > .container { padding-top:35px } section.doctors .schedule { margin-top : 60px; min-height: .01% } section.doctors .schedule > p { font-size : 20px; color : #000; margin-bottom : 20px; } .table01 { width : 99% } section.doctors .schedule thead tr th { padding : 15px 0; background : #f9f9f9; border : 1px solid #e5e5e5; border-top : 2px solid #bababa; border-bottom : 1px solid #bababa; font-size : 18px; } section.doctors .schedule thead tr th:first-child { border-left: none } section.doctors .schedule thead tr th:last-child { border-right : none } section.doctors .schedule tbody tr td { text-align : center; color : #666666; padding : 10px; border : 1px solid #e5e5e5; font-size :15px; white-space : nowrap; } section.doctors .schedule td span { color:#1b75c4; font-weight:500; font-size : 17px } /** 게시물 **/ section.community { margin-top:30px } section.community .shadow { border:1px solid #e5e5e7; box-shadow:2px 2px 1px 1px rgba(0,0,0,.2); -webkit-box-shadow:1px 1px 1px 1px rgba(0,0,0,.1); -moz-box-shadow:1px 1px 1px 1px rgba(0,0,0,.1) } section.community .left-wrap { float:left; width:700px; } section.community .right-wrap { float:right; width:460px; margin-right:2px; } section.community .left-wrap .inner { position:relative; width:640px; margin:30px auto } section.community .right-wrap .inner { position:relative; width:400px; margin:30px auto } section.community h2 { font-size:20px; color:#000; font-weight:600; position:relative; } section.community h2 a { bottom:5px; } section.community h2 a img { margin-left:10px } section.community .notice ul { margin-top:35px } section.community .notice li { margin:15px 0; position:relative; padding-left:18px; } section.community .notice li a { font-size:18px; color:#727272 } section.community .notice li span { position:absolute; right:0; top:3px; font-size:14px; color:#727272; font-weight:500 } section.community .notice li em { position:absolute; left:0; } section.community .ne-tv .left-block { float:left; width:360px; } section.community .ne-tv-head { margin-top:30px; position:relative; } section.community .ne-tv-head a { } section.community .ne-tv-head span { font-size:24px; color:#484b56; font-weight:500 } section.community .ne-tv-body { font-size:16px; margin-top:7px; padding:10px 0; border-top:1px solid #e5e5e5 } section.community .ne-tv-foot { text-align:right; margin-top:10px } section.community .ne-tv-foot span { margin-left:15px } section.community .ne-tv .right-block { float:right; width:240px } section.community .ne-story { margin-top:20px } section.community .ne-story .iconBox { float:left; text-align:center; width:25%; position:relative } section.community .ne-story .iconBox i { position:absolute; right:0; width:1px; top:12px; height:47px; background:#e5e5e5; } section.community .ne-story .iconBox span { display:block; padding:6px 0; font-size:14px; color:#727272; font-weight:400 } section.community .request table { margin-top:22px; width:100%; } section.community .request table th, section.community .request table td { text-align:left; font-size:14px; color:#727272; padding:5px 0; font-weight:400 } section.community .request table td input { padding:5px; width:285px; border:1px solid #e5e5e5; } section.community .request table th { padding-left:10px } section.community .request-foot { padding:10px 0 } section.community .request-foot .agree { width:166px; float:left } section.community .request-foot .agree span { display:block; padding:5px 0; text-align:left } section.community .request-foot .agree em { text-align:center; display:block; background:#a6a6a6; padding:3px 0 } section.community .request-foot .agree em a { color:#fff; font-size:12px } section.community .request-foot .send { width:122px; margin-left:10px; float:left } section.community .request-foot .send a { text-align:center; display:inline-block; width:122px; padding:15px 0; background:#0189da; color:#fff; font-size:16px; } section.community .cscenter .guide { margin-top:13px } section.community .cscenter .guide .clear { padding:3px 0 } section.community .cscenter .guide .icon { float:left } section.community .cscenter .guide .text { float:left; margin-left:10px; margin-top:10px; width:310px} section.community .cscenter .guide .text strong { font-size:16px; color:#555; font-weight:600; } section.community .cscenter .guide .text b { margin:0 5px; font-size:20px; color:#0189da } section.community .cscenter .guide .text span { color:#a6a6a6; font-size:14px; margin:0 5px } section.community .cscenter .guide .text .business-hours { margin-top:8px } section.community .cscenter .guide .text .business-hours p { color:#727272; padding:2px 0 } section.community .cscenter .guide .text .business-hours label { margin-right:5px; display:inline-block; width:38px; text-align: justify; -moz-text-align-last: justify; -webkit-text-align-last: justify; /* not implemented yet, and will not be */ text-align-last: justify; /* IE */ } section.community .cscenter .guide .text .business-hours u { text-decoration:none; color:#000 } /** 고객센터 **/ section.cscenter { margin-top:70px; padding:70px 0 100px 0; position:relative; text-align:center; background:url('../img/main/cscenter/bg.png') center center; background-size:cover } section.cscenter .pattern { position:absolute; left:0; top:0; width:100%; height:100%; background:url('../img/main/cscenter/pattern.png'); } section.cscenter .cscenter-head { position:relative; } section.cscenter .cscenter-head h2 { color:#333; font-size:46px; font-weight:600 } section.cscenter .cscenter-head p { font-size:20px; color:#333; padding:25px 0 } section.cscenter .cscenter-body { position:relative; margin-top:50px } section.cscenter .cscenter-body .ball { margin:0 20px ;display:inline-block; } section.cscenter .cscenter-body .ball .inner { background:#f2f3f4; width:245px; height:245px; border-radius:50%; border:10px solid #fff; box-shadow:2px 2px 2px 1px rgba(0,0,0,.2); -webkit-box-shadow:2px 2px 2px 1px rgba(0,0,0,.2); -moz-box-shadow:2px 2px 2px 1px rgba(0,0,0,.2) } section.cscenter .cscenter-body .ball span { display:block; font-size:18px; color:#666; padding:25px 0 } section.cscenter .cscenter-body .ball img { margin-top:50px } section.contact { position:relative; height:430px; } section.contact .container { position:relative } section.contact .location { width:50%; line-height:22px; font-weight:500 } section.contact .location .inner { width:460px; margin-top:90px} section.contact .location h2 { font-weight:600; font-size:32px; color:#000 } section.contact .location .subway, section.contact .location .bus { margin:25px 0 } section.contact .location .head { font-size:20px; color:#484b56; font-weight:600; } section.contact .location .head img { margin-right:5px } section.contact .location .subway { margin-top:40px } section.contact .location .bus .clear { padding:10px 0 } section.contact .location .bus { } section.contact .location p { padding:10px 0; } section.contact .location .right a { line-height:12px; font-size:12px; color:#fff; display:inline-block; width:56px; padding:8px 0; background:#545759; text-align:center; transition:background ease .6s; -webkit-transition:background ease .6s; -moz-transition:background ease .6s; } section.contact .location .right a:hover { background:#0189da; } section.contact .location .right a span { display:block; margin-top:5px } section.contact .location .right .on { display:none } section.contact .location .right a:hover .off { display:none } section.contact .location .right a:hover .on { display:block } section.contact .map { position:absolute; right:0; top:0; width:50%; right:0; height:430px; } /** sub **/ /** sub-visual **/ section.sub-visual { height:170px; text-align:center; position : relative; } section.sub-visual h2 { padding-top:55px; font-size:22px; color:#333; font-weight:600; } section.sub-visual p { padding:7px 0; color:#000; font-weight:500; opacity:.8; filter:alpha(opacity=80); } /** snb **/ section.snb {border-top:1px solid #c5c7cb; position : relative; z-index: 9; } section.snb a { position:relative; padding:20px 0; display:block; float:left; text-align:center } section.snb a em { text-align:center; position:absolute; top:-2px; left:0; width:100%; perspective:600px; -webkit-perspective:600px; } section.foot-snb a em { top : 60px } section.snb a em u { display:inline-block; opacity:0; position:relative; top:-11px; height:1px; background:#2386dc; width:1px; transition:width ease .3s, opacity ease .3s; -webkit-transition:width ease .3s, opacity ease .3s; } section.snb a em i { display:block; position:absolute; border-radius:50%; left:50%; top:-2px; width:4px; height:4px; background:#fff; border:2px solid #1874c3; opacity:0; transition:transform ease .3s, opacity ease .3s; -webkit-transition:transform ease .3s, opacity ease .3s; transform:translateZ(-100px); -webkit-transform:translateZ(-100px); } section.snb a.first span { border-left:1px solid #ccc; } section.snb a span { overflow:hidden; font-weight:500; color:#4f4f4f; display:block; border-right:1px solid #ccc; transition:color ease .4s; -webkit-transition:color ease .4s; -moz-transition:color ease .4s; } section.snb a span { height:20px; position:relative } section.snb a span b { font-weight:500; display:block; padding:2px 0; transition:transform ease .3s; -webkit-transition:transform ease .3s; } section.snb a span b.on { position:absolute; top:30px; left:0; width:100%; text-align:center; font-weight:600; color:#0761a8; } section.snb a:hover .off, section.snb a.active .off { transform:translateY(-30px ); -webkit-transform:translateY(-30px ); } section.snb a:hover .on, section.snb a.active .on { transform:translateY(-30px ); -webkit-transform:translateY(-30px ); } section.snb a:hover em u, section.snb a.active em u { width:100%; opacity:1 } section.snb a:hover em i, section.snb a.active em i { transform:translateZ(0px); -webkit-transform:translateZ(0px); opacity:1 } .ie9 section.snb a em, .ie8 section.snb a em, .ie7 section.snb a em { display:none } .ie9 section.snb a:hover em, .ie8 section.snb a:hover em, .ie7 section.snb a:hover em { display:block } .ie9 section.snb a.active em, .ie8 section.snb a.active em, .ie7 section.snb a.active em { display:block } .ie9 section.snb a:hover .off, .ie8 section.snb a:hover .off, .ie7 section.snb a:hover .off { display:none; } .ie9 section.snb a:hover .on, .ie8 section.snb a:hover .on, .ie7 section.snb a:hover .on { top:0px } section.sub { margin:0 auto 50px; min-height:600px } section.sub h2.title { font-size:40px; color:#333; padding:30px 0; font-weight:500 } section.sub .header { text-align:center } section.sub .header img { max-width:93px } section.sub .header p { color:#727272; font-size:14px; line-height:22px; padding:45px 0; } section.sub .header p span { color : #333333; text-decoration : underline } section.sub .header p strong { color : #333333; font-weight : 600 } section.sub .pageTitle { padding:40px 0; text-align:center; position:relative } section.sub .pageTitle em { position:absolute; top:50%; left:0; width:100%; height:1px; background:#929599; overflow:hidden } section.sub .pageTitle span {font-weight:500; position:relative; display:inline-block; padding:0 40px; background:#fff; color:#474747; font-size:22px; } section.sub .pageTitle span strong { font-size : 20px; color : #666666; display : block; margin-top : 10px; } section.doctors .pageTitle { margin-bottom : 20px; } section.doctors .pageTitle span { font-size : 32px; color : #333333; } section.sub .pageTitle span.sky-blue { background : #f3f8ff; } /** 병원소개 **/ section.about { } /** 인사말 **/ section.about h2.title { font-size:40px; color:#333; padding:30px 0; font-weight:500 } section.about .greeting { float:left; width:600px; } section.about .greeting h3 { font-size:20px; color:#000; padding:10px 0; line-height:30px } section.about .greeting p { padding:15px 0; line-height:24px; font-size : 15px; word-break : keep-all; color : #666; font-weight : normal } section.about .greeting img { margin:40px 0 10px 0; max-width:93px;} section.about .building { float:right; width:560px; text-align:right } section.about .facilities { margin-top:100px; padding : 50px 0 100px 0 } section.about .facilities img { width : 100%; height : auto !important } section.about .facilities .header { padding:40px 0; text-align:center; position:relative } section.about .facilities .header em { position:absolute; top:50%; left:0; width:100%; height:1px; background:#929599; overflow:hidden } section.about .facilities .header span {font-weight:500; position:relative; display:inline-block; padding:0 40px; background:#fff; color:#333; font-size:22px; } section.about .facilities article { padding:16px 30px; background : #fff } section.about .facilities article h2 { font-weight:500; font-size:20px; color:#000; padding:16px 0 } section.about .facilities article p { line-height:24px; font-weight:500; font-size:14px; color:#666; letter-spacing:-1px } section.about .facilities .first .left article { margin-top:137px } section.about .facilities .arrow { position:relative } section.about .facilities .point1:after { content:''; position:absolute; bottom:-15px; left:50px; border-left:30px solid transparent; border-right:30px solid transparent; border-bottom:30px solid #fff } section.about .facilities .point2:after { content:''; position:absolute; bottom:80px; left:-17px; border-left:30px solid #fff; border-top:30px solid transparent; border-bottom:30px solid transparent } section.about .facilities .point3:after { content:''; position:absolute; top:-15px; left:70px; border-left:30px solid transparent; border-right:30px solid transparent; border-top:30px solid #fff } section.about .facilities .point4:after { content:''; position:absolute; right:70px; top:-15px; border-left:30px solid transparent; border-right:30px solid transparent; border-top:30px solid #fff } section.about .facilities .point5:after { content:''; position:absolute; right:6px; bottom:110px; border-top:10px solid transparent; border-bottom:10px solid transparent; border-right:10px solid #fff } section.about .facilities .point6:after { content:''; position:absolute; left:-15px; bottom:100px; border-top:30px solid transparent; border-bottom:30px solid transparent; border-left:30px solid #fff } section.about .preview-left { float:left; width:415px; } section.about .preview-right { float:right; width:770px; } section.about .preview-right .left { width:45%; background : #fff } section.about .arrow-option { padding : 80px 0 60px 0 } /** 진료시간 안내 **/ section.about .medical { } section.about .medical .guide { position:relative } section.about .medical .guide .time { } section.about .medical .guide .left { } section.about .medical .guide > div { width:49%; border:1px solid #dbdbdb; } section.about .medical .guide > div .inner { position:relative; width:86%; margin:40px auto } section.about .medical .guide .time { float:left } section.about .medical .guide .call { float:right } section.about .medical .guide .call img { max-width:64px } section.about .medical .guide .icon { width:130px; float:left; } section.about .medical .guide .icon img { max-width:77px } section.about .medical .guide article { float:left; } section.about .medical .guide article h2 { color:#555; font-size:20px; font-weight:500; } section.about .medical .guide article span { padding:3px 0; font-weight:500; color:#555; opacity:.6; display:block; font-size:14px; } section.about .medical .guide article p b { display:inline-block; width:40px; text-align:justify } section.about .medical .guide article p i { color:#0189da } section.about .medical .guide article p u { display:inline-block; margin:0 6px } section.about .medical .guide article p { font-weight:500; padding:3px 0 } section.about .medical .guide article em { display:block; padding:5px 0; color:#0189da; font-size:44px; font-weight:600 } section.about .medical .schedule { width:100%; border-top:1px solid #000; margin-top : 20px } section.about .medical .schedule th { font-size:20px; color:#000; font-weight:500; padding:20px 0; } section.about .medical .schedule th, section.about .medical .schedule td { text-align:center; border-left:1px solid #dce0e4; border-bottom:1px solid #9da5ae } section.about .medical .schedule th.first { border-left:0px none } section.about .medical .schedule td { padding:10px 0; font-weight:500; } section.about .medical .schedule td span { font-weight:500; font-size : 15px } section.about .medical .schedule td.first { border-left:0; font-weight : bold; font-size : 15px } section.about .medical .schedule .am { border-bottom:1px solid #dce0e4 } section.about .medical .schedule strong { font-weight : bold } section.about .medical .schedule tr.blue td span { color : #0361b1 } section.about .medical .schedule tr.blue { background : #f6fafe } section.about .medical .schedule tr.blue td.first { color : #0361b1 } section.about .medical .schedule tr.green td span { color : #88c10e } section.about .medical .schedule tr.green { background : #f8faf6 } section.about .medical .schedule tr.green td.first { color : #78af03 } section.about .medical .schedule tr.orange td span { color : #db8101 } section.about .medical .schedule tr.orange { background : #f9f6f2 } section.about .medical .schedule tr.orange td.first { color : #f0920c } section.about .medical .schedule tr.purple td span { color : #894cb4 } section.about .medical .schedule tr.purple { background : #faf6fd } section.about .medical .schedule tr.purple td.first { color : #894cb4 } /** 층별안내 **/ section.about .floor .floor-info { margin-top:20px } section.about .floor .floor-info > div { float:left; width:50% } section.about .floor .floor-info > div div { position : relative; border-bottom:1px solid #dddee0; margin-top:6px; height : 60px } section.about .floor .floor-info > div div em { background:#779cbd; width:152px; text-align:center; display:inline-block; padding:5px 0; font-size:44px; color:#fff; position : absolute; top : 0; left : 0 } section.about .floor .floor-info > div div em span { font-size:44px; font-weight:500; color : #fff } section.about .floor .floor-info > div div em i { font-size:22px; color : #fff } section.about .floor .floor-info > div div > span { font-size:16px; color:#666; display:block; padding-left : 200px; height : 60px; line-height : 60px; font-weight : normal } /** 층별안내 2016-02-29 변경 **/ section.about .floor .floor-info-2 { margin-top:20px } section.about .floor .floor-info-2 > div div { position : relative; border-bottom:1px solid #dddee0; margin-top:10px; min-height : 60px } section.about .floor .floor-info-2 > div div > a { display:table; width:100% } section.about .floor .floor-info-2 > div em { display:table-cell; overflow:hidden; position:relative; vertical-align:middle; background:#3b92e0; border:2px solid #3b92e0; width:152px; text-align:center; padding:5px 0; min-height:60px; font-size:44px; color:#fff ! important; transition:all .5s ease } section.about .floor .floor-info-2 > div em strong { position:absolute; top:0; left:-200px; transition:all .5s ease; width:152px; line-height:64px; font-size:20px } section.about .floor .floor-info-2 > div em strong img { width:auto ! important; height:auto ! important } section.about .floor .floor-info-2 > div div em span { font-size:44px; font-weight:500; transition:all .3s ease } section.about .floor .floor-info-2 > div div em i { font-size:22px; transition:all .3s ease } section.about .floor .floor-info-2 span.txt { display:table-cell; vertical-align:middle; padding-left:30px; font-size:16px; color:#666; font-weight : bold; border:2px solid transparent; border-left:0px none; transition:all .5s ease } section.about .floor .floor-info-2 > div div > a:hover em { background:#fff; color:#3b92e0 ! important } section.about .floor .floor-info-2 > div div > a:hover em span, section.about .floor .floor-info-2 > div div > a:hover em i { opacity:0 } section.about .floor .floor-info-2 > div div > a:hover strong { left:0 } section.about .floor .floor-info-2 > div div > a:hover .txt { border-color:#3b92e0; color:#000 } /** 오시는길 **/ section.about .contact { } section.about .contact h2 { padding:40px 0; font-size:40px; font-weight:500; color:#333333 } section.about .contact h3 { padding : 40px 0; font-size : 24px; color : #00308c; font-weight : bold } section.about .contact p { line-height:22px; font-weight:500 } section.about .contact .subway { float:left; width:49% } section.about .contact .subway > h3 { background : url('/img/subway-icon.png') no-repeat left center; padding-left : 40px } section.about .contact .subway em { width:14px; height:14px; display:inline-block; position:relative; top:4px; margin-right:3px; background:#00308c; border-radius:50%; color:#fff; font-size:10px; text-align:center; } section.about .contact .subway em i { display:block; position:relative; top:-4px; } section.about .contact .subway .guide span { display:block; font-weight: bold; color:#000; font-size:20px; padding:10px 0 } section.about .contact .subway .guide span.blue { display:inline; font-weight: bold; color:#00308c; font-size:14px; padding:10px 0 } section.about .contact .subway .guide strong { display : inline-block; width : 20px; height : 20px; background : url('../img/sub/about/about-arrow.png') no-repeat bottom center; } section.about .contact .button a { font-size:16px; color:#fff; display:block; position:relative; width:138px; padding:12px 20px; margin:5px 0; background:#a6a6a6; transition:background ease .4s; -webkit-transition:background ease .4s; } section.about .contact .button a span { position:absolute; right:20px; } section.about .contact .button a:hover { background:#0189da } section.about .contact .bus { float:right; width:49% } section.about .contact .bus > h3 { background : url('/img/bus-icon.png') no-repeat left center; padding-left : 40px } section.about .contact .bus .line { margin:19px 0; position:relative; padding-left:50px; font-size:14px; color:#666 } section.about .contact .bus .line span { font-weight:600; font-size:20px; color:#000; position:absolute; left:0; } section.about .contact .bus .line strong { display : inline-block; width : 20px; height : 20px; background : url('../img/sub/about/about-arrow.png') no-repeat bottom center; } section.about .contact .car { margin-top : 50px } section.about .contact .car > h3 { background : url('/img/car-icon.png') no-repeat left center; padding-left : 40px } section.about .contact .car > p { font-size : 18px; color : #333333; font-weight : bold; padding-left : 40px } /** 진료안내 **/ section.medical { } section.medical .menu { } section.medical .menu .tab { position:relative; cursor:pointer; overflow:hidden; cursor:pointer; perspective:600px; -webkit-perspective:800px; float:left; width:24%; margin:0 .5%; text-align:center; height:250px; border:1px solid #9fc7eb; box-shadow:2px 2px 1px 1px rgba(0,0,0,.1); -webkit-box-sizing:border-box;-moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; background : #fff } section.medical .menu.col5 .tab { width:19%; margin:0 .5%; } section.medical .menu2 { width : 70%; margin : auto } section.medical .menu .tab2 { width : 32%; margin : 0 .5%; } section.medical .menu .tab3 { max-width:350px ! important; float:none; margin:0 auto } section.medical .menu .tab span { display:block; text-align:center; position:relative; } section.medical .menu .tab span { transition:color ease .6s; -webkit-transition:color ease .6s; } section.medical .menu .tab span img { transition:opacity ease .6s; -webkit-transition:opacity ease .6s; } section.medical .menu .tab span img.on { opacity:0; position:absolute; left:50%; top:0; margin-left:-30px } section.medical .menu .tab span.name { margin-top:30px; font-size:20px; color:#333 } section.medical .menu .tab i { transition:color ease .6s; -webkit-transition:color ease .6s; font-weight:500; padding:5px 0; display:block; opacity:.6; filter:alpha(opacity=60); font-size:12px; color:#333; text-transform:uppercase } section.medical .menu .tab .number { transition:background ease .6s; -webkit-transition:background ease .6s; display:inline-block; width:36px; height:36px; text-align:center; background:#4c96d7; border-radius:50% } section.medical .menu .tab .number i { transition:color ease .6s; -webkit-transition:color ease .6s; position:relative; color:#fff; top:7px; opacity:1 } section.medical .menu .tab em { display:block; padding:20px 0; } section.medical .menu .tab .overlay { opacity:0; transform:translateZ(400px); -webkit-transform:translateZ(400px); transition:transform ease .6, opacity ease .6s; -webkit-transition:-webkit-transform ease .6s, opacity ease .6s; -ms-transition:-ms-transform ease .6s, opacity ease .6s; position:absolute; width:100%; height:100%; top:0; left:0; } section.medical .menu .tab .overlay.img0 { background:url( '../img/sub/medical/tab-img0.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img1 { background:url( '../img/sub/medical/tab-img1.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img2 { background:url( '../img/sub/medical/tab-img2.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img3 { background:url( '../img/sub/medical/tab-img3.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img4 { background:url( '../img/sub/medical/tab-img4.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img5 { background:url( '../img/sub/medical/tab-img5.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img6 { background:url( '../img/sub/medical/tab-img6.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img7 { background:url( '../img/sub/medical/tab-img7.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img8 { background:url( '../img/sub/medical/tab-img8.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img9 { background:url( '../img/sub/medical/tab-img9.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img10 { background:url( '../img/sub/medical/tab-img10.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img11 { background:url( '../img/sub/medical/tab-img11.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img11-1 { background:url( '../img/sub/medical/tab-img16.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img12 { background:url( '../img/sub/medical/tab-img12.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img13 { background:url( '../img/sub/medical/tab-img13.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img14 { background:url( '../img/sub/medical/tab-img14.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay.img15 { background:url( '../img/sub/medical/tab-img15.png' ) center center no-repeat; background-size:cover; } section.medical .menu .tab .overlay div { position:absolute; width:100%; height:100%; top:0; left:0; background:#4c96d7; opacity:.4; filter:alpha(opacity=40) } section.medical .menu .tab:hover .overlay, section.medical .menu .tab.active .overlay { transform:translateZ(0px); -webkit-transform:translateZ(0px); -ms-transform:translateZ(0px); opacity:1 } section.medical .menu .tab:hover .number, section.medical .menu .tab.active .number { background:#fff } section.medical .menu .tab:hover .rel > i, section.medical .menu .tab:hover span, section.medical .menu .tab.active .rel > i, section.medical .menu .tab.active span { color:#fff } section.medical .menu .tab:hover .number i, section.medical .menu .tab.active .number i { color:#4c96d7 } section.medical .menu .tab:hover .on, section.medical .menu .tab.active .on { opacity:1 } section.medical .menu .tab:hover .off, section.medical .menu .tab.active .off { opacity:0 } .ie9 section.medical .menu .tab .overlay, .ie8 section.medical .menu .tab .overlay, .ie7 section.medical .menu .tab .overlay { display:none } .ie9 section.medical .menu .tab:hover .overlay, .ie9 section.medical .menu .tab.active .overlay, .ie8 section.medical .menu .tab:hover .overlay, .ie8 section.medical .menu .tab.active .overlay, .ie7 section.medical .menu .tab:hover .overlay .ie7 section.medical .menu .tab.active .overlay { display:block; opacity:1 } section.medical .tab-content { /*margin-top:100px*/ } section.medical .tab-content .box-header { padding:50px 0; text-align:center } section.medical .tab-content .box-header span { display:block; padding:15px 0; font-size:18px; color:#4c96d7; font-weight:600; } section.medical .tab-content .box-header h2 { color:#333; font-size:24px; font-weight:600 } section.medical .tab-content .spine { } section.medical .tab-content .spine h3 { font-size:20px; color:#000; font-weight:600; position:relative; } section.medical .tab-content .spine h3 .more { position:absolute; right:0; } section.medical .tab-content .spine .left, section.medical .tab-content .spine .right { height:270px; border:1px solid #e5e5e7; width:49%; box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box; } section.medical .tab-content .spine.joint .left, section.medical .tab-content .spine.ioint .right { height:300px; border:1px solid #e5e5e7; width:19%; margin:0 .5%; box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box; } section.medical .tab-content .spine .inner { width:86%; margin:30px auto; position:relative } section.medical .tab-content .spine .list { margin-top:20px } section.medical .tab-content .spine .list a { font-size:16px; margin:10px 0; display:block; position:relative; padding-left:20px } section.medical .tab-content .spine .list a span { font-size:20px; position:absolute; left:0; color:#0189da } section.medical .tab-content .nonsurgical { } section.medical .tab-content .nonsurgical li { float:left; width:24%; height:300px; margin:0 .5%; border:1px solid #e5e5e7; box-shadow:1px 1px 1px 1px rgba(0,0,0,.1); box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box;} section.medical .tab-content .nonsurgical li .innner { } section.medical .tab-content .nonsurgical li article { margin-top:30px; padding:5px 0; line-height:22px } section.medical .tab-content .nonsurgical li .more { top:10px; bottom:auto; } section.medical .tab-content .nonsurgical .spine h3 {font-size:19px; letter-spacing:-1px } section.medical .tab-content .nonsurgical.management .spine li { height:auto; width:46%; margin:10px .5%; border:1px solid #e5e5e7; } section.medical .tab-content .management .spine .inner { margin:20px auto } section.medical .tab-content .box { overflow:hidden; height:0; opacity:0; /*transition:height ease .6s. opacity ease .6s; -webkit-transition:height ease .6s, opacity ease .6s; -ms-transition:height ease .6s, opacity ease .6s;*/ } section.medical .tab-content .box > div { } /** 20160927 건진센터 - 진료안내 **/ section.center { background:#f3f8ff; padding-top:140px; margin-top:-60px; perspective:600px; -webkit-perspective:600px; } section.center .menu { } section.center .menu .tab { position:relative; cursor:pointer; overflow:hidden; cursor:pointer; perspective:600px; -webkit-perspective:800px; float:left; width:24%; margin:0 .5%; text-align:center; height:250px; border:1px solid #9fc7eb; box-shadow:2px 2px 1px 1px rgba(0,0,0,.1); -webkit-box-sizing:border-box;-moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; background : #fff } section.center .menu.col5 .tab { width:19%; margin:0 .5%; } section.center .menu2 { width : 70%; margin : auto } section.center .menu .tab2 { width : 32%; margin : 0 .5%; } section.center .menu .tab3 { max-width:350px ! important; float:none; margin:0 auto } section.center .menu .tab span { display:block; text-align:center; position:relative; } section.center .menu .tab span { transition:color ease .6s; -webkit-transition:color ease .6s; } section.center .menu .tab span img { transition:opacity ease .6s; -webkit-transition:opacity ease .6s; } section.center .menu .tab span img.on { opacity:0; position:absolute; left:50%; top:0; margin-left:-30px } section.center .menu .tab span.name { margin-top:30px; font-size:20px; color:#333 } section.center .menu .tab i { transition:color ease .6s; -webkit-transition:color ease .6s; font-weight:500; padding:5px 0; display:block; opacity:.6; filter:alpha(opacity=60); font-size:12px; color:#333; text-transform:uppercase } section.center .menu .tab .number { transition:background ease .6s; -webkit-transition:background ease .6s; display:inline-block; width:36px; height:36px; text-align:center; background:#4c96d7; border-radius:50% } section.center .menu .tab .number i { transition:color ease .6s; -webkit-transition:color ease .6s; position:relative; color:#fff; top:7px; opacity:1 } section.center .menu .tab em { display:block; padding:20px 0; } section.center .menu .tab .overlay { opacity:0; transform:translateZ(400px); -webkit-transform:translateZ(400px); transition:transform ease .6, opacity ease .6s; -webkit-transition:-webkit-transform ease .6s, opacity ease .6s; -ms-transition:-ms-transform ease .6s, opacity ease .6s; position:absolute; width:100%; height:100%; top:0; left:0; } section.center .menu .tab .overlay.img0 { background:url( '../img/sub/medical/tab-img0.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img1 { background:url( '../img/sub/medical/tab-img1.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img2 { background:url( '../img/sub/medical/tab-img2.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img3 { background:url( '../img/sub/medical/tab-img3.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img4 { background:url( '../img/sub/medical/tab-img4.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img5 { background:url( '../img/sub/medical/tab-img5.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img6 { background:url( '../img/sub/medical/tab-img6.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img7 { background:url( '../img/sub/medical/tab-img7.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img8 { background:url( '../img/sub/medical/tab-img8.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img9 { background:url( '../img/sub/medical/tab-img9.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img10 { background:url( '../img/sub/medical/tab-img10.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img11 { background:url( '../img/sub/medical/tab-img11.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img11-1 { background:url( '../img/sub/medical/tab-img16.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img12 { background:url( '../img/sub/medical/tab-img12.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img13 { background:url( '../img/sub/medical/tab-img13.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img14 { background:url( '../img/sub/medical/tab-img14.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img15 { background:url( '../img/sub/medical/tab-img15.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img16 { background:url( '../img/sub/center/tab-img16.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img17 { background:url( '../img/sub/center/tab-img17.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img18 { background:url( '../img/sub/center/tab-img18.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img19 { background:url( '../img/sub/center/tab-img19.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay.img20 { background:url( '../img/sub/center/tab-img20.png' ) center center no-repeat; background-size:cover; } section.center .menu .tab .overlay div { position:absolute; width:100%; height:100%; top:0; left:0; background:#4c96d7; opacity:.4; filter:alpha(opacity=40) } section.center .menu .tab:hover .overlay, section.center .menu .tab.active .overlay { transform:translateZ(0px); -webkit-transform:translateZ(0px); -ms-transform:translateZ(0px); opacity:1 } section.center .menu .tab:hover .number, section.center .menu .tab.active .number { background:#fff } section.center .menu .tab:hover .rel > i, section.center .menu .tab:hover span, section.center .menu .tab.active .rel > i, section.center .menu .tab.active span { color:#fff } section.center .menu .tab:hover .number i, section.center .menu .tab.active .number i { color:#4c96d7 } section.center .menu .tab:hover .on, section.center .menu .tab.active .on { opacity:1 } section.center .menu .tab:hover .off, section.center .menu .tab.active .off { opacity:0 } .ie9 section.center .menu .tab .overlay, .ie8 section.center .menu .tab .overlay, .ie7 section.center .menu .tab .overlay { display:none } .ie9 section.center .menu .tab:hover .overlay, .ie9 section.center .menu .tab.active .overlay, .ie8 section.center .menu .tab:hover .overlay, .ie8 section.center .menu .tab.active .overlay, .ie7 section.center .menu .tab:hover .overlay .ie7 section.center .menu .tab.active .overlay { display:block; opacity:1 } section.center .tab-content { /*margin-top:100px*/ } section.center .tab-content .box-header { padding:50px 0; text-align:center } section.center .tab-content .box-header span { display:block; padding:15px 0; font-size:18px; color:#4c96d7; font-weight:600; } section.center .tab-content .box-header h2 { color:#333; font-size:24px; font-weight:600 } section.center .tab-content .spine { } section.center .tab-content .spine h3 { font-size:20px; color:#000; font-weight:600; position:relative; } section.center .tab-content .spine h3 .more { position:absolute; right:0; } section.center .tab-content .spine .left, section.center .tab-content .spine .right { height:270px; border:1px solid #e5e5e7; width:49%; box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box; } section.center .tab-content .spine.joint .left, section.center .tab-content .spine.ioint .right { height:300px; border:1px solid #e5e5e7; width:19%; margin:0 .5%; box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box; } section.center .tab-content .spine .inner { width:86%; margin:30px auto; position:relative } section.center .tab-content .spine .list { margin-top:20px } section.center .tab-content .spine .list a { font-size:16px; margin:10px 0; display:block; position:relative; padding-left:20px } section.center .tab-content .spine .list a span { font-size:20px; position:absolute; left:0; color:#0189da } section.center .tab-content .nonsurgical { } section.center .tab-content .nonsurgical li { float:left; width:24%; height:300px; margin:0 .5%; border:1px solid #e5e5e7; box-shadow:1px 1px 1px 1px rgba(0,0,0,.1); box-sizing:border-box; -webkit-box-sizing:border-box; -ms-box-sizing:border-box; -moz-box-sizing:border-box;} section.center .tab-content .nonsurgical li .innner { } section.center .tab-content .nonsurgical li article { margin-top:30px; padding:5px 0; line-height:22px } section.center .tab-content .nonsurgical li .more { top:10px; bottom:auto; } section.center .tab-content .nonsurgical .spine h3 {font-size:19px; letter-spacing:-1px } section.center .tab-content .nonsurgical.management .spine li { height:auto; width:46%; margin:10px .5%; border:1px solid #e5e5e7; } section.center .tab-content .management .spine .inner { margin:20px auto } section.center .tab-content .box { overflow:hidden; height:0; opacity:0; /*transition:height ease .6s. opacity ease .6s; -webkit-transition:height ease .6s, opacity ease .6s; -ms-transition:height ease .6s, opacity ease .6s;*/ } section.center .tab-content .box > div { } /** 상세 **/ section.medical { perspective:600px; -webkit-perspective:600px; background : #f3f8ff; margin-top : -60px; padding-top : 140px } section.medical .detailView { margin-top:100px } section.medical .detailView.pageIn { animation:pageAnimateIn ease .4s both; -webkit-animation:pageAnimateIn ease .4s both; /*background : #fff*/ } section.medical .detailView.pageOut { animation:pageAnimateOut ease .3s both; -webkit-animation:pageAnimateOut ease .4s both } section.medical .detailView .bg { height:194px; background:#0e6ec1 } section.medical .detailView .bg2 { height:120px; background:#0e6ec1; margin-bottom : 50px } section.medical .detailView .category { background:#fff; } section.medical .detailView .title { position:relative } section.medical .detailView .title h2 { font-size:32px; color:#fff; font-weight:600; } section.medical .detailView .title p { color:#7d7d7d; font-size:12px; padding:5px 0 5px 51px; text-transform:uppercase; position:relative; letter-spacing:1px; } section.medical .detailView .title p img { position:absolute; top:4px; left:0; } section.medical .detailView .title a.close { position:absolute; right:0; top:0 } section.medical .detailView .category { background:#fff; margin-top:20px } section.medical .detailView .category .tab { text-align:center } section.medical .detailView .category .tab a { border:1px solid #dadada; font-weight:600; color:#616161; padding:22px 0; display:block; font-size:18px; transition:color ease .6s; -webkit-transition:color ease .6s; } section.medical .detailView .category .tab a:hover { color:#000 } section.medical .detailView .category .tab a img { display:none } section.medical .detailView .category .tab a span { display:block; padding:5px 0; } section.medical .detailView .category .tab.active a { border:0; font-weight:500; color:#000 } section.medical .detailView .category .tab.active a img { display:inline } section.medical .detailView .detailInfo { margin-top:70px; display:none } section.medical .detailView .detailInfo.active { display:block } section.medical .detailView hgroup { margin-bottom:20px; } section.medical .detailView .detailInfo .list { margin-top:20px } section.medical .detailView .detailInfo .list article { width:49%; border:1px solid #e5e5e7; box-shadow:1px 1px 1px 1px rgba(0,0,0,.05); -webkit-box-shadow:1px 1px 1px 1px rgba(0,0,0,.05) } section.medical .detailView .detailInfo .list article .inner { width:92%; margin:30px auto } section.medical .detailView .detailInfo .list article h2 { color:#333; font-size:17px; font-weight:600; position:relative; padding-bottom:15px; } section.medical .detailView .detailInfo .list article h2:after { content:''; position:absolute; width:20px; height:1px; background:#4c96d7; bottom:0; left:0; } section.medical .detailView .detailInfo .list article h2 a { position:absolute; right:0; font-size:11px; color:#727272 } section.medical .detailView .detailInfo .list article h2 a i { color:#0189da; margin:0 3px } section.medical .detailView .detailInfo .list article p { margin-top:20px; line-height:20px; font-size:14px; color:#727272 } section.medical .detailView .hidden-content { perspective:600px; -webkit-perspective:600px; } section.medical .detailView .hidden-content .close { position:absolute; right:20px; top:20px } section.medical .detailView .hidden-content .view { display:none; width:98%; margin:40px auto; position:relative; border:1px solid #e5e5e7; background:#f7f8f8 } section.medical .detailView .view.active { display:block; animation:pageAnimateIn ease .4s both; -webkit-animation:pageAnimateIn ease .4s both } section.medical .detailView .hidden-content .view em { top:-25px } section.medical .detailView .hidden-content .view em.top-left { position:absolute; left:70px; } section.medical .detailView .hidden-content .view em.top-right { position:absolute; right:40%;} section.medical .detailView .hidden-content .view em.point1 { position:absolute; left:85px; } section.medical .detailView .hidden-content .view em.point2 { position:absolute; left:330px; } section.medical .detailView .hidden-content .view em.point3 { position:absolute; left:565px; } section.medical .detailView .hidden-content .view em.point4 { position:absolute; left:810px; } section.medical .detailView .hidden-content .view em.point5 { position:absolute; left:1045px;} section.medical .detailView .hidden-content .view p em { top:1px } section.medical .detailView .hidden-content .view .inner { margin:20px auto; width:94%; } section.medical .detailView .hidden-content .view .inner > div { width:50%; } section.medical .detailView .hidden-content .view .inner h2 { font-size:16px; color:#016cda; font-weight:500 } section.medical .detailView .hidden-content .view .inner span { display:block; padding:5px 0; color:#000 } section.medical .detailView .hidden-content .view .inner p { width:80%; margin:5px 0; position:relative; padding-left:13px; line-height:20px } section.medical .detailView .hidden-content .view .inner p i { position:absolute; left:0 } section.medical .detailView .hidden-content .view .inner p em { font-weight:600; position:absolute; left:5px } section.medical .detailView .hidden-content .view .inner p.first { margin-top:15px } section.medical .detailView .hidden-content .view .inner .txt-block { padding:15px 0; } section.medical .detailView .hidden-content .view .inner .txt-block b { font-weight:400; color:#000 } section.medical .detailView .hidden-content .view .footer { text-align:right; padding:10px 20px; padding-top:0 } section.medical .detailView .hidden-content .view .picture { display:inline-block; font-weight:500; } section.medical .detailView .hidden-content .view .picture span { display:none } section.medical .detailView .hidden-content .view .picture:hover span { display:inline } section.medical .detailView .view dl { margin-top:50px } section.medical .detailView .view dt { color:#333; font-size:17px; font-weight:500 } section.medical .detailView .view dd { margin:10px 0; padding-left:25px; position:relative; color:#727272; font-size:14px } section.medical .detailView .view dd span { position:absolute; left:5px; } .popup-picture { z-index:100; position:fixed; width:100%; height:100%; left:0; top:0; } .popup-picture .overlay { position:absolute; width:100%; height:100%; top:0; left:0; background:#000; opacity:.7; filter:alpha(opacity=70); } .popup-picture .close { position:absolute; } .popup-picture .image { position:absolute; } section.medical .detailView .detailInfo .list .tab2-head .icon { cursor:pointer; float:left; width:20%; text-align:center } section.medical .detailView .detailInfo .list .tab2-head .icon span { display:inline-block; position:relative; perspective:600; -webkit-perspective:600; } section.medical .detailView .detailInfo .list .tab2-head .icon span .on { position:absolute; top:0; left:0; opacity:0; transform:translateZ(100px); -webkit-transform:translateZ(100px); transition:transform ease .4s, opacity ease .4s; -webkit-transition:transform ease .4s, opacity ease .4s; } section.medical .detailView .detailInfo .list .tab2-head .icon em { margin:10px 0; display:inline-block; width:20px; height:1px; background:#0189da } section.medical .detailView .detailInfo .list .tab2-head .info { margin-top:30px } section.medical .detailView .detailInfo .list .tab2-head .info h2 { height:40px; font-size:17px; color:#333; font-weight:600 } section.medical .detailView .detailInfo .list .tab2-head .info p { padding:10px 0; width:80%; margin:0 auto; line-height:22px; font-size:14px } section.medical .detailView .detailInfo .list .tab2-head .icon:hover span .on, section.medical .detailView .detailInfo .list .tab2-head .icon.active span .on { opacity:1; transform:translateZ(0px); -webkit-transform:translateZ(0px); } section.medical .detailView .tab2-2-head { padding-bottom:50px; border-bottom:1px solid #e5e5e7 } section.medical .detailView .tab2-2 .hidden-content .view { border:0px } section.medical .detailView .tab2-2-h2 { position:relative; margin-left:30px } section.medical .detailView .tab2-2-h2 h2 { font-size:21px; color:#333; font-weight:500 } section.medical .detailView .tab2-2-h2 p { margin-top:20px; font-size:14px; color:#727272; line-height:22px } section.medical .detailView .detailInfo-tab3 { display:block } section.medical .detailView .detail-header > .container { padding-top:35px } section.medical .detailView .icon8-st-bg { background : url('../img/sub/medical/icon8-st-bg.png') no-repeat left center; padding : 10px 0 10px 44px; display : table; } section.medical .detailView .icon8-st-bg li { display : table-cell; font-size : 20px; color : #333333; font-weight : bold; vertical-align : top } section.medical .detailView .icon8-st-bg li:first-child { white-space : nowrap; } section.medical .detailView .icon8-st-bg li:last-child { font-size : 24px; font-weight : bold; line-height : 150%; padding-left : 0px; color : #000 } section.medical .detailView div.vip-text { margin : 0 50px; } section.medical .detailView div.vip-text > p { font-size : 16px; color : #016cda; margin-bottom : 10px; font-weight : normal } section.medical .detailView div.basic-check { padding-left : 50px; overflow : hidden } section.medical .detailView div.basic-check > ul { width : 16.5%; float : left; } section.medical .detailView div.basic-check > ul li { position : relative; padding-left : 15px; font-size : 14px; color : #727272; margin-bottom : 5px; font-weight: normal } section.medical .detailView div.basic-check > ul li:before { content : ''; width : 5px; height : 1px; background : #727272; position : absolute; top : 10px; left : 0; } /* 20160927 center - 상세 */ section.center { perspective:600px; -webkit-perspective:600px; background : #f3f8ff; margin-top : -60px; padding-top : 140px } section.center .detailView { margin-top:100px } section.center .detailView.pageIn { animation:pageAnimateIn ease .4s both; -webkit-animation:pageAnimateIn ease .4s both; background : #fff; } section.center .detailView.pageOut { animation:pageAnimateOut ease .3s both; -webkit-animation:pageAnimateOut ease .4s both } section.center .detailView .bg { background:#fff; height:auto; } section.center .detailView .bg2 { height:120px; background:#0e6ec1; margin-bottom : 50px } section.center .detailView .category { background:#fff; } section.center .detailView .title { position:relative } section.center .detailView .title h2 { font-size:32px; color:#333; font-weight:600; } section.center .detailView .title h2 span { color:#4c96d7; font-size:36px; letter-spacing:-2px; } section.center .detailView .title p { color:#7d7d7d; font-size:12px; padding:5px 0 5px 51px; text-transform:uppercase; position:relative; letter-spacing:1px; } section.center .detailView .title p img { position:absolute; top:4px; left:0; } section.center .detailView .title a.close { position:absolute; right:0; top:0 } section.center .detailView .category { background:#fff; margin-top:20px } section.center .detailView .category .tab { text-align:center } section.center .detailView .category .tab a { border:1px solid #dadada; font-weight:600; color:#616161; padding:22px 0; display:block; font-size:18px; transition:color ease .6s; -webkit-transition:color ease .6s; } section.center .detailView .category .tab a:hover { color:#000 } section.center .detailView .category .tab a img { display:none } section.center .detailView .category .tab a span { display:block; padding:5px 0; } section.center .detailView .category .tab.active a { border:0; font-weight:500; color:#000 } section.center .detailView .category .tab.active a img { display:inline } section.center .detailView .detailInfo { margin-top:70px; display:none } section.center .detailView .detailInfo.active { display:block } section.center .detailView hgroup { margin-bottom:20px; } section.center .detailView .detailInfo .list { margin-top:20px } section.center .detailView .detailInfo .list article { width:49%; border:1px solid #e5e5e7; box-shadow:1px 1px 1px 1px rgba(0,0,0,.05); -webkit-box-shadow:1px 1px 1px 1px rgba(0,0,0,.05) } section.center .detailView .detailInfo .list article .inner { width:92%; margin:30px auto } section.center .detailView .detailInfo .list article h2 { color:#333; font-size:17px; font-weight:600; position:relative; padding-bottom:15px; } section.center .detailView .detailInfo .list article h2:after { content:''; position:absolute; width:20px; height:1px; background:#4c96d7; bottom:0; left:0; } section.center .detailView .detailInfo .list article h2 a { position:absolute; right:0; font-size:11px; color:#727272 } section.center .detailView .detailInfo .list article h2 a i { color:#0189da; margin:0 3px } section.center .detailView .detailInfo .list article p { margin-top:20px; line-height:20px; font-size:14px; color:#727272 } section.center .detailView .hidden-content { perspective:600px; -webkit-perspective:600px; } section.center .detailView .hidden-content .close { position:absolute; right:20px; top:20px } section.center .detailView .hidden-content .view { display:none; width:98%; margin:40px auto; position:relative; border:1px solid #e5e5e7; background:#f7f8f8 } section.center .detailView .view.active { display:block; animation:pageAnimateIn ease .4s both; -webkit-animation:pageAnimateIn ease .4s both } section.center .detailView .hidden-content .view em { top:-25px } section.center .detailView .hidden-content .view em.top-left { position:absolute; left:70px; } section.center .detailView .hidden-content .view em.top-right { position:absolute; right:40%;} section.center .detailView .hidden-content .view em.point1 { position:absolute; left:85px; } section.center .detailView .hidden-content .view em.point2 { position:absolute; left:330px; } section.center .detailView .hidden-content .view em.point3 { position:absolute; left:565px; } section.center .detailView .hidden-content .view em.point4 { position:absolute; left:810px; } section.center .detailView .hidden-content .view em.point5 { position:absolute; left:1045px;} section.center .detailView .hidden-content .view p em { top:1px } section.center .detailView .hidden-content .view .inner { margin:20px auto; width:94%; } section.center .detailView .hidden-content .view .inner > div { width:50%; } section.center .detailView .hidden-content .view .inner h2 { font-size:16px; color:#016cda; font-weight:500 } section.center .detailView .hidden-content .view .inner span { display:block; padding:5px 0; color:#000 } section.center .detailView .hidden-content .view .inner p { width:80%; margin:5px 0; position:relative; padding-left:13px; line-height:20px } section.center .detailView .hidden-content .view .inner p i { position:absolute; left:0 } section.center .detailView .hidden-content .view .inner p em { font-weight:600; position:absolute; left:5px } section.center .detailView .hidden-content .view .inner p.first { margin-top:15px } section.center .detailView .hidden-content .view .inner .txt-block { padding:15px 0; } section.center .detailView .hidden-content .view .inner .txt-block b { font-weight:400; color:#000 } section.center .detailView .hidden-content .view .footer { text-align:right; padding:10px 20px; padding-top:0 } section.center .detailView .hidden-content .view .picture { display:inline-block; font-weight:500; } section.center .detailView .hidden-content .view .picture span { display:none } section.center .detailView .hidden-content .view .picture:hover span { display:inline } section.center .detailView .view dl { margin-top:50px } section.center .detailView .view dt { color:#333; font-size:17px; font-weight:500 } section.center .detailView .view dd { margin:10px 0; padding-left:25px; position:relative; color:#727272; font-size:14px } section.center .detailView .view dd span { position:absolute; left:5px; } .popup-picture { z-index:100; position:fixed; width:100%; height:100%; left:0; top:0; } .popup-picture .overlay { position:absolute; width:100%; height:100%; top:0; left:0; background:#000; opacity:.7; filter:alpha(opacity=70); } .popup-picture .close { position:absolute; } .popup-picture .image { position:absolute; } section.center .detailView .detailInfo .list .tab2-head .icon { cursor:pointer; float:left; width:20%; text-align:center } section.center .detailView .detailInfo .list .tab2-head .icon span { display:inline-block; position:relative; perspective:600; -webkit-perspective:600; } section.center .detailView .detailInfo .list .tab2-head .icon span .on { position:absolute; top:0; left:0; opacity:0; transform:translateZ(100px); -webkit-transform:translateZ(100px); transition:transform ease .4s, opacity ease .4s; -webkit-transition:transform ease .4s, opacity ease .4s; } section.center .detailView .detailInfo .list .tab2-head .icon em { margin:10px 0; display:inline-block; width:20px; height:1px; background:#0189da } section.center .detailView .detailInfo .list .tab2-head .info { margin-top:30px } section.center .detailView .detailInfo .list .tab2-head .info h2 { height:40px; font-size:17px; color:#333; font-weight:600 } section.center .detailView .detailInfo .list .tab2-head .info p { padding:10px 0; width:80%; margin:0 auto; line-height:22px; font-size:14px } section.center .detailView .detailInfo .list .tab2-head .icon:hover span .on, section.center .detailView .detailInfo .list .tab2-head .icon.active span .on { opacity:1; transform:translateZ(0px); -webkit-transform:translateZ(0px); } section.center .detailView .tab2-2-head { padding-bottom:50px; border-bottom:1px solid #e5e5e7 } section.center .detailView .tab2-2 .hidden-content .view { border:0px } section.center .detailView .tab2-2-h2 { position:relative; margin-left:30px } section.center .detailView .tab2-2-h2 h2 { font-size:21px; color:#333; font-weight:500 } section.center .detailView .tab2-2-h2 p { margin-top:20px; font-size:14px; color:#727272; line-height:22px } section.center .detailView .detailInfo-tab3 { display:block } section.center .detailView .detail-header > .container { padding-top:35px } section.center .detailView .icon8-st-bg { background : url('../img/sub/medical/icon8-st-bg.png') no-repeat left center; padding : 10px 0 10px 44px; display : table; } section.center .detailView .icon8-st-bg li { display : table-cell; font-size : 20px; color : #333333; font-weight : bold; vertical-align : top } section.center .detailView .icon8-st-bg li:first-child { white-space : nowrap; } section.center .detailView .icon8-st-bg li:last-child { font-size : 24px; font-weight : bold; line-height : 150%; padding-left : 0px; color : #000 } section.center .detailView div.vip-text { margin : 0 50px; } section.center .detailView div.vip-text > p { font-size : 16px; color : #016cda; margin-bottom : 10px; font-weight : normal } section.center .detailView div.basic-check { padding-left : 50px; overflow : hidden } section.center .detailView div.basic-check > ul { width : 16.5%; float : left; } section.center .detailView div.basic-check > ul li { position : relative; padding-left : 15px; font-size : 14px; color : #727272; margin-bottom : 5px; font-weight: normal } section.center .detailView div.basic-check > ul li:before { content : ''; width : 5px; height : 1px; background : #727272; position : absolute; top : 10px; left : 0; } /* accordion */ .smk_accordion .accordion_in { font-size:12px border: 1px solid #e5e5e7; position: relative; z-index: 10; margin-bottom : 20px; overflow: hidden; } .smk_accordion .accordion_in .acc_head { position: relative; padding:0 50px; font-size: 14px; display: block; cursor: pointer; color:#333 } .accordion_in .acc_head .acc_icon_expand { display: block; width: 15px; height: 15px; position: absolute; right : 30px; top: 50%; margin-top: -9px; background: url('../img/common/icon/plusminus.png') no-repeat; background-position : 0 0px; } .smk_accordion .accordion_in .acc_content { color: #7B7E85; padding: 3px 10px; } .smk_accordion .accordion_in.acc_active > .acc_content { display: block; } .smk_accordion .accordion_in.acc_active > .acc_head { } .smk_accordion .accordion_in.acc_active > .acc_head .acc_icon_expand { background: url('../img/common/icon/plusminus.png') no-repeat; background-position : 0 -15px; } .smk_accordion.acc_with_icon .accordion_in .acc_head, .smk_accordion.acc_with_icon .accordion_in .acc_content { padding-left: 20px; padding-right : 20px } .smk_accordion.acc_with_icon .accordion_in .acc_content::after { content : ''; position : absolute; width : 20px; height : 1px ;background : #4c96d7; top : 65px; left : 20px; } .sub-link-icon { position : relative; top : 0px; right : 0px; text-align : right } .sub-link-icon > div { display : inline; position : relative } .sub-link-icon:after { content :''; display : block; clear : both } .sub-link-icon div.sub-link-open { display : none; position : absolute; top : 23px; right : 0; width : 100px; padding : 10px; background : #fff; height : 110px; overflow : auto } .sub-link-icon div.sub-link-open ul li a { display : block; padding : 5px 0; border-bottom : 1px solid #ebebeb } .sub-link-icon > div:hover div.sub-link-open { display : block } .sub-link-icon div.naver-link { border : 3px solid #1fcc00 } .sub-link-icon div.google-link { border : 3px solid #de5543 } section.medical .detailView div.new-img { text-align : center; margin : 15px 0 } section.medical .detailView div.new-img img { max-width : 100%; height : auto !important } section.medical .detailView .spine-img { margin-top : 20px } section.medical .detailView .spine-img span { display : block; width : 49%; float : left; } section.medical .detailView .spine-img span:last-child { float : right; } section.medical .detailView .spine-img span img { width : 100%; height : auto !important } section.medical .detailView .medical-text { background : url('../img/common/icon/arrow-blue.png') no-repeat left top 5px; padding-left : 20px; margin-top : 15px; font-size : 14px; color : #666666; line-height : 150%; word-break : keep-all } section.medical .detailView .medical-text span.underline { text-decoration : underline; color : #434343; font-weight : 500 } section.medical .detailView .inner { display : table; margin : 30px 0; overflow : hidden; } section.medical .detailView .inner > li > h1 { font-size : 17px; color : #016cda; margin-bottom : 15px } section.medical .detailView .inner > li > h2 { font-size : 14px; color : #727272; margin-bottom : 30px; line-height : 150% } section.medical .detailView .inner > li > h1 > span { font-size : 14px; color : #333333; display : block; margin-top : 8px } section.medical .detailView .inner > li { display : table-cell; width : 33.3%; padding : 0 2%; border-left : 1px solid #e5e5e5 } section.medical .detailView .inner > li:first-child { border-left : none } section.medical .detailView .inner2 > li { display : table-cell; width : 50%; padding : 0 2%; border-left : 1px solid #e5e5e5 } section.medical .detailView .inner2 > li:first-child { border-left : none } section.medical .detailView .inner2 > li > ul.medical-time { margin : 30px 0; overflow : hidden } section.medical .detailView .inner2 > li > ul.medical-time > li { float : left; width : 50%; font-size : 14px; color : #727272 } section.medical .detailView .inner2 > li > ul.medical-time > li span { display : inline-block; width : 80px; font-size : 17px; color : #016cda; font-weight : normal } section.medical .detailView .inner2 > li > ul.medical-list2 { margin : 10px 0; overflow : hidden } section.medical .detailView .inner2 > li > ul.medical-list2 > li { float : left; margin-right : 20px; font-size : 14px; color : #727272; font-weight : normal; padding-left : 15px; position : relative; margin-bottom : 10px } section.medical .detailView .inner2 > li > ul.medical-list2 > li:before { content : ''; display : inline-block; position : absolute; width : 5px; height : 1px; background : #8a8a8a; top : 10px; left : 0; } section.medical .detailView .inner p { position : relative; font-size : 14px; position : relative; font-weight : normal; color : #8a8a8a;padding-left : 15px; margin-bottom : 0px; line-height : 150% } section.medical .detailView .inner p span { display : inline-block; margin-right : 20px } section.medical .detailView .inner p strong { color : #333333; font-weight : 600;} /*section.medical .detailView .inner p:before { content : ''; display : inline-block; position : absolute; width : 5px; height : 1px; background : #8a8a8a; top : 10px; left : 0; }*/ section.medical .detailView .inner ol { margin-left : 20px; } section.medical .detailView .inner ol li { position : relative; font-weight : normal; font-size : 14px; color : #727272; padding-left : 10px; margin-bottom : 0px; word-break : keep-all; overflow : hidden; line-height : 170% } section.medical .detailView .inner ol li span { display : block; float : left; width : 47%; position : relative } section.medical .detailView .inner ol li span:last-child { float : right; padding-left : 10px } section.medical .detailView .inner ol li:last-child { margin-bottom : 30px } section.medical .detailView .inner ol li:before { content :''; display : inline-block; position : absolute; width : 2px; height : 2px; background : #727272; top : 10px; left : 0; } section.medical .detailView .inner ol li span:last-child:before { content :''; display : inline-block; position : absolute; width : 2px; height : 2px; background : #727272; top : 10px; left : 0; } section.medical .detailView .inner3 { } section.medical .detailView .inner3 h1 { margin-top : 20px; margin-bottom : 10px; font-size : 17px; color : #016cda; font-weight : normal } section.medical .detailView .inner3 > h1 strong { color : #333333; font-size : 17px } section.medical .detailView .inner3 h2 { font-size : 16px; color : #333333; font-weight : normal; margin-top : 20px; margin-bottom : 5px } section.medical .detailView .inner3 > ul { margin-bottom : 60px } section.medical .detailView .inner3 > ul li, section.medical .detailView .inner3 > p { font-size : 14px; color : #727272; font-weight : normal; line-height : 160%; margin-bottom : 5px; } section.medical .detailView .inner3 > ul li strong { color : #000 } section.medical .detailView .inner3 > ul li > ul { padding-left : 15px } section.medical .detailView .inner3 p { margin : 20px 0; } section.medical .detailView .inner3 ol { margin : 20px 0; } section.medical .detailView .inner3 > div.sub-img { overflow : hidden } section.medical .detailView .inner3 > div.sub-img > p { font-size : 14px; color : #727272; font-weight : normal; line-height : 160%; margin-bottom : 5px; float : left; width : 60% } section.medical .detailView .inner3 > div.sub-img > p:last-child { width : 40% } section.medical .detailView .inner3 > div.sub-img > p img { max-width : 100%; height :auto; display : block; float : right } section.medical .detailView .sub-img2 { overflow : hidden } section.medical .detailView .sub-img2 div:first-child { float : left; width : 58%; padding : 0 1% } section.medical .detailView .sub-img2 div:last-child { float : right; width : 40%; text-align : right } section.medical .detailView .sub-img2 div img { max-width : 100% } section.medical .detailView .inner3 ol li { position : relative; font-size : 14px; color : #727272; font-weight : normal; line-height : 160%; margin-bottom : 5px; padding-left : 15px } section.medical .detailView .inner3 ol li:before { content : ''; width : 5px; height : 1px; background : #727272; position : absolute; top : 10px; left : 0; } section.medical .detailView .inner3 > div { overflow : hidden } section.medical .detailView .inner3 > div ul.list-50 { float : left; width : 45%; margin-right : 5%; } section.medical .detailView .inner3 > div ul.list-25 { float : left; width : 25% } section.medical .detailView .inner3 > div ul li { position : relative; font-size : 14px; color : #727272; font-weight : normal; line-height : 160%; margin-bottom : 5px; padding-left:15px } section.medical .detailView .inner3 > div ul li:before { content : ''; width : 5px; height : 1px; background : #727272; position : absolute; top : 10px; left : 0; } section.medical .detailView .inner3 > div.list-wrap-80 { float : left; width : 80%; } section.medical .detailView .inner3 > div.list-wrap-20 { float : right; width : 19%; background : #f6fbfe; margin-top : -67px; padding-top : 67px; padding-bottom : 30px; margin-right : -29px; padding-left : 3%; border-left : 1px solid #e5e5e5 } section.medical .detailView .inner3 > div.list-wrap-20 h1 { font-size : 14px } section.medical .detailView .inner3:after { content : ''; display : block; clear : both; } section.medical .detailView .inner4 { margin : 30px 0; } section.medical .detailView .inner4 h1 { margin-top : 20px; margin-bottom : 5px; font-size : 17px; color : #016cda; font-weight : normal } section.medical .detailView .inner4 p { padding-left : 20px; font-size : 14px; color : #727272; font-weight : normal } section.medical .detailView .inner4 p strong { color : #000 } section.medical .detailView .growh-bg { background:url('/img/medical/growth-02.jpg') no-repeat right 20px bottom } /** 나은정보통 **/ section.news { } section.news table { width:100%; border-top:1px solid #163c62 } section.news table th, section.news table td { padding:20px; 0; text-align:center; border-bottom:1px solid #e8e9ea; color : #666; font-weight : normal } section.news table th { font-size:16px; color:#333532; font-weight:500; } section.news table th, section.news table th a { color:#666; font-size:16px } section.news table td.subject { text-align:left; padding: 30px 20px; } section.news table td.subject a { color : #666666; font-size : 15px; font-weight : normal } section.news table th.subject { text-align:left } section.news table.press figure img { border:1px solid #e5e5e5; } section.news table.press td.subject { font-weight:500 } section.news table.press td.subject a { display:block; color:#48505b; } section.news table.press td.subject em { display:block; font-size:20px; color:#48505b; padding:10px 0; } section.news table.press td.subject span.title { display:block; height:62px; overflow:hidden; font-size:26px } section.news table.press td.subject span.date { display:block; margin-top:10px; font-size:14px; color:#777 } section.news table.press td.subject span.date b { text-transform:uppercase; font-weight:500 } section.news table td.content { padding:30px 0; border:0 } section.news table td.content img { max-width:100% ! important; height:auto ! important } section.news table td .sns-icon { margin : 60px 0 } section.news table td p { font-size : 16px; color : #666666; font-weight : normal; } section.news table td .sns-icon a { display : inline-block; padding : 0 2px } section.news .bbs-head { padding:15px 0; } section.news .bbs-head select { padding:9px; border:1px solid #b5b5b5; margin-right:3px } section.news .bbs-head .search-select { float:left } section.news .bbs-head .search-input { float:left } section.news .bbs-head input[type=text] { width:150px; padding:10px; border:1px solid #b5b5b5 } section.news .bbs-head input[type=submit] { padding:10px; border:1px solid #0189da; background:#0189da; color:#fff; width:84px; } section.news table.view { } section.news .view-foot-list { margin:50px 0; } section.news .view-foot-list > .left { width:1000px; border:1px solid #d8dad5 } section.news .view-foot-list > .right { width:180px } section.news .view-foot-list .right a { transition:background ease .3s, color ease .3s; -webkit-transition:background ease .3s, color ease .3s; display:block; padding:28px; text-align:center; border:1px solid #0d1a3d; background:#0d1a3d; color:#fff; font-size:16px } section.news .view-foot-list .right a:hover { background:#fff; color:#0d1a3d } section.news .view-foot-list .arrow { text-align:center; padding:10px 0; width:33px; background:#c3c3c3; transition : all .3s ease } section.news .view-foot-list .arrow:hover { background : #0d1a3d; color : #fff } section.news .view-foot-list .next { border-top:1px solid #d8dad5 } section.news .view-foot-list .subject { padding:9px 15px } section.news img.lock { position:relative; top:-1px; margin-left:10px } section.news img.rep { position:relative; top:-8px; margin-right:10px } section.news table.write { margin-top:70px } section.news table.write th { color:#333532 } section.news table.write th i { margin:0 5px; color:#0462bd } section.news table.write th label { display:inline-block; width:70px; text-align:justify; } section.news table.write th label em { display:inline-block; width:28px } section.news table.write th i.lost { color:#333532; position:relative; opacity:.6; filter:alpha(opacity=60) } section.news table.write td { text-align:left } section.news table.write input[type=text] { height:39px; border:1px solid #e0e0e0; text-indent:15px; width:960px } section.news table.write input.file { width:840px; } section.news table.write textarea { width:960px; border:1px solid #e0e0e0; padding:15px 0; text-indent:15px; height:300px } section.news .write-foot { text-align:right; padding:25px 0; } section.news .option { padding:10px 0 } section.news .option input { margin-right:5px } section.news .column { border-top:2px solid #163c62 } section.news .column .item { float:left; width:23%; margin:25px 1%; } section.news .column .item p { text-align:center; } section.news .column .item p img { max-width:264px; width:100%; height:auto; border:1px solid #e5e5e5 } section.news .column .item .info { display:block; margin:15px 0; text-align:center } section.news .column .item .info .title { font-weight:500; padding:5px 0; display:block; font-size:16px; color:#48505b } section.news .column .item .info .date { display:block; font-size:13px; color:#777; font-weight:500; } section.news .column .item-group { padding:25px 0; border-bottom:1px solid #e5e5e5 } /** 고객센터 **/ /** 초.재진 **/ .examination .progress { position:relative; margin-top:30px } .examination .progress .line { position:absolute; width:1px; height:100%; left:43px; top:0; background:#80c4ec } .examination .progress .step { background:#fff; margin-bottom:30px; border:1px solid #e5e5e5; position:relative; padding:20px 0; padding-left:80px } .examination .progress .step .ball { position:absolute; left:25px; width:35px; height:35px; background:#0189da; color:#fff; border-radius:50%; } .examination .progress .step .ball span { display:block; text-align:center; position:relative; top:10px; font-weight:600 } .examination .progress .step h2 { color:#333; font-size:22px; font-weight:600 } .examination .progress .step p { color:#727272; font-size:14px; margin-top:10px; line-height:20px } /** 입.퇴원 절차 **/ .examination.hospitalization.leave .step { padding-left:240px } .examination.hospitalization.leave .step .ball { top:50%; margin-top:-17px; } .examination.hospitalization.leave .step h2 { position:absolute; left:80px; top:50%; margin-top:-12px; width:150px } .examination.hospitalization.leave .step p { float:left; margin-top:0 } .examination.hospitalization.leave .step p span { color:#0189da } /** 증명서 발금 **/ .certificate .accordion { } .certificate .accordion .box { margin:25px 0; } .certificate .accordion .box .head { cursor:pointer; padding:15px 20px; position:relative; border:1px solid #e5e5e5;box-shadow:1px 1px 1px 0px rgba(0,0,0,.05) } .certificate .accordion .box h2 { float:left; color:#333; font-size:22px; font-weight:600; } .certificate .accordion .box h2 span { font-size:16px; font-weight:400; } .certificate .accordion .box a { float:right; font-size:11px; margin-top:6px;} .certificate .accordion .box a img { margin:0 5px; color:#0189da; position:relative; } .certificate .accordion .box a .on { display:none } .certificate .accordion .box p { font-weight:500; line-height:26px; padding-left:25px; font-size:17px; color:#727272; margin: 25px 0; position:relative; } .certificate .accordion .box p i { position:absolute; left:0; } .certificate .accordion .box p span { line-height:20px; display:block; margin:6px 0; font-size:14px; padding-left:10px; position:relative; } .certificate .accordion .box .contents { padding:0 20px; overflow:hidden; height:0; position:relative; top:-1px; transition:height ease .6s; -webkit-transition:height ease .6s; } .certificate .accordion .box .contents u { text-decoration:none; color:#016cda } .certificate .accordion .box .contents .bleat { position:relative; width:20px; height:1px; background:#4c96d7 } .certificate .accordion .box .contents table { border-top:1px solid #000 } .certificate .accordion .box .contents table th, .certificate .accordion .box .contents table td { border-left:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; padding:15px 0; text-align:center; font-size:14px; color:#666 } .certificate .accordion .box .contents table th { font-weight:500; background:#f4f6fa } .certificate .accordion .box .contents table th.first, .certificate .accordion .box .contents table td.first { border-left:0 } /** 자주묻는질문 **/ .certificate.qna .accordion .box h2 span { font-size:22px; color:#2386dc; font-weight:600; margin-right:10px; } .certificate.qna .accordion .box p u { color:#333 } .certificate.qna .accordion .box p i.answer { color:#333; font-weight:600; font-size:22px; } .certificate.qna .accordion .box a { margin-top:0; position:relative; top:-1px; } .certificate.qna .accordion .box .head a { font-size:24px; font-family:'dotum' } .certificate .accordion .box.active .on { display:inline } .certificate .accordion .box.active .off { display:none } .no-padding-left { padding-left:0!important } /** 로그인 **/ .login-wrap { margin : 100px 0; overflow : hidden } .login-wrap > div { width : 49%; float : left; border : 1px solid #e5e5e5; height : 340px } .login-wrap > div:last-child { float : right; } .login-wrap > div > div { padding : 50px } .login-wrap > div h1 { font-size : 30px; color : #383838; padding-bottom : 30px } .facebook-login > div { overflow : hidden } .login-input { width : 62%; float : left; } .login-input > li { border : 1px solid #cdcdcd; } .login-input > li:first-child { margin-bottom : 5px } .login-input > li input { border : none; width : 100%; height : 38px; line-height : 38px; text-indent : 20px } .facebook-login button { display : block; float : right; width : 35%; height : 82px; background : #0189da; color : #fff; font-size : 16px; font-weight : bold } .facebook-login p { border-top : 1px solid #ebebeb; margin-top : 40px; padding : 20px 0 } .facebook-login p a { display : block; height : 50px; line-height : 50px; text-align : center } .naver-login > div { overflow : hidden } .naver-login > div > a { display : block; width : 50%; float : left; text-align : center } .naver-login > div > a:last-child { float : right; } .naver-login > div > a span { display : block; margin-top : 10px; max-width : 200px } .naver-login > div > a img { display : block; max-width : 100% } .naver-login p { border-top : 1px solid #ebebeb; margin-top : 50px; padding : 20px 0; font-size : 13px } .depth2-bg { background:#fff; -webkit-transition:height ease .34; transition:height ease .4s; height:0; width:100%; overflow:hidden; left:0; position:absolute; z-index:10; } /* 이용약관 */ section.foot > h1 { font-size : 40px; text-align : center; color : #333333 } section.foot > h1 strong { font-size : 40px; font-weight: bold } section.foot h2 { text-align : center; font-size : 17px; color : #474747 } section.foot h3 { font-size : 14px; color : #474747; font-weight : 500; margin-top : 20px; margin-bottom : 5px } section.foot p { font-size : 14px; color : #666666; font-weight : normal; line-height : 180%; position : relative } section.foot p.sub { padding-left : 25px } section.foot p span { position : absolute; top : 0; left : 0; } section.foot ul { margin-left : 20px } section.foot ul li { position : relative; font-size : 14px; color : #666; line-height : 180%; padding-left : 15px; font-weight : normal } section.foot ul li span { position : absolute; top : 0; left : 0; } section.foot ol li { position : relative; font-size : 14px; color : #666; line-height : 180%; padding-left : 15px; font-weight : normal } section.foot ol li:before { content : '-'; display : block; position : absolute; top : 0px; left : 0; font-size : 15px; color : #666 } section.foot div h2 { margin : 40px 0; font-weight : 500 } /* 비밀번호변경 */ .edit-info { margin:160px 0 } .edit-info h2 { font-size:24px; color:#333 } .edit-info h3 { margin-top:10px } .edit-info .box-wrap { border:1px solid #d5d5d5; padding:30px; margin-top:20px } .edit-info .box-wrap ul { overflow:hidden } .edit-info .box-wrap li { width:48%; float:left; display:table; padding:7px 2% 7px 0; border-right:1px solid #eaeaea } .edit-info .box-wrap li:nth-child(2n) { float:right; border:0px none; padding-right:0 } .edit-info .box-wrap li span { display:table-cell; vertical-align:middle } .edit-info .box-wrap li span:first-child { width:120px; font-size:17px; color:#434343 } .edit-info .box-wrap li input { border:1px solid #d5d5d5; padding:10px 0; text-indent:10px; width:98% } .edit-info .box-wrap li input.disabled { background:#f4f4f4; color:#a4a4a4 } .edit-submit input { width:100%; border:1px solid #0384d8; background:#fff; color:#0384d8; height:50px; margin-top:16px; font-weight:bold; font-size:18px; cursor:pointer; transition:all .3s ease } .edit-submit input:hover, .edit-submit input:focus { background:#0384d8; color:#fff } /* 댓글목록 */ .comment-list h2 { font-weight:bold; color:#333; border-bottom:1px solid #ccc; padding-bottom:16px } .comment-list li { font-size:15px; border-bottom:1px solid #eaeaea; padding:20px 0 } .comment-list li strong { font-size:17px; color:#0189da; margin-right:15px } .comment-list li em { font-style:italic; font-size:13px } .comment-list li p:last-child { margin-top:10px; line-height:25px } /* 층별안내 모달 */ .baguetteBoxOne a:first-child, .baguetteBoxOne2 a:first-child, .baguetteBoxOne3 a:first-child, .baguetteBoxOne4 a:first-child, .baguetteBoxOne5 a:first-child { display : block } #baguetteBox-overlay { display: none; opacity: 0; position: fixed; overflow: hidden; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000000; background-color: #222; background-color: rgba(0, 0, 0, 0.8); -webkit-transition: opacity 0.5s ease; transition: opacity 0.5s ease; } #baguetteBox-overlay.visible { opacity: 1 } #baguetteBox-overlay .full-image { display: inline-block; position: relative; width: 100%; height: 100%; text-align: center } #baguetteBox-overlay .full-image figure { display: inline-block; background : #fff; padding : 100px 100px 40px 100px; position : relative } #baguetteBox-overlay .full-image img { display: inline-block; width: auto; height: auto; max-height: 100%; max-width: 100%; vertical-align: middle; } #baguetteBox-overlay .full-image figcaption { display: block; position: absolute; top : 28px; left : 0; width: 100%; text-align: center; white-space: normal; color: #000; font-size : 40px } #baguetteBox-overlay .full-image figcaption span { font-weight : bold } #baguetteBox-overlay .full-image:before { content: ""; display: inline-block; height: 50%; width: 1px; margin-right: -1px; } #baguetteBox-slider { position: absolute; left: 0; top: 0; height: 100%; width: 100%; white-space: nowrap; -webkit-transition: left 0.4s ease, -webkit-transform 0.4s ease; transition: left 0.4s ease, -moz-transform 0.4s ease; transition: left 0.4s ease, transform 0.4s ease; } #baguetteBox-slider.bounce-from-right { -webkit-animation: bounceFromRight 0.4s ease-out; animation: bounceFromRight 0.4s ease-out; } #baguetteBox-slider.bounce-from-left { -webkit-animation: bounceFromLeft 0.4s ease-out; animation: bounceFromLeft 0.4s ease-out; } @-webkit-keyframes bounceFromRight { 0% { margin-left: 0; } 50% { margin-left: -30px; } 100% { margin-left: 0; } } @keyframes bounceFromRight { 0% { margin-left: 0; } 50% { margin-left: -30px; } 100% { margin-left: 0; } } @-webkit-keyframes bounceFromLeft { 0% { margin-left: 0; } 50% { margin-left: 30px; } 100% { margin-left: 0; } } @keyframes bounceFromLeft { 0% { margin-left: 0; } 50% { margin-left: 30px; } 100% { margin-left: 0; } } .baguetteBox-button#next-button, .baguetteBox-button#previous-button { top: 42%; width: 64px; height: 100px } .baguetteBox-button { position: absolute; cursor: pointer; outline: none; border: 0 } .baguetteBox-button#next-button { right: 2%; background : url('/img/floor/hos-next-btn.png') no-repeat center center rgba(255,255,255,0.2) !important; background-size : 32px 62px !important } .baguetteBox-button#previous-button { left: 2%; background : url('/img/floor/hos-prev-btn.png') no-repeat center center rgba(255,255,255,0.2) !important; background-size : 32px 62px !important } .baguetteBox-button#close-button { top: 20px; right: 2%; right: calc(2% + 6px); width: 30px; height: 30px; background : url('/img/floor/hos-close-btn.png') no-repeat center center !important;} .baguetteBox-button svg { position: absolute; left: 0; top: 0 } .spinner { width: 40px; height: 40px; display: inline-block; position: absolute; top: 50%; left: 50%; margin-top: -20px; margin-left: -20px; } .double-bounce1, .double-bounce2 { width: 100%; height: 100%; background-color: #fff; opacity: .6; position: absolute; top: 0; left: 0; -webkit-animation: bounce 2s infinite ease-in-out; animation: bounce 2s infinite ease-in-out; } .double-bounce2 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; } @-webkit-keyframes bounce { 0%, 100% { -webkit-transform: scale(0); transform: scale(0); } 50% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounce { 0%, 100% { -webkit-transform: scale(0); -moz-transform: scale(0); transform: scale(0); } 50% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } } section.about .social-vs { background : #eaecf1 url('../img/sub/social/social-vs.jpg') no-repeat center bottom; padding : 55px; margin-bottom : 50px } section.about .social-vs h1 { font-size : 20px; font-weight : bold; color : #333 } section.about .social-vs p { font-size : 15px; color : #333 } section.about .social { display : table; width : 100%; margin-top : 20px } section.about .social > div { display : table-cell; border-top : 1px solid #e5e5e5; padding : 50px 20px 80px 20px; position : relative; vertical-align : top } section.about .social > div:first-child { border-top : 1px solid #000; width : 235px; padding : 80px 20px 20px 20px } section.about .social > div:first-child a img { width : 32px !important } section.about .social h1 { font-size : 24px; color : #333 } section.about .social ul li { float : left; width : 33.3% } section.about .social ul li .inner { margin : 10px } section.about .social ul li .inner img { width : 100% } section.about .social ul li .inner p { color : #333; font-size : 15px; margin : 10px 0; height : 35px; line-height : 35px; position : relative; text-align : center } section.about .social ul li .inner p a { display : inline-block; margin-left : 20px } section.about .social ul:after { content : ''; display : block; clear : both } .main-bg-new { background : #fafafa; height : 205px; margin-bottom : 180px } /* 비급여게시판 2016-02-24 */ .bbs-tab-head { position : relative; width : 100%; border-bottom : 1px solid #dadada } .bbs-tab { position:relative; z-index:2; top : 1px } .bbs-tab ul { max-width:1199px; margin:0 auto; overflow:hidden; border-left:1px solid #d6d6d6; position:relative; z-index:3 } .bbs-tab li { width:20%; float:left; height:70px; line-height:70px; text-align:center } .bbs-tab li a { position : relative; display:block; height:100%; border:1px solid #dadada; border-left:0px none; color:#616161; font-size:18px; background:#f4f5f7 } .bbs-tab li.active a { background:#fff url('/img/sub/medical/arrow-down.png') no-repeat center bottom ; border-bottom-color:#fff } .bbs-tab li a span { display : block; position : absolute; bottom : 1px; left : 0; width : 100%; height : 1px; background : #dadada; z-index: 0000 } .bbs-tab li.active a span { background : #fff } .price-list table { width:100% } .price-list thead th { background:#f2f2f2; border-top:1px solid #a9a9a9; border-bottom:1px solid #a9a9a9; border-left:1px solid #d9d9d9; padding:14px; font-size:15px; color:#474747 } .price-list thead th:first-child { border-left:0px none } .price-list tbody td { padding:14px; text-align:center; font-size:14px; color:#474747; border-bottom:1px solid #d9d9d9; border-left:1px solid #e5e5e5 } .price-list tbody td:first-child { border-left:0px none } section.price-bbs .bbs-head input[type=submit] { padding:10px; border:1px solid #0d1a3d; background:#0d1a3d; color:#fff; width:84px; } /* 모바일 약도 전송 2016 02 24 */ .mobile-map-show { display : none; position : absolute; top : 0; right : 0; max-width : 390px; height : 100%; padding : 20px; box-sizing : border-box; border : 1px solid #e5e5e5 } .mobile-map-show h1 { font-size : 18px; color : #0078cc; font-weight : bold } .mobile-map-show p { margin-top : 10px } .mobile-map-show p span { display : inline-block; width : 70px; height : 25px; border : 1px solid #e5e5e5 } .mobile-map-show p span input[type="tel"] { width : 100%; } .mobile-map-show p span input[type="submit"] { width : 100%; height : 100%; background : #0189da; border : none; color : #fff; display : block } .mobile-map-show p span.sm { width : 10px; border : none; text-align : center } /* 회원가입 2016 03 03 */ .member-skin { max-width : 1200px; margin : 0 auto } .member-head { padding : 100px 0 15px } .member-head h1 { font-size : 40px; text-align : center; color : #333 } .member-head h1 strong { font-size : 40px; font-weight : bold } .member-head img { display : block; width : 100px; margin : 20px auto } .member-body { padding : 20px } .member-body table { width : 100%; border-top : 1px solid #9b9b9b } .member-body table tr th, .member-body table tr td { position : relative; text-align : left; padding : 20px 10px; border-bottom : 1px solid #dfdfdf } .member-body table tr th b { position : absolute; width : 1px; height : 15px; right : 0; background : #bcbcbc } .member-body table tr td input { width : 30%; border : 1px solid #e8e9ea; height : 40px; line-height : 40px; text-indent : 15px } .member-body table tr td b { padding-left : 20px; font-size : 12px } .member-body table tr td a { display : inline-block; background : #e9e9e9; color : #000; padding : 12px 20px } .member-body table tr td.form-birth span { display : inline-block; width : 100px; margin-right:2px } .member-body table tr td.form-birth span input { width : 100% } .member-body table tr td ul { display : table; width : 100%; margin-top : 5px } .member-body table tr td ul li { display : table-cell; text-align : center } .member-body table tr td ul li input, .member-body table tr td ul li select { width : 100% } .member-body table tr td ul li p { margin : 0 10px 0 0 } .member-body i { color : #0462bd; display : inline-block; margin-right : 5px } .select-wrapper { display: block; position : relative; top : 1px; border: 1px solid #e8e9ea; cursor: pointer } .select-wrapper:after { content:'▼'; position : absolute; top : 0; right : 10px; } .select-wrapper { width: 100%; height: 40px; line-height: 40px; text-align : left; text-indent : 15px; padding-right : 8px; box-sizing : border-box } .select-wrapper .holder{ display: block; white-space: nowrap; overflow: hidden; cursor: pointer; position: relative; z-index: -1 } .select-wrapper select { position: absolute; height : 100%; top : 0px; left : 0; z-index: 2; cursor: pointer; outline: none; opacity: 0; /* CSS hacks for older browsers */ _noFocusLine: expression(this.hideFocus=true); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; } section.visual .left-side p.small { -webkit-transition:all ease .5s; -moz-transition:all ease .5s; -ms-transition:all ease .5s; transition:all ease .5s; opacity:1; } section.visual.active .left-side p.small { opacity:0; -webkit-transform:translateY(50px); -moz-transform:translateY(50px); -ms-transform:translateY(50px); transform:translateY(50px); opacity:0; } section.visual.active .left-natigator { display:none; } section.visual .left-side .inner img { -webkit-transition:all ease .5s; -moz-transition:all ease .5s; -ms-transition:all ease .5s; transition:all ease .5s; } section.visual.active .left-side .inner img { height:175px; } .ie9 section.visual.active p.small, .ie8 section.visual.active p.small, .ie7 section.visual.active p.small { display:none; } section.visual .left-side .inner p:nth-child(5) { -webkit-transition:-webkit-transform ease .5s; -moz-transition:-moz-transform ease .5s; -ms-transition:-ms-transform ease .5s; transition:transform ease .5s; } section.visual.active .left-side .inner p:nth-child(5) { -webkit-transform:translateY(-140px); -moz-transform:translateY(-140px); -ms-transform:translateY(-140px); transform:translateY(-140px); } /*2016-04-01*/ .down_box{width:100%; overflow:hidden;} a.down_link{display:block; width:48.5%; float:left; color:#535353; font-size: 18px !important; font-weight:600; line-height:55px; border:1px solid #ccc; text-align:center;} a.no_margin{margin-right:0; float:right;} a.down_link:hover{border-color:#0189da;} a img.down_arrow{ margin-left:20px;} /* 2016-09-19 */ header { height:95px;} header .container { height:100%; } header .logo { padding:0; position:absolute; top:25px; left:0; } header .utils { position:absolute; right:25px; top:13px;} header .gnbBlock { position:absolute; top:auto; bottom:0; width:100%; } header .gnb { margin:0; float:right; width:900px; } header .gnb .depth1 li { background:none; } .gnb-mobile { top:0; } /* 20160927 */ .newBoxWrap { margin:20px 0 0 50px; } .newBoxWrap h2 { font-size:20px; color:#333; margin:50px 0 20px; padding:5px 0 5px 32px; background:url('../img/sub/center/quote-ico.png') no-repeat left 5px; } .newBoxWrap h2 strong { font-size:20px; color:#333; font-weight:bold; } .newBorderBox { border:1px solid #dbdbdb; padding:35px 30px; } .newBorderBox.call { padding:35px 30px 35px 110px; background:url('../img/sub/center/call-ico.png') no-repeat 30px 35px; } .newBorderBox.call .big { color:#666; font-size:40px; font-weight:bold; padding-bottom:10px; line-height:38px; } .newBorderBox.bgGray { background:#f0f0f0 url('../img/sub/center/box-bg01.png') no-repeat 92% bottom; border:none; padding:30px 25px; } .newBorderBox.bgGray .list00 li { padding:0 0 7px 10px; font-size:16px; color:#333; background:url('../img/sub/center/list-front-ico.png') no-repeat left 6px; line-height:24px; } .newBorderBox.bgGray .list00 li p { color:#666; line-height:24px; margin:5px 0 0 10px; } .newBorderBox.bgGray .star { padding-left:20px; background:url('../img/sub/center/star-ico.png') no-repeat left 2px; position:relative; display:inline-block; } .newBorderBox.bgGray .star:after { display:block; width:100%; height:1px; content:''; position:absolute; bottom:0; left:0; background-color:#7fafd8; } .newBorderBox.bgGray .point { background-color:#8c8c8c; color:#fff; margin-top:20px; margin-bottom:10px; display:inline-block; padding:5px 7px; font-size:16px; } .newBorderBox.bgGray .list02 li { background:url('../img/sub/center/list-front-ico2.png') no-repeat left 6px; } .newBorderBox.bg02 { background:#f0f0f0 url('../img/sub/center/box-bg02.png') no-repeat 93% bottom; } .newBorderBox.bg03 { background:#f0f0f0 url('../img/sub/center/box-bg03.png') no-repeat 98% bottom; } .newBorderBox.bg04 { background:#f0f0f0 url('../img/sub/center/box-bg04.png') no-repeat 97% 50px; } .newBorderBox.bg05 { background:#f0f0f0 url('../img/sub/center/box-bg05.png') no-repeat 98% center; } .newBorderBox .blue { color:#0e6ec1; position:relative; } .newBorderBox .blue:after { width:100%; height:1px; background-color:#0e6ec1; display:block; content:''; position:absolute; bottom:0; left:0; } .newBorderBox.box { padding:20px 20px 20px 105px; } .newBorderBox.box01 { background:#f0f0f0 url('../img/sub/center/boxBg01.png') no-repeat 25px center; } .newBorderBox.box02 { background:#fff url('../img/sub/center/boxBg02.png') no-repeat 25px center; margin:14px 0; } .newBorderBox.box03 { background:#f0f0f0 url('../img/sub/center/boxBg02.png') no-repeat 25px center; } .newBorderBox.box .tit { padding-left:15px; background:url('../img/sub/center/list-front-ico.png') no-repeat left 5px; color:#333; font-size:16px; margin-top:10px; } .newBorderBox.box .con { padding:10px 20px; line-height:22px; } .newBorderBox .dpInline { display:inline-block; line-height:22px; } .newBorderBox .dpInline.left { padding-right:100px; } .newBorderBox .dpInline strong { font-weight:bold; } .newTableDiv { margin:25px; border-top:1px solid #163c62; } .newTableDiv table { width:100%; } .newTableDiv table td, .newTableDiv table th { padding:15px; text-align:center; border:1px solid #cbcbcb; } .newTableDiv table th { background-color:#f6faff; color:#333; } .newTableDiv table td { color:#666; } .newTableDiv table th:first-child, .newTableDiv table td:first-child { border-left:none; } .newTableDiv table td:last-child, .newTableDiv table th:last-child { border-right:none; } .newTableDiv table td:first-child { font-weight:bold; } .newTableDiv table .fontNor { font-weight:100; } .newTableDiv table .leftTit { display:inline-block; width:40%; } .newTableDiv-big { overflow-x:auto; } .newTableDiv-big table { min-width:1008px; } .text-left { text-align:left; } /* 20160929 메인 */ .newBgBlue { background-color:#e5f0fa; box-sizing:border-box; border:1px solid #e5e5e5; padding:10px 30px; } .mainTabList { overflow:hidden; } .mainTabList li { float:left; width:33.3%; box-sizing:border-box; transition:all .3s ease; -webkit-transition:all .3s ease; } .mainTabList li:nth-child(1) { padding:0; } .mainTabList li:nth-child(2) { padding-left:7px; } .mainTabList li:nth-child(3) { padding:0; } .mainTabList li a { display:block; padding:10px 0; text-align:center; color:#333; font-size:18px; font-weight:bold; transition:all .3s ease; -webkit-transition:all .3s ease;} .mainTabList li:nth-child(1) a { background-color:#ef7f20; } .mainTabList li:nth-child(2) a { background-color:#90c31f; } .mainTabList li:nth-child(3) a { padding:11px 0; } .mainTabList li span { vertical-align:middle; } .mainTabList li.active, .mainTabList li.active a { background-color:#e5f0fa; } .mainTabWrap { height:317px; box-sizing:border-box; } .mainTabInner { height:100%; width:100%; position:relative;} .mainTabInner video { width:100%; height:100%; } .middle-right-right-top .overlay { background-color:#0189da; opacity:0.8; } .newContent { position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; box-sizing:border-box; padding-top:50px; } .newContent h2 { font-size:18px; } .newContent span { color:#fff; background-color:#0189da; margin:8px 0; display:inline-block; padding:4px 6px 3px; font-size:14px; vertical-align:top; } .newContent p { } /* 201610120 */ .newVideoWrap { box-sizing:border-box; border:1px solid #e5e5e5; border-bottom:none; padding:10px 25px 15px; } .mainTabList2 { margin-top:10px; } .mainTabList2 li { width:49.5%; border:1px solid #e5e5e5; } .mainTabList2 li:last-child { float:right; } .mainTabList2 li a { background:#fff !important; } .mainTabList2 li a span { padding-left:10px; } .middle-right-right-bottom.new { padding:38px 0 54px; } .cs.new { padding:36px 0 17px 10px; } .main-middle .over .content .newTop { margin-top:65px; } .main-middle .over .content .newTop2 { margin-top:55px; } .middle-right-left .doctors .slide-box.newBox { padding-top:15px; } @media screen and ( max-width:1230px ) { .newVideoWrap { border-bottom:1px solid #e5e5e5; } .mainTabWrap { height:auto; } } @media screen and ( max-width:1200px ) { .newBorderBox.bgGray { background:#f0f0f0 !important; } } @media screen and ( max-width:960px ) { section.center .menu2 .tab2 { width:32%; } } @media screen and ( max-width:850px ) { .newTableDiv-block table td, .newTableDiv-block table th { display:block; width:100%; box-sizing:border-box; } .newTableDiv-block table th { display:none; } .newTableDiv-block table td { position:relative; padding-top:44px; } .newTableDiv-block table td { border-right:none !important; border-left:none !important; } .newTableDiv-block table td:before { display:block; position:absolute; top:0; left:0; width:100%; height:30px; line-height:30px; background-color:#f6faff; color:#333; border-bottom:1px solid #cbcbcb; } .newTableDiv-block table td:nth-child(1):before { content:'검사항목'; } .newTableDiv-block table td:nth-child(2):before { content:'검사종류'; } .newTableDiv-block table td:nth-child(3):before { content:'실시대상자'; } .newTableDiv-block table td.noTit:before { content:'검사종류'; } .newTableDiv-block table td.noTit2:before { content:'실시대상자'; } .newTableDiv-block table td.tit { background-color:#f6f6f6; } } @media screen and ( max-width:740px ) { .newBorderBox.bgGray .star { color:#0e6ec1 !important; } .newBorderBox.bgGray .star:after { display:none; } } @media screen and ( max-width:450px) { .login-wrap{margin:10px 0 !important;} .login-wrap>div{width:98% !important; height:auto !important; margin:0 auto !important; float:none !important;} .login-wrap>div>div{padding:6% 3%;} .login-wrap>div>div>h1{font-size:3vh !important; padding-bottom:5% !important;} } @media screen and ( max-width:640px ) { .newBorderBox .dpInline.left { padding-right:0; display:block; } .newBorderBox.box { padding:100px 20px 20px 20px; } .newBorderBox.box01, .newBorderBox.box02, .newBorderBox.box03 { background-position:center 20px; } } @media screen and ( max-width:540px ) { .newBorderBox.call { background:none; padding:25px 20px; } .newBorderBox.call .big { font-size:30px; } } @media screen and ( max-width:360px ) { .newBorderBox.call .big { font-size:24px; } } /* 20161031 */ .newMbLang { overflow:hidden; padding-bottom:50px; } .gnb-mobile li.newMbLang > a { width:33.3%; float:left; text-align:center; font-size:13px; display:block; padding:10px 0; position:relative; } .newMbLang a:after { content:''; display:block; width:1px; height:14px; position:absolute; right:0; top:11px; background-color:#000; } .newMbLang a:last-child:after { display:none; }