@charset "utf-8";
html.scroll,
html.show-modal { overflow: hidden; }
#wrap { width: 100%; overflow: hidden; }

@media screen and (min-width: 741px) {
	#header { width: 100%; border-bottom: 1px solid #d8d8d8; }
	#header > .inner-wrap { display: flex; height: 80px; align-items: center; justify-content: space-between; }
	#header > .inner-wrap .logo { width: 196px; }
	#header > .inner-wrap > div { display: flex; align-items: center; }
	#header > .inner-wrap > div > #gnb {}
	#header > .inner-wrap > div > #gnb > ul { display: flex; gap: 0 35px; }
	#header > .inner-wrap > div > #gnb > ul > li {}
	#header > .inner-wrap > div > #gnb > ul > li > a { font-size: 18px; font-weight: 500; letter-spacing: -0.9px; }
	#header > .inner-wrap > div > #gnb > ul > li.on > a { font-weight: 700; }
	#header > .inner-wrap > div > .tnb { margin-left: 50px; display: flex; align-items: center; }
	#header > .inner-wrap > div > .tnb > li { font-size: 15px; font-weight: 500; letter-spacing: -0.75px; }
	#header > .inner-wrap > div > .tnb > li > a { color: #222; }
	#header > .inner-wrap > div > .tnb > li:nth-of-type(1) > a { display: block; width: 110px; height: 45px; line-height: 45px; color: #fff; text-align: center; border-radius: 500px; background: var(--primary-color); font-size: 15px; font-weight: 700; letter-spacing: -0.75px; }
	#header > .inner-wrap > div > .tnb > li:nth-of-type(2) { margin-left: 14px; }
	#header > .inner-wrap > div > .tnb > li:nth-of-type(3) { margin-left: 20px; position: relative; }
	#header > .inner-wrap > div > .tnb > li:nth-of-type(3)::before { content: ''; position: absolute; left: -10px; top: 4px; width: 1px; height: 15px; background: #222; }

	.side-menu { display: none; }

	.foot-db { width: min(1920px, 100%); margin: 0 auto; background: #eaf1ff; margin-top: 73px; }
	.foot-db .inner { width: 1200px; height: 100px; margin: 0 auto; position: relative; display: flex; align-items: center; }
	.foot-db .inner > p { position: absolute; left: 0; top: -73px; }
	.foot-db .inner form { display: flex; flex-direction: column; }
	.foot-db .inner form > ul { display: flex; gap: 0 10px; }
	.foot-db .inner form > div { display: flex; align-items: center; gap: 0 5px; }

	.foot-db select,
	.foot-db input[type=text] { width: 170px; height: 55px; border: 1px solid #dcdcdc; border-radius: 4px; font-family: 'Noto Sans KR' !important; color: #666; font-size: 15px; padding: 0 10px; background: #fff; }
	.foot-db input::placeholder { font-size: 15px; color: #666; font-family: 'Noto Sans KR' !important; }
	.foot-db input[type=submit] { width: 211px; height: 60px; border: 0; background: #163960; color: #fff; font-size: 20px; font-weight: 700; border-radius: 500px; }
	.foot-db #captcha { position: relative; }
	.foot-db #captcha #captcha_img { width: 120px; height: 55px; }
	.foot-db #captcha #captcha_key { height: 55px; }
	.foot-db #captcha #captcha_mp3 { width: 27px; height: 27px; background-size: 100%; }
	.foot-db #captcha #captcha_reload { width: 27px; height: 27px; background-size: 100%; background-position: 0 -27px;position: absolute; right: 0; bottom: 0; }
	.foot-db #captcha #captcha_info { display: none; }

	#footer { border-top: 1px solid #e9e9e9; }
	#footer > ul { width: min(1200px, 92.3077vw); margin: 0 auto; display: flex; padding: 40px 0 15px; padding-left: min(446px, 34.3077vw); gap: 0 30px; }
	#footer > ul > li { font-size: min(18px, 1.3846vw); font-weight: 700; letter-spacing: -0.9px; color: #333; }
	#footer picture { height: min(127px, 9.7692vw); }

	.quick-bt { position: fixed; left: 50%; margin-left: min(464px, 35.6923vw); bottom: 225px; z-index: 100; width: min(142px, 10.9231vw); }
}


@media screen and (max-width: 1200px) {
	#header > .inner-wrap .ham { display: block !important; }
	#header > .inner-wrap > div { display: none; }

	.side-menu { position: fixed; right: 0; top: 0; width: 618px; height: 100vh; background: #fff; z-index: 10; display: none; }
	.side-menu .head { width: 100%; height: 80px; display: flex; justify-content: space-between; align-items: center; padding: 0 35px; }
	.side-menu .head > ul { display: flex; align-items: center; gap: 0 50px; }
	.side-menu .head > ul > li { position: relative; }
	.side-menu .head > ul > li~li::before { content: ''; position: absolute; left: -25px; top: 7px; width: 1px; height: 24px; background: #222; }
	.side-menu .head > ul > li > a { font-size: 24px; font-weight: 500; color: #222; letter-spacing: -1.2px; }
	.side-menu .head .close { width: 47px; }

	.side-menu .container { border-top: 1px solid #333; padding: 70px 0 0 35px; }
	.side-menu .container > ul {}
	.side-menu .container > ul > li {}
	.side-menu .container > ul > li~li { margin-top: 65px; }
	.side-menu .container > ul > li > a { font-size: 32px; color: #222; letter-spacing: -1.6px; }
}


@media screen and (max-width: 740px) {
	#header { width: 100%; border-bottom: 1px solid #d8d8d8; }
	#header > .inner-wrap { display: flex; height: 100px; align-items: center; justify-content: space-between; }
	#header > .inner-wrap .logo { width: 228px; }
	#header > .inner-wrap .ham { width: 46px; }

	#footer { border-top: 1px solid #e9e9e9; }
	#footer > ul { width: 100%; display: flex; padding: 40px 0 35px; gap: 0 30px; justify-content: center; }
	#footer > ul > li { font-size: 20px; font-weight: 700; letter-spacing: -1px; color: #333; }

	.quick-bt { position: fixed; right: 2%; top: 50%; z-index: 100; width: min(19.4444vw, 142px); }

	.foot-db { width: 100%;margin-top: 73px; }
	.foot-db .inner { width: 100%; background: #eaf1ff; display: flex; flex-direction: column; position: relative; padding: 30px 20px; }
	.foot-db .inner > p { position: absolute; left: 50%; transform: translate(-50%, 0); top: -73px; width: 333px; }
	.foot-db .inner form { display: flex; flex-direction: column; }
	.foot-db .inner form > ul { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; }
	.foot-db .inner form > ul > li { width: 49%; }
	.foot-db .inner form > ul > li.full { width: 100%; }
	.foot-db .inner form > div { display: flex; align-items: center; justify-content: center; gap: 0 5px; margin-top: 10px; font-size: 16px; }

	.foot-db select,
	.foot-db input[type=text] { width: 100%; height: 55px; border: 1px solid #dcdcdc; border-radius: 4px; font-family: 'Noto Sans KR' !important; color: #666; font-size: 18px; padding: 0 10px; background: #fff; }
	.foot-db input::placeholder { font-size: 18px; color: #666; font-family: 'Noto Sans KR' !important; }
	.foot-db input[type=submit] { width: 100%; height: 80px; border: 0; background: #163960; color: #fff; font-size: 28px; font-weight: 700; border-radius: 500px; }


	/* ------------------------------------------------------------- vw (740px, 1px = 0.1351) ------------------------------------------------------------- */
	#header { width: 100%; border-bottom: 1px solid #d8d8d8; }
	#header > .inner-wrap { display: flex; height: 13.5135vw; align-items: center; justify-content: space-between; }
	#header > .inner-wrap .logo { width: 30.8108vw; }
	#header > .inner-wrap .ham { width: 6.2162vw; }
	
	#footer { border-top: 0.1351vw solid #e9e9e9; }
	#footer > ul { width: 100%; display: flex; padding: 5.4054vw 0 4.7297vw; gap: 0 4.0541vw; justify-content: center; }
	#footer > ul > li { font-size: 2.7027vw; font-weight: 700; letter-spacing: -0.1351vw; color: #333; }

	.side-menu { position: fixed; right: 0; top: 0; width: 83.5135vw; height: 100vh; background: #fff; z-index: 10; display: none; }
	.side-menu .head { width: 100%; height: 13.5135vw; display: flex; justify-content: space-between; align-items: center; padding: 0 4.7297vw; }
	.side-menu .head > ul { display: flex; align-items: center; gap: 0 6.7568vw; }
	.side-menu .head > ul > li { position: relative; }
	.side-menu .head > ul > li~li::before { content: ''; position: absolute; left: -3.3784vw; top: 0.9459vw; width: 1px; height: 3.2432vw; background: #222; }
	.side-menu .head > ul > li > a { font-size: 3.2432vw; font-weight: 500; color: #222; letter-spacing: -0.1622vw; }
	.side-menu .head .close { width: 6.3514vw; }

	.side-menu .container { border-top: 1px solid #333; padding: 9.4595vw 0 0 4.7297vw; }
	.side-menu .container > ul {}
	.side-menu .container > ul > li {}
	.side-menu .container > ul > li~li { margin-top: 8.7838vw; }
	.side-menu .container > ul > li > a { font-size: 4.3243vw; color: #222; letter-spacing: -0.2162vw; }
	
	.foot-db { width: 100%;margin-top: 9.8649vw; }
	.foot-db .inner { width: 100%; background: #eaf1ff; display: flex; flex-direction: column; position: relative; padding: 4.0541vw 2.7027vw; }
	.foot-db .inner > p { position: absolute; left: 50%; transform: translate(-50%, 0); top: -9.8649vw; width: 45.0000vw; }
	.foot-db .inner form { display: flex; flex-direction: column; }
	.foot-db .inner form > ul { display: flex; flex-wrap: wrap; gap: 1.3514vw; justify-content: space-between; }
	.foot-db .inner form > ul > li { width: 49%; }
	.foot-db .inner form > ul > li.full { width: 100%; }
	.foot-db .inner form > div { display: flex; align-items: center; justify-content: center; gap: 0 0.6757vw; margin-top: 1.3514vw; font-size: 2.1622vw; }

	.foot-db select,
	.foot-db input[type=text] { width: 100%; height: 7.4324vw; border: 0.1351vw solid #dcdcdc; border-radius: 0.5405vw; font-family: 'Noto Sans KR' !important; color: #666; font-size: 2.4324vw; padding: 0 1.3514vw; background: #fff; }
	.foot-db input::placeholder { font-size: 2.4324vw; color: #666; font-family: 'Noto Sans KR' !important; }
	.foot-db input[type=submit] { width: 100%; height: 10.8108vw; border: 0; background: #163960; color: #fff; font-size: 3.7838vw; font-weight: 700; border-radius: 67.5676vw; }
}