/*
 * Globals
 */

/* Links */
a,
a:focus,
a:hover {
  color: #fff;
}

/* Custom default button */
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
  color: #333;
  text-shadow: none; /* Prevent inheritance from `body` */
  background-color: #fff;
  border: .05rem solid #fff;
}


/*
 * Base structure
 */

html,
body {

  background-image:url(../img/stripe-bg.png);
  background-repeat:repeat;
  background-position: center center;
  background-attachment: fixed;
  font-family: 'Roboto', sans-serif;
}


.bg-mask {
  height: 100vh;
  background: rgba(255,255,255,0.6);
}

.logo {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}


.item {
  position :absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.item img {
	width: 100%;
}

 
.cover-container {
  max-width: 42em;
}

.overlay {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}


/*------------------------------------------------------
　loading
------------------------------------------------------*/

/*▼▼ ここから追加する ▼▼*/
.loader-wrap {
	position: fixed;
	display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: #fff;
}
/*▲▲ ここまで追加する ▲▲*/

.loader {
  margin: 100px auto;
  font-size: 12px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: relative;
  text-indent: -9999em;
  -webkit-animation: load5 1.1s infinite ease;
  animation: load5 1.1s infinite ease;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}

@-webkit-keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #000000, 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.5), -1.8em -1.8em 0 0em rgba(0,0,0, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.7), 1.8em -1.8em 0 0em #000000, 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.5), 1.8em -1.8em 0 0em rgba(0,0,0, 0.7), 2.5em 0em 0 0em #000000, 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.5), 2.5em 0em 0 0em rgba(0,0,0, 0.7), 1.75em 1.75em 0 0em #000000, 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.5), 1.75em 1.75em 0 0em rgba(0,0,0, 0.7), 0em 2.5em 0 0em #000000, -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.5), 0em 2.5em 0 0em rgba(0,0,0, 0.7), -1.8em 1.8em 0 0em #000000, -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.5), -1.8em 1.8em 0 0em rgba(0,0,0, 0.7), -2.6em 0em 0 0em #000000, -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.5), -2.6em 0em 0 0em rgba(0,0,0, 0.7), -1.8em -1.8em 0 0em #000000;
  }
}
@keyframes load5 {
  0%,
  100% {
    box-shadow: 0em -2.6em 0em 0em #000000, 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.5), -1.8em -1.8em 0 0em rgba(0,0,0, 0.7);
  }
  12.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.7), 1.8em -1.8em 0 0em #000000, 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.5);
  }
  25% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.5), 1.8em -1.8em 0 0em rgba(0,0,0, 0.7), 2.5em 0em 0 0em #000000, 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  37.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.5), 2.5em 0em 0 0em rgba(0,0,0, 0.7), 1.75em 1.75em 0 0em #000000, 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  50% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.5), 1.75em 1.75em 0 0em rgba(0,0,0, 0.7), 0em 2.5em 0 0em #000000, -1.8em 1.8em 0 0em rgba(0,0,0, 0.2), -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  62.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.5), 0em 2.5em 0 0em rgba(0,0,0, 0.7), -1.8em 1.8em 0 0em #000000, -2.6em 0em 0 0em rgba(0,0,0, 0.2), -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  75% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.5), -1.8em 1.8em 0 0em rgba(0,0,0, 0.7), -2.6em 0em 0 0em #000000, -1.8em -1.8em 0 0em rgba(0,0,0, 0.2);
  }
  87.5% {
    box-shadow: 0em -2.6em 0em 0em rgba(0,0,0, 0.2), 1.8em -1.8em 0 0em rgba(0,0,0, 0.2), 2.5em 0em 0 0em rgba(0,0,0, 0.2), 1.75em 1.75em 0 0em rgba(0,0,0, 0.2), 0em 2.5em 0 0em rgba(0,0,0, 0.2), -1.8em 1.8em 0 0em rgba(0,0,0, 0.5), -2.6em 0em 0 0em rgba(0,0,0, 0.7), -1.8em -1.8em 0 0em #000000;
  }
}


/*------------------------------------------------------
　header
------------------------------------------------------*/


.masthead {
  margin-bottom: 2rem;
}

.masthead-brand {
  margin-bottom: 0;
  padding-top:25px;

}


h3 {
  position: absolute;
  left: 30px;
  height: 50px;

}


/*
 * Cover
 */
.cover {
  padding: 0 1.5rem;

}
.cover .btn-lg {
  padding: .75rem 1.25rem;
  font-weight: 700;
}
.cover-heading {
	font-size:3.8em;
	font-family: 'Lora', serif;
}
.lead {
	font-size:0.9em;
	font-family: 'Noto Sans JP', sans-serif;
}



/*------------------------------------------------------
　Nav
------------------------------------------------------*/


#nav-toggle {
  position: fixed;
  top: 50px;
  right: 25px;
  height: 32px;
  cursor: pointer;
}
#nav-toggle > div {
  position: relative;
  width: 36px;
}
#nav-toggle span {
  width: 100%;
  height: 4px;
  left: 0;
  display: block;
  background: #000;
  position: absolute;
  transition: top .5s ease, -webkit-transform .6s ease-in-out;
  transition: transform .6s ease-in-out, top .5s ease;
  transition: transform .6s ease-in-out, top .5s ease, -webkit-transform .6s ease-in-out;
}
#nav-toggle span:nth-child(1) {
  top: 0;
}
#nav-toggle span:nth-child(2) {
  top: 14px;
}
#nav-toggle span:nth-child(3) {
  top: 28px;
}
#nav-toggle:hover span:nth-child(1) {
  top: 4px;
}
#nav-toggle:hover span:nth-child(3) {
  top: 23px;
}

