/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

* {
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
  width: 100%;
  height: 100%;
}

body {
  width: 100%;
  min-height: 100%;
  color: #333;
  font-size: 16px;
  font-family: "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo;
  text-align: justify;
  line-height: 1.25;
}

img,
svg {
  display: block;
  max-width: 100%;
  max-height: 100%;
  height: auto;
}

h1 {
  margin: 4rem 0 1.5rem;
  font-size: 2rem;
  font-weight: bold;
}

h2 {
  margin: 3rem 0 1rem;
  padding: 0.5rem;
  font-size: 1.5rem;
  border-left: solid 10px #ffdea5;
  border-bottom: solid 5px #ffdea5;
}

h3 {
  margin: 2rem 0 0.75rem;
  font-size: 1.25rem;
  font-weight: normal;
  text-decoration: underline;
  text-decoration-color: black;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.25rem;
}

h4 {
  margin: 1.5rem 0 0.75rem;
  padding: 0.25rem 0.5rem;
  font-size: 1.1rem;
  font-weight: normal;
  background: lightgray;
}

h5 {
  margin: 1.25rem 0 0.5rem;
  font-size: 1rem;
  font-weight: bold;
}

h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {
  margin-top: 0;
}

a {
  text-decoration: none;
}
a a:visited {
  color: #333;
}
a.icon:before {
  content: "";
  display: inline-block;
  height: 1em;
  width: 1em;
  margin: 0 0.5rem;
  background: transparent;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  line-height: 1em;
  vertical-align: middle;
}
a.icon[href$=".pdf"]:before {
  background-image: url(/assets/icon/file_pdf-8859296de61661ca985c051706c17122fd53c43a9a2dc5c08c5d239a4af00ea9.png);
}

p {
  word-break: break-all;
}
p:not(:last-child) {
  margin-bottom: 1rem;
}
p a {
  text-decoration: underline;
}

small {
  font-size: smaller;
}

ul, ol {
  margin: 2rem 0 2rem 2rem;
}
ul li:not(:last-child), ol li:not(:last-child) {
  margin-bottom: 0.5rem;
}

table {
  margin: 1rem 0;
}
table th, table td {
  padding: 0.25rem 0.5rem;
}
table th > img, table td > img {
  display: inline-block;
  vertical-align: middle;
}
table th > ul, table th > ol, table td > ul, table td > ol {
  margin: 0 0 0 2rem;
}
table th > ul:not(:last-child), table th > ol:not(:last-child), table td > ul:not(:last-child), table td > ol:not(:last-child) {
  margin-top: 1.5rem;
}
table th .actions, table td .actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

progress {
  width: 100px;
}

main {
  background: #fefefe;
}
main header.title {
  width: 100%;
  margin-bottom: 2rem;
}
main header.title h1 {
  margin: 0;
  padding: 0.75rem 1rem;
  background: #ccc;
  font-size: 0.8rem;
  font-weight: normal;
  text-align: center;
}
main > section {
  width: 100%;
  max-width: 1280px;
  margin: 2rem auto;
  padding: 1rem 2rem;
}
main > section:first-child {
  margin-top: 0;
}
@media (max-width: 425px) {
  main > section {
    padding: 1rem;
  }
}

hr {
  width: calc(100% - 2rem);
  max-width: 1280px;
  margin: 2rem auto;
}
hr.dotted {
  border-top: dotted 8px #ccc;
}

div#flash_container div#flash {
  max-width: 80%;
  overflow: hidden;
  border-radius: 10px;
  position: fixed;
  top: 50px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 99;
}
@media print {
  div#flash_container div#flash {
    display: none;
  }
}
div#flash_container div#flash .flash_type {
  padding: 1rem 1.5rem;
  border-radius: 1rem;
}
div#flash_container div#flash .flash_type-notice {
  background-color: #ddf0e4;
}
div#flash_container div#flash .flash_type-alert {
  background-color: #ffeeee;
}
div#flash_container div#flash .flash_type:not(:last-child) {
  margin-bottom: 0.5rem;
}
div#flash_container div#flash .flash_type p {
  margin: 0;
}
div#flash_container div#flash .flash_type p:not(:last-child) {
  margin-bottom: 1rem;
}

header#site_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
  width: 100%;
  padding: 1rem 1rem;
  background: #333;
}
@media print {
  header#site_header {
    display: none;
  }
}
@media (max-width: 767px) {
  header#site_header {
    flex-direction: column;
    align-items: flex-end;
  }
}
header#site_header #site_logo {
  display: flex;
  align-items: center;
  gap: 1rem;
  text-decoration: none;
}
@media (max-width: 767px) {
  header#site_header #site_logo {
    align-self: flex-start;
  }
}
header#site_header #site_logo img {
  width: 50px;
}
header#site_header #site_logo h1 {
  margin: 0;
  color: white;
  font-size: 1.8rem;
  font-weight: normal;
}
@media (max-width: 767px) {
  header#site_header #site_logo h1 {
    font-size: 1.4rem;
  }
}
header#site_header #header_actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 1rem;
}
header#site_header #header_actions p.user_info {
  margin: 0;
  color: white;
  font-size: 0.85rem;
  text-align: right;
}
@media (max-width: 767px) {
  header#site_header #header_actions p.user_info {
    order: 1;
    width: 100%;
  }
}
header#site_header #header_actions #sidebar-toggle {
  cursor: pointer;
  width: 50px;
  height: 50px;
  padding: 7.5px;
  border-radius: 10px;
  background: #edcc40;
}

footer#site_footer {
  width: 100%;
  margin-top: 2rem;
  padding: 1rem 1rem 2rem;
  background: #333;
}
footer#site_footer p {
  color: white;
  font-size: 0.5rem;
  text-align: center;
}

aside#sidebar {
  display: block;
  width: 200px;
  height: 100vh;
  background: #3c3c3c;
  position: fixed;
  top: 0;
  right: -100vw;
  z-index: 99;
  transition: all 0.3s;
}
aside#sidebar.active {
  right: 0;
}
@media print {
  aside#sidebar {
    display: none;
  }
}
aside#sidebar nav {
  height: 100%;
  background: #3c3c3c;
  overflow-y: scroll;
}
aside#sidebar nav ul li a, aside#sidebar nav ul li button, aside#sidebar nav > span {
  display: block;
  width: 100%;
  padding: 1rem 1.5rem;
  background: #3c3c3c;
  border: none;
  border-bottom: solid 1px white;
  color: white;
  font-size: 0.85rem;
  text-align: left;
  text-decoration: none;
  line-height: 1.25em;
}
aside#sidebar nav > span {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: #282828;
  font-size: 1rem;
}
aside#sidebar nav > span:before {
  content: "";
  display: block;
  flex-shrink: 0;
  width: 25px;
  height: 25px;
  background: url(/assets/icon/sidebar_menu-44d78dde3bf041eb1c5df442018f5d840a814781200d9d4b3ddc7309e3e78efa.png) no-repeat center;
  background-size: 25px 25px;
}
aside#sidebar nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
aside#sidebar nav ul li {
  margin: 0;
}
aside#sidebar nav ul li form {
  width: 100%;
}
aside#sidebar nav ul li a, aside#sidebar nav ul li button {
  padding-right: 2rem;
  position: relative;
  transition: all 0.1s;
}
aside#sidebar nav ul li a:after, aside#sidebar nav ul li button:after {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-top: solid 2px lightgray;
  border-right: solid 2px lightgray;
  position: absolute;
  top: 50%;
  right: 1rem;
  transform: translateY(-50%) rotate(45deg);
}
aside#sidebar nav ul li a:hover, aside#sidebar nav ul li button:hover {
  cursor: pointer;
  background: #636363;
}
aside#sidebar #cover {
  display: block;
  width: 0;
  height: 100vh;
  background: orange;
  opacity: 0.1;
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}
aside#sidebar.active #cover {
  width: 100vw;
}

form input[type=submit],
form input[type=reset], .btn_print, .btn, #comments_list article.comment form.comment_edit .actions > * {
  display: inline-block;
  padding: 0.5rem 1rem;
  color: #333;
  font-size: 0.85rem;
  font-weight: bold;
  text-align: center;
  line-height: normal;
  word-break: keep-all;
  background: #f6f6f6;
  border: solid 1px #c9c9c9;
  border-radius: 5px;
  transition: all 0.1s;
}
form input[type=submit]:hover,
form input[type=reset]:hover, .btn_print:hover, .btn:hover, #comments_list article.comment form.comment_edit .actions > :hover {
  cursor: pointer;
  background: #eee;
}
form input[type=submit]:disabled,
form input[type=reset]:disabled, .btn_print:disabled, .btn:disabled, #comments_list article.comment form.comment_edit .actions > :disabled {
  cursor: not-allowed;
  color: #c9c9c9 !important;
  background: #fafafa !important;
  border-color: #c9c9c9 !important;
}

