/*contents.css*/
body {line-height:1.2;}

.flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

/*top*/
header {width:100%; height:125px; background:#fff; position:absolute; z-index:90; border-bottom:1px solid rgba(0,0,0,.1);}
.logoWrap {float:left; margin:10px 0 0 172px;}
.logo {width:250px; height:50px; background:url(/images/logo.png) no-repeat center top; background-size:100% auto;}
.nav {float:right; position: relative; top:70px; /* right:460px; */ right: 500px;}
.nav .dep1 {overflow: hidden;}
.nav .dep1 > li {float:left; font-size:18px; font-weight:400; padding-bottom:5px; margin-right:20px; position: relative;}
.nav .dep1 > li:hover {color:#1313ab;}
.nav .dep1 > li.last {margin-right:0;}
.top_tel { width:228px; text-align: right; position: absolute; bottom:25px; right:172px; /* line-height:1.5; */ line-height: 1;}
.top_tel .tel_icon {float:left; width:35px; height: 45px; background:url(/images/tel_icon.png) no-repeat center top; background-size:100% auto; position: absolute; /* top:-8px; */ top: 20px;}
.tel_info {/* line-height:3px; */ font-size: 18px; font-weight: 400; color:#8e8e8e; text-align: center; margin-left:30px;}
.tel_num {font-size: 28px; font-weight:800; color:#252583;}

header.fixed {height:100px; position: fixed;}
header.fixed .nav {top:45px; /* right:350px; */ right: 400px;}
header.fixed .logoWrap {margin:20px 0 0 70px;}
header.fixed .yLogo {float:left; width:60px; height:58px; background:url(/images/ylogo_sub.png) no-repeat center top; background-size:100% auto;}
header.fixed .logo {float:left; width:200px; height:50px; margin:10px 0 0 10px;}
header.fixed .top_tel {bottom:15px; right:80px;}
header.fixed .tel_info {font-size: 16px; margin-left:40px;}
header.fixed .tel_num {font-size: 26px;}
header.fixed .tel_icon {width:32px; height:42px; left:20px; /* top:-5px; */ top: 20px;}

.nav .dep1 > li:after {content:""; display: block; width:0; height:2px; padding-top:3px; background:#1313AB; position:absolute; left:0; bottom:0; transition:.3s; }
.nav .dep1 > li:hover:after {width:100%;}

.yLogo {width:161px; height:41px; background:url(/images/yLogo.png) no-repeat center top; background-size:100% auto;}

.rightWrap {display: none;}
.burger {display: none;}


@media only screen and (max-width: 1600px) {
	.logoWrap {margin:10px 0 0 100px;}
	.nav {right:400px;}
	.nav .dep1 > li {/* margin-right:30px; */}
	.top_tel {right:90px;}
}
@media only screen and (max-width: 1400px) {
	.logoWrap {margin:10px 0 0 50px}
	.nav {right:300px;}
	.nav .dep1 > li {font-size: 17px; margin-right:15px;}
	.top_tel {right:50px;}

	header.fixed .logoWrap {margin:22px 0 0 50px;}
	header.fixed .top_tel {right:50px;}
	header.fixed .nav {right:300px;}
/* }
@media only screen and (max-width: 1200px) { */
	header {height:100px;}
	.logoWrap {margin:5px 0 0 50px}
	.logo {width:200px; height:40px;}
	.nav {display: none;}
	
	.top_tel {display: none;}
	.rightWrap .top_tel {display: block; width:290px; height:35px; top:50px; left:-28px;}
	.top_tel .tel_icon {width:25px; left:65px; top:0px;}
	.top_tel .tel_info {font-size: 13px; margin:0 0 10px 55px;}
	.top_tel .tel_num {text-align:left; font-size: 21px; margin:0 0 0 110px;}

	header.fixed .logoWrap {margin:20px 0 0 30px;}
	header.fixed .top_tel {right:30px;}
}
@media only screen and (max-width: 960px) {
	.logoWrap {margin:5px 0 0 40px}
	.logo {width:190px;}
	.yLogo {width:150px;}
}
@media only screen and (max-width: 530px) {
	.logoWrap {margin:15px 0 0 25px}
	.logo {width:170px; height:35px;}
	.yLogo {width:135px; height:35px; margin-top:-5px;}

	header.fixed {position: fixed; height:80px;}
	header.fixed .logoWrap {margin:5px 0 0 20px;}
	header.fixed .yLogo {width:50px; height:47px; margin-top:10px;}
	header.fixed .logo {width:150px; height:33px; margin:20px 0 0 10px;}
	header.fixed .top_tel {right:20px;}
}

/*right 메뉴*/
.overlay {display: none; width:100%; height:100%; position: fixed; top:0; left:0; z-index:95; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;
				  transition: all 0.3s ease-in-out; background:rgba(0,0,0,.5);}
.overlay.show {display: block;}
.rightWrap {display: block; overflow-y:scroll; width:280px; height:100%; background:#fff; position: fixed; top:0; right:-280px;  z-index:100; transition: 0.2s ease; -moz-transition: 0.3s ease; -webkit-transition: 0.3s ease; -o-transition: 0.3s ease;}
.rightWrap.show {right:0;}
.burger {display: none; width:75px; height:80px; position: absolute; z-index:101; top:5px; right:0; cursor:pointer;}
.burger.fixed {position: fixed;}
.burger span {display: block; width: 25px; height:2px; outline:transparent; background-color:#000; position: absolute; top:50%; left:50%; margin-left:-12.5px; margin-top:1px; margin-bottom:7px;}
.burger span:before, .burger span:after {
	content: "";
	position: absolute;
	display: block;
	width: 25px;
	height: 2px;
	background: #000;
	outline: transparent;
	transition-duration: 0.3s;
}
.burger span:before {top:-7px;}	
.burger span:after {top:7px;}
.burger.clicked span {background-color: transparent;}
.burger.clicked span:before {
	-webkit-transform: translateY(7px) rotate(45deg);
	-moz-transform: translateY(7px) rotate(45deg);
	-ms-transform: translateY(7px) rotate(45deg);
	-o-transform: translateY(7px) rotate(45deg);
	transform: translateY(7px) rotate(45deg);
}
.burger.clicked span:after {
	-webkit-transform: translateY(-7px) rotate(-45deg);
	-moz-transform: translateY(-7px) rotate(-45deg);
	-ms-transform: translateY(-7px) rotate(-45deg);
	-o-transform: translateY(-7px) rotate(-45deg);
	transform: translateY(-7px) rotate(-45deg);
}

.mNav {margin:180px 0 0;}
.mNav li {display: inline-block; font-size: 22px; font-weight: 500; padding-bottom:5px; margin:25px 49px 0; position: relative;}
.mNav li.on {color:#1313ab;}
.mNav li:after {content:""; display: block; width:100%; height:0px; background:#1313ab; position: absolute; bottom:0; transition:.3s;}
.mNav li.on:after {height:3px;}
.mNav li:hover:after {height:3px;}
.mNav .dep2 li {width:100%; font-size: 15px; font-weight:400; padding:10px 0 0 0px;}
.mNav .nav_tel {width:80%; margin:80px auto 0;}

@media only screen and (max-width: 1400px) { 
	.burger {display: block;}
}
@media only screen and (max-width: 960px) { 
	.burger {top:4px;}
}

@media only screen and (max-width: 768px) {
	.mNav li {font-size:19px;}
}
@media only screen and (max-width: 530px) {
	.burger.fixed {top:0px;}
}


/*default*/
.oh {overflow:hidden;}
.w1400 {width:1400px; margin:0 auto; overflow:hidden;}
.w1200 {width:1200px; margin:0 auto;}
.mainTit {font-size:55px; padding-bottom:70px; line-height: 1.2;}
.mainTit span {font-weight: 600;}
.HB {display: none; font-size: 14px; font-weight: 300; padding-top:10px;}
.mn {display: block;}
.mb {display: none;}

.mv {width:100%; position: relative;}
.mv img {width:100%; padding-top:70px;}
.mv_txt {font-size:38px; font-weight: 400; position: absolute; top:372px; left:174px;}
.mv_txt .mvTit {line-height:1.6; font-size:85px; font-weight:800; color:#1d2088; margin-top:-30px;}
.mv_txt .mvTit span {color:#df0615;}
.mvTxt {line-height:1.2; font-size:25px; font-weight: 300;}
.slide1 .mv_txt .mvTit span {color:#df0615;}

.section1 {text-align: center; padding:150px 0;}
.section1 ul {overflow:hidden;}
.section1 ul li {float:left; overflow:hidden; width:456px; height:360px; margin-bottom:16px;margin-right:16px; border-radius:12px; background-size:auto 100%; position: relative; cursor:pointer;}
.section1 ul li:first-child {background:url(/images/detail01.png) no-repeat center;}
.section1 ul li:nth-child(2) {background:url(/images/detail02.png) no-repeat center;}
.section1 ul li:nth-child(3) {margin-right:0; background:url(/images/detail03.png) no-repeat center;}
.section1 ul li:nth-child(4) {width:692px; margin-bottom:0; background:url(/images/detail04.png) no-repeat center 80%;}
.section1 ul li:nth-child(5) {width:692px; margin-right:0; margin-bottom:0; background:url(/images/detail05.png) no-repeat 25% center;}
.section1 ul li span.de_icon {display: block; width:47px; height:50px; margin:0 auto 6px;}
.section1 ul li:first-child span.de_icon {background:url(/images/de_icon01.png) no-repeat center;}
.section1 ul li:nth-child(2) span.de_icon {background:url(/images/de_icon02.png) no-repeat center;}
.section1 ul li:nth-child(3) span.de_icon {background:url(/images/de_icon03.png) no-repeat center;}
.section1 ul li:nth-child(4) span.de_icon {background:url(/images/de_icon04.png) no-repeat center;}
.section1 ul li:nth-child(5) span.de_icon {background:url(/images/de_icon05.png) no-repeat center;}
.section1 ul li:hover .cate_blue {width:100%; height:100%; border-radius:12px; background:rgba(36,36,131,0.8); position:absolute; top:0; left:0; -webkit-transition:.5s; transition:0.5s;}
.section1 ul li p {font-size:20px; font-weight:500; color:#fff; padding:31% 0 0; position: relative; z-index:1;}
.section1 ul li:nth-child(4) p {padding:21% 0 0;}
.section1 ul li:nth-child(5) p {padding:21% 0 0;}
.section1 ul li:hover p {font-size:23px; padding:29% 0 0;  -webkit-transition:.5s; transition:0.5s;}
.section1 ul li:nth-child(4):hover p {padding:18% 0 0;}
.section1 ul li:nth-child(5):hover p {padding:18% 0 0;}
.section1 ul li:hover p .HB {display: block;}
.section1 ul li.mLine {display: none;}

.section2 {width:100%; height:480px; padding:120px 0; background:url(/images/sec2.jpg) no-repeat center #000; background-attachment:fixed;}
.section2 .sec2Wrap {color:#fff; text-align: center;}
.section2 .mainTit {padding-bottom:30px;}
.section2 .mainTxt {font-size: 22px; padding-bottom:40px; line-height:1.5;}
.section2 .callBtn {display: inline-block; overflow:hidden; padding:8px 15px; width:; font-size:20px; font-weight: 400; text-align: center; color:#fff; background:#2918a3; position:relative;}
.section2 .callBtn:hover:after {width:100%; -webkit-transition:.3s; transition:0.3s;}

.section3 {padding:150px 0 80px;}
.section3 .mainTit {text-align:center; font-weight: 600;}
.section3 .mainTit span {display: block; width:180px; height:25px; margin:15px auto 0; background:url(/images/logoS.png) no-repeat center top; background-size:100% auto;}
.section3 .map img {width:100%; height:100%;}
.map_info {width:1200px; margin:40px auto 60px; overflow: hidden; text-align: left;}
.map_info li {float:left; width:50%; padding:0 20px;}
.map_info li:last-child {border-left:1px solid rgba(0,0,0,.2); /* padding-left:70px; */}
.map_info li p {font-size: 18px; font-weight:400; padding-bottom:20px;}
.map_info li span {font-size: 20px; font-weight: 500;}
.map_info li .sub {display: inline-block; width:50px; height:20px; line-height:20px; font-size: 13px; color:#fff; text-align: center; margin-right:5px; margin-bottom:5px; background:#29b6c6;}
.map_info li .sub1 {background:#3155b5;}
.map_info li .sub2 {background:#10aa18;}
.map_info li .sub6 {background:#826148;}
.map_info li .bus {display: inline-block; width:50px; height:20px; line-height:20px; font-size: 13px; color:#fff; text-align: center;  margin:0 5px 5px 0px; background:#87c700;}
.map_info li .bus1 {background:#00afbd;}
.map_info li .bus2 {background:#ff451e;}
.map_info li .bus3 {background:#e5a900;}
.map_info li .bus4 {background:#f76d59;}
.map_info li .ml {font-size: 16px; font-weight: 400; margin-left:70px;}
.map_info li .ml70 {margin-left: 70px;}


@media only screen and (max-width: 1600px) {
	.mv_txt {font-size: 30px;  left:90px;}
	.mv_txt .mvTit {font-size: 70px; margin-top:-20px;}
	.mv img {width:auto; height:850px;}
}
@media only screen and (max-width: 1400px) {
	.w1400 {width:1200px;}
	.mv_txt {left: 70px; top:320px;}
	.mv_txt .mvTit {font-size: 65px; margin-top:-20px;}
	.mv img {height:760px;}

	.section1 {padding:120px 0;}
	.section1 ul {padding:0;}
	.section1 ul li {width:390px; margin-bottom:15px; margin-right:15px;}
	.section1 ul li:nth-child(4) {width:592px; margin-right::16px;}
	.section1 ul li:nth-child(5) {width:592px; margin-right:0;}

	.section3 {padding:120px 0 80px;}

}
@media only screen and (max-width: 1200px) {
	.w1400 {width:960px;}
	.mainTit {font-size: 40px;}
	.mv_txt {top:220px;}
	.mv {padding-top:100px;}
	.mv img {height:600px; padding-top:0px;}
	.mv .mn {display: block;}
	
	.section1 ul li {width:49%; margin:1% 1% 0 0; background-size:100% auto;}
	
	.section1 ul li:nth-child(even) {margin:1% 0 0 0;}
	.section1 ul li:nth-child(3) {margin-right:1%;}
	.section1 ul li:nth-child(4) {width:49%; margin:1% 0 0 0;}
	.section1 ul li:nth-child(5) {width:49%; margin:1% 0 0 0;}
	.section1 ul li p {padding:33% 0 0;}
	.section1 ul li:hover p {padding:28% 0 0;}


	.section3 .mainTit span {width:150px; height:23px; margin:8px auto 0;}
	.map_info {width:95%;}
}
@media only screen and (max-width: 1000px) {
	.mv .mn {display: none;}
	.mv .mb {display: block;}
	.mv_txt {width:100%; text-align:center; color:#fff; top:300px; left:0; right:0;}
	.mainTit {font-size:38px; padding-bottom:50px;}
	.mv_txt .mvTit {font-size:55px; color:#3f3fff; margin-top:-10px;}
}
@media only screen and (max-width: 960px) {
	.w1400 {width:95%;}

	.section1 {padding:100px 0;}

	.section1 ul li {width:49%; margin:1% 1% 0 0; background-size:100% auto;}
	.section1 ul li p {padding:140px 0 0 0;}	
	.section1 ul li:hover p {padding:120px 0 0 0;}
	.section1 ul li:nth-child(4) p {padding:140px 0 0;}
	.section1 ul li:nth-child(5) p {padding:140px 0 0;}
	.section1 ul li:nth-child(4):hover p {padding:120px 0 0;}
	.section1 ul li:nth-child(5):hover p {padding:120px 0 0;}

	.section2 {height:400px; padding:100px 0;}
	.section2 .mainTit { padding-bottom:20px;}
	.section2 .mainTxt {font-size:18px; padding:0 20px 30px;}

	.section3 {padding:100px 0 80px;}
	.map_info {width:90%;}
	.map_info li .ml {margin:0;}
	.map_info li .ml70 {margin-left: 0;}
	.map_info li:last-child {padding-left:50px;}
	
}
@media only screen and (max-width: 768px) {
	.mv img {height:500px;}
	.mv_txt {font-size:26px; font-weight:300; top:260px;}

	.section1 {padding:70px 0 70px;}
	.section1 ul li p {font-size: 18px;}
	.section1 ul li:hover p {font-size: 20px;}

	.section2 {width:100%; height:450px; padding:125px 0; background-size:auto 110%; background-attachment:initial;}
	.section2 .callBtn {width:160px; height:60px; line-height: 20px; font-size:16px; background:#2918a3; color:#fff;}

	.section3 {padding:70px 0 60px;}
	.map_info li:last-child {padding-left:30px;}

}
@media only screen and (max-width: 670px) {
	.section3 {padding:50px 0 50px;}
	.map_info li {float:none; overflow:hidden; width:100%; margin-bottom:15px; padding:0;}
	.map_info li:last-child {border-left:none; padding-left:0;}
	.map_info li p {font-size:16px;}
	.map_info li span {font-size:18px;}
}
@media only screen and (max-width: 530px) {
	.mainTit {font-size: 35px;}

	.mv img {width:135%; height:450px;}
	.mv_txt {font-size: 22px; top:210px;}
	
	.section1 {background:transparent; margin:0 auto;}
	.section1 ul li {width:100%; height:200px; margin:10px 0 0 0;}
	.section1 ul li:nth-child(even) {margin:10px 0 0 0;}
	.section1 ul li:first-child {background-size:100% auto;}
	.section1 ul li:nth-child(2) {background-size:100% auto;}
	.section1 ul li:nth-child(3) {background-size:100% auto;}
	.section1 ul li:nth-child(4) {width:100%;}
	.section1 ul li:nth-child(5) {width:100%; margin:10px 0 0 0;}
	.section1 ul li p {padding:60px 0 0 0;}
	.section1 ul li:hover p {font-size: 20px; padding:40px 0 0 0;}
	.section1 ul li:nth-child(4) p {padding:60px 0 0;}
	.section1 ul li:nth-child(5) p {padding:60px 0 0;}
	.section1 ul li:nth-child(4):hover p {padding:40px 0 0;}
	.section1 ul li:nth-child(5):hover p {padding:40px 0 0;}

	.section2 .mainTit {font-size: 30px;}
	.section2 .mainTxt {font-size: 16px;}
	.section2 .callBtn {width:140px; height:60px; line-height:20px; font-size:16px;}

}
@media only screen and (max-width: 480px) {
	.mainTit {font-size:33px; padding-bottom:30px;}
	.mb {display: block;}

	.mv img{width:auto; height:320px;}
	.mv_txt {top:100px; font-weight: 300; font-size: 20px;}
	.mv_txt .mvTit {font-size: 40px;}

	.section1 {padding:50px 0 50px;}
	.section1 .mainTit {font-size: 24px;}
	.section1 ul li {width:100%; height:170px; margin:10px 0 0 0;}
	.section1 ul li p {padding:47px 0 0 0;}
	.section1 ul li:hover p {font-size: 20px; padding:24px 0 0 0;}
	.section1 ul li:nth-child(4) p {padding:47px 0 0;}
	.section1 ul li:nth-child(5) p {padding:47px 0 0;}
	.section1 ul li:nth-child(4):hover p {padding:24px 0 0;}
	.section1 ul li:nth-child(5):hover p {padding:24px 0 0;}

	.section2 {padding:110px 0;}
	.section2 .mainTit {padding-bottom:15px;}
	.section2 .mainTxt {padding-bottom:25px;}

	.section3 .mainTit span {width:130px; height:19px;}
}

/*footer*/
footer {font-weight: 400; background:#f0f0f0;}
.footerWrap {overflow: hidden; width:1200px; line-height:1.5; padding:67px 0 30px; margin:0 auto; border-bottom:1px solid rgba(0,0,0,.2);}
/* .footerWrap .fLeft {float:left;}
.footerWrap .fRight {float:right;} */
.footerWrap .fLeft,
.footerWrap .fRight {width: 50%;}
.fLeft .fLogo {width:250px; height:50px; margin-bottom:38px; background:url(/images/logo.png) no-repeat center top; background-size:100% auto;}
.fLeft .f_add {font-size:16px; word-break: keep-all;}
.fRight .fTel {text-align: right; padding-bottom:10px; position: relative;}
.fTel .tel_icon {float:left; width:35px; height: 45px; background:url(/images/tel_icon.png) no-repeat center top; background-size:100% auto; position: absolute; top:-8px; right:190px;}
.fTel .tel_info {text-align: right; margin-left:0; margin-right:11px;}
.fRight .link {}
.fRight .link ul {
	overflow:hidden;
    max-width: 100%;
    width: 640px;
}
.fRight .link li {width: 100% !important; margin: 0 !important; float: left; /* margin-right:10px; */ /* width:160px; */ height:57px; border:1px solid rgba(0,0,0,.2); background-size:auto 100%;}
.fRight .link a {width: 32%; padding:2px 0 0 0;}
.fRight .link li {background: center / contain no-repeat #fff;}
.fRight .link .link01 {background-image:url(/images/link11.jpg);}
.fRight .link .link02 {background-image:url(/images/link22.png);}
.fRight .link .link03 {background-image:url(/images/link13.png);}
.fRight .link .link04 {background-image:url(/images/link14.png);}
.fRight .link .link05 {background-image:url(/images/link15.png);}
.fRight .link .link06 {background-image:url(/images/link16.jpg);}
footer .copyRight {text-align:center; padding:25px 0;}

@media only screen and (max-width: 1200px) {
	footer {width:100%;}
	.footerWrap {width:95%;}
	.fLeft .fLogo {width:220px; height:46px;}
	.fLeft .f_add {font-size: 14px;}
	.fTel .tel_icon {width: 30px; height: 40px; top:-5px; right:170px;}
	.fRight .tel_info {font-size: 16px;}
	.fRight .tel_num {font-size: 25px;}
	.fRight .link li {width: 135px; height: 53px; margin-right:7px;}

}
@media only screen and (max-width: 960px) {
	.footerWrap {padding:30px 0;}
	.footerWrap .fLeft,
	.footerWrap .fRight {width: 100%;}
	.fLeft .fLogo {width:210px; height:42px; margin:0 auto 20px;}
	.fLeft .f_add {text-align: center; padding-bottom:30px;}
	.fRight .fTel {display: none;}
	.fRight .link ul {overflow:hidden; width:80%; margin:0 auto;}
	.fRight .link li {width:32%; height: 53px; margin-right:7px;}
	footer .copyRight {font-size:12px; padding:10px 0;}
}
@media only screen and (max-width: 530px) {
	footer {font-size: 12px;}
	.fLeft .fLogo {width:180px; height:38px; margin:0 auto 20px;}
	.fRight .link ul {overflow:hidden; width:100%; margin:0 auto;}
	.fRight .link a {width: 49%; margin-bottom: 2%;}
}
@media only screen and (max-width: 400px) {
	.fRight .link li {width: 49%; margin-right:3px;}
	.fRight .link .link03 {margin-left:25%;}
}

