/*
* @Author: Jason
* @Date:   2020-01-10 18:00:14
* @Last Modified by:   Jason
* @Last Modified time: 2024-03-08 15:22:56
*/
@charset "utf-8";

/* reset */
*, *:before, *:after { -webkit-transition: .5s; transition: .5s; }
body { font-size: 14px; font-family: Microsoft YaHei, Arial, Helvetica, sans-serif; color: #333; line-height: 1.5; }
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { padding: 0; margin: 0; }
input, select, button, textarea { font-size: 100%; font-family: inherit; outline: none; }
ul, ol { list-style: none; }
img { border: 0; }
a { text-decoration: none; color: #333; }
a:hover { text-decoration: underline; color: #f00; }
table { border-spacing: 0; border-collapse: collapse; }
small, .small { font-size: 12px; }
big, .big { font-size: 18px; }
:focus { outline: 0; }

/* common */
.clearfix:after, .area:after { display: block; height: 0; clear: both; content: ""; }
.clearfix, .area { zoom: 1; }
.clear { height: 0; overflow: hidden; clear: both; font-size: 0; }
.fl, .left { float: left; }
.fr, .right { float: right; }
.tl { text-align: left; }
.tc { text-align: center; }
.tr { text-align: right; }
.po-r { position: relative; }
.po-a { position: absolute; }
.hide { display: none; }
.hidden { display: none; }
.block { display: block; }

/* img-load */
.img-load .image, img.img-load,
.img-load img { display: block; overflow: hidden; background-color: #f5f5f5; }
.J_lazyImg { margin: 0 auto; background-color: #f5f5f5; }

/* img-zoom */
.img-zoom .image { position: relative; display: block; overflow: hidden; background-color: #f5f5f5; }
.img-zoom .image:hover img { -webkit-transform: scale(1.15); transform: scale(1.15); }
.img-zoom .image img { display: block; width: 100%; height: 100%; }

/* img-view */
.img-view .image { position: relative; }
.img-view .image:hover s { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background-color: #000; opacity: 0; filter: alpha(opacity=0); }
.img-view .image:hover s { opacity: .5; filter: alpha(opacity=50); }
.img-view .image i { position: absolute; top: 50%; left: -15%; z-index: 2; display: block; width: 40px; height: 40px; margin-top: -20px; margin-left: -20px; background: url("../images/view_icon.png") no-repeat; }
.img-view .image:hover i { left: 50%; }

/* img-hover */
.img-hover:hover { opacity: .8; filter: alpha(opacity=80); }

/* transition */
.trans-none, .trans-none ul { -webkit-transition: none; transition: none; }
.trans-add, .trans-add ul { -webkit-transition: .5s; transition: .5s; }