@charset "UTF-8";
/* urgent
========================================== */
.warauoomisoka_urgent_area {
  padding: 1.5%;
  background: #ffffff;
}

.warauoomisoka_urgent_inner {
  width: 100%;
  max-width: 1000px;
  padding: 1.5%;
  margin: 0 auto;
  border: #dd0616 2px solid;
  font-weight: bold;
  color: #dd0616;
}

/* news
========================================== */
.warauoomisoka_news_area {
  background: url(../images/common/bg_floor.jpg) center bottom no-repeat;
  background-size: contain;
}

.warauoomisoka_news_body {
  position: relative;
  z-index: 1;
}

.warauoomisoka_news_inner {
  width: 100%;
  max-width: 1000px;
  padding: 8% 0 10%;
  margin: 0 auto;
}

.warauoomisoka_news_inner a {
  display: block;
}

.warauoomisoka_news_title {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  width: 18.1%;
  padding-top: 10.8%;
  margin: 0 auto 4%;
  background-image: url(../images/top/title_news.png);
}

.warauoomisoka_news_item:not(:last-child) {
  margin-bottom: 2%;
}

.warauoomisoka_news_item a {
  max-width: 915px;
  padding: 2% 4%;
  margin: 0 auto;
  background-color: #ffffff;
  border-radius: 10px;
  border: #000 2px solid;
  position: relative;
  display: flex;
  align-items: center;
  font-size: 1.6rem;
  font-weight: bold;
  letter-spacing: 0.1rem;
}

.warauoomisoka_news_item a .date {
  padding-right: 2%;
  color: #dd0616;
}

/* banner
========================================== */
.warauoomisoka_banner_body {
  position: relative;
  z-index: 1;
}

.warauoomisoka_banner_inner {
  width: 70%;
  max-width: 1000px;
  padding: 5% 0 0;
  margin: 0 auto;
}

.warauoomisoka_banner_inner p:nth-of-type(n+1) {
  margin-bottom: 2%;
}

.warauoomisoka_banner_inner p img {
  width: 100%;
  height: auto;
}

/* about
========================================== */
.warauoomisoka_about_area {
  background: url(../images/common/bg_floor.jpg) center bottom no-repeat;
  background-size: contain;
}

.warauoomisoka_about_body {
  position: relative;
  z-index: 1;
}

.warauoomisoka_about_inner {
  width: 100%;
  max-width: 1000px;
  padding: 5% 0 10%;
  margin: 0 auto;
}

.warauoomisoka_about_inner a {
  display: block;
}

.warauoomisoka_about_title {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  width: 24.1%;
  padding-top: 10.8%;
  margin: 0 auto 5%;
  background-image: url(../images/top/title_about.png);
}

.warauoomisoka_about_box {
  max-width: 915px;
  padding: 10% 0;
  margin: 0 auto;
  background-color: #ffffff;
  border-radius: 10px;
  border: #000 2px solid;
  position: relative;
}

.warauoomisoka_about_box::after {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  content: '';
  width: 102.73224%;
  padding-top: 22.18579%;
  background-image: url(../images/top/deco_about.png);
  display: block;
  position: absolute;
  bottom: -1%;
  left: -1.5%;
}

.warauoomisoka_about_text {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  width: 58.36066%;
  padding-top: 43.27869%;
  margin: 0 auto;
  background-image: url(../images/top/text_about.png);
}

/* mc
========================================== */
.warauoomisoka_mc_body {
  box-shadow: 0 60px 30px -30px rgba(0, 0, 0, 0.2) inset;
  position: relative;
  z-index: 1;
}

.warauoomisoka_mc_area {
  position: relative;
}

.warauoomisoka_mc_area::before {
  content: '';
  width: 100%;
  height: 310px;
  background: url(../images/common/bg_dots_top.jpg) center top repeat-x;
  background-size: contain;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

.warauoomisoka_mc_area::after {
  content: '';
  width: 100%;
  height: 310px;
  background: url(../images/common/bg_dots_bottom.jpg) center bottom repeat-x;
  background-size: contain;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 0;
}

.warauoomisoka_mc_inner {
  width: 100%;
  max-width: 1000px;
  padding: 10% 0 7%;
  margin: 0 auto;
  position: relative;
}

.warauoomisoka_mc_inner a {
  display: block;
}

.warauoomisoka_mc_title {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  width: 8.8%;
  padding-top: 10.8%;
  margin: 0 auto 5%;
  background-image: url(../images/top/title_mc.png);
}

.warauoomisoka_mc_box {
  max-width: 915px;
  margin: 0 auto;
}

.warauoomisoka_mc_text {
  padding: 0 2%;
  text-align: center;
  font-size: 2.6rem;
  font-weight: bold;
  letter-spacing: 0.1rem;
  color: #ffffff;
}

.warauoomisoka_mc_img {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  width: 95%;
  padding-top: 88%;
  margin: 5% auto;
  background-image: url(../images/top/img_mc.png);
}

.warauoomisoka_mc_img.comp {
  background-image: url(../images/top/img_mc_comp.png);
}

.warauoomisoka_mc_btn {
  max-width: 400px;
  margin: 5% auto 0;
}

.warauoomisoka_mc_btn a {
  width: 100%;
  padding: 3.5%;
  background: #000000;
  border-radius: 50px;
  border: #ffffff 2px solid;
  color: #ffffff;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  display: block;
}

/* topics
========================================== */
.warauoomisoka_main #topics.topics-area {
  margin: 0 auto;
  padding: 10% 0;
  background: url(../images/common/bg_floor.jpg) center bottom no-repeat;
  background-size: contain;
  box-shadow: 0 60px 30px -30px rgba(0, 0, 0, 0.2) inset;
}

