@charset "utf-8";

@font-face {
	font-family: 'icomoon';
	src: url('./icomoon.eot');
	src: url('./icomoon.eot') format('embedded-opentype'),
		url('./icomoon.ttf') format('truetype'),
		url('./icomoon.woff') format('woff'),
		url('./icomoon.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'voice_icomoon';
	src: url('./icomoon.eot');
	src: url('./icomoon.eot?#iefix') format('embedded-opentype'),
		url('./icomoon.woff') format('woff'),
		url('./icomoon.ttf') format('truetype'),
		url('./icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

@keyframes voice_animation {
	from {
		color: #168fff
	}

	50% {
		color: #16b5ff
	}

	to {
		color: #168fff
	}
}



/* Layout */
* {
	margin: 0;
	padding: 0;
	word-break: keep-all;
	box-sizing: border-box;
}

button:focus {
	outline: none;
}

#viewport {
	overflow-x: hidden;
	min-height: 100%
}

#viewport>#main_view,
#viewport>#sub_view {
	max-width: 100%;
	width: 100%
}

#header {
	position: relative;
	z-index: 1200;
	background: #fff;
	box-shadow: 0px 0px 3px rgba(0, 0, 0, .5)
}

#header .logo h1 {
	width: 100%;
	margin: 0;
	padding: 0 60px;
	font-size: 0;
	box-sizing: border-box
}

#header .logo h1 span {
	display: table;
	width: 100%;
	table-layout: fixed
}

#header .logo h1 a {
	display: table-cell;
	height: 50px;
	vertical-align: middle;
	text-align: center
}

#header .logo h1 img {
	width: auto;
	max-height: 50px
}

#header .logo h1 .logo_light {
	display: none
}

#header .logo h1 .logo_dark {
	display: inline-block
}

#header .logo button {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 50px;
	height: 50px;
	margin: auto;
	border: none;
	background: none;
	font-size: 0
}

#header .logo #toggle_left {
	left: 0
}

#header .logo #toggle_left:before,
#header .logo #toggle_left:after {
	content: '';
	display: block;
	position: absolute;
	right: 0;
	left: 0;
	top: 0;
	bottom: 0;
	width: 28px;
	height: 3px;
	margin: auto;
	opacity: 1;
	transition: top 0.2s 0.3s ease, bottom 0.2s 0.3s ease
}

#header .logo #toggle_left:before {
	top: -16px;
	width: 28px;
	height: 3px;
	background: #035b95
}

#header .logo #toggle_left:after {
	bottom: -16px;
	width: 28px;
	height: 3px;
	background: #035b95
}

#header .logo #toggle_left.on:before,
#header .logo #toggle_left.on:after {
	opacity: 0;
	top: 0;
	bottom: 0;
	transition: opacity 0s 0s ease
}

#header .logo #toggle_left span:before,
#header .logo #toggle_left span:after {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	width: 28px;
	height: 3px;
	margin: auto;
	background: #035b95;
	transform: rotate(0deg);
	transition: all 0.3s ease
}

#header .logo #toggle_left.on span:before {
	transform: rotate(45deg)
}

#header .logo #toggle_left.on span:after {
	transform: rotate(-45deg)
}

#header .logo #toggle_right {
	display: none;
	right: 0
}

#header .logo #toggle_right:before {
	content: url('../img/lang_h.png');
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}

#footer {
	overflow: hidden;
	position: relative;
	padding: 20px 0;
	background: #111111
}

#footer #btn_site_top {
	position: fixed;
	bottom: 10px;
	right: 10px;
	z-index: 0;
	width: 40px;
	height: 40px;
	border: none;
	border-radius: 50%;
	background: #035b95;
	font-size: 0;
	opacity: 0;
	transition: all .2s ease-in-out
}

#footer #btn_site_top:before {
	content: '\e917';
	font-family: 'icomoon';
	font-size: 16px;
	font-weight: bold;
	color: #fff
}

#footer #btn_site_top.on {
	opacity: .6;
	z-index: 1000
}

#footer .finfo {
	padding: 10px 20px 20px;
	font-size: 0;
	text-align: center
}

#footer .finfo .f_logo {
	display: none
}

#footer .finfo ul {
	display: block;
	margin: 0;
	list-style: none;
	font-size: 0;
	text-align: center;
}

