:root { --corp-color-primary: #df6d1b; --corp-color-secondary: #1c3e70; --scale-factor: 1; } #app-header { position: relative; z-index: 1090; background-color: #fff; } #app-header:not(.main) { position: fixed; top: 60px; right: 0; left: 0; } #dBody[data-ui-corporate="v1.0"] { padding-top: 210px; padding-bottom: 3.75rem; } #contents[data-ui-corporate="v1.0"] .board-list-wrap .btn-page-wrap { margin-top: 3.75rem; } #contents.view[data-ui-corporate="v1.0"] { padding-bottom: 3.75rem; } #app-header[data-component="TigerEtfStaticHeader"] .methods .menu::before{background-image:url("../images/icon/icon_menu.svg");} /*.gnb-list .gnb-list-cell.actived > .btn-gnb-one-item { color: #043b72; }*/ /* Overriding: Main */ .sec3 .tit li .cust-select div.on { height: auto; } /* // Overriding: Main */ /* 메인*/ html, body {letter-spacing: normal;} [data-component="SearchAiAssistant"].c-section {position: relative;} [data-component="SearchAiAssistant"] .c-sheet {display: flex;justify-content: space-between;gap: 0 20px;box-sizing: border-box;max-width: 1522px;margin: 0 auto;padding: 0 16px;} [data-component="SearchAiAssistant"] .c-sheet *, [data-component="SearchAiAssistant"] .c-sheet *::before, [data-component="SearchAiAssistant"] .c-sheet *::after {box-sizing: inherit;} [data-component="SearchAiAssistant"] .c-sheet > .c-card:only-child {flex: 1 0 0;} [data-component="SearchAiAssistant"] .c-card {display: flex;flex-direction: row;justify-content: flex-start;align-items: center;gap: 0 30px;border: calc(0.25rem * var(--scale-factor)) solid #f58220;background-color: #fff;} [data-component="SearchAiAssistant"] .c-card input {width: 100%;height: calc(4.2rem * var(--scale-factor));padding: 14px 0 14px 40px;border-radius: 0;border: 0 none;font-size: calc(1.4375rem * var(--scale-factor));letter-spacing: -1px;position: relative;} [data-component="SearchAiAssistant"] .c-card .typing-animated {font-size: 23px;font-weight: 500;color: #949494;line-height: 30px;letter-spacing: -0.46px;position: absolute;top: 50%;left: 40px;z-index: 0;transform: translateY(-50%);} [data-component="SearchAiAssistant"] .c-card .submit {position: relative;width: 42px;height: 42px;margin-right: 25px;font-size: calc(1rem * var(--scale-factor));} [data-component="SearchAiAssistant"] .c-card .submit::before {position: absolute;inset: 0;background: url('/tigeretf/common_kr/pc/images/common/header_methods_search.svg') no-repeat center;background-size: 100% auto;content: '';} [data-component="SearchAiAssistant"] .c-card .submit .val {position: absolute;width: 1px;height: 1px;margin: -1px;clip: rect(0 0 0 0);overflow: hidden;} [data-component="MainHero"].c-section {position: relative;} [data-component="MainHero"] .c-sheet {display: flex;justify-content: space-between;gap: 0 20px;box-sizing: border-box;max-width: 1522px;margin: 0 auto;padding: 0 16px;} [data-component="MainHero"] .c-sheet > .c-card:only-child {flex: 1 0 0;} [data-component="MainHero"] .c-sheet *, [data-component="MainHero"] .c-sheet *::before, [data-component="MainHero"] .c-sheet *::after {box-sizing: inherit;} [data-component="MainHero"] .c-card {position: relative;display: flex;flex-direction: column;justify-content: space-between;background-color: #fbfaff;transition: all .5s ease;} [data-component="MainHero"] .c-card:not(.lead)::before {position: absolute;top: 0;left: 0;right: 0;height: 4px;background-color: #f58220;content: '';} [data-component="MainHero"] .c-card:not(.lead):hover {background: linear-gradient(159deg, rgba(255, 255, 255, 0.00) 2.66%, rgba(255, 60, 0, 0.20) 71.16%), rgba(245, 130, 32, 1);} [data-component="MainHero"] .c-card:not(.lead):hover .category .val, [data-component="MainHero"] .c-card:not(.lead):hover .title, [data-component="MainHero"] .c-card:not(.lead):hover .description {color: #fff;} [data-component="MainHero"] .c-card:not(.lead):hover .category .val {border-color: inherit;} [data-component="MainHero"] .c-card:not(.lead):hover .link {visibility: hidden;} [data-component="MainHero"] .c-card:not(.lead):hover figure {visibility: visible;} [data-component="MainHero"] .c-card:not(.lead) figure {position: absolute;right: 30px;bottom: 40px;width: 120px;height: 120px;visibility: hidden;} [data-component="MainHero"] .c-card:not(.lead) figure img {width: 100%;height: auto;} [data-component="MainHero"] .c-card.lead {flex-direction: row;padding: 0;background-color: transparent;} [data-component="MainHero"] .c-card.lead .title {font-weight: 700;font-size: 48px;line-height: 1.4;margin-block: 10px;} [data-component="MainHero"] .c-card.lead .description {color: #2e2e2e;font-size: 20px;line-height: 1.4;font-weight: 400;letter-spacing: normal;} [data-component="MainHero"] .c-card.lead .content {display: block;padding: 0;} [data-component="MainHero"] .c-card.lead .link {position: static;width: 160px;margin-top: 60px;text-align: center;align-items: center;} [data-component="MainHero"] .c-card.lead .link::before {content: none;} [data-component="MainHero"] .c-card.lead .link a {display: flex;align-items: center;justify-content: center;flex: 1 0 0;height: 45px;padding: 0 16px;border: 2px solid #043b72;font-size: 18px;font-weight: 700;line-height: 29px;transition: 0.3s all;letter-spacing: normal;} [data-component="MainHero"] .c-card.lead .link a:link, [data-component="MainHero"] .c-card.lead .link a:visited {color: #043b72;} [data-component="MainHero"] .c-card.lead .link a:hover, [data-component="MainHero"] .c-card.lead .link a:active {color: #fff;background-color: #043b72;} [data-component="MainHero"] .c-card:only-child {flex: 1 0 0;} [data-component="MainHero"] .c-card .content {position: relative;z-index: 1;flex: 1 0 0;padding: 40px 32px;} [data-component="MainHero"] .c-card .category {display: flex;} [data-component="MainHero"] .c-card .category .val {padding-bottom: 0;color: #043b72;font-size: 20px;font-weight: 400;line-height: 1.4;text-decoration: underline;text-underline-offset: 25%;text-underline-position: from-font;text-decoration-thickness: 8%;} [data-component="MainHero"] .c-card .title {margin: 24px 0 16px;color: #000;font-weight: 700;font-size: 32px;line-height: 1.4;letter-spacing: -2px;} [data-component="MainHero"] .c-card .description {margin: 10px 0;color: #666;font-size: 18px;line-height: 1.5;} [data-component="MainHero"] .c-card .link {position: absolute;right: 32px;bottom: 40px;display: flex;width: 45px;height: 45px;} [data-component="MainHero"] .c-card .link::before {position: absolute;inset: 0;background: url('/tigeretf/common_kr/pc/images/main/featured_icon_arrow.svg') no-repeat center;background-size: 100% auto;content: '';} [data-component="MainHero"] .c-card .link .val {position: absolute;width: 1px;height: 1px;margin: -1px;clip: rect(0 0 0 0);overflow: hidden;} [data-component="MainHero"] .lead figure {order: 1;width: 540px;height: 278px;background-color: #eee;overflow: hidden;} [data-component="MainHero"] .lead figure a {width: 100%;height: 100%;overflow: hidden;} [data-component="MainHero"] figure img {width: 100%;height: 100%;object-fit: cover;object-position: center;transition: transform 0.5s ease;} [data-component="MainHero"] figure img:hover {transform: scale(1.1);} @media screen and (max-width:1180px){ [data-component="MainHero"] .c-card .category .val{font-size:15px;} [data-component="MainHero"] .c-card.lead .title{font-size:43px;} [data-component="MainHero"] .c-card.lead .description{font-size:16px;} [data-component="MainHero"] .c-card.lead .link{width: 130px;margin-top: 40px;} [data-component="MainHero"] .c-card.lead .link a{font-size:16px;} [data-component="MainHero"] .c-card .title{font-size: 24px;} [data-component="MainHero"] .c-card .description{font-size:15px;} } [data-component="TigerEtfMainHero"].c-section {position: relative;background-color: #043b72 !important;} [data-component="TigerEtfMainHero"] .c-sheet {display: flex;justify-content: space-between;gap: 0 20px;box-sizing: border-box;max-width: 1522px;margin: 0 auto;padding: 0 16px;} [data-component="TigerEtfMainHero"] .c-sheet > .c-card:only-child {flex: 1 0 0;} [data-component="TigerEtfMainHero"] .c-card {padding: 60px 0;} [data-component="TigerEtfMainHero"] .c-card h3 {margin: 0 0 20px !important;color: #fff;font-weight: normal;font-size: calc(1.5rem * var(--scale-factor));} [data-component="TigerEtfMainHero"] .etf-focus {display: grid;grid-template-columns: repeat(3, 1fr);gap: 24px;} [data-component="TigerEtfMainHero"] .etf-focus a {display: block;padding: 16px 32px;height: 70px;background-color: #fff;color: #043b72;font-weight: 700;font-size: 24px;line-height: 38px;text-align: center;transition: all 0.5s ease;} [data-component="TigerEtfMainHero"] .etf-focus a:hover, [data-component="TigerEtfMainHero"] .etf-focus a:active {background: linear-gradient(180deg, #E37500 0%, #F58220 59.62%, #FF9840 100%);color: #fff;} .sec2 {padding: 0;width: auto;overflow: visible;display: block;text-align: left;} [data-component="InvestmentMainSlot2"].c-section {position: relative;} [data-component="InvestmentMainSlot2"] .c-sheet {box-sizing: border-box;max-width: 1522px;margin: 0 auto;padding: 0 16px;} [data-component="InvestmentMainSlot2"] .c-sheet *, [data-component="InvestmentMainSlot2"] .c-sheet *::before, [data-component="InvestmentMainSlot2"] .c-sheet *::after {box-sizing: inherit;} [data-component="InvestmentMainSlot2"].slot2 h2 {margin: 0 0 33px;color: #002b57;font-weight: 700;font-size: 32px;line-height: 1.4;letter-spacing: -2px;} [data-component="InvestmentMainSlot2"] .focus-list {display: flex;align-items:stretch;gap: 24px;} [data-component="InvestmentMainSlot2"] .focus-list .focus-item{background-color:#fff;} [data-component="InvestmentMainSlot2"] .focus-list .focus-item .figure img {width:100%;height:100%;object-fit: cover;object-position: center;} [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content a {display:flex;flex-direction: column;gap: 8px;} [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content .title{font-size:24px;font-weight:700;line-height:1.4;color:#000;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;} [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content .info{display:flex;align-items:center;gap:20px;} [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content .info .date{font-size:20px;font-weight:400;line-height:1.4;color:#757575;} [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content .info .source{font-size:18px;font-weight:700;line-height:1.4;color:#F58220;} [data-component="InvestmentMainSlot2"] .focus-list .list-left {width:733px;flex:none;overflow: hidden;} @media (max-width: 1180px) { [data-component="InvestmentMainSlot2"] .focus-list .list-left{width:484px;} } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big {width:100%;height:100%;position:relative;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .focus-item {display: flex;flex-direction: column;gap: 15px;height:100%;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .figure {width:100%;aspect-ratio: 16/9;overflow: hidden;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .figure a{display:block;width:100%;height:100%;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .figure img{transition:transform 0.5s ease;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .figure a:hover img{transform:scale(1.1);} [data-component="InvestmentMainSlot2"] .swiper-controls { position:absolute; inset:auto; bottom:108px; right:20px; background:#F5F7F9; border-radius:12px; display:flex; gap:8px;align-items:center;padding:0 15px;height:24px;z-index:1;} @media (max-width: 1180px) { [data-component="InvestmentMainSlot2"] .swiper-controls { bottom:159px; } } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-pagination { position:relative;inset:auto; font-size:10px;font-weight:400;line-height:24px;letter-spacing: -0.26px;color:#585E6B;vertical-align:middle;} [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-pagination span{vertical-align:bottom;font-size:13px;} [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-pagination-current{color:#F58220;font-weight:500;} [data-component="InvestmentMainSlot2"] .swiper-controls button{width:12px; height:12px; position:relative; top:auto; left:auto; right:auto;z-index:1;margin-top:0;} [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-prev { background:url("/tigeretf/common_kr/pc/images/icon/icon_main_focus_prev.svg") no-repeat center center / contain; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-prev::after{display:none;} [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-next { background:url("/tigeretf/common_kr/pc/images/icon/icon_main_focus_next.svg") no-repeat center center / contain; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-next::after{display:none;} [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-pause { background:url("/tigeretf/common_kr/pc/images/icon/icon_main_focus_pause.svg") no-repeat center center / contain; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-play { background:url("/tigeretf/common_kr/pc/images/icon/icon_main_focus_play.svg") no-repeat center center / contain; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small {flex: 1;overflow: hidden;border-bottom:1px solid #eee;align-self:flex-start;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .swiper-wrapper{display:flex;flex-direction: column;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .focus-item {width:100%;display: flex;align-items:center;height:103px;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .figure {width:144px;height:81px;aspect-ratio: 16/9;overflow: hidden;flex:none;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .figure a{display:block;width:100%;height:100%;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .figure img {width:100%;height:100%;object-fit: cover;object-position: center;transition:transform 0.5s ease;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .figure a:hover img{transform:scale(1.1);} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .content{height:100%;border-top:1px solid #ececec;flex:1;padding-inline:20px;overflow: hidden;display:flex;align-items:center;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .content a{width:100%;overflow: hidden;} [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .swiper-slide.swiper-slide-thumb-active{display:none;} [data-component="InvestmentMainSlot2"] .section-more{margin-top:40px;} .section-more{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:50px;margin-inline:auto;} .section-more .btn-more{display:inline-flex;align-items:center;gap:2px;} .section-more .btn-more span{font-size:16px;color:#757575;line-height:1.625;display:block;font-weight:500;} .section-more .btn-more .icon-arrow-right{width:24px;height:24px;display:block;background-image:url("/tigeretf/common_kr/pc/images/icon/shortcut_caret_right_temp.svg");background-size:contain;background-repeat:no-repeat;} [data-component="TigerEtfMainPension"].c-section {position: relative;} [data-component="TigerEtfMainPension"] .c-sheet {display: flex;justify-content: space-between;align-items: center;gap: 0 20px;box-sizing: border-box;max-width: 1522px;margin: 0 auto;padding: 0 16px;} [data-component="TigerEtfMainPension"] .c-sheet > .c-card:only-child {flex: 1 0 0;} [data-component="TigerEtfMainPension"] .c-sheet *, [data-component="TigerEtfMainPension"] .c-sheet *::before, [data-component="TigerEtfMainPension"] .c-sheet *::after {box-sizing: inherit;} [data-component="TigerEtfMainPension"] .title {color: #043b72;font-weight: 700;font-size: 32px;line-height: 1.4;} [data-component="TigerEtfMainPension"] .list {display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));grid-template-rows: 1fr;gap: max(24px, .625vw);} [data-component="TigerEtfMainPension"] .list .each a {display: block;width: 314px;height: 80px;padding: 20px 30px;background-color: #043b72;color: #fff;font-weight: 700;font-size: 24px;line-height: 1.66667;text-align: center;text-transform: uppercase;transition: all 0.5s ease;} [data-component="TigerEtfMainPension"] .list .each a:hover {background-color: #F58220;} @media screen and (max-width:1180px){ [data-component="TigerEtfMainPension"] .list .each a{width:250px;} } [data-component="InvestmentMainSlot3"].c-section {position: relative;padding-top: 75px;border-top: 30px solid #f5f7f9;} [data-component="InvestmentMainSlot3"] .c-sheet {box-sizing: border-box;max-width: 1522px;margin: 0 auto;padding: 0 16px;} [data-component="InvestmentMainSlot3"] .c-sheet:only-child {flex: 1 0 0;} [data-component="InvestmentMainSlot3"] .c-sheet *, [data-component="InvestmentMainSlot3"] .c-sheet *::before, [data-component="InvestmentMainSlot3"] .c-sheet *::after {box-sizing: inherit;} [data-component="InvestmentMainSlot3"] .tabs {display: flex;align-items: center;padding-right: 0;padding-left: 0;border-bottom: 2px solid #c9c9c9;} [data-component="InvestmentMainSlot3"] .tabs .each {padding-right: 0;padding-bottom: 30px;padding-left: 0;} [data-component="InvestmentMainSlot3"] .tabs .each:not(:first-child) {margin-left: 72px;} [data-component="InvestmentMainSlot3"] .tabs .each.active, [data-component="InvestmentMainSlot3"] .tabs .each.on {margin-bottom: -2px;padding-bottom: 26px;border-bottom: 4px solid #ff8300;font-weight: 700;font-size: 36px;} [data-component="InvestmentMainSlot3"] .tabs .each {color: #474747;font-size: 36px;} [data-component="InvestmentMainSlot3"] .tabs .each.active, [data-component="InvestmentMainSlot3"] .tabs .each.on {color: #f58220;} [data-component="InvestmentMainSlot3"] .tabs .each:hover {font-weight: 700;color: #f58220 !important;} [data-component="InvestmentMainSlot3"] .products {display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));grid-template-rows: 1fr;gap: max(24px, .625vw);grid-auto-flow: column;} [data-component="InvestmentMainSlot3"] .products > .each:nth-child(1) {grid-column-start: 1;} [data-component="InvestmentMainSlot3"] .products > .each:nth-child(2) {grid-column-start: 2;} [data-component="InvestmentMainSlot3"] .products > .each:nth-child(3) {grid-column-start: 3;} [data-component="InvestmentMainSlot3"] .products > .each:nth-child(4) {grid-column-start: 4;} [data-component="InvestmentMainSlot3"] .products > .each .header {display: flex;justify-content: space-between;} [data-component="InvestmentMainSlot3"] .products .rank {color: #000;font-weight: 700;font-size: 24px;line-height: 1.4;} [data-component="InvestmentMainSlot3"] .products .title {min-height: 5.625rem;margin: 28px 0 6px;color: #043b72;font-weight: 700;font-size: 32px;line-height: 1.4;text-overflow: ellipsis;overflow: hidden;word-break: break-word;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} [data-component="InvestmentMainSlot3"] .products .code {color: #043b72;font-size: 14px;line-height: 1.4;} [data-component="InvestmentMainSlot3"] .products .type {display: flex;flex-wrap: wrap;align-items: flex-start;margin-bottom: 28px;margin-left: -10px;} [data-component="InvestmentMainSlot3"] .products .type span {position: relative;margin: 0 10px;color: #949494;font-size: 14px;line-height: 1.4;} [data-component="InvestmentMainSlot3"] .products .type span + span, [data-component="InvestmentMainSlot3"] .products .type span.has-divider, [data-component="InvestmentMainSlot3"] .products .type div[id^="cateTitle_"]:not(:empty) ~ span {margin-left: 11px;} [data-component="InvestmentMainSlot3"] .products .type span + span::before, [data-component="InvestmentMainSlot3"] .products .type span.has-divider::before, [data-component="InvestmentMainSlot3"] .products .type div[id^="cateTitle_"]:not(:empty) ~ span::before {position: absolute;top: 50%;left: -11px;height: 12px;margin-top: -6px;border-left: 1px solid #c9c9c9;content: '';} [data-component="InvestmentMainSlot3"] .products .graph {margin: 8px 0 30px;} [data-component="InvestmentMainSlot3"] .calculation .this-label {color: #949494;font-size: 12px;line-height: 1.4;} [data-component="InvestmentMainSlot3"] .calculation .val {display: flex;align-items: flex-end;} [data-component="InvestmentMainSlot3"] .calculation .val.increased span {color: #d93b3b;} [data-component="InvestmentMainSlot3"] .calculation .val.decreased span {color: #245dab;} [data-component="InvestmentMainSlot3"] .calculation .val .number {font-weight: 500;font-size: 38px;line-height: 1.4;} [data-component="InvestmentMainSlot3"] .calculation .val .unit {position: relative;top: -7px;font-weight: 700;font-size: 24px;} [data-component="InvestmentMainSlot3"] .prices {display: flex;margin-top: 30px;} [data-component="InvestmentMainSlot3"] .prices > div {flex: 0 0 50%;} [data-component="InvestmentMainSlot3"] .prices .this-label {display: block;color: #949494;font-size: 14px;line-height: 1.4;} [data-component="InvestmentMainSlot3"] .prices .val {color: #000;font-size: 14px;line-height: 1.4;} [data-component="InvestmentMainSlot3"] .c-list-handler {display: flex;justify-content: space-between;align-items: center;margin: 80px 0 60px;} [data-component="InvestmentMainSlot3"] .c-list-handler .filter {display: flex;align-items: center;} [data-component="InvestmentMainSlot3"] .c-list-handler .filter .prefix, [data-component="InvestmentMainSlot3"] .c-list-handler .filter .content {font-weight: 700;font-size: 32px;line-height: 45px;white-space: nowrap;} [data-component="InvestmentMainSlot3"] .c-list-handler .form {position: relative;width: 136px;height: 47px;margin: -1px 12px -1px 23px;} .sec3 .tit li .cust-select p span {position: absolute;top: 50%;right: 13px;width: 24px;height: 25px;margin-top: -12.5px;background: url('/tigeretf/common_kr/pc/images/icon/select_filter_caret_down_temp.svg') no-repeat center;background-size: 100% auto;content: '';} [data-component="InvestmentMainSlot3"] .c-list-handler .form select {width: 100%;height: 45px;padding: 7px 13px;} [data-component="InvestmentMainSlot3"] .criteria {position: relative;padding-left: 22px;color: #757575;font-weight: 400;font-size: 15px;line-height: 1.4;} [data-component="InvestmentMainSlot3"] .criteria::before {position: absolute;top: 50%;left: 0;width: 18px;height: 18px;margin-top: -9px;background: url('/tigeretf/common_kr/pc/images/icon/indicator-criteria.svg') no-repeat center;background-size: 100% auto;content: '';} [data-component="InvestmentMainSlot3"] .c-sheet .closer {margin: 50px 0 120px;} [data-component="InvestmentMainSlot3"] .shortcut {display: flex;justify-content: center;} [data-component="InvestmentMainSlot3"] .shortcut .link {position: relative;padding: 1px 26px 1px 0;color: #5e5e5e;font-size: 16px;line-height: 1.375;} [data-component="InvestmentMainSlot3"] .shortcut .link::after {position: absolute;top: 50%;right: 0;width: 24px;height: 24px;margin-top: -12px;background: url('/tigeretf/common_kr/pc/images/icon/shortcut_caret_right_temp.svg') no-repeat right center;background-size: auto 100%;content: '';} .sec3 .con div.card div .products a {padding: 0;border-radius: 0;border-width: 0;background-color: transparent;} .sec3 .con div.card div .products a::after {content: none;} .sec3 .con div.card div .products > .each > a {padding: 50px 30px 52px;height: 520px;border: 1px solid #c9c9c9;} .sec3 .con div.card div .products > .each > a:hover {border: 1px solid #f58220;} .btn-item-like::before, .btn-item-like::after {content: none;} .sec3 .con div.card .option-con.on {transform: none;} .sec3 .con div.card.on {display: block !important;width: 100%;} .sec3 .con div.card .option-con.on {display: grid !important;} .main-tab {border-width: 0;border-radius: 0;} .main-tab a {border-radius: 0;font-weight: 400;} .main-tab span {bottom: 0;border-radius: 0;background-color: transparent;} .main-tab a.on {color: #f58220 !important;} .sec3 .tit {width: auto;height: 185px;margin: 0;} .sec3 .tit li .cust-select {width: 100%;transform: none;height: 47px;border-radius: 0;border: 1px solid #d2dcf3;background-color: #ffdcc6;vertical-align: top;} .sec3 .tit li .cust-select div {margin: 0 -1px;border-radius: 10px;border-top-left-radius: 0;border-top-right-radius: 0;border: 1px solid #d2dcf3;border-top-width: 0;background-color: #ffdcc6;} .main-pop-data .swiper-slide > a {height: 100%;} #dBody[data-ui-corporate="v1.0"] {padding-top: 230px;} #contents.only-main {padding-top: 0;} .sec3 {padding-bottom: 0;} .sec3 .tit li:last-child {top: 0;} .sec3 .con {min-height: 714px;} .sec3 .con div .link {position: relative;left: auto;width: auto;transform: none;} div[id^="cateTitle_"]{margin-top:-3px;} @media screen and (max-width:1180px){ [data-component="InvestmentMainSlot3"] .products .title{font-size:25px;margin-top:0;min-height:4.625rem;} [data-component="InvestmentMainSlot3"] .products .type span{margin:0 5px;font-size:12px;} div[id^="cateTitle_"]{margin-top:-5px;} [data-component="InvestmentMainSlot3"] .products .type span + span, [data-component="InvestmentMainSlot3"] .products .type span.has-divider, [data-component="InvestmentMainSlot3"] .products .type div[id^="cateTitle_"]:not(:empty) ~ span{margin-left:8px;} [data-component="InvestmentMainSlot3"] .products .type span + span::before, [data-component="InvestmentMainSlot3"] .products .type span.has-divider::before, [data-component="InvestmentMainSlot3"] .products .type div[id^="cateTitle_"]:not(:empty) ~ span::before{left:-7px;} [data-component="InvestmentMainSlot3"] .c-list-handler .filter .prefix, [data-component="InvestmentMainSlot3"] .c-list-handler .filter .content{font-size:25px;} [data-component="InvestmentMainSlot3"] .c-list-handler .form{margin-left:5px;} .sec3 .tit li .cust-select{font-size:20px;} [data-component="InvestmentMainSlot3"] .calculation .val .number{font-size:30px;} [data-component="InvestmentMainSlot3"] .calculation .val .unit{font-size: 20px;} .sec3 .con div.card div .products > .each > a{height:490px;} } #app-header:not(.main) { position: fixed; top: 60px; right: 0; left: 0; } #dBody[data-ui-corporate="v1.0"] { padding-top: 210px; padding-bottom: 3.75rem; } #contents[data-ui-corporate="v1.0"] .board-list-wrap .btn-page-wrap { margin-top: 3.75rem; } #app-header[data-component="TigerEtfStaticHeader"] .methods .menu::before { background-image: url("../images/icon/icon_menu.svg"); } /*.gnb-list .gnb-list-cell.actived > .btn-gnb-one-item { color: #043b72; }*/ /* Overriding: Main */ .sec3 .tit li .cust-select div.on { height: auto; } /* // Overriding: Main */ /* 메인*/ html, body { letter-spacing: normal; } [data-component="SearchAiAssistant"].c-section { position: relative; } [data-component="SearchAiAssistant"] .c-sheet { display: flex; justify-content: space-between; gap: 0 20px; box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } [data-component="SearchAiAssistant"] .c-sheet *, [data-component="SearchAiAssistant"] .c-sheet *::before, [data-component="SearchAiAssistant"] .c-sheet *::after { box-sizing: inherit; } [data-component="SearchAiAssistant"] .c-sheet>.c-card:only-child { flex: 1 0 0; } [data-component="SearchAiAssistant"] .c-card { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 0 30px; border: calc(0.25rem * var(--scale-factor)) solid #f58220; background-color: #fff; } [data-component="SearchAiAssistant"] .c-card input { width: 100%; height: calc(4.2rem * var(--scale-factor)); padding: 14px 0 14px 40px; border-radius: 0; border: 0 none; font-size: calc(1.4375rem * var(--scale-factor)); letter-spacing: -1px; position: relative; } [data-component="SearchAiAssistant"] .c-card .typing-animated { font-size: 23px; font-weight: 500; color: #949494; line-height: 30px; letter-spacing: -0.46px; position: absolute; top: 50%; left: 40px; z-index: 0; transform: translateY(-50%); } [data-component="SearchAiAssistant"] .c-card .submit { position: relative; width: 42px; height: 42px; margin-right: 25px; font-size: calc(1rem * var(--scale-factor)); } [data-component="SearchAiAssistant"] .c-card .submit::before { position: absolute; inset: 0; background: url('/tigeretf/common_kr/pc/images/common/header_methods_search.svg') no-repeat center; background-size: 100% auto; content: ''; } [data-component="SearchAiAssistant"] .c-card .submit .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } [data-component="MainHero"].c-section { position: relative; } [data-component="MainHero"] .c-sheet { display: flex; justify-content: space-between; gap: 0 20px; box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } [data-component="MainHero"] .c-sheet>.c-card:only-child { flex: 1 0 0; } [data-component="MainHero"] .c-sheet *, [data-component="MainHero"] .c-sheet *::before, [data-component="MainHero"] .c-sheet *::after { box-sizing: inherit; } [data-component="MainHero"] .c-card { position: relative; display: flex; flex-direction: column; justify-content: space-between; background-color: #fbfaff; transition: all .5s ease; } [data-component="MainHero"] .c-card:not(.lead)::before { position: absolute; top: 0; left: 0; right: 0; height: 4px; background-color: #f58220; content: ''; } [data-component="MainHero"] .c-card:not(.lead):hover { background: linear-gradient(159deg, rgba(255, 255, 255, 0.00) 2.66%, rgba(255, 60, 0, 0.20) 71.16%), rgba(245, 130, 32, 1); } [data-component="MainHero"] .c-card:not(.lead):hover .category .val, [data-component="MainHero"] .c-card:not(.lead):hover .title, [data-component="MainHero"] .c-card:not(.lead):hover .description { color: #fff; } [data-component="MainHero"] .c-card:not(.lead):hover .category .val { border-color: inherit; } [data-component="MainHero"] .c-card:not(.lead):hover .link { visibility: hidden; } [data-component="MainHero"] .c-card:not(.lead):hover figure { visibility: visible; } [data-component="MainHero"] .c-card:not(.lead) figure { position: absolute; right: 30px; bottom: 40px; width: 120px; height: 120px; visibility: hidden; } [data-component="MainHero"] .c-card:not(.lead) figure img { width: 100%; height: auto; } [data-component="MainHero"] .c-card.lead { flex-direction: row; padding: 0; background-color: transparent; } [data-component="MainHero"] .c-card.lead .title { font-weight: 700; font-size: 48px; line-height: 1.4; margin-block: 10px; } [data-component="MainHero"] .c-card.lead .description { color: #2e2e2e; font-size: 20px; line-height: 1.4; font-weight: 400; letter-spacing: normal; } [data-component="MainHero"] .c-card.lead .content { display: block; padding: 0; } [data-component="MainHero"] .c-card.lead .link { position: static; min-width: 160px; width: auto; margin-top: 60px; text-align: center; align-items: center; display: inline-flex; } [data-component="MainHero"] .c-card.lead .link::before { content: none; } [data-component="MainHero"] .c-card.lead .link a { display: flex; align-items: center; justify-content: center; flex: 1 0 0; height: 45px; padding: 0 16px; border: 2px solid #043b72; font-size: 18px; font-weight: 700; line-height: 29px; transition: 0.3s all; letter-spacing: normal; } [data-component="MainHero"] .c-card.lead .link a:link, [data-component="MainHero"] .c-card.lead .link a:visited { color: #043b72; } [data-component="MainHero"] .c-card.lead .link a:hover, [data-component="MainHero"] .c-card.lead .link a:active { color: #fff; background-color: #043b72; } [data-component="MainHero"] .c-card:only-child { flex: 1 0 0; } [data-component="MainHero"] .c-card .content { position: relative; z-index: 1; flex: 1 0 0; padding: 40px 32px; } [data-component="MainHero"] .c-card .category { display: flex; } [data-component="MainHero"] .c-card .category .val { padding-bottom: 0; color: #043b72; font-size: 20px; font-weight: 400; line-height: 1.4; text-decoration: underline; text-underline-offset: 25%; text-underline-position: from-font; text-decoration-thickness: 8%; } [data-component="MainHero"] .c-card .title { margin: 24px 0 16px; color: #000; font-weight: 700; font-size: 32px; line-height: 1.4; letter-spacing: -2px; } [data-component="MainHero"] .c-card .description { margin: 10px 0; color: #666; font-size: 18px; line-height: 1.5; } [data-component="MainHero"] .c-card .link { position: absolute; right: 32px; bottom: 40px; display: flex; width: 45px; height: 45px; } [data-component="MainHero"] .c-card .link::before { position: absolute; inset: 0; background: url('/tigeretf/common_kr/pc/images/main/featured_icon_arrow.svg') no-repeat center; background-size: 100% auto; content: ''; } [data-component="MainHero"] .c-card .link .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } [data-component="MainHero"] .lead figure { order: 1; width: 540px; height: 278px; background-color: #eee; overflow: hidden; } [data-component="MainHero"] .lead figure a { width: 100%; height: 100%; overflow: hidden; } [data-component="MainHero"] figure img { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 0.5s ease; } [data-component="MainHero"] figure img:hover { transform: scale(1.1); } @media screen and (max-width:1180px) { [data-component="MainHero"] .c-card .category .val { font-size: 15px; } [data-component="MainHero"] .c-card.lead .title { font-size: 43px; } [data-component="MainHero"] .c-card.lead .description { font-size: 16px; } [data-component="MainHero"] .c-card.lead .link { width: 130px; margin-top: 40px; } [data-component="MainHero"] .c-card.lead .link a { font-size: 16px; } [data-component="MainHero"] .c-card .title { font-size: 24px; } [data-component="MainHero"] .c-card .description { font-size: 15px; } } [data-component="TigerEtfMainHero"].c-section { position: relative; background-color: #043b72 !important; } [data-component="TigerEtfMainHero"] .c-sheet { display: flex; justify-content: space-between; gap: 0 20px; box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } [data-component="TigerEtfMainHero"] .c-sheet>.c-card:only-child { flex: 1 0 0; } [data-component="TigerEtfMainHero"] .c-card { padding: 60px 0; } [data-component="TigerEtfMainHero"] .c-card h3 { margin: 0 0 20px !important; color: #fff; font-weight: normal; font-size: calc(1.5rem * var(--scale-factor)); } [data-component="TigerEtfMainHero"] .etf-focus { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; } /* 1개: 1개가 1행에 꽉 차게 (full width) */ [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(1):last-child) { grid-template-columns: 1fr; } /* 2개: 2개가 1행에 꽉 차게 (1:1) */ [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(2):last-child), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(4):last-child) { grid-template-columns: repeat(2, 1fr); } /* 3개: 3개가 1행에 꽉 차게 */ [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(3):last-child), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(6):last-child) { grid-template-columns: repeat(3, 1fr); } /* 5개: 2행 (2개 + 3개) */ [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(5):last-child) { grid-template-columns: repeat(6, 1fr); } [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(5):last-child) li:nth-child(1), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(5):last-child) li:nth-child(2), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(5):last-child) li:nth-child(3) { grid-column: span 2; } [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(5):last-child) li:nth-child(4), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(5):last-child) li:nth-child(5) { grid-column: span 3; } /* 7개: 3행 (3개 + 3개 + 1개) */ [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(7):last-child) { grid-template-columns: repeat(3, 1fr); } /* 8개 이상: 3행 (3개 + 3개 + 2개) */ [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(8)) { grid-template-columns: repeat(6, 1fr); } /* 첫 번째, 두번째 행: 2칸씩 차지 (3개씩) */ [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(8)) li:nth-child(1), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(8)) li:nth-child(2), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(8)) li:nth-child(3), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(8)) li:nth-child(4), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(8)) li:nth-child(5), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(8)) li:nth-child(6) { grid-column: span 2; } /* 세 번째 행: 3칸씩 차지 (2개) */ [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(8)) li:nth-child(7), [data-component="TigerEtfMainHero"] .etf-focus:has(li:nth-child(8)) li:nth-child(8) { grid-column: span 3; } [data-component="TigerEtfMainHero"] .etf-focus a { display: block; padding: 16px 32px; height: 70px; background-color: #fff; color: #043b72; font-weight: 700; font-size: 24px; line-height: 38px; text-align: center; transition: all 0.5s ease; } [data-component="TigerEtfMainHero"] .etf-focus a:hover, [data-component="TigerEtfMainHero"] .etf-focus a:active { background: linear-gradient(180deg, #E37500 0%, #F58220 59.62%, #FF9840 100%); color: #fff; } .sec2 { padding: 0; width: auto; overflow: visible; display: block; text-align: left; } [data-component="InvestmentMainSlot2"].c-section { position: relative; } [data-component="InvestmentMainSlot2"] .c-sheet { box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } [data-component="InvestmentMainSlot2"] .c-sheet *, [data-component="InvestmentMainSlot2"] .c-sheet *::before, [data-component="InvestmentMainSlot2"] .c-sheet *::after { box-sizing: inherit; } [data-component="InvestmentMainSlot2"].slot2 h2 { margin: 0 0 33px; color: #002b57; font-weight: 700; font-size: 32px; line-height: 1.4; letter-spacing: -2px; } [data-component="InvestmentMainSlot2"] .focus-list { display: flex; align-items: stretch; gap: 24px; } [data-component="InvestmentMainSlot2"] .focus-list .focus-item { background-color: #fff; } [data-component="InvestmentMainSlot2"] .focus-list .focus-item .figure img { width: 100%; height: 100%; object-fit: cover; object-position: center; } [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content a { display: flex; flex-direction: column; gap: 8px; } [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content .title { font-size: 24px; font-weight: 700; line-height: 1.4; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content .info { display: flex; align-items: center; gap: 20px; } [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content .info .date { font-size: 20px; font-weight: 400; line-height: 1.4; color: #757575; } [data-component="InvestmentMainSlot2"] .focus-list .focus-item .content .info .source { font-size: 18px; font-weight: 700; line-height: 1.4; color: #F58220; } [data-component="InvestmentMainSlot2"] .focus-list .list-left { width: 733px; flex: none; overflow: hidden; } @media (max-width: 1180px) { [data-component="InvestmentMainSlot2"] .focus-list .list-left { width: 484px; } } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big { width: 100%; height: 100%; position: relative; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .focus-item { display: flex; flex-direction: column; gap: 15px; height: 100%; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .figure { width: 100%; aspect-ratio: 16/9; overflow: hidden; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .figure a { display: block; width: 100%; height: 100%; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .figure img { transition: transform 0.5s ease; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-big .figure a:hover img { transform: scale(1.1); } [data-component="InvestmentMainSlot2"] .swiper-controls { position: absolute; inset: auto; bottom: 108px; right: 20px; background: #F5F7F9; border-radius: 12px; display: flex; gap: 8px; align-items: center; padding: 0 15px; height: 24px; z-index: 1; } @media (max-width: 1180px) { [data-component="InvestmentMainSlot2"] .swiper-controls { bottom: 159px; } } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-pagination { position: relative; inset: auto; font-size: 10px; font-weight: 400; line-height: 24px; letter-spacing: -0.26px; color: #585E6B; vertical-align: middle; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-pagination span { vertical-align: bottom; font-size: 13px; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-pagination-current { color: #F58220; font-weight: 500; } [data-component="InvestmentMainSlot2"] .swiper-controls button { width: 12px; height: 12px; position: relative; top: auto; left: auto; right: auto; z-index: 1; margin-top: 0; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-prev { background: url("/tigeretf/common_kr/pc/images/icon/icon_main_focus_prev.svg") no-repeat center center / contain; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-prev::after { display: none; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-next { background: url("/tigeretf/common_kr/pc/images/icon/icon_main_focus_next.svg") no-repeat center center / contain; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-next::after { display: none; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-pause { background: url("/tigeretf/common_kr/pc/images/icon/icon_main_focus_pause.svg") no-repeat center center / contain; } [data-component="InvestmentMainSlot2"] .swiper-controls .swiper-button-play { background: url("/tigeretf/common_kr/pc/images/icon/icon_main_focus_play.svg") no-repeat center center / contain; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small { flex: 1; overflow: hidden; border-bottom: 1px solid #eee; align-self: flex-start; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .swiper-wrapper { display: flex; flex-direction: column; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .focus-item { width: 100%; display: flex; align-items: center; height: 103px; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .figure { width: 144px; height: 81px; aspect-ratio: 16/9; overflow: hidden; flex: none; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .figure a { display: block; width: 100%; height: 100%; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .figure img { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 0.5s ease; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .figure a:hover img { transform: scale(1.1); } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .content { height: 100%; border-top: 1px solid #ececec; flex: 1; padding-inline: 20px; overflow: hidden; display: flex; align-items: center; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .content a { width: 100%; overflow: hidden; } [data-component="InvestmentMainSlot2"] .focus-list .focus-list-small .swiper-slide.swiper-slide-thumb-active { display: none; } [data-component="InvestmentMainSlot2"] .section-more { margin-top: 40px; } .section-more { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 50px; margin-inline: auto; } .section-more .btn-more { display: inline-flex; align-items: center; gap: 2px; } .section-more .btn-more span { font-size: 16px; color: #757575; line-height: 1.625; display: block; font-weight: 500; } .section-more .btn-more .icon-arrow-right { width: 24px; height: 24px; display: block; background-image: url("/tigeretf/common_kr/pc/images/icon/shortcut_caret_right_temp.svg"); background-size: contain; background-repeat: no-repeat; } [data-component="TigerEtfMainPension"].c-section { position: relative; } [data-component="TigerEtfMainPension"] .c-sheet { display: flex; justify-content: space-between; align-items: center; gap: 0 20px; box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } [data-component="TigerEtfMainPension"] .c-sheet>.c-card:only-child { flex: 1 0 0; } [data-component="TigerEtfMainPension"] .c-sheet *, [data-component="TigerEtfMainPension"] .c-sheet *::before, [data-component="TigerEtfMainPension"] .c-sheet *::after { box-sizing: inherit; } [data-component="TigerEtfMainPension"] .title { color: #043b72; font-weight: 700; font-size: 32px; line-height: 1.4; } [data-component="TigerEtfMainPension"] .list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: 1fr; gap: max(24px, .625vw); } [data-component="TigerEtfMainPension"] .list .each a { display: block; width: 314px; height: 80px; padding: 20px 30px; background-color: #043b72; color: #fff; font-weight: 700; font-size: 24px; line-height: 1.66667; text-align: center; text-transform: uppercase; transition: all 0.5s ease; } [data-component="TigerEtfMainPension"] .list .each a:hover { background-color: #F58220; } @media screen and (max-width:1180px) { [data-component="TigerEtfMainPension"] .list .each a { width: 250px; } } [data-component="InvestmentMainSlot3"].c-section { position: relative; padding-top: 75px; border-top: 30px solid #f5f7f9; } [data-component="InvestmentMainSlot3"] .c-sheet { box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } [data-component="InvestmentMainSlot3"] .c-sheet:only-child { flex: 1 0 0; } [data-component="InvestmentMainSlot3"] .c-sheet *, [data-component="InvestmentMainSlot3"] .c-sheet *::before, [data-component="InvestmentMainSlot3"] .c-sheet *::after { box-sizing: inherit; } [data-component="InvestmentMainSlot3"] .tabs { display: flex; align-items: center; padding-right: 0; padding-left: 0; border-bottom: 2px solid #c9c9c9; } [data-component="InvestmentMainSlot3"] .tabs .each { padding-right: 0; padding-bottom: 30px; padding-left: 0; } [data-component="InvestmentMainSlot3"] .tabs .each:not(:first-child) { margin-left: 72px; } [data-component="InvestmentMainSlot3"] .tabs .each.active, [data-component="InvestmentMainSlot3"] .tabs .each.on { margin-bottom: -2px; padding-bottom: 26px; border-bottom: 4px solid #ff8300; font-weight: 700; font-size: 36px; } [data-component="InvestmentMainSlot3"] .tabs .each { color: #474747; font-size: 36px; } [data-component="InvestmentMainSlot3"] .tabs .each.active, [data-component="InvestmentMainSlot3"] .tabs .each.on { color: #f58220; } [data-component="InvestmentMainSlot3"] .tabs .each:hover { font-weight: 700; color: #f58220 !important; } [data-component="InvestmentMainSlot3"] .products { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: 1fr; gap: max(24px, .625vw); grid-auto-flow: column; } [data-component="InvestmentMainSlot3"] .products>.each:nth-child(1) { grid-column-start: 1; } [data-component="InvestmentMainSlot3"] .products>.each:nth-child(2) { grid-column-start: 2; } [data-component="InvestmentMainSlot3"] .products>.each:nth-child(3) { grid-column-start: 3; } [data-component="InvestmentMainSlot3"] .products>.each:nth-child(4) { grid-column-start: 4; } [data-component="InvestmentMainSlot3"] .products>.each .header { display: flex; justify-content: space-between; } [data-component="InvestmentMainSlot3"] .products .rank { color: #000; font-weight: 700; font-size: 24px; line-height: 1.4; } [data-component="InvestmentMainSlot3"] .products .title { min-height: 5.625rem; margin: 28px 0 6px; color: #043b72; font-weight: 700; font-size: 32px; line-height: 1.4; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } [data-component="InvestmentMainSlot3"] .products .code { color: #043b72; font-size: 14px; line-height: 1.4; } [data-component="InvestmentMainSlot3"] .products .type { display: flex; flex-wrap: wrap; align-items: flex-start; margin-bottom: 28px; margin-left: -10px; } [data-component="InvestmentMainSlot3"] .products .type span { position: relative; margin: 0 10px; color: #949494; font-size: 14px; line-height: 1.4; } [data-component="InvestmentMainSlot3"] .products .type span + span, [data-component="InvestmentMainSlot3"] .products .type span.has-divider, [data-component="InvestmentMainSlot3"] .products .type div[id^="cateTitle_"]:not(:empty) ~ span { margin-left: 11px; } [data-component="InvestmentMainSlot3"] .products .type span + span::before, [data-component="InvestmentMainSlot3"] .products .type span.has-divider::before, [data-component="InvestmentMainSlot3"] .products .type div[id^="cateTitle_"]:not(:empty) ~ span::before { position: absolute; top: 50%; left: -11px; height: 12px; margin-top: -6px; border-left: 1px solid #c9c9c9; content: ''; } [data-component="InvestmentMainSlot3"] .products .graph { margin: 8px 0 30px; } [data-component="InvestmentMainSlot3"] .calculation .this-label { color: #949494; font-size: 12px; line-height: 1.4; } [data-component="InvestmentMainSlot3"] .calculation .val { display: flex; align-items: flex-end; } [data-component="InvestmentMainSlot3"] .calculation .val.increased span { color: #d93b3b; } [data-component="InvestmentMainSlot3"] .calculation .val.decreased span { color: #245dab; } [data-component="InvestmentMainSlot3"] .calculation .val .number { font-weight: 500; font-size: 38px; line-height: 1.4; } [data-component="InvestmentMainSlot3"] .calculation .val .unit { position: relative; top: -7px; font-weight: 700; font-size: 24px; } [data-component="InvestmentMainSlot3"] .prices { display: flex; margin-top: 30px; } [data-component="InvestmentMainSlot3"] .prices>div { flex: 0 0 50%; } [data-component="InvestmentMainSlot3"] .prices .this-label { display: block; color: #949494; font-size: 14px; line-height: 1.4; } [data-component="InvestmentMainSlot3"] .prices .val { color: #000; font-size: 14px; line-height: 1.4; } [data-component="InvestmentMainSlot3"] .bookmark { position: relative; width: 17px; height: 22px; } [data-component="InvestmentMainSlot3"] .bookmark::before { position: absolute; top: 0; left: 0; width: 17px; height: 22px; background: url('/tigeretf/common_kr/pc/images/icon/bookmark_default.svg') no-repeat center; background-size: 100% auto; content: ''; } [data-component="InvestmentMainSlot3"] .bookmark.active::before, [data-component="InvestmentMainSlot3"] .bookmark.actived::before { background-image: url('/tigeretf/common_kr/pc/images/icon/bookmark_active.svg') } [data-component="InvestmentMainSlot3"] .bookmark .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } [data-component="InvestmentMainSlot3"] .c-list-handler { display: flex; justify-content: space-between; align-items: center; margin: 80px 0 60px; } [data-component="InvestmentMainSlot3"] .c-list-handler .filter { display: flex; align-items: center; } [data-component="InvestmentMainSlot3"] .c-list-handler .filter .prefix, [data-component="InvestmentMainSlot3"] .c-list-handler .filter .content { font-weight: 700; font-size: 32px; line-height: 45px; white-space: nowrap; } [data-component="InvestmentMainSlot3"] .c-list-handler .form { position: relative; width: 136px; height: 47px; margin: -1px 12px -1px 23px; } .sec3 .tit li .cust-select p span { position: absolute; top: 50%; right: 13px; width: 24px; height: 25px; margin-top: -12.5px; background: url('/tigeretf/common_kr/pc/images/icon/select_filter_caret_down_temp.svg') no-repeat center; background-size: 100% auto; content: ''; } [data-component="InvestmentMainSlot3"] .c-list-handler .form select { width: 100%; height: 45px; padding: 7px 13px; } [data-component="InvestmentMainSlot3"] .criteria { position: relative; padding-left: 22px; color: #757575; font-weight: 400; font-size: 15px; line-height: 1.4; } [data-component="InvestmentMainSlot3"] .criteria::before { position: absolute; top: 50%; left: 0; width: 18px; height: 18px; margin-top: -9px; background: url('/tigeretf/common_kr/pc/images/icon/indicator-criteria.svg') no-repeat center; background-size: 100% auto; content: ''; } [data-component="InvestmentMainSlot3"] .c-sheet .closer { margin: 50px 0 120px; } [data-component="InvestmentMainSlot3"] .shortcut { display: flex; justify-content: center; } [data-component="InvestmentMainSlot3"] .shortcut .link { position: relative; padding: 1px 26px 1px 0; color: #5e5e5e; font-size: 16px; line-height: 1.375; } [data-component="InvestmentMainSlot3"] .shortcut .link::after { position: absolute; top: 50%; right: 0; width: 24px; height: 24px; margin-top: -12px; background: url('/tigeretf/common_kr/pc/images/icon/shortcut_caret_right_temp.svg') no-repeat right center; background-size: auto 100%; content: ''; } .sec3 .con div.card div .products a { padding: 0; border-radius: 0; border-width: 0; background-color: transparent; } .sec3 .con div.card div .products a::after { content: none; } .sec3 .con div.card div .products>.each>a { padding: 50px 30px 52px; height: 520px; border: 1px solid #c9c9c9; } .sec3 .con div.card div .products>.each>a:hover { border: 1px solid #f58220; } .btn-item-like::before, .btn-item-like::after { content: none; } .sec3 .con div.card .option-con.on { transform: none; } .sec3 .con div.card.on { display: block !important; width: 100%; } .sec3 .con div.card .option-con.on { display: grid !important; } .main-tab { border-width: 0; border-radius: 0; } .main-tab a { border-radius: 0; font-weight: 400; } .main-tab span { bottom: 0; border-radius: 0; background-color: transparent; } .main-tab a.on { color: #f58220 !important; } .sec3 .tit { width: auto; height: 185px; margin: 0; } .sec3 .tit li .cust-select { width: 100%; transform: none; height: 47px; border-radius: 0; border: 1px solid #d2dcf3; background-color: #ffdcc6; vertical-align: top; } .sec3 .tit li .cust-select div { margin: 0 -1px; border-radius: 10px; border-top-left-radius: 0; border-top-right-radius: 0; border: 1px solid #d2dcf3; border-top-width: 0; background-color: #ffdcc6; } .main-pop-data .swiper-slide>a { height: 100%; } #dBody[data-ui-corporate="v1.0"] { padding-top: 230px; } #contents.only-main { padding-top: 0; } .sec3 { padding-bottom: 0; } .sec3 .tit li:last-child { top: 0; } .sec3 .con { min-height: 714px; } .sec3 .con div .link { position: relative; left: auto; width: auto; transform: none; } div[id^="cateTitle_"] { margin-top: -3px; } @media screen and (max-width:1180px) { [data-component="InvestmentMainSlot3"] .products .title { font-size: 25px; margin-top: 0; min-height: 4.625rem; } [data-component="InvestmentMainSlot3"] .products .type span { margin: 0 5px; font-size: 12px; } div[id^="cateTitle_"] { margin-top: -5px; } [data-component="InvestmentMainSlot3"] .products .type span + span, [data-component="InvestmentMainSlot3"] .products .type span.has-divider, [data-component="InvestmentMainSlot3"] .products .type div[id^="cateTitle_"]:not(:empty) ~ span { margin-left: 8px; } [data-component="InvestmentMainSlot3"] .products .type span + span::before, [data-component="InvestmentMainSlot3"] .products .type span.has-divider::before, [data-component="InvestmentMainSlot3"] .products .type div[id^="cateTitle_"]:not(:empty) ~ span::before { left: -7px; } [data-component="InvestmentMainSlot3"] .c-list-handler .filter .prefix, [data-component="InvestmentMainSlot3"] .c-list-handler .filter .content { font-size: 25px; } [data-component="InvestmentMainSlot3"] .c-list-handler .form { margin-left: 5px; } .sec3 .tit li .cust-select { font-size: 20px; } [data-component="InvestmentMainSlot3"] .calculation .val .number { font-size: 30px; } [data-component="InvestmentMainSlot3"] .calculation .val .unit { font-size: 20px; } .sec3 .con div.card div .products>.each>a { height: 490px; } } /* //메인*/ [data-component="Footer"] .footer-wrap { padding-bottom: 30px; border-top-width: 0; background-color: transparent; } [data-component="Footer"] .footer-info-date { padding-bottom: 0; border-bottom-width: 0; color: #757575; font-weight: 400; font-size: 1rem; line-height: 1.625rem; } [data-component="Footer"] .footer-menu { margin-top: 60px; } [data-component="Footer"] .footer-menu .each a { color: #2e2e2e; font-weight: 500; } [data-component="Footer"] .footer-menu .privacy-policy a:link, [data-component="Footer"] .footer-menu .privacy-policy a:visited { color: #000; font-weight: 700; } [data-component="Footer"] .footer-menu-list>li:nth-of-type(2)>a { color: #2e2e2e; font-weight: 500; } [data-component="Footer"] .footer-family-site { position: relative; right: auto; bottom: auto; width: 247px; height: 52px; margin: 4px 0; border: 1px solid #c9c9c9; } [data-component="Footer"] .footer-family-site>a { display: block; height: 100%; padding: 12px 47px 12px 20px; } [data-component="Footer"] .footer-family-site>a::after { top: 50%; right: 20px; margin-top: -8px; } [data-component="Footer"] .footer-family-site div { bottom: 52px; width: 246px; padding: 30px 21px; } [data-component="Footer"].c-section { position: relative; background-color: #fafafa; } [data-component="Footer"] .c-sheet { box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } [data-component="Footer"] .c-sheet *, [data-component="Footer"] .c-sheet *::before, [data-component="Footer"] .c-sheet *::after { box-sizing: inherit; } [data-component="Footer"] .c-sheet>.c-card:only-child { flex: 1 0 0; } [data-component="Footer"] .footer-address { display: flex; gap: 0 0.75em; margin-top: 0; color: #757575; font-size: 0.875rem; font-weight: 500; line-height: 1.57143; } [data-component="Footer"] .footer-global { position: static; } [data-component="Footer"] .related-channel { display: flex; align-items: center; gap: 0 30px; padding: 0 30px; } [data-component="Footer"] .related-channel .each { width: 24px; height: 24px; } [data-component="Footer"] .related-channel .each a { position: relative; display: block; height: 100%; } [data-component="Footer"] .related-channel .each a::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: no-repeat center; background-size: 100% auto; content: ''; } [data-component="Footer"] .related-channel .each .val { position: absolute; overflow: hidden; display: block; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; clip: rect(0, 0, 0, 0); white-space: nowrap; } [data-component="Footer"] .related-channel .facebook a::before { background-image: url('../../../common/images/footer_related-channel_facebook.svg'); } [data-component="Footer"] .related-channel .instagram a::before { background-image: url('../../../common/images/footer_related-channel_instagram.svg'); } [data-component="Footer"] .related-channel .blog a::before { background-image: url('../../../common/images/footer_related-channel_blog.svg'); } [data-component="Footer"] .related-channel .youtube a::before { background-image: url('../../../common/images/footer_related-channel_youtube.svg'); } [data-component="Footer"] .select-language { position: relative; margin-left: 1px; padding: 0 30px; } [data-component="Footer"] .select-language::before { position: absolute; top: 50%; left: -1px; display: block; height: 20px; margin-top: -10px; border-left: 1px solid #c9c9c9; content: ''; } [data-component="Footer"] .select-language a { position: relative; display: block; width: 27px; height: 28px; } [data-component="Footer"] .select-language a::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../../../common/images/footer_select-language.svg') no-repeat center; background-size: 100% auto; content: ''; } [data-component="Footer"] .select-language a .val { position: absolute; overflow: hidden; display: block; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; clip: rect(0, 0, 0, 0); white-space: nowrap; } #sticky-notice { position: relative; z-index: 1095; background-color: #000; } #sticky-notice:not(.main) { position: fixed; top: 0; } #sticky-notice .c-sheet { display: flex; justify-content: space-between; align-items: center; max-width: 1490px; margin: 0 auto; height: 49px; } #sticky-notice .content { flex: 1 0 0; display: flex; justify-content: flex-start; align-items: center; gap: 0 10px; color: #fff; } #sticky-notice .title { color: #fff; font-weight: 700; font-size: 18px; line-height: 24px; vertical-align: middle; } #sticky-notice .registered { color: #fff; font-size: 16px; line-height: 24px; opacity: 0.5; } #sticky-notice .close { position: relative; width: 24px; height: 24px; color: #fff; } #sticky-notice .close::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/sticky-banner_close_temp.svg') no-repeat center; background-size: 100% auto; content: ''; } #sticky-notice .close .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } #sticky-notice+#dHead h1 { top: 142px; } #sticky-notice+#dHead #gnb { top: 65px; } .read-table[data-ui-corporate="v1.0"] table>thead { border-color: #193d71; } .read-table[data-ui-corporate="v1.0"] table>tbody { border-color: #d5d8e1; } .read-table[data-ui-corporate="v1.0"] table>tbody>tr { border-color: #d5d8e1; } #contents { max-width: 1490px; } .wide-container, #contents.small-container { max-width: 1490px; } .shortcut-to-dps { width: 180px; min-width: 180px; height: 46px; text-align: center; background-color: #f58220; font-size: 20px; border-radius: 2px; font-style: normal; font-weight: 700; line-height: normal; letter-spacing: -0.6px; display: flex; align-items: center; justify-content: center; } .shortcut-to-dps:link, .shortcut-to-dps:visited { color: #fff; } .shortcut-to-dps:hover, .shortcut-to-dps:active { color: #fff; } .page-title { color: var(--corp-color-secondary); font-weight: 700; font-size: 3.375rem; line-height: 1.203704; } .board-search-wrap:not(.ggg) { position: relative; width: auto; margin: 5rem 0 0; } .board-search-wrap:not(.ggg) input { height: 56px; font-size: 18px; font-weight: 400; padding: 0 10px; } .board-search-wrap:not(.ggg) .form-input-item { border-bottom-width: 0; } .board-search-wrap:not(.ggg) .form-input-item::after { width: 100%; height: 4px; content: none; } .board-search-wrap:not(.ggg) { display: flex; } .board-search-wrap:not(.ggg) .form-input-item { flex: 1 0 0; height: 3.75rem; border-radius: 2.1875rem; background: #1C3E70; transition: all 0.5s ease; } .board-search-wrap:not(.ggg) .btnDel { display: none; width: 20px; height: 20px; font-size: 0; line-height: 0; text-indent: -99999em; background: url(../images/icon/search-local_delete-value.png) no-repeat center center / 15px 15px; } .board-search-wrap:not(.ggg) .methods { flex: 0 0 3.75rem; margin-left: 0.625rem; width: 3.75rem; height: 3.75rem; background: url(../images/icon/search-local_filter_open.png) no-repeat center center; } .board-search-wrap:not(.ggg) .form-input-item .form-input { width: calc(100% - 105px); height: 100%; margin: 0 0 0 1.875rem; padding: 0 1.5rem 0 0; background: transparent; border: 0; color: #fff; font-size: 1.25rem; line-height: 2rem; outline: 0; } .board-search-wrap:not(.ggg) .form-input-item .form-input::placeholder { color: rgba(255, 255, 255, 0.5) !important; font-weight: 500; } .board-search-wrap:not(.ggg) .btn-form { background-image: url(../images/icon/search-local_submit.png) } .board-search-wrap:not(.ggg) .icon-category-orange-36 { width: 3.75rem; height: 3.75rem; background-image: none; } .board-list-total .font-color-orange { color: inherit; } /* 공통 게시판형 리스트 */ .board-content-list .c-section { position: relative; margin-top: 60px; } .board-content-list .c-section:first-of-type { margin-top: 0; } .board-content-list .c-sheet { box-sizing: border-box; max-width: 1522px; padding: 0 16px; margin: 0 -16px; } /* 리스트에서는 margin: 0 -16px; padding: 0 16px; 뷰에서는 padding: 0 16px; margin: 0 auto; */ .board-content-list .c-sheet *, .board-content-list .c-sheet *::before, .board-content-list .c-sheet *::after { box-sizing: inherit; } /*.board-content-list .c-section:first-of-type {margin-top: 0px;}*/ .board-content-list .c-card[data-type="movie-clip"] { display: flex; flex-wrap: wrap; align-items: center; } .board-content-list .c-card[data-type="movie-clip"] .title { display: -webkit-box; height: 3.5rem; max-height: 3.5rem; font-size: 1.25rem; line-height: 1.75rem; font-weight: 500; color: #000; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .board-content-list .c-card[data-type="movie-clip"] .c-card-prefix { flex: 0 0 100%; margin-bottom: 0.375rem; } .board-content-list .c-card[data-type="movie-clip"] .c-card-header { flex: 0 0 100%; margin-bottom: 0.625rem; } .board-content-list .c-card[data-type="movie-clip"] .c-card-content { flex: 1 0 auto; display: flex; gap: 0 6px; } .board-content-list .c-card[data-type="movie-clip"] .c-card-methods { flex: 0 0 34px; } .board-content-list .c-card[data-type="movie-clip"] .figure { margin-bottom: 1.25rem; } .board-content-list .c-card[data-type="movie-clip"] .figure > div { position: relative; padding-bottom: 56.25%; border-radius: 1.5rem; overflow: hidden; } .board-content-list .c-card[data-type="movie-clip"] .hashtags { color: #6F7685; font-size: 1rem; font-weight: 500; line-height: 1.375; } .board-content-list .c-card[data-type="movie-clip"] .channel { color: #f58220; font-weight: 500; font-size: 0.875rem; } .board-content-list .c-card[data-type="movie-clip"] .registered { color: #949494; font-weight: 500; font-size: 0.875rem; } .board-content-list .c-card[data-type="movie-clip"] { flex-direction: column; align-items: flex-start; justify-content: space-between; height: 100%; } .board-content-list .c-card[data-type="movie-clip"] .c-card-prefix { flex: none; width: 100%; } .board-content-list .c-card[data-type="movie-clip"] .hashtags { margin-bottom: 0.375rem; } .board-content-list .c-card[data-type="movie-clip"] .figure > div { width: 100%; } .board-content-list .c-card[data-type="movie-clip"] .figure img { position: absolute; top: 50%; left: 50%; width: 100%; height: auto; transform: translate(-50%, -50%); } .board-content-list .c-card[data-type="movie-clip"] .c-card-header { flex: 0 0 auto; margin-bottom: 0.625rem; } .board-content-list .c-card[data-type="movie-clip"] .c-card-footer { display: flex; align-items: center; justify-content: space-between; width: 100%; } /* 공통 게시판형 view */ /*뷰에서는 padding: 0 16px; margin: 0 auto;*/ .board-content-list.view .c-sheet {margin: 0 auto;} .board-content-list.view .c-section {--Digital-Orange: #e37500;} .board-content-list.view .c-section:first-of-type { margin-top: 60px; } .board-content-list.view .board-view-wrap .board-view-top { display: flex; justify-content: space-between; align-items: center; padding: 1.5rem 0; border-top: 1px solid #1c3e70; border-bottom-color: #e0e0e0; } .board-content-list.view .board-view-wrap .board-view-option { gap: 0 1.3125rem; margin-top: 0; color: #949494; font-size: 1.25rem; line-height: 1.1; } .board-content-list.view .board-view-subject{flex: 1;} .board-content-list.view .board-view-data { color: #000; font-size: 1rem; } .board-content-list.view .btn-page-wrap { display: flex; justify-content: space-between; min-height: auto; } .board-content-list.view .btn-page-wrap .c-button:only-child { margin-left: auto; } .board-content-list.view .c-button.for.page-nav { min-width: 6.125rem; padding: 0.8125rem; border: 1px solid #c3cad6; border-radius: 0.3125rem; color: #595e6b; font-weight: 700; font-size: 0.875rem; line-height: 1.285714; text-align: center; } .board-content-list.view .btn-page-wrap .hashtags { display: flex; align-items: center; gap: 0 4px; } .board-content-list.view .btn-page-wrap .hashtags > .each { padding: 4px 10px; border: 1px solid #ffb380; border-radius: 10px; background-color: #fffbf7; color: #f58220; font-weight: 500; font-size: 1rem; line-height: 1.625; } .board-content-list.view .prefix { display: flex; gap: 0 0.5rem; margin-bottom: 1.5rem; } .board-content-list.view .prefix .status { padding: 4px 10px; border-radius: 10px; color: #fff; font-weight: 500; font-size: 1rem; line-height: 1.625; } .board-content-list.view .prefix .status.ongoing { background-color: #f58220; } .board-content-list.view .prefix .status.closed { background-color: #1a1a1a; } .board-content-list.view .c-pair-group { color: #2B2F36; font-size: 0.875rem; font-weight: 500; line-height: normal; } .board-content-list.view .c-pair:not(:first-child) { margin-top: 0.375rem; } .board-content-list.view .c-pair { display: flex; } .board-content-list.view .c-pair .key { position: relative; margin-right: 10px; padding-right: 10px; } .board-content-list.view .c-pair .key::after { position: absolute; top: 50%; right: 0; height: 12px; margin-top: -6px; border-right: 1px solid #2b2f36; content: ''; } .board-content-list.view .c-data-attachments { margin-bottom: 0; } .board-content-list.view .bookmark.active::before { background-image: url('/tigeretf/common_kr/pc/images/icon/bookmark_content_active.svg') } /* // 공통 게시판형 view */ /* .BMCEventList 이벤트 */ .BMCEventList .c-card[data-type="event"] { display: flex; flex-wrap: wrap; align-items: center; } .BMCEventList .c-card[data-type="event"] .title { display: -webkit-box; height: 3.5rem; max-height: 3.5rem; font-size: 1.25rem; line-height: 1.75rem; font-weight: 500; color: #000; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .BMCEventList .c-card[data-type="event"] .status { position: absolute; top: 0.75rem; left: 0.75rem; padding: 4px 10px; border-radius: 10px; background-color: #f58220; color: #fff; font-weight: 500; font-size: 1rem; line-height: 1.625; } .BMCEventList .c-card[data-type="event"] .c-card-prefix { position: relative; flex: 0 0 100%; margin-bottom: 1.25rem; border-radius: 1.5rem; overflow: hidden; } .BMCEventList .c-card[data-type="event"] .c-card-header { flex: 0 0 100%; margin-bottom: 1.25rem; } .BMCEventList .c-card[data-type="event"] .c-card-content { flex: 1 0 auto; } .BMCEventList .c-card[data-type="event"] .figure { } .BMCEventList .c-card[data-type="event"] .figure > div { position: relative; aspect-ratio: 16/9; } .BMCEventList .c-card[data-type="event"] .figure > figcaption { position: absolute; font-size: 0; } .BMCEventList .c-card[data-type="event"] .figure img { position: absolute; top: 0; left: 0; width: 100%; height: auto; } .BMCEventList .c-card[data-type="event"] .c-pair-group { color: #2B2F36; font-size: 0.875rem; font-weight: 500; line-height: normal; } .BMCEventList .c-card[data-type="event"] .c-pair:not(:first-child) { margin-top: 0.375rem; } .BMCEventList .c-card[data-type="event"] .c-pair { display: flex; } .BMCEventList .c-card[data-type="event"] .c-pair .key { position: relative; margin-right: 10px; padding-right: 10px; } .BMCEventList .c-card[data-type="event"] .c-pair .key::after { position: absolute; top: 50%; right: 0; height: 12px; margin-top: -6px; border-right: 1px solid #2b2f36; content: ''; } .BMCEventList .c-card[data-type="event"] .c-pair .value { } .BMCEventList .c-card[data-type="event"].at.closed .status { background-color: #1a1a1a; } .BMCEventList .c-card[data-type="event"].at.closed .c-card-prefix::before { position: absolute; inset: 0; background-color: rgba(0, 0, 0, 0.60); } .BMCEventList .c-card[data-type="event"].at.closed .notice { position: absolute; inset: 0; display: flex; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.60); color: #fff; font-weight: 500; font-size: 1rem; line-height: 1.625; } .BMCEventList .c-card[data-type="event"] .hashtags { color: #6F7685; font-size: 1rem; font-weight: 500; line-height: 1.375; } .BMCEventList .c-card[data-type="event"] .channel { color: #f58220; font-weight: 500; font-size: 0.875rem; } .BMCEventList .c-card[data-type="event"] .registered { color: #949494; font-weight: 500; font-size: 0.875rem; } /* .BMCEventView 이벤트 */ .BMCEventView.board-content-list.view .board-view-wrap[data-ui-corporate="v1.0"] .board-view-top { display: block; padding: 1.875rem 0; } /* .IMCIntrcnView ETF 인사이트*/ .IMCIntrcnView .btn-page-wrap[data-ui-corporate="v1.0"] { display: flex; justify-content: space-between; min-height: auto; margin-top: 3.75rem; } .IMCIntrcnView .c-button.for.article-origin { height: 3.125rem; padding: 0.8125rem 5.3125rem 0.8125rem 1.4375rem; border-radius: 1.625rem; border: 1px solid var(--Digital-Orange); font-size: 1rem; line-height: 1.5; white-space: nowrap; } .IMCIntrcnView .channel { color: #f58220; font-size: 1.25rem; font-weight: 500; line-height: 1.1; } /* .IMDNewsList ETF 뉴스 */ .IMDNewsList .c-card[data-type="article"] { display: flex; flex-wrap: wrap; align-items: center; padding: 2.5625rem; border: 1px solid #c9c9c9; border-radius: 0.3125rem; } .IMDNewsList .c-card[data-type="article"]:hover { border-color: #f58220; background-color: #f58220; } .IMDNewsList .c-card[data-type="article"]:hover .title, .IMDNewsList .c-card[data-type="article"]:hover .channel, .IMDNewsList .c-card[data-type="article"]:hover .registered { color: #fff; } .IMDNewsList .c-card[data-type="article"]:hover .bookmark::before { background: url('/tigeretf/common_kr/pc/images/icon/bookmark_content_hover.svg'); } .IMDNewsList .c-card[data-type="article"] .title { display: -webkit-box; height: 6.1875rem; max-height: 6.1875rem; font-size: 1.5rem; line-height: 2.0625rem; font-weight: 500; color: #000; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .IMDNewsList .c-card[data-type="article"] .c-card-prefix { order: -3; flex: 1 0 auto; } .IMDNewsList .c-card[data-type="article"] .c-card-header { flex: 0 0 100%; margin: 2.5rem 0 1.25rem; } .IMDNewsList .c-card[data-type="article"] .c-card-content { flex: 1 0 auto; width:100%;} .IMDNewsList .c-card[data-type="article"] .c-card-methods { position: relative; right: -1.1875rem; order: -1; flex: 0 0 34px; } .IMDNewsList .c-card[data-type="article"] .hashtags { color: #f58220; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .IMDNewsList .c-card[data-type="article"] .hashtags > .each { color: #f58220; font-size: 1rem; font-weight: 500; line-height: 1.375; } .IMDNewsList .c-card[data-type="article"]:hover .hashtags > .each { color: #fff; } .IMDNewsList .c-card[data-type="article"] .channel { color: #f58220; font-weight: 700; font-size: 1.25rem; } .IMDNewsList .c-card[data-type="article"] .registered { margin: 2.5rem 0 -1.25rem; padding: 1.9375rem 0 1.875rem; border-top: 1px solid #e0e0e0; color: #949494; font-weight: 500; font-size: 1.25rem; } /* .IMDNewsView */ .board-content-list.view .btn-page-wrap.btn-page-link { display: flex; justify-content: center; min-height: auto; } .IMDNewsView .btn-page-wrap[data-ui-corporate="v1.0"] {margin-top: 3.75rem; } .IMDNewsView .c-button.for.article-origin { height: 3.125rem; padding: 0.8125rem 5.3125rem 0.8125rem 1.4375rem; border-radius: 1.625rem; border: 1px solid var(--Digital-Orange); font-size: 1rem; line-height: 1.5; white-space: nowrap;} .IMDNewsView.board-content-list.view .btn-page-wrap .c-button:only-child{margin-left: 0} .IMDNewsView .channel { color: #f58220; font-size: 1.25rem; font-weight: 500; line-height: 1.1; } /* .IMHFactSheetList TIGER 월간리포트 */ .IMHFactSheetList .c-card[data-type="article"] { display: flex; flex-wrap: wrap; align-items: center; padding: 2.4375rem 2.4375rem 3rem; border: 1px solid #c9c9c9; border-radius: 0.3125rem; } .IMHFactSheetList .c-card[data-type="article"]:hover { border-color: #f58220; background-color: #f58220; } .IMHFactSheetList .c-card[data-type="article"]:hover .title, .IMHFactSheetList .c-card[data-type="article"]:hover .channel, .IMHFactSheetList .c-card[data-type="article"]:hover .registered { color: #fff; } .IMHFactSheetList .c-card[data-type="article"]:hover .bookmark::before { background: url('/tigeretf/common_kr/pc/images/icon/bookmark_content_hover.svg'); } .IMHFactSheetList .c-card[data-type="article"]:hover .c-card-methods::before { background-image: url('/tigeretf/common_kr/pc/images/icon/34x34_download-document_active.svg'); } .IMHFactSheetList .c-card[data-type="article"] .title { display: -webkit-box; height: 4.25rem; max-height: 4.25rem; font-size: 1.5rem; line-height: 2.0625rem; font-weight: 500; color: #000; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .IMHFactSheetList .c-card[data-type="article"] .c-card-header { flex: 0 0 100%; margin: 2.5rem 0 0; } .IMHFactSheetList .c-card[data-type="article"] .c-card-content { order: -2; flex: 1 0 auto; padding: 0.375rem 0; } .IMHFactSheetList .c-card[data-type="article"] .c-card-methods { position: relative; right: -0.5625rem; order: -1; flex: 0 0 34px; display: flex; align-items: center; } .IMHFactSheetList .c-card[data-type="article"] .c-card-methods::before { width: 34px; height: 34px; background: url('/tigeretf/common_kr/pc/images/icon/34x34_download-document_default.svg') no-repeat center; background-size: 100% auto; content: ''; } .IMHFactSheetList .c-card[data-type="article"] .registered { color: #f58220; font-weight: 500; font-size: 1.25rem; line-height: 1.1; } .IMHFactSheetList .bookmark.active::before { background-image: url('/tigeretf/common_kr/pc/images/icon/bookmark_content_active.svg') } /* .PMBChooseList ETF 고르기 */ .PMBChooseList .temperature { display: flex; justify-content: space-around; height: 48px; padding: 11px 0; border-radius: 24px; background: linear-gradient(270deg, #D93B3B 0%, #E37500 49.61%, #145BB3 100%); } .PMBChooseList .temperature .each { color: #fff; font-size: 1rem; font-weight: 700; line-height: 1.625; letter-spacing: -0.32px; } .PMBChooseList .details { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 30px; margin-top: 40px; } .PMBChooseList .details > .each { border-radius: 12px; border: 1px solid #e0e0e0; background-color: #fff; overflow: hidden; } .PMBChooseList .details h4 { padding: 30px; background-color: #fafafa; text-transform: uppercase; font-size: 1.5rem; font-weight: 700; line-height: 1.33333; text-align: center; } .PMBChooseList .details .comfort h4 { color: #145bb3; } .PMBChooseList .details .warm h4 { color: #f58220; } .PMBChooseList .details .hot h4 { color: #d93b3b; } .PMBChooseList .details .hot h4 { color: #d93b3b; } .PMBChooseList .details .chart { padding: 9px; } .PMBChooseList .details .chart table { width: 100%; } .PMBChooseList .details .chart th { padding: 3px; vertical-align: middle; color: #fff; } .PMBChooseList .details .chart td { padding: 3px; color: #1a1a1a; } .PMBChooseList .details .chart div { display: flex; justify-content: center; align-items: center; border-radius: 2px; } .PMBChooseList .details .stock th div { background-color: #f58320; } .PMBChooseList .details .stock td div { background-color: #fef6ee; } .PMBChooseList .details .safe th div { background-color: #043b72; } .PMBChooseList .details .safe td div { background-color: #ebf1ff; } .PMBChooseList .tem-txt-area > div { border-color: #e0e0e0; } .PMBChooseList .tem-txt-area > div p { font-weight: 500; } /* .PGBDetailIndexPop */ body:has(.PGBDetailIndexPop) #site-switch { margin-top: 0; } body:has(.PGBDetailIndexPop) #app-header { margin-top: 0; } #dBody[data-ui-corporate="v1.0"]:has(.PGBDetailIndexPop) { padding-top: 0; } body:has(.PGBDetailIndexPop) [data-component="TigerEtfStaticHeader"] .methods { margin-bottom: 0; } #contents.PGBDetailIndexPop { position: relative; max-width: none; margin-top: 0; } body:has(.PGBDetailIndexPop) .location-wrap { display: none; } .PGBDetailIndexPop .read-table table > thead { border-top-width: 0; } .PGBDetailIndexPop .read-table table > thead > tr > th, .PGBDetailIndexPop .read-table table > tbody > tr > td { background-color: transparent; } .PGBDetailIndexPop .read-table table > thead.line-header > tr > th { border-right-color: #d2d7e1; } .PGBDetailIndexPop .form-datepicker-group .form-date:first-child { order: -2; } .PGBDetailIndexPop .form-datepicker-group::after { order: -1; display: block; width: 6px; height: 1px; margin: 0 8px; border-top: 1px solid #2b2f36; content: ''; } .PGBDetailIndexPop .form-datepicker-group .form-date + .form-date { margin-left: 0; padding-left: 0; } .PGBDetailIndexPop .form-datepicker-group .form-date + .form-date::after { content: none; } .PGBDetailIndexPop .form-date { width: 194px; border: 1px solid #eee; border-radius: 4px; background-color: #fff; } .PGBDetailIndexPop .form-date::before { position: absolute; top: 50%; right: 0; width: 36px; height: 36px; margin-top: -18px; background: url('/tigeretf/common_kr/pc/images/icon/36x36_form-input_date.svg') no-repeat center; background-size: 11px 12px; content: ''; } .PGBDetailIndexPop .form-date input.datepicker { padding: 0.625rem 3rem 0.625rem 0.75rem; background-image: none; color: #2b2f36; font-size: 0.75rem; font-weight: 400; line-height: normal; } .PGBDetailIndexPop .sort-group select { width: auto; } .PGBDetailIndexPop .sort-group .btn-data-inquiry { flex-basis: auto; padding: 5px 15px; color: #193d71; font-size: 1rem; line-height: 1.625; border:0; background:transparent;} .PGBDetailIndexPop .sort-group .btn-data-inquiry:hover{background:transparent;} .PGBDetailIndexPop .sort-group .btn-data-inquiry.type-2 {width:80px;border-radius:4px;background-color:#EDEFF3;height:36px;border:1px solid #C3CAD6;font-size:14px;color:#A2AAB8;font-weight:500; } .PGBDetailIndexPop .sort-group .btn-data-inquiry.type-2:hover{background-color:#193D71;color:#fff;} .PGBDetailIndexPop .c-button.for.figured { position: relative; padding: 0.5rem 1.125rem 0.5rem 2.375rem; border-radius: 5px; border: 1px solid #C3CAD6; background: #FFF; color: #193d71; font-weight: 500; font-size: 0.875rem; line-height: 1.285714; } .PGBDetailIndexPop .c-button.for.figured::before { position: absolute; top: 50%; left: 0; width: 36px; height: 36px; margin-top: -18px; background: no-repeat center; content: ''; } .PGBDetailIndexPop .c-button.for.figured[data-type="excel"]::before { background-image: url('/tigeretf/common_kr/pc/images/icon/36x36_document_excel.svg'); background-size: 16px 16px; } .PGBDetailIndexPop .c-button.for.figured[data-type="graph-guide"]::before { background-image: url('/tigeretf/common_kr/pc/images/icon/36x36_graph_guide.svg'); background-size: 18px 18px; } .PGBDetailIndexPop .c-button.for.figured[data-type="dps"]::before { background-image: url('/tigeretf/common_kr/pc/images/icon/36x36_coin-stack_dps.svg'); background-size: 18px 18px; } .PGBDetailIndexPop .c-button.for.figured[data-type="table"]::before { background-image: url('/tigeretf/common_kr/pc/images/icon/36x36_data-view_table.svg'); background-size: 18px 18px; } .PGBDetailIndexPop .c-button.for.figured[data-type="treemap"]::before { background-image: url('/tigeretf/common_kr/pc/images/icon/36x36_data-view_treemap.svg'); background-size: 18px 18px; } .PGBDetailIndexPop .c-sheet { box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } .PGBDetailIndexPop .c-sheet *, .PGBDetailIndexPop .c-sheet *::before, .PGBDetailIndexPop .c-sheet *::after { box-sizing: inherit; } .PGBDetailIndexPop .c-section.as.lead { margin-top: 180px; padding:120px 0; background: linear-gradient(156deg, #1c3e70 26.43%, #192d55 89.95%); } .PGBDetailIndexPop .c-section.as.lead > .c-sheet { position: relative; display: block; } .PGBDetailIndexPop .c-section.as.lead .complex { display: flex; flex-direction: column; color: #fff; } .PGBDetailIndexPop .c-section.as.lead .summary { margin: 3.75rem 0 0; } .PGBDetailIndexPop .c-section.as.lead .methods { order: -3; position: absolute;top: 0;right: 0;} .PGBDetailIndexPop .c-section.as.lead .complex h1{font-size:40px;font-weight:500;} .PGBDetailIndexPop .c-section.as.lead.fixed > .c-sheet { position: fixed; top: 180px; right: 0; left: 0; z-index:6; max-width: none; margin-top: 0; padding: 2.3125rem 0 2.5625rem; } .PGBDetailIndexPop .c-section.as.lead.fixed > .c-sheet::before { position: absolute; inset: 0; border-bottom: 1px solid #F58220; background-color: #fff; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); transition: all 0.3s ease; content: ''; } .PGBDetailIndexPop .c-section.as.lead.fixed > .c-sheet::after { position: absolute; bottom: 100%; left: 0; width: 100%; height: 200%; margin-bottom: -1px; background-color: #fff; content: ''; } .PGBDetailIndexPop .c-section.as.lead.fixed h1 { position: relative; z-index: 1; color: #2b2f36; font-size: 1.5rem; } .PGBDetailIndexPop .c-section.as.lead.fixed .complex { flex-direction: row; flex-wrap: wrap; justify-content: space-between; max-width: 1522px; margin: 0 auto; padding: 0 16px; } .PGBDetailIndexPop .c-section.as.lead.fixed .category { order: -1; flex: 0 0 100%; margin-bottom: 0.4375rem; } .PGBDetailIndexPop .c-section.as.lead.fixed .category span { padding: 0 0.75rem; color: #8c94a3; font-size: 0.875rem; } .PGBDetailIndexPop .c-section.as.lead.fixed .category span:first-child { margin-left: -0.75rem; } .PGBDetailIndexPop .c-section.as.lead.fixed .category span::before { border-left-color: rgba(140, 148, 163, 0.3); } .PGBDetailIndexPop .c-section.as.lead.fixed .methods { order: 0; height: auto; margin-bottom: 0; } .PGBDetailIndexPop .c-section.as.lead.fixed .summary { display: none; } .PGBDetailIndexPop .c-section.as.lead.fixed .view-tab-btns{position:initial;} .PGBDetailIndexPop .summary .flex-box{display: flex;gap: 0 22px;} .PGBDetailIndexPop .c-section .btn-list-more.page-number { background-color: transparent; } html[data-scrolldir="down"]:has(.PGBDetailIndexPop) .c-section.as.lead.fixed > .c-sheet { transform: translateY(-180px); } html[data-scrolldir="up"]:has(.PGBDetailIndexPop) .c-section.as.lead.fixed > .c-sheet { transform: translateY(0); } .PGBDetailIndexPop h1 { font-size: 2.5rem; font-weight: 700; line-height: normal; } .PGBDetailIndexPop h2 { margin: 7.5rem 0 1.25rem; color: #2b2f36; font-size: 1.875rem; font-weight: 700; line-height: normal; } .PGBDetailIndexPop h3 { margin: 3.75rem 0 1rem; color: #2b2f36; font-size: 1.5rem; font-weight: 700; line-height: normal; } .PGBDetailIndexPop .category { order: -1; display: flex; margin-bottom: 1.5rem; } .PGBDetailIndexPop .category span { position: relative; margin-left: -10px; padding: 0 18px; color: #fff; font-weight: 500; font-size: 1.125rem; line-height: normal; letter-spacing: 0; } .PGBDetailIndexPop .category span:not(:first-child) { margin-left: 1px; } .PGBDetailIndexPop .category span:not(:first-child)::before { position: absolute; top: 50%; left: -1px; display: block; height: 14px; margin-top: -7px; border-left: 1px solid #fff; content: ''; opacity: 0.3; } .PGBDetailIndexPop .methods { display: flex; justify-content: flex-end; gap: 0 12px; margin-bottom: 3.75rem; } .PGBDetailIndexPop .methods .each { position: relative; width: 36px; height: 36px; } .PGBDetailIndexPop .methods .each::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: no-repeat center; background-size: 100% auto; content: ''; } .PGBDetailIndexPop .methods .each .val { position: absolute ; overflow: hidden; display: block; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; clip: rect(0, 0, 0, 0); white-space: nowrap; } .PGBDetailIndexPop .methods .share::before { background: url('/tigeretf/common_kr/pc/images/icon/product_share.svg'); } .PGBDetailIndexPop .methods .bookmark::before { background: url('/tigeretf/common_kr/pc/images/icon/product_bookmark.svg'); } .PGBDetailIndexPop .methods .bookmark.actived::before { background: url('/tigeretf/common_kr/pc/images/icon/product_bookmark_actived.svg'); } .PGBDetailIndexPop .lead-main { flex: 1 0 0; display: flex; padding: 32px 30px; gap: 0 1px; border-radius: 10px; background-color: rgba(255, 255, 255, 0.05); } .PGBDetailIndexPop .lead-main > .each { position: relative; padding: 0 1.375rem; } .PGBDetailIndexPop .lead-main > .each:not(:first-child)::before { position: absolute; top: 0; left: -1px; display: block; height: 5.25rem; border-left: 1px solid #000; content: ''; opacity: 0.2; } .PGBDetailIndexPop .lead-main > .each:nth-child(1) { flex: 1 0 auto; padding-left: 0; } .PGBDetailIndexPop .lead-main > .each:nth-child(2) { flex-basis: 25.9506%; } .PGBDetailIndexPop .lead-main > .each:nth-child(3) { flex-basis: 25.9506%; } .PGBDetailIndexPop .lead-main > .each:nth-child(4) { flex-basis: 23.9544%; padding-right: 0; } .PGBDetailIndexPop .lead-main > .each .title { display: flex; gap: 0 5px; margin-bottom: 1rem; color: #bedaff; font-size: 1rem; font-weight: 500; line-height: normal; } .PGBDetailIndexPop .lead-main > .each .desc { display: flex; align-items: baseline; gap: 0 9px; } .PGBDetailIndexPop .lead-main > .each .desc.up {color:#fab280;} .PGBDetailIndexPop .lead-main > .each .desc.down {color:#abcaff;} .PGBDetailIndexPop .lead-main > .each .amount { font-size: 2.25rem; font-weight: 300; line-height: normal; } .PGBDetailIndexPop .lead-main > .each .unit { font-size: 0.875rem; font-weight: 300; line-height: normal; } .PGBDetailIndexPop .lead-main > .each .title.asterisked::after { position: relative; top: -4px; width: 16px; height: 16px; background: url('/tigeretf/common_kr/pc/images/icon/asterisk_in-product-details.svg') no-repeat center; background-size: 8px auto; content: ''; } .PGBDetailIndexPop .lead-main .variation { position: relative; margin-top: 0.9375rem; padding-left: 18px; font-size: 1rem; font-weight: 400; line-height: normal; } .PGBDetailIndexPop .lead-main .variation::before { position: absolute; top: 50%; left: 0; width: 24px; height: 24px; margin-top: -12px; background: no-repeat 0 7px; background-size: 8px auto; content: ''; } .PGBDetailIndexPop .lead-main .variation[data-status="increased"] { color: #fab280; } .PGBDetailIndexPop .lead-main .variation[data-status="increased"]::before { background-image: url('/tigeretf/common_kr/pc/images/icon/product-detail_variation_increased.svg'); } .PGBDetailIndexPop .lead-main .variation[data-status="decreased"] { color: #abcaff; } .PGBDetailIndexPop .lead-main .variation[data-status="decreased"]::before { background-image: url('/tigeretf/common_kr/pc/images/icon/product-detail_variation_decreased.svg'); } .PGBDetailIndexPop .lead-main.composed { margin-bottom: 20px; } .PGBDetailIndexPop .lead-main.composed > .each:nth-child(1) { flex: 1 0 auto; padding-left: 0; } .PGBDetailIndexPop .lead-main.composed > .each:nth-child(2) { flex-basis: 16.9506%; } .PGBDetailIndexPop .lead-main.composed > .each:nth-child(3) { flex-basis: 16.9506%; } .PGBDetailIndexPop .lead-main.composed > .each:nth-child(4) { flex-basis: 16.9506%; } .PGBDetailIndexPop .lead-main.composed > .each:nth-child(5) { flex-basis: 16.9506%; } .PGBDetailIndexPop .lead-main.composed > .each:nth-child(6) { flex-basis: 15.9544%; padding-right: 0; } .PGBDetailIndexPop .lead-main.following-ir { margin-bottom: 20px; } .PGBDetailIndexPop .lead-main.following-ir > .each:nth-child(1) { flex: 1 0 auto; padding-left: 0; } .PGBDetailIndexPop .lead-main.following-ir > .each:nth-child(2) { flex-basis: 19.9506%; } .PGBDetailIndexPop .lead-main.following-ir > .each:nth-child(3) { flex-basis: 19.9506%; } .PGBDetailIndexPop .lead-main.following-ir > .each:nth-child(4) { flex-basis: 19.9506%; } .PGBDetailIndexPop .lead-main.following-ir > .each:nth-child(5) { flex-basis: 18.9544%; padding-right: 0; } .PGBDetailIndexPop .lead-sub { flex: 0 0 356px; } .PGBDetailIndexPop .lead-sub ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; } .PGBDetailIndexPop .lead-sub .each { height: 81px; border-radius: 10px; background-color: #f58220; } .PGBDetailIndexPop .lead-sub .each a { position: relative; display: block; height: 100%; padding: 46px 14px 10px; font-size: 1rem; font-weight: 500; line-height: 1.25; text-align: center; } .PGBDetailIndexPop .lead-sub .each a::before { position: absolute; top: 10px; left: 50%; width: 24px; height: 24px; margin: 1px 0 0 -12px; background: no-repeat 0 center; background-size: 20px auto; content: ''; } .PGBDetailIndexPop .lead-sub .downloads a::before { background-image: url('/tigeretf/common_kr/pc/images/icon/product-detail_related_downloads.svg'); } .PGBDetailIndexPop .lead-sub .link a::before { background-image: url('/tigeretf/common_kr/pc/images/icon/product-detail_related_link.svg'); } .PGBDetailIndexPop .lead-sub .blog a::before { background-image: url('/tigeretf/common_kr/pc/images/icon/product-detail_related_blog.svg'); } .PGBDetailIndexPop .lead-sub .youtube a::before { background-image: url('/tigeretf/common_kr/pc/images/icon/product-detail_related_youtube.svg'); } .PGBDetailIndexPop .lead-sub.replaced ul { grid-template-columns: repeat(4, 1fr); gap: calc(50px / 3); } .PGBDetailIndexPop .lead-sub.replaced .each { height: 4rem; } .PGBDetailIndexPop .lead-sub.replaced .each a { display: flex; justify-content: center; align-items: center; padding: 10px 14px; } .PGBDetailIndexPop .lead-sub.replaced .each a::before { position: static; display: block; margin-right: 10px; } .PGBDetailIndexPop .lead-closer { display: flex; justify-content: space-between; margin-top: 40px; } .PGBDetailIndexPop .lead-closer > div { display: flex; gap: 0 60px; } .PGBDetailIndexPop .lead-closer > div .each { display: flex; gap: 0 16px; } .PGBDetailIndexPop .lead-closer .title { color: #bedaff; font-size: 1rem; line-height: normal; } .PGBDetailIndexPop .lead-closer .desc { color: #fff; font-size: 1rem; line-height: normal; } .PGBDetailIndexPop .lead-closer .help { position: relative; padding-left: calc(2rem + 1px); color: #fff; font-size: 1rem; font-weight: 400; line-height: normal; } .PGBDetailIndexPop .lead-closer .help::before { position: absolute; top: 0; left: 0; content: '※'; } .PGBDetailIndexPop .c-card[data-type="definition"] { display: flex; justify-content: flex-start; align-items: center; gap: 0 22px; margin-top: 1rem; padding: 40px 60px; border-radius: 20px; background-color: #fff; } .PGBDetailIndexPop .c-card[data-type="definition"] .c-card-header { flex: 0 0 170px; color: #1c3e70; font-size: 1.125rem; font-weight: 700; line-height: normal; } .PGBDetailIndexPop .c-card[data-type="definition"] .c-card-content { flex: 1 0 0; } .PGBDetailIndexPop .c-card[data-type="definition"] .c-card-content .txt-bold-type01{color:#f58220;font-size:36px;line-height:45px;font-weight:700;text-align:center;} .PGBDetailIndexPop .c-card[data-type="readme"] { margin: 1rem 1.25rem; font-size: 0.875rem; } .PGBDetailIndexPop .c-card[data-type="readme"] .c-card-header { margin-bottom: 0.5625rem; color: #8c94a3; } .PGBDetailIndexPop .c-card[data-type="readme"] .c-card-content { color: #8c94a3; } .PGBDetailIndexPop .c-card[data-type="readme"] li { position: relative; margin-left: 0.9375rem; line-height: 1.857143; } .PGBDetailIndexPop .c-card[data-type="readme"] li:not(:first-child) { margin-top: 0; } .PGBDetailIndexPop .c-card[data-type="readme"] li::before { position: absolute; top: 11px; left: -0.9375rem; width: 4px; height: 4px; background-color: #8c94a3; border-radius: 50%; content: ''; } .PGBDetailIndexPop .c-data-grid { margin: 1.875rem 0; border-top: 1px solid #193d71; } .PGBDetailIndexPop .c-data-grid table { width: 100%; border-collapse: collapse; } .PGBDetailIndexPop .c-data-grid th { padding: 1.25rem 0.75rem; border-bottom: 1px solid #d2d7e1; color: #2b2f36; font-weight: 700; font-size: 0.875rem; line-height: 1.42857143; text-align: center; } .PGBDetailIndexPop .c-data-grid tbody th { line-height: 1.357143; } .PGBDetailIndexPop .c-data-grid td { padding: 1.25rem 0.75rem; border-bottom: 1px solid #d2d7e1; font-size: 1rem; line-height: 1.1875; text-align: center; } .PGBDetailIndexPop .c-data-grid .increased { color: #d93b3b; } .PGBDetailIndexPop .c-data-grid .decreased { color: #245dab; } .PGBDetailIndexPop .product-info { border-radius: 20px; overflow: hidden; } .PGBDetailIndexPop .product-info .lead { padding: 40px 60px; background-color: #f58220; color: #fff; } .PGBDetailIndexPop .product-info .lead .title { margin-bottom: 1rem; font-weight: 500; font-size: 1.125rem; line-height: normal; } .PGBDetailIndexPop .product-info .lead .value { font-weight: 700; font-size: 2rem; line-height: normal; } .PGBDetailIndexPop .product-info .sub { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0 1px; padding: 30px 0; background-color: #fff; } .PGBDetailIndexPop .product-info .sub .each { position: relative; padding: 16px; text-align: center; } .PGBDetailIndexPop .product-info .sub .each:not(:first-child)::before { position: absolute; display: block; top: 0; left: -1px; height: 108px; border-left: 1px solid #dfe3eb; content: ''; } .PGBDetailIndexPop .product-info .sub .each .title { margin-bottom: 1.25rem; color: #2b2f36; font-weight: 700; font-size: 1.125rem; line-height: normal; } .PGBDetailIndexPop .product-info .sub .each .value { color: #df6d1b; font-size: 2.125rem; font-weight: 700; line-height: normal; letter-spacing: -0.17px; } .PGBDetailIndexPop .product-info .sub .each .value .value-sub-txt{color:#2b2f36;font-size:14px;font-weight:400;vertical-align:bottom;} .PGBDetailIndexPop .temp-resources { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; } .PGBDetailIndexPop .temp-resources > .each { } .PGBDetailIndexPop .temp-resources > .each a { position: relative; display: block; padding: 30px 50px 30px 20px; border-radius: 5px; background-color: #fff; } .PGBDetailIndexPop .temp-resources > .each a:link, .PGBDetailIndexPop .temp-resources > .each a:visited { color: #2b2f36; font-weight: 400; font-size: 1.125rem; line-height: normal; } .PGBDetailIndexPop .temp-resources > .each a::before { position: absolute; top: 50%; right: 20px; width: 24px; height: 24px; margin: -12px 0 0 0; background: no-repeat center; content: ''; } .PGBDetailIndexPop .temp-resources .downloads a::before { background-image: url('/tigeretf/common_kr/pc/images/icon/product-detail_resources_downloads.svg'); background-size: 22px auto; } .PGBDetailIndexPop .temp-resources .link a::before { background-image: url('/tigeretf/common_kr/pc/images/icon/product-detail_resources_link.svg'); background-size: 21px auto; } .PGBDetailIndexPop .temp-focus { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; } .PGBDetailIndexPop .temp-focus a { display: block; } .PGBDetailIndexPop .temp-focus figure div { border-radius: 20px; overflow: hidden; } .PGBDetailIndexPop .temp-focus .title { padding: 16px 20px 13px; } .PGBDetailIndexPop .temp-graph { position: relative; padding-bottom: 46.8498%; background-color: #eee; } .PGBDetailIndexPop .caution .title { margin-bottom: 1.75rem; color: #d93b3b; font-weight: 700; font-size: 1.5rem; line-height: normal; } .PGBDetailIndexPop .caution li { position: relative; margin-left: 0.9375rem; } .PGBDetailIndexPop .caution li:not(:first-child) { margin-top: 0.75rem; } .PGBDetailIndexPop .caution li::before { position: absolute; top: 11px; left: -0.9375rem; width: 5px; height: 5px; background-color: #2b2f36; border-radius: 50%; content: ''; } /* 토스트팝업 */ .PGBDetailIndexPop .new-toast-popup .toast-data-detail { position: relative; } .PGBDetailIndexPop .new-toast-popup .btn-question { position: relative; width: 24px; height: 24px; margin-left: 5px; background:none;} .PGBDetailIndexPop .new-toast-popup .btn-question::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('/tigeretf/common_kr/pc/images/icon/datargid_help_default_temp.svg') no-repeat center; background-size: 16px 16px; content: ''; } .PGBDetailIndexPop .new-toast-popup .btn-question.active::before { background-image: url('/tigeretf/common_kr/pc/images/icon/datargid_help_active_temp.svg'); } .PGBDetailIndexPop .new-toast-popup .toast-pop-inner { z-index: 1; position: absolute; top: 0; left: 1rem; width: 270px; padding: 28px 20px 28px; background: #fff; border: 1px solid #1C3E70; border-radius: 0.1875rem; } .PGBDetailIndexPop .new-toast-popup .toast-pop-inner .pop-body { padding: 0; font-size:14px; font-weight:400;} .PGBDetailIndexPop .new-toast-popup .toast-pop-inner .pop-header { margin-bottom: 20px; padding: 0; font-size:14px; font-weight:700;} .PGBDetailIndexPop .new-toast-popup .toast-pop-inner .btn-toast-close { top: 0.6875rem; right: 0.6875rem; width: 14px; height: 14px; background: none; } .PGBDetailIndexPop .new-toast-popup .toast-pop-inner .btn-toast-close::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('/tigeretf/common_kr/pc/images/icon/tooltip_close_14x14_temp.png') no-repeat center; background-size: 100% auto; content: ''; } .PGBDetailIndexPop .new-toast-popup .toast-pop-inner::after { position: absolute; top: 26px; left: -10px; display: block; width: 10px; height: 10px; background: url('/tigeretf/common_kr/pc/images/icon/bullet_tooltip_pointer.svg') no-repeat center center; content: ''; transform:rotate(-90deg)} /* 투자상품 상세 */ .PGBDetailIndexPop .indicator { z-index: 1; position: absolute; top: 765px; left: calc(50% - 705px); display: flex; flex-direction: column; width: 0px; /*height: calc(100% - 1435px);*/ height: calc(100% - 1577px); background: #d2d7e1; } .PGBDetailIndexPop .indicator > div {position: absolute; top: 0; left: -4px;} .PGBDetailIndexPop .indicator > .fixed {z-index: 1; position: fixed; top: 50%; left: calc(50% - 709px); background-color: transparent;transform:translateY(-50%)} .PGBDetailIndexPop .indicator > .fixed::after { content: ''; display: block; clear: both; position: absolute; top: 0; left: 4px; width: 1px; height: 200px; background-color: #d2d7e1; } .PGBDetailIndexPop .indicator > div > a { z-index: 1; display: block; position: relative; width: 0.5rem; height: 0.5rem; margin: 30px 0 0; background: #d2d7e1; border-radius: 50%; font-size: 0; text-indent: -9999em; line-height: 0; } .PGBDetailIndexPop .indicator > div > a:first-child {margin-top: 0;} .PGBDetailIndexPop .indicator > div > a.on {background: #e27625;} .PGBDetailIndexPop .indicator > div > a.on::before, .PGBDetailIndexPop .indicator > div > a:hover::before { content: ''; display: block; clear: both; position: absolute; top: -13.5px; left: 2.0625rem; /*width: 7.375rem;*/ height: 2.3125rem; padding:9px 20px 8px 20px; box-sizing: border-box; /*background: url('https://investments.miraeasset.com/assets/images/common/box_indicator.png') no-repeat center center;*/ background-color:#fff; border:1px solid #e27625; border-radius: 0.375rem; color: #2b2f36; font-weight: 700; font-size: 14px; text-align: center; line-height: 18px; letter-spacing: 0; white-space: nowrap; } .PGBDetailIndexPop .indicator > div > a.on::after, .PGBDetailIndexPop .indicator > div > a:hover::after{ content:''; display:block; position: absolute; top: -1.5px; left: 26px; width:10px; height:10px; background-image: url('/tigeretf/common_kr/pc/images/common/ico_indicator.svg'); background-size: 8px auto; background-repeat:no-repeat; } .PGBDetailIndexPop .indicator > div > a.on:nth-child(1)::before, .PGBDetailIndexPop .indicator > div > a:hover:nth-child(1)::before {content: '미리 보는 투자포인트';} .PGBDetailIndexPop .indicator > div > a.on:nth-child(2)::before, .PGBDetailIndexPop .indicator > div > a:hover:nth-child(2)::before {content: '수익률';} .PGBDetailIndexPop .indicator > div > a.on:nth-child(3)::before, .PGBDetailIndexPop .indicator > div > a:hover:nth-child(3)::before {content: '상품 정보';} .PGBDetailIndexPop .indicator > div > a.on:nth-child(4)::before, .PGBDetailIndexPop .indicator > div > a:hover:nth-child(4)::before {content: '기준 가격';} .PGBDetailIndexPop .chart-methods { position: absolute; top: 2.625rem; right: 2.5rem; display: flex; gap: 0 0.25rem; } .PGBDetailIndexPop .chart-methods > .each { width: 2.5rem; padding: 0.25rem 0 0.1875rem; border-radius: 3px; background-color: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.5); font-weight: 500; font-size: 0.625rem; } /* 테이블 수정 */ .PGBDetailIndexPop .data-view.tbl-type01 .read-table table{ border-top:2px solid #193d71; } .PGBDetailIndexPop .data-view.tbl-type01 .read-table table > tbody{ border-top:1px solid #d2d7e1; } .PGBDetailIndexPop .data-view.tbl-type01 .read-table table > tbody > tr{ border-bottom:1px solid #d2d7e1; } .PGBDetailIndexPop .data-view.tbl-type01 .read-table table > tbody > tr > td{ color:#2b2f36; font-size:14px; line-height:1.4; font-weight:700; } .PGBDetailIndexPop .data-view.tbl-type01 .read-table table > tbody > tr > td > div{ font-size:16px; line-height:20px; font-weight:400; } .PGBDetailIndexPop .data-view.tbl-type02 .read-table table{ border-top:2px solid #193d71; } .PGBDetailIndexPop .data-view.tbl-type02 .read-table table > tbody{ border-top:1px solid #d2d7e1; } .PGBDetailIndexPop .data-view.tbl-type02 .read-table table > tbody > tr{ border-bottom:1px solid #d2d7e1; } .PGBDetailIndexPop .data-view.tbl-type02 .read-table table > tbody > tr > td{ font-size:16px; line-height:20px; font-weight:400; } @media screen and (max-width:1180px){ #contents.PGBDetailIndexPop{margin-left:0;margin-right:0;} .PGBDetailIndexPop .c-section.as.lead.fixed h1{font-size:20px;} .PGBDetailIndexPop .c-section.as.lead.fixed > .c-sheet{padding:25px 0 25px;} .PGBDetailIndexPop .c-section.as.lead.fixed .complex{padding:0 50px;} .PGBDetailIndexPop h1{font-size:30px;} .PGBDetailIndexPop .category span{font-size:16px;} .PGBDetailIndexPop .lead-main{padding:25px;flex:1;} .PGBDetailIndexPop .lead-closer .title, .PGBDetailIndexPop .lead-closer .desc{font-size:14px;} .PGBDetailIndexPop .lead-main > .each:nth-child(2){flex-basis:26%;} .PGBDetailIndexPop .lead-main > .each:nth-child(3), .PGBDetailIndexPop .lead-main > .each:nth-child(4){flex-basis:21%;} .PGBDetailIndexPop .lead-main > .each .title{font-size:14px;} .PGBDetailIndexPop .lead-main > .each .amount{font-size:25px;} .PGBDetailIndexPop .lead-main .variation{font-size:13px;padding-left: 13px;} .PGBDetailIndexPop .lead-sub .each a{font-size:14px;} .PGBDetailIndexPop .indicator{left:calc(50% - 550px);} .PGBDetailIndexPop div[id^=section] .c-sheet, .PGBDetailIndexPop .caution-wrap .c-sheet{padding-left: 150px;} .PGBDetailIndexPop #section1 .c-sheet h2{font-size: 18px;} .PGBDetailIndexPop #section1 .c-sheet .title{font-size:25px;} .PGBDetailIndexPop .c-sheet h2.title{font-size: 25px;} .PGBDetailIndexPop .basic-data-group .wj-flexchart .wj-axis-x text, .PGBDetailIndexPop .basic-data-group .wj-flexchart .wj-axis-y text{font-size:10px!important;} .PGBDetailIndexPop .sort-group .sort-label, .PGBDetailIndexPop #section4 .form-wrap .basic{font-size: 14px;} .PGBDetailIndexPop .sort-group .btn-data-inquiry{font-size:14px;margin-left:0;} .PGBDetailIndexPop .read-table table > thead > tr > th{font-size:14px;} .PGBDetailIndexPop .coach-pop{width:800px;height:490px;left:calc(50% - 400px);} .PGBDetailIndexPop .coach-pop .coach-pop-btm .txt{font-size:14px;} .PGBDetailIndexPop #coach-pop-imgs li img:not(.cursor){width:720px;} .PGBDetailIndexPop div[id^="section"] .basic-date{font-size:14px;} .PGBDetailIndexPop .c-card[data-type="readme"] .c-card-header, .PGBDetailIndexPop .c-card[data-type="readme"] .c-card-content{font-size:13px;} .PGBDetailIndexPop .product-info .lead{padding:30px 40px;} .PGBDetailIndexPop .product-info .lead .title{font-size: 15px;} .PGBDetailIndexPop .product-info .lead .value{font-size:26px;} .PGBDetailIndexPop .product-info .sub .each .value{font-size: 25px;} .PGBDetailIndexPop .product-info .sub .each .value .value-sub-txt{margin-left: 3px;} .PGBDetailIndexPop #section3 .grid-wrap .c-card .c-card-content p{font-size:28px;} .PGBDetailIndexPop .c-card[data-type="definition"]{padding:30px 40px;} .PGBDetailIndexPop .c-card[data-type="definition"] .c-card-content .txt-bold-type01{font-size:28px;} .PGBDetailIndexPop .c-card[data-type="definition"] .c-card-header{flex-basis:167px;} .PGBDetailIndexPop .read-table table > tbody > tr > td{font-size:14px;} .PGBDetailIndexPop .form-datepicker-group .form-date{width:130px;} .PGBDetailIndexPop .form-date input.datepicker{font-size:13px} .PGBDetailIndexPop .sort-group select{font-size:14px;} .PGBDetailIndexPop .read-table table > thead > tr > th.notice img{margin-bottom:-5px;} .PGBDetailIndexPop .temp-resources > .each a{padding:20px 30px 20px 20px;} } /* 2025-09-02 HDH : 인디케이터 수정 */ .PGBDetailIndexPopInner { position: relative; } .PGBDetailIndexPopInner::after { content: ''; display: block; clear: both; position: absolute; top: 60px; left: calc(50% - 705px); width: 1px; height: calc(100% - 120px); background-color: #d2d7e1; } /* IMCIntrcnView 현(스마트 타이거 Live 자료) (전 my ETF 포트폴리오) */ .IMCIntrcnView .c-data-handler .board-search-wrap .form-input-item::after { content: none; } .IMCIntrcnView .c-data-handler .toast-data-group { order: -1; position: relative; } .IMCIntrcnView .c-data-handler .toast-data-group .toast-pop-data { top: 100%; right: 0; left: auto; } .IMCIntrcnView .c-data-handler.data-view-sort .sort-value::before { content: none; } .IMCIntrcnView .c-data-handler .list-type-btn-wrap { margin-left: 40px; } .IMCIntrcnView .c-data-handler .btn-data-inquiry { margin-left: 0; } .IMCIntrcnView .c-data .c-data-row { display: flex; gap: 0 13px; padding: 60px 16px; border-bottom: 1px solid #d5d8e1; } .IMCIntrcnView .c-data .c-data-cell.for.methods { flex: 0 0 auto; display: flex; justify-content: center; align-items: center; padding: 16px; } .IMCIntrcnView .c-data .c-data-cell.goes.rich { flex: 1 0 auto; display: flex; justify-content: space-between; align-items: flex-end; gap: 0 24px; } .IMCIntrcnView .c-data[data-type="product"] { margin: 30px 0; } .IMCIntrcnView .c-data[data-type="product"] .c-data-header { position: relative; display: flex; justify-content: space-between; align-items: center; min-height: 2.9375rem; padding: 1rem 1.875rem; border-top: 1px solid #193d71; border-bottom: 1px solid #d5d8e1; gap: 0 1px; } .IMCIntrcnView .c-data[data-type="product"] .c-data-header .sort { order: -1; margin-left: auto; } .IMCIntrcnView .c-data[data-type="product"] .c-data-header::before { margin: 0 59px; width: 1px; height: 24px; background-color: #c3c9d5; content: ''; } .IMCIntrcnView .c-data[data-type="product"] .c-data-header .properties { position: relative; } .IMCIntrcnView .c-data[data-type="product"] .c-data-body { } .IMCIntrcnView .c-data[data-type="product"] .c-data-footer { } .IMCIntrcnView .c-data[data-type="product"] .graph-temp { position: relative; width: 218px; height: 135px; } .IMCIntrcnView .c-data[data-type="product"] .graph-temp::before { position: absolute; inset: 0; background-color: #eee; content: '{Graph}'; } .IMCIntrcnView .sort { display: flex; align-items: center; gap: 0 16px; } .IMCIntrcnView .sort .option { position: relative; padding: 10px 27px 10px 14px; color: #7e8693; font-size: 1rem; font-weight: 500; line-height: normal; } .IMCIntrcnView .sort .option.active { color: #193d71; } .IMCIntrcnView .sort .option.active::after { position: absolute; bottom: 6px; left: 50%; width: 44px; margin-left: -28px; border-bottom: 2px solid #193d71; content: ''; } .IMCIntrcnView .sort .option::before { position: absolute; top: 50%; right: 0; width: 22px; height: 22px; margin-top: -12px; background: no-repeat center; background-size: 100% auto; content: ''; } .IMCIntrcnView .sort .option[data-set="ascending"]::before { background-image: url('/tigeretf/common_kr/pc/images/icon/datagrid_order_ascending.svg'); } .IMCIntrcnView .sort .option[data-set="ascending"].active::before { background-image: url('/tigeretf/common_kr/pc/images/icon/datagrid_order_ascending_active.svg'); } .IMCIntrcnView .sort .option[data-set="descending"]::before { background-image: url('/tigeretf/common_kr/pc/images/icon/datagrid_order_descending.svg'); } .IMCIntrcnView .sort .option[data-set="descending"].active::before { background-image: url('/tigeretf/common_kr/pc/images/icon/datagrid_order_descending_active.svg'); } .IMCIntrcnView .product-summary { flex: 1 0 0; } .IMCIntrcnView .product-summary .lead { position: relative; left: -9px; display: flex; justify-content: flex-start; align-items: center; } .IMCIntrcnView .product-summary .category { display: flex; justify-content: flex-start; align-items: center; margin-left: -4px; gap: 0 1px; } .IMCIntrcnView .product-summary .category .each { position: relative; padding: 0 10px; color: #595e6b; font-size: 0.875rem; font-weight: 500; line-height: normal; } .IMCIntrcnView .product-summary .category .each:not(:first-child)::before { position: absolute; top: 50%; left: -1px; height: 12px; margin-top: -6px; border-left: 1px solid #d5d8e1; content: ''; } .IMCIntrcnView .product-summary .title { margin: 21px 0 10px; color: #2b2f36; font-size: 1.5rem; font-weight: 700; line-height: normal; } .IMCIntrcnView .product-summary .code { color: #2b2f36; font-size: 1.125rem; font-weight: 500; line-height: normal; } .IMCIntrcnView .c-pair-group { display: flex; align-items: center; gap: 0 42px; margin-top: 60px; } .IMCIntrcnView .c-pair { display: flex; flex-direction: column; gap: 9px 0; } .IMCIntrcnView .c-pair .key { color: #2b2f36; font-size: 0.75rem; font-weight: 500; line-height: normal; } .IMCIntrcnView .c-pair .value { color: #2b2f36; font-size: 1.25rem; font-weight: 400; line-height: normal; } .IMCIntrcnView .variations { display: flex; flex-direction: column; gap: 24px 0; } .IMCIntrcnView .variations .each { display: flex; justify-content: space-between; align-items: flex-start; gap: 0 58px; } .IMCIntrcnView .variations .each .lead { margin-top: 3px; color: #2B2F36; font-size: 0.75rem; font-weight: 500; line-height: normal; } .IMCIntrcnView .variations .each .variance { display: flex; justify-content: space-between; align-items: baseline; gap: 0 2px; } .IMCIntrcnView .variations .each .val { font-size: 1.25rem; } .IMCIntrcnView .variations .each .unit { font-size: 1rem; } .IMCIntrcnView .variance[data-state="increased"] { color: #d73e3e; } .IMCIntrcnView .variance[data-state="decreased"] { color: #145bb3; } .IMCIntrcnView .product-info-table .read-table table > thead > tr > th { border-left: 1px solid #595959; } .IMCIntrcnView .product-info-table .read-table table > thead > tr:first-of-type > th:first-of-type { border-left: 0; } .IMCIntrcnView .product-info-table .read-table.for-padding .toggle-table > thead > tr > th.left span { font-size: 13px; } .IMCIntrcnView .product-info-table .read-table.for-padding .toggle-table > thead > tr > th span { position: relative; } .IMCIntrcnView .product-info-table .read-table.for-padding .toggle-table > thead > tr > th span::after { position: absolute; top: -2px; right: -24px; width: 24px; height: 24px; background: url('/tigeretf/common_kr/pc/images/icon/arr_off.svg') no-repeat right center; content: ''; } .IMCIntrcnView .product-info-table .read-table.for-padding .toggle-table > thead > tr > .th_sort_value.left { text-align: left; padding-left: 8px; } .IMCIntrcnView .select-content::after{display: none} /* IMHFactSheetList TIGER 월간리포트 */ .IMHFactSheetList .data-view-sort { display: flex; justify-content: flex-end; } .IMHFactSheetList .toast-data-group { order: -1; } .IMHFactSheetList .data-view-sort .toast-data-detail { margin-top: 0; } .ui_tabs1 .page-tab { display: flex; justify-content: space-around; align-items: center; border-bottom-width: 0; } .ui_tabs1 .page-tab li { flex: 1 0 50%; } .ui_tabs1 .page-tab[data-length="3"] li { flex-basis: 33%; } .ui_tabs1 .page-tab[data-length="4"] li { flex-basis: 25%; } .ui_tabs1 .page-tab[data-length="5"] li { flex-basis: 20%; } .ui_tabs1 .page-tab .tab { display: flex; justify-content: center; align-items: center; min-width: 11rem; width: 202px; height: 60px; margin: 0 0 0 -1px; background-color: #EDEFF3; border: 1px solid #C3CAD6; color: #7E8693; font-weight: 500; font-size: 18px; line-height: 26px; } .ui_tabs1 .page-tab .tab.actived { background: #fff; border: 2px solid #1C3E70; border-bottom: 2px solid #DF6D1B; color: #193D71; font-weight: 700; font-size: 22px; } .ui_tabs1 .page-tab .tab { width: auto; min-width: 0; } .ui_tabs1 .page-tab>li+li { margin-left: 0; } .page-tab>li>a { box-sizing: border-box; } .page-tab>li>a.actived { z-index: 1; } .page-tab>li>a.actived:after { content: none; } [class*="ui_tabs"] li:first-child .tab { border-top-left-radius: 6px; } [class*="ui_tabs"] li:last-child .tab { border-top-right-radius: 6px; } .theme-wrap .for-grid { grid-template-columns: repeat(5, 1fr); } .data-grid-handler { display: flex; justify-content: space-between; } .data-grid-handler .toast-data-group { margin-top: 0; } .data-grid-handler.sort-left { flex: 1 0 0; } .data-grid-handler select, .board-list-total .board-list-sort select { z-index: 1; position: relative; height: 32px; padding: 0 20px 0 10px; border-bottom-width: 0; color: #2B2F36; cursor: pointer; appearance: none; -webkit-appearance: none; /* background: transparent url(/assets/images/common/select.png) no-repeat 100% center; */ } .board-list-data[data-ui-corporate="v1.0"] { border-top: 1px solid #193d71; border-bottom: 1px solid #d5d8e1; } .board-list-data[data-ui-corporate="v1.0"] .btn-board-item { padding: 3.75rem 1.25rem; } .board-list-data[data-ui-corporate="v1.0"] .board-list>li { border-color: #d5d8e1; } .board-list-data[data-ui-corporate="v1.0"] .btn-board-item .item-subject { padding-left: 0; } .board-list-data[data-ui-corporate="v1.0"] .btn-board-item .item-date { text-align: right; } .board-list-data[data-ui-corporate="v1.0"] .btn-board-item .item-subject, .board-list-data[data-ui-corporate="v1.0"] .btn-board-item .item-date { color: #000; font-size: 1.125rem; font-weight: 400; line-height: 1.38889; } .data-view-sort .data-grid-handler .sort-value::before { content: none; } .data-grid-handler select:focus-visible, .data-view-sort .sort-value>select:focus-visible, .board-list-total .board-list-sort select:focus-visible { outline: 2px dashed #245DAB; outline-offset: 2px; } .allotment-wrap .c-data-handler .toast-data-group { position: relative; } .allotment-wrap .c-data-handler .toast-data-group .toast-pop-data, .reference-etf-wrap .c-data-handler .toast-data-group .toast-pop-data { top: 100%; right: 0; left: auto; } .c-doc-header { display: flex; justify-content: space-between; align-items: center; } .c-doc-header .c-form[data-type="query-local"] { width: 330px; } .c-form[data-type="query-local"] { display: flex; justify-content: space-between; align-items: center; gap: 0 10px; padding-bottom: 0.6875rem; border-bottom: 2px solid #1c3e70; } .c-form[data-type="query-local"] .form-input-item { flex: 1 0 0; border-bottom-width: 0; } .c-form[data-type="query-local"] .form-input-item::after { content: none; } .c-form[data-type="query-local"] input { width: 100%; height: 2.625rem; color: #1c3e70; font-weight: 400; font-size: 1.25rem; line-height: normal; } .c-form[data-type="query-local"] input::placeholder { color: #1C3E70 !important; } .c-form[data-type="query-local"] .delete { position: absolute; top: 50%; right: 0; display: none; width: 24px; height: 24px; margin-top: -12px; } .c-form[data-type="query-local"] .delete::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/search-local_delete-value.png') no-repeat center; background-size: 100% auto; content: ''; } .c-form[data-type="query-local"] .submit { flex: 0 0 2.125rem; position: relative; flex: 0 0 34px; padding: 0 0 34px; } .c-form[data-type="query-local"] .submit::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/search-local_compact_submit.svg') no-repeat center; background-size: 100% auto; content: ''; } .c-form[data-type="query-local"] .delete .val, .c-form[data-type="query-local"] .submit .val { position: absolute; overflow: hidden; display: block; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; clip: rect(0, 0, 0, 0); white-space: nowrap; } .c-data-handler { display: flex; justify-content: space-between; align-items: center; margin: 30px 0; } .c-data-handler .tit+.data-view-sort { margin-top: 0; } .c-data-handler .board-list-sort.down { position: static; margin-left: 10px; } .c-data-handler .basic-date { color: #2b2f36; font-size: 14px; line-height: 1.4285714; letter-spacing: -0.28px; } .c-data-handler .btn-question { position: relative; width: 16px; height: 16px; margin-left: 5px; } .c-data-handler .btn-question::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/datargid_help_default_temp.svg') no-repeat center; background-size: 100% auto; content: ''; } .c-data-handler .btn-question.active::before { background-image: url('../images/icon/datargid_help_active_temp.svg'); } .c-data-handler .toast-data-detail { position: relative; } .c-data-handler .toast-pop-inner { z-index: 1; position: absolute; top: 1.0625rem; right: -2rem; width: 270px; padding: 22px 20px 30px; background: #fff; border: 1px solid #1C3E70; border-radius: 0.1875rem; } .c-data-handler .toast-pop-inner .pop-body { padding: 0; } .c-data-handler .toast-pop-inner .pop-header { margin-bottom: 10px; padding: 0; } .c-data-handler .toast-pop-inner .btn-toast-close { top: 0.6875rem; right: 0.6875rem; width: 14px; height: 14px; background: none; } .c-data-handler .toast-pop-inner .btn-toast-close::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/tooltip_close_14x14_temp.png') no-repeat center; background-size: 100% auto; content: ''; } .c-data-handler .toast-pop-inner::after { position: absolute; top: -0.625rem; right: 2.125rem; display: block; width: 10px; height: 10px; background: url('../images/icon/bullet_tooltip_pointer.svg') no-repeat center center; content: ''; } .c-data-handler .board-list-total { margin-bottom: 0; } .c-data-handler .btn-data-inquiry { padding: 5px 15px; border-width: 0; color: #193d71; font-size: 1rem; font-weight: 500; line-height: 1.625; } .c-data-handler .btn-excel-download { height: 36px; padding-inline: 18px; display: flex; gap: 4px; align-items: center; font-size: 14px; font-weight: 500; line-height: normal; color: #193D71; border-radius: 5px; border: 1px solid #c3cad6; } .c-data-handler .btn-excel-download::before { content: ''; width: 16px; height: 16px; background: url('../images/icon/icon_excel.svg') no-repeat center; background-size: 100% auto; } .c-data-handler .data-view-sort .sort-value::before { content: none; } .c-data-handler .data-view-sort .sort-value>select { padding: 0 20px 0 10px; } .c-data-handler .data-view-sort .sort-value>select:focus-visible { border-radius: 0; } .c-data-handler button.btn-outline-whitegray:hover, .c-data-handler button.btn-outline-whitegray.mousedown { background-color: transparent; } .c-data-handler .form-input-item { border-bottom-width: 0; } .c-data-handler .basic-select { background-image: url('../images/icon/form-select_caret_down.svg'); } .c-data-handler input.datepicker { background: url('../images/icon/icon_calendar.svg') no-repeat right 12px center / 10.8px 10.8px; font-size: 12px; border-radius: 5px; border: 1px solid #D2D7E1; } .c-data-attachments { margin: 3.75rem 0 4rem; } .c-data-attachments .title { margin-bottom: 1.875rem; color: #000; font-weight: 700; font-size: 1.5rem; line-height: normal; } .c-data-attachments ul>.each:not(:first-child) { margin-top: 1rem; } .c-data-attachments ul>.each a { position: relative; display: block; padding: 1.9375rem 1.25rem; border-radius: 10px; background: #fafafa; } .c-data-attachments ul>.each a::before { position: absolute; display: block; top: 50%; right: 1.25rem; width: 2.5rem; height: 2.5rem; margin-top: -1.25rem; background: url('../images/icon/board_attachment_download.svg') no-repeat center; background-size: 100% auto; content: ''; } .c-data-attachments a { color: #2b2f36; font-weight: 400; font-size: 1.125rem; line-height: normal; } .allotment-wrap .c-data-handler .board-search-wrap .form-input-item::after, .theme-wrap .c-data-handler .board-search-wrap .form-input-item::after { content: none; } .read-table table>thead { border-top-color: #707070; } .read-table table>tbody { border-top-color: #c2c9d5; } .read-table table>tbody>tr { border-bottom-color: #c2c9d5; } .c-data-handler .total-value { color: #2b2f36; font-weight: 500; font-size: 1.25rem; line-height: 1.6; } .c-data-handler .total-value .total { font-weight: 700; } .c-data-handler .sort-group.btn-group-wrap { display: flex; gap: 10px; } .btn-page-wrap .btn-list-more, .btn-page-wrap .btn-list-more.btn-round { width: 142px; height: 79px; padding: 0; border-width: 0; border-radius: 0; } .btn-page-wrap .btn-list-more:hover, .btn-page-wrap .btn-list-more.btn-round:hover { background-color: transparent; } .btn-page-wrap .btn-list-more>span, .btn-page-wrap .btn-list-more.btn-round>span { padding: 0 0 44px; color: #1c3e70; font-size: 20px; font-weight: 500; line-height: normal; } .btn-page-wrap .btn-list-more>span em, .btn-page-wrap .btn-list-more.btn-round>span em { font-weight: inherit; } .btn-page-wrap .btn-list-more:not(.btn-round)>span { padding-bottom: 44px; color: #1C3E70; font-size: 20px; font-weight: 500; line-height: normal; } .btn-page-wrap .btn-list-more>span::after { top: auto; right: auto; bottom: 0; left: 50%; width: 48px; height: 24px; margin-left: -24px; border-width: 0; transform: none; background: url('../images/icon/datagrid_load-more_caret_down.svg') no-repeat center; background-size: 100% auto; } .btn-page-wrap .btn-list-more.btn-outline-whitegray.mousedown { background-color: transparent; } /* CMS Overriding */ .education-define-content { border-color: #c9c9c9; } /* // CMS Overriding */ /* theme-etf-list */ .theme-etf-list { padding-top: calc(3.375rem * var(--scale-factor)); padding-bottom: 9.6875rem; background: #193c70; } .theme-etf-list .title-group { margin-bottom: 5rem; } .theme-etf-list .page-title { color: #fff; font-size: calc(3.375rem * var(--scale-factor)); font-weight: 700; line-height: 1.2; letter-spacing: -1.08px; } .theme-etf-list .list-theme { /* min-width: calc(min(80rem, 56.7376vw)); */ width: 100%; max-width: 1490px; } .theme-etf-list .list-theme .flex { max-width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; } .theme-etf-list .list-theme .flex>a { display: flex; flex-direction: column; gap: calc(1.25rem * var(--scale-factor)); align-items: center; justify-content: center; position: relative; aspect-ratio: 1 / 1; background: #fff; background-size: 0; background-repeat: no-repeat; background-position: center center; border-radius: calc(1.25rem * var(--scale-factor)); text-align: center; transition: all 0.2s ease; } .theme-etf-list .list-theme .flex>a:nth-child(2), .theme-etf-list .list-theme .flex>a:nth-child(4), .theme-etf-list .list-theme .flex>a:nth-child(5), .theme-etf-list .list-theme .flex>a:nth-child(7), .theme-etf-list .list-theme .flex>a:nth-child(10), .theme-etf-list .list-theme .flex>a:nth-child(12), .theme-etf-list .list-theme .flex>a:nth-child(13), .theme-etf-list .list-theme .flex>a:nth-child(15), .theme-etf-list .list-theme .flex>a:nth-child(18), .theme-etf-list .list-theme .flex>a:nth-child(20) { background-color: #ecf1f9; } .theme-etf-list .list-theme .flex>a:nth-child(odd):hover { transform: translateY(-10px); background-size: 100% 100%; background-color: transparent; background: linear-gradient(to bottom right, #245a8f, #193d71); } .theme-etf-list .list-theme .flex>a:nth-child(even):hover { transform: translateY(-10px); background-size: 100% 100%; background-color: transparent; background: linear-gradient(to bottom right, #22678a, #193d71); } .theme-etf-list .list-theme .flex>a::after { content: ""; display: none; clear: both; position: absolute; top: 10rem; left: 50%; transform: translateX(-50%); width: 8.4rem; height: 8.4rem; background-position: center center; background-repeat: no-repeat; } .theme-etf-list .list-theme .flex>a>i { content: ""; display: block; clear: both; width: 84px; height: 84px; background-position: center 0; background-repeat: no-repeat; /* background-size: 100% 336px; */ background-size: cover; } .theme-etf-list .list-theme .flex>a p { width: 100%; color: #000; text-align: center; font-size: calc(1.5rem * var(--scale-factor)); font-weight: 700; line-height: 1.4; } .theme-etf-list .list-theme .flex>a:hover * { color: #fff; } .theme-etf-list .list-theme .flex>a:hover>i { /* background-position: center -84px; */ filter: invert(1); } #dBody:has(.theme-etf-list) { background: #193c70; } /* theme-etf view */ .title-group.visual-topbox { border-radius: calc(0.625rem * var(--scale-factor)) calc(0.625rem * var(--scale-factor)) calc(5rem * var(--scale-factor)) calc(0.625rem * var(--scale-factor)); padding: calc(8.75rem * var(--scale-factor)) calc(5rem * var(--scale-factor)); display: flex; flex-direction: column; gap: calc(1.25rem * var(--scale-factor)); margin-bottom: calc(3.75rem * var(--scale-factor)); } .title-group.visual-topbox.grd-style-1 { background: linear-gradient(95deg, #245A8F 1.01%, #193D71 97.67%); } .title-group.visual-topbox h1 { color: #b4fcff; font-size: calc(1.25rem * var(--scale-factor)); font-style: normal; font-weight: 700; line-height: 140%; /* 28px */ } .title-group.visual-topbox h2 { color: #fff; font-size: calc(3.125rem * var(--scale-factor)); font-weight: 700; line-height: 1.6; } .theme-etf {} .theme-etf-slider-wrap {} .theme-etf-slider { padding-inline: calc(3.75rem * var(--scale-factor)); margin-bottom: calc(5rem * var(--scale-factor)); } .theme-etf-slider .swiper-button-prev, .theme-etf-slider .swiper-button-next { width: calc(2.5rem * var(--scale-factor)); height: calc(46px * var(--scale-factor)); color: rgba(28, 62, 112, 1); } .theme-etf-slider .swiper-button-prev { left: 0; } .theme-etf-slider .swiper-button-next { right: 0; } .theme-etf-slider .swiper-button-prev::after, .theme-etf-slider .swiper-button-next::after { color: inherit; } .theme-etf-slider .swiper-button-disabled, .theme-etf-slider .swiper-button-lock { color: rgba(28, 62, 112, 0.3); display: block; opacity: 1; } .theme-etf-slider .swiper-slide { width: calc(10rem * var(--scale-factor)); height: calc(10rem * var(--scale-factor)); border: 1px solid transparent; border-radius: 10px; } .theme-etf-slider .swiper-slide:hover, .theme-etf-slider .swiper-slide.active { border: 1px solid #f58220; } .theme-etf-slider .swiper-slide a { width: 100%; height: 100%; display: block; } .theme-etf-slider .swiper-slide a .theme-etf-slider-item { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: calc(1.5625rem * var(--scale-factor)); } .theme-etf-slider .swiper-slide a img { width: calc(3.75rem * var(--scale-factor)); height: calc(3.75rem * var(--scale-factor)); } .theme-etf-slider .swiper-slide a p { text-align: center; color: #193d71; font-size: calc(0.875rem * var(--scale-factor)); font-weight: 500; } .theme-etf .active-etf-wrap {} /* 테마 ETF 상단 검색 */ .theme-etf .board-search-wrap { margin-top: 0; margin-bottom: calc(3.75rem * var(--scale-factor)); display: flex; gap: calc(1.25rem * var(--scale-factor)); } .theme-etf .sort-group { display: flex; align-items: center; gap: calc(1.25rem * var(--scale-factor)); } .theme-etf .sort-group .sort-label { color: #2b2f36; font-size: calc(0.875rem * var(--scale-factor)); font-weight: 400; line-height: normal; } .theme-etf .sort-group .sort-value { display: flex; gap: calc(1.5rem * var(--scale-factor)); align-items: center; } .theme-etf .sort-group .sort-value::before { display: none; } .theme-etf .sort-group .sort-value .sort-value-label { flex: none; color: #2B2F36; font-size: calc(1rem * var(--scale-factor)); font-weight: 500; line-height: 1.40387; } .theme-etf .sort-group .sort-value select { color: #2b2f36; font-size: calc(1rem * var(--scale-factor)); font-weight: 500; line-height: normal; padding-right: calc(1.6875rem * var(--scale-factor)); background-image: url(../images/icon/icon_select_arrow_down.svg); background-repeat: no-repeat; background-position: right center; height: auto; } .theme-etf .board-search-wrap .search-form { display: flex; gap: calc(1.25rem * var(--scale-factor)); flex: 1; } .theme-etf .board-search-wrap .search-form .search-form-input { display: flex; align-items: center; flex: 1; border-bottom: 2px solid #1c3e70; height: calc(3.125rem * var(--scale-factor)); } .theme-etf .board-search-wrap .search-form .search-form-input input { width: 100%; height: 100%; border: none; outline: none; color: #1c3e70; font-size: calc(1.25rem * var(--scale-factor)); font-weight: 400; line-height: normal; } .theme-etf .board-search-wrap .search-form .search-form-input input::placeholder { color: #1c3e70 !important; } .theme-etf .board-search-wrap .search-form .search-form-input .btn-search { width: calc(2.125rem * var(--scale-factor)); height: calc(2.125rem * var(--scale-factor)); background-image: url(../images/icon/icon_board_top_search.svg); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; } .theme-etf .board-search-wrap .search-form .search-form-input .btn-search span { font-size: 0; line-height: 0; display: block; overflow: hidden; margin: -1px; } .theme-etf .board-search-wrap .search-form .btn-form-search, .theme-etf .sort-group .btn_list_srch { display: flex; padding: calc(0.3125rem * var(--scale-factor)) calc(0.9375rem * var(--scale-factor)); justify-content: center; align-items: center; gap: calc(0.625rem * var(--scale-factor)); align-self: stretch; color: #193d71; text-align: center; font-size: calc(1rem * var(--scale-factor)); font-weight: 500; line-height: 1.625; } .theme-etf .board-search-wrap .btn-item { margin-left: calc(6.25rem * var(--scale-factor)); display: flex; gap: calc(0.625rem * var(--scale-factor)); align-items: center; } .theme-etf .board-search-wrap .btn-item a { display: flex; align-items: center; justify-content: center; color: #193d71; font-size: calc(0.875rem * var(--scale-factor)); font-weight: 500; line-height: normal; border-radius: calc(0.375rem * var(--scale-factor)); border: 1px solid #c3cad6; height: calc(2.25rem * var(--scale-factor)); padding-inline: calc(0.9375rem * var(--scale-factor)); gap: calc(0.375rem * var(--scale-factor)); } .theme-etf .board-search-wrap .btn-item a i.icon-download { width: 18px; height: 18px; background-image: url(../images/icon/icon_download_orange_18.svg); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; } /* 테마 ETF 상품 목록 */ .theme-etf .data-view-sort { width: 100%; display: flex; flex-direction: column; align-items: stretch; gap: calc(1.875rem * var(--scale-factor)); margin-bottom: calc(2.5rem * var(--scale-factor)); } .theme-etf .data-view-sort .sort-top { display: flex; flex-direction: column; align-items: stretch; gap: calc(0.75rem * var(--scale-factor)); } .theme-etf .data-view-sort .total-count { color: #2b2f36; font-size: calc(1.25rem * var(--scale-factor)); font-weight: 700; line-height: normal; } .theme-etf .data-view-sort .toast-data-detail .basic-date { color: #2b2f36; font-size: calc(0.875rem * var(--scale-factor)); font-weight: 400; line-height: normal; align-items: center; } .theme-etf .data-view-sort .btn-question { background-image: url(../images/icon/icon_help.svg); width: calc(1rem * var(--scale-factor)); height: calc(1rem * var(--scale-factor)); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; } .theme-etf .cal-txt { display: flex; flex-direction: column; gap: calc(0.625rem * var(--scale-factor)); color: #6a7180; font-size: calc(0.875rem * var(--scale-factor)); font-weight: 400; line-height: normal; margin: 0; padding: 0; list-style: none; } .theme-etf .c-data .c-data-header { display: flex; justify-content: space-between; align-items: center; height: calc(5rem * var(--scale-factor)); padding-inline: calc(1.875rem * var(--scale-factor)); border-top: 1px solid #193d71; border-bottom: 1px solid #d5d8e1; } .theme-etf .c-data .c-data-header::before { content: none; display: none; } .theme-etf .c-data .c-data-header .c-data-header-title { color: #193d71; font-size: calc(1rem * var(--scale-factor)); font-weight: 500; line-height: normal; text-align: center; flex: 0 1 calc(37.5rem * var(--scale-factor)); } .theme-etf .c-data .c-data-header .sort-item { flex: none; display: flex; gap: calc(1.875rem * var(--scale-factor)); align-items: center; } .theme-etf .c-data .c-data-header .sort-item button { display: flex; gap: calc(0.25rem * var(--scale-factor)); align-items: center; color: #7e8693; font-size: calc(1rem * var(--scale-factor)); font-weight: 500; line-height: normal; } .theme-etf .c-data .c-data-header .sort-item button.actived, .theme-etf .c-data .c-data-header .sort-item button:hover { color: #193d71; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; } .theme-etf .c-data .c-data-header .sort-item button i.icon-arrow { display: block; width: calc(1.3125rem * var(--scale-factor)); height: calc(1.3125rem * var(--scale-factor)); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; opacity: 0.5; background-image: url(../images/icon/icon-table-sort-default.svg); } .theme-etf .c-data .c-data-header .sort-item button.actived i.icon-arrow { background-image: url(../images/icon/icon-table-sort-actived.svg); } .theme-etf .c-data .c-data-header .sort-item button i.icon-arrow.up { transform: rotate(0deg); } .theme-etf .c-data .c-data-header .sort-item button i.icon-arrow.down { transform: rotate(180deg); } .theme-etf .c-data .c-data-header .c-data-header-item { flex: 1; } .theme-etf .c-data .c-data-header .c-data-header-sort { display: flex; align-items: center; justify-content: flex-end; gap: calc(3.75rem * var(--scale-factor)); } .theme-etf .c-data .c-data-header .sort-toggle { display: flex; align-items: center; gap: calc(1.25rem * var(--scale-factor)); } .theme-etf .c-data .c-data-header .sort-toggle .sort-label { color: #7E8693; font-size: calc(.875rem * var(--scale-factor)); font-weight: 500; line-height: normal; } .theme-etf .c-data .c-data-header .toggle-btn-wrap { display: inline-flex; align-items: center; height: 30px; font-size: 0px; border: 1px solid #d2d3d1; border-radius: 15px; background-color: #fff; box-sizing: border-box; } .theme-etf .c-data .c-data-header hr { display: block; width: 1px; height: 24px; background-color: #C3C9D5; border: 0; margin: 0; flex: none; } .theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle { position: relative; display: inline-block; line-height: 28px; vertical-align: top; } .theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle:nth-of-type(1) { padding: 0 12px 0 18px; } .theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle:nth-of-type(2) { padding: 0 18px 0 12px; } .theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle.actived { position: relative; padding: 0 18px; } .theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle.actived:before { content: ''; position: absolute; top: -1px; width: 100%; height: 30px; border-radius: 15px; background-color: #E37500; } .theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle:nth-of-type(1).actived:before { left: -1px; } .theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle:nth-of-type(2).actived:before { right: -1px; } .theme-etf .c-data .c-data-header .toggle-btn-wrap .btn-toggle.actived span { color: #fff; } .theme-etf .c-data .c-data-body {} .theme-etf .c-data .c-data-body .form-circle-box.black .form-check-icon:after { background-image: url(../images/icon/icon_form_circle_check_orange_on_24.svg); } .theme-etf .c-data .c-data-body .c-data-row { display: flex; align-items: center; gap: calc(2.25rem * var(--scale-factor)); padding-inline: calc(2.5rem * var(--scale-factor)); padding-block: calc(3.125rem * var(--scale-factor)) calc(3.75rem * var(--scale-factor)); border-bottom: 1px solid #D5D8E1; } .theme-etf .c-data .c-data-body .c-data-row .c-data-cell {} .theme-etf .c-data .c-data-cell.methods { padding: 0; flex: none; } .theme-etf .c-data .c-data-cell.rich { display: flex; flex: 1; } .theme-etf .c-data .c-data-cell.year-results { flex: 0 0 calc(34.0625rem * var(--scale-factor)); display: flex; } .theme-etf .c-data .c-data-cell .product-summary {} .theme-etf .c-data .c-data-cell .product-summary { flex: 1 0 0; } .theme-etf .c-data .product-summary .lead { position: relative; left: -9px; display: flex; justify-content: flex-start; align-items: center; } .theme-etf .c-data .product-summary .category { display: flex; justify-content: flex-start; align-items: center; margin-left: -4px; gap: 0 1px; } .theme-etf .c-data .product-summary .category .each { position: relative; padding: 0 10px; color: #595e6b; font-size: 0.875rem; font-weight: 500; line-height: normal; } .theme-etf .c-data .product-summary .category .each:not(:first-child)::before { position: absolute; top: 50%; left: -1px; height: 12px; margin-top: -6px; border-left: 1px solid #d5d8e1; content: ""; } .theme-etf .c-data .product-summary .title { margin: 21px 0 10px; color: #2b2f36; font-size: 1.5rem; font-weight: 700; line-height: normal; word-break: keep-all; overflow-wrap: anywhere; } .theme-etf .c-data .product-summary .code { color: #2b2f36; font-size: 1.125rem; font-weight: 500; line-height: normal; } .theme-etf .c-data .bookmark { position: relative; width: 34px; height: 34px; vertical-align: top; } .theme-etf .c-data .bookmark::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url("/tigeretf/common_kr/pc/images/icon/bookmark_content_default.svg") no-repeat center; background-size: 100% auto; content: ""; } .theme-etf .c-data .bookmark.active::before, .theme-etf .c-data .bookmark.actived::before { background-image: url("/tigeretf/common_kr/pc/images/icon/bookmark_content_active.svg"); } .theme-etf .c-data .bookmark .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } .theme-etf .c-data .c-pair-group { display: flex; align-items: center; gap: 0 42px; margin-top: 60px; } .theme-etf .c-data .c-pair { display: flex; flex-direction: column; gap: 9px 0; } .theme-etf .c-data .c-pair .key { color: #2b2f36; font-size: 0.75rem; font-weight: 500; line-height: normal; } .theme-etf .c-data .c-pair .value { color: #2b2f36; font-size: 1.25rem; font-weight: 400; line-height: normal; display: flex; align-items: center; height: calc(1.875rem * var(--scale-factor)); } .theme-etf .c-data .btn-link { display: flex; align-items: center; gap: calc(0.375rem * var(--scale-factor)); color: #fff; font-size: calc(0.8125rem * var(--scale-factor)); font-weight: 500; line-height: normal; background-color: #e37500; height: calc(1.875rem * var(--scale-factor)); padding: 0 calc(1rem * var(--scale-factor)); border-radius: calc(0.375rem * var(--scale-factor)); } .theme-etf .c-data .btn-link i.icon-link { display: block; width: calc(1rem * var(--scale-factor)); height: calc(1rem * var(--scale-factor)); background-image: url(../images/icon/icon_link_white.svg); } .theme-etf .c-data .variations { display: flex; flex-direction: column; gap: calc(2.625rem * var(--scale-factor)) 0; width: 100%; } .theme-etf .c-data .variations .each { display: flex; justify-content: space-between; align-items: center; gap: 0 58px; } .theme-etf .c-data .variations .each .year { color: #2b2f36; font-size: 0.75rem; font-weight: 700; line-height: normal; } .theme-etf .c-data .variations .each .group { flex: 0 0 185px; display: flex; align-items: center; justify-content: space-between; } .theme-etf .c-data .variations .each .lead { color: #2b2f36; font-size: 0.75rem; font-weight: 500; line-height: normal; } .theme-etf .c-data .variations .each .variance { display: flex; justify-content: space-between; align-items: baseline; gap: 0 2px; } .theme-etf .c-data .variations .each .val { min-width: calc(3.5rem * var(--scale-factor)); font-size: 1.25rem; text-align: center; } .theme-etf .c-data .variations .each .unit { font-size: 1rem; } .theme-etf .c-data .variance[data-state="increased"] { color: #d73e3e; } .theme-etf .c-data .variance[data-state="decreased"] { color: #145bb3; } .theme-etf .c-data .btn-page-wrap .btn-list-more { display: flex; align-items: center; width: auto; margin: 0 auto; } .theme-etf .c-data .btn-page-wrap .btn-list-more span { color: #1C3E70; font-size: 20px; font-weight: 500; } .theme-etf .c-data-table { width: 100%; border-top: 1px solid #193D71; border-bottom: 1px solid #D5D8E1; } .theme-etf .c-data-table th, .theme-etf .c-data-table td { text-align: center; vertical-align: middle; } .theme-etf .c-data-table th { height: 60px; font-size: 1rem; color: #193D71; font-weight: 500; } .theme-etf .c-data-table td { border-top: 1px solid #D5D8E1; font-size: 20px; font-weight: 400; color: #2b2f36; /* padding-inline:15px; */ } .theme-etf .c-data-table .product-summary { text-align: left; width: 100%; min-width: 460px; padding: 30px; } .theme-etf .c-data-table .product-summary .c-pair-group { display: flex; flex-direction: row; margin-top: 24px; } .theme-etf .c-data-table .product-summary .c-pair-group .c-pair { display: flex; flex-direction: row; gap: 10px; align-items: center; } .theme-etf .c-data-table .product-summary .c-pair-group .c-pair .btn-link { margin-left: 60px; } .theme-etf .c-data-table .btn-sort { display: flex; align-items: center; gap: 3px; padding: 0; width: 100%; justify-content: center; font-size: inherit; font-weight: inherit; color: inherit; } .theme-etf .c-data-table .group-start { padding-left: 15px; } .theme-etf .c-data-table .group-end { padding-right: 15px; } .theme-etf .c-data-table .btn-sort:hover, .theme-etf .c-data-table .btn-sort.actived { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; } .theme-etf .c-data-table .icon-arrow { display: block; width: 21px; height: 21px; background-image: url(../images/icon/icon-table-sort-default.svg); } .theme-etf .c-data-table .btn-sort.actived .icon-arrow { background-image: url(../images/icon/icon-table-sort-actived.svg); } .theme-etf .c-data-table .icon-arrow.up { transform: rotate(0deg); } .theme-etf .c-data-table .icon-arrow.down { transform: rotate(180deg); } .PMEFaqView .c-section { position: relative; margin-top: 60px; } .PMEFaqView .c-sheet { box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } .PMEFaqView .c-sheet *, .PMEFaqView .c-sheet *::before, .PMEFaqView .c-sheet *::after { box-sizing: inherit; } .PMEFaqView .board-view-wrap[data-ui-corporate="v1.0"] .board-view-top { display: flex; justify-content: space-between; align-items: center; padding: 1.5rem 0; border-top: 1px solid #1c3e70; border-bottom-color: #e0e0e0; } .PMEFaqView .board-view-data[data-ui-corporate="v1.0"] { color: #000; font-size: 1rem; } .PMEFaqView .btn-page-wrap[data-ui-corporate="v1.0"] { display: flex; justify-content: space-between; min-height: auto; } .PMEFaqView .btn-page-wrap[data-ui-corporate="v1.0"] .c-button:only-child { margin-left: auto; } .PMEFaqView .c-button.for.page-nav { min-width: 6.125rem; padding: 0.8125rem; border: 1px solid #c3cad6; border-radius: 0.3125rem; color: #595e6b; font-weight: 700; font-size: 0.875rem; line-height: 1.285714; text-align: center; } .IMCIntrcnList .c-section { position: relative; margin-top: 60px; } .IMCIntrcnList .c-sheet { box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 0; } .IMCIntrcnList .c-sheet *, .IMCIntrcnList .c-sheet *::before, .IMCIntrcnList .c-sheet *::after { box-sizing: inherit; } .IMCIntrcnList #contents .c-sheet { margin: 0 -16px; } .IMCIntrcnList .c-card[data-type="article"] { display: flex; flex-wrap: wrap; align-items: center; padding: 40px 40px 50px; border: 1px solid #c9c9c9; border-radius: 0.3125rem; } .IMCIntrcnList .c-card[data-type="article"]:hover { border-color: #f58220; background-color: #f58220; } .IMCIntrcnList .c-card[data-type="article"]:hover .title, .IMCIntrcnList .c-card[data-type="article"]:hover .channel, .IMCIntrcnList .c-card[data-type="article"]:hover .registered { color: #fff; } .IMCIntrcnList .c-card[data-type="article"]:hover .bookmark::before { background: url('/tigeretf/common_kr/pc/images/icon/bookmark_content_hover.svg'); } .IMCIntrcnList .c-card[data-type="article"] .title { display: -webkit-box; height: 6.1875rem; max-height: 6.1875rem; font-size: 1.5rem; line-height: 1.4; font-weight: 500; color: #000; word-break: break-all; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .IMCIntrcnList .c-card[data-type="article"] .c-card-prefix { order: -3; flex: 1 0 auto; } .IMCIntrcnList .c-card[data-type="article"] .c-card-header { flex: 0 0 100%; margin: 2.5rem 0 1.25rem; width: 100%; } .IMCIntrcnList .c-card[data-type="article"] .c-card-content { flex: 1 0 100%; width: 100%; } .IMCIntrcnList .c-card[data-type="article"] .c-card-methods { position: relative; right: -1.1875rem; order: -1; flex: 0 0 34px; } /*.IMCIntrcnList .c-card[data-type="article"] .hashtags { display: flex; gap: 6px; min-height: 2.125rem; flex-wrap: wrap;}*/ .IMCIntrcnList .c-card[data-type="article"] .hashtags { color: #f58220; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; height: 24px; } .IMCIntrcnList .c-card[data-type="article"]:hover .hashtags { color: #fff; } /*.IMCIntrcnList .c-card[data-type="article"] .hashtags > .each { padding: 0.3125rem 0.6875rem; border: 1px solid #ffb380; border-radius: 0.625rem; background-color: #fffbf7; color: #f58220; font-size: 1rem; font-weight: 500; line-height: 1.375; }*/ .IMCIntrcnList .c-card[data-type="article"] .channel { color: #f58220; font-weight: 700; font-size: 1.25rem; line-height: normal; } .IMCIntrcnList .c-card[data-type="article"] .registered { margin: 2.5rem 0 0; padding: 30px 0 0; border-top: 1px solid #e0e0e0; color: #949494; font-weight: 500; font-size: 1.25rem; line-height: 1.1; } .IMCIntrcnList .bookmark { position: relative; width: 34px; height: 34px; vertical-align: top; } .IMCIntrcnList .bookmark::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/bookmark_content_default.svg') no-repeat center; background-size: 100% auto; content: ''; } .IMCIntrcnList .bookmark.active::before { background-image: url('../images/icon/bookmark_content_active.svg') } .IMCIntrcnList .bookmark .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } .c-sheet>.grid-frame-layout { display: grid; grid-template-columns: repeat(4, minmax(23.79195%, 1fr)); gap: 24px; } .IMBRptList .c-section { position: relative; margin-top: 60px; } .IMBRptList .c-sheet { box-sizing: border-box; max-width: 1522px; margin: 0 auto; padding: 0 16px; } .IMBRptList .c-sheet *, .IMBRptList .c-sheet *::before, .IMBRptList .c-sheet *::after { box-sizing: inherit; } .IMBRptList #contents .c-sheet { margin: 0 -16px; } .IMBRptList .c-card[data-type="book"] { display: flex; flex-wrap: wrap; align-items: center; } .IMBRptList .c-card[data-type="book"] .title { font-size: 1.25rem; line-height: 1.75rem; font-weight: 500; color: #000; text-overflow: ellipsis; overflow: hidden; } .IMBRptList .c-card[data-type="book"] .c-card-prefix { flex: 0 0 100%; margin-bottom: 0.375rem; } .IMBRptList .c-card[data-type="book"] .c-card-header { flex: 0 0 100%; margin-bottom: 1rem; } .IMBRptList .c-card[data-type="book"] .c-card-content { flex: 1 0 auto; display: flex; gap: 0 6px; } .IMBRptList .c-card[data-type="book"] .c-card-methods { flex: 0 0 34px; } .IMBRptList .c-card[data-type="book"] .figure { margin-bottom: 1.25rem; } .IMBRptList .c-card[data-type="book"] .figure>div { height: 491px; border-radius: 0.75rem; border: 1px solid #e0e0e0; overflow: hidden; } .IMBRptList .c-card[data-type="book"] .figure img { display: flex; justify-content: center; align-items: center; width: 100%; height: auto; } /*position: absolute; top: 0; left: 0;*/ .IMBRptList .c-card[data-type="book"] .hashtags { display: flex; gap: 0 5px; color: #6F7685; font-size: 1rem; font-weight: 500; line-height: 1.375; text-overflow: ellipsis; overflow: hidden; } .IMBRptList .c-card[data-type="book"] .hashtags span { white-space: nowrap; } .IMBRptList .c-card[data-type="book"] .registered { color: #949494; font-weight: 500; font-size: 0.875rem; } .IMBRptList .bookmark { position: relative; width: 34px; height: 34px; vertical-align: top; } .IMBRptList .bookmark::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/bookmark_content_default.svg') no-repeat center; background-size: 100% auto; content: ''; } .IMBRptList .bookmark.active::before { background-image: url('../images/icon/bookmark_content_active.svg') } .IMBRptList .bookmark .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } .education-academy-wrap { border-top: 1px solid #193d71; } .education-academy-wrap .accordion-list .accordion-cell { border-bottom-color: #d5d8e1; } .education-academy-wrap .accordion-list .accordion-content { border-top-color: #193d71; } /* 2025-08-15 : HDH : 게시판 레이아웃 수정 */ /* .ui-info-table */ .ui-info-table .product-summary { flex: 1 0 0; text-align: left; } .ui-info-table .product-summary .lead { position: relative; left: -9px; display: flex; justify-content: flex-start; align-items: center; } .ui-info-table .product-summary .category { display: flex; justify-content: flex-start; align-items: center; margin-left: -4px; gap: 0 1px; } .ui-info-table .product-summary .category .each { position: relative; padding: 0 10px; color: #595e6b; font-size: 0.875rem; font-weight: 500; line-height: normal; } .ui-info-table .product-summary .category .each:not(:first-child)::before { position: absolute; top: 50%; left: -1px; height: 12px; margin-top: -6px; border-left: 1px solid #d5d8e1; content: ''; } .ui-info-table .product-summary .title { margin: 21px 0 10px; color: #2b2f36; font-size: 1.5rem; font-weight: 700; line-height: normal; } .ui-info-table .product-summary .code { color: #2b2f36; font-size: 1.125rem; font-weight: 500; line-height: normal; } .ui-info-table table { border-top: 1px solid #193d71; } .ui-info-table table>thead { min-height: 2.9375rem; border: none; } /* .ui-info-table table > thead > tr { border-top: 1px solid #193d71; } */ .ui-info-table table>thead>tr+tr { border-bottom: 1px solid #d5d8e1; } .ui-info-table table>thead>tr>th { font-size: 16px; font-weight: 500; line-height: normal; color: #193d71; border-left: 0; background-color: transparent; } .ui-info-table table>thead>tr:first-of-type th { padding-top: 24px; padding-bottom: 24px; } .ui-info-table table>thead>tr:first-of-type>th:first-of-type { padding-left: 60px; border-left: 0; } .ui-info-table table>thead>tr>th.last-column { padding-right: 30px; } .ui-info-table .read-table table>thead>tr+tr { border-top: none; } .product-info-table.ui-info-table .read-table th.table-input { padding: 24px 10px 12px 10px; } .ui-info-table .table-input span.text { color: #7e8693; font-size: 0.875rem; font-weight: 500; } .ui-info-table .read-table table>thead>tr+tr th { padding-bottom: 30px; color: #193D71; text-align: center; font-size: 16px; font-weight: 500; line-height: normal; } .ui-info-table table>tbody>tr>td { padding: 60px 10px; font-size: 18px; font-weight: 400; } .ui-info-table table>tbody>tr>td:first-of-type { padding-left: 60px; } .ui-info-table table>tbody>tr>td>span, .ui-info-table table>tbody>tr>td .value { display: block; padding-top: 60px; } .ui-info-table table>tbody>tr>td.last-column { padding-right: 30px; } .ui-info-table table>tbody>tr>td.vertical-align-top { vertical-align: top; } .ui-info-table table>tbody>tr>td .price-percent { font-size: 18px; font-weight: 500; line-height: normal; } .ui-info-table table>thead>tr>th.text-center { text-align: center !important; } .ui-info-table table>thead>tr>th.text-right { text-align: right !important; } .ui-info-table table>thead>tr>th.text-left { text-align: left !important; } .ui-info-table table>tbody>tr>td.text-center { text-align: center !important; } .ui-info-table table>tbody>tr>td.text-right { text-align: right !important; } .ui-info-table table>tbody>tr>td.text-left { text-align: left !important; } /* type-2 게시판 형태 */ .ui-info-table.type-2 table>thead>tr>th { padding: 25px 20px; color: #2B2F36; font-size: 18px; font-weight: 700; line-height: normal; } .ui-info-table.type-2 table>tbody>tr>td { padding: 25px 20px; font-size: 16px; font-weight: 400; line-height: normal; } .ui-info-table.type-2 table>thead>tr>th:first-of-type, .ui-info-table.type-2 table>tbody>tr>td:first-of-type { padding-left: 20px; } .ui-info-table.type-2 table>thead>tr>th:last-of-type, .ui-info-table.type-2 table>tbody>tr>td:last-of-type { padding-right: 20px; } .ui-info-table.type-2 table>tbody>tr>td .btn-see-details { padding-right: 20px; } .ui-info-table.type-2 table>tbody>tr>td .btn-see-details:after { content: ''; position: absolute; top: 50%; right: 0; display: block; width: 16px; height: 18px; margin-top: -10px; background: url(../images/icon/icon_arrow_darkgray_18.png) no-repeat center center; background-size: auto 100%; } /* type-3 팝업 게시판 형태 */ .ui-info-table.type-3 table>thead>tr>th { padding: 19px 5px; color: #2B2F36; font-size: 14px; font-weight: 700; line-height: normal; } .ui-info-table.type-3 table>tbody>tr>td { padding: 19px 5px; font-size: 14px; font-weight: 400; line-height: normal; } .layer-pop-wrap.type-new .ui-info-table.type-3 table>thead>tr>th { padding: 19px 5px; } .layer-pop-wrap.type-new .ui-info-table.type-3 table>tbody>tr>td { padding: 19px 5px; } .ui-info-table.type-3 table>thead>tr>th:first-of-type, .ui-info-table.type-3 table>tbody>tr>td:first-of-type { padding-left: 20px; } .ui-info-table.type-3 table>thead>tr>th:last-of-type, .ui-info-table.type-3 table>tbody>tr>td:last-of-type { padding-right: 20px; } .ui-info-table.type-3 table>tbody>tr>td .btn-see-details:after { content: ''; position: absolute; top: 50%; right: 0; display: block; margin-top: -9px; width: 16px; height: 18px; background: url(../images/icon/icon_arrow_darkgray_18.png) no-repeat center center; background-size: auto 100%; } .ui-info-table.type-3 .c-data-handler { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; } .ui-info-table.type-3 .c-data-handler .c-data-handler-left { display: flex; align-items: center; justify-content: flex-start; gap: 10px; } .ui-info-table.type-3 .c-data-handler .sort-group { margin-bottom: 0; } /* //2025-08-15 : HDH : ETF 상품 게시판 레이아웃 수정 */ /* 2025-08-19 : HDH : 기준일 조회 버튼 디자인 수정 */ /* 버튼 */ .btn-new { display: inline-flex; padding: 8px 18px; justify-content: center; align-items: center; gap: 4px; border-radius: 4px; border: 1px solid #c3cad6; color: #193d71; font-size: 14px; font-weight: 500; line-height: normal; } .btn-new:link, .btn-new:visited { color: #193d71; } .btn-new.type-icon { position: relative; padding-left: 38px; } .btn-new.type-icon::before { content: ''; position: absolute; top: 50%; left: 8px; display: block; width: 36px; height: 36px; background: no-repeat center; transform: translateY(-50%); } .btn-new.type-icon.type-excel::before { background-image: url('/tigeretf/common_kr/pc/images/icon/36x36_document_excel.svg'); background-size: 16px 16px; } .btn-new.type-icon.type-folder::before { background-image: url(../images/icon/icon_folder_blue.svg); background-size: 24px 24px; } .btn-new.type-icon.type-download::before { background-image: url(../images/icon/Icon_download_blue.svg); background-size: 16px 16px; } .btn-new.type-pop-close { display: flex; width: 98px; height: 44px; padding: 10px; justify-content: center; align-items: center; gap: 10px; border-radius: 5px; background: #193d71; color: #fff; font-size: 16px; font-weight: 700; line-height: normal; } .btn-new.type-pop-close02 { display: flex; width: 300px; height: 64px; padding: 10px; justify-content: center; align-items: center; gap: 10px; border-radius: 5px; background: #193d71; color: #fff; font-size: 16px; font-weight: 700; line-height: normal; } .btn-new.type-pop-save { display: flex; width: 300px; height: 64px; padding: 10px; justify-content: center; align-items: center; gap: 10px; border-radius: 5px; background: #F58220; color: #fff; font-size: 16px; font-weight: 700; line-height: normal; border: 0; } .btn-new.type-pop-cancel { display: flex; width: 300px; height: 64px; padding: 10px; justify-content: center; align-items: center; gap: 10px; border: 1px solid #C3CAD6; border-radius: 5px; background: #fff; color: #193D71; font-size: 16px; font-weight: 700; line-height: normal; } .btn-new+.btn-new { margin-left: 20px; } .sort-group .sort-label.type-black { color: #2B2F36; font-size: 14px; font-weight: 400; } .form-datepicker-group.type-border-gray .form-date:first-child { order: -2; } .form-datepicker-group.type-border-gray::after { order: -1; display: block; width: 6px; height: 1px; margin: 0 8px; border-top: 1px solid #2b2f36; content: ''; } .form-datepicker-group.type-border-gray .form-date+.form-date { margin-left: 0; padding-left: 0; } .form-datepicker-group.type-border-gray .form-date+.form-date::after { content: none; } .form-datepicker-group.type-border-gray .form-date { height: 36px; } .form-datepicker-group.type-border-gray .form-date input.datepicker { position: relative; width: 194px; height: 100%; padding: 0.625rem 0.75rem; background: url('../images/icon/36x36_form-input_date.svg') no-repeat right 0.75rem center; background-size: 11px 12px; color: #2b2f36; font-size: 0.75rem; font-weight: 400; line-height: normal; border: 1px solid #eee; border-radius: 4px; background-color: #fff; box-sizing: border-box; } .data-view-sort.type-date-search .sort-group .btn-data-inquiry { margin-right: 20px; } /* //2025-08-19 : HDH : 기준일 조회 버튼 디자인 수정 */ /* 2025-08-19 : HDH : 레이어 팝업 디자인 개선 */ .layer-pop-wrap.type-new .pop-data { max-width: 900px; } .layer-pop-wrap.type-new .pop-header { min-height: 46px; padding: 30px 40px 44px; } .layer-pop-wrap.type-new .pop-header .pop-header-title { position: relative; color: #1C3E70; font-size: 20px; font-style: normal; font-weight: 700; line-height: normal; } .layer-pop-wrap.type-new .pop-header .pop-header-title::before { content: ''; position: absolute; bottom: -14px; left: 0; width: 100%; height: 2px; background-color: #193D71; } .layer-pop-wrap.type-new .pop-header .pop-header-title::after { content: ''; position: absolute; bottom: -14px; left: 0; width: 128px; height: 2px; background-color: #f58220; } .layer-pop-wrap.type-new .pop-footer { display: flex; align-items: center; justify-content: center; /*padding: 30px 40px 60px;*/ padding: 60px 40px 90px; background-color: #fff; border-radius: 0 0 24px 24px; } .layer-pop-wrap.type-new .btn-pop-close { top: 33px; right: 40px; width: 18px; height: 18px; font-size: 0; background: url(../images/icon/icon_pop_close_black.svg) center center no-repeat; z-index: 15; background-size: 18px; } .layer-pop-wrap.type-new .pop-body .item-subject-wrap .item-subject { font-size: 30px; font-weight: 700; line-height: normal; } .layer-pop-wrap.type-new .pop-body .item-subject-wrap .reflect-date { color: #8c94a3; font-size: 16px; font-weight: 400; line-height: normal; } .layer-pop-wrap.type-new .data-view-sort { min-height: 36px; margin: 60px 0 10px; } .layer-pop-wrap.type-new .data-view-sort .sort-left .total-value { color: #2B2F36; font-size: 20px; font-weight: 500; line-height: normal; } /* 인포박스 */ .layer-pop-wrap.type-new .chart-info-box.type-new { margin-top: 20px; padding: 20px; background-color: #f4f5f6; border-radius: 10px; } .layer-pop-wrap.type-new chart-info-box.type-new .title { font-size: 16px; } .layer-pop-wrap.type-new .note-info.type-new .title:before { content: ''; position: absolute; top: 50%; left: 0; display: block; width: 16px; height: 16px; background: url(../images/icon/datargid_help_default_temp.svg) no-repeat center; background-size: 100% auto; transform: translateY(-50%); } .layer-pop-wrap.type-new .common-point-note { padding: 60px; border: 1px solid #E5E6E5; } .layer-pop-wrap.type-new .common-point-note .warning-title { padding-left: 0; color: #f58220; font-size: 24px; font-weight: 700; line-height: normal; } .layer-pop-wrap.type-new .common-point-note .warning-title::before { display: none; } .layer-pop-wrap.type-new .common-point-note .dotted-list { margin-top: 37px; } .layer-pop-wrap.type-new .common-point-note .dotted-list .list-cell { font-size: 16px; font-weight: 400; line-height: 30px } .layer-pop-wrap.type-new .common-point-note .dotted-list .list-cell:before { top: 12px; width: 4px; height: 4px; background-color: #595959; } /* 즐겨찾기 팝업 */ .user-match-set.type-new { padding: 90px 0 60px; text-align: center; } .user-match-set.type-new .set-info-title { margin-bottom: 30px; font-size: 24px; font-weight: 700; line-height: normal; } .user-match-set.type-new .set-info { color: #2B2F36; font-size: 18px; font-weight: 400; } .layer-pop-wrap.type-new a.btn-basic, .layer-pop-wrap.type-new button.btn-basic, .layer-pop-wrap.type-new input[type=submit].btn-basic { width: 300px; min-width: inherit; height: auto; padding: 20px 0; } .layer-pop-wrap.type-new .btn-outline-gray { color: #193d71; border: 1px solid #c3cad6; font-size: 18px; line-height: 23px; font-weight: 700; } .layer-pop-wrap.type-new .btn-darkblue { color: #fff; background: #193d71; font-size: 18px; line-height: 23px; font-weight: 700; } .layer-pop-wrap.type-new a.btn-round, .layer-pop-wrap.type-new button.btn-round, .layer-pop-wrap.type-new input[type=submit].btn-round { border-radius: 5px; } /* 탭메뉴 디자인변경 */ .layer-pop-wrap.type-new .ui_tabs1 .page-tab { margin: 60px 0 20px; } .tab-data-group.type-new .tab-data { padding: 30px 0; border-top: 1px solid #193D71; border-bottom: 1px solid #D2D7E1; } .tab-data-group.type-new .aplp-data-wrap { margin-top: 0; } .tab-data-group.type-new .detail-title { font-size: 18px; font-weight: 700; } .tab-data-group.type-new .detail-content { color: #2B2F36; font-size: 16px; font-weight: 400; } /* 검색필터 팝업 layer-pop-parent type-filter-new */ .layer-pop-parent.type-filter-new .pop-data { max-width: 1340px; background-color: #1c3e70; border-radius: 35px; } .layer-pop-parent.type-filter-new .pop-header { position: relative; padding: 40px 30px 20px; } .layer-pop-parent.type-filter-new .pop-header::before { content: ''; position: absolute; display: block; left: 30px; bottom: 0; width: calc(100% - 60px); height: 2px; background-color: #fff; opacity: 0.2; } .layer-pop-parent.type-filter-new .pop-header .pop-header-title { position: relative; color: #fff; font-size: 20px; font-style: normal; font-weight: 400; line-height: normal; } .layer-pop-parent.type-filter-new .pop-body { max-height: 500px; padding: 40px 40px 30px; display: flex; flex-direction: column; gap: 40px; align-items: stretch; } .layer-pop-parent.type-filter-new .pop-body fieldset { width: 100%; max-width: 1100px; margin: 0 auto; } .layer-pop-parent.type-filter-new .pop-body .form-data-group .form-data .item-subject { color: #fff; font-size: 16px; font-weight: 500; line-height: normal; } .layer-pop-parent.type-filter-new .pop-body .form-data-group .form-data .item-list-content { margin-top: 20px; } .layer-pop-parent.type-filter-new .pop-body .form-data-group .form-data .item-list-content .item-list { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px; margin: 0; } .layer-pop-parent.type-filter-new .pop-body .form-data-group .form-data .item-list-content .item-list .list-cell { display: flex; width: 132px; height: 40px; justify-content: center; align-items: center; padding: 0; } .layer-pop-parent.type-filter-new .pop-body .form-data-group .form-data .item-list-content .item-list .list-cell .form-square-box { width: 100%; height: 100%; } .layer-pop-parent.type-filter-new .pop-body .form-data-group .form-data .item-list-content .item-list .list-cell input[type="checkbox"] { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .layer-pop-parent.type-filter-new .pop-body .form-data-group .form-data .item-list-content .item-list .list-cell .visual-square-box { margin-top: 0; font-size: 14px; font-style: normal; font-weight: 500; line-height: normal; } .layer-pop-parent.type-filter-new .form-square-box input[type=checkbox]+.check-outline-orange, .layer-pop-parent.type-filter-new .form-square-box input[type=radio]+.check-outline-orange { color: #BABABA; /*border: 1px solid #49648C;*/ background: #103367; } .layer-pop-parent.type-filter-new .form-square-box input[type=checkbox]:checked+.check-outline-orange, .layer-pop-parent.type-filter-new .form-square-box input[type=radio]:checked+.check-outline-orange { color: #fff; border: 1px solid #e37500; background: #e37500; } .layer-pop-parent.type-filter-new .pop-footer { padding: 30px 40px 40px; } .layer-pop-parent.type-filter-new .form-round-box { width: 100%; height: 100%; } .layer-pop-parent.type-filter-new .form-round-box .visual-round { margin-top: 0; color: #BABABA; border: 1px solid #49648C; background: #1C3E70; border-radius: 0; transition: none; } .layer-pop-parent.type-filter-new .form-round-box input[type=checkbox]+.check-outline-orange, .layer-pop-parent.type-filter-new .form-round-box input[type=radio]+.check-outline-orange { color: #BABABA; border: 1px solid #49648C; background: #1C3E70; } .layer-pop-parent.type-filter-new .form-round-box input[type=checkbox]:checked+.check-outline-orange, .layer-pop-parent.type-filter-new .form-round-box input[type=radio]:checked+.check-outline-orange { color: #e37500; border: 1px solid #e37500; padding: 9px 40px 9px 20px; background: url(../images/icon/chip-chk.svg) no-repeat 82% 48%; } .layer-pop-parent.type-filter-new .pop-footer .btn-pop-wrap { gap: 20px; } .layer-pop-parent.type-filter-new .pop-footer .btn-pop-wrap .btn-basic { display: flex; align-items: center; justify-content: center; flex: 1; height: 64px; padding: 0; font-size: 20px; font-weight: 700; line-height: normal; } .layer-pop-parent.type-filter-new .pop-footer .btn-pop-wrap .btn-basic .search-result-wrap { display: inline-block; width: auto; margin-left: 4px; font-size: 14px; font-weight: 400; line-height: normal; } .layer-pop-parent.type-filter-new .pop-footer .btn-pop-wrap .btn-basic.btn-blue { color: #fff; background: #2F5792; border: 1px solid #2F5792; } .layer-pop-parent.type-filter-new .pop-footer .btn-pop-wrap .btn-basic:first-of-type { flex: 0 0 70%; } .layer-pop-parent.type-filter-new .btn-pop-close { position: absolute; top: 35px; right: 25px; display: block; width: 30px; height: 30px; font-size: 0; background: url(../images/icon/icon_pop_close_white_24.svg) center center no-repeat; z-index: 15; background-size: 20px; } /* //2025-08-19 : HDH : 레이어 팝업 디자인 개선 */ /* 상품 상세 공유하기 팝업 공통화 */ .toast-pop-data.view-social.actived { position: absolute; width: 248px; top: 100%; left: -105px; margin-top: 0; margin-left: 0; height: 99px; padding: 34px 23px 0; background: url('../images/common/bg_sns.png') no-repeat center center; } .toast-pop-data.view-social .share-sns-wrap { display: flex; justify-content: space-evenly; } .view-tab-btns .toast-pop-data.view-social .share-sns-wrap>div { margin: 0; } .view-tab-btns .toast-pop-data.view-social .share-sns-wrap .share-sns { width: 40px; height: 40px; background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; text-indent: -9999em; line-height: 0; } .view-tab-btns .toast-pop-data.view-social .share-sns-wrap .share-sns { padding: 0; font-size: 0; } .toast-pop-data.view-social .share-sns-wrap .facebook { background-image: url('../images/icon/ic_facebook.png'); margin-left: 0; } .toast-pop-data.view-social .share-sns-wrap .kakao { background-image: url('../images/icon/ic_kakao.png'); } .toast-pop-data.view-social .share-sns-wrap .link { background-image: url('../images/icon/ic_url.png'); } .view-tab-btns .toast-pop-data.view-social .share-sns-wrap .share-sns:after { content: none; } /* //상품 상세 공유하기 팝업 공통화 */ /* modal popup */ .modal-popup { z-index: 100; display: none; justify-content: center; align-items: center; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; } .modal-popup.on { display: flex; } .pop-content { position: relative; width: 820px; max-width: 1410px; margin: 0 auto; min-height: 700px; height: auto; max-height: calc(100vh - 100px); padding: 32px 40px 60px 40px; background: #fff; border-radius: 36px; } .pop-content .pHead { position: relative; } .pop-content .pHead::after { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: #193D71; z-index: 1; } .pop-content .pHead h1 { position: relative; display: inline-block; padding: 0 0 18px; color: #1C3E70; font-weight: 700; font-size: 20px; line-height: normal; } .pop-content .pHead h1::after { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: #F58220; z-index: 2; } .pop-content .content { height: auto; max-height: 300px; overflow-y: auto; } .pop-content .popupClose { position: absolute; top: 30px; right: 30px; width: 30px; height: 30px; background: url('../images/icon/icon_pop_close_black.svg') no-repeat center center; font-size: 0; text-indent: -9999em; line-height: 0; } .pop-content [class*="board_data-round"] { overflow: auto; padding: 0; margin-bottom: 0; max-height: 500px; } .pop-content [class*="board_data-round"] .th-cols { width: 860px; } .channel-box .boxs { margin-top: 40px; padding: 50px 0 50px; background-color: #F4F6F8; border-radius: 24px; text-align: center; } .channel-box .tit-txt { font-size: 36px; line-height: 46px; } .channel-box .tit-txt strong { border-bottom: 1px solid #193D71; color: #193D71; font-size: 36px; line-height: 46px; vertical-align: top; } .channel-box .txt { margin-top: 20px; font-size: 18px; line-height: 28px; } .channel-box .tit { margin-top: 60px; font-size: 20px; line-height: 30px; text-align: center; font-weight: bold; } .channel-box .list { display: flex; padding-top: 25px; } .channel-box .list li { display: flex; justify-content: center; align-items: center; width: calc(100% / 3); height: 50px; margin-left: -1px; border: 1px solid #D2D7E1; } .channel-box .list li span { position: relative; padding-left: 25px; } .channel-box .list li span::after { position: absolute; top: 5px; left: 0; content: ""; width: 15px; height: 6px; border-left: 2px solid; border-bottom: 2px solid; border-color: #f58220; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } .channel-box .desc { margin: 20px 0 0 14px; color: #8C94A3; font-size: 14px; line-height: 20px; text-indent: -14px; font-weight: 400; } .dim { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); } .flex-btn-center { padding-top: 40px; text-align: center; padding-bottom: 30px; } .channel-box .btn-identi { width: 300px; display: flex; justify-content: center; align-items: center; background-color: #193D71; margin: 0 auto; padding: 0 18px; font-weight: 700; font-size: 14px; color: #fff; min-width: 98px; height: 44px; line-height: 20px; border-radius: 6px; } /* 2025-08-22 HDH : 구성종목 인포박스 디자인 개선 */ .product-basic-info.type-new { padding-bottom: 0; } .product-basic-info.type-new .product-basic-info-table { padding: 0; background-color: transparent; } .product-basic-info.type-new .product-basic-info-table .info-inner .info-cell .info-value.product-subject { padding-bottom: 30px; font-size: 30px; font-weight: 700; line-height: normal } .product-basic-info.type-new .product-basic-info-table .info-inner .info-cell .info-value.product-subject .item-subject { font-size: 20px; } .product-basic-info.type-new .info-card-box { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 30px; background-color: #ffede4; border-radius: 10px; } .product-basic-info.type-new .info-card-box .info-card-box-cell { width: 25%; } .product-basic-info.type-new .info-card-box .info-card-box-cell .info-title { font-size: 18px; font-weight: 500; line-height: normal; } .product-basic-info.type-new .info-card-box .info-card-box-cell .info-value { margin-top: 10px; font-size: 24px; font-weight: 700; line-height: normal; } /* //2025-08-22 HDH : 구성종목 인포박스 디자인 개선 */ /* 2025-08-22 HDH : 전체상품 보기 팝업 디자인 개선 */ .layer-pop-wrap.type-all-product .pop-data { max-width: 1330px; } .layer-pop-wrap.type-all-product .line-up-label-info { position: static; justify-content: flex-end; margin: 30px 0; } .layer-pop-wrap.type-all-product .line-up-list { margin: 0; padding: 0; } .layer-pop-wrap.type-all-product .line-up-list .list-inner { display: grid; grid-template-columns: repeat(3, 1fr); /* grid-auto-rows: max-content; */ gap: 40px; } .layer-pop-wrap.type-all-product .line-up-list .list-inner .list-cell { padding: 0; width: auto; } .layer-pop-wrap.type-all-product .line-up-list dt { padding-bottom: 14px; margin-bottom: 14px; border-bottom: 1px solid #e0e0e0; } .layer-pop-wrap.type-all-product .line-up-list dd { margin-bottom: 14px; } /* //2025-08-22 HDH : 전체상품 보기 팝업 디자인 개선 */ .allotment-wrap.type-new .data-view-sort { margin-bottom: 20px; gap: 20px; } .allotment-wrap.type-new .data-view-sort .sort-label { color: #2b2f36; font-size: 14px; font-weight: 400; margin-right: 0; } .allotment-wrap.type-new .data-view-sort .form-select.middle-size { font-size: 16px; border-bottom: none; font-weight: 500; color: #2b2f36; height: auto; background: url("../images/icon/icon_selectdown.svg")no-repeat right center; margin-bottom: 3px; } .allotment-wrap.type-new .data-view-sort .sort-value:before { content: none; } .allotment-wrap.type-new .data-view-sort .basic-date { color: #2b2f36; font-size: 14px; font-weight: 400; } .allotment-wrap.type-new .data-view-sort .btn-question { width: 16px; height: 16px; margin-left: 6px; background: url("../images/icon/icon_info.svg"); } .allotment-wrap.type-new .sort-group { gap: 20px; } .allotment-wrap.type-new .sort-group .btn-data-inquiry { border: none; margin-left: 0; padding: 0 15px; color: #193d71; font-size: 16px; font-weight: 500; } .allotment-wrap.type-new .discription { margin-bottom: 30px; } .allotment-wrap.type-new .discription p { font-size: 14px; color: #6a7180; font-weight: 400; line-height: normal; margin-bottom: 9px; } .allotment-wrap.type-new .discription p:last-of-type { margin-bottom: 0; } .allotment-wrap.type-new .chart .read-table>p { text-align: left; margin-bottom: 30px; font-size: 20px; color: #2b2f36; } .allotment-wrap.type-new .sort-group+.sort-group { margin-left: 0; } .allotment-wrap.type-new .board-search-wrap { margin-left: 0; width: 666px; background: url("../images/icon/icon_header_search.svg") no-repeat right top/20px; } .allotment-wrap.type-new .board-search-wrap input, .allotment-wrap.type-new .board-search-wrap input:placeholder-shown, .allotment-wrap.type-new .board-search-wrap input::placeholder { font-size: 20px; color: #1C3E70 !important; font-weight: 400; } .allotment-wrap.type-new .board-search-wrap .form-input-item::after { background: #1C3E70; } .allotment-wrap.type-new .board-list-sort.down { position: static; margin-left: auto; } .allotment-wrap.type-new .board-list-sort.down a { padding: 8px 18px 8px 38px; height: auto; background: #fff; border: 1px solid #C3CAD6; border-radius: 5px; color: #193d71; font-size: 14px; font-weight: 500; line-height: normal; background: url("../images/icon/icon_excel.svg")no-repeat 18px center; } .allotment-wrap.type-new .read-table table>tbody>tr { border-bottom: 1px solid #D2D7E1; } .allotment-wrap.type-new .read-table table>thead>tr>th { background: #fff; } .allotment-wrap.type-new .product-info-table .read-table table>thead { height: 80px; } .allotment-wrap.type-new .product-info-table .read-table table>thead>tr>th { background: #fff; color: #2b2f36; font-size: 18px; font-weight: 700; } .allotment-wrap.type-new .read-table table>thead>tr+tr { border: none; } .allotment-wrap.type-new .chart .read-table table>tbody>tr>td:nth-of-type(2) { text-align: center; } .allotment-wrap.type-new .chart .read-table table>tbody>tr>td { color: #2b2f36; font-size: 18px; line-height: normal; text-overflow: ellipsis; overflow: hidden; white-space: wrap; word-break: keep-all; } .allotment-wrap.type-new .product-info-table .read-table.for-padding .toggle-table>thead { height: 122px; } .allotment-wrap.type-new .product-info-table .read-table.for-padding .toggle-table>thead>tr>th.on span::after { background-image: url("../images/icon/icon-table-sort-actived.svg"); } .allotment-wrap.type-new .product-info-table .read-table.for-padding .toggle-table>thead>tr>th span::after { background-image: url('../images/icon/icon-table-sort-default.svg'); } .allotment-wrap.type-new .product-info-table .read-table.for-padding .toggle-table>thead>tr>th.th_sort_value { height: auto; border-left: none; } .allotment-wrap.type-new .product-info-table .read-table table>thead>tr>th { border-left: none; } .allotment-wrap.type-new .product-info-table .read-table table>thead>tr:nth-of-type(1)>th { font-size: 18px; font-weight: 500; color: #2b2f36; } .allotment-wrap.type-new:not(.overall) .product-info-table .read-table table>thead>tr:nth-of-type(1)>th:not(:first-of-type) { vertical-align: bottom; } .allotment-wrap.type-new .product-info-table .read-table table>thead>tr:nth-of-type(2)>.th_sort_value { font-size: 16px; font-weight: 500; color: #2b2f36; } .allotment-wrap.type-new .product-info-table .read-table table>thead>tr:nth-of-type(2)>.th_sort_value span { border-bottom: 2px solid #2b2f36; padding-bottom: 2px; } .allotment-wrap.type-new .product-info-table .read-table.for-padding table>tbody>tr>td { padding: 40px 0; font-size: 18px; color: #2b2f36; } .allotment-wrap.type-new .product-info-table .read-table table>tbody>tr>td.text-left .title { font-size: 24px; color: #2b2f36; font-weight: 700; } .allotment-wrap.type-new .product-info-table .read-table table>tbody>tr>td.text-left .code { font-size: 18px; color: #2b2f36; font-weight: 500; margin-top: 10px; } .allotment-wrap.type-new .product-info-table .read-table table>tbody>tr>td.text-left .price { font-size: 20px; color: #2b2f36; font-weight: 400; margin-top: 35px; } .allotment-wrap.type-new .product-info-table .read-table table>tbody>tr>td.text-left .price span { font-size: 12px; font-weight: 500; margin-right: 10px; } .overall.allotment-wrap.type-new .product-info-table .read-table.for-padding .toggle-table>thead { height: 80px; vertical-align: middle; border-top: 1px solid #193D71; } .allotment-wrap.type-new .product-info-table .read-table table>thead>tr>th { font-weight: 700; } .allotment-wrap.type-new .data-view-sort .form-select.middle-size[name=selectMonth] { width: 37px; } .allotment-wrap.type-new .c-data-handler { margin-bottom: 70px; } .allotment-wrap.type-new .product-info-table .read-table.for-padding .toggle-table>thead>tr>th.up span::after { transform: none; } .allotment-wrap.type-new .product-info-table .read-table.for-padding .toggle-table>thead>tr>th.down span::after { transform: rotate(180deg); } /* 2025-08-30 : HDH : 뉴스 리스트 높이 수정 */ .IMCIntrcnList .c-card[data-type="article"], .IMCIntrcnList .c-card[data-type="news"] { height: 100%; } .air-datepicker-global-container { z-index: 999999; } .air-datepicker-overlay { z-index: 1000000 !important; } /* 로그인페이지 관련 css 추가 - 25.10.13 */ #contents.member { width: 1490px; margin: 0 auto; } #contents.member .page-title { font-size: 54px; line-height: 85px; } .login-flexbox { display: flex; padding: 8px 0 120px; justify-content: space-between; } .login-flexbox .inner-flex [class*="btn-"] { display: flex; justify-content: center; align-items: center; width: 100%; height: 78px; border-radius: 10px; font-weight: 700; font-size: 20px; line-height: 28px; } .login-flexbox .inner-flex { width: 570px; } .login-flexbox .page-title { margin-bottom: 60px; font-size: 54px; line-height: 85px; text-align: center; } .login-flexbox .btn-kakao { background: #F8DA24 url(/tigeretf/common_kr/pc/images/icon/ico_kakao.png) no-repeat 40px center; color: #1a1a1a; } .login-flexbox .btn-google { margin-top: 62px; background: #fff url(/tigeretf/common_kr/pc/images/icon/ico_google.png) no-repeat 40px center; border: 1px solid #C3CAD6; color: #193D71; } .login-flexbox .btn-naver { margin-top: 62px; background: #fff url(/tigeretf/common_kr/pc/images/icon/ico_naver.png) no-repeat 40px center; border: 1px solid #C3CAD6; color: #193D71; } .find-id-pw p { margin-top: 18px; } .login-flexbox p.error, .find-id-pw p.error { color: #FC1B1B; } .login-flexbox .checked { margin-top: 30px; vertical-align: top; } .login-flexbox p.error { margin-top: 18px; } .login-flexbox .checked input.checked-radio, .login-flexbox .checked input.checked-checkbox { position: absolute; width: 24px; height: 24px; border: 0; appearance: none; } .login-flexbox .checked input.checked-radio+label, .login-flexbox .checked input.checked-checkbox+label { display: inline-block; position: relative; width: 24px; height: 24px; background: #fff; border-radius: 50%; border: 2px solid #6A7180; font-size: 0; text-indent: -99999em; line-height: 0; } .login-flexbox .checked input.checked-checkbox+label::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s ease; width: 0; height: 0; border-radius: 50%; } .login-flexbox .checked input.checked-checkbox:checked+label::after { width: 24px; height: 24px; background: #DF6D1B url('/tigeretf/common_kr/pc/images/common/bullt_checked_24x24.png') no-repeat center center; border: 0; } .login-flexbox .checked .click>span { padding-left: 36px; font-size: 16px; line-height: 20px; white-space: nowrap; color: #1a1a1a; } .login-flexbox .btnDecide { min-width: 100%; width: 100%; margin-top: 38px; } .login-flexbox .ui_btn-basis2 { display: block; overflow: hidden; position: relative; width: 300px; height: 64px; background-color: #193D71; } .login-flexbox .ui_btn-basis2:hover { background-color: #F58220; color: #fff; } .login-flexbox .ui_btn-basis2 .hover { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background: #D96600; transform: scale(0, 1); -webkit-transform: scale(0, 1); transform-origin: 0 100%; -webkit-transform-origin: left right; transition: all .5s ease-out; -webkit-transition: all .5s ease-out; } .login-flexbox .ui_btn-basis2:hover .hover { transform: scale(1, 1); -webkit-transform: scale(1, 1); } .login-flexbox .ui_btn-basis2 span { position: relative; transition: color .25s ease-out; -webkit-transition: color .5s ease-out; margin: 0; color: #fff; font-weight: 700; font-size: 20px; line-height: 28px; } /* 회원가입 관련 css */ .step { display: flex; justify-content: end; position: relative; top: -70px; } .step>li { position: relative; width: 56px; height: 60px; margin-left: 10px; font-size: 0; text-indent: -9999em; line-height: 0; } .step>li::before, .step>li::after { content: ''; display: block; clear: both; position: absolute; top: 50%; transform: translateY(-50%); } .step>li::before { right: 0; width: 16px; height: 16px; background-color: #1C3E70; border-radius: 50%; } .step>li::after { left: 0; width: 30px; height: 2px; background-color: rgba(112, 112, 112, .16); } .step>li:first-child { margin-left: 0; } .step>li:first-child::after { display: none; } .step>li.on { width: 171px; } .step>li.on::before { display: flex; justify-content: center; align-items: center; width: 131px; height: 60px; background-color: #DF6D1B; border-radius: 30px; color: #fff; font-weight: 500; font-size: 20px; line-height: 30px; } .step>li.on:nth-child(1)::before { content: '가입인증'; } .step>li.on:nth-child(2)::before { content: '약관동의'; } .step>li.on:nth-child(3)::before { content: '정보입력'; } .step>li.on:nth-child(4)::before { content: '가입완료'; } /* 회원가입 : STEP01 */ .signup>.title-group { margin-bottom: 120px; border-bottom: 1px solid #193D71; } .step-accre .tit-txt { font-size: 30px; text-align: center; line-height: 46px; } .step-accre .tit-txt [class*="color"] { display: inline-block; font-weight: 700; font-size: 30px; line-height: 46px; vertical-align: top; } .step-accre .tit-txt .color1 { color: #1C3E70; } .step-accre .tit-txt .color2 { color: #DF6D1B; } .step-accre .flex { display: flex; margin-top: 59px; } .step-accre .flex>div { width: calc(100% / 2); height: 577px; padding: 55px 40px 0; } .step-accre .conv, .step-accre .phone { background-color: #fff; border-radius: 30px; } .step-accre .conv { margin-right: 15px; } .step-accre .phone { margin-left: 15px; background: #fff url('/tigeretf/common_kr/pc/images/icon/ico_phone.png') no-repeat center center; } .step-accre .flex h2 { color: #1C3E70; font-size: 36px; text-align: center; line-height: 48px; font-weight: 700; } .step-accre .flex p { margin-top: 19px; font-weight: 500; font-size: 14px; line-height: 20px; letter-spacing: 0; } .step-accre .phone p { text-align: center; } .step-accre .flex [class*="btn-"] { display: flex; justify-content: center; align-items: center; width: 100%; height: 78px; border-radius: 10px; font-weight: 700; font-size: 20px; line-height: 28px; } .step-accre .flex .btn-kakao { margin-top: 39px; background: #F8DA24 url('/tigeretf/common_kr/pc/images/icon/ico_kakao.png') no-repeat 40px center; } .step-accre .flex .btn-naver { margin-top: 40px; background: #fff url('/tigeretf/common_kr/pc/images/icon/ico_naver.png') no-repeat 40px center; color: #19241e; border: 1px solid #C3CAD6; } .step-accre .flex .btn-google { margin-top: 40px; background: #fff url('/tigeretf/common_kr/pc/images/icon/ico_google.png') no-repeat 40px center; border: 1px solid #C3CAD6; color: #193D71; } .step-accre .flex .btn-phone { margin-top: 313px; background-color: #193D71; color: #fff; } /* 회원가입 약관 */ .step-terms { padding: 0 21px; } .step-terms h2 { color: #1c3e70; font-size: 36px; line-height: 48px; font-weight: 700; } .step-terms .content { height: 380px; } .step-terms .mCSB_scrollTools { width: 5px; background-color: #EDEFF3; } .step-terms .mCSB_scrollTools .mCSB_draggerRail { background-color: #EDEFF3; } .step-terms .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { height: 60px; background-color: rgba(210, 215, 225, 1); } .step-terms .btn01_basisH44 { margin-top: 40px; } .step-terms .checked { display: flex; align-items: center; } .step-terms .checked input[class="checked-radio"], .step-terms .checked input.checked-checkbox { display: none; } .step-terms .checked input[class="checked-radio"]+label, .step-terms .checked input.checked-checkbox+label { position: relative; display: flex; align-items: center; } .step-terms .checked input.checked-radio+label::before, .step-terms .checked input.checked-checkbox+label::before { content: ''; display: inline-block; position: relative; width: 36px; height: 36px; background: #fff; border-radius: 50%; border: 2px solid #6A7180; font-size: 0; text-indent: -99999em; line-height: 0; box-sizing: border-box; } .step-terms .checked input.checked-checkbox+label::after { content: ''; display: block; position: absolute; top: 50%; left: 0; transition: all 0.2s ease; transform: translate(calc(-50% + 18px), -50%); width: 0; height: 0; border-radius: 50%; } .step-terms .checked input.checked-checkbox:checked+label::after { width: 36px; height: 36px; background: #DF6D1B url('/tigeretf/common_kr/pc/images/common/bullt_checked_24x24.png') no-repeat center center; border: 0; } .step-terms .checked label h3 { margin-left: 16px; font-size: 24px; line-height: 33px; font-weight: 700; white-space: nowrap; } .step-terms .checked label h3 .color-red { color: #FC1B1B; } .step-terms .accordion-list .accordion-cell { border-color: #E0E0E0; } .step-terms .accordion-list .accordion-content, .step-terms .accordion-list .accordion-content .accordion-detail .accordion-detail-content { max-height: inherit; overflow: hidden; background-color: #fafafa; } .step-terms .accordion-list .accordion-content { border-top: 1px solid #E0E0E0; } .step-terms .accordion-list .btn-accordion-menu { width: 36px; height: 26px; border: 1px solid #e4e4e4; } .step-terms .accordion-list .btn-accordion-menu:after { background: url('/tigeretf/common_kr/pc/images/icon/icon_accordion_arrow_21.png') no-repeat center center; } .step-terms .accordion-list .accordion-content .scroll-box { max-height: 380px; overflow-y: auto; } .step-terms .accordion-list .accordion-content .scroll-box::-webkit-scrollbar { width: 5px; } .step-terms .accordion-list .accordion-content .scroll-box::-webkit-scrollbar-button { display: none; } .step-terms .accordion-list .accordion-content .scroll-box::-webkit-scrollbar-track-piece { background-color: #EDEFF3; } .step-terms .accordion-list .accordion-content .scroll-box::-webkit-scrollbar-thumb { background-color: #D2D7E1; } .step-terms .btnDecide { display: flex; justify-content: center; align-items: center; min-width: 210px; width: 330px; height: 78px; margin: 60px auto 0; padding: 0 15px; background-color: #193D71; border-radius: 10px; color: #fff; font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: 0; } .step-terms .accordion-list .accordion-content .accordion-detail .accordion-detail-content .title { margin: 30px 0 5px; color: #2B2F36; font-size: 16px; line-height: 24px; } .step-terms .accordion-list .accordion-content .accordion-detail .accordion-detail-content .scroll-box div:first-child .title { margin-top: 0; } .step-terms .accordion-list .accordion-content .accordion-detail .accordion-detail-content p, .step-terms .accordion-list .accordion-content .accordion-detail .accordion-detail-content li { color: #2B2F36; font-size: 16px; line-height: 28px; font-weight: 400; } /* 회원가입 정보입력 */ .input-flex { display: flex; } .input-flex .input-label { margin-right: 15px; } .input-flex .input-label input { width: 100%; } .input-flex .input-label+.input-label { margin: 30px 0 0 15px; } .input-label { display: flex; align-items: center; } .step-input h2 { color: #1C3E70; font-weight: 700; font-size: 36px; text-align: center; line-height: 42px; } /* 간편인증 연동 정보 */ .sns-linked-info { width: 690px; margin: 0 auto 30px; } .sns-linked-info .sns-badge { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 16px 20px; border-radius: 8px; } .sns-linked-info .sns-icon { display: inline-block; width: 24px; height: 24px; background-size: contain; background-repeat: no-repeat; background-position: center; } .sns-linked-info .sns-icon.kakao-icon { background-image: url('/tigeretf/common_kr/pc/images/icon/ico_kakao.png'); } .sns-linked-info .sns-icon.naver-icon { width: 20px; height: 20px; background-color: #fff; border-radius: 3px; } .sns-linked-info .sns-icon.naver-icon::after { content: 'N'; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 14px; font-weight: 700; color: #03C75A; } .sns-linked-info .sns-icon.google-icon { background-image: url('/tigeretf/common_kr/pc/images/icon/ico_google.png'); } .sns-linked-info .sns-icon.facebook-icon { background-image: url('/tigeretf/common_kr/pc/images/icon/ico_facebook.png'); } .sns-linked-info .sns-text { font-size: 16px; font-weight: 600; line-height: 24px; } .sns-linked-info .sns-badge.kakao { background-color: #FEE500; } .sns-linked-info .sns-badge.kakao .sns-text { color: #191919; } .sns-linked-info .sns-badge.naver { background-color: #03C75A; } .sns-linked-info .sns-badge.naver .sns-text { color: #fff; } .sns-linked-info .sns-badge.google { background-color: #fff; border: 1px solid #E0E0E0; } .sns-linked-info .sns-badge.google .sns-text { color: #333; } .sns-linked-info .sns-badge.facebook { background-color: #1877F2; } .sns-linked-info .sns-badge.facebook .sns-text { color: #fff; } .info-input { width: 690px; margin: 59px auto 0; } .info-input .btnDupli { min-width: 80px; width: auto; height: 36px; margin-right: 20px; background-color: #1C3E70; border-radius: 6px; color: #fff; font-weight: 500; font-size: 14px; line-height: 20px; letter-spacing: 0; padding: 0 15px; } .info-input .btnDupli:disabled { background-color: #EDEFF3; color: #8C94A3; } .info-input p { margin-top: 18px; letter-spacing: 0; color: #2B2F36; } .info-input p.error { color: #FC1B1B; } .info-input p.confirm { color: #1C3E70; font-weight: 500; } .output-line { display: flex; align-items: center; height: 108px; border-bottom: 1px solid #1C3E70; } .output-line .output-text, .output-line [type="text"] { width: 100%; height: 100%; padding: 0 20px; background-color: transparent; border: 0; color: #1C3E70; font-weight: 500; font-size: 24px; line-height: 34px; outline: none; cursor: auto; } .output-line input[type=text]:read-only { opacity: 1; } .output-line .output-text { display: flex; align-items: center; } .output-line p { margin: 0 30px 0 0; white-space: nowrap; } .output-line .label-wrap { width: 100%; } .step-input .ui_flex-center { display: flex; align-items: center; justify-content: center; min-width: 1000px; width: 100%; max-width: 1410px; margin: 60px auto 0; } .step-input .btnDecide, .step-input .btnDecide3 { display: flex; justify-content: center; align-items: center; min-width: 210px; width: 330px; height: 78px; margin: 0 auto; padding: 0 15px; background-color: #193D71; border-radius: 10px; color: #fff; font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: 0; } /* 회원가입 완료 */ .step-complete h2 { color: #1C3E70; font-weight: 400; font-size: 60px; text-align: center; line-height: 86px; letter-spacing: -2px; } .step-complete dl { display: flex; justify-content: center; align-items: center; padding-top: 84px; } .step-complete dl dt, .step-complete dl dd { color: #2B2F36; font-size: 30px; line-height: 42px; } .step-complete dl dt { margin-right: 20px; font-weight: 700; } .step-complete dl dd { margin-right: 100px; } .step-complete .btnDecide { display: flex; justify-content: center; align-items: center; min-width: 210px; width: 330px; height: 78px; margin: 89px auto 0; padding: 0 15px; background-color: #193D71; border-radius: 10px; color: #fff; font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: 0; } .step-complete .flex { display: flex; padding: 60px 90px; flex-wrap: wrap; margin-top: 120px; background-color: #FAFAFA; border-radius: 30px; justify-content: space-between; } .step-complete .flex h3 { width: 100%; margin-bottom: 60px; color: #F58220; font-weight: 700; font-size: 36px; text-align: center; line-height: 48px; } .step-complete .flex h3 .color-blue { color: #193D71; } .step-complete .flex>div { width: calc(50% - 20px); padding: 30px; border-radius: 30px; background: #fff; } .step-complete .flex h4 { display: flex; align-items: baseline; color: #1C3E70; font-weight: 700; font-size: 24px; line-height: 34px; } .step-complete .flex h4 em { display: flex; justify-content: center; align-items: center; width: 66px; height: 66px; margin-right: 30px; background-color: #F58220; border-radius: 50%; color: #fff; font-size: 16px; font-weight: 700; letter-spacing: 0; } .step-complete .flex ul { margin: 0 0 0 96px; } .step-complete .flex ul>li { position: relative; margin-top: 18px; padding-left: 15px; } .step-complete .flex ul>li::after { content: ''; display: block; clear: both; position: absolute; top: 8px; left: 0; width: 5px; height: 5px; background-color: #2B2F36; border-radius: 50%; } .step-complete .flex ul>li .color { display: block; color: #D93B3B; } .step-complete .banner-wrap { margin-top: 120px; } .step-complete .banner-wrap a img { width: 100%; } /* 로그인 : 아이디&비밀번호 찾기 */ .find-id-pw { margin-top: 58px; } .find-id-pw .flex .tab { display: flex; justify-content: center; align-items: center; min-width: 11rem; width: 100%; height: 60px; margin: 0 0 0 -0.1rem; background-color: #edeff3; border: 1px solid #c3cad6; color: #7e8693; font-weight: 500; font-size: 18px; line-height: 26px; flex: 1; } .find-id-pw .flex .tab.on { background: #fff; border: 2px solid #1c3e70; border-bottom: 2px solid #df6d1b; color: #193d71; font-weight: 700; font-size: 22px; } .find-id-pw [class*="ui_tabs"] .tab.on { z-index: 1; } .find-id-pw .tabpanel { display: none; width: 690px; margin: 116px auto 0 !important; } .find-id-pw .tabpanel.on { display: block; } .find-id-pw .tit { margin-bottom: 89px; color: #2B2F36; font-weight: 700; font-size: 30px; text-align: center; line-height: 42px; } .find-id-pw .checked { margin-top: 30px; vertical-align: top; } .find-id-pw .checked .click>span { padding-left: 36px; font-size: 16px; line-height: 20px; white-space: nowrap; } .find-id-pw .checked+.error { margin-left: 39px; } .find-id-pw .explain { width: 990px; margin: 120px auto 0; padding-top: 57px; border-top: 1px solid #D2D7E1; } .find-id-pw .explain h3 { padding: 0 0 28px; color: #d93b3b; font-weight: 700; font-size: 24px; line-height: 3.4rem; } .find-id-pw .explain p { position: relative; margin-top: 18px; padding-left: 15px; } .find-id-pw .explain p::after { content: ""; position: absolute; top: 0.5lh; left: 0; width: 5px; height: 5px; background-color: #2b2f36; border-radius: 50%; transform: translateY(-50%); } .find-id-pw .btnDecide { margin-top: 40px; } .find-id-pw .top-line { padding-top: 120px; border-top: 2px solid #1C3E70; } .find-id-pw .top-line .text-certified { padding: 0 0 270px; background: url('/tigeretf/common_kr/pc/images/icon/ico_phone.png') no-repeat center calc(100% + 22px) / 180px 180px; font-weight: 700; font-size: 30px; text-align: center; line-height: 42px; } .find-id-pw .top-line .text-certified+.btn-flex>a { margin-top: 100px; } .find-id-pw .txt-tit { display: flex; margin-top: 90px; justify-content: center; align-items: center; font-weight: 700; font-size: 42px; text-align: center; line-height: 60px; } .find-id-pw .txt-tit .name { margin: 0 20px 0; color: #F58220; font-weight: 700; font-size: 42px; line-height: 60px; } .find-id-pw .txt-txt { margin-bottom: 90px; font-size: 30px; text-align: center; line-height: 42px; } .find-id-pw .txt-txt02 { margin-bottom: 90px; font-size: 24px; text-align: center; line-height: 34px; } .find-id-pw .txt-txt02 .color { color: #F58220; } .find-id-pw .txt-last-login { display: inline-block; margin-top: 30px; padding: 0 20px; border-radius: 23px; background: #F7F7F7; color: #474747; font-size: 18px; line-height: 45px; } .find-id-pw .btn-flex { display: flex; justify-content: space-between; align-items: center; width: 690px; margin: 60px auto 0; } .find-id-pw .btn-flex.center { justify-content: center; } .find-id-pw .ui_btn-basis2 { height: 78px; } .find-id-pw .ui_btn-basis2.w450 { min-width: 450px; margin: 0 auto 0; } body .ui_btn-basis2:hover .hover { transform: scale(1, 1); -webkit-transform: scale(1, 1); } .find-id-pw .ui_btn-basis2.w690 { min-width: 690px; margin: 0 auto 0; } .find-id-pw .btn-flex .btnDecide3 { display: flex; justify-content: center; align-items: center; min-width: 210px; height: 64px; padding: 0 15px; background-color: #fff; border: 1px solid #C3CAD6; border-radius: 10px; color: #A2AAB8; font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: 0; } .find-id-pw .btn-flex>a, .find-id-pw .btn-flex>button { width: 330px; margin: 0; } .mypage .btnDecide.w570 { width: 570px; } .flex-text { display: flex; justify-content: space-between; } .flex-text .first { width: calc(50% + 15px); } .flex-text .last { width: calc(50% - 15px); margin-left: auto; } .flex-text .first+.last { width: calc(50% - 15px); margin-left: 0; } /* 회원가입&로그인 공통 input */ .input-label { position: relative; width: 100%; height: 78px; margin-top: 30px; background-color: #fff; border-radius: 6px; border: 1px solid #D2D7E1; display: flex; align-items: center; } .input-label.error, .input-label.error { border: 1px solid #FC1B1B; } .input-label [type="text"], .input-label [type="email"], .input-label [type="password"] { width: 100%; height: 100%; padding: 0 20px; box-sizing: border-box; background-color: transparent; border: 0 none; color: #1C3E70; font-size: 20px; line-height: 28px; outline: none; cursor: pointer; } .input-label input::placeholder { color: #1C3E70; letter-spacing: 0; } .input-label label { position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; text-align: left; pointer-events: none; } .input-label label::after { content: ""; position: absolute; left: -1px; bottom: -1px; width: 0; /*transition: all .5s ease; */ } .input-label [type="text"]:focus+label::after, .input-label [type="email"]:focus+label::after, .input-label [type="password"]:focus+label::after { border-radius: 6px; border: 1px solid #193D71; } .input-label.error input:focus+label::after { border-color: #FC1B1B; } .input-label label span { position: absolute; top: 50%; left: 20px; transform: translateY(-50%); transition: all .5s ease; color: #595F6B; font-size: 20px; line-height: 28px; } .input-label [type="text"]:focus+label span, .input-label [type="text"]:valid+label span, .input-label [type="email"]:focus+label span, .input-label [type="email"]:valid+label span { transform: translateY(-34px); font-size: 14px; letter-spacing: 0; } .input-label [type="password"]:focus+label span, .input-label [type="password"]:valid+label span { transform: translateY(-34px); font-size: 14px; letter-spacing: 0; } .input-label [type="text"]:focus+label::after, .input-label [type="text"]:valid+label::after, .input-label [type="email"]:focus+label::after, .input-label [type="email"]:valid+label::after { width: 100%; height: 100%; transform: translateX(0); } .input-label [type="password"]:focus+label::after, .input-label [type="password"]:valid+label::after { width: 100%; height: 100%; transform: translateX(0); } /*비밀번호 찾기*/ .login-flexbox .id-pw { display: flex; justify-content: center; align-items: center; margin-top: 58px; } .login-flexbox .id-pw>a { display: block; position: relative; padding: 0 12px 0 11px; color: #595E6B; font-weight: 500; font-size: 16px; line-height: 24px; } .login-flexbox .id-pw>a::after { content: ''; display: block; clear: both; position: absolute; top: 7px; left: 0; width: 1px; height: 12px; background-color: #D5D8E1; } .login-flexbox .id-pw>a:first-child { padding-left: 0; } .login-flexbox .id-pw>a:first-child::after { display: none; } .find-id-pw .btnDecide, .find-id-pw .btnDecide2 { display: flex; justify-content: center; align-items: center; min-width: 210px; width: auto; height: 64px; margin: 0 auto; padding: 0 15px; background-color: #193D71; border-radius: 10px; color: #fff; font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: 0; } .find-id-pw .btn-flex>a, .find-id-pw .btn-flex>button { width: 330px; margin: 0; } .find-id-pw .btnDecide2 { background-color: #F58220; } .find-id-pw .checked input.checked-checkbox { position: absolute; width: 24px; height: 24px; appearance: none; } .find-id-pw .checked input.checked-checkbox+label { display: inline-block; position: relative; width: 24px; height: 24px; background: #fff; border-radius: 50%; border: 2px solid #6A7180; font-size: 0; text-indent: -99999em; line-height: 0; } .find-id-pw .checked input.checked-checkbox+label::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s ease; width: 0; height: 0; border-radius: 50%; } .find-id-pw .checked input.checked-checkbox:checked+label::after { width: 24px; height: 24px; background: #DF6D1B url(/tigeretf/common_kr/pc/images/common/bullt_checked_24x24.png) no-repeat center center; border: 0; } .login-flexbox .input-label [type="text"]:focus+label::after, .login-flexbox .input-label [type="email"]:focus+label::after, .login-flexbox .input-label [type="password"]:focus+label::after { border-width: 2px !important; } /*회원가입 END*/ /* 마이페이지 25.10.15 */ .mypage .top-line { /*width: 1410px;*/ margin: 58px auto 0; padding-top: 115px; border-top: 2px solid #1C3E70; } .mypage .page-title { display: flex; align-items: center; width: 100%; max-width: 1488px; margin: 0 auto; color: #1c3e70; font-weight: 700; font-size: 54px; line-height: 85px; } .my-name { display: flex; align-items: center; /*width: 1410px;*/ margin: 53px auto 49px; } .my-name .name, .my-name .name em { font-weight: 700; font-size: 42px; line-height: 53px; vertical-align: top; } .my-name .days { margin: 20px 0 0 30px; font-size: 15px; line-height: 20px; letter-spacing: 0; } .my-name .phone { margin: 20px 0 0 20px; color: #DF6D1B; font-weight: 500; font-size: 15px; line-height: 20px; letter-spacing: 0; } .my-name .modify { width: auto; height: 36px; padding: 0 17px; margin-left: auto; background-color: #fff; border-radius: 5px; border: 1px solid #C3CAD6; color: #193D71; font-size: 14px; line-height: 20px; letter-spacing: 0; font-weight: 500; } .my-name .right-name-cont { margin-left: auto; font-size: 0; } .my-name .right-name-cont .modify { margin-left: 10px; } .round2-box .compare { display: flex; align-items: center; padding: 0 0 20px; } .round2-box .compare .days { margin-right: auto; color: #F58220; font-weight: 500; letter-spacing: 0; } .round2-box .compare button { min-width: 86px; width: auto; height: 36px; margin-left: auto; padding: 0 10px; border-radius: 3px; border: 1px solid #C3CAD6; font-weight: 500; font-size: 14px; line-height: 20px; letter-spacing: 0; } .round2-box .compare button+button { margin-left: 10px; } .round2-box .compare .delete { color: #A2AAB8; } .mypage .btnDecide { width: 330px; height: 64px; margin: 60px auto 0; } .round2-box { margin-top: 40px; padding: 60px 60px 40px; background-color: #fff; border-radius: 20px; } /* 마이페이지 회원정보 수정 */ .certified .list { margin-top: 28px; } .certified .list>li { position: relative; margin-top: 8px; padding-left: 15px; } .certified .list>li:first-child { margin-top: 8px; } .certified .list>li::after { content: ''; position: absolute; top: 11px; left: 0; width: 5px; height: 5px; background-color: #2B2F36; border-radius: 50%; } .certified .checked { margin-top: 37px; } .certified .checked input[class="checked-radio"], .certified .checked input[class="checked-checkbox"] { position: absolute; width: 24px; height: 24px; appearance: none; } .certified .checked input[class="checked-radio"]+label, .certified .checked input[class="checked-checkbox"]+label { display: inline-block; position: relative; width: 24px; height: 24px; background: #fff; border-radius: 50%; border: 2px solid #6A7180; font-size: 0; text-indent: -99999em; line-height: 0; } .certified .checked input[class="checked-checkbox"]+label::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s ease; width: 0; height: 0; border-radius: 50%; } .certified .checked input[class="checked-checkbox"]:checked+label::after { width: 24px; height: 24px; background: #DF6D1B url(/tigeretf/common_kr/pc/images/common/bullt_checked_24x24.png) no-repeat center center; border: 0; } .certified .checked p { padding-left: 36px; font-weight: 700; font-size: 20px; line-height: 20px; white-space: nowrap; } .certified .text { margin-top: 14px; } .certified .txt-bg { height: 285px; margin-top: 40px; padding-top: 57px; border-top: 1px solid #D2D7E1; font-weight: 700; font-size: 20px; text-align: center; line-height: 28px; background: #fff url('/tigeretf/common_kr/pc/images/icon/ico_phone.png') no-repeat center 105px; } .certified+.flex-btn-center { padding-top: 0; padding-bottom: 90px; } .certified+.flex-btn-center .btn-identi { min-width: 98px; width: auto; height: 44px; display: block; overflow: hidden; position: relative; margin: 0 auto; padding: 0 18px; background: #193D71; border-radius: 0.6rem; color: #fff; font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: 0; } /* mypage 회원정보 수정 */ .smaller-tit { display: flex; justify-content: space-between; align-items: baseline; margin-top: 4.5rem; font-weight: 700; font-size: 18px; line-height: 2.6rem; } .mypage .content-stit+.titbox { margin-top: 7px; } .mypage .round2-box { margin-top: 20px; padding: 60px; border-radius: 20px; background: #FAFAFA; } .round2-box .tit-name h3 { margin-top: 16px; color: #193D71; font-weight: 700; font-size: 34px; line-height: 48px; } .round2-box .tit-name .today { display: block; color: #8C94A3; font-weight: 500; letter-spacing: 0; } .round2-box .tit-name .days { display: block; margin-top: 8px; font-size: 14px; line-height: 20px; letter-spacing: 0; } .round2-box .flex { display: flex; justify-content: space-between; align-items: center; margin-top: 27px; } .round2-box .flex+.compare { margin-top: 60px; } .round2-box .flex .box { display: flex; flex-direction: column; width: 630px; padding: 0 40px; background-color: #F4F6F8; border-radius: 20px; } .round2-box .flex .box>li { display: flex; justify-content: space-between; align-items: center; height: 123px; padding-right: 110px; border-top: 1px solid #DFE3EB; } .round2-box .flex .box>li:first-child { border-top: 0; } .round2-box .flex .box>li .name { font-weight: 700; } .round2-box .flex .box>li .num { color: #F58220; font-weight: 700; font-size: 36px; line-height: 52px; letter-spacing: 0; } .round2-box .flex .box>li .num>em { display: block; color: #8C94A3; font-weight: 400; font-size: 14px; text-align: right; line-height: 20px; letter-spacing: 0; } .round2-box .flex .box>li:first-child .num { color: #2B2F36; } .round2-box .flex .box>li:last-child .num { color: #D93B3B; } .round2-box .flex .list>li { display: flex; justify-content: space-between; align-items: center; width: 630px; height: 65px; border-bottom: 1px solid #DFE3EB; } .round2-box .flex .list>li:first-child { border-top: 1px solid #DFE3EB; } .email-sms>li { display: flex; margin-top: 38px; } .email-sms>li:first-child { margin-top: 0; } .email-sms>li .tit { width: 130px; font-weight: 500; font-size: 18px; line-height: 26px; } .email-sms>li .flex { display: block; overflow: hidden; width: 100%; margin: 0; } .email-sms>li .checkeds input[class="checked-radio"], .email-sms>li .checkeds input.checked-checkbox { position: absolute; width: 24px; height: 24px; display: none; } .email-sms>li .checkeds input[class="checked-radio"]+label, .email-sms>li .checkeds input.checked-checkbox+label { display: inline-block; position: relative; width: 24px; height: 24px; background: #fff; border-radius: 50%; border: 2px solid #6A7180; font-size: 0; text-indent: -99999em; line-height: 0; } .email-sms>li .checkeds input.checked-checkbox+label::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s ease; width: 0; height: 0; border-radius: 50%; } .email-sms>li input.checked-checkbox:checked+label::after { width: 24px; height: 24px; background: #DF6D1B url(/tigeretf/common_kr/pc/images/common/bullt_checked_24x24.png) no-repeat center center; border: 0; } .email-sms>li .checkeds { float: left; width: calc(100% / 4); line-height: 0; } .email-sms>li .checkeds label>span { padding-left: 34px; line-height: 20px; white-space: nowrap; font-size: 16px; } /*회원탈퇴*/ .mypage .comm_btn-right { margin-top: 20px; text-align: right; } .mypage .btnBasics { display: inline-block; height: 36px; padding: 5px 15px; background-color: #fff; border-radius: 3px; border: 1px solid #C3CAD6; color: #193D71; font-weight: 500; font-size: 14px; line-height: 24px; letter-spacing: 0; } .mypage .step-input .ui_flex-center .btnDecide { margin: 0 15px; } .mypage .step-input .ui_flex-center .btnDecide3 { width: 330px; height: 64px; margin: 0 15px; background-color: #fff; border: 1px solid #C3CAD6; color: #A2AAB8; } .mypage .step-input .textarea { margin-top: 30px; } .mypage .step-input .textarea textarea { width: 690px; height: 180px; padding: 20px; border: 1px solid #D2D7E1; border-radius: 5px; } .layer-pop-wrap.alert-popup .pop-body { padding-top: 90px; text-align: center; } .layer-pop-wrap.alert-popup .pop-footer { /*padding: 60px 40px 90px;*/ } .layer-pop-wrap.alert-popup .pop-data{ min-width:450px; max-width: 600px; width:450px; min-height: 200px; padding: 32px 40px 40px 40px; border-radius: 36px; position: relative; box-shadow: 0 30px 30px rgba(0, 0, 0, 0.3); } .layer-pop-wrap.alert-popup .pop-body{ padding: 60px 0 0; text-align: center; font-size: 18px; color: #2b2f36; font-weight: 400; } .layer-pop-wrap.alert-popup .pop-body p{ font-size: 16px; line-height:30px; } .layer-pop-wrap.alert-popup .pop-footer .btn-pop-wrap{ justify-content: center; padding-top: 40px; text-align: center; padding-bottom: 30px; } .layer-pop-wrap.alert-popup .pop-footer .btn-pop-wrap button{ min-width: 80px; width: auto; height: 34px; margin: 0 4px; padding: 0 3px; border-radius: 3px; font-weight: 500; font-size: 18px; line-height: 20px; letter-spacing: 0; } .layer-pop-wrap.alert-popup .btn-confir { color: #193d71; } .layer-pop-wrap.alert-popup .btn-cancel { color: #7e8693; } .layer-pop-wrap.alert-popup .btn-pop-close{ position: absolute; top: 30px; right: 30px; width: 30px; height: 30px; background: url(/tigeretf/common_kr/pc/images/icon/btn_close_30x30.png) no-repeat center center; font-size: 0; text-indent: -9999em; line-height: 0; } .roundbox-check { width: 690px; margin: 59px auto 0; padding: 77px 0 0 0; background-color: #fff; border-radius: 20px; } .roundbox-check>li { line-height: 0; } .roundbox-check>li .checkeds { margin-top: 27px; } .roundbox-check>li:first-child .checkeds { margin-top: 0; } .roundbox-check>li .checkeds p { margin-top: 0; padding-left: 36px; font-size: 24px; line-height: 20px; white-space: nowrap; } .mCustomScrollBox:focus .mCSB_draggerContainer { outline: 2px dashed #193D71; } .roundbox-check>li .checkeds input[class="checked-checkbox"] { position: absolute; width: 24px; height: 24px; appearance: none; } .roundbox-check>li .checkeds input[class="checked-checkbox"]+label { display: inline-block; position: relative; width: 24px; height: 24px; background: #fff; border-radius: 50%; border: 2px solid #6A7180; font-size: 0; text-indent: -99999em; line-height: 0; } .roundbox-check>li .checkeds input[class="checked-checkbox"]+label::after { content: ''; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s ease; width: 0; height: 0; border-radius: 50%; } .roundbox-check>li .checkeds input[class="checked-checkbox"]:checked+label::after { width: 24px; height: 24px; background: #DF6D1B url(/tigeretf/common_kr/pc/images/common/bullt_checked_24x24.png) no-repeat center center; border: 0; } .mypage .ui_tabs1 .tab { display: flex; justify-content: center; align-items: center; min-width: 11rem; width: 202px; height: 60px; margin: 0 0 0 -0.1rem; background-color: #edeff3; border: 1px solid #c3cad6; color: #7e8693; font-weight: 500; font-size: 18px; line-height: 26px; flex: 1; } .mypage-contents { width: 1490px; } .mypage .ui_tabs1 .tab.on { background: #fff; border: 2px solid #1c3e70; border-bottom: 2px solid #df6d1b; color: #193d71; font-weight: 700; font-size: 22px; } .mypage [class*="ui_tabs"] .tab.on { z-index: 1; } .mypage .titbox { display: flex; align-items: baseline; margin: 120px 0 30px 0; } .mypage .titbox .content-stit { width: auto; margin: 0; font-weight: 700; font-size: 30px; line-height: 38px; } .mypage .titbox .result { margin-left: 30px; color: #2B2F36; font-size: 20px; line-height: 25px; font-weight: 700; } .mypage .titbox .btn-link { display: flex; align-items: center; height: 36px; margin-left: auto; padding: 0 20px; background-color: #fff; border-radius: 5px; border: 1px solid #C3CAD6; color: #193D71; font-size: 14px; line-height: 20px; letter-spacing: 0; font-weight: 500; } .mypage .titbox .select-box { display: flex; margin-left: 20px; align-items: self-end; } .mypage .titbox .select-box label { display: inline-block; margin-right: 10px; color: #2B2F36; font-size: 14px; line-height: 22px; font-weight: 400; } .mypage .titbox .select-box select { height: 22px; color: #2B2F36; font-size: 16px; line-height: 22px; font-weight: 500; appearance: none; padding-right: 27px; background: url(/tigeretf/common_kr/pc/images/icon/icon_select_arrow.svg) no-repeat right center/ 22px auto; } .mypage .titbox .btn-link+.btn-link { margin-left: 40px; } .mypage .titbox .tittxt { font-size: 18px; line-height: 24px; } .mypage .titbox .tittxt em { font-weight: 700; font-size: 18px; line-height: 24px; letter-spacing: 0; vertical-align: top; } .setting-period { display: flex; align-items: center; margin-top: 58px; } .setting-period .result { font-size: 18px; line-height: 26px; } .mypage .relation-theme { display: flex; flex-wrap: wrap; margin: 59px auto 0; } .mypage .relation-theme>a { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 210px; height: 210px; margin: 30px 30px 0 0; background-color: #fff; border-radius: 24px; color: #193D71; font-weight: 700; font-size: 14px; text-align: center; line-height: 20px; letter-spacing: 0; } .relation-theme>a:nth-child(1), .relation-theme>a:nth-child(2), .relation-theme>a:nth-child(3), .relation-theme>a:nth-child(4), .relation-theme>a:nth-child(5), .relation-theme>a:nth-child(6) { margin-top: 0; } .relation-theme>a:nth-child(6n) { margin-right: 0; } .mypage .relation-theme .imgs { overflow: hidden; width: 75px; height: 75px; margin: 0 auto 7px; } .mypage .relation-theme .imgs img { width: 100%; height: 300px; } .mypage .comm_items .item { flex-wrap: wrap; } .my-theme-cont { width: 100%; display: block; } .my-theme-card .products { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: 1fr; gap: max(24px, .625vw); grid-auto-flow: column; } .my-theme-card .products .each:nth-child(1) { grid-column-start: 1; } .my-theme-card .products .each:nth-child(2) { grid-column-start: 2; } .my-theme-card .products .each:nth-child(3) { grid-column-start: 3; } .my-theme-card .products .each:nth-child(4) { grid-column-start: 4; } .my-theme-card .products .each>a { display: block; width: 100%; padding: 50px 30px 52px; height: 520px; border: 1px solid #c9c9c9; } .my-theme-card .products .each>a:hover { border: 1px solid #f58220; } .my-theme-card .products .each .header { display: flex; justify-content: space-between; } .my-theme-card .products .type { display: flex; flex-wrap: wrap; align-items: flex-start; margin-bottom: 28px; margin-left: -10px; } .my-theme-card .products .type span { position: relative; margin: 0 10px; color: #949494; font-size: 14px; line-height: 1.4; } .my-theme-card .products .type span + span::before, .my-theme-card .products .type span.has-divider::before, .my-theme-card .products .type div[id^="cateTitle_"]:not(:empty) ~ span::before { position: absolute; top: 50%; left: -11px; height: 12px; margin-top: -6px; border-left: 1px solid #c9c9c9; content: ''; } .my-theme-card .products .bookmark { position: relative; width: 17px; height: 22px; } .my-theme-card .products .bookmark .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } .my-theme-card .products .bookmark::before { position: absolute; top: 0; left: 0; width: 17px; height: 22px; background: url(/tigeretf/common_kr/pc/images/icon/bookmark_default.svg) no-repeat center; background-size: 100% auto; content: ''; } .my-theme-card .products .bookmark.active::before, .my-theme-card .products .bookmark.actived::before { background-image: url('/tigeretf/common_kr/pc/images/icon/bookmark_active.svg') } .my-theme-card .products .title { min-height: 5.625rem; margin: 28px 0 6px; color: #043b72; font-weight: 700; font-size: 32px; line-height: 1.4; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .my-theme-card .products .code { color: #043b72; font-size: 14px; line-height: 1.4; } .my-theme-card .products .calculation .this-label { color: #949494; font-size: 12px; line-height: 17px; } .my-theme-card .products .calculation .val { display: flex; align-items: flex-end; } .my-theme-card .products .calculation .val .number { font-weight: 500; font-size: 38px; line-height: 1.4; } .my-theme-card .products .calculation .val .unit { position: relative; top: -7px; font-weight: 700; font-size: 24px; } .my-theme-card .products .calculation .val.up { color: #D93B3B; } .my-theme-card .products .calculation .val.down { color: #245DAB; } .my-theme-card .products .prices { display: flex; margin-top: 30px; } .my-theme-card .products .prices>div { flex: 0 0 50%; } .my-theme-card .products .prices .this-label { display: block; color: #949494; font-size: 14px; line-height: 1.4; } .my-theme-card .products .prices .val { color: #000; font-size: 14px; line-height: 1.4; } .my-theme-card .closer { margin: 50px 0 120px; } .my-theme-card .closer .shortcut { display: flex; justify-content: center; } .my-theme-card .closer .shortcut .link { position: relative; padding: 1px 26px 1px 0; color: #5e5e5e; font-size: 16px; line-height: 24px; } .my-theme-card .closer .shortcut .link::after { position: absolute; top: 50%; right: 0; width: 24px; height: 24px; margin-top: -13px; background: url(/tigeretf/common_kr/pc/images/icon/shortcut_caret_right_temp.svg) no-repeat right center; background-size: auto 100%; content: ''; } .mypage .grid-frame-layout { display: grid; grid-template-columns: repeat(4, minmax(23.79195%, 1fr)); gap: 24px; } .mypage .grid-frame-layout .c-card { display: flex; flex-wrap: wrap; align-items: center; padding: 40px; border: 1px solid #c9c9c9; border-radius: 0.3125rem; height: 403px; } .mypage .grid-frame-layout .c-card:hover { border-color: #f58220; background-color: #f58220; } .mypage .grid-frame-layout .c-card:hover .title, .mypage .grid-frame-layout .c-card:hover .channel, .mypage .grid-frame-layout .c-card:hover .registered { color: #fff; } .mypage .grid-frame-layout .c-card:hover .bookmark::before { background: url('/tigeretf/common_kr/pc/images/icon/bookmark_content_hover.svg'); } .mypage .grid-frame-layout .c-card .title { display: -webkit-box; height: 100px; max-height: 100px; font-size: 1.5rem; line-height: 1.4; font-weight: 500; color: #000; word-break: break-all; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .mypage .grid-frame-layout .c-card .c-card-prefix { order: -3; flex: 1 0 auto; } .mypage .grid-frame-layout .c-card .c-card-header { flex: 0 0 100%; margin: 2.5rem 0 1.25rem; width: 100%; } .mypage .grid-frame-layout .c-card .c-card-content { flex: 1 0 100%; width: 100%; } .mypage .grid-frame-layout .c-card .c-card-methods { position: relative; right: -1.1875rem; order: -1; flex: 0 0 34px; } .mypage .grid-frame-layout .c-card .hashtags { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mypage .grid-frame-layout .c-card .hashtags span { display: inline-block; padding: 0 10px; background: #FFFBF7; border: 1px solid #FFB380; border-radius: 10px; color: #f58220; font-size: 16px; line-height: 32px; } /*.mypage .grid-frame-layout .c-card:hover .hashtags span { color:#fff; }*/ .mypage .grid-frame-layout .c-card .channel { color: #f58220; font-weight: 700; font-size: 20px; line-height: normal; } .mypage .grid-frame-layout .c-card .registered { margin: 40px 0 0; padding: 30px 0 0; border-top: 1px solid #e0e0e0; color: #949494; font-weight: 500; font-size: 20px; line-height: 1.1; } .mypage .grid-frame-layout .bookmark { position: relative; width: 34px; height: 34px; vertical-align: top; } .mypage .grid-frame-layout .bookmark::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/bookmark_content_default.svg') no-repeat center; background-size: 100% auto; content: ''; } .mypage .grid-frame-layout .bookmark.active::before, .mypage .grid-frame-layout .bookmark.actived::before { background-image: url('../images/icon/bookmark_content_active.svg') } .mypage .grid-frame-layout .bookmark .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } .mypage .movie-clip-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px 24px; } .mypage .movie-clip-list .c-card { display: flex; flex-wrap: wrap; flex-direction: column; align-items: flex-start; justify-content: space-between; height: 100%; } .mypage .movie-clip-list .c-card .c-card-prefix { width: 100%; margin-bottom: 6px; } .mypage .movie-clip-list .c-card .figure { margin-bottom: 20px; } .mypage .movie-clip-list .c-card .figure>div { position: relative; width: 100%; padding-bottom: 56.25%; border-radius: 24px; overflow: hidden; } .mypage .movie-clip-list .c-card .figure img { position: absolute; top: 50%; left: 50%; width: 100%; height: auto; transform: translate(-50%, -50%); } .mypage .movie-clip-list .c-card .c-card-header { margin-bottom: 10px; } .mypage .movie-clip-list .c-card .hashtags { margin-bottom: 0.375rem; color: #6F7685; font-size: 16px; font-weight: 500; line-height: 22px; } .layer-pop-wrap.type-new .type-new-infoBox .chart-info-box.type-new{background:transparent;padding:0;} .layer-pop-wrap.type-new .type-new-infoBox .chart-info-box.type-new .title{padding:0;} .layer-pop-wrap.type-new .type-new-infoBox .chart-info-box.type-new .title::before{content:none;} /* 탭메뉴 디자인변경 */ .layer-pop-wrap.type-new .ui_tabs1 .page-tab { margin: 60px 0 20px; } .mypage .movie-clip-list .c-card .title { display: -webkit-box; height: 56px; max-height: 56px; font-size: 20px; line-height: 28px; font-weight: 500; color: #000; text-overflow: ellipsis; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .mypage .movie-clip-list .c-card .c-card-footer { display: flex; align-items: center; justify-content: space-between; width: 100%; } .mypage .movie-clip-list .c-card .c-card-content { flex: 1 0 auto; display: flex; gap: 0 6px; } .mypage .movie-clip-list .c-card .channel { color: #f58220; font-weight: 500; font-size: 14px; } .mypage .movie-clip-list .c-card .registered { color: #949494; font-weight: 500; font-size: 14px; } .mypage .movie-clip-list .c-card .c-card-methods { flex: 0 0 34px; } .mypage .movie-clip-list .c-card .bookmark { position: relative; width: 34px; height: 34px; vertical-align: top; } .mypage .movie-clip-list .c-card .bookmark::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/tigeretf/common_kr/pc/images/icon/bookmark_content_default.svg) no-repeat center; background-size: 100% auto; content: ''; } .mypage .movie-clip-list .c-card .bookmark.active::before, .mypage .movie-clip-list .c-card .bookmark.actived::before { background-image: url('/tigeretf/common_kr/pc/images/icon/bookmark_content_active.svg') } .mypage .movie-clip-list .c-card .bookmark .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } .mypage .guide-book-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 55px 32px; } .mypage .guide-book-list .c-card { display: flex; flex-wrap: wrap; align-items: center; } .mypage .guide-book-list .c-card .c-card-prefix { flex: 0 0 100%; margin-bottom: 6px; } .mypage .guide-book-list .c-card .figure { margin-bottom: 20px; } .mypage .guide-book-list .c-card .figure>div { height: 491px; border-radius: 12px; border: 1px solid #e0e0e0; overflow: hidden; } .mypage .guide-book-list .c-card .figure img { display: flex; justify-content: center; align-items: center; width: 100%; height: auto; } .mypage .guide-book-list .c-card .hashtags { display: flex; gap: 0 5px; color: #6F7685; font-size: 16px; font-weight: 500; line-height: 22px; text-overflow: ellipsis; overflow: hidden; } .mypage .guide-book-list .c-card .c-card-header { flex: 0 0 100%; margin-bottom: 16px; } .mypage .guide-book-list .c-card .title { font-size: 20px; line-height: 28px; font-weight: 500; color: #000; text-overflow: ellipsis; overflow: hidden; } .mypage .guide-book-list .c-card .c-card-content { flex: 1 0 auto; display: flex; gap: 0 6px; } .mypage .guide-book-list .c-card .registered { color: #949494; font-weight: 500; font-size: 14px; } .mypage .guide-book-list .c-card .c-card-methods { flex: 0 0 34px; } .mypage .guide-book-list .c-card .c-card-methods .bookmark { position: relative; width: 34px; height: 34px; vertical-align: top; } .mypage .guide-book-list .c-card .c-card-methods .bookmark::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/icon/bookmark_content_default.svg) no-repeat center; background-size: 100% auto; content: ''; } .mypage .guide-book-list .c-card .c-card-methods .bookmark.active::before, .mypage .guide-book-list .c-card .c-card-methods .bookmark.actived::before { background-image: url('../images/icon/bookmark_content_active.svg') } .mypage .guide-book-list .c-card .c-card-methods .bookmark .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } .mypage-sort-tab { display: inline-flex; gap: 24px; } .mypage-sort-tab li { width: 100%; } .mypage-sort-tab a { display: flex; justify-content: center; flex-wrap: wrap; width: 192px; height: 192px; padding: 42px 0; background: #FAFAFA; border-radius: 20px; } .mypage-sort-tab a:hover { background: #ECF1F9; } .mypage-sort-tab a span { width: 100%; } .mypage-sort-tab a span.sort-icon { content: ""; display: block; clear: both; width: 84px; height: 84px; background-position: center 0; background-repeat: no-repeat; /* background-size: 100% 336px; */ background-size: cover; } .layer-pop-wrap.type-new .overscroller-x .read-table-wrap .read-table{max-height:500px;overflow-y:auto;} .layer-pop-wrap.type-new .component-item-pop .pop-table-wrap{margin-right:0;} /* //레이어 팝업 디자인 개선 */ /*.mypage-sort-tab a span.sort-icon01 {*/ /* background-image: url("/tigeretf/common_kr/pc/images/icon/icon_sort_total.svg");*/ /*}*/ /*.mypage-sort-tab a span.sort-icon02 {*/ /* background-image: url("/tigeretf/common_kr/pc/images/icon/icon_sort_chn.svg");*/ /*}*/ /*.mypage-sort-tab a span.sort-icon03 {*/ /* background-image: url("/tigeretf/common_kr/pc/images/icon/icon_sort_old.svg");*/ /*}*/ /* 구성종목 인포박스 디자인 개선 */ .product-basic-info.type-new { padding-bottom: 0; } /*.mypage-sort-tab a span.sort-icon04 {*/ /* background-image: url("/tigeretf/common_kr/pc/images/icon/icon_sort_america.svg");*/ /*}*/ /*.mypage-sort-tab a span.sort-icon05 {*/ /*!* background-image: url("/tigeretf/common_kr/pc/images/icon/icon_sort_ai01.svg");*!*/ /*}*/ /*.mypage-sort-tab a span.sort-icon06 {*/ /* background-image: url("/tigeretf/common_kr/pc/images/icon/icon_sort_ai02.svg");*/ /*}*/ /*.mypage-sort-tab a span.sort-icon07 {*/ /* background-image: url("/tigeretf/common_kr/pc/images/icon/icon_sort_semi.svg");*/ /*}*/ .mypage-sort-tab a .name { margin-top: 10px; color: #193D71; font-size: 18px; line-height: 23px; text-align: center; } .custom-contents .desc { color: #2B2F36; font-size: 20px; line-height: 25px; } .custom-list { margin-top: 30px; margin-bottom: 40px; } .custom-list>li { display: flex; align-items: baseline; padding: 30px; margin-top: 20px; background-color: #F4F6F8; border-radius: 10px; border: 1px solid #D2D7E1; } .custom-list>li:first-child { margin-top: 0; } .custom-list .custom-num { width: 32px; margin-right: 20px; background: #2B2F36; border-radius: 50%; color: #fff; font-size: 16px; line-height: 32px; font-weight: 700; text-align: center; transform: translateY(-4px); } .custom-list .custom-title .title { font-size: 24px; line-height: 30px; font-weight: 700; line-height: normal; } .product-basic-info.type-new .info-card-box .info-card-box-cell .info-value.up{color:#D93B3B;} .product-basic-info.type-new .info-card-box .info-card-box-cell .info-value.down{color:#245DAB;} /* //구성종목 인포박스 디자인 개선 */ /* 2025-08-22 HDH : 전체상품 보기 팝업 디자인 개선 */ .layer-pop-wrap.type-all-product .pop-data { max-width: 1330px; } .custom-list .custom-title .inner-desc { margin-top: 10px; color: #2B2F36; font-size: 16px; line-height: 20px; } .custom-option-checkbox { display: flex; margin-top: 30px; gap: 10px; } .custom-option-checkbox>li {} .custom-option-checkbox input[type=checkbox] { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .custom-option-checkbox input[type=checkbox]+label { display: block; padding: 0 20px; border: 1px solid #C9C9C9; border-radius: 30px; font-size: 14px; line-height: 34px; font-weight: 500; } .custom-option-checkbox input[type=checkbox]:checked+label { color: #F58220; border-color: #F58220; } .mypage-nodata { display: flex; justify-content: center; align-items: center; width: 100%; height: 150px; border: 1px solid #D2D7E1; border-radius: 20px; color: #2B2F36; font-size: 24px; line-height: 30px; } .icon-acc { display: flex; align-items: center; justify-content: center; margin: 120px 0; } .icon-acc span { display: block; width: 121px; height: 118px; background: url("/tigeretf/common_kr/pc/images/icon/icon_acc.svg") no-repeat center center /100%; } @media screen and (max-width:1180px) { #dBody[data-ui-corporate="v1.0"] #contents {} [data-component="Footer"] .footer-family-site>a { padding-right: 45px; } .footer-menu-list>li { padding: 0 15px; } /* 분배금 현황 페이지 */ .allotment-wrap.type-new .data-view-sort, .allotment-wrap.type-new .sort-group { gap: 10px; } .allotment-wrap.type-new .board-search-wrap { max-width: 395px; } .allotment-wrap.type-new .board-search-wrap input, .allotment-wrap.type-new .board-search-wrap input:placeholder-shown, .allotment-wrap.type-new .board-search-wrap input::placeholder { font-size: 18px; } .allotment-wrap.type-new .product-info-table .read-table table>tbody>tr>td.text-left .title { font-size: 20px; } .allotment-wrap.type-new .product-info-table .read-table table>tbody>tr>td.text-left .price { margin-top: 25px; } .allotment-wrap.type-new .product-info-table .read-table.for-padding table>tbody>tr>td { padding-top: 30px; padding-bottom: 30px; font-size: 15px; padding-left: 10px; } .allotment-wrap.type-new .product-info-table .read-table.for-padding table>tbody>tr>td:nth-of-type(2) { padding-left: 0; } .allotment-wrap.type-new .data-view-sort .form-select.middle-size { font-size: 15px; } .allotment-wrap.type-new .product-info-table .read-table table>thead>tr:nth-of-type(1)>th { font-size: 16px; } .allotment-wrap .product-info-table, .allotment-wrap.type-new .discription { margin-top: 15px; } .board-list-wrap { margin-top: 15px; } .btn-list-more.btn-round>span { font-size: 17px; } .btn-list-more>span::after { width: 39px; height: 16px; bottom: 10px; } /* 테마별 etf */ .theme-etf-list .list-theme { max-width: 1080px; margin: 0 auto; } .theme-etf-list .title-group { padding-left: 45px; } .theme-etf-list .page-title { font-size: 50px; } /* 월배당 */ .theme-etf .sort-group, .theme-etf .board-search-wrap, .theme-etf .board-search-wrap .search-form { gap: 10px; } .theme-etf .sort-group .sort-value select { font-size: 14px; } .theme-etf .board-search-wrap .search-form .search-form-input input { font-size: 14px; } .theme-etf .c-data .product-summary .title { font-size: 19px; } .theme-etf .c-data .c-pair .value { font-size: 18px; } .theme-etf .c-data-table .btn-sort { font-size: 14px; } .theme-etf .c-data-table td { font-size: 16px; } .theme-etf .c-data .btn-page-wrap .btn-list-more span { font-size: 17px; } .theme-etf .c-data-table .product-summary { min-width: 350px; padding-right: 0; } .theme-etf .c-data .product-summary .category .each { padding: 0 5px; font-size: 12px; } .page-title { font-size: 40px; } .c-sheet>.grid-frame-layout { gap: 18px; } /* etf 인사이트 */ .IMCIntrcnList .c-card[data-type="article"] .channel { font-size: 18px; } .IMCIntrcnList .c-card[data-type="article"] .title { height: 87px; max-height: 87px; font-size: 22px; } /* etf 가이드북 */ .IMBRptList .c-card[data-type="book"] .figure>div { height: 359.4px; } .IMDNewsList .c-card[data-type="article"] .c-card-content { height: 136px; } .ui_tabs1 .page-tab .tab.actived { font-size: 19px; } } .bookmark { position: relative; width: 34px; height: 34px; vertical-align: top; } .bookmark::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url('../images/icon/bookmark_content_default.svg') no-repeat center; background-size: 100% auto; content: ''; } .bookmark.actived::before { background-image: url('../images/icon/bookmark_content_active.svg') } .bookmark .val { position: absolute; width: 1px; height: 1px; margin: -1px; clip: rect(0 0 0 0); overflow: hidden; } .board-list-event-noti{ margin-top:24px; color: #8C94A3; font-size: 14px; font-style: normal; font-weight: 400; line-height: 22px; /* 157.143% */ margin-bottom: 80px; padding-left:1rem; text-indent:-1rem; li{ &::before{ content:"ㆍ"; font-weight:bold; } } } /* 마이페이지 : 마케팅 수신동의 토글 버튼 */ .agree-wrap{display: flex; padding-bottom: 20px; margin-top:30px;} .agree-wrap .smaller-tit{flex: 1; margin-top: 0; margin-bottom: 5px} .agree-wrap .flex{ display: flex; flex: 2; width: 100%; margin: 0; justify-content: flex-end; align-items: flex-start; } .agree-wrap .toggle-btn-wrap { display: inline-flex; align-items: center; height: 36px; border: 1px solid #d2d3d1; border-radius: 20px; overflow: hidden; } .agree-wrap .btn-toggle { display: inline-block; font-size: 14px; line-height: 21px; font-weight: 400; } .agree-wrap .btn-toggle span{ font-size: 14px; } .agree-wrap .btn-toggle:nth-of-type(1) { padding: 0 14px 0 20px; } .agree-wrap .btn-toggle:nth-of-type(2) { padding: 0 20px 0 14px; } .agree-wrap .btn-toggle.actived { padding: 0 20px; height: 100%; background-color: #df6d1b; border-radius: 20px; color: #fff; font-weight: 500; }