.editors_clip{
  height: 963px;
  margin-top: 5rem;
}
.editors_clip_inner{
  width: 100vw;
  height: 100%;
}
.section_name_wrap{
  width: 100%;
  height: 30%;
  
}
.tab_video_wrap{
  margin-top: 8rem;
  position: relative;
  width: 100%;
  height: 70%;
  
  /* box-shadow: 0px 0px 5px rgb(9,93,210); */
  transition: 0.3s;
  

}
.tab_button_wrap{
  width: 88.54%;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: flex-end;
  gap : 5px;
}
.tab_button{
  width: 5rem;
  height: 5rem;
  border-radius: 100%;  
  border: 0px;

  transition: 0.3s;

  position: relative;
}
.tab_button:nth-of-type(1){
  background-color: rgba(9,93,210 ,0.5);
  /* box-shadow: 0px 0px 5px rgb(9,93,210); */

}
.tab_button:nth-of-type(2){
  background-color: rgba(168,210,0 ,0.5);
  /* box-shadow: 0px 0px 5px rgb(168,210,0); */
}
.tab_button:nth-of-type(3){
  background-color: rgba(253,192,196 ,0.5);
  /* box-shadow: 0px 0px 5px rgb(253,192,196); */
}

  .tab_button.selected{
    /* height: 3.5rem; */
    width: 8rem;
    height: 3rem;
    border-radius: 30%;  
  }

  .tab_button_top_image{
    position: absolute;
    content: "";
    width: 70%;
    left: 50%;
    top : 0%;
    transform: translate(-50%, -100%);

    transition: 0.3s;
  }
  .selected .tab_button_top_image{
    width: 100%;
    transform: translate(-50%, -100%);

    animation-name: button_top_animation_up_down;
    animation-duration: 1s;
    animation-timing-function : linear;
    animation-iteration-count : infinite;
  }

  @-webkit-keyframes button_top_animation_up_down {
    0% {
      transform: translate(-50%, -100%);
    }
    50% {
      transform: translate(-50%, -120%);
    }
    100% {
      transform: translate(-50%, -100%);

    }
  }

.clip_image_wrap{
  width: 100%;
  height: 100%;
  background-color: white;
  z-index: 5;
  position: relative;

  transition: 0.3s;
  box-shadow: 0px 0px 10px rgb(9,93,210);
  
  overflow: hidden;
}
.tab_inner_contents_wrap{
  position: absolute;
  left: 0%;
  top : 0%;
  width: 100%;
  height: 100%;

  opacity: 0;
  pointer-events: none;

  transition: 1.5s;
}
  .tab_inner_contents_wrap.selected{
    opacity: 1;
    pointer-events: all;
  }

  .tab_inner_contents_wrap.first_tab{
    background-image: url(../img/editorsClip/tab_01_background_deep.png);
    background-size: cover;
    background-repeat: no-repeat;
  }

/* 클립배경 */
.clip_background_wrap{
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.clip_background_image{
  /* background-color: white; */
  position: absolute;
  height: 100%;
  width: clamp(1800px, 100vw, 100vw);
  /* width: 100%; */
  bottom: 0;
}
.clip_background_image.reverse{
  transform: scaleX(-1);
}




/* 클립 섬네일 */
.clip_thumbnail_wrap{
  position: absolute;
  width: clamp(750px,45%,45%);
  height: 70%;
  right: 10%;
  bottom : 5%;
  border-radius: 1rem;

  box-shadow: 0px 0px 10px rgba(0,0,0,0.4);
}
.clip_image{
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 1rem;
  position: relative;
}
.thumbnail_image_wrap{
  display: flex;
  width: 100%;
  height: 100%;
}
.clip_thumbnail_image{
  position: absolute;
  height: 100%;
  left: 0%;
  top: 0%;
  transform: scale(1.178);

  transition: 0.7s;
}
.clip_thumbnail_play_icon{
  position: absolute;
  /* width: 15%; */
  width: clamp(85px,15%,15%);
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}
  .clip_thumbnail_wrap:hover .clip_thumbnail_image{
    transform: scale(1.3);
  }
  .clip_thumbnail_wrap:hover .clip_thumbnail_play_icon{
    animation-name: expand-play-icon;
    animation-duration: 0.5s;
    animation-timing-function : linear;
    animation-iteration-count : 1;
  }
  @-webkit-keyframes expand-play-icon {
    0% {
      transform: translate(-50%,-50%) rotate(0deg);
    }
    33%{
      transform: translate(-50%,-50%) rotate(-10deg);
    }
    66% {
      transform: translate(-50%,-50%) rotate(10deg);
    }
    100% {
      transform: translate(-50%,-50%) rotate(0deg);
    }
  }
.clip_left_image{
  position: absolute;
  /* height: 45%; */
  /* width: 25%; */
  width: clamp(120px,25%,25%);
  left: -10%;
  z-index: 5;
  bottom: 5%;

  /* 애니메이션 */
  animation-name: up-and-down;
  animation-duration:4s;
  animation-timing-function : linear;
  animation-iteration-count : infinite;
}
.clip_left_image.reverse{
  transform: scaleX(-1);
  left: -20%;
}
.clip_left_image.up_scale{
  transform: scale(1.3);
}
@-webkit-keyframes up-and-down {
  0% {
    bottom: 5%;
  }
  50%{
    bottom : 10%;
  }
  100% {
    bottom: 5%;
  }
}
.clip_top_image{
  position: absolute;
  /* width: 40%; */
  width: clamp(220px, 40% , 40%);
  /* height: 65%; */
  right: -10%;
  top: 0%;
  transform: translate(0%,-50%);
  z-index: 5;
}
.clip_top_image.reverse{
  transform: translate(30%,-50%) scaleX(-1);
}
.clip_right_image{
  position: absolute;
  width: auto;
  height: 50%;
  top: 0%;
  z-index: 3;
  transform: translate(0%,-50%);
}
.clip_right_image.editional01{
  right: 13%;
}
.clip_right_image.editional02{
  right: 10%;
}
