.w-embed-youtubevideo {
width: 100%;
position: relative;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
background-image: url(https://d3e54v103j8qbb.cloudfront.net/static/youtube-placeholder.2b05e7d68d.svg);
background-size: cover;
background-position: 50% 50%;
}
.w-embed-youtubevideo:empty {
min-height: 75px;
padding-bottom: 56.25%;
}
body {
font-family: Montserrat, sans-serif;
color: #1a1b1f;
font-size: 16px;
line-height: 28px;
font-weight: 400;
}
h1 {
margin-top: 20px;
margin-bottom: 15px;
font-size: 44px;
line-height: 62px;
font-weight: 400;
}
h2 {
margin-top: 10px;
margin-bottom: 10px;
font-size: 36px;
line-height: 50px;
font-weight: 400;
}
h3 {
margin-top: 10px;
margin-bottom: 10px;
font-size: 30px;
line-height: 46px;
font-weight: 400;
}
h4 {
margin-top: 10px;
margin-bottom: 10px;
font-size: 24px;
line-height: 38px;
font-weight: 400;
}
h5 {
margin-top: 10px;
margin-bottom: 10px;
font-size: 20px;
line-height: 34px;
font-weight: 500;
}
h6 {
margin-top: 10px;
margin-bottom: 10px;
font-size: 16px;
line-height: 28px;
font-weight: 500;
}
p {
margin-bottom: 10px;
}
a {
display: block;
-webkit-transition: opacity 200ms ease;
transition: opacity 200ms ease;
color: #1a1b1f;
text-decoration: underline;
}
a:hover {
color: #32343a;
}
a:active {
color: #43464d;
}
ul {
margin-top: 20px;
margin-bottom: 10px;
padding-left: 40px;
list-style-type: disc;
}
li {
margin-bottom: 10px;
}
img {
display: block;
}
label {
margin-bottom: 10px;
font-size: 12px;
line-height: 20px;
font-weight: 500;
letter-spacing: 1px;
text-transform: uppercase;
}
blockquote {
margin-top: 25px;
margin-bottom: 25px;
padding: 15px 30px;
border-left: 5px solid #e2e2e2;
font-size: 20px;
line-height: 34px;
}
figcaption {
margin-top: 5px;
opacity: 1;
font-size: 14px;
line-height: 26px;
text-align: center;
}
.bg-line--wrap {
position: fixed;
left: 0%;
top: 0%;
right: 0%;
bottom: 0%;
z-index: -20;
display: -ms-grid;
display: grid;
height: 100vh;
grid-auto-columns: 1fr;
grid-column-gap: 0px;
grid-row-gap: 0px;
-ms-grid-columns: 0.25fr 1fr 1fr 0.25fr;
grid-template-columns: 0.18fr 1fr 1fr 0.18fr;
-ms-grid-rows: auto;
grid-template-rows: auto;
}
.bg-line {
border-right: 1px solid #edeef1;
}
.index-header {
position: absolute;
left: 0%;
top: 0%;
right: 0%;
bottom: auto;
z-index: 5;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 40px 48px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(transparent));
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), transparent);
}
.index-cover--wrap {
height: 100vh;
max-height: 800px;
}
.index-cover--mask {
position: absolute;
left: 0%;
top: 0%;
right: 0%;
bottom: 0%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: hidden;
height: 100vh;
max-height: 800px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-o-object-position: 50% 50%;
object-position: 50% 50%;
}
.index-cover--01 {
position: absolute;
width: 100%;
height: 100%;
background-image: url(https://www.mentalwe.com/wp-content/uploads/2024/02/index-cover-03.png);
background-position: 50% 50%;
background-size: cover;
}
.index-cover--02 {
position: absolute;
display: block;
width: 100%;
height: 100%;
background-image: url(https://www.mentalwe.com/wp-content/uploads/2024/02/index-cover-02.png);
background-position: 50% 50%;
background-size: cover;
}
.index-cover--03 {
position: absolute;
display: block;
width: 100%;
height: 100%;
background-image: url(https://www.mentalwe.com/wp-content/uploads/2024/02/index-cover-01.png);
background-position: 50% 50%;
background-size: cover;
}
.index-cover--inner {
position: absolute;
left: 0%;
top: 0%;
right: 0%;
bottom: 0%;
z-index: 2;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 100vh;
max-height: 800px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color: rgba(0, 0, 0, 0.4);
}
.index-cover--slogan {
margin-top: 0px;
margin-bottom: 24px;
font-family: 'Noto Serif TC', sans-serif;
color: #fff;
font-size: 48px;
font-weight: 700;
text-align: center;
}
.index-cover--subtitle {
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-weight: 500;
text-align: center;
letter-spacing: 0.1px;
}
.btn-white-line {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 4px 32px;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
grid-row-gap: 8px;
border-style: solid;
border-width: 1px;
border-color: #fff;
border-radius: 100px;
-webkit-transition: all 800ms ease;
transition: all 800ms ease;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
letter-spacing: 0.25px;
text-decoration: none;
}
.btn-white-line:hover {
border-color: #7891ca;
background-color: #3a5dae;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), to(#7891ca));
background-image: linear-gradient(90deg, transparent, #7891ca);
color: #fff;
}
.index-cover--btn {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: 36px;
grid-column-gap: 32px;
grid-row-gap: 32px;
}
.header-logo-white {
height: 36px;
}
.index-header--nav-item {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
grid-row-gap: 8px;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
text-decoration: none;
cursor: default;
}
.index-header--nav-item:hover {
color: #bbbdc1;
}
.chevron {
width: 12px;
height: 12px;
font-size: 16px;
cursor: pointer;
}
.index-header--navbar {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 36px;
grid-row-gap: 36px;
}
.btn-header {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 4px 20px;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
grid-row-gap: 8px;
border: 1px solid #fff;
border-radius: 100px;
background-color: transparent;
-webkit-transition: all 1000ms ease;
transition: all 1000ms ease;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
text-decoration: none;
}
.btn-header:hover {
border-color: #7891ca;
background-color: #3a5dae;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), to(#7891ca));
background-image: linear-gradient(90deg, transparent, #7891ca);
color: #fff;
}
.open-new-tab {
width: 12px;
height: 12px;
}
.new-block {
position: relative;
z-index: 10;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 86px;
margin-top: -43px;
margin-left: 50%;
padding: 16px 20px 16px 36px;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color: #1a3179;
}
.index-mission--wrap {
margin-top: -43px;
padding-top: 120px;
padding-bottom: 72px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background-color: #f6f6fa;
}
.index-mission--inner {
position: relative;
z-index: 2;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 80%;
max-width: 1095px;
margin-right: auto;
margin-left: auto;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.btn-index-01 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 240px;
padding: 8px 32px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 16px;
border-radius: 4px;
background-image: -webkit-gradient(linear, left top, right top, from(#3a5dae), to(#7891ca));
background-image: linear-gradient(90deg, #3a5dae, #7891ca);
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
font-weight: 500;
text-decoration: none;
}
.btn-index-01:hover {
opacity: 0.8;
color: #fff;
}
.content-text-01 {
margin-top: 12px;
margin-bottom: 16px;
font-family: 'Noto Sans TC', sans-serif;
color: #606060;
font-size: 14px;
line-height: 20px;
white-space: normal;
}
.subtitle-01 {
font-family: 'Noto Serif TC', sans-serif;
color: #181818;
font-size: 24px;
line-height: 32px;
font-weight: 700;
}
.caption-text-01 {
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 12px;
font-weight: 500;
}
.index-mission--content {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 45%;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
grid-row-gap: 16px;
}
.index-product--title {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: -40px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-row-gap: 16px;
}
.index-bg-text--start {
position: relative;
z-index: 0;
height: auto;
white-space: break-spaces;
}
.index-product--wrap1 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 80%;
max-width: 1095px;
margin-top: 88px;
margin-right: auto;
margin-left: auto;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.index-product--wrap1.reverse.hidden {
display: none;
}
.index-bg-text--center {
position: relative;
z-index: -1;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: 60px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.image-3 {
margin-top: -50px;
margin-bottom: -50px;
}
.index-product--block-right {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 45%;
margin-left: 40px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-transform: scale(1.3);
-ms-transform: scale(1.3);
transform: scale(1.3);
}
.index-product--subtitle {
font-family: 'Noto Serif TC', sans-serif;
color: #181818;
font-size: 40px;
line-height: 57px;
font-weight: 700;
}
.color-primary {
color: #3a5dae;
}
.index-product--list-item {
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 14px;
}
.index-product--list {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: hidden;
margin-top: -12px;
margin-bottom: 16px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-column-gap: 12px;
grid-row-gap: 12px;
}
.index-product--category {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 12px;
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 12px;
font-weight: 400;
}
.index-product--category-icon {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 28px;
height: 28px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
border-radius: 4px;
background-color: #fff;
box-shadow: 3px 3px 10px 2px rgba(58, 93, 174, 0.16);
}
.index-product--block-left {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 50%;
margin-right: 60px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.index-product--btn-block {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
grid-column-gap: 12px;
}
.btn-index-02 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 196px;
padding: 8px 32px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 16px;
border-radius: 4px;
background-image: -webkit-gradient(linear, left top, right top, from(#3a5dae), to(#7891ca));
background-image: linear-gradient(90deg, #3a5dae, #7891ca);
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
font-weight: 500;
text-decoration: none;
}
.btn-index-02:hover {
color: #fff;
}
.index-product--category-icon-img {
width: 16px;
height: 16px;
}
.index-block--half {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 48%;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
grid-row-gap: 16px;
}
.index-product--wrap2 {
width: 80%;
max-width: 1095px;
margin-top: 100px;
margin-right: auto;
margin-left: auto;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.index--card-wrap {
display: -ms-grid;
display: grid;
margin-top: 60px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
grid-auto-columns: 1fr;
grid-column-gap: 32px;
grid-row-gap: 32px;
-ms-grid-columns: 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr;
-ms-grid-rows: auto;
grid-template-rows: auto;
}
.index-product--card {
overflow: hidden;
border-radius: 8px;
background-color: #fff;
box-shadow: 0 4px 30px 1px rgba(58, 93, 174, 0.16);
}
.index-product--card-inner {
padding: 20px;
background-color: #fff;
}
.index-product--card-title {
font-family: 'Noto Sans TC', sans-serif;
color: #181818;
font-weight: 500;
text-align: center;
}
.btn-line {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 4px 32px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
grid-row-gap: 8px;
border-style: solid;
border-width: 1px;
border-color: #3a5dae;
border-radius: 8px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 14px;
letter-spacing: 0.25px;
text-decoration: none;
}
.btn-line:hover {
grid-column-gap: 20px;
opacity: 0.8;
color: #3a5dae;
}
.index-text-bg {
position: relative;
z-index: -1;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 600px;
margin-top: -180px;
margin-left: 10%;
padding-top: 100px;
-webkit-box-pack: end;
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
border-top-left-radius: 50px;
background-color: #f6f6fa;
}
.index-business--wrap {
width: 80%;
max-width: 1095px;
margin: -220px auto 88px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.index-business--card-mask {
overflow: hidden;
border-radius: 10px;
}
.index-business--card-inner {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: 16px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.index-business--card-text01 {
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 14px;
line-height: 20px;
}
.index-business--card-text02 {
font-family: 'Noto Sans TC', sans-serif;
color: #181818;
line-height: 23px;
font-weight: 700;
}
.index-business--card-text03 {
font-family: 'Noto Sans TC', sans-serif;
color: #606060;
font-size: 12px;
line-height: 17px;
}
.index-business--card-btn {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: hidden;
width: 36px;
height: 36px;
padding: 10px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
border-style: solid;
border-width: 1px;
border-color: #3a5dae;
border-radius: 50px;
}
.index-business--card-content {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-right: 10px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
grid-row-gap: 4px;
}
.index-about {
position: relative;
z-index: -1;
margin-top: 60px;
padding-top: 88px;
padding-bottom: 220px;
border-bottom-right-radius: 50px;
background-color: #1a3179;
}
.index-about--title {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-left: 10%;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.index-about--video-mask {
position: relative;
z-index: 2;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: hidden;
width: 80%;
height: 573px;
max-width: 1095px;
margin: -573px auto 20px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
border-radius: 8px;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.5)));
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
}
.index-about--video-btn {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 7rem;
height: 7rem;
padding: 20px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
border: 1px solid #fff;
border-radius: 500px;
cursor: pointer;
}
.index-about--video-icon2 {
position: absolute;
margin-right: 110px;
}
.index-about--link-wrap {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
overflow: hidden;
width: 80%;
max-width: 1095px;
margin-right: auto;
margin-bottom: 60px;
margin-left: auto;
-webkit-box-pack: end;
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
}
.index-about--link-wrap:hover {
opacity: 0.8;
}
.index-about--link {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding-bottom: 4px;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
border-bottom: 1px solid #3a5dae;
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 14px;
text-decoration: none;
}
.index-about--link:hover {
opacity: 0.7;
}
.subtitle-02 {
font-family: 'Noto Serif TC', sans-serif;
color: #fff;
font-size: 24px;
line-height: 32px;
font-weight: 700;
}
.slide-nav {
display: none;
}
.index-achievement {
height: auto;
margin-bottom: 40px;
background-color: transparent;
}
.index-achievement--inner {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: auto;
margin-top: 36px;
margin-bottom: 36px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
background-color: #1a3179;
}
.index-achievement--img {
width: 65%;
max-width: 905px;
margin-top: -36px;
margin-bottom: -36px;
}
.index-achievement--block {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 30%;
margin-right: 8%;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.index-achievement--subtitle {
margin-bottom: 12px;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
text-align: center;
}
.index-achievement--slogan {
font-family: 'Noto Serif TC', sans-serif;
color: #fff;
font-size: 24px;
font-weight: 700;
text-align: center;
}
.index-achievement--info {
margin-top: 32px;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
line-height: 20px;
}
.index-achievement--content {
margin-top: 20%;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 4px;
}
.div-block-31 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 36px;
height: 36px;
padding: 8px 8px 10px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
border: 1px solid #fff;
border-radius: 500px;
}
.image-7 {
-webkit-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.right-arrow-2 {
left: 0%;
top: auto;
right: 0%;
bottom: 0%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-right: 8%;
margin-bottom: 84px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.left-arrow-2 {
left: 0%;
top: auto;
right: 0%;
bottom: 0%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-right: 11.8%;
margin-bottom: 84px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.index-partner {
position: relative;
z-index: 1;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 80%;
max-width: 1095px;
margin: -40px auto 72px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.index-partner--descript {
width: 45%;
font-family: 'Noto Sans TC', sans-serif;
color: #606060;
font-size: 14px;
line-height: 20px;
}
.index-partner--title {
width: 40%;
}
.index-partner--wrap {
width: 80%;
height: auto;
max-width: 1095px;
margin-right: auto;
margin-left: auto;
padding-right: 10px;
padding-left: 10px;
background-color: transparent;
}
.index-about--video {
z-index: 1;
width: 80%;
height: 573px;
max-width: 1095px;
margin-top: -220px;
margin-right: auto;
margin-left: auto;
border-radius: 10px;
}
.index-bg-text--end {
position: relative;
z-index: 0;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: auto;
-webkit-box-pack: end;
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end;
white-space: break-spaces;
}
.index-product--card-mask {
overflow: hidden;
}
.index-product--card-content {
min-height: 60px;
margin-top: 12px;
margin-bottom: 24px;
font-family: 'Noto Sans TC', sans-serif;
color: #606060;
font-size: 14px;
line-height: 20px;
}
.index-achievement--pages {
margin-bottom: 60px;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 12px;
line-height: 17px;
}
.div-block-32 {
position: relative;
z-index: 1;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 80%;
max-width: 1095px;
margin-right: auto;
margin-bottom: 72px;
margin-left: auto;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.index-client {
margin-top: 120px;
margin-right: 10%;
margin-left: 10%;
padding-top: 72px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
background-color: #f6f6fa;
}
.div-block-34 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: -100px;
-webkit-box-pack: end;
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.index-client--title {
width: 20%;
text-align: right;
}
.div-block-35 {
display: -ms-grid;
display: grid;
width: 75%;
margin-top: 10px;
grid-auto-columns: 1fr;
grid-column-gap: 2vw;
grid-row-gap: 24px;
-ms-grid-columns: 1fr 1fr 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
-ms-grid-rows: auto auto;
grid-template-rows: auto auto;
}
.div-block-36 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 120px;
height: 120px;
padding: 10px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
border-radius: 25px;
background-color: #fff;
box-shadow: 0 4px 8px 1px rgba(26, 49, 121, 0.08);
}
.video-player {
position: fixed;
left: 0%;
top: 0%;
right: 0%;
bottom: 0%;
z-index: 1000;
display: none;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color: rgba(0, 0, 0, 0.7);
}
.youtube {
width: 720px;
height: 480px;
}
.div-block-38 {
position: absolute;
left: auto;
top: 3%;
right: 3%;
bottom: auto;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 64px;
height: 64px;
padding: 10px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
cursor: pointer;
}
.div-block-38:hover {
opacity: 0.8;
}
.cta {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.div-block-39 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 50%;
padding-top: 56px;
padding-bottom: 56px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, left top, right top, from(#3a5dae), to(#7891ca));
background-image: linear-gradient(90deg, #3a5dae, #7891ca);
}
.text-block {
width: 320px;
margin-bottom: 32px;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
line-height: 20px;
text-align: center;
white-space: break-spaces;
}
.btn-line-copy {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 240px;
padding: 8px 32px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
grid-row-gap: 8px;
border: 1px solid #fff;
border-radius: 8px;
background-color: hsla(0, 0%, 100%, 0.15);
-webkit-transition: all 500ms ease, opacity 200ms ease;
transition: all 500ms ease, opacity 200ms ease;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
letter-spacing: 0.25px;
text-decoration: none;
}
.btn-line-copy:hover {
grid-column-gap: 20px;
color: #fff;
}
.text-block-2 {
margin-bottom: 12px;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 28px;
font-weight: 500;
}
.text-block-3 {
margin-bottom: 12px;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-weight: 500;
}
.div-block-39-copy {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 50%;
padding-top: 56px;
padding-bottom: 56px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color: #1a3179;
}
.div-block-40 {
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 13px;
line-height: 20px;
text-decoration: none;
}
.div-block-40:hover {
opacity: 0.8;
color: #fff;
}
.text-block-4 {
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-weight: 500;
}
.div-block-41 {
width: 1px;
height: 100%;
margin-right: 24px;
margin-left: 24px;
background-color: #fff;
}
.div-block-42 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding-top: 8px;
padding-bottom: 8px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
grid-column-gap: 16px;
background-color: #181818;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 12px;
}
.div-block-43 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding-top: 48px;
padding-bottom: 48px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color: #fff;
}
.link {
color: #7891ca;
}
.link:hover {
color: #aec6fc;
}
.div-block-44 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 80%;
max-width: 1095px;
margin-bottom: 28px;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 16px;
font-family: 'Noto Sans TC', sans-serif;
color: #8a8d8f;
font-size: 12px;
}
.div-block-45 {
width: 100%;
height: 0.5px;
background-color: #8a8d8f;
opacity: 0.8;
}
.text-block-5 {
white-space: nowrap;
}
.div-block-46 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 80%;
max-width: 1095px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.div-block-47 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-left: 10%;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
font-family: 'Noto Sans TC', sans-serif;
color: #8a8d8f;
font-size: 12px;
line-height: 20px;
}
.div-block-48 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-right: 20px;
grid-auto-columns: 1fr;
grid-column-gap: 28px;
-ms-grid-columns: 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr;
-ms-grid-rows: auto auto;
grid-template-rows: auto auto;
}
.div-block-49 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 8px;
}
.link-block {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
font-family: 'Noto Sans TC', sans-serif;
color: #8a8d8f;
font-size: 13px;
line-height: 20px;
text-decoration: none;
}
.link-block:hover {
opacity: 0.8;
color: #606060;
}
.div-block-50 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 55%;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.image-8 {
width: 132px;
}
.image-9 {
width: 16px;
height: 16px;
}
.top {
width: auto;
height: 0px;
}
.foooter:hover {
opacity: 0.8;
}
.transition {
position: fixed;
left: 0%;
top: 0%;
right: 0%;
bottom: 0%;
z-index: 15000;
display: none;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color: #fff;
}
.transition-logo {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: -20px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.logo-animation-02 {
position: absolute;
}
.logo-animation-03 {
position: absolute;
}
.logo-animation-04 {
width: 150px;
}
.overview-mask {
overflow: hidden;
height: auto;
}
.header--nav-list {
position: absolute;
top: 68px;
z-index: 100;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-left: -31px;
padding: 16px 14px 16px 16px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
grid-row-gap: 12px;
background-color: #fff;
}
.header--nav-list.absolute-top-index {
top: 88px;
display: none;
}
.index-header--link-block {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
grid-column-gap: 16px;
text-decoration: none;
}
.index-header--link-arrow {
width: 31px;
}
.index-header--link {
overflow: hidden;
color: #606060;
text-decoration: none;
}
.chevron-blue {
display: none;
width: 12px;
height: 12px;
font-size: 16px;
cursor: pointer;
}
.index-header--nav-item-text {
cursor: pointer;
}
.index-business--card-btn-block {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
grid-column-gap: 16px;
}
.contact-sidebar {
position: fixed;
left: auto;
top: auto;
right: 2.5%;
bottom: 10%;
z-index: 100;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.contact-sidebar--text {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
font-family: 'Noto Sans TC', sans-serif;
color: #181818;
font-size: 16px;
}
.contact-sidebar--line {
width: 1px;
height: 20px;
margin-top: 36px;
background-color: #181818;
}
.contact-sidebar--link {
margin-top: 10px;
}
.contact-sidebar--link:hover {
opacity: 0.6;
}
.slide {
width: 20%;
height: auto;
}
.text-block-6 {
color: #606060;
font-size: 14px;
line-height: 20px;
text-align: center;
}
.text-block-7 {
font-size: 14px;
line-height: 20px;
font-weight: 500;
text-align: center;
}
.div-block-51 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: 20px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-row-gap: 4px;
font-family: 'Noto Sans TC', sans-serif;
}
.immmg {
width: 65%;
margin-right: auto;
margin-left: auto;
}
.slide-nav-2 {
display: none;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.left-arrow-3 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.right-arrow-3 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.image-10 {
width: 16px;
}
.image-10-copy {
width: 16px;
-webkit-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.div-block-49-copy {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 8px;
}
.div-block-52 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
grid-column-gap: 16px;
}
.header {
position: fixed;
left: 0%;
top: 0%;
right: 0%;
bottom: auto;
z-index: 99;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 12px 48px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color: #fff;
}
.header--navbar {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 36px;
grid-row-gap: 36px;
}
.header--nav-item {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
grid-row-gap: 8px;
font-family: 'Noto Sans TC', sans-serif;
color: #606060;
font-size: 14px;
cursor: default;
}
.header--nav-item:hover {
color: #bbbdc1;
}
.btn-header-blue {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 4px 20px;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
grid-row-gap: 8px;
border: 1px solid #fff;
border-radius: 100px;
background-color: #3a5dae;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), to(#7891ca));
background-image: linear-gradient(90deg, transparent, #7891ca);
-webkit-transition: all 1000ms ease;
transition: all 1000ms ease;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 14px;
text-decoration: none;
}
.btn-header-blue:hover {
border-color: #3a5dae;
background-color: transparent;
background-image: none;
color: #3a5dae;
}
.header--nav-item-text {
cursor: pointer;
}
.chevron-rotate {
width: 12px;
height: 12px;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
font-size: 16px;
cursor: pointer;
}
.open-new-tab-blue {
display: none;
width: 12px;
height: 12px;
}
.link-block-2 {
font-family: 'Noto Sans TC', sans-serif;
color: #606060;
font-size: 14px;
line-height: 20px;
text-decoration: none;
}
.link-block-2:hover {
opacity: 0.5;
}
.link-block-3 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: auto;
height: 24px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.header--burger {
display: none;
}
.header-menu {
display: none;
}
.div-block-60 {
display: none;
}
.link-block-4 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
grid-column-gap: 8px;
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 14px;
}
.link-block-4:hover {
opacity: 0.6;
color: #3a5dae;
}
.image-14 {
display: none;
}
.image-15 {
display: block;
}
.div-block-61 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 380px;
margin-top: 60px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.5)));
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
}
.div-block-61.bg-1 {
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.5))), url(https://www.mentalwe.com/wp-content/uploads/2024/02/bg-about.png);
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(https://www.mentalwe.com/wp-content/uploads/2024/02/bg-about.png);
background-position: 0px 0px, 50% 50%;
background-size: auto, cover;
}
.div-block-61.bg-2 {
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.5))), url(https://www.mentalwe.com/wp-content/uploads/2024/02/bg-partner.png);
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(https://www.mentalwe.com/wp-content/uploads/2024/02/bg-partner.png);
background-position: 0px 0px, 50% 50%;
background-size: auto, cover;
}
.div-block-61.bg-3 {
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.5))), url(https://www.mentalwe.com/wp-content/uploads/2024/02/bg-contact.png);
background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url(https://www.mentalwe.com/wp-content/uploads/2024/02/bg-contact.png);
background-position: 0px 0px, 50% 50%;
background-size: auto, cover;
}
.div-block-62 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.text-block-10 {
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 19px;
font-weight: 500;
letter-spacing: 0.15px;
}
.heading {
margin-top: 16px;
margin-bottom: 0px;
font-family: 'Noto Serif TC', sans-serif;
color: #fff;
font-weight: 700;
}
.div-block-63 {
width: 20%;
height: 62px;
background-image: url(https://www.mentalwe.com/wp-content/uploads/2024/02/subtitle-bg.svg);
background-position: 100% 100%;
background-size: 100%;
background-repeat: no-repeat;
background-attachment: scroll;
}
.div-block-64 {
margin-top: -62px;
}
.div-block-65 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: -2px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.div-block-66 {
width: 19%;
padding-left: 2.5%;
border-right: 1px solid #edeef1;
}
.div-block-67 {
width: 71%;
padding-right: 2.5%;
padding-bottom: 88px;
padding-left: 2.5%;
}
.div-block-68 {
width: 10%;
height: auto;
border-left: 1px solid #edeef1;
}
.breadcrumb-wrap {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-bottom: 16px;
padding-top: 28px;
padding-bottom: 28px;
-webkit-box-pack: end;
-webkit-justify-content: flex-end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.breadcrumb {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 16px;
}
.breadcrumb-link {
font-family: 'Noto Sans TC', sans-serif;
color: #606060;
font-size: 12px;
line-height: 17px;
text-decoration: none;
}
.breadcrumb-link-active {
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 12px;
line-height: 17px;
}
.image-17 {
height: 5px;
}
.image-18 {
height: 8px;
}
.div-block-69 {
display: block;
}
.text-block-11 {
margin-bottom: 40px;
font-family: 'Noto Sans TC', sans-serif;
color: #181818;
font-size: 14px;
line-height: 23px;
}
.image-19 {
margin-bottom: 36px;
}
.text-block-11-copy {
margin-bottom: 16px;
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 24px;
line-height: 35px;
font-weight: 700;
}
.div-block-70 {
display: -ms-grid;
display: grid;
margin-bottom: 40px;
grid-auto-columns: 1fr;
grid-column-gap: 16px;
grid-row-gap: 16px;
-ms-grid-columns: 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr;
-ms-grid-rows: auto;
grid-template-rows: auto;
}
.text-block-12 {
margin-bottom: 10px;
font-family: 'Noto Sans TC', sans-serif;
color: #181818;
font-weight: 500;
}
.div-block-71 {
margin-top: -16px;
margin-right: 10px;
margin-bottom: 28px;
}
.div-block-72 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 12px;
}
.link-block-5 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 16px;
font-family: 'Noto Sans TC', sans-serif;
color: #606060;
font-size: 14px;
line-height: 20px;
text-decoration: none;
}
.link-block-5:hover {
opacity: 0.6;
}
.selected {
padding-top: 8px;
padding-bottom: 8px;
padding-left: 12px;
border-radius: 2px;
background-image: -webkit-gradient(linear, left top, right top, from(#f1f0f6), color-stop(75%, #f6f6fa), to(transparent));
background-image: linear-gradient(90deg, #f1f0f6, #f6f6fa 75%, transparent);
font-family: 'Noto Sans TC', sans-serif;
color: #1a3179;
font-size: 14px;
line-height: 20px;
}
.unselected {
padding-top: 8px;
padding-bottom: 8px;
padding-left: 12px;
border-radius: 2px;
font-family: 'Noto Sans TC', sans-serif;
color: #1a3179;
font-size: 14px;
line-height: 20px;
}
.image-20 {
margin-bottom: 36px;
}
.text-block-11-copy-copy {
margin-bottom: 16px;
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 19px;
line-height: 28px;
font-weight: 500;
}
.div-block-73 {
display: -ms-grid;
display: grid;
margin-bottom: 40px;
grid-auto-columns: 1fr;
grid-column-gap: 16px;
grid-row-gap: 16px;
-ms-grid-columns: 1fr 1fr 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
-ms-grid-rows: auto;
grid-template-rows: auto;
}
.div-block-65-copy {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: 0px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.div-block-67-copy {
width: 70%;
margin-left: 8%;
padding-right: 2.5%;
padding-bottom: 88px;
padding-left: 2.5%;
}
.breadcrumb-wrap-copy {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-bottom: 16px;
padding-top: 28px;
padding-bottom: 28px;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.div-block-74 {
width: 20%;
padding-top: 88px;
padding-left: 20px;
border-left: 1px solid #edeef1;
}
.div-block-75 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-bottom: 64px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.text-block-14 {
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
line-height: 24px;
}
.text-block-15 {
font-family: 'Noto Sans TC', sans-serif;
color: #181818;
font-size: 14px;
}
.div-block-76 {
width: 50%;
}
.image-21 {
width: 50%;
margin-left: 20px;
}
.div-block-77 {
padding: 36px;
background-color: #f6f6fa;
}
.text-block-16 {
margin-bottom: 20px;
font-family: 'Noto Sans TC', sans-serif;
color: #181818;
font-weight: 500;
}
.div-block-78 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.field-label {
width: 30%;
font-family: 'Noto Sans TC', sans-serif;
color: #181818;
font-size: 14px;
}
.bold-text {
padding-left: 8px;
color: #d74800;
font-size: 10px;
}
.div-block-79 {
width: 100%;
height: 1px;
margin-top: 24px;
margin-bottom: 24px;
background-color: #d8d8d8;
}
.submit-button {
display: inline-block;
width: 240px;
padding-top: 6px;
padding-bottom: 6px;
border-radius: 4px;
background-color: #3a5dae;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), to(#7891ca));
background-image: linear-gradient(90deg, transparent, #7891ca);
font-family: 'Noto Sans TC', sans-serif;
}
.div-block-79-copy {
width: 100%;
height: 1px;
margin-top: 24px;
margin-bottom: 24px;
background-color: #d8d8d8;
opacity: 0;
}
.div-block-80 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-top: 36px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.collection-list {
display: -ms-grid;
display: grid;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
grid-auto-columns: 1fr;
grid-column-gap: 16px;
grid-row-gap: 24px;
-ms-grid-columns: 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr;
-ms-grid-rows: auto auto;
grid-template-rows: auto auto;
}
@media (max-width: 767px) {
.collection-list {
display: flex;
flex-direction: column;
}
.index-client--title{
margin-left: 10%;
}
}
.div-block-81 {
overflow: hidden;
margin-bottom: 12px;
border-radius: 8px;
}
.image-22 {
width: 100%;
}
.div-block-82 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-bottom: 8px;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
grid-column-gap: 8px;
font-family: 'Noto Sans TC', sans-serif;
color: #3a5dae;
font-size: 12px;
line-height: 17px;
}
.div-block-83 {
padding: 4px 8px;
border-style: solid;
border-width: 1px;
border-color: #3a5dae;
}
.text-block-17 {
font-family: 'Noto Sans TC', sans-serif;
line-height: 23px;
font-weight: 500;
}
.link-block-6 {
text-decoration: none;
}
@media screen and (min-width: 1920px) {
.btn-header {
font-size: 16px;
}
.new-block {
height: 96px;
margin-top: -48px;
margin-left: 40%;
}
.index-mission--inner {
max-width: 1280px;
}
.btn-index-01 {
font-size: 16px;
}
.content-text-01 {
font-size: 16px;
}
.subtitle-01 {
font-size: 36px;
line-height: 48px;
}
.caption-text-01 {
font-size: 14px;
}
.index-product--wrap1 {
max-width: 1280px;
}
.index-product--wrap1.reverse {
max-width: 1280px;
}
.index-product--list-item {
font-size: 16px;
}
.index-product--category {
grid-column-gap: 16px;
font-size: 14px;
}
.index-product--wrap2 {
max-width: 1280px;
}
.index-product--card-title {
font-size: 19px;
}
.btn-line {
font-size: 16px;
}
.index-business--wrap {
max-width: 1280px;
}
.index-business--card-text02 {
font-size: 19px;
line-height: 27px;
}
.index-business--card-text03 {
font-size: 14px;
line-height: 21px;
}
.index-about--video-mask {
height: 720px;
max-width: 1280px;
margin-top: -720px;
}
.index-about--link-wrap {
max-width: 1280px;
}
.index-about--link {
font-size: 16px;
}
.subtitle-02 {
font-size: 36px;
line-height: 48px;
}
.index-achievement--img {
max-width: 1000px;
}
.index-achievement--block {
width: 35%;
}
.index-achievement--slogan {
font-size: 36px;
line-height: 48px;
}
.index-achievement--info {
font-size: 16px;
}
.index-partner {
max-width: 1280px;
}
.index-partner--descript {
font-size: 16px;
line-height: 21px;
}
.index-partner--wrap {
max-width: 1280px;
}
.index-about--video {
height: 720px;
max-width: 1280px;
}
.index-product--card-img {
width: 100%;
}
.index-product--card-content {
font-size: 16px;
}
.index-business--card-img {
width: 100%;
}
.div-block-32 {
max-width: 1280px;
}
.div-block-35 {
-ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.text-block {
font-size: 16px;
line-height: 24px;
}
.btn-line-copy {
font-size: 16px;
}
.text-block-2 {
font-size: 36px;
line-height: 48px;
}
.div-block-40 {
font-size: 16px;
}
.div-block-44 {
max-width: 1280px;
}
.div-block-46 {
max-width: 1280px;
}
.div-block-47 {
font-size: 16px;
line-height: 28px;
}
.link-block {
font-size: 14px;
line-height: 24px;
}
.header--nav-list {
display: none;
}
.header--nav-list.absolute-top-index {
font-size: 16px;
}
.index-header--nav-item-text {
font-size: 16px;
}
.text-block-7 {
font-size: 16px;
}
.div-block-52 {
font-size: 14px;
}
.text-block-8 {
font-size: 14px;
}
.heading {
font-size: 48px;
}
.breadcrumb-link {
font-size: 14px;
}
.text-block-11 {
font-size: 16px;
}
.image-19 {
width: 100%;
}
.text-block-11-copy {
font-size: 36px;
line-height: 48px;
}
.link-block-5 {
font-size: 16px;
}
.text-block-13 {
font-size: 16px;
}
.text-block-11-copy-copy {
font-size: 24px;
line-height: 30px;
}
.text-block-14 {
font-size: 19px;
}
.text-block-15 {
font-size: 16px;
}
.text-block-16 {
font-size: 19px;
}
.field-label {
font-size: 16px;
}
.image-23 {
width: 100%;
}
}
@media screen and (max-width: 991px) {
.index-cover--slogan {
font-size: 36px;
line-height: 48px;
}
.index-cover--subtitle {
font-size: 14px;
line-height: 20px;
}
.index-header--navbar {
display: none;
}
.new-block {
margin-left: 15%;
}
.index-mission--inner {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.subtitle-01 {
font-size: 20px;
}
.index-mission--content {
width: 50%;
margin-right: 20px;
}
.index-product--subtitle {
font-size: 28px;
}
.index-product--btn-block {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 12px;
}
.index--card-wrap {
grid-auto-columns: 1fr;
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
-ms-grid-rows: auto auto;
grid-template-rows: auto auto;
}
.index-about--video-mask {
height: 480px;
margin-top: -480px;
}
.index-achievement--inner {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.index-achievement--img {
width: 99%;
}
.index-achievement--block {
width: 70%;
margin-right: auto;
margin-left: auto;
}
.index-achievement--content {
margin-top: 88px;
margin-bottom: 40px;
}
.left-arrow-2 {
margin-right: 15%;
}
.index-about--video {
height: 480px;
}
.div-block-35 {
-ms-grid-columns: 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr;
}
.div-block-36 {
width: 100px;
height: 100px;
border-radius: 18px;
}
.text-block {
width: 260px;
margin-bottom: 20px;
font-size: 12px;
}
.btn-line-copy {
padding: 6px 28px;
}
.text-block-2 {
font-size: 24px;
}
.text-block-3 {
margin-bottom: 8px;
font-size: 14px;
}
.div-block-46 {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 24px;
}
.div-block-48 {
margin-right: 0px;
padding-top: 24px;
grid-column-gap: 0px;
border-top: 0.5px solid #f6f6fa;
}
.div-block-49 {
margin-right: 16px;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
grid-column-gap: 16px;
}
.div-block-50 {
width: 100%;
}
.image-9 {
width: 36px;
}
.contact-sidebar {
right: 0.5%;
}
.slide {
width: 25%;
}
.header {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding-right: 24px;
padding-left: 24px;
}
.header--navbar {
display: none;
}
.header--burger {
position: relative;
z-index: 150;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
width: 24px;
height: 24px;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
cursor: pointer;
}
.line1 {
position: absolute;
z-index: 150;
width: 24px;
height: 1px;
padding-right: 0px;
padding-bottom: 0px;
background-color: #606060;
}
.line2 {
position: absolute;
z-index: 150;
width: 24px;
height: 1px;
padding-right: 0px;
padding-bottom: 0px;
background-color: #606060;
}
.line3 {
position: absolute;
z-index: 150;
width: 24px;
height: 1px;
padding-right: 0px;
padding-bottom: 0px;
background-color: #606060;
}
.header-menu {
position: fixed;
left: 0%;
top: 0%;
right: 0%;
bottom: 0%;
z-index: 100;
display: none;
padding-right: 0px;
padding-bottom: 0px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
background-color: #181818;
}
.div-block-53 {
width: 320px;
}
.div-block-54 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
margin-bottom: 40px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
border-bottom: 1px solid #606060;
}
.image-13 {
width: 40%;
}
.div-block-55 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
grid-column-gap: 12px;
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
line-height: 20px;
}
.div-block-56 {
display: none;
margin-top: 20px;
padding-left: 5px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 16px;
}
.link-2 {
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
line-height: 20px;
text-decoration: none;
}
.link-2:hover {
color: #fff;
}
.div-block-57 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 24px;
}
.link-3 {
color: #fff;
text-decoration: none;
}
.link-3:hover {
color: #fff;
}
.div-block-58 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
height: 100vh;
padding-top: 60px;
padding-bottom: 60px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.div-block-59 {
width: 320px;
}
.text-block-9 {
font-family: 'Noto Sans TC', sans-serif;
color: #fff;
font-size: 12px;
line-height: 20px;
text-align: center;
}
.div-block-61.bg-1 {
height: 240px;
}
.div-block-61.bg-2 {
height: 240px;
}
.div-block-61.bg-3 {
height: 240px;
}
.div-block-64 {
display: none;
}
.div-block-66 {
display: none;
}
.div-block-67 {
width: 90%;
}
.div-block-73 {
-ms-grid-columns: 1fr 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.div-block-67-copy {
width: 90%;
margin-left: 4%;
}
.div-block-74 {
display: none;
}
}
@media screen and (max-width: 767px) {
.index-header {
padding-right: 24px;
padding-left: 24px;
}
.index-cover--btn {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 12px;
}
.index-mission--inner {
width: 100%;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.index-mission--content {
width: 80%;
}
.index-product--wrap1 {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.index-product--wrap1.reverse {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-webkit-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.index-product--block-right {
width: 100%;
margin-bottom: 40px;
margin-left: 0px;
}
.index-product--block-left {
width: 100%;
margin-right: 0px;
margin-bottom: 40px;
}
.index-product--btn-block {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
}
.index-block--half {
width: 100%;
}
.index--card-wrap {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
.index-product--card {
margin-bottom: 40px;
}
.index-text-bg {
height: 500px;
}
.index-business--card {
margin-bottom: 40px;
}
.index-about {
padding-bottom: 100px;
}
.index-about--title {
margin-bottom: 40px;
}
.index-about--video-mask {
height: 240px;
margin-top: -240px;
}
.index-achievement--content {
margin-top: 64px;
}
.left-arrow-2 {
display: none;
}
.index-partner {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 24px;
}
.index-partner--descript {
width: 100%;
}
.index-about--video {
height: 240px;
margin-top: -100px;
}
.index-product--card-img {
width: 100%;
}
.index-business--card-img {
width: 100%;
}
.div-block-32 {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-webkit-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.index-client--title {
width: 100%;
text-align: left;
}
.div-block-35 {
width: 100%;
margin-top: 20px;
}
.cta {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.div-block-39 {
width: 100%;
}
.div-block-39-copy {
width: 100%;
}
.div-block-42 {
padding-right: 10px;
padding-left: 10px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.div-block-47 {
margin-left: 5%;
}
.div-block-48 {
display: none;
}
.div-block-50 {
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
}
.image-8 {
width: 100px;
}
.contact-sidebar {
display: none;
}
.slide {
width: 33.3%;
}
.text-block-8 {
text-align: center;
}
.image-14 {
display: block;
margin-top: 60px;
margin-bottom: 60px;
}
.image-15 {
display: none;
}
.image-16 {
display: none;
}
.div-block-67 {
width: 100%;
}
.div-block-68 {
display: none;
}
.breadcrumb-wrap {
padding-right: 20px;
padding-left: 20px;
}
.div-block-67-copy {
width: 100%;
margin-left: 0%;
}
.breadcrumb-wrap-copy {
padding-right: 20px;
padding-left: 20px;
}
}
@media screen and (max-width: 479px) {
h1 {
font-size: 36px;
line-height: 52px;
}
.index-cover--slogan {
padding-right: 20px;
padding-left: 20px;
}
.index-cover--subtitle {
padding-right: 20px;
padding-left: 20px;
}
.index-product--btn-block {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.index-product--card {
margin-bottom: 0px;
}
.index-business--card {
margin-bottom: 0px;
}
.index-achievement--block {
width: 82%;
}
.right-arrow-2 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.left-arrow-2 {
display: none;
}
.index-client {
margin-right: 0%;
margin-left: 0%;
}
.div-block-35 {
grid-column-gap: 24px;
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
}
.div-block-36 {
width: auto;
height: auto;
}
.div-block-44 {
display: none;
}
.div-block-47 {
margin-left: 0%;
padding-top: 16px;
border-top: 0.5px solid #8a8d8f;
}
.div-block-50 {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
grid-row-gap: 16px;
}
.image-8 {
width: 132px;
}
.slide {
width: 100%;
}
.div-block-73 {
-ms-grid-columns: 1fr 1fr 1fr;
grid-template-columns: 1fr 1fr 1fr;
}
.div-block-75 {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-webkit-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.div-block-76 {
width: 100%;
}
.image-21 {
width: 100%;
margin-bottom: 24px;
margin-left: 0px;
}
.div-block-78 {
margin-bottom: 16px;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.field-label {
width: 100%;
}
}
#w-node-d9ba88be-d55c-c6f6-b4d2-c0a3d90dac13-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_5e94692a-54eb-8167-4e51-b1a4e51ed40a-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-a5542f1b-399e-da46-0ac9-7320d7fb167b-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_2f894e43-7121-07b2-762f-2e6687b90d37-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_30d432fe-9300-0aed-306c-e8783cb08fd9-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_0ba6ae68-7b80-2a22-3a35-f697c3c42569-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_5da6dd53-4b25-c528-0613-c05a86291451-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_7ed2cdc8-1d11-f245-0d56-2277f809c4b3-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_452a84a8-4105-21d2-c6b2-fb1b6de6f309-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-da6ce54d-717f-8643-03a2-325f70145c72-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-d6ee891e-4362-a0bc-cc13-c4f19293c77b-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_1aaa10e8-e179-d8e8-f038-55d8d2e0073b-d258a477 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-b056509d-a401-bcbf-8783-63e0d0a8d98a-d0a8d98a {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_6b440500-ad03-56ac-e711-923ea4bd1c4c-4b58a47f {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-c5836c50-241e-475c-f322-459f9f43f27a-4b58a47f {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_557f852f-21ca-25a6-1574-0e3b3b625e8b-4b58a47f {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_03afcf46-1730-4911-ba2e-7182f26c4c7b-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-a5a1a677-c089-4aaf-89d0-8eea45ea06a5-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-fbacf5c6-73e7-8d56-ca29-b06ea3fef726-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_7dc12f79-a34e-f5dc-87ea-d3761fbebd76-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_28f7c202-c6e3-09be-c575-2f9c080cbec1-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_920d8ee4-542d-115b-5e44-2b3fa5d176cc-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-_4e29d93b-2481-9c7c-ab8d-7a62d65763a4-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-b2365942-5d81-0f66-47a0-44da8ffac581-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-b2ee9754-c954-e7e7-cb98-a47fa5a9e0db-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-b2ee9754-c954-e7e7-cb98-a47fa5a9e0e2-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-b2ee9754-c954-e7e7-cb98-a47fa5a9e0e9-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-b2ee9754-c954-e7e7-cb98-a47fa5a9e0f0-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}
#w-node-b2ee9754-c954-e7e7-cb98-a47fa5a9e0f7-0158a488 {
-ms-grid-column: span 1;
grid-column-start: span 1;
-ms-grid-column-span: 1;
grid-column-end: span 1;
-ms-grid-row: span 1;
grid-row-start: span 1;
-ms-grid-row-span: 1;
grid-row-end: span 1;
}