@charset "utf-8";
@import url(font.css);

header{width:100%;  height:98px;  border-bottom: 1px solid rgba(255, 255, 255, 0.6); position: relative; z-index: 10;}
header  h1{float: left; padding-top: 25px;}
header .util{float: right; margin-top: 30px; position: relative;}
.util .search{background:rgba(255, 255, 255,0.5); width: 150px; height: 40px; float: left; position: relative; line-height: 40px; padding-left: 20px; border-radius: 20px; font-size: 0.875em; font-weight: 300; cursor: pointer;}
.util .search span{background: #ea6176 url(../images/zoom.png) center center no-repeat; background-size: 18px 18px; border-radius:0 20px 20px 0; width: 45px; height: 40px; display: block; position: absolute; right: 0; top: 0;}
.util button{position: relative; border-radius: 20px; background:rgba(255, 255, 255,0.5); height: 40px; line-height: 40px; text-align: left; margin-left: 5px; min-width: 210px; padding-left:16px; font-size: 0.875em; font-weight: 300;}
.util button span{background: #ea6176 url(../images/arrow.png) center center no-repeat; background-size: 8px 12px; border-radius:0 20px 20px 0; width: 45px; height: 40px; display: block; position: absolute; right: 0; top: 0;}
.util button.lan{background: #ea6176; color: #fff; min-width: 60px; text-align: left; padding-left:15px; font-weight: 700;}
.util button.lan:after{content: ''; display: block; position: absolute; right:10px; top: 50%; transform: translateY(-50%); background: url(../images/lan.png) center center no-repeat; width:10px; height:7px;}
.util .lang_wrap {position: absolute;right:-20px;top: 51px;background: #fff;border: 1px solid #eaeaea;width: 100px; border-radius: 5px; z-index: 15;-webkit-box-shadow: 10px 10px 31px -4px rgba(209, 209, 209, .2);box-shadow: 10px 10px 31px -4px rgba(209, 209, 209, .2);display: none;z-index: 200; } 
.util .lang_wrap>ul>li:first-child{border-bottom: 1px solid #eaeaea;}
.util .lang_wrap>ul>li a {font-size: 13px;color: #2a2a2a;display: block;line-height: 2.85em;padding-left: 10px; letter-spacing: 0;} 
.container .visual{background: url(../images/bg.png) 0 0 no-repeat;  min-height: 700px; position: relative; top: -98px;  left: 0; width: 100%; z-index: 9; background-size: cover;}
section.info{padding-top: 134px;}
section.info .profile{background: rgba(32, 42, 51, 0.5); color: #fff;  padding: 20px; width: 300px; height: 285px; float: left; text-align: center;}
section.info .profile .pic img{width: 98px; height: 98px; border-radius: 50%;}
section.info .profile .name{font-weight: 700; font-size: 1.875em; margin: 30px 0;}
section.info .profile .num{font-weight: 500; font-size: 1.25em; margin-bottom: 15px;}
section.info .profile .email a{color: #fff; letter-spacing: 0.03em;}
section.info .detail .center a{display: inline-block; width: 20px; height: 19px; background:url(../images/home.png) 0 0 no-repeat; background-size: 100%; font-size: 0; vertical-align: top; margin-top:2px;}
section.info .detail{background: rgba(32, 42, 51, 0.5); color: #fff;  padding: 35px; width: 875px; height: 285px; float: left; margin-left: 25px; position: relative; }
section.info .detail li {list-style: none;}
section.info .detail div{margin-bottom: 35px; position: relative;}
section.info .detail > div > span{display: inline-block; font-size: 1.375em; color: #fff; font-weight: 700; position: relative;}
section.info .detail > div > span:first-child{width: 80px;}
section.info .detail > div > span:first-child:after{content: ''; display: inline-block; position: absolute; top: 7px; right: -20px; width: 1px; height: 10px; background: #fff;}
section.info .detail > div > span:nth-child(2) {font-size: 1.25em; color: #fff; font-weight: 400; margin-left: 35px;}
section.info .detail > div > span:nth-child(3) {font-size: 1.25em; color: #fff; font-weight: 400; margin-left: 10px;}
section.info .detail > div > span a{display: inline-block; width: 20px; height: 19px; background:url(../images/home.png) 0 0 no-repeat; background-size: 100%; font-size: 0; vertical-align: top; margin-left: 10px; margin-top:2px;}
section.info .detail .part_txt h3{font-size: 1.375em; color: #fff; font-weight: 700;}
section.info .detail .part_txt p{color: #fff; font-size: 1.25em; margin-top: 15px; line-height: 34px;}
section.info .detail .reservation{position: absolute; right:20px; top: 30px;}
section.info .detail .reservation div{display: table; background:rgb(55, 68, 79, 0.3); border: 1px solid #959ba4; float: left; padding: 10px; border-radius: 5px; width: 170px; height: 59px; padding-left: 50px; position: relative;}
section.info .detail .reservation div.phone:before{content: ''; display: inline-block; background:url(../images/phone.png); position: absolute; left:18px; top: 17px; width: 17px; height: 25px;}
section.info .detail .reservation div.phone span{display: block; font-size: 0.938em;}
section.info .detail .reservation div.phone span:nth-child(2){ font-size: 1.063em; font-weight: 500; padding-top: 5px;}
section.info .detail .reservation div.internet{display: table; margin-left: 5px; cursor: pointer;}
section.info .detail .reservation div.internet span{display: table-cell; vertical-align: middle;}
section.info .detail .reservation div.internet:before{content: ''; display: inline-block; background:url(../images/ie.png); position: absolute; left:18px; top: 16px; width: 24px; height: 25px; background-size: 100%;}
section.info .detail .reservation div.internet span a{display: block; font-size: 0.938em; color: #fff;}
section.info .time{background: rgba(32, 42, 51, 0.7); color: #fff; float: left; margin-top: 25px; width: 100%;}
section.info .time h3{font-size: 1.5em; font-weight: 500; text-align: center; padding: 20px 0;}
section.info .time > table{width: 100%; background: transparent; border-top: 1px solid #95aabb; font-size: 1.125em; text-align: center;} 
section.info .time > table > thead{border-bottom: 1px solid #6a8499;} 
section.info .time > table > thead > tr > th{border-right: 1px solid #6a8499;}
section.info .time > table > thead > tr > th, section.info .time > table > tbody > tr > th{background:rgba(32, 42, 51, 0.9); font-size: 1.125em; font-weight: 700; padding: 16px 0;}
section.info .time > table > thead > tr > td{background:rgba(32, 42, 51, 0.6); text-align: center; }
section.info .time > table > tbody > tr > th,section.info .time > table > thead > tr > td, section.info .time > table > tbody > tr > td{border-bottom: 1px solid #6a8499; border-right: 1px solid #6a8499; }
section.info .time > table > tbody > tr > td:last-child{border-right:none;}
section.info .time > table > tbody > tr > td.on{background: #51708b;}
/* section.content{margin-top:650px;}  */
.point > p{padding:20px; float: left; background: rgba(32, 42, 51, 0.5); margin:20px 0; line-height: 24px; color: #fff; width: 100%; white-space: pre;}
section.content{position: relative; top: -50px; left: 0;}
/* tab */
section.content .tab {display: table;table-layout: fixed;width: 100%;margin: 0 auto;margin-bottom:50px; } 
section.content .tab li {display: table-cell;border: 1px solid #d7d7d7;text-align: center;border-right: none;vertical-align: middle; width: 100%;} 
section.content .tab li:last-child {border-right: 1px solid #d7d7d7; } 
section.content .tab li.active {background: #e64361; } 
section.content .tab li a {padding: 0.9em 0; display: block; font-weight: 500; } 
section.content .tab li.active a {color: #fff;}
section.content .tab_con {display: none; z-index: 10; } 
section.content .tab_con.active {display: block; }
section.content .tab_con h3{font-size: 1.75em; border-bottom: 2px solid #2a2a2a; font-weight: 500; padding-bottom: 15px;}
.tbi_01{width: 100%;}
.tbi_01 th{background: #f7f7f7; text-align: center; font-size: 1.25em; font-weight: 500; vertical-align: middle;  border-right: 1px solid #eaeaea;  border-bottom: 1px solid #eaeaea;}
.tbi_01 th:last-child{ border-right:none;}
.tbi_01 tr > td{padding:20px 20px 10px 20px;; font-size: 1.125em; border-bottom: 1px solid #eaeaea; font-weight: 300; line-height: 28px; letter-spacing: 0;}
.tbi_01 tr > td > p{ font-weight: 300; display: table; table-layout: fixed; margin-bottom: 15px; }
.tbi_01 tr > td > ul > li{position: relative; padding-left: 10px; padding-bottom: 15px;}
.tbi_01 tr > td > ul > li:last-child{padding-bottom:0px;}
.tbi_01 tr > td > ul > li::before{content: ''; position: absolute; top: 12px; left: 0; width: 4px; height: 4px; background: #2a2a2a;}
.tbi_01 tr > td > p:last-child{padding-bottom: 0;}
.tbi_01 tr > td > p > span{display: table-cell;line-height: 28px;}
.tbi_01 tr > td > p > span:first-child{position: relative; padding-right: 15px; padding-left: 10px; letter-spacing: 0; font-weight: 400; }
.tbi_01 tr > td.dw > p > span:first-child{ width: 240px;}
.tbi_01 tr > td.dw-02 > p > span:first-child{ width: 180px;}
.tbi_01 tr > td > p > span:first-child::before{content: ''; position: absolute; left: 0; top:12px; width: 3px; height: 3px; background: #2a2a2a;}
footer{padding: 30px 0; background: #444444; color: #fffefe; font-size: 0.875em; letter-spacing: 0; margin-top: 80px;}
footer p{padding-bottom: 15px;}
footer p:last-child{color: #bfbfbf;}
.dim{background: rgba(0, 0, 0, 0.5); position: fixed; left: 0; top: 0; z-index: 998; width: 100%; height: 100%; display: none;}
.doctor_search{position: fixed; top: 0; left: 0; z-index: 999; width: 100%; background: #fff; display: none;} 
.doctor_search .search_wrap{margin: 75px auto 0 auto; width: 650px;} 
.doctor_search .search_wrap input {border: 2px solid #f0667b;width: 600px;height: 45px; padding-left: 20px;color:#6f6f6f;  float: left;} 
.doctor_search .search_wrap button {float: left;background: #f0667b url(../images/zoom.png) no-repeat center center;width: 50px;height: 45px;text-indent: -99999px; } 
.doctor_search .close{position: absolute; right: 30px; top: 30px; background: url(../images/close.png); width: 38px; height: 38px; cursor: pointer;}
.doctor_search .tbi_wrap{width: 1000px; margin: 50px auto;}
.doctor_search .tbi_wrap > .tbi_01{border-top: 2px solid #2a2a2a;}
.doctor_search .tbi_wrap > .tbi_01 > tbody > tr > th{font-size: 16px; text-align: left; padding:25px 0 25px 20px} 
.doctor_search .tbi_wrap > .tbi_01 > tbody > tr > td{line-height: 24px; font-weight: 300; font-size: 1em;} 
.doctor_search .tbi_wrap > .tbi_01 > tbody > tr > td > div > button{background:#d84b62; color: #fff; font-size: 0.813em; font-weight: 700; padding:8px 20px 8px 40px; position: relative; border-radius: 5px;} 
.doctor_search .tbi_wrap > .tbi_01 > tbody > tr > td > div > button::before{background:url(../images/szoom.png) no-repeat 0 0 ; width: 16px; height: 16px; content: ''; position: absolute; left: 12px; top:10px;} 
.doctor_search .tbi_wrap > .tbi_01 > tbody > tr > td > div > button.date{margin-left: 10px;}
.doctor_search .tbi_wrap > .tbi_01 > tbody > tr > td > div > button.date::before{background:url(../images/ca.png) no-repeat 0 0 ; width: 15px; height: 15px;  } 
.doctor_search .tbi_wrap > .tbi_01 tr th > span{color: #858585;}
.doctor_search .tbi_wrap > .tbi_01 tr th > p{color: #2a2a2a; font-size: 1.563em; padding-top: 10px;}
.doctor_search .tbi_wrap .tbi_list{border-top: 2px solid #2a2a2a; border-bottom: 1px solid #eaeaea; display: table; width:100%; }
.doctor_search .tbi_wrap .tbi_list li{display: table-cell;}
.doctor_search .tbi_wrap .tbi_list li:first-child{width: 20%; background: #f7f7f7; border-right: 1px solid #eaeaea; padding-left: 15px;}
.doctor_search .tbi_wrap .tbi_list li:last-child{width: 80%; padding: 20px;}
.doctor_search .tbi_wrap .tbi_list li:last-child div:last-child{font-weight: 300; line-height: 24px;}
.doctor_search .tbi_wrap .tbi_list li span{color: #858585;}
.doctor_search .tbi_wrap .tbi_list li p{color: #2a2a2a; font-size: 1.563em; padding-top: 10px;}
.doctor_search .tbi_wrap .tbi_list li button{background:#d84b62; color: #fff; font-size: 0.813em; font-weight: 700; padding:8px 20px 8px 40px; position: relative; border-radius: 5px;} 
.doctor_search .tbi_wrap .tbi_list li button::before{background:url(../images/szoom.png) no-repeat 0 0 ; width: 16px; height: 16px; content: ''; position: absolute; left: 12px; top:10px;} 
.doctor_search .tbi_wrap .tbi_list li button.date{margin-left: 10px;}
.doctor_search .tbi_wrap .tbi_list li button.date::before{background:url(../images/ca.png) no-repeat 0 0 ; width: 15px; height: 15px;  } 

/* paging */
.paging {margin: 20px 0;text-align: center;clear: both;position: relative; } 
.paging a {position: relative;display: inline-block;min-width: 30px;min-height: 30px;line-height: 30px;vertical-align: top;border: 1px solid #d5d5d5;  background:#fff; border-radius: 50%;} 
.paging a::after {content: '';display: inline-block;clear: both; } 
.paging a.first:after {width: 10px;height: 12px;background: url('../images/first.png') 0 0 no-repeat; } 
.paging a.prev:after {width: 5px;height: 12px;background: url('../images/prev.png') 0 0 no-repeat; } 
.paging a.last:after {width: 10px;height: 12px;background: url('../images/last.png') 0 0 no-repeat; } 
.paging a.next:after {width: 5px;height: 12px;background: url('../images/next.png') 0 0 no-repeat; } 
.paging a.prev{margin-right: 10px;}
.paging a.next{margin-left: 10px;}
.paging>span {display: inline-block;margin: 0px; } 
.paging>span>a {text-align: center;} 
.paging>span>a:hover {background: #eeeeee;color: #000; } 
.paging>span>a.selected {background: #ea6176;border: 1px solid #d75065;color: #fff; } 

@media all and (max-width:1024px) {
    .mo{display:block;}
    .inner{width: 100%;}
    header{height: 70px;}
    header h1{width: 200px; height: 63px; margin-left: 15px;}
    header .util{float: none; margin-top: 0;}
    .util .search{float: none; position: absolute; top: 90px; left: 50%; transform: translateX(-50%); width: 90%; background: rgba(255, 255, 255,1);}
    .util .hospital{float: none; position: absolute; top: 145px; left: 50%; transform: translateX(-50%); width: 90%; margin-left: 0; background: rgba(255, 255, 255,1);}
    .util button.lan{position:absolute; right:15px; top: 50%; transform: translateY(-50%);}
    .container .visual{background: url(../images/mbg.png) -100px -300px no-repeat; min-height:980px; position: relative; top: 0; left: 0; width: 100%; z-index: 9;}
    section.info{_padding-top: 210px;}
    section.info .profile{float:none; width: 90%; margin:0 auto; height: auto;}
    section.info .profile .pic img{width: 80px; height: 80px;}
    section.info .profile .name{font-size: 1.25em; margin: 15px 0;}
    section.info .profile .num{font-size: 1em; letter-spacing:0.03em;}
    section.info .detail{float:none; margin-left: 0;  width: 90%; margin:0 auto; margin-top: 10px; height: auto; padding: 15px;}
    section.info .detail > div{margin-bottom: 20px;}
    section.info .detail > div > span{font-size: 1em;}
    section.info .detail > div > span:first-child{width: 60px;}
    section.info .detail > div > span:nth-child(2){font-size:0.938em; line-height: 24px;}
    section.info .detail > div > span:nth-child(3){font-size:0.938em; line-height: 24px;}
    section.info .detail .part_txt h3{font-size: 1em;}
    section.info .detail .part_txt p{font-size: 0.938em; line-height: 24px;}
    section.content{width: 90%; margin: 0 auto; margin-top:20px; position: inherit; top: 0; left: 0;}
    section.content .tab_con h3{font-size: 1em;}
    section.info .detail .reservation{display: flex; justify-content: space-around; position: relative; top: 0; left: 0; margin-bottom: 0;}
    section.info .detail .reservation div{width: 50%;}
    section.info .detail .reservation div.internet span a{font-size: 0.875em; line-height: 19px;}
    section.info .time h3{font-size:1.063em;}
    section.info .time, .point{width: 90%; margin: 10px auto; float: none;}
    .point > p{margin:0 0 10px 0;}
    section.info .time > table > thead > tr > th, section.info .time > table > tbody > tr > th{font-size:0.875em;}
    section.info .time > table > thead > tr > td{font-size:0.875em;}
    section.info .time > table > tbody > tr > td.on{font-size:0.813em; vertical-align: middle;}
    .tbi_01 th{font-size: 0.938em;}
    .tbi_01 tr > td > p{display: block; font-size: 0.875em; margin-bottom: 15px;}
    .tbi_01 tr > td > p > span{padding-bottom: 5px; display: flex; line-height: inherit;}
    .tbi_01 tr > td > p > span:last-child{line-height: 24px;}
    .tbi_01 tr > td.dw > p > span:first-child{width: auto;}
    .tbi_01 tr > td > p > span:first-child{padding-left: 0;}
    .tbi_01 tr > td > p > span:first-child::before{display: none;}
    footer{padding-left: 20px; padding-right: 20px; line-height: 24px;}
    .doctor_search .search_wrap{margin: 45px auto 0 auto; width: 100%; padding: 20px;} 
    .doctor_search .search_wrap input {border: 2px solid #f0667b;width:100%;height: 45px; padding-left: 20px;color:#6f6f6f;  float: none; font-size: 0.875em;} 
    .doctor_search .search_wrap button {float: none;width:100%;height: 45px;text-indent: -99999px; margin-top: 10px; } 
    .doctor_search .close{width:20px; height:20px; background-size:100%; top: 20px;}
    .doctor_search .tbi_wrap{margin-top:0px; padding: 20px; width: 100%;}
    .doctor_search .tbi_wrap .tbi_list li{display:block;}
    .doctor_search .tbi_wrap .tbi_list li:first-child{width: 100%; border-right:none; border-bottom: 1px solid #eaeaea; padding: 20px;}
    .doctor_search .tbi_wrap .tbi_list li:last-child{width: 100%; padding: 20px 0;}
    .util .lang_wrap{top: 60px; right: 10px;}
    .tbi_01 tr > td{font-size: 1em;}
    .tbi_01 tr > td > ul > li{font-size: 0.875em;}
    section.content .tab li a{font-size: 0.813em;}
    section.content .tab_wrap { margin-bottom: 30px; }
    section.content .tab { display:inherit; table-layout: inherit; }
    section.content .tab li{width: 25%; display:table-column; float: left; border:none;  height: 40px;  border: 1px solid #d7d7d7; border-right: none;}
    /* section.content .tab li:nth-child(3){border-right: 1px solid #d7d7d7;} */
    /* section.content .tab li:nth-child(4),section.content .tab li:nth-child(5),section.content .tab li:nth-child(6){border-top:none;} */

}
@media all and (max-width:768px){
    .container .visual{background: url(../images/mbg.png) -550px -250px no-repeat;}
}

@media all and (max-width:450px){
    section.content .tab_wrap { width: 100%; overflow-x: scroll; }
    section.content .tab { min-width: 450px; margin-bottom: 10px; }
    section.content .tab_wrap::-webkit-scrollbar { width: 100%; height: 4px;}
    section.content .tab_wrap::-webkit-scrollbar-track { background-color: #dddddd; border-radius: 2px;}
    section.content .tab_wrap::-webkit-scrollbar-thumb { background-color: #bbb; border-radius: 2px;}
    section.content .tab_wrap::-webkit-scrollbar-thumb { background-color: #bbb; border-radius: 2px; margin: 0 20px;}
}