@charset "UTF-8";
/* common */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
/* lib */
@import url('./lib/aos.min.css');
@import url('./lib/swiper-bundle.min.css');
html {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  font-size: 0.0520833318vw;
}

body {
  overflow: visible;
  margin-top: 0 !important;
  min-width: 320px;
  color: #000;
  font-family: 'Pretendard', sans-serif;
  font-size: 16rem;
  font-weight: 400;
  line-height: 1.4;
  word-wrap: break-word;
  word-break: keep-all;
}

* {
  box-sizing: border-box;
  outline: none !important;
  font-style: normal;
  outline: none;
  margin: 0;
  padding: 0;
  -webkit-text-size-adjust: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: inherit;
  font-size: inherit;
}

fieldset,
img,
abbr,
acronym {
  border: 0 none;
}

legend {
  position: absolute;
  height: 0;
  line-height: 0;
  font-size: 0;
  overflow: hidden;
}

legend.showlegend {
  position: static;
  line-height: 14px;
  font-size: 12px;
  overflow: visible;
}

address,
caption,
cite,
code,
dfn,
em,
var,
i,
b {
  font-style: normal;
  font-weight: normal;
}

ol,
ul {
  list-style: none;
}

q:before,
q:after {
  content: '';
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption {
  height: 0;
  line-height: 0;
  font-size: 0;
  overflow: hidden;
  text-indent: -10000px;
}

hr {
  display: none;
}

a {
  display: block;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
  vertical-align: middle;
  background-color: transparent;
  border: 0 none;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

select {
  border-radius: 0;
  -webkit-border-radius: 0;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  background: url(/images/common/select_arrow.png) no-repeat right 10rem center/9rem auto;
  padding: 0 15rem;
}

select::-ms-expand {
  display: none;
}

input[type='text'],
input[type='password'],
input[type='number'],
input[type='tel'],
input[type='email'],
input[type='button'],
input[type='submit'],
textarea {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
  font-family: inherit;
  cursor: pointer;
}

button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
  cursor: pointer;
  overflow: visible;
  -webkit-appearance: button;
  appearance: button;
}

input[type='checkbox'],
input[type='radio'] {
  display: inline-block;
  width: 14rem;
  height: 14rem;
  line-height: 14rem;
  box-sizing: border-box;
  -webkit-border-radius: 0;
  border-radius: 0;
}

input[type='search'] {
  appearance: textfield;
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

input[type='search']::-webkit-search-decoration {
  -webkit-appearance: none;
}

input::-webkit-input-placeholder,
input:-moz-input-placeholder,
input::-moz-input-placeholder,
input:-ms-input-placeholder,
textarea::-webkit-input-placeholder,
textarea:-moz-placeholder,
textarea::-moz-placeholder,
textarea:-ms-input-placeholder {
  color: #a0a0a0;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: inherit;
  -webkit-box-shadow: 0 0 0px 1000px transparent inset;
  color: inherit;
  font-size: inherit;
  transition: 5000s ease-in-out 0s;
}

textarea {
  overflow: auto;
  resize: none;
}

img {
  display: block;
  width: 100%;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
object {
  display: block;
  margin: 0;
  padding: 0;
}

audio[controls],
canvas,
video {
  display: inline-block;
  /* *display: inline;
  *zoom: 1; */
}

/* Disable orange highlight */
label,
a,
button {
  -o-tap-highlight-color: rgba(0, 0, 0, 0);
  -ms-tap-highlight-color: rgba(0, 0, 0, 0);
  -moz-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* global */
.dB {
  display: block;
}

.dIB {
  display: inline-block;
  vertical-align: top;
}

.clearfix:after {
  display: block;
  content: '';
  clear: both;
}

.taC {
  text-align: center;
}

.taL {
  text-align: left;
}

.taR {
  text-align: right;
}

.mt0 {
  margin-top: 0 !important;
}

.mb0 {
  margin-bottom: 0 !important;
}

.pt0 {
  padding-top: 0 !important;
}

.pb0 {
  padding-bottom: 0 !important;
}

.ornt {
  -webkit-box-orient: vertical;
}

/* 이미지 설명 스타일 (스마트에디터에서 생성된 이미지) */
.img_wrapper {
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}

.img_wrapper img {
  max-width: 100%;
  object-fit: contain;
  width: auto;
  margin: 0 auto;
  display: block;
}

.imgCaption {
  padding-top: 10px;
  color: #777;
  font-size: 14px !important;
  text-align: center !important;
}

.imgCaption .imgDescription {
  background-color: rgba(0, 0, 0, 0.05);
  margin: 0 auto;
  min-height: 20px;
  text-align: center !important;
  display: inline-block;
  padding: 5px 10px;
  border-radius: 3px;
}

@media screen and (max-width: 1280px) {
  html {
    font-size: 1px;
  }
  body {
    font-size: 16px;
  }
  select {
    background-position: right 10rem center;
    padding: 0 10rem;
  }
}
/* 공통 컨테이너 */
#container {
  padding: 180rem 0;
  height: 100vh;
}
#container h1 {
  font-size: 60rem;
  font-weight: 600;
  color: var(--black);
  line-height: 120%;
  letter-spacing: -1.2rem;
}

/* HEADER */
#header {
  display: flex;
  position: relative;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 90rem;
  position: fixed;
  left: 0;
  top: 0;
  z-index: var(--z-header);
  transition: 0.5s ease;
  top: -100%;
}
#header.load,
#header.nav-up {
  top: 0;
}
body #header.nav-up .header_field {
  background-color: #fff;
}
#header.nav-down {
  top: -100%;
}
#header .header_field {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0 135rem;
  z-index: var(--z-header);
  background: var(--white);
}
#header.mobile_active .header_field {
  background-color: #fff;
}
#header.mobile_active .logo-c {
  display: block;
  opacity: 1;
}
#header.mobile_active .logo-w {
  display: none;
  opacity: 0;
}
#header.mobile_active .icon-search {
  display: block;
  opacity: 1;
}
#header.mobile_active .icon-search-w {
  display: none;
  opacity: 0;
}
#header #logo a {
  display: block;
}
#header #logo a img {
  width: auto;
  height: 28rem;
}
#header .gnb {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  height: 100%;
}
@media screen and (max-width: 1280px) {
  #header .gnb {
    position: static;
    left: auto;
    transform: none;
  }
}
#header .gnb > ul {
  display: flex;
  height: 100%;
  gap: 30rem;
}
#header .gnb > ul > li {
  display: flex;
  height: 100%;
  border-bottom: 3rem solid transparent;
  box-sizing: border-box;
  transition: 0.7s;
}
#header .gnb > ul > li > a {
  display: flex;
  gap: 4rem;
  align-items: center;
  color: var(--text-black);
  font-size: 20rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.4rem;
  transition: color 0.3s ease;
}
#header .gnb > ul > li > a img {
  transition: transform 0.3s ease;
}
#header .gnb > ul > li.active {
  border-bottom: 3rem solid var(--highlight);
}
#header .gnb > ul > li.active > a {
  color: var(--highlight);
}
#header .gnb > ul > li.active > a img {
  transform: rotate(180deg);
}
#header .gnb_list_field {
  display: flex;
  position: absolute;
  justify-content: center;
  left: 0;
  top: 100%;
  width: 100%;
  padding: 30rem 0 40rem;
  background: var(--white);
  transition: opacity 0.1s ease, transform 0.3s ease-out;
  border-top: 1rem solid #ccc;
  opacity: 0;
  transform: translateY(-100%);
  pointer-events: none;
  touch-action: none;
  color: var(--black);
}
#header .gnb_list_field.active {
  pointer-events: auto;
  opacity: 1;
  touch-action: auto;
  transform: translateY(0);
}
#header .gnb_list_field .menu_panel {
  display: flex;
  justify-content: center;
  gap: 30rem;
}
#header .gnb_list_field .menu_panel li {
  color: var(--text-black-sub);
  font-size: 20rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.4rem;
}
#header .gnb_list_field .menu_panel li a {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
  border-bottom: 1rem solid transparent;
}
#header .gnb_list_field .menu_panel li a:hover {
  color: var(--highlight);
  border-bottom: 1rem solid var(--highlight);
}
#header .gnb_list_field .menu_panel li:hover {
  color: var(--highlight);
  border-bottom: 1rem solid var(--highlight);
}
#header .header_right_box {
  display: flex;
  gap: 60rem;
}
#header .header_right_box .language_dropdown {
  display: flex;
  position: relative;
  align-items: center;
}
#header .header_right_box .language_dropdown .language_btn {
  display: flex;
  align-items: center;
  gap: 4rem;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-black);
  font-size: 18rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.36rem;
}
#header .header_right_box .language_dropdown .language_btn .current_lang {
  font-weight: 600;
}
#header .header_right_box .language_dropdown .language_btn img {
  width: 8rem;
  height: 8rem;
  transition: transform 0.3s ease;
}
#header .header_right_box .language_dropdown.active .language_btn img {
  transform: rotate(180deg);
}
#header .header_right_box .language_dropdown.active .language_list {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
#header .header_right_box .language_dropdown .language_list {
  position: absolute;
  top: 100%;
  right: 0;
  background: var(--white);
  border: 1rem solid #e0e0e0;
  border-radius: 8rem;
  box-shadow: 0 4rem 12rem rgba(0, 0, 0, 0.1);
  min-width: 80rem;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10rem);
  transition: all 0.3s ease;
  z-index: var(--z-dropdown);
}
#header .header_right_box .language_dropdown .language_list li {
  padding: 12rem 16rem;
  cursor: pointer;
  font-size: 16rem;
  font-weight: 500;
  color: var(--text-black);
  transition: all 0.3s ease;
}
#header .header_right_box .language_dropdown .language_list li:hover {
  background: rgba(0, 0, 0, 0.05);
  color: var(--highlight);
}
#header .header_right_box .language_dropdown .language_list li.active {
  color: var(--highlight);
  background: rgba(0, 0, 0, 0.02);
}
#header .header_right_box .language_dropdown .language_list li:first-child {
  border-radius: 8rem 8rem 0 0;
}
#header .header_right_box .language_dropdown .language_list li:last-child {
  border-radius: 0 0 8rem 8rem;
}
#header .header_right_box .search_btn {
  cursor: pointer;
}
#header .header_right_box .search_btn > img {
  width: 28rem;
  height: 28rem;
}
#header .mobile_menu_box {
  position: fixed;
  top: 60rem;
  left: 0;
  width: 100%;
  background: var(--white);
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
  touch-action: none;
  transition: 0.3s ease;
  z-index: var(--z-navigation);
}
#header .mobile_menu_box.active {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
  touch-action: auto;
}
#header .mobile_menu_box .gnb.mo {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16rem 0;
  margin-top: 24rem;
}
#header .mobile_menu_box .gnb.mo .gnb-arrow-down {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 11rem;
  height: 7rem;
  transition: 0.4s;
}
#header .mobile_menu_box .gnb.mo .gnb-arrow-down svg {
  width: 100%;
  height: 100%;
}
#header .mobile_menu_box .gnb.mo .gnb-arrow-down svg path {
  stroke: #111;
  transition: 0.4s;
}
#header .mobile_menu_box .gnb.mo > ul {
  display: flex;
  justify-content: center;
  gap: 16rem;
}
#header .mobile_menu_box .gnb.mo > ul > li {
  position: relative;
  margin-left: 0;
  height: auto;
  border-bottom: 3rem solid transparent;
  box-sizing: border-box;
}
#header .mobile_menu_box .gnb.mo > ul > li.active a {
  color: var(--highlight);
}
#header .mobile_menu_box .gnb.mo > ul > li.active .gnb-arrow-down {
  transform: rotate(180deg);
}
#header .mobile_menu_box .gnb.mo > ul > li.active .gnb-arrow-down svg path {
  stroke: var(--highlight);
}
#header .mobile_menu_box .gnb.mo > ul > li::before {
  content: '';
  position: absolute;
  bottom: -20rem;
  left: 0;
  width: 100%;
  height: 3rem;
  background-color: transparent;
  transition: background-color 0.3s ease;
}
#header .mobile_menu_box .gnb.mo > ul > li > a {
  color: var(--text-black);
  font-size: 18rem;
  letter-spacing: -0.36rem;
}
#header .mobile_menu_box .gnb.mo > ul > li > a img {
  width: 11rem;
  height: 7rem;
}
#header .mobile_menu_box .gnb.mo > ul > li.active::before {
  background-color: var(--highlight);
  transition: background-color 0.3s ease;
}
#header .mobile_menu_box .gnb_list_field {
  display: none;
  position: static;
  width: auto;
  padding: 20rem;
  border-top: 1rem solid var(--text-gray);
  transform: none;
}
#header .mobile_menu_box .gnb_list_field.active {
  display: block;
}
#header .mobile_menu_box .gnb_list_field .menu_panel {
  gap: 30rem;
  flex-direction: column;
  align-items: center;
}
#header .mobile_menu_box .gnb_list_field .menu_panel li {
  font-size: 18rem;
  letter-spacing: -0.36rem;
}
#header .mobile_menu_box .lang_btn_box {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20rem 0;
  gap: 10rem;
}
#header .mobile_menu_box .lang_btn_box span {
  color: var(--text-gray-sub);
  font-size: 16rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.32rem;
}
#header .mobile_menu_box .lang_btn_box span.active {
  color: var(--text-black);
}
#header .mobile_menu_box .divider {
  width: 1rem;
  height: 13rem;
  background-color: var(--text-gray);
}

#footer {
  display: flex;
  justify-content: space-between;
  background-color: var(--bg-black);
  position: relative;
  padding: 80rem 135rem;
}
#footer .gnb_btn {
  display: flex;
  position: absolute;
  right: 0;
  justify-content: center;
  align-items: center;
  box-shadow: 0 -4rem 4rem 0 rgba(255, 255, 255, 0.1);
  border: 1rem solid #777;
  border-radius: 50%;
  font-family: 'IBM Plex Sans KR';
  color: var(--white);
  font-size: 18rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.36rem;
  width: 60rem;
  height: 60rem;
}
#footer .main_field {
  display: flex;
  position: relative;
  flex-direction: column;
  justify-content: space-between;
  gap: 52rem;
}
#footer .main_field .title_box {
  margin-top: -10rem;
  display: flex;
  flex-direction: column;
  gap: 24rem;
  color: var(--text-gray);
  font-size: 16rem;
  font-weight: 300;
  line-height: 130%;
  letter-spacing: -0.32rem;
  max-width: 450rem;
}
#footer .main_field .title_box img {
  display: inline-block;
  width: auto;
  height: 42rem;
  align-self: start;
}
#footer .main_field .sns_link_box a {
  width: fit-content;
}
#footer .main_field .sns_link_box img {
  width: 76rem;
  height: 76rem;
}
#footer .description_field {
  display: flex;
  flex-direction: column;
}
#footer .description_field .nav_box {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: flex-start;
  gap: 20rem;
  width: 100%;
}
#footer .description_field .nav_box a {
  color: var(--white);
  text-decoration: none;
  font-size: 18rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.36rem;
}
#footer .description_field .nav_box .divider {
  width: 1rem;
  height: 14rem;
  background-color: var(--footer-divier);
}
#footer .description_field .desc_list {
  margin-top: 34rem;
  color: var(--text-gray-sub);
  list-style-type: disc;
  padding-left: 20rem;
  font-size: 15rem;
  font-weight: 300;
  line-height: 130%;
  letter-spacing: -0.3rem;
  word-break: break-all;
}
#footer .description_field .desc_list li::marker {
  color: var(--text-gray-sub);
  font-size: 12rem;
}
#footer .description_field .copyright {
  margin-top: 24rem;
  font-size: 15rem;
  color: var(--placeholder);
  font-weight: 300;
  line-height: 130%;
  letter-spacing: -0.3rem;
  text-transform: uppercase;
}

#search {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: var(--z-modal);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
#search.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
#search.active .search_section {
  transform: translateY(0);
}
#search .search_section {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  align-items: center;
  padding: 0 0 40rem;
  background: var(--bg-search);
  transform: translateY(-100%);
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
#search .search_section .search_header_field {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 30rem 135rem;
}
#search .search_section .search_header_field .search_logo_unit a {
  display: block;
}
#search .search_section .search_header_field .search_logo_unit a img {
  height: 28rem;
}
#search .search_section .search_header_field .search_close_btn {
  width: 40rem;
  height: 40rem;
  border: none;
  background: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}
#search .search_section .search_header_field .search_close_btn img {
  width: 20rem;
  height: 20rem;
}

.search_content_field {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20rem;
  width: 100%;
  padding: 90rem 0 0;
  max-width: 1070rem;
}
@media screen and (max-width: 1280px) {
  .search_content_field {
    padding: 36rem 0 0;
  }
}
.search_content_field .search_input_box {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
}
.search_content_field .search_input_box .search_input {
  width: 100%;
  border-bottom: 2rem solid var(--highlight);
  padding: 16.5rem 62rem 16.5rem 0;
  font-size: 36rem;
  font-weight: 500;
  color: var(--text-black);
  line-height: 130%;
  letter-spacing: -0.72rem;
  outline: none;
}
.search_content_field .search_input_box .search_input::placeholder {
  color: var(--placeholder);
}
.search_content_field .search_input_box .search_submit_btn {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}
.search_content_field .search_input_box .search_submit_btn img {
  width: 36rem;
  height: 36rem;
}
.search_content_field .search_input_box.fund {
  background: var(--white);
  border-radius: 16rem;
  border: 2rem solid var(--highlight);
  padding: 0 24rem;
}
@media screen and (max-width: 1280px) {
  .search_content_field .search_input_box.fund {
    padding: 0 18rem;
  }
}
.search_content_field .search_input_box.fund .search_input {
  border: none;
}
.search_content_field .search_input_box.fund .search_input::placeholder {
  color: var(--text-gray-sub);
}
.search_content_field .search_input_box.fund .search_submit_btn {
  right: 24rem;
}
@media screen and (max-width: 1280px) {
  .search_content_field .search_input_box.fund .search_submit_btn {
    right: 18rem;
  }
}

.related_search_field {
  margin-top: 24rem;
  width: 100%;
  max-width: 1070rem;
}
.related_search_field .related_keyword_box {
  display: flex;
  flex-wrap: wrap;
  gap: 12rem;
  justify-content: center;
}
.related_search_field .related_keyword_box button {
  display: inline-block;
  padding: 10rem 20rem;
  border: 1rem solid var(--text-gray);
  border-radius: 24rem;
  color: #333;
  font-size: 18rem;
  font-weight: 400;
  line-height: 140%;
  text-decoration: none;
  transition: all 0.3s ease;
}
.related_search_field .related_keyword_box button::before {
  content: '#';
}
.related_search_field .related_keyword_box button:hover {
  background: var(--white);
  border-color: var(--highlight);
  transform: translateY(-2rem);
}

.dim {
  width: 100%;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.3);
  opacity: 0;
  pointer-events: none;
  touch-action: none;
  transition: 1s ease;
  cursor: pointer;
  z-index: var(--z-background);
}
.dim.active {
  opacity: 1;
  pointer-events: auto;
  touch-action: auto;
}

