@charset "UTF-8";

/* html5doctor.com Reset v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) - http://cssreset.com */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
ol,ul {list-style:none;}

body{font-family: 'Noto Sans JP', 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; color:#222; font-weight:400; line-height:1;}
html{font-size: 62.5%;}
ul{list-style: none; }
a, input{outline:none;}

/**** Start of "Micro cf" ****/

.cf { zoom: 1; }
.cf:before,
.cf:after { content: ""; display: table; }
.cf:after { clear: both; }

/* --------------------------------------------------------
	site setting
-------------------------------------------------------- */
.mt-5 {
  margin-top: 5px !important;
}

.mt-10 {
  margin-top: 10px !important;
}

.mt-15 {
  margin-top: 15px !important;
}

.mt-20 {
  margin-top: 20px !important;
}

.mt-30 {
  margin-top: 30px !important;
}

.mt-40 {
  margin-top: 40px !important;
}

.mb-5 {
  margin-bottom: 5px !important;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.mb-15 {
  margin-bottom: 15px !important;
}

.mb-20 {
  margin-bottom: 20px !important;
}

.mb-30 {
  margin-bottom: 30px !important;
}

.mb-40 {
  margin-bottom: 40px !important;
}

.mtb-10 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.mtb-20 {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

.fs-11 {
  font-size: 1.1rem !important;
}

.fs-12 {
  font-size: 1.2rem !important;
}

.fs-14 {
  font-size: 1.4rem !important;
}

.fs-16 {
  font-size: 1.6rem !important;
}

.fs-18 {
  font-size: 1.8rem !important;
}

.fs-20 {
  font-size: 2.0rem !important;
}

.fs-22 {
  font-size: 2.2rem !important;
}

.fs-24 {
  font-size: 2.4rem !important;
}

.fw-normal {
  font-weight: normal !important;
}

.fw-bold {
  font-weight: bold !important;
}

.lh-120 {
  line-height: 120% !important;
}

.lh-140 {
  line-height: 140% !important;
}

.lh-160 {
  line-height: 160% !important;
}

.ta-center {
  text-align: center;
}

.ta-right {
  text-align: right;
}

.fl-left {
  float: left;
}

.fl-right {
  float: right;
}

/* --------------------------------------------------------
	style
-------------------------------------------------------- */
html {
  height: 100%;
}
body {
  background:url(../img/bg-body.jpg) center top no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
/* --------------------------------------------------------
	header
-------------------------------------------------------- */
.hero {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  margin:0 auto;
  padding:2.5vw 0;
  width:75%;
  box-sizing: border-box;
}
.hero__inner--left {
  width:6.5%;
}
.hero__subtitle {
  opacity: 0.0;
  -webkit-filter:blur(10px);
  -moz-filter:blur(10px);
  -ms-filter:blur(10px);
  filter:blur(10px);
}
.loaded .hero__subtitle {
  opacity: 1.0;
  -webkit-filter:blur(0);
  -moz-filter:blur(0);
  -ms-filter:blur(0);
  filter:blur(0);
  transition: 5.0s;
  transition-delay: 0.5s;
}
.hero__subtitle img {
  width:100%;
  height:auto;
}
.hero__inner--right {
  position: relative;
  width:86.6666%;
}
.hero__inner--right:before {
  content:'';
  position:absolute;
  top:22%;
  right:-16%;
  width:34.1346%;
  height:auto;
  background:url(../img/img-hero02.svg);
  background-size: cover;
  aspect-ratio:59199/59399;
  opacity: 0.0;
  -webkit-filter:blur(10px);
  -moz-filter:blur(10px);
  -ms-filter:blur(10px);
  filter:blur(10px);
}
.loaded .hero__inner--right:before {
  opacity: 1.0;
  -webkit-filter:blur(0);
  -moz-filter:blur(0);
  -ms-filter:blur(0);
  filter:blur(0);
  transition: 5.0s;
  transition-delay: 0.5s;
}
.hero__title {
  position: relative;
  width:100%;
  opacity: 0.0;
  -webkit-filter:blur(10px);
  -moz-filter:blur(10px);
  -ms-filter:blur(10px);
  filter:blur(10px);
}
.loaded .hero__title {
  opacity: 1.0;
  -webkit-filter:blur(0);
  -moz-filter:blur(0);
  -ms-filter:blur(0);
  filter:blur(0);
  transition: 5.0s;
}
.hero__title img {
  width:100%;
  height:auto;
}
.hero__date {
  position: relative;
  margin:7.5vw 0;
  width:73.5576%;
  opacity: 0.0;
  -webkit-filter:blur(10px);
  -moz-filter:blur(10px);
  -ms-filter:blur(10px);
  filter:blur(10px);
}
.loaded .hero__date {
  opacity: 1.0;
  -webkit-filter:blur(0);
  -moz-filter:blur(0);
  -ms-filter:blur(0);
  filter:blur(0);
  transition: 4.0s;
  transition-delay: 1.0s;
}
.hero__date img {
  width:100%;
  height:auto;
}
.information {
  opacity: 0.0;
  -webkit-filter:blur(10px);
  -moz-filter:blur(10px);
  -ms-filter:blur(10px);
  filter:blur(10px);
}
.loaded .information {
  opacity: 1.0;
  -webkit-filter:blur(0);
  -moz-filter:blur(0);
  -ms-filter:blur(0);
  filter:blur(0);
  transition: 3.0s;
  transition-delay: 1.5s;
}
.information .list__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
}
.information .list__container:nth-of-type(1) {
}
.information .list__container:nth-of-type(2) {
  margin-top:20px;
}
.information .list__container:nth-of-type(3) {
  margin-top:20px;
}
.information .information__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  width:32%;
}
.information .list__container:nth-of-type(2) .information__list:nth-of-type(2) {
  width:66%;
}
.information__list .list__title {
  padding:10px 20px;
  width:100%;
  color:#333;
  font-size: clamp(1.4rem, 0.9376rem + 0.55vw, 2.0rem);
  font-weight: 700;
  text-align: center;
  background:rgba(238,238,238,0.8);
  box-sizing: border-box;
}
.information__list .list__data {
  flex-grow: 1;
  padding:15px 20px;
  width:100%;
  color:#333;
  font-size: clamp(1.4rem, 0.9376rem + 0.55vw, 2.0rem);
  font-weight: 500;
  line-height:1.5;
  text-align: left;
  background:rgba(255,255,255,0.65);
  box-sizing: border-box;
}
.information__list .list__data .note {
  font-size:clamp(1.0rem, 0.6928rem + 0.37vw, 1.4rem);
}
.information__list .list__data .note {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.information__list .list__data .note:before {
  content:'※';
  display: inline;
  margin-right:3px;
}
.information__list .list__data span {
  font-size: clamp(1.0rem, 0.6928rem + 0.37vw, 1.4rem);
}
/* --------------------------------------------------------
	footer
-------------------------------------------------------- */
footer {
  margin:0 auto;
  padding:2.5vw 0 5vw;
  width: 75%;
  font-size: 1.6rem;
  text-align: right;
  box-sizing: border-box;
}
/* --------------------------------------------------------
	responsive
-------------------------------------------------------- */
@media screen and (max-width: 1680px) {

}
@media screen and (max-width: 1440px) {

}
@media screen and (max-width: 1280px) {
}
@media screen and (max-width: 834px) {
  body {
    background:url(../img/bg-body-sp.jpg) no-repeat;
    background-size: 100% auto;
    background-attachment:scroll;
  }  
  .hero {
    flex-direction: column;
    justify-content:flex-start;
  }
  .hero__inner--left {
    display: contents;
  }
  .hero__inner--right {
    display: contents;
  }
  .hero__subtitle {
    order: 1;
  }
  .hero__title {
    order: 0;
  }
  .hero__date {
    order: 2;
  }
  .information {
    order: 3;
  }
  .hero__inner--right:before {
    content: none;
  }
  footer {
    font-size: 1.4rem;
    text-align: center;
  }
}
@media screen and (max-width: 768px) {

}
@media screen and (max-width: 540px) {
  .hero {
    padding: 30px 0 0;
    width:90%;
  }
  .hero__subtitle {
    margin-top:20px;
  }
  .hero__date {
    position: relative;
    margin: 7.5vw 0;
    width: 80%;
  }
  .information .list__container {
    flex-direction: column;
    justify-content: flex-start;
  }
  .information .list__container:nth-of-type(2), .information .list__container:nth-of-type(3) {
    margin-top: 0;
  }
  .information .information__list {
    width: 100%;
  }
  .information .list__container:nth-of-type(2) .information__list:nth-of-type(2) {
    width: 100%;
  }
  .information__list .list__data span, .information__list .list__data .note {
    font-size: 1.2rem;
  }
  footer {
    padding: 30px 0;
    width:90%;
  }
}
@media screen and (max-width: 430px) {
}

/* --------------------------------------------------------
	animation
-------------------------------------------------------- */
@keyframes show {
  0% {
    opacity: 0;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }
  100% {
    opacity: 1.0;
    backdrop-filter: blur(0);
    -webkit-backdrop-filter: blur(0);
  }
}
@keyframes scaleUp {
  0% {
    transform: translate(-50%, 0) scale(1.0);
  }
  50% {
    transform: translate(-50%, 0) scale(1.2);
  }
  100% {
    transform: translate(-50%, 0) scale(1.0);
  }
}