@charset "utf-8";
/* CSS Document */

#mmi-container .cp-container{
  font-family: noto;
}
#mmi-container .cp-container .contents header h1{
  margin-bottom:1em;
}
#mmi-container .cp-container section{
  text-align: center;
  padding-bottom:20px;
}

#mmi-container .cp-container #logo {
  margin-bottom:0;
  
}

#mmi-container .cp-container #intro{
  border-bottom:solid 1px #CAC5C6;
}


#mmi-container .cp-container section h2 span{
  color:#f62938;
  font-size:26px;
  display:inline-block;
  margin-bottom:0.5em;
}

#mmi-container .cp-container section p{
  text-align: left;
}

#mmi-container .cp-container section figure{
  margin:1em auto 1.5em auto;
}

#mmi-container .cp-container section h4{
  font-size:24px;
  margin-bottom:1em;
  span{
    font-size:0.8em;
  }
}
#mmi-container .cp-container section .accordion{
  text-align: left;
  font-size:15px;
  background-color:#fbf7f4;
  padding:1em;
  box-sizing: border-box;
  width:95%;
  margin:0 auto 2em;
  display:none;
}

#mmi-container .cp-container section .btn a{
  font-size:16px;
  color:#f62837;
  display:inline-block;
  border:solid 1px;
  border-radius: 3em;
  padding:0.5em 0em;
  position:relative;
  transition-duration: 0.3s;
  width:15em;
}
#mmi-container .cp-container section .btn a:hover{
  opacity:0.7;
  text-decoration: none;
}
#mmi-container .cp-container section .btn a:after{
  content: "";
  vertical-align: middle;
  position: absolute;
  top: 50%;
  margin-top: -0.4em;
  right: 1em;
  width: 0.4em;
  height: 0.4em;
  border-top: 0.15em solid #EB0100;
  border-right: 0.15em solid #EB0100;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}
#mmi-container .cp-container section .btn a.close:after{
  display:none;
}
#mmi-container .cp-container section .btn a.link:after{
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  margin-top: -0.2em;
}

#mmi-container .cp-container section .slogan{
  margin:2em 0;
}
#mmi-container .cp-container section .flex{
  display:flex;
  justify-content: space-between;
  padding-top:1em;
  > div{
    width:60%;
    padding: 3.5em 0 0 3em;
    h3{
      text-align:left;
  font-size:24px;
  margin-bottom:1em;
      
    }
  }
}

#mmi-container .cp-container #member{
  background:#FAF5EF;
  padding:4em 0 0 0;
}

#mmi-container .cp-container #member h2{
  font-size:26px;
  color:#0A3066;
  border-bottom: none;
}

#mmi-container .cp-container #member h2 span{
  font-size:20px;
  color:#0A3066;
  background:url("../brand/img/ttl_line.png") center bottom no-repeat;
  padding:0.5em;
}

#mmi-container .cp-container #member h2 +p{
text-align:center;
    padding: 1em 0 0 0;  
}

#mmi-container .cp-container #member .slider{
  background:#0F9ED5;
  position:relative;
}

#mmi-container .cp-container #member .slider:before{
  content:'';
  width:100%;
  height:131px;
  background:url("../brand/img/member_bg_top.png") center top no-repeat;
  position:absolute;
  top:0;
  left:0;
  z-index:10;
}

#mmi-container .cp-container #member .slider:after{
  content:'';
  width:100%;
  height:131px;
  background:url("../brand/img/member_bg_bottom.png") center bottom no-repeat;
  position:absolute;
  bottom:0;
  left:0;
  z-index:10;
}


#mmi-container .cp-container #member .slider {
    padding: 7em 0;
}

#mmi-container .cp-container #member .swiper-wrapper {
    transition-timing-function: cubic-bezier(0.25, 1, 0.5, 1) !important;
    padding: 0px;
    margin: 0px;
}
/*#member .swiper-button-next::after,
#member .swiper-button-prev::after {
  content: ""; 
}

#member .swiper-button-next {
  background-image: url('../brand/img/arrow-next.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right;
width: 30px;
    height: 60px;
    margin-top: -1.5rem;
    right: 0;
}

#member .swiper-button-prev {
  background-image: url('../brand/img/arrow-prev.png'); 
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left;
  width: 30px; 
  height: 60px;
  margin-top: -1.5rem;
  left: 0;
}*/


/*#mmi-container .cp-container #member .swiper3{margin:20px auto;}*/

#mmi-container .cp-container #member .swiper-wrapper .swiper-slide {
width:254px;
}

#mmi-container .cp-container #member .swiper-wrapper .swiper-slide img{
width:100%;
}

#mmi-container .cp-container #member .swiper-wrapper .swiper-slide{
/*border-radius: 3%;*/
  line-height: 0;
  overflow: hidden;
}

#mmi-container .cp-container #movie h2 +p{
    padding: 2em 0;  
}

#mmi-container .cp-container #download {
display:flex; 
  width:100%;
  margin-top:-80px;
}

#mmi-container .cp-container #download div {
 width:44%;  
  text-align:center;
  margin:0 2em;
}

#mmi-container .cp-container #download div h2{
padding-bottom:1em;
display:block;
}

#mmi-container .cp-container #download div picture{
display:block;
}


#mmi-container .cp-container #download div p{
text-align:center;
}


#mmi-container .cp-container #download div img{
 width:50%; 
  border:solid 1px #ddd;
}


@media screen and (max-width:767px){
  
  
  
  #mmi-container .cp-container section {
    margin-bottom:5vw!important;
    margin-left:-4vw;
    margin-right:-4vw;
    padding-left:4vw;
    padding-right:4vw;
    box-sizing: border-box;
  }
  
#mmi-container .cp-container section h2 span{
        font-size:5vw;
        line-height: 1.4;
    }

#mmi-container .cp-container #member h2 {
    font-size: 6.5vw;
}   
  
#mmi-container .cp-container #member .swiper-wrapper .swiper-slide {
width:80%;
}  
  
  #mmi-container .cp-container section .flex > div h3 {
    font-size: 5vw; 
    text-align:center;
  }
    .btn{
      a{
        font-size:3.8vw;
      }
    }
    .slogan{
      padding:0 5vw;
    }
  
  #mmi-container .cp-container #download {
display:block; 
  width:100%;
  margin: 0 ;
  padding:0;
}

#mmi-container .cp-container #download div{
  width:100%;
  margin: 0 auto 3.5em auto;
}

  
#mmi-container .cp-container #download h2{
font-size:18px;
}
  
#mmi-container .cp-container section .flex{
      display:block;
      width:100%;
      margin:0 auto;
      > div{
        width:100%;
        padding: 0 0 0 0;
        &:first-child{
          border-top:none;
          padding-bottom:5vw;
        }
        }
      }
    }

  }