@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard-dynamic-subset.min.css");

/* css 리셋 */
*{margin:0;padding:0;font:inherit;color:inherit;}
*, :after, :before {box-sizing:border-box;}
:root {-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;text-size-adjust:100%;cursor:default;line-height:1.5;overflow-wrap:break-word;tab-size:4}
html, body {height:auto; margin: 4px 0;}
img, picture, video, canvas, svg {display: block;max-width:100%;}
button {background:none;border:0;cursor:pointer;}
ul,ol {list-style: none}
a, a:focus, a:active, a:hover {text-decoration: none;}
table {border-collapse:collapse;border-spacing:0;}
input:focus, textarea:focus {outline: none;}
b {font-weight: 600;}

/* 공통 */
html {font-size: 10px; color: #000; word-break: keep-all;}
header {border-bottom: 1px solid #999;}
img {max-width: 100%; object-fit: cover;}

.text-left {text-align: left !important;}
.wrap {margin: 0 auto; width: min(900px,100%); border:1px solid #c3c3c3}
.sub .color-blue {color: #0060ba;}
.sub .color-red {color: red;}
.sub {font-family: 'Pretendard', serif; padding:5.5em 4em;}
.sub .title {padding-bottom: 3em; margin-bottom: 4.5em; border-bottom: 1px solid #c6c6c6;}
.sub .title h3 {font-size: max(30px,3.8em); font-weight: 700; line-height: 1.4;}
.sub .title h3 span.small {font-size: max(26px,0.85em); font-weight: 600;}
.sub .title h4 {font-size: max(26px,3em); font-weight: 600; color: #0060ba; margin-top: 1em;}
.sub .title h5 {font-size: max(22px,2.7em); font-weight: 600; margin-bottom: 0.3em;}
.sub .content h5 {font-size: max(1.7px, 2em); font-weight: 600; margin-bottom: .5em;}
.sub .content p {font-size: max(14px, 1.7em); font-weight: 400; margin-bottom: 2em; line-height: 1.6; text-align: justify;}
.sub .content p:last-child {margin-bottom: 0;}
.sub .link {display: block; font-size: max(14px, 1.7em); margin-bottom: .5em; color: #0060ba;}
.sub .link:last-child {margin-bottom: 0;}
.sub .date {margin-bottom: 4.5em;}
.sub .date li {font-size: max(19px,2.1em); margin-bottom: 0.5em; text-indent: -5em; padding-left: 5em;}
.sub .date span {font-size: max(17px,0.9em); padding: 0.25em 1.35em; border-radius: 3em; background: #000; color: #fff; margin-right: 1em;}
.sub .table_wrap {border-top: 1px solid #0060ba; border-bottom: 1px solid #0060ba;}
.sub .table_wrap table {width: 100%;}
.sub .table_wrap tr {border-top: 1px solid #c6c6c6;}
.sub .table_wrap td {font-size: max(16px, 1.9em); font-weight: 600; padding: 1em;}
.sub .table_wrap td h4:not(:first-child) {margin-top: 1.5rem;}
.sub .table_wrap td h4 + .list-type2 {margin-top: 1rem;}
.sub .table_wrap ul {font-weight: 400;}
.sub .table_wrap ul li {font-size: max(14px, 0.9em); margin-bottom: .8em;}
.sub .table_wrap ul li:last-child {margin-bottom: 0;}
.sub .table_wrap ul li span {font-weight: 600;}
.sub .table_wrap .table-bg {background: #f3f5f9;}
.sub .table_wrap .table-bg2 {background: #d5e7f8;  border-bottom: 1px solid #0060ba; }
.sub .table_wrap .table-bg2 td {padding: 0.76em; font-size: max(20px,2.2em); color: #0060ba;}
.sub .list-type1 li { text-indent: -3em; padding-left: 3em;}
.sub .list-type2 li { text-indent: -.6em; padding-left: .6em;}

@media (max-width:900px) {
    .sub .table_wrap {overflow-x: scroll;}
    .sub .table_wrap table {min-width: 90em;}
}
@media (max-width:768px) {
    html {font-size: 9px;}
}
@media (max-width:500px) {
    html {font-size: 8px;}
}

/* sub1 */
.sub1 .img {float: right; padding-left: 2.5em; max-width: 45%;}
.sub1 .img p {font-weight: 500; margin: .8em 0; text-align: center; font-size: 1.5em;}
.sub1 .table_tit {font-size: max(20px,2.5em); font-weight: 700; text-align: center; margin-bottom: 1em;}
.sub1 .table_wrap td {font-size: max(15px,1.7em); font-weight: 400; }
.sub1 .table_wrap tr:first-child {border-top: 0;}
.sub1 .table_wrap td:not(.table-bg) {padding: 1em 1.5em;}
.sub1 .table_wrap td.table-bg {font-weight: 700; text-align: center;}

/* sub2 */
.sub2 .img {margin-bottom: 4em;}
.sub23 .cont:first-child { border-top: 1px solid #000;}
.sub23 .cont {padding: 5em 0; border-bottom: 1px solid #000;}
.sub23 .cont h2 {font-size: max(20px,2.4em); font-weight: 600; }
.sub23 .cont h2 span {padding: 0.15em 1em; border-radius: 3em; background: #000; color: #fff; margin-right: .4em;}
.sub23 .cont h3 {font-size: max(18px,2.1em); font-weight: 600; margin-top: 1.3em;}
.sub23 .cont h4 {font-size: max(17px,2em); margin: 0.25em 0; font-weight: 600;}
.sub23 .cont li {font-size: max(14px, 1.7em); font-weight: 400; margin-top: 0.3em; line-height: 1.6; text-align: justify;}
.sub23 .cont > b {font-size: max(15px, 1.8em); font-weight: 600;  line-height: 1.6; text-align: justify; display: block; position: relative; padding-left: 0.6em;}
.sub23 .cont > b::before {content:""; position: absolute; top:50%; left:0; transform: translateY(-50%); width: 3px; height: 3px;background: #000; border-radius: 50%;}
.sub23 .list-type3 li { text-indent: -1.3em; padding-left: 1.3em;}

.sub24 .img4 {display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem;}

/* sub3 */
.sub3 .table_wrap td:first-child {text-align: center;}

/* sub4 */
.sub4 {padding: 5.5em 0;}
.sub4 .title {margin: 0 4em 4.5em;}
.sub4 .people {display: grid; grid-template-columns: repeat(7, 1fr); padding: 0 3em;}
.sub4 .people li {display: flex; flex-flow: column wrap; align-items: center;}
.sub4 .people img {margin-bottom: 1em;}
.sub4 .content p {font-size: max(14px,1.6em);}
.sub4 .content img + p {font-size: max(13px,1.5em); font-weight: 300; text-align: center; letter-spacing: -0.4px;}
.sub4 .content img + p span {font-weight: 500;}
.sub4 .box_wrap {margin: 4em 4em 0; border-top: 1px solid #c6c6c6;}
.sub4 .box {display: flex; flex-flow: row wrap; padding-top: 4em; justify-content: space-between;}
.sub4 .box .img {width: min(107px,15%)}
.sub4 .box .txt {width: 82%; padding-bottom: 4em; border-bottom: 1px solid #c6c6c6;}
@media (max-width:900px) {
    .sub4 .people {padding: 0 4em; grid-template-columns: repeat(5, 1fr); gap: 2em 1em;}

}
@media (max-width:768px) {
    .sub4 .people {grid-template-columns: repeat(4, 1fr);}
}
@media (max-width:500px) {
    .sub4 .people {grid-template-columns: repeat(3, 1fr);}
}