@charset "UTF-8";
.etf-style {
  /* comon start */
  /* btn */
  /* comon end */
  /* sub visual start */
  /* select */
  /* sub visual end */
  /* layout */
  /* link tab */
  /* section type */
  /* base-info */
  /* b-article */
  /* etc-info */
  /* row */
  /* row1 */
  /* row2 */
  /* date picker */
  /* period tab */
  /* v-period table */
  /* v-price table */
  /* investment-info table */
  /* risk bar */
  /* item-1st */
  /* pdf-count */
  /* 분배금 현황 popup */
}
.etf-style .hp-tcenter {
  text-align: center !important;
  padding: 0 !important;
}
.etf-style .dot-list li {
  text-indent: -8rem;
  padding-left: 15rem;
}
.etf-style .dot-list li::before {
  content: "";
  display: inline-block;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: #666;
  margin-top: -4rem;
  margin-right: 5rem;
  vertical-align: middle;
}
.etf-style .btn-area {
  display: flex;
  gap: 15rem;
}
.etf-style .btn {
  display: inline-block;
  height: 45rem;
  padding: 0 36rem;
}
.etf-style .btn button, .etf-style .btn a {
  display: inline-flex;
  height: 100%;
  align-items: center;
  color: #fff;
  text-align: center;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 600;
  line-height: 100%;
  /* 18px */
}
.etf-style .btn.btn--down {
  background-color: #717271;
}
.etf-style .btn.btn--qaccess {
  background: var(--Red, #EA5519);
}
.etf-style .btn-2 {
  display: inline-block;
  height: 72rem;
  background: var(--Red, #EA5519);
  padding: 0 36rem;
}
.etf-style .btn-2 button, .etf-style .btn-2 a {
  color: #111;
  font-family: Pretendard;
  font-size: 22rem;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  /* 26.4px */
}
.etf-style .btn-3 {
  display: inline-block;
  height: 30rem;
}
.etf-style .btn-3 .btn-3__btn {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  padding: 0 20rem 0 8rem;
  color: #FFF;
  font-family: Pretendard;
  font-size: 16rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.32rem;
  background-color: #EA5519;
}
.etf-style .btn-3 .btn-3__btn::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 8rem;
  width: 6rem;
  height: auto;
  margin: auto 0;
  background: center/contain url("/images/common/btn_3_arrow.png") no-repeat;
}
.etf-style .btn-down {
  display: inline-block;
  height: 72rem;
  border-radius: 10rem;
  box-shadow: 0 4rem 10rem 0 rgba(23, 40, 102, 0.15);
  overflow: hidden;
}
.etf-style .btn-down .btn-down__btn {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 310rem;
  height: 100%;
  padding: 0 36rem;
  background: #FFF;
  color: #111;
  font-family: Pretendard;
  font-size: 22rem;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  /* 26.4px */
}
.etf-style .btn-down .btn-down__btn::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 36rem;
  width: 24rem;
  height: auto;
  margin: auto 0;
  background: center/contain url("/images/common/btn_down_arrow.png") no-repeat;
}
.etf-style .btn-down-excel {
  display: inline-block;
  height: 24rem;
}
.etf-style .btn-down-excel .btn-down-excel__btn {
  position: relative;
  display: flex;
  align-items: center;
  color: #000;
  text-align: center;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 120%;
  /* 21.6px */
  padding-left: 28rem;
}
.etf-style .btn-down-excel .btn-down-excel__btn::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 24rem;
  height: auto;
  margin: auto 0;
  background: center/contain url("/images/common/btn_down_excel.png") no-repeat;
}
.etf-style .btn-submit {
  display: inline-block;
  height: 45rem;
}
.etf-style .btn-submit .button_submit {
  display: flex;
  align-items: center;
  padding: 0 29rem;
  height: 100%;
  color: #FFF;
  text-align: center;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 600;
  line-height: 100%;
  /* 18px */
  background: #717271;
}
.etf-style .sub-visual-1 {
  height: 635rem;
  background-color: #C74B19;
}
.etf-style .sub-visual-1__inner {
  position: relative;
  height: 100%;
  padding: 182rem 80rem 0;
}
.etf-style .icon {
  display: inline-block;
  width: 29rem;
  height: 25rem;
}
.etf-style .icon.icon--up {
  background: center/contain url("/images/contents/up_triangle.svg") no-repeat;
}
.etf-style .icon.icon--down {
  background: center/contain url("/images/contents/down_triangle.svg") no-repeat;
}
.etf-style .default-select {
  width: 200rem;
  height: 45rem;
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  /* 25.2px */
  letter-spacing: -0.36rem;
}
.etf-style .default-select .select-options {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0;
  padding-left: 14.84rem;
  list-style: none;
  border: 1px solid #ccc;
}
.etf-style .default-select .select-options::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 14rem;
  margin: auto 0;
  width: 12rem;
  height: 6rem;
  background: center/contain url("/images/contents/custom_select_arrow.png") no-repeat;
  transition: 0.4s;
}
.etf-style .default-select.open .selected > button::after {
  transform: rotateZ(180deg);
}
.etf-style .custom-select {
  position: relative;
  width: 200rem;
  height: 45rem;
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  /* 25.2px */
  letter-spacing: -0.36rem;
}
.etf-style .custom-select .selected {
  border: 1rem solid #C3C3C3;
  height: 100%;
}
.etf-style .custom-select .selected > button {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: left;
  padding: 0 14rem;
}
.etf-style .custom-select .selected > button::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 14rem;
  margin: auto 0;
  width: 12rem;
  height: 6rem;
  background: center/contain url("/images/contents/custom_select_arrow.png") no-repeat;
  transition: 0.4s;
}
.etf-style .custom-select .select-options {
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  border: 1px solid #ccc;
  background: #fff;
  position: absolute;
  z-index: 10;
}
.etf-style .custom-select .select-options li a, .etf-style .custom-select .select-options li button {
  width: 100%;
  height: 100%;
  padding: 8rem 14rem;
  text-align: left;
}
.etf-style .custom-select.open .selected > button::after {
  transform: rotateZ(180deg);
}
.etf-style .tit-area {
  color: #FFF;
  font-family: Pretendard;
  font-size: 60rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-top: 48rem;
}
.etf-style .tit-area.tit-area--ty1 {
  color: #000;
  text-align: center;
  font-size: 26rem;
  font-weight: 400;
  line-height: 120%;
  /* 31.2px */
  margin-bottom: 50rem;
}
.etf-style .tit-area.tit-area--ty2 {
  position: relative;
  color: #000;
  text-align: center;
  font-size: 26rem;
  font-weight: 400;
  line-height: 120%;
  /* 31.2px */
  margin-bottom: 50rem;
}
.etf-style .tit-area.tit-area--ty2 .btn-down-excel {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto 0;
}
.etf-style .subt-area {
  font-family: Pretendard;
  font-size: 25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
  /* 21.6px */
  color: #fff;
  margin-top: 24rem;
}
.etf-style .tag-cont {
  display: flex;
  gap: 14rem;
}
.etf-style .tag-cont__list {
  display: flex;
  gap: 14rem;
}
.etf-style .tag {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 38rem;
  padding: 0 36.5rem;
  font-family: Pretendard;
  font-size: 22rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
}
.etf-style .tag.tag--black {
  color: #FFF;
  background: #000;
}
.etf-style .tag.tag--blue {
  color: #FFF;
  background: #172866;
}
.etf-style .tag.tag--white {
  color: #172866;
  background: #FFF;
}
.etf-style .info {
  position: absolute;
  left: 80rem;
  bottom: -100rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1650rem;
  height: 199rem;
  background-color: #fff;
  border-radius: 10rem;
  box-shadow: 0 4rem 20rem 0 rgba(78, 31, 12, 0.15);
  padding: 50rem 77rem;
}
.etf-style .info > .box1 {
  display: flex;
}
.etf-style .info > .box2 {
  display: flex;
  gap: 11rem;
  min-width: 427rem;
}
.etf-style .info-price {
  padding: 0 35rem;
}
.etf-style .info-price .value2 {
  display: flex;
  align-items: center;
  gap: 4rem;
}
.etf-style .info-price .value2__val {
  display: inline-block;
  color: #000;
  font-family: Pretendard;
  font-size: 32rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.etf-style .info-price + .info-price {
  border-left: 1px solid #c3c3c3;
}
.etf-style .info-price__label {
  color: #000;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.etf-style .info-price__value {
  display: flex;
  gap: 18rem;
  margin-top: 6rem;
  color: #000;
  font-family: Pretendard;
  font-size: 54rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.etf-style .unit {
  color: #AAA;
  font-family: Pretendard;
  font-size: 24rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.etf-style .invest-report > .box1 {
  display: flex;
  gap: 11rem;
}
.etf-style .invest-report__tit {
  color: #000;
  font-family: Pretendard;
  font-size: 20rem;
  font-style: normal;
  font-weight: 200;
  line-height: normal;
  margin-bottom: 8rem;
}
.etf-style .invest-report__tit > .box1 {
  display: flex;
}
.etf-style .catch-img {
  position: absolute;
  top: -165%;
  right: -43rem;
  width: 409rem;
  height: 399rem;
}
.etf-style .ly-1 {
  max-width: 1440rem;
  padding: 202rem 0 0;
  margin: 0 auto;
}
.etf-style .link-tab {
  height: 56rem;
}
.etf-style .link-tab__list {
  display: flex;
  height: 100%;
}
.etf-style .link-tab__item {
  height: 100%;
  flex: 1;
}
.etf-style .link-tab__item a, .etf-style .link-tab__item button {
  width: 100%;
  height: 100%;
  color: #717271;
  text-align: center;
  font-family: Pretendard;
  font-size: 26rem;
  font-style: normal;
  font-weight: 400;
  line-height: 100%;
  /* 26px */
}
.etf-style .link-tab__item.link-tab__item--on {
  border-bottom: 1px solid #172866;
}
.etf-style .link-tab__item.link-tab__item--on a, .etf-style .link-tab__item.link-tab__item--on button {
  color: #000;
  font-weight: 600;
}
.etf-style .sec-ty1 {
  margin-top: 64rem;
}
.etf-style .sec-ty1__row-tit {
  color: #000;
  font-family: Pretendard;
  font-size: 26rem;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
  /* 31.2px */
}
.etf-style .sec-ty2 {
  margin-top: 60rem;
}
.etf-style .sec-ty2 .mid-area {
  position: relative;
}
.etf-style .sec-ty2 .mid-area__btn {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  display: flex;
  align-items: center;
  margin: auto 0;
}
.etf-style .sec-ty2 .tab-area {
  margin: 50rem 0 62rem;
}
.etf-style .sec-ty2 .values-area {
  margin-top: 100rem;
}
.etf-style .sec-ty2 .d-picker-area__box1 {
  display: flex;
  align-items: center;
  gap: 10rem;
}
.etf-style .sec-ty2 .d-picker-area__box2 {
  display: flex;
  gap: 10rem;
}
.etf-style .sec-ty2 + .sec-ty2 {
  margin-top: 100rem;
}
.etf-style .base-info__item {
  display: flex;
  width: 100%;
  padding: 24rem 8rem;
}
.etf-style .base-info__item + .base-info__item {
  border-top: 1px solid #ccc;
}
.etf-style .base-info__article {
  flex: 1;
}
.etf-style .b-article__tit {
  color: #111;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 120%;
  /* 21.6px */
}
.etf-style .b-article__des-wrap {
  display: flex;
  align-items: center;
  gap: 16rem;
}
.etf-style .b-article__des-wrap .b-article__des {
  margin-top: 0;
}
.etf-style .b-article__des {
  color: #111;
  font-family: Pretendard;
  font-size: 22rem;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  /* 26.4px */
  margin-top: 8rem;
}
.etf-style .b-article__etc {
  margin-top: 10rem;
}
.etf-style .etc-info {
  color: #666;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 130%;
  /* 23.4px */
}
.etf-style .row {
  display: flex;
}
.etf-style .row > .left {
  width: 480rem;
  flex-shrink: 0;
}
.etf-style .row > .right {
  flex: 1;
}
.etf-style .row + .row {
  margin-top: 60rem;
}
.etf-style .row1__btn-area {
  margin-top: 36rem;
}
.etf-style .row1__tit {
  color: #000;
  font-family: Pretendard;
  font-size: 22rem;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  /* 26.4px */
}
.etf-style .row1__p {
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 120%;
  /* 21.6px */
  margin-top: 14rem;
}
.etf-style .row2 > .right {
  border-top: 1px solid #111;
}
.etf-style .d-picker-area__inner {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10rem;
}
.etf-style .d-picker-area__dash span {
  display: block;
  width: 14rem;
  height: 1px;
  background-color: #717271;
}
.etf-style .d-picker {
  width: 200rem;
  height: 45rem;
}
.etf-style .d-picker__label {
  display: block;
  height: 100%;
}
.etf-style .d-picker__input {
  width: 100%;
  height: 100%;
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 400;
  line-height: 140%;
  /* 25.2px */
  letter-spacing: -0.36rem;
  border: 1.274rem solid #C3C3C3;
  padding: 0 16rem 0 14rem;
}
.etf-style .period-tab__list {
  display: flex;
  gap: 1px;
  height: 50rem;
}
.etf-style .period-tab__item {
  height: 100%;
  flex-grow: 1;
  flex-shrink: 0;
  text-align: center;
  font-family: Pretendard;
  font-size: 20rem;
  font-style: normal;
  font-weight: 400;
  line-height: 100%;
  /* 20px */
  color: #000;
  background-color: #E9E9E9;
  transition: 0.3s;
}
.etf-style .period-tab__item.period-tab__item--on {
  color: #FFF;
  background-color: #EA5519;
}
.etf-style .period-tab__btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}
.etf-style .v-period__table {
  width: 100%;
}
.etf-style .v-period__table colgroup col {
  width: 14.285%;
}
.etf-style .v-period__table thead th {
  background: #F4F4F4;
}
.etf-style .v-period__table th {
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 130%;
  /* 23.4px */
  height: 60rem;
  text-align: center;
  border: 1px solid #C3C3C3;
  border: 1px solid #C3C3C3;
}
.etf-style .v-period__table th:first-child {
  border-left: none;
}
.etf-style .v-period__table th:last-child {
  border-right: none;
}
.etf-style .v-period__table td {
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 130%;
  /* 23.4px */
  height: 60rem;
  text-align: center;
  border: 1px solid #C3C3C3;
}
.etf-style .v-period__table td:last-child {
  border-right: none;
}
.etf-style .table-des {
  color: #000;
  font-family: Pretendard;
  font-size: 16rem;
  font-style: normal;
  font-weight: 300;
  line-height: 130%;
  /* 20.8px */
  margin-top: 10rem;
}
.etf-style .v-price-wrap {
  margin-top: 50rem;
}
.etf-style .v-price__table {
  width: 100%;
}
.etf-style .v-price__table colgroup col {
  width: 16.666%;
}
.etf-style .v-price__table thead th {
  background: #F4F4F4;
}
.etf-style .v-price__table th {
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 130%;
  /* 23.4px */
  height: 60rem;
  text-align: center;
  border: 1px solid #C3C3C3;
  border: 1px solid #C3C3C3;
}
.etf-style .v-price__table td {
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 130%;
  /* 23.4px */
  height: 60rem;
  text-align: center;
  border: 1px solid #C3C3C3;
}
.etf-style .investment-info-wrap {
  margin-top: 50rem;
}
.etf-style .investment-info__table {
  width: 100%;
}
.etf-style .investment-info__table colgroup col {
  width: 20%;
}
.etf-style .investment-info__table thead th {
  background: #F4F4F4;
}
.etf-style .investment-info__table th {
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 130%;
  /* 23.4px */
  height: 60rem;
  text-align: center;
  border: 1px solid #C3C3C3;
}
.etf-style .investment-info__table td {
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 130%;
  /* 23.4px */
  height: 60rem;
  text-align: center;
  border: 1px solid #C3C3C3;
}
.etf-style .risk {
  height: 75rem;
}
.etf-style .risk__bar {
  height: 100%;
  background: linear-gradient(90deg, #DC2952 0%, #E96629 25%, #7DBF4D 50%, #00857C 75%, #00438F 100%);
}
.etf-style .risk__list {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.etf-style .risk__item {
  position: relative;
  display: flex;
  justify-content: center;
  flex: 1;
  color: #FFF;
  text-align: center;
  font-family: Pretendard;
  font-size: 20rem;
  font-style: normal;
  font-weight: 500;
  line-height: 100%;
  /* 20px */
}
.etf-style .risk__item::after {
  display: none;
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  background-color: #fff;
  font-family: Pretendard;
  font-size: 20rem;
  font-style: normal;
  font-weight: 600;
  line-height: 130%;
  /* 26px */
  height: 46rem;
  align-items: center;
  padding: 0 10rem;
  border-radius: 4rem;
  white-space: nowrap;
}
.etf-style .risk__item.risk__item--on::after {
  display: inline-flex;
}
.etf-style .risk__item:nth-of-type(1)::after {
  content: "1등급 높은 위험";
  color: #dc2952;
}
.etf-style .risk__item:nth-of-type(2)::after {
  content: "2등급 높은 위험";
  color: #E96629;
}
.etf-style .risk__item:nth-of-type(3)::after {
  content: "3등급 보통 위험";
  color: #7dbf4d;
}
.etf-style .risk__item:nth-of-type(4)::after {
  content: "4등급 보통 위험";
  color: #7dbf4d;
}
.etf-style .risk__item:nth-of-type(5)::after {
  content: "5등급 낮은 위험";
  color: #00857c;
}
.etf-style .risk__item:nth-of-type(6)::after {
  content: "6등급 낮은 위험";
  color: #00438f;
}
.etf-style .graphBox .chart_box {
  width: 100%;
  height: 555rem;
}
.etf-style .stackBox {
  position: relative;
}
.etf-style .stackBox .chart_box {
  width: 100%;
  height: 300rem;
}
.etf-style .item-1st {
  position: absolute;
  left: 0;
  bottom: 0;
}
.etf-style .item-1st__inner {
  display: flex;
  gap: 24rem;
}
.etf-style .item-1st__color {
  width: 75rem;
  height: 75rem;
  background-color: #5470C6;
}
.etf-style .item-1st__txt-area {
  color: #000;
  font-family: Pretendard;
  font-style: normal;
  line-height: normal;
}
.etf-style .item-1st__txt {
  font-size: 18rem;
  font-weight: 300;
}
.etf-style .item-1st__ratio {
  font-size: 40rem;
  font-weight: 500;
  margin-top: 2rem;
}
.etf-style .mid-area__count {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  display: flex;
  align-items: center;
  margin: auto 0;
}
.etf-style .pdf-count {
  color: #000;
  font-family: Pretendard;
  font-size: 18rem;
  font-style: normal;
  font-weight: 300;
  line-height: 120%;
  /* 21.6px */
}
.etf-style .payment_pop {
  width: 100%;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  touch-action: none;
  pointer-events: none;
  opacity: 0;
  transition: 0.3s ease;
}
.etf-style .payment_pop * {
  box-sizing: border-box;
}
.etf-style .payment_pop.on {
  opacity: 1;
  touch-action: auto;
  pointer-events: auto;
  z-index: 10000000;
}
.etf-style .payment_pop .dim {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  cursor: pointer;
}
.etf-style .payment_pop .popWrap {
  width: 1180px;
  max-width: calc(100% - 40px);
  background: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -30%);
  opacity: 0;
  transition: 0.3s ease 0.2s;
}
.etf-style .payment_pop.on .popWrap {
  transform: translate(-50%, -50%);
  opacity: 1;
  padding: 86px 40px 40px;
}
.etf-style .payment_pop .popWrap .tit {
  background: #EA5519;
  padding: 15px 0;
  text-align: center;
  font-weight: 500;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
}
.etf-style .payment_pop .popWrap .tit .pop_close {
  position: absolute;
  right: 18px;
  top: 21px;
  cursor: pointer;
}
.etf-style .payment_pop .popWrap .tit .pop_close::before,
.etf-style .payment_pop .popWrap .tit .pop_close::after {
  content: "";
  display: block;
  width: 15px;
  height: 2px;
  background: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}
.etf-style .payment_pop .popWrap .tit .pop_close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.etf-style .payment_pop .popWrap .tableWrap {
  width: 100%;
  max-height: 158px;
  text-align: center;
  box-sizing: border-box;
  overflow: hidden;
  overflow-y: auto;
  padding-right: 8px;
  box-sizing: content-box;
}
.etf-style .payment_pop .popWrap .tableWrap::-webkit-scrollbar {
  width: 4px;
  background: #eee;
  border-radius: 2px;
}
.etf-style .payment_pop .popWrap .tableWrap::-webkit-scrollbar-thumb {
  background: #1a4d83;
  border-radius: 2px;
}
.etf-style .payment_pop .popWrap .tableWrap table {
  width: 100%;
  border-top: 2px solid #050505;
}
.etf-style .payment_pop .popWrap .tableWrap table th,
.etf-style .payment_pop .popWrap .tableWrap table td {
  padding: 12px 6px;
  font-size: 14px;
  border: 1px solid #050505;
}
.etf-style .payment_pop .popWrap .tableWrap table th:first-child,
.etf-style .payment_pop .popWrap .tableWrap table td:first-child {
  border-left: none;
}
.etf-style .payment_pop .popWrap .tableWrap table th:last-child,
.etf-style .payment_pop .popWrap .tableWrap table td:last-child {
  border-right: none;
}
.etf-style .payment_pop .popWrap .tableWrap table th {
  background: #f7f7f7;
  font-weight: 500;
}

@media screen and (max-width: 1280px) {
  .etf-style {
    /* comon start */
    /* scroll */
    /* btn */
    /* comon end */
    /* sub visual start */
    /* select */
    /* sub visual end */
    /* layout */
    /* link tab */
    /* section type */
    /* base-info */
    /* b-article */
    /* etc-info */
    /* row */
    /* row1 */
    /* row2 */
    /* date picker */
    /* period tab */
    /* v-period table */
    /* v-price table */
    /* investment-info table */
    /* risk bar */
    /* item-1st */
    /* pdf-count */
  }
  .etf-style .graphBox .chart_box {
    min-width: 871rem;
    height: 278rem;
  }
  .etf-style .dot-list li::before {
    width: 2rem;
    height: 2rem;
  }
  .etf-style .xscroll-box {
    overflow-x: auto;
  }
  .etf-style .xscroll-box::-webkit-scrollbar {
    display: block;
    height: 2px;
  }
  .etf-style .xscroll-box::-webkit-scrollbar-track {
    background: #eee;
  }
  .etf-style .xscroll-box::-webkit-scrollbar-thumb {
    background-color: #EA5519;
    border-radius: 5px;
  }
  .etf-style .xscroll-box.scroll-box--nodisplay::-webkit-scrollbar {
    height: 0;
  }
  .etf-style .xscroll-box.scroll-box--nodisplay::-webkit-scrollbar-track {
    background: transparent;
  }
  .etf-style .xscroll-box.scroll-box--nodisplay::-webkit-scrollbar-thumb {
    background-color: transparent;
  }
  .etf-style .btn-area {
    flex-direction: column;
    gap: 14rem;
  }
  .etf-style .btn {
    height: 40rem;
    padding: 0 13rem;
  }
  .etf-style .btn button, .etf-style .btn a {
    font-size: 14rem;
  }
  .etf-style .btn.btn--down {
    padding: 0 20rem;
  }
  .etf-style .btn.btn--qaccess {
    width: 100%;
    text-align: center;
  }
  .etf-style .btn-3 {
    height: 28rem;
  }
  .etf-style .btn-3 .btn-3__btn {
    color: #FFF;
    font-family: Pretendard;
    font-size: 14rem;
    line-height: 140%;
    /* 19.6px */
    letter-spacing: -0.28rem;
  }
  .etf-style .btn-down {
    height: 56rem;
  }
  .etf-style .btn-down .btn-down__btn {
    padding: 0 24rem;
    font-size: 16rem;
  }
  .etf-style .btn-down .btn-down__btn::after {
    right: 24rem;
    width: 20rem;
  }
  .etf-style .btn-down-excel {
    heiht: 17rem;
  }
  .etf-style .btn-down-excel .btn-down-excel__btn {
    font-size: 14rem;
    padding-left: 24rem;
  }
  .etf-style .btn-down-excel .btn-down-excel__btn::before {
    width: 20rem;
  }
  .etf-style .btn-submit {
    height: 40rem;
  }
  .etf-style .btn-submit .button_submit {
    font-size: 14rem;
    padding: 0 51rem;
  }
  .etf-style .sub-visual-1 {
    height: 633rem;
  }
  .etf-style .sub-visual-1__inner {
    padding: 116rem 20rem 0;
  }
  .etf-style .icon {
    width: 16rem;
    height: 16rem;
  }
  .etf-style .default-select {
    width: 180rem;
    height: 40rem;
    font-size: 14rem;
    letter-spacing: -0.28rem;
  }
  .etf-style .default-select .select-options {
    padding-left: 12rem;
  }
  .etf-style .custom-select {
    font-size: 14rem;
    letter-spacing: -0.28rem;
    height: 40rem;
    flex: 1;
  }
  .etf-style .custom-select .selected > button {
    padding: 0 12rem;
  }
  .etf-style .custom-select .select-options li a, .etf-style .custom-select .select-options li button {
    padding: 8rem 12rem;
    text-align: left;
  }
  .etf-style .tit-area {
    color: #FFF;
    font-family: Pretendard;
    font-size: 28rem;
    font-style: normal;
    font-weight: 500;
    line-height: 120%;
    /* 33.6px */
    margin-top: 24rem;
  }
  .etf-style .tit-area.tit-area--ty1 {
    font-size: 20rem;
    margin-bottom: 24rem;
  }
  .etf-style .tit-area.tit-area--ty2 {
    font-size: 20rem;
    margin-bottom: 24rem;
  }
  .etf-style .tit-area.tit-area--ty2 .btn-down-excel {
    position: static;
    margin-top: 31rem;
  }
  .etf-style .subt-area {
    color: #FFF;
    font-family: Pretendard;
    font-size: 14rem;
    font-style: normal;
    font-weight: 400;
    line-height: 120%;
    /* 16.8px */
    margin-top: 10rem;
  }
  .etf-style .tag-cont__list {
    flex-wrap: wrap;
    gap: 10rem;
  }
  .etf-style .tag {
    height: 25rem;
    padding: 0 25.5rem;
    color: #FFF;
    font-family: Pretendard;
    font-size: 14rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-transform: uppercase;
  }
  .etf-style .info {
    flex-direction: column;
    left: 20rem;
    bottom: -44rem;
    width: calc(100% - 40rem);
    height: auto;
    padding: 0 20rem 20rem;
  }
  .etf-style .info > .box1 {
    flex-direction: column;
  }
  .etf-style .info-price {
    padding: 20rem 0;
  }
  .etf-style .info-price .value {
    color: #000;
    font-family: Pretendard;
    font-size: 30rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
  }
  .etf-style .info-price .value2__val {
    font-size: 18rem;
  }
  .etf-style .info-price + .info-price {
    border-left: none;
    border-top: 1px solid #c3c3c3;
  }
  .etf-style .info-price__label {
    font-size: 14rem;
    line-height: 120%;
    /* 16.8px */
  }
  .etf-style .unit {
    font-size: 14rem;
    line-height: 120%;
  }
  .etf-style .invest-report {
    width: 100%;
  }
  .etf-style .invest-report > .box1 {
    flex-wrap: wrap;
    column-gap: 5rem;
    row-gap: 10rem;
  }
  .etf-style .invest-report__tit {
    font-size: 15rem;
    line-height: 120%;
    /* 18px */
    margin-bottom: 9rem;
  }
  .etf-style .catch-img {
    top: -26rem;
    right: 0;
    width: 90rem;
    height: 87rem;
  }
  .etf-style .ly-1 {
    padding: 124rem 0 0;
    width: calc(100% - 40rem);
  }
  .etf-style .link-tab__item a, .etf-style .link-tab__item button {
    font-size: 20rem;
  }
  .etf-style .sec-ty1 {
    margin-top: 60rem;
  }
  .etf-style .sec-ty1__row-tit {
    font-size: 20rem;
  }
  .etf-style .sec-ty2 .mid-area {
    display: flex;
    flex-direction: column;
  }
  .etf-style .sec-ty2 .mid-area__btn {
    position: static;
    display: flex;
    justify-content: center;
    margin-top: 31rem;
  }
  .etf-style .sec-ty2 .tab-area {
    margin: 35rem 0 27rem;
  }
  .etf-style .sec-ty2 .d-picker-area__box1 {
    gap: 13rem;
  }
  .etf-style .sec-ty2 .d-picker-area__box2 {
    gap: 13rem;
  }
  .etf-style .sec-ty2 + .sec-ty2 {
    margin-top: 80rem;
  }
  .etf-style .base-info__item {
    flex-direction: column;
    padding: 0;
  }
  .etf-style .base-info__article {
    padding: 16rem 0;
  }
  .etf-style .base-info__article + .base-info__article {
    border-top: 1px solid #ccc;
  }
  .etf-style .b-article__tit {
    font-size: 14rem;
  }
  .etf-style .b-article__des-wrap {
    align-items: start;
    flex-direction: column;
    gap: 8rem;
    margin-top: 4rem;
  }
  .etf-style .b-article__des {
    font-size: 16rem;
    margin-top: 4rem;
  }
  .etf-style .b-article__etc {
    margin-top: 8rem;
  }
  .etf-style .etc-info {
    font-size: 14rem;
  }
  .etf-style .row {
    flex-direction: column;
  }
  .etf-style .row > .left {
    width: auto;
  }
  .etf-style .row > .right {
    margin-top: 24rem;
  }
  .etf-style .row + .row {
    margin-top: 80rem;
  }
  .etf-style .row1__btn-area {
    margin-top: 20rem;
  }
  .etf-style .row1__tit {
    font-size: 16rem;
  }
  .etf-style .row1__p {
    font-size: 14rem;
    margin-top: 12rem;
  }
  .etf-style .d-picker-area__inner {
    flex-direction: column;
    column-gap: 13rem;
    row-gap: 20rem;
  }
  .etf-style .col--mo {
    flex-direction: row;
  }
  .etf-style .d-picker {
    height: 40rem;
    width: 140rem;
  }
  .etf-style .d-picker__input {
    font-size: 14rem;
    letter-spacing: -0.28rem;
    padding: 0 12rem;
  }
  .etf-style .period-tab {
    min-width: 612rem;
  }
  .etf-style .period-tab__list {
    height: 45rem;
  }
  .etf-style .period-tab__item {
    font-size: 16rem;
  }
  .etf-style .v-period {
    width: 1305rem;
  }
  .etf-style .v-period__table th {
    font-size: 13.5rem;
  }
  .etf-style .v-period__table td {
    color: #000;
    font-family: Pretendard;
    font-size: 13.5px;
    font-style: normal;
    font-weight: 300;
    line-height: 130%;
    /* 17.55px */
  }
  .etf-style .v-price {
    width: 1305rem;
  }
  .etf-style .v-price__table th {
    font-size: 13.5rem;
  }
  .etf-style .v-price__table td {
    font-size: 13.5rem;
  }
  .etf-style .investment-info-wrap {
    margin-top: 37rem;
  }
  .etf-style .investment-info {
    width: 1305rem;
  }
  .etf-style .investment-info__table th {
    padding-left: 22.5rem;
    font-size: 13.5rem;
    height: 45rem;
  }
  .etf-style .investment-info__table td {
    padding-left: 22.5rem;
    font-size: 13.5rem;
    height: 45rem;
  }
  .etf-style .risk {
    height: 304rem;
  }
  .etf-style .risk__bar {
    background: linear-gradient(180deg, #DC2952 0%, #E96629 25%, #7DBF4D 50%, #00857C 75%, #00438F 100%);
  }
  .etf-style .risk__list {
    flex-direction: column;
  }
  .etf-style .risk__item {
    align-items: center;
  }
  .etf-style .item-1st {
    top: 55%;
    bottom: auto;
  }
  .etf-style .item-1st__inner {
    gap: 14rem;
  }
  .etf-style .item-1st__color {
    width: 45rem;
    height: 45rem;
  }
  .etf-style .item-1st__txt {
    font-size: 14rem;
  }
  .etf-style .item-1st__ratio {
    font-size: 26rem;
  }
  .etf-style .mid-area__count {
    position: static;
    display: flex;
    justify-content: center;
    margin-top: 30rem;
  }
  .etf-style .pdf-count {
    font-size: 14rem;
  }
}
@media screen and (max-width: 767px) {
  .etf-style .payment_pop .popWrap .tit {
    padding: 12px 0;
    font-size: 14px;
  }
  .etf-style .payment_pop .popWrap .tit .pop_close {
    top: 19px;
  }
  .etf-style .payment_pop.on .popWrap {
    padding: 58px 20px 20px;
  }
  .etf-style .payment_pop .popWrap .tableWrap {
    max-height: 117px;
  }
  .etf-style .payment_pop .popWrap .tableWrap table th,
.etf-style .payment_pop .popWrap .tableWrap table td {
    font-size: 12px;
    padding: 8px 4px;
  }
}

/*# sourceMappingURL=sub_br.css.map */