@charset "utf-8";

/**
공통 레이아웃
*/

html,
body {
	scroll-behavior: smooth;
}

#header .inner,
#menuArea .inner {
	width: 1200px;
}

.m {
	display: none !important;
}

.mask {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	visibility: hidden;
	background-color: rgba(0, 0, 0, 0.5);
	opacity: 0;
}

.mask.on {
	z-index: 95;
	visibility: visible;
	transition: 0.3s ease;
	opacity: 1;
}

#content.on+.mask {
	opacity: 0;
}

body {
	overflow-x: hidden;
	width: 100%;
	min-width: 320px;
}

#skip-navigation {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9999;
}

#skip-navigation * {
	margin: 0;
	padding: 0;
	list-style: none;
}

#skip-navigation a {
	display: block;
	overflow: hidden;
	width: 1px;
	height: 1px;
	color: #000;
	white-space: nowrap;
}

#skip-navigation a:focus,
#skip-navigation a:active {
	width: 100px;
	height: auto;
	background: #ffd;
}

.inner {
	margin: 0 auto;
	position: relative;
	width: 1200px;
	box-sizing: border-box;
}

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

#top {
	display: block;
	height: 49px;
	background: #0c347c;
}

#top .global {
	float: left;
}

#top .global>li {
	position: relative;
	float: left;
}

#top .global>li+li {
	margin: 0 0 0 4px;
}

#top .global>li>a {
	display: block;
	padding: 0 43px;
	position: relative;
	background: #09275d;
	font-weight: 400;
	line-height: 49px;
	color: #fff;
	transition: 0.3s;
}

#top .global>li.list>a {
	padding: 0 21px 0 29px;
}

#top .global>li:last-child>a {
	padding: 0 30px;
}

#top .global>li>a:hover,
#top .global>li>a:active,
#top .global>li>a:focus,
#top .global>li.current>a {
	background: #fff;
	font-weight: 900;
	color: #09275d;
}

#top .global>li.list>a:after {
	display: inline-block;
	margin: 0 0 0 26px;
	border-top: 6px solid rgba(255, 255, 255, 0.6);
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
	vertical-align: middle;
	transition: 0.3s;
	content: '';
}

#top .global>li.list>a.on:after {
	border-top-color: #09275d;
	transform: rotate(180deg);
}

#top .global>li.list:hover>a:after,
#top .global>li.list:focus>a:after,
#top .global>li.list:active>a:after,
#top .global>li.list.current>a:after {
	border-top-color: #09275d;
}

#top .global li div {
	display: none;
	padding: 0 8px;
	border: 1px solid #e5e5e5;
	border-top: none;
	box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.1);
	position: absolute;
	top: 49px;
	left: 0;
	z-index: 98;
	width: 100%;
	background: #fff;
	box-sizing: border-box;
	border-radius: 0 0 4px 4px;
}

#top .global li div a {
	display: block;
	border-top: 1px dotted #e5e5e5;
	height: 44px;
	line-height: 44px;
	text-align: center;
}

#top .global li div li:first-child a {
	border-top: none;
}

#top .global li div#lang_list li a {
	font-family: 'Noto Sans SC';
}

#top .global .list1 div {
	width: 300px;
}

#top .global .list1 li {
	display: inline-block;
	margin: 0 1.1%;
	width: 30%;
}

#top .global .list1 li:nth-child(-n + 3) a {
	border-top: none;
}

#font_control {
	padding: 6px 0 0;
	float: right;
}

#font_control li {
	float: left;
}

#font_control li+li {
	margin: 0 0 0 3px;
}

#font_control li a {
	display: block;
	width: 39px;
	height: 38px;
	background: rgba(255, 255, 255, 0.1) url(/images/common/ico_fc.png) no-repeat top 13px center;
	font-size: 0;
	line-height: 38px;
	color: #fff;
	text-align: center;
	text-indent: -999px;
	transition: 0.3s;
}

#font_control li.current a {
	background-image: none;
	font-size: 14px;
	text-indent: 0;
}

#font_control li.small a {
	background-position: top -23px center;
}

#font_control li.print a {
	padding: 0 17px 0 42px;
	background-position: top -61px left 20px;
	font-size: 13px;
	text-indent: 0;
}

#font_control li a:hover,
#font_control li a:focus,
#font_control li a:active {
	background-color: #09275d;
}

#header {
	position: relative;
	height: 102px;
}

.logo {
	position: absolute;
	top: 29px;
	left: 0;
	z-index: 94;
}

.logo * {
	display: inline-block;
}

.logo a {
	text-decoration: none;
}

.logo img {
	margin: 0 5px 0 0;
	vertical-align: top;
}

.logo strong {
	padding: 4px 0 2px;
	font-family: 'NanumSquare';
	font-size: 28px;
	font-weight: 900;
	line-height: 100%;
	color: #222;
	letter-spacing: -0.5px;
}

.logo span>span {
	display: block;
	padding: 0 0 0 3px;
	font-family: 'NanumSquare';
	font-size: 18px;
	font-weight: 600;
	line-height: 100%;
	color: #222;
	letter-spacing: -1px;
}

.btn_menu {
	display: none;
	position: absolute;
	top: 34px;
	right: 0;
	z-index: 96;
	width: 27px;
	background: none;
	border-radius: 3px;
	transform: rotate(-180deg);
}

.btn_menu .bar {
	display: block;
	margin: 6px 0;
	width: 100%;
	height: 3px;
	background: #000;
}

.btn_menu .bar:nth-of-type(3) {
	width: 20px;
}

.btn_menu .bar:nth-of-type(4) {
	width: 24px;
}

