/* common */
.subpage { overflow: hidden; position:relative; }
.subpage > section {padding: 100px 0;}
/* .subpage > section:nth-of-type(even) {background: #f7f7f7;} */
.sub_inner { max-width: 1500px; width: 100%; margin:0 auto; position: relative; padding:0 50px; }
.sub_title h3 {margin-bottom: 5px; color: #3f72d7;  letter-spacing: -.6px; font-family: 'NanumSquareRoundEB'; text-transform: uppercase;}
/* font size */
.fs_60 {font-size: 60px; font-weight:400; color: #000; line-height: 1.3; letter-spacing: -1.5px; font-family: 'NanumSquareRoundEB'; text-transform: uppercase;}
.fs_50 {font-size: 50px; font-weight:400; color: #000; line-height: 1.3; letter-spacing: -1.25px; font-family: 'NanumSquareRoundEB';}
.fs_30 {font-size: 30px; font-weight:400; line-height: 1.47; letter-spacing: -1.5px; color:#000; font-family: 'NanumSquareRoundB';}
.fs_24 {font-size: 24px; font-weight:400; line-height: 1.3;}
.fs_18 {font-size: 18px; font-weight: 300; color: #333; line-height: 1.67; letter-spacing: -.45px; }
.fs_17 {font-size: 17px; font-weight: 400; color: #333; line-height: 1.65; letter-spacing: -.43px; }

/* tit */
.line_tit {position: relative; padding-left: 20px; text-align: left; }
.line_tit::before {content: ''; display: block; width: 5px; height: 50px; background: #3f72d7; position: absolute; left: 0; top:6px; }

.arrow_tit {position: relative; padding-left: 37px; font-weight: 700;  text-align: left; }
.arrow_tit::before {content: ''; display: block; width: 26px; height: 22px; position: absolute; left: 0; top:5px; background:url("../img/arrow_tit.png") 50%/contain no-repeat; }


/*Content CSS*/
/* sec1 */
#sec1 {padding-bottom: 0;}
#sec1 p {margin: 50px 0 100px;}
#sec1 .bg {width: 100%; height: 450px; background:url("../img/ab3_s1_bg.jpg") 50%/cover no-repeat;}

/* sec2 */
#sec2 .list {display: flex; flex-wrap: wrap; width: 100%; border-top: 2px solid #000; margin-top: 50px;}
#sec2 .list li {width: 50%; padding: 40px 0; border-bottom: 1px solid #ccc; display: flex; align-items: center; text-align: left; }
#sec2 .list li:last-child {width: 100%;}
#sec2 .list li h4 {flex-shrink: 0; margin-right: 33px; width: 170px; position: relative; line-height: .9;}
#sec2 .list li h4::before {top:50%; transform: translateY(-50%);}
#sec2 .list li h4::after {content: '' ;display: block; width: 1px; height: 21px; background: #ccc; position: absolute; right: 0; top:50%; transform: translateY(-50%);}
#sec2 .list li h4 small {font-size: 14px; font-weight: 300; }
#sec2 .list li p {line-height: 1.2;}

/* sec3 */
#sec3 {background-color: #f7f7f7;}
#sec3 article {display: flex;}
#sec3 h3 {flex-shrink: 0; margin-right: 100px; }
#sec3 .list {display: flex;  justify-content:space-between; width: 100%;}
#sec3 .list .img {margin-bottom: 40px; }
#sec3 .list li + li {margin-left: 30px;}




@media screen and (max-width:1500px){
    /* common */
    .subpage br:not(.space) {display: none;}

    /* content */



}

@media screen and (max-width:1199px){
    #sec2 .list li {width: 100%;}
    #sec3 article {display: block;}
    #sec3 h3 {margin: 0 0 50px; }
}

@media screen and (max-width:1024px){
    /* common */
    .subpage {text-align: center;}
    .subpage > section {padding:70px 0;}
    .sub_inner {padding: 0 30px;}
    /* fs */
    .fs_60 {font-size: 40px;}
    .fs_50 {font-size: 35px;}
    .fs_30 {font-size: 24px;}
    .fs_24 {font-size: 18px;}
    .fs_18 {font-size: 16px; }
    .fs_17 {font-size: 15px; }
    /* tit */
    .line_tit::before {height: 80%; top:10%;}
    .arrow_tit {padding-left: 25px;}
    .arrow_tit::before {width: 18px; top:2px;}

    /*Content CSS*/
    /* sec1 */
    #sec1 p {margin: 30px 0 60px;}
    #sec1 .bg {height: 350px;}

    /* sec2 */
    #sec2 .list li {padding: 30px 0;}
    #sec2 .list li h4 {width: 150px;}
    #sec2 .list li h4 small {font-size: 70%;}

    /* sec3 */
    #sec3 .list li + li {margin-left: 20px;}
    #sec3 .list .img {margin-bottom: 25px;}



}

@media screen and (max-width:640px){
    /* common */
    .sub_inner {padding: 0 20px;}
    .subpage > section {padding:50px 0;}
    /* fs */
    .fs_60 {font-size: 30px;}
    .fs_50 {font-size: 25px;}
    .fs_30 {font-size: 20px;}
    .fs_24 {font-size: 16px;}
    .fs_18 {font-size: 14px; }
    .fs_17 {font-size: 13px; }
    /* tit */
    .line_tit {padding-left: 15px;}
    .line_tit::before {top:8%; width: 4px;}
    .arrow_tit {padding-left: 20px;}
    .arrow_tit::before {width: 15px; height: 15px; }

    /*Content CSS*/
    /* sec1 */
    #sec1 p {margin: 20px 0 50px;}
    #sec1 .bg {height: 200px;}

    /* sec2 */
    #sec2 .list {margin-top: 30px;}
    #sec2 .list li {padding: 20px 0;}
    #sec2 .list li h4 {width: 120px; margin-right: 20px;}
    #sec2 .list li h4::after {height: 17px;}

    /* sec3 */
    #sec3 h3 {margin: 0 0 30px;}
    #sec3 .list li + li {margin-left: 10px;}




}