/* hidden_text */
.terms{ position: absolute; top: 0; left: 0; display: inline; width: 0; height: 0; overflow: hidden; font: normal 0/0 dotum; text-indent: -10000px;}

/* layout */
/*logo*/
h1{position: absolute; display: block; top:65px; left:65px; z-index: 5;}
/* floating */
.floating{position: fixed; width: 135px; 	height:120px; top:74px; right:70px; z-index: 5;}
.floating a{display: block;}
.floating .btn_google{margin-bottom:5px}
.floating .icons{position: relative;margin-top:14px; text-align: center;}
.floating .icons li{display:inline-block; background-position: right center;background-repeat: no-repeat;	padding-right:25px;margin-left:25px;}
.floating .icons li:first-child{margin-left: 0;}
.floating .icons li:last-child{padding-right: 0;background:none;}
.floating .icons li a{display: block;	text-indent: -6000px;	width:19px; height:19px; background-position: left center;	background-repeat: no-repeat;	background-size: 100%;}
.floating .icons li{background-image:url('images/img_bar.png');}
.floating .icons li.community a{background-image:url('images/btn_community.png');}
.floating .icons li.facebook a{background-image:url('images/btn_facebook.png');}


/* section */
section{overflow:hidden; position:relative; width:1200px; height: auto; margin: 0 auto; background-position:center top; background-repeat: no-repeat; z-index:2;}
section:after{clear:both; display:block; content:""}
#section0{height:1289px; background-image: url('images/bg_main.jpg');}
#section1{height:1070px;background-image: url('images/bg_event1.jpg');}
#section2{height:1831px;background-image: url('images/bg_event2.jpg');}
#section3{height:1602px;background-image: url('images/bg_event3.jpg');}


/* section0 */
#section0 .crt{width:100%; margin:0 auto; }
#section0 .crt img{position: absolute;}
#section0 .crt .title{top:435px; left:50%; margin-left :-384px;  z-index: 3; }
#section0 .crt .poring{top:0; left:50%; margin-left:-382px; z-index: 1; animation: poring 2s ;}
#section0 .crt .cloud{top:190px; left:245px; z-index: 2;animation: floating1 20s infinite;}
#section0 .crt .cloud2{width:130px; height: 70px; top:364px; right:294px; z-index: 2; animation: floating1 15s infinite ease; }
#section0 .crt .man{top:185px; left:80px; animation: floating2 10s infinite ease;}
#section0 .crt .woman{top:65px; right:10px;animation: floating2 5s infinite ease; animation-delay: -3s; z-index: 2;}
#section0 .btnArea{position: relative; width:100%; margin:775px 79px 0; }
#section0 .btnArea li{width:310px; height:230px; float:left; margin-right: 52px;}
#section0 .btnArea li a{display:block; width:100%; height:100%}

#section0 .scroll{position: absolute; bottom:190px; left:50%; margin-left:-26px;}
#section0 .scroll h1 {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 2;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

#section0 .scroll a {
  display:block;
  width:52px;
  height:50px;
}
#section0 .scroll a span {
  position: absolute;
  top:17px;
  left: 50%;
  width: 16px;
  height: 9px;
  margin-left: -8px;
  background:url('images/scrolls.png') no-repeat center top;
  -webkit-animation: scrolling 2s infinite;
  animation: scrolling 2s infinite;
  opacity: 0;
  box-sizing: border-box;
}
#section0 .scroll a span:nth-of-type(1) {
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
#section0 .scroll a span:nth-of-type(2) {
  top: 26px;
  -webkit-animation-delay: .15s;
  animation-delay: .15s;
}
#section0 .scroll a span:nth-of-type(3) {
  top: 35px;
  -webkit-animation-delay: .3s;
  animation-delay: .3s;
}

/* section2 */
#section2 .btn_event{position: absolute; top:1340px; left:344px; width:523px; height:139px; transition:ease-in-out .2s}
#section2 .btn_event:hover{transform:scale(1.03)}

/* section3 */
#section3 .treasure{position: absolute; top:532px; left:175px; width:880px;}
#section3 .treasure ul {clear: both;}
#section3 .treasure ul li{float: left;}
#section3 .treasure ul li:first-child{margin-right: 35px;}
#section3 .treasure .treasure1, #section3 .treasure .treasure2{width:409px; height:544px;background-repeat: no-repeat; background-position: left center;}
#section3 .treasure .treasure1{margin-left:5px; background-image: url('images/img_treasure1.png');}
#section3 .treasure .treasure2{margin-left:5px; background-image: url('images/img_treasure2.png');}
#section3 .treasure .treasure1.open{background-image: url('images/img_EQVWB2D567.png');}
#section3 .treasure .treasure2.open{background-image: url('images/img_AEMPQWZG79.png');}
#section3 .treasure .treasure1.close{background-image: url('images/img_treasure1_close.png');}
#section3 .treasure .treasure2.close{background-image: url('images/img_treasure2_close.png');}
#section3 .treasure a{display: block; margin-top:30px;transition:ease-in-out .2s}
#section3 .treasure a:hover{transform:scale(1.03)}

.btnTop{display:none; position: fixed; bottom:50px; right:50px; z-index: 10;}

/* bg  */
.bgLeft{ position: absolute; top: 0; left: 0;width: 50%; height: 5792px; overflow: hidden; z-index:0;}
.bgLeft div { position: absolute; top: 0; right: 600px; width: 100%; height:5792px; z-index:0; background: url('images/bg_left.jpg') no-repeat right top;}
.bgRight { position: absolute; top: 0; right: 0; width: 50%; height: 5792px; overflow: hidden; z-index:0;}
.bgRight div { position: absolute; top: 0; left: 600px; width: 100%; height: 5792px; z-index:0; background: url('images/bg_right.jpg') no-repeat left top;}


footer{ position: absolute; top: 0; left: 0; display: inline; width: 0; height: 0; overflow: hidden; font: normal 0/0 dotum; text-indent: -10000px;}

/**
 * ----------------------------------------
 * scrolling
 * ----------------------------------------
 */

@-webkit-keyframes scrolling {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes scrolling {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/**
 * ----------------------------------------
 * poring
 * ----------------------------------------
 */
@-webkit-keyframes poring {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
@keyframes poring {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
    opacity: 1;
  }
}
/*
==============================================
floating1
==============================================
*/
.floating1{
	animation-name: floating1;
	-webkit-animation-name: floating1;

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
@keyframes floating1 {
	0% {
		transform: translateX(8%);	
	}
	50% {
		transform: translateX(-8%);	
	}	
	100% {
		transform: translateX(8%);
	}			
}
@-webkit-keyframes floating1 {
	0% {
		-webkit-transform: translateX(8%);	
	}
	50% {
		-webkit-transform: translateX(-8%);	
	}	
	100% {
		-webkit-transform: translateX(8%);
	}			
}

/*
==============================================
floating2
==============================================
*/
.floating2{
	animation-name: floating2;
	-webkit-animation-name: floating2;

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}
@keyframes floating2 {
	0% {
		transform: translateY(0%);	
	}
	50% {
		transform: translateY(-8%);	
	}	
	100% {
		transform: translateY(0%);
	}			
}
@-webkit-keyframes floating2 {
	0% {
		-webkit-transform: translateY(0%);	
	}
	50% {
		-webkit-transform: translateY(-8%);	
	}	
	100% {
		-webkit-transform: translateY(0%);
	}			
}