/* -------------------------------- */
/* ------------ MOBILE ------------ */
/* -------------------------------- */
@media screen and (min-width: 1281px) {
  .mo {
    display: none !important;
  }
}
@media screen and (max-width: 1280px) {
  .pc {
    display: none !important;
  }
  #header {
    height: 60rem;
  }
  #header .header_field {
    padding: 0 20rem;
    z-index: 1000;
  }
  #header #logo a img {
    height: 26rem;
  }
  #header .header_right_box {
    gap: 18rem;
  }
  #header .header_right_box .search_btn > img {
    width: 22rem;
    height: 22rem;
  }
  #header .header_right_box .mobile_menu_btn > img {
    width: 24rem;
    height: 24rem;
  }
  #footer {
    padding: 40rem 20rem;
    flex-direction: column;
    gap: 50rem;
  }
  #footer .gnb_btn {
    top: 0;
    right: 0;
  }
  #footer .main_field {
    gap: 32rem;
  }
  #footer .main_field .title_box {
    max-width: none;
    margin-top: 0;
  }
  #footer .main_field .title_box img {
    height: 32rem;
  }
  #footer .main_field .sns_link_box img {
    width: 60rem;
    height: 60rem;
  }
  #footer .description_field .nav_box {
    flex-direction: column;
    align-items: flex-start;
    gap: 16rem;
  }
  #footer .description_field .nav_box a {
    font-size: 16rem;
  }
  #footer .description_field .nav_box > div {
    display: flex;
    align-items: center;
    gap: 8.5rem;
  }
  #footer .description_field .desc_list {
    margin-top: 32rem;
    font-size: 14rem;
    letter-spacing: 0.28rem;
  }
  #footer .description_field .copyright {
    margin-top: 12rem;
    font-size: 14rem;
    letter-spacing: -0.28rem;
  }
  #search .search_section .search_header_field {
    padding: 18rem 20rem;
  }
  #search .search_section .search_header_field .search_logo_unit a img {
    height: 19rem;
  }
  #search .search_section .search_header_field .search_close_btn {
    width: 32rem;
    height: 32rem;
  }
  #search .search_section .search_header_field .search_close_btn img {
    width: 16rem;
    height: 16rem;
  }
  #search .search_section .search_content_field {
    padding: 60rem 20rem 0;
  }
  .search_content_field .search_input_box .search_input {
    padding: 12rem 42rem 12rem 0;
    font-size: 24rem;
    letter-spacing: -0.48rem;
  }
  .search_content_field .search_input_box .search_submit_btn img {
    width: 26rem;
    height: 30rem;
  }
  .search_content_field .search_input_box.fund {
    border-radius: 10rem;
  }
  .related_search_field {
    margin-top: 24rem;
  }
  .related_search_field .related_keyword_box {
    gap: 8rem;
  }
  .related_search_field .related_keyword_box button {
    padding: 6rem 14rem;
    font-size: 16rem;
  }
}
/**************** GLOBAL DROPDOWN COMPONENT ****************/
/**
 * 전역 드롭다운 컴포넌트
 * 사용법:
 *
 * <div class="dropdown_container">
 *   <button class="dropdown_btn">
 *     <span class="dropdown_text">선택된 옵션</span>
 *     <img src="icon.svg" class="dropdown_icon" alt="드롭다운">
 *   </button>
 *   <div class="dropdown_list">
 *     <button class="dropdown_option selected">옵션 1</button>
 *     <button class="dropdown_option">옵션 2</button>
 *   </div>
 * </div>
 */
.dropdown_container {
  position: relative;
}
.dropdown_container .dropdown_btn {
  cursor: pointer;
}
.dropdown_container .dropdown_btn .dropdown_icon {
  transition: transform 0.2s ease, filter 0.2s ease;
}
.dropdown_container .dropdown_btn.active .dropdown_icon {
  transform: rotate(180deg);
}
.dropdown_container .dropdown_list {
  position: relative;
  top: 100%;
  left: 0;
  right: 0;
  max-height: 336rem;
  background: var(--white);
  border-bottom: 1.5rem solid var(--text-black-sub);
  opacity: 0;
  visibility: hidden;
  transition: all 0.2s ease;
  z-index: 999;
  overflow-y: auto;
  overflow-x: hidden;
}
.dropdown_container .dropdown_list.active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.dropdown_container .dropdown_list::-webkit-scrollbar {
  width: 8rem;
  display: block;
}
.dropdown_container .dropdown_list::-webkit-scrollbar-track {
  background: transparent;
}
.dropdown_container .dropdown_list::-webkit-scrollbar-thumb {
  background: var(--placeholder);
  border-radius: 1rem;
  border: 3rem solid transparent;
  background-clip: content-box;
}
.dropdown_container .dropdown_list::-webkit-scrollbar-thumb:hover {
  background: var(--text-black-sub);
  background-clip: content-box;
}
.dropdown_container .dropdown_list::-webkit-scrollbar-thumb:active {
  background: var(--text-black);
  background-clip: content-box;
}
.dropdown_container .dropdown_list .dropdown_option {
  width: 100%;
  display: flex;
  align-items: center;
  padding: 12rem 16rem;
  border: none;
  background: transparent;
  cursor: pointer;
  transition: background-color 0.2s ease;
  color: var(--text-black);
  font-size: 16rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.32rem;
  text-align: left;
}
.dropdown_container .dropdown_list .dropdown_option.selected,
.dropdown_container .dropdown_list .dropdown_option:hover {
  background: #eee;
  font-weight: 500;
}