#footer .finfo li {
	display: inline-block
}

#footer .finfo li a {
	display: inline-block;
	position: relative;
	height: 40px;
	line-height: 40px;
	padding: 0 8px;
	font-size: 12px;
	color: #eeeeee;
	text-align: center;
	white-space: nowrap
}

#footer .finfo li a:before {
	content: '';
	position: absolute;
	top: 2px;
	bottom: 0;
	left: 0;
	width: 1px;
	height: 10px;
	margin: auto;
	background: #ccc
}

#footer .finfo li:first-child a {
	padding-left: 0
}

#footer .finfo li:first-child a:before {
	display: none
}

#footer .finfo p {
	display: inline-block;
	position: relative;
	line-height: 16px;
	margin: 0;
	padding: 2px 15px 2px 0;
	font-size: 12px;
	color: #eeeeee
}

#footer .finfo p:before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 2px;
	height: 2px;
	margin: auto;
	opacity: .5
}

#footer .finfo p.mobile_hide {
	display: none
}

#footer .finfo a {
	color: #eeeeee
}

#footer .finfo .copyright {
	line-height: 16px;
	padding: 10px 0 0;
	font-size: 12px;
	color: #eeeeee
}

#footer .finfo button {
	border: 1px solid #aaa;
	border-radius: 4px;
	box-shadow: inset 0 1px 0 white;
	background: #f6f6f6;
	font-size: 12px;
	color: #555;
	text-align: center
}

#container .contents_wrap {
	min-height: 350px
}

#container .contents:after {
	content: '';
	display: block;
	overflow: hidden;
	clear: both
}

#sub_view .contents_wrap {
	padding: 0
}

#sub_view .contents_wrap .contents {
	padding: 50px 0;
}

#sub_view .contents_wrap.mypage .snb_wrap {
	width: 100%
}

#sub_view .contents_wrap.mypage .snb {
	position: relative
}

#sub_view .contents_wrap.mypage .snb>div {
	overflow-x: scroll
}

#sub_view .contents_wrap.mypage .snb ul {
	display: inline-block;
	min-width: 100%;
	margin: 0;
	padding: 0 40px;
	border-bottom: 3px solid #035b95;
	box-sizing: border-box;
	list-style: none;
	font-size: 0;
	text-align: center;
	white-space: nowrap
}

#sub_view .contents_wrap.mypage .snb ul li {
	display: inline-block
}

#sub_view .contents_wrap.mypage .snb ul li a {
	height: 40px;
	line-height: 40px;
	padding: 0 10px;
	font-size: 13px
}

#sub_view .contents_wrap.mypage .snb ul li.on a {
	color: #035b95
}

#sub_view .contents_wrap.mypage .snb i {
	position: absolute;
	left: 0;
	top: 0;
	width: 40px;
	height: 40px;
	background: #ffffff
}

#sub_view .contents_wrap.mypage .snb i.prev:before {
	content: '';
	position: absolute;
	top: 0;
	left: 8px;
	bottom: 0;
	width: 0;
	height: 0;
	margin: auto;
	border: 8px solid transparent;
	border-right-color: #035b95
}

#sub_view .contents_wrap.mypage .snb i.prev:after {
	content: '';
	position: absolute;
	top: 0;
	left: 9px;
	bottom: 0;
	width: 0;
	height: 0;
	margin: auto;
	border: 8px solid transparent;
	border-right-color: #ffffff
}

#sub_view .contents_wrap.mypage .snb i.next {
	right: 0;
	left: inherit
}

#sub_view .contents_wrap.mypage .snb i.next:before {
	content: '';
	position: absolute;
	top: 0;
	right: 8px;
	bottom: 0;
	width: 0;
	height: 0;
	margin: auto;
	border: 8px solid transparent;
	border-left-color: #035b95
}

#sub_view .contents_wrap.mypage .snb i.next:after {
	content: '';
	position: absolute;
	top: 0;
	right: 9px;
	bottom: 0;
	width: 0;
	height: 0;
	margin: auto;
	border: 8px solid transparent;
	border-left-color: #ffffff
}

/* sub page */
.shgroup {
	position: relative
}

.shgroup>a {
	display: block;
	position: relative;
	width: 100%;
	height: 40px;
	line-height: 40px;
	margin: 0;
	padding: 0 40px;
	border: none;
	box-sizing: border-box;
	background: #035b95;
	font-size: 16px;
	color: #ffffff;
	text-align: center
}

