@charset "utf-8";
/***************************************************
information
  filename : app_sysart_dez.css;
***************************************************/

/*======== alert_parts.css ========*/
/****************** アラート系共通（注意書きボックス） ******************/

/* ** alert_basic start ** */
/*** 共通設定 ***/
:root {
  --CautBox-rod: 0.2rem; /* 角丸 */
  --CautBox-mg: 1.0rem auto; /* マージン */
  --CautBox-pd: 2.0rem 1.5rem; /* パディング */
  --font-CautBox: clamp(1.6rem, 1.6vw, 1.6rem); /* フォントサイズ */
}
@media screen and (max-width: 600px) {
	:root {
		--CautBox-pd: 1.5rem 1.0rem; /* パディング */
	}
}
/* ** alert_basic end ** */

/* ** alert0101 start ** */
/*** 0101: 背景黄色注意書き部分 ***/
:root {
/* 背景黄色注意書き部分 */
  --Art-bg: #fff4ab; /* 背景色 */
  --Art-brd: 1px solid #e00012; /* ボーダー指定 */
  --Art-bbg: none; /* 背景影色 */
  --Art-txt: #e00012; /* テキスト色 */
}
/* ** alert0101 end ** */

/* ** alert0102 start ** */
/*** 0102: 背景あり注意書き部分（基本グレー） ***/
:root {
  --CautTxt-bg: #f0f0f0; /* 背景色 */
  --CautTxt-brd: 1px solid #cccccc; /* ボーダー指定 */
  --CautTxt-bbg: none; /* 背景影色 */
  --CautTxt-txt: #585858; /* テキスト色 */
}
/* ** alert0102 end ** */

/* ** alert0103 start ** */
/*** 0103: 背景あり注意書き部分（基本白） ***/
:root {
  --CautTxtW-bg: #fff; /* 背景色 */
  --CautTxtW-brd: 1px solid #d3d3d3; /* ボーダー指定 */
  --CautTxtW-bbg: none; /* 背景影色 */
  --CautTxtW-txt: #333; /* テキスト色 */
}
/* ** alert0103 end ** */

/* ** alert0104 start ** */
/*** 0104: 背景あり注意書き部分（基本赤） ***/
:root {
  --CautTxtR-bg: #ffe5e5; /* 背景色 */
  --CautTxtR-brd: 2px solid #c71a1a; /* ボーダー指定 */
  --CautTxtR-bbg: none; /* 背景影色 */
  --CautTxtR-txt: #c71a1a; /* テキスト色 */
}
/* ** alert0104 end ** */

/* ** alert0105 start ** */
/*** 0105: 背景あり注意書き部分（基本青） ***/
:root {
  --CautTxtB-bg: #d5f0f4; /* 背景色 */
  --CautTxtB-brd: 2px solid #008abd; /* ボーダー指定 */
  --CautTxtB-bbg: none; /* 背景影色 */
  --CautTxtB-txt: #008abd; /* テキスト色 */
}
/* ** alert0105 end ** */

/* ** alert0106 start ** */
/*** 0106: 背景あり注意書き部分（基本緑） ***/
:root {
  --CautTxtG-bg: #e3ffcd; /* 背景色 */
  --CautTxtG-brd: 2px solid #10a800; /* ボーダー指定 */
  --CautTxtG-bbg: none; /* 背景影色 */
  --CautTxtG-txt: #10a800; /* テキスト色 */
}
/* ** alert0106 end ** */

/****************** アラート系共通（フォーム内個別注意書きエリア） ******************/

/* ** alert0201 start ** */
/*** 0201: 入力フォーム注意書き部分 ***/
:root {
/* 共通 */
  --CautFM-rod: 0.2em; /* 角丸 */
  --CautFM-pd: 0.8rem; /* パディング */
  --font-CautFM: clamp(1.4rem, 1.4vw, 1.4rem); /* フォントサイズ */

/* 入力フォーム注意書き部分 */
  --CautTxtS-bg: #ebebeb; /* 背景色 */
  --CautTxtS-brd: 1px solid #d1d1d1; /* ボーダー指定 */
  --CautTxtS-bbg: none; /* 背景影色 */
  --CautTxtS-txt: #444444; /* テキスト色 */
}
/* ** alert0201 end ** */

