/*
===================
Made by MarvelWorks
site : http://marvelworks.kr
* One  domain, One server, One license
* License Inquiry : info@marvelworks.kr
===================
*/

/*
===================
기본 스타일
===================
*/

:root {
	--radio-check-width: 2px;
	--radio-border-width: 1px;
	--radio-size: 20px;
	--card-padding: 2em;
	--color-gray: #cdd3dc;
	--color-green: var(--point-color);

	--wrap-width: 1400px;
	--point-color: #181d62;
	--point-color2: #01316e;

	--menu-width: 180px;
	--mainmenu-height: 90px;
	--submenu-height: 320px;
	--footmenu-num: 6;
}

html {
	overflow-x: hidden;
}

html,
body {
	height: 100%;
	padding: 0;
	margin: 0;
	text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

input,
textarea,
button {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
}

*,
html,
body,
div,
table,
nav {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

input[type=file][title]:hover::after {
	content: attr(title);
	position: absolute;
	bottom: -100%;
	left: 0;
	background: #333;
	width: 100%;
	padding: 5px 20px;
	font-size: 14px;
	color: #fff;
	z-index: 9999;
}

p,
div,
span,
h2,
h1,
h3,
h4,
h5,
h6 {
	word-break: keep-all;
}

::placeholder,
:-ms-input-placeholder,
::-ms-input-placeholder {
	color: #ccc !important;
}

select {
	-moz-appearance: none;
	/* Firefox */
	-webkit-appearance: none;
	/* Safari and Chrome */
	appearance: none;
	/* 화살표 없애기 공통*/
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%2dddddd%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%;
	background-size: .65em auto;
	padding: 5px 30px 5px 10px;
}

input[type="checkbox"],
input[type="radio"] {
	font-size: inherit;
	margin: 0;
}

input[type="checkbox"]:focus,
input[type="radio"]:focus,
input[type="checkbox"]:checked,
input[type="radio"]:checked {
	outline: none !important;
}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {

	input[type="checkbox"],
	input[type="radio"] {
		-webkit-appearance: none;
		-moz-appearance: none;
		background: #fff;
		border: var(--radio-border-width) solid var(--color-gray);
		cursor: pointer;
		height: var(--radio-size);
		outline: none;
		transition: background 0.2s ease-out, border-color 0.2s ease-out;
		width: var(--radio-size);
		position: relative;
		display: inline-block;
		margin-right: 5px;
	}

	input[type="checkbox"]::after,
	input[type="radio"]::after {
		border: var(--radio-check-width) solid var(--color-gray);
		border-top: 0;
		border-left: 0;
		content: "";
		display: block;
		height: 0.6rem;
		left: 25%;
		position: absolute;
		top: 45%;
		transform: rotate(45deg) translate(-50%, -50%);
		width: 0.375rem;
	}

	input[type="checkbox"]:checked,
	input[type="radio"]:checked {
		background: var(--color-green) !important;
		border-color: var(--color-green) !important;
	}

	input[type="checkbox"]:checked::after,
	input[type="radio"]:checked::after {
		border-color: #fff;
	}
}

/*
==============================
DEFAULT
==============================
*/
.pcolor {
	color: var(--point-color);
}

.pcolor2 {
	color: var(--point-color2);
}

.tpoint {
	float: left;
	width: 100%;
	font-size: 1.7rem;
	font-weight: bold;
	margin: 0 0 20px 0;
}

.tpoint:before {
	display: inline-block;
	border-left: 4px solid var(--point-color);
	width: 0;
	height: 26px;
	vertical-align: middle;
	content: " ";
	margin-right: 10px;
	margin-bottom: 5px;
}

.tpoint.tpoint-white:before {
	border-color: #fff;
}

.tpoint1 {
	display: inline-block;
	width: calc(100% - 20px);
	font-size: 1.9rem;
	font-weight: bold;
	position: relative;
}

.tpoint1:before {
	display: inline-block;
	width: 3px;
	height: 24px;
	background: var(--point-color);
	content: '';
	vertical-align: baseline;
	margin-right: 15px;
}

.tpoint2 {
	display: inline-block;
	font-size: 2.75rem;
	font-weight: 800;
	position: relative;
}

/*
.tpoint2:before {
	content: '';
	position: absolute;
	bottom: -30px;
	left: 50%;
	transform: translate(-50%, 0);
	width: 30px;
	height: 2px;
	background: #111;
}
*/

.tpoint2.tpoint-white:before {
	background: #fff;
}

.tpoint3 {
	float: left;
	width: 100%;
	display: inline-block;
	font-size: 2.7rem;
	font-weight: 700;
	position: relative;
}

.tpoint3:before {
	content: '';
	position: absolute;
	bottom: -25px;
	left: 0;
	width: 30px;
	height: 2px;
	background: #111;
}

.tpoint3.tpoint-white:before {
	background: #fff;
}

.tpointp {
	font-size: 1.14rem;
	line-height: 1.7;
}

.tpoint_under {
	font-size: 1.2rem;
	color: #ababab;
	margin-top: 20px;
	font-weight:500;
	line-height:1.5;
}

.npoint {
	margin-bottom: 10px;
	color: var(--point-color);
}

.npoint .num {
	background: var(--point-color);
	color: #fff;
	padding: 2px 25px;
	border-radius: 20px;
	margin-right: 5px;
}

.tabs {
	float: left;
	width: 100%;
	margin: -3rem 0 10rem 0;
}

.tabs li {
	float: left;
	width: 50%;
	border-radius: 0;
	overflow: hidden;
}

.tabs li a {
	display: block;
	border: 0px solid #ededed;
	padding: 22px;
	font-size: 1.15rem;
	text-align: center;
	color: #585858;
	background: #dfdfdf;
	font-weight: 700;
	transition: all .2s;
	position: relative;
}

.tabs li a:after {
	content: '';
	width: 100%;
	height: 0;
	bottom: 0;
	left: 0;
	position: absolute;
	background: #c3c3c3;
	opacity: 0.3;
	transition: all .4s;
}

.tabs li:hover a:after {
	height: 100%;
	transition: all .4s;
}

.tabs li.active a {
	background: var(--point-color);
	border-color: #111;
	color: #fff;
}

.tabs li.active a:after {
	display: none;
}

@media (max-width:1280px) {
	.tpoint1 {
		font-size: 1.2rem;
	}

	.tpoint1:before {
		vertical-align: middle;
		height: 20px;
	}

	.tpoint3 {
		font-size: 1.7rem;
	}

	.tpointp {
		font-size: 1.04rem;
	}

	.tabs {
		margin: 0 0 5rem 0;
	}

	.tabs li a {
		padding: 15px 0;
		font-size: 1rem;
	}
}


.innerwrap {
	width: 100%;
	margin: 0 auto;
	max-width: var(--wrap-width);
}

.innerwrap2 {
	width: 100%;
	max-width: var(--wrap-width);
	margin: 0 auto;
}

.innerwrap img,
.innerwrap2 img {
	max-width: 100%;
}

/*
==============================
END-DEFAULT
==============================
*/

.imgwrap {
	border: 1px solid #ddd;
	padding: 50px 0;
	text-align: center;
}

.imgwrap2 {
	margin: 20px 0;
}

.imgwrap img {}

.ltspc-01 {
	letter-spacing: -0.01em;
}

.navheader {
	position: fixed;
	top: 0;
	text-align: center;
	padding: 20px 0 15px 0;
	background: transparent;
	_rgba(0, 0, 0, 0.3);
	color: #fff;
	z-index: 999;
	text-align: center;
	width: 100%;
	transition: all 0.5s;
}

.navheader.min {
	background: rgba(255, 255, 255, 1);
	padding: 15px 0 5px 0;
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
	transition: all 0.5s;
}

.navheader.min .logo img {
	width: 95px;
	margin-top: 3px;
	transition: all 0.5s;
}

.slideropc {
	background: rgba(0, 0, 0, 0.25);
	width: 100%;
	position: absolute;
	z-index: 99;
	color: #fff !important;
	height: 100%;
	text-align: center;
}

.slidertxt {
	position: absolute;
	z-index: 100;
	color: #fff !important;
	text-align: left;
	width: 100%;
	max-width: var(--wrap-width);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.slidertxt .bigtxt {
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1.4;
}

.slidertxt .smalltxt {
	font-size: 2rem;
	font-weight: 300;
	letter-spacing: -0.5px;
	margin-bottom: 30px;
}

.slidertxt p {
	margin: 0;
}

.subslider .slideropc {
	background: linear-gradient(0deg, rgba(0,0,0,0.4), rgba(0,0,0,0.2), rgba(0,0,0,0.2), rgba(0,0,0,0.4));
}

.subslider .slidertxt {
	top: 52%;
	margin-top: 0;
}

.subslider .slidertxt .bigtxt {
	display:none;
	font-size: 3rem;
	color: #fff;
	line-height: 1.3;
}

.subslider .slidertxt .smalltxt {
	font-size: 4.4rem;
	color: rgba(255, 255, 255, 0.9);
	text-transform: uppercase;
	font-weight: 800;
	margin-bottom: 20px;
}

.subslider .slidertxt p {
	margin: 0;
}

.subslider:after {
	position: absolute;
	width: 50%;
	height: 70px;
	background: #fff;
	bottom: 0;
	left: 50%;
	z-index: 999;
}

.contentbox {
	float: left;
	width: 100%;
	font-size: 1.1rem;
	font-weight: 400;
	padding: 0;
	position: relative;
	margin: 0 0 8rem 0;
	line-height: 1.5;
}

.botfooter {
	float: left;
	width: 100%;
	background: #000;
	color: #bdbdbd;
	text-align: left;
	padding: 40px 0;
	font-size: 14px;
	line-height: 1.6rem;
}

.botfooter .bar {
	color: #868686;
	margin: 0 5px;
}

.botfooter a {
	color: #bdbdbd;
}

.pagetit {
	font-size: 22px;
	font-weight: 400;
	line-height: 1.7;
	margin-top: 20px;
	margin-bottom: 30px;
}

.subpagetit {
	text-align: center;
	color: #777;
	margin: 30px 0 50px 0;
}

.subpagetit h2 {
	font-size: 2.2rem;
	color: #191919;
	font-weight: 900;
}

.subpagetit p {
	font-size: .92rem;
	font-weight: 700;
	color: #bdbaba;
	margin-top: 20px;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.subpagetit .subbar {
	display: table;
	margin: 0 auto;
	border-top: 2px solid #ccc;
	width: 50px;
}

.subpagetit i {
	font-size: 2rem;
	color: #d7d7d7;
}

.subpagetit2 {
	float: left;
	width: 100%;
	text-align: center;
	margin: 7rem 0 4rem 0;
}

.ver_line {
	display: table;
	margin: 0 auto;
	width: 1px;
	height: 80px;
	background: #ddd;
}

.ver_line_sub {
	display: table;
	margin: 0 auto;
	width: 0;
	height: 80px;
	background: #ddd;
}

.about {
	float: left;
	width: 100%;
	background: #eaeff1;
}

.about .sc1 {
	float: left;
	width: 50%;
	padding: 67px 0;
	font-size: 18px;
	line-height: 36px;
}

.about .sc2 {
	float: left;
	width: 50%;
	min-height: 100%;
	height: 100%;
}

.opc {
	display: none;
	background: rgba(0, 0, 0, 0.4);
	top: 0;
	width: 100%;
	position: absolute;
	z-index: 99;
	color: #fff !important;
	height: 350px;
	text-align: center;
	color: #fff;
	animation: opacity 1s;
	padding: 120px 0;
	font-size: 1.7rem;
	font-weight: 500;
}

@keyframes opacity {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.about_2 {
	background: #fff;
	margin-top: 35px;
}

.about .sc1:hover .opc,
.about .sc2:hover .opc {
	display: block !important;
}

.opc .layout_btn2 {
	background: #fff;
	border: 1px solid #fff;
	color: #000;
}

.opc .layout_btn2:hover {
	background: #fff;
	border: 1px solid #fff;
	color: #444;
}

.fac_tab {
	float: left;
	width: 100%;
	border-bottom: 1px solid #ccc;
	margin-top: 30px;
}

.fac_tab li {
	float: left;
	background: #1a5bbb;
	color: #fff;
	padding: 10px 40px;
	min-width: 160px;
	text-align: center;
	font-weight: 500;
}

.fac_info {
	float: left;
	border: 1px solid #ccc;
	border-top: 0;
	width: 100%;
	padding: 20px;
}

.layout_cont {
	padding: 20px 0 0 0;
	line-height: 1.4rem;
}

.layout_page {
	padding: 0;
	color: #777;
}

.layout_page h2 {
	font-size: 34px;
	color: #333333;
	line-height: 34px;
	text-align: center;
	font-weight: 500;
}

.layout_box {
	float: left;
	width: 100%;
	text-align: center;
	padding: 60px 0;
	background: #f7f7f7;
}

.layout_box i {
	color: #e0e0e0;
	font-size: 3rem;
}

.layout_box span {
	font-size: 1.1rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #555;
}

.layout_box p {
	color: #777;
	margin-top: 20px;
	word-break: keep-all;
}

.layout_box .left {
	float: left;
	width: 33.3%;
}

.layout_box .center {
	float: left;
	width: 33.3%;
	border: 1px solid #e0e0e0;
	border-top: 0;
	border-bottom: 0;
	padding: 0 30px;
}

.layout_box .right {
	float: left;
	width: 33.3%;
}

.pt60 {
	padding-top: 60px;
}

.pb60 {
	padding-bottom: 60px;
}

.styletbl {
	float: left;
	width: 100%;
	border-top: 2px solid #868686;
}

.styletbl th,
.styletbl td {
	padding: 10px 20px;
	text-align: left;
}

.styletbl th {
	background: #fafafa;
	font-weight: 500;
	border-bottom: 1px solid #ddd;
	color: #444;
	text-align: center;
}

.styletbl td {
	color: #4c4c4c;
	border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

.styletbl strong {
	font-weight: 400;
}

.styletbl.overview {
	width: 100%;
	font-size: .94rem;
}

.styletbl.overview th {
	min-width: 120px;
}

.table02 {
	float: left;
	width: 100%;
}

.table02 th {
	padding: 10px;
	background: #bfddfb;
	text-align: center;
	font-weight: 500;
	border-left: 0px solid rgba(255, 255, 255, 0.5);
}

.table02 th:first-child {
	border-left: 0;
}

.table02 td:first-child {
	border-left: 0;
}

.table02 td {
	padding: 10px;
	text-align: center;
	border-bottom: 1px solid #ddd;
	border-left: 1px solid #ddd;
}

.alarm {
	width: 100%;
	float: left;
	text-align: center;
	margin-top: 30px;
	font-size: .94rem;
	letter-spacing: -0.5px;
	color: #0a26b6;
	font-weight: 400;
	background: #f7fbff;
	border: 1px solid #dbeefd;
	border-radius: 20px;
	padding: 10px 0;
}

.tbltit {
	float: left;
	width: 100%;
	font-size: 1.2rem;
	font-weight: 400;
	margin: 30px 0 20px 0;
	border-bottom: 1px solid #ddd;
	padding: 15px 0;
	color: #4a4a4a;
	text-align: center;
}

.tbltit i {
	font-size: 1rem;
	margin-right: 5px;
	color: #017bc9;
}

.sloganbox {
	width: 100%;
	height: 336px;
	padding: 140px 50px 0 100px;
	text-align: left;
	font-size: 2rem;
	color: #fff;
	font-weight: 500;
}

.sloganbox.company_slogan {
	background: url('../img/company_1.jpg') center center;
	background-size: cover;
}

.sloganbox.tech_slogan {
	background: url('/theme/mt-02/img/tech.jpg') 0 55%;
	background-size: cover;
}

.sloganbox .slogan {
	font-size: .9rem;
	font-weight: 300;
	margin-top: 10px;
	line-height: 1.2rem;
}

.layout_btn1 {
	background-color: transparent;
	color: #333;
	font-size: 14px;
	border: 1px solid #333;
	padding: 10px 20px;
	font-weight: 600;
}

.layout_btn1:hover {
	background: #333;
	color: #fff;
	transition: all 0.5s;
}

.layout_btn2 {
	background-color: #333;
	color: #fff;
	font-size: 14px;
	border: 1px solid #333;
	padding: 10px 20px;
	font-weight: 600;
}

.layout_btn2:hover {
	background: transparent;
	color: #333;
	transition: all 0.5s;
}

.layout_btn3 {
	background-color: #d13f4a;
	color: #fff;
	font-size: 14px;
	border: 1px solid #d13f4a;
	padding: 10px 20px;
	font-weight: 600;
}

.layout_btn3:hover {
	background: transparent;
	color: #d13f4a;
	transition: all 0.5s;
}

.layout_btn4 {
	background-color: #fff;
	color: #333;
	font-size: 14px;
	border: 1px solid #fff;
	padding: 10px 20px;
	font-weight: 600;
}

.layout_btn4:hover {
	background: transparent;
	color: #fff;
	transition: all 0.5s;
}

.layout_admbtn {
	background: #fff;
	color: #333;
	border: 1px solid #ccc;
	padding: 2px 8px;
	font-size: 10px;
	font-weight: 500;
}

.layout_admbtn:hover {
	background: #ccc;
	color: #fff;
	transition: all .5s;
}

.send_btn1 {
	display: inline-block;
	padding: 20px 60px !important;
	border-radius: 100px;
	color: #fff;
	background: var(--point-color);
	border: 0;
	cursor: pointer;
	position: relative;
	font-weight: bold;
}

.btn-1 {
	background: rgb(6, 14, 131);
	background: linear-gradient(0deg, rgba(6, 14, 131, 1) 0%, rgba(12, 25, 180, 1) 100%);
	border: none
}

.btn-1:hover {
	background: rgb(0, 3, 255);
	background: linear-gradient(0deg, rgba(0, 3, 255, 1) 0%, rgba(2, 126, 251, 1) 100%)
}

.btn-2 {
	background: rgb(96, 9, 240);
	background: linear-gradient(0deg, rgba(96, 9, 240, 1) 0%, rgba(129, 5, 240, 1) 100%);
	border: none
}

.btn-2:before {
	height: 0%;
	width: 2px
}

.btn-2:hover {
	box-shadow: 4px 4px 6px 0 rgba(255, 255, 255, .5), -4px -4px 6px 0 rgba(116, 125, 136, .5), inset -4px -4px 6px 0 rgba(255, 255, 255, .2), inset 4px 4px 6px 0 rgba(0, 0, 0, .4)
}

.btn-3 {
	background: rgb(0, 172, 238);
	background: linear-gradient(0deg, rgba(0, 172, 238, 1) 0%, rgba(2, 126, 251, 1) 100%);
	width: 130px;
	height: 40px;
	line-height: 42px;
	padding: 0;
	border: none
}

.btn-3 span {
	position: relative;
	display: block;
	width: 100%;
	height: 100%
}

.btn-3:before,
.btn-3:after {
	position: absolute;
	content: "";
	right: 0;
	top: 0;
	background: rgba(2, 126, 251, 1);
	transition: all 0.3s ease
}

.btn-3:before {
	height: 0%;
	width: 2px
}

.btn-3:after {
	width: 0%;
	height: 2px
}

.btn-3:hover {
	background: transparent;
	box-shadow: none
}

.btn-3:hover:before {
	height: 100%
}

.btn-3:hover:after {
	width: 100%
}

.btn-3 span:hover {
	color: rgba(2, 126, 251, 1)
}

.btn-3 span:before,
.btn-3 span:after {
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	background: rgba(2, 126, 251, 1);
	transition: all 0.3s ease
}

.btn-3 span:before {
	width: 2px;
	height: 0%
}

.btn-3 span:after {
	width: 0%;
	height: 2px
}

.btn-3 span:hover:before {
	height: 100%
}

.btn-3 span:hover:after {
	width: 100%
}

.btn-4 {
	background-color: #e12150;
	background-image: linear-gradient(315deg, #e12150 0%, #d5224e 74%);
	padding: 0;
	border: none
}

.btn-4:hover {
	background-color: #e12150;
	background-image: linear-gradient(315deg, #d5224e 74%, #e12150 0%);
}

.btn-4 span {
	position: relative;
	display: block;
	width: 100%;
	height: 100%
}

.btn-4:before,
.btn-4:after {
	position: absolute;
	content: "";
	right: 0;
	top: 0;
	box-shadow: 4px 4px 6px 0 rgba(255, 255, 255, .9), -4px -4px 6px 0 rgba(116, 125, 136, .2), inset -4px -4px 6px 0 rgba(255, 255, 255, .9), inset 4px 4px 6px 0 rgba(116, 125, 136, .3);
	transition: all 0.3s ease
}

.btn-4:before {
	height: 0%;
	width: .1px
}

.btn-4:after {
	width: 0%;
	height: .1px
}

.btn-4:hover:before {
	height: 100%
}

.btn-4:hover:after {
	width: 100%
}

.btn-4 span:before,
.btn-4 span:after {
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	box-shadow: 4px 4px 6px 0 rgba(255, 255, 255, .9), -4px -4px 6px 0 rgba(116, 125, 136, .2), inset -4px -4px 6px 0 rgba(255, 255, 255, .9), inset 4px 4px 6px 0 rgba(116, 125, 136, .3);
	transition: all 0.3s ease
}

.btn-4 span:before {
	width: .1px;
	height: 0%
}

.btn-4 span:after {
	width: 0%;
	height: .1px
}

.btn-4 span:hover:before {
	height: 100%
}

.btn-4 span:hover:after {
	width: 100%
}

.btn-5 {
	width: 130px;
	height: 40px;
	line-height: 42px;
	padding: 0;
	border: none;
	background: rgb(255, 27, 0);
	background: linear-gradient(0deg, rgba(255, 27, 0, 1) 0%, rgba(251, 75, 2, 1) 100%)
}

.btn-5:hover {
	color: #f0094a;
	background: transparent;
	box-shadow: none
}

.btn-5:before,
.btn-5:after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	height: 2px;
	width: 0;
	background: #f0094a;
	box-shadow: -1px -1px 5px 0 #fff, 7px 7px 20px 0 #0003, 4px 4px 5px 0 #0002;
	transition: 400ms ease all
}

.btn-5:after {
	right: inherit;
	top: inherit;
	left: 0;
	bottom: 0
}

.btn-5:hover:before,
.btn-5:hover:after {
	width: 100%;
	transition: 800ms ease all
}

.btn-6 {
	background: rgb(247, 150, 192);
	background: radial-gradient(circle, rgba(247, 150, 192, 1) 0%, rgba(118, 174, 241, 1) 100%);
	line-height: 42px;
	padding: 0;
	border: none
}

.btn-6 span {
	position: relative;
	display: block;
	width: 100%;
	height: 100%
}

.btn-6:before,
.btn-6:after {
	position: absolute;
	content: "";
	height: 0%;
	width: 1px;
	box-shadow: -1px -1px 20px 0 rgba(255, 255, 255, 1), -4px -4px 5px 0 rgba(255, 255, 255, 1), 7px 7px 20px 0 rgba(0, 0, 0, .4), 4px 4px 5px 0 rgba(0, 0, 0, .3)
}

.btn-6:before {
	right: 0;
	top: 0;
	transition: all 500ms ease
}

.btn-6:after {
	left: 0;
	bottom: 0;
	transition: all 500ms ease
}

.btn-6:hover {
	background: transparent;
	color: #76aef1;
	box-shadow: none
}

.btn-6:hover:before {
	transition: all 500ms ease;
	height: 100%
}

.btn-6:hover:after {
	transition: all 500ms ease;
	height: 100%
}

.btn-6 span:before,
.btn-6 span:after {
	position: absolute;
	content: "";
	box-shadow: -1px -1px 20px 0 rgba(255, 255, 255, 1), -4px -4px 5px 0 rgba(255, 255, 255, 1), 7px 7px 20px 0 rgba(0, 0, 0, .4), 4px 4px 5px 0 rgba(0, 0, 0, .3)
}

.btn-6 span:before {
	left: 0;
	top: 0;
	width: 0%;
	height: .5px;
	transition: all 500ms ease
}

.btn-6 span:after {
	right: 0;
	bottom: 0;
	width: 0%;
	height: .5px;
	transition: all 500ms ease
}

.btn-6 span:hover:before {
	width: 100%
}

.btn-6 span:hover:after {
	width: 100%
}

.btn-7 {
	background: linear-gradient(0deg, rgba(255, 151, 0, 1) 0%, rgba(251, 75, 2, 1) 100%);
	line-height: 42px;
	padding: 0;
	border: none
}

.btn-7 span {
	position: relative;
	display: block;
	width: 100%;
	height: 100%
}

.btn-7:before,
.btn-7:after {
	position: absolute;
	content: "";
	right: 0;
	bottom: 0;
	background: rgba(251, 75, 2, 1);
	box-shadow: -7px -7px 20px 0 rgba(255, 255, 255, .9), -4px -4px 5px 0 rgba(255, 255, 255, .9), 7px 7px 20px 0 rgba(0, 0, 0, .2), 4px 4px 5px 0 rgba(0, 0, 0, .3);
	transition: all 0.3s ease
}

.btn-7:before {
	height: 0%;
	width: 2px
}

.btn-7:after {
	width: 0%;
	height: 2px
}

.btn-7:hover {
	color: rgba(251, 75, 2, 1);
	background: transparent
}

.btn-7:hover:before {
	height: 100%
}

.btn-7:hover:after {
	width: 100%
}

.btn-7 span:before,
.btn-7 span:after {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	background: rgba(251, 75, 2, 1);
	box-shadow: -7px -7px 20px 0 rgba(255, 255, 255, .9), -4px -4px 5px 0 rgba(255, 255, 255, .9), 7px 7px 20px 0 rgba(0, 0, 0, .2), 4px 4px 5px 0 rgba(0, 0, 0, .3);
	transition: all 0.3s ease
}

.btn-7 span:before {
	width: 2px;
	height: 0%
}

.btn-7 span:after {
	height: 2px;
	width: 0%
}

.btn-7 span:hover:before {
	height: 100%
}

.btn-7 span:hover:after {
	width: 100%
}

.btn-8 {
	background-color: #f0ecfc;
	background-image: linear-gradient(315deg, #f0ecfc 0%, #c797eb 74%);
	line-height: 42px;
	padding: 0;
	border: none
}

.btn-8 span {
	position: relative;
	display: block;
	width: 100%;
	height: 100%
}

.btn-8:before,
.btn-8:after {
	position: absolute;
	content: "";
	right: 0;
	bottom: 0;
	background: #c797eb;
	transition: all 0.3s ease
}

.btn-8:before {
	height: 0%;
	width: 2px
}

.btn-8:after {
	width: 0%;
	height: 2px
}

.btn-8:hover:before {
	height: 100%
}

.btn-8:hover:after {
	width: 100%
}

.btn-8:hover {
	background: transparent
}

.btn-8 span:hover {
	color: #c797eb
}

.btn-8 span:before,
.btn-8 span:after {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	background: #c797eb;
	transition: all 0.3s ease
}

.btn-8 span:before {
	width: 2px;
	height: 0%
}

.btn-8 span:after {
	height: 2px;
	width: 0%
}

.btn-8 span:hover:before {
	height: 100%
}

.btn-8 span:hover:after {
	width: 100%
}

.btn-9 {
	border: none;
	transition: all 0.3s ease;
	overflow: hidden
}

.btn-9:after {
	position: absolute;
	content: " ";
	z-index: -1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #1fd1f9;
	background-image: linear-gradient(315deg, #1fd1f9 0%, #b621fe 74%);
	transition: all 0.3s ease
}

.btn-9:hover {
	background: transparent;
	box-shadow: 4px 4px 6px 0 rgba(255, 255, 255, .5), -4px -4px 6px 0 rgba(116, 125, 136, .2), inset -4px -4px 6px 0 rgba(255, 255, 255, .5), inset 4px 4px 6px 0 rgba(116, 125, 136, .3);
	color: #fff
}

.btn-9:hover:after {
	-webkit-transform: scale(2) rotate(180deg);
	transform: scale(2) rotate(180deg);
	box-shadow: 4px 4px 6px 0 rgba(255, 255, 255, .5), -4px -4px 6px 0 rgba(116, 125, 136, .2), inset -4px -4px 6px 0 rgba(255, 255, 255, .5), inset 4px 4px 6px 0 rgba(116, 125, 136, .3)
}

.btn-10 {
	background: rgb(22, 9, 240);
	background: linear-gradient(0deg, rgba(22, 9, 240, 1) 0%, rgba(49, 110, 244, 1) 100%);
	color: #fff;
	border: none;
	transition: all 0.3s ease;
	overflow: hidden
}

.btn-10:after {
	position: absolute;
	content: " ";
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	transition: all 0.3s ease;
	-webkit-transform: scale(.1);
	transform: scale(.1)
}

.btn-10:hover {
	color: #fff;
	border: none;
	background: transparent
}

.btn-10:hover:after {
	background: rgb(0, 3, 255);
	background: linear-gradient(0deg, rgba(2, 126, 251, 1) 0%, rgba(0, 3, 255, 1)100%);
	-webkit-transform: scale(1);
	transform: scale(1)
}

.btn-11 {
	border: none;
	background: rgb(251, 33, 117);
	background: linear-gradient(0deg, rgba(251, 33, 117, 1) 0%, rgba(234, 76, 137, 1) 100%);
	color: #fff;
	overflow: hidden
}

.btn-11:hover {
	text-decoration: none;
	color: #fff
}

.btn-11:before {
	position: absolute;
	content: '';
	display: inline-block;
	top: -180px;
	left: 0;
	width: 30px;
	height: 100%;
	background-color: #fff;
	animation: shiny-btn1 3s ease-in-out infinite
}

.btn-11:hover {
	opacity: .7
}

.btn-11:active {
	box-shadow: 4px 4px 6px 0 rgba(255, 255, 255, .3), -4px -4px 6px 0 rgba(116, 125, 136, .2), inset -4px -4px 6px 0 rgba(255, 255, 255, .2), inset 4px 4px 6px 0 rgba(0, 0, 0, .2)
}

@-webkit-keyframes shiny-btn1 {
	0% {
		-webkit-transform: scale(0) rotate(45deg);
		opacity: 0
	}

	80% {
		-webkit-transform: scale(0) rotate(45deg);
		opacity: .5
	}

	81% {
		-webkit-transform: scale(4) rotate(45deg);
		opacity: 1
	}

	100% {
		-webkit-transform: scale(50) rotate(45deg);
		opacity: 0
	}
}

.btn-12 {
	position: relative;
	right: 20px;
	bottom: 20px;
	border: none;
	box-shadow: none;
	width: 130px;
	height: 40px;
	line-height: 42px;
	-webkit-perspective: 230px;
	perspective: 230px
}

.btn-12 span {
	background: rgb(0, 172, 238);
	background: linear-gradient(0deg, rgba(0, 172, 238, 1) 0%, rgba(2, 126, 251, 1) 100%);
	display: block;
	position: absolute;
	width: 130px;
	height: 40px;
	box-shadow: inset 2px 2px 2px 0 rgba(255, 255, 255, .5), 7px 7px 20px 0 rgba(0, 0, 0, .1), 4px 4px 5px 0 rgba(0, 0, 0, .1);
	border-radius: 5px;
	margin: 0;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s
}

.btn-12 span:nth-child(1) {
	box-shadow: -7px -7px 20px 0 #fff9, -4px -4px 5px 0 #fff9, 7px 7px 20px 0 #0002, 4px 4px 5px 0 #0001;
	-webkit-transform: rotateX(90deg);
	-moz-transform: rotateX(90deg);
	transform: rotateX(90deg);
	-webkit-transform-origin: 50% 50% -20px;
	-moz-transform-origin: 50% 50% -20px;
	transform-origin: 50% 50% -20px
}

.btn-12 span:nth-child(2) {
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	transform: rotateX(0deg);
	-webkit-transform-origin: 50% 50% -20px;
	-moz-transform-origin: 50% 50% -20px;
	transform-origin: 50% 50% -20px
}

.btn-12:hover span:nth-child(1) {
	box-shadow: inset 2px 2px 2px 0 rgba(255, 255, 255, .5), 7px 7px 20px 0 rgba(0, 0, 0, .1), 4px 4px 5px 0 rgba(0, 0, 0, .1);
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	transform: rotateX(0deg)
}

.btn-12:hover span:nth-child(2) {
	box-shadow: inset 2px 2px 2px 0 rgba(255, 255, 255, .5), 7px 7px 20px 0 rgba(0, 0, 0, .1), 4px 4px 5px 0 rgba(0, 0, 0, .1);
	color: transparent;
	-webkit-transform: rotateX(-90deg);
	-moz-transform: rotateX(-90deg);
	transform: rotateX(-90deg)
}

.btn-13 {
	overflow: hidden;
	position: relative;
	outline: none;
	z-index: 1
}

.btn-13:after {
	position: absolute;
	content: "";
	width: 100%;
	height: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	background: #111;
	transition: all 0.3s ease
}

.btn-13:hover {
	color: #fff
}

.btn-13:hover:after {
	top: 0;
	height: 100%
}

.btn-13:active {
	top: 2px
}

.btn-14 {
	overflow: hidden;
	position: relative;
	outline: none;
	transition: all 0.3s ease;
	z-index: 1
}

.btn-14:after {
	position: absolute;
	content: "";
	width: 100%;
	height: 0;
	top: 0;
	left: 0;
	z-index: -1;
	border-radius: 5px;
	background-color: #1d57ce;
	transition: all 0.3s ease
}

.btn-14:hover {
	color: #fff
}

.btn-14:hover:after {
	top: auto;
	bottom: 0;
	height: 100%
}

.btn-14:active {
	top: 2px
}

.btn-15 {
	display: inline-block;
	position: relative;
	overflow: hidden;
	-ms-overflow-style: none;
	outline: none;
	z-index: 1;
	transition: all 0.3s ease
}

.btn-15:after {
	position: absolute;
	content: "";
	width: 0;
	height: 100%;
	top: 0;
	right: 0;
	z-index: -1;
	background-color: #2831af;
	transition: all 0.3s ease
}

.btn-15:hover {
	border-color: #2831af !important;
}

.btn-15:hover:after {
	left: 0;
	width: 100%
}

.btn-15:active {
	top: 2px
}

.btn-16 {
	border: none;
	color: #000
}

.btn-16:after {
	position: absolute;
	content: "";
	width: 0;
	height: 100%;
	top: 0;
	left: 0;
	direction: rtl;
	z-index: -1;
	box-shadow: -7px -7px 20px 0 #fff9, -4px -4px 5px 0 #fff9, 7px 7px 20px 0 #0002, 4px 4px 5px 0 #0001;
	transition: all 0.3s ease
}

.btn-16:hover {
	color: #000
}

.btn-16:hover:after {
	left: auto;
	right: 0;
	width: 100%
}

.btn-16:active {
	top: 2px
}

.contit {
	font-size: 1.2rem;
	font-weight: 400;
	margin-bottom: 10px;
	background: linear-gradient(to right, #432392 0%, #7046d8 50%, #a181ec 100%);
	float: left;
	padding: 4px 25px 5px 25px;
	color: #fff;
	border-radius: 20px;
}

.contit:before {
	float: left;
	content: "\e62f";
	font-family: 'themify';
	font-size: 1rem;
	margin-right: 10px;
	color: #fff;
}

.contit i {
	color: #11ceec;
	margin-right: 5px;
}

.consqr {
	float: left;
	width: 100%;
	border: 1px solid #c4b6e6;
	border-left: 0;
	border-right: 0;
	background: #fbfbfb;
	padding: 30px;
	margin-top: 10px;
	margin-bottom: 40px;
}

.consqr li:before {
	content: '\f00c';
	font: normal normal normal 14px/1 FontAwesome;
	font-weight: 700;
	margin-right: 10px;
	color: #6e44d5;
	-webkit-text-stroke: 0.5px #f7f7f7;
}

.select-menu {
	background: url('../img/down_arr.png') no-repeat 100% 50% !important;
	background-size: 15px !important;
}

.select-menu:focus {
	outline: none !important;
	outline-width: 0 !important;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	border: 0;
	-o-appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.select-menu option {
	background: #212990;
	font-size: .94rem;
}

#bo_v_con,
#bo_v_con * {
	font-family: var(--font-style) !important;
}


/*
===================
메인
===================
*/
.notice {}

.notice h1 {
	color: #FFF;
	letter-spacing: 0;
	font-weight: 900;
	font-size: 3rem;
	margin: 0 0 30px 0;
}

.notice h2 {
	font-size: 2.4rem;
	color: #fff;
	margin: 0 0 15px 0;
}

.notice p {
	font-size: 1.2rem;
}

.notice i {
	font-size: 3.6rem;
	color: rgba(255, 255, 255, 0.4);
	position: absolute;
	left: 40px;
	top: 30px;
}

.notice .left {
	float: left;
	width: 50%;
	height: 55vh;
	background: rgb(60 67 104 / 80%);
	position: relative;
}

.notice .right1 {
	float: left;
	width: 50%;
	height: 27.5vh;
	background: rgb(34 30 68 / 80%);
	position: relative;
}

.notice .right2 {
	float: left;
	width: 50%;
	height: 27.5vh;
	background: rgb(255 255 255 / 70%);
	position: relative;
}

.notice .right2 h2 {
	color: #333;
}

.notice .right2 i {
	color: rgba(0, 0, 0, 0.4);
}

.notice .right2 p {
	color: #878787 !important;
}

.notice .right2 .rightarr,
.notice .right2 .rightarr:before {
	background: #777 !important;
}

.rightarr {
	display: inline-block;
	width: 0;
	height: 1px;
	background: #ddd;
	position: relative;
	transition: all .2s;
	opacity: 0;
}

.rightarr:before {
	content: '';
	position: absolute;
	right: -2px;
	bottom: 5px;
	width: 0;
	height: 1px;
	transform: rotate(30deg);
	background: #ddd;
	opacity: 0;
}

.notice .left:hover .rightarr,
.notice .right1:hover .rightarr,
.notice .right2:hover .rightarr {
	margin-left: 10px;
	width: 50px;
	opacity: 1;
	transition: all .3s;
}

.notice .left:hover .rightarr:before,
.notice .right1:hover .rightarr:before,
.notice .right2:hover .rightarr:before {
	width: 20px;
	opacity: 1;
	transition: all .3s;
}

.txtboxes {
	position: absolute;
	color: #fff;
}

.txtboxes.topl {
	top: 40px;
	left: 40px;
	width: 80%;
}

.txtboxes.topr {
	top: 40px;
	right: 40px;
	width: 80%;
	text-align: right;
}

.txtboxes.botl {
	bottom: 40px;
	left: 40px;
	width: 80%;
}

.txtboxes.botr {
	bottom: 40px;
	right: 40px;
	width: 80%;
	text-align: right;
}

.txtboxes p {
	color: #b5b5b5;
}


.notlat li {
	width: 100%;
	float: left;
	border-bottom: 1px solid #e7e7e7;
	padding: 10px 0;
	font-size: 15px;
}

.notlat li .sbj {
	float: left;
}

.notlat li .date {
	float: right;
}

.notlat h2 {
	border-bottom: 1px solid #e7e7e7;
	padding-bottom: 15px;
	position: relative;
}

.notlat h2 span {
	position: absolute;
	right: 0;
	bottom: 15px;
	font-size: 2rem;
}

.notlat li i {
	color: #b3b3b3;
}

.lat li {
	float: left;
	width: 31.33%;
	margin-right: 3%;
	background: #fff;
	color: #333;
	padding: 50px;
}

.lat li:nth-of-type(3n) {
	margin-right: 0;
}

.lat li h2 {
	font-size: 1.7rem !important;
	line-height: 1.5 !important;
}

.lat li p {
	margin: 30px 0;
}

/*
===================
서브페이지 공통
===================
*/
.keyp {
	text-align: center;
	padding: 5rem 0;
}

.keyp2 {
	text-align: center;
	padding: 5rem 0 0 0;
}

.keyp h2,
.keyp2 h2 {
	font-size: 2.1rem;
	line-height: 1.5;
	font-weight: 500;
	letter-spacing: -0.07em;
	color: #212121;
}

.keyp p,
.keyp2 p {
	color: #666;
	font-size: 1.1rem;
	margin-top: 20px;
}

.keyp span,
.keyp2 span {
	color: var(--point-color);
}

.keyp2 h2 {
	border-bottom: 1px solid #000;
	display: inline-block;
}

.wide {
	width: 100vw !important;
	margin-left: 50%;
	transform: translate(-50%, 0);
	position: relative;
}

.midsec {
	float: left;
	width: 100%;
	height: 400px;
	position: relative;
}

.midsec .txtbox {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-600px, -50%);
	z-index: 4;
}

.midsec .tit {
	font-size: 4rem;
	color: #fff;
	font-weight: 500;
	margin: 50px 0;
}

.midsec .txt {
	font-size: 1.2rem;
	color: #fff;
}

.midsec .cat {
	font-size: 1.4rem;
	color: rgba(0, 0, 0, 0.8);
	border-bottom: 1px solid rgba(0, 0, 0, 0.8);
	font-weight: 500;
}

.contbox {
	float: left;
	width: 100%;
	color: #666;
	padding: 3rem 0;
	line-height: 2;
}

.topsec {
	float: left;
	width: 100%;
	padding: 60px 0 80px 0;
}

.topsec .left {
	float: left;
	width: 40%;
	padding-right: 5%;
}

.topsec h2 {
	font-weight: 700;
	font-size: 2.2rem;
	color: #000;
}

.topsec .right {
	float: left;
	width: 60%;
	position: relative;
	font-size: 1.1rem;
	line-height: 1.7;
	padding-top: 7px;
}

.topsec .right:before {
	position: absolute;
	left: -12.5%;
	top: 0;
	background: #dddeec;
	width: 2px;
	height: 100%;
}

.biztop {
	height: 200px;
}

.biztop .imgline {
	float: left;
	width: calc(100% - 200px);
	height: 250px;
	position: relative;
	margin-top: 80px;
	animation: imgups 1s forwards;
}

.biztop .imgline:before {
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4);
	opacity: 0.8;
}

.biztop .txtline {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	max-width: 90%;
}

.biztop .txtline {}

.imgup {
	float: left;
	width: calc(100% - 200px);
	height: 300px;
	position: relative;
	margin: 80px 0;
	animation: imgups 1s forwards;
}

.imgup:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4);
	top: 0;
	left: 0;
}

.imgup .txtbox {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
	text-align: center;
	font-weight: 500;
}

.imgup .txtbox .sm {
	font-size: .94rem;
	letter-spacing: 0.03em;
}

.imgup .txtbox .bigtxt {
	font-size: 2.3rem;
	font-weight: 700;
	margin: 20px 0;
}

.imgup .txtbox .smtxt {
	font-size: 1rem;
}

@keyframes imgups {
	0% {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}

	100% {
		width: calc(100% - 200px);
		margin-left: 100px;
		margin-right: 100px;
	}
}

.txtup {
	float: left;
	width: 100%;
}

.txtup .left {
	float: left;
	width: 20%;
}

.txtup .left p {
	font-size: 1.6rem;
	font-weight: 500;
}

.txtup .left i {
	width: 90px;
	height: 90px;
	line-height: 90px;
	font-size: 40px;
	background: #f6f8fe;
	text-align: center;
	border-radius: 100%;
	color: #0d499e;
	margin-right: 10px;
}

.txtup .right {
	float: left;
	width: 80%;
	padding: 35px;
	position: relative;
	color: #666;
	font-size: 1.1rem;
}

.txtup .right li {
	padding: 3px 0;
}

.txtup .right li:before {
	content: '';
	display: inline-block;
	width: 5px;
	height: 5px;
	background: #ddd;
	border-radius: 100%;
	margin-right: 10px;
	vertical-align: middle;
}

.tabsbox .midsec .tit {
	font-size: 3rem;
}

/*TAB CSS*/
.tabsbox {
	float: left;
	width: 100%;
}

.tabsbox table {
	margin-top: -7px;
}

.tabsbox .maps {
	float: left;
	width: 100%;
	position: relative;
}

.tabsbox .marks {
	position: absolute;
	right: 0;
	top: 0;
	width: 20%;
	height: 45%;
	background: var(--point-color);
	opacity: 1;
	z-index: 2;
	color: #fff;
	padding: 35px;
}

.tabsbox .marks .txt {
	margin-bottom: 15px;
	position: relative;
	font-size: 2rem;
	font-weight: 500;
}

.tabsbox .marks .txt:before {
	position: absolute;
	width: 30px;
	bottom: -20px;
	height: 1px;
	background: #fff;
	content: '';
}

.tabsbox .marks .tit {
	margin-top: 30px;
}

.tablist {
	border-bottom: 0px solid #d8d8d8;
}

ul.tabs {
	padding: 0;
	display: table;
	margin: 0 auto;
	list-style: none;
	width: 100%;
}

ul.tabs li {
	float: left;
	margin: 0;
	padding: 0;
	width: 25%;
	background: #ebebeb;
	border-left: none;
	margin-bottom: -1px;
	/*--Pull the list item down 1px--*/
	overflow: hidden;
	position: relative;
	text-align: center;
}

ul.tabs li a {
	text-decoration: none;
	color: #7b7b7b;
	display: block;
	padding: 20px 0;
	font-size: 1.14rem;
	outline: none;
	font-weight: 500;
}

ul.tabs li a:hover {
	color: var(--point-color);
}

html ul.tabs li.active,
html ul.tabs li.active a:hover {
	border-color: var(--point-color);
}

html ul.tabs li.active a {
	color: #fff;
	background: var(--point-color);
}

/*Tab Conent CSS*/
.tab_container {
	border-top: none;
	clear: both;
	float: left;
	width: 100%;
}

.tab_content {
	float: left;
	width: 100%;
	padding: 0;
}

.vertical-text {
	-ms-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);

	-ms-transform-origin: left top;
	-moz-transform-origin: left top;
	-webkit-transform-origin: left top;
	transform-origin: left top;
}

.lightbox {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.9);
	text-align: center;
	z-index: 99999;
}

.lightbox img {
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: 500px;
	box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
	animation: bringDown 300ms forwards ease-out;
}

@keyframes bringDown {
	0% {
		transform: translate(-50%, -100%);
		opacity: 0;
	}

	100% {
		transform: translate(-50%, -50%);
		opacity: 1;
	}
}

.page-banner {display:flex; align-items:center; justify-content:center; padding:2rem 0;  z-index:-2; position:relative; min-height:460px;}
.page-banner:before {content:''; width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; z-index:-1;}
.page-banner .txt { color:#fff; width:90%; z-index:3; text-align:center; line-height:1.35;}
.page-banner h2 {font-size:2.5rem;}
.page-banner p {margin-top:2rem; line-height:1.7; font-weight:500;}

@media (max-width:1200px) {
	.page-banner {min-height:initial; padding:4rem 0;}
	.page-banner .txt {width:85%;}
	.page-banner h2 {font-size:2rem;}
	.page-banner p {font-size:1rem; margin-top:1rem;}
}

/*
===================
인트로
===================
*/

#fp-nav {
	display: block;
}

#fp-nav.left {
	left: 10% !important;
	opacity: 0.7;
}

#fp-nav ul li .fp-tooltip.left {
	left: initial !important;
	right: 30px;
}

#fp-nav ul li,
.fp-slidesNav ul li {
	margin: 35px 0 !important;
}

#fp-nav ul li a span,
.fp-slidesNav ul li a span {
	width: 8px !important;
	height: 8px !important;
	background: rgba(255, 255, 255, 0.4) !important;
}

#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span {
	background: rgba(255, 255, 255, 0.9) !important;
	margin: -2px 0 0 -2px !important;
}

#fp-nav ul li a.active span:after {
	content: '';
	position: absolute;
	left: -65%;
	top: -60%;
	width: 18px;
	height: 18px;
	border-radius: 100%;
	border: 1px solid #eee;
}

