@charset "utf-8";

.m_contents{position:relative;z-index:1}
.m_visual{position: relative;padding:40px 0;background:url("/images/10_youth/main/main_visual.jpg") no-repeat center 0;height: 345px;background-size:cover;}
.m_visual .visual_txt{text-align:center;}
.m_visual .visual_txt img{width:290px;}

.visual_icon{position: absolute;bottom: 0px;margin-bottom: 22px;width: 100%;}
.visual_icon li{float:left;width: 46%;margin: 5px 2%;background-color: rgba(0, 0, 0, 0.82);}
.visual_icon li a{display:block;padding: 10px 0;width:100%;text-align:center;color:#fff;}
.visual_icon li a:hover{background-color:#0087dc;}
.visual_icon li a:hover, .visual_icon li a:focus, .visual_icon li a:active{ text-decoration:underline;}

.m_banner{overflow:hidden;padding:30px 15px;}
.m_banner .infozone_line{border-top: 1px solid #d9d9d9;padding: 20px 0 0 0;}
.m_banner ul{overflow:hidden;margin: 0 0 20px 0;}
.m_banner li{float:left;width:33.3%;text-align:center;display:inline-block;background-size:80px !important;}
.m_banner li a{color:#444}
.m_banner .tit{display:block;font-size:14px;font-weight:600;padding: 100px 0 10px 0;}
.m_banner .s_tit{display:none;}
.m_banner .m_ban01{background:url("/images/10_youth/main/m_ban01.png") no-repeat center 0;}
.m_banner .m_ban02{background:url("/images/10_youth/main/m_ban02.png") no-repeat center 0;}
.m_banner .m_ban03{background:url("/images/10_youth/main/m_ban03.png") no-repeat center 0;}
.m_banner .m_ban04{background:url("/images/10_youth/main/m_ban04.png") no-repeat center 0;}

.infozone{position:relative;background:#eef0f5;border-radius:5px;}
.infozone h2{color:#000;font-size: 20px;padding:12px;line-height:1.5em;background:#fff;border-radius:5px 5px 0 0;}
.infozone p{position:absolute;top:11px;right:15px}
.infozone p button{background:url("/images/01_potal/common/common_btn.png") no-repeat;width:29px;height:0;padding:29px 0 0 0;overflow:hidden}
.infozone p .stop{background-position:0px -108px}
.infozone p .btn_img{display:inline-block;}
.infozone p .play{background-position:-29px -108px}
.infozone p .prev{background-position:-87px -108px}
.infozone p .next{background-position:-116px -108px}
.infozone p .v_img{background-position:-203px -108px}
.infozone p .v_txt{background-position:-232px -108px}

.infozone li{display:none;width:100%}
.infozone li.on{display:block;margin: 0;width: 100%;}
.infozone li img{border-radius:0 0 5px 5px;width:100%;}
.infozone li span{display:none}


.m_con_bbs{background:url("/images/10_youth/main/m_con_bbs_bg.png") no-repeat top #e0e6ee;overflow:hidden;}
.m_con_bbs h2{font-size:18px;color:#444}
.m_con_bbs .m_notice{background-color:#fff;box-shadow:1px 1px 3px 0 #888;padding:20px;margin:15px;position:relative;}
.m_con_bbs .more_1{position:absolute;top: 16px;right: 22px;}
.m_con_bbs .more_2{position:absolute;top: 16px;right: 22px;}
.m_con_bbs .m_photo{overflow:hidden;background-color:#fff;box-shadow:1px 1px 3px 0 #888;padding:20px;margin:15px;position:relative;}

.m_con_bbs .m_notice ul{padding: 25px 0 0 0;}
.m_con_bbs .m_notice ul li{margin:0 0 20px 0;border-bottom:1px solid #d9d9d9;padding:0 0 20px 0}
.m_con_bbs .m_notice ul li a{background:url("/images/10_youth/main/bbs_new.jpg") no-repeat right;padding: 2px 20px 0px 0;line-height: 1.4em;color:#444}
.m_con_bbs .m_notice ul li.none{border:none;padding:0}
.m_con_bbs .m_notice ul li span{display:block;color: #37588e;padding:10px 0 0 0;}

.m_con_bbs .m_photo ul{padding:20px 0 0 0;}
.m_con_bbs .m_photo ul li{padding:0 0 20px 0;width:100%;}
.m_con_bbs .m_photo ul li img{width:100%;text-align:center;}
.m_con_bbs .m_photo ul li span{display:block;padding:10px 0 0 0;font-weight: bold;color:#444}
.text_blue{color:#3e5f95;}


/* Tablet */
@media all and (min-width:768px) {
    
.infozone{float:right;width: 50%;height: 263px;}
.infozone li img{height: 208px;}
.infozone h2{padding:15px 0 0 15px;height:40px;}

.infozone li{text-align:center;}
.m_visual{height:400px;}
.m_visual .visual_icon{width:85%;margin:0 0 27px 15%;}

.m_visual .visual_txt img{width:430px;}
.m_visual .visual_icon li{width:19%;margin:0%;background:none;}
.m_visual .visual_icon .icon01 a{background:url(/images/10_youth/main/icon01.png) no-repeat;background-size: 70px;background-position: 49% 0;padding: 80px 0px 0 0;}
.m_visual .visual_icon .icon02 a{background:url(/images/10_youth/main/icon02.png) no-repeat;background-size: 70px;background-position: 51% 0;padding: 80px 0px 0 0;}
.m_visual .visual_icon .icon03 a{background:url(/images/10_youth/main/icon03.png) no-repeat;background-size: 70px;background-position: 49% 0;padding: 80px 0px 0 0;}
.m_visual .visual_icon .icon04 a{background:url(/images/10_youth/main/icon04.png) no-repeat;background-size: 70px;background-position: 48% 0;padding: 
80px 0px 0 0;}
.m_visual .visual_icon .icon05 a{background:url(/images/10_youth/main/icon05.png) no-repeat;background-size: 70px;background-position: 48% 0;padding: 80px 0px 0 0;}

.m_visual .visual_icon .icon01 a:hover{background:url(/images/10_youth/main/icon01_on.png) no-repeat;background-size: 70px;background-position: 49% 0;}
.m_visual .visual_icon .icon02 a:hover{background:url(/images/10_youth/main/icon02_on.png) no-repeat;background-size: 70px;background-position: 51% 0;}
.m_visual .visual_icon .icon03 a:hover{background:url(/images/10_youth/main/icon03_on.png) no-repeat;background-size: 70px;background-position: 49% 0;}
.m_visual .visual_icon .icon04 a:hover{background:url(/images/10_youth/main/icon04_on.png) no-repeat;background-size: 70px;background-position: 48% 0;}
.m_visual .visual_icon .icon05 a:hover{background:url(/images/10_youth/main/icon05_on.png) no-repeat;background-size: 70px;background-position: 48% 0;}


.m_banner{padding: 30px 20px;}
.m_banner .infozone_line{border-top:none;padding:0;}
.m_banner ul{margin: 0;}
.m_banner .banner_l{float:left;width:50%}
.m_banner li{width: 33%;margin: 70px 0 0 0;}
.m_banner .tit{display:block;font-size:16px;font-weight:600;padding: 100px 0 10px 0;}
.m_banner .s_tit{display:block;padding:0 10px;font-size:13px;word-break:keep-all}
.m_banner .m_ban04{border:none;}

.m_con_bbs .m_notice ul li{font-size: 18px;}
.m_con_bbs .m_photo ul li{float:left;width:48%;margin:0 1%}

}





/* Desktop */
@media all and (min-width:1023px) {
header nav>div>ul>li>a{font-weight:normal;font-size: 16px;}
header nav{top:190px;}
.m_con_auto{width:1200px;margin:0 auto;}
.m_visual{height: 900px;width: auto;padding: 50px 0 0 0;}
.m_visual .visual_icon{bottom:71px;width:1200px; margin:0;}
.m_visual .visual_txt img{width:auto;}
.visual_icon li{width:200px;}
.m_visual .visual_icon li{width:300px;font-size:22px; font-weight:bold;}
.m_visual .visual_icon .icon01 a{background-size:auto;padding: 120px 0px 0 0;}
.m_visual .visual_icon .icon02 a{background-size:auto;padding: 120px 0px 0 0;}
.m_visual .visual_icon .icon03 a{background-size:auto;padding: 120px 0px 0 0;}
.m_visual .visual_icon .icon04 a{background-size:auto;padding: 120px 0px 0 0;}
.m_visual .visual_icon .icon05 a{background-size:auto;padding: 120px 0px 0 0;}

.m_visual .visual_icon .icon01 a:hover{background:url(/images/10_youth/main/icon01_on.png) no-repeat;background-size:auto;background-position: 49% 0;}
.m_visual .visual_icon .icon02 a:hover{background:url(/images/10_youth/main/icon02_on.png) no-repeat;background-size:auto;background-position: 51% 0;}
.m_visual .visual_icon .icon03 a:hover{background:url(/images/10_youth/main/icon03_on.png) no-repeat;background-size:auto;background-position: 49% 0;}
.m_visual .visual_icon .icon04 a:hover{background:url(/images/10_youth/main/icon04_on.png) no-repeat;background-size:auto;background-position: 48% 0;}
.m_visual .visual_icon .icon05 a:hover{background:url(/images/10_youth/main/icon05_on.png) no-repeat;background-size:auto;background-position: 48% 0;}

.m_search{background:url("/images/10_youth/main/m_search_bg.jpg") no-repeat center top #e4780b;padding:40px 0;height:50px}
.m_search h2{float:left;width:330px;}
.m_search .m_search_wap{float:left;width:500px;font-size:16px}
.m_search .m_search_wap .inp_list01{height:50px;}
.m_search .m_search_wap .inp_list02{height:50px;}
.m_search .m_search_wap .inp_btn{height:50px;font-size:17px}
.m_search .m_search_btn{float:right;width:210px;padding:15px 0 15px 30px;font-size:17px}

.m_banner{overflow:hidden;padding: 81px 0;width:1200px;margin:0 auto;}
.m_banner .banner_l{width: 62%;}
.m_banner ul li{background-size:auto !important;margin-top: 15px;width: 239px;}
.m_banner ul .tit{font-size:24px;padding: 190px 0 10px 0;}

.infozone_line{width: 37%;overflow:hidden;border-left: 1px solid #d9d9d9;height:290px}
.infozone h2{font-size: 27px;padding: 0 0 15px 0;}
.infozone{width:395px;}
.infozone li img{width:395px;}


.m_con_bbs{padding:60px 0;}
.m_con_bbs h2{font-size: 27px;}
.infozone p{top:5px;}
.m_con_bbs .m_notice{background-color:#fff;box-shadow:1px 1px 3px 0 #888;float:left;width: 355px;padding:40px;margin:0;height: 295px;}
.m_con_bbs .m_notice ul li{margin: 0px 0 24px 0;border-bottom:1px solid #d9d9d9;padding: 0 0 35px 0;}
.m_con_bbs .m_notice ul li span{padding: 15px 0 0 0;font-size: 15px;}
.m_con_bbs .more_1{top: 43px;right: 261px;}
.m_con_bbs .m_photo{background-color:#fff;box-shadow:1px 1px 3px 0 #888;float:right;width: 630px;padding:40px;margin:0;height: 295px;}
.m_con_bbs .m_photo ul li span{padding:25px 0 0 0;font-size:16px}
.m_con_bbs .more_2{top: 44px;left: 180px;}

}