/* basic_color */
:root {
    --did-body : #014751;
    --did-head : #D4F6F7;
    --bg-thead : #67CBCB;
    --bg-tbody : #06353B;
    --td-active : #F7DE2A;
    --tr-border : #4D6E73;
    --bg-table : #F0F8FA;
    --td-num : #FF6100;
    --did2-lhead : #117380; 
    --td2-num : #F9DE2B;
    --td2-active : #FE5F00;
    --tr2-border : #7FA3A8;
    --did2-bascfc : #232323;
}

html, body, div, span, footer, header, nav, section {
    margin: 0;
    padding: 0;
    border: 0;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

html, body {
    height: 100%;
    font-family: var(--font-bold);
}

html {
    font-size:35px;
}
/* 공통 */
.did_wrap {
    width:100%;
    height:100%;
    background:var(--did-body);
    padding:15px;
    gap : 0.5rem;
}
.did_wrap tbody tr {
    border-bottom:1px solid var(--tr-border);
}
.did_wrap table thead {
    background:var(--bg-thead);
}
.did_wrap table tbody {
    background:var(--bg-tbody);
    color:var(--bg-white);
}
.did_head {
    background:var(--did-head);
    border-radius:15px;
    padding: 0.5rem 1.5rem;

}
.did_half {
    width:100%;
    height:100%;
    background:var(--did-body);
}
.did_half tbody tr {
    border-bottom:1px solid var(--tr-border);
}
.did_half table thead {
    background:var(--bg-thead);
}
.did_half table tbody {
    background:var(--bg-tbody);
    color:var(--bg-white);
}
.did_half > div:first-child {
    padding:16px 8px 16px 16px;
}
.did_half > div:nth-child(2) {
    padding:16px 16px 16px 8px;
}
.did_table {
    background:var(--bg-table);
    padding:15px;
    border-radius:15px;
    font-family:var(--font-bold);
    font-weight:bold;
    overflow:hidden;
}
.did_table th, .did_table td {
    text-align:center;
}
.did_table tr.active {
    color:var(--td-active);
}
.did_table thead tr th {
    border-bottom:3px solid var(--bg-table);
    
}
.did_table thead tr th:first-child {
    border-radius:10px 0 0 10px;
}
.did_table thead tr th:last-child {
    border-radius:0 10px 10px 0;
}
.did_table tbody tr:first-child td:first-child {
    border-top-left-radius:10px;
}
.did_table tbody tr:first-child td:last-child {
    border-top-right-radius:10px;
}
.did_table tbody tr:last-child td:first-child {
    border-bottom-left-radius:10px;
}
.did_table tbody tr:last-child td:last-child {
    border-bottom-right-radius:10px;
}
.did_table tbody tr:last-child {
    border-bottom:0;
}

/* 가로 */
.wrap2_head {
    font-family:var(--font-bold);
    font-weight:600;
    color:#000;
}
.wrap2_head .doc_pic {
    position:relative;
    width:5%;
    min-width:65px;
    min-height:65px;
    margin-top: auto !important;
    margin-bottom: auto !important;
}
.wrap2_head .doc_pic::after {
    content:"";
    display:block;
    padding-bottom:100%;
}
.wrap2_head .doc_pic .doc_p {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:50%;
}

.wrap2_head .head_title{
    margin : auto 1rem;
}

.wrap2_head .did_hos {
    font-size:2.5vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}
.wrap2_head .did_doc {
    font-size:1.5vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}
.wrap2_head .did_doc2 {
    font-size:1.5vw;
    font-family:var(--font-bold);
    font-weight:500;
    margin-left: 0.25rem;
    margin-bottom: 0 !important;
    margin-top: 0 !important;    
}

.wrap2_head .head-count{
    margin-left: auto !important;
    margin-top: auto !important;
    margin-bottom: auto !important;
    text-align: center;
}

.wrap2_head .did_p {
    font-size:0.8vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}
.wrap2_head .did_wnum {
    line-height:3.5vw;
    color:var(--td-num);
    font-size:3.5vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}
.wrap2_head p {
    font-size:14px;
}

.wrap3_group{
    flex-basis: 50%;
    gap: 0.5rem;

}

.wrap3_head {
    font-family:var(--font-bold);
    font-weight:600;
    color:#000;
}
.wrap3_head .doc_pic {
    position:relative;
    width:14%;
    min-width:80px;
    min-height:80px;
    margin-top: auto !important;
    margin-bottom: auto !important;
}
.wrap3_head .doc_pic::after {
    content:"";
    display:block;
    padding-bottom:100%;
}
.wrap3_head .doc_pic .doc_p {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:50%;
}

.wrap3_head .head_title{
    margin : auto 1rem;
}

.wrap3_head .did_hos {
    font-size:2.5vw;
    font-weight:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}
.wrap3_head .did_doc {
    font-size:1.5vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}
.wrap3_head .did_doc2 {
    font-size:1.5vw;
    font-family:var(--font-bold);
    font-weight:500;
    margin-bottom: 0 !important;
}


.wrap3_head .head-count{
    margin-left: auto !important;
    margin-top: auto !important;
    margin-bottom: auto !important;
    text-align: center;
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
}

.wrap3_head .did_p {
    font-size:1vw;
    margin-bottom: 0 !important;
}
.wrap3_head .did_wnum {
    line-height:4.0vw;
    color:var(--td-num);
    font-size:4.0vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}
.wrap3_head p {
    font-size:1vw;
}

/* 가로 2분할 */
.did_table2 thead tr th {
    border-bottom:5px solid var(--bg-table);
}
.did_table2 {
    height:88%;
    font-size:1.6vw;
    font-family:var(--font-bold);
    font-weight:600;
}

.did_table2 table{
    width:100%;
    height:100%;
}

.did_table2 thead {
    height:12%;
}
.did_table2 td:first-child {
    width:15%;
}
.did_table2 td:nth-child(2) {
    width:25%;
}
.did_table2 td:nth-child(3) {
    width:30%;
}
.did_table2 td:last-child {
    width:30%;
}


/* DID_1 */
.did_table1 thead tr th {
    border-bottom:5px solid var(--bg-table);
}
.did_table1 {
    height:88%;
    font-size:2.2vw;
    font-family:var(--font-bold);
    font-weight:600;
}

.did_table1 table{
    width:100%;
    height:100%;
}

.did_table1 thead {
    height:12%;
}
.did_table1 td:first-child {
    width:10%;
}
.did_table1 td:nth-child(2) {
    width:35%;
}
.did_table1 td:nth-child(3) {
    width:25%;
}
.did_table1 td:last-child {
    width:30%;
}

/* did_3 */
.did_table3 {
    height:90%;
    font-size:3.4vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-top:3px;
}

.did_table3 table {
    width: 100%;
    height: 100%;
}

.did_table3 thead {
    height:7%;
}
.did_table3 td:first-child {
    width:17%;
}
.did_table3 td:nth-child(2) {
    width:28%;
}
.did_table3 td:nth-child(3) {
    width:20%;
}
.did_table3 td:last-child {
    width:35%;
}

/* did_4 */
.wrap4_head {
    font-family:var(--font-bold);
    font-weight:600;
    color:#000;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
}
.wrap4_head .doc_pic {
    position:relative;
    width:12%;
    min-width:60px;
    min-height:60px;
    margin-top: auto !important;
    margin-bottom: auto !important;    
}
.wrap4_head .doc_pic::after {
    content:"";
    display:block;
    padding-bottom:100%;
}
.wrap4_head .doc_pic .doc_p {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:50%;
}

.wrap4_head .head_title{
    margin : auto 1rem;
}

.wrap4_head .did_hos {
    font-size:4.8vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}
.wrap4_head .did_doc {
    font-size:3.2vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}
.wrap4_head .did_doc2 {
    font-size:3.2vw;
    font-family:var(--font-bold);
    font-weight:500;
    margin-bottom: 0 !important;
    margin-left: 0.25rem !important;
}

.wrap4_head .did_p {
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}

.wrap4_head .did_wnum {
    line-height:7.2vw;
    color:var(--td-num);
    font-size:7.2vw;
    font-family:var(--font-bold);
    font-weight:600;
    margin-bottom: 0 !important;
}

.wrap4_head .head-count{
    margin-left: auto !important;
    margin-top: auto !important;
    margin-bottom: auto !important;
    text-align: center;
}

.wrap4_head p {
    font-size:2vw;
}
.did_table4 {
    height:85%;
    font-size:3.4vw;
    font-family:"nanum-dbold";
}

.did_table4 table {
    width: 100%;
    height: 100%;
}

.did_table4 thead {
    height:16%;
}
.did_table4 td:first-child {
    width:17%;
}
.did_table4 td:nth-child(2) {
    width:28%;
}
.did_table4 td:nth-child(3) {
    width:20%;
}
.did_table4 td:last-child {
    width:35%;
}

/* DID_4 모달 */
.did_box {
    border-radius:5px;
    color:var(--bg-white);
    background:#059DB2;
    font-family:var(--font-bold);
}
.did_mh1 {
    font-size:4.2vw;
    font-family:var(--font-bold);
    font-weight:600;
}
.did2_tx2 {
    font-size:3.2vw;
    font-family:var(--font-bold);
    font-weight:600;
}
.did2_tx3 {
    font-size:2.8vw;
    font-family:var(--font-bold);
    font-weight:600;
}
.did2_tx4 {
    font-size:3.6vw;
    font-family:var(--font-bold);
    font-weight:600;
}


.did_mh2 {
    font-size:7.2vw;
    font-family:var(--font-bold);
    font-weight:600;
}
.did_tx2 {
    font-size:5vw;
    font-family:var(--font-bold);
    font-weight:600;
}
.did_tx3 {
    font-size:4.2vw;
    font-family:var(--font-bold);
    font-weight:600;
}
.did_tx4 {
    font-size:6.8vw;
    font-family:var(--font-bold);
    font-weight:600;
}


.did_mh3 {
    font-size:8.2vw;
    font-family:var(--font-bold);
    font-weight:600;
}
.did3_tx2 {
    font-size:5.8vw;
    font-family:var(--font-bold);
    font-weight:600;
}
.did3_tx3 {
    font-size:5vw;
    font-family:var(--font-bold);
    font-weight:600;
}
.did3_tx4 {
    font-size:7.6vw;
    font-family:var(--font-bold);
    font-weight:600;
}


/* DID1 Modal */
#did1_modal {
    width:100%;
    height:100%;
    overflow:hidden;
    color:#000;
}
#did1_modal .modal-xl {
    min-width:80%;
    width:80%;
    height:100%;
    padding:0;
    margin:auto;
}
#did1_modal .modal-content {
    width:100%;
    height:80%;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

