@charset "utf-8";

body{background:var(--bk);color:#fff;}
#mainpage{margin-top:90px;}
#mainpage .sec-com{padding:var(--gap-lg) 0;}
#mainpage .con-tit{margin-bottom:30px;}
#mainpage .con-tit h3{font-size:64px;}
#mainpage .con-tit p{font-size:24px;font-weight:600;margin-top:10px;line-height:1.8;}
#mainpage .con-tit .tit-cate{font-size:24px;font-weight:600;color:var(--main);}



#mainpage #who{background:url('../img/main/who_bg_pc.jpg') no-repeat bottom center / cover;}
#mainpage #who .who-bx:last-child{display:flex;margin-top:100px;justify-content: flex-end;}
#mainpage #who .who-bx .con-txt>p{line-height:1.8;}

#mainpage #service .service-bx{position:relative;width:calc((100% - 50px) / 2);background:#fff;border-radius: 5px;padding:60px;color:var(--bk);}
#mainpage #service .service-bx .num{position:absolute;top:0px;left:60px;width:100px;aspect-ratio: 100/150;padding-top:55px;font-size:46px;font-weight:600;color:#fff;background:var(--bk);text-align: center;line-height:95px;}
#mainpage #service .service-bx .con-top{padding-left:130px;margin-bottom:40px;}
#mainpage #service .service-bx .con-top h4{font-size:36px;font-weight:700;}
#mainpage #service .service-bx h5{font-size:24px;font-weight:600;margin-bottom:20px;line-height:1.8;}
#mainpage #service .service-bx p{font-size:var(--font16);font-weight:400;line-height:1.8;}

#mainpage #awards{background:url('../img/main/awards_bg_pc.jpg') no-repeat top right / contain;}
#mainpage #awards li{gap:10px;line-height:2;align-items: stretch;}
#mainpage #awards .dot{display:inline-block;width:2px;height:2px;border-radius:50%;background:#fff;position:relative;top:15px;}

#mainpage #clients .clients-con img{width:100%;}


#mainpage #contact .con-l{display:flex;flex-direction: column;justify-content: space-between;width:calc(100% - 500px);}
#mainpage #contact .con-r{width:500px;aspect-ratio: 500 / 422;}
#mainpage #contact #daumRoughmapContainer1771920420707{width:100%;height:100%;}
#mainpage #contact #daumRoughmapContainer1771920420707 .cont{display:none !important;}
#mainpage .root_daum_roughmap .wrap_map{height:calc(100% - 32px) !important;}
#mainpage #contact .con-txt>p{font-size:var(--font16);font-weight:400;line-height:1.8;}
#mainpage #contact .go-contact-btn{display:flex;align-items: center;justify-content: center;width:fit-content;height:64px;border-radius:999px;padding:0 50px;background:var(--main);color:#fff;font-size:var(--font20);font-weight:600;gap:20px;}
#mainpage #contact .go-contact-btn::after{content:'';display:inline-block;width:24px;height:24px;background:url(../img/common/ico_arrow.svg) no-repeat center center / contain;}


@media screen and (min-width:1921px){
  #mainpage #awards{background:url('../img/main/awards_bg_pc.jpg') no-repeat 80% top / contain;}
}


@media screen and (max-width:1600px){
  #mainpage #awards{background:url('../img/main/awards_bg_pc.jpg') no-repeat 150% / 80%;}
}


@media screen and (max-width:1300px){
  #mainpage #contact .con-l{width:calc(100% - 400px);}
  #mainpage #contact .con-r{width:400px;}
  
}

@media screen and (max-width:1150px){
  #mainpage #contact .con-l,
  #mainpage #contact .con-r{width:100%;}
  #mainpage #contact .inner{flex-wrap: wrap;gap:50px;}
  #mainpage #contact .con-l{gap:50px;}
  #mainpage #contact .con-r{aspect-ratio: 1/.6;}
}


@media screen and (max-width:1024px){
  #mainpage .con-tit h3{font-size:50px;}
  #mainpage .con-tit p{font-size:20px;}
  #mainpage .con-tit .tit-cate{font-size:20px;}
  #mainpage #who .who-bx:last-child{margin-top:60px;}
  #mainpage #service .service-bx{width:calc((100% - 30px) / 2);padding:50px 30px;}
  #mainpage #service .service-bx .num{width:80px;left:30px;font-size:40px;}
  #mainpage #service .service-bx .con-top h4{font-size:30px;}
  #mainpage #service .service-bx .con-top{padding-left:100px;}
  #mainpage #service .service-bx h5{font-size:20px;}

  #mainpage #contact .go-contact-btn{height:50px;padding:0 30px;gap:15px;}

  #mainpage #awards{background:url('../img/main/awards_bg_pc.jpg') no-repeat 200% / 80%;}
}

@media screen and (max-width:768px){

  #mainpage{margin-top:60px;}
  #mainpage .con-tit h3{font-size:30px;}
  #mainpage .con-tit p{font-size:16px;}
  #mainpage .con-tit .tit-cate{font-size:17px;}

  #mainpage #service .service-con{flex-wrap: wrap;gap:30px;}
  #mainpage #service .service-bx{width:100%;padding:30px 20px;}
  #mainpage #service .service-bx .num{width:50px;font-size:25px;line-height:50px;left:20px;padding-top:50px;}
  #mainpage #service .service-bx .con-top h4{font-size:26px;}
  #mainpage #service .service-bx .con-top{padding-left:70px;margin-bottom:25px;}
  #mainpage #contact .inner{gap:30px;}
  #mainpage #contact .con-l{gap:30px;}
  #mainpage #contact .go-contact-btn{font-size:16px;}
  #mainpage #awards li{font-size:14px;}
  #mainpage #who .who-bx .con-txt>p{font-size:14px;}
  #mainpage #awards{background:none;}
  #mainpage #awards .awards-img-m{width:100%;margin-top:30px;}
  
  
}