﻿@charset 'UTF-8';

/* CSS Document */



/***** -----   Initialization   -----*****/

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{ margin: 0; padding: 0;font-family: 'Microsoft YaHei', Arial, Helvetica, sans-serif; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, iframe{ display: block; }

iframe{ border: 0; }

h1, h2, h3, h4, h5, h6{ font-size: 100%; font-weight: 500; }

audio, canvas, video{ display: inline-block; *display: inline; *zoom: 1; }

table{ border-collapse: collapse; border-spacing: 0; }

address, cite, dfn, em, var, i{ font-style: normal; font-weight: 400; }

del{ text-decoration: line-through; }

ul, ol{ list-style: none; }

a{ text-decoration: none; color: #333;border:0;margin:0;padding:0; }

fieldset, img, button, input{ border: 0; }

button, input, select, textarea{ font-size: 100%; }

input{ border-radius: 0; }

body{ min-width: 320px; overflow-x: hidden; -webkit-text-size-adjust: none; -webkit-font-smoothing: subpixel-antialiased; color: #000; }

body, button, input, select, textarea{ font-size: 100%;  }

:focus{ outline: 0; }

.clearfloat { clear: both; height: 0; line-height: 0; font-size: 1px; }

.c:before, .c:after { content: ""; display: table; }

.c:after { clear: both; }

.c { zoom: 1; }

/***** -----   新增样式  -----*****/
.top_dh{ width:100% !important; height:100%;display: inline-block; position: relative;}
.top_dh dl{ width:100% !important; height:auto; background:#000;}
.top_dh dl dd{ float: left !important; width:33.3% !important;}
.top_dh dl dd img{ width:100% !important; height:auto !important;}

/***** -----   Extend Style   -----*****/

.fl{ float: left; display: inline;}

.fr{ float: right; display: inline;}

.fn{ float: none;}



.dn, .dsn{ display: none;}

.di{ display: inline;}

.db{ display: block;}

.dib{ display: inline-block;}



.tal{ text-align: left;}

.tac{ text-align: center;}

.tar{ text-align: right;}



.por{ position: relative;}

.poa{ position: absolute;}

.pof{ position: fixed;}

.poss{ position: static;}



.fwb{ font-weight: bold;}

.fwn{ font-weight: normal;}



.mt0{ margin-top: 0!important;}



/***** -----   ���� ������ɫ   -----*****/

html{ font-size: 200px; }

body{ background: #72777a; font-size: .15rem; max-width: 6.4rem; margin: 0 auto; padding-top: 0px; position: relative; }

a { color: #333; }

a:hover { color: #f63; }



/***** -----   �ؼ�   -----*****/

.ico_video{ width: .62rem; height: .62rem; background: url(../images/ico.png) no-repeat; background-size: 100%;}

.ico_close{ display: inline-block; vertical-align: middle; position: relative; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}

.ico_close:after, .ico_close:before{ content: ''; position: absolute; left: 50%; top: 50%; background: #a8abad; border-radius: .04rem;}

.ico_close:after{ width: .44rem; height: .03rem; margin: -.015rem 0 0 -.22rem;}

.ico_close:before{ width: .03rem; height: .44rem; margin: -.22rem 0 0 -.015rem;}



/***** -----   ����   -----*****/

.topper{ position: fixed; left: 0; top: 0; right: 0; z-index: 999;  }

.topper .frm_text{ width: 6.4rem; margin: 0 auto; background: #d10000; color: #fff; font-size: 20px; height: 35px; line-height: 35px; }

.frm_text li{ float: left; display: inline; min-width: 6.4rem;}





/***** -----   ͷ��   -----*****/

.banner img{ display: block; width: 100%; height: auto; margin-top:0px; }





/***** -----   β��   -----*****/

.footer{ line-height: .28rem; height: auto; font-size: .18rem; color: #999; text-align: center; padding: .21rem 0 .43rem 0; background: #f6f6f6; }

.footer_p1{font-size: .22rem;}



/***** -----   ����   -----*****/

.liebiao_list li{position:relative;margin-top:0px;width:100%;font-size:0;}





/***** -----   ����   -----*****/

.introduce{ background: #e4e4e4; font-size: .18rem; color: #7a7f82; line-height: .38rem; padding: .18rem 0 .18rem 0; text-align: center;}



.column_title{ text-align: center; padding: .05rem 0 .11rem; background: #f6f6f6;}

.column_title .title{ display: inline-block; position: relative; font-size: .28rem; line-height: .38rem; color: #f65859;}

.column_title .title:after, .column_title .title:before{ content: ''; position: absolute; top: 50%; margin-top: -.01rem; width: .48rem; height: .02rem; background: #f65859;}

.column_title .title:after{ left: -.6rem;}

.column_title .title:before{ right: -.6rem;}

.column_title p{ font-size: .22rem; line-height: .28rem; color: #7a7f82;}



/*��Ƶ�б�*/

.video_list{ font-size: 0; font-size: 1px\9; font-size: 1px\0; text-align: center; background: #f6f6f6;}

.video_list li{ display: inline-block; vertical-align: top; background: #fff; width: 3.02rem; margin: .06rem; background: #fff; box-shadow: 0 0 .05rem #ddd;}

.video_list li .item_img{ position: relative; display: block; height: 1.62rem; padding: .07rem .07rem 0;}

.video_list li .item_img img{ display: block; width: 100%; height: 100%;}

.video_list li .item_img .ico_video{ position: absolute; z-index: 2; left: 50%; top: 50%; margin: -.31rem 0 0 -.31rem;}

.video_list li .item_name{ font-size: .22rem; line-height: .32rem; height: .32rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #7a7f82; padding: .08rem 0 0 0;}

.video_list li .item_intro{ font-size: .15rem; line-height: .28rem; height: .28rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #7a7f82; margin: .01rem 0 0 0; padding: 0 0 .08rem;}
.video_list li .item_intro span{ float:left; margin-left:30%;}
.video_list li .item_intro i{ width:12px; height:12px; background-size:100%;  background:url(../images/li01.png) no-repeat; display:block; float:left; }



.pop_video{ position: relative; background: #fff; width: 5.5rem; border: .07rem solid #d2d2d2;}

.pop_video_close{ position: absolute; right: 0; top: 0; width: .65rem; height: .65rem; line-height: .65rem; text-align: center; cursor: pointer;}

.pop_video_title{ font-size: .26rem; line-height: .36rem; color: #7a7f82; text-align: center; padding: .19rem 0;}

.pop_video_main{ padding: 0 .07rem;}

.pop_video_main video{ width: 100%; height: 3rem;}

.pop_video_intro{ font-size: .2rem; line-height: .3rem; color: #7a7f82; padding: .2rem 0; text-align: center;}


/***** -----   ����   -----*****/

.theinvimg{ position:relative;margin-top:0px;width:100%;font-size:0;}


















/***** -----   ý���ѯ - ��������   -----*****/

/* ��Ƹ���=640ʱ, 4rem=400px, 1rem=100px, .5rem = 50px, .1rem = 10px �Դ����� */

@media screen and (max-width: 1440px) { html { font-size: 225px; } }

@media screen and (max-width: 1366px) { html { font-size: 213.4375px; } }

@media screen and (max-width: 1280px) { html { font-size: 200px; } }

@media screen and (max-width: 1200px) { html { font-size: 187.5px; } }

@media screen and (max-width: 1120px) { html { font-size: 175px; } }

@media screen and (max-width: 1080px) { html { font-size: 168.75px; } }

@media screen and (max-width: 960px) { html { font-size: 150px; } }

@media screen and (max-width: 880px) { html { font-size: 137.5px; } }

@media screen and (max-width: 840px) { html { font-size: 131.25px; } }

@media screen and (max-width: 800px) { html { font-size: 125px; } }

@media screen and (max-width: 750px) { html { font-size: 117.1875px; } }

@media screen and (max-width: 720px) { html { font-size: 112.5px; } }

@media screen and (max-width: 640px) { html { font-size: 100px; } }

@media screen and (max-width: 600px) { html { font-size: 93.75px; } }

@media screen and (max-width: 560px) { html { font-size: 87.5px; } }

@media screen and (max-width: 480px) { html { font-size: 75px; } }

@media screen and (max-width: 414px) { html { font-size: 64.6875px; } }

@media screen and (max-width: 400px) { html { font-size: 62.5px; } }

@media screen and (max-width: 384px) { html { font-size: 60px; } }

@media screen and (max-width: 375px) { html { font-size: 58.59375px; } }

@media screen and (max-width: 360px) { html { font-size: 56.25px; } }

@media screen and (max-width: 320px) { html { font-size: 50px; } }


.index-group {
    margin: 0 auto;
	
    width: 100%;
    font-size: 14px;
    font-family: Microsoft YaHei;
    
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    box-orient: horizontal;
    display: -webkit-box;
}

.index-group .nav {
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
	display: block;
	margin-left: 1px;
	text-align: center;
	color: #fff;
	height: 100%;
	line-height: 36px;
	font-size: 14px;
	vertical-align: top;
	font-weight: bold;
}

.index-group .nav a {

    color: #fff;

}

.index-group .nav:first-child {
    margin-left: 0
}

	.button-bg-color{ background:#000;   color: #fff;}