/* common */
.subpage { overflow: hidden; position:relative; }
.subpage > section {padding: 80px 0;}
.subpage > section:nth-of-type(even) {background: #f7f7f7;}
/* font */
.h_28 {font-size: 28px; font-weight:500; color: #000; line-height: 1.3; font-family: 'Pretendard';}
.h_24 {font-size: 24px; font-weight:700; color: #000; line-height: 1.3;font-family: 'Pretendard'; }
.h_22 {font-size: 22px; font-weight:500; color: #000; line-height: 1.3;font-family: 'Pretendard'; }
.p_20 {font-size: 20px; font-weight: 300; color: #000; line-height:38px; font-family: 'Pretendard';}
.p_19 {font-size: 19px; font-weight: 300; color: #000; line-height:1.65;}
.p_18 {font-size: 18px; font-weight: 300; color: #000; line-height:1.65;}
.p_16 {font-size: 16px; font-weight: 300; color: #333; line-height:1.65;}

/* title */
.c_tit { position:relative; display: inline-block; font-size: 60px; color: #000; white-space: nowrap; font-weight: 800; }
/* .c_tit::after { content:".";  color:#0b3b63; } */
.line_tit { position:relative; padding-left:18px; margin:0 0 35px; font-weight: 700;  text-align: left ;}
.line_tit::before { content:""; position:absolute; left:0; width:4px; top:3px; height: 30px; background:#0b3b63; }
/* flex_tit */
.flex_tit {display: flex; align-items: flex-start; text-align: left ; }
.flex_tit h2 {flex-shrink: 0; margin:0 20px 0 0;}

/* flex_wrap */
.flex_wrap{display: flex; justify-content: space-between;}
.flex_wrap + .flex_wrap{margin-top: 70px;}
/* article 공통 */
.art_wrap article { padding:50px 0; border-top: 1px solid #ddd; }
.art_wrap article:first-of-type { padding-top:0; border-top: 0;}
.art_wrap article:last-of-type { padding-bottom:0; }

/* dot_list */
.dot_list {text-align: left;}
.dot_list li {position: relative; padding-left: 12px; display: flex; align-items: flex-start;}
.dot_list li span {display: inline-block; margin-right: 5px; flex-shrink: 0; }
.dot_list li::before {content: ''; display: block; width: 4px; height: 4px; background-color: #0b3b63; position: absolute; left: 0; top:11px; border-radius: 50%; }
.dot_list li:nth-child(n+2) {margin-top: 5px;}

.table_wrap table { width:100%; border-collapse: collapse; border:1px solid #ddd; border-top: 3px solid #0b3b63; text-align: center; }
.table_wrap table thead th { background:#223353; padding:16px 10px; font-weight: 600; color:#fff; font-size: 18px; border-left: 1px solid rgba(255,255,255,0.25); }
.table_wrap table tbody tr { border-top: 1px solid #ddd; }
.table_wrap table tbody th { background:#f7f7f7; padding:16px 8px; font-weight: 500; color:#000; font-size: 16px; border-right: 1px solid #ddd; }
.table_wrap table tbody th.subj {font-size: 18px; font-weight: 600; }
.table_wrap table tbody td { background:#fff; padding:16px 30px; font-weight: 300; color:#000; font-size: 16px; border-right: 1px solid #ddd; }
.table_arrow { display: none; }

/*Content CSS*/
.round_ul {display: flex; justify-content: flex-end; }
.round_ul li { position:relative; display: flex; margin:0 80px 0 0; transition: all .3s; align-items: flex-start;}
.round_ul li:last-child { margin: 0; }
.round_ul li b { display: inline-block; width:75px; height: 28px; line-height: 26px; border-radius: 14px; background-color: #979797;
color:#fff; font-size: 14px; font-weight: bold; letter-spacing: -0.35px; text-align: center; flex-shrink: 0;}
.round_ul li p { width: 100%; padding-left: 15px;  }
.round_ul li > div {width: 100%;}
.round_ul li p.flex {display: flex; align-items: flex-start; }
.round_sm_tit { display: inline-block; width:75px; height: 28px; line-height: 26px; border-radius: 14px; background-color: #979797;
color:#fff; font-size: 14px; font-weight: bold; letter-spacing: -0.35px; text-align: center; }

.c_tit + .round_ul li b {background-color: #0b3b63;}
.c_tit + .round_ul li:nth-child(even) b {background-color: #6b6e72;}

.flex_tit {justify-content: space-between; align-items: center; }
.flex_tit.top {margin-bottom:120px; align-items: flex-start; }

/* .flex_tit.top {margin-bottom: 80px; align-items: flex-start; } */
.round_box {border:4px solid #eaeaea; border-radius: 20px; padding: 90px 60px; margin-top: 35px; background-color: #fff; text-align: left; }
.round_box > div {display: flex; align-items: flex-start; }
.round_box i {display: flex; align-items: center ;justify-content: center; width: 106px; height: 106px; border-radius: 50%; background-color: #f7f7f7;
flex-shrink: 0; margin-right: 40px; }
.round_box h3 {font-weight: 800; margin-bottom:15px; }
.round_box p {color:#333; }


.flex_wrap2{display: flex; }
.bor_box{padding: 45px 49px;  box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.09); flex: 1;}
.bor_box + .bor_box{margin-left: 28px;}
.bor_box .bor_tit{display: flex; justify-content: space-between; align-items: flex-start;; margin-bottom: 30px; position: relative;}
.bor_box .bor_tit h4{font-size: 28px; }
.bor_box .bor_tit i{position: absolute; right: 0; top: 0;}
.bor_box .round_tit{display: block; width: 75px; line-height: 28px;  border-radius: 14px; background-color: #0b3b63; text-align: center; color: #fff; font-size: 14px; font-weight: 700; letter-spacing: -.35px; margin-bottom: 15px;}
.text_list{margin-top: 30px; padding-top: 30px; border-top: solid 1px #ddd;}
.text_list li{font-size: 17px; font-weight: 300; line-height: 1.7;}
.text_list li + li{margin-top: 10px;}
.text_list li span{color: #0069ba;}
/* sec1 */
#sec1 .round_box {display: flex; flex-wrap: wrap;}
/* #sec1 .round_box > div {width: 50%;} */
#sec1 .round_box > div:nth-child(n+3) {margin-top: 60px; }
@media screen and (min-width:1024px) {
    #sec1 .round_box > div {width: 55%;}
    #sec1 .round_box > div:nth-child(even) {width:45%;}
}

/* sec2 */
#sec2 .round_box > div:nth-child(n+2) {margin-top: 50px; padding-top:50px; border-top: 1px solid #ddd;}
#sec2 .round_box > div {align-items: flex-start; }
#sec2 .round_box .flex {display: flex; align-items: center;}
#sec2 .round_box .dot_list.p_16 li::before {background-color: #0d0d0d; }
#sec2 .round_box .sm_cont {display: flex; align-items: flex-start;  }
#sec2 .round_box .sm_cont b {flex-shrink: 0; margin-right: 20px; }
@media screen and (min-width:1024px) {
    #sec2 .round_box .flex { width: 55%;}
    #sec2 .round_box .sm_cont {width: 45%;}
}

/* sec3 */
#sec3 .inner {display: flex; justify-content:space-between; }
#sec3 .box_wrap {width: calc(50% - 20px); }
@media screen and (min-width:1421px) {
    #sec3 .round_box {padding:60px 60px; min-height: 252px;}
    .dot_list.p_20 li::before {top:15px;}
}


@media screen and (max-width:1420px) {
    br:not(.mob) {display: none; }
    .round_ul li {margin:0 30px 0 0;}
    .round_box {padding: 50px 30px; }

    /* content */
    .flex_tit.top {margin-bottom: 50px; display: block; text-align: center;}
    .flex_tit.top .round_ul {margin-top: 30px; justify-content: center;}
    /* sec1 */
    #sec1 .round_box > div:nth-child(odd) {padding-right: 20px;}
    /* sec2 */
    #sec2 .round_box .flex {padding-right: 20px; }
    /* sec3 */
    #sec3 .flex_tit {display: block ;}
    #sec3 .round_ul {margin-top:10px;}
    .flex_wrap{display: block; border-top: solid 1px #ddd; padding-top: 50px;}
    .flex_wrap + .flex_wrap{margin-top: 50px;}
    .flex_wrap .line_tit{margin-bottom: 20px;}

    .bor_box{padding: 35px;}
    .bor_box + .bor_box{margin-left: 20px;}
    .bor_box .bor_tit{flex-direction: column-reverse; align-items: center; }
    .bor_box .bor_tit i{position: relative; min-height: 70px; line-height: 70px;}
    .bor_box .round_tit{margin: 20px auto 8px;}





}


@media screen and (max-width:1023px) {
    /* common */
    .subpage {text-align: center;}
    .c_tit { font-size: 48px; }
    /* flex_tit */
    /* .flex_tit {display: block; }
    .flex_tit h2 {margin:0 0 10px;} */
    /* font */
    .h_28 {font-size: 22px;}
    .h_24 {font-size: 21px;}
    .h_22 {font-size: 20px;}
    .p_20 {font-size: 18px; line-height: 1.65;}
    .p_19 {font-size: 17px;}
    .p_18 {font-size: 16px; }
    .p_16 {font-size: 14px; }

    /* line_tit */
    .line_tit::before {height: 25px;}

    /* article 공통 */
    .art_wrap article { padding: 35px 0; }

    /* dots */
    .dot_list li::before {top:9px;}

    .table_wrap table thead th { padding:12px 10px; font-size: 15px; }
    .table_wrap table tbody th { padding:12px 10px; font-size: 14px; }
    .table_wrap table tbody th.subj {font-size: 15px;}
    .table_wrap table tbody td { padding:12px 10px; font-size: 14px; }

    .round_box {padding: 50px; margin-top: 25px; }

    /* content */
    /* sec1 */
    #sec1 .round_box > div {width: 100%;}
    #sec1 .round_box > div:nth-child(n+2) { margin-top: 40px;}
    /* sec2 */
    #sec2 .round_box > div {display: block; }
    #sec2 .round_box > div:nth-child(n+2) {margin-top: 40px;padding-top: 40px;}
    #sec2 .round_box .flex {padding: 0;}
    #sec2 .round_box .sm_cont {padding-left: 146px; margin-top: 15px; }
    /* sec3 */
    #sec3 .inner {display: block; }
    #sec3 .box_wrap {width: 100%; }
    #sec3 .box_wrap + .box_wrap {margin-top: 40px; }
    #sec3 .flex_tit {display: flex;}
    #sec3 .round_ul {margin-top:0; }

    .flex_wrap{ padding-top: 20px;}
    .flex_wrap + .flex_wrap{margin-top: 30px;}

    .flex_wrap .line_tit{margin-bottom: 15px;}

    .flex_wrap2{display: block;; }
    .bor_box{padding: 30px; text-align: left;}
    .bor_box + .bor_box{margin-top: 15px; margin-left: 0;}
    .bor_box .bor_tit{margin-bottom: 20px;}
    .bor_box .bor_tit h4{font-size: 22px; }
    .text_list{margin-top: 20px; padding-top: 20px;}
    .text_list li{font-size: 14px; }
    .text_list li + li{margin-top: 5px;}




}

@media screen and (max-width:767px) {
    /* common */
    .subpage > section {padding: 60px 0;}
    .c_tit { font-size: 32px; }
    .line_tit { padding-left: 13px; margin: 0 0 20px; }
    .line_tit::before { top: 3px; width: 3px; height: 20px; }
    /* font */
    .h_28 {font-size: 20px;}
    .h_24 {font-size: 19px;}
    .h_22 {font-size: 18px;}
    .p_20 {font-size: 16px; }
    .p_18 {font-size: 15px; }
    .p_16 {font-size: 13px; }

    /* article 공통 */
    .art_wrap article { padding: 30px 0; }

    /* dots */
    .dot_list li {padding-left: 10px;}
    .dot_list li::before {top:8px;}

    .table_wrap.res { overflow-x: scroll; }
    .table_wrap.res table { width: 767px; }
    .table_wrap.res table tbody td { padding: 12px 5px; line-height: 23px; }
    .table_arrow { display: block; text-align: right; }
    .table_arrow i { font-size:30px; color:#333; }

    .round_ul {margin-left: auto;}

    /* content */
    .flex_tit.top {margin-bottom: 30px; }
    .flex_tit.top .round_ul {margin-top: 20px; flex-direction: column; align-items: center;  text-align: left; }
    .flex_tit.top .round_ul li {margin:0 0 10px; min-width: 365px;}
    .flex_tit {flex-wrap: wrap;}
    /* .flex_tit h2 {margin:0 20px 5px 0;} */
    .flex_tit h2 {margin: 0;     width: 100%;}

    .round_box {padding:30px 20px; border-width: 3px;}
    .round_box i {width: 80px; height: 80px; margin-right: 20px; padding: 15px;}
    .round_box h3 {margin-bottom: 10px;}
    /* sec1 */
    #sec1 .round_box > div {align-items: flex-start; }
    /* sec2 */
    #sec2 .round_box .sm_cont {padding-left: 100px; display: block; }
    #sec2 .round_box .sm_cont b {margin: 0 0 10px;}
    #sec2 .round_box > div:nth-child(n+2) {margin-top: 30px;padding-top: 30px;}
    #sec2 .round_box .flex {align-items: flex-start; }

    /* sec3 */
    #sec3 .round_box > div {align-items: flex-start; }

    .bor_box{text-align: center;}
    .bor_box + .bor_box{margin-top: 15px;}
    .bor_box .bor_tit{flex-direction: column-reverse; margin-bottom: 15px; align-items: center;}
    .bor_box .bor_tit i{display: block; margin-bottom: 15px;}
    .bor_box .round_tit{margin: 0 auto 5px;}
    .bor_box .bor_tit h4{font-size: 20px; margin-top: 10px; text-align: center;}
    .text_list li{font-size: 13px; }
    .text_list li + li{margin-top: 3px;}

}

@media screen and (max-width:390px) {
    .flex_tit.top .round_ul li { flex-direction: column; align-items: center; min-width: 0;}
    .flex_tit.top .round_ul li p {padding: 10px 0 0;}
}
