/* 추후 w-sub.css에 옮김 */
.wrap-fair {padding: 80px 120px; background: url('../../images/sub/bg-freefair.jpg') no-repeat center / cover;}
.wrap-fair .subject strong {position: relative; display: inline-block; margin-bottom: 60px; padding-bottom: 40px; font-family: pm; font-size: 35px; color: #3176d0;}
.wrap-fair .subject strong::after {content: ''; position: absolute; left: -120px; bottom: 0; width: calc(100% + 120px); height: 1px; background: #3176d0;}
.wrap-fair .desc strong {display: block; margin-bottom: 30px; font-family: psb; font-size: 22px; color: #333;}
.wrap-fair .desc p {margin-bottom: 40px; font-family: pr; font-size: 18px; color: #333;}
.wrap-fair .sign {text-align: right;}
.wrap-fair .sign .date {font-family: pr; font-size: 20px; color: #121212;}
.wrap-fair .sign .name span {padding-right: 10px; font-family: pm; font-size: 20px; color: #152e6e;}
.wrap-fair .sign .name strong {font-family: pb; font-size: 25px; color: #121212;}

@media screen and (max-width: 1300px) {
    .wrap-fair {padding: 40px 60px;}
    .wrap-fair .subject strong {margin-bottom: 40px; padding-bottom: 30px; font-size: 25px;}
    .wrap-fair .subject strong::after {left: -60px;}
    .wrap-fair .desc strong {font-size: 20px;}
    .wrap-fair .desc p {margin-bottom: 30px; font-size: 17px;}
}

@media screen and (max-width: 768px) {
    .wrap-fair {padding: 30px;}
    .wrap-fair .subject strong {font-size: 22px;}
    .wrap-fair .subject strong::after {left: -30px; width: 100%;}
    .wrap-fair .desc strong {font-size: 18px;}
    .wrap-fair .desc p {font-size: 15px;}
    .wrap-fair .sign .date {font-size: 18px;}
    .wrap-fair .sign .name span {font-size: 18px;}
    .wrap-fair .sign .name strong {font-size: 22px;}
}

/* 내부통제제도 */
.wrap-poly .row {display: flex; padding-bottom: 40px;}
.wrap-poly .row .title {position: relative; flex-shrink: 0; width: 330px;}
.wrap-poly .row .title::after {content: ''; position: absolute; right: 60px; top: 17px; width: 90px; height: 1px; background: #152e6e;}
.wrap-poly .row .title strong {font-family: pb; font-size: 25px; color: #333333;}
.wrap-poly .row .desc {flex-grow: 1;}
.wrap-poly .line1 .year ul {display: flex; background: #eeeeee; border: 1px solid #cccccc;}
.wrap-poly .line1 .year li {position: relative; width: 33.333%; padding: 15px 0; font-family: pm; font-size: 25px; text-align: center; color: #333333;}
.wrap-poly .line1 .year li::after {content: ''; position: absolute; right: 0; top: 50%; width: 22px; height: 22px; background: url('../../images/sub/deco-poly1.png') no-repeat center; transform: translate(0 , -50%);}
.wrap-poly .line1 .year li:last-child::after {display: none;}
.wrap-poly .line1 .text {padding-top: 10px;}
.wrap-poly .line1 .text > ul {display: flex; width: calc(100% + 20px);}
.wrap-poly .line1 .text > ul > li {width: 33.333%; padding-right: 20px;}
.wrap-poly .line1 .text strong {display: flex; justify-content: center; align-items: center; width: 100%; height: 70px; border-radius: 5px 5px 0 0; font-family: pb; font-size: 20px; color: #ffffff;}
.wrap-poly .line1 .text .color1 strong {background: #00abb3;}
.wrap-poly .line1 .text .color2 strong {background: #3176d0;}
.wrap-poly .line1 .text .color3 strong {background: #6eadff;}
.wrap-poly .line1 .text .list {display: flex; align-items: center; height: 70px; padding: 0 18px; border: 1px solid #cccccc; border-radius: 0 0 5px 5px;}
.wrap-poly .line1 .text .list li {position: relative; padding-left: 15px; font-family: pr; font-size: 17px; color: #555555;}
.wrap-poly .line1 .text .list li::after {content: ''; position: absolute; left: 0; top: 9px; width: 5px; height: 5px; background: #3176d0; border-radius: 100%;}
.wrap-poly .line2 .text {position: relative; display: flex; justify-content: center; align-items: center; height: 140px; padding: 0 80px; text-align: center;}
.wrap-poly .line2 .text::before {content: ''; position: absolute; left: 0; top: 0; width: 26px; height: 140px; background: url('../../images/sub/deco-poly2.png') no-repeat center;}
.wrap-poly .line2 .text::after {content: ''; position: absolute; right: 0; top: 0; width: 26px; height: 140px; background: url('../../images/sub/deco-poly3.png') no-repeat center;}
.wrap-poly .line2 .text strong {position: relative; font-family: pr; font-size: 30px; color: #3a528e;}
.wrap-poly .line2 .text strong::before {content: ''; position: absolute; left: -30px; top: 0; width: 24px; height: 18px; background: url('../../images/sub/deco-poly4.png') no-repeat center;}
.wrap-poly .line2 .text strong::after {content: ''; position: absolute; right: -30px; top: 0; width: 24px; height: 18px; background: url('../../images/sub/deco-poly5.png') no-repeat center;}
.wrap-poly .line2 .text strong i {font-family: pb;}
.wrap-poly .line3 .text ul {display: flex; justify-content: center; align-items: center; height: 140px; background: #ededed;}
.wrap-poly .line3 .text li {position: relative; width: 33.333%; text-align: center;}
.wrap-poly .line3 .text li::after {content: ''; position: absolute; right: 0; top: 50%; width: 21px; height: 21px; background: url('../../images/sub/deco-poly6.png') no-repeat center; transform: translate(0, -50%);}
.wrap-poly .line3 .text li:last-child::after {display: none;}
.wrap-poly .line3 .text li strong {font-family: psb; font-size: 30px; color: #002f63;}
.wrap-poly .line3 .text li p {font-family: pr; font-size: 20px; color: #222222;}
.wrap-poly .line4 .text > ul {display: flex; width: calc(100% + 20px);}
.wrap-poly .line4 .text > ul > li {width: 33.333%; padding-right: 20px;}
.wrap-poly .line4 .text strong {display: flex; justify-content: center; align-items: center; width: 100%; height: 70px; border-radius: 5px 5px 0 0; font-family: pb; font-size: 25px; text-align: center;}
.wrap-poly .line4 .text .color1 strong {border: 1px solid #00a4ac; color: #00a4ac;}
.wrap-poly .line4 .text .color2 strong {border: 1px solid #256ac5; color: #256ac5;}
.wrap-poly .line4 .text .color3 strong {border: 1px solid #4c96f6; color: #4c96f6;}
.wrap-poly .line4 .text p {display: flex; justify-content: center; align-items: center; height: 80px; background: #f6f6f6; padding: 0 10px; font-family: psb; font-size: 22px; border: 1px solid #777777; border-top: 0; text-align: center; color: #333333; border-radius: 0 0 5px 5px;}
.wrap-poly .line4 .text .sub {display: contents; font-size: 18px}
.wrap-poly .line5 .text > ul {display: flex; width: calc(100% + 20px);}
.wrap-poly .line5 .text > ul > li {width: 33.3333%; padding-right: 20px;}
.wrap-poly .line5 .text .list {padding: 30px 20px; border: 1px solid #cccccc; border-radius: 5px;min-height: 184px;}
.wrap-poly .line5 .text .list li {position: relative; padding-left: 15px; padding-bottom: 10px; font-size: 17px;}
.wrap-poly .line5 .text .list li:last-child {padding-bottom: 0;}
.wrap-poly .line5 .text .list li::after {content: ''; position: absolute; left: 0; top: 8px; width: 5px; height: 5px; background: #3176d0; border-radius: 100%;}
.wrap-poly .line6 .text ul {display: flex;}
.wrap-poly .line6 .text li {position: relative; display: flex; justify-content: center; align-items: center; width: 20%; height: 140px; font-family: pm; font-size: 20px; text-align: center; color: #222222;padding: 0 20px;}
.wrap-poly .line6 .text li.color1 {background: #d5edf5;}
.wrap-poly .line6 .text li.color2 {background: #d6e6f8;}
.wrap-poly .line6 .text li.color3 {background: #d2e0f5;}
.wrap-poly .line6 .text li.color4 {background: #d2e9f5;}
.wrap-poly .line6 .text li.color5 {background: #d8f0f5;}
.wrap-poly .line6 .text li::after {content: ''; position: absolute; right: 0; top: 50%; z-index: 1; width: 35px; height: 35px; background: #152e6e url('../../images/sub/deco-poly7.png') no-repeat center; border-radius: 100%; transform: translate(50%, -50%);}
.wrap-poly .line6 .text li:last-child::after {display: none;}

@media screen and (max-width: 1360px) {
    .wrap-poly .row .title strong {font-size: 22px;}
    .wrap-poly .row .title strong br {display: none;}
    .wrap-poly .line1 .year li {font-size: 20px;}
    .wrap-poly .line1 .text strong {font-size: 18px;}
    .wrap-poly .line1 .text .list li {font-size: 16px;}
    .wrap-poly .line2 .text strong {font-size: 20px;}
    .wrap-poly .line3 .text li strong {font-size: 22px;}
    .wrap-poly .line3 .text li p {font-size: 17px;}
    .wrap-poly .line4 .text strong {font-size: 20px;}
    .wrap-poly .line4 .text p {font-size: 18px;}
    .wrap-poly .line5 .text .list {padding: 20px;}
    .wrap-poly .line5 .text .list li {font-size: 15px;}
    .wrap-poly .line6 .text li {font-size: 18px;}
}

@media screen and (max-width: 1100px) {
    .wrap-poly .row {flex-wrap: wrap;}
    .wrap-poly .row .title {width: 100%; margin-bottom: 20px;}
    .wrap-poly .row .title::after {display: none;}
    .wrap-poly .line1 .year li {font-size: 18px;}
    .wrap-poly .line1 .text strong {font-size: 16px;}
    .wrap-poly .line3 .text li strong {font-size: 20px;}
    .wrap-poly .line4 .text p {font-size: 16px;}
    .wrap-poly .line4 .text .sub {font-size: 14px}
    .wrap-poly .line4 .text strong {font-size: 18px;}
    .wrap-poly .line6 .text li {font-size: 16px;}
}

@media screen and (max-width: 700px) {
    .wrap-poly .line1 .text > ul {flex-wrap: wrap; width: 100%;}
    .wrap-poly .line1 .text > ul > li {width: 100%; padding: 0; padding-bottom: 20px;}
    .wrap-poly .line1 .year li {font-size: 17px;}
    .wrap-poly .line3 .text li strong {font-size: 15px;}
    .wrap-poly .line3 .text li p {font-size: 14px;}
    .wrap-poly .line4 .text p {height: 60px;}
    .wrap-poly .line4 .text > ul {flex-wrap: wrap; width: 100%;}    
    .wrap-poly .line4 .text > ul > li {width: 100%; padding: 0; padding-bottom: 20px;}
    .wrap-poly .line5 .text .list {min-height: auto;}
    .wrap-poly .line5 .text > ul {flex-wrap: wrap; width: 100%;}    
    .wrap-poly .line5 .text > ul > li {width: 100%; padding: 0; padding-bottom: 20px;}
    .wrap-poly .line6 .text ul {flex-wrap: wrap;}
    .wrap-poly .line6 .text li {width: 50%;}
    .wrap-poly .line6 .text li::after {top: 100%;}
}