/*!
 * Copyright (c) 2017 ~ present NAVER Corp.
 * billboard.js project is licensed under the MIT license
 * 
 * billboard.js, JavaScript chart library
 * https://naver.github.io/billboard.js/
 * 
 * @version 1.12.8 (Mobile Optimized)
 */
.bb-color-pattern{background-image:url(#65CFC2;#D0A45F;#64A4F5;#EF65A2;#A377FE;#8AAEC7;#FF7E5A;#898EFE;#FFAC35;#70B0FF;)}
.bb svg{font-size:12px;font-family:'S-Core-Dream',Helvetica,Apple SD Gothic Neo,Arial,sans-serif,nanumgothic,Dotum;line-height:1}
.bb line,.bb path{fill:none;stroke:#8c8c8c}
.bb .bb-button,.bb text{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;fill:#555;font-size:12px;letter-spacing:-.3px}
.bb-axis,.bb-bars path,.bb-event-rect,.bb-legend-item-title,.bb-xgrid-focus,.bb-ygrid,.bb-ygrid-focus{shape-rendering:crispEdges}
.bb-axis-y2 text,.bb-axis-y text{fill:#8c8c8c}
.bb-event-rects{fill-opacity:1!important}
.bb-event-rects .bb-event-rect{fill:transparent}
.bb-event-rects .bb-event-rect._active_{fill:rgba(39,201,3,.05)}
.tick._active_ text{fill:#00c83c!important}
.bb-grid line{stroke:#f1f1f1}
.bb-xgrid-focus line,.bb-ygrid-focus line{stroke:#ffb6b6;stroke-dasharray:3px}
.bb-text.bb-empty{fill:#767676}
.bb-line{stroke-width:3px}
.bb-circle._expanded_,rect.bb-circle._expanded_,use.bb-circle._expanded_{stroke-width:2px}
.bb-selected-circle{fill:#fff;stroke-width:2px}
.bb-bar{stroke-width:0}
.bb-bar._expanded_{fill-opacity:.75}
.bb-target.bb-focused{opacity:1}
.bb-target.bb-focused path.bb-line,.bb-target.bb-focused path.bb-step{stroke-width:2px}
.bb-target.bb-defocused{opacity:.3!important}
.bb-target.bb-defocused .text-overlapping{opacity:.05!important}
.bb-region{fill:#4682b4;fill-opacity:.1}
.bb-region.selected rect{fill:#27c903}
.bb-brush .extent,.bb-zoom-brush{fill-opacity:.1}
.bb-legend-item{user-select:none}
.bb-legend-item-hidden{opacity:.15}
.bb-legend-background{opacity:.75;fill:#fff;stroke:#d3d3d3;stroke-width:1px}
.bb-legend-item line{stroke-dasharray:10px}
.bb-title{font-size:12px}
.bb-tooltip-container{z-index:10;font-family:Helvetica,Apple SD Gothic Neo,Arial,sans-serif,nanumgothic,Dotum;user-select:none; width:160px;}
.bb-tooltip{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;border-collapse:separate;border-spacing:0;empty-cells:show;border:1px solid #999;border-radius:2px;background-color:#fff;text-align:left;font-size:13px;box-shadow:.5px .5px 1px #999}
.bb-tooltip th{font-size:13px;padding:4px 8px;text-align:center;border-bottom:1px dotted #000;background-color:#efefef;color:#000}
.bb-tooltip tr:last-child td{border-bottom:none}
.bb-tooltip td{padding:3px 6px;background-color:#fff;border-bottom:1px solid #eee}
.bb-tooltip td:first-child{padding-left:5px;border-right:1px solid #eee}
.bb-tooltip td:last-child{padding-right:5px}
.bb-tooltip td>span,.bb-tooltip td>svg{display:inline-block;width:5px;height:13px;margin-right:6px;vertical-align:middle}
.bb-tooltip td.value{border-left:1px solid transparent;text-align:right}
.bb-tooltip .bb-tooltip-title{display:inline-block;color:#aaa;line-height:20px}
.bb-tooltip .bb-tooltip-detail table{border-collapse:collapse;border-spacing:1px;font-size:13px}
.bb-tooltip .bb-tooltip-detail .bb-tooltip-name,.bb-tooltip .bb-tooltip-detail .bb-tooltip-value{line-height:13px;padding:4px 0 3px;color:#444;text-align:left;font-weight:400}
.bb-tooltip .bb-tooltip-detail .bb-tooltip-value{padding-left:5px;font-weight:800}
.bb-area{stroke-width:0;opacity:.2}
.bb-chart-arcs-title{dominant-baseline:middle;font-size:1.3em}
.bb-chart-arcs-gauge-title{dominant-baseline:middle;font-size:2.7em}
.bb-chart-arcs .bb-chart-arcs-background{fill:#e0e0e0;stroke:#fff}
.bb-chart-arcs .bb-chart-arcs-gauge-unit{fill:#000;font-size:16px}
.bb-chart-arcs .bb-chart-arcs-gauge-max,.bb-chart-arcs .bb-chart-arcs-gauge-min{fill:#777}
.bb-chart-arcs .bb-chart-arcs-title{font-size:16px!important;fill:#8c8c8c;font-style:italic}
.bb-chart-arcs path.empty{fill:#eaeaea;stroke-width:0}
.bb-chart-arc .bb-gauge-value{fill:#8c8c8c;font-style:italic}
.bb-chart-arc path{stroke:#fff}
.bb-chart-arc rect{stroke:#fff;stroke-width:1}
.bb-chart-arc text{fill:#fff;font-size:13px;font-weight:700}
.bb-chart-radars .bb-levels polygon{fill:none;stroke:#8c8c8c;stroke-width:.5px}
.bb-chart-radars .bb-levels text{fill:#8c8c8c}
.bb-chart-radars .bb-axis line{stroke:#8c8c8c;stroke-width:.5px}
.bb-chart-radars .bb-axis text{font-size:1.15em;font-weight:700;cursor:default}
.bb-chart-radars .bb-shapes polygon{fill-opacity:.2;stroke-width:1px}
.bb-button{position:absolute;top:10px;right:10px}
.bb-button .bb-zoom-reset{border:1px solid #ccc;background-color:#fff;padding:5px;border-radius:5px;cursor:pointer;opacity:.8;box-shadow:1px 1px 2px #ccc}

/* ========== 모바일 최적화 ========== */
@media screen and (max-width: 768px) {
    /* 기본 폰트 크기 축소 */
    .bb svg{font-size:10px}
    .bb .bb-button,.bb text{font-size:10px}
    
    /* 축 텍스트 최적화 */
    .bb-axis text{font-size:9px}
    .bb-axis-x .tick text{font-size:8px}
    
    /* 라인 두께 조정 */
    .bb-line{stroke-width:2px}
    
    /* 터치 영역 확대 */
    .bb-circle{r:5}
    .bb-circle._expanded_,rect.bb-circle._expanded_,use.bb-circle._expanded_{stroke-width:3px}
    
    /* 툴팁 모바일 최적화 */
    .bb-tooltip{font-size:11px;max-width:90vw;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.15)}
    .bb-tooltip th{font-size:11px;padding:6px 10px}
    .bb-tooltip td{padding:5px 8px}
    .bb-tooltip td>span,.bb-tooltip td>svg{width:8px;height:12px;margin-right:5px}
    
    /* 범례 모바일 최적화 */
    .bb-legend-item{font-size:10px}
    .bb-legend-item rect{width:12px!important;height:12px!important}
    
    /* 제목 크기 조정 */
    .bb-title{font-size:11px}
    .bb-chart-arcs-title{font-size:1.1em}
    .bb-chart-arcs .bb-chart-arcs-title{font-size:14px!important}
    
    /* 줌 버튼 터치 친화적 */
    .bb-button .bb-zoom-reset{padding:8px 12px;font-size:12px;min-width:44px;min-height:44px}
}

/* 더 작은 화면 (스마트폰) */
@media screen and (max-width: 480px) {
    .bb svg{font-size:9px}
    .bb text{font-size:9px}
    .bb-axis text{font-size:8px}
    .bb-axis-x .tick text{font-size:7px}
    
    /* 라인 더 얇게 */
    .bb-line{stroke-width:1.5px}
    
    /* 툴팁 더 컴팩트하게 */
    .bb-tooltip{font-size:10px}
    .bb-tooltip th{font-size:10px;padding:5px 8px}
    .bb-tooltip td{padding:4px 6px}
    
    /* 범례 더 작게 */
    .bb-legend-item{font-size:9px}
    .bb-legend-item rect{width:10px!important;height:10px!important}
    
    /* 차트 제목 */
    .bb-title{font-size:10px}
    .bb-chart-arcs-title{font-size:1em}
    .bb-chart-arcs .bb-chart-arcs-title{font-size:12px!important}
}

/* 터치 디바이스 최적화 */
@media (hover: none) and (pointer: coarse) {
    /* 터치 영역 확대 */
    .bb-event-rect{cursor:pointer}
    .bb-circle{cursor:pointer}
    
    /* 범례 터치 영역 */
    .bb-legend-item{padding:5px;cursor:pointer}
    
    /* 줌 버튼 터치 최적화 */
    .bb-button .bb-zoom-reset{padding:10px 15px;min-width:48px;min-height:48px}
}