@charset "utf-8";

body {
  background: none;
}

#wrapper {
  font-size: 16px;
}

#wrapper #msthd {
  width: 990px;
}

a {
  text-decoration: none;
  color: #4062ff;
}

/* reset */
form {
  margin: 0;
  padding: 0;
  display: flow-root;
}

button {
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  line-height: inherit;
  color: inherit;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

/*btn*/
.campaign_btn {
  text-align: center;
}

.campaign_btn button {
  transition: all 0.3s;
}

.campaign_btn button:hover {
  opacity: 0.8;
}

.btn_caution {
  transition: all 0.3s;
}

.btn_caution:hover {
  opacity: 0.8;
}

.campaign_btn_item {
  display: inline-block;
  width: 90%;
  height: auto;
  margin: 0 auto;
  font-size: 24px;
  color: #fff;
  font-weight: bold;
  padding: 12px 0px;
}

#pc .campaign_btn_item {
  width: auto;
  padding: 20px 100px;
}

.btnBlue {
  background-color: #3895ff;
  color: #fff;
  border-radius: 10px;
}

.btnRed {
  background-color: #ff0023;
  box-shadow: 4px 2px 5px rgba(0, 0, 0, 0.8);
  border-radius: 50px;
}

.btn_caution {
  font-size: 14px;
  text-align: center;
  padding-top: 16px;
}

.btn_caution a {
  color: #4062ff;
}

/*mv_area*/
.mv_area {
  max-width: 100%;
}

.mv_countdown {
  padding: 10px;
  text-align: center;
  font-weight: bold;
  background-color: #000;
  color: #fff;
}

#pc .mv_area {
  max-width: 990px;
  margin: 0 auto;
}

.mv_area img {
  display: block;
  width: 100%;
}

.mv_text {
  margin: 12px 0;
  text-align: center;
  font-weight: bold;
}

#pc .mv_text {
  margin-top: 20px;
}

/* SP時にのみ適用 */
#sp .sp_none {
  display: none;
}

#sp .mv_sub_text {
  font-size: 12px;
  display: block;
}

#sp .mv_caution .mv_sub_text {
  font-size: 16px;
}
/* /SP時にのみ適用 */

.mv_caution {
  margin: 0px 0 24px;
  padding: 0 12px;
  color: #cc0a1d;
  font-weight: bold;
  text-align: center;
}

#pc .mv_caution {
  margin-top: -4px;
  padding: 0;
}

.mv_caution.complete {
  color: #f90888;
  margin: 0px 0 16px;
}

#pc .mv_caution.complete {
  margin-top: -4px;
}

/*contents_area*/
.contents_btn,
.contents_wrapper,
.contents_note {
  padding: 0 15px;
}

#pc .contents_btn,
#pc .contents_wrapper,
#pc .contents_note {
  max-width: 750px;
  padding: 0 120px;
  margin: 0 auto;
  text-align: center;
}

.contents_btn img,
.contents_wrapper img,
.contents_note img {
  display: block;
  width: 100%;
}

.contents_item {
  padding-top: 40px;
}

#pc .contents_item {
  padding-top: 80px;
}

/*note_area*/
.note_area {
  padding-top: 40px;
  margin-bottom: 40px;
  background: #fff;
  text-align: center;
}

#pc .note_area {
  padding-top: 80px;
  margin-bottom: 80px;
}

.note_area .note_text {
  line-height: 160%;
  text-align: left;
}

.note_ttl {
  margin-bottom: 25px;
  font-size: 21px;
  text-align: center;
  font-weight: bold;
  display: inline-block;
}

#pc .note_ttl {
  margin-bottom: 30px;
  font-size: 32px;
  line-height: 150%;
}

.note_area dt {
  font-weight: bold;
  margin-bottom: 2px;
}

#pc .note_area dt {
  margin-bottom: 5px;
}

.note_area dd {
  margin-bottom: 20px;
}

#pc .note_area dd {
  margin-bottom: 30px;
}

.note_sub_title {
  font-weight: bold;
}

/* sns_area */
.sns_area {
  padding: 30px;
  text-align: center;
  background: #ffffff;
}

.sns_area a {
  display: inline-block;
}

.tw_btn,
.fb_btn {
  width: 40px;
  height: 40px;
  text-indent: -9999px;
  background: url("https://s.yimg.jp/images/toto/3.0/promotion/common/img/logo_x.png")
    no-repeat;
  background-size: 40px auto;
  margin-right: 12px;
}

.fb_btn {
  background: url("https://s.yimg.jp/images/toto/3.0/promotion/common/img/logo_fb.png")
    no-repeat;
  background-size: 40px auto;
}

/*sticky---------------------------------*/
.hide {
  display: none;
}

.sticky {
  position: fixed;
  top: auto;
  bottom: 0;
  left: 0;
  height: auto;
  box-sizing: border-box;
  width: 100%;
  background: #fff;
  z-index: 1000;
  -webkit-animation-duration: 0.7s;
  animation-duration: 0.7s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  padding: 15px !important;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }

  100% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.sticky.fadeInUp {
  text-align: center;
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}
