.p-main {
  position: relative;
  -webkit-transition: all .5s ease-in;
  transition: all .5s ease-in;
}

.p-main.loading {
  height: 100vh;
  overflow: hidden;
}



.p-main.loaded #frame .kv__masking {
  -webkit-transform: scale(6, 6);
  -ms-transform: scale(6, 6);
  transform: scale(6, 6);
}

.p-main.loaded #frame .kv__masked__keyvisual--scale {
  opacity: 1;
}

.p-main .l-frame__content {
  overflow: hidden;
}

@media all and (max-width: 768px) {
  .p-main .l-frame__content {
    padding-bottom: 500px;
    margin-bottom: -500px;
  }
}

#frame {
  position: relative;
  overflow: hidden;
  z-index: 1;
  width: 100%;
  height: 100vh;/* 1주년 메인 비주얼 관련 수정 200vh -> 100vh */
}

@media all and (max-width: 768px) {
  #frame {
/*    min-height: 600rem;*/
  }

.p-main.loaded #frame .kv__masking {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.p-main {
  position: relative;
  -webkit-transition: all .0s ease-in;
  transition: all .0s ease-in;
}

}





#frame .kv {
/*  position: relative;-**/
  z-index: 1;
}

#frame .kv__masking {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

#frame .kv__masking--off {
  background-color: transparent;
}

#frame .kv__masking--hidden {
  display: none;
}

#frame .kv__masked {
/*  position: relative;*/
}

#frame .kv__masked__keyvisual {
  position: absolute;
  width: 200px;
  height: 100vh;
  background: url("http://studioive.co.kr/theme/basic/img/company/about_visual_img.png") no-repeat center/cover;
 /* -webkit-transform: scale(0.5);
  -ms-transform: scale(0.5);
  transform: scale(0.5);*/
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
  -webkit-animation: about_ani 1s  linear;
  animation-fill-mode: forwards;
}


@keyframes about_ani {
  0%{width: 200px; height: 100vh; opacity: 1;}
  99%{width: 100%; height: 100vh; opacity: 1;}
  100%{width: 100%; height: 100vh; opacity: 0;}
}



/* @media all and (max-width: 768px) {
  #frame .kv__masked__keyvisual {
    min-height: 600rem;
  }
} */

#frame .kv__masked__keyvisual--scale {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("http://studioive.co.kr/theme/basic/img/company/about_visual_img.png") no-repeat center/cover;
  opacity: 0;
  -webkit-animation: about_ani01 1s  linear;
  animation-fill-mode: forwards;
}

@keyframes about_ani01 {
  0%{opacity: 0;}
  99%{opacity: 0;}
  100%{opacity: 1;}
}


#frame .kv__masked__keyvisual--scale.white-cover {
  background: #fff;
}

#connect {
  position: relative;
  overflow: hidden;
  margin: 0 auto;
  padding-top: 0;
  z-index: 3;
  background: #fff;
}

@media all and (min-width: 1920px) {
  #connect {
  }
}

@media all and (max-width: 768px) {
  #connect {
    position: relative;
    margin-top: 0;
    overflow: hidden;
    padding-top: 0;
  }
}