#fp-nav ul li .fp-tooltip {
	top: 2px !important;
	font-weight: 500 !important;
	letter-spacing: 0;
	text-transform: uppercase !important;
}

#fp-nav ul li:last-child {
	display: none !important;
}

#fp-nav ul li:hover a span,
.fp-slidesNav ul li:hover a span {
	margin: -2px 0 0 -2px !important;
}

#fp-nav.new {}

#fp-nav.new ul li a span,
.fp-slidesNav ul li a span {
	background: rgba(0, 0, 0, 0.3) !important;
}

#fp-nav.new ul li a.active span,
#fp-nav.new ul li:hover a.active span {
	background: #0052ad !important;
}

#fp-nav.new ul li a.active span:after {
	border-color: #0052ad !important;
}

#fp-nav.new .fp-tooltip {
	color: #818181;
}

#fp-nav.new.fp-show-active a.active+.fp-tooltip {
	color: #0052ad !important;
}

.section * {
	animation-play-state: paused;
}

.section.active * {
	animation-play-state: running !important;
}

.myContent {
	width: 100%;
	margin: 0 auto;
	max-width: 1400px;
	height: 300px;
	padding: 50px 0;
	background: #fff;
}

.section {
	overflow: hidden;
	position: relative;
}

.section .opclayer {
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
	top: 0;
	background: rgba(0, 0, 0, 0.25);
	z-index: 2;
}

