/*
  キャンペーンLP用CSS
*/

@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Crimson+Text&display=swap');/* font-family: 'Crimson Text', serif; */


body {
  background: #ff0000;
}

body.lpcampaign:after{
  border:none !important;
}


/* メインビジュアル
--------------------------------------------------------------*/
#maintitle {
  background: #000;
  position: relative;
  overflow: hidden;
  padding-bottom: 200px;
}


/* 優勝者
--------------------------------------------------------------*/

.inner {
  /*max-width: 1100px;*/
  margin: 0 auto 0;
  line-height: 0;
}
.inner h2 {
  position: relative;
  left: calc( 50% + 50px );
  top: 0;
  width: 50%;
  margin: 0 0 40px;
  padding-top: 55px;
}
.inner h2::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 45px;
  z-index: -1;
  background: url(../images/lp_bg_winner.png) no-repeat center center / contain;
  width: 424px;
  height: 70px;
}
.inner .img_box {
  position: relative;
  width:100%;
  height:100%;
  border-left:2px solid #b07616;
  border-right:2px solid #b07616;
}
.inner .img_box:before,
.inner .img_box:after {
  content:"";
  display:block;
  height:2px;
  width:100%;
  background: #b07616;
  background: -moz-linear-gradient(left, #b07616 0%, #fdf0aa 50%, #b07616 100%);
  background: -webkit-gradient(linear, left center, right center, from(#b07616), color-stop(50%, #fdf0aa), to(#b07616));
  background: -webkit-linear-gradient(left, #b07616 0%, #fdf0aa 50%, #b07616 100%);
  background: -o-linear-gradient(left, #b07616 0%, #fdf0aa 50%, #b07616 100%);
  background: -ms-linear-gradient(left, #b07616 0%, #fdf0aa 50%, #b07616 100%);
  background: linear-gradient(to right, #b07616 0%, #fdf0aa 50%, #b07616 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#b07616, endColorstr=#b07616,GradientType=1 ); 
}

/* 対象開催　start */
.inner div.event{
  height: auto;
  background: url(../images/lpcampaign_bg_main_2.png);
  background-size: 100% 100%;
}

.inner div.event ul{
  line-height: 1.5em;
  margin: 0 5%;
}

.inner div.event ul li{
  text-align: center;
}

.inner div.event ul a{
  font-size: 26px;
  font-weight: bold;
  color: #0000FF;
  text-decoration: underline;
  margin-bottom: calc(10px + 3vw);
  display: inline-block;
}

.inner div.event ul a:hover{
  color: #0000b1;
  text-decoration: underline;
}
@media screen and (max-width: 480px) {
  .inner div.event ul a{
    font-size: 14px;
  }
}

.inner div.event .before{
  display: block;
  width: 100%;
}

.inner div.event .after{
  display: block;
  width: 100%;
}

.inner div.campaign{
  height: auto;
  background: url(../images/lpcampaign_bg_main_2.png);
  background-size: 100% 100%;
}

.inner div.campaign ul{
  line-height: 1.5em;
  margin: 0 5%;
}

.inner div.campaign ul li{
  text-align: center;
}

.inner div.campaign ul a{
  font-size: 26px;
  font-weight: bold;
  color: #0000FF;
  text-decoration: underline;
  margin-bottom: calc(10px + 3vw);
  display: inline-block;
}

.inner div.campaign ul a:hover{
  color: #0000b1;
  text-decoration: underline;
}
@media screen and (max-width: 480px) {
  .inner div.campaign ul a{
    font-size: 14px;
  }
}

.inner div.campaign .before{
  display: block;
  width: 100%;
}

.inner div.campaign .after{
  display: block;
  width: 100%;
}

.inner div.race{
  height: auto;
  background: url(../images/lpcampaign_bg_main_2.png);
  background-size: 100% 100%;
}

.inner div.race ul{
  line-height: 1.5em;
  margin: 0 5%;
}

.inner div.race ul li{
  text-align: center;
}

.inner div.race ul a{
  font-size: 26px;
  font-weight: bold;
  color: #0000FF;
  text-decoration: underline;
  margin-bottom: calc(10px + 3vw);
  display: inline-block;
}

.inner div.race ul a:hover{
  color: #0000b1;
  text-decoration: underline;
}
@media screen and (max-width: 480px) {
  .inner div.race ul a{
    font-size: 14px;
  }
}

.inner div.race .before{
  display: block;
  width: 100%;
}

.inner div.race .after{
  display: block;
  width: 100%;
}

.inner div.access{
  height: auto;
  background: url(../images/lpcampaign_bg_main_2.png);
  background-size: 100% 100%;
}

.inner div.access ul{
  line-height: 1.5em;
  margin: 0 5%;
}

.inner div.access ul li{
  text-align: center;
}

.inner div.access ul a{
  font-size: 26px;
  font-weight: bold;
  color: #0000FF;
  text-decoration: underline;
  margin-bottom: calc(10px + 3vw);
  display: inline-block;
}

.inner div.access ul a:hover{
  color: #0000b1;
  text-decoration: underline;
}
@media screen and (max-width: 480px) {
  .inner div.access ul a{
    font-size: 14px;
  }
}

.inner div.access .before{
  display: block;
  width: 100%;
}

.inner div.access .after{
  display: block;
  width: 100%;
}

/*  対象開催 END*/

.inner .mainArea{
  max-width: 1100px;
  margin: 0 auto;
}

.buttonWrapper {
  text-align: center;
}

.buttonWrapper img.banner{
  height: 100%;
  max-height: 140px;
  width: auto;
}

@media screen and (max-width: 480px) {
  .buttonWrapper img.banner{
    height: 60px;
    width: auto;
  }
}


.inner h3 {
  position: relative;
  text-align: center;
  padding-bottom: 15px;
  margin: 0 auto 70px;
}
.inner h3:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  width: 100%;
  background: #010a65;
  background: -moz-linear-gradient(left, #010a65 0%, #ebce7b 15%, #b67d1e 50%, #ebce7b 85%, #010a65 100%);
  background: -webkit-gradient(linear, left center, right center, from(#010a65), color-stop(15%, #ebce7b), color-stop(50%, #b67d1e), color-stop(85%, #ebce7b), to(#010a65));
  background: -webkit-linear-gradient(left, #010a65 0%, #ebce7b 15%, #b67d1e 50%, #ebce7b 85%, #010a65 100%);
  background: -o-linear-gradient(left, #010a65 0%, #ebce7b 15%, #b67d1e 50%, #ebce7b 85%, #010a65 100%);
  background: -ms-linear-gradient(left, #010a65 0%, #ebce7b 15%, #b67d1e 50%, #ebce7b 85%, #010a65 100%);
  background: linear-gradient(to right, #010a65 0%, #ebce7b 15%, #b67d1e 50%, #ebce7b 85%, #010a65 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=#010a65, endColorstr=#010a65,GradientType=1 ); 
}

body.lpcampaign footer{
  background: #000;
  padding: 20px 20px 40px;
}

body.lpcampaign footer p{
  line-height: 1em;
  font-size: 12px;
}


/*--------------------------------------------------------------
  Smartphone
--------------------------------------------------------------*/
@media screen and (max-width: 480px) {

}


/*--------------------------------------------------------------
  Smartphone S
--------------------------------------------------------------*/
@media screen and (max-width: 320px) {
  .inner .winner_new {
    max-width: 200px;
  }
}