/* ** alert0202 start ** */
/*** 0202: 入力フォーム個別エラー ***/
:root {
  --err-bg: #fff4ab; /* 背景色 */
  --err-brd: 1px solid #e00012; /* ボーダー指定 */
  --err-bbg: none; /* 背景影色 */
  --err-txt: #e00012; /* テキスト色 */
}
/* ** alert0202 end ** */

/****************** アラート系共通（申し込み画面での注意書きエリア） ******************/

/* ** alert_basic03 start ** */
/*** 共通設定 ***/
:root {
/* 共通 */
  --CautOrd-mg: 1.0em auto; /* マージン */
  --CautOrd-rod: 0.2em; /* 角丸 */
  --CautOrd-pd: 2.0rem 1.5rem; /* パディング */
  --font-ord-art: clamp(1.6rem, 1.6vw, 1.6rem); /* フォントサイズ */
}
@media screen and (max-width: 600px) {
	:root {
		--CautOrd-pd: 1.5rem 1.0rem; /* パディング */
	}
}
/* ** alert_basic03 end ** */

/* ** alert0301 start ** */
/*** 0301: 空き・在庫余裕あり ***/
:root {
  --empty-bg: #e3ffcd; /* 背景色 */
  --empty-brd: 1px solid #10a800; /* ボーダー指定 */
  --empty-bbg: none; /* 背景影色 */
  --empty-txt: #10a800; /* テキスト色 */
}
/* ** alert0301 end ** */

/* ** alert0302 start ** */
/*** 0302: 残席・在庫僅か ***/
:root {
  --little-bg: #fffbcb; /* 背景色 */
  --little-brd: 1px solid #c71a1a; /* ボーダー指定 */
  --little-bbg: none; /* 背景影色 */
  --little-txt: #c71a1a; /* テキスト色 */
}
/* ** alert0302 end ** */

/* ** alert0303 start ** */
/*** 0303: 残席・在庫ありません ***/
:root {
  --can-bg: #d5f0f4; /* 背景色 */
  --can-brd: 1px solid #008abd; /* ボーダー指定 */
  --can-bbg: none; /* 背景影色 */
  --can-txt: #008abd; /* テキスト色 */
}
/* ** alert0303 end ** */

/* ** alert0304 start ** */
/*** 0304: 受付・購入売り切れ ***/
:root {
  --sout-bg: #ffe5e5; /* 背景色 */
  --sout-brd: 1px solid #c71a1a; /* ボーダー指定 */
  --sout-bbg: none; /* 背景影色 */
  --sout-txt: #c71a1a; /* テキスト色 */
}
/* ** alert0304 end ** */

/* ** alert0305 start ** */
/*** 0305: 受付・購入終了 ***/
:root {
  --ordthk-bg: #fffdea; /* 背景色 */
  --ordthk-brd: 1px solid #e06900; /* ボーダー指定 */
  --ordthk-bbg: none; /* 背景影色 */
  --ordthk-txt: #e06900; /* テキスト色 */
}
/* ** alert0305 end ** */

/* ** alert0306 start ** */
/*** 0306: 受付・購入できない ***/
:root {
  --ordno-bg: #fffdea; /* 背景色 */
  --ordno-brd: 1px solid #e06900; /* ボーダー指定 */
  --ordno-bbg: none; /* 背景影色 */
  --ordno-txt: #e06900; /* テキスト色 */
}
/* ** alert0306 end ** */

/* ** alert0307 start ** */
/*** 0307: 既に申込み・購入されている ***/
:root {
  --done-bg: #ffe5e5; /* 背景色 */
  --done-brd: 1px solid #c71a1a; /* ボーダー指定 */
  --done-bbg: none; /* 背景影色 */
  --done-txt: #c71a1a; /* テキスト色 */
}
/* ** alert0307 end ** */

/* ** alert0308 start ** */
/*** 0308: 他の時間帯で既に申し込みされている ***/
:root {
  --otdone-bg: #ffe5e5; /* 背景色 */
  --otdone-brd: 1px solid #c71a1a; /* ボーダー指定 */
  --otdone-bbg: none; /* 背景影色 */
  --otdone-txt: #c71a1a; /* テキスト色 */
}
/* ** alert0308 end ** */

/* ** alert0309 start ** */
/*** 0309: 会員登録訴求枠 ***/
:root {
  --ordartreg-bg: #f3f3f3; /* 背景色 */
  --ordartreg-brd: 1px solid #999; /* ボーダー指定 */
  --ordartreg-bbg: none; /* 背景影色 */
  --ordartreg-txt: #333; /* テキスト色 */
}
/* ** alert0309 end ** */