@charset "utf-8";

/*
 *
 * ===== 標準CSS =====
 *
 */


/* ========================================


		要素のリセット


   ======================================== */


/* --- HTML5 --- */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
	display: block;
  margin: 0;
  padding: 0;
}


/* --- 要素 ---*/

html,
body,
div,
h1,
h2,
h3,
h4,
h5,
p,
blockquote,
ul,
ol,
li,
dl,
dt,
dd,
form {
  margin: 0;
  padding: 0;
}



/* ========================================


		標準スタイル


   ======================================== */

/*
 * --- 文書全体 ---
 */

html {
	overflow-y: scroll;
	position: relative;
	min-height: 100%;
}

body {
  font-size: 15px;
  background-color: #f0f0f0;
  padding-right: 0 !important; /* dialogプラグイン用 */
	-webkit-text-size-adjust: 100%;
}


/*
 * --- フォント指定 ---
 */

body,
h1, h2, h3, h4, h5,
input, button, select, textarea {
	font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴPro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
}



/*
 * --- テキスト ---
 */

p {
  line-height: 1.4;
  margin-bottom: 10px;
  text-align: justify;
  text-justify: inter-ideograph;
}

p:last-child {
  margin-bottom: 0;
}

em,
strong,
dfn,
b,
i {
  text-decoration: none;
  font-style: normal;
  font-weight: bold;
}

em {
  font-weight: normal;
}

em,
strong {
  color: #f03030;
}

i {
  font-weight: normal;
}


/*
 * --- 画像 ---
 */

img {
}



/*
 * --- リスト ---
 */

dt {
  font-weight: normal;
}


/*
 * --- リンク ---
 */

a {
  outline:none !important;
  text-decoration: none !important;
  transition: color 0.2s, background-color 0.3s;
}


/*
 * --- フォーム ---
 */

button {
  outline:none !important;
  transition: color 0.2s, background-color 0.2s;
}

/*
 * --- 区切り ---
 */

hr {
}



/* ========================================


		Bootstrap コンポーネント


   ======================================== */

/*
 * --- グリッド ---
 */

.row {
  margin-left: -10px;
  margin-right: -10px;
}

.row > div {
  padding-left: 10px;
  padding-right: 10px;
}


/*
 * --- フォント ---
 */

.btn,
.popover {
	font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴPro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
}


/*
 * --- ボタン ---
 */

.btn {
  box-shadow: 0 2px #c0c0c0;
  margin-bottom: 2px !important;
}

.btn:active {
  box-shadow: none;
  margin-top: 2px !important;
  margin-bottom: 0 !important;
}

.btn.btn-no-shadow {
  box-shadow: none;
  margin-bottom: 0 !important;
}

.btn.btn-no-shadow:active {
  margin-top: 0 !important;
}

.btn.btn-lg-text {
  font-size: 16px;
}

.btn .btn-caption {
  display: block;
  font-size: 11px;
  line-height: 1;
}


/*
 * --- フォーム ---
 */

.checkbox-inline {
  margin-right: 10px;
  margin-left: 0 !important;
}

label.disabled {
  cursor: default !important;
  color: #909090;
}

label.disabled input {
  cursor: default !important;
}


/*
 * --- ラベル ---
 */

.label {
  display: inline-block;
  font-size: 10.5px;
  font-weight: normal;
  white-space: nowrap;
  line-height: 1;
  margin-right: 5px;
  padding: 4px 5px 3px 5px;
  vertical-align: middle;
}


/* --- ラベルのサイズ --- */

.label-sm {
  font-size: 14px;
}

.label-md {
  font-size: 20px;
}


/*
 * --- 定義リスト ---
 */

.dl-horizontal dd {
  margin-bottom: 5px;
}

/* --- ラベル付き --- */

.dl-horizontal-label dt,
.dl-horizontal-label dd {
  padding: 2px;
}

.dl-horizontal-label dt {
  text-align: center;
  background-color: #f6f6f6;
  border-radius: 6px;
}

/* --- 幅 --- */

.dl-horizontal-dt100 dt { width: 100px; }
.dl-horizontal-dt100 dd { margin-left: 110px; }



/*
 * --- ポップオーバー ---
 */

.popover {
  z-index: 2000 !important;
  min-width: 200px;
}

.popover-list li {
  list-style: none;
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
}

.popover-list li:last-child {
  border-bottom: none;
}

.popover-list a {
  color: #337ab7 !important;
}

.popover-list li a:hover {
  color: #23527c !important;
}


/*
 * --- カルーセル ---
 */

.carousel-inner > .item {
  -webkit-transition: 0.4s left;
  -o-transition: 0.4s left;
  transition: 0.4s left;
}


/*
 * --- テーブル ---
 */

.table-hover > tbody > tr:hover {
  background-color: #e9f6fc;
}

.table-hover tbody tr {
  cursor: pointer;
}

/* --- tbodyのthを折り返さない --- */

.table-nowrap tbody th {
  white-space: nowrap;
  font-weight: normal;
}

/* --- thを強調 --- */

.table-th-color thead th {
  color: #ffffff;
  background-color: #4694d1;
}

.table-th-color tbody th {
  background-color: #f6f9fc;
}

/*
 * --- アラート ---
 */

.alert-danger {
  position: relative;
  padding: 10px 30px;
  font-weight: bold;
  color: #E53935;
  background-color: #FFF0F0;
  border: 3px solid #E53935;
  border-radius: 0;
}

@keyframes blickAlertIcon {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  60% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.alert-danger p:first-child::before {
  content: '\F766';
  font-family: 'WebHostingHub-Glyphs';
  font-weight: normal;
  font-size: 22px;
  vertical-align: -4px;
  padding-right: 5px;
  animation: blickAlertIcon 1s linear infinite;
}


/*
 * --- ヘルパー ---
 */

/* --- 回り込み --- */

.pull-clear {
	clear: both;
}



/*
 * --- 印刷時の調整 ---
 */

@media print {

  a[href]:after {
  	content: '' !important;
  }

  abbr[title]:after {
	  content: '' !important;
  }

}




/* ========================================


		そのほかのコンポーネント


   ======================================== */

/*
 * --- アイコン ---
 */

[class^='icon-'] {
  vertical-align: bottom;
}

/*
 * --- Bootstrapダイアログ ---
 */

.modal-dialog .modal-content {
}

.modal-dialog .modal-header {
  padding: 10px 5px 8px 15px;
}

.modal-dialog .btn-dialog {
  min-width: 100px;
}

.modal-header h3 {
  font-size: 14px;
}


/*
 * --- 確認ダイアログ ---
 */

.confirm-dialog-btn-confirm,
.confirm-dialog-btn-abord {
  min-width: 100px;
}

.confirm-dialog-btn-confirm {
  margin-right: 10px;
}




/*
 * --- スクロールバー ---
 */

.mCSB_container {
  margin-right: 20px !important;
}

.mCSB_dragger .mCSB_dragger_bar {
  background-color: #909090 !important;
}

.mCSB_dragger:hover .mCSB_dragger_bar {
  background-color: #3bafda !important;
}


/*
 * --- Bootgrid テーブル ---
 */

.bootgrid-header {
  margin-top: 0 !important;
  margin-bottom: 10px !important;
}

.input-group,
.form-control,
.input-group-addon {
}

.bootgrid-header .form-control {
  padding: 2px 10px;
  height: 28px;
  font-size: 12px;
}

.bootgrid-header .btn {
  padding: 2px 10px;
}

.bootgrid-table th > .column-header-anchor > .text {
  white-space: normal !important;
}

.bootgrid-table th > .column-header-anchor > .icon {
   top: auto !important;
   bottom: 2px !important;
}



/*
 * --- バリデーション ---
 */

label.error {
  color: #da4453;
  font-weight: bold;
  font-size: 11px;
  margin-bottom: 0;
}

label.error:before {
  content: '\f48a';
  font-family: 'WebHostingHub-Glyphs';
  font-size: 8px;
  margin-right: 5px;
}


/*
 * --- Now Loading ---
 */

.waiting-dialog {
  z-index: 10000;
  margin-right: 0 !important;
}

.waiting-dialog .modal-content {
  margin-top: 200px;
  padding-top: 20px;
}

.waiting-dialog .waiting-caption {
  text-align: center;
  margin-top: 20px;
}


/*
 * --- カレンダー ---
 */

.monthly {
  padding: 0 !important;
  border: 1px solid #E0E0E0;
  background: none !important;
}

.monthly-header-title {
  font-size: 14px !important;
}

.monthly .monthly-day-wrap a {
  cursor: default;
}

.monthly .monthly-indicator-wrap {
  cursor: pointer;
}

.monthly-day-title-wrap div,
.monthly-day {
  font-weight: normal !important;
}

.monthly-day-blank {
  background-color: #F9F9F9 !important;
}

/* 折り返す場合

.monthly-full .monthly-day .monthly-event-indicator {
  height: auto !important;
  line-height: normal !important;
  white-space: normal !important;
}
*/

.monthly-back {
  display: inline-block;
  margin-right: 20px;
}

.monthly-back::before {
	content:'\f31f';
  font-family:'WebHostingHub-Glyphs';
  margin-right: 5px;
  font-size: 11px;
  -webkit-transform: rotate(270deg);
  transform: rotate(270deg);
}


/*
 * --- デートタイムピッカー
 */

.timepicker-picker a.btn {
  box-shadow: none;
  margin-bottom: 0 !important;
}

.timepicker-picker a.btn:active {
  margin-top: 0 !important;
}

.bootstrap-datetimepicker-widget .glyphicon-remove::after {
  content: '閉じる';
  margin-left: 5px;
  font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴPro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
  font-size: 12px;
  vertical-align: 3px;
}


/* ========================================


		レイアウト


   ======================================== */


/* ----------------------------------------

		レイアウト全体

   ---------------------------------------- */

/*
 * --- コンテナ ---
 */

.container {
  max-width: /*960*/1000px;
  min-width: /*960*/1000px;
  position: relative;
  padding: 0;
}

body > .container {
  margin-top: 20px;
  margin-bottom: 20px;
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
}


/* ----------------------------------------

		ヘッダー

   ---------------------------------------- */

/*
 * --- ページヘッダー ---
 */

#page-header {
}

#page-header .navbar {
  margin-bottom: 0;
  background-color: #4B7F63;
  border: none;
  border-radius: 0;
  border-top-left-radius: 4px;
  border-top-right-radius: 10px;
}

#page-header .navbar-header {
  position: relative;
  width: 100%;
}


/*
 * --- ロゴ ---
 */

.header-logo {
  position: absolute;
  width: 220px;
  height: 42px;
  left: 0;
  top: 4px;
  padding-top: 1px;
  text-align: center;
  background-color: #FFFFFF;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
}


/*
 * --- ログアウト ---
 */

.header-logout {
  position: absolute;
  top: 14px;
  right: 20px;
}

.header-logout .user-name {
  padding-right: 10px;
  color: #FFFFFF;
  vertical-align: middle;
}

.header-logout .btn-logout {
  padding: 3px 15px;
  font-size: 12px;
  color: #606060;
  border-radius: 30px;
  background-color: #FFFFFF;
}

.header-logout .btn-logout:hover {
  background-color: #F6FCFF;
}


/*
 * --- プロフィール ---
 */


.header-profile {
  float: right;
  margin: 8px 20px 0 0;
}

.header-profile a {
  display: block;
  color: #ffffff;
}

.header-profile a:hover {
  color: #e9f6ff;
}

.header-profile p {
  line-height: 1.1;
  text-align: right;
  float: right;
  padding-top: 8px;
}

.header-profile .user-name {
}

.header-profile .user-icon {
  float: right;
  padding-left: 15px;
  font-size: 24px;
  vertical-align: middle;
}

.header-profile .drop-down {
  font-size: 12px;
  vertical-align: middle;
}

.header-profile .popover {
  margin-top: 45px;
}


/* ----------------------------------------

		フッター

   ---------------------------------------- */

#page-footer {
  margin-top: 10px;
  padding: 10px;
}

#page-footer .footer-logo {
  margin-bottom: 10px;
  text-align: center;
}

#page-footer .copyright {
}

#page-footer .copyright p {
  text-align: center;
  color: #909090;
  font-size: 11px;
}

/*
 * --- フッターメニュー ---
 */

#page-footer-menu {
  margin-top: 30px;
  text-align: center;
}

#page-footer-menu ul {
  list-style: none;
  padding: 2px;
  background-color: #f6f6f6;
  border-radius: 15px;
}

#page-footer-menu li {
  display: inline;
  margin: 0 5px 0 0;
  font-size: 12px;
}

#page-footer-menu li:after {
  content: '/';
  margin-left: 10px;
  color: #d9d9d9;
}

