@font-face {
  font-family: "exhibition_hall-font";
  font-style: normal;
  font-weight: 200;
  src: url("./angel-tail/google_fonts/NSCJKDL_exclusive-exhibition_hall-font.woff") format("woff");
}

div.exhibition_hall-font {
  font-family: "exhibition_hall-font";
}

@font-face {
  font-family: "comm_bkup-yoko";
  font-style: normal;
  font-weight: 200;
  src: url("./google_fonts/NSCJKDL_exclusive-comm_bkup-yoko.woff") format("woff");
}

div.comm_bkup-yoko {
  font-family: "comm_bkup-yoko";
}


div.bg-img {
  background-image: url(cotton-a.GIF);
  background-size: 150px 116px;
  background-position: 0% 0%;
  background-repeat: repeat;
}

div.bg-black {
  background: black;
}

div.bg-white {
  background: white;
}

.vrl {
  -webkit-writing-mode: vertical-rl;
  -webkit-font-smoothing: antialiased;
  -ms-writing-mode: tb-rl;
  width: 900px;
  height: 550px;
  line-height: 150%;
  writing-mode: vertical-rl;
}

.vrl2 {
  -webkit-writing-mode: vertical-rl;
  -webkit-font-smoothing: antialiased;
  -ms-writing-mode: tb-rl;
  margin-left: auto;
  margin-right: auto;
  line-height: 150%;
  writing-mode: vertical-rl;
}

div.tb-style {
  border: 2px solid #000000;
  width: 900px;
  height: 610px;
  padding: 30px;
  margin: 0 auto;
  line-height: 1.58;
  -webkit-writing-mode: vertical-rl;
  -webkit-font-smoothing: antialiased;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  writing-mode: vertical-rl;
}

div.tb-interview {
  border: double 3px #000000;
  padding: 20px;
  margin: 0 auto;
}

div.tb-column {
  border: 1px solid #000000;
  width: 900px;
  padding: 20px;
  margin: 0 auto;
}

div.tb-allyinvite {
  border: 1px solid #000000;
  width: 1300px;
  padding: 20px;
  margin: 0 auto;
}

div.kensho {
  border: 10px double #eee8aa;
  width: 1200px;
  height: 800px;
  padding: 30px;
  margin: 0 auto;
  line-height: 158%;
  -webkit-writing-mode: vertical-rl;
  -webkit-font-smoothing: antialiased;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: vertical-rl;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  writing-mode: vertical-rl;
}

div.tb-higurashi {
  border: 1px solid #FFFFFF;
  width: 900px;
  padding: 20px;
  margin: 0 auto;
  background-color: #000000;
  color: #FFFFFF;
}

div.chat {
  border: 1px solid #FFFFFF;
  width: 370px;
  padding: 20px;
  margin: 0 auto;
  background-color: #000000;
  color: #FFFFFF;
  line-break: anywhere;
  word-break: break-all;
}

table thead tr th {
  color: #FFFFFF;
  background: blueviolet;
  width: 100%;
  table-layout: fixed;
}

.number {
  text-combine: horizontal;
  -webkit-text-combine: horizontal;
  -epub-text-combine: horizontal;
  vertical-align: -1%;
  line-height: 1;
  -ms-writing-mode: lr-tb;
  -webkit-writing-mode: horizontal-tb;
  -o-writing-mode: horizontal-tb;
  -moz-text-combine-upright: all;
  -ms-text-combine-horizontal: all;
  text-combine-upright: all;
}

.modal-wrapper {
  z-index: 999;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 60px 10px;
  text-align: center
}

.modal-wrapper:not(:target) {
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s;
}

.modal-wrapper:target {
  opacity: 1;
  visibility: visible;
  transition: opacity .4s, visibility .4s;
}

.modal-wrapper::after {
  display: inline-block;
  height: 100%;
  margin-left: -.05em;
  vertical-align: middle;
  content: ""
}

.modal-wrapper .modal-window {
  box-sizing: border-box;
  display: inline-block;
  z-index: 20;
  position: relative;
  width: 70%;
  max-width: 1920px;
  padding: 30px 30px 15px;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 0 30px rgba(0, 0, 0, .6);
  vertical-align: middle
}

.modal-wrapper .modal-window .modal-content {
  max-height: 80vh;
  overflow-y: auto;
}

.modal-overlay {
  z-index: 10;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, .8)
}

.modal-wrapper .modal-close {
  z-index: 20;
  position: absolute;
  top: 0;
  right: 0;
  width: 35px;
  color: #95979c!important;
  font-size: 20px;
  font-weight: 700;
  line-height: 35px;
  text-align: center;
  text-decoration: none;
  text-indent: 0
}

.modal-wrapper .modal-close:hover {
  color: #2b2e38!important
}