@charset "UTF-8";

body{
  background-color: #e0e2c0;
  background-image: url(../img/washi_bg.jpg);
}

.title{
  padding-bottom: 5px;
}

.title img{
  max-width: 10%;
  position: relative;
  left: 2%;
  filter: drop-shadow( 2px 2px 2px #000);
}

@media screen and (max-width: 600px){
  .title img{
    min-width: 20%;
  }
}

.flex{
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  -webkit-display: flex;
  -webkit-flex-wrap: wrap;
  -webkit-justify-content: start;
  -ms-display: flex;
  -ms-flex-wrap: wrap;
  -ms-justify-content: start;
  -moz-display: flex;
  -moz-flex-wrap: wrap;
  -moz-justify-content: start;
}

/*↓紙面が1枚の時のフッター下部固定用CSS↓*/
.only1-page,
.only1-page .wrap{
  display: flex!important;
  flex-direction: column!important;
  min-height: 100vh!important;
  -webkit-display: flex!important;
  -webkit-flex-direction: column!important;
  -ms-display: flex!important;
  -ms-flex-direction: column!important;
  -moz-display: flex!important;
  -moz-flex-direction: column!important;
}

.only1-page footer {
  margin-top: auto!important;
}
/*↑紙面が1枚の時のフッター下部固定用CSS↑*/

.my-gallery figure figcaption{
  margin-top: 0.5rem;
}

.my-gallery .img-responsive{
  box-shadow: 0.25rem 0.25rem 0.5rem #696969;
}

/*
.marquee{
color: #fff;
width: 100%;
padding: 0.5em 0;
overflow: hidden;
position: relative;
}

.marquee p:after{
content: "";
white-space: nowrap;
padding-right: auto;
}

.marquee p{
margin: 0;
padding-left: 100%;
display:inline-block;
white-space:nowrap;
	-webkit-animation-name: marquee;
	-webkit-animation-timing-function: linear;
	-webkit-animation-duration: 30s;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-name: marquee;
	-moz-animation-timing-function: linear;
	-moz-animation-duration: 30s;
	-moz-animation-iteration-count: infinite;
	-ms-animation-name: marquee;
	-ms-animation-timing-function: linear;
	-ms-animation-duration: 30s;
	-ms-animation-iteration-count: infinite;
	-o-animation-name: marquee;
	-o-animation-timing-function: linear;
	-o-animation-duration: 30s;
	-o-animation-iteration-count: infinite;
	animation-name: marquee;
	animation-timing-function: linear;
	animation-duration: 30s;
	animation-iteration-count: infinite;
}
@-webkit-keyframes marquee{
  from { -webkit-transform: translate(0%);}
  99%,to { -webkit-transform: translate(-100%);}
}
@-moz-keyframes marquee{
  from   { -moz-transform: translate(0%);}
  99%,to { -moz-transform: translate(-100%);}
}
@-ms-keyframes marquee{
  from   { -ms-transform: translate(0%);}
  99%,to { -ms-transform: translate(-100%);}
}
@-o-keyframes marquee{
  from   { -o-transform: translate(0%);}
  99%,to { -o-transform: translate(-100%);}
}
@keyframes marquee{
  from   { transform: translate(0%);}
  99%,to { transform: translate(-100%);}
}
*/