/*mixin-set*/
/*style set*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap");
html,
body {
  font-size: 16px;
  line-height: 24px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  letter-spacing: 1px;
  -webkit-overflow-scrolling: touch;
}

p {
  line-height: 150%;
}

.hide {
  display: none !important;
}

.alcenter {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.txt-yel {
  color: #eceb1a;
}

.txt-wh {
  color: #fff;
}

.txt-bk {
  color: #000;
}

.txt-graysub {
  color: #d7d2cb;
}

/*@mixin img-replace($img, $w: image-width($img), $h: image-height($img), $disp: block) {
    background: image-url($img) no-repeat;
    width: $w;
    height: $h;
    display: $disp;
}*/
@font-face {
  font-family: "Futura Bold";
  src: local("Futura Bold"), url("https://sunlight-betula.com/outlink/html_thePartner/fonts/Futura Bold.ttf");
}
@font-face {
  font-family: "Futura Medium";
  src: local("Futura Medium"), url("https://sunlight-betula.com/outlink/html_thePartner/fonts/Futura Medium.ttf");
}
@font-face {
  font-family: "Cn Medium";
  src: local("Cn Medium"), url("../fonts/SourceHanSansTC-Medium.otf");
}
@font-face {
  font-family: "Cn Bold";
  src: local("Cn Bold"), url("../fonts/SourceHanSansTC-Bold.otf");
}
@font-face {
  font-family: "Cn Heavy";
  src: local("Cn Heavy"), url("../fonts/SourceHanSansTC-Heavy.otf");
}
.en {
  font-family: "Futura", sans-serif;
}

.en-medium, .contact .contact--col form .form--use button, [lang=en] .section .title-section, .page-bottom .inner .content .address ul li a, .header .menu.active {
  font-family: "Futura Medium", sans-serif;
}

.en-bold, .sec-staff .staff-list .card-staff .card-content .title, .page-bottom .inner .content .brief-sub p {
  font-family: "Futura Bold", sans-serif;
}

.cn {
  font-family: "Noto Sans TC", sans-serif;
}

.cn-medium, [lang=zh-Hant] .section .title-section {
  font-family: "Cn Medium", sans-serif;
}

.cn-bold {
  font-family: "Cn Bold", sans-serif;
}

.cn-heavy {
  font-family: "Cn Heavy", sans-serif;
}

h1, .f-h1 {
  font-size: 83px;
  line-height: 160%;
  letter-spacing: 0;
}
@media (max-width: 768px) {
  h1, .f-h1 {
    font-size: 34px;
  }
}

.f-100, .page-index .main .brief .headline {
  font-size: 100px;
}

.f-52, .section-brand-logo h1.coreval, .list-qa li .qa-content .title, .list-service li .title, .section-love .icon-love--tittle {
  font-size: 52px;
}

.f-42 {
  font-size: 42px;
}

.f-40, .page-bottom .inner .content .brief-sub p {
  font-size: 40px;
}

.f-32 {
  font-size: 32px;
}

.f-30 {
  font-size: 30px;
}

.f-27 {
  font-size: 27px;
}

.f-23 {
  font-size: 23px;
}

.f-22, .page-bottom .inner .content .address ul li a {
  font-size: 22px;
}

.f-100, .page-index .main .brief .headline {
  font-size: 5.2083333333vw;
}
@media (max-width: 768px) {
  .f-100, .page-index .main .brief .headline {
    font-size: 13.9211136891vw;
  }
}
@media (max-width: 430px) {
  .f-100, .page-index .main .brief .headline {
    font-size: 11.6009280742vw;
  }
}

.f-52, .section-brand-logo h1.coreval, .list-qa li .qa-content .title, .list-service li .title, .section-love .icon-love--tittle {
  font-size: 2.7083333333vw;
}
@media (max-width: 768px) {
  .f-52, .section-brand-logo h1.coreval, .list-qa li .qa-content .title, .list-service li .title, .section-love .icon-love--tittle {
    font-size: 8.4454756381vw;
  }
}
@media (max-width: 430px) {
  .f-52, .section-brand-logo h1.coreval, .list-qa li .qa-content .title, .list-service li .title, .section-love .icon-love--tittle {
    font-size: 6.0324825986vw;
  }
}

.f-45, .hero--content p.title, .list-qa li .qa-content .description, .list-service li .description, .header .menu .nav > a {
  font-size: 45px;
}
@media (max-width: 768px) {
  .f-45, .hero--content p.title, .list-qa li .qa-content .description, .list-service li .description, .header .menu .nav > a {
    font-size: 31.5px;
  }
}
@media (max-width: 430px) {
  .f-45, .hero--content p.title, .list-qa li .qa-content .description, .list-service li .description, .header .menu .nav > a {
    font-size: 18px;
  }
}

