html:after {display: none !important;}
/* common */
html,body { background: #fff; min-width: 360px; letter-spacing: -0.025em;}
.set {position: relative; display: block; width: 100%; height: auto;}
.set1 {position: relative; display: block; width: 100%; height: auto; max-width: 1220px; margin: 0 auto; padding: 0 10px;}

.flex {display: flex;}
/*수직정렬*/
.vertical_left {align-items: flex-start;}
.vertical_center {align-items: center;}
.vertical_right {align-items: flex-end;}

/*수평정렬*/
.horizontal_left {justify-content: flex-start;}
.horizontal_center {justify-content: center;}
.horizontal_right {justify-content: flex-end;}


#wrap {position: relative; display: block; width: 100%; height: auto;}
#wrap:after {display: block; content: ""; clear: both;}

header {position: relative; display: block; width: 100%; height: auto; background: #fff;}
header:after {display: block; content: ""; clear: both;}

footer {position: relative; display: block; width: 100%; height: auto;}
footer:after {display: block; content: ""; clear: both;}


/* common end */

/* header start*/

header { border-bottom: 1px solid #e9e9e9; z-index: 4;}
.header .top { background-color: #0966cf;}
.header .top>div {height: 30px;}
.header .top a {display: flex; align-items: center; justify-content: center; width: 90px; height: 30px; color: #fff;font-weight: 400; font-size: 13px; line-height: 1;}
.header .top a.a1 {background-color: rgb(57, 196, 35);}
.header .top a.a2 {background-color: #062c58;}
.header .top a img {margin-right: 9px;}
.header_con {height: 90px;}
.header_con .logo {float: left;}
.header_con .right {width: calc(100% - 130px); float: right;}

.header_con a {}



.header_con .right a.right_btn {margin-left: 10px;}
.header_con .right a.right_btn.sitemap_btn {display: block; margin-top: 2px;}
.header_con .right a.right_btn.mobile_btn {display: none;}

.main_nav {position: relative; display: block; width: auto; display: flex; justify-content: flex-end; align-items: center;}

.main_nav>li {position: relative; width: auto; height: auto;}
.main_nav>li+li {margin-left: 56px;}
.main_nav>li>a {position: relative; width: 100%; height: 90px; display: flex; justify-content:center; align-items: center; font-size: 18px; color: #222; font-weight: 400;}
.main_nav>li>a:hover {font-weight: 500;}
.main_nav>li>a.current {font-weight: 500;}
.main_nav>li.current>a {font-weight: 500;}
.main_nav>li.active>a {font-weight: 500;}
.main_nav>li.dot {display: block; width: 4px; height: 4px; border-radius: 100%; background: #cdd3dc;}

.main_nav>li ul.sub {display: none; position: absolute; left: 50%; transform: translateX(-50%); width: 200px; /* top:80px; */ margin-top: -10px; border-top: 0; padding-top: 11px; /* background-image: url(/images/common/navi_tri.png); */ background-repeat: no-repeat; background-position:center top 10px; transition: background 0.2s; z-index: 1;}
.main_nav>li:hover ul.sub  {background-position:center top 0;}

.main_nav>li ul.sub li {position: relative; display: block; height: 52px; width: 100%; border-bottom: 1px solid rgba(255,255,255,0.2);}
.main_nav>li ul.sub li:last-child {border-bottom: 0;}
.main_nav>li ul.sub li>a {display: flex; justify-content:center; align-items: center; background: rgba(0,0,0,0.7); height: 100%; line-height: 120%; color: #bbbbbb; font-size: 16px; font-weight: 400;}
.main_nav>li ul.sub li:hover>a {color: #fff; font-weight: 700;}
.main_nav>li ul.sub li.current>a {color: #fff; font-weight: 700;}
.main_nav>li ul.sub li.on>a {color: #fff; font-weight: 700;}

.main_nav>li ul.sub li.hideCate {display: none;}

@media all and (max-width: 767px) {
	.main_nav {display: none;}
	.header_con .right a.right_btn.sitemap_btn {display: none}
	.header_con .right a.right_btn.mobile_btn {display: block; margin-right: 10px}
	
	.header .top>div {height: 30px;}
	.header .top a {font-size: 13px;}
	.header .top a img {margin-right: 5px;}
	.header_con {height: 75px;}
}

/* header end */




/* 모바일  nav */

#header-nav {
	/* display: none; */
	visibility: hidden;
	transition: visibility 0.3s ease-in-out;
}
body.over-hidden {
	/* display: none; */
	 overflow: auto !important;
}

@media all and (max-width: 767px) {
	body.over-hidden #header-nav {
	visibility: visible;
	}
}

.h-nav-bg {
	position: fixed;
	right: 0;
	top: 0;
	display: none;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.4);
	z-index: 1000;
	font-size: 0;
}

.header-nav-inner {
	position: fixed;
	z-index: 99999999999999;
	right: calc(-77% - 43px);
	top: 0;
	width: 77%;
	height: 100%;
	background: #fff;
	transition: right 0.3s;
}

.header-nav-con {
	position: absolute;
	display: block;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	z-index: 4;
}

#header-nav.active .h-nav-bg {
	display: block;
}
#header-nav.active .header-nav-inner {
	right: 0;
}

.header-nav-close {
	position: absolute;
	left: -43px;
	width: 43px;
	height: 43px;
	background-color: #0d2033;
	z-index: 4;
	font-size: 0;
	cursor: pointer;
	background-image: url(/images/common/assets2.png);
	background-size: 650px;
	background-position: left -458px top 10px;
	background-repeat: no-repeat;
}

.header-nav-con .top {
	position: relative;
	display: block;
	width: 100%;
	height: 80px;
	background: #fff;
	
	display: flex;
	align-items: center;
}

.header-nav-con .top .logo {
	cursor: pointer;
	font-size: 0;
	margin: 0 0 0 20px;
	position: relative;
	display: block;
	width: 140px;
	height: auto;
	/* background-image: url(/images/common/logo.png);
	background-size: 100%;
	background-position: left -0 center;
	background-repeat: no-repeat; */
}
.log_in_out {
	font-size: 14px;
	box-sizing: border-box;
	border: 1px solid #7ad8ff;
	padding: 3px 5px;
	box-sizing: border-box;
	color: #0599d7 !important;
	cursor: pointer;
	font-family: Arial,'Nanum Gothic', sans-serif;
	z-index: 10;
	right: 10px;
	position: absolute;
	top:50%;
	transform:translateY(-50%);
}					
.header-nav-sch {
	position: relative;
	display: block;
	width: 100%;
	height: 45px;
	line-height: 45px;
	background: #333333;
}

.header-nav-sch input {
	float: left;
	display: block;
	width: calc(100% - 55px);
	height: 100%;
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	border: 0;
	border-right: 1px solid #111;
	padding-left: 21px;
	color: #fff;
	font-family: Arial,'Nanum Gothic', sans-serif;
}

.header-nav-sch input::placeholder {
  font-size:  14px;
  text-align: left;
  color: #fff;
  line-height: 1;
}
.header-nav-sch input:-ms-input-placeholder {
  font-size:  14px;
  text-align: left;
  color: #fff;
  line-height: 1;
}

.header-nav-sch button {
	float: left;
	display: block;
	width: 55px;
	height: 100%;
	background: transparent;
	padding: 0;
	margin: 0;
	cursor: pointer;
	font-size: 0;
	border: 0;
	background-image: url(/images/common/assets2.png);
	background-size: 375px;
	background-position: left -230px top -35px;
	background-repeat: no-repeat;
}

.h-n-main {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}

.h-n-main .list {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	margin-top: 2px;
}

.h-n-main .list.active span.title>a {
	color: #00b9c1;
}

.h-n-main .list:first-child span.title {
	border-top: 0;
}
.h-n-main .list span.title {
	position: relative;
	display: block;
	width: 100%;
	height: 55px;
	line-height: 54px;
	background: #fff;
	box-sizing: border-box;
	border-bottom: 1px solid #eee;
	font-size: 14px;
	color: #333;
	font-weight: 500;
	padding-left: 21px;
	cursor: pointer;
	
}
.h-n-main .list span.title>a{
	display: block;
	width: 100%;
	height: 100%;
}

.h-n-main .list span.title:after {
	font-family: 'Raleway', sans-serif;
	position: absolute;
	display: block;
	width: 15px;
	height: 15px;
	text-align: center;
	line-height: 15px;
	content: "∨";
	z-index: 5;
	font-size: 0;
	color: #666;
	position:absolute; top:50%; transform:translateY(-50%);
	right: 10px;
	font-weight: bold;
	background: url(/images/common/gnbDownArrow.png)no-repeat center center;
	background-size: 100%;
	}

.h-n-main .list.noarrow span.title:after {
	display: none !important;
}

.h-n-main .list.active span.title:after {
	background: url(/images/common/gnbUpArrow.png)no-repeat center center;
	background-size: 100%;
}

.h-n-main .list ul {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
	transition: height 0.3s;
	overflow-y: hidden;
	font-size: 20px;
	margin-top: 1px;
}

.h-n-main .list ul li {
	transition: height 0.3s;
	height: 0;
	background: #f9f9f9;
	overflow: hidden;
	line-height: 44px;
	box-sizing: border-box;
	border-bottom: 0px solid #ddd;
	color: #333;
	font-size: 15px;
	cursor: pointer;
	font-weight: 400;
}
.h-n-main .list ul li.hideCate {display: none;}
.h-n-main .list ul li.hide {
	width: 0;
	height: 0;
	overflow: hidden;
	position: absolute;
	z-index: -99;
}
.h-n-main .list.active ul li {
	padding: 1px;
	height: 45px;
	border-bottom: 1px solid #eee;
}

.h-n-main .list ul li a {
	font-weight: 400;
	color: #333;
	width: 100%;
	height: 100%;
	display: block;
	
	font-size: 13px;
	padding-left: 21px;
	
	display: flex;
	align-items: center;
	line-height: 1;
}

.h-n-main .list ul li a span {
	/* display: none !important; */
	font-size: 12px;
	letter-spacing: -0.040em;
}

.h-n-main .list ul li.active a {
	font-weight: 600;
	color: #09cfd5;
}


.h-n-main .list.active ul li.on {
	background-color: #f2f2f2;
}
.h-n-main .list.active ul li.on a {
	font-weight: 500;
	color: #3a7add;
}

.h-n-main .list.active ul li.on2 {
	background-color: #f2f2f2;
}
.h-n-main .list.active ul li.on2 a {
	font-weight: 500;
	color: #3a7add;
}

.header-nav-bottom {
	position: relative;
	display: block;
	width: 100%;
	text-align: center;
	box-sizing: border-box;
	padding: 30px 20px;
	background: #fff;
	font-size: 0;
	border-top: 1px solid #ddd;
}

.header-nav-bottom a {
	position: relative;
    display: inline-block;
    width: 40px;
    height: 40px;
    background-image: url(/images/common/fool_sns.png);
    background-repeat: no-repeat;
    background-size: 190px;
    border-radius: 100%;
}

.header-nav-bottom a:nth-child(n+2) {
	margin-left: 10px;
}

.header-nav-bottom a.fb{
    background-position: left 0 top 0;
}
.header-nav-bottom a.ins{
	background-position: left -51px top 0;
}
.header-nav-bottom a.nb{
	background-position: left -100px top 0;
}


@media all and (max-width: 767px) {
	body.over-hidden {
		overflow: hidden !important;
	}
	.header-nav-con .top {
		height: 70px;
	}
	
	/* .header-nav-con .top .logo {
	margin-top: 23px;
	} */
}


@media all and (max-width: 425px) {
	.header-nav-con .top {
		height: 66px;
	}
	
	/* .header-nav-con .top .logo {
	margin-top: 14px;
	} */
}

/* 모바일  nav end */




/* footer start */
footer {background: #f4f4f4; z-index: 2;}
.footer_top {border-bottom: 1px solid #555;}
.footer_top .inner {height: 45px;}
.footer_top .inner .links{height: 100%;}
.footer_top .inner .links a {font-size: 14px;letter-spacing: -0.040em;color: #333333;font-weight: 300;}
.footer_top .inner .links a:hover {color: #333333;}
.footer_top .inner .links .bar {display: block; width: 1px; height: 12px; background: #555962; margin: 0 12px;}
.foot_site_select {	position: absolute;	display: block;	width: 100%;	max-width: 230px;	height: 45px;	right: 0;	top: 0;	border-right: 1px solid #555;	border-left: 1px solid #555;}
.foot_site_select select {
	border: 0;
	width: 100%;
	height: 100%;
	background: #2b2f3b url(/images/common/foot_site_select.png)no-repeat center right 20px;
	padding-left: 20px;
	padding-right: 30px;
	font-weight: 400;
	color: #333333;
	font-size: 14px;
	letter-spacing: -0.040em;
	cursor: pointer;
}
.foot_site_select select { -webkit-appearance: none; -moz-appearance: none;appearance: none;}
.foot_site_select select::-ms-expand { display:none; }


.foot_info {padding-top: 75px; padding-bottom: 75px; min-height: 165px; height: auto; align-items: center; display: flex; align-items: flex-start;}
.f_logo {position: relative; display: block; width: 220px; display: flex; align-items: center;}
.foot_info .txt {position: relative; display: block; width: 100%; height: auto; line-height: 130%; padding-left: 22px; width: calc(100% - 220px);}
.foot_info .txt p {display: block; font-size: 14px; letter-spacing: -0.025em; font-weight: 300; color: 333;}
.foot_info .txt p.copy {color: 333; font-size: 13px; letter-spacing: 0; display: block; margin-top: 30px;}
.foot_info .txt p+p {margin-top: 5px;}

.foot_info .txt2 {position: absolute; right: 0; top: 0; text-align: right; line-height: 20px; font-size: 13px; color: rgba(255,255,255,0.4); height: 100%; display: flex; align-items: center;}


.foot_info {}

.foot_info .select {
    border-width: 1px;
    border-color: rgb(204, 204, 204);
    border-style: solid;
    background-color: rgb(255, 255, 255);
    position: absolute;
    width: 248px;
    height: 44px;
    z-index: 11;
    font-weight: 400;
    font-size: 14px;
    padding-left: 17px;
    padding-right: 35px;
    right: 0;
    background-image: url(/images/common/sele.jpg);
    background-position: center right 15px;
    background-repeat: no-repeat
}
.foot_info .select { -webkit-appearance: none; -moz-appearance: none;appearance: none;}
.foot_info .select::-ms-expand { display:none; }

@media all and (max-width: 1200px) {
    .foot_info .select {position: relative; margin: 0 auto; margin-top: 30px;}
}

@media all and (max-width: 1024px) {
	.foot_info {padding-bottom: 120px; height: auto;}
	.foot_info .txt2 {right: inherit;top: inherit;/* position: relative; */left: 0;bottom: 45px;width: 100%;height: auto;text-align: left;font-size: 12px;padding-left: 163px;}
}

@media all and (max-width: 767px) {
	.footer_top .inner .links {justify-content:center;}
	.footer_top .inner .links a {font-size: 13px;}
	.foot_site_select select {font-size: 13px;}
	.footer_top .inner .links .bar {margin: 0 7px;}
	.foot_info {display: block; padding-bottom: 50px;}
	.f_logo {margin: 0 auto; display: block; max-width: 130px;}
	.foot_info .txt {padding-left: 0; text-align:center; padding-top: 10px; width: 100%;}
	.foot_info .txt2 {position: relative; left: inherit;bottom: inherit; text-align: center; padding-left: 0; width: 100%; display: block; padding-top: 15px; font-size: 11px;}
	
	
	.footer_top .inner {height: auto; padding-bottom: 45px;}
	.footer_top .inner .links {height: 45px;}
	.foot_site_select {left: 0; right: inherit; top: 45px; max-width: 100%; border: 0; border-top: 1px solid #555;}
	
	/* .foot_site_select {position: relative; width: 100%; right: top:;} */
    .foot_info .select  {width: 100%;}
}

@media all and (max-width: 425px) {
	.footer_top .inner .links a {font-size: 12px;}
	.footer_top .inner .links .bar {margin: 0 4px;}
	.foot_site_select select {font-size: 12px;}
}

/* footer end */




/*플로팅*/
.floating {position: fixed; right: 8%; top: 34%; display: block; width: 170px; height: 250px; /* background: blue; */ z-index: 9999999; transition: all 0.3s; overflow: hidden;}
.floating * {}
.floating .telic {display: block; width: 40px; height: 40px; position: absolute; right: 50%; margin-right: -20px; border-radius: 100%; background: #fff url(/images/main/main_tel.png)no-repeat center; z-index: 2; transition: all 0.2s;  border: 1px solid #ddd;}
.floating .telic.openbtn {cursor: pointer; display: none;}
.floating .inner {position: relative; display: block; width: 100%; height: auto; z-index: 1; height: 230px; opacity: 1;}

.floating .inner .info {position: relative; display: flex; width: 170px; height: 140px; background: #fff; border-radius: 13px; margin-top: 20px; transition: opacity 0.2s; border: 1px solid #ddd; align-items: center;}
.floating .inner .info>div>p {text-align: center; display: block; line-height: 1; }
.floating .inner .info>div>p.p1 {font-size: 15px; font-weight: 400; letter-spacing: -0.025em; color: #0c1f42; margin-top:8px;}
.floating .inner .info>div>p.p2 {font-size: 19px; font-weight: 600; letter-spacing: -0.025em; color: #0c1f42; margin-top: 8px;}
.floating .inner .info>div>p a {font-family: inherit; font-size: inherit; color: inherit; letter-spacing: inherit; line-height: inherit; font-weight: inherit;}
.floating .inner .info .time {position: relative; display: block; width: 100%; height: auto; margin-top: 8px;}
.floating .inner .info .time li {position: relative; display: flex; align-items: center; justify-content: center;}
.floating .inner .info .time li+li {margin-top: 4px;}
.floating .inner .info .time li p {font-size: 13px; font-weight: 300; letter-spacing: -0.040em; color: #333333; font-family: 'Noto Sans KR', sans-serif;}
.floating .inner .info .time li p.leftp {display: flex; width: 51px; justify-content: space-between; align-items: center;}
.floating .inner .info .time li p.leftp span {font-family: inherit; font-size: inherit; color: inherit; letter-spacing: inherit; line-height: inherit; font-weight: inherit;}



.floating .inner .btn {position: relative; display: block; width: 100%; height: 40px; line-height: 40px; text-align: center; color: #fff; font-weight: 400; letter-spacing: -0.025em; margin-top: 5px; border-radius: 20px;}
.floating .inner .btn.btn1 {background: #ef8323;}
.floating .inner .btn.btn2 {background: #11b2ca;}

@media all and (max-width: 1850px) {
	.floating {right: 4%}
}
@media all and (max-width: 1700px) {
	.floating {right: 2%}
}
@media all and (max-width: 1600px) {
	.floating {right: 0.5%}
}

@media all and (max-width: 1439px) {
	.floating {right: 4%; width: 40px; height: 40px; overflow: hidden; opacity: 0.9;}
	.floating .telic {right: 0; margin-right: 0; display: none;}
	.floating .telic.openbtn {display: block; }
/* 	.floating .inner {opacity: 0;} */
	.floating .inner .info {opacity: 0;}
	
	.floating.active {width: 170px; height: 250px; opacity: 1;}
	.floating.active .telic {right: 50%; margin-right: -20px; }
/* 	.floating.active .inner {opacity: 1;} */
	.floating.active .inner .info {opacity: 1;}
}
@media all and (max-width: 767px) {
	.floating {top: inherit; bottom: 5%;}
}

/*플로팅 end*/






































































































































