@charset "utf-8";
@import url(common.css);

body{*zoom:1;background:#272727 url(/img/bg_left.gif) repeat-y left top}
body:after{content:"";clear:both;display:block}
#wrap{float:left;width:1486px;}
#wrap:after{}
#lnb{float:left;width:256px;height:100%;background:#323232}

#container{position:relative;float:left;width:640px;padding:55px;}
#contents{}
#right{float:right}

#container{
	position:relative;float:left;
	width:1230px;
	padding:50px 0 30px;
	height:807px;
	background: url(/img/main_bg.jpg) no-repeat left top;
}

.lpop2{display:none;position:absolute;left:50%;top:50%;z-index:999999;margin-left:-202px;margin-top:-112px}


#main_con{
	position:relative;
	width:388px;
	height:388px;
	margin-top:198px;
	margin-left:400px;
}

#main_con > .visual {
	position:relative;
	width:1078px;
	height:388px;
	overflow:hidden;
}

#main_con > .visual .item img{
	-webkit-transform:scale(1.2); /*  크롬 */
            -moz-transform:scale(1.2); /* FireFox */
            -o-transform:scale(1.2); /* Opera */
            transform:scale(1.2);
            transition: transform 3s;
            -o-transition: transform 3s;
            -moz-transition: transform 3s;
            -webkit-transition: transform 3s;
}
#main_con > .visual .item.on img{
	-webkit-transform:scale(1); /*  크롬 */
            -moz-transform:scale(1); /* FireFox */
            -o-transform:scale(1); /* Opera */
            transform:scale(1);

}

#main_con > .ibox {
	position:absolute;
	width:190px;
	height:190px;
	
	-webkit-animation-timing-function: linear; /* Safari 4.0 - 8.0 */
    animation-timing-function: linear;
}

/*test stt */
#main_con > .iboxNew_1 {
	right:-586px;
	top:0px;
	animation-duration: 1.3s;
	animation-name: ibox_slidein_new_1;
}
@keyframes ibox_slidein_new_1 {
  from {
   right:-626px;
   opacity: 0;
  }
10% {
		opacity: 0.5;
	}
50% {
		opacity: 1;
	}
  to {
   right:-586px;
	opacity: 1;
  }
}

#main_con > .iboxNew_2 {
	right:-388px;
	bottom:0px;
	animation-duration: 1.3s;
	animation-name: ibox_slidein_new_2;
}
@keyframes ibox_slidein_new_2 {
  from {
   right:-418px;
   opacity: 0;
  }
10% {
		opacity: 0.5;
	}
50% {
		opacity: 1;
	}
  to {
   right:-388px;
	opacity: 1;
  }
}
#main_con > .iboxNew_2 > .img {
	position:absolute;
	left:0;
	top:0;
	z-index:100;
}

/*test end*/



#main_con > .ibox1 {
	right:2px;
	top:-198px;
	animation-duration: 1s;
	animation-name: ibox_slidein1;
}
@keyframes ibox_slidein1 {
  from {
   top:-218px;
   opacity: 0;
  }
10% {
		opacity: 0.5;
	}
50% {
		opacity: 1;
	}
  to {
    top:-198px;
	opacity: 1;
  }
}

#main_con > .ibox2 {
	right:-388px;
	top:0px;
	animation-duration: 1.3s;
	animation-name: ibox_slidein2;
}
@keyframes ibox_slidein2 {
  from {
   right:-418px;
   opacity: 0;
  }
10% {
		opacity: 0.5;
	}
50% {
		opacity: 1;
	}
  to {
   right:-388px;
	opacity: 1;
  }
}

#main_con > .ibox3 {
	left:-198px;
	top:0px;
	animation-duration: 1.3s;
	animation-name: ibox_slidein3;
}
@keyframes ibox_slidein3 {
  from {
   left:-228px;
   opacity: 0;
  }
10% {
		opacity: 0.5;
	}
50% {
		opacity: 1;
	}
  to {
   left:-198px;
	opacity: 1;
  }
}
#main_con > .ibox4 {
	left:-198px;
	bottom:0px;
	animation-duration: 1.6s;
	animation-name: ibox_slidein4;
}
@keyframes ibox_slidein4 {
  from {
   left:-238px;
   opacity: 0;
  }
10% {
		opacity: 0.5;
	}
50% {
		opacity: 1;
	}
  to {
   left:-198px;
	opacity: 1;
  }
}
#main_con > .ibox4 > .img {
	position:absolute;
	left:0;
	top:0;
	z-index:100;
}
#main_con > .ibox5 {
	left:-396px;
	bottom:0px;
	animation-duration: 1.6s;
	animation-name: ibox_slidein5;
}
@keyframes ibox_slidein5 {
  from {
   left:-436px;
   opacity: 0;
  }
10% {
		opacity: 0.5;
	}
50% {
		opacity: 1;
	}
  to {
  left:-396px;
	opacity: 1;
  }
}
#main_con > .ibox6 {
	left:0;
	bottom:-198px;
	animation-duration: 1.6s;
	animation-name: ibox_slidein6;
}
@keyframes ibox_slidein6 {
  from {
   bottom:-238px;
   opacity: 0;
  }
10% {
		opacity: 0.5;
	}
50% {
		opacity: 1;
	}
  to {
  bottom:-198px;
	opacity: 1;
  }
}
.bx_banner .img {
	width:190px;
	height:190px;
	position:relative;
}

.bx_banner .img .text {
	position:absolute;
	width:176px;
	height:43px;
	padding-top:11px;
	padding-left:14px;
	bottom:0;
	left:0;
	background:rgba(0,0,0,0.7) url(/img/ibox_text.png) no-repeat 160px center;
}
.bx_banner .img .text > p {
	line-height:16px;
	font-size:12px;
	color:#fff;
	font-weight:bold;
	padding-right:30px;
	text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;
	overflow:hidden;
}
a {cursor: pointer;}