.section video {
	position: absolute;
	width: 120vw;
	height: auto;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 1;
}

.section .txt {
	position: absolute;
	left: 50%;
	width: 100%;
	max-width: var(--wrap-width);
	top: 50%;
	transform: translate(-50%, -43%);
	z-index: 3;
	color: #fff;
}

.section .txt h1 {
	font-size: 3.5rem;
	font-weight: 400;
	text-transform: uppercase;
	line-height: 1.4;
	letter-spacing: -4px;
}

.section .txt h1 span {
	font-weight: 700;
}

.section .txt h1.en {
	letter-spacing: 0;
}

.section .txt p {
	font-size: 1.35rem;
	font-weight: 400;
	line-height: 2;
	margin-top: 20px;
}

.section .txtp {
	font-size: 1.3rem;
	color: rgba(255, 255, 255, 0.9);
}

.news {
	position: fixed;
	right: 80px;
	bottom: 25px;
	text-align: right;
	z-index: 3;
	color: #fff;
	font-size: 1.2rem;
}

.news .cat {
	font-weight: 700;
}

.news .tit {
	margin: 0 20px;
	font-weight: 300;
	color: #fff;
}

.news .date {
	font-weight: 300;
}

.secbg {
	content: '';
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	animation: bisbg 20s infinite;
	z-index: 1;
}

