@charset "UTF-8";
/* line 2, ../sass/basic.scss */
header {
  background-color: aquamarine;
}
/* line 3, ../sass/basic.scss */
header ul {
  display: flex;
  list-style: none;
}
/* line 6, ../sass/basic.scss */
header ul li {
  margin: 0 10px;
}

@media screen and (max-width: 768px) {
  /* line 14, ../sass/basic.scss */
  .narrow_hidden {
    display: none !important;
  }
}
/* line 19, ../sass/basic.scss */
body {
  font-family: 'メイリオ', 'Meiryo', '游ゴシック Medium',sans-serif;
}

/* line 24, ../sass/basic.scss */
input[type="button"],
button,
select {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
  color: #000;
}

/* line 35, ../sass/basic.scss */
input[type="button"],
button,
select {
  background: #efefef;
  border: 1px solid #333;
  border-radius: 4px;
  padding: 4px 8px;
  line-height: 1.5rem;
}

/* line 45, ../sass/basic.scss */
select {
  line-height: 2;
  color: #333;
  box-shadow: none;
  padding: 0 24px 0 8px;
  background: #fff url(../images/icon/shita_yajirushi.svg) no-repeat right 5px top 55%;
  background-size: 16px 16px;
  cursor: pointer;
}

/* line 55, ../sass/basic.scss */
.vertical {
  display: flex;
  flex-flow: column;
  justify-content: start;
}

/* line 62, ../sass/basic.scss */
.horizontal {
  display: flex;
  justify-content: start;
}

/* line 66, ../sass/basic.scss */
.horizontal.wrap {
  flex-wrap: wrap;
}

/* line 69, ../sass/basic.scss */
.horizontal.center {
  justify-content: center;
}

/* line 73, ../sass/basic.scss */
.hidden {
  display: none !important;
}

/* line 76, ../sass/basic.scss */
.visibility_hidden {
  visibility: hidden;
}

/* line 80, ../sass/basic.scss */
body {
  color: black;
  width: 80%;
  margin: auto;
  font-size: small;
}

/* line 88, ../sass/basic.scss */
html {
  touch-action: manipulation;
}

/* line 92, ../sass/basic.scss */
.svg_icon {
  width: 1.5em;
}

/* line 97, ../sass/basic.scss */
details summary {
  cursor: pointer;
}

/* line 102, ../sass/basic.scss */
input[type="button"] {
  -webkit-appearance: none;
}

/* line 106, ../sass/basic.scss */
a[target="_blank"]::after {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: -3px 0 0 5px;
  background: url(../images/icon/external-link.svg) no-repeat;
  background-size: contain;
  vertical-align: middle;
}

/* line 117, ../sass/basic.scss */
h3:before {
  content: '★';
}

/* line 121, ../sass/basic.scss */
input[type="search"], input[type="number"] {
  border: 2px solid #aaa;
  border-radius: 4px;
  margin: 8px 0;
  outline: none;
  padding: 8px;
  box-sizing: border-box;
  transition: 0.3s;
}

/* line 132, ../sass/basic.scss */
input[type="search"] {
  width: 80%;
  -webkit-appearance: searchfield;
}

/* line 136, ../sass/basic.scss */
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: searchfield-cancel-button;
}

/* line 140, ../sass/basic.scss */
input[type="number"] {
  width: 100px;
  text-align: right;
}

/* line 144, ../sass/basic.scss */
input[type="number"].deck_count {
  width: 50px;
}

/* line 147, ../sass/basic.scss */
input[type="search"]:focus, input[type="number"]:focus {
  border-color: skyblue;
  box-shadow: 0 0 8px 0 skyblue;
}

/* line 152, ../sass/basic.scss */
.selectbox {
  display: inline-flex;
  align-items: center;
  position: relative;
  margin: 0 0 20px 0;
}

/* line 159, ../sass/basic.scss */
.selectbox::after {
  position: absolute;
  right: 15px;
  width: 10px;
  height: 7px;
  background-color: #535353;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: '';
  pointer-events: none;
}

