:root {
  --424242: #424242;
  --dark-cyan: #498;
  --teal: #006d58;
  --black: black;
  --eee: #eee;
  --light-sea-green: #41b49d;
  --white: white;
  --f7f7f7: #f7f7f7;
  --white-smoke: #f2f7f6;
  --ccc: #ccc;
  --686868: #686868;
  --powder-blue: #c6dbd7;
  --ababab: #ababab;
  --red: #da0011;
  --steel-blue: #3f82b6;
  --azure-2: #e5f0ee;
  --light-sky-blue: #77b3e2;
  --azure: #d9e9e6;
  --ddd: #ddd;
  --f0f0f0: #f0f0f0;
  --dark-orange: #ebcf00;
}

.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;
}

.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;
}

body {
  color: var(--424242);
  font-family: Lato, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 28px;
}

h1 {
  color: var(--dark-cyan);
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-size: 36px;
  font-weight: 900;
  line-height: 40px;
}

h2 {
  color: var(--teal);
  margin-top: 0;
  margin-bottom: 15px;
  font-size: 22px;
  font-weight: 700;
  line-height: 26px;
}

h3 {
  color: var(--black);
  margin-top: 0;
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
}

h4 {
  color: var(--black);
  margin-top: 0;
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 22px;
}

p {
  margin-bottom: 10px;
}

a {
  text-decoration: none;
}

label {
  margin-bottom: 0;
  font-weight: 700;
  display: block;
}

.section-content {
  padding-top: 40px;
  padding-bottom: 40px;
}

.section-content.no-bottom-margin {
  padding-bottom: 0;
}

.section-content.no-top-margin {
  padding-top: 0;
}

.section-content.no-margin {
  padding-top: 0;
  padding-bottom: 0;
}

.section-content.suggestion {
  background-color: var(--eee);
  background-image: url('../images/contact-us-suggestion2x.jpg');
  background-position: 25% 100%;
  background-repeat: no-repeat;
  background-size: auto 100%;
}

.all {
  padding-top: 105px;
  padding-left: 200px;
  position: relative;
}

.all.no-padding {
  padding-left: 0;
}

.all.vaccine {
  background-image: url('../images/bg-grey1.5x.jpg');
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-size: cover;
  padding-left: 0;
}

.all.agm {
  padding-left: 0;
}

