/*	story
============================== */
#guest h2 {
    justify-content: left;
    color:#071656;
}
#guest h3{
  text-align:center;
  white-space: nowrap;
  color:#fff;
  background-image: url(img/point_bg.png);
  background-position: center;
  background-size:40%;
}
#guest .s1 h3{
background-color:#071656;
}
#guest .s2 h3{
background-color:#6b0202;
}
#guest h3 span
{
display: inline-block;
background:#6b0202;
color: #fff;
transform: rotate(-10deg);
-moz-transform: rotate(-10deg);
-webkit-transform: rotate(-10deg);
margin:0 10px;
padding:0 2px;
font-size: 120%;
}
#guest .s1 h3 span
{
background:#6b0202;
}
#guest .s2 h3 span
{
background:#071656;
}
#guest .innerbox .inn{
box-sizing: border-box;
box-shadow:
 rgba(0, 0, 0, 0.09) 0px 2px 1px,
 rgba(0, 0, 0, 0.09) 0px 4px 2px,
 rgba(0, 0, 0, 0.09) 0px 8px 4px,
 rgba(0, 0, 0, 0.09) 0px 16px 8px,
 rgba(0, 0, 0, 0.09) 0px 32px 16px;
}

#guest .innerbox .ph li span.lazy{
  width: 100%;
  height:0;
  padding-top:66.5%;
  background-color: #eee;
}

#guest .innerbox .ph li{
  position: relative;
  background-color: #fff;
  border: solid 1px #eee;
  box-sizing: border-box;
}

#guest .innerbox p
{
font-family: dnp-shuei-mincho-pr6, sans-serif;
font-weight: 400;
font-style: normal;
font-feature-settings: "palt";
letter-spacing: 0.08em;
}
#guest .innerbox .ph li .category{
  position: absolute;
  z-index: 100;
  color: #fff;
  transform: rotate(-5deg);
  -moz-transform: rotate(-5deg);
  -webkit-transform: rotate(-5deg);
}
#guest .innerbox .s1 .category{  background:#6b0202;}
#guest .innerbox .s2 .category{  background:#071656;}


#guest .innerbox .ph li .name{
  position: absolute;
  bottom:3.5%;
  right: 2.5%;
  z-index: 100;
  background: rgba(0, 0, 0, 0.7) ;
  color: #fff;
}
#guest .innerbox p small{
  display: inline-block !important;
  margin-left:5px;
}
@media all and (min-width: 768px) {
#guest .box{
  margin-top:50px;
}
#guest .innerbox{
  padding-top:40px;
}
#guest .innerbox .inn{
  width:880px;
  padding:30px 50px 50px;
  margin:0 auto 50px;
  background: #fff;
}
#guest h3{
  font-size: 300%;
  margin-bottom: 15px;
  }
#guest p{
  padding:0 10px;
}
#guest .innerbox .ph li .category{
  top:0;
  left:-10px;
  padding:.1em 0.5em ;
  vertical-align: middle;
  border-radius: 25px 0px 0px 25px;
}

#guest .innerbox .ph li .category:before {
  content: '●';
  color: white;
  margin-right: 6px;
}

#guest .innerbox .ph li .name small{
    font-size: 70% ;
  }
#guest .innerbox .ph li{
  width:48%;
  padding:1%;
  margin: 20px auto 0;
}
#guest ul.ph{
  margin:0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-around;
}

}
@media all and (max-width: 767px) {
  #guest .box{
    margin-top:1em;
  }

  #guest .innerbox .inn{
    padding:1em 0;
    margin:0 auto 1em;
    background: #fff;
  }

#guest h3{
  font-size: 150%;

  }

#guest p{
  padding:0 .5em;

}

#guest .innerbox .ph li .category{
  top:0;
  left:-2%;
  font-size: 80%;
  padding:.1em 0.5em ;
  vertical-align: middle;
  border-radius: 25px 0px 0px 25px;
}
#guest .innerbox .ph li .category:before {
  content: '●';
  color: white;
  margin-right: 2px;
}


#guest .innerbox .ph li .name{
  font-size: 80%;
}
#guest .innerbox .ph li .name small{
    font-size:60% ;
  }
#guest .innerbox .ph li{
  width: 90%;
  margin: 1em auto 0;
  padding:2%;
  }
}