@font-face {
  font-family: Mogul-Scriptorama;
  src: url(/public/fonts/Mogul-Scriptorama.ttf);
}
:root {
  --dark-color: rgba(0, 0, 0, 1);
  --white-color: rgba(255, 255, 255, 1);
  --blue-color: rgba(0, 123, 255, 1);
  --red-color: rgba(255, 0, 0, 1);
  --main-font: "Roboto", sans-serif;
}

::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

::-webkit-scrollbar-track {
  box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: #ff0000;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: #ff0000;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  height: 100%;
}

body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  overflow-x: hidden;
  position: relative;
  background-color: #fff;
  padding-top: 56px;
}
@media (min-width: 320px) and (max-width: 767px) {
  body {
    background-color: #F9F9F9;
    min-height: auto;
    padding-top: 0;
    padding-bottom: 56px;
  }
}
body.modal-open {
  width: calc(100% - 8px);
  padding-right: 0px !important;
}
body.modal-open header {
  right: 8px;
}
body::after {
  content: "";
  display: block;
  height: 200px;
}
@media (min-width: 320px) and (max-width: 767px) {
  body::after {
    display: none;
  }
}

.fb-page, .fb-page span, .fb-page span iframe[style] {
  width: 100% !important;
}

.fw-500 {
  font-weight: 500;
}

.lazyload, .lazyloading {
  opacity: 0;
}

.lazyloaded {
  opacity: 1;
  transition: opacity 0.3s;
}

h1, h2, h3, h4, h5, h6, p, span {
  font-family: "Roboto", sans-serif;
}

a, a:hover {
  font-family: "Roboto", sans-serif;
  text-decoration: none;
}

.lock_icon {
  width: 17px;
  height: 15px;
}
.lock_icon rect {
  fill: #F65725;
}
.lock_icon rect, .lock_icon path {
  stroke: #F65725;
}

.modal-dialog {
  max-width: 270px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .modal-dialog {
    margin: auto;
  }
}
.modal-dialog .modal-content {
  border: 0;
  border-radius: 8px;
}
.modal-dialog .modal-content .modal-header {
  padding: 0;
  border-bottom: 0;
}
.modal-dialog .modal-content .modal-header .btn-close {
  margin: 8px 8px 8px auto;
}
.modal-dialog .modal-content .modal-body {
  padding: 0 24px;
}
.modal-dialog .modal-content .modal-footer {
  border-top: 0;
  justify-content: center;
  padding: 4px 24px 14px;
}
.modal-dialog .modal-content .modal-footer .link_btn {
  padding: 8px 12px;
  display: block;
  width: 100%;
  text-align: center;
  border: 1px solid var(--dark-color);
  border-radius: 4px;
  font-size: 14px;
  color: var(--dark-color);
  transition: 0.3s ease;
}
.modal-dialog .modal-content .modal-footer .link_btn:hover {
  background: var(--dark-color);
  color: var(--white-color);
}

.tc-container {
  max-width: 1140px;
  padding: 0 24px;
  margin: 0 auto;
}
@media (min-width: 320px) and (max-width: 767px) {
  .tc-container {
    padding: 0 14px;
  }
}
.tc-container .tc-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.tc-container .tc-row .tc-col-2 {
  width: calc(16.6666666667% - 20px);
}
@media (min-width: 320px) and (max-width: 767px) {
  .tc-container .tc-row .tc-col-2 {
    width: calc(50% - 7px);
  }
  .tc-container .tc-row .tc-col-2.mobile {
    display: none;
  }
}
.tc-container .tc-row .tc-col-4 {
  width: calc(33.3333333333% - 20px);
}
@media (min-width: 320px) and (max-width: 767px) {
  .tc-container .tc-row .tc-col-4 {
    width: 100%;
    margin-bottom: 0;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    overflow: hidden;
  }
}
.tc-container .tc-row .tc-col-6 {
  width: calc(50% - 24px);
}
@media (min-width: 320px) and (max-width: 767px) {
  .tc-container .tc-row .tc-col-6 {
    width: calc(50% - 7px);
  }
}

.banner_box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

#payment {
  padding: 64px 0;
}
@media (min-width: 320px) and (max-width: 767px) {
  #payment {
    padding: 24px 0;
  }
}
#payment .payment-body {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  padding: 24px;
  background: #fff;
}
@media (min-width: 320px) and (max-width: 767px) {
  #payment .payment-body {
    padding: 14px;
  }
}

header {
  position: fixed;
  background-color: #fff;
  left: 0;
  right: 0;
  top: 0;
  padding: 12px 0;
  box-shadow: 0 4px 10px -5px rgba(0, 0, 0, 0.15);
  z-index: 999;
}
@media (min-width: 320px) and (max-width: 767px) {
  header {
    top: auto;
    bottom: 0;
  }
}
header .desktop {
  display: block;
}
header .mobile {
  display: none;
}
header .nav {
  display: flex;
}
@media (min-width: 320px) and (max-width: 767px) {
  header .nav {
    justify-content: space-between;
  }
}
header .nav_s-link {
  margin: auto 0;
}
@media (min-width: 768px) and (max-width: 1024px) {
  header .nav_s-link {
    display: none;
  }
}
header .nav_s-link svg {
  width: 26px;
  height: 26px;
}
header .nav_s-link svg path {
  fill: #000;
}
header .nav .mobile_user_popupBtn {
  padding: 0;
  background-color: transparent;
  border: 0;
  width: 100%;
  height: 100%;
  display: flex;
}
header .nav .mobile_user_popupBtn:focus {
  outline: none;
}
header .nav .mobile_user_popupBtn svg {
  width: 24px;
  height: 24px;
  margin: auto;
}
header .nav .mobile_user_popupBtn svg path {
  fill: #000;
}
header .nav .logo {
  margin-right: 32px;
}
@media (min-width: 320px) and (max-width: 767px) {
  header .nav .logo {
    margin-right: 0;
  }
}
header .nav .logo img {
  width: auto;
  height: 32px;
}
header .nav .menu {
  margin: auto 0;
}
header .nav .menu ul {
  display: flex;
  padding: 0;
  margin: 0;
  list-style: none;
}
header .nav .menu ul li {
  margin-right: 24px;
}
header .nav .menu ul li a {
  font-size: 14px;
  font-weight: 500;
  color: #000;
  text-decoration: none;
}
header .nav .menu_icon svg {
  width: 26px;
  height: 26px;
}
header .nav .menu_icon svg path {
  fill: #000;
}
header .nav_login {
  margin: auto 0 auto auto;
}
@media (min-width: 320px) and (max-width: 767px) {
  header .nav_login {
    margin: auto 0;
  }
}
header .nav_login .mr {
  margin-right: 24px;
}
header .nav_login a {
  font-size: 14px;
  font-weight: 500;
  color: #000;
  text-decoration: none;
}
header .settings {
  width: 26px;
  height: 26px;
  z-index: 5;
  margin: auto 0;
  display: none;
}
header .settings .btn-dark {
  padding: 0;
  background-color: transparent;
  border: 0;
  width: 100%;
  height: 100%;
  display: flex;
}
header .settings .btn-dark:focus {
  outline: none;
}
header .settings .btn-dark svg {
  width: 20px;
  height: 20px;
  margin: auto;
}
header .settings .btn-dark svg path {
  fill: #000;
}

@media (min-width: 320px) and (max-width: 767px) {
  #readApp header .mobile .nav .settings {
    display: flex;
    flex-wrap: wrap;
  }
}

.mobile_menu {
  position: fixed;
  right: 0;
  width: 280px;
  top: 0;
  bottom: 0;
  height: 100vh;
  background: #fff;
  transform: translateX(280px);
  transition: 0.3s ease;
  z-index: 1000;
  padding: 48px 24px;
  display: none;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .mobile_menu {
    display: block;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_menu {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    display: block;
    width: 100%;
    height: auto;
    top: auto;
    right: auto;
    left: 50%;
    bottom: 56px;
    transform: translate(-50%, 132%);
    padding: 14px 24px;
  }
}
.mobile_menu.open {
  transform: translateX(0);
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_menu.open {
    transform: translate(-50%, 0%);
  }
}
.mobile_menu .close_icon {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 32px;
  height: 32px;
  display: flex;
}
.mobile_menu .close_icon svg {
  margin: auto;
}
.mobile_menu ul {
  list-style: none;
  padding: 0;
  margin: 0 0 64px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_menu ul {
    margin: 0 0 0px;
  }
}
.mobile_menu ul li {
  margin-bottom: 12px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_menu ul li {
    margin-bottom: 6px;
  }
}
.mobile_menu ul li a {
  font-size: 16px;
  color: #000;
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_menu ul li a {
    font-size: 13px;
    font-weight: 500;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_menu .mobi_login {
    display: none;
  }
}
.mobile_menu .mobi_login .login_after {
  display: flex;
  flex-wrap: wrap;
}
.mobile_menu .mobi_login .login_after a {
  width: 100%;
  display: block;
  color: #000;
  font-size: 16px;
  margin-bottom: 12px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_menu .mobi_login .login_after a {
    font-size: 13px;
    font-weight: 500;
  }
}
.mobile_menu .mobi_login .login_after-exitBtn {
  margin-top: 30px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_menu .mobi_login .login_after-exitBtn {
    border-top: 1px solid #ececec;
    padding-top: 6px;
    margin-top: 0;
    margin-bottom: 0 !important;
  }
}
.mobile_menu .mobi_login .login_before {
  display: flex;
  justify-content: space-between;
}
.mobile_menu .mobi_login .login_before a {
  color: #000;
  font-size: 16px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_menu .mobi_login .login_before a {
    font-size: 13px;
    font-weight: 500;
  }
}

#userPopupMenu {
  position: fixed;
  background: #fff;
  z-index: 1000;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  display: block;
  width: 100%;
  height: auto;
  left: 50%;
  bottom: 56px;
  transform: translate(-50%, 140%);
  padding: 14px 24px;
  transition: 0.3s ease;
}
#userPopupMenu.open {
  transform: translate(-50%, 0%);
}
#userPopupMenu .close_icon {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 32px;
  height: 32px;
  display: flex;
}
#userPopupMenu .close_icon svg {
  margin: auto;
}
#userPopupMenu .userPopup-profile__container {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
#userPopupMenu .userPopup-profile__containerImage {
  width: 64px;
  height: 64px;
  border-radius: 500px;
  overflow: hidden;
}
#userPopupMenu .userPopup-profile__containerImage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#userPopupMenu .userPopup-profile__containerName {
  margin: auto 0 auto 14px;
}
#userPopupMenu .userPopup-profile__containerName p, #userPopupMenu .userPopup-profile__containerName span {
  color: #000;
}
#userPopupMenu .userPopup-profile__containerName p {
  font-size: 16px;
  font-weight: 500;
  margin: 0;
}
#userPopupMenu .userPopup-profile__containerName span {
  font-size: 14px;
}
#userPopupMenu .userPopup-profile__containerAmount {
  font-size: 16px;
  color: #000;
}
#userPopupMenu .userPopup-profile__containerAmount img {
  width: 22px;
  height: auto;
  margin: auto 4px 2px;
}
#userPopupMenu .userPopup-profile__containerAmount span {
  font-weight: 500;
}
#userPopupMenu .mobi_login .login_after {
  display: flex;
  flex-wrap: wrap;
}
#userPopupMenu .mobi_login .login_after a {
  width: 100%;
  display: block;
  color: #000;
  font-size: 16px;
  margin-bottom: 12px;
}
@media (min-width: 320px) and (max-width: 767px) {
  #userPopupMenu .mobi_login .login_after a {
    font-size: 13px;
    font-weight: 500;
  }
}
#userPopupMenu .mobi_login .login_after-exitBtn {
  border-top: 1px solid #ececec;
  padding-top: 6px;
  margin-bottom: 0 !important;
}
#userPopupMenu .mobi_login .login_before {
  display: flex;
  justify-content: space-between;
}
#userPopupMenu .mobi_login .login_before a {
  color: #000;
  font-size: 13px;
  font-weight: 500;
}

