/* 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 : #2D2676;
  --black : #000;
  --gray_b : #bbb;
  --gray_d6 : #d6d6d6;
  --gray_8 : #888888;
  --gray_e9 : #e9e9e9;
  --wt : #fff;
}

a,button,input,textarea,select,td,th,dt,dd {font-family: 'Pre';}
html,body {scroll-behavior: smooth;}
button {cursor: pointer;}
body {font-family: 'Pre';}
.container {max-width: 1400px; width: 100%; height: auto; margin: 0 auto; box-sizing: border-box;}
.container2 {max-width: 1000px;}
section {padding-top: 160px;}
/* tit-box */
.tit-box {margin-bottom: 80px; text-align: center;}
.tit-box .tit {font-size: 56px; font-weight: bold; line-height: 1; color: var(--black);}

/* tab_btn */
.tab_btn {display: flex; align-items: center; justify-content: center; gap: 56px; margin-bottom: 59px;}
.tab_btn button {padding-bottom: 7px; font-size: 21px; font-weight: bold; line-height: 1; color: var(--gray_b);}
.tab_btn button.active {color: var(--pr); border-bottom: 2px solid var(--pr);}

/* tab_btn2 */
.tab_btn2 {width: 100%; height: auto;}
.tab_btn2 dl {display: flex; justify-content: space-between; padding-bottom: 39px; margin-bottom: 47px; border-bottom: 2px solid var(--gray_e9);}
.tab_btn2 dl dt {font-size: 28px; font-weight: bold; line-height: 1; color: var(--black);}
.tab_btn2 dl dd {display: flex; align-items: center; flex-wrap: wrap; gap: 40px 24px; max-width: 1058px; width: 100%; height: auto;}
.tab_btn2 dl dd button {position: relative; font-size: 18px; font-weight: 500; line-height: 1; color: var(--gray_b);}
.tab_btn2 dl dd button.active {font-weight: bold; color: var(--pr);}
.tab_btn2 dl dd button.active:before {position: absolute; bottom: -7px; content: ''; display: block; width: 100%; height: 2px; background: var(--pr);}

.tab_btn2 dl dd a {position: relative; font-size: 18px; font-weight: 500; line-height: 1; color: var(--gray_b);}
.tab_btn2 dl dd a.active {font-weight: bold; color: var(--pr);}
.tab_btn2 dl dd a.active:before {position: absolute; bottom: -7px; content: ''; display: block; width: 100%; height: 2px; background: var(--pr);}

/* popup */
.dim {display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.2); z-index: 8888;}
.popup {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 640px; width: calc(100% - 40px); max-height: 100vh; height: auto; z-index: 9999;}
.popup .img-box {width: 100%; height: auto; max-height: 100vh;}
.popup .img-box img {width: 100%; height: auto; max-height: 100vh;}
.popup .close_btn {position: absolute; top: 0; right: 0; width: 83px; height: auto;}
.popup .close_btn img {width: 100%; opacity: 0;}

.mo_banner {display: none;}