.btn_menu_close {
	display: block;
	position: absolute;
	top: 28px;
	right: 3%;
	z-index: 96;
	width: 50px;
	height: 50px;
}

.btn_menu_close .bar {
	position: absolute;
	top: 22px;
	left: 12px;
	width: 27px;
	height: 2px;
	background: #bec1c4;
}

.btn_menu_close .bar1 {
	transform: rotate(45deg);
}

.btn_menu_close .bar2 {
	transform: rotate(-45deg);
}

/* 검색 */
#search {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 97;
	width: 100%;
	min-width: 320px;
}

.btn_search {
	display: block;
	margin: 0 -830px 0 0;
	position: absolute;
	top: 79px;
	right: 50%;
	width: 40px;
	height: 40px;
	background: url(/images/common/ico_search1.png) no-repeat 50% 50%;
	font-size: 0;
	text-indent: -999px;
}

#search fieldset {
	padding: 175px 0 165px;
	position: absolute;
	top: -60px;
	left: 0;
	width: 100%;
	visibility: hidden;
	background: #292e44;
	font-size: 18px;
	font-weight: 300;
	color: #fff;
	transition: 0.3s ease-in-out;
	opacity: 0;
	box-sizing: border-box;
}

#search.on fieldset {
	top: 0;
	visibility: visible;
	opacity: 1;
}

#search h2 {
	padding: 0 0 15px;
	font-size: 30px;
	font-weight: 600;
	line-height: 110%;
	color: #fff;
	letter-spacing: 0;
}

#search .inner {
	width: 770px;
}

#search input[type="text"] {
	padding: 0 0 0 32px;
	border: 3px solid #fff;
	width: 100%;
	height: 110px;
	background: #292e44;
	font-size: 40px;
	line-height: 110px;
	color: rgba(255, 255, 255, 0.5);
	box-sizing: border-box;
}

#search ::-webkit-input-placeholder {
	color: rgba(255, 255, 255, 0.5);
}

#search :-ms-input-placeholder {
	color: rgba(255, 255, 255, 0.5);
}

#search ::placeholder {
	color: rgba(255, 255, 255, 0.5);
}

#search .in_txt {
	margin: 0 0 40px;
	position: relative;
}

#search li {
	margin-bottom: 10px;
	font-weight: 200;
}

#search li:before {
	top: 7px;
	background: #fff;
}

#search .btn_submit {
	position: absolute;
	top: 0;
	right: 0;
	width: 110px;
	height: 110px;
	background: url(/images/common/ico_search2.png) no-repeat 25px 28px;
	font-size: 0;
	text-indent: -999px;
}

#search .btn_close {
	display: block;
	margin: 0 -600px 0 0;
	position: absolute;
	top: 45px;
	right: 50%;
	width: 60px;
	height: 60px;
	background: url(/images/common/ico_search_close.png) no-repeat 50% 50%;
	font-size: 0;
	text-indent: -999px;
}

/* 메인메뉴 */
#menuArea {
	border-bottom: 1px solid #e5e5e5;
	overflow: hidden;
	position: absolute;
	top: 49px;
	left: 0;
	z-index: 93;
	width: 100%;
	background: #fff;
}

#menuArea.on {
	box-shadow: 0 15px 15px rgba(0, 0, 0, 0.15);
}

#menuArea:after {
	position: absolute;
	top: 102px;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 1px;
	background: #e5e5e5;
	content: '';
}

body.on .mask {
	top: auto;
	bottom: 0;
	z-index: 92;
	height: calc(100% - 150px);
	visibility: visible;
	opacity: 1;
}

#topmenu {
	padding: 0 0 0px 21%;
	box-sizing: border-box;
}

#topmenu:after {
	display: block;
	clear: both;
	content: '';
}

#topmenu>li,
#topmenu>li:nth-child(2),
#topmenu>li:nth-child(6) {
	width: 15%;
	float: left;
}

#topmenu>li.menu4 {
	width: 22%;
}

#topmenu>li.last {
	display: none;
}

#topmenu>li>a {
	display: block;
	z-index: 97;
	font-size: 22px;
	font-weight: 600;
	line-height: 102px;
	text-align: center;
	text-decoration: none;
}

#topmenu li a[target="_blank"]:after {
	display: inline-block;
	margin: 44px 0 0 10px;
	width: 10px;
	height: 10px;
	vertical-align: top;
	background: url(/images/common/ico_blank.png) no-repeat;
	content: '';
}

#topmenu>li:hover>a,
#topmenu>li>a:hover,
#topmenu>li>a:active,
#topmenu>li>a:focus,
#topmenu>li.current_on>a {
	color: #04a09d;
}

#topmenu>li>a span {
	padding: 0 0px 6px;
}

#topmenu .menu {
	display: none;
	padding: 37px 0% 61px 33%;
	position: absolute;
	top: 103px;
	left: 0;
	z-index: 96;
	width: 100%;
	min-height: 350px;
	background: #fff;
	box-sizing: border-box;
}

#topmenu .menu:before {
	margin: 0 323px 0 0;
	position: absolute;
	top: 0;
	right: 50%;
	width: 647px;
	height: 100%;
	background: url(/images/common/bg_menu1.jpg) no-repeat;
	background-size: cover;
	content: '';
}

#topmenu .menu .tit {
	position: absolute;
	top: 107px;
	left: -12%;
	color: #fff;
}

#topmenu .menu .tit:before {
	position: absolute;
	top: -72px;
	left: -149px;
	width: 170px;
	height: 104px;
	background: url(/images/common/bg_menu2.png) no-repeat top right;
	content: '';
}

#topmenu .menu>ul {
	display: flex;
	flex-wrap: wrap;
}

#topmenu .menu>ul>li {
	margin-right: 25px;
	width: calc((100% - 60px) /3);
}