.top-bar {
  z-index: 1000;
  border-bottom: 5px solid var(--light-sea-green);
  background-color: var(--white);
  width: 100%;
  height: 105px;
  padding-top: 15px;
  padding-bottom: 15px;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.header {
  z-index: 1000;
  background-color: var(--teal);
  width: 200px;
  margin-top: 105px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.content-b {
  width: 100%;
}

.logo {
  width: auto;
  height: 50px;
}

.img-logo {
  max-width: none;
  height: 100%;
}

.container {
  width: 100%;
  max-width: 1380px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.container.inner-banner {
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.container.vaccine {
  padding-left: 60px;
  padding-right: 60px;
}

.container.no-padding {
  padding-left: 0;
  padding-right: 0;
}

.top-container {
  width: 100%;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 60px;
  padding-right: 60px;
}

.top-container.vaccine {
  max-width: 1380px;
}

.nav-menu {
  width: 100%;
  height: auto;
}

.nav-link {
  color: var(--white);
  width: 100%;
  padding: 8px 0 8px 50px;
  font-size: 16px;
  font-weight: 400;
  line-height: 26px;
}

.nav-link:hover {
  background-color: var(--light-sea-green);
}

.nav-link.w--current {
  background-color: var(--light-sea-green);
  color: var(--white);
}

.nav-link.mobile {
  display: none;
}

.header-container {
  width: 100%;
}

.nav-dropdown {
  color: var(--white);
  width: 100%;
  font-weight: 400;
  display: block;
  position: relative;
}

.nav-toggle {
  color: var(--white);
  width: 100%;
  padding: 0;
  font-weight: 400;
}

.nav-dropdown-list {
  z-index: 100;
  background-color: var(--f7f7f7);
  border-radius: 7px;
  width: 280px;
  margin-top: -7px;
  padding-top: 15px;
  padding-left: 15px;
  padding-right: 15px;
  top: 0%;
  bottom: auto;
  left: 100%;
  right: auto;
  box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}

.nav-dropdown-link {
  color: var(--black);
  background-image: url('../images/bullet.svg');
  background-position: 0 4px;
  background-repeat: no-repeat;
  background-size: 10px;
  margin-bottom: 15px;
  padding-left: 17px;
  font-weight: 700;
  text-decoration: none;
  display: block;
}

.section-footer {
  z-index: 100;
  border-top: 5px solid var(--light-sea-green);
  background-color: var(--white-smoke);
  padding-bottom: 30px;
  position: relative;
}

.section-footer.v-joinus {
  padding-top: 30px;
}

.footer-link-row {
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-top: 30px;
  margin-left: -15px;
  margin-right: -15px;
  display: flex;
}

.footer-col-l {
  float: left;
  flex-direction: column;
  flex: 1;
  justify-content: space-between;
  margin-right: 20px;
  display: flex;
}

.footer-col-r {
  float: right;
  flex: 0 auto;
  width: 43%;
  padding-top: 30px;
}

.footer-app-link {
  transition: opacity .2s;
  display: inline-block;
}

.footer-app-link:hover {
  opacity: .6;
}

.footer-app-link-b {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  margin-top: 10px;
  margin-left: -5px;
  margin-right: -5px;
  display: flex;
}

.footer-b {
  justify-content: space-between;
  font-size: 16px;
  line-height: 26px;
  display: flex;
}

.footer-link-b {
  flex: none;
}

.footer-dropdown {
  display: block;
  position: static;
}

.footer-dropdown-toggle {
  color: var(--424242);
  padding: 0 15px;
  transition: color .2s;
  position: static;
}

.footer-dropdown-toggle:hover {
  color: var(--light-sea-green);
}

.footer-dropdown-list {
  z-index: 10;
  border-bottom: 5px solid var(--light-sea-green);
  background-color: var(--f7f7f7);
  padding: 15px 40px 10px;
  top: auto;
  bottom: 100%;
  left: 0%;
  right: 0%;
  box-shadow: 0 -5px 5px rgba(0, 0, 0, .1);
}

.footer-link {
  color: var(--424242);
  padding: 0 15px;
  transition: color .2s;
}

.footer-link:hover {
  color: var(--light-sea-green);
}

.footer-link.no-padding {
  padding-top: 0;
  padding-left: 0;
  padding-right: 0;
}

.footer-dropdown-link {
  float: left;
  background-image: url('../images/bullet.svg');
  background-position: 0%;
  background-repeat: no-repeat;
  background-size: 8px;
  margin: 5px 20px 5px 0;
  padding: 0 0 0 13px;
  font-size: 16px;
  line-height: 18px;
  transition: color .2s;
}

.footer-dropdown-link:hover {
  color: var(--light-sea-green);
}

.footer-dropdown-link.w--current {
  color: var(--424242);
}

.footer-dropdown-link.w--current:hover {
  color: var(--light-sea-green);
}

.footer-dropdown-align-b {
  width: 100%;
  max-width: 1300px;
  margin-left: auto;
  margin-right: auto;
}

.hide {
  display: none;
}

.top-link {
  padding: 0;
  transition: color .2s;
  display: block;
}

.top-link:hover {
  color: var(--light-sea-green);
}

.top-link.w--current {
  color: var(--424242);
}

.top-link.w--current:hover {
  color: var(--light-sea-green);
}

.top-col-l {
  float: left;
  flex: none;
  order: -1;
  align-items: center;
  display: flex;
}

.top-col-r {
  float: right;
  flex-direction: column;
  flex: 1;
  order: 1;
  align-items: flex-end;
  padding-left: 10px;
  font-size: 14px;
  line-height: 18px;
  display: flex;
}

.top-info-row {
  color: var(--teal);
  margin-bottom: 10px;
  padding-top: 12px;
}

.top-info-row.vaccine {
  flex-wrap: wrap;
  justify-content: flex-end;
  display: flex;
}

.top-link-row {
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  margin-left: -3px;
  margin-right: -3px;
  display: flex;
}

.top-link-row.vaccine {
  height: 30px;
  margin-left: 0;
  margin-right: 0;
}

.top-info-b {
  float: left;
  margin-left: 15px;
}

.top-link-b {
  margin-left: 3px;
  margin-right: 3px;
}

.top-line {
  background-color: var(--ccc);
  width: 1px;
  height: 22px;
  margin-left: 3px;
  margin-right: 3px;
}

.top-align-b {
  justify-content: space-between;
  display: flex;
}

.top-align-b.v-join {
  margin-top: 10px;
}

.top-search-b {
  margin-left: 3px;
  margin-right: 3px;
}

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

.form-b._500 {
  width: 500px;
  margin-left: auto;
  margin-right: auto;
}

.form-b.top-margin-20 {
  margin-top: 20px;
}

.search-field {
  border: 1px solid var(--686868);
  color: var(--black);
  border-radius: 30px;
  width: 122px;
  height: 30px;
  margin-bottom: 0;
  padding-top: 4px;
  padding-bottom: 5px;
  font-size: 14px;
  line-height: 18px;
}

.search-field:focus {
  border-color: var(--light-sea-green);
}

.search-field::placeholder {
  color: var(--686868);
}

.btn-search {
  width: 22px;
  height: 22px;
  margin-left: 7px;
  position: relative;
}

.img-btn {
  width: 100%;
  display: block;
}

.img-btn-hover {
  opacity: 0;
  width: 100%;
  max-width: none;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.img-btn-hover.vgame2 {
  border-radius: 50%;
  overflow: hidden;
}

.search-form {
  align-items: center;
  display: flex;
}

.btn-notification {
  width: 20px;
  height: 20px;
  display: block;
  position: relative;
}

.notification-number {
  z-index: 10;
  background-color: var(--black);
  color: var(--white);
  text-align: center;
  border-radius: 14px;
  width: 14px;
  height: 14px;
  margin-top: -4px;
  margin-right: -4px;
  font-size: 11px;
  line-height: 14px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.home-banner {
  width: 100%;
}

.home-slider {
  background-color: rgba(0, 0, 0, 0);
  width: 100%;
  height: auto;
}

.arrow-l {
  opacity: .75;
  background-image: url('../images/arrow-l.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 20px;
  margin-left: 20px;
  transition: opacity .2s;
}

.arrow-l:hover {
  opacity: 1;
}

.arrow-r {
  opacity: .75;
  background-image: url('../images/arrow-r.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 20px;
  margin-right: 20px;
  transition: opacity .2s;
}

.arrow-r:hover {
  opacity: 1;
  text-align: right;
}

.home-slide {
  width: 100%;
}

.home-slide-nav {
  height: 30px;
  padding-top: 0;
}

.img-home-slide {
  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: 30%;
  display: block;
}

.img-home-slide._01 {
  background-image: url('../images/banner-home012x.jpg');
}

.img-home-slide._02 {
  background-image: url('../images/banner-home022x.jpg');
}

.txt-small {
  color: var(--686868);
  font-size: 16px;
  font-weight: 400;
  line-height: 18px;
}

.txt-small.bottom-margin-5 {
  margin-bottom: 5px;
}

.txt-small.top-margin-5 {
  margin-top: 5px;
}

.txt-green {
  color: var(--teal);
}

.home-col-l {
  float: left;
  width: 45%;
  padding-right: 20px;
}

.home-col-r {
  float: left;
  width: 55%;
  padding-left: 20px;
}

.heading {
  color: var(--dark-cyan);
  letter-spacing: 2px;
  text-transform: uppercase;
  font-size: 36px;
  font-weight: 900;
  line-height: 40px;
}

.heading.highlight {
  width: 220px;
}

.home-news-b {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 15px;
  position: relative;
}

.btn-white {
  float: left;
  border: 1px solid var(--teal);
  background-color: var(--white);
  color: var(--teal);
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 100px;
  padding: 6px 25px;
  transition: border-color .2s, color .2s, background-color .2s;
  display: block;
}

.btn-white:hover {
  border-color: var(--light-sea-green);
  background-color: var(--light-sea-green);
  color: var(--white);
}

.btn-white._140 {
  width: 140px;
  padding-left: 10px;
  padding-right: 10px;
}

.btn-white.full {
  width: 100%;
}

.btn-white._180 {
  width: 180px;
}

.btn-white._230 {
  width: 230px;
}

.btn-white.calculator {
  width: 160px;
}

.btn-white.eform {
  width: 180px;
  padding-left: 10px;
  padding-right: 10px;
}

.btn-arrow {
  z-index: 10;
  float: left;
  width: 8px;
  height: 13px;
  margin-top: 1px;
  margin-left: 5px;
  position: relative;
}

.btn-arrow.v-prev {
  margin-left: 0;
  margin-right: 5px;
}

.btn-align-b {
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
}

.home-news-slider {
  background-color: rgba(0, 0, 0, 0);
  height: auto;
}

.home-btn-b {
  z-index: 10;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.home-btn-b.highlight {
  margin-top: 40px;
}

.home-heading-b {
  margin-bottom: 15px;
  position: relative;
}

.home-notice-b {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 15px;
  position: relative;
}

.home-news-slide {
  width: 100%;
  height: auto;
  padding-bottom: 30px;
}

.home-highlight-b {
  position: relative;
}

.txt-title {
  color: var(--black);
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
}

.txt-title.txt-16 {
  font-size: 16px;
  line-height: 22px;
}

.link-txt-b {
  color: var(--424242);
  padding-left: 10px;
  line-height: 26px;
}

.link-title-b {
  border-left: 3px solid var(--teal);
  color: var(--424242);
  margin-bottom: 5px;
  padding-left: 7px;
  display: block;
}

.link-row {
  display: block;
}

.link-col-l {
  flex: 1;
  padding-right: 20px;
}

.news-col-r {
  z-index: 10;
  border: 1px solid var(--powder-blue);
  border-radius: 7px;
  flex: none;
  width: 140px;
  margin-left: 20px;
  position: relative;
  overflow: hidden;
}

.link-align-b {
  align-items: flex-start;
  display: flex;
}

.img-thumbnail {
  width: 100%;
  display: block;
}

.home-calendar-b.member-zone {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 25px;
}

.home-calendar-col-r {
  float: left;
  flex: 1;
  margin-left: 40px;
}

.home-calendar-align-b {
  display: flex;
}

.calendar-link {
  border-left: 3px solid var(--teal);
  color: var(--black);
  margin-top: 15px;
  padding-left: 7px;
  font-size: 19px;
  font-weight: 700;
  line-height: 25px;
  transition: color .2s;
  display: block;
}

.calendar-link:hover {
  color: var(--light-sea-green);
}

.home-calendar-col-l {
  float: left;
  width: 245px;
  padding-top: 5px;
}

.home-online-services-grey-b {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  width: 100%;
  height: 100%;
  padding: 15px;
}

.home-online-services-align-b {
  margin-left: -5px;
  margin-right: -5px;
  display: flex;
}

.home-online-services-align-b._01 {
  margin-bottom: 10px;
}

.home-online-services-link {
  color: var(--424242);
  background-image: url('../images/arrow-green.svg');
  background-position: 100% 6px;
  background-repeat: no-repeat;
  background-size: auto;
  width: 100%;
  margin-top: 10px;
  padding-right: 15px;
  line-height: 22px;
  transition: color .2s;
  display: block;
}

.home-online-services-link:hover {
  color: var(--teal);
}

.home-online-services-col {
  float: left;
  width: 50%;
  padding-left: 5px;
  padding-right: 5px;
}

.home-b {
  position: relative;
}

.home-center-line {
  background-color: var(--ccc);
  width: 1px;
  height: 100%;
  margin-left: 45%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.img {
  width: 100%;
}

.img.round {
  border-radius: 7px;
}

.home-news-slide-nav {
  height: 25px;
  padding-top: 0;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.nav-mobile-b {
  display: none;
}

.nav-link-mobile {
  float: left;
  color: var(--white);
  margin-right: 30px;
  padding: 8px 0;
  font-weight: 400;
}

.nav-link-mobile:hover {
  color: var(--light-sea-green);
}

.nav-link-mobile.w--current {
  color: var(--white);
}

.nav-link-mobile.w--current:hover {
  color: var(--light-sea-green);
}

.header-mobile-b {
  z-index: 1000;
  display: none;
  position: relative;
}

.header-public {
  z-index: 1000;
  background-color: var(--teal);
  width: 200px;
  margin-top: 105px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.top-bar-public {
  z-index: 1000;
  border-bottom: 5px solid var(--light-sea-green);
  background-color: var(--white);
  width: 100%;
  height: 105px;
  padding-top: 15px;
  padding-bottom: 15px;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.home-login-b {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 25px;
}

.field-label {
  color: var(--teal);
  flex: none;
  line-height: 22px;
}

.field-label._120 {
  width: 120px;
}

.field-label._180 {
  width: 180px;
}

.field-label.mobile-show {
  display: none;
}

.field-label._365 {
  width: 365px;
}

.txt-field {
  border: 1px solid var(--ababab);
  border-radius: 7px;
  height: 46px;
  margin-top: 5px;
  margin-bottom: 3px;
  padding: 10px 15px;
  font-size: 16px;
}

.txt-field:focus {
  border-color: var(--light-sea-green);
  font-style: normal;
}

.txt-field.bottom-margin-10 {
  margin-bottom: 10px;
}

.txt-field.no-margin {
  margin-top: 0;
  margin-bottom: 0;
}

.txt-field.hkid {
  flex: 1;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 10px;
}

.txt-field.hkid-last {
  width: 46px;
  margin: 0 10px;
}

.txt-field.event-hkid {
  flex: 1;
  width: 46px;
  margin-top: 0;
  margin-bottom: 0;
}

.txt-field.event-hkid.v-last {
  margin-left: 4px;
  margin-right: 4px;
}

.form-row {
  margin-bottom: 20px;
  position: relative;
}

.form-row.form-align {
  margin-left: -15px;
  margin-right: -15px;
}

.form-row.form-align.no-margin {
  margin-bottom: 0;
}

.form-row.pw {
  position: relative;
}

.form-row.flex {
  display: flex;
}

.form-row.form-flex-center {
  align-items: center;
  margin-left: -20px;
  margin-right: -20px;
  display: flex;
}

.form-row.summary {
  margin-bottom: 15px;
  line-height: 22px;
  display: flex;
}

.txt-light {
  font-weight: 300;
}

.btn-green {
  float: left;
  border: 1px solid var(--teal);
  background-color: var(--teal);
  color: var(--white);
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 100px;
  padding: 6px 25px;
  transition: border-color .2s, color .2s, background-color .2s;
  display: block;
}

.btn-green:hover {
  border-color: var(--light-sea-green);
  background-color: var(--light-sea-green);
  color: var(--white);
}

.btn-green._160 {
  width: 160px;
}

.btn-green.full {
  width: 100%;
}

.btn-green._230 {
  width: 230px;
}

.btn-green.eform {
  width: 180px;
  padding-left: 15px;
  padding-right: 15px;
}

.btn-green.confirm-login {
  padding-left: 20px;
  padding-right: 20px;
}

.btn-green._180 {
  width: 180px;
}

.home-login-btn-row {
  align-items: center;
  display: flex;
}

.txt-link-forgot-pw {
  color: var(--424242);
  margin-left: 30px;
  font-weight: 700;
  line-height: 22px;
  text-decoration: underline;
}

.txt-link-forgot-pw:hover {
  color: var(--teal);
}

.home-login-btn-b {
  width: 185px;
}

.inner-banner {
  width: 100%;
  position: relative;
  overflow: hidden;
}

.img-inner-banner {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 75%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  padding-top: 12.5%;
}

.img-inner-banner.login {
  background-image: url('../images/banner-login2x.jpg');
  background-position: 75%;
}

.img-inner-banner.forgot-pw {
  background-image: url('../images/banner-forgot-pw2x.jpg');
}

.img-inner-banner.news {
  background-image: url('../images/banner-news2x.jpg');
  background-position: 90%;
}

.img-inner-banner.questionnaires {
  background-image: url('../images/banner-questionnaires2x.jpg');
  background-position: 65%;
}

.img-inner-banner.highlight {
  background-image: url('../images/banner-highlight2x.jpg');
}

.img-inner-banner.notice {
  background-image: url('../images/banner-notice2x.jpg');
  background-position: 95%;
}

.img-inner-banner.dl {
  background-image: url('../images/banner-dl2x.jpg');
  background-position: 85%;
}

.img-inner-banner.privilege {
  background-image: url('../images/banner-privilege2x.jpg');
  background-position: 75%;
}

.img-inner-banner.canlendar {
  background-image: url('../images/banner-calendar2x.jpg');
  background-position: 75%;
}

.img-inner-banner.update-profile {
  background-image: url('../images/banner-update-profile2x.jpg');
  background-position: 90%;
}

.img-inner-banner.privacy {
  background-image: url('../images/banner-privacy2x.jpg');
  background-position: 85%;
}

.img-inner-banner.calculator {
  background-image: url('../images/banner-calculator2x.jpg');
  background-position: 73%;
}

.img-inner-banner.publications {
  background-image: url('../images/banner-publications2x.jpg');
  background-position: 75%;
}

.img-inner-banner.games {
  background-image: url('../images/banner-games2x.jpg');
  background-position: 75%;
}

.img-inner-banner.internal {
  background-image: url('../images/banner-internal-only2x.jpg');
  background-position: 85%;
}

.img-inner-banner.online-services {
  background-image: url('../images/banner-online-services2x.jpg');
  background-position: 80%;
}

.img-inner-banner.withdrawal-of-savings {
  background-image: url('../images/banner-withdrawal-of-savings2x.jpg');
  background-position: 55%;
}

.img-inner-banner.change-of-saving {
  background-image: url('../images/banner-change-of-saving2x.jpg');
  background-position: 85%;
}

.img-inner-banner.pw-email-records {
  background-image: url('../images/banner-pw-email-records2x.jpg');
}

.img-inner-banner.font-size {
  background-image: url('../images/banner-font-size2x.jpg');
  background-position: 90%;
}

.img-inner-banner.search-result {
  background-image: url('../images/banner-search-result2x.jpg');
}

.img-inner-banner.join-us {
  background-image: url('../images/banner-join-us2x.jpg');
  background-position: 100%;
}

.img-inner-banner.hospitalization {
  background-image: url('../images/banner-hospitalization-benefit2x.jpg');
  background-position: 85%;
}

.img-inner-banner.application-record {
  background-image: url('../images/banner-application-record2x.jpg');
}

.img-inner-banner.activities-events {
  background-image: url('../images/banner-activities-events2x.jpg');
  background-position: 50%;
}

.img-inner-banner.about-us {
  background-image: url('../images/banner-about-us2x.jpg');
}

.img-inner-banner.links {
  background-image: url('../images/banner-links2x.jpg');
}

.img-inner-banner.faqs {
  background-image: url('../images/banner-faqs2x.jpg');
  background-position: 95%;
}

.img-inner-banner.sitemap {
  background-image: url('../images/banner-sitemap2x.jpg');
}

.img-inner-banner.contact-us {
  background-image: url('../images/banner-contact-us2x.jpg');
}

.heading-b {
  z-index: 10;
  position: relative;
  top: 50%;
  transform: translate(0, -50%);
}

.heading-b.chin-ver {
  align-items: center;
  display: flex;
}

.container-900 {
  width: 100%;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.login-col-l {
  width: 55%;
  padding-right: 40px;
  position: relative;
}

.login-col-r {
  width: 50%;
}

.login-b {
  display: flex;
}

.login-btn-row {
  align-items: center;
  margin-top: 40px;
  display: flex;
}

.img-login {
  background-image: url('../images/login-img2x.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 7px;
  width: 100%;
  min-height: 390px;
}

.img-login.first {
  height: 100%;
  min-height: 0;
}

.login-attention-b {
  border: 1px solid var(--dark-cyan);
  background-color: var(--white-smoke);
  border-radius: 7px;
  width: 89%;
  margin-left: 40px;
  padding: 20px 20px 10px;
  line-height: 22px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 100%;
  right: auto;
}

.first-login-col-r {
  width: 50%;
  padding-bottom: 20px;
  position: relative;
}

.tick-box {
  border: 1px solid var(--ababab);
  background-color: var(--white);
  border-radius: 3px;
  width: 18px;
  height: 18px;
  margin-top: 5px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.tick-box.vaccine {
  width: 26px;
  height: 26px;
  margin-top: 0;
}

.tick-box-link {
  color: var(--424242);
  padding-left: 35px;
  font-weight: 300;
  position: relative;
}

.tick-box-link.red {
  color: var(--red);
}

.tick-box-link.light {
  font-weight: 300;
}

.tick-box-link.calculator {
  padding-left: 25px;
  font-weight: 400;
}

.img-tick {
  opacity: 0;
  width: 18px;
  height: 18px;
  display: block;
  position: absolute;
  top: 50%;
  bottom: auto;
  left: 50%;
  right: auto;
  transform: translate(-50%, -50%);
}

.img-tick.active {
  opacity: 1;
}

.img-tick.v-terms {
  transition: opacity .5s;
}

.tick-box-link-b {
  margin-bottom: 30px;
}

.tick-box-link-b.terms {
  margin-top: 20px;
}

.tick-confirm-b {
  color: var(--red);
  margin-left: 35px;
  font-weight: 300;
}

.top-margin-40 {
  margin-top: 40px;
}

.top-margin-40.steel-blue {
  color: var(--steel-blue);
}

.popup-forgot-pw {
  z-index: 2000;
  background-color: rgba(0, 0, 0, .6);
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
  overflow: auto;
}

.pop-content-b {
  background-color: var(--white);
  border-radius: 7px;
  width: 840px;
  padding: 40px;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.txt-red {
  color: var(--red);
}

.txt-link-bold {
  color: var(--424242);
  font-weight: 700;
  text-decoration: underline;
}

.txt-link-bold:hover {
  color: var(--teal);
}

.txt-link-bold.txt-red {
  color: var(--red);
}

.btn-b {
  float: left;
  margin-left: 20px;
  margin-right: 20px;
}

.btn-b.question {
  margin-left: 2.5%;
  margin-right: 2.5%;
}

.btn-b.online-services {
  width: 100%;
  margin-top: 10px;
  margin-left: 0;
  margin-right: 0;
}

.btn-b.eform {
  margin-left: 10px;
  margin-right: 10px;
}

.btn-b.confirm {
  margin-left: 2.5%;
  margin-right: 2.5%;
  position: relative;
}

.form-col {
  float: left;
  padding-left: 15px;
  padding-right: 15px;
}

.form-col._50 {
  width: 50%;
}

.form-col._50.margin-bottom-10 {
  margin-bottom: 15px;
}

.form-col._30 {
  width: 33.33%;
}

.form-col._60 {
  width: 66.66%;
}

.form-col._100 {
  width: 100%;
}

.forgot-pw-btn-row {
  margin-top: 35px;
}

.bottom-btn-row {
  justify-content: center;
  margin-top: 40px;
  display: flex;
  position: relative;
}

.bottom-btn-row.question {
  margin-top: 20px;
}

.bottom-btn-row.vaccine, .bottom-btn-row.vaccine-2 {
  position: relative;
}

.link-btn-b {
  border: 1px solid var(--teal);
  background-color: var(--white);
  color: var(--teal);
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 100px;
  margin-bottom: 20px;
  margin-left: 10px;
  padding: 6px 25px;
  transition: color .2s, background-color .2s;
  display: block;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.link-btn-b:hover {
  background-color: var(--teal);
  color: var(--white);
}

.link-btn-b.question {
  margin-left: 240px;
}

.news-link-row {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 20px;
  display: block;
  position: relative;
}

.paging-row {
  justify-content: center;
  width: 100%;
  margin-top: 40px;
  display: flex;
}

.paging-arrow-l {
  background-image: url('../images/arrow-paging-l.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 22px;
  height: 22px;
  display: block;
}

.paging-arrow-l:hover {
  background-image: url('../images/arrow-paging-l-hover.svg');
}

.paging-arrow-r {
  background-image: url('../images/arrow-paging-r.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 22px;
  height: 22px;
  display: block;
}

.paging-arrow-r:hover {
  background-image: url('../images/arrow-paging-r-hover.svg');
}

.paging-link {
  border: 1px solid var(--white);
  color: var(--686868);
  text-align: center;
  border-radius: 20px;
  width: 22px;
  height: 22px;
  margin-left: 7px;
  margin-right: 7px;
  font-size: 14px;
  line-height: 20px;
  display: block;
}

.paging-link:hover {
  color: var(--dark-cyan);
  font-weight: 900;
}

.paging-link.current {
  border-color: var(--dark-cyan);
  color: var(--dark-cyan);
  font-weight: 900;
}

.paging-txt-b {
  text-align: center;
  height: 22px;
  font-size: 14px;
  line-height: 22px;
}

.detail-heading-b {
  z-index: 10;
  position: relative;
}

.news-detail-col-r {
  z-index: 10;
  border: 1px solid var(--powder-blue);
  border-radius: 7px;
  flex: none;
  width: 200px;
  margin-left: 70px;
  position: relative;
  overflow: hidden;
}

.back-btn-row {
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
  padding-left: 10px;
  display: flex;
}

.btn-enlarge-b {
  justify-content: center;
  width: 200px;
  display: flex;
}

.icon-enlarge {
  z-index: 10;
  float: left;
  width: 22px;
  height: 22px;
  margin-left: 10px;
  position: relative;
}

.btn-back {
  color: var(--teal);
  letter-spacing: 1px;
  align-items: center;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
}

.btn-back:hover {
  color: var(--light-sea-green);
}

.btn-back-arrow {
  z-index: 10;
  float: left;
  width: 8px;
  height: 13px;
  margin-top: 3px;
  margin-right: 5px;
  position: relative;
}

.btn-txt-float {
  float: left;
}

.news-video-btn-b {
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
  padding-left: 10px;
}

.news-video-b {
  width: 100%;
  margin-top: 20px;
  padding-left: 10px;
}

.filer-row {
  background-color: var(--azure-2);
  width: 100%;
  margin-bottom: 40px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.txt-bold {
  font-weight: 700;
}

.filer-align-b {
  align-items: center;
  display: flex;
}

.filter-dropdown-toggle {
  z-index: 2;
  border: 1px solid var(--ccc);
  background-color: var(--white);
  border-radius: 7px;
  width: 140px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 15px;
  display: block;
  overflow: hidden;
}

.filter-dropdown-toggle:focus {
  border-color: var(--light-sea-green);
}

.arrow-dropdown {
  z-index: 1;
  background-image: url('../images/arrow-dropdown.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 46px;
  height: 46px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.arrow-dropdown.calculator {
  background-image: url('../images/arrow-dropdown.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 32px;
  height: 32px;
}

.filter-dropdown-list {
  border: 1px solid var(--ccc);
  background-color: var(--white);
  border-radius: 7px;
  margin-top: -1px;
  overflow: hidden;
}

.filter-dropdown {
  margin-left: 15px;
  display: block;
}

.filter-dropdown-link {
  padding-left: 15px;
}

.filter-dropdown-link:hover {
  background-color: var(--azure-2);
}

.scroll-b {
  overflow: auto;
}

.scroll-b.filter {
  height: 230px;
}

.scroll-b.savings {
  height: 160px;
}

.scroll-b.loan {
  height: 368px;
}

.scroll-b.newsletter {
  padding: 20px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.scroll-b.pw {
  margin-bottom: 20px;
}

.scroll-b.join-us {
  max-height: 230px;
}

.question-col-l {
  z-index: 10;
  border: 1px solid var(--powder-blue);
  border-radius: 7px;
  flex: none;
  order: -1;
  width: 220px;
  margin-right: 20px;
  position: relative;
  overflow: hidden;
}

.question-col-r {
  flex: 1;
  order: 1;
}

.question-link-row {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 20px;
  display: block;
  position: relative;
}

.question-detail-col-l {
  flex: none;
  width: 30%;
  margin-right: 20px;
}

.question-detail-img-b {
  z-index: 1;
  border: 1px solid var(--powder-blue);
  border-radius: 7px;
  flex: none;
  order: -1;
  width: 100%;
  margin-bottom: 20px;
  position: relative;
  overflow: hidden;
}

.question-deatil-col-r {
  flex: 1;
}

.question-detail-align-b {
  display: flex;
}

.question-detail-grey-b {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  padding: 20px;
}

.margin-10 {
  margin-bottom: 10px;
}

.question-name-row {
  margin-top: 15px;
  margin-bottom: 20px;
}

.question-name-col {
  float: left;
  margin-bottom: 10px;
}

.question-name-col.left {
  margin-right: 20px;
}

.question-txt-field {
  border-style: none none solid;
  border-width: 1px;
  border-color: black black var(--dark-cyan);
  background-color: rgba(0, 0, 0, 0);
  border-radius: 0;
  min-width: 160px;
  height: 26px;
  margin-bottom: 0;
  margin-left: 5px;
  padding: 0;
  font-size: 16px;
}

.question-txt-field:focus {
  border-bottom-color: var(--teal);
}

.question-align-b {
  display: flex;
}

.question-q-b {
  align-items: center;
  display: flex;
  position: relative;
}

.question-no {
  background-color: var(--dark-cyan);
  color: var(--white);
  text-align: center;
  border-radius: 26px;
  flex: none;
  width: 26px;
  height: 26px;
  margin-right: 10px;
  font-weight: 700;
  line-height: 26px;
}

.question-detail-b {
  margin-bottom: 20px;
}

.question-ans-b {
  padding-left: 36px;
}

.question-ans-b.multi {
  margin-top: 5px;
}

.txt-area {
  border: 1px solid var(--ababab);
  border-radius: 7px;
  min-height: 98px;
  margin-top: 5px;
  margin-bottom: 3px;
  padding: 10px 15px;
  font-size: 16px;
}

.txt-area:focus {
  border-color: var(--light-sea-green);
}

.radio-btn-field {
  align-items: flex-start;
  margin-top: 10px;
  padding-left: 0;
  display: flex;
}

.radio-btn-field.join-us {
  margin-top: 0;
  margin-left: 40px;
}

.radio-btn-field.e-form {
  margin-top: 0;
  margin-left: 20px;
}

.radio-btn-field.v-join-time {
  display: flex;
}

.radio-btn {
  border-color: var(--ababab);
  background-color: var(--white);
  flex: none;
  width: 18px;
  height: 18px;
  margin-top: 0;
  margin-left: 0;
  margin-right: 10px;
}

.radio-btn.w--redirected-checked {
  border-width: 1px;
  border-color: var(--ababab);
  background-image: url('../images/circle.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
}

.radio-btn-label {
  float: left;
  flex: 1;
  line-height: 18px;
}

.failed-txt-b {
  color: var(--red);
  text-align: center;
  margin-top: 20px;
  margin-bottom: -20px;
  font-weight: 300;
  line-height: 22px;
}

.failed-txt-b.join-us {
  text-align: left;
  display: block;
}

.failed-txt-b.hospitalization {
  text-align: left;
  margin-bottom: 0;
}

.thank-txt-b {
  color: var(--teal);
  text-align: center;
  margin-top: 40px;
  font-size: 22px;
  line-height: 28px;
}

.thank-txt-b.chi {
  padding-left: 40px;
  padding-right: 40px;
  font-size: 20px;
}

.txt-link-red {
  color: var(--red);
}

.txt-link-red:hover {
  color: var(--black);
}

.highlight-col-r {
  z-index: 10;
  border: 1px solid var(--powder-blue);
  border-radius: 7px;
  flex: none;
  width: 185px;
  margin-left: 20px;
  position: relative;
  overflow: hidden;
}

.highlight-slider-b {
  margin-top: 40px;
  margin-bottom: 60px;
}

.highlight-slider {
  background-color: rgba(0, 0, 0, 0);
  width: 700px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

.arrow-l-green {
  opacity: .75;
  background-image: url('../images/arrow-l-green.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 20px;
  margin-left: -40px;
  transition: opacity .2s;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.arrow-l-green:hover {
  opacity: 1;
}

.arrow-r-green {
  opacity: .75;
  background-image: url('../images/arrow-r-green.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 20px;
  margin-right: -40px;
  transition: opacity .2s;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.arrow-r-green:hover {
  opacity: 1;
}

.highlight-slide {
  z-index: 10;
  border: 1px solid var(--powder-blue);
  border-radius: 7px;
  width: 700px;
  overflow: hidden;
}

.slide-nav {
  height: 30px;
  margin-bottom: -40px;
  padding-top: 0;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.notice-link-row {
  margin-bottom: 20px;
  display: block;
  position: relative;
}

.list-item {
  margin-top: 10px;
  display: flex;
}

.list-item.sub {
  margin-top: 5px;
  margin-left: 35px;
}

.list-item.title {
  margin-bottom: -10px;
}

.list-item.v-agm-footnote {
  margin-top: 5px;
  margin-bottom: 5px;
}

.list-no {
  flex: none;
  width: 40px;
}

.list-txt-col.bullet {
  background-image: url('../images/bullet.svg');
  background-position: 0 10px;
  background-repeat: no-repeat;
  background-size: 6px;
  padding-left: 16px;
}

.list {
  margin-top: 10px;
  line-height: 24px;
}

.list.game, .list.internal {
  margin-top: -10px;
  margin-bottom: 40px;
}

.list.no-top-margin {
  margin-top: -10px;
}

.dl-b {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 40px;
  margin-bottom: 40px;
  padding-top: 20px;
  padding-bottom: 5px;
  display: flex;
}

.icon-link {
  color: var(--teal);
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 0%;
  background-repeat: no-repeat;
  background-size: auto 26px;
  justify-content: flex-start;
  align-items: center;
  min-height: 26px;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 36px;
  font-weight: 700;
  line-height: 22px;
}

.icon-link:hover {
  color: var(--light-sea-green);
}

.icon-link.dl {
  background-image: url('../images/icon-dl.svg');
}

.icon-link.dl:hover {
  background-image: url('../images/icon-dl-hover.svg');
}

.icon-link.save {
  background-image: url('../images/icon-save.svg');
  margin-right: 20px;
}

.icon-link.save:hover {
  background-image: url('../images/icon-save-hover.svg');
}

.icon-link.print {
  background-image: url('../images/icon-print.svg');
}

.icon-link.print:hover {
  background-image: url('../images/icon-print-hover.svg');
}

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

.icon-link.pw:hover {
  background-image: url('../images/icon-pw-hover.svg');
}

.dl-align-b {
  flex-wrap: wrap;
  width: 50%;
  margin-bottom: 15px;
  padding-left: 20px;
  padding-right: 20px;
}

.enlarge-img-b {
  width: 900px;
  margin: 100px auto;
  position: relative;
}

.btn-close {
  background-image: url('../images/btn-close.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 40px;
  height: 40px;
  margin-top: -40px;
  margin-right: -40px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.btn-close:hover {
  background-image: url('../images/btn-close-hover.svg');
}

.table-title-row {
  background-color: var(--dark-cyan);
  color: var(--white);
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
  align-items: stretch;
  font-size: 22px;
  font-weight: 700;
  line-height: 24px;
  display: flex;
}

.table-title-row.no-round {
  border-radius: 0;
}

.table-title-row.no-round.sky-blue {
  background-color: var(--light-sky-blue);
}

.table-title-row.steel-blue {
  background-color: var(--steel-blue);
}

.table-col {
  float: left;
  padding: 15px;
}

.table-col._43 {
  text-align: left;
  width: 43%;
}

.table-col._13 {
  width: 13%;
}

.table-col._15 {
  width: 15%;
}

.table-col._31 {
  text-align: left;
  width: 31%;
}

.table-col._30 {
  width: 30%;
}

.table-col._20 {
  justify-content: center;
  width: 20%;
  display: flex;
}

.table-col._24 {
  width: 24%;
}

.table-col._24.align-center {
  justify-content: center;
  display: flex;
}

.table-col._22 {
  width: 22%;
}

.table-col.align-center {
  justify-content: center;
  display: flex;
}

.table-col.date {
  width: 33.33%;
}

.table-col.post {
  width: 30%;
}

.table-col.details {
  width: 36.67%;
}

.table-row {
  align-items: center;
  width: 100%;
  display: flex;
}

.table-row.green {
  background-color: var(--white-smoke);
}

.table-row.grey {
  background-color: var(--eee);
}

.txt-link {
  color: var(--424242);
}

.txt-link:hover {
  color: var(--teal);
}

.icon-dl {
  z-index: 10;
  float: left;
  width: 16px;
  height: 16px;
  margin-left: 10px;
  position: relative;
}

.table {
  text-align: center;
  min-width: 900px;
  overflow: hidden;
}

.table.align-left {
  text-align: left;
}

.table.vaccine {
  min-width: 550px;
}

.table-title-col {
  float: left;
  flex-direction: column;
  justify-content: center;
  align-self: stretch;
  align-items: center;
  padding: 15px;
  display: flex;
}

.table-title-col._43 {
  width: 43%;
}

.table-title-col._15 {
  width: 15%;
}

.table-title-col._31 {
  width: 31%;
}

.table-title-col._30 {
  width: 30%;
}

.table-title-col._20 {
  width: 20%;
}

.table-title-col._24 {
  width: 24%;
}

.table-title-col.line {
  border-left: 1px solid var(--white);
}

.table-title-col._22 {
  width: 22%;
}

.table-title-col._13 {
  width: 13%;
}

.table-title-col.date {
  width: 33.33%;
}

.table-title-col.post {
  width: 30%;
}

.table-title-col.details {
  width: 36.67%;
}

.calendar-col-l {
  border: 1px solid var(--teal);
  border-radius: 7px;
  flex: none;
  width: 500px;
  margin-right: 40px;
  overflow: hidden;
}

.calendar-align-b {
  display: flex;
}

.calendar-col-r {
  flex: 1;
}

.calendar-dot-row {
  align-items: center;
  margin-bottom: 15px;
  display: flex;
}

.calendar-dot {
  border: 2px solid var(--dark-cyan);
  background-color: var(--azure);
  border-radius: 20px;
  flex: none;
  width: 20px;
  height: 20px;
  margin-right: 10px;
}

.calendar-date-row {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 15px;
}

.txt-link-green-bold {
  color: var(--teal);
  font-weight: 700;
  text-decoration: underline;
}

.txt-link-green-bold:hover {
  color: var(--light-sea-green);
}

.txt-underline {
  text-decoration: underline;
}

.flex-align {
  display: flex;
}

.left-margin-10 {
  margin-left: 10px;
}

.change-email-b {
  align-items: center;
  height: 46px;
  margin-top: 31px;
  display: flex;
}

.post-division-col-l {
  float: left;
  color: var(--teal);
  font-weight: 300;
}

.post-division-col-r {
  float: left;
  margin-left: 10px;
}

.post-division-row {
  margin-left: -20px;
  margin-right: -20px;
  display: flex;
}

.post-division-col {
  padding-left: 20px;
  padding-right: 20px;
}

.list-assumption {
  flex: none;
  width: 130px;
}

.tab {
  color: var(--686868);
  text-align: center;
  background-color: rgba(0, 0, 0, 0);
  border-bottom: 5px solid rgba(0, 0, 0, 0);
  flex: none;
  padding: 0 10px 10px;
  font-size: 22px;
  line-height: 28px;
}

.tab.w--current {
  border-bottom-width: 5px;
  border-bottom-color: var(--light-sea-green);
  color: var(--teal);
  background-color: rgba(0, 0, 0, 0);
  font-weight: 700;
}

.tab.about-our-union {
  width: 50%;
}

.tab.structure, .tab.history {
  width: 33.33%;
}

.tab.about-our-website {
  width: 50%;
}

.tab.vision, .tab.dividend, .tab.savings, .tab.loan-interest {
  width: 33.33%;
}

.tab.ebanking, .tab.application-of-welfare-benefits, .tab.application-of-activities-events, .tab.update-profile {
  width: 25%;
  font-size: 18px;
  line-height: 24px;
}

.tab-pane {
  padding-top: 20px;
}

.tabs-line {
  background-color: var(--ccc);
  height: 1px;
  margin-top: 40px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.tabs-line.online-servoces {
  max-width: 1300px;
  margin-top: 56px;
  margin-left: auto;
  margin-right: auto;
  left: 20px;
  right: 20px;
}

.tabs {
  z-index: 10;
}

.tabs-b {
  position: relative;
}

.tab-col-l, .tab-col-r {
  width: 100%;
}

.calculator-field-b {
  width: 100%;
  padding-left: 45px;
  padding-right: 25px;
}

.left-txt-b {
  margin-top: 10px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.calculator-col-l {
  float: left;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 60%;
  height: 46px;
  padding-right: 20px;
  line-height: 22px;
  display: flex;
}

.calculator-col-l.savings {
  height: auto;
}

.calculator-col-l.loan-interest {
  justify-content: flex-start;
  width: 40%;
  padding-top: 10px;
}

.calculator-col-l._40 {
  width: 40%;
}

.calculator-col-r {
  float: left;
  width: 40%;
  position: relative;
}

.calculator-col-r.loan-interest {
  flex-direction: column;
  align-items: flex-end;
  width: 60%;
  padding-top: 10px;
  padding-bottom: 5px;
  display: flex;
}

.calculator-col-r._60 {
  width: 60%;
}

.calculator-row {
  align-items: flex-start;
  margin-bottom: 15px;
  display: flex;
}

.right-txt-b {
  margin-top: 10px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.calculator-form-b {
  margin-top: 20px;
  margin-bottom: 0;
}

.calculator-btn-row {
  margin-top: 40px;
  margin-left: -20px;
}

.superscript {
  margin-left: 2px;
  margin-right: 2px;
  font-size: 14px;
  line-height: 14px;
  display: inline-block;
  transform: translate(0, -5px);
}

.calculator-remark-b {
  border-top: 1px solid var(--ccc);
  margin-top: 20px;
  padding-top: 20px;
}

.bottom-margin-10 {
  margin-bottom: 10px;
}

.tab-align-b {
  padding-top: 20px;
}

.calculator-img-dividend {
  background-image: url('../images/calculator-dividend2x.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  display: none;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.calculator-result-dividend {
  z-index: 10;
  border: 1px solid var(--dark-cyan);
  background-color: var(--white);
  border-radius: 7px;
  height: auto;
  margin-top: 40px;
  display: none;
  overflow: hidden;
}

.calculator-result-top-bar {
  background-color: var(--dark-cyan);
  color: var(--white);
  text-align: center;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}

.calculator-result-content-b {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  padding: 20px 20px 25px;
  display: flex;
}

.calculator-result-txt {
  color: var(--teal);
  margin-top: 10px;
  font-size: 22px;
  font-weight: 700;
}

.tabs-menu {
  width: 100%;
  display: flex;
}

.tabs-menu.online-servces {
  max-width: 1380px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.calculator-img-savings {
  background-image: url('../images/calculator-savings2x.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  display: none;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.calculator-result-savings {
  border: 1px solid var(--dark-cyan);
  background-color: var(--white);
  border-radius: 7px;
  margin-top: 40px;
  display: none;
  overflow: hidden;
}

.calculator-dropdown-link {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
}

.calculator-dropdown-link:hover {
  background-color: var(--azure-2);
}

.savings-dropdown {
  margin-left: 10px;
  margin-right: 5px;
  display: block;
}

.savngs-dropdown-toggle {
  border: 1px solid var(--ababab);
  background-color: var(--white);
  border-radius: 7px;
  width: 120px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  display: block;
}

.calculator-filter-col {
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  margin-right: 10px;
  display: flex;
}

.calculator-filter-row {
  margin-top: 5px;
  display: flex;
}

.savings-dropdown-list {
  border: 1px solid var(--ababab);
  background-color: var(--white);
  border-radius: 7px;
  margin-top: -1px;
  overflow: hidden;
}

.loan-dropdown {
  display: block;
}

.loan-dropdown-toggle {
  border: 1px solid var(--ababab);
  background-color: var(--white);
  border-radius: 7px;
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 15px;
  display: block;
}

.loan-dropdown-list {
  border: 1px solid var(--ababab);
  background-color: var(--white);
  border-radius: 7px;
  margin-top: -1px;
  overflow: hidden;
}

.padding-field-b {
  width: 100%;
  padding-left: 45px;
}

.padding-field-b.right-margin {
  padding-right: 55px;
}

.loan-tick-box {
  float: left;
  margin-right: 25px;
}

.loan-tick-box.last {
  margin-right: 0;
}

.calculator-img-loan {
  background-image: url('../images/calculator-loan2x.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 66.66%;
  display: none;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.calculator-result-loan {
  z-index: 10;
  border: 1px solid var(--dark-cyan);
  background-color: var(--white);
  border-radius: 7px;
  height: auto;
  margin-top: 40px;
  display: none;
  overflow: hidden;
}

.loan-result-col-r {
  color: var(--teal);
  text-align: right;
  flex: none;
  width: 175px;
  margin-left: 10px;
  padding-right: 70px;
  line-height: 22px;
  position: relative;
}

.loan-result-col-l {
  text-align: right;
  padding-left: 20px;
  line-height: 22px;
  position: relative;
}

.loan-result-row {
  justify-content: flex-end;
  margin-bottom: 5px;
  display: flex;
}

.loan-result-row.result {
  border-top: 1px solid var(--686868);
  margin-bottom: 30px;
  padding-top: 5px;
}

.loan-symbol {
  text-align: center;
  width: 12px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.loan-result-underline {
  border-top: 1px solid var(--686868);
  border-bottom: 1px solid var(--686868);
  height: 5px;
  margin-bottom: -10px;
  margin-right: 70px;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.loan-result-b {
  margin-bottom: -25px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
  display: inline-block;
}

.txt-loan-interest {
  margin-right: 10px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.calculator-result-loan-b {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  padding-top: 20px;
  padding-bottom: 25px;
}

.heading-subtitle {
  color: var(--686868);
  margin-top: 6px;
  margin-left: 10px;
  font-size: 22px;
  font-weight: 300;
}

.publications-col-l {
  flex-direction: column;
  justify-content: space-between;
  width: 60%;
  padding-right: 20px;
  display: flex;
}

.publications-col-r {
  border-left: 1px solid var(--ccc);
  flex: none;
  width: 40%;
  padding-left: 20px;
}

.publications-b {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 25px;
  display: flex;
}

.newsletter-link-col {
  float: left;
  width: 33.33%;
  padding-left: 10px;
  padding-right: 10px;
}

.newsletter-link {
  color: var(--black);
  width: 100%;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  transition: color .2s;
  display: block;
}

.newsletter-link:hover {
  color: var(--light-sea-green);
}

.newsletter-img-b {
  z-index: 10;
  border: 1px solid var(--powder-blue);
  border-radius: 7px;
  margin-bottom: 10px;
  position: relative;
  overflow: hidden;
}

.newsletter-align-b {
  margin-bottom: 20px;
  margin-left: -10px;
  margin-right: -10px;
}

.newsletter-txt-b {
  padding-right: 20px;
}

.newsletter-list-b {
  border: 1px solid var(--dark-cyan);
  background-color: var(--f7f7f7);
  border-radius: 7px;
  flex-direction: column;
  flex: 1;
  position: relative;
  overflow: hidden;
}

.newsletter-txt-link {
  color: var(--424242);
  margin-bottom: 10px;
  font-weight: 700;
  transition: color .2s;
  display: flex;
}

.newsletter-txt-link:hover {
  color: var(--light-sea-green);
}

.newsletter-date-b {
  flex: none;
  width: 50px;
}

.text-block {
  color: var(--teal);
  font-size: 15px;
  font-weight: 400;
}

.newsletter-link-row {
  margin-top: 20px;
  display: block;
  position: relative;
}

.newsletter-b {
  flex: none;
}

.annual-link-col {
  float: left;
  width: 12.5%;
  margin-bottom: 40px;
  padding-left: 10px;
  padding-right: 10px;
}

.annual-link {
  color: var(--black);
  text-align: center;
  width: 100%;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  transition: color .2s;
  display: block;
}

.annual-link:hover {
  color: var(--light-sea-green);
}

.annual-img-b {
  z-index: 10;
  border: 1px solid var(--powder-blue);
  border-radius: 7px;
  margin-bottom: 5px;
  position: relative;
  overflow: hidden;
}

.annual-b {
  flex-wrap: wrap;
  margin-bottom: -40px;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.games-content-b {
  z-index: 10;
  width: 65%;
  position: absolute;
  top: 50%;
  bottom: auto;
  left: 0%;
  right: auto;
  transform: translate(0, -50%);
}

.games-b {
  background-image: url('../images/games-img2x.jpg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  min-height: 400px;
  position: relative;
}

.games-title-b {
  border-left: 3px solid var(--teal);
  color: var(--424242);
  margin-top: 20px;
  margin-bottom: 20px;
  padding-left: 7px;
  display: block;
}

.header-chinese {
  z-index: 1000;
  background-color: var(--teal);
  width: 200px;
  margin-top: 105px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.heading-chi {
  font-size: 30px;
  font-weight: 700;
}

.list-left-col {
  color: var(--teal);
  flex: none;
  width: 120px;
  font-weight: 700;
}

.games-detail-grey-b {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  padding: 40px;
}

.top-bar-chinese {
  z-index: 1000;
  border-bottom: 5px solid var(--light-sea-green);
  background-color: var(--white);
  width: 100%;
  height: 105px;
  padding-top: 15px;
  padding-bottom: 15px;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.games-txt-b {
  width: 400px;
}

.txt-link-black {
  color: var(--424242);
}

.txt-link-black:hover {
  color: var(--light-sea-green);
}

.games-expired-b {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  width: 90%;
  padding: 40px;
}

.tab-txt-b {
  flex-direction: column;
  justify-content: center;
  height: 44px;
  display: flex;
}

.online-services-align-b {
  flex-wrap: wrap;
  margin-left: -10px;
  margin-right: -10px;
  padding-bottom: 20px;
  display: flex;
}

.online-services-link-col {
  width: 33.33%;
  margin-bottom: 20px;
  padding-left: 10px;
  padding-right: 10px;
}

.online-services-link {
  background-color: var(--white-smoke);
  color: var(--424242);
  border-radius: 7px;
  width: 100%;
  height: 100px;
  padding: 10px 20px 10px 10px;
  line-height: 24px;
  transition: background-color .2s, color .2s;
  display: flex;
}

.online-services-link:hover {
  background-color: var(--light-sea-green);
  color: var(--white);
}

.online-services-link.white {
  border: 1px solid var(--eee);
  background-color: var(--white);
}

.online-services-link.white:hover {
  background-color: var(--light-sea-green);
}

.online-services-img-b {
  z-index: 10;
  border-radius: 3px;
  flex: none;
  order: -1;
  width: 80px;
  height: 80px;
  margin-right: 10px;
  position: relative;
  overflow: hidden;
}

.online-services-link-txt-b {
  float: left;
  flex: 1;
  align-self: center;
}

.online-services-arrow {
  z-index: 10;
  float: left;
  width: 12px;
  height: 20px;
  margin-top: 1px;
  margin-left: 40px;
  position: relative;
  top: 50%;
  transform: translate(0, -50%);
}

.txt-mobile {
  display: none;
}

.online-services-temp-b {
  background-color: var(--f7f7f7);
  margin-top: -20px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.online-services-temp-txt-b {
  color: var(--red);
  padding-left: 10px;
  font-weight: 300;
}

.breadcrumb-b {
  color: var(--686868);
  margin-bottom: 5px;
  font-size: 16px;
  line-height: 20px;
}

.breadcrumb-txt-link {
  float: left;
  color: var(--686868);
}

.breadcrumb-txt-link:hover {
  color: var(--dark-cyan);
}

.arrow-breadcrumb {
  float: left;
  background-image: url('../images/arrow-breadcrumb.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  width: 22px;
  height: 19px;
}

.breadcrumb-txt {
  float: left;
}

.popup {
  z-index: 2000;
  background-color: rgba(0, 0, 0, .6);
  display: none;
  position: fixed;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
  overflow: auto;
}

.btn-confirm {
  z-index: 1;
  border: 1px solid var(--teal);
  background-color: var(--teal);
  opacity: 0;
  color: var(--white);
  text-align: center;
  letter-spacing: 1px;
  border-radius: 100px;
  padding: 6px 25px;
  transition: border-color .2s, color .2s, background-color .2s;
  display: none;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.btn-confirm:hover {
  border-color: var(--light-sea-green);
  background-color: var(--light-sea-green);
  color: var(--white);
}

.btn-confirm._220 {
  width: 220px;
}

.btn-confirm._270 {
  width: 270px;
}

.online-services-detail-heading-b {
  margin-top: 15px;
}

.online-services-b {
  border: 1px solid var(--powder-blue);
  border-radius: 7px;
  padding: 20px 25px 25px;
}

.online-services-col-l {
  flex: none;
  width: 55%;
  padding-right: 25px;
}

.online-services-col-r {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 3px;
  flex: 1;
  min-height: 330px;
}

.online-services-col-r.withdrawal-of-savings {
  background-image: url('../images/online-services-withdrawal-of-savings-img2x.jpg');
}

.online-services-col-r.change-of-savings {
  background-image: url('../images/online-services-change-of-saving-img2x.jpg');
}

.online-services-col-r.hospitalization {
  background-image: url('../images/online-services-hospitalization-benefit-img2x.jpg');
}

.online-services-detail-b {
  display: flex;
}

.online-services-field-b {
  width: 100%;
  padding-left: 45px;
}

.online-services-dollar-row {
  margin-top: 5px;
  position: relative;
}

.online-services-btn-b {
  flex-direction: column-reverse;
  justify-content: center;
  margin-top: -5px;
  display: flex;
}

.pop-confirm-b {
  background-color: var(--white);
  border-radius: 7px;
  width: 450px;
  padding: 40px;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.print-b {
  margin-top: 40px;
  margin-bottom: -30px;
}

.calculator-print-b {
  margin-bottom: 7px;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.pw-align-b {
  flex-wrap: wrap;
  width: 20%;
  margin-bottom: 15px;
  padding-right: 20px;
}

.pw-b {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 5px;
  margin-bottom: 20px;
  padding: 20px 20px 5px;
  display: flex;
}

.pw-notes-b {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 20px;
}

.font-size-underline-b {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 10px;
}

.font-size-b {
  line-height: 22px;
}

.bottom-margin-20 {
  margin-bottom: 20px;
}

.container-780 {
  width: 100%;
  max-width: 780px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
  padding-right: 20px;
}

.search-result-content-b {
  padding-left: 20px;
  padding-right: 20px;
}

.search-result-b {
  background-color: var(--f7f7f7);
  color: var(--teal);
  border-radius: 7px;
  justify-content: space-between;
  margin-bottom: 20px;
  padding: 15px 20px;
  font-size: 22px;
  font-weight: 700;
  display: flex;
}

.search-result-col-r {
  flex: none;
  order: 1;
}

.radio-align-row {
  float: left;
  align-items: center;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.dropdown {
  display: block;
}

.dropdown-toggle {
  z-index: 2;
  border: 1px solid var(--ccc);
  background-color: var(--white);
  border-radius: 7px;
  margin-top: 5px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 15px;
  display: block;
  overflow: hidden;
}

.dropdown-toggle:focus {
  border-color: var(--light-sea-green);
}

.dropdown-list {
  border: 1px solid var(--ccc);
  background-color: var(--white);
  border-radius: 7px;
  width: 100%;
  margin-top: -1px;
  overflow: hidden;
}

.join-us-b {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-bottom: 20px;
}

.left-margin-40 {
  margin-left: 40px;
}

.radio-flex-b {
  align-items: center;
  display: flex;
}

.join-us-btn-b {
  margin-top: 40px;
}

.arrow-white-bg {
  z-index: 1;
  background-color: var(--white);
  width: 46px;
  height: 46px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.top-margin-20 {
  margin-top: 20px;
}

.align-justify {
  text-align: justify;
}

.txt-link-green {
  color: var(--teal);
}

.txt-link-green:hover {
  color: var(--light-sea-green);
}

.hospitalization-b {
  border-top: 1px solid var(--ccc);
  margin-top: 20px;
  padding-top: 20px;
}

.left-margin-20 {
  margin-left: 20px;
}

.eform-btn-b {
  justify-content: center;
  margin-top: 40px;
  display: flex;
}

.eform-btn-row {
  display: flex;
}

.radio-align-eform {
  align-items: center;
  padding-right: 20px;
  display: flex;
}

.hospitalization-upload-btn-b {
  justify-content: center;
  margin-top: 40px;
  display: flex;
}

.upload-col-l {
  float: left;
  width: 50%;
  padding-right: 20px;
  display: flex;
}

.upload-col-r {
  float: left;
  width: 50%;
  padding-left: 20px;
  display: flex;
}

.upload-col-r.full {
  float: none;
  width: 100%;
  margin-bottom: 20px;
  padding-left: 0;
}

.upload-link-b {
  border: 1px solid var(--powder-blue);
  background-color: var(--white);
  color: var(--teal);
  text-align: center;
  border-radius: 7px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 270px;
  font-size: 18px;
  position: relative;
}

.upload-link-b:hover {
  background-color: var(--white-smoke);
}

.upload-b {
  margin-bottom: 20px;
  display: flex;
}

.icon-upload {
  width: 50px;
  height: 50px;
  margin-bottom: 15px;
}

.upload-list-b {
  flex-direction: row;
  align-items: flex-start;
  margin-left: 5px;
  margin-right: 5px;
  padding-top: 10px;
  padding-bottom: 5px;
  display: flex;
}

.upload-link-row {
  z-index: 2;
  background-color: var(--white);
  color: var(--424242);
  border-radius: 3px;
  align-self: stretch;
  width: 50%;
  min-height: 46px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 5px;
  padding-bottom: 15px;
  padding-left: 15px;
  padding-right: 15px;
  display: block;
  position: relative;
  overflow: hidden;
}

.upload-row {
  background-color: var(--white);
  color: var(--424242);
  border-radius: 3px;
  width: 100%;
  height: 46px;
  margin-bottom: 5px;
  padding-left: 15px;
  padding-right: 15px;
  overflow: hidden;
}

.upload-txt-b {
  flex: none;
}

.upload-align-b {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  min-height: 26px;
  margin-top: 10px;
  margin-bottom: 10px;
  padding-right: 20px;
  position: relative;
  overflow: hidden;
}

.hospitalization-del-b {
  z-index: 1;
  background-color: var(--white);
  flex: none;
  width: 46px;
  height: 46px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.upload-grey-b {
  background-color: var(--eee);
  border-radius: 7px;
  width: 100%;
}

.attention-b {
  border-top: 1px solid var(--ccc);
  padding-top: 15px;
}

.top-margin-10 {
  margin-top: 10px;
}

.table-last-row {
  background-color: var(--dark-cyan);
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  width: 100%;
  height: 5px;
}

.table-last-row.steel-blue {
  background-color: var(--steel-blue);
}

.footer-padding-b {
  margin-top: 30px;
  font-size: 16px;
}

.vaccine-top-col-r {
  color: var(--teal);
  flex-direction: column;
  order: 1;
  align-self: center;
  align-items: flex-end;
  padding-left: 10px;
  font-size: 14px;
  line-height: 18px;
}

.top-bar-vaccine {
  z-index: 1000;
  border-bottom: 5px solid var(--light-sea-green);
  background-color: rgba(0, 0, 0, 0);
  background-image: url('../images/bg-vaccine1.5x.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  align-items: center;
  width: 100%;
  height: 105px;
  padding-top: 15px;
  padding-bottom: 15px;
  display: flex;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.table-padding-b {
  padding-left: 20px;
  padding-right: 20px;
}

.table-padding-b.vaccine {
  padding-left: 60px;
  padding-right: 60px;
}

.padding-b {
  padding-left: 20px;
  padding-right: 20px;
}

.padding-60 {
  padding-left: 60px;
  padding-right: 60px;
}

.table-col-l {
  align-self: center;
  width: 70%;
}

.table-col-l.vaccine-game-1 {
  width: 100%;
}

.table-content-b {
  display: flex;
}

.bottom-margin-40 {
  margin-bottom: 40px;
}

.question-grey-b {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  margin-bottom: 20px;
  padding: 40px 40px 20px;
  position: relative;
}

.question-grey-b.finished {
  margin-top: 20px;
  margin-bottom: 0;
}

.question-grey-b.top-small {
  padding-top: 20px;
}

.question-grey-b.special-event-finish {
  margin-top: 20px;
  margin-bottom: 0;
  padding-top: 80px;
}

.txt-normal {
  font-weight: 400;
}

.step-b {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: var(--light-sea-green);
  color: var(--white);
  border-radius: 3px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  margin-top: 20px;
  margin-right: 20px;
  padding: 5px 10px;
  font-weight: 700;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.fail-txt-b {
  float: left;
  color: var(--red);
  width: 100%;
  margin-top: 10px;
  padding-left: 20px;
  padding-right: 20px;
  font-weight: 300;
  line-height: 22px;
}

.fail-txt-b.vaccine-game {
  font-size: 20px;
  line-height: 24px;
}

.txt-question {
  flex: none;
}

.question-txt-field-grey {
  border-style: none none solid;
  border-width: 1px;
  border-color: black black var(--ababab);
  background-color: rgba(0, 0, 0, 0);
  border-radius: 0;
  height: 26px;
  margin-bottom: 0;
  margin-left: 5px;
  padding: 0;
  font-size: 16px;
}

.question-txt-field-grey:focus {
  border-bottom-color: var(--teal);
}

.txt-field-b {
  margin-top: 5px;
  margin-bottom: 3px;
  position: relative;
}

.txt-field-b.hkid {
  align-items: center;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.vaccine-form-b {
  margin-bottom: 20px;
  padding-left: 35px;
  display: none;
}

.vaccine-form-b.open {
  display: block;
}

.btn-dim {
  border: 1px solid var(--teal);
  background-color: var(--teal);
  opacity: .5;
  color: var(--white);
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 100px;
  padding: 6px 25px;
  display: block;
}

.btn-dim._220 {
  width: 220px;
}

.btn-dim._300 {
  width: 300px;
}

.btn-dim._160 {
  width: 160px;
}

.btn-dim._180 {
  width: 180px;
}

.btn-txt-seconds {
  padding-left: 5px;
  display: none;
}

.btn-seconds {
  padding-left: 5px;
}

.vaccine-thank-txt-b {
  color: var(--teal);
  margin-bottom: 20px;
}

.vaccine-txt-b.v-finish {
  padding-right: 80px;
}

.upload-link-align-b {
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
}

.activities-col-l {
  float: left;
  width: 35%;
  padding-right: 20px;
}

.activities-col-r {
  float: left;
  width: 65%;
}

.activities-content-b {
  border-left: 3px solid var(--teal);
  margin-bottom: 20px;
  padding-left: 7px;
}

.activities-grey-b {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  width: 100%;
  padding: 40px;
}

.activities-step-row {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  width: 100%;
  margin-bottom: 40px;
  padding: 20px;
}

.activities-step-col {
  float: left;
  flex-direction: column;
  align-items: center;
  width: 20%;
  position: relative;
}

.activities-circle-b {
  z-index: 2;
  color: var(--white);
  text-align: center;
  background-image: url('../images/activities-circle-grey.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 26px;
  width: 40px;
  height: 40px;
  margin-bottom: 5px;
  font-weight: 700;
  line-height: 40px;
  position: relative;
  left: 50%;
  transform: translate(-50%);
}

.activities-circle-b.current {
  background-image: url('../images/activities-circle-green.svg');
  background-size: 40px;
  font-size: 24px;
}

.activities-circle-b.finished {
  background-image: url('../images/activities-circle-green.svg');
}

.activities-step-txt-b {
  color: var(--ababab);
  text-align: center;
  justify-content: center;
  align-items: center;
  height: 40px;
  font-size: 16px;
  line-height: 20px;
  display: flex;
}

.activities-step-txt-b.current, .activities-step-txt-b.finished {
  color: var(--teal);
  font-weight: 700;
}

.must-b {
  order: -1;
  margin-top: 7px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.no-bottom-margin {
  margin-bottom: 0;
}

.activities-line {
  background-color: var(--ddd);
  width: 100%;
  height: 4px;
  margin-top: 18px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 50%;
  right: 0%;
}

.activities-line.green {
  background-color: var(--powder-blue);
}

.txt-black {
  color: var(--black);
}

.activities-map-img {
  border: 1px solid var(--ababab);
  margin-bottom: 5px;
  display: block;
}

.activities-underline-b {
  border-top: 1px solid var(--ccc);
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 20px;
  padding-top: 20px;
}

.bottom-margin-5 {
  margin-bottom: 5px;
}

.activities-tick-box {
  float: left;
  width: 170px;
  margin-bottom: 20px;
}

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

.activities-content-row {
  margin-bottom: 10px;
}

.activities-combination-col {
  float: left;
  width: 33.33%;
}

.activities-combination-col._01 {
  padding-right: 20px;
}

.activities-combination-txt-b {
  margin-top: 5px;
  padding-top: 11px;
  padding-bottom: 11px;
}

.activities-combination-row {
  border-top: 1px solid var(--ccc);
  margin-top: 20px;
  padding-top: 15px;
  line-height: 22px;
}

.activities-radio-align-row {
  float: left;
  align-items: center;
  width: 100%;
  margin-top: 5px;
  padding-top: 14px;
  padding-bottom: 14px;
  display: flex;
}

.activities-radio-btn-field {
  align-items: center;
  margin-bottom: 0;
  margin-right: 30px;
  padding-left: 0;
}

.top-padding-30 {
  padding-top: 30px;
}

.btn-upload-photo {
  float: left;
  border: 1px solid var(--teal);
  background-color: var(--white);
  color: var(--teal);
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 100px;
  width: 100%;
  padding: 6px 10px;
  transition: border-color .2s, color .2s, background-color .2s;
  display: block;
}

.btn-upload-photo:hover {
  border-color: var(--light-sea-green);
  background-color: var(--light-sea-green);
  color: var(--white);
}

.activites-upload-row {
  float: left;
  width: 100%;
  margin-top: 20px;
  padding-left: 20px;
  padding-right: 20px;
}

.activites-upload-b {
  background-color: var(--f0f0f0);
  border-radius: 7px;
}

.activities-upload-list-b {
  flex-direction: column;
  margin-left: 10px;
  margin-right: 10px;
  padding-top: 10px;
  padding-bottom: 5px;
}

.ref-row {
  justify-content: center;
  margin-top: 10px;
  display: flex;
}

.ref-col {
  float: left;
  padding-left: 20px;
  padding-right: 20px;
}

.vaccine-line {
  background-color: var(--ababab);
  width: 100%;
  height: 1px;
  margin-bottom: 20px;
}

.vaccine-upload-col-r {
  width: 100%;
  margin-bottom: 20px;
  display: flex;
}

.left-margin-35 {
  padding-left: 35px;
}

.grey-line {
  background-color: var(--ccc);
  width: 100%;
  height: 1px;
  margin-top: 20px;
  margin-bottom: 20px;
}

.txt-white {
  color: var(--white);
}

.about-slogan-b {
  background-color: var(--dark-cyan);
  text-align: center;
  border-radius: 7px;
  margin-bottom: 20px;
  padding: 20px 20px 5px;
}

.about-grey-b {
  background-color: var(--f7f7f7);
  border-radius: 7px;
  padding: 20px;
}

.about-col-l {
  width: 68%;
  padding-right: 20px;
}

.about-col-r {
  background-color: var(--azure-2);
  border-radius: 7px;
  width: 32%;
  position: relative;
}

.about-align-b {
  display: flex;
}

.img-about-logo {
  position: absolute;
  top: 50%;
  bottom: auto;
  left: 50%;
  right: auto;
  transform: translate(-50%, -50%);
}

.about-goal-b {
  width: 68%;
  padding-left: 20px;
  padding-right: 20px;
}

.about-img {
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 7px;
}

.about-img.right {
  background-image: url('../images/about-us-vision022x.jpg');
  background-position: 90%;
  width: 100%;
  height: 100%;
}

.about-img.left {
  background-image: url('../images/about-us-vision012x.jpg');
  width: 16%;
}

.about-img.left.mobile {
  display: none;
}

.about-img.strategies {
  background-image: url('../images/about-us-vision032x.jpg');
  width: 32%;
}

.about-strategies-b {
  width: 68%;
  padding-left: 20px;
}

.about-col-img {
  width: 16%;
}

.about-structure-col-l {
  flex: none;
  width: 220px;
}

.about-structure-col-r {
  flex: 1;
}

.about-structure-align-b {
  margin-top: 20px;
  display: flex;
}

.btn-next {
  color: var(--teal);
  align-items: center;
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 700;
  line-height: 20px;
}

.btn-next:hover {
  color: var(--light-sea-green);
  display: inline-block;
}

.btn-next-arrow {
  z-index: 10;
  float: right;
  width: 8px;
  height: 13px;
  margin-top: 4px;
  margin-left: 5px;
  position: relative;
}

.about-green-b {
  background-color: var(--white-smoke);
  border-radius: 7px;
  padding: 20px;
}

.about-title {
  margin-bottom: 10px;
}

.btn-top {
  width: 40px;
  height: 40px;
  display: block;
  position: relative;
}

.btn-top-b {
  z-index: 300;
  float: right;
  width: 40px;
  height: 40px;
  margin-top: -40px;
  margin-right: -20px;
  position: -webkit-sticky;
  position: sticky;
  bottom: 40px;
  right: 0;
}

.about-history-align-b {
  display: flex;
}

.about-history-col-l {
  width: 55%;
  padding-right: 20px;
}

.about-history-col-r {
  background-color: var(--white-smoke);
  border-radius: 7px;
  justify-content: center;
  align-items: center;
  width: 45%;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-right: 20px;
  display: flex;
}

.about-slider {
  background-color: rgba(0, 0, 0, 0);
  flex: none;
  width: 60%;
  max-width: 230px;
  height: 100%;
  margin-left: 5%;
  margin-right: 10%;
  display: block;
}

.about-slide {
  text-align: center;
  width: 100%;
  height: 100%;
}

.img-about-history-logo {
  width: 100%;
  max-width: 230px;
  display: block;
}

.about-slide-b {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.about-menu-slider {
  background-color: rgba(0, 0, 0, 0);
  width: 100px;
  height: auto;
}

.about-slide-txt {
  float: left;
  color: var(--black);
  margin-left: 10px;
  font-size: 18px;
  font-weight: 700;
}

.about-slide-dot {
  float: left;
  border: 3px solid var(--teal);
  background-color: var(--ddd);
  border-radius: 17px;
  width: 17px;
  height: 17px;
  position: relative;
}

.about-slide-dot-hover, .about-slide-dot-active {
  background-color: var(--light-sea-green);
  opacity: 0;
  border-radius: 17px;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.about-slide-dot-active.dot-active {
  opacity: 1;
}

.about-menu-slide {
  float: left;
  cursor: pointer;
  width: 90px;
  height: 40px;
}

.about-menu-link {
  align-items: center;
  height: 40px;
  display: flex;
}

.about-menu-slider-b {
  align-items: center;
  display: flex;
  position: relative;
}

.about-menu-line {
  background-color: var(--ccc);
  width: 1px;
  height: 196px;
  margin-top: 24px;
  margin-left: 8px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.about-offices-col-l {
  float: left;
  width: 60%;
  padding-right: 20px;
  display: flex;
}

.about-offices-col-r {
  float: left;
  width: 40%;
}

.about-offices-txt-b {
  padding-bottom: 10px;
}

.about-offices-dot {
  z-index: 1;
  border: 3px solid var(--teal);
  background-color: var(--azure);
  border-radius: 17px;
  width: 17px;
  height: 17px;
  position: relative;
}

.about-offices-dot-b {
  flex: none;
  width: 17px;
  margin-right: 10px;
  padding-top: 3px;
  position: relative;
}

.about-offices-line {
  background-color: var(--ccc);
  width: 1px;
  margin-top: 4px;
  margin-bottom: -20px;
  margin-left: 8px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.about-offices-img {
  border-radius: 3px;
  width: 100%;
  display: block;
}

.about-offices-caption-b {
  color: var(--686868);
  text-align: center;
  margin-top: 5px;
  padding-bottom: 20px;
  padding-left: 20px;
  font-size: 15px;
  line-height: 19px;
}

.about-offices-caption-b._50 {
  width: 50%;
}

.about-offices-img-b {
  float: left;
  width: 50%;
  padding-left: 20px;
}

.about-offices-row {
  display: flex;
}

.links-b {
  background-color: var(--dark-cyan);
  color: var(--white);
  border-radius: 7px;
  justify-content: center;
  align-items: center;
  height: 64px;
  margin-left: 10px;
  margin-right: 10px;
  font-weight: 700;
  line-height: 22px;
  transition: background-color .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.links-b:hover {
  background-color: var(--light-sea-green);
}

.links-icon {
  background-color: var(--teal);
  background-image: url('../images/icon-link.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto;
  border-top-left-radius: 7px;
  border-bottom-left-radius: 7px;
  width: 46px;
  height: 100%;
}

.links-txt-b {
  flex: 1;
  padding-left: 15px;
}

.links-arrow {
  z-index: 10;
  float: right;
  width: 10px;
  height: 16px;
  margin-top: 1px;
  margin-left: 20px;
  margin-right: 20px;
}

.links-align-b {
  flex-wrap: wrap;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.links-row {
  width: 50%;
  margin-bottom: 20px;
}

.about-privacy-b {
  border-bottom: 1px solid var(--ccc);
  margin-bottom: 15px;
  padding-bottom: 20px;
  line-height: 22px;
  position: relative;
}

.about-privacy-b.last {
  border-bottom-style: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.list-info {
  flex: none;
  width: 95px;
}

.relative {
  position: relative;
}

.txt-tablet {
  display: none;
}

.faqs-section-b {
  margin-bottom: 20px;
}

.faqs-table-title-row {
  background-color: var(--teal);
  color: var(--white);
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
  padding: 10px 20px;
  font-size: 22px;
  font-weight: 700;
}

.faqs-table-content-b {
  background-color: var(--azure-2);
  border-bottom-right-radius: 7px;
  border-bottom-left-radius: 7px;
  padding: 20px 20px 10px;
}

.faqs-link {
  background-color: var(--white);
  color: var(--424242);
  width: 100%;
  padding: 10px 20px;
  transition: color .4s, background-color .4s;
  display: block;
  position: relative;
}

.faqs-link:hover {
  background-color: var(--dark-cyan);
  color: var(--white);
  display: flex;
}

.faqs-align-b {
  z-index: 1;
  display: flex;
  position: relative;
}

.faqs-no {
  flex: none;
  width: 60px;
  position: relative;
}

.faqs-txt {
  z-index: 1;
  font-weight: 700;
  position: relative;
}

.faqs-txt-hover {
  opacity: 0;
  color: var(--white);
  font-weight: 700;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.faqs-txt-b {
  margin-right: 40px;
  position: relative;
}

.faqs-link-row {
  background-color: var(--white);
  border-radius: 7px;
  margin-bottom: 10px;
  overflow: hidden;
}

.faqs-expand-b {
  line-height: 22px;
}

.faqs-expand-txt-b {
  padding: 20px;
  display: flex;
}

.faqs-bg {
  background-color: var(--dark-cyan);
  opacity: 0;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.faqs-arrow {
  background-image: url('../images/arrow-online-services.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 10px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.faqs-arrow-b {
  z-index: 10;
  width: 46px;
  height: 46px;
  position: absolute;
  top: 50%;
  bottom: auto;
  left: auto;
  right: 0%;
  transform: translate(0, -50%);
}

.faqs-arrow-hover, .faqs-arrow-open {
  opacity: 0;
  background-image: url('../images/arrow-online-services-hover.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 10px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.faqs-b {
  margin-bottom: -20px;
}

.ans-table-b {
  text-align: center;
  min-width: 550px;
}

.ans-table-title-row {
  background-color: var(--686868);
  color: var(--white);
  border-top-left-radius: 7px;
  border-top-right-radius: 7px;
  font-size: 16px;
  font-weight: 700;
  display: flex;
}

.ans-table-title-col {
  float: left;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 15px;
}

.ans-table-title-col._30 {
  width: 30%;
}

.ans-table-title-col._20 {
  width: 20%;
}

.ans-table-title-col.line {
  border-left: 1px solid var(--white);
}

.ans-table-last-row {
  background-color: var(--424242);
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  width: 100%;
  height: 5px;
}

.faqs-table-b {
  padding-left: 20px;
  padding-right: 20px;
}

.sitemap-col {
  float: left;
  width: 33.33%;
  padding-left: 20px;
  padding-right: 20px;
}

.sitemap-link {
  border-left: 3px solid var(--teal);
  color: var(--black);
  text-transform: uppercase;
  margin-top: 25px;
  padding-left: 7px;
  font-size: 18px;
  font-weight: 700;
  line-height: 18px;
}

.sitemap-link:hover {
  color: var(--light-sea-green);
}

.sitemap-link.no-bottom-margin {
  margin-bottom: 0;
}

.sitemap-sub-link {
  color: var(--424242);
  background-image: url('../images/arrow-green.svg');
  background-position: 0 3px;
  background-repeat: no-repeat;
  background-size: auto;
  margin-top: 10px;
  margin-left: 10px;
  padding-left: 15px;
  font-weight: 700;
  line-height: 20px;
  transition: color .2s;
}

.sitemap-sub-link:hover {
  color: var(--light-sea-green);
}

.sitemap-bullet-link {
  color: var(--424242);
  background-image: url('../images/bullet.svg');
  background-position: 0 8px;
  background-repeat: no-repeat;
  background-size: 6px;
  margin-top: 10px;
  margin-left: 25px;
  padding-left: 13px;
  line-height: 22px;
  transition: color .2s;
}

.sitemap-bullet-link:hover {
  color: var(--light-sea-green);
}

.bottom-margin-15 {
  margin-bottom: 15px;
}

.sitemap-align-b {
  margin-top: -25px;
  margin-left: -20px;
  margin-right: -20px;
}

.contact-table {
  text-align: center;
  flex: none;
  width: 100%;
}

.contact-align-b {
  display: flex;
}

.img-contact {
  background-image: url('../images/contact-us-img2x.jpg');
  background-position: 75%;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 7px;
  flex: 1;
  margin-left: 20px;
}

.contact-padding-b {
  width: 60%;
  min-width: 600px;
}

.contact-suggestion-txt-b {
  float: right;
  width: 50%;
}

.contact-info-b {
  display: flex;
}

.contact-info-col-l {
  float: left;
  border-top-left-radius: 7px;
  border-bottom-left-radius: 7px;
  width: 60%;
  position: relative;
  overflow: hidden;
}

.contact-info-col-r {
  float: left;
  width: 40%;
  min-width: 400px;
}

.contact-info-green-b {
  background-color: var(--white-smoke);
  border-top-right-radius: 7px;
  border-bottom-right-radius: 7px;
  padding: 20px 20px 15px;
}

.contact-link {
  color: var(--424242);
  width: 100%;
  transition: color .2s;
  display: flex;
}

.contact-link:hover {
  color: var(--teal);
}

.icon-contact {
  float: left;
  background-color: var(--dark-cyan);
  background-image: url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  border-radius: 26px;
  flex: none;
  width: 26px;
  height: 26px;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-right: 7px;
}

.icon-contact.email {
  background-image: url('../images/icon-email.svg');
}

.icon-contact.tel {
  background-image: url('../images/icon-tel.svg');
}

.icon-contact.fax {
  background-image: url('../images/icon-fax.svg');
}

.icon-contact.address {
  background-image: url('../images/icon-address.svg');
}

.icon-contact.hours {
  background-image: url('../images/icon-hours.svg');
}

.contact-txt-b {
  float: left;
  border-bottom: 1px solid var(--powder-blue);
  flex: 1;
  padding-top: 5px;
  padding-bottom: 5px;
  display: flex;
}

.contact-txt-b.no-border {
  border-bottom-style: none;
}

.contact-txt-col-l {
  width: 110px;
}

.contact-link-b {
  width: 100%;
  display: flex;
}

.map {
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.under-construction-b {
  text-align: center;
  background-color: #e7e7e7;
  background-image: url('../images/under-construction.svg'), url('../images/under-construction.svg');
  background-position: 0 100%, 0 0;
  background-repeat: repeat-x, repeat-x;
  background-size: auto, auto;
  border-radius: 7px;
  flex: 1;
  justify-content: center;
  align-items: center;
  padding-left: 20px;
  padding-right: 20px;
  display: flex;
}

.under-construction-align-b {
  flex-direction: column;
  height: 100%;
  display: flex;
}

.print-content-b {
  border: 1px solid var(--ccc);
  color: var(--black);
  max-width: 900px;
  height: 1400px;
  margin-left: auto;
  margin-right: auto;
  padding: 30px 45px;
  position: relative;
}

.img-print-logo {
  width: 95px;
  margin-bottom: 15px;
}

.align-center {
  flex-direction: column;
  align-items: center;
  display: flex;
}

.txt-big {
  color: var(--black);
  text-align: center;
  letter-spacing: 1.5px;
  font-size: 28px;
  font-weight: 700;
  line-height: 34px;
}

.txt-big.chi {
  letter-spacing: 3px;
}

.print-header-b {
  border-bottom: 3px solid var(--teal);
  flex-direction: column;
  align-items: center;
  margin-bottom: 20px;
  padding-bottom: 10px;
  display: flex;
  position: relative;
}

.print-title {
  color: var(--teal);
  text-align: center;
  margin-bottom: 15px;
  font-size: 28px;
  font-weight: 700;
  line-height: 34px;
  text-decoration: underline;
}

.print-contact-col {
  float: left;
  margin-left: 15px;
  margin-right: 15px;
  font-size: 15px;
  line-height: 21px;
  display: flex;
}

.print-contact-col-l {
  flex: none;
  padding-right: 10px;
}

.print-contact-col-l._70 {
  width: 70px;
}

.print-contact-row {
  margin-bottom: 15px;
  margin-left: -15px;
  margin-right: -15px;
}

.print-contact-txt-b {
  flex-direction: column;
  align-items: flex-start;
  width: auto;
  margin-bottom: 15px;
  display: inline-block;
}

.print-contact-b {
  justify-content: center;
  display: flex;
}

.print-info-b {
  border: 1px solid var(--dark-cyan);
  border-radius: 7px;
  padding: 20px;
  font-size: 18px;
  line-height: 24px;
}

.print-info-col-l {
  float: left;
  width: 200px;
}

.print-info-col-r {
  float: left;
}

.print-info-row {
  margin-top: 15px;
}

.print-attention-b {
  margin-top: 30px;
  margin-bottom: 30px;
}

.txt-print-date {
  font-size: 13px;
  line-height: 17px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.print-footer-b {
  justify-content: space-between;
  margin-bottom: 30px;
  margin-left: 45px;
  margin-right: 45px;
  padding-right: 30px;
  font-size: 13px;
  line-height: 17px;
  position: absolute;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.print-page-no {
  flex: none;
  margin-left: 30px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.link-update-profile {
  z-index: 100;
  width: 25%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.link-update-profile-b {
  height: 60px;
  margin-left: 20px;
  margin-right: 20px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.pop-notification {
  z-index: 500;
  background-color: var(--white);
  border-bottom-right-radius: 7px;
  border-bottom-left-radius: 7px;
  width: 350px;
  margin-top: 50px;
  padding-left: 20px;
  padding-right: 20px;
  display: none;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
  overflow: hidden;
  box-shadow: 0 1px 10px rgba(0, 0, 0, .2);
}

.notification-b {
  padding-top: 20px;
}

.ans-table-title {
  position: relative;
  top: 50%;
  transform: translate(0, -50%);
}

.notification-mobile-b {
  display: none;
}

.radio-btn-label-vaccine {
  background-image: url('../images/radio-off.svg');
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 26px;
  min-height: 28px;
  padding-left: 36px;
}

.radio-btn-label-vaccine.v-on {
  background-image: url('../images/radio-on.svg');
}

.radio-button-field-vaccine {
  padding-left: 0;
}

.radio-button-field-vaccine.v-special-event-purchase {
  width: 100%;
  margin-bottom: 0;
  padding: 10px;
}

.table-vaccine-prize-col {
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 15px 20px;
  display: flex;
}

.table-vaccine-prize-col.col-1 {
  width: 40%;
}

.table-vaccine-prize-col.col-1.title {
  border-right: 1px solid var(--white);
}

.table-vaccine-prize-col.col-2 {
  width: 30%;
}

.table-vaccine-prize-col.col-2.title {
  border-right: 1px solid var(--white);
}

.table-vaccine-prize-col.col-3 {
  width: 30%;
}

.font-size-16 {
  font-size: 16px;
  line-height: 26px;
}

.table-vaccine-prize-content {
  width: 100%;
}

.table-vaccinegame-col {
  float: left;
  padding: 15px;
}

.table-vaccinegame-col._01 {
  width: 40%;
}

.table-vaccinegame-col._01.title {
  border-right: 1px solid var(--white);
}

.table-vaccinegame-col._02 {
  width: 30%;
}

.table-vaccinegame-col._02.title {
  border-right: 1px solid var(--white);
}

.table-vaccinegame-col._03 {
  width: 35.71%;
}

.form-remind-b {
  float: left;
  padding-left: 20px;
}

.privacy-id {
  margin-top: -150px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.img-vaccine-game-table {
  width: 100%;
  min-width: 550px;
  max-width: none;
  display: block;
}

.vaccine-game-step-heading {
  padding-right: 80px;
}

.vaccine-game-step-heading.v2game-instruction {
  padding-right: 0;
  font-size: 26px;
  line-height: 28px;
}

.vaccine-form-note-b {
  color: var(--steel-blue);
  margin-left: -35px;
}

.margin-5 {
  margin-bottom: 5px;
}

.header-top-row.v-join {
  align-items: center;
  display: block;
}

.header-info-row {
  color: var(--teal);
}

.vaccine-top-info-b {
  float: left;
  margin-left: 15px;
}

.vaccine-header-info-b {
  display: none;
}

.tick-box-multi {
  color: var(--424242);
  padding-left: 28px;
  font-weight: 300;
  position: relative;
}

.tick-box-multi.red {
  color: var(--red);
}

.tick-box-multi.light {
  font-weight: 300;
}

.tick-box-multi.calculator {
  padding-left: 25px;
  font-weight: 400;
}

.upload-image-b {
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
}

.upload-image-b.popup-link {
  border-radius: 3px;
  overflow: hidden;
}

.upload-image-b.pdf {
  border-radius: 3px;
  align-items: stretch;
  height: 100%;
  margin-top: -38px;
  padding: 40px 10px 40px 20px;
}

.upload-image-hover-b {
  background-image: url('../images/eye.svg'), linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5));
  background-position: 50%, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: 25%, auto;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.upload-image-hover-b-m {
  background-image: url('../images/eye.svg'), linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5));
  background-position: 50%, 0 0;
  background-repeat: no-repeat, repeat;
  background-size: 25%, auto;
  display: none;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.upload-image-popup-b {
  z-index: 999;
  background-image: linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5));
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100%;
  padding: 40px 40px 145px;
  display: none;
  position: fixed;
}

.pop-image-b {
  background-image: url('../images/doc-sample-hkid-22x.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 100%;
}

.pop-image-b.membercard {
  background-image: url('../images/membercard.png');
}

.upload-image-popup-close-b {
  z-index: 1;
  background-color: var(--white);
  flex: none;
  width: 46px;
  height: 46px;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.upload-image-pdf {
  width: 100%;
}

.upload-image-pdf.confirm {
  width: 50%;
}

.vgame2-table-upload {
  border-style: solid solid none;
  border-width: 1px;
  border-color: var(--powder-blue);
  background-color: var(--white);
  border-radius: 10px;
}

.vgame2-vid-b {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
}

.vgame2-table-upload-row {
  border-bottom: 1px solid var(--powder-blue);
  justify-content: flex-start;
  align-items: stretch;
  padding: 10px 20px;
  display: flex;
}

.vgame2-table-upload-col {
  align-items: center;
  display: flex;
}

.vgame2-table-upload-col.col-1 {
  color: var(--teal);
  flex: none;
  width: 50px;
  font-size: 30px;
  font-weight: 700;
  line-height: 40px;
}

.vgame2-table-upload-col.col-2 {
  border-right: 1px solid var(--powder-blue);
  flex-wrap: wrap;
  flex: 1;
  align-content: center;
  margin-right: 20px;
  padding-right: 20px;
}

.vgame2-table-upload-col.col-3 {
  width: 250px;
  display: block;
}

.vgame2-table-upload-col.col-sample {
  border-right: 1px solid var(--powder-blue);
  width: 250px;
  margin-right: 20px;
  padding-right: 20px;
  display: block;
}

.vgame2-upload-lightbox {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: block;
  overflow: hidden;
}

.vgame2-upload-lightbox.v-pdf {
  max-width: 100px;
}

.vgame2-upload-b {
  background-color: var(--f7f7f7);
  border-radius: 5px;
  width: 100%;
  padding: 10px 11px;
  position: relative;
}

.vgame2-upload-delete {
  z-index: 1;
  background-color: var(--white);
  border-radius: 50%;
  flex: none;
  width: 30px;
  height: 30px;
  margin-top: -5px;
  margin-right: -5px;
  transition: background-color .5s;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
}

.vgame2-upload-delete:hover {
  background-color: var(--ccc);
}

.vgame2-upload-title {
  margin-bottom: 5px;
  padding-right: 35px;
}

.vgame2-upload-link {
  border: 1px solid var(--powder-blue);
  background-color: var(--white);
  color: var(--teal);
  text-align: center;
  border-radius: 7px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 10px;
  font-size: 18px;
  display: block;
  position: relative;
}

.vgame2-upload-link:hover {
  background-color: var(--white-smoke);
}

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

.txt-align-center.mobile-only {
  display: none;
}

._100-b {
  width: 100%;
}

.v2game-sample-old-new-item {
  border: 1px solid var(--light-sea-green);
  color: var(--teal);
  border-radius: 5px;
  padding: 5px;
  font-weight: 700;
}

.v2game-form-note-dim {
  color: rgba(66, 66, 66, .6);
}

.agm-bg {
  background-image: linear-gradient(rgba(255, 255, 255, .6), rgba(255, 255, 255, .6)), url('../images/agm-bg.jpg');
  background-position: 0 0, 50% 100%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.agm-title {
  width: 300px;
  max-width: 100%;
  margin-bottom: 25px;
  margin-left: auto;
  margin-right: auto;
}

.agm-title.title-2 {
  width: 700px;
}

.agm-title.title-3 {
  width: 600px;
}

.agm-intro-b {
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0), #fff 20%, #fff 80%, rgba(255, 255, 255, 0));
  margin-bottom: 40px;
  padding: 40px;
}

.agm-intro-row {
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 10px;
  display: flex;
}

.agm-intro-row.v-footnote {
  margin-bottom: 10px;
}

.agm-intro-row.v-deadline {
  justify-content: center;
  width: 100%;
}

.intro-row-fieldname {
  color: var(--teal);
  width: 150px;
  font-weight: 700;
}

.intro-row-fieldname.txt-red {
  color: var(--red);
}

.intro-row-fieldname.txt-blink {
  color: var(--dark-orange);
}

.intro-row-fieldname.v-agm-footnote {
  width: 180px;
}

.intro-row-data {
  flex: 1;
}

.intro-row-data.txt-blink {
  color: var(--dark-orange);
}

.intro-row-data.v-deadline {
  flex: 0 auto;
}

.blink-b {
  position: relative;
}

.agm-blink {
  opacity: 0;
  width: 100%;
  display: block;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.agm-info-b {
  border-bottom: 1px solid var(--dark-cyan);
  margin-bottom: 40px;
  padding-bottom: 40px;
}

.agm-info-b.v-submitted {
  border-bottom-style: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.float-left {
  float: left;
}

._w-100 {
  width: 100%;
}

.agm-footnote {
  margin-top: 30px;
  margin-bottom: 30px;
}

.agm-footnote-title {
  margin-bottom: 10px;
  font-weight: 700;
}

.agm-submit-table {
  border-style: solid solid none;
  border-width: 1px;
  border-color: var(--teal);
  margin-bottom: 40px;
}

.agm-submit-table-row {
  border-bottom: 1px solid var(--teal);
  justify-content: flex-start;
  align-items: stretch;
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
}

.agm-submit-table-col {
  padding-left: 20px;
  padding-right: 20px;
}

.agm-submit-table-col.col-1 {
  border-right: 1px solid var(--teal);
  flex: none;
  width: 250px;
  font-weight: 700;
}

.agm-submit-table-col.col-2 {
  flex: 1;
}

.footnote-row {
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.footnote-list {
  margin-bottom: 40px;
}

.agm-row-data-list {
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 5px;
  display: flex;
}

.footnote-list-no {
  flex: none;
  width: 30px;
}

.agm-watermark-b {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
  overflow: hidden;
}

.agm-watermark-col {
  width: 50%;
}

.agm-watermark-col.col-2 {
  margin-top: 10%;
}

.watermark-txt {
  color: rgba(66, 66, 66, .1);
  text-align: center;
  margin-bottom: 26%;
  font-size: 3.2vw;
  line-height: 100%;
  transform: rotate(-20deg);
}

.terms-checkbox-link {
  background-color: var(--dark-cyan);
  color: var(--white);
  width: 100%;
  padding: 10px 20px;
  transition: color .4s, background-color .4s;
  display: block;
  position: relative;
}

.terms-checkbox-link:hover {
  background-color: var(--dark-cyan);
  color: var(--white);
  display: flex;
}

.terms-arrow-b {
  z-index: 10;
  width: 46px;
  height: 46px;
  transition: all .5s;
  position: absolute;
  top: 50%;
  bottom: auto;
  left: auto;
  right: 0%;
  transform: translate(0, -50%)rotate(90deg);
}

.terms-align-b {
  z-index: 1;
  display: flex;
  position: relative;
}

.terms-expand-b {
  max-height: 3000px;
  line-height: 22px;
  overflow: hidden;
}

.terms-expand-txt-b {
  padding: 20px;
  display: flex;
}

.terms-no, .faqs-no-copy {
  flex: none;
  width: 60px;
  position: relative;
}

.terms-txt-b {
  margin-right: 40px;
  position: relative;
}

.terms-arrow {
  background-image: url('../images/arrow-online-services-hover.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 10px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.terms-arrow-hover {
  opacity: 0;
  background-image: url('../images/arrow-online-services.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 10px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.terms-arrow-open {
  opacity: 0;
  background-image: url('../images/arrow-online-services-hover.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 10px;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.terms-link-row {
  background-color: var(--white);
  border-radius: 7px;
  margin-bottom: 10px;
  overflow: hidden;
}

.terms-checkbox-box {
  border: 1px solid var(--ababab);
  background-color: var(--white);
  border-radius: 3px;
  flex: none;
  width: 26px;
  height: 26px;
  margin-right: 10px;
  position: relative;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.terms-checkbox-box.vaccine {
  width: 26px;
  height: 26px;
  margin-top: 0;
}

.terms-checkbox-field {
  margin-bottom: 0;
  padding-left: 0;
  font-weight: 400;
}

.terms-after {
  display: none;
}

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

.join-radio-item {
  width: 50%;
  padding-left: 10px;
  padding-right: 10px;
}

.footer-app-item {
  margin-bottom: 5px;
  padding-left: 5px;
  padding-right: 5px;
}

.footer-badge-img {
  width: auto;
  max-width: none;
  height: 42px;
  display: block;
}

.internal-only-watermark-b {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
  overflow: hidden;
}

.internal-watermark-col {
  width: 50%;
}

.internal-watermark-col.col-2 {
  margin-top: 10%;
}

.internal-watermark-col.col-3 {
  display: none;
}

.internal-only-watermark-txt {
  color: rgba(66, 66, 66, .1);
  text-align: center;
  margin-bottom: 26%;
  font-size: 3.2vw;
  line-height: 100%;
  transform: rotate(-20deg);
}

.form-red-instruct-note {
  color: var(--red);
  background-color: #fadede;
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
  margin-top: 2px;
  padding: 5px 10px;
  font-size: 16px;
  line-height: 120%;
  display: inline-block;
}

.event-terms-gp {
  margin-bottom: 40px;
}

.special-event-intro-b.v-submitted {
  border-bottom-style: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.special-event-personalinfo-intro {
  border-bottom: 1px solid var(--teal);
  margin-bottom: 30px;
  padding-bottom: 30px;
}

.special-event-bg {
  background-image: linear-gradient(rgba(255, 255, 255, .6), rgba(255, 255, 255, .6)), url('https://d3e54v103j8qbb.cloudfront.net/img/background-image.svg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.special-event-bg.event-dinner {
  background-image: linear-gradient(rgba(255, 255, 255, .6), rgba(255, 255, 255, .6)), url('../images/special-event-bg-dinner.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
}

.special-event-bg.event-travel {
  background-image: linear-gradient(rgba(255, 255, 255, .6), rgba(255, 255, 255, .6)), url('../images/special-event-bg-travel.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
}

.special-event-bg.event-calendar {
  background-image: linear-gradient(rgba(255, 255, 255, .6), rgba(255, 255, 255, .6)), url('../images/special-event-bg-calendar.jpg');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
}

.special-event-ticket-box {
  background-color: var(--white);
  border-radius: 10px;
  padding: 20px;
}

.special-event-ticket-top-row {
  border-bottom: 1px solid var(--teal);
  color: var(--teal);
  padding-bottom: 5px;
  font-weight: 700;
}

.special-event-ticket-wrap {
  justify-content: flex-start;
  align-items: center;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.special-event-ticket-col {
  width: 33.3%;
  padding-left: 10px;
  padding-right: 10px;
}

.special-event-ticket-col.col-type {
  font-weight: 700;
}

.special-event-ticket-row {
  border-bottom: 1px solid var(--f0f0f0);
  padding-top: 6px;
  padding-bottom: 6px;
}

.form-select {
  border: 1px solid var(--ababab);
  background-color: var(--white);
  color: var(--424242);
  background-image: url('../images/arrow-dropdown.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 30px;
  border-radius: 7px;
  height: 46px;
  margin-top: 5px;
  margin-bottom: 3px;
  padding: 10px 30px 10px 15px;
  font-size: 16px;
}

.form-select:focus {
  border-color: var(--light-sea-green);
  font-style: normal;
}

.form-select.bottom-margin-10 {
  margin-bottom: 10px;
}

.form-select.no-margin {
  margin-top: 0;
  margin-bottom: 0;
}

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

.form-select.hkid-last {
  width: 46px;
  margin: 0 10px;
}

.form-select.v-special-event-ticket-qty {
  width: 80px;
}

.special-event-ticket-mobile-fieldname {
  color: var(--teal);
  font-weight: 700;
  display: none;
}

.ticket-type-txt {
  border: 1px solid var(--teal);
  border-radius: 10px;
  padding: 5px 10px;
  display: inline-block;
}

.special-event-ticket-total-box {
  background-color: var(--light-sea-green);
  color: var(--white);
  border-radius: 10px;
  justify-content: center;
  align-items: flex-end;
  margin-top: 10px;
  padding: 10px 20px;
  display: flex;
}

.special-event-ticket-total-fieldname {
  line-height: 120%;
}

.special-event-ticket-total-num {
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.special-event-ticket-package-radio-gp {
  margin-top: 5px;
}

.special-event-ticket-note {
  margin-bottom: 20px;
}

.special-event-extra-info-ec-item {
  border: 1px solid var(--f0f0f0);
  background-color: var(--white);
  border-radius: 10px;
  margin-bottom: 10px;
  padding: 5px 10px;
  position: relative;
}

.special-event-extra-info-ec-click {
  justify-content: flex-start;
  align-items: center;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 30px;
  display: flex;
}

.special-event-extra-info-ec-click.ec-expand {
  cursor: pointer;
  background-image: url('../images/ec-collapse.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 30px;
}

.special-event-extra-info-ec-click.ec-collapse {
  cursor: pointer;
  background-image: url('../images/ec-expand.svg');
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: 30px;
}

.se-extra-info-click-name {
  margin-right: 10px;
  font-weight: 900;
}

.se-extra-info-click-status {
  background-color: var(--dark-orange);
  border-radius: 10px;
  padding: 2px 5px;
}

.se-extra-info-click-status.v-typing {
  background-color: var(--light-sky-blue);
}

.se-extra-info-click-status.v-complete {
  background-color: #7ae769;
}

.special-event-extra-info-ec-content {
  overflow: hidden;
}

.special-event-extra-info-ec-content-wrap {
  border-top: 1px solid var(--f0f0f0);
  margin-top: 5px;
  padding-top: 15px;
  padding-bottom: 15px;
}

.se-extra-form-wrap {
  flex-flow: wrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.se-extra-form-col {
  width: 50%;
  margin-bottom: 20px;
  padding-left: 10px;
  padding-right: 10px;
  position: relative;
}

.se-extra-form-col.v-100 {
  width: 100%;
}

.btn-se-info-confirm {
  float: right;
  border: 1px solid var(--teal);
  background-color: var(--teal);
  color: var(--white);
  text-align: center;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 100px;
  margin-bottom: 5px;
  padding: 6px 25px;
  transition: border-color .2s, color .2s, background-color .2s;
  display: inline-block;
}

.btn-se-info-confirm:hover {
  border-color: var(--light-sea-green);
  background-color: var(--light-sea-green);
  color: var(--white);
}

.btn-se-info-confirm._160 {
  width: 160px;
}

.btn-se-info-confirm.full {
  width: 100%;
}

.btn-se-info-confirm._230 {
  width: 230px;
}

.btn-se-info-confirm.eform {
  width: 180px;
  padding-left: 15px;
  padding-right: 15px;
}

.btn-se-info-confirm.confirm-login {
  padding-left: 20px;
  padding-right: 20px;
}

.btn-se-info-confirm._180 {
  width: 180px;
}

.se-preview-gp {
  border-bottom: 1px solid var(--ababab);
  margin-bottom: 20px;
  padding-bottom: 20px;
}

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

.form-dob-col {
  width: 33.3%;
  padding-left: 5px;
  padding-right: 5px;
}

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

.form-gender-col {
  padding-left: 10px;
  padding-right: 10px;
}

.special-event-purchase-menu {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: stretch;
  margin-bottom: 10px;
  margin-left: -2px;
  margin-right: -2px;
  display: flex;
}

.special-event-purchase-tab-link {
  background-color: var(--f0f0f0);
  justify-content: flex-start;
  align-items: center;
  width: 33%;
  margin-bottom: 5px;
  margin-right: .33%;
  padding: 0;
  transition: color .5s, background-color .5s;
  display: flex;
}

.special-event-purchase-tab-link:hover {
  background-color: var(--powder-blue);
}

.special-event-purchase-tab-link.w--current {
  background-color: var(--teal);
  color: var(--white);
}

.special-event-purchase-content {
  background-color: var(--white);
  margin-top: 10px;
  padding: 30px;
}

.se-purchase-content-wrap {
  flex-flow: row;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.se-purchase-content-l {
  width: 60%;
  margin-right: 20px;
}

.se-purchase-content-r {
  flex: 1;
}

.se-purchase-content-title {
  color: var(--teal);
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.se-purchse-des {
  font-size: 16px;
  line-height: 120%;
}

.se-purchase-price-b {
  justify-content: flex-start;
  align-items: center;
  margin-top: 40px;
  display: flex;
}

.se-purchase-price-wrap {
  justify-content: flex-start;
  align-items: center;
  margin-right: 20px;
  display: flex;
}

.se-purchase-price-fieldname {
  margin-right: 10px;
  font-size: 16px;
  line-height: 120%;
}

.se-purchase-price-data {
  font-size: 24px;
  font-weight: 700;
  line-height: 120%;
}

.se-purchase-qty-select {
  flex: 1;
  max-width: 100px;
}

.special-event-purchase-item {
  color: var(--black);
  background-color: rgba(255, 255, 255, 0);
  width: 33.3%;
  margin-bottom: 4px;
  padding-left: 2px;
  padding-right: 2px;
  font-weight: 400;
}

.se-purchase-checkbox {
  background-color: var(--f0f0f0);
  margin-bottom: 0;
  padding-left: 0;
}

.se-purchase-checkbox-content {
  justify-content: flex-start;
  align-items: flex-start;
  padding: 10px;
  font-weight: 400;
  transition: color .5s, background-color .5s;
  display: flex;
}

.se-purchase-checkbox-content:hover {
  background-color: var(--powder-blue);
}

.se-purchase-checkbox-box {
  border: 1px solid var(--ababab);
  background-color: var(--white);
  border-radius: 5px;
  flex: none;
  width: 25px;
  height: 25px;
  position: relative;
}

.se-purchase-checkbox-txt {
  flex: 1;
  margin-top: 5px;
  margin-left: 10px;
  font-size: 16px;
  line-height: 120%;
}

.se-purchase-checkbox-tick {
  opacity: 0;
  background-image: url('../images/tick.svg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 16px;
  transition: opacity .5s;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
}

.se-purchase-ship-b, .se-purchase-selfpick-b {
  overflow: hidden;
}

.se-purchase-ship-wrap {
  border-top: 1px solid var(--ccc);
  margin-top: 20px;
  margin-bottom: 20px;
  padding-top: 20px;
}

.se-purchase-ship-form-wrap {
  flex-flow: wrap;
  justify-content: space-between;
  align-items: flex-start;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.se-purchase-ship-form-col {
  width: 50%;
  margin-bottom: 20px;
  padding-left: 10px;
  padding-right: 10px;
  position: relative;
}

.se-purchase-ship-form-col.v-100 {
  width: 100%;
}

.se-purchase-address-upload-link {
  border: 1px solid var(--powder-blue);
  background-color: var(--white);
  color: var(--teal);
  text-align: center;
  border-radius: 7px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 5px;
  padding: 10px;
  font-size: 18px;
  display: block;
  position: relative;
}

.se-purchase-address-upload-link:hover {
  background-color: var(--white-smoke);
}

.se-purchase-summary-row {
  border-bottom: 1px solid var(--f0f0f0);
  background-color: var(--white);
  color: var(--black);
  justify-content: flex-start;
  align-items: center;
  padding: 10px;
  line-height: 120%;
  display: flex;
}

.se-purchase-summary-item {
  flex: 1;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.se-purchase-summary-img-b {
  width: 100px;
  margin-right: 10px;
}

.se-purchase-summary-info-b {
  flex: 1;
}

.se-purchase-summary-info-name {
  margin-bottom: 5px;
  font-weight: 700;
}

.se-purchase-summary-row-qty {
  text-align: center;
  width: 100px;
  margin-left: 10px;
}

.se-purchase-summary-row-subtotal {
  text-align: right;
  width: 120px;
  margin-left: 10px;
}

.se-purchase-summary-subtotal-b {
  max-width: 300px;
  margin-top: 10px;
  margin-left: auto;
}

.se-purchase-summary-subtotal-row {
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 5px;
  display: flex;
}

.se-purchase-summary-subtotal-fieldname {
  width: 100px;
  font-weight: 700;
}

.se-purchase-summary-subtotal-data {
  color: var(--dark-cyan);
  text-align: right;
  flex: 1;
}

.se-purchase-summary-total-row {
  border-top: 1px solid var(--black);
  justify-content: flex-start;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 0;
  padding-top: 10px;
  font-size: 24px;
  font-weight: 700;
  display: flex;
}

.se-form-ticket-row {
  margin-bottom: 20px;
}

.se-footnote-list {
  margin-top: 40px;
  margin-bottom: 40px;
}

.se-purchase-non-personal-pickup {
  overflow: hidden;
}

.hkid-field-item {
  margin-bottom: 5px;
  padding-left: 5px;
  padding-right: 5px;
}

.hkid-field-item.v-last {
  margin-bottom: 0;
}

.hkid-field-gp {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: center;
  margin: 5px -5px 3px;
  display: flex;
  position: relative;
}

.hkid-field-gp.hkid {
  align-items: center;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.hkid-field-last {
  justify-content: center;
  align-items: center;
  display: flex;
}

.form-ui-select-item {
  margin-bottom: -5px;
  padding-left: 10px;
  padding-right: 10px;
}

.form-ui-select-item.v-preview {
  margin-bottom: 0;
}

.form-ui-select-gp {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.form-ui-select-title {
  color: var(--teal);
  padding-left: 10px;
  padding-right: 10px;
  font-weight: 700;
}

.form-ui-now, .form-ui-prev {
  margin-left: -15px;
  margin-right: -15px;
  overflow: hidden;
}

.form-ui-select-question {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 20px;
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
}

.intro-row-sub-fieldname {
  width: 50%;
  max-width: 200px;
  margin-right: 10px;
  font-weight: 700;
}

.intro-row-sub-fieldname.txt-red {
  color: var(--red);
}

.intro-row-sub-fieldname.txt-blink {
  color: var(--dark-orange);
}

.intro-row-sub-fieldname.v-agm-footnote {
  width: 180px;
}

.agm-intro-subrow {
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: 10px;
  display: flex;
}

.agm-intro-subrow.v-footnote {
  margin-bottom: 10px;
}

.agm-intro-subrow.v-deadline {
  justify-content: center;
  width: 100%;
}

html.w-mod-js [data-ix="fade-from-bottom"] {
  opacity: 0;
  transform: translate(0, 40px);
}

html.w-mod-js [data-ix="pop-notification"] {
  height: 0;
}

html.w-mod-js [data-ix="heading"] {
  opacity: 0;
  transform: translate(-80px, -50%);
}

html.w-mod-js [data-ix="heading-detail"] {
  opacity: 0;
  transform: translate(-80px);
}

html.w-mod-js [data-ix="inner-banner"] {
  transform: scale(1.2);
}

html.w-mod-js [data-ix="popup"] {
  opacity: 0;
  display: none;
}

html.w-mod-js [data-ix="popup-btn-forgot-pw"] {
  opacity: .5;
}

html.w-mod-js [data-ix="slider-img-scale"] {
  transform: scale(1.1);
}

html.w-mod-js [data-ix="faqs-expand"] {
  height: 0;
}

html.w-mod-js [data-ix="opacity-0"] {
  opacity: 0;
}

html.w-mod-js [data-ix="init-h0"] {
  height: 0;
}

@media screen and (min-width: 1280px) {
  .logo {
    height: 70px;
  }

  .container {
    padding-left: 40px;
    padding-right: 40px;
  }

  .footer-col-r {
    width: 45%;
  }

  .footer-b {
    font-size: 16px;
    line-height: 26px;
  }

  .top-col-r {
    font-size: 16px;
    line-height: 18px;
  }

  .top-info-row {
    padding-top: 7px;
  }

  .top-link-row {
    margin-left: -7px;
    margin-right: -7px;
  }

  .top-link-b, .top-line {
    margin-left: 7px;
    margin-right: 7px;
  }

  .top-align-b.v-join {
    margin-top: 0;
  }

  .top-search-b {
    margin-left: 7px;
    margin-right: 7px;
  }

  .search-field {
    width: 160px;
    font-size: 16px;
    line-height: 20px;
  }

  .btn-search, .btn-notification {
    width: 24px;
    height: 24px;
  }

  .home-col-l {
    padding-right: 40px;
  }

  .home-col-r {
    padding-left: 40px;
  }

  .btn-white.question {
    width: 160px;
  }

  .btn-white.eform {
    width: 200px;
  }

  .home-btn-b {
    top: 0%;
    bottom: auto;
    left: auto;
    right: 0%;
  }

  .home-btn-b.highlight {
    margin-top: 0;
  }

  .home-online-services-grey-b {
    padding: 20px;
  }

  .home-online-services-align-b._01 {
    margin-bottom: 20px;
    margin-left: -10px;
    margin-right: -10px;
  }

  .home-online-services-col {
    padding-left: 10px;
    padding-right: 10px;
  }

  .form-row.form-align {
    margin-left: -20px;
    margin-right: -20px;
  }

  .btn-green.confirm-login {
    padding-left: 25px;
    padding-right: 25px;
  }

  .txt-link-forgot-pw {
    margin-left: 40px;
  }

  .img-inner-banner.application-record {
    background-image: url('../images/banner-application-record2x.jpg');
  }

  .btn-b.question {
    margin-left: 20px;
    margin-right: 20px;
  }

  .btn-b.online-services {
    width: 33.33%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .btn-b.online-services.first {
    flex: none;
    order: -1;
  }

  .btn-b.online-services.right {
    flex: 1;
  }

  .btn-b.eform, .btn-b.confirm {
    margin-left: 20px;
    margin-right: 20px;
  }

  .form-col {
    padding-left: 20px;
    padding-right: 20px;
  }

  .bottom-btn-row.question {
    margin-top: 40px;
  }

  .scroll-b.pw {
    overflow: visible;
  }

  .question-detail-col-l {
    margin-right: 40px;
  }

  .question-detail-grey-b {
    padding: 40px;
  }

  .question-name-col.left {
    margin-right: 40px;
  }

  .question-txt-field {
    min-width: 200px;
  }

  .question-detail-b {
    margin-bottom: 40px;
  }

  .table-col, .table-title-col {
    padding-left: 20px;
    padding-right: 20px;
  }

  .tabs-line.online-servoces {
    left: 40px;
    right: 40px;
  }

  .tab-col-l {
    width: 66.66%;
  }

  .tab-col-l.loan {
    width: 50%;
  }

  .tab-col-r {
    width: 33.33%;
    margin-top: 0;
    position: relative;
  }

  .tab-col-r.loan {
    width: 50%;
  }

  .tab-align-b {
    display: flex;
  }

  .calculator-img-dividend {
    background-position: 50% 0;
    display: block;
  }

  .calculator-result-dividend {
    height: 210px;
    margin-left: 40px;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .calculator-result-content-b {
    margin-top: 40px;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .tabs-menu.online-servces {
    padding-left: 40px;
    padding-right: 40px;
  }

  .calculator-img-savings {
    background-position: 50% 0;
    display: block;
  }

  .calculator-result-savings {
    z-index: 10;
    height: 286px;
    margin-top: 40px;
    margin-left: 40px;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .calculator-img-loan {
    background-position: 50% 0;
    display: block;
  }

  .calculator-result-loan {
    height: 315px;
    margin-top: 0;
    margin-left: 40px;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .loan-result-col-r {
    width: 155px;
    padding-right: 50px;
  }

  .loan-result-col-l {
    flex: 1;
  }

  .loan-result-underline {
    margin-right: 50px;
  }

  .loan-result-b {
    margin-left: 0;
    margin-right: 0;
  }

  .txt-loan-interest {
    margin-right: 0;
  }

  .calculator-result-loan-b {
    margin-top: 40px;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .publications-col-l {
    padding-right: 40px;
  }

  .publications-col-r {
    padding-left: 40px;
  }

  .newsletter-link:hover, .annual-link:hover {
    color: var(--light-sea-green);
  }

  .games-detail-grey-b {
    padding: 40px;
  }

  .online-services-detail-heading-b {
    position: relative;
  }

  .online-services-col-l {
    width: 585px;
  }

  .online-services-btn-b {
    flex-direction: row;
    justify-content: space-between;
    margin-left: -20px;
    margin-right: -20px;
    display: flex;
  }

  .print-b {
    margin-top: 0;
    margin-bottom: 7px;
    position: absolute;
    top: auto;
    bottom: 0%;
    left: auto;
    right: 0%;
  }

  .pw-align-b {
    width: 16.66%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .vaccine-top-col-r {
    font-size: 16px;
    line-height: 18px;
  }

  .table-padding-b, .padding-b {
    padding-left: 40px;
    padding-right: 40px;
  }

  .question-txt-field-grey {
    min-width: 200px;
  }

  .activities-col-l {
    padding-right: 40px;
  }

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

  .ans-table-title-col {
    padding-left: 20px;
    padding-right: 20px;
  }

  .contact-info-green-b {
    padding: 40px 40px 35px;
  }

  .link-update-profile-b {
    margin-left: 40px;
    margin-right: 40px;
  }

  .pop-notification {
    margin-top: 55px;
    display: none;
  }

  .table-vaccinegame-col {
    padding-left: 20px;
    padding-right: 20px;
  }

  .header-info-row {
    padding-top: 7px;
  }

  .footer-badge-img {
    height: 48px;
  }

  .btn-se-info-confirm.confirm-login {
    padding-left: 25px;
    padding-right: 25px;
  }

  .form-ui-now, .form-ui-prev {
    margin-left: -20px;
    margin-right: -20px;
  }
}

@media screen and (min-width: 1440px) {
  .all {
    padding-left: 15%;
  }

  .header {
    width: 15%;
  }

  .nav-link {
    font-size: 18px;
  }

  .footer-col-r {
    width: 48%;
  }

  .footer-app-link-b, .top-link-row {
    margin-left: -10px;
    margin-right: -10px;
  }

  .top-info-b {
    margin-left: 20px;
  }

  .top-link-b, .top-line, .top-search-b {
    margin-left: 10px;
    margin-right: 10px;
  }

  .header-public {
    width: 15%;
  }

  .loan-result-col-r {
    width: 180px;
  }

  .loan-result-b {
    margin-left: 20px;
    margin-right: 20px;
  }

  .header-chinese {
    width: 15%;
  }

  .pw-align-b {
    width: 14.28%;
  }

  .about-align-b {
    margin-bottom: 20px;
  }

  .about-align-b.last {
    margin-bottom: 0;
  }

  .vaccine-top-info-b {
    margin-left: 20px;
  }

  .upload-image-b {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .watermark-txt {
    font-size: 45px;
  }

  .footer-app-item {
    padding-left: 10px;
    padding-right: 10px;
  }

  .footer-badge-img {
    height: 58px;
  }

  .internal-watermark-col {
    width: 33.3%;
  }

  .internal-watermark-col.col-2 {
    margin-top: 6%;
  }

  .internal-watermark-col.col-3 {
    display: block;
  }

  .internal-only-watermark-txt {
    font-size: 2.2vw;
  }
}

@media screen and (max-width: 991px) {
  h3 {
    font-size: 17px;
    line-height: 23px;
  }

  .section-content.home {
    padding-top: 65px;
  }

  .all {
    padding-top: 120px;
    padding-left: 0;
  }

  .top-bar {
    display: none;
  }

  .header {
    background-color: var(--white);
    width: 100%;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    top: 0%;
    bottom: auto;
    left: 0%;
    right: 0%;
  }

  .logo {
    width: 214px;
  }

  .logo.mobile {
    display: block;
  }

  .container, .container.vaccine, .top-container {
    padding-left: 5%;
    padding-right: 5%;
  }

  .nav-menu {
    z-index: 800;
    background-color: var(--teal);
    margin-top: 120px;
    position: fixed;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
    overflow: auto;
  }

  .nav-link {
    padding-left: 6%;
    padding-right: 6%;
  }

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

  .nav-link.mobile {
    display: block;
  }

  .header-container {
    max-width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 5%;
    padding-right: 5%;
    position: relative;
  }

  .nav-dropdown {
    display: none;
  }

  .footer-link-row {
    float: left;
    justify-content: space-between;
    max-width: none;
    margin-top: 0;
    margin-bottom: 20px;
  }

  .footer-col-l {
    float: none;
    width: 100%;
  }

  .footer-col-r {
    float: none;
    width: auto;
    padding-top: 20px;
  }

  .footer-app-link.left {
    margin-right: 10px;
  }

  .footer-app-link-b {
    margin-top: 5px;
  }

  .footer-b {
    display: block;
  }

  .footer-link-b {
    float: left;
  }

  .footer-dropdown-toggle {
    padding-top: 20px;
  }

  .footer-dropdown-list {
    padding: 10px 5%;
  }

  .footer-link {
    padding-top: 20px;
  }

  .footer-link.no-padding {
    display: none;
  }

  .footer-dropdown-link {
    margin-top: 5px;
    margin-bottom: 5px;
    line-height: 24px;
  }

  .menu-btn {
    padding: 6px 0;
  }

  .menu-btn.w--open {
    background-color: rgba(0, 0, 0, 0);
  }

  .menu-btn.popup-link.popup-close {
    z-index: 800;
  }

  .menu-line-01, .menu-line-02, .menu-line-03 {
    background-color: var(--teal);
    width: 28px;
    height: 2px;
    margin-top: 8px;
    margin-bottom: 8px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .top-col-r {
    justify-content: center;
  }

  .top-info-row.vaccine {
    padding-top: 0;
    display: none;
  }

  .top-link-row.vaccine {
    height: auto;
  }

  .top-info-b {
    float: none;
    margin-left: 0;
    margin-right: 0;
  }

  .top-info-b.first {
    order: -1;
    margin-left: 0;
  }

  .top-info-b.last {
    order: 1;
    margin-right: 0;
  }

  .top-link-b {
    margin-left: 0;
    margin-right: 0;
  }

  .top-search-b {
    border-top: 1px solid var(--light-sea-green);
    margin-top: 15px;
    margin-left: 0;
    margin-right: 0;
    padding-top: 30px;
    padding-bottom: 5px;
  }

  .search-field {
    border-color: var(--teal);
    width: 100%;
    height: 40px;
    padding-top: 10px;
    padding-bottom: 11px;
    font-size: 16px;
  }

  .btn-search {
    flex: none;
    width: 30px;
    height: 30px;
  }

  .img-btn-hover {
    z-index: 10;
  }

  .search-form {
    width: 100%;
    padding-left: 6%;
    padding-right: 6%;
  }

  .btn-notification {
    width: 30px;
    height: 30px;
  }

  .arrow-l {
    margin-left: 2.5%;
  }

  .arrow-r {
    margin-right: 2.5%;
  }

  .home-slide-nav {
    margin-bottom: -45px;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .home-col-l {
    width: 50%;
    padding-right: 2.5%;
  }

  .home-col-r {
    width: 50%;
    padding-left: 2.5%;
  }

  .btn-white.question {
    width: 160px;
  }

  .btn-white.calculator, .btn-white.eform {
    width: 100%;
  }

  .txt-title {
    font-size: 17px;
    line-height: 23px;
  }

  .link-align-b.highlight {
    margin-left: 5%;
    margin-right: 5%;
  }

  .home-calendar-col-r {
    margin-left: 20px;
  }

  .calendar-link {
    font-size: 17px;
    line-height: 23px;
  }

  .home-calendar-col-l {
    width: 220px;
  }

  .home-online-services-align-b {
    display: block;
  }

  .home-online-services-align-b._01 {
    margin-top: -15px;
    margin-bottom: 0;
  }

  .home-online-services-col {
    width: 100%;
    margin-top: 15px;
  }

  .home-center-line {
    margin-left: 50%;
  }

  .nav-mobile-b {
    border-top: 1px solid var(--light-sea-green);
    margin-top: 15px;
    padding-top: 15px;
    padding-bottom: 30px;
    display: block;
  }

  .nav-mobile-link-b {
    padding-left: 6%;
    padding-right: 6%;
  }

  .notification-mobile-btn {
    margin-right: 20px;
    display: block;
    position: relative;
  }

  .header-col-r {
    float: right;
    align-items: center;
    display: flex;
  }

  .header-col-r.v-joinus {
    display: none;
  }

  .header-mobile-b {
    border-bottom: 5px solid var(--light-sea-green);
    background-color: var(--white);
    padding-top: 15px;
    padding-bottom: 0;
    display: block;
  }

  .header-public {
    background-color: var(--white);
    width: 100%;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    top: 0%;
    bottom: auto;
    left: 0%;
    right: 0%;
  }

  .top-bar-public {
    display: none;
  }

  .form-row.form-align, .form-row.form-flex-center {
    margin-left: -10px;
    margin-right: -10px;
  }

  .btn-green.login, .btn-green.calculator, .btn-green.eform, .btn-green.confirm-login {
    width: 100%;
  }

  .txt-link-forgot-pw {
    margin-top: 20px;
    margin-left: 0;
  }

  .txt-link-forgot-pw.home {
    margin-top: 0;
    margin-left: 30px;
  }

  .img-inner-banner {
    padding-top: 20%;
  }

  .heading-b.chin-ver {
    flex-direction: column;
    align-items: flex-start;
  }

  .container-900 {
    max-width: 100%;
    padding-left: 5%;
    padding-right: 5%;
  }

  .container-900.highlight {
    padding-left: 0;
    padding-right: 0;
  }

  .login-col-l {
    padding-right: 5%;
  }

  .login-btn-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .pop-content-b {
    width: 90%;
    margin: 100px auto;
    position: static;
    transform: none;
  }

  .btn-b.calculator, .btn-b.eform {
    width: 50%;
  }

  .form-col {
    padding-left: 10px;
    padding-right: 10px;
  }

  .paging-arrow-l {
    margin-right: 5px;
  }

  .paging-arrow-r {
    margin-left: 5px;
  }

  .paging-link {
    margin-left: 10px;
    margin-right: 10px;
  }

  .back-btn-row.highlight {
    justify-content: center;
    margin-left: 5%;
    margin-right: 5%;
  }

  .scroll-b.filter {
    height: 255px;
  }

  .scroll-b.savings {
    height: 192px;
  }

  .question-detail-col-l {
    width: 100%;
  }

  .question-deatil-col-r {
    width: 100%;
    margin-top: 40px;
  }

  .question-detail-align-b {
    display: block;
  }

  .thank-txt-b.chi {
    padding-left: 20px;
    padding-right: 20px;
  }

  .highlight-slider {
    width: 100%;
  }

  .arrow-l-green {
    opacity: 1;
    background-image: url('../images/arrow-l.svg');
    margin-left: 2.5%;
  }

  .arrow-r-green {
    opacity: 1;
    background-image: url('../images/arrow-r.svg');
    margin-right: 2.5%;
  }

  .highlight-slide {
    border-style: none;
    border-radius: 0;
    width: 100%;
  }

  .slide-nav {
    margin-bottom: -45px;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .enlarge-img-b {
    width: 100%;
    margin: 80px 0 65px;
  }

  .btn-close {
    width: 28px;
    height: 28px;
    margin-top: -55px;
    margin-right: 5%;
  }

  .table-col.date {
    width: 30%;
  }

  .table-col.post {
    width: 25%;
  }

  .table-col.details {
    width: 45%;
  }

  .table {
    padding-right: 5%;
  }

  .table-title-col.date {
    width: 30%;
  }

  .table-title-col.post {
    width: 25%;
  }

  .table-title-col.details {
    width: 45%;
  }

  .calendar-col-l {
    width: 60%;
    margin-right: 5%;
  }

  .tabs-line.online-servoces {
    left: 5%;
    right: 5%;
  }

  .calculator-btn-row {
    margin-right: -20px;
    display: flex;
  }

  .tabs-menu.online-servces {
    width: 90%;
    margin-left: 5%;
    margin-right: 5%;
    padding-left: 0;
    padding-right: 0;
  }

  .heading-subtitle {
    margin-top: 5px;
    margin-left: 0;
  }

  .newsletter-link-col {
    padding-left: 5px;
    padding-right: 5px;
  }

  .newsletter-align-b {
    margin-left: -5px;
    margin-right: -5px;
  }

  .newsletter-txt-b {
    padding-right: 10px;
  }

  .annual-link-col {
    padding-left: 5px;
    padding-right: 5px;
  }

  .annual-b {
    margin-left: -5px;
    margin-right: -5px;
  }

  .games-b {
    min-height: 350px;
  }

  .header-chinese {
    background-color: var(--white);
    width: 100%;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0;
    top: 0%;
    bottom: auto;
    left: 0%;
    right: 0%;
  }

  .top-bar-chinese {
    display: none;
  }

  .online-services-link-col {
    width: 50%;
  }

  .online-services-col-r.withdrawal-of-savings, .online-services-col-r.change-of-savings {
    min-height: 0;
  }

  .pw-align-b {
    padding-right: 10px;
  }

  .container-780 {
    max-width: 100%;
    padding-left: 5%;
    padding-right: 5%;
  }

  .radio-align-row {
    padding-left: 10px;
    padding-right: 10px;
  }

  .left-margin-20 {
    margin-left: 10px;
  }

  .eform-btn-b {
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
    margin-left: -10px;
    margin-right: -10px;
  }

  .eform-btn-row {
    width: 100%;
    margin-top: 20px;
  }

  .upload-col-l {
    padding-right: 12.5px;
  }

  .upload-col-r {
    padding-left: 12.5px;
  }

  .vaccine-top-col-r {
    justify-content: center;
    display: none;
  }

  .top-bar-vaccine {
    height: auto;
    padding-bottom: 0;
    display: block;
  }

  .table-padding-b, .table-padding-b.vaccine {
    padding-left: 5%;
    padding-right: 0;
  }

  .padding-b, .padding-60 {
    padding-left: 5%;
    padding-right: 5%;
  }

  .fail-txt-b {
    padding-left: 10px;
    padding-right: 10px;
  }

  .vaccine-form-b {
    display: none;
  }

  .activities-step-row {
    padding: 10px;
  }

  .activities-tick-box {
    width: 25%;
  }

  .activities-radio-btn-field {
    margin-right: 20px;
  }

  .btn-upload-photo {
    font-size: 16px;
  }

  .activites-upload-row {
    padding-left: 10px;
    padding-right: 10px;
  }

  .img-about-logo {
    max-width: 200px;
  }

  .btn-top-b {
    margin-right: -5%;
  }

  .about-history-align-b {
    display: block;
  }

  .about-history-col-l {
    width: 100%;
    padding-right: 0;
  }

  .about-history-col-r {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    width: 100%;
    margin-top: -10px;
    padding-top: 0;
  }

  .about-slider {
    margin-left: 0;
    margin-right: 5%;
  }

  .about-menu-slider-b {
    margin-left: 20px;
  }

  .about-offices-col-l {
    width: 75%;
  }

  .about-offices-col-r {
    width: 25%;
  }

  .about-offices-caption-b {
    margin-top: 0;
    padding-left: 0;
  }

  .about-offices-caption-b._50 {
    width: 100%;
  }

  .about-offices-img-b {
    width: 100%;
    margin-bottom: 5px;
    padding-left: 0;
  }

  .txt-tablet {
    display: block;
  }

  .sitemap-col {
    padding-left: 15px;
    padding-right: 15px;
  }

  .sitemap-align-b {
    margin-left: -15px;
    margin-right: -15px;
  }

  .contact-table {
    width: 100%;
  }

  .img-contact {
    margin-right: 5%;
  }

  .contact-padding-b {
    width: 65%;
    min-width: 0;
  }

  .under-construction-b {
    height: 100px;
  }

  .under-construction-align-b {
    display: block;
  }

  .print-content-b {
    width: 90%;
    max-width: none;
    height: auto;
    padding-bottom: 70px;
    padding-left: 5%;
    padding-right: 5%;
  }

  .print-footer-b, .link-update-profile-b {
    margin-left: 5%;
    margin-right: 5%;
  }

  .pop-notification {
    width: 100%;
    margin-top: 85px;
    top: 0%;
    bottom: auto;
    left: 0%;
    right: 0%;
  }

  .notification-mobile-b {
    display: block;
  }

  .form-remind-b {
    padding-left: 10px;
  }

  .privacy-id {
    margin-top: -130px;
  }

  .header-top-row {
    justify-content: space-between;
    padding-bottom: 15px;
    display: flex;
  }

  .header-top-row.v-join {
    align-items: center;
    height: 100px;
    display: flex;
  }

  .header-info-row {
    background-color: var(--f0f0f0);
    justify-content: space-between;
    align-items: center;
    padding: 9px 5%;
    font-size: 17px;
    line-height: 17px;
    display: flex;
  }

  .vaccine-header-info-b {
    margin-top: 15px;
    display: block;
  }

  .upload-image-b {
    position: relative;
  }

  .upload-image-b.pdf {
    margin-top: -41px;
    padding: 20px 10px 20px 20px;
  }

  .upload-image-hover-b {
    background-image: url('../images/eye.svg'), linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5));
    background-position: 50%, 0 0;
    background-repeat: no-repeat, repeat;
    background-size: 35%, auto;
    display: none;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .upload-image-hover-b-m {
    opacity: .5;
    background-image: url('../images/eye.svg'), linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5));
    background-position: 50%, 0 0;
    background-repeat: no-repeat, repeat;
    background-size: 35%, auto;
    display: block;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .upload-image-popup-b {
    padding: 10px 10px 130px 20px;
  }

  .pop-image-b.vaccinegame-2 {
    background-image: url('../images/doc-sample-hkid2x.jpg');
  }

  .upload-image-pdf.confirm {
    width: 75%;
  }

  .vgame2-table-upload-col.col-3 {
    width: 200px;
  }

  .vgame2-table-upload-col.col-sample {
    width: 120px;
  }

  .agm-title {
    width: 200px;
  }

  .agm-title.title-2 {
    width: 600px;
  }

  .agm-title.title-3 {
    width: 520px;
  }

  .intro-row-fieldname {
    width: 120px;
  }

  .btn-se-info-confirm.login, .btn-se-info-confirm.calculator, .btn-se-info-confirm.eform, .btn-se-info-confirm.confirm-login {
    width: 100%;
  }

  .form-ui-now, .form-ui-prev {
    margin-left: -10px;
    margin-right: -10px;
  }
}

@media screen and (max-width: 767px) {
  body {
    font-size: 17px;
    line-height: 27px;
  }

  h1 {
    font-size: 28px;
    line-height: 30px;
  }

  h2 {
    margin-bottom: 10px;
    font-size: 20px;
    line-height: 24px;
  }

  h4 {
    font-size: 17px;
  }

  .section-content {
    padding-top: 30px;
    padding-bottom: 30px;
  }

  .section-content.home {
    padding-top: 45px;
  }

  .section-content.games {
    padding-bottom: 0;
  }

  .section-content.suggestion {
    background-image: url('../images/contact-us-suggestion-m2x.jpg');
    background-position: 50% 100%;
    background-size: contain;
    padding-bottom: 25%;
  }

  .all {
    padding-top: 100px;
  }

  .logo {
    width: 171px;
    height: 40px;
    padding-left: 0;
  }

  .container.vaccine {
    padding-left: 5%;
    padding-right: 5%;
  }

  .nav-menu {
    margin-top: 100px;
  }

  .footer-link-row {
    flex-direction: column;
    margin-left: 0;
    margin-right: 0;
    display: flex;
  }

  .footer-app-link-b {
    margin-left: -5px;
    margin-right: -5px;
  }

  .footer-link-b {
    margin-right: 2.5%;
  }

  .footer-dropdown-toggle, .footer-link {
    padding-left: 0;
    padding-right: 0;
  }

  .menu-btn.popup-link {
    padding-top: 1px;
    padding-bottom: 1px;
  }

  .top-info-row.vaccine {
    display: none;
  }

  .form-b._500 {
    width: 100%;
  }

  .form-b.top-margin-20 {
    margin-top: 15px;
  }

  .arrow-l {
    background-size: 14px;
    margin-left: 2%;
  }

  .arrow-r {
    background-size: 14px;
    margin-right: 2%;
  }

  .home-slide-nav {
    margin-bottom: -40px;
  }

  .img-home-slide {
    padding-top: 38%;
  }

  .home-col-l {
    float: none;
    width: 100%;
    padding-right: 0%;
  }

  .home-col-r {
    float: none;
    width: 100%;
    padding-left: 0%;
  }

  .heading {
    letter-spacing: 1px;
    font-size: 30px;
    line-height: 34px;
  }

  .heading.highlight {
    width: auto;
  }

  .home-news-b {
    margin-bottom: 15px;
    padding-bottom: 5px;
  }

  .btn-white {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  .btn-white._180, .btn-white.question, .btn-white._230, .btn-white.eform {
    width: 100%;
  }

  .home-btn-b {
    justify-content: center;
    margin-top: -3px;
  }

  .home-btn-b.highlight {
    margin-top: -3px;
  }

  .home-notice-b {
    margin-bottom: 15px;
    padding-bottom: 5px;
  }

  .home-highlight-b {
    border-bottom: 1px solid var(--ccc);
    margin-bottom: 15px;
    padding-bottom: 15px;
  }

  .link-txt-b {
    line-height: 27px;
  }

  .link-col-l {
    margin-bottom: 15px;
    padding-right: 0;
  }

  .news-col-r {
    width: 200px;
    margin-left: auto;
    margin-right: auto;
  }

  .link-align-b, .link-align-b.question {
    display: block;
  }

  .home-online-services-link {
    margin-top: 15px;
  }

  .home-center-line {
    display: none;
  }

  .header-mobile-b {
    padding-top: 10px;
  }

  .home-login-b {
    margin-bottom: 15px;
    padding-bottom: 15px;
  }

  .field-label {
    line-height: 22px;
  }

  .field-label.mobile-show {
    display: block;
  }

  .field-label._365 {
    width: 100%;
  }

  .txt-field {
    height: 42px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .txt-field.event-hkid {
    width: 40px;
    height: 40px;
  }

  .form-row {
    margin-bottom: 15px;
  }

  .form-row.form-align {
    margin-bottom: 0;
  }

  .form-row.form-flex-center, .form-row.summary {
    display: block;
  }

  .btn-green {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  .btn-green._160, .btn-green._230, .btn-green.eform, .btn-green._180 {
    width: 100%;
  }

  .txt-link-forgot-pw {
    margin-top: 25px;
    font-size: 15px;
  }

  .img-inner-banner.publications {
    background-image: linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, .3)), url('../images/banner-publications2x.jpg');
    background-position: 0 0, 75%;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
  }

  .heading-b.dl, .heading-b._200 {
    width: 200px;
  }

  .heading-b._150 {
    width: 150px;
  }

  .login-col-l {
    width: 100%;
    padding-right: 0;
  }

  .login-col-r {
    display: none;
  }

  .login-btn-row {
    margin-top: 30px;
  }

  .login-attention-b {
    width: 100%;
    margin-top: 15px;
    margin-left: 0;
    padding: 15px 15px 5px;
    position: static;
  }

  .first-login-col-r {
    display: none;
  }

  .tick-box-link-b {
    margin-bottom: 15px;
  }

  .tick-box-link-b.bottom-margin-5 {
    margin-bottom: 5px;
  }

  .top-margin-40 {
    margin-top: 30px;
  }

  .pop-content-b {
    margin-top: 80px;
    padding: 15px;
  }

  .btn-b {
    width: 100%;
    margin-top: 15px;
    margin-left: 0;
    margin-right: 0;
  }

  .btn-b.question {
    margin-left: 0%;
    margin-right: 0%;
  }

  .btn-b.calculator {
    width: 100%;
  }

  .btn-b.eform {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .btn-b.confirm {
    order: -1;
    width: 100%;
    margin-left: 0%;
    margin-right: 0%;
  }

  .form-col {
    float: none;
    margin-bottom: 15px;
  }

  .form-col._50, .form-col._30, .form-col._60 {
    width: 100%;
  }

  .form-col._100.bottom-margin-10 {
    margin-bottom: 15px;
  }

  .forgot-pw-btn-row {
    margin-top: 15px;
  }

  .bottom-btn-row {
    flex-direction: column-reverse;
    margin-top: 0;
  }

  .bottom-btn-row.question {
    margin-top: 0;
  }

  .bottom-btn-row.vaccine-2 {
    flex-flow: row-reverse wrap;
  }

  .link-btn-b {
    width: 200px;
    margin: 20px auto 0;
    position: static;
  }

  .link-btn-b.question {
    width: 100%;
    margin-top: 20px;
    margin-bottom: 0;
    margin-left: 0;
    position: static;
  }

  .news-detail-col-r {
    margin-left: auto;
    margin-right: auto;
  }

  .back-btn-row {
    flex-direction: column;
    display: flex;
  }

  .btn-enlarge-b {
    order: -1;
    margin-bottom: 30px;
  }

  .btn-back {
    order: 1;
  }

  .filer-row {
    margin-bottom: 30px;
    padding-top: 15px;
    padding-bottom: 15px;
  }

  .scroll-b.newsletter {
    padding: 15px;
  }

  .scroll-b.pw {
    margin-bottom: 15px;
  }

  .question-col-l {
    width: 100%;
    margin-top: 20px;
  }

  .question-link-row {
    margin-bottom: 0;
    padding-top: 20px;
  }

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

  .question-detail-img-b {
    width: 100%;
    margin-bottom: 15px;
  }

  .question-deatil-col-r {
    margin-top: 25px;
  }

  .question-detail-grey-b {
    padding: 15px;
  }

  .question-name-row {
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .question-name-col.left {
    float: none;
    margin-right: 0;
  }

  .question-txt-field {
    margin-left: 0;
  }

  .question-align-b {
    display: block;
  }

  .txt-area {
    height: 42px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .radio-btn-field.join-us {
    margin-left: 0;
  }

  .failed-txt-b {
    margin-bottom: -10px;
  }

  .thank-txt-b {
    margin-top: 30px;
    font-size: 16px;
    line-height: 22px;
  }

  .thank-txt-b.chi {
    padding-left: 0;
    padding-right: 0;
    font-size: 16px;
  }

  .highlight-col-r {
    width: 200px;
    margin-left: auto;
    margin-right: auto;
  }

  .highlight-slider-b {
    margin-top: 30px;
  }

  .arrow-l-green {
    background-size: 14px;
    margin-left: 2%;
  }

  .arrow-r-green {
    background-size: 14px;
    margin-right: 2%;
  }

  .slide-nav {
    margin-bottom: -40px;
  }

  .list-item.mobile-full {
    display: block;
  }

  .list {
    line-height: 23px;
  }

  .list.game, .list.internal {
    margin-bottom: 30px;
  }

  .dl-b {
    margin-top: 30px;
    margin-bottom: 30px;
    padding-top: 15px;
  }

  .icon-link {
    padding-left: 33px;
  }

  .dl-align-b {
    width: 100%;
    margin-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .enlarge-img-b {
    margin-top: 70px;
    margin-bottom: 60px;
  }

  .btn-close {
    margin-top: -50px;
  }

  .table-title-row {
    font-size: 18px;
    line-height: 22px;
  }

  .table-col {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .table-col.post {
    width: 30%;
  }

  .table-col.details {
    width: 40%;
  }

  .table {
    min-width: 800px;
  }

  .table-title-col {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .table-title-col.post {
    width: 30%;
  }

  .table-title-col.details {
    width: 40%;
  }

  .calendar-col-l {
    width: 100%;
    margin-bottom: 20px;
    margin-right: 0;
  }

  .calendar-align-b {
    display: block;
  }

  .change-email-b {
    margin-top: 10px;
    margin-bottom: 30px;
  }

  .list-assumption {
    width: 100%;
  }

  .tab {
    text-align: left;
    border-left: 5px solid rgba(0, 0, 0, 0);
    height: 22px;
    margin-bottom: 15px;
    padding-bottom: 0;
    padding-left: 10px;
    padding-right: 5px;
    font-size: 16px;
    line-height: 22px;
  }

  .tab.w--current {
    border-left: 5px solid var(--light-sea-green);
    border-bottom-style: none;
  }

  .tab.structure, .tab.history, .tab.vision, .tab.dividend, .tab.savings, .tab.loan-interest {
    width: 100%;
  }

  .tab.ebanking, .tab.application-of-welfare-benefits, .tab.application-of-activities-events, .tab.update-profile {
    width: 100%;
    font-size: 17px;
    line-height: 23px;
  }

  .tab-pane {
    padding-top: 15px;
  }

  .tabs-line {
    width: 1px;
    margin-top: 0;
    margin-left: 2px;
    top: 0%;
    bottom: auto;
    left: 0%;
    right: auto;
  }

  .tabs-line.online-servoces {
    height: 133px;
    margin-top: 0;
    margin-left: 2px;
    margin-right: 0;
    right: 0%;
  }

  .tabs-line.calculator {
    height: 96px;
  }

  .tabs-line.faqs {
    height: 58px;
  }

  .calculator-field-b {
    padding-right: 0;
  }

  .calculator-field-b.last {
    padding-left: 0;
    padding-right: 25px;
  }

  .calculator-col-l {
    float: none;
    width: 100%;
    height: auto;
    margin-bottom: 5px;
    display: block;
  }

  .calculator-col-l.savings {
    margin-bottom: 10px;
  }

  .calculator-col-l.loan-interest {
    width: 100%;
    padding-top: 5px;
  }

  .calculator-col-l._40, .calculator-col-r {
    width: 100%;
  }

  .calculator-col-r.loan-interest {
    align-items: flex-start;
    width: 100%;
    padding-top: 3px;
    padding-bottom: 3px;
  }

  .calculator-col-r._60 {
    width: 100%;
  }

  .calculator-row {
    margin-bottom: 20px;
    display: block;
  }

  .calculator-btn-row {
    flex-direction: column-reverse;
    margin-top: 15px;
    margin-left: 0;
    margin-right: 0;
    display: flex;
  }

  .calculator-remark-b {
    margin-top: 15px;
    padding-top: 15px;
  }

  .bottom-margin-10 {
    margin-bottom: 5px;
  }

  .tab-align-b {
    padding-top: 0;
  }

  .calculator-result-content-b {
    overflow: auto;
  }

  .tabs-menu {
    flex-direction: column;
    display: flex;
  }

  .savngs-dropdown-toggle {
    width: 85px;
  }

  .padding-field-b {
    padding-right: 0;
  }

  .padding-field-b.right-margin, .padding-field-b.left-margin-0 {
    padding-left: 0;
  }

  .loan-result-col-r {
    font-size: 14px;
    line-height: 20px;
  }

  .loan-result-col-l {
    min-width: 250px;
    font-size: 14px;
    line-height: 20px;
  }

  .loan-result-row {
    margin-bottom: 3px;
  }

  .loan-result-row.result {
    padding-top: 3px;
  }

  .loan-result-underline {
    margin-bottom: -7px;
  }

  .calculator-result-loan-b {
    overflow: auto;
  }

  .heading-subtitle {
    font-size: 16px;
    line-height: 20px;
  }

  .publications-col-l {
    width: 100%;
    padding-right: 0;
    display: block;
  }

  .publications-col-r {
    border-top: 1px solid var(--ccc);
    border-left-style: none;
    width: 100%;
    margin-top: 20px;
    padding-top: 15px;
    padding-left: 0;
  }

  .publications-b {
    margin-bottom: 15px;
    padding-bottom: 15px;
    display: block;
  }

  .newsletter-link {
    font-size: 17px;
    line-height: 23px;
  }

  .newsletter-txt-b {
    padding-right: 0;
  }

  .newsletter-list-b {
    height: 360px;
  }

  .newsletter-link-row {
    margin-top: 15px;
  }

  .annual-link-col {
    width: 20%;
    margin-bottom: 15px;
  }

  .annual-link {
    font-size: 16px;
    line-height: 22px;
  }

  .annual-b {
    margin-bottom: -15px;
  }

  .games-content-b {
    width: 100%;
    position: static;
    transform: none;
  }

  .games-b {
    background-position: 40% 100%;
    background-size: auto 300px;
    min-height: auto;
    padding-bottom: 315px;
  }

  .heading-chi {
    font-size: 26px;
  }

  .games-detail-grey-b {
    padding: 15px;
  }

  .games-txt-b {
    width: 100%;
  }

  .games-expired-b {
    width: 100%;
    padding: 20px;
  }

  .tab-txt-b {
    height: auto;
  }

  .online-services-align-b {
    padding-bottom: 10px;
  }

  .online-services-link-col {
    width: 100%;
    margin-bottom: 10px;
  }

  .online-services-link {
    height: 90px;
    line-height: 23px;
  }

  .online-services-img-b {
    width: 70px;
    height: 70px;
  }

  .txt-desktop {
    display: none;
  }

  .txt-mobile {
    display: block;
  }

  .online-services-temp-b {
    margin-top: -10px;
    padding-top: 10px;
  }

  .breadcrumb-b {
    margin-bottom: 3px;
    font-size: 12px;
    line-height: 14px;
  }

  .arrow-breadcrumb {
    background-size: auto 10px;
    width: 20px;
    height: 14px;
  }

  .btn-confirm {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  .btn-confirm._220, .btn-confirm._270 {
    width: 100%;
  }

  .online-services-b {
    padding: 15px;
  }

  .online-services-col-l {
    width: 100%;
    padding-right: 0;
  }

  .online-services-col-r {
    flex: none;
    width: 100%;
    min-height: 0;
    margin-bottom: 15px;
    padding-top: 50%;
    padding-bottom: 0;
    padding-right: 0;
  }

  .online-services-col-r.withdrawal-of-savings, .online-services-col-r.change-of-savings {
    flex: none;
  }

  .online-services-col-r.hospitalization {
    background-position: 50% 35%;
  }

  .online-services-detail-b {
    flex-direction: column-reverse;
  }

  .online-services-field-b {
    padding-right: 0;
  }

  .online-services-btn-b {
    flex-direction: column-reverse;
  }

  .pop-confirm-b {
    width: 90%;
    margin-top: 80px;
    padding: 15px;
  }

  .print-b {
    margin-top: 30px;
    margin-bottom: -20px;
  }

  .calculator-print-b {
    flex-direction: column;
    justify-content: space-between;
    height: 60px;
    margin-bottom: 0;
    margin-right: -20px;
    display: flex;
    top: 50%;
    bottom: auto;
    left: auto;
    right: 0%;
    transform: translate(0, -50%);
  }

  .pw-align-b {
    width: 33.33%;
    margin-bottom: 10px;
  }

  .pw-b {
    margin-bottom: 15px;
    padding-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .pw-notes-b {
    margin-bottom: 15px;
    padding-bottom: 15px;
  }

  .font-size-underline-b {
    margin-bottom: 15px;
    padding-bottom: 5px;
  }

  .bottom-margin-20 {
    margin-bottom: 15px;
  }

  .font-size-subtitle {
    margin-bottom: 5px;
  }

  .search-result-content-b {
    padding-left: 10px;
    padding-right: 10px;
  }

  .search-result-b {
    margin-bottom: 15px;
    padding: 10px;
    font-size: 17px;
  }

  .radio-align-row {
    float: none;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 15px;
  }

  .join-us-b {
    margin-bottom: 15px;
    padding-bottom: 15px;
  }

  .left-margin-40 {
    margin-left: 20px;
  }

  .radio-flex-b {
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .join-us-btn-b {
    margin-top: 20px;
  }

  .top-margin-20 {
    margin-top: 15px;
  }

  .eform-btn-b {
    flex-direction: column-reverse;
    margin-top: 15px;
    margin-left: 0;
    margin-right: 0;
  }

  .eform-btn-row {
    flex-direction: column-reverse;
    margin-top: 0;
  }

  .radio-align-eform {
    margin-bottom: 5px;
  }

  .hospitalization-upload-btn-b {
    flex-direction: column-reverse;
    margin-top: 15px;
  }

  .upload-col-l {
    width: 100%;
    padding-right: 0;
  }

  .upload-col-r {
    width: 100%;
    padding-left: 0;
  }

  .upload-col-r.full {
    margin-top: -15px;
    margin-bottom: -10px;
  }

  .upload-link-b {
    min-height: 0;
    padding-top: 20px;
    padding-bottom: 20px;
    font-size: 16px;
  }

  .upload-b {
    margin-bottom: 0;
    display: block;
  }

  .icon-upload {
    margin-bottom: 15px;
  }

  .upload-list-b {
    margin-left: 7px;
    margin-right: 7px;
    padding-top: 0;
    padding-bottom: 0;
  }

  .upload-link-row, .upload-row {
    margin-top: 7px;
    margin-bottom: 7px;
    padding-left: 10px;
    padding-right: 10px;
  }

  .upload-grey-b {
    margin-top: 15px;
    margin-bottom: 15px;
  }

  .top-margin-10 {
    margin-top: 5px;
  }

  .vaccine-top-col-r {
    display: none;
  }

  .top-bar-vaccine {
    padding-top: 10px;
  }

  .bottom-margin-40 {
    margin-bottom: 30px;
  }

  .question-grey-b {
    margin-bottom: 15px;
    padding: 15px;
  }

  .question-grey-b.finished {
    margin-top: 15px;
  }

  .question-grey-b.special-event-finish {
    margin-top: 15px;
    padding-top: 60px;
  }

  .step-b {
    margin-top: 12px;
    margin-right: 15px;
    padding: 2px 7px;
  }

  .fail-txt-b {
    margin-top: 0;
    margin-bottom: 20px;
  }

  .fail-txt-b.vaccine-game {
    font-size: 18px;
    line-height: 22px;
  }

  .question-txt-field-grey {
    margin-left: 0;
  }

  .btn-dim {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  .btn-dim._220, .btn-dim._300, .btn-dim._180 {
    width: 100%;
  }

  .vaccine-txt-b, .vaccine-txt-b.v-finish {
    padding-right: 100px;
  }

  .upload-link-align-b {
    padding-left: 15px;
    padding-right: 15px;
  }

  .activities-col-l {
    width: 100%;
    margin-bottom: 15px;
    padding-right: 0;
  }

  .activities-col-r {
    width: 100%;
  }

  .activities-grey-b {
    margin-bottom: 15px;
    padding: 15px;
  }

  .activities-step-row {
    margin-bottom: 30px;
    padding-left: 5px;
    padding-right: 5px;
  }

  .activities-circle-b {
    width: 34px;
    height: 34px;
    font-size: 14px;
    line-height: 34px;
  }

  .activities-circle-b.current {
    background-size: 34px;
    font-size: 20px;
  }

  .activities-step-txt-b {
    height: auto;
    font-size: 12px;
    line-height: 14px;
    display: none;
  }

  .activities-step-txt-b.current {
    display: block;
  }

  .must-b {
    position: static;
  }

  .activities-line {
    margin-top: 15px;
  }

  .activities-underline-b {
    margin-bottom: 15px;
    padding-top: 15px;
  }

  .activities-tick-box {
    width: 100%;
    margin-bottom: 5px;
  }

  .activities-declaration-b {
    margin-bottom: 15px;
  }

  .activities-combination-col {
    width: 100%;
  }

  .activities-combination-txt-b {
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 10px;
  }

  .activities-combination-row {
    margin-top: 17px;
  }

  .activities-combination-type-b {
    padding-bottom: 10px;
  }

  .activities-radio-align-row {
    float: none;
  }

  .activities-radio-btn-field {
    margin-right: 30px;
  }

  .top-padding-30 {
    padding-top: 0;
  }

  .btn-upload-photo {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 17px;
  }

  .activites-upload-row {
    margin-top: 0;
    margin-bottom: 10px;
  }

  .activities-upload-list-b {
    margin-left: 7px;
    margin-right: 7px;
    padding-top: 1px;
    padding-bottom: 1px;
  }

  .vaccine-line {
    margin-top: 0;
    margin-bottom: 15px;
  }

  .vaccine-upload-col-r {
    width: 100%;
    margin-top: -15px;
    margin-bottom: 0;
    padding-left: 0;
  }

  .grey-line {
    margin-top: 15px;
    margin-bottom: 15px;
  }

  .about-slogan-b {
    margin-bottom: 15px;
    padding-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .about-grey-b {
    padding: 15px;
  }

  .about-col-l {
    width: 100%;
    margin-top: 15px;
    padding-right: 0;
  }

  .about-col-r {
    text-align: center;
    width: 100%;
    padding-top: 15px;
    padding-bottom: 15px;
    position: static;
  }

  .about-align-b {
    flex-direction: column-reverse;
  }

  .about-align-b.last {
    flex-direction: column;
  }

  .img-about-logo {
    position: static;
    transform: none;
  }

  .about-goal-b {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  .about-img.right {
    width: 50%;
    margin-left: 7.5px;
    padding-top: 48%;
  }

  .about-img.left {
    width: 50%;
    margin-right: 7.5px;
    padding-top: 48%;
    display: none;
  }

  .about-img.left.mobile {
    display: block;
  }

  .about-img.strategies {
    width: 100%;
    margin-bottom: 15px;
    padding-top: 48%;
  }

  .about-strategies-b {
    width: 100%;
    padding-left: 0;
  }

  .about-col-img {
    width: 100%;
    margin-bottom: 15px;
    display: flex;
  }

  .about-structure-col-l {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    margin-bottom: 5px;
    display: flex;
  }

  .about-structure-align-b {
    margin-top: 15px;
    display: block;
  }

  .btn-next {
    margin-bottom: 15px;
  }

  .btn-top-b {
    bottom: 30px;
  }

  .about-history-col-r {
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
  }

  .img-about-history-logo {
    position: static;
    transform: none;
  }

  .about-menu-slider {
    width: 85px;
  }

  .about-slide-txt {
    font-size: 16px;
  }

  .about-menu-slide {
    height: 35px;
  }

  .about-menu-slider-b {
    margin-left: 10px;
  }

  .about-menu-line {
    height: 175px;
    margin-top: 20px;
  }

  .about-offices-col-l {
    width: 100%;
  }

  .about-offices-col-r {
    width: 100%;
    padding-left: 27px;
  }

  .about-offices-txt-b {
    padding-bottom: 0;
  }

  .about-offices-dot-b {
    position: static;
  }

  .about-offices-caption-b {
    text-align: left;
    width: 80%;
    padding-bottom: 30px;
  }

  .about-offices-img-b {
    float: none;
    width: 80%;
  }

  .about-offices-row {
    display: block;
    position: relative;
  }

  .links-icon {
    width: 40px;
  }

  .links-align-b {
    margin-bottom: -15px;
  }

  .links-row {
    width: 100%;
    margin-bottom: 15px;
  }

  .about-privacy-b {
    margin-bottom: 10px;
    padding-bottom: 15px;
  }

  .faqs-table-title-row {
    padding-left: 15px;
    padding-right: 15px;
    font-size: 20px;
  }

  .faqs-table-content-b {
    padding: 10px 10px 1px;
  }

  .faqs-link {
    padding-left: 10px;
    padding-right: 10px;
    line-height: 22px;
  }

  .faqs-expand-txt-b {
    padding: 10px;
  }

  .faqs-arrow-b {
    width: 42px;
    height: 42px;
  }

  .ans-table-b {
    padding-right: 10px;
  }

  .ans-table-title-col {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .faqs-table-b {
    padding-left: 10px;
    padding-right: 0;
  }

  .sitemap-col {
    width: 100%;
  }

  .bottom-margin-15 {
    margin-bottom: 15px;
  }

  .contact-table {
    width: 100%;
    min-width: 500px;
    padding-right: 20px;
  }

  .contact-align-b {
    display: block;
  }

  .img-contact {
    margin-top: 15px;
    margin-left: 0;
    padding-top: 50%;
    padding-bottom: 0;
    padding-right: 0;
  }

  .contact-padding-b, .contact-suggestion-txt-b {
    width: 100%;
  }

  .contact-info-b {
    display: block;
  }

  .contact-info-col-l {
    border-top-right-radius: 7px;
    border-bottom-left-radius: 0;
    width: 100%;
    height: 350px;
  }

  .contact-info-col-r {
    width: 100%;
    min-width: 0;
  }

  .contact-info-green-b {
    border-top-right-radius: 0;
    border-bottom-left-radius: 7px;
    padding: 15px 15px 10px;
  }

  .print-content-b {
    padding-top: 15px;
  }

  .txt-big {
    font-size: 20px;
    line-height: 26px;
  }

  .print-header-b {
    padding-top: 30px;
  }

  .print-title {
    font-size: 20px;
    line-height: 26px;
  }

  .print-contact-col {
    float: none;
    margin-bottom: 5px;
  }

  .print-contact-col-l {
    width: 70px;
  }

  .print-contact-row {
    margin-bottom: 0;
  }

  .print-info-b {
    padding: 15px;
    font-size: 16px;
  }

  .print-info-col-l {
    float: none;
  }

  .print-attention-b {
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .txt-print-date {
    font-size: 11px;
    line-height: 15px;
  }

  .print-footer-b {
    margin-bottom: 20px;
  }

  .print-page-no {
    font-size: 11px;
    line-height: 15px;
  }

  .link-update-profile {
    width: 100%;
  }

  .link-update-profile-b {
    height: 22px;
    margin-top: 112px;
    top: 0%;
    bottom: auto;
    left: 0%;
    right: 0%;
  }

  .pop-notification {
    margin-top: 75px;
  }

  .table-vaccinegame-col {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .print-link-b {
    font-size: 11px;
    line-height: 15px;
  }

  .form-remind-b {
    margin-top: -10px;
    margin-bottom: 15px;
    line-height: 22px;
  }

  .privacy-id {
    margin-top: -120px;
  }

  .vaccine-game-step-heading {
    padding-right: 90px;
  }

  .vaccine-game-step-heading.v2game-instruction {
    font-size: 22px;
    line-height: 24px;
  }

  .header-top-row {
    padding-bottom: 10px;
  }

  .header-top-row.v-join {
    height: 90px;
  }

  .header-info-row {
    font-size: 15px;
  }

  .vaccine-header-info-b {
    margin-top: 10px;
  }

  .upload-image-b {
    max-height: 200px;
    overflow: hidden;
  }

  .upload-image-b.pdf {
    margin-top: -37px;
    padding: 40px 20px 40px 30px;
  }

  .upload-image-hover-b {
    display: none;
  }

  .upload-image-popup-b {
    padding-bottom: 110px;
  }

  .upload-image-pdf {
    width: 100%;
  }

  .vgame2-table-upload-row {
    flex-wrap: wrap;
  }

  .vgame2-table-upload-row.v-top {
    display: none;
  }

  .vgame2-table-upload-col.col-1 {
    font-size: 24px;
    line-height: 30px;
  }

  .vgame2-table-upload-col.col-2 {
    border-right-style: none;
    margin-right: 0;
    padding-right: 0;
  }

  .vgame2-table-upload-col.col-3 {
    width: 100%;
    margin-top: 10px;
  }

  .vgame2-table-upload-col.col-sample {
    border-left: 1px solid var(--powder-blue);
    border-right-style: none;
    margin-top: 10px;
    margin-left: 15px;
    margin-right: 0;
    padding-left: 15px;
    padding-right: 0;
  }

  .vgame2-upload-lightbox {
    max-width: 200px;
    margin-left: auto;
    margin-right: auto;
  }

  .vgame2-upload-link {
    min-height: 0;
    padding-top: 20px;
    padding-bottom: 20px;
    font-size: 16px;
  }

  .txt-align-center.mobile-only {
    display: block;
  }

  .agm-title {
    margin-bottom: 20px;
  }

  .agm-title.title-3 {
    width: 500px;
    max-width: 80%;
  }

  .agm-intro-b {
    margin-left: -5vw;
    margin-right: -5vw;
    padding: 30px 10vw;
  }

  .intro-row-fieldname {
    width: 100px;
  }

  .agm-info-b {
    margin-bottom: 30px;
  }

  .agm-submit-table-col {
    padding-left: 15px;
    padding-right: 15px;
  }

  .agm-submit-table-col.col-1 {
    width: 220px;
  }

  .footnote-list {
    margin-bottom: 20px;
  }

  .agm-watermark-col {
    width: 100%;
  }

  .agm-watermark-col.col-2 {
    margin-top: 0;
  }

  .watermark-txt {
    margin-bottom: 24%;
    font-size: 7vw;
  }

  .terms-checkbox-link {
    padding-left: 10px;
    padding-right: 10px;
    line-height: 22px;
  }

  .terms-arrow-b {
    width: 42px;
    height: 42px;
  }

  .terms-expand-txt-b {
    padding: 10px;
  }

  .join-radio-gp {
    margin-left: 0;
    margin-right: 0;
    display: block;
  }

  .join-radio-item {
    width: auto;
    padding-left: 0;
    padding-right: 0;
  }

  .footer-app-item {
    padding-left: 5px;
    padding-right: 5px;
  }

  .internal-watermark-col {
    width: 100%;
  }

  .internal-watermark-col.col-2 {
    margin-top: 0;
  }

  .internal-only-watermark-txt {
    margin-bottom: 24%;
    font-size: 7vw;
  }

  .special-event-intro-b {
    margin-bottom: 30px;
  }

  .form-select {
    height: 42px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .se-extra-form-col {
    width: 100%;
  }

  .btn-se-info-confirm {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  .btn-se-info-confirm._160, .btn-se-info-confirm._230, .btn-se-info-confirm.eform, .btn-se-info-confirm._180 {
    width: 100%;
  }

  .special-event-purchase-tab-link {
    width: 49%;
    margin-right: 1%;
  }

  .special-event-purchase-content {
    padding: 15px;
  }

  .se-purchase-content-title {
    font-size: 20px;
  }

  .se-purchase-price-b {
    margin-top: 30px;
  }

  .se-purchase-price-data {
    font-size: 20px;
  }

  .special-event-purchase-item {
    width: 50%;
  }

  .se-purchase-checkbox-box {
    width: 20px;
    height: 20px;
  }

  .se-purchase-checkbox-txt {
    margin-top: 1px;
    margin-left: 5px;
  }

  .se-purchase-checkbox-tick {
    background-size: 12px;
  }

  .se-purchase-ship-form-col {
    width: 100%;
  }

  .se-purchase-address-upload-link {
    min-height: 0;
    padding-top: 20px;
    padding-bottom: 20px;
    font-size: 16px;
  }

  .se-purchase-summary-item {
    display: block;
  }

  .se-purchase-summary-img-b {
    margin-bottom: 10px;
    margin-right: 0;
  }

  .se-footnote-list {
    margin-bottom: 20px;
  }

  .hkid-field-item {
    padding-left: 2px;
    padding-right: 2px;
  }

  .hkid-field-gp {
    margin-left: -2px;
    margin-right: -2px;
  }

  .intro-row-sub-fieldname {
    width: auto;
    max-width: none;
    margin-right: 0;
  }

  .agm-intro-subrow {
    display: block;
  }
}

@media screen and (max-width: 479px) {
  .all {
    padding-top: 95px;
  }

  .nav-menu {
    margin-top: 95px;
  }

  .section-footer {
    padding-top: 10px;
  }

  .footer-link-b {
    margin-right: 0%;
  }

  .footer-dropdown-toggle, .footer-link {
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .footer-dropdown-link {
    margin-top: 3px;
    margin-bottom: 3px;
  }

  .footer-dropdown-align-b {
    flex-direction: column;
    display: flex;
  }

  .btn-notification {
    width: 28px;
    height: 28px;
  }

  .home-news-b {
    padding-bottom: 20px;
  }

  .btn-white {
    width: 100%;
  }

  .btn-white._140 {
    width: 200px;
  }

  .home-news-slider {
    margin-bottom: 10px;
  }

  .home-btn-b {
    justify-content: center;
    margin-top: 0;
    display: flex;
    position: static;
  }

  .home-btn-b.highlight {
    margin-top: 20px;
  }

  .home-notice-b, .home-highlight-b {
    padding-bottom: 20px;
  }

  .link-txt-b {
    max-height: none;
    overflow: visible;
  }

  .link-col-l {
    margin-bottom: 15px;
    padding-right: 0;
  }

  .home-calendar-b.member-zone {
    margin-bottom: 15px;
    padding-bottom: 20px;
  }

  .home-calendar-col-r {
    width: 100%;
    margin-top: 20px;
    margin-left: 0;
    line-height: 22px;
  }

  .home-calendar-align-b {
    display: block;
  }

  .home-calendar-col-l {
    width: 100%;
  }

  .home-news-slide-nav {
    margin-bottom: -5px;
    top: auto;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .notification-mobile-btn {
    margin-right: 15px;
  }

  .home-login-btn-row {
    text-align: center;
    display: block;
  }

  .txt-link-forgot-pw.home {
    margin-top: 10px;
    margin-left: 0;
  }

  .home-login-btn-b {
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0;
  }

  .img-inner-banner {
    padding-top: 35%;
  }

  .img-inner-banner.update-profile {
    background-position: 75%;
  }

  .back-btn-row {
    padding-left: 0;
  }

  .news-video-btn-b {
    flex-direction: column;
    padding-left: 0;
    display: flex;
  }

  .question-col-r {
    margin-bottom: 20px;
    padding-right: 0;
  }

  .calendar-col-l {
    width: 100%;
  }

  .post-division-col-l {
    width: 70px;
  }

  .post-division-row {
    margin-left: 0;
    margin-right: 0;
    display: block;
  }

  .post-division-col {
    padding-left: 0;
    padding-right: 0;
  }

  .annual-link-col {
    width: 33.33%;
  }

  .online-services-arrow {
    margin-left: 20px;
  }

  .pw-align-b {
    width: 50%;
  }

  .upload-list-b {
    flex-wrap: wrap;
    display: flex;
  }

  .upload-link-row {
    width: 100%;
  }

  .upload-align-b {
    padding-right: 30px;
  }

  .footer-padding-b {
    margin-top: 20px;
  }

  .question-grey-b.special-event-finish {
    padding-top: 60px;
  }

  .fail-txt-b.vaccine-game {
    font-size: 16px;
  }

  .btn-upload-photo {
    width: 100%;
  }

  .ref-row {
    flex-direction: column;
    align-items: center;
    display: flex;
  }

  .ref-col {
    padding-left: 0;
    padding-right: 0;
  }

  .btn-next {
    order: 1;
  }

  .links-arrow {
    margin-left: 20px;
  }

  .contact-txt-b {
    flex-direction: column;
    display: block;
  }

  .radio-button-field-vaccine.v-special-event-purchase {
    padding-top: 6px;
    padding-bottom: 6px;
  }

  .vaccine-game-step-heading.v2game-instruction {
    font-size: 18px;
    line-height: 20px;
  }

  .header-top-row.v-join {
    height: 90px;
  }

  .header-info-row {
    font-size: 12px;
    line-height: 12px;
  }

  .upload-image-b.pdf {
    max-height: 100px;
    margin-top: 0;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
  }

  .upload-image-popup-b {
    height: 91%;
    padding-bottom: 0;
    padding-left: 10px;
  }

  .vgame2-table-upload-row {
    padding: 5px 10px;
  }

  .vgame2-table-upload-col.col-1 {
    text-align: center;
    width: 30px;
  }

  .vgame2-table-upload-col.col-3 {
    margin-top: 5px;
  }

  .vgame2-table-upload-col.col-sample {
    width: 90px;
    margin-top: 5px;
    margin-left: 10px;
    padding-left: 10px;
  }

  .agm-title {
    width: 150px;
    margin-bottom: 10px;
  }

  .agm-title.title-2 {
    width: 250px;
  }

  .agm-title.title-3 {
    width: 230px;
  }

  .agm-intro-row {
    display: block;
  }

  .intro-row-fieldname {
    width: auto;
  }

  .agm-submit-table-row {
    padding-left: 15px;
    padding-right: 15px;
    display: block;
  }

  .agm-submit-table-col {
    padding-left: 0;
    padding-right: 0;
  }

  .agm-submit-table-col.col-1 {
    border-bottom: 1px solid var(--teal);
    border-right-style: none;
    width: auto;
    margin-bottom: 5px;
    padding-bottom: 5px;
  }

  .watermark-txt, .internal-only-watermark-txt {
    margin-bottom: 40%;
  }

  .special-event-ticket-box {
    padding: 8px;
  }

  .special-event-ticket-top-row {
    display: none;
  }

  .special-event-ticket-wrap {
    flex-flow: wrap;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .special-event-ticket-col {
    margin-bottom: 5px;
  }

  .special-event-ticket-col.col-type {
    width: 60%;
  }

  .special-event-ticket-col.col-qty {
    order: 1;
    width: 100%;
  }

  .special-event-ticket-col.col-price {
    width: 40%;
  }

  .special-event-ticket-mobile-fieldname {
    display: block;
  }

  .special-event-ticket-total-num {
    font-size: 22px;
  }

  .form-dob-wrap {
    margin-left: -2px;
    margin-right: -2px;
  }

  .form-dob-col {
    padding-left: 2px;
    padding-right: 2px;
  }

  .special-event-purchase-tab-link {
    width: 100%;
    margin-right: 0%;
  }

  .se-purchase-content-wrap {
    display: block;
  }

  .se-purchase-content-l {
    width: auto;
    margin-right: 0;
  }

  .se-purchase-content-r {
    max-width: 150px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
  }

  .se-purchase-price-b {
    display: block;
  }

  .special-event-purchase-item {
    width: 100%;
  }

  .intro-row-sub-fieldname {
    width: auto;
  }

  .agm-intro-subrow {
    display: block;
  }
}