@charset "utf-8";

#kv_area{width:100%;background-color:#f6f6f6;}
.kv_main{max-width:1280px;margin:0 auto;padding:40px 40px 0;}
.kv_swipe{overflow:hidden;}
.kv_swipe ul{position:relative;width:99999px;}
.kv_swipe ul:after{content:"";clear:both;display:block;}
.kv_swipe li{float:left;position:relative;text-align:right;width:1200px;padding-right:40px;padding-left:40px;}
.kv_swipe li a{display:block;}
.kv_swipe li a:after{content:"";clear:both;display:block;}
.kv_swipe li .thumb{display:block;width:83.3334%;max-width:850px;position:relative;float:right;}
.kv_swipe li .thumb > div{height:0; padding-top:56.352%; background-size:cover; background-position:center center; background-repeat:no-repeat;}
.kv_swipe li .ico-play{position:absolute;left:50%;top:50%;margin:-56px 0 0 -56px;width:112px;height:112px;background:url(../images/icons_play.png) no-repeat;font-size:0;}
.kv_swipe li .desc{position:absolute;left:40px;top:50%;margin-top:-153px;width:306px;height:306px;padding:40px 30px;background-color:#08377d;background-image:linear-gradient(90deg, #08377d, #051f54);color:#fff;text-align:left;box-shadow:8px 8px 10px rgba(0,0,0,.3)}
.kv_swipe li .desc .type{font-size:16px;padding-bottom:5px;}
.kv_swipe li .desc .title{overflow:hidden;height:165px;font-size:24px;max-height:165px;}
.kv_swipe li .desc .title>span{display:block;height:100%;line-height:1.4em;max-height:7em;overflow:hidden;}
.kv_swipe li .desc .date{border-top:1px solid #395789;padding-top:20px;font-size:14px;color:rgba(255,255,255,.6); text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}

@media (max-width:1024px) {
    .kv_swipe li{padding-right:0;}
    .kv_swipe li .desc{left:0;margin-top:-122px;width:244px;height:244px;padding:30px 25px;}
    .kv_swipe li .desc .type{font-size:14px;}
    .kv_swipe li .desc .title{height:140px;font-size:20px;}
    .kv_swipe li .desc .date{font-size:13px;padding-top:15px;}
}
@media (max-width:768px) {
    .kv_main{padding:0;}
    .kv_swipe li{position:relative;text-align:left;padding:0px;width:100%;}
    .kv_swipe li .thumb{width:100%;float:none;}
    .kv_swipe li .ico-play{margin:-28px 0 0 -28px;width:56px;height:56px;background:url(../images/icons_play.png) no-repeat;background-size:100% auto;}
    .kv_swipe li .desc_wrap{padding:0 30px;}
    .kv_swipe li .desc{position:relative;top:0;margin:0;margin-top:-20px;width:100%;height:auto;padding:25px 15px;box-shadow:none;}
    .kv_swipe li .desc .type{font-size:12px;color:rgba(255,255,255,.5);}
    .kv_swipe li .desc .title{font-size:16px;height:70px;}
    .kv_swipe li .desc .title>span{max-height:4.2em;}
    .kv_swipe li .desc .date{font-size:11px;color:#fff;}
    .kv_swipe li .desc .type,
    .kv_swipe li .desc .date{display:none;}
}

.new_slide .btn_group{width:100%;padding-top:30px;padding-bottom:35px;text-align:center;}
.new_slide .btn_group .btn_navi{}
.new_slide .btn_group .btn_page{display:inline;}
.new_slide .btn_group .btn_page button{width:16px;height:16px;margin:3px 10px 0;background-color:#d3dde9;border:3px solid #d3dde9;border-radius:50%;vertical-align:top;font-size:0;}
.new_slide .btn_group .btn_page button.on{background-color:#f6f6f6;border-color:#356cb1;}
.new_slide .btn_group .btn_prev,
.new_slide .btn_group .btn_next{width:43px;height:23px;background-image:url(../images/icons_pc.png);background-repeat:no-repeat;vertical-align:top;font-size:0;}
.new_slide .btn_group .btn_prev{background-position:0 -140px;margin-right:30px;}
.new_slide .btn_group .btn_next{background-position:0 -165px;margin-left:30px;}
.new_slide .btn_group .btn_prev.off,
.new_slide .btn_group .btn_next.off{opacity:0.5;}

.new_slide .btn_group .btn_auto{width:14px;height:18px;background:url(../images/icons_pc.png) no-repeat -80px -100px;vertical-align:top;font-size:0;margin-right:10px;margin-top:2px;}
.new_slide .btn_group .btn_auto.on{background-position:-100px -100px;}

.new_slide.only_mobile .btn_group{display:none;}

.new_slide .btn_group.hide{padding:40px 0 0;}
.new_slide .btn_group.hide *{display:none;}

@media (max-width:768px) {
    .new_slide .btn_group{padding-top:20px;padding-bottom:15px;}
    .new_slide .btn_group .btn_page button{width:12px;height:12px;border-width:2px;}
    .new_slide .btn_group .btn_prev,
    .new_slide .btn_group .btn_next{width:31px;height:17px;background-image:url(../images/icons_mo.png);background-size:200px auto;}
    .new_slide .btn_group .btn_prev{background-position:0 -30px;}
    .new_slide .btn_group .btn_next{background-position:0 -50px;}

    .new_slide .btn_group .btn_auto{width:10px;height:14px;background:url(../images/icons_mo.png) no-repeat -70px -50px;background-size:200px auto;}
    .new_slide .btn_group .btn_auto.on{background-position:-90px -50px;}

    .new_slide.only_mobile .btn_group{display:block;}
    .new_slide .btn_group.hide{padding:30px 0 0;}
}

.play_area{display:none;position:absolute;top:0;width:100%;z-index:1001; text-align:center;padding:0 40px;}
.play_area .play_area_wrap {position:relative;display:inline-block; max-width:1280px;width:100%; }
.play_area .iframe_wrap{position:relative;width:100%;height:0;padding-top:56.25%;}
.play_area .iframe_wrap iframe{position:absolute;left:0;top:0;width:100%;height:100%;border:0;}
.play_area .desc{padding:30px 45px;color:#fff;background:rgba(0,0,0,.5); text-align:left;}
.play_area .desc strong{display:block;padding-bottom:5px;font-size:26px;}
.play_area .desc p{font-size:16px;color:rgba(255,255,255,.5);height:66px;}
.play_area .btn_close{position:absolute;right:-75px;top:0;width:75px;height:75px;font-size:0;}
.play_area .btn_close:after{content:"";position:absolute;left:50%;top:50%;margin:-20px 0 0 -20px;width:40px;height:40px;background:url(../images/icons_pc.png) no-repeat -260px 0;}

.play_kv{/*position:fixed;*/top:122px;}
.play_kv .play_area_wrap { display:block; margin:auto;}
.play_kv .desc{display:none;}

.playopen .play_area {display:block;}
.playopen .overlay{display:block;}


@media (max-width:1450px) {
    .play_area .btn_close{right:0px;top:-75px;}
    /*.play_area .btn_close:after{margin:-8px 0 0 -8px;width:16px;height:16px;background:url(../images/icons_mo.png) no-repeat -90px -30px;background-size:200px auto;}*/

}
@media (max-width:1280px) {
    .play_area{margin-left:0;left:0;}
    .play_kv{top:74px;}
}
@media (max-width:1024px) {
    .play_area .btn_close{right:0px;top:-30px;width:30px;height:30px;}
    .play_area .btn_close:after{margin:-8px 0 0 -8px;width:16px;height:16px;background:url(../images/icons_mo.png) no-repeat -90px -30px;background-size:200px auto;}
}
@media (max-width:768px) {
    .play_area{background:rgba(0,0,0,0); padding: 0 20px;}
    .play_area .play_area_wrap {display:block;}
    .play_area .desc{display:none;}
}

.main_page{position:relative;width:100%;max-width:1360px;padding:0 40px;margin:0 auto;}
.main_page #content{position:relative; float:left;width:67.1875%;padding-top:55px;padding-bottom:60px;}
.main_page #content:before{content:"";position:absolute;right:0;top:0;width:1px;height:100%;background-color:#bcbcbc;}
.main_page .board_most{position:relative; margin-right:40px;}
.main_page .board_most .main_title{height:58px;}
.main_page .board_most .btn_more{right:0;top:0;}
.main_page .board_most .btn_view_all{margin:10px 0;text-align:center;}
.main_page .board_most .btn_view_all a{display:inline-block;min-width:300px;padding:17px 20px;font-size:20px;border:2px solid #000;border-radius:30px;color:#000;font-weight:500;}
.main_page .board_most .btn_view_all a:hover{background-color:#08377d;background-image:linear-gradient(135deg, #083980, #052056);border-color:#052056;color:#fff;}
.main_page .board_recent{width:100%;}
.main_page .board_recent li{position:relative;margin-bottom:40px;}
.main_page .board_recent li .thumb_inner{display:block;width:63.61%;}
.main_page .board_recent li .thumb{overflow:hidden;position:relative;width:100%;height:0;padding-top:56.25%;}
.main_page .board_recent li .thumb .thumb_wrap{position:absolute;left:0;top:0;width:100%;height:100%;background-size:cover;background-position:center;transition:all .5s ease-out;}
.main_page .board_recent li .inner{position:absolute;right:0;top:0;width:36.39%;height:100%;padding-left:20px;}
.main_page .board_recent li .desc{position:relative;width:100%;height:100%;padding-bottom:40px;}
.main_page .board_recent li .title{display:block;overflow:hidden;width:100%;height:90%;font-size:20px;color:#000;}
.main_page .board_recent li .title>span{display:block;height:100%;}
.main_page .board_recent li .date{position:absolute;right:0;bottom:0;width:100%;height:40px;padding:15px 0px 0;border-bottom:1px solid #bcbcbc;font-size:14px;color:#5d5d5d;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.main_page .board_recent li .category{display:inline-block;margin-bottom:10px;background-color:#dae6f4;padding:1px 10px;font-weight:500;font-size:16px;color:#356cb1;vertical-align:top;}

.main_page .board_recent li .title,
.main_page .board_recent li .date{transition:color .5s ease-out, border .5s ease-out;}
.main_page .board_recent li:hover .thumb .thumb_wrap{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);}
.main_page .board_recent li:hover .title,
.main_page .board_recent li:hover .date{color:#356cb1;border-color:#356cb1;}

.main_page #side{float:left;width:32.8125%;padding-top:55px;padding-bottom:60px;padding-left:40px;}
.main_page .board_video{position:relative;width:100%;padding-bottom:8px;border-bottom:1px solid #bcbcbc;margin-bottom:40px;}
.main_page .board_video .btn_more{right:0;top:0;}
.main_page .board_video .main_title{min-height:58px; padding-bottom:10px;}
.main_page .board_video .video_play_wrap{display:block;}
.main_page .board_video .thumb{display:block;position:relative;width:100%;height:0;padding-top:56.25%;font-size:0;overflow:hidden;}
.main_page .board_video .thumb_wrap{position:absolute;left:0;top:0;width:100%;height:100%;background-repeat:no-repeat;background-size:cover;background-position:center;transition:all .5s ease-out;}
.main_page .board_video .video_play_wrap:hover .thumb_wrap{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);}

.main_page .board_video .desc{position:relative;width:100%;min-height:60px;padding-right:65px;padding-top:5px;margin-top:10px;font-size:16px;}
.main_page .board_video .desc .title{display:block;height:45px;overflow:hidden;color:#000;}
.main_page .board_video .desc .btn_video_play{position:absolute;right:0;top:0;width:53px;height:53px;background:url(../images/icons_pc.png) no-repeat 0 -200px;font-size:0;}
.main_page .banner_area{padding-bottom:30px;}
.main_page .banner_area li{position:relative;margin-bottom:20px;}
.main_page .banner_area li a{position:relative;display:block;width:100%;height:0;padding-top:56.25%;overflow:hidden;}
.main_page .banner_area li .thumb{position:absolute;left:0;top:0;width:100%;height:100%;}
.main_page .banner_area li .thumb_wrap{width:100%;height:100%;background-repeat:no-repeat;background-size:cover;background-position:center;transition:all .5s ease-out;}
.main_page .banner_area li:hover .thumb_wrap{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);}

.main_page .banner_featured{position:relative;padding-bottom:40px;border-bottom:1px solid #bcbcbc;margin-bottom:40px;}
.main_page .banner_featured .btn_ro{position:absolute;right:0px;top:1px;}
.main_page .banner_featured ul{padding-top:30px;}
.main_page .banner_featured li{position:relative;margin-bottom:1px;}
.main_page .banner_featured li a{display:block;width:100%;padding:20px 0;padding-left:70px;background-color:#e8eef5;font-size:20px;color:#000;}
.main_page .banner_featured li .no{position:absolute;left:0;top:0;width:70px;height:100%;text-align:center;color:#a5a9ae;}
.main_page .banner_featured li .no .table{display:table;width:100%;height:100%;}
.main_page .banner_featured li .no .table_cell{display:table-cell;vertical-align:middle;text-align:center;}
.main_page .banner_featured li .cont{position:relative;width:100%;padding:0 24px;}
.main_page .banner_featured li .cont:before{content:"";position:absolute;left:0;top:0;width:1px;height:100%;background-color:#a2a6ab;opacity:.5;}
.main_page .banner_featured li a:hover{background-color:#0a4093;background-image:linear-gradient(90deg, #0a4092, #082e71);color:#fff;box-shadow:1px 1px 3px #aaa;}

.media_library{position:relative;background-color:#f6f6f6;padding-bottom:50px;}
.media_library_inner{position:relative;max-width:1360px;padding:0 40px;margin:0 auto;}
.media_library .main_title{padding:45px 0 25px;}
.media_library .btn_ro{position:absolute;right:40px;top:45px;}
.media_library ul{margin-right:-16px;}
.media_library li{float:left;width:25%;padding-right:16px;}
.media_library li .thumb{overflow:hidden;position:relative;width:100%;height:0;padding-top:56.25%;}
.media_library li .thumb .thumb_wrap{position:absolute;left:0;top:0;width:100%;height:100%;background-size:cover;background-position:center;transition:all .5s ease-out;}
.media_library li .title{position:relative;width:100%;height:40px;padding:0 20px;margin-top:-25px;font-size:16px;z-index:2;}
.media_library li .title span{display:block;width:100%;height:100%;padding:0 5px;background-color:#073274;background-image:linear-gradient(135deg, #073274, #030f39);color:#fff;text-align:center;line-height:40px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.media_library li:hover .thumb_wrap{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05);}

/**GNB Mediaquery**/
@media (max-width:1080px) {
    .main_page{padding:0 20px;}
    .main_page .board_most {margin-right:20px;}
    .media_library_inner{padding:0 20px;}
    .media_library .btn_ro{right:20px;}
    .main_page #side {padding-left:20px;}
}

@media (max-width:1024px) {
    .main_page .board_recent li .title {height:80%;}
}

@media (max-width:768px) {
    .main_page{padding:0;}
    .main_page #content:before {display:none;}
    .main_page .btn_ro{display:none; padding:4px 17px 2px 12px; font-size:12px;}
    .main_page .btn_ro:after{right:4px; margin-top:-3px;}
    .main_page .board_most {margin-right:0;}
    .main_page .board_most .btn_view_all{margin:25px 0;}
    .main_page .board_most .btn_view_all a{min-width:180px;padding:7.5px 15px;font-size:15px;}
    .main_page .board_most .main_title{height:auto;}
    .main_page #content,
    .main_page #side{float:none;width:100%;padding-top:20px;padding-left:20px;padding-right:20px;padding-bottom:25px;}
    .main_page #side{border-top:1px solid #bcbcbc;}
    .main_page .board_recent li{padding:15px 0;margin:0;border-bottom:1px solid #bcbcbc;}
    .main_page .board_recent li .thumb_inner{display:block;width:40.3%;}
    .main_page .board_recent li .inner{width:59%;padding:15px 12px 8px;}
    .main_page .board_recent li .desc{padding-bottom:20px;}
    .main_page .board_recent li .title{height:60px;font-size:14px;margin-top:-2px;vertical-align:top;}
    .main_page .board_recent li .date{height:auto;padding:0;font-size:11px;border:none;}
    .main_page .board_recent li .category{margin-bottom:0px;font-size:11px;}
    .main_page .board_recent li .category + .title{margin-top:-4px;}

    .main_page .board_video{border-bottom:0;}
    .main_page .board_video .btn_ro{display:block;}
    .main_page .board_video .main_title{min-height:auto;}
    .main_page .board_video .desc{min-height:40px;padding-right:50px;font-size:13px;}
    .main_page .board_video .desc .title{height:34px;}
    .main_page .board_video .desc .btn_video_play{width:38px;height:38px;background:url(../images/icons_mo.png) no-repeat 0 -160px;background-size:200px auto;}
    .main_page .banner_area{border:none;padding:0;}
    .main_page .banner_area li{margin-bottom:0px;}

    .main_page .banner_featured{border-bottom:0;}
    .main_page .banner_featured ul{padding-top:10px;}
    .main_page .banner_featured li a{font-size:16px}
    .main_page .banner_featured .btn_ro{display:block;}

    .media_library{padding:0 20px 20px;}
    .media_library_inner{padding:0px;}
    .media_library .main_title{padding:25px 0 10px;}
    .media_library ul{margin:0;}
    .media_library li{float:none;width:100%;padding-right:0px;}
    .media_library li .title{padding:0 18px;margin-top:-15px;font-size:13px;}
    .media_library .btn_ro{display:none;}

    .new_slide{overflow:hidden;}
    .new_slide .new_slide_inner{overflow:hidden;}
    .new_slide ul{position:relative;}
    .new_slide li{float:left;}
}

@media (max-width:480px) {
    .main_page .board_recent li .category{display:none;}
    .main_page .board_recent li .title{height:60px;}
}
@media (max-width:359px) {
    .main_page .board_recent li .title{height:20px;}
}
