@charset "utf-8";

/* CI 소개 STYLE*/

#ci .centerFix {transform: translateX(-180px);}
#ci .signature-section{padding:50px 0 24px;}

#ci .signature-box{display: flex;}
#ci .signature-box .title{width:300px;font-size: 36px;font-weight: 700;color:#111111;position: relative;padding-top: 25px;}
#ci .signature-box .title::before{content:'';display: block;width: 66px;height: 3px;background-color: #063680;position: absolute;left: 0;top:0;}
#ci .signature-box .service-list{width:980px;}
#ci .signature-box .service-list .service-item{display: flex;column-gap:0px;align-items: center;padding:0px 0 40px;border-bottom:0px solid #e8e8e8;}
#ci .signature-box .service-list .service-item .logo-box{width:100%; height:auto; background:#f2f2f2; border:0px solid #f2f2f2; border-radius:20px; text-align:center; vertical-align:middle; padding:0px 0px;}
#ci .signature-box .service-list .service-item .logo-box2{width:980px; height:auto; background:#f2f2f2; border:0px solid #f2f2f2; border-radius:20px; text-align:center; vertical-align:middle; padding:0px 0px 0px;}
#ci .signature-box .service-list .service-item:first-of-type{padding-top: 0;}
#ci .signature-box .service-list .service-item:last-of-type{padding-bottom: 0;border-bottom:0;}
#ci .signature-box .service-list .service-item .service-info {display:flex; flex-direction:column; row-gap:10px; font-family:'Noto Sans KR', 'Verdana', sans-serif; }
#ci .signature-box .service-list .service-item .service-info p {font-family:'Noto Sans KR', 'Verdana', sans-serif; font-size:18px; font-weight:400; letter-spacing:normal; color:#111111; position:relative; line-height:1.6;}

#ci .signature-section.section003{margin-top: 0px; margin-bottom:60px; }
#ci .signature-section .sub-title{font-family:'Noto Sans KR', 'Verdana', sans-serif; font-size:28px; font-weight: 500;color:#000000;display: flex;align-items: center;}

@media (max-width: 1280px){    
    /*CI소개 추가*/
    #ci .signature-box  {max-width:100%; display:flex; width:100%; }
    #ci .signature-box .title{width:26%;font-size: 36px;font-weight: 700;color:#111111;position: relative;padding-top: 20px; margin-bottom:30px; }
    #ci .signature-box .service-list{width:74%;}
    #ci .signature-box .service-list .service-item .logo-box{width:100%; height:auto; background:#f2f2f2; border:0px solid #f2f2f2; border-radius:20px; text-align:center; vertical-align:middle; padding:0px 0px;}
    #ci .signature-box .service-list .service-item .logo-box2{width:100%; height:auto; background:#f2f2f2; border:0px solid #f2f2f2; border-radius:20px; text-align:center; vertical-align:middle; padding:0px 0px 0px;}

    #ci .signature-box .service-list .service-item > img {width:100%; display: inline-block;}
    #ci .signature-box .service-list .service-item .service-info{display: inline-block;}
    #ci .signature-box .service-list .service-item .service-info p {font-size:18px;}
    #ci .signature-box .service-list .service-item .service-info p br{display:none;}
    
    #ci .signature-section .sub-title{ font-size:28px; font-weight: 500;color:#000000;display: flex; padding-bottom:10px; }
    /*CI소개 추가*/
}

@media (max-width: 1280px){
    #ci .centerFix {transform: translateX(0);}
}

@media (max-width: 960px) {
    #ci .signature-box {flex-direction: column;}
    #ci .signature-section.section003{margin-top:10px;}
    #ci .signature-box .title{width:100%; font-size:32px; padding-top:15px; margin-bottom:30px; }    
    #ci .signature-box .service-list {width:100%;}
    #ci .signature-box .service-list .service-item > img {width:100%; display: inline-block; }
    #ci .signature-box .service-list .service-item .service-info {display: inline-block;}
    #ci .signature-box .service-list .service-item .service-info p {font-size:16px; }
    
    #ci .signature-section .sub-title{ font-size:24px; font-weight: 500;color:#000000; padding-bottom:10px; }
}

@media (max-width: 640px) {    
    /*CI소개 추가*/
    #ci .signature-section.section003 {margin-top:10px; width:100%; max-width:100%;}
    #ci .signature-box .title{width:100%; font-size: 28px;padding-top:12px;position: relative;}
    #ci .signature-box .title::before{width: 40px;}
    
    #ci .signature-box  {max-width:100%;display:inline-block;width:100%; }
    #ci .signature-box  .service-list{width:100%;}
    
    #ci .signature-box  .service-list .service-item{display:inline-block;column-gap:0px;align-items: center;padding:0px 0 20px;border-bottom:0px solid #e8e8e8;overflow: hidden;width:100%;}
    #ci .signature-box  .service-list .service-item .logo-box{width:100%; height:auto;border:1px solid #dddddd;border-radius:8px; text-align:center; vertical-align:middle; padding:10px 0px; aspect-ratio: 980 / 480; }
    #ci .signature-box  .service-list .service-item .logo-box2{width:100%; height:auto;border:1px solid #dddddd;border-radius:8px; text-align:center; vertical-align:middle; padding:10px 0px; aspect-ratio: 980 / 480; }
    
    #ci .signature-box .service-list .service-item > img {width:50%; display: inline-block; }    
    #ci .signature-box  .service-list .service-item:first-of-type{padding-top: 0;}
    #ci .signature-box  .service-list .service-item:last-of-type{padding-bottom: 0;border-bottom:0;}
    
    #ci .signature-box  .service-list .service-item .service-info{display: inline-block;}
    #ci .signature-box  .service-list .service-item .service-info p {font-family: 'Noto Sans KR', 'Nanum Gothic','나눔고딕', sans-serif; font-size:16px; font-weight:400; letter-spacing:normal; color:#111111; position:relative; line-height:1.6;}    
    #ci .signature-box  .service-list .service-item .service-info p{word-break: keep-all;}
    #ci .signature-box  .service-list .service-item .service-info p br{display: none;}
    /*CI소개 추가*/
    
    #ci .signature-section {padding: 30px 0 20px;}
    #ci .signature-section .sub-title {font-size: 22px;}
}