@charset "UTF-8";
/***** 共通CSS部 *****/
/***** タイトルパーツ *****/
/* ページ内エラーメッセージボックス */
/* マイページプロフィール表示テーブル */
/* 入力用モーダルエラー表示 */
/* デバイス種別フラグ */
.header_cont, .p_ber, .q_box, .q_title, .q_input {
  display: -webkit-flexbox;
  display: -moz-flexbox;
  display: -moz-flex;
  display: flex;
}

/*** 廃止されたalign属性の代わりにブロック要素を中央寄席する為 ***/
.page_frame, .page_title, .q_group_title, .q_box {
  display: inline-block;
}

/***** 全体のレイアウト ******/
html, body, form, table {
  font-size: 14px;
  font-family: "游ゴシック", "Yu Gothic", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

body {
  margin: 3px;
}

/***** 文字関連 *****/
.font_s {
  font-size: 14px;
}

.font_ss {
  font-size: 11px;
}

.falabel {
  font-size: 1rem;
}

.red {
  color: #FF3300;
}

input[type=checkbox]:not(:checked) + label, input[type=checkbox]:checked + label {
  color: #444 !important;
}
input[type=radio]:not(:checked) + label, input[type=radio]:checked + label {
  color: #444 !important;
}
input[type=number] + label.falabel, input[type=text] + label.falabel {
  color: #444 !important;
}

/***** ヘッダー *****/
.header {
  width: 100%;
  background: #283593;
  color: #ffffff;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.header_cont {
  width: 100%;
  flex-flow: row wrap;
  justify-content: space-around;
  align-items: baseline;
}

.logout {
  flex-basis: 20%;
  text-align: right;
  padding: 3px;
}

/***** エラーメッセージボックス *****/
div .error-message {
  /* font-size: large; */
  font-weight: bold;
  color: crimson;
  background-color: #f3b49b;
  padding-top: 0px;
  padding-bottom: 0px;
  margin-top: 5px;
  text-align: left;
  width: 70%;
}

div .info-message {
  /* font-size: large; */
  font-weight: bold;
  color: white;
  background-color: green;
  padding-top: 0px;
  padding-bottom: 0px;
  margin-top: 5px;
  width: 90%;
}

ul.errlist {
  width: 100%;
}
ul.errlist li {
  padding-left: 0%;
}

/***** プログレスバー（進捗状況） *****/
/* PC用 */
.p_ber {
  flex-flow: row wrap;
  align-items: baseline;
  justify-content: space-around;
  flex-basis: 75%;
  margin-bottom: 10px;
}
.p_ber .col1 {
  flex-basis: 40%;
}
.p_ber .col2 {
  flex-basis: 13%;
  padding: 3px;
}
.p_ber .col3 {
  flex-basis: 15%;
  padding: 3px;
}
.p_ber .col4 {
  flex-basis: 15%;
  padding: 3px;
  font-size: 0.9rem;
}
.p_ber .text_left {
  text-align: left;
}
.p_ber .text_right {
  text-align: right;
}

.p_ber0 {
  flex-basis: 100%;
  height: 100%;
  font-size: 1px;
  border: 2px solid #fff;
  text-align: left;
  padding: 1px;
}

.p_ber1 {
  height: 8px;
  background-color: #ffffff;
}

/***** タイトル *****/
.top_d {
  font-size: 22px;
  font-weight: bold;
  margin-top: 10px;
  padding: 5px;
  flex-basis: 100%;
}

/* 多分いらない */
div.nav-wrapper {
  height: 50px;
}

/***** 入力パーツの調整 *****/
/* PC用 */
input[type=checkbox]:not(:checked).matrix_check, input[type=checkbox]:checked.matrix_check {
  font-size: 0.8rem;
}
input[type=radio]:not(:checked).matrix_check, input[type=radio]:checked.matrix_check {
  font-size: 0.8rem;
}
input[type=radio]:not(:checked) + label.matrix_label, input[type=radio]:checked + label.matrix_label {
  padding-left: 30px;
}

/***** ページ *****/
.page_frame {
  box-sizing: content-box;
  width: 98vw;
}

/* PC用 */
.page_title {
  flex-flow: row;
  flex-basis: 100%;
  border-top: solid 5px #ff7d6e;
  border-bottom: solid 5px #ff7d6e;
  border-radius: 10px;
  width: 96%;
  background: #faa;
  color: #000;
  font-size: 20px;
  padding: 0.5%;
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.22);
  margin-bottom: 15px;
  margin-left: 2%;
  margin-right: 2%;
  /*
  flex-flow: row wrap;
  border: 1px solid;
  */
}

