|
|
@@ -2,18 +2,19 @@
|
|
|
<div class="container">
|
|
|
<!-- banner -->
|
|
|
<VBanner :bannerData="bannerData"></VBanner>
|
|
|
+
|
|
|
<!-- 思维“芯”产品 -->
|
|
|
<div class="index-thinking">
|
|
|
<div class="i-t-content">
|
|
|
- <!-- <div class="t-top title-content">
|
|
|
- <div class="title-en">PRODUCT</div>
|
|
|
+ <div class="t-top title-content">
|
|
|
+ <!-- <div class="title-en">PRODUCT</div> -->
|
|
|
<div class="title-zh">
|
|
|
思维“芯”产品
|
|
|
</div>
|
|
|
- </div> -->
|
|
|
- <div class="thinking-content-box">
|
|
|
- <div class="thinking-cate-box">
|
|
|
- <ul class="thinking-cate-nav">
|
|
|
+ </div>
|
|
|
+ <div class="content-box thinking-content-box">
|
|
|
+ <div class="cate-box thinking-cate-box">
|
|
|
+ <ul class="cate-nav thinking-cate-nav">
|
|
|
<li class="thinking-products-kind" v-for="(item, index) in productCate" :class="{active:index == clickProdIndex}" :key="index" @click="getProdList(index)">
|
|
|
<nuxt-link to="/">
|
|
|
{{ item.title }}
|
|
|
@@ -21,13 +22,27 @@
|
|
|
<div class="line"></div>
|
|
|
</li>
|
|
|
</ul>
|
|
|
- <div class="thinking-cate-list">
|
|
|
+ <div class="cate-list thinking-cate-list">
|
|
|
<div class="thinking-product-item" v-for="(item, index) in productCate" :key="index">
|
|
|
- <div class="">
|
|
|
- <img src="~/assets/images/index/tab-right-pic-dg.png" alt="" srcset="">
|
|
|
+ <div class="thinking-product-item-img">
|
|
|
+ <nuxt-link to="/">
|
|
|
+ <img src="~/assets/images/index/tab-right-pic-dg.png" alt="" srcset="">
|
|
|
+ </nuxt-link>
|
|
|
+ <div class="product-tag">
|
|
|
+ 基础版
|
|
|
+ <!-- <img src="~/assets/images/index/product_tag.png" alt="" srcset=""> -->
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="thinking-product-info">
|
|
|
-
|
|
|
+ <div class="thinking-product-title">幼小衔接课程……</div>
|
|
|
+ <div class="thinking-product-content">
|
|
|
+ <div class="thinking-product-price">
|
|
|
+ ￥<span class="price-num">888</span>
|
|
|
+ </div>
|
|
|
+ <div class="thinking-product-btn">
|
|
|
+ 查看产品
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -36,243 +51,42 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- <!-- 品牌故事 -->
|
|
|
- <!-- <div id="index-story">
|
|
|
- <div class="i-s-contant">
|
|
|
- <div class="s-c-top">
|
|
|
- <div class="c-t-titleC"><h2>品牌故事</h2></div>
|
|
|
- <div class="c-t-titleE">Brand Story</div>
|
|
|
- <div class="c-t-description">爱，一个梦想，一生一世一个家</div>
|
|
|
- </div>
|
|
|
- <div class="s-c-bottom">
|
|
|
- <div class="story-bottom-detalis">
|
|
|
- <div class="bottom-detalis-title">
|
|
|
- <div class="bottom-detalis-titleC">
|
|
|
- <p class="detalis-titleC-first">我生怕辜负</p>
|
|
|
- <p class="detalis-titleC-sec">这个时代</p>
|
|
|
- </div>
|
|
|
- <div class="bottom-detalis-titleE">
|
|
|
- <p class="detalis-titleE-desc"> </p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="bottom-detalis-content">
|
|
|
- “这是最好的时代，也是最坏的时代”，100年前英国文学家狄更斯这样描述工业革命发生后的时代。如今时代又何尝不是如此呢？阶级被打破，边界在打破，跨界与创新，互联网让世界变得更加平等，每个人都有自己追求梦想的机会，以及成功的可能性......
|
|
|
- </div>
|
|
|
- <div class="bottom-detalis-more-box">
|
|
|
- <div class="bottom-detalis-more-img">
|
|
|
- <img src="~/assets/images/index/bottom-detalis-more-img.png">
|
|
|
- </div>
|
|
|
- <div class="bottom-detalis-more">
|
|
|
- <nuxt-link to="/brand">了解更多 ></nuxt-link>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="story-bottom-vedios">
|
|
|
- <indexVideo></indexVideo>
|
|
|
+ <!-- 网校课程 -->
|
|
|
+ <div class="index-course">
|
|
|
+ <div class="i-c-content">
|
|
|
+ <div class="c-top title-content">
|
|
|
+ <!-- <div class="title-en">PRODUCT</div> -->
|
|
|
+ <div class="title-zh">
|
|
|
+ 网校课程
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </div> -->
|
|
|
- <!-- 体验馆 -->
|
|
|
- <!-- <div id="index-experience">
|
|
|
- <div class="experience-content">
|
|
|
- <div class="experience-content-top">
|
|
|
- <div class="experience-content-top-titleC"><h2>体验馆</h2></div>
|
|
|
- <div class="experience-content-top-titleE">Experience Stores</div>
|
|
|
- <div class="experience-content-top-description">我们所有的努力，旨在打造一个宾至如归的理想状态</div>
|
|
|
- </div>
|
|
|
- <div class="experience-content-box">
|
|
|
- <div class="experience-place-container">
|
|
|
- <div class="experience-place-ul-box">
|
|
|
- <ul class="experience-place-nav">
|
|
|
- <li class="experience-place" v-for="(item,index) in experiencePlace" :key="index" :class="{active:index == num}" @click="tab(index)">{{item}}</li>
|
|
|
- </ul>
|
|
|
- <ul class="experience-place-nav-others">
|
|
|
- <li class="experience-place">武汉</li>
|
|
|
- <li class="experience-place">杭州</li>
|
|
|
- <li class="experience-place">深圳</li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
- <div class="experience-href"><nuxt-link target="_blank" to="/join">招商加盟详情</nuxt-link></div>
|
|
|
- <div class="experience-tab-content">
|
|
|
- <div class="experience-tab-box experience-tab-box-bt" v-show="0 == num">
|
|
|
- <div class="experience-tab-left">
|
|
|
- <div class="experience-tab-left-place">包头</div>
|
|
|
- <div class="experience-tab-left-img">
|
|
|
- <img src="~/assets/images/index/experience-tab-left-img-bt.png">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="experience-tab-right">
|
|
|
- <div class="tab-right-intro">
|
|
|
- <div class="tab-right-intro-title">
|
|
|
- <p>逐梦</p>
|
|
|
- <p>鹿都之巅</p>
|
|
|
- <p class="tab-right-intro-title-desc">卫诗理Olive life 新零售包头店，逐梦之路，未来之巅</p>
|
|
|
- <p class="tab-right-intro-title-desc-line"></p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-style">
|
|
|
- <p>拉斐尔现代美式、麦迪逊轻奢美式、麦巴赫·纽约摩登...</p>
|
|
|
- <p class="intro-style-en">Style</p>
|
|
|
- <p class="tab-right-intro-title-desc-line"></p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-phone">
|
|
|
- <p class="intro-phone-number">186-86152121</p>
|
|
|
- <p class="intro-phone-name">telephone</p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-more">
|
|
|
- <nuxt-link to="experice/bt">了解更多 ></nuxt-link>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="tab-right-pic">
|
|
|
- <div class="right-pic-name-box">
|
|
|
- <div class="right-pic-name">
|
|
|
- <p>现代桦木多</p>
|
|
|
- <p>功能储物斗柜</p>
|
|
|
- </div>
|
|
|
- <div class="right-pic-name-desc">
|
|
|
- <p>典雅深色与明亮金属色泽</p>
|
|
|
- <p>相间展现文艺仿古的艺术感。</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="tab-right-img">
|
|
|
- <img src="~/assets/images/index/tab-right-pic-bt.png">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="experience-tab-box experience-tab-box-cd" v-show="1 == num">
|
|
|
- <div class="experience-tab-left">
|
|
|
- <div class="experience-tab-left-place">成都</div>
|
|
|
- <div class="experience-tab-left-img">
|
|
|
- <img src="~/assets/images/index/experience-tab-left-img-cd.png">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="experience-tab-right">
|
|
|
- <div class="tab-right-intro">
|
|
|
- <div class="tab-right-intro-title">
|
|
|
- <p>天府之国</p>
|
|
|
- <p class="tab-right-intro-title-desc">卫诗理新零售成都“卫共”店，生态生活，盎然新启</p>
|
|
|
- <p class="tab-right-intro-title-desc-line"></p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-style">
|
|
|
- <p>美式、欧式、英式、轻奢小法、禅意中式、新古典、中式...</p>
|
|
|
- <p class="intro-style-en">Style</p>
|
|
|
- <p class="tab-right-intro-title-desc-line"></p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-phone">
|
|
|
- <p class="intro-phone-number">028-85007888</p>
|
|
|
- <p class="intro-phone-name">telephone</p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-more">
|
|
|
- <nuxt-link to="/experice/cd">了解更多 ></nuxt-link>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="tab-right-pic">
|
|
|
- <div class="right-pic-name-box">
|
|
|
- <div class="right-pic-name">
|
|
|
- <p>珍尼丝</p>
|
|
|
- <p>电视柜</p>
|
|
|
- </div>
|
|
|
- <div class="right-pic-name-desc">
|
|
|
- <p>复古旅行箱造型</p>
|
|
|
- <p>摩洛哥海洋蓝</p>
|
|
|
- <p>AISI镜光铜</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="tab-right-img">
|
|
|
- <img src="~/assets/images/index/tab-right-pic-cd.png">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="experience-tab-box experience-tab-box-nj" v-show="2 == num">
|
|
|
- <div class="experience-tab-left">
|
|
|
- <div class="experience-tab-left-place">南京</div>
|
|
|
- <div class="experience-tab-left-img">
|
|
|
- <img src="~/assets/images/index/experience-tab-left-img-nanjing.jpg">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="experience-tab-right">
|
|
|
- <div class="tab-right-intro">
|
|
|
- <div class="tab-right-intro-title">
|
|
|
- <p>绽放</p>
|
|
|
- <p>十朝都会</p>
|
|
|
- <p class="tab-right-intro-title-desc">卫诗理线下O2O南京"卫共"店初心不移，呈现生活最美的姿态</p>
|
|
|
- <p class="tab-right-intro-title-desc-line"></p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-style">
|
|
|
- <p>大美，小美，简美，意式，法式英式，新中式等...</p>
|
|
|
- <p class="intro-style-en">Style</p>
|
|
|
- <p class="tab-right-intro-title-desc-line"></p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-phone">
|
|
|
- <p class="intro-phone-number">025-52458886</p>
|
|
|
- <p class="intro-phone-name">telephone</p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-more">
|
|
|
- <nuxt-link to="experice/nj">了解更多 ></nuxt-link>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="tab-right-pic">
|
|
|
- <div class="right-pic-name-box">
|
|
|
- <div class="right-pic-name">
|
|
|
- <p>纳尔逊</p>
|
|
|
- <p>餐桌</p>
|
|
|
- </div>
|
|
|
- <div class="right-pic-name-desc">
|
|
|
- <p>非洲进口桃花口木</p>
|
|
|
- <p>沙比利木皮拼花</p>
|
|
|
- <p>古典圆形转盘设计</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="tab-right-img">
|
|
|
- <img src="~/assets/images/index/tab-right-pic-nanjing.png">
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="experience-tab-box experience-tab-box-dg" v-show="3 == num">
|
|
|
- <div class="experience-tab-left">
|
|
|
- <div class="experience-tab-left-place">东莞</div>
|
|
|
- <div class="experience-tab-left-img">
|
|
|
- <img src="~/assets/images/index/experience-tab-left-img-dg.png">
|
|
|
- </div>
|
|
|
+ <div class="content-box course-content-box">
|
|
|
+ <div class="cate-box course-cate-box">
|
|
|
+ <ul class="cate-nav course-cate-nav">
|
|
|
+ <li class="products-kind thinking-products-kind" v-for="(item, index) in productCate" :class="{active:index == clickProdIndex}" :key="index" @click="getProdList(index)">
|
|
|
+ <nuxt-link to="/">
|
|
|
+ {{ item.title }}
|
|
|
+ </nuxt-link>
|
|
|
+ <div class="line"></div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ <div class="cate-list course-cate-list">
|
|
|
+ <div class="product-item course-product-item" v-for="(item, index) in productCate" :key="index">
|
|
|
+ <div class="product-item-img course-product-item-img">
|
|
|
+ <nuxt-link to="/">
|
|
|
+ <img src="~/assets/images/index/tab-right-pic-dg.png" alt="" srcset="">
|
|
|
+ </nuxt-link>
|
|
|
</div>
|
|
|
- <div class="experience-tab-right">
|
|
|
- <div class="tab-right-intro">
|
|
|
- <div class="tab-right-intro-title">
|
|
|
- <p>臻贡</p>
|
|
|
- <p>一个阶层</p>
|
|
|
- <p class="tab-right-intro-title-desc">纯正欧式尊贵体验，赋予贵族新的定义</p>
|
|
|
- <p class="tab-right-intro-title-desc-line"></p>
|
|
|
+ <div class="course-product-info">
|
|
|
+ <div class="course-product-title">幼小衔接课程……</div>
|
|
|
+ <div class="course-product-content">
|
|
|
+ <div class="course-product-price">
|
|
|
+ ￥<span class="price-num">888</span>
|
|
|
</div>
|
|
|
- <div class="tab-right-intro-style">
|
|
|
- <p>大美、小美、简美、英式、美式、法式、意式...</p>
|
|
|
- <p class="intro-style-en">Style</p>
|
|
|
- <p class="tab-right-intro-title-desc-line"></p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-phone">
|
|
|
- <p class="intro-phone-number">0796-82251668</p>
|
|
|
- <p class="intro-phone-name">telephone</p>
|
|
|
- </div>
|
|
|
- <div class="tab-right-intro-more">
|
|
|
- <nuxt-link to="experice/dg">了解更多 ></nuxt-link>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="tab-right-pic">
|
|
|
- <div class="right-pic-name-box">
|
|
|
- <div class="right-pic-name">
|
|
|
- <p>史丹尼</p>
|
|
|
- <p>沙发</p>
|
|
|
- </div>
|
|
|
- <div class="right-pic-name-desc">
|
|
|
- <p>经典切斯特菲尔德 </p>
|
|
|
- <p>意大利头层牛皮</p>
|
|
|
- <p>金属&实木艺术交融</p>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="tab-right-img">
|
|
|
- <img src="~/assets/images/index/tab-right-pic-dg.png">
|
|
|
+ <div class="course-product-user">
|
|
|
+ <img src="~/assets/images/index/product_person.png" alt="" srcset="">
|
|
|
+ <img src="~/assets/images/join/business_banner.jpg" alt="" srcset="">
|
|
|
+ <div>158</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -281,57 +95,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div> -->
|
|
|
- <!-- 产品介绍 -->
|
|
|
- <!-- <div id="index-products">
|
|
|
- <div class="products-content">
|
|
|
- <div class="products-content-top">
|
|
|
- <div class="products-content-top-titleC">
|
|
|
- <h2>产品介绍</h2>
|
|
|
- </div>
|
|
|
- <div class="products-content-top-titleE">Products Introduce</div>
|
|
|
- <div class="products-content-top-description">品质生活，爱家有道</div>
|
|
|
- </div>
|
|
|
- <div class="products-content-box">
|
|
|
- <div class="products-kind-container">
|
|
|
- <ul class="products-kind-nav">
|
|
|
- <li class="products-kind" v-for="(item,index) in indexProdNav" :key="item.proCategoryId" :class="{active:index == clickProdIndex}" @click="getProdList(index)">{{item.proCategoryName}}</li>
|
|
|
- </ul>
|
|
|
- <div class="products-tab-content">
|
|
|
- <prodListShow :prodList="indexProdList6" :showNewMore="true" :typeId="97" v-show="0 == clickProdIndex"></prodListShow>
|
|
|
- <prodListShow :prodList="indexProdList1" :showMore="true" :typeId="1" v-show="1 == clickProdIndex"></prodListShow>
|
|
|
- <prodListShow :prodList="indexProdList2" :showMore="true" :typeId="2" v-show="2 == clickProdIndex"></prodListShow>
|
|
|
- <prodListShow :prodList="indexProdList3" :showMore="true" :typeId="3" v-show="3 == clickProdIndex"></prodListShow>
|
|
|
- <prodListShow :prodList="indexProdList4" :showMore="true" :typeId="4" v-show="4 == clickProdIndex"></prodListShow>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div> -->
|
|
|
- <!-- 新闻资讯部分 -->
|
|
|
- <!-- <div id="index-news">
|
|
|
- <div class="news-content">
|
|
|
- <div class="news-content-top">
|
|
|
- <div class="news-content-top-titleC"><h2>新闻资讯</h2></div>
|
|
|
- <div class="news-content-top-titleE">News Center</div>
|
|
|
- <div class="news-content-top-description">一切资讯都是有价值的</div>
|
|
|
- </div>
|
|
|
- <div class="news-content-box">
|
|
|
- <div class="news-kind-container">
|
|
|
- <ul class="news-kind-nav">
|
|
|
- <li class="news-kind" v-for="(item,index) in $store.state.headNewsNav" :key="index" :class="{active:index == clickNewsIndex}" @click="getNewsList(index)">{{item.articleCategoryName}}</li>
|
|
|
- </ul>
|
|
|
- <div class="news-tab-content">
|
|
|
- <indexNewsListShow :indexFirstNewsList="indexFirstNewsList1" :indexNewsList="indexNewsList1" v-show="0 == clickNewsIndex"></indexNewsListShow>
|
|
|
- <indexNewsListShow :indexFirstNewsList="indexFirstNewsList2" :indexNewsList="indexNewsList2" v-show="1 == clickNewsIndex"></indexNewsListShow>
|
|
|
- <indexNewsListShow :indexFirstNewsList="indexFirstNewsList3" :indexNewsList="indexNewsList3" v-show="2 == clickNewsIndex"></indexNewsListShow>
|
|
|
- <indexNewsListShow :indexFirstNewsList="indexFirstNewsList4" :indexNewsList="indexNewsList4" v-show="3 == clickNewsIndex"></indexNewsListShow>
|
|
|
- <indexNewsListShow :indexFirstNewsList="indexFirstNewsList5" :indexNewsList="indexNewsList5" v-show="4 == clickNewsIndex"></indexNewsListShow>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div> -->
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -457,9 +221,13 @@ export default {
|
|
|
|
|
|
.container {
|
|
|
width: 100%;
|
|
|
+ background: #F0F2F5;
|
|
|
height: auto;
|
|
|
}
|
|
|
|
|
|
+.title-content {
|
|
|
+ margin-top: 164px;
|
|
|
+}
|
|
|
|
|
|
.title-en {
|
|
|
height:110px;
|
|
|
@@ -471,15 +239,90 @@ export default {
|
|
|
}
|
|
|
|
|
|
.title-zh {
|
|
|
- height:81px;
|
|
|
- line-height:81px;
|
|
|
- font-size:58px;
|
|
|
- font-family:PingFangSC-Semibold,PingFang SC;
|
|
|
- font-weight:600;
|
|
|
+ height: 81px;
|
|
|
+ line-height: 81px;
|
|
|
+ font-size: 58px;
|
|
|
+ font-family: PingFangSC-Semibold,PingFang SC;
|
|
|
+ font-weight: 600;
|
|
|
color:#000000;
|
|
|
- letter-spacing:1px;
|
|
|
+ letter-spacing: 1px;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
|
|
|
+ul.cate-nav {
|
|
|
+ margin: 124px 0 116px;
|
|
|
+ li.products-kind {
|
|
|
+ display: inline-block;
|
|
|
+ margin: 0 30px;
|
|
|
+ cursor: pointer;
|
|
|
+ &:first-child {
|
|
|
+ margin-left: 0;
|
|
|
+ }
|
|
|
+ &.active, &:hover {
|
|
|
+ a {
|
|
|
+ color: $theme_color;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .line {
|
|
|
+ visibility: hidden;
|
|
|
+ margin: 22px auto 0;
|
|
|
+ width:60px;
|
|
|
+ border-radius: 50px;
|
|
|
+ height: 15px;
|
|
|
+ background: $theme_color_fu;
|
|
|
+ box-shadow: 0px 2px 8px 0px rgba(45,112,245,0.64);
|
|
|
+ // -webkit-transition: all 0.5s ease;
|
|
|
+ // -o-transition: all 0.5s ease;
|
|
|
+ // transition: all 0.5s ease;
|
|
|
+ }
|
|
|
+ a {
|
|
|
+ font-size: 32px;
|
|
|
+ color: #747885;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ li.products-kind:hover, li.products-kind.active {
|
|
|
+ .line {
|
|
|
+ display: block;
|
|
|
+ visibility: visible;
|
|
|
+ transition: all 0.5s ease;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.cate-list {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .product-item {
|
|
|
+ position: relative;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width:372px;
|
|
|
+ margin-bottom: 42px;
|
|
|
+ margin-right: 36px;
|
|
|
+ &:nth-child(3n) {
|
|
|
+ margin-right: 0px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .product-tag {
|
|
|
+ padding: 0 6px 0 10px;
|
|
|
+ background: $theme_color_fu;
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #FFFFFF;
|
|
|
+ height: 24px;
|
|
|
+ line-height: 24px;
|
|
|
+ font-family: PingFangSC-Semibold,PingFang SC;
|
|
|
+ font-weight: 600;
|
|
|
+ border-radius:18px 0px 7px 0px;
|
|
|
+ // img {
|
|
|
+ // width:52px;
|
|
|
+ // height:24px;
|
|
|
+ // object-fit: cover;
|
|
|
+ // }
|
|
|
+ }
|
|
|
+}
|
|
|
|
|
|
/* index-thinking */
|
|
|
.index-thinking {
|
|
|
@@ -515,8 +358,10 @@ export default {
|
|
|
width:60px;
|
|
|
border-radius: 50px;
|
|
|
height: 15px;
|
|
|
- background:rgba(159,17,48,1);
|
|
|
- box-shadow: 0px 2px 8px 0px rgba(240,53,94,0.61);
|
|
|
+ width:59px;
|
|
|
+ height:15px;
|
|
|
+ background: $theme_color_fu;
|
|
|
+ box-shadow: 0px 2px 8px 0px rgba(94,161,241,0.87);
|
|
|
}
|
|
|
a {
|
|
|
font-size: 32px;
|
|
|
@@ -536,760 +381,120 @@ export default {
|
|
|
li.thinking-products-kind.active a,
|
|
|
.thinking-products-kind:hover a{
|
|
|
// font-size: 42px;
|
|
|
- color: $theme_fu_red;
|
|
|
- // border-bottom: 6px solid $theme_fu_red;
|
|
|
+ color: $theme_color;
|
|
|
+ // border-bottom: 6px solid $theme_color;
|
|
|
// box-shadow:0px 2px 8px 0px rgba(240,53,94,0.61);
|
|
|
}
|
|
|
+ .thinking-cate-list {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .thinking-product-item {
|
|
|
+ position: relative;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width:372px;
|
|
|
+ margin-bottom: 42px;
|
|
|
+ margin-right: 36px;
|
|
|
+ &:nth-child(3n) {
|
|
|
+ margin-right: 0px;
|
|
|
+ }
|
|
|
+ .thinking-product-item-img {
|
|
|
+ img {
|
|
|
+ border-radius:18px 18px 0px 0px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .thinking-product-info {
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #FFFFFF;
|
|
|
+ height:90px;
|
|
|
+ box-shadow:0px 5px 21px 0px rgba(232,243,243,1);
|
|
|
+ border-radius:0px 0px 18px 18px;
|
|
|
+ padding: 26px 22px;
|
|
|
+ .thinking-product-title {
|
|
|
+ width: 160px;
|
|
|
+ height: 28px;
|
|
|
+ font-size: 20px;
|
|
|
+ font-family: PingFangSC-Medium,PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color:rgba(52,62,48,1);
|
|
|
+ line-height: 28px;
|
|
|
+ }
|
|
|
+ .thinking-product-content {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+ .thinking-product-price {
|
|
|
+ color: #EA0B4A;
|
|
|
+ .price-num {
|
|
|
+ font-size: 22px;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .thinking-product-btn {
|
|
|
+ height:18px;
|
|
|
+ line-height:18px;
|
|
|
+ font-size:13px;
|
|
|
+ font-family:PingFangSC-Regular,PingFang SC;
|
|
|
+ font-weight:400;
|
|
|
+ color: #3E8EFF;
|
|
|
+ }
|
|
|
+ // .thinking-product-user {
|
|
|
+ // display: flex;
|
|
|
+ // img {
|
|
|
+ // width: 18px;
|
|
|
+ // height: 22px;
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
-/*index-story*/
|
|
|
-div#index-story {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.i-s-contant {
|
|
|
- width: 1200px;
|
|
|
- height: auto;
|
|
|
- margin: 0 auto;
|
|
|
-}
|
|
|
-
|
|
|
-.s-c-top {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding: 162px 0 100px;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-.c-t-titleC {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- font-size: 38px;
|
|
|
- font-family: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif",
|
|
|
- "source-han-serif-sc", "STZhongsong", "宋体", "serif";
|
|
|
- font-weight: 900;
|
|
|
- color: #22202b;
|
|
|
- line-height: 46px;
|
|
|
-}
|
|
|
-
|
|
|
-.c-t-titleE {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- font-size: 14px;
|
|
|
- color: #858585;
|
|
|
- line-height: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-.c-t-description {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- font-size: 14px;
|
|
|
- color: #858585;
|
|
|
- line-height: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-.s-c-bottom {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-bottom: 150px;
|
|
|
-}
|
|
|
-
|
|
|
-.story-bottom-detalis {
|
|
|
- float: left;
|
|
|
- width: 600px;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.story-bottom-vedios {
|
|
|
- float: right;
|
|
|
- overflow: hidden;
|
|
|
- width: 530px;
|
|
|
- height: 353px;
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-title {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-bottom: 45px;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-titleC {
|
|
|
- position: relative;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding: 10px 0 5px;
|
|
|
- color: #22202b;
|
|
|
- font-size: 22px;
|
|
|
- line-height: 24px;
|
|
|
- text-align: left;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-titleC::after {
|
|
|
- position: absolute;
|
|
|
- top: 50%;
|
|
|
- right: 45px;
|
|
|
- content: "";
|
|
|
- width: 339px;
|
|
|
- height: 2px;
|
|
|
- background: #d5d5d8;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-titleE {
|
|
|
- width: 320px;
|
|
|
- height: auto;
|
|
|
- color: #cccccc;
|
|
|
- font-size: 12px;
|
|
|
- line-height: 15px;
|
|
|
- text-align: left;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-content {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-right: 94px;
|
|
|
- padding-bottom: 60px;
|
|
|
- color: #858585;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 18px;
|
|
|
- text-align: left;
|
|
|
- -webkit-box-sizing: border-box;
|
|
|
- -moz-box-sizing: border-box;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-more-box {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-more-img {
|
|
|
- float: left;
|
|
|
- overflow: hidden;
|
|
|
- width: 107px;
|
|
|
- height: 78px;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-more {
|
|
|
- float: left;
|
|
|
- width: 163px;
|
|
|
- height: 40px;
|
|
|
- margin-top: 17px;
|
|
|
- margin-left: 62px;
|
|
|
- border: 3px solid #000;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 40px;
|
|
|
- text-align: center;
|
|
|
- -webkit-transition: all 0.5s ease;
|
|
|
- -o-transition: all 0.5s ease;
|
|
|
- transition: all 0.5s ease;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-more:hover {
|
|
|
- -webkit-transform: translateY(-5px);
|
|
|
- -ms-transform: translateY(-5px);
|
|
|
- -o-transform: translateY(-5px);
|
|
|
- transform: translateY(-5px);
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-more-img img {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-more a {
|
|
|
- display: block;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- color: #22202b;
|
|
|
- font-weight: bold;
|
|
|
- -webkit-transition: all 0.5s ease;
|
|
|
- -o-transition: all 0.5s ease;
|
|
|
- transition: all 0.5s ease;
|
|
|
-}
|
|
|
-
|
|
|
-.bottom-detalis-more:hover a {
|
|
|
- background: #22202b;
|
|
|
- color: #feeabd;
|
|
|
-}
|
|
|
-/*index-story*/
|
|
|
-
|
|
|
-/*体验馆*/
|
|
|
-div#index-experience {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- background: #f9f9fa;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-content {
|
|
|
- width: 1200px;
|
|
|
- height: auto;
|
|
|
- margin: 0 auto;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-content-top {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding: 140px 0 22px;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-content-top-titleC {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- font-size: 38px;
|
|
|
- font-family: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif",
|
|
|
- "source-han-serif-sc", "STZhongsong", "宋体", "serif";
|
|
|
- font-weight: 900;
|
|
|
- color: #22202b;
|
|
|
- line-height: 46px;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-content-top-titleE {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- font-size: 14px;
|
|
|
- color: #858585;
|
|
|
- line-height: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-content-top-description {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-top: 6px;
|
|
|
- font-size: 14px;
|
|
|
- color: #858585;
|
|
|
- line-height: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-content-box {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-place-container {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-place-ul-box {
|
|
|
- width: 100%;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-ul.experience-place-nav {
|
|
|
- display: inline-block;
|
|
|
- height: auto;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-place-nav-others {
|
|
|
- display: inline-block;
|
|
|
-}
|
|
|
-
|
|
|
-li.experience-place {
|
|
|
- display: inline-block;
|
|
|
- width: 104px;
|
|
|
- height: 40px;
|
|
|
- margin: 0 8px;
|
|
|
- border: 3px solid #000;
|
|
|
- color: #000;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 40px;
|
|
|
- text-align: center;
|
|
|
- cursor: pointer;
|
|
|
- -webkit-transition: all 1s ease;
|
|
|
- -o-transition: all 1s ease;
|
|
|
- transition: all 1s ease;
|
|
|
-}
|
|
|
-
|
|
|
-li.experience-place.active {
|
|
|
- color: #feeabd;
|
|
|
- background: #000;
|
|
|
-}
|
|
|
-
|
|
|
-li.experience-place:hover {
|
|
|
- color: #feeabd;
|
|
|
- background: #000;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-href {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-top: 20px;
|
|
|
- font-size: 14px;
|
|
|
- color: #858585;
|
|
|
- line-height: 22px;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-href a {
|
|
|
- color: #858585;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-href a:hover {
|
|
|
- color: #000;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-tab-content {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding: 118px 0 150px;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-tab-box {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-tab-content .experience-tab-box:first-child {
|
|
|
- display: block;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-tab-left {
|
|
|
- float: left;
|
|
|
- width: 600px;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-tab-right {
|
|
|
- float: right;
|
|
|
- width: 600px;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-tab-left-place {
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
- width: 456px;
|
|
|
- padding: 34px 0 0 40px;
|
|
|
- color: #22202b;
|
|
|
- font-size: 14px;
|
|
|
- text-align: left;
|
|
|
- line-height: 30px;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-tab-left-place::after {
|
|
|
- position: absolute;
|
|
|
- top: 49px;
|
|
|
- right: 0;
|
|
|
- content: "";
|
|
|
- width: 339px;
|
|
|
- height: 2px;
|
|
|
- background: #d5d5d8;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-tab-left-img {
|
|
|
- overflow: hidden;
|
|
|
- width: 515px;
|
|
|
- height: 485px;
|
|
|
- margin-top: -40px;
|
|
|
-}
|
|
|
-
|
|
|
-.experience-tab-box-nj .experience-tab-left-img img {
|
|
|
- margin-top: 144px;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-intro {
|
|
|
- float: left;
|
|
|
- width: 316px;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-pic {
|
|
|
- float: right;
|
|
|
- width: 284px;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-intro-title {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- color: #22202b;
|
|
|
- font-size: 22px;
|
|
|
- font-weight: bold;
|
|
|
- line-height: 24px;
|
|
|
- text-align: left;
|
|
|
-}
|
|
|
-
|
|
|
-p.tab-right-intro-title-desc {
|
|
|
- width: 200px;
|
|
|
- height: auto;
|
|
|
- padding-top: 10px;
|
|
|
- padding-bottom: 40px;
|
|
|
- color: #979797;
|
|
|
- font-size: 14px;
|
|
|
- font-weight: normal;
|
|
|
- line-height: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-p.tab-right-intro-title-desc-line {
|
|
|
- width: 136px;
|
|
|
- height: 2px;
|
|
|
- background: #d5d5d8;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-intro-style {
|
|
|
- width: 200px;
|
|
|
- height: auto;
|
|
|
- padding-top: 48px;
|
|
|
- color: #22202b;
|
|
|
- font-size: 14px;
|
|
|
- text-align: left;
|
|
|
- line-height: 18px;
|
|
|
-}
|
|
|
-
|
|
|
-p.intro-style-en {
|
|
|
- color: #979797;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 26px;
|
|
|
- padding-bottom: 30px;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-intro-phone {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-top: 45px;
|
|
|
- padding-bottom: 83px;
|
|
|
-}
|
|
|
-
|
|
|
-p.intro-phone-number {
|
|
|
- width: 100%;
|
|
|
- height: 22px;
|
|
|
- color: #22202b;
|
|
|
- font-size: 18px;
|
|
|
- font-weight: bold;
|
|
|
- line-height: 22px;
|
|
|
- text-align: left;
|
|
|
-}
|
|
|
-
|
|
|
-p.intro-phone-name {
|
|
|
- width: 100%;
|
|
|
- height: 22px;
|
|
|
- color: #979797;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 22px;
|
|
|
- text-align: left;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-intro-more {
|
|
|
- width: 163px;
|
|
|
- height: 40px;
|
|
|
- border: 3px solid #000;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 40px;
|
|
|
- text-align: center;
|
|
|
- -webkit-transition: all 0.5s ease;
|
|
|
- -o-transition: all 0.5s ease;
|
|
|
- transition: all 0.5s ease;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-intro-more:hover {
|
|
|
- -webkit-transform: translateY(-5px);
|
|
|
- -ms-transform: translateY(-5px);
|
|
|
- -o-transform: translateY(-5px);
|
|
|
- transform: translateY(-5px);
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-intro-more a {
|
|
|
- display: block;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- color: #22202b;
|
|
|
- font-weight: bold;
|
|
|
- -webkit-transition: all 0.5s ease;
|
|
|
- -o-transition: all 0.5s ease;
|
|
|
- transition: all 0.5s ease;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-intro-more:hover a {
|
|
|
- background: #22202b;
|
|
|
- color: #feeabd;
|
|
|
-}
|
|
|
-
|
|
|
-.right-pic-name-box {
|
|
|
- position: relative;
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- padding-left: 60px;
|
|
|
- padding-bottom: 160px;
|
|
|
- box-sizing: border-box;
|
|
|
-}
|
|
|
-
|
|
|
-.right-pic-name-box::after {
|
|
|
- position: absolute;
|
|
|
- right: 49.7%;
|
|
|
- bottom: 9px;
|
|
|
- content: "";
|
|
|
- width: 2px;
|
|
|
- height: 135px;
|
|
|
- background: #d5d5d8;
|
|
|
-}
|
|
|
-
|
|
|
-.right-pic-name {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- color: #22202b;
|
|
|
- font-size: 22px;
|
|
|
- font-weight: bold;
|
|
|
- line-height: 24px;
|
|
|
- text-align: left;
|
|
|
-}
|
|
|
-
|
|
|
-.right-pic-name-desc {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding: 12px 0 24px;
|
|
|
- color: #979797;
|
|
|
- font-size: 14px;
|
|
|
- font-weight: normal;
|
|
|
- line-height: 18px;
|
|
|
-}
|
|
|
-
|
|
|
-.tab-right-img {
|
|
|
- display: flex;
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: 230px;
|
|
|
- text-align: center;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
-}
|
|
|
-
|
|
|
-/*体验馆*/
|
|
|
-/* 产品部分 */
|
|
|
-div#index-products {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-.products-content {
|
|
|
- width: 1200px;
|
|
|
- height: auto;
|
|
|
- margin: 0 auto;
|
|
|
-}
|
|
|
-
|
|
|
-.products-content-top {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding: 140px 0 22px;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-.products-content-top-titleC {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- font-size: 38px;
|
|
|
- font-family: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif",
|
|
|
- "source-han-serif-sc", "STZhongsong", "宋体", "serif";
|
|
|
- font-weight: 900;
|
|
|
- color: #22202b;
|
|
|
- line-height: 46px;
|
|
|
-}
|
|
|
-
|
|
|
-.products-content-top-titleE {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- font-size: 14px;
|
|
|
- color: #858585;
|
|
|
- line-height: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-.products-content-top-description {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-top: 6px;
|
|
|
- font-size: 14px;
|
|
|
- color: #858585;
|
|
|
- line-height: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-.products-content-box {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-bottom: 150px;
|
|
|
-}
|
|
|
-
|
|
|
-.products-kind-container {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-ul.products-kind-nav {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-top: 20px;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-li.products-kind {
|
|
|
- display: inline-block;
|
|
|
- height: 46px;
|
|
|
- margin: 0 22px;
|
|
|
- border-bottom: 2px solid transparent;
|
|
|
- color: #979797;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 46px;
|
|
|
- text-align: center;
|
|
|
- cursor: pointer;
|
|
|
- -webkit-transition: all 0.5s ease;
|
|
|
- -o-transition: all 0.5s ease;
|
|
|
- transition: all 0.5s ease;
|
|
|
-}
|
|
|
-li.products-kind.active,
|
|
|
-.products-kind:hover {
|
|
|
- color: #22202b;
|
|
|
- font-weight: bold;
|
|
|
- border-bottom: 2px solid #22202b;
|
|
|
-}
|
|
|
-
|
|
|
-.products-tab-content {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding: 126px 0 0;
|
|
|
-}
|
|
|
-
|
|
|
-.products-more {
|
|
|
- overflow: hidden;
|
|
|
- width: 163px;
|
|
|
- height: 40px;
|
|
|
- margin: 0 auto;
|
|
|
- border: 3px solid #000;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 40px;
|
|
|
- text-align: center;
|
|
|
- -webkit-transition: all 0.5s ease;
|
|
|
- -o-transition: all 0.5s ease;
|
|
|
- transition: all 0.5s ease;
|
|
|
-}
|
|
|
-
|
|
|
-.products-more:hover {
|
|
|
- -webkit-transform: translateY(-5px);
|
|
|
- -ms-transform: translateY(-5px);
|
|
|
- -o-transform: translateY(-5px);
|
|
|
- transform: translateY(-5px);
|
|
|
-}
|
|
|
-
|
|
|
-.products-more a {
|
|
|
- display: block;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- color: #22202b;
|
|
|
- font-weight: bold;
|
|
|
- -webkit-transition: all 0.5s ease;
|
|
|
- -o-transition: all 0.5s ease;
|
|
|
- transition: all 0.5s ease;
|
|
|
-}
|
|
|
-
|
|
|
-.products-more:hover a {
|
|
|
- background: #22202b;
|
|
|
- color: #feeabd;
|
|
|
-}
|
|
|
-/* 产品部分结束 */
|
|
|
-/* 新闻资讯部分 */
|
|
|
-div#index-news {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- background: #f9f9fa;
|
|
|
-}
|
|
|
-
|
|
|
-.news-content {
|
|
|
+/* index-thinking */
|
|
|
+.index-course {
|
|
|
width: 1200px;
|
|
|
- height: auto;
|
|
|
margin: 0 auto;
|
|
|
-}
|
|
|
-
|
|
|
-.news-content-top {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding: 140px 0 22px;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-.news-content-top-titleC {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- font-size: 38px;
|
|
|
- font-family: "Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif",
|
|
|
- "source-han-serif-sc", "STZhongsong", "宋体", "serif";
|
|
|
- font-weight: 900;
|
|
|
- color: #22202b;
|
|
|
- line-height: 46px;
|
|
|
-}
|
|
|
-
|
|
|
-.news-content-top-titleE {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- font-size: 14px;
|
|
|
- color: #858585;
|
|
|
- line-height: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-.news-content-top-description {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-top: 6px;
|
|
|
- font-size: 14px;
|
|
|
- color: #858585;
|
|
|
- line-height: 22px;
|
|
|
-}
|
|
|
-
|
|
|
-.news-content-box {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-bottom: 150px;
|
|
|
-}
|
|
|
-
|
|
|
-.news-kind-container {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-
|
|
|
-ul.news-kind-nav {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-top: 20px;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-
|
|
|
-li.news-kind {
|
|
|
- display: inline-block;
|
|
|
- height: 46px;
|
|
|
- margin: 0 22px;
|
|
|
- border-bottom: 2px solid transparent;
|
|
|
- color: #979797;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 46px;
|
|
|
- text-align: center;
|
|
|
- cursor: pointer;
|
|
|
- -webkit-transition: all 0.5s ease;
|
|
|
- -o-transition: all 0.5s ease;
|
|
|
- transition: all 0.5s ease;
|
|
|
-}
|
|
|
-
|
|
|
-li.news-kind.active,
|
|
|
-.news-kind:hover {
|
|
|
- color: #22202b;
|
|
|
- font-weight: bold;
|
|
|
- border-bottom: 2px solid #22202b;
|
|
|
-}
|
|
|
-
|
|
|
-.news-tab-content {
|
|
|
- overflow: hidden;
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- padding-top: 70px;
|
|
|
+ .course-product-info {
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #FFFFFF;
|
|
|
+ height:90px;
|
|
|
+ box-shadow:0px 5px 21px 0px rgba(232,243,243,1);
|
|
|
+ border-radius:0px 0px 18px 18px;
|
|
|
+ padding: 26px 22px;
|
|
|
+ .course-product-title {
|
|
|
+ width: 160px;
|
|
|
+ height: 28px;
|
|
|
+ font-size: 20px;
|
|
|
+ font-family: PingFangSC-Medium,PingFang SC;
|
|
|
+ font-weight: 500;
|
|
|
+ color:rgba(52,62,48,1);
|
|
|
+ line-height: 28px;
|
|
|
+ }
|
|
|
+ .course-product-content {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+ .course-product-price {
|
|
|
+ color: #EA0B4A;
|
|
|
+ .price-num {
|
|
|
+ font-size: 22px;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .course-product-user {
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-end;
|
|
|
+ img {
|
|
|
+ width: 18px;
|
|
|
+ height: 22px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
/* 新闻资讯部分结束 */
|
|
|
+
|
|
|
</style>
|
chending1994