#page-footer-menu li:last-child:after {
  content: '';
}

#page-footer-menu + #page-footer {
  margin-top: 10px;
}


/* ----------------------------------------

		メインコンテンツ

   ---------------------------------------- */

/*
 * --- ページメイン ---
 */

#page-main {
  position: relative;
  min-height: 760px;
  background-color: #ffffff;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

/*
 * --- ページコンテンツ ---
 */

#page-content {
  margin-left: 160px;
  margin-right: 40px;
  padding-top: 20px;
}


/* ----------------------------------------

		サイドコンテンツ／サイドメニュー

   ---------------------------------------- */

/*
 * --- サイドコンテンツ ---
 */

#page-side {
  position: absolute;
  width: 120px;
  height: 100%;
  top: 0;
  background-color: #f9f9f9;
  border-bottom-left-radius: 10px;
}


/*
 * --- サイドメニュー ---
 */

#side-menu {
  list-style: none;
}

#side-menu li {
  font-size: 12px;
  text-align: center;
}

#side-menu li a {
  display: block;
  padding: 10px 0;

  -webkit-transition: 0.3s;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -ms-transition: 0.3s;
  transition: 0.3s;
}

#side-menu li a:hover {
  background-color: #f0f0f0;
}

#side-menu li.active a {
  background-color: #e9f6fc;
}

#side-menu li i {
  display: block;
  font-size: 32px;
}



/* ========================================


		プレーンページ


   ======================================== */

/*
 * --- プレーンページ ---
 */

body.doc-plain #page-main {
  border-radius: 10px;
  min-height: 0;
}

body.doc-plain #page-content {
  margin-left: 40px;
  padding-top: 40px;
}

body.doc-plain #page-content:before {
  content: ' ';
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 15px;
  background-color: #4694d1;
  border-radius: 10px 10px 0 0;
}



/* ========================================


		主要要素


   ======================================== */

/* ----------------------------------------

		見出し

   ---------------------------------------- */

main header {
  margin-bottom: 20px;
}

main h1 {
  font-size: 28px;
  color: #404040;
}

main h2 {
  font-size: 22px;
}


/* ----------------------------------------

		ラベル

   ---------------------------------------- */

.label-table {
  /* bootgrid中の要素にborder-radiusは使わない（リペイントされなくなる） */
  display: inline-block;
  min-width: 46px;
  padding: 2px 5px 1px 5px;
  font-size: 11px;
  text-align: center;
  color: #ffffff;
}

