@import url(https://fonts.googleapis.com/earlyaccess/roundedmplus1c.css);
@import url("https://fonts.googleapis.com/css?family=Bevan&display=swap");
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom; }

@media only screen and (max-width: 767px) {
  html {
    font-size: 67.25%; } }
@media only screen and (min-width: 768px) {
  html {
    font-size: 1em; } }

body {
  color: #f19457;
  background: #682577;
  background-repeat: repeat;
  font-size: inherit;
  position: relative;
  margin: 0;
  padding: 0;
  font-family: 'Rounded Mplus 1c';
  background-image: url("/dir/umd/cosplay/img/halloween2019/bg.png");
  background-repeat: repeat; }

.cloud {
  background-image: url("/dir/umd/cosplay/img/halloween2019/cloud.png");
  background-repeat: repeat; }

.footimg {
  position: absolute;
  bottom: 130px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  z-index: 9; }
  @media only screen and (min-width: 768px) {
    .footimg {
      max-width: 1050px; } }
  .footimg img {
    width: 100%; }

figure {
  margin: 0;
  padding: 0; }

.wrap {
  position: relative;
  padding: 0 10px;
  width: calc(100% - 20px);
  z-index: 10; }
  @media only screen and (max-width: 767px) {
    .wrap {
      margin: 0 auto 200px;
      max-width: 394px; } }
  @media only screen and (min-width: 768px) {
    .wrap {
      margin: 0 auto 370px;
      max-width: 900px; } }

@media only screen and (min-width: 768px) {
  .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; } }

@media only screen and (min-width: 768px) {
  .hero {
    margin: 0 auto;
    padding: 0;
    position: relative; } }
.hero .main {
  width: 100%; }
  @media only screen and (min-width: 768px) {
    .hero .main {
      border-radius: 12px;
      margin: 0 auto; } }
  .hero .main img {
    width: 100%; }

.head {
  margin: 35px auto 0 auto;
  width: 100%; }

.lead {
  position: relative;
  background-color: rgba(51, 19, 60, 0.7); }
  @media only screen and (max-width: 767px) {
    .lead {
      margin: 90px 0 60px;
      padding: 20px 10px 50px;
      border-radius: 30px; } }
  @media only screen and (min-width: 768px) {
    .lead {
      margin: 160px 0 55px;
      padding: 70px 100px 140px;
      border-radius: 50% 50% 50% 70%/50% 50% 70% 60%; } }
  .lead h1 {
    color: #f19457;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    padding: 0;
    text-align: center; }
    @media only screen and (max-width: 767px) {
      .lead h1 {
        top: -12.5%; } }
    @media only screen and (min-width: 768px) {
      .lead h1 {
        top: -13%; } }
    .lead h1 img {
      width: 80%;
      height: auto;
      filter: drop-shadow(0 8px 3px rgba(51, 19, 60, 0.9)); }
  .lead .g1 {
    position: absolute;
    animation: float_1 3s linear infinite;
    transform-origin: 50% 50%;
    filter: drop-shadow(7px 15px 3px rgba(51, 19, 60, 0.9)); }
    @media only screen and (max-width: 767px) {
      .lead .g1 {
        bottom: -8%;
        right: -0.5%; }
        .lead .g1 img {
          width: 95px;
          height: auto; } }
    @media only screen and (min-width: 768px) {
      .lead .g1 {
        top: 16%;
        right: -4%; } }
  .lead .g2 {
    position: absolute;
    animation: float_2 4s linear infinite;
    transform-origin: 50% 50%;
    filter: drop-shadow(7px 15px 3px rgba(51, 19, 60, 0.9)); }
    @media only screen and (max-width: 767px) {
      .lead .g2 {
        display: none; } }
    @media only screen and (min-width: 768px) {
      .lead .g2 {
        top: 28%;
        left: -7%; } }
  .lead .g3 {
    position: absolute;
    animation: float_3 3.5s linear infinite;
    transform-origin: 50% 50%;
    filter: drop-shadow(7px 15px 3px rgba(51, 19, 60, 0.9)); }
    @media only screen and (max-width: 767px) {
      .lead .g3 {
        bottom: -9%;
        left: 1%; }
        .lead .g3 img {
          width: 100px;
          height: auto; } }
    @media only screen and (min-width: 768px) {
      .lead .g3 {
        bottom: 10%;
        left: 3%; } }
