@extends('style.master')

@section('page_title','首頁')

@section('page_style')
<link href="{{ url('/css/onepage.css') }}" rel="stylesheet" type="text/css" />
@endsection

@section('page_content')



<!-- "owl-carousel" -->
<div id="owl-slider" class="owl-carousel owl-theme">
	<!-- slider item1 -->
	<a href="{{ url('storefront') }}">
		<div class="item1 item">
			<div class="row row-rwd-padding align-items-center align-items1-center">
				<div class="col-md-12">

					<div class="row  margin-left-10">
						<div class="col-lg-11 col-lg-offset-1 col-md-12 col-sm-12 margin-bottom-30">
							<p class="light_heavy_70_shadowed animate__animated animate__bounce title" style="margin-bottom:0px">
								<span>Make</span>
							</p>
							<p class="large_text animate__animated animate__fadeInRight animate__fast animate__delay-1s title">
								Every Web Page<span style="color: #FF9800">&nbsp;SHOPPABLE</span></p>
						</div>
						<div class="col-lg-11 col-lg-offset-1 col-md-12 col-sm-12 large_text">
							<p class="animate__animated animate__fadeInRight animate__delay-2s margin-bottom-20 p1" style="margin-bottom:0px">小生意在多種應用情境支援下</p>
							<p class="animate__animated animate__fadeInRight animate__delay-3s p1" style="margin-bottom:0px">才能異軍突起做到大空間</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</a>

	<!-- /slider item1 -->

	<!-- slider item2 -->

	<a href="{{ url('about') }}">
		<div class="item2 item">
			<div class="row row-rwd-padding align-items-center">
				<div class="col-md-12">
					<div class="row  margin-left-10">
						<div class="col-md-11 col-md-offset-1 col-sm-11 col-sm-offset-1 light_heavy_70_shadowed animate__animated animate__faster">
							<p class="animate__animated animate__faster" style="margin-bottom:0px">What is CaaS ?</p>
						</div>
						<div class="col-md-11 col-md-offset-1 col-sm-11 col-sm-offset-1 black_thin_blackbg_30 animate__animated animate__fast item2-animate-2" style="color: #ffcd58;  white-space: normal; text-shadow:none;">
							<strong>Commerce as a Service</strong><br>
						</div>
						<div class="col-md-11 col-md-offset-1 col-sm-11 col-sm-offset-1 not-get-star item2-animate-3">
							<p class="animate__animated">電商時代開展</p>
							<div class="d-flex">
								<p class="span-text margin-right-20 animate__delay-1s">零門檻</p>
								<p class="span-text animate__delay-2s">超簡便</p>
							</div>

							<p class="animate__animated animate__delay-3s">數位營銷與網路行銷的雲端平台工具</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</a>
	<!-- /slider item2 -->

	<!-- slider item3 -->
	<a href="{{ url('price') }}">
		<div class="item3 item">
			<div class="row row-rwd-padding align-items-center">
				<div class="col-md-12">
					<div class="row margin-left-10">
						<div class="col-md-6 col-md-offset-6 col-sm-6 col-sm-offset-6 subtitle margin-bottom-10 animate__animated animate__faster">
							<p>新型態電商服務</p>
						</div>
						<div class="col-md-6 col-md-offset-6 col-sm-6 col-sm-offset-6 light_heavy_70_shadowed animate__animated animate__fast">
							<p>網頁即店面</p>
							<p>導購最直接</p>

						</div>
						<div class="div3 col-md-6 col-md-offset-6 col-sm-6 col-sm-offset-6 large_text grasp-title animate__animated">
							<p>讓您降低營銷成本</p>
						</div>
						<div class="col-md-6 col-md-offset-6 col-sm-6 col-sm-offset-6 large_text grasp-title animate__animated">
							<p>提高網購轉換率</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</a>

	<!-- /slider item3 -->

	<!-- slider item4 -->
	<a href="{{ url('/#productsServices') }}">
		<div class="item4 item">
			<div class="row row-rwd-padding align-items-center align-items-center col-padding">
				<div class="col-md-12">
					<div class="row  margin-left-10">
						<div class="col-md-10 col-md-offset-2 col-sm-11 col-sm-offset-1 animate__animated animate__faster">
							<p class="item4-black-thin-blackbg-30">多元性營銷通路 VS 多樣化商模式</p>
						</div>
						<div class="col-md-6 col-md-offset-2 col-sm-11 col-sm-offset-1  large-text-purple animate__animated animate__fast">
							<p>最能滿足您虛實整合</p>
						</div>

						<div class="col-md-6 col-md-offset-2">
						</div>
						<div class="col-md-6 col-md-offset-2">
						</div>
						<div class="col-md-6 col-md-offset-2 col-sm-11 col-sm-offset-1  item4-large-text animate__animated">
							<p>彈性變化的</p>
							<p>行銷策略 / 價格策略</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</a>
	<!-- /slider item4 -->