.label-not { background-color: #FB8C00; }  /* 未学習 */
.label-process { background-color: #5d9cec; }  /* 受講中 */
.label-completed { background-color: #8cc152; }  /* 学習済 */
.label-required { background-color: #ed5565; }  /* 必修 */
.label-elective { background-color: #aab2bd; }  /* 選択 */
.label-entry { background-color: #37bc9b; }  /* 申し込み */
.label-success { background-color: #4CAF50; }  /* 合格 */
.label-failure { background-color: #fc6e51; }  /* 不合格 */
.label-attend { background-color: #64B5F6; }  /* 受講 */
.label-attend-ok { background-color: #00ACC1; }  /* 出席 */
.label-attend-ng { background-color: #808080; }  /* 欠席 */


/* --- カテゴリー --- */

.label-category-table {
  min-width: 140px;
}

.label-seminar { background-color: #54917f; }
.label-workshop { background-color: #915da3; }
.label-ict { background-color: #3f51b5; }


/* ========================================


		汎用


   ======================================== */


/* ----------------------------------------

		テキスト・フォント

   ---------------------------------------- */

/*
 * --- テキスト ---
 */

/* --- サイズ --- */

.font-size-lg { font-size: 150% !important; }
.font-size-md { font-size: 125% !important; }
.font-size-sm { font-size: 90% !important; }

.font-size-9 { font-size: 9px !important; }
.font-size-10 { font-size: 10px !important; }
.font-size-11 { font-size: 11px !important; }
.font-size-12 { font-size: 12px !important; }
.font-size-14 { font-size: 14px !important; }
.font-size-16 { font-size: 16px !important; }
.font-size-18 { font-size: 18px !important; }
.font-size-20 { font-size: 20px !important; }
.font-size-21 { font-size: 21px !important; }


/* --- 縦位置 --- */

.valign-middle {
  vertical-align: middle;
}


/* --- 折り返し --- */

.text-wrap {
  white-space: normal !important;
}


/* --- メール --- */

.mail {
  letter-spacing: 1px;
  margin-left: 2px;
  margin-right: 2px;
  color: #3080e3;
}

/* --- 備考 --- */

p.notes,
div.notes {
  font-size: 88%;
  color: #808080;
}


/*
 * --- フォント ---
 */

/* --- フォントを明朝に --- */

.font-mincho {
  font-family: 'ＭＳ Ｐ明朝', 'MS PMincho', 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', serif;
}

/* --- 装飾 --- */

.font-bold {
  font-weight: bold;
}


/* ----------------------------------------

		位置・サイズ

   ---------------------------------------- */

/*
 * --- マージン ---
 */

.margin-0  { margin: 0 !important; }
.margin-10 { margin: 10px !important; }
.margin-20 { margin: 20px !important; }
.margin-40 { margin: 40px !important; }

.margin-left-10 { margin-left: 10px !important; }
.margin-left-20 { margin-left: 20px !important; }
.margin-left-30 { margin-left: 30px !important; }
.margin-left-40 { margin-left: 40px !important; }

.margin-top-0  { margin-top: 0 !important; }
.margin-top-5  { margin-top: 5px !important; }
.margin-top-10 { margin-top: 10px !important; }
.margin-top-20 { margin-top: 20px !important; }
.margin-top-40 { margin-top: 40px !important; }

.margin-right-10 { margin-right: 10px !important; }
.margin-right-20 { margin-right: 20px !important; }
.margin-right-30 { margin-right: 30px !important; }
.margin-right-40 { margin-right: 40px !important; }

.margin-bottom-0 { margin-bottom: 0 !important; }
.margin-bottom-10 { margin-bottom: 10px !important; }
.margin-bottom-20 { margin-bottom: 20px !important; }
.margin-bottom-30 { margin-bottom: 30px !important; }
.margin-bottom-40 { margin-bottom: 40px !important; }


/*
 * --- パディング ---
 */

.padding-0  { padding: 0 !important; }
.padding-10 { padding: 10px !important; }
.padding-20 { padding: 20px !important; }

.padding-left-0 { padding-left: 0 !important; }
.padding-left-10 { padding-left: 10px !important; }
.padding-left-20 { padding-left: 20px !important; }
.padding-left-30 { padding-left: 30px !important; }
.padding-left-40 { padding-left: 40px !important; }

.padding-top-0 { padding-top: 0 !important; }
.padding-top-5 { padding-top: 5px !important; }
.padding-top-10 { padding-top: 10px !important; }
.padding-top-20 { padding-top: 20px !important; }
.padding-top-30 { padding-top: 30px !important; }
.padding-top-40 { padding-top: 40px !important; }

.padding-right-0 { padding-right: 0 !important; }
.padding-right-10 { padding-right: 10px !important; }
.padding-right-20 { padding-right: 20px !important; }
.padding-right-30 { padding-right: 30px !important; }
.padding-right-40 { padding-right: 40px !important; }

.padding-bottom-0 { padding-bottom: 0 !important; }
.padding-bottom-10 { padding-bottom: 10px !important; }
.padding-bottom-20 { padding-bottom: 20px !important; }


/*
 * --- 幅 ---
 */

.width-100 { width: 100px !important; }
.width-120 { width: 120px !important; }
.width-150 { width: 150px !important; }
.width-200 { width: 200px !important; }
.width-250 { width: 250px !important; }
.width-300 { width: 300px !important; }
.width-320 { width: 320px !important; }
.width-350 { width: 350px !important; }
.width-400 { width: 400px !important; }
.width-500 { width: 500px !important; }
.width-600 { width: 600px !important; }



/* ----------------------------------------

		リスト

   ---------------------------------------- */

/*
 * --- 箇条書きリスト ---
 */

/* --- ブレットリスト --- */

ul.bullet-list {
	list-style: none;
  margin-left: 20px;
}

ul.bullet-list > li {
	position: relative;
}

ul.bullet-list > li:before {
	content: ' ';
	position: absolute;
	left: -20px;
  top: 6px;
	width: 8px;
	height: 8px;
  font-size: 1px;
	background: #b0a9a0;
	border-radius: 4px;
}

/* --- 角丸数字リスト --- */

ol.round-list {
	list-style: none;
	counter-reset: roundList;
}
ol.round-list > li {
	position: relative;
  margin-left: 30px;
}
ol.round-list > li:before {
	content: counter(roundList);
	counter-increment: roundList;
	position: absolute;
	left: -30px;
	width: 20px;
  padding: 2px 0;
  color: #ffffff;
  font-family:Arial, Helvetica, sans-serif;
  font-size: 11px;
	font-weight: bold;
	text-align: center;
  line-height: 1.3;
	background: #87ceeb;
	border-radius: 5px;
}

/* --- (1)(2)(3)括弧数字リスト 利用規約で使用--- */
ol.list-number-alt {
	counter-reset: listNumber;
	list-style: none;
}

ol.list-number-alt li {
	text-indent: -1.75em;
	margin-bottom: 5px;
}

ol.list-number-alt li::before {
	content: '(' counter(listNumber) ')';
	counter-increment: listNumber;
	padding-right: 0.3em;
}


/* --- ①②③丸数字リスト利用規約で使用 丸数字はHTMLで入力が必要 --- */

ol.list-circle-alt {
	position: relative;
	margin:0;
	padding:0

}

ol.list-circle-alt li {
	list-style: none;
	list-style-position:outside;
	margin:0;
	padding-left:1.25em
}

ol.list-circle-alt li span {
	position: absolute;
	left:0;
	margin:0
}


/* ----------------------------------------

		デザイン枠

   ---------------------------------------- */

/*
 * --- 角丸枠 パネル ---
 */

.panel {
  position: relative;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  margin: 0 0 20px 0;
  padding: 5px 10px;
}

.panel-no-shadow {
  box-shadow: none
}


/* --- ボタン --- */

.panel .panel-btn {
  margin-top: 0;
  padding-top: 10px;
  padding-bottom: 5px;
}

.panel .caption {
  text-align: justify;
  font-size: 14px;
  color: #606060;
}

/* --- タイトル付き --- */

.panel-with-header {
  padding: 0;
}

.panel-with-header h2 {
  font-size: 15px;
  margin-bottom: 5px;
  padding: 6px 10px;
  color: #606060;
  background-color: #f9f9f9;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.panel-with-header h2 i {
  padding-right: 3px;
  font-size: 16px;
  vertical-align: middle;
}

.panel-with-header .panel-body {
  padding: 10px 15px;
}

.panel-with-header h2.color-bg-blue {
  color: #ffffff;
	background-color: #4694d1;
}

/*
 * --- 拡張バー付き ---
 */

.panel-with-expand {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.panel .expand-bar {
  text-align: center;
}

.panel .expand-bar a {
  display: block;
  padding: 2px 0;
  font-size: 11px;
  color: #909090;
  background-color: #F0F0F0;
}

.panel .expand-bar a::before {
  content: '\21ea';
  font-family:'WebHostingHub-Glyphs';
  display: inline-block;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-right: 2px;
  font-size: 12px;
  vertical-align: middle;
  transition: transform 1s;
}

.panel .expand-bar a::after {
  content: '表示を広げる';
}

.panel .expand-bar a:hover {
  background-color: #E9F6FC;
}

.panel-expanded .expand-bar a::before {
  transform: rotate(0deg);
}

.panel-expanded .expand-bar a::after {
  content: '表示をたたむ';
}


/* --- 直線 --- */

.panel-straight {
  border-radius: 0;
}

/* --- 線の太さ --- */

.panel-medium {
  border-width: medium;
}

.panel-thick {
  border-width: thick;
}


/*
 * --- アイコン ---
 */

/* --- アイコンを右肩に --- */

.icon-sup,
.new-window-icon:after {
	font-size: 70%;
  vertical-align: top;
  margin-left: 2px;
  margin-right: 5px;
}

/* --- 外部サイト --- */

.new-window-icon:after {
  content: '\f332';
  font-family:'WebHostingHub-Glyphs';
}

/* --- PDF --- */

.link-pdf { }

.link-pdf:before {
  content: '\f0d6';
  font-family:'WebHostingHub-Glyphs';
  margin-right: 5px;
}


/* ----------------------------------------

		カラー／テーマ

   ---------------------------------------- */

/*
 * --- ボタン ---
 */

.btn-std, .btn-std:hover, .btn-std:focus,
.btn-secondary, .btn-secondary:hover, .btn-secondary:focus,
.btn-optional, .btn-optional:hover, .btn-optional:focus,
.btn-notice, .btn-notice:hover, .btn-notice:focus
{
  color: #FFFFFF;
}

.btn-std:disabled,
.btn-secondary:disabled,
.btn-optional:disabled,
.btn-notice:disabled
{
  color: #808080 !important;
  background-color: #e0e0e0 !important;
  box-shadow: 0 2px #d0d0d0;
}

.btn-std { background-color: #3BAFDA; }
.btn-std:hover { background-color: #4BBFEA; }
.btn-secondary { background-color: #8CC152; }
.btn-secondary:hover { background-color: #9CD162; }
.btn-optional { background-color: #809090; }
.btn-optional:hover { background-color: #90A0A0; }
.btn-notice { background-color: #ED5565; }
.btn-notice:hover { background-color: #FD6575; }


/*
 * --- カラー ---
 */

.color-text { color: #333333; }
.color-gray { color: #909090; }

.color-bg-white { background-color: #ffffff; }
.color-bg-lightgray { background-color: #f9f9f9; }
.color-bg-lightblue { background-color: #f3f9ff; }
.color-bg-lightred { background-color: #FFF3F3; }


.color-border-red { border-color: #E53935; }

.border-width-1 { border-width: 1px; border-style: solid; }
.border-width-2 { border-width: 2px; border-style: solid; }
.border-width-3 { border-width: 3px; border-style: solid; }



/* ----------------------------------------

		フォームリスト

   ---------------------------------------- */

/*
 * --- リスト ---
 */

.form-list {
  padding-bottom: 20px;
  margin-bottom: 20px;
}

.form-list dt {
  float: left;
  width: 120px;
  position: relative;
}

.form-list dd {
  margin-left: 150px;
  padding: 15px 0;
  border-bottom: 1px solid #E9E9E9;
}

/* --- ラベル --- */

.form-list dd label {
  transition: color 0.2s;
}

.form-list dd label:hover,
.form-list dd input[type=radio]:hover {
  color: #3BAFDA;
}

/* --- フィールドセット --- */

.form-list fieldset {
  position: relative;
  margin-bottom: 10px;
  padding: 40px 10px 10px 20px;
  border: 1px solid #E9E9E9;
  border-radius: 8px;
}

.form-list fieldset legend {
  position: absolute;
  top: 10px;
  left: 15px;
  font-size: 14px;
  color: #606060;
  border: none;
}


/* --- インライン --- */

.form-list .min-height {
  padding-top: 5px;
  min-height: 30px;
}

.form-list dd .pull-left {
  margin-right: 10px;
}

.form-list dd .input-inline {
  float: left;
  margin-right: 10px;
  line-height: 30px;
}

/* --- 備考 --- */

.form-list .notes {
  text-indent: -20px;
  margin-left: 20px;
  margin-top: 5px;
  font-size: 12px;
  color: #808080;
}

.form-list .notes::before {
  content: '▲';
  padding-left: 5px;
  padding-right: 3px;
}

.form-list .notes-danger {
  color: #da4453;
}


/* --- リストパターン --- */

.form-list-input dt {
  width: 190px;
  padding-top: 21px;
}

.form-list-input dd {
  margin-left: 200px;
}

.form-list-input dd.only-text {
  padding-top: 22px;
}

.form-list-confirm dt {
  width: 140px;
  padding-top: 15px;
}




/*
 * --- 必須・任意 ---
 */

.form-list dt.req,
.form-list dt.opt,
.form-list dt.auto {
  position: relative;
  display: block;
  padding-left: 50px;
}

.form-list dt.req::before,
.form-list dt.opt::before,
.form-list dt.auto::before {
  position: absolute;
  top: 22px;
  left: 0;
  padding: 1px 5px;
  font-size: 10px;
  color: #FFFFFF;
}

.form-list dt.req::before {
  content: '必須';
  background-color: #EF5350;
}

.form-list dt.opt::before {
  content: '任意';
  background-color: #B0BEC5;
}

.form-list dt.auto::before {
  content: '自動';
  background-color: #8BC34A;
}


/*
 * --- ダイアログ中のリスト ---
 */

.dialog-form {
  padding: 10px;
}

.dialog-form .form-list {
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
}

.dialog-form .form-list dt {
  width: 160px;
  padding-top: 16px;
}

.dialog-form .form-list dd {
  margin-left: 180px;
  padding: 10px 0;
}

.input-group.date .input-group-addon:hover {
  background-color: #E0F7FA;
}


/* ----------------------------------------

		ウィザード

   ---------------------------------------- */

/*
 * --- ステップ ---
 */

.doc-type-wizard .step {
}

.doc-type-wizard .step li {
  float: left;
  position: relative;
  list-style: none;
  margin-right: 10px;
  padding: 2px 10px;
  font-size: 12px;
  color: #606060;
  border: 3px solid #d0d0d0;
  background-color: #f9f9f9;
  border-radius: 2px;
}

.doc-type-wizard .step li:after {
  content: '';
  position: absolute;
  right: -19px;
  top: 50%;
  margin-top: -8px;
  border: 8px solid transparent;
  border-left-color: #d0d0d0;
}

.doc-type-wizard .step li:last-child:after {
  border: none;
}

.doc-type-wizard .step li.active {
  color: #4a89dc;
  border-color: #4a89dc;
  background-color: #f0f9ff;
}

.doc-type-wizard .step li.active:after {
  border-left-color: #4a89dc;
}

.doc-type-wizard strong {
  font-size: 20px;
  font-weight: normal;
  letter-spacing: 1px;
  color: #3080e0;
}



/* ----------------------------------------

		アラート

   ---------------------------------------- */


/*
 * --- 作成中 ---
 */

.alert-under-construction {
  position: relative;
  margin: 40px 20px;
  text-align: center;
}

.alert-under-construction:before {
	content:'\f316';
  font-family:'WebHostingHub-Glyphs';
  font-size: 40px;
  position: absolute;
  top: 8px;
  left: 20px;
}

.alert-under-construction h2 {
  font-size: 22px !important;
}


/* ========================================


		ページパターン


   ======================================== */


/* ----------------------------------------

		サイドコンテンツがないページ

   ---------------------------------------- */

.no-page-side #page-side {
  display: none;
}

.no-page-side #page-main {
  min-height: 0;
}

.no-page-side #page-content {
  margin-left: 40px;
}



/* ----------------------------------------

		ヘッダー情報がないページ

   ---------------------------------------- */

.no-header-info .header-profile {
  display: none;
}


/* ----------------------------------------

		テキストページ（規約、ポリシーページ等）

   ---------------------------------------- */

/* --- コンテンツ --- */

.doc-text-page .content-text {
  margin: 40px 40px 20px 40px;
  text-align: justify;
  text-justify: inter-ideograph;
}

.doc-text-page .content-text h2 {
  margin: 20px 0 10px 0;
  font-size: 15px;
  font-weight: bold;
}

.doc-text-page .content-text ol {
  margin-left: 25px;
}

.doc-text-page .content-text ol.list-group li {
  margin-bottom: 10px;
}


/* ----------------------------------------

		情報ページ（～についてページ等）

   ---------------------------------------- */

/* --- コンテンツ --- */

.doc-info-page .content-text {
  margin: 40px 40px 20px 40px;
  text-align: justify;
  text-justify: inter-ideograph;
}

.doc-info-page .content-text h1 {
}

.doc-info-page .content-text h2 {
	position: relative;
  margin: 20px 0 10px 0;
  padding-top: 20px;
  font-size: 20px;
  font-weight: bold;
}

.doc-info-page .content-text h2 .index {
	position: absolute;
	left: -36px;
  top: 17px;
	width: 24px;
  padding-top: 4px;
  padding-bottom: 4px;
  color: #ffffff;
  font-family:Arial, Helvetica, sans-serif;
  font-size: 16px;
	font-weight: bold;
	text-align: center;
	background: #87ceeb;
	border-radius: 5px;
}

.doc-info-page .content-text h3 {
  margin: 20px 0 10px 0;
  font-size: 16px;
  font-weight: bold;
}

.doc-info-page .content-text h4 {
  margin: 20px 0 10px 0;
  font-size: 15px;
  font-weight: bold;
}

.doc-info-page .content-text p {
  line-height: 1.5;
}


/* ----------------------------------------

		モバイル用

   ---------------------------------------- */

.doc-mobile .container {
  max-width: none;
  min-width: 0;
}



/* ========================================


		共通


   ======================================== */


/* ----------------------------------------

		目次

   ---------------------------------------- */

#page-main .toc {
}

#page-main .toc .panel-body {
  padding-left: 0;
  margin-bottom: 5px;
}

#page-main .toc ul {
  margin-left: 20px;
  list-style: none;
}

#page-main .toc ul li a {
  display: block;
  padding: 2px 0 2px 10px;
}

#page-main .toc ul li a:before {
  content: '\f488';
  font-family:'WebHostingHub-Glyphs';
  margin-right: 10px;
  font-size: 11px;
  color: #c0c0c0;
}

#page-main .toc ul li a:hover {
  background-color: #f0f6ff;
}

#page-main .toc ul li a:hover:before {
  content: '\f2fe';
  color: #3bafda;
}


/* ----------------------------------------

		先頭へ戻る、目次へ戻る

   ---------------------------------------- */

.page-top {
  margin: 20px 0;
  text-align: right;
}

.page-top a {
  padding: 2px 10px;
  font-size: 11px;
  color: #808080;
  border-radius: 10px;
  background-color: #f0f0f0;
  -webkit-transition: none;
  transition: none;
}

.page-top a:before {
  content: '\21ea';
  font-family: 'WebHostingHub-Glyphs';
  margin-right: 3px;
  vertical-align: middle;
}

.page-top a:hover {
  color: #3bafda;
  background-color: #f0f6ff;
}



/* ----------------------------------------

		戻るボタン

   ---------------------------------------- */

.back-btn {
  margin-left: -20px;
  margin-bottom: 20px;
}

.back-btn .btn {
  border-radius: 20px;
}




/* ----------------------------------------

		カレンダーユニット

   ---------------------------------------- */

/*
 * --- カレンダー ---
 */

#calendar-body {
  padding: 5px 10px 10px 10px;
}

#calendar-body .row-calendar {
  display: inline-block;
}

#calendar-body .row-month {
  width: 260px;
}

#calendar-body .row-category {
}

#calendar-body .row-monthly {
  width: 250px;
}

#calendar-body .row-schedule {
  width: 210px;
  margin-left: 10px;
  vertical-align: top;
}

#calendar-header {
  margin-bottom: 5px;
}

#calendar-container {
}

/* --- 月表示 --- */

#calendar-body .row-month ol {
}

#calendar-body .row-month li {
  float: left;
  width: 34px;
  margin-right: 8px;
  list-style: none;
  text-align: center;
}

#calendar-body .row-month .month {
  display: block;
  width: 100%;
  font-size: 16px;
}

#calendar-body .row-month .month::after {
  content: '月';
  font-size: 12px;
  margin-left: 1px;
}

#calendar-body .row-month .count {
  display: block;
  width: 100%;
  padding: 2px;
  font-size: 13px;
  line-height: 1;
  color: #606060;
  background-color: #F0F0F0;
}

#calendar-body .row-month .count::after {
  content: '件';
  font-size: 12px;
  margin-left: 1px;
}

/* --- カテゴリー表示 --- */

#calendar-body .row-category .form-control {
  height: 28px;
  padding: 5px;
  font-size: 12px;
}

/* --- スケジュール表示 --- */

#calendar-body #schedule {
}

#calendar-body #schedule li {
  padding: 5px 0 5px 0 !important;
  list-style: none;
  border-top: 1px solid #e9e9e9;
  font-size: 13px;
}

#calendar-body #schedule li:last-child {
  border-bottom: 1px solid #e9e9e9;
}

#calendar-body #schedule li a {
  display: block;
  position: relative;
  padding: 5px 0 5px 10px;
}

#calendar-body #schedule li a::after {
  content: '\f488';
  position: absolute;
  font-family:'WebHostingHub-Glyphs';
  font-size: 12px;
  right: 5px;
  top: 33%;
}

#calendar-body #schedule li a:hover {
  background-color: #E9F6FC;
}

#calendar-body #schedule time {
  display: inline-block;
  margin: 0 0 5px 0;
  padding: 0 5px;
  color: #FFFFFF;
  background-color: #A0A0A0;
}

#calendar-body #schedule p {
  line-height: 1.3;
}

#calendar-body #schedule .label {
  margin-left: 5px;
  font-size: 11px;
}



/* ----------------------------------------

		注意文

   ---------------------------------------- */

