@charset 'utf-8';
/* CSS Document */
.photo-show { 
  height: 700px; /*表示したい大きさ*/
  /*margin: 30px auto; /*縦余白は任意*/
  position: relative;
  width: 600px; /*表示したい大きさ、height と合わせる*/
}
/*各画像のアニメーションの合計秒数*/
.photo-show img { 
  animation: show 22s infinite;
  -webkit-animation: show 22s infinite;
  height: auto;
  max-width: 100%;
  opacity: 0;
  position: absolute; /*画像を全て重ねる*/
}
/*アニメーション*/
@keyframes show {
  0% {opacity:0}
  10% {opacity:1}
  20% {opacity:1}
  40% {opacity:0}
 }
@-webkit-keyframes show {
  0% {opacity:0}
  10% {opacity:1}
  20% {opacity:1}
  40% {opacity:0}
}

/*各画像のアニメーションの開始時間をずらす*/
/*1枚目*/
.photo-show img:nth-of-type(1) {
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
}
/*2枚目*/
.photo-show img:nth-of-type(2) {
  animation-delay: 4s;
  -webkit-animation-delay: 4s;
}
/*3枚目*/
.photo-show img:nth-of-type(3) {
  animation-delay: 8s;
  -webkit-animation-delay: 8s;
}
/*4枚目*/
.photo-show img:nth-of-type(4) {
  animation-delay: 12s;
  -webkit-animation-delay: 12s;
}
/*5枚目*/
.photo-show img:nth-of-type(5) {
  animation-delay: 16s;
  -webkit-animation-delay: 16s
}
/*6枚目*/
.photo-show img:nth-of-type(6) {
  animation-delay: 18s;
  -webkit-animation-delay: 18s;
}
/*7枚目*/
/*.photo-show img:nth-of-type(7) {
  animation-delay: 24s;
  -webkit-animation-delay: 24s;
}*/ 
/*8枚目*/
/*.photo-show img:nth-of-type(8) {
  animation-delay: 14s;
  -webkit-animation-delay: 14s;
}*/


.canvas-wrapper{
	width:600px;
	background: linear-gradient(145deg, #ffbfdc, #fff1e5);
	padding:1.5em 0;
  margin: 0 auto;
	background-size: 400% 400%;

	-webkit-animation: coffretAnimation 8s ease infinite;
	-moz-animation: coffretAnimation 8s ease infinite;
	animation: coffretAnimation 8s ease infinite;
}

@-webkit-keyframes coffretAnimation {
    0%{background-position:15% 0%}
    50%{background-position:86% 100%}
    100%{background-position:15% 0%}
}
@-moz-keyframes coffretAnimation {
    0%{background-position:15% 0%}
    50%{background-position:86% 100%}
    100%{background-position:15% 0%}
}
@keyframes coffretAnimation { 
    0%{background-position:15% 0%}
    50%{background-position:86% 100%}
    100%{background-position:15% 0%}
}
}
.wave-bar {
  width: 100%;
  max-width:600px;
  height: 80px;
}
.flipped {
  transform:rotate(180deg);
}
.wave_box{
  padding:2em 0;
  border-radius:1em;
  background:#FFFAFA;
  width:95%;
  margin:1em auto;
}
.topmenu{
  text-align:center;
  width:100%;
  max-width:600px;
  margin:1em auto 0;
}
.midashi1{
  font-size:1.6rem;
  line-height:150%;
  color:#2b2b2b;
  font-weight:normal;
  text-align:center;
}
.kaihou_container{
  width:95%;
  margin:.8em auto 0;
  text-align:left;
}
.kaihou_container p {
  font-size:16px;
  line-height:160%;
  margin:2em 0 0;
  /*margin-bottom:4%;*/
  color:#444 !important;
}
.kaihou_container .illust{
  text-align:center;
  width:100%;
  max-width:550px;
  margin:1em auto 0;
}
.kaihou_container .illust img{
  width:100%;
}
.kaihou_container p.list {
  font-size:14px;
  line-height:150%;
  margin-bottom:0;
  color:#555;
}
.strongtext{
  font-weight:bold;
  color:#FF6699;
}
.top{
  width:90%;
  margin:1em auto 0;
  text-align:right;
  font-size:10px;
}
.top a{
  color:#444;
  text-decoration:underline;
}