@charset "utf-8";

/** --------------------------------------------------------------------------------
 * html body
 */
html {
  overflow-y: scroll;
  min-width: 900px;
  height: 100%;
}

body {
  position: relative;
  min-height: 100%;
  line-height: 1.5;
  color: #444;
  font-size: small;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
}

body.login {
  background-color: #f4f5dd;
}

/** --------------------------------------------------------------------------------
 * ハイパーテキスト
 */
a {
  color: #00985b;
  outline: none;
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
}

a:link,
a:visited,
a:hover,
a:active {
  text-decoration: none;
}

a:hover,
a:active {
  color: #bbbd1c;
}

a img {
  -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
      -ms-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
          transition: all 0.5s ease;
}

a:hover img {
  opacity: 0.8;
  -ms-filter: alpha(opacity=80);
}

/** ------------------------------------------------------------
 * header
 */
header {
  padding: 5px 10px;
  border-bottom: 1px solid #c8c7cc;
  position: relative;
  background-color: #fff;
  /*
  background-color: #eee;
  background: -webkit-linear-gradient(top, #f0f0f0, #d5d5d5);
  background:    -moz-linear-gradient(top, #f0f0f0, #d5d5d5);
  background:     -ms-linear-gradient(top, #f0f0f0, #d5d5d5);
  background:         linear-gradient(to bottom, #f0f0f0, #d5d5d5);
  */
}

.headerMenu {
  margin: auto;
  position: absolute;
  top: 0;
  right: 10px;
  bottom: 0;
  height: 30px;
  line-height: 30px;
}

.headerMenu li {
  margin-left: 5px;
  float: left;
}

.headerMenu li a {
  padding: 0 20px;
  display: block;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  color: #fff;
  background-color: #00985b;
  font-size: medium;
}

/** ------------------------------------------------------------
 * footer
 */
footer {
  border-top: 1px solid #bbb;
  background-color: #fff;
  padding: 20px 0 40px;
  text-align: center;
}

/** ------------------------------------------------------------
 * フォーム部品
 */
button,
input[type="button"],
a.button,
a.linkButton {
  margin: 0;
  padding: 0;
  border: none;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  width: 100%;
  height: 34px;
  color: #fff;
  background-color: #00985b;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  font-size: medium;
  vertical-align: top;
  cursor: pointer;
}

a.button {
  padding-top: 4px;
  padding-bottom: 4px;
  height: auto;
  text-align: center;
  font-size: small;
}

a.linkButton {
  padding: 6px 30px;
  height: auto;
  width: auto;
}

a.button.delete {
  background-color: #3e6757;
}

input[type="text"],input[type="password"],input[type="button"],input[type="image"],input[type="hidden"] {
  margin: 0;
  padding: 6px 10px;
  border: 1px solid #c8c7cc;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-appearance: none;
     -moz-appearance: none;
      -ms-appearance: none;
          appearance: none;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  width: 100%;
  height: 34px;
  background-color: #fff;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  font-size: medium;
  vertical-align: top;
  cursor: pointer;
}

textarea {
  margin: 0;
  padding: 6px 10px;
  border: 1px solid #c8c7cc;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  width: 100%;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
  font-size: medium;
  cursor: pointer;
}

.basicForm {
  width: 100%;
  background-color: #fff;
}

.basicForm th,
.basicForm td {
  padding: 12px 10px;
  border-bottom: 1px solid #c8c7cc;
  vertical-align: middle;
}

.basicForm th {
  width: 160px;
  color: #00985b;
  background-color: #f6f6f6;
  font-weight: bold;
}

.basicForm button[type="submit"] {
  margin: 0 auto;
  display: block;
  width: 40%;
}

.inputShort input {
  margin-right: 5px !important;
  width: 5em !important;
  vertical-align: middle !important;
}

.inputMiddle input {
  margin-right: 5px !important;
  width: 14em !important;
  vertical-align: middle !important;
}

.basicForm td img {
  margin-top: 10px;
}

/** ------------------------------
 * select装飾JS
 */
.customSelect {
  margin-right: 5px;
  border: 1px solid #c8c7cc;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  background-color: #fff;
  width: 250px;
  font-size: 13px;
  display: block;
  white-space: nowrap;
}

.customSelect.changed {
  width: auto !important;
  display: block !important;
  background-color: #f0dea4;
}

.customSelectInner {
  padding: 6px 19px 6px 10px;
  -webkit-border-radius: 0 3px 3px 0;
     -moz-border-radius: 0 3px 3px 0;
          border-radius: 0 3px 3px 0;
  width: auto !important;
  display: block !important;
  background: url("/images/common/selectIcon.png") no-repeat 100%;
  -webkit-background-size: 18px auto;
     -moz-background-size: 18px auto;
          background-size: 18px auto;
  overflow: hidden;
}

select#user + .customSelect {
  width: 150px;
}

select[style*="display: none"] + .customSelect {
  display: none !important;
  height: 33px !important;
}

/** ------------------------------
 * 検索（一行版）
 */
.searchLine {
  padding: 10px;
  border-bottom: 1px solid #c8c7cc;
  box-shadow: 0 1px 0 rgba(0,0,0,0.10) inset;
  background-color: #aaa;
  font-size: 0;
}

.searchLine input {
  width: 80% !important;
}

.searchLine button {
  margin-left: 0.5%;
  width: 19%;
}

/** ------------------------------------------------------------
 * ログイン
 */
.formBox {
  margin: auto;
  border-radius: 2px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  box-shadow: 0 2px 2px rgba(0,0,0,0.3);
  width: 360px;
  height: 390px;
  background-color: #f7f7f7;
  font-size: medium;
}

.formBox.pe-7s-door-lock:before {
  padding: 20px 0 10px;
  border-radius: 2px 2px 0 0;
  display: block;
  text-align: center;
  font-size: 80px;
  color: #fff;
  background-color: #c8c7cc;
}

