/******* VIDEO *******/
.sec-video { background: linear-gradient(27.49deg, #F7602B 0%, #CE585F 18%, #A55194 38%, #854CBE 58%, #6E48DC 75%, #6045EE 89%, #5B45F5 100%); }

/* video area */
.sec-video .vid-area { border-bottom: 5px solid #000; }
.sec-video .vid-area .col-left { align-items: flex-end; justify-content: flex-end; padding: 40px 30px; }
.sec-video .vid-area .col-left li { margin-bottom: 27px; color: #fff; font-size: 0; }
.sec-video .vid-area .col-left li a { display: block; width: 44px; height: 44px; background: no-repeat 0 50%/cover; }
.sec-video .vid-area .col-left li.sns-tic a { background-image: url('../img/ic_tic.png'); }
.sec-video .vid-area .col-left li.sns-fb a { background-image: url('../img/ic_fb.png'); }
.sec-video .vid-area .col-left li.sns-twt a { background-image: url('../img/ic_twt.png'); }
.sec-video .vid-area .col-left li.sns-dc a { background-image: url('../img/ic_dc.png'); }
.sec-video .vid-area .col-left li.sns-insta a { background-image: url('../img/ic_insta.png'); }
.sec-video .vid-area .col-left li.sns-talk { margin-bottom: 0; }
.sec-video .vid-area .col-left li.sns-talk a { background-image: url('../img/ic_talk.png'); }
.sec-video .vid-area .col-left li.sns-ytb { margin-bottom: 0; }
.sec-video .vid-area .col-left li.sns-ytb a { background-image: url('../img/ic_ytb.png'); }
.sec-video .vid-area .mov { width: 100%; }
.sec-video .vid-area .mov .video-ratio { position: relative; width: 100%; padding-top: 70.493%; }
.sec-video .vid-area .mov .video-ratio * { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; }
.sec-video .vid-area .mov .video-ratio .poster { background: url('../img/poster.png') no-repeat center/cover; }
.sec-video .vid-area .mov .video-ratio .vid { display: none; background: #000; }
.sec-video .vid-area .col-right { flex-direction: column; justify-content: flex-end; padding: 35px 40px 140px 45px; color: #fff; font-weight: 700; line-height: 1; }
.sec-video .vid-area .col-right .text-slider { width: 100%; overflow: hidden; }
.sec-video .vid-area .col-right .txt-up { width: 100%; }
.sec-video .vid-area .col-right .txt-up p { font-weight: 700; }
.sec-video .vid-area .col-right .txt-up p:first-child { font-size: 40px; }
.sec-video .vid-area .col-right .txt-up p:last-child { font-size: 40px; margin-bottom: 18px; }
.sec-video .vid-area .col-right .txt-commu { width: 100%; }
.sec-video .vid-area .col-right .txt-commu a { display: block; width: 100%; font-size: 30px; font-weight: 700; text-align: left; }
.sec-video .vid-area .col-right .txt-commu p.eng { font-size: 24px; font-weight: 700; }

/* video list */
.sec-video .vid-list { padding: 0 28px; }
.sec-video .vid-list .inner { padding: 180px 0; }
.sec-video .vid-list ul { flex-wrap: wrap; }
.sec-video .vid-list li { width: calc((100% - 65*3px) / 4); margin-right: 65px; cursor: pointer; }
.sec-video .vid-list li:nth-child(4n) { margin-right: 0; }
.sec-video .vid-list li:nth-child(n+5) { margin-top: 110px; }
.sec-video .vid-list li .img { position: relative; width: 100%; padding-top: 56.25%; margin-bottom: 12px; overflow: hidden; background-image:url(../img/noimage.png);background-size:cover;background-repeat:no-repeat;background-position:center center;background-color:#efefef;}
.sec-video .vid-list li .img img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); min-width:calc(100% + 2px);min-height:calc(100% + 2px);}
.sec-video .vid-list li .video-title { margin-bottom: 5px; color: #fff; font-size: 39px; font-weight: 700; line-height: 1.48; }
.sec-video .vid-list li .video-desc .desc { display: -webkit-box; height: 2.3em; margin-bottom: 8px; color: #fff; font-size: 26px; line-height: 1.15; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.sec-video .vid-list li .video-desc .sub { color: #19F2F7; font-size: 23px; font-weight: 700; line-height: 1.1; }

@media all and (max-width: 1800px) {
    .sec-video .vid-area .col-right { padding: 35px 38px 120px; }
    .sec-video .vid-area .col-right .txt-up p:first-child { font-size: 38px; }
    .sec-video .vid-area .col-right .txt-up p:last-child { font-size: 39px; }
    .sec-video .vid-area .col-right .txt-commu a { font-size: 29px; }
    .sec-video .vid-area .col-right .txt-commu p.eng { font-size: 23px; }

    .sec-video .vid-list .inner { padding: 170px 0; }
    .sec-video .vid-list li { width: calc((100% - 61*3px) / 4); margin-right: 61px; }
    .sec-video .vid-list li:nth-child(n+5) { margin-top: 100px; }
    .sec-video .vid-list li .video-title { font-size: 37px; }
    .sec-video .vid-list li .video-desc .desc { font-size: 25px; }
    .sec-video .vid-list li .video-desc .sub { font-size: 22px; }
}
@media all and (max-width: 1600px) {
    .sec-video .vid-area .col-right { padding: 35px 36px 100px; }
    .sec-video .vid-area .col-right .txt-up p:first-child { font-size: 34px; }
    .sec-video .vid-area .col-right .txt-up p:last-child { font-size: 35px; }
    .sec-video .vid-area .col-right .txt-commu a { font-size: 27px; }
    .sec-video .vid-area .col-right .txt-commu p.eng { font-size: 21px; }

    .sec-video .vid-list .inner { padding: 150px 0 160px; }
    .sec-video .vid-list li { width: calc((100% - 54*3px) / 4); margin-right: 54px; }
    .sec-video .vid-list li:nth-child(n+5) { margin-top: 93px; }
    .sec-video .vid-list li .video-title { font-size: 34px; }
    .sec-video .vid-list li .video-desc .desc { font-size: 23px; }
    .sec-video .vid-list li .video-desc .sub { font-size: 20px; }
}
@media all and (max-width: 1400px) {
    .sec-video .vid-area .col-right { padding: 35px 24px 90px; }
    .sec-video .vid-area .col-right .txt-up p:first-child { font-size: 32px; }
    .sec-video .vid-area .col-right .txt-up p:last-child { font-size: 34px; }
    .sec-video .vid-area .col-right .txt-commu a { font-size: 25px; }
    .sec-video .vid-area .col-right .txt-commu p.eng { font-size: 20px; }

    .sec-video .vid-list .inner { padding: 130px 0 140px; }
    .sec-video .vid-list li { width: calc((100% - 48*3px) / 4); margin-right: 48px; }
    .sec-video .vid-list li:nth-child(n+5) { margin-top: 82px; }
    .sec-video .vid-list li .video-title { font-size: 31px; }
    .sec-video .vid-list li .video-desc .desc { font-size: 21px; }
    .sec-video .vid-list li .video-desc .sub { font-size: 19px; }
}
@media all and (max-width: 1200px) {
    .sec-video .vid-area { border-bottom-width: 3px; }
    .sec-video .vid-area .col-left,
    .sec-video .vid-area .col-right { display: none; }
    .sec-video .vid-area .col-center { width: 100%; padding: 24px 28px; }

    .sec-video .vid-list .inner { padding: 110px 0 120px; }
    .sec-video .vid-list li { width: calc((100% - 41*2px) / 3); margin-right: 41px; }
    .sec-video .vid-list li:nth-child(4n) { margin-right: 41px; }
    .sec-video .vid-list li:nth-child(3n) { margin-right: 0; }
    .sec-video .vid-list li:nth-child(n+4) { margin-top: 71px; }
    .sec-video .vid-list li .video-title { font-size: 28px; }
    .sec-video .vid-list li .video-desc .desc { height: auto; max-height: 2.3em; font-size: 18px; }
    .sec-video .vid-list li .video-desc .sub { font-size: 17px; }
}
@media all and (max-width: 1000px) {
    .sec-video .vid-list { padding: 0 24px; }
    .sec-video .vid-area .col-center { padding: 22px 24px; }

    .sec-video .vid-list .inner { padding: 84px 0 110px; }
    .sec-video .vid-list li { width: calc((100% - 35*2px) / 3); margin-right: 35px; }
    .sec-video .vid-list li:nth-child(4n) { margin-right: 35px; }
    .sec-video .vid-list li:nth-child(n+4) { margin-top: 60px; }
    .sec-video .vid-list li .video-title { font-size: 25px; }
    .sec-video .vid-list li .video-desc .desc { font-size: 16px; }
    .sec-video .vid-list li .video-desc .sub { font-size: 15px; }
}
@media all and (max-width: 800px) {
    .sec-video .vid-list { padding: 0 19px; }
    .sec-video .vid-area { border-bottom-width: 2px; }
    .sec-video .vid-area .col-center { padding: 20px 19px; }

    .sec-video .vid-list .inner { padding: 64px 0 92px; }
    .sec-video .vid-list li { width: calc((100% - 28*2px) / 3); margin-right: 28px; }
    .sec-video .vid-list li:nth-child(4n) { margin-right: 28px; }
    .sec-video .vid-list li:nth-child(n+4) { margin-top: 50px; }
    .sec-video .vid-list li .video-title { font-size: 22px; }
    .sec-video .vid-list li .video-desc .desc { font-size: 14px; }
    .sec-video .vid-list li .video-desc .sub { font-size: 13px; }
}
@media all and (max-width: 600px) {
    .sec-video .vid-list { padding: 0 16px; }
    .sec-video .vid-area .col-center { padding: 16px; }

    .sec-video .vid-list .inner { padding: 43px 0 76px; }
    .sec-video .vid-list li { width: calc((100% - 28px) / 2); margin-right: 22px; }
    .sec-video .vid-list li:nth-child(3n) { margin-right: 22px; }
    .sec-video .vid-list li:nth-child(2n), .sec-video .vid-list li:nth-child(4n) { margin-right: 0; }
    .sec-video .vid-list li:nth-child(n+3) { margin-top: 39px; }
    .sec-video .vid-list li .video-title { font-size: 19px; }
    .sec-video .vid-list li .video-desc .desc { font-size: 12px; }
    .sec-video .vid-list li .video-desc .sub { font-size: 12px; }
}
@media all and (max-width: 400px) {
    .sec-video .vid-area { border-bottom-width: 1px; }
    .sec-video .vid-area .col-center { padding: 14px 16px; }

    .sec-video .vid-list .inner { padding: 22px 0 60px; }
    .sec-video .vid-list li { width: calc((100% - 15px) / 2); margin-right: 15px; }
    .sec-video .vid-list li:nth-child(3n) { margin-right: 15px; }
    .sec-video .vid-list li:nth-child(2n), .sec-video .vid-list li:nth-child(4n) { margin-right: 0; }
    .sec-video .vid-list li:nth-child(n+3) { margin-top: 28px; }
    .sec-video .vid-list li .video-title { font-size: 16px; }
    .sec-video .vid-list li .video-desc .desc { font-size: 10px; }
    .sec-video .vid-list li .video-desc .sub { font-size: 10px; }
}
@media all and (max-width: 320px) {
    .sec-video .vid-area .col-center { padding: 13px 16px; }

    .sec-video .vid-list .inner { padding: 18px 0 48px; }
    .sec-video .vid-list li { margin-right: 12px; }
    .sec-video .vid-list li:nth-child(n+3) { margin-top: 22px; }
    .sec-video .vid-list li .video-title { font-size: 13px; }
}
@media all and (max-width: 280px) {
    .sec-video .vid-area .col-center { padding: 12px 16px; }

    .sec-video .vid-list .inner { padding: 15px 0 42px; }
    .sec-video .vid-list li { margin-right: 11px; }
    .sec-video .vid-list li:nth-child(n+3) { margin-top: 20px; }
    .sec-video .vid-list li .video-title { font-size: 12px; }
}