</div>
<!-- /"owl-carousel" -->

<!-- 活動 -->

<section id="campaign">
	<div class="container margin-bottom-50">
	</div>
	<div class="container">
		<div class="d-title">
			<p class="title">最新活動</p>
		</div>
	</div>
	<div class="container">
		<div class="campaign row">
			<div class="col-md-6 margin-bottom-60">
				<div class="card">
					<a href="{{ url('/campaign_318') }}" target="_blank">
						<img src="images/campaign/EDM318/edm311_w532.jpg" alt="CaaS" class="img-fluid">
					</a>
				</div>
			</div>
			<div class="col-md-6 margin-bottom-60">
				<div class="card">
						<img src="images/campaign/EDM318/campaign_535black3.jpg" alt="CaaS" class="img-fluid">
				</div>
			</div>
		</div>

	</div>

</section>

<!-- 活動 -->

<!-- CaaS 簡介 -->

<section id="Introduction">
	<div class="container margin-bottom-50">
		<div class="heading-title heading-line-double text-center">
			<h2>什麼是CaaS?</h2>
		</div>
	</div>
	<div class="container">
		<div class="Introduction row" data-aos="fade-right" data-aos-duration="800">
			<div class="col-md-12 margin-bottom-60 card-box-1">
				<div class="card">
					<div class="row">
						<div class="col-sm-5 col-md-4 bg-img">
							<div class="background-img-c"></div>
						</div>
						<div class="col-sm-7 col-md-8">
							<div class="card-body">
								<div class="prod-ser-text d-flex">
									新型態的電子商務解決方案，容易與客戶既有網路資源整合
								</div>
								<div class="text-box text-box-1 margin-bottom-20">
									<p>- 提供多種服務模式：自架平台、雲端服務、行銷整合、客製開發</p>
									<p>- 可追蹤分析客戶行為</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="col-md-12 margin-bottom-60 card-box-2">
				<div class="card">
					<div class="row" data-aos="fade-left" data-aos-duration="800">
						<div class="col-sm-5 col-md-4 bg-img">
							<div class="background-img-a"></div>
						</div>
						<div class="col-sm-7 col-md-8">
							<div class="card-body">
								<div class="prod-ser-text d-flex">
									活動、促銷式的線上銷售工具
								</div>
								<div class="text-box margin-bottom-20">
									<p>- 賣家自訂優惠方案</p>
									<p>- 自訂商品型錄，易於分隔客戶、管理市場價格</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="col-md-12 margin-bottom-60 card-box-3">
				<div class="card">
					<div class="row" data-aos="fade-right" data-aos-duration="800">
						<div class="col-sm-5 col-md-4 bg-img">
							<div class="background-img-b"></div>
						</div>
						<div class="col-sm-7 col-md-8">
							<div class="card-body">
								<div class="prod-ser-text d-flex">
									特別適用於內容電商、社群行銷
								</div>
								<div class="text-box margin-bottom-20">
									<p>- 後台統一控管的電商貼片，可直接嵌入網頁</p>
									<p>- 一頁式購物網頁，可透過社群工具分享、導流</p>
									<p>- 支援SEO</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>

		</div>

	</div>

