@font-face {
  font-family: Gotham;
  src: url('../fonts/Gotham-Bold.otf') format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --white: white;
  --black: black;
  --dark-slate-blue: #2e3091;
  --slate-blue: #6062ac;
  --seashell: #faf4f0;
  --linen: #eeded5;
  --hot-pink: #ed5a9e;
  --orange: #f7ac1b;
  --yellow: #cedc29;
  --white-smoke: #f8f8f8;
  --snow: #fffcfa;
  --seashell-2: #fff3ec;
  --seashell-3: #f5eee9;
  --linen-2: #faeae1;
  --sky-blue: #6dcbdf;
  --grey: #7c7c7c;
  --black-2: #0003;
  --dark-orange: #ef8f00e6;
  --sky-blue-2: #44b4cce6;
  --yellow-green: #a5c001e6;
  --deep-pink: #dc478ce6;
  --rosy-brown: #a69090;
}

.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.w-checkbox {
  margin-bottom: 5px;
  padding-left: 20px;
  display: block;
}

.w-checkbox:before {
  content: " ";
  grid-area: 1 / 1 / 2 / 2;
  display: table;
}

.w-checkbox:after {
  content: " ";
  clear: both;
  grid-area: 1 / 1 / 2 / 2;
  display: table;
}

.w-checkbox-input {
  float: left;
  margin: 4px 0 0 -20px;
  line-height: normal;
}

.w-checkbox-input--inputType-custom {
  border: 1px solid #ccc;
  border-radius: 2px;
  width: 12px;
  height: 12px;
}

.w-checkbox-input--inputType-custom.w--redirected-checked {
  background-color: #3898ec;
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/static/custom-checkbox-checkmark.589d534424.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-color: #3898ec;
}

.w-checkbox-input--inputType-custom.w--redirected-focus {
  box-shadow: 0 0 3px 1px #3898ec;
}

.w-embed-youtubevideo {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/static/youtube-placeholder.2b05e7d68d.svg');
  background-position: 50%;
  background-size: cover;
  width: 100%;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  position: relative;
}

.w-embed-youtubevideo:empty {
  min-height: 75px;
  padding-bottom: 56.25%;
}

.w-form-formradioinput--inputType-custom {
  border: 1px solid #ccc;
  border-radius: 50%;
  width: 12px;
  height: 12px;
}

.w-form-formradioinput--inputType-custom.w--redirected-focus {
  box-shadow: 0 0 3px 1px #3898ec;
}

.w-form-formradioinput--inputType-custom.w--redirected-checked {
  border-width: 4px;
  border-color: #3898ec;
}

@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }
}

body {
  background-color: var(--white);
  color: var(--black);
  font-family: Noto Sans TC, sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 120%;
}

h1 {
  letter-spacing: 2px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 54px;
  font-weight: 700;
  line-height: 110%;
}

h2 {
  letter-spacing: 1px;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 36px;
  font-weight: 700;
  line-height: 110%;
}

p {
  margin-bottom: 0;
  line-height: 175%;
}

a {
  color: var(--dark-slate-blue);
  text-decoration: none;
  transition: color .5s;
}

a:hover {
  color: var(--slate-blue);
}

strong {
  font-weight: 700;
}

.section-banner {
  z-index: 10;
  position: relative;
}

.section-banner.v-home {
  z-index: 9;
  top: auto;
  overflow: hidden;
}

.section-banner.v-home.job {
  top: auto;
}

.img-full {
  width: 100%;
  display: block;
  position: relative;
}

.relative, .section-content {
  position: relative;
}

.section-footer {
  z-index: 1000;
  position: relative;
  bottom: auto;
}

.footer-shortcut-b {
  background-color: var(--white);
  box-shadow: 0 -10px 0 0 var(--seashell);
  border-top-left-radius: 120px;
  border-top-right-radius: 120px;
  margin-top: -120px;
  padding-top: 60px;
  padding-bottom: 60px;
  position: relative;
}

.container {
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 40px;
  padding-right: 40px;
  position: relative;
}

.container.v-login, .container.v-act-detail-enroll {
  padding-left: 100px;
  padding-right: 100px;
}

.footer-shortcut-list {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  display: flex;
}

.footer-shorcut-item {
  width: 33.3%;
  padding-left: 10px;
  padding-right: 10px;
  position: relative;
}

.footer-shortcut-link {
  color: var(--black);
  text-align: center;
  padding: 20px;
  transition: all .5s;
  display: block;
  position: relative;
}

.footer-shortcut-link:hover {
  color: var(--dark-slate-blue);
  transform: translate(0, -5px);
}