.btn.w-100, #comments_list article.comment form.comment_edit .actions > .w-100 {
  width: 100%;
}
.btn.primary, #comments_list article.comment form.comment_edit .actions > .primary, .btn.yellow, #comments_list article.comment form.comment_edit .actions > .yellow {
  color: white;
  background: #ffa90a;
  border-color: #ffa90a;
}
.btn.primary:hover, #comments_list article.comment form.comment_edit .actions > .primary:hover, .btn.yellow:hover, #comments_list article.comment form.comment_edit .actions > .yellow:hover {
  background: #ffba3b;
  border-color: #ffba3b;
}
.btn.danger, #comments_list article.comment form.comment_edit .actions > .danger, .btn.red, #comments_list article.comment form.comment_edit .actions > .red {
  color: white;
  background: #dc3545;
  border-color: #dc3545;
}
.btn.danger:hover, #comments_list article.comment form.comment_edit .actions > .danger:hover, .btn.red:hover, #comments_list article.comment form.comment_edit .actions > .red:hover {
  background: #c22837;
  border-color: #c22837;
}
.btn.blue, #comments_list article.comment form.comment_edit .actions > .blue {
  color: white;
  background: #3f9ee0;
  border-color: #3f9ee0;
}
.btn.blue:hover, #comments_list article.comment form.comment_edit .actions > .blue:hover {
  background: #308ecf;
  border-color: #308ecf;
}

form.button_to {
  display: inline-block;
  width: auto;
  margin: 0;
}

.btn_light_blue {
  display: inline-block;
  margin-top: 1rem;
  padding: 0.25rem 0.5rem;
  color: #2bbbff;
  border: solid 1px #2bbbff;
  cursor: pointer;
}

