.wrap{ height:462px;}
.wl{ float:left; width: 100%; height:100%}
.wr{ float:left; width:225px;display: inline; }
.jy-up-ch{ position: relative; width: 395px;top: -80px;left: 50px;}
.jy-up-ch .bch{ display: block; position: absolute; background-repeat: no-repeat; background-image: url(../images/bch.jpg); }
.jy-up-ch .bch1{ width: 15px; height: 20px; background-position: 0 0; left: 0; top: 10px; }
.jy-up-ch .bch2{ width: 39px; height: 24px; background-position: -15px 0px; left: 50%; margin-left: -39px; top: 7px; }
.jy-up-ch .bch3{ width: 37px; height: 24px; background-position: -54px 0px; left: 50%; top: 7px; }
.jy-up-ch .bch4{ width: 15px; height: 20px; background-position: -91px 0px; right: 0; top: 10px; }
.jy-up-ch .bch1:hover{ background-position: 0 -27px; }
.jy-up-ch .bch2:hover{ background-position: -15px -24px;}
.jy-up-ch .bch3:hover{ background-position: -54px -24px;}
.jy-up-ch .bch4:hover{ background-position: -91px -27px;}
.jc-demo-box{position: relative; background-color: #f8f8f8; width: 100%; height: 100%; overflow: hidden; }
.jcrop_w{ width: 395px; height: 340px; overflow: hidden; }
.jcrop_w img{ position: absolute; }
.pre-1,.pre-2,.pre-3{ border: 1px solid #EAEAEA; margin:auto;}
.pre-1 img,.pre-2 img,.pre-3 img{width:100%; height:100%}
.pre-1{ width: 200px; height: 200px; border-radius:50%; overflow:hidden;  }
.pre-2{ width: 50px; height: 50px;border-radius:50%; overflow:hidden; margin-top: 13px; }
.pre-3{ width: 26px; height: 26px;border-radius:50%; overflow:hidden;margin-top: 13px; }