/* --- ヘッダー --- */
.notice-header {
  float: right;
  width: 500px;
  margin-top: -14px;
  padding: 5px 10px;
  background-color: #FFF9F6;
  border: 1px solid #FFE0D0;
}

.notice-header ul {
  list-style: none;
}

.notice-header li {
  font-size: 12px;
  line-height: 1.2;
  text-indent: -18px;
  margin-left: 18px;
}

.notice-header li:not(:last-child) {
  margin-bottom: 4px;
}

.notice-header li.warning::before,
.notice-header li.info::before {
  font-family: 'WebHostingHub-Glyphs';
  padding-right: 5px;
  vertical-align: middle;
  color: #F44336;
}
  
.notice-header li.warning::before {
  content: '\F316';
}

.notice-header li.info::before {
  content: '\F479';
}

.notice-header .icon-anchor {
  padding-left: 2px;
  font-size: 8px;
  vertical-align: baseline;
}

/* --- 1行 --- */
.notice-row {
  margin-bottom: 10px;
  padding: 5px;
  font-size: 13px;
  color: #1B5E20;
  background-color: #F3FBEB;
}

.notice-row p {
  text-align: center;
}

.notice-row i {
  color: #2E7D32;
}


/* ----------------------------------------

		テーブル：ナビゲーション

   ---------------------------------------- */

.table-nav {
  margin-top: 10px;
}

.table-nav label {
  font-size: 12px;
  font-weight: normal;
}

.table-nav .table-nav-search {
  margin-left: 10px;
  margin-top: -5px;
}

.table-nav .table-nav-select {
  
}

.table-nav .table-nav-select .form-group {
  width: 100%;
}

.table-nav .table-nav-select .form-group:not(:last-child) {
  margin-bottom: 5px;
}

.table-nav .table-nav-select label {
  width: 22%;
}

.table-nav .table-nav-select select {
  width: 73%;
  font-size: 12px;
  height: 32px;
}



/* ----------------------------------------

		テーブル：newの行

   ---------------------------------------- */

tr.new > td:first-child {
  position: relative;
}

tr.new > td:first-child::before,
tr.new > td:first-child::after {
  position: absolute;
  left: -30px;
  top: 5px;
  background-color: #F44336;
}

tr.new > td:first-child::after {
  content: 'NEW';
  height: 13px;
  padding: 2px 4px 1px 5px;
  line-height: 1.3;
  font-family: 'Arial', 'Helvetica', 'sans-serif';
  font-size: 8px;
  color: #FFFFFF;
}

tr.new > td:first-child::before {
  content: '';
  width: 9px;
  height: 9px;
  margin-left: 22px;
  margin-top: 2px;
  transform: rotate(45deg);
}

/* ----------------------------------------

		カテゴリーラベル

   ---------------------------------------- */

.category-label {
  display: block;
  line-height: 1.3;
}

.category-label > span {
  display: inline-block;
  padding: 1px 5px 0 5px;
  line-height: 1.3;
  font-size: 10px;
  color: #FFFFFF;
  background-color: #838383;
}

.category-label > span:not(:first-child) {
  margin-left: 3px;
}


/* ----------------------------------------

		フォーム

   ---------------------------------------- */

/*
 * -- サブパネル ---
 */
.panel-sub-input {
  padding: 20px 25px;
  background-color: #FCFCFC;
  border-radius: 0;
  box-shadow: none;
}

.panel-sub-input .form-list {
  margin-bottom: 0;
  padding-bottom: 0;
}

.panel-sub-input .form-list dt {
  padding-top: 16px;
}

.panel-sub-input .form-list dt.req::before {
  top: 18px;
}

.panel-sub-input .form-list dd {
  padding: 10px 0;
  border: none;
}

/*
 * -- ラジオボタンによる切りかえ ---
 */

[data-toggle-target] {
  display: none;
}



/* ========================================


		ページ特有


   ======================================== */

/* ----------------------------------------

		インデックス

   ---------------------------------------- */

/*
 * --- ヘッダー ---
 */

.doc-index main header {
  margin: 0 0 25px 0;
  text-align: center;
}


/*
 * --- お知らせ ---
 */

.doc-index .ticker-wrapper,
.doc-dashboard .ticker-wrapper {
  position: relative;
  margin-bottom: 20px;
  padding: 15px;
  background-color: #FFFFF0;
  border: 1px solid #C0C0C0;
  border-left-width: 8px;
}

.doc-index .ticker-wrapper::before,
.doc-dashboard .ticker-wrapper::before {
  content: 'お知らせ';
  position: absolute;
  left: 0px;
  top: -10px;
  padding: 0 5px;
  font-size: 14px;
  color: #404040;
  background-color: #FFFFFF;
}

.doc-index .ticker,
.doc-dashboard .ticker {
  position: relative;
  min-height: 100px;
  font-size: 14px;
}

.doc-index .ticker .ticker-page,
.doc-dashboard .ticker .ticker-page {
  position: absolute;
  right: -5px;
  top: -25px;
  padding: 0 10px;
  text-align: right;
  font-size: 14px;
  color: #FFFFFF;
  background-color: #C0C0C0;
  border-radius: 10px;
}

.doc-index .ticker li,
.doc-dashboard .ticker li {
	display: none;
	width: 100%;
  list-style: none;
  line-height: 1.6;
}

.doc-index .ticker li.new::before,
.doc-dashboard .ticker li.new::before {
  content: 'NEW';
  margin-right: 5px;
  padding: 0 5px;
  vertical-align: 1px;
  font-size: 10px;
  color: #FFFFFF;
  background-color: #F44336;
}


/* --- お知らせ内の要素 --- */

.doc-index .ticker em,
.doc-dashboard .ticker em {
  font-weight: bold;
  color: #404040;
}


/*
 * --- ピックアップ ---
 */

.section-pickup {
  margin-bottom: 25px;
}

.section-pickup .panel {
}

.section-pickup .panel h2 {
  text-align: left;
  color: #FFFFFF;
  background-color: #4B7F63;
}

.section-pickup .panel .header-icon {
  background-color: #F9A825 !important;
}

.section-pickup .pickup {
  list-style: none;
  margin: 0;
  padding: 5px 10px;
}

.section-pickup .pickup li {
  position: relative;
  margin-bottom: 8px;
  padding: 5px 15px 5px 30px;
  background-color: #F9F9F9;
  border: 1px solid #E0E0E0;
  border-radius: 4px;
}

.section-pickup .pickup li::after {
  content: '\F504';
  font-family: 'WebHostingHub-Glyphs';
  position: absolute;
  left: 10px;
  top: 6px;
  font-size: 11px;
  color: #9CD162;
}

.section-pickup .pickup li:last-child {
  margin-bottom: 5px;
}

.section-pickup .pickup li p {
  font-size: 13px;
}

.section-pickup .pickup li.new::before {
  content: 'NEW';
  margin-right: 5px;
  padding: 0 5px;
  vertical-align: 2px;
  font-size: 10px;
  color: #FFFFFF;
  background-color: #F44336;
}



/*
 * --- パネル ---
 */

.doc-index .panel h2 {
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 16px;
  text-align: center;
}

.doc-index .panel .header-icon {
  position: absolute;
  width: 30px;
  height: 30px;
  left: -5px;
  top: -5px;
  padding-top: 3px;
  font-size: 16px;
  text-align: center;
  color: #ffffff;
  background-color: #a0a0a0;
  border-radius: 15px;
}



/*
 * --- ログイン ---
 */

.doc-index .login-form, 
.doc-detail .login-form{
}

.doc-index .login-form dt,
.doc-detail .login-form dt{
  font-size: 12px;
  margin-top: 10px;
}

.doc-index .login-form dt:first-child,
.doc-detail .login-form dt:first-child {
  margin-top: 0;
}

.doc-index .login-form dd,
.doc-detail .login-form dd{
  margin-top: 2px;
}

.doc-index .reset-password,
.doc-detail .reset-password {
  font-size: 12px;
  padding-top: 10px;
}

/*
 * --- カレンダー ---
 */

.doc-index #calendar-body {
  padding-bottom: 5px;
}

.doc-index #calendar-body #schedule li {
  padding: 5px 10px;
}

.doc-index .monthly .monthly-indicator-wrap {
  cursor: default;
}


/* ----------------------------------------

		登録フォーム

   ---------------------------------------- */


/*
 * --- 確認画面 ---
 */

/* --- 利用規約 --- */
.doc-signup-confirm #terms {
  border: none;
  padding: 0;
  font-size: 11px;
  line-height: 1.2;
}

.doc-signup-confirm #terms article {
  height: 150px;
  padding: 10px 15px;
  overflow-y: scroll;
  border: 1px solid #e0e0e0;
}

.doc-signup-confirm #terms article h1 {
  font-size: 18px;
  margin-bottom: 10px;
}

.doc-signup-confirm #terms article h2 {
  font-size: 15px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.doc-signup-confirm #terms article p {
  font-size: 11px;
  line-height: 1.2;
}

.doc-signup-confirm #terms article ul,
.doc-signup-confirm #terms article ol {
  margin-left: 2em;
}


/*
 * --- 完了画面 ---
 */

.doc-signup-completed #page-content > h2 {
  text-align: center;
  color: #da4453;
}



/* ----------------------------------------

		ダッシュボード

   ---------------------------------------- */


/* --- 日付 --- */

.doc-dashboard .label-date {
  background-color: #37bc9b;
}

.doc-dashboard .label-limit {
  background-color: #e9573f;
}

.doc-dashboard time {
  font-size: 13px;
  margin-right: 10px;

}

/* --- 対象 --- */

.doc-dashboard .label-target {
	background-color: #967adc;
}


/*
 * --- スケジュール ---
 */

.doc-dashboard #schedule-list {
}

.doc-dashboard #schedule-list .panel {
}

.doc-dashboard #schedule-list .panel-body {
  padding: 0 5px 0 5px;
}


/*
 * --- スケジュールの一覧 ---
 */

.doc-dashboard #schedule-list .item-list h3 {
  margin-bottom: 10px;
  font-size: 15px;
  font-weight: bold;
  color: #404040;
}

.doc-dashboard #schedule-list .item-list .scroll-bar {
  height: 220px;
  margin: 0;
  transition: height 0.5s;
}

.doc-dashboard #schedule-list .mCSB_scrollTools {
  margin-bottom: 10px;
}

.doc-dashboard #schedule-list .panel-expanded .item-list .scroll-bar {
  height: 420px;
}


/*
 * --- スケジュールの項目 ---
 */

.doc-dashboard #schedule-list .item-list li {
  position: relative;
}

.doc-dashboard #schedule-list .seminar-list > ul > li {
  clear: both;
  border-top: 1px solid #e9e9e9;
}

.doc-dashboard #schedule-list .seminar-list > ul > li::after {
  content: '';
  clear: both;
  display: table;
}

.doc-dashboard #schedule-list .seminar-list > ul > li:last-child {
  border-bottom: 1px solid #e9e9e9;
  margin-bottom: 20px;
}

.doc-dashboard #schedule-list .item-list .schedule-item {
  display: block;
  margin-left: 60px;
  padding: 6px 10px;
  color: #303030;
}

.doc-dashboard #schedule-list .item-list a.schedule-item {
  min-height: 100px;
  margin-top: 0 !important;
  margin-left: 0 !important;
  padding: 0 5px 5px 0;
}

.doc-dashboard #schedule-list .item-list a.schedule-item:hover {
  background-color: #e9f6fc;
}

.doc-dashboard #schedule-list .item-list .schedule-ctrl {
  float: right;
  width: 130px;
  margin-left: 10px;
  padding: 5px 5px 0 0;
}

.doc-dashboard #schedule-list .item-list .schedule-ctrl > div {
  padding-bottom: 5px;
}

.doc-dashboard #schedule-list .item-list .schedule-ctrl a i {
  font-size: 9px;
  vertical-align: 0;
}


/*
 * --- スケジュールの項目内容 ---
 */

.doc-dashboard #schedule-list .item-list .schedule-status {
  position: absolute;
  left: 5px;
  top: 50%;
  width: 54px;
  height: 54px;
  margin-top: -27px;
  padding-top: 10px;
  text-align: center;
  color: #FFFFFF;
  border-radius: 60px;
}
/*全体に対して、字が黄色くなる*/

/*
.doc-dashboard #schedule-list .item-list .schedule-status:hover {
  color: #FFFF00;
}
*/

.doc-dashboard .schedule-status::before {
  display: block;
  padding-bottom: 20px;
  font-family:'WebHostingHub-Glyphs';
  font-size: 20px;
  line-height: 1.1;
}

.doc-dashboard .schedule-status::after {
  position: absolute;
  width: 100%;
  top: 35px;
  left: 0;
  text-align: center;
  font-size: 11px;
}