/***** グループタイトル *****/
/* PC用 */
.q_group_title {
  flex-flow: row;
  flex-basis: 100%;
  border-radius: 10px;
  width: 94%;
  background: #fad;
  color: #000;
  font-size: 19px;
  padding: 0.6%;
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.22);
  margin-bottom: 10px;
  margin-left: 3%;
  margin-right: 3%;
  /*
  border: 1px solid darkolivegreen;
  */
}

.q_group {
  width: 96%;
  padding-left: 3%;
  padding-right: 2%;
}

/***** 設問 *****/
/* PC用 */
.q_box {
  margin-bottom: 10px;
  padding-bottom: 5px;
  flex-flow: row wrap;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
  border-radius: 10px;
  width: inherit;
}

.q_title {
  flex-flow: row;
  flex-basis: 100%;
  border-radius: 10px;
  background: #ddd;
  color: #000;
  font-size: 18px;
  padding: 5px;
}

.q_num {
  flex-basis: 10%;
}

.q_str {
  flex-basis: 85%;
  text-align: left;
}

.q_input {
  flex-flow: row wrap;
  flex-basis: 100%;
  font-size: 18px;
  /*padding: 5px;*/
  padding-top: 5px;
  justify-content: space-around;
}
.q_input .col0, .q_input .col1, .q_input .col2, .q_input .col3 {
  text-align: left;
}
.q_input .col0 {
  flex-basis: 10%;
}
.q_input .col1 {
  flex-basis: 88%;
}
.q_input .col2 {
  /*1行2列*/
  flex-basis: 43%;
}
.q_input .col3 {
  /*1行3列*/
  flex-basis: 28%;
}

/***** マトリクス関連書式 *****/
/* 微調整が多いので、全体で分岐 */
/* PC用 */
.matrix_title {
  flex-flow: row;
  flex-basis: 100%;
  background: #dce;
  margin-top: 5px;
  margin-left: 2%;
  margin-right: 2%;
  color: #000;
  font-size: 18px;
  padding: 1%;
}

th.matrix_col {
  padding: 3px 3px;
  text-align: center;
  border: 1px solid;
  background-color: #DDA;
}
th.matrix_row_head {
  padding: 3px 3px;
  width: 20%;
  border: 1px solid;
  background-color: #DDA;
}

td.matrix_col {
  padding: 3px 3px;
  vertical-align: middle;
  border: 1px solid;
}

div.matrix {
  margin-left: 2%;
  margin-right: 2%;
}

.matrix_head, .matrix_row {
  vertical-align: middle;
  border: 1px solid;
}

.matrix_col {
  border: 1px solid;
}

/*iPhoneのズームアップ対策*/
/*****ボタン *****/
/* PC用 */
input[type=button], input[type=submit] {
  background-color: #283593;
  color: #ffffff;
  border-style: none;
  border-radius: 5px;
  /*box-shadow: 0px 2px 4px gray;*/
  /*font-family: "FontAwesome";*/
  /*font-size: 16px;*/
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 5px;
  padding-right: 5px;
  width: 115px;
}
input[name=btn_out] {
  background-color: #ffffff;
  color: #283593;
}
input[type=button]:hover, input[type=submit]:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -moz-opacity: 0.5;
}
input[type=date] {
  width: 160px;
}
input[type=month] {
  width: 140px;
}
input[class=m_text] {
  width: 50%;
}

/***** 謎の調整 *****/
/***** フッター *****/
.btn_footer {
  margin-top: 30px;
  margin-bottom: 20px;
}

