.index-main {padding: 32px 10px 64px;}
@media (min-width: 1200px) {
    .index-main {
        margin-left: var(--sidebar-w);
        padding: 60px 100px 64px;
    }
}
.main-container{max-width:1600px;margin:0 auto;display:flex;}
.main-wrapper{flex:1;margin-left:280px;width:calc(100% - 280px);transition:all .3s ease;}
.container{max-width:1600px;margin:0 auto;padding:20px;display:flex;flex-direction:column;gap:20px;}
.header-container{display:flex;justify-content:space-between;align-items:center;}
.title{font-size:24px;font-weight:700;color:#000;}
.alarm-btn{background-color:#212529;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:14px;cursor:pointer;font-weight:500;}
.content-container{display:flex;gap:20px;}
.top-row{display:flex;width:100%;gap:20px;}
.main-content{display:flex;flex-direction:column;gap:20px;flex:4;}
.top-cards-row{display:flex;gap:20px;}
.section-popular{flex:1;}
.section-global{flex:1;}
.side-content{flex:1;display:flex;flex-direction:column;gap:20px;}
.card{background:#fff;border-radius:12px;box-shadow:0 2px 5px rgba(0,0,0,.03);padding:30px;}
.card-no-margin{margin-top:0;}
.investor-card{background:#fff;border-radius:12px;box-shadow:0 2px 5px rgba(0,0,0,.03);padding:30px;border: 1px solid var(--border); width: 100%;}
.card-header{font-size:19px;font-weight:600;margin-bottom:30px;display:flex;justify-content:space-between;align-items:center;}
.coin-list{display:flex;flex-direction:column;gap:15px;}
.coin-item{display:flex;align-items:center;width:100%;}
.rank{font-weight:600;margin-right:10px;width:18px;}
.coin-icon{width:24px;height:24px;border-radius:50%;margin-right:10px;display:flex;justify-content:center;align-items:center;overflow:hidden;}
.coin-icon-xrp{background:#627EEA;}
.coin-icon-btc{background:#F7931A;}
.coin-icon-aergo{background:#6a28ff;}
.coin-icon-text{color:#fff;font-weight:700;font-size:12px;}
.coin-info{flex:1;}
.coin-name{font-weight:500;font-size:14px;}
.coin-ticker{font-size:12px;color:#999;display:block;margin-top:2px;}
.coin-price{text-align:right;white-space:nowrap;}
.percent{font-weight:500;font-size:14px;}
.price-value{font-size:12px;color:#999;margin-top:2px;}
.positive{color:#f75467;}
.negative{color:#4386f9;}
.source-label{color:#999;font-size:12px;font-weight:400;}
.market-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.market-item{background:#f9f9f9;border-radius:8px;padding:15px;}
.market-name{margin-bottom:5px;font-weight:500;font-size:14px;}
.market-price{display:flex;justify-content:space-between;margin-bottom:2px;}
.market-ticker{font-size:12px;color:#666;}
.price-change{font-size:14px;font-weight:500;}
.price-diff{font-size:12px;font-weight:500;}
.view-all{color:#666;font-size:14px;display:flex;align-items:center;justify-content:flex-end;margin-top:15px;cursor:pointer;}
.view-all::after{content:"›";margin-left:5px;font-size:18px;}
.info-icon{width:16px;height:16px;background:#eee;border-radius:50%;display:inline-flex;justify-content:center;align-items:center;font-size:10px;color:#999;margin-left:5px;cursor:pointer;}
.tab-container{display:flex;margin-bottom:15px;border-bottom:1px solid #eee;}
.tab{padding:10px 20px;cursor:pointer;font-size:14px;}
.tab.active{font-weight:600;border-bottom:2px solid #212529;margin-bottom:-1px;}
.tab.inactive{color:#999;}
.percentage-bar{background:#edf4ff;height:6px;width:60px;border-radius:3px;position:relative;margin-top:3px;margin-left:auto;}
.percentage-value{position:absolute;top:0;left:0;height:100%;background:#4386f9;border-radius:3px;}
.period-section{width:100%;display:flex;flex-direction:column;gap:20px;}
.period-header{display:flex;justify-content:space-between;margin-bottom:10px;}
.period-title{font-size:19px;font-weight:600;}
.period-filters{display:flex;gap:15px;}
.period-filter{font-size:14px;color:#666;cursor:pointer;display:flex;align-items:center;}
.period-filter.active{color:#000;font-weight:500;}
.dropdown-icon{margin-left:3px;width:12px;height:12px;display:inline-flex;justify-content:center;align-items:center;font-size:8px;}
.timestamp{color:#999;font-size:12px;text-align:right;margin-bottom:10px;}
.performance-table{width:100%;border-collapse:collapse;min-width:640px;table-layout:fixed;}
.performance-table th,.performance-table td{padding:12px 8px;text-align:left;border-bottom:1px solid #eee;font-size:14px;}
.performance-table th{color:#666;font-weight:500;}
.table-col-asset{width:35%;}
.table-col-period{width:13%;}
.period-section .card{overflow:visible;}
.table-scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;width:100%;}
.period-section{overflow-x:hidden;}
.period-section .card::-webkit-scrollbar{height:6px;}
.period-section .card::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:10px;}
.load-more{text-align:center;padding:15px 0;color:#666;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;}
.load-more::after{content:"▼";margin-left:5px;font-size:10px;}
.news-container{background:#fff;border-radius:8px;box-shadow:0 2px 5px rgba(0,0,0,.03);padding:30px; border: 1px solid var(--border);}
.news-header{display:flex;align-items:center;margin-bottom:20px;padding-bottom:10px;}
.news-header h2{font-size:19px;font-weight:600;margin-right:8px;font-family: "Pretendard Variable";}
.news-header .info-icon{width:18px;height:18px;background:#eee;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;color:#666;}
.news-layout{display:grid;gap:20px;}

.news-item h2{font-size:18px;margin-bottom:8px;font-weight:500;color:#222;line-height:1.4;font-family: "Pretendard Variable"; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.news-item p{font-size:14px;color:#666;margin-bottom:8px;line-height:1.5;}
.news-time{font-size:12px;color:#999;text-align:right;}

.news-list-item{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #eee;}
.news-list-item h3{font-size:14px;font-weight:400;flex:1;color:#222;font-family: "Pretendard Variable";}
.news-list-item .news-time{font-size:12px;color:#999;white-space:nowrap;margin-left:10px;}
.pagination{display:flex;justify-content:center;align-items:center;margin-top:20px;}
.pagination .page-button{width:24px;height:24px;display:flex;align-items:center;justify-content:center;margin:0 5px;border:1px solid #ddd;background:#fff;color:#666;cursor:pointer;}
.pagination .page-number{margin:0 5px;font-size:14px;color:#666;}
.pagination .active{font-weight:700;color:#222;}
@media(max-width:768px){.news-layout{grid-template-columns:1fr;} .news-list{grid-template-columns:1fr;} .news-item h2{font-size:15px;} .news-item p{font-size:13px;} .news-list-item h3{font-size:13px;}}
@media(max-width:1200px){.top-row{flex-direction:column;} .main-content,.side-content{width:100%;}}
@media(max-width:992px){.top-cards-row{flex-direction:column;} .section-popular,.section-global{width:100%;}}
@media(max-width:768px){.main-wrapper{margin-top:50px;} .main-wrapper{margin-left:0;width:100%;} .mobile-menu-toggle{display:flex;} .market-grid{grid-template-columns:1fr;} .period-header{flex-direction:column;gap:10px;} .period-filters{flex-wrap:wrap;} .table-scroll{width:100%;overflow-x:auto;}}
@media(max-width:576px){.main-container{padding:0px;} .content-container{width:100%;} .card,.investor-card{padding:15px;} .performance-table th,.performance-table td{padding:10px 5px;font-size:12px;} .header-container{margin-top:50px;} .news-container{padding: 15px;}}
.overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);z-index:999;}
.overlay.open{display:block;}
.info-icon{width:20px;height:20px;background:#e0e0e0;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-left:5px;font-size:12px;color:#666;}
.tabs{display:flex;border-bottom:1px solid #e0e0e0;margin-bottom:20px;}
.tab{padding:15px 0;flex:1;text-align:center;cursor:pointer;font-size:16px;color:#666;}
.tab.active{font-weight:700;border-bottom:2px solid #000;}
.content{display:none;}
.content.active{display:block;}
.news-sections-container{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:20px;}
.news-section{flex:1;min-width:300px;}
.news-item-row{display:flex;margin-bottom:20px;border-bottom:1px solid #f0f0f0;padding-bottom:20px;}
.news-image{width:100px;min-width:100px;height:75px;background:#e0e0e0;border-radius:5px;overflow:hidden;margin-right:15px;}
.news-image img{width:100%;height:100%;object-fit:cover;}
.news-content{flex:1;}
.news-title{margin-bottom:5px;line-height:1.4;}
.news-source{font-size:12px;color:#888;}
.news-time{font-size:12px;color:#888;margin-left:5px;}
.pagination{display:flex;justify-content:center;align-items:center;margin-top:20px;clear:both;}
.page-btn{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid #e0e0e0;margin:0 5px;cursor:pointer;}
.page-btn.active{background:#f5f5f5;font-weight:700;}
.green-box{background:#e8f5e9;}
@media(max-width:640px){.news-image{width:80px;min-width:80px;height:60px;} .news-title{font-size:13px;} .news-sections-container{flex-direction:column;} .news-section{width:100%;}}
/* 사이드 콘텐츠 카드 */
.side-content{flex:1;display:flex;flex-direction:column;gap:20px;}
.investor-card{background:#fff;border-radius:12px;box-shadow:0 2px 5px rgba(0,0,0,.03);padding:30px;}
.investor-card .card-header{font-size:19px;font-weight:600;margin-bottom:30px;display:flex;justify-content:space-between;align-items:center;}
.investor-card .info-icon{width:16px;height:16px;background:#eee;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;color:#999;margin-left:5px;}

/* 매수/매도 탭 */
.investor-card .tab-container{display:flex;margin-bottom:15px;border-bottom:1px solid #eee;}
.investor-card .tab{padding:10px 20px;cursor:pointer;font-size:14px;}
.investor-card .tab.active{color:#000;font-weight:600;border-bottom:2px solid #212529;margin-bottom:-1px;}
.investor-card .tab.inactive{color:#999;}

/* 투자 백분율 바 */
.percentage-bar{background:#edf4ff;height:6px;width:60px;border-radius:3px;position:relative;margin-top:3px;margin-left:auto;}
.percentage-value{position:absolute;top:0;left:0;height:100%;background:#4386f9;border-radius:3px;}

/* 상승/하락 색상 */
.positive{color:#f75467;}
.negative{color:#4386f9;}

/* 코인 리스트 (오른쪽 카드 재사용) */
.investor-card .coin-list{display:flex;flex-direction:column;gap:15px;}
.investor-card .coin-item{display:flex;align-items:center;width:100%;}
.investor-card .coin-item .rank{font-weight:600;margin-right:10px;width:18px;}
.investor-card .coin-info{flex:1;}
.investor-card .coin-name{font-weight:500;font-size:14px;}
.investor-card .coin-ticker{font-size:12px;color:#999;margin-top:2px;display:block;}
.investor-card .coin-price{text-align:right;white-space:nowrap;}

.h-100 {height: 100%;}


/* 모바일 대응 */
@media(max-width:768px){
.side-content{width:100%;}
.investor-card{padding:20px;}
 .investor-card .card-header{/*font-size:17px;*/} 
}
@media(max-width:576px){
.investor-card{padding:15px;}
.investor-card .tab{padding:10px;}
.h-100 {height:inherit;}
}
.investor-card .mainQuick ul{display: flex; justify-content: space-between;}  
.investor-card .mainQuick ul li{padding-bottom: 8px;}    
.investor-card .mainQuick .theme-name{font-weight: 500; font-size: 14px;color: var(--text);}

.section-tit-wrap { padding: 20px 5px 0;}
.section-tit-wrap .section-tit {font-size: 1.5rem; font-weight: 600; letter-spacing: -0.01rem;}
.section-tit-wrap p {margin: 0;font-size: 0.95rem;}
@media(max-width:576px){
.section-tit-wrap .section-tit {font-size: 19px; padding-bottom: 10px;}
}


#ticker-tape {grid-column: span 2;}
.tradingview-widget-container {height: inherit !important;}
.tradingview-widget-copyright {display: none;}
.index-bg{ background-image: url(../theme/basic/img/waveindex-img.png);background-repeat: no-repeat;background-size: 110px;background-position: 63% 20%;}      
.section-hd-tit{font-size: 70px; font-weight: 400; font-family: Oswald;}
@media(max-width:576px){
.section-hd-tit{font-size: 64px;}    
.index-bg{ background-position: 100% 20%; background-size: 100px;}      
}
.ko-wrap {display: flex;justify-content: space-around;}
.ko-name {    font-size: 1rem;    font-weight: 600;    letter-spacing: -0.01rem; text-align: center;font-family: "Jost", sans-serif;}
.ko-data {    font-size: 1.5rem;    font-weight: 600;    letter-spacing: -0.01rem; text-align: center;font-family: "Jost", sans-serif; color: #f75467;}
.ko-data-ch {    font-size: 1rem;    font-weight: 600;    letter-spacing: -0.01rem; text-align: center;font-family: "Jost", sans-serif; color: #f75467;}
.main-banner img { border-radius: 8px;}