.btn_print {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  padding-left: 0.5rem;
  color: white;
  background: #ffc22d;
  border-color: #ffc22d;
}
.btn_print:before {
  content: "";
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  background-image: url(/assets/icon/printer-b61bb6fd80a26bb46fbb99411c6f8bf789fe94ae55569a6ba01908e08751831b.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1em;
  background-color: #e2a91a;
  border-radius: 50%;
}
.btn_print:hover {
  background: #f5b333;
  border-color: #f5b333;
}
.btn_print:hover:before {
  background-color: #bd8e19;
}

form {
  width: 100%;
  margin: 1.5rem 0;
}
form label {
  display: inline-block;
}
form em, form i {
  font-size: 0.8rem;
}
form input[type=text],
form input[type=email],
form input[type=password],
form input[type=url],
form input[type=number],
form input[type=date],
form input[type=datetime-local],
form textarea {
  display: inline-block;
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: solid 1px #c9c9c9;
  border-radius: 5px;
}
form input[type=number],
form input[type=date],
form input[type=datetime-local] {
  width: auto;
}
form input[type=number].no_spin {
  -moz-appearance: textfield;
}
form input[type=number].no_spin::-webkit-outer-spin-button, form input[type=number].no_spin::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
form textarea {
  resize: vertical;
  min-height: 3em;
}
form select {
  display: inline-block;
  min-width: min-content;
  max-width: 100%;
  padding: 0.5rem 1rem 0.5rem 0.75rem;
  border: solid 1px #c9c9c9;
  border-radius: 5px;
}
form select:disabled {
  color: inherit;
  background-color: #c9c9c9;
}
@media (max-width: 425px) {
  form select {
    min-width: auto;
  }
}
form .date-range {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem;
}
form .date-range label {
  white-space: nowrap;
}
@media (max-width: 425px) {
  form .date-range {
    flex-direction: column;
    align-items: flex-start;
  }
  form .date-range input {
    margin-left: 1rem;
  }
  form .date-range span {
    align-self: center;
  }
}
form .checkboxes {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 1rem 1.5rem;
}
form .checkboxes_vertical {
  flex-direction: column;
}
form .checkboxes label {
  display: flex;
  align-items: baseline;
  margin: 0;
}
form .checkboxes label input[type=checkbox] {
  margin-right: 0.5rem;
}
form .checkboxes_grid {
  display: grid;
  grid-auto-columns: max-content;
  grid-template-columns: repeat(auto-fill, [col-start] minmax(8em, 1fr) [col-end]);
  gap: 0.5em 1.25em;
}
form .checkboxes_grid label {
  display: flex;
  align-items: baseline;
  margin: 0;
}
form .checkboxes_grid label input[type=checkbox] {
  margin-right: 0.5rem;
}
form .checkboxes_switch {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 0.25em;
}
form .checkboxes_switch input {
  display: none;
}
form .checkboxes_switch label {
  margin: 0;
  padding: 0.5em 1em;
  text-align: center;
  background: #f6f6f6;
  border: solid 1px #ddd;
  border-radius: 5px;
  transition: background 0.1s, color 0.1s;
  cursor: pointer;
}
form .checkboxes_switch label:hover {
  background: #ededed;
}
form .checkboxes_switch input:checked + label {
  color: white;
  background: #3592eb;
}
form .checkboxes_switch input:checked + label:hover {
  background: #3b8ad7;
}
form .checkboxes_image {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
form .checkboxes_image input {
  display: none;
}
form .checkboxes_image label {
  margin: 0;
  opacity: 0.3;
  cursor: pointer;
}
form .checkboxes_image input:checked + label {
  opacity: 1;
}
form ul.radio_buttons, form ul.radio_buttons-horizontal {
  list-style: none;
  display: inline-flex;
  flex-direction: column;
  align-items: baseline;
  gap: 0.5em;
  margin: 0;
}
form ul.radio_buttons li, form ul.radio_buttons-horizontal li {
  display: inline-flex;
  align-items: baseline;
  gap: 0.25em;
  margin: 0;
}
form ul.radio_buttons li .field_with_errors, form ul.radio_buttons-horizontal li .field_with_errors {
  width: auto;
}
form ul.radio_buttons li input[type=radio], form ul.radio_buttons-horizontal li input[type=radio] {
  margin: 0;
}
form ul.radio_buttons li label, form ul.radio_buttons-horizontal li label {
  margin: 0;
}
form ul.radio_buttons-horizontal {
  flex-direction: row;
}
form .field:not(:last-child) {
  margin-bottom: 1.25rem;
}
form .field label,
form .field input[type=text] {
  margin: 0.25em 0;
}
form table {
  margin: 0;
}
form table.fields {
  width: 100%;
}
form table.fields th, form table.fields td {
  padding: 0.75rem 1rem;
}
@media (max-width: 425px) {
  form table.fields th, form table.fields td {
    padding: 0;
  }
}
form table.fields th {
  width: 30%;
  font-weight: normal;
  vertical-align: top;
}
@media (max-width: 425px) {
  form table.fields th {
    width: auto;
  }
}
@media (max-width: 425px) {
  form table.fields tbody {
    display: grid;
    gap: 1rem;
  }
  form table.fields tr {
    display: grid;
    gap: 0.25rem;
  }
}
form .field_with_errors {
  display: inline-block;
  width: 100%;
}
form .field_with_errors input, form .field_with_errors textarea, form .field_with_errors select {
  border-color: red;
}
form ul.error_messages {
  margin: 0.25rem 0 0.25rem 2rem;
  color: red;
}
form input[type=submit],
form input[type=reset] {
  width: 100%;
  margin: 2rem 0;
}
form input[type=submit]:last-child,
form input[type=reset]:last-child {
  margin-bottom: 0;
}
form input[type=submit].yellow,
form input[type=reset].yellow {
  color: white;
  background: #ffd128;
  border-color: #bb9715;
}
form input[type=submit].green,
form input[type=reset].green {
  color: white;
  background: #2cad06;
  border-color: #258b07;
}

form.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  width: auto;
  margin: 0;
}
form.actions input[type=submit] {
  width: auto;
  margin: 0;
}

tr.search input,
tr.search select {
  margin: 0;
  vertical-align: middle;
}
tr.search input[type=submit] {
  padding: 0.5em 0.75em;
  font-size: 0.75rem;
}

.select-custom {
  display: inline-block;
  min-width: min-content;
  max-width: 100%;
  padding: 0 1rem;
  border: solid 1px #c9c9c9;
  border-radius: 5px;
  background-color: #fff;
  font-size: 0.85rem;
  cursor: pointer;
  height: 42px;
  box-sizing: border-box;
  vertical-align: bottom;
}
.select-custom:disabled {
  color: inherit;
  background-color: #c9c9c9;
}

.thumb_modal {
  position: relative;
}
.thumb_modal figure {
  width: 100%;
  height: 100%;
  position: relative;
}
.thumb_modal figure img.thumbnail {
  object-fit: contain;
  width: 100%;
  background: lightgray;
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.thumb_modal figure figcaption {
  display: none;
  width: 100%;
  height: 100%;
  padding: 1em 1em 50px;
  word-break: break-all;
  overflow: scroll;
  background: rgba(255, 255, 255, 0.8);
  position: absolute;
  top: 0;
  left: 0;
}
.thumb_modal figure figcaption.active {
  display: block;
}
.thumb_modal figure .alt {
  cursor: pointer;
  padding: 0.1em 0.75em;
  font-size: 0.5rem;
  color: white;
  border: solid 1px white;
  border-radius: 1em;
  background-color: rgba(30, 30, 30, 0.8);
  position: absolute;
  bottom: 10px;
  left: 10px;
  z-index: 20;
}
.thumb_modal figure .alt:before {
  content: "ALT";
}
.thumb_modal figure .modal-parts, .thumb_modal figure .modal-parts-br, .thumb_modal figure .modal-parts-open, .thumb_modal figure .modal-parts-bl, .thumb_modal figure .modal-parts-link, .thumb_modal figure .modal-parts-tr, .thumb_modal figure .modal-parts-tl, .thumb_modal figure .modal-parts-cropped {
  display: block;
  width: 40px;
  height: 40px;
  padding: 5px;
  background-color: rgba(255, 255, 255, 0.5);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 75%;
  border: solid 1px gray;
  position: absolute;
  cursor: pointer;
}
@media print {
  .thumb_modal figure .modal-parts, .thumb_modal figure .modal-parts-br, .thumb_modal figure .modal-parts-open, .thumb_modal figure .modal-parts-bl, .thumb_modal figure .modal-parts-link, .thumb_modal figure .modal-parts-tr, .thumb_modal figure .modal-parts-tl, .thumb_modal figure .modal-parts-cropped {
    display: none;
  }
}
.thumb_modal figure .modal-parts-tl, .thumb_modal figure .modal-parts-cropped {
  top: 3px;
  left: 3px;
}
.thumb_modal figure .modal-parts-tr {
  top: 3px;
  right: 3px;
}
.thumb_modal figure .modal-parts-bl, .thumb_modal figure .modal-parts-link {
  bottom: 3px;
  left: 3px;
}
.thumb_modal figure .modal-parts-br, .thumb_modal figure .modal-parts-open {
  bottom: 3px;
  right: 3px;
}
.thumb_modal figure .modal-parts-open {
  background-image: url(/assets/icon/modal_zoom-9da121a980a0d87557093dad9476996bfdde670a4304f8a804aba16a53f2e4ec.png);
}
.thumb_modal figure .modal-parts-link {
  background-image: url(/assets/icon/modal_show-daa01f6fbd7a7208006392a30c0adb30b5b475cf9a01d14e3468f0d8661efd3b.png);
}
.thumb_modal figure .modal-parts-cropped {
  background-image: url(/assets/icon/modal_cropped-65a5e83e6ef0873d378df33b9d94f9514b350d699407e9e13916b0a037be0c26.png);
}
.thumb_modal .modal-container {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 3rem;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.3);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  visibility: hidden;
  opacity: 0;
  transition: all 0.2s;
}
.thumb_modal .modal-container.active {
  visibility: visible;
  opacity: 1;
}
.thumb_modal .modal-container .modal-content {
  display: contents;
}
.thumb_modal .modal-container .modal-content img {
  margin: 0 auto;
}

.sortable-chosen .modal-container {
  display: none;
}

.rukumi-class label {
  display: inline-block;
  margin: 0.5rem 0 0.25rem;
}
.rukumi-class .checkboxes_switch input {
  display: none;
}
.rukumi-class .checkboxes_switch label {
  margin: 10px;
  padding: 0.5em 1em;
  text-align: center;
  background: #f6f6f6;
  border: solid 1px #ddd;
  border-radius: 5px;
  transition: background 0.1s, color 0.1s;
  cursor: pointer;
}
.rukumi-class .checkboxes_switch label:hover {
  background: #ededed;
}
.rukumi-class .checkboxes_switch input:checked + label {
  color: white;
  background: #3592eb;
}
.rukumi-class .checkboxes_switch input:checked + label:hover {
  background: #3b8ad7;
}

.rukumi-photo {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 2rem;
  margin: 0 0 1rem;
}
.rukumi-photo label {
  display: inline-block;
  margin: 0.5rem 0 0.25rem;
}
.rukumi-photo select {
  display: inline-block;
  min-width: 12rem;
  max-width: 80%;
  padding: 0.5rem 1rem 0.5rem 0.75rem;
  border: solid 1px #c9c9c9;
  border-radius: 5px;
  background-color: white;
}
.rukumi-photo select[multiple] {
  height: 2.5rem;
  max-width: 80%;
}
.rukumi-photo input[type=date] {
  padding: 0.5rem;
  border: 1px solid #c9c9c9;
  border-radius: 5px;
  width: auto;
}
.rukumi-photo .date-range {
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.rukumi-photo .date-range label {
  margin-right: 0.25rem;
}
.rukumi-photo .date-range span {
  display: inline-block;
  font-weight: bold;
  margin: 0 0.25rem;
}
@media (max-width: 425px) {
  .rukumi-photo .date-range {
    flex-direction: column;
    align-items: flex-start;
  }
  .rukumi-photo .date-range input {
    margin-left: 0;
  }
}
.rukumi-photo button {
  margin-right: 0.5rem;
  padding: 0.5rem 1rem;
  border: 1px solid;
  color: white;
  border-radius: 5px;
  cursor: pointer;
  transition: background 0.2s;
}

#rukumi_photo_button,
#ogamen_photo,
#rukumi_photo_search {
  display: inline-block;
  padding: 0.5rem 1rem;
  font-size: 0.85rem;
  max-width: 200px;
  color: #333;
  font-weight: bold;
  text-align: center;
  line-height: normal;
  word-break: keep-all;
  background: #f6f6f6;
  border: solid 1px #c9c9c9;
  border-radius: 5px;
  cursor: pointer;
}

#rukumi_photo_button:hover,
#ogamen_photo:hover,
#rukumi_photo_search:hover {
  background: #e0e0e0;
}

#rukumi_photo_button:active,
#ogamen_photo:active,
#rukumi_photo_search:active {
  background: #d0d0d0;
  transform: scale(0.98);
}

section.devise {
  max-width: 640px;
}
section.devise.sessions p.forgot_your_password a {
  font-weight: bold;
  text-decoration: none;
}
section.devise.sessions p.forgot_your_password a:visited {
  color: inherit;
}
section.devise.passwords form {
  margin-bottom: 3rem;
}
section.devise.registrations table.fields th {
  min-width: 12em;
}

