:root {
  --general-dark-pink: rgba(0,0,0,0.5);
  --general-pink: #d6c8c8;
  --general-dark-red: #1B1F32;
  --general-red: #1B1F32; 
  --general-text-general-color: white; 
  --general-main-color: #E5C776;
}

p {
	color: var(--general-text-general-color);
}

.nounderline {
  text-decoration: none !important
}

/* common */
section {
  position: relative;
}

.section-title {
  display: block;
  text-align: center;
  margin-bottom: 1rem;
}

.section-title>img {
  width: 80%;
  max-width: 350px;
}

.text-pink {
  color: var(--general-pink) !important;
}

.bg-pink {
  background-color: var(--general-pink) !important;
}

.btn.btn-pink {
  background-color: var(--general-pink);
  color: #fff;
}

.btn.btn-pink:hover, .btn.btn-pink:active, .btn.btn-pink:focus {
  background-color: var(--general-dark-pink);
  box-shadow: none;
  outline: none;
}

.text-icon{
	width: 18px;
	margin-bottom:2px;
	margin-left: 6px;
	margin-right: 6px;
}
.text-main-color{
	color: var(--general-main-color);
	letter-spacing: 2px
}

.text-general-color{
	color: var(--general-text-general-color);
	font-size:1.2rem;
}

.text-general-color{
	color: var(--general-text-general-color);
	font-size:1.2rem;
}

.sratio {
  width: 100%;
  position: relative;
  padding-top: 75%;
  border-radius: .5rem;
  overflow: hidden;
}

.sratio>img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


.custom-accordion {

}

.custom-accordion .card {
  border: none;
  background: none;
}

.custom-accordion .card .card-line {
  background-color: var(--general-main-color);
  height:0.8px
}

.custom-accordion .card .card-header {
  padding: 0;
  margin: 0;
  border: none;
  background-color: transparent;
  border-radius: 0;
}

.custom-accordion .card:nth-child(2n) .card-header {
  background-color: transparent;
}

.custom-accordion .card .card-header>button.btn {
  color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: .8rem 1.8rem;
}

.custom-accordion .card .card-header>button.btn:focus {
  outline: none;
  box-shadow: none;
}

.custom-accordion .card .card-header>button.btn .title{
  font-size: 1.0rem;
  text-align: left;
}

.custom-accordion .card .card-header>button.btn .minus {
  display: block;
}

.custom-accordion .card .card-header>button.btn .plus {
  display: none;
}

.custom-accordion .card .card-header>button.btn.collapsed .minus {
  display: none;
}

.custom-accordion .card .card-header>button.btn.collapsed .plus {
  display: block;
}

.custom-accordion .card .card-body {
  padding: .8rem 1.8rem;
  color: var(--general-main-color);
}

.event_section_content {
	color: var(--general-text-general-color);
	font-size:16px;
}

.fee_image{
	width:100%;
	max-width:640px;
}

.intro_card >img{
	width:100%;
}ㄘ
.intro_card >img{
	width:100%;
}

.card_sub > img{
	height : 20px;
}

.card_sub > p{
	line-height:1.5;
}

@media (min-width: 576px) and (max-width: 991px) {
}

@media (max-width: 575px) {
  .custom-accordion .card .card-header>button.btn {
    padding: .5rem 1rem;
  }

  .custom-accordion .card .card-header>button.btn .title {
    font-size: 1rem;
  }
}

/* nav */
.general-nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: var(--general-dark-pink);
  z-index: 10;
}

.general-nav:not(.nowTop) {
  box-shadow: 0 1px 6px 0px #3304099c;
}

.general-nav .navbar-toggler:focus {
  outline: none;
}

.general-nav .navbar-toggler .down {
  display: none;
}

.general-nav .navbar-toggler .up {
  display: inherit;
}

.general-nav .navbar-toggler.collapsed .down {
  display: inherit;
}

.general-nav .navbar-toggler.collapsed .up {
  display: none;
}

.general-nav .navbar-collapse {
  justify-content: center;
}

.general-nav .nav-item {
  position: relative;
}

