/*========================
	title
========================== */


#title {
  background: url(../img/common/bg_title.jpg) no-repeat top center;
  background-size: contain;
  /* border: #f00 thin solid; */
}

#title .inside {
  width: 100%;
  /* min-height: 50vh; */
  min-height: 46vh;
  padding-top: 60px;
  /* padding-left: 15px;
  padding-right: 15px; */
  /* border: #f00 thin solid; */
}


/* #title.wakeari .inside {
  background: url(../img/wakeari/bg_h2_mob.jpg) bottom center no-repeat;
  background-size: contain;
} */

#title.special .inside {
  background: none;
}


/* #title.event .inside {
  background: url(../img/event/bg_h2_mob.jpg) bottom right no-repeat;
  background-size: contain;
} */

#title.acce .inside {
  background: url(../img/acce/bg_h2_mob.jpg) bottom right no-repeat;
  background-size: contain;
}



#title .logo-min {
  width: 55%;
  margin-bottom: 10px;
}


#title h1 {
  font-size: 36px;
}

#title.event h1 {
  font-size: 30px;
  /* border: #f00 thin solid; */
}


@media screen and (min-width: 768px) {


  #title .inside {
    min-height: 70vh;
  }

}


@media screen and (min-width: 900px) {

  #title {
    background: url(../img/common/bg_title_pc.jpg) no-repeat top center;
    background-size: cover;
    /* border: #f00 thin solid; */
  }

  #title .inside {
    width: 95%;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    min-height: 36vh;
    display: flex;
    align-items: center;
    /* border: #f00 thin solid; */
  }


  #title .logo-min {
    width: auto;
    max-width: 300px;
  }

  #title h1 {
    font-size: 52px;
    font-family: "M PLUS 1p", sans-serif;
    font-weight: 700;
    font-style: normal;
  }

  #title.event h1 {
    font-size: 52px;
    /* border: #f00 thin solid; */
  }

  #title .lead {
    /* background: linear-gradient(to right, #fff 0, #fff 50%, transparent 100%); */
    /* border: #f00 thin solid; */
  }

  /* individuals */


  #title .lead {
    padding: 15px 100px 15px 0;
    /* background: linear-gradient(to right, #fff 0, #fff 70%, transparent 100%); */
    background: linear-gradient(to right,
        rgba(255, 255, 255, 0.8) 0%,
        rgba(255, 255, 255, 0.8) 70%,
        rgba(255, 255, 255, 0) 100%);

  }


  #title .inside .mv-mob {
    display: none;
  }

  #title.wakeari .inside {
    background: url(../img/wakeari/bg_h2_pc.png) bottom right no-repeat;
    background-size: cover;
  }

  #title.special .inside {
    background: url(../img/bass/bg_h2_pc.png) bottom right no-repeat;
    background-size: cover;
  }



  #title.event .inside {
    background: url(../img/event/bg_h2_pc.png) top right no-repeat;
    background-size: 60%;
  }


  #title.acce .inside {
    background: url(../img/acce/bg_h2_pc.png) bottom right no-repeat;
    background-size: cover;
  }

}




@media screen and (min-width: 900px) {

  #title.event .inside {
    background: url(../img/event/bg_h2_pc.png) top right no-repeat;
    background-size: 50%;
    /* border: #f00 10px solid; */
  }


}



@media screen and (min-width: 1478px) {

  #title.event .inside {
    background: url(../img/event/bg_h2_pc.png) top right no-repeat;
    background-size: contain;
  }

}






@media screen and (min-width: 1000px) {


  #title .inside {
    width: 95%;
  }


}



@media screen and (min-width: 1280px) {

  #title.wakeari .inside {
    background: url(../img/wakeari/bg_h2_pc.png) bottom right no-repeat;
  }

}

/*========================
	contents
========================== */

#contents.sub {
  background-color: #00356f;
}