#menuBack, #userPopupMenuBack {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  height: 100vh;
  background: rgba(0, 0, 0, 0.4);
  z-index: 998;
  display: none;
}
#menuBack.open, #userPopupMenuBack.open {
  display: block;
}

#footer {
  background: #fff;
  box-shadow: 0 -2px 10px -5px rgba(0, 0, 0, 0.4);
  padding: 30px 0;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
}
@media (min-width: 320px) and (max-width: 767px) {
  #footer {
    display: none;
  }
}
#footer::after {
  content: "";
  position: absolute;
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: contain;
  z-index: 3;
  height: 140px;
  width: 140px;
  bottom: 0;
  left: 0;
}
#footer .logo_footer .img {
  width: 130px;
  margin: auto auto 30px;
}
#footer .logo_footer .img img {
  width: 100%;
}
#footer .logo_footer .copyright, #footer .logo_footer .develop {
  display: flex;
  justify-content: center;
  text-align: center;
  font-size: 14px;
}
#footer .logo_footer .copyright p, #footer .logo_footer .develop p {
  margin: 0;
  font-size: 14px;
}
#footer .logo_footer .copyright {
  color: #000;
}
#footer .logo_footer .develop {
  color: #000;
}
#footer .logo_footer .develop a {
  color: #ff0000;
}
#footer .list-group {
  border: 0;
  color: #000;
}
#footer .list-group .tt {
  font-size: 16px;
  color: #000;
  margin-bottom: 15px;
}
@media (min-width: 768px) and (max-width: 1024px) {
  #footer .list-group .tt {
    font-size: 14px;
  }
}
#footer .list-group .link {
  display: block;
  color: #000;
  font-size: 13px;
  margin-bottom: 10px;
  transition: color 0.3s ease;
}
@media (min-width: 768px) and (max-width: 1024px) {
  #footer .list-group .link {
    font-size: 12px;
  }
}
#footer .list-group .link:last-child {
  margin-bottom: 0;
}
#footer .list-group .link:hover {
  color: #ff0000;
}

#faq .tc-container {
  max-width: 800px;
}
#faq .faq-list .bg-tt {
  font-size: 32px;
  text-align: center;
  margin-bottom: 48px;
}
#faq .faq-list ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#faq .faq-list ul li {
  margin-bottom: 24px;
}
#faq .faq-list ul li:last-child {
  margin-bottom: 0;
}
#faq .faq-list ul li .list-box .tt {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 4px;
}
#faq .faq-list ul li .list-box .text {
  font-size: 14px;
  padding-left: 12px;
}

.tc_card {
  margin-bottom: 32px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .tc_card {
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 14px;
  }
}
.tc_card:hover .tc_card-image::after {
  left: 140%;
  transition: left 0.4s ease-in;
}
.tc_card:hover .tc_card-image img {
  transform: scale(1.06);
}
.tc_card-image {
  display: flex;
  overflow: hidden;
  width: 100%;
  height: 240px;
  position: relative;
  z-index: 4;
}
@media (min-width: 320px) and (max-width: 767px) {
  .tc_card-image {
    height: 60vw;
  }
}
.tc_card-image::after {
  content: "";
  position: absolute;
  top: 0;
  left: -80%;
  z-index: 3;
  display: block;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, hsla(0deg, 0%, 100%, 0) 0, hsla(0deg, 0%, 100%, 0.3));
  transform: skewX(-25deg);
  transition: left 0s ease;
}
.tc_card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  transform: scale(1);
  transition: 0.4s ease;
}
.tc_card-body {
  margin: 12px 0 0;
}
@media (min-width: 320px) and (max-width: 767px) {
  .tc_card-body {
    margin: 0;
    padding: 12px;
  }
}
.tc_card-body .tt {
  font-size: 14px;
  height: 32px;
  color: #000;
  margin-bottom: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
@media (min-width: 320px) and (max-width: 767px) {
  .tc_card-body .tt {
    font-size: 13px;
  }
}

.title_banner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 24px;
}
.title_banner .left .tt {
  font-size: 32px;
  margin-bottom: 8px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .title_banner .left .tt {
    font-size: 18px;
    margin-bottom: 8px;
  }
}
.title_banner .left .desc {
  font-size: 16px;
  margin: 0;
}
@media (min-width: 320px) and (max-width: 767px) {
  .title_banner .left .desc {
    font-size: 12px;
  }
}
.title_banner .link_btn {
  margin: auto 0;
  color: #007bff;
  font-size: 16px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .title_banner .link_btn {
    font-size: 14px;
  }
}

