.warpper { background:#efefef;}
.line-through { text-decoration:line-through;}
.c-333 { color:#333;}
.c-999 { color:#999;}
header { width:100%; height:260px; background:#303538; overflow:hidden;}
.photo { width:130px; height:130px; overflow:hidden; margin:0 auto; margin-top:50px; border-radius:130px; border:2px solid #fff;}
.photo:hover { border-radius:20px; cursor:pointer;}
.photo img { width:100%;}
p.name { width:auto; height:30px; overflow:hidden; margin-top:20px; text-align:center; font-size:16px; color:#fff; font-weight:700;}
p.name2 { width:auto; height:40px; overflow:hidden; margin-top:80px; text-align:center; font-size:30px; color:#fff; font-weight:700;}
.mian { height:1000px;}
/*section*/
section {padding-bottom:8px;}
.box { width:75%; height:auto; margin:0 auto;}
h1.title-1 { text-align:left; font-size:30px; font-weight:700; padding:20px 0; margin-top:10px;}
ul.list-1 { font-size:18px; list-style:square; padding:0 20px;}
ul.list-3 { font-size:16px; line-height: 22px; list-style:none; padding:0px;}
ul.list-1 li { margin:10px 5px;line-height:24px;}

dl.list-1 { font-size:18px; list-style:square; padding:0px;}
dl.list-1 dt { margin:10px 5px 0 5px;line-height:24px;}
dl.list-1 dd { color: #999; margin:0 5px 10px 5px;line-height:22px; font-size: 12px;}

span.work-time { width:180px; display:inline-block; font-style:italic; color:#333;}
span.school { /*width:350px; display:inline-block; */ margin-left:20px; color:#666;}

.project { margin-bottom:10px;}
.pro-tb { border:1px solid #333; width:100%; background:#f6f6f6;}
.pro-tb th,.pro-tb td { border:1px solid #666; padding:8px;}
.pro-tb thead th { text-align:center;}
.pro-tb thead th a { color:#000; font-size:18px; font-weight:700;}
.pro-tb tbody td { line-height:20px;}
.tb-text { font-size:14px; color:#666; text-indent:28px;}
.tb-text2 { font-size:14px; color:#666; }
dl.list-2 { margin-bottom:8px; overflow:hidden;}
dl.list-2 dt { text-align:center; font-size:14px; color:#666; margin:10px 0;}
dl.list-2 dt.left { text-align:left; font-size:14px; color:#666; margin:10px 0;}
dl.list-2 dd { margin:6px 0;width:98%;}
span.bfb { width:100%; height:18px; line-height:18px; padding:4px; display:inline-block; border-radius:20px; background:#303538;}
span.bfb i { font-style:normal; font-size:14px; line-height:18px; color:#fff; text-indent:20px; width:0%; height:18px;  border-radius:20px; display:inline-block; background:#6c787f; float:left;}
/*.zyjn:hover span.bfb i { color:#303538;}*/

.zyjn:hover span.bfb i.bfb20
{
animation:bfb20 3s infinite;
-webkit-animation:bfb20 3s infinite; /*Safari and Chrome*/
animation-iteration-count:1;
width:20%;
}
@keyframes bfb20
{
from {width:2%;}
to {width:20%;}
}
.zyjn:hover span.bfb i.bfb30
{
animation:bfb30 3s infinite;
-webkit-animation:bfb30 3s infinite; /*Safari and Chrome*/
animation-iteration-count:1;
width:30%;
}
@keyframes bfb30
{
from {width:3%;}
to {width:30%;}
}
.zyjn:hover span.bfb i.bfb50
{
animation:bfb50 3s infinite;
-webkit-animation:bfb50 3s infinite; /*Safari and Chrome*/
animation-iteration-count:1;
width:50%;
}
@keyframes bfb50
{
from {width:5%;}
to {width:50%;}
}
.zyjn:hover span.bfb i.bfb60
{
animation:bfb60 3s infinite;
-webkit-animation:bfb60 3s infinite; /*Safari and Chrome*/
animation-iteration-count:1;
width:60%;
}
@keyframes bfb60
{
from {width:6%;}
to {width:60%;}
}
.zyjn:hover span.bfb i.bfb70
{
animation:bfb70 3s infinite;
-webkit-animation:bfb70 3s infinite; /*Safari and Chrome*/
animation-iteration-count:1;
width:70%;
}
@keyframes bfb70
{
from {width:7%;}
to {width:70%;}
}
.zyjn:hover span.bfb i.bfb80
{
animation:bfb80 3s infinite;
-webkit-animation:bfb80 3s infinite; /*Safari and Chrome*/
animation-iteration-count:1;
width:80%;
}
@keyframes bfb80
{
from {width:8%;}
to {width:80%;}
}
.zyjn:hover span.bfb i.bfb90
{
animation:bfb90 3s infinite;
-webkit-animation:bfb90 3s infinite; /*Safari and Chrome*/
animation-iteration-count:1;
width:90%;
}
@keyframes bfb90
{
from {width:9%;}
to {width:90%;}
}

.zyjn span.bfb i.bfb20 { width:20%;}
.zyjn span.bfb i.bfb30 { width:30%;}
.zyjn span.bfb i.bfb50 { width:50%;}
.zyjn span.bfb i.bfb60 { width:60%;}
.zyjn span.bfb i.bfb70 { width:70%;}
.zyjn span.bfb i.bfb80 { width:80%;}
.zyjn span.bfb i.bfb90 { width:90%;}

.set-nav { position:absolute; right:2em; top:1em;}
.set-nav span { color:#999; font-size:12px; margin-left:1em;}
.set-nav span a { color:#999; text-decoration: none;}
dl.list-2 dd { line-height:26px; border-bottom:1px dashed #cecece;}
dl.list-2 dd span { width:33.33%;display: inline-block;}