ul, li
        {
            list-style: none;
            margin: 0;
            padding: 0;
        }
        .bg
        {
            height: 540px;
            margin: 0 auto;
            padding: 20px;
            border: 1px solid #E8E8E8;
            overflow: hidden;
            min-width: 900px;
            box-sizing: border-box;
            background: #fff;
        }
        .bg_left
        {
            width: 430px;
            height: auto;
            float: left;
        }
        .bg_right
        {
            float: left;
        }
        .show
        {
            width: 430px;
            height: 430px;
            margin-bottom: 10px;
            position: relative;
            border: 1px solid #E8E8E8;
            cursor: move;
            box-sizing: content-box;
        }
        .show img
        {
            width: 430px;
            height: 430px;
        }
        .mask
        {
            width: 215px;
            height: 215px;
            background: #FFF;
            filter: Alpha(opacity=30);
            opacity: 0.3;
            position: absolute;
            top: 0;
            left: 0;
            display: none;
        }
        .bigshow
        {
            width: 430px;
            height: 430px;
            overflow: hidden;
            margin-left: 10px;
            display: none;
            border: 1px solid #E8E8E8;
            position: absolute;
            z-index: 10103;
        }
        .bigshow img
        {
            width: 860px;
            height: 860px;
            margin-right: 10px;
        }
        .smallshow
        {
            width: 100%;
            height: 70px;
            position: relative;
        }
        .smallshow img
        {
            width: 100%;
            border: 1px solid #e8e8e8;
            box-sizing: border-box;
            transition: all 0.5s;
        }
        .smallshow > .middle_box
        {
            margin-left: 30px;
            margin-right: 30px;
            width: 370px;
            overflow: hidden;
            height: 70px;
        }
        .smallshow .middle
        {
            overflow: hidden;
            transition: all 0.5s;
            height: 70px;
        }
        .smallshow .middle > li
        {
            width: 64px;
            height: 64px;
            float: left;
            cursor: pointer;
            padding: 0 5px;
        }
        .smallshow > p
        {
            position: absolute;
            top: 50%;
            width: 22px;
            height: 32px;
            margin-top: -16px;
        }
        .smallshow > .prev
        {
            left: 0;
            background: url(hover-prev.png) no-repeat;
            transition: all 0.5s;
        }
        .smallshow > .next
        {
            right: 0;
            background: url(hover-next.png) no-repeat;
            transition: all 0.5s;
        }
        .smallshow > .prev.prevnone
        {
            left: 0;
            background: url(prev.png) no-repeat;
            cursor: not-allowed;
        }
        .smallshow > .next.nextnone
        {
            right: 0;
            background: url(next.png) no-repeat;
            cursor: not-allowed;
        }