#cp_2507 #main{
  background: #c47cc0 url(../images/bg-pc.jpg) top center / cover no-repeat;
  padding-bottom: 160px;
}

/* =============================================
  mv (白背景ヘッダー：タイトル＋キャラ)
============================================= */
#cp_2507 #mv{
 position: relative;
 z-index: 3;
 background: #fff;
 padding-top: 40px;
 padding-bottom: 36px;
}
#cp_2507 #mv .mv_inner{
 width: 90%;
 max-width: 820px;
 margin-left: auto;
 margin-right: auto;
}
#cp_2507 #mv .mv_note{
 color: #4d4d4d;
 font-size: 1.3rem;
 font-weight: 500;
 text-align: center;
 letter-spacing: 0.02em;
 margin-top: 14px;
}
#cp_2507 #mv .mv_chara{
 position: absolute;
 bottom: 24px;
 z-index: 4;
}
#cp_2507 #mv .mv_chara--left{
 left: 5%;
 width: 16%;
 max-width: 230px;
}
#cp_2507 #mv .mv_chara--right{
 right: 5%;
 width: 14.5%;
 max-width: 210px;
}

/* =============================================
  present (グラデ背景：プレゼント内容)
============================================= */
#cp_2507 #present{
 position: relative;
 z-index: 1;
 padding-top: 70px;
}
#cp_2507 #present .present_inner{
 width: 90%;
 max-width: 1000px;
 margin-left: auto;
 margin-right: auto;
}
/* --- 来場者プレゼント --- */
#cp_2507 #present .present_main{
 position: relative;
 z-index: 1;
}
#cp_2507 #present .present_goods{
 width: 100%;
}
#cp_2507 #present .present_chara{
 position: absolute;
 z-index: 2;
}
#cp_2507 #present .present_chara--01{
 width: 15%;
 max-width: 150px;
 top: 7%;
 left: -4%;
}
#cp_2507 #present .present_chara--02{
 width: 17%;
 max-width: 170px;
 top: 28%;
 left: -6%;
}
#cp_2507 #present .present_chara--03{
 width: 14.5%;
 max-width: 145px;
 top: 9%;
 right: -6%;
}
#cp_2507 #present .present_chara--04{
 width: 16%;
 max-width: 160px;
 top: 33%;
 right: -4%;
}
/* --- 映画鑑賞券プレゼント --- */
#cp_2507 #present .present_movie{
 position: relative;
 z-index: 1;
 width: 100%;
 max-width: 1000px;
 margin-top: 36px;
 margin-left: auto;
 margin-right: auto;
}
#cp_2507 #present .present_movie-ticket{
 width: 100%;
}
#cp_2507 #present .present_chara--05{
 width: 16%;
 max-width: 160px;
 top: 4%;
 right: -8%;
}
/* --- 注釈 --- */
#cp_2507 #present .present_note{
 color: #fff;
 font-size: 1.2rem;
 font-weight: 500;
 letter-spacing: 0.02em;
 line-height: 1.5;
 margin-top: 1.6em;
 text-align: justify;
}
/* --- ポスター --- */
#cp_2507 #present .present_poster{
 width: 62%;
 max-width: 620px;
 margin: 60px auto 0;
}
#cp_2507 #present .present_poster a{
 display: block;
 transition: opacity 0.3s ease;
}
#cp_2507 #present .present_poster a:hover{
 opacity: 0.75;
}
/* =============================================
  btns
============================================= */
#cp_2507 .btns {
 background: #fff;
 padding: 9rem 0;
}
@media screen and (max-width: 956px) {
 #cp_2507 .btns {
   padding: 7.5rem 0;
 }
}
@media screen and (max-width: 450px) {
 #cp_2507 .btns {
   padding: 16.667vw 0;
 }
}
#cp_2507 .btns_inner {
 display: flex;
 justify-content: center;
 gap: 3rem;
 flex-wrap: wrap;
}
@media screen and (max-width: 956px) {
 #cp_2507 .btns_inner {
   gap: 3rem;
 }
}
@media screen and (max-width: 450px) {
 #cp_2507 .btns_inner {
   gap: 6.667vw;
   padding: 0 6.667vw;
 }
}
#cp_2507 .btns .btn {
 background: #e4007f;
 color: #fff;
 border: 0.3rem solid #e4007f;
 transition: color ease 0.3s, background-color ease 0.3s;
 height: 7.5rem;
 line-height: 7.5rem;
 width: 40rem;
 border-radius: 4rem;
 font-size: 2.5rem;
 font-weight: bold;
 box-shadow: 0px 0.5rem 0.3rem rgba(4, 0, 0, 0.3);
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 2.5rem;
}
#cp_2507 .btns .btn:hover {
 background: #fff;
 color: #e4007f;
}
@media screen and (max-width: 956px) {
 #cp_2507 .btns .btn {
     width: 49.5rem;
     height: 9.2rem;
     line-height: 9.2rem;
     border-radius: 5rem;
     font-size: 3rem;
 }
}
@media screen and (max-width: 450px) {
 #cp_2507 .btns .btn {
     height: 14.444vw;
     border-radius: 7.778vw;
     width: 100%;
     font-size: 5.333vw;
     gap: 3.333vw;
     box-sizing: content-box;
 }
}