@keyframes bisbg {
	0% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.3);
	}

	100% {
		transform: scale(1);
	}
}

.secbg:after {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	width: 100%;
	background: rgba(0, 0, 0, 0.1);
	z-index: 2;
}

.viewmore {
	display: inline-block;
	vertical-align: baseline;
	width: 40px;
	height: 1px;
	background: #fff;
	position: relative;
	margin-right: 10px;
}

.viewmore:before {
	content: '';
	position: absolute;
	right: 4px;
	bottom: 0px;
	width: 1px;
	height: 10px;
	background-color: #fff;
	transform: rotate(-45deg);
}

.viewmore.black {
	background: #333;
}

.viewmore.black:before {
	background: #333;
}

#section1 .opclayer {
	background: linear-gradient(52deg, rgb(65 14 143 / 50%) 20%, rgb(0 46 151 / 55%) 55%, rgb(159 33 64 / 40%) 88%);
}

#section2 .opclayer {
	/*background:linear-gradient(122deg, rgb(0 0 0 / 40%),rgb(2 64 189 / 40%) , rgb(72 22 13 / 40%) 99%);*/
	background: rgba(0, 0, 0, 0.25);
}

/*
===================
회사소개
===================
*/

.greeting {
	float: left;
	width: 100%;
}

.greeting .txtbox {
	float: right;
	width: 48%;
}

.greeting .imgbox {
	float: left;
	width: 40%;
}

.greeting .imgbox .ceoimg {
	border-radius: 7px;
	box-shadow: 10px 20px 40px rgba(0, 0, 0, 0.05);
}

.greeting .sign {
	font-weight: 700;
	font-size: 1.2rem;
}

.greeting .sign span {
	color: #142d65;
	margin-right: 10px;
}

.greeting .sign img {
	margin-left: 20px;
}

.newinfo {
	float: left;
	width: 100%;
}

.newinfo h2 {
	font-size: 2.2rem;
	font-weight: 700;
	margin: 0 0 50px 0;
}

.newinfo p {
	font-size: 1.1rem;
	color: #404040;
	font-weight: 400;
	line-height: 2;
}

.ceo {
	float: left;
	width: 49%;
	margin-right: 2%;
	border: 1px solid #ddd;
	padding: 35px;
	min-height: 600px;
	position: relative;
	transition: all .2s;
}

.ceo:nth-of-type(2n) {
	margin-right: 0;
}

.ceo h2 {
	border-bottom: 1px solid #ddd;
	padding-bottom: 15px;
	margin-bottom: 20px;
	transition: all .2s;
}

.ceo h2 span {
	font-size: 1rem;
	color: gray;
	margin-left: 20px;
	font-weight: 500;
}

.ceo ul li {
	padding: 5px 0;
}

.ceo ul li:before {
	content: '';
	display: inline-block;
	width: 5px;
	height: 5px;
	border-radius: 100%;
	background: #ccc;
	margin-right: 10px;
	vertical-align: middle;
}

.ceo p {
	margin-top: 10px;
	font-weight: 500;
}

.ceo .line {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #e3e3e3;
	padding: 15px 35px;
	color: #333;
	transition: all .2s;
}

.ceo:hover {
	border-color: var(--point-color);
	transition: all .2s;
}

.ceo:hover h2 {
	color: var(--point-color);
	transition: all .2s;
}

.ceo:hover .line {
	background: var(--point-color);
	color: #fff;
	transition: all .2s;
}

.ceo2 {
	float: left;
	width: 100%;
}

.ceo2 h2 {
	margin-bottom: 20px;
	transition: all .2s;
}

.ceo2 h2 span {
	font-size: 1.1rem;
	color: gray;
	margin-left: 10px;
	font-weight: 500;
}

.ceo2 ul li {
	padding: 2px 0;
}

@media (max-width:1280px) {
	.greeting .imgbox {
		width: 60%;
		margin-bottom: 3rem;
	}

	.greeting .txtbox {
		width: 100%;
	}

	.greeting .sign span {
		display: block;
		margin-bottom: 2rem;
	}

	.greeting .sign img {
		margin-left: 0;
		max-height: 40px !important;
	}
}

/*
==================
파이프라인
==================
*/
.rdmap th,
.rdmap td {
	padding: 20px;
}

.rdmap td {
	text-align: center;
}

.rdmap thead th {
	font-weight: 500;
	color: #000;
	font-size: 1.1rem;
}

.rdmap .days {
	float: left;
	width: 100%;
	height: 30px;
	line-height: 30px;
	color: #fff;
	background: linear-gradient(90deg, #096cd1, #228f76);
	text-align: center;
	position: relative;
}

.rdmap .days:after {
	content: "";
	position: absolute;
	height: 0;
	width: 0;
	left: 100%;
	top: -5px;
	border: 20px solid transparent;
	border-left: 20px solid #228f76;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.rdmap .out {
	float: left;
	width: 100%;
	max-width: 120px;
	padding: 3px 20px;
	text-align: center;
	border: 1px solid #ee8112;
	background: #fff2d6;
	font-weight: bold;
	color: #ed8112;
	letter-spacing: 0;
}

.rdmap .dtit td {
	width: 10%;
	font-weight: 700;
	font-size: 0.94rem;
}

@media (max-width:1300px) {
	.ceo {
		width: 100%;
		height: initial;
		padding: 20px;
		margin-bottom: 20px;
	}

	.ceo .line {
		position: initial;
		float: left;
		padding: 20px;
	}

	.rdmap .out {
		max-width: 140px;
	}
}

.rdmap th,
.rdmap td {
	padding: 10px;
	position: relative;
	font-size: 1rem;
}

.grp {
	position: relative;
	font-size: 1rem;
	display: block;
	background: #000;
	min-width: 100px;
	height: 35px;
	line-height: 35px;
	border-radius: 20px;
	opacity: 0;
	color: #fff;
	animation: grp 1.5s forwards;
	animation-delay: 0.5s;
	transition: all .2s;
}

.grp-hide {
	position: absolute;
	top: 0;
	right: 0;
	background: #fff;
	height: 100%;
}

.grp-green {
	background: #438b36;
}

.grp-orange {
	background: #e59137;
}

.grp-blue {
	background: #3c7ac7;
}

@keyframes grp {
	0% {
		transform: translate(-65%, 0);
		opacity: 0;
	}

	50% {
		transform: translate(0, 0);
	}

	100% {
		opacity: 1;
	}
}

.network {
	float: left;
	width: 100%;
}

.network .one {
	border: 1px solid #ddd;
	float: left;
	width: 32%;
	margin: 0 2% 2% 0;
	height: 300px;
	padding: 30px;
	text-align: center;
	transition: all .2s;
}

.network .one:nth-of-type(3n) {
	margin-right: 0;
}

.network span {
	display: inline-block;
	width: 40px;
	height: 1px;
	background: #ccc;
}

.network .one img {
	margin: 20px 0;
	max-width: 70%;
	max-height: 50px;
}

.network .one p {
	color: gray;
}

.network .one:hover {
	border-color: navy;
	transition: all .2s;
}

@media (max-width:1200px) {
	.network .one {
		width: 100%;
		margin: 0 0 20px 0;
		height: initial;
	}
}


/*
===================
사업분야
===================
*/
.business {
	margin-bottom: 150px;
}

.business:before {
	content: '';
	position: absolute;
	width: 100vw;
	left: 50%;
	top: 50%;
	transform: translate(-50%, 0);
	height: 100%;
	background: #f7f7f7;
	z-index: -1;
}

.business .one p {
	text-align: center;
	font-weight: 500;
	margin-top: 20px;
	font-size: 1.2rem;
}

.business2 {
	float: left;
	width: 100%;
	margin-bottom: 70px;
}

.business2 h2 {
	font-size: 2.2rem;
	font-weight: 700;
}

.business_box {
	float: left;
	width: 100%;
	height: 450px;
	text-align: center;
	position: relative;
	margin-bottom: 250px;
}

.business_box:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: 0.5;
	z-index: 11;
}

.business_box a {
	color: #ababab;
}