@media screen and (max-width: 1280px) {
  .dropdown_container .dropdown_list {
    border-bottom: none;
    height: 0;
  }
  .dropdown_container .dropdown_list.active {
    height: 247rem;
    padding: 4rem 0;
  }
}
/* PRETENDARD */
@font-face {
  font-family: 'Pretendard';
  font-weight: 900;
  font-display: swap;
  src: local('Pretendard Black'), url('fonts/Pretendard/Pretendard-Black.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 800;
  font-display: swap;
  src: local('Pretendard ExtraBold'), url('fonts/Pretendard/Pretendard-ExtraBold.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 700;
  font-display: swap;
  src: local('Pretendard Bold'), url('fonts/Pretendard/Pretendard-Bold.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 600;
  font-display: swap;
  src: local('Pretendard SemiBold'), url('fonts/Pretendard/Pretendard-SemiBold.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 500;
  font-display: swap;
  src: local('Pretendard Medium'), url('fonts/Pretendard/Pretendard-Medium.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 400;
  font-display: swap;
  src: local('Pretendard Regular'), url('fonts/Pretendard/Pretendard-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 300;
  font-display: swap;
  src: local('Pretendard Light'), url('fonts/Pretendard/Pretendard-Light.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 200;
  font-display: swap;
  src: local('Pretendard ExtraLight'), url('fonts/Pretendard/Pretendard-ExtraLight.woff2') format('woff2');
}
@font-face {
  font-family: 'Pretendard';
  font-weight: 100;
  font-display: swap;
  src: local('Pretendard Thin'), url('fonts/Pretendard/Pretendard-Thin.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans KR';
  font-weight: 400;
  font-display: swap;
  src: local('IBMPlexSansKR-Regular'), url('fonts/IBMPlexSansKR/IBMPlexSansKR-Regular.ttf') format('truetype');
}
/* ELLIPSIS */
/* NONE DRAGGABLE */
.Sub_contents_3 {
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  .Sub_contents_3 {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}

.font_18_rg_140_-2 {
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  .font_18_rg_140_-2 {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}

/* / */
@media screen and (max-width: 1280px) {
  .sec__t {
    margin-bottom: 20rem;
  }
}
.text-wrap {
  display: inline-block;
}

/* #region Hero Section */
.sec-hero {
  height: 100vh;
}
.sec-hero > .inner {
  height: 100%;
}

.hero {
  position: relative;
  width: 100%;
  height: 100%;
}

.hero__container {
  height: 100%;
}

.card-hero {
  width: 100%;
  height: 100%;
}
.card-hero > .inner {
  position: relative;
  width: 100%;
  height: 100%;
}

.card-hero__bg {
  position: relative;
  height: 100%;
}
.card-hero__bg img,
.card-hero__bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.card-hero__bg img {
  position: absolute;
  z-index: -1;
}
.card-hero__bg::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(10, 29, 25, 0.4) 0%, rgba(10, 29, 25, 0) 100%), rgba(0, 0, 0, 0.2);
  z-index: 1;
}

.card-hero__con {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 85%;
  transform: translate(-50%, -50%);
  z-index: 2;
  overflow: hidden;
}

.card-hero__t {
  color: #fff;
  text-align: center;
  font-family: Pretendard;
  font-size: 76rem;
  font-style: normal;
  font-weight: 600;
  line-height: 120%; /* 91.2px */
  letter-spacing: -1.52rem;
  overflow: hidden;
}

.card-hero__p {
  margin-top: 24rem;
  color: #fff;
  text-align: center;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 120%; /* 28.8px */
  letter-spacing: -0.48rem;
  overflow: hidden;
}

@media screen and (max-width: 1280px) {
  .card-hero__t {
    font-size: 42rem;
    letter-spacing: -0.84rem;
  }
  .card-hero__p {
    color: #fff;
    text-align: center;
    font-family: Pretendard;
    font-size: 20rem;
    font-style: normal;
    font-weight: 500;
    line-height: 120%; /* 24px */
    letter-spacing: -0.4rem;
    margin-top: 12rem;
  }
}
/* #endregion Hero Section */
/* #region mouse-guide */
.mouse-guide {
  position: absolute;
  bottom: 0;
  left: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 106rem;
  gap: 6rem;
  transform: translateX(-50%);
  z-index: 1;
  opacity: 0;
  animation: mouse-guide-opacity 0.2s forwards 2.5s;
}

.mouse-guide__t {
  color: #fff;
  text-align: center;
  font-family: Pretendard;
  font-size: 14rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%; /* 18.2px */
  letter-spacing: -0.28rem;
  animation: mouse-guide-mb0To30 2s forwards 2.5s;
}

@keyframes mouse-guide-opacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes mouse-guide-mb0To30 {
  0% {
    margin-top: 0;
  }
  100% {
    margin-top: 30rem;
  }
}
.mouse-guide__line {
  width: 1rem;
  flex: 1;
  background-color: #ccc;
}

/* #endregion mouse-guide */
/* #region Main Fund Section */
.sec-mainfund {
  position: relative;
  background: linear-gradient(110deg, #f5f2e2 0%, #b2a9ab 100%);
  z-index: 0;
}
.sec-mainfund::before,
.sec-mainfund::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  filter: blur(1px);
  transition: opacity 0.9s cubic-bezier(0.23, 1, 0.32, 1), filter 0.9s cubic-bezier(0.23, 1, 0.32, 1);
  z-index: 1;
  pointer-events: none;
}
.sec-mainfund::before {
  background: linear-gradient(116deg, #f5f2e2 0%, #c9ae92 100%);
}
.sec-mainfund::after {
  background: linear-gradient(104deg, #f5f2e2 0%, #a6a6b7 100%);
}
.sec-mainfund.js-bgcolor--ty1::before {
  opacity: 1;
  filter: blur(0);
  transition-delay: 0.05s;
}
.sec-mainfund.js-bgcolor--ty1::after {
  opacity: 0;
  filter: blur(1px);
}
.sec-mainfund.js-bgcolor--ty2::before {
  opacity: 0;
  filter: blur(1px);
}
.sec-mainfund.js-bgcolor--ty2::after {
  opacity: 1;
  filter: blur(0);
  transition-delay: 0.05s;
}
.sec-mainfund.js-bgcolor--ty3::before,
.sec-mainfund.js-bgcolor--ty3::after {
  opacity: 0;
  filter: blur(1px);
}
.sec-mainfund.js-bgcolor--ty3 .sec-mainfund__bg::before {
  opacity: 1;
  filter: blur(0);
  transition-delay: 0.05s;
}
.sec-mainfund.js-bgcolor--ty4::before,
.sec-mainfund.js-bgcolor--ty4::after {
  opacity: 0;
  filter: blur(1px);
}
.sec-mainfund.js-bgcolor--ty4 .sec-mainfund__bg::after {
  opacity: 1;
  filter: blur(0);
  transition-delay: 0.05s;
}
.sec-mainfund > .inner {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.sec-mainfund__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.sec-mainfund__bg::before,
.sec-mainfund__bg::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  filter: blur(1px);
  transition: opacity 0.9s cubic-bezier(0.23, 1, 0.32, 1), filter 0.9s cubic-bezier(0.23, 1, 0.32, 1);
  z-index: 1;
  pointer-events: none;
}
.sec-mainfund__bg::before {
  background: linear-gradient(104deg, #f5f2e2 0%, #b4abb3 100%);
}
.sec-mainfund__bg::after {
  background: linear-gradient(104deg, #f5f2e2 0%, #a3a3b0 100%);
}

.sec-mainfund__t {
  position: relative;
  width: 280rem;
  flex-shrink: 0;
  z-index: 2;
}

.mainfund {
  flex: 1;
}

.mainfund__inner {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-between;
}

@media screen and (min-width: 1281px) {
  .mainfund__item {
    opacity: 0;
    transform: translateY(50rem);
    transition: opacity 0.8s ease, transform 0.8s ease;
  }
}
.mainfund__item.mainfund__item--hover .mf-tit__t-text {
  color: var(--_GREEN, #074827);
}
.mainfund__item.mainfund__item--hover .mf-tit__con {
  height: 133rem;
  padding-top: 24rem;
  padding-bottom: 48rem;
  margin-bottom: 48rem;
  border-bottom: 1px solid #aaa;
}
.mainfund__item.mainfund__item--hover .mf-tit__con-1 {
  opacity: 1;
  transform: translateX(0);
  transition: 1s ease 0.35s;
}
.mainfund__item.mainfund__item--hover .mf-tit__con-2 {
  opacity: 1;
  transform: translateX(0);
  transition: 1s ease 0.35s;
}
.mainfund__item + .mainfund__item {
  margin-top: 24rem;
}

@media screen and (min-width: 1281px) {
  .js-mainfund-wrapper--active .mainfund__item {
    opacity: 1;
    transform: translateY(0);
  }
}
@media screen and (min-width: 1281px) {
  .js-mainfund-wrapper--active .mainfund__item:nth-child(1) {
    transition-delay: 0.1s;
  }
}
@media screen and (min-width: 1281px) {
  .js-mainfund-wrapper--active .mainfund__item:nth-child(2) {
    transition-delay: 0.2s;
  }
}
@media screen and (min-width: 1281px) {
  .js-mainfund-wrapper--active .mainfund__item:nth-child(3) {
    transition-delay: 0.3s;
  }
}
@media screen and (min-width: 1281px) {
  .js-mainfund-wrapper--active .mainfund__item:nth-child(4) {
    transition-delay: 0.4s;
  }
}
@media screen and (min-width: 1281px) {
  .js-mainfund-wrapper--active .mainfund__item:nth-child(5) {
    transition-delay: 0.5s;
  }
}
@media screen and (min-width: 1281px) {
  .js-mainfund-wrapper--active .mainfund__item:nth-child(6) {
    transition-delay: 0.6s;
  }
}

.mf-tit__t-text {
  color: #777;
  font-family: Pretendard;
  font-size: 64rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%; /* 83.2px */
  letter-spacing: -1.28rem;
  transition: color 0.4s;
}

.mf-tit__con {
  display: flex;
  align-items: center;
  gap: 30rem;
  height: 0;
  transition: all 0.6s ease;
  transform-origin: top;
  border-bottom: 1px solid transparent;
  padding-top: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}

.mf-tit__con-1 {
  width: 120rem;
  opacity: 0;
  transform: translateX(-50rem);
}

.mf-tit__con-2 {
  opacity: 0;
  transform: translateX(-50rem);
}
.mf-tit__con-2 > .inner {
  display: flex;
  flex-direction: column;
  gap: 10rem;
}

.mf-tit__en {
  color: #111;
  font-family: 'Playfair Display';
  font-size: 18rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 23.4px */
  letter-spacing: -0.36rem;
}

.mf-tit__ko {
  color: #111;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}

.mainfund-img-area {
  width: 530rem;
  height: 640rem;
}

.mainfund-img-area__list {
  position: relative;
}

.mainfund-img-area__item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1s ease;
}
.mainfund-img-area__item img {
  transition: transform 1s ease;
}
.mainfund-img-area__item.mainfund-img-area__item--active {
  opacity: 1;
}
.mainfund-img-area__item.mainfund-img-area__item--active img {
  transform: scale(1.05);
}
.mainfund-img-area__item.mainfund-img-area__item--active .mfimg-card__p {
  opacity: 1;
}

.mainfund__img-wrap {
  position: relative;
  border-radius: 20rem;
  overflow: hidden;
}

.mfimg-card__p {
  position: absolute;
  bottom: 40rem;
  left: 36rem;
  z-index: 1;
  color: #dec3eb;
  font-family: Pretendard;
  font-size: 36rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%; /* 46.8px */
  letter-spacing: -0.72rem;
  opacity: 0;
  transition: 1s 0.6s;
}

@media screen and (max-width: 1280px) {
  .sec-mainfund > .inner {
    flex-direction: column;
  }
  .sec-mainfund__t {
    width: auto;
  }
  .mainfund {
    overflow: hidden;
  }
  .mainfund__inner {
    flex-direction: column;
  }
  .mainfund__pagi {
    margin-top: 16rem;
  }
  .mainfund__container {
    width: 100%;
  }
  .mainfund__item.swiper-slide-active .mf-card__img-p {
    opacity: 1;
  }
  .mainfund__item.mainfund__item--hover .mf-tit__con {
    height: inherit;
    padding-top: inherit;
    padding-bottom: inherit;
    margin-bottom: inherit;
    border-bottom: inherit;
  }
  .mainfund__item.mainfund__item--hover .mf-tit__con-1 {
    transform: none;
  }
  .mainfund__item.mainfund__item--hover .mf-tit__con-2 {
    transform: none;
  }
  .mainfund__item + .mainfund__item {
    margin-top: 0;
  }
  .mf-tit__t-text {
    color: var(--_GREEN, #074827);
    font-family: Pretendard;
    font-size: 36rem;
    font-style: normal;
    font-weight: 600;
    line-height: 130%; /* 46.8px */
    letter-spacing: -0.72rem;
  }
  .mf-tit__con {
    gap: 14rem;
    height: auto;
    margin-top: 12rem;
    border-bottom: none;
  }
  .mf-tit__con-1 {
    transform: none;
    opacity: 1;
    width: 22rem;
  }
  .mf-tit__con-2 {
    opacity: 1;
    transform: none;
  }
  .mf-tit__con-2 > .inner {
    gap: 6rem;
  }
  .mf-tit__en {
    color: #111;
    font-family: 'Playfair Display';
    font-size: 16rem;
    font-style: normal;
    font-weight: 500;
    line-height: 130%; /* 20.8px */
    letter-spacing: -0.32rem;
  }
  .mf-tit__ko {
    color: #111;
    font-family: Pretendard;
    font-size: 20rem;
    font-style: normal;
    font-weight: 500;
    line-height: 130%; /* 26px */
    letter-spacing: -0.4rem;
  }
  .mf-card__img-wrap {
    position: relative;
    margin-top: 50rem;
    overflow: hidden;
    border-radius: 12rem;
    width: 100%;
    max-height: 600rem;
    aspect-ratio: 320/270;
  }
  .mf-card__img-wrap img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .mf-card__img-p {
    position: absolute;
    bottom: 22rem;
    left: 24rem;
    right: 24rem;
    z-index: 1;
    opacity: 0;
    transition: 1s 0.6s;
    color: #e0c3b7;
    font-family: Pretendard;
    font-size: 18rem;
    font-style: normal;
    font-weight: 400;
    line-height: 130%; /* 23.4px */
    letter-spacing: -0.36rem;
  }
  .mainfund-img-area {
    display: none;
  }
}
/* #endregion Main Fund Section */
/* #region Philosophy Section */
.sec-philosophy {
  min-height: 385rem;
  background-image: url('/user/en/images/main/philosophy_bg.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.philosophy {
  display: flex;
}

.philosophy__t {
  width: 280rem;
}

.philosophy__wrap {
  max-width: 851rem;
}

.philosophy__headline {
  margin: 0 0 16rem;
}

.philosophy__headline-line {
  display: block;
  font-family: Pretendard;
  letter-spacing: -0.8rem;
  font-size: var(--figma-node-5136-6038-font-size-1, 36rem);
  line-height: var(--figma-node-5136-6038-line-height-1, 47rem);
  font-weight: var(--figma-node-5136-6038-font-weight-1, 500);
  overflow: hidden;
}

.philosophy__sub {
  margin-top: 18rem;
  font-size: var(--figma-node-5136-6038-font-size-3, 18rem);
  line-height: var(--figma-node-5136-6038-line-height-3, 25rem);
  letter-spacing: -0.36rem;
  color: #ddd;
  font-weight: var(--figma-node-5136-6038-font-weight-3, 400);
}

.philosophy__btn-area {
  margin-left: auto;
}

.philosophy__btn-area {
  align-self: end;
}

/* sec-philosophy */
@media screen and (max-width: 1280px) {
  /* sec-philosophy */
  .philosophy {
    flex-direction: column;
  }
  .philosophy__t {
    width: auto;
  }
  .philosophy__wrap {
    max-width: none;
  }
  .philosophy__headline {
    margin: 0 0 8rem;
  }
  .philosophy__headline-line {
    font-size: 24rem;
    line-height: 1.3;
    letter-spacing: -0.48rem;
  }
  .philosophy__sub {
    color: #ddd;
    font-size: 16rem;
    line-height: 1.4;
    letter-spacing: -0.32rem;
  }
  .philosophy__btn-area {
    margin-left: 0;
    margin-top: 60rem;
  }
}
@media screen and (max-width: 767px) {
  .sec-philosophy {
    background-image: url('/user/en/images/main/philosophy_bg_m.jpg');
    background-attachment: scroll;
  }
}
/* #endregion Philosophy Section */
/* #region Fund Series Section */
.fund-series {
  aspect-ratio: 1920/1080;
}

.fund-series__inner {
  position: relative;
  width: 100%;
  height: 100%;
}

.fund-series__t {
  position: absolute;
  top: 120rem;
  left: 135rem;
  z-index: 2;
}

.fund-series-pagi {
  position: absolute;
  left: 140rem;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.fund-series-pagi__pagi {
  display: flex;
  flex-direction: column;
  gap: 20rem;
}

.fund-series__navi-wrap {
  position: absolute;
  top: 725rem;
  right: 135rem;
  z-index: 2;
}

/* fs-item */
.fs-item > .inner {
  position: relative;
}

.fs-item__btn {
  position: absolute;
  top: 43rem;
  left: 660rem;
  z-index: 2;
  width: 60rem;
  height: 60rem;
  border-radius: 50%;
  overflow: hidden;
}

.fs-btn__btn {
  text-indent: -999px;
  overflow: hidden;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 1;
  margin: 0;
  background: center/12rem 20rem url('/user/en/images/main/swiper_navi_next_arrow.svg') no-repeat
    rgba(255, 255, 255, 0.5);
  transition: 0.3s;
}
.fs-btn__btn::after {
  display: none;
}
.fs-btn__btn:hover {
  background: center/12rem 20rem url('/user/en/images/main/swiper_navi_next_arrow.svg') no-repeat rgb(255, 255, 255);
}

.fs-item__img-wrap img {
  border-bottom-left-radius: 240rem;
  overflow: hidden;
}
@media screen and (max-width: 1280px) {
  .fs-item__img-wrap img {
    border-bottom-left-radius: 60rem;
  }
}
@media screen and (max-width: 767px) {
  .fs-item__img-wrap img {
    border-bottom-left-radius: 40rem;
  }
}

.fs-item__con {
  position: absolute;
  top: 685rem;
  left: 1065rem;
}

.fs-item__t {
  color: #fff;
  font-family: Pretendard;
  font-size: 48rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 62.4px */
  letter-spacing: -0.96rem;
}

.fs-item__p1 {
  color: #ddd;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 120%; /* 21.6px */
  letter-spacing: -0.36rem;
  margin-top: 16rem;
}

.fs-item__p2 {
  color: rgba(255, 255, 255, 0.7);
  font-family: 'Playfair Display';
  font-size: 64rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 83.2px */
  letter-spacing: 7.68rem;
  text-transform: uppercase;
  margin-top: 72rem;
}

@media screen and (max-width: 1280px) {
  .fund-series__t {
    top: 11.11%;
    left: 7.03%;
  }
  .fund-series-pagi {
    left: 7.03%;
    top: 50%;
    transform: translateY(-50%);
  }
  .fund-series__navi-wrap {
    top: auto;
    bottom: 18%;
    right: 10%;
  }
  /* fs-item */
  .fs-item__btn {
    top: 0;
    left: 350rem;
    width: 40rem;
    height: 40rem;
  }
  .fs-btn__btn {
    background: center/12rem 20rem url('/user/en/images/main/swiper_navi_next_arrow.svg') no-repeat rgb(255, 255, 255);
  }
  .fs-item__con {
    max-width: 51%;
    top: auto;
    bottom: 6%;
    left: 48%;
  }
  .fs-item__t {
    font-size: 30rem;
    letter-spacing: -0.6rem;
  }
  .fs-item__p1 {
    font-size: 16rem;
    letter-spacing: -0.32rem;
    margin-top: 8rem;
  }
  .fs-item__p2 {
    font-size: 36rem;
    letter-spacing: 4.32rem;
    margin-top: 36rem;
  }
}
@media screen and (max-width: 767px) {
  .fund-series {
    aspect-ratio: 360/640;
  }
  .fund-series__t {
    left: 20rem;
    top: 60rem;
  }
  .fund-series-pagi {
    left: 20rem;
    top: 106rem;
    transform: none;
  }
  /* fs-item */
  .fs-item__btn {
    top: 0;
    left: auto;
    right: 0;
  }
  .fs-item__con {
    /* position: absolute; */
    /* top: 685rem; */
    /* left: 1065rem; */
    width: calc(100% - 40rem);
    max-width: none;
    left: 20rem;
    right: auto;
    top: 55%;
    bottom: auto;
  }
}
/* #endregion Fund Series Section */
/* #region Counter Section */
.counter {
  display: flex;
  justify-content: space-between;
}

.counter__t {
  color: #111;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}

.counter__c {
  align-self: end;
}

.counter__list {
  display: flex;
}

.counter__item {
  display: flex;
  flex-direction: column;
  gap: 20rem;
  padding: 0 80rem 0 24rem;
  border-left: 1px solid #aaa;
}
.counter__item:last-child {
  padding-right: 0;
}
.counter__item.counter__item--1 .counter__num-n {
  min-width: 161rem;
}
.counter__item.counter__item--2 .counter__num-n {
  min-width: 128rem;
}
.counter__item.counter__item--3 .counter__num-n {
  min-width: 102rem;
}

.counter__num {
  display: flex;
}

.counter__num-n {
  color: var(--_GREEN, #074827);
  font-family: Pretendard;
  font-size: 72rem;
  font-style: normal;
  font-weight: 400;
  line-height: 100%; /* 72px */
  letter-spacing: -1.44rem;
  text-align: right;
}

.counter__num-unit {
  align-self: end;
  padding-bottom: 7rem;
  color: var(--_GREEN, #074827);
  font-family: Pretendard;
  font-size: 30rem;
  font-style: normal;
  font-weight: 400;
  line-height: 100%; /* 30px */
  letter-spacing: -1.5rem;
}

.counter__item-t {
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  .counter__item-t {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}

.counter__item-t-sub {
  color: #666;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  .counter__item-t-sub {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}

@media screen and (max-width: 1280px) {
  .counter__t {
    color: #111;
    font-size: 20rem;
    letter-spacing: -0.4rem;
  }
  .counter__item {
    gap: 10rem;
    padding: 0 10rem 0 12rem;
  }
  .counter__item.counter__item--1 .counter__num-n {
    min-width: 107rem;
  }
  .counter__item.counter__item--2 .counter__num-n {
    min-width: 85rem;
  }
  .counter__item.counter__item--3 .counter__num-n {
    min-width: 68rem;
  }
  .counter__num-n {
    font-size: 48rem;
    letter-spacing: -0.96rem;
  }
  .counter__num-unit {
    padding-bottom: 5rem;
    font-size: 20rem;
    letter-spacing: -1rem;
  }
}
@media screen and (max-width: 767px) {
  .counter {
    flex-direction: column;
  }
  .counter__t {
    margin-bottom: 36rem;
  }
  .counter__c {
    align-self: flex-start;
  }
  .counter__list {
    flex-direction: column;
    gap: 32rem;
  }
  .counter__item {
    padding: 0 0 0 12rem;
  }
}
/* #endregion Counter Section */
/* #region Info Section */
.sec-info-top {
  display: flex;
  justify-content: space-between;
  padding-bottom: 35rem;
  border-bottom: 1rem solid #ccc;
  opacity: 0;
  transform: translateY(50rem);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.js-sec-info--active .sec-info-top {
  opacity: 1;
  transform: translateY(0);
}

.sec-info__t {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}

.sec-info-top__btn-area {
  align-self: flex-end;
}

.info {
  padding: 30rem 0 0;
}

.info__inner {
  display: flex;
  gap: 30rem;
}

.info__first {
  flex-basis: 49.05%;
  opacity: 0;
  transform: translateX(-50rem);
  transition: opacity 0.8s ease, transform 0.8s ease;
  transition-delay: 0.5s;
}

.js-sec-info--active .info__first {
  opacity: 1;
  transform: translateX(0);
}

.info-first__img-wrap {
  height: 505rem;
}

.info-first__con {
  padding: 30rem 0 0;
}

.info-first__t {
  color: #111;
  font-family: Pretendard;
  font-size: 28rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -0.56rem;
  max-width: 805.94rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: wrap;
  white-space: nowrap;
}

.info-first__date {
  color: #666;
  margin-top: 10rem;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  .info-first__date {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}

.info__other {
  flex: 1;
}

.info__list {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 505rem;
  gap: 17rem;
}

.info__item {
  flex: 1;
  opacity: 0;
  transform: translateX(50rem);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.js-sec-info--active .info__item {
  opacity: 1;
  transform: translateX(0);
}

.js-sec-info--active .info__item:nth-child(1) {
  transition-delay: 1.1s;
}

.js-sec-info--active .info__item:nth-child(2) {
  transition-delay: 1.2s;
}

.js-sec-info--active .info__item:nth-child(3) {
  transition-delay: 1.3s;
}

.info-card__link {
  display: flex;
  gap: 30rem;
}

.info-card__img-wrap {
  height: 100%;
}
.info-card__img-wrap img {
  width: auto;
  height: 156rem;
}

.info-card__con {
  flex: 1;
  padding: 20rem 0;
}

.info-card__t {
  color: #111;
  font-family: Pretendard;
  font-size: 20rem;
  line-height: 1.2;
  letter-spacing: -0.4rem;
  max-width: 528.53rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: wrap;
  white-space: nowrap;
}

.info-card__date {
  color: #666;
  margin-top: 10rem;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  .info-card__date {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}

.info-img-wrap {
  position: relative;
}

.info-img-wrap__tag {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.info-tag {
  padding: 8rem 12rem;
  border-top-left-radius: 8rem;
  border-bottom-right-radius: 8rem;
  color: #fff;
  font-family: Pretendard;
  font-size: 18rem;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.36rem;
}
.info-tag.info-tag--color-318469 {
  background-color: #318469;
}
.info-tag.info-tag--color-276685 {
  background-color: #276685;
}
.info-tag.info-tag--color-852778 {
  background-color: #852778;
}
.info-tag.info-tag--color-C87D2E {
  background-color: #c87d2e;
}
.info-tag.info-tag--color-3D4ABE {
  background-color: #3d4abe;
}
.info-tag.info-tag--color-B94C3E {
  background-color: #b94c3e;
}

@media screen and (max-width: 1280px) {
  .sec-info-top {
    padding-bottom: 18rem;
  }
  .info {
    padding: 15rem 0 0;
  }
  .info-first__img-wrap {
    height: auto;
  }
  .info-first__con {
    padding: 15rem 0 0;
  }
  .info-first__t {
    font-size: 18rem;
    line-height: 1.3;
    letter-spacing: -0.36rem;
  }
  .info-first__date {
    margin-top: 6rem;
  }
  .info-card__link {
    gap: 15rem;
  }
  .info-card__con {
    padding: 15rem 0 0;
  }
  .info-card__t {
    font-size: 18rem;
    line-height: 1.3;
    letter-spacing: -0.36rem;
    white-space: wrap;
  }
  .info-card__date {
    margin-top: 6rem;
  }
  .info-img-wrap {
    flex-shrink: 0;
  }
  .info-tag {
    font-size: 16rem;
    line-height: 1.2;
    letter-spacing: -0.32rem;
  }
}
@media screen and (max-width: 866px) {
  .sec-info-top {
    flex-direction: column;
    opacity: 0;
    transform: translateY(50rem);
    transition: opacity 0.8s ease, transform 0.8s ease;
  }
  .js-sec-info--active .sec-info-top {
    opacity: 1;
    transform: translateY(0);
  }
  .sec-info__t {
    gap: 8rem;
  }
  .info__inner {
    flex-direction: column;
    gap: 36rem;
  }
  .info__first {
    opacity: 0;
    transform: translateY(50rem);
    transition: opacity 0.8s ease, transform 0.8s ease;
    transition-delay: 0.5s;
  }
  .js-sec-info--active .info__first {
    opacity: 1;
    transform: translateY(0);
  }
  .info-first__t {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: wrap;
    white-space: nowrap;
  }
  .info__list {
    height: auto;
    gap: 36rem;
  }
  .info__item {
    opacity: 0;
    transform: translateY(50rem);
    transition: opacity 0.8s ease, transform 0.8s ease;
  }
  .js-sec-info--active .info__item {
    opacity: 1;
    transform: translateY(0);
  }
  .js-sec-info--active .info__item:nth-child(1) {
    transition-delay: 1.1s;
  }
  .js-sec-info--active .info__item:nth-child(2) {
    transition-delay: 1.2s;
  }
  .js-sec-info--active .info__item:nth-child(3) {
    transition-delay: 1.3s;
  }
  .info-card__link {
    gap: 0;
    flex-direction: column;
  }
  .info-card__img-wrap img {
    width: 100%;
    height: auto;
  }
  .info-card__t {
    max-width: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: wrap;
    white-space: nowrap;
  }
}
/* #endregion Info Section */
/* #region Notice Section */
.sec-notice {
  background: linear-gradient(180deg, #f5f8f5 0%, #eeebe2 100%);
}

.notice {
  display: flex;
  justify-content: space-between;
}

.notice__1 {
  width: 11.2%;
  min-width: 195rem;
}

.notice__2 {
  width: 50.42%;
}

.notice__3 {
  width: 28.06%;
}
@media screen and (min-width: 1281px) {
  .notice__3 {
    opacity: 0;
    transform: translateX(50rem);
    transition: opacity 0.8s ease, transform 0.8s ease;
  }
}
@media screen and (min-width: 1281px) {
  .js-notice--active .notice__3 {
    opacity: 1;
    transform: translateX(0);
    transition-delay: 1s;
  }
}
@media screen and (max-width: 1280px) {
  .notice__3 {
    opacity: 0;
    transform: translateY(50rem);
    transition: opacity 0.8s ease, transform 0.8s ease;
  }
}
@media screen and (max-width: 1280px) {
  .js-notice--active .notice__3 {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.6s;
  }
}

.notice-c__list {
  display: flex;
  flex-direction: column;
  gap: 24rem;
}

.notice-c__item {
  border-bottom: 1rem solid #ccc;
  transition: 0.4s;
}
@media screen and (min-width: 1281px) {
  .notice-c__item {
    opacity: 0;
    transform: translateX(-50rem);
    transition: opacity 0.8s ease, transform 0.8s ease, border-bottom 0.4s;
  }
  .notice-c__item:nth-child(2) {
    transition-delay: 0.1s;
  }
  .notice-c__item:nth-child(3) {
    transition-delay: 0.2s;
  }
  .notice-c__item:nth-child(4) {
    transition-delay: 0.3s;
  }
}
@media screen and (min-width: 1281px) {
  .js-notice--active .notice-c__item {
    opacity: 1;
    transform: translateX(0);
  }
}
@media screen and (max-width: 1280px) {
  .notice-c__item {
    opacity: 0;
    transform: translateY(50rem);
    transition: opacity 0.8s ease, transform 0.8s ease, border-bottom 0.4s;
  }
  .notice-c__item:nth-child(1) {
    transition-delay: 0.1s;
  }
  .notice-c__item:nth-child(2) {
    transition-delay: 0.2s;
  }
  .notice-c__item:nth-child(3) {
    transition-delay: 0.3s;
  }
  .notice-c__item:nth-child(4) {
    transition-delay: 0.4s;
  }
}
@media screen and (max-width: 1280px) {
  .js-notice--active .notice-c__item {
    opacity: 1;
    transform: translateY(0);
  }
}
.notice-c__item:hover {
  border-bottom: 1rem solid #074827;
}
.notice-c__item:hover .card-n__icon svg path {
  fill: #074827;
}

.card-n {
  position: relative;
  padding: 0 22rem 24rem 0;
}

.card-notice-tag {
  color: #074827;
  font-size: 18rem;
  line-height: 1.2;
  letter-spacing: -0.36rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: wrap;
  white-space: nowrap;
}

.card-notice-t {
  color: #111;
  font-family: Pretendard;
  font-size: 20rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.4rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: wrap;
  white-space: nowrap;
}

.card-n__t {
  margin-top: 6rem;
}

.card-n__icon {
  position: absolute;
  top: 35%;
  right: 0;
  width: 26rem;
  height: 26rem;
  transform: translateY(-50%);
}
.card-n__icon svg {
  width: 100%;
  height: 100%;
}
.card-n__icon svg path {
  transition: 0.4s;
}

@media screen and (max-width: 1280px) {
  .sec-notice__t {
    margin-bottom: 36rem;
  }
  .notice {
    flex-wrap: wrap;
  }
  .notice__1 {
    width: 100%;
  }
  .notice__2 {
    width: 60%;
  }
  .notice__3 {
    width: 35%;
  }
  .notice-c__list {
    gap: 20rem;
  }
  .card-n {
    padding: 0 40rem 20rem 0;
  }
  .card-notice-tag {
    font-size: 16rem;
    font-weight: 500;
    letter-spacing: -0.32rem;
  }
  .card-notice-t {
    font-size: 18rem;
    letter-spacing: -0.36rem;
  }
  .card-n__t {
    margin-top: 5rem;
  }
  .card-n__icon {
    top: 53%;
    width: 20rem;
    height: 20rem;
  }
  .notice-img-area__img-wrap {
    height: 100%;
  }
  .notice-img-area__img-wrap img {
    height: 100%;
    object-fit: cover;
  }
}
@media screen and (max-width: 767px) {
  .notice {
    flex-wrap: nowrap;
    flex-direction: column;
  }
  .notice__2 {
    width: 100%;
  }
  .notice__3 {
    width: 100%;
    margin-top: 50rem;
  }
  .card-n__t {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: wrap;
    display: -webkit-box;
    box-orient: vertical;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
  }
}
/* #endregion Notice Section */
/* #region Notice2 Section */
.sec-notice__notice2 {
  margin-top: 100rem;
}

.notice2 {
  display: flex;
  justify-content: space-between;
}

.notice2__1 {
  width: 11.2%;
  min-width: 195rem;
}

.notice2__2 {
  width: 84.85%;
}

.notice2-c__list {
  display: flex;
  min-height: 201rem;
  gap: 20rem;
}

.notice2-c__item {
  width: calc((100% - 80rem) / 5);
  border-radius: 10rem;
  border: 1rem solid #ccc;
  overflow: hidden;
  transition: 0.4s;
  opacity: 0;
  transform: translateY(50rem);
  transition: opacity 0.8s ease, transform 0.8s ease, border 0.4s, background 0.4s, box-shadow 0.4s;
}
.notice2-c__item:nth-child(1) {
  transition-delay: 0.1s;
}
.notice2-c__item:nth-child(2) {
  transition-delay: 0.2s;
}
.notice2-c__item:nth-child(3) {
  transition-delay: 0.3s;
}
.notice2-c__item:nth-child(4) {
  transition-delay: 0.4s;
}
.notice2-c__item:nth-child(5) {
  transition-delay: 0.5s;
}
.notice2-c__item:hover {
  border: 1rem solid var(--_GREEN, #074827);
  background: #fff;
  box-shadow: 0 4px 4px 0 rgba(21, 48, 34, 0.1);
  transform: translateY(-2rem);
}

.js-notice2--active .notice2-c__item {
  opacity: 1;
  transform: translateY(0);
}

.notice2-c__link {
  height: 100%;
  padding: 30rem 24rem;
}

.card-n2 {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.card-n2__t {
  margin-top: 6rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: wrap;
  display: -webkit-box;
  box-orient: vertical;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.card-notice-date {
  color: #666;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  .card-notice-date {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}

.card-n2__date {
  margin-top: auto;
}

@media screen and (max-width: 1280px) {
  .sec-notice__notice2 {
    margin-top: 50rem;
  }
  .notice2 {
    flex-wrap: wrap;
  }
  .notice2__1 {
    width: 100%;
  }
  .notice2__2 {
    width: 100%;
  }
  .notice2-c__list {
    gap: 16rem;
  }
  .notice2-c__item {
    border-radius: 8rem;
  }
  .notice2-c__link {
    padding: 24rem 20rem;
  }
}
@media screen and (max-width: 767px) {
  .notice2-c__list {
    flex-wrap: nowrap;
    flex-direction: column;
  }
  .notice2-c__item {
    width: 100%;
    flex-basis: 175rem;
  }
  .notice2-c__link {
    height: 100%;
  }
}
/* #endregion Notice2 Section */
/* #region timeless */
.sec-timeless {
  height: 100vh;
  overflow: hidden;
}

.sec-timeless__inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.timeless {
  position: relative;
  z-index: 10;
}

.timeless__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  overflow: hidden;
}
.timeless__bg img {
  height: 100%;
  object-fit: cover;
}

.timeless__t {
  display: flex;
  flex-direction: column;
}

.timeless__t-sub {
  display: flex;
  align-items: center;
  gap: 18rem;
}

.tit__sub-2 {
  width: 78rem;
}

.timeless__t-t {
  margin-top: 10rem;
}

.timeless__p1 {
  color: #f2e8dd;
  text-align: center;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 120%; /* 28.8px */
  letter-spacing: -0.48rem;
  opacity: 0;
  margin-top: 42rem;
}

.timeless__p2 {
  color: #938e88;
  text-align: center;
  font-family: Pretendard;
  font-size: 20rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 28px */
  letter-spacing: -0.4rem;
  opacity: 0;
  margin-top: 20rem;
}

.timeless-img {
  position: absolute;
  border-radius: 20rem;
  width: 374rem;
  height: 477rem;
  overflow: hidden;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
.timeless-img.timeless-img--1 {
  z-index: 4;
}
.timeless-img.timeless-img--2 {
  z-index: 3;
}
.timeless-img.timeless-img--3 {
  z-index: 2;
}

.t-clock {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 63.34%;
  transform: translate(-50%, -50%);
  z-index: 0;
}

.t-clock__img-wrap {
  position: relative;
  width: 100%;
  height: 100%;
}
.t-clock__img-wrap img {
  object-fit: contain;
}

.t-clock__hand-wrap {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 34.31rem;
  height: 34.31rem;
  transform: translate(-50%, -50%);
  background: center/34.31rem url('/user/en/images/main/clock_mid.svg') no-repeat;
  border-radius: 50%;
}
@media screen and (max-width: 1280px) {
  .t-clock__hand-wrap {
    width: 19.25px;
    height: 19.25px;
  }
}

.t-clock__minute-wrap {
  position: absolute;
  left: calc(50% - 2.5rem);
  bottom: 50%;
  width: 4.99rem;
  transform-origin: center bottom;
  transform: rotate(30deg), translate(-50%, -50%);
  animation-play-state: paused;
}

.t-clock__minute {
  width: 100%;
  height: auto;
}

.t-clock__hour-wrap {
  position: absolute;
  left: calc(50% - 4.37rem);
  bottom: 50%;
  width: 8.74rem;
  transform-origin: center bottom;
  transform: rotate(-60deg), translate(-50%, -50%);
  animation-play-state: paused;
}

.t-clock__hour {
  width: 100%;
  height: auto;
}

.t-clock--active .t-clock__minute-wrap {
  animation: minute-hand-rotate 20s linear infinite;
  animation-play-state: running;
}
.t-clock--active .t-clock__hour-wrap {
  animation: hour-hand-rotate 240s linear infinite;
  animation-play-state: running;
}

@keyframes minute-hand-rotate {
  0% {
    transform: rotate(30deg);
  }
  100% {
    transform: rotate(390deg);
  }
}
@keyframes hour-hand-rotate {
  0% {
    transform: rotate(-60deg);
  }
  100% {
    transform: rotate(300deg);
  }
}
@media screen and (max-width: 1280px) {
  .timeless__t-sub {
    gap: 8rem;
  }
  .tit__sub-2 {
    width: 43rem;
  }
  .timeless__t-t {
    margin-top: 6rem;
  }
  .timeless__p1 {
    font-size: 20rem;
    letter-spacing: -0.4rem;
  }
  .timeless__p2 {
    font-size: 18rem;
    letter-spacing: -0.36rem;
    margin-top: 10rem;
    padding-inline: 20rem;
  }
  .timeless-img {
    border-radius: 6.48rem;
    width: 33.61%;
    height: auto;
    aspect-ratio: 374/477;
  }
  .t-clock {
    width: 150%;
  }
}
/* #endregion timeless */
/* Fund Series Text Animations */
.fs-item__t .text-wrap,
.fs-item__p1,
.fs-item__p2 {
  opacity: 0;
  transform: translateY(30rem);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.fs-item__con--on .fs-item__t .text-wrap {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.1s;
}

.fs-item__con--on .fs-item__p1 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.3s;
}

.fs-item__con--on .fs-item__p2 {
  opacity: 1;
  transform: none;
  transition-delay: 0.6s;
}

.pop_slideWrap {
  position: absolute;
  right: 80rem;
  top: 108rem;
  z-index: 100;
}
.pop_slideWrap .popup-slider-wrapper {
  box-shadow: none;
  width: 482rem;
  border-radius: 0;
}
.pop_slideWrap .swiper-slide {
  height: 400rem;
}
.pop_slideWrap .swiper-slide img {
  height: 400rem;
  object-fit: cover;
}
.pop_slideWrap .popup-controls {
  padding: 15rem 16rem 15rem 19rem;
}
.pop_slideWrap .popup-controls .pop_pagination {
  position: static;
  transform: translate(0);
  display: flex;
  justify-content: flex-start;
  gap: 15rem;
}
.pop_slideWrap .popup-controls .hide-today {
  color: #b3b3b3;
  font-size: 14rem;
  text-decoration: underline;
  font-weight: 500;
  white-space: nowrap;
}
.pop_slideWrap .popup-controls .hide-today input {
  display: none;
}
.pop_slideWrap .popup-swiper .swiper-pagination-bullet {
  margin-inline: 0;
  background-color: #b3b3b3;
  opacity: 1;
  transform: scale(1);
  left: 0 !important;
}
.pop_slideWrap .popup-swiper .swiper-pagination-bullet-active {
  background-color: #268cff;
}
.pop_slideWrap .popup-close-all-btn {
  right: 0;
  top: 0;
  width: 48rem;
  height: 48rem;
  border-radius: 0;
  background: url('/user/images/common/icon_x_w.svg') no-repeat center/ 22rem rgba(0, 0, 0, 0.5);
}
.pop_slideWrap .popup-close-all-btn:hover {
  background: url('/user/images/common/icon_x_w.svg') no-repeat center/ 22rem rgba(0, 0, 0, 0.5);
}

@media screen and (max-width: 1280px) {
  .pop_slideWrap {
    right: 50%;
    top: 75rem;
    transform: translate(50%);
  }
  .pop_slideWrap .popup-slider-wrapper {
    width: calc(100vw - 30rem);
    max-width: 330rem;
  }
  .pop_slideWrap .swiper-slide img {
    height: 244rem;
  }
  .pop_slideWrap .popup-controls {
    padding: 11rem 10rem;
  }
  .pop_slideWrap .popup-controls .pop_pagination {
    gap: 10rem;
  }
  .pop_slideWrap .popup-controls .hide-today {
    font-size: 12rem;
    white-space: nowrap;
  }
  .pop_slideWrap .popup-swiper .swiper-pagination-bullet {
    width: 6rem;
    height: 6rem;
  }
  .pop_slideWrap .popup-swiper .swiper-pagination-bullet-active {
    background-color: #232323;
  }
  .pop_slideWrap .popup-close-all-btn {
    width: 38rem;
    height: 38rem;
  }
}
@media screen and (max-width: 360px) {
  .pop_slideWrap .swiper-slide {
    height: auto;
  }
}

#search_container .hero_section {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: var(--bg-search);
  padding: 220rem 0 64rem;
}
#search_container .hero_section h1 {
  font-size: 60rem;
  font-weight: 600;
  color: var(--black);
  line-height: 120%;
  letter-spacing: -1.2rem;
}
#search_container .search_result_section {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 100rem 275rem 160rem;
  width: 100%;
  gap: 100rem;
}
#search_container .filter_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 48rem;
  padding: 10rem 0;
  border-radius: 4rem;
  border: 1rem solid var(--text-gray);
  background: var(--white);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  color: var(--text-black-2);
  font-size: 20rem;
  font-weight: 400;
  line-height: 140%;
}
#search_container .filter_btn:hover {
  background: var(--bg-search);
}
#search_container .filter_btn.active {
  background: var(--green-2);
  color: var(--white);
  font-weight: 600;
  border-color: var(--green-2);
}
@media screen and (max-width: 1280px) {
  #search_container .filter_btn {
    font-size: 16rem;
    height: auto;
    padding: 8rem 0;
  }
}
#search_container .apply_btn {
  padding: 10rem 14rem;
  border-radius: 8rem;
  font-size: 18rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  width: 158rem;
  order: 2;
  align-self: flex-end;
  position: relative;
  z-index: 10;
  background: var(--black);
  color: var(--white);
}
#search_container .apply_btn.mo {
  flex: 1;
  width: auto;
}
#search_container .filter_search_field {
  /* 고급 옵션 컨테이너 (더보기/닫기 애니메이션) */
  /* 더보기 버튼 */
  width: 100%;
  max-width: 1370rem;
  margin-top: 64rem;
  padding: 46rem 80rem;
  background: var(--bg-datepicker);
  border-radius: 16rem;
  border: 1rem solid var(--list-border);
  /* 위험 게이지(수직 정렬: 게이지 위, 버튼 아래) */
  /* 제출 버튼 제거(변경 즉시 전송 정책) */
}
#search_container .filter_search_field .advanced_group {
  overflow: hidden;
  transition: grid-template-rows 0.24s ease;
  display: grid;
  grid-template-rows: 0fr;
}
#search_container .filter_search_field .advanced_group .advanced_content {
  min-height: 0; /* 0fr 수축 시 내용 뭉개짐 방지 */
}
#search_container .filter_search_field.advanced-open .advanced_group {
  grid-template-rows: 1fr;
}
#search_container .filter_search_field .more_btn {
  width: 100%;
  display: flex;
  position: absolute;
  justify-content: center;
  align-items: center;
  gap: 8rem;
  cursor: pointer;
  user-select: none;
  color: var(--text-black);
  font-size: 18rem;
  font-weight: 500;
  order: 1;
}
#search_container .filter_search_field .more_btn::after {
  content: '';
  width: 12rem;
  height: 12rem;
  background: url('/user/en/images/common/arrow_down.svg') center/contain no-repeat;
  transform: rotate(0deg);
  transition: transform 0.25s ease;
}
#search_container .filter_search_field.advanced-open .more_btn::after {
  transform: rotate(180deg);
}
#search_container .filter_search_field .filter_section {
  display: flex;
  align-items: center;
  gap: 12rem;
}
#search_container .filter_search_field .mo_label_box {
  position: absolute;
  top: 0;
  left: 0;
}
#search_container .filter_search_field .bottom_filter {
  display: flex;
  position: relative;
  flex-direction: column;
  gap: 16rem;
  align-items: stretch;
  justify-content: center;
  padding-top: 24rem;
  margin-top: 48rem;
  border-top: 1rem solid var(--text-gray);
}
#search_container .filter_search_field .label_unit {
  min-width: 120rem;
  font-size: 20rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.4rem;
  color: var(--text-black);
}
@media screen and (max-width: 1280px) {
  #search_container .filter_search_field .label_unit {
    font-size: 18rem;
  }
}
#search_container .filter_search_field .button_box {
  display: grid;
  position: relative;
  grid-template-columns: repeat(7, 1fr);
  gap: 10rem;
  flex: 1;
}
#search_container .filter_search_field .risk_filter_box {
  padding: 10rem 0 0;
}
#search_container .filter_search_field .risk_thumb.right {
  left: 100%;
  transform: translateX(-50%);
  border: 4rem solid transparent;
  transition: left 0.2s ease, border-color 0.15s ease;
}
#search_container .filter_search_field .risk_thumb.right.dragging {
  transition: none;
}
#search_container .filter_search_field .risk_label_box {
  display: flex;
  gap: 8rem;
  margin-top: 8rem;
  width: 100%;
}
#search_container .filter_search_field .risk_label_box .risk_unit {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
  width: 100%;
  text-align: center;
  padding: 4rem 0;
  border-radius: 6rem;
  font-size: 20rem;
  font-weight: 400;
  line-height: 140%;
  background: var(--white);
  color: var(--text-black);
  border: 1rem solid var(--text-gray);
  cursor: pointer;
  pointer-events: auto;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
#search_container .filter_search_field .risk_label_box .risk_unit:hover:not(.selected) {
  background-color: var(--highlight-hover);
  transform: translateY(-2rem);
}
#search_container .filter_search_field .risk_label_box .risk_unit.selected {
  font-weight: 600;
  color: #fff;
  outline: none;
  border-color: transparent;
}
#search_container .filter_search_field .risk_label_box .risk_unit.selected:nth-child(1) {
  background-color: var(--risk-grade-1);
}
#search_container .filter_search_field .risk_label_box .risk_unit.selected:nth-child(2) {
  background-color: var(--risk-grade-2);
}
#search_container .filter_search_field .risk_label_box .risk_unit.selected:nth-child(3) {
  background-color: var(--risk-grade-3);
}
#search_container .filter_search_field .risk_label_box .risk_unit.selected:nth-child(4) {
  background-color: var(--risk-grade-4);
}
#search_container .filter_search_field .risk_label_box .risk_unit.selected:nth-child(5) {
  background-color: var(--risk-grade-5);
}
#search_container .filter_search_field .risk_label_box .risk_unit.selected:nth-child(6) {
  background-color: var(--risk-grade-6);
  border-color: var(--risk-grade-6);
}
#search_container .result_field {
  display: flex;
  flex-direction: column;
  width: 100%;
}
#search_container .result_field .title_box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1rem solid var(--text-black-sub);
  padding-bottom: 24rem;
}
#search_container .result_field .title_box .info_box {
  display: flex;
  align-items: center;
}
#search_container .result_field .title_box span {
  display: flex;
}
#search_container .result_field .title_box h3 {
  color: var(--text-black);
  font-size: 24rem;
  font-weight: 500;
  line-height: 130%;
  letter-spacing: -0.48rem;
}
#search_container .result_field .title_box data {
  margin-left: 6rem;
  color: var(--highlight);
  font-size: 24rem;
  font-weight: 500;
  line-height: 130%;
  letter-spacing: -0.48rem;
}
#search_container .result_field .title_box p {
  margin-left: 12rem;
  color: var(--placeholder);
  font-size: 18rem;
  font-weight: 400;
  line-height: 120%;
}
#search_container .result_field .title_box .search_more_btn {
  display: flex;
  align-items: center;
  gap: 24rem;
  padding: 12rem 20rem;
  border-radius: 10rem;
  background-color: rgba(255, 255, 255, 0.2);
  border: 1rem solid rgba(17, 17, 17, 0.3);
}
#search_container .result_field .title_box .search_more_btn > img {
  width: 18rem;
  height: 18rem;
}
#search_container .result_field .search_list_box {
  display: flex;
  flex-direction: column;
}
#search_container .result_field .search_list_box li:not(:last-child) {
  border-bottom: 1rem solid var(--list-border);
}
#search_container .result_field .search_list_box li a {
  display: flex;
  justify-content: space-between;
  overflow: hidden;
  padding: 24rem 0;
  color: var(--text-black);
  font-size: 20rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.4rem;
  word-break: break-all;
}
#search_container .result_field .search_list_box li a .title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: wrap;
  white-space: nowrap;
}
#search_container .result_field .search_list_box li .created_at {
  padding: 0 54rem;
  color: var(--placeholder);
  font-size: 18rem;
  font-weight: 400;
  letter-spacing: -0.36rem;
}
#search_container .result_field .fund_header_table {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}
#search_container .result_field .fund_header_table thead {
  background-color: var(--bg-search);
}
#search_container .result_field .fund_header_table thead th {
  padding: 20rem 14rem;
  text-align: center;
  vertical-align: middle;
  color: var(--text-black-sub);
  font-size: 18rem;
  font-weight: 500;
  line-height: 120%;
}
#search_container .result_field .fund_header_table thead th:not(:last-child) {
  border-right: 1rem solid var(--text-gray);
}
#search_container .result_field .fund_header_table thead th.product_info {
  flex: 1;
}
#search_container .result_field .fund_header_table thead th.setup_amount {
  width: 150rem;
}
#search_container .result_field .fund_header_table thead th.net_asset {
  width: 150rem;
}
#search_container .result_field .fund_header_table thead th.yield_rate {
  width: 480rem;
  background-color: rgba(255, 255, 255, 0.1);
}
#search_container .result_field .fund_header_table thead th.yield_periods {
  padding: 12rem 8rem;
  border-top: 1rem solid var(--text-gray);
}
#search_container .result_field .fund_header_table thead th.yield_periods .yield_periods_box {
  display: flex;
  justify-content: center;
  align-items: center;
}
#search_container .result_field .fund_header_table thead th.yield_periods .yield_periods_box .yield_period {
  padding: 0 30rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
