#container {
  width: 100%;
  margin: 0 auto;
  position: relative;
  overflow: hidden; /*追加*/
}
.item {
  width: 250px;
  padding: 0px;
  border: 0px solid #eee;
}
 
/*追加　これがないとフィルタした場合に背後に別の画像が表示される*/
.item.inactive {
  visibility: hidden;
  opacity: 0;
}
 
.item img {
  width: 100%;
}
.item p {
  text-align: center;
  margin: 5px auto;
  font-size: 12px;
  color: #999999;
}
 
.wookmark-placeholder {
  background-color: #FFFFFF;
}
 
/**
 * Grid items animation
 */
.item {
  -webkit-transition: all 0.3s ease-out;
     -moz-transition: all 0.3s ease-out;
       -o-transition: all 0.3s ease-out;
          transition: all 0.3s ease-out;
}
 
.wookmark-placeholder {
  -webkit-transition: all 0.3s ease-out;
     -moz-transition: all 0.3s ease-out;
       -o-transition: all 0.3s ease-out;
          transition: all 0.3s ease-out;
}
 
/* フィルターリスト */
 
#filters {
  list-style-type: none;
  text-align: center;
  margin: 0 5% 20px 5%;
}
 
#filters li {
  font-size: 12px;
  float: left;
  padding: 6px 0 4px 0;
  cursor: pointer;
  margin: 0 1% 0 1%;
  width: 10%;
  -webkit-transition: all 0.15s ease-out;
     -moz-transition: all 0.15s ease-out;
       -o-transition: all 0.15s ease-out;
          transition: all 0.15s ease-out;
  -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
          border-radius: 3px;
}
 
#filters li:hover {
  background: #4281f5;
  color: #ffffff;
}
 
#filters li.active {
  background: #4281f5;
  color: #ffffff;
}

.misa-wrapper
{
     margin-right: 4rem;
    margin-left: 4rem;
}
.profile
{
    margin-top: 4.5rem;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    width: 100%;
}
.misa-wrapper img
{
    margin-right:5.612vw;
    margin-left: 1.5rem;
    width: 22.448vw;
    height: 100%;
    /*height: 22.448vw;*/
}
.profile .text p
{
    margin: 0;
    margin-bottom: 1.4rem;
    font-size: 14px;
}
.profile .text p:last-child
{
    margin-top:3rem;
}
.work-wrapper
{
    margin-right: 4rem;
    margin-left: 4rem;
    height: auto;
}
.category
{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content:space-around;
    flex-wrap:wrap;
}
.category p
{
    border:1px solid #707070;
    text-align: center;
    font-size: 12px;
    width: 135px;
    height: 24px;
    line-height: 24px;
}
.category p.active{
    background: #CFF;
}
.grid-img
{
    display: grid;
    grid-template-rows:auto auto auto auto auto auto auto;
    grid-template-columns:32% 32% 1fr;
    grid-gap:1.836vw 1.836vw;
    width: 100%;
    height: auto;

}
.grid-img a{
    overflow: hidden;
}
/*.work-wrapper img
{
    width: 100%;
    height: auto;
}*/
.item-1
{
    grid-row:1/3;
    grid-column:1/2;
}
.item-2
{
    grid-row:1/2;
    grid-column:2/3;
}
.item-3
{
    grid-row:2/3;
    grid-column:2/3;
}
.item-4
{
    grid-row:1/3;
    grid-column:3/4;
}
.item-5
{
    grid-row:3/4;
    grid-column:1/2;
}
.item-6
{
    grid-row:3/4;
    grid-column:2/4;
}
.item-7
{
    grid-row:4/6;
    grid-column:1/2;
}
.item-8
{
    grid-row:4/5;
    grid-column:2/3;
}
.item-9
{
    grid-row:5/7;
    grid-column:2/3;
}
.item-10
{
    grid-row:4/6;
    grid-column:3/4;
}
.item-11
{
    grid-row:6/7;
    grid-column:1/2;
}
.item-12
{
    grid-row:7/8;
    grid-column:1/2;
}
.item-13
{
    grid-row:6/8;
    grid-column:3/4;
}
@media screen and (max-width:980px)
{
 .grid-img
 {
    grid-gap:1fr 1% !important;
    grid-template-columns:32.5% 32.5% 33%;
    margin: 0;
    width: 100%;
 }  

}
@media screen and (max-width:560px)
{
    .profile
    {
        margin-top: 4.5rem;
        display: block;
        width: 100%;
    }
    .misa-wrapper
    {
        margin: 0;
        width: 100%;
    }
      .profile
    {
        display: block;
    }
    img {
      width: 100%;
    }
   .grid-img
    {
        width: 98%;
    }
    .work-wrapper
    {
        margin: 0;
        width: 100%;
    }
    .contact-wrapper
    {
        margin-right: 0;
        margin-left: 0;
    }
    .footer-list
    {
        width: 90%;
    }
   
    .header-list
    {
        display: none;
    }
    .show-icon
    {
        display: block;
    }

}