.home_section {
  width: 100%;
}
.home_section .video-slider {
  margin-bottom: 64px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .video-slider {
    margin-bottom: 32px;
  }
}
.home_section .video-slider .full {
  width: 100%;
  height: 600px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .video-slider .full {
    height: 210px;
  }
}
.home_section .video-slider .full video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.home_section .video-slider .detail {
  z-index: 5;
  position: relative;
  background-color: #fff;
  border-radius: 8px;
  display: flex;
  flex-wrap: wrap;
  padding: 30px;
  max-width: 800px;
  margin: -78px auto 0;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .video-slider .detail {
    max-width: 284px;
    margin: -32px auto 0;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .video-slider .detail.login {
    padding: 14px 30px 24px;
  }
  .home_section .video-slider .detail.login .tt {
    margin-bottom: 10px;
  }
}
.home_section .video-slider .detail .tt {
  width: 100%;
  font-family: "Mogul-Scriptorama" !important;
  font-size: 35px;
  color: #000;
  font-weight: 700;
  letter-spacing: 3px;
  text-align: center;
  margin-bottom: 32px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .video-slider .detail .tt {
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 32px;
  }
}
.home_section .video-slider .detail .link_btn {
  margin: 0 auto;
  width: max-content;
  border-radius: 500px;
  background-color: #000;
  color: #fff;
  font-weight: 600;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
  padding: 12px 32px;
  font-size: 14px;
  text-transform: uppercase;
  transition: 0.3s ease;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .video-slider .detail .link_btn {
    padding: 8px 32px;
    font-size: 12px;
  }
}
.home_section .video-slider .detail .link_btn:hover {
  color: #000;
  background-color: #fff;
}
.home_section .most_viewed, .home_section .last_novels {
  margin-bottom: 32px;
}
.home_section .most_viewed .desktop, .home_section .most_viewed .mobile {
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .most_viewed .desktop .tc-col-2, .home_section .most_viewed .mobile .tc-col-2 {
    width: calc(25% - 7px);
  }
}
.home_section .most_viewed .desktop {
  display: flex;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .most_viewed .desktop {
    display: none;
  }
}
.home_section .most_viewed .mobile {
  display: none;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .most_viewed .mobile {
    display: flex;
  }
  .home_section .most_viewed .mobile .tc_card-image {
    height: 28vw;
  }
  .home_section .most_viewed .mobile .tc_card-body .tt {
    font-size: 12px;
    height: 29px;
  }
}
.home_section .last_chapters {
  margin-bottom: 42px;
}
.home_section .last_chapters .content .big_title {
  margin-bottom: 14px;
}
.home_section .last_chapters .content .big_title .bg_tt {
  font-size: 32px;
  color: #000;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .last_chapters .content .big_title .bg_tt {
    font-size: 18px;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .home_section .last_chapters .content .table {
    width: 1000px;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .last_chapters .content .table {
    width: 800px;
  }
}
.home_section .last_chapters .content .table thead th {
  padding: 0.75rem;
  font-size: 16px;
  font-weight: 500;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .last_chapters .content .table thead th {
    font-size: 14px;
  }
}
.home_section .last_chapters .content .table tbody tr:last-child td {
  border-bottom: 0;
}
.home_section .last_chapters .content .table tbody td {
  padding: 7px 12px 1px;
}
.home_section .last_chapters .content .table tbody a {
  padding: 5px 0;
  max-width: 300px;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #000;
  font-size: 14px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .last_chapters .content .table tbody a {
    font-size: 12px;
  }
}
.home_section .last_chapters .content .table tbody a, .home_section .last_chapters .content .table tbody .tc_custom-btn {
  position: relative;
}
.home_section .last_chapters .content .table tbody a:hover::after, .home_section .last_chapters .content .table tbody .tc_custom-btn:hover::after {
  left: 0;
  right: auto;
  width: 100%;
}
.home_section .last_chapters .content .table tbody a::after, .home_section .last_chapters .content .table tbody .tc_custom-btn::after {
  content: "";
  position: absolute;
  left: auto;
  right: 0;
  height: 1px;
  width: 0;
  background-color: red;
  bottom: 0;
  transition: 0.4s ease-in;
}
.home_section .last_chapters .content .table tbody .tc_custom-btn {
  padding: 5px 0;
  background-color: transparent;
  padding: 0;
  font-size: 14px;
  border: 0;
  text-align: left;
}
.home_section .last_chapters .content .table tbody .tc_custom-btn .lock_icon {
  margin-bottom: 5px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .last_chapters .content .table tbody .tc_custom-btn {
    font-size: 12px;
  }
}
.home_section .last_chapters .content .table tbody span {
  padding: 5px 0;
  max-width: 182px;
  color: #000;
  font-size: 14px;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media (min-width: 320px) and (max-width: 767px) {
  .home_section .last_chapters .content .table tbody span {
    font-size: 12px;
  }
}

.novel-list-page {
  margin-bottom: 30px;
  padding-top: 40px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page {
    padding-top: 24px;
    margin-bottom: 12px;
  }
}
.novel-list-page .list {
  margin-top: 60px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .list {
    margin-top: 32px;
  }
}
.novel-list-page .list .card {
  border: 0;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .list .card {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    margin-bottom: 16px !important;
  }
}
.novel-list-page .list .card:hover .img img {
  transform: scale(1.04);
}
.novel-list-page .list .card:hover .img::before {
  left: 135%;
  transition: left 0.6s ease-in;
}
.novel-list-page .list .card .img {
  display: flex;
  overflow: hidden;
  width: 100%;
  height: 232px;
  position: relative;
  z-index: 4;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .list .card .img {
    height: 54vw;
    margin-bottom: 12px;
  }
}
.novel-list-page .list .card .img::before {
  content: "";
  position: absolute;
  top: 0;
  left: -85%;
  z-index: 3;
  display: block;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  transform: skewX(-25deg);
  transition: left 0s ease;
}
.novel-list-page .list .card .img img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  color: transparent;
  transform: scale(1);
  transition: 0.3s ease-in;
}
.novel-list-page .list .card .card-body {
  padding: 0;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .list .card .card-body {
    padding: 0 0 12px;
  }
}
.novel-list-page .list .card .card-body .card-title {
  font-size: 24px;
  color: #000;
  height: 56px;
  margin-bottom: 12px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .list .card .card-body .card-title {
    font-size: 14px;
    height: 34px;
    margin-bottom: 8px;
    padding: 0 8px;
    text-align: center;
  }
}
.novel-list-page .list .card .card-body .card-author, .novel-list-page .list .card .card-body .card-translator {
  font-size: 14px;
  color: #000;
  margin-bottom: 4px;
}
.novel-list-page .list .card .card-body .card-author span, .novel-list-page .list .card .card-body .card-translator span {
  font-weight: 500;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .list .card .card-body .card-author, .novel-list-page .list .card .card-body .card-translator {
    display: none;
  }
}
.novel-list-page .list .card .card-body .card-translator {
  margin-bottom: 12px;
}
.novel-list-page .list .card .card-body .card-text {
  font-size: 13px !important;
  color: #000;
  overflow: hidden;
  display: -webkit-box;
  height: 95px;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .list .card .card-body .card-text {
    font-size: 12px !important;
    height: 90px;
    text-align: center;
    padding: 0 8px;
  }
}
.novel-list-page .list .card .card-body .card-text span {
  font-size: 13px !important;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .list .card .card-body .card-text span {
    font-size: 12px !important;
  }
}
.novel-list-page .category-page {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  padding: 15px 30px 15px;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .category-page {
    padding: 14px 18px;
    border-radius: 8px;
  }
}
.novel-list-page .category-page .full {
  width: 100%;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .category-page .full {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 16px;
  }
}
.novel-list-page .category-page .half {
  margin-right: 64px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .category-page .half {
    margin-right: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
  }
}
.novel-list-page .category-page .half:last-child {
  margin-right: 0;
}
.novel-list-page .category-page .tt {
  font-size: 18px;
  margin-top: 15px;
  margin-bottom: 15px;
  border-bottom: 2px solid #ff0000;
  padding-bottom: 5px;
  display: inline-block;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .category-page .tt {
    margin-top: 8px;
    font-size: 16px;
  }
}
.novel-list-page .category-page .cat_list {
  padding: 0;
  margin: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .category-page .cat_list {
    justify-content: center;
    width: 100%;
    gap: 14px;
  }
}
.novel-list-page .category-page .cat_list li {
  margin: 0 25px 15px 0;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .category-page .cat_list li {
    margin: 0;
  }
}
.novel-list-page .category-page .cat_list li.active a::after {
  width: 100%;
}
.novel-list-page .category-page .cat_list li a {
  font-size: 14px;
  color: #000;
  position: relative;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .category-page .cat_list li a {
    font-size: 13px;
  }
}
.novel-list-page .category-page .cat_list li a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -3px;
  width: 0;
  height: 1px;
  background-color: #ff0000;
  transition: 0.3s ease-in;
}
.novel-list-page .category-page .cat_list li a:hover::after {
  width: 100%;
}
.novel-list-page .custom_pagination {
  margin-top: 30px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .custom_pagination {
    margin-top: 16px;
  }
}
.novel-list-page .custom_pagination .pagination {
  justify-content: center;
}
.novel-list-page .custom_pagination .page-item {
  margin-right: 5px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list-page .custom_pagination .page-item {
    margin-right: 6px;
    border-radius: 8px;
    overflow: hidden;
  }
}
.novel-list-page .custom_pagination .page-item:last-child {
  margin-right: 0;
}
.novel-list-page .custom_pagination .page-item.active .page-link {
  color: #fff;
  background-color: #000;
}
.novel-list-page .custom_pagination .page-item .page-link {
  border-radius: 0 !important;
  border: 0;
  color: #000;
  font-size: 14px;
  transition: 0.3s ease;
}
.novel-list-page .custom_pagination .page-item .page-link:focus {
  outline: none;
  box-shadow: none;
}
.novel-list-page .custom_pagination .page-item .page-link:hover {
  color: #fff;
  background-color: #000;
}

.novel-page {
  margin-bottom: 60px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page {
    margin-bottom: 24px;
  }
}
.novel-page .list_full_back {
  position: absolute;
  height: 350px;
  left: 0;
  right: 0;
  width: 100%;
  background-color: #ececee;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  z-index: -1;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .list_full_back {
    height: 60vw;
    background-image: url("../../images/novel-ls-back.jpg");
  }
}
.novel-page .novel_info {
  padding-top: 50px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info {
    padding-top: 24px;
  }
  .novel-page .novel_info .col-3 {
    width: 100%;
  }
  .novel-page .novel_info .col-6 {
    width: 100%;
  }
}
.novel-page .novel_info .img {
  display: flex;
  overflow: hidden;
  width: 100%;
  height: 380px;
  position: relative;
  z-index: 4;
  box-shadow: 0px 0px 14px 4px rgba(0, 0, 0, 0.15);
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .img {
    width: 60%;
    height: 79vw;
    margin: 0 auto 24px;
    border-radius: 8px;
  }
}
.novel-page .novel_info .img::before {
  content: "";
  position: absolute;
  top: 0;
  left: -85%;
  z-index: 3;
  display: block;
  width: 50%;
  height: 100%;
  background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  -webkit-transform: skewX(-25deg);
  transform: skewX(-25deg);
  transition: left 0s ease;
}
.novel-page .novel_info .img img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  color: transparent;
}
.novel-page .novel_info .img:hover::before {
  left: 135%;
  transition: left 0.5s ease-in;
}
.novel-page .novel_info-banner {
  display: none;
}
.novel-page .novel_info .detail {
  padding-left: 24px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail {
    padding-left: 0;
  }
}
.novel-page .novel_info .detail .tag_desc {
  display: none;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .tag_desc {
    display: flex;
  }
}
.novel-page .novel_info .detail .det-title {
  font-size: 24px;
  margin-bottom: 30px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .det-title {
    font-size: 18px;
    margin-bottom: 12px;
    text-align: center;
  }
}
.novel-page .novel_info .detail .chp_view_like {
  display: flex;
  margin-bottom: 15px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .chp_view_like {
    justify-content: center;
  }
}
.novel-page .novel_info .detail .chp_view_like .box {
  display: flex;
  margin-right: 30px;
}
.novel-page .novel_info .detail .chp_view_like .box:last-child {
  margin-right: 0;
}
.novel-page .novel_info .detail .chp_view_like .box .icon {
  width: 20px;
  margin-right: 10px;
}
.novel-page .novel_info .detail .chp_view_like .box .icon img {
  width: 100%;
}
.novel-page .novel_info .detail .chp_view_like .box .text {
  font-size: 14px;
  color: #000;
  margin: auto;
}
.novel-page .novel_info .detail .author_translate {
  display: flex;
  margin-bottom: 15px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .author_translate {
    justify-content: center;
  }
}
.novel-page .novel_info .detail .author_translate .line {
  font-size: 14px;
  color: #000;
  margin-right: 30px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .author_translate .line {
    margin-right: 14px;
  }
}
.novel-page .novel_info .detail .author_translate .line:last-child {
  margin-right: 0;
}
.novel-page .novel_info .detail .category {
  margin-bottom: 15px;
}
.novel-page .novel_info .detail .category .line {
  display: flex;
  flex-wrap: wrap;
  font-size: 14px;
  color: #000;
  margin-right: 30px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .category .line {
    margin-right: 0;
    justify-content: center;
  }
}
.novel-page .novel_info .detail .category .line span {
  margin-right: 10px;
}
.novel-page .novel_info .detail .category .line a {
  position: relative;
  display: inline-block;
  margin-right: 10px;
}
.novel-page .novel_info .detail .category .line a:last-child {
  margin-right: 0;
}
.novel-page .novel_info .detail .category .line a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0px;
  width: 0;
  height: 1px;
  background-color: #ff0000;
  transition: 0.3s ease-in;
}
.novel-page .novel_info .detail .category .line a:hover::after {
  width: 100%;
}
.novel-page .novel_info .detail .status_release {
  display: flex;
  margin-bottom: 15px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .status_release {
    flex-wrap: wrap;
    margin-bottom: 0;
    justify-content: center;
  }
}
.novel-page .novel_info .detail .status_release .line {
  font-size: 14px;
  color: #000;
  margin-right: 30px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .status_release .line {
    margin-bottom: 14px;
    margin-right: 14px;
  }
}
.novel-page .novel_info .detail .status_release .line:last-child {
  margin-right: 0;
}
.novel-page .novel_info .detail .buttons {
  display: flex;
  margin-top: 60px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .buttons {
    margin-top: 12px;
    margin-bottom: 32px;
    justify-content: center;
  }
}
.novel-page .novel_info .detail .buttons .read_btn, .novel-page .novel_info .detail .buttons .sub_btn {
  position: relative;
  display: inline-block;
  margin-left: 0;
  margin-right: 30px;
  background-color: #ffffff;
  width: 120px;
  text-align: center;
  padding: 8px 0;
  box-shadow: 0 0 20px -2px rgba(0, 0, 0, 0.15);
  transition: 0.3s ease-in;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .novel_info .detail .buttons .read_btn, .novel-page .novel_info .detail .buttons .sub_btn {
    border-radius: 500px;
  }
}
.novel-page .novel_info .detail .buttons .read_btn span, .novel-page .novel_info .detail .buttons .sub_btn span {
  margin: auto;
  font-size: 14px;
  font-weight: 500;
  color: #000;
  text-transform: uppercase;
}
.novel-page .novel_info .detail .buttons .read_btn:hover, .novel-page .novel_info .detail .buttons .sub_btn:hover {
  box-shadow: 0 0 20px 2px rgba(0, 0, 0, 0.3);
}
.novel-page .novel_info .detail .buttons .read_btn:last-of-type, .novel-page .novel_info .detail .buttons .sub_btn:last-of-type {
  margin-right: 0;
}
.novel-page .novel_info .detail .buttons .sub_btn {
  margin-right: 0;
}
.novel-page .tag_desc {
  margin-top: 50px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .tag_desc {
    margin-top: 0;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .tag_desc .desk {
    display: none;
  }
}
.novel-page .tag_desc .tt {
  font-size: 24px;
  color: #000;
  font-weight: 500;
  margin-bottom: 20px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .tag_desc .tt {
    font-size: 16px;
    text-align: center;
    margin-bottom: 8px;
  }
}
.novel-page .tag_desc .des {
  margin-bottom: 30px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .tag_desc .des {
    margin-bottom: 24px;
    text-align: center;
  }
}
.novel-page .tag_desc .des p {
  color: #000;
  font-size: 14px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .tag_desc .des p {
    font-size: 13px;
    margin-bottom: 8px;
  }
}
.novel-page .tag_desc .des p span {
  font-size: 14px !important;
  font-family: "Roboto", sans-serif !important;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .tag_desc .des p span {
    font-size: 13px !important;
  }
}
.novel-page .tag_desc .tags {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .tag_desc .tags {
    justify-content: center;
    gap: 8px;
  }
}
.novel-page .tag_desc .tags a {
  padding: 5px 10px;
  color: red;
  background-color: rgba(255, 0, 0, 0.06);
  border-radius: 500px;
  font-size: 13px;
  transition: 0.3s ease-in;
  margin-right: 10px;
  margin-bottom: 15px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .tag_desc .tags a {
    font-size: 12px;
    margin-right: 0;
    margin-bottom: 0;
    padding: 4px 8px;
  }
}
.novel-page .tag_desc .tags a:hover {
  color: #fff;
  background-color: red;
}
.novel-page .chapter_list {
  margin-top: 40px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list {
    margin-top: 32px;
  }
}
.novel-page .chapter_list .acc_title {
  padding: 30px 0 10px;
  margin: 0 20px 20px;
  font-size: 24px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.7);
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .acc_title {
    padding: 18px 0 8px;
    font-size: 16px;
    margin: 0 14px 16px;
  }
}
.novel-page .chapter_list .accordion {
  box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.15);
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion {
    border-radius: 8px;
    overflow: hidden;
  }
}
.novel-page .chapter_list .accordion .intro-pagi {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 24px;
  padding: 0 24px;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .novel-page .chapter_list .accordion .intro-pagi {
    justify-content: center;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .intro-pagi {
    padding: 0 12px;
    justify-content: center;
  }
}
.novel-page .chapter_list .accordion .intro-pagi_right {
  display: flex;
  justify-content: space-between;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .novel-page .chapter_list .accordion .intro-pagi_right {
    width: 100%;
    margin-top: 24px;
    justify-content: center;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .intro-pagi_right {
    width: 100%;
    margin-top: 12px;
    flex-wrap: wrap;
    justify-content: center;
  }
}
@media (min-width: 320px) and (max-width: 372px) {
  .novel-page .chapter_list .accordion .intro-pagi_right {
    width: 100%;
    justify-content: flex-start;
  }
}
.novel-page .chapter_list .accordion .intro-pagi .search-chapter {
  margin-right: 24px;
  width: 100%;
  max-width: 320px;
  height: 33px;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .novel-page .chapter_list .accordion .intro-pagi .search-chapter {
    margin-right: 0;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .intro-pagi .search-chapter {
    margin-right: 0;
  }
}
.novel-page .chapter_list .accordion .intro-pagi .search-chapter form {
  width: 100%;
  height: 100%;
  display: flex;
}
.novel-page .chapter_list .accordion .intro-pagi .search-chapter form input {
  width: calc(100% - 128px);
  height: 100%;
  background-color: #f9f9f9;
  border: 0;
  padding: 0 12px;
  border-radius: 4px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  font-size: 14px;
}
.novel-page .chapter_list .accordion .intro-pagi .search-chapter form button {
  width: 120px;
  height: 100%;
  background-color: #121212;
  box-shadow: 0 0 20px -4px rgba(0, 0, 0, 0.15);
  border: 0;
  margin-left: 8px;
  font-size: 14px;
  color: #fff;
  border-radius: 4px;
}
@media (min-width: 320px) and (max-width: 372px) {
  .novel-page .chapter_list .accordion .intro-pagi .custom_pagination {
    width: 100%;
    display: flex;
  }
}
.novel-page .chapter_list .accordion .intro-pagi .custom_pagination .pagination {
  margin: 0;
  padding: 0;
}
.novel-page .chapter_list .accordion .intro-pagi .custom_pagination .pagination .page-item {
  margin-right: 8px;
}
.novel-page .chapter_list .accordion .intro-pagi .custom_pagination .pagination .page-item.disabled {
  display: none;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .intro-pagi .custom_pagination .pagination .page-item {
    margin-right: 6px;
    border-radius: 8px;
    overflow: hidden;
  }
}
.novel-page .chapter_list .accordion .intro-pagi .custom_pagination .pagination .page-item:last-child {
  margin-right: 0;
}
.novel-page .chapter_list .accordion .intro-pagi .custom_pagination .pagination .page-item.active .page-link {
  color: #fff;
  background-color: #000;
}
.novel-page .chapter_list .accordion .intro-pagi .custom_pagination .pagination .page-item .page-link {
  border-radius: 0 !important;
  box-shadow: 0 0 20px -4px rgba(0, 0, 0, 0.15);
  border: 0;
  color: #000;
  font-size: 14px;
  transition: 0.3s ease;
}
.novel-page .chapter_list .accordion .intro-pagi .custom_pagination .pagination .page-item .page-link:focus {
  outline: none;
  box-shadow: none;
}
.novel-page .chapter_list .accordion .intro-pagi .custom_pagination .pagination .page-item .page-link:hover {
  color: #fff;
  background-color: #000;
}
.novel-page .chapter_list .accordion .intro-pagi .order-btn {
  margin-left: 24px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .intro-pagi .order-btn {
    margin-left: 14px;
  }
}
@media (min-width: 320px) and (max-width: 372px) {
  .novel-page .chapter_list .accordion .intro-pagi .order-btn {
    margin-top: 12px;
    margin-left: 0;
  }
}
.novel-page .chapter_list .accordion .intro-pagi .order-btn a {
  width: 33px;
  height: 33px;
  background-color: #fff;
  box-shadow: 0 0 20px -4px rgba(0, 0, 0, 0.15);
  padding: 4px;
  display: flex;
  justify-content: center;
  color: #000;
}
.novel-page .chapter_list .accordion .intro-pagi .order-btn a.hide {
  display: none;
}
.novel-page .chapter_list .accordion .intro-pagi .order-btn a svg {
  width: 100%;
  height: 100%;
}
.novel-page .chapter_list .accordion .lst_chapter {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0 24px 32px;
  margin: 0;
  list-style: none;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .lst_chapter {
    padding: 0 12px 12px;
  }
}
.novel-page .chapter_list .accordion .lst_chapter a {
  display: inline-block;
  width: 100%;
}
.novel-page .chapter_list .accordion .lst_chapter .li-col-2 {
  width: 48%;
  border-bottom: 1px solid #d6d6d6;
  padding: 10px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0);
  transition: 0.1s ease;
  margin-bottom: 10px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .lst_chapter .li-col-2 {
    width: 100%;
    padding: 0;
  }
}
.novel-page .chapter_list .accordion .lst_chapter .li-col-2:hover {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .lst_chapter .li-col-2:hover {
    padding: 8px 8px 0;
  }
}
.novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links {
  padding: 5px;
  display: flex;
  height: 100%;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links {
    padding: 0 0 8px;
  }
}
.novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links:hover {
  cursor: pointer;
}
.novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links .lock_icon {
  margin: 4px 0 auto;
}
.novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links .num {
  font-size: 24px;
  color: #000;
  margin: auto 15px auto 0;
  transition: 0.2s ease-in;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links .num {
    display: none;
  }
}
.novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links .hh {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links .hh .st {
  width: 100%;
  font-size: 16px;
  color: #000;
  margin: 0 0 auto;
  transition: 0.2s ease-in;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links .hh .st {
    font-size: 13px;
    font-weight: 500;
  }
}
.novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links .hh .bs {
  width: 100%;
  font-size: 13px;
  color: #a2a2a2;
  margin: auto 0 10px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-page .chapter_list .accordion .lst_chapter .li-col-2 .links .hh .bs {
    font-size: 12px;
    margin: auto 0 0;
  }
}

body.dark {
  background-color: #000;
}
body.dark header {
  background: #121212;
}
body.dark header .nav {
  filter: invert(1) hue-rotate(180deg);
}
body.dark header img {
  filter: invert(1) hue-rotate(180deg);
}
body.dark .mobile_menu {
  background: #121212;
}
body.dark .mobile_menu ul li a {
  color: #f2f2f2;
}
body.dark .mobile_menu .close_icon svg {
  fill: #f2f2f2;
}
body.dark #userPopupMenu {
  background: #121212;
}
body.dark #userPopupMenu .close_icon svg {
  fill: #f2f2f2;
}
body.dark #userPopupMenu .userPopup-profile__containerAmount img {
  filter: invert(1) hue-rotate(180deg);
}
body.dark #userPopupMenu .userPopup-profile__containerName p, body.dark #userPopupMenu .userPopup-profile__containerName span, body.dark #userPopupMenu .userPopup-profile__containerAmount, body.dark #userPopupMenu .mobi_login .login_after a {
  color: #f2f2f2;
}
body.dark .read-page {
  background-color: #121212;
}
body.dark .read-page .br-bot_1 {
  border-bottom: 0;
}
body.dark .read-page .br-top_1 {
  border-top: 0;
}
body.dark .read-page .tc-container .button_group .prev, body.dark .read-page .tc-container .button_group .next, body.dark .read-page .tc-container .button_group .nl_tt {
  background-color: #121212;
}
body.dark .read-page .tc-container .button_group .prev svg, body.dark .read-page .tc-container .button_group .next svg {
  fill: #f2f2f2;
}
body.dark .read-page .tc-container .button_group .nl_tt .tt a {
  color: #f2f2f2;
}
body.dark .read-page .tc-container .body {
  background-color: #121212;
  color: #f2f2f2;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
body.dark .read-page .tc-container .body .bg_tt h1 {
  color: #f2f2f2;
}
body.dark #footer {
  background: #121212;
}
body.dark #footer .container {
  filter: invert(1) hue-rotate(180deg);
}
body.dark #footer img {
  filter: invert(1) hue-rotate(180deg);
}

