@charset "utf-8";

/* ------------------------------
   Universal Reset
   Contents
   Animation
------------------------------ */

/*==================================================================
   Universal Reset
==================================================================*/
html,body{margin:0;padding:0;width:100%;height:100%;font-size:100%;}
main{display:block;}
h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,div,object,ul,ol,li,dl,dt,dd,tr,td,fieldset,form,legend,small,figure{margin:0;padding:0;font-size:100%;font-weight:normal;}
ul,ol{list-style:none;}
fieldset{margin:0;padding:0;border:0 none;}
legend{display:none;}
table,th,td{border:0;border-spacing:0;}
caption,th{text-align:left;}
em,strong,cite,abbr,caption,th,address{font-style:normal;font-weight:normal;}
img{max-width:100%;border:0 none;vertical-align:bottom;_vertical-align:text-bottom;}
input:not([type="radio"]):not([type="checkbox"]),select,textarea{margin:0;padding:0;border:none;border-radius:0;vertical-align:middle;
-moz-appearance:none;-webkit-appearance:none;appearance:none;}
select::-ms-expand{display:none;}
input[type="submit"]:hover{cursor:pointer;}
input[type="image"]{max-width:100%;outline: none;}
option{padding-right:5px;}
button{background:none;padding:0;border:0;text-align:left;}
article,aside,dialog,details,figure,figcaption,footer,header,hgroup,menu,nav,section{display:block;}
mark{font-weight:normal;font-style:normal;}
blockquote,q{quotes:none;}
a{vertical-align:baseline;text-decoration:none;}
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;}


/*==================================================================
   Contents
==================================================================*/
html{font-size: calc(1000vw / 750);}
body{color:#001e05;background:#fff;font-size:2.5rem;font-family:'Noto Sans JP',"Helvetica Neue","Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;line-height:1.6;-webkit-text-size-adjust:100%;-webkit-touch-callout:none;
animation: fadeIn 2s ease 0s 1 normal;}
#container{max-width:750px;text-align:left;margin:0 auto;background:#fff;}
main{z-index: 0;}
section{position:relative;overflow: hidden;}