#cp_2507 .btns .btn .arrow {
 width: 1.6rem;
 height: 1.6rem;
 border-right: 0.4rem solid #fff;
 border-top: 0.4rem solid #fff;
 transform: rotate(45deg);
 transition: border ease 0.3s;
}
#cp_2507 .btns .btn:hover .arrow {
 border-right: 0.4rem solid #e4007f;
 border-top: 0.4rem solid #e4007f;
}
@media screen and (max-width: 956px) {
 #cp_2507 .btns .btn .arrow {
     width: 2rem;
     height: 2rem;
     border-right: 0.5rem solid #fff;
     border-top: 0.5rem solid #fff;
 }
}
@media screen and (max-width: 450px) {
 #cp_2507 .btns .btn .arrow {
     width: 2.667vw;
     height: 2.667vw;
     border-top: 0.778vw solid #fff;
     border-right: 0.778vw solid #fff;
 }
}




#cp_2507 .ntp_logo{
 display: block;
 max-width: 26.5rem;
 margin-left: auto;
 margin-right: auto;
 padding-bottom: 12rem;
}
@media only screen and (max-width: 956px) {
 #cp_2507 .ntp_logo{
  padding-bottom: 14rem;
 }
}
@media screen and (max-width: 450px) {
 #cp_2507 .ntp_logo {
     padding-bottom: 31.111vw;
 }
}




/* =============================================
  responsive (SP)
============================================= */
@media only screen and (max-width: 750px) {
 #cp_2507 #main{
  background: #c47cc0 url(../images/bg-sp.jpg) top center / cover no-repeat;
  padding-bottom: 18vw;
 }

 /* --- mv --- */
 #cp_2507 #mv{
  padding-top: 7.46vw;
  padding-bottom: 8vw;
 }
 #cp_2507 #mv .mv_inner{
  width: 88%;
  max-width: none;
 }
 #cp_2507 #mv .mv_note{
  font-size: 2.66vw;
  margin-top: 2.4vw;
 }
 #cp_2507 #mv .mv_chara{
  bottom: -4vw;
 }
 #cp_2507 #mv .mv_chara--left{
  left: 2%;
  width: 23vw;
  max-width: none;
 }
 #cp_2507 #mv .mv_chara--right{
  right: 2%;
  width: 21vw;
  max-width: none;
 }

 /* --- present --- */
 #cp_2507 #present{
  padding-top: 12vw;
 }
 #cp_2507 #present .present_inner{
  width: 92%;
  max-width: none;
 }
 #cp_2507 #present .present_chara{
  max-width: none;
 }
 /* chara-01〜04 はSPでは非表示 */
 #cp_2507 #present .present_chara--01,
 #cp_2507 #present .present_chara--02,
 #cp_2507 #present .present_chara--03,
 #cp_2507 #present .present_chara--04{
  display: none;
 }
 #cp_2507 #present .present_movie{
  width: 100%;
  max-width: none;
  margin-top: 11vw;
 }
 #cp_2507 #present .present_chara--05{
  width: 24vw;
  top: auto;
  right: auto;
  bottom: -6%;
  left: -4%;
 }
 #cp_2507 #present .present_note{
  font-size: 3vw;
  margin-top: 2em;
 }
 #cp_2507 #present .present_poster{
  width: 90%;
  max-width: none;
  margin-top: 12vw;
 }
}


