@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:#000;font-size:3.4rem;font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "ＭＳ Ｐゴシック", sans-serif;line-height:1.4;-webkit-text-size-adjust:100%;-webkit-touch-callout:none;background: #aadf53;}

/* ブラウザ最下部までコンテンツエリア保持 */
#container{display: flex;flex-direction: column;min-height: 100%;}
main{flex-grow: 1;}

#container{background: #3b8e74;}
main{background:#6cbe94;margin: 0 auto;width: 100%;max-width: 750px;overflow:hidden;}
main .wrap{padding: 0 4rem;}


/*========== #blc_mv ==========*/
#blc_mv .head{background: #000;padding: 1.3rem 0;color: #fff;font-size: 3rem;font-weight: 700;text-align: center;}
#blc_mv .inner{position: relative;background: url(mv_bg_man.png) no-repeat 0 5.5rem / 39.9rem auto, url(mv_bg_horse.png) no-repeat 47rem 14.1rem / 24rem auto;
padding: 7rem 0 4.8rem;}
#blc_mv .inner::after{position: absolute;content: "";top: 18rem;left: 0;
background: url(mv_bg_flash.png) no-repeat 0 0 / 100%;width: 10.6rem;height: 10.6rem;
}
#blc_mv .inner.wow.animated::after{
-webkit-animation: glassesFlash .6s 1s ease-out forwards;
animation: glassesFlash .6s 1s ease-out forwards;
}

#blc_mv .inner .ttl{margin-top: 2.2rem;margin-right: 3.8rem;text-align: right;}
#blc_mv .inner .ttl img{width: 54.2rem;}
#blc_mv .inner .catch{margin-right: 5.9rem;text-align: right;}
#blc_mv .inner .catch img{width: 45.3rem;}
#blc_mv .inner ul.list_bubble{display:flex;flex-wrap:wrap;justify-content: flex-end;margin-top: 1.6rem;}
#blc_mv .inner ul.list_bubble > li:nth-child(1){margin-right: -1rem;}
#blc_mv .inner ul.list_bubble > li:nth-child(2){margin-right: 6.6rem;}
#blc_mv .inner ul.list_bubble img{width: 23.2rem;}
#blc_mv .inner .txt_lead{margin-top: 4rem;text-align: center;}
#blc_mv .inner .txt_lead img{width: 61.9rem;}

