main{
     width: 1180px;
    margin: 100px auto 120px;
}
main h2 {
     font-size: 2.8rem;
 color: #000;
 font-weight: normal;}

main .trimming-Wrap{
 position: relative;
}

section.Category{ 
 display: block;
 border-bottom: solid 1px #d0d5da;}

section.Category dt{
 color: #333;
 border-top: 1px solid #d0d5da;
 font-size: 1.6rem;
 line-height: 1.6rem;
display:block;
 position: relative;
 padding: 40px 0px 40px 20px;
cursor:pointer;
}
section.Category dt .btnStyle{
 display: inline-block;
 position: absolute;
 top: 0;
 right: 0;
 height: 100%;
 width: 100px;
 border-left: 1px solid #fff;
}
section.Category dt .btnStyle::before,
section.Category dt .btnStyle::after{
 content: '';
 display: inline-block;
 position: absolute;
 top: calc(50% - 1.5px);
 left: 40px;
 width: 20px;
 height: 3px;
 background-color: #d0d5da;
}
section.Category dt .btnStyle::after{
 transform: rotate(90deg);
 transition: transform 0.2s;
}
section.Category dd{
display:none;
 color: #333;
}
section.Category .open{
 display:block;
color: #333;}

section.Category dt.hover{ box-shadow: 0 10px 10px -4px rgba(0,0,0,0.1);}
section.Category dt.hover,
section.Category dt.on{ background-color: #f3f5f7;}
section.Category dt.on .btnStyle::after{ transform: rotate(180deg);}

main ul.group > li{
 border-top: 1px solid #e9ecee;
}
main ul.group > li:first-child{
 border-top: none;
}
main ul.group li{
 position: relative;
}
main ul.group li h3{
 font-size: 1.8rem;
 line-height: 1.8rem;
 margin: 40px 0 20px 0;
}
main ul.group li a .read{
 position: absolute;
 display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  color:#999;
  /*background: #FFF;*/
  font-size: 1.8rem;
  line-height: 1.8rem;
 opacity: 0;
 transition: all 0.3s;
 top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
 width:95%;
 height: 90%;
}
main ul.group li a:hover .read{
 opacity: 0.8;
  }
main ul.group li h4{
 text-align: center;
 font-size: 1.4rem;
 line-height: 2.0rem;
 margin-top: 15px;
}
main ul.group li a:hover h4{
 color: #E60012;
}
main ul.group li a:hover p{
 color: #555;
}
main ul.group li p{
 text-align: center;
 font-size: 1.2rem;
 line-height: 1.6rem;
 margin-top: 10px;
}
main ul.group li > p{
 margin-top: 0;
}
main ul.movieList{
 display: flex;
justify-content: space-between;
flex-wrap: wrap;
 margin-bottom: 20px;}
main ul.movieList:before{
    content:"";
    display:block;
    width: 265px;
    height:0;
    order:1;
  }
main ul.movieList:after{
    content:"";
    display:block;
    width: 265px;
    height:0;
  }

main ul.movieList li{
 width: 265px;
 margin-bottom: 60px;
}