.f-34, .dataNum--item p, .header .menu .nav .actbox .lan a {
  font-size: 1.7708333333vw;
}
@media (max-width: 768px) {
  .f-34, .dataNum--item p, .header .menu .nav .actbox .lan a {
    font-size: 5.5220417633vw;
  }
}
@media (max-width: 430px) {
  .f-34, .dataNum--item p, .header .menu .nav .actbox .lan a {
    font-size: 4.7331786543vw;
  }
}

.f-26, .section-casebrief .case-info--item ul, .section-casebrief .case-info--item p, .section-casebrief .case-info--item h2.title, .hero--content p.author, .dataNum--item p.en-bold, .dataNum--item .sec-staff .staff-list .card-staff .card-content p.title, .sec-staff .staff-list .card-staff .card-content .dataNum--item p.title, .dataNum--item .page-bottom .inner .content .brief-sub p, .page-bottom .inner .content .brief-sub .dataNum--item p {
  font-size: 1.3541666667vw;
}
@media (max-width: 768px) {
  .f-26, .section-casebrief .case-info--item ul, .section-casebrief .case-info--item p, .section-casebrief .case-info--item h2.title, .hero--content p.author, .dataNum--item p.en-bold, .dataNum--item .sec-staff .staff-list .card-staff .card-content p.title, .sec-staff .staff-list .card-staff .card-content .dataNum--item p.title, .dataNum--item .page-bottom .inner .content .brief-sub p, .page-bottom .inner .content .brief-sub .dataNum--item p {
    font-size: 4.222737819vw;
  }
}
@media (max-width: 430px) {
  .f-26, .section-casebrief .case-info--item ul, .section-casebrief .case-info--item p, .section-casebrief .case-info--item h2.title, .hero--content p.author, .dataNum--item p.en-bold, .dataNum--item .sec-staff .staff-list .card-staff .card-content p.title, .sec-staff .staff-list .card-staff .card-content .dataNum--item p.title, .dataNum--item .page-bottom .inner .content .brief-sub p, .page-bottom .inner .content .brief-sub .dataNum--item p {
    font-size: 3.6194895592vw;
  }
}

.header {
  display: flex;
  padding: 35px 7.2%;
  justify-content: space-between;
  position: fixed;
  top: -100px;
  width: 100vw;
  z-index: 99;
  box-sizing: border-box;
  background-color: rgba(255, 255, 255, 0);
  transition: 0.3s;
}
.header .logo {
  display: block;
  width: 50%;
  height: auto;
  max-width: 250px;
  position: relative;
  z-index: 2;
}
.header .logo svg {
  width: 100%;
  height: auto;
}
.header .logo svg path {
  fill: #000;
}
.header .logo .logo-icon {
  transform: scale(0.8);
  transform-origin: left top;
}
.header .menu {
  display: flex;
  width: 100vw;
  height: calc(100vh + 100px);
  position: fixed;
  top: 0px;
  left: 0;
  background: #fff;
  justify-content: center;
  align-items: flex-start;
  box-sizing: border-box;
  padding-top: 10vh;
  animation: hidemenu 1s 1s forwards;
  overflow-y: auto;
}
.header .menu .nav {
  display: inline-flex;
  flex-direction: column;
  gap: 40px;
}
.header .menu .nav > a {
  display: block;
  color: #000;
  text-decoration: none;
  line-height: 100%;
  letter-spacing: 0;
  position: relative;
  transition: 0.3s;
  text-align: center;
  margin-top: -20vh;
  opacity: 0;
  transition-duration: 1s;
  transition-delay: 0;
}
.header .menu .nav > a:hover {
  color: #eceb1a;
  transition-duration: 0.3s;
  transition-delay: 0;
}
@media (max-width: 768px) {
  .header .menu .nav > a {
    font-size: 31.5px !important;
  }
}
.header .menu .nav .actbox {
  margin-top: 0;
  opacity: 0;
  transition-duration: 1s;
  transition-delay: 0s;
  padding-bottom: 40px;
}
.header .menu .nav .actbox .lan {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  position: relative;
}
.header .menu .nav .actbox .lan span {
  color: #000;
}
.header .menu .nav .actbox .lan a {
  display: block;
  color: #000;
  line-height: 100%;
}
.header .menu.active {
  display: flex;
  gap: 4px;
  color: #fff;
  font-size: 20px;
  animation: showmenu 1s forwards;
}
.header .menu.active .nav > a {
  margin-top: 0;
  opacity: 1;
  transition-duration: 1s;
  transition-delay: 1;
}
.header .menu.active .nav > a:hover {
  color: #eceb1a;
  transition-duration: 0.3s;
}
.header .menu.active .nav .actbox {
  margin-top: 9vh;
  opacity: 1;
  transition-duration: 1s;
  transition-delay: 0.3s;
}
.header .menu.active .nav .actbox a:hover {
  color: #eceb1a;
  transition-duration: 0.3s;
}
.header .ham {
  position: absolute;
  width: 50px;
  height: 50px;
  right: 7.2%;
  top: 25px;
  display: block;
}
.header .ham .ham--line {
  display: block;
  width: 42px;
  height: 2px;
  background: #000;
  position: absolute;
}
.header .ham .ham--line:nth-child(1) {
  top: 15px;
  left: 8px;
  transition: 0.3s;
}
.header .ham .ham--line:nth-child(2) {
  top: 24px;
  left: 8px;
  opacity: 1;
  transition: 0.3s;
}
.header .ham .ham--line:nth-child(3) {
  top: 33px;
  left: 8px;
  transition: 0.3s;
}
.header .ham.active .ham--line:nth-child(1) {
  top: 25px;
  left: 8px;
  transform-origin: center;
  rotate: 45deg;
  transition: 0.3s;
}
.header .ham.active .ham--line:nth-child(2) {
  top: 29px;
  left: 14px;
  transform-origin: center;
  transform: scaleX(0);
  opacity: 0;
  transition: 0.3s;
}
.header .ham.active .ham--line:nth-child(3) {
  top: 25px;
  left: 8px;
  transform-origin: center;
  rotate: -45deg;
  transition: 0.3s;
}
.header.scrolling {
  background-color: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(10px);
  transition: 0.3s;
}
@media (max-width: 768px) {
  .header {
    padding: 20px 5%;
  }
  .header .logo {
    width: 150px;
  }
  .header .menu {
    padding-top: 15vh;
  }
  .header .menu .nav {
    gap: 28px;
  }
  .header .ham {
    top: 2px;
    right: 3%;
    transform: scale(0.72);
  }
}