/*========== .blc_present ==========*/
.blc_present{position: relative;background: #00534c url(bg_glasses.png) no-repeat center 13rem / 67.1rem auto;
padding: 18rem 0;color: #fff;font-size: 6.2rem;min-height: 54rem;text-align: center;}
.blc_present::before{content:"";position:absolute;display:block;
top:0;left:0;width:0;height:0;
border-style:solid;
border-width: 0 0 12rem 75rem;
border-color: transparent transparent transparent #6cbe94;
}
.blc_present::after{content:"";position:absolute;display:block;
bottom:0;left:0;width:0;height:0;
border-style:solid;
border-width: 12rem 75rem 0 0;
border-color: transparent #6cbe94 transparent transparent;
}
.blc_present .ttl{text-align: left;}
.blc_present .ttl .txt{display: inline-block;position: relative;z-index: 1;
background: url(bg_ttl_zigzag01.png) no-repeat right 0 / auto 100%, -webkit-linear-gradient(left,#fff calc(100% - 3.4rem), transparent calc(100% - 3.4rem), transparent 100%);
background: url(bg_ttl_zigzag01.png) no-repeat right 0 / auto 100%, -moz-linear-gradient(left,#fff calc(100% - 3.4rem), transparent calc(100% - 3.4rem), transparent 100%);
margin-bottom: 4rem;padding: 1.5rem 6.5rem;
color: #00534c;font-size: 3.6rem;font-weight: 700;}
.area_anime{overflow: hidden;}

/*========== .btn_line ==========*/
.btn_line{padding: 6rem 0;text-align: center;}
.btn_line a{display:inline-block;background:#ff0;
padding: 2rem 0;width: 54rem;color:#008444 !important;font-size: 4.8rem;font-weight: 900;
border: solid .8rem #ff0;border-radius: 65rem;box-shadow: inset 0 0 0 .4rem #008444;}
.btn_line a:hover{border-color:#008444;}


/*========== .blc_mainrace ==========*/
.blc_mainrace .inner{padding: 4rem 6.5rem 6rem;}
.blc_mainrace .box_race{background: #fff;margin: 0 -2.5rem 9.6rem;padding: 4.4rem 0;color: #00534c;font-size: 4.2rem;text-align: center;}
.blc_mainrace .box_race *{font-weight: 700;}
.blc_mainrace .box_race .ttl{background: #00534c;margin-bottom: 3.5rem;padding: 1.5rem 0;
color: #fff;}
.blc_mainrace .box_race .race{margin-bottom: 1rem;}
.blc_mainrace .txt_lead{margin-bottom: 4rem;text-align: center;}
.blc_mainrace .txt_lead img{width: 50.3rem;}


/*========== .blc_question ==========*/
.blc_question{position: relative;background: #fff;padding: 14rem 0;}
.blc_question::before{content:"";position:absolute;display:block;
top:0;left:0;width:0;height:0;
border-style:solid;
border-width: 0 0 10rem 75rem;
border-color: transparent transparent transparent #6cbe94;
}
.blc_question::after{content:"";position:absolute;display:block;
bottom:0;left:0;width:0;height:0;
border-style:solid;
border-width: 10rem 75rem 0 0;
border-color: transparent #00534c transparent transparent;
}
.blc_question .ttl{text-align: left;}
.blc_question .ttl .txt{display: inline-block;position: relative;z-index: 1;
background: url(bg_ttl_zigzag02.png) no-repeat right 0 / auto 100%, -webkit-linear-gradient(left,#00534c calc(100% - 3.4rem), transparent calc(100% - 3.4rem), transparent 100%);
background: url(bg_ttl_zigzag02.png) no-repeat right 0 / auto 100%, -moz-linear-gradient(left,#00534c calc(100% - 3.4rem), transparent calc(100% - 3.4rem), transparent 100%);
margin-bottom: 4rem;padding: 1.5rem 6.5rem;
color: #fff;font-size: 3.6rem;font-weight: 700;}
.blc_question .inner{padding: 0 6.5rem;}


/*========== .blc_result ==========*/
.blc_result{background: #00534c;color: #fff;}
.blc_result .inner{padding: 5rem 6.5rem;}
.blc_result .ttl{margin-bottom: .5em;letter-spacing: -.1rem;}
.blc_result .ttl_sub{margin-bottom: 2rem;padding: 1rem 0;font-size: 5.4rem;font-weight: 700;border: solid .3rem #fff;text-align: center;}
.blc_result .ttl_sub .suppl{position: relative;top: -0.8rem;margin-right: 2rem;font-size: 3.4rem;font-weight: normal;}
.blc_result ul.list_result{display: grid;grid-template-columns: repeat(2, 1fr);column-gap: 2rem;row-gap: 2rem;}
.blc_result ul.list_result > li{position: relative;background: #fff;padding: 1.5rem 0 12rem;color:#00534c;font-size: 3rem;text-align: center;}
.blc_result ul.list_result > li *{font-weight: 700;}
.blc_result ul.list_result > li dl dt{background: #00534c;margin: 0 auto .5rem;padding: .4rem 0;width: 19rem;color: #fff;}
.blc_result ul.list_result > li dl dd.dividend{position: absolute;bottom: 0;background: #ff0;padding: 1.5rem 0;width: 100%;}


/*========== .blc_review ==========*/
.blc_review{position: relative;background: #00816a;color: #fff;padding: 16rem 0;}
.blc_review::before{content:"";position:absolute;display:block;
top:0;left:0;width:0;height:0;
border-style:solid;
border-width: 0 0 10rem 75rem;
border-color: transparent transparent transparent #00534c;
}
.blc_review::after{content:"";position:absolute;display:block;
bottom:0;left:0;width:0;height:0;
border-style:solid;
border-width: 10rem 75rem 0 0;
border-color: transparent #6cbe94 transparent transparent;
}
.blc_review .inner{padding: 0 6.5rem;}
.blc_review .ttl{margin-bottom: 2rem;padding: 1rem 0;font-size: 5.4rem;font-weight: 700;border: solid .3rem #fff;text-align: center;}
.blc_review ul.list_review{display: grid;grid-template-columns: repeat(2, 1fr);column-gap: 2rem;row-gap: 2rem;}
.blc_review ul.list_review > li{background: #fff;padding: 2rem 1.5rem;color:#000;font-size: 2.4rem;}


/*========== .blc_important ==========*/
.blc_important .inner{padding: 6rem 6.5rem 5rem;}
.blc_important .ttl{margin-bottom: 1.5rem;}
.blc_important dl.list_point{margin: 0 -2.5rem 5rem;}
.blc_important dl.list_point > dt{width: 11rem;}
.blc_important dl.list_point > dd{background: #00816a;margin-top:-2rem;padding: 3rem 2.7rem;color: #fff;font-size: 3.6rem;font-weight: 700;}

/*========== footer ==========*/
footer{background: #000;margin: 0 auto;padding: 4rem 6.6rem;width: 100%;max-width: 750px;color: #fff;}
footer nav ul{margin-bottom: 4rem;}
footer nav ul > li:not(:first-child){border-top: solid .2rem #fff;}
footer nav ul > li > a{display: block;padding: .3em 0;color:#fff !important;font-size: 2.8rem;}
footer nav ul > li > a:hover{color: #ff0 !important;}
footer .copyright{font-size: 2rem;text-align: center;}


/*========== Responsive ==========*/
@media screen and (min-width:750px) { /* over 750px */
html{font-size: 62.5%;}
/**/} /* Responsive End */


/*========== common ==========*/
.txt_more{margin-top: 4.5rem;text-align: center;}
.txt_more img{width: 24.1rem;}

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;}

.txt_L{text-align: left !important;}
.txt_R{text-align: right !important;}
.txt_C{text-align: center !important;}

.f_normal{font-weight: normal !important;}
.f_bold{font-weight: bold !important;}
.f_S{font-size:0.5em !important;}
.f_M{font-size:1em !important;}
.f_L{font-size:1.5em !important;}
.f_LL{font-size:2em !important;}
.f_28{font-size: 2.8rem !important;}
.f_yellow{color: #ffff00 !important;}

.hide{display: none;}


/*==================================================================
   Animation
==================================================================*/
/*========== glassesFlash ==========*/
@-webkit-keyframes glassesFlash {
  from {
    -webkit-transform: rotateZ(-360deg) scale(1.3);
    transform: rotateZ(-360deg) scale(1.3);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes glassesFlash {
  from {
    -webkit-transform: rotateZ(-360deg) scale(1.3);
    transform: rotateZ(-360deg) scale(1.3);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}

/*========== zoomRepeat ==========*/
@-webkit-keyframes zoomRepeat {
  0% {-webkit-transform: scale(1);}
  30% {-webkit-transform: scale(1.1, 1.1);}
  60% {-webkit-transform: scale(1);}
  100% {-webkit-transform: scale(1);}
}
@keyframes zoomRepeat {
  0% {-webkit-transform: scale(1);}
  30% {-webkit-transform: scale(1.1, 1.1);}
  60% {-webkit-transform: scale(1);}
  100% {-webkit-transform: scale(1);}
}
.animated_zoomRepeat{
  -webkit-animation: zoomRepeat 1.5s ease-in-out infinite;
  animation: zoomRepeat 1.3s ease-in-out infinite;
}


/*========== .moveMarker ==========*/
@-webkit-keyframes moveMarker {
  from{
    background-size: 0 10%;background-position: bottom left;
}
  45%{
    background-size: 100% 10%;background-position: bottom left;
  }
  55%{
    background-size: 100% 10%;background-position: bottom right;
  }
  to {
    background-size: 0 10%;background-position: bottom right;
  }
}
@keyframes moveMarker {
  from{
    background-size: 0 10%;background-position: bottom left;
}
  45%{
    background-size: 100% 10%;background-position: bottom left;
  }
  55%{
    background-size: 100% 10%;background-position: bottom right;
  }
  to {
    background-size: 0 10%;background-position: bottom right;
  }
}
.moveMarker.js_inview{
position: relative;
background-image: linear-gradient(90deg, #ff0, #ff0);
background-repeat: no-repeat;
background-size: 0 10%;
}
.moveMarker.js_inview.active{
  -webkit-animation: 2s .3s ease both moveMarker;
  animation: 2s .3s  ease both moveMarker;
}

