{"id":9,"date":"2015-12-02T10:51:51","date_gmt":"2015-12-02T10:51:51","guid":{"rendered":"http:\/\/theme-fusion.com\/avada\/university\/?page_id=9"},"modified":"2024-02-15T13:41:01","modified_gmt":"2024-02-15T05:41:01","slug":"history","status":"publish","type":"page","link":"https:\/\/microcosm.com.cn\/zh\/history\/","title":{"rendered":"\u516c\u53f8\u6cbf\u9769"},"content":{"rendered":"<div class=\"fusion-fullwidth fullwidth-box fusion-builder-row-1 fusion-flex-container has-pattern-background has-mask-background nonhundred-percent-fullwidth non-hundred-percent-height-scrolling\" style=\"--awb-border-radius-top-left:0px;--awb-border-radius-top-right:0px;--awb-border-radius-bottom-right:0px;--awb-border-radius-bottom-left:0px;--awb-padding-right:0px;--awb-padding-left:0px;--awb-margin-top:0px;--awb-margin-bottom:0px;--awb-background-color:#000000;--awb-background-image:linear-gradient(180deg, #000000 0%,rgba(255,255,255,0) 100%);--awb-flex-wrap:wrap;\" ><div class=\"fusion-builder-row fusion-row fusion-flex-align-items-center fusion-flex-content-wrap\" style=\"max-width:93.6%;margin-left: calc(-4% \/ 2 );margin-right: calc(-4% \/ 2 );\"><div class=\"fusion-layout-column fusion_builder_column fusion-builder-column-0 fusion-flex-column\" style=\"--awb-bg-color:#ffffff;--awb-bg-color-hover:#ffffff;--awb-bg-size:cover;--awb-width-large:100%;--awb-margin-top-large:0px;--awb-spacing-right-large:0.096%;--awb-margin-bottom-large:0px;--awb-spacing-left-large:0%;--awb-width-medium:100%;--awb-order-medium:0;--awb-spacing-right-medium:1.92%;--awb-spacing-left-medium:1.92%;--awb-width-small:100%;--awb-order-small:0;--awb-spacing-right-small:1.92%;--awb-spacing-left-small:1.92%;\"><div class=\"fusion-column-wrapper fusion-column-has-shadow fusion-flex-justify-content-flex-start fusion-content-layout-column\"><script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/Swiper\/3.4.2\/js\/swiper.min.js\"><\/script>\n  <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/Swiper\/3.4.2\/css\/swiper.min.css\">\n  <link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css?family=Open+Sans:300,400,700,800\">\n  <style>\t\t\n\t\t\t\t\t\t\t\t\t\t\t\n    \t\t\t\t\thtml,\n    body,\n    .container {\n      height: 100%;\n      width: 100%;\n    }\n\n    body {\n      font-family: \"Open Sans\", sans-serif;\n      font-size: 14px;\n    }\n\n    .container {\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      flex-direction: column;\n      padding: 0;\n    }\n\n    .timeline {\n      width: 100%;\n      box-shadow: 0 5px 25px 5px rgba(0, 0, 0, 0.2);\n    }\n    .timeline .swiper-container {\n      height: 600px;\n      width: 100%;\n      position: relative;\n    }\n    .timeline .swiper-wrapper {\n      transition: 2s cubic-bezier(0.68, -0.4, 0.27, 1.34) 0.2s;\n    }\n    .timeline .swiper-slide {\n      position: relative;\n      color: #fff;\n      overflow: hidden;\n      background-size: cover;\n      background-repeat: no-repeat;\n      background-position: center center;\n    }\n    .timeline .swiper-slide::after {\n      content: \"\";\n      position: absolute;\n      z-index: 1;\n      right: -115%;\n      bottom: -10%;\n      width: 100%;\n      height: 100%;\n      background-color: rgba(0, 0, 0, 0.7);\n      box-shadow: -230px 0 150px 60vw rgba(0, 0, 0, 0.7);\n      border-radius: 100%;\n    }\n    .timeline .swiper-slide-content {\n      height: 40%;\n      position: absolute;\n      text-align: center;\n      width: 80%;\n      max-width: 600px;\n      right: 50%;\n      top: 13%;\n      transform: translate(50%, 0);\n      font-size: 12px;\n      z-index: 2;\n    }\n    .timeline .swiper-slide .timeline-year {\n      display: block;\n      font-style: italic;\n      font-size: 42px;\n      margin-bottom: 50px;\n      transform: translate3d(20px, 0, 0);\n      color: #d4a024;\n      font-weight: 300;\n      opacity: 0;\n      transition: 0.2s ease 0.4s;\n    }\n    .timeline .swiper-slide .timeline-title {\n      font-weight: 800;\n      font-size: 34px;\n      margin: 0 0 30px;\n      opacity: 0;\n      transform: translate3d(20px, 0, 0);\n      transition: 0.2s ease 0.5s;\n    }\n    .timeline .swiper-slide .timeline-text {\n      font-size: 20px;\n      line-height: 1.5;\n      opacity: 0;\n      transform: translate3d(20px, 0, 0);\n      transition: 0.2s ease 0.6s;\n    }\n    .timeline .swiper-slide-active .timeline-year {\n      opacity: 1;\n      transform: translate3d(0, 0, 0);\n      transition: 0.4s ease 1.6s;\n    }\n    .timeline .swiper-slide-active .timeline-title {\n      opacity: 1;\n      transform: translate3d(0, 0, 0);\n      transition: 0.4s ease 1.7s;\n    }\n    .timeline .swiper-slide-active .timeline-text {\n      opacity: 1;\n      transform: translate3d(0, 0, 0);\n      transition: 0.4s ease 1.8s;\n    }\n    .timeline .swiper-pagination {\n      right: 15% !important;\n      height: 100%;\n      display: none;\n      flex-direction: column;\n      justify-content: center;\n      font-style: italic;\n      font-weight: 300;\n      font-size: 18px;\n      z-index: 1;\n    }\n    .timeline .swiper-pagination::before {\n      content: \"\";\n      position: absolute;\n      left: -30px;\n      top: 0;\n      height: 100%;\n      width: 1px;\n      background-color: rgba(255, 255, 255, 0.2);\n    }\n    .timeline .swiper-pagination-bullet {\n      width: auto;\n      height: auto;\n      text-align: center;\n      opacity: 1;\n      background: transparent;\n      color: #d4a024;\n      margin: 15px 0 !important;\n      position: relative;\n    }\n    .timeline .swiper-pagination-bullet::before {\n      content: \"\";\n      position: absolute;\n      top: 8px;\n      left: -32.5px;\n      width: 6px;\n      height: 6px;\n      border-radius: 100%;\n      background-color: #d4a024;\n      transform: scale(0);\n      transition: 0.2s;\n    }\n    .timeline .swiper-pagination-bullet-active {\n      color: #d4a024;\n    }\n    .timeline .swiper-pagination-bullet-active::before {\n      transform: scale(1);\n    }\n    .timeline .swiper-button-next,\n    .timeline .swiper-button-prev {\n      background-size: 20px 20px;\n      top: 15%;\n      width: 20px;\n      height: 20px;\n      margin-top: 0;\n      z-index: 2;\n      transition: 0.2s;\n    }\n    .timeline .swiper-button-prev {\n      left: 5%;\n      background-image: url(\"data:image\/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23d4a024'%2F%3E%3C%2Fsvg%3E\");\n    }\n    .timeline .swiper-button-prev:hover {\n      transform: translateX(-3px);\n    }\n    .timeline .swiper-button-next {\n      right: 5%;\n      background-image: url(\"data:image\/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23d4a024'%2F%3E%3C%2Fsvg%3E\");\n    }\n    .timeline .swiper-button-next:hover {\n      transform: translateX(3px);\n    }\n    @media screen and (min-width: 768px) {\n      .timeline .swiper-slide::after {\n        right: -30%;\n        bottom: -8%;\n        width: 240px;\n        height: 50%;\n        box-shadow: -230px 0 150px 50vw rgba(0, 0, 0, 0.7);\n      }\n      .timeline .swiper-slide-content {\n        right: 30%;\n        top: 50%;\n        transform: translateY(-50%);\n        width: 600px;\n        font-size: 11px;\n        text-align: right;\n      }\n      .timeline .swiper-slide .timeline-year {\n        margin-bottom: 0;\n        font-size: 32px;\n      }\n      .timeline .swiper-slide .timeline-title {\n        font-size: 46px;\n        margin: 0;\n      }\n      .timeline .swiper-pagination {\n        display: flex;\n      }\n      .timeline .swiper-button-prev {\n        top: 15%;\n        left: auto;\n        right: 15%;\n        transform: rotate(90deg) translate(0, 10px);\n      }\n      .timeline .swiper-button-prev:hover {\n        transform: rotate(90deg) translate(-3px, 10px);\n      }\n      .timeline .swiper-button-next {\n        top: auto;\n        bottom: 15%;\n        right: 15%;\n        transform: rotate(90deg) translate(0, 10px);\n      }\n      .timeline .swiper-button-next:hover {\n        transform: rotate(90deg) translate(3px, 10px);\n      }\n    }\n    @media screen and (min-width: 1024px) {\n      .timeline .swiper-slide::after {\n        right: -20%;\n        bottom: -12%;\n        width: 240px;\n        height: 50%;\n        box-shadow: -230px 0 150px 39vw rgba(0, 0, 0, 0.7);\n      }\n      .timeline .swiper-slide-content {\n        right: 25%;\n      }\n    }\n\n  <\/style><div class=\"container\">\n    <div class=\"timeline\">\n      <div class=\"swiper-container\">\n        <div class=\"swiper-wrapper\">\n          <div class=\"swiper-slide\" style=\"background-image: url(https:\/\/webtest.microcosm.com.tw\/wp-content\/uploads\/2024\/02\/DSCN9774-scaled.jpg); color:white;\"\n            data-year=\"1996\">\n            <div class=\"swiper-slide-content\">\n              <span class=\"timeline-year\">1996<\/span>\n              <h4 class=\"timeline-title\" style=\"color:white;\">\u5f8b\u52dd\u79d1\u6280\u80a1\u4efd\u6709\u9650\u516c\u53f8\u6210\u7acb<\/h4>\n            <\/div>\n          <\/div>\n          <div class=\"swiper-slide\" style=\"background-image: url(https:\/\/webtest.microcosm.com.tw\/wp-content\/uploads\/2024\/02\/standard-quality-control-collage.jpg)\"\n            data-year=\"1998~1999\">\n            <div class=\"swiper-slide-content\">\n              <span class=\"timeline-year\">1998~1999<\/span>\n              <h4 class=\"timeline-title\" style=\"color:white;\">\u901a\u904e\u7f8e\u570bU\/L\u8a8d\u8b49<br>\u8207ISO 9001\u8a8d\u8b49<\/h4>\n            <\/div>\n          <\/div>\n          <div class=\"swiper-slide\" style=\"background-image: url(https:\/\/webtest.microcosm.com.tw\/wp-content\/uploads\/2024\/02\/tainan_tech_park.jpg); color:white;\" data-year=\"2001~2003\">\n            <div class=\"swiper-slide-content\">\n              <span class=\"timeline-year\">2001~2003<\/span>\n              <h4 class=\"timeline-title\" style=\"color:white;\">\u9032\u99d0\u53f0\u5357\u79d1\u5b78\u5712\u5340<\/h4>\n              <p class=\"timeline-text\">\n                \u958b\u767c\u51fa\u8d85\u8edf\u8584\u819c\u6750\u6599\n              <\/p>\n            <\/div>\n          <\/div>\n          <div class=\"swiper-slide\" style=\"background-image: url(https:\/\/webtest.microcosm.com.tw\/wp-content\/uploads\/2024\/02\/stock_market-scaled.jpg)\" data-year=\"2005\">\n            <div class=\"swiper-slide-content\">\n              <span class=\"timeline-year\">2005<\/span>\n              <h4 class=\"timeline-title\" style=\"color:white;\">\u80a1\u7968\u4e0a\u6ac3\u639b\u724c<\/h4>\n              <p class=\"timeline-text\">\n                \u7533\u8acb\u70ba\u53f0\u7063\u4e0a\u5e02\u516c\u53f8(\u4ee3\u865f3354)<br>\n                \u65bc\u8607\u5dde\u5de5\u696d\u5712\u5340\u5efa\u7acb\u751f\u7522\u7dda\u91cf\u7522<br>\n                \u5fb7\u52e4\u4e9e\u592a\u5730\u5340\u9ad8\u79d1\u6280\u9ad8\u6210\u9577\u4f01\u696d\u7b2c131\u540d<br>\n                \u5546\u696d\u9031\u520a\u300c\u4e0a\u5e02\u6ac3\u516c\u53f8\u71df\u6536\u6392\u884c\u699c\u300d\u7b2c925\u540d<br>\n                \u5546\u696d\u9031\u520a\u300c\u4e0a\u5e02\u6ac3\u516c\u53f8\u71df\u6536\u6210\u9577150\u5f37\u300d\u7b2c46\u540d\n              <\/p>\n            <\/div>\n          <\/div>\n          <div class=\"swiper-slide\" style=\"background-image: url(https:\/\/webtest.microcosm.com.tw\/wp-content\/uploads\/2024\/02\/successful-business-peolple-handshaking-after-good-deal-scaled.jpg); color:white;\" data-year=\"2010\">\n            <div class=\"swiper-slide-content\">\n              <span class=\"timeline-year\">2010<\/span>\n              <h4 class=\"timeline-title\" style=\"color:white;\">\u901a\u904e QC 080000 \u8a8d\u8b49<\/h4>\n              <p class=\"timeline-text\">\n                2-layer laminating \u8edf\u677f\u6a5f\u6750\u751f\u7522\u7dda\u91cf\u7522<br>\n                \u4fdd\u81a0\u8d85\u8edf\u96d9\u9762\u5927\u91cf\u7528\u65bc\u8584\u578b\u667a\u6167\u578b\u624b\u6a5f<br>\n                \u6210\u70ba\u7121\u9e75\u5de5\u5ee0\n              <\/p>\n            <\/div>\n          <\/div>\n          <div class=\"swiper-slide\" style=\"background-image: url(https:\/\/webtest.microcosm.com.tw\/wp-content\/uploads\/2024\/02\/research-scaled.jpg); color:white;\" data-year=\"2012\">\n            <div class=\"swiper-slide-content\">\n              <span class=\"timeline-year\">2012<\/span>\n              <h4 class=\"timeline-title\" style=\"color:white;\">\u6210\u7acb\u7814\u767c\u4e2d\u5fc3<\/h4>\n              <p class=\"timeline-text\">\u6295\u5165\u900f\u660e\u805a\u91af\u4e9e\u80fa\u548c\u611f\u5149\u805a\u91af\u4e9e\u80fa\u6750\u6599\u958b\u767c<\/p>\n            <\/div>\n          <\/div>\n          <div class=\"swiper-slide\" style=\"background-image: url(https:\/\/webtest.microcosm.com.tw\/wp-content\/uploads\/2024\/02\/collage-finance-banner-concept.jpg);\"\n            data-year=\"2021\">\n            <div class=\"swiper-slide-content\">\n              <span class=\"timeline-year\">2021<\/span>\n              <h4 class=\"timeline-title\" style=\"color:white;\">\u53f0\u7063\u8b49\u5238\u4ea4\u6613\u6240<br>\u548c\u8b49\u5238\u6ac3\u6aaf\u8cb7\u8ce3\u4e2d\u5fc3<br>\u7b2c\u4e03\u5c46\u524d20%\u7684\u512a\u79c0\u4f01\u696d<\/h4>\n              <p class=\"timeline-text\"><\/p>\n            <\/div>\n          <\/div>\n        <\/div>\n        <div class=\"swiper-button-prev\"><\/div>\n        <div class=\"swiper-button-next\"><\/div>\n        <div class=\"swiper-pagination\"><\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<script>\n    var timelineSwiper = new Swiper('.timeline .swiper-container', {\n      direction: 'vertical',\n      loop: false,\n      speed: 1200,\n      pagination: '.swiper-pagination',\n      paginationBulletRender: function (swiper, index, className) {\n        var year = document.querySelectorAll('.swiper-slide')[index].getAttribute('data-year');\n        return '<span class=\"' + className + '\">' + year + '<\/span>';\n      },\n      paginationClickable: true,\n      nextButton: '.swiper-button-next',\n      prevButton: '.swiper-button-prev',\n      breakpoints: {\n        768: {\n          direction: 'horizontal',\n        }\n      }\n    });\n  <\/script><\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"100-width.php","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-9","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/microcosm.com.cn\/zh\/wp-json\/wp\/v2\/pages\/9","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/microcosm.com.cn\/zh\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/microcosm.com.cn\/zh\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/microcosm.com.cn\/zh\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/microcosm.com.cn\/zh\/wp-json\/wp\/v2\/comments?post=9"}],"version-history":[{"count":49,"href":"https:\/\/microcosm.com.cn\/zh\/wp-json\/wp\/v2\/pages\/9\/revisions"}],"predecessor-version":[{"id":4293,"href":"https:\/\/microcosm.com.cn\/zh\/wp-json\/wp\/v2\/pages\/9\/revisions\/4293"}],"wp:attachment":[{"href":"https:\/\/microcosm.com.cn\/zh\/wp-json\/wp\/v2\/media?parent=9"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}