/* font */
@font-face {
  font-family: 'Pre';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Thin.woff') format('woff');
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: 'Pre';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraLight.woff') format('woff');
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: 'Pre';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Pre';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'Pre';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'Pre';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Pre';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Pre';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff') format('woff');
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: 'Pre';
  src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Black.woff') format('woff');
  font-weight: 900;
  font-style: normal;
}
/* //font */

:root {
  --pr : #1F3162;
  --line_color : #0A1F55;
  --yellow : #FEE914;
  --black : #000;
  --black_1f : #1F1F1F;
  --black_3 : #333333;
  --gray_6 : #666666;
  --gray_8 : #888888;
  --gray_86 : #868686;
  --gray_d9 : #d9d9d9;
  --gray_c9 : #c9c9c9;
  --gray_e4 : #e4e4e4;
  --wt : #fff;
  --wt_f2 : #F2F2F2;
}

/* bg-color */
.pr {background: #1F3162;}
.line_color {background: #0A1F55;}
.yellow {background: #FEE914;}
.black {background: #000;}
.black_1f {background: #1F1F1F;}
.black_3 {background: #333333;}
.gray_6 {background: #666666;}
.gray_8 {background: #888888;}
.gray_86 {background: #868686;}
.wt {background: #fff;}
.wt_f2 {background: #F2F2F2;}

/* color */
.pr_c {background: #1F3162;}
.line_color_c {background: #0A1F55;}
.yellow_c {background: #FEE914;}
.black_c {background: #000;}
.black_1f_c {background: #1F1F1F;}
.black_3 {background: #333333;}
.gray_6_c {background: #666666;}
.gray_8_c {background: #888888;}
.gray_86_c {background: #868686;}
.wt_c {background: #fff;}
.wt_f2_c {background: #F2F2F2;}

html {scroll-behavior: smooth;}
body {font-family: 'Pre'; overflow-x: hidden;}
.container {max-width: 1180px; width: 100%; height: auto; margin: 0 auto; box-sizing: border-box;}
section {padding: 120px 0; box-sizing: border-box;}

/* position */
.po_initial {position: initial !important;}

/* tit-box */
.tit-box {position: relative; text-align: left;}
.tit-box .tit {margin-bottom: 60px; font-size: 40px; font-weight: bold; line-height: 1.4; letter-spacing: -0.8px; color: var(--black_3);}
.link_btn2 {position: absolute; bottom: 0; right: 0; display: inline-block; padding: 16px 30px; box-sizing: border-box; border-radius: 60px; background: var(--pr); font-size: 18px; font-weight: 500; line-height: 1.4; letter-spacing: -0.36px; color: var(--wt); white-space: nowrap;}
.link_btn2 span {position: relative; animation: move_arrow .5s linear alternate-reverse infinite;}

/* tit-box2 */
.sec3 {background: var(--wt_f2);}
.tit-box2 {text-align: center; margin-bottom: 60px;}
.tit-box2 .tit {font-size: 40px; font-weight: bold; line-height: 1.4; letter-spacing: -0.8px; color: var(--black_3);}
.tit-box2 .sub {margin-top: 20px; font-size: 18px; font-weight: 400; line-height: 1.5; letter-spacing: -0.36px; color: var(--gray_6);}

/* tab-btn */
.tab-btn {position: relative; width: 100%; height: auto; margin-top: -60px; z-index: 3;}
.tab-btn ul {display: flex; align-items: center; justify-content: center;}
.tab-btn ul li {width: 100%;}
.tab-btn ul li a {display: flex; align-items: center; justify-content: center; width: 100%; height: 60px; background: var(--wt); font-size: 18px; font-weight: 400; line-height: 1; color: var(--black_3);}
.tab-btn ul li.active a {background: var(--pr); color: var(--wt);}

/* dim */
.dim {position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.5); z-index: 10;}