@keyframes float_1 {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(-6px); }
  100% {
    transform: translateY(0); } }
@keyframes float_2 {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(7px); }
  100% {
    transform: translateY(0); } }
@keyframes float_3 {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(-10px); }
  100% {
    transform: translateY(0); } }
  .lead__inner {
    text-align: center;
    color: #fff; }
    @media only screen and (max-width: 767px) {
      .lead__inner {
        font-size: 1.2rem;
        line-height: 1.5; } }
    @media only screen and (min-width: 768px) {
      .lead__inner {
        font-size: 1.1rem;
        line-height: 1.75; } }
    @media only screen and (max-width: 767px) {
      .lead__inner span {
        color: #fff;
        font-size: 1.2rem;
        line-height: 1.5; } }
    @media only screen and (min-width: 768px) {
      .lead__inner span {
        font-size: 2.0rem; } }

@media only screen and (max-width: 767px) {
  .content {
    margin: 50px auto 0 auto; } }
@media only screen and (min-width: 768px) {
  .content {
    margin: 50px auto 0 auto; } }
.content__head {
  text-align: center; }
  @media only screen and (max-width: 767px) {
    .content__head {
      margin: 0 auto 35px auto;
      padding: 0;
      width: 100%; } }
  @media only screen and (min-width: 768px) {
    .content__head {
      margin: 0 auto 55px;
      padding: 0; } }
  .content__head img {
    height: auto;
    filter: drop-shadow(0 8px 3px rgba(51, 19, 60, 0.9)); }
    @media only screen and (max-width: 767px) {
      .content__head img {
        width: 230px; } }
    @media only screen and (min-width: 768px) {
      .content__head img {
        width: 330px; } }
@media only screen and (max-width: 767px) {
  .content__body {
    margin-bottom: 30px; } }

@media only screen and (min-width: 768px) {
  .topics {
    justify-content: center; } }
@media only screen and (max-width: 767px) {
  .topics__article {
    display: flex;
    justify-content: space-between;
    margin: 40px 0 0 0;
    width: 100%; } }
@media only screen and (min-width: 768px) {
  .topics__article {
    margin: 0 15px 65px 15px;
    width: calc(25% - 30px); } }
.topics__article__image .pic {
  position: relative;
  overflow: hidden;
  background: #f19457;
  border-radius: 50%;
  filter: drop-shadow(0 0px 6px rgba(51, 19, 60, 0.9)); }
  @media only screen and (max-width: 767px) {
    .topics__article__image .pic {
      width: 135px;
      height: 135px; } }
  @media only screen and (min-width: 768px) {
    .topics__article__image .pic {
      width: 194px;
      height: 194px; } }
.topics__article__image img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto; }
  .topics__article__image img:hover {
    filter: brightness(1.2); }
@media only screen and (max-width: 767px) {
  .topics__article__text {
    width: calc(60% - 10px); } }
@media only screen and (min-width: 768px) {
  .topics__article__text {
    width: 100%; } }
.topics__article__title {
  color: #f19457;
  text-shadow: 0 3px 3px rgba(51, 19, 60, 0.9); }
  @media only screen and (max-width: 767px) {
    .topics__article__title {
      font-size: 1.3rem; } }
  @media only screen and (min-width: 768px) {
    .topics__article__title {
      font-size: 1rem; } }
  .topics__article__title a {
    text-decoration: none; }
.topics__article .continue {
  filter: drop-shadow(0 5px 3px rgba(51, 19, 60, 0.9)); }
  @media only screen and (max-width: 767px) {
    .topics__article .continue {
      text-align: right; } }
  @media only screen and (min-width: 768px) {
    .topics__article .continue {
      text-align: center; } }
  .topics__article .continue:hover {
    filter: brightness(1.5); }

.comingsoon {
  text-align: center; }

@media only screen and (max-width: 767px) {
  #webshop_items {
    width: 100%; } }
@media only screen and (min-width: 768px) {
  #webshop_items {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; } }
@media only screen and (max-width: 767px) {
  #webshop_items .item_wrap {
    display: flex;
    justify-content: space-between;
    margin: 40px 0 0 0; } }
