Merge branch 'feature/index' into develop

-bundle/**/*.js
-dist/**/*.js
\ No newline at end of file
+**/bundle/**/*.js
+**/dist/**/*.js

@@ -95,7 +95,7 @@ fabric.properties
 
 
 ### NetBeans ###
-nbproject/private/
+nbproject/
 build/
 nbbuild/
 dist/

@@ -6,39 +6,11 @@
 
 'use strict';
 
-const headerModel = require('../../../doraemon/models/header');
 
-// const channelModel = require('../models/index');
+const channelModel = require('../models/index');
 
 exports.boysIndex = (req, res) => {
-    headerModel.requestHeaderData()
-        .then(response => {
-            let data = headerModel.setHeaderData(response.data, 'boys');
-
-            data.module = 'index';
-            data.page = 'index';
-            data.footerTop = true;
-
-            res.render('boys', data);
-        })
-        .catch(() => {
-            res.render('error', {devEnv: true, pageErr: true});
-        });
-};
-
-exports.girlsIndex = (req, res) => {
-    headerModel.requestHeaderData()
-        .then(response => {
-            let data = headerModel.setHeaderData(response.data, 'girls');
-
-            data.module = 'index';
-            data.page = 'index';
-            data.footerTop = true;
-
-            res.render('girls', data);
-        })
-        .catch(() => {
-            res.render('error', {devEnv: true, pageErr: true});
-        });
-
+    channelModel.getContent('boys').then(data => {
+        res.render('boys', data);
+    });
 };

@@ -12,6 +12,7 @@ var app = express();
 
 // set view engin
 var doraemon = path.join(__dirname, '../../doraemon/views'); // parent view root
