.analytics-menu-unit { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; position: relative; margin: 0 0 10px; background-color: #fff; border: 1px solid #d6dee5; }

._toggle-menu { display: inline-block; overflow: hidden; line-height: 30px; background-color: #fff; border: 1px solid #d6dee5; border-radius: 5px; }
._toggle-menu > li { display: inline; }
._toggle-menu .menu-item { display: inline-block; padding: 0 10px; color: #777; }
._toggle-menu .menu-item:hover { text-decoration: none; background-color: #f2f4f6; }
._toggle-menu .current { background-color: #f9fafb; }

._column-related { position: absolute; right: 0; top: 0; }
._column-related .related-item { display: inline-block; vertical-align: top; }
._column-related .related-item + .related-item { margin-left: 10px; }

.analytics-menu-unit { -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px; border-radius: 5px 5px 0 0; margin: 0; padding: 0 10px; background-color: #f2f4f6; border-bottom: none; max-height: 60px; }
.analytics-menu-unit + ._unit { -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0; border-radius: 0 0 5px 5px; border-top: none; }
.analytics-menu-unit ._column-related { top: 14px; right: 14px; }
.analytics-menu-unit .range { line-height: 32px; }
.analytics-menu-unit .sprites-more-black { margin-left: 3px; }
.analytics-menu-unit .related { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; margin-left: 15px; padding: 8px 10px; line-height: 1; background-color: #fff; }
.analytics-menu-unit .related:hover { padding: 7px 9px; text-decoration: none; border: 1px solid #d6dee5; }

.column-breadcrumb-menu { display: inline; vertical-align: middle; }
.column-breadcrumb-menu.truncatable-container { display: inline-block; }
.column-breadcrumb-menu .self .current-menu-item { color: #333; }
.column-breadcrumb-menu .label, .column-breadcrumb-menu .label-truncate, .column-breadcrumb-menu .item { position: relative; display: inline-block; padding-right: 5px; line-height: 60px; font-size: 14px; font-weight: bold; }
.column-breadcrumb-menu .label { padding-right: 5px; }
.column-breadcrumb-menu .label-truncate { max-width: 225px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.column-breadcrumb-menu .label-truncate + .item { vertical-align: top; }
.column-breadcrumb-menu .item:hover .sub-menu-wrapper { display: block; }
.column-breadcrumb-menu .item + .item { padding-left: 30px; background: url('../images/breadcrumb-separator.png') no-repeat 0 50%; }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { .column-breadcrumb-menu .item + .item { background-image: url('../images/breadcrumb-separator@2x.png'); background-size: 16px 60px; } }
.column-breadcrumb-menu .sub-menu-wrapper { display: none; position: absolute; z-index: 15001; left: 50%; width: 98px; margin: -6px 0 0 -49px; line-height: 1.5; }
.column-breadcrumb-menu .current-menu-item { display: inline-block; }
.column-breadcrumb-menu .sub-menu { position: relative; padding: 5px 0; font-size: 12px; background-color: #fff; border: 1px solid #d6dee5; border-radius: 5px; }
.column-breadcrumb-menu .sub-menu:before { content: ""; display: block; position: absolute; top: -10px; bottom: auto; left: 50%; margin-left: -10px; width: 0; height: 0; border-width: 10px; border-top-width: 0; border-color: #d6dee5 transparent; border-style: solid; }
.column-breadcrumb-menu .sub-menu:after { content: ""; display: block; position: absolute; top: -8px; bottom: auto; left: 50%; margin-left: -9px; width: 0; height: 0; border-width: 9px; border-top-width: 0; border-color: #fff transparent; border-style: solid; }
.column-breadcrumb-menu .menu-item { display: block; white-space: nowrap; padding: 2px 10px; color: #777; font-weight: normal; }
.column-breadcrumb-menu .menu-item.current { background-color: #f9fafb; }
.column-breadcrumb-menu .menu-item:hover { text-decoration: none; background-color: #f2f4f6; }
.column-breadcrumb-menu .sprites-more-black { margin-left: 3px; vertical-align: 3px; }
.column-breadcrumb-menu ._user-icon, .column-breadcrumb-menu .work-thumbnail { margin-right: 10px; vertical-align: -15px; }

.analytics-chart-unit { position: relative; text-align: center; background-color: #fff; border: 1px solid #d6dee5; border-top: none; border-bottom: none; }

#chart-container { height: 234px; }

.old, .new { -moz-transition: opacity 0.2s; -o-transition: opacity 0.2s; -webkit-transition: opacity 0.2s; transition: opacity 0.2s; opacity: .5; position: absolute; top: 3px; width: 24px; height: 64px; padding: 97px 23px 117px; cursor: pointer; }
.old:hover, .new:hover { opacity: 1; }
.old:hover img, .new:hover img { background-color: #f5f5f5; border-radius: 5px; }
.old img, .new img { -moz-transition: background-color 0.2s; -o-transition: background-color 0.2s; -webkit-transition: background-color 0.2s; transition: background-color 0.2s; padding: 20px 10px; }

.old { left: 0; }

.new { right: 0; }

.chart-header { border-top: 3px solid #6c8c9c; }

.sections { display: inline-block; margin: 0; padding: 0; }
.sections:hover .current:before { content: none; }
.sections li { display: inline-block; }
.sections li.current, .sections li:hover { position: relative; }
.sections li.current:before, .sections li:hover:before { content: ""; display: block; position: absolute; top: auto; bottom: -10px; left: 50%; margin-left: -10px; width: 0; height: 0; border-width: 10px; border-bottom-width: 0; border-color: #6c8c9c transparent; border-style: solid; }
.sections li.current:before, .sections li:hover:before { top: 0; bottom: auto; }
.sections li:hover:before { content: "" !important; }
.sections li a { display: inline-block; padding: 15px 25px 10px; color: #555; vertical-align: top; line-height: 24px; }
.sections li a:hover { text-decoration: none; }
.sections li .increase-count { margin-left: 5px; color: #55b647; }
.sections li .count { color: #289bd6; font-size: 24px; }
.sections li .count .separator { margin: 0 5px; }
.sections li .separator { margin: 0 2px; color: #999; }
.sections li.current .count { color: black; font-weight: bold; }

.layout-analytics { *zoom: 1; }
.layout-analytics:after { content: ""; display: table; clear: both; }
.layout-analytics .layout-column-1 { -moz-border-radius: 0 0 0 5px; -webkit-border-radius: 0; border-radius: 0 0 0 5px; display: table-cell; width: 740px; vertical-align: top; background-color: #fff; border: 1px solid #d6dee5; }
.layout-analytics .layout-column-2 { -moz-border-radius: 0 0 5px 0; -webkit-border-radius: 0; border-radius: 0 0 5px 0; display: table-cell; vertical-align: top; width: 227px; border: 1px solid #d6dee5; border-left: none; background: #f2f4f6 url('../images/bg-activity.png') repeat-x 0 0; }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { .layout-analytics .layout-column-2 { background-image: url('../images/bg-activity@2x.png'); background-size: 1px 449px; } }

.referer-container { width: 325px; display: inline-block; vertical-align: top; margin: 20px 0 17px 30px; }
.referer-container .title { margin: 0 0 17px; font-size: 16px; font-weight: bold; line-height: 1; }
.referer-container .more { padding: 7px 0; text-align: center; line-height: 1; }

.referer-item { position: relative; margin: 0 -3px; padding: 3px; }
.referer-item.has-data { -moz-border-radius: 7px; -webkit-border-radius: 7px; border-radius: 7px; padding: 2px; border: 1px solid #ddd; }
.referer-item + .referer-item { margin-top: 2px; }
.referer-item .loading-indicator-small { position: absolute; left: -20px; top: 9px; }

.referer-bar { overflow: hidden; height: 30px; }
.referer-item.has-data .referer-bar { cursor: pointer; }
.referer-item.has-data .referer-bar:hover .bar { fill: #bed51a; }
.referer-item.has-data .referer-bar:hover .bar-backbround { fill: #f7f8fa; }

.referer-detail-container { display: none; }

.referer-detail-list { padding: 2px 0 0; color: #555; }
.referer-detail-list .item { display: block; position: relative; padding: 3px 5px; }
.referer-detail-list .count { position: absolute; top: 3px; right: 5px; color: #4875a2; }

.activity-container { overflow: hidden; height: 448px; }
.activity-container .container-title { padding: 6px 10px; font-weight: bold; line-height: 1; border-bottom: 1px solid #d6dee5; }
.activity-container ._no-item { margin: 25px 0; font-size: 12px; background-color: inherit; }

.activity-items { overflow-y: auto; max-height: 423px; border-bottom: 1px solid #d6dee5; }

.activity-item + .activity-item { border-top: 1px solid #d6dee5; }
.activity-item .work { display: block; position: relative; min-height: 40px; padding: 10px 10px 10px 60px; }
.activity-item .work:hover { text-decoration: none; }
.activity-item .work:hover .title { text-decoration: underline; }
.activity-item .work-icon { position: absolute; top: 10px; left: 10px; }
.activity-item .title { font-weight: normal; }
.activity-item .sammery { display: inline; color: #00a42e; }
.activity-item .sammery li { display: inline; }
.activity-item .sammery li + li:before { content: "/"; margin: 0 4px; color: #fff; }
.activity-item ._icon { margin-left: 2px; vertical-align: 0; }

.chart-tooltip-container { margin-bottom: -3px; }
.chart-tooltip-container .datetime { margin: 2px -10px 0; padding: 0 10px; text-align: center; line-height: 1; }
.chart-tooltip-container .label { margin: 4px 0 2px; text-align: center; line-height: 1; color: #999; }
.chart-tooltip-container .total { margin: 0 10px; padding: 0 0 12px; text-align: center; font-weight: bold; font-size: 24px; line-height: 1; }
.chart-tooltip-container .detail { margin-top: -2px; padding: 5px 0 4px; border-top: 1px dashed #555; }
.chart-tooltip-container .detail dt { width: 30px; text-align: left; }
.chart-tooltip-container .detail dt.male { color: #89e1f4; }
.chart-tooltip-container .detail dt.female { color: #fab0a3; }
.chart-tooltip-container .detail dt.unknown { color: #a1db8d; }
.chart-tooltip-container .detail dd { margin-left: 35px; }

#ui-chart-timeline-tooltip-container { position: absolute; z-index: 10000; -ms-overflow-style: -ms-autohiding-scrollbar; scrollbar-face-color: #999; scrollbar-track-color: #333; }
#ui-chart-timeline-tooltip-container .content { padding: 12px 10px; font-size: 11px; line-height: 15px; color: #fff; background-color: #333; border-radius: 3px; }
#ui-chart-timeline-tooltip-container .nipple { position: relative; }
#ui-chart-timeline-tooltip-container .nipple:before { content: ""; display: block; position: absolute; top: -10px; bottom: auto; left: 50%; margin-left: -10px; width: 0; height: 0; border-width: 10px; border-top-width: 0; border-color: #333 transparent; border-style: solid; }
#ui-chart-timeline-tooltip-container ::-webkit-scrollbar { width: 4px; height: 4px; }
#ui-chart-timeline-tooltip-container ::-webkit-scrollbar-thumb { background: #999; }
#ui-chart-timeline-tooltip-container ::-webkit-scrollbar-track { background: #333; }

.chart-illust-timeline-tooltip-container, .chart-novel-timeline-tooltip-container { margin-bottom: -3px; }
.chart-illust-timeline-tooltip-container .datetime, .chart-novel-timeline-tooltip-container .datetime { margin: 6px -10px 0; padding: 0 10px; text-align: center; line-height: 1; }
.chart-illust-timeline-tooltip-container .label, .chart-novel-timeline-tooltip-container .label { margin: 4px 0 2px; text-align: center; line-height: 1; color: #999; }
.chart-illust-timeline-tooltip-container .total, .chart-novel-timeline-tooltip-container .total { margin: 0 10px; padding: 0 0 10px; text-align: center; font-weight: bold; font-size: 24px; line-height: 1; }
.chart-illust-timeline-tooltip-container .items, .chart-novel-timeline-tooltip-container .items { margin-top: 2px; padding-top: 3px; overflow-y: auto; }

.chart-illust-timeline-tooltip-container .items { max-width: 335px; max-height: 250px; margin-left: -10px; }
.chart-illust-timeline-tooltip-container .items a { display: inline-block; margin-bottom: 10px; margin-left: 10px; }
.chart-illust-timeline-tooltip-container .items a img { max-width: 100px; }

.chart-novel-timeline-tooltip-container .items { max-height: 210px; width: 300px; }
.chart-novel-timeline-tooltip-container .items a { text-decoration: none; }
.chart-novel-timeline-tooltip-container .items .item { position: relative; min-height: 40px; padding: 10px 10px 10px 60px; }
.chart-novel-timeline-tooltip-container .items .item .title { font-size: 13px; color: #fff; }
.chart-novel-timeline-tooltip-container .items .item .thumbnail { position: absolute; top: 10px; left: 10px; height: 40px; width: 40px; }

.recent-container { margin-top: 10px; }

.recent-items { margin: 0 0 15px 20px; }

.recent-item { width: 232px; display: inline-block; position: relative; vertical-align: top; }
.recent-item .work { display: block; min-height: 50px; padding: 10px; }
.recent-item .work:hover { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; padding: 9px; border: 1px solid #d6dee5; }
.recent-item .work:hover .title { text-decoration: underline; }
.recent-item .work-icon { position: absolute; top: 10px; left: 10px; width: 50px; height: 50px; text-align: center; }
.recent-item .work-icon img { max-width: 50px; max-height: 50px; }
.recent-item .title { margin-left: 65px; }