@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&display=swap');

* {
	box-sizing: border-box;
	background-repeat: no-repeat;
	background-position: center;
}
html,
body {
	width: 100%;
	margin: 0;
	padding: 0;
	overflow-x: hidden;

	font-family: 'Noto Sans KR', sans-serif;
}
a {
	text-decoration: none;
	color: #777;
}
img {
	vertical-align: top;
}
button {
	border: 0px none;
	padding: 0px;
	background-color: transparent;
}

:lang(ko) {
	font-family: 'Noto Sans KR', sans-serif;
	word-break: keep-all;
}
/* :lang(en) {
	font-family: 'Montserrat', sans-serif;
	word-break: keep-all;
} */
:lang(ja) {
	font-family: 'Noto Sans JP', sans-serif;
}
:lang(zh-CN) {
	font-family: 'Noto Sans SC', sans-serif;
}

:root {
	/* color S */

	--black: #1e1e1e;
	--primary: #014783;
	--secondary: #475c71;
	--tertiary: #15304b;
	--pri-ip-blue: #0047bb;
	--pri-darkness: #010440;
	--pri-white: #ffffff;
	--secondary-dark: #1e1e1e;
	--secondary-dark-gray: #4b4b57;
	--secondary-gray: #88929e;
	--secondary-medium: #bdc5ca;
	--secondary-light: #dcdee7;
	--secondary-shine: #fafafc;
	/* color E */

	/* fonts S */
	--font-size-h2: 36px;
	--font-size-h3: 28px;
	--font-size-h4: 28px;
	--font-size-h5: 24px;
	--font-size-h6: 16px;
	--font-size-body1: 18px;
	--font-size-body2: 14px;

	--font-lh-h2: 54px;
	--font-lh-h3: 42px;
	--font-lh-h4: 42px;
	--font-lh-h5: 36px;
	--font-lh-h6: 24px;
	--font-lh-body1: 24px;
	--font-lh-body2: 23px;

	--font-ls-h2: 0.5px;
	--font-ls-h3: 0.2px;
	--font-ls-h4: 0.5px;
	--font-ls-h5: 0.5px;
	--font-ls-h6: 0.5px;
	--font-ls-body1: 0.2px;
	--font-ls-body2: 0.2px;

	--font-weight-h2: 700;
	--font-weight-h2: 500;
	--font-weight-h2: 700;
	--font-weight-h2: 700;
	--font-weight-h2: 700;
	--font-weight-body1: 500;
	--font-weight-body2: 500;

	/* fonts E */
}

/* 감추고 싶은 글자에 사용하는 css S */
.blind {
	border: 0;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	white-space: nowrap;
}
/* 감추고 싶은 글자에 사용하는 css E */

.container {
	width: 100%;
	max-width: 1140px;
	margin: 0px auto;
}

.pc-view,
.laptop-view,
.tablet-view,
.mobile-view {
	display: none;
}

@media all and (min-width: 1440px) {
	.pc-view {
		display: block;
	}
}
/* Laptop small S */
@media all and (min-width: 1024px) and (max-width: 1440px) {
	.laptop-view {
		display: block;
	}
}
/* Laptop E */

/* Tablet and Mobile S */
@media all and (max-width: 1023px) {
}
/* Tablet and Mobile E */

/* Tablet S */
@media all and (min-width: 768px) and (max-width: 1023px) {
	.tablet-view {
		display: block;
	}
}
/* Tablet E */

/* Mobile S */
@media all and (max-width: 767px) {
	:root {
		--font-size-h2: 24px;
		--font-size-h3: 18px;
		--font-size-h4: 18px;
		--font-size-h5: 18px;
		--font-size-h6: 18px;
		--font-size-body1: 14px;
		--font-size-body2: 12px;

		--font-lh-h2: 36px;
		--font-lh-h3: 28px;
		--font-lh-h4: 28px;
		--font-lh-h5: 24px;
		--font-lh-h6: 23px;
		--font-lh-body1: 23px;
		--font-lh-body2: 19px;

		--font-ls-h2: 0.5px;
		--font-ls-h3: 0.2px;
		--font-ls-h4: 0.5px;
		--font-ls-h5: 0.5px;
		--font-ls-h6: 0.5px;
		--font-ls-body1: 0.2px;
		--font-ls-body2: 0.2px;
	}

	.mobile-view {
		display: none;
	}
}
/* Mobile E */

/* animation css S */

.transition-3s {
	transition-duration: 0.3s;
}
.transition-5s {
	transition-duration: 0.5s;
}
.transition-7s {
	transition-duration: 0.7s;
}
.transition-10s {
	transition-duration: 1s;
}
.transition-12s {
	transition-duration: 1.2s;
}

.trans-delay-01s {
	transition-delay: 0.1s !important;
}
.trans-delay-02s {
	transition-delay: 0.2s !important;
}
.trans-delay-03s {
	transition-delay: 0.3s !important;
}
.trans-delay-05s {
	transition-delay: 0.5s !important;
}
.trans-delay-07s {
	transition-delay: 0.7s !important;
}
.trans-delay-09s {
	transition-delay: 0.9s !important;
}
.trans-delay-10s {
	transition-delay: 1s !important;
}

.fade-show-left {
	transform: translateX(-20%) !important;
	opacity: 0 !important;
}
.fade-show-right {
	transform: translateX(20%) !important;
	opacity: 0 !important;
}
.fade-show-bottom {
	transform: translateY(20%) !important;
	opacity: 0 !important;
}
.fade-show-top {
	transform: translateY(-20%) !important;
	opacity: 0 !important;
}
/* animation css E */