@charset "utf-8";

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

/*==================================================================
   TopPage Contents Style
==================================================================*/
body{color:#FFF;background:#000;}
html{font-size:calc(1000vw / 1000);}

/*========== main ==========*/
#contents{font-size:4rem;overflow:hidden;
 background:#000 url(/LP/115/top_mv_bg.png) center top / contain no-repeat;}
#contents::before{content:"";position:absolute;top:5rem;left:calc(50% - 46rem);display:block;width:91rem;height:91rem;z-index:0;
 background:url(/LP/115/top_mv_gear.png) center center / contain no-repeat;
 animation: rotate 8s linear infinite;}
#contents::after{content:"";position:absolute;top:0;left:calc(50% - 50rem);display:block;width:100rem;height:120rem;z-index:1;
 background:url(/LP/115/top_mv_horse.png) center center / contain no-repeat;}
#contents > .inner{position:relative;padding:9rem 5rem;z-index:2;}

/*========== title ==========*/
h1.sitecatch{text-align:center;max-width:72rem;margin:0 auto;}

/*========== blc_race ==========*/
.blc_race{display:flex;min-height:75rem;flex-direction: column;align-items: center;justify-content: center;}
.blc_race > p.racename{font-size:6.5rem;font-family: serif;font-weight:bold;text-align: center;line-height:1.2;text-shadow:0 0 0.5rem #000, 0 0 1rem #000;}

/*========== blc_regist ==========*/
.blc_regist p.btn_regist{position:relative;width:80%;max-width:600px;margin: 3rem auto;text-align:center;}
.blc_regist p.btn_regist:after{position: absolute;content: "";top: -2px;left: -2px;width:calc(100% + 4px);height:calc(100% + 4px);
 background: #fff;border-radius: 2rem;box-shadow: 0 0 3rem #fff;
 -webkit-animation: blink 1s ease-out infinite alternate;
 animation: blink 1s ease-out infinite alternate;
 z-index: -1;}
.blc_regist p.btn_regist > a{display: block;}
.blc_regist ul.list_notes{font-size:0.7em;}

/*- area_line -*/
.blc_regist .area_line{text-align:center;}
.blc_regist .area_line > p{font-size:4rem;}
.blc_regist .area_line > p.closingdate{color:#ffea00;}

/*- area_form -*/
.blc_regist .area_form{text-align: center;}
.blc_regist .area_form p.open_mailform{width:80%;max-width:600px;font-size:3rem;font-weight:bold;text-align:center;margin:0 auto 3em;cursor: pointer;}
.blc_regist .area_form p.open_mailform > img.icon{max-height:1.4em;margin-right:0.2em;vertical-align: middle;}
.blc_regist .area_form p.open_mailform > span{border-bottom:0.2rem solid #FFF;}
.blc_regist .area_form p.open_mailform:hover > span{border-bottom-style:dashed;}
.blc_regist .area_form form input[name="email"]{padding:0.8em 0.5em;border: 0.2rem solid #b6afa2;border-radius:1rem;}
.blc_regist .area_form form{display: none;}
.blc_regist .area_form form input[name="email"]::placeholder{font-size:1em;}
.blc_regist .area_form form input[type="image"]{width:auto !important;}


/*==================================================================
   Responsive Style 768px以下 ** SP Only **
==================================================================*/
@media screen and (max-width: 768px) {
/*--- header ---*/
#header > .inner p.logo{width:120px !important;}

/**/}/**/
/*==================================================================
   Responsive Style 769px以上 ** PC **
==================================================================*/
@media screen and (min-width: 769px) {
/*--- header ---*/
#header > .inner {padding: 20px 25px !important;}
#header > .inner p.logo{width:300px !important;}
/*--- blc_regist ---*/
.blc_regist .area_form form input[name="email"]{font-size:3rem;max-width:90%;}

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

/**/}/**/
/*==================================================================
   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);}
}
/*-- rotateRepeat --*/
.animated_rotateRepeat{opacity: 1;
   -webkit-animation:rotate 5s linear infinite;
   animation: rotate 5s linear infinite;
 }
 @-webkit-keyframes rotate {
   from {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
 
   }
   to {
     -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
 
   }
 }
 @keyframes rotate {
   from {
     -webkit-transform: rotate(0deg);
     transform: rotate(0deg);
 
   }
   to {
     -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
 
   }
 }
/*-- blinkRepeat --*/
.animated_blinkRepeat {
  -webkit-animation:blink 0.5s ease-in-out infinite alternate;
  animation:blink 0.5s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
  0% {opacity:0;}
  100% {opacity:1;}
}
@keyframes blink{
  0% {opacity:0;}
  100% {opacity:1;}
}