@keyframes showmenu {
  0% {
    visibility: hidden;
    opacity: 0;
    background: #000;
  }
  50% {
    visibility: visible;
    opacity: 1;
  }
  100% {
    visibility: visible;
    opacity: 1;
    background: #fff;
  }
}
@keyframes hidemenu {
  0% {
    visibility: visible;
    opacity: 1;
  }
  50% {
    visibility: visible;
    opacity: 0;
  }
  100% {
    visibility: hidden;
    opacity: 0;
  }
}
.brief {
  position: relative;
}
.brief .headline {
  line-height: 132%;
}
@media (max-width: 1024px) {
  .brief .headline {
    line-height: 135%;
  }
}

.addCursor {
  font-size: inherit;
  position: relative;
}
.addCursor:after {
  content: "";
  display: block;
  width: 50%;
  height: 80%;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
  right: -16px;
  animation-name: blink;
  animation-duration: 0.05s;
  animation-delay: 0s;
  animation-fill-mode: forwards;
  background: #fff;
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.loading {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999999;
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: white;
  justify-content: center;
  align-items: center;
  gap: 32px;
}
.loading img {
  width: 120px;
}
.loading .loadingtxt {
  color: #d7d2cb;
}

.quote-v {
  width: 16.6666666667vw;
}
.quote-v path {
  fill: #eceb1a;
}
@media (max-width: 768px) {
  .quote-v {
    width: 41.5584415584vw;
  }
}
@media (max-width: 430px) {
  .quote-v {
    width: 41.5584415584vw;
  }
}

.article-main {
  position: relative;
  padding-left: 27%;
  box-sizing: border-box;
  margin-top: 90px;
  letter-spacing: 0;
}
.article-main .inner {
  position: relative;
}
.article-main .inner .quote-v {
  width: 16.6666666667vw;
  opacity: 1;
  position: absolute;
  top: -2.6041666667vw;
  left: -10.4166666667vw;
}
.article-main .inner .article-content {
  position: relative;
  z-index: 2;
}
.article-main .inner.with-quote {
  padding-top: 5.2083333333vw;
}
@media (max-width: 768px) {
  .article-main .inner .quote-v {
    width: 41.5584415584vw;
    opacity: 1;
    position: absolute;
    top: -6.4935064935vw;
    left: -25.974025974vw;
  }
  .article-main .inner.with-quote {
    padding-top: 12.987012987vw;
  }
}
@media (max-width: 430px) {
  .article-main .inner .quote-v {
    width: 41.5584415584vw;
    opacity: 1;
    position: absolute;
    top: -6.4935064935vw;
    left: -25.974025974vw;
  }
  .article-main .inner.with-quote {
    padding-top: 12.987012987vw;
  }
}

.pagetitle {
  font-size: 5.2083333333vw;
  letter-spacing: 0;
  line-height: 140%;
  padding-top: 14.8958333333vw;
}
.pagetitle span {
  display: block;
}
@media (max-width: 768px) {
  .pagetitle {
    font-size: 18.5614849188vw;
    padding-top: 33.1786542923vw;
  }
}
@media (max-width: 430px) {
  .pagetitle {
    font-size: 13.9211136891vw;
  }
}

.footer {
  margin-top: 27.0833333333vw;
  border-top: solid 1px #000;
}
@media (max-width: 768px) {
  .footer {
    margin-top: 47.3342002601vw;
  }
}
@media (max-width: 430px) {
  .footer {
    margin-top: 60.3248259861vw;
  }
}

.page-bottom {
  width: 96%;
  max-width: 1620px;
  margin: 0 auto;
}
.page-bottom .inner {
  position: relative;
}
.page-bottom .inner .content {
  display: flex;
  justify-content: space-between;
  padding: 16px 0;
}
.page-bottom .inner .content .brief-sub {
  padding: 22px 0 0 0px;
}
.page-bottom .inner .content .brief-sub p {
  letter-spacing: -4px;
  color: #fff;
  line-height: 100%;
}
.page-bottom .inner .content .address {
  padding-top: 25px;
}
.page-bottom .inner .content .address ul {
  display: inline-flex;
  flex-direction: column;
}
.page-bottom .inner .content .address ul li a {
  text-decoration: none;
  color: #fff;
  letter-spacing: 0;
  line-height: 140%;
  transition: 0.3s;
}
.page-bottom .inner .content .address ul li a:hover {
  color: #eceb1a;
}
.page-bottom .inner .logo-bottom {
  margin-top: 14.5833333333vw;
}
.page-bottom .inner .logo-bottom .logo-icon svg {
  aspect-ratio: 215/24;
  width: 100%;
  height: 100%;
}
.page-bottom .inner .logo-bottom .logo-icon svg path {
  fill: #fff;
}
.page-bottom.set-bk .inner .content .brief-sub p {
  color: #000;
}
.page-bottom.set-bk .inner .content .address a {
  color: #000;
}
.page-bottom.set-bk .inner .logo-bottom svg path {
  fill: #000;
}
.page-bottom.set-yel .inner .deco-quote svg path {
  fill: #eceb1a;
}
.page-bottom.set-yel .inner .content {
  border-top: solid 1px #000;
}
.page-bottom.set-yel .inner .content .brief-sub p {
  color: #000;
}
.page-bottom.set-yel .inner .content .address a {
  color: #000;
}
.page-bottom.set-yel .inner .logo-bottom svg path {
  fill: #000;
}
@media (max-width: 768px) {
  .page-bottom .inner .deco-quote svg {
    width: 11%;
  }
  .page-bottom .inner .content {
    padding: 16px 12px;
    flex-direction: column;
  }
  .page-bottom .inner .content .brief-sub {
    flex-shrink: 0;
  }
  .page-bottom .inner .content .brief-sub p {
    font-size: 24px;
    letter-spacing: 0;
  }
  .page-bottom .inner .content .address {
    width: 100%;
  }
  .page-bottom .inner .content .address ul li a {
    font-size: 16px;
    line-height: 110%;
  }
  .page-bottom .inner .logo-bottom {
    margin-top: 11.5384615385vw;
  }
}

body {
  background: #fff;
}

.noscroll {
  overflow: hidden;
}

[lang=en] .section.section-light {
  border-top: solid 1px #fff;
}
[lang=en] .section.section-light .title-section {
  color: #fff;
}

.sec-xl {
  width: 96%;
  max-width: 1620px;
  margin-right: auto;
  margin-left: auto;
}

.sec-large {
  width: 90%;
  max-width: 1320px;
  margin-right: auto;
  margin-left: auto;
}

.sec-right {
  width: 100vw;
  box-sizing: border-box;
}
.sec-right--container {
  margin-left: 23.7%;
}
@media (max-width: 768px) {
  .sec-right--container {
    margin-left: 19%;
  }
}

.gap-ex {
  margin-top: 16.9270833333vw;
}
@media (max-width: 768px) {
  .gap-ex {
    margin-top: 37.7030162413vw;
  }
}
@media (max-width: 430px) {
  .gap-ex {
    margin-top: 22.6218097448vw;
  }
}

.gap-large {
  margin-top: 22.9166666667vw;
}
@media (max-width: 768px) {
  .gap-large {
    margin-top: 51.0440835267vw;
  }
}
@media (max-width: 430px) {
  .gap-large {
    margin-top: 30.626450116vw;
  }
}

.page-index .main .core-value {
  position: relative;
  display: flex;
  overflow: hidden;
  min-height: 100vh;
}
.page-index .main .core-value .videobox {
  width: 100vw;
  height: auto;
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
}
.page-index .main .core-value .videobox video {
  width: 100%;
}
@media (max-width: 1024px) {
  .page-index .main .core-value {
    flex-direction: column;
  }
  .page-index .main .core-value .videobox {
    width: 200vw;
  }
}
.page-index .main .brief {
  position: relative;
  flex-shrink: 0;
  z-index: 2;
}
@media (max-width: 1024px) {
  .page-index .main .brief {
    width: 90%;
    box-sizing: border-box;
    margin-top: 80px;
    margin-bottom: 10px;
  }
}

.dataNum {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  box-sizing: border-box;
  /*<1680*/
}
.dataNum--item {
  text-align: center;
}
.dataNum--item--container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: auto;
  font-size: 124px;
  line-height: 100%;
  height: 156px;
  opacity: 0;
}
.dataNum--item--container svg {
  height: 70%;
}
.dataNum--item--container.animated {
  opacity: 1;
}
.dataNum--item--container.dataNum-infiniti {
  opacity: 1;
}
.dataNum--item p {
  line-height: 124%;
  color: #000;
}
@media (max-width: 1680px) {
  .dataNum {
    row-gap: 6vw;
  }
  .dataNum--item {
    width: 50%;
  }
}
@media (max-width: 768px) {
  .dataNum {
    column-gap: 6%;
  }
  .dataNum--item {
    width: 47%;
  }
  .dataNum--item--container {
    font-size: 90px;
    height: 120px;
  }
}
@media (max-width: 430px) {
  .dataNum {
    row-gap: 10vw;
  }
  .dataNum--item {
    width: 100%;
  }
  .dataNum--item--container {
    font-size: 90px;
    height: 120px;
  }
}

