Files
wace_plm/WebContent/js/rMateChartH5/Assets/Css/rMateChartH5.css
chpark da06c4684c Initial commit: WACE PLM with database initialization features
- Add Docker Compose configurations for dev, prod, and standalone environments
- Add database initialization scripts (init-db.sh, init-db-docker.sh)
- Add enhanced start-docker-linux.sh with DB init support
- Add comprehensive database initialization guide
- Support for automatic dbexport.pgsql import on first run
- Include safety checks for production environment
2025-08-29 15:46:08 +09:00

1078 lines
22 KiB
CSS

/******************************************************
*
* rMateH5 Global
*
*****************************************************/
.rMateH5__Root{
color:#000000;
font-size:11px;
font-style:normal;
line-height:normal;
font-weight:normal;
font-variant:normal;
font-stretch:normal;
text-decoration:none;
font-family:arial, verdana;
box-sizing : border-box;
-moz-box-sizing : border-box;
-webkit-box-sizing : border-box;
width:0px;
height:0px;
}
.rMateH5__Root *{
box-sizing : border-box;
-moz-box-sizing : border-box;
-webkit-box-sizing : border-box;
/* 모바일에서 꾹 누르고 있을 경우 발생하는 회색 박스 삭제 */
-webkit-tap-highlight-color : rgba(0, 0, 0, 0);
}
.rMateH5__Main div, .rMateH5__Main span, .rMateH5__Main canvas, .rMateH5__PopUp{
position:absolute;
}
.rMateH5__UnAvailableComponent > div{
width:90%;
height:90%;
font-size:15px;
border:1px solid #ccc;
-webkit-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.5);
box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.5);
}
/******************************************************
*
* rMateChart
*
*****************************************************/
.rMateH5__rMateChart, .rMateH5__TrialMarkBox{
color:#777777;
cursor:default;
}
.rMateH5__rMateChart .center{
top:0;
left:0;
right:0;
bottom:0;
margin:auto;
position:absolute;
}
/******************************************************
*
* Chart Common
*
*****************************************************/
.rMateH5__Main{
/* html요소가 드래그 되거나 더블 클릭 등 셀렉트 되었다고 판단 시 나오는 파란 박스 삭제 */
user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
}
.rMateH5__Main canvas, .rMateH5__Main .pen{
pointer-events:none;
}
.rMateH5__rMateChart .cp{
cursor:pointer;
}
/******************************************************
*
* Preloader
*
*****************************************************/
.rMateH5__Preloader{
top:0px;
left:0px;
z-index:2;
width:100%;
height:100%;
opacity:0.7;
background:url("./loader.gif") 50% 50% no-repeat #FFF;
}
/******************************************************
*
* ContextMenu
*
*****************************************************/
.rMateH5__ContextMenu {
padding : 4px;
font-size:12px;
border: #eee solid 1px;
background-color : #fff;
color : #999;
text-align : center;
-ms-user-select : none;
-moz-user-select : none;
-webkit-user-select : none;
user-select : none;
-webkit-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.5);
box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.5);
}
.rMateH5__ContextMenu span{
cursor:pointer;
position:relative;
padding:4px 8px;
white-space:nowrap;
background-color:#fff;
transition:background-color 0.2s;
}
.rMateH5__ContextMenu span:hover{
background-color:#eee !important;
}
.rMateH5__ContextMenu span.disabled{
color:#cecece;
}
.rMateH5__ContextMenu hr {
border:solid 0.5px #ccc;
margin:4px 1px;
}
/******************************************************
*
* ScrollBar
*
*****************************************************/
.rMateH5__ScrollBar {
background-color:#fff;
}
.rMateH5__HScrollTrack, .rMateH5__VScrollTrack {
border:1px solid #e6e6e6;
}
.rMateH5__HScrollThumb, .rMateH5__VScrollThumb {
cursor:pointer;
background-color:#e6e6e6;
transition:background-color 0.2s;
}
.rMateH5__HScrollThumb:hover, .rMateH5__VScrollThumb:hover{
background-color:#888888;
}
.rMateH5__HScrollThumbHeader{
}
.rMateH5__HScrollUpArrow {
border:1px solid #e6e6e6;
cursor:pointer;
background:url("./scroll_left_arrow.png") no-repeat 50% 50%;
}
.rMateH5__HScrollDownArrow {
border:1px solid #e6e6e6;
cursor:pointer;
background:url("./scroll_right_arrow.png") no-repeat 50% 50%;
}
.rMateH5__VScrollThumbHeader{
}
.rMateH5__VScrollUpArrow {
border:1px solid #e6e6e6;
border-right:none;
cursor:pointer;
background:url("./scroll_up_arrow.png") no-repeat 50% 50%;
}
.rMateH5__VScrollDownArrow {
border:1px solid #e6e6e6;
border-right:none;
cursor:pointer;
background:url("./scroll_down_arrow.png") no-repeat 50% 50%;
}
/******************************************************
*
* SymboldDiv
*
*****************************************************/
.rMateH5__SymbolDiv{
cursor:pointer;
text-align:center;
}
/******************************************************
*
* DataEditor
*
*****************************************************/
.rMateH5__DataEditor{
overflow-y:hidden;
overflow-x:auto;
}
.rMateH5__DataEditor table{
height:100%;
border:solid 1px #555555;
text-decoration:none;
font-style:normal;
font-weight:normal;
font-size:11px;
text-align:center;
cursor:default;
}
/* default th */
.rMateH5__DataEditor th{
color:#ffffff;
font-weight:bold;
font-size:11px;
letter-spacing:0;
text-align:center;
height:22px;
padding:2px 4px;
background:-ms-linear-gradient(270deg, #6e7376 20%, #6e7376 100%);
background:-moz-linear-gradient(270deg, #6e7376 20%, #6e7376 100%);
background:-o-linear-gradient(270deg, #6e7376 20%, #6e7376 100%);
background:-webkit-linear-gradient(270deg, #6e7376 20%, #6e7376 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff6e7376', endColorstr='#ff6e7376');
}
.rMateH5__DataEditor th.column{
border-right:solid 1px #555555;
}
.rMateH5__DataEditor th.row{
border-bottom:solid 1px #555555;
}
.rMateH5__DataEditor td{
padding:2px 4px;
}
.rMateH5__DataEditor td.column{
border-right:solid 1px #555555;
}
.rMateH5__DataEditor td.row{
border-bottom:solid 1px #555555;
}
.rMateH5__DataEditor td.oddRow{
background-color:#EFEEEE;
}
.rMateH5__DataEditor td.evenRow{
background-color:#FFFFFF;
}
.rMateH5__DataEditor td:hover{
background-color:#E3FFD6;
}
.rMateH5__DataEditor td:focus{
background-color:#D1EBB4;
color:#ff0000;
}
.rMateH5__CloseButton{
background:url("./close_btn.png") no-repeat;
cursor:pointer;
position:absolute;
width:13px;
height:13px;
}
.rMateH5__CloseButton:hover{
background:url("./hover_close_btn.png") no-repeat;
}
/******************************************************
*
* AxisLineLabel
*
*****************************************************/
.rMateH5__AxisLineLabel{
position:absolute;
background-color:#fff;
}
/******************************************************
*
* DrillDownMenu
*
*****************************************************/
.rMateH5__DrillDownMenu{
left:0px;
top:0px;
position:absolute;
text-align:center;
}
.rMateH5__DrillDownMenu > .rMateH5__DrillDownBackButton,
.rMateH5__DrillDownMenu > .rMateH5__DrillDownFirstButton{
position:relative;
min-width:83px;
min-height:29px;
text-align:center;
color:#666;
background-color:rgba(255, 255, 255, 0.8);
transition:box-shadow 0.2s;
cursor:pointer;
float:left;
margin-right:8px;
padding:8px;
-webkit-box-shadow:0px 2px 2px 0px rgba(0,0,0,0.16), 0px 0px 0px 1px rgba(0,0,0,0.08);
-moz-box-shadow:0px 2px 2px 0px rgba(0,0,0,0.16), 0px 0px 0px 1px rgba(0,0,0,0.08);
box-shadow:0px 2px 2px 0px rgba(0,0,0,0.16), 0px 0px 0px 1px rgba(0,0,0,0.08);
}
.rMateH5__DrillDownMenu > .rMateH5__DrillDownBackButton:hover,
.rMateH5__DrillDownMenu > .rMateH5__DrillDownFirstButton:hover{
-webkit-box-shadow:0 3px 8px 0 rgba(0,0,0,0.2), 0 0 0 1px rgba(0,0,0,0.08);
-moz-box-shadow:0 3px 8px 0 rgba(0,0,0,0.2), 0 0 0 1px rgba(0,0,0,0.08);
box-shadow:0 3px 8px 0 rgba(0,0,0,0.2), 0 0 0 1px rgba(0,0,0,0.08);
}
/******************************************************
*
* History
*
*****************************************************/
.rMateH5__ChartRangeSelector{
pointer-events:auto;
}
.rMateH5__ChartRangeSelector_LeftThumb, .rMateH5__ChartRangeSelector_RightThumb{
width:10px;
height:100%;
cursor:col-resize;
border-bottom:solid 1px #b5b5b7;
background:url("./selector.png") no-repeat 50% 50%;
background-color:rgba(236, 240, 241, 0.6);
}
.rMateH5__ChartRangeSelector_Left, .rMateH5__ChartRangeSelector_Right{
border:solid 1px #eee;
border-bottom:solid 1px #b5b5b7;
background-color:rgba(236, 240, 241, 0.6);
}
.rMateH5__ChartRangeSelector_Center{
cursor:pointer;
background-color:rgba(255, 255, 255, 0);
}
/******************************************************
*
* SlideChart
*
*****************************************************/
.rMateH5__SlideController{
}
.rMateH5__PrevCanvas, .rMateH5__NextCanvas{
position:absolute;
z-index:1;
}
/* 슬라이드 이전 버튼 */
.rMateH5__SlidePrevButton{
background:url("./slide_left.png") no-repeat 50% 50%;
}
/* 슬라이드 다음 버튼 */
.rMateH5__SlideNextButton{
background:url("./slide_right.png") no-repeat 50% 50%;
}
.rMateH5__SlidePrevButton, .rMateH5__SlideNextButton{
width:20px;
height:20px;
}
/* 슬라이드 버튼 */
.rMateH5__SlideButton{
width:15px;
height:15px;
background:url("./slide_button.png") no-repeat 50% 50%;
}
/* 선택된 슬라이드의 버튼 */
.rMateH5__SlideActiveButton{
background:url("./slide_active_button.png") no-repeat 50% 50%;
}
.rMateH5__SlideButton, .rMateH5__SlidePrevButton, .rMateH5__SlideNextButton{
cursor:pointer;
position:absolute;
}
/******************************************************
*
* Slider
*
*****************************************************/
.rMateH5__Slider, .rMateH5__HSlider, .rMateH5__VSlider {
position : absolute;
cursor : default;
font-size : 11px;
-ms-user-select : none;
-moz-user-select : none;
-webkit-user-select : none;
user-select : none;
}
.rMateH5__Slider_Track {
width : 200px;
height : 4px;
border-width : 1px;
border-style : inset;
border-color : #DDDDDD;
position : absolute;
-ms-user-select : none;
-moz-user-select : none;
-webkit-user-select : none;
user-select : none;
}
.rMateH5__Slider_HighlightTrack {
width : 1px;
height : 2px;
border-width : 1px;
border-style : inset;
border-color : #FF0000;
position : absolute;
}
.rMateH5__Slider_TrackHitArea {
position : absolute;
}
.rMateH5__Slider_Ticks {
position : absolute;
}
.rMateH5__Slider_Tick {
position : absolute;
border-width : 1px;
border-left-style : solid;
}
.rMateH5__Slider_Labels .rMateH5__Label {
position : absolute;
-ms-user-select : none;
-moz-user-select : none;
-webkit-user-select : none;
user-select : none;
}
.rMateH5__SliderThumb {
display : inline-block;
position : absolute;
width : 16px;
height : 16px;
background:#f5f5f5;
background:linear-gradient(rgb(255, 255, 255), rgb(213, 213, 213));
border:solid 1px rgb(200, 200, 200);
border-radius : 12px;
outline : none;
-ms-user-select : none;
-moz-user-select : none;
-webkit-user-select : none;
user-select : none;
}
/******************************************************
*
* MotionController
*
*****************************************************/
.rMateH5__MotionController{
height:33px;
padding:4px 4px 4px 19px;
border:solid 1px #dbdbdb;
border-radius:3px;
background-color:#f5f5f5;
}
.rMateH5__PlayButton{
position:absolute;
width:11px;
height:13px;
border-style:none;
cursor:pointer;
text-align:center;
padding-top:5px;
background:url(./motion_play_button.png) no-repeat;
background-position-x:50%;
}
.motion_pause{
background-position-y:100%;
}
.rMateH5__Pause{
background:url("./loader.gif") no-repeat 50% 50%;
}
.rMateH5__MotionController .rMateH5__HSlider{
height:14px;
position:absolute;
font-size:1px;
cursor:pointer;
}
.rMateH5__MotionController .rMateH5__Slider_Track{
border-top:solid 2px #cecece;
border-bottom:solid 2px #e5e5e5;
background-color:#fff;
height:10px;
border-radius:6px;
}
.rMateH5__MotionController .rMateH5__Slider_HighlightTrack{
border:none;
height:8px;
border-radius:6px;
border-top:solid 1px #ff9600;
border-bottom:solid 1px #fba72d;
background:url(./background_highlight_track.png);
}
.rMateH5__MotionController .rMateH5__SliderThumb{
position:absolute;
}
/******************************************************
*
* Caption, SubCaption
*
*****************************************************/
.rMateH5__Caption{
font-size : 14px;
color : #333333;
text-align : center;
}
.rMateH5__SubCaption{
font-size : 11px;
color : #999999;
text-align : center;
}
/******************************************************
*
* Axis2DRenderer
*
*****************************************************/
.rMateH5__Axis2DRenderer{
}
.rMateH5__Axis2DRenderer.horizontal{
text-align:center;
}
.rMateH5__Axis2DRenderer.vertical{
text-align:right;
}
/******************************************************
*
* DataTip, AxisDataTip
*
*****************************************************/
.rMateH5__DataTip{
opacity:0;
color:#888;
font-size:12px;
font-style:normal;
padding:4px 10px;
cursor:default;
white-space:nowrap;
border:solid 1px #e9e9e9;
border-radius:4px;
background-color:rgba(255, 255, 255, 0.9);
z-index:1;
transition:left 0.2s, top 0.2s, opacity 0.5s, border 0.5s;
-webkit-transition:left 0.2s, top 0.2s, opacity 0.5s, border 0.5s;
transition-timing-function:ease-out;
-webkit-transition-timing-function:ease-out;
}
.rMateH5__DataTip.axis{
color:#fff;
background-color:rgba(119, 119, 119, 0.9);
transition:left 0.1s, top 0.1s, opacity 0.5s, border 0.5s;
-webkit-transition:left 0.1s, top 0.1s, opacity 0.5s, border 0.5s;
}
.rMateH5__DataTip.delay{
transition-delay:0.5s;
}
.rMateH5__DataTip.show{
opacity:1;
}
.rMateH5__DataTip.hide{
opacity:0;
}
.rMateH5__DataTip.mouse{
transition:opacity 0.5s, border 0.5s;
-webkit-transition:opacity 0.5s, border 0.5s;
transition-timing-function:ease-out;
-webkit-transition-timing-function:ease-out;
}
.rMateH5__DataTip.transition, .rMateH5__AxisDataTip.transition{
}
.rMateH5__DataTip *{
color:normal;
}
.rMateH5__DataTip span{
position:relative;
}
.rMateH5__DataTipMarker{
float:left;
width:9px;
height:9px;
margin-top:3px;
border:1px solid #ffffff;
}
/******************************************************
*
* RangeSelector
*
*****************************************************/
.rMateH5__RangeSelector{
position:absolute;
border:solid 1px rgb(27, 161, 226);
background-color:rgba(27, 161, 226, 0.5);
}
/******************************************************
*
* Legend
*
*****************************************************/
.rMateH5__Legend, .rMateH5__SubLegend{
color:#888;
border:1px solid #e9e9e9;
background-color:#ffffff;
cursor:default;
}
.rMateH5__Legend .rMateH5__ContentPane, .rMateH5__SubLegend .rMateH5__ContentPane{
padding:5px;
}
.rMateH5__LegendItem, .rMateH5__CheckableLegendItem{
padding:0;
border:0px none;
background-color:rgba(255, 255, 255, 0);
white-space:nowrap;
}
.rMateH5__UnChecked{
color:#ccc;
}
.rMateH5__UnFocused{
opacity:0.2;
}
/******************************************************
*
* ColorRangeLegend
*
*****************************************************/
/* ColorRangeLegend */
.rMateH5__ColorRangeLegend{
position:absolute;
overflow:hidden;
font-size:11px;
color:#555555;
cursor:default;
}
/* ColorRangeLegend - Label */
.rMateH5__ColorRangeLegend_Label{
position:absolute;
}
/* ColorRangeLegend - Horizontal Arrow */
.rMateH5__ColorRangeLegend_HArrow{
width:5px;
height:5px;
border-top:5px solid #555555;
border-left:2.5px solid transparent;
border-right:2.5px solid transparent;
border-bottom:5px solid transparent;
position:absolute;
box-sizing:border-box;
}
/* ColorRangeLegend - Vertical Arrow */
.rMateH5__ColorRangeLegend_VArrow{
width:5px;
height:5px;
border-top:2.5px solid transparent;
border-left:5px solid transparent;
border-right:5px solid #555555;
border-bottom:2.5px solid transparent;
position:absolute;
box-sizing:border-box;
}
/*********************************************************
Holder
*********************************************************/
.rMateH5__BackgroundElementHolder,
.rMateH5__AnnotationElementHolder,
.rMateH5__CanvasElementHolder,
.rMateH5__SeriesHolder{
width:100%;
height:100%;
}
/*********************************************************
BackgroundElementHolder, AnnotationElemenetHolder
*********************************************************/
.rMateH5__BackgroundElementHolder{
pointer-events:none;
}
/*********************************************************
CanvasLabel
*********************************************************/
.rMateH5__CanvasLabel{
pointer-events:auto;
}
/*********************************************************
SeriesHolder
*********************************************************/
.rMateH5__SeriesHolder *{
text-align:center;
}
/*********************************************************
ColumnSet, BarSet, AreaSet
*********************************************************/
/*.rMateH5__ColumnSet > div, .rMateH5__BarSet > div, .rMateH5__AreaSet > div, .rMateH5__Column .rMateH5__WindRoseSet > div{*/
.rMateH5__StackedSeries > div{
width:100%;
height:100%;
}
/*********************************************************
WindRoseChart
*********************************************************/
.rMateH5__WindRoseChart{
padding-top:20px;
padding-bottom:20px;
}
/*********************************************************
CrossRangeZoomer
*********************************************************/
.rMateH5__CrossRangeZoomer{
pointer-events:auto;
}
.rMateH5__CrossRangeZoomer *{
pointer-events:none;
}
.rMateH5__CrossHair_Label{
color:#ffffff;
background-color:#999;
border:1px solid #999;
padding:2px 4px;
text-align:center;
visibility:hidden;
cursor:default;
}
.rMateH5__CrossRangeZoomer_Restore{
top:1px;
right:1px;
cursor:pointer;
font-size:12px;
color:#666;
text-align:center;
padding:8px;
min-width:83px;
min-height:29px;
transition:box-shadow 0.2s;
background-color:#fff;
background-color:rgba(255, 255, 255, 0.8);
-webkit-box-shadow:0px 2px 2px 0px rgba(0,0,0,0.16), 0px 0px 0px 1px rgba(0,0,0,0.08);
-moz-box-shadow:0px 2px 2px 0px rgba(0,0,0,0.16), 0px 0px 0px 1px rgba(0,0,0,0.08);
box-shadow:0px 2px 2px 0px rgba(0,0,0,0.16), 0px 0px 0px 1px rgba(0,0,0,0.08);
}
.rMateH5__CrossRangeZoomer_Restore:hover{
-webkit-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.15);
-moz-box-shadow:0px 2px 5px 0px rgba(0,0,0,0.15);
box-shadow:0 3px 8px 0 rgba(0,0,0,0.2), 0 0 0 1px rgba(0,0,0,0.08);
}
/******************************************************
*
* SlideChart
*
*****************************************************/
.rMateH5__SlideController{
}
.rMateH5__PrevCanvas, .rMateH5__NextCanvas{
position:absolute;
z-index:1;
}
/* 슬라이드 이전 버튼 */
.rMateH5__SlidePrevButton{
background:url("./slide_left.png") no-repeat 50% 50%;
}
/* 슬라이드 다음 버튼 */
.rMateH5__SlideNextButton{
background:url("./slide_right.png") no-repeat 50% 50%;
}
.rMateH5__SlidePrevButton, .rMateH5__SlideNextButton{
width:20px;
height:20px;
}
/* 슬라이드 버튼 */
.rMateH5__SlideButton{
width:15px;
height:15px;
background:url("./slide_button.png") no-repeat 50% 50%;
}
/* 선택된 슬라이드의 버튼 */
.rMateH5__SlideActiveButton{
background:url("./slide_active_button.png") no-repeat 50% 50%;
}
.rMateH5__SlideButton, .rMateH5__SlidePrevButton, .rMateH5__SlideNextButton{
cursor:pointer;
position:absolute;
}
/******************************************************
*
* Line2DSeries DisplayName
*
*****************************************************/
.rMateH5__DisplayName{
cursor:default;
white-space:nowrap;
}
/******************************************************
*
* UserContent
*
*****************************************************/
.rMateH5__UserDefineWrapper{
left:0;
top:0;
position:absolute;
white-space:nowrap;
}
.rMateH5__UserDefineWrapper > div{
position:relative;
}
/******************************************************
*
* PopUp
*
*****************************************************/
.rMateH5__PopUp{
width:196px;
background-color:#fff;
}
.rMateH5__PopUp div{
position:relative;
color:#fff;
}
.rMateH5__PopUp .rMateH5__Title{
width:100%;
height:26px;
background-color:#4452a8;
padding:6px 0 0 10px;
border-top-left-radius:6px;
border-top-right-radius:6px;
}
.rMateH5__PopUp .rMateH5__Content{
color:#222;
border-left:solid 1px #dbdbdb;
border-right:solid 1px #dbdbdb;
padding:26px 30px;
text-align:center;
}
.rMateH5__PopUp .rMateH5__Button{
border:solid 1px #dbdbdb;
border-top:none;
border-bottom-left-radius:6px;
border-bottom-right-radius:6px;
padding-bottom:12px;
}
.rMateH5__PopUp .rMateH5__Button > div{
border-radius:10px;
width:57px;
height:16px;
background-color:#c4c5c9;
margin:0 auto;
text-align:center;
transition:background-color 0.2s;
cursor:pointer;
}
.rMateH5__PopUp .rMateH5__Button > div:hover{
background-color:#999;
}
/******************************************************
*
* Chart Menu
*
*****************************************************/
/* Chart Menu */
.rMateH5__ChartMenu{
top:4px;
right:4px;
width:20px;
height:20px;
font-size:12px;
border-radius:1px;
border:1px solid #ccc;
z-index:1;
overflow:hidden;
opacity:0;
position:absolute;
transition:width 0.2s, height 0.2s, opacity 0.2s;
background:url(./menu.png) #fff no-repeat 50% 50%;
padding-left:18px;
padding-top:18px;
white-space:nowrap;
}
/* Chart 영역에 마우스 오버시 ChartMenu */
.rMateH5__chart_menu_hover{
opacity:1;
}
/* ChartMenu에 마우스 오버시 */
.rMateH5__chart_menu_expand{
width:70px;
height:auto;
padding:4px;
background-position:-20px -20px;
}
/* ChartMenu에 붙는 아이템 들 */
.rMateH5__ChartMenuItem{
width:60px;
padding-left:2px;
cursor:pointer;
background-color:#ffffff;
transition:background-color 0.2s;
white-space:nowrap;
}
/* ChartMenuItem에 설정된 img */
.rMateH5__ChartMenuItem_Img{
width:12px;
height:12px;
margin-right:4px;
}
/* ChartMenuItem 마우스 오버시 */
.rMateH5__ChartMenuItem:hover{
background-color:#555555;
color:#ffffff;
}