:root {
  /* [공통]색상 */
  --color-black: #000;
  --color-white: #fff;
  --color-yellow: #FFE96C;
  --color-orange: #FF700A;
  --color-gray: #ABABAB;
  --color-green: #8CC342;
  --color-primary: #1F53DF;
  --color-secondary: #2055E5;

  --wide-full: 100%;
  --cont-width: 1440px;
  --sub-width: 1440px;

  --font-size-default: clamp(14px, 0.8333vw, 16px);
}

/* [공통] class */
@font-face { 
  font-family:'Pretandard';  font-style:normal;  font-weight: 300; 
  src:  url(../fonts/Pretendard-Light.woff2) format('woff2'),   url(../fonts/Pretendard-Light.woff) format('woff')
}

@font-face { 
  font-family:'Pretandard';  font-style:normal;  font-weight: 400; 
  src:  url(../fonts/Pretendard-Regular.woff2) format('woff2'),   url(../fonts/Pretendard-Medium.woff) format('woff')
}

@font-face { 
  font-family:'Pretandard';  font-style:normal;  font-weight: 500; 
  src:  url(../fonts/Pretendard-Medium.woff2) format('woff2'),   url(../fonts/Pretendard-Medium.woff) format('woff')
}

@font-face { 
  font-family:'Pretandard';  font-style:normal;  font-weight: 600; 
  src:  url(../fonts/Pretendard-SemiBold.woff2) format('woff2'),   url(../fonts/Pretendard-SemiBold.woff) format('woff')
}

@font-face { 
  font-family:'Pretandard';  font-style:normal;  font-weight: 700; 
  src:  url(../fonts/Pretendard-Bold.woff2) format('woff2'),   url(../fonts/Pretendard-Bold.woff) format('woff')
}

@media (max-width:1600px){
  :root{
  --cont-width: 96%;
  --sub-width: 96%;
  }
}

@media (max-width:1240px){
  :root{
    font-size:62.5%;
    --cont-width: calc(100% - 3.2rem);
    --sub-width: calc(100% - 3.2rem);
  }
}

/*animation*/
@keyframes updown { 0% { transform:translateY(0)} 40%{transform:translateY(10px);} 80%{transform:translateY(0);} 100%{transform:translateY(0);}}
@keyframes updown1 { 0% { transform:translateY(0)} 50%{transform:translateY(10px);} 100%{transform:translateY(0);}}
@keyframes leftright { 0% { transform:translateX(0)} 40%{transform:translateX(5px);} 80%{transform:translateX(0);} 100%{transform:translateX(0);}}