body{
    position: relative;
    top:0;
    left:0;
    bottom:0;
    right:0;
    text-align: center;
    overflow:hidden;
}
.main {
  position:relative; 
    width:10rem;
    height:17.734375rem;
    margin:0 auto;
    background: url(../img-m/bg.png)no-repeat center center;
    background-size: cover;
 }

.logo{
    width:0.921875rem;
    height:0.75rem;
    position: absolute;
    top:0.4375rem;
    left:0.25rem;
}
.logo img{
    width:0.921875rem;
    height:0.75rem;
}
h1 {
  position:absolute;
  width:7.828125rem;
  height:0.8125rem;
  left:50%;
  top:1.6875rem;
  transform: translateX(-50%);
  background: url(../img-m/title.png) no-repeat center center; 
  background-size: 100%
}
.cp-list{
  position:absolute;
  top:2.96875rem;
  padding:0.5rem 0.0rem 0.0rem;
  display: -webkit-flex;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: stretch;
    width: 100%;
    box-sizing: border-box;
}
.cp-list li{
  width:24%;
  height:2.140625rem;
  margin-bottom: 0.46875rem;
  background: url(../img/item-bg-m.png) no-repeat center center;
  background-size: 100%;
  overflow: hidden;
}
.cp-list li:nth-child(3n){
  margin-right:0px;
}
.cp-list li a{
  text-decoration: none;
  font-size:0.375rem;
  line-height:1.2;
  color:#ffffff;
  width:100%;
  height:2.140625rem;
  box-sizing:border-box;
  display: block;
  position:relative;
}
.cp-list li a span{
  position:absolute;
  top:50%;
  left:50%;
  width:100%;
  transform: translate(-50%,-50%);
}