@charset "utf-8";
/*ユーザーエージェント出し分け用*/
.iphone .android_show, .iphone .pc_show {display:none;}
.android .iphone_show, .android .pc_show {display:none;}
.pc .iphone_show, .pc .android_show {display:none;}
.pc .visible .iphone_show, .pc .visible .android_show {display:block;}

.objects {
 display: none !important;
}
.mt-10em{margin-top: -10em;}
.t-center{text-align: center;}
.fs_s{font-size: 0.8em;}
.fs_ss{font-size: 0.5em;}
/* ==========================================================================
流用パーツ
========================================================================== */
.totop a {
	display: block;
	position: absolute;
	left: 20px;
	bottom: 160px;
	background-image: url(../images/totop.png);
	background-size: 100% 100%;
	width: calc(30px / 2);
	height: calc(330px / 2);
	text-indent: -9999px;
	overflow: hidden;
}
.contents.main {
   font-size: 16px;
}
.fv {
 padding-top: 40px;
}
.fv_im {
 padding: 10px;
 background: linear-gradient(to right, #ee6eb9 0%, #b86eda 100%);
 border-radius: 15px;
 overflow: hidden;
}
h1.fv_im  {
 width: 90%;
 max-width: 1000px;
}
.top_title {
 margin: 30px 0;
 font-size: 32px;
 text-align: center;
 font-weight: bold;
 line-height: 120%;
 color: #fff;
 text-shadow: 0 0 10px #ff4cc6,0 0 15px #ff4cc6;
}
span.small_tx {
	font-size: 70%;line-height: 1.5em;
    display: inline-block;
    margin-top: 1em;
}
.top_img {
	width: 90%;
	margin: 20px auto;
}
.w70 {
	width: 70%;
	margin: auto;
}
.pt0 {
	padding-top: 0!important;
}
.border0 {
	border-bottom: 0!important;
}
.inner_wrap {
	padding: 30px 0;
}
.tac {
	text-align: center;
}
small {
	font-size: 80%;
}
.big {
	font-size: 125%;
	font-weight: 700;
}
/* ==========================================================================
特報
========================================================================== */
h3 {
	text-align: center;
}
h3 img {
	max-width: 600px;
	width: 90%;
}
.bignews_ttl {
	text-align: center;
	font-size: 24px;
	font-weight: 600;
}
.yellow {
	color: #FFDD47;
	font-weight: 700;
}
.pink {
	color: #ff4cc6;
}
.campaign_info {
	line-height: 160%;
	text-align: center;
	padding: 60px 0;
	border-bottom: 1px solid #fff;
}
.bignews_tx {
	padding: 20px 0;
	text-align: center;
	font-size: 16px;
	
}
.more_tx a,.list li a {
	color: #ff4cc6;
	font-weight: normal;
}
.more_tx {
	font-size: 18px;
	text-align: center;
	font-weight: 700;
	padding: 20px 0;
	line-height: 160%;
}
.list {
	width: 80%;
	margin: 15px auto;
	
}
.list li {
	font-size: 15px;
	margin: 5px 0;
}
.indent {
	text-indent: -5em;
	padding-left: 5em;
}
.list .list_ttl {
	font-size: 18px;
	font-weight: bold;
}
.ttl_band {
	background:linear-gradient(90deg,rgba(92, 88, 166, 1) 0%, rgba(143, 46, 158, 1) 35%, rgba(199, 40, 146, 1) 100%);
	text-align: center;
	font-weight: 700;
	font-size: 20px;
	padding: 10px 0;
	margin:0 auto 20px;
	line-height: 1.5;
}
.cost {
	font-size: 24px;
	font-weight: 700;
}
/* ==========================================================================
メゾット
========================================================================== */
section#new-method {
    background: #e8e8e8;
    padding: 40px 0 80px;
}
section#new-method .method_title {
    font-size: 40px;
    font-weight: bold;
    border-bottom: solid 2px #ec0140;
    text-align: center;
    margin-bottom: 45px;
    padding-bottom: 5px;
    color: #000;
    line-height: 110%;
}
section#new-method .premium {
    width: 38%;
    margin: 50px auto 40px;
}
section#method {
 display: none!important;
}
.home {
 position: fixed;
 z-index: 10;
 top: 20px;
 left: 25px;
 width: 150px;
}
/* ==========================================================================
anchor
========================================================================== */
.top_anchor {
	display: flex;
	max-width: 1000px;
	margin: 30px auto;
	justify-content: space-between;
}
.anchor_box {
	width: 19%;
	text-align: center;
	border: 1px solid #fff;
	border-bottom: 10px solid #5851E0;
	position: relative;
	align-content: center;
}
.anchor_box.overview {
	border-bottom: 10px solid #DE00DA;
}
.anchor_box.campaign {
	border-bottom: 10px solid #ffcc00;
}
.anchor_box.related {
	border-bottom: 10px solid #FF2194;
}
.anchor_box.docomo {
	border-bottom: 10px solid #CC3341;
}
.anchor_box a {
	display: block;
	text-decoration: none;
	color: #fff;
	padding: 15px 0 25px	;
	
}
.anchor_box a::after{
    content: "";
    width: 10px;
    height: 10px;
    border: 2px solid;
    border-color:transparent  #fff #fff transparent;
    transform: translateX(-50%) rotate(45deg);
    position: absolute;
    top: inherit;
    bottom: 10px;
		left: 50%;
}
/* ==========================================================================
btn
========================================================================== */
.btn a {
   margin: 20px auto 0;
   display: block;
 background: linear-gradient(to right, #ffbb2c 0%, #ff0576 100%);
   color: #fff;
   font-size: 20px;
   text-align: center;
   width: 80%;
   max-width: 500px;
   padding: 18px 0;
   display: flex;
   align-items: center;
   justify-content: center;
   text-decoration: none;
   border-radius: 100px;
   box-sizing: border-box;
 font-weight: bold;
 line-height: 1.2;
}
.btn a:hover {
  opacity: 0.8;
  transition: all 0.2s ease-in;
}
.btn.pink_grade a {
	background:linear-gradient(90deg,rgba(92, 88, 166, 1) 0%, rgba(143, 46, 158, 1) 35%, rgba(199, 40, 146, 1) 100%);
}
.campaign .cp_view .btn a {
 width: 100%;
   background-color: #fff;
   color: #151515;
}
.btn.movie_btn a {
  margin-top: 0;
  font-size: 16px;
  padding: 15px 0;
  width: 70%;
}
.btn.movie_btn a span {
   width: 15px;
   height: 15px;
   margin-left: 8px;
   margin-top: 0;
   line-height: 0;
}
.btn a span {
   display: block;
   background-image: url("../images/ic.webp");
   background-size: 100% 100%;
   width: 18px;
   height: 18px;
   margin-left: 8px;
   margin-top: 2px;
   line-height: 0;
}
.btn {
  text-align: center;
}
.btn span {
  font-size: 12px;
  margin: 0;
}
/* ==========================================================================
contents
========================================================================== */
#wrapper {
 background: #000;
 color: #4c4c4c;
 font-family: "Noto Sans JP", sans-serif;
}
.c_pink {
 color: #ff4cc6;
}
.campaign_inner {
 margin-top: 20px;
 padding: 2em 1.5em;
 border: 3px solid;
 box-shadow: 0 0 10px #ffe500,0 0 15px #ffe500;
 color: #fff;
}
.campaign_inner.p3em {
  padding: 3.5em;
}
.cp_title {
 margin-top: 50px;
 font-size: 40px;
 text-align: center;
 font-weight: bold;
 line-height: 80%;
 color: #fff;
 text-shadow: 0 0 10px #ffc000,0 0 15px #ff4cc6;
 padding-top: 10px;
}
.cp_title span {
 font-size: 60%;
 opacity: .5;
 
}
.contents_inner {
 max-width: 1000px;
 margin: auto;
 padding-bottom: 50px;
 width: 90%;
}
.flex {
 display: -webkit-flex;
 display: flex;
 justify-content: space-between;
 align-items: center; 
 margin-top: 30px;
}
.c_left {
 width: 47%;
}
.c_left img {
 border-radius: 5px;
 border: 1px solid #9a9a9a;
}
.c_right {
 width: 50%;
 text-align: center
}
.cp_text1 {
 font-weight: bold;
 font-size: 23px;
 color: #ffbb2c;
 background: linear-gradient(to right, #ffbb2c 0%, #ff0576 100%);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
}
.cp_text2 {
 font-size: 20px;
 line-height: 160%;
 font-weight: bold;
 ;
}
.cp_text3 {
 margin-top: 10px;
 font-size: 14px;
 text-align: left;
}
/*campaign_info {
 margin-top: 50px;
}*/
.campaign_info h3 {
 position: relative;
 font-size: 24px;
 margin: auto;
 padding-bottom: 15px;
 text-align: center;
 border-bottom: 5px dotted #ff4cc6;
 font-weight: bold;
 line-height:180% ;
}
.coming_soon {
  font-size: 25px;
  font-weight: bold;
  padding: 50px 0 20px;
  text-align: center;
}
.campaign_info .attention_list {
 padding: 2em;
 background: #483e4a;
 color: #fff;
 border-radius: 10px;
 font-size: 14px;
 text-align: left;
}
.campaign_info .attention_list li {
	padding: 2px 0;
	text-indent: -1em;
  margin-left: 1em;
}
/* ==========================================================================
関連作品  
========================================================================== */
.movies_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.movie {
  width: 48%;
  margin-right: 4%;
  text-align: center;
  position: relative;
	
}
.rental {
  background: linear-gradient(to right, #ee6eb9 0%, #b86eda 100%);
  position: absolute;
  top: -25px;
  left: 0;
  display: inline-block;
  padding: 0 5px;
}
.movie:nth-of-type(2n) {
  margin-right: 0;
}
.movie img {
  border: 1px solid #9a9a9a;
}
.movie_title {
  font-size: 16px;
  padding: 10px 0;
  font-weight: bold;
  line-height: 150%;
}
/* ==========================================================================
campaign
========================================================================== */
.campaign_info ul {
 margin-top: 30px;
 font-size: 17px;
}
.campaign_info ul >li:nth-of-type(n+2) {
 margin-top: 10px;
}
.campaign_info ul >li span {
 display: inline-block;
 border-radius: 5px;
 padding: 5px 10px 7px;
 background: linear-gradient(to right, #ee6eb9 0%, #b86eda 100%);
 color: #fff;
 font-weight: bold;
 line-height: 100%;
}
.tokuten_scroll {
 margin-top: 50px;
    padding: 2em;
    background: #483e4a;
 color: #fff;
 border-radius: 10px;
}
.tokuten_scroll .inn {
    padding-right: 2em;
    height: 230px;
    overflow-y: scroll;
    text-align: left;
}

.tokuten_scroll .inn .inn_box {
    margin-bottom: 2em;
}

.tokuten_scroll .inn .inn_box > ul > li {
    text-indent: -1em;
    margin-left: 1em;
    margin-bottom: 0.3em;
}

/*----------------------------
追従
----------------------------*/
.lp_cta_fixed.is-fixed {
  padding: .5em;
  text-align: center;
  width: 100%;
  background-color:rgba(21,21,21,0.7);
  position: fixed;
  bottom: 0;
  left: 0;
  font-weight: 700;
	display: block;
  }
	.lp_cta_fixed .cp_bnr a{
		margin: 10px auto;
	}
/* ==========================================================================
SP
========================================================================== */

@media print,
screen and (min-width: 813px) {
}



@media only screen and (max-width: 812px) {
section#new-method {
        padding: 30px 0;
    }
section#new-method .method_title {
        font-size: 20px;
        margin-bottom: 25px;
    }
section#new-method .premium {
        width: 60%;
        margin: 30px auto;
    }
 .home {
  width: 100px;
  left: 15px;
  top: 15px;
 }
 .fv {
    padding-top: 50px;
}
 h1.fv_im {
  margin: auto;
 }
 .top_title {
 margin: 0 0 20px;
 font-size: 22px;
}
.btn a {
  width: 100%;
  padding: 20px;
  font-size: 18px;
}
.btn a span {
  display: none;
}
.top_img {
	width: 100%;
	margin: 20px 0 10px;
}
.top_img img.w70 {
	width: 100%;
}
.bignews_ttl {
	font-size: 16px;
	
}
.bignews_tx {
	padding: 15px 0;
	font-size: 14px;
}
.more_tx {
	font-size: 16px;
	font-weight: 600;
	padding: 10px 0;
}
.list {
	width: 100%;
	margin: 25px auto;
}
.list li {
	font-size: 15px;
	margin: 5px 0;
}
.indent {
	text-indent: -5em;
	padding-left: 5em;
}
.list .list_ttl {
	font-size: 16px;
	text-align: center;
}
.more_tx a,.list li a {
	font-size: 12px;
}
span.small_tx {
	font-size: 80%;
}
.ttl_band {
	font-size: 18px;
	padding: 10px 0;
	width: 100%;
}
.inner_wrap {
	padding: 15px 0;
}
.inner_wrap .btn.pink_grade a {
	font-size: 16px;
	letter-spacing: 0;
	line-height: 1.2;
}
/* ==========================================================================
anchor
========================================================================== */
.top_anchor {
	margin: 50px auto 0;
	width: 95%;
	flex-wrap: wrap;
}
.anchor_box {
	width: 48%;
	margin-right: 2%;
	
}
.anchor_box:nth-of-type(2n) {
	margin-right: 0;
	
}
.anchor_box:nth-of-type(n+3) {
	margin-top: 4%;
	
}
.anchor_box a {
	padding: 10px 0 20px	;
}
.anchor_box a::after{
    content: "";
    width: 5px;
    height: 5px;
    bottom: 10px;
		left: 50%;
}
/* ==========================================================================
contents
========================================================================== */
#news.contents_inner {
	margin-top: 30px;
}
.contents_inner {
  margin-top: 60px;
  padding-bottom: 0;
}
.contents_inner:last-of-type {
  padding-bottom: 60px;
}
 .cp_title {
  margin-top: 0;
  font-size:  min(7vw,25px);
 }
 .campaign_inner {
  margin-top: 10px;
  border-radius: 7px;
  padding: 15px 10px;
 }
 .flex {
  -webkit-flex-direction: column;
  flex-direction: column;
 }
 .c_left,.c_right {
  width: 100%;
 }
 .c_right {
  margin-top: 10px;
  text-align: center;
 }
 .cp_text1 {
  font-size: min(4.5vw,23px);
 }
 
 .cp_text2 {
  font-size:18px;
 }
 .cp_text3 {
  margin-top: 10px;
  font-size:min(3.5vw,16px);
 }
 .campaign_info h3 {
  padding-bottom: 7px;
  font-size:min(4.3vw,20px);
 }
 .coming_soon {
  font-size: 20px;
  padding: 20px 0 10px;
  line-height: 150%;
}
.campaign_info .attention_list {
 padding: 1em;
 font-size: 12px;
}
.campaign_info .attention_list li {
	padding:0;
	line-height: 1.2;
}
 /* ==========================================================================
関連作品  
========================================================================== */
.campaign_inner.p3em {
  padding: 15px 10px;
}
.movie {
  width: 49%;
  margin-right: 2%;
	margin-top: 20px;
}
.movie_title {
  font-size: 12px;
  padding: 10px 0;
  line-height: 150%;
}
.movie_title span {
  font-size: 9px;
  font-weight: normal;
}
.btn.movie_btn a {
  margin-top: 0;
  font-size: 14px;
  padding: 15px 0;
  width: 100%;
}
 /* ==========================================================================
campaign
========================================================================== */
.campaign_info {
	line-height: 160%;
	text-align: center;
	padding: 30px 0;
	border-bottom: 1px solid #fff;
}
 .campaign_info ul {
  margin-top: 15px;
  font-size:min(3.3vw,14px);
 }
 .tokuten_scroll {
  margin-top: 30px;
  padding: 2em 1em;
  font-size: 11px;
 }
 .tokuten_scroll .inn {
  padding-right: .5em;
 }
 /*----------------------------------------------------------------
追従
----------------------------------------------------------------*/
.lp_cta_fixed .point_cp {
  font-size: 12px;
  padding-bottom: 5px;
}
}

.cp_bnr a {
	display: block;
	max-width: 800px;
	margin: 50px auto;
	border: 2px solid #ff4cc6;
	width: 90%;
}
.cp_bnr-2 a {
	max-width: 700px;
	margin: 20px auto 80px;
	width: 90%;
}
@media only screen and (max-width: 812px) {
	.cp_bnr a {
		margin: 30px auto 0;
	}
	.lp_cta_fixed .cp_bnr a{
		margin: 5px auto;
	}
}

.btn_row {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
}
.btn_row .btn {
	width: 40%;
}
.btn_row .btn a, .btn_first .btn a {
	width: 100%;
	font-size: 17px;
}
@media only screen and (max-width: 812px) {
	.btn_row {
		flex-direction: column;
	}
	.btn_row .btn {
		width: 100%;
	}
	.btn_first .btn a {
		line-height: 1.4;
	}
}
.cp_img {
	width: 100%;
	max-width: 600px;
	margin: 20px auto;
}
.cp_img img {
	width: 100%;
	height: auto;
}