.sec-manifesto {
  margin-top: 13.8vw;
}
@media (max-width: 768px) {
  .sec-manifesto {
    margin-top: 40.7vw;
  }
}

#template, #path {
  fill: none;
}

#path {
  stroke: #eceb1a;
  stroke-width: 18px;
  visibility: hidden;
}

.section-love .icon-love {
  width: 50%;
  max-width: 520px;
}
.section-love .icon-love--tittle {
  padding-bottom: 72px;
}
.section-love .icon-love svg {
  width: 100%;
}
.section-love .icon-love svg polygon {
  fill: #eceb1a;
}
.section-love .icon-love svg path {
  fill: #eceb1a;
}
.section-love .article-content .credo-list {
  padding-top: 113px;
}
.section-love .article-content .credo-list .credo-item {
  margin-bottom: 24px;
}
.section-love .article-content .credo-list .credo-item .title-sub {
  font-size: 60px;
  margin-bottom: 8px;
  line-height: 100%;
}
.section-love .article-content .credo-list .credo-item .words {
  font-size: 36px;
}
@media (max-width: 768px) {
  .section-love .icon-love--tittle {
    padding-bottom: 24px;
  }
  .section-love .article-content .credo-list {
    padding-top: 72px;
  }
  .section-love .article-content .credo-list .credo-item {
    margin-bottom: 24px;
  }
  .section-love .article-content .credo-list .credo-item .title-sub {
    font-size: 48px;
    margin-bottom: 8px;
    line-height: 100%;
  }
  .section-love .article-content .credo-list .credo-item .words {
    font-size: 28px;
  }
}
@media (max-width: 430px) {
  .section-love .article-content .credo-list {
    padding-top: 48px;
  }
  .section-love .article-content .credo-list .credo-item {
    margin-bottom: 24px;
  }
  .section-love .article-content .credo-list .credo-item .title-sub {
    font-size: 32px;
    margin-bottom: 8px;
    line-height: 100%;
  }
  .section-love .article-content .credo-list .credo-item .words {
    font-size: 22px;
  }
}