/*.doc-dashboard .label-schedule-status-ok { background-color: #8CC152; }*/
/*これでカーソルがIビームから普通のやじるしに変更されます。*/
.doc-dashboard .label-schedule-status-ok {
  background-color: #8CC152;
  cursor: default;
}

/*.doc-dashboard .label-schedule-status-ok:hover { background-color: #9CD162; }*/
/*これは、ホバー時の背景変更を削除して、さらに文字が黄色くなるのを防ぐためです。
（文字の黄色は、2631行目あたりで全体に対して設定していますので、再設定して白のままにします）
*/
/*--以下だとNGだった --*/
/*--.doc-dashboard .label-schedule-status-ok:hover { color: #FFFFFF; }--*/

.doc-dashboard #schedule-list .item-list .label-schedule-status-ok:hover {
  color: #FFFFFF;
}


.doc-dashboard .label-schedule-status-ok::before { content: '\2713'; }
.doc-dashboard .label-schedule-status-ok::after {
  content: '申込済';
  letter-spacing: 1px;
  text-shadow: -1px -1px #8CC152, 1px -1px #8CC152, -1px 1px #8CC152, 1px 1px #8CC152;
}

.doc-dashboard .label-schedule-status-payment { background-color: #FB8C00; }
/*
.doc-dashboard .label-schedule-status-payment:hover { background-color: #FF9C10; }
*/
.doc-dashboard .label-schedule-status-payment::before { content: '\f233'; }
.doc-dashboard .label-schedule-status-payment::after {
  content: '入金待ち';
  text-shadow: -1px -1px #FB8C00, 1px -1px #FB8C00, -1px 1px #FB8C00, 1px 1px #FB8C00;
}

.doc-dashboard .label-schedule-status-ready { background-color: #4CAF50; }
/*
.doc-dashboard .label-schedule-status-ready:hover { background-color: #5CBF60; }
*/
.doc-dashboard .label-schedule-status-ready::before { content: '\2713'; }
.doc-dashboard .label-schedule-status-ready::after {
  content: '入金済';
  letter-spacing: 1px;
  text-shadow: -1px -1px #4CAF50, 1px -1px #4CAF50, -1px 1px #4CAF50, 1px 1px #4CAF50;
}

.doc-dashboard .label-schedule-status-accepted { background-color: #4CAF50; }
.doc-dashboard .label-schedule-status-accepted::before { content: '\2713'; }
.doc-dashboard .label-schedule-status-accepted::after {
  content: '受付済';
  letter-spacing: 1px;
  text-shadow: -1px -1px #4CAF50, 1px -1px #4CAF50, -1px 1px #4CAF50, 1px 1px #4CAF50;
}

.doc-dashboard .label-schedule-status-cancel { background-color: #9E9E9E; }
/*
.doc-dashboard .label-schedule-status-cancel:hover { background-color: #AEAEAE; }
*/
.doc-dashboard .label-schedule-status-cancel::before { content: '\f11f'; opacity: 0.8; }
.doc-dashboard .label-schedule-status-cancel::after {
  content: 'キャンセル';
  font-size: 10px;
  text-shadow: -1px -1px #9E9E9E, 1px -1px #9E9E9E, -1px 1px #9E9E9E, 1px 1px #9E9E9E;
}


.doc-dashboard .label-schedule-status-waiting { background-color: #F06292; padding-top: 6px !important; }
.doc-dashboard .label-schedule-status-waiting::before { content: '\F134'; font-size: 26px; }
.doc-dashboard .label-schedule-status-waiting::after {
  content: 'キャンセル待ち';
  line-height: 1.1;
  font-size: 10.5px;
  text-shadow: -1px -1px #F06292, 1px -1px #F06292, -1px 1px #F06292, 1px 1px #F06292;
}


.doc-dashboard .schedule-detail {
  position: absolute;
  left: 5px;
  top: 70px;
  width: 64px;
  padding: 2px 3px 1px 3px;
  text-align: center;
  font-size: 11px;
  color: #FFFFFF;
  background-color: #3BAFDA;
  border-radius: 3px;
  transition: color 0.3s, background-color 0.3s;
}

.doc-dashboard .schedule-detail:hover {
  color: #FFFF00;
  background-color: #5BCFFA;
}


.doc-dashboard #schedule-list .schedule-info {
  margin: 0 0 10px 0;
  list-style: none;
}

.doc-dashboard #schedule-list .schedule-info li {
  display: inline-block;
}

.doc-dashboard #schedule-list .item-list h4 {
  margin: 0 5px 5px 0;
  line-height: 1.3;
  font-size: 14px;
}

.doc-dashboard #schedule-list .schedule-info .label {
  display: inline-block;
  font-size: 12px;
}

/*キャンセル期間終了メッセージ*/
.doc-dashboard .cancel-message:before {
	width: 0;
	height: 0;
	border: 10px solid transparent;
	border-bottom: 10px solid #ffe4e7;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid transparent;
	content:"";
	position: absolute;
	right:60px;
	top:-20px;
}
.doc-dashboard .cancel-message {
	font-size: 85%;
	background-color: #ffe4e7;
	border-radius: 8px;
	padding: 10px 15px;
	margin-bottom: 10px;
	margin-right: 10px;
	position: relative;
}


.label-schedule-type {
  min-width: 170px;
  padding: 6px 10px 5px 10px;
  line-height: 1.3;
  background-color: #A0A0A0;
  border-radius: 0;
}

.label-schedule-type-seminar { background-color: #64B5F6; }
.label-schedule-type-live { background-color: #5C6BC0; }
.label-schedule-type-ondemand1 { background-color: #BA68C8; }
.label-schedule-type-ondemand2 { background-color: #9575CD; }
.label-schedule-type-venue { background-color: #64B5F6; }

.label-schedule-date {
  min-height: 22px;
  min-width: 80px;
  margin-left: 5px;
  margin-right: 0;
  padding: 6px 10px 3px 10px;
  background-color: #909090;
  border-radius: 20px 0 0 20px;
}

.schedule-info time {
  padding-left: 10px;
  padding-right: 15px;
  font-size: 13px;
  border: 1px solid #C0C0C0;
  border-left: none;
  border-radius: 0 20px 20px 0;
  background-color: #FFFFFF;
}


/*
 * --- スケジュールの詳細 ---
 */

.doc-dashboard #schedule-list .item-detail {
  padding-left: 10px;
}

.doc-dashboard #schedule-list .item-detail .scroll-bar {
  height: 180px;
  clear: both;
  transition: height 0.5s;
}

.doc-dashboard #schedule-list .panel-expanded .item-detail .scroll-bar {
  height: 360px;
}

.doc-dashboard #schedule-list .item-detail .back-panel {
  padding-top: 9px;
  padding-bottom: 10px;
}

.doc-dashboard #schedule-list .item-detail .back-panel .btn {
  padding: 2px 15px;
  border-radius: 20px;
}

.doc-dashboard #schedule-list .item-detail .apply-panel {
  float: right;
  margin-right: 10px;
  padding-top: 5px;
}


/* --- レジュメ --- */

.doc-dashboard .course-resume {
  position: absolute;
  overflow: hidden;
  right: 270px;
  min-height: 32px;
  border: 1px solid #D0D0D0;
  border-radius: 30px;
}

.doc-dashboard .course-resume > span {
  display: inline-block;
  min-height: 30px;
  padding: 6px 10px;
  font-size: 12px;
  color: #FFFFFF;
  background-color: #909090;
}

.doc-dashboard .course-resume ul {
  display: inline-block;
  padding: 0 15px 0 10px;
}

.doc-dashboard .course-resume li {
  display: inline-block;
}

.doc-dashboard .course-resume .btn {
  padding-left: 10px;
  padding-right: 10px;
}

.doc-dashboard .course-resume .btn::before {
  content: '\f0d6';
  font-family:'WebHostingHub-Glyphs';
  font-size: 11px;
  vertical-align: middle;
  padding-right:  5px;
}




.doc-dashboard #schedule-list .item-detail .schedule-info {
  margin-left: 0;
}
.doc-dashboard .item-detail .label-schedule-type {
  min-width: 0;
}

.doc-dashboard .item-detail .label-owner {
  padding: 5px 10px;
  background-color: #909090;
  border-radius: 0;
}

.doc-dashboard #schedule-list .detail {
}

.doc-dashboard #schedule-list .detail-content {
  padding: 10px;
}

.doc-dashboard #schedule-list .detail h4 {
  font-size: 20px;
  font-weight: bold;
  margin: 10px 0 15px 0;
  line-height: 1.4;
  padding: 10px 15px;
  background-color: #F0F3F6;
}

.doc-dashboard #schedule-list .detail h5 {
  margin: 0 0 10px 0;
  font-size: 18px;
  font-weight: bold;
}

.doc-dashboard #schedule-list .detail h5 + div {
  margin: 0 10px 20px 10px;
}

.doc-dashboard #schedule-list .detail dl {
  margin: 20px 10px;
}

.doc-dashboard #schedule-list .detail dt {
  float: left;
  min-width: 180px;
}

.doc-dashboard #schedule-list .detail dd {
  margin: 0 0 5px 0;
  padding: 0 0 0 200px;
  border-bottom: 1px dashed #E0E0E0;
}

.doc-dashboard #schedule-list .detail ol,
.doc-dashboard #schedule-list .detail ul {
  margin-left: 20px;
}


.doc-dashboard #schedule-list .detail .detail-date {
}

.doc-dashboard #schedule-list .detail .detail-target {
  font-size: 12px;
  margin-top: 5px;
}

.doc-dashboard #schedule-list .detail .detail-full {
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  padding: 5px;
  color: #d770ad;
  border: 2px solid #d770ad;
  background-color: #f9e9f6;
  border-radius: 6px;
  margin-bottom: 20px;
}

.doc-dashboard #schedule-list .detail .detail-caption {
  margin-top: 10px;
  padding: 10px 15px;
  font-size: 12px;
  background-color: #f9f9f9;
  border-radius: 8px;
}

.doc-dashboard #schedule-list .detail .detail-table {
  margin-top: 10px;
}

.doc-dashboard #schedule-list .detail .detail-table table {
  font-size: 12px;
  margin-bottom: 10px;
  border-bottom: solid 1px #dddddd;
}

.doc-dashboard #schedule-list .detail .detail-table thead th {
  font-size: 11px;
  color: #606060;
  padding-bottom: 2px;
}

.doc-dashboard #schedule-list .detail .detail-table table td {
  white-space: nowrap;
  vertical-align: middle;
}

.doc-dashboard #schedule-list .detail .detail-table table i {
  font-size: 11px;
  vertical-align: top;
}


/*
 * --- 資格一覧 ---
 */

.doc-dashboard #license-list .panel {
  height: 286px;
}

.doc-dashboard #license-list .license-notes {
  text-align: center;
  margin-top: 5px;
}

.doc-dashboard #license-list h3 {
  font-size: 15px;
}

.doc-dashboard #license-list dl {
}

.doc-dashboard #license-list dt {
  margin-top: 8px;
  padding: 2px 0 1px 0;
  font-size: 11px;
  background-color: #F9F9F9;
}

.doc-dashboard #license-list dd {
  margin-top: 2px;
  font-size: 13px;
}


/* --- 資格項目の一覧 --- */

.doc-dashboard #license-list .license-items {
  overflow-y: auto;
  max-height: 220px;
  margin: 0;
  padding: 0 5px;
  list-style: none;
}

.doc-dashboard #license-list .license-items li {
  position: relative;
  display: flex;
  align-items: center;
  height: 55px;
  padding-left: 50px;
  font-size: 13px;
  border-bottom: 1px dashed #E9E9E9;
}

.doc-dashboard #license-list .license-items li::before {
  content: '';
  position: absolute;
  display: block;
  left: 5px;
  top: 10px;
  width: 30px;
  height: 35px;
  background: url(../image/icon/certification-sm.png) center center no-repeat;
}


/* --- 資格インフォメーション --- */

.doc-dashboard #license-list .panel-information {
}

.doc-dashboard #license-list .panel-information ul {
  padding: 0 0 0 5px;
  list-style: none;
}

.doc-dashboard #license-list .panel-information li {
  margin-bottom: 5px;
  padding-bottom: 10px;
  font-size: 12px;
  line-height: 1.6;
  border-bottom: 1px dashed #E9E9E9;
}

.doc-dashboard #license-list .panel-information li::before {
}

.doc-dashboard #license-list .panel-information i {
  margin: 0 5px;
  padding: 1px 5px;
  border: 1px solid #E0E0E0;
  background-color: #F6F6F6;
}



/*
 * --- コース一覧 ---
 */


