|
|
@@ -47,7 +47,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- <div class="method-box">
|
|
|
+ <div class="method-box method-pc-box">
|
|
|
<div class="method-item">
|
|
|
<div class="method-left method-lr">
|
|
|
<p class="title">Bottom Up Research Method</p>
|
|
|
@@ -87,6 +87,51 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
+ <div class="method-box method-phone-box">
|
|
|
+ <div class="method-item">
|
|
|
+ <div class="method-left method-lr">
|
|
|
+ <p class="title">Bottom Up Research Method</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ :class="['method-item ', `method-level_${index}`]"
|
|
|
+ v-for="(item, index) in methodLevel"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <div class="method-left method-lr">
|
|
|
+ <div class="level_item">
|
|
|
+ <p class="level-title">{{ item.left.title }}</p>
|
|
|
+ <p class="level-text">{{ item.left.text }}</p>
|
|
|
+ </div>
|
|
|
+ <div class="level-img">
|
|
|
+ <img :src="item.left.img" alt="" />
|
|
|
+ <div class="level-white" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="method-item">
|
|
|
+ <div class="method-left method-lr">
|
|
|
+ <p class="title">Top Down Research Methodology</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ :class="['method-item ', `method-level_${index}`]"
|
|
|
+ v-for="(item, index) in methodLevel"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
+ <div class="method-right method-lr">
|
|
|
+ <div class="level-img">
|
|
|
+ <img :src="item.right.img" alt="" />
|
|
|
+ <div class="level-white" />
|
|
|
+ </div>
|
|
|
+ <div class="level_item">
|
|
|
+ <p class="level-title">{{ item.right.title }}</p>
|
|
|
+ <p class="level-text">{{ item.right.text }}</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
<div class="method-content">
|
|
|
<div class="title">Multidimensional Data Cross Validation Method</div>
|
|
|
<div class="content-box">
|
|
|
@@ -149,23 +194,6 @@
|
|
|
analyses, financial disclosures, academic research,news media, and international
|
|
|
sources, provides robust support for dataverification and analysis.
|
|
|
</p>
|
|
|
- <!-- <div>
|
|
|
- <p class="text-title">Data Source</p>
|
|
|
- <p class="text-text">
|
|
|
- Data quality and reliability are paramount to our company. We ensure accuracy
|
|
|
- and effectiveness through rich and diverse datasources. Our primary data is
|
|
|
- gathered via comprehensive interviews with key stakeholders, including senior
|
|
|
- corporate managers,industry experts, supply chain participants, and end
|
|
|
- consumers. This allows us to capture critical insights into strategic
|
|
|
- planning,policy interpretation, supply chain dynamics, and product usage. Our
|
|
|
- secondary data, encompassing government statistics,industry reports,
|
|
|
- consulting analyses, financial disclosures, academic research,news media, and
|
|
|
- international sources, provides robust support for dataverification and
|
|
|
- analysis.
|
|
|
- </p>
|
|
|
- </div>
|
|
|
- <img class="content-img" src="@/assets/images/about/DataSource.png" alt="" />
|
|
|
- </div> -->
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -275,6 +303,7 @@ const methodLevel = [
|
|
|
];
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
+@import "~/assets/css/tool.scss";
|
|
|
.page {
|
|
|
.top {
|
|
|
width: 100%;
|
|
|
@@ -335,7 +364,9 @@ const methodLevel = [
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+ .method-phone-box {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
.method-box {
|
|
|
padding: var(--size-76) var(--size-146);
|
|
|
// background: url("@/assets/images/about/img_03.png") no-repeat center center;
|
|
|
@@ -638,4 +669,124 @@ const methodLevel = [
|
|
|
// }
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+@include responseTo("phone") {
|
|
|
+ .page {
|
|
|
+ .top {
|
|
|
+ img {
|
|
|
+ height: 140px;
|
|
|
+ object-fit: cover;
|
|
|
+ }
|
|
|
+ > div {
|
|
|
+ padding: var(--size-15);
|
|
|
+ .top_title {
|
|
|
+ font-size: var(--size-28);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .research-content {
|
|
|
+ padding: var(--size-20);
|
|
|
+ .content-item-01,
|
|
|
+ .content-item-02 {
|
|
|
+ font-size: var(--size-14);
|
|
|
+ }
|
|
|
+ .content-item-02 {
|
|
|
+ padding: var(--size-20);
|
|
|
+ background-size: auto 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .method-pc-box {
|
|
|
+ display: none !important;
|
|
|
+ }
|
|
|
+ .method-phone-box {
|
|
|
+ display: block;
|
|
|
+ padding: var(--size-20);
|
|
|
+ .method-item {
|
|
|
+ width: 100%;
|
|
|
+ padding-bottom: var(--size-20);
|
|
|
+ .method-lr {
|
|
|
+ width: 100%;
|
|
|
+ padding: 0;
|
|
|
+ .title {
|
|
|
+ font-size: var(--size-18);
|
|
|
+ }
|
|
|
+ .level_item {
|
|
|
+ .level-title {
|
|
|
+ line-height: 1.1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .level-img {
|
|
|
+ img {
|
|
|
+ width: var(--size-80);
|
|
|
+ height: auto;
|
|
|
+ }
|
|
|
+ .level-white {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .method-content {
|
|
|
+ padding: var(--size-20);
|
|
|
+ .title {
|
|
|
+ font-size: var(--size-18);
|
|
|
+ }
|
|
|
+ .content-box {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ background-color: #fff;
|
|
|
+ box-shadow: none;
|
|
|
+ .data-cross-img {
|
|
|
+ position: relative;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ order: -1;
|
|
|
+ transform: none;
|
|
|
+ margin: 0 auto;
|
|
|
+ .data-cross-text {
|
|
|
+ // position: static;
|
|
|
+ // transform: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .content-item {
|
|
|
+ padding: var(--size-20) 0 0 !important;
|
|
|
+ margin-top: 0 !important;
|
|
|
+ .item-title {
|
|
|
+ font-size: var(--size-16);
|
|
|
+ }
|
|
|
+ .item-text {
|
|
|
+ font-style: var(--size-14);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .data-source{
|
|
|
+ padding: var(--size-20);
|
|
|
+ .source-content{
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .source-img{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ order: 3;
|
|
|
+ }
|
|
|
+ .text-title{
|
|
|
+ order: 1;
|
|
|
+ text-align: center;
|
|
|
+ font-size: var(--size-18);
|
|
|
+ padding-bottom: 0;
|
|
|
+ }
|
|
|
+ .text-text{
|
|
|
+ order: 2;
|
|
|
+ font-size: var(--size-14);
|
|
|
+ padding-bottom: var(--size-20);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|