.open #nav-toggle span {
  background: #fff;
}
.open #nav-toggle span:nth-child(1) {
  top: 15px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.open #nav-toggle span:nth-child(2) {
  top: 15px;
  width: 0;
  left: 50%;
}
.open #nav-toggle span:nth-child(3) {
  top: 15px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

/* z-index */
#nav-toggle {
  z-index: 1000;
}

#container {
  z-index: 900;
}




/*------------------------------------------------------
　Accordion
------------------------------------------------------*/

/*transition & delay*/
.transition10{transition:all 1s cubic-bezier(0.190, 1.000, 0.220, 1.000);}
.delay01{transition-delay: .1s;}
.delay02{transition-delay: .2s;}
.delay03{transition-delay: .3s;}
.delay04{transition-delay: .4s;}
.delay05{transition-delay: .5s;}
.delay06{transition-delay: .6s;}
.delay07{transition-delay: .7s;}
.delay08{transition-delay: .8s;}
.delay09{transition-delay: .9s;}
.delay10{transition-delay: 1s;}
.delay11{transition-delay: 1.1s;}


/*fullnav*/
.fullnav{
    display: none;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
	z-index:950;
	font-size:1.4em;
}

/*fullnav__nav*/
.fullnav__nav{
    align-items: center;
	text-align:left;
    background: #E6E6E6;
    display: flex;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 0;
}
 
 
/*gnav*/
.gnav{
    margin: 0 auto;
    width: 80%;
}
.gnav__menu__item{
    margin:20px 0 20px -30px;
	padding-left:-80px;
    opacity: 0;
    transform: translateY(20px);
}

.gnav li{
	list-style:none;
}

.gnav a{
    color: #333;
    text-decoration: none;
}


@media screen and (min-width:768px) {
	.gnav{
    margin: 0 auto;
    width: 40%;
	}
	
	.gnav__menu__item{
    margin:20px 0;
	padding-left:-80px;
    opacity: 0;
    transform: translateY(20px);
    }

}



/*fullnav__cnt*/
.fullnav__cnt{
    align-items: center;
	text-align:left;
    background: #333;
    color: #fff;
    display: flex;
    height: 100%;
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 0;
}
.fullnav__cnt__inner{
    margin: 0 auto;
    width: 100%;
	margin-top:-125px;
}

@media screen and (min-width:768px) {
.fullnav__cnt{
    align-items: center;
	text-align:left;
    background: #333;
    color: #fff;
    display: flex;
    height: 100%;
    left: 30%;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 0;
}
}

@media screen and (min-width:768px) {
	.fullnav__cnt__inner{
		margin: 0 auto;
		width: 80%;
		margin-top:-125px;
	}
}

.fullnav__cnt__title{
    margin-bottom: 20px;
	margin-left:25px;
    opacity: 0;
    transform: translateY(100px);
}

@media screen and (min-width:768px) {
	.fullnav__cnt__title{
		margin-bottom: 20px;
		margin-left:60px;
		opacity: 0;
		transform: translateY(100px);
	}
}

.fullnav__cnt__menu{
    list-style: none;
}
.fullnav__cnt__menu__item{
    margin:20px;
    opacity: 0;
    transform: translateY(100px);
}
.fullnav__cnt__menu__item a{
    color: #fff;
}

.fullnav__cnt li{
	list-style:none;
}

.mail{
	font-size:0.6em;
	margin-top:-15px;
	border-bottom-style:dotted;
	border-bottom-color:#666;

}

@media screen and (min-width:768px) {
.mail{
	font-size:0.8em;
	margin-top:-15px;
	border-bottom-style:dotted;
	border-bottom-color:#666;

}
}

/*on fullnav__nav*/
.fullnav.on .fullnav__nav{
    opacity: 1;
    width: 50%;
}

@media screen and (min-width:768px) {
    .fullnav.on .fullnav__nav{
		opacity: 1;
		width: 30%;
    }
}


/*on gnav*/
.fullnav.on .gnav li{
    opacity: 1;
    transform: translateY(0);   
}
/*on fullnav__cnt*/
.fullnav.on .fullnav__cnt{
    opacity: 1;
    width: 50%;
}

@media screen and (min-width:768px) {
    .fullnav.on .fullnav__cnt{
		opacity: 1;
		width: 70%;
    }
}

.fullnav.on .fullnav__cnt__title{
    opacity: 1;
    transform: translateY(0);
}
.fullnav.on .fullnav__cnt__menu__item{
    opacity: 1;
    transform: translateY(0);
}


/*
 * Contents
 */
 
.inner cover{
	position: relative;
}

.box1 {
  position: absolute;
  top: 50%;
  left: 15%;
  transform: translateY(-50%) translateX(-15%);
  -webkit- transform: translateY(-50%) translateX(-15%);
  text-align:left;
  font-size:0.8em;

}



/*
 * Footer
 */
.mastfoot {
  color: rgba(0, 0, 0, 0.8);
  position: absolute;/*←絶対位置*/
  bottom: 20px; /*下に固定*/
  width: 98%;
  text-align: center;
}