#topmenu .menu>ul>li+li {
	margin-left: 0;
}

#topmenu .menu>ul>li+li:nth-child(5) {
	margin-right: 25px;
}

#topmenu .menu>ul>li+li:nth-child(9) {
	margin: 0;
}

#topmenu .menu>ul>li:nth-child(3n) {
	margin-right: 0;
}

#topmenu .menu>ul>li>a {
	display: block;
	padding: 10px 20px 10px 25px;
	border: 2px solid #ececec;
	position: relative;
	font-size: 18px;
	font-weight: 900;
	text-decoration: none;
	word-break: keep-all;
	box-sizing: border-box;
}

#topmenu .menu>ul>li>a:after {
	border-top: 1px solid #282e4f;
	border-left: 1px solid #282e4f;
	position: absolute;
	top: 13px;
	right: 19px;
	width: 7px;
	height: 7px;
	content: '';
	transform: rotate(-135deg);
}

#topmenu .menu>ul>li>a[target="_blank"]:after {
	right: 20px !important;
}

#topmenu .menu ul li a[target="_blank"]:after {
	margin: 0;
	border: none;
	position: absolute;
	top: 50%;
	right: 0;
	width: 13px;
	height: 13px;
	background: url(/images/common/ico_blank2.gif) no-repeat top center;
	transform: translateY(-50%);
}

#topmenu .menu>ul>li>a:hover,
#topmenu .menu>ul>li>a:active,
#topmenu .menu>ul>li>a:focus,
#topmenu .menu>ul>li.current_on>a {
	border-color: #252b4c;
}

#topmenu .menu ul li ul {
	padding: 17px 22px 6px 25px;
	background: #f8f8f8;
	box-sizing: border-box;
}

#topmenu .menu ul li ul li {
	padding: 0 0 11px 17px;
	position: relative;
	box-sizing: border-box;
}

#topmenu .menu ul li ul li:before {
	position: absolute;
	top: 6px;
	left: 0;
	width: 8px;
	height: 4px;
	background: #c9c9c9;
	content: '';
}

#topmenu .menu ul li ul li a {
	display: block;
	font-size: 15px;
	font-weight: 400;
}

#topmenu .menu ul li ul li a:hover,
#topmenu .menu ul li ul li a:active,
#topmenu .menu ul li ul li a:focus {
	font-weight: 900;
	color: #00001d;
}

#topmenu .menu ul li ul li:hover:before,
#topmenu .menu ul li ul li:active:before,
#topmenu .menu ul li ul li:focus:before {
	background: #7c8094;
}

#topmenu .menu ul li ul li ul {
	display: none !important;
}

.m_menu .logo strong {
	color: #acacaf;
}

.m_menu .logo span>span {
	color: rgba(255, 255, 255, 0.5);
}

/* 하단*/
#footer {
	position: relative;
	line-height: 160%;
}

#footer .info {
	position: relative;
	background: #2d2f3a;
	font-size: 15px;
	font-weight: 100;
	color: #a0a4b0;
}

#footer .info .inner {
	padding: 50px 0 50px 260px;
}

#footer .logo {
	margin: 0;
	top: 49px;
	left: 0;
}

#footer .logo * {
	color: #acacaf;
}

#footer .logo span>span {
	font-size: 18px;
	font-weight: 900;
}

#footer .logo strong {
	font-size: 28px;
	font-weight: 900;
}

#footer address {
	font-size: 16px;
}

#footer .copyright {
	font-size: 14px;
}

#footer #topBtn {
	position: absolute;
	top: -33px;
	right: 12%;
	z-index: 2;
	width: 66px;
	height: 66px;
	background-color: #ef545f;
	transition: .3s;
	border-radius: 100%;
}

#footer #topBtn a {
	margin: 0 auto;
	border: 1px dashed #fff;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 53px;
	height: 53px;
	color: #fff;
	text-align: center;
	transition: .3s;
	border-radius: 100%;
	transform: translate(-50%, -50%);
}

#footer #topBtn i img {
	transition: .3s;
}

#footer #topBtn p {
	line-height: 1.2;
}

#footer #topBtn:hover {
	box-shadow: inset 0px 0px 0px 6px #c51d29;
	transition: .3s;
}

#footer #topBtn:hover a {
	border: 1px solid #fff;
	transition: .3s;
}

#footer #topBtn:hover i img {
	transition: .3s;
	transform: translateY(-3px);
}


/* 컨텐츠 페이지 */
#container_sub {
	background: url(/images/ch/layout/street_btm.png) no-repeat bottom -18px right 0px;
	background-size: contain;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

#container_sub:before {
	content: '';
	display: inline-block;
	width: 973px;
	height: 360px;
	background: url(/images/ch/layout/line_left.png) no-repeat left;
	background-size: contain;
	position: absolute;
	top: 36rem;
	left: 0;
}

#container_sub:after {
	content: '';
	display: inline-block;
	width: 305px;
	height: 275px;
	background: url(/images/ch/layout/line_right.png) no-repeat right;
	background-size: contain;
	position: absolute;
	top: 35rem;
	right: 0;
}


@media screen and (max-width: 1680px) {
	#container_sub:before {
		width: 700px;
	}

	#container_sub:after {
		width: 240px;
		z-index: -1;
	}
}

@media screen and (max-width: 1440px) {
	#container_sub:before {
		top: 9rem;
	}

	#container_sub:after {
		top: 51rem;
	}
}

@media screen and (max-width: 768px) {
	#container_sub:before {
		width: 368px;
		top: 10rem;
		height: 250px;
	}

	#container_sub:after {
		width: 200px;
		top: 25rem;
	}
}