#search_container .result_field .fund_header_table thead th.yield_periods .yield_periods_box .yield_period.sortable {
  cursor: pointer;
  transition: color 0.2s ease;
}
#search_container .result_field .fund_header_table thead th.yield_periods .yield_periods_box .divider {
  height: 20rem;
  width: 1rem;
  background-color: var(--text-gray);
}
#search_container .result_field .fund_header_table thead th.sortable .sort_box {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
#search_container .result_field .fund_header_table thead .sortable {
  cursor: pointer;
  position: relative;
  transition: color 0.2s ease;
}
#search_container .result_field .fund_header_table thead .sortable.active {
  color: var(--highlight);
}
#search_container .result_field .fund_header_table thead .sortable.active .sort_icon {
  filter: brightness(0) saturate(100%) invert(20%) sepia(13%) saturate(2074%) hue-rotate(83deg) brightness(97%)
    contrast(89%);
}
#search_container .result_field .fund_header_table thead .sortable.active.asc .sort_icon {
  transform: rotate(180deg);
}
#search_container .result_field .fund_header_table thead .sortable.active.desc .sort_icon {
  transform: rotate(0deg);
}
#search_container .result_field .fund_header_table thead .sort_icon {
  width: 10rem;
  margin-left: 4rem;
  filter: brightness(0) saturate(100%) invert(68%) sepia(0%) saturate(0%) hue-rotate(314deg) brightness(92%)
    contrast(88%);
  transition: transform 0.2s ease, filter 0.2s ease;
  vertical-align: middle;
}
#search_container .result_field .fund_header_filter {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--bg-search);
  z-index: var(--z-dropdown);
}
#search_container .result_field .fund_header_filter .sort_order_btn {
  display: flex;
  border-right: 1rem solid var(--text-gray);
  flex: 1;
  align-items: center;
  gap: 8rem;
  padding: 16rem 12rem;
  cursor: pointer;
  transition: all 0.2s ease;
  color: var(--text-black);
  font-size: 16rem;
  font-weight: 500;
  line-height: 120%;
}
#search_container .result_field .fund_header_filter .sort_order_btn .order_icon {
  width: 12rem;
  height: 12rem;
  transition: transform 0.2s ease, filter 0.2s ease;
}
#search_container .result_field .fund_header_filter .sort_order_btn[data-order='desc'] .order_icon {
  transform: rotate(0deg);
}
#search_container .result_field .fund_header_filter .sort_order_btn[data-order='asc'] .order_icon {
  transform: rotate(180deg);
}
#search_container .result_field .fund_header_filter .search_filter_dropdown {
  flex: 1;
}
#search_container .result_field .fund_header_filter .dropdown_btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16rem 12rem;
  border: none;
  background: transparent;
  transition: all 0.2s ease;
  color: var(--text-black);
  font-size: 16rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.32rem;
}
#search_container .result_field .fund_header_filter .dropdown_btn .dropdown_text {
  flex: 1;
  text-align: left;
}
#search_container .result_field .fund_header_filter .dropdown_btn .dropdown_icon {
  width: 14rem;
  height: 14rem;
}
#search_container .result_field .fund_header_filter .dropdown_list {
  position: absolute;
  overflow: auto;
  height: auto;
  border-bottom: 2rem solid var(--text-black-sub);
}
#search_container .result_field .fund_search_list_box {
  display: flex;
  flex-direction: column;
  padding-top: 24rem;
  gap: 16rem;
}
#search_container .result_field .fund_badge_box {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}
#search_container .result_field .fund_badge_box > div {
  display: flex;
  width: 80rem;
  padding: 3rem 8rem;
  justify-content: center;
  align-items: center;
  border-radius: 2rem;
  font-size: 18rem;
  font-weight: 500;
  color: var(--text-black);
}
#search_container .result_field .fund_badge_box > div.default {
  background-color: var(--white);
  border: 1rem solid rgba(170, 170, 170, 0.8);
}
#search_container .result_field .fund_badge_box > div.point {
  background-color: var(--badge-point);
}
#search_container .result_field .fund_search_card {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
  display: flex;
  position: relative;
  justify-content: flex-end;
  align-items: center;
  padding: 48rem;
  border-radius: 16rem;
  border: 1rem solid var(--list-border);
  background: var(--white);
  cursor: pointer;
}
#search_container .result_field .fund_search_card .main_info_box {
  display: flex;
  gap: 20rem;
  flex: 1;
}
#search_container .result_field .fund_search_card .card_title_box {
  display: flex;
  flex-direction: column;
  width: 400rem;
  justify-content: center;
  color: var(--text-black);
  font-size: 24rem;
  font-weight: 500;
  line-height: 130%;
  letter-spacing: -0.48rem;
  word-break: break-all;
}
#search_container .result_field .fund_search_card .amount_box {
  display: flex;
  gap: 30rem;
  color: var(--text-black);
  font-size: 20rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.4rem;
}
#search_container .result_field .fund_search_card .rate_box {
  display: flex;
  justify-content: space-between;
  width: 376rem;
  margin-left: 75rem;
  font-size: 20rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.4rem;
}
#search_container .result_field .fund_search_card .rate_box img {
  position: absolute;
  top: 0;
  width: 64rem;
}
#search_container .result_field .fund_search_card .rate_box .up {
  color: var(--red);
}
#search_container .result_field .fund_search_card .rate_box .down {
  color: var(--blue);
}
.no_result_section {
  padding-block: 160rem;
  font-size: 24rem;
  font-weight: 500;
  color: #111;
  text-align: center;
}
@media screen and (max-width: 1280px) {
  .no_result_section {
    font-size: 20rem;
    padding-block: 80rem;
  }
}

