/*!
 * ticket master CSS STYLESHEET V1.0
 * Copyright 2022
 */

@font-face {
  font-family: "S-CoreDream-2ExtraLight";
  src: url("../fonts/S-CoreDream-2ExtraLight.ttf");
}

@font-face {
  font-family: "SCDream1";
  src: url("../fonts/SCDream1.ttf");
  font-display: swap;
}

@font-face {
  font-family: "SCDream2";
  src: url("../fonts/SCDream2.ttf");
  font-display: swap;
}

@font-face {
  font-family: "SCDream3";
  src: url("../fonts/SCDream3.woff");
  font-display: swap;
}

@font-face {
  font-family: "SCDream4";
  src: url("../fonts/SCDream4.ttf");
  font-display: swap;
}

@font-face {
  font-family: "SCDream5";
  src: url("../fonts/SCDream5.woff");
  font-display: swap;
}

@font-face {
  font-family: "SCDream6";
  src: url("../fonts/SCDream6.woff");
  font-display: swap;
}

@font-face {
  font-family: "SCDream7";
  src: url("../fonts/SCDream7.ttf");
  font-display: swap;
}

@font-face {
  font-family: "SCDream8";
  src: url("../fonts/SCDream8.ttf");
  font-display: swap;
}

@font-face {
  font-family: "SCDream9";
  src: url("../fonts/SCDream9.ttf");
  font-display: swap;
}

html,
body {
  overflow-x: auto;
  scroll-behavior: smooth;
  font-family: "SCDream3";
  font-size: 14px;
  color: #000000;
  margin: 0;
  padding: 0;
  background-color: #f1f1f1;
}

a {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
  cursor: pointer;
}

.text-white {
  color: #ffffff !important;
}

.text-blue {
  color: #2152ff !important;
  font-family: "SCDream5";
}

.text-red {
  color: #ea0606 !important;
  font-family: "SCDream5";
}

.text-green {
  color: #17ad37 !important;
  font-family: "SCDream5";
}

.mb-15 {
  margin-bottom: 15px;
}

.font-14 {
  font-size: 14px;
}

.font-18 {
  font-size: 18px;
}

.font-36 {
  font-size: 36px;
}

/* bootstrap tun / base css ############################### */
.btn {
  border-radius: 20px;
  font-size: 12px;
}

