@charset "UTF-8";

/* - SP only -----------------------*/
@media screen and (max-width:767px) {
}
/* - SP + TB only-----------------------*/
@media screen and (max-width:1059px) {
}
/* - TB only -----------------------*/
@media screen and (min-width:768px) and (max-width:1059px) {
}
/* - TB以上 -----------------------*/
@media screen and (min-width:768px) {
}
/* - PC ------------------------*/
@media screen and (min-width:1060px) {
}
@media screen and (min-width:1369px) {
}
@font-face {
  font-family:'icomoon';src:url('../fonts/icomoon.eot?5pjyyi');
  src:url('../fonts/icomoon.eot?5pjyyi#iefix') format('embedded-opentype'),url('../fonts/icomoon.ttf?5pjyyi') format('truetype'),url('../fonts/icomoon.woff?5pjyyi') format('woff'),url('../fonts/icomoon.svg?5pjyyi#icomoon') format('svg');
  font-weight:normal;
  font-style:normal;
}
[class^="icon-"]::after,a.btn > span::after,.anchor > ol > li > a::after,#pageTop a::after,.footLink a::after{
  font-family:'icomoon' !important;
  speak:never;
  font-style:normal;
  font-weight:normal;
  font-variant:normal;
  text-transform:none;
  line-height:1;
}
.icon-home::after{content:"\e907"}
.icon-arrow-t::after{content:"\e908"}
.icon-arrow-b::after,.anchor > ol > li > a::after{content:"\e909"}
.icon-arrow-l::after{content:"\e90a"}
.icon-arrow-r::after,a.btn > span::after,#pageTop a::after,.footLink a::after{content:"\e90b"}
.icon-spNav-open::after{content:"\e905"}
.icon-spNav-close::after{content:"\e906"}
.icon-plus::after{content:"\e901"}
.icon-minus::after{content:"\e911"}
.icon-search-l::after{content:"\e902"}
.icon-mail::after{content:"\e900"}
.icon-pdf::after{content:"\e90c"}
.icon-img::after{content:"\e90d"}
.icon-text::after{content:"\e90e"}
.icon-excel::after{content:"\e90f"}
.icon-word::after{content:"\e910"}

/* ===========================
アクセシビリティ用 
=========================== */
.noScript, a.skip {
	text-align:center
}
.skip, a.skip {
	background-color:#FFF
}
.skip {
	width:1px;
	color:#000;
	font-size:.1%;
	line-height:.1;
	position:absolute;
	left:-3000px;
	z-index:9999
}
a.skip {
	padding:2px 0;
	top:auto
}
a.skip:active, a.skip:focus, a.skipShow {
	position:relative;
	display:block;
	width:99.99%;
	left:auto;
	background:#333;
	color:#FFF;
	font-size:100%;
	line-height:1.6;
}

