@{layout layout}
@set header{
    <link rel="stylesheet" href="@{d.SkinPath}/static/css/amazeui.min.css">
    <link rel="stylesheet" href="@{d.SkinPath}/static/css/swiper.min.css" type="text/css">
    <link href="@{d.SkinPath}/static/css/Global.css" rel="stylesheet" type="text/css" />
    <link href="@{d.SkinPath}/static/css/Style.css" rel="stylesheet" type="text/css" />
    <script src="@{d.SkinPath}/static/js/jquery.js" language="javascript"></script>
    <script src="@{d.SkinPath}/static/js/swiper.min.js"></script>
    <script src="@{d.SkinPath}/static/js/amazeui.min.js"></script>
     
     <script type="text/javascript">
                 var calculate_size = function () {
                 var BASE_FONT_SIZE = 20;
         
                 var docEl = document.documentElement,
                     clientWidth = docEl.clientWidth;
                 if (!clientWidth) return;
                 docEl.style.fontSize = BASE_FONT_SIZE * (clientWidth / 375) + 'px';
             };
             // Abort if browser does not support addEventListener
             if (document.addEventListener) {
                 var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
                 window.addEventListener(resizeEvt, calculate_size, false);
                 document.addEventListener('DOMContentLoaded', calculate_size, false);
                 calculate_size();
             }
     </script>
@}
@set body{
    <div class="am-contain amn3">
        <div id="banner" class="am-banner">
                <div class="swiper-container" style="width:100%;min-height: 2rem;">
                        @var m is d.GenMod("banner1"){
                        <div class="swiper-wrapper" @{m.Attrs}>
                            <div class="swiper-slide">
                                <img src="@{m.Items[3].Image}">
                            </div>
                            <div class="swiper-slide">
                                <img src="@{m.Items[0].Image}">
                            </div>
                            <div class="swiper-slide">
                                <img src="@{m.Items[1].Image}">             
                            </div>
                            <div class="swiper-slide">
                                <img src="@{m.Items[2].Image}">
                            </div>
                            
                            
                        </div>
                        @}
                    <div class="swiper-pagination btn"></div> 
                </div>
        </div>
        <div class="am-box1">
            <ul class="am-box1-list">
                <li class="am-u-sm-3">
                    <a href="javascript:;">
                        <div class="abicon abicon1"></div>
                    </a>
                </li>
                <li class="am-u-sm-3">
                    <a href="javascript:;">
                        <div class="abicon abicon2"></div>
                    </a>
                </li>
                <li class="am-u-sm-3">
                    <a href="javascript:;">
                        <div class="abicon abicon3"></div>
                    </a>
                </li>
                <li class="am-u-sm-3">
                    <a href="javascript:;">
                        <div class="abicon abicon4"></div>
                    </a>
                </li>
            </ul>
        </div>
        <div class="am-box2">
            <div class="am-box2-title"></div>
            @var m is d.GenMod("am-prodlist"){
            <ul class="am-prodlist" @{m.Attrs}>
                <li>
                    <a href="@{m.Items[0].URL}">
                        <div style="width: 100%;height: 100%;overflow: hidden;">
                            <div class="picbox"><img src="@{m.Items[0].Image}"></div>
                            <h1>@{m.Items[0].Text}</h1>
                            <span>
                               @{m.Items[4].Text}
                            </span>
                            <div class="link"></div>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="@{m.Items[1].URL}">
                        <div style="width: 100%;height: 100%;overflow: hidden;">
                            <div class="picbox"><img src="@{m.Items[1].Image}"></div>
                            <h1>@{m.Items[1].Text}</h1>
                            <span>@{m.Items[5].Text}</span>
                            <div class="link"></div>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="@{m.Items[2].URL}">
                        <div style="width: 100%;height: 100%;overflow: hidden;">
                            <div class="picbox"><img src="@{m.Items[2].Image}"></div>
                            <h1>@{m.Items[2].Text}</h1>
                            <span>@{m.Items[6].Text}</span>
                            <div class="link"></div>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="@{m.Items[3].URL}">
                        <div style="width: 100%;height: 100%;overflow: hidden;">
                            <div class="picbox"><img src="@{m.Items[3].Image}"></div>
                            <h1>@{m.Items[3].Text}</h1>
                            <span>@{m.Items[7].Text}</span>
                            <div class="link"></div>
                        </div>
                    </a>
                </li>
            </ul>
            @}
            <div class="am-box2-link">
                <a href="/product/"></a>
            </div>
        </div>
        <div class="am-footer">
            版权所有©2018温州豪舜阀门管件有限公司      技术支持：腾科网络
        </div>
    </div>

</ul>
@}