+var partials = path.join(__dirname, './views'); // parent view root
 
 app.on('mount', function(parent) {
     delete parent.locals.settings; // 不继承父 App 的设置
@@ -23,11 +24,12 @@ app.engine('.hbs', hbs({
     extname: '.hbs',
     defaultLayout: 'layout',
     layoutsDir: doraemon,
-    partialsDir: ['./views/partial', `${doraemon}/partial`],
-    helpers: 'helpers'
+    partialsDir: [`${partials}/partials`, `${doraemon}/partial`],
+    helpers: require('../../library/helpers')
 }));
 
 // router
 app.use(require('./router'));
 
 module.exports = app;
+

@@ -5,31 +5,333 @@
  */
 'use strict';
 
-// const _ = require('lodash');
+const _ = require('lodash');
 
 const ServiceAPI = require(`${global.library}/api`).ServiceAPI;
 const sign = require(`${global.library}/sign`);
 
 const serviceApi = new ServiceAPI();
 
-/**
- * 获取公共配置
- * @param undefined
- * @return {Object} 配置对象
- */
-// const commonConfig = () => ({
-//    title: 'girls'
-// });
+const headerModel = require('../../../doraemon/models/header');
 
-exports.getContent = () => {
-    let data = sign.apiSign({
+// 创意生活
+// const CODE_LIFESTYLE_CHANNEL_1 = '380c38155fd8beee10913a3f5b462da6';
+
+// const CODE_LIFESTYLE_CHANNEL_2 = '665f7c2fb9d037ee820766953ee34bf7';
+
+const channelMap = {
+    boys: {
+        code: '79372627eee75d73afe7f9bac91e5ce6',
+        gender: '1,3'
+    },
+    girls: {
+        code: '75215008957605c05e8cd375eac4f817',
+        gender: '2,3'
+    },
+    kids: {
+        code: 'd71f4b27f2a7229fbb31a4bc490a6f36',
+        gender: 'kids'
+    },
+    lifestyle: {
+        code: '8a341ca7eacc069ba80f02dec80eaf34',
+        gender: 'lifestyle'
+    }
+};
+
+const getBannerList = data => {
+    let list = [];
+
+    _.forEach(data, (bannerData) => {
+        let obj = {};
+
+        obj.href = bannerData.url;
+        obj.img = bannerData.src;
+        obj.name = bannerData.title;
+
+        list.push(obj);
+    });
+
+    return list;
+};
+
+const getadbannerData = data => {
+    const obj = {
+        adbanner: {
+            href: '',
+            img: '',
+            name: ''
+        }
+    };
+
+    obj.adbanner.href = data.url;
+    obj.adbanner.img = data.src;
+    obj.adbanner.name = data.title;
+
+    return obj;
+};
+
+const getSlideData = srcData => {
+    const slideData = {
+        slide: {
+            list: [],
+            pagination: []
+        }
+    };
+
+    slideData.slide.list = getBannerList(srcData.big_image);
+    slideData.slide.pagination = getBannerList(srcData.list);
+
+    return slideData;
+};
+
+
+const getNewReportFloorData = args => {
+    let item = args[0].data;
+    let secondItem = args[1].data;
+    let thirdItem = args[2].data;
+    let forthItem = args[3];
+
+    let list = [];
+    let obj = {};
+
+    const data = {
+        newReport: {
+            name: '最新速报',
+            list: []
+        }
+    };
+
+
+    let adData;
+    let floorDatas = [];
+
+
+    obj.href = item[0].url;
+    obj.img = item[0].src;
+
+    list.push(obj);
+
+    _.forEach(secondItem, (floorData) => {
+        let o = {};
+
+        o.href = floorData.url;
+        o.img = floorData.src;
+
+        list.push(o);
+    });
+
+    obj.href = thirdItem[0].url;
+    obj.img = thirdItem[0].src;
+
+    list.push(obj);
+
+    data.newReport.list = list;
+
+    floorDatas.push(data);
+
+    if (forthItem.template_name === 'single_image') {
+        adData = getadbannerData(forthItem.data[0]);
+        floorDatas.push(adData);
+    }
+
+    return floorDatas;
+};
+
+// 热门品类
+const getHotGoodsFloorData = (args) => {
+    let item = args[0];
+    let nextItem = args[1];
+
+    let list = [];
+
+    let object = {},
+        keyword = [],
+        category = [],
+        brands = [],
+        types = [],
+        navs = {},
+        products = [];
+
+    const data = {
+        recommend: {
+            tplrecommend: []
+        }
+    };
+
+
+    _.forEach(item.data.menuNav.list, (it) => {
+        let obj = {};
 
+        obj.name = it.name;
+        obj.href = it.url;
+        category.push(obj);
+    });
+
+    _.forEach(item.data.menuNav.blocks, (it) => {
+        let obj = {};
+
+        obj.name = it.title;
+        obj.href = it.url;
+        obj.img = it.img;
+        keyword.push(obj);
+    });
+
+    _.forEach(item.data.imgs, (it, idx) => {
+        let obj = {};
+
+        obj.name = it.title;
+        obj.href = it.url;
+        obj.img = it.img;
+
+        if (idx === 0 || idx === 4) {
+            brands.push(obj);
+        } else {
+            types.push(obj);
+        }
+    });
+
+    _.forEach(nextItem.data, (it) => {
+        let obj = {};
+
+        obj.name = it.title;
+        obj.href = it.url;
+        obj.img = it.src;
+
+        products.push(obj);
+    });
+
+    navs.name = item.data.navs.list[0].name;
+    navs.href = item.data.navs.list[0].url;
+    object.name = item.data.name;
+    object.keyword = keyword;
+    object.category = category;
+    object.brands = brands;
+    object.types = types;
+    object.navs = navs;
+    object.products = products;
+    list.push(object);
+
+    data.recommend.tplrecommend = list;
+
+    return data;
+};
+
+// 人气单品
+const getSingleHotFloorData = args => {
+    const len = 10;
+    const data = {
+        singlehot: {
+            name: '人气单品',
+            imgHot: []
+        }
+    };
+
+    let list = [];
+    let adData;
+    let floorDatas = [];
+
+    for (let i = 0; i < len; i++) {
+        let pos = i;
+        let val = {};
+        let obj = {};
+
+        if (i === 1) {
+            val = args[0].data[0]; // 第二个是大图
+        } else if (i === len - 1) {
+            val = args[0].data[1]; // 最后一个是大图
+        } else {
+            if (pos > 1) { // 小图
+                pos = pos - 1;
+            }
+            val = args[1].data[pos];
+        }
+        obj.href = val.url;
+        obj.img = val.src;
+        list.push(obj);
+    }
+
+    data.singlehot.imgHot = list;
+    floorDatas.push(data);
+
+    if (args[2].template_name === 'single_image') {
+        adData = getadbannerData(args[2].data[0]);
+        floorDatas.push(adData);
+    }
+
+    return floorDatas;
+};
+
+
+
+const requestContent = type => {
+
+    let data = sign.apiSign({
             /* eslint-disable */
-            client_type: 'web'
+            client_type: 'web',
             /* eslint-enable */
+        content_code: channelMap[type || 'boys'].code,
+        gender: channelMap[type || 'boys'].gender,
+        page: 1,
+        limit: 1000
     });
 
-    serviceApi.get('/operations/api/v5/resource/home', data).then(response => {
-        console.log(response);
+    return serviceApi.get('/operations/api/v5/resource/home', data);
+};
+
+const floorMap = {
+    slide: getSlideData,
+    hot: getHotGoodsFloorData,
+    最新速报: getNewReportFloorData,
+    人气单品: getSingleHotFloorData,
+    ad: getadbannerData
+};
+
+const processFloorData = rawData => {
+    let floorList = [];
+
+    _.forEach(rawData, (data, index) => {
+        let floorData = null;
+
+        if (data.template_name === 'recommend_content_three') {
+            floorData = floorMap.slide.call(null, data.data);
+        } else if (data.template_intro === '热门品类') {
+            floorData = floorMap.hot.call(null, rawData.slice(index, index + 2));
+        } else if (data.data.text) {
+            floorData = floorMap[data.data.text] &&
+                        floorMap[data.data.text].call(null, rawData.slice(index + 1, index + 5));
+        }
+
+        if (!_.isNil(floorData)) {
+            _.isArray(floorData) ?
+                floorList = floorList.concat(floorData) :
+                floorList.push(floorData);
+        }
+    });
+
+    return floorList;
+};
+
+/**
+ * 获取频道页数据
+ * @param  {string} type 传入频道页类型，值可以是: boys, girls, kids, lifestyle
+ * @return {object}
+ */
+exports.getContent = type => {
+    return Promise.all([headerModel.requestHeaderData(), requestContent(type)]).then(res => {
+
+        if (res[0].code === 200 && res[1].code === 200) {
+            let headerData = res[0].data,
+                contentData = res[1].data.list;
+
+            let data = {};
+
+            data = headerModel.setHeaderData(headerData, type);
+            data.module = 'channel';
+            data.page = type;
+            data.footerTop = true;
+            data.channel = processFloorData(contentData);
+
+            return data;
+        }
     });
 };

-this is boys
+<div class="home-page yoho-page boys" data-page="boys">
+{{# channel}}
+    {{! 头部banner}}
+    {{# slide}}
+        {{> banner}}
+    {{/ slide}}
+
+    {{! 新品速报}}
+    {{# newReport}}
+    <div class="new-report imgopacity clearfix">
+        {{> floor-header}}
+
+        <ul class="report-list clearfix">
+            {{# list}}
+
+            {{#unless @last}}
+            <li>
+                <a href="{{href}}" target= "_blank">
+                    {{#if @first}}
+                    <img class="lazy" data-original="{{image img 377 504}}" alt="" >
+                    {{^}}
+                    <img class="lazy" data-original="{{image img 185 248}}" alt="" >
+                    {{/if}}
+                </a>
+            </li>
+            {{/unless}}
+            {{/ list}}
+        </ul>
+
+        {{# list}}
+        {{#if @last}}
+        <div class="last-item">
+            <a href="{{href}}" target= "_blank">
+                <img class="lazy" data-original="{{image img 377 504}}" alt="">
+            </a>
+        </div>
+        {{/if}}
+        {{/ list}}
+    </div>
+    {{/ newReport}}
+
+    {{! 优选品牌}}
+    {{# preferenceBrands}}
+    <div class="preference-brand">
+        {{> index/floor-header}}
+        <div class="img-brand">
+            <ul class="img-list imgopacity clearfix">
+                {{# imgBrand}}
+                <li class="img-item">
+                    <a href="{{href}}" target= "_blank">
+                        <img src="{{img}}" alt="">
+                    </a>
+                </li>
+                {{/ imgBrand}}
+            </ul>
+            <div class="img-brand-switch">
+                <a class="prev" href="javascript:;">
+                    <span class="iconfont">&#xe60c;</span>
+                </a>
+                <a class="next" href="javascript:;">
+                    <span class="iconfont">&#xe60b;</span>
+                </a>
+            </div>
+        </div>
+        <div class="logo-brand imgopacity" data-url="{{brandUrl}}"></div>
+    </div>
+    {{/ preferenceBrands}}
+
+    {{! 单品/广告}}
+    {{# singlehot}}
+        {{> index/boy-singlehot}}
+    {{/ singlehot}}
+
+    {{! 广告}}
+    {{# adbanner}}
+    <div class="floor-ad">
+    <a href="{{href}}" target= "_blank"><img class="lazy" data-original="{{image img 1150 129}}"/></a>
+    </div>
+    {{/ adbanner}}
+
+    {{! 品类推荐}}
+    {{# recommend}}
+        {{> index/boy-recommend}}
+    {{/ recommend}}
+
+
+    {{! 新品上架}}
+    {{# newArrivls}}
+        {{> index/commodity}}
+    {{/ newArrivls}}
+{{/ channel}}
+</div>

+<div class="commodity clearfix" id="newarrivals">
+    {{> floor-header}}
+
+    <div class="goods-container clearfix">
+    </div>
+    <div class="loading">
+        <a href="{{href}}" target= "_blank">Loading...</a>
+    </div>
+</div>

+<div class="floor-header clearfix">
+    <h2 class="floor-title">{{name}}</h2>
+
+    <ul class="header-navs">
+
+        <li data-classify="s">
+            <a target="_blank" href="">sss</a>
+        </li>
+
+    </ul>
+
+</div>

@@ -14,6 +14,8 @@ module.exports = {
     domains: {
         api: 'http://192.168.102.205:8080/gateway/',
         service: 'http://testservice.yoho.cn:28077/',
+
+        // service: 'http://testservice.yoho.cn:28077/', // 'http://service.api.yohobuy.com/',
         search: 'http://192.168.10.64:8080/yohosearch/'
     },
     useOneapm: false,

+<div class="slide-container {{#if pagination}}slide-thumb-container{{/if}}">
+    <div class="slide-wrapper">
+        <ul>
+            {{# list}}
+            <li style="{{#if bgColor}}background:{{bgColor}}{{/if}}">
+                <a href="{{href}}" target= "_blank">
+                    {{#if @first}}
+                    <img src="{{image img 1150 450}}">
+                    {{^}}
+                    <img class="lazy" data-original="{{image img 1150 450}}" alt="">
+                    {{/if}}
+                </a>
+                {{# tips}}
+                <div class="slide-tips">
+                    <div class="g-mark"></div>
+                    <p>{{.}}</p>
+                </div>
+                {{/ tips}}
+            </li>
+            {{/ list}}
+        </ul>
+    </div>
+
+    {{#if pagination}}
+    <div class="thumb-pagination">
+        <ul class="clearfix">
+            {{# pagination}}
+            <li>
+                <a href="{{href}}" target="_blank"></a>
+                <img src="{{image img 138 54}}" alt="">
+            </li>
+            {{/ pagination}}
+        </ul>
+    </div>
+    {{/if}}
+</div>
+<div class="slide-container-placeholder {{#if pagination}}slide-thumb-container-placeholder{{/if}}"></div>

+<div class="floor-header clearfix">
+    <h2 class="floor-title">{{name}}</h2>
+    {{#if navs}}
+    <ul class="header-navs">
+        {{# navs}}
+        <li data-classify="{{id}}">
+            <a target="_blank" href="{{href}}">{{name}}</a>
+        </li>
+        {{/ navs}}
+    </ul>
+    {{/if}}
+</div>

+{{# tplrecommend}}
+    <div class="tpl-recommend clearfix">
+        {{> index/floor-header}}
+        <div class="tpl-body clearfix">
+            <div class="tpl-nav">
+                <div class="tpl-keywords">
+                    {{#each keyword}}
+                        <a class="keywords{{@index}}" title="{{name}}" href="{{href}}" target= "_blank"><img class="lazy" src="{{image img 185 152}}"/></a>
+                    {{/each}}
+                </div>
+                <div class="tpl-category clearfix">
+                    {{#each category}}
+                        <a href="{{href}}" target= "_blank">{{name}}</a>
+                    {{/each}}
+                </div>
+            </div>
+            <div class="tpl-brands imgopacity clearfix">
+                <ul>
+                    {{#each brands}}
+                        <li><a title="{{name}}" href="{{href}}" target= "_blank"><img class="lazy" src="{{image img 378 248}}"/></a></li>
+                    {{/each}}
+                </ul>
+            </div>
+            <div class="tpl-types imgopacity clearfix">
+                <ul>
+                    {{#each types}}
+                        <li><a title="{{name}}" href="{{href}}"  target= "_blank"><img class="lazy" src="{{image img 185 248}}"/></a></li>
+                    {{/each}}
+                </ul>
+            </div>
+        </div>
+        <div class="tpl-products imgopacity clearfix">
+            <ul>
+                {{#each products}}
+                    <li><a href="{{href}}" title="{{name}}" target= "_blank"><img class="lazy" src="{{image img 222 298}}"/></a></li>
+                {{/each}}
+            </ul>
+        </div>
+    </div>
+{{/ tplrecommend}}
+
+

+<div class="singlehot clearfix">
+    {{> index/floor-header}}
+    <ul class="g-list imgopacity">
+        {{#each imgHot}}         
+            {{#if @last}}
+                <li><a class="impo{{@index}}" href="{{href}}" target= "_blank"><img class="lazy" src="{{image img 378 248}}"/></a></li>
+            {{^}}
+                <li><a class="impo{{@index}}" href="{{href}}" target= "_blank"><img class="lazy" src="{{image img 185 248}}"/></a></li>
+            {{/if}}
+        {{/each}}
+    </ul>
+</div>

+<div class="floor-header clearfix">
+    <h2 class="floor-title">{{name}}</h2>
+    {{#if navs}}
+    <ul class="header-navs">
+        {{# navs}}
+        <li data-classify="{{id}}">
+            <a target="_blank" href="{{href}}">{{name}}</a>
+        </li>
+        {{/ navs}}
+    </ul>
+    {{/if}}
+</div>

+/**
+ * 首页
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2015/11/23
+ */
+
+var $ = require('yoho-jquery'),
+    lazyLoad = require('yoho-jquery-lazyload');
+
+var homePage = $('.home-page').data('page'),
+    brandUrl = $('.logo-brand').data('url');
+
+require('../common');
+
+require('../plugins/slider');
+require('../plugins/slider2');
+require('../plugins/logo-brand');
+
+require('../plugins/accordion');
+
+$(document).on('mouseenter', '.imgopacity a img', function() {
+    $(this).css('opacity', 0.8);
+});
+$(document).on('mouseout', '.imgopacity a img', function() {
+    $(this).css('opacity', 1);
+});
+
+
+
+if ($.inArray(homePage, ['boys', 'girls', 'kids', 'lifestyle']) > -1) {
+    require('../plugins/new-arrivls')({
+        type: homePage,
+        url: '/common/getNewArrival',
+        count: (homePage === 'boys') || (homePage === 'lifestyle') ? 5 : 4,
+        rows: [5, 3]
+    });
+    window.setCookie('_Channel', homePage, {
+        domain: '.yohobuy.com',
+        path: '/',
+        expires: 365
+    });
+}
+
+
+
+lazyLoad($('img.lazy'));
+if (homePage === 'boys') {
+    $('.slide-container').slider({
+        pagination: '.thumb-pagination'
+    });
+} else {
+    $('.center-col').slider();
+    $('.slide-container').slider();
+}
+
+if (homePage === 'boys') {
+    $('.logo-brand').logoBrand({
+        url: brandUrl
+    });
+    $('.img-brand').slider2();
+} else {
+    $('.logo-brand').logoBrand({
+        showNum: 10,
+        url: brandUrl
+    });
+    $('.img-slider-wrapper').slider2();
+}

@@ -5,8 +5,10 @@
  */
 var $ = require('yoho-jquery');
 
+
 var $body = $('body');
 
+
 function cookie(name) {
     var re = new RegExp(name + '=([^;$]*)', 'i'),
         matchPattern = '$1';

+var Slide = require('./yohoui/YH.slide');
+var $ = require('yoho-jquery');
+
+var $contain = $('.slide-accordion');
+var $item = $contain.find('li');
+
+var $width = $item.width();
+var $spn = parseInt($('.home-page').width()) === 1150 ? (120 + 5) : (102 + 5);
+var slide;
+
+function switchfun(to) {
+    $item.each(function(index) {
+        $(this).css('zIndex', index);
+        if (index <= to) {
+            $(this).stop().animate({
+                left: index * $spn
+            }, 400);
+        } else {
+            $(this).stop().animate({
+                left: (to) * $spn + $width + $spn * (index - to - 1)
+            }, 400);
+        }
+    });
+}
+
+switchfun(0);
+
+slide = new Slide({
+    length: 5,
+    loop: false,
+    auto: false,
+    timeout: 2,
+    index: 0
+});
+
+slide.on('change', function(data) {
+    switchfun(data.to);
+});
+
+$item.mouseover(function() {
+    slide.go($(this).index());
+});
+
+slide.init();

+/**
+ * 弹框公共组件
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2016/2/24
+ */
+
+var $ = require('yoho-jquery'),
+    Handlebars = require('yoho-handlebars');
+
+var defaultOptions = {
+    mask: true,
+    closeIcon: true
+};
+
+var tpl =
+    '<div class="yoho-dialog {{className}} hide">' +
+        '{{#if closeIcon}}' +
+            '<span class="close">' +
+                '<i class="iconfont">&#xe602;</i>' +
+            '</span>' +
+        '{{/if}}' +
+        '<div class="content">' +
+            '{{{content}}}' +
+        '</div>' +
+        '<div class="btns">' +
+            '{{# btns}}' +
+                '<span {{#if id}}id="dialog-{{id}}"{{/if}} class="btn{{#each btnClass}} {{.}}{{/each}}">' +
+                    '{{name}}' +
+                '</span>' +
+            '{{/ btns}}' +
+        '</div>' +
+    '</div>';
+
+var tplFn = Handlebars.compile(tpl);
+
+// 背景蒙版
+function createMask() {
+    if ($('.body-mask').length === 0) {
+        $('body').append('<div class="body-mask hide"></div>');
+    }
+
+    return $('.body-mask').css({
+        height: $(document).height(),
+        width: $(document).width()
+    });
+}
+
+function createDialog(data) {
+    $('body').append(tplFn(data));
+
+    return $('.yoho-dialog');
+}
+
+function Dialog(options) {
+    var opt = $.extend({}, defaultOptions, options);
+    var that = this,
+        i;
+
+    // 实现继承时，只返回实例，不生成html
+    if (opt.inherit) {
+        return this;
+    }
+
+    if (opt.mask) {
+        that.$mask = createMask();
+    }
+    that.$el = createDialog(opt);
+
+    // 绑定x关闭事件
+    that.$el.find('.close').click(function() {
+        that.close();
+    });
+
+    function bindBtnEvt(index) {
+        that.$el.find('#dialog-' + opt.btns[index].id).on('click', function() {
+            opt.btns[index].cb && opt.btns[index].cb();
+        });
+    }
+
+    // 绑定按钮事件
+    if (!!opt.btns) {
+        for (i = 0; i < opt.btns.length; i++) {
+            bindBtnEvt(i);
+        }
+    }
+}
+
+Dialog.prototype.close = function() {
+    this.$mask && this.$mask.addClass('hide');
+    this.$el.remove();
+};
+
+Dialog.prototype.show = function() {
+    this.$mask && this.$mask.removeClass('hide');
+    this.$el.removeClass('hide').css({
+        'margin-top': -this.$el.height() / 2,
+        'margin-left': -this.$el.width() / 2
+    });
+};
+
+exports.Dialog = Dialog;
+
+// Alert
+function Alert(content) {
+    var that = this;
+    var option = {
+        content: content,
+        className: 'alert-dialog',
+        btns: [
+            {
+                id: 'alert-sure',
+                btnClass: ['alert-sure'],
+                name: '确定',
+                cb: function() {
+                    that.close();
+                }
+            }
+        ]
+    };
+
+    Dialog.call(this, option);
+}
+
+Alert.prototype = new Dialog({
+    inherit: true
+});
+Alert.prototype.constructor = Alert;
+exports.Alert = Alert;
+
+// Confirm
+function Confirm(opt) {
+    var that = this;
+
+    var option = {
+        content: opt.content,
+        className: 'confirm-dialog',
+        btns: [
+            {
+                id: 'confirm-sure',
+                btnClass: ['confirm-sure'],
+                name: '确定',
+                cb: opt.cb
+            },
+            {
+                id: 'confirm-cancel',
+                btnClass: ['confirm-cancel'],
+                name: '取消',
+                cb: function() {
+                    that.close();
+                }
+            }
+        ]
+    };
+
+    Dialog.call(this, option);
+}
+
+Confirm.prototype = new Dialog({
+    inherit: true
+});
+Confirm.prototype.constructor = Confirm;
+exports.Confirm = Confirm;

+/**
+ * 首页优选品牌js
+ * @author: liuyue(yue.liu@yoho.cn)
+ * @date: 2015/12/08
+ */
+
+var $ = require('yoho-jquery'),
+    Handlebars = require('yoho-handlebars'),
+    lazyLoad = require('yoho-jquery-lazyload');
+
+(function($) {
+    var LogoBrand = function(element, options) {
+        this.$element = $(element);
+        this.options = $.extend({}, $.fn.logoBrand.defaults, options);
+
+        this.init();
+    };
+
+    LogoBrand.prototype = {
+        init: function() {
+            this.$element.addClass('logos-' + this.options.showNum);
+            this._sendRequest();
+        },
+        _createHelper: function() {
+            var showNum = this.options.showNum;
+
+            Handlebars.registerHelper('brandList', function(items, options) {
+                var out = '<ul>',
+                    i = 0,
+                    item = null,
+                    fillNum = 0;
+
+                // 不是每页显示个数的倍数，填充数据
+                if (items.length % showNum !== 0) {
+                    fillNum = showNum - (items.length % showNum);
+                    for (i = 0; i < fillNum; i++) {
+                        items.push({
+                            href: 'javascript:;',
+                            img: ''
+                        });
+                    }
+                }
+
+                for (i = 0; i < items.length; i++) {
+                    item = options.fn(items[i]);
+
+                    if (i % showNum === 5 || i === 5) {
+
+                        // 插入切换按钮的位置
+                        out = out + '<li class="logo-brand-switch" data-page="' + Math.floor(i / showNum) + '">' +
+                                    '<a class="prev iconfont" href="javascript:;">&#xe60f;</a>' +
+                                    '<a class="next iconfont" href="javascript:;">&#xe60e;</a></li>' +
+                                    '<li data-page="' + Math.floor(i / showNum) + '">' + item + '</li>';
+                    } else if (i !== 0 && i % showNum === 0) {
+
+                        // 插入more的位置，more占的是下一页第一个brand的位置，所以page是i/17
+                        out = out + '<li class="brand-more" data-page="' + Math.floor(i / (showNum + 1)) + '">' +
+                                    '<a href="javascript:;" target="_blank">MORE ></a></li>' +
+                                    '<li data-page="' + Math.floor(i / showNum) + '">' + item + '</li>';
+                    } else {
+                        out = out + '<li data-page="' + Math.floor(i / showNum) + '">' + item + '</li>';
+                    }
+                }
+
+                // 加上最后一个more, more占的是下一页第一个brand的位置，这里已经循环不到brand，所以加在末尾
+                return out + '<li class="brand-more" data-page="' + Math.floor(i / (showNum + 1)) + '">' +
+                            '<a href="javascript:;" target="_blank">MORE ></a></li></ul>';
+
+            });
+        },
+        _sendRequest: function() {
+            var that = this;
+
+            $.ajax({
+                type: 'GET',
+                url: that.options.url,
+                dataType: 'json',
+                success: function(data) {
+                    var brandTpl,
+                        brandHtml;
+
+                    if (!data || data.length === 0) {
+                        return;
+                    }
+
+                    that._createHelper();
+                    brandHtml = '\{{#brandList logoBrand}}' +
+                        '<a href="\{{href}}" target="_blank"><img class="lazy" data-original="\{{img}}" alt=""></a>' +
+                        '\{{/brandList}}';
+                    brandTpl = Handlebars.compile(brandHtml);
+                    that.$element.html(brandTpl(data));
+                    that.$element.find('.brand-more a').attr('href', data.moreBrand);
+                    lazyLoad(that.$element.find('img.lazy'));
+                    that._bindEvent();
+                }
+            });
+        },
+        _brandShow: function(hidePage, showPage) {
+            var that = this;
+
+            lazyLoad($('li[data-page=' + showPage + ']').find('img.lazy').trigger('appear'));
+            that.$element.find('li[data-page=' + hidePage + ']').find('img').fadeOut('normal', function() {
+                that.$element.find('li').hide();
+                that.$element.find('li[data-page=' + showPage + ']').show().find('img').fadeIn();
+            });
+        },
+        _bindEvent: function() {
+            var that = this;
+
+            that.$element.on('click', '.next', function() {
+                var page = $(this).parent().data('page'),
+                    nextPage = 0,
+                    totalPage = Math.ceil(that.$element.find('li').size() / (that.options.showNum + 2)) - 1;
+
+                if (page === totalPage) {
+                    nextPage = 0;
+                } else {
+                    nextPage = page + 1;
+                }
+                that._brandShow(page, nextPage);
+            });
+
+            that.$element.on('click', '.prev', function() {
+                var page = $(this).parent().data('page'),
+                    prevPage = 0,
+                    totalPage = Math.ceil(that.$element.find('li').size() / (that.options.showNum + 2)) - 1;
+
+                if (page === 0) {
+                    prevPage = totalPage;
+                } else {
+                    prevPage = page - 1;
+                }
+                that._brandShow(page, prevPage);
+            });
+        }
+    };
+    $.fn.logoBrand = function(option) {
+        return this.each(function() {
+            var $this = $(this),
+                data = $this.data('LogoBrand'),
+                options = typeof option === 'object' && option;
+
+            if (!data) {
+                $this.data('LogoBrand', (data = new LogoBrand(this, options)));
+            }
+            if (typeof option === 'string') {
+                data[option]();
+            }
+        });
+    };
+    $.fn.logoBrand.Constructor = LogoBrand;
+    $.fn.logoBrand.defaults = {
+        showNum: 16,
+        url: '/boys/getBrand'
+    };
+})($);

+var $ = require('yoho-jquery'),
+    lazyload = require('yoho-jquery-lazyload');
+var Handlebars = require('yoho-handlebars');
+
+function InfiniteLoad(options) {
+    var defaults = {
+        index: 0,
+        isload: true, // 是否正在加载
+        isrun: true, // 判断是否执行
+        offset: {
+            height: null,
+            width: null
+        }
+    };
+
+    this.registerEvent = {
+        before: [],
+        change: [],
+        after: []
+    };
+
+    this.options = $.extend(true, {}, defaults, options);
+
+    return this;
+}
+
+InfiniteLoad.prototype.on = function(name, callback) {
+    var g = this;
+    var _e = g.registerEvent[name];
+
+    if (_e) {
+        _e.push(callback);
+    }
+    return _e;
+};
+
+InfiniteLoad.prototype.exect = function(key, params) {
+    var g = this;
+    var e;
+
+    if (g.registerEvent[key] && g.registerEvent[key].length > 0) {
+        for (e in g.registerEvent[key]) {
+            if (g.registerEvent[key].hasOwnProperty(e)) {
+                g.registerEvent[key][e](params);
+            }
+        }
+    }
+};
+
+InfiniteLoad.prototype.init = function() {
+    var g = this;
+    var p = this.options;
+
+    function __loadMore() {
+
+        if (p.isrun && p.isload && g.__directionCalculation()) {
+            p.isload = false;
+            p.index++;
+            g.exect('after', p);
+        }
+
+        g.exect('change', p);
+    }
+
+    g.exect('before', p);
+
+    $(window).scroll(__loadMore);
+};
+
+InfiniteLoad.prototype.emit = function() {
+    var p = this.options;
+
+    p.isload = true;
+};
+
+InfiniteLoad.prototype.stop = function() {
+    var p = this.options;
+
+    p.isrun = false;
+    p.isload = false;
+};
+
+InfiniteLoad.prototype.__directionCalculation = function() {
+    var p = this.options;
+
+    if (p.offset.height && p.offset.height() > 0 && $(window).scrollTop() + $(window).height() >= p.offset.height()) {
+        return true;
+    }
+    return false;
+};
+
+module.exports = function(data) {
+    var $container = $('#newarrivals .goods-container');
+    var $load = $('.loading a');
+    var load = new InfiniteLoad({
+        index: 1,
+        isload: false,
+        offset: {
+            height: function() {
+                return parseFloat($container.offset().top) + parseFloat($container.height()) - 200;
+            }
+        }
+    });
+    var loadAjax;
+    var url = data.url,
+        count = data.count,
+        rows = data.rows;
+
+    data.pageIndex = 0;
+
+    delete data.url;
+    delete data.count;
+    delete data.rows;
+
+    loadAjax = function(url, data, count) {
+
+        var options = {
+            type: 'POST',
+            url: url,
+            success: function(result) {
+                var code = result.code;
+                var myTemplate, len, pos;
+
+                if (code === 200) {
+                    len = result.goods.length % count;
+                    pos = result.goods.length - len - 1;
+
+                    result.goods.splice(pos, len);
+
+                    myTemplate = Handlebars.compile(load.tpl);
+
+                    $container.append(myTemplate(result.goods));
+                    data.pageIndex = data.pageIndex + result.goods.length;
+
+                    // 懒加载插件貌似有点问题,图片先直接展示
+                    lazyload($container.find('img.lazy'));
+
+                    load.emit();
+                } else {
+
+                    load.stop();
+                    $load.html('查看更多');
+                }
+            },
+            error: function() {
+
+                load.stop();
+                $load.html('网络断开连接了~');
+            }
+        };
+
+        options.data = data;
+        $.ajax(options);
+    };
+
+
+    load.on('after', function(p) {
+
+        data.pageCount = count * rows[1];
+
+        loadAjax(url, data);
+    });
+
+    load.on('before', function(p) {
+
+
+        load.tpl = '{{#each this}}';
+        load.tpl += '<div class="good-info imgopacity" data-skn="{{skn}}">';
+        load.tpl += '    <div class="tag-container clearfix">';
+        load.tpl += '        {{# tags}}';
+        load.tpl += '            {{# isNew}}';
+        load.tpl += '                <span class="good-tag new-tag">NEW</span>';
+        load.tpl += '            {{/ isNew}}';
+        load.tpl += '            {{# isReNew}}';
+        load.tpl += '                <span class="good-tag renew-tag">再到着</span>';
+        load.tpl += '            {{/ isReNew}}';
+        load.tpl += '            {{# isSale}}';
+        load.tpl += '                <span class="good-tag sale-tag">SALE</span>';
+        load.tpl += '            {{/ isSale}}';
+        load.tpl += '            {{# isNewFestival}}';
+        load.tpl += '                <span class="good-tag new-festival-tag">新品节</span>';
+        load.tpl += '            {{/ isNewFestival}}';
+        load.tpl += '            {{# isLimit}}';
+        load.tpl += '                <span class="good-tag limit-tag">限量商品</span>';
+        load.tpl += '            {{/ isLimit}}';
+        load.tpl += '            {{# isYearEndPromotion}}';
+        load.tpl += '                <span class="good-tag yep-tag">年终大促</span>';
+        load.tpl += '            {{/ isYearEndPromotion}}';
+        load.tpl += '            {{# isYearMidPromotion}}';
+        load.tpl += '                <span class="good-tag ymp-tag">年中热促</span>';
+        load.tpl += '            {{/ isYearMidPromotion}}';
+        load.tpl += '        {{/ tags}}';
+        load.tpl += '    </div>';
+        load.tpl += '    <div class="good-detail-img">';
+        load.tpl += '        <a class="good-thumb" href="{{url}}" target= "_blank">';
+        load.tpl += '            <img class="lazy" data-original="{{thumb}}">';
+        load.tpl += '        </a>';
+        load.tpl += '        {{# isFew}}';
+        load.tpl += '            <p class="few-tag">即将售罄</p>';
+        load.tpl += '        {{/ isFew}}';
+
+        load.tpl += '        {{#if showColBtn}}';
+        load.tpl += '            <span class="col-btn iconfont{{#if coled}} coled{{/if}}">&#xe616;</span>';
+        load.tpl += '        {{/if}}';
+        load.tpl += '    </div>';
+        load.tpl += '    <div class="good-detail-text">';
+        load.tpl += '        <a href="{{url}}" target= "_blank">{{name}}</a>';
+        load.tpl += '        <p class="price">';
+        load.tpl += '            <span class="sale-price{{#unless marketPrice}}prime-cost{{/unless}}">';
+        load.tpl += '                ¥{{salePrice}}';
+        load.tpl += '            </span>';
+        load.tpl += '            {{# marketPrice}}';
+        load.tpl += '                <span class="market-price">¥{{.}}</span>';
+        load.tpl += '            {{/ marketPrice}}';
+        load.tpl += '        </p>';
+        load.tpl += '    </div>';
+        load.tpl += '</div>';
+        load.tpl += '{{/each}}';
+
+
+        data.pageCount = count * rows[0];
+
+        loadAjax(url, data, data.count);
+
+        // load.emit();
+    });
+
+    load.init();
+
+};

+/**
+ * 首页banner轮播
+ * @author: liuyue(yue.liu@yoho.cn)
+ * @date: 2015/12/04
+ */
+
+var $ = require('yoho-jquery'),
+    lazyLoad = require('yoho-jquery-lazyload');
+
+(function($) {
+    var Slider = function(element, options) {
+        this.$element = $(element);
+        this.options = $.extend({}, $.fn.slider.defaults, options);
+        this.bigItem = this.$element.find('.slide-wrapper').find('li');
+        this.smallItem = null;
+        this.len = this.bigItem.size();
+        this.index = 0;
+        this.timer = null;
+        this.init();
+    };
+
+    Slider.prototype = {
+        init: function() {
+            if (!this.$element) {
+                return;
+            }
+
+            if (this.len <= 1) {
+                lazyLoad(this.$element.find('img.lazy'));
+                return;
+            }
+            if (!!this.options.pagination) {
+                this.smallItem = $(this.options.pagination).find('li');
+            } else {
+                this._createPage();
+            }
+
+            if (this.options.orient) {
+                this._createOrient();
+            }
+            this._slideShow();
+            this._bindEvent();
+            this._autoplay();
+        },
+        _createOrient: function() {
+
+            var orientHtml = '<div class="slide-switch">' +
+                    '<a class="prev" href="javascript:;"><span class="iconfont">&#xe60c;</span></a>' +
+                    '<a class="next" href="javascript:;"><span class="iconfont">&#xe60b;</span></a>' +
+                '</div>';
+
+            if (this.$element.find('.slide-switch').length > 0) {
+                return;
+            }
+
+            this.$element.append(orientHtml);
+        },
+        _createPage: function() {
+            var pageHtml = '<div class="slide-pagination"><div class="slide-pagination-inner">' +
+                            '<div class="slide-shade"></div><div class="slide-pagination-last">',
+                i = 0;
+
+            if (this.len <= 1) {
+                return;
+            }
+            for (i = 0; i < this.len; i++) {
+                pageHtml += '<span></span>';
+            }
+            pageHtml += '</div></div></div>';
+            this.$element.append($(pageHtml));
+            this.smallItem = this.$element.find('.slide-pagination-inner span');
+        },
+        _bindEvent: function() {
+            var that = this;
+
+            this.$element.find('.slide-switch').on('click', '.next', function() {
+                that._nextSlide();
+                clearInterval(that.timer);
+                that.timer = setInterval(function() {
+                    that._nextSlide();
+                }, that.options.time);
+            }).on('click', '.prev', function() {
+                that._prevSlide();
+                clearInterval(that.timer);
+                that.timer = setInterval(function() {
+                    that._nextSlide();
+                }, that.options.time);
+            });
+
+            this.smallItem.on('mouseenter', function() {
+                that.index = $(this).index();
+                clearInterval(that.timer);
+                that._slideShow();
+            }).on('mouseleave', function() {
+                that._autoplay();
+            });
+
+            this.$element.on('mouseenter', function() {
+                $(this).find('.slide-switch').addClass('show');
+            }).on('mouseleave', function() {
+                $(this).find('.slide-switch').removeClass('show');
+            });
+        },
+        _nextSlide: function() {
+            if (this.index === this.len - 1) {
+                this.index = 0;
+            } else {
+                this.index++;
+            }
+            this._slideShow();
+        },
+        _prevSlide: function() {
+            if (this.index === 0) {
+                this.index = this.len - 1;
+            } else {
+                this.index--;
+            }
+            this._slideShow();
+        },
+        _slideShow: function() {
+            var $img = this.bigItem.eq(this.index).find('img.lazy');
+
+            // 未加载图片的及时显示
+            if ($img.attr('src') !== $img.data('original')) {
+                lazyLoad($img, {
+                    event: 'sporty'
+                });
+                $img.trigger('sporty');
+            }
+
+            this.smallItem.eq(this.index).addClass('focus').siblings().removeClass('focus');
+            this.bigItem.eq(this.index).show().stop().animate({
+                opacity: 1
+            }, function() {
+
+                // 修正IE下切换时文字会重叠的问题
+                $(this).find('.slide-tips > p').removeClass('hide');
+            }).siblings().stop().animate({
+                opacity: 0
+            }, function() {
+                $(this).hide().find('.slide-tips > p').addClass('hide');
+            });
+        },
+        _autoplay: function() {
+            var that = this;
+
+            clearInterval(this.timer);
+            this.timer = setInterval(function() {
+                that._nextSlide();
+            }, this.options.time);
+        }
+    };
+    $.fn.slider = function(option) {
+        return this.each(function() {
+            var $this = $(this),
+                data = $this.data('Slider'),
+                options = typeof option === 'object' && option;
+
+            if (!data) {
+                $this.data('Slider', (data = new Slider(this, options)));
+            }
+            if (typeof option === 'string') {
+                data[option]();
+            }
+        });
+    };
+    $.fn.slider.Constructor = Slider;
+    $.fn.slider.defaults = {
+        time: 5000,
+        orient: true, // 左右切换箭头的显示
+        pagination: null
+    };
+})($);

+/**
+ * (品牌优选)图片幻灯片插件
+ * @author: wangqing(robin.wang@yoho.cn)
+ * @date: 205/7/2
+ */
+var $ = require('yoho-jquery');
+
+(function($) {
+    $.fn.slider2 = function(options) {
+        function autoplay(index, limit, toright) {
+            if (toright === true) {
+                $('.next').trigger('click');
+                if (index === (limit - 3)) {
+                    autoplayrecycle(--index, limit, false);
+                } else {
+                    autoplayrecycle(++index, limit, true);
+                }
+            } else {
+                $('.prev').trigger('click');
+                if (index === 0) {
+                    autoplayrecycle(++index, limit, true);
+                } else {
+                    autoplayrecycle(--index, limit, false);
+                }
+            }
+        }
+
+        function autoplayrecycle(index, limit, toright) {
+            window.setTimeout(autoplay, $.fn.slider2.defaults.delaytime, index, limit, toright);
+        }
+
+        function changePic(index, width, callback) {
+            var offersetleft = -(index * width);
+
+            $('.img-list')
+                .animate({
+                    'margin-left': offersetleft + 'px'
+                }, 'slow', callback);
+
+        }
+        $.fn.slider2.defaults = {
+            index: 0,
+            shownum: 3,
+            autoplay: false,
+            delaytime: 3000
+        };
+        return this.each(function() {
+            var opts = $.extend({}, $.fn.slider2.defaults, options);
+            var mr = parseInt($('.img-item').css('margin-right'));
+            var $banneritems = $('.img-item');
+            var bannerarr = [];
+            var _width = $banneritems.outerWidth() + mr,
+                _size = $banneritems.length,
+                j = 0;
+
+            if (_size <= 3) {
+                $(this).find('.img-brand-switch').hide();
+                return;
+            }
+            for (j = 0; j < $banneritems.length; j++) {
+                bannerarr.push($banneritems[j]);
+            }
+            _size = bannerarr.length;
+            $(this).find('.img-list').css({
+                width: (_width * _size)
+            });
+            $(this).find('.next').on('click', function(e) {
+                var i = 0,
+                    _obj = null;
+
+                e.preventDefault();
+
+                changePic(3, _width, function() {
+                    for (i = 0; i < 3; i++) {
+                        _obj = bannerarr.shift();
+
+                        $('.img-item').parent().append(_obj.outerHTML);
+                        bannerarr.push(_obj);
+                    }
+                    $('.img-item').first().remove();
+                    $('.img-item').first().remove();
+                    $('.img-item').first().remove();
+                    $('.img-list').css({
+                        'margin-left': '0'
+                    });
+                });
+            });
+            $(this).find('.prev').on('click', function(e) {
+                var i = 0,
+                    _obj = null,
+                    offersetleft = '';
+
+                e.preventDefault();
+                for (i = 0; i < 3; i++) {
+                    _obj = bannerarr.pop();
+
+                    $('.img-item').parent().prepend(_obj.outerHTML);
+                    bannerarr.unshift(_obj);
+                }
+                offersetleft = 3 * _width;
+                $('.img-item').last().remove();
+                $('.img-item').last().remove();
+                $('.img-item').last().remove();
+                $('.img-list').css({
+                    'margin-left': -offersetleft + 'px'
+                });
+                changePic(0, _width);
+            });
+            if (opts.autoplay === true) {
+                autoplayrecycle(opts.index, _size, true);
+            }
+        });
+
+    };
+
+}($));

+var assembly;
+var classtype = {
+    '[object Array]': 'array',
+    '[object Boolean]': 'boolean',
+    '[object Date]': 'date',
+    '[object Function]': 'function',
+    '[object Number]': 'number',
+    '[object Object]': 'object',
+    '[object RegExp]': 'regexp',
+    '[object String]': 'string'
+};
+var me = {
+    __Index: 0,
+    list: [],
+    get: function(id) {
+        return id === undefined ? this.list : this.list[id];
+    },
+    fn: function() { },
+    inherit: function(childClass, parentClass) {
+        var Constructor = me.fn;
+
+        Constructor.prototype = parentClass.prototype;
+        childClass.prototype = new Constructor();
+
+        childClass.prototype.constructor = childClass;
+        childClass.superclass = parentClass.prototype;
+
+        if (childClass.prototype.constructor === Object.prototype.constructor) {
+            childClass.prototype.constructor = parentClass;
+        }
+    },
+    extend: function(obj, newProperties) {
+        var key;
+
+        for (key in newProperties) {
+            if (newProperties.hasOwnProperty(key)) {
+                obj[key] = newProperties[key];
+            }
+        }
+        return obj;
+    },
+    copy: function(TargetClass, obj, newProperties) {
+        var value, o, key;
+
+        if (typeof obj !== 'object') {
+            return obj;
+        }
+        value = obj.valueOf();
+        if (obj !== value) {
+            return new obj.constructor(value);
+        }
+        if (obj instanceof obj.constructor && obj.constructor !== Object) {
+            if (TargetClass) {
+                o = new TargetClass();
+            } else {
+                o = me.clone(obj.constructor.prototype);
+            }
+
+            for (key in obj) {
+                if (TargetClass || obj.hasOwnProperty(key)) {
+                    o[key] = obj[key];
+                }
+            }
+        } else {
+            o = {};
+            for (key in obj) {
+                if (o.hasOwnProperty(key)) {
+                    o[key] = obj[key];
+                }
+            }
+        }
+        if (newProperties) {
+            for (key in newProperties) {
+                if (o.hasOwnProperty(key)) {
+                    o[key] = newProperties[key];
+                }
+            }
+        }
+
+        return o;
+    },
+    clone: function(obj) {
+        me.__cloneFunc.prototype = obj;
+        return new me.__cloneFunc();
+    },
+    __cloneFunc: function() {
+    },
+    delegate: function(func, scope) {
+        var args;
+
+        scope = scope || window;
+
+        if (arguments.length > 2) {
+            args = Array.prototype.slice.call(arguments, 2);
+
+            return function() {
+                return func.apply(scope, args);
+            };
+        } else {
+            return function() {
+                return func.call(scope);
+            };
+        }
+    },
+    dom: function($select, classCss) {
+        var wrap = $select;
+        var name, DOM = {
+                wrap: wrap
+            },
+            els = wrap[0].getElementsByTagName('*'),
+            elsLen = els.length;
+        var i;
+
+        for (i = 0; i < elsLen; i++) {
+            name = els[i].className;
+            if (name.indexOf(classCss) > -1) {
+                name = name.split(classCss)[1];
+            }
+            if (name) {
+                DOM[name] = wrap.find(els[i]);
+            }
+        }
+        return DOM;
+    },
+
+    // 模板引擎
+    template: function() {
+        var result, key, reg, i;
+        var args = arguments;
+
+        if (args.length > 0) {
+            if (me.isString(args[0])) {
+                result = args[0];
+                if (args.length === 2 && me.isObject(args[1])) {
+                    for (key in args[1]) {
+                        if (args[1][key] !== undefined) {
+                            reg = new RegExp('({' + key + '})', 'g');
+
+                            result = result.replace(reg, args[1][key]);
+                        }
+                    }
+                } else {
+                    for (i = 1; i < args.length; i++) {
+                        if (args[i] !== undefined) {
+                            reg = new RegExp('({[' + (i - 1) + ']})', 'g');
+
+                            result = result.replace(reg, args[i]);
+                        }
+                    }
+                }
+            }
+        }
+        return result;
+    },
+    __type: function(obj) {
+        return obj == null ? String(obj) : classtype[Object.prototype.toString.call(obj)] || 'object';
+    },
+    isObject: function(obj) {
+        return this.isFunction(obj) || !!(obj && 'object' === typeof obj);
+    },
+    isFunction: function(obj) {
+        return this.__type(obj) === 'function';
+    },
+    isArray: Array.isArray || function(obj) {
+        return this.__type(obj) === 'array';
+    },
+    isNum: function(obj) {
+        return !isNaN(parseFloat(obj)) && isFinite(obj);
+    },
+    isString: function(obj) {
+        return this.__type(obj) === 'string';
+    },
+    each: function(data, callback, args) {
+        var i, len;
+
+        if (me.isArray(data)) {
+            for (i = 0, len = data.length; i < len; i++) {
+                if (callback.call(data[i], i, data[i], args) === false) {
+                    break;
+                }
+            }
+        } else {
+
+            for (i in data) {
+                if (callback.call(data[i], i, data[i], args) === false) {
+                    break;
+                }
+            }
+        }
+    },
+    funManager: {
+        __loadList: {},
+        __loadFun: function(item, callback, win) {
+
+            if (item.methord && me.isFunction(item.methord())) {
+                win = win || window;
+                item.methord()(item, function() {
+                    callback();
+                }, win);
+            }
+        },
+        load: function(fns, statechange, win, __index) {
+            __index = __index || 0;
+
+            if (fns[__index]) {
+                me.funManager.__loadFun(fns[__index], function() {
+                    me.funManager.load(fns, statechange, win, __index + 1);
+                }, win);
+            }
+            statechange(__index, win);
+        },
+        get: function(id) {
+            return this.__loadList[id];
+        }
+    },
+    log: function(msg) {
+        var console = window.console || {
+            log: function() { }
+        };
+
+        console.log(msg);
+    },
+    Event: {
+        mousewheel: function(e) {
+            var _eoe = e.originalEvent;
+            var _de = _eoe.detail ? _eoe.detail * -1 : _eoe.wheelDelta / 40;
+            var _direction = _de < 0 ? -1 : 1;
+
+            return {
+                direction: _direction,
+                unit: _de
+            };
+        },
+        __: function(_e, el, event, handle) {
+            var key;
+
+            for (key in _e) {
+                if (window[_e[key].validator]) {
+                    el[_e[key].validator](_e[key].prefix + event, handle, false);
+                    break;
+                }
+            }
+        },
+        add: function(el, event, handle) {
+            var _e = [
+                {
+                    validator: 'addEventListener',
+                    prefix: ''
+                },
+                {
+                    validator: 'attachEvent',
+                    prefix: 'on'
+                }
+            ];
+
+            this.__(_e, el, event, handle);
+        },
+        remove: function(el, event, handle) {
+            var _e = [
+                {
+                    validator: 'removeEventListener',
+                    prefix: ''
+                },
+                {
+                    validator: 'detachEvent',
+                    prefix: 'on'
+                }
+            ];
+
+            this.__(_e, el, event, handle);
+        }
+    },
+    getUid: function(_name) {
+        return me.template('me-{0}{1}-{2}', _name, new Date().getTime(), me.__Index++);
+    },
+    Browser: {
+        isTouch: function() {
+            var msGesture = window.navigator && window.navigator.msPointerEnabled && window.MSGesture;
+
+            return (('ontouchstart' in window) || msGesture || window.DocumentTouch) ? true : false;
+        },
+        Prefix: function() {
+            var i;
+
+            var props = ['perspectiveProperty', 'WebkitPerspective', 'MozPerspective', 'OPerspective', 'msPerspective'];
+            var obj = document.createElement('div');
+
+            for (i in props) {
+                if (obj.style[props[i]] !== undefined) {
+                    return me.template('-{0}-', props[i].replace('Perspective', '').toLowerCase());
+                }
+            }
+        },
+        parseURL: function(url) {
+            var a = document.createElement('a');
+            var ret, seg, len, i, s;
+
+            a.href = url;
+            return {
+                source: url,
+                protocol: a.protocol.replace(':', ''),
+                host: a.hostname,
+                port: a.port,
+                query: a.search,
+                params: (function() {
+                    ret = {},
+                    seg = a.search.replace(/^\?/, '').split('&'),
+                    len = seg.length, i = 0, s;
+
+                    for (; i < len; i++) {
+                        if (!seg[i]) {
+                            continue;
+                        }
+                        s = seg[i].split('=');
+                        ret[s[0]] = s[1];
+                    }
+                    return ret;
+                })(),
+                file: (a.pathname.match(/\/([^\/?#]+)$/i) || [null, ''])[1],
+                hash: a.hash.replace('#', ''),
+                path: a.pathname.replace(/^([^\/])/, '/$1'),
+                relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [null, ''])[1],
+                segments: a.pathname.replace(/^\//, '').split('/')
+            };
+        }
+    },
+    Array: {
+        indexOf: function(array, val) {
+            var i;
+
+            for (i = 0; i < array.length; i++) {
+                if (this[i] === val) {
+                    return i;
+                }
+            }
+            return -1;
+        },
+        remove: function(array, val) {
+            var index = this.indexOf(array, val);
+
+            if (index > -1) {
+                array.splice(index, 1);
+            }
+            return array;
+        }
+    }
+};
+
+assembly = function(options) {
+    this.initialized = false;
+    this.registerEvent = {
+        before: [],
+        change: [],
+        after: []
+    };
+    this.options = options;
+
+    this.init(options);
+};
+
+assembly.output = function() {
+    me.log(me.list);
+};
+assembly.prototype.oninit = me.fn;
+
+assembly.prototype.init = function(cfg) {
+    this.initialized = true;
+
+    // function _getClassName(_constructor, _constr) {
+    //     var _constr = _constr || "";
+    //     if (_constructor.superclass) {
+    //         var args = /(\w+)\.superclass/.exec(_constructor.arguments.callee);
+    //         if (args != null) {
+    //             _constr += args[1] + "-";
+    //             // return _getClassName(_constructor.superclass.constructor, _constr);
+    //         }
+    //     }
+    //     return _constr;
+    // }
+    this.__Uid = me.getUid('me');
+    this.oninit(cfg);
+    me.list[this.__Uid] = this;
+};
+assembly.prototype.destory = function() {
+    this.initialized = false;
+    delete me.list[this.__Uid];
+};
+assembly.prototype.getUid = function() {
+    return this.__Uid;
+};
+assembly.prototype.getOptions = function() {
+    return this.options;
+};
+assembly.prototype.config = function() {
+    if (arguments.length > 0) {
+        if (typeof (arguments[0]) === 'string') {
+            if (arguments.length > 1) {
+                this.options[arguments[0]] = arguments[1];
+            } else {
+                return this.options[name];
+            }
+        }
+    } else {
+        return this.options;
+    }
+};
+assembly.prototype.on = function(name, callback) {
+    var __self = this;
+    var _e = __self.registerEvent[name];
+
+    if (_e) {
+        _e.push(callback);
+    }
+    return _e;
+};
+assembly.prototype.off = function(name, callback) {
+    var __self = this;
+    var _e = __self.registerEvent[name];
+    var e = [];
+
+    me.each(_e, function(name, _callback) {
+
+        if (_callback === callback) {
+            e.push(name);
+        }
+    });
+
+    me.each(e.reverse(), function(name, _callback) {
+        _e.splice(_callback, 1);
+    });
+};
+me.assembly = assembly;
+
+module.exports = me;

+var me = require('./YH.base');
+
+var slide = function(options) {
+    this.__lastTime = null;
+    this.__isStop = false;
+    options = me.extend(this.defaults, options);
+    slide.superclass.constructor.call(this, options);
+};
+
+me.inherit(slide, me.assembly);
+
+slide.prototype.oninit = function() {
+    var __self = this,
+        _o = __self.options;
+
+    if (_o.auto) {
+        __self.play();
+    }
+    __self.go(_o.index);
+    return this;
+};
+
+slide.prototype.go = function(_to, _from) {
+    var __self = this,
+        _o = __self.options;
+    var _direction, _loop, _current, _index, _originalto, o, key, _e;
+
+    if (__self.__lastTime) {
+        clearTimeout(__self.__lastTime);
+        __self.__lastTime = null;
+    }
+    _from = 'undefined' === typeof _from ? _o.index : _from;
+    _direction = _to === _from ? 0 : _to > _from ? 1 : -1;
+    _loop = _o.loop, _index = _o.length - 1, _originalto = _to;
+    if (_loop) {
+        if (_to > _index) {
+            _to = _to - _index - 1;
+        } else {
+            if (0 > _to) {
+                _to = _to + _index + 1;
+            } else {
+                _to = _to;
+            }
+        }
+    } else {
+        if (_to > _index) {
+            _to = _index;
+        } else {
+            if (0 > _to) {
+                _to = 0;
+            } else {
+                _to = _to;
+            }
+        }
+    }
+    _current = _o.index = _to;
+
+    o = {
+        from: _from,
+        to: _to,
+        originalto: _originalto,
+        direction: _direction
+    };
+
+    for (key in __self.registerEvent) {
+        if (__self.registerEvent[key].length > 0) {
+            for (_e in __self.registerEvent[key]) {
+                if (__self.registerEvent[key].hasOwnProperty(_e)) {
+                    __self.registerEvent[key][_e](o);
+                }
+            }
+        }
+    }
+
+    if (_current !== _index || _to) {
+        if (!__self.__isStop && _o.auto) {
+            __self.play();
+        }
+    } else {
+        if (__self.__lastTime) {
+            clearTimeout(__self.__lastTime);
+        }
+    }
+};
+
+slide.prototype.play = function() {
+    var __self = this,
+        _o = __self.options;
+
+    __self.__lastTime = setTimeout(function() {
+        __self.next();
+    }, 1000 * _o.timeout);
+    return this;
+};
+
+slide.prototype.next = function() {
+    var __self = this,
+        _o = __self.options;
+    var _from = _o.index;
+    var _to = _from + _o.step;
+
+    __self.go(_to, _from);
+};
+
+slide.prototype.prev = function() {
+    var __self = this,
+        _o = __self.options;
+    var _from = _o.index;
+    var _to = _from - _o.step;
+
+    __self.go(_to, _from);
+};
+
+slide.prototype.pause = function() {
+    var __self = this;
+
+    if (__self.__lastTime) {
+        clearTimeout(__self.__lastTime);
+    }
+    __self.__isStop = true;
+};
+
+slide.prototype.resume = function() {
+    var __self = this;
+
+    __self.__isStop = false;
+    __self.play();
+};
+
+slide.prototype.defaults = {
+    index: 0,
+    timeout: 5,
+    step: 1,
+    per: 1,
+    auto: false,
+    loop: false
+};
+
+module.exports = slide;

@@ -218,9 +218,9 @@ a {
     left: 0;
 }
 
-@define-mixin ellipsis {
-    overflow: hidden;
-    text-overflow: ellipsis;
+@define-mixin ellipsis {
+    overflow: hidden;
+    text-overflow: ellipsis;
     white-space: nowrap;
 }
 
@@ -228,5 +228,7 @@ a {
 @import "header";
 @import "footer";
 @import "404";
+@import "index/index";
 
 /* 模块 */
+@import "index/index";

+.brands {
+    /* 路径导航样式重置 */
+    .path-nav {
+        border-bottom: none;
+        margin-bottom: 0;
+        padding-top: 10px;
+        padding-bottom: 20px;
+    }
+
+    .brands-tabs {
+        position: relative;
+        a {
+            display: block;
+            img {
+                width: 100%;
+                height: 100%;
+                display: block;
+            }
+        }
+        li {
+            float: left;
+            p {
+                display: block;
+                font-size: 30px;
+                text-align: center;
+                color: #dedede;
+                position: absolute;
+                top: 50%;
+                width: 100%;
+                margin-top: -15px;
+                z-index: 3;
+            }
+            .g-mask {
+                opacity: 0.4;
+            }
+            &:hover .g-mask,
+            .g-mask-on {
+                opacity: 0;
+            }
+        }
+        .hover-contain {
+            position: relative;
+            border-bottom: 1px solid #dfdfdf;
+            .hoverarr {
+                background-color: #3d3d3d;
+                position: absolute;
+                bottom: 0;
+                z-index: 10;
+                i {
+                    width: 0;
+                    height: 0;
+                    position: absolute;
+                    left: 50%;
+                    border-left: 6px solid transparent;
+                    border-right: 6px solid transparent;
+                    border-bottom: 6px solid #3d3d3d;
+                    top: -6px;
+                    margin-left: -3px;
+                }
+            }
+        }
+    }
+    .header-navs {
+        margin-right: -15px;
+    }
+    .category-nav {
+        border: 2px solid #222;
+        padding-left: 16px;
+        height: 44px;
+        line-height: 44px;
+        font-size: 12px;
+        font-weight: bold;
+        position: relative;
+        z-index: 100;
+        background-color: #fff;
+        span {
+            display: inline-block;
+            margin-right: 15px;
+        }
+        a {
+            display: inline-block;
+            padding: 0 7px;
+            text-align: center;
+            color: #222;
+            cursor: pointer;
+        }
+    }
+    .category-fix {
+        position: fixed;
+        top: 0;
+        z-index: 100;
+        margin-top: 0 !important;
+    }
+    .brands-list {
+        dl {
+            position: relative;
+            border-top: 1px dotted #999;
+            padding: 20px 0;
+        }
+        dt {
+            position: absolute;
+            width: 130px;
+            text-align: center;
+            font-weight: bold;
+            font-size: 16px;
+            text-align: center;
+            top: 50%;
+            margin-top: -9px;
+        }
+        dd {
+            margin-left: 130px;
+            li {
+                float: left;
+                display: block;
+                width: 170px;
+                height: 18px;
+            }
+            a {
+                color: #666;
+                line-height: 18px;
+                font-size: 12px;
+                position: relative;
+            }
+            span {
+                max-width: 150px;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                display: inline-block;
+                &:hover {
+                    text-decoration: underline;
+                }
+            }
+            .brands-dialog {
+                display: inline;
+                position: relative;
+            }
+            .hot {
+                font-weight: bold;
+                color: #222;
+            }
+            i {
+                position: relative;
+                top: -4px;
+                color: #e01;
+                font-size: 14px;
+            }
+        }
+    }
+
+    .brands-category {
+        width: 1150px;
+    }
+
+    .brands-tabs {
+        width: 100%;
+        li {
+            margin-left: 10px;
+            a {
+                position: relative;
+                width: 222px;
+                height: 180px;
+            }
+        }
+        li:first-child {
+            margin-left: 0;
+        }
+        .hover-contain {
+            height: 30px;
+
+            .hoverarr {
+                height: 5px;
+                width: 222px;
+            }
+        }
+    }
+
+    .brands-ad,
+    .brands-logo {
+        margin: 20px 0;
+    }
+
+    .brands-ad li {
+        float: left;
+        margin-left: 10px;
+
+        img {
+            display: block;
+            width: 280px;
+            height: 280px;
+        }
+
+        &:first-child {
+            margin-left: 0;
+
+            img {
+                width: 570px;
+            }
+        }
+    }
+
+    .brands-logo a {
+        float: left;
+        margin-left: 26px;
+
+        &:first-child {
+            margin-left: 0;
+        }
+
+        img {
+            display: block;
+            width: 91px;
+            height: 38px;
+        }
+    }
+
+    .list-floor {
+        width: 1160px;
+    }
+
+    .brandfloor {
+        .g-list {
+            margin-top: -32px;
+        }
+        li {
+            margin-right: 8px;
+            margin-top: 32px;
+            a {
+                width: 378px;
+                height: 250px;
+            }
+        }
+    }
+    .singlegoods {
+        .g-list {
+            margin-top: -10px;
+        }
+        li {
+            margin-right: 10px;
+            margin-top: 10px;
+            a {
+                width: 280px;
+                height: 374px;
+            }
+        }
+        .singlegoods-title {
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            height: 50px;
+            width: 100%;
+            p {
+                position: absolute;
+                z-index: 2;
+                top: 0;
+                left: 0;
+                display: block;
+                width: 100%;
+                height: 100%;
+                line-height: 50px;
+                font-size: 18px;
+                text-align: center;
+                color: #fff;
+            }
+        }
+    }
+    .video {
+        .g-list {
+            margin-top: -10px;
+        }
+        li {
+            margin-right: 8px;
+            margin-top: 10px;
+            a {
+                width: 378px;
+                height: 242px;
+            }
+        }
+        .video-play {
+            display: block;
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            margin-left: -30px;
+            margin-top: -28px;
+            width: 60px;
+            height: 56px;
+            background-image: resolve(img/index/play.png);
+        }
+        .video-title {
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            height: 32px;
+            width: 100%;
+            p {
+                position: absolute;
+                z-index: 2;
+                top: 0;
+                left: 0;
+                display: block;
+                width: 100%;
+                height: 100%;
+                font-size: 14px;
+                line-height: 32px;
+                text-align: center;
+                color: #fff;
+            }
+        }
+    }
+    .news {
+        margin-bottom: 40px;
+        .news-pic {
+            position: relative;
+            float: left;
+            width: 764px;
+            height: 436px;
+            .slide-container {
+                height: 100%;
+                li a {
+                    height: 100%;
+                    width: 764px;
+                }
+
+                .slide-wrapper {
+                    height: 100%;
+                }
+                .slide-switch {
+                    display: none;
+                }
+                .prev {
+                    left: 0;
+                    margin-left: 0;
+                }
+                .next {
+                    right: 0;
+                    margin-right: 0;
+                }
+                .slide-switch.show {
+                    display: block;
+                }
+            }
+            .slide-tips {
+                position: absolute;
+                left: 0;
+                bottom: 0;
+                height: 30px;
+                width: 100%;
+                background: #000;
+                opacity: 0.8;
+
+                p {
+                    position: absolute;
+                    left: 18px;
+                    z-index: 2;
+                    height: 30px;
+                    font-size: 14px;
+                    line-height: 30px;
+                    color: #fff;
+                }
+            }
+            .slide-pagination {
+                right: 0;
+                left: auto;
+                bottom: 0;
+                .slide-shade {
+                    opacity: 0;
+                    background: none;
+                }
+                span {
+                    margin-top: 3px;
+                }
+            }
+        }
+        .news-txt {
+            float: right;
+            padding: 20px 16px;
+            float: right;
+            border: 1px solid #000;
+            overflow: hidden;
+            ul {
+                height: 100%;
+            }
+            li {
+                position: relative;
+                display: block;
+                margin-bottom: 10px;
+                margin-left: 20px;
+            }
+            a {
+                font-size: 14px;
+                line-height: 27px;
+                cursor: pointer;
+                color: #010101;
+                display: block;
+                &:hover {
+                    color: #fff;
+                    background: #000;
+                    padding-left: 12px;
+                    transition: padding 0.4s;
+                }
+            }
+            i {
+                position: absolute;
+                top: 0;
+                left: -26px;
+                font-size: 22px;
+            }
+        }
+        .news-txt {
+            width: 342px;
+            height: 394px;
+        }
+    }
+
+    .ads {
+        margin: 40px 0;
+
+        li {
+            margin-right: 10px;
+            margin-bottom: 10px;
+            a {
+                width: 280px;
+                img {
+                    height: 160px;
+                }
+            }
+            .name {
+                font-size: 14px;
+            }
+            .des {
+                font-size: 12px;
+            }
+        }
+    }
+
+    .brands-items {
+        margin: 25px auto;
+        .brands-item {
+            float: left;
+            padding: 15px 0;
+            width: 50%;
+        }
+        a.brands-pic {
+            float: left;
+            width: 280px;
+            height: 136px;
+            display: block;
+            img {
+                width: 100%;
+                height: 100%;
+            }
+        }
+        .brand-info {
+            float: right;
+            padding: 0 20px;
+            width: 255px;
+            color: #000;
+            h3 {
+                width: 100%;
+                font-size: 20px;
+                line-height: 1;
+
+                @mixin ellipsis;
+            }
+            .brand-desc {
+                padding: 12px 0;
+                height: 92px;
+                font-size: 14px;
+                line-height: 22px;
+                overflow: hidden;
+            }
+        }
+    }
+    .pagination {
+        margin: 40px 0 80px;
+        text-align: center;
+        a {
+            height: 24px;
+            padding: 0 9px;
+            line-height: 24px;
+            display: inline-block;
+            text-align: center;
+            margin-right: 8px;
+            color: #222;
+            font-size: 12px;
+            i {
+                position: relative;
+                top: -1px;
+                font-size: 10px;
+                transform: scale(0.8);
+            }
+        }
+        a.cur {
+            background: #222;
+            color: #fff;
+        }
+    }
+}
+
+.min-screen .brands {
+    .header-navs {
+        margin-right: -10px;
+    }
+    .sit-nav {
+        padding-top: 10px;
+        font-size: 12px;
+        .sep {
+            margin: 0 6px;
+        }
+    }
+    .brands-category {
+        width: 990px;
+    }
+    .brands-tabs {
+        li {
+            a {
+                width: 190px;
+                height: 154px;
+            }
+        }
+        .hover-contain {
+            height: 25px;
+            .hoverarr {
+                height: 4px;
+                width: 190px;
+            }
+        }
+    }
+
+    .brands-ad li {
+        img {
+            width: 240px;
+            height: 240px;
+        }
+
+        &:first-child img {
+            width: 490px;
+        }
+    }
+
+    .brands-logo a {
+        margin-left: 10px;
+
+        &:first-child {
+            margin-left: 0;
+        }
+
+        img {
+            width: 90px;
+            height: 37px;
+        }
+    }
+
+    .list-floor {
+        width: 1000px;
+    }
+
+    .brandfloor {
+        .g-list {
+            margin-top: -26px;
+        }
+        li {
+            margin-right: 9px;
+            margin-top: 26px;
+            a {
+                width: 324px;
+                height: 214px;
+            }
+        }
+    }
+    .singlegoods {
+        .g-list {
+            margin-top: -10px;
+        }
+        li {
+            margin-right: 10px;
+            margin-top: 10px;
+            a {
+                width: 240px;
+                height: 324px;
+            }
+        }
+        .singlegoods-title {
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            height: 50px;
+            width: 100%;
+            p {
+                position: absolute;
+                z-index: 2;
+                top: 0;
+                left: 0;
+                display: block;
+                width: 100%;
+                height: 100%;
+                line-height: 50px;
+                font-size: 18px;
+                text-align: center;
+                color: #fff;
+            }
+        }
+    }
+    .video {
+        .g-list {
+            margin-top: -10px;
+        }
+        li {
+            margin-right: 9px;
+            margin-top: 10px;
+            a {
+                width: 324px;
+                height: 206px;
+            }
+        }
+        .video-play {
+            display: block;
+            position: absolute;
+            left: 50%;
+            top: 50%;
+            margin-left: -30px;
+            margin-top: -28px;
+            width: 60px;
+            height: 56px;
+            background-image: resolve(img/index/play.png);
+        }
+        .video-title {
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            height: 30px;
+            width: 100%;
+            p {
+                position: absolute;
+                z-index: 2;
+                top: 0;
+                left: 0;
+                display: block;
+                width: 100%;
+                height: 100%;
+                font-size: 14px;
+                line-height: 30px;
+                text-align: center;
+                color: #fff;
+            }
+        }
+    }
+    .news {
+        .news-pic {
+            width: 660px;
+            height: 376px;
+            .slide-container {
+                height: 376px;
+                img {
+                    height: 376px;
+                }
+            }
+        }
+        .news-txt {
+            width: 284px;
+            height: 334px;
+            li {
+                margin-bottom: 13px;
+            }
+        }
+    }
+    .ads {
+        margin-bottom: 30px;
+
+        li {
+            margin-right: 10px;
+            margin-bottom: 10px;
+            a {
+                width: 240px;
+                img {
+                    height: 138px;
+                }
+            }
+            .name {
+                font-size: 14px;
+            }
+            .des {
+                font-size: 12px;
+            }
+        }
+    }
+    .brands-items {
+        a.brands-pic {
+            width: 240px;
+            height: 116px;
+        }
+        .brand-info {
+            width: 212px;
+            .brand-desc {
+                height: 72px;
+            }
+        }
+    }
+}
+
+.brands-layer {
+    position: absolute;
+    z-index: 100;
+    top: -83px;
+    left: 15px;
+    width: 325px;
+    height: 287px;
+    background: resolve(img/index/brands-layer.png) no-repeat;
+    font-weight: normal;
+
+    .layer-content {
+        padding: 20px 20px 20px 35px;
+        .title {
+            font-size: 24px;
+            line-height: 24px;
+            border-bottom: 1px solid #ccc;
+            padding-bottom: 5px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+        .desc {
+            margin: 5px 0;
+            height: 72px;
+            overflow: hidden;
+            img {
+                width: 80px;
+                height: 50px;
+                margin: 3px 5px 0 0;
+                float: left;
+            }
+            .right {
+                width: 180px;
+                float: right;
+                font-size: 12px;
+                line-height: 150%;
+                max-height: 80px;
+            }
+        }
+        .featured {
+            font-size: 16px;
+            margin-right: -15px;
+            img {
+                height: 100px;
+                width: 80px;
+                float: left;
+                margin: 15px 15px 0 0;
+            }
+        }
+    }
+}
+
+.brands-layer-right {
+    background: resolve(img/index/brands-layer.png) no-repeat 0 -287px;
+    left: -325px;
+    top: -83px;
+
+    .layer-content {
+        padding: 20px 35px 20px 20px;
+    }
+}

+.coupon-page {
+    width: 1150px;
+    margin: 10px auto 0;
+
+    .slide-container {
+        position: relative;
+    }
+
+    .slide-wrapper {
+        position: relative;
+        height: 450px;
+        overflow: hidden;
+
+        ul {
+            position: relative;
+            height: 100%;
+        }
+
+        &:hover .slide-switch.show {
+            display: block;
+        }
+
+        li {
+            display: none;
+            position: absolute;
+            top: 0;
+            right: 0;
+            width: 100%;
+            height: 100%;
+
+            a {
+                display: block;
+                height: 100%;
+                width: 1150px;
+                margin: 0 auto;
+            }
+
+            &:first-child {
+                display: block;
+            }
+
+            img {
+                width: 100%;
+                height: 100%;
+            }
+        }
+    }
+
+    .slide-switch {
+        display: block;
+        a {
+            position: absolute;
+            top: 50%;
+            margin: -30px 0 0;
+            width: 60px;
+            height: 60px;
+            line-height: 56px;
+            text-align: center;
+            z-index: 2;
+            background: #fff;
+            opacity: 0.55;
+            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=55)";
+
+            &.prev {
+                left: 50%;
+                margin-left: -575px;
+            }
+
+            &.next {
+                right: 50%;
+                margin-right: -575px;
+            }
+
+            &:hover {
+                opacity: 0.9;
+            }
+
+            .iconfont {
+                font-size: 32px;
+                color: #59585a;
+            }
+        }
+    }
+
+    .title {
+        width: 300px;
+        margin: 80px auto 40px;
+        text-align: center;
+        border: 1px solid #000;
+        height: 31px;
+        line-height: 31px;
+        position: relative;
+
+        span {
+            margin: 5px;
+        }
+    }
+
+    .coupon {
+        display: inline-block;
+        position: relative;
+        width: 282px;
+        height: 258px;
+        margin-right: 2px;
+
+        img {
+            width: 100%;
+            height: 100%;
+        }
+
+        .coupon-mask {
+            width: 100%;
+            height: 259px;
+            background-color: rgba(0, 0, 0, 0.6);
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            z-index: 99;
+        }
+
+        .info {
+            width: 78px;
+            height: 78px;
+            position: absolute;
+            right: 2px;
+            bottom: -1px;
+            > div {
+                width: 100%;
+                height: 38px;
+                font-size: 16px;
+                color: #fff;
+                text-align: center;
+                position: absolute;
+                top: 50%;
+                margin-top: -19px;
+            }
+
+            p {
+                margin-bottom: 5px;
+            }
+
+            .guang {
+                width: 50px;
+                height: 18px;
+                line-height: 18px;
+                font-size: 12px;
+                background-color: #fff;
+                color: #d0021b;
+                margin: 0 auto;
+            }
+        }
+    }
+
+}

+/* 公共样式 */
+.g-list {
+    li {
+        float: left;
+        a {
+            position: relative;
+            display: block;
+            overflow: hidden;
+            img {
+                width: 100%;
+                height: 100%;
+            }
+        }
+    }
+}
+
+.g-mask {
+    display: block;
+    position: absolute;
+    height: 100%;
+    width: 100%;
+    z-index: 1;
+    background: #000;
+    opacity: 0.5;
+    overflow: hidden;
+    transition: opacity 0.6s;
+}
+
+.g-title {
+    display: block;
+    text-align: center;
+    font-weight: bold;
+    line-height: 1.5;
+    width: 100%;
+    margin-top: 14px;
+}
+
+/* 热门推荐模板样式 */
+.home-page {
+    .tpl-recommend {
+        width: 100%;
+        position: relative;
+        a {
+            display: block;
+            img {
+                display: block;
+                width: 100%;
+                height: 100%;
+            }
+        }
+        .tpl-body {
+            margin-bottom: 8px;
+        }
+        .tpl-nav {
+            float: left;
+            overflow: hidden;
+            .tpl-keywords {
+                margin-bottom: 8px;
+            }
+
+            .tpl-category {
+                padding: 10px 0;
+                background-color: #f8f8f8;
+                overflow: hidden;
+
+                a {
+                    float: left;
+                    width: 50%;
+                    text-align: center;
+                    color: #000;
+                    overflow: hidden;
+                }
+            }
+        }
+        .tpl-brands {
+            float: left;
+            overflow: hidden;
+            margin-left: 8px;
+            li {
+                margin-top: 8px;
+            }
+        }
+        .tpl-types {
+            float: left;
+            overflow: hidden;
+            margin-top: -8px;
+            width: 579px;
+
+            li {
+                float: left;
+                margin-left: 8px;
+                margin-top: 8px;
+
+                a {
+                    width: 185px;
+                    height: 248px;
+                }
+            }
+        }
+        .tpl-products {
+            overflow: hidden;
+            margin-left: -10px;
+            li {
+                float: left;
+                margin-left: 10px;
+
+                a {
+                    width: 222px;
+                    height: 298px;
+                }
+            }
+        }
+
+        .tpl-nav {
+            width: 185px;
+
+            .keywords0,
+            .keywords1,
+            .keywords2 {
+                margin-bottom: 10px;
+                height: 76px;
+            }
+            .keywords2 {
+                margin-bottom: 0;
+            }
+            .tpl-category {
+                height: 228px;
+
+                a {
+                    height: 38px;
+                    line-height: 38px;
+                    font-size: 14px;
+                }
+            }
+        }
+
+        .tpl-brands {
+            width: 378px;
+            height: 512px;
+
+            li a {
+                height: 248px;
+            }
+        }
+    }
+}
+
+.min-screen .home-page .tpl-recommend {
+    .tpl-nav {
+        width: 158px;
+
+        .keywords0,
+        .keywords1,
+        .keywords2 {
+            margin-bottom: 8px;
+            height: 65px;
+        }
+
+        .keywords2 {
+            margin-bottom: 0;
+        }
+
+        .tpl-category {
+            height: 192px;
+
+            a {
+                height: 32px;
+                line-height: 32px;
+                font-size: 12px;
+
+                &:hover {
+                    text-decoration: underline;
+                }
+            }
+        }
+    }
+    .tpl-brands {
+        width: 324px;
+        height: 432px;
+        li a {
+            height: 212px;
+        }
+    }
+    .tpl-types {
+        width: 498px;
+        li a {
+            width: 158px;
+            height: 212px;
+        }
+    }
+    .tpl-products li a {
+        width: 190px;
+        height: 254px;
+    }
+}
+
+/* 单品模板样式 */
+.home-page {
+    .singlehot {
+        overflow: hidden;
+        margin-left: -8px;
+
+        li {
+            margin-left: 8px;
+            margin-bottom: 8px;
+
+            a {
+                width: 185px;
+                height: 248px;
+            }
+        }
+
+        .impo1,
+        .impo9 {
+            width: 378px;
+        }
+    }
+
+    .floor-ad a {
+        display: block;
+        height: 129px;
+
+        img {
+            display: block;
+            width: 100%;
+            height: 100%;
+        }
+    }
+
+    .goods-container {
+        margin-right: -10px;
+        width: inherit;
+        padding-top: 0;
+
+        .good-info {
+            margin-bottom: 0;
+            width: 280px;
+            height: 485px;
+        }
+
+        .good-detail-img {
+            height: 374px;
+        }
+
+        .good-detail-text {
+            text-align: center;
+        }
+    }
+    .adbanner {
+        margin-top: 12px;
+        a {
+            height: 150px;
+        }
+    }
+}
+
+.min-screen .home-page {
+    .singlehot {
+        li a {
+            width: 158px;
+            height: 212px;
+        }
+        .impo1,
+        .impo9 {
+            width: 323px;
+        }
+    }
+    .goods-container {
+        .good-info {
+            width: 240px;
+            height: 412px;
+
+            .good-detail-img {
+                height: 320px;
+            }
+        }
+    }
+}
+
+/* 人气单品 */
+.home-page .commodity {
+    .commodity-list {
+        margin-left: -10px;
+        a {
+            height: 465px;
+            width: 280px;
+        }
+        li {
+            margin-left: 10px;
+        }
+        i {
+            position: absolute;
+            bottom: 0;
+            width: 100%;
+            height: 20px;
+            background: #ffac5b;
+            color: #fff;
+            line-height: 20px;
+            text-align: center;
+            font-size: 12px;
+        }
+        i.top {
+            position: absolute;
+            top: 10px;
+            right: 10px;
+            background-color: rgb(255, 87, 92);
+            color: #fff;
+            border-radius: 30px;
+            z-index: 2;
+            height: 60px;
+            width: 60px;
+            line-height: 60px;
+            font-size: 20px;
+        }
+        .commodity-img {
+            position: relative;
+            height: 374px;
+        }
+        p.commodity-name {
+            font-size: 12px;
+            color: #000;
+            text-align: center;
+            margin-top: 14px;
+            line-height: 18px;
+        }
+        p.commodity-price {
+            position: relative;
+            margin: 3px 0 0;
+            text-align: center;
+            line-height: 20px;
+            color: #000;
+            span {
+                display: inline-block;
+                font-size: 12px;
+            }
+        }
+    }
+    .commodity-brands {
+        margin-left: -8px;
+        a {
+            float: left;
+            margin-left: 8px;
+            display: block;
+            width: 185px;
+            height: 86px;
+            img {
+                width: 100%;
+                height: 100%;
+            }
+        }
+    }
+    .loading {
+        position: relative;
+        width: 100%;
+        text-align: center;
+        padding-top: 40px;
+        a {
+            display: block;
+            height: 35px;
+            width: 120px;
+            margin: 0 auto 40px;
+            background-color: #000;
+            color: #fff;
+            font-size: 14px;
+            line-height: 35px;
+            text-align: center;
+        }
+    }
+}
+
+.min-screen .home-page .commodity {
+    .commodity-list {
+        a {
+            height: 400px;
+            width: 240px;
+        }
+        .commodity-img {
+            height: 320px;
+        }
+        i.top {
+            height: 52px;
+            width: 52px;
+            line-height: 52px;
+            font-size: 14px;
+        }
+    }
+    .commodity-brands {
+        a {
+            width: 158px;
+            height: 74px;
+        }
+    }
+}
+
+/* 手风琴 */
+.home-page {
+    .slide-accordion {
+        overflow: hidden;
+        position: relative;
+        height: 400px;
+
+        a {
+            position: relative;
+            display: block;
+            img {
+                display: block;
+                width: 100%;
+                height: 100%;
+            }
+        }
+        ul {
+            position: absolute;
+            left: -5px;
+        }
+        li {
+            position: absolute;
+            border-left: 5px solid #fff;
+            a {
+                width: 650px;
+                height: 400px;
+            }
+        }
+        .g-mask {
+            opacity: 0.2;
+            &:hover {
+                opacity: 0;
+            }
+        }
+    }
+}
+
+.min-screen .home-page .slide-accordion {
+    height: 342px;
+    li a {
+        width: 558px;
+        height: 342px;
+    }
+}
+
+.boys {
+    .tpl-nav {
+        .keywords0 {
+            margin-bottom: 10px !important;
+            height: 152px !important;
+        }
+        .keywords1 {
+            height: 86px !important;
+        }
+        .tpl-category {
+            a {
+                height: 38px !important;
+                line-height: 38px !important;
+                font-size: 14px !important;
+            }
+        }
+    }
+    .tpl-brands {
+        margin-top: -8px !important;
+    }
+}
+
+.boys,
+.lifestyle {
+    .goods-container {
+        .good-info {
+            width: 222px !important;
+            height: 408px !important;
+            .good-detail-img {
+                height: 298px !important;
+            }
+        }
+    }
+}
+
+.min-screen {
+    .boys {
+        .tpl-nav {
+            .keywords0 {
+                margin-bottom: 8px !important;
+                height: 130px !important;
+            }
+            .keywords1 {
+                margin-bottom: 0 !important;
+                height: 74px !important;
+            }
+        }
+        .tpl-brands {
+            margin-top: -8px !important;
+        }
+    }
+
+    .boys,
+    .lifestyle {
+        .goods-container {
+            .good-info {
+                width: 188px;
+                height: 360px;
+                .good-detail-img {
+                    height: 255px;
+                }
+            }
+        }
+    }
+}

+.home-page {
+    width: 1150px;
+    margin: 10px auto 0;
+
+    .slide-container {
+        position: absolute;
+        left: 0;
+        right: 0;
+        height: 450px;
+    }
+
+    .slide-thumb-container {
+        height: 510px;
+    }
+
+    .slide-wrapper {
+        position: relative;
+        height: 450px;
+        overflow: hidden;
+
+        ul {
+            position: relative;
+            height: 100%;
+        }
+
+        &:hover .slide-switch.show {
+            display: block;
+        }
+
+        li {
+            display: none;
+            position: absolute;
+            top: 0;
+            right: 0;
+            width: 100%;
+            height: 100%;
+
+            a {
+                display: block;
+                height: 100%;
+                width: 1150px;
+                margin: 0 auto;
+            }
+
+            &:first-child {
+                display: block;
+            }
+
+            img {
+                width: 100%;
+                height: 100%;
+            }
+        }
+    }
+
+    .slide-container-placeholder {
+        height: 450px;
+        width: 100%;
+
+    }
+
+    .slide-thumb-container-placeholder {
+        height: 510px;
+    }
+
+    .slide-switch {
+        display: block;
+
+        a {
+            position: absolute;
+            top: 50%;
+            margin: -30px 0 0;
+            width: 60px;
+            height: 60px;
+            line-height: 56px;
+            text-align: center;
+            z-index: 2;
+            background: #fff;
+            opacity: 0.55;
+
+            &.prev {
+                left: 50%;
+                margin-left: -575px;
+            }
+
+            &.next {
+                right: 50%;
+                margin-right: -575px;
+            }
+
+            &:hover {
+                opacity: 0.9;
+            }
+
+            .iconfont {
+                font-size: 32px;
+                color: #59585a;
+            }
+        }
+    }
+
+    .thumb-pagination {
+        width: 1148px;
+        margin: 6px auto 0;
+        padding-left: 2px;
+
+        li {
+            position: relative;
+            float: left;
+            margin-left: 6px;
+            width: 138px;
+            height: 54px;
+
+            &:first-child {
+                margin: 0;
+            }
+
+            &.focus a {
+                opacity: 0;
+            }
+
+            a {
+                position: absolute;
+                left: 0;
+                right: 0;
+                bottom: 0;
+                top: 0;
+                background: #000;
+                opacity: 0.3;
+            }
+
+            img {
+                width: 100%;
+                height: 100%;
+            }
+        }
+    }
+
+    /* 大banner圆点 */
+    .slide-pagination {
+        font-size: 0;
+
+        .slide-shade {
+            position: absolute;
+            left: 0;
+            right: 0;
+            top: 0;
+            bottom: 0;
+            background: #000;
+            opacity: 0.3;
+            border-radius: 13px;
+        }
+
+        span {
+            position: relative;
+            display: inline-block;
+            margin: 0 7px;
+            width: 12px;
+            height: 12px;
+            background: #fff;
+            cursor: pointer;
+            opacity: 0.6;
+            border-radius: 6px;
+            z-index: 2;
+
+            &.focus {
+                opacity: 1;
+            }
+        }
+    }
+
+    .debris-slider {
+        height: 510px;
+        width: 100%;
+
+        .col {
+            float: left;
+
+            a {
+                display: block;
+            }
+        }
+
+        .left-col a,
+        .right-col a {
+            margin-bottom: 10px;
+
+            &:last-child {
+                margin-bottom: 0;
+            }
+        }
+
+        .right-col img,
+        .left-col img {
+            height: 100%;
+            width: 100%;
+        }
+
+        .left-col {
+            margin-right: 10px;
+
+            a {
+                width: 280px;
+                height: 120px;
+            }
+
+            a:first-child {
+                height: 250px;
+            }
+        }
+
+        .center-col {
+            position: relative;
+            width: 570px;
+            height: 100%;
+            margin-right: 10px;
+            font-size: 0;
+
+            &:hover {
+                .slide-switch.show {
+                    display: block;
+                }
+            }
+
+            .slide-wrapper {
+                height: 100%;
+
+                a {
+                    width: 100%;
+                }
+            }
+
+            .slide-switch {
+                a.prev {
+                    left: 0;
+                    margin-left: 0;
+                }
+                a.next {
+                    right: 0;
+                    margin-right: 0;
+                }
+            }
+
+            img {
+                max-width: 100%;
+                max-height: 100%;
+            }
+        }
+
+        .right-col a {
+            width: 280px;
+            height: 120px;
+        }
+
+        .right-col a:first-child {
+            height: 380px;
+            margin-bottom: 11px;
+        }
+    }
+
+    .new-report {
+        img {
+            display: block;
+            width: 100%;
+            height: 100%;
+        }
+
+        .report-list {
+            float: left;
+            width: 868px;
+
+            li {
+                float: left;
+                margin: 0 8px 8px 0;
+                width: 185px;
+                height: 248px;
+                overflow: hidden;
+
+                &:first-child {
+                    margin-right: 7px;
+                    width: 282px;
+                    height: 504px;
+                }
+            }
+        }
+
+        .last-item {
+            float: left;
+            width: 282px;
+            height: 504px;
+            overflow: hidden;
+        }
+    }
+
+    /* 优选品牌 */
+    .preference-brand {
+        overflow: hidden;
+    }
+
+    .preference-brand-list {
+        margin-top: 8px;
+        width: 1158px;
+    }
+
+    .preference-brand-item {
+        float: left;
+        margin-right: 8px;
+        margin-bottom: 8px;
+
+        a {
+            display: table-cell;
+            width: 185px;
+            height: 86px;
+            text-align: center;
+            vertical-align: middle;
+        }
+
+        img {
+            display: block;
+            max-width: 100%;
+            max-height: 100%;
+            margin: 0 auto;
+        }
+    }
+
+    .preference-more {
+        float: left;
+        width: 185px;
+        height: 86px;
+        line-height: 100px;
+        text-align: center;
+        color: black;
+        font-size: 16px;
+    }
+
+    .img-slider-wrapper {
+        position: relative;
+        width: 100%;
+        height: 558px;
+        background: #8ae6e0;
+        overflow: hidden;
+
+        .img-brand-switch {
+            display: block;
+            a {
+                position: absolute;
+                top: 50%;
+                font-size: 36px;
+                color: #fff;
+
+                &.next {
+                    right: 30px;
+                }
+
+                &.prev {
+                    left: 30px;
+                }
+            }
+        }
+    }
+
+    .img-container-landscape {
+        box-sizing: border-box;
+        margin: 86px auto 0;
+        width: 982px;
+        height: 433px;
+        overflow: hidden;
+
+        .img-list {
+            width: 1000px;
+            height: 100%;
+        }
+
+        .img-item {
+            float: left;
+            box-sizing: border-box;
+            width: 320px;
+            height: 100%;
+            margin-right: 10px;
+
+            img {
+                width: 100%;
+                height: 100%;
+            }
+        }
+    }
+
+    .img-brand {
+        position: relative;
+        width: 100%;
+        height: 175px;
+        overflow: hidden;
+
+        &:hover {
+            .img-brand-switch {
+                display: block;
+            }
+        }
+        ul {
+            width: 1158px;
+        }
+        li {
+            float: left;
+            margin: 0 8px 0 0;
+            width: 378px;
+            height: 175px;
+            line-height: 175px;
+            overflow: hidden;
+            font-size: 0;
+            text-align: center;
+
+            img {
+                max-width: 100%;
+                max-height: 100%;
+                vertical-align: middle;
+            }
+        }
+        .img-brand-switch {
+            display: none;
+            a {
+                position: absolute;
+                top: 50%;
+                margin: -20px 0 0;
+                width: 40px;
+                height: 40px;
+                line-height: 40px;
+                text-align: center;
+                z-index: 2;
+                background: #fff;
+                opacity: 0.55;
+
+                &.prev {
+                    left: 0;
+                }
+                &.next {
+                    right: 0;
+                }
+                &:hover {
+                    opacity: 0.9;
+
+                }
+            }
+        }
+    }
+
+    .logo-brand {
+        width: 100%;
+        height: 282px;
+        overflow: hidden;
+
+        &.logos-10 {
+            height: 188px;
+        }
+
+        ul {
+            width: 1158px;
+        }
+
+        li {
+            float: left;
+            margin: 8px 8px 0 0;
+            width: 185px;
+            height: 86px;
+            line-height: 86px;
+            font-size: 0;
+            text-align: center;
+            img {
+                max-width: 100%;
+                max-height: 100%;
+                vertical-align: middle;
+            }
+        }
+
+        .logo-brand-switch {
+            position: relative;
+            background: resolve(img/index/logo-brand-line.png) no-repeat center center;
+            line-height: normal;
+
+            .iconfont {
+                position: absolute;
+                left: 50%;
+                font-size: 32px;
+
+                &.prev {
+                    top: 10px;
+
+                    margin-left: -48px;
+                }
+                &.next {
+                    bottom: 12px;
+                    margin-left: 20px;
+                }
+            }
+        }
+
+        .brand-more {
+            font-size: 16px;
+
+            &:hover {
+                text-decoration: underline;
+            }
+        }
+    }
+
+    .categorys-list {
+        ul {
+            width: 1158px;
+        }
+
+        li {
+            float: left;
+            margin: 0 8px 8px 0;
+            width: 185px;
+            height: 248px;
+
+            &.cate-item0 {
+                width: 185px;
+                height: 504px;
+            }
+
+            &.cate-item1 {
+                width: 377px;
+                height: 504px;
+            }
+
+            img {
+                display: block;
+                width: 100%;
+                height: 100%;
+            }
+        }
+    }
+
+    .floor-header {
+        position: relative;
+        margin: 80px 0 40px;
+
+        .floor-title {
+            margin: 0 auto;
+            width: 298px;
+            height: 31px;
+            line-height: 31px;
+            border: 1px solid #000;
+            font-size: 16px;
+            text-align: center;
+        }
+
+        .header-navs {
+            position: absolute;
+            padding: 10px 0;
+            top: 0;
+            right: 0;
+            font-size: 14px;
+
+            li {
+                float: left;
+                padding: 1px 15px;
+                border-left: 1px solid #ccc;
+
+                &:first-child {
+                    border-left: none;
+                }
+
+                &:hover {
+                    text-decoration: underline;
+                }
+
+                a {
+                    color: #333;
+                }
+            }
+        }
+    }
+}
+
+@import "index-pliffy";
+@import "min-index";
+@import "brand";
+@import "coupon";

+/* 首页990 */
+.min-screen .home-page {
+    width: 990px;
+
+    /* 大banner */
+    .slide-container {
+        height: 387px;
+
+        img {
+            display: block;
+        }
+    }
+
+    .slide-thumb-container {
+        height: 440px;
+    }
+
+    .slide-container-placeholder {
+        height: 387px;
+    }
+
+    .slide-thumb-container-placeholder {
+        height: 440px;
+    }
+
+    /* 大banner大图 */
+    .slide-wrapper {
+        height: 387px;
+
+        li {
+            a {
+                width: 990px;
+            }
+        }
+    }
+
+    /* 大图上的左右切换按钮 */
+    .slide-switch {
+        display: block;
+
+        a {
+            &.prev {
+                margin-left: -495px;
+            }
+
+            &.next {
+                margin-right: -495px;
+            }
+
+            &:hover {
+                opacity: 0.9;
+            }
+        }
+    }
+
+    /* 大banner缩略图 */
+    .thumb-pagination {
+        width: 990px;
+        margin: 7px auto 0;
+        padding: 0;
+
+        li {
+            width: 118px;
+            height: 46px;
+        }
+    }
+
+    /* 女首碎片banner */
+    .debris-slider {
+        height: 440px;
+
+        .left-col {
+            margin-right: 9px;
+
+            a {
+                width: 240px;
+                height: 103px;
+            }
+
+            a:first-child {
+                height: 214px;
+            }
+        }
+
+        .center-col {
+            width: 492px;
+            margin-right: 9px;
+        }
+
+        .right-col a {
+            width: 240px;
+            height: 103px;
+        }
+
+        .right-col a:first-child {
+            height: 326px;
+            margin-bottom: 10px;
+        }
+    }
+
+    /* 男首最新速报 */
+    .new-report {
+        .report-list {
+            width: 748px;
+
+            li {
+                width: 158px;
+                height: 212px;
+
+                &:first-child {
+                    width: 242px;
+                    height: 432px;
+                }
+            }
+        }
+
+        .last-item {
+            width: 242px;
+            height: 432px;
+        }
+    }
+
+    /* 优选品牌 */
+    .preference-brand-list {
+        width: 998px;
+    }
+
+    .preference-brand-item {
+        margin-right: 7px;
+
+        a {
+            width: 159px;
+            height: 74px;
+        }
+    }
+
+    .preference-more {
+        width: 159px;
+        height: 74px;
+        line-height: 90px;
+    }
+
+    .img-slider-wrapper {
+        height: 480px;
+    }
+
+    .img-container-landscape {
+        margin: 73px auto 0;
+        width: 844px;
+        height: 370px;
+
+        .img-item {
+            width: 275px;
+            height: 100%;
+            margin-right: 9px;
+        }
+    }
+
+    /* 男首优选品牌 图片品牌 */
+    .img-brand {
+        height: 150px;
+        ul {
+            width: 998px;
+        }
+        li {
+            width: 325px;
+            height: 150px;
+            line-height: 150px;
+        }
+    }
+
+    /* 男首优选品牌 logo品牌 */
+    .logo-brand {
+        height: 246px;
+
+        &.logos-10 {
+            height: 164px;
+        }
+
+        ul {
+            width: 998px;
+        }
+
+        li {
+            margin: 8px 8px 0 0;
+            width: 158px;
+            height: 74px;
+            line-height: 74px;
+        }
+
+        .logo-brand-switch {
+            .iconfont {
+                font-size: 24px;
+
+                &.prev {
+                    top: -12px;
+                }
+                &.next {
+                    bottom: -12px;
+                }
+            }
+        }
+    }
+
+    /* 创意生活商品分类 */
+    .categorys-list {
+        ul {
+            width: 1004px;
+        }
+
+        li {
+            margin: 0 7px 7px 0;
+            width: 161px;
+            height: 214px;
+
+            &.cate-item0 {
+                width: 160px;
+                height: 435px;
+            }
+
+            &.cate-item1 {
+                width: 326px;
+                height: 435px;
+            }
+        }
+    }
+
+    .floor-header {
+        margin: 50px 0 30px;
+
+        .header-navs {
+
+            li {
+                padding: 1px 10px;
+            }
+        }
+    }
+}