@media screen and (max-width: 568px) {
	#container_sub:before {
		width: 440px;
		top: 5rem;
		height: 260px;
	}

	#container_sub:after {
		width: 165px;
		top: 22rem;
	}
}





/*
서브 레이아웃
*/
#subVisual {
	background: #fff url(/images/ch/layout/ch_subvisual.jpg) no-repeat center;
	text-align: center;
	height: 250px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
}

#subVisual h3 {
	padding: 0;
	font-family: 'gmarket';
	font-size: 36px;
	color: #222;
	font-weight: 900;
}

#subVisual h3:after {
	display: none;
}

#subContent {
	margin: 115px auto 0;
	padding: 0 0 9.4em;
	position: relative;
	max-width: 1200px;
	background: transparent;
	box-sizing: border-box;
}

#subContent:before {
	margin: 0 -360px 0 0;
	position: absolute;
	top: 92px;
	right: 0;
	width: 360px;
	height: 100px;
	background: #fff;
	content: '';
	display: none;
}

#subContent:after {
	display: block;
	clear: both;
	content: '';
}

/* 서브메뉴 */
#submenu {
	width: 21.42%;
	float: left;
}

#submenu .sm_tit {
	display: table;
	margin: 0 0 13px;
	padding: 70px 0 0;
	box-shadow: none;
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 188px;
	background: transparent url(/images/ch/layout/snb_bg.png) center no-repeat;
	color: #222;
	text-align: center;
	box-sizing: border-box;
	border-radius: 10px 0 10px 0;
}

#submenu .sm_tit:after {
	width: 50%;
	height: 50%;
	background: url(/images/ch/layout/snb_tit_Bg.png) center no-repeat;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: inline-block;
	content: '';
}

#submenu .sm_tit h2 {
	display: table-cell;
	font-size: 29px;
	font-weight: 900;
	line-height: 120%;
	font-family: 'gmarket';
	position: relative;
	z-index: 2;
	word-break: keep-all;
	padding: 0 10px;
}

#submenu .depth2 {
	background-color: #fff;
	border: 1px solid #e5e5e5;
	border-radius: 30px;
	box-shadow: 0px 3px 11px rgba(183, 183, 183);
}

#submenu .depth2>li {
	/* border-bottom: 1px solid #dddddd; */
	position: relative;
}

#submenu .depth2>li:before{
	width: calc(100% - 42px);
	height: 1px;
	content: '';
	display: inline-block;
	position: absolute;
	background-color: #dddddd;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}

#submenu .depth2>li:last-child {
	margin-bottom: 53px;
}

#submenu .depth2>li>a {
	display: block;
	margin: 0;
	padding: 0 0 0 22px;
	border: none;
	box-shadow: none;
	position: relative;
	height: 60px;
	background: url(/images/ch/layout/ico_off.png) no-repeat top 20px right 20px;
	font-size: 17px;
	font-weight: 400;
	line-height: 58px;
	text-decoration: none;
	box-sizing: border-box;
	border-radius: 0px;
	color: #555555;
	line-height: 60px;
	transition: .3s;
}

#submenu .depth2>li>a p {
	position: relative;
	width: auto;
	z-index: 3;
	overflow: hidden;
	display: table;
	padding-right: 2px;
}

#submenu .depth2>li>a p::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 20px;
	width: 0;
	height: 12px;
	background-color: #ffc8d5;
	z-index: -1;
	transition: width 0.3s ease;
	/* 좌→우로 확장 */
}

#submenu .depth2>li:hover>a p::after,
#submenu .depth2>li>a:hover p::after,
#submenu .depth2>li>a:focus p::after,
#submenu .depth2>li>a:active p::after,
#submenu .depth2>li.current_on>a p::after {
	width: 100%;
}

#submenu .depth2>li>a[target="_blank"] span:after {
	display: inline-block;
	margin: -3px 0 0 8px;
	width: 10px;
	height: 10px;
	vertical-align: middle;
	background: url(/images/common/ico_blank.png) no-repeat;
	content: '';
}

#submenu .depth2>li:hover>a,
#submenu .depth2>li>a:hover,
#submenu .depth2>li>a:focus,
#submenu .depth2>li>a:active,
#submenu .depth2>li.current_on>a {
	border-color: transparent;
	background-color: #fff;
	font-weight: 900;
	color: #222;
	background: none;
	background: url(/images/ch/layout/ico_on.png) no-repeat top 20px right 20px;
	line-height: 63px;
	transition: .3s;
}

#submenu .depth2 li ul {
	display: none;
	padding: 17px 0 17px 21px;
	position: relative;
	background: #f7f7f7;
	border-radius: 0 0 5px 5px;
}

#submenu .depth2 li ul:before {
	border: 2px solid #81cfce;
	border-top: none;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: calc(100% + 2px);
	content: '';
	border-radius: 0 0 5px 5px;
}

#submenu .depth2 li ul li a {
	display: block;
	padding: 0.4em 0 0.4em 19px;
	position: relative;
	font-size: 100%;
	line-height: 100%;
	color: #555;
}

#submenu .depth2 li ul li a:before {
	display: block;
	position: absolute;
	top: 11px;
	left: 0;
	width: 10px;
	height: 5px;
	background: #788a8a;
	content: '';
}

#submenu .depth2 li ul li a:hover,
#submenu .depth2 li ul li a:focus,
#submenu .depth2 li ul li a:active,
#submenu .depth2 li ul li.current_on a {
	font-weight: 900;
	color: #037e7c;
}

#submenu .depth2 li ul li a:hover:before,
#submenu .depth2 li ul li a:focus:before,
#submenu .depth2 li ul li.current_on a:before {
	background: #037e7c;
}