</section>

<!-- /CaaS 簡介 -->

<!-- CaaS內容行銷 vs 典型搜尋行銷 -->

<section id="marketing">
	<div class="container">
		<div class="row">
			<div class="col-sm-6 col-md-6">
				<div class="left-box">
					<div class="row">
						<div class="col-md-8 col-md-offset-2 position-relative">
							<div class="img-box" data-aos="fade-right" data-aos-duration="800">
								<div class="img-div">
									<img src="images/onepage/marketing/img-shopping_nb_cart.gif" alt="CaaS" class="img-fluid">
								</div>
								<div class="img-cart-woman leftMove">
									<img src="images/onepage/marketing/cart-woman.svg" alt="CaaS" class="img-fluid">
								</div>
							</div>
						</div>
						<div class="col-md-8 col-md-offset-2 box-text" data-aos="fade-right" data-aos-duration="800">
							<div>
								<p class="card-title"> 傳統購物車、購物平台 </p>
							</div>
							<div>
								<ul>
									<li><i class="fa fa-check" aria-hidden="true"></i>連結導引至購物網站</li>
									<li><i class="fa fa-check" aria-hidden="true"></i>吸引、導流</li>
									<li><i class="fa fa-check" aria-hidden="true"></i>比價、瀏覽式銷售</li>
									<li><i class="fa fa-check" aria-hidden="true"></i>非忠誠客戶</li>
									<li><i class="fa fa-check" aria-hidden="true"></i>廣告媒體圈</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="col-sm-6 col-md-6">
				<div class="right-box">
					<div class="row">
						<div class="col-md-8 col-md-offset-2 position-relative">
							<div class="img-box" data-aos="fade-left" data-aos-duration="800">
								<div class="img-div">
									<img src="images/onepage/marketing/img-people.gif" alt="CaaS" class="img-fluid">
								</div>
								<div class="img-cart-woman rightMove">
									<img src="images/onepage/marketing/truck.svg" alt="CaaS" class="img-fluid">
								</div>
							</div>
						</div>
						<div class="col-md-8 col-md-offset-2 box-text" data-aos="fade-left" data-aos-duration="800">
							<div>
								<p class="card-title"> CaaS &ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;</p>
								<!-- <p>&ensp;</p> -->
							</div>
							<div>
								<ul>
									<li><i class="fa fa-check" aria-hidden="true"></i>購物車嵌入至內容</li>
									<li><i class="fa fa-check" aria-hidden="true"></i>推播、擴散</li>
									<li><i class="fa fa-check" aria-hidden="true"></i>主題式銷售</li>
									<li><i class="fa fa-check" aria-hidden="true"></i>精準受眾</li>
									<li><i class="fa fa-check" aria-hidden="true"></i>協銷生態系</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>

		</div>

	</div>
</section>

<!-- /CaaS內容行銷 vs 典型搜尋行銷 -->

<!-- Product -->

