@charset "utf-8";

/* ------------------------------
   Universal Reset
   Default Style
   Contents
   Responsive
   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[type="text"],input[type="tel"],input[type="email"],input[type="number"],input[type="url"],input[type="password"],
input[type="image"],input[type="submit"],select,textarea{margin:0;padding:0;border:none;border-radius:0;vertical-align:middle;-moz-appearance:none;-webkit-appearance:none;appearance:none;}
input[type="submit"]{background: none;font-weight: normal;text-align: left;}
input[type="button"]{background: none;text-align: left;}
input[type="submit"]:hover,
input[type="button"]:hover,
button:hover{cursor:pointer;}
input[type="file"]{line-height:1;}
input[type="image"]{max-width:100%;outline: none;}
select::-ms-expand{display: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;}


/*==================================================================
   Default Style
==================================================================*/
html{font-size: calc(1000vw / 750);}

body{color:#121212;background:#efeded;font-size:3.2rem;font-family:'Noto Sans JP', "Helvetica Neue", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;line-height:1.6;-webkit-text-size-adjust:100%;}
#container{display: flex;flex-direction: column;min-height: 100%;
background: #fff;margin: 0 auto;max-width:750px;}
main{flex-grow: 1;}
a, a:visited{color:#121212;}
a:hover, a:active{color:#121212;}

/*========== form ==========*/
input,select,textarea,button{font-size:3.2rem;font-family:'Noto Sans JP', "Helvetica Neue", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;}
input[type="file"]{max-width: 100%;}
input[type="submit"],input[type="button"],button{color:#121212;line-height: 1.4;}


/*==================================================================
   Contents
==================================================================*/
.ttl01{background:#ffe400;margin-bottom: 6rem;padding: .5em 4rem;
color:#010101;font-size:3.2rem;font-weight:bold;text-align: center;}

/*========== .blc_mv ==========*/
.blc_mv{position:relative;overflow:hidden;min-height:53rem;
background:url(./default_mv_bg.jpg) center 0 / 100%;}
.blc_mv h1{width: 55.2rem;}
.blc_mv .catch01,
.blc_mv .splash{position: absolute;right: 0;top: 0rem;width: 28.8rem;z-index: 2;}
.blc_mv .player{position: absolute;right: 0;top: 17rem;width: 67.8rem;z-index: 1;}

/*========== .blc_regist ==========*/
.blc_regist{padding: 0 4rem 6rem;}
.blc_regist > .ttl01{margin-left: -4rem;margin-right: -4rem;}
.blc_regist > .area_agree{text-align: center;}
.blc_regist > .area_agree > p{font-size:2.5rem;font-weight:bold;}
.blc_regist > .area_agree > p:not(:first-child){margin-top: .5em;}
.blc_regist > .area_agree > p > a{color:#121212 !important;border-bottom:solid 1px #121212;}
.blc_regist > .area_agree > p > input[type="checkbox"]{display: none;}
.blc_regist > .area_agree > p > input[type="checkbox"] + label{position:relative;padding-left: 1.5em;line-height:1;}
.blc_regist > .area_agree > p > input[type="checkbox"] + label::before{position: absolute;content: "";display: block;left: 0;top: .5rem;width:3rem;height:3.3rem;
background:url(default_icon_agree_check.png) center center / 3rem no-repeat;}
.blc_regist > .area_agree > p > input[type="checkbox"]:checked + label::before{background-image:url(default_icon_agree_checked.png);}

.blc_regist > p.btn_regist > a{display: block;width:90%;max-width:514px;margin: 2rem auto;text-align: center;}
.blc_regist > p.note{color:#121212;font-size:1.8rem;text-align: center;}

/*========== footer ==========*/
footer{background:#000000;color:#fff;font-size:2.8rem;}
footer nav ul > li > a{position:relative;display:block;padding:2.5rem 4rem 2.5rem 9.3rem;color:#fff !important;font-weight:bold;border-bottom:solid 1px #fff;}
footer nav ul > li > a::before{position: absolute;content: "";top: 0;bottom: 0;margin: auto;left: 6rem;width: 0;height: 0;
border-style: solid;
border-width: 1.5rem 0 1.5rem 2rem;
border-color: transparent transparent transparent #fff;
}
footer nav ul > li > a:hover{color:#ffe400;}
footer .copyright{padding: 4rem 0;font-size:2rem;text-align:center;}


/*========== other ==========*/
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;}

.tx_left{text-align: left !important;}
.tx_right{text-align: right !important;}
.tx_center{text-align: center !important;}
.tx_uline{text-decoration: underline;}

.fw_normal{font-weight: normal !important;}
.fw_bold{font-weight: bold !important;}

.fs_S{font-size:0.5em !important;}
.fs_M{font-size:1em !important;}
.fs_L{font-size:1.5em !important;}
.fs_LL{font-size:2em !important;}

.hide{display: none;}


/*==================================================================
   Responsive
==================================================================*/
@media (750px <= width) { /* over 750px */
html{font-size: 62.5%;}
#container{box-shadow: 0 0 2rem rgba(103, 104, 93, 0.2);}
} /* End over 750px */
/*==================================================================
   Animation
==================================================================*/
.js_inview{opacity: 0;}

/*-- zoomOutIn inview --*/
.animated_zoomOutIn.active{opacity: 1;
  -webkit-animation:zoomOutIn 0.5s ease-out 1;
  animation: zoomOutIn 0.5s ease-out 1;
  transform-origin:center bottom;
}
@-webkit-keyframes zoomOutIn {
  from {
    -webkit-transform: scale3d(2, 2, 2);
    transform: scale3d(2, 2, 2);
  }
  80% {
    -webkit-transform: scale3d(0.95, 0.95, 0.95);
    transform: scale3d(0.95, 0.95, 0.95);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes zoomOutIn {
  from {
    -webkit-transform: scale3d(2, 2, 2);
    transform: scale3d(2, 2, 2);
  }
  80% {
    -webkit-transform: scale3d(0.95, 0.95, 0.95);
    transform: scale3d(0.95, 0.95, 0.95);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
/*-- zoomIn inview --*/
.animated_zoomIn.active{opacity: 1;
  -webkit-animation:zoomIn 0.4s ease 1;
  animation: zoomIn 0.4s 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;
  }
}
/*-- slideInRight inview --*/
.animated_slideInTopRight.active{opacity: 1;
  -webkit-animation:slideInTopRight 0.6s ease 1;
  animation: slideInTopRight 0.6s ease 1;
 }
@-webkit-keyframes slideInTopRight {
  from {
    -webkit-transform: translate3d(100%, -20rem, 0);
    transform: translate3d(100%, -20rem, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInTopRight {
  from {
    -webkit-transform: translate3d(100%, -20rem, 0);
    transform: translate3d(100%, -20rem, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
/*-- pulse --*/
.animated_pulse {
  -webkit-animation: 1.2s ease both pulse infinite;
  animation: 1.2s ease both pulse infinite;
}
@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  35% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  70% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  35% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }
  70% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