/* 컨텐츠 */
#subContent #content {
	padding: 0 0px 0 0;
	width: 72.3%;
	float: right;
	box-sizing: border-box;
}

#pageInfo {
	padding: 12px 0 27px;
	background: none;
}

#pageInfo:after {
	display: block;
	clear: both;
	content: '';
}

.location {
	padding: 0px 0 0;
	float: left;
	display: flex;
	align-items: center;
}

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

.location>* {
	display: block;
	float: left;
}

.location .home {
	width: 32px;
	height: 32px;
	background: url(/images/ch/layout/ico_home.png) no-repeat center;
	font-size: 0;
	text-indent: -999px;
	box-shadow: 0 0 30px rgba(51, 51, 51, 0.05);
}

.location span {
	font-family: 'Noto Sans KR';
	font-size: 18px;
	color: #222;
}

.location span:before {
	display: inline-block;
	margin: 8px 12px 0 12px;
	border-top: 1px solid #a2a2a2;
	border-right: 1px solid #a2a2a2;
	width: 5px;
	height: 5px;
	vertical-align: top;
	content: '';
	transform: rotate(45deg);
}

.location span.end {
	font-weight: 900;
}

#subVisual .btn_copy {
	position: absolute;
	right: 22rem;
	font-size: 0;
	border-radius: 100%;
	height: 50px;
	width: 50px;
	top: 5rem;
	background: #fff url(/images/ch/layout/ico_link.png) center no-repeat;
	background-size: 17px;
	box-shadow: 0 0 10px rgba(51, 51, 51, 0.1);
	transition: .3s;
}

#subVisual .btn_copy:hover {
	box-shadow: 0 0 10px rgba(51, 51, 51, 0.5);
	transition: .3s;
}

.util_wrap {
	float: right;
}

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

.util_wrap button,
.util_wrap a {
	margin: 0 0 0 5px;
	border: 1px solid #e3e3e3;
	width: 46px;
	height: 46px;
	float: left;
	background: #fff url(/images/kr/common/ico_util.png) no-repeat top 14px center;
	font-size: 0;
	text-indent: -999px;
	transition: 0.3s;
	box-sizing: border-box;
	border-radius: 10px;
}

.util_wrap a {
	background-position: top -33px center;
}

.util_wrap .btn_copy {
	background-position: bottom 13px center;
}

.util_wrap button:hover,
.util_wrap button:focus,
.util_wrap button:active,
.util_wrap a:hover,
.util_wrap a:focus,
.util_wrap a:active {
	border-color: #252b4c;
}

.share_sns {
	position: relative;
	float: left;
}

.share_sns div {
	padding: 15px 0 10px;
	box-shadow: 0 0 13px rgba(0, 0, 0, 0.1);
	position: absolute;
	top: 60px;
	left: 0;
	z-index: 1;
	width: 115px;
	visibility: hidden;
	background: #fff;
	text-align: center;
	transition: 0.25s ease-in-out;
	opacity: 0;
	border-radius: 10px;
}

.share_sns.on div {
	top: 55px;
	visibility: visible;
	opacity: 1;
}

.share_sns div li {
	display: inline-block;
	margin: 0 0 5px;
	vertical-align: top;
}

.share_sns div ul li a {
	display: block;
	border: none;
	width: 40px;
	height: 40px;
	background: #3752b7 url(/images/common/ico_sns.png) no-repeat 15px 11px;
	border-radius: 5px
}

.share_sns .tw {
	background-color: #1cbbdf;
	background-position: -23px 12px;
}

.share_sns .bl {
	background-color: #24be00;
	background-position: -59px 11px;
}

.share_sns .kko {
	background-color: #f7b331;
	background-position: -137px 12px;
}

.share_sns .insta {
	background-color: #c536a4;
	background-position: -97px 10px;
}

#sub_default {
	padding: 26px 0 0;
}

@media all and (max-width:1750px) {

	#top .inner,
	#header .inner,
	#menuArea .inner {
		width: 100%;
	}

	#top .global>li>a,
	#top .global>li.list>a {
		padding: 0 16px;
	}

	.logo {
		left: 15px;
	}

	.btn_search {
		margin: 0;
		right: 61px;
	}

	#topmenu {
		padding: 0 10% 0 18%;
	}

	#topmenu .menu {
		padding: 37px 10% 0 25%;
	}

	#topmenu .menu:before {
		margin: 0;
		right: auto;
		left: 0;
		width: 300px;
	}

	#topmenu .menu .tit {
		left: 15px;
	}

	#topmenu .menu .tit:before {
		top: -80px;
		left: 115px;
		background-size: 100px;
		transform: rotate(-180deg);
	}
}