.sortable-handle {
  display: inline-block;
  padding: 0.5rem;
  vertical-align: middle;
  background-image: url(/assets/icon/sortable-handle-783beccce51239034af7b4444c426f07ac8d5aff85f9b32aefd2526c4d79b83b.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
}

nav.pagy-nav {
  display: flex;
  justify-content: center;
  gap: 0.25rem;
  margin: 2rem 0;
}
nav.pagy-nav:last-child {
  margin-bottom: 0;
}
nav.pagy-nav span.page {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  min-width: 3em;
  color: #315D61;
  text-align: center;
  border: solid 1px #315D61;
}
nav.pagy-nav span.page a {
  display: block;
  width: 100%;
  padding: 0.5rem;
  color: #315D61;
}
nav.pagy-nav span.page a:hover {
  color: white;
  background: #8CABAD;
}
nav.pagy-nav span.page.gap, nav.pagy-nav span.page.active, nav.pagy-nav span.page.disabled {
  padding: 0.5rem;
}
nav.pagy-nav span.page.active {
  color: white;
  background: #315D61;
}

/*!
 * Cropper.js v1.5.13
 * https://fengyuanchen.github.io/cropperjs
 *
 * Copyright 2015-present Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2022-11-20T05:30:43.444Z
 */
.cropper-container {
  direction: ltr;
  font-size: 0;
  line-height: 0;
  position: relative;
  -ms-touch-action: none;
  touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.cropper-container img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: block;
  height: 100%;
  image-orientation: 0deg;
  max-height: none !important;
  max-width: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  width: 100%;
}

.cropper-wrap-box,
.cropper-canvas,
.cropper-drag-box,
.cropper-crop-box,
.cropper-modal {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.cropper-wrap-box,
.cropper-canvas {
  overflow: hidden;
}

.cropper-drag-box {
  background-color: #fff;
  opacity: 0;
}

.cropper-modal {
  background-color: #000;
  opacity: 0.5;
}

.cropper-view-box {
  display: block;
  height: 100%;
  outline: 1px solid #39f;
  outline-color: rgba(51, 153, 255, 0.75);
  overflow: hidden;
  width: 100%;
}

.cropper-dashed {
  border: 0 dashed #eee;
  display: block;
  opacity: 0.5;
  position: absolute;
}

.cropper-dashed.dashed-h {
  border-bottom-width: 1px;
  border-top-width: 1px;
  height: 33.3333333333%;
  left: 0;
  top: 33.3333333333%;
  width: 100%;
}

.cropper-dashed.dashed-v {
  border-left-width: 1px;
  border-right-width: 1px;
  height: 100%;
  left: 33.3333333333%;
  top: 0;
  width: 33.3333333333%;
}

.cropper-center {
  display: block;
  height: 0;
  left: 50%;
  opacity: 0.75;
  position: absolute;
  top: 50%;
  width: 0;
}

.cropper-center::before,
.cropper-center::after {
  background-color: #eee;
  content: " ";
  display: block;
  position: absolute;
}

.cropper-center::before {
  height: 1px;
  left: -3px;
  top: 0;
  width: 7px;
}

.cropper-center::after {
  height: 7px;
  left: 0;
  top: -3px;
  width: 1px;
}

.cropper-face,
.cropper-line,
.cropper-point {
  display: block;
  height: 100%;
  opacity: 0.1;
  position: absolute;
  width: 100%;
}

.cropper-face {
  background-color: #fff;
  left: 0;
  top: 0;
}

.cropper-line {
  background-color: #39f;
}

.cropper-line.line-e {
  cursor: ew-resize;
  right: -3px;
  top: 0;
  width: 5px;
}

.cropper-line.line-n {
  cursor: ns-resize;
  height: 5px;
  left: 0;
  top: -3px;
}

.cropper-line.line-w {
  cursor: ew-resize;
  left: -3px;
  top: 0;
  width: 5px;
}

.cropper-line.line-s {
  bottom: -3px;
  cursor: ns-resize;
  height: 5px;
  left: 0;
}

.cropper-point {
  background-color: #39f;
  height: 5px;
  opacity: 0.75;
  width: 5px;
}

.cropper-point.point-e {
  cursor: ew-resize;
  margin-top: -3px;
  right: -3px;
  top: 50%;
}

.cropper-point.point-n {
  cursor: ns-resize;
  left: 50%;
  margin-left: -3px;
  top: -3px;
}

.cropper-point.point-w {
  cursor: ew-resize;
  left: -3px;
  margin-top: -3px;
  top: 50%;
}

.cropper-point.point-s {
  bottom: -3px;
  cursor: s-resize;
  left: 50%;
  margin-left: -3px;
}

.cropper-point.point-ne {
  cursor: nesw-resize;
  right: -3px;
  top: -3px;
}

.cropper-point.point-nw {
  cursor: nwse-resize;
  left: -3px;
  top: -3px;
}

.cropper-point.point-sw {
  bottom: -3px;
  cursor: nesw-resize;
  left: -3px;
}

.cropper-point.point-se {
  bottom: -3px;
  cursor: nwse-resize;
  height: 20px;
  opacity: 1;
  right: -3px;
  width: 20px;
}

@media (min-width: 768px) {
  .cropper-point.point-se {
    height: 15px;
    width: 15px;
  }
}
@media (min-width: 992px) {
  .cropper-point.point-se {
    height: 10px;
    width: 10px;
  }
}
@media (min-width: 1200px) {
  .cropper-point.point-se {
    height: 5px;
    opacity: 0.75;
    width: 5px;
  }
}
.cropper-point.point-se::before {
  background-color: #39f;
  bottom: -50%;
  content: " ";
  display: block;
  height: 200%;
  opacity: 0;
  position: absolute;
  right: -50%;
  width: 200%;
}

.cropper-invisible {
  opacity: 0;
}

.cropper-bg {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC");
}

.cropper-hide {
  display: block;
  height: 0;
  position: absolute;
  width: 0;
}

.cropper-hidden {
  display: none !important;
}

.cropper-move {
  cursor: move;
}

.cropper-crop {
  cursor: crosshair;
}

.cropper-disabled .cropper-drag-box,
.cropper-disabled .cropper-face,
.cropper-disabled .cropper-line,
.cropper-disabled .cropper-point {
  cursor: not-allowed;
}

main.static_pages-home section#sign_in_box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  max-width: 720px;
}
main.static_pages-home section#sign_in_box a {
  display: inline-block;
  padding: 0.5rem 1rem;
  color: #333;
  font-size: 0.85rem;
  font-weight: bold;
  text-align: center;
  line-height: normal;
  background: #f6f6f6;
  border: solid 1px #c9c9c9;
  border-radius: 5px;
  transition: all 0.1s;
}
main.static_pages-home section#sign_in_box a:hover {
  cursor: pointer;
  background: #eee;
}
main.static_pages-home nav#home-nav {
  max-width: 1280px;
  margin: 2rem auto;
  padding: 0 2rem;
}
main.static_pages-home nav#home-nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  margin: 0;
  list-style: none;
}
main.static_pages-home nav#home-nav ul li {
  margin: 0;
  color: white;
  text-align: center;
  background: gray;
  border-radius: 1rem;
}
main.static_pages-home nav#home-nav ul li:hover {
  opacity: 0.8;
}
main.static_pages-home nav#home-nav ul li a {
  display: block;
  padding: 1rem;
  color: white;
}
main.static_pages-home section#home-content {
  display: grid;
  grid-template-columns: 1fr 350px;
  gap: 2rem;
}
@media (max-width: 425px) {
  main.static_pages-home section#home-content {
    grid-template-columns: 1fr;
  }
}
main.static_pages-home section#home-content .notifications h2 {
  margin: 0;
  border-left: none;
}
main.static_pages-home section#home-content .notifications ul.notifications {
  overflow: scroll;
  max-height: 1000px;
}
main.static_pages-home section#home-content .notifications a.notification_index {
  display: block;
  width: 100%;
  padding: 1rem 2rem;
  color: inherit;
  text-align: center;
  border-top: solid 2px black;
}

