/* html5 전체화면시 */
:-webkit-full-screen {
  background: #ffffff;
}

:-moz-full-screen {
  background: #ffffff;
}

:-ms-fullscreen {
  background: #ffffff;
}

:full-screen { /*pre-spec */
  background: #ffffff;
}

:fullscreen { /* spec */
  background: #ffffff;
}

/* 슬라이더 */
.slider_area{
  width:100%;height:100%;
  font-size:0px;
  white-space:nowrap;
  word-break:break-all;
}

.slider_area li{
  white-space:pre-line;
  word-break:break-all;
  position:relative;
  display:inline-block;*display:inline;_display:inline;
  width:100%;
  height:100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size:cover;
}

/* 이미지 로더를 위한것. */
.loader, .loaderANI{
  width:100%;height:100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size:cover;
  transform-origin: 50% 50%; 
}

/* 줌효과 무한루프 */
.zoominoutbg{
  transform:scale(1.2) rotate(0.3deg);
  animation:zoom 10s linear 0s infinite alternate forwards;
  -webkit-animation:zoom 10s linear 0s infinite alternate forwards;
}
@keyframes zoom{
  0%{transform:scale(1.2) rotate(0.3deg) translateY(0px)}
  100%{transform:scale(1) rotate(0deg) translateY(0px)}
}
@-webkit-keyframes zoom{
  0%{-webkit-transform:scale(1.2) rotate(0.3deg) translateY(0px)}
  100%{-webkit-transform:scale(1) rotate(0deg) translateY(0px)}
}
/* 중앙에 오게 하는데 내용 넘치면 scroll (dl,dt) */
.cntMidScroll_position{
  overflow:auto;
  position:fixed; z-index:1010;
  width:100%;height:100%;
}
.cntMidScroll_wrap{
  display:table;
  width:100%;height:100%;
}
.cntMidScroll_wrap dt{
  display:table-cell;vertical-align:middle;text-align:center;
  width:100%;height:100%;
}
.cntMidScroll_content{
  display:table-cell;vertical-align:middle;text-align:center;
  width:100%;height:100%;
}



/* 페이지 레이아웃 */
.cpage{
  min-width:200px;width:100%;height:100%;
  clear:both;
  position:relative;
  overflow:visible;
  background-repeat:no-repeat;
  background-position:center center;
  background-size:cover;
}
.all_wrap{
  overflow:hidden;
  position:absolute;top:0px;bottom:0px;left:0px;right:0px;margin:auto;
}
/* 페이지 */
.paging_ver{
  position:fixed;z-index:100;
  bottom:14%;right:0px;left:0;margin:0 auto;
  text-align:center;
  width:700px;
}
.paging_ver a{
  display:inline-block;
  width:35px;
  height:30px;line-height:20px;
  margin:0 2px;
}
.paging_ver a p{
  display:inline-block;
  vertical-align:middle;
  height:3px;width:100%;
  background-color:#FFF;
}
.paging_ver .sel p{
  background-color:#FFE44E;
}





.scrollRemoveDown{
  position:absolute;z-index:3;
  width:100%;top:0;height:100%;
  transform-stylepreserve-3d;
  transform-origin: 50% 0%;
  animation: scrollRemoveDown 0.8s linear 0s 1 alternate forwards;
}
@keyframes scrollRemoveDown{
  0%  {transform:perspective(1000px) rotateX(0deg)  ;z-index:1;}                    
  15% {transform:perspective(1000px) rotateX(-10deg)  ;}                              
  80% {transform:perspective(1000px) rotateX(0deg) translateZ(-300px);}               
  100%{transform:perspective(1000px) translateZ(-300px) translatey(-10%);z-index:1;}  
}

.scrollMoveDown{
  position:absolute;z-index:2;
  width:100%;top:0;height:100%;
  transform-stylepreserve-3d;
  transform-origin: 50% 50%;
  animation: scrollMoveDown 1s linear 0s 1 alternate both;
}
@keyframes scrollMoveDown{
  0%  {top:100%}                    
  100%{top:0%}                              
}







