@charset "utf-8";

#company_info {}
#company_info .cont {}
#company_info .coreCont {
    display:flex;
    align-items: stretch;
    position: relative;
}
#company_info .coreCont::after {
    content:'';
    width:635px;
    height:98px;
    background-image:url(./img/top_arrow.png);
    background-repeat:no-repeat;
    position:absolute;
    left: 50%;
    bottom: -80px;
    transform: translateX(-50%);
    z-index: -1;
}
#company_info .coreCont .coreBox {
    width:31.333%;
    margin:1%;
    background-color:#f4f4f4;
    padding:20px;
    padding-top:60px;
    position: relative;
}
#company_info .coreCont .coreBox .coreTit {
    width:80%;
    position:absolute;
    left:50%;
    top:-35px;
    transform:translateX(-50%);
    border-radius:10px;
}
#company_info .coreCont .coreBox .coreTit p {
    text-align:center;
    padding:20px 0;
    color:#fff;
    font-weight:bold;
    font-size:1.11rem;
}
#company_info .coreCont .coreBox .coreTxt {}
#company_info .coreCont .coreBox .coreTxt p {
    line-height:1.8;
    text-align:center;
    font-weight:bold;
}
#company_info .coreCont .coreBox01 .coreTit {
    background-color:#0078D1;
}
#company_info .coreCont .coreBox02 .coreTit {
    background-color:#004EA1;
}
#company_info .coreCont .coreBox03 .coreTit {
    background-color:#005FB7;
}

#company_info .termCont {
    display:flex;
    align-items:stretch;
    margin-top:150px;
}
#company_info .termCont .termBox {
    background-color:#edf6ff;
    padding:20px;
    width:31.333%;
    margin:1%;
}
#company_info .termCont .termBox h2 {
    font-size: 1.33rem;
    margin-bottom: 30px;
    font-weight: 600;
    display: inline-block;
    position: relative;
    z-index: 1;
}
#company_info .termCont .termBox h2::before {
    content: '';
    width: 102%;
    height: 10px;
    background-color:#cbd8fa;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: -1;
}
#company_info .termCont .termBox p {}

#company_info .cont02 {
    margin-top:150px;
}
#company_info .company_title {
    font-size: 2.22rem;
    text-align: center;
    font-weight: bold;
    margin-bottom: 50px;
    color:#fff;
}

#company_info .blackBG02 {
    background-image:url(./img/bg_sm.jpg);
    background-repeat:no-repeat;
    padding:100px 0;
}
#company_info .stepWrap {
    display:flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content:center;
}
#company_info .stepWrap .stepBox {
    width:16%;
}
#company_info .stepWrap .stepBox .stepRound {
    background-repeat:no-repeat;
    width:230px;
    height:230px;
    position:relative;
}
#company_info .stepWrap .stepBox .stepRound01 {
    background-image:url(./img/ellipse01.png);
}
#company_info .stepWrap .stepBox .stepRound02 {
    background-image:url(./img/ellipse02.png);
}
#company_info .stepWrap .stepBox .stepRound .roundtxtBox {
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    text-align:center;
}
#company_info .stepWrap .stepBox .stepRound .roundtxtBox span {
    color:#fff;
    font-size:0.99rem;
    letter-spacing:-0.72px;
}
#company_info .stepWrap .stepBox .stepRound .roundtxtBox p {
    font-size:1.22rem;
    color:#fff;
    margin-top:20px;
    font-weight:bold;
    letter-spacing:-0.9px;
}
#company_info .stepWrap .stepBox .step_barTxt {
    text-align:center;
    color:#fff;
    font-size:0.88rem;
    padding-left: 10%;
    padding-top:50px;
    position:relative;
}
#company_info .stepWrap .stepBox .step_barTxt::before {
    content:'';
    width:1px;
    height:50px;
    background-color:#ddd;
    position:absolute;
    left: 55%;
    top: -25px;
    transform: translateX(-50%);
}


#company_info .ruleCont {
    margin-top:150px;
}
#company_info .ruleTitle {
    color:#222;
}
#company_info .ruleWrap {
    display:flex;
    align-items:stretch;
}
#company_info .ruleWrap .ruleBox {
    width:31.333%;
    margin:1%;
    border-radius:20px;
    padding:20px;
    border-width:7px;
    border-style:solid;
}
#company_info .ruleWrap .ruleBox h2 {
    text-align:center;
    font-weight:bold;
    margin-bottom:20px;
    background-color:#f4f4f4;
    padding:10px 0;
    font-size:1.33rem;
}
#company_info .ruleWrap .ruleBox p {
    text-align:center;
    line-height:1.8;
}
#company_info .ruleWrap .ruleBox01 {
    border-color:#003670;
}
#company_info .ruleWrap .ruleBox02 {
    border-color:#005FB7;
}
#company_info .ruleWrap .ruleBox03 {
    border-color:#0078D1;
}



/*---------------반응형 미디어쿼리----------------*/

@media (max-width:1440px) {}

@media (max-width:1200px) {
    #company_info .stepWrap .stepBox {
        width: 19%;
    }
}

@media (max-width:1024px) {}

@media (max-width:991px) {
    #company_info .blackBG,
    #company_info .blackBG02 {
        background-size:cover;
    }
    #company_info .stepWrap .stepBox {
        display:flex;
        margin: 1%;
        align-items: center;
        justify-content: center;
        width:100%;
    }
    #company_info .stepWrap .stepBox .stepRound {
        background-color:#004ea2;
        border-radius:30px;
        background-image:none;
        width:200px;
        height:150px;
    }
    #company_info .stepWrap .stepBox .stepRound .roundtxtBox p {
        font-size:1.11rem;
    }
    #company_info .stepWrap .stepBox .step_barTxt {
        width:100%;
        text-align:left;
        padding-top:0;
        padding-left: 65px;
        flex:1;
    }
    #company_info .stepWrap .stepBox .step_barTxt::before {
        width:50px;
        height:1px;
        left:0;
        top:50%;
        transform:translateY(-50%);
    }

}

@media (max-width:768px) {
    #company_info .coreCont {
        flex-wrap: wrap;
    }
    #company_info .coreCont .coreBox {
        width:100%;
        margin-bottom:50px;
    }
    #company_info .termCont {
        flex-wrap: wrap;
    }
    #company_info .termCont .termBox {
        width:100%;
    }
    #company_info .ruleWrap {
        flex-wrap: wrap;
    }
    #company_info .ruleWrap .ruleBox {
        width:100%;
    }
}

@media (max-width:480px) {
    #company_info .stepWrap .stepBox {
        flex-wrap: wrap;
    }
    #company_info .stepWrap .stepBox .stepRound {
        width:100%;
        height:100px;
    }
    #company_info .stepWrap .stepBox .stepRound .roundtxtBox {
        width:100%;
    }
    #company_info .stepWrap .stepBox .step_barTxt {
        flex: none;
        width: 100%;
        padding-left: 0;
        margin-top: 20px;
    }
    #company_info .stepWrap .stepBox .step_barTxt::before{
        display:none;
    }
}

@media (max-width:400px) {}

@media (max-width:320px) {}