main.static_pages-help section.static_pages.help dl.qa dd, main.static_pages-help section.static_pages.help dl.qa dt {
  display: flex;
  gap: 0.5rem;
  padding: 0.5rem 1.5rem 0.5rem 0.75rem;
}
main.static_pages-help section.static_pages.help dl.qa dd:before, main.static_pages-help section.static_pages.help dl.qa dt:before, main.static_pages-help section.static_pages.help dl.qa dd:after, main.static_pages-help section.static_pages.help dl.qa dt:after {
  flex-shrink: 0;
  pointer-events: none;
  transition: all 0.2s;
}
main.static_pages-help section.static_pages.help dl.qa dd:before, main.static_pages-help section.static_pages.help dl.qa dt:before {
  content: "";
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  vertical-align: text-bottom;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
main.static_pages-help section.static_pages.help dl.qa dt {
  margin-bottom: 3px;
  color: #ff6363;
  border: solid 1px gray;
  cursor: pointer;
}
main.static_pages-help section.static_pages.help dl.qa dt:before {
  background-image: url(/assets/icon/qa_question-d42b4ab898aa3979fc356219c4c002698f463ebb2393af697f3fd46164a87d51.png);
}
main.static_pages-help section.static_pages.help dl.qa dt:after {
  content: "";
  display: block;
  align-self: center;
  width: 0;
  height: 0;
  margin-left: auto;
  border: solid 10px transparent;
  border-top-color: black;
  border-bottom: none;
}
main.static_pages-help section.static_pages.help dl.qa dt.active:after {
  transform: rotateX(180deg);
}
main.static_pages-help section.static_pages.help dl.qa dd:not(:last-child) {
  margin-bottom: 1rem;
}
main.static_pages-help section.static_pages.help dl.qa dd:before {
  background-image: url(/assets/icon/qa_answer-26237a390497171225d407b37aefa6deaa11bbf9eccaef3ef0a653d525640c7b.png);
}

main.static_pages-dashbord section.static_pages.dashbord.pannels {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
main.static_pages-dashbord section.static_pages.dashbord.pannels > .pannel {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 10rem;
  height: 10rem;
  padding: 1rem;
  color: white;
  text-decoration: none;
  background: lightgray;
  border-radius: 10px;
}
main.static_pages-dashbord section.static_pages.dashbord.pannels > .pannel:hover {
  opacity: 0.8;
}

main.import-index tr.progress progress {
  display: none;
  width: 100%;
}
main.import-index tr.progress progress + span {
  display: none;
}

main.scenes-show section.prev_next a.prev_scene:before,
main.publications-show section.prev_next a.prev_scene:before, main.scenes-show section.prev_next a.next_scene:after,
main.publications-show section.prev_next a.next_scene:after {
  content: "";
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

@media print {
  body, div {
    margin: 0;
    box-shadow: 0;
  }
}
main section.actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem 1rem;
  margin: 1rem auto;
  padding: 0 2rem;
}
main section.actions *.start {
  margin-right: auto;
}
main section.actions select {
  margin: 0;
}
main section.search {
  margin: 0 auto;
  padding: 0 2rem;
}
main section.search h2.search {
  margin: 0;
  padding: 0.5rem 1rem;
  color: white;
  text-align: center;
  font-size: 1.2rem;
  font-weight: normal;
  background: #ffd128;
  border: none;
  cursor: pointer;
}
main section.search h2.search:before {
  content: "▲";
  display: inline-block;
  margin-right: 0.5em;
  transition: all 0.2s;
}
main section.search h2.search.active:before {
  transform: rotateX(180deg);
}
main section.search form.search_form {
  display: none;
  margin: 2rem 0;
}
main section.search form.search_form #search_sort_column {
  margin-right: 1em;
}
main section.search form.search_form .actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
}
main section.search form.search_form .actions input[type=submit],
main section.search form.search_form .actions input[type=reset] {
  width: auto;
  margin: 0;
}
main table.index {
  width: 100%;
  margin: 2rem 0;
}
main table.index:first-child {
  margin-top: 0;
}
main table.index:last-child {
  margin-top: 0;
}
main table.index thead {
  border-bottom: solid 2px black;
}
main table.index thead th.handle {
  width: 2rem;
}
main table.index thead th.id {
  width: 5em;
}
main table.index thead th.name {
  width: 10em;
}
main table.index thead th.email {
  width: 25em;
}
main table.index thead th.datetime {
  width: 12em;
}
main table.index thead th.datetime-long {
  width: 20em;
}
main table.index thead th.thumbnail {
  width: 200px;
}
main table.index thead th.row_order {
  width: 5em;
}
main table.index tbody tr {
  transition: all 0.1s;
}
main table.index tbody tr:nth-of-type(even) {
  background: #efefef;
}
main table.index tbody tr:hover {
  background: #fff4d9;
}
main table.index th, main table.index td {
  padding: 0.75rem 0.5rem;
  word-break: break-word;
}
main table.index th a, main table.index td a {
  color: orange;
  text-decoration: none;
}
main table.show {
  width: 100%;
}
main table.show th, main table.show td {
  padding: 0.75rem 1rem;
}
@media (max-width: 425px) {
  main table.show th, main table.show td {
    padding: 0.25rem 0.5rem;
  }
}
main table.show th {
  width: 30%;
}
main .color-box {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: baseline;
  border: solid 1px gray;
}

main.api_keys-index #api_key-modal {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.3);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  visibility: hidden;
  opacity: 0;
  transition: all 0.2s;
}
main.api_keys-index #api_key-modal.active {
  visibility: visible;
  opacity: 1;
}
main.api_keys-index #api_key-modal article {
  max-width: 100%;
  padding: 1rem;
  border-radius: 1rem;
  background: white;
}
main.api_keys-index #api_key-modal article header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}
main.api_keys-index #api_key-modal article header h3 {
  margin: 0;
}
main.api_keys-index #api_key-modal article header a.close {
  flex: none;
  display: block;
  width: 20px;
  height: 20px;
}
main.api_keys-index #api_key-modal article input[type=text] {
  width: 30em;
  max-width: 100%;
  padding: 0.25em;
}
main.api_keys-index #api_key-modal article button#copy_token span {
  display: none;
}
main.api_keys-index #api_key-modal article button#copy_token span.active {
  display: contents;
}

h4.seal_category {
  margin: 2rem 0 0.75rem;
  padding: 0.25em 1rem;
  background: #ddd;
  border-left: solid #aaa 30px;
  font-size: 1rem;
  font-weight: bold;
  position: relative;
}
h4.seal_category:before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border: solid 1px white;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-20px, -50%);
}

table.seal_list {
  font-size: 0.8rem;
}
table.seal_list th img {
  width: 30px;
}

main.seals-index table.index {
  table-layout: fixed;
}
main.seals-index table.index + table.index {
  margin-top: 4rem;
}

ul.taxonomies,
ul.taxonomies-mini {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
}
ul.taxonomies li,
ul.taxonomies-mini li {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1.5em;
  height: 1.5em;
  margin: 0;
  padding: 0.25rem 0.5rem;
  color: white;
  background: gray;
}

ul.taxonomies-mini {
  gap: 0.25rem;
  margin: 1rem 0;
}
ul.taxonomies-mini li {
  font-size: 0.75rem;
}

main.facilities-index table.index td.total_file_size {
  text-align: right;
}
main.facilities-index table.index td.bracket {
  width: 1em;
  text-align: center;
}
main.facilities-index table.index td.capacity_over {
  color: red;
}

table[id^=facility_].show .capacity_percentage.over {
  color: red;
}

main.photos-index form#search_photo {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 2rem;
}
@media (max-width: 425px) {
  main.photos-index form#search_photo {
    flex-direction: column;
    align-items: flex-start;
  }
}
main.photos-index form#search_photo input#search_caption_cont {
  width: auto;
}
main.photos-index form#search_photo input[type=submit] {
  margin: 0;
  width: auto;
}

div.photo_list {
  display: grid;
  grid-template-columns: repeat(auto-fill, 200px);
  justify-content: space-evenly;
  gap: 2rem 1rem;
}
@media (max-width: 425px) {
  div.photo_list {
    grid-template-columns: repeat(auto-fill, 150px);
  }
}
div.photo_list > p {
  grid-column: 1/-1;
}
div.photo_list div[id^=photo_] {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin: 0 auto;
  max-width: 200px;
}
@media (max-width: 425px) {
  div.photo_list div[id^=photo_] {
    max-width: 150px;
  }
}
div.photo_list div[id^=photo_] input[type=checkbox][id^=check_photo] {
  display: none;
}
div.photo_list div[id^=photo_] input[type=checkbox][id^=check_photo]:checked + label {
  display: block;
  outline: solid 5px skyblue;
  outline-offset: -5px;
  position: relative;
}
div.photo_list div[id^=photo_] input[type=checkbox][id^=check_photo]:checked + label:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: white;
  opacity: 0.3;
  position: absolute;
  left: 0;
  top: 0;
}
div.photo_list div[id^=photo_] figure {
  width: 200px;
  height: 200px;
}
@media (max-width: 425px) {
  div.photo_list div[id^=photo_] figure {
    width: 150px;
    height: 150px;
  }
}
div.photo_list div[id^=photo_] label figure img:hover {
  cursor: pointer;
}
div.photo_list div[id^=photo_] figcaption {
  overflow: hidden;
  margin: 0.25rem 0;
  white-space: nowrap;
  text-align: left;
  text-overflow: ellipsis;
}
div.photo_list div[id^=photo_] form.take_on_form {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0;
}
div.photo_list div[id^=photo_] form.take_on_form input[type=image],
div.photo_list div[id^=photo_] form.take_on_form button {
  display: inline-block;
  flex: 1 0 auto;
  width: 25px;
  height: 25px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}
div.photo_list div[id^=photo_] form.take_on_form input[type=image]:hover,
div.photo_list div[id^=photo_] form.take_on_form button:hover {
  opacity: 0.8;
}