.general-nav .nav-item .nav-link {
  position: relative;
  color: var(--general-pink);
  font-size: 1.2rem;
  padding: .5rem 3rem;
  letter-spacing: 0.7rem;
  transition: color .4s ease;
}

.general-nav .nav-item:hover .nav-link, .general-nav .nav-item.active .nav-link {
  color: var(--general-main-color);
}

.general-nav .nav-item .nav-link-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: opacity .4s ease;
  opacity: 0;
}

.general-nav .nav-item:hover .nav-link-bg, .general-nav .nav-item.active .nav-link-bg {
  opacity: 1;
}

.general-nav .nav-share-link {
  color: var(--general-pink);
  transition: color .4s ease;
  /* border-radius: 50%; */
  display: block;
  padding: 3px 0;
  overflow: hidden;
}

.general-nav .nav-share-link:hover {
  color: #fff;
}

.general-nav .navbar-brand>img {
  display: none;
}

@media (max-width: 991px) {
  .general-nav ul.navbar-nav {
    align-items: center;
  }
}

@media (max-width: 576px) {
  .general-nav.navbar {
    /* padding: 13px 3px; */
    justify-content: flex-end;
  }

  .general-nav .navbar-toggler {
    padding: 13px 3px;
  }

  .general-nav .navbar-brand {
    position: absolute;
    left: 50%;
    top: 5px;
    transform: translate(-50%, 0);
	
  }

  .general-nav .navbar-brand>img {
    display: block;
    height: 30px;
	margin-top:5px;
  }
}

/* main */
main {
  background-color: #1B1F32;
}

.all-main-bg {
  position: fixed;
  display: block;
  width: 100%;
  height: 100vh;
  left: 0;
  top: 0;
  object-fit: cover;
  z-index: 0;
}

/* main visual */
.main-visual {
  width: 100%;
  height: 100vh;
  position: relative;
  overflow: hidden;
}

.main-visual .main-bg {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.main-visual .main-bg-rwd {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:none;
}


@keyframes mainTitle {
  0% {
    opacity:  0;
    filter: blur(10px);
  }

  70% {
    /* opacity: 1; */
    filter: blur(0px);
  }

  100% {
    opacity: 1;
    /* filter: blur(0px); */

  }
}

.main-visual .main-title {
  position: absolute;


  animation-name: mainTitle;
  animation-duration: 2s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.69, 0, 1, 1);
  animation-delay: 1.8s;
  animation-iteration-count: 1;
  animation-direction: normal;
}

.main-visual .main-title>img {
  max-width: 100%;
  max-height: 100%;
}

.main-visual .main-title::after {
  /* position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(120deg,
    transparent 0%,
    white 50%,
    transparent 100%);
  content: ''; */
}

.main-visual .main-sub-title {
  position: absolute;
  width: 4%;
  right: 10%;
  top: 60%;

  animation-name: mainTitle;
  animation-duration: 2s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.69, 0, 1, 1);
  animation-delay: 5s;
  animation-iteration-count: 1;
  animation-direction: normal;
}

.main-visual .main-scroll {
  position: absolute;
  width:100%;
  text-align:center;
  top: 50px;
  left: 50%;
  display: flex;
  flex-direction: column;
  animation-name: mainTitle;
  animation-duration: 2s;
  animation-fill-mode: both;
  animation-delay: 1.5s;
  animation-iteration-count: 1;
  animation-direction: normal;
  background-color:rgba(0,0,0,0.2);
  transform: translate(-50%, -10%);
}

@keyframes bgtest {
  0% {
    background-position: 50% 50%;
  }

  100% {
    background-position: 50% 250%;
  }
}

.main-visual .main-scroll::after {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-size: 100% 200%;
  animation: bgtest 4s infinite linear;
}

.main-visual .main-scroll> .text_pc {
  color: #ffffff;
  text-shadow: 1px 1px 0 #ffffff;
  font-size: 2rem;
  letter-spacing: 0.1em;
  display:block;

}

.main-visual .main-scroll> .text_rwd {
   display:none;
}

@keyframes hiroin {
  0% {
    opacity: 0;
    filter: brightness(10);
    transform: translate(-60%, 0);
  }

  80% {
    opacity: 1;
    filter: brightness(1);
  }

  100% {
    transform: translate(-50%, 0);
  }
}

