@charset "utf-8";

/* ======================================================
   .msec-01
=========================================================*/
.msec-01{position:relative;}
.msec-01 .slogan{position:absolute; left:0; width:100%; box-sizing:border-box; padding:0 20px; text-align:center; z-index:12;top:50%;-webkit-transform: translateY(-50%); -moz-transform: translateY(-50%);-ms-transform: translateY(-50%); -o-transform:  translateY(-50%);transform: translateY(-50%);}

.msec-01 .txt{font-size:50px; font-weight:400; color:#fff; letter-spacing:-0.03em; line-height:1.3em; margin-top:20px;}
.msec-01 .txt span{display:inline-block;vertical-align:top; background:#713fb9; padding:1px 3px 0 3px;}

.msec-01 .bg{position:relative;overflow:hidden;}
.msec-01 .bg img{width:100%;min-height:1080px;object-fit:cover;transform:scale(1.35, 1.35); -webkit-transform:scale(1.3, 1.3); -moz-transform:scale(1.3, 1.3); -ms-transform:scale(1.3, 1.3);-webkit-transition: transform 5s ease-in-out;-moz-transition: transform 5s ease-in-out;-o-transition: transform 5s ease-in-out;transition: transform 5s ease-in-out;}
.msec-01.ani .bg img{transform:scale(1,1); -webkit-transform:scale(1,1); -moz-transform:scale(1,1); -ms-transform:scale(1,1);}

	@media only screen and (max-width:1210px) {
		.msec-01 .logo img{ width:250px;}
		.msec-01 .txt{font-size:46px;}

		.msec-01 .bg img{min-height:900px;}
	}
	@media only screen and (max-width:999px) {
		.msec-01 .logo img{ width:200px;}
		.msec-01 .txt{font-size:38px;}

		.msec-01 .bg img{min-height:780px;}
	}
	@media only screen and (max-width:680px) {	
		.msec-01 .logo img{ width:160px;}
		.msec-01 .txt{font-size:32px; margin-top:15px}

		.msec-01 .bg img{min-height:660px;}
	}
	@media only screen and (max-width:480px) {
		.msec-01 .logo img{ width:120px;}
		.msec-01 .txt{font-size:26px;}

		.msec-01 .bg img{min-height:540px;}
	}



/* ======================================================
   .msec-02
=========================================================*/
.msec-02{background:url(/skins/img/main/msec02-bg.png) no-repeat center bottom #f0f1ee;  padding:310px 0 0px 0 ;box-sizing:border-box; min-height:1080px;}
.msec-02 .tits{text-align:center;}
.msec-02 .tits h3{margin-top:12px;font-size:40px; font-weight:700; color:#000; letter-spacing:-0.03em; line-height:1.2em;text-transform:uppercase;}
.msec-02 .tits p.txt{position:relative; margin-top:20px;}
.msec-02 .tits p.txt span{display:inline-block;vertical-align:top; font-size:20px; font-weight:400; color:#fff; background:#713fb9; letter-spacing:-0.03em; line-height:1.2em; padding:1px 3px 1px 3px;}

.msec-02 .cont{position:relative; box-sizing:border-box; margin:0 auto; padding:0 20px; margin-top:55px;text-align:center;}
.msec-02 .cont:before{width:1px; position:Absolute; left:50%; top:-37px; height:15px; background:url(/skins/img/main/tit-dash.png) repeat-y; display:block; content:"";}
.msec-02 .cont .txt p{font-size:18px; font-weight:600; color:#333; letter-spacing:-0.01em; line-height:1.4em; font-family:'dotum';}
	@media only screen and (max-width:1210px) {
		.msec-02{padding:250px 0 0 0;min-height:900px;}
		.msec-02 .tits h3{font-size:36px;}
		.msec-02 .tits p.logo img{height:65px;}
		.msec-02 .tits p.txt{margin-top:15px;}
		.msec-02 .tits p.txt span{font-size:18px;}

		.msec-02 .cont{margin-top:45px}
		.msec-02 .cont:before{height:13px; top:-35px;}
		.msec-02 .cont .txt p{font-size:15px;}
	}
	@media only screen and (max-width:999px) {
		.msec-02{padding:200px 0 0 0; background-size:1000px auto;min-height:780px;}
		.msec-02 .tits h3{font-size:32px; margin-top:9px;}
		.msec-02 .tits p.logo img{height:55px;}
		.msec-02 .tits p.txt{}
		.msec-02 .tits p.txt span{font-size:16px;}

		.msec-02 .cont{margin-top:35px}
		.msec-02 .cont:before{height:10px; top:-25px;}

		.msec-02 .cont .txt p{font-size:14px;}
	}
	@media only screen and (max-width:680px) {
		.msec-02{padding:150px 0 0 0;background-size:680px auto;min-height:660px;}
		.msec-02 .tits h3{font-size:28px; margin-top:5px;}
		.msec-02 .tits p.logo img{height:45px;}
		.msec-02 .tits p.txt{}
		.msec-02 .tits p span{font-size:14px;}

		.msec-02 .cont .txt p{font-size:13px;}
	}
	@media only screen and (max-width:480px) {
		.msec-02{padding:100px 0 0 0;background-size:480px auto;min-height:540px;}
		.msec-02 .tits h3{font-size:26px; margin-top:2px;}
		.msec-02 .tits p span{font-size:13px;}

	}



/* ======================================================
   .msec-03
=========================================================*/
.msec-03{background:url(/skins/img/main/msec03-bg.jpg) no-repeat center top #000; background-size:cover; padding:305px 0 30px 0}
.msec-03 .tits{text-align:center;}
.msec-03 .tits h3{margin-top:12px;font-size:40px; font-weight:700; color:#fff; letter-spacing:-0.03em; line-height:1.2em;text-transform:uppercase;}
.msec-03 .tits p.txt{position:relative; margin-top:20px;}
.msec-03 .tits p.txt span{display:inline-block;vertical-align:top; font-size:20px; font-weight:400; color:#fff; background:#713fb9; letter-spacing:-0.03em; line-height:1.2em; padding:1px 3px 1px 3px;}

.msec-03 .cont{position:relative; box-sizing:border-box; margin:0 auto; padding:0 20px; margin-top:55px;text-align:center;}
.msec-03 .cont:before{width:1px; position:Absolute; left:50%; top:-37px; height:15px; background:url(/skins/img/main/tit-dashw.png) repeat-y; display:block; content:"";}
.msec-03 .cont .txt p{font-size:18px; font-weight:600; color:#fff; letter-spacing:-0.01em; line-height:1.4em;font-family:'dotum';}
.msec-03 .cont .img {margin:0 auto;margin-top:110px;/* max-width:1170px; */; width:calc(100% + 40px); margin-left:-20px}
.msec-03 .cont .img .roll{background-image: url(/skins/img/main/msec03-img.png); background-image: -webkit-image-set(url(/skins/img/main/msec03-img.png) 1x, url(/skins/img/main/msec03-img.png) 2x );width:4000px;height:369px;  background-size:2000px; -webkit-animation:scroll-grid 100s linear infinite;  animation:scroll-grid 100s linear infinite}
	
.msec-03 .cont .slick-list{margin:0 -15px}
.msec-03 .cont .slick-list .item{margin:0 15px}
.msec-03 .cont .item img{width:100%;/* height:369px;object-fit:cover; */}	
	@media only screen and (max-width:1210px) {
		.msec-03{padding:250px 0 30px 0}
		.msec-03 .tits h3{font-size:36px;}
		.msec-03 .tits p.logo img{height:65px;}
		.msec-03 .tits p.txt{margin-top:15px;}
		.msec-03 .tits p.txt span{font-size:18px;}

		.msec-03 .cont{margin-top:45px}
		.msec-03 .cont:before{height:13px; top:-35px;}
		.msec-03 .cont .txt p{font-size:15px;}

		.msec-03 .cont .img {margin-top:80px;}
		
	}
	@media only screen and (max-width:999px) {
		.msec-03{padding:200px 0 30px 0; background-size:1000px auto}
		.msec-03 .tits h3{font-size:32px; margin-top:9px;}
		.msec-03 .tits p.logo img{height:55px;}
		.msec-03 .tits p.txt{}
		.msec-03 .tits p.txt span{font-size:16px;}

		.msec-03 .cont{margin-top:35px}
		.msec-03 .cont:before{height:10px; top:-25px;}

		.msec-03 .cont .txt p{font-size:14px;}
		.msec-03 .cont .img {margin-top:50px;}
		.msec-03 .cont .img .roll{width:3360px;height:310px;  background-size:1680px;-webkit-animation:scroll-grid2 100s linear infinite;  animation:scroll-grid2 100s linear infinite}

		/* .msec-03 .cont .item img{height:310px;}	 */

		.msec-03 .cont .slick-list{margin:0 -10px}
		.msec-03 .cont .slick-list .item{margin:0 10px}
	}
	@media only screen and (max-width:680px) {
		.msec-03{padding:150px 0 30px 0;background-size:680px auto}
		.msec-03 .tits h3{font-size:28px; margin-top:5px;}
		.msec-03 .tits p.logo img{height:45px;}
		.msec-03 .tits p.txt{}
		.msec-03 .tits p.txt span{font-size:14px;}

		.msec-03 .cont .txt p{font-size:13px;}
		.msec-03 .cont .img {margin-top:30px;}
		.msec-03 .cont .img .roll{width:2820px;height:260px;  background-size:1410px;-webkit-animation:scroll-grid3 100s linear infinite;  animation:scroll-grid3 100s linear infinite}

		/* .msec-03 .cont .item img{height:260px;}	 */
	}
	@media only screen and (max-width:480px) {
		.msec-03{padding:100px 0 30px 0;background-size:480px auto}
		.msec-03 .tits h3{font-size:26px; margin-top:2px;}
		.msec-03 .tits p span{font-size:13px;}

		.msec-03 .cont .img .roll{width:2180px;height:200px;  background-size:1090px;-webkit-animation:scroll-grid4 100s linear infinite;  animation:scroll-grid4 100s linear infinite}

		/* .msec-03 .cont .item img{height:200px;}	 */
		.msec-03 .cont .slick-list{margin:0 -5px}
		.msec-03 .cont .slick-list .item{margin:0 5px}
	}

	
	@-webkit-keyframes scroll-grid {
	  0% {
		-webkit-transform:translate3d(0, 0, 0);
		transform:translate3d(0, 0, 0)
	  }
	  100% {
		-webkit-transform:translate3d(-2000px, 0, 0);
		transform:translate3d(-2000px, 0, 0)
	  }
	}
	@keyframes scroll-grid {
	  0% {
		-webkit-transform:translate3d(0, 0, 0);
		transform:translate3d(0, 0, 0)
	  }
	  100% {
		-webkit-transform:translate3d(-2000px, 0, 0);
		transform:translate3d(-2000px, 0, 0)
	  }
	}

	@-webkit-keyframes scroll-grid2 {
	  0% {
		-webkit-transform:translate3d(0, 0, 0);
		transform:translate3d(0, 0, 0)
	  }
	  100% {
		-webkit-transform:translate3d(-1680px, 0, 0);
		transform:translate3d(-1680px, 0, 0)
	  }
	}
	@keyframes scroll-grid2 {
	  0% {
		-webkit-transform:translate3d(0, 0, 0);
		transform:translate3d(0, 0, 0)
	  }
	  100% {
		-webkit-transform:translate3d(-1680px, 0, 0);
		transform:translate3d(-1680px, 0, 0)
	  }
	}

	@-webkit-keyframes scroll-grid3 {
	  0% {
		-webkit-transform:translate3d(0, 0, 0);
		transform:translate3d(0, 0, 0)
	  }
	  100% {
		-webkit-transform:translate3d(-1410px, 0, 0);
		transform:translate3d(-1410px, 0, 0)
	  }
	}
	@keyframes scroll-grid3 {
	  0% {
		-webkit-transform:translate3d(0, 0, 0);
		transform:translate3d(0, 0, 0)
	  }
	  100% {
		-webkit-transform:translate3d(-1410px, 0, 0);
		transform:translate3d(-1410px, 0, 0)
	  }
	}
	@-webkit-keyframes scroll-grid4 {
	  0% {
		-webkit-transform:translate3d(0, 0, 0);
		transform:translate3d(0, 0, 0)
	  }
	  100% {
		-webkit-transform:translate3d(-1090px, 0, 0);
		transform:translate3d(-1090px, 0, 0)
	  }
	}
	@keyframes scroll-grid4 {
	  0% {
		-webkit-transform:translate3d(0, 0, 0);
		transform:translate3d(0, 0, 0)
	  }
	  100% {
		-webkit-transform:translate3d(-1090px, 0, 0);
		transform:translate3d(-1090px, 0, 0)
	  }
	}



/* ======================================================
   .msec-04
=========================================================*/
.msec-04{background:#f1f1f1; padding:200px 0}
.msec-04 .tits{text-align:center;}
.msec-04 .tits h3{margin-top:12px;font-size:40px; font-weight:700; color:#333; letter-spacing:-0.03em; line-height:1.2em;}
.msec-04 .tits p.txt{position:relative;margin-top:20px;}
.msec-04 .tits p.txt span{display:inline-block;vertical-align:top; font-size:20px; font-weight:400; color:#fff; background:#713fb9; letter-spacing:-0.03em; line-height:1.2em; padding:1px 3px 1px 3px;}

.msec-04 .cont{max-width:1210px; position:relative; box-sizing:border-box; margin:0 auto; padding:0 20px; margin-top:55px;}
.msec-04 .cont:before{width:1px; position:Absolute; left:50%; top:-37px; height:15px; background:url(/skins/img/main/tit-dash.png) repeat-y; display:block; content:"";}
.msec-04 .cont img{max-width:1170px ; width:100%;}

.msec-04 .cont table{table-layout:fixed}
.msec-04 .cont table thead th{border-bottom:1px solid #ccc; border-top:1px solid #ccc; font-size:18px; font-weight:600; color:#333;text-align:center; padding:15px 0;}
.msec-04 .cont table tbody td{border-bottom:1px solid #ccc; padding:15px 0;text-align:left;font-size:16px; font-weight:400; color:#555; letter-spacing:0; line-height:1.3em;}
.msec-04 .cont table tbody td a{display:block;}
.msec-04 .cont table tbody td .btxt{font-size:18px; font-weight:600; color:#333; letter-spacing:0; line-height:1.3em; display:inline-block;vertical-align:top; position:relative; max-width:100%; box-sizing:border-box;}
.msec-04 .cont table tbody td .btxt.new{padding-right:24px}
.msec-04 .cont table tbody td .btxt.new:after{width:17px;height:17px; position:absolute; right:0; top:3px; display:block; content:"";background:url(/skins/img/main/ico-new.jpg) no-repeat center center;}
.msec-04 .cont table tbody td .stxt{font-size:16px; font-weight:400; color:#555; letter-spacing:0; line-height:1.3em;margin-top:5px;}

.msec-04 .cont .paging{margin-top:45px;}
.msec-04 .cont .paging ul{font-size:0;text-align:center;}
.msec-04 .cont .paging li{margin:0 10px; display:inline-block;vertical-align:top; }
.msec-04 .cont .paging li a{display:block; position:relative; text-decoration: none;min-width:24px; height:24px;font-size:16px; color:#555; text-align:center;line-height:26px;font-weight:400;box-sizing:border-box; padding:0 5px}
.msec-04 .cont .paging li a.active, .paging li a.active:hover{color:#fff; background:#cd4c3b; font-weight:700;}

.msec-04 .cont .desktop{display:block;}
.msec-04 .cont .mobile{display:none;}
	@media only screen and (max-width:1210px) {
		.msec-04{padding:160px 0}
		.msec-04 .tits h3{font-size:36px;}
		
		.msec-04 .tits p.logo img{height:65px;}
		.msec-04 .tits p.txt{margin-top:15px;}
		.msec-04 .tits p.txt span{font-size:18px;}

		.msec-04 .cont{margin-top:45px}
		.msec-04 .cont:before{height:13px; top:-35px;}
	}
	@media only screen and (max-width:999px) {
		.msec-04{padding:120px 0}
		.msec-04 .tits h3{font-size:32px; margin-top:9px;}
		.msec-04 .tits p.logo img{height:55px;}
		.msec-04 .tits p.txt{}
		.msec-04 .tits p.txt span{font-size:16px;}

		.msec-04 .cont{margin-top:35px}
		.msec-04 .cont:before{height:10px; top:-25px;}

		.msec-04 .cont table thead th{font-size:16px;}
		.msec-04 .cont table tbody td {font-size:14px;}
		.msec-04 .cont table tbody td .btxt{font-size:16px;}
		.msec-04 .cont table tbody td .btxt.new{padding-right:20px;}
		.msec-04 .cont table tbody td .btxt.new:after{width:13px; height:13px; background-size:100% auto;osition:relative ;display:inline-block;vertical-align:top; right:auto; top:auto; margin-top:4px; margin-left:4px;}
		.msec-04 .cont table tbody td .stxt{font-size:14px;}
		
		.msec-04 .cont .paging{margin-top:35px;}
		.msec-04 .cont .paging li{margin:0 6px;}
		.msec-04 .cont .paging li a{font-size:14px;}

		.msec-04 .cont .mobile{display:block;}
		.msec-04 .cont .desktop{display:none;}
	}
	@media only screen and (max-width:680px) {
		.msec-04{padding:80px 0}
		.msec-04 .tits h3{font-size:28px; margin-top:5px;}
		.msec-04 .tits p.logo img{height:45px;}
		.msec-04 .tits p.txt{}
		.msec-04 .tits p.txt span{font-size:14px;}
		.msec-04 .cont table colgroup col:nth-child(2){width:90px}
		.msec-04 .cont table colgroup col:nth-child(3){width:60px}
		.msec-04 .cont table thead th{font-size:14px; padding:12px 0}
		.msec-04 .cont table tbody td {font-size:13px; padding:12px 0}
		.msec-04 .cont table tbody td .btxt{font-size:14px;}
		.msec-04 .cont table tbody td .btxt.new{padding-right:16px;}
		.msec-04 .cont table tbody td .btxt.new:after{width:10px; height:10px;}
		.msec-04 .cont table tbody td .stxt{font-size:13px;}
		
		.msec-04 .cont .paging{margin-top:35px;}
		.msec-04 .cont .paging li{margin:0 3px;}
		.msec-04 .cont .paging li a{font-size:13px; min-width:20px; height:20px; line-height:22px;}

	}
	@media only screen and (max-width:480px) {
		.msec-04{padding:60px 0}
		.msec-04 .tits h3{font-size:26px; margin-top:2px;}
		.msec-04 .tits p span{font-size:13px;}
		
		
		.msec-04 .cont table colgroup col:nth-child(2){width:80px}
		.msec-04 .cont table colgroup col:nth-child(3){display:none;}
		.msec-04 .cont table thead th:nth-child(3){display:none;}
		.msec-04 .cont table tbody td:nth-child(3){display:none;}

		.msec-04 .cont table thead th{font-size:13px; padding:10px 0}
		.msec-04 .cont table tbody td {font-size:12px; padding:10px 0}
		.msec-04 .cont table tbody td .btxt{font-size:13px;}
		.msec-04 .cont table tbody td .btxt.new:after{margin-top:3px;}
		.msec-04 .cont table tbody td .stxt{font-size:12px;}

		.msec-04 .cont .paging{margin-top:25px;}
	}







/* ======================================================
   .msec-05
=========================================================*/
.msec-05{}
.msec-05 .maps{}
.msec-05 .maps img{width:100%;max-height:890px; min-height:400px;object-fit:cover;}
.msec-05 .txt{text-align:center; margin-top:40px;padding:0 20px;}
.msec-05 .txt p{font-size:24px; font-weight:700; color:#333; letter-spacing:-0.03em; line-height:1.3em;}
	@media only screen and (max-width:1210px) {
		.msec-05 .txt{margin-top:30px;}
		.msec-05 .txt p{font-size:20px}
	}
	@media only screen and (max-width:999px) {
		.msec-05 .txt{margin-top:20px;}
		.msec-05 .txt p{font-size:18px}
	}
	@media only screen and (max-width:680px) {
		.msec-05 .txt{margin-top:15px;}
		.msec-05 .txt p{font-size:16px}
	}
	@media only screen and (max-width:480px) {
		.msec-05 .txt p{font-size:14px}
	}