/* ======================================================
　　ベース
====================================================== */
body{
  /*background:#f2f3f4*/
}
header{
  position:relative;
  z-index:3;
  background:#FFF
}
#siteName h1{
  padding:16px 4.2vw;
}
#siteName h1 a{
  display:block;
  width:100%;
  height:3.79vw;
  max-height:24px;
  background:url("../img/title_yoko.svg") no-repeat left center/contain;
}
main{
  position:relative;
  z-index:1;
  padding-bottom:48px;
}
main .bg{
  position:fixed;
  opacity:.2;
  top:0;left:0;right:0;bottom:0;
  z-index:-1;
  display:block;
  width:100vw;
  height:100vh;
  background:url("../img/mv03.jpg") center center/cover;
}
#mv ul{
  list-style:none;
  padding:0;
  margin:0
}
#lead,#form{
  position:relative;
  z-index:1;
  margin:-16vw 0 0 8vw;
  padding:8vw 8vw 48px;
  background:#FFF
}
#form{
  margin-top:-32vw
}
#form .aform-header{
  margin-top:0
}
.leadCatch{
  line-height:1
}
.leadCatch span{
  display:inline-block;
  background:var(--pointColor);
  padding:.3em .5em;
  color:#FFF;
}
.leadAbout{
  border:2px solid var(--baseColor);
  padding:16px 16px 1px;
}
.leadA-img{
  margin-bottom:10px
}
.leadAbout02{
  border-top:2px solid var(--baseColor);
  padding-top:16px
}
.leadAbout02 .leadA-logo{
  text-align:center
}
.leadAbout02 .leadA-logo img{
  border:1px solid #CCC
}
nav.anchor{
  background:var(--baseColor);
  padding:16px 10px;
  line-height:1;
}
nav.anchor ol{
  display:flex;
  flex-wrap:wrap;
  list-style:none;
  padding:0;
  margin:0 -2px;
}
nav.anchor ol li{
  padding:2px;
}
nav.anchor ol li a{
  display:block;
  padding:.3em .5em;
  border:1px solid #FFF;
  font-size:.85em;
  color:#FFF;
  text-decoration:none
}
.anchor > ol > li > a::after{
  padding-left:.5em;
  font-size:10px
}
.block{
  padding:48px 8vw 0
}
.block h2{
  display:inline-block;
  margin-left:-10vw;
  padding:2px 16px 3px 10vw;
  background:var(--pointColor);
  color:#FFF
}
.block > div{
  margin-top:32px
}
.block > div:first-of-type{
  margin-top:0
}
.block dl{
  background:rgba(255,255,255,.6);
  border:1px solid var(--baseColor);
}
.block dl dt{
  padding:10px 16px 8px;
  border-bottom:1px solid var(--baseColor);
  font-weight:bold
}
.block dl dd{
  padding:8px 0;
  margin:0 16px;
  border-top:1px dotted var(--baseColor);
}
.block dl dd:first-of-type{
  border-top:none
}
#no06 dl.qa{
  border:none;
  background:none;
}
#no06 dl.qa dt{
  position:relative;
  background:rgba(255,255,255,.6);
  border:1px solid var(--baseColor);
  border-bottom:none;
  padding:10px 16px 8px 3em;
}
#no06 dl.qa dt::before{
  content:"Q";
  position:absolute;
  top:10px;left:10px;
  width:1.5em;
  height:1.5em; 
  background:var(--baseColor);
  color:#FFF;
  text-align:center;
}
#no06 dl.qa dd{
  position:relative;
  padding:0 16px 8px 3em;
  margin:0 0 1em 0;
  background:rgba(255,255,255,.6);
  border:1px solid var(--baseColor);
  border-top:none;
}
#no06 dl.qa dd::before{
  content:"A";
  position:absolute;
  top:0;left:10px;
  width:1.5em;
  height:1.5em; 
  background:var(--pointColor);
  color:#FFF;
  text-align:center;
}
.no07-1 dl{
  border:none;
  background:none;
  margin-bottom:2px
}
#no07 .no07-1 dt{
  border:1px solid var(--baseColor);
  border-bottom:none
}
#no07 .no07-1 dd{
  padding:0 16px 8px;
  margin:0;
  border:1px solid var(--baseColor);
  border-top:none
}
#no07 .no07-1 dd:first-of-type{
  margin-bottom:10px
}
footer{
  position:relative;
  z-index:1;
  background:var(--baseColor);
  color:#FFF
}
footer a{
  color:#FFF!important
}
footer #info{
  padding:8vw;
  border-bottom:1px solid rgba(255,255,255,.5);
}
footer #info dl{
  margin-bottom:0;
  text-align:center
}

