@charset "utf-8";

.main_tit{text-align: center; word-break: keep-all;}
.main_tit h3{font-size: 58px; font-weight: 800; color: #222222; letter-spacing: -0.025em;}
.main_tit h3 span{color: #007bf9;}
.main_tit p{margin-top: 20px; color: #888888; font-weight: 500; letter-spacing: -0.025em; font-size: 32px;}
.main_tit .sm_txt{font-size: 20px; font-weight: 500; color: #888888; letter-spacing: -0.025em; line-height: 1.5em; margin-top: 40px;} 

.section{padding: 100px 0;}
section.bg01{background-color: #f9f9f9;}

@media all and (max-width:1024px){
    .main_tit .sm_txt br{display: none;}
}

.video_wont_box{display: flex; align-items: center;}
.video_wont_box > div {width: 50%; box-sizing: border-box;}
.video_wont_box .big_video{aspect-ratio: 1/0.557;}

.video_wont_box .right_box{padding-left: 40px;}
.video_wont_box .scroll_gray{background-color: #f9f9f9; border-radius: 20px; padding: 30px 20px 30px 30px; width: 100%; box-sizing: border-box; height: 100%;}
.video_wont_box .scroll_gray.bg-white{background-color: #fff;}
.video_wont_box .wont_vid .con_box{display: flex; gap: 20px; align-items: center;}
.video_wont_box .wont_vid .con_box .img_box{aspect-ratio: 1/0.559; width: 30%;}
.video_wont_box .wont_vid .con_box .txt_box{width: calc(70% - 20px);}
.video_wont_box .wont_vid .con_box .img_box img{width: 100%; height: 100%; object-fit: cover;}
.video_wont_box .wont_vid{padding-right: 30px; display: flex; flex-direction: column; gap: 25px; max-height: 340px; overflow-y: auto;}
.video_wont_box .wont_vid::-webkit-scrollbar {
    width: 4px; /* 스크롤바의 너비 */
}

.video_wont_box .wont_vid::-webkit-scrollbar-track {
    background: #e5e5e5; /* 스크롤바 트랙의 배경색 */
    border-radius: 2px; /* 스크롤바 손잡이의 둥근 모서리 */
}

.video_wont_box .wont_vid::-webkit-scrollbar-thumb {
    background: #a6a6a6; /* 스크롤바 손잡이의 색상 */
    border-radius: 2px; /* 스크롤바 손잡이의 둥근 모서리 */
}

.video_wont_box .wont_vid .txt_box .tit p{font-size: 20px; font-weight: 700; color: #444444; letter-spacing: -0.025em; line-height: 1.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.video_wont_box .wont_vid .txt_box .txt p{font-size: 16px; font-weight: 500; color: #666666; letter-spacing: -0.025em; line-height: 1.625em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top:5px ;}
.video_wont_box .wont_vid .active .txt_box .tit p{color: #007bf9; position: relative;}
.video_wont_box .wont_vid .active .txt_box .tit p:before{position: absolute; bottom: 0; left: 0; width: 100%; height: 1.5px; content: ''; background-color: #007bf9;}

@media all and (max-width:1024px){
    .video_wont_box{flex-wrap: wrap; gap: 40px 0;}
    .video_wont_box > div {width: 100%;}
    .video_wont_box .right_box{padding-left: 0;}
}

@media all and (max-width:650px){
    .video_wont_box .wont_vid{max-height: 310px;}
    .video_wont_box .wont_vid .con_box .img_box{width: 40%;}
    .video_wont_box .wont_vid .con_box .txt_box{width: calc(60% - 20px);}
}