@media all and (max-width:1400px) {
	img {
		max-width: 100%;
	}

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

	.w {
		display: none;
	}

	#header {
		border-bottom: initial !important;;
		border-bottom-color: #fff !important;
		height: 70px !important;
	}

	#header .logo {
		top: 13px !important;
	}

	.logo img {
		height: 43px;
	}


	#top {
		height: 34px;
	}

	#top .btn_global {
		padding: 0 10px 0 25px;
		position: relative;
		width: 150px;
		height: 34px;
		background: #09275d;
		font-size: 14px;
		line-height: 34px;
		color: #fff;
		box-sizing: border-box;
	}

	#top .btn_global:before {
		margin: -6px 0 0;
		position: absolute;
		top: 50%;
		left: 13px;
		width: 12px;
		height: 12px;
		background: url(/images/common/ico_more.png) no-repeat;
		content: '';
	}

	#top .btn_global:after {
		display: inline-block;
		margin: -2px 0 0 15px;
		border-top: 6px solid #fff;
		border-right: 5px solid transparent;
		border-left: 5px solid transparent;
		vertical-align: middle;
		transition: 0.3s ease;
		content: '';
	}

	#top .btn_global.on:after {
		transform: rotate(180deg);
	}

	#top .global {
		box-shadow: 0 5px 5px rgba(0, 0, 0, 0.15);
		position: absolute;
		top: 20px;
		left: 15px;
		z-index: 99;
		width: 150px;
		visibility: hidden;
		background: #fff;
		font-size: 14px;
		transition: 0.3s ease;
		opacity: 0;
	}

	#top .btn_global.on+.global {
		top: 34px;
		visibility: visible;
		opacity: 1;
	}

	#top .global>li {
		border: 1px solid #ddd;
		border-top: none;
		width: 100%;
		box-sizing: border-box;
	}

	#top .global>li+li {
		margin: 0;
	}

	#top .global>li>a {
		padding: 0 !important;
		height: 34px;
		background: #fff;
		line-height: 34px;
		color: #555;
		text-align: center;
	}

	#top .global>li.current>a {
		font-weight: 400;
		color: #555;
	}

	#top .global a[target="_blank"]:after,
	#top .global>li:first-child>a:after {
		display: inline-block;
		margin: 12px 0 0 6px;
		width: 10px;
		height: 10px;
		vertical-align: top;
		background: url(/images/common/ico_blank.png) no-repeat;
		content: '';
	}

	#top .global>li.list>a:after {
		margin: 0 0 0 6px;
		border-top-color: #555;
	}

	#top .global>li>a.on {
		background-color: #f7f7f7;
	}

	#top .global li div {
		padding: 0 5px;
		box-shadow: 3px -3px 10px rgba(0, 0, 0, 0.12);
		top: -1px;
		left: 100%;
		border-radius: 0 4px 4px 0;
	}

	#top .global .list div {
		width: 300px;
	}

	#top .global li div a {
		height: 34px;
		line-height: 34px;
	}

	#topmenu .menu:before {
		width: 250px;
	}

	.btn_menu {
		display: block;
		top: 18px;
		right: 15px;
	}

	.btn_search {
		top: 48px;
	}

	.btn_search:before {
		width: 22px;
		height: 22px;
	}

	.btn_search:after {
		top: 24px;
		left: 20px;
		width: 10px;
	}

	#search .inner {
		width: 75%;
	}

	#search fieldset {
		padding: 100px 0;
		font-size: 17px;
	}

	#search .in_txt {
		margin: 0 0 30px;
	}

	#search h2 {
		padding: 0 0 12px;
		font-size: 28px;
	}

	#search input[type="text"] {
		padding: 0 0 0 25px;
		height: 90px;
		font-size: 32px;
		line-height: 90px;
	}

	#search .btn_submit {
		width: 90px;
		height: 90px;
		background-position: 17px 25px;
		background-size: auto 40px;
	}

	#search .btn_close {
		top: 55px;
		right: 20px;
	}

	/* 모바일 메뉴 */
	.m_menu .menu .tit {
		display: none !important;
	}

	.m_menu {
		box-shadow: 0 5px 10px rgba(0, 0, 0, 0.7);
		overflow-y: auto;
		position: fixed;
		top: 0;
		right: -120%;
		z-index: 99;
		width: 60%;
		height: 100%;
		background: #2a5daa;
		transition: 0.5s ease-in-out;
	}

	.m_menu.on {
		right: 0;
	}

	.m_menu .m_top {
		position: relative;
		height: 100px;
		background: #242e39;
	}

	.m_menu .logo {
		position: absolute;
		top: 28px !important;
		left: 2%;
		width: 98%;
		text-align: left;
		transform: none;
	}

	.m_menu .logo a {
		color: #fff;
	}

	.m_menu>ul {
		width: 38.3%;
		height: auto;
		background: rgb(47, 162, 171);
		background: -moz-linear-gradient(145deg, rgba(47, 162, 171, 1) 0%, rgba(44, 121, 171, 1) 50%, rgba(42, 93, 170, 1) 100%);
		background: -webkit-linear-gradient(145deg, rgba(47, 162, 171, 1) 0%, rgba(44, 121, 171, 1) 50%, rgba(42, 93, 170, 1) 100%);
		background: linear-gradient(145deg, rgba(47, 162, 171, 1) 0%, rgba(44, 121, 171, 1) 50%, rgba(42, 93, 170, 1) 100%);
		box-sizing: border-box;
	}

	.m_menu>ul a {
		display: block;
		text-decoration: none;
		cursor: pointer;
	}

	.m_menu>ul>li {
		border-bottom: 1px solid rgba(0, 0, 0, 0.15);
	}

	.m_menu>ul>li>a {
		padding: 0 0 0 1em;
		height: 65px;
		font-size: 20px;
		font-weight: 100;
		line-height: 65px;
		color: #fff;
	}

	.m_menu>ul>li.current_on>a,
	.m_menu>ul>li>.on {
		background: #fff;
		font-weight: 800;
		color: #222;
	}

	.m_menu>ul>li>div {
		display: none;
		padding: 0 20px;
		position: absolute;
		top: 100px;
		left: 38.3%;
		width: 61.7%;
		height: calc(100% - 100px);
		background: #fff;
		box-sizing: border-box;
	}

	.m_menu>ul>li.current_on div,
	.m_menu>ul>li .on+div {
		display: block !important;
	}

	.m_menu>ul>li>div>ul>li>a {
		padding: 0 0 0 30px;
		border-bottom: 1px solid #eee;
		position: relative;
		height: 65px;
		background: url(/images/common/img_a_menu1.png) no-repeat top 26px left;
		font-size: 18px;
		line-height: 65px;
		color: #444;
		box-sizing: border-box;
	}

	.m_menu>ul>li>div>ul>li a[target="_blank"]:after {
		display: inline-block;
		margin: -2px 0 0 10px;
		width: 10px;
		height: 10px;
		vertical-align: middle;
		background: url(/images/common/ico_blank.png) no-repeat;
		content: '';
	}

	.m_menu>ul>li>div>ul>li>ul {
		margin: -1px 0 0;
		padding: 12px 0 5px 15px;
		border-top: 1px solid #2b425b;
		border-bottom: 1px solid #eee;
		overflow: hidden;
		position: relative;
		width: 100%;
		background: #f7f7f7;
		box-sizing: border-box;
	}

	.m_menu>ul>li>div>ul>li>ul li a {
		padding: 0 0 7px 12px;
		position: relative;
	}

	.m_menu>ul>li>div>ul>li>ul li a:before {
		position: absolute;
		top: 7px;
		left: 0;
		width: 3px;
		height: 3px;
		background: #2b425b;
		content: '';
		border-radius: 50%;
	}

	#subVisual h3 {
		padding: 35px 0;
		font-size: 28px;
	}

	#subVisual h3:after {
		margin: -3px 0 0 10px;
		width: 15px;
	}

	#subVisual .btn_copy {
		right: 20px;
	}

	#subContent {
		margin: 0 auto;
	}

	#pageInfo {
		padding: 15px 0 30px;
	}

	#subContent #content {
		width: 100%;
	}

	#footer .info .inner {
		padding: 50px 16px 50px 260px;
	}

	#footer #topBtn {
		top: -27px;
		right: 32px;
		width: 60px;
		height: 60px;
	}

	#footer #topBtn a {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		width: 49px;
		height: 49px;
	}

	#footer #topBtn p {
		font-size: 14px;
		line-height: 1;
	}
}