.business_box h2 {
	font-size: 2.2rem;
	font-weight: bold;
	margin-bottom: 30px;
}

.business_box p {
	font-size: 1.1rem;
}

.business_box .col-2 {
	position: absolute;
	top: 100%;
}

.business_box .col-2 .one {
	margin-top: 50px;
	height: 270px;
	border: 1px solid #e1e1e1;
	background: #fff;
	padding: 0;
	border-radius: 15px;
	padding: 30px;
	position: relative;
}

.business_box .one .tit {
	font-weight: 700;
	font-size: 1.3rem;
}

.business_box .one .smtxt {
	color: #bfbfbf;
	letter-spacing: 0.05em;
}

.business_box .one .imgbox {
	display: table;
	margin: 0 auto;
	width: 80px;
	height: 80px;
	padding: 15px;
	border-radius: 100%;
	margin-top: 20px;
	border: 1px solid #6c6c6c;
}

.business_box .one .imgbox img {
	max-width: 100%;
}

.business_box .one .bot_box {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	border-top: 1px solid #e1e1e1;
	height: 60px;
	line-height: 60px;
	color: #bcbcbc;
	font-weight: 500;
}

.business_box .one .bot_left {
	float: left;
	width: 50%;
	text-align: center;
	border-right: 1px solid #e1e1e1;
}

.business_box .one .bot_right {
	float: left;
	width: 50%;
	text-align: center;
}

.business_box .one:hover {
	border-color: #212990;
}

.business_box .one .bot_left:hover a {
	color: #212990;
}

.business_box .one .bot_right:hover a {
	color: #212990;
}

.business_box .one .bot_left:hover,
.business_box .one .bot_right:hover {
	color: #212990;
}

.business_box .txtbox {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -75%);
	width: 100%;
	max-width: 1200px;
	z-index: 99;
}

/*
===================
오시는길
===================
*/

.maps {
	margin-bottom: 200px;
}

.maps .txts {
	float: left;
	width: 40%;
	background: #fff;
	padding: 70px;
	z-index: 3;
}

.maps .txts .one {
	margin: 0 0 30px 0;
	padding-bottom: 30px;
	font-size: 1.2rem;
	border-bottom: 1px solid #e8e8e8;
}

.maps .txts .tit {
	font-weight: bold;
	margin-bottom: 20px;
}

.maps .txts .txt {
	color: gray;
}

.maps .txtbox {
	display: table;
	margin: 0 auto;
	width: 100%;
	z-index: 19;
}

.maps .imgs {
	position: absolute;
	width: 100%;
	height: 500px;
	z-index: -1;
	background: linear-gradient(140deg, #f3f3f3, rgba(247, 247, 247, 1), rgba(239, 239, 239, 0.8)), url('../img/map_1.jpg') center;
}

.maps .imgs:before {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: linear-gradient(140deg, #f3f3f3, rgba(247, 247, 247, 1), rgba(239, 239, 239, 0.8));
	z-index: -1;
	top: 0;
	left: 0;
}

.maps h2 {
	margin: 60px 0;
	font-size: 2.2rem;
	font-weight: 500;
}

/*
===================
문의
===================
*/
.contact {
	border-top: 2px solid var(--point-color);
}

.contact th {
	text-align: left;
	width: 20%;
	font-size: 1.1rem;
	font-weight: 500;
	color:#111;
}

.contact th,
.contact td {
	border-bottom: 0;
	padding: 0 0 30px 0;
	background: transparent;
}

.contact tr:first-child th,
.contact tr:first-child td {
	padding-top: 45px;
}

.contact input[type='text'],
.contact input[type='email'],
.contact input[type='tel'],
.contact textarea {
	display: block;
	padding: 10px;
	color: #222;
	width: 100%;
	border: 1px solid #d8d8d8;
	transition: all .3s ease-in-out;
	width: 100%;
}

.contact select {
	width: 100%;
	padding: 10px;
	border: 1px solid #d8d8d8;
}

.contact textarea {
	width: 100%;
	height: 200px;
}

.agreed {
	float: left;
	width: 100%;
}

.agreed textarea {
	float: left;
	width: 100%;
	height: 175px;
	padding: 30px 40px;
	border: 1px solid #d8d8d8;
	font-size: 1rem;
	color: #3e3e3e;
	background: #f7f7f7;
	line-height:1.5;
}

.agreed p {
	float: left;
	width: 100%;
	font-size: 1rem;
	margin: 15px 0;
	color: #555;
	text-align: right;
}

/*
===================
네비게이션
===================
*/
nav {
	padding: 0;
	margin: 0 auto;
}

nav .logo {
	float: left;
	width: 20%;
	text-align: left;
	font-size: 23px;
}

nav .logo img {
	width: 95px;
	margin-top: 3px;
	transition: all 0.5s;
}

nav .nav-container {
	float: left;
	width: 61%;
}

nav ul {
	display: inline-block;
	margin: 0;
}

.submenu {
	display: none;
	position: absolute;
	z-index: 9999;
	padding: 20px 0;
	min-width: 150px;
	margin-top: 0px;
	background: #FFF;
	border-top: 1px solid #ddd;
}

.submenu li {
	float: none;
	display: block;
	text-align: center;
	margin-left: 0 !important;
}

.submenu li a {
	font-size: 16px;
	color: #333;
	height: 40px;
	line-height: 40px;
}

nav .lang {
	float: right;
	width: 19%;
	margin-top: 7px;
}

nav .lang li {
	float: right;
	margin-left: 20px !important;
}

nav .lang a {
	color: #efefef;
	font-size: 15px;
	padding: 5px 10px;
	border: 1px solid rgba(255, 255, 255, 0.6);
	border-radius: 5px;
	height: 35px;
	width: 70px;
	margin-top: 0px;
}

nav .lang a:hover {
	color: #fff;
	border: 1px solid rgba(255, 255, 255, 1);
}

nav ul li {
	display: inline-block;
	float: left;
	position: relative;
	padding: 5px;
}

nav ul li:not(:first-child) {
	margin-left: 0;
}

nav ul li a {
	display: inline-block;
	outline: none;
	color: #fff;
	font-size: 18px;
	padding: 10px;
	font-weight: 400;
	text-decoration: none;
	letter-spacing: -0.01em;
}

nav ul li a:hover {
	color: #cbcbcb;
	text-decoration: none;
}

#nav:checked+.nav-open {
	transform: rotate(45deg);
}

#nav:checked+.nav-open i {
	background: #333;
	transition: transform 0.2s ease;
}

#nav:checked+.nav-open i:nth-child(1) {
	transform: translateY(6px) rotate(180deg);
}

#nav:checked+.nav-open i:nth-child(2) {
	opacity: 0;
}

#nav:checked+.nav-open i:nth-child(3) {
	transform: translateY(-6px) rotate(90deg);
}

#nav:checked~.nav-container {
	z-index: 9990;
	opacity: 1;
	display: block;
}

#nav:checked~.nav-container ul li a {
	opacity: 1;
	transform: translateY(0);
}

#nav:checked~.nav-container ul li a i {
	font-size: 1.1rem;
	color: rgba(255, 255, 255, 0.3);
	margin-right: 10px;
}

.hidden {
	display: none;
}

/* 상단메뉴 적용  190710 추가 */
.menuBox {
	position: absolute;
	width: 100%;
	margin: 0 auto;
	top: 0px;
	left: 0;
	height: var(--mainmenu-height);
	z-index: 999;
	transition: all .3s;
}

.menuBox UL {
	list-style: none;
	margin: 0px;
	padding: 0px;
}

.menuBox .menu {
	position: relative;
	float: left;
	height: var(--mainmenu-height);
	line-height: var(--mainmenu-height);
}

.menuBox .menu:before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	right: 0;
	width: 100%;
	height: 0px;
	background: var(--point-color2);
	transform: translate(-50%, 0);
	transition: all .3s;
	z-index: -1;
}

.menuBox .menu.now:before {
	height: 100%;
	transition: all .3s;
}

.menuBox .menu>LI {
	float: left;
	color: #fff;
	width: var(--menu-width);
	text-align: center;
	font-size: 1.14rem;
	font-weight: 700;
	cursor: pointer;
}

.menuBox .menu>LI a {
	color: rgba(255, 255, 255, 0.95);
	transition: all .2s;
}

.menuBox .menu.now>LI a {
	color: #fff !important;
	transition: all .2s;
}

.menuBox .submenuBox {
	display: none;
	float: left;
	top: 0;
	margin-top: 0;
	height: var(--submenu-height);
	width: 100%;
	overflow: hidden;
	background: #fff;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-left: 0;
	border-right: 0;
}

.menuBox .submenulist:first-child {}

.menuBox .submenulist {
	float: left;
	width: var(--menu-width);
	height: var(--submenu-height);
	padding-top: 25px;
}

.menuBox .submenulist>LI {
	width: 100%;
	padding: 12px 5px;
	text-align: center;
	font-size: 1rem;
	font-weight: 500;
}

.menuBox .submenulist>LI a {
	color: #111;
}

.menuBox .submenulist>LI a:hover {
	color: var(--point-color2);
}

.menuBox .submenulist.now {
	background: #f5f5f5;
	transition: all .2s;
}

.menuBox .centerbox {
	display: table;
	margin: 0 auto;
}

.menuBox.min,
.menuBox.new {
	background: #fff !important;
}

.menuBox.new {
	background: transparent;
}

.menuBox.min .menu,
.menuBox.new .menu {}

.menuBox.min .menu>LI a,
.menuBox.new .menu>LI a {
	color: #101010;
}

.menuBox.min .submenuBox,
.menuBox.new .submenuBox {}


.toplogo {
	position: absolute;
	top:18px;
	left: 50px;
	z-index: 10000;
	transition: all .3s;
}

.toplogo img {
	max-width: 180px;
	transition: all .5s;
	filter: contrast(5) grayscale(100%) invert(1);
}

.toplogo.min,
.toplogo.new {
	transition: all .5s;
}

.toplogo.min img,
.toplogo.new img {
	filter: none;
	transition: all .5s;
}

.toplogo.min .normal,
.toplogo.new .normal {
	display: block;
}

.toplogo.min .white,
.toplogo.new .white {
	display: none;
}

.topquick {
	position: absolute;
	top: 26px;
	right: 50px;
	text-align: center;
	font-size: 0.94rem;
	z-index: 10000;
	transition: all .3s;
	color: rgba(255, 255, 255, 1);
	padding: 0;
	font-weight: 500;
}

.topquick span {
	position: relative;
	display: inline-block;
	width: 92px;
	cursor: pointer;
	padding: 5px 10px;
}

.topquick span.lang {
	font-weight: bold;
	font-size: 0.9rem;
	border-radius: 30px;
	margin-bottom:10px;
}

.topquick span.lang svg {margin-right:10px; vertical-align:middle;}

.topquick span.lang img {
	margin: 0 3px 2px 0;
	vertical-align: middle;
}

.topquick span.lang i {
	font-size: 0.8rem;
	margin: 0 0 2px 5px;
}

.topquick span.lang .global {
	font-size: 1rem;
	margin-right: 5px;
	vertical-align: middle;
	color: #fff;
}

.topquick span .count {
	background: rgba(99, 99, 99, 0.7);
	border-radius: 100%;
	padding: 2px 5px;
	margin: 0 0 0 5px;
	font-size: 14px;
	vertical-align: text-bottom;
}

.topquick a {
	color: #fff;
}

.topquick i {
	margin-right: 2px;
	font-size: 1.2rem;
	color: #fff;
	vertical-align: middle;
}

.topquick ul {
	background: #fff;
	position: absolute;
	width: 94px;
	height: 0;
	top:100%;
	left: 0;
	transition: all .3s;
	border-radius: 5px;
}

.topquick ul li {
	display: none;
	height: 0;
	text-align: center;
	font-size: .9rem;
	transition: all .3s;
}

.topquick ul li a {
	color: #111;
	padding: 0px 10px;
	display:block;
	transition: all .3s;
}

.topquick ul li:hover a {
	color: #a9a9a9;
}

.topquick span:hover ul {
	width: 94px;
	height: auto;
	padding: 5px 0;
	transition: all .3s;
	border:1px solid rgba(0,0,0,0.3);
}

.topquick span:hover ul li {
	display: block;
	height: 30px;
	line-height: 30px;
	transition: all .3s;
}

.topquick.min,
.topquick.new,
.topquick.new a {
	color: #111;
	transition: all .3s;
}

.topquick.new span .count {
}

.topquick.new ul li a {
	color: #111;
	transition: all .3s;
}

.topquick.new ul li:hover a {
	color: #a9a9a9;
}

.topquick.new i {
	color: #353ebf;
}

.topquick.new span.lang {
}

.topquick.new span.lang .global, .topquick.new span.lang svg {
	color: #111;
	fill:#111 !important;
}

.subhead.hide,
.subhead.hide .toplogo,
.subhead.hide .topquick,
.subhead.hide .menuBox {
	top: -90px;
}

.subhead.show {
	display: block !important;
}

/****subhead color****/
.subhead.white .toplogo .normal {
	display: block;
}

.subhead.white .toplogo .white {
	display: none;
}

.subhead.white .menuBox,
.subhead.white .toplogo,
.subhead.white .topquick {
	background: #fff;
	color: #000;
}

.subhead.white .topquick a,
.subhead.white .topquick span {
	color: #1d1d1d;
}

.subhead.white .topquick i {
	color: #353ebf;
}

.subhead.white .topquick li a {
	color: #fff;
}

.subhead.white .topquick span .count {
	background: rgba(228, 228, 228, 0.7);
}

.subhead.white .topquick span.lang {
	background: #fff;
	border-color: rgba(0, 0, 0, 0.15);
}

.subhead.white .menuBox .menu>LI a {
	color: #000;
}

.subhead.white .menuBox .menu.now>LI a {
	color: var(--point-color);
}

/*
===================
빵조각
===================
*/
#minibar {
	display: none;
	position: absolute;
	top: 80px;
	width: 100%;
	z-index: 99;
}

.breadcrumb {
	position: absolute;
	top: 0;
	z-index: 99;
	float: right;
	width: 100%;
	border-bottom: 0px solid #d7e0e4;
}

.breadcrumb .innerwrap {
	max-width: 100%;
	padding: 0 100px;
}

.breadcrumb ul {
	display: table;
	float: right;
}

.breadcrumb li:nth-child(1) {
	border-left: 0;
}

.breadcrumb li {
	float: left;
	height: 47px;
	line-height: 47px;
	margin-left: 15px;
	border-right: 0;
	font-size: 14px;
	font-weight: 400;
	color: #cacaca;
}

.breadcrumb li i {
	font-size: 1.1rem;
}

.breadcrumb li a {
	color: gray;
}

.breadcrumb li:after {
	content: '|';
	margin-left: 15px;
	color: #909090;
}