.btn-df {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.btn-5 {
  border-radius: 5px;
}

.brdr-50 {
  border-radius: 50% !important;
}

.more a {
  min-width: 100px;
}

.icon-16 {
  width: 16px;
}

.icon-20 {
  width: 20px;
}

.icon-30 {
  width: 30px;
}

.icon-38 {
  width: 38px;
}

.icon-66 {
  width: 66px;
}

.width-100 {
  width: 100px;
}

.progress {
  height: 10px;
}

.btn-primary {
  background: #563627;
  border-color: #563627;
}

.form-round-wrap {
  padding: 15px 0;
}

.form-round-wrap input {
  background-color: #f1f1f1;
  font-size: 12px;
}

.form-round-wrap input::placeholder {
  font-size: 12px;
}

.form-round-wrap .form-round {
  border-radius: 20px;
  height: 42px;
  text-align: center;
}

.btn-lg {
  height: 52px;
}

.bg-info {
  background: linear-gradient(310deg, #2152ff 0%, #21d4fd 100%) !important;
}

.bg-danger {
  background: linear-gradient(310deg, #ea0606 0%, #ff667c 100%) !important;
}

.bg-success {
  background: linear-gradient(310deg, #17ad37 0%, #98ec2d 100%) !important;
}

.badge {
  padding: 7px 15px;
}

.badge-info {
  background: linear-gradient(310deg, #2152ff 0%, #21d4fd 100%) !important;
}

.badge-danger {
  background: linear-gradient(310deg, #ea0606 0%, #ff667c 100%) !important;
}

.badge-success {
  background: linear-gradient(310deg, #17ad37 0%, #98ec2d 100%) !important;
}

.page-item.active .page-link {
  border-color: #563627;
  background-color: #563627;
}

.page-item .page-link {
  border-radius: 50%;
  margin: 2px;
  font-size: 12px;
  color: #563627;
}

.table th,
.table td {
  padding: 1.25rem 0.75rem;
  vertical-align: middle;
}

/* bootstrap tun / base css ############################### */

.main-container {
  position: relative;
  padding-left: 250px;
  padding-bottom: 100px;
}

/* side-nav ############################### */
.side-nav {
  position: fixed;
  width: 250px;
  left: 0;
  top: 0;
  bottom: 0;
  background-color: #563627;
  z-index: 999;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.logo {
  padding: 20px;
  min-height: 80px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.logo img {
  width: 100%;
}

.menu {
  padding: 20px 0;
}

.menu a {
  padding: 10px 20px;
  display: block;
  color: #ffffff;
}

.footer {
  color: #ffffff;
  line-height: 130%;
  padding-bottom: 15px;
}

.footer-button {
  padding: 10px 20px;
}

.footer-button a {
  display: block;
  font-family: "SCDream5";
}

.footer-text {
  padding: 10px 20px;
  color: #ffffff;
  font-size: 11px;
}

.footer-text > p {
  padding: 10px 0;
  margin: 0;
  color: #ffffff;
  font-size: 24px;
  font-family: "SCDream6";
}

.footer-copyright {
  padding: 10px 20px;
  color: #ffffff;
  font-size: 9px;
}

/* side-nav ############################### */

/* 메인 공지사항 ############################### */
.notice-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0 20px;
  height: 80px;
  background-color: #fff;
}

.notice-title {
  width: 120px;
  font-size: 24px;
  font-family: "SCDream6";
}

.notice-subtitle {
  width: 200px;
}

.notice-content {
  display: flex;
  flex: 1;
  border-left: 1px solid #ddd;
  padding-left: 30px;
}

/* 메인 공지사항 ############################### */

/* 메인 content ############################### */
.main-wrap {
  margin-top: 15px;
}

.base-grid {
  background-color: #fff;
  min-height: 120px;
  border-radius: 10px;
  padding: 10px;
}

.grid-list-wrap {
  padding: 15px 20px;
}

.grid-list-wrap > div {
  margin-bottom: 10px;
}

.progress-wrap {
  width: 200px;
}

.grid-box-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.grid-box-wrap > a {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: rgb(134, 134, 134);
  background: linear-gradient(
    315deg,
    rgba(134, 134, 134, 0.2) 0%,
    rgba(134, 134, 134, 0.2) 50%,
    rgba(221, 221, 221, 0.2) 50%,
    rgba(219, 219, 219, 0.2) 100%
  );
  border-radius: 20px;
  transition: all 0.2s linear;
}

.grid-box-wrap > a:hover {
  background: rgb(134, 134, 134);
  background: linear-gradient(
    315deg,
    rgba(134, 134, 134, 0.35) 0%,
    rgba(134, 134, 134, 0.35) 50%,
    rgba(221, 221, 221, 0.35) 50%,
    rgba(219, 219, 219, 0.35) 100%
  );
  transform: scale(1.2, 1.2);
}

.grid-box-wrap > a > p {
  text-align: center;
  padding: 0;
  color: #000;
}

.grid-body-wrap form {
  padding: 0px 20px;
}

.grid-body-wrap form > input {
  margin-bottom: 10px;
  height: 56px;
  font-size: 12px;
}

.grid-body-wrap form > input::placeholder {
  font-size: 12px;
}

.grid-body-wrap ul {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 0px 20px;
  list-style: none;
  line-height: 160%;
}

.grid-body-wrap ul li:first-child {
  color: #563627;
  font-family: "SCDream5";
}

.grid-body-wrap ul li:last-child {
  margin-left: 10px;
}

.t-list-body {
  padding: 10px 25px;
}

.t-list-body > div {
  padding: 10px;
}

.t-list-body > div > .card {
  border-radius: 10px;
  background: rgb(255, 184, 0);
  background: linear-gradient(
    315deg,
    rgba(255, 184, 0, 0.2) 0%,
    rgba(255, 184, 0, 0.2) 50%,
    rgba(249, 255, 103, 0.2) 50%,
    rgba(249, 255, 103, 0.2) 100%
  );
}

.t-list {
  padding: 10px 0 10px 7px;
}

.t-list p {
  font-size: 12px;
  margin: 0;
  padding: 0;
}

.t-list h5 {
  font-size: 16px;
  margin: 0;
  padding: 0;
  font-family: "SCDream6";
}

.bg__ani {
  position: relative;
  overflow: hidden;
  z-index: 2;
}

.bg__ani::before {
  content: "";
  position: absolute;
  top: 0;
  left: -200%;
  transform: skew(45deg);
  width: 200%;
  height: 200%;
  background: linear-gradient(
    45deg,
    transparent,
    transparent,
    rgba(255, 255, 255, 0.3),
    transparent,
    transparent
  );
  animation: cate 2s linear infinite;
  z-index: 1;
}

@keyframes cate {
  100% {
    transform: translateX(200%);
  }
}

.base-grid h4 {
  font-family: "SCDream6";
}

@media (max-width: 991.98px) {
  .top-nav {
    height: 60px;
  }

  .header-wrap {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: 60px;
    padding: 0 15px;
    background-color: #563627;
    z-index: 999;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .logo-width {
    width: 160px;
  }

  .mo-right-btn {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }

  .sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 9000;
    top: 0;
    right: 0;
    background-color: #fff;
    overflow-x: hidden;
    transition: 0.2s;
    padding-top: 35px;
  }

  .sidenav .menu a {
    padding: 10px 8px 8px 10px;
    text-decoration: none;
    font-size: 14px;
    color: #000;
    display: block;
    transition: 0.3s;
    text-align: center;
  }

  .sidenav a:hover {
    color: #000;
  }

  .sidenav .closebtn {
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 36px;
    color: #000000;
  }

  .sidenav a {
    font-size: 18px;
  }

  .Sidenav-btn-mo {
    font-size: 14px;
    padding: 10px 32px 5px;
  }

  .Sidenav-btn-mo .btn {
    font-size: 14px;
  }

  .sidenav-text {
    font-size: 12px;
    padding: 32px;
    text-align: center;
  }

  .sidenav-text p {
    font-size: 24px;
    font-family: "SCDream5";
    padding-top: 12px;
  }

  .mobile-footer {
    padding: 15px;
    background-color: rgba(0, 0, 0, 0.5);
  }

  .table th,
  .table td {
    font-size: 12px;
  }

  .grid-title-wrap-rf {
    flex-direction: row !important;
  }
}

@media (min-width: 992px) {
  .top-nav {
    display: none !important;
  }

  .mobile-notice,
  .mobile-footer {
    display: none;
  }
}

@media (max-width: 991.98px) {
  .notice-wrap {
    display: none !important;
  }

  .grid-title-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
    padding: 10px 15px;
  }

  .grid-title {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    flex: 1;
    flex-wrap: wrap;
    font-size: 16px;
    font-family: "SCDream6";
  }

  .grid-title > span {
    font-size: 12px;
    font-family: "SCDream3";
    margin-left: 0px;
  }

  .grid-title > p {
    display: block;
    width: 100%;
    font-size: 12px;
    font-family: "SCDream3";
  }

  .grid-box-wrap > a {
    margin: 5px;
    padding: 5px;
  }

  .grid-box-wrap > a > p {
    margin: 5px 0 0 0;
    font-size: 10px;
  }

  .grid-form-wrap {
    padding: 10px;
  }

  .glist-body {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #eeeeee;
  }

  .glist-text {
    font-size: 12px;
  }

  .grid-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .pad-3 {
    padding: 25px;
  }

  .board-detail {
    padding: 10px 0;
    margin: 15px 0;
    font-size: 12px;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
  }
}

@media (min-width: 992px) {
  .grid-title-wrap {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 15px 20px;
  }

  .grid-title {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex: 1;
    flex-wrap: wrap;
    font-size: 24px;
    font-family: "SCDream6";
  }

  .grid-title > span {
    font-size: 14px;
    font-family: "SCDream3";
    margin-left: 10px;
  }

  .grid-title > p {
    display: block;
    width: 100%;
    font-size: 14px;
    font-family: "SCDream3";
  }

  .grid-box-wrap > a {
    margin: 10px;
    padding: 10px;
  }

  .grid-box-wrap > a > p {
    margin: 10px 0 0 0;
    font-size: 12px;
  }

  .grid-form-wrap {
    padding: 10px 25px;
  }

  .glist-body {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }

  .glist-text {
    font-size: 14px;
  }

  .mbtn-br {
    display: none;
  }

  .pad-3 {
    padding: 25px;
  }

  .board-detail {
    padding: 15px 0;
    margin: 15px 0;
    font-size: 14px;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
  }
}

/* Small devices (phones, 576px and down) */
@media (max-width: 576px) {
  .main-container {
    position: relative;
    padding-left: 0px !important;
    padding-bottom: 50px;
  }

  .side-nav {
    display: none !important;
  }

  .mobile-mt-15 {
    margin-top: 15px;
  }

  .dt-block {
    display: none;
  }

  .mo-block {
    display: block;
  }
}

/* Medium devices (tablets, 576px and 992px) */
@media (min-width: 575.98px) and (max-width: 767.98px) {
  .main-container {
    position: relative;
    padding-left: 0px !important;
    padding-bottom: 50px;
  }

  .side-nav {
    display: none !important;
  }

  .mobile-mt-15 {
    margin-top: 15px;
  }

  .dt-block {
    display: none;
  }

  .mo-block {
    display: block;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .main-container {
    position: relative;
    padding-left: 0px !important;
    padding-bottom: 50px;
  }

  .side-nav {
    display: none !important;
  }

  .mobile-mt-15 {
    margin-top: 15px;
  }

  .dt-block {
    display: block;
  }

  .mo-block {
    display: none;
  }
}

/* Large devices (desktops, 992px and 1200px) */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .dt-block {
    display: block;
  }

  .mo-block {
    display: none;
  }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  .dt-block {
    display: block;
  }

  .mo-block {
    display: none;
  }
}

.status-card {
  padding: 15px;
  border: 0;
  border-radius: 20px;
  transition: all 0.2s;
}

.status-card-blind {
  padding: 15px;
  border: 0;
  border-radius: 20px;
  transition: all 0.2s;
  -ms-user-select: none;
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

.status-card:hover {
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.2);
  transition: all 0.2s;
}

.bp-status dt {
  font-size: 12px;
  font-family: "SCDream5";
}

.bp-status dd {
  text-align: right;
  font-size: 12px;
  font-family: "SCDream5";
}

.status-card dl {
  margin-bottom: 0;
}

.status-card dl dt,
.status-card dl dd {
  display: inline-block;
  padding: 0;
  margin: 0 0 10px 0;
}

.status-card dl dt {
  width: 65px;
}

.status-card dl dd {
  width: calc(100% - 75px);
}

.status-card-blind dl {
  margin-bottom: 0;
}

.status-card-blind dl dt,
.status-card-blind dl dd {
  display: inline-block;
  padding: 0;
  margin: 0 0 10px 0;
}

.status-card-blind dl dt {
  width: 65px;
}

.status-card-blind dl dd {
  width: calc(100% - 75px);
}

.table-stt thead tr th:last-child,
.table-stt tbody tr td:last-child {
  text-align: right;
}

.table-stt tbody tr:hover {
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.02);
}

.myorder .gray-box {
  margin: 10px 0 0 0;
  border: 1px solid #d1d1d1;
  background-color: #f4f4f4;
  border-radius: 7px;
  padding: 7px 15px;
}

.myorder .gray-box p {
  margin: 0;
  padding: 0;
  font-size: 12px;
}

.myorder .gray-box p:first-child {
  color: #563627;
  font-family: "SCDream4";
}

.pd-20 {
  padding: 0 20px;
}

.scd5 {
  font-family: "SCDream5" !important;
}

.myorder-rlist {
  margin: 15px 0 25px 0;
}

.myorder-rlist dl {
  border-bottom: 1px solid #ddd;
  display: flex;
  justify-content: space-between;
  color: #6c757d !important;
  padding: 5px 0;
  font-size: 12px;
  font-family: "SCDream4" !important;
}

.myorder-rlist dl dd {
  text-align: right;
  font-size: 14px;
}

.step-chart {
  display: flex;
  justify-content: space-between;
  margin-bottom: 30px;
  position: relative;
}

.step-chart:after {
  content: "";
  position: absolute;
  top: 15px;
  width: 100%;
  border-top: 1px solid #ccc;
  z-index: 0;
}

.step-chart > div {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  font-family: "SCDream4" !important;
  border-radius: 20px;
  padding: 7px 7%;
  background-color: #aaa;
  color: #fff;
  position: relative;
  z-index: 10;
}

.step-chart > div.active {
  background-color: #563627;
}

.cupon-list-box {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 10px;
  background-color: #efefef;
  border-radius: 20px;
  padding: 10px 20px;
}

.cupon-list-box p {
  margin: 0 0 0 10px;
  padding: 0;
  font-size: 12px;
  font-family: "SCDream4" !important;
}

.grid-title-wrap-rf .btn-lg {
  height: 48px !important;
}

.q-pd-20 {
  padding: 20px;
  margin-bottom: 30px;
}

.q-pd-20 h3 {
  font-size: 18px;
  font-family: "SCDream5" !important;
  border-left: 3px solid #563627;
  padding-left: 20px;
}

.q-pd-20 > p {
  font-size: 12px;
  font-family: "SCDream4" !important;
  border-radius: 20px;
  padding: 10px 20px;
  background-color: #efefef;
}

.q-pd-20 > .row > div {
  text-align: center;
  margin-bottom: 20px;
}

@media (max-width: 991.98px) {
  #roll {
    height: 230px;
    overflow: hidden;
  }

  #roll ul,
  #roll ul li {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  #roll ul {
    position: relative;
  }

  #roll li {
    height: 80px;
  }
}

@media (min-width: 992px) {
  .boxIn ul,
  .boxIn ul li {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .boxIn ul {
    height: 52px;
  }

  .boxIn ul li {
    height: 52px;
  }

  .boxIn ul li a {
    display: block;
    font-size: 14px;
    line-height: 52px;
    color: #000;
  }

  #roll {
    height: 170px;
    overflow: hidden;
  }

  #roll ul,
  #roll ul li {
    margin: 0;
    padding: 0;
    list-style: none;
  }

  #roll ul {
    position: relative;
  }

  #roll li {
    height: 35px;
  }
}

