@charset "utf-8";

/* ------------------------------
   TopPage Contents Style
   Responsive Style
   Animation
------------------------------ */

/*==================================================================
   TopPage Contents Style
==================================================================*/

html{font-size:calc(1000vw / 1000);}
#container{max-width:100%;padding:0;overflow:hidden;}
#container main{padding:0;font-size:3.5rem;}
#container section{position:relative;text-align: center;}
#container section > .inner{max-width:900px;margin:0 auto;}

/*========== title ==========*/
.secttl_01{color:#dac67c;font-family: serif;font-size:5rem;font-weight:bold;padding:4rem 2rem;}
.secttl_01.frm{margin-bottom:4rem;background:url(/LP/13/top_secttl01_frame.png) center center / contain no-repeat;}
.secttl_01 + p.lead{font-family:serif;font-weight:bold;text-align:center;margin-bottom:6rem;}
.secttl_02{color:#FFF;font-family: serif;font-size:5rem;font-weight:bold;padding:4rem 2rem;margin-bottom:4rem;}

/*========== text ==========*/
.ff_serif{font-family: serif;}


/*========== blc_common ==========*/
section[class^="blc_"]{padding:10rem 4rem 15rem;}


/*========== blc_mainvisual ==========*/
.blc_mv{position:relative;min-height:120rem;text-align: center;overflow: hidden;background:url(/LP/13/top_mv_bg_sp.jpg) center top / cover no-repeat;}
.blc_mv::after{position:absolute;content:"";left:0;top:0;width:100%;height:100%;background:#000;z-index:1;}
.blc_mv.active::after{
 -webkit-animation:fadeOut 2s ease forwards;
 animation: fadeOut 2s ease forwards;}
.blc_mv h1{position:absolute;bottom:0;left:0;right:0;margin:0 auto;z-index:10;}
.blc_mv p.catch{position:absolute;top:3rem;left:50%;margin-left:14rem;width:12rem;z-index:10;}
.blc_mv figure{position:absolute;top:20rem;left:50%;margin-left:-43rem;width:88rem;z-index:10;}


/*========== blc_race ==========*/
.blc_race{padding:5rem 4rem 0 !important;background:#000;}
.blc_race > h2{max-width:80%;margin:0 auto 1em;}
.blc_race > p.racename{font-size:6rem;font-family:serif;font-weight:bold;}


/*========== blc_regist ==========*/
.blc_regist{background:url(/LP/13/top_regist_bg_sp.jpg) center 0 / cover no-repeat;}
.blc_regist h2{text-align:center;margin-bottom:3rem;}
.blc_regist p.present{font-size:6rem;font-weight:bold;margin-bottom:6rem;}
.blc_regist p.btn_regist{margin: 6rem auto;}
.blc_regist .area_sns{max-width:600px;width:80%;margin:5rem auto;}
.blc_regist .area_sns .ttl{font-size:3rem;font-weight:bold;text-align:center;}
.blc_regist ul.list_notes{font-size:0.7em;}
.blc_regist ul.list_security{display: inline-block;margin-bottom: 5rem;font-size: 3rem;text-align: left;}
.blc_regist ul.list_security > li{background: url(/LP/13/icon_keyhole.png) no-repeat 0 center / 3.2rem auto;padding-left: 4rem;}

/*========== blc_notice ==========*/
.blc_notice{background:url(/LP/13/top_notice_bg_sp.jpg) center center / cover no-repeat;}
.blc_notice .inner > p{text-align:center;line-height:2;}
.blc_notice .inner > p.system{font-size:1.8em;font-weight:bold;margin:0.5em 0;}
.blc_notice ul{display: flex;align-items: center;justify-content: center;margin:6rem 0;}
.blc_notice ul > li:not(:first-child){margin-left:-2rem;}


/*========== blc_win ==========*/
.blc_win{background:url(/LP/13/top_win_bg_sp.jpg) center center / cover no-repeat;}
.blc_win .inner > p{text-align:justify;line-height:2;margin-bottom:1.5em;}
.blc_win .inner > p > .f_LL{line-height: 1.4;}


/*========== blc_hitresult ==========*/
.blc_hitresult{background:#000;}
.blc_hitresult .hit_wrap{max-width:1920px;margin:0 auto;padding:4rem 0;}
.blc_hitresult ul li{text-align: left;}
.blc_hitresult ul li .box_hit{position:relative;width:66rem;min-height:36rem;margin:0 auto;
 background:url(/LP/13/top_hitresult_hit_box_bg.jpg) center top / 100% no-repeat;}
.blc_hitresult ul li .box_hit p{font-size:2.5rem;font-weight: bold;line-height:1.2;}
.blc_hitresult ul li .box_hit .date{padding:1rem;background:rgba(0, 0, 0, 0.7);}
.blc_hitresult ul li .box_hit .inner{margin:2rem 1.5rem 1.5rem;padding:2rem;background:rgba(0, 0, 0, 0.5);border:0.5rem solid rgba(255, 255, 255, 0.5);border-radius:2rem;}
.blc_hitresult ul li .box_hit .inner .name{color:#dac67c;font-size:3.6rem;margin-bottom:0.5em;text-shadow:0.2rem 0.2rem 0 #312417;}
.blc_hitresult ul li .box_hit .inner .race{margin-bottom:1.5rem;;}
.blc_hitresult ul li .box_hit .inner .dividend{display:flex;justify-content: space-between;align-items: baseline;font-size:3.8rem;font-weight:bold;margin-top:0.8em;}
.blc_hitresult ul li .box_hit .inner .dividend > span:last-child{font-size:1.2em;}


/*========== blc_point ==========*/
.blc_point{background:#070c0f url(/LP/13/top_point_bg_sp.jpg) center top / contain no-repeat;}
.blc_point ul.list_point > li{margin-top:10rem;}
.blc_point ul.list_point > li > figure{margin-bottom:5rem;}
.blc_point ul.list_point > li > h3{color:#dac67c;font-size:1.2em;font-family:serif;font-weight:bold;text-align:left;margin-bottom:2rem;}
.blc_point ul.list_point > li > p{text-align:justify;}


/*========== blc_voice ==========*/
.blc_voice{background:url(/LP/13/top_voice_bg_sp.jpg) center center / cover no-repeat;}
.blc_voice ul.list_voice > li{position:relative;margin-bottom:10rem;}
.blc_voice ul.list_voice > li:last-child{margin-bottom:0;}
.blc_voice ul.list_voice > li:nth-child(odd) {padding-left:20rem;}
.blc_voice ul.list_voice > li:nth-child(even){padding-right:20rem;}
.blc_voice ul.list_voice > li > h3{color:#dac67c;font-size:1.1em;font-weight:bold;text-align:left;margin-bottom:2rem;}
.blc_voice ul.list_voice > li > p{text-align:justify;}
.blc_voice ul.list_voice > li > figure.icon{position:absolute;width:15rem;top:1rem;}
.blc_voice ul.list_voice > li:nth-child(odd) > figure.icon{left:0;}
.blc_voice ul.list_voice > li:nth-child(even) > figure.icon{right:0;}


/*========== blc_voice ==========*/
.blc_step{background:#000;}
.blc_step > h2 > span{display:block;color:#FFF;font-size:0.6em;}


/*========== blc_road ==========*/
.blc_road{background:#000 url(/LP/13/top_road_bg_sp.jpg) center top / 100% no-repeat;}
.blc_road .inner > p.ff_serif{text-align:center;margin-bottom:1.5em;}
.blc_road .inner > p{text-align: justify;}


/*==================================================================
   Responsive Style 1000px以上 ** PC Only **
==================================================================*/
@media screen and (min-width: 1000px) {
html{font-size: 62.5%;}
#container main{font-size:2rem;}

.secttl_01,
.secttl_02{font-size:3.5rem;}
.secttl_01 + p.lead{font-size:1.4em;}

.blc_mv{background-image:url(/LP/13/top_mv_bg_pc.jpg);}
.blc_regist{background-image:url(/LP/13/top_regist_bg_pc.jpg);}
.blc_notice{background-image:url(/LP/13/top_notice_bg_pc.jpg);}
.blc_win{background-image:url(/LP/13/top_win_bg_pc.jpg);}
.blc_point{background-image:url(/LP/13/top_point_bg_pc.jpg);}
.blc_voice{background-image:url(/LP/13/top_voice_bg_pc.jpg);}
.blc_road{background-image:url(/LP/13/top_road_bg_pc.jpg);}

/**/}/**/


/*==================================================================
   Animation
==================================================================*/
/*-- zoomRepeat --*/
.animated_zoomRepeat {
-webkit-animation: zoomRepeat 1.5s ease-in-out infinite;
animation: zoomRepeat 1.5s ease-in-out infinite;
}
@-webkit-keyframes zoomRepeat {
0% {-webkit-transform: scale(0.9);}
30% {-webkit-transform: scale(1, 1);}
60% {-webkit-transform: scale(0.9);}
100% {-webkit-transform: scale(0.9);}
}
@keyframes zoomRepeat {
0% {transform: scale(0.9);}
30% {transform: scale(1, 1);}
60% {transform: scale(0.9);}
100% {transform: scale(0.9);}
}
.js_inview{opacity: 0;}
/*-- fadeIn inview --*/
.animated_fadeIn.active{opacity: 1;
   -webkit-animation:fadeIn 1.5s ease 1;
   animation: fadeIn 1.5s ease 1;
}
@-webkit-keyframes fadeIn {
   from {opacity: 0;}
   to {opacity: 1;}
}
@keyframes fadeIn {
   from {opacity: 0;}
   to { opacity: 1;}
}
/*-- fadeInUp inview --*/
.animated_fadeInUp.active{opacity: 1;
   -webkit-animation:fadeInUp 1s ease 1;
   animation: fadeInUp 1s ease 1;
}
@-webkit-keyframes fadeInUp {
   from {
      opacity: 0;
      -webkit-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
   }
   
   to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
   }
}
@keyframes fadeInUp {
   from {
      opacity: 0;
      -webkit-transform: translate3d(0, 100%, 0);
      transform: translate3d(0, 100%, 0);
   }
   
   to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
   }
}
/*-- fadeInDown inview --*/
.animated_fadeInDown.active{opacity: 1;
   -webkit-animation:fadeInDown 0.7s ease 1;
   -moz-animation:fadeInDown 0.7s ease 1;
   animation: fadeInDown 0.7s ease 1;
}
@-webkit-keyframes fadeInDown {
   from {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
   }

   to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
   }
}
@keyframes fadeInDown {
   from {
      opacity: 0;
      -webkit-transform: translate3d(0, -100%, 0);
      transform: translate3d(0, -100%, 0);
   }

   to {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
   }
}
/*-- fadeOut inview --*/
.animated_fadeOut.active{opacity: 1;
  -webkit-animation:fadeOut 0.7s ease forwards;
  -moz-animation:fadeOut 0.7s ease forwards;
  animation: fadeOut 0.7s ease forwards;
}
@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}
/*-- slideInLeft inview --*/
.animated_slideInLeft.active{opacity: 1;
   -webkit-animation:slideInLeft 0.7s ease 1;
   -moz-animation:slideInLeft 0.7s ease 1;
   animation: slideInLeft 0.7s ease 1;
}
@-webkit-keyframes slideInLeft {
   from {
     -webkit-transform: translate3d(-100%, 0, 0);
     transform: translate3d(-100%, 0, 0);
     visibility: visible;
   }
 
   to {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }
 @keyframes slideInLeft {
   from {
     -webkit-transform: translate3d(-100%, 0, 0);
     transform: translate3d(-100%, 0, 0);
     visibility: visible;
   }
 
   to {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }
/*-- slideInRight inview --*/
.animated_slideInRight.active{opacity: 1;
   -webkit-animation:slideInRight 0.5s ease 1;
   -moz-animation:slideInRight 0.5s ease 1;
   animation: slideInRight 0.5s ease 1;
}
 @-webkit-keyframes slideInRight {
   from {
     -webkit-transform: translate3d(100%, 0, 0);
     transform: translate3d(100%, 0, 0);
     visibility: visible;
   }
 
   to {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }
 @keyframes slideInRight {
   from {
     -webkit-transform: translate3d(100%, 0, 0);
     transform: translate3d(100%, 0, 0);
     visibility: visible;
   }
 
   to {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }
/*-- zoomIn inview --*/
.animated_zoomIn.active{opacity: 1;
   -webkit-animation:zoomIn 1s ease 1;
   -moz-animation:zoomIn 1s ease 1;
   animation: zoomIn 1s ease 1;
}
 @-webkit-keyframes zoomIn {
   from {
     opacity: 0;
     -webkit-transform: scale3d(0.3, 0.3, 0.3);
     transform: scale3d(0.3, 0.3, 0.3);
   }
 
   50% {
     opacity: 1;
   }
 }
 @keyframes zoomIn {
   from {
     opacity: 0;
     -webkit-transform: scale3d(0.3, 0.3, 0.3);
     transform: scale3d(0.3, 0.3, 0.3);
   }
 
   50% {
     opacity: 1;
   }
 }
/*-- zoomInLeft inview --*/
.animated_zoomInLeft.active{opacity: 1;
   -webkit-animation:zoomInLeft 1.5s ease 1;
   -moz-animation:zoomInLeft 1.5s ease 1;
   animation: zoomInLeft 1.5s ease 1;
}
 @-webkit-keyframes zoomInLeft {
   from {
     opacity: 0;
     -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
     transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
     -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
     animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
   }
 
   60% {
     opacity: 1;
     -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
     transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
     -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
     animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
   }
 }
 @keyframes zoomInLeft {
   from {
     opacity: 0;
     -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
     transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
     -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
     animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
   }
 
   60% {
     opacity: 1;
     -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
     transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
     -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
     animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
   }
 }
/*-- zoomInRight inview --*/
.animated_zoomInRight.active{opacity: 1;
   -webkit-animation:zoomInRight 1.5s ease 1;
   -moz-animation:zoomInRight 1.5s ease 1;
   animation: zoomInRight 1.5s ease 1;
}
 @-webkit-keyframes zoomInRight {
   from {
     opacity: 0;
     -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
     transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
     -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
     animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
   }
 
   60% {
     opacity: 1;
     -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
     transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
     -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
     animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
   }
 }
 @keyframes zoomInRight {
   from {
     opacity: 0;
     -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
     transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
     -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
     animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
   }
 
   60% {
     opacity: 1;
     -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
     transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
     -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
     animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
   }
 }