body.modal-open {
  overflow: hidden !important;
}

@media screen and (max-width: 1280px) {
  /* Mobile Filter Modal */
  #search_container .hero_section {
    padding: 120rem 20rem 36rem;
  }
  #search_container .hero_section h1 {
    font-size: 34rem;
  }
  #search_container .search_result_section {
    padding: 64rem 20rem 80rem;
    gap: 64rem;
  }
  #search_container .mobile_fund_search_card {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    border: 1rem solid var(--list-border);
    background: var(--white);
    border-radius: 10rem;
    padding: 40rem 24rem;
  }
  #search_container .mobile_fund_search_card .card_title_box {
    margin-top: 16rem;
    color: var(--text-black);
    font-size: 24rem;
    font-weight: 500;
    line-height: 130%;
    letter-spacing: -0.48rem;
    word-break: break-all;
  }
  #search_container .mobile_fund_search_card .amount_list_box {
    display: flex;
    flex-direction: column;
    gap: 10rem;
    margin-top: 16rem;
    margin-bottom: 24rem;
  }
  #search_container .mobile_fund_search_card .amount_list_box .amount_item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--text-black);
  }
  #search_container .mobile_fund_search_card .amount_list_box .amount_item :nth-child(1) {
    font-size: 16rem;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: -0.32rem;
  }
  #search_container .mobile_fund_search_card .amount_list_box .amount_item :nth-child(2) {
    font-size: 18rem;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: -0.36rem;
  }
  #search_container .mobile_fund_search_card .divider {
    width: 100%;
    height: 1rem;
    background-color: var(--text-gray);
  }
  #search_container .mobile_fund_search_card .rate_info_box {
    display: flex;
    justify-content: space-between;
    margin-top: 24rem;
  }
  #search_container .mobile_fund_search_card .rate_box {
    display: flex;
    position: relative;
    flex-direction: column;
    width: 136rem;
    font-size: 16rem;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: -0.32rem;
  }
  #search_container .mobile_fund_search_card .rate_box img {
    position: absolute;
    left: -56rem;
    width: 40rem;
  }
  #search_container .mobile_fund_search_card .rate_box > div {
    display: flex;
    height: 42rem;
    justify-content: space-between;
    align-items: center;
  }
  #search_container .mobile_fund_search_card .rate_box > .value {
    font-size: 18rem;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: -0.36rem;
  }
  #search_container .mobile_fund_search_card .rate_box .up {
    color: var(--red);
  }
  #search_container .mobile_fund_search_card .rate_box .down {
    color: var(--blue);
  }
  #search_container .mobile_more_btn {
    margin-top: 48rem;
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    padding: 12rem 0;
    gap: 4rem;
    cursor: pointer;
    user-select: none;
    border-radius: 10rem;
    border: 1rem solid var(--text-gray);
    background-color: var(--white);
    box-shadow: 0 0 10rem 0 rgba(7, 72, 39, 0.05);
    color: var(--text-black);
    font-size: 18rem;
    font-weight: 500;
    line-height: 120%;
    letter-spacing: -0.36rem;
  }
  #search_container .mobile_more_btn::after {
    content: '';
    width: 12rem;
    height: 12rem;
    background: url('/user/en/images/common/arrow_down.svg') center/contain no-repeat;
    transform: rotate(0deg);
    transition: transform 0.25s ease;
  }
  #search_container .mobile_filter_modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: none;
  }
  #search_container .mobile_filter_modal.active {
    display: flex;
    align-items: stretch;
  }
  #search_container .mobile_filter_modal .mobile_modal_overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4rem);
  }
  #search_container .mobile_filter_modal .mobile_modal_content {
    position: relative;
    width: 100%;
    height: 100%;
    background: var(--white);
    display: flex;
    flex-direction: column;
    transform: translateY(100%);
    transition: transform 0.3s ease-out;
  }
  #search_container .mobile_filter_modal .mobile_modal_content.show {
    transform: translateY(0);
  }
  #search_container .mobile_filter_modal .mobile_filter_content {
    flex: 1;
    overflow-y: auto;
    padding: 40rem 20rem 20rem;
  }
  #search_container .mobile_filter_modal .mobile_filter_content .filter_section {
    display: flex;
    flex-direction: column;
    gap: 16rem;
    margin-bottom: 32rem;
    /* Mobile Risk Filter Styles */
  }
  #search_container .mobile_filter_modal .mobile_filter_content .filter_section:last-child {
    margin-bottom: 0;
  }
  #search_container .mobile_filter_modal .mobile_filter_content .filter_section .label_unit {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18rem;
    font-weight: 600;
    color: var(--text-black);
  }
  #search_container .mobile_filter_modal .mobile_filter_content .filter_section .label_unit .all_btn {
    width: 104rem;
    height: 44rem;
    padding: 8rem 12rem;
    border-radius: 6rem;
    border: 1rem solid var(--text-gray);
    background: var(--white);
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
    color: var(--text-black-2);
    font-size: 16rem;
    font-weight: 400;
    line-height: 120%;
  }
  #search_container .mobile_filter_modal .mobile_filter_content .filter_section .label_unit .all_btn:hover {
    background: var(--bg-search);
  }
  #search_container .mobile_filter_modal .mobile_filter_content .filter_section .label_unit .all_btn.active {
    background: var(--highlight);
    color: var(--white);
    font-weight: 600;
    border-color: var(--highlight);
  }
  #search_container .mobile_filter_modal .mobile_filter_content .filter_section .button_box {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10rem;
  }
  #search_container .mobile_filter_modal .mobile_modal_footer {
    display: flex;
    gap: 12rem;
    padding: 20rem;
    border-top: 1rem solid var(--list-border);
  }
  #search_container .mobile_filter_modal .mobile_modal_footer .mobile_close_btn {
    flex: 1;
    padding: 10rem 14rem;
    border-radius: 8rem;
    font-size: 18rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    background: var(--white);
    color: var(--text-black);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4rem;
  }
  #search_container .mobile_filter_modal .mobile_modal_footer .mobile_close_btn img {
    width: 12rem;
    height: 12rem;
  }
  #search_container .result_field .search_list_box li a {
    flex-direction: column;
    gap: 10rem;
    font-size: 18rem;
    padding: 20rem 0;
  }
  #search_container .result_field .search_list_box li a .title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: wrap;
    display: -webkit-box;
    box-orient: vertical;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
  }
  #search_container .result_field .search_list_box li .created_at {
    padding: 0;
  }
  #search_container .result_field .title_box {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-end;
    gap: 18rem;
    padding-bottom: 12rem;
  }
  #search_container .result_field .title_box h3 {
    font-size: 22rem;
  }
  #search_container .result_field .title_box data {
    margin-left: 3rem;
    font-size: 22rem;
  }
  #search_container .result_field .title_box p {
    margin-left: 0;
    font-size: 16rem;
  }
  #search_container .result_field .title_box .search_more_btn {
    padding: 10rem 14rem;
    font-size: 14rem;
    gap: 16rem;
  }
  #search_container .result_field .info_box {
    width: 100%;
    gap: 6rem;
  }
  #search_container .result_field .info_box.vertical {
    align-items: flex-start;
    flex-direction: column;
  }
  #search_container .result_field .fund_badge_box {
    flex-direction: row;
    gap: 6rem;
  }
  #search_container .result_field .fund_badge_box > div {
    width: 65rem;
    padding: 3rem 6rem;
    font-size: 16rem;
    line-height: normal;
  }
}
.blind {
  position: absolute;
  clip: rect(0 0 0 0);
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
}

.inner {
  width: 100%;
  height: 100%;
}

.no-scroll {
  overflow: hidden;
}

.hp-sticky {
  position: sticky;
  top: 160rem;
  left: 0;
  transition: 0.4s;
}

.hp-scroll-x {
  width: 100%;
  overflow-x: auto;
  /* width */
  /* Track */
  /* Handle */
}
@media screen and (max-width: 1280px) {
  .hp-scroll-x.hp-scroll-x--w640-m20 {
    width: calc(100% + 20rem);
    max-width: 727rem;
  }
  .hp-scroll-x.hp-scroll-x--w640-m20 > * {
    min-width: 640rem;
  }
}

.hp-sticky-ty1 {
  position: sticky;
  top: 90rem;
}
@media screen and (max-width: 1280px) {
  .hp-sticky-ty1 {
    position: static;
    top: auto;
  }
}

.hp-border-radius-ty1 {
  border-radius: 10rem;
  overflow: hidden;
}

@media screen and (max-width: 1280px) {
  .hp-border-radius-ty1 {
    border-radius: 8rem;
  }
}
.hp-bgf4f2e7 {
  background-color: #f4f2e7 !important;
}

.hp-bgf2f3ed {
  background-color: #f2f3ed !important;
}

.hp-bgf6f2ed {
  background-color: #f6f2ed !important;
}

.hp-bgf6f4f1 {
  background-color: #f6f4f1 !important;
}

.hp-bgf2f5f6 {
  background-color: #f2f5f6 !important;
}

.hp-bge7edea {
  background-color: #e7edea !important;
}

.hp-bg1f362a {
  background-color: #1f362a !important;
}

.hp-overflow-hidden {
  overflow: hidden;
}

/* swiper navi */
.swiper-navi-wrap {
  display: flex;
  justify-content: end;
  gap: 20rem;
  opacity: 1;
}

.swiper-button-prev {
  position: static;
  display: block;
  width: 60rem;
  height: 60rem;
  opacity: 1;
  margin: 0;
}
.swiper-button-prev::after {
  display: none;
}

.swiper-button-next {
  position: static;
  display: block;
  width: 60rem;
  height: 60rem;
  border-radius: 50%;
  opacity: 1;
  margin: 0;
  background: center/12rem 20rem url('/user/en/images/main/swiper_navi_next_arrow.svg') no-repeat
    rgba(255, 255, 255, 0.5);
}
.swiper-button-next::after {
  display: none;
}

@media screen and (max-width: 1280px) {
  .swiper-button-next {
    width: 30rem;
    height: 30rem;
    background: center/7rem 11rem url('/user/en/images/main/swiper_navi_next_arrow.svg') no-repeat
      rgba(255, 255, 255, 0.5);
  }
}
/* swiper pagi */
.pagi-area {
  display: flex;
  justify-content: center;
}
.pagi-area .swiper-pagination {
  position: static;
  display: inline-flex;
  width: auto;
  height: auto;
  gap: 10rem;
  transform: none;
}
.pagi-area .swiper-pagination .swiper-pagination-bullet {
  display: block;
  width: 6rem;
  height: 6rem;
  margin: 0;
  opacity: 1;
  background: rgba(17, 17, 17, 0.2);
  border-radius: 50%;
  flex-shrink: 0;
  transition: 0.3s;
}
.pagi-area .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--Text_02, #575757);
}
.pagi-area .swiper-pagination.swiper-pagination--w .swiper-pagination-bullet {
  background: #434343;
}
.pagi-area .swiper-pagination.swiper-pagination--w .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #fff;
}
.pagi-area .swiper-pagination.swiper-pagination--ty1 {
  gap: 19rem;
}
.pagi-area .swiper-pagination.swiper-pagination--ty1 .swiper-pagination-bullet {
  position: relative;
  width: 20rem;
  height: 20rem;
  border-radius: 50%;
  border: 1rem solid transparent;
  transition: 0.5s;
}
.pagi-area .swiper-pagination.swiper-pagination--ty1 .swiper-pagination-bullet::before {
  content: '';
  position: absolute;
  width: 10rem;
  height: 10rem;
  border-radius: 50%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.5);
  margin: auto;
  z-index: 1;
}
.pagi-area .swiper-pagination.swiper-pagination--ty1 .swiper-pagination-bullet .pagi-text {
  position: absolute;
  top: 0;
  left: calc(100% + 20rem);
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  white-space: nowrap;
  color: rgba(255, 255, 255, 0.5);
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -0.36rem;
  transition: 0.5s;
}
.pagi-area .swiper-pagination.swiper-pagination--ty1 .swiper-pagination-bullet.swiper-pagination-bullet-active {
  border: 1rem solid #fff;
}
.pagi-area
  .swiper-pagination.swiper-pagination--ty1
  .swiper-pagination-bullet.swiper-pagination-bullet-active
  .pagi-text {
  color: #fff;
}
.pagi-area .swiper-pagination.swiper-pagination--ty1 .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
  background-color: #fff;
}
@media screen and (max-width: 1280px) {
  .pagi-area .swiper-pagination.swiper-pagination--ty1 {
    gap: 15rem;
  }
  .pagi-area .swiper-pagination.swiper-pagination--ty1 .swiper-pagination-bullet {
    width: 12rem;
    height: 12rem;
  }
  .pagi-area .swiper-pagination.swiper-pagination--ty1 .swiper-pagination-bullet::before {
    width: 6rem;
    height: 6rem;
  }
  .pagi-area .swiper-pagination.swiper-pagination--ty1 .swiper-pagination-bullet .pagi-text {
    left: calc(100% + 10rem);
    font-size: 14rem;
  }
}
@media screen and (max-width: 767px) {
  .pagi-area .swiper-pagination.swiper-pagination--ty1 {
    gap: 4rem;
    flex-direction: row;
  }
  .pagi-area .swiper-pagination.swiper-pagination--ty1 .swiper-pagination-bullet .pagi-text {
    display: none;
  }
}

.hp-fw-500 {
  font-weight: 500 !important;
}

.hp-font-c {
  text-align: center !important;
}

.hp-font-l {
  text-align: left !important;
}

.hp-font-r {
  text-align: right !important;
}

.hp-dot {
  position: relative;
  padding-left: 7rem;
}
.hp-dot::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.4em;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background-color: #ed1c24;
}

.hp-li-dot {
  position: relative;
  padding-left: 14rem;
}
.hp-li-dot::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.58em;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background-color: #3a3a3a;
}
.hp-li-dot.hp-li-dot--w3::before {
  width: 3rem;
  height: 3rem;
}
.hp-li-dot.hp-li-dot--w3w::before {
  width: 3rem;
  height: 3rem;
  background-color: #fff;
}

.hp-li-dot2 {
  position: relative;
  padding-left: 11rem;
}
.hp-li-dot2::before {
  content: '';
  position: absolute;
  left: 4rem;
  top: 0.46em;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: #999;
}
.hp-li-dot2.hp-li-dot2--777::before {
  background-color: #777;
}

.gutter {
  height: 1px;
}

.gutter--line {
  background-color: #777;
}

.hp-color-ci {
  color: var(--color-ci);
}

.hp-color-ci2 {
  color: var(--color-ci2);
}

.hp-color-fff {
  color: #fff !important;
}

.hp-color-af884f {
  color: #af884f !important;
}

.hp-color-e9d8c1 {
  color: #e9d8c1 !important;
}

.hp-color-e0c3b7 {
  color: #e0c3b7 !important;
}

.hp-color-fae4cf {
  color: #fae4cf !important;
}

.hp-color-dec3eb {
  color: #dec3eb !important;
}

.hp-flex-1 {
  flex: 1;
}

.hp-radius-ty1 {
  border-radius: 20rem;
  overflow: hidden;
}
@media screen and (max-width: 1280px) {
  .hp-radius-ty1 {
    border-radius: 10rem;
  }
}

/* #region Title */
.tit__t {
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}