<section id="product" class="prod-ser-bg-color">
	<div class="container">
		<!--公有雲-->
		<div class="row margin-bottom-50 margin-top-100">
			<div class="prod-ser-tit">CaaS快閃店 / 公有雲服務</div>
			<div class="col-md-4 col-sm-12 col-xs-12">
				<div class="d-flex-center" data-aos="flip-left">
					<i class="ico-color ico-lg ico-rounded ico-hover fa fa-cloud"></i>
				</div>
				<div class="prod-ser-text">新型態電商高性價比的雲服務</div>
				<div class="prod-ser-box">
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="免架站、簽約．註冊開通即可使用"></div>
						<span>免架站、簽約．註冊開通即可使用</span>
						<div class="clear"></div>
					</div>
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="最適合中小企業的電商方案．個人也可開店"></div>
						<span>最適合中小企業的電商方案．個人也可開店</span>
						<div class="clear"></div>
					</div>
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="沒有租期限制．短租特賣促銷最好用"></div>
						<span>沒有租期限制．短租特賣促銷最好用</span>
						<div class="clear"></div>
					</div>
				</div>
			</div>
			<div class="col-md-4 col-sm-12 col-xs-12">
				<div class="d-flex-center" data-aos="flip-left" data-aos-delay="180">
					<i class="ico-color ico-lg ico-rounded ico-hover fa fa-thumbs-up"></i>
				</div>
				<div class="prod-ser-text">自主管理 不受限制</div>
				<div class="prod-ser-box">
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="沒有商品數量限制．一件商品也能開店"></div>
						<span>沒有商品數量限制．一件商品也能開店</span>
						<div class="clear"></div>
					</div>
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="店家擁有行銷、定價自主權．不會要求贊助行銷或改價"></div>
						<span>店家擁有行銷、定價自主權．不會要求贊助行銷或改價</span>
						<div class="clear"></div>
					</div>
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="賣家自訂商品型錄和優惠方案，易於分隔客戶、管理市場價格"></div>
						<span>賣家自訂商品型錄和優惠方案，易於分隔客戶、管理市場價格</span>
						<div class="clear"></div>
					</div>
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="充分掌握訂單、客戶名單、營銷報表"></div>
						<span>充分掌握訂單、客戶名單、營銷報表</span>
						<div class="clear"></div>
					</div>
				</div>
			</div>
			<div class="col-md-4 col-sm-12 col-xs-12">
				<div class="d-flex-center" data-aos="flip-left" data-aos-delay="150">
					<i class="ico-color ico-lg ico-rounded ico-hover fa fa-mobile"></i>
				</div>
				<div class="prod-ser-text">支援內容行銷<br>結合社群電商</div>
				<div class="prod-ser-box">
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="後台統一控管的電商貼片，創新嵌入式購物車"></div>
						<span>後台統一控管的電商貼片，創新嵌入式購物車</span>
						<div class="clear"></div>
					</div>
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="可直接嵌入網頁．植入既有產品官網、部落格文章"></div>
						<span>可直接嵌入網頁．植入既有產品官網、部落格文章</span>
						<div class="clear"></div>
					</div>
					<div class="prod-ser-box-in img-d-inlin">
						<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="提供一頁式商品購物網頁．可透過Line/IG/臉書分享導流"></div>
						<span>提供一頁式商品購物網頁．可透過Line/IG/臉書分享導流</span>
						<div class="clear"></div>
					</div>
				</div>
			</div>
		</div>
		<!-- /公有雲-->

		<!-- 私有雲-->
		<div id="privateCloud">
			<div class="row private-cloud-section">
				<div class="prod-ser-tit">企業新零售 / 數位營銷總部 / 私有雲服務</div>
				<div class="col-md-4 col-sm-12 col-xs-12">
					<div class="d-flex-center" data-aos="flip-left">
						<i class="ico-color ico-lg ico-rounded ico-hover fa fa-shopping-basket"></i>
					</div>
					<div class="prod-ser-text">營銷通路體系或<br>企業集團自建營銷平台</div>
					<div class="prod-ser-box">
						<div class="prod-ser-box-in img-d-inlin">
							<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="簡化客戶購買流程，加強「衝動購買」及「熟客回購」的體驗"></div>
							<span>簡化客戶購買流程，加強「衝動購買」及「熟客回購」的體驗</span>
							<div class="clear"></div>
						</div>
						<div class="prod-ser-box-in img-d-inlin">
							<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="採用 Headless Architecture 和 Commerce API 技術"></div>
							<span>採用 Headless Architecture 和 Commerce API 技術</span>
							<div class="clear"></div>
						</div>
						<div class="prod-ser-box-in img-d-inlin">
							<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="可客製多元風格的網頁店面，整合既有網站"></div>
							<span>可客製多元風格的網頁店面，整合既有網站</span>
							<div class="clear"></div>
						</div>
					</div>
				</div>
				<div class="col-md-4 col-sm-12 col-xs-12">
					<div class="d-flex-center" data-aos="flip-left" data-aos-delay="180">
						<i class="ico-color ico-lg ico-rounded ico-hover fa fa-sitemap"></i>
					</div>
					<div class="prod-ser-text">CaaS 支援多種商業模式</div>
					<div class="prod-ser-box">
						<div class="prod-ser-box-in img-d-inlin">
							<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="加盟分銷"></div>
							<span>加盟分銷</span>
							<div class="clear"></div>
						</div>
						<div class="prod-ser-box-in img-d-inlin">
							<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="協銷聯盟、團購主/網紅協銷分潤"></div>
							<span>協銷聯盟、團購主/網紅協銷分潤</span>
							<div class="clear"></div>
						</div>
						<div class="prod-ser-box-in img-d-inlin">
							<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="直銷體系銷售業績獎金"></div>
							<span>直銷體系銷售業績獎金</span>
							<div class="clear"></div>
						</div>
					</div>
				</div>
				<div class="col-md-4 col-sm-12 col-xs-12">
					<div class="d-flex-center" data-aos="flip-left" data-aos-delay="150">
						<i class="ico-color ico-lg ico-rounded ico-hover fa fa-pie-chart"></i>
					</div>
					<div class="prod-ser-text">企業自建式專屬數位營銷總部</div>
					<div class="prod-ser-box">
						<div class="prod-ser-box-in img-d-inlin">
							<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="支援 OMO 線上線下交互融合的銷售活動"></div>
							<span>支援 OMO 線上線下交互融合的銷售活動</span>
							<div class="clear"></div>
						</div>
						<div class="prod-ser-box-in img-d-inlin">
							<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="提供電子商務儀錶板，可進行用戶追蹤、分析數據"></div>
							<span>提供電子商務儀錶板，可進行用戶追蹤、分析數據</span>
							<div class="clear"></div>
						</div>
						<div class="prod-ser-box-in img-d-inlin">
							<div class="float-img"><img src="images/onepage/prod_ser_icon_gray.png" alt="直銷體系銷售業績獎金"></div>
							<span>直銷體系銷售業績獎金</span>
							<div class="clear"></div>
						</div>
					</div>
				</div>
			</div>
		</div>

	</div>
	<!-- /私有雲-->
	<!-- /Procuct -->
