{template "content","header"}

<div class="main">

    <div class="ins-main">

        <div class="ins-about">

            <div class="about-top">

                <div class="img"><img src="{EX_PATH}images/about-top_02.jpg" alt=""></div>

                <div class="txt">

                    <h5 class="foo15">No.1 Quality is the core of our company</h5>

                    <p class="foo16">we are the leading supplier in the sublimation industry in Shenzhen city mainland China</p>

                    <b class="foo17">0086-755-28378810</b>

                </div>

            </div>

            <div class="profile">

                <div class="container">

                    <div class="img"><img src="{EX_PATH}images/profile_03.jpg" alt=""></div>

                    <div class="txt-box">

                        <h6>{$CATEGORYS[184][catname]}</h6>

                        <b></b>



                        {pc:get sql="select * from phpcms_page where catid=184"}

                        {loop $data $r}

                        {$r[content]}

                        {/loop}

                        {/pc}



                    </div>

                </div>

            </div>

            <div class="mission-value">

                <div class="container">



                    <div class="txt">

                        <h6>Mission Statement</h6>

                        <b></b>

                        <p>Htpmart ’s mission is to be a reputable worldwide supplier in the sublimation area.

                            We are always standing on the principle of satisfying our customers and market demands and pursuing scientific

                            administration and superior quality by using the latest technology grounded in a thorough understanding of end-users’ needs.</p>

                    </div>



                    <div class="txt">

                        <h6>Value</h6>

                        <b></b>

                        <p>Htpmart’s  value is to offer our customers first class quality products at the most competitive prices.

                            "You Deserve the Best!" is our eternal promise to our customers.  Htpamrt  will continually upgrade our

                            administrative structure and technology to lower the cost to keep our competitive ability.</p>

                    </div>



                </div>

            </div>

            <div class="culture">

                <div class="container">

                    <div class="content">

                        <div class="img pc-con"><img src="{EX_PATH}images/culture_03.png" alt=""></div>

                        <div class="list-box">

                            <div class="list">No.1 Quality is the core of our company</div>

                            <div class="list">Best customer services</div><br/>

                            <div class="list">Brand development strategy</div>

                            <div class="list">Innovation</div>

                            <div style="clear: both"></div>

                        </div>

                    </div>

                </div>

            </div>

            <div class="business">

                <div class="container">

                    <div class="img"><img src="{EX_PATH}images/business_03.jpg" alt=""></div>

                    <div class="txt-box">

                        <h6>{$CATEGORYS[186][catname]}</h6>

                        <b></b>

                        {pc:get sql="select * from phpcms_page where catid=186"}

                        {loop $data $r}

                        {$r[content]}

                        {/loop}

                        {/pc}

                    </div>

                </div>

            </div>

            <div class="team">

                <div class="c1 container">

                    <div class="foucebox" style="margin:0 auto">

                        <div class="hd">

                            <div class="prev"></div>

                            <div  class="hoverBg" ></div>

                            <div class="box">

                                <ul>

                                    {pc:content action="lists" catid="187" num="4" order="listorder desc" page="$page" moreinfo="1"}

                                    {if empty($data)}

                                    <li>

                                        <a>

                                            <div class="img"><img src="{EX_PATH}images/ins-team_03.jpg" alt=""></div>

                                            <div class="txt">

                                                <h6>Eason1</h6>

                                                <p>Professional designer</p>

                                            </div>

                                            <div style="clear: both"></div>

                                        </a>

                                    </li>



                                    <li>

                                        <a>

                                            <div class="img"><img src="{EX_PATH}images/ins-team_03.jpg" alt=""></div>

                                            <div class="txt">

                                                <h6>Eason2</h6>

                                                <p>Professional designer</p>

                                            </div>

                                            <div style="clear: both"></div>

                                        </a>

                                    </li>



                                    <li>

                                        <a>

                                            <div class="img"><img src="{EX_PATH}images/ins-team_03.jpg" alt=""></div>

                                            <div class="txt">

                                                <h6>Eason3</h6>

                                                <p>Professional designer</p>

                                            </div>

                                            <div style="clear: both"></div>

                                        </a>

                                    </li>



                                    <li>

                                        <a>

                                            <div class="img"><img src="{EX_PATH}images/ins-team_03.jpg" alt=""></div>

                                            <div class="txt">

                                                <h6>Eason4</h6>

                                                <p>Professional designer</p>

                                            </div>

                                            <div style="clear: both"></div>

                                        </a>

                                    </li>

                                    {else}

                                    {loop $data $r}

                                    <li>

                                        <a>

                                            <div class="img"><img src="{$r[thumb]}" alt="{$r[title]}"></div>

                                            <div class="txt">

                                                <h6>{$r[title]}</h6>

                                                <p>Professional designer</p>

                                            </div>

                                            <div style="clear: both"></div>

                                        </a>

                                    </li>

                                    {/if}

                                    {/loop}

                                    {/pc}



                                </ul>

                            </div>

                            <div class="next"></div>

                        </div>

                        <div class="bd">

                            <ul>

                                {pc:content action="lists" catid="187" num="4" order="listorder desc" page="$page" moreinfo="1"}

                                {if empty($data)}

                                <li>

                                    <a>

                                        <div class="img"><img src="{EX_PATH}images/ins-team_03.jpg" alt=""></div>

                                        <div class="txt">

                                            <h6>Eason1</h6>

                                            <span>Professional designer</span>

                                            <b></b>

                                            <p>In 1995, he officially debuted in the 14th Rookie Song Contest. In 1996, he released his debut album "Eason Chan".

                                                In 1997, he starred in his first movie "Mong Kok Everyone". In 1998,

                                                he won the attention in the music world with the song "The World Unparalleled".</p>

                                        </div>

                                        <div style="clear: both"></div>

                                    </a>

                                </li>

                                <li>

                                    <a>

                                        <div class="img"><img src="{EX_PATH}images/ins-team_03.jpg" alt=""></div>

                                        <div class="txt">

                                            <h6>Eason2</h6>

                                            <span>Professional designer</span>

                                            <b></b>

                                            <p>In 1995, he officially debuted in the 14th Rookie Song Contest. In 1996, he released his debut album "Eason Chan".

                                                In 1997, he starred in his first movie "Mong Kok Everyone". In 1998,

                                                he won the attention in the music world with the song "The World Unparalleled".</p>

                                        </div>

                                        <div style="clear: both"></div>

                                    </a>

                                </li>

                                <li>

                                    <a>

                                        <div class="img"><img src="{EX_PATH}images/ins-team_03.jpg" alt=""></div>

                                        <div class="txt">

                                            <h6>Eason3</h6>

                                            <span>Professional designer</span>

                                            <b></b>

                                            <p>In 1995, he officially debuted in the 14th Rookie Song Contest. In 1996, he released his debut album "Eason Chan".

                                                In 1997, he starred in his first movie "Mong Kok Everyone". In 1998,

                                                he won the attention in the music world with the song "The World Unparalleled".</p>

                                        </div>

                                        <div style="clear: both"></div>

                                    </a>

                                </li>

                                <li>

                                    <a>

                                        <div class="img"><img src="{EX_PATH}images/ins-team_03.jpg" alt=""></div>

                                        <div class="txt">

                                            <h6>Eason4</h6>

                                            <span>Professional designer</span>

                                            <b></b>

                                            <p>In 1995, he officially debuted in the 14th Rookie Song Contest. In 1996, he released his debut album "Eason Chan".

                                                In 1997, he starred in his first movie "Mong Kok Everyone". In 1998,

                                                he won the attention in the music world with the song "The World Unparalleled".</p>

                                        </div>

                                        <div style="clear: both"></div>

                                    </a>

                                </li>

                                {else}

                                {loop $data $r}

                                <li>

                                    <a>

                                        <div class="img"><img src="{$r[thumb]}" alt="{$r[title]}"></div>

                                        <div class="txt">

                                            <h6>{$r[title]}</h6>

                                            <span>Professional designer</span>

                                            <b></b>

                                            {$r[content]}

                                        </div>

                                        <div style="clear: both"></div>

                                    </a>

                                </li>

                                {/if}

                                {/loop}

                                {/pc}

                            </ul>

                        </div>

                        <div style="clear: both;"></div>

                    </div>

                </div>

            </div>

            <div class="factory">

                <div class="container">

                    <div class="tit">

                        <h5>Factory</h5>

                        <b></b>

                    </div>





                    <div class="swiper-container-factory">

                        <div class="swiper-wrapper layer-photos-demo" id="layer-photos-demo">

                            {pc:content action="lists" catid="188" num="" order="listorder desc" page="$page" moreinfo="1"}

                            {if empty($data)}

                            <div class="swiper-slide">

                                <div class="list">

                                    <div class="box" >

                                        <div class="img-box" >

                                            <img src="{EX_PATH}images/factory_03.jpg" alt="">

                                        </div>

                                        <div class="masking">

                                            <img src="{EX_PATH}images/factory-masking_03.png" alt="" layer-pid="图片id，可以不写" layer-src="{EX_PATH}images/factory_03.jpg">

                                        </div>

                                    </div>

                                </div>

                                <p>photo name</p>

                            </div>



                            <div class="swiper-slide">

                                <div class="list">

                                    <div class="box" >

                                        <div class="img-box" >

                                            <img src="{EX_PATH}images/factory_03.jpg" alt="">

                                        </div>

                                        <div class="masking">

                                            <img src="{EX_PATH}images/factory-masking_03.png" alt="" layer-pid="图片id，可以不写" layer-src="{EX_PATH}images/factory_03.jpg">

                                        </div>

                                    </div>

                                </div>

                                <p>photo name</p>

                            </div>



                            <div class="swiper-slide">

                                <div class="list">

                                    <div class="box" >

                                        <div class="img-box" >

                                            <img src="{EX_PATH}images/factory_03.jpg" alt="">

                                        </div>

                                        <div class="masking">

                                            <img src="{EX_PATH}images/factory-masking_03.png" alt="" layer-pid="图片id，可以不写" layer-src="{EX_PATH}images/factory_03.jpg">

                                        </div>

                                    </div>

                                </div>

                                <p>photo name</p>

                            </div>

                            <div class="swiper-slide">

                                <div class="list">

                                    <div class="box" >

                                        <div class="img-box" >

                                            <img src="{EX_PATH}images/factory_03.jpg" alt="">

                                        </div>

                                        <div class="masking">

                                            <img src="{EX_PATH}images/factory-masking_03.png" alt="" layer-pid="图片id，可以不写" layer-src="{EX_PATH}images/factory_03.jpg">

                                        </div>

                                    </div>

                                </div>

                                <p>photo name</p>

                            </div>

                            {else}

                            {loop $data $r}



                            <div class="swiper-slide">

                                <div class="list">

                                    <div class="box" >

                                        <div class="img-box" >

                                            <img src="{$r[thumb]}" alt="{$r[title]}">

                                        </div>

                                        <div class="masking">

                                            <img src="{EX_PATH}images/factory-masking_03.png" alt="" layer-pid="图片id，可以不写" layer-src="{$r[thumb]}">

                                        </div>

                                    </div>

                                </div>

                                <p>{$r[title]}</p>

                            </div>

                            {/if}

                            {/loop}

                            {/pc}

                        </div>

                    </div>

                    <script>

                        layer.photos({

                            photos: '#layer-photos-demo .masking'

                            ,anim: 5

                        });

                        var swiper = new Swiper('.swiper-container-factory', {

                            slidesPerView: 4,

                            spaceBetween: 25,

                            loop:true,

                            autoplay:5000,

                            // init: false,

                            breakpoints: {

                                1024: {

                                    slidesPerView: 3,

                                    spaceBetween: 30,

                                },

                                768: {

                                    slidesPerView: 3,

                                    spaceBetween: 30,

                                },

                                640: {

                                    slidesPerView: 2,

                                    spaceBetween: 20,

                                },

                                320: {

                                    slidesPerView: 1,

                                    spaceBetween: 10,

                                }

                            }

                        });

                    </script>

                </div>

            </div>

            <div class="Certificate">

                <div class="container">

                    <div class="tit">

                        <h5>Certificate</h5>

                        <b></b>

                    </div>

                    <div class="swiper-container-honor">

                        <div class="swiper-wrapper layer-photos-demo" id="layer-photos-demo2">

                            {pc:content action="lists" catid="189" num="" order="listorder desc" page="$page" moreinfo="1"}

                            {if empty($data)}

                            <div class="swiper-slide">

                                <img src="{EX_PATH}images/honor_03.jpg" alt="" layer-pid="图片id，可以不写" layer-src="{EX_PATH}images/honor_03.jpg">

                            </div>



                            <div class="swiper-slide">

                                <img src="{EX_PATH}images/honor_03.jpg" alt="" layer-pid="图片id，可以不写" layer-src="{EX_PATH}images/honor_03.jpg">

                            </div>



                            <div class="swiper-slide">

                                <img src="{EX_PATH}images/honor_03.jpg" alt="" layer-pid="图片id，可以不写" layer-src="{EX_PATH}images/honor_03.jpg">

                            </div>



                            <div class="swiper-slide">

                                <img src="{EX_PATH}images/honor_03.jpg" alt="" layer-pid="图片id，可以不写" layer-src="{EX_PATH}images/honor_03.jpg">

                            </div>

                            {else}

                            {loop $data $r}

                            <div class="swiper-slide">

                                <img src="{$r[thumb]}" alt="" layer-pid="图片id，可以不写" layer-src="{$r[thumb]}">

                            </div>

                            {/if}

                            {/loop}

                            {/pc}

                        </div>

                    </div>

                    <script>

                        layer.photos({

                            photos: '#layer-photos-demo2'

                            ,anim: 5

                        });

                        var swiper = new Swiper('.swiper-container-honor', {

                            slidesPerView: 4,

                            spaceBetween: 25,

                            loop:true,

                            autoplay:5000,

                            // init: false,

                            breakpoints: {

                                1024: {

                                    slidesPerView: 3,

                                    spaceBetween: 30,

                                },

                                768: {

                                    slidesPerView: 3,

                                    spaceBetween: 30,

                                },

                                640: {

                                    slidesPerView: 2,

                                    spaceBetween: 20,

                                },

                                320: {

                                    slidesPerView: 1,

                                    spaceBetween: 10,

                                }

                            }

                        });

                    </script>

                </div>

            </div>

            <div class="about-bot">

                <div class="container">

                    <div class="map">

                        <div id="wrap" class="my-map">

                            <div id="mapContainer"></div>

                        </div>

                        <script src="http://webapi.amap.com/maps?v=1.3&key=8325164e247e15eea68b59e89200988b"></script>

                        <script>



                            !function(){

                                var infoWindow, map, level = 14,

                                        center = {lng: 114.286764, lat: 22.741397},

                                        features = [{type: "Marker", name: "Shenzhen En Xiao Technology Co.,ltd", desc: "5th Floor, Block B, Fenghua Industrial Park, Longgang District, Shenzhen, China", color: "red", icon: "cir", offset: {x: -9, y: -31}, lnglat: {lng: 114.286764, lat: 22.741397}}];



                                function loadFeatures(){

                                    for(var feature, data, i = 0, len = features.length, j, jl, path; i < len; i++){

                                        data = features[i];

                                        switch(data.type){

                                            case "Marker":

                                                feature = new AMap.Marker({ map: map, position: new AMap.LngLat(data.lnglat.lng, data.lnglat.lat),

                                                    zIndex: 3, extData: data, offset: new AMap.Pixel(data.offset.x, data.offset.y), title: data.name,

                                                    content: '<div class="icon icon-' + data.icon + ' icon-'+ data.icon +'-' + data.color +'"></div>' });

                                                break;

                                            case "Polyline":

                                                for(j = 0, jl = data.lnglat.length, path = []; j < jl; j++){

                                                    path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[j].lat));

                                                }

                                                feature = new AMap.Polyline({ map: map, path: path, extData: data, zIndex: 2,

                                                    strokeWeight: data.strokeWeight, strokeColor: data.strokeColor, strokeOpacity: data.strokeOpacity });

                                                break;

                                            case "Polygon":

                                                for(j = 0, jl = data.lnglat.length, path = []; j < jl; j++){

                                                    path.push(new AMap.LngLat(data.lnglat[j].lng, data.lnglat[j].lat));

                                                }

                                                feature = new AMap.Polygon({ map: map, path: path, extData: data, zIndex: 1,

                                                    strokeWeight: data.strokeWeight, strokeColor: data.strokeColor, strokeOpacity: data.strokeOpacity,

                                                    fillColor: data.fillColor, fillOpacity: data.fillOpacity });

                                                break;

                                            default: feature = null;

                                        }

                                        if(feature){ AMap.event.addListener(feature, "click", mapFeatureClick); }

                                    }

                                }



                                function mapFeatureClick(e){

                                    if(!infoWindow){ infoWindow = new AMap.InfoWindow({autoMove: true}); }

                                    var extData = e.target.getExtData();

                                    infoWindow.setContent("<h5>" + extData.name + "</h5><div>" + extData.desc + "</div>");

                                    infoWindow.open(map, e.lnglat);

                                }



                                map = new AMap.Map("mapContainer", {center: new AMap.LngLat(center.lng, center.lat), level: level});

                                map.setLang("en");

                                loadFeatures();



                                map.on('complete', function(){

                                    map.plugin(["AMap.ToolBar", "AMap.OverView", "AMap.Scale"], function(){

                                        map.addControl(new AMap.ToolBar);

                                        map.addControl(new AMap.OverView({isOpen: true}));

                                        map.addControl(new AMap.Scale);

                                    });

                                })



                            }();



                        </script>

                    </div>

                    <div class="bot-box">

                        <div class="contact">

                            <h6>{$bl[name]}</h6>

                            <p>Tel: {$bl[tel]}</p>

                            <p>WhatsApp: {$bl[phone]}</p>

                            <p>Skype: {$bl[skype]}</p>

                            <p>Email: {$bl[email]}</p>

                            <p>Web: <a href="http://{$bl[web]}">{$bl[web]}</a> </p>

                            <p>Address: {$bl[address]}</p>

                        </div>

                        <div class="message">

                            <h6>Leave a message</h6>

                            <form>

                                <ul>

                                    <li><span>Name<sup>*</sup></span><input type="text" class="txt" id="name" name="name"></li>

                                    <li><span>&nbsp;&nbsp;Tel<sup>*</sup></span><input type="text" class="txt" id="tel" name="tel"></li>

                                </ul>

                                <ul>

                                    <li><span>Email<sup>*</sup></span><input type="text" class="txt" id="email" name="email"></li>

                                </ul>

                                <ul>

                                    <li><span>Message</span><textarea name="content" id="content" cols="30" rows="10"></textarea></li>

                                </ul>

                                <ul>

                                    <li><input type="button" id="tijiao" value="Submit" class="submit"></li>

                                </ul>

                            </form>

                        </div>

                        <div style="clear: both;"></div>

                    </div>



                </div>

            </div>

        </div>



    </div>



</div>



{template "content","footer"}

<script src="{PLUGIN_STATICS_PATH}layer/layer.js"></script>

<script>

    $("#tijiao").click(function(){

        var name = $("#name").val();



        var tel = $("#tel").val();

        var email = $("#email").val();

        var content = $("#content").val();



        if(name=="" ){

            layer.msg('please enter your name');

            return false;

        }



        if(tel.search(/^([0-9]{11})?$/) == -1 || tel == ""){

            layer.msg('Please enter 11 correct phone numbers');

            return false;

        }

        if(email.search( /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/) == -1 || email == ""){

            layer.msg('Please enter the correct email address');

            return false;

        }





        $.post('/index.php?m=guestbook&c=index&a=init',{name:name,tel:tel,email:email,content:content},function(msg){

            //alert(m);

            layer.msg(msg.title, {time: msg.time, icon:msg.icon},function(){

                if(msg.code==2000){

                    window.location.reload()

                }else{

                    window.location.reload()

                }

            });

        },'json');

    })

</script>