.sec-staff {
  margin-top: 27.5vw;
  position: relative;
}
.sec-staff .deco-quote {
  width: 320px;
  position: absolute;
  right: 0;
  top: -11.6145833333vw;
  z-index: 1;
}
.sec-staff .deco-quote svg path {
  fill: #eceb1a;
}
.sec-staff .staff-list {
  margin: 0 auto 0 auto;
  display: flex;
  flex-wrap: wrap;
  column-gap: 16px;
  row-gap: 76px;
  position: relative;
  z-index: 2;
}
.sec-staff .staff-list .card-staff {
  width: calc((100% - 32px) / 3);
}
.sec-staff .staff-list .card-staff .card-cover {
  width: 100%;
  aspect-ratio: 430/570;
  position: relative;
  overflow: hidden;
}
.sec-staff .staff-list .card-staff .card-cover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.3s;
  transform: scale(1);
}
.sec-staff .staff-list .card-staff .card-cover .saying {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 10%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.8);
  font-size: 2.3vw;
  color: #eceb1a;
  opacity: 0;
  transition: 0.5s;
}
.sec-staff .staff-list .card-staff .card-cover.active img {
  transition: 0.3s;
  transform: scale(1.1);
}
.sec-staff .staff-list .card-staff .card-cover.active .saying {
  opacity: 1;
  transition: 0.5s;
}
.sec-staff .staff-list .card-staff .card-content {
  margin-top: 44px;
}
.sec-staff .staff-list .card-staff .card-content .title {
  line-height: 100%;
  margin-bottom: 8px;
}
.sec-staff .staff-list .card-staff .card-content .job-title {
  font-size: 42px;
  line-height: 100%;
}
@media (max-width: 768px) {
  .sec-staff .staff-list {
    width: 100%;
    margin: 52px auto 0 auto;
    column-gap: 8px;
    row-gap: 32px;
  }
  .sec-staff .staff-list .card-staff {
    width: calc((100% - 8px) / 2);
  }
  .sec-staff .staff-list .card-staff .card-content {
    margin-top: 16px;
  }
  .sec-staff .staff-list .card-staff .card-content .title {
    font-size: 16px;
    margin-bottom: -4px;
  }
  .sec-staff .staff-list .card-staff .card-content .job-title {
    font-size: 10px;
  }
}
@media (max-width: 768px) {
  .sec-staff {
    margin-top: 49.0023201856vw;
  }
  .sec-staff .deco-quote {
    top: -25.8700696056vw;
  }
}