#photo_search_modal {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 3rem;
  background: rgba(0, 0, 0, 0.3);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  visibility: hidden;
  opacity: 0;
  transition: all 0.2s;
}
#photo_search_modal.active {
  visibility: visible;
  opacity: 1;
}
@media (max-width: 425px) {
  #photo_search_modal {
    padding: 2rem;
  }
}
#photo_search_modal > .modal-content {
  display: grid;
  grid-template-rows: auto auto 1fr;
  width: 100%;
  height: 100%;
  padding: 3rem;
  background: white;
}
@media (max-width: 425px) {
  #photo_search_modal > .modal-content {
    padding: 1rem;
  }
}
#photo_search_modal > .modal-content form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 2rem;
  margin: 0 0 1rem;
}
#photo_search_modal > .modal-content form select,
#photo_search_modal > .modal-content form input {
  width: auto;
  margin: 0;
}
#photo_search_modal > .modal-content #filtered_photos,
#photo_search_modal > .modal-content #filtered_photos_rukumi {
  overflow-y: auto;
  /* 推奨 */
}
#photo_search_modal > .modal-content #filtered_photos .photo_list div[id^=photo_] figcaption,
#photo_search_modal > .modal-content #filtered_photos_rukumi .photo_list div[id^=photo_] figcaption {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
#photo_search_modal > .modal-content #filtered_photos .photo_list div[id^=photo_] footer,
#photo_search_modal > .modal-content #filtered_photos_rukumi .photo_list div[id^=photo_] footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#photo_search_modal > .modal-content #filtered_photos .photo_list div[id^=photo_] footer a,
#photo_search_modal > .modal-content #filtered_photos_rukumi .photo_list div[id^=photo_] footer a {
  display: inline-block;
  padding: 0.5em 1em;
  color: black;
  font-size: 0.8rem;
  text-align: center;
  text-decoration: none;
  border: solid 1px gray;
  border-radius: 5px;
  transition: all 0.2s;
}
#photo_search_modal > .modal-content #filtered_photos .photo_list div[id^=photo_] footer a:hover,
#photo_search_modal > .modal-content #filtered_photos_rukumi .photo_list div[id^=photo_] footer a:hover {
  background: lightgray;
}
#photo_search_modal > .modal-content #filtered_photos .photo_list div[id^=photo_].used .thumb_modal figure,
#photo_search_modal > .modal-content #filtered_photos_rukumi .photo_list div[id^=photo_].used .thumb_modal figure {
  position: relative;
}
#photo_search_modal > .modal-content #filtered_photos .photo_list div[id^=photo_].used .thumb_modal figure:before,
#photo_search_modal > .modal-content #filtered_photos_rukumi .photo_list div[id^=photo_].used .thumb_modal figure:before {
  content: "USED";
  pointer-events: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  color: #393939;
  font-size: 2rem;
  background: #80808080;
  position: absolute;
}

#photo_placeholders {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
#photo_placeholders .photo_placeholder {
  width: 200px;
  min-height: 200px;
  position: relative;
}
@media (max-width: 425px) {
  #photo_placeholders .photo_placeholder {
    width: 150px;
    min-height: 150px;
  }
}
#photo_placeholders .photo_placeholder figure {
  width: 200px;
  height: 200px;
  cursor: grab;
  background: #d8d8d8;
}
@media (max-width: 425px) {
  #photo_placeholders .photo_placeholder figure {
    width: 150px;
    height: 150px;
  }
}
#photo_placeholders .photo_placeholder figure:hover {
  background-color: #ebebeb;
}
#photo_placeholders .photo_placeholder figure:empty {
  background-image: url(/assets/icon/plus-d2332ff9988bffca7df2b70555a4a80e700c2377e675bf7e33440d83c8b1100c.svg);
  background-size: 50%;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
}
#photo_placeholders .photo_placeholder > figure {
  cursor: pointer;
}
#photo_placeholders .photo_placeholder .selected_photo .thumb_modal img.thumbnail:hover {
  opacity: 0.8;
}
#photo_placeholders .photo_placeholder .selected_photo .thumb_modal .remove_selected_photo {
  background-image: url(/assets/icon/close-b295f9849d8c3c74cba0d1f9322e666f28fb9bfce889d33b2eeb4b5016712adc.png);
}

table#photo_modal_ogamen .temp-photo-preview {
  position: relative;
}
table#photo_modal_ogamen .temp-photo-spinner {
  display: inline-block;
  width: 24px;
  height: 24px;
  border: 3px solid #d8d8d8;
  border-top-color: #4a90d9;
  border-radius: 50%;
  animation: temp-photo-spin 0.8s linear infinite;
  vertical-align: middle;
}

@keyframes temp-photo-spin {
  to {
    transform: rotate(360deg);
  }
}
div.scene_tiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  align-content: start;
  gap: 1.5rem 1rem;
}
div.scene_tiles > p {
  grid-column: 1/-1;
}
div.scene_tiles div[id^=scene_] {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 1rem;
  border: solid 3px #ffdea5;
  position: relative;
}
div.scene_tiles div[id^=scene_]:hover {
  background: #ffdea5;
}
div.scene_tiles div[id^=scene_] img.icon-pickup {
  width: 2rem;
  position: absolute;
  top: -1rem;
  right: -1rem;
}
div.scene_tiles div[id^=scene_] article {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0.5rem;
  background: white;
}
div.scene_tiles div[id^=scene_] article header.photos {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.5rem;
}
div.scene_tiles div[id^=scene_] article header.photos span {
  display: block;
  width: 100%;
  max-width: calc(50% - 0.25rem);
  padding-top: calc(50% - 0.25rem);
  position: relative;
}
div.scene_tiles div[id^=scene_] article header.photos span:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: lightgray;
  position: absolute;
  top: 0;
}
div.scene_tiles div[id^=scene_] article header.photos span img {
  position: absolute;
  top: 0;
}
div.scene_tiles div[id^=scene_] article h5 {
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  text-overflow: ellipsis "[...]";
  white-space: nowrap;
}
div.scene_tiles div[id^=scene_] article table.info {
  align-self: flex-start;
  margin: 0;
  font-size: 0.75rem;
}
div.scene_tiles div[id^=scene_] article table.info tr th, div.scene_tiles div[id^=scene_] article table.info tr td {
  padding: 0 0.25em;
}
div.scene_tiles div[id^=scene_] article table.info tr th {
  padding-left: 0;
  font-weight: normal;
}
div.scene_tiles div[id^=scene_] article table.info tr td:nth-child(2) {
  text-align: center;
}
div.scene_tiles div[id^=scene_] article table.info tr td:last-child {
  font-weight: bold;
}
div.scene_tiles div[id^=scene_] article footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: auto;
  font-size: 0.8rem;
}
div.scene_tiles div[id^=scene_] article footer p {
  margin: 0;
}
div.scene_tiles div[id^=scene_] article footer .show_link {
  display: block;
  width: 2rem;
  height: 2rem;
  border: solid 1px gray;
  position: relative;
}
div.scene_tiles div[id^=scene_] article footer .show_link:after {
  content: "";
  display: block;
  width: 30%;
  height: 30%;
  border-top: solid 1px gray;
  border-right: solid 1px gray;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-75%, -50%) rotate(45deg);
}
div.scene_tiles div[id^=scene_] article footer .show_link:hover {
  background: gray;
}
div.scene_tiles div[id^=scene_] article footer .show_link:hover:after {
  border-color: white;
}

@media (max-width: 425px) {
  main.scenes-index form#scene_search tbody,
main.scenes-index form#scene_search tr,
main.publications-index form#scene_search tbody,
main.publications-index form#scene_search tr {
    display: grid;
    gap: 0.25rem;
  }
}
main.scenes-index form#scene_search .radio_buttons-horizontal,
main.publications-index form#scene_search .radio_buttons-horizontal {
  margin: 0.5em 0;
}