@keyframes hiroin2 {
  0% {
    opacity: 0;
    filter: brightness(10);
    transform: translate(-60%, 0);
  }

  80% {
    opacity: 1;
    filter: brightness(1);
  }

  100% {
    transform: translate(-50%, 0);
  }
}

.main-visual .main-hiroin {
  position: absolute;
  width: 40%;
  left: 10%;
  bottom: 0;

  animation-name: hiroin;
  animation-duration: 1.5s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.69, 0, 1, 1);
  animation-delay: 0;
  animation-iteration-count: 1;
  animation-direction: normal;
}

@keyframes syujinkou {
  0% {
    opacity: 0;
    filter: brightness(10);
    transform: translate(10%, 0);
  }

  80% {
    opacity: 1;
    filter: brightness(1);
  }

  100% {
    transform: translate(0, 0);
  }
}

.main-visual .main-syujinkou {
  position: absolute;
  width: 40%;
  left: 34%;
  bottom: 0;

  animation-name: syujinkou;
  animation-duration: 1.5s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.69, 0, 1, 1);
  animation-delay: 1s;
  animation-iteration-count: 1;
  animation-direction: normal;
}

.main-visual .main-character {
  position: absolute;
  max-width: 640px;
  width: 90%;
  max-height: 50%;
  left: 50%;
  top: 40%;
  transform: translate(-50%, -50%);
  animation-name: hiroin;
  animation-duration: 1.5s;
  animation-fill-mode: both;
  animation-timing-function: cubic-bezier(0.69, 0, 1, 1);
  animation-delay: .5s;
  animation-iteration-count: 1;
  animation-direction: normal;
}

@media (min-width: 576px) and (max-width: 991px) {

}

@media (min-width: 576px) {
  .main-visual .main-title {
    right: 5%;
    top: 5%;
    /* width: 25%; */
    height: 70%;
  }
}

@media (max-width: 575px) {
  .main-visual .main-scroll {
    
  }
  
	.main-visual .main-bg {
	  display:none;
	}

	.main-visual .main-bg-rwd {
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	  display:block;
	}

  .main-visual .main-scroll > .text_pc {
    display:none;
  }
  
  .main-visual .main-scroll > .text_rwd {
    color: #ffffff;
    text-shadow: 0.5px 0.5px 0 #ffffff;
    font-size: 1rem;
    letter-spacing: 0.1em;
	display:block;
  }
  
  .main-visual .main-title {
    left: 5%;
    top: 7%;
    width: 80%;
  }

  .main-visual .main-character {
    position: absolute;
	max-width: 640px;
	width: 90%;
	max-height: 50%;
	left: 50%;
	top: 40%;
	transform: translate(-50%, -50%);

    animation-name: hiroin2;
    animation-duration: 1.5s;
    animation-fill-mode: both;
    animation-timing-function: cubic-bezier(0.69, 0, 1, 1);
    animation-delay: .5s;
    animation-iteration-count: 1;
    animation-direction: normal;
  }
}
/* push */
.push-msg {
  background-color: #1B1F32;
  padding: 1rem 0;
  color: #d6c8c8;
}

.msg {
  color: white;
  margin-bottom: 0;
  text-align: center;
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 2px;
}

@media (min-width: 576px) and (max-width: 991px) {
  .msg {
    font-size: 1.4rem;
  }
}

@media (max-width: 575px) {
  .msg {
    font-size: 1rem;
  }
}

/* video */
.video {
  padding: 6rem 0;
}

.game-desc {
  color: #fff;
  display: block;
  margin: 0 auto;
  max-width: 700px;
  text-align: center;
  font-size: 1.8rem;
  margin-bottom: 4rem;
}

.game-desc .sm-only {
  display: none;
}

.sword-hr {
  display: block;
  margin: 0 auto;
  max-width: 400px;
  width: 80%;
  margin-bottom: 4rem;
}

@media (min-width: 576px) and (max-width: 991px) {
  .game-desc {
    font-size: 1.4rem;
  }
}