@media only screen and (min-width: 768px) {
  #webshop_items .item_wrap {
    margin: 0 5px;
    padding: 0;
    width: calc(20% - 30px); } }
@media only screen and (max-width: 767px) {
  #webshop_items .item_img {
    width: 40%; } }
@media only screen and (min-width: 768px) {
  #webshop_items .item_img {
    margin: 0 10px 20px;
    padding: 0; } }
#webshop_items .item_img__diamond {
  border-radius: 50%;
  background-color: #f19457;
  position: relative;
  overflow: hidden;
  filter: drop-shadow(0 0px 6px rgba(51, 19, 60, 0.9)); }
  @media only screen and (max-width: 767px) {
    #webshop_items .item_img__diamond {
      margin: 0 20px 0 0;
      padding: 0; } }
  @media only screen and (min-width: 768px) {
    #webshop_items .item_img__diamond {
      margin: 0;
      padding: 0; }
      #webshop_items .item_img__diamond:hover img {
        filter: brightness(1.2); } }
#webshop_items .item_img img {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 125%; }
#webshop_items .item_img .spacer {
  padding-bottom: 100%; }
@media only screen and (max-width: 767px) {
  #webshop_items .item_name {
    font-size: 1.3rem;
    line-height: 1.5;
    position: relative;
    width: calc(60% - 10px); } }
@media only screen and (min-width: 768px) {
  #webshop_items .item_name {
    width: 100%; } }
#webshop_items .item_name a {
  color: #f19457;
  font-weight: 600;
  text-shadow: 0 3px 3px rgba(51, 19, 60, 0.9); }
  @media only screen and (max-width: 767px) {
    #webshop_items .item_name a {
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%); } }

.more {
  text-align: center;
  filter: drop-shadow(0 5px 3px rgba(51, 19, 60, 0.9)); }
  @media only screen and (max-width: 767px) {
    .more {
      margin: 50px auto 0 auto; } }
  @media only screen and (min-width: 768px) {
    .more {
      margin: 30px auto 0 auto; } }
  .more:hover {
    filter: brightness(1.5); }

@media only screen and (max-width: 767px) {
  .event {
    width: 100%; } }
@media only screen and (min-width: 768px) {
  .event {
    width: calc(50% - 35px);
    margin: 45px 0 0; } }
.event__content {
  box-sizing: border-box;
  background-color: rgba(74, 24, 73, 0.7);
  border-radius: 12px;
  padding: 1.5em 1em; }
  @media only screen and (max-width: 767px) {
    .event__content {
      box-sizing: border-box; } }
  @media only screen and (min-width: 768px) {
    .event__content {
      height: 455px; } }
@media only screen and (max-width: 767px) {
  .event__shop {
    font-size: 1.9rem;
    font-weight: 900;
    line-height: 1;
    margin: 0 auto;
    padding-bottom: 5px; } }
@media only screen and (min-width: 768px) {
  .event__shop {
    font-size: 1.5rem;
    font-weight: 900;
    line-height: 1;
    margin: 0 auto;
    padding-bottom: 5px; } }

@media only screen and (max-width: 767px) {
  .twitter {
    margin: 50px auto 0 auto;
    text-align: center;
    width: 100%; } }
@media only screen and (min-width: 768px) {
  .twitter {
    width: calc(50% - 35px);
    margin: 45px 0 0; } }
.twitter .twitter-timeline {
  width: 100%; }
.twitter__content {
  box-sizing: border-box;
  background-color: rgba(74, 24, 73, 0.7);
  border-radius: 12px;
  padding: 1.5em 1em; }

.foot_bg {
  background: #4a1849;
  padding: 30px 0 0;
  height: 100px; }

@media only screen and (max-width: 767px) {
  .page_top {
    display: none; } }
@media only screen and (min-width: 768px) {
  .page_top {
    position: fixed;
    right: 2.7%;
    bottom: 5%;
    z-index: 99; } }
.page_top img {
  filter: drop-shadow(0 8px 3px rgba(51, 19, 60, 0.7));
  width: 70px; }

.global_head {
  margin-bottom: 0; }

footer {
  position: relative;
  z-index: 10; }