@extends('layouts.base')
@section('nav-active-shop') nav-current @endsection
@section('content')
<style>
.mobile-nav,.mobile-logo{display:none !important;}
.layout_style01,.layout_style02{width:92%;max-width:1200px;margin:0 auto;}
.layout_style01{ max-width: 1470px; }
.layout_style02{ max-width: 1020px;}
.slider_banner .banner_item_img .bg{ min-height: 500px;}
.slider_banner .banner_item_img .layout{ }
.slider_banner .banner_item_img .info{ position: absolute; left: 0; top: 0;width:100%; height: 100%; text-align: left; display: flex;align-items: center;}
.slider_banner .banner_item_img .title{position:relative;color: #f33f06; font-size: 28px; text-transform:uppercase;padding: 17px 0; line-height: 1.1;}
.slider_banner .banner_item_img .title strong{ display: block; font-size: 56px; font-weight: bold;}
.slider_banner .banner_item_img .title:after{ content: ""; width: 360px; height: 2px; background-color: #f33f06; position: absolute;left: 0; bottom: 0;}
.slider_banner .banner_item_img .text{position:relative; margin: 23px 0 5px; display: inline-block; font-family:"Microsoft YaHei UI Light"; font-size: 18px; line-height: 1.3;width: 525px;max-width:100%;}
.slider_banner .banner_item_img ul{position:relative;display:flex;justify-content: flex-start;flex-wrap: wrap;}
.slider_banner .banner_item_img ul li{margin:8px 8px 0 0 ;}
.slider_banner .banner_item_img ul li img{max-width: 170px; width:auto; height: auto; min-height: auto;}
/*shopk_wrap_els*/
.shopk_wrap_els{padding: 27px 0 0;}
.shopk_items_els{ justify-content: center;}
.shopk_item_els{position: relative;display: flex;align-items: center; justify-content: center; width: 313px; padding: 50px 2%; margin:18px 22px; text-align: center;box-shadow:0 0 10px rgba(0,0,0,.1)}
.shopk_item_els .item_img{ margin-bottom: 40px; }
.shopk_item_els .item_img img{max-width: 130px;}
.shopk_item_els:hover .item_img img{-webkit-animation:swing .9s ease;-o-animation:swing .9s ease;animation:swing .9s ease;}
.shopk_item_els p{font-family:"Microsoft YaHei UI Light"; font-size: 18px; line-height: 1.2;}
.shopk_item_els p strong{font-family:Arial, Helvetica, sans-serif;line-height: 1.2;}
/*index_earn_step*/
.index_work_step{}
.work_step_els{padding-top: 11px;}
.work_step_els .layout{display: flex;justify-content: center;flex-wrap: wrap;}
.work_step_els .step_img{margin-right: 1.2%;width:63%}
.work_step_els .step_img img{}
.step_items_els{margin-top: 20px;width:35.8%}
.step_item_els{ position: relative;display: flex;justify-content: center;align-items:flex-end;padding: 18px 0; }
.step_item_els .item_img{margin-right: 16px;}
.step_item_els .item_img img{width: 163px;}
.step_item_els .item_info{ width: 250px;}
.step_item_els .item_info .item_title{ font-size: 20px; font-weight: normal; }
.step_item_els .item_info .item_text{ }
/*index_download*/
.index_download{}
.index_download .bg{ position: relative; width: 100%;}
.index_download .layout_style01{ }
.index_download .info{ position: absolute; right: 0; top: 0;width:100%;text-align: right;padding: 58px 0;}
.index_download .title{position:relative;color: #f33f06; font-size: 46px; text-transform:uppercase;padding: 17px 0;}
.index_download .title:after{ content: ""; width: 360px; height: 2px; background-color: #f33f06; position: absolute;right: 0; bottom: 0;}
.index_download .text{position:relative; margin: 13px 0 30px; display: inline-block; font-family:"Microsoft YaHei UI Light"; font-size: 18px; line-height: 1.3;width: 520px;max-width:100%; text-align: right;}
.index_download ul{position:relative;display:flex;justify-content: flex-end;flex-wrap: wrap;}
.index_download ul li{margin:8px 0 0 8px;}
.index_download ul li img{max-width: 170px;}
@media only screen and (max-width:950px){
.index_download .title{ font-size: 36px;}
.work_step_els .step_img{margin: 0 auto;width:100%;}
.step_items_els{width: 100%;display: flex;flex-wrap: wrap;justify-content: center;}
.step_item_els{ width: 313px;align-items:flex-start;;flex-wrap: wrap; text-align: center;justify-content: center;margin: 0 22px;}
.step_item_els .item_img{ margin: 0 0 15px;}
.step_item_els .item_info .item_text{width: 100%;}
.index_download .bg{opacity:.1;height:500px; width: auto; max-width: none;}
.index_download .info{ text-align: center;}
.index_download .title:after{ display: none;}
.index_download ul{justify-content: center;}
.index_download .text{ width: 100%; text-align: center;}
}
@media only screen and (max-width:640px) {
.index_download .title{ font-size: 28px;;}
.slider_banner .banner_item_img .info{ text-align: center;}
.slider_banner .banner_item_img .title,.slider_banner .banner_item_img .text{width: 100%;}
.slider_banner .banner_item_img .title{ font-size: 22px;}
.slider_banner .banner_item_img .title strong{ font-size: 32px;;}
.slider_banner .banner_item_img .bg{opacity:.1;}
.slider_banner .banner_item_img ul{justify-content: center;}
.slider_banner .banner_item_img ul li img,.index_download ul li img{max-width: 150px;}
.slider_banner .banner_item_img .title:after{ display: none;}
.slider_banner .banner_item_img .title strong{margin-bottom: 10px;}
}
@media only screen and (max-width:480px){
.shopk_item_els{width: 100%; border: none; }
}
</style>
<div class="web_main index_main">
<!-- banner -->
<section class="slider_banner">
<ul class="swiper-wrapper">
<li class="swiper-slide">
<div class="banner_item_img">
<div>
<img class="bg" src="/style/template/img/demo/banner01.jpg" alt="" />
<div class="info">
<div class="layout_style02">
<h2 class="title wow fadeInLeftA" data-wow-delay=".1s" data-wow-duration=".8s">
<strong>SHOPK</strong> TRUSTED ONLINE Dropshipping APP</h2>
<div class="text wow fadeInLeftA" data-wow-delay=".2s" data-wow-duration=".8s">Empowering millions of mothers, students, KOLs and others who just
simply wanna do side hustles at home and become
economically independent. </div>
<ul class="wow fadeInLeftA" data-wow-delay=".3s" data-wow-duration=".8s">
<!-- <li><a href="javascript:"><img src="/style/template/img/demo/ico01.jpg" /></a></li> -->
<li><a href="https://play.google.com/store/apps/details?id=uni.UNIECA288E"><img src="/style/template/img/demo/ico02.jpg" /></a></li>
<li><a href="/shopk.apk"><img src="/style/template/img/demo/ico03.jpg" /></a></li>
</ul>
</div>
</div>
</div>
</div>
</li>
</ul>
<div class="swiper-control index_swiper_control">
<div class="swiper-buttons">
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
<div class="swiper-pagination"></div>
</div>
</section>
<section class="shopk_wrap_els">
<div class="layout">
<ul class="shopk_items_els flex_row">
<li class="shopk_item_els wow fadeInUpA" data-wow-delay=".1s" data-wow-duration=".8s">
<div class="item_wrap">
<div class="item_img"><img src="/style/template/img/demo/ico06.png"></div>
<p><strong>9 Warehouses </strong></p>
<p>all over the world</p>
</div>
</li>
<li class="shopk_item_els wow fadeInUpA" data-wow-delay=".2s" data-wow-duration=".8s">
<div class="item_wrap">
<div class="item_img"><img src="/style/template/img/demo/ico07.png"></div>
<p>Empowering <strong>1 million+ </strong></p>
<p>KOLs and their friends/fans</p>
</div>
</li>
<li class="shopk_item_els wow fadeInUpA" data-wow-delay=".3s" data-wow-duration=".8s">
<div class="item_wrap">
<div class="item_img"><img src="/style/template/img/demo/ico08.png"></div>
<p>Strict <strong>quality control</strong></p>
<p>+</p>
<p>Excellent <strong>logistics service</strong></p>
</div>
</li>
</ul>
</div>
</section>
<!-- index_work_step -->
<section class="index_work_step index_layer">
<div class="index_title_bar wow fadeInUpA" data-wow-delay=".1s" data-wow-duration=".8s">
<h1 class="title">HOW SHOPK WORKS ?</h1>
</div>
<div class="work_step_els">
<div class="layout ">
<div class="step_img wow fadeInLeftA" data-wow-delay=".1s" data-wow-duration=".8s">
<img src="/style/template/img/demo/pic01_1.png" />
</div>
<ul class="step_items_els">
<li class="step_item_els wow fadeInUpA" data-wow-delay=".1s" data-wow-duration=".8s">
<div class="item_img"><img src="/style/template/img/demo/ico01.png" /></div>
<div class="item_info">
<h2 class="item_title">Sign In</h2>
<div class="item_text">Join the ShopK Dropshipping Program</div>
</div>
</li>
<li class="step_item_els wow fadeInUpA" data-wow-delay=".2s" data-wow-duration=".8s">
<div class="item_img"><img src="/style/template/img/demo/ico02.png" /></div>
<div class="item_info">
<h2 class="item_title">Recommend or Share</h2>
<div class="item_text">Simply share a QR code or a link of product to your friends/fans</div>
</div>
</li>
<li class="step_item_els wow fadeInUpA" data-wow-delay=".3s" data-wow-duration=".8s">
<div class="item_img"><img src="/style/template/img/demo/ico03.png" /></div>
<div class="item_info">
<h2 class="item_title">CHECK</h2>
<div class="item_text">Check your profit margin</div>
</div>
</li>
</ul>
</div>
</div>
</section>
<!-- index_screenshots -->
<section class="index_screenshots index_layer">
<div class="index_title_bar wow fadeInUpA" data-wow-delay=".1s" data-wow-duration=".8s">
<h1 class="title">Screenshots</h1>
</div>
<div class="screenshots wow fadeInUpA" data-wow-delay=".3s" data-wow-duration=".8s">
<img src="/style/template/img/demo/pic02.jpg" />
</div>
</section>
<section class="index_download index_layer">
<img class="bg" src="/style/template/img/demo/pic03_1.png" />
<div class="info">
<div class="layout_style01 wow fadeInUpA" data-wow-delay=".3s" data-wow-duration=".8s">
<h2 class="title">Download SHOPK App Today!</h2>
<!-- <div class="text">Empowering millions of mothers, students, and others who just -->
<!--simply wanna do side hustles at home to earn online and become -->
<!--economically independent. </div> -->
<ul>
<!--
<li><a href="javascript:"><img src="/style/template/img/demo/ico01.jpg" /></a></li>-->
<li><a href="https://play.google.com/store/apps/details?id=uni.UNIECA288E"><img src="/style/template/img/demo/ico02.jpg" /></a></li>
<li><a href="/shopk.apk"><img src="/style/template/img/demo/ico03.jpg" /></a></li>
</ul>
</div>
</div>
</section>
</div>
@endsection
@section('footer')
<script src="https://www.shopk.com/style/template/js/jquery.min.js"></script>
<script src="https://www.shopk.com/style/template/js/common.js"></script>
<script src="https://www.shopk.com/style/template/js/public.js"></script>
@endsection