@media (max-width: 575px) {
  .video {
    padding: 3rem 0;
  }

  .game-desc {
    font-size: 1.4rem;
  }

  .game-desc .sm-only {
    display: inherit;
  }
}

/* intro */
.intro {
  padding: 6rem 0;
}

.intro-img {
  width: 90%;
  max-width: 600px;
}

.intro-text {
  color: #fff;
  font-size: 1.2rem;
  text-align: center;
  line-height: 1.8;
  margin-bottom: 1rem;
  text-shadow: 3px 3px 5px black;
}

.intro-deco-img {
  display: block;
  margin: 0 auto;
  max-width: 150px;
}

@media (min-width: 576px) and (max-width: 991px) {
  .intro-text {
    font-size: 1.2rem;
  }
}

@media (max-width: 575px) {
  .intro {
    padding: 3rem 0;
  }

  .intro-text {
    font-size: 1rem;
  }
}

/* event */
.event {
  padding: 4rem 0;
}

.event-card-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.event-card {
  max-width: 700px;
  position: relative;
  margin-bottom: 1rem;
}

.event-card-bg {
  width: 100%;
}

.event-card-pic {
  position: absolute;
  top: 7%;
  left: 3%;
  width: 30%;
  height: 88%;
}

.event-card-pic-content {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.event-card-pic-border {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.event-card-content {
  position: absolute;
  width: 53%;
  left: 40%;
  height: 83%;
  top: 9%;
}

.event-card-content-title {
  color: #fff;
  font-weight: bold;
  font-size: 2.2rem;
  margin: .5rem 0 1.5rem;
}

.event-card-content-title>span {
  color: #cf2f46;
}

.event-card-content-desc {
  color: #fff;
  font-size: 1.5rem;
}

.event-card-deco {
  position: absolute;
  width: 30%;
  right: 2%;
}

.event-card-deco.up {
  top: 5%;
}

.event-card-deco.down {
  bottom: 5%;
}

@media (min-width: 576px) and (max-width: 767px) {
  .event-card-content-title {
    font-size: 1.2rem;
  }

  .event-card-content-desc {
    font-size: 1rem;
  }
}

@media (max-width: 575px) {
  .event-card {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px;
  }

  .event-card-bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }

  .event-card-pic {
    position: relative;
    flex: 0 0 30%;
    left: inherit;
    top: inherit;
    width: inherit;
    height: inherit;
  }

  .event-card-content {
    position: relative;
    flex: 0 0 70%;
    left: inherit;
    top: inherit;
    width: inherit;
    height: inherit;
    padding: 0 10px;
  }

  .event-card-content-title {
    font-size: 1.2rem;
    margin: .5rem 0 .5rem;
  }

  .event-card-content-desc {
    font-size: 1rem;
  }
}

/* howto */
.howto {
  padding: 4rem 0;
}

.howto-card {
  position: relative;
  overflow: hidden;
}

.howto-card-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 15px 25px;
  transform: translate(0, 0);
  transition: transform 1s cubic-bezier(0.32,-0.46, 0.88, 0.4);
}

.howto-card-content-number {
  position: absolute;
  left: 4%;
  top: 0;
  font-size: 2.2rem;
  color: #584257;
}

.howto-card-content-img {
  height: 40%;
  display: block;
  margin-bottom: 1rem;
}

.howto-card-content-title {
  color: var(--general-pink);
  font-size: 2rem;
}

.howto-card-content-div {
  width: 100%;
  color: #fff;
  font-size: 1.2rem;
}

.howto.fired .howto-card-content {
  transform: translate(0, -100%);
}

.howto-card-content.spe {
  background-color: #0006;
  justify-content: center;
  transform: translate(0, 100%);
}


.howto-card-content.spe .howto-card-content-number {
  color: #fff;
}

.howto-card-content.spe .howto-card-content-img {
}

.howto-card-content.spe .howto-card-content-title {
}

.howto-card-content.spe .howto-card-content-div {

}

.howto.fired .howto-card-content.spe {
  transform: translate(0, 0);
}

.modal.spe .modal-content {
  background-color: transparent;
  border: solid 1px #fff;
}

.modal.spe .modal-content .modal-body {
  color: #fff;
  padding: 1.5rem;
}

