div.subimg {  position: relative;  width: 100%;  height: 330px;  overflow: hidden;}
div.subimg .sub_img {  position: relative;  width: 100%;  height: 100%;  overflow: hidden;}
div.subimg .sub_img::before {  content: "";  position: absolute;  top: 0; left: 0;  width: 100%; height: 100%;
  background-image: url("../img/sub_img1.jpg");  background-size: cover;  background-position: center top;  background-repeat: no-repeat;
  transform: scale(1.2); /* 처음에 확대 */
  animation: zoomOut 1.2s ease forwards; /* 2초 동안 축소 */
  z-index: -1; /* 텍스트 뒤로 */}
  
div.subimg  div.sub_img2::before{ background-image:url("../img/sub_img2.jpg") ;background-repeat:no-repeat;}
div.subimg  div.sub_img3::before{ background-image:url("../img/sub_img3.jpg");background-repeat:no-repeat; }
div.subimg  div.sub_img4::before{ background-image:url("../img/sub_img5.jpg") ;background-repeat:no-repeat; }
div.subimg  div.sub_img5::before{ background-image:url("../img/sub_img6.jpg") ; background-repeat:no-repeat;}

@keyframes zoomOut {
  0%   { transform: scale(1.2); }
  100% { transform: scale(1); }
}

/* sub h2 tmt */
.cascading-text__letter {  opacity: 0;  -webkit-animation-name: enter;  animation-name: enter;}
.cascading-text__letter {  display: inline-block;  -webkit-transform-style: preserve-3d;  transform-style: preserve-3d; 
 -webkit-animation-duration: 0.9s; animation-duration: 0.9s;  -webkit-animation-fill-mode: forwards;   animation-fill-mode: forwards;}

@keyframes enter {
  0% { opacity: 0; -webkit-transform: translateX(65px);  transform: translateX(65px); }
  25% {  opacity: 1; }
  100% { opacity: 1;  -webkit-transform: translateX(0px);  transform: translateX(0px);  }
}

div.subimg div.mask {  position: absolute;  top:0; left:0;  background-color: #000;  opacity: .2;
  width: 100%;  height: 100%;  z-index: 1;}
div.subimg h2 {  position: relative;  padding-top: 135px;  margin: 0 auto;  text-align: center;  font-size: 50px; font-family: Malgun Gothic;  font-weight: 600;  color: #fff;  z-index: 2;}


/*---------------------------------------
  MOBILE RESPONSIVE              
-----------------------------------------*/
@media (max-width: 1023px) {
div.subimg  div.sub_img h2 {padding:90px 0 0 0px;  margin:0 auto; text-align:center; 
text-shadow:1px 1px 2px #333; font-size:30px; font-family: Malgun Gothic; font-weight:600; color:#fff; width:100%;  box-sizing:border-box; display:block;}
div.subimg div.mask { height:200px; top:0px; }
div.subimg  div.sub_img{ }
div.subimg  {  padding-top:0px;  height:200px; }
}
@media (max-width: 768px) {
}
@media (max-width: 640px) {
}
@media (max-width: 480px) {
}
@media (max-width: 320px) {
}