@media all and (max-width:1230px) {
	.inner {
		padding-right: 15px;
		padding-left: 15px;
		width: 100%;
	}

	#font_control {
		display: none;
	}

	#search .btn_close {
		margin: 0;
		right: 50px;
	}

	#subContent {
		padding: 0 15px 4em;
		width: 100%;
	}

	#subContent:before {
		display: none;
	}

	#subContent #content {
		padding: 0;
	}

	#footer .logo {
		left: 15px;
	}
}


@media all and (max-width:768px) {
	.inner {
		padding-right: 10px;
		padding-left: 10px;
	}

	#header {
		height: 55px !important;
	}

	#top {
		height: 30px;
	}

	#top .btn_global {
		height: 30px;
		font-size: 13px;
		line-height: 30px;
	}

	#top .btn_global.on+.global {
		top: 30px;
	}

	#top .global {
		left: 10px;
	}

	#top .global>li>a {
		font-size: 13px;
	}

	#top .global>li>a[target="_blank"]:after {
		margin-top: 12px;
	}

	#top .global .list div {
		width: 240px;
	}

	#header .logo {
		top: 10px !important;
		left: 10px;
	}

	.logo img {
		margin: 0 1px 0 0;
		height: 35px;
	}

	.logo strong {
		padding: 2px 0;
		font-size: 20px;
	}

	.logo span>span {
		font-size: 8px;
	}

	.btn_search {
		top: 37px;
		right: 59px;
	}

	.btn_search:before {
		top: 6px;
		left: 6px;
		width: 20px;
		height: 20px;
	}

	#search fieldset {
		padding: 70px 0 50px;
		font-size: 16px;
	}

	#search h2 {
		padding: 0 0 9px;
		font-size: 24px;
	}

	#search input[type="text"] {
		padding: 0 0 0 20px;
		height: 70px;
		font-size: 25px;
		line-height: 70px;
	}

	#search .btn_submit {
		width: 70px;
		height: 70px;
		background-position: 13px 19px;
		background-size: auto 30px;
	}

	#search .btn_close {
		top: 15px;
	}

	#search li {
		margin: 0 0 7px;
	}

	#search li:before {
		top: 6px;
	}

	.btn_menu {
		padding: 0 5px;
		top: 11px;
		right: 10px;
		width: 33px;
		height: 33px;
	}

	.btn_menu_close {
		top: 25px;
		width: 34px;
		height: 34px;
	}

	.btn_menu_close .bar {
		top: 16px;
		left: 4px;
	}

	.m_menu .m_top {
		height: 85px;
	}

	.m_menu .logo {
		top: 23px !important;
	}

	.m_menu .logo strong {
		font-size: 22px;
	}

	.m_menu .logo span>span {
		font-size: 15px;
	}

	.m_menu>ul>li>a {
		padding: 0 0 0 0.7em;
		height: 50px;
		font-size: 16px;
		line-height: 50px;
	}

	.m_menu>ul>li>div {
		padding: 0 10px;
		top: 85px;
	}

	.m_menu>ul>li>div>ul>li>a {
		padding: 0 0 0 20px;
		height: 50px;
		background-position: top 21px left;
		background-size: 13px;
		font-size: 15px;
		line-height: 50px;
	}

	.m_menu>ul>li>div>ul>li>ul li a {
		padding: 0 0 5px 10px;
		font-size: 14px;
	}

	.linksite>ul>li {
		border-bottom: 1px solid rgba(255, 255, 255, 0.2);
		border-right: 1px solid rgba(255, 255, 255, 0.2);
		width: 100%;
	}

	.linksite>ul>li:last-child {
		border-bottom: none;
	}

	.linksite>ul>li>a {
		height: 45px;
		font-size: 0.938em;
		line-height: 45px;
	}

	.linksite li div {
		bottom: 45px;
	}

	.linksite li div ul {
		padding: 16px 17px 19px 17px;
	}

	.linksite li div:before {
		width: 75px;
		height: 70px;
		background-size: 110px;
	}

	#footer {
		line-height: 120%;
	}

	#footer .info {
		font-size: 0.875em;
		text-align: center;
	}

	#footer .info .inner {
		padding: 45px 10px 25px;
	}

	#footer .info address span {
		display: block;
	}

	#footer .logo {
		display: inline-block;
		margin: 0 auto 20px;
		position: static;
		text-align: left;
	}

	#footer .link {
		padding: 0 0 10px;
		font-size: 1.063em;
	}

	#footer .link a[target="_blank"]:after {
		margin-top: 2px;
	}

	#subVisual {
		height: 165px;
		background-size: cover;
	}

	#subVisual h3 {
		font-size: 26px;
		padding: 0;
	}

	#subVisual .btn_copy {
		top: 50%;
		right: 20px;
		transform: translateY(-50%);
	}

	#subContent {
		padding-right: 10px;
		padding-left: 10px;
	}
}