.read-page {
  margin-top: -56px;
  padding-top: 124px;
  padding-bottom: 64px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .read-page {
    margin-top: 0;
    padding-top: 24px;
    padding-bottom: 32px;
  }
}
.read-page button:focus {
  outline: none;
  box-shadow: none;
}
.read-page .br-t_l {
  border-top-left-radius: 8px;
}
.read-page .br-t_r {
  border-top-right-radius: 8px;
}
.read-page .br-b_l {
  border-bottom-left-radius: 8px;
}
.read-page .br-b_r {
  border-bottom-right-radius: 8px;
}
.read-page .br-top_1 {
  border-top: 1px solid #ececec;
}
.read-page .br-bot_1 {
  border-bottom: 1px solid #ececec;
}
.read-page .tc-container {
  max-width: 900px;
}
.read-page .tc-container .row {
  position: relative;
  z-index: 1;
}
.read-page .tc-container .button_group {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 0;
}
.read-page .tc-container .button_group .prev, .read-page .tc-container .button_group .next, .read-page .tc-container .button_group .nl_tt {
  position: relative;
  background-color: #fff;
}
.read-page .tc-container .button_group .prev #boxShadow_next, .read-page .tc-container .button_group .prev #boxShadow_prev, .read-page .tc-container .button_group .prev #boxShadow_banner, .read-page .tc-container .button_group .prev #bottomShadow_next, .read-page .tc-container .button_group .prev #bottomShadow_prev, .read-page .tc-container .button_group .prev #bottomShadow_banner, .read-page .tc-container .button_group .next #boxShadow_next, .read-page .tc-container .button_group .next #boxShadow_prev, .read-page .tc-container .button_group .next #boxShadow_banner, .read-page .tc-container .button_group .next #bottomShadow_next, .read-page .tc-container .button_group .next #bottomShadow_prev, .read-page .tc-container .button_group .next #bottomShadow_banner, .read-page .tc-container .button_group .nl_tt #boxShadow_next, .read-page .tc-container .button_group .nl_tt #boxShadow_prev, .read-page .tc-container .button_group .nl_tt #boxShadow_banner, .read-page .tc-container .button_group .nl_tt #bottomShadow_next, .read-page .tc-container .button_group .nl_tt #bottomShadow_prev, .read-page .tc-container .button_group .nl_tt #bottomShadow_banner {
  position: absolute;
  background-color: rgb(0, 0, 0);
  top: 50%;
  left: 50%;
  z-index: -10;
  filter: blur(30px);
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  transform: translate(-50%, -50%);
}
.read-page .tc-container .button_group .prev #boxShadow_banner, .read-page .tc-container .button_group .prev #bottomShadow_banner, .read-page .tc-container .button_group .next #boxShadow_banner, .read-page .tc-container .button_group .next #bottomShadow_banner, .read-page .tc-container .button_group .nl_tt #boxShadow_banner, .read-page .tc-container .button_group .nl_tt #bottomShadow_banner {
  height: calc(100% - 54px);
}
.read-page .tc-container .button_group .prev, .read-page .tc-container .button_group .next {
  width: 80px;
  height: 80px;
  display: flex;
}
.read-page .tc-container .button_group .prev svg, .read-page .tc-container .button_group .next svg {
  width: 36px;
  height: 36px;
}
.read-page .tc-container .button_group .prev a, .read-page .tc-container .button_group .next a {
  margin: auto;
}
.read-page .tc-container .button_group .prev button, .read-page .tc-container .button_group .next button {
  border: 0;
  outline: none;
  background: transparent;
  margin: auto;
}
.read-page .tc-container .button_group .prev svg {
  transform: rotate(180deg);
}
.read-page .tc-container .button_group .nl_tt {
  width: calc(100% - 160px);
  display: flex;
}
.read-page .tc-container .button_group .nl_tt .tt {
  text-align: center;
  margin: auto;
  font-size: 24px;
  display: flex;
}
@media (min-width: 320px) and (max-width: 767px) {
  .read-page .tc-container .button_group .nl_tt .tt {
    font-size: 16px;
    height: 48px;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
}
.read-page .tc-container .button_group .nl_tt .tt a {
  color: #000;
  display: block;
  margin: auto;
}
.read-page .tc-container .body {
  position: relative;
  padding: 30px 30px;
  border-radius: 0px;
  background-color: #fff;
}
@media (min-width: 320px) and (max-width: 767px) {
  .read-page .tc-container .body {
    padding: 20px;
  }
}
.read-page .tc-container .body .banner {
  margin-top: 64px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .read-page .tc-container .body .banner {
    border-radius: 4px;
    overflow: hidden;
  }
}
.read-page .tc-container .body .banner img {
  width: 100%;
}
.read-page .tc-container .body #boxShadow {
  position: absolute;
  background-color: rgb(0, 0, 0);
  top: 50%;
  left: 50%;
  z-index: -10;
  filter: blur(30px);
  width: calc(100% - 70px);
  height: calc(100% - 80px);
  transform: translate(-50%, -50%);
}
.read-page .tc-container .body .bg_tt {
  width: 100%;
  margin-bottom: 32px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .read-page .tc-container .body .bg_tt {
    margin-bottom: 24px;
  }
}
.read-page .tc-container .body .bg_tt h1 {
  font-weight: 500;
  font-size: 16px;
}
.read-page .settings {
  position: fixed;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-wrap: wrap;
  width: 70px;
  z-index: 5;
}
@media (min-width: 320px) and (max-width: 767px) {
  .read-page .settings {
    display: none;
  }
}
.read-page .settings .btn-dark {
  padding: 0.375rem 0.75rem;
  border-radius: 4px 0px 0px 4px;
  background-color: #000000;
  border-color: #000000;
  box-shadow: 0 0 20px -5px rgba(255, 255, 255, 0.15);
}
.read-page .settings .btn-dark:first-child {
  margin-bottom: 10px;
}
.read-page .settings .btn-dark:active {
  background-color: #000000;
  border-color: #000000;
}
.read-page .settings .btn-dark:focus {
  box-shadow: 0 0 20px -5px rgba(255, 255, 255, 0.3) !important;
  outline: none;
}
.read-page .settings > * {
  width: 100% !important;
}