.shgroup>a span {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	display: block
}

.shgroup>a i {
	display: block;
	position: absolute;
	top: 0;
	width: 40px;
	height: 40px;
	font-size: 0
}

.shgroup>a i:before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	border: 8px solid transparent;
	opacity: .5
}

.shgroup>a i:after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	border: 8px solid transparent
}

.shgroup>a i {
	left: 0
}

.shgroup>a i:before {
	margin: -8px 0 0 -12px;
	border-right-color: #ffffff
}

.shgroup>a i:after {
	margin: -8px 0 0 -10px;
	border-right-color: #035b95
}

/* Mobile viewport - PC content display none */
.buttons_p,
.lnb_p,
.gnb_p,
.header_form,
.shgroup>.shgroup_pc,
.sub_pc_bg {
	display: none
}

/* PC CSS */
@media all and (min-width:1024px) {

	/* 음성안내 */
	#voice_guide_wrap {
		display: inline-block;
		vertical-align: top
	}

	#voice_guide_wrap a {
		display: none;
		width: 16px;
		height: 40px;
		line-height: 40px;
		font-size: 0;
		text-align: center
	}

	#voice_guide_wrap a>span {
		position: absolute;
		top: -9999px;
		left: -9999px;
		text-indent: -9999px
	}

	#voice_guide_wrap a:before {
		font-family: 'voice_icomoon';
		font-size: 16px
	}

	#voice_guide_wrap.off a.state_voice_on {
		display: inline-block
	}

	#voice_guide_wrap.on a.state_voice_off {
		display: inline-block
	}

	#voice_guide_wrap a.state_voice_on:before {
		content: '\e903';
		color: #168fff;
		transition: all 0.1s ease;
		animation-name: voice_animation;
		animation-duration: 1s;
		animation-iteration-count: infinite;
		animation-timing-function: step-end;
	}

	#voice_guide_wrap a.state_voice_off:before {
		content: '\e902';
		color: #87909c
	}

	/* PC viewport - Mobile content display none */
	#header .logo button,
	.shgroup>a {
		display: none
	}

	/* PC display:block */
	.buttons_p,
	.lnb_p,
	.gnb_p,
	.header_form,
	.shgroup>.shgroup_pc {
		display: block
	}

	/* PC 화면 넓이값을 가진 센터유지 */
	.row>.white-space {
		max-width: 1200px !important
	}

	#header>.inner,
	#footer .fnb,
	#footer .finfo,
	.shgroup,
	.contents_wrap.mypage,
	.sub_location>div {
		margin: 0 auto;
		max-width: 1200px
	}

	/* mypage 서브 네비게이션 넓이값 */
	#container .contents_wrap {
		min-height: 500px
	}

	#sub_view .contents_wrap .contents {
		padding-top: 0
	}

	#header {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		border-bottom: 1px solid rgba(255, 255, 255, .2);
		background: none;
		box-shadow: none;
		transition: background .3s ease
	}

	#header:hover {
		background: rgba(0, 0, 0, .4)
	}

	#header .logo {
		position: absolute;
	}

	#header .logo h1 {
		width: auto;
		padding: 15px
	}

	#header .logo h1 span {
		width: auto
	}

	#header .logo h1 a {
		height: 50px
	}

	#header .logo h1 img {
		width: auto;
		max-height: 50px
	}

	#header .logo h1 .logo_light {
		display: block
	}

	#header .logo h1 .logo_dark {
		display: none
	}

	#header>.inner {
		position: relative
	}

	#header .lang{
		padding: 0 15px 0 0
	}
	
	.buttons_p {
		display: none;
		position: absolute;
		top: 0;
		right: 0;
		height: 80px;
		padding: 15px;
		font-size: 0;
		box-sizing: border-box
	}

	.buttons_p:before {
		display: none;
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		width: 1px;
		height: 28px;
		margin: auto;
		background: #fff;
		opacity: .4
	}

	.buttons_p button {
		position: relative;
		width: 50px;
		height: 50px;
		margin: auto;
		border: none;
		background: none;
		font-size: 0
	}

	.buttons_p button:before {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		margin: auto;
	}

	.buttons_p button:hover:before {
		color: #035b95
	}

	.buttons_p #toggle_gnb:before {
		content: url('../img/lang.png');
	}

	.buttons_p #toggle_search:before {
		content: '\e901';
		font-size: 28px
	}

	.lnb_p {
		display: block;
		/* width: 100%; */
		/* max-width: 85%; */
		margin: 0 auto;
		/* padding-left: 120px; */
		min-height: 80px;
		box-sizing: border-box;
		float: right;
	}

	.lnb_p ul {
		margin: 0;
		padding: 0;
		list-style: none
	}

	.lnb_p a {
		display: block
	}

	.lnb_p .dep1:after {
		clear: both;
		content: '';
		display: block
	}

	.lnb_p .dep1>li {
		overflow: hidden;
		float: left;
		position: relative
	}

	.lnb_p .dep1>li>a {
		overflow: hidden;
		position: relative;
		height: 80px;
		line-height: 80px;
		font-size: 15px;
		font-weight: bold;
		color: #fff;
		text-align: center;
		white-space: nowrap;
		text-overflow: ellipsis;
		padding: 0 47px;
	}

	.lnb_p .dep1>li:hover {
		overflow: visible
	}

	.lnb_p .dep1>li:hover>a {
		background: #fff;
		color: #035b95;
		transition: background .3s ease
	}

	.lnb_p .dep1>li>a:before {
		content: '';
		position: absolute;
		right: 0;
		bottom: 0;
		left: 0;
		width: 0;
		height: 2px;
		margin: auto;
		background: #035b95;
		transition: all .5s
	}

	.lnb_p .dep1>li.on>a:before,
	.lnb_p .dep1>li:hover>a:before {
		width: 60%
	}

	.lnb_p .dep1>li>div {
		display: block;
		position: absolute;
		min-width: 100%;
		background: #fff;
		box-sizing: border-box;
		opacity: 0;
		transition: all .3s ease;
		box-shadow: 0px 3px 3px rgba(0, 0, 0, .3);
		white-space: nowrap;
	}

	.lnb_p .dep1>li:hover>div {
		opacity: 1
	}

	.lnb_p .dep2 {
		display: block;
		border-top: none;
		box-sizing: border-box;
		font-size: 0;
		white-space: nowrap
	}

	/* dep2 li가 가로로 정렬일때 display:inline-block 적용하면 script도 자동 활성화 */
	/*.lnb_p .dep2 > li {display:inline-block}*/
	.lnb_p .dep2>li>a {
		overflow: hidden;
		position: relative;
		padding: 20px 15px;
		font-size: 14px;
		color: #444444;
		text-align: center;
		white-space: nowrap;
		text-overflow: ellipsis
	}

	.lnb_p .dep2>li>a:before {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 14px;
		width: 4px;
		height: 4px;
		margin: auto
	}

	.lnb_p .dep2>li.on>a,
	.lnb_p .dep2>li:hover>a {
		font-weight: bold;
		color: #035b95
	}

	.gnb_p {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		width: 210px;
		padding: 0 15px 15px 15px;
		font-size: 0;
		background: #fff;
		text-align: center;
		box-shadow: 0px 0px 3px rgba(0, 0, 0, .5);
		box-sizing: border-box;
		transform: translate(100%, 0);
		transition: all .3s ease
	}

	.gnb_p>div {
		height: 80px;
		padding: 15px;
		box-sizing: border-box
	}

	.gnb_p>div button {
		position: relative;
		width: 50px;
		height: 50px;
		margin: auto;
		border: none;
		background: none;
		font-size: 0
	}

	.gnb_p>div button span:before,
	.gnb_p>div button span:after {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		right: 0;
		width: 24px;
		height: 4px;
		margin: auto;
		background: #000;
		transition: all 0.3s ease
	}

	.gnb_p>div button span:before {
		transform: rotate(45deg)
	}

	.gnb_p>div button span:after {
		transform: rotate(-45deg)
	}

	.gnb_p ul {
		display: block;
		margin: 0;
		padding: 0;
		list-style: none
	}

	.gnb_p ul li {
		display: block;
		position: relative;
		padding: 10px 0
	}

	.gnb_p ul li a {
		display: block;
		height: 40px;
		line-height: 40px;
		padding: 0 12px;
		font-size: 14px;
		font-weight: bold;
		color: #444444
	}

	.gnb_p ul li a:before {
		content: '';
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		width: 2px;
		height: 2px;
		margin: auto;
		border-radius: 50%;
		background: #444444;
		opacity: 0.5
	}

	.gnb_p ul li a:hover {
		background: #035b95;
		color: #ffffff
	}

	.gnb_p ul li:first-child a:before {
		display: none
	}

	.gnb_p.on {
		transform: translate(0, 0)
	}

	.header_form {
		position: fixed;
		top: 0;
		right: 0;
		left: 0;
		height: 80px;
		background: #fff;
		box-shadow: 0px 0px 3px rgba(0, 0, 0, .5);
		transform: translate(0, -100%);
		transition: all .3s ease
	}

	.header_form.on {
		transform: translate(0, 0)
	}

	.header_form:after {
		content: '';
		display: block;
		clear: both
	}

	.header_form .search_p {
		float: left;
		width: calc(100% - 100px);
		height: 80px
	}

	.header_form .search_p fieldset {
		position: relative;
		margin: 0;
		padding: 0;
		border: none
	}

	.header_form .search_p legend {
		display: none
	}

	.header_form .search_p span {
		display: block
	}

	.header_form .search_p span input {
		width: 100%;
		height: 80px;
		margin: 0;
		padding: 0 100px 0 0;
		border: none;
		background: transparent;
		font-size: 34px;
		color: #666;
		text-align: center;
		box-sizing: border-box;
		outline: none
	}

	.header_form .search_p span input::placeholder {
		color: #999;
		opacity: 1
	}

	.header_form .search_p span input:-ms-input-placeholder {
		color: #999
	}

	.header_form .search_p span input::-ms-input-placeholder {
		color: #999
	}

	.header_form .search_p fieldset button {
		display: none;
		position: absolute;
		border: none;
		padding: 0;
		top: 10px;
		right: 10px;
		bottom: 10px;
		margin: auto;
		width: 80px;
		height: 80px;
		background: transparent;
		font-size: 0
	}

	.header_form .search_p fieldset button:before {
		content: '\e901';
		font-family: 'icomoon';
		font-size: 60px;
		color: #666
	}

	.header_form .search_p fieldset button:hover:before {
		color: #035b95
	}

	.header_form>div {
		float: right;
		width: 95px;
		height: 80px;
		padding: 15px;
		box-sizing: border-box
	}

	.header_form>div button {
		position: relative;
		width: 50px;
		height: 50px;
		margin: auto;
		border: none;
		background: none;
		font-size: 0
	}

	.header_form>div button span:before,
	.header_form>div button span:after {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		right: 0;
		width: 24px;
		height: 4px;
		margin: auto;
		background: #000;
		transition: all 0.3s ease
	}

	.header_form>div button span:before {
		transform: rotate(45deg)
	}

	.header_form>div button span:after {
		transform: rotate(-45deg)
	}

	#footer .finfo {
		position: relative;
		min-height: 150px;
		padding: 30px 0 30px 230px;
		text-align: left
	}

	#footer .finfo .f_logo {
		display: block;
		position: absolute;
		top: 45px;
		left: 0
	}

	#footer .finfo .f_logo img {
		max-width: 180px;
		padding:0 0 0 15px
	}

	#footer .finfo ul {
		display: block;
		margin: 0;
		list-style: none;
		font-size: 0;
		text-align: left;
	}

	#footer .finfo li a {
		display: inline-block;
		position: relative;
		height: 40px;
		line-height: 40px;
		padding: 0 8px;
		font-size: 14px;
		color: #eeeeee;
		text-align: center;
		white-space: nowrap
	}

	#footer .finfo p {
		font-size: 13px
	}

	#footer .finfo .copyright {
		font-size: 13px
	}

	/* sub page */
	#sub_view .sub_pc_bg {
		display: table;
		position: relative;
		width: 100%;
		height: 470px;
		background-repeat: no-repeat;
		background-position: center 0;
		background-attachment: fixed
	}

	#sub_view .sub_pc_bg .sub_title {
		display: table-cell;
		padding: 100px 0 0;
		box-sizing: border-box;
		text-align: center;
		vertical-align: middle
	}

	#sub_view .sub_pc_bg .sub_title h2,
	#sub_view .sub_pc_bg .sub_title p,
	#sub_view .sub_pc_bg .sub_title span {
		position: relative;
		color: #ffffff;
		text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
	}

	#sub_view .sub_pc_bg .sub_title h2 {
		top: 0;
		margin: 0 0 5px;
		font-size: 50px
	}

	#sub_view .sub_pc_bg .sub_title p {
		top: 0;
		margin: 0 0 20px;
		font-size: 20px
	}

	#sub_view .sub_pc_bg .sub_location {
		line-height: 50px;
		color: #ffffff;
		font-size: 0;
		text-align: center
	}

	#sub_view .sub_pc_bg .sub_location span {
		display: inline-block;
		position: relative;
		padding-right: 30px;
		font-size: 15px
	}

	#sub_view .sub_pc_bg .sub_location span:before {
		content: "\e916";
		display: block;
		position: absolute;
		right: 8px;
		top: 1px;
		font-family: "icomoon"
	}

	#sub_view .sub_pc_bg .sub_location span:last-child:before {
		display: none
	}

	#sub_view .sub_pc_bg .sub_location span.home {
		font-size: 0
	}

	#sub_view .sub_pc_bg .sub_location span:before {
		font-size: 14px
	}

	#sub_view .sub_pc_bg .sub_location span.home:after {
		content: "\e900";
		display: block;
		font-size: 16px;
		font-family: "icomoon"
	}

	#sub_view .contents_wrap.mypage .snb {
		position: relative;
		margin-top: -40px
	}

	#sub_view .contents_wrap.mypage .snb>i {
		display: none !important
	}

	#sub_view .contents_wrap.mypage .snb>div {
		overflow: auto
	}

	#sub_view .contents_wrap.mypage .snb>div ul {
		display: block;
		padding: 0;
		white-space: normal;
		border-bottom: none;
		text-align: center
	}

	#sub_view .contents_wrap.mypage .snb>div ul:after {
		content: '';
		display: block;
		clear: both
	}

	#sub_view .contents_wrap.mypage .snb>div ul li {
		display: block;
		float: left;
		width: 33.33%;
		border: 1px solid rgba(255, 255, 255, .4);
		border-left-width: 0;
		box-sizing: border-box
	}

	#sub_view .contents_wrap.mypage .snb>div ul li:first-child {
		border-left-width: 1px
	}

	#sub_view .contents_wrap.mypage .snb>div ul li a {
		display: block;
		position: relative;
		height: 38px;
		line-height: 38px;
		padding: 0 20px;
		font-size: 15px;
		font-weight: bold;
		color: #fff
	}

	#sub_view .contents_wrap.mypage .snb>div ul li.on a,
	#sub_view .contents_wrap.mypage .snb>div ul li:hover a {
		background: rgba(0, 0, 0, .6)
	}

	#sub_view .contents_wrap.mypage .contents {
		overflow: hidden
	}

	#sub_view .contents_wrap .contents {
		padding-bottom: 80px
	}

	/* scroll */
	.scroll #header {
		background: #fff;
		box-shadow: 0px 0px 3px rgba(0, 0, 0, .5)
	}

	.scroll #header h1 .logo_light {
		display: none
	}

	.scroll #header h1 .logo_dark {
		display: block
	}

	.scroll .buttons_p button:before {
		content: url('../img/h_lang.png') !important;
	}

	.scroll .buttons_p button:hover:before {
		color: #035b95
	}

	.scroll .lnb_p .dep1>li>a {
		color: #444444
	}
	.scroll #header .lang .lang-list > li > a{
		color:#444
	}
	.scroll #header .lang .lang-list .bar{
		background:#444
	}

	.scroll .lnb_p .dep1>li:hover>a {
		color: #035b95
	}
}