.breadcrumb li:last-child {
	border-bottom: 0px solid #424242;
}

.breadcrumb li:last-child:after {
	display: none;
}

.quickmenu {
	float: left;
	width: 100%;
	height: 85px;
	margin-top:-150px;
	border-left: 0;
	border-right: 0;
	z-index: 8;
	transition: all .2s ease;
}

.quickmenu ul {
	display: table;
	margin: 0 auto;
	width: 100%;
}

.quickmenu ul li {
	position: relative;
	float: left;
	text-align: center;
	margin: 0 40px -1px 0;
	font-size: 1.25rem;
	font-weight: 700;
	border-radius: 0px;
	transition: width .3s;
	border-right: 0px solid rgb(56, 60, 128);
	height: 85px;
	line-height: 85px;
}

.quickmenu ul li select {
	width: 120px;
	background: none;
	color: #fff;
	border: 0;
	margin-top: -1px;
}

.quickmenu ul li select option {
	color: #fff;
}

.quickmenu ul li a {
	position: relative;
	display: block;
	color: rgba(255,255,255,.5);
	transition: width .5s;
	z-index: 9
}

.quickmenu ul li:hover:after {
	display: block;
}

.quickmenu ul li:hover a {
	color: rgba(255,255,255,.5);
}

.quickmenu ul li.active a {
	color: #fff;
}

.quickmenu ul li:after {
	content: '';
	position: absolute;
	bottom: 15px;
	left: 50%;
	right: 0;
	width: 100%;
	height: 4px;
	transform: translate(-50%, 0);
	background: rgba(255,255,255,.5);
	display: none;
	animation: tabbar 0.7s;
	z-index: 8;
}

.quickmenu ul li.active:after {
	display: block;
	background: #fff;
}

@keyframes tabbar {
	0% {
		width: 0;
	}

	100% {
		width: 100%;
	}
}

.quickmenu.show {
	position: fixed;
	top: 130px;
	margin-top:-130px;
	bottom: initial;
	width: 100%;
	transition: all .2s ease;
	backdrop-filter:blur(15px);
	background: rgba(255,255,255,0.85);
}

.quickmenu.show ul li:first-child {}

.quickmenu.show ul li a {color:#ccc;}
.quickmenu.show ul li:after {display:none;}
.quickmenu.show ul li.active a {color:#111;}

#backbtn {
	position: absolute;
	top: 0px;
	left: 100px;
	color: #fff;
	z-index: 999;
	padding: 0 5px;
	height: 47px;
	line-height: 47px;
	font-size: 14px;
	border-bottom: 0px solid #424242;
}

#backbtn a {
	color: #cacaca
}

#minibar.min {
	position: fixed;
	top: 80px;
	background: #f7f7f7 !important;
	display: none;
}

#minibar.min .breadcrumb {
	background: #f7f7f7;
}

#minibar.min .breadcrumb li {
	color: gray;
}

#minibar.min #backbtn a {
	color: #424242;
}

/*
===================
슬라이더
===================
*/
.kenburn-slider {
	width: 100%;
	margin: 0;
	position: relative;
	background-color: #000 !important;
}

.kenburn-slider .slides {
	list-style: none;
	overflow: hidden;
	margin: 0;
	padding: 0;
}

.kenburn-slider .slides>li {
	float: left;
	margin-right: -100%;
	width: 100%;
	overflow: hidden;
	height: 100vh;
	position: relative;
	min-height: 500px;
}

.subslider {}

.subslider .slides>li {
	height: 65vh !important;
	min-height: 500px;
}

.kenburn-slider .flex-direction-nav {
	list-style: none;
	margin: 0;
	padding: 0;
}

.kenburn-slider .flex-direction-nav .flex-prev,
.kenburn-slider .flex-direction-nav .flex-next {
	border: 1px solid rgba(255, 255, 255, 0.4);
	color: rgba(255, 255, 255, 0.4);
	text-decoration: none;
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	z-index: 8;
	text-align: center;
	width: 70px;
	height: 70px;
	line-height: 70px;
	padding: 0;
}

.kenburn-slider .flex-direction-nav .flex-prev {
	left: 50px;
}

.kenburn-slider .flex-direction-nav .flex-next {
	right: 50px;
}

.slide-image {
	background-size: cover;
	background-position: center;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

.flex-active-slide .slide-image {
	-webkit-animation: zoomOuts 7s;
	animation: zoomOuts 7s;
}

@-webkit-keyframes zoomOuts {
	0% {
		opacity: 0.6
	}

	100% {
		opacity: 1
	}
}

@-ms-keyframes zoomOuts {
	0% {
		opacity: 0.6;
		filter: alpha(opacity=60);
	}

	100% {
		opacity: 1;
		filter: alpha(opacity=100);
	}
}

@keyframes zoomOuts {
	0% {
		opacity: 0.6;
		-webkit-transform: scale(1.3);
		transform: scale(1.3);
	}

	100% {
		opacity: 1;
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

@keyframes zoomIns {
	0% {
		opacity: 0.8;
		filter: alpha(opacity=80);
		transform: scale(2);
		-webkit-transform: scale(2);
		-moz-transform: scale(2);
		-ms-transform: scale(2);
		-o-transform: scale(2);
	}

	100% {
		opacity: 1;
		filter: alpha(opacity=100);
		transform: scale(2.3);
		-webkit-transform: scale(2.3);
		-moz-transform: scale(2.3);
		-ms-transform: scale(2.3);
		-o-transform: scale(2.3);
	}
}

.zoomOuts {
	-webkit-animation-name: zoomOuts;
	-ms-animation-name: zoomOuts;
	animation-name: zoomOuts
}

.backzoomOuts {
	-webkit-animation-name: backzoomOuts;
	-ms-animation-name: backzoomOuts;
	animation-name: backzoomOuts
}

.subslider .flex-direction-nav .flex-prev,
.subslider .flex-direction-nav .flex-next {
	display: none;
}

.kenburn-slider .flex-direction-nav .flex-prev:after {
	content: "\e629";
	font-size: 20px;
	font-family: 'themify';
	letter-spacing: 0;
	text-transform: uppercase;
	vertical-align: top;
}

.kenburn-slider .flex-direction-nav .flex-next:before {
	content: "\e628";
	font-size: 20px;
	font-family: 'themify';
	letter-spacing: 0;
	text-transform: uppercase;
	vertical-align: top;
}

.kenburn-slider .flex-direction-nav .flex-prev a:hover,
.kenburn-slider .flex-direction-nav .flex-next a:hover {
	color: #fff;
	transition: all .5s;
}

/*
===================
슬라이더 컨트롤
===================
*/
.scroll {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: flex-end;
	bottom: 35px;
	left: 50%;
	margin-left: 0px;
	width: 120px;
	height: 40px;
	-webkit-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
	z-index: 99;
	opacity: .7;
	animation: scrollani 1.5s infinite;
}

@keyframes scrollani {
	0% {
		bottom: 25px;
	}

	50% {
		bottom: 35px;
	}

	100% {
		bottom: 25px;
	}
}


.scroll::after {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	width: 20px;
	height: 40px;
	transform: translate(-50%, 0);
	border: 2px solid #fff;
	border-radius: 30px;
}

.scroll::before {
	content: "";
	position: absolute;
	top: 25px;
	left: 50%;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	transform: translate(-50%, 0);
	background-color: #fff;
	animation: ani-mouse 2s linear infinite;
}

@-webkit-keyframes ani-mouse {
	0% {
		opacity: 1;
		top: 15px;
	}

	15% {
		opacity: 1;
		top: 20px;
	}

	50% {
		opacity: 0;
		top: 20px;
	}

	100% {
		opacity: 0;
		top: 15px;
	}
}

@keyframes ani-mouse {
	0% {
		opacity: 1;
		top: 15px;
	}

	15% {
		opacity: 1;
		top: 20px;
	}

	50% {
		opacity: 0;
		top: 20px;
	}

	100% {
		opacity: 0;
		top: 15px;
	}
}

@keyframes mob-slide {
	0% {
		transform: scale(2);
		-webkit-transform: scale(2);
	}

	100% {
		transform: scale(1);
		-webkit-transform: scale(1);
	}
}

.scroll__text {
	position: absolute;
	top: 5px;
	left: -2px;
	text-transform: uppercase;
	font-weight: 500;
	font-size: 11px;
	text-align: center;
	color: #fff;
	letter-spacing: 0.5px;
}

.scroll__text2 {
	position: absolute;
	top: 5px;
	right: 3px;
	text-transform: uppercase;
	font-weight: 500;
	font-size: 11px;
	text-align: center;
	color: #fff;
	letter-spacing: 0.5px;
}

/*
===================
플로팅 퀵
===================
*/
.top_quick {
	position: fixed;
	z-index: 99;
	bottom: 88px;
	right: 30px;
	border-radius: 50%;
	text-align: center;
	height: 50px;
	/* 크기 */
	width: 50px;
	/* 크기 */
	box-sizing: border-box;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.05);
	/* 그림자 */
	cursor: pointer;
	transition: all 350ms cubic-bezier(0.50, 1, 0.07, 1);
	border: 0.1px solid rgba(0, 0, 0, 0.1);
	/* 테두리라인 */
	background: #fff;

}

.top_quick svg {
	transition: all 350ms cubic-bezier(0.50, 1, 0.07, 1);
	margin-top: 13px;
	fill: #aaa;
}

.top_quick:hover {
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.01);
	border: 0.1px solid rgba(0, 0, 0, 0.5);
}

.top_quick:hover svg {
	fill: #000;
}

/* 마우스오버시 svg 아이콘의 fill 변경 */

.fixed_quick {
	position: fixed;
	z-index: 99;
	bottom: 30px;
	/* 위치 */
	right: 30px;
	/* 위치 */
}

.quick {
	float: left;
	margin-right: 8px;
	border-radius: 50%;
	text-align: center;
	height: 50px;
	/* 크기 */
	width: 50px;
	/* 크기 */
	box-sizing: border-box;
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.05);
	/* 그림자 */
	cursor: pointer;
	transition: all 350ms cubic-bezier(0.50, 1, 0.07, 1);
	border: 0.1px solid rgba(0, 0, 0, 0.1);
	/* 테두리라인 */
}

.quick svg {
	transition: all 350ms cubic-bezier(0.50, 1, 0.07, 1);
}

.quick:hover {
	box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.01);
	border: 0.1px solid rgba(0, 0, 0, 0.5);
}

.quick:hover svg {
	fill: #000;
}

/* 마우스오버시 svg 아이콘의 fill 변경 */

/* 퀵메뉴 개별 스타일 */
.quick1 {
	background-color: #F7E600;
}

.quick1 svg {
	margin-top: 13px;
}

.quick2 {
	background-color: #fff;
}

.quick2 svg {
	margin-top: 13px;
}

.quick3 {
	background-color: #fff;
	margin-right: 0;
}

.quick3 svg {
	margin-top: 13px;
}

.quick4 {
	background-color: #fff;
}

.quick4 svg {
	margin-top: 13px;
}

.quick5 {
	background-color: #fff;
}

.quick5 img {
	width: 22px;
	margin-top: 14px;
}

.quick6 {
	background-color: #fff;
}

.quick6 img {
	width: 22px;
	margin-top: 13px;
}

.quick7 {
	background-color: #fff;
}

.quick7 img {
	width: 20px;
	margin-top: 14px;
}

.quick5 img.qhover,
.quick6 img.qhover,
.quick7 img.qhover {
	display: none;
	transition: all 0.5s;
}

.quick5 img.qnor,
.quick6 img.qnor,
.quick7 img.qnor {
	display: inline-block;
	transition: all 0.5s;
}

.quick5:hover img.qhover,
.quick6:hover img.qhover,
.quick7:hover img.qhover {
	display: inline-block;
	transition: all 0.5s;
}

.quick5:hover img.qnor,
.quick6:hover img.qnor,
.quick7:hover img.qnor {
	display: none;
	transition: all 0.5s;
}


/*
===================
샵 퀵메뉴 및 뉴스배너
===================
*/

.shopquick {
	position: absolute;
	width: 50px;
	top: 35px;
	left: 50%;
	margin-left: -690px;
	z-index: 3;
	box-shadow: 10px 10px 30px rgb(0 0 0 / 5%);
	border-top: 1px solid #e0e4f7;
	transition: all 0.5s;
}

.shopquick.min {
	position: fixed;
	top: 100px;
	bottom: initial;
	transition: all 0.5s;
}

.shopquick h2 {
	border-top: 2px solid #212990;
	padding: 15px 20px;
	background: #eceef9;
	text-align: center;
	color: #212990;
	font-size: 1.1rem;
}

.shopquick li {
	background: #fff;
	color: #333;
	padding: 15px;
	font-weight: 500;
	border: 1px solid #e0e4f7;
	font-size: 0.94rem;
	border-top: 1px solid #fff;
}

.shopquick li i {
	margin-right: 5px;
	color: #1a218a;
	font-size: 1.2rem;
}

.shopquick li a {
	color: #333;
}

.shopquick li:hover {
	background: #f3f4fb;
	width: 140px;
	border-top-color: #e0e4f7;
	box-shadow: 10px 10px 30px rgb(0 0 0 / 5%);
}

.shopquick li:hover a {
	color: #212990;
}

.shopquick li span {
	display: none;
}

.shopquick li:hover span {
	display: inline-block;
}

.latnews {
	float: left;
	width: 100%;
	background: url('../img/sub_etc2.jpg') center 42%;
	background-size: cover;
	color: #fff;
	padding: 40px;
	margin-top: 35px;
}

.latnews .left {
	float: left;
	width: 80%;
	font-size: 1.4rem;
	font-weight: 500;
	line-height: 40px;
}

.latnews .right {
	float: left;
	width: 20%;
	text-align: right;
	line-height: 40px;
}

.latnews .right a {
	display: inline-block;
	padding: 0 40px;
	background: #000;
	color: #fff;
	font-size: .9rem;
}


/*
===================
푸터
===================
*/

.qbanner {
	float: left;
	width: 100%;
	height: 350px;
	position: relative;
	background: url(../../theme/mt-02/img/tail.jpg);
	background-size: cover;
	background-position: 50% 0;
	margin: 150px 0 0
}

.qbanner:before {
	content: '';
	background: rgba(0, 0, 0, .5);
	top: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 2;
	color: #fff !important;
	animation: opacity 1s
}

.qbanner .txtbox {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	color: #fff;
	text-align: center;
	margin: 55px 0;
	padding: 40px;
	z-index: 3
}

.qbanner .txtbox .tit {
	font-size: 2.2rem;
	font-weight: 700
}

.qbanner .txtbox .txt {
	font-size: 1.1rem;
	color: #f7f7f7;
	word-break: keep-all
}

.qbanner .txtbox .opc {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .55);
	z-index: 9
}