@media all and (max-width:568px) {
	#top .global li div {
		padding: 0 5px;
	}

	.logo strong {
		padding: 3px 0 2px;
		font-size: 19px;
	}

	.btn_search {
		right: 50px;
	}

	#search .inner {
		width: 80%;
	}

	#search fieldset {
		padding: 65px 0 40px;
		font-size: 14px;
	}

	#search h2 {
		font-size: 20px;
	}

	#search .in_txt {
		margin: 0 0 25px;
	}

	#search input[type="text"] {
		padding: 0 0 0 15px;
		height: 60px;
		font-size: 21px;
		line-height: 60px;
	}

	#search .btn_submit {
		width: 60px;
		height: 60px;
		background-position: 13px 17px;
		background-size: auto 25px;
	}

	#search li:before {
		top: 5px;
	}

	#top .global>li>a[target="_blank"]:after {
		margin-top: 11px;
	}

	.m_menu {
		width: 88%;
	}

	.m_menu>ul>li>div>ul>li>ul li a:before {
		top: 5px;
	}

	#footer .link li {
		padding: 0 10px;
	}

	#footer .link a[target="_blank"]:after {
		margin-top: 1px;
	}

	#footer address {
		font-size: 14px;
	}

	#footer .copyright {
		font-size: 12px;
	}

	#footer #topBtn {
		right: 32px;
	}

	#footer #topBtn {
		top: -19px;
		right: 16px;
		width: 48px;
		height: 48px;
	}

	#footer #topBtn a {
		width: 37px;
		height: 37px;
	}

	#footer #topBtn i {
		display: block;
		margin: 0 auto;
		width: 12px;
	}

	#footer #topBtn p {
		font-size: 12px;
		line-height: 1;
	}

	#subVisual {
		height: 190px;
		background: url(/images/ch/layout/ch_subvisualMB.jpg) center no-repeat;
	}

	#subVisual h3 {
		font-size: 22px;
		padding: 0;
	}

	#subVisual h3:after {
		margin: 0 0 0 5px;
		width: 10px;
	}

	#subVisual .btn_copy {
		width: 38px;
		height: 38px;
		top: 4rem;
	}

	.location {
		padding: 15px 0 0;
	}

	.location .home {
		margin: -3px 0 0;
	}

	.location span {
		font-size: 14px;
	}

	.location span:before {
		margin: 4px 7px 0 6px;
	}

	.util_wrap button,
	.util_wrap a {
		margin: 0 0 0 3px;
		width: 35px;
		height: 35px;
		background-position: top 10px center;
		background-size: 15px;
	}

	.util_wrap a {
		display: none;
		background-position: top -25px center;
	}

	.util_wrap button.btn_copy {
		background-position: bottom 10px center;
	}

	.share_sns div {
		padding: 8px 0 5px;
		width: 85px;
	}

	.share_sns.on div {
		top: 39px;
	}

	.share_sns div li {
		margin: 0 0 2px;
	}

	.share_sns div ul li a {
		width: 30px;
		height: 30px;
		background-position: 10px 7px;
	}

	.share_sns .tw {
		background-position: -27px 8px;
	}

	.share_sns .bl {
		background-position: -64px 7px;
	}

	.share_sns .kko {
		background-position: -142px 7px;
	}

	.share_sns .ins {
		background-position: -103px 6px;
	}

	#pageInfo {
		padding: 10px 0 20px;
		background-size: 5px;
	}
}

@media all and (max-width:380px) {

	#top .btn_global,
	#top .global>li>a {
		font-size: 12px;
	}

	#top .btn_global,
	#top .global {
		width: 125px !important;
	}

	#top .btn_global:before {
		left: 10px;
	}

	#top .global>li>a {
		height: 33px;
		line-height: 33px;
	}

	#top .global li div {
		padding: 0 3px;
	}

	#top .global li div a {
		height: 33px;
		line-height: 33px;
	}

	#top .global .list div {
		width: 180px;
	}

	#search .inner {
		width: 85%;
	}

	#search fieldset {
		padding: 60px 0 35px;
		font-size: 13px;
	}

	#search h2 {
		font-size: 19px;
	}

	#search input[type="text"] {
		padding: 0 0 0 12px;
		height: 55px;
		font-size: 18px;
		line-height: 55px;
	}

	#search .btn_submit {
		width: 55px;
		height: 55px;
		background-position: 13px 15px;
		background-size: auto 22px;
	}

	.m_menu>ul>li>div>ul>li>a {
		font-size: 14px;
	}

	.m_menu>ul>li>div>ul>li>ul li a {
		font-size: 13px;
	}

	.location span {
		font-size: 13px;
	}

	#sub_default {
		padding: 20px 0 0 0;
	}
}