main.scenes-show section[id^=scene_] h2,
main.publications-show section[id^=scene_] h2 {
  width: fit-content;
  margin-bottom: 2rem;
  padding: 0 0.25em 5px;
  color: #5d5d5d;
  border: none;
  background-image: repeating-linear-gradient(-45deg, #ffd700, #ffd700 2px, #fff 2px, #fff 4px);
  background-position: bottom center;
  background-size: 100% 5px;
  background-repeat: no-repeat;
}
main.scenes-show section[id^=scene_] h3,
main.publications-show section[id^=scene_] h3 {
  font-weight: bold;
  text-decoration: none;
}
main.scenes-show section[id^=scene_] #scene_photos,
main.publications-show section[id^=scene_] #scene_photos {
  display: grid;
  grid-template-columns: repeat(auto-fill, 200px);
  gap: 1rem;
}
@media (max-width: 425px) {
  main.scenes-show section[id^=scene_] #scene_photos,
main.publications-show section[id^=scene_] #scene_photos {
    grid-template-columns: repeat(auto-fill, 150px);
    justify-content: center;
  }
}
main.scenes-show section[id^=scene_] table.scene_infos,
main.publications-show section[id^=scene_] table.scene_infos {
  margin: 0 0 1rem;
}
main.scenes-show section.prev_next,
main.publications-show section.prev_next {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
}
main.scenes-show section.prev_next a,
main.publications-show section.prev_next a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem;
  color: inherit;
  text-decoration: none;
  font-weight: bold;
  border: solid 1px black;
}
main.scenes-show section.prev_next a.prev_scene,
main.publications-show section.prev_next a.prev_scene {
  margin-right: auto;
}
main.scenes-show section.prev_next a.prev_scene:before,
main.publications-show section.prev_next a.prev_scene:before {
  background-image: url(/assets/icon/arrow_left-a14acf9524e33e4c8e4e9f4c072be867d79af07a6efafb95d788498c3179bd18.png);
}
main.scenes-show section.prev_next a.next_scene,
main.publications-show section.prev_next a.next_scene {
  margin-left: auto;
}
main.scenes-show section.prev_next a.next_scene:after,
main.publications-show section.prev_next a.next_scene:after {
  background-image: url(/assets/icon/arrow_right-01afa5ccb90ad42876ad21b5a6c4f0463302eb1f7cfccb604cf2afe797d3c0aa.png);
}
main.scenes-show section.evaluation,
main.publications-show section.evaluation {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}
@media (max-width: 767px) {
  main.scenes-show section.evaluation,
main.publications-show section.evaluation {
    grid-template-columns: 1fr;
  }
}
main.scenes-show section.evaluation > *,
main.publications-show section.evaluation > * {
  min-height: 3rem;
  padding: 1rem;
}
main.scenes-show section.evaluation .scene_purposes,
main.publications-show section.evaluation .scene_purposes {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  vertical-align: middle;
}
main.scenes-show section.evaluation #seal_list_show,
main.publications-show section.evaluation #seal_list_show {
  margin-top: 3rem;
}
main.scenes-show section.evaluation #seal_list,
main.publications-show section.evaluation #seal_list {
  display: none;
  margin-top: 2rem;
}
@media print {
  main.scenes-show section.actions,
main.scenes-show section.prev_next,
main.publications-show section.actions,
main.publications-show section.prev_next {
    display: none;
  }
  main.scenes-show section.evaluation,
main.publications-show section.evaluation {
    grid-template-columns: 1fr;
  }
}

form#scene_form table.fields th {
  width: 10rem;
}
@media (max-width: 425px) {
  form#scene_form table.fields th {
    width: auto;
  }
}
form#scene_form #photo_placeholders textarea[name="scene[photo_captions][]"] {
  resize: none;
  width: 100%;
  height: 2.5em;
  border-radius: 0 0 5px 5px;
  box-sizing: border-box;
}
form#scene_form #photo_placeholders textarea[name="scene[photo_captions][]"]:focus {
  outline-style: solid;
  outline-width: 2px;
  outline-offset: -2px;
  border-radius: 0 0 5px 5px;
}
form#scene_form select[id^=scene_taxonomy_category_] {
  width: 150px;
}

table.seans_ranking {
  width: 100%;
}
table.seans_ranking tbody tr:hover {
  background: #fdf6e9;
}
table.seans_ranking tbody tr td {
  vertical-align: middle;
}

#comment_form {
  margin-bottom: 3rem;
}
#comment_form form {
  margin: 0;
}
#comment_form form textarea {
  min-height: 5rem;
  margin: 0;
  font-size: 1rem;
  border-width: 2px;
  border-color: #ffe173;
}
#comment_form form input[type=submit] {
  width: auto;
  margin: 0.5rem 0 0;
  background: #ffe173;
  border-color: #cca516;
}
#comment_form form input[type=submit]:hover {
  background: #ffd63f;
}
#comment_form form .reply_to_container {
  display: none;
  margin: 0.5rem 0;
}
#comment_form form .reply_to_container.active {
  display: block;
}
#comment_form form .reply_to_container .reply_clear {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  vertical-align: text-bottom;
  background-image: url(/assets/icon/comment_reply_clear-a79ad47a86a56419a441cd6b85703f687069ed37239fab255ebdc7ba425a92af.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
}
#comment_form form .reply_to_container .reply_to_body {
  margin: 0.25rem 0;
  padding: 0.25rem 0.5rem;
  border-left: solid 5px #00d2ff;
}

#comments_list {
  max-height: 600px;
  overflow: hidden;
  position: relative;
}
#comments_list:after {
  content: "";
  display: block;
  width: 100%;
  height: 5rem;
  background: linear-gradient(transparent 0%, white 40%);
  position: absolute;
  bottom: 0;
}
#comments_list.expanded {
  max-height: none;
}
#comments_list.expanded:after {
  display: none;
}
#comments_list article.comment {
  padding: 1.5rem 0.75rem;
  border-bottom: solid 1px #ccc;
}
#comments_list article.comment.edit > form.comment_edit {
  display: block;
}
#comments_list article.comment.edit > section.comment_content {
  display: none;
}
#comments_list article.comment.edit > .actions {
  display: none;
}
#comments_list article.comment header {
  display: flex;
  align-items: baseline;
  gap: 0.25em 1em;
  margin-bottom: 1rem;
}
@media (max-width: 425px) {
  #comments_list article.comment header {
    flex-direction: column;
  }
}
#comments_list article.comment header address {
  display: inline;
  font-style: normal;
  font-weight: bold;
}
#comments_list article.comment header time {
  font-size: 0.75em;
}
#comments_list article.comment .comment_parent {
  margin: 0.75rem 0;
}
#comments_list article.comment .comment_parent .reply_to {
  font-size: 0.75em;
}
#comments_list article.comment .comment_parent .content {
  margin: 0.25rem 0 0.5rem;
  padding: 0.25rem 0.5rem;
  border-left: solid 5px #00d2ff;
}
#comments_list article.comment form.comment_edit {
  display: none;
  margin: 0;
}
#comments_list article.comment form.comment_edit .actions {
  display: flex;
  align-items: stretch;
  gap: 0.75rem;
  margin-top: 0.5rem;
}
#comments_list article.comment form.comment_edit .actions > * {
  flex: 1;
  margin: 0;
}
#comments_list article.comment form.comment_edit .actions input[type=submit] {
  background: #ffe173;
  border-color: #cca516;
}
#comments_list article.comment form.comment_edit .actions input[type=submit]:hover {
  background: #ffd63f;
}
#comments_list article.comment .actions {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 0.75rem;
  margin-top: 1rem;
}
#comments_list article.comment .actions span,
#comments_list article.comment .actions a,
#comments_list article.comment .actions button {
  display: inline-block;
  margin: 0;
  padding: 0.15rem 0.25rem;
  color: black;
  font-size: 0.8em;
  text-decoration: none;
  line-height: 1.2em;
  border: none;
  border-bottom: solid 1px gray;
  background: transparent;
  cursor: pointer;
}
#comments_list article.comment .actions span.reply,
#comments_list article.comment .actions a.reply,
#comments_list article.comment .actions button.reply {
  margin-right: auto;
}
#comments_list article.comment .actions span.destroy,
#comments_list article.comment .actions a.destroy,
#comments_list article.comment .actions button.destroy {
  color: #dc3545;
}

#comments_list_expand {
  margin-top: 2rem;
}
#comments_list_expand.disabled {
  display: none;
}

.evaluations {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(calc(50px + 2.5em), 1fr));
  gap: 1rem 0.5rem;
  font-size: 0.6rem;
}
.evaluations > div {
  display: flex;
  align-items: flex-end;
}
.evaluations > div img {
  margin-right: 2px;
  opacity: 0.3;
}
.evaluations > div img.evaluated {
  opacity: 1;
}

#evaluation_seal_categories {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(calc(300px + 2.5em), 1fr));
  gap: 2rem 1.5rem;
}