.formBox__inner {
  padding: 40px 40px;
  font-family: "メイリオ","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;
}

.formBox__title {
  color: #00653c;
}

.formBox input {
  margin: 6px 0 16px !important;
}

.formBox input,
.formBox button {
  height: 40px;
}

/* 部署選択時・上書き */
.selectDept {
  margin: auto;
  border-radius: 2px;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  box-shadow: 0 2px 2px rgba(0,0,0,0.3);
  width: 360px;
  height: 243px;
  background-color: #f7f7f7;
  font-size: medium;
}

.selectDept__title {
  padding: 20px 0 10px;
  border-radius: 2px 2px 0 0;
  display: block;
  text-align: center;
  font-size: 22px;
  color: #fff;
  background-color: #00985b;
}

.selectDept dd {
  padding: 40px 40px 15px;
}

.selectDept select,
.selectDept .customSelect {
  width: 280px;
}

.selectDept dl + div {
  padding: 0 40px 40px;
}

/** ------------------------------------------------------------
 * mainNav
 */
.mainNav {
  margin: 0 auto;
  font-size: 170%;
  background-color: #f6f6f6;
}

.mainNav:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.mainNav__item {
  border-bottom: 1px solid #c8c7cc;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  float: left;
  width: 50%;
}

.mainNav__item:nth-of-type(odd)  {
  border-right: 1px solid #c8c7cc;
}

.mainNav a {
  display: table;
  border-collapse: collapse;
  width: 100%;
  color: #00985b;
  background-color: #fff;
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
}

.mainNav__item a:hover {
  background-color: #f6f6f6;
}

.mainNav__item a span {
  padding: 20px;
  display: table-cell;
  vertical-align: middle;
}

.mainNav__item:nth-of-type(4n-1) a,
.mainNav__item:nth-of-type(4n) a {
  color: #c5d201;
}

.mainNav__item:nth-of-type(4n-1) a span:first-of-type,
.mainNav__item:nth-of-type(4n) a span:first-of-type {
  border-right-color: #c5d201;
}

.mainNav__item a span:first-of-type {
  padding-right: 0;
  padding-left: 0;
  border-right: 2px solid #00985b;
  width: 140px;
  background-color: #f6f6f6;
  font-size: 60px;
  text-align: center;
}

.mainNav__item a:hover span:first-of-type {
  color: #fff;
  background-color: #00985b;
}

.mainNav__item:nth-of-type(4n-1) a:hover span:first-of-type,
.mainNav__item:nth-of-type(4n) a:hover span:first-of-type {
  background-color: #c5d201;
}

.mainNav__item a > span > span.unreadCount {
  border: none;
  width: auto;
  padding: 2px 0.7em;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  display: inline-block;
  font-size: 14px;
  color: #fff;
  background-color: #c22;
  vertical-align: middle;
  float: right;
}

.mainNav__item a:hover > span > span.unreadCount {
  background-color: #c22;
}

/** ------------------------------------------------------------
 * basicMenu
 */
.basicMenu {
  font-size: 170%;
}