.full_close_btn {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  height: 100vh;
  z-index: 999;
  background-color: rgba(0, 0, 0, 0.3);
}
.full_close_btn:hover {
  cursor: pointer;
}
.full_close_btn.hide {
  right: auto;
}
.full_close_btn.open {
  right: 0;
}

.read_chapter_list {
  position: fixed;
  right: 0;
  top: 0%;
  bottom: 0;
  width: 300px;
  height: 100vh;
  overflow-y: scroll;
  background-color: #fff;
  box-shadow: 0px 0 20px -5px rgba(0, 0, 0, 0.3);
  z-index: 1000;
  transform: translateX(0);
  transition: 0.3s ease;
}
.read_chapter_list ul, .read_chapter_list ol {
  list-style: none;
}
.read_chapter_list .chp_lists {
  padding-left: 14px;
  padding-right: 14px;
}
.read_chapter_list .chp_lists li {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #d4d4d4;
  padding-bottom: 10px;
  padding-top: 10px;
}
.read_chapter_list .chp_lists li a {
  font-size: 14px;
  color: #000;
  margin: 0 auto 0 0;
  width: 100%;
  padding: 0;
  font-weight: 500;
}
.read_chapter_list .chp_lists li .lock_icon {
  margin: auto 0;
}
.read_chapter_list .chp_lists li button {
  font-size: 14px;
  color: #000;
  margin: 0 0 0 auto;
  width: calc(100% - 22px);
  padding: 0;
  font-weight: 500;
  text-align: left;
  border: 0;
  background: transparent;
}
.read_chapter_list .chp_lists li .ago {
  color: #000;
  width: 100%;
  font-size: 12px;
  margin-top: 4px;
  margin-left: 0;
}
.read_chapter_list.open {
  transform: translateX(0%);
}
.read_chapter_list.hide {
  transform: translateX(105%);
}
.read_chapter_list .md_title {
  font-size: 24px;
  font-weight: 500;
  padding: 24px 14px;
  margin: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}
@media (min-width: 320px) and (max-width: 767px) {
  .read_chapter_list .md_title {
    font-size: 18px;
    padding: 14px;
  }
}
.read_chapter_list .close_btn {
  position: absolute;
  right: 14px;
  top: 24px;
  background: transparent;
  border: none;
  color: #000;
  font-size: 24px;
  padding: 0;
  line-height: 18px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .read_chapter_list .close_btn {
    top: 12px;
  }
}
.read_chapter_list .close_btn:active {
  background-color: transparent;
  border-color: transparent;
  box-shadow: none;
  color: #000;
}
.read_chapter_list .close_btn:focus {
  box-shadow: none;
}

.side_read_menu {
  position: fixed;
  right: 0;
  top: 50%;
  width: 300px;
  height: 328px;
  background-color: #fff;
  box-shadow: 0px 0 20px -5px rgba(0, 0, 0, 0.3);
  z-index: 1000;
  transform: translate(0, -50%);
  transition: 0.3s ease;
}
@media (min-width: 320px) and (max-width: 767px) {
  .side_read_menu {
    left: 50%;
    right: auto;
    top: auto;
    bottom: 56px;
    width: 320px;
    height: 246px;
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 24px;
    transform: translate(-50%, 124%);
  }
}
.side_read_menu ul, .side_read_menu ol {
  list-style: none;
}
.side_read_menu .chp_lists {
  padding-left: 14px;
  padding-right: 14px;
}
.side_read_menu .chp_lists li {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid #d4d4d4;
  padding-bottom: 10px;
  padding-top: 10px;
}
.side_read_menu .chp_lists li a {
  font-size: 14px;
  color: #000;
  margin: 0 auto 0 0;
  width: 100%;
  padding: 0;
  font-weight: 500;
}
.side_read_menu .chp_lists li button {
  font-size: 14px;
  color: #000;
  margin: 0 auto 0 0;
  width: 100%;
  padding: 0;
  font-weight: 500;
  text-align: left;
  border: 0;
  background: transparent;
}
.side_read_menu .chp_lists li .ago {
  color: #000;
  width: 100%;
  font-size: 12px;
  margin-top: 4px;
  margin-left: 0;
}
.side_read_menu.open {
  transform: translate(0%, -50%);
}
@media (min-width: 320px) and (max-width: 767px) {
  .side_read_menu.open {
    transform: translate(-50%, 0%);
  }
}
.side_read_menu.hide {
  transform: translate(105%, -50%);
}
@media (min-width: 320px) and (max-width: 767px) {
  .side_read_menu.hide {
    transform: translate(-50%, 124%);
  }
}
.side_read_menu .md_title {
  font-size: 16px;
  padding: 14px;
  font-weight: 500;
  margin: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}
@media (min-width: 320px) and (max-width: 767px) {
  .side_read_menu .md_title {
    width: 100%;
    margin-bottom: 14px;
  }
}
.side_read_menu .close_btn {
  position: absolute;
  right: 14px;
  top: 11px;
  background: transparent;
  border: none;
  color: #000;
  font-size: 24px;
  padding: 0;
  line-height: 18px;
}
.side_read_menu .close_btn:active {
  background-color: transparent;
  border-color: transparent;
  box-shadow: none;
  color: #000;
}
.side_read_menu .close_btn:focus {
  box-shadow: none;
}

.font_size_changer {
  padding: 0 14px;
  text-align: center;
  margin: 24px 0;
}
@media (min-width: 320px) and (max-width: 767px) {
  .font_size_changer {
    width: 50%;
    margin: auto 0;
    padding: 0 6px;
  }
}
.font_size_changer h5 {
  font-size: 16px;
  font-weight: 500;
}
@media (min-width: 320px) and (max-width: 767px) {
  .font_size_changer h5 {
    font-size: 14px;
    margin-bottom: 20px;
  }
}
.font_size_changer button {
  width: 40px;
  height: 40px;
  background: transparent;
  border: 0;
  border-radius: 4px;
  box-shadow: 0 0 20px -4px rgba(0, 0, 0, 0.3);
  margin-right: 14px;
}
.font_size_changer button:focus {
  box-shadow: 0 0 20px -4px rgba(0, 0, 0, 0.3);
}
.font_size_changer button:last-child {
  margin-right: 0;
}

.dark_mode {
  padding: 0 15px 24px;
  text-align: center;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dark_mode {
    width: 50%;
    margin: auto 0;
    padding: 0 6px;
  }
}
.dark_mode h5 {
  font-size: 16px;
  font-weight: 500;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dark_mode h5 {
    font-size: 14px;
  }
}
.dark_mode .switch {
  position: relative;
  display: inline-block;
  width: 140px;
  height: 34px;
}
.dark_mode .switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.1);
  transition: 0.4s;
  user-select: none;
}
.dark_mode .switch .slider .bx {
  position: absolute;
  content: "";
  height: 34px;
  width: 50%;
  left: 0;
  top: 0;
  bottom: 0;
  background-color: #fff;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15);
  border-radius: 100px;
  transition: 0.4s;
}
.dark_mode .switch .slider .light_txt, .dark_mode .switch .slider .dark_txt {
  position: absolute;
  z-index: 3;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  line-height: 16px;
  color: #000;
}
.dark_mode .switch .slider .light_txt {
  left: 17px;
}
.dark_mode .switch .slider .dark_txt {
  right: 17px;
  opacity: 0.6;
}
.dark_mode .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.dark_mode .switch input:checked + .slider {
  background-color: rgba(0, 0, 0, 0.1);
}
.dark_mode .switch input:checked + .slider .bx {
  background-color: #25272A;
  transform: translateX(100%);
}
.dark_mode .switch input:checked + .slider .light_txt {
  opacity: 0.6;
}
.dark_mode .switch input:checked + .slider .dark_txt {
  opacity: 1;
  color: #fff;
}
.dark_mode .switch .slider.round {
  border-radius: 100px;
}