#course-list > .panel > h3 {
  margin: 10px 20px 10px 20px;
  padding-bottom: 8px;
  font-size: 15px;
  font-weight: bold;
  color: #404040;
  border-bottom: 1px solid #e9e9e9;
}

/* --- カテゴリー --- */

#course-list .panel-body {
  position: relative;
}

#course-list .category {
  position: absolute;
  top: 10px;
  z-index: 1;
}

#course-list .category .form-control {
  font-size: 12px;
  height: 28px;
  padding: 3px;
}


/*
 * --- グリッドテーブル ---
 */

.table-grid {
  font-size: 14px;
  border-bottom: 1px solid #dddddd;
}

/* -- 行 --*/
.table-grid thead {
  font-size: 12px;
}

.table-grid td {
  vertical-align: middle !important;
}


/*
 * --- コーステーブル ---
 */

/* --- ヘッダー --- */

#course-table > thead > tr > th {
  border-bottom-color: #4694d1;
}


/* --- 最終列 --- */

#course-table .btn-outbound,
#course-table .btn-certificate {
  display: block;
  width: 100%;
  margin: 0;
  margin-bottom: 2px !important;
  padding:  2px 5px;
  font-size: 11px;
  font-weight: normal;
  color: #FFFFFF;
  background-color: #3BAFDA;
  border: none;
  box-shadow: 0 2px #B0B0B0;
  transition: none;
}

#course-table .btn-outbound {
  margin-bottom: 5px !important;
  font-size: 11px;
}

#course-table .btn-certificate::before {
  content: '\f60e';
  font-family:'WebHostingHub-Glyphs';
  font-size: 10px;
  vertical-align: middle;
  padding-right:  5px;
}

#course-table .btn-outbound:hover,
#course-table .btn-certificate:hover {
  background-color: #F4511E;
}


/* --- コーステーブルの列 --- */

#course-table .column-status {
  width: 60px;
}

#course-table tbody tr td:nth-child(1) .label-table,
#item-table tbody tr td:nth-child(1) .label-table {
  border-radius: 20px;
}

#course-table .column-course {
}

#course-table tbody tr td:nth-child(2) {
  line-height: 1.3;
  white-space: normal;
}

#course-table .column-type {
  width: 110px;
}

#course-table tbody tr td:nth-child(3) {
  font-size: 12px;
}

#course-table tbody tr td:nth-child(3) .label-table {
  min-width: 80px;
}

#course-table .column-owner {
  width: 150px;
}

#course-table tbody tr td:nth-child(4) {
  font-size: 12px;
}

#course-table .column-certificate {
  width: 85px;
}




/*
 * --- 受講履歴（外部）テーブル ---
 */


/* --- コーステーブルの列 --- */

#course-external-table .column-date {
  width: 200px;
}

#course-external-table .column-certificate {
  width: 60px;
}

/* --- 最終列 --- */

#course-external-table .btn-certificate {
  margin: 0;
  border: 1px solid #d0d0d0;
}

#course-external-table .btn-certificate:hover {
  color: #ffffff;
  background-color: #8cc152;
}

/* --- 折り返し --- */

#course-external-table tbody tr td:nth-child(1),
#course-external-table tbody tr td:nth-child(3) {
  white-space: normal;
}



/*
 * --- 教材テーブル ---
 */

#item-list {
  padding-left: 30px;
  padding-right: 30px;
}

/* --- ヘッダー --- */

#item-list .item-list-header {
}

#item-list .item-list-header ul {
  overflow: hidden;
  margin-top: 5px;
}

#item-list .item-list-header ul li {
  float: left;
  margin-right: 10px;
  list-style: none;
}

#item-list .item-list-category {
  clear: both;
  margin-top: 5px;
  margin-bottom: 0;
}

#item-list .item-list-course {
  font-size: 18px;
}

/* --- テーブルの分離 --- */

#item-list .table-header {
  font-size: 10px;
  margin: 0;
}

#item-list .item-table-body {
  overflow-y: scroll;
  max-height: 460px;
  padding-bottom: 1px;
  border-bottom: 1px solid #dddddd;
}

/* --- テーブル --- */

#item-table .column-header-anchor {
	cursor: default !important;
}

#item-table {
  font-size: 12px;
  margin-bottom: 0;
  border-bottom: none;
}

#item-table thead {
  font-size: 10px;
}

#item-table thead th {
  padding: 0;
  border: none;
}

#item-table thead th:hover {
  background-color: #ffffff;
}

#item-table tbody tr:first-child td {
  border-top: none;
}

#item-table td.column-status {
  text-align: center;
  width: 80px;
}

#item-table tbody tr td:nth-child(2) {
  white-space: normal;
}


/* --- 教材テーブルの列 --- */

#item-list .column-status {
  width: 80px;
}

#item-list .column-item {
}

#item-list .column-perc {
  width: 60px;
}

#item-list .column-count {
  width: 70px;
}

#item-list .column-study-date {
  width: 100px;
}

#item-list .table-header .column-study-date {
  width: 110px;
}


/* ----------------------------------------

		カレンダー

   ---------------------------------------- */

/*
 * --- カレンダー ---
 */

.doc-calendar {
}

.doc-calendar #info {
}

.doc-calendar #info .panel-body {
  padding: 10px 30px 15px 30px;
  font-size: 13px;
}

.doc-calendar #calendar-body .row-monthly {
  width: 500px;
}

.doc-calendar #calendar-body .row-schedule {
}

.doc-calendar .monthly-day .monthly-event-indicator {
  max-width: 71px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/*
 * --- ダイアログ ---
 */

.doc-calendar #item-list-dialog .panel {
  padding: 20px;
}


/* ----------------------------------------

		資格状況

   ---------------------------------------- */

/*
 * --- 資格状況テーブル ---
 */

.doc-certificate .table-title {
  position: absolute;
}

.doc-certificate .table-title h3 {
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: bold;
}

.doc-certificate .table-title p {
  font-size: 12px;
  color: #606060;
}

#certificate-table-header {
  margin-bottom: 30px;
}

/* --- 何もない場合 --- */

.zero-alert {
  padding: 30px 0;
  text-align: center;
}

.zero-alert p {
  font-size: 18px;
  color: #606060;
}

/* --- コーステーブルの列 --- */

#certificate-table .column-date {
  width: 200px;
}

#certificate-table .column-count {
  width: 100px;
}

#certificate-table .column-certificate {
  width: 60px;
}

/* --- 最終列 --- */

#certificate-table .btn-certificate {
  margin: 0;
  border: 1px solid #d0d0d0;
}

#certificate-table .btn-certificate:hover {
  color: #ffffff;
  background-color: #8cc152;
}

/* --- 折り返し --- */

#certificate-table tbody tr td:nth-child(1) {
  white-space: normal;
}

/* --- 喪失した資格 --- */


#lost-certificate-table .column-lost {
  width: 150px;
}

#lost-certificate-table .column-date {
  width: 200px;
}



/* ----------------------------------------

		連携組織

   ---------------------------------------- */

.doc-link {
}

.doc-link h2 {
  font-size: 16px;
}


/*
 * --- リスト ---
 */

.doc-link .list {
  margin: 0 20px;
}

.doc-link .list li {
  list-style: none;
  margin: 0;
}

/*
 * --- リンク一覧 ---
 */

.doc-link .link-list > li {
  font-size: 15px;
  color: #505050;
}

.doc-link .link-list a,
.doc-link .link-list li > span {
  display: block;
  width: 100%;
  height: 100%;
  padding: 2px 10px;
}

.doc-link .link-list a:before {
	content: '\f332';
  font-family:'WebHostingHub-Glyphs';
  font-size: 12px;
  margin-right: 5px;
  color: #a0a0a0;
}

.doc-link .link-list li > span {
  color: #606060;
}

.doc-link .link-list li > span:before {
	content: '';
  margin-right: 17px;
}

.doc-link .link-list a:hover {
  background-color: #f0f6ff;
}

.doc-link .link-list a:hover:before {
  color: #337ab7;
}

.doc-link .link-list ul {
  margin: 5px 0 5px 10px;
  border-left: 3px solid #f0f0f0;
}

.doc-link .link-list ul li {
  font-size: 14px;
}

.doc-link .link-list em {
  color: inherit;
  font-weight: bold;
}

/* --- 謝辞 --- */

.doc-link #acknowledgment .panel-body {
  padding: 15px 20px;
  font-size: 13px;
  text-align: justify;
  text-justify: inter-ideograph;
}

/* --- 開発者・協力者 --- */

.doc-link #staff .panel-body {
  padding: 0 15px 15px 15px;
}

.doc-link #staff .panel-body dt {
  margin: 10px 0 5px 0;
  padding: 3px 10px;
  font-size: 13px;
  background-color: #f0f6fc;
}

.doc-link #staff .panel-body dd {
  margin-left: 10px;
  font-size: 13px;
  text-align: justify;
  text-justify: inter-ideograph;
}

.doc-link #staff table {
  width: 100%;
}

.doc-link #staff table td {
  width: 25%;
}


/* ----------------------------------------

		用語集

   ---------------------------------------- */

.doc-glossary {
}

/*
 * --- 検索 ---
 */

.doc-glossary .search {
}

.doc-glossary .search .panel-body {
  padding: 10px 15px 15px 15px;
}

.doc-glossary .search .search-text-body {
  margin-right: 200px;
}

.doc-glossary .search .btn {
  margin-bottom: 2px;
}


/*
 * --- 用語 ---
 */

.doc-glossary .glossary {
  padding-top: 30px;
  border-top: 1px dashed #e9e9e9;
}

.doc-glossary #glossary-list {
  list-style: none;
}

.doc-glossary #glossary-list > li {
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px dashed #e9e9e9;
}

.doc-glossary #glossary-list h3 {
  margin-bottom: 5px;
  font-size: 18px;
  font-weight: bold;
}

.doc-glossary #glossary-list > li > div {
  margin-left: 20px;
}

.doc-glossary #glossary-list > li ol.round-list > li:before {
  background-color: #a0a0a0;
}



/* ----------------------------------------

		参考文献

   ---------------------------------------- */

/*
 * --- 表 ---
 */

.doc-reference #reference-book table tr td:first-child {
  width: 50%;
}

.doc-reference #reference-book table tr td:last-child {
  white-space: nowrap;
}


/* ----------------------------------------

		FAQ

   ---------------------------------------- */

.doc-faq {
}

/*
 * --- FAQコンテンツ ---
 */

.doc-faq .faq {
  margin-top: 40px;
  padding-top: 10px;
  border-top: 1px dashed #e0e0e0;
}

.doc-faq .faq h2 {
  position: relative;
  margin-bottom: 10px;
  padding-top: 20px;
  padding-left: 35px;
  font-size: 20px;
  font-weight: bold;
}

.doc-faq .faq h2 .index {
  position: absolute;
  left: 0;
  top: 17px;
  width: 24px;
  padding-top: 4px;
  padding-bottom: 4px;
  color: #ffffff;
  font-family:Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  background: #87ceeb;
  border-radius: 5px;
}

.doc-faq .faq h3 {
  font-size: 16px;
  margin-left:5px;
  margin-bottom:5px;
  padding-top: 10px;
  font-weight: bold;
}

.doc-faq .faq h4 {
  font-size: 16px;
  margin-left:0px;
  margin-bottom:5px;
  padding-top: 5px;
  font-weight: bold;
  color: #eb8787;
}

.doc-faq .faq dl {
  margin-left: 10px;
  margin-right: 10px;
}

.doc-faq .faq dl dt,
.doc-faq .faq dl dd {
	position: relative;
  padding-left: 36px;
}

.doc-faq .faq dl dt {
  font-weight: normal;
  margin-bottom: 5px;
  cursor: pointer;
  padding: 4px 4px 4px 36px;
  border: 1px solid #ddd;
  border-radius: 6px;
  background-color: #f9f9f9;
  position:relative;
}
.doc-faq .faq dl dt::after,
.doc-faq .faq dl dt.opened::after{
	font-family: 'WebHostingHub-Glyphs';
	right: 10px;
	position: absolute;
	color:#87ceeb/*#a0a0a0*/;
}
.doc-faq .faq dl dt::after{
	content: '\f571';
}
.doc-faq .faq dl dt.opened{
	margin-bottom: 0;
	border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
	
}
.doc-faq .faq dl dt.opened::after{
	content: '\f572'/**/;
}
.doc-faq .faq dl dt:hover{
	background-color: #e9f6fc;
}

.doc-faq .faq dl dd {
  margin-bottom: 30px;
  text-align: justify;
  text-justify: inter-ideograph;
  padding: 10px 20px 15px 36px;
  border: 1px solid #ddd;
  border-top: none;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}

.doc-faq .faq dl dt:before,
.doc-faq .faq dl dd:before {
  position: absolute;
  color: #ffffff;
  height: 20px;
  width: 22px;
  font-family:Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  line-height: 1.5;
  border-radius: 20px;
}