.warauoomisoka_main #topics .topics-title {
  max-width: 1000px;
  margin: 0 auto 5%;
}

.warauoomisoka_main #topics .topics-title span {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  width: 23.7%;
  padding-top: 10.8%;
  margin: 0 auto;
  background-image: url(../images/top/title_topics.png);
  display: block;
}

.warauoomisoka_main #topics .topics-btn {
  max-width: 400px;
  margin: 5% auto 0;
}

.warauoomisoka_main #topics .topics-btn a {
  width: 100%;
  padding: 3.5%;
  background: #000000;
  border-radius: 50px;
  border: #ffffff 2px solid;
  color: #ffffff;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  display: block;
}

/* sns
========================================== */
.warauoomisoka_sns_body {
  box-shadow: 0 60px 30px -30px rgba(0, 0, 0, 0.2) inset;
  position: relative;
  z-index: 1;
}

.warauoomisoka_sns_area {
  position: relative;
}

.warauoomisoka_sns_area::before {
  content: '';
  width: 100%;
  height: 310px;
  background: url(../images/common/bg_dots_top.jpg) center top repeat-x;
  background-size: contain;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

.warauoomisoka_sns_area::after {
  content: '';
  width: 100%;
  height: 310px;
  background: url(../images/common/bg_dots_bottom.jpg) center bottom repeat-x;
  background-size: contain;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 0;
}

.warauoomisoka_sns_inner {
  width: 100%;
  max-width: 1000px;
  padding: 10% 0;
  margin: 0 auto;
  position: relative;
}

.warauoomisoka_sns_inner a {
  display: block;
}

.warauoomisoka_sns_title {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  font-size: 0;
  text-indent: -9999px;
  white-space: nowrap;
  width: 12.6%;
  padding-top: 10.8%;
  margin: 0 auto 5%;
  background-image: url(../images/top/title_sns.png);
}

.warauoomisoka_sns_box {
  max-width: 915px;
  padding: 2% 0;
  margin: 0 auto;
  background-color: #ffffff;
  border-radius: 10px;
  border: #000 2px solid;
}

.warauoomisoka_sns_box p {
  padding: 200px 0;
  text-align: center;
  font-size: 3rem;
  font-weight: bold;
  line-height: 0;
}

.warauoomisoka_sns_twitter {
  max-width: 700px;
  margin: 0 auto;
  height: 500px;
}

.warauoomisoka_sns_btn {
  max-width: 400px;
  margin: 5% auto 0;
}

.warauoomisoka_sns_btn a {
  width: 100%;
  padding: 3.5%;
  background: #000000;
  border-radius: 50px;
  border: #ffffff 2px solid;
  color: #ffffff;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  display: block;
}

/* 993px以下
========================================== */
@media only screen and (max-width: 993px) {
  .warauoomisoka_news_inner {
    padding: 7% 2%;
  }
  .warauoomisoka_news_item a {
    font-size: 1.3rem;
  }
  .warauoomisoka_banner_inner {
    width: 95%;
  }
  .warauoomisoka_about_inner {
    padding: 5% 2% 7%;
  }
  .warauoomisoka_sns_inner {
    padding: 7% 2%;
  }
}

/* 600px以下
========================================== */
@media only screen and (max-width: 600px) {
  .warauoomisoka_main #topics .topics-title span {
    width: 31.6%;
    padding-top: 14.4%;
  }
  .warauoomisoka_urgent_inner {
    font-size: 1.2rem;
  }
  .warauoomisoka_news_title {
    width: 24.13333%;
    padding-top: 14.4%;
  }
  .warauoomisoka_about_title {
    width: 32.13333%;
    padding-top: 14.4%;
  }
  .warauoomisoka_about_box {
    padding: 10% 5%;
  }
  .warauoomisoka_about_text {
    width: 89%;
    padding-top: 66%;
  }
  .warauoomisoka_mc_area::before {
    height: 150px;
    background-size: 150%;
    background-position: center bottom;
  }
  .warauoomisoka_mc_area::after {
    height: 150px;
    background-size: 150%;
    background-position: center top;
  }
  .warauoomisoka_mc_body {
    box-shadow: 0 30px 15px -15px rgba(0, 0, 0, 0.2) inset;
  }
  .warauoomisoka_mc_title {
    width: 11.73333%;
    padding-top: 14.4%;
  }
  .warauoomisoka_mc_text {
    font-size: 2rem;
  }
  .warauoomisoka_mc_btn {
    max-width: auto;
    width: 70%;
    margin-top: 7%;
  }
  .warauoomisoka_mc_btn a {
    font-size: 1.4rem;
  }
  .warauoomisoka_sns_area::before {
    height: 150px;
    background-size: 150%;
    background-position: center bottom;
  }
  .warauoomisoka_sns_area::after {
    height: 150px;
    background-size: 150%;
    background-position: center top;
  }
  .warauoomisoka_sns_body {
    box-shadow: 0 30px 15px -15px rgba(0, 0, 0, 0.2) inset;
  }
  .warauoomisoka_sns_box p {
    padding: 30% 0;
    font-size: 5vw;
  }
  .warauoomisoka_sns_title {
    width: 16.8%;
    padding-top: 14.4%;
  }
  .warauoomisoka_sns_twitter {
    height: 300px;
    overflow: auto;
  }
  .warauoomisoka_sns_btn {
    max-width: auto;
    width: 70%;
    margin-top: 7%;
  }
  .warauoomisoka_sns_btn a {
    font-size: 1.4rem;
  }
}