@charset "UTF-8";

#main {
  background-image: url(../staff_cast/img/bg-staff_sp.jpg);
}

.news-list_inner {
   display: flex;
   justify-content: center;
   flex-wrap: wrap;

}


.thumb {
   box-sizing: border-box;
   border:solid 5px #641b0b;
   width: 100%;
   height: 120px;
   object-fit: cover;
   background-color: #fff;
}
.news-list_inner .list-item {
   width: 42%;
   margin: 2%;
   position: relative;
      margin-bottom: 10%;
}

.news-list_inner .list-item a{
   color: #fff;
   line-height: 1.6em;
}
.back_idx a {
   color: #fff;
}
#pager {
   color: #fff;
   text-align: center;
}

.icn_new {
   position: absolute;
   width: 60px;
   top:-40px;
   left: -20px;
   display: block;
}




.special_list {
}

.special_list .thumb_special {
   text-align: center;
   margin-bottom: 20px;
}
.special_list .thumb_special img {
   width: 80%;
}
.special_list .thumb_special a,
.special_list .thumb_countdown a {
   color: #fff;
}



.cast_name {
   display: flex;
   align-items: center;
   font-weight: bold;
   font-size: 1.2em;
   margin-bottom: 10px;
}
.cast_name .chara_icn {
   width: 80px;
   margin-right: 10px;
}
.comment_text dt {
   line-height: 1.6em;
   margin-bottom: 10px;
}
.comment_text dd {
   color: #505050;
}

.cast_area {
   margin-bottom: 70px;
}
.special_list {
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
}
#movie .countdown_list .thumb_countdown a {
   font-size: 0.8em;
   line-height: 1.5em;
   display: block;
}


@media screen and (min-width:480px) {
   .news-list {
      width: 100%;
   }

   .thumb {
      height: 200px;
   }
}
.countdown_list {
	padding: 0 27px;
}

.thumb_countdown {
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
   text-align: center;
   line-height: 1.5em;
}
.special_list .thumb_countdown img {
	width: 140px;
}
@media screen and (min-width:960px) {
   #main {
     background-image: url(../staff_cast/img/bg-staff.jpg);
   }
   .news-list {
      width: 860px;
      margin: 0 auto;
      min-height: 800px;
      padding-top: 50px;
   }
   .thumb {
      border:solid 7px #641b0b;
      height: 180px;
   }
   .news-list_inner .list-item {
      width: 30%;
      margin: 1%;
      margin-bottom: 7%;
   }

   .special_list .thumb_special,
   .special_list .thumb_countdown{
      text-align: center;
      margin-bottom: 40px;
      margin-left: 15px;
      margin-right: 15px;
   }
   .special_list {
      width: 850px;
      margin: 0 auto;
   }
   .special_list .thumb_special img {
      width: 250px;
   }
	
	.special_list .thumb_countdown img {
      width: 180px;
   }
	.countdown_list {
		padding: 0;
      width: 800px;
      margin: 0 auto;
	}

}




/*  twitterアイコン   */
.twitter_icn_list {
   display: flex;
   flex-wrap: wrap;
   width: 100%;
   justify-content: center;
   padding-top: 40px;
}
.twitter_icn_list img {
   width: 120px;
   display: block;
   margin: 0 auto;
   margin-bottom: 10px;
}
.twitter_icn_list li {
   margin-bottom: 40px;
   margin-right: 10px;
}
.twitter_icn_list li .btn{
   width: 150px;
   margin: 0;
   font-size: 1em;
}

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

   .twitter_icn_list img {
      width: 150px;
   }
   .twitter_icn_list li .btn{
      width: 170px;
      height: 50px;
      line-height: 50px;
   }
.twitter_icn_list li {
   margin-bottom: 30px;
   margin-right: 30px;
}
}


/*  診断ゲーム   */

#shindan {
   color: #fff;
   text-align: center;
   padding: 0 15px;
}

#shindan .txt_area {
   margin-bottom: 30px;
}
.suisho_area {
   position: relative;
}
.suisho_area img {
   display: block;
   margin: 0 auto;
}

.suisho_area #hand {
   position: absolute;
   top:10px;
   left:50px;
}
.suisho_area #click {
   margin-bottom: -30px;
}

.suisho_area #suisho {
   width: 100%;
}

.btn_area a {
   display: block;
   margin: 0 auto;
   width: 90%;
}
.result {
   background-image: url(../special/img/shindan/bg-result.jpg);
   background-repeat: no-repeat;
   background-position: top center;
   -webkit-background-size: cover;
   background-size: cover;
   height: 100vh;
}
.ttl_result {
   width: 60%;
   margin: 0 auto;
}
.btn_area a.btn_back {
   width: 60%;
}
.btn_area a img {
   width: 100%;
}



@media screen and (min-width:960px) {
   #shindan {
      width: 860px;
      margin: 0 auto;
      padding: 0;
   }
   .suisho_area #hand {
      top:80px;
      left:210px;
   }

   .suisho_area #suisho {
      width: 517px;
   }

   .result .btn_area a img,
   .result .btn_area a {
      width: auto;
      margin: 0 auto;
   }
   .result .btn_area .btn_tweet {
      width: 511px;
   }
   .result .btn_area .btn_back {
      width: 337px;
   }


   #result_img img {
      width: 708px;
   }
}