/*========== contents ==========*/
/*--- title ---*/
.ttl_01{text-align: center;position: relative;font-size: 7rem;font-weight: bold;line-height: 1.4;padding: 7rem 3rem 0;margin-bottom: 2rem;color: #00251b;}
.ttl_01 span{display: block;font-size: 3.5rem;}
.ttl_01::before{background-color: #00251b;bottom: -1.5rem;content: "";height: 0.5rem;left: calc(50% - 20rem);position: absolute;width: 40rem;}
.ttl_02{position:relative;opacity: 1 !important;background: #fff;}
.ttl_02::after {position: absolute;content: "";left: 0;top: 0;width: 100%;height: 100%;background: #fff;}
.ttl_02.active::after{animation: slideOutRight 1s ease forwards;}
@-webkit-keyframes slideOutRight{
  0%{
    -webkit-transform:translateZ(0);
    transform:translateZ(0)
  }
  to{
    visibility:hidden;
    -webkit-transform:translate3d(100%,0,0);
    transform:translate3d(100%,0,0)
  }
}
@keyframes slideOutRight {
  0%{
    -webkit-transform:translateZ(0);
    transform:translateZ(0)
  }
  to{
    visibility:hidden;
    -webkit-transform:translate3d(100%,0,0);
    transform:translate3d(100%,0,0)
  }
}


/*--- marker ---*/
.tx_mark_orange{padding: 0 1rem;background-image: linear-gradient(90deg, #ff7200, #ff7200);background-repeat: no-repeat;background-position: bottom left;background-size: 100% 35%;transition: all 1s ease-in-out;}

/*--- area_text ---*/
.area_txt01 > p,
.area_txt01 > figure{margin-bottom: 4rem;}
.area_txt01 > p:last-child,
.area_txt01 > figure:last-child{margin-bottom: 0;}

/*--- bg ---*/
.bg_green{background: #effcf7;}

/*--- footer ---*/
footer {color: #FFF;font-size: 2.5rem;text-align: left;padding: 4rem 0;background: #003a06;}
footer nav{width:100%;}
footer nav ul > li > a{position:relative;display:block;color:#FFF;padding:2rem 2rem 2rem 8rem;}
footer nav ul > li > a:before{position: absolute;content: "";top: 3rem;left: 5rem;width: 0;height: 0;
 border-style: solid;
 border-top: 1rem solid transparent;
 border-bottom: 1rem solid transparent;
 border-left: 1.5rem solid #fff;
 border-right: 0;}
footer .copyright{margin-top: 6rem;text-align: center;font-size: 2rem;}


/*========== section block ==========*/
*[class^="blc_"] > .inner{padding:7rem 3rem;}

/*--- blc_mv ---*/
.blc_mv{position: relative;overflow: hidden;min-height: 72rem;background: url(./default_mv_bg.png) center top / cover no-repeat;background-size: 75rem;}
.blc_mv h1{position: absolute;top: 0;left: 2rem;width: 67.4rem;}
.blc_mv p.catch{position: absolute;top: 50rem;left: calc(50% - 34.45rem);width: 68.9rem;}

/*--- blc_regist ---*/
.blc_regist{padding: 0 6rem 7rem;color: #00251b;text-align: center;background: linear-gradient(to bottom, #e6f9f1 72rem, #e0f4eb);}
.blc_regist > h2{font-size: 3rem;font-weight: bold;}
.blc_regist > .btn_regist > a{display: block;width: 90%;max-width: 611px;margin: 2rem auto;}
.blc_regist > p.note{font-size: 2.2rem;font-weight: bold;color: #121212;}

/*--- blc_ai ---*/
.blc_ai .video_ai{margin: 9rem auto 4rem;}

/*--- blc_review ---*/
.blc_review ul.list_review > li{padding: 5rem 2rem;margin-bottom: 8rem;background: #FFF;}
.blc_review ul.list_review > li:last-child{margin-bottom: 6rem;}
.blc_review ul.list_review > li > .area_review{display: flex;justify-content: space-between;align-items: center;margin-bottom: 3rem;}
.blc_review ul.list_review > li > .area_review img{max-width: 14.1rem;}
.blc_review ul.list_review > li > .area_review .catch_review_box{width: calc(calc(100% - 14.1rem - 2rem));line-height: 1.2;}
.blc_review ul.list_review > li > .area_review .catch_review_box > p{font-weight: bold;}
.blc_review ul.list_review > li > .area_review .catch_review_box > .catch_review01{font-size: 3.5rem;}
.blc_review ul.list_review > li > .area_review .catch_review_box > .catch_review01 span{color: #51b80c;}
.blc_review ul.list_review > li > .area_review .catch_review_box > .catch_review02{font-size: 4.5rem;}
.blc_review ul.list_review > li > .area_review .catch_review_box > .catch_review02 span{font-size: 7rem;color: #ff7200;}
.blc_review ul.list_review > li > .area_review .catch_review_box > .catch_review03{border-radius: 2rem;background: #51b80c;display: inline-block;padding: 0.5rem 2rem;margin-top: 1rem; color: #fff;}

/*--- blc_result ---*/
.blc_result{background: #003a06;padding-bottom: 7rem;}
.blc_result h2.ttl_01{color: #fff;}
.blc_result h2.ttl_01::before{background-color: #fff;}
.blc_result ul.list_result{padding: 8rem 0;}
.blc_result ul.list_result > li > dl{background: url(./default_result_bg.png) center top / 100% no-repeat;height: 34rem;width: 42.5rem;margin: auto;}
.blc_result ul.list_result > li > dl > dt.plan_race{background: #00251b;color: #fff;font-size: 3.5rem;padding: 0.5rem 2rem;}
.blc_result ul.list_result > li > dl > dd {padding: 0 2rem;color: #fff;}
.blc_result ul.list_result > li > dl > dd.date_race{border-radius: 3rem;background: #51b80c;display: inline-block;padding: 0 3rem;margin: 3rem 2rem 1rem;}
.blc_result ul.list_result > li > dl > dd.place_race{font-size: 3.5rem;line-height: 1.2;margin: auto 0 1rem;}
.blc_result ul.list_result > li > dl > dd.dividend_race {display: flex;align-items: center;justify-content: space-between;font-size: 5rem;line-height: 0.8;margin-top: auto;}
.blc_result ul.list_result > li > dl > dd.dividend_race::before {content: "";width: 5.4rem;height: 5.5rem;background: url(./default_result_icon.png) no-repeat;background-size: contain;}
.blc_result ul.list_result > li > dl > dd.dividend_race p{width: calc(100% - 5.4rem - 1rem);font-weight: bold;color: #fffc00;}
.blc_result ul.list_result > li > dl > dd.dividend_race p span{font-size: 3.5rem;}
/*-swiper-*/
.swiper-pagination-bullet{width:1.6rem !important;height:1.6rem !important;margin:0 1rem !important;background:#fff !important;opacity: 1 !important;}
.swiper-pagination-bullet-active{background:#fffc00 !important;}

/*--- blc_step ---*/
.blc_step ol.list_step{margin: 9rem auto 6rem;}
.blc_step ol.list_step > li{margin-bottom: 3rem;}
.blc_step ol.list_step > li > p{padding: 2rem 5rem;}
.blc_step ol.list_step > li > .area_step{position: relative;display: flex;justify-content: space-between;margin-right: 5rem;}
.blc_step ol.list_step > li > .area_step::before {content: "";position: absolute;border-top: solid 0.5rem #ff7200;width: 100%;}
.blc_step ol.list_step > li > .area_step > img{max-width: 15.4rem;height: 100%;}
.blc_step ol.list_step > li > .area_step > p{width: calc(calc(100% - 15.4rem - 2rem));line-height: 1.2;font-weight: bold;margin-top: 1.5rem;}
.blc_step ol.list_step > li > .area_step > p span{display: block;font-size: 3.5rem;color: #ff7200;}

/*--- blc_reason ---*/
.blc_reason ul.list_reason > li{background: #FFF;margin-bottom: 8rem;}
.blc_reason ul.list_reason > li:last-child{margin-bottom: 6rem;}
.blc_reason ul.list_reason > li > dl{padding: 0 2rem 6rem;}
.blc_reason ul.list_reason > li > dl > dt{color: #ff7200;font-size: 3.5rem;font-weight: bold;text-align: center;margin: 2.5rem auto;}
.blc_reason .area_reason{background: #fff;padding: 6rem 3rem;}
.blc_reason .area_reason > .area_img > p{display: flex;align-items: center;justify-content: space-between;margin-bottom: 4rem;font-size: 6rem;font-weight: bold;}
.blc_reason .area_reason > .area_img > p img{max-width: 30.1rem;}
.blc_reason .area_reason .catch_reason01{text-align: center;}
.blc_reason .area_reason .catch_reason01 > p{text-align: center;border: solid 0.5rem #ff7200;color: #ff7200;display: inline-block;padding: 1rem 2rem;font-size: 3.5rem;font-weight: bold;}
.blc_reason .area_reason p.catch_reason02{text-align: center;font-size: 3.5rem;font-weight: bold;color: #000;}
.blc_reason .video_reason{position: relative;}
.blc_reason .video_reason > p{position: absolute;width: 58.5rem;left: calc(50% - 29.25rem);bottom: 12rem;}
.blc_reason .area_regist{padding: 0 3rem;}
.blc_reason .area_regist > .btn_regist > a{display: block;width: 90%;max-width: 611px;margin: 7rem auto 2rem;}
.blc_reason .area_regist > p.note{font-size: 2.2rem;font-weight: bold;text-align: center;color: #121212;}


/*========== Responsive ==========*/
@media screen and (min-width:750px) { /* 750px以上 */
html{font-size: 62.5%;}
main {box-shadow: 0 0 0.5rem #dbdbdb;}
/**/} /* Responsive End */

/*========== common ==========*/
em{color:#ff0000;}
strong{color:#ff0000;font-weight:bold;}

.mt_0{margin-top:0 !important;}
.mt_S{margin-top:0.5em !important;}
.mt_M{margin-top:1em !important;}
.mt_L{margin-top:1.5em !important;}
.mt_LL{margin-top:2em !important;}
.mb_0{margin-bottom:0 !important;}
.mb_S{margin-bottom:0.5em !important;}
.mb_M{margin-bottom:1em !important;}
.mb_L{margin-bottom:1.5em !important;}
.mb_LL{margin-bottom:2em !important;}

.pt_0{padding-top:0 !important;}
.pt_S{padding-top:0.5em !important;}
.pt_M{padding-top:1em !important;}
.pt_L{padding-top:1.5em !important;}
.pt_LL{padding-top:2em !important;}
.pb_0{padding-bottom:0 !important;}
.pb_S{padding-bottom:0.5em !important;}
.pb_M{padding-bottom:1em !important;}
.pb_L{padding-bottom:1.5em !important;}
.pb_LL{padding-bottom:2em !important;}

.f_SS{font-size:0.6em !important;}
.f_S{font-size:0.8em !important;}
.f_L{font-size:1.2em !important;}
.f_bold{font-weight: bold !important;}
.f_red{color: #ff0000 !important;}
.f_yellow{color:#ffea00 !important;}
.f_orange{color: #ff7200;}



/*==================================================================
   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 1s ease 1;
 animation: fadeIn 1s ease 1;
}
@-webkit-keyframes fadeIn {
 from {opacity: 0;}
 to {opacity: 1;}
}
@keyframes fadeIn {
 from {opacity: 0;}
 to { opacity: 1;}
}
/*-- fadeInDown inview --*/
.animated_fadeInDown.active{opacity: 1;
 -webkit-animation:fadeInDown 1s ease 1;
 animation: fadeInDown 1s 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);
  }
}
/*-- zoomIn inview --*/
.animated_zoomIn.active{opacity: 1;
 -webkit-animation:zoomIn 0.8s ease 1;
 animation: zoomIn 0.8s ease 1;
}
@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}
@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}
/*-- bounceIn inview --*/
.animated_bounceIn.active{opacity: 1;
  -webkit-animation:bounceIn 1s ease 1;
  animation: bounceIn 1s ease 1;
}
@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

/*-- flipInY inview --*/
.animated_flipInY.active{opacity: 1;
  -webkit-animation:flipInY 1s ease 1;
  animation: flipInY 1s ease 1;
 }
@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}