.basicMenu__item {
  border-bottom: 1px solid #c8c7cc;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

.basicMenu a {
  display: table;
  border-collapse: collapse;
  width: 100%;
  color: #00985b;
  background-color: #fff;
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
}

.basicMenu__item a:hover {
  background-color: #f6f6f6;
}

.basicMenu__item a > span {
  padding: 20px;
  display: table-cell;
  vertical-align: middle;
}

.basicMenu__item:nth-of-type(even) a {
  color: #c5d201;
}

.basicMenu__item:nth-of-type(even) a > span:first-of-type {
  border-right-color: #c5d201;
}

.basicMenu__item a > span:first-of-type {
  padding-right: 0;
  padding-left: 0;
  border-right: 2px solid #00985b;
  width: 140px;
  background-color: #f6f6f6;
  font-size: 60px;
  text-align: center;
}

.basicMenu__item a:hover > span:first-of-type {
  color: #fff;
  background-color: #00985b;
}

.basicMenu__item:nth-of-type(even) a:hover > span:first-of-type {
  background-color: #c5d201;
}

.basicMenu__item a > span > span {
  padding: 2px 0.7em;
  -webkit-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  font-size: 14px;
  color: #fff;
  background-color: #c22;
  vertical-align: middle;
  float: right;
}

/** ------------------------------------------------------------
 * localMenu
 */
.localMenu {
  padding: 2px 10px 0;
  border-bottom: 1px solid #c8c7cc;
  box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset;
  background-color: #ddd;
  font-size: 0;
  line-height: 1.2;
  text-shadow: 0 1px 0 #fff;
}

.localMenu__item {
  margin-bottom: -1px;
  display: inline-block;
  font-size: 13px;
}

.localMenu__item + .localMenu__item{
  margin-left: 3px;
}

.localMenu__item a {
  border: 1px solid transparent;
  padding: 6px 10px;
  -webkit-border-radius: 3px 3px 0 0;
          border-radius: 3px 3px 0 0;
  display: block;
  color: #444;
  vertical-align: bottom;
}

.localMenu__item a:hover {
  border: 1px solid #c8c7cc;
  box-shadow: 0 1px 0 #fff inset;
  background-color: #eee;
}

.localMenu__item a.current {
  padding: 6px 10px 7px;
  border: 1px solid #c8c7cc;
  border-bottom: none;
  background-color: #fff;
}

.localMenu__item a span {
  margin-left: 2px;
  padding: 0 3px;
  -webkit-border-radius: 3px;
          border-radius: 3px;
  display: inline-block;
  color: #fff;
  background-color: #c22;
}

/** ------------------------------------------------------------
 * コンテンツ
 */
.mainTitle {
  padding: 12px 10px;
  border-bottom: 1px solid #c8c7cc;
  color: #00985b;
  background-color: #fff;
  background: -webkit-linear-gradient(top, #fff, #e6e6e6);
  background:    -moz-linear-gradient(top, #fff, #e6e6e6);
  background:     -ms-linear-gradient(top, #fff, #e6e6e6);
  background:         linear-gradient(to bottom, #fff, #e6e6e6);
  text-shadow: 0 1px 0 #fff;
  font-size: 20px;
  font-weight: bold;
  min-height: 1.5em;
}

/*  */
.mainTitle__link {
  position: relative;
}

.mainTitle__link ul {
  margin-top: -21px;
  position: absolute;
  top: -1.5em;
  right: 10px;
  float: right;
}

.mainTitle__link ul li {
  margin-left: 5px;
  float: left;
}

.mainTitle__link a {
  padding: 5px 15px;
  border: 1px solid #c8c7cc;
  display: block;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  color: #00985b;
  background-color: #fff;
}

.mainTitle__link > a {
  margin-top: -20px;
  position: absolute;
  top: -1.5em;
  right: 10px;
}

.mainTitle__link a:hover {
  color: #fff;
  background-color: #00985b;
}



/** ------------------------------
 * メッセージ一覧
 */
.messageList {
  width: 100%;
  line-height: 1.3;
  background-color: #fff;
}

.messageList tr {
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
  cursor: pointer;
}

.messageList tr:hover a {
  color: #00985b !important;
}

.messageList__read {
  background-color: #f6f6f6;
}

.messageList__unread {
  font-weight: bold;
}

.messageList td {
  border-bottom: 1px solid #c8c7cc;
  text-align: left;
  vertical-align: middlem;
}

.messageList a {
  padding: 12px;
  color: #222;
  display: block;
}

.messageList__message {
  color: #999;
}

.messageList__message:before {
  content: " - ";
  font-weight: normal;
}

.messageList__date {
  padding: 0 0 0 10px;
  border-right: 1px dotted #c8c7cc;
  color: #999;
  width: 11em;
  font-size: 11px;
}

/** ------------------------------
 * メッセージ詳細
 */
.messageDetail {
  border-bottom: 1px solid #c8c7cc;
  background-color: #fff;
}

.messageDetail__title {
  padding: 12px 10px;
  border-bottom: 1px solid #c8c7cc;
  color: #00985b;
  background-color: #fff;
  font-size: medium;
  font-weight: bold;
}

.messageDetail__date {
  padding: 5px 10px;
  border-bottom: 1px solid #c8c7cc;
  box-shadow: 0 1px 0 #fff inset;
  color: #999;
  background-color: #eee;
  font-size: 11px;
  text-shadow: 0 1px 0 #fff;
}

.messageDetail__body {
  padding: 10px;
  font-size: 15px;
  line-height: 1.6;
  min-height: 4em;
}

/** ------------------------------
 * pager
 */
.pager {
  border-bottom: 1px solid #c8c7cc;
  padding: 7px;
  position: relative;
  background-color: #00985b;
  text-align: center;
  font-size: 0;
}

.pager__item {
  margin: 0 2px;
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
  border: 1px solid #c8c7cc;
  display: inline-block;
  min-width: 1em;
  height: 30px;
  line-height: 30px;
  background-color: #fff;
  text-align: center;
  font-size: 12px;
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
}

.pager__item > * {
  padding: 0 13px;
  display: block;
  color: #555;
}

.pager__item--current {
  border-color: #fff;
  background-color: transparent;
  font-weight: bold;
}

.pager__item--current span {
  color: #fff;
}

.pager__item:hover {
  border-color: #00985b;
}

.pager__item--current:hover {
  border-color: #fff;
}

.pager__item:hover a {
  color: #00985b;
}

/** ------------------------------------------------------------
 * userDetail
 */
.userDetail {
  border: 10px solid #ddd;
  background-color: #ddd;
  font-size: 108%;
}

/* 画像 */
.userDetail__sub {
  width: 160px;
  vertical-align: top;
}

.userDetail__sub img {
  width: 100%;
}

/* メイン */
.userDetail__main {
  border-left: 10px solid #ddd;
  line-height: 1.4;
  background-color: #fff;
  vertical-align: top;
}

.userDetail__main > div {
  position: relative;
  display: table;
  width: 100%;
}

.userDetail__main > div + div {
  border-top: 1px solid #ddd;
}

.userDetail__title,
.userDetail__body {
  padding: 0.75em 13px;
  display: table-cell;
  width: 15%;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  vertical-align: middle;
}

.userDetail__title {
  color: #00985b;
  font-weight: bold;
  text-align: center;
}

.userDetail__body:before {
  margin-left: -13px;
  content: "";
  border-right: 1px solid #ddd;
  position: absolute;
  top: 5px;
  bottom: 5px;
  display: block;
  width: 0;
}

.userDetail__body:after {
  content: "";
  border-right: 1px solid #ddd;
  position: absolute;
  left: 50%;
  top: 5px;
  bottom: 5px;
  display: block;
  width: 0;
}

.userDetail__body {
  width: 35%;
}

.userDetail__body--comment {
  width: 85%;
}

.userDetail__body--comment:after {
  display: none;
}

/* ステータス */
.status {
  border-top: 1px solid #c8c7cc;
  border-bottom: 1px solid #c8c7cc;
  border-style: solid none;
  display: table;
  width: 100%;
  font-size: medium;
  background-color: #eee;
  line-height: 1.8;
}

.status > * {
  display: table-cell;
  width: 50%;
}

.status > * + * {
  border-left: 1px solid #c8c7cc;
}


/* 基本情報 */
.cumulation__title {
  padding: 8px 10px;
  border-bottom: 1px solid #ddd;
  color: #fff;
  background-color: #00985b;
  text-align: center;
}

.cumulation li {
  border-bottom: 1px solid #ddd;
  display: table;
  width: 100%;
  color: #00985b;
  background-color: #fff;
}

.cumulation li > div {
  padding: 10px;
  display: table-cell;
  vertical-align: middle;
}

.cumulation li > div:first-of-type:before {
  margin-right: 4px;
  content: "●";
}

.cumulation li > div + div {
  text-align: right;
}

.cumulation .icon {
  margin-right: 5px;
  font-size: 150%;
  vertical-align: middle;
}

.cumulation li > div span {
  margin-left: 4px;
  font-size: 11px;
}

/* 成績ランキングTOP獲得回数 */
.ranking__title {
  padding: 8px 10px;
  border-bottom: 1px solid #ddd;
  color: #fff;
  background-color: #00985b;
  text-align: center;
}

.ranking li {
  border-bottom: 1px solid #ddd;
  display: table;
  width: 100%;
  color: #00985b;
  background-color: #fff;
}

.ranking li > div {
  padding: 10px;
  display: table-cell;
  vertical-align: middle;
} 

.ranking li > div + div {
  text-align: right;
}

.ranking .icon {
  margin-right: 5px;
  font-size: 150%;
  vertical-align: middle;
}

.ranking li > div span {
  margin-left: 4px;
  font-size: 11px;
}

/* アイコン */
@font-face {
  font-family: 'lsIcon';
  src:url('/fonts/linksproutIcon.eot?-7rtbiz');
  src:url('/fonts/linksproutIcon.eot?#iefix-7rtbiz') format('embedded-opentype'),
    url('/fonts/linksproutIcon.woff?-7rtbiz') format('woff'),
    url('/fonts/linksproutIcon.ttf?-7rtbiz') format('truetype'),
    url('/fonts/linksproutIcon.svg?-7rtbiz#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  font-family: 'lsIcon';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-svg:before {
  content: "\e601";
}

.icon-svg2:before {
  content: "\e602";
}

.icon-svg3:before {
  content: "\e603";
}

.icon-svg4:before {
  content: "\e604";
}

.icon-svg5:before {
  content: "\e605";
}

.icon-svg6:before {
  content: "\e606";
}

/* 上位三名 */
.rankingTable {
  margin-top: -1px;
  width: 100%;
  background-color: #fff;
}

.rankingTable th,
.rankingTable td {
  border: 1px solid #ddd;
  vertical-align: middle;
}

.rankingTable th {
  color: #fff;
  height: 2em;
  line-height: 2em;
  background-color: #00985b;
  text-align: center;
}

.rankingTable td {
  font-size: 12px;
  overflow: hidden;
}

.rankingTable td .image {
  display: table-cell;
  padding: 0 7px 0 8px;
  height: 100%;
  width: 50%;
  vertical-align: middle;
  text-align: right;
}

.rankingTable td .image img {
  position: relative;
  max-height: 95%;
  max-width: 95%;
}

#wrap .rankingTable td .image img {
  height: auto;
}

.rankingTable td .image img > img {
  height: 40%;
}

.rankingTable td .image span {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  color: #fff;
  background-color: rgba(0,152,91,0.9);
  text-align: center;
}

/* 比較無しの場合 */
.rankingTable--one {
  position: relative;
}

.rankingTable td .rankingTable--one .image {
  float: left;
  width: auto;
  height: 80%;
  clear: both;
}

.rankingTable .rankingTable--one .image {
  margin: 0 auto;
  display: block;
  position: relative;
  padding: 5px 10px;
  height: 80%
  vertical-align: middle;
  text-align: left;
}

.rankingTable--one .block .image img {
  height: 100%;
  max-height: 100%;
  max-width: 100%;
}

.mainOuter {
  position: relative;
  margin-left: 20px;
  float: left;
  font-size: 20px;
}

.rankingTable__box {
  margin: 0 auto;
  display: table;
}

.rankingTable--one .rankingTable__box {
}

.rankingTable--one .main__inner {
  margin: 2px 0;
  display: block !important;
}

.rankingTable--one .main__inner div {
  display: table-cell;
}

.rankingTable--one .main__inner:first-child > div + div span {
  font-size: 20px !important;
  line-height: 1.2;
}


.rankingTable__icon {
  margin: auto auto auto -330px;
  position: absolute;
  top: 60px;
  left: 50%;
  z-index: 10;
  width: 80px !important;
}

.rankingTable__icon--1 {
  margin-left: -350px;
  width: 120px !important;
}

.rankingTable__icon--2 {
  margin-left: -340px;
  /* top: 0px; */
  width: 100px !important;
}

.rankingTable__icon2 {
  position: relative;
  /* top: 0; */
  left: 0px;
  margin: 0 auto;
  z-index: 10;
  width: 36px !important;
}

.rankingTable__icon2 + span {
  position: relative;
  left: 0px;
}

.rankingTable--one .animationContainer {
  height: 100%;
}

.rankingTable--one .rankingTable__icon {
  position: absolute;
  z-index: 10;
  width: 80px !important;
  left: 0;
}

.rankingTable--one .rankingTable__icon--1 {
  margin-left: 0;
}

.rankingTable--one .rankingTable__icon--2 {
  margin-left: 0;
}

.rankingTable--one .rankingTable__icon--3 {
  margin-left: 0;
}

/*
.rankingTable--one .main__inner:first-child > div + div,
.rankingTable--one .main__inner:first-child + * > div + div {
  font-size: 16px !important;
}

.rankingTable--one .main__inner:first-child > div + div span {
  font-size: 18px !important;
}
*/

.rankingTable--one .main__inner > div > div {
  padding-left: 10px;
}

.rankingTable td .main {
  display: table-cell;
  height: 100%;
  width: 50%;
  font-size: 90%;
  text-align: left;
  vertical-align: middle;
}

.rankingTable .rankingTable--one .main {
  width: auto;
  display: table;
}

.rankingTable td .main__inner {
}

.rankingTable td .main__inner div {
  /*
  padding: 0 5px;
  */
  vertical-align: middle;
}

.rankingTable td .main__title {
  font-weight: bold;
}

.rankingTable td .main__inner div span {
  color: #00985b;
  font-weight: bold;
  font-size: 13px;
}

.rankingTable--monthly tr td:first-of-type {
  background-color: #f0f3bf;
}

.rankingTable--monthly tr td:first-of-type .image span {
  background-color: rgba(255,126,0,0.9);
}

.rankingTable--monthly tr td:first-of-type .main__inner div span {
  color: #ff7800;
}

.rankingTable td > div {
  box-sizing: border-box;
  position: relative;
  height: 100%;
  width: 100%;
}

.rankingTable .block {
  display: table;
  table-layout: fixed;
  position: absolute;
  height: 100%;
  width: 100%;
  box-sizing: border-box;
  background-color: #fff;
}

.rankingTable--one .block {
  display: block;
  left: 0;
  right: 0;
}

.rankingTable .block[data-block="out"] {
  z-index: 2;
}

.rankingTable .block[data-block="in"] {
  z-index: 1;
}

.rankingTable--monthly tr td:first-of-type [data-block] {
  background-color: #f0f3bf;
}


/** ------------------------------------------------------------
 * 資料室
 */
.treeview ul {
  font-size: medium !important;
  line-height: 1.2;
}

.filetree span.folder,
.filetree span.file {
  padding-left: 20px !important;
}

/** ------------------------------------------------------------
 * グラフ
 */
.graphForm {
  font-size: 108%;
  background-color: #fff;
  line-height: 2.0;
}

.graphForm th,
.graphForm td {
  padding: 6px 10px;
  border-bottom: 1px solid #c8c7cc;
}

.graphForm th {
  width: 160px;
  border-right: 1px solid #c8c7cc;
  color: #00985b;
  background-color: #f6f6f6;
  font-weight: bold;
}

.graphForm .customSelect {
  vertical-align: top;
}

.graphForm td > label,
.graphForm td .checkbox-area span {
  margin-right: 2em;
  display: inline-block;
}

.graphForm td .checkbox-area.user span {
  margin-right: 0.5em;
  width: 10em;
}

.graphForm__button {
  border-left: 1px solid #c8c7cc;
  width: 160px;
}

.graphForm__button {
  position: relative;
  width: 7em;
}

.graphForm__button button {
  padding: 0;
  line-height: 3em;
  height: auto;
  display: block;
}

.graphForm__button--cumulative {
  width: 9em;
  text-align: center;
}

.graphForm__button--cumulative button {
  line-height: 2.8em;
}

.graphForm__button--cumulative .graphRefine__loop {
  margin: 20px 0 0 -1px;
  font-size: medium;
  display: block;
}

.graphForm__button--cumulative .graphRefine__loop label {
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

.graphForm__loop {
  padding-top: 13px !important;
  padding-bottom: 13px !important;
}

.graphForm__loop .graphRefine__loop label {
  border: 1px solid #ddd;
}

/* 棒グラフの注意書き */
.barSubtext {
  position: relative;
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
}

.barSubtext__inner {
  margin-top: -20px;
  position: absolute;
  top: -3.4em;
  left: 5px;
  color: #606060;
  font-size: 11px;
  text-align: right;
}

@-moz-document url-prefix() {
  .barSubtext__inner {
    top: -3.1em;
  }
}

/* グラフ絞り込み検索 */
.graphRefine {
  border-bottom: 1px solid #c8c7cc;
  box-shadow: 0 1px 0 rgba(0,0,0,0.10) inset;
  background-color: #aaa;
}

.graphRefine__title {
  padding: 12px 10px;
  border-bottom: 1px solid #c8c7cc;
  color: #00985b;
  background-color: #fff;
  background: -webkit-linear-gradient(top, #fff, #e6e6e6);
  background:    -moz-linear-gradient(top, #fff, #e6e6e6);
  background:     -ms-linear-gradient(top, #fff, #e6e6e6);
  background:         linear-gradient(to bottom, #fff, #e6e6e6);
  text-shadow: 0 1px 0 #fff;
  font-size: medium;
  font-weight: bold;
}

.graphRefine__inner {
  display: table;
}

.graphRefine__inner > form,
.graphRefine__inner > div,
.graphRefine__inner > p {
  padding: 10px;
  display: table-cell;
  vertical-align: middle;
}

.customSelect + .dotLine {/* 項目別ランキング */
  margin-top: 10px;
  padding-top: 5px;
  border-top: 1px dotted #c8c7cc;
}

.customSelect + .dotLine > label {
  margin-right: 2em;
  display: inline-block;
}

.graphRefine .customSelect,
.graphRefine button {
  width: 150px;
  vertical-align: middle;
}

.graphRefine button {
  width: 100px;
}

.graphRefine__loop input[type="checkbox"] {
  position: relative;
  display: none;
}

.graphRefine form {
  padding-right: 0;
}

.graphRefine__loop label {
  padding: 7px 15px 7px 35px;
  -webkit-border-radius: 100px;
          border-radius: 100px;
  position: relative;
  cursor: pointer;
  -webkit-transition: all 0.4s ease;
     -moz-transition: all 0.4s ease;
      -ms-transition: all 0.4s ease;
       -o-transition: all 0.4s ease;
          transition: all 0.4s ease;
  color: #00985b;
  background-color: #fff;
}

@font-face {
  font-family: 'check';
  src:url('/fonts/check.eot?-7rtbiz');
  src:url('/fonts/check.eot?#iefix-7rtbiz') format('embedded-opentype'),
    url('/fonts/check.woff?-7rtbiz') format('woff'),
    url('/fonts/check.ttf?-7rtbiz') format('truetype'),
    url('/fonts/check.svg?-7rtbiz#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

.graphRefine__loop label:before {
  margin: auto;
  position: absolute;
  top: 0;
  left: 12px;
  bottom: 0;
  z-index: 10;
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  font-size: 14px;
  line-height: 14px;
  color: #fff;
  content: "\e600";
  font-family: check;
  text-align: center;
}

.graphRefine__loop input[type="checkbox"]:checked + label:before {
  color: #00985b;
}

.graphRefine select[name="from"] + span,
.graphRefine select[name="to"] + span {
  width: 92px;
}

.graphRefine__loop input[type="checkbox"] + label:after {
  margin: auto;
  border: 2px solid #ccc;
  position: absolute;
  top: 0;
  left: 10px;
  bottom: 0;
  content: "";
  display: block;
  width: 14px;
  height: 14px;
}

/**/
.item-area {
  margin-top: 10px;
  padding: 15px 10px;
  border: 1px solid #ddd;
  position: absolute;
  z-index: 20;
  width: 340px;
  background-color: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

.item-area:before {
  border: 10px solid;
  border-color: transparent transparent #fff;
  content: "";
  position: absolute;
  left: 60px;
  bottom: 100%;
  display: block;
  width: 0;
  height: 0;
}

.item-area label {
  padding: 10px;
  display: inline-block;
  width: 48%;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

/** ------------------------------------------------------------
 * loopTable
 */
.loopTable {
  width: 100%;
  background-color: #fff;
}

.loopTable th,
.loopTable td {
  padding: 12px 10px;
  border-bottom: 1px solid #c8c7cc;
  text-align: center;
}

.loopTable tr > * + * {
  border-left: 1px solid #c8c7cc;
}

.loopTable th {
  color: #00985b;
  background-color: #f6f6f6;
  font-weight: bold;
}

.loopTable tr td:nth-of-type(1) input {
  text-align: center;
}

.loopTable tr th:nth-of-type(1) {
  width: 170px;;
}

.loopTable tr th:nth-of-type(2) {
  width: 40%;
}

.loopTable tr td:nth-of-type(2) {
  text-align: left;
}

/** ------------------------------
 * button
 */
.save-sort-order {
  width: 4em;
  font-size: 12px;
  height: auto;
}

.save-sort-order[disabled="disabled"] {
  border: 1px solid #c8c7cc;
  background-color: #ccc !important;
}

.limit-date-clear {
  width: 2em;
}

/** ------------------------------------------------------------
* error
*/
.error {
  margin: 20px auto 0;
  padding: 10px;
  -webkit-border-radius: 3px 3px 0 0;
     -moz-border-radius: 3px 3px 0 0;
          border-radius: 3px 3px 0 0;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  width: 40%;
  color: #fff;
  background-color: #911;
  font-weight: bold;
  text-align: center;
}

.error + .box {
  margin: 0 auto 20px;
  padding: 15px 25px;
  border: 1px solid #911;
  -webkit-border-radius: 0 0 3px 3px;
     -moz-border-radius: 0 0 3px 3px;
          border-radius: 0 0 3px 3px;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  width: 40%;
  color: #911;
  background-color: #fff;
  
}

/** ------------------------------------------------------------
* flashMessage
*/
.flashMessage {
  margin: 15px 60px;
  padding: 20px 25px;
  border: 1px solid #00c2e5;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  color: #00c2e5;
  background-color: #fff;
  text-align: center;
  font-size: medium;
}

/** ------------------------------------------------------------
* infoMessage
*/
.infoMessage {
  margin: 15px 60px;
  padding: 20px 25px;
  border: 1px solid #00985b;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  color: #00985b;
  background-color: #fff;
  text-align: center;
  font-size: medium;
}

/** ------------------------------------------------------------
 * sales_result
 */
.user-group-search {
  padding: 10px;
  border-bottom: 1px solid #c8c7cc;
  box-shadow: 0 1px 0 rgba(0,0,0,0.10) inset;
  background-color: #aaa;
  font-size: 0;
}

.user-group-search select:not(#belonging) + span {
}

.user-group-search select + span {
  margin-bottom: 4px;
}

.user-group-search button {
  padding-right: 30px;
  padding-left: 30px;
  width: auto;
}

.sales_result {
  background-color: #fff;
  height: 700px;
}

.sales_result th,
.sales_result td {
  border-right: 1px solid #c8c7cc;
  border-bottom: 1px solid #c8c7cc;
}

.sales_result th {
  padding: 10px 0;
  width: 90px;
}

.sales_result th.total,
.sales_result th.average {
  width: 100px;
}

.sales_result td {
  padding: 10px;
  text-align: right;
}

.sales_result-title {
  position: absolute;
  width: 130px;
  color: #fff;
  background-color: #00985b;
}

.sales_result .day {
  color: #00985b;
  background-color: #dfe665;
}

#sales_result_body {
  position: absolute;
  left: 130px;
  overflow-x: scroll;
}

/** ------------------------------------------------------------
 * レス
 */
.res {
  background-color: #eee;
}

.res__title {
  padding: 10px;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #c8c7cc;
  color: #00985b;
  font-weight: bold;
}

.comment_form {
  padding: 10px;
}

.comment_form textarea {
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  width: 50%;
  height: 7em;
}

.res input[type="submit"] {
  padding: 0 40px;
  width: auto;
  text-align: center;
}

.resBody {
  background-color: #fff;
}

.resBody__item {
  border-top: 1px solid #c8c7cc;
  padding: 0 10px 10px;
}

.resBody__head {
  margin: 0 -10px;
  padding: 6px 10px;
  border-bottom: 1px dotted #c8c7cc;
  color: #999;
  font-size: 11px;
}

.resBody__message {
  margin: 10px 0;
}

.delete_form {
  text-align: right;
}

.res .comment_form button {
  width: 200px;
}

.res .comment_form button {
  margin-top: 5px;
}

.res .delete_form button {
  width: auto;
  padding: 0 10px;
}

.delete_form button {
  height: 28px;
  line-height: 28px;
  background-color: #777;
}

/** ------------------------------------------------------------
 * analytics
 */
.analytics {
  background-color: #fff;
}

.analyticsSearch {
  padding: 5px 10px 10px;
  border-bottom: 1px solid #c8c7cc;
  box-shadow: 0 1px 0 rgba(0,0,0,0.10) inset;
  background-color: #aaa;
}

.analyticsSearch div {
  min-width: 4.5em;
}

.analyticsSearch__item {
  padding-top: 5px;
}

.analyticsSearch__item * {
  vertical-align: middle;
}

.analyticsSearch__item div {
  display: inline-block;
}

.analyticsSearch select[name="term_type"] + .customSelect,
.analyticsSearch select[name="year"] + .customSelect,
.analyticsSearch select[name="month"] + .customSelect,
.analyticsSearch select[name="quarter"] + .customSelect,
.analyticsSearch select[name="item_id"] + .customSelect {
  width: 150px;
}

.analyticsSearch button {
  width: 5em;
}

/* analyticsMain */
.analyticsMain__inner {
  margin: 0 auto;
  display: table;
}

.analyticsMain__chart,
.analyticsMain__text {
  padding: 30px 0 20px;
  display: table-cell;
  vertical-align: middle;
  width: 50%;
}

.analyticsMain__chart {
  position: relative;
}

.analyticsMain__chart canvas {
  display: block;
}

.analyticsMain__rate {
  margin-top: -1.1em;
  position: absolute;
  top: 50%;
  width: 100%;
  font-size: x-large;
  text-align: center;
}

.analyticsMain__textItem {
  margin: 10px 50px;
  padding: 15px;
  border: 1px solid #c8c7cc;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}

.analyticsMain__textItem > div {
  text-align: center;
}

.analyticsMain__textItem > div:nth-of-type(1) {
  color: #00985b;
  font-weight: bold;
}

.analyticsMain__textItem > div:nth-of-type(2) {
  font-size: 160%;
}

.analyticsMain__textItem > div:nth-of-type(2) span {
  margin-left: 4px;
  font-size: medium;
}

.colorList {
  margin: 0 auto 20px;
  display: table;
}

.colorList li {
  padding: 10px 50px;
  display: table-cell;
  color: #fff;
  vertical-align: middle;
}

.analyticsSub {
  position: relative;
  border-top: 1px solid #c8c7cc;
  border-bottom: 1px solid #c8c7cc;
  font-size: medium;
  background-color: #f4f5dd;
}

.analyticsSub table {
  margin: 0 auto;
  display: table;
  width: auto;
}

.analyticsSub table td {
  padding: 8px 2px;
  vertical-align: middle;
}

.analyticsSub table td:first-of-type:before {
  margin-top: -15px;
  content: "";
  display: block;
  position: absolute;
  right: 0;
  left: 0;
  height: 1px;
  background-color: #c8c7cc;
}

.analyticsSub table td span {
  margin: 0 7px;
  display: inline-block;
  color: #c00;
  vertical-align: middle;
  font-size: x-large;
  text-align: right;
}

.analyticsSub table td.target {
  font-size: x-large;
  text-align: right;
}

.analyticsSub table td.result {
  color: #c00;
  font-size: x-large;
  text-align: right;
}

.analyticsSub table td.over {
  color: #00c;
}

.analyticsData {
  margin: 0 auto;
  width: 620px;
  text-align: center;
}

.analyticsData:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

.analyticsData .analyticsData__item {
  padding: 30px;
  float: left;
  position: relative;
  width: 250px;
}

.analyticsData .analyticsData__item:nth-of-type(odd) {
  clear: both;
}

.analyticsData .canvasCaption {
  margin-bottom: 6px;
  color: #6699ff;
  text-align: center;
  font-size: large;
  font-weight: bold;
}

.analyticsData .rate {
  position: absolute;
  width: 250px;
  margin-top: -150px;
  font-size: xx-large;
  text-align: center;
}

.analyticsData .legend {
  margin-top: 5px;
  padding: 10px 30px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  display: block;
  border: 2px solid #eee;
}

.analyticsData .legend li {
  text-align: left;
}

.canvasMemo {
  padding: 15px 0;
  clear: both;
  width: auto;
  font-size: large;
  color: #fff;
  background-color: #00985b;
  text-align: center;
}

/**/
#promotion-notice {
  padding: 1px 0 20px;
  background-color: #eee;
}

.soon_position {
  margin: 10px auto 0;
  padding: 15px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  position: relative;
  width: 520px;
  font-size: 13px;
  color: #fff;
  background-color: #99bb40;
  text-align: center;
}

.soon_position span {
  margin: 0 4px;
  display: inline-block;
  vertical-align: middle;
  font-size: large;
  font-weight: bold;
}

.soon_position:before {
  margin-left: -10px;
  position: absolute;
  z-index: 10;
  bottom: 100%;
  left: 50%;
  content: "";
  display: block;
  border-width: 20px 10px;
  border-style: solid;
  border-color: transparent transparent #99bb40;
}

.soon_position:after {
  margin-left: -12px;
  position: absolute;
  z-index: 5;
  bottom: 100%;
  left: 50%;
  content: "";
  display: block;
  border-width: 22px 12px;
  border-style: solid;
  border-color: transparent transparent #eee;
}

.next_position {
  margin: 10px auto 0;
  padding: 15px;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
  position: relative;
  width: 520px;
  font-size: large;
  color: #fff;
  background-color: #f08500;
  text-align: center;
  font-weight: bold;
}

.next_position:before {
  margin-left: -10px;
  position: absolute;
  z-index: 10;
  bottom: 100%;
  left: 50%;
  content: "";
  display: block;
  border-width: 20px 10px;
  border-style: solid;
  border-color: transparent transparent #f08500;
}

.next_position:after {
  margin-left: -12px;
  position: absolute;
  z-index: 5;
  bottom: 100%;
  left: 50%;
  content: "";
  display: block;
  border-width: 22px 12px;
  border-style: solid;
  border-color: transparent transparent #eee;
}

#lean_overlay {
  position: fixed;
  z-index:100;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
  background: #000;
  display: none;
}

#message_receive_modal {
  background: none repeat scroll 0 0 #FFFFFF;
  /*  border-radius: 5px 5px 5px 5px; */
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.7);
  display: none;
  padding: 30px;
  width: 70%;
}

.modal_close {
  position: absolute;
  top: 12px;
  right: 12px;
  display: block;
  width: 14px;
  height: 14px;
  background: url('/images/common/modal_close.png');
  z-index: 2;
}

/** ------------------------------------------------------------
 * ループ再生
 */
#wrap div[data-next-url] {
  height: 100% !important;
} 

#wrap div[data-next-url] {
  overflow: hidden;
  text-align: center;
}

#wrap img {
  height: 100%;
}

/** ------------------------------------------------------------
 * 達成率一覧 データ分析指数
 */
ul.achievementData,
ul.dataAnalytics {
  margin: 0 10px 10px;
}

ul.achievementData li,
ul.dataAnalytics li {
  padding: 10px 15px 4px;
  border: 1px solid #bbb;
  position: relative;
  line-height: 26px;
  font-size: 16px;
}

ul.dataAnalytics li {
  line-height: 20px;
}

ul.achievementData li:after,
ul.dataAnalytics li:after {
  content: ".";
  display: block;
  visibility: hidden;
  height: 0;
  line-height: 0;
  font-size: 0;
  clear: both;
}

ul.achievementData li + li,
ul.dataAnalytics li + li {
  border-top: none;
}

ul.achievementData li .title,
ul.dataAnalytics li .title {
  position: relative;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 80%;
}

ul.dataAnalytics li .title .name + div {
  text-align: right;
  padding-right: 5px;
}

ul.achievementData li .value,
ul.dataAnalytics li .value {
  display: inline-block;
  font-weight: normal;
  font-size: 12px;
  border-left: 1px solid #bbb;
  width: 12.6em;
  text-align: right;
  width: 19%;
}

ul.achievementData li .value span,
ul.dataAnalytics li .value span {
  margin-right: 5px;
  color: #00985b;
  font-weight: bold;
  font-size: 18px;
}

.level-1 {
  margin: 10px 0 0;
  font-size: 16px;
  color: #fff;
  background-color: #00985b;
  font-weight: bold;
}

ul.achievementData li.level-1 .title:before,
ul.dataAnalytics li.level-1 .title .name:before {
  margin-right: 2px;
  content: "";
  display: inline-block;
  position: relative;
  width: 0.6em;
  height: 0.6em;
  background-color: #fff;
}

ul.achievementData li.level-1 .value span,
ul.dataAnalytics li.level-1 .value span {
  color: #ecf1a3;
}

.level-officeName {
  font-size: 14px;
  color: #00985b;
  background-color: #cfdb14;
  font-weight: bold;
}

ul.achievementData li.level-officeName .title:before,
ul.dataAnalytics li.level-officeName .title .name:before {
  margin-right: 8px;
  content: "▼";
  display: inline-block;
  position: relative;
  width: 0.6em;
  height: 0.6em;
}

.level-2 {
  font-size: 14px;
  color: #00985b;
  background-color: #fdfadc;
  font-weight: bold;
}

.level-3 {
  background-color: #fff;
}

.achievementTotal {
  margin: 10px;
  padding: 10px 15px;
  border: 1px solid #bbb;
  position: relative;
  line-height: 26px;
  color: #fff;
  background-color: #00985b;
  font-weight: bold;
  font-size: 16px;
}

.achievementTotal .value {
  float: right;
  font-weight: normal;
  font-size: 12px;
  border-left: 1px solid #bbb;
  width: 12.6em;
  text-align: right;
}

.achievementTotal .value span {
  margin-right: 5px;
  color: #ecf1a3;
  font-weight: bold;
  font-size: 18px;
}

.narrow-product label {
  width: 14em;
  display: inline-block;
}

.salesReportForm ul li label {
  margin-left: 14px;
  display: inline-block;
}

.salesReportForm ul li label.office {
  width: 100%;
  font-size: 115%;
  border-bottom: 2px solid #00985b;
}

.salesReportForm ul li label.department {
  width: 100%;
  font-size: 110%;
  border-bottom: 2px solid #cfdb14;
}

.salesReportForm ul li label.section {
  width: 100%;
  font-size: 105%;
  border-bottom: 2px solid #bbb;
}

.salesReportForm ul.userList ul > li {
  padding-left: 14px;
}

.salesReportForm #previewButton {
  width: 350px;
}

.salesReportForm .previewArea {
  border-top: 1px dotted #bbb;
  margin-top: 10px;
  padding: 10px 0;
}

.graph-analytics-alert {
  margin: 0 auto;
  padding: 10px 20px;
  position: relative;
  left: 0;
  right: 0;
  height: auto;
  max-width: 100%;
}

.text-analytics-alert {
  margin: 10px auto 0;
  padding: 10px 15px;
  position: relative;
  height: auto;
  max-width: 100%;
  min-width: 100px;
}

.graph-analytics-alert.button,
.text-analytics-alert.button {
  width: 100%;
  border: 1px solid #00985b;
  color: #00985b;
  text-decoration: none;
  text-align: center;
  display: block;
  border-radius: 5px;
  line-height: 27px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  background: none;
  padding: 0 10px;
  margin: 10px  auto 0;
  padding: 6px 40px;
  height: auto;
  white-space: nowrap;
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
  font-family: inherit;
  cursor: pointer;
}

.text-analytics-alert.button {
  width: 250px;
}

.button.button-fill {
  color: #fff;
  border: none;
}

.sweet-alert button {
  width: auto;
  height: auto;
}

.sweet-alert input {
  display: none;
}

.sweet-alert p {
  max-height: 500px;
  overflow: auto;
}