@charset "UTF-8";

/**************************************************
* 色の管理、色は全てここ！
***************************************************/



/**************************************************
* thema以外で色を扱えるようにする
***************************************************/

:root {
  /*サイトカラー*/
  --color--white: #FFF;
  --color--black01: #333333;
  --color--black02: #5A5A5A;

  --color--green01: #48A486;
  --color--green02: #6DB7A0;
  --color--green03: #F5F7F6;
  --color--green04:#F4F8F6;
  --color--green05: #A3D1C2;

  --color--gray01: #CDD6DD;
  --color--gray02: #707070;
  --color--gray03: #ACACAC;
  --color--gray04: #fbfbfb;

  --color--orenge01: #D07929;
    
  --color--ice-blue: #E6F2F5;
  --color--ice-blue02: #F5FAFB;
  --color--sand-blue: #707F89;

  --color--sand-brown01: #B5B76D;
    
  --color--sand-yellow01: #EBEBD7;

  --color--red01: #bc002d;
  --color--red02: #E52727;

  --ease-custom-out: cubic-bezier(.19,1,.22,1);
  --change--transition: .3s;
}



/**************************************************
* 色の管理、色は全てここ！
***************************************************/
/*背景*/
.t-bgcolor--white{
  background-color: var(--color--white);
}
.t-bgcolor--green01{
  background-color: var(--color--green01);
}
.t-bgcolor--green02{
  background-color: var(--color--green02);
}
.t-bgcolor--green03{
  background-color: var(--color--green03);
}
.t-bgcolor--green04{
  background-color: var( --color--green04);
}
.t-bgcolor--green05{
  background-color: var( --color--green05);
}

/*薄いグレー*/
.t-bgcolor--gray04{
  background-color: var(--color--gray04);
}

/*薄い水色*/
.t-bgcolor--ice-blue{
  background-color: var(--color--ice-blue);
}

/*薄い黄色*/
.t-bgcolor--sand-yellow01{
  background-color:  var(--color--sand-yellow01);
}



/*バイカラー*/
.t-bgcolor--bicolor{
 background-image: linear-gradient(var(--color--gray04) 0% 20%, var(--color--green04) 20% 100%) ;
}

/*=================== TBここから ==================*/
@media screen and (min-width: 600px) {
.t-bgcolor--bicolor{
 background-image: linear-gradient(var(--color--gray04) 0% 30%, var(--color--green04) 30% 100%) ;
}

}/*=================== TBここまで ==================*/
/*=================== PCここから==================*/
@media screen and (min-width: 1023px) {
.t-bgcolor--bicolor{
 background-image: linear-gradient(var(--color--gray04) 0% 37%, var(--color--green04) 37% 100%) ;
}	
	
}/*=================== PCここまで==================*/



  

/*文字色*/
.t-textcolor--white{
  color: var(--color--white) !important;
}
.t-textcolor--black01{
  color: var(--color--black01) !important;
}

.t-textcolor--green01{
  color: var(--color--green01) !important;
}
.t-textcolor--green02{
  color: var(--color--green02) !important;
}
.t-textcolor--green03{
  color: var(--color--green03) ;
}

.t-textcolor--gray01{
  color: var(--color--gray01) !important;
}
.t-textcolor--gray02{
  color: var(--color--gray02) !important;
}

.t-textcolor--sand-brown01{
  color: var(--color--sand-brown01) !important;
}

.t-textcolor--sand-blue{
  color: var(--color--sand-blue) !important;
}

.t-textcolor--red01{
  color: var(--color--red01) !important;
}
.t-textcolor--red02{
  color: var(--color--red02) !important;
}