@media (min-width: 425px) and (max-width: 991px) {
  .howto-card-content-img {
    height: 30%;
  }

  .howto-card-content-number {
    font-size: 1.4rem;
  }

  .howto-card-content-title {
    font-size: 1.2rem;
  }

  .howto-card-content-div {
    font-size: .8rem;
  }
}

@media (max-width: 424px) {
  .howto {
    padding: 2rem 0;
  }

  .howto-card-content-img {
    height: 30%;
  }

  .howto-card-content-number {
    font-size: 1.4rem;
  }

  .howto-card-content-title {
    font-size: 1.2rem;
  }

  .howto-card-content-div {
    font-size: .8rem;
  }
}

/* reg */
.reg {
  padding: 4rem 0;
}

.reg-table {
  /* width: 100%; */
  margin-top: 1rem;
  margin-bottom: 1.5rem;
}

.reg-table {
  margin-top: 1rem;
  margin-bottom: 1.5rem;
}

.reg-table-col {
  width: 25%;
}

.reg-table-date {
  border: solid 1px #444;
  background-color: #fff;
  padding: 1rem 0;
  text-align: center;
  font-size: 1.2rem;
  color: #444;
  letter-spacing: 2px;
  font-weight: bold;
  margin-bottom: .2rem;
}

.reg-table-times {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.reg-table-time {
  padding: .2rem;
}

.btn.reg-btn {
  width: 100%;
  border-radius: 0;
  background-color: var(--general-red);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #fff;
}

.btn.reg-btn:hover, .btn.reg-btn:focus {
  outline: none;
  box-shadow: none;
}

.btn.reg-btn.reg-btn-less {
  background-color: var(--general-dark-red);
}

.btn.reg-btn.reg-btn-less:hover, .btn.reg-btn.reg-btn-less:focus {
}

.btn.reg-btn[disabled] {
  background-color: #999;
}

.reg-countdown-container {
  display: flex;
  justify-content: space-between;
}

.reg-countdown-card {
  width: 100%;
  max-width: 150px;
  padding: 2rem 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #0000008c;
  color: #fff;
}

.reg-countdown-card .number {
  font-size: 2.5rem;
  letter-spacing: 3px;
}

.reg-countdown-card .unit {

}

.reg-unlock-container {
  color: #fff;
}

.reg-unlock-container hr {
  border-color: #fff;
}

.reg-unlock-title {
  color: var(--general-pink);
  font-size: 1.8rem;
  margin: 0;
}

.reg-unlock-amount {
  color: #fff;
  font-size: 1.8rem;
  margin: 0;
}

.reg-unlock-amount .number {
  font-size: 3rem;
}

.reg-unlock-process-container {
  padding: 1.5rem 0;
}

.reg-unlock-process-card {
  position: relative;
  border: solid 1px var(--general-pink);
  margin-top: 3rem;
}

.reg-unlock-process-card .header {
  color: #fff;
  background-color: var(--general-pink);
  padding: .5rem;
}

.reg-unlock-process-card .header>p {
  margin: 0;
  font-size: 1.4rem;
}

.reg-unlock-process-card .header p.amount {
  font-size: 2rem;
}

.reg-unlock-process-card .img {
  text-align: center;
  height: 160px;
  padding: 5px;
}

.reg-unlock-process-card .img>img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.reg-unlock-process-card .reach {
  position: absolute;
  right: 0;
  top: 0;
  transform: translate(0, -50%);
  max-width: 100px;
  display: none;
}

.reg-unlock-process-card.active .reach {
  display: block;
}

@media (min-width:768px) {
  .flickity-button {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .reg-countdown-card {
    max-width: 130px;
    padding: 1rem 0;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  .reg-table {
    /* overflow-x: scroll; */
    /* margin-left: 50px;
    margin-right: 50px; */
  }

  .reg-table-col {
    width: 80%;
  }

  .reg-countdown-card {
    max-width: 100px;
    padding: 1rem 0;
  }

  .reg-countdown-card .number {
    font-size: 2rem;
  }
}

@media (max-width: 575px) {
  .reg-table {
    /* overflow-x: scroll; */
    /* margin-left: 50px;
    margin-right: 50px; */
  }

  .reg-table-col {
    width: 80%;
  }

  .reg-table-times {
    flex-wrap: wrap;
    height: 80vh;
  }

  .reg-table-time {
    height: 20%;
  }

  .reg-table-time .btn.reg-btn {
    height: 100%;
  }

  .reg-unlock-process-card {
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
  }

  .reg-countdown-card {
    max-width: inherit;
  }

  .reg-countdown-card .number {
    font-size: 2rem;
  }
}

/* prize */
.prize {
  padding: 4rem 0;
}

.prize-slogan {
  color: #fff;
  font-size: 2rem;
  text-align: center;
}

.prize-card-row {
  /* width: 100%; */
  margin-left: -15px;
  margin-right: -15px;
}

.prize-card-col {
  width: 33.33%;
  padding: 15px;
}

.prize-card {
  position: relative;
  display: flex;
  width: 100%;
  border-width: 1px;
  border-color: #fced20;
  border-style: solid;
  transition: border-color .4s ease, color .4s ease;
  color: #fced20;

  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: #0006;
  padding: 1rem 1.5rem;
}

.prize-card:hover {
  border-color: #f15a25;
  color: #f15a25;
  text-decoration: none;
}

.prize-card .prize-img {
  width: 100%;
}

.prize-card .prize-img>div {
  position: relative;
  padding-top: 75%;
}

.prize-card .prize-img>div>img {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  object-fit: contain;
}

.prize-card .prize-name {
  font-size: 2.5rem;
  font-weight: 1000;
  font-style: italic;
  margin: 0;
}

@media (max-width: 767px) {
  .prize-card-row {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .prize-card-col {
    width: 90%;
    padding: 15px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .prize-card .prize-name {
    font-size: 1.8rem;
  }
}

@media (min-width: 578px) and (max-width: 767px) {
  .prize-card .prize-name {
    font-size: 1.8rem;
  }
}

@media (max-width: 575px) {
  .prize-card {
    max-width: 300px;
    margin: 0 auto;
  }

  .prize-card .prize-name {
    font-size: 1.4rem;
  }
}

/* notice */
.notice {
  padding: 4rem 0;
}

@media (min-width: 576px) and (max-width: 991px) {
}

@media (max-width: 575px) {
  .notice {
    padding: 2rem 0;
  }
}

/* faq */
.faq {
  padding: 4rem 0;
}

@media (min-width: 576px) and (max-width: 991px) {
}

@media (max-width: 575px) {
  .faq {
    padding: 2rem 0;
  }
}

/* logos */
.logos {
  padding: 4rem 0;
}

@media (min-width: 576px) and (max-width: 991px) {
}

@media (max-width: 575px) {
  .logos {
    padding: 2rem 0;
  }
}

/* fixed buy btn */
.fixed-buy-link {
  display: block;
  position: fixed;
  width: 200px;
  bottom: 0;
  right: 0;
  padding: 5px;
  transition: transform .2s ease;
  transform: translate(0, 100%);
  color: #fff;
}

.fixed-buy-link:hover {
  color: #fff;
  text-decoration: none;
}

.fixed-buy-link.active {
  transform: translate(0, 0);
}

.fixed-buy-link>img {
  width: 100%;
}

.fixed-buy-link img.normal {
  display: block;
}

.fixed-buy-link img.hover, .fixed-buy-link img.clicked {
  display: none;
}

.fixed-buy-link:hover img.normal, .fixed-buy-link:focus img.normal {
  display: none;
}

.fixed-buy-link:hover:not(:focus) img.hover {
  display: block;
}

.fixed-buy-link:focus img.clicked {
  display: block;
}

.fixed-buy-link>p {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 2rem;
  white-space: nowrap;
  letter-spacing: 2px;
}

@media (min-width: 576px) and (max-width: 991px) {
  .fixed-buy-link {
    width: 150px;
  }

  .fixed-buy-link>p {
    font-size: 1.4rem;
    letter-spacing: 2px;
  }
}

@media (max-width: 575px) {
  .fixed-buy-link {
    width: 100px;
  }

  .fixed-buy-link>p {
    font-size: 1rem;
  }
}