.list-service {
  padding: 0;
  list-style-type: none;
}
.list-service li {
  border-bottom: solid 2px #d7d2cb;
  box-sizing: border-box;
  padding-right: 12px;
  padding-bottom: 32px;
  margin-bottom: 40px;
}
.list-service li .title {
  line-height: 140%;
}
.list-service li .description {
  line-height: 180%;
}

.method-end .inner {
  position: relative;
}
.method-end .quote-v {
  transform: translate(-50%, -50%) !important;
  top: 50%;
  left: 50%;
  position: absolute;
}
.method-end .article-content p {
  text-align: center;
}
@media (max-width: 768px) {
  .method-end .article-content p {
    font-size: 18px !important;
  }
}

.list-qa {
  padding: 0;
  list-style-type: none;
  margin-top: 100px;
}
.list-qa li {
  display: flex;
  align-items: center;
  gap: 80px;
  cursor: pointer;
  border-bottom: solid 2px #d7d2cb;
  padding-bottom: 60px;
  margin-bottom: 72px;
}
.list-qa li .qa-content {
  flex-grow: 1;
}
.list-qa li .qa-content .title {
  line-height: 140%;
  transition: 0.3s;
}
.list-qa li .qa-content .description {
  line-height: 180%;
  overflow: hidden;
  padding-left: 16%;
  padding-top: 0;
}
.list-qa li .qa-trigger {
  width: 42px;
  height: 42px;
  flex-shrink: 0;
  margin-right: 8vw;
}
.list-qa li .qa-trigger img {
  width: 100%;
  display: block;
}
.list-qa li .qa-trigger img svg {
  width: 100%;
}
.list-qa li:hover .qa-content .title {
  color: #eceb1a;
}
@media (max-width: 768px) {
  .list-qa li {
    gap: 8px;
  }
  .list-qa li .qa-trigger {
    width: 5vw;
    height: 5vw;
  }
}

.section-partners {
  margin-top: 18vh;
}

.wheel-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
}
.wheel-wrapper .mask-top {
  width: 100%;
  height: 40%;
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
  pointer-events: none;
}
.wheel-wrapper .mask-bottom {
  width: 100%;
  height: 40%;
  position: absolute;
  z-index: 2;
  bottom: 0;
  left: 0;
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
  pointer-events: none;
}