</section>



<!-- 加值服務 -->
<section id="addvalue">
	<div class="container Product-title">
		<div class="heading-title heading-line-double text-center">
			<h2>加值服務</h2>
		</div>
	</div>
	<div class="container">
		<div class="row text-center">
			<div class="prod-ser-tit">數位行銷需要大量宣傳與細緻導流，你的行銷夥伴與友軍在哪裡呢
				<i class="fa fa-question" data-aos="fade-up" data-aos-anchor-placement="top-bottom" data-aos-duration="900"></i>
			</div>
		</div>
	</div>
	<div class="container-fluit addvalue-left-bg">
		<div class="container">
			<div class="row">
				<div class="col-md-7 col-sm-7"></div>
				<div class="col-md-5 col-sm-12 right-text-bg">
					<p class="font-title">我們可以提供數位行銷媒體整合及合作夥伴</p>
					<p><i class="fa fa-bullseye"></i>推客： 聯盟行銷</p>
					<p><i class="fa fa-bullseye"></i>網紅 KOL 代言導流</p>
					<div class="social-network">
						<p><i class="fa fa-bullseye"></i>社群媒體 + 行銷企劃 </p>
						<div class="social-network-list">
							<p>－Facebook粉絲頁、社團、個人塗鴉牆</p>
							<p>－Line群組、Line@官方帳號</p>
							<p>－YouTube影片導流</p>
							<p>－IG網美、個性化社群</p>
						</div>
					</div>
					<p><i class="fa fa-bullseye"></i>eDM、網頁廣告推播</p>
					<p><i class="fa fa-bullseye"></i>GoogleMap 我的商家</p>
				</div>
			</div>

		</div>
		<!-- /加值服務 -->

</section>





@endsection