.qbanner .txt {
	margin-top: 40px
}

.qbanner .txt a {
	border: 1px solid #ddd;
	display: inline-block;
	height: 60px;
	line-height: 60px;
	text-align: left;
	padding: 0 25px;
	width: 220px;
	color: #fff;
	font-weight: 600;
	margin: 0 5px;
	position: relative;
	font-weight: 700
}

.qbanner .txt i {
	position: absolute;
	right: 25px;
	top: 20px
}

.qbanner .txt a:hover {
	background: #fff;
	color: #111;
	border-color: #fff
}

.qbanner .txt a:nth-of-type(1) {
	background: #fff;
	color: #111;
	border-color: #fff
}

/*
==============
푸터
==============
*/

#footer {
	float: left;
	width: 100%;
	background: #222;
	color: #fff;
	border-top: 1px solid #ddd;
	padding: 80px 0;
	font-weight:400;
	font-size:1rem;
}

#footer a {
	color: #aaa;
}

#footer p {}

#footer .footline {
	display: table;
	margin: 0 auto;
	width: 90%;
}

#footer .footleft {
	float: left;
	width: 20%;
	text-align: left;
}

#footer .footleft img {
	max-width: 200px;
	filter:brightness(100) grayscale(1);
}

#footer.white .footleft img {filter:none;}

#footer .footright {
	float: left;
	width: 80%;
}

#footer .copylink {
	margin-bottom: 40px;
}

#footer .copylink a {
	margin-right: 10px;
	color: #cbcbcb;
	font-weight:500;
}

#footer .copylink a:after {
	content: '|';
	color: #666;
	margin-left: 13px;
}

#footer .copylink a:last-child {
	margin-right: 0;
}

#footer .copylink a:last-child:after {
	display: none;
}

#footer .copylink a:hover {
	color: #fff;
}

#footer .topbar {
	position: relative;
	float: left;
	width: 100%;
	border-top: 1px solid rgba(67, 74, 88, .4);
	padding-top: 50px;
	margin-top: 0;
}

#footer .gototop {
	position: absolute;
	font-size: 10px;
	top: -21px;
	right: 0;
	width: 42px;
	height: 42px;
	padding-top: 6px;
	line-height: 14px;
	border: 1px solid rgba(67, 74, 88, .4);
	color: #fff;
	background: #222;
}

#footer .gototop i {
	font-size: 13px;
}

#footer .gototop a {
	color: #fff;
}

#footer .gototop:hover {
	background: #000;
	border: 1px solid #000;
	transition: all .5s;
}

#footer .gototop:hover a {
	color: #fff;
}

#footer .bar {
	color: rgba(255,255,255,.3);
	margin: 0 5px;
}

#footer .rights {
	font-size: 14px;
	margin-top: 30px;
}

#footer .footcont {
	width: 100%;
	line-height: 1.8;
	color: #aaa;
}

#footer .footcont a {
	color: #aaa;
	background: transparent;
	border-color: #464646;
}

#footer .flogo {
	float: right;
	padding-top: 20px;
}

#footer .flogo img {
	max-width: 200px;
	opacity: 0.6;
}

#footer .fcont {
	position: Relative;
	float: left;
	width: calc(100% - 230px);
}

#footer .contus {
	position: absolute;
	right: 0;
	top: 0;
	padding: 7px 40px;
	border: 1px solid rgba(67, 74, 88, .3);
	color: #434a58;
}

#footer .contus i {
	font-size: 0.9rem;
	color: #bbbfc5;
}

.footmenu {
	width: 100%;
}

.footmenu ul.bigmenu {
	display:grid; grid-template-columns:repeat(var(--footmenu-num), 1fr);
	margin-bottom: 20px;
}

.footmenu ul li.foot_1dli {
}

.footmenu li a.foot_1da {
	font-weight: 700;
}

.footsubbox {
}

.footsubbox_in {	display:grid; grid-template-columns:repeat(var(--footmenu-num), 1fr); }

.footsubbox ul {
}

.footsubbox li.foot_2dli {
	padding: 6px 0;
}

.footsubbox li a.foot_2da {
	font-size: 16px;
}

#footer.white {
	background: #fff;
	color: #858a95;
}

#footer.white a {
	color: #505050;
}

#footer.white .copylink {}

#footer.white .copylink a {
	color: #111;
	font-weight: 600;
}

#footer.white .copylink a:after {
	color: #e7e7e7;
}

#footer.white .footmenu ul li a.foot_1da {
	font-size: 18px;
	font-weight: 600;
	color: #111;
}

#footer.white .topbar {
	border-color: rgb(207, 209, 216);
}

#footer.white .gototop {
	border: 1px solid rgba(67, 74, 88, .4);
	background: #54575f;
}

#footer.white .gototop a {
	color: #fff;
}

#footer.white .contus {
	background: #fff;
	border: 1px solid rgba(201, 203, 208, 1);
}

#footer.white .rights span,
#footer.white .rights span a {
	color: #858a95;
}

#footer.white .fcont {
	font-size: 16px;
	color: #545454;
	font-weight: 400;
}

#footer.white .bar {
	color: #e7e7e7;
	font-size: 13px;
	vertical-align: initial;
}

#footer.white .flogo img {
	opacity: 1;
}

/*============
find id
============*/
.new_win_con {
	margin: 0 20px;
}

#find_info #info_fs p {
	color: gray;
	background: #eee;
	padding: 20px;
}

.new_win .win_btn {
	margin: 10px 0;
}

.new_win .win_btn .btn_submit {
	border-radius: 0;
	height: 40px;
	line-height: 38px;
	font-weight: 500;
}


/*
===================
모바일 레이아웃
===================
*/

@media (max-width:480px) {

	/*메인*/
	.main-pr-right img {
		width: 100% !important;
		height: auto !important;
		left: 0 !important;
		margin-left: 0 !important;
	}

	/*슬라이드 서클*/
	.slide-circle-image {
		width: 180px;
		height: 180px;
		padding: 60px 0;
	}

	.slide-circle-image p {
		width: 180px;
		font-size: 1.5rem;
	}

	.slide-circle-image img {
		margin-top: -50px;
	}

	/*슬라이드 화살표*/
	.kenburn-slider .flex-direction-nav .flex-prev,
	.kenburn-slider .flex-direction-nav .flex-next {
		top: 50%;
		height: 1em;
		margin-top: -15%;
		padding: 0 !important;
	}

	/*슬라이드 포지션*/
	.kenburn-slider .slides li:nth-child(1) .slide-image {
		background-position: 52% 0;
	}

	.kenburn-slider .slides li:nth-child(2) .slide-image {
		background-position: 70% 0;
	}

	.kenburn-slider .slides li:nth-child(3) .slide-image {
		background-position: 73% 0;
	}
}

@media (min-width:481px) and (max-width:768px) {

	/*슬라이드 화살표*/
	.kenburn-slider .flex-direction-nav .flex-prev,
	.kenburn-slider .flex-direction-nav .flex-next {
		top: 50%;
		height: 1em;
		margin-top: -16%;
	}
}

@media (min-width:1101px) and (max-width:1499px) {
	.menuBox .menu>LI {
		width: 120px;
	}

	.menuBox .submenulist {
		width: 120px;
	}
}