.custom_shadow {
  padding: 0 15px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
@media (min-width: 320px) and (max-width: 767px) {
  .custom_shadow {
    width: 100%;
    margin-top: 16px;
  }
}
.custom_shadow h5 {
  width: 100%;
  font-size: 14px;
  font-weight: 500;
  text-align: center;
  margin-bottom: 14px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .custom_shadow h5 {
    margin-bottom: 6px;
  }
}

.dashboard {
  padding-top: 80px;
  padding-bottom: 60px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard {
    padding-top: 24px;
    padding-bottom: 32px;
  }
  .dashboard .tc-container .col-4, .dashboard .tc-container .col-8 {
    width: 100%;
  }
}
.dashboard .sidebar .profile_img {
  display: flex;
  flex-wrap: wrap;
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid #E2E2E2;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .sidebar .profile_img {
    padding-bottom: 24px;
    margin-bottom: 0;
    border-bottom: 0;
  }
}
.dashboard .sidebar .profile_img .img {
  width: 96px;
  height: 96px;
  overflow: hidden;
  border-radius: 500px;
  margin: auto 24px auto 0;
}
.dashboard .sidebar .profile_img .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}
.dashboard .sidebar .profile_img .det {
  width: -webkit-calc(100% - 120px);
  width: calc(100% - 120px);
  margin: auto 0 auto auto;
  display: flex;
  flex-wrap: wrap;
}
.dashboard .sidebar .profile_img .det span {
  width: 100%;
  font-size: 14px;
}
.dashboard .sidebar .profile_img .det .tt {
  font-size: 14px;
  color: #000;
  margin-bottom: 8px;
}
.dashboard .sidebar .profile_img .det .email {
  font-size: 14px;
  color: #4D4D4D;
  margin-bottom: 12px;
}
.dashboard .sidebar .profile_img .det .gender {
  display: flex;
}
.dashboard .sidebar .profile_img .det .gender p {
  font-size: 13px;
  margin-right: 12px;
  margin-bottom: 0;
  text-transform: capitalize;
  background-color: #3f89de;
  border-radius: 500px;
  padding: 2px 12px;
  color: #fff;
}
.dashboard .sidebar .profile_img .det .gender p:last-child {
  margin-right: 0;
}
.dashboard .sidebar .nav .nav-item .nav-link {
  font-size: 14px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #828282;
  transition: color 0.3s ease;
  width: max-content;
}
.dashboard .sidebar .nav .nav-item .nav-link:hover, .dashboard .sidebar .nav .nav-item .nav-link.active {
  color: #000000;
  font-weight: 500;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .sidebar .nav.flex-column {
    display: none;
  }
}
.dashboard .top_wave {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 300px;
  z-index: -1;
  background: linear-gradient(0deg, #b5f5ff 0, #ffffff 100%);
  /* Animation */
  /*Shrinking for mobile*/
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .top_wave {
    background: linear-gradient(0deg, #b5f5ff 0, #f9f9f9 100%);
  }
}
.dashboard .top_wave .waves {
  position: absolute;
  width: 100%;
  height: 15vh;
  margin-bottom: -7px;
  min-height: 100px;
  max-height: 150px;
  bottom: 0;
}
.dashboard .top_wave .parallax > use {
  animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
}
.dashboard .top_wave .parallax > use:nth-child(1) {
  animation-delay: -2s;
  animation-duration: 7s;
  fill: rgba(255, 255, 255, 0.7);
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .top_wave .parallax > use:nth-child(1) {
    fill: rgba(249, 249, 249, 0.7);
  }
}
.dashboard .top_wave .parallax > use:nth-child(2) {
  animation-delay: -3s;
  animation-duration: 10s;
  fill: rgba(255, 255, 255, 0.5);
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .top_wave .parallax > use:nth-child(2) {
    fill: rgba(249, 249, 249, 0.5);
  }
}
.dashboard .top_wave .parallax > use:nth-child(3) {
  animation-delay: -4s;
  animation-duration: 13s;
  fill: rgba(255, 255, 255, 0.3);
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .top_wave .parallax > use:nth-child(3) {
    fill: rgba(249, 249, 249, 0.3);
  }
}
.dashboard .top_wave .parallax > use:nth-child(4) {
  animation-delay: -5s;
  animation-duration: 20s;
  fill: rgb(255, 255, 255);
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .top_wave .parallax > use:nth-child(4) {
    fill: rgb(249, 249, 249);
  }
}
@keyframes move-forever {
  0% {
    transform: translate3d(-90px, 0, 0);
  }
  100% {
    transform: translate3d(85px, 0, 0);
  }
}
@media (max-width: 768px) {
  .dashboard .top_wave .waves {
    height: 40px;
    min-height: 40px;
  }
}
.dashboard .wallet {
  margin-bottom: 48px;
}
.dashboard .wallet .tt {
  font-size: 24px;
  margin-bottom: 24px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .wallet .tt {
    font-size: 18px;
    margin-bottom: 12px;
  }
}
.dashboard .wallet .det {
  display: flex;
  align-items: baseline;
}
.dashboard .wallet .det .sb {
  display: block;
  margin: auto 12px auto 0;
  font-size: 16px;
  color: #000;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .wallet .det .sb {
    font-size: 14px;
  }
}
.dashboard .wallet .det .img {
  width: 32px;
  margin-right: 12px;
  display: flex;
}
.dashboard .wallet .det .img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.dashboard .wallet .det .uldegdel {
  display: block;
  margin: auto 0;
  font-size: 16px;
  color: #000;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .wallet .det .uldegdel {
    font-size: 14px;
  }
}
.dashboard .my_profile .tt {
  font-size: 24px;
  margin-bottom: 24px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .my_profile .tt {
    font-size: 18px;
    margin-bottom: 12px;
  }
}
.dashboard .my_profile .rank {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 64px;
  position: relative;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .my_profile .rank {
    margin-bottom: 32px;
  }
}
.dashboard .my_profile .rank:hover .rank_hover {
  opacity: 1;
  transform: translateY(110%);
}
.dashboard .my_profile .rank h2 {
  width: 100%;
  margin-bottom: 5px;
  font-size: 20px;
  text-align: center;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .my_profile .rank h2 {
    font-size: 16px;
  }
}
.dashboard .my_profile .rank .rank_hover {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 0;
  transform: translateY(0%);
  transition: 0.3s ease;
  z-index: 1;
}
.dashboard .my_profile .rank .rank_hover .left, .dashboard .my_profile .rank .rank_hover .right {
  width: 25%;
}
.dashboard .my_profile .rank .rank_hover .left {
  margin: 0 auto 0 0;
  text-align: left;
}
.dashboard .my_profile .rank .rank_hover .center {
  width: 50%;
  margin: 0 auto;
  text-align: center;
}
.dashboard .my_profile .rank .rank_hover .center span {
  font-weight: bold;
}
.dashboard .my_profile .rank .rank_hover .right {
  margin: 0 0 0 auto;
  text-align: right;
}
.dashboard .my_profile .rank .rank_hover span {
  font-size: 13px;
}
.dashboard .my_profile .rank .progress {
  position: relative;
  z-index: 5;
  background: #fff;
  border: 2px solid #282828;
  border-radius: 20px;
  display: inline-block;
  box-shadow: 0 0px 6px 1px rgba(40, 40, 40, 0.5), 0 0 4px 1px rgba(40, 40, 40, 0.5) inset;
  overflow: hidden;
}
.dashboard .my_profile .rank .progress, .dashboard .my_profile .rank .progress-bar, .dashboard .my_profile .rank .progress-text {
  width: 100%;
  max-width: 100%;
  height: 20px;
}
.dashboard .my_profile .rank .progress .progress-text:first-child {
  z-index: 5;
  color: white;
}
.dashboard .my_profile .rank .progress .progress-text:last-child {
  z-index: 10;
  color: black;
}
.dashboard .my_profile .rank .progress-bar {
  overflow: hidden;
  position: relative;
  z-index: 10;
  border-radius: 12px;
  width: 0;
  transition: width 0.2s linear;
}
.dashboard .my_profile .rank .progress.sparkle .progress-bar {
  background-color: #515151;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAG4AAABACAMAAADMI7KPAAACZFBMVEX////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////xG13JAAAAzHRSTlMAAQIDBAUGBwgJCgsMDQ4PEBESExQVFhcYGRobHB0eHyAhIiMkJSYnKCkqKywtLi8wMTIzNDU2Nzg5Ojs8PT4/QEFCQ0RFRkdISUpLTE1OT1BRUlNUVVZXWFlaW1xdXl9gYWJjZGVmZ2hpamtsbW5vcHFyc3R1dnd4eXp7fH1+f4CBgoOEhYaHiImKi4yNjo+QkZKTlJWWl5iZmpucnZ6foKGio6SlpqeoqaqrrK2ur7CxsrO0tba3uLm6u7y9vr/AwcLDxMXGx8jJytLua8SRAAASK0lEQVR42nXWWZMb12H28edsvQJoAINlMMPZOCQlioso0rKlmPYb+XXKvnAlvslNrvIBkg+Rz5CkKpU9lcSViiuJs5Ys2XKsxZJC2+K+zMLZBxgM1qXR6zknNYOhSMrM7wrVhcIfDwp9qsnl/58nB993NgGQbJn0Wqw61arjGVPM/PpFQ473/gwwpi0yalS/u+BwdfffiQU1bALEnTPWfLwIn/Nu4tpbiwWi7/zdLvhwlJO9JgCesc/EkckO9lspntUG3vcq+g8AIO1HtA7kMkzDLgYa1ACw7MeJwAtRxWf3BmaOksiyecq33r/Uv8e0MkrFaqU9tirXmj/HF2SvXWge16D6fQqESlKtaL5nQsbgV7/RvrsjicYLxFtbYKljQI+62RRcrW/kzFlm2F2DjUz79QSj1iaep5PRKp5QAPE7jMg+axaJ72e++ltn9Dff/mCI/8vyqz98c8nySQRw03PlGwamz6/8uB7gOgSsxf34ySwmDgGM/vM/AWb5OJGuj2wtG3fDfQC5105naPZ6fw3PcX2csBZqw58cTg/v3AP4NeUtGpTwqPcgYjWPKtgX/hsTpTfm7ebfYqKwuJz8M475/zO/5PY+7eLIMGQMiGcuhrw5SHGsfK7WutXFRLxis6nba72D3AC8zIqvqnUar9yUaYooNFnnMU5YV4tk+tvvHW/N/7qZi3+3+69nZ37up53OzdNBR4JLDRExRInMLdYJ0CEawNkrFVHK/Acm1GiQV+3Pyr9N/hCcEroNpomsrcVq88evLYYP3sWJMy6nxgI/yvGLb2RucpG5Ouz6OPIY1FtIW00YSbLf3hEO4fBMGYUAMmVLWstXf4mJcYON+jo358zucWqAh5JLOhooyh+vXgvqmKCGSxiSQgIAJO3HGtror2OCKeP0rKg0Md55rPaVr/YZBxEkTYF+bID0WjgRPHwIoHXfypxmZxAFLYuG/fuxWHz9OwvvHoY4YroIB54r1j5sSAB6aMUU8B/6AMxz5+aSYemMqeVwLDc/9KvBH3UsxtJBSHUCkHOulJurMY6IYoHGAMJ6A4RNy+4Hfc2HG6R6/a0rV7+09FMc4dOznmqtpLs3H0fq+II5r1LWuAVwYi16dtKE4aXxXggdjiU9HLGURi1NdAQEcSfprDY1AEyLWk72ARBi0ZTf6TJ+GGcratWay3nZ9Mq33wYAdz7n93R0Q+k0BYBCSYyd6EYbMIt1EBAL4Ya8g2P7pN6gfeIwaBkAwFqMCWf5/wWt/jbcWKdB0wXvQiVwMo4x6iSExjYf4sj0XK7d35fjgq2bIcDLX3E0EeN9QMfZ8dqs3KBp/w5O7O3V6uAR5zpKASDGifzXTiPs9V8qrfu5Tt0xOKB1YnmenJNmOmTO5p5dCIOZCxlSWL7FjLIj031A1BwBQuYPRojbyDUaeA4v/Nrg3VQySkM8K/fGLLSVrRbEwrjcSQk4AKhsTmKmFPkFu/vOudOzzr2DLNOUXc7ZlUeEA2AuBWAV3EACM+fz/yQSPCPlKgFVKb7AqhoAIT4jvSx026PHuZkL4ArkYfM3zYekUDb5xV+OTKL9i8tm0F/tAnALbPK1DgD75W9e/O4ffwImnk6p/wsoflXzs4prJJJ8OKBTpw6SfvY4N18wFAjI6l+/PkSYODItbmjNoxxPjXHTB0BbGc6SeG8VgFHL5aa+9snU0mAFTxFKqNQAIUQyiROf5L467Ky/D4p2WyPpcQCi17eJ1ox3nENTj29co61+a0fsL70i2TjXBYC6cq+nw1/+CACYHI0s/Z1B9RZA9NMeAQE0PAsDH098NOoPdgBNoAEoBkBFyhNi3Nvc0u1h+HFv7ycPk1xGjlSvkq7/ACCCy6kF19oNHwJA0Eta7yu3jJ8AnCkw20iPwsUxBXEqlgERS5xI6gcDAEQRrQEQHMle/vLo8eo2AEpTADBfPyW/DzEdT+MWcbKEv7pkatb7UxzLXT1tQQePPoZISL5gqj3lzeRlglWeNXwFOe7keBsvwHFk+FF3cJgAgFKTDywYCkg6v74chLseJdki01A4ZkhRdQ0DcR5IQKeKREm36phn3OH0SoYmZpcUZ8o59k8APHsch8/lJu6DaDw1rotgdg/cszxvl0GHHTMHqacbACu/OXVKEarzPRBuz6YExMnnrITns21CrOnl+M58jpvjb/0QzuLpqN3cwOcYnrLmejiR7D9YG4KY4lR/fUQZEOV45A/CA8BYOi3i2IEKt7dyp18uezqVrVwxD5OjwVwRFOOVYpFqbln7S6/k3HzV3X9+3QT/yqX8zt/gc4TTMFoNioeBHfto+EmkpRVCjcfot14R3e0dzhcNWMNOfFgKB4ZocvGKMPZ/2lMq5SDKLJ+3oDm3RPKrOX7pK2V17nfeaX1eswihgWZmc3rQIaGCjg8SINlISiS51bFqUYzI0pFS2xgrRcWgMsWXnVbyV5mQa6KCrZoQGpDsaY7hCVW4ZCi0P3k6jgOBhU4raAdMCilp+/jvJLtDg40zX79QSvZnDB3drjZAMyrqBxkjc4rRTI9ejsbcv78mFkCJmXVmzwwC/YV1aLUyVG48exBS2QmsYQDmidYGN4wnw6P9/NSFl7lNe3fdjN+/CXR3qlyLojOOAb/ev7enPX4fu3cvUW6Uy2Pt+8Mv5g5vDKPww8kyDWgV0gRxH4B9SkQsHuCJKBpZS9UCkvntzcntq7oFppP1kBlT4/WDcRu0AQCbXi2uxAr04v6jL+bInQfUxxGDhgC0lJgYPT5zzdYPHuNzUwtli8nUKdbDk6frgwL8UZfttzcHPigmogf18cWsDZ2tfiHnelm1iiNm1suGD/EsXs0LOdsY45gZua98q5iG4I4IMaEbMQvHFd7r1TWTTtVmpNGk1Vr9MKVcyb01PJerXC1r9uW/B3h+YYoaySRHFY6FvYpmRW+SYzPXl1ddriKSb+3hBHVcHVe477d4YnzppbsGgRrGTqmpHsnl/OjD5nM5lpk2KdG/10w+41dfIWm4/Ld9yyBRCFiFmQV7vZsZbNdxhMx87aJ3JZf69uHG/g5OaLY8K+Lho7qAdflKbeFWC5n83uoaMflwo+Bvp8/lqEcItFtJ1GJrdpZoXfzah5QQmqaoXD/lqvg+7e5O3ul+9XzGyJBRJ96rr+IJzXOQInem2YaMhUha0CIDCM+dntIRq+w/l1OOgHbzKj+gU9OG1iSXt1PCYA+RPZWVdHn4NibU6cu21pLbW63oL/EUiw2pWWm5DbU+k4YEOuwBfGE6BWFpoRU/m3OQ5qYyotlobn09qwg0IYEQtdlk/2acKmi3gCcOVq+ocd3zn69BWRIgOgtg8NGNbMGId1uAbBcJAQyXPrdu3CzPFeAPo80wHxlgiU8In6tafHGmS5hyuTyzhon27fmSGgaPPgvwLKUk12nrPgDoZr/r+W0JRHV3VlHEPHzuECO9Ux4NOrRAtwNHJungYHWzdsokRKTtTkKnS8ULuYc4pgZeAfuPb/1yDwDBE6kGTP9RXYLWXl5aD3q+mJubW5INatN4+Jg44ck6Xis7D/o9NdREQ6rH42sv9bZ+uhtZnGoo0b9Lr5QVz1/6oI1j/s833fX+0NUxkCm4jS6OJI+2vdJoHQCMnDj/AMgtZc877zTuBuVm4WzBVP88yVlXKwyfjhSoQvtxnLbqB6O93Ihs5D1KdRJTPmdyzu1aV+HY5qYQ2TcKfuO2uHZdf/A+jsnRaG8yv7NvPwDgeZevCL12sN5+6RsWsYKTHAyOIkZpCqT1LV+i8e+Zxanf0FHd0zEZt0i6ctm1ZSHLY0zwMj/j8cp8Pq1O6TMfuJdkdxx3WYQJ0vEKXTDXFibNFIzydjYrKNjv/+FxTnZNuonep14+56+MJQA2O20qTafaSdAda0JW3vtuOL7fOcoRKmhUsa25jOuRJmy/uMbm3iLjyLwxDB8BAK0tnP8Zoco0jc4DviYunv9ZQRMFszJZF/wIjOStFe4riWOFGUNzW4WfSKoV1UR/SpxNQsYAjIxjxZSpA1YSIdX9j2ufFV6zRT6TMwNz93sAKm/m2LXGj4xsvJ344+1gR3ZfYyBA8tvfBwdllCVLM5nkQ63MUmZ3rImSjNgWsUMAVFPo+IPiVNICAJoXlJKU7I2yo5amMv1z6/Iy006NiExh0Xn4M13LcJ3J1A6dtNnSIMHG3TNnL/c2ddq/JRIOljNhXZrLhL377vQ0cXebul/PmZzq460Kiijg8FCkAOBNlRi96WaGInADIpJNZGZsYpczOl/gciF+2K6fFVBRHXW7ZC1F0YjL8OBQJXTnv1cATphBYc9ldObrnXLBTsu8pRj1smnUOpw8Y2iNI8evReUtwx7Sl6c7fMGJm3uJ82j48OVslmksMB9mttLudzLS2AXCRCx/09l+MEx79zt7JPfxJgCuOUAL816dCp6tiXhgfel2dkaGdPhehF/BTikOY65cXNwaUiOXDsi33t1479s0ZDoyeKAdcDyoS7kKQKpXa/qlcXkkt+sb4wBHOCJTLP7aKces31NK2PlSO0uMQhyT4AU1cFNEoaB3zo+p7pG+n5Ky8u/mvzwYlapJOtheXROk11djANXLa66kluYiaAAJWdqNAY6k7Q2SxyWn/xN5uFAy/WBYIgAIxQswVxMW4SN+3pbQ2a1Y/x10/+37eVqo7R66jSYIIKpErpSuv/ntkogGh2E0WzZk4UL1xo1txQEMu0PearxjmvqTL5GO1qJMk+G4gxfof3T1lFP4aFHHnCEZrT/amZwjwt7b3EoAcE0we7GsLpI3Fpk8/JPUnt4tWfqNVy3iFr83ZADALBbsX3jzpZcL96im3Jqft8af1EO8QLiSmbMq8bBjZ6ba//azHo5F7YNWR2Hyo7BTV6c5OTtfc5x7/+C8NNU3BD0zxwCzscwB6N57wIXXbRB9vuMJnpvhxqgzwgkjxlPUoYlIz7S2b75RbtxxWJokEs+QEs7CGU8G2+cFUdPO8m9s6JSk9dqUZKPreY4JOwdN4HiCU552s2nw6iOZJMtzppPcf6gB5Kt+0Ca8/OqsFVsw8r2/eGvL0oSLyMdziG0PRNrtrJTkYD8wo/2Z9LF7ez4UPJ5lHCemMxRSp4Msq8Q7fNwsbYmz12aGTR7GW2NALF1J05UH3rlpSohWQUzWNm0BktOSGQGeoTOqMzDkVuvAq3+qb6zteXUAB+fKm85b2Sc50RpXjFHwvW9VTctu3zeyeqm1XK3pgbZnpsbA7BUXJB+Htp2MbEYcUofSgBopUjvtxTcP8Ln6x/lM84de+F/tDtAOSyFVwF7HZu4dj2EikunUVOWz9rkiF9Q/ZKZo9bIvVXdFAtE9IO7lU1bK0ArKNZpkobta0zrhlEBE1QXLyeXreEIOe/9yz7OpGAcaLFMk8trL5iERNN588CTHLJ4vPc5eyzQDdRijr4S7N5r13Olqnrd2uJxZcCD59jjv8ojSPZL21mjAmHe6EheLRCxfr93EE6oFxW2a+oHnkkQStpzTWxpCpzHHhIoqbkNzu98wdijrb+aveAtv/yJ/tmj6jSEFX51ekv1BE41ebnnwztmw2fReu9S/Y19zd3+QdRJR7OJZsmPysGVP8WgzcXQ7PgBCbV1aeJLTiTZANEkpt2X3brMionhNL+dztDNY+gXSwc8Hvd6uY7RpL7HH/8PHzrVzrjdVlLL6ZX0nePdsA89JG0gII1SYWZfd74PZo8ipFRhOqF4lqynZ71tc7e+EIxb/Yn/QL6Kz1fcfh0kaNrqdxCfMWMzRTHl+xn3TALd123OJWqmrVojnKQVoooOMxbUlYhUXg+I5i+HzecksNu+9lxg4ONxHtLaxBdVayQR99dlOpDlXKaALtUy2cjpvl4oiZxCEmw99h/xgFy+mxgPmcFBGWOp95ysfRVmOJ5K7PkKzFq4acSQSjQEA0v2wWop3zEinVEBLZBkGOREUXGIezhOVNh68ZrLZbfxfdJDhR1P6ianXkvv3GZ7qBdmyk+PJEK4IcISysL21EVVzfa0g49SpUAKzImzO6TDBaPt7ampq+3b38qlhjBfjBgP8UI1ubwDgeMqolLiVC4wk4SL0AUBBCq2DdQAqpEQbmmplGtIvCPKPngoT9H98bzV87Tt8cPtdvIik08mO6qewQnwhpy2GJOwJzT+/riKNABP2AuvplBjxIQ9Ftt89wJGBOet+I28U5jbW8AKlS1Pp6JGGefrCjb0E/wtYT0+oEQxnLAAAAABJRU5ErkJggg==");
  box-shadow: inset 0 -2px 2px rgba(0, 0, 0, 0.5), inset 0 2px 2px rgba(255, 255, 255, 0.8);
  animation: sparkle 1500ms linear infinite;
}
@-webkit-keyframes sparkle {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 -64px;
  }
}
@-moz-keyframes sparkle {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 -64px;
  }
}
@-o-keyframes sparkle {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 -64px;
  }
}
@keyframes sparkle {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 -64px;
  }
}
.dashboard .rank_list {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .rank_list {
    grid-template-columns: 1fr 1fr;
  }
}
.dashboard .rank_list .tt {
  grid-column-start: 1;
  grid-column-end: 4;
  font-size: 18px;
  margin-bottom: 12px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .rank_list .tt {
    grid-column-start: 1;
    grid-column-end: 3;
  }
}
.dashboard .rank_list .box {
  text-align: center;
  background-color: #fff;
  padding: 8px 12px;
  box-shadow: 0 0 20px -4px rgba(0, 0, 0, 0.15);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .rank_list .box {
    border-radius: 4px;
  }
}
.dashboard .rank_list .box.active {
  background-color: #000;
}
.dashboard .rank_list .box.active span {
  color: #fff;
}
.dashboard .rank_list .box span {
  display: block;
  color: #000000;
  width: 100%;
}
.dashboard .rank_list .box .tt {
  font-size: 16px;
  margin-bottom: 0;
}
.dashboard .rank_list .box .bonus {
  margin-top: 4px;
  font-size: 12px;
}
.dashboard .recently_view .tt {
  font-size: 18px;
  margin-bottom: 12px;
}
.dashboard .recently_view .novel-tt {
  max-width: 184px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dashboard .recently_view .chapter-tt {
  max-width: 184px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dashboard .recently_view .receipt {
  text-align: right;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .recently_view .table {
    width: 700px;
  }
  .dashboard .recently_view .table th, .dashboard .recently_view .table td {
    font-size: 13px;
  }
}
.dashboard .charge_account .tt {
  font-weight: 500;
  font-size: 18px;
}
.dashboard .charge_account .qr-img {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 14px;
}
.dashboard .charge_account .qr-img img {
  max-width: 400px;
  width: 100%;
}
.dashboard .charge_account .scroll-check {
  width: 100%;
  overflow-x: scroll;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .charge_account .scroll-check {
    margin-bottom: 32px;
  }
}
.dashboard .charge_account .scroll-check .table .receipt button {
  border: 0;
  border-radius: 8px;
  padding: 4px 24px;
  background-color: #058036;
  color: #fff;
}
.dashboard .charge_account .table {
  width: 720px;
}
.dashboard .charge_account .checkout {
  margin-bottom: 64px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .charge_account .checkout {
    width: 720px;
  }
}
.dashboard .charge_account .checkout-item {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}
.dashboard .charge_account .checkout-item:first-child {
  padding-bottom: 6px;
  border-bottom: 1px solid #000;
}
.dashboard .charge_account .checkout-item:last-child {
  margin-bottom: 0;
}
.dashboard .charge_account .checkout-item p {
  margin: 0;
  display: flex;
  align-items: center;
}
.dashboard .charge_account .checkout-item p.b {
  font-weight: 500;
  font-size: 16px;
}
.dashboard .charge_account .amount {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 24px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .charge_account .amount {
    grid-template-columns: repeat(2, 1fr);
  }
}
.dashboard .charge_account .amount-item {
  position: relative;
  cursor: pointer;
}
.dashboard .charge_account .amount-item:hover .detail {
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.25);
}
.dashboard .charge_account .amount-item input {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
}
.dashboard .charge_account .amount-item .detail {
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.1);
  background-color: #fff;
  border-radius: 8px;
  padding: 24px;
  transition: 0.3s ease;
}
.dashboard .charge_account .amount-item .detail p {
  font-size: 16px;
  margin: 0;
  text-align: center;
}
.dashboard .charge_account .amount [type=radio]:checked + .detail {
  outline: 1px solid #000;
}
.dashboard .big_title {
  background: rgba(131, 131, 132, 0.06);
  padding: 13px;
  font-weight: 600;
  font-size: 16px;
  text-align: center;
  letter-spacing: 0.095em;
  color: #000000;
  text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.25);
  margin-bottom: 50px;
}
.dashboard .profile-image_warning {
  margin-top: 24px;
  border: 1px solid #ff0000;
  padding: 14px;
  border-radius: 8px;
  background-color: #000;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .profile-image_warning {
    margin-bottom: 24px;
  }
}
.dashboard .profile-image_warning p {
  margin: 0;
  text-align: center;
  font-size: 16px;
  color: #fff;
}
.dashboard .user_imageCheck {
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .user_imageCheck {
    justify-content: space-between;
    gap: 14px;
    height: 70.4vw;
    padding-bottom: 12px;
    overflow-y: scroll;
  }
}
.dashboard .user_imageCheck h2 {
  width: 100%;
  font-size: 18px;
  margin-bottom: 14px;
  margin-top: 36px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .user_imageCheck h2 {
    margin-top: 0px;
    margin-bottom: 0;
    font-size: 16px;
  }
}
.dashboard .user_imageCheck label {
  width: 120px;
  height: 160px;
  margin-right: 14px;
  margin-bottom: 14px;
  position: relative;
  cursor: pointer;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .user_imageCheck label {
    width: calc(25% - 11px);
    height: 24vw;
    margin-right: 0;
    margin-bottom: 0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  }
}
.dashboard .user_imageCheck label img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dashboard .user_imageCheck label .icon {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #fff;
  opacity: 0;
  transition: 0.3s ease;
}
.dashboard .user_imageCheck label .icon svg {
  position: absolute;
  left: 14px;
  bottom: 14px;
  fill: #ff0000;
}
@media (min-width: 320px) and (max-width: 767px) {
  .dashboard .user_imageCheck label .icon svg {
    left: 10px;
    bottom: 10px;
  }
}
.dashboard .user_imageCheck [type=radio] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.dashboard .user_imageCheck [type=radio]:checked + img {
  outline: 2px solid #ff0000;
}
.dashboard .user_imageCheck [type=radio]:checked + img + .icon {
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.6);
}

