/* 이벤트 템플릿 1437 스타일 */
body { font-family: Arial, sans-serif; }

:root{
  --base-width: 1200;
}

main{
  width: 100% !important;
}


.video_wrap{
  position: absolute;
  top: 20%;
  left: 55%;
  transform: translateX(-50%);
  width: calc(750 / var(--base-width) * 100%);
}

.video_wrap video{
  position: relative;
  width: 100%;
  height: auto;
  border-radius: 6px;
  z-index: 10;
}
.item_back{
  position: absolute;
  top: 19.4%;
  left: 4%;
  /* transform: translateX(-50%); */
  width: calc(253 / var(--base-width) * 100%);
  pointer-events: none;  
}
.duolac{
  position: absolute;
  top: 28%;
  left: 50%;
  transform: translateX(-50%);
  width: 50%;
  height: 15%;
}
.sec4 .sec4_text{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70%;
  height: 35%;
  padding: 20px;
  resize: none;
  font-size: 25px;
  line-height: 1.35em;
  border-radius: 30px;
  background: white;
  border: 2px solid #eee;
}
.sec4 .sec4_text:focus{
  outline: none;
  border-color: #aaa;
}
.sec4 .sec4_text::placeholder{
  padding-top: 5%;
  color: #aaa;
  text-align: center;
}
.custom_scroll {
  overflow-y: auto;
  resize: none;

  padding: 18px 26px 18px 22px;
  box-sizing: border-box;

  border: 2px solid #aaa;
  border-radius: 24px;
  outline: none;

  scrollbar-width: thin;
  scrollbar-color: #8f8f8f transparent;
}

.custom_scroll::-webkit-scrollbar {
  width: 14px;
}

.custom_scroll::-webkit-scrollbar-track {
  background: transparent;
  margin: 20px 0;
}

.custom_scroll::-webkit-scrollbar-thumb {
  background: #8f8f8f;
  border-radius: 999px;
  border: 5px solid #fff;
  background-clip: padding-box;
}

.custom_scroll::-webkit-scrollbar-thumb:hover {
  background: #666;
}

.custom_scroll::-webkit-scrollbar-button {
  display: none;
}

.submit{
  position: absolute;
  top: 73%;
  left: 50%;
  transform: translateX(-50%);
  cursor: pointer;
  width: 40%;
  height: 15%;
}








@media (max-width: 768px){
  .sec4 .sec4_text{
    font-size: clamp(10px, 2vw, 18px);
    padding: 10px;
    border-radius: 6px;
  }
  .sec4 .sec4_text::placeholder{
    padding: 0px;
    text-align: left;
    font-size: clamp(8px, 2vw, 16px);
    /* padding: 10px; */
  }
}
@media (max-width: 480px){
  .sec4 .sec4_text{
    width: 80%;
    padding: 8px;
  }
}