@charset "utf-8";

/********************
// tablet 분기점
********************/
@media only screen and (max-width: 1200px) {

  .inner{width:calc(100% - 120px);margin:0 auto;}

  /** topBtn **/
  .topBtn{right:40px; bottom:40px;}

  /** header **/
  .menu{right:-60dvw; top:0; background:#fff; transition: ease-in-out 0.3s;}
  .menu.active{right:0}
  .menu li, .menu .emty{border-bottom:1px solid #EEEEF0}
  .toggleBtn{cursor: pointer;}
  .toggleBtn span{transition: ease-in-out 0.3s;}
  .toggleBtn span:nth-child(1){left:50%; top:2px; transform:translate(-50%, 0)}
  .toggleBtn span:nth-child(2){left:50%; top:50%; transform:translate(-50%, 0)}
  .toggleBtn span:nth-child(3){left:50%; bottom:0; transform:translate(-50%, 0)}
  .toggleBtn.active span:nth-child(1){left:50%; top:50%; transform:translate(-50%, -50%) rotate(45deg)}
  .toggleBtn.active span:nth-child(2){left:2000px}
  .toggleBtn.active span:nth-child(3){left:50%; bottom:46%; transform:translate(-50%, -50%) rotate(-45deg)}

  .snb{box-shadow: none;top:0; left:0; transform: translateX(0);}
  .snb a{white-space: nowrap;background:#EEEEF0;}

  /** index **/
  .mainIntroCnt{width:calc(50% - 9px)}
  .indexMap > .wrap_map{height:458px !important}
  .mainBanner{background:url('/img/mainBanner-t.jpg')80% 80%; background-size:cover}

  /** subBanner **/
  .trinagle{border-bottom:64px solid #fff; border-right:64px solid transparent;}

  /** location **/
  .locationMap > .wrap_map{height:480px !important}

  /** partner **/
  .partnerCnt{width:calc(33% - 16px)}

  /** employment **/
  .recruitProccessCnt{width:calc(25% - 27px)}
  

}


/********************
// 모바일 분기점
********************/
@media only screen and (max-width: 768px) {

  .inner{width:calc(100% - 40px);margin:0 auto;}

  /** topBtn **/
  .topBtn{right:20px; bottom:20px;}

  /** index **/
  .mainBanner{background:url('/img/mainBanner-m.jpg')80% 80%; background-size:cover}
  .mainIntroCnt{width:100%}
  .indexMap > .wrap_map{height:230px !important}

  /** subBanner **/
  .trinagle{border-bottom:56px solid #fff; border-right:56px solid transparent;}

  /** company **/
  .companuValueCnt{border:4px solid #9AC4F6}

  /** partner **/
  .partnerCnt{width:calc(50% - 6px)}

  /** employment **/
  .recruitProccessCnt{width:calc(50% - 22px)}

  /** service **/
  .serviceProcessCnt{width:calc(50% - 6px)}


}