@charset "UTF-8";


.block-story{
  margin-bottom: 70px;
  position: relative;
}
.block-story.bg{
  background: #eee;
  margin-bottom: 0;
  padding-bottom: 70px; 
}
.block-story.bg-bottom-01{
  margin-bottom: 0;
  padding-bottom: 70px; 
}
.block-story.bg-bottom-01:before{
  content:"";
  height: 0;
  width: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  border-style: solid;
  border-width: 0 0 170px 100vw ;
  border-color: #fff #fff #eee #fff;
}
.block-story.bg-bottom-02{
  background: #eee;
  margin-bottom: 0;
  padding-bottom: 70px; 
}
.block-story.bg-bottom-02:before{
  content:"";
  height: 0;
  width: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  border-style: solid;
  border-width: 0 0 170px 100vw ;
  border-color: #eee #eee #fff #eee;
}
.block-story.bg-bottom-03{
  margin-bottom: 0;
  padding-bottom: 70px; 
}
.block-story.bg-bottom-03:before{
  content:"";
  height: 0;
  width: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  border-style: solid;
  border-width: 170px 0 0  100vw ;
  border-color: #fff #eee #eee #eee;
}
.block-story.bg-bottom-04{
  background: #eee;
  margin-bottom: 0;
  padding-bottom: 70px; 
}
.block-story.bg-bottom-04:before{
  content:"";
  height: 0;
  width: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  border-style: solid;
  border-width: 170px 0 0 100vw ;
  border-color: #eee #fff #fff #fff;
}
.block-story h2{
  font-size: 2.8rem;
  margin-bottom: 20px;
  text-align: left;
}
.block-story figure.tate{
  float: left;
  margin: 0 7% 2em 0;
  width: 40%;
}
.block-story figure.yoko{
  margin: 0 auto;
  width: 90%;
}
.block-story figure.tate img,
.block-story figure.yoko img{
  width: 100%;
}

@media screen and (max-width:767px) {

.block-story{
  margin-bottom: 30px;
}
.block-story.bg{
  padding-bottom: 30px; 
}
.block-story.bg-bottom-01,
.block-story.bg-bottom-02,
.block-story.bg-bottom-03,
.block-story.bg-bottom-04{
  padding-bottom: 30px; 
}
.block-story.bg-bottom-01:before{
  border-width: 0 0 70px 100vw ;
}
.block-story.bg-bottom-02:before{
  border-width: 0 0 70px 100vw ;
}
.block-story.bg-bottom-03:before{
  border-width: 70px 0 0  100vw ;
}
.block-story.bg-bottom-04:before{
  border-width: 70px 0 0 100vw ;
}
.block-story h2{
  font-size: 2.2rem;
  margin-bottom: 20px;
  text-align: left;
}
.block-story figure.tate{
  float: none;
  margin: 0 auto 20px;
  width: 70%;
}


}