/*@font-face {
 font-family: 'SYHT';
 src: url('SHSCN-ELight.eot');
 src: local('☺'), url('SHSCN-ELight.woff') format('woff'), url('SHSCN-ELight.ttf') format('truetype');
 font-weight: normal;
 font-style: normal;
}
*/
/*reset*/
html{background:none;color:#222; height:100%;}
body{font-size:12px;font-family:verdana;line-height:1.9em; font-family:"SYHT",Microsoft YaHei,Tahoma,Arial; background-color:#fff; height:100%; overflow:hidden;}
body, div, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, textarea, p, th, td, dl, dt, dd{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
img{border:none;}
/*address, caption, cite, code, dfn, em, th, var, b, i{font-style:normal;font-weight:normal;}*/
li{list-style-image:none;list-style-position: outside;list-style-type:none;}
caption, th{text-align:left;}
h1, h2, h3, h4, h5, h6{font-size:100%;font-weight:normal;vertical-align:baseline;zoom:1;}
input, textarea, select, button{font-size: 12px;font-weight:inherit; vertical-align:middle}
input[type=radio], input[type=checkbox]{vertical-align: middle; margin-right:5px;}
textarea{resize:none;}
input[type=text],input[type=password],textarea, input[type=text]:focus, input[type=password]:focus, textarea:focus, button, button:focus{-webkit-appearance:textfield;outline:0}
/*base*/
a{text-decoration:none; color:#383838;}
a:focus{outline-style:none;outline-width:0;}
a:link, a:visited, a:active{text-decoration:none;}
a:hover{text-decoration:none;}
.underline{text-decoration:underline!important;}
.bold{font-weight:bold;}
.floatleft{float:left;}
.floatright{float:right;}
.aligncenter{text-align:center;}
.alignright{text-align:right;}
.alignleft{text-align:left;}
.forcewrap{word-wrap:break-word;word-break:break-all;text-overflow:hidden;overflow:hidden;}
.borderless{border: none;}
label.checkbox, label.radio, label.text{padding-left:4px;vertical-align:top;}
.breakword{word-wrap:break-word;}
.position{position:relative;}
/*clear*/
.clearfix:after {content: ".";display: block;height:0;clear: both;visibility:hidden}
.clearfix {zoom:1}

/*导航*/
.nav{width:100%;height:60px;background:url(http://mat1.gtimg.com/www/images/qq2012/skin/QQnavBg.png) repeat-x top center; background-color:#000; z-index:9; position:relative;}
.navInner{width:1000px;margin:0 auto;}
.nav li{float:left;font-family:Microsoft YaHei,SimSun; font-size:16px; padding:18px 72px 0 0;height:42px;position:relative;}
.nav li .navIcon{width:20px;height:10px;position:absolute;bottom:0;left:38px;background:url(http://mat1.gtimg.com/www/images/qq2012/skin/navIcon.png) no-repeat;_background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=scale,src='http://mat1.gtimg.com/www/images/qq2012/skin/navIcon.png');}
.nav li a{color:#fff;}

/*margin*/
.margin20{margin-top:20px!important; margin-bottom:20px!important;}

.layout{width:100%; height:100%; position:absolute; left:0; top:0; overflow:hidden;}

.playBox{width:100%; height:100%; position:relative; overflow:hidden;}
.playBox .bg{width:100%; height:100%; position:absolute; left:0; top:0;}
.playBox .bg .logo{width:434px; height:218px; background:url(http://mat1.gtimg.com/www/qqskin/logo.png); position:absolute; top:50%; margin-top:-109px; left:50%; margin-left:-217px;}
.playBox .bg .l, .playBox .bg .r, .playBox .bg .t, .playBox .bg .b{position:absolute; background-color:#fff; opacity:0.8; filter:alpha(opacity=80);}
.playBox .bg .l{left:0; top:0; height:100%;}
.playBox .bg .r{height:100%;}
.playBox .bg .t{top:0; width:434px;}
.playBox .bg .b{width:434px;}
.playBox video{width:100%; position:absolute; left:0; top:50px; min-width:100%; min-height:100%;}
.playBox .vbox{width:100%; height:100%; overflow:hidden; display:none;}

/*cpt*/
.cpt{width:760px; height:436px; position:absolute; left:50%; top:50%; margin-left:-380px; margin-top:-218px; transition:all 0.2s; -webkit-transition:all;}
.cpt i{font-size:0; line-height:0; overflow:hidden; position:absolute; display:block; background-color:#707070; transition:all 0.2s; -webkit-transition:all 0.2s;}

.cpt .l_h_1{width:0; height:1px; bottom:7px; left:0;}/*760*/
.cpt .l_h_2{width:0; height:1px; left:14px; bottom:0;}/*733*/
.cpt .l_h_3{width:0; height:1px; left:0; bottom:23px;}/*760*/
.cpt .l_h_4{width:0; height:1px; left:342px; bottom:12px;}/*85*/
.cpt .l_h_5{width:0; height:1px; left:670px; bottom:43px;}/*580 left:90*/
.cpt .l_h_6{width:0; height:1px; left:90px; bottom:406px;}/*580*/
.cpt .l_h_7{width:0; height:1px; left:86px; bottom:435px;}/*592*/

.cpt .l_v_1{width:1px; height:0; transform:rotate(-64deg); left:0; bottom:7px;}/*16 left:6*/
.cpt .l_v_2{width:1px; height:0; transform:rotate(64deg); right:6px; bottom:-4px;}/*16*/
.cpt .l_v_3{width:1px; height:0; left:0; bottom:8px;}/*16*/
.cpt .l_v_4{width:1px; height:0; right:0; bottom:24px;}/*16 bottom:8*/
.cpt .l_v_5{width:1px; height:0; left:333px; transform:rotate(-40deg); bottom:23px;}/*14 bottom:11 left:337*/
.cpt .l_v_6{width:1px; height:0; left:427px; transform:rotate(40deg); bottom:11px;}/*14 bottom:11 left:431*/
.cpt .l_v_7{height:0; width:1px; left:75px; bottom:24px;}/*401*/
.cpt .l_v_8{height:0; width:1px; right:75px; bottom:425px;}/*401 bottom:24*/
.cpt .l_v_9{height:0; width:1px; left:90px; bottom:43px;}/*364*/
.cpt .l_v_10{height:0; width:1px; right:90px; bottom:406px;}/*364 bottom:43*/

/*皮肤展示组*/
.skins{width:100%; height:100%; position:absolute; top:0; color:#606060; height:340px; top:50%; left:100%; opacity:0;}
.skins .item{position:relative; width:1200px; height:100%; box-shadow:0 0 10px rgba(0,0,0,0.16); background-color:#fff; float:left; margin-right:100px;}
.skins .item .img_box{width:100%; height:100%; overflow:hidden;}
.skins .item img{width:100%; display:block;}
.skins .item .about{width:100%; padding-top:33px; height:100px; position:absolute; left:0; bottom:0; background:url(http://mat1.gtimg.com/www/qqskin/about_bg.png) no-repeat right center; background-color:#f8f8f8; box-shadow:0 0 14px rgba(0,0,0,0.2);}
.skins .item dl{width:190px; float:left; padding-left:47px; display:none;}
.skins .item dt{width:62px; height:62px; float:left;}
.skins .item dt img{width:100%; height:100%;}
.skins .item dd{margin-left:80px; line-height:18px;}
.skins .item dd.name{padding-top:13px; font-size:16px;}
.skins .item dd.e{font-family:Arial;}
.skins .txt{float:left; width:600px; height:66px; line-height:22px; overflow:hidden; padding-left:100px;}
.skins .item .filter{width:100%; height:100%; background-color:#fff; position:absolute; left:0; top:0; opacity:0.7; filter:alpha(opacity=70); transition:all 0.35s ease-in-out; -webkit-transition:all 0.35s ease-in-out;}
body .skins .current .filter{opacity:0; filter:alpha(opacity=0);}
.skins .hover .filter{opacity:0.2; filter:alpha(opacity=20);}
.skins .item .h2{line-height:44px; font-size:24px; position:absolute; left:5px; top:-44px; color:#6e6e6e;}
.skins .item .h2 em{font-size:14px; color:#929292; line-height:32px; padding:11px 0 0 11px; display:inline-block; font-style:normal;}


.cpt .l_r_1{width:20px; height:20px; border-color:#707070; border-style:solid; border-width:1px 0 0 1px; position:absolute; bottom:415px; left:75px; background:none; border-radius:10px 0 0 0; opacity:0; filter:alpha(opacity=0);}
.cpt .l_r_2{width:20px; height:20px; border-color:#707070; border-style:solid; border-width:1px 1px 0 0; position:absolute; bottom:415px; right:75px; background:none; border-radius:0 10px 0 0; opacity:0; filter:alpha(opacity=0)}
.cpt .l_r_3{width:16px; height:16px; border:1px solid #707070; border-radius:16px; position:absolute; background:none; left:382px; bottom:413px; opacity:0; filter:alpha(opacity=0)}

/*文字介绍*/
.skins_about{width:345px; height:315px; position:absolute; left:50%; margin-left:-500px; top:50%; margin-top:-155px;}
.skins_about li{width:100%; height:100%; position:absolute; left:0; top:0; opacity:0; filter:alpha(opacity=0)}
.skins_about .title{font-size:36px; line-height:42px; margin-bottom:24px;}
.skins_about .txt{font-size:14px; line-height:28px; height:140px; overflow:hidden;}
.skins_about .avatar{display:block; margin:0 auto; width:63px; height:63px; border:4px solid #fff; box-shadow:0 0 10px rgba(0,0,0,0.4); border-radius:50%; overflow:hidden;}
.skins_about .avatar img{width:100%; height:100%;}
.skins_about .name{text-align:center; font-size:16px; line-height:22px; margin-top:12px;}

/*背景层*/
.bgGroup{width:100%; height:100%; position:absolute; left:0; top:0;}
.bgGroup li{position:absolute; width:100%; height:100%; opacity:0; filter:alpha(opacity=0); background-repeat:no-repeat; background-position:center center; background-size:cover;}
.bgGroup .filter{width:100%; height:100%; position:absolute; left:0; top:0; background-color:#fff; opacity:0.05; filter:alpha(opacity=5); display:none;}


/*列表层*/
.skins_nav{position:absolute; bottom:-198px; left:133px; padding-bottom:8px;}
.skins_nav .hidden{width:100%; overflow:hidden; position:relative; height:100px; padding-top:41px;}
.skins_nav ul{position:absolute; width:10000px; left:0; top:41px}
.skins_nav li{float:left; width:151px; height:100px; position:relative;}
.skins_nav li div{width:150px; height:100px; position:relative;}
.skins_nav li div p{position:relative; height:100%; transition: all 0.4s ease-in-out 0s; cursor:pointer;}
.skins_nav li em,.skins_nav li i{display:block; width:150px; height:100px; background-color:#e34e31; background-repeat:no-repeat; background-position:center center; overflow:hidden; position:absolute; left:0; top:0; position:absolute;}
.skins_nav li em{}
.skins_nav li i{}
.skins_nav li img{width:100%; height:100%;}
.skins_nav li:hover div p, .skins_nav li.current div p{}

.can3d .skins_nav li{perspective:100px; -webkit-perspective:100px; -ms-perspective:100px;}
.can3d .skins_nav li div{transform-style:preserve-3d; -ms-transform-style:preserve-3d; -webkit-transform-style:preserve-3d; transform:translateZ(-50px); -webkit-transform-style:preserve-3d; -webkit-transform:translateZ(-50px); -ms-transform:translateZ(-50px);}
.can3d .skins_nav li div p{transform:rotateX(0deg); transform-style:preserve-3d; -webkit-transform:rotateX(0deg); -webkit-transform-style:preserve-3d; -ms-transform:rotateX(0deg); -ms-transform-style:preserve-3d;}
.can3d .skins_nav li em{transform: rotateX(0deg) translateZ(50px); -webkit-transform: rotateX(0deg) translateZ(50px); -ms-transform: rotateX(0deg) translateZ(50px);}
.can3d .skins_nav li i{transform: rotateX(90deg) translateZ(50px); -webkit-transform: rotateX(90deg) translateZ(50px); -ms-transform: rotateX(90deg) translateZ(50px);}
.can3d .skins_nav li:hover div p{transform: rotateX(-90deg);-webkit-transform: rotateX(-90deg);-ms-transform: rotateX(-90deg);}

.skins_nav .turn_left, .skins_nav .turn_right{width:46px; height:100px; background-image:url(http://mat1.gtimg.com/www/qqskin/nav_turn.png); background-repeat:no-repeat; position:absolute; top:50%; margin-top:-30px; display:block;}
.skins_nav .turn_left{left:-46px;}
.skins_nav .turn_right{right:-46px; background-position:right top;}
.skins_nav .turn_left:hover{background-position:left bottom;}
.skins_nav .turn_right:hover{background-position:right bottom;}

.skins_nav .times{position:absolute; top:30px; height:1px; width:100%; left:0;}
.skins_nav .times .line{height:1px; font-size:0; line-height:0; background-color:#ad8364; opacity:0.22; filter:alpha(opacity=22); width:100%;}
.skins_nav .times span{display:block; position:absolute; width:5px; height:5px; position:absolute; left:75px; top:-2px; border-radius:50%; background-color:#c4c4c4; display:none;}
.skins_nav .times span em{display:block; width:45px; height:18px; position:absolute; top:-28px; left:50%; margin-left:-22px; background-color:#c4c4c4; color:#fff; border-radius:8px; font-style:normal; text-align:center; line-height:18px;}
.skins_nav .times span em i{display:block; height:0; width:0; font-size:0; line-height:0; border-width:5px 5px 0 5px; border-style:solid; border-color:#c4c4c4 transparent transparent transparent; position:absolute; bottom:-5px; left:50%; margin-left:-5px;}

.test3d{display:none;transform-style:preserve-3d; -ms-transform-style:preserve-3d; -webkit-transform-style:preserve-3d;}

.mouse{width:38px; height:92px; background:url(http://mat1.gtimg.com/www/qqskin/mouse.png) no-repeat; position:absolute; left:50%; margin-left:-19px; bottom:90px; display:none;}
.mouse span{display:block; position:absolute; width:123px; height:25px; line-height:24px; text-align:center; border-radius:24px; color:#fff; background-color:#666; left:50%; margin-left:-61px; bottom:-45px; font-size:12px;}
.mouse_n{background-position:right top;}

.mouse_click{width:100%; height:100%; position:absolute; left:0; top:0; background-color:#fff; opacity:0; filter:alpha(opacity=0);}
.none{display:none;}

.skin_turn_l, .skin_turn_r{width:48px; height:48px; display:block; position:absolute; top:50%; margin-top:-24px; background-image:url(http://mat1.gtimg.com/www/qqskin/skin_turn.png); background-repeat:no-repeat; cursor:pointer;}
.skin_turn_l{left:-50px;}
.skin_turn_r{right:-50px; background-position:right top;}
.skin_turn_l:hover, .skin_turn_l.hover{background-position:left bottom;}
.skin_turn_r:hover, .skin_turn_r.hover{background-position:right bottom;}

.skin_turn_l span, .skin_turn_r span{display:block; position:absolute; top:50%; margin-top:-23px; height:46px; line-height:46px; text-align:center; width:138px; background-color:#c5c5c5; color:#fff; background-color:rgba(123,123,123,0.7); border-radius:4px; display:none; opacity:0;}
.skin_turn_l i, .skin_turn_r i{display:block; position:absolute; width:8px; height:15px; top:50%; margin-top:-7px; background-image:url(http://mat1.gtimg.com/www/qqskin/tips_sharp.gif); opacity:0.7; filter:alpha(opacity=70);}
.skin_turn_l span{left:60px;}
.skin_turn_l i{left:-8px;}
.skin_turn_r span{right:60px;}
.skin_turn_r i{right:-8px; background-position:right top;}

.loading{position:absolute; left:0; top:0; width:100%; height:100%; z-index:8; background-color:#fff;}
.loading .loading_in{width:80px; height:76px; position:absolute; left:50%; top:50%; margin-left:-40px; margin-top:-38px; background:url(http://mat1.gtimg.com/www/qqskin/loading.png) no-repeat right top;}
.loading span{display:block; width:100%; height:0; position:absolute; left:0; bottom:0; background:url(http://mat1.gtimg.com/www/qqskin/loading.png) no-repeat left bottom;}

.hover_t_l, .hover_t_r{height:100%; position:absolute; top:0; display:block; background-color:#fff; opacity:0; filter:alpha(opacity=0); width:300px; cursor:pointer; display:none;}
.hover_t_l{left:-100px;}
.hover_t_r{right:-100px;}
/*.cpt .l_h{width:0;}
.cpt .l_v{height:0;}
.cpt .l_r{opacity:0; filter:alpha(opacity=0);}⨯†硼癇〰㙼攴昷愹攷敢摦㤱愵㄰㑢㝤㤴ㅤ挴敢‹⼪