*{margin:0; padding: 0;}

ul, li{list-style: none;}
a{color:#111; text-decoration: none;}
img{border:0;}
img, input, select{ vertical-align:middle; }
body {margin:0;padding:0;font-family:'noto san kr',sans-serif;}

@font-face{font-family:noto;
    src:url(../font/NotoSans.eot);
    src:local(※),
        url(../font/NotoSans.woff) format('woff')}

#wrap{width:100%;margin:0 auto;}
#header_wrap{min-width:1400px; height:153px; margin:0 auto; position: relative;width:1400px;}
#header_top{width:100%;}
#logo{width:297px; height:49px; float:left; margin-top:30px;}
#list_wrap{width:180px; height:44px;float:right;}
.list{float:left; margin-top:30px;width:33%; text-align: center;}
#menu_wrap{width:100%; height:75px; background-color:#282934; position: absolute; bottom:-30px; left:0; z-index:999;}
#menu_wrap a{color:#fff;}
.top_menu{width:12.5%; height:75px; float: left; text-align: center; line-height: 75px; font-size: 17px;}
.sub_menu{width:100%; overflow: hidden; background-color: rgba(73,75,98,0.8); font-size: 14px; display: none;}
.in_menu{width:100%; height:40px; line-height: 40px;}


/* 메인 비쥬얼(이브앤아담 형태 들어감) */
#banner_wrap{width:100%; height:754px;min-width:1600px;}
.ms_box { width:100%; height:100%; position:absolute; overflow:hidden; }


#section_wrap{width:1600px; margin:0 auto; position: relative; margin-bottom: 80px;}
#section_tit{text-align: center;width:100%; height:180px;line-height:180px;}
#section{width:100%; height:356px;}
#dr_wrap_mask{width:50%;height:356px; position: relative;float: left; overflow: hidden;}
#dr_wrap{width:100%; height:356px;}
.dr{width:800px; height:356px; float: left;}
#cbox_wrap_mask{width:50%;height:356px; position: relative;float: right; overflow: hidden;}
#cbox_wrap{width:1600px; height:356px;}
.cbox{width:800px; height:356px; float: left;}
.but{width:40px; height:40px; background: rgba(255,255,255,0.5); position: absolute; bottom:60px;color:#333; font-size: 18px; font-weight: 900;line-height: 40px; text-align: center; cursor: pointer; display:none;}
#left_but1{left:80px; display: none;}
#right_but1{left:130px;  display: none;}
#left_but2{left:80px;}
#right_but2{left:130px;}

.mb06_n_wrap .bx-wrapper .bx-viewport{background:none;}
.mb06_n{width:100%;margin:0 auto;}
.mb06_n_wrap .bx-wrapper .bx-pager.bx-default-pager{text-align:center;margin-left:250px;}
.mb06_n_wrap .bx-wrapper .bx-pager.bx-default-pager a{display:none;background:#000;margin:0 6px;width:5px;height:5px;text-indent:-9999999px;border-radius:25px;box-sizing:border-box;vertical-align:middle;}
.mb06_n_wrap .bx-wrapper .bx-pager.bx-default-pager a.active{display:none;background:none;border:1px solid #5a66e0;width:14px;height:14px;}
.mb06_n_wrap .bx-wrapper .bx-prev{width:47px; height:47px; left:0%;top:250px;margin-left:73px;background: url('/img/main/mb06_n_prev.png') no-repeat;display:inline-block;text-indent:99999px;}
.mb06_n_wrap .bx-wrapper .bx-next{width:47px; height:47px; left:15%;top:250px;margin-right:-167px;background: url('/img/main/mb06_n_next.png') no-repeat;display:inline-block;text-indent:99999px;}



#content_wrap{width:1600px; margin:0 auto; margin-bottom: 80px;}
#clinic_wrap{width:1600px; height:400px;}
.clinic{width:400px; height:400px; float:left;}

#info_wrap{width:100%; height:380px; border-top:solid 1px #c8cad4; min-width:1600px;font-family:'noto';}
#info{letter-spacing:-0.05em; }
#call_wrap{width:25%; height:380px; float: left; border-right:solid 1px #c8cad4; box-sizing: border-box;}
#notice_wrap{width:25%; height:380px; border-right:solid 1px #c8cad4; float: left;box-sizing: border-box;}
#mab_wrap{width:50%; height:380px; float:right;box-sizing: border-box;}

#info h1{padding: 40px 0 10px 0;}
#info h5{color:#333;}
#info h4{color:#4d5cca; font-size:45px; letter-spacing:-0.05em;font-weight: 800;}

#call{width:320px; height:380px; float:right; margin-right: 20px;}
#call_icon{width:100%; height:88px; margin-top:20px;}
.icon{width:33%; float:left;}

/*게시판*/
#notice_board{width:360px; margin:0 auto;}
#board_wrap{width:360px; height:150px; margin-top:30px; border-top:1px solid #aaa; padding: 20px 0; box-sizing: border-box;}
#board_wrap table{width:360px;border-collapse: collapse; font-size: 14px;}
#board_wrap table tr>td{padding: 2px 0;}
#more{width:70px; height:25px; background-color:#4d5cca; text-align: center;line-height:25px; border-radius: 5px;font-family:'noto sans kr';margin-top: 40px;}
#more a{color:#fff;}

#footer_wrap{width:100%; border-top:solid 1px #c8cad4;font-family:'noto';}
#footer{width:1600px; margin:0 auto; text-align: center;height:250px;}
#logo_f{width:1600px; padding:50px 0;}
#footer p{font-size: 15px;}
#footer span{color:#4d5cca; font-weight: 800;}



/* sub */

.sub_bg{width:100%;text-align:center;min-width:1600px;}
#sub_wrap{width:1400px; margin:0 auto;}
#sub_menu_wrap{width:100%; height:75px; margin:80px 0;}
#sub_menu{width:200px; height:75px; margin:0 auto; background-color:#f2f2f4; border:1px solid #d5d5d8; box-sizing:border-box;}
#sub_menu a{color:#75757e;}
#sub_menu a:hover{color:#555;font-weight:600;}
.sub_in_menu{width:100%; height:75px; line-height:75px; text-align:center; float:left; font-size:19px; border-right:1px solid #d5d5d8; box-sizing:border-box;}
.sub_in_menu:last-child{border-right:none;}
.sub_on{background-color:#5664cd;}
#sub_menu .sub_on a{color:#fff;}

#sub_menu2{width:600px; height:75px; margin:0 auto; background-color:#f2f2f4; border:1px solid #d5d5d8; box-sizing:border-box;}
#sub_menu2 a{color:#75757e;}
#sub_menu2 a:hover{color:#555;font-weight:600;}
.sub_in_menu2{width:50%; height:75px; line-height:75px; text-align:center; float:left; font-size:19px; border-right:1px solid #d5d5d8; box-sizing:border-box;}
.sub_in_menu2:last-child{border-right:none;}
.sub_on{background-color:#5664cd;}
#sub_menu2 .sub_on a{color:#fff;}

#sub_menu3{width:1200px; height:75px; margin:0 auto; background-color:#f2f2f4; border:1px solid #d5d5d8; box-sizing:border-box;}
#sub_menu3 a{color:#75757e;}
#sub_menu3 a:hover{color:#555;font-weight:600;}
.sub_in_menu3{width:33%; height:75px; line-height:75px; text-align:center; float:left; font-size:19px; border-right:1px solid #d5d5d8; box-sizing:border-box;}
.sub_in_menu3:last-child{border-right:none;}
.sub_on{background-color:#5664cd;}
#sub_menu3 .sub_on a{color:#fff;}

#sub_menu4{width:1200px; height:75px; margin:0 auto; background-color:#f2f2f4; border:1px solid #d5d5d8; box-sizing:border-box;}
#sub_menu4 a{color:#75757e;}
#sub_menu4 a:hover{color:#555;font-weight:600;}
.sub_in_menu4{width:25%; height:75px; line-height:75px; text-align:center; float:left; font-size:19px; border-right:1px solid #d5d5d8; box-sizing:border-box;}
.sub_in_menu4:last-child{border-right:none;}
.sub_on{background-color:#5664cd;}
#sub_menu4 .sub_on a{color:#fff;}

#sub_menu5{width:1202px; height:75px; margin:0 auto; background-color:#f2f2f4; border:1px solid #d5d5d8; box-sizing:border-box;}
#sub_menu5 a{color:#75757e;}
#sub_menu5 a:hover{color:#555;font-weight:600;}
.sub_in_menu5{width:240px; height:75px; line-height:75px; text-align:center; float:left; font-size:19px; border-right:1px solid #d5d5d8; box-sizing:border-box;}
.sub_in_menu5:last-child{border-right:none;}
.sub_on{background-color:#5664cd;}
#sub_menu5 .sub_on a{color:#fff;}

#sub_menu6{width:1202px; height:75px; margin:0 auto; background-color:#f2f2f4; border:1px solid #d5d5d8; box-sizing:border-box;}
#sub_menu6 a{color:#75757e;}
#sub_menu6 a:hover{color:#555;font-weight:600;}
.sub_in_menu6{width:200px; height:75px; line-height:75px; text-align:center; float:left; font-size:19px; border-right:1px solid #d5d5d8; box-sizing:border-box;}
.sub_in_menu6:last-child{border-right:none;}
.sub_on{background-color:#5664cd;}
#sub_menu6 .sub_on a{color:#fff;}

#sub_menu7{width:1206px; height:75px; margin:0 auto; background-color:#f2f2f4; border:1px solid #d5d5d8; box-sizing:border-box;}
#sub_menu7 a{color:#75757e;}
#sub_menu7 a:hover{color:#555;font-weight:600;}
.sub_in_menu7{width:172px; height:75px; line-height:75px; text-align:center; float:left; font-size:19px; border-right:1px solid #d5d5d8; box-sizing:border-box;}
.sub_in_menu7:last-child{border-right:none;}
.sub_on{background-color:#5664cd;}
#sub_menu7 .sub_on a{color:#fff;}

#sub_content_wrap{text-align:center;}
#sub_content_wrap_bbs{text-align:left;}
.sub_tit{width:100%; text-align:center;font-size:25px;}
.sub_tit img{margin:20px 0;}

.sub_content{}

.doctors-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    margin: 50px auto;
    max-width: 1200px;
    width:100%;
}

.doctor-card {
    background: white;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    align-items: stretch;
    gap: 30px;
}

.doctor-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

.doctor-photo {
    width: 300px;
    border-radius: 12px;
    background: #e0e0e0;
    flex-shrink: 0;
    align-self: stretch;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #999;
    overflow: hidden;
}

.doctor-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.doctor-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 15px;
    text-align:left;
}

.doctor-name {
    font-size: 24px;
    font-weight: bold;
    color: #2c5aa0;
    margin-bottom: 5px;
}

.doctor-department {
    font-size: 14px;
    color: #666;
    margin-bottom: 0;
}

.schedule-section {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 20px;
}

.schedule-title {
    font-size: 16px;
    font-weight: bold;
    color: #333;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
}

.schedule-title::before {
    content: "🕐";
    margin-right: 8px;
}

.schedule-table {
    width: 100%;
    border-collapse: collapse;
    text-align: center;
}

.schedule-table th {
    background: #2c5aa0;
    color: white;
    padding: 10px 5px;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid #1e4080;
}

.schedule-table td {
    padding: 10px 5px;
    font-size: 14px;
    border: 1px solid #e0e0e0;
    background: white;
}

.schedule-note {
    margin-top: 12px;
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}

.schedule-note div {
    padding: 3px 0;
}

.detail-btn {
    width: 100%;
    padding: 12px;
    background: #2c5aa0;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s ease;
    margin-top: 15px;
}

.detail-btn:hover {
    background: #1e4080;
}

/* 모달 스타일 */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.modal-content {
    background-color: white;
    text-align:left;
    margin: 50px auto;
    padding: 0;
    border-radius: 12px;
    width: 90%;
    max-width: 800px;
    max-height: 85vh;
    overflow-y: auto;
    animation: slideDown 0.3s ease;
    box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}

@keyframes slideDown {
    from {
        transform: translateY(-50px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.modal-header {
    background: linear-gradient(135deg, #2c5aa0 0%, #1e4080 100%);
    color: white;
    padding: 30px;
    border-radius: 12px 12px 0 0;
    position: relative;
}

.modal-doctor-name {
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 8px;
}

.modal-department {
    font-size: 16px;
    opacity: 0.9;
}

.close {
    position: absolute;
    right: 25px;
    top: 25px;
    color: white;
    font-size: 32px;
    font-weight: bold;
    cursor: pointer;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background 0.3s ease;
}

.close:hover {
    background: rgba(255,255,255,0.2);
}

.modal-body {
    padding: 30px;
}

.detail-section {
    margin-bottom: 30px;
}

.detail-section:last-child {
    margin-bottom: 0;
}

.detail-title {
    font-size: 18px;
    font-weight: bold;
    color: #2c5aa0;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 2px solid #e0e0e0;
}

.detail-content {
    font-size: 15px;
    line-height: 1.8;
    color: #555;
}

.detail-content ul {
    list-style: none;
    padding-left: 0;
}

.detail-content li {
    padding: 8px 0;
    padding-left: 20px;
    position: relative;
}

.detail-content li.img {padding-left:0;}

.detail-content li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #2c5aa0;
    font-weight: bold;
}

.detail-content li.img::before {
    display:none;
}

@media (max-width: 1024px) {
    .doctor-card {
        flex-direction: column;
        text-align: center;
        align-items: center;
    }

    .doctor-photo {
        margin: 0 auto;
        width: 200px;
        height: 200px;
        align-self: center;
    }

    .doctor-name {
        text-align: center;
    }

    .doctor-department {
        text-align: center;
        margin-bottom: 20px;
    }
}

@media (max-width: 768px) {
    .modal-content {
        margin: 20px auto;
        width: 95%;
        max-height: 90vh;
    }

    .page-title {
        font-size: 24px;
        margin-bottom: 30px;
    }
}