@charset "UTF-8";

* {
  margin:0;
  padding:0;
  box-sizing:border-box;
}
a {
  text-decoration:none;
  color:#fff;
}
a:hover,a:visited {
  color:#fff;
}

div#feed {
  width:1140px;
  height:297px;
  margin:0 auto;
  overflow:hidden;
}
ul.rssreadmain {
  list-style:none;
  margin:0 auto;
}
ul.rssreadmain li {
  width:calc(1140px/4);
  float:left;
}

div.imagebox {
position:relative;
  width:245px;
  height:245px;
  margin:0 auto;
  overflow:hidden;
}
div.dateAndTitle {
  position:relative;
  z-index:99;
  width:245px;
  height:51px;
  margin:0 auto;
  padding:3px 5px;
  background:rgba(0,0,0,0.5);
  color:#fff;
  text-align:left;
  margin-top:-51px;
  margin-bottom:15px;
}
div.dateAndTitle p.blogDate {
  margin:0 0 5px 0;
  font-size:10px;
}
div.dateAndTitle p.blogTitle {
  margin:0;
  font-size:13px;
  line-height:120%;
  overflow:hidden;
}
p.blogShop {
  width:245px;
  height:37px;
  margin:0 auto;
  font-size:13px;
  line-height:43px;
  text-align:center;
  background-image:url("./images/balloon.png");
  margin-bottom:20px;
}

/* 要素にアニメーションを適用 */
ul.rssreadmain {
  animation-name:move;
  animation-duration:15s;
  animation-timing-function:ease;
  animation-iteration-count:infinite;
}

/* ▼アニメーション名「slidein」の動作内容 */
@keyframes  {
  0% {
    margin-left:0%;
  }
  20% {
    margin-left:-25%;
  }
  40% {
    margin-left:-50%;
  }
  60% {
    margin-left:-75%;
  }
  80% {
    margin-left:-100%;
  }
  100% {
    margin-left:0%;
  }
}
/*
div#feed {
  background:#aaa;
}
#feed ul.blogSlider {
  list-style:none;
  width:200px;
}
#feed ul.blogSlider li {
  width:247px;
  height:294px;
  background:#eee;
  margin-bottom:20px;
}
#feed ul.blogSlider li ul.items {
  list-style:none;
  height:auto;
}
#feed ul.blogSlider li ul.items li {
  height:auto;
  margin:0;
  color:#fff;
}
#feed ul.blogSlider li ul.items li:first-child {
  width:100%;
  height:20px;
  padding-top:6px;
  padding-left:5px;
  font-size:11px;
  background:#444;
  }
#feed ul.blogSlider li ul.items li:nth-child(2) {
  width:100%;
  height:50px;
  padding-top:6px;
  padding-left:5px;
  font-size:15px;
  line-height:120%;
  background:#444;
  }
#feed ul.blogSlider li ul.items li:nth-child(3) {
  width:100%;
  height:37px;
  font-size:11px;
  line-height:120%;
  background:#44f;
  }
*/