.bank_list_open {
  display: block;
  width: 100%;
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 48px;
  color: #495057;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  margin-bottom: 10px;
  height: 56px;
  font-size: 12px;
  text-align: left;
}

.bank_selected {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0 20px;
}

.bank_selected img {
  width: 26px;
  margin-right: 5px;
}

.dropdown-menu,
.dropdown-item {
  width: 100%;
}

.dropdown-menu li {
  display: inline-block;
  width: 48%;
  height: 36px;
}

.dropdown-menu li a {
  display: block;
  height: 36px;
  line-height: 36px;
}

.dropdown-menu .dropdown-item {
  font-size: 12px;
}

.dropdown-menu img {
  width: 16px;
  margin-right: 5px;
  border-radius: 5px;
}

.dropdown-toggle::after {
  display: none !important;
}

/* pin wrapper */

.input_wrapper {
  display: grid;
  grid-gap: 0.5rem;
}

.input_wrapper .culture,
.input_wrapper .starbiz,
.input_wrapper .lotte,
.input_wrapper .google_tin {
  display: grid;
  grid-gap: 0.5rem;
  grid-template-columns: 1fr 1fr 1fr 1fr 10rem;
}

.input_wrapper .happy {
  display: grid;
  grid-gap: 0.5rem;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 10rem;
}