.news-page {
  padding: 48px 0 64px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page {
    padding: 24px 0;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .news-page {
    padding: 32px 0 48px;
  }
}
.news-page .news-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 48px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-list {
    gap: 24px;
    grid-template-columns: 1fr;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .news-page .news-list {
    gap: 24px;
    grid-template-columns: repeat(2, 1fr);
  }
}
.news-page .news-list .news-card {
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
  transition: 0.3s ease-in;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-list .news-card {
    border-radius: 8px;
    overflow: hidden;
  }
}
.news-page .news-list .news-card:hover {
  box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.3);
}
.news-page .news-list .news-card:hover .news-card_img img {
  transform: scale(1.05);
}
.news-page .news-list .news-card:hover .news-card_body .title::after {
  width: 20%;
}
.news-page .news-list .news-card_img {
  width: 100%;
  height: 400px;
  overflow: hidden;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-list .news-card_img {
    height: 53.333vw;
  }
}
.news-page .news-list .news-card_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: 0.4s ease;
}
.news-page .news-list .news-card_body {
  padding: 24px;
}
.news-page .news-list .news-card_body .title {
  font-size: 16px;
  margin-bottom: 8px;
  position: relative;
}
.news-page .news-list .news-card_body .title a {
  color: #000;
}
.news-page .news-list .news-card_body .title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0%;
  height: 1px;
  background-color: rgb(241, 100, 100);
  transition: 0.3s ease;
}
.news-page .news-list .news-card_body .date {
  font-size: 13px;
  color: #6a6a6a;
}
.news-page .news-read {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  padding: 24px;
  margin-bottom: 48px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-read {
    padding: 14px;
    margin-bottom: 24px;
    border-radius: 8px;
  }
}
.news-page .news-read_img {
  width: 100%;
  height: auto;
  margin-bottom: 24px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-read_img {
    border-radius: 4px;
    overflow: hidden;
  }
}
.news-page .news-read_img img {
  width: 100%;
}
.news-page .news-read_header {
  display: flex;
  flex-wrap: wrap;
}
.news-page .news-read_header .title {
  width: 100%;
  font-size: 24px;
  margin-bottom: 8px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-read_header .title {
    font-size: 18px;
  }
}
.news-page .news-read_header .date {
  font-size: 14px;
  margin-bottom: 14px;
  color: #6a6a6a;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-read_header .date {
    font-size: 12px;
  }
}
.news-page .news-read_body {
  font-size: 14px;
  color: #2a2a2a;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-read_body {
    font-size: 13px;
  }
}
.news-page .news-bottom {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  padding: 24px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-bottom {
    padding: 14px;
    border-radius: 8px;
  }
}
.news-page .news-bottom .last-title {
  font-size: 24px;
  margin-bottom: 32px;
  position: relative;
  width: max-content;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-bottom .last-title {
    font-size: 18px;
    margin-bottom: 24px;
  }
}
.news-page .news-bottom .last-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -8px;
  width: 32%;
  height: 2px;
  background-color: rgb(241, 100, 100);
}
.news-page .news-bottom .other-news {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-bottom .other-news {
    gap: 14px;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .news-page .news-bottom .other-news {
    gap: 14px;
  }
}
.news-page .news-bottom .other-news_card {
  width: calc(25% - 18px);
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-bottom .other-news_card {
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .news-page .news-bottom .other-news_card {
    width: calc(50% - 7px);
  }
}
.news-page .news-bottom .other-news_card:hover .img img {
  transform: scale(1.05);
}
.news-page .news-bottom .other-news_card:hover .body .title::after {
  width: 20%;
}
.news-page .news-bottom .other-news_card .img {
  width: 100%;
  height: 176px;
  margin-bottom: 12px;
  overflow: hidden;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-bottom .other-news_card .img {
    height: 42.133vw;
    border-radius: 4px;
  }
}
.news-page .news-bottom .other-news_card .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: 0.3s ease;
}
.news-page .news-bottom .other-news_card .body .title {
  margin-bottom: 6px;
  font-size: 16px;
  position: relative;
}
@media (min-width: 320px) and (max-width: 767px) {
  .news-page .news-bottom .other-news_card .body .title {
    font-size: 14px;
  }
}
.news-page .news-bottom .other-news_card .body .title a {
  color: #000;
}
.news-page .news-bottom .other-news_card .body .title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0%;
  height: 1px;
  background-color: rgb(241, 100, 100);
  transition: 0.3s ease;
}
.news-page .news-bottom .other-news_card .body .date {
  font-size: 12px;
  color: #6a6a6a;
}