.footer-shortcut-title {
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.btn-common {
  border: 1px solid var(--dark-slate-blue);
  color: var(--dark-slate-blue);
  text-align: left;
  border-radius: 20px;
  padding: 9px 20px;
  font-weight: 700;
  transition: background-color .5s, color .5s;
  display: inline-block;
}

.btn-common.v-white {
  border-color: var(--white);
  color: var(--white);
}

.btn-common.v-upload {
  padding: 5px;
}

.btn-common.mobile-only {
  display: none;
}

.btn-common-wrap {
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.btn-common-arrow-b {
  flex: none;
  width: 18px;
  margin-left: 10px;
  position: relative;
}

.footer-shortcut-line {
  background-color: var(--linen);
  width: 1px;
  height: 150px;
  position: absolute;
  inset: 50% 0% auto auto;
  transform: translate(0, -50%);
}

.btn-common-arrow-hover {
  opacity: 0;
  width: 100%;
  transition: opacity .5s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.footer-b {
  background-image: linear-gradient(135deg, var(--hot-pink), var(--orange) 51%, var(--yellow));
  color: var(--white);
  padding-top: 30px;
  padding-bottom: 30px;
  font-family: Outfit, sans-serif;
}

.footer-wrap, .footer-l-b {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.footer-logo-b {
  flex: none;
  width: 155px;
  margin-right: 30px;
}

.footer-logo-b.v-gov {
  width: 220px;
}

.footer-logo-link {
  display: block;
}

.footer-link-list {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.footer-link-item {
  margin-right: 30px;
}

.footer-link {
  color: var(--white);
  text-shadow: 1px 1px 10px #0000;
  transition: text-shadow .5s, color .5s;
}

.footer-link:hover {
  color: var(--white);
  text-shadow: 1px 1px 10px #0006;
}

.footer-r-b {
  text-align: right;
  flex: 1;
}

.footer-webdesign {
  margin-top: 5px;
}

.inline-span {
  display: inline-block;
}

.header {
  z-index: 3000;
  color: var(--white);
  background-color: #0000;
  width: 100%;
  font-size: 15px;
  position: fixed;
  inset: 0% auto auto 0%;
}

.header-bg {
  background-color: var(--dark-slate-blue);
  border-bottom-right-radius: 40px;
  border-bottom-left-radius: 40px;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.brand {
  float: none;
  width: 100px;
  margin-right: 2vw;
  padding: 0;
  display: block;
}

.header-wrap {
  justify-content: flex-start;
  align-items: center;
  height: 90px;
  display: flex;
}

.nav-menu {
  float: none;
  flex: 1;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.btn-menu {
  float: none;
}

.nav-menu-main {
  flex: 1;
  order: -1;
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.nav-menu-icons {
  border-left: 1px solid var(--white);
  justify-content: flex-end;
  align-items: center;
  display: flex;
}

.nav-menu-icon-item {
  width: 20px;
  margin-left: 1vw;
}

.nav-menu-icon-btn {
  padding: 0;
  display: block;
}

.nav-lang-dropdown {
  display: block;
}

.nav-lang-dropdown-list {
  inset: auto auto 0% 50%;
  transform: translate(-50%, 100%);
}

.nav-lang-dropdown-list.w--open {
  background-color: #0000;
  padding-top: 15px;
}

.nav-lang-box {
  background-color: var(--white);
  border-radius: 10px;
  overflow: hidden;
}

.nav-lang-link {
  color: var(--dark-slate-blue);
  text-align: center;
  font-weight: 500;
  transition: background-color .5s, color .5s;
}

.nav-lang-link:hover {
  color: var(--slate-blue);
  background-color: #ececff;
}

.nav-item {
  margin-right: 2vw;
}

.nav-link {
  color: var(--white);
  text-align: center;
  justify-content: center;
  align-items: center;
  height: 90px;
  padding: 0;
  font-weight: 500;
  transition: color .5s;
  display: flex;
  position: relative;
}

.nav-link:hover, .nav-link.w--current {
  color: var(--orange);
}

.nav-icon-home {
  background-image: url('../images/header-icon-home-white.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  flex: none;
  width: 24px;
  height: 24px;
  position: relative;
}

.nav-submenu {
  background-color: var(--slate-blue);
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  overflow: hidden;
}

.nav-submenu.w--open {
  left: 50%;
  transform: translate(-50%);
}

.nav-submenu-tip {
  opacity: 0;
  background-image: url('../images/header-submenu-tip.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 18px;
  height: 9px;
  position: absolute;
  inset: auto auto 0% 50%;
  transform: translate(-50%);
}

.nav-sublink {
  color: var(--white);
  text-align: center;
  padding: 20px 10px;
  font-weight: 500;
  transition: background-color .5s, color .5s;
}

.nav-sublink:hover {
  color: var(--white);
  background-color: #2e309180;
}

.nav-sublink.w--current {
  color: var(--orange);
}

.nav-sublink-line {
  background-color: var(--white);
  height: 1px;
  margin-left: 10px;
  margin-right: 10px;
}

.nav-account-b {
  order: 1;
  margin-left: 1.5vw;
}

.btn-header-login {
  border: 1px solid var(--white);
  color: var(--white);
  background-color: #0000;
  border-radius: 20px;
  padding: 10px 20px;
  font-weight: 700;
  line-height: 110%;
  transition: background-color .5s, color .5s;
}

.btn-header-login:hover {
  background-color: var(--white);
  color: var(--dark-slate-blue);
}

.header-login-box {
  background-color: var(--white);
  border-radius: 10px;
  justify-content: center;
  align-items: center;
  padding: 5px 10px;
  font-weight: 700;
  display: flex;
}

.header-account-wrap {
  color: var(--dark-slate-blue);
  background-image: url('../images/header-icon-account.svg');
  background-position: 0%;
  background-repeat: no-repeat;
  background-size: 15px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 20px;
  line-height: 110%;
  display: block;
}

.header-account-line {
  background-color: var(--dark-slate-blue);
  flex: none;
  width: 1px;
  height: 20px;
  margin-left: 10px;
  margin-right: 10px;
}

.popup-b {
  z-index: 4000;
  opacity: 0;
  background-color: #2e3091cc;
  width: 100%;
  height: 100%;
  padding-top: 100px;
  padding-bottom: 100px;
  display: none;
  position: fixed;
  inset: 0% auto auto 0%;
  overflow: auto;
}

.popup-b.popup-scroll {
  opacity: 0;
  display: none;
}

.popup-b.popup-scroll.edit {
  opacity: 1;
  display: block;
}

.pop-search {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  display: none;
  position: relative;
}

.common-popup-box {
  background-color: var(--white);
  border-radius: 20px;
  padding: 20px;
  position: relative;
}

.common-popup-box.act-filter {
  padding-bottom: 40px;
  padding-left: 40px;
  padding-right: 40px;
}

.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  width: 260px;
  display: flex;
}

.utility-page-form {
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

.textfield {
  background-color: var(--white);
  border: 1px #000;
  border-radius: 20px;
  height: auto;
  margin-bottom: 0;
  padding: 12px 20px;
  font-size: 17px;
  line-height: 120%;
  position: relative;
  box-shadow: 3px 3px #0000000d;
}

.textfield:focus {
  border-style: none;
}

.textfield::placeholder {
  color: #0006;
}

.textfield.v-beige {
  background-color: var(--white-smoke);
  position: relative;
}

.textfield.v-search {
  padding-right: 50px;
}

.textfield.v-login {
  padding-left: 65px;
}

.textfield.datepicker {
  background-image: url('../images/form-datepicker-icon.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: auto 100%;
}

.textfield.v-subscribe {
  padding-right: 110px;
}

.btn-search {
  background-color: #0000;
  background-image: url('../images/btn-search.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 20px;
  height: 20px;
  margin-right: 20px;
  padding: 0;
  display: block;
  position: absolute;
  inset: 50% 0% auto auto;
  transform: translate(0, -50%);
}

.search {
  margin-bottom: 0;
  position: relative;
}

.btn-pop-close {
  background-color: var(--hot-pink);
  background-image: url('../images/pop-close.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
  width: 60px;
  height: 30px;
  margin-right: -30px;
  transition: background-color .5s, color .5s;
  position: absolute;
  inset: 0% 0% auto auto;
}

.btn-pop-close:hover {
  background-color: var(--orange);
}

.popup-bg-click {
  width: 100%;
  height: 100%;
  position: fixed;
  inset: 0% auto auto 0%;
}

.popup-bg-click.popup-close {
  cursor: pointer;
}

.popup-title {
  color: var(--dark-slate-blue);
  text-align: center;
  margin-bottom: 10px;
  font-size: 30px;
  font-weight: 700;
  line-height: 120%;
}

.common-popup-box-outter {
  background-image: linear-gradient(to right, var(--orange), var(--hot-pink));
  border-radius: 21px;
  padding: 2px;
  position: relative;
}

.nav-icon-home-hover {
  opacity: 0;
  background-image: url('../images/header-icon-home-orange.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  flex: none;
  width: 24px;
  height: 24px;
  position: relative;
}

.section-div {
  position: relative;
}

.section-div.home-life {
  background-color: var(--seashell);
}

.section-div.home-news {
  z-index: 1;
  background-color: var(--snow);
}

.section-div.home-about {
  background-color: var(--seashell);
}

.section-div.home-register {
  background-color: var(--seashell);
  padding-bottom: 120px;
  overflow: hidden;
}

.section-div.inner-life-planning-journey {
  background-color: var(--seashell);
}

.section-div.innerpage-last {
  padding-bottom: 120px;
}

.section-div.inner-act-detail {
  background-color: var(--seashell);
  overflow: hidden;
}

.section-div.industry-latest {
  background-color: var(--seashell);
  border-top-left-radius: 60px;
  border-top-right-radius: 60px;
  overflow: hidden;
}

.section-div.industry-listing {
  background-color: var(--seashell);
  overflow: hidden;
}

.section-div.job-detail-act {
  background-color: var(--snow);
  padding-bottom: 40px;
}

.section-div.job-detail-share {
  background-color: var(--seashell);
  border-top-left-radius: 60px;
  border-top-right-radius: 60px;
  margin-top: -40px;
  overflow: hidden;
}

.section-div.inner-share-student {
  background-color: var(--snow);
  overflow: hidden;
}

.content-b {
  padding-top: 80px;
  padding-bottom: 80px;
  position: relative;
}

.content-b.home-news {
  padding-top: 0;
  padding-bottom: 60px;
}

.content-b.home-about {
  background-color: var(--snow);
  border-bottom-right-radius: 60px;
  border-bottom-left-radius: 60px;
  padding-top: 0;
  padding-left: 100px;
  padding-right: 100px;
  overflow: hidden;
}

.content-b.home-register {
  padding-top: 160px;
  padding-bottom: 160px;
}

.content-b.home-life {
  padding-top: 30px;
  overflow: hidden;
}

.content-b.innerpage-first {
  padding-top: 8%;
}

.content-b.innerpage-first.v-survey {
  padding-bottom: 0;
}

.content-b.inner-act-detail {
  padding-top: 0;
}

.content-b.industry-latest {
  border-top-left-radius: 60px;
  border-top-right-radius: 60px;
}

.content-b.job-detail-act-list, .content-b.v-about, .content-b.v-share-listing {
  padding-top: 0;
}

.home-section-deco-b {
  justify-content: center;
  align-items: stretch;
  margin-top: -2px;
  margin-bottom: -2px;
  display: flex;
  overflow: hidden;
}

.home-section-arrow-deco-1 {
  background-image: url('../images/home-deco-arrow-1.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  padding-top: 16.25%;
}

.home-sec-deco-main {
  z-index: 1;
  flex: none;
  width: 100%;
  max-width: 1440px;
  position: relative;
}

.gome-sec-arrow-deco-cont-1 {
  background-image: url('../images/home-deco-arrow-1-cont.svg');
  background-position: 0 0;
  background-size: auto 100%;
  flex: 1;
  margin-right: -2px;
  display: none;
  position: relative;
}

.gome-sec-arrow-deco-cont-1-end {
  background-image: url('../images/home-deco-arrow-1-cont-end.svg');
  background-position: 0 0;
  background-size: auto 100%;
  flex: 1;
  margin-left: -5%;
  display: none;
  position: relative;
}

.section-heading-b {
  text-align: center;
  margin-bottom: 40px;
  position: relative;
}

.section-heading-txt {
  color: var(--dark-slate-blue);
}

.section-heading-line {
  background-image: linear-gradient(to top, var(--hot-pink), var(--orange));
  transform-origin: 50% 0;
  width: 2px;
  height: 80px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
}

.home-news-slider {
  background-color: #0000;
  height: auto;
  position: relative;
}

.hide {
  display: none;
}

.slider-arrow {
  background-image: linear-gradient(315deg, var(--hot-pink), var(--orange));
  border-radius: 50%;
  width: 60px;
  height: 60px;
  margin-top: 20px;
  margin-left: 0;
  margin-right: 0;
  padding: 15px;
  position: relative;
  overflow: hidden;
}

.slider-arrow.v-prev {
  float: left;
}

.slider-arrow.v-next {
  float: right;
}

.slider-arrow-bg {
  background-color: var(--orange);
  opacity: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.slider-arrow-center {
  border: 2px solid var(--seashell-2);
  background-color: var(--white);
  border-radius: 50%;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.slider-arrow-icon {
  background-image: url('../images/slider-arrow-l.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 100%;
}

.slider-arrow-icon.v-next {
  background-image: url('../images/slider-arrow-r.svg');
}

.slider-arrow-frame {
  border: 2px solid var(--seashell-2);
  border-radius: 50%;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.slider-b {
  float: left;
  clear: both;
  width: 100%;
  position: relative;
}

.slider-arrow-line {
  background-color: var(--linen);
  height: 1px;
  margin-bottom: 30px;
  margin-left: 120px;
  margin-right: 120px;
  position: absolute;
  inset: auto 0% 0%;
}

.home-news-slide {
  width: 33.3%;
  padding-left: 15px;
  padding-right: 15px;
}

.home-news-mask {
  margin-left: -15px;
  margin-right: -15px;
  padding-bottom: 4px;
}

.home-news-link {
  color: var(--black);
  background-color: #0000;
  border-radius: 20px;
  padding: 20px;
  transition: box-shadow .5s, background-color .5s, color .5s;
  display: block;
  position: relative;
  box-shadow: 3px 3px #0000;
}

.home-news-link:hover {
  background-color: var(--slate-blue);
  color: var(--white);
  box-shadow: 3px 3px #0000001a;
}

.home-news-date-b {
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background-image: url('../images/AY2526-eDM_v4.1-1.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 10px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 20px;
  display: flex;
}

.home-news-date-txt {
  color: var(--slate-blue);
  font-family: Outfit, sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 120%;
  transition: color .5s;
}

.home-news-date-dots {
  background-image: url('../images/news-dots.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  flex: 1;
  height: 6px;
  margin-left: 15px;
  position: relative;
}

.home-news-date-dots-hover {
  opacity: 0;
  background-image: url('../images/news-dots-orange.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 100%;
  transition: opacity .5s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.home-news-title {
  font-size: 24px;
  font-weight: 500;
  line-height: 120%;
}

.home-news-des {
  max-height: 81.6px;
  margin-top: 10px;
  overflow: hidden;
}

.home-news-btn-b {
  margin-top: 10px;
  display: inline-block;
  position: relative;
}

.home-news-btn {
  border: 1px solid var(--dark-slate-blue);
  border-radius: 20px;
  padding: 8px 18px;
  position: relative;
}

.home-news-btn.v-hover {
  border-color: var(--white);
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity .5s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.home-news-arrow-b {
  width: 18px;
}

.home-shortcut-b {
  background-color: var(--white);
  border-top-left-radius: 60px;
  border-top-right-radius: 60px;
  max-width: 1440px;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
  padding: 20px;
  position: relative;
  box-shadow: 0 -6px 10px #0000001a;
}

.home-shortcut-wrap {
  border-radius: 60px;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
  overflow: hidden;
}

.home-shortcut-item {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  text-align: center;
  text-shadow: 0 4px 10px #0009;
  width: 100%;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
  display: block;
  position: relative;
  overflow: hidden;
}

.home-shortcut-item:hover {
  color: var(--white);
}

.home-shortcut-content-b {
  background-color: #0000004d;
  justify-content: center;
  align-items: center;
  height: 200px;
  padding: 20px;
  display: flex;
  position: relative;
}

.home-shortcut-content {
  width: 100%;
}

.home-shortcut-btn-b {
  margin-top: 20px;
  display: inline-block;
  position: relative;
}

.home-shortcut-btn {
  border: 1px solid var(--white);
  border-radius: 20px;
  padding: 8px 18px;
  position: relative;
}

.home-shortcut-arrow-b {
  width: 18px;
}

.home-shortcut-img {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.home-shortcut-img.img-1 {
  background-image: url('../images/home-shortchut-img-12x.jpg');
}

.home-shortcut-img.img-2 {
  background-image: url('../images/home-shortchut-img-22x.jpg');
}

.home-shortcut-img.img-3 {
  background-image: url('../images/home-shortchut-img-32x.jpg');
}

.section-watermark {
  transform-origin: 0 0;
  color: var(--white-smoke);
  position: absolute;
  inset: 0% auto auto 0%;
  overflow: hidden;
  transform: rotate(90deg)translate(0%, -100%);
}

.section-watermark.v-right {
  transform-origin: 100% 0;
  inset: 0% 0% auto auto;
  transform: rotate(-90deg)translate(0, -100%);
}

.section-watermark.v-pink-lighter {
  color: var(--seashell);
}

.section-watermark.v-pink-darker {
  color: var(--seashell-3);
}

.section-watermark.v-pink-sharp {
  color: var(--linen-2);
}

.section-watermark-txt {
  text-transform: uppercase;
  white-space: nowrap;
  font-family: Gotham, sans-serif;
  font-size: 100px;
  font-weight: 700;
  line-height: 110%;
}

.section-watermark-flip {
  overflow: hidden;
  transform: rotate(180deg);
}

.activities-list {
  position: relative;
}

.activities-link {
  color: var(--black);
  align-items: stretch;
  display: flex;
}

.activities-item-l-b {
  justify-content: flex-end;
  align-items: flex-start;
  width: 50%;
  padding-bottom: 40px;
  padding-right: 25px;
  display: flex;
  position: relative;
}

.activities-item-r-b {
  width: 50%;
  padding-top: 25px;
  padding-bottom: 60px;
}

.activities-line {
  background-color: var(--white-smoke);
  width: 2px;
  margin-left: 40px;
  margin-right: 40px;
}

.activities-item-type-b {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  border-radius: 8px;
  margin-bottom: 20px;
  padding: 5px 15px;
  font-weight: 700;
  display: inline-block;
}

.activities-item-type-b.v-detail {
  margin-bottom: 0;
}

.activities-item-title {
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.activities-item-info-gp {
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 8px;
  display: flex;
}

.act-item-info-icon-b {
  flex: none;
  width: 30px;
  margin-right: 15px;
}

.activities-tag-list {
  flex-wrap: wrap;
  flex: 1;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: -5px;
  margin-left: -5px;
  margin-right: -5px;
  display: flex;
}

.activities-tag-item {
  margin-bottom: 5px;
  padding-left: 5px;
  padding-right: 5px;
}

.act-tag {
  background-color: var(--yellow);
  color: var(--white);
  border-radius: 8px;
  padding: 5px 15px;
  font-weight: 500;
}

.act-tag.v-teacher {
  background-color: var(--sky-blue);
}

.act-tag.v-parent {
  background-color: var(--hot-pink);
}

.act-tag.v-subject {
  border: 1px solid var(--grey);
  color: var(--grey);
  background-color: #0000;
  font-weight: 400;
}

.act-item-btn-b {
  margin-top: 40px;
}

.act-item-des {
  color: var(--grey);
  max-height: 89.25px;
  margin-top: 20px;
  overflow: hidden;
}

.act-item-graphic-b {
  width: 100%;
  max-width: 360px;
  margin-top: 40px;
  margin-left: 100px;
  position: relative;
}

.act-item-img {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  padding-top: 100%;
  position: relative;
}

.act-item-img.v-designtech {
  background-image: url('../images/act-subject-designtech2x.png');
}

.act-item-img.v-lang {
  background-image: url('../images/act-subject-language2x.png');
}

.act-item-img.v-it {
  background-image: url('../images/act-subject-it2x.png');
}

.act-item-color-block-light {
  background-color: var(--seashell);
  border-radius: 10px;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: rotate(-3deg);
}

.act-item-color-block-dark {
  background-color: var(--linen);
  border-radius: 10px;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: translate(2%)rotate(3deg);
}

.act-item-date-b {
  border: 6px solid var(--white-smoke);
  background-color: var(--orange);
  color: var(--white);
  text-align: center;
  border-radius: 60px;
  justify-content: flex-start;
  align-items: center;
  margin-top: -40px;
  margin-right: -25px;
  padding: 15px 25px;
  font-family: Outfit, sans-serif;
  font-weight: 500;
  display: flex;
  position: absolute;
  inset: 0% 0% auto auto;
}

.act-item-month {
  text-transform: uppercase;
  margin-bottom: 5px;
  font-size: 20px;
  line-height: 100%;
}

.act-item-year {
  font-size: 15px;
  line-height: 100%;
}

.act-item-date-hyphen {
  margin-left: 5px;
  margin-right: 5px;
  font-size: 24px;
  line-height: 100%;
}

.act-item-date-tip {
  background-image: url('../images/act-listing-date-tip.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 29px;
  height: 29px;
  margin-bottom: -2px;
  margin-right: -5px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.act-list-more-btn {
  border: 2px solid var(--white-smoke);
  background-image: linear-gradient(135deg, var(--orange), var(--hot-pink));
  border-radius: 50%;
  width: 120px;
  height: 120px;
  margin-left: auto;
  margin-right: auto;
  padding: 30px;
  display: block;
  position: relative;
  overflow: hidden;
}

.act-list-more-wheel {
  background-image: url('../images/showmore-circle-txt.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.act-list-more-center {
  border: 2px solid var(--white-smoke);
  background-color: var(--white);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}

.act-more-dot-b {
  width: 33px;
}

.act-list-more-bg {
  background-color: var(--orange);
  opacity: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.section-bg {
  width: 100%;
  max-width: 1440px;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 50%;
  overflow: hidden;
  transform: translate(-50%);
}

.section-bg.inner-first {
  margin-top: 20px;
}

.overflow-hidden {
  overflow: hidden;
}

.home-shortcut-edge {
  width: 80px;
  margin-left: -79px;
  margin-right: -79px;
  display: none;
  position: absolute;
  inset: auto auto 0% 0%;
}

.home-shortcut-edge.v-right {
  inset: auto 0% 0% auto;
}

.ac-list-deco {
  width: 96px;
  margin: 60px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.ac-list-deco.bottom-right {
  margin-bottom: 160px;
  inset: auto 0% 0% auto;
}

.home-about-content {
  text-align: center;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.font-size-30 {
  font-size: 30px;
  line-height: 120%;
}

.section-learnmore-b {
  text-align: center;
  margin-top: 40px;
}

.gome-sec-arrow-deco-cont-2-end {
  background-image: url('../images/home-deco-arrow-2-cont-end.svg');
  background-position: 0 0;
  background-size: auto 100%;
  flex: 1;
  margin-right: -5%;
  display: none;
  position: relative;
}

.home-section-arrow-deco-2 {
  background-image: url('../images/home-deco-arrow-2.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  padding-top: 16.0417%;
}

.gome-sec-arrow-deco-cont-2 {
  background-image: url('../images/home-deco-arrow-2-cont.svg');
  background-position: 0 0;
  background-size: auto 100%;
  flex: 1;
  margin-left: -2px;
  display: none;
  position: relative;
}

.sticky-btn-gp {
  z-index: 2000;
  border: 1px solid var(--white);
  background-color: var(--dark-slate-blue);
  border-radius: 40px;
  margin-right: 10px;
  padding-left: 10px;
  padding-right: 10px;
  position: fixed;
  inset: 50% 0% auto auto;
  transform: translate(0, -50%);
}

.sticky-btn {
  width: 30px;
  display: block;
}

.sticky-btn-item {
  margin-top: 10px;
  margin-bottom: 10px;
}

.home-regiester-bg-img {
  width: 800px;
  margin-top: -40px;
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
}

.home-register-content {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 60px;
  padding-right: 60px;
  position: relative;
}

.form-b {
  margin-bottom: 0;
  position: relative;
}

.home-regiester-intro {
  text-align: center;
  margin-bottom: 40px;
}

.form-wrap {
  margin-bottom: -30px;
}

.form-row {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.form-col {
  width: 100%;
  margin-bottom: 30px;
  padding-left: 10px;
  padding-right: 10px;
}

.form-col.v-40 {
  width: 40%;
}

.form-col.v-60 {
  width: 60%;
}

.form-col.v-50.full-w {
  width: 100%;
}

.form-col.v-enrol-people {
  width: 40%;
}

.form-label {
  margin-bottom: 10px;
  font-weight: 500;
}

.form-label.interest-select {
  flex: 1;
  margin-bottom: 0;
  margin-right: 10px;
}

.field-gp {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  margin-left: -5px;
  margin-right: -5px;
  display: flex;
}

.field-gp-item {
  padding-left: 5px;
  padding-right: 5px;
}

.field-gp-item.v-50 {
  width: 50%;
}

.field-gp-item.school-select-district {
  width: 150px;
}

.field-gp-item.school-name, .field-gp-item.v-act-contact-person-lastname, .field-gp-item.v-act-contact-person-firstname {
  flex: 1;
}

.field-gp-item.v-act-contact-person-title, .field-gp-item.survey-name-role {
  width: 150px;
}

.field-gp-item.survey-name {
  flex: 1;
}

.form-select {
  background-color: var(--white);
  background-image: url('../images/form-select-arrow.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: auto 46px;
  border: 1px #000;
  border-radius: 20px;
  height: auto;
  margin-bottom: 0;
  padding: 12px 20px;
  font-size: 17px;
  line-height: 120%;
  position: relative;
  box-shadow: 3px 3px #0000000d;
}

.form-select:focus {
  border-style: none;
}

.form-select::placeholder {
  color: #0006;
}

.form-select.non-editable {
  opacity: .5;
}

.form-select.v-beige {
  background-color: var(--white-smoke);
  background-image: url('../images/form-select-arrow-ornage.svg');
}

.form-submit-b {
  text-align: center;
  margin-top: 30px;
}

.form-submit-b.v-50 {
  width: 50%;
}

.home-register-deco-row-1 {
  justify-content: space-between;
  align-items: center;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.home-register-deco {
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  padding: 12% 60px;
  display: flex;
  position: absolute;
  inset: 50% auto auto 0%;
  transform: translate(0, -50%);
}

.home-register-deco.v-act-detail {
  padding-top: 10%;
  padding-bottom: 160px;
}

.home-register-deco-arrow {
  width: 11.25%;
}

.home-register-deco-square {
  width: 6.83%;
}

.home-register-deco-row-2 {
  justify-content: space-between;
  align-items: center;
  width: 80%;
  margin: 2% auto;
  display: flex;
}

.home-register-deco-tri {
  width: 8.2%;
}

.home-register-deco-circle {
  width: 6.9%;
}

.home-register-deco-row-3 {
  justify-content: space-between;
  align-items: center;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.home-register-deco-ring {
  width: 6.41667%;
}

.home-register-deco-arch {
  width: 11.8333%;
}

.home-banner-mask {
  z-index: 100;
  background-image: url('../images/home-banner-bottom.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  margin-bottom: -2px;
  padding-top: 8.05%;
  display: none;
  position: absolute;
  inset: auto auto 0% 0%;
}

.life-wheel-b {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  padding: 1.92%;
  position: relative;
}

.life-wheel-b.v-en {
  font-size: 15px;
  line-height: 120%;
}

.life-wheel-base {
  position: relative;
}

.life-wheel-corner {
  color: var(--grey);
  width: 25.7%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.life-wheel-corner.tr {
  inset: 0% 0% auto auto;
}

.life-wheel-corner.bl {
  inset: auto auto 0% 0%;
}

.life-wheel-corner.br {
  inset: auto 0% 0% auto;
}

.life-wheel-corner.life-wheel-link {
  z-index: 10;
  opacity: 0;
  color: var(--white);
  cursor: pointer;
  transition: opacity .5s;
}

.life-wheel-corner.life-wheel-link:hover {
  opacity: 1;
}

.life-wheel-center {
  background-image: url('../images/wheel-default-img2x.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 50%;
  margin: 5%;
  position: absolute;
  inset: 0%;
  overflow: hidden;
}

.life-wheel-mark {
  background-image: url('../images/wheel-mark2x.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.life-wheel-img-mask {
  background-color: var(--black-2);
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.life-wheel-rotate {
  background-image: url('../images/wheel-rotate.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  transition: all .5s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.life-wheel-corner-txt-b {
  z-index: 1;
  text-align: center;
  white-space: nowrap;
  width: auto;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 500;
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
}

.wheel-num {
  font-size: 24px;
  line-height: 100%;
}

.wheel-theme {
  font-size: 30px;
  line-height: 120%;
}

.wheel-theme.v-en {
  font-size: 24px;
  line-height: 120%;
}

.life-wheel-icon-click {
  width: 50px;
  margin-bottom: 20%;
  margin-right: -10%;
  position: absolute;
  inset: auto 0% 0% auto;
}

.life-wheel-photo {
  opacity: 0;
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  transition: opacity .8s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.life-wheel-photo.lw-pt1 {
  background-image: url('../images/wheel-1-img2x.jpg');
}

.life-wheel-photo.lw-pt2 {
  background-image: url('../images/wheel-2-img2x.jpg');
}

.life-wheel-photo.lw-pt3 {
  background-image: url('../images/wheel-3-img2x.jpg');
}

.life-wheel-photo.lw-pt4 {
  background-image: url('../images/wheel-4-img2x.jpg');
}

.life-wheel-content {
  opacity: 0;
  background-color: #f7ac1be6;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 10%;
  transition: opacity .8s;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.life-wheel-content.lw-pt1 {
  background-color: var(--dark-orange);
}

.life-wheel-content.lw-pt2 {
  background-color: var(--sky-blue-2);
}

.life-wheel-content.lw-pt3 {
  background-color: var(--yellow-green);
}

.life-wheel-content.lw-pt4 {
  background-color: var(--deep-pink);
}

.life-wheel-content.v-en {
  padding-left: 20%;
  padding-right: 20%;
}

.life-wheel-content-wrap {
  color: var(--white);
  text-align: center;
  width: 100%;
}

.life-wheel-content-intro {
  margin-bottom: 20px;
  font-weight: 700;
}

.life-wheel-content-btn-gp {
  justify-content: center;
  align-items: center;
  display: flex;
}

.life-wheel-content-btn {
  color: var(--white);
  text-shadow: 0 4px 10px #0000;
  width: 50%;
  font-size: 30px;
  font-weight: 700;
  line-height: 120%;
  transition: text-shadow .5s, color .5s;
}

.life-wheel-content-btn:hover {
  color: var(--white);
  text-shadow: 0 4px 10px #0006;
}

.life-wheel-content-btn-arrow {
  width: 35px;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
}

.life-wheel-btn-line {
  background-color: var(--white);
  width: 1px;
  height: 150px;
}

.life-wheel-base-colored {
  opacity: 0;
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  transition: opacity .8s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.life-wheel-base-colored.lw-pt1 {
  background-image: url('../images/wheel-ring-1.svg');
}

.life-wheel-base-colored.lw-pt2 {
  background-image: url('../images/wheel-ring-2.svg');
}

.life-wheel-base-colored.lw-pt3 {
  background-image: url('../images/wheel-ring-3.svg');
}

.life-wheel-base-colored.lw-pt4 {
  background-image: url('../images/wheel-ring-4.svg');
}

.life-planning-watermark-b {
  color: var(--snow);
  text-transform: uppercase;
  white-space: nowrap;
  width: 100%;
  font-family: Gotham, sans-serif;
  font-size: 100px;
  font-weight: 700;
  line-height: 110%;
  position: absolute;
  inset: 50% auto auto 50%;
  overflow: hidden;
  transform: translate(-50%, -50%);
}

.life-planning-watermark-line1 {
  float: left;
  clear: both;
  margin-left: -200px;
}

.life-planning-watermark-line2 {
  float: right;
  clear: both;
  margin-right: -200px;
}

.life-planning-watermark-wrap {
  max-width: 1440px;
  margin-top: 100px;
  margin-left: auto;
  margin-right: auto;
}

.life-planning-watermark-wrap.innerpage {
  margin-top: 0;
}

.life-planning-deco-b {
  width: 9.72222%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.life-planning-deco-b.deco-1 {
  margin-top: 150px;
  margin-left: 40px;
}

.life-planning-deco-b.deco-2 {
  width: 6.25%;
  margin-top: 400px;
  margin-right: 100px;
  inset: 0% 0% auto auto;
}

.life-planning-deco-b.deco-3 {
  width: 3.47222%;
  margin-bottom: 80px;
  margin-left: 100px;
  inset: auto auto 0% 0%;
}

.life-planning-deco-b.deco-4 {
  width: 6.94444%;
  margin-bottom: -20px;
  margin-right: -40px;
  inset: auto 0% 0% auto;
}

.inner-banner-b {
  background-color: var(--snow);
  text-align: center;
  background-image: url('../images/innerpage-banner-deco2x.png');
  background-position: 100% 100%;
  background-repeat: no-repeat;
  background-size: auto 100%;
  margin-bottom: -3.5%;
  padding-top: 90px;
  position: relative;
}

.inner-banner-content {
  padding-top: 40px;
  padding-bottom: 60px;
  overflow: hidden;
}

.inner-banner-content.v-detail {
  padding-top: 20px;
  padding-bottom: 50px;
}

.innerpage-heading {
  color: var(--dark-slate-blue);
}

.inner-banner-deco-b {
  justify-content: center;
  align-items: stretch;
  margin-bottom: -8%;
  display: flex;
  position: relative;
}

.inner-banner-deco-main {
  width: 100%;
  max-width: 1440px;
}

.inner-banner-deco-main-img {
  text-align: center;
  background-image: url('../images/innerpage-banner-arrow.svg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 11.8%;
  font-weight: 700;
}

.inner-banner-deco-main-img.v-detail {
  background-image: url('../images/innerpage-banner-arrow-detail.svg');
}

.inner-banner-deco-end {
  flex: 1;
  display: none;
}

.inner-banner-deco-cont {
  background-image: url('../images/innerpage-banner-arrow-cont.svg');
  background-position: 0 0;
  background-repeat: repeat-x;
  background-size: auto 100%;
  flex: 1;
  margin-right: -2px;
  display: none;
}

.inner-banner-deco-cont.v-detail {
  margin-left: -2px;
  margin-right: 0;
}

.login-box {
  background-color: var(--seashell);
  border-radius: 40px;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  padding: 40px 60px;
}

.login-box.v-register {
  max-width: 700px;
}

.login-field-b {
  margin-bottom: 30px;
  position: relative;
}

.login-field-b.v-bottom-0 {
  margin-bottom: 0;
}

.login-field-icon-b {
  background-image: linear-gradient(to bottom, var(--orange), var(--hot-pink));
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
  width: 45px;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.login-field-icon {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: relative;
}

.login-field-icon.v-account {
  background-image: url('../images/login-icon-account.svg');
}

.login-field-icon.v-pw {
  background-image: url('../images/login-icon-pw.svg');
}

.login-footnote {
  text-align: center;
  margin-top: 30px;
}

.font-medium {
  font-weight: 500;
}

.account-bg-deco {
  width: 6.25%;
  margin: 100px 80px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.account-bg-deco.deco-2 {
  width: 5.5%;
  margin-bottom: 60px;
  inset: auto 0% 0% auto;
}

.btn-form-submit {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  text-align: center;
  border-radius: 20px;
  padding: 18px 20px;
  font-weight: 700;
  transition: background-color .5s, color .5s;
  display: block;
}

.btn-form-submit:hover {
  background-color: var(--slate-blue);
  color: var(--white);
}

.btn-form-submit.cancel {
  background-color: var(--black-2);
  color: var(--black);
}

.btn-form-submit.v-50 {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
}

.interest-select-title-b {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 10px;
  display: flex;
}

.checkbox-field {
  margin-bottom: 0;
  padding-left: 0;
}

.checkbox-field-content {
  cursor: pointer;
  justify-content: flex-start;
  align-items: flex-start;
  font-weight: 400;
  display: flex;
}

.checkbox-box {
  background-color: var(--white);
  border-radius: 8px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 25px;
  display: flex;
  box-shadow: 3px 3px #0000000d;
}

.checkbox-box.account-interest {
  margin-top: 5px;
  margin-right: 5px;
  position: absolute;
  inset: 0% 0% auto auto;
}

.checkbox-tick {
  opacity: 0;
  background-image: url('../images/form-checkbox-tick.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 100%;
  height: 100%;
  transition: all .5s;
  position: relative;
  transform: scale(0);
}

.checkbox-field-txt {
  margin-top: 3px;
  margin-left: 10px;
}

.account-interest-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: -20px;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.account-interest-item {
  width: 50%;
  margin-bottom: 20px;
  padding-left: 10px;
  padding-right: 10px;
}

.account-interest-innerbox {
  color: var(--white);
  border-radius: 11px;
  font-weight: 700;
  position: relative;
  overflow: hidden;
}

.account-interest-box {
  background-color: var(--white);
  cursor: pointer;
  border-radius: 10px;
  padding: 2px;
  transition: box-shadow .5s;
  position: relative;
  box-shadow: 2px 2px #0000001a;
}

.account-interest-box:hover {
  box-shadow: 4px 4px #0000001a;
}

.account-interest-img {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 100%;
  transition: all .5s;
  position: relative;
}

.account-interest-img.img-1 {
  background-image: url('../images/account-interest-12x.jpg');
}

.account-interest-img.img-2 {
  background-image: url('../images/account-interest-22x.jpg');
}

.account-interest-img.img-3 {
  background-image: url('../images/account-interest-32x.jpg');
}

.account-interest-img.img-4 {
  background-image: url('../images/account-interest-42x.jpg');
}

.account-interest-img.img-5 {
  background-image: url('../images/account-interest-52x.jpg');
}

.account-interest-img.img-6 {
  background-image: url('../images/account-interest-62x.jpg');
}

.account-interest-img.img-7 {
  background-image: url('../images/account-interest-72x.jpg');
}

.account-interest-img.img-8 {
  background-image: url('../images/account-interest-82x.jpg');
}

.account-interest-img.img-9 {
  background-image: url('../images/account-interest-92x.jpg');
}

.account-interest-img.img-10 {
  background-image: url('../images/account-interest-102x.jpg');
}

.account-interest-img.img-11 {
  background-image: url('../images/account-interest-112x.jpg');
}

.account-interest-img.img-12 {
  background-image: url('../images/account-interest-122x.jpg');
}

.account-interest-content {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 10px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.account-interest-txt {
  text-align: center;
  width: 100%;
}

.account-interest-mask-dark {
  background-color: #00000080;
  width: 100%;
  height: 100%;
  transition: opacity .5s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.account-interest-mask-gradient {
  background-image: linear-gradient(135deg, var(--deep-pink), var(--orange) 49%, var(--yellow));
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity .5s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.account-update-txt {
  color: var(--dark-slate-blue);
  text-align: center;
  margin-bottom: 20px;
}

.txt-align-center {
  text-align: center;
}

.account-menu-b {
  z-index: 100;
  justify-content: flex-end;
  align-items: center;
  margin-top: -7%;
  margin-bottom: 20px;
  display: flex;
  position: relative;
}

.account-menu-bar {
  background-color: var(--white-smoke);
  border-radius: 100px;
  justify-content: center;
  align-items: center;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
}

.account-menu-btn {
  color: var(--slate-blue);
  background-color: #2e309100;
  border-radius: 20px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 10px 40px;
  font-weight: 700;
  line-height: 110%;
  transition: background-color .5s, color .5s;
}

.account-menu-btn:hover {
  color: var(--dark-slate-blue);
  background-color: #2e309133;
}

.account-menu-btn.w--current {
  background-color: var(--dark-slate-blue);
  color: var(--white);
}

.account-menu-btn.time-change {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  transition: opacity .5s;
}

.account-menu-btn.time-change:hover {
  opacity: .6;
}

.history-table-part {
  padding-left: 20px;
  padding-right: 20px;
  font-size: 1.3vw;
  line-height: 120%;
}

.history-table-part.v-top {
  z-index: 110;
  background-image: linear-gradient(270deg, var(--hot-pink), var(--orange));
  border-radius: 40px;
  padding-top: 10px;
  padding-bottom: 10px;
  position: sticky;
}

.history-row-wrap {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: center;
  margin-left: -1%;
  margin-right: -1%;
  display: flex;
}

.history-col {
  padding-left: 1%;
  padding-right: 1%;
}

.history-col.col-date {
  width: 13%;
}

.history-col.col-time {
  width: 12%;
}

.history-col.col-code {
  width: 16%;
}

.history-col.col-title {
  color: var(--dark-slate-blue);
  flex: 1;
  width: 13%;
  font-weight: 700;
}

.history-col.col-status {
  width: 16%;
}

.history-col.col-arrow {
  flex: none;
}

.history-col.col-upload {
  width: 25%;
}

.history-row {
  background-color: var(--seashell);
  padding: 10px 20px;
}

.history-row.v-top {
  background-color: #0000;
  padding-top: 0;
  padding-bottom: 0;
}

.history-table-col-title {
  color: var(--white);
  justify-content: flex-start;
  align-items: center;
  font-size: 1.66vw;
  font-weight: 700;
  line-height: 120%;
  display: flex;
}

.history-table-icon {
  flex: none;
  width: 20px;
  margin-right: 5px;
}

.history-row-main {
  flex-flow: wrap;
  flex: 1;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.history-status-tag {
  background-color: var(--linen);
  color: var(--rosy-brown);
  text-align: center;
  border-radius: 40px;
  padding: 10px 20px;
  font-weight: 700;
  display: inline-block;
}

.history-status-tag.v-confirmed {
  background-color: var(--yellow);
  color: var(--white);
}

.history-status-tag.v-ended {
  background-color: var(--rosy-brown);
  color: var(--white);
}

.history-status-tag.v-canceled {
  background-color: var(--grey);
  color: var(--white);
}

.ec-expand {
  cursor: pointer;
  transition: all .5s;
  position: relative;
}

.ec-expand:hover {
  color: var(--slate-blue);
  transform: translate(0, -3px);
}

.history-ec-arrow {
  width: 30px;
}

.history-col-fieldname {
  color: var(--black);
  margin-bottom: 2px;
  font-weight: 700;
  display: none;
}

.ec-collapse {
  cursor: pointer;
  transition: all .5s;
  position: relative;
}

.ec-collapse:hover {
  color: var(--slate-blue);
  transform: translate(0, -3px);
}

.ec-content {
  overflow: hidden;
}

.history-expand-b {
  border-top: 1px solid var(--rosy-brown);
  margin-top: 10px;
  padding-top: 20px;
}

.history-expand-info-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.history-expand-info-item {
  margin-bottom: 20px;
  padding-left: 10px;
  padding-right: 10px;
}

.history-expand-info-item.col-level, .history-expand-info-item.col-contactperson, .history-expand-info-item.col-phone {
  width: 15%;
}

.history-expand-info-item.col-email {
  width: 30%;
}

.history-expand-info-item.col-button {
  text-align: right;
  width: 25%;
}

.history-expand-info-item.col-remark {
  width: 100%;
}

.history-info-item-title {
  margin-bottom: 5px;
  font-weight: 700;
}

.innerpage-sub-heading {
  color: var(--slate-blue);
  margin-bottom: 10px;
  font-weight: 700;
}

.acti-item-info-txt {
  color: var(--grey);
  flex: 1;
  margin-top: 5px;
  margin-bottom: 5px;
}

.act-listing-filter-b {
  z-index: 100;
  max-width: 1440px;
  margin: 20px auto 60px;
  padding-left: 90px;
  padding-right: 90px;
  position: relative;
}

.act-listing-search-b {
  max-width: 580px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.act-filter-list {
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-end;
  margin: 30px -15px -20px;
  display: flex;
  position: relative;
}

.act-filter-item {
  width: 50%;
  margin-bottom: 20px;
  padding-left: 15px;
  padding-right: 15px;
  position: relative;
}

.act-filter-item.v-daterange {
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
}

.act-filter-item-title {
  color: var(--dark-slate-blue);
  text-align: center;
  margin-bottom: 5px;
  font-weight: 700;
}

.act-daterange-item {
  width: 50%;
  position: relative;
}

.act-daterange-to {
  color: var(--dark-slate-blue);
  margin-left: 15px;
  margin-right: 15px;
  font-weight: 700;
}

.pop-activities-filter {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  display: none;
  position: relative;
}

.act-filter-button-b {
  z-index: 200;
  opacity: 0;
  text-align: center;
  display: none;
  position: fixed;
  inset: 100px 0% auto;
}

.btn-open-filter {
  background-image: url('../images/icon-filter.svg'), linear-gradient(to right, var(--hot-pink), var(--orange));
  color: var(--white);
  background-position: 10px, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: 30px, auto;
  border-radius: 20px;
  max-width: 200px;
  margin-left: auto;
  margin-right: auto;
  padding: 10px 20px 10px 40px;
  font-weight: 500;
  transition: box-shadow .5s, color .5s;
  display: block;
  box-shadow: 3px 3px #0000001a;
}

.btn-open-filter:hover {
  color: var(--white);
  box-shadow: 4px 4px #0003;
}

.activities-no-result {
  text-align: center;
  margin-top: -60px;
}

.detail-back-b {
  text-align: left;
}

.btn-back {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  text-align: left;
  border-radius: 20px;
  padding: 9px 20px;
  font-weight: 700;
  transition: background-color .5s, color .5s;
  display: inline-block;
}

.btn-back:hover {
  background-color: var(--slate-blue);
  color: var(--white);
}

.btn-back-arrow-b {
  flex: none;
  width: 18px;
  margin-left: 0;
  margin-right: 10px;
  position: relative;
}

.detail-heading-b {
  margin-bottom: 40px;
  padding-bottom: 40px;
  position: relative;
}

.detail-heading-line {
  background-image: linear-gradient(to right, var(--hot-pink), var(--orange));
  width: 100%;
  height: 2px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.activities-detail-top-info-b {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 10px;
  display: flex;
}

.activities-detail-top-code {
  color: var(--dark-slate-blue);
  font-weight: 700;
}

.activities-detail-top-info-line {
  background-color: var(--dark-slate-blue);
  width: 1px;
  height: 20px;
  margin-left: 20px;
  margin-right: 20px;
}

.activities-heading-txt {
  color: var(--dark-slate-blue);
}

.activities-detail-b {
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.act-detail-graphic-b {
  width: 100%;
  max-width: 360px;
  position: relative;
}

.act-detail-content-b {
  flex: 1;
  margin-left: 40px;
}

.act-detail-content-info-b {
  align-items: flex-start;
  margin-bottom: 40px;
  display: flex;
}

.act-detail-date-b {
  border: 6px solid var(--white-smoke);
  background-color: var(--orange);
  color: var(--white);
  text-align: center;
  border-radius: 60px;
  justify-content: flex-start;
  align-items: center;
  padding: 15px 26px;
  font-family: Outfit, sans-serif;
  font-weight: 500;
  display: flex;
  position: relative;
}

.act-detail-date-tip {
  background-image: url('../images/act-detail-date-tip.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 29px;
  height: 29px;
  margin-top: -2px;
  margin-left: -5px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.activities-detail-info-list {
  flex: 1;
  margin-left: 20px;
}

.activities-detail-arch-b {
  overflow: hidden;
}

.activities-detail-arch {
  background-image: url('../images/activities-detail-arch.svg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 8%;
  position: relative;
}

.act-enrol-b {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.act-enrol-tab-menu {
  background-color: var(--linen);
  border-radius: 40px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  max-width: 420px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.act-enrol-tab-link {
  color: var(--slate-blue);
  text-align: center;
  background-color: #2e309100;
  border-radius: 40px;
  flex: 1;
  margin: 10px;
  padding: 8px 20px;
  font-weight: 700;
  transition: background-color .5s, color .5s;
}

.act-enrol-tab-link:hover {
  background-color: #2e309133;
}

.act-enrol-tab-link.w--current {
  background-color: var(--dark-slate-blue);
  color: var(--white);
}

.act-enrol-tab-content {
  padding-top: 40px;
}

.enrol-login-b {
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
}

.field-time-gp {
  justify-content: center;
  align-items: center;
  display: flex;
}

.field-time-item {
  flex: 1;
}

.field-time-colon {
  text-align: center;
  margin-left: 10px;
  margin-right: 10px;
}

.textarea {
  background-color: var(--white);
  border: 1px #000;
  border-radius: 20px;
  width: 100%;
  height: 200px;
  min-height: 200px;
  margin-bottom: 0;
  padding: 12px 20px;
  font-size: 17px;
  line-height: 120%;
  position: relative;
  box-shadow: 3px 3px #0000000d;
}

.textarea:focus {
  border-style: none;
}

.textarea::placeholder {
  color: #0006;
}

.checkbox-gp {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: -10px;
  margin-left: -15px;
  margin-right: -15px;
  display: flex;
}

.checkbox-item {
  padding-left: 15px;
  padding-right: 15px;
}

.checkbox-item.v-enrol-level {
  width: 16.6667%;
  margin-bottom: 10px;
}

.contact-box {
  background-color: var(--seashell);
  border-radius: 40px;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  padding: 40px 60px 130px;
  position: relative;
}

.contact-email-link {
  background-color: var(--white);
  color: var(--black);
  border-radius: 40px;
  justify-content: flex-start;
  align-items: center;
  margin-top: -10px;
  transition: background-color .5s, color .5s;
  display: flex;
  position: relative;
  box-shadow: 3px 3px #0000000d;
}

.contact-email-link:hover {
  background-color: var(--dark-slate-blue);
  color: var(--white);
}

.contact-email-box {
  text-align: center;
  flex: 1;
  padding: 10px 45px 10px 20px;
  position: relative;
}

.contact-email-icon-b {
  background-image: url('../images/sticky-email.svg'), linear-gradient(to top, var(--hot-pink), var(--orange));
  background-position: 50%, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: 26px, auto;
  border-radius: 50%;
  flex: none;
  width: 45px;
  height: 45px;
  position: relative;
}

.contact-box-deco {
  width: 98px;
  position: absolute;
  inset: auto auto 0% 0%;
}

.contact-bg-deco {
  width: 6.25%;
  margin: 100px 80px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.contact-bg-deco.deco-2 {
  margin-bottom: 60px;
  inset: auto 0% 0% auto;
}

.industry-slider {
  background-color: #0000;
  height: auto;
  position: relative;
}

.industry-slider-mask {
  margin-left: -40px;
  margin-right: -40px;
}

.industry-slide {
  width: 33.3%;
  padding-left: 30px;
  padding-right: 30px;
}

.industry-link {
  color: var(--dark-slate-blue);
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
  display: block;
}

.industry-link-img-b {
  transition: all .5s;
}

.industry-link-title {
  margin-top: 20px;
}

.industry-link-btn-b {
  margin-top: 10px;
  display: inline-block;
  position: relative;
}

.industry-link-btn-arrow-b {
  width: 18px;
}

.industry-link-btn {
  border: 1px solid var(--dark-slate-blue);
  border-radius: 20px;
  padding: 8px 18px;
  position: relative;
}

.industry-link-btn.v-hover {
  border-color: var(--dark-slate-blue);
  background-color: var(--dark-slate-blue);
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity .5s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.home-banner-map {
  background-image: url('../images/home-map-bg-2.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex: none;
  width: 130vw;
  height: 130vw;
  position: relative;
  overflow: hidden;
}

.map-item {
  width: 10.28%;
  margin-top: 0%;
  margin-left: 0%;
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
}

.map-item.v-logistics {
  margin-top: -26.5%;
  margin-left: -31.5%;
}

.map-item.v-government {
  margin-top: -32%;
  margin-left: -8%;
}

.map-item.v-law {
  margin-top: -32%;
  margin-left: 20%;
}

.map-item.v-property {
  margin-top: -7%;
  margin-left: -27%;
}

.map-item.v-management {
  margin-top: -18.5%;
  margin-left: -6%;
}

.map-item.v-construct {
  margin-top: 12.5%;
  margin-left: -11.5%;
}

.map-item.v-med {
  margin-top: 18%;
  margin-left: 31%;
}

.map-item.v-design {
  width: 5.28%;
  margin-top: -3%;
  margin-left: 19.5%;
}

.map-item.v-it {
  width: 5.28%;
  margin-top: -8%;
  margin-left: 5%;
}

.map-item.v-education {
  width: 5.28%;
  margin-top: 16%;
  margin-left: -28.5%;
}

.map-item.v-retail {
  width: 18.1029%;
  margin-top: 26%;
  margin-left: 0%;
}

.map-item.v-travel {
  width: 18%;
  margin-top: -17.5%;
  margin-left: 21%;
}

.map-item.v-news {
  width: 20%;
  margin-top: 6%;
  margin-left: 8%;
}

.home-banner-wrap {
  justify-content: center;
  align-items: center;
  position: absolute;
  inset: 0% auto auto 0%;
}

.home-banner-map-mask {
  z-index: 1;
  opacity: 0;
  background-color: #0009;
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  inset: 0% auto auto 0%;
}

.home-banner-b {
  z-index: 100;
  height: 95vh;
  margin-top: 50px;
  padding: 0;
  position: relative;
  overflow: hidden;
}

.home-banner-b.v-mouse {
  margin-top: 0;
}

.home-banner-b.v-mouse.edit {
  overflow: auto;
}

.home-banner-b.v-touch {
  height: 90vh;
  display: none;
  overflow: auto;
}

.home-map-img-frame {
  border: 1px solid var(--sky-blue);
  border-radius: 10px;
  transition: all .8s;
  overflow: hidden;
}

.home-map-img-frame.v-orange {
  border-color: var(--orange);
}

.home-map-img-frame.v-pink {
  border-color: var(--hot-pink);
}

.home-map-img-frame.v-lime {
  border-color: var(--yellow);
}

.home-map-img-frame.v-circle {
  border-radius: 50%;
}

.home-map-img-frame.v-darkblue {
  border-color: var(--dark-slate-blue);
}

.home-map-img-frame.v-home-news {
  border-width: 1vw;
  border-color: var(--dark-slate-blue);
  position: relative;
}

.map-item-img-landscape {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 66.6%;
  transition: all .8s;
}

.map-item-img-landscape.logistics-1 {
  background-image: url('../images/home-map-logistic-1.png');
}

.map-item-img-landscape.logistics-2 {
  background-image: url('../images/home-map-logistic-2.png');
}

.map-item-img-landscape.government-1 {
  background-image: url('../images/home-map-government-5.png');
}

.map-item-img-landscape.law-1 {
  background-image: url('../images/home-map-law-3.png');
}

.map-item-img-landscape.law-2 {
  background-image: url('../images/home-map-law-1.png');
}

.map-item-img-landscape.property-1 {
  background-image: url('../images/home-map-properties-2.png');
}

.map-item-img-landscape.property-2 {
  background-image: url('../images/home-map-properties-1.png');
}

.map-item-img-landscape.management-2 {
  background-image: url('../images/home-map-management-4.png');
}

.map-item-img-landscape.management-1 {
  background-image: url('../images/home-map-management-3.png');
}

.map-item-img-landscape.construct-1 {
  background-image: url('../images/home-map-construct-2.png');
}

.map-item-img-landscape.med-2 {
  background-image: url('../images/home-map-med-3.png');
}

.map-item-img-landscape.med-1 {
  background-image: url('../images/home-map-med-1.png');
}

.map-img-item {
  position: relative;
  inset: 0% auto auto 0%;
}

.map-img-item.logistics-2 {
  width: 75%;
  margin-top: 1%;
  margin-left: 56%;
  position: absolute;
}

.map-img-item.government-2 {
  width: 54%;
  margin-top: 0%;
  margin-left: -14%;
  position: absolute;
}

.map-img-item.law-2, .map-img-item.property-2 {
  width: 75%;
  margin-top: 7%;
  margin-left: -27%;
  position: absolute;
}

.map-img-item.management-2 {
  width: 75%;
  margin-top: 1%;
  margin-left: 56%;
  position: absolute;
}

.map-img-item.construct-2 {
  width: 54%;
  margin-top: 0%;
  margin-left: -14%;
  position: absolute;
}

.map-img-item.med-2 {
  width: 75%;
  margin-top: 7%;
  margin-left: -27%;
  position: absolute;
}

.map-img-item.design-2 {
  width: 56%;
  margin-top: -20%;
  margin-left: -10%;
  position: absolute;
}

.map-img-item.it-2 {
  width: 56%;
  margin-top: -20%;
  margin-left: 70%;
  position: absolute;
}

.map-img-item.education-2 {
  width: 56%;
  margin-top: -20%;
  margin-left: -10%;
  position: absolute;
}

.map-img-item.news-deco {
  width: 30%;
  margin-top: 15%;
  position: absolute;
  inset: 0% 0% auto auto;
}

.map-item-deco-border {
  border: 1px dashed var(--sky-blue);
  border-radius: 15px;
  width: 100%;
  margin-top: -5%;
  margin-left: 5%;
  padding-top: 66.6%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.map-item-deco-border.v-government {
  margin-top: -7%;
  margin-left: 1%;
}

.map-item-deco-border.v-law {
  border-color: var(--hot-pink);
  margin-top: -7%;
  margin-left: -7%;
}

.map-item-deco-border.v-property {
  border-color: var(--yellow);
  margin-top: -7%;
  margin-left: -7%;
}

.map-item-deco-border.v-management {
  border-color: var(--dark-slate-blue);
}

.map-item-deco-border.v-construct {
  border-color: var(--yellow);
  margin-top: -7%;
  margin-left: 1%;
}

.map-item-deco-border.v-med {
  border-color: var(--sky-blue);
  margin-top: -7%;
  margin-left: -7%;
}

.map-item-deco-floor {
  position: absolute;
  inset: auto auto 0% 0%;
}

.map-item-deco-floor.v-logistics {
  width: 98%;
  margin-bottom: -41%;
  margin-left: 88%;
}

.map-item-deco-floor.v-government {
  width: 134%;
  margin-bottom: -25%;
  margin-left: -22%;
}

.map-item-deco-floor.v-law, .map-item-deco-floor.v-property {
  width: 85%;
  margin-bottom: -22%;
  margin-left: -36%;
}

.map-item-deco-floor.v-management {
  width: 98%;
  margin-bottom: -41%;
  margin-left: 16%;
}

.map-item-deco-floor.v-construct {
  width: 134%;
  margin-bottom: -25%;
  margin-left: -22%;
}

.map-item-deco-floor.v-med {
  width: 81.25%;
  margin-bottom: -25%;
  margin-left: -34%;
}

.map-item-deco-floor.v-design {
  width: 150%;
  margin-bottom: -37%;
  margin-left: -25%;
}

.map-item-deco-floor.v-it {
  width: 150%;
  margin-bottom: -45%;
  margin-left: -25%;
}

.map-item-deco-floor.v-education {
  width: 150%;
  margin-bottom: -37%;
  margin-left: -25%;
}

.map-item-deco-floor.v-retail {
  width: 43%;
  margin-bottom: -36.5%;
  margin-left: 66%;
}

.map-item-deco-floor.v-travel {
  width: 43%;
  margin-bottom: -2.5%;
  margin-left: -8%;
}

.map-txt-item {
  position: absolute;
  inset: auto auto 0% 0%;
}

.map-txt-item.v-logistics {
  width: 113.4%;
  margin-bottom: -82%;
  margin-left: 53%;
}

.map-txt-item.v-logistics.v-en {
  width: 110%;
  margin-bottom: -84%;
}

.map-txt-item.v-government {
  width: 93.6%;
  margin-bottom: -66%;
  margin-left: 83%;
}

.map-txt-item.v-government.v-en {
  width: 110%;
  margin-bottom: -77%;
  margin-left: 77%;
}

.map-txt-item.v-law {
  width: 132%;
  margin-bottom: -52%;
  margin-left: 46%;
}

.map-txt-item.v-property {
  width: 115%;
  margin-bottom: -55%;
  margin-left: 8%;
}

.map-txt-item.v-property.v-en {
  width: 110%;
}

.map-txt-item.v-management {
  width: 159.306%;
  margin-bottom: -102%;
  margin-left: -9%;
}

.map-txt-item.v-management.v-en {
  width: 150%;
  margin-bottom: -106%;
}

.map-txt-item.v-construct {
  width: 135%;
  margin-bottom: -55%;
  margin-left: 25%;
}

.map-txt-item.v-construct.v-en {
  margin-bottom: -65%;
  margin-left: 26%;
}

.map-txt-item.v-med {
  width: 113%;
  margin-bottom: -50%;
  margin-left: -120%;
}

.map-txt-item.v-design {
  width: 230%;
  margin-bottom: -175%;
  margin-left: 95%;
}

.map-txt-item.v-design.v-en {
  width: 250%;
  margin-bottom: -190%;
  margin-left: 80%;
}

.map-txt-item.v-it {
  width: 180%;
  margin-bottom: -140%;
  margin-left: -143%;
}

.map-txt-item.v-it.v-en {
  width: 230%;
  margin-bottom: -161%;
  margin-left: -208%;
}

.map-txt-item.v-education {
  width: 230%;
  margin-bottom: -130%;
  margin-left: -141%;
}

.map-txt-item.v-education.v-en {
  width: 250%;
  margin-bottom: -139%;
  margin-left: -155%;
}

.map-txt-item.v-retail {
  width: 77%;
  margin-bottom: -28%;
  margin-left: 40%;
}

.map-txt-item.v-travel {
  width: 92.8%;
  margin-bottom: -59%;
  margin-left: 38%;
}

.home-map-link {
  width: 100%;
  display: block;
  position: relative;
}

.map-item-img-square {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 100%;
  transition: all .8s;
}

.map-item-img-square.government-2 {
  background-image: url('../images/home-map-government-3.png');
}

.map-item-img-square.construct-2 {
  background-image: url('../images/home-map-construct-1.png');
}

.map-item-img-square.design-1 {
  background-image: url('../images/home-map-design-3.png');
}

.map-item-img-square.design-2 {
  background-image: url('../images/home-map-design-1.png');
}

.map-item-img-square.it-1 {
  background-image: url('../images/home-map-it-1.png');
}

.map-item-img-square.it-2 {
  background-image: url('../images/home-map-it-2.png');
}

.map-item-img-square.education-2 {
  background-image: url('../images/home-map-education-3.png');
}

.map-item-img-square.education-1 {
  background-image: url('../images/home-map-education-4.png');
}

.map-item-img-square.travel-1 {
  background-image: url('../images/home-map-travel-1.png');
}

.map-item-img-square.travel-2 {
  background-image: url('../images/home-map-travel-2.png');
}

.map-item-img-square.travel-3 {
  background-image: url('../images/home-map-travel-3.png');
}

.map-item-img-square.retail-1 {
  background-image: url('../images/home-map-retail-1.png');
}

.map-item-img-square.retail-2 {
  background-image: url('../images/home-map-retail-2.png');
}

.map-item-img-square.retail-3 {
  background-image: url('../images/home-map-retail-3.png');
}

.face-left {
  transform-style: preserve-3d;
  transform: rotateX(-35deg)rotateY(-45deg)rotateZ(0);
}

.face-right {
  transform-style: preserve-3d;
  transform: rotateX(-35deg)rotateY(45deg)rotateZ(0);
}

.map-item-square-gp {
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: -2%;
  margin-right: -2%;
  display: flex;
  position: relative;
}

.map-square-gp-item {
  width: 33.3%;
  padding-left: 2%;
  padding-right: 2%;
}

.btn-scroll-to-content {
  z-index: 100;
  border-style: solid solid none;
  border-width: 10px;
  border-color: var(--dark-orange);
  background-color: var(--orange);
  color: var(--white);
  text-align: center;
  text-shadow: 2px 2px #0003;
  border-top-left-radius: 1000px;
  border-top-right-radius: 1000px;
  align-items: flex-end;
  width: 180px;
  margin-bottom: .5%;
  padding: 15px 20px 25px;
  font-size: 17px;
  font-weight: 700;
  transition: background-color .5s, color .5s;
  display: none;
  position: absolute;
  inset: auto auto 0% 50%;
  transform: translate(-50%);
  box-shadow: 0 15px 0 10px #0006;
}

.btn-scroll-to-content:hover {
  background-color: var(--dark-slate-blue);
  color: var(--white);
}

.scroll-to-content-line {
  background-image: linear-gradient(to bottom, #fff0, var(--white));
  width: 2px;
  height: 20px;
  margin-top: 5px;
  margin-left: auto;
  margin-right: auto;
}

.home-map-instruct-b {
  z-index: 100;
  background-color: #00000080;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 90px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.home-map-instruct-b.edit {
  display: none;
}

.home-map-instruct-graphic {
  flex: none;
  width: 150px;
  margin-bottom: 90px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.home-map-instruct-content {
  color: var(--white);
  text-align: center;
  width: 100%;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.home-map-arrow-b {
  margin-top: -15px;
  margin-bottom: -15px;
  position: absolute;
  inset: 0% auto auto 50%;
  transform: translate(-50%, -100%);
}

.home-map-arrow-b.arrow-e {
  margin-left: -15px;
  margin-right: -15px;
  inset: 50% 0% auto auto;
  transform: translate(100%, -50%)rotate(90deg);
}

.home-map-arrow-b.arrow-w {
  margin-left: -15px;
  margin-right: -15px;
  inset: 50% auto auto 0%;
  transform: translate(-100%, -50%)rotate(-90deg);
}

.home-map-arrow-b.arrow-s {
  inset: auto auto 0% 50%;
  transform: translate(-50%, 100%)rotate(180deg);
}

.home-map-arrow-img {
  background-image: url('../images/home-map-instruction-arrow2x_1home-map-instruction-arrow@2x.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 30px;
  height: 30px;
}

.home-map-compass-b {
  z-index: 100;
  opacity: 0;
  width: 400px;
  margin-bottom: -1%;
  position: absolute;
  inset: auto auto 0% 50%;
  transform: translate(-50%, 50%);
}

.home-map-compass-img {
  width: 100%;
  display: block;
  position: relative;
}

.industry-slider-watermark {
  color: var(--white-smoke);
  text-align: center;
  margin-top: 8%;
  position: absolute;
  inset: 0% 0% auto;
  overflow: hidden;
}

.industry-bg-img-b {
  background-image: url('../images/industry-slider-bg2x.png');
  background-position: 50% 100%;
  background-repeat: repeat-x;
  background-size: contain;
  margin-bottom: 140px;
  padding-top: 25%;
  position: absolute;
  inset: auto 0% 0%;
}

.industry-latest-content {
  padding-bottom: 80px;
  padding-left: 60px;
  padding-right: 60px;
  position: relative;
}

.industry-latest-joblist {
  border-bottom: 1px solid var(--linen);
  flex-wrap: wrap;
  align-items: center;
  margin-left: -5px;
  margin-right: -5px;
  padding-bottom: 80px;
  display: flex;
}

.industry-latest-job-item {
  width: 33.3%;
  margin-bottom: 10px;
  padding-left: 5px;
  padding-right: 5px;
}

.industry-latest-job-link {
  background-color: var(--linen);
  color: var(--black);
  border-radius: 10px;
  justify-content: flex-start;
  align-items: center;
  padding: 10px 20px;
  font-weight: 700;
  transition: all .5s;
  display: flex;
  position: relative;
}

.industry-latest-job-link:hover {
  color: var(--dark-slate-blue);
  transform: translate(0, -5px);
}

.industry-latest-job-icon {
  flex: none;
  width: 30px;
  margin-right: 10px;
}

.industry-latest-job-txt {
  flex: 1;
}

.industry-latest-job-arrow {
  flex: none;
  width: 18px;
  margin-left: 10px;
}

.industry-latest-trend-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
  position: relative;
}

.industry-latest-trend-item {
  width: 20%;
  margin-bottom: 20px;
  padding-left: 10px;
  padding-right: 10px;
}

.industry-latest-trend-circle {
  background-image: linear-gradient(135deg, var(--orange), var(--yellow));
  color: var(--white);
  text-align: center;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 130px;
  height: 130px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.industry-latest-trend-circle.v-even {
  background-image: linear-gradient(135deg, var(--hot-pink), var(--orange));
}

.industry-latest-trend-content {
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
}

.industry-latest-trend-img {
  width: 40px;
  margin-bottom: 5px;
  margin-left: auto;
  margin-right: auto;
}

.industry-latest-trend-bg {
  width: 750px;
  position: absolute;
  bottom: auto;
  left: 50%;
  right: auto;
  transform: translate(-50%);
}

.industry-trend-source {
  color: var(--grey);
  text-align: center;
  margin-top: 40px;
  font-weight: 700;
  position: relative;
}

.industry-intro-b {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.industry-intro-l {
  flex: none;
  width: 30%;
  margin-right: 40px;
}

.industry-intro-r-b {
  flex: 1;
}

.industry-intro-heading-b {
  color: var(--dark-slate-blue);
  margin-bottom: 20px;
  padding-bottom: 20px;
  position: relative;
}

.job-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-left: 60px;
  margin-right: 60px;
  display: flex;
  position: relative;
}

.job-item {
  width: 25%;
  margin-bottom: 40px;
  padding-left: 10px;
  padding-right: 10px;
}

.job-link {
  color: var(--black);
  text-align: center;
  font-weight: 700;
  display: block;
}

.job-link:hover {
  color: var(--dark-slate-blue);
}

.job-item-img-b {
  position: relative;
  transform: rotate(-5deg);
}

.job-item-handle {
  background-image: url('../images/job-list-handle.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 36%;
  margin-bottom: 5px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 8%;
  position: relative;
}

.job-item-img-frame {
  background-color: var(--linen);
  border-radius: 40px;
  padding: 6px;
}

.job-item-img-mask {
  border-radius: 36px;
  overflow: hidden;
}

.job-link-txt {
  margin-top: 15px;
}

.exploration-bg-bottom {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-left: 5%;
  padding-right: 5%;
  display: flex;
  position: absolute;
  inset: auto auto 0% 0%;
}

.wheel-inner-title-b {
  color: var(--dark-slate-blue);
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 20px;
  display: flex;
  position: relative;
}

.wheel-inner-title-bubble {
  color: var(--white);
  text-align: center;
  background-image: url('../images/exploration-bubble2x.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 172px;
  height: 172px;
  margin-right: 10px;
  padding-bottom: 30px;
  font-size: 36px;
  font-weight: 700;
  line-height: 120%;
  display: flex;
}

.wheel-inner-title-bubble.v-pink {
  background-image: url('../images/activities-bubble2x.png');
}

.wheel-inner-title-heading {
  flex: 1;
}

.wheel-inner-title-bubble-txt {
  width: 100%;
}

.job-detail-b {
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.job-detail-intro-l-b {
  width: 100%;
  max-width: 400px;
  position: relative;
}

.job-detail-intro-r-b {
  flex: 1;
  margin-left: 40px;
}

.job-detail-heading-cat {
  color: var(--slate-blue);
  margin-bottom: 10px;
  font-weight: 700;
}

.job-detail-heading-wrap {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.job-detail-heading-txt {
  color: var(--dark-slate-blue);
  flex: 1;
  margin-right: 20px;
}

.job-intro-img-handle {
  background-image: url('../images/job-list-handle.svg');
  background-position: 50% 100%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 28%;
  margin-bottom: 5px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 6%;
  position: relative;
}

.job-detail-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: -40px;
  margin-left: -20px;
  margin-right: -20px;
  display: flex;
}

.job-detail-item {
  justify-content: flex-start;
  align-items: flex-start;
  width: 50%;
  margin-bottom: 40px;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.job-detail-item.v-100 {
  width: 100%;
}

.job-detail-intro-icon {
  flex: none;
  width: 60px;
  margin-right: 20px;
}

.job-detail-item-content {
  flex: 1;
}

.job-detail-item-title {
  color: var(--dark-slate-blue);
  margin-bottom: 10px;
  font-weight: 700;
}

.job-detail-point {
  background-image: url('../images/job-detail-bullet2x_1job-detail-bullet@2x.png');
  background-position: 0 8px;
  background-repeat: no-repeat;
  background-size: 5px;
  margin-bottom: 10px;
  padding-left: 15px;
}

.job-detail-arch {
  background-image: url('../images/job-detail-arch.svg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 8%;
  position: relative;
}

.job-share-slide {
  border-left: 1px solid var(--linen);
  width: 33.3%;
  padding-left: 30px;
  padding-right: 30px;
}

.job-share-slider {
  background-color: #0000;
  height: auto;
  position: relative;
}

.newsletter-link {
  color: var(--black);
  display: block;
  position: relative;
}

.newsletter-link:hover {
  color: var(--dark-slate-blue);
}

.newsletter-link.v-first {
  max-width: none;
}

.newsletter-item-img-b {
  position: relative;
}

.newsletter-item-label {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  margin-bottom: 10px;
  margin-left: 10px;
  padding: 10px 15px;
  font-weight: 700;
  position: absolute;
  inset: auto auto 0% 0%;
}

.newsletter-item-label.v-first {
  margin-top: 10px;
  inset: 0% auto auto 0%;
}

.newsletter-item-img-mask {
  position: relative;
  overflow: hidden;
}

.newsletter-item-img-bg {
  background-color: var(--linen);
  position: absolute;
  inset: 0%;
  transform: rotate(5deg);
}

.newsletter-item-txt-b {
  margin-top: 20px;
}

.newsletter-item-txt-b.v-first {
  color: var(--white);
  width: 100%;
  padding: 20px;
  position: absolute;
  inset: auto auto 0% 0%;
}

.newsletter-item-date {
  color: var(--grey);
  font-weight: 700;
}

.newsletter-item-date.v-first {
  color: var(--white);
}

.newsletter-item-title-b {
  border-top: 1px solid var(--linen);
  margin-top: 10px;
  padding-top: 10px;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.job-share-slider-mask {
  margin-left: -30px;
  margin-right: -30px;
}

.job-subscribe-watermark-b {
  color: var(--linen-2);
  text-align: center;
}

.job-subscribe-content-b {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.job-subscribe-question-b {
  z-index: 1;
  background-image: linear-gradient(to right, var(--hot-pink) 20%, var(--orange) 60%, var(--yellow));
  color: var(--white);
  text-shadow: 2px 2px 1px #00000040;
  border-radius: 40px;
  padding: 20px 40px;
  font-weight: 700;
  display: inline-block;
  position: relative;
}

.job-subscribe-question-tip {
  width: 30px;
  margin-bottom: -24px;
  margin-left: 40px;
  position: absolute;
  inset: auto auto 0% 0%;
}

.job-subscribe-answer-box {
  background-color: var(--linen-2);
  border-radius: 60px;
  margin-top: -30px;
  margin-bottom: 60px;
  padding: 60px;
  position: relative;
}

.job-subscribe-answer-tip {
  width: 127px;
  margin-bottom: -59px;
  margin-right: 20px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.subscribe-form-field {
  position: relative;
}

.btn-subscribe {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  text-align: left;
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding: 9px 20px;
  font-weight: 700;
  transition: background-color .5s, color .5s;
  display: flex;
  position: absolute;
  inset: 0% 0% auto auto;
}

.btn-subscribe:hover {
  background-color: var(--slate-blue);
  color: var(--white);
}

.subscribe-form-thankyou {
  color: var(--dark-slate-blue);
  text-align: center;
  font-weight: 700;
  display: none;
}

.subscribe-form-thankyou.v-white {
  color: var(--white);
}

.newsletter-top-b {
  margin-bottom: 80px;
  position: relative;
}

.newsletter-content-b {
  position: relative;
}

.newsletter-top-box {
  background-image: linear-gradient(to bottom, var(--orange), var(--hot-pink));
  border-radius: 60px;
  justify-content: flex-start;
  align-items: center;
  padding: 60px;
  display: flex;
  position: relative;
}

.newsletter-top-l {
  color: var(--white);
  mix-blend-mode: overlay;
  flex: none;
  width: 50%;
  margin-right: 40px;
  font-size: 24px;
  font-weight: 700;
  line-height: 150%;
}

.newsletter-top-r {
  flex: 1;
}

.newsletter-intro-highlight {
  font-size: 40px;
}

.newsletter-top-graphic {
  width: 150px;
  margin-top: -60px;
  position: absolute;
  inset: 0% 0% auto auto;
}

.newsletter-top-tip {
  width: 110px;
  margin-bottom: -50px;
  margin-right: 30px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.newsletter-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  margin-left: 100px;
  display: flex;
}

.news-letter-item {
  border-left: 1px solid var(--linen);
  width: 33.3%;
  margin-bottom: 60px;
  padding-left: 30px;
  padding-right: 30px;
}

.news-letter-item.v-first {
  border-left-style: none;
  width: 100%;
}

.newsletter-list-deco {
  width: 70px;
  margin-left: 60px;
  margin-right: 60px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.newsletter-list-deco.bottom-right {
  inset: auto 0% 0% auto;
}

.newsletter-heading-txt {
  color: var(--dark-slate-blue);
}

.newsletter-detail-label {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  margin-bottom: 10px;
  margin-left: 10px;
  padding: 10px 15px;
  font-weight: 700;
  display: inline-block;
}

.newsletter-detail-b {
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 20px;
  padding-right: 60px;
  display: flex;
  position: relative;
}

.news-letter-detail-l-b {
  flex: none;
  width: 300px;
  margin-right: 40px;
  position: sticky;
  top: 120px;
}

.news-detail-r-b {
  flex: 1;
}

.newsletter-detail-content-b {
  border-bottom: 1px solid var(--linen);
  margin-bottom: 80px;
  padding-bottom: 40px;
}

.newsletter-article-heading {
  color: var(--dark-slate-blue);
  margin-bottom: 40px;
}

.article-img {
  box-shadow: 7px 7px 0 0 var(--seashell);
  border-radius: 20px;
  width: 100%;
  max-width: 500px;
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: relative;
  overflow: hidden;
}

.news-letter-detail-back-b {
  text-align: center;
}

.newsletter-detail-menu-box {
  background-color: var(--seashell);
  padding: 20px;
  position: relative;
}

.newsletter-menu-box-title {
  background-image: linear-gradient(to right, var(--hot-pink), var(--orange) 50%, var(--yellow));
  color: var(--white);
  text-align: center;
  text-shadow: 2px 2px #00000040;
  border-radius: 40px;
  padding: 10px 20px;
  font-weight: 700;
  position: absolute;
  inset: 0% auto auto 50%;
  transform: translate(-50%, -50%);
}

.newsletter-detail-menu-link {
  border-bottom: 1px solid var(--linen);
  color: var(--rosy-brown);
  justify-content: flex-start;
  align-items: center;
  padding: 15px 10px;
  font-weight: 700;
  display: flex;
}

.newsletter-detail-menu-link:hover {
  color: var(--dark-slate-blue);
}

.newsletter-menu-item-circle {
  background-color: var(--linen);
  text-align: center;
  border-radius: 50%;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  margin-right: 10px;
  font-weight: 700;
  transition: color .5s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.newsletter-menu-item-circle-active {
  background-image: linear-gradient(to bottom, var(--hot-pink), var(--orange));
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity .5s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.newsletter-menu-box-bg {
  background-color: var(--linen);
  position: absolute;
  inset: 0%;
  transform: rotate(-5deg);
}

.aspiration-shortcut-b {
  justify-content: center;
  align-items: center;
  margin-bottom: 60px;
  display: flex;
}

.aspiration-shortcut-l {
  width: 50%;
}

.aspiration-shortcut-questionaire-link {
  background-color: var(--white);
  color: var(--white);
  border-radius: 40px;
  padding: 6px;
  display: block;
  position: relative;
  overflow: hidden;
  box-shadow: 2px 2px #0000001a;
}

.aspiration-shortcut-questionaire-link:hover {
  color: var(--white);
}

.aspiration-shortcut-questionaire-img {
  background-image: url('../images/aspiration-top-questionaire-bg2x.jpg');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.aspiration-shortcut-questionaire-content {
  background-image: linear-gradient(#0000, #0009 58%);
  padding: 47% 40px 40px;
  position: relative;
}

.aspiration-shortcut-questionaire-title {
  font-size: 36px;
  font-weight: 700;
  line-height: 120%;
}

.aspiration-shortcut-questionaire-line {
  background-image: linear-gradient(to right, var(--hot-pink), var(--orange));
  width: 100%;
  height: 2px;
  margin-top: 20px;
  margin-bottom: 20px;
}

.aspiration-shortcut-question-btn-b {
  margin-top: 20px;
}

.aspiration-shortcut-questionaire-wrap {
  border-radius: 37px;
  position: relative;
  overflow: hidden;
}

.aspiration-shortcut-r {
  flex: 1;
  order: 1;
  margin-left: 20px;
  position: relative;
}

.aspiration-shortcut-item {
  width: 25%;
  padding: 20px;
  position: relative;
}

.aspiration-shortcut-item-link {
  color: var(--dark-slate-blue);
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
  transition-property: all;
  display: block;
  position: relative;
}

.aspiration-shortcut-item-link:hover {
  transform: translate(0, -5px);
}

.aspiration-shortcut-icon {
  width: 100px;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
}

.aspiration-shortcut-line-top {
  background-color: var(--linen);
  height: 1px;
  margin-left: 20px;
  margin-right: 20px;
  position: absolute;
  inset: 0% 0% auto;
}

.aspiration-shortcut-line-right {
  background-color: var(--linen);
  width: 1px;
  margin-top: 40px;
  margin-bottom: 40px;
  position: absolute;
  inset: 0% 0% 0% auto;
}

.aspiration-shortcut-r-deco-1 {
  width: 50px;
  margin-top: -80px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.aspiration-shortcut-r-deco-2 {
  width: 80px;
  margin-bottom: -100px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.aspiration-shortcut-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
  position: relative;
}

.aspiration-main-b {
  margin-left: 60px;
}

.aspiration-main-content-b {
  border-radius: 40px 0 0 40px;
  margin-right: -40px;
  position: relative;
  overflow: hidden;
}

.aspiration-teacher-box {
  background-color: var(--snow);
  justify-content: flex-start;
  align-items: flex-start;
  padding-top: 60px;
  padding-bottom: 60px;
  padding-right: 40px;
  display: flex;
  position: relative;
}

.aspiration-teacher-box.v-tool {
  background-color: var(--seashell);
}

.aspiration-teacher-box.v-video {
  background-color: var(--linen-2);
}

.aspiration-teacher-l {
  color: var(--dark-slate-blue);
  flex: none;
  justify-content: flex-start;
  align-items: center;
  width: 300px;
  margin-right: 20px;
  display: flex;
}

.aspiration-teacher-heading-line {
  background-image: linear-gradient(to right, var(--hot-pink), var(--orange));
  flex: none;
  width: 80px;
  height: 2px;
  margin-right: 10px;
}

.aspiration-teacher-heading, .aspiration-teacher-r-b {
  flex: 1;
}

.aspiration-teacher-item-list {
  flex-wrap: wrap;
  align-items: center;
  margin-left: -5px;
  margin-right: -5px;
  display: flex;
}

.aspiration-teacher-item-link {
  background-color: var(--seashell);
  color: var(--black);
  border-radius: 10px;
  justify-content: flex-start;
  align-items: center;
  padding: 10px 20px;
  font-weight: 700;
  transition: all .5s;
  display: flex;
  position: relative;
}

.aspiration-teacher-item-link:hover {
  color: var(--dark-slate-blue);
  transform: translate(0, -5px);
}

.aspiration-teacher-item-link.v-tool {
  background-color: var(--linen);
}

.aspiration-teacher-item {
  width: 50%;
  margin-bottom: 10px;
  padding-left: 5px;
  padding-right: 5px;
}

.aspiration-teacher-item-icon {
  flex: none;
  width: 30px;
  margin-right: 10px;
}

.aspiration-teacher-item-txt {
  flex: 1;
}

.aspiration-teacher-item-arrow {
  flex: none;
  width: 18px;
  margin-left: 10px;
}

.aspiration-teacher-deco {
  width: 90px;
  position: absolute;
  inset: auto auto 0% 0%;
}

.aspiration-teacher-video-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: -40px;
  margin-left: -1vw;
  margin-right: -1vw;
  display: flex;
}

.aspiration-teacher-video-item {
  width: 50%;
  margin-bottom: 40px;
  padding-left: 1vw;
  padding-right: 1vw;
}

.aspiration-teacher-video-link {
  color: var(--black);
  font-weight: 700;
  transition-property: all;
  display: block;
  position: relative;
}

.aspiration-teacher-video-link:hover {
  color: var(--dark-slate-blue);
  transform: translate(0, -5px);
}

.aspiration-teacher-video-img-b {
  z-index: 1;
  background-color: var(--white);
  border-radius: 10px;
  padding: 2px;
  position: relative;
  box-shadow: 3px 3px #0000001a;
}

.aspiration-teacher-video-img-mask {
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}

.aspiration-teacher-vid-play-b {
  background-color: #0000004d;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
}

.aspiration-teacher-vid-icon {
  background-image: url('../images/aspiration-icon-video2x_1aspiration-icon-video@2x.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 60px;
  height: 60px;
  position: relative;
}

.aspiration-teacher-vid-title-b {
  text-align: center;
  padding: 10px;
  position: relative;
}

.aspiration-teacher-vid-bg {
  background-color: var(--white);
  border-radius: 10px;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.aspiration-student-intro-b {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.aspiration-student-intro-img-b {
  border-radius: 50%;
  width: 350px;
  margin-right: 40px;
  position: relative;
  overflow: hidden;
}

.aspiration-student-intro-mask {
  background-color: #0003;
  background-image: url('../images/aspiration-student-circle-deco2x.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 110%;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.aspiration-student-intro-txt-b {
  flex: 1;
  position: relative;
}

.aspiration-student-intro-heading-b {
  color: var(--dark-slate-blue);
  flex: none;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 40px;
  display: flex;
}

.aspiration-student-content-box {
  background-color: var(--seashell);
  padding: 40px;
}

.aspiration-student-intro-deco-1 {
  width: 50px;
  margin-top: -80px;
  margin-left: -40px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.aspiration-student-intro-deco-2 {
  width: 80px;
  margin-bottom: -100px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.aspiration-top-line {
  background-image: linear-gradient(to right, var(--hot-pink), var(--orange));
  height: 1px;
  margin-top: 10px;
}

.aspiration-questionaire-table-wrap {
  justify-content: flex-start;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.aspiration-col-question {
  justify-content: flex-start;
  align-items: center;
  width: 50%;
  display: flex;
}

.aspiration-col-answer {
  color: var(--dark-slate-blue);
  text-align: center;
  flex: 1;
  justify-content: space-between;
  align-items: center;
  font-weight: 700;
  display: flex;
}

.aspiration-table-row {
  background-color: var(--snow);
  padding-top: 20px;
  padding-bottom: 20px;
}

.aspiration-radio-item {
  width: 14.28%;
}

.aspiration-radio-field {
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}

.aspiration-radio-circle {
  background-color: var(--white);
  cursor: pointer;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  box-shadow: 2px 2px #0000001a;
}

.aspiration-radio-dot {
  background-image: linear-gradient(to bottom, var(--orange), var(--hot-pink));
  opacity: 0;
  border-radius: 50%;
  flex: none;
  width: 15px;
  height: 15px;
  transition: all .5s;
  transform: scale(0);
}

.aspiration-question-circle {
  background-image: linear-gradient(135deg, var(--orange) 35%, var(--hot-pink));
  border-radius: 50%;
  flex: none;
  width: 80px;
  height: 80px;
  margin-right: 20px;
  position: relative;
}

.aspiration-question-num-box {
  background-color: var(--orange);
  color: var(--white);
  text-align: center;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  margin-top: -10px;
  margin-left: -10px;
  font-size: 15px;
  font-weight: 700;
  line-height: 120%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.aspiration-question-txt {
  color: var(--dark-slate-blue);
  flex: 1;
  font-weight: 700;
}

.about-top-img-b {
  border-bottom-right-radius: 1500px;
  border-bottom-left-radius: 1500px;
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
}

.about-top-deco {
  width: 120px;
  margin-right: 40px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.about-feature-list {
  margin-top: 40px;
  position: relative;
}

.about-feature-item {
  align-items: stretch;
  margin-bottom: 40px;
  display: flex;
}

.about-feature-l-b {
  justify-content: flex-end;
  align-items: center;
  width: 50%;
  padding-top: 30px;
  padding-right: 30px;
  display: flex;
}

.about-feature-img-b {
  width: 80%;
  max-width: 320px;
  position: relative;
}

.about-feature-img-mask {
  overflow: hidden;
}

.about-feature-img-bg {
  background-color: var(--linen);
  width: 100%;
  height: 100%;
  margin-right: -20px;
  position: absolute;
  inset: 0% 0% auto auto;
  transform: rotate(5deg);
}

.about-feature-tag {
  border: 6px solid var(--white-smoke);
  background-color: var(--sky-blue);
  color: var(--white);
  border-radius: 60px;
  justify-content: flex-start;
  align-items: center;
  margin-top: -30px;
  margin-left: -10px;
  padding: 12px 50px 12px 25px;
  font-size: 20px;
  font-weight: 700;
  line-height: 100%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.about-feature-tag.v-pink {
  background-color: var(--hot-pink);
}

.about-feature-tag.v-orange {
  background-color: var(--orange);
}

.about-feature-tag-num-b {
  margin-top: -20px;
  margin-right: 5px;
  font-size: 60px;
  line-height: 100%;
  position: absolute;
  inset: 0% 0% auto auto;
  transform: rotate(8deg);
}

.about-feature-num-stroke {
  position: absolute;
  inset: 0% 0% auto auto;
}

.about-feature-r-b {
  color: var(--grey);
  flex-wrap: wrap;
  order: 1;
  align-items: center;
  width: 50%;
  display: flex;
}

.about-feature-line {
  background-color: var(--linen);
  width: 2px;
  margin-left: 40px;
  margin-right: 40px;
}

.about-feature-btn-b {
  text-align: left;
  margin-top: 40px;
}

.about-feature-tag-tip {
  flex: none;
  width: 60px;
  margin-bottom: -9px;
  margin-left: 0;
  position: absolute;
  inset: auto auto 0% 0%;
}

.about-feature-heading {
  color: var(--black);
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.about-feature-content {
  width: 100%;
}

.about-feature-deco {
  width: 96px;
  margin: 60px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.reflection-content-b {
  margin-left: 60px;
  margin-right: 60px;
  position: relative;
}

.reflection-survey-main-b {
  background-image: url('../images/share-survey-phone-middle2x.png'), url('../images/share-survey-phone-cont2x.png');
  background-position: 50% 0, 50% 0;
  background-repeat: no-repeat, repeat-y;
  background-size: 100%, 100%;
  padding-left: 6%;
  padding-right: 6%;
}

.reflection-survey-main-b.b-thankyou {
  padding-bottom: 80px;
  padding-left: 7%;
  padding-right: 7%;
}

.reflection-survey-slider {
  background-color: #0000;
  height: auto;
  margin-bottom: 40px;
}

.reflection-survey-slide {
  padding: 20px;
}

.reflection-survey-answer-box {
  background-color: var(--seashell);
  border-radius: 60px;
  margin-top: -30px;
  margin-left: 60px;
  padding: 50px 40px 40px;
  position: relative;
}

.reflection-survey-answer-box.v-textarea {
  border: 10px solid var(--seashell-3);
  background-color: var(--white);
}

.reflection-survey-question-b {
  z-index: 1;
  background-image: linear-gradient(to right, var(--hot-pink) 20%, var(--orange) 60%, var(--yellow));
  color: var(--white);
  text-shadow: 2px 2px 1px #00000040;
  border-radius: 40px;
  padding: 20px 40px;
  font-weight: 700;
  display: inline-block;
  position: relative;
  box-shadow: 0 6px #faeae1;
}

.reflection-survey-question-tip {
  width: 30px;
  margin-bottom: -24px;
  margin-left: 40px;
  position: absolute;
  inset: auto auto 0% 0%;
}

.reflection-survey-answer-tip {
  width: 127px;
  margin-bottom: -40px;
  margin-right: 170px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.reflection-survey-answer-tip.v-textarea {
  margin-bottom: -61px;
}

.reflection-survey-slider-btn-gp {
  justify-content: flex-end;
  align-items: center;
  margin-top: 20px;
  display: flex;
}

.reflection-survey-slider-btn-item {
  margin-left: 30px;
}

.reflection-survey-slider-arrow {
  background-image: linear-gradient(315deg, var(--hot-pink), var(--orange));
  border-radius: 50%;
  width: 60px;
  height: 60px;
  padding: 15px;
  display: block;
  position: relative;
  overflow: hidden;
}

.reflection-survey-slider-arrow.btn-prev {
  float: left;
}

.reflection-survey-slider-arrow.btn-next {
  float: right;
}

.reflection-survey-q-num-box {
  background-color: var(--hot-pink);
  color: var(--white);
  text-align: center;
  text-shadow: none;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  font-size: 15px;
  font-weight: 700;
  line-height: 120%;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
  box-shadow: 0 6px #faeae1;
}

.reflection-survey-q-num-txt {
  z-index: 10;
  position: relative;
}

.reflection-survey-text-area {
  background-color: var(--white);
  border: 1px #000;
  border-radius: 0;
  width: 100%;
  height: 100px;
  min-height: 100px;
  margin-bottom: 0;
  padding: 0;
  font-size: 17px;
  line-height: 120%;
  position: relative;
}

.reflection-survey-text-area:focus {
  border-style: none;
}

.reflection-survey-text-area::placeholder {
  color: #0006;
}

.checkbox-txtfield-b {
  margin-top: 10px;
  padding-left: 35px;
}

.btn-reflection-survey-submit {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  border-radius: 20px;
  justify-content: center;
  align-items: center;
  padding: 18px 20px;
  transition: background-color .5s, color .5s;
  display: flex;
}

.btn-reflection-survey-submit:hover {
  background-color: var(--slate-blue);
  color: var(--white);
}

.reflection-survey-thankyou-bubble {
  z-index: 1;
  background-image: linear-gradient(to right, var(--hot-pink) 20%, var(--orange) 60%, var(--yellow));
  color: var(--white);
  text-align: center;
  text-shadow: 2px 2px 1px #00000040;
  border-radius: 40px;
  padding: 20px 40px;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
  display: block;
  position: relative;
  box-shadow: 0 6px #faeae1;
}

.reflection-survey-thankyou-btn-gp {
  justify-content: space-between;
  align-items: center;
  margin-top: 40px;
  margin-left: -20px;
  margin-right: -20px;
  display: flex;
}

.reflection-survey-list-deco {
  width: 96px;
  margin: 60px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.reflection-survey-list-deco.bottom-right {
  margin-bottom: 20px;
  inset: auto 0% 0% auto;
}

.reflection-survey-thankyou-btn-item {
  padding-left: 20px;
  padding-right: 20px;
}

.btn-thankyou-vid-wrap {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.thankyou-vid-img {
  flex: none;
  width: 125px;
  margin-right: 15px;
}

.share-detail-content-b {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 60px;
  position: relative;
}

.share-detail-info-b {
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 60px;
  display: flex;
}

.share-img {
  box-shadow: 7px 7px 0 0 var(--seashell);
  border-radius: 20px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: relative;
  overflow: hidden;
}

.share-detail-deco {
  width: 96px;
  margin-bottom: 60px;
  margin-left: 60px;
  margin-right: 60px;
  position: absolute;
  inset: 0% auto auto 0%;
}

.share-detail-deco.bottom-right {
  margin-bottom: 0;
  inset: auto 0% 0% auto;
}

.share-detail-info-content-b {
  flex: 1;
  margin-left: 40px;
}

.share-detail-info-img-b {
  width: 40%;
  max-width: 413px;
  position: relative;
}

.share-item-img-mask {
  border-radius: 10px;
  margin: 2px;
  position: relative;
  overflow: hidden;
}

.share-item-img {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 66.8%;
}

.share-item-img.img-1 {
  background-image: url('../images/share-item-img-12x.png');
}

.share-item-img.img-2 {
  background-image: url('../images/share-item-img-22x.jpg');
}

.share-item-img.img-3 {
  background-image: url('../images/share-item-img-32x.jpg');
}

.share-item-img.img-6 {
  background-image: url('../images/share-item-img-62x.jpg');
}

.share-item-img.img-5 {
  background-image: url('../images/share-item-img-52x.jpg');
}

.share-item-img.img-4 {
  background-image: url('../images/share-item-img-42x.jpg');
}

.share-item-img-frame {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.share-detail-arch {
  background-image: url('../images/job-detail-arch.svg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 8%;
  position: relative;
}

.share-detail-arch-b {
  overflow: hidden;
}

.share-student-item {
  flex: none;
  width: 100%;
  position: relative;
  transform: scale(.8);
}

.share-student-item.slick-item {
  opacity: .5;
}

.share-student-item.slick-item.slick-current {
  opacity: 1;
  transform: scale(1);
}

.share-student-list {
  justify-content: center;
  align-items: flex-start;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: relative;
}

.share-student-list.slick-item-list {
  align-items: flex-start;
}

.share-student-main-b {
  min-height: 700px;
  padding-top: 140px;
  position: relative;
}

.share-student-qr-b {
  border: 1px solid var(--white);
  background-color: var(--dark-slate-blue);
  box-shadow: 7px 7px 0 0 var(--dark-slate-blue);
  color: var(--white);
  background-image: url('../images/icon-survey.svg');
  background-position: 10px;
  background-repeat: no-repeat;
  background-size: 40px;
  border-radius: 10px;
  margin-top: 60px;
  margin-left: 40px;
  margin-right: 40px;
  padding: 20px 20px 20px 55px;
  font-weight: 700;
  transition-property: all;
  display: block;
  position: absolute;
  inset: 0% 0% auto;
}

.share-student-qr-b:hover {
  box-shadow: 4px 4px 0 0 var(--dark-slate-blue);
  color: var(--white);
  background-color: #111263;
}

.student-main-phone-b {
  width: 370px;
  position: absolute;
  inset: 0% auto auto 50%;
  transform: translate(-50%);
}

.share-student-answer-box {
  border: 10px solid var(--seashell-3);
  background-color: var(--white);
  border-radius: 60px;
  margin-top: -30px;
  margin-left: 60px;
  padding: 50px 40px 40px;
  position: relative;
}

.share-student-answer-box.v-textarea {
  border: 10px solid var(--seashell-3);
  background-color: var(--white);
}

.share-student-question-box {
  z-index: 1;
  background-image: linear-gradient(to right, var(--hot-pink) 20%, var(--orange) 60%, var(--yellow));
  color: var(--white);
  text-shadow: 2px 2px 1px #00000040;
  border-radius: 40px;
  margin-right: 70px;
  padding: 20px 40px;
  font-weight: 700;
  display: inline-block;
  position: relative;
  box-shadow: 0 6px #faeae1;
}

.share-student-answer-tip {
  width: 127px;
  margin-bottom: -60.5px;
  margin-right: 170px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.share-student-answer-tip.v-textarea {
  margin-bottom: -61px;
}

.share-student-item-info-b {
  justify-content: flex-end;
  align-items: flex-start;
  margin-top: -30px;
  display: flex;
  position: relative;
}

.share-student-answer-icon {
  width: 114px;
  margin-top: -95px;
  margin-right: -60px;
  display: block;
  position: absolute;
  inset: 0% 0% auto auto;
}

.student-share-tag-b {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.student-share-tag-profile-b {
  z-index: 1;
  flex: none;
  width: 60px;
  position: relative;
}

.share-student-profile-name-box {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
  justify-content: flex-start;
  align-items: center;
  min-width: 190px;
  margin-left: -10px;
  padding: 10px 20px;
  font-weight: 700;
  display: flex;
  position: relative;
}

.share-student-item-dots {
  flex: none;
  width: 20px;
  margin-left: 10px;
}

.share-student-date-b {
  color: var(--dark-slate-blue);
  justify-content: flex-end;
  align-items: center;
  padding-right: 20px;
  font-size: 15px;
  display: flex;
}

.share-student-date-icon {
  flex: none;
  width: 18px;
  margin-right: 5px;
}

.share-student-slider-arrow-gp {
  justify-content: flex-start;
  align-items: center;
  margin-top: 80px;
  margin-left: 260px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 50%;
  transform: translate(-50%);
}

.share-student-slider-arrow-item {
  padding-left: 5px;
  padding-right: 5px;
}

.share-student-slider-arrow-line {
  background-color: var(--linen);
  flex: 1;
  height: 1px;
  margin-left: 40px;
  margin-right: 40px;
}

.student-share-deco-1 {
  width: 50px;
  margin-top: 40px;
  margin-left: 10%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.student-share-deco-2 {
  width: 90px;
  margin-top: -40px;
  margin-right: 10%;
  position: absolute;
  inset: 0% 0% auto auto;
}

.share-item-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 40px;
  margin-left: -20px;
  margin-right: -20px;
  display: flex;
}

.share-item {
  width: 33.3%;
  margin-bottom: 40px;
  padding-left: 20px;
  padding-right: 20px;
}

.share-item-link {
  color: var(--black);
  padding-top: 35px;
  display: block;
}

.share-item-link:hover {
  color: var(--dark-slate-blue);
}

.share-item-img-b {
  position: relative;
}

.share-item-date-b {
  border: 6px solid var(--white-smoke);
  background-color: var(--orange);
  color: var(--white);
  text-align: center;
  border-radius: 60px;
  justify-content: flex-start;
  align-items: center;
  margin-top: -40px;
  padding: 15px 25px;
  font-family: Outfit, sans-serif;
  font-weight: 500;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.share-item-content {
  padding-top: 10px;
}

.share-item-des {
  color: var(--grey);
  max-height: 59.5px;
  margin-top: 20px;
  overflow: hidden;
}

.share-item-btn-b {
  margin-top: 20px;
}

.share-item-date-tip {
  background-image: url('../images/share-listing-date-tip.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 29px;
  height: 29px;
  margin-bottom: -2px;
  margin-left: -5px;
  position: absolute;
  inset: auto auto 0% 0%;
}

.share-listing-map-move {
  overflow: hidden;
}

.share-map-content {
  position: relative;
}

.share-listing-map-bottom {
  width: 100%;
  position: absolute;
  inset: auto auto 0% 0%;
  overflow: hidden;
}

.share-listing-map-bottom-img {
  background-image: url('../images/share-map-plane2x.png');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
  margin-bottom: -2px;
  margin-left: -2px;
  margin-right: -2px;
  padding-top: 23%;
}

.share-map-item {
  width: 10.4%;
  max-width: 150px;
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
}

.share-map-item.item-1 {
  margin-top: -69%;
  margin-left: -37%;
}

.share-map-item.item-2 {
  margin-top: -64%;
  margin-left: 13%;
}

.share-map-item.item-3 {
  margin-top: -42%;
  margin-left: 32%;
}

.share-map-item.item-4 {
  margin-top: -30%;
  margin-left: 0%;
}

.share-map-item.item-5 {
  margin-top: -3%;
  margin-left: -29%;
}

.share-map-item.item-6 {
  margin-top: 5%;
  margin-left: 24%;
}

.share-map-item.item-7 {
  margin-top: 28%;
  margin-left: -6%;
}

.share-map-item.item-8 {
  margin-top: 49%;
  margin-left: -40%;
}

.share-map-item.item-9 {
  margin-top: 56%;
  margin-left: 25%;
}

.share-map-item.item-10 {
  margin-top: 86%;
  margin-left: 14%;
}

.share-map-item-interact {
  cursor: pointer;
  display: block;
}

.share-map-locator {
  background-image: linear-gradient(to bottom, var(--hot-pink), var(--orange) 50%, var(--yellow));
  border-radius: 50%;
  padding: 7%;
  position: relative;
}

.share-map-locator-img {
  background-color: var(--white);
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 50%;
  padding-top: 100%;
  position: relative;
}

.share-map-locator-img.img-1 {
  background-image: url('../images/share-map-item-12x.jpg');
}

.share-map-locator-img.img-2 {
  background-image: url('../images/share-map-item-22x.jpg');
}

.share-map-locator-img.img-3 {
  background-image: url('../images/share-map-item-32x.jpg');
}

.share-map-locator-img.img-4 {
  background-image: url('../images/share-map-item-42x.jpg');
}

.share-map-locator-img.img-5 {
  background-image: url('../images/share-map-item-62x.jpg');
}

.share-map-locator-img.img-6 {
  background-image: url('../images/share-map-item-52x.jpg');
}

.share-map-locator-img.img-7 {
  background-image: url('../images/share-item-img-42x.jpg');
}

.share-map-locator-img.img-8 {
  background-image: url('../images/share-item-img-52x.jpg');
}

.share-map-locator-img.img-9 {
  background-image: url('../images/share-item-img-62x.jpg');
}

.share-map-locator-img.img-10 {
  background-image: url('../images/share-item-img-32x.jpg');
}

.share-map-locator-tip {
  background-image: url('../images/share-map-item-tip.svg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: contain;
  width: 24.6%;
  margin-top: -4px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 15%;
}

.share-map-item-speech-b {
  margin-top: -25px;
  margin-right: -15px;
  position: absolute;
  inset: 0% 0% auto auto;
}

.share-map-speech-default-b {
  background-color: var(--dark-slate-blue);
  border-radius: 20px;
  padding: 20px;
  position: relative;
}

.share-map-speech-dot {
  width: 25px;
}

.share-map-speech-tip {
  background-image: url('../images/share-map-item-speech-tip.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 14px;
  height: 13px;
  margin-bottom: -12px;
  position: absolute;
  inset: auto auto 0% 50%;
  transform: translate(-50%);
}

.share-map-speech-hover-b {
  background-color: var(--dark-slate-blue);
  opacity: 0;
  color: var(--white);
  border-radius: 20px;
  width: 290px;
  min-width: 290px;
  padding: 20px;
  transition: background-color .5s, color .5s;
  display: none;
  position: absolute;
  inset: auto auto 0% 0%;
}

.share-map-speech-hover-b:hover {
  background-color: var(--slate-blue);
  color: var(--white);
}

.share-map-speech-hover-b.edit {
  opacity: 1;
  display: block;
}

.share-map-speech-title {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 700;
  line-height: 120%;
}

.share-map-speech-des {
  max-height: 178.5px;
  overflow: hidden;
}

.share-map-speech-btn-b {
  margin-top: 10px;
  font-weight: 700;
  display: inline-block;
}

.share-listing-map-b {
  height: 90vh;
  min-height: 900px;
  overflow: hidden;
}

.share-map-cloud {
  width: 50%;
  margin-left: -15%;
  margin-right: -15%;
  position: absolute;
  inset: 0% auto auto 0%;
}

.share-map-cloud.v-right {
  margin-top: 62%;
  inset: 0% 0% auto auto;
}

.home-banner-scroll-content {
  width: 100%;
}

.home-scroll-questionmark {
  text-shadow: 4px 4px #0003;
  font-size: 40px;
  font-weight: 900;
  line-height: 100%;
}

.news-date-dots {
  background-image: url('../images/news-dots.svg');
  background-position: 100%;
  background-repeat: repeat-x;
  background-size: contain;
  flex: 1;
  height: 6px;
  margin-left: 15px;
  position: relative;
}

.news-detail-content-b {
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}

.news-detail-back-b {
  text-align: center;
  margin-top: 40px;
}

.reflection-btn-txt {
  flex: 0 auto;
}

.map-news-img {
  background-image: url('../images/news-banner.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  padding-top: 56.25%;
  transition: all .8s;
  position: relative;
}

.news-banner-b {
  margin-bottom: 40px;
  overflow: hidden;
}

.life-wheel-hover-txt-b {
  opacity: 0;
  color: var(--white);
  text-align: center;
  text-shadow: 4px 4px 10px #00000080;
  background-image: linear-gradient(#0000, #0006);
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  height: 50%;
  padding: 2% 22% 15%;
  font-weight: 700;
  transition: opacity .5s;
  display: flex;
  position: absolute;
  inset: auto auto 0% 0%;
}

.life-wheel-close {
  margin: -10%;
  position: absolute;
  inset: 0%;
}

.wheel-btn-b {
  text-align: center;
  margin-top: 20px;
}

.map-news-blink {
  background-color: #2e309133;
  border-radius: 10px;
  margin: -2%;
  position: absolute;
  inset: 0%;
}

.home-map-news-frame {
  border: 10px solid var(--dark-slate-blue);
  border-radius: 10px;
  transition: all .8s;
  position: relative;
  overflow: hidden;
}

.home-map-news-frame.v-orange {
  border-color: var(--orange);
}

.home-map-news-frame.v-pink {
  border-color: var(--hot-pink);
}

.home-map-news-frame.v-lime {
  border-color: var(--yellow);
}

.home-map-news-frame.v-circle {
  border-radius: 50%;
}

.home-map-news-frame.v-darkblue {
  border-color: var(--dark-slate-blue);
}

.home-map-news-frame.v-home-news {
  border-width: 1vw;
  border-color: var(--dark-slate-blue);
  position: relative;
}

.reflection-rating-gp {
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.reflection-rating-item {
  width: 10%;
}

.reflection-radio-field {
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
}

.reflection-radio-circle {
  background-color: var(--white);
  cursor: pointer;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  box-shadow: 2px 2px #0000001a;
}

.reflection-radio-dot {
  background-image: linear-gradient(to bottom, var(--orange), var(--hot-pink));
  opacity: 0;
  border-radius: 50%;
  flex: none;
  width: 10px;
  height: 10px;
  transition: all .5s;
  transform: scale(0);
}

.refelction-rating-label-gp {
  color: var(--dark-slate-blue);
  justify-content: space-between;
  align-items: center;
  margin-top: 15px;
  font-weight: 700;
  display: flex;
}

.reflection-rating-label-r {
  text-align: right;
}

.reflection-rating-label-line {
  background-color: var(--linen);
  flex: 1;
  height: 1px;
  margin-left: 20px;
  margin-right: 20px;
}

.reflection-radio-label {
  text-align: center;
  margin-top: 4px;
  font-weight: 500;
}

.detail-reflect-button {
  border: 1px solid var(--white);
  background-color: var(--dark-slate-blue);
  box-shadow: 7px 7px 0 0 var(--dark-slate-blue);
  color: var(--white);
  background-image: url('../images/icon-survey.svg');
  background-position: 15px;
  background-repeat: no-repeat;
  background-size: 40px;
  border-radius: 10px;
  padding: 20px 20px 20px 70px;
  font-weight: 700;
  transition-property: all;
  display: inline-block;
  position: relative;
}

.detail-reflect-button:hover {
  box-shadow: 4px 4px 0 0 var(--dark-slate-blue);
  color: var(--white);
  background-color: #111263;
}

.detail-reflect-btn-b {
  text-align: center;
  margin-top: 40px;
}

.pop-video-youtube {
  display: none;
  position: relative;
}

.btn-vid-close {
  background-color: var(--hot-pink);
  background-image: url('../images/pop-close.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
  width: 30px;
  height: 30px;
  margin-right: -30px;
  transition: background-color .5s, color .5s;
  position: absolute;
  inset: 0% 0% auto auto;
}

.btn-vid-close:hover {
  background-color: var(--orange);
}

.pop-video-html5 {
  display: none;
  position: relative;
}

.home-banner-scroll-icon-b {
  width: 30px;
  margin-bottom: 0;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.forgot-password-txt {
  text-align: right;
  margin-top: 10px;
}

.home-map-instruct-content-2 {
  color: #fff;
  text-align: center;
  width: 100%;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.home-map-move-icon-b {
  width: 120px;
}

.home-map-move-txt {
  color: var(--white);
  text-align: center;
  letter-spacing: 2px;
  margin-top: 20px;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.cursor-area {
  z-index: 1000;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: 0% auto auto 0%;
}

.play-cursor {
  opacity: 0;
  flex: none;
  justify-content: center;
  align-items: center;
  position: relative;
}

.play-cursot-content {
  background-color: var(--dark-slate-blue);
  color: #fff;
  text-align: center;
  letter-spacing: 2px;
  text-transform: uppercase;
  background-image: url('../images/home-map-item-hover.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 60px;
  display: flex;
}

.btn-apply-sticky {
  z-index: 1000;
  background-color: var(--dark-slate-blue);
  color: var(--white);
  text-align: center;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  padding: 30px 15px;
  font-weight: 700;
  transition: background-color .5s, color .5s;
  position: fixed;
  inset: 50% 0% auto auto;
  transform: translate(0, -50%);
}

.btn-apply-sticky:hover {
  background-color: var(--orange);
  color: var(--white);
}

.share-video-b {
  margin-top: 60px;
}

.search-result-gp {
  margin-top: 40px;
}

.search-result-gp-title-b {
  border-bottom: 2px solid var(--dark-slate-blue);
  color: var(--dark-slate-blue);
  justify-content: flex-start;
  align-items: flex-end;
  margin-bottom: 15px;
  padding-bottom: 10px;
  display: flex;
}

.search-result-gp-title-txt {
  flex: 1;
  font-size: 20px;
  font-weight: 700;
  line-height: 120%;
}

.search-result-link {
  background-color: var(--seashell);
  border-radius: 20px;
  margin-bottom: 15px;
  padding: 20px 15px;
  transition: background-color .5s, color .5s;
  display: block;
}

.search-result-link:hover {
  background-color: var(--linen);
  color: var(--dark-slate-blue);
}

.search-link-title-b {
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.search-link-title-txt {
  font-weight: 700;
}

.search-link-des {
  color: var(--black);
  max-height: 40.8px;
  margin-top: 10px;
  overflow: hidden;
}

.search-result-search-b {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.search-link-arrow-box {
  border: 1px solid var(--dark-slate-blue);
  border-radius: 20px;
  margin-left: 10px;
  padding: 6px 12px;
  position: relative;
}

.search-link-arrow-box.v-hover {
  border-color: var(--white);
  opacity: 0;
  width: 100%;
  height: 100%;
  transition: opacity .5s;
  position: absolute;
  inset: 0% auto auto 0%;
}

.life-wheel-content-row {
  padding-top: 5px;
  padding-bottom: 5px;
}

.career-aptitiude-advice-gp {
  padding-top: 20px;
  padding-bottom: 20px;
  position: relative;
}

.career-aptitiude-advice-gp-title-b {
  color: var(--dark-slate-blue);
  letter-spacing: 2px;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 30px;
  padding-bottom: 10px;
  font-size: 30px;
  font-weight: 700;
  line-height: 120%;
  display: flex;
  position: relative;
}

.career-aptitude-advice-job-list {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
  position: relative;
}

.career-aptitiude-advice-gp-title-txt {
  flex: 1;
}

.career-aptitiude-advice-gp-title-graphic {
  flex: none;
  width: 60px;
  margin-right: 15px;
}

.career-aptitiude-advice-gp-title-line {
  background-image: linear-gradient(to right, var(--hot-pink), var(--orange));
  height: 2px;
  position: absolute;
  inset: auto 0% 0%;
}

.career-aptitiude-advice-shortcut-b {
  z-index: 200;
  background-color: var(--seashell-3);
  border-radius: 20px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  margin-bottom: 30px;
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
  display: flex;
  position: sticky;
  top: 90px;
}

.career-aptitiude-advice-shortcut-item {
  margin-bottom: 5px;
  padding-left: 5px;
  padding-right: 5px;
}

.career-aptitiude-advice-shortcut-link {
  background-color: var(--linen);
  color: var(--rosy-brown);
  letter-spacing: 1px;
  border-radius: 20px;
  padding: 5px 20px;
  font-weight: 700;
  transition: border-color .5s, background-color .5s, color .5s;
}

.career-aptitiude-advice-shortcut-link:hover {
  color: var(--rosy-brown);
  background-color: #e6cfc3;
}

.career-aptitiude-advice-shortcut-link.w--current {
  background-color: var(--dark-slate-blue);
  color: var(--white);
}

.career-aptitude-advice-anchor {
  cursor: none;
  position: absolute;
  inset: 0%;
}

.act-recommend-list {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: stretch;
  margin: 60px -20px -30px;
  display: flex;
}

.act-recommend-item {
  width: 33.3%;
  margin-bottom: 30px;
  padding-left: 20px;
  padding-right: 20px;
}

.act-recommend-link {
  color: var(--black);
  justify-content: flex-start;
  align-items: flex-start;
  display: block;
  position: relative;
}

.act-recommend-link:hover {
  color: var(--slate-blue);
}

.act-recommend-b {
  border-style: solid none;
  border-width: 1px;
  border-color: var(--linen);
  margin-top: 40px;
  padding-top: 30px;
  padding-bottom: 30px;
}

.act-recommend-sec-title {
  color: var(--dark-slate-blue);
  text-align: center;
  margin-bottom: 30px;
  font-weight: 700;
}

.act-recommend-img-b {
  background-color: var(--seashell);
  box-shadow: -6px -6px 0 0 var(--orange);
  border-radius: 20px;
  flex: none;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
}

.act-recommend-item-info {
  flex: 1;
  margin-top: 10px;
}

.act-recommend-item-title {
  margin-bottom: 10px;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.activities-recommend-item-type-b {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  border-radius: 8px;
  margin-bottom: 10px;
  padding: 5px 15px;
  font-weight: 700;
  display: inline-block;
}

.activities-recommend-item-type-b.v-detail {
  margin-bottom: 0;
}

.activities-grid-list {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-top: 60px;
  margin-left: -2%;
  margin-right: -2%;
  display: flex;
  position: relative;
}

.activities-grid-list-item {
  width: 33.3%;
  margin-bottom: 60px;
  padding-left: 2%;
  padding-right: 2%;
}

.activities-grid-list-link {
  color: var(--black);
  align-items: stretch;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.activities-gridlist-item-top-b {
  justify-content: flex-end;
  align-items: flex-start;
  width: auto;
  display: block;
  position: relative;
}

.activities-gridlist-item-graphic-b {
  width: 200px;
  max-width: 70%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.activities-gridlist-item-content-b {
  width: auto;
  margin-top: 20px;
}

.activities-gridlist-item-type-b {
  background-color: var(--dark-slate-blue);
  color: var(--white);
  border-radius: 8px;
  margin-bottom: 10px;
  padding: 5px 15px;
  font-size: 14px;
  font-weight: 700;
  line-height: 120%;
  display: inline-block;
}

.activities-gridlist-item-type-b.v-detail {
  margin-bottom: 0;
}

.activities-gridlist-item-title {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 700;
  line-height: 120%;
}

.activities-gridlist-item-info-gp {
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 8px;
  display: flex;
}

.activities-gridlist-item-btn-b {
  margin-top: 20px;
}

.activities-gridlist-item-date-b {
  border: 3px solid var(--white-smoke);
  background-color: var(--orange);
  color: var(--white);
  text-align: center;
  border-radius: 30px;
  justify-content: flex-start;
  align-items: center;
  margin-top: -40px;
  margin-right: -25px;
  padding: 15px;
  font-family: Outfit, sans-serif;
  font-weight: 500;
  display: flex;
  position: absolute;
  inset: 0% 0% auto auto;
}

.activities-gridlist-item-date-tip {
  background-image: url('../images/act-listing-date-tip.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 20px;
  height: 20px;
  margin-bottom: -2px;
  margin-right: -2px;
  position: absolute;
  inset: auto 0% 0% auto;
}

.act-gridlist-item-month {
  text-transform: uppercase;
  margin-bottom: 2px;
  line-height: 100%;
}

.act-gridlist-item-year {
  font-size: 14px;
  line-height: 100%;
}

.activities-gridlist-item-info-icon-b {
  flex: none;
  width: 25px;
  margin-right: 10px;
}

.acti-gridlist-item-info-txt {
  color: var(--grey);
  flex: 1;
  margin-top: 3px;
  margin-bottom: 3px;
}

.activities-gridlist-tag-list {
  flex-wrap: wrap;
  flex: 1;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: -5px;
  margin-left: -2px;
  margin-right: -2px;
  font-size: 14px;
  line-height: 120%;
  display: flex;
}

.activities-gridlist-tag-item {
  margin-bottom: 5px;
  padding-left: 2px;
  padding-right: 2px;
}

.act-gridlist-tag {
  background-color: var(--yellow);
  color: var(--white);
  border-radius: 8px;
  padding: 2px 10px;
  font-weight: 500;
}

.act-gridlist-tag.v-teacher {
  background-color: var(--sky-blue);
}

.act-gridlist-tag.v-parent {
  background-color: var(--hot-pink);
}

.act-gridlist-tag.v-subject {
  border: 1px solid var(--grey);
  color: var(--grey);
  background-color: #0000;
  font-weight: 400;
}

.abbout-intest-list-box {
  background-color: var(--seashell-3);
  border-radius: 20px;
  padding: 20px;
}

.history-row-remark-b {
  order: 1;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: 10px;
  display: flex;
}

.history-row-remark-b.v-mobile {
  display: none;
}

.history-download-form-link {
  font-weight: 700;
  text-decoration: underline;
}

.icon-upload {
  background-image: url('../images/icon-upload.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 30px;
  height: 30px;
}

.btn-upload {
  background-color: var(--dark-slate-blue);
  background-image: url('../images/icon-upload-white.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  transition-property: background-color;
  display: block;
}

.btn-upload:hover {
  background-color: var(--slate-blue);
}

.txt-grey {
  color: var(--rosy-brown);
}

.history-row-remark-btn-b {
  width: 25%;
  padding-left: 1%;
  padding-right: 1%;
}

.history-row-remark-txt {
  flex: 1;
  padding-left: 1%;
  padding-right: 1%;
}

.history-reupload-form-b {
  justify-content: flex-start;
  align-items: center;
  display: block;
}

.history-uploaded-status {
  color: var(--dark-slate-blue);
  margin-bottom: 3px;
}

.container-2 {
  max-width: 1280px;
  padding-left: 40px;
  padding-right: 40px;
}

.container-2.v-sticky {
  padding-left: 100px;
}

.sticky-btn-gp-wrap {
  justify-content: flex-start;
  align-items: stretch;
  margin-bottom: -20px;
  display: flex;
}

.sticky-btn-gp-2 {
  z-index: 1000;
  margin-top: -14%;
  margin-bottom: 10%;
  padding-top: 0;
  display: none;
  position: sticky;
  bottom: 0;
}

.sticky-btn-2 {
  color: #fff;
  text-align: center;
  background-color: #a06;
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50% 3px;
  background-repeat: no-repeat;
  background-size: 40px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  width: 70px;
  margin-right: 10px;
  padding: 40px 5px 25px;
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  transition: all .5s;
  transform: translate(0);
  box-shadow: 0 -2px 8px #a65e7e33;
}

.sticky-btn-2:hover {
  color: #fff;
  transform: translate(0, -5px);
}

.sticky-btn-2.st-top {
  background-color: var(--sky-blue);
  background-image: url('../images/qlementine-icons_go-top-16-1.svg');
  background-position: 50% 10%;
  padding-top: 45px;
}

.sticky-btn-2.st-whatsapp {
  background-color: var(--hot-pink);
  background-image: url('../images/white-sticky-whatsapp.svg');
}

.sticky-btn-2.st-contact {
  background-color: var(--yellow);
  background-image: url('../images/ic_baseline-email.svg');
}

.sticky-btn-2.st-doctor {
  background-color: var(--dark-slate-blue);
  background-image: url('../images/material-symbols-light_search-rounded.svg');
}

.sticky-btn-2.st-book {
  background-color: var(--orange);
  background-image: url('../images/clarity_date-line.svg');
}

.footer-m-b {
  text-align: right;
  flex: 1;
}

.footer-email {
  text-align: center;
}

.state-row {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  display: flex;
}

.cancel-btn {
  background-color: var(--hot-pink);
  color: var(--white);
  text-align: center;
  border-radius: 40px;
  padding: 10px 20px;
  font-weight: 700;
  transition: opacity .5s;
  display: inline-block;
}

.cancel-btn:hover {
  opacity: .6;
  color: var(--white);
}

.cancel-btn.v-confirmed {
  background-color: var(--yellow);
  color: var(--white);
}

.cancel-btn.v-ended {
  background-color: var(--rosy-brown);
  color: var(--white);
}

.cancel-btn.v-canceled {
  background-color: var(--grey);
  color: var(--white);
}

.change-time-btn {
  background-color: var(--orange);
  color: var(--white);
  text-align: center;
  border-radius: 40px;
  padding: 10px 20px;
  font-weight: 700;
  transition: opacity .5s;
  display: inline-block;
}

.change-time-btn:hover {
  opacity: .6;
  color: var(--white);
}

.change-time-btn.v-confirmed {
  background-color: var(--yellow);
  color: var(--white);
}

.change-time-btn.v-ended {
  background-color: var(--rosy-brown);
  color: var(--white);
}

.change-time-btn.v-canceled {
  background-color: var(--grey);
  color: var(--white);
}

.time-change-row {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
}

.pop-modify-date {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  display: none;
}

html.w-mod-js [data-ix="common-fade-from-bottom"] {
  opacity: 0;
  transform: translate(0, 50px);
}

html.w-mod-js [data-ix="common-fade-in"] {
  opacity: 0;
}

html.w-mod-js [data-ix="common-fade-from-outter"] {
  opacity: 0;
  transform: scale(1.1);
}

html.w-mod-js [data-ix="section-heading-animation"] {
  opacity: 0;
}

html.w-mod-js [data-ix="init-watermark-from-right"] {
  opacity: 0;
  transform: translate(200px);
}

html.w-mod-js [data-ix="init-watermark-from-left"] {
  opacity: 0;
  transform: translate(-200px);
}

html.w-mod-js [data-ix="btn-more-wheel-interaction"] {
  opacity: 0;
}

html.w-mod-js [data-ix="share-map-movement"] {
  transform: translate(0, -50%);
}

@media screen and (min-width: 1280px) {
  h1 {
    font-size: 60px;
  }

  h2 {
    font-size: 40px;
  }

  .footer-shortcut-title {
    font-size: 30px;
    line-height: 120%;
  }

  .header-bg {
    border-bottom-right-radius: 60px;
    border-bottom-left-radius: 60px;
  }

  .brand {
    width: 120px;
  }

  .nav-menu-icon-item {
    margin-left: 30px;
  }

  .nav-item {
    margin-right: 30px;
  }

  .home-news-date-b {
    margin-bottom: 30px;
  }

  .home-news-date-txt, .home-news-title {
    font-size: 30px;
  }

  .home-news-des, .home-news-btn-b {
    margin-top: 15px;
  }

  .home-shortcut-item {
    font-size: 30px;
  }

  .home-shortcut-btn-b {
    margin-top: 15px;
  }

  .activities-item-title {
    font-size: 30px;
  }

  .act-item-month {
    font-size: 24px;
  }

  .act-item-year {
    font-size: 16px;
  }

  .life-planning-watermark-b {
    font-size: 150px;
  }

  .login-box {
    max-width: 700px;
  }

  .login-box.v-register {
    max-width: 800px;
  }

  .act-filter-item {
    width: 25%;
  }

  .act-filter-item.v-daterange {
    width: 50%;
  }

  .contact-box {
    max-width: 700px;
  }

  .industry-link-btn-b {
    margin-top: 15px;
  }

  .industry-latest-trend-circle {
    width: 150px;
    height: 150px;
  }

  .job-item {
    padding-left: 15px;
    padding-right: 15px;
  }

  .newsletter-item-title-b {
    font-size: 30px;
  }

  .newsletter-top-graphic {
    width: 180px;
    margin-top: -80px;
  }

  .news-letter-item {
    padding-left: 40px;
    padding-right: 40px;
  }

  .news-letter-detail-l-b {
    margin-right: 60px;
  }

  .aspiration-shortcut-questionaire-title {
    font-size: 40px;
  }

  .aspiration-teacher-video-list {
    margin-left: -20px;
    margin-right: -20px;
  }

  .aspiration-teacher-video-item {
    padding-left: 20px;
    padding-right: 20px;
  }

  .about-feature-heading, .reflection-survey-thankyou-bubble {
    font-size: 30px;
  }

  .share-student-list {
    width: 60%;
  }

  .search-result-gp-title-txt {
    font-size: 24px;
  }

  .activities-grid-list-item {
    width: 25%;
  }
}

@media screen and (min-width: 1440px) {
  .container {
    padding-left: 60px;
    padding-right: 60px;
  }

  .container.v-login, .container.v-act-detail-enroll {
    padding-left: 150px;
    padding-right: 150px;
  }

  .header {
    font-size: 17px;
  }

  .nav-account-b {
    margin-left: 50px;
  }

  .header-login-box {
    padding: 10px 20px;
  }

  .header-account-wrap {
    background-size: 20px;
    padding-left: 30px;
  }

  .content-b.innerpage-first {
    padding-top: 120px;
  }

  .gome-sec-arrow-deco-cont-1, .gome-sec-arrow-deco-cont-1-end {
    display: block;
  }

  .home-news-date-dots {
    margin-left: 30px;
  }

  .section-watermark-txt {
    font-size: 150px;
  }

  .section-bg.inner-first {
    margin-top: 40px;
  }

  .home-shortcut-edge, .gome-sec-arrow-deco-cont-2-end, .gome-sec-arrow-deco-cont-2 {
    display: block;
  }

  .inner-banner-b {
    margin-bottom: -45px;
  }

  .inner-banner-deco-b {
    margin-bottom: -125px;
  }

  .inner-banner-deco-main {
    flex: none;
  }

  .inner-banner-deco-end, .inner-banner-deco-cont {
    display: block;
  }

  .account-bg-deco {
    margin-left: 120px;
  }

  .account-menu-b {
    margin-top: -80px;
    position: relative;
  }

  .history-table-part {
    padding-left: 20px;
    padding-right: 20px;
    font-size: 17px;
  }

  .history-row-wrap {
    margin-left: -5px;
    margin-right: -5px;
  }

  .history-col {
    padding-left: 5px;
    padding-right: 5px;
  }

  .history-row {
    padding-left: 20px;
    padding-right: 20px;
  }

  .history-table-col-title {
    font-size: 24px;
  }

  .history-table-icon {
    width: 30px;
  }

  .act-detail-content-b {
    margin-left: 60px;
  }

  .contact-bg-deco {
    margin-left: 120px;
  }

  .contact-bg-deco.deco-2 {
    margin-bottom: 80px;
  }

  .industry-slider-mask {
    margin-left: -60px;
    margin-right: -60px;
  }

  .industry-link {
    font-size: 30px;
  }

  .btn-scroll-to-content {
    padding-bottom: 35px;
  }

  .home-map-instruct-graphic {
    width: 180px;
  }

  .home-map-instruct-content {
    font-size: 30px;
  }

  .industry-latest-content {
    padding-left: 100px;
    padding-right: 100px;
  }

  .industry-latest-trend-content {
    padding-left: 20px;
    padding-right: 20px;
  }

  .industry-latest-trend-img {
    width: 60px;
  }

  .industry-intro-l {
    margin-right: 60px;
  }

  .job-list {
    margin-left: 100px;
    margin-right: 100px;
  }

  .wheel-inner-title-bubble {
    font-size: 40px;
  }

  .job-detail-intro-r-b {
    margin-left: 60px;
  }

  .newsletter-top-graphic {
    width: 210px;
    margin-top: -105px;
  }

  .newsletter-list {
    margin-left: 180px;
  }

  .newsletter-detail-b {
    padding-right: 100px;
  }

  .aspiration-shortcut-item-link {
    font-size: 30px;
  }

  .aspiration-main-b {
    margin-left: 100px;
  }

  .aspiration-main-content-b {
    margin-right: -60px;
  }

  .aspiration-teacher-box {
    padding-right: 60px;
  }

  .aspiration-teacher-l, .aspiration-student-intro-heading-b {
    width: 400px;
  }

  .aspiration-student-content-box {
    padding: 60px;
  }

  .aspiration-radio-circle {
    width: 40px;
    height: 40px;
  }

  .aspiration-radio-dot {
    width: 20px;
    height: 20px;
  }

  .aspiration-question-circle {
    width: 90px;
    height: 90px;
  }

  .about-top-deco {
    width: 140px;
    margin-right: 60px;
  }

  .about-feature-tag {
    font-size: 24px;
  }

  .about-feature-tag-num-b {
    font-size: 60px;
  }

  .reflection-content-b {
    margin-left: 100px;
    margin-right: 100px;
  }

  .reflection-survey-answer-box {
    margin-left: 80px;
  }

  .thankyou-vid-img {
    margin-right: 20px;
  }

  .share-detail-info-content-b {
    margin-left: 60px;
  }

  .share-student-list {
    width: 55%;
  }

  .share-student-answer-box {
    margin-left: 80px;
  }

  .share-student-slider-arrow-line {
    margin-left: 60px;
    margin-right: 60px;
  }

  .news-date-dots {
    margin-left: 30px;
  }

  .reflection-radio-circle {
    width: 25px;
    height: 25px;
  }

  .reflection-radio-dot {
    width: 12px;
    height: 12px;
  }

  .home-map-instruct-content-2 {
    font-size: 30px;
  }

  .history-row-remark-btn-b, .history-row-remark-txt {
    padding-left: 5px;
    padding-right: 5px;
  }

  .sticky-btn-gp-2 {
    margin-bottom: 9%;
  }
}

@media screen and (min-width: 1920px) {
  .inner-banner-b {
    margin-bottom: -45px;
  }

  .inner-banner-deco-b {
    margin-bottom: -130px;
  }

  .aspiration-main-content-b {
    border-top-right-radius: 40px;
    border-bottom-right-radius: 40px;
  }

  .share-listing-map-b {
    min-height: 1000px;
  }

  .sticky-btn-gp-2 {
    margin-top: -5%;
    margin-bottom: 7%;
    bottom: auto;
  }
}

@media screen and (max-width: 991px) {
  h1 {
    font-size: 48px;
  }

  .footer-shortcut-b {
    box-shadow: 0 -6px 0 0 var(--seashell);
    border-top-left-radius: 60px;
    border-top-right-radius: 60px;
    margin-top: -60px;
  }

  .container {
    max-width: 1440px;
    padding-left: 5vw;
    padding-right: 5vw;
  }

  .container.v-login, .container.v-act-detail-enroll, .container.inner-contact, .container.v-industry {
    padding-left: 80px;
    padding-right: 80px;
  }

  .footer-shortcut-link {
    padding: 15px 10px;
  }

  .footer-shortcut-title {
    margin-bottom: 10px;
  }

  .btn-common {
    padding-left: 15px;
    padding-right: 15px;
  }

  .footer-shortcut-line {
    height: 120px;
  }

  .footer-b {
    font-size: 15px;
  }

  .footer-wrap {
    display: block;
  }

  .footer-l-b {
    flex-wrap: wrap;
    justify-content: center;
  }

  .footer-logo-b {
    width: 130px;
    margin-left: 10px;
    margin-right: 10px;
  }

  .footer-logo-b.v-gov {
    width: 180px;
  }

  .footer-link-list {
    justify-content: center;
    width: 100%;
    margin-top: 20px;
  }

  .footer-link-item {
    margin-left: 20px;
    margin-right: 20px;
  }

  .footer-r-b {
    text-align: center;
    margin-top: 20px;
  }

  .header {
    font-size: 16px;
  }

  .header-bg {
    z-index: 10;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;
  }

  .brand {
    z-index: 100;
  }

  .header-wrap {
    justify-content: space-between;
    height: 80px;
  }

  .nav-menu {
    background-color: var(--slate-blue);
    flex: 0 auto;
    width: 100%;
    height: 100%;
    padding-top: 80px;
    padding-left: 5vw;
    padding-right: 5vw;
    display: block;
    position: fixed;
    inset: 0% auto auto 0%;
    overflow: auto;
  }

  .btn-menu {
    z-index: 100;
    padding: 0;
  }

  .btn-menu.w--open {
    background-color: #0000;
  }

  .nav-menu-main {
    margin-top: 20px;
    display: block;
  }

  .nav-menu-icons {
    border-left-style: none;
    justify-content: center;
    margin-top: 30px;
    margin-bottom: 120px;
  }

  .nav-menu-icon-item {
    margin-left: 20px;
    margin-right: 20px;
  }

  .nav-item {
    border-bottom: 1px solid var(--white);
    margin-right: 0;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .nav-link {
    height: auto;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .nav-link-dropdown {
    display: block;
  }

  .nav-submenu.w--open {
    background-color: #2e309180;
    border-radius: 10px;
    font-size: 15px;
    position: relative;
    left: 0%;
    transform: none;
  }

  .nav-submenu-tip {
    display: none;
  }

  .nav-sublink-line {
    background-color: var(--dark-slate-blue);
    margin-left: 30px;
    margin-right: 30px;
  }

  .nav-account-b {
    margin-top: 30px;
    margin-left: 0;
  }

  .btn-menu-wrap {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .btn-menu-line-1 {
    background-color: var(--white);
    border-radius: 20px;
    width: 30px;
    height: 2px;
    padding: 0;
  }

  .btn-menu-line-2 {
    background-color: var(--white);
    border-radius: 20px;
    width: 30px;
    height: 2px;
    margin-top: 10px;
    padding: 0;
  }

  .popup-title {
    font-size: 24px;
  }

  .section-div.home-register, .section-div.inner-life-planning-journey, .section-div.innerpage-last {
    padding-bottom: 60px;
  }

  .content-b {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .content-b.home-news {
    padding-bottom: 40px;
  }

  .content-b.home-register {
    padding: 80px;
  }

  .section-heading-line {
    height: 60px;
  }

  .home-news-slide {
    width: 50%;
    padding-left: 1.5%;
    padding-right: 1.5%;
  }

  .home-news-mask {
    margin-left: -1.5%;
    margin-right: -1.5%;
  }

  .home-shortcut-b {
    border-top-left-radius: 45px;
    border-top-right-radius: 45px;
    padding: 15px;
  }

  .home-shortcut-wrap {
    border-radius: 40px;
  }

  .home-shortcut-content-b {
    height: 150px;
  }

  .home-shortcut-btn-b {
    margin-top: 10px;
  }

  .section-watermark-txt {
    font-size: 80px;
  }

  .activities-item-r-b {
    padding-bottom: 40px;
  }

  .activities-line {
    margin-left: 20px;
    margin-right: 20px;
  }

  .act-item-graphic-b {
    max-width: 300px;
    margin-left: 45px;
  }

  .act-item-date-b {
    border-width: 4px;
    border-radius: 30px;
    padding: 10px 20px;
  }

  .ac-list-deco {
    width: 70px;
    margin-left: 25px;
    margin-right: 25px;
  }

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

  .sticky-btn-gp {
    padding-left: 8px;
    padding-right: 8px;
  }

  .sticky-btn {
    width: 25px;
  }

  .home-regiester-bg-img {
    width: 90%;
    max-width: 700px;
  }

  .home-register-content {
    max-width: 600px;
    padding-left: 40px;
    padding-right: 40px;
  }

  .home-regiester-intro {
    margin-bottom: 20px;
  }

  .home-register-deco {
    padding-left: 0;
    padding-right: 0;
  }

  .home-register-deco.v-act-detail {
    padding-bottom: 100px;
  }

  .home-register-deco-row-2.v-enrol {
    width: 95%;
  }

  .wheel-num {
    font-size: 20px;
  }

  .wheel-theme {
    font-size: 24px;
  }

  .wheel-theme.v-en {
    font-size: 22px;
  }

  .life-planning-deco-b.deco-1 {
    margin-left: 5%;
  }

  .life-planning-deco-b.deco-2 {
    margin-right: 6%;
  }

  .life-planning-deco-b.deco-3 {
    margin-left: 5%;
  }

  .life-planning-deco-b.deco-4 {
    margin-right: 0%;
  }

  .inner-banner-b {
    padding-top: 80px;
  }

  .login-box {
    padding-left: 40px;
    padding-right: 40px;
  }

  .account-bg-deco {
    margin: 50px 30px;
  }

  .account-bg-deco.deco-2 {
    margin-bottom: 40px;
  }

  .history-table-part {
    padding-left: 0;
    padding-right: 0;
    font-size: 1.7vw;
  }

  .history-table-part.v-top {
    border-radius: 10px 10px 0 0;
  }

  .history-col.col-date {
    width: 15%;
  }

  .history-col.col-status {
    width: 18%;
  }

  .history-row {
    padding-left: 15px;
    padding-right: 15px;
  }

  .history-table-col-title {
    font-size: 1.7vw;
  }

  .history-expand-info-item.col-level, .history-expand-info-item.col-contactperson, .history-expand-info-item.col-phone {
    width: 20%;
  }

  .history-expand-info-item.col-email {
    width: 40%;
  }

  .history-expand-info-item.col-button {
    order: 1;
    width: 40%;
  }

  .history-expand-info-item.col-remark {
    width: 60%;
  }

  .act-filter-button-b {
    top: 90px;
  }

  .btn-back {
    padding-left: 15px;
    padding-right: 15px;
  }

  .act-detail-graphic-b {
    max-width: 250px;
  }

  .act-detail-content-info-b {
    margin-bottom: 20px;
  }

  .act-detail-date-b {
    border-width: 4px;
    border-radius: 30px;
    padding: 10px 20px;
  }

  .contact-box {
    padding-left: 40px;
    padding-right: 40px;
  }

  .contact-bg-deco {
    margin: 50px 30px;
  }

  .contact-bg-deco.deco-2 {
    margin-bottom: 40px;
  }

  .industry-slider-mask {
    margin-left: -5vw;
    margin-right: -5vw;
  }

  .industry-slide {
    padding-left: 2%;
    padding-right: 2%;
  }

  .home-map-instruct-b {
    padding-left: 5vw;
    padding-right: 5vw;
  }

  .industry-latest-content {
    padding-bottom: 60px;
    padding-left: 0;
    padding-right: 0;
  }

  .industry-latest-joblist {
    padding-bottom: 60px;
  }

  .industry-latest-job-item {
    width: 50%;
  }

  .industry-latest-job-link {
    padding: 7px 10px;
  }

  .industry-latest-trend-item {
    width: 25%;
  }

  .industry-latest-trend-bg {
    width: 600px;
  }

  .industry-intro-l {
    width: 35%;
    margin-right: 5vw;
  }

  .job-list {
    margin-left: 0;
    margin-right: 0;
  }

  .job-item {
    width: 33.3%;
  }

  .job-item-img-frame {
    border-radius: 30px;
  }

  .job-item-img-mask {
    border-radius: 26px;
  }

  .wheel-inner-title-bubble {
    width: 150px;
    height: 150px;
    padding-bottom: 25px;
    font-size: 30px;
  }

  .job-detail-intro-l-b {
    max-width: 250px;
  }

  .job-detail-list {
    margin-bottom: -20px;
  }

  .job-detail-item {
    width: 100%;
    margin-bottom: 20px;
  }

  .job-detail-intro-icon {
    margin-right: 10px;
  }

  .job-detail-point {
    margin-bottom: 5px;
  }

  .job-share-slide {
    padding-left: 2%;
    padding-right: 2%;
  }

  .btn-subscribe {
    padding-left: 15px;
    padding-right: 15px;
  }

  .newsletter-top-l {
    font-size: 17px;
  }

  .newsletter-intro-highlight {
    font-size: 30px;
  }

  .newsletter-list {
    margin-left: 60px;
  }

  .news-letter-item {
    padding-left: 20px;
    padding-right: 20px;
  }

  .newsletter-list-deco {
    width: 50px;
    margin-left: 25px;
    margin-right: 25px;
  }

  .newsletter-detail-b {
    margin-top: 0;
    padding-right: 40px;
  }

  .news-letter-detail-l-b {
    width: 250px;
    margin-right: 5vw;
  }

  .newsletter-detail-content-b {
    margin-bottom: 40px;
  }

  .newsletter-detail-menu-link {
    padding-left: 0;
    padding-right: 0;
  }

  .aspiration-shortcut-b {
    display: block;
  }

  .aspiration-shortcut-l {
    width: 100%;
  }

  .aspiration-shortcut-questionaire-content {
    padding: 40% 20px 20px;
  }

  .aspiration-shortcut-questionaire-title {
    font-size: 30px;
  }

  .aspiration-shortcut-r {
    margin-left: 0;
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .aspiration-shortcut-icon {
    width: 80px;
  }

  .aspiration-shortcut-line-right {
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .aspiration-shortcut-r-deco-1 {
    width: 40px;
    margin-top: 0;
  }

  .aspiration-shortcut-r-deco-2 {
    width: 60px;
    margin-bottom: 0;
  }

  .aspiration-main-b {
    margin-left: 40px;
    display: block;
  }

  .aspiration-main-content-b {
    margin-right: -5vw;
  }

  .aspiration-teacher-box {
    padding: 40px 5vw;
    display: block;
  }

  .aspiration-teacher-l {
    width: auto;
    margin-bottom: 20px;
    margin-left: -5vw;
    margin-right: 0;
  }

  .aspiration-teacher-heading-line {
    width: 40px;
  }

  .aspiration-teacher-item-link {
    padding: 7px 10px;
  }

  .aspiration-teacher-item {
    width: 50%;
  }

  .aspiration-teacher-deco {
    width: 70px;
  }

  .aspiration-teacher-video-list {
    margin-bottom: -20px;
    margin-left: -2vw;
    margin-right: -2vw;
  }

  .aspiration-teacher-video-item {
    margin-bottom: 20px;
    padding-left: 2vw;
    padding-right: 2vw;
  }

  .aspiration-student-intro-img-b {
    width: 300px;
    margin-right: 5vw;
  }

  .aspiration-student-intro-txt-b {
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .aspiration-student-intro-heading-b {
    width: auto;
    margin-bottom: 20px;
    margin-right: 0;
  }

  .aspiration-student-content-box {
    padding-left: 5vw;
    padding-right: 5vw;
  }

  .aspiration-student-intro-deco-1 {
    width: 40px;
    margin-top: 0;
  }

  .aspiration-student-intro-deco-2 {
    width: 60px;
    margin-bottom: 0;
  }

  .aspiration-questionaire-table-wrap {
    padding-left: 10px;
    padding-right: 10px;
  }

  .aspiration-col-question {
    width: 45%;
  }

  .aspiration-radio-circle {
    width: 25px;
    height: 25px;
  }

  .aspiration-radio-dot {
    width: 12px;
    height: 12px;
  }

  .aspiration-question-circle {
    width: 70px;
    height: 70px;
    margin-right: 10px;
  }

  .aspiration-question-num-box {
    width: 35px;
    height: 35px;
    margin-top: -6px;
    margin-left: -6px;
  }

  .about-feature-line {
    margin-left: 5vw;
    margin-right: 5vw;
  }

  .about-feature-deco {
    width: 70px;
    margin: -30px 25px;
  }

  .reflection-content-b {
    margin-left: 0;
    margin-right: 0;
  }

  .reflection-survey-slide {
    padding-left: 10px;
    padding-right: 10px;
  }

  .reflection-survey-answer-box {
    border-radius: 40px;
    margin-left: 0;
    padding-top: 60px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .reflection-survey-thankyou-btn-gp {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

  .reflection-survey-list-deco {
    width: 70px;
    margin-left: 25px;
    margin-right: 25px;
  }

  .share-detail-content-b {
    margin-left: 0;
    margin-right: 0;
  }

  .share-detail-deco {
    width: 70px;
    margin-left: 25px;
    margin-right: 25px;
  }

  .share-student-item {
    padding-left: 3vw;
    padding-right: 3vw;
    transform: scale(.9);
  }

  .share-student-list {
    width: 80%;
  }

  .share-student-main-b {
    padding-top: 130px;
  }

  .share-student-qr-b {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-right: 15px;
  }

  .share-student-answer-box {
    border-radius: 40px;
    margin-left: 0;
    padding-top: 60px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .share-student-question-box {
    padding-left: 30px;
    padding-right: 30px;
  }

  .student-share-deco-1 {
    width: 40px;
  }

  .student-share-deco-2 {
    width: 60px;
  }

  .share-item-list {
    margin-left: -4%;
    margin-right: -4%;
  }

  .share-item {
    width: 50%;
    padding-left: 4%;
    padding-right: 4%;
  }

  .share-item-date-b {
    border-width: 4px;
    border-radius: 30px;
    padding: 10px 20px;
  }

  .share-map-item {
    width: 15%;
  }

  .share-map-item-speech-b {
    margin-top: -15px;
    margin-right: -8px;
  }

  .share-map-speech-default-b {
    padding: 15px;
  }

  .share-map-speech-dot {
    width: 20px;
  }

  .share-map-speech-des {
    max-height: 89.25px;
  }

  .share-listing-map-b {
    height: 100vw;
    min-height: 0;
  }

  .detail-reflect-button {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-right: 15px;
  }

  .career-aptitiude-advice-gp-title-b {
    font-size: 28px;
  }

  .career-aptitiude-advice-shortcut-b {
    top: 80px;
  }

  .act-recommend-item {
    width: 50%;
  }

  .activities-gridlist-item-date-b {
    border-width: 4px;
    border-radius: 30px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .activities-gridlist-item-info-icon-b {
    margin-right: 5px;
  }

  .history-row-remark-btn-b {
    flex: none;
  }

  .history-row-remark-txt {
    flex: 1;
  }

  .container-2 {
    padding-left: 3vw;
    padding-right: 3vw;
  }

  .sticky-btn-gp-2 {
    margin-bottom: 70px;
  }

  .footer-m-b {
    text-align: center;
    margin-top: 20px;
  }
}

@media screen and (max-width: 767px) {
  body {
    font-size: 16px;
  }

  h1 {
    font-size: 40px;
  }

  h2 {
    font-size: 30px;
  }

  .footer-shortcut-b {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .container.v-login, .container.v-act-detail-enroll, .container.inner-contact, .container.v-industry {
    padding-left: 60px;
    padding-right: 60px;
  }

  .footer-shortcut-list {
    display: block;
  }

  .footer-shorcut-item {
    width: auto;
    padding-left: 0;
    padding-right: 0;
  }

  .footer-shortcut-title {
    font-size: 20px;
  }

  .btn-common {
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .btn-common.mobile-hide {
    display: none;
  }

  .btn-common.mobile-only {
    display: inline-block;
  }

  .footer-shortcut-line {
    width: 100%;
    height: 1px;
    margin-top: 10px;
    margin-bottom: 10px;
    position: relative;
    transform: none;
  }

  .footer-logo-b {
    width: 100px;
  }

  .footer-logo-b.v-gov {
    width: 140px;
  }

  .brand {
    width: 90px;
  }

  .header-wrap {
    height: 70px;
  }

  .nav-menu {
    padding-top: 70px;
  }

  .popup-b {
    padding: 40px 10px;
  }

  .common-popup-box.act-filter {
    padding-left: 15px;
    padding-right: 15px;
  }

  .textfield {
    padding: 10px 15px;
    font-size: 16px;
  }

  .textfield.v-login {
    padding-left: 55px;
  }

  .popup-title {
    font-size: 20px;
  }

  .content-b.home-news {
    padding-top: 20px;
  }

  .content-b.act-list {
    padding-left: 35px;
  }

  .content-b.home-about {
    padding-top: 20px;
    padding-left: 80px;
    padding-right: 80px;
  }

  .content-b.home-register {
    padding: 50px 70px;
  }

  .content-b.home-life {
    padding-top: 60px;
  }

  .content-b.innerpage-first {
    padding-top: 12%;
  }

  .content-b.job-detail-act-list, .content-b.v-aspiration {
    padding-left: 35px;
  }

  .content-b.v-about {
    padding-left: 35px;
    padding-right: 35px;
  }

  .section-heading-b {
    margin-bottom: 30px;
  }

  .section-heading-line {
    height: 40px;
  }

  .slider-arrow {
    width: 50px;
    height: 50px;
    margin-top: 10px;
    padding: 12px;
  }

  .slider-arrow-line {
    margin-bottom: 25px;
    margin-left: 70px;
    margin-right: 70px;
  }

  .home-news-date-b {
    margin-bottom: 15px;
  }

  .home-news-date-txt {
    font-size: 20px;
  }

  .home-news-date-dots {
    margin-left: 10px;
  }

  .home-news-title {
    font-size: 20px;
  }

  .home-news-des {
    max-height: 76.8px;
  }

  .home-shortcut-b {
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
    padding: 10px;
  }

  .home-shortcut-wrap {
    border-radius: 20px;
    display: block;
  }

  .home-shortcut-item {
    font-size: 20px;
  }

  .home-shortcut-content-b {
    background-color: #0006;
    height: 100px;
    padding-left: 5vw;
    padding-right: 5vw;
  }

  .home-shortcut-content {
    align-items: center;
    display: flex;
  }

  .home-shortcut-btn-b {
    margin-top: 0;
  }

  .home-shortcut-txt {
    text-align: left;
    flex: 1;
    margin-right: 10px;
  }

  .section-watermark-txt {
    font-size: 60px;
  }

  .activities-list {
    border-left: 1px solid var(--white-smoke);
    padding-left: 5vw;
  }

  .activities-link {
    display: block;
  }

  .activities-item-l-b {
    justify-content: flex-start;
    width: auto;
    margin-bottom: 20px;
    padding-bottom: 0;
    padding-left: 25px;
  }

  .activities-item-r-b {
    width: auto;
    padding-top: 0;
  }

  .activities-line {
    display: none;
  }

  .activities-item-type-b {
    margin-bottom: 10px;
    font-size: 14px;
  }

  .activities-item-title {
    margin-bottom: 15px;
    font-size: 20px;
  }

  .act-item-info-icon-b {
    width: 25px;
    margin-right: 10px;
  }

  .activities-tag-list {
    margin-left: -2px;
    margin-right: -2px;
  }

  .activities-tag-item {
    padding-left: 2px;
    padding-right: 2px;
  }

  .activities-tag-item.v-num {
    width: 100%;
  }

  .act-tag {
    padding-top: 4px;
    padding-bottom: 4px;
  }

  .act-item-btn-b {
    margin-top: 20px;
  }

  .act-item-des {
    max-height: 84px;
    margin-top: 15px;
  }

  .act-item-graphic-b {
    max-width: 250px;
    margin-left: 0;
  }

  .act-item-date-b {
    margin-left: -25px;
    margin-right: 0;
    inset: 0% auto auto 0%;
  }

  .act-list-more-btn {
    width: 90px;
    height: 90px;
    margin-left: 0;
    margin-right: 0;
    padding: 23px;
    transform: translate(-50%);
  }

  .act-more-dot-b {
    width: 20px;
  }

  .section-bg.inner-first {
    margin-top: 60px;
  }

  .ac-list-deco {
    width: 50px;
  }

  .ac-list-deco.bottom-right {
    margin-bottom: 90px;
  }

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

  .section-learnmore-b {
    margin-top: 30px;
  }

  .home-regiester-bg-img {
    display: none;
  }

  .home-register-content {
    padding-left: 0;
    padding-right: 0;
  }

  .form-col.v-40 {
    width: 100%;
    margin-bottom: 30px;
  }

  .form-col.v-60 {
    width: 100%;
  }

  .form-col.v-50 {
    width: 100%;
    margin-bottom: 30px;
  }

  .field-gp-item.school-name {
    flex: 0 auto;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .field-gp-item.v-act-contact-person-lastname, .field-gp-item.v-act-contact-person-firstname {
    flex: 0 auto;
    width: 50%;
  }

  .field-gp-item.v-act-contact-person-title, .field-gp-item.survey-name-role {
    margin-top: 10px;
  }

  .field-gp-item.survey-name {
    flex: 0 auto;
    width: 50%;
  }

  .form-select {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 16px;
  }

  .home-register-deco-row-1 {
    width: 95%;
  }

  .home-register-deco {
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding-top: 100px;
    padding-bottom: 100px;
    display: flex;
  }

  .home-register-deco-row-2 {
    width: 90%;
  }

  .home-register-deco-row-3 {
    width: 95%;
  }

  .life-wheel-b {
    margin-top: 80px;
  }

  .life-wheel-b.v-en {
    font-size: 2.2vw;
    line-height: 120%;
  }

  .wheel-num {
    font-size: 16px;
  }

  .wheel-theme {
    font-size: 20px;
  }

  .wheel-theme.v-en {
    font-size: 18px;
  }

  .life-wheel-icon-click {
    width: 30%;
  }

  .life-wheel-content-intro {
    margin-bottom: 10px;
  }

  .life-wheel-content-btn {
    font-size: 20px;
  }

  .life-wheel-content-btn-arrow {
    width: 20px;
    margin-top: 10px;
  }

  .life-wheel-btn-line {
    height: 80px;
  }

  .life-planning-watermark-b {
    margin-top: 40px;
    font-size: 80px;
    inset: 0% auto auto 50%;
    transform: translate(-50%);
  }

  .life-planning-deco-b.deco-1 {
    width: 18%;
    margin-top: 0;
    margin-left: 0%;
  }

  .life-planning-deco-b.deco-2 {
    width: 12%;
    margin-top: 50px;
  }

  .life-planning-deco-b.deco-3 {
    width: 6%;
    margin-bottom: -40px;
  }

  .life-planning-deco-b.deco-4 {
    width: 12%;
    margin-bottom: -40px;
  }

  .inner-banner-b {
    margin-bottom: -4%;
    padding-top: 70px;
  }

  .inner-banner-deco-b {
    margin-bottom: -9.5%;
  }

  .inner-banner-deco-main-img {
    background-position: 100% 0;
    padding-top: 13.5%;
  }

  .login-box {
    border-radius: 20px;
    padding: 30px 20px;
  }

  .login-field-b {
    margin-bottom: 20px;
  }

  .login-field-icon-b {
    width: 40px;
  }

  .account-bg-deco {
    margin-left: 20px;
    margin-right: 20px;
  }

  .account-bg-deco.deco-2 {
    margin-bottom: 90px;
  }

  .checkbox-box {
    border-radius: 6px;
    width: 20px;
    height: 20px;
  }

  .checkbox-field-txt {
    margin-top: 1px;
  }

  .account-interest-list {
    justify-content: center;
    margin-bottom: -10px;
    margin-left: -1%;
    margin-right: -1%;
  }

  .account-interest-item {
    width: 100%;
    margin-bottom: 15px;
    padding-left: 1%;
    padding-right: 1%;
  }

  .account-menu-b {
    justify-content: center;
    margin-top: -5%;
  }

  .account-menu-btn {
    padding-left: 25px;
    padding-right: 25px;
  }

  .history-table-part {
    font-size: 16px;
  }

  .history-table-part.v-top {
    padding-top: 2px;
    padding-bottom: 2px;
  }

  .history-row-wrap {
    align-items: flex-end;
  }

  .history-col {
    margin-bottom: 15px;
  }

  .history-col.col-date, .history-col.col-time, .history-col.col-code {
    width: 33.3%;
  }

  .history-col.col-title {
    flex: 0 auto;
    width: 100%;
  }

  .history-col.col-status {
    width: 100%;
    padding-right: 45px;
  }

  .history-col.col-arrow {
    margin-bottom: 0;
    position: absolute;
    inset: auto 0% 0% auto;
  }

  .history-col.col-upload {
    width: 100%;
  }

  .history-row {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .history-row.v-top {
    display: none;
  }

  .history-row-main {
    flex-wrap: wrap;
    margin-bottom: -15px;
  }

  .history-status-tag {
    padding: 7px 15px;
  }

  .history-ec-arrow {
    background-image: linear-gradient(to top, var(--orange), var(--yellow));
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    height: 30px;
    display: flex;
  }

  .history-ec-arrow.v-expanded {
    background-image: linear-gradient(to top, var(--hot-pink), var(--orange));
  }

  .history-col-fieldname {
    display: block;
  }

  .history-expand-info-list {
    margin-left: -1%;
    margin-right: -1%;
  }

  .history-expand-info-item {
    margin-bottom: 15px;
    padding-left: 1%;
    padding-right: 1%;
  }

  .history-expand-info-item.col-level, .history-expand-info-item.col-contactperson, .history-expand-info-item.col-phone {
    width: 33.3%;
  }

  .history-expand-info-item.col-email {
    width: 100%;
  }

  .history-expand-info-item.col-button {
    text-align: left;
    width: 100%;
  }

  .history-expand-info-item.col-remark {
    width: 100%;
  }

  .history-info-item-title {
    margin-bottom: 2px;
  }

  .acti-item-info-txt {
    margin-top: 0;
    margin-bottom: 0;
  }

  .act-listing-filter-b {
    margin-bottom: 40px;
    padding-left: 0;
    padding-right: 0;
  }

  .act-listing-filter-b.v-no-result {
    height: auto;
    margin-bottom: 40px;
    padding-left: 0;
    padding-right: 0;
    overflow: visible;
  }

  .act-filter-item {
    width: 100%;
  }

  .act-daterange-to {
    margin-left: 10px;
    margin-right: 10px;
  }

  .act-filter-button-b {
    top: 80px;
  }

  .activities-no-result {
    margin-top: 0;
  }

  .btn-back {
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .detail-heading-b {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }

  .activities-detail-b {
    display: block;
  }

  .act-detail-graphic-b {
    width: auto;
    max-width: 250px;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
  }

  .act-detail-content-b {
    margin-left: 0;
  }

  .act-enrol-tab-link {
    margin: 5px;
  }

  .textarea {
    padding: 10px 15px;
    font-size: 16px;
  }

  .checkbox-item.v-enrol-level {
    width: 33.3%;
  }

  .contact-box {
    border-radius: 20px;
    padding: 30px 20px 80px;
  }

  .contact-box-deco {
    width: 60px;
  }

  .contact-bg-deco {
    width: 9%;
    margin: 15px 5px;
  }

  .contact-bg-deco.deco-2 {
    margin-bottom: 90px;
  }

  .industry-slide {
    width: 50%;
  }

  .industry-link {
    font-size: 20px;
  }

  .home-banner-b {
    margin-top: 40px;
  }

  .home-banner-b.v-touch {
    height: 100vh;
  }

  .btn-scroll-to-content {
    border-top-width: 6px;
    border-left-width: 6px;
    border-right-width: 6px;
    width: 150px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 15px;
  }

  .home-map-instruct-graphic {
    width: 120px;
    margin-bottom: 70px;
  }

  .home-map-instruct-content {
    font-size: 20px;
  }

  .home-map-arrow-img {
    width: 20px;
    height: 20px;
  }

  .home-map-compass-b {
    width: 300px;
  }

  .industry-slider-watermark {
    margin-top: 10%;
  }

  .industry-latest-job-item {
    width: 100%;
  }

  .industry-latest-trend-item {
    width: 50%;
  }

  .industry-latest-trend-circle {
    border-radius: 20px;
    width: auto;
    height: auto;
    padding: 15px 10px;
  }

  .industry-latest-trend-content {
    padding-left: 0;
    padding-right: 0;
  }

  .industry-latest-trend-img {
    width: 30%;
    max-width: 60px;
  }

  .industry-latest-trend-bg {
    width: 110%;
  }

  .industry-intro-b {
    display: block;
  }

  .industry-intro-l {
    width: 100%;
    max-width: 250px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
  }

  .industry-intro-heading-b {
    text-align: center;
    margin-bottom: 20px;
    padding-bottom: 20px;
  }

  .job-item {
    width: 50%;
    margin-bottom: 30px;
  }

  .job-item-handle {
    width: 30%;
    padding-top: 7%;
  }

  .exploration-bg-bottom {
    width: 95%;
  }

  .wheel-inner-title-b {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }

  .wheel-inner-title-bubble {
    width: 120px;
    height: 120px;
    padding-bottom: 20px;
    font-size: 24px;
  }

  .job-detail-b {
    display: block;
  }

  .job-detail-intro-l-b {
    width: auto;
    max-width: 250px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
  }

  .job-detail-intro-r-b {
    margin-left: 0;
  }

  .job-detail-heading-cat {
    margin-bottom: 5px;
  }

  .job-detail-heading-wrap {
    display: block;
  }

  .job-detail-heading-txt {
    margin-bottom: 10px;
    margin-right: 0;
  }

  .job-intro-img-handle {
    width: 30%;
    padding-top: 7%;
  }

  .job-detail-list {
    margin-left: 0;
    margin-right: 0;
  }

  .job-detail-item {
    padding-left: 0;
    padding-right: 0;
  }

  .job-share-slide {
    width: 50%;
    padding-left: 4%;
    padding-right: 4%;
  }

  .newsletter-item-title-b {
    font-size: 20px;
  }

  .job-share-slider-mask {
    margin-left: 0;
    margin-right: 0;
  }

  .job-subscribe-question-b {
    padding: 15px 20px;
  }

  .job-subscribe-answer-box {
    margin-top: -20px;
    padding: 50px;
  }

  .job-subscribe-answer-tip {
    width: 100px;
    margin-bottom: -48px;
    margin-right: 30px;
  }

  .btn-subscribe {
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .newsletter-top-box {
    border-radius: 30px;
    padding: 30px;
    display: block;
  }

  .newsletter-top-l {
    width: auto;
    margin-bottom: 20px;
    margin-right: 0;
    font-size: 16px;
  }

  .newsletter-intro-highlight {
    font-size: 24px;
  }

  .newsletter-top-graphic {
    width: 120px;
  }

  .newsletter-top-tip {
    width: 80px;
    margin-bottom: -35px;
    margin-right: 5px;
  }

  .newsletter-list {
    margin-left: 40px;
  }

  .news-letter-item {
    width: 50%;
    margin-bottom: 40px;
  }

  .newsletter-list-deco {
    width: 30px;
  }

  .newsletter-detail-b {
    margin-top: 20px;
    display: block;
  }

  .news-letter-detail-l-b {
    width: 100%;
    margin-bottom: 50px;
    margin-right: 0;
    position: relative;
    top: 0;
  }

  .newsletter-detail-content-b {
    margin-bottom: 30px;
    padding-bottom: 30px;
  }

  .newsletter-article-heading {
    margin-bottom: 30px;
  }

  .newsletter-detail-menu-link {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .aspiration-shortcut-b {
    margin-bottom: 40px;
  }

  .aspiration-shortcut-questionaire-title {
    font-size: 20px;
  }

  .aspiration-shortcut-questionaire-line {
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .aspiration-shortcut-item {
    width: 50%;
  }

  .aspiration-shortcut-item-link {
    font-size: 20px;
  }

  .aspiration-shortcut-icon {
    width: 60px;
  }

  .aspiration-main-b {
    margin-left: 0;
  }

  .aspiration-main-content-b {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
  }

  .aspiration-teacher-item {
    width: 100%;
  }

  .aspiration-teacher-deco {
    width: 60px;
  }

  .aspiration-teacher-vid-icon {
    width: 40px;
    height: 40px;
  }

  .aspiration-student-intro-b {
    padding-top: 0;
    padding-bottom: 0;
    display: block;
  }

  .aspiration-student-intro-img-b {
    width: 100%;
    max-width: 250px;
    margin-left: auto;
    margin-right: auto;
  }

  .aspiration-student-intro-txt-b {
    padding-top: 20px;
  }

  .aspiration-student-intro-deco-1 {
    margin-top: -30px;
    margin-left: 0;
  }

  .aspiration-questionaire-table {
    margin-left: -5vw;
    margin-right: -5vw;
  }

  .aspiration-questionaire-table-wrap {
    display: block;
  }

  .aspiration-col-question {
    width: auto;
    margin-bottom: 10px;
  }

  .aspiration-col-question.v-top {
    display: none;
  }

  .aspiration-question-circle {
    width: 50px;
    height: 50px;
    margin-left: 20px;
  }

  .aspiration-question-num-box {
    width: 30px;
    height: 30px;
    margin-left: -10px;
    font-size: 13px;
  }

  .about-feature-item {
    display: block;
  }

  .about-feature-l-b {
    width: auto;
    display: block;
  }

  .about-feature-img-b {
    width: auto;
    max-width: 250px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
  }

  .about-feature-tag {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-right: 40px;
  }

  .about-feature-tag-num-b {
    margin-top: -12px;
    font-size: 50px;
  }

  .about-feature-r-b {
    width: auto;
  }

  .about-feature-line {
    width: 100%;
    height: 2px;
    margin: 30px 0;
  }

  .about-feature-btn-b {
    text-align: center;
    margin-top: 30px;
  }

  .about-feature-content {
    text-align: center;
  }

  .about-feature-deco {
    width: 50px;
    margin-left: 0;
    margin-right: 0;
  }

  .reflection-survey-answer-box {
    border-radius: 20px;
    margin-top: -20px;
    padding: 50px 15px 30px;
  }

  .reflection-survey-question-b {
    padding-top: 15px;
    padding-bottom: 15px;
  }

  .reflection-survey-question-tip {
    margin-left: 30px;
  }

  .reflection-survey-answer-tip {
    width: 100px;
    margin-bottom: -30px;
    margin-right: 90px;
  }

  .reflection-survey-answer-tip.v-textarea {
    margin-bottom: -47px;
  }

  .reflection-survey-slider-btn-item {
    margin-left: 15px;
  }

  .reflection-survey-slider-arrow {
    width: 50px;
    height: 50px;
    padding: 12px;
  }

  .reflection-survey-text-area {
    height: 200px;
    min-height: 200px;
    font-size: 16px;
  }

  .reflection-survey-thankyou-bubble {
    padding-top: 15px;
    padding-bottom: 15px;
  }

  .reflection-survey-list-deco {
    width: 50px;
  }

  .reflection-survey-list-deco.bottom-right {
    margin-bottom: 90px;
  }

  .thankyou-vid-img {
    width: 100px;
  }

  .share-detail-info-b {
    display: block;
  }

  .share-detail-deco {
    width: 50px;
  }

  .share-detail-info-content-b {
    margin-left: 0;
  }

  .share-detail-info-img-b {
    width: auto;
    max-width: 300px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
  }

  .share-student-item {
    width: 100%;
    padding-left: 5vw;
    padding-right: 5vw;
    transform: none;
  }

  .share-student-item.slick-item {
    opacity: 1;
  }

  .share-student-list {
    width: auto;
    margin-left: 0;
    margin-right: 0;
  }

  .share-student-main-b {
    min-height: 500px;
    padding-top: 130px;
  }

  .share-student-qr-b {
    background-size: 30px;
    margin-top: 50px;
    padding-left: 45px;
  }

  .student-main-phone-b {
    width: 300px;
  }

  .share-student-answer-box {
    margin-top: -20px;
    padding-top: 40px;
  }

  .share-student-question-box {
    margin-right: 60px;
    padding-top: 15px;
    padding-bottom: 15px;
  }

  .share-student-answer-tip {
    width: 100px;
    margin-bottom: -48px;
    margin-right: 0;
    display: none;
    right: 50%;
  }

  .share-student-answer-tip.v-textarea {
    margin-bottom: -47px;
  }

  .share-student-answer-icon {
    width: 90px;
    margin-top: -110px;
    margin-right: -5vw;
    display: none;
  }

  .share-student-slider-arrow-gp {
    margin-top: 160px;
    margin-left: 0;
    margin-right: -5vw;
    display: block;
    inset: 0% 0% auto auto;
    transform: none;
  }

  .share-student-slider-arrow-line {
    margin-left: 10px;
    margin-right: 10px;
  }

  .student-share-deco-1 {
    display: none;
  }

  .student-share-deco-2 {
    margin-top: 0;
    display: none;
  }

  .share-item-date-b {
    margin-left: -25px;
    margin-right: 0;
    inset: 0% auto auto 0%;
  }

  .share-item-des {
    max-height: 56px;
    margin-top: 15px;
  }

  .share-item-btn-b {
    margin-top: 20px;
  }

  .share-map-item {
    width: 18%;
  }

  .share-map-speech-hover-b {
    width: 200px;
    min-width: 200px;
    padding: 15px;
  }

  .share-map-speech-title {
    margin-bottom: 5px;
    font-size: 16px;
  }

  .share-map-speech-des {
    max-height: 78.75px;
    font-size: 15px;
  }

  .share-listing-map-b {
    height: 120vw;
  }

  .share-map-cloud.v-right {
    margin-top: 110%;
  }

  .news-date-dots {
    margin-left: 10px;
  }

  .life-wheel-hover-txt-b {
    font-size: 14px;
    line-height: 120%;
  }

  .life-wheel-close {
    margin: -20%;
  }

  .wheel-btn-b {
    margin-top: 10px;
  }

  .home-map-news-frame {
    border-width: 5px;
  }

  .reflection-radio-field, .refelction-rating-label-gp {
    font-size: 14px;
  }

  .detail-reflect-button {
    background-size: 30px;
    padding-left: 50px;
  }

  .home-banner-scroll-icon-b {
    width: 25px;
  }

  .home-map-instruct-content-2 {
    font-size: 20px;
  }

  .home-map-move-icon-b {
    width: 100px;
  }

  .home-map-move-txt {
    font-size: 20px;
  }

  .play-cursot-content {
    width: 40px;
    height: 40px;
  }

  .share-video-b {
    margin-top: 40px;
  }

  .career-aptitiude-advice-gp {
    margin-bottom: 30px;
  }

  .career-aptitiude-advice-gp-title-b {
    letter-spacing: 1px;
    font-size: 24px;
  }

  .career-aptitiude-advice-gp-title-graphic {
    width: 50px;
    margin-right: 10px;
  }

  .career-aptitiude-advice-shortcut-b {
    margin-bottom: 20px;
    padding-left: 3px;
    padding-right: 3px;
    top: 70px;
  }

  .career-aptitiude-advice-shortcut-item {
    padding-left: 3px;
    padding-right: 3px;
  }

  .career-aptitiude-advice-shortcut-link {
    font-size: 14px;
    line-height: 120%;
  }

  .act-recommend-list {
    margin-top: 40px;
    margin-left: 0;
    margin-right: 0;
    display: block;
  }

  .act-recommend-item {
    width: auto;
    min-width: 0;
    margin-bottom: 30px;
    padding-left: 0;
    padding-right: 0;
  }

  .act-recommend-link {
    display: flex;
  }

  .act-recommend-sec-title.v-gridlist {
    margin-left: -8%;
  }

  .act-recommend-img-b {
    width: 180px;
    margin-left: 0;
    margin-right: 20px;
  }

  .act-recommend-item-title {
    font-size: 20px;
  }

  .activities-recommend-item-type-b {
    margin-bottom: 10px;
    font-size: 14px;
  }

  .activities-grid-list {
    margin-top: 60px;
    margin-left: -8%;
  }

  .activities-grid-list-item {
    width: 50%;
  }

  .activities-grid-list-link {
    display: block;
  }

  .activities-gridlist-item-top-b {
    justify-content: flex-start;
    width: auto;
  }

  .activities-gridlist-item-graphic-b {
    width: 120px;
    margin-left: 0;
    margin-right: 0;
  }

  .activities-gridlist-item-content-b {
    width: auto;
    margin-top: 10px;
    padding-top: 0;
  }

  .activities-gridlist-item-type-b {
    margin-bottom: 10px;
    font-size: 13px;
  }

  .activities-gridlist-item-title {
    font-size: 17px;
  }

  .activities-gridlist-item-btn-b {
    margin-top: 20px;
  }

  .activities-gridlist-item-date-b {
    margin-left: -25px;
    margin-right: 0;
    inset: 0% auto auto 0%;
  }

  .activities-gridlist-item-info-icon-b {
    width: 20px;
    margin-right: 5px;
  }

  .acti-gridlist-item-info-txt {
    margin-top: 0;
    margin-bottom: 0;
  }

  .activities-gridlist-tag-list {
    margin-left: -2px;
    margin-right: -2px;
  }

  .activities-gridlist-tag-item {
    padding-left: 2px;
    padding-right: 2px;
  }

  .activities-gridlist-tag-item.v-num {
    width: 100%;
  }

  .history-row-remark-b {
    order: 0;
    margin-bottom: 10px;
    padding-left: 1%;
    padding-right: 1%;
    display: none;
  }

  .history-row-remark-b.v-mobile {
    border-bottom-style: none;
    margin-bottom: 5px;
    padding-bottom: 0;
    padding-left: 0%;
    padding-right: 0%;
    display: block;
  }

  .history-row-remark-btn-b {
    width: auto;
    margin-top: 5px;
    padding-left: 0%;
    padding-right: 0%;
  }

  .history-row-remark-txt {
    padding-left: 0%;
    padding-right: 0%;
  }

  .container-2 {
    padding-left: 5vw;
    padding-right: 5vw;
  }

  .container-2.v-sticky {
    padding-left: 0;
    padding-right: 0;
  }

  .sticky-btn-gp-wrap {
    margin-bottom: 0;
    box-shadow: 0 -2px 6px #0000001a;
  }

  .sticky-btn-gp-2 {
    z-index: 1500;
    background-color: #fff;
    width: 100%;
    margin-bottom: 0;
    position: fixed;
    inset: auto auto 0% 0%;
  }

  .sticky-btn-2 {
    box-shadow: none;
    border-right: 1px solid #eee;
    border-radius: 0;
    width: 20%;
    margin-right: 0;
    padding-top: 45px;
    padding-bottom: 5px;
    transform: none;
  }

  .sticky-btn-2:hover {
    background-color: #f5f5f5;
    transform: none;
  }

  .cancel-btn, .change-time-btn {
    padding: 7px 15px;
  }
}

@media screen and (max-width: 479px) {
  h1 {
    font-size: 36px;
  }

  h2 {
    font-size: 24px;
  }

  .container.v-login, .container.v-act-detail-enroll {
    padding-left: 5vw;
    padding-right: 5vw;
  }

  .container.inner-contact {
    padding-left: 50px;
    padding-right: 50px;
  }

  .container.v-industry {
    padding-left: 5vw;
    padding-right: 5vw;
  }

  .nav-item {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .btn-pop-close.popup-close {
    width: 50px;
    height: 25px;
    margin-right: -25px;
  }

  .content-b {
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .content-b.home-news {
    padding-bottom: 30px;
  }

  .content-b.act-list {
    padding-left: 40px;
  }

  .content-b.home-about {
    padding-left: 0;
    padding-right: 0;
  }

  .content-b.home-register {
    padding-left: 40px;
    padding-right: 40px;
  }

  .content-b.job-detail-act-list {
    padding-left: 40px;
  }

  .content-b.v-aspiration {
    padding-left: 0;
  }

  .content-b.v-about {
    padding-left: 0;
    padding-right: 0;
  }

  .home-section-arrow-deco-1 {
    background-position: 100% 100%;
    padding-top: 20%;
  }

  .home-news-slide {
    width: 100%;
  }

  .section-watermark-txt {
    font-size: 50px;
  }

  .act-item-date-b {
    border-radius: 20px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .act-item-month {
    font-size: 16px;
  }

  .act-item-year {
    font-size: 13px;
  }

  .act-list-more-bg {
    position: absolute;
  }

  .section-bg.inner-first.v-login, .section-bg.v-login, .section-bg.v-industry, .section-bg.v-newsletter-listing, .section-bg.v-aspiration, .section-bg.v-about, .section-bg.v-share {
    display: none;
  }

  .ac-list-deco {
    z-index: 100;
    margin-top: 60px;
    margin-bottom: 30px;
  }

  .home-section-arrow-deco-2 {
    background-position: 100% 100%;
    padding-top: 20%;
  }

  .sticky-btn-gp {
    border-right-width: 0;
    border-radius: 10px 0 0 10px;
    margin-right: 0;
    padding-left: 6px;
    padding-right: 6px;
  }

  .sticky-btn {
    width: 22px;
  }

  .form-wrap {
    margin-bottom: -25px;
  }

  .form-col.v-40, .form-col.v-50 {
    margin-bottom: 25px;
  }

  .field-gp {
    margin-bottom: -10px;
  }

  .field-gp-item.v-50 {
    width: 100%;
    margin-bottom: 10px;
  }

  .field-gp-item.v-act-contact-person-lastname {
    width: 100%;
  }

  .field-gp-item.v-act-contact-person-firstname {
    width: 100%;
    margin-top: 10px;
  }

  .field-gp-item.survey-name-role {
    margin-top: 0;
  }

  .field-gp-item.survey-name {
    width: 100%;
    margin-bottom: 10px;
  }

  .home-register-deco.v-act-detail {
    display: none;
  }

  .home-register-deco-arrow {
    width: 15%;
  }

  .home-register-deco-square {
    width: 9%;
  }

  .home-register-deco-row-2 {
    width: 95%;
  }

  .home-register-deco-tri {
    width: 10%;
  }

  .home-register-deco-circle, .home-register-deco-ring {
    width: 9%;
  }

  .home-register-deco-arch {
    width: 15%;
  }

  .life-wheel-b.v-en {
    font-size: 2.6vw;
  }

  .wheel-num {
    font-size: 4.1vw;
  }

  .wheel-theme {
    font-size: 5vw;
  }

  .wheel-theme.v-en {
    font-size: 3.2vw;
  }

  .life-wheel-content {
    padding-left: 10%;
    padding-right: 10%;
  }

  .life-wheel-content-btn {
    font-size: 16px;
  }

  .life-wheel-btn-line {
    height: 40px;
  }

  .life-planning-watermark-b {
    margin-top: 60px;
    font-size: 60px;
  }

  .account-interest-list {
    justify-content: flex-start;
  }

  .account-menu-b {
    justify-content: center;
    margin-top: 0%;
  }

  .history-col.col-date, .history-col.col-time {
    width: 50%;
  }

  .history-col.col-code {
    width: 100%;
  }

  .history-expand-info-item.col-level, .history-expand-info-item.col-contactperson, .history-expand-info-item.col-phone {
    width: 50%;
  }

  .act-filter-item.v-daterange {
    display: block;
  }

  .act-daterange-item {
    width: 100%;
  }

  .act-daterange-to {
    text-align: center;
    margin: 10px 0;
  }

  .activities-no-result {
    padding-bottom: 50px;
  }

  .act-detail-date-b {
    border-radius: 20px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .activities-detail-info-list {
    margin-left: 10px;
  }

  .contact-box {
    padding-bottom: 60px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .contact-email-link {
    word-break: break-all;
    border-radius: 20px;
    flex-wrap: wrap;
    justify-content: center;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .contact-email-box {
    flex: 0 auto;
    width: 100%;
    margin-top: 10px;
    padding: 0 20px;
  }

  .contact-box-deco {
    width: 40px;
  }

  .industry-slide {
    width: 100%;
  }

  .industry-link {
    max-width: 250px;
    margin-left: auto;
    margin-right: auto;
  }

  .home-banner-b.v-touch {
    height: 80vh;
  }

  .home-map-compass-b {
    width: 250px;
  }

  .industry-latest-content, .industry-latest-joblist {
    padding-bottom: 50px;
  }

  .industry-latest-job-item {
    margin-bottom: 8px;
  }

  .industry-latest-job-icon {
    width: 25px;
  }

  .industry-latest-job-arrow {
    width: 15px;
  }

  .industry-latest-trend-list {
    margin-left: 0;
    margin-right: 0;
    display: block;
  }

  .industry-latest-trend-item {
    width: auto;
    margin-bottom: 10px;
    padding-left: 0;
    padding-right: 0;
  }

  .industry-latest-trend-circle {
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
  }

  .industry-latest-trend-content {
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .industry-latest-trend-img {
    width: 50px;
    margin-left: 0;
    margin-right: 20px;
  }

  .job-item {
    width: 100%;
  }

  .job-item-img-b {
    max-width: 250px;
    margin-left: auto;
    margin-right: auto;
  }

  .wheel-inner-title-b {
    flex-wrap: wrap;
  }

  .wheel-inner-title-bubble {
    width: 100px;
    height: 100px;
    padding-bottom: 16px;
    font-size: 20px;
  }

  .wheel-inner-title-heading {
    min-width: 250px;
  }

  .job-detail-list {
    margin-bottom: 30px;
  }

  .job-share-slide {
    border-left-style: none;
    width: 100%;
  }

  .newsletter-link {
    max-width: 250px;
    margin-left: auto;
    margin-right: auto;
  }

  .newsletter-item-txt-b.v-first {
    color: var(--black);
    padding: 0;
    position: relative;
  }

  .newsletter-item-date.v-first {
    color: var(--grey);
  }

  .job-subscribe-question-b {
    border-bottom-left-radius: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .job-subscribe-question-tip {
    width: 20px;
    margin-bottom: -15px;
    margin-left: 0;
  }

  .job-subscribe-answer-box {
    text-align: center;
    border-radius: 20px;
    margin-top: -20px;
    padding: 40px 20px 30px;
  }

  .job-subscribe-answer-tip {
    width: 60px;
    margin-bottom: -28px;
    margin-right: 25px;
  }

  .btn-subscribe {
    margin-top: 10px;
    display: inline-block;
    position: relative;
  }

  .newsletter-top-box {
    padding-top: 50px;
  }

  .newsletter-top-graphic {
    width: 100px;
    margin-top: -30px;
  }

  .newsletter-list {
    margin-left: 0;
  }

  .news-letter-item {
    width: 100%;
  }

  .news-letter-item.v-first {
    padding-left: 0;
    padding-right: 0;
  }

  .newsletter-list-deco {
    z-index: 100;
    margin-top: 60px;
    margin-bottom: 30px;
  }

  .newsletter-detail-b {
    padding-right: 0;
  }

  .aspiration-shortcut-questionaire-link {
    border-radius: 20px;
    padding: 3px;
  }

  .aspiration-shortcut-questionaire-img {
    background-position: 50%;
    height: auto;
    padding-top: 60%;
    position: relative;
  }

  .aspiration-shortcut-questionaire-content {
    background-color: var(--dark-slate-blue);
    background-image: none;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    margin-top: -20px;
    padding-top: 20px;
  }

  .aspiration-shortcut-questionaire-wrap {
    border-radius: 17px;
  }

  .aspiration-shortcut-r {
    padding-top: 25px;
    padding-bottom: 25px;
  }

  .aspiration-shortcut-r-deco-1 {
    width: 20px;
  }

  .aspiration-shortcut-r-deco-2 {
    width: 40px;
  }

  .aspiration-main-content-b.v-student {
    margin-left: -5vw;
  }

  .aspiration-teacher-item {
    margin-bottom: 8px;
  }

  .aspiration-teacher-item-icon {
    width: 25px;
  }

  .aspiration-teacher-item-arrow {
    width: 15px;
  }

  .aspiration-teacher-video-list {
    margin-left: 0;
    margin-right: 0;
  }

  .aspiration-teacher-video-item {
    width: auto;
    padding-left: 0;
    padding-right: 0;
  }

  .aspiration-student-intro-deco-1 {
    width: 30px;
  }

  .aspiration-student-intro-deco-2 {
    width: 40px;
  }

  .about-feature-deco {
    z-index: 100;
    margin-left: -35px;
    display: none;
  }

  .reflection-content-b {
    margin-left: -5vw;
    margin-right: -5vw;
  }

  .reflection-survey-answer-box {
    margin-top: -20px;
  }

  .reflection-survey-answer-box.v-textarea {
    border-width: 6px;
  }

  .reflection-survey-question-b {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .reflection-survey-question-tip {
    width: 20px;
    margin-bottom: -15px;
  }

  .reflection-survey-answer-tip {
    width: 60px;
    margin-bottom: -28px;
  }

  .reflection-survey-answer-tip.v-textarea {
    margin-bottom: -28px;
  }

  .reflection-survey-thankyou-bubble {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .reflection-survey-list-deco {
    z-index: 100;
    margin-top: 60px;
    margin-bottom: 30px;
  }

  .thankyou-vid-img {
    margin-right: 5px;
  }

  .share-detail-deco {
    z-index: 100;
    margin-top: 60px;
    margin-bottom: 30px;
  }

  .share-student-list {
    margin-left: -5vw;
    margin-right: -5vw;
  }

  .share-student-main-b {
    padding-top: 130px;
  }

  .share-student-qr-b {
    margin-left: 25px;
    margin-right: 25px;
  }

  .share-student-answer-box {
    border-radius: 20px;
    margin-top: -20px;
    padding-bottom: 30px;
    padding-left: 30px;
    padding-right: 30px;
  }

  .share-student-answer-box.v-textarea {
    border-width: 6px;
  }

  .share-student-question-box {
    margin-right: 50px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .share-student-answer-tip {
    width: 60px;
    margin-bottom: -28px;
  }

  .share-student-answer-tip.v-textarea {
    margin-bottom: -28px;
  }

  .share-student-slider-arrow-gp {
    margin-top: 170px;
    margin-left: 0;
    margin-right: -5vw;
    inset: 0% 0% auto auto;
    transform: none;
  }

  .student-share-deco-1 {
    margin-left: 0%;
  }

  .student-share-deco-2 {
    margin-right: 0%;
  }

  .share-item-list {
    margin-left: 0%;
    margin-right: 0%;
    display: block;
  }

  .share-item {
    width: auto;
    padding-left: 0%;
    padding-right: 0%;
  }

  .share-item-link {
    padding-top: 0;
  }

  .share-item-date-b {
    border-radius: 20px;
    margin-top: 0;
    margin-left: 0;
    padding-left: 15px;
    padding-right: 15px;
  }

  .share-map-item {
    width: 80px;
  }

  .share-map-item.item-10 {
    margin-left: -3%;
  }

  .share-map-item-speech-b {
    margin-top: -6px;
    margin-right: 8px;
  }

  .share-map-speech-default-b {
    padding: 8px;
  }

  .share-map-speech-dot {
    width: 10px;
  }

  .share-map-speech-tip {
    width: 6px;
    height: 6px;
    margin-bottom: -4px;
  }

  .share-map-speech-hover-b {
    width: 150px;
    min-width: 150px;
  }

  .share-listing-map-b {
    height: 150vw;
  }

  .reflection-radio-circle {
    width: 15px;
    height: 15px;
  }

  .reflection-radio-dot {
    width: 8px;
    height: 8px;
  }

  .btn-vid-close {
    width: 25px;
    height: 25px;
    margin-right: -25px;
  }

  .home-map-move-icon-b {
    width: 80px;
  }

  .home-map-move-txt {
    font-size: 16px;
  }

  .btn-apply-sticky {
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .act-recommend-item {
    margin-bottom: 60px;
  }

  .act-recommend-link {
    display: block;
  }

  .act-recommend-sec-title.v-gridlist {
    margin-left: -10%;
  }

  .act-recommend-img-b {
    width: 100%;
    max-width: 200px;
    margin-bottom: 10px;
    margin-right: 10px;
  }

  .act-recommend-item-info {
    margin-top: 0;
  }

  .activities-grid-list {
    margin-left: -12%;
  }

  .activities-grid-list-item {
    width: auto;
  }

  .activities-grid-list-link {
    flex-flow: wrap;
    display: flex;
  }

  .activities-gridlist-item-top-b {
    flex: none;
    margin-bottom: 10px;
    margin-right: 20px;
  }

  .activities-gridlist-item-graphic-b {
    width: 100px;
    max-width: none;
  }

  .activities-gridlist-item-content-b {
    flex: 1;
    margin-top: 0;
  }

  .activities-gridlist-item-info-list {
    width: 100%;
  }

  .activities-gridlist-item-date-b {
    border-radius: 20px;
    padding: 10px;
  }

  .act-gridlist-item-month {
    font-size: 16px;
  }

  .act-gridlist-item-year {
    font-size: 13px;
  }

  .abbout-intest-list-box {
    padding: 15px;
  }
}


@font-face {
  font-family: 'Gotham';
  src: url('../fonts/Gotham-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}