/* MOBILE - 뷰포트 CSS */
@media all and (max-width:1023px) {

	#viewport {
		position: relative;
		width: 100%
	}

	#viewport #header {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		transition: all 300ms ease
	}

	#viewport #container {
		position: relative;
		z-index: 100;
		padding-top: 50px
	}

	#viewport #main_view,
	#viewport #sub_view {
		position: relative;
		left: 0;
		top: 0;
		transition: all 300ms ease
	}

	#viewport.app_view #container {
		padding-top: 0
	}

	.side_menu ul {
		margin: 0;
		padding: 0;
		list-style: none
	}

	.side_menu [role=toggle]>a:before {
		content: '';
		position: absolute;
		top: 50%;
		right: 12px;
		width: 0;
		height: 0;
		margin-top: -2px;
		border: 6px solid transparent;
		border-top-color: #666
	}

	.side_menu [role=toggle].active>a:before {
		margin-top: -8px;
		border-top-color: transparent;
		border-bottom-color: #666
	}

	.side_menu .dep1>li>a {
		display: block;
		position: relative;
		height: 40px;
		line-height: 40px;
		padding: 0 35px 0 12px;
		border-bottom: 1px solid #e6e6e6;
		background: #fafafa;
		font-size: 13px;
		font-weight: bold;
		color: #666;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap
	}

	.side_menu .dep2 {
		display: none
	}

	.side_menu .dep2>li>a {
		display: block;
		position: relative;
		height: 40px;
		line-height: 40px;
		padding: 0 12px 0 24px;
		border-bottom: 1px solid #e6e6e6;
		background: #fff;
		font-size: 13px;
		font-weight: bold;
		color: #666;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap
	}
	#left_side.en .side_menu .dep2>li>a{
		font-weight: 500
	}
	.side_menu .active .dep2 {
		display: block
	}

	.side_search {
		border-bottom: 1px solid #e6e6e6;
		background: #fafafa
	}

	.side_search fieldset {
		position: relative;
		margin: 0;
		padding: 8px;
		border: none
	}

	.side_search legend {
		display: none
	}

	.side_search span {
		display: block;
		padding: 4px 8px;
		border: 1px solid #ccc;
		background: #fff
	}

	.side_search span input {
		width: 100%;
		margin: 0;
		padding: 4px 0;
		border: none;
		background: transparent;
		color: #666
	}

	.side_search button {
		position: absolute;
		border: none;
		padding: 0;
		top: 10px;
		right: 10px;
		bottom: 10px;
		margin: auto;
		padding: 5px;
		background: transparent;
		font-size: 0
	}

	.side_search button:before {
		content: '\e901';
		font-family: 'icomoon';
		font-size: 24px;
		color: #666
	}
	/*230508 추가 s*/
	#left_side .lang .lang-list{
		display: flex;
		margin: 20px 0 0 12px
	}
	#left_side .lang .lang-list > li > a{
		color:#666;
		font-size: 12px
	}
	#left_side .lang .lang-list .bar{
		width: 1px;
		height: 11px;
		background: #666;
		display: inline-block;
		margin: auto 7px
	}
	#left_side .lang .lang-list > li.on > a{
	color:#063871;
		font-weight: 600
	}
	#header .lang{
		display: none
	}
	
	/*e*/

	#viewport .viewport_side {
		visibility: hidden;
		overflow-y: auto;
		position: fixed;
		top: 0;
		width: 220px;
		height: 100%;
		padding: 50px 0 0;
		box-sizing: border-box;
		background: #ffffff;
		z-index: 1190;
		transition: all 300ms ease
	}

	#viewport #left_side {
		left: -220px
	}

	#viewport #right_side {
		right: -220px
	}

	#viewport #close_side {
		visibility: hidden;
		position: absolute;
		top: 0;
		left: 0;
		bottom: 0;
		left: 0;
		z-index: 1180;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		border: none;
		text-align: left;
		text-indent: -9999px;
		background: rgba(0, 0, 0, 0.6);
		opacity: 0;
		transition: visibility 0s 0.3s, opacity 0s 0.3s
	}

	#viewport.on.toggle_left #left_side {
		visibility: visible;
		left: 0
	}

	#viewport.on.toggle_right #right_side {
		visibility: visible;
		right: 0
	}

	#viewport.on #close_side {
		visibility: visible;
		opacity: 1;
		transition: visibiliy 0s 0s, opacity 0s 0s
	}
}

/* PC - 뷰포트 CSS */
@media all and (min-width:1024px) {
	#viewport #left_side {
		display: none
	}

	#viewport #right_side {
		display: none
	}

	#viewport #close_side {
		display: none
	}
}

/* tablet, moblie */
@media all and (max-width:767px) {
	#header .logo h1 img {
		width: 160px;
	}
	#header.en .logo h1 img {
		width: 90px;
	}
	#footer .finfo li a {
		font-size: 10px;
		padding: 0 4px;
	}
}


/*230509 수정 s*/
.lnb_p.en .dep1>li>a{
	padding: 0 54px
}
/*e*/