.scrollRemoveUp{
  position:absolute;z-index:3;
  width:100%;top:0;height:100%;
  transform-stylepreserve-3d;
  transform-origin: 50% 100%;
  animation: scrollRemoveUp 0.8s linear 0s 1 alternate forwards;
}
@keyframes scrollRemoveUp{
  0%  {transform:perspective(1000px) rotateX(0deg)  ;z-index:1;}                          
  15% {transform:perspective(1000px) rotateX(10deg) ;}                                    
  80% {transform:perspective(1000px) rotateX(0deg) translateZ(-300px);}                     
  100%{transform:perspective(1000px) translateZ(-300px) translatey(10%);z-index:1;}         
}

.scrollMoveUp{
  position:absolute;z-index:2;
  width:100%;top:0;height:100%;
  transform-stylepreserve-3d;
  transform-origin: 50% 50%;
  animation: scrollMoveUp 1s linear 0s 1 alternate both;
}
@keyframes scrollMoveUp{
  0%  {top:-100%}                    
  100%{top:0%}                              
}







.scrollRemoveRight{
  position:absolute;z-index:3;
  width:100%;top:0;height:100%;
  transform-stylepreserve-3d;
  transform-origin: 50% 50%;
  animation: scrollRemoveRight 0.8s linear 0s 1 alternate forwards;
}
@keyframes scrollRemoveRight{
  0%  {margin-left:0;transform:perspective(1000px) translateZ(0px);}
  15% {margin-left:0;transform:perspective(1000px) translateZ(-200px);}
  80%{margin-left:-100%;transform:perspective(1000px) translateZ(-200px);}
  100%{margin-left:-100%;transform:perspective(1000px) translateZ(-200px);}
}

.scrollMoveRight{
  position:absolute;z-index:2;
  width:100%;top:0;height:100%;
  transform-stylepreserve-3d;
  transform-origin: 50% 50%;
  animation: scrollMoveRight 0.8s linear 0s 1 alternate both;
}
@keyframes scrollMoveRight{
  0%  {margin-left:100%;transform:perspective(1000px) translateZ(-200px);}
  15% {margin-left:100%;transform:perspective(1000px) translateZ(-200px);}
  80% {margin-left:0%;transform:perspective(1000px) translateZ(-200px);}
  100%{margin-left:0%;transform:perspective(1000px) translateZ(0px);}
}






.scrollRemoveLeft{
  position:absolute;z-index:3;
  width:100%;top:0;height:100%;
  transform-stylepreserve-3d;
  transform-origin: 50% 50%;
  animation: scrollRemoveLeft 0.8s linear 0s 1 alternate forwards;
}
@keyframes scrollRemoveLeft{
  0%  {margin-left:0;transform:perspective(1000px) translateZ(0px);}
  15% {margin-left:0;transform:perspective(1000px) translateZ(-200px);}
  80%{margin-left:100%;transform:perspective(1000px) translateZ(-200px);}
  100%{margin-left:100%;transform:perspective(1000px) translateZ(-200px);}
}

.scrollMoveLeft{
  position:absolute;z-index:2;
  width:100%;top:0;height:100%;
  transform-stylepreserve-3d;
  transform-origin: 50% 50%;
  animation: scrollMoveLeft 0.8s linear 0s 1 alternate both;
}
@keyframes scrollMoveLeft{
  0%  {margin-left:-100%;transform:perspective(1000px) translateZ(-200px);}
  15% {margin-left:-100%;transform:perspective(1000px) translateZ(-200px);}
  80% {margin-left:0%;transform:perspective(1000px) translateZ(-200px);}
  100%{margin-left:0%;transform:perspective(1000px) translateZ(0px);}
}



.cntMidScroll_wrap{
  position:relative;
  width:450px;
  float:left;
  background-color:rgba(32,88,103,1);
}
.cntMidScroll_content{
  text-align:left;
  padding:0 50px;
  font-size:15px; line-height:25px; color:#fff;
  margin-top:200px;
  /*font-style:italic;*/
}
.paging_ver .sel p{
  background-color:red;
}
.titlebg{
  margin-bottom:20px;
}