{"version":3,"sources":["webpack:///./src/components/Hero.vue?2b02","webpack:///src/components/Hero.vue","webpack:///./src/components/Hero.vue?6b8c","webpack:///./src/components/Hero.vue","webpack:///./src/components/Hero.vue?bc60","webpack:///./src/components/AboutMenu.vue?3983","webpack:///src/components/AboutMenu.vue","webpack:///./src/components/AboutMenu.vue?dde0","webpack:///./src/components/AboutMenu.vue","webpack:///./src/components/AboutMenu.vue?97f0","webpack:///./src/views/About.vue?48f8","webpack:///./src/components/Slide1.vue?b1e3","webpack:///./src/views/About.vue?c3d3","webpack:///./src/components/Slide1.vue?4be7","webpack:///src/components/Slide1.vue","webpack:///./src/components/Slide1.vue?fbdb","webpack:///./src/components/Slide1.vue","webpack:///src/views/About.vue","webpack:///./src/views/About.vue?1c99","webpack:///./src/views/About.vue","webpack:///./src/components/AboutMenu.vue?6047"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","id","on","mousemove","ref","style","data-depth","data-split","_v","_s","title","sub","staticRenderFns","Herovue_type_script_lang_js_","components","SeaDive","props","backimg","String","mounted","_this","setTimeout","$refs","dive","start","ratio","x","y","depth","methods","window","mouse","w","h","update","toFixed","bg","transform","webkitTransform","concat","components_Herovue_type_script_lang_js_","component","Object","componentNormalizer","__webpack_exports__","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Hero_vue_vue_type_style_index_0_id_e4804034_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__","__webpack_require__","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Hero_vue_vue_type_style_index_0_id_e4804034_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0___default","n","to","text","$t","menu","dark","border","AboutMenuvue_type_script_lang_js_","Navlink","components_AboutMenuvue_type_script_lang_js_","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_AboutMenu_vue_vue_type_style_index_0_id_5353ae12_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_AboutMenu_vue_vue_type_style_index_0_id_5353ae12_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0___default","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_About_vue_vue_type_style_index_0_id_22c43314_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_About_vue_vue_type_style_index_0_id_22c43314_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0___default","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Slide1_vue_vue_type_style_index_0_id_24ef6a63_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0__","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Slide1_vue_vue_type_style_index_0_id_24ef6a63_lang_scss_scoped_true___WEBPACK_IMPORTED_MODULE_0___default","domProps","innerHTML","_m","src","alt","Slide1vue_type_template_id_24ef6a63_scoped_true_render","click","onPaginationPrev","xlink:href","onPaginationNext","Slide1vue_type_template_id_24ef6a63_scoped_true_staticRenderFns","data-total","data-lazyload","Slide1vue_type_script_lang_js_","beforeDestroy","tlAutoplayTopSlider","kill","autoplayTopSlider","init","initDOM","topSlider","slider","onSliderTopChange","total","topSliderNav","addClass","setAutoSlideTopSlider","DomTopSlider","dom","$el","topSlides","topSliderNavPage","TweenMax","delayedCall","slideTopSlider","bind","next","t","e","i","canSlide","r","o","a","l","offsetHeight","onComplete","opacity","ease","easeInOut","set","updateTopNavPage","page","easeIn","easeOut","sens","components_Slide1vue_type_script_lang_js_","Slide1","Aboutvue_type_script_lang_js_","Hero","AboutMenu","oceanSchool_scroll","unbind","document","$nextTick","scrollBar","scrollTop","scrollShowImgs","imageswrap","imgs","len","length","img","showImg","_img$getBoundingClien","getBoundingClientRect","top","innerHeight","views_Aboutvue_type_script_lang_js_","About_component","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_AboutMenu_vue_vue_type_style_index_1_lang_scss___WEBPACK_IMPORTED_MODULE_0__","_node_modules_mini_css_extract_plugin_dist_loader_js_ref_8_oneOf_1_0_node_modules_css_loader_index_js_ref_8_oneOf_1_1_node_modules_vue_loader_lib_loaders_stylePostLoader_js_node_modules_postcss_loader_src_index_js_ref_8_oneOf_1_2_node_modules_sass_loader_lib_loader_js_ref_8_oneOf_1_3_node_modules_cache_loader_dist_cjs_js_ref_0_0_node_modules_vue_loader_lib_index_js_vue_loader_options_AboutMenu_vue_vue_type_style_index_1_lang_scss___WEBPACK_IMPORTED_MODULE_0___default"],"mappings":"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","file":"js/about.84b0440f.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('section',{staticClass:\"hero\",attrs:{\"id\":\"hero\"},on:{\"mousemove\":_vm.mousemove}},[_c('div',{staticClass:\"scene scene--parallax\"},[_c('div',{ref:\"bg\",staticClass:\"scene__item scene__item--bg\",style:(_vm.backimg),attrs:{\"data-depth\":\"-5\"}})]),_c('div',{staticClass:\"wrapper\"},[_c('div',{staticClass:\"row\"},[_c('div',{staticClass:\"col-7 col-tabletW-11 offset-1 offset-tabletW-0\"},[_c('h1',{staticClass:\"title anim--split ft-40\",attrs:{\"data-split\":\"chars\"}},[_vm._v(\"\\n          \"+_vm._s(_vm.title)+\"\\n        \")])])]),_c('div',{staticClass:\"row\"},[_c('div',{staticClass:\"col-6 col-tabletW-11 offset-1 offset-tabletW-0\"},[_c('p',{staticClass:\"lines text--medium color--bluelight anim--split ff-dr ft-25\",attrs:{\"data-split\":\"lines\"}},[_vm._v(_vm._s(_vm.sub))])])])]),_c('SeaDive',{ref:\"dive\"})],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","\r\n<template>\r\n  <section id=\"hero\" class=\"hero\"\r\n    @mousemove=\"mousemove\">\r\n    <div class=\"scene scene--parallax\">\r\n      <div\r\n        class=\"scene__item scene__item--bg\"\r\n        data-depth=\"-5\"\r\n        :style=\"backimg\"\r\n        ref=\"bg\"\r\n      ></div>\r\n    </div>\r\n\r\n    <div class=\"wrapper\">\r\n      <div class=\"row\">\r\n        <div class=\"col-7 col-tabletW-11 offset-1 offset-tabletW-0\">\r\n          <h1 class=\"title anim--split ft-40\" data-split=\"chars\">\r\n            {{ title }}\r\n          </h1>\r\n        </div>\r\n      </div>\r\n      <div class=\"row\">\r\n        <div class=\"col-6 col-tabletW-11 offset-1 offset-tabletW-0\">\r\n          <p class=\"lines text--medium color--bluelight anim--split ff-dr ft-25\" data-split=\"lines\">{{ sub }}</p>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <SeaDive ref=\"dive\" />\r\n  </section>\r\n</template>\r\n\r\n<script>\r\nimport SeaDive from './SeaDive.vue'\r\n\r\nexport default {\r\n  components: {\r\n    SeaDive\r\n  },\r\n\r\n  props: {\r\n    backimg: String,\r\n    title: String,\r\n    sub: String\r\n  },\r\n\r\n  mounted () {\r\n    setTimeout(() => {\r\n      this.$refs.dive.start()\r\n    }, 1000)\r\n\r\n    this.ratio = {\r\n      x: 0,\r\n      y: 0\r\n    }\r\n\r\n    this.depth = -5\r\n  },\r\n\r\n  methods: {\r\n    mousemove () {\r\n      this.ratio.x += 0.05 * (window.mouse.x / window.w * 2 - 1 - this.ratio.x)\r\n      this.ratio.y += 0.05 * (window.mouse.y / window.h * 2 - 1 - this.ratio.y)\r\n      this.update()\r\n    },\r\n\r\n    update () {\r\n      const x = (50 * this.ratio.x / this.depth).toFixed(2)\r\n      const y = (50 * this.ratio.y / this.depth).toFixed(2)\r\n\r\n      this.render(x, y)\r\n    },\r\n\r\n    render (x, y) {\r\n      this.$refs.bg.style.transform =\r\n        this.$refs.bg.style.webkitTransform =\r\n          `translateX(${x}px) translateY(${y}px) rotateZ(0.01deg)`\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.hero {\r\n  width: 100%;\r\n  height: 100vh;\r\n  display: -ms-flexbox;\r\n  display: flex;\r\n  -ms-flex-pack: start;\r\n  justify-content: flex-start;\r\n  -ms-flex-align: center;\r\n  align-items: center;\r\n  color: #fff;\r\n}\r\n\r\n.title {\r\n  line-height: 80px;\r\n}\r\n\r\n.lines {\r\n  line-height: 50px;\r\n  max-width: 660px;\r\n}\r\n\r\n.hero .title,\r\n.hero .title--small,\r\n.hero .title--smallest,\r\n.hero h2,\r\n.hero h3,\r\n.hero h4,\r\n.hero h5 {\r\n  max-width: 685px;\r\n}\r\n@media (max-width: 1366px){\r\n  .title{\r\n    line-height: 55px;\r\n  }\r\n}\r\n@media (min-width: 1441px) {\r\n  .hero .title,\r\n  .hero .title--small,\r\n  .hero .title--smallest,\r\n  .hero h2,\r\n  .hero h3,\r\n  .hero h4,\r\n  .hero h5 {\r\n    max-width: none;\r\n  }\r\n}\r\n\r\n.hero .title--big {\r\n  max-width: none;\r\n}\r\n\r\n.hero p {\r\n  margin: 0;\r\n}\r\n\r\n.hero:not(.hero--expedition) {\r\n  height: calc(100vh + 150px);\r\n}\r\n\r\n@media (max-width: 979px) {\r\n  .hero:not(.hero--expedition) {\r\n    height: calc(100vh + 100px);\r\n  }\r\n}\r\n\r\n.hero:not(.hero--expedition) .scene {\r\n  top: -25px;\r\n  left: -25px;\r\n  width: calc(100% + 50px);\r\n  height: calc(100% + 50px);\r\n  overflow: hidden;\r\n}\r\n\r\n.hero:not(.hero--expedition) .scene:after {\r\n  content: \"\";\r\n  width: 100%;\r\n  height: 410px;\r\n  left: 0;\r\n  bottom: -1px;\r\n  background: url(/images/hero-radial-gradiant.png) no-repeat center bottom;\r\n  background-size: 100% auto;\r\n}\r\n\r\n@media (min-width: 1921px) {\r\n  .hero:not(.hero--expedition) .scene:after {\r\n    background-position: center top;\r\n  }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .hero:not(.hero--expedition) .wrapper {\r\n    margin-top: -75px;\r\n  }\r\n}\r\n\r\n.hero:not(.hero--expedition) + .section {\r\n  margin-top: -80px;\r\n}\r\n\r\n@media (max-width: 1280px) {\r\n  .hero:not(.hero--expedition) + .section {\r\n    margin-top: -50px;\r\n  }\r\n}\r\n\r\n.hero--expedition {\r\n  overflow: hidden;\r\n}\r\n\r\n.hero--expedition canvas {\r\n  top: 0;\r\n  left: 0;\r\n  bottom: 0;\r\n  right: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  position: absolute;\r\n}\r\n\r\n.hero--expedition .scene {\r\n  transform-origin: center;\r\n}\r\n\r\n@media (min-width: 1025px) {\r\n  .hero--expedition .scene {\r\n    top: -25px;\r\n    left: -25px;\r\n    width: calc(100vw + 50px);\r\n    height: calc(100vh + 50px);\r\n  }\r\n}\r\n\r\n@media (max-width: 1024px) {\r\n  .hero--expedition .scene {\r\n    top: 0;\r\n    left: 0;\r\n    width: 100vw;\r\n    height: 100vh !important;\r\n  }\r\n}\r\n\r\n.hero--expedition .scene:after {\r\n  content: \"\";\r\n  top: 0;\r\n  left: 0;\r\n  bottom: 0;\r\n  right: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  position: absolute;\r\n  background: radial-gradient(ellipse at center, transparent 0, #041324 70%);\r\n  background-size: 100% 100%;\r\n}\r\n\r\n@media (max-width: 1024px) {\r\n  .hero--expedition .scene:after {\r\n    background: url(/images/hero-expedition-radial-gradiant.png) no-repeat\r\n      center;\r\n    background-size: 100% 100%;\r\n  }\r\n}\r\n\r\n.hero--expedition .scene__item {\r\n  background-position: center;\r\n}\r\n\r\n.page--404 .hero--expedition .scene__item {\r\n  opacity: 0.5;\r\n}\r\n\r\n.page--404 .hero--expedition .scene {\r\n  background-color: #0b1539;\r\n}\r\n\r\n.hero--expedition .title,\r\n.hero--expedition .title--small,\r\n.hero--expedition .title--smallest,\r\n.hero--expedition h2,\r\n.hero--expedition h3,\r\n.hero--expedition h4,\r\n.hero--expedition h5 {\r\n  margin: 0;\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .hero--expedition .title,\r\n  .hero--expedition .title--small,\r\n  .hero--expedition .title--smallest,\r\n  .hero--expedition h2,\r\n  .hero--expedition h3,\r\n  .hero--expedition h4,\r\n  .hero--expedition h5 {\r\n    font-size: 9.5vw;\r\n  }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .hero--expedition .title,\r\n  .hero--expedition .title--small,\r\n  .hero--expedition .title--smallest,\r\n  .hero--expedition h2,\r\n  .hero--expedition h3,\r\n  .hero--expedition h4,\r\n  .hero--expedition h5 {\r\n    font-size: 8.5vw;\r\n  }\r\n}\r\n\r\n.hero--expedition .button {\r\n  position: absolute;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  bottom: -90px;\r\n  display: -ms-inline-flexbox;\r\n  display: inline-flex;\r\n  -ms-flex-pack: center;\r\n  justify-content: center;\r\n  margin: 0;\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .hero--expedition .button {\r\n    left: 0;\r\n    right: 0;\r\n    transform: none;\r\n  }\r\n}\r\n\r\n.hero--expedition .dive {\r\n  top: calc(50% + 100vw / 5.4 - 12px);\r\n  transform: translateY(-50%);\r\n}\r\n\r\n@media (max-width: 1024px) {\r\n  .hero--expedition .dive {\r\n    top: 100vh;\r\n    transform: translateY(-100%);\r\n  }\r\n}\r\n\r\n.hero--expedition__navigation {\r\n  transition: all 0.4s;\r\n}\r\n\r\n.hero--expedition__navigation--hidden {\r\n  visibility: hidden;\r\n  opacity: 0;\r\n}\r\n\r\n.hero--expedition__navigation a {\r\n  position: absolute;\r\n  top: calc(50vh - 5px);\r\n  color: #fff;\r\n  z-index: 1001;\r\n}\r\n\r\n.hero--expedition__navigation a i.icon-arrow-left,\r\n.hero--expedition__navigation a i.icon-arrow-right {\r\n  font-size: 2.3rem;\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .hero--expedition__navigation a i.icon-arrow-left,\r\n  .hero--expedition__navigation a i.icon-arrow-right {\r\n    font-size: 1.7rem;\r\n  }\r\n}\r\n\r\n.hero--expedition__navigation__left {\r\n  left: 80px;\r\n}\r\n\r\n@media (max-width: 1024px) {\r\n  .hero--expedition__navigation__left {\r\n    left: 45px;\r\n  }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .hero--expedition__navigation__left {\r\n    left: 15px;\r\n  }\r\n}\r\n\r\n.hero--expedition__navigation__right {\r\n  right: 80px;\r\n}\r\n\r\n@media (max-width: 1024px) {\r\n  .hero--expedition__navigation__right {\r\n    right: 45px;\r\n  }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n  .hero--expedition__navigation__right {\r\n    right: 15px;\r\n  }\r\n}\r\n\r\n.hero--expedition__fill {\r\n  position: absolute;\r\n  background: #cae6f9;\r\n  z-index: 900;\r\n}\r\n\r\n.hero--expedition__fill--left,\r\n.hero--expedition__fill--right {\r\n  height: 100vh;\r\n  top: 0;\r\n  width: calc((100vw - 1280px + 36px) * 0.5 + 10px);\r\n}\r\n\r\n@media (min-width: 1441px) {\r\n  .hero--expedition__fill--left,\r\n  .hero--expedition__fill--right {\r\n    width: calc((100vw - 1360px + 36px) * 0.5 + 10px);\r\n  }\r\n}\r\n\r\n@media (min-width: 1681px) {\r\n  .hero--expedition__fill--left,\r\n  .hero--expedition__fill--right {\r\n    width: calc((100vw - 1600px + 36px) * 0.5 + 10px);\r\n  }\r\n}\r\n\r\n@media (min-width: 1921px) {\r\n  .hero--expedition__fill--left,\r\n  .hero--expedition__fill--right {\r\n    width: calc((100vw - 1840px + 36px) * 0.5 + 10px);\r\n  }\r\n}\r\n\r\n@media (max-width: 1280px) {\r\n  .hero--expedition__fill--left,\r\n  .hero--expedition__fill--right {\r\n    width: 28px;\r\n  }\r\n}\r\n\r\n.hero--expedition__fill--left {\r\n  left: -10px;\r\n  transform-origin: left;\r\n}\r\n\r\n.hero--expedition__fill--right {\r\n  right: -10px;\r\n  transform-origin: right;\r\n}\r\n\r\n.hero--expedition__fill--bottom,\r\n.hero--expedition__fill--top {\r\n  width: 100%;\r\n  height: calc((100vh - 548px) / 2 + 10px);\r\n  left: 0;\r\n}\r\n\r\n@media (min-width: 1441px) {\r\n  .hero--expedition__fill--bottom,\r\n  .hero--expedition__fill--top {\r\n    height: calc((100vh - 680px) / 2 + 10px);\r\n  }\r\n}\r\n\r\n@media (min-width: 1681px) {\r\n  .hero--expedition__fill--bottom,\r\n  .hero--expedition__fill--top {\r\n    height: calc((100vh - 740px) / 2 + 10px);\r\n  }\r\n}\r\n\r\n@media (max-width: 1024px) {\r\n  .hero--expedition__fill--bottom,\r\n  .hero--expedition__fill--top {\r\n    height: calc((100vh - 520px) / 2 + 10px);\r\n  }\r\n}\r\n\r\n.hero--expedition__fill--top {\r\n  transform-origin: top;\r\n  top: -10px;\r\n}\r\n\r\n.hero--expedition__fill--bottom {\r\n  transform-origin: bottom;\r\n  bottom: -10px;\r\n}\r\n@media(max-width: 768px){\r\n  .hero .title{\r\n    font-size: 30px;\r\n  }\r\n}\r\n</style>\r\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Hero.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Hero.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Hero.vue?vue&type=template&id=e4804034&scoped=true&\"\nimport script from \"./Hero.vue?vue&type=script&lang=js&\"\nexport * from \"./Hero.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Hero.vue?vue&type=style&index=0&id=e4804034&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"e4804034\",\n  null\n  \n)\n\nexport default component.exports","import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Hero.vue?vue&type=style&index=0&id=e4804034&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Hero.vue?vue&type=style&index=0&id=e4804034&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"wrap-1500\",attrs:{\"id\":\"aboutmenu\"}},[_c('div',{staticClass:\"nav\"},[_c('router-link',{attrs:{\"to\":\"/about\"}},[_c('Navlink',{attrs:{\"text\":_vm.$t('about.menu.about'),\"menu\":true,\"dark\":false,\"border\":false}})],1),_c('router-link',{attrs:{\"to\":\"/story\"}},[_c('Navlink',{attrs:{\"text\":_vm.$t('about.menu.story'),\"menu\":true,\"dark\":false,\"border\":false}})],1),_c('router-link',{attrs:{\"to\":\"/movie\"}},[_c('Navlink',{attrs:{\"text\":_vm.$t('about.menu.movie'),\"menu\":true,\"dark\":false,\"border\":false}})],1),_c('router-link',{attrs:{\"to\":\"/honor\"}},[_c('Navlink',{attrs:{\"text\":_vm.$t('about.menu.honor'),\"menu\":true,\"dark\":false,\"border\":false}})],1),_c('router-link',{attrs:{\"to\":\"/history\"}},[_c('Navlink',{attrs:{\"text\":_vm.$t('about.menu.history'),\"menu\":true,\"dark\":false,\"border\":false}})],1)],1)])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n  <div id=\"aboutmenu\" class=\"wrap-1500\">\r\n    <div class=\"nav\">\r\n        <!-- <router-link to=\"/\">Home</router-link> -->\r\n        <router-link to=\"/about\" >\r\n          <Navlink :text=\"$t('about.menu.about')\"\r\n            :menu=\"true\"\r\n            :dark=\"false\"\r\n            :border=\"false\" />\r\n        </router-link>\r\n        <router-link to=\"/story\" >\r\n          <Navlink :text=\"$t('about.menu.story')\"\r\n            :menu=\"true\"\r\n            :dark=\"false\"\r\n            :border=\"false\" />\r\n        </router-link>\r\n        <router-link to=\"/movie\" >\r\n          <Navlink :text=\"$t('about.menu.movie')\"\r\n            :menu=\"true\"\r\n            :dark=\"false\"\r\n            :border=\"false\" />\r\n        </router-link>\r\n        <router-link to=\"/honor\" >\r\n          <Navlink :text=\"$t('about.menu.honor')\"\r\n            :menu=\"true\"\r\n            :dark=\"false\"\r\n            :border=\"false\" />\r\n        </router-link>\r\n        <router-link to=\"/history\" >\r\n          <Navlink :text=\"$t('about.menu.history')\"\r\n            :menu=\"true\"\r\n            :dark=\"false\"\r\n            :border=\"false\" />\r\n        </router-link>\r\n      </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport Navlink from '@/components/Navlink.vue'\r\n\r\nexport default {\r\n  components: {\r\n    Navlink\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.wrap-1500 {\r\n  padding: 8px 30px;\r\n  width: 100%;\r\n  margin: 0 auto;\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  max-width: 1500px;\r\n}\r\n\r\n.nav {\r\n  display: flex;\r\n}\r\n@media(max-width: 1366px){\r\n  #aboutmenu{\r\n    padding-left: 20px;\r\n    padding-right: 20px;\r\n    .nav{\r\n      width:80%;\r\n      justify-content: space-between;\r\n      .navlink{\r\n        font-size: 14px;\r\n        width: auto;\r\n      }\r\n    }\r\n  }\r\n}\r\n@media(max-width: 768px){\r\n  #aboutmenu{\r\n    .nav{\r\n      width:100%;\r\n    }\r\n  }\r\n}\r\n</style>\r\n\r\n<style lang=\"scss\">\r\n.router-link-exact-active .navlink.menu {\r\n  color: #5998c4;\r\n  // font-weight: 800;\r\n}\r\n</style>\r\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AboutMenu.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AboutMenu.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./AboutMenu.vue?vue&type=template&id=5353ae12&scoped=true&\"\nimport script from \"./AboutMenu.vue?vue&type=script&lang=js&\"\nexport * from \"./AboutMenu.vue?vue&type=script&lang=js&\"\nimport style0 from \"./AboutMenu.vue?vue&type=style&index=0&id=5353ae12&lang=scss&scoped=true&\"\nimport style1 from \"./AboutMenu.vue?vue&type=style&index=1&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"5353ae12\",\n  null\n  \n)\n\nexport default component.exports","import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AboutMenu.vue?vue&type=style&index=0&id=5353ae12&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AboutMenu.vue?vue&type=style&index=0&id=5353ae12&lang=scss&scoped=true&\"","import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./About.vue?vue&type=style&index=0&id=22c43314&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./About.vue?vue&type=style&index=0&id=22c43314&lang=scss&scoped=true&\"","import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Slide1.vue?vue&type=style&index=0&id=24ef6a63&lang=scss&scoped=true&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Slide1.vue?vue&type=style&index=0&id=24ef6a63&lang=scss&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"main\",attrs:{\"id\":\"about\"}},[_c('Hero',{attrs:{\"backimg\":\"background-image:url(/images/hero-partners.jpg)\",\"title\":((_vm.$t('home.deep.title1')) + \" \" + (_vm.$t('home.deep.title2')) + \" \" + (_vm.$t('home.deep.title3'))),\"sub\":\"\"}}),_c('div',{staticClass:\"color-change\"},[_c('AboutMenu'),_c('Slide1'),_c('div',{staticClass:\"base-wrap wrap-1280 align-center\"},[_c('div',{staticClass:\"item base-title-wrap\"},[_c('div',{staticClass:\"base-title ft-30\"},[_vm._v(_vm._s(_vm.$t('about.base.title')))])]),_c('div',{staticClass:\"item right base-info ft-14\",domProps:{\"innerHTML\":_vm._s(_vm.$t('about.base.text'))}})]),_c('div',{ref:\"imageswrap\",staticClass:\"base-wrap wrap-1500\"},[_c('div',{staticClass:\"item left\"},[_vm._m(0),_c('div',{staticClass:\"base-info ft-14\"},[_vm._v(\"\\n            \"+_vm._s(_vm.$t('about.base.info[0]'))+\"\\n          \")])]),_c('div',{staticClass:\"item right down\"},[_vm._m(1),_c('div',{staticClass:\"base-info ft-14\"},[_vm._v(\"\\n            \"+_vm._s(_vm.$t('about.base.info[1]'))+\"\\n          \")])])]),_c('div',{staticClass:\"text-center wrap-1280\"},[_c('div',{staticClass:\"base-title ft-30\"},[_vm._v(_vm._s(_vm.$t('about.base.title2')))]),_vm._m(2)])],1)],1)}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"img-uncover about1\"},[_c('img',{attrs:{\"src\":\"/images/about1.png\",\"alt\":\"\"}})])},function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"img-uncover about2\"},[_c('img',{attrs:{\"src\":\"/images/about2.png\",\"alt\":\"\"}})])},function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"img-uncover about3\"},[_c('img',{attrs:{\"src\":\"/images/about3.png\",\"alt\":\"\"}})])}]\n\nexport { render, staticRenderFns }","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"product-top\",attrs:{\"id\":\"slide1\"}},[_c('div',{staticClass:\"wrapper-1280 product-top-slider-container\"},[_c('div',{staticClass:\"product-title-wrap\"},[_c('div',{staticClass:\"product-title ft-30\"},[_vm._v(_vm._s(_vm.$t('home.deep.title1'))+\" \"+_vm._s(_vm.$t('home.deep.title2'))+\" \"+_vm._s(_vm.$t('home.deep.title3')))])]),_c('div',{staticClass:\"product-top-slider-container-inner\"},[_vm._m(0),_c('div',{staticClass:\"product-top-slider-nav\"},[_c('div',{staticClass:\"slider-nav-buttons\"},[_c('div',{staticClass:\"slider-nav-item slider-nav-item-prev\",attrs:{\"id\":\"product-top-slider-prev\"},on:{\"click\":_vm.onPaginationPrev}},[_c('div',{staticClass:\"slider-nav-item-icon-container\"},[_c('span',{staticClass:\"slider-nav-item-icon-1\"},[_c('svg',{staticClass:\"icon icon-fleche\"},[_c('use',{attrs:{\"xlink:href\":\"#fleche\"}})])]),_c('span',{staticClass:\"slider-nav-item-icon-2\"},[_c('svg',{staticClass:\"icon icon-fleche\"},[_c('use',{attrs:{\"xlink:href\":\"#fleche\"}})])])])]),_c('div',{staticClass:\"slider-nav-item slider-nav-item-next\",attrs:{\"id\":\"product-top-slider-next\"},on:{\"click\":_vm.onPaginationNext}},[_c('div',{staticClass:\"slider-nav-item-icon-container\"},[_c('span',{staticClass:\"slider-nav-item-icon-1\"},[_c('svg',{staticClass:\"icon icon-fleche\"},[_c('use',{attrs:{\"xlink:href\":\"#fleche\"}})])]),_c('span',{staticClass:\"slider-nav-item-icon-2\"},[_c('svg',{staticClass:\"icon icon-fleche\"},[_c('use',{attrs:{\"xlink:href\":\"#fleche\"}})])])])])]),_vm._m(1),_vm._m(2)])])])])}\nvar staticRenderFns = [function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"product-top-slider\",attrs:{\"id\":\"product-top-slider\",\"data-total\":\"5\"}},[_c('div',{staticClass:\"product-top-slide img-lazyload-container active\"},[_c('img',{staticClass:\"img-lazyload\",attrs:{\"data-lazyload\":\"true\",\"src\":\"/images/slide1-1.jpg\",\"alt\":\"Renne en Finlande\",\"title\":\"Renne\"}})]),_c('div',{staticClass:\"product-top-slide img-lazyload-container\"},[_c('img',{staticClass:\"img-lazyload\",attrs:{\"data-lazyload\":\"true\",\"src\":\"/images/slide1-2.jpg\",\"alt\":\"Chien de traineau en Laponie, Finlande\",\"title\":\"Chien\"}})]),_c('div',{staticClass:\"product-top-slide img-lazyload-container\"},[_c('img',{staticClass:\"img-lazyload\",attrs:{\"data-lazyload\":\"true\",\"src\":\"/images/slide1-3.jpg\",\"alt\":\"Hébergements de Hossa\",\"title\":\"Hébergements\"}})]),_c('div',{staticClass:\"product-top-slide img-lazyload-container\"},[_c('img',{staticClass:\"img-lazyload\",attrs:{\"data-lazyload\":\"true\",\"src\":\"/images/slide1-4.jpg\",\"alt\":\"vacances en Laponie en hiver\",\"title\":\"vacances\"}})]),_c('div',{staticClass:\"product-top-slide img-lazyload-container\"},[_c('img',{staticClass:\"img-lazyload\",attrs:{\"data-lazyload\":\"true\",\"src\":\"/images/slide1-5.jpg\",\"alt\":\"Chien de traîneau en laponie\",\"title\":\"Chien\"}})])])},function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"slider-nav-pagination\"},[_c('span',{staticClass:\"ff-tt ft-60 slider-nav-page\"},[_vm._v(\"01\")]),_c('span',{staticClass:\"ff-tt ft-30 slider-nav-total\"},[_vm._v(\"05\")])])},function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:\"slider-progress slider-nav-progress\",attrs:{\"id\":\"product-top-slider-progress\"}},[_c('div',{staticClass:\"slider-progress-inner\"})])}]\n\nexport { render, staticRenderFns }","<template>\r\n  <div id=\"slide1\" class=\"product-top\">\r\n    <div class=\"wrapper-1280 product-top-slider-container\">\r\n      <div class=\"product-title-wrap\">\r\n        <div class=\"product-title ft-30\">{{$t('home.deep.title1')}} {{$t('home.deep.title2')}} {{$t('home.deep.title3')}}</div>\r\n<!--        <div class=\"product-sub ff-dr ft-14\">Create International Brand, Establish Century-old Business Foundation With Heart And Soul</div>-->\r\n      </div>\r\n      <div class=\"product-top-slider-container-inner\">\r\n        <div class=\"product-top-slider\" id=\"product-top-slider\" data-total=\"5\">\r\n          <div class=\"product-top-slide img-lazyload-container active\">\r\n            <img\r\n              data-lazyload=\"true\"\r\n              class=\"img-lazyload\"\r\n              src=\"/images/slide1-1.jpg\"\r\n              alt=\"Renne en Finlande\"\r\n              title=\"Renne\"\r\n            >\r\n          </div>\r\n          <div class=\"product-top-slide img-lazyload-container\">\r\n            <img\r\n              data-lazyload=\"true\"\r\n              class=\"img-lazyload\"\r\n              src=\"/images/slide1-2.jpg\"\r\n              alt=\"Chien de traineau en Laponie, Finlande\"\r\n              title=\"Chien\"\r\n            >\r\n          </div>\r\n          <div class=\"product-top-slide img-lazyload-container\">\r\n            <img\r\n              data-lazyload=\"true\"\r\n              class=\"img-lazyload\"\r\n              src=\"/images/slide1-3.jpg\"\r\n              alt=\"Hébergements de Hossa\"\r\n              title=\"Hébergements\"\r\n            >\r\n          </div>\r\n          <div class=\"product-top-slide img-lazyload-container\">\r\n            <img\r\n              data-lazyload=\"true\"\r\n              class=\"img-lazyload\"\r\n              src=\"/images/slide1-4.jpg\"\r\n              alt=\"vacances en Laponie en hiver\"\r\n              title=\"vacances\"\r\n            >\r\n          </div>\r\n          <div class=\"product-top-slide img-lazyload-container\">\r\n            <img\r\n              data-lazyload=\"true\"\r\n              class=\"img-lazyload\"\r\n              src=\"/images/slide1-5.jpg\"\r\n              alt=\"Chien de traîneau en laponie\"\r\n              title=\"Chien\"\r\n            >\r\n          </div>\r\n        </div>\r\n        <div class=\"product-top-slider-nav\">\r\n          <div class=\"slider-nav-buttons\">\r\n            <div class=\"slider-nav-item slider-nav-item-prev\" id=\"product-top-slider-prev\"\r\n            @click=\"onPaginationPrev\">\r\n              <div class=\"slider-nav-item-icon-container\">\r\n                <span class=\"slider-nav-item-icon-1\">\r\n                  <svg class=\"icon icon-fleche\">\r\n                    <use xlink:href=\"#fleche\"></use>\r\n                  </svg>\r\n                </span>\r\n                <span class=\"slider-nav-item-icon-2\">\r\n                  <svg class=\"icon icon-fleche\">\r\n                    <use xlink:href=\"#fleche\"></use>\r\n                  </svg>\r\n                </span>\r\n              </div>\r\n            </div>\r\n            <div class=\"slider-nav-item slider-nav-item-next\" id=\"product-top-slider-next\"\r\n            @click=\"onPaginationNext\">\r\n              <div class=\"slider-nav-item-icon-container\">\r\n                <span class=\"slider-nav-item-icon-1\">\r\n                  <svg class=\"icon icon-fleche\">\r\n                    <use xlink:href=\"#fleche\"></use>\r\n                  </svg>\r\n                </span>\r\n                <span class=\"slider-nav-item-icon-2\">\r\n                  <svg class=\"icon icon-fleche\">\r\n                    <use xlink:href=\"#fleche\"></use>\r\n                  </svg>\r\n                </span>\r\n              </div>\r\n            </div>\r\n          </div>\r\n\r\n          <div class=\"slider-nav-pagination\">\r\n            <span class=\"ff-tt ft-60 slider-nav-page\">01</span>\r\n            <span class=\"ff-tt ft-30 slider-nav-total\">05</span>\r\n          </div>\r\n\r\n          <!-- Progress bar -->\r\n          <div class=\"slider-progress slider-nav-progress\" id=\"product-top-slider-progress\">\r\n            <div class=\"slider-progress-inner\"></div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport Slider from '@/n66/slider.js'\r\nimport {\r\n  qs, qsa, domAddClass, domRemoveClass\r\n} from '@/util/dom.js'\r\nimport { TweenMax, TimelineLite, TweenLite, Power3, Expo } from 'gsap/TweenMax'\r\n\r\nexport default {\r\n  beforeDestroy () {\r\n    this.tlAutoplayTopSlider && this.tlAutoplayTopSlider.kill()\r\n    this.tlAutoplayTopSlider = null\r\n  },\r\n\r\n  mounted () {\r\n    this.autoplayTopSlider = true\r\n\r\n    this.init()\r\n  },\r\n\r\n  methods: {\r\n    init () {\r\n      this.initDOM()\r\n\r\n      this.topSlider =\r\n        new Slider('product-top-slider', this.onSliderTopChange, true, true)\r\n\r\n      if (this.topSlider.total === 0 || this.topSlider.total === 1) {\r\n        this.topSliderNav.addClass('disable')\r\n      }\r\n\r\n      this.setAutoSlideTopSlider()\r\n    },\r\n\r\n    initDOM () {\r\n      this.DomTopSlider = qs('.product-top-slider', this.$el)\r\n      this.topSlides = qsa('.product-top-slide', this.$el)\r\n      this.topSliderNavPage = qs('.slider-nav-page', this.$el)\r\n      this.topSliderNav = qs('.product-top-slider-nav', this.$el)\r\n    },\r\n\r\n    setAutoSlideTopSlider () {\r\n      this.tlAutoplayTopSlider = TweenMax.delayedCall(5, function () {\r\n        this.autoplayTopSlider && this.slideTopSlider()\r\n      }.bind(this))\r\n    },\r\n\r\n    slideTopSlider () {\r\n      this.tlAutoplayTopSlider.kill()\r\n      this.topSlider.next()\r\n    },\r\n\r\n    onSliderTopChange (t, e) {\r\n      var i = this\r\n      i.topSlider.canSlide = false\r\n      i.tlAutoplayTopSlider && i.tlAutoplayTopSlider.kill()\r\n      var n = qsa('.active', i.DomTopSlider)\r\n      var r = i.topSlides[t]\r\n      var o = qsa('.active img', i.DomTopSlider)\r\n      var a = qs('img', r)\r\n      var l = i.DomTopSlider.offsetHeight\r\n      var h = new TimelineLite({\r\n        onComplete: function () {\r\n          domRemoveClass(n[0], 'active')\r\n          domAddClass(r, 'active')\r\n          i.topSlider.canSlide = true\r\n          i.setAutoSlideTopSlider()\r\n        }\r\n      })\r\n\r\n      h.to(n, 1, {\r\n        opacity: 1,\r\n        y: e * -l,\r\n        ease: Power3.easeInOut\r\n      }).to(o, 1, {\r\n        opacity: 1,\r\n        y: e * l / 1.5,\r\n        ease: Power3.easeInOut\r\n      }, 0)\r\n\r\n      h.set(r, {\r\n        opacity: 1,\r\n        y: e * l\r\n      }, 0).set(a, {\r\n        opacity: 1,\r\n        y: e * -l / 1.5\r\n      }, 0).to(r, 1, {\r\n        opacity: 1,\r\n        y: 0,\r\n        ease: Power3.easeInOut\r\n      }, 0).to(a, 1, {\r\n        opacity: 1,\r\n        y: 0,\r\n        ease: Power3.easeInOut\r\n      }, 0)\r\n\r\n      this.updateTopNavPage()\r\n    },\r\n\r\n    updateTopNavPage () {\r\n      var t = this.topSlider.page + 1\r\n      t < 10 && (t = '0' + t)\r\n      TweenLite.to(this.topSliderNavPage, 0.8, {\r\n        y: 80,\r\n        ease: Expo.easeIn,\r\n        onComplete: function () {\r\n          this.topSliderNavPage.innerHTML = t\r\n          TweenLite.set(this.topSliderNavPage, {\r\n            y: -80,\r\n            ease: Expo.easeOut\r\n          })\r\n          TweenLite.to(this.topSliderNavPage, 0.8, {\r\n            y: 0,\r\n            ease: Expo.easeOut\r\n          })\r\n        }.bind(this)\r\n      }, 0)\r\n    },\r\n\r\n    onPaginationNext () {\r\n      this.topSlider.sens = 1\r\n      this.topSlider.set()\r\n    },\r\n\r\n    onPaginationPrev () {\r\n      this.topSlider.sens = -1\r\n      this.topSlider.set()\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.product-title-wrap {\r\n  margin-top: 60px;\r\n  text-align: center;\r\n\r\n  .product-title {\r\n    line-height: 60px;\r\n    color: #09192a;\r\n    width:70%;\r\n    margin-left: 15%;\r\n  }\r\n  .product-sub {\r\n    line-height: 32px;\r\n    color: #82a6be;\r\n  }\r\n}\r\n.slider-nav-buttons {\r\n  position: relative;\r\n  padding-top: 145px;\r\n}\r\n\r\n.slider-nav-item {\r\n  display: block;\r\n  margin: 0 auto;\r\n  width: 60px;\r\n  height: 60px;\r\n  position: relative;\r\n  margin-bottom: 16px;\r\n  -webkit-transition: opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  cursor: pointer;\r\n}\r\n\r\n.slider-nav-item:after,\r\n.slider-nav-item:before {\r\n  content: \"\";\r\n  display: block;\r\n  border: 4px solid #2e3448;\r\n  border-radius: 100%;\r\n  position: absolute;\r\n  width: 52px;\r\n  height: 52px;\r\n  left: 0;\r\n  top: 0;\r\n}\r\n\r\n.slider-nav-item:before {\r\n  -webkit-transform: scale(1);\r\n  transform: scale(1);\r\n  -webkit-transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 80ms,\r\n    -webkit-transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 80ms;\r\n  transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 80ms,\r\n    -webkit-transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 80ms;\r\n  transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 80ms,\r\n    transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 80ms;\r\n  transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 80ms,\r\n    transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 80ms,\r\n    -webkit-transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 80ms;\r\n}\r\n\r\n.slider-nav-item:after {\r\n  border-color: #96daf0;\r\n  opacity: 0;\r\n  -webkit-transform: scale(1.3);\r\n  transform: scale(1.3);\r\n  -webkit-transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n  transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n  transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n  transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),\r\n    -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n}\r\n\r\n.slider-nav-item-icon-container {\r\n  position: absolute;\r\n  top: 4px;\r\n  left: 4px;\r\n  width: 52px;\r\n  height: 52px;\r\n  border-radius: 100%;\r\n  overflow: hidden;\r\n}\r\n\r\n.slider-nav-item .icon {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  margin-top: -8px;\r\n  margin-left: -8px;\r\n  width: 16px;\r\n  height: 16px;\r\n  fill: #fff;\r\n  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n}\r\n\r\n.slider-nav-item-icon-1,\r\n.slider-nav-item-icon-2 {\r\n  position: absolute;\r\n  width: 100%;\r\n  height: 100%;\r\n  top: 0;\r\n  left: 0;\r\n  opacity: 1;\r\n  -webkit-transition: opacity 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s,\r\n    -webkit-transform 0s cubic-bezier(0.77, 0, 0.175, 1) 0s;\r\n  transition: opacity 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s,\r\n    -webkit-transform 0s cubic-bezier(0.77, 0, 0.175, 1) 0s;\r\n  transition: transform 0s cubic-bezier(0.77, 0, 0.175, 1) 0s,\r\n    opacity 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s;\r\n  transition: transform 0s cubic-bezier(0.77, 0, 0.175, 1) 0s,\r\n    opacity 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s,\r\n    -webkit-transform 0s cubic-bezier(0.77, 0, 0.175, 1) 0s;\r\n}\r\n\r\n.slider-nav-item-icon-2 {\r\n  opacity: 0;\r\n  -webkit-transform: translateX(-80px);\r\n  transform: translateX(-80px);\r\n  -webkit-transition: opacity 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s,\r\n    -webkit-transform 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s;\r\n  transition: opacity 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s,\r\n    -webkit-transform 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s;\r\n  transition: transform 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s,\r\n    opacity 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s;\r\n  transition: transform 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s,\r\n    opacity 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s,\r\n    -webkit-transform 0s cubic-bezier(0.165, 0.84, 0.44, 1) 0s;\r\n}\r\n\r\n.slider-nav-item-prev .icon {\r\n  -webkit-transform: scaleX(-1);\r\n  transform: scaleX(-1);\r\n}\r\n\r\n.slider-nav-item-prev .slider-nav-item-icon-2 {\r\n  -webkit-transform: translateX(80px);\r\n  transform: translateX(80px);\r\n}\r\n\r\n.slider-nav-item:hover:after {\r\n  opacity: 1;\r\n  -webkit-transform: scale(1);\r\n  transform: scale(1);\r\n  -webkit-transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 50ms,\r\n    -webkit-transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 50ms;\r\n  transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 50ms,\r\n    -webkit-transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 50ms;\r\n  transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 50ms,\r\n    transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 50ms;\r\n  transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1) 50ms,\r\n    transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 50ms,\r\n    -webkit-transform 0.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) 50ms;\r\n}\r\n\r\n.slider-nav-item:hover:before {\r\n  opacity: 0;\r\n  -webkit-transform: scale(0.7);\r\n  transform: scale(0.7);\r\n  -webkit-transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n  transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n  transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n  transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),\r\n    -webkit-transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);\r\n}\r\n\r\n.slider-nav-item:hover .slider-nav-item-icon-1 {\r\n  opacity: 0;\r\n  -webkit-transform: translateX(80px);\r\n  transform: translateX(80px);\r\n  -webkit-transition: opacity 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    -webkit-transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);\r\n  transition: opacity 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    -webkit-transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);\r\n  transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    opacity 0.6s cubic-bezier(0.77, 0, 0.175, 1);\r\n  transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    opacity 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    -webkit-transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);\r\n}\r\n\r\n.slider-nav-item:hover .slider-nav-item-icon-2 {\r\n  opacity: 1;\r\n  -webkit-transform: translateX(0);\r\n  transform: translateX(0);\r\n  -webkit-transition: opacity 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    -webkit-transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);\r\n  transition: opacity 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    -webkit-transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);\r\n  transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    opacity 0.6s cubic-bezier(0.77, 0, 0.175, 1);\r\n  transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    opacity 0.6s cubic-bezier(0.77, 0, 0.175, 1),\r\n    -webkit-transform 0.6s cubic-bezier(0.77, 0, 0.175, 1);\r\n}\r\n\r\n.slider-nav-item-prev:hover .slider-nav-item-icon-1 {\r\n  -webkit-transform: translateX(-80px);\r\n  transform: translateX(-80px);\r\n}\r\n\r\n.slider-nav-pagination {\r\n  display: block;\r\n  color: #fff;\r\n  position: relative;\r\n  margin-top: 60px;\r\n  overflow: hidden;\r\n  height: 50px;\r\n  padding-top: 16px;\r\n  padding-bottom: 16px;\r\n  box-sizing: content-box;\r\n}\r\n\r\n.slider-nav-page {\r\n  color: #fff;\r\n  width: 85px;\r\n  line-height: 50px;\r\n  display: inline-block;\r\n  text-align: center;\r\n  margin-left: -42px;\r\n}\r\n\r\n.slider-nav-total {\r\n  color: #2e3448;\r\n  display: inline-block;\r\n}\r\n\r\n.slider-nav-progress {\r\n  width: 160px;\r\n  height: 2px;\r\n  background-color: #2e3448;\r\n  position: relative;\r\n  margin-top: 0;\r\n}\r\n\r\n.slider-nav-progress-bar {\r\n  background-color: #96daf0;\r\n  height: 2px;\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  width: 20px;\r\n  -webkit-transition: width 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: width 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n}\r\n\r\n.slider-nav-progress-bar.complete-right {\r\n  right: 0;\r\n  left: auto;\r\n  -webkit-transition: width 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: width 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n}\r\n\r\n.slider-nav-progress-bar.complete-left {\r\n  left: 0;\r\n  -webkit-transition: width 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: width 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n}\r\n\r\n@media (max-width: 960px) {\r\n  .slider-nav {\r\n    width: 100%;\r\n    height: 290px;\r\n    position: relative;\r\n    top: 180px;\r\n  }\r\n\r\n  .slider-nav-buttons,\r\n  .slider-nav-pagination {\r\n    display: none;\r\n  }\r\n\r\n  .slider-nav-container {\r\n    max-width: 100%;\r\n    width: 100%;\r\n    padding: 0;\r\n  }\r\n\r\n  .slider-nav-progress {\r\n    position: absolute;\r\n    bottom: 30px;\r\n    left: 50%;\r\n    margin-left: -40px;\r\n    width: 80px;\r\n  }\r\n\r\n  .slider-selection-slides {\r\n    top: 0;\r\n    margin-top: 0;\r\n    left: 50%;\r\n    margin-left: -202px;\r\n  }\r\n}\r\n\r\n.wrapper-1280 {\r\n  width: 100%;\r\n  max-width: 1280px;\r\n  margin: 0 auto;\r\n}\r\n\r\n.product-top {\r\n  padding-top: 40px;\r\n  // font-size: 0;\r\n  line-height: 0;\r\n  position: relative;\r\n  padding-bottom: 80px;\r\n}\r\n\r\n.product-top-slider-container-inner {\r\n  position: relative;\r\n  top: 200px;\r\n  margin-top: -150px;\r\n}\r\n\r\n.product-top-slider {\r\n  position: relative;\r\n  height: 0;\r\n  // padding-bottom: 41.8%;\r\n  padding-bottom: 48.125%;\r\n  overflow: hidden;\r\n  background-color: #96daf0;\r\n}\r\n\r\n.product-top-slide {\r\n  position: absolute;\r\n  left: 0;\r\n  top: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  opacity: 0;\r\n  overflow: hidden;\r\n}\r\n\r\n.product-top-slide.active {\r\n  opacity: 1;\r\n}\r\n\r\n.product-top-slide img {\r\n  position: absolute;\r\n  left: 0;\r\n  top: 0;\r\n  width: 100%;\r\n}\r\n\r\n.product-top-slider-nav {\r\n  display: block;\r\n  position: absolute;\r\n  z-index: 10;\r\n  bottom: 50px;\r\n  left: 30px;\r\n  text-align: center;\r\n}\r\n\r\n.product-top-slider-nav.disable .slider-nav-item {\r\n  opacity: 0.4;\r\n  pointer-events: none;\r\n}\r\n\r\n.product-top-slider-nav .slider-nav-buttons {\r\n  margin-left: -40px;\r\n}\r\n\r\n.product-top-slider-nav .slider-nav-item:before {\r\n  opacity: 0.2;\r\n  border-color: #fff;\r\n}\r\n\r\n.product-top-slider-nav .slider-nav-item:hover:before {\r\n  opacity: 0;\r\n}\r\n\r\n.product-top-slider-nav .slider-nav-total {\r\n  color: #fff;\r\n  opacity: 0.2;\r\n}\r\n\r\n.product-top-slider-nav .slider-nav-progress {\r\n  width: 120px;\r\n  background-color: rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.product-top-slider-nav .slider-nav-page {\r\n  margin-left: -12px;\r\n}\r\n\r\n.product-top-slide {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n}\r\n\r\n.animate .product-top .page-head-bottom-item:after {\r\n  opacity: 0;\r\n}\r\n\r\n.animate .product-top .page-head-bottom-item-txt {\r\n  opacity: 0;\r\n  -webkit-transform: translateY(80px);\r\n  transform: translateY(80px);\r\n}\r\n\r\n.animate .product-top .page-head-bottom-item-icon {\r\n  -webkit-transform: translateY(80px);\r\n  transform: translateY(80px);\r\n}\r\n\r\n.animate .product-top .page-head-bottom-item-icon:before {\r\n  opacity: 0;\r\n  -webkit-transform: scale(1.4);\r\n  transform: scale(1.4);\r\n}\r\n\r\n.animate .product-top .page-head-bottom-item-icon .icon {\r\n  opacity: 0;\r\n  -webkit-transform: scale(1);\r\n  transform: scale(1);\r\n}\r\n\r\n.animate .product-top.visible .page-head-bottom-item:after {\r\n  opacity: 0.1;\r\n  -webkit-transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955);\r\n  transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955);\r\n}\r\n\r\n.animate .product-top.visible .page-head-bottom-item-txt {\r\n  opacity: 1;\r\n  -webkit-transform: translateY(0);\r\n  transform: translateY(0);\r\n  -webkit-transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    -webkit-transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    -webkit-transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    -webkit-transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n}\r\n\r\n.animate .product-top.visible .page-head-bottom-item-icon {\r\n  -webkit-transform: translateY(0);\r\n  transform: translateY(0);\r\n  -webkit-transition: -webkit-transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: -webkit-transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    -webkit-transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n}\r\n\r\n.animate .product-top.visible .page-head-bottom-item-icon:before {\r\n  opacity: 0.2;\r\n  -webkit-transform: scale(1);\r\n  transform: scale(1);\r\n  -webkit-transition: opacity 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    -webkit-transform 0.8s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n}\r\n\r\n.animate .product-top.visible .page-head-bottom-item-icon .icon {\r\n  opacity: 1;\r\n  -webkit-transform: scale(1);\r\n  transform: scale(1);\r\n  -webkit-transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    -webkit-transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    -webkit-transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n  transition: opacity 1s cubic-bezier(0.455, 0.03, 0.515, 0.955),\r\n    transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1),\r\n    -webkit-transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);\r\n}\r\n\r\n.animate .product-top.visible .page-head-bottom-item:nth-child(1):after {\r\n  -webkit-transition-delay: 0s;\r\n  transition-delay: 0s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(1)\r\n  .page-head-bottom-item-icon {\r\n  -webkit-transition-delay: 0s;\r\n  transition-delay: 0s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(1)\r\n  .page-head-bottom-item-txt {\r\n  -webkit-transition-delay: 0.15s;\r\n  transition-delay: 0.15s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(1)\r\n  .page-head-bottom-item-icon:before {\r\n  -webkit-transition-delay: 0.3s;\r\n  transition-delay: 0.3s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(1)\r\n  .page-head-bottom-item-icon\r\n  .icon {\r\n  -webkit-transition-delay: 0s;\r\n  transition-delay: 0s;\r\n}\r\n\r\n.animate .product-top.visible .page-head-bottom-item:nth-child(2):after {\r\n  -webkit-transition-delay: 0.2s;\r\n  transition-delay: 0.2s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(2)\r\n  .page-head-bottom-item-icon {\r\n  -webkit-transition-delay: 0.2s;\r\n  transition-delay: 0.2s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(2)\r\n  .page-head-bottom-item-txt {\r\n  -webkit-transition-delay: 0.35s;\r\n  transition-delay: 0.35s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(2)\r\n  .page-head-bottom-item-icon:before {\r\n  -webkit-transition-delay: 0.5s;\r\n  transition-delay: 0.5s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(2)\r\n  .page-head-bottom-item-icon\r\n  .icon {\r\n  -webkit-transition-delay: 0.2s;\r\n  transition-delay: 0.2s;\r\n}\r\n\r\n.animate .product-top.visible .page-head-bottom-item:nth-child(3):after {\r\n  -webkit-transition-delay: 0.4s;\r\n  transition-delay: 0.4s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(3)\r\n  .page-head-bottom-item-icon {\r\n  -webkit-transition-delay: 0.4s;\r\n  transition-delay: 0.4s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(3)\r\n  .page-head-bottom-item-txt {\r\n  -webkit-transition-delay: 0.55s;\r\n  transition-delay: 0.55s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(3)\r\n  .page-head-bottom-item-icon:before {\r\n  -webkit-transition-delay: 0.7s;\r\n  transition-delay: 0.7s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(3)\r\n  .page-head-bottom-item-icon\r\n  .icon {\r\n  -webkit-transition-delay: 0.4s;\r\n  transition-delay: 0.4s;\r\n}\r\n\r\n.animate .product-top.visible .page-head-bottom-item:nth-child(4):after {\r\n  -webkit-transition-delay: 0.6s;\r\n  transition-delay: 0.6s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(4)\r\n  .page-head-bottom-item-icon {\r\n  -webkit-transition-delay: 0.6s;\r\n  transition-delay: 0.6s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(4)\r\n  .page-head-bottom-item-txt {\r\n  -webkit-transition-delay: 0.75s;\r\n  transition-delay: 0.75s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(4)\r\n  .page-head-bottom-item-icon:before {\r\n  -webkit-transition-delay: 0.9s;\r\n  transition-delay: 0.9s;\r\n}\r\n\r\n.animate\r\n  .product-top.visible\r\n  .page-head-bottom-item:nth-child(4)\r\n  .page-head-bottom-item-icon\r\n  .icon {\r\n  -webkit-transition-delay: 0.6s;\r\n  transition-delay: 0.6s;\r\n}\r\n\r\n.animate .product-top.visible:after {\r\n  opacity: 1;\r\n  -webkit-transition: opacity 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955);\r\n  transition: opacity 0.8s cubic-bezier(0.455, 0.03, 0.515, 0.955);\r\n}\r\n@media(max-width: 768px){\r\n  .product-title-wrap .product-title{\r\n    font-size: 20px;\r\n    line-height: normal;\r\n    padding: 17px 0;\r\n  }\r\n  .product-top-slider-nav{\r\n    width: 100%;\r\n    bottom: auto;\r\n    top: 50%;\r\n    left: 0;\r\n  }\r\n  .slider-nav-buttons{\r\n    display: block;\r\n    padding-top: 0;\r\n    margin-left: 0 !important;\r\n    .slider-nav-item{\r\n      position: absolute;\r\n      margin-bottom: 0;\r\n      width: 30px;\r\n      height: 30px;\r\n      &.slider-nav-item-prev{\r\n        left: 0;\r\n      }\r\n      &.slider-nav-item-next{\r\n        left: 100%;\r\n        transform: translateX(-100%);\r\n      }\r\n      &::after,\r\n      &::before{\r\n        width: 26px;\r\n        height: 26px;\r\n        border-width: 2px;\r\n      }\r\n      .slider-nav-item-icon-container{\r\n        top: 2px;\r\n        left: 2px;\r\n        width: 26px;\r\n        height: 26px;\r\n      }\r\n    }\r\n  }\r\n  .slider-nav-progress{\r\n    display: none;\r\n  }\r\n}\r\n</style>\r\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Slide1.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Slide1.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Slide1.vue?vue&type=template&id=24ef6a63&scoped=true&\"\nimport script from \"./Slide1.vue?vue&type=script&lang=js&\"\nexport * from \"./Slide1.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Slide1.vue?vue&type=style&index=0&id=24ef6a63&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"24ef6a63\",\n  null\n  \n)\n\nexport default component.exports","<template>\r\n  <div id=\"about\" class=\"main\">\r\n    <Hero backimg=\"background-image:url(/images/hero-partners.jpg)\"\r\n      :title=\"`${$t('home.deep.title1')} ${$t('home.deep.title2')} ${$t('home.deep.title3')}`\"\r\n      sub=\"\" />\r\n\r\n    <div class=\"color-change\">\r\n      <AboutMenu />\r\n\r\n      <Slide1 />\r\n\r\n      <div class=\"base-wrap wrap-1280 align-center\">\r\n        <div class=\"item base-title-wrap\">\r\n          <div class=\"base-title ft-30\">{{$t('about.base.title')}}</div>\r\n<!--          <div class=\"base-sub ff-br ft-16\">-->\r\n<!--            China's Large Tuna Production Base-->\r\n<!--          </div>-->\r\n        </div>\r\n        <div class=\"item right base-info ft-14\" v-html=\"$t('about.base.text')\"></div>\r\n      </div>\r\n\r\n      <div ref=\"imageswrap\" class=\"base-wrap wrap-1500\">\r\n        <div class=\"item left\">\r\n          <div class=\"img-uncover about1\">\r\n            <img src=\"/images/about1.png\" alt=\"\">\r\n          </div>\r\n          <div class=\"base-info ft-14\">\r\n            {{$t('about.base.info[0]')}}\r\n          </div>\r\n        </div>\r\n        <div class=\"item right down\">\r\n          <div class=\"img-uncover about2\">\r\n            <img src=\"/images/about2.png\" alt=\"\">\r\n          </div>\r\n          <div class=\"base-info ft-14\">\r\n            {{$t('about.base.info[1]')}}\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <div class=\"text-center wrap-1280\">\r\n        <div class=\"base-title ft-30\">{{$t('about.base.title2')}}</div>\r\n<!--        <div class=\"base-sub ff-dr ft-14\">-->\r\n<!--          Healthy, Tasty Becomes Wealthy Innovation-->\r\n<!--        </div>-->\r\n\r\n        <div class=\"img-uncover about3\">\r\n          <img src=\"/images/about3.png\" alt=\"\">\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport Hero from '@/components/Hero.vue'\r\nimport AboutMenu from '@/components/AboutMenu.vue'\r\nimport Slide1 from '@/components/Slide1.vue'\r\nimport scroll from '@/oceanSchool/scroll.js'\r\nimport {\r\n  qsa, domAddClass, domRemoveClass\r\n} from '@/util/dom.js'\r\n\r\nexport default {\r\n  components: {\r\n    Hero,\r\n    AboutMenu,\r\n    Slide1\r\n  },\r\n\r\n  beforeDestroy () {\r\n    scroll.unbind('show-img')\r\n  },\r\n\r\n  mounted () {\r\n    document.title = `${this.$t('nav.about')}-${this.$t('title')}`\r\n    this.$nextTick(() => {\r\n      if (window.scrollBar) window.scrollBar.scrollTop = 0\r\n\r\n      // setTimeout(() => {\r\n      //   this.loader.hide()\r\n      // }, 300)\r\n\r\n      scroll.bind('show-img', this.scrollShowImgs)\r\n    })\r\n  },\r\n\r\n  methods: {\r\n    scrollShowImgs () {\r\n      if (!this.$refs.imageswrap) return\r\n      const imgs = qsa('.img-uncover', this.$el)\r\n\r\n      for (let i = 0, len = imgs.length; i < len; i++) {\r\n        const img = imgs[i]\r\n        this.showImg(img)\r\n      }\r\n    },\r\n\r\n    showImg (img) {\r\n      const { top } = img.getBoundingClientRect()\r\n\r\n      if (top < window.innerHeight) {\r\n        domAddClass(img, 'show')\r\n      } else {\r\n        domRemoveClass(img, 'show')\r\n      }\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.main, .color-change {\r\n  background: linear-gradient(#cae6f9, #cae6f9, #fff);\r\n}\r\n\r\n.wrap-1280 {\r\n  max-width: 1280px;\r\n}\r\n.wrap-1500 {\r\n  max-width: 1500px;\r\n}\r\n\r\n.img-uncover img {\r\n  width: 100%;\r\n  margin-bottom: 32px;\r\n}\r\n\r\n.base-title {\r\n  line-height: 60px;\r\n  color: #09192a\r\n}\r\n.base-sub {\r\n  line-height: 32px;\r\n  color: #82a6be;\r\n}\r\n\r\n.text-center {\r\n  text-align: center;\r\n  padding: 100px 30px 30px 30px;\r\n  width: 100%;\r\n  margin: 0 auto;\r\n\r\n  .img-uncover {\r\n    margin-top: 48px;\r\n  }\r\n}\r\n.base-wrap.align-center {\r\n  padding: 160px 30px 30px 30px;\r\n  align-items: center;\r\n}\r\n.base-wrap {\r\n  padding: 30px;\r\n  width: 100%;\r\n  margin: 0 auto;\r\n  display: flex;\r\n  justify-content: space-between;\r\n\r\n  .down {\r\n    margin-top: 120px;\r\n  }\r\n  .item {\r\n    flex: 1;\r\n  }\r\n  .left {\r\n    margin-right: 32px;\r\n  }\r\n  .right {\r\n    margin-left: 32px;\r\n  }\r\n\r\n  .base-info {\r\n    line-height: 28px;\r\n    color: #3c546e;\r\n  }\r\n}\r\n\r\n.img-uncover {\r\n  position: relative;\r\n  overflow: hidden;\r\n  display: inline-block;\r\n  width: 100%;\r\n\r\n  img {\r\n    width: 100%;\r\n    transform: scale(1.2);\r\n    transition: transform 1.4s cubic-bezier(0.215, 0.61, 0.355, 1);\r\n  }\r\n\r\n  &.show:hover img {\r\n    transition-delay: 0s;\r\n    transform: scale(1.02);\r\n  }\r\n\r\n  &:after {\r\n    content: \"\";\r\n    display: block;\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    right: 0;\r\n    width: 110%;\r\n    height: 110%;\r\n    // background: #f1f1f1;\r\n    transition: transform 1s cubic-bezier(.77,.15,0,.99);\r\n    z-index: 4;\r\n  }\r\n\r\n  &.grey:after {\r\n    background: #ededed;\r\n  }\r\n\r\n  &.show {\r\n    &:after {\r\n      transform: translateY(-100%);\r\n    }\r\n    img {\r\n      //transition-delay: 0.4s;\r\n      transform: scale(1);\r\n    }\r\n  }\r\n}\r\n\r\n.about1:after {\r\n  background: rgb(215, 232, 249)\r\n}\r\n.about2:after {\r\n  background: rgb(217, 234, 249)\r\n}\r\n.about3:after {\r\n  background: rgb(238, 246, 252)\r\n}\r\n@media(max-width: 768px){\r\n  .base-wrap{\r\n    flex-direction: column;\r\n    align-items: initial !important;\r\n    .right{\r\n      margin-left: 0;\r\n      margin-top: 30px;\r\n    }\r\n    .left{\r\n      margin-right: 0;\r\n    }\r\n  }\r\n  .base-title{\r\n    font-size: 20px;\r\n    line-height: normal;\r\n    padding: 17px 0;\r\n  }\r\n}\r\n</style>\r\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./About.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./About.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./About.vue?vue&type=template&id=22c43314&scoped=true&\"\nimport script from \"./About.vue?vue&type=script&lang=js&\"\nexport * from \"./About.vue?vue&type=script&lang=js&\"\nimport style0 from \"./About.vue?vue&type=style&index=0&id=22c43314&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"22c43314\",\n  null\n  \n)\n\nexport default component.exports","import mod from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AboutMenu.vue?vue&type=style&index=1&lang=scss&\"; export default mod; export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--8-oneOf-1-3!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./AboutMenu.vue?vue&type=style&index=1&lang=scss&\""],"sourceRoot":""}