@charset "utf-8";

/********************
// tablet 분기점
********************/
@media only screen and (max-width: 1200px) {
  .inner{width:calc(100% - 120px);margin:0 auto;}
  /********************
  ** header
  ********************/

  /********************
  ** index
  ********************/
  /** mainBanner **/
  /** subBanner **/
  /** about **/
  /** overrview **/
  .overrviewLight {right:-20px; top:-20px;}
  /** shop **/
  .shopBnts {max-height: 240px;}
  /** service **/
  .serviceTop {border-radius:20px 20px 0 0;}
  .serviceBottom {border-radius:0 0 20px 20px;}
  .serviceModalContent {border-radius:20px; padding:40px 32px 32px;}
  .serviceObject-001 {bottom:-60px; right:-90px;}
  .serviceObject-002 {top:79px; left:-45px;}
  /** recruit **/
  .rectuitCnts {display:grid; grid-template-columns:repeat(2, 1fr); row-gap:48px;}
  .centerMarquee {--center-visible: 1;}
  /** faq **/
  .contactBtnLists {display:grid; grid-template-columns: repeat(3,1fr);}
  .contactBtnLists2 {display:grid; grid-template-columns: repeat(2,1fr);}
}

/********************
// 모바일 분기점
********************/
@media only screen and (max-width: 768px) {
  .inner{width:calc(100% - 40px);margin:0 auto;}
    /********************
    ** header
    ********************/

    /********************
    ** index
    ********************/
    /** mainBanner **/
    /** subBanner **/
    /** about **/
    /** overrview **/
    .overrviewLight {right:-10px; top:-10px;}
    /** feature **/
    .featureCnts {display:grid; grid-template-columns:repeat(1,1fr);}
    /** shop **/
    /** service **/
    .serviceTop {border-radius:16px 16px 0 0;}
    .serviceBottom {border-radius:0 0 16px 16px;}
    .serviceModalOverlay {padding:16px;}
    .serviceModalContent {border-radius:16px; padding:36px 20px 20px;}
    .serviceModalClose {top:54px; right:40px;}
    .serviceObject-001 {bottom:-26px; right:-28px;}
    .serviceObject-002 {top:8px; left:-28px;}
    /** recruit **/
    .rectuitCnts {display:grid; grid-template-columns:repeat(1, 1fr); row-gap:40px;}
    .centerMarquee {
      --center-visible: 1.4;
      --center-gap: 16px;
    }
    /** faq **/
    .faqBnts {display:grid; grid-template-columns:repeat(2,1fr);}
    .contactBtnLists {display:grid; grid-template-columns: repeat(2,1fr);}
    .contactBtnLists2 {display:grid; grid-template-columns: repeat(1,1fr);}


}