.doc-faq .faq dl dt:before {
  	content: 'Q';
	left: 8px;
  	/*top: -1px;*/
	background: #a0d468;
}

.doc-faq .faq dl dd:before {
	content: 'A';
	left: 8px;
  	top: 8px;
	background: #eb8787;
}

/* すべてを開く・すべてを閉じるボタン */
.doc-faq .faq-view::before{
	content: '\002b';
	font-family: 'WebHostingHub-Glyphs';
	margin-right: 5px;
}
.doc-faq .expanded::before{
	content: '\2212';
	font-family: 'WebHostingHub-Glyphs';
}

/*FAQ内の設定*/
.doc-faq .faq-list dd table th,
.doc-faq .faq-list dd table td{
	padding: 5px 10px;
	border: 1px solid #e9e9e9;
	font-size: 90%;
	
}
.doc-faq .faq-list dd table th{
	background-color:#e9f6fc;
	vertical-align: top;
}
.doc-faq .faq-list dd ul{
	margin-left: 1.5em;
	margin-bottom: 0.5em;
	
}

.doc-faq .faq-list dd ul li{
	line-height: 1.6;
	
}
/*FAQ ダッシュボードアイコン説明*/
.doc-faq p.icon{
	position: relative;
	margin: 25px 0 25px 0;
	padding-left: 40px;
}
.doc-faq .schedule-status {
  position: absolute;
  left:-10px;
  top:-10px;
  width: 40px;
  height: 40px;
  padding-top: 5px;
  text-align: center;
  color: #FFFFFF;
  border-radius: 60px;
}
.doc-faq .schedule-status::before {
  display: block;
  padding-bottom: 20px;
  font-family:'WebHostingHub-Glyphs';
  font-size: 14px;
  line-height: 1!important;
}
.doc-faq .schedule-status::after {
  position: absolute;
  width: 100%;
  top: 22px;
  left: 0;
  text-align: center;
  font-size: 6px;
}
.doc-faq .label-schedule-status-ok{
	background-color: #8CC152;
}

.doc-faq .label-schedule-status-ready {
	background-color: #4CAF50;
}

.doc-faq .label-schedule-status-ok:before {
	content: '\2713'; 
}
.doc-faq .label-schedule-status-ok:after {
  content: '申込済';
}
.doc-faq .label-schedule-status-payment {
    background-color: #FB8C00;
}
.doc-faq .label-schedule-status-payment::before {
    content: '\f233';
}
.doc-faq .label-schedule-status-payment::after {
    content: '入金待ち';
    text-shadow: -1px -1px #FB8C00, 1px -1px #FB8C00, -1px 1px #FB8C00, 1px 1px #FB8C00;
}

.doc-faq .label-schedule-status-ready::before {
    content: '\2713';
}
.doc-faq .label-schedule-status-ready::after {
    content: '入金済';
}


/* ----------------------------------------

		このサイトについて

   ---------------------------------------- */

/*
 * --- ステップ ---
 */

.doc-about-index {
}

.doc-about-index ol.step {
}

.doc-about-index ol.step > li {
  margin-bottom: 10px;
  list-style: none;
}

.doc-about-index ol.step > li:last-child {
  min-height: 0;
  margin-bottom: 0;
  border-bottom: none;
}

.doc-about-index ol.step > li > div {
	position: relative;
  float: left;
  width: 90px;
  padding: 5px;
	font-size: 18px;
  color: #ffffff;
	background-color: #8cc152;
	border-radius: 10px;
}

.doc-about-index ol.step > li > div:after {
	content: ' ';
	position: absolute;
	top: 99%;
	left: 50%;
	width: 0;
	height: 0;
	border: solid transparent;
	border-top-color: #8cc152;
	border-width: 20px;
	margin-left: -20px;
}

.doc-about-index ol.step > li:last-child > div:after {
  display: none;
}

.doc-about-index ol.step > li > div p {
	text-align:center;
}

.doc-about-index ol.step > li > ul {
  margin-left: 130px;
  padding-bottom: 10px;
  min-height: 60px;
  border-bottom: 1px dashed #e9e9e9;
}

/* --- 英語 --- */

:lang(en) .doc-about-index ol.step > li > div {
  width: 300px;
}

:lang(en) .doc-about-index ol.step > li > ul {
  margin-left: 350px;
}



/* ----------------------------------------

		受講票 モバイル向け

   ---------------------------------------- */

.doc-entry-ticket {
}

.doc-entry-ticket #page-footer {
  margin-top: 10px;
}


/* --- 見出し --- */

.doc-entry-ticket h1 {
  padding: 10px 20px;
  font-size: 20px;
  text-align: left;
  line-height: 1.2;
  color: #FFFFFF;
  background-color: #4694D1;
}

.doc-entry-ticket h1 + p {
  display: inline-block;
  margin: 15px auto;
  padding: 5px 16px 3px 20px;
  letter-spacing: 4px;
  background-color: #FFFFFF;
  border: 2px solid #C0C0C0;
  border-radius: 8px;
}

.doc-entry-ticket h1 .date {
  margin-left: 10px;
  white-space: nowrap;
  font-size: 12px;
}

/* --- バーコード --- */

.doc-entry-ticket .barcode img {
  max-width: 100%;
}


/* --- リスト --- */

.doc-entry-ticket .entry-list {
  padding: 10px 10px 5px 10px;
  border: 1px solid #E9E9E9;
}

.doc-entry-ticket .entry-list dl {
}

.doc-entry-ticket .entry-list dt {
  float: left;
  min-width: 90px;
  padding: 2px 10px;
  text-align: center;
  background-color: #E9E9E9;
  border-radius: 5px;
}

.doc-entry-ticket .entry-list dd {
  margin-bottom: 5px;
  padding-left: 100px;
  padding-top: 1px;
  font-size: 16px;
}

/* --- XSサイズ --- */
@media screen and (min-width: 1px) and (max-width: 767px) {

  .doc-entry-ticket h1 {
    font-size: 18px;
    line-height: 1.4;
  }

}


/* ----------------------------------------

		サテライト出席管理

   ---------------------------------------- */

/*
 * --- 共通 ---
 */

.doc-attendance article {
  margin: 20px 10px;
  background-color: #FFFFFF;
}

.doc-attendance article > section {
  padding-left: 20px;
  padding-right: 20px;
}

.doc-attendance header {
  position: relative;
  margin-bottom: 10px;
}

.doc-attendance header h1 {
  padding: 13px 20px;
  text-align: center;
  font-size: 15px;
  font-weight: bold;
  background-color: #FFFFFF;
}

.doc-attendance header h2 {
  padding: 10px 20px;
	text-align: left;
  font-size: 20px;
  color: #FFFFFF;
  background-color: #4694D1;
}

.doc-attendance header .header-btn {
  position: absolute;
  top: 6px;
}

.doc-attendance header .header-btn .btn {
  padding-left: 15px;
  padding-right: 20px;
  border-radius: 20px;
}

.doc-attendance header .date {
  margin-top: 5px;
  padding: 5px;
  text-align: center;
  font-size: 16px;
}


/*
 * --- 入力画面 ---
 */

.doc-attendance-index header .header-btn {
  right: 10px;
}

.doc-attendance-index h3 {
  padding: 10px 0 6px 0;
  margin-bottom: 20px;
  text-align: center;
  font-size: 28px;
  color: #FFFFFF;
  background-color: #EF5350;
  border-radius: 40px;
}

.doc-attendance-index .barcode-message {
  margin: 0 0 30px 0;
  padding: 20px 30px;
  font-size: 46px;
  text-align: center;
  color: #402020;
  background-color: #FFF0F6;
  border: 4px solid #EF5350;
  border-radius: 5px;
}

.doc-attendance-index #input-barcode:focus {
  background-color: #FFFFE0;
}

.doc-attendance-index .alert-barcode {
  min-height: 80px;
  margin: 20px 0;
}


/*
 * --- ダイアログ ---
 */

.doc-attendance-index .bootstrap-dialog {
}

.doc-attendance-index .bootstrap-dialog-message {
  text-align: center;
  padding-bottom: 10px;
}

.doc-attendance-index .bootstrap-dialog-message h2 {
  margin: 20px 0 25px 0;
}

.doc-attendance-index .bootstrap-dialog-message .message {
  font-size: 20px;
}

.doc-attendance-index .bootstrap-dialog-message .message em {
  margin-left: 5px;
  margin-right: 5px;
  font-size: 30px;
}


/*
 * --- 一覧画面 ---
 */

.doc-attendance-list header .header-btn {
  left: 10px;
}


/*
 * --- 出欠席テーブル ---
 */

.doc-attendance-list #attendance-table td {
  white-space: normal;
  border-right: 1px dashed #E0E0E0;
}

/* --- 検索バー --- */

.doc-attendance-list #attendance-table-header .search {
  width: auto;
  margin-top: 15px;
  margin-right: 0;
}

.doc-attendance-list #attendance-table-header .search input {
  font-size: 20px;
  height: 40px !important;
}

/* --- フッター --- */

.doc-attendance-list #attendance-table-footer .infoBar {
  padding-top: 8px;
}


/* --- テーブルヘッダー --- */

.doc-attendance-list #attendance-table thead th {
  font-size: 12px;
  padding: 0;
}

.doc-attendance-list #attendance-table thead th a {
  position: relative;
  padding: 8px;
}

.doc-attendance-list #attendance-table th > .column-header-anchor > .icon {
  font-size: 10px;
  right: 10px;
  bottom: 10px !important;
}

/* --- 出欠席テーブルの列 --- */

.doc-attendance-list #attendance-table .column-status {
  width: 85px;
}

.doc-attendance-list #attendance-table .column-number {
  width: 90px;
}

.doc-attendance-list #attendance-table .column-date {
  width: 90px;
}


/* ----------------------------------------

		テーマスイッチ

   ---------------------------------------- */

body.body-animation * {
 transition: all 0.5s !important;
}

#thema-selector {
  position: fixed;
  top: 100px;
  right: -140px;
  padding: 10px 40px 10px 10px;
  z-index: 1000;
  background-color: #FFFFFF;
  border: 2px solid #C0C0C0;
  border-radius: 10px 0 0 10px;
  opacity: 0.3;
  transition: right 0.5s, opacity 0.5s;
}

#thema-selector:hover {
  right: -10px;
  opacity: 1;
}

#thema-selector p {
  font-size: 11px;
}

#thema-selector ul {
  list-style: none;
}

#thema-selector li {
  margin-bottom: 3px;
}

#thema-selector a {
  display: block;
  padding: 5px 10px;
  border-radius: 30px;
}

#thema-selector a:hover {
  background-color: #F0F0F0;
}

#thema-selector a.active {
  color: #FFFFFF;
  background-color: #00BCD4;
}

/* ----------------------------------------

		ビデオ教材

   ---------------------------------------- */

/*ビデオ説明文*/
.doc-video .note{
	background: #f9f9f9;
	margin:0px 20px 10px;
}
.doc-video .panel{
	margin-top: 10px;
}
.doc-video .panel h2 {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 16px;
    text-align: center;
}

.doc-video .panel-body {
	text-align: center;
}
.doc-video .video-wrapper{
	position: relative;
	width: 640px;
	height: 380px;
	text-align: center;
	margin: 0 auto;
}
.doc-video video{
	background: #eee;
	width: 100%;
	height: 100%;
}

/*ビデオ再生画面 制御不可*/
.doc-video .video-wrapper .video-unavailable{
	width: 100%;
	height: 100%;
	background: #eee;
	position: absolute;
	top:0;
	left: 0;
	opacity:0.5;
	/*display: none;*/
}

/*ビデオ再生画面上　認証コード表示*/
.doc-video .video-wrapper p.title {
  position: absolute;
  right: 10px;
  top: 10px;
  margin: 0;
  padding: 10px;
  color: #FFFFFF;
  background-color: #FF0000;
  border-radius: 5px;
  opacity: 0.8;
}

/*ビデオ再生画面上　確認コード　ダイアログ表示*/
.doc-video .code-dialog{
  position: absolute;
  top:70px;
  left:20px;
}

.doc-video .code-dialog .panel{
	width:600px!important;
	height:200px;
	border-color: #c1d0d6;
}

.doc-video .code-dialog .panel h2{
	background: #4BBFEA;
	color: #ffffff;
}
.doc-video .code-dialog .panel p{
	margin:20px 0 20px;
	text-align: center;
}

.doc-video form{
	background: #f6f6f6;
	padding: 10px;
	border-radius: 8px;
}
.doc-video form .form-group{
	margin-bottom: 0;
}

.doc-video form .form-group:last-child{
	background: #fff;
	margin: 5px;
	padding: 10px;
	border-radius: 8px;

}