/* DID2 Modal */
#did2_modal {
    width:50%;
    height:100%;
    overflow:hidden;
    color:#000;
}
#did2_modal .modal-lg {
    min-width:80%;
    width:80%;
    height:100%;
    padding:0;
    margin:auto;
}
#did2_modal .modal-content {
    width:100%;
    height:60%;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

#did2-1_modal {
    width:50%;
    height:100%;
    left:50%;
    overflow:hidden;
    color:#000;
}
#did2-1_modal .modal-lg {
    min-width:80%;
    width:80%;
    height:100%;
    padding:0;
    margin:auto;
}
#did2-1_modal .modal-content {
    width:100%;
    height:60%;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

/* DID3 Modal */
#did3_modal {
    width:100%;
    height:100%;
    overflow:hidden;
    color:#000;
}
#did3_modal .modal-xl {
    min-width:80%;
    width:80%;
    height:100%;
    padding:0;
    margin:auto;
}
#did3_modal .modal-content {
    width:100%;
    height:35%;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

/* DID4 Modal */
#did4_modal1 {
    width:100%;
    height:50%;
    overflow:hidden;
    color:#000;
}
#did4_modal1 .modal-xl {
    min-width:80%;
    width:80%;
    height:100%;
    padding:0;
    margin:auto;
}
#did4_modal1 .modal-content {
    width:100%;
    height:60%;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}

#did4_modal2 {
    width:100%;
    height:50%;
    top:50%;
    overflow:hidden;
    color:#000;
}
#did4_modal2 .modal-xl {
    min-width:80%;
    width:80%;
    height:100%;
    padding:0;
    margin:auto;
}
#did4_modal2 .modal-content {
    width:100%;
    height:60%;
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
}