.list-partners {
  list-style: none;
  margin: 0;
  padding: 0;
  height: 50vw;
  overflow-y: scroll;
  scrollbar-width: none;
  scroll-snap-type: y mandatory;
  scroll-behavior: smooth;
  display: flex;
  flex-direction: column;
  gap: 1vw;
}
.list-partners li {
  scroll-snap-align: center;
}
@media (max-width: 1024px) {
  .list-partners {
    height: 80vw;
    gap: 2vw;
  }
}
@media (max-width: 768px) {
  .list-partners {
    height: 120vw;
    gap: 4vw;
  }
}

.list-partners li a {
  font-size: 5vw;
  color: #000;
  opacity: 0.6;
  transition: 0.3s;
  display: block;
  text-align: center;
  line-height: 110%;
  letter-spacing: 0;
}
.list-partners li a:hover {
  color: #eceb1a;
  opacity: 1;
}
@media (max-width: 1024px) {
  .list-partners li a {
    font-size: 10vw;
  }
}
@media (max-width: 768px) {
  .list-partners li a {
    font-size: 10vw;
  }
}

.list-partners::-webkit-scrollbar {
  display: none;
}

.hero {
  width: 100%;
  aspect-ratio: 1000/562;
  position: relative;
  /*<1680*/
}
.hero--img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero--content {
  position: absolute;
  left: 15.5vw;
  transform: translateY(-50%);
  top: 42%;
}
.hero--content p.title {
  line-height: 116%;
  letter-spacing: 0.2vw;
  margin-bottom: 16%;
}
@media (max-width: 1680px) {
  .hero--content {
    left: 8vw;
  }
}
@media (max-width: 768px) {
  .hero {
    margin-top: 60px;
  }
  .hero--img {
    width: 100%;
    height: 60vh;
  }
  .hero--img img {
    object-position: 70%;
  }
  .hero--content {
    top: 20%;
    left: 5vw;
  }
  .hero--content p.title {
    margin-bottom: 6%;
  }
  .hero--content p.author {
    /*max-width: 55%;*/
    max-width: 100%;
  }
}

.page-partner-article .header.set-white .logo svg path {
  fill: #fff;
}
.page-partner-article .header.set-white .ham .ham--line {
  background: #fff;
}
.page-partner-article .header.set-white.scrolling .logo svg path {
  fill: #000;
}
.page-partner-article .header.set-white.scrolling .ham .ham--line {
  background: #000;
}
.page-partner-article .header.set-white.active .logo svg path {
  fill: #000;
}
.page-partner-article .header.set-white.active .ham .ham--line {
  background: #000;
}
@media (max-width: 768px) {
  .page-partner-article .header.set-white .logo svg path {
    fill: #000;
  }
  .page-partner-article .header.set-white .ham .ham--line {
    background: #000;
  }
}
.page-partner-article .hero.set-white .hero--content p, .page-partner-article .hero.set-white .author p {
  color: #fff !important;
}

.section-brand-logo {
  margin-top: 19.375vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  padding: 0 10%;
}
@media (max-width: 768px) {
  .section-brand-logo {
    margin-top: 20.7424593968vw;
  }
}
.section-brand-logo .logo {
  width: auto;
  max-width: 500px;
}
.section-brand-logo .logo img {
  display: block;
  max-width: 100%;
}
.section-brand-logo h1.coreval {
  line-height: 146%;
  text-align: center;
}

.section-casebrief {
  margin-top: 9.8958333333vw;
}
@media (max-width: 768px) {
  .section-casebrief {
    margin-top: 13.2250580046vw;
  }
}
.section-casebrief .case-info--item {
  margin-bottom: 3.2vw;
}
.section-casebrief .case-info--item h2.title {
  margin-bottom: 18px;
}
.section-casebrief .case-info--item p {
  line-height: 180%;
}
.section-casebrief .case-info--item ul {
  line-height: 180%;
  list-style-type: disc;
  padding-left: 18px;
}
@media (max-width: 768px) {
  .section-casebrief .case-info--item h2.title {
    margin-bottom: 4px;
  }
  .section-casebrief .case-info--item p {
    line-height: 160%;
  }
  .section-casebrief .case-info--item ul {
    line-height: 160%;
  }
}

.section-banners {
  margin-top: 15.5208333333vw;
}
@media (max-width: 768px) {
  .section-banners {
    margin-top: 20.7424593968vw;
  }
}

.imgbox {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 4.8958333333vw;
}
@media (max-width: 768px) {
  .imgbox {
    margin-bottom: 6.5429234339vw;
  }
}
.imgbox.imgbox-full .img-container {
  width: 100%;
}
.imgbox.imgbox-1-3 .img-container {
  width: 33.3%;
}
.imgbox.imgbox-1-2 .img-container {
  width: 50%;
}
.imgbox img {
  display: block;
  width: 100%;
  height: 100%;
}

