@charset "utf-8";

/* background fixed 사용시 버그 대응용 * 한 번 스크롤로 페이지 전체 넘김을 할 때는 html스타일에서 height속성 제거하기 */
/* html {overflow: hidden; height: 100%;} */
/* body {overflow: auto; height: 100%;} */
/* html,body {height:100%;} */

/* ************************ 공용 ************************ */
a {text-decoration:none !important; outline:none !important; selector-dummy:expression(this.hideFocus=true) !important;}
a:link {text-decoration:none; color:#3d3833;}
a:visited {text-decoration:none; color:#3d3833;}
a:hover {text-decoration:none; color:#000;}
a:active {text-decoration:none; color:#3d3833;}
a,img {
	transition:all .1s linear;
	-webkit-transition:all .1s linear;
	-moz-transition:all .1s linear;
}

input:focus,a:focus,button:focus {outline:none;}
			
body {
	position:static; width:100%; min-width:320px;
	font-family:"NotoSansKR", sans-serif; font-size:16px; font-weight:normal; line-height:1.6; color:#000; letter-spacing:-.5px;
	word-break:keep-all;
	overflow-x:hidden;
}
#gotop {
	position:fixed; right:2vw; bottom:3vh;
	display:block; cursor:pointer; 
	width:60px; height:60px; border:1px solid #e5e5e5;
	background:#fff url(../images/common/i-gotop.png)center 16px no-repeat;
	box-shadow:0 3px 8px rgba(0,0,0,.05);
	z-index:9998;
	opacity:0;
	
}
#gotop:hover {
	animation:moveT .8s infinite;
}
#direct {
	position:fixed; right:1.14vw; top:50%;
	display:block; cursor:pointer; 
	width:145px; line-height:67.5px;
	background:#e95c32;
	color:#fff;
	font-size:16px;
	font-weight:500;
	z-index:9998;
	opacity:1;
	text-align:center;
	border:1px solid rgba(255,255,255,.3);
}

@keyframes moveT {
	0% {background-position:center 16px;}
	50% {background-position:center 12px;}
	100% {background-position:center 16px;}
}

/* 컨텐츠 */
.contents img {max-width:100%; height:auto;}



/*상단이미지*/
.sv1 {background-image:url(../images/service/sv1.jpg) !important;}
.sv2 {background-image:url(../images/service/sv2.jpg) !important;}
.sv3 {background-image:url(../images/service/sv3.jpg) !important;}




/*햄버거메뉴*/
header .gnbView {position:absolute; top:0; left:5vw; z-index:999; display:block; padding:45px 0;}
header .gnbView .line{
  display: block;
  width: 19px;
  height: 2px;
  background-color: #000;
  margin: 5px 0;
}
/*햄버거메뉴클릭시 펼쳐지는 화면*/
nav.open {z-index:9999; position:fixed; visibility:hidden; top:0; width:35%; height:100%; overflow:hidden; box-shadow:-5px 0 5px rgba(0,0,0,.2) !important; background-color:#fff;}
nav.open .closeWrap {position:relative; height:120px; background-color:#ee2e2c; /* border-bottom:1px solid #fff; */ padding:0 5vw; border-bottom:1px solid rgba(255,255,255,.5);}
nav.open .closeWrap .gnbClose {display:block; float:right; width:60px; height:120px; background:url(../images/common/pop-x.png) center no-repeat; background-size:23px;}
nav.open .closeWrap .home {position:absolute; display:block; top:0; left:5vw; padding:35px 0; color:#fff;}
.gnbCover {z-index:9998; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(0,0,0,.4);}

nav.open .gnb {position:relative; width:100%; height:100%; overflow-y:auto; text-align:left; background:#ee2e2c;}
nav.open .gnb * {width:100% !important;}
nav.open .gnb>ul {padding-top:50px;}
nav.open .gnb>ul>li {clear:both; position:relative; padding:0 5vw;}
nav.open .gnb>ul>li.on {opacity:1;}
nav.open .gnb>ul>li+li {margin-top:30px;}
nav.open .gnb>ul>li>a {display:block; font-size:20px; font-weight:700; color:#fff; background:#ee2e2c; letter-spacing:-1px; transition:.8s; position:relative; background:no-repeat right 20px center url(../images/common/i-minus.png);  transition:0s;}
nav.open .gnb>ul>li.on>a:before {display:block;}
nav.open .gnb>ul>li.on>a {color:#ffff00; background:no-repeat right 20px center url(../images/common/i-plus.png);}
nav.open .gnb>ul>li>ul {display:none; margin-top:5px;}
nav.open .gnb>ul>li>ul>li {position:relative;}
nav.open .gnb>ul>li>ul>li+li {margin-top:5px;}
nav.open .gnb>ul>li>ul>li>a {
	display:block; font-size:18px; color:#fff; font-weight:400; padding-left:30px;
	background:#ee2e2c; position:relative;
}

nav.open .gnb>ul>li>ul>li>ul {margin-top:10px;}
nav.open .gnb>ul>li>ul>li>ul>li>a {
	display:block; font-size:16px; color:#fff; font-weight:300; padding-left:50px;
	background:#ee2e2c; position:relative; opacity:.8;
}
nav.open .gnb>ul>li>ul>li>ul>li.on>a  {opacity:1; font-weight:400;}

	nav.open .gnb ul li a span {position:relative; transition:.3s;}
	nav.open .gnb ul li a span:before {
		position:absolute; bottom:0; left:0; width:0; height:1px; background:#fff;
		display:block; content:""; transition:.3s;
	}
	nav.open .gnb ul li a:hover span {letter-spacing:0;}
	nav.open .gnb>ul>li>ul>li a:hover span:before {width:100%;}
	nav.open .gnb>ul>li.on>ul>li.on>a>span:before {width:100%;}

nav.open .gnb>ul>li>ul>li>a:before {
	position:absolute; top:13px; left:8px; width:2px; height:2px; background:#fff; display:block; content:"";
}
nav.open .gnb>ul>li:last-child>a {background:none;}


nav.pc .gnb>ul>li span.gosite {padding-right:25px; background:no-repeat right center url(../images/common/i-gosite-g.png); background-size:15px;}
nav.open .gnb>ul>li span.gosite {padding-right:40px; background:no-repeat right center url(../images/common/i-gosite.png); background-size:15px;}
nav.open .gnb>ul>li>ul>li span.gosite {padding-right:30px; background-size:12px;}





/* ************************ 데스크탑 (992~) ************************ */
@media screen and (min-width: 992px), print {

	/* html,body {min-width:1400px;} */
	.mobile {display:none !important;}

	/*헤더*/
	header .headerBar {position:absolute; top:119px; width:100%; height:1px; background:#ddd; z-index:100;}
	header {z-index:9999; position:relative; width:100%; height:120px; background-color:transparent;}
	header .headWrap {position:relative;}
	header .head {position:relative; margin:0 5%; width:calc(100% - 5%*2);}
	header .head h1 {position:absolute; top:35px; left:40px; z-index:999;}
	header .head h1 a {display:block;}
	
	header aside {position:absolute; right:0; top:40px; z-index:101; overflow:hidden;}
	header aside>* {float:left;}
	header aside .lang {}
	header aside .lang>a {
		border:1px solid #d2d2d3; padding:12px 30px 12px 10px; line-height:1;
		font-size:12px; display:block; background:url(../images/common/arrowD-lang.png)right 10px center no-repeat; color:#000;
	}
	header aside .lang ul {display:none;}
	header aside .lang>a.on+ul {display:block; border:1px solid #d2d2d3; border-top:0;}
	header aside .lang>a.on {border-bottom:1px solid transparent;}
	header aside .lang ul a {color:#000; font-size:12px; padding:12px; display:inline-block; background:#fff; width:100%;}

	/*gnb-pc일때 상단부분*/
	nav.pc {
		visibility:hidden; position:absolute; display:block; width:100%; height:120px !important; top:0; overflow:hidden; text-align:center;
	}
	nav.pc .gnb {position:relative; display:inline-block; width:100%; text-align:left !important;z-index:99; padding:0 10% 0 35%;}
	nav.pc .gnb a:hover,nav .navWrap a:focus {color:#000;}
	nav.pc .gnb>ul {margin:0 !important; line-height:1.6; display:flex;}
	nav.pc .gnb>ul>li {position:relative;}
	nav.pc .gnb>ul>li:last-child {padding-right:0 !important;}
	nav.pc .gnb>ul>li:last-child ul {min-width:100px;}
	nav.pc .gnb>ul>li>a {display: block;position: relative;width:100%;font-size:18px;font-weight:500;line-height: 120px;color: #000;}
	nav.pc .gnb>ul>li>a:before {position:absolute;bottom:-1px;left:0;width:0; height:7px;background:#ee2e2c; display:block; content:""; transition-duration:.3s;}
	nav.pc .gnb>ul>li>a:hover:before {width:100%;}
		nav.pc .gnb>ul>li.includeGosite>a:hover:before {width:0;}
	nav.pc .gnb>ul>li.on>a{color:#ee2e2c;}
	nav.pc .gnb>ul>li.on>a:before{width:100%; }
	/* nav.pc .gnb>ul>li:hover>a{color:#ee2e2c;} */
	nav.pc .gnb>ul>li>ul {display:none;}
	

	/*footer*/
	footer.main:before {height:0;}
	footer:before {
		position:absolute; left:0; top:0; width:100%; height:10px; background:#fff; content:""; display:block; box-shadow:3px 3px 3px rgba(0,0,0,.1) inset;
	}
	footer {background:#f5f5f5; padding:50px 5vw; display:flex; position:relative; clear : both;}
	footer .logo {width:250px;}
	footer .logo img {height:30px;}
	footer .con {width:calc(100% - 250px); position:relative; padding-right:40%;}
	footer .con .txt {font-size:14px;}
	footer .con .txt .link {font-size:0;}
	footer .con .txt .link li {display:inline-block;}
	footer .con .txt .link li a {display:block; font-size:14px; color:#000; font-weight:400; margin-right:20px;}
	footer .con .txt .link li a.acc {font-weight:700;}
	footer .con .txt .address {color:#666; margin-top:15px;}
	footer .con .txt .address span {margin-right:15px;}
	footer .con .txt p {color:#666;}
	
	footer .familysite {z-index:10; position:absolute; right:0; top:0; display:flex; align-items:center;}
	footer .familysite>span {font-size:14px; padding-right:10px;}
	footer .familysite .list {position:relative; padding:0; font-size:14px; height:40px;}
	footer .familysite .list>a {display:inline-block; width:250px; padding:12px 30px 12px 12px; font-weight:400; color:#999; line-height:1; border:1px solid #e7e9ec; background:url(../images/common/arrowD.png) no-repeat 95% 50% #fff;}
	footer .familysite .list>ul {position:absolute; display:none; bottom:40px; border:1px solid #fff; background-color:#fff;}
	footer .familysite .list>ul.on {display:block; width:100%; border:1px solid #e7e9ec;}
	footer .familysite .list>ul a {display:block; padding:10px; border-top:1px solid #e7e9ec;}
	footer .familysite .list>ul a:hover {background:#ee2e2c; color:#fff;}
	footer .familysite .list>ul li {padding:0;}
	footer .familysite .list>ul li:first-child a {border:0;}
	
	/*서브내용*/
	.contents .contents-inner h3.tit {font-size:36px; font-weight:900; color:#000; letter-spacing:-1.5px; text-align:center;}
	
	 
	 
}

/* ************************ 노트북 (992~1280) ************************ */
@media screen and (min-width:992px) and (max-width:1400px) {
	
	nav.pc .gnb>ul>li {padding-right:4% !important;}
	nav.pc .gnb>ul>li>a {font-size:15px;}
	
	
	

}


/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {

	/* html,body {font-weight:400; font-size:15px;}	 */
	.pc {display:none !important;}
	
	/*헤더*/
	header.main {height:60px !important;}
	header {z-index:999; width:100%; left:0; top:0;}
	header .head {width:100%; height:60px; overflow:hidden; line-height:1; border-bottom:1px solid #e9e9e9;}
	header .head h1 {margin:0 !important; display:block; text-align:center;}
	header .head h1 a {display:inline-block; padding:15px;}
	header .head h1 a img {display:block; height:30px; font-size:0; line-height:0;}
	header .gnbView {
		left:0; z-index:999; display:block; padding:0;
		width:60px; height:60px; border-right:1px solid #eee; padding:15px 20px;
	}
	
	
	/**/
	nav.open,
	nav.pc {display:none !important;}
	
	nav.mobile {z-index:9999; position:fixed; visibility:hidden; top:0; width:80%; height:100%; overflow:hidden; box-shadow:-5px 0 5px rgba(0,0,0,.2) !important; background-color:#fff;}
	nav.mobile .closeWrap {position:relative; height:60px; background-color:#ee2e2c; padding:0;}
	nav.mobile .closeWrap .gnbClose {display:block; float:right; width:60px; height:60px; text-align:center; background:url(../images/common/pop-x.png) center no-repeat; background-size:20px; border-left:1px solid rgba(255,255,255,.1);}
	nav.mobile .closeWrap .home {position:absolute; display:block; top:0; left:0; padding:20px; color:#fff; font-size:12px;}
	.gnbCover {z-index:9998; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(0,0,0,.6);}
	
	nav.mobile .gnb {position:relative; width:100%; height:100%; overflow-y:auto; text-align:left; background:#fff;}
	nav.mobile .gnb * {width:100% !important;}
	nav.mobile .gnb>ul {padding-top:0;}
	nav.mobile .gnb>ul>li {clear:both; position:relative; padding:0;}
	nav.mobile .gnb>ul>li+li {margin-top:0;}
	nav.mobile .gnb>ul>li>a {display:block; padding:15px 30px; font-size:16px; font-weight:400; color:#333; background:#fff; letter-spacing:-1px; border-bottom:1px solid #e9e9e9; transition:.8s; position:relative;}
	nav.mobile .gnb>ul>li>a:before {
		position:absolute; bottom:0; left:0; width:5px; height:100%; background:#ee2e2c; display:none; content:"";
	}
	nav.mobile .gnb>ul>li.on>a:before {display:block;}
	nav.mobile .gnb>ul>li.on>a {color:#000; background:#fff;}
	nav.mobile .gnb>ul>li>ul {display:none; margin-top:0;}
	nav.mobile .gnb>ul>li>ul>li {position:relative;}
	nav.mobile .gnb>ul>li>ul>li+li {margin-top:0;}
	nav.mobile .gnb>ul>li>ul>li a {
		display:block; padding:10px 30px 10px 50px; font-size:14px; color:#999;
		background:#f5f5f5; border-bottom:1px dotted #ddd;
	}
	nav.mobile .gnb>ul>li>ul>li a:before {top:20px; left:30px;}
	nav.mobile .gnb>ul>li>ul>li:last-child a {border-color:#e0e0e0;}
	nav.mobile .gnb>ul>li>ul>li.on a {color:#fff; background-color:#ee2e2c;}
	
	nav.mobile .gnb>ul>li span.gosite {padding-right:20px; background:no-repeat right center url(../images/common/i-gosite-g.png); background-size:13px;}
	nav.mobile .gnb>ul>li>ul>li span.gosite {padding-right:30px; background-size:12px;}
	
	nav.mobile .gnb>ul>li>ul>li>ul {margin-top:0;}
	nav.mobile .gnb>ul>li>ul>li>ul>li>a {background:#f5f5f5; color:#000; padding-left:70px; font-size:14px;}
	nav.mobile .gnb>ul>li>ul>li.on a {background:#f5f5f5; color:#000;}
	nav.mobile .gnb>ul>li>ul>li.on>a  {background:#aaa; color:#fff;}
	nav.mobile .gnb>ul>li.on>ul>li.on>a>span:before {width:0;}
	
	
	
	/*footer*/
	footer {background:#f5f5f5; padding:30px; display:flex; flex-wrap:wrap; justify-content:center;}
	footer .logo {width:100%;}
	footer .logo img {height:25px;}
	footer .con {width:100%; position:relative;}
	footer .con .txt {font-size:14px; margin-top:10px;}
	footer .con .txt .link {font-size:0;}
	footer .con .txt .link li {display:inline-block;}
	footer .con .txt .link li a {display:block; font-size:14px; color:#000; font-weight:400; margin-right:20px;}
	footer .con .txt .link li a.acc {font-weight:700;}
	footer .con .txt .address {color:#666; margin-top:15px;}
	footer .con .txt .address span {margin-right:20px;}
	footer .con .txt p {color:#666;}
	
	footer .familysite {position:static; display:flex; align-items:center; margin-top:20px;}
	footer .familysite>span {padding-right:10px; font-size:14px;}
	footer .familysite .list {position:relative; padding:0; font-size:14px; height:40px;}
	footer .familysite .list>a {display:inline-block; width:250px; padding:12px 30px 12px 12px; font-weight:400; color:#999; line-height:1; border:1px solid #e7e9ec; background:url(../images/common/arrowD.png) no-repeat 95% 50% #fff;}
	footer .familysite .list>ul {position:absolute; display:none; bottom:40px; border:1px solid #fff; background-color:#fff;}
	footer .familysite .list>ul.on {display:block; width:100%; border:1px solid #e7e9ec;}
	footer .familysite .list>ul a {display:block; padding:10px; border-top:1px solid #e7e9ec;}
	footer .familysite .list>ul a:hover {background:#ee2e2c; color:#fff;}
	footer .familysite .list>ul li {padding:0;}
	footer .familysite .list>ul li:first-child a {border:0;}
	
	
	
	
	
	/*서브내용*/
	.contents .contents-inner h3.tit {font-size:28px; font-weight:900; color:#000; letter-spacing:-1.5px; text-align:center;}
	

}


/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {
	/*footer*/
	footer .con .txt .address span {margin-right:0; display:block;}
	footer .familysite>span {display:none;}


}