footer #info dl dt::before,footer #info dl dt::after{
  content:"-";
  display:inline-block;
  margin:0 8px;
}
footer #info dl dd.organizer{
  margin-bottom:.5em;
  font-size:1.5em;
}
#pageTop{
  position:fixed;
  z-index:1;
  right:-1.5em;
  bottom:2.5em;
  transform:rotate(-90deg); 
}
#pageTop a{
  color:var(--baseColor)!important;
  text-decoration:none
}
#pageTop a::after{
  margin-left:8px;  
  font-size:10px;
}
.footLink{
  margin:0;  
  padding:8vw 1em 1em;
  text-align:center
}
.footLink a{
  display:inline-block;
  padding:.2em .5em .3em;
  background:rgba(255,255,255,.9);
  color:#000!important;
  text-decoration:none;  
}
.footLink a::after{
  font-size:.75em
}
.copyright{
  margin:0;
  padding:0 1em 1em;
  text-align:center;
  font-size:.85em
}
/* - SP only -----------------------*/
@media screen and (max-width:767px) {
}
/* - SP + TB only-----------------------*/
@media screen and (max-width:1059px) {
  .leadAbout{
    font-size:.85em
  }
}
/* - TB only -----------------------*/
@media screen and (min-width:768px) and (max-width:1059px) {
}
@media screen and (min-width:29em) {
  .leadCatch span:first-of-type{
    padding-right:0
  }
  .leadCatch span:last-of-type{
    padding-left:0
  }  
}
/* - TB以上 -----------------------*/
@media screen and (min-width:768px) {
  .leadA-img{
    width:50%;
    float:right;
    margin:0 0 16px 24px
  }
  .leadAbout02 .leadA-txt{
    width:calc(50% - 24px);
    float:left
  }
}
/* - PC ------------------------*/
@media screen and (min-width:1060px) {
  main{
    padding-bottom:64px
  }
  .inner{
    max-width:1160px;
    margin:0 auto;
  }
  
  header{
    position:relative
  }
  #siteName{
    position:absolute;
    top:0;right:0;
    width:12%;
  }
  #siteName h1{
    height:46vw;
    padding:20% 0;
  }
  #siteName h1 a {
    display:block;
    width:100%;
    height:100%;
    max-height:712px;
    background:url("../img/title_tate.svg") no-repeat center center/contain;
  }  
  #mv{
    width:88%
  }
  #lead{
    margin:-12vw 12% 0;
    padding:48px 0 48px 56px;
  }
  #form{
    margin:-30vw 12% 0;
    padding:48px 0 48px 56px;
  }
  .leadCatch{
    font-size:1.2em
  }
  .leadAbout{
    padding:24px 24px 8px;
    margin-top:1.5em
  }
  .leadA-img{
    width:370px/*33.333333%*/;
  }
  .leadAbout02 .leadA-txt{
    width:calc(100% - 370px - 24px);
  }
  nav.anchor{
    padding:20px 12%
  }
  nav.anchor ol{
    max-width:1160px;
    padding-left:56px
  }
  nav.anchor ol li{
    padding:4px
  }
  .block{
    max-width:1160px;
    margin:0 auto;
    padding:64px 64px 0
  }
  .block h2{
    margin:0 0 32px;
    padding:4px 16px
  }
  .block dl{
    height:100%;
    margin:0
  }
  .no01-2 .colGroup{
    margin-bottom:1em
  }
  footer #info{
    padding:56px 24px;
    margin:0 auto
  }
  footer .inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:24px
    
  }
  .footLink,.copyright{
    padding:0
  }
  #pageTop{
    right:0;bottom:3.5em
  }
}
@media screen and (min-width:1400px) {
  #lead{margin-top:-30vw}
}

@keyframes shiny{
  0%{transform:scale(0) rotate(25deg);opacity:0}
  50%{transform:scale(1) rotate(25deg);opacity:1}
  100%{transform:scale(50) rotate(25deg);opacity:0}
}
@keyframes fadeUP{
  0%{opacity:0;transform:translateY(10vh)}
  30%{opacity:0}
  100%{opacity:1;transform:translateY(0)}
}
@keyframes fadeDOWN{
  0%{opacity:0;transform:translateY(-10vh)}
  30%{opacity:0}
  100%{opacity:1;transform:translateY(0)}
}
@keyframes fadeIN{
  0%{opacity:0;}
  30%{opacity:0}
  100%{opacity:1;transform:translateY(0)}
}  
