/*!*******************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[2]!./src/reset.css ***!
  \*******************************************************************************************************************************************************************************************************/
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}


/* CSS reset for minimalists */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
*::before, *::after {
  box-sizing: inherit;
}

/**
 * CSS リセット追加分
 */
a {
  color: inherit;
  text-decoration: none;
}

button {
  background-color: transparent;
  border: none;
  border-radius: 0;
  outline: none;
  padding: 0;
  -webkit-appearance: none;
          appearance: none;
  color: inherit;
}

input,
select,
textarea {
  -webkit-appearance: none;
          appearance: none;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  font: inherit;
}
input:focus,
select:focus,
textarea:focus {
  outline: none;
}
select::-ms-expand {
  display: none;
}

ol, ul {
  list-style: none;
}

th {
  font-weight: normal;
}

/*!**********************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[2]!./src/styles.css?ngGlobalStyle ***!
  \**********************************************************************************************************************************************************************************************************************/
/* You can add global styles to this file, and also import other style files */

/**
 * 全体共通スタイル
 */

* {
  /* iOS でタップしたときの強調表示をなくす */
  -webkit-tap-highlight-color: transparent;
}

html,
body {
  height: 100%;
}

html {
  /* body に指定される min-width によりはみ出る可能性があるため、スクロールできるように */
  overflow: auto;
}

body {
  /* position: absolute で祖先要素を辿ったとき、一つも relative や absoltue がなければ
     包含ブロックは初期包含ブロックとなる。
     初期包含ブロックは大きさなどコントロール外の挙動となってしまうため、最低でも
     ルート要素 (= body) が包含ブロックとなるように */
  position: relative;
  /* デザインガイド資料より、
   *
   *     横幅 1024 px を最小値として、これより横幅が狭まる場合は
   *     縮小せず画面を左右スクロールします。
   *
   * とあるため、画面幅最小を 1024 px とする
   */
  min-width: 1024px;
  /**
   * アプリのような UI デザインのため、body 全体のスクロールは完全に不要
   *
   * InnerWindowComponent を右下に固定した場合など、内部要素がスクロール可能と
   * なってしまう可能性があるのではみ出た部分は表示しない
   */
  overflow: hidden;
  /* iOS で慣性スクロールを有効に */
  -webkit-overflow-scrolling: touch;

  background-color: #f2f3f4;
  font-size: 14px;
  font-family: YuGothic,'Yu Gothic','Hiragino Kaku Gothic ProN','Hiragino Kaku Gothic Pro W3',Meiryo,"ＭＳ ゴシック",Arial,sans-serif;
  line-height: 1.5;

  /* iOS 8+ で画面向きを変えたときにズームインしてしまう問題の対策 */
  -webkit-text-size-adjust: 100%;
}

/* ベトナム語で合字が別れて表示されるため、一般的なフォントのみ使用する */
body:lang(vi) {
  font-family: Arial, Helvetica, sans-serif;
}

button {
  cursor: pointer;
  font-size: inherit;
}

label.small {
  display: block;
  font-size: 12px;
  color: #333;
}
input[type="text"].small,
input[type="password"].small,
input[type="email"].small,
input[type="number"].small,
input[type="text"].big,
input[type="password"].big,
input[type="email"].big,
textarea.small {
  display: block;
  width: 100%;
  background-color: #fff;
  border: 1px solid #979797;
  color: #232535;
}
input[type="text"].small::placeholder,
input[type="password"].small::placeholder,
input[type="email"].small::placeholder,
input[type="number"].small::placeholder,
input[type="text"].big::placeholder,
input[type="password"].big::placeholder,
input[type="email"].big::placeholder,
textarea.small::placeholder {
  color: #aaa;
}
input[type="text"].small:disabled,
input[type="password"].small:disabled,
input[type="email"].small:disabled,
input[type="number"].small:disabled,
input[type="text"].big:disabled,
input[type="password"].big:disabled,
input[type="email"].big:disabled,
textarea.small:disabled {
  background-color: #E6E6E6;
}
input[type="text"].small,
input[type="password"].small,
input[type="email"].small,
input[type="number"].small,
textarea.small {
  border-radius: 3px;
  padding: 4px 8px;
}
input[type="number"].small {
  text-align: right;
  padding-right: 3px; /* Chrome などではマウスホバーでスピンボタンが出現するので右スペースを小さくする */
}
textarea.small {
  height: 120px;
  min-height: 30px;
  resize: vertical;
}
input[type="text"].big,
input[type="password"].big,
input[type="email"].big {
  padding: 10px;
}