.input_wrapper .book {
  display: grid;
  grid-gap: 0.5rem;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 10rem;
}

.input_wrapper .culture_tin {
  display: grid;
  grid-gap: 0.5rem;
  grid-template-columns: 1fr 1fr 1fr 10rem;
}

.input_wrapper .happy_tin {
  display: grid;
  grid-gap: 0.5rem;
  grid-template-columns: 1fr 1fr 1fr 10rem;
}
.input_wrapper .book_tin {
  display: grid;
  grid-gap: 0.5rem;
  grid-template-columns: 1fr 1fr 1fr 10rem;
}
.input_wrapper .teencash {
  display: grid;
  grid-gap: 0.5rem;
  grid-template-columns: 1fr 1fr 1fr 10rem;
}

.btn_add_pin {
}

.input_wrapper .culture_tin .pin04,
.input_wrapper .happy_tin .pin04,
.input_wrapper .teencash .pin04,
.input_wrapper .book_tin .pin04 {
  display: none;
}

.input_wrapper .culture .pin05,
.input_wrapper .culture_tin .pin05,
.input_wrapper .lotte .pin05,
.input_wrapper .starbiz .pin05,
.input_wrapper .google_tin .pin05,
.input_wrapper .happy_tin .pin05,
.input_wrapper .teencash .pin05,
.input_wrapper .book_tin .pin05 {
  display: none;
}

@media all and (max-width: 580px) {
  .btn_add_pin {
    height: 4.2rem;
    grid-column: 1 / 5;
  }

  .input_wrapper .culture,
  .input_wrapper .starbiz,
  .input_wrapper .lotte,
  .input_wrapper .google_tin {
    display: grid;
    grid-gap: 0.5rem;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .input_wrapper .happy {
    display: grid;
    grid-gap: 0.5rem;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .input_wrapper .book {
    display: grid;
    grid-gap: 0.5rem;
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .input_wrapper .culture_tin,
  .input_wrapper .happy_tin,
  .input_wrapper .teencash,
  .input_wrapper .book_tin {
    display: grid;
    grid-gap: 0.5rem;
    grid-template-columns: 1fr 1fr 1fr;
  }

  .pin05 {
    grid-column: 1 / 5;
  }
}

.maintenance-wrapper {
  width: 100vw;
  height: 100vh;
  background-image: url("../img/city-438393_1920.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.maintenance-wrapper-body {
  width: 60vw;
  padding: 25px;
  background-color: rgba(255, 255, 255, 0.25);
  border-radius: 25px;
  -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
}

.blind {
  filter: blur(5px);
  -webkit-filter: blur(5px);
}