.novel-list_page {
  max-width: 1280px;
  width: 94%;
  padding: 24px;
  margin: 48px auto 64px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list_page {
    max-width: 94vw;
    padding: 14px;
    margin: 24px auto;
    border-radius: 8px;
    background-color: #fff;
  }
}
.novel-list_page .bg-tt {
  font-size: 28px;
  font-weight: 500;
  margin-bottom: 32px;
  position: relative;
  width: max-content;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list_page .bg-tt {
    font-size: 16px;
    margin-bottom: 24px;
  }
}
.novel-list_page .bg-tt::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 40%;
  height: 2px;
  background-color: #ff0000;
}
@media (min-width: 768px) and (max-width: 1024px) {
  .novel-list_page .list .table {
    width: 1000px;
  }
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list_page .list .table {
    width: 800px;
  }
}
.novel-list_page .list .table thead th {
  padding: 0.75rem;
  font-size: 16px;
  font-weight: 500;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list_page .list .table thead th {
    font-size: 14px;
  }
}
.novel-list_page .list .table tbody tr:last-child td {
  border-bottom: 0;
}
.novel-list_page .list .table tbody td {
  padding: 7px 12px 1px;
}
.novel-list_page .list .table tbody a {
  padding: 5px 0;
  max-width: 300px;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #000;
  font-size: 14px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list_page .list .table tbody a {
    font-size: 12px;
  }
}
.novel-list_page .list .table tbody a, .novel-list_page .list .table tbody .tc_custom-btn {
  position: relative;
}
.novel-list_page .list .table tbody a:hover::after, .novel-list_page .list .table tbody .tc_custom-btn:hover::after {
  left: 0;
  right: auto;
  width: 100%;
}
.novel-list_page .list .table tbody a::after, .novel-list_page .list .table tbody .tc_custom-btn::after {
  content: "";
  position: absolute;
  left: auto;
  right: 0;
  height: 1px;
  width: 0;
  background-color: red;
  bottom: 0;
  transition: 0.4s ease-in;
}
.novel-list_page .list .table tbody .tc_custom-btn {
  padding: 5px 0;
  background-color: transparent;
  padding: 0;
  font-size: 14px;
  border: 0;
  text-align: left;
}
.novel-list_page .list .table tbody .tc_custom-btn .lock_icon {
  margin-bottom: 5px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list_page .list .table tbody .tc_custom-btn {
    font-size: 12px;
  }
}
.novel-list_page .list .table tbody span {
  padding: 5px 0;
  max-width: 182px;
  color: #000;
  font-size: 14px;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list_page .list .table tbody span {
    font-size: 12px;
  }
}
.novel-list_page .custom_pagination {
  margin-top: 30px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list_page .custom_pagination {
    margin-top: 16px;
  }
}
.novel-list_page .custom_pagination .pagination {
  justify-content: center;
  flex-wrap: wrap;
}
.novel-list_page .custom_pagination .page-item {
  margin-right: 5px;
}
@media (min-width: 320px) and (max-width: 767px) {
  .novel-list_page .custom_pagination .page-item {
    margin-right: 6px;
    border-radius: 8px;
    overflow: hidden;
  }
}
.novel-list_page .custom_pagination .page-item:last-child {
  margin-right: 0;
}
.novel-list_page .custom_pagination .page-item.active .page-link {
  color: #fff;
  background-color: #000;
}
.novel-list_page .custom_pagination .page-item .page-link {
  border-radius: 0 !important;
  border: 0;
  color: #000;
  font-size: 14px;
  transition: 0.3s ease;
}
.novel-list_page .custom_pagination .page-item .page-link:focus {
  outline: none;
  box-shadow: none;
}
.novel-list_page .custom_pagination .page-item .page-link:hover {
  color: #fff;
  background-color: #000;
}

@media only screen and (min-width: 320px) and (max-width: 1024px) {
  header .desktop {
    display: none;
  }
  header .mobile {
    display: block;
    padding: 0 24px;
  }
  #footer .desktop {
    display: none;
  }
  #footer .mobile {
    display: block;
    padding: 0 24px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .tc-container .tc-row.flex .tc-col-2 {
    width: calc(33.3333333333% - 20px);
  }
  .tc-container .tc-row.flex .tc-col-4 img {
    height: 17.425vw;
    object-fit: cover;
  }
  .tc_card-image {
    height: 17.425vw;
  }
  .home_section .video-slider .full {
    height: 400px;
  }
  .home_section .video-slider .detail {
    max-width: 672px;
  }
  .novel-list-page .list .card .col-md-4 {
    width: 50%;
  }
  .novel-list-page .list .card .col-md-8 {
    width: 50%;
  }
  .novel-page .novel_info .img {
    height: 30.208vw;
  }
  .read-page .tc-container {
    max-width: 700px;
  }
  .read-page .settings {
    width: 45px;
  }
  .read-page .tc-container .button_group .nl_tt .tt {
    font-size: 18px;
  }
}

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