/* line 170, ../sass/basic.scss */
.selectbox select {
  appearance: none;
  min-width: 230px;
  height: 2.8em;
  padding: 0.4em calc(.8em + 30px) 0.4em 0.8em;
  border: 1px solid #cccccc;
  border-radius: 3px;
  background-color: #fff;
  color: #333333;
  font-size: 1em;
  cursor: pointer;
}

/* line 184, ../sass/basic.scss */
th.w30, td.w30 {
  width: 30px;
  text-align: center;
}

/* line 188, ../sass/basic.scss */
th.w100, td.w100 {
  width: 100px;
  text-align: center;
}

/* line 192, ../sass/basic.scss */
th.w200, td.w200 {
  width: 200px;
  text-align: left;
}

/* line 196, ../sass/basic.scss */
table.even {
  background-color: lemonchiffon;
}

/* line 199, ../sass/basic.scss */
table.odd {
  background-color: skyblue;
}

/* ▼入力チェック結果の表示ボックスの装飾 */
/* line 204, ../sass/basic.scss */
.alertarea {
  color: red;
  /* 文字色(赤色) */
  background-color: #fee;
  /* 背景色(淡い赤色) */
  /*background-image: url("alerticon.png");  背景画像(警告アイコンを表示) 
  background-repeat: no-repeat;            背景画像の繰り返しをナシに 
  background-position: 0.35em center;      背景画像の掲載位置(左端から0.35em・上下方向の中央) */
  display: inline-block;
  /* インラインブロック化 */
  border-radius: 0.5em;
  /* 角丸(半径0.5文字分) */
  margin-left: 5.5em;
  /* 外側左端の余白(0.5文字分) */
}

/* ▼入力チェック結果でエラーがない場合は非表示にする */
/* line 216, ../sass/basic.scss */
.alertarea:empty {
  display: none;
}

/* line 219, ../sass/basic.scss */
.answer_row {
  display: grid;
  margin: 5px 0;
  gap: 2px;
  grid-template-rows: auto auto;
  grid-template-columns: 20% 20% 20% 20% 20%;
  grid-template-areas: "category_name category_name total total total" "juyodo1 juyodo2 juyodo3 juyodo4 juyodo5";
}
/* line 228, ../sass/basic.scss */
.answer_row .category_name {
  grid-area: category_name;
}
/* line 231, ../sass/basic.scss */
.answer_row .total {
  grid-area: total;
}
/* line 234, ../sass/basic.scss */
.answer_row .juyodo1 {
  grid-area: juyodo1;
}
/* line 237, ../sass/basic.scss */
.answer_row .juyodo2 {
  grid-area: juyodo2;
}
/* line 240, ../sass/basic.scss */
.answer_row .juyodo3 {
  grid-area: juyodo3;
}
/* line 243, ../sass/basic.scss */
.answer_row .juyodo4 {
  grid-area: juyodo4;
}
/* line 246, ../sass/basic.scss */
.answer_row .juyodo5 {
  grid-area: juyodo5;
}
/* line 250, ../sass/basic.scss */
.answer_row .even {
  background-color: lemonchiffon;
}
/* line 253, ../sass/basic.scss */
.answer_row .odd {
  background-color: skyblue;
}

@media screen and (max-width: 768px) {
  /* line 260, ../sass/basic.scss */
  .narrow_hidden {
    display: none;
  }

  /* line 263, ../sass/basic.scss */
  .answer_row {
    grid-template-columns: 100%;
    grid-template-areas: "category_name" "total" "juyodo1" "juyodo2" "juyodo3" "juyodo4" "juyodo5";
  }
  /* line 274, ../sass/basic.scss */
  .answer_row .total::before {
    content: '総合';
  }
  /* line 277, ../sass/basic.scss */
  .answer_row .juyodo1::before {
    content: '★1';
  }
  /* line 280, ../sass/basic.scss */
  .answer_row .juyodo2::before {
    content: '★2';
  }
  /* line 283, ../sass/basic.scss */
  .answer_row .juyodo3::before {
    content: '★3';
  }
  /* line 286, ../sass/basic.scss */
  .answer_row .juyodo4::before {
    content: '★4';
  }
  /* line 289, ../sass/basic.scss */
  .answer_row .juyodo5::before {
    content: '★5';
  }
}
