﻿@charset "utf-8";

body{ font-family:"宋体"; background:url(../image/BGB.jpg); margin:0px; padding:0px; font-size:12px; color:#EEE;}
.body{ width:800px; height:560px; margin:0px auto 10px; position:relative; z-index:100; border:solid 1px #666; background:#000;}

.head{ width:800px; height:65px; margin:10px auto; overflow:hidden;}
.head a.logo{ float:left;}
.head a{ float:right; border:none;}
.head img{ border:none;}

.otherTools{ position:absolute; right:0px; top:0px; z-index:900;}
.otherTools .button{ height:26px; line-height:26px; background:#333; border:solid 1px #666; border-right:solid 1px #000; border-bottom:solid 1px #000; color:#EEE; margin:0px; padding:0px; text-align:center; cursor:pointer;}


.BaseToolTip{padding:5px; border:solid 1px #666; border-right:solid 1px #000; border-bottom:solid 1px #000; background:#333; color:#EEE;}
.BaseToolTip p{ color:#999; margin:0px; padding:0px;}
html body .none{ display:none;}
.skillBox{ width:395px; height:560px; border-left:solid 1px #000; border-right:solid 1px #000; float:left; overflow:hidden;}
.skillMenu{ }
.skillMenu dl{ width:397px; margin:0px; padding:0px; overflow:hidden; background:#333; border-top:solid 1px #000;}
.skillMenu dt{ width:64px; height:68px; float:left; border:solid 1px #666; border-right:solid 1px #000; border-bottom:solid 1px #000; cursor:pointer; position:relative; z-index:100;}
.skillMenu dt.over{ background:#222;}
.skillMenu dt.selected{ background:#000;}
.skillMenu img{ width:64px; vertical-align:top;}
.skillMenu span{ position:absolute; z-index:200; bottom:0px; right:0px;}
.skillTree{ width:7200px; height:349px; overflow:hidden; margin-left:0px; background:#000;}
.skill{ width:400px; height:350px; position:relative; z-index:100; float:left;}
.skill div{ display:none;}
.skill div.show{ display:block;}


html body .none{ display:none;}

.preview{ float:left; width:200px; height:560px; overflow:hidden; position:relative; z-index:200;}
.preview .over td{ background:#222;}
.preview table{ border-right:solid 1px #666; background:#333; width:100%;}
.preview thead th{font-size:13px; font-weight:normal; padding:6px 9px; line-height:19px;}
.preview tbody th{ font-size:13px; font-weight:normal; padding:6px 8px; background:#333; border:solid 1px #000; border-top:solid 1px #666; line-height:15px;}
.preview tbody td{ font-size:12px; font-weight:normal; border-top:solid 1px #666; border-bottom:solid 1px #000; padding:3px 14px 3px 0px; text-align:right; background:#333; line-height:15px;}
.preview .noStyle{ padding:0px; border:none; height:0px; line-height:0px;}
.preview td.addButton{ border-left:solid 1px #666; cursor:pointer;}
.preview div{ height:10px; width:9px; border:solid 1px #000; background:#666; cursor:pointer;}

.classBox{ position:absolute; top:-1px; left:0px; z-index:150; width:145px; height:247px; border:solid 1px #666; background:#000; padding:1px; margin-left:0px;}
.classBox h3{ display:block; margin:0px; padding:0px; line-height:20px; font-size:14px; text-align:center;}
.classBox i{ display:block; margin:0px; padding:0px; line-height:16px; font-size:12px; text-align:center; font-style:normal;}
.classBox .imgBox{ position:relative; z-index:170; background:#000;}
.imgBox div{ position:absolute; left:0px; top:0px; display:none; background:#000;}
.imgBox div.showClass{ display:block;}
.imgBox div.a0{ display:block;}


.skillPreview{ width:400px; height:532px; border-right:solid 1px #666; float:left; overflow-y:auto;}
.code{ width:202px; height:560px; float:right; overflow:hidden; padding:0px; background:#333; border-left:solid 1px #666;}
.code .contentBox{ height:527px; overflow-y:auto; border:solid 1px #000; border-top:none;}
.code .content{ padding:10px; overflow:hidden;}
.code .over{ background:#222;}
.makeCode,.deleteCode{ display:inline-block; width:99px; height:30px; line-height:30px; background:#444; border:solid 1px #666; border-right:solid 1px #000; border-bottom:solid 1px #000; color:#EEE; margin:0px; padding:0px; text-align:center; cursor:pointer;}

.skillTree .tj{ background:url(../image/f/01.png);}
.skillTree .zj{ background:url(../image/f/02.png);}
.skillTree .gd{ background:url(../image/f/03.png);}
.skillTree .ss{ background:url(../image/f/04.png);}
.skillTree .ds{ background:url(../image/f/05.png);}
.skillTree .js{ background:url(../image/f/06.png);}
.skillTree .qj{ background:url(../image/f/07.png);}
.skillTree .qx{ background:url(../image/f/08.png);}
.skillTree .ks{ background:url(../image/f/09.png);}
.skillTree .pq{ background:url(../image/f/10.png);}
.skillTree .kc{ background:url(../image/f/11.png);}
.skillTree .lj{ background:url(../image/f/12.png);}
.skillTree .hs{ background:url(../image/f/13.png);}
.skillTree .zh{ background:url(../image/f/14.png);}
.skillTree .hm{ background:url(../image/f/15.png);}
.skillTree .hf{ background:url(../image/f/16.png);}
.skillTree .bh{ background:url(../image/f/17.png);}
.skillTree .fm{ background:url(../image/f/18.png);}

.perk{ position:absolute; width:20px; height:12px; padding-top:8px; font-size:12px; line-height:12px; text-align:right; border:solid 1px #999; cursor:pointer;}
div.perk{ background:url(../image/star.png); border:solid 1px #FFF;}

.tj .p-1-1-0,.tj .p-1-1-1{ top:240px; left:160px;}
.tj .p-2-1-0,.tj .p-2-1-1{ top:160px; left:65px;}
.tj .p-2-2-0,.tj .p-2-2-1{ top:160px; left:170px;}
.tj .p-2-3-0,.tj .p-2-3-1{ top:180px; left:235px;}
.tj .p-3-1-0,.tj .p-3-1-1{ top:135px; left:70px;}
.tj .p-3-2-0,.tj .p-3-2-1{ top:150px; left:305px;}
.tj .p-4-1-0,.tj .p-4-1-1{ top:115px; left:140px;}
.tj .p-4-2-0,.tj .p-4-2-1{ top:145px; left:365px;}
.tj .p-5-1-0,.tj .p-5-1-1{ top:120px; left:265px;}
.tj .p-6-1-0,.tj .p-6-1-1{ top:110px; left:210px;}

.zj .p-1-1-0,.zj .p-1-1-1,.zj .p-1-1-2,.zj .p-1-1-3,.zj .p-1-1-4,.zj .p-1-1-5{ top:260px; left:190px;}
.zj .p-2-1-0,.zj .p-2-1-1{ top:210px; left:140px;}
.zj .p-2-2-0,.zj .p-2-2-1{ top:210px; left:235px;}
.zj .p-3-1-0,.zj .p-3-1-1{ top:160px; left:110px;}
.zj .p-3-2-0,.zj .p-3-2-1{ top:160px; left:250px;}
.zj .p-4-1-0,.zj .p-4-1-1{ top:105px; left:115px;}
.zj .p-4-2-0,.zj .p-4-2-1{ top:130px; left:260px;}
.zj .p-5-1-0,.zj .p-5-1-1{ top:80px; left:255px;}

.gd .p-1-1-0,.gd .p-1-1-1,.gd .p-1-1-2,.gd .p-1-1-3,.gd .p-1-1-4,.gd .p-1-1-5{ top:245px; left:200px;}
.gd .p-2-1-0,.gd .p-2-1-1{ top:195px; left:110px;}
.gd .p-2-2-0,.gd .p-2-2-1{ top:180px; left:185px;}
.gd .p-2-3-0,.gd .p-2-3-1{ top:195px; left:275px;}
.gd .p-3-1-0,.gd .p-3-1-1{ top:130px; left:135px;}
.gd .p-3-2-0,.gd .p-3-2-1{ top:145px; left:275px;}
.gd .p-4-1-0,.gd .p-4-1-1{ top:110px; left:165px;}
.gd .p-4-2-0,.gd .p-4-2-1{ top:110px; left:255px;}
.gd .p-5-1-0,.gd .p-5-1-1{ top:95px; left:205px;}

.ss .p-1-1-0,.ss .p-1-1-1,.ss .p-1-1-2,.ss .p-1-1-3,.ss .p-1-1-4,.ss .p-1-1-5{ top:270px; left:190px;}
.ss .p-2-1-0,.ss .p-2-1-1,.ss .p-2-1-2,.ss .p-2-1-3{ top:195px; left:150px;}
.ss .p-2-2-0,.ss .p-2-2-1{ top:220px; left:190px;}
.ss .p-2-3-0,.ss .p-2-3-1,.ss .p-2-3-2,.ss .p-2-3-3{ top:195px; left:225px;}
.ss .p-2-4-0,.ss .p-2-4-1,.ss .p-2-4-2,.ss .p-2-4-3{ top:195px; left:255px;}
.ss .p-3-1-0,.ss .p-3-1-1{ top:160px; left:175px;}
.ss .p-3-2-0,.ss .p-3-2-1{ top:160px; left:205px;}
.ss .p-4-1-0,.ss .p-4-1-1{ top:100px; left:195px;}
.ss .p-5-1-0,.ss .p-5-1-1{ top:60px; left:195px;}

.ds .p-1-1-0,.ds .p-1-1-1,.ds .p-1-1-2,.ds .p-1-1-3,.ds .p-1-1-4,.ds .p-1-1-5{ top:280px; left:175px;}
.ds .p-2-1-0,.ds .p-2-1-1,.ds .p-2-1-2,.ds .p-2-1-3{ top:200px; left:135px;}
.ds .p-2-2-0,.ds .p-2-2-1{ top:230px; left:175px;}
.ds .p-2-3-0,.ds .p-2-3-1,.ds .p-2-3-2,.ds .p-2-3-3{ top:200px; left:190px;}
.ds .p-2-4-0,.ds .p-2-4-1,.ds .p-2-4-2,.ds .p-2-4-3{ top:200px; left:215px;}
.ds .p-2-5-0,.ds .p-2-5-1,.ds .p-2-5-2,.ds .p-2-5-3{ top:245px; left:255px;}
.ds .p-3-1-0,.ds .p-3-1-1{ top:165px; left:155px;}
.ds .p-3-2-0,.ds .p-3-2-1{ top:165px; left:190px;}
.ds .p-3-3-0,.ds .p-3-3-1{ top:130px; left:230px;}
.ds .p-4-1-0,.ds .p-4-1-1{ top:85px; left:175px;}

.js .p-1-1-0,.js .p-1-1-1,.js .p-1-1-2,.js .p-1-1-3,.js .p-1-1-4,.js .p-1-1-5{ top:265px; left:235px;}
.js .p-2-1-0,.js .p-2-1-1{ top:215px; left:165px;}
.js .p-2-2-0,.js .p-2-2-1,.js .p-2-2-2,.js .p-2-2-3{ top:200px; left:220px;}
.js .p-3-1-0,.js .p-3-1-1{ top:180px; left:150px;}
.js .p-3-2-0,.js .p-3-2-1,.js .p-3-2-2{ top:200px; left:190px;}
.js .p-3-3-0,.js .p-3-3-1{ top:160px; left:200px;}
.js .p-4-1-0,.js .p-4-1-1{ top:130px; left:150px;}
.js .p-4-2-0,.js .p-4-2-1{ top:135px; left:195px;}
.js .p-5-1-0,.js .p-5-1-1{ top:110px; left:175px;}

.qj .p-1-1-0,.qj .p-1-1-1,.qj .p-1-1-2,.qj .p-1-1-3,.qj .p-1-1-4,.qj .p-1-1-5{ top:250px; left:205px;}
.qj .p-2-1-0,.qj .p-2-1-1{ top:190px; left:195px;}
.qj .p-3-1-0,.qj .p-3-1-1{ top:150px; left:160px;}
.qj .p-3-2-0,.qj .p-3-2-1{ top:110px; left:215px;}
.qj .p-4-1-0,.qj .p-4-1-1{ top:120px; left:165px;}
.qj .p-5-1-0,.qj .p-5-1-1{ top:90px; left:190px;}

.qx .p-1-1-0,.qx .p-1-1-1,.qx .p-1-1-2,.qx .p-1-1-3,.qx .p-1-1-4,.qx .p-1-1-5{ top:250px; left:175px;}
.qx .p-2-1-0,.qx .p-2-1-1{ top:195px; left:130px;}
.qx .p-2-2-0,.qx .p-2-2-1{ top:195px; left:215px;}
.qx .p-3-1-0,.qx .p-3-1-1{ top:145px; left:145px;}
.qx .p-3-2-0,.qx .p-3-2-1{ top:150px; left:225px;}
.qx .p-4-1-0,.qx .p-4-1-1{ top:125px; left:170px;}
.qx .p-4-2-0,.qx .p-4-2-1{ top:140px; left:200px;}
.qx .p-5-1-0,.qx .p-5-1-1{ top:100px; left:195px;}
.qx .p-6-1-0,.qx .p-6-1-1{ top:85px; left:240px;}

.ks .p-1-1-0,.ks .p-1-1-1{ top:250px; left:175px;}
.ks .p-2-1-0,.ks .p-2-1-1{ top:195px; left:200px;}
.ks .p-3-1-0,.ks .p-3-1-1{ top:175px; left:170px;}
.ks .p-3-2-0,.ks .p-3-2-1{ top:160px; left:215px;}
.ks .p-4-1-0,.ks .p-4-1-1{ top:155px; left:140px;}
.ks .p-4-2-0,.ks .p-4-2-1{ top:140px; left:185px;}
.ks .p-4-3-0,.ks .p-4-3-1{ top:125px; left:230px;}
.ks .p-5-1-0,.ks .p-5-1-1{ top:120px; left:155px;}
.ks .p-5-2-0,.ks .p-5-2-1{ top:105px; left:200px;}
.ks .p-5-3-0,.ks .p-5-3-1{ top:85px; left:240px;}
.ks .p-6-1-0,.ks .p-6-1-1{ top:85px; left:170px;}

.pq .p-1-1-0,.pq .p-1-1-1,.pq .p-1-1-2,.pq .p-1-1-3,.pq .p-1-1-4,.pq .p-1-1-5{ top:240px; left:155px;}
.pq .p-2-1-0,.pq .p-2-1-1{ top:195px; left:180px;}
.pq .p-3-1-0,.pq .p-3-1-1{ top:145px; left:170px;}
.pq .p-3-2-0,.pq .p-3-2-1{ top:145px; left:200px;}
.pq .p-3-3-0,.pq .p-3-3-1{ top:145px; left:230px;}
.pq .p-4-1-0,.pq .p-4-1-1{ top:120px; left:180px;}
.pq .p-4-2-0,.pq .p-4-2-1{ top:105px; left:205px;}
.pq .p-5-1-0,.pq .p-5-1-1{ top:90px; left:230px;}

.kc .p-1-1-0,.kc .p-1-1-1,.kc .p-1-1-2,.kc .p-1-1-3,.kc .p-1-1-4,.kc .p-1-1-5{ top:250px; left:160px;}
.kc .p-2-1-0,.kc .p-2-1-1{ top:200px; left:175px;}
.kc .p-2-2-0,.kc .p-2-2-1{ top:200px; left:215px;}
.kc .p-3-1-0,.kc .p-3-1-1{ top:150px; left:165px;}
.kc .p-3-2-0,.kc .p-3-2-1{ top:150px; left:235px;}
.kc .p-4-1-0,.kc .p-4-1-1{ top:120px; left:160px;}
.kc .p-4-2-0,.kc .p-4-2-1{ top:120px; left:245px;}
.kc .p-5-1-0,.kc .p-5-1-1{ top:90px; left:155px;}
.kc .p-6-1-0,.kc .p-6-1-1{ top:85px; left:210px;}

.lj .p-1-1-0,.lj .p-1-1-1,.lj .p-1-1-2,.lj .p-1-1-3,.lj .p-1-1-4,.lj .p-1-1-5{ top:255px; left:140px;}
.lj .p-2-1-0,.lj .p-2-1-1{ top:235px; left:240px;}
.lj .p-3-1-0,.lj .p-3-1-1{ top:190px; left:160px;}
.lj .p-3-2-0,.lj .p-3-2-1{ top:190px; left:215px;}
.lj .p-4-1-0,.lj .p-4-1-1{ top:155px; left:165px;}
.lj .p-4-2-0,.lj .p-4-2-1,.lj .p-4-2-2,.lj .p-4-2-3{ top:160px; left:210px;}
.lj .p-5-1-0,.lj .p-5-1-1{ top:115px; left:170px;}
.lj .p-5-2-0,.lj .p-5-2-1{ top:100px; left:205px;}
.lj .p-6-1-0,.lj .p-6-1-1{ top:60px; left:190px;}

.hs .p-1-1-0,.hs .p-1-1-1{ top:255px; left:200px;}
.hs .p-2-1-0,.hs .p-2-1-1{ top:245px; left:120px;}
.hs .p-2-2-0,.hs .p-2-2-1{ top:200px; left:140px;}
.hs .p-2-3-0,.hs .p-2-3-1{ top:195px; left:190px;}
.hs .p-2-4-0,.hs .p-2-4-1{ top:215px; left:255px;}
.hs .p-3-1-0,.hs .p-3-1-1{ top:160px; left:140px;}
.hs .p-3-2-0,.hs .p-3-2-1{ top:160px; left:180px;}
.hs .p-3-3-0,.hs .p-3-3-1{ top:175px; left:225px;}
.hs .p-4-1-0,.hs .p-4-1-1{ top:135px; left:150px;}
.hs .p-4-2-0,.hs .p-4-2-1{ top:135px; left:190px;}
.hs .p-4-3-0,.hs .p-4-3-1{ top:150px; left:220px;}
.hs .p-5-1-0,.hs .p-5-1-1{ top:110px; left:165px;}
.hs .p-5-2-0,.hs .p-5-2-1{ top:110px; left:205px;}

.zh .p-1-1-0,.zh .p-1-1-1{ top:245px; left:200px;}
.zh .p-2-1-0,.zh .p-2-1-1,.zh .p-2-1-2{ top:175px; left:135px;}
.zh .p-2-2-0,.zh .p-2-2-1{ top:195px; left:170px;}
.zh .p-2-3-0,.zh .p-2-3-1{ top:130px; left:165px;}
.zh .p-2-4-0,.zh .p-2-4-1{ top:195px; left:210px;}
.zh .p-2-5-0,.zh .p-2-5-1{ top:185px; left:240px;}
.zh .p-3-1-0,.zh .p-3-1-1{ top:130px; left:135px;}
.zh .p-3-2-0,.zh .p-3-2-1{ top:105px; left:165px;}
.zh .p-3-3-0,.zh .p-3-3-1{ top:140px; left:210px;}
.zh .p-3-4-0,.zh .p-3-4-1{ top:140px; left:240px;}
.zh .p-4-1-0,.zh .p-4-1-1{ top:105px; left:135px;}
.zh .p-4-2-0,.zh .p-4-2-1{ top:115px; left:210px;}
.zh .p-4-3-0,.zh .p-4-3-1{ top:115px; left:240px;}
.zh .p-5-1-0,.zh .p-5-1-1{ top:80px; left:155px;}
.zh .p-5-2-0,.zh .p-5-2-1{ top:80px; left:225px;}

.hm .p-1-1-0,.hm .p-1-1-1{ top:245px; left:180px;}
.hm .p-2-1-0,.hm .p-2-1-1,.hm .p-2-1-2{ top:175px; left:140px;}
.hm .p-2-2-0,.hm .p-2-2-1,.hm .p-2-2-2{ top:175px; left:170px;}
.hm .p-2-3-0,.hm .p-2-3-1,.hm .p-2-3-2{ top:175px; left:200px;}
.hm .p-2-4-0,.hm .p-2-4-1{ top:200px; left:220px;}
.hm .p-2-5-0,.hm .p-2-5-1{ top:225px; left:240px;}
.hm .p-3-1-0,.hm .p-3-1-1{ top:140px; left:140px;}
.hm .p-3-2-0,.hm .p-3-2-1{ top:130px; left:170px;}
.hm .p-3-3-0,.hm .p-3-3-1{ top:120px; left:200px;}
.hm .p-3-4-0,.hm .p-3-4-1{ top:150px; left:220px;}
.hm .p-3-5-0,.hm .p-3-5-1{ top:175px; left:240px;}
.hm .p-3-6-0,.hm .p-3-6-1{ top:200px; left:260px;}
.hm .p-4-1-0,.hm .p-4-1-1{ top:110px; left:230px;}
.hm .p-5-1-0,.hm .p-5-1-1{ top:80px; left:230px;}

.hf .p-1-1-0,.hf .p-1-1-1{ top:245px; left:195px;}
.hf .p-2-1-0,.hf .p-2-1-1{ top:180px; left:85px;}
.hf .p-2-2-0,.hf .p-2-2-1{ top:195px; left:145px;}
.hf .p-2-3-0,.hf .p-2-3-1{ top:135px; left:145px;}
.hf .p-2-4-0,.hf .p-2-4-1{ top:190px; left:195px;}
.hf .p-2-5-0,.hf .p-2-5-1,.hf .p-2-5-2{ top:180px; left:260px;}
.hf .p-2-6-0,.hf .p-2-6-1{ top:210px; left:250px;}
.hf .p-3-1-0,.hf .p-3-1-1{ top:125px; left:100px;}
.hf .p-3-2-0,.hf .p-3-2-1{ top:145px; left:190px;}
.hf .p-3-3-0,.hf .p-3-3-1{ top:145px; left:280px;}
.hf .p-4-1-0,.hf .p-4-1-1{ top:100px; left:190px;}
.hf .p-5-1-0,.hf .p-5-1-1{ top:80px; left:165px;}

.bh .p-1-1-0,.bh .p-1-1-1{ top:255px; left:195px;}
.bh .p-2-1-0,.bh .p-2-1-1{ top:205px; left:165px;}
.bh .p-2-2-0,.bh .p-2-2-1{ top:195px; left:195px;}
.bh .p-3-1-0,.bh .p-3-1-1,.bh .p-3-1-2,.bh .p-3-1-3{ top:140px; left:165px;}
.bh .p-3-2-0,.bh .p-3-2-1{ top:140px; left:195px;}
.bh .p-3-3-0,.bh .p-3-3-1,.bh .p-3-3-2,.bh .p-3-3-3{ top:140px; left:225px;}
.bh .p-4-1-0,.bh .p-4-1-1{ top:110px; left:180px;}
.bh .p-4-2-0,.bh .p-4-2-1{ top:110px; left:210px;}
.bh .p-5-1-0,.bh .p-5-1-1{ top:80px; left:150px;}
.bh .p-5-2-0,.bh .p-5-2-1{ top:80px; left:245px;}

.fm .p-1-1-0,.fm .p-1-1-1,.fm .p-1-1-2,.fm .p-1-1-3,.fm .p-1-1-4,.fm .p-1-1-5{ top:250px; left:180px;}
.fm .p-2-1-0,.fm .p-2-1-1{ top:190px; left:160px;}
.fm .p-2-2-0,.fm .p-2-2-1{ top:190px; left:200px;}
.fm .p-2-3-0,.fm .p-2-3-1{ top:190px; left:240px;}
.fm .p-3-1-0,.fm .p-3-1-1{ top:150px; left:160px;}
.fm .p-3-2-0,.fm .p-3-2-1{ top:150px; left:215px;}
.fm .p-3-3-0,.fm .p-3-3-1{ top:125px; left:240px;}
.fm .p-4-1-0,.fm .p-4-1-1{ top:120px; left:180px;}
.fm .p-5-1-0,.fm .p-5-1-1{ top:95px; left:210px;}

.warning{ width:800px; margin:10px auto; height:30px; overflow:hidden;}
div.showWarning{ height:auto;}
.warning table{ border:solid 1px #666; width:100%;}
.warning thead th{ border:solid 1px #000; background:#333; cursor:pointer;}
.warning tbody th{ border:solid 1px #000; border-top:solid 1px #666; background:#333; font-weight:normal;}
.warning td{ border:solid 1px #666; border-right:solid 1px #000; border-bottom:solid 1px #000; background:#333;}
.warning th,.warning td{ line-height:15px; padding:3px 9px; text-align:left;}
.warning i{ font-style:normal; color:#888;}
.warning h2{ float:left; font-size:12px; font-weight:normal; line-height:20px; margin:0px; padding:0px;}
.warning a{ color:#EEE; font-weight:normal; float:right; margin-left:20px; line-height:20px;}