input[type="checkbox"].small,
input[type="checkbox"].big {
  background-color: #fff;
  vertical-align: middle;
}
input[type="checkbox"].small {
  border-radius: 2px;
  border: 1px solid #979797;
  height: 16px;
  width: 16px;
}
input[type="checkbox"].small:not(.ambigious):checked {
  border: 0;  /* (背景) 画像がボーダー含め表現するため、二重にならないように消す */
  background-image: url('icn_list_check_checked.f29b55f581c1dd87.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
}
input[type="checkbox"].small.ambigious {
  background-image: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyOCAyOCI+PHJlY3QgeD0iNCIgeT0iNCIgd2lkdGg9IjIwIiBoZWlnaHQ9IjIwIiByeD0iNCIgZmlsbD0iIzIzMjUzNSIvPjwvc3ZnPg==');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
input[type="checkbox"].big {
  border-radius: 4px;
  border: 1px solid #313B4C;
  height: 20px;
  width: 20px;
}
input[type="checkbox"].big:checked {
  background-color: #095EB3;
  background-image: url('icn_check_checked.12bcca21af706553.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px 20px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
input[type="checkbox"].small:not(.ambigious):checked {
  background-image: url('icn_list_check_checked@2x.6090c202d4d04159.png');
}
input[type="checkbox"].big:checked{
  background-image: url('icn_check_checked@2x.c0b66fc38f786610.png');;
}
}
input[type="checkbox"].big:disabled {
  background-color: #E6E6E6;
  border-color: #aaa;
}

input[type="radio"].small {
  background-color: #fff;
  border-radius: 8px;
  border: 1px solid #979797;
  display: inline-block;
  height: 16px;
  margin: 1px;
  position: relative;
  vertical-align: middle;
  width: 16px;
}
input[type="radio"].small:checked::after {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 10px;
  height: 10px;
  margin: auto;
  border-radius: 5px;
  background-color: #232535;
}

select.small {
  display: block;
  width: 100%;

  border-radius: 4px;
  border: 1px solid #979797;
  color: #333;
  padding: 4px 25px 4px 8.5px;

  background-color: #fff;
  background-image: url('icn_caret-down.425b8ab8f415ee86.png');
  background-position: right 8px center;
  background-repeat: no-repeat;
  background-size: 10px 6px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx){
select.small{
  background-image: url('icn_caret-down@2x.e22499185caba4b1.png');;
}
}

table.gray {
  width: 100%;
}
table.gray thead {
  background-color: #e1e1e1;
}
table.gray tbody {
  background-color: #F2F2F2;
}
@media (hover), all and (-ms-high-contrast: none), screen and (min--moz-device-pixel-ratio:0) {
/**
 * colspan 含むセレクターは table 要素内に table 要素が入る親子関係の可能性
 * (オプションブックや Book Fig 関係など)
 * があるため、親の hover に子が影響されないようにするため
 * colspan は子 table を入れる td に設定される
 */
table.gray tbody > tr:hover > td:not([colspan]) {
  background-color: #E8F4FF;
}
}
table.gray th,
table.gray td {
  border: 1px solid #ccc;
  vertical-align: middle;
}
table.gray thead th {
  border-bottom: 1px solid #8E8F9A;
}
table.gray th {
  color: #232535;
  font-size: 13px;
  line-height: 35px;
}
table.gray td {
  color: #333;
  padding: 10px;
}
/* デザイン設定で表示間隔に「コンパクト」が選ばれている場合は行高さを減らす */
.theme-span-compact table.gray td {
  padding: 5px 10px;
}
table.gray td.gray-table-no-padding {
  padding: 0;
}

nav.gray {
  display: block;
  background-color: #f9f9f9;
  border: 1px solid #c5c5c5;
  border-radius: 4px;
  padding: 4px 0;
  box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.25);
}
@media (hover), all and (-ms-high-contrast: none), screen and (min--moz-device-pixel-ratio:0) {
nav.gray .nav-button:hover {
  background-color: #cfe9ff;
}
nav.gray .nav-button:active {
  background-color: #dcdcdc;
}
}

button.cancel,
button.danger,
button.submit {
  width: 120px;
  height: 35px;
  border-radius: 3px;
}
button.cancel.big,
button.danger.big,
button.submit.big {
  width: 250px;
  height: 50px;
  font-size: 16px;
}

button.cancel {
  background-color: #E6E6E6;
  border: 1px solid #B3B3B3;
  color: #666;
}

button.danger {
  background-color: #F23D3D;
  border: 1px solid #BF3030;
  color: #fff;
}

button.submit {
  background-color: #313B4C;
  border: 1px solid #10141A;
  color: #fff;
}
button.submit:disabled {
  background: #898989;
  border-color: #898989;
  cursor: default;
}

/* 複数同時交換 */
input[type="checkbox"].mse {
  background-color: #fff;
  vertical-align: middle;
}
input[type="checkbox"].mse {
  border-radius: 4px;
  border: 1px solid #313B4C;
  height: 20px;
  width: 20px;
}
input[type="checkbox"].mse:checked {
  background-color: #095EB3;
  background-image: url('icn_check_checked.12bcca21af706553.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px 20px;
}
input[type="checkbox"].mse:checked{
  background-image: url('icn_check_checked@2x.c0b66fc38f786610.png');;
}
input[type="checkbox"].mse:disabled {
  background-color: #E6E6E6;
  border-color: #aaa;
}

input[type="checkbox"].mse-unselected {
  background-color: #fff;
  vertical-align: middle;
}
input[type="checkbox"].mse-unselected {
  border-radius: 4px;
  border: 1px solid #313B4C;
  height: 20px;
  width: 20px;
}