/***** 汎用的な枠 *****/
/* PC用 */
.box {
  /*width: 750px;*/
  width: 100%;
  margin: auto;
}

.box_border {
  /*width: 750px;*/
  width: 100%;
  margin: auto;
  /*太枠・文字強調あり*/
  border: 2px solid #000000;
  font-weight: bold;
  padding-top: 5px;
  padding-bottom: 5px;
}

/**** エラー時の背景色 ****/
.error {
  background-color: #f47442;
}

/***** スマホ用全体調整 *****/
/*** ログインID表示フォント ***/
.login_box {
  padding-bottom: 10px;
  flex-flow: row wrap;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
  border-radius: 10px;
  margin-bottom: 30px;
  /* 入力ボックスの左右マージン */
  margin-left: 10%;
  margin-right: 10%;
}
.login_box label {
  font-size: 15px;
}
.login_box input[id=login_id][type=text][name=login_id], .login_box input[id=passwd][type=password][name=passwd] {
  font-size: x-large !important;
  width: 100%;
}
.login_box input[type=submit] {
  /* 言語によってセンテンスの幅が異なる為 */
  width: -moz-fit-content;
  width: fit-content;
  margin-top: 3%;
}

/* 設問制御対象のタイトル透過指定 */
.enable_qtitle {
  opacity: 1;
}

.disable_qtitle {
  opacity: 0.3;
}

/* テキスト系INPUTの縦幅調整 materialize 2.0対応 */
div.q_input input[type=text], div.q_input input[type=number], div.q_input input[type=month], div.q_input input[type=date], div.q_input input[type=time] {
  height: auto;
  margin-bottom: 1px;
}

div.login_box input[type=text], div.login_box input[type=password] {
  height: 100%;
}

/* 無効状態のチェックボックス */
/* 普通に指定してもダメで一度appearance: none;で無効化必要があるのでやめた */
/* プレースホルダのフォント色設定 */
input:enabled::-moz-placeholder, textarea:enabled::-moz-placeholder {
  color: rgb(153, 153, 153);
}
input:enabled::placeholder, textarea:enabled::placeholder {
  color: rgb(153, 153, 153);
}

input:disabled::-moz-placeholder, textarea:disabled::-moz-placeholder {
  color: #ccc;
}

input:disabled::placeholder, textarea:disabled::placeholder {
  color: #ccc;
}

/*四角いテキストボックス*/
input[type=text].bordertext {
  border: 1px solid #ccc;
  font-size: 12px;
  height: 2rem;
  padding-left: 1rem;
  margin-left: 1rem;
}

input[type=number].bordertext {
  border: 1px solid #ccc;
  font-size: 12px;
  height: 2rem;
  padding-left: 1rem;
  margin-left: 1rem;
}

label {
  margin-left: 1rem;
  color: #696969;
}

input.text:focus:not([readonly]) {
  border-bottom: 1px solid #ccc;
  box-shadow: none;
  height: 2rem;
}

/* 図の枠線 効果がないので直で埋めこんんだ*/
img.imgborder {
  border: 1px solid #ccc;
}

/*エラー*/
.err {
  background-color: #f4511e !important;
}

/* INPUT系の横幅 */
div.q_input input[type=month], div.q_input input[type=date] {
  width: 35%;
}
div.q_input input[type=time] {
  width: 25%;
}
div.q_input input[type=text], div.q_input input[type=number].w1 {
  width: 10%;
}
div.q_input input[type=text], div.q_input input[type=number].w2 {
  width: 20%;
}
div.q_input input[type=text], div.q_input input[type=number].w3 {
  width: 30%;
}
div.q_input input[type=text], div.q_input input[type=number].w4 {
  width: 40%;
}
div.q_input input[type=text].w5 {
  width: 50%;
}
div.q_input input[type=text].w6 {
  width: 60%;
}
div.q_input input[type=text].w7 {
  width: 70%;
}
div.q_input input[type=text].w8 {
  width: 80%;
}
div.q_input input[type=text].w9 {
  width: 90%;
}
div.q_input input[type=text].w10 {
  width: 100%;
}/*# sourceMappingURL=rs_style.css.map */