@charset "UTF-8";

body.select-page-body {
  margin: 0;
  overflow-x: clip;
}

.select-page {
  background: var(--ta-color-bg);
  display: block;
}

.select-page p,
.select-page h1,
.select-page h2,
.select-page h3,
.select-page h4,
.select-page h5 {
  margin-bottom: 0;
  margin-top: 0;
}

.select-page img {
  display: block;
  height: auto;
  max-width: 100%;
}

.select-inner {
  margin: 0 auto;
  max-width: var(--content-width);
  width: 100%;
}

.select-muted {
  --text: var(--ta-color-sub-text);
}

.select-card-title {
  --ta-type-h3-pc: var(--ta-type-card-title-pc);
}

.select-br-pc,
.select-br-sp {
  display: none;
}

.select-hero__inner {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: center;
  max-width: var(--content-width);
  width: 100%;
}

.select-hero__icon {
  flex: 0 0 56px;
  height: 56px;
  overflow: hidden;
  position: relative;
  width: 56px;
}

.select-hero__icon img {
  height: 64.28px;
  left: 1.37px;
  max-width: none;
  position: absolute;
  top: -3.98px;
  width: 53.25px;
}

.select-heading {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 24px;
  text-align: center;
}

.select-heading .ta-heading-bar {
  margin-top: 0;
}

.select-intro {
  padding: 40px 20px;
}

.select-intro__inner {
  display: grid;
  gap: 20px;
  grid-template-columns: minmax(0, 1fr);
  margin: 0 auto;
  max-width: 350px;
  width: 100%;
}

.select-intro__copy {
  display: contents;
}

.select-intro__media {
  grid-row: 1;
  height: 177px;
  justify-self: center;
  width: 300px;
}

.select-intro__media img {
  height: 177px;
  width: 300px;
}

.select-intro__text {
  grid-row: 2;
  width: 100%;
}

.select-section {
  padding: 40px 20px;
}

.select-feature-section {
  background: var(--ta-color-primary-pale);
}

.select-heading--section {
  margin-bottom: 40px;
}

.select-feature-list,
.select-tip-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.select-feature-card {
  align-items: center;
  background: var(--ta-color-bg-light);
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 20px;
  width: 100%;
}

.select-feature-card__media {
  flex: none;
  height: 200px;
  width: 300px;
}

.select-feature-card__media img {
  height: 200px;
  max-width: none;
  width: 300px;
}

