@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700&display=swap');

/* font-family: 'Noto Sans KR', sans-serif;*/

h1,h2,h3,h4,h5,h6{
    font-family: 'Noto Sans KR', sans-serif;
}
#intro{
    font-family: 'Noto Sans KR', sans-serif;
    font-weight:400;
    color:#4E4E4E;
    padding-top:170px;
}
#intro .container{
    width:1600px;
    margin:-75px auto 0;
    background:#fff;
}
#intro .container .wrap{
    width:1330px;
    margin:0 auto;
    padding-top:230px;
}
#intro .com_desc .top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    position:relative;
    z-index:1;
}
#intro .com_desc .top::after{
    content:'';
    width:796px;
    height:408px;
    background:url(../../img/sub/intro_map.png) no-repeat center center/cover;
    position:absolute;
    top:-130px;
    right:-130px;
    z-index:-1;
}
#intro .intro_tt{
    font-size:32px;
    font-weight:700;
    letter-spacing:-0.006em;
    text-transform:capitalize;
}
#intro .com_desc .top .hello{
    margin-bottom:50px;
}
#intro .com_desc .top .hello .intro_tt{
    margin-bottom:10px;
}
#intro .com_desc .top .hello > p{
    font-size:28px;
    font-weight:300;
    letter-spacing:-0.006em;
    word-break:keep-all;
}
#intro .com_desc .top .hello > p span{
    font-weight:400;
}
#intro .com_desc .top .img_wrap{
    padding-right:175px;
}
#intro .com_desc .bottom{
    background:#FFF0CF;
    width:1210px;
    padding:30px 50px;
    position:relative;
    z-index:1;
    margin-bottom:140px;
}
#intro .com_desc .bottom p{
    font-size:20px;
    font-weight:350;
    letter-spacing:-0.005em;
    color:#676767;
    word-break:keep-all;
}
#intro .com_desc .bottom p + p{
    margin-top:30px;
}
#intro .com_desc .bottom p .bold{
    font-weight:500;
}
#intro .info .intro_tt{
    margin-bottom:40px;
}
#intro .info .info_content{
    display:flex;
    gap:215px;
    margin-bottom:240px;
}
#intro .info .info_content ul > li{
    display:grid;
    grid-template-columns:160px 1fr;
    margin-bottom:20px;
}
#intro .info .info_content ul > li .info_tt{
    font-size:20px;
    font-weight:500;
    letter-spacing:-0.005em;
    text-transform:uppercase;
}
#intro .info .info_content ul > li .desc{
    font-size:18px;
    letter-spacing:-0.005em;
    color:#797979;
    word-break:keep-all;
}
#intro .info .info_content ul > li .desc br{
    display:none;
}

/* --------------------------------- RESPONSIVE --------------------------------- */
@media (max-width:1650px){
    #intro .container{
        width:90%;
    }
    #intro .container .wrap{
        width:90%;
    }
    #intro .info .info_content{
        gap:10%;
    }
}
@media (max-width:1500px){
    #intro .info .info_content ul > li .desc br:not(.tb){
        display:block;
    }
    #intro .info .info_content ul > li .desc span{
        display:none;
    }
}
@media (max-width:1400px){
    #intro .com_desc .bottom{
        padding:30px;
        width:100%;
    }
    #intro .com_desc .top .img_wrap{
        padding-right:0;
    }
    #intro .com_desc .bottom p br{
        display:none;
    }
}
@media (max-width:1200px){
    #intro .info .info_content{
        gap:5%;
    }
    #intro .info .info_content ul > li{
        grid-template-columns:147px 1fr;
    }
    #intro .info .info_content ul > li .desc br.tb{
        display:block;
    }
}
@media (max-width:1000px){
    #intro .container .wrap{
        padding-top:140px;
    }
    #intro .com_desc .top{
        flex-direction:column-reverse;
        align-items:start;
        gap:50px;
    }
    #intro .com_desc .top::after{
        top:40px;
    }
    #intro .info .info_content{
        flex-direction:column;
        gap:0;
    }
    #intro .info .info_content ul > li{
        grid-template-columns:160px 1fr;
    }
    #intro .info .info_content ul > li .desc br:not(.tb),
    #intro .info .info_content ul > li .desc br.tb{
        display:none;
    }
    #intro .info .info_content ul > li .desc span{
        display:inline;
    }
}
@media (max-width:768px){
    #intro{
        padding-top:109px;
    }
    #intro .container .wrap {
        padding-top: 80px;
    }
    #intro .intro_tt {
        font-size: 28px;
    }
    #intro .com_desc .top .hello > p {
        font-size: 22px;
    }
    #intro .com_desc .bottom {
        padding: 25px;
        margin-bottom:80px;
    }
    #intro .com_desc .bottom p {
        font-size: 16px;
    }
    #intro .com_desc .bottom p + p {
        margin-top: 25px;
    }
    #intro .info .info_content{
        margin-bottom:100px;
    }
    #intro .info .info_content ul > li .info_tt {
        font-size: 18px;
    }
    #intro .info .info_content ul > li .desc {
        font-size: 16px;
    }
}
@media (max-width:630px){
    #intro .com_desc .top .hello > p br{
        display:none;
    }
    #intro .info .info_content ul > li{
        display:block;
    }
}
@media (max-width:500px){
    #intro{
        padding-top:99px;
    }
    #intro .container {
        margin: -55px auto 0;
    }
    #intro .com_desc .top{
        gap:30px;
    }
    #intro .com_desc .top .hello {
        margin-bottom: 30px;
    }
    #intro .com_desc .top .hello > p {
        font-size: 16px;
    }
    #intro .com_desc .top .img_wrap img{
        width:80%;
    }
    #intro .com_desc .bottom {
        padding:18px;
        margin-bottom:50px;
    }
    #intro .com_desc .bottom p {
        font-size: 14px;
    }
    #intro .info .info_content ul > li .info_tt {
        font-size: 16px;
    }
    #intro .info .intro_tt {
        margin-bottom: 30px;
    }
    #intro .info .info_content ul > li .desc {
        font-size: 14px;
    }
    #intro .info .info_content ul > li .desc br:not(.tb),
    #intro .info .info_content ul > li .desc br.tb{
        display:block;
    }
    #intro .info .info_content ul > li .desc span{
        display:none;
    }
}