.tit.tit--ty1 .tit__t {
  color: #3a3a3a;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}
.tit.tit--ty1 .tit__p {
  color: #111;
  font-family: Pretendard;
  font-size: 36rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 46.8px */
  letter-spacing: -0.72rem;
}
.tit.tit--ty2 .tit__t {
  color: #111;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}
.tit.tit--ty2 .tit__btn {
  margin-top: 24rem;
}
.tit.tit--ty3 .tit__t {
  color: #3a3a3a;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}
.tit.tit--ty4 {
  display: flex;
  justify-content: space-between;
}
.tit.tit--ty4 .tit__t {
  color: #3a3a3a;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}
.tit.tit--ty5 {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}
.tit.tit--ty5 .tit__t {
  color: #111;
  font-family: Pretendard;
  font-size: 48rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 62.4px */
  letter-spacing: -0.96rem;
}
.tit.tit--ty5 .tit__p {
  color: #3a3a3a;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36rem;
}
.tit.tit--ty6 {
  display: flex;
  flex-direction: column;
  gap: 10rem;
}
.tit.tit--ty6 .tit__t {
  color: #111;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}
.tit.tit--ty6 .tit__p {
  color: #aeaba2;
  font-family: 'Playfair Display';
  font-size: 64rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 83.2px */
  letter-spacing: 7.68rem;
}
.tit.tit--ty7 {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}
.tit.tit--ty7 .tit__t {
  color: #111;
  font-family: Pretendard;
  font-size: 36rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 46.8px */
  letter-spacing: -0.72rem;
}
.tit.tit--ty7 .tit__t-sub {
  color: var(--_GREEN, #074827);
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}
.tit.tit--ty8 {
  display: flex;
  flex-direction: column;
  gap: 10rem;
}
.tit.tit--ty8 .tit__t {
  color: #fff;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 31.2px */
  letter-spacing: -0.48rem;
}
.tit.tit--ty8 .tit__t-sub {
  color: #ede6d8;
  font-family: 'Playfair Display';
  font-size: 64rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 83.2px */
  letter-spacing: 7.68rem;
}
.tit.tit--ty9 {
  display: flex;
  flex-direction: column;
  gap: 16rem;
}
.tit.tit--ty9 .tit__t {
  color: #111;
  font-family: Pretendard;
  font-size: 36rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 46.8px */
  letter-spacing: -0.72rem;
}
.tit.tit--ty9 .tit__p {
  color: #3a3a3a;
  font-family: Pretendard;
  font-size: 20rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 28px */
  letter-spacing: -0.4rem;
}
.tit.tit--ty10 {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.tit.tit--ty10 .tit__t {
  color: #111;
  font-family: Pretendard;
  font-size: 36rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 46.8px */
  letter-spacing: -0.72rem;
}
.tit.tit--ty10 .tit__p {
  color: #666;
  text-align: right;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 120%; /* 21.6px */
  letter-spacing: -0.36rem;
}
.tit.tit--ty11 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10rem;
}
.tit.tit--ty11 .tit__t {
  color: #f2e8dd;
  text-align: center;
  font-family: 'Playfair Display';
  font-size: 110rem;
  font-style: normal;
  font-weight: 400;
  line-height: 130%; /* 143px */
}
.tit.tit--ty11 .tit__sub {
  color: #b4a593;
  font-family: Roboto;
  font-size: 26rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  text-transform: uppercase;
}

@media screen and (max-width: 1280px) {
  .tit__t {
    font-size: 20rem;
    line-height: 1.3;
    letter-spacing: -0.4rem;
  }
  .tit.tit--ty1 .tit__t {
    font-size: 20rem;
    letter-spacing: -0.4rem;
    line-height: 1.3;
  }
  .tit.tit--ty1 .tit__p {
    font-size: 24rem;
    line-height: 1.3;
    letter-spacing: -0.48rem;
  }
  .tit.tit--ty3 .tit__t {
    font-size: 20rem;
    line-height: 1.3;
    letter-spacing: -0.4rem;
  }
  .tit.tit--ty2 .tit__t {
    font-size: 20rem;
    line-height: 1.3;
    letter-spacing: -0.4rem;
  }
  .tit.tit--ty2 .tit__btn {
    margin-top: 12rem;
  }
  .tit.tit--ty4 .tit__t {
    font-size: 20rem;
    letter-spacing: -0.4rem;
  }
  .tit.tit--ty5 {
    gap: 8rem;
  }
  .tit.tit--ty5 .tit__t {
    font-size: 24rem;
    letter-spacing: -0.48rem;
  }
  .tit.tit--ty5 .tit__p {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
  .tit.tit--ty6 .tit__t {
    font-size: 20rem;
    letter-spacing: -0.4rem;
  }
  .tit.tit--ty6 .tit__p {
    font-size: 36rem;
    letter-spacing: 4.32rem;
  }
  .tit.tit--ty7 {
    gap: 8rem;
  }
  .tit.tit--ty7 .tit__t {
    font-size: 20rem;
    letter-spacing: -0.4rem;
  }
  .tit.tit--ty7 .tit__t-sub {
    font-size: 20rem;
    letter-spacing: -0.4rem;
  }
  .tit.tit--ty8 {
    gap: 6rem;
  }
  .tit.tit--ty8 .tit__t {
    color: #fff;
    font-family: Pretendard;
    font-size: 20rem;
    font-style: normal;
    font-weight: 500;
    line-height: 130%; /* 26px */
    letter-spacing: -0.4rem;
  }
  .tit.tit--ty8 .tit__t-sub {
    color: #ede6d8;
    font-family: 'Playfair Display';
    font-size: 36rem;
    font-style: normal;
    font-weight: 500;
    line-height: 130%; /* 46.8px */
    letter-spacing: 4.32rem;
  }
  .tit.tit--ty9 {
    gap: 8rem;
  }
  .tit.tit--ty9 .tit__t {
    font-size: 24rem;
    letter-spacing: -0.48rem;
  }
  .tit.tit--ty9 .tit__p {
    font-size: 18rem;
    letter-spacing: -0.36rem;
  }
  .tit.tit--ty10 {
    flex-direction: column;
    align-items: start;
    gap: 4rem;
  }
  .tit.tit--ty10 .tit__t {
    font-size: 24rem;
    letter-spacing: -0.48rem;
  }
  .tit.tit--ty10 .tit__p {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
  .tit.tit--ty11 {
    gap: 6rem;
  }
  .tit.tit--ty11 .tit__t {
    font-size: 44rem;
  }
  .tit.tit--ty11 .tit__sub {
    font-size: 18rem;
  }
}
/* #endregion Title */
/* icon */
.icon--dropdown-arrow {
  display: inline-block;
  width: 8rem;
  height: 5rem;
  background: center/contain url('/user/en/images/common/dropdown_arrow_2.svg') no-repeat;
  vertical-align: middle;
}

.icon--clip {
  display: inline-block;
  width: 26rem;
  height: 26rem;
  background: center/contain url('/user/en/images/common/icon_clip.svg') no-repeat;
  vertical-align: middle;
}

@media screen and (max-width: 1280px) {
  .icon--clip {
    width: 20rem;
    height: 20rem;
  }
}
/* button */
/* btn-ty1 */
.btn-ty1 {
  display: inline-block;
  height: 46rem;
  color: #fff;
  border-radius: 10rem;
  backdrop-filter: blur(5rem);
  transition: 0.4s;
  border: 1rem solid rgba(255, 255, 255, 0.3);
  background: rgba(0, 0, 0, 0.2);
}
.btn-ty1:hover {
  color: #111;
  background: #fff;
}
.btn-ty1:hover .btn-ty1__icon svg path {
  stroke: #111;
}

.btn-ty1__btn {
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 100%;
  gap: 24rem;
  padding: 0 20rem;
  font-family: Pretendard;
  font-size: 16rem;
  font-style: normal;
  font-weight: 500;
  line-height: 140%; /* 22.4px */
  letter-spacing: -0.32rem;
}

.btn-ty1__t {
  display: block;
}

.btn-ty1__icon {
  display: block;
}
.btn-ty1__icon svg path {
  transition: 0.4s;
}

/* btn-ty2 */
.btn-ty2 {
  display: inline-block;
  height: 46rem;
  color: #111;
  border-radius: 10rem;
  backdrop-filter: blur(5rem);
  transition: 0.4s;
  border: 1px solid rgba(17, 17, 17, 0.3);
  background: rgba(255, 255, 255, 0.2);
}
.btn-ty2:hover {
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: var(--_GREEN, #074827);
}
.btn-ty2:hover .btn-ty2__icon svg path {
  stroke: #fff;
}
.btn-ty2.btn-ty2--view .btn-ty2__btn {
  min-width: 250rem;
  justify-content: space-between;
}

.btn-ty2__btn {
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 100%;
  gap: 24rem;
  padding: 0 20rem;
  font-family: Pretendard;
  font-size: 16rem;
  font-style: normal;
  font-weight: 500;
  line-height: 140%; /* 22.4px */
  letter-spacing: -0.32rem;
}

.btn-ty2__t {
  display: block;
}

.btn-ty2__icon {
  display: block;
}
.btn-ty2__icon svg path {
  stroke: #111;
  transition: 0.4s;
}

.btn-ty3 {
  width: 60rem;
  height: 60rem;
  border-radius: 50%;
  border: 1rem solid #0c5c32;
  transition: 0.4s;
}
.btn-ty3:hover {
  background-color: #0c5c32;
}
.btn-ty3:hover .btn-ty3__icon svg path {
  stroke: #fff;
}
.btn-ty3.btn-ty3--view {
  width: 30rem;
  height: 30rem;
}
.btn-ty3.btn-ty3--view .btn-ty3__icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 6rem;
  height: 11rem;
}

.btn-ty3__btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

.btn-ty3__icon {
  width: 12rem;
  height: 22rem;
}
.btn-ty3__icon svg path {
  stroke: #0c5c32;
  transition: 0.4s;
}

/* btn-ty4 */
.btn-ty4 {
  display: inline-block;
  height: 46rem;
  color: #111;
  border-radius: 10rem;
  backdrop-filter: blur(5rem);
  transition: 0.4s;
  border: 1px solid rgba(17, 17, 17, 0.3);
  background: rgba(255, 255, 255, 0.2);
}
.btn-ty4:hover {
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: var(--_GREEN, #074827);
}
.btn-ty4:hover .btn-ty4__icon svg path {
  stroke: #fff;
}
.btn-ty4.js-dropdown-active .icon__vertical-line {
  opacity: 0;
}

.btn-ty4__btn {
  display: inline-flex;
  align-items: center;
  width: 100%;
  height: 100%;
  gap: 24rem;
  padding: 0 20rem;
  font-family: Pretendard;
  font-size: 16rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.32rem;
}

.btn-ty4__t {
  display: block;
}

.btn-ty4__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 12rem;
  height: 12rem;
}
.btn-ty4__icon svg {
  width: 100%;
  height: 100%;
}
.btn-ty4__icon svg path {
  stroke: #111;
  transition: 0.4s;
}

/* LAYOUT */
/* #region ly */
.ly-1 {
  padding: 220rem 0 0;
}

@media screen and (max-width: 1280px) {
  .ly-1 {
    padding: 120rem 0 0;
  }
}
.ly-2 {
  padding: 0 0 160rem;
}

@media screen and (max-width: 1280px) {
  .ly-2 {
    padding: 0 0 80rem;
  }
}
.ly-3 {
  padding: 125rem 0 0;
}

@media screen and (max-width: 1280px) {
  .ly-3 {
    padding: 86rem 0 0;
  }
}
.ly-4 {
  padding: 0;
}

@media screen and (max-width: 1280px) {
  .ly-4 {
    padding: 0;
  }
}
/* #endregion ly */
/* #region sec */
.sec-ly2 {
  padding: 120rem 0 130rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly2 {
    padding: 60rem 0;
  }
}
.sec-ly3 {
  padding: 120rem 0 140rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly3 {
    padding: 60rem 0 70rem;
  }
}
.sec-ly4 {
  padding: 70rem 0 120rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly4 {
    padding: 70rem 0 60rem;
  }
}
.sec-ly5 {
  padding: 120rem 0 160rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly5 {
    padding: 60rem 0 80rem;
  }
}
.sec-ly6 {
  padding: 120rem 0 160rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly6 {
    padding: 60rem 0 80rem;
  }
}
.sec-ly7 {
  padding: 160rem 0;
}

@media screen and (max-width: 1280px) {
  .sec-ly7 {
    padding: 80rem 0;
  }
}
.sec-ly8 {
  padding: 30rem 0;
}

@media screen and (max-width: 1280px) {
  .sec-ly8 {
    padding: 40rem 0 38rem;
  }
}
.sec-ly9 {
  padding: 160rem 0;
}

@media screen and (max-width: 1280px) {
  .sec-ly9 {
    padding: 80rem 0 40rem;
  }
}
.sec-ly10 {
  padding: 220rem 0 70rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly10 {
    padding: 120rem 0 36rem;
  }
}
.sec-ly11 {
  padding: 40rem 0 160rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly11 {
    padding: 20rem 0 80rem;
  }
}
.sec-ly12 {
  padding-top: 160rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly12 {
    padding: 90rem 0 80rem;
  }
}
.sec-ly13 {
  padding: 120rem 0 160rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly13 {
    padding: 60rem 0 80rem;
  }
}
.sec-ly14 {
  padding: 160rem 0;
}

@media screen and (max-width: 1280px) {
  .sec-ly14 {
    padding: 261rem 0 80rem;
  }
}
.sec-ly15 {
  padding: 0 0 160rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly15 {
    padding: 0 0 80rem;
  }
}
.sec-ly16 {
  padding: 100rem 0;
}

@media screen and (max-width: 1280px) {
  .sec-ly16 {
    padding: 64rem 0;
  }
}
.sec-ly17 {
  padding: 0 0 160rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly17 {
    padding: 0 0 80rem;
  }
}
.sec-ly18 {
  padding: 0;
}

@media screen and (max-width: 1280px) {
  .sec-ly18 {
    padding: 0;
  }
}
.sec-ly19 {
  padding: 160rem 0;
}

@media screen and (max-width: 1280px) {
  .sec-ly19 {
    padding: 80rem 0 0;
  }
}
.sec-ly20 {
  padding: 180rem 0 70rem;
}

@media screen and (max-width: 1280px) {
  .sec-ly20 {
    padding: 120rem 0 72rem;
  }
}
.inner-ly1 {
  max-width: calc(100% - 270rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly1 {
    max-width: 767rem;
    padding: 0 20rem;
  }
}
.inner-ly2 {
  max-width: calc(100% - 270rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly2 {
    max-width: 767rem;
    padding: 0 20rem;
  }
}
.inner-ly3 {
  max-width: calc(100% - 270rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly3 {
    max-width: none;
    padding: 0 7.03%;
  }
}
@media screen and (max-width: 767px) {
  .inner-ly3 {
    padding: 0 20rem;
  }
}
.inner-ly4 {
  max-width: calc(100% - 270rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly4 {
    max-width: none;
    padding: 0 7.03%;
  }
}
@media screen and (max-width: 767px) {
  .inner-ly4 {
    padding: 0 20rem;
  }
}
.inner-ly5 {
  max-width: calc(100% - 270rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly5 {
    max-width: none;
    padding: 0 7.03%;
  }
}
@media screen and (max-width: 767px) {
  .inner-ly5 {
    padding: 0 20rem;
  }
}
.inner-ly6 {
  max-width: calc(100% - 270rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly6 {
    max-width: 767rem;
    padding: 0 20rem;
  }
}
.inner-ly7 {
  max-width: calc(100% - 60rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly7 {
    max-width: 767rem;
    padding: 0 16rem;
  }
}
.inner-ly8 {
  display: flex;
  flex-direction: column;
  max-width: calc(100% - 270rem);
  margin: 0 auto;
}
.inner-ly8 .inner__c {
  width: 100%;
  max-width: 1370rem;
  align-self: end;
}

@media screen and (max-width: 1280px) {
  .inner-ly8 {
    max-width: 767rem;
    padding: 0 20rem;
  }
}
.inner-ly9 {
  max-width: calc(100% - 550rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly9 {
    max-width: 767rem;
    padding: 0 20rem;
  }
}
.inner-ly10 {
  max-width: calc(100% - 550rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly10 {
    max-width: 767rem;
    padding: 0 20rem;
  }
}
.inner-ly11 {
  max-width: calc(100% - 270rem);
  margin: 0 auto;
}

@media screen and (max-width: 1280px) {
  .inner-ly11 {
    max-width: none;
    padding: 0;
  }
}
.inner-ly12 {
  position: relative;
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 1280px) {
  .hp-mo-ly1 {
    max-width: 767rem !important;
    margin: 0 auto !important;
  }
  /* btn-ty1 */
  .btn-ty1 {
    height: 40rem;
  }
  .btn-ty1__btn {
    padding: 0 14rem;
    gap: 16rem;
    font-size: 14rem;
    font-weight: 500;
    line-height: 140%;
    letter-spacing: -0.28rem;
  }
  /* btn-ty2 */
  .btn-ty2 {
    height: 40rem;
    border-radius: 8rem;
  }
  .btn-ty2__btn {
    padding: 0 14rem;
    gap: 16rem;
    font-size: 14rem;
    font-weight: 500;
    line-height: 140%;
    letter-spacing: -0.28rem;
  }
  /* btn-ty3 */
  .btn-ty3 {
    width: 48rem;
    height: 48rem;
  }
  .btn-ty3__icon {
    width: 9.6rem;
    height: 17.6rem;
  }
  /* btn-ty4 */
  .btn-ty4 {
    height: 40rem;
    border-radius: 8rem;
  }
  .btn-ty4__btn {
    padding: 0 14rem;
    gap: 16rem;
    font-size: 14rem;
    letter-spacing: -0.28rem;
  }
  .btn-ty4__icon {
    width: 10rem;
    height: 10rem;
  }
}
@media screen and (max-width: 767px) {
  .pc-tablet {
    display: none !important;
  }
}
@media screen and (min-width: 641px) {
  .mo-640 {
    display: none !important;
  }
}
@media screen and (max-width: 640px) {
  .pc-640 {
    display: none !important;
  }
}
/* #region Accordion */
.accordion {
  border-top: 1rem solid #3a3a3a;
}
.accordion.accordion--ty2 {
  border-top: 1rem solid #ccc;
}

.accordion-item.accordion-item--active .accordion-header {
  background: #f8f9fa;
}
.accordion-item.accordion-item--active .accordion-icon {
  transform: rotate(180deg);
}
.accordion-header {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 20rem 24rem;
  background: #fff;
  border: none;
  transition: all 0.3s ease;
  gap: 6rem;
  padding: 32rem 31rem 32rem 0;
  border-bottom: 1rem solid #ccc;
}

.accordion-num {
  color: var(--_GREEN, #074827);
  text-align: center;
  font-family: Pretendard;
  font-size: 20rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 26px */
  letter-spacing: -0.4rem;
}

.accordion-title {
  color: #111;
  font-family: Pretendard;
  font-size: 20rem;
  font-style: normal;
  font-weight: 500;
  line-height: 130%; /* 26px */
  letter-spacing: -0.4rem;
  text-align: left;
  flex: 1;
}

.accordion-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20rem;
  height: 20rem;
  background: center/contain url('/user/en/images/common/dropdown_arrow_2.svg') no-repeat;
  transform: rotate(0deg);
  transition: transform 0.3s ease;
}

.accordion-content {
  border-bottom: 1rem solid #ccc;
}

.accordion-content-inner {
  padding: 32rem 0 64rem;
  color: #3a3a3a;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 25.2px */
  letter-spacing: -0.36rem;
}

.terms_dot li {
  position: relative;
  padding-left: 20rem;
}
.terms_dot li:after {
  content: '';
  position: absolute;
  left: 8rem;
  top: 9rem;
  width: 3rem;
  height: 3rem;
  background-color: #3a3a3a;
  border-radius: 100%;
}

@media screen and (max-width: 1280px) {
  .accordion-header {
    flex-direction: column;
    align-items: start;
    gap: 4rem;
    padding: 24rem 34rem 24rem 0;
  }
  .accordion-num {
    font-size: 18rem;
    letter-spacing: -0.36rem;
  }
  .accordion-title {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
  .accordion-icon {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    right: 0;
    width: 14rem;
    height: 14rem;
  }
  .accordion-content-inner {
    padding: 24rem 0;
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
  .accordion-content-text {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}
/* #endregion Accordion */
/* #region btn-download */
.btn-download {
  display: inline-block;
}
.btn-download:hover .btn-download__icon {
  background: center/contain url('/user/en/images/common/icon_download_hover.svg') no-repeat;
}

.btn-download__btn {
  display: inline-flex;
  align-items: center;
  gap: 8rem;
}

.btn-download__icon {
  display: inline-block;
  width: 34rem;
  height: 34rem;
  background: center/contain url('/user/en/images/common/icon_download.svg') no-repeat;
  transition: 0.4s;
}

.btn-download__t {
  display: inline-block;
  color: #111;
  text-align: center;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1; /* 21.6px */
}

/* #endregion btn-download */
/* #region table-ty1 */
.table-ty1-wrap {
  max-width: 890rem;
}

.table-ty1 {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  border-top: 1rem solid #3a3a3a;
  border-bottom: 1rem solid #3a3a3a;
}
.table-ty1.table-ty1--mw890 {
  max-width: 890rem;
}
.table-ty1 thead th {
  border-top: none;
}
.table-ty1 thead th:first-child {
  border-left: none;
}
.table-ty1 thead th:last-child {
  border-right: none;
}
.table-ty1 tbody th:first-child,
.table-ty1 tbody td:first-child {
  border-left: none;
}
.table-ty1 tbody th:last-child,
.table-ty1 tbody td:last-child {
  border-right: none;
}
.table-ty1 tbody tr:last-child th,
.table-ty1 tbody tr:last-child td {
  border-bottom: none;
}
.table-ty1 th,
.table-ty1 td {
  padding: 18rem 0;
  border: 1rem solid #ccc;
}
.table-ty1 th {
  color: #111;
  text-align: center;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  background: #f5f8f5;
}
.table-ty1 td {
  color: #111;
  text-align: center;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 120%;
}

@media screen and (max-width: 1280px) {
  .btn-download__btn {
    gap: 6rem;
  }
  .btn-download__icon {
    width: 30rem;
    height: 30rem;
  }
  .btn-download__t {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
  /* #endregion btn-download */
  /* #region table-ty1 */
  .table-ty1-wrap {
    max-width: none;
  }
  .table-ty1 th,
  .table-ty1 td {
    padding: 12rem 0;
  }
  .table-ty1 th {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
  .table-ty1 td {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}
/* #endregion table-ty1 */
@media screen and (max-width: 1280px) {
  .mo_padding {
    padding: 0 20rem;
  }
}

#fund_detail_container {
  width: 100%;
  height: 100%;
  /* hero section start */
  /* hero section end */
  /* content section start */
  /* 기간 범위 선택 탭 */
  /* 기간 범위 드롭다운 */
}
#fund_detail_container .hero_section {
  display: flex;
  position: relative;
  flex-direction: column;
  align-items: center;
  gap: 80rem;
  padding: 180rem 135rem 120rem;
}
#fund_detail_container .hero_section .background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: var(--z-background);
}
#fund_detail_container .hero_section .background > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .hero_section {
    padding: 81.5rem 20rem 72rem;
  }
}
#fund_detail_container .fund_top_box {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 40rem;
}
#fund_detail_container .fund_header_box {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: flex-end;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_header_box {
    flex-direction: column;
    align-items: flex-start;
    gap: 30rem;
  }
}
#fund_detail_container .fund_title_box {
  display: flex;
  flex-direction: column;
  width: calc(100% - 500rem);
}
#fund_detail_container .fund_title_box .fund_badge_box {
  display: flex;
  gap: 4rem;
}
#fund_detail_container .fund_title_box .fund_badge_box > div {
  color: var(--text-black);
  font-size: 18rem;
  font-weight: 500;
  padding: 6rem 8rem;
  border-radius: 2rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_title_box .fund_badge_box > div {
    font-size: 16rem;
    padding: 5rem 6rem;
  }
}
#fund_detail_container .fund_title_box .fund_badge_box .default {
  background: var(--white);
}
#fund_detail_container .fund_title_box .fund_badge_box .point {
  background-color: var(--badge-point);
}
#fund_detail_container .fund_title_box .fund_badge_box .danger {
  color: var(--white);
  background-color: var(--badge-danger);
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
}
#fund_detail_container .fund_title_box .fund_badge_box .grade_1 {
  color: var(--white);
  background-color: var(--risk-grade-1);
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
}
#fund_detail_container .fund_title_box .fund_badge_box .grade_2 {
  color: var(--white);
  background-color: var(--risk-grade-2);
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
}
#fund_detail_container .fund_title_box .fund_badge_box .grade_3 {
  color: var(--white);
  background-color: var(--risk-grade-3);
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
}
#fund_detail_container .fund_title_box .fund_badge_box .grade_4 {
  color: var(--white);
  background-color: var(--risk-grade-4);
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
}
#fund_detail_container .fund_title_box .fund_badge_box .grade_5 {
  color: var(--white);
  background-color: var(--risk-grade-5);
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
}
#fund_detail_container .fund_title_box .fund_badge_box .grade_6 {
  color: var(--white);
  background-color: var(--risk-grade-6);
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
}
#fund_detail_container .fund_title_box h1 {
  margin-top: 16rem;
  color: var(--white);
  font-size: 60rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -1.2rem;
  word-break: break-all;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_title_box {
	width: 100%;
  }
  #fund_detail_container .fund_title_box h1 {
    font-size: 34rem;
    letter-spacing: -0.68rem;
  }
}
#fund_detail_container .fund_detail_dropdown {
  width: 442rem;
}
#fund_detail_container .fund_detail_dropdown .dropdown_btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-bottom: 14rem;
  border-bottom: 1.5rem solid var(--list-border-2);
  background: transparent;
  color: var(--white);
  font-size: 42rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.84rem;
}
#fund_detail_container .fund_detail_dropdown .dropdown_text {
  flex: 1;
  text-align: left;
  word-break: break-all;
}
#fund_detail_container .fund_detail_dropdown .dropdown_icon {
  width: 30rem;
  height: 30rem;
}
#fund_detail_container .fund_detail_dropdown .dropdown_list {
  position: absolute;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_detail_dropdown {
    width: 100%;
  }
  #fund_detail_container .fund_detail_dropdown .dropdown_btn {
    font-size: 26rem;
    padding-bottom: 10rem;
  }
  #fund_detail_container .fund_detail_dropdown .dropdown_icon {
    width: 24rem;
    height: 24rem;
  }
}
#fund_detail_container .fund_content_box {
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 60rem;
}
#fund_detail_container .fund_content_box p {
  flex: 1;
  color: var(--text-gray-sub-2);
  font-size: 18rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_content_box {
    flex-direction: column;
    gap: 34rem;
  }
  #fund_detail_container .fund_content_box p {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}
