@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;
}

/* リンク スマホ用調整 */
a:link {
  color: #0099cc;
}
a:visited {
  color: #0066cc;
}
a:hover {
  color: #3333ff;
}
a:active {
  color: #0033ff;
}

/***** ヘッダー *****/
.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: 90%;
}

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%;
}

/***** プログレスバー（進捗状況） *****/
/* スマホ用 */
.p_ber {
  flex-flow: row;
  width: 100%;
  justify-content: space-around;
  margin-bottom: 10px;
}
.p_ber .col1 {
  flex-basis: 0;
}
.p_ber .col2, .p_ber .col3, .p_ber .col4 {
  flex-basis: 30%;
}
.p_ber .text_left {
  text-align: left;
}
.p_ber .text_right {
  text-align: right;
}

.p_ber0 {
  width: 100px;
  height: 8px;
  font-size: 1px;
  border: 2px solid #ffffff;
  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%;
}

/* 多分いらない */
nav .nav-extended {
  height: 30px !important;
}

/***** 入力パーツの調整 *****/
/* スマホ用 */
input[type=checkbox]:not(:checked).matrix_check, input[type=checkbox]:checked.matrix_check {
  margin-left: auto;
  margin-right: auto;
  font-size: 0.6rem;
}
input[type=radio]:not(:checked).matrix_check, input[type=radio]:checked.matrix_check {
  margin-left: auto;
  margin-right: auto;
  font-size: 0.6rem;
}
input[type=checkbox]:not(:checked) + label.matrix_label, input[type=checkbox]:checked + label.matrix_label {
  padding-left: 25px;
  font-size: 0.7rem;
}
input[type=radio]:not(:checked) + label.matrix_label, input[type=radio]:checked + label.matrix_label {
  padding-left: 25px;
  font-size: 0.7rem;
}

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

/* スマホ用 */
.page_title {
  flex-flow: row;
  flex-basis: 100%;
  border-top: solid 5px #ff7d6e;
  border-bottom: solid 5px #ff7d6e;
  border-radius: 10px;
  width: 98%;
  background: #faa;
  color: #000;
  font-size: 18px;
  padding: 1%;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
  margin-bottom: 5px;
  margin-left: 1%;
  margin-right: 1%;
  /*
  border: 1px solid;
  */
}

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

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

/***** 設問 *****/
/* スマホ用 */
.q_box {
  margin-bottom: 5px;
  padding-bottom: 5px;
  flex-flow: row nowrap;
  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: 16px;
  padding: 5px;
}

.q_num {
  flex-basis: 13%;
  padding-right: 3px;
}

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

.q_input {
  flex-flow: column;
  flex-basis: 100%;
  font-size: 15px;
  /*padding: 5px; */
}
.q_input .col0 {
  flex-basis: 10%;
  text-align: left;
}
.q_input .col1, .q_input .col2, .q_input .col3 {
  text-align: left;
  padding: 3px;
}

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

th.matrix_col {
  padding: 3px 3px;
  text-align: center;
  font-size: 0.6rem;
  border: 1px solid;
  background-color: #DDA;
}
th.matrix_row_head {
  padding: 3px 3px;
  font-size: 0.6rem;
  border: 1px solid;
  background-color: #DDA;
}

td.matrix_col {
  padding: 0px 0px;
  font-size: 0.5rem;
  vertical-align: middle;
  border: 1px solid;
}

div.matrix {
  margin-left: auto;
  margin-right: auto;
}

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

.matrix_col {
  border: 1px solid;
}

/*iPhoneのズームアップ対策*/
input[type=number] {
  font-size: 16px !important;
  transform: scale(0.8) !important;
}
input[type=text], input[type=password] {
  font-size: 16px !important;
  transform: scale(0.8) !important;
}
input[type=text]:not(.browser-default), input[type=password]:not(.browser-default) {
  font-size: 16px !important;
  transform: scale(0.8) !important;
}

/*****ボタン *****/
/* スマホ用 */
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: 10px;
  width: 110px;
}
input[name=btn_out] {
  background-color: #ffffff;
  color: #283593;
  font-size: 12px;
  width: 80px;
  padding: 3px;
}
input[type=button]:hover, input[type=submit]:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -moz-opacity: 0.5;
}
input[type=date] {
  width: 130px;
}
input[type=month] {
  width: 105px;
}

/***** 謎の調整 *****/
select, textarea {
  font-size: 16px !important;
  transform: scale(0.8) !important;
}

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

/***** 汎用的な枠 *****/
/* スマホ用 */
.box {
  width: 97%;
  margin: auto;
}

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

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

/***** スマホ用全体調整 *****/
* {
  box-sizing: unset;
}
*:before, *:after {
  box-sizing: unset;
}

/*** ログイン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: 5%;
  margin-right: 5%;
}
.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: 100%;
}

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, div.q_input input[type=text].w6, div.q_input input[type=text].w7, div.q_input input[type=text].w8, div.q_input input[type=text].w9, div.q_input input[type=text].w10 {
  width: 70%;
}
div.q_input input[type=number].w5, div.q_input input[type=number].w6, div.q_input input[type=number].w7, div.q_input input[type=number].w8, div.q_input input[type=number].w9, div.q_input input[type=number].w10 {
  width: 60%;
}/*# sourceMappingURL=rs_style_sp.css.map */