.doc-video label{
	margin:10px 0 0 10px;
	font-weight: normal;
	color: #606060;
	font-size: 90%;
}


.doc-video .speed{
	display: inline-block;
}

.doc-video .speed input {
	display: none;

}
.doc-video .speed label{
	display: block;
	float: left;
	cursor: pointer;
	width: 40px;
	margin: -6px 0;
	padding: 6px;
	background: #fff;
	color: #869198;
	font-size: 14px;
	text-align: center;
	line-height: 1;
	transition: .2s;
	box-shadow: 0 2px #ccc;
}
.doc-video .speed label:first-of-type{
	border-radius: 15px 0 0 15px;
}
.doc-video .speed label:last-of-type{
	border-radius: 0 15px 15px 0;
}
.doc-video .speed input[type="radio"]:checked + .switch-on {
	background-color: #8CC152;
	color: #fff;
	box-shadow: 0 2px #c0c0c0;
}
.doc-video .speed input[type="radio"]:checked + .switch-off {
	background-color: #8CC152;
	color: #fff;
	box-shadow: 0 2px #c0c0c0;
}

.doc-video .code-id{
	font-size:150%;
	padding: 10px;
}

/* ----------------------------------------

		講座内容詳細

   ---------------------------------------- */

.doc-detail h2{
	background-color: #f5f5f5;
	padding: 8px 5px;
	margin: 20px 0;
	font-size: 20px;
	border-radius: 5px;
}

/*
 * --- パネル ---
 */


.doc-detail .panel {
	padding: 0;
}


.doc-detail th{
	background-color: #f9f9f9;
}


.doc-detail .panel p {
}



/*研修グループ*/
.doc-detail .course-detail .course-group{
	background-color: #ffffff;
	padding: 5px;
}
.doc-detail .course-detail .course-group span.label{
	background-color: #666;
}

.doc-detail .course-detail .panel span.label{
	margin-bottom: 5px;
}

.doc-detail p.course-title{
	font-size: 20px;
}

.doc-detail .course-detail h3{
	font-size: 16px;
	margin: 20px 0 5px;
	border-bottom:1px solid #f0f0f0;
	padding-bottom: 5px;
	font-weight: bold;
}
.doc-detail .course-detail em{
	font-weight: bold;
}
.doc-detail .course-detail th{
	min-width:100px;
}
.doc-detail .course-detail p.name-title{
	margin-bottom: 0.2em;
}

.doc-detail .course-detail ul{
	margin-bottom: 0.5em;
}
.doc-detail .course-detail ul li{
	margin-left: 2em;
}
.doc-detail .course-detail ol{
	margin-bottom:0.5em;
}
.doc-detail .course-detail ol li{
	margin-left: 2em;
}
.doc-detail .course-detail .round-list{
	margin-left:10px;
}

/* 会場と定員 */
.doc-detail .course-detail td section {
  padding: 0.5em;
  border: 1px solid #E9E9E9;
  border-left: 3px solid #00BCD4;
}
.doc-detail .course-detail td div:not(:last-of-type) section {
  margin-bottom: 7px;
}

.doc-detail .course-detail td dfn {
  display: inline-block;
  padding: 0.1em 0.3em 0 0.3em;
  font-weight: normal;
  font-size: 13px;
  color: #FFFFFF;
  background-color: #00BCD4;
}


/*
 * --- お申し込み　ログイン ---
 */
.doc-detail .application .panel .header-icon {
  position: absolute;
  width: 30px;
  height: 30px;
  left: -5px;
  top: -5px;
  padding-top: 3px;
  font-size: 16px;
  text-align: center;
  color: #ffffff;
  background-color: #a0a0a0;
  border-radius: 15px;
}
.doc-detail .application .panel h2 {
	margin-top:0;
	margin-bottom:0;
    padding-top: 10px;
    padding-bottom: 5px;
    font-size: 14px;
    text-align: center;
}

.doc-detail .application .btn.btn-lg-text {
    font-size: 14px;
}

/*
 * --- 受講スタイル・料金表示---
 */
.doc-lecture-style h2{
	background-color: #f5f5f5;
	padding: 10px 20px;
	margin: 20px 0 10px;;
	font-size: 20px;
	border-radius: 5px;
}
.doc-lecture-style h2 span{
	margin-bottom: 8px;
}
.doc-lecture-style h3{
	font-size: 16px;
	background-color: #cbeaf7/*f5f5f5*/;
	padding: 8px;
	margin: 15px 0 10px 0;
}
.doc-lecture-style h3:first-child{
    margin-top: 0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;

}

.doc-lecture-style .date{
	font-size: 18px;
	margin-left: 1em;
}

.doc-lecture-style .panel{
	padding:0;
	margin: 0 10px 10px 10px;
} 

.doc-lecture-style .price{
	margin: 10px;
	width: 220px;
} 


.doc-lecture-style .price .label{
	font-size: 14px;
	background: #9CD162/*#999*/;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	margin-right: 1em;
	padding: 8px;
}
.doc-lecture-style .input-group{
	margin-left: 1em;
	margin-bottom: 10px;
}
.doc-lecture-style .ticket{
	margin-left: 20px;
	width: 240px;
}


.doc-lecture-style .alert{
	padding: 8px 10px;
	margin: 10px 20px;
	font-size: 95%;
	position: relative;
}

/*
.doc-lecture-style .alert p{
	margin-left: 20px;
}
.doc-lecture-style .alert::before{
	content:'\f05a';
	font-family: WebHostingHub-Glyphs;
	position: absolute;
	left: 10px;
	top:8px;
}
*/


/*
 * --- キャンセルダイアログ ---
 */
.doc-dashboard iframe{
	border:none!important;
	min-height:620px;
	min-width:570px;
	padding:0;
}

#cancel-frame {
	background-color: #fff!important;
	padding:0 10px;
}


/* ----------------------------------------

		各種マニュアル

   ---------------------------------------- */

.doc-manual .manual-list {
  list-style: none;
  margin: 40px 0 0 5%;
}

.doc-manual .manual-list li {
  display: block;
  width: 46%;
  float: left;
  margin: 0 3% 20px 0;
}

.doc-manual .manual-list li a {
  position: relative;
  width: 100%;
  min-height: 110px;
  padding: 10px 20px 5px 80px;
}

.doc-manual .manual-list li a::before {
	content:'\f08a';
	font-family: WebHostingHub-Glyphs;
	position: absolute;
	left: 20px;
	top: 25px;
  font-size: 32px;
}

.doc-manual .manual-list li a::after {
  content: 'PDFを開く';
  position: absolute;
  left: 15px;
  top: 70px;
  font-size: 10px;
}

.doc-manual .manual-list li a p {
  white-space: normal;
  font-size: 12px;
}

.doc-manual .manual-list li a p.title {
  margin-bottom: 5px;
  font-size: 20px;
  font-weight: bold;
}


/* ----------------------------------------

特定商取引法に基づく表記」のスタイル追加 (2018/12/21)

---------------------------------------- */
/*kここから　↓ */
[data-accordion] .visible-opened { display: none; }

[data-accordion-btn] { display: inline-block; }
[data-accordion-btn]::before { content: ""; font-family: "LineAwesome"; font-size: 130%; padding-right: 0.2em; vertical-align: -0.1em; }

[data-accordion-body] { display: none; margin-top: 5px; padding: 0px; background-color: #F0F0F0; animation: anim-fadeIn 0.2s linear; border-radius: 8px;}

[data-accordion].opened .visible-opened { display: inline-block; }
[data-accordion].opened .visible-closed { display: none; }
[data-accordion].opened [data-accordion-btn]::before { content: ""; font-family: "LineAwesome"; }
[data-accordion].opened [data-accordion-body] { display: block; }

[data-accordion] .legal { font-size: 90%; }
[data-accordion] .legal h2 { font-size: 15px !important; border-radius: 0 !important; }
[data-accordion] .legal .panel { margin: 0 !important; }

/* --- (1)(2)(3)括弧数字リスト --- */
ol.list-number-alt { counter-reset: listNumber; list-style: none; }

ol.list-number-alt li { text-indent: -1.75em; margin-bottom: 5px; }

ol.list-number-alt li::before { content: "(" counter(listNumber) ")"; counter-increment: listNumber; padding-right: 0.3em; }

/* --- ①②③丸数字リスト 丸数字はHTMLで入力が必要 --- */
ol.list-circle-alt { position: relative; margin: 0; padding: 0; }

ol.list-circle-alt li { list-style: none; list-style-position: outside; margin: 0; padding-left: 1.25em; }

ol.list-circle-alt li span { position: absolute; left: 0; margin: 0; }

dl.list-label > dt { display: inline-block; margin-bottom: 0.5em; padding: 0.1em 1.2em 0.2em 1.2em; color: #FFFFFF; background-color: #01579B; border-radius: 3em; }
dl.list-label > dd { margin-bottom: 1em; }
dl.list-label > dd p { margin-bottom: 5px; }
dl.list-label.list-label-indent > dd { padding-left: 1em; }

dl.list-label-inline > dt, dl.list-label-inline > dd { display: inline-block; margin-bottom: 0.5em; }
dl.list-label-inline > dt { padding: 0.1em 1.2em 0.2em 1.2em; color: #FFFFFF; background-color: #01579B; border-radius: 3em; }
dl.list-label-inline > dd { margin-right: 2em; }

div.list-label-inline-nowrap > p { display: inline-block; margin-bottom: 0.5em; padding-right: 2em; line-height: 1.8; white-space: nowrap; }
div.list-label-inline-nowrap > p .label { margin-right: 1em; padding: 1px 1em; font-size: 90%; color: #FFFFFF; background-color: #01579B; }

dl.list-table > dt { float: left; width: 10em; }
dl.list-table > dd { min-height: 2em; margin-bottom: 0.3em; padding-left: 10.5em; }
dl.list-table.list-table-6 > dt { width: 6em; }
dl.list-table.list-table-6 > dd { padding-left: 6.5em; }
dl.list-table.list-table-8 > dt { width: 8em; }
dl.list-table.list-table-8 > dd { padding-left: 8.5em; }
dl.list-table.list-table-12 > dt { width: 12em; }
dl.list-table.list-table-12 > dd { padding-left: 12.5em; }
dl.list-table.list-table-15 > dt { width: 15em; }
dl.list-table.list-table-15 > dd { padding-left: 15.5em; }
dl.list-table.list-table-condensed > dd { min-height: 1.2em; }
dl.list-table.list-table-separate > dt, dl.list-table.list-table-leader > dt { position: relative; }
dl.list-table.list-table-separate > dt::after, dl.list-table.list-table-leader > dt::after { position: absolute; right: 0; top: 0; color: #909090; }
dl.list-table.list-table-separate > dt::after { content: ':'; }
dl.list-table.list-table-leader > dt::after { content: '…'; }
dl.list-table.list-table-border > dd { margin-bottom: 0.4em; padding-bottom: 0.4em; border-bottom: 1px dotted #D0D0D0; }
@media (min-width: 1px) and (max-width: 767px) { dl.list-table:not(.list-table-separate):not(.list-table-leader) > dt { float: none; width: auto !important; margin-bottom: 0.3em; padding-top: 0; }
  dl.list-table:not(.list-table-separate):not(.list-table-leader) > dd { margin-bottom: 0.3em; padding-left: 0 !important; }
  dl.list-table.list-table-label-xs > dt { margin-left: -0.5em; padding-left: 0.5em; border-left: 3px solid #8FC31F; }
  dl.list-table.list-table-label-xs > dd { padding-left: 1em !important; } }

dl.list-faq { margin-top: 2rem; }
dl.list-faq > dt, dl.list-faq > dd { position: relative; padding-left: 2.1rem; text-align: justify; text-justify: inter-ideograph; }
dl.list-faq > dt::before, dl.list-faq > dd::before { content: 'Q'; display: block; position: absolute; left: 0; top: 0; width: 1.6rem; height: 1.6rem; padding-top: 0.05em; text-align: center; font-family: "Muli", "sans-serif"; font-size: 1.1rem; color: #FFFFFF; background-color: #009688; border-radius: 100%; }
dl.list-faq > dt { margin-bottom: 0.5em; min-height: 2.1rem; font-size: 1.1rem; color: #009688; }
dl.list-faq > dd { margin-left: 2em; margin-bottom: 2em; }
dl.list-faq > dd::before { content: 'A'; background-color: #8FC31F; }
dl.list-faq > dd p { margin-bottom: 0.2em; }
dl.list-faq.list-faq-border > dd { margin-bottom: 1em; padding-bottom: 1em; border-bottom: 1px dashed #E0E0E0; }
/*kここまで　↑ */

/* - eof. */