#fund_detail_container .download_files_box {
  display: flex;
  flex-direction: column;
  gap: 16rem;
  width: 442rem;
}
#fund_detail_container .download_files_box > li {
  display: flex;
  width: 100%;
}
#fund_detail_container .download_files_box > li > div:nth-child(1) {
  min-width: 190rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .download_files_box {
    width: 100%;
    gap: 12rem;
  }
  #fund_detail_container .download_files_box > li > div:nth-child(1) {
    min-width: 165rem;
  }
}
#fund_detail_container .download_files_box .download_btn_box {
  display: flex;
  gap: 10rem;
  align-items: center;
  color: var(--text-gray-sub-2);
  font-size: 18rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.36rem;
}
#fund_detail_container .download_files_box .download_btn_box .download_icon_box {
  position: relative;
  width: 34rem;
  height: 34rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .download_files_box .download_btn_box .download_icon_box {
    align-self: start;
  }
}
#fund_detail_container .download_files_box .download_btn_box .download_icon_box:hover .download_icon {
  opacity: 0;
}
#fund_detail_container
  .download_files_box
  .download_btn_box
  .download_icon_box:hover
  .download_icon.download_icon_hover {
  opacity: 1;
}
#fund_detail_container .download_files_box .download_btn_box .download_icon {
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 4rem;
  cursor: pointer;
  opacity: 1;
  transition: opacity 0.2s ease;
}
#fund_detail_container .download_files_box .download_btn_box .download_icon.download_icon_hover {
  opacity: 0;
}
#fund_detail_container .download_files_box .download_btn_box span {
  color: inherit;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .download_files_box .download_btn_box span {
    align-self: start;
    padding-top: 7rem;
  }
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .download_files_box .download_btn_box {
    gap: 8rem;
  }
}
#fund_detail_container .download_files_box .download_btn_box.dropdown_btn {
  padding-bottom: 0;
  border-bottom: none;
  cursor: pointer;
}
#fund_detail_container .download_files_box .download_btn_box.dropdown_btn .dropdown_content_wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 1;
  gap: 8rem;
  padding-bottom: 6rem;
  border-bottom: 1rem solid var(--list-border-2);
}
#fund_detail_container .download_files_box .download_btn_box.dropdown_btn .dropdown_content_wrapper .dropdown_text {
  flex: 1;
  text-align: left;
  color: inherit;
}
#fund_detail_container .download_files_box .download_btn_box.dropdown_btn .dropdown_content_wrapper .dropdown_icon {
  width: 10rem;
  height: 10rem;
  filter: brightness(0) invert(100%);
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .download_files_box .download_btn_box {
    font-size: 16rem;
  }
}
#fund_detail_container .download_files_box .dropdown_container[data-dropdown-name='asset_report'] .dropdown_list {
  position: absolute;
  left: 44rem;
  right: auto;
  width: auto;
  min-width: 202rem;
}
#fund_detail_container
  .download_files_box
  .dropdown_container[data-dropdown-name='asset_report']
  .dropdown_list
  .dropdown_option {
  font-size: 16rem;
  padding: 10rem 14rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .download_files_box .dropdown_container[data-dropdown-name='asset_report'] .dropdown_list {
    left: 42rem;
    right: 0;
    min-width: auto;
  }
}
#fund_detail_container .fund_info_field {
  display: flex;
  width: 100%;
  padding: 48rem 60rem 58rem;
  border-radius: 16rem;
  background-color: var(--white);
  box-shadow: 0 4rem 10rem 0 rgba(0, 0, 0, 0.15);
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_info_field {
    flex-direction: column;
    padding: 32rem 24rem;
  }
}
#fund_detail_container .fund_info_field .fund_info_left {
  display: flex;
  gap: 48rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_info_field .fund_info_left {
    flex-direction: column;
    gap: 30rem;
    padding-bottom: 24rem;
    border-bottom: 1rem solid var(--text-gray);
  }
}
#fund_detail_container .fund_info_field .fund_info_left .percent_box {
  display: flex;
  gap: 48rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_info_field .fund_info_left .percent_box {
    justify-content: space-between;
    gap: 30rem;
  }
}
#fund_detail_container .fund_info_field .fund_info_left .info_item {
  display: flex;
  flex-direction: column;
  gap: 8rem;
}
#fund_detail_container .fund_info_field .fund_info_left .info_item .info_label {
  color: var(--placeholder);
  font-size: 18rem;
  font-weight: 500;
  line-height: 120%;
}
#fund_detail_container .fund_info_field .fund_info_left .info_item .info_date {
  color: var(--text-black);
  font-size: 18rem;
  font-weight: 400;
  line-height: 120%;
}
#fund_detail_container .fund_info_field .fund_info_left .info_item .info_value {
  color: var(--text-black);
  font-size: 42rem;
  font-weight: 400;
  line-height: 120%;
}
#fund_detail_container .fund_info_field .fund_info_left .info_item .info_value.profit {
  font-weight: 500;
  color: var(--red);
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_info_field .fund_info_left .info_item {
    gap: 4rem;
  }
  #fund_detail_container .fund_info_field .fund_info_left .info_item .info_label {
    font-size: 16rem;
  }
  #fund_detail_container .fund_info_field .fund_info_left .info_item .info_value {
    font-size: 26rem;
  }
}
#fund_detail_container .fund_info_field .fund_info_right {
  display: flex;
  gap: 24rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_info_field .fund_info_right {
    padding-top: 24rem;
    gap: 18rem;
    width: 100%;
  }
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box {
  display: flex;
  flex-direction: row;
  gap: 48rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .fund_info_field .fund_info_right .risk_level_box {
    gap: 0;
    width: 100%;
    justify-content: space-between;
  }
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_header span {
  color: var(--placeholder);
  font-size: 18rem;
  font-weight: 500;
  line-height: 120%;
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_filter_box {
  width: 524rem;
  position: relative;
  padding-top: 0;
  --risk-position: 0;
  --risk-border-color: var(--risk-grade-3);
}
@media screen and (max-width: 1280px) {
  .risk_filter_box.mo {
    display: flex;
    flex-direction: column;
    gap: 14rem;
  }
  #fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_filter_box {
    width: fit-content;
    align-items: flex-start;
  }
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_grade_labels {
  display: flex;
  width: 100%;
  justify-content: space-between;
  padding: 0 8rem;
  margin-bottom: 11rem;
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .grade_label {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
  font-size: 18rem;
  font-weight: 400;
  line-height: 120%;
  text-align: center;
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .grade_label.grade_1 {
  color: var(--risk-grade-1);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .grade_label.grade_2 {
  color: var(--risk-grade-2);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .grade_label.grade_3 {
  color: var(--risk-grade-3);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .grade_label.grade_4 {
  color: var(--risk-grade-4);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .grade_label.grade_5 {
  color: var(--risk-grade-5);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .grade_label.grade_6 {
  color: var(--risk-grade-6);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_gauge_box {
  width: 100%;
  display: flex;
  align-items: center;
  position: relative;
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_gauge_bar {
  position: relative;
  width: 100%;
  height: 8rem;
  margin: 0 8rem;
  background: linear-gradient(
    90deg,
    var(--risk-grade-1) 0%,
    var(--risk-grade-2) 20%,
    var(--risk-grade-3) 40%,
    var(--risk-grade-4) 60%,
    var(--risk-grade-5) 80%,
    var(--risk-grade-6) 100%
  );
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_thumb {
  position: absolute;
  top: 50%;
  left: var(--risk-position);
  transform: translateX(-50%);
  width: 12rem;
  height: 12rem;
  margin-top: -6rem;
  border-radius: 50%;
  background: var(--white);
  box-sizing: border-box;
  border: 3rem solid var(--risk-border-color);
  transition: all 0.3s ease;
  box-shadow: 0 2rem 4rem rgba(0, 0, 0, 0.1);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_label_box {
  margin-top: 11rem;
  position: absolute;
  top: 48rem;
  width: 100%;
  height: 50rem;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_label_box .risk_unit {
  display: none;
  position: absolute;
  left: var(--risk-position);
  transform: translateX(calc(-50% + 4rem));
  width: fit-content;
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_unit {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
  text-align: center;
  padding: 8.5rem 10rem;
  border-radius: 4rem;
  white-space: nowrap;
  font-size: 18rem;
  font-weight: 600;
  line-height: 130%;
  text-shadow: 0 0 2rem rgba(0, 0, 0, 0.4);
  background: var(--white);
  color: var(--text-black);
  border: 1rem solid var(--text-gray);
  cursor: pointer;
  transition: all 0.3s ease;
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_unit.selected {
  display: block;
  font-weight: 600;
  color: var(--white);
  outline: none;
  border-color: transparent;
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_unit.selected.grade_1 {
  background-color: var(--risk-grade-1);
  transform: translateX(0);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_unit.selected.grade_2 {
  background-color: var(--risk-grade-2);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_unit.selected.grade_3 {
  background-color: var(--risk-grade-3);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_unit.selected.grade_4 {
  background-color: var(--risk-grade-4);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_unit.selected.grade_5 {
  background-color: var(--risk-grade-5);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_level_box .risk_unit.selected.grade_6 {
  background-color: var(--risk-grade-6);
  transform: translateX(-100%);
}
#fund_detail_container .fund_info_field .fund_info_right .risk_info_btn {
  padding: 8rem 16rem;
  border: 1rem solid var(--list-border);
  border-radius: 4rem;
  background-color: var(--white);
  color: var(--text-black);
  font-size: 14rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}
#fund_detail_container .fund_info_field .fund_info_right .risk_info_btn:hover {
  border-color: #999;
  background-color: #f5f5f5;
}
#fund_detail_container .content_section {
  display: flex;
  width: 100%;
  margin-top: -20rem;
  border-radius: 20rem 20rem 0 0;
  background-color: var(--bg-search);
  justify-content: space-between;
  position: relative;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_section {
    background-color: var(--white);
    flex-direction: column;
    gap: 80rem;
    border-radius: 12rem 12rem 0 0;
    overflow: hidden;
  }
}
#fund_detail_container .content_left {
  display: flex;
  justify-content: flex-end;
  width: 385rem;
  padding: 140rem 0;
  position: relative;
  align-self: stretch;
  border-right: 1rem solid #ccc;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_left {
    padding: 70rem 0 0;
    justify-content: center;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
  }
}
#fund_detail_container .content_left .table_of_contents {
  position: sticky;
  top: 140rem;
  width: 250rem;
  z-index: 10;
  padding: 20rem 0;
  height: fit-content;
  max-height: calc(100vh - 200rem);
  overflow: hidden;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_left .table_of_contents {
    top: 0;
    left: 0;
    width: 100%;
    overflow-x: auto;
    background-color: var(--white);
  }
}
#fund_detail_container .content_left .toc_list {
  display: flex;
  flex-direction: column;
  gap: 24rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_left .toc_list {
    flex-direction: row;
    align-items: center;
    gap: 12rem;
  }
}
#fund_detail_container .content_left .toc_item {
  position: relative;
  align-items: center;
}
#fund_detail_container .content_left .toc_link {
  display: flex;
  align-items: center;
  color: var(--text-black-sub);
  font-size: 22rem;
  font-weight: 400;
  line-height: 130%;
  letter-spacing: -0.4rem;
  padding: 10rem 0 10rem 70rem;
  cursor: pointer;
  background-color: transparent;
  border-radius: 0;
  white-space: nowrap;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_left .toc_link {
    padding: 8rem 12rem;
    font-size: 18rem;
    text-align: center;
  }
}
#fund_detail_container .content_left .toc_item.active .toc_link {
  color: var(--white);
  width: 250rem;
  background-color: var(--text-black-sub);
  font-weight: 500;
  border-radius: 10rem 0 0 10rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_left .toc_item.active .toc_link {
    width: fit-content;
    align-items: center;
    border-radius: 8rem;
  }
}
#fund_detail_container .content_right {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 160rem;
  background-color: var(--white);
  padding: 140rem 135rem 160rem 130rem;
  box-shadow: 0 0 40rem 0 rgba(0, 0, 0, 0.05);
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_right {
    gap: 80rem;
    padding: 189rem 0 80rem 0;
  }
}
#fund_detail_container .content_field .header_box {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .header_box {
    position: relative;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 4rem;
    z-index: 1;
  }
  #fund_detail_container .content_field .header_box.header_box_ty2 {
    gap: 24rem;
  }
}
#fund_detail_container .content_field#returns .header_box {
  align-items: flex-end;
}
#fund_detail_container .content_field#returns .anchor_link {
  margin-bottom: 16rem;
}
#fund_detail_container .content_field .performance_header_box {
  margin-top: 16rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .performance_header_box {
    width: 100%;
    align-items: flex-start;
    gap: 4rem;
    margin-top: 12rem;
  }
}
#fund_detail_container .content_field .performance_action_box {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 4rem;
}
#fund_detail_container .content_field .performance_action_box .caption {
  text-align: end;
}
#fund_detail_container .content_field h3 {
  width: 100%;
  gap: 35rem;
  color: var(--text-black);
  font-size: 42rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.84rem;
  position: relative;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field h3 {
    font-size: 26rem;
    letter-spacing: -0.52rem;
    flex-direction: column;
    gap: 16rem;
  }
}
#fund_detail_container .content_field h3 .anchor_link {
  color: inherit;
  text-decoration: none;
  position: relative;
}
#fund_detail_container .content_field h4 {
  display: flex;
  align-items: center;
  color: var(--text-black);
  font-size: 24rem;
  font-weight: 500;
  line-height: 130%;
  letter-spacing: -0.48rem;
}
#fund_detail_container .content_field h4::before {
  content: '';
  margin-right: 12rem;
  width: 2rem;
  height: 23rem;
  background-color: var(--placeholder);
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field h4 {
    font-size: 20rem;
  }
  #fund_detail_container .content_field h4::before {
    height: 18rem;
  }
}
#fund_detail_container .content_field .subtitle {
  margin-top: 28rem;
  display: flex;
  width: 100%;
  font-size: 16rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.36rem;
  color: var(--placeholder);
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .subtitle {
    margin-top: 12rem;
  }
}
#fund_detail_container .content_field .caption {
  color: var(--placeholder);
  font-size: 18rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.36rem;
  text-align: end;
}
.pie_chart_box .caption {
	margin-bottom: 32rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .caption {
    text-align: start;
    font-size: 16rem;
  }
}
.bottom_caption {
  color: var(--placeholder);
  font-size: 16rem;
  font-weight: 300;
  line-height: 130%;
  letter-spacing: -0.28rem;
  margin-top: 28rem;
}
@media screen and (max-width: 1280px) {
  .bottom_caption {
    margin-top: 12rem;
    font-size: 14rem;
  }
}
#fund_detail_container .content_field .content_box:nth-child(2) {
  margin-top: 44rem;
}
#fund_detail_container .content_field .content_box:not(:nth-child(2)) {
  margin-top: 80rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .content_box:nth-child(2) {
    margin-top: 24rem;
  }
  #fund_detail_container .content_field .content_box:not(:nth-child(2)) {
    margin-top: 40rem;
  }
}
#fund_detail_container .content_field .investment_point_list {
  display: flex;
  gap: 80rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .investment_point_list {
    flex-direction: column;
    gap: 24rem;
  }
}
#fund_detail_container .content_field .investment_point_list .point_item {
  display: flex;
  flex: 1;
}
#fund_detail_container .content_field .investment_point_list .point_item img {
  width: 64rem;
  height: 64rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .investment_point_list .point_item img {
    width: 38rem;
    height: 38rem;
  }
}
#fund_detail_container .content_field .investment_point_list .point_item .title_box {
  margin-top: 30rem;
  display: flex;
  flex-direction: column;
  gap: 8rem;
}
#fund_detail_container .content_field .investment_point_list .point_item .title_box h6 {
  color: var(--green-2);
  font-size: 24rem;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.48rem;
}
#fund_detail_container .content_field .investment_point_list .point_item .title_box p {
  color: var(--text-black-sub);
  font-size: 18rem;
  font-weight: 300;
  line-height: 140%;
  letter-spacing: -0.36rem;
  word-break: break-all;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .investment_point_list .point_item .title_box {
    margin-top: 24rem;
    gap: 4rem;
  }
  #fund_detail_container .content_field .investment_point_list .point_item .title_box h6 {
    font-size: 20rem;
    letter-spacing: -0.4rem;
  }
  #fund_detail_container .content_field .investment_point_list .point_item .title_box p {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}