.contact {
  width: 0;
  height: 100vh;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;
  overflow: hidden;
  transition: 0.3s;
}
.contact .contact--col {
  width: 100vw;
  max-width: 780px;
  height: 100vh;
  position: absolute;
  top: 0;
  right: -780px;
  z-index: 9999;
  background: #d7d2cb;
  transition: 1s;
  overflow: auto;
}
.contact .contact--col .title {
  height: 50vh;
  font-size: 65px;
  line-height: 130%;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 20px;
  box-sizing: border-box;
  letter-spacing: 0;
}
.contact .contact--col form {
  width: 100%;
  max-width: 780px;
}
.contact .contact--col form .form--use {
  border-top: solid 1px #000;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  padding: 20px;
  box-sizing: border-box;
}
.contact .contact--col form .form--use--title {
  width: 200px;
  font-size: 23px;
}
.contact .contact--col form .form--use input {
  font-size: 23px;
  outline: none;
  border: none;
  padding: 8px;
  flex-grow: 1;
}
.contact .contact--col form .form--use input:focus {
  background: #fff;
  border-radius: 4px;
}
.contact .contact--col form .form--use.txtarea .form--use--title {
  width: 100%;
}
.contact .contact--col form .form--use.txtarea textarea {
  width: 100%;
  font-size: 23px;
  outline: none;
  border: none;
  padding: 8px;
}
.contact .contact--col form .form--use.txtarea textarea:focus {
  background: #fff;
  border-radius: 4px;
}
.contact .contact--col form .form--use button {
  font-size: 23px;
  width: 100%;
  text-align: left;
  transition: 0.3s;
  cursor: pointer;
}
.contact .contact--col form .form--use button:hover {
  color: #eceb1a;
}
.contact .contact--col form .uploadbox {
  padding: 0 20px;
  box-sizing: border-box;
}
.contact .contact--col form .uploadbox .uploadbox--btn {
  display: flex;
  align-items: center;
  height: 60px;
  cursor: pointer;
  transition: 0.3s;
}
.contact .contact--col form .uploadbox .uploadbox--btn:hover {
  color: #eceb1a;
}
.contact .contact--col .closebtn {
  position: fixed;
  width: 50px;
  height: 50px;
  right: 18px;
  top: 36px;
  display: none;
}
.contact .contact--col .closebtn .closebtn--line {
  display: block;
  width: 22px;
  height: 1px;
  background: #000;
  position: absolute;
}
.contact .contact--col .closebtn .closebtn--line:nth-child(1) {
  top: 30px;
  left: 14px;
  transform-origin: center;
  rotate: 45deg;
  transition: 0.3s;
}
.contact .contact--col .closebtn .closebtn--line:nth-child(2) {
  top: 29px;
  left: 14px;
  transform-origin: center;
  transform: scaleX(0);
  opacity: 0;
  transition: 0.3s;
}
.contact .contact--col .closebtn .closebtn--line:nth-child(3) {
  top: 30px;
  left: 14px;
  transform-origin: center;
  rotate: -45deg;
  transition: 0.3s;
}
.contact:before {
  content: "";
  display: block;
  width: 0;
  height: 100vh;
  position: absolute;
  right: 0;
  background: rgba(0, 0, 0, 0.5);
  transition: 2s;
}
.contact.active {
  width: 100vw;
}
.contact.active .contact--col {
  right: 0;
}
.contact.active .contact--col .closebtn {
  display: block;
}
.contact.active:before {
  width: 100vw;
  transition: 0.5s;
}
@media (max-width: 768px) {
  .contact .contact--col {
    padding: 0 32px;
    box-sizing: border-box;
  }
  .contact .contact--col .title {
    font-size: 34px;
  }
  .contact .contact--col form .form--use {
    padding: 4px;
  }
  .contact .contact--col form .form--use--title {
    width: 100px;
    font-size: 12px;
    letter-spacing: 0;
  }
  .contact .contact--col form .form--use input {
    font-size: 12px;
    padding: 8px 8px;
  }
  .contact .contact--col form .form--use.txtarea {
    gap: 4px;
  }
  .contact .contact--col form .form--use.txtarea textarea {
    font-size: 12px;
  }
  .contact .contact--col form .form--use button {
    padding: 8px 0;
    font-size: 12px;
  }
  .contact .contact--col form .uploadbox {
    padding: 0 4px;
    box-sizing: border-box;
  }
  .contact .contact--col form .uploadbox .uploadbox--btn {
    height: 40px;
    font-size: 12px;
  }
}

.for-m {
  display: none;
}
@media (max-width: 768px) {
  .for-m {
    display: block;
  }
}
/*# sourceMappingURL=screen.css.map */