.select-feature-card__copy {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

.select-feature-card__copy .select-card-title {
  text-align: center;
}

.select-flow {
  padding-bottom: 80px;
}

.select-step-list {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.select-step-card {
  align-items: center;
  background: var(--ta-color-bg-light);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 100%;
  padding: 20px 32px;
  width: 350px;
}

.select-step-card__title {
  text-align: center;
  white-space: nowrap;
}

.select-step-card__media {
  flex: none;
  width: 300px;
}

.select-step-card__media--screen {
  height: 181px;
}

.select-step-card__media--details {
  height: 241px;
}

.select-step-card__media img {
  height: 100%;
  max-width: none;
  width: 300px;
}

.select-step-card__text {
  width: 286px;
}

.select-step-arrow {
  align-items: center;
  display: flex;
  flex: 0 0 18px;
  height: 18px;
  justify-content: center;
  width: 18px;
}

.select-step-arrow img {
  display: block;
  height: 18px;
  max-width: none;
  width: 18px;
}

.select-tips {
  background: var(--ta-color-primary-pale);
  padding: 90px 20px 40px;
  position: relative;
}

.select-tips__heading {
  align-items: center;
  background: var(--ta-color-primary);
  display: flex;
  height: 100px;
  justify-content: center;
  left: 50%;
  padding: 0 20px;
  position: absolute;
  top: -50px;
  transform: translateX(-50%);
  width: 100vw;
  z-index: 1;
}

.select-tips__heading .ta-h2 {
  --ta-color-primary: var(--ta-color-bg);
  text-align: center;
  white-space: nowrap;
}

.select-tips__heading > img {
  bottom: -28px;
  height: 28px;
  left: 50%;
  max-width: none;
  position: absolute;
  transform: translateX(-50%);
  width: 56px;
}

.select-tip-card {
  align-items: center;
  background: var(--ta-color-bg);
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 20px;
  width: 100%;
}

.select-tip-card__copy {
  display: contents;
}

.select-tip-card__heading {
  align-items: center;
  display: flex;
  gap: 16px;
  order: 1;
  width: 100%;
}

.select-tip-card--understand .select-tip-card__heading {
  justify-content: center;
}

.select-tip-card__number {
  --ta-color-primary: var(--ta-color-accent);
  --ta-type-h1-sp: var(--ta-en-pc-display-bold);
  align-self: stretch;
  flex: 0 0 40px;
  position: relative;
  width: 40px;
}

.select-tip-card__number > .ta-h1 {
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
}

.select-tip-card__media {
  flex: none;
  order: 2;
  width: 300px;
}

.select-tip-card__media img {
  height: 100%;
  max-width: none;
  width: 100%;
}

.select-tip-card__media--understand,
.select-tip-card__media--funds,
.select-tip-card__media--switch {
  height: 181px;
}

.select-tip-card__media--drawdown {
  height: 241px;
}

.select-tip-card__media--market {
  height: 184px;
}

.select-tip-card__text,
.select-tip-card__content {
  order: 3;
  width: 100%;
}

.select-tip-card__content {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.select-tip-detail {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.select-tip-detail__title {
  border-left: 2px solid var(--ta-color-accent-light);
  padding-left: 20px;
}

.select-tip-detail__item + .select-tip-detail__item {
  margin-top: 27px;
}

@media (max-width: 389px) {
  .select-intro__media,
  .select-feature-card__media,
  .select-step-card__media,
  .select-tip-card__media {
    height: auto;
    max-width: 100%;
  }

  .select-feature-card__media {
    aspect-ratio: 3 / 2;
  }

  .select-intro__media {
    aspect-ratio: 300 / 177;
  }

  .select-step-card__media--screen,
  .select-tip-card__media--understand,
  .select-tip-card__media--funds,
  .select-tip-card__media--switch {
    aspect-ratio: 300 / 181;
  }

  .select-step-card__media--details,
  .select-tip-card__media--drawdown {
    aspect-ratio: 300 / 241;
  }

  .select-tip-card__media--market {
    aspect-ratio: 300 / 184;
  }

  .select-intro__media img,
  .select-feature-card__media img,
  .select-step-card__media img,
  .select-tip-card__media img {
    height: auto;
    max-width: 100%;
    width: 100%;
  }

  .select-step-card__text {
    max-width: 100%;
  }
}

@media (max-width: 939px) {
  .select-br-sp {
    display: inline;
  }

  .select-hero__inner {
    display: flex;
    gap: 16px;
    justify-content: center;
    width: 100%;
  }

  .select-hero__icon {
    flex-basis: 64px;
    height: 64px;
    width: 64px;
  }

  .select-hero__icon img {
    height: 73.46px;
    left: 1.57px;
    top: -4.55px;
    width: 60.86px;
  }

  .select-hero__inner .ta-hero__title {
    font: var(--ta-type-h1-sp);
  }
}

@media (max-width: 389px) {
  .select-hero__inner {
    gap: 8px;
  }

  .select-hero__icon {
    flex-basis: 60px;
    height: 60px;
    width: 60px;
  }

  .select-hero__icon img {
    height: 68.87px;
    left: 1.47px;
    top: -4.26px;
    width: 57.05px;
  }

  .select-hero__inner .ta-hero__title {
    font: var(--ta-type-h2-sp);
  }
}

@media (min-width: 940px) {
  .select-br-pc {
    display: inline;
  }

  .select-hero__inner {
    gap: 40px;
  }

  .select-hero__icon {
    flex-basis: 80px;
    height: 80px;
    width: 80px;
  }

  .select-hero__icon img {
    height: 91.88px;
    left: 1.96px;
    top: -5.68px;
    width: 76.08px;
  }

  .select-intro {
    padding: 40px 20px 80px;
  }

  .select-intro__inner {
    align-items: center;
    display: grid;
    grid-template-columns: 377px 420px;
    justify-content: space-between;
    max-width: 900px;
  }

  .select-intro__copy {
    display: block;
    width: 377px;
  }

  .select-intro__media {
    grid-column: 2;
    grid-row: 1;
    height: 248px;
    width: 420px;
  }

  .select-intro__media img {
    height: 248px;
    width: 420px;
  }

  .select-section {
    padding: 80px 20px;
  }

  .select-heading--section {
    margin-bottom: 80px;
  }

  .select-feature-card {
    display: grid;
    gap: 20px;
    grid-template-columns: 300px 500px;
    height: 240px;
    justify-content: center;
    padding: 20px;
  }

  .select-feature-card--media-right {
    grid-template-columns: 500px 300px;
  }

  .select-feature-card--media-right .select-feature-card__media {
    grid-column: 2;
  }

  .select-feature-card--media-right .select-feature-card__copy {
    grid-column: 1;
    grid-row: 1;
  }

  .select-feature-card__copy {
    justify-content: center;
    width: 500px;
  }

  .select-feature-card__copy .select-card-title {
    text-align: left;
  }

  .select-flow {
    padding-bottom: 140px;
  }

  .select-step-list {
    align-items: stretch;
    flex-direction: row;
    gap: 0;
    justify-content: space-between;
  }

  .select-step-card {
    align-self: stretch;
    min-height: 491px;
    padding: 40px 20px;
    width: 300px;
  }

  .select-step-card__media {
    order: -1;
    width: 260px;
  }

  .select-step-card__media--screen {
    height: 157px;
  }

  .select-step-card__media--details {
    height: 209px;
  }

  .select-step-card__media img {
    width: 260px;
  }

  .select-step-card__text {
    width: 260px;
  }

  .select-step-arrow {
    align-self: center;
    flex-basis: 18px;
    height: 18px;
    transform: none;
    width: 18px;
  }

  .select-tips {
    padding-bottom: 80px;
    padding-top: 105px;
  }

  .select-tips__heading {
    top: -50px;
    width: 390px;
  }

  .select-tips__heading > img {
    bottom: -21px;
    height: 21px;
    width: 48.498px;
  }

  .select-tip-card {
    align-items: center;
    display: grid;
    gap: 20px;
    grid-template-columns: 320px minmax(0, 1fr);
    padding: 20px;
  }

  .select-tip-card--understand {
    grid-template-columns: 324.125px minmax(0, 1fr);
  }

  .select-tip-card--media-right {
    grid-template-columns: minmax(0, 1fr) 320px;
  }

  .select-tip-card--media-right .select-tip-card__media {
    grid-column: 2;
    order: 0;
  }

  .select-tip-card--media-right .select-tip-card__copy {
    grid-column: 1;
    grid-row: 1;
  }

  .select-tip-card__copy {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    gap: 16px;
    justify-content: center;
    min-width: 0;
  }

  .select-tip-card__heading {
    order: 0;
  }

  .select-tip-card--understand .select-tip-card__heading {
    justify-content: flex-start;
  }

  .select-tip-card__number {
    --ta-type-h1-pc: var(--ta-en-pc-h2-bold);
    flex-basis: 30px;
    width: 30px;
  }

  .select-tip-card__number > .ta-h1 {
    transform: translateY(-50%) scale(0.9375);
    transform-origin: left center;
  }

  .select-tip-card__media {
    order: 0;
    width: 320px;
  }

  .select-tip-card__media--understand {
    height: 194.94px;
    width: 324.125px;
  }

  .select-tip-card__media--drawdown {
    height: 258px;
  }

  .select-tip-card__media--funds {
    height: 192.5px;
  }

  .select-tip-card__media--market {
    height: 196px;
  }

  .select-tip-card__media--switch {
    height: 192.5px;
  }

  .select-tip-card__text,
  .select-tip-card__content {
    order: 0;
  }

  .select-tip-card__content {
    gap: 16px;
  }
}