#fund_detail_container .content_field .fund_info_box {
  margin-top: 28rem;
  display: flex;
  gap: 30rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .fund_info_box {
    flex-direction: column;
    gap: 24rem;
  }
}
#fund_detail_container .content_field .fund_info_box .fund_amount_box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.fund_amount_topbox {
  display: flex;
  flex-direction: column;
  gap: 44rem;
}
#fund_detail_container .fund_amount_box .caption {
  display: flex;
  align-items: center;
  height: 54rem;
  text-align: left;
}
#fund_detail_container .content_field .fund_info_box .fund_amount_box .amount_item {
  display: flex;
  justify-content: space-between;
  width: 417rem;
  border-top: 1rem solid var(--bg-black);
  padding-top: 16rem;
}
#fund_detail_container .content_field .fund_info_box .fund_amount_box .amount_item .title {
  color: var(--text-black);
  font-size: 18rem;
  font-weight: 400;
  line-height: 120%;
}
#fund_detail_container .content_field .fund_info_box .fund_amount_box .amount_item data {
  color: var(--text-black);
  font-size: 36rem;
  font-weight: 600;
  line-height: 140%;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .fund_info_box .fund_amount_box .amount_item {
    width: 100%;
    padding-top: 12rem;
  }
  #fund_detail_container .content_field .fund_info_box .fund_amount_box .amount_item .title {
    font-size: 16rem;
  }
  #fund_detail_container .content_field .fund_info_box .fund_amount_box .amount_item data {
    font-size: 24rem;
  }
}
#fund_detail_container .content_field .fund_info_box .fund_desc_list {
  display: flex;
  flex-direction: column;
  width: 100%;
}
#fund_detail_container .content_field .fund_info_box .fund_desc_list .desc_list_item {
  display: flex;
  align-items: center;
  border-top: 1rem solid var(--text-gray);
  height: 54rem;
}
#fund_detail_container .content_field .fund_info_box .fund_desc_list .desc_list_item .title {
  min-width: 183rem;
  color: var(--green-2);
  font-size: 18rem;
  font-weight: 500;
  line-height: 120%;
}
#fund_detail_container .content_field .fund_info_box .fund_desc_list .desc_list_item p {
  color: var(--text-black-sub);
  font-size: 18rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .fund_info_box .fund_desc_list .desc_list_item {
    height: auto;
    padding: 12rem 0;
  }
  #fund_detail_container .content_field .fund_info_box .fund_desc_list .desc_list_item .title {
    font-size: 16rem;
    min-width: 82rem;
  }
  #fund_detail_container .content_field .fund_info_box .fund_desc_list .desc_list_item p {
    font-size: 16rem;
    letter-spacing: -0.32rem;
  }
}
#fund_detail_container .content_field .data_download_box {
  margin-top: 10rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  gap: 10rem;
  color: var(--text-black);
  font-size: 18rem;
  font-weight: 500;
  line-height: 120%;
}
#fund_detail_container .content_field .data_download_box .download_icon {
  width: 34rem;
  height: 34rem;
  cursor: pointer;
  transition: transform 0.2s ease;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .data_download_box {
    margin-top: 0;
    gap: 4rem;
    font-size: 16rem;
  }
}
#fund_detail_container .content_field .precautions_list {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  color: var(--text-black-sub);
  font-size: 16rem;
  font-weight: 300;
  line-height: 160%;
  list-style-type: disc;
  padding-left: 25rem;
}
#fund_detail_container .content_field .precautions_list li::marker {
  font-size: 0.8em;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .precautions_list {
    padding-left: 45rem;
    padding-right: 20rem;
  }
}
#fund_detail_container .content_field .sales_link_list {
  margin-top: 22rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16rem 30rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .content_field .sales_link_list {
    height: 142rem;
    overflow: hidden;
    grid-template-columns: repeat(1, 1fr);
    gap: 16rem;
    transition: height 0.4s ease;
  }
  #fund_detail_container .content_field .sales_link_list.active {
    height: auto;
  }
}
#fund_detail_container .content_field .sales_link_list a {
  display: flex;
  gap: 16rem;
  align-items: center;
  height: fit-content;
  padding: 20rem;
  border-radius: 10rem;
  background-color: var(--highlight-hover);
}
#fund_detail_container .content_field .sales_link_list a span {
  display: flex;
  width: 100%;
  color: var(--text-black);
  font-size: 18rem;
  font-weight: 400;
  line-height: 120%;
  justify-content: center;
}
#fund_detail_container .content_field .sales_link_list a::before {
  content: '';
  background-image: url('/user/en/images/common/link.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 22rem;
  height: 22rem;
}
#fund_detail_container .content_field .content_box_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#fund_detail_container .content_field .more_btn_box {
  padding-right: 20rem;
}
#fund_detail_container .content_field .sales_link_btn {
  position: relative;
  padding-right: 14rem;
  color: #111;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 500;
  line-height: 120%; /* 21.6px */
  letter-spacing: -0.36px;
}
#fund_detail_container .content_field .sales_link_btn::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto 0;
  width: 12rem;
  height: 7rem;
  background: center/contain url('/user/en/images/common/icon_fund_more_arrow.svg') no-repeat;
  transition: 0.4s;
}
#fund_detail_container .content_field .sales_link_btn.active::before {
  transform: rotate(180deg);
}
#fund_detail_container table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin-top: 28rem;
  border-top: 1rem solid var(--text-black-sub);
  border-bottom: 1rem solid var(--text-black-sub);
  table-layout: fixed;
}
#fund_detail_container table th:first-child {
	width: 10%;
}
#fund_detail_container table th,
#fund_detail_container table td {
  border-bottom: 1rem solid var(--list-border);
  text-align: center;
  vertical-align: middle;
  color: var(--text-black);
  font-weight: 300;
  line-height: 120%;
}
#fund_detail_container table th:not(:last-child),
#fund_detail_container table td:not(:last-child) {
  border-right: 1rem solid var(--list-border);
}
#fund_detail_container table th {
  background-color: var(--highlight-hover);
  color: var(--text-black-sub);
  font-weight: 500;
  font-size: 16rem;
  line-height: 120%;
  padding: 18rem 8rem;
}
#fund_detail_container table td {
  padding: 18rem 0;
  font-size: 18rem;
}
#fund_detail_container table .table_header {
  background-color: var(--bg-search);
  padding-inline: 8rem;
}
#fund_detail_container table .highlight {
  background-color: var(--green-2);
  color: var(--white);
}
#fund_detail_container table .highlight_border {
  border: 2rem solid var(--green-2) !important;
  border-bottom: none !important;
}
#fund_detail_container .table_box {
  width: 100%;
  overflow-x: auto;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .table_box {
    display: flex;
    padding-inline: 20rem;
  }
}
#fund_detail_container table.fees_table {
  margin-top: 24rem;
}
#fund_detail_container table.fees_table th:nth-child(1),
#fund_detail_container table.fees_table th:nth-child(2) {
  width: 215rem;
}
#fund_detail_container table.fees_table th:nth-child(3) {
  width: 140rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container table.fees_table {
    width: 960rem;
  }
}
@media screen and (max-width: 1280px) {
  #fund_detail_container table.performance_table {
    margin-top: 32rem;
    min-width: 960rem;
  }
}
#fund_detail_container table.performance_table:not(.industry_weight_table) th:first-child,
#fund_detail_container table.performance_table:not(.industry_weight_table) td:first-child {
  width: 182rem;
}
#fund_detail_container .period_selector_box {
  display: flex;
  padding: 6rem;
  border-radius: 30rem;
  border: 1rem solid var(--text-gray);
  width: fit-content;
}
#fund_detail_container .period_selector_box .period_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8rem 10rem;
  min-width: 84rem;
  border-radius: 24rem;
  color: var(--text-black-sub);
  font-size: 18rem;
  font-weight: 500;
  line-height: 120%;
  cursor: pointer;
  transition: all 0.2s ease;
}
#fund_detail_container .period_selector_box .period_btn.active {
  background-color: var(--text-black-sub);
  color: var(--white);
}
#fund_detail_container .dropdown_container.period_range_selector {
  width: 100%;
  border-radius: 24rem;
  border: 1rem solid var(--text-gray);
  padding: 4rem;
  background-color: #fff;
  z-index: 100;
  overflow: hidden;
}
#fund_detail_container .dropdown_container.period_range_selector.active,
#fund_detail_container .dropdown_container.period_range_selector:has(.dropdown_list.active) {
  border-radius: 24rem;
}
#fund_detail_container .dropdown_container.period_range_selector .period_range_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8rem 16rem;
  min-width: 120rem;
  width: 100%;
  border-radius: 24rem;
  background: var(--text-black-sub);
  color: var(--white);
  font-size: 18rem;
  font-weight: 600;
  line-height: 120%;
  cursor: pointer;
  transition: all 0.2s ease;
}
#fund_detail_container .dropdown_container.period_range_selector .period_range_btn:hover {
  border-color: var(--text-black-sub);
}
#fund_detail_container .dropdown_container.period_range_selector .period_range_btn.active {
  background-color: var(--text-black-sub);
  color: var(--white);
}
#fund_detail_container .dropdown_container.period_range_selector .period_range_btn.active .dropdown_icon {
  filter: brightness(0) invert(100%);
}
#fund_detail_container .dropdown_container.period_range_selector .period_range_btn .dropdown_text {
  text-align: center;
}
#fund_detail_container .dropdown_container.period_range_selector .period_range_btn .dropdown_icon {
  width: 12rem;
  height: 12rem;
  margin-left: 4rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .dropdown_container.period_range_selector {
    margin-left: 0;
  }
  #fund_detail_container .dropdown_container.period_range_selector .period_range_btn {
    min-width: 100rem;
    font-size: 16rem;
    padding: 8rem 12rem 8rem 26rem;
  }
  #fund_detail_container .dropdown_container.period_range_selector .period_range_btn .dropdown_icon {
    width: 10rem;
    height: 10rem;
  }
  #fund_detail_container .dropdown_container.period_range_selector .dropdown_list {
    z-index: 10;
  }
  #fund_detail_container .dropdown_container.period_range_selector .dropdown_list .dropdown_option {
    display: flex;
    justify-content: center;
    font-size: 16rem;
    font-weight: 500;
    padding: 8rem 12rem;
    border-radius: 24rem;
  }
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .dropdown_container_wrapper {
    position: relative;
    width: 100%;
  }
}

/* 랭킹 리스트 공통 모듈 */
#fund_detail_container ol.ranked_list {
  margin-top: 28rem;
  list-style: none;
  counter-reset: rank-counter;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container ol.ranked_list {
    margin-top: 0;
  }
}
#fund_detail_container ol.ranked_list .rank_item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 18rem;
  border-bottom: 1rem solid var(--text-gray);
  counter-increment: rank-counter;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container ol.ranked_list .rank_item {
    padding-left: 10rem;
    padding-right: 10rem;
    padding-bottom: 14rem;
  }
}
#fund_detail_container ol.ranked_list .rank_item .rank_left {
  position: relative;
  padding-left: 28rem; /* 번호 공간 확보 */
  color: var(--text-black);
  font-size: 20rem;
  font-weight: 500;
  line-height: 130%;
  letter-spacing: -0.4rem;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container ol.ranked_list .rank_item .rank_left {
    font-size: 18rem;
  }
}
#fund_detail_container ol.ranked_list .rank_item .rank_right {
  color: var(--text-black-sub);
  font-size: 20rem;
  font-weight: 300;
  line-height: 120%;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container ol.ranked_list .rank_item .rank_right {
    font-size: 18rem;
  }
}
#fund_detail_container ol.ranked_list .rank_item .rank_left::before {
  content: counter(rank-counter) '.';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--text-black-sub);
}
#fund_detail_container ol.ranked_list .rank_item:first-child {
  border-bottom-width: 2rem;
  border-bottom-color: var(--green-2);
}
#fund_detail_container ol.ranked_list .rank_item:first-child .rank_left::before {
  color: var(--green-2);
  font-weight: 500;
}

/* TOP 10 전용 2열 그리드 레이아웃 */
#fund_detail_container ol.top_10_list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(5, minmax(0, auto));
  grid-auto-flow: column; /* 1~5 좌측, 6~10 우측 상단부터 채움 */
  /* 행 간격은 보더로 처리, 열 간격만 유지 */
  gap: 18rem 60rem;
}
#fund_detail_container ol.top_10_list .rank_item:nth-child(5),
#fund_detail_container ol.top_10_list .rank_item:nth-child(10) {
  padding-bottom: 0;
  border-bottom-color: transparent;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container ol.top_10_list {
    grid-template-columns: repeat(1, 1fr);
    grid-template-rows: repeat(10, minmax(0, auto));
    gap: 18rem 0;
    margin-top: 24rem;
  }
  #fund_detail_container ol.top_10_list .rank_item:nth-child(5),
  #fund_detail_container ol.top_10_list .rank_item:nth-child(10) {
    padding-bottom: 18rem;
    border-bottom: 1rem solid var(--text-gray);
  }
}

/* TOP 5 전용 1열 레이아웃 */
#fund_detail_container ol.top_5_list {
  display: flex;
  flex-direction: column;
  gap: 18rem;
  flex: 1;
  justify-content: flex-end;
  margin-top: 37rem;
}
@media screen and (min-width: 1280px) {
  #fund_detail_container ol.top_5_list .rank_item:last-child {
    border-bottom-color: transparent;
  }
}
@media screen and (max-width: 1280px) {
  #fund_detail_container ol.top_5_list {
    margin-top: 0;
    gap: 14rem;
  }
}

#fund_detail_container .vbar_chart_box {
  flex: 1;
}

#fund_detail_container .country_info_box {
  display: flex;
  gap: 82rem;
  margin-bottom: 28rem;
  width: 100%;
}
@media screen and (max-width: 1280px) {
  #fund_detail_container .country_info_box {
    flex-direction: column;
    gap: 20rem;
    margin-bottom: 0;
  }
}

.date_range_box {
  display: flex;
  align-items: center;
  gap: 12rem;
}
@media screen and (max-width: 1280px) {
  .date_range_box {
    gap: 9rem;
  }
}
.date_range_box .search_btn {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10rem 16rem;
  border-radius: 4rem;
  background: var(--text-black-sub);
  color: var(--white);
  font-size: 18rem;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: -0.36rem;
}
@media screen and (max-width: 1280px) {
  .date_range_box .search_btn {
    font-size: 16rem;
    letter-spacing: -0.32rem;
    padding: 8rem 12rem;
  }
}

.date_input_wrapper {
  position: relative;
  display: inline-block;
}

.date_input {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
  border-radius: 4rem;
  padding: 11rem 50rem 11rem 12rem;
  border: 1rem solid var(--text-gray);
  width: 190rem;
  color: var(--text-black);
  font-size: 16rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.32rem;
}
.date_input.active {
  border-color: var(--highlight);
}
@media screen and (max-width: 1280px) {
  .date_input {
    width: 100%;
    padding: 8.7rem 9.5rem;
    font-size: 14rem !important;
    letter-spacing: -0.28rem;
  }
}

.calendar_icon {
  position: absolute;
  right: 12rem;
  top: 50%;
  transform: translateY(-50%);
  width: 24rem;
  height: 24rem;
  pointer-events: none;
}
@media screen and (max-width: 1280px) {
  .calendar_icon {
    width: 20rem;
    height: 20rem;
    right: 9rem;
  }
}

.flatpickr-calendar {
  background: var(--bg-datepicker) !important;
  padding: 40rem 36rem !important;
  width: auto !important;
  font-family: 'Pretendard';
}

.flatpickr-weekdays {
  margin-bottom: 8rem !important;
}
.flatpickr-weekdays .flatpickr-weekday {
  color: var(--placeholder);
  font-size: 16rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.32rem;
}

.flatpickr-day {
  background-color: var(--white) !important;
  border-radius: 4rem !important;
  margin: 2rem !important;
  font-size: 16rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.32rem;
}
.flatpickr-day:hover {
  border-radius: 4rem;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
  background-color: var(--highlight) !important;
}
.flatpickr-prev-month,
.flatpickr-next-month {
  position: relative !important;
  height: auto;
  padding: 7.48px 0 0 0 !important;
}
.flatpickr-months {
  margin-bottom: 20rem;
}

.flatpickr-current-month {
  display: flex !important;
  flex-direction: row-reverse;
  justify-content: center;
  align-items: flex-end !important;
  gap: 24rem;
}

.flatpickr-monthDropdown-months {
  padding: 0 0 6rem !important;
  border-bottom: 1rem solid var(--highlight) !important;
  font-size: 18rem !important;
  font-weight: 500 !important;
  line-height: 120% !important;
  letter-spacing: -0.36rem !important;
}
.flatpickr-monthDropdown-months:hover {
  background: none !important;
}

.numInputWrapper input {
  padding: 0 0 6rem !important;
  border-bottom: 1rem solid var(--highlight) !important;
  font-size: 18rem !important;
  font-weight: 500 !important;
  line-height: 120% !important;
  letter-spacing: -0.36rem !important;
}
.numInputWrapper:hover {
  background: none !important;
}

:root {
  --green: #074827;
  --green-2: #0c5c32;
  --green-3: #038c48;
  --white: #fff;
  --black: #000;
  --red: #e41010;
  --blue: #3554d2;
  --_GREEN: #074827;
  --bg-black: #111;
  --bg-search: #f1f4f1;
  --bg-datepicker: #fcfcfc;
  --text-black: #111;
  --text-black-2: #333;
  --text-black-sub: #3a3a3a;
  --text-gray: #cccccc;
  --text-gray-sub: #aaa;
  --text-gray-sub-2: #ddd;
  --text-gray-sub-3: #b7b7b7;
  --footer-divier: #777;
  --placeholder: #666;
  --list-border: #ddd;
  --list-border-2: #d6e7dc;
  --badge-point: #b7e0cb;
  --badge-danger: #e96629;
  /* Risk Grade Colors */
  --risk-grade-1: #dc2952; /* 매우 높은 위험 */
  --risk-grade-2: #e96629; /* 높은 위험 */
  --risk-grade-3: #f9a825; /* 다소 높은 위험 */
  --risk-grade-4: #1da355; /* 보통 위험 */
  --risk-grade-5: #1d60ad; /* 낮은 위험 */
  --risk-grade-6: #2f26b8; /* 매우 낮은 위험 */
  --kor: 'Pretendard', sans-serif;
  --eng: '', sans-serif;
  --highlight: var(--green);
  --highlight-hover: #f5f8f5;
  /* Z-Index Layers */
  --z-background: -1;
  --z-default: 1;
  --z-content: 10;
  --z-overlay: 100;
  --z-dropdown: 200;
  --z-sticky: 300;
  --z-header: 400;
  --z-navigation: 500;
  --z-modal-backdrop: 600;
  --z-modal: 700;
  --z-tooltip: 800;
  --z-toast: 900;
  --z-overlay-max: 1000;
}

::selection {
  background-color: var(--highlight);
  color: var(--white);
}
