@charset "UTF-8";
/* CSS Document */
/**************************************************
* 色の管理、色は全てここ！
***************************************************/
/**************************************************
* thema以外で色を扱えるようにする
***************************************************/ :root {
  /*ブランド(キー)カラー*/
  --color--key-blue: #0D6E9E; /*office*/
  --color--key-bk: #565956;
  /*サイトカラー*/
  --color--white: #FFFFFF;
  --color--black: #333333;
  --color--gray01: #ADADAD;
  --color--gray02: #999999;
  --color--gray03: #F8F8F8;
  --color--gray04: #8A8A8A;
  /*blue バリエーション*/
  --color--light-blue01: #F0F3F5; /*くすんだ薄い青*/
  --color--light-blue05: #E2E8EB; /*くすんだ薄い青の少し濃い青*/
  --color--light-blue02: #F3F8FA; /*   少し明るい青 */
  --color--light-blue03: #DFE7EA; /*くすんだ少しだけ濃い青*/
  --color--light-blue04: #CEDFE8; /*キー青を18%に薄めたもの*/
  --color--dark-blue01: #13567D; /*少し濃い青*/
  --color--dark-blue02: #A3B8C2; /*くすんだ濃い青*/
  
  --color--orange: #F47E04; /*   オレンジ色  */
  --color--yellow: #F2E974; /*   黄色  */
  --color--light-yellow: #ECE8D0; /*   薄い黄色  */


  --color--transparent-blue01 :rgba(12, 92, 133, 0.7);/* キーの青の透過70% */
}
/* background */
.box-shadow {
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
}
/**************************************************
* 背景　[t-color-bg--]
***************************************************/
/*サイトキーカラー*/
.t-color-bg--key-blue {
  background-color: var(--color--key-blue);
}
.t-color-bg--key-bk {
  background-color: var(--color--key-bk);
}
/*標準色セット*/
.t-color-bg--white {
  background-color: var(--color--white);
}
.t-color-bg--black {
  background-color: var(--color--black);
}
/*サイトカラーバリエーション*/
.t-color-bg--light-blue01 {
  background-color: var(--color--light-blue01);
}
.t-color-bg--light-blue02 {
  background-color: var(--color--light-blue02);
}
.t-color-bg--light-blue03 {
  background-color: var(--color--light-blue03);
}
.t-color-bg--light-blue04 {
  background-color: var(--color--light-blue04);
}
.t-color-bg--light-yellow {
  background-color: var(--color--light-yellow);
}
.t-color-bg--gray03 {
  background-color: var(--color--gray03);
}
.t-color-bg--transparent-blue01 {
  background-color: var(--color--transparent-blue01);
}


/**************************************************
* 文字色 [t-color-txt--]
***************************************************/
/*サイトキーカラー*/
.t-color-text--key-blue {
  color: var(--color--key-blue);
}
.t-color-text--key-bk {
  color: var(--color--key-bk);
}
/*標準色セット*/
.t-color-text--white {
  color: var(--color--white);
}
.t-color-text--black {
  color: var(--color--black);
}
.t-color-text--gray02 {
  color: var(--color--gray02);
}
.t-color-text--gray04 {
  color: var(--color--gray04);
}
/*サイトカラーバリエーション*/
.t-color-text--light-blue01 {
  color: var(--color--light-blue01);
}
.t-color-text--light-blue02 {
  color: var(--color--light-blue02);
}
.t-color-text--light-blue03 {
  color: var(--color--light-blue03);
}
/*=================== TBここから ==================*/
@media screen and (min-width: 600px) {}
/*=================== TBここまで ==================*/
/*=================== PCここから==================*/
@media screen and (min-width: 1023px) {}
/*=================== PCここまで ==================*/