@media (max-width:1280px) {

	html,
	body {
		height: 100vh !important;
	}

	.innerwrap {
		width: 100%;
		padding: 0 20px;
	}

	.innerwrap2 {
		padding: 0 20px;
	}

	.pconly {
		display: none !important;
	}

	.mobonly {
		display: inline-block !important;
	}

	.pconly2 {
		display: none !important;
	}

	.mobonly2 {
		display: block !important;
	}

	.pconly3 {
		display: none !important;
	}

	.mobonly3 {
		display: table !important;
	}

	.pconly4 {
		display: none !important;
	}

	.mobonly4 {
		display: table-cell !important;
	}

	.subhead.show {
		display: none !important;
	}

	.subpagetit {
		margin: 30px 0;
	}

	.subpagetit h2 {
		font-size: 1.8rem;
	}

	.subpagetit p {
		font-size: .8rem;
		margin-top: 15px;
	}

	.subpagetit .subbar {
		margin-top: -5px;
	}

	.subpagetit2 {
		margin: 60px 0;
	}

	.subpagetit2 .tpoint2 {
		font-size: 2.2rem;
	}

	.contit {
		background: linear-gradient(to right, #432392 0%, #7046d8 50%, #a181ec 100%);
		padding: 6px 15px 7px 15px;
		font-size: 1.1rem;
		line-height: 1.4rem;
		width: 100%;
		border-radius: 0;
	}

	.consqr {
		padding: 15px;
	}

	.table-container {
		float: left;
		width: 100%;
		overflow-x: auto;
		white-space: nowrap;
	}

	.table-container table {
		width: auto;
	}

	.col-2 .one {
		width: 100%;
		margin: 0 0 2% 0;
	}

	.navheader {
		padding: 15px 0 15px 0;
		transition: none;
	}

	.navheader #nav {
		display: none;
	}

	nav {
		width: 100%;
		padding: 0;
		margin: 0 auto;
	}

	nav .logo {}

	.mlogo {
		position: absolute;
		left: 20px;
		top: 15px;
		width: 160px;
		line-height: initial !important;
		z-index: 9992;
	}

	.mainmenu li:after {
		padding: 0;
		height: 0;
	}

	.menudown {
		background: none;
		border: 0;
		display: inline-block;
		color: #c5c5c5;
		width: 40px;
		font-size: 30px;
		height: 40px;
		line-height: 35px;
		z-index: 99;
	}

	.nav-container:before {
		content: '';
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 65px;
		z-index: 9991;
	}

	.submenu {
		display: none;
		position: relative !important;
		margin: 0 !important;
		padding: 20px 0;
		float: left;
		border-top: 1px solid #ddd;
	}

	.submenu li {
		border-bottom: 0 !important;
		margin-top: -1px !important;
	}

	.submenu li a {
		font-size: 17px !important;
		padding: 0 !important;
	}

	.submenu li a:hover {
		color: #111 !important;
	}

	.nav-container {
		position: fixed;
		top: 0;
		left: 0%;
		height: 100%;
		width: 100% !important;
		z-index: -1;
		background: #f7f7f7;
		opacity: 0;
		transition: all 0.2s ease;
		display: none;
		overflow: scroll;
	}

	.nav-container ul {
		width: 100%;
		margin: 80px 0 50px 0;
		border-top: 1px solid #ddd;
	}

	.nav-container ul li {
		display: block;
		float: left;
		width: 100%;
		text-align: left;
		padding: 0;
		border-bottom: 1px solid #ddd;
		background: #fff;
	}

	.nav-container ul li li {
		background: transparent;
	}

	.nav-container ul li:nth-child(1) a {
		transition-delay: 0.2s;
	}

	.nav-container ul li:nth-child(2) a {
		transition-delay: 0.3s;
	}

	.nav-container ul li:nth-child(3) a {
		transition-delay: 0.4s;
	}

	.nav-container ul li:nth-child(4) a {
		transition-delay: 0.5s;
	}

	.nav-container ul li:not(:first-child) {
		margin-left: 0;
	}

	.nav-container ul li a {
		padding: 15px;
		opacity: 0;
		color: #333;
		font-size: 17px;
		font-weight: 600;
		transform: translateY(-20px);
		transition: all 0.2s ease;
		min-width: 85%;
		padding: 20px;
	}

	.nav-open {
		position: fixed;
		right: 10px;
		top: 7px;
		display: block;
		width: 48px;
		height: 48px;
		cursor: pointer;
		z-index: 9999;
		border-radius: 50%;
		transition: all .5s;
	}

	.nav-open i {
		display: block;
		width: 20px;
		height: 2px;
		background: #fff;
		border-radius: 2px;
		margin-left: 14px;
	}

	.navheader.min .nav-open i {
		background: #333;
	}

	.nav-open i:nth-child(1) {
		margin-top: 16px;
	}

	.nav-open i:nth-child(2) {
		margin-top: 4px;
		opacity: 1;
		width: 20px;
		margin-left: 14px;
	}

	.nav-open i:nth-child(3) {
		margin-top: 4px;
	}

	nav .mlang {
		border-bottom: 0 !important;
		position: fixed !important;
		bottom: 0 !important;
		left: 0;
		width: 100%;
		background: var(--point-color) !important;
		z-index: 9999;
	}

	nav .mlang img {
		margin-right: 3px;
		vertical-align: middle;
	}

	nav .mlang a {
		float: left;
		width: 25% !important;
		min-width: initial !important;
		font-size: 16px !important;
		border: 0;
		text-align: center;
		color: #fff !important;
		height: 60px;
		line-height: 60px !important;
		padding: 0 !important;
	}

	nav .mlang a:nth-of-type(2n) {
		border: 1px solid #ddd;
		border-top: 0;
		border-bottom: 0;
	}

	/*메뉴로그인*/
	.mlogin {
		position: absolute;
		top: 90px;
		left: 0;
		width: 100%;
		z-index: 9992;
		color: #333;
		text-align: left;
		padding: 0;
		background: #f7f7f7;
	}

	.mlogin h2 span {
		margin: 0 10px;
	}

	.mlogin h2 {
		font-size: 1.2rem;
		font-weight: 500;
		border: 1px solid #ddd;
		border-left: 0;
		border-right: 0;
		margin-bottom: 10px;
		background: #fff;
		padding: 0 20px;
		height: 60px;
		line-height: 60px;
	}

	.mlogin ul {
		display: none;
		margin: 0 0 10px 0;
		float: left;
		border-top: 0;
		width: 100%;
	}

	.mlogin li {
		border: 1px solid #ddd;
		float: left;
		width: 33.33% !important;
		display: initial;
		background: #fff;
		padding: 15px !important;
		text-align: center !important;
		border-left: 0;
	}

	.mlogin li:last-child {
		border-right: 0;
	}

	.mlogin li a {
		width: initial !important;
		padding: 0 !important;
		min-width: initial !important;
		font-size: 1rem;
	}

	.mlogin li i {
		font-size: 2.2rem !important;
		color: #2a329f !important;
		margin-right: 0 !important;
	}

	/*상단 레이아웃*/
	nav .logo {
		width: 75%;
	}

	nav .logo img {
		width: 160px;
		margin-top: 0px;
		filter:contrast(5) grayscale(100%) invert(1);
	}

	.navheader.min {
		height: 60px;
		line-height: 60px;
		transition: none;
	}

	.navheader.min ul li {
		height: auto;
		line-height: initial;
	}

	.navheader.min .logo img {
		margin-top: 0px;
		width: 160px;
		filter:none;
	}

	.navheader.min .logo .white {
		display: none;
	}

	.navheader.min .logo .normal {
		display: block;
	}

	.navheader.min .nav-open {
		transition: all .5s;
	}

	#minibar {
		display: none;
		top: 60px;
		transition: none;
	}

	#minibar.min {
		top: 50px;
		transition: none;
	}

	#backbtn {
		top: 0;
		left: 20px;
		margin-left: 0;
		height: 40px;
		line-height: 40px;
	}

	/*슬라이더*/
	.slideropc {
		background: rgba(0, 0, 0, 0.1);
	}

	.slidertxt {
		transform: translate(-50%, -50%);
		padding: 0 20px;
	}

	.slidertxt p {
		word-break: keep-all;
	}

	.slidertxt .smalltxt {
		font-size: 1.1rem;
		padding: 0;
		margin-bottom: 20px;
		font-weight: 400;
	}

	.slidertxt .bigtxt {
		font-size: 1.8rem;
		line-height: 1.5;
	}

	.subslider {
		margin-top: 0;
	}

	.subslider .slides>li {
		min-height: 380px !important;
		height: 45vh !important;
	}

	.subslider .slidertxt {
		top: 52%;
	}

	.subslider .slidertxt .smalltxt {
		font-size: 2.7rem;
		margin-bottom: 15px !important;
	}

	.subslider .slidertxt .bigtxt {
		font-size: 1.9rem;
		font-weight: 700
	}

	.subslider .slide-image {
		background-position: 50% 40% !important;
	}

	/*슬라이드 화살표*/
	.kenburn-slider .flex-direction-nav .flex-prev,
	.kenburn-slider .flex-direction-nav .flex-next {
		display: none;
		-webkit-transform: scale(0.72);
		transform: scale(0.72);
		font-weight: 300;
		opacity: 0.2;
		font-family: sans-serif;
	}

	.kenburn-slider .flex-direction-nav .flex-prev:after,
	.kenburn-slider .flex-direction-nav .flex-next:before {
		vertical-align: middle;
	}

	/*슬라이더 컨트롤*/
	.wrap-scrolldownhoney {
		bottom: 30px;
	}

	/*페이지*/
	.ver_line_sub {
		height: 40px;
	}

	.contentbox {
		padding: 0;
		margin: 0 0 5rem 0;
		overflow: hidden;
	}

	.breadcrumb {
		padding-top: 0;
	}

	.breadcrumb .innerwrap {
		max-width: 100%;
		padding: 0 20px;
	}

	.breadcrumb li {
		padding: 0 5px;
		margin-left: 0;
		font-size: .8rem;
		height: 40px;
		line-height: 40px;
		max-width: 120px;
		overflow: hidden;
	}

	.breadcrumb li i {
		font-size: .9rem;
	}

	.breadcrumb li:after {
		margin-left: 10px;
	}

	.quickmenu {
		width: 100%;
		height: 75px;
		margin-top:-130px;
		overflow-x: auto;
	}

	.quickmenu.show {
		display: none;
	}

	.quickmenu ul {
		white-space: nowrap;
		overflow-y: hidden;
		margin: 0 auto;
	}

	.quickmenu ul li {
		float: initial;
		display: inline-block;
		font-size: 1.15rem;
		padding: 0;
		height: 75px;
		line-height: 75px;
		margin:0 20px -1px 0;
	}

	.quickmenu ul li a {}

	.quickmenu ul li select {
		width: 125px;
		height: 20px;
		line-height: 20px;
		margin-top: -3px;
	}

	.pagetit {
		font-size: 17px;
	}

	.about {
		padding: 40px 0;
	}

	.about .sc1 {
		float: left;
		width: 100%;
		padding: 0 0 20px 0;
		font-size: 15px;
	}

	.about .sc2 {
		float: left;
		width: 100%;
		padding: 0;
	}

	.about_2 {
		padding: 0;
	}

	.fac_info {
		padding: 15px;
		font-size: 15px;
	}

	.layout_page h2 {
		font-size: 22px;
	}

	.layout_page p {
		font-size: 14.8px;
	}

	.layout_box {
		padding: 50px 0 40px 0;
	}

	.layout_box .left {
		width: 100%;
		border: 0;
		border-bottom: 1px solid #ddd;
		padding-bottom: 30px;
	}

	.layout_box .center {
		width: 100%;
		border: 0;
		border-bottom: 1px solid #ddd;
		padding: 30px 0;
	}

	.layout_box .right {
		width: 100%;
		padding-top: 30px;
	}

	.mini_info {
		font-size: 15px;
		padding: 25px;
	}

	.mini_info .tit {
		font-size: 22px;
		margin-bottom: 10px;
	}

	.biztop {}

	.biztop .imgline {
		width: 90%;
		height: 180px;
		margin-top: 5%;
	}

	.biztop .txtline {
		width: 300px;
	}

	.biztop .txtline .tit {
		line-height: normal;
		font-size: 1.2rem;
	}

	.imgup {
		width: 90%;
		height: 250px;
		margin: 5% 0;
	}

	.imgup .txtbox {
		width: 300px;
	}

	.imgup .txtbox .bigtxt {
		font-size: 2rem;
		margin: 15px 0;
	}

	@keyframes imgups {
		0% {
			width: 100%;
			margin-left: 0;
			margin-right: 0;
		}

		100% {
			width: 90%;
			margin-left: 5%;
			margin-right: 5%;
		}
	}

	.bgfixed {
		background-attachment: scroll !important;
	}

	/*스타일*/
	.lightbox img {
		max-width: 90%;
	}

	.topsec {
		padding: 25px 0 50px 0;
	}

	.topsec .left,
	.topsec .right {
		width: 100%;
	}

	.topsec .left {
		margin-bottom: 10px;
	}

	.topsec h2 {
		font-size: 1.7rem;
	}

	/*인트로*/
	.navline {
		display: none !important;
	}

	#fp-nav {
		display: none !important;
	}

	.pagi {
		left: -25px;
		bottom: 70px;
	}

	.pagi .nowp,
	.pagi .totp {
		display: none;
	}

	.pagi .cirdown:before {
		width: 35px;
	}

	.pagi .txt {
		font-size: .8rem;
		letter-spacing: 0;
	}

	.intro .secbg {
		background-position: 60% center !important;
	}

	.intro2 .secbg {
		background-position: 50% 80% !important;
	}

	.section .txt {
		width: 90%;
	}

	.section .txt h1 {
		font-size: 2rem;
	}

	.section .txtp {
		line-height: normal;
	}

	.section .txt p {
		font-size: 1.1rem;
		line-height: 1.5;
	}

	.section .txt p br {
		display: none;
	}

	.section video {
		width: auto;
		height: 120vh;
	}

	.intro2 .bglayer {
		max-width: 90%;
		padding: 0;
		height: auto;
		z-index: 4;
		_-webkit-transform: translate3d(0, 0, 0);
	}

	.intro2 .whbg {
		height: 15vh;
	}

	.intro2 .line1 {}

	.intro2 .line1 .titles {
		margin: 0 0 5px 0;
		font-size: 1.2rem;
	}

	.intro2 .line1 .titles:before {
		display: none;
	}

	.intro2 .line1 p.texts {
		font-size: 0.8rem;
	}

	.intro2 .line1 .one {
		width: 100%;
		height: initial;
		padding: 20px;
		margin: 0 0 5px 0 !important;
		border-radius: 5px;
	}

	.intro2 .line2 {
		display: none;
	}

	.intro2 h5 {
		font-size: 1rem;
	}

	.intro2 h1 {
		font-size: 1.5rem;
		margin: 20px 0;
	}

	.intro2 h1 br {
		display: none;
	}

	.bglayer .col-2 {
		max-width: 100%;
	}

	.bglayer .one i {
		font-size: 2.4rem;
	}

	.bglayer .one h3 {
		font-size: 1.1rem;
	}

	.bglayer p {
		font-size: 1rem;
	}

	.notice .bglayer {
		max-width: 90%;
	}

	.notice h1 {
		font-size: 1.7rem;
		margin-bottom: 20px;
	}

	.notice p {
		display: none;
	}

	.notice .left {
		width: 100%;
		height: initial;
		padding: 20px;
	}

	.notice .left.notlat li:not(:first-child) {
		display: none;
	}

	.notice .right1 {
		width: 100%;
		height: initial;
		padding: 20px;
		margin: 0;
	}

	.notice .right2 {
		width: 100%;
	}

	.notice .right2 .one {
		padding: 20px 10px;
		max-height: 122px;
	}

	.notice .right2 .one i {
		font-size: 3rem;
	}

	.notice .right2 .one:first-child i {
		font-size: 3.4rem;
		margin-bottom: 5px;
	}

	.notice .right2 .one p {
		display: block !important;
		font-size: 1rem;
	}

	.notlat h2 {
		font-size: 1.2rem;
	}

	.notice .left,
	.notice .right1,
	.notice .right2 {
		height: initial;
		padding: 15px;
	}

	.notice i {
		float: left;
		position: initial;
		font-size: 2rem;
	}

	.txtboxes {
		float: right;
		position: initial;
		text-align: right !important;
	}

	.notice h2 {
		font-size: 1.4rem;
		margin: 0;
	}

	.latnews {
		padding: 30px 0;
		background-size: 350%;
		background-position: 15% 42%;
	}

	.latnews .left {
		font-size: 1.1rem;
		line-height: 1.6;
	}

	.latnews .right {
		padding-left: 10px;
	}

	.latnews .right a {
		padding: 0 20px;
	}

	.tabsbox.sm {
		margin-top: 5%;
	}

	.tabsbox .marks {
		width: initial;
		padding: 20px;
		height: auto;
	}

	.tabsbox .marks .txt {
		font-size: 1.6rem;
	}

	ul.tabs li a {
		font-size: 15px;
		padding: 10px 0;
	}

	.tab_content {
		padding: 0;
	}

	/*사업분야*/
	.business_box {}

	.business_box .txtbox {
		padding: 0 20px;
	}

	.business_box h2 {
		font-size: 1.7rem;
	}

	.business_box .col-2 {
		width: 90%;
		left: 5%;
	}

	.business_box .one {
		width: 50%;
	}

	.business_box .one .smtxt {
		font-size: 0.7rem;
		letter-spacing: 0;
	}

	.business_box .one .bot_box {
		font-size: .84rem;
	}

	/*오시는길*/
	.maps {
		margin-bottom: 0;
	}

	.maps h2 {
		margin: 40px 0;
		font-size: 1.7rem;
	}

	.maps .txts {
		float: left;
		width: 100%;
		padding: 40px 20px;
	}

	.maps .txts .one:last-child {
		margin-bottom: 0;
	}

	.maps .imgs {
		padding: 50px 0;
	}

	/*고객센터*/
	.contact th {
		padding: 10px 10px 10px 0;
	}

	.contact td {
		padding: 10px 0;
	}

	.contact tr:first-child th,
	.contact tr:first-child td {
		padding-top: 25px;
	}

	.contact tr:last-child th,
	.contact tr:last-child td {
		padding-bottom: 25px;
	}

	.send_btn1 {
		padding: 15px 0;
		width: 180px;
		font-size: 1rem;
	}

	.agreed textarea {
		padding: 20px;
	}

	/*푸터*/
	.qbanner {
		margin-top: 50px;
	}

	.qbanner .left,
	.qbanner .right {
		padding: 15px 0;
		width: 100%;
	}

	.qbanner .right:before {
		background-position: 35% center;
	}

	.qbanner .txtbox {
		width: 100%;
		padding: 20px 30px;
	}

	.qbanner .txtbox .tit {
		font-size: 22px;
	}

	.qbanner .txtbox .tit img {
		width: 200px;
	}

	.qbanner .txtbox .txt {
		font-size: 15px;
		line-height: 1.25rem;
		word-break: keep-all;
	}

	.qbanner .txtbox a {
		padding: 5px 15px;
		font-size: 12px;
	}

	#footer {
		padding: 0 0 90px 0;
	}

	.footmenu ul.bigmenu,
	.footsubbox {
		display: none;
	}

	#footer .copylink {
		border: 0;
		padding: 0;
	}

	#footer.white .copylink {
		border: 0;
	}

	#footer .topbar {
		padding-top: 30px;
		width: 90%;
		margin-left: 5%;
	}

	#footer .footcont *,
	#footer .right * {
		word-break: keep-all;
	}

	#footer .fcont {
		width: 100%;
		padding: 0;
	}

	#footer .footcont,
	#footer .rights {
		padding: 0;
	}

	.flogo {
		padding: 0 20px;
		margin-bottom: 20px;
	}

	.fcont {
		padding: 0 20px;
	}

	#footer .contus {
		display: none;
	}

	#footer .flogo {
		display: none;
	}

	#footer .footline {
		width: 90%;
		margin-top: 2rem;
	}

	#footer .footleft img {
		display: none;
	}

	#footer .footright {
		width: 100%;
	}

	.top_quick {
		right: 20px;
		bottom: 80px;
	}

	.fixed_quick {
		right: 20px;
		bottom: 20px;
	}

	/** etc **/
	#captcha.m_captcha #captcha_key {
		height: 40px;
	}
}

@media (min-width:769px) {
	.mainmenu li:hover .submenu {
		display: block;
	}
}

@media (min-width:1301px) and (max-width:1500px) {

	/*layout*/
	.navline {
		display: none !important;
	}

	#fp-nav {
		display: none !important;
	}

	.innerwrap {
		max-width: 1170px;
	}

	.menuBox .centerbox {
		margin: 0 auto 0 25%;
	}
}

@media (min-width:1501px) and (max-width:1600px) {

	/*layout*/
	.toplogo img {
		max-width: 150px;
	}

	.section .txt,
	.bglayer {
		max-width: 1000px;
	}

	.bglayer h1 {
		font-size: 2rem;
		margin-bottom: 25px;
	}

	.bglayer .line1 .one,
	.bglayer .line2 .one {
		padding: 30px;
		margin: 0;
	}

	.intro2 .line2 .texts br {
		display: none;
	}

	.notice p {
		margin: 0 0 25px 0;
	}

	.notice .right2 .one {
		padding: 24px 10px;
	}

	.innerwrap {
		max-width: 1200px;
	}

	.menuBox .centerbox {
		margin: 0 auto 0 20%;
	}
}

@media (min-width:1601px) and (max-width:1919px) {

	/*layout*/
	.navline {
		left: 13.1%;
	}

	#fp-nav.left {
		left: 12.6% !important;
	}

	.toplogo img {
		max-width: 150px;
	}

	.section .txt,
	.bglayer {
		max-width: 1000px;
	}

	.bglayer .line1 .one,
	.bglayer .line2 .one {
		padding: 30px;
	}

	.notice .right2 .one {
		padding: 30px 10px;
		max-height: 156px;
	}

	.bglayer h1 {
		font-size: 2.3rem;
		margin-bottom: 25px;
	}

	.innerwrap {
		max-width: 1200px;
	}

	.menuBox .centerbox {}
}