input#scope_name_cont {
  width: auto;
}

#scope_kindergarteners-result:not(:empty) {
  margin-top: 0.5rem;
}

.scope-kindergarteners-search-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

#scope_kindergarteners .scope-kindergarteners-toolbar {
  display: inline-flex;
  gap: 0.5rem;
}
#scope_kindergarteners .scope-kindergarteners-toolbar[hidden] {
  display: none !important;
}

.scope-kindergarteners-select-shown,
.scoped-kindergarteners-clear-all {
  width: auto;
}

#scope_kindergarteners-result .scope-kindergarteners-result-list span,
#scoped_kindergarteners-grid span {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
#scope_kindergarteners-result .scope-kindergarteners-result-list span img,
#scoped_kindergarteners-grid span img {
  cursor: pointer;
  display: inline-block;
  width: 1em;
}

#notification-link, #notification-toggle .notification-icon {
  width: 35px;
  height: 35px;
  padding: 5px;
  border-radius: 100%;
  background: white;
  cursor: pointer;
}

#notification-toggle {
  position: relative;
}
@media (max-width: 425px) {
  #notification-toggle {
    display: none;
  }
}
#notification-toggle #notification-container {
  width: 320px;
  margin-top: 1rem;
  font-size: 0.85rem;
  background: white;
  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.35);
  position: absolute;
  z-index: 10;
  visibility: hidden;
  opacity: 0;
}
#notification-toggle #notification-container.active {
  visibility: visible;
  opacity: 1;
  transition: all 0.2s;
}
#notification-toggle #notification-container:before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 0.5rem transparent;
  border-top-width: 0;
  border-bottom: solid 0.5rem #ccc;
  position: absolute;
  top: -0.5rem;
  left: 0.5rem;
}
#notification-toggle #notification-container header {
  padding: 0.75rem 0.5rem;
  text-align: center;
  font-weight: bold;
  background: #ccc;
}
#notification-toggle #notification-container > p {
  margin: 1rem;
}
#notification-toggle #notification-container ul {
  max-height: 320px;
  overflow: auto;
}
#notification-toggle #notification-container footer {
  border-top: solid 1px gray;
  background: white;
}
#notification-toggle #notification-container footer a {
  display: block;
  padding: 0.75rem 0.5rem;
  color: inherit;
  text-align: center;
  text-decoration: none;
}

#notification-link {
  display: none;
  position: relative;
}
@media (max-width: 425px) {
  #notification-link {
    display: block;
  }
}

ul.notifications {
  list-style: none;
  max-height: 320px;
  margin: 0;
  padding: 0 0.5rem;
  overflow: auto;
}
ul.notifications li {
  margin: 0;
  position: relative;
}
ul.notifications li:not(:last-child) {
  border-bottom: solid 1px gray;
}
ul.notifications li:hover {
  background: #fff3e4;
}
ul.notifications li.yet:before {
  content: "●";
  display: block;
  font-size: 0.5em;
  position: absolute;
  top: 50%;
  left: 0.25em;
  transform: translateY(-50%);
}
ul.notifications li a {
  color: inherit;
  text-decoration: none;
}
ul.notifications li article {
  padding: 1rem;
}
ul.notifications li article time {
  display: inline-block;
  margin-bottom: 0.25rem;
}

.notification-count {
  pointer-events: none;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 1.25rem;
  height: 1.25rem;
  padding: 0.1rem 0.25rem;
  color: white;
  font-size: 0.7rem;
  font-weight: bold;
  background: red;
  border-radius: 1.25rem;
  position: absolute;
  left: 60%;
  bottom: -30%;
}
@media (max-width: 767px) {
  .notification-count {
    left: auto;
    right: 60%;
  }
}

main.notifications-index table td.yet {
  width: 1em;
  text-align: center;
  font-size: 0.5em;
  vertical-align: middle;
}
main.notifications-index table td.link {
  width: 3em;
  vertical-align: middle;
}
main.notifications-index table td.link img {
  height: 1em;
}

main[class^=designed_documents-] .display-template {
  width: 100%;
  overflow: scroll;
  padding: 10px;
}
main[class^=designed_documents-] .display-template canvas#pdf {
  display: block;
  background: white;
  margin: 0 auto;
  box-shadow: 0 0 7px 2px rgba(0, 0, 0, 0.2);
}
main[class^=designed_documents-] .display-template canvas#pdf[size=A4][layout=portrait] {
  width: 210mm;
  height: 297mm;
}
main[class^=designed_documents-] .display-template canvas#pdf[size=A4][layout=landscape] {
  width: 297mm;
  height: 210mm;
}
main[class^=designed_documents-] button#pdf {
  height: 70px;
}
main[class^=designed_documents-] #download-anime.loading-circle {
  display: none;
  width: 50px;
  height: 50px;
  border: 3px solid #f3f3f3;
  border-top: 3px solid #3498db;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

main[class^=designed_documents-]:has(#document_partial_template.grid-5col) > section {
  max-width: 1590px;
}

form#document_form table.fields:has(#document_partial_template.grid-5col) {
  table-layout: fixed;
}
form#document_form table.fields:has(#document_partial_template.grid-5col) td {
  min-width: 0;
}
form#document_form #document_partial_template {
  max-width: 625px;
  display: grid;
  grid-gap: 0.5rem;
  grid-template-columns: 1fr 1fr 1fr;
}
form#document_form #document_partial_template.grid-5col {
  max-width: 1032px;
  grid-template-columns: repeat(5, 200px);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 0.5rem;
}
form#document_form #document_partial_template .photo_placeholder {
  width: 200px;
  min-height: 200px;
  position: relative;
}
@media (max-width: 425px) {
  form#document_form #document_partial_template .photo_placeholder {
    width: 150px;
    min-height: 150px;
  }
}
form#document_form #document_partial_template .photo_placeholder figure {
  width: 200px;
  height: 200px;
  cursor: grab;
  background: #d8d8d8;
}
@media (max-width: 425px) {
  form#document_form #document_partial_template .photo_placeholder figure {
    width: 150px;
    height: 150px;
  }
}
form#document_form #document_partial_template .photo_placeholder figure:hover {
  background-color: #ebebeb;
}
form#document_form #document_partial_template .photo_placeholder figure:empty {
  background-image: url(/assets/icon/plus-d2332ff9988bffca7df2b70555a4a80e700c2377e675bf7e33440d83c8b1100c.svg);
  background-size: 50%;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
}
form#document_form #document_partial_template .photo_placeholder > figure {
  cursor: pointer;
}
form#document_form #document_partial_template .photo_placeholder .selected_photo .thumb_modal img.thumbnail:hover {
  opacity: 0.8;
}
form#document_form #document_partial_template .photo_placeholder .selected_photo .thumb_modal .remove_selected_photo {
  background-image: url(/assets/icon/close-b295f9849d8c3c74cba0d1f9322e666f28fb9bfce889d33b2eeb4b5016712adc.png);
}
form#document_form #document_partial_template .photo_placeholder .selected_photo .thumb_modal .crop_ddphoto {
  background-image: url(/assets/icon/modal_zoom-9da121a980a0d87557093dad9476996bfdde670a4304f8a804aba16a53f2e4ec.png);
}
form#document_form #document_partial_template .photo_placeholder .selected_photo .thumb_modal .remove_ddphoto {
  background-image: url(/assets/icon/close-b295f9849d8c3c74cba0d1f9322e666f28fb9bfce889d33b2eeb4b5016712adc.png);
}
form#document_form #document_partial_template .text_placeholder {
  width: 200px;
  height: 200px;
  position: relative;
}
@media (max-width: 425px) {
  form#document_form #document_partial_template .text_placeholder {
    width: 150px;
    min-height: 150px;
  }
}
form#document_form #document_partial_template .text_placeholder textarea {
  padding: 10px;
}
form#document_form #document_photo_crop {
  padding: 3rem 5rem;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.3);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99;
  visibility: hidden;
  opacity: 0;
  transition: all 0.2s;
}
form#document_form #document_photo_crop.active {
  visibility: visible;
  opacity: 1;
}
@media (max-width: 425px) {
  form#document_form #document_photo_crop {
    padding: 3rem;
  }
}
form#document_form #document_photo_crop div.cropper_img_container {
  width: 100%;
  height: 100%;
}
form#document_form #document_photo_crop div.cropper_img_container img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
}

/*# sourceMappingURL=application.css.map */