@charset "utf-8";


@media all and (min-width:1024px){

		/*header*/
		.header{background-color:rgba(0,0,0,0.5);position:fixed;z-index:99999;width:100%;height:90px;box-shadow:0px 3px 5px 1px rgba(211,211,211,0);transition:0.3s;}
		.header.on{background-color:rgba(255,255,255,1);transition:0.3s;box-shadow:0px 3px 5px 1px rgba(211,211,211,0.3);}
		.h-wrap{max-width:1750px;height:calc(100% - 20px);margin:10px auto;position:relative}
		.h-wrap h1{position:absolute;left:50%;width:auto; height:70px;transform:translate(-50%,0);}
		.h-wrap h1 img{width:auto;height:100%;}

		.top-menu{width:auto;position:absolute;left:0;}
		.top-menu .hamburger{display:none;z-index:9999;}
		.top-menu ul:after{content:'';display:block;clear:both;}
		.top-menu ul li{float:left;padding:20px 0;}
		.top-menu ul li a{display:block;width:auto;padding: 5px 15px;text-align:center;color:#ccc;font-size:17px;font-weight:bold;}
		.top-menu ul li a:hover{color:#fff;}
		.top-menu .div_bg{display:none;}
		.header.on .top-menu li a{color:#777;}
		.header.on .top-menu li a:hover{color:#000;}

		.user-box{position:absolute;right:0;width:100px;height:80px;}
		.user-box .user-icon{display:block;color:#ccc;width:100px;height:70px;font-size:24px;padding:22px 0;text-align:center;box-sizing:border-box;margin-bottom:10px;}
		.user-box .user-icon:hover{color:#fff;}
		.header.on .user-box .user-icon{color:#777;}
		.header.on .user-box .user-icon:hover{color:#000;}
		.user-depth{display:none;width:100px;}
		.user-depth.on{display:block;}
		.user-depth ul{background-color:#fff}
		.header.on .user-depth ul{background-color:#f5f5f5}
		.user-depth ul li a{display:block;color:#000;width:100%;padding:15px 0;font-size:15px;text-align:center;}
		.user-depth ul li a:hover{background-color:rgba(0,0,0,0.1);}

		a.top{position: fixed;right: 10%; bottom: 150px; display: none;width:50px;height:50px;border:1px solid #ddd;text-align:center;line-height:50px;transition:0.3s;background-color: #fff;}
		a.top .fa{display:block;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:0.3s;}
		a.top:hover{line-height:65px;transition:0.3s;color:#000;font-weight:700;border-color:#000;}
		a.top:hover .fa{opacity:1;top:30%;transition:0.3s;}

		.section{position:relative;}
		.section0_bg{background-color: rgba(44, 62, 80, 0.3); background-image: url(../images/main/pattern.png); background-repeat: repeat; height: 100vh; left: 0; position: absolute; top: 0; width: 100%; z-index: 0;}
		.scroll-down {position: absolute;left: 50%;transform:translate(-50%,0);bottom: 40px;border: 2px solid #fff;border-radius: 50%;height: 50px;width: 50px;display: block;z-index: 10;text-align: center;}
		.scroll-down span {position: relative;color: #fff;-webkit-animation-name: drop;-webkit-animation-duration: 1s;-webkit-animation-timing-function: linear;-webkit-animation-delay: 0s;-webkit-animation-iteration-count: infinite;-webkit-animation-play-state: running;animation-name: drop;animation-duration: 1s;animation-timing-function: linear;animation-delay: 0s;animation-iteration-count: infinite;animation-play-state: running;}
		@-webkit-keyframes drop	{
			0%   { top:0px;  opacity: 0;}
			30%  { top:10px; opacity: 1;}
			100% { top:25px; opacity: 0;}
		}
		@keyframes drop	{
			0%   { top:0px;  opacity: 0;}
			30%  { top:10px; opacity: 1;}
			100% { top:25px; opacity: 0;}
		}
		#section0{width:100%;height:100vh;background:url('../images/main/cover.jpg');background-attachment: fixed; background-repeat: no-repeat; background-size: cover;}
		.intro {font-family:Nanum-M;box-sizing:border-box;position: absolute;width: 100%;top: 50%;left: 0;text-align: center;-webkit-transform: translate(0%, -50%);-moz-transform: translate(0%, -50%);-ms-transform: translate(0%, -50%);-o-transform: translate(0%, -50%);transform: translate(0%, -50%);padding: 0 15px;}
		.start {font-family:Nanum-M;box-sizing:border-box;font-size: 20px;font-weight: 0;font-style: normal;text-transform: none;margin: 15px 0;color:#fff;}
		.intro h1 { font-family:Nanum-M;box-sizing:border-box;font-weight: 800;font-size:70px;margin: 5px 0 5px;color:#fff;}


		
		#section1{height:300px;padding:200px 0;}
		.sec1-mtxt{font-family:Nanum-M;font-weight:600;font-size:30px;padding:15px 0;box-sizing:border-box;}
		.sec1-stxt{padding:15px 0;font-family:Nanum-M;font-weight:600;font-size:15px;color:#222;}
		.dp-none{display:none;}
		#section1 .bn-brand{margin-bottom:30px;margin-top:50px;}
		.bn-brand{background-color:#222;color:#fff;width:200px; height:50px; border-radius:25px;margin-top:35px;line-height:50px;border:none;}
		.bn-brand i{position:relative;top:0;left:10px;transition:0.3s}
		.bn-brand:hover{background-color:#777;color:#fff;border:none;}
		.bn-brand:hover i{left:15px;transition:0.3s}
		
		
		#section2{height:400px;padding:200px 0;background-color:rgba(25,25,25,0.1);}
		#section2 h2.sec2-mtxt{font-family:Nanum-M;font-weight:600;font-size:30px;margin-bottom:30px;}
		#section2 p.sec2-stxt{font-family:Nanum-M;font-weight:600;font-size:15px;margin-bottom:50px;color:#222;line-height:25px;}
		.section2_box{margin:0 auto;width:1170px; height:100%;}
		.r_link{width: 25%; float: left;position: relative;  min-height: 1px; padding-right: 15px; padding-left: 15px;box-sizing:border-box;    cursor: pointer;}
		.effect-bong {overflow:hidden;height:260px;transition:0.3;}
		.iconbox{background: #fff;border-bottom: 1px solid #d4d4d4;text-align: center;padding: 40px 20px;margin: 0 0 20px;box-sizing:border-box;}
		.effect-bong > div {    position: relative;}
		.iconbox-title {margin: 0 0 15px;padding: 0;font-size: 20px;font-weight: 700;}
		.left_icon {color: #000000;position: relative;margin-bottom:15px;}
		.font_text {color: #000000;position: relative;font-size: 14px;}
		.iconbox-icon {margin: 0 0 15px;font-size: 32px;color: #222;}
		.iconbox-desc h4{font-size: 15px;font-weight:bold;margin-bottom:15px;}
		.iconbox-desc p{font-size: 14px;margin-bottom:15px;}
		@-webkit-keyframes slideInLeft {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInLeft {
  0% {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

		/*bxslider section3*/

		#section3{padding-top:100px;box-sizing:border-box;}
		.js-load{height:0px; transition:0.3s;overflow:hidden;box-sizing:border-box;}
		.js-load.active {height:430px; transition:0.3s;overflow:hidden;box-sizing:border-box;}
		h2.main-text {width: 300px;height: 50px;font-size: 30px;font-weight: 600;font-family: Nanum-M;margin: 0 auto 80px;}
		.sec2-hid{width:1100px;margin:0 auto;}
		.sec2-imgwp{width:100%;position:relative;clear:both;}
		.sec2-imgwp .sec2-img {box-sizing: border-box;float: left;margin-right: 2%;width: 32%;height:400px;text-align: center;    border: 1px solid #ddd;}
		.sec2-imgwp .sec2-img:nth-of-type(3){margin:0;}
		.sec2-imgwp .sec2-img img {height: auto;width: 100%;}
		.sec2-imgwp .sec2-img .roxy-txt {box-sizing: border-box;width: 100%;	height: auto;padding: 30px;color: #fff;font-size: 15px;text-align: left;}
		.sec2-imgwp .sec2-img h2 {font-family:Nanum-M;text-align:center;box-sizing: border-box;font-weight: 600;margin: 0;padding-bottom:15px;font-size:25px;white-space:nowrap;}
		.sec2-imgwp .sec2-img .bn-viwe{display:block;color:#222;margin:10px auto;line-height:40px;width:150px;height:40px;border-radius:20px; background-color:rgba(0,0,0,0);border:1px solid #222;}

		.sec2-img:hover{background: rgba(0,0,0,0.8);}
		.sec2-img:hover h2{color:#fff;transition:0.3s;}
		.sec2-img:hover img {box-sizing: border-box;opacity: 0.5;}
		.sec2-img:hover .roxy-txt::before,.sec2-img:hover p {box-sizing: border-box;opacity: 1;	color:#fff;transition:0.3s}
		.sec2-img:hover .bn-viwe{opacity: 1;color:#fff;border:1px solid #fff;}
		.sec2-img:hover .bn-viwe:hover{color:#222;background-color:#fff;}

		.bn-more{margin-bottom:150px;background-color:#222;color:#fff;width:200px; height:50px; border-radius:25px;margin-top:35px;line-height:50px;border:none;}
		.bn-more i{position:relative;top:0;left:10px;transition:0.3s}
		.bn-more:hover{background-color:#777;color:#fff;border:none;}
		.bn-more:hover i{left:15px;transition:0.3s}
		
		/*footer*/

		.footer{width:100%;height:auto;border-bottom:1px solid #999;border-top:1px solid #999;}
		.footer ul{width:1100px;height:auto;margin:0 auto;padding:0 20px;box-sizing:border-box;}
		.footer ul:after{content:"";display:block;clear:both;}
		.footer ul li{float:left;height:50px;padding:0 20px;}
		.footer ul li a{display:block;width:100%;height:50px;line-height:50px;font-size:13px;color:#444;transition:0.3s;font-weight:400;}
		.footer ul li a:hover{color:#222;font-weight:700;transition:0.3s}
		.footer ul li:first-of-type{padding-left:0;}
		.footer-copy{margin:0 auto;width:1100px; height:80px;line-height:50px;font-size:15px;font-weight:400;font-family:Nanum-M;padding:0 20px;box-sizing:border-box;text-align:left;color:#222;}


		
		.pop-layer2 {display: block; position: fixed; top: 50%; left: 50%; transform:translate(-50%,-50%);width:500px; height: auto; background-color: #fff; border: 2px solid #000; z-index: 10;}
		.pop-layer2 .pop-container2 {padding: 25px 25px;}
		.pop-layer2 p.ctxt2 {width:100%;height:auto; color:#000; font-size:16px;font-weight:400;font-family:Nanum-M;line-height:35px;margin-bottom:15px;text-align:center;}
		.pop-layer2 p.ctxt2 b{font-size:18px;font-weight:600;}
		.pop-layer2 .btn-r2 {width: 100%; margin: 10px 0; padding-top: 10px; text-align: center;}	
		
		

}











/* ========== TABLET ========== */
@media all and (max-width:1024px){

		/*header*/
		.header{background-color:rgba(0,0,0,0.5);position:fixed;z-index:99999;width:100%;height:90px;box-shadow:0px 3px 5px 1px rgba(211,211,211,0);transition:0.3s;}
		.header.on{background-color:rgba(255,255,255,1);transition:0.3s;box-shadow: 0px 3px 5px 1px rgba(211,211,211,0.3);}
		.h-wrap{height:calc(100% - 20px);margin:10px auto;position:relative}
		.h-wrap h1{position:absolute;left:50%;width:auto;height:70px;transform:translate(-50%,0);}
		.h-wrap h1 img{width:auto;height:100%;}

		.top-menu{position:absolute;left:0;width:100px;height:70px;  padding: 25px 35px;    box-sizing: border-box;}
		.top-menu ul{display:none;width: 300px;position: absolute;left: 0;top: -10px;background-color: #3c3c3c;padding-top: 90px;z-index: 9000;height:100vh;transition:0.3s;}
		.top-menu ul:after{content:'';display:block;clear:both;}
		.top-menu ul li{float:none;padding:20px 0;}
		.top-menu ul li a{display:block;width:auto;padding: 5px 15px;text-align:center;color:#FFF;font-size:17px;font-weight:bold;}
		.top-menu ul li a:hover{color:#fff;}
		
		.top-menu .div_bg{display:none;width:100%;height:100vh;z-index:500;position:fixed;top:0;left:0;background-color:rgba(0,0,0,0.5);transition:0.3s;}
		.header.on .top-menu ul{display:none;background-color: #f9f9f9;}
		.header.on .top-menu li a{color:#777;}
		.header.on .top-menu li a:hover{color:#000;}


		.top-menu.on ul{display:block;transition:0.3s}
		.header.on  .top-menu.on ul{display:block;transition:0.3s;}
		.top-menu.on .div_bg{display:block;transition:0.3s}

		.user-box{position:absolute;right:0;width:100px;height:80px;}
		.user-box .user-icon{display:block;color:#ccc;width:100px;height:70px;font-size:24px;padding:22px 0;text-align:center;box-sizing:border-box;margin-bottom:10px;}
		.user-box .user-icon:hover{color:#fff;}
		.header.on .user-box .user-icon{color:#777;}
		.header.on .user-box .user-icon:hover{color:#000;}
		.user-depth{display:none;width:100px;}
		.user-depth.on{display:block;}
		.user-depth ul{background-color:#fff}
		.header.on .user-depth ul{background-color:#f5f5f5}
		.user-depth ul li a{display:block;color:#000;width:100%;padding:15px 0;font-size:15px;text-align:center;}
		.user-depth ul li a:hover{background-color:rgba(0,0,0,0.1);}

		.top-menu .hamburger{display:block;z-index:9999;position : relative;width : 30px;height : 20px;}
		.hamburger,.hamburger span {	display : inline-block;transition : all .4s;box-sizing : border-box;}
		.hamburger span {position : absolute;left : 0;width : 100%;height : 2px;background-color : #fff;border-radius : 4px;}
		.header.on .hamburger span {;background-color : #aaa;}
		.hamburger span:nth-of-type(1) {top : 0;}
		.hamburger span:nth-of-type(2) {top : 9px;}
		.hamburger span:nth-of-type(3) {bottom : 0;}







	.hamburger.active1 span:nth-of-type(1) {	-webkit-animation:menu-bar01 .75s forwards;	animation:menu-bar01 .75s forwards;}
	@-webkit-keyframes menu-bar01 {
		0% {-webkit-transform:translateY(9px) rotate(45deg);}
		50% {-webkit-transform:translateY(9px) rotate(0);}
		100% {-webkit-transform:translateY(0) rotate(0);}
	}
	@keyframes menu-bar01 {
		0% {transform : translateY(9px) rotate(45deg);}
		50% {transform : translateY(9px) rotate(0);}
		100% {transform : translateY(0) rotate(0);}
	}
	.hamburger.active1 span:nth-of-type(2) {	transition : all .25s .25s;opacity : 1;}
	.hamburger.active1 span:nth-of-type(3) {	-webkit-animation : menu-bar02 .75s forwards;	animation : menu-bar02 .75s forwards;}
	@-webkit-keyframes menu-bar02 {
		0% {-webkit-transform:translateY(-9px) rotate(-45deg);}
		50% {-webkit-transform:translateY(-9px) rotate(0);}
		100% {-webkit-transform:translateY(0) rotate(0);}
	}
	@keyframes menu-bar02 {
		0% {transform : translateY(-9px) rotate(-45deg);}
		50% {transform : translateY(-9px) rotate(0);}
		100% {transform : translateY(0) rotate(0);}
	}
	.hamburger.active2 span:nth-of-type(1) {-webkit-animation : active-menu-bar01 .75s forwards;	animation : active-menu-bar01 .75s forwards;}
	@-webkit-keyframes active-menu-bar01 {
		0% {-webkit-transform: translateY(0) rotate(0);}
		50% {-webkit-transform : translateY(9px) rotate(0);}
		100% {-webkit-transform : translateY(9px) rotate(45deg);}
	}
	@keyframes active-menu-bar01 {
		0% {transform : translateY(0) rotate(0);}
		50% {transform : translateY(9px) rotate(0);}
		100% {transform : translateY(9px) rotate(45deg);}
	}
	.hamburger.active2 span:nth-of-type(2) {opacity : 0;}
	.hamburger.active2 span:nth-of-type(3) {-webkit-animation : active-menu-bar03 .75s forwards;	animation : active-menu-bar03 .75s forwards;}
	@-webkit-keyframes active-menu-bar03 {
		0% {-webkit-transform : translateY(0) rotate(0);}
		50% {-webkit-transform : translateY(-9px) rotate (0);}
		100% {-webkit-transform : translateY(-9px) rotate(-45deg);}
	}
	@keyframes active-menu-bar03 {
		0% {transform : translateY(0) rotate(0);}
		50% {transform : translateY(-9px) rotate(0);}
		100% {transform : translateY(-9px) rotate(-45deg);}
	}
		a.top{position: fixed;right: 10%; bottom: 150px; display: none;width:50px;height:50px;border:1px solid #ddd;text-align:center;line-height:50px;transition:0.3s;background-color: #fff;}
		a.top .fa{display:block;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:0.3s;}

		.section{position:relative;}
		.section0_bg{background-color: rgba(44, 62, 80, 0.3); background-image: url(../images/main/pattern.png); background-repeat: repeat; height: 100vh; left: 0; position: absolute; top: 0; width: 100%; z-index: 0;}
		.scroll-down {position: absolute;left: 50%;transform:translate(-50%,0);bottom: 40px;border: 2px solid #fff;border-radius: 50%;height: 50px;width: 50px;display: block;z-index: 10;text-align: center;}
		.scroll-down span {position: relative;color: #fff;-webkit-animation-name: drop;-webkit-animation-duration: 1s;-webkit-animation-timing-function: linear;-webkit-animation-delay: 0s;-webkit-animation-iteration-count: infinite;-webkit-animation-play-state: running;animation-name: drop;animation-duration: 1s;animation-timing-function: linear;animation-delay: 0s;animation-iteration-count: infinite;animation-play-state: running;}
		@-webkit-keyframes drop	{
			0%   { top:0px;  opacity: 0;}
			30%  { top:10px; opacity: 1;}
			100% { top:25px; opacity: 0;}
		}
		@keyframes drop	{
			0%   { top:0px;  opacity: 0;}
			30%  { top:10px; opacity: 1;}
			100% { top:25px; opacity: 0;}
		}
		#section0{width:100%;height:100vh;background:url('../images/main/cover.jpg') center center;background-attachment: fixed; background-repeat: no-repeat; background-size: cover;}
		.intro {font-family:Nanum-M;box-sizing:border-box;position: absolute;width: 100%;top: 50%;left: 0;text-align: center;-webkit-transform: translate(0%, -50%);-moz-transform: translate(0%, -50%);-ms-transform: translate(0%, -50%);-o-transform: translate(0%, -50%);transform: translate(0%, -50%);padding: 0 15px;}
		.start {font-family:Nanum-M;box-sizing:border-box;font-size: 20px;font-weight: 0;font-style: normal;text-transform: none;margin: 15px 0;color:#fff;}
		.intro h1 { font-family:Nanum-M;box-sizing:border-box;font-weight: 800;font-size:70px;margin: 5px 0 5px;color:#fff;}


		/*section1*/
		#section1{height:300px;padding:200px 0;}
		.sec1-mtxt{font-family:Nanum-M;font-weight:600;font-size:30px;padding:15px 0;box-sizing:border-box;}
		.sec1-stxt{padding:15px 0;font-family:Nanum-M;font-weight:600;font-size:15px;color:#222;}
		.dp-none{display:none;}
		#section1 .bn-brand{margin-bottom:30px;margin-top:50px;}
		.bn-brand{background-color:#222;color:#fff;width:200px; height:50px; border-radius:25px;margin-top:35px;line-height:50px;border:none;}
		.bn-brand i{position:relative;top:0;left:10px;transition:0.3s}
		.bn-brand:hover{background-color:#777;color:#fff;border:none;}
		.bn-brand:hover i{left:15px;transition:0.3s}
		
		/*section2*/		
		#section2{height:1100px;padding:150px 20px 0;background-color:rgba(25,25,25,0.1);box-sizing:border-box; }
		#section2 h2.sec2-mtxt{font-family:Nanum-M;font-weight:600;font-size:30px;margin-bottom:30px;}
		#section2 p.sec2-stxt{font-family:Nanum-M;font-weight:600;font-size:15px;margin-bottom:50px;color:#222;line-height:25px;}
		.section2_box{margin:0 auto;width:100%; height:100%;}
		.r_link{width: 50%; float: left;position: relative;  min-height: 1px; padding: 20px;box-sizing:border-box;    cursor: pointer;}
		.effect-bong {overflow:hidden;height:260px;transition:0.3;}
		.iconbox{background: #fff;border-bottom: 1px solid #d4d4d4;text-align: center;padding: 40px 20px;margin: 0 0 20px;box-sizing:border-box;}
		.effect-bong > div {    position: relative;}
		.iconbox-title {margin: 0 0 15px;padding: 0;font-size: 20px;font-weight: 700;}
		.left_icon {color: #000000;position: relative;margin-bottom:15px;}
		.font_text {color: #000000;position: relative;font-size: 14px;}
		.iconbox-icon {margin: 0 0 15px;font-size: 32px;color: #222;}
		.iconbox-desc h4{font-size: 15px;font-weight:bold;margin-bottom:15px;}
		.iconbox-desc p{font-size: 14px;margin-bottom:15px;}
		@-webkit-keyframes slideInLeft {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInLeft {
  0% {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}


		/*section3*/

		#section3{padding:100px 20px 0;box-sizing:border-box;}
		.js-load{height:0px; transition:0.3s;overflow:hidden;box-sizing:border-box;}
		.js-load.active {height:380px; transition:0.3s;overflow:hidden;box-sizing:border-box;}
		h2.main-text {width: 300px;height: 50px;font-size: 30px;font-weight: 600;font-family: Nanum-M;margin: 0 auto 80px;}
		.sec2-hid{width:100%;margin:0 auto;}
		.sec2-imgwp{width:100%;position:relative;clear:both;}
		.sec2-imgwp .sec2-img {box-sizing: border-box;float: left;margin-right: 2%;width: 32%;height:auto;text-align: center; border: 1px solid #ddd;}
		.sec2-imgwp .sec2-img:nth-of-type(3){margin:0;}
		.sec2-imgwp .sec2-img img {height: auto;width: 100%;}
		.sec2-imgwp .sec2-img .roxy-txt {box-sizing: border-box;width: 100%;	height: auto;padding: 30px;color: #fff;font-size: 15px;text-align: left;}
		.sec2-imgwp .sec2-img h2 {font-family:Nanum-M;text-align:center;box-sizing: border-box;font-weight: 600;margin: 0;padding-bottom:15px;font-size:15px;white-space:nowrap;}
		.sec2-imgwp .sec2-img .bn-viwe{display:block;color:#222;margin:10px auto;line-height:40px;width:150px;height:40px;border-radius:20px; background-color:rgba(0,0,0,0);border:1px solid #222;}


		.bn-more{margin-bottom:150px;background-color:#222;color:#fff;width:200px; height:50px; border-radius:25px;margin-top:35px;line-height:50px;border:none;}
		.bn-more i{position:relative;top:0;left:10px;transition:0.3s}
		.bn-more:hover{background-color:#777;color:#fff;border:none;}
		.bn-more:hover i{left:15px;transition:0.3s}
		
		/*footer*/

		.footer{width:100%;height:auto;border-bottom:1px solid #999;border-top:1px solid #999;}
		.footer ul{width:100%;height:auto;margin:0 auto;padding:0 20px;box-sizing:border-box;}
		.footer ul:after{content:"";display:block;clear:both;}
		.footer ul li{float:left;height:50px;padding:0 20px;}
		.footer ul li a{display:block;width:100%;height:50px;line-height:50px;font-size:13px;color:#444;transition:0.3s;font-weight:400;}
		.footer ul li a:hover{color:#222;font-weight:700;transition:0.3s}
		.footer ul li:first-of-type{padding-left:0;}
		.footer-copy{margin:0 auto;width:100%; height:80px;line-height:50px;font-size:15px;font-weight:400;font-family:Nanum-M;padding:0 20px;box-sizing:border-box;text-align:left;color:#222;}


		
		.pop-layer2 {display: block; position: fixed; top: 50%; left: 50%; transform:translate(-50%,-50%);width:500px; height: auto; background-color: #fff; border: 2px solid #000; z-index: 10;}
		.pop-layer2 .pop-container2 {padding: 25px 25px;}
		.pop-layer2 p.ctxt2 {width:100%;height:auto; color:#000; font-size:16px;font-weight:400;font-family:Nanum-M;line-height:35px;margin-bottom:15px;text-align:center;}
		.pop-layer2 p.ctxt2 b{font-size:18px;font-weight:600;}
		.pop-layer2 .btn-r2 {width: 100%; margin: 10px 0; padding-top: 10px; text-align: center;}	


}






/* ========== MOBILE ========== */
@media all and (max-width:765px){


		/*header*/
		.header{background-color:rgba(0,0,0,0.5);position:fixed;z-index:99999;width:100%;height:50px;box-shadow:0px 3px 5px 1px rgba(211,211,211,0);transition:0.3s;}
		.header.on{background-color:rgba(255,255,255,1);transition:0.3s;box-shadow: 0px 3px 5px 1px rgba(211,211,211,0.3);}
		.h-wrap{height:calc(100% - 10px);margin:5px auto;position:relative}
		.h-wrap h1{position:absolute;left:50%;width:auto;height:40px;transform:translate(-50%,0);}
		.h-wrap h1 a{display:block;height:40px;}
		.h-wrap h1 img{width:auto;height:100%;}

		.top-menu{position:absolute;left:0;width:100px;height:40px;  padding: 10px 35px;    box-sizing: border-box;}
		.top-menu ul{display:none;width: 300px;position: absolute;left: 0;top: -10px;background-color: #3c3c3c;padding-top: 90px;z-index: 9000;height:100vh;transition:0.3s;}
		.top-menu ul:after{content:'';display:block;clear:both;}
		.top-menu ul li{float:none;padding:20px 0;}
		.top-menu ul li a{display:block;width:auto;padding: 5px 15px;text-align:center;color:#FFF;font-size:17px;font-weight:bold;}
		.top-menu ul li a:hover{color:#fff;}
		
		.top-menu .div_bg{display:none;width:100%;height:100vh;z-index:500;position:fixed;top:0;left:0;background-color:rgba(0,0,0,0.5);transition:0.3s;}
		.header.on .top-menu ul{display:none;background-color: #f9f9f9;}
		.header.on .top-menu li a{color:#777;}
		.header.on .top-menu li a:hover{color:#000;}

		.top-menu.on ul{display:block;transition:0.3s;}
		.header.on  .top-menu.on ul{display:block;transition:0.3s;}
		.top-menu.on .div_bg{display:block;transition:0.3s;}

		.user-box{position:absolute;right:0;width:90px;height:40px;}
		.user-box .user-icon{display:block;color:#fff;width:80px;height:40px;font-size:24px;padding:7px 0;text-align:center;box-sizing:border-box;margin-bottom:5px;}
		.header.on .user-box .user-icon{color:#777;}
		.user-depth{display:none;width:100px;position:absolute;top:45px;right:0;}
		.user-depth.on{display:block;}
		.user-depth ul{background-color:#fff}
		.header.on .user-depth ul{background-color:#f5f5f5}
		.user-depth ul li a{display:block;color:#000;width:100%;padding:15px 0;font-size:15px;text-align:center;}
		.user-depth ul li a:hover{background-color:rgba(0,0,0,0.1);}

		.hamburger,.hamburger span {	display : inline-block;transition : all .4s;box-sizing : border-box;}
		.hamburger {display:block;position : relative;width : 30px;height : 20px;z-index:9999;}
		.hamburger span {position : absolute;left : 0;width : 100%;height : 2px;background-color : #fff;border-radius : 4px;}
		.header.on .hamburger span {;background-color : #aaa;}
		.hamburger span:nth-of-type(1) {top : 0;}
		.hamburger span:nth-of-type(2) {top : 9px;}
		.hamburger span:nth-of-type(3) {bottom : 0;}







	.hamburger.active1 span:nth-of-type(1) {	-webkit-animation:menu-bar01 .75s forwards;	animation:menu-bar01 .75s forwards;}
	@-webkit-keyframes menu-bar01 {
		0% {-webkit-transform:translateY(9px) rotate(45deg);}
		50% {-webkit-transform:translateY(9px) rotate(0);}
		100% {-webkit-transform:translateY(0) rotate(0);}
	}
	@keyframes menu-bar01 {
		0% {transform : translateY(9px) rotate(45deg);}
		50% {transform : translateY(9px) rotate(0);}
		100% {transform : translateY(0) rotate(0);}
	}
	.hamburger.active1 span:nth-of-type(2) {	transition : all .25s .25s;opacity : 1;}
	.hamburger.active1 span:nth-of-type(3) {	-webkit-animation : menu-bar02 .75s forwards;	animation : menu-bar02 .75s forwards;}
	@-webkit-keyframes menu-bar02 {
		0% {-webkit-transform:translateY(-9px) rotate(-45deg);}
		50% {-webkit-transform:translateY(-9px) rotate(0);}
		100% {-webkit-transform:translateY(0) rotate(0);}
	}
	@keyframes menu-bar02 {
		0% {transform : translateY(-9px) rotate(-45deg);}
		50% {transform : translateY(-9px) rotate(0);}
		100% {transform : translateY(0) rotate(0);}
	}
	.hamburger.active2 span:nth-of-type(1) {-webkit-animation : active-menu-bar01 .75s forwards;	animation : active-menu-bar01 .75s forwards;}
	@-webkit-keyframes active-menu-bar01 {
		0% {-webkit-transform: translateY(0) rotate(0);}
		50% {-webkit-transform : translateY(9px) rotate(0);}
		100% {-webkit-transform : translateY(9px) rotate(45deg);}
	}
	@keyframes active-menu-bar01 {
		0% {transform : translateY(0) rotate(0);}
		50% {transform : translateY(9px) rotate(0);}
		100% {transform : translateY(9px) rotate(45deg);}
	}
	.hamburger.active2 span:nth-of-type(2) {opacity : 0;}
	.hamburger.active2 span:nth-of-type(3) {-webkit-animation : active-menu-bar03 .75s forwards;	animation : active-menu-bar03 .75s forwards;}
	@-webkit-keyframes active-menu-bar03 {
		0% {-webkit-transform : translateY(0) rotate(0);}
		50% {-webkit-transform : translateY(-9px) rotate (0);}
		100% {-webkit-transform : translateY(-9px) rotate(-45deg);}
	}
	@keyframes active-menu-bar03 {
		0% {transform : translateY(0) rotate(0);}
		50% {transform : translateY(-9px) rotate(0);}
		100% {transform : translateY(-9px) rotate(-45deg);}
	}
		a.top{position: fixed;right: 10%; bottom: 150px; display: none;width:50px;height:50px;border:1px solid #ddd;text-align:center;line-height:50px;transition:0.3s;background-color: #fff;}
		a.top .fa{display:block;opacity:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transition:0.3s;}

		.section{position:relative;}
		.section0_bg{background-color: rgba(44, 62, 80, 0.3); background-image: url(../images/main/pattern.png); background-repeat: repeat; height: 100vh; left: 0; position: absolute; top: 0; width: 100%; z-index: 0;}
		.scroll-down {position: absolute;left: 50%;transform:translate(-50%,0);bottom: 40px;border: 2px solid #fff;border-radius: 50%;height: 50px;width: 50px;display: block;z-index: 10;text-align: center;}
		.scroll-down span {position: relative;color: #fff;-webkit-animation-name: drop;-webkit-animation-duration: 1s;-webkit-animation-timing-function: linear;-webkit-animation-delay: 0s;-webkit-animation-iteration-count: infinite;-webkit-animation-play-state: running;animation-name: drop;animation-duration: 1s;animation-timing-function: linear;animation-delay: 0s;animation-iteration-count: infinite;animation-play-state: running;}
		@-webkit-keyframes drop	{
			0%   { top:0px;  opacity: 0;}
			30%  { top:10px; opacity: 1;}
			100% { top:25px; opacity: 0;}
		}
		@keyframes drop	{
			0%   { top:0px;  opacity: 0;}
			30%  { top:10px; opacity: 1;}
			100% { top:25px; opacity: 0;}
		}
		#section0{width:100%;height:100vh;background:url('../images/main/cover.jpg') center center;background-attachment: fixed; background-repeat: no-repeat; background-size: cover;}
		.intro {font-family:Nanum-M;box-sizing:border-box;position: absolute;width: 100%;top: 50%;left: 0;text-align: center;-webkit-transform: translate(0%, -50%);-moz-transform: translate(0%, -50%);-ms-transform: translate(0%, -50%);-o-transform: translate(0%, -50%);transform: translate(0%, -50%);padding: 0 15px;}
		.start {font-family:Nanum-M;box-sizing:border-box;font-size: 18px;font-weight: 0;font-style: normal;text-transform: none;margin: 15px 0;color:#fff;line-height:30px;}
		.intro h1 { font-family:Nanum-M;box-sizing:border-box;font-weight: 800;font-size:50px;margin: 5px 0 5px;color:#fff;}
		.bn-brand{background-color:#222;color:#fff;width:200px; height:50px; border-radius:25px;margin-top:35px;line-height:50px;border:none;}
		.bn-brand i{position:relative;top:0;left:10px;transition:0.3s}
		.bn-brand:hover{background-color:#777;color:#fff;border:none;}
		.bn-brand:hover i{left:15px;transition:0.3s}


		/*bxslider section1*/
		#section1{height:600px;padding:150px 20px;}
		.sec1-mtxt{font-family:Nanum-M;font-weight:600;font-size:25px;padding:15px 0;box-sizing:border-box;}
		.sec1-stxt{padding:15px 0;font-family:Nanum-M;font-weight:600;font-size:14px;color:#222;line-height:25px;}
		.dp-none{display:block;}
		#section1 .bn-brand{margin-bottom:20px;margin-top:30px;}
		
		/*bxslider section2*/
		#section2{height:1000px;padding:150px 10px 0;background-color:rgba(25,25,25,0.1);box-sizing:border-box; }
		#section2 h2.sec2-mtxt{font-family:Nanum-M;font-weight:600;font-size:30px;margin-bottom:30px;}
		#section2 p.sec2-stxt{font-family:Nanum-M;font-weight:600;font-size:15px;margin-bottom:50px;color:#222;line-height:25px;}
		.section2_box{margin:0 auto;width:100%; height:100%;}
		.r_link{width: 50%; float: left;position: relative;  min-height: 1px; padding: 10px;box-sizing:border-box;    cursor: pointer;}
		.effect-bong {overflow:hidden;height:260px;transition:0.3;}
		.iconbox{background: #fff;border-bottom: 1px solid #d4d4d4;text-align: center;padding: 40px 20px;margin: 0 0 20px;box-sizing:border-box;}
		.effect-bong > div {    position: relative;}
		.iconbox-title {margin: 0 0 15px;padding: 0;font-size: 20px;font-weight: 700;}
		.left_icon {color: #000000;position: relative;margin-bottom:15px;}
		.font_text {color: #000000;position: relative;font-size: 14px;}
		.iconbox-icon {margin: 0 0 15px;font-size: 32px;color: #222;}
		.iconbox-desc h4{font-size: 15px;font-weight:bold;margin-bottom:15px;}
		.iconbox-desc p{display:none !important;}
		@-webkit-keyframes slideInLeft {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideInLeft {
  0% {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    visibility: visible;
  }

  100% {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

		/*bxslider section3*/

		#section3{padding:100px 20px 0;box-sizing:border-box;}
		.js-load{height:0px; transition:0.3s;overflow:hidden;box-sizing:border-box;}
		.js-load.active {height:1185px; transition:0.3s;overflow:hidden;box-sizing:border-box;}
		h2.main-text {width: 300px;height: 50px;font-size: 30px;font-weight: 600;font-family: Nanum-M;margin: 0 auto 80px;}
		.sec2-hid{width:100%;margin:0 auto;}
		.sec2-imgwp{width:100%;position:relative;clear:both;}
		.sec2-imgwp .sec2-img {box-sizing: border-box;float: left;margin-right: 0%;width: 100%;height: 395px;text-align: center; border: 1px solid #ddd;}
		.sec2-imgwp .sec2-img:nth-of-type(3){margin:0;}
		.sec2-imgwp .sec2-img img {height: auto;width: 100%;}
		.sec2-imgwp .sec2-img .roxy-txt {box-sizing: border-box;width: 100%;	height: auto;padding: 30px;color: #fff;font-size: 15px;text-align: left;}
		.sec2-imgwp .sec2-img h2 {font-family:Nanum-M;text-align:center;box-sizing: border-box;font-weight: 600;margin: 0;padding-bottom:15px;font-size:20px;white-space:nowrap;}
		.sec2-imgwp .sec2-img .bn-viwe{display:block;color:#222;margin:10px auto;line-height:40px;width:150px;height:40px;border-radius:20px; background-color:rgba(0,0,0,0);border:1px solid #222;}


		.bn-more{margin-bottom:150px;background-color:#222;color:#fff;width:200px; height:50px; border-radius:25px;margin-top:35px;line-height:50px;border:none;}
		.bn-more i{position:relative;top:0;left:10px;transition:0.3s}
		.bn-more:hover{background-color:#777;color:#fff;border:none;}
		.bn-more:hover i{left:15px;transition:0.3s}
		
		/*footer*/

		.footer{width:100%;height:auto;border-bottom:1px solid #999;border-top:1px solid #999;}
		.footer ul{width:100%;height:auto;margin:0 auto;padding:0 15px;box-sizing:border-box;}
		.footer ul:after{content:"";display:block;clear:both;}
		.footer ul li{float:none;display:inline-block;height:50px;padding:0 5px;}
		.footer ul li a{display:block;width:100%;height:50px;line-height:50px;font-size:13px;color:#444;transition:0.3s;font-weight:400;}
		.footer ul li a:hover{color:#222;font-weight:700;transition:0.3s}
		.footer ul li:first-of-type{padding-left:15px;}
		.footer-copy{margin:0 auto;width:100%; height:80px;line-height:50px;font-size:13px;font-weight:400;font-family:Nanum-M;padding:0 20px;box-sizing:border-box;text-align:center;color:#222;}


		
		.pop-layer2 {display: block; position: fixed; top: 50%; left: 50%; transform:translate(-50%,-50%);width:300px; height: auto; background-color: #fff; border: 2px solid #000; z-index: 10;}
		.pop-layer2 .pop-container2 {padding: 25px 25px;}
		.pop-layer2 p.ctxt2 {width:100%;height:auto; color:#000; font-size:16px;font-weight:400;font-family:Nanum-M;line-height:35px;margin-bottom:15px;text-align:center;}
		.pop-layer2 p.ctxt2 b{font-size:18px;font-weight:600;}
		.pop-layer2 .btn-r2 {width: 100%; margin: 10px 0; padding-top: 10px; text-align: center;}	

}