img#logo {
  width: 118px;
  margin: 5px 0 5px 16px;
}
/*---------------
 アプリフィルター
---------------*/
/*サンプルボタン出し分け*/
.filter_sample_0{
  display:none;
}
.ios_fil_ng_text {
	padding:8px 0;
	text-align:center;
	font-size:12px;
	color:var(--text-body);
}
.ios_fil_ng_text a{
	display:inline;
	text-decoration: none;
}
/*---------------
 作品紹介枠
---------------*/
.bar {
  clear: both;
  margin-bottom: 4px;
  line-height: 160%;
  text-align: left;
  font-size: 12px;
  font-weight: bold;
}
.itemlist_prd_name{
	line-height: 1.7;
	color: #313f52;
	font-weight: bold;
	margin-right: 8px;
	font-size: 14px;
	vertical-align: middle;
	color: var(--text-body);
}
.itemlist_prd_name_wrap img{
  margin-bottom: 2px;
}
.itemlist_prd_name_wrap img, .set_percentage img {
	height: 16px;
	margin-right: 8px;
	vertical-align: middle;
	}
.itemlist_prd_cover_wrap {
  margin: 0 16px;
  float: left;
  overflow: hidden;
  box-sizing: border-box;
  width: auto;
}
.itemlist_prd_desc p{
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 10;
	overflow: hidden;
}
.itemlist_prd_cover{
  max-width: 110px;
  margin-right: 16px;
  width: auto!important;
}

/****** カドカワノベル対応 ******/
/* 注意枠 */
.kadokawa_caution_btn {
	display: none;
	clear: both;
  text-align: center;
	margin: 0 0 8px;
	padding: 4px 16px;
	-webkit-tap-highlight-color: transparent;
}
.kadokawa_caution_btn p {
	display: inline;
	font-size: 12px;
	font-weight: bold;
	color: #E34D4D!important;
}
.kadokawa_caution_btn img {
	margin-left: 4px;
	vertical-align: middle;
	width: 12px;
}
/* モーダル */
.kadokawa_modal_mask {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.70);
	backdrop-filter: blur(3px);
	visibility: hidden;
	opacity: 0;
	transition: 0.2s;
	z-index: 700;
}
.kadokawa_modal_on {
	visibility: visible;
	opacity: 1;
}
.kadokawa_modal_wrap {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	width: 80%;
	max-width: 400px;
	text-align: center;
	box-sizing: border-box;
}
.kadokawa_modal_inner_wrap {
	position: relative;
	border-radius: 24px;
	padding: 32px;
	background: #FFF;
	color: #444;
}
.kadokawa_modal_title {
	margin: 0;
	font-size: 14px; 
	font-weight: bold;
	color: #242424;	
}
.kadokawa_modal_table {
	width: 100%;
	margin: 16px auto;
	border: 1px solid #ccc;
    border-collapse:  separate;
	border-spacing: 0;
	border-radius: 2px;
	font-size: 14px;
}
.kadokawa_modal_table tr {
    width: calc( 100% / 3 );
}
.kadokawa_modal_table th,
.kadokawa_modal_table td {
    padding: 8px;
	border: 1px solid #ccc;
}
.kadokawa_modal_table th:first-of-type,
.kadokawa_modal_table td:first-of-type {
	text-align: left;
}
.kadokawa_modal_table th {
	background-color: #fafafa;
}
.kadokawa_btn {
	display: inline-flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    min-width: 80px;
    text-align: center;
    font-weight: 600;
}
.kadokawa_btn.viewmore {
	height: 44px;
	margin-top: 12px;
	padding: 0 24px;
	border: solid 2px #D8D8D8;
	border-radius: 22px;
	background: #fff;
	line-height: 44px;
	font-size: 14px;
	color:#444!important;
}
.kadokawa_btn.viewmore::after {
    content: "";
    display: inline-block;
    width: 9px;
    height: 12px;
    margin-left: 2px;
    background: url("https://img.papy.co.jp/lc/renta/img/mark/common/arrow_low.svg") no-repeat center / contain;
}
.kadokawa_btn.modal_close {
	position: absolute;
	bottom: -48px;
	left: 50%;
	transform: translateX(-50%);
	height: 32px;
	margin: 16px 0 0 0;
    padding: 0 8px;
	border: solid 2px #fff;
    border-radius: 16px;
	background: transparent;
    font-size: 12px;
    color: #fff!important;
	-webkit-tap-highlight-color: transparent;
}
.kadokawa_btn.modal_close::before {
    content: "";
    display: inline-block;
	width: 10px;
	height: 10px;
	margin: 0 2px 0 0;
    padding: 0;
    border-style: solid;
    border-width: 0;
	background: url("https://img.papy.co.jp/lc/renta/img/mark/common/close_white.svg") no-repeat center / contain;
}
/****** /カドカワノベル対応 ******/
/*---------------
 差額で購入枠
---------------*/
.itemlist_prd_wrap {
  margin-bottom: 0;
}
.itemlist_sagaku{
  background-color: #F4F4F4;
  padding: 16px;
}
.itemlist_sagaku_innerwrap{
  background-color: #FFF;
  border-radius: 16px;
}
.block_mem_short_term,
.block_free_sample,
.block_norent,
.block_upgrade,
.prd_single_wrap {
  padding: 8px 0;
}
/*差額で購入枠内の読むボタン非表示*/
.itemlist_sagaku_innerwrap .prd_single_wrap{
  display: none;
}
.prd_single_wrap{
  text-align: center;
}
/*今すぐポイントを購入する枠*/
.buy_point_text {
  text-align: left;
}
.dialog_point_breakdown_button_icon {
  padding: 18px;
  margin-left: -18px;
}
/*---------------
 ダイアログポップアップ
*---------------*/
#dialog_window_wrap {	/*他のページでも使用 そのまま*/
  width:100%;
  height:100%;
  position: absolute;
  left:0;
  z-index:101;
  display:none;
}
#dialog_window {	/*他のページでも使用 そのまま*/
  color: #313f52;
  font-size: small;
  z-index:100;
  width:270px;
  background-color:#fff; /*Confirm枠の灰色*/
  position:absolute;
  top:50%;
  left:50%;
  margin-left:-140px;
  margin-top:-50px;
  border-radius: 8px;
  text-align:center;
  overflow:hidden;
  padding: 20px 5px;
}
.dialog_title {	/*他のページでも使用 そのまま*/
  font-size:130%;
  font-weight:bold;
  line-height:2;
}

/*---------------
 モーダルポップアップ
---------------*/
#confirm_window_wrap{
  width:100%;
  height:100%;
  position: absolute;
  left:0;
  z-index:101;
  display:none;
}
#confirm_window{
  z-index:100;
  width:280px;
  background-color:#fff; /*Confirm枠の灰色*/
  position:absolute;
  top:50%;
  left:50%;
  margin-left:-140px;
  margin-top:-130px;
  border-radius: 8px;
  text-align:center;
  overflow:hidden;
  padding-top:5px;
}
#confirm_window p{
  margin:0 0 5px 0;
  line-height:1.6;
  display:none;
  padding:8px;
  font-size:90%;
}
#confirm_window .choice{
  display:inline-block;
  overflow:hidden;
  border-top:solid 1px #b3b3b3;
  border-right:solid 1px #b3b3b3;
  color:#3377ff;
  width:50%;
  line-height:40px;
  margin:5px -1px 0px 0px;
  cursor:pointer;	/*PC用*/
}
#black{
  display:none;
  width:100%;
  background-color:#000;
  z-index:80;
  position:absolute;
  top:0;
  left:0;
  opacity:0.5;
}
.repeat_title{
  font-weight:bold;
}

/*---------------
 レビュー
---------------*/
.item_navi_review_link_wrap {
  text-align:center;
}
.review_desc {
  color: #f60;
  font-weight: bold;
  margin: 20px auto 5px;
  text-align: center;
}
.review_check_img {
  display:block;
  max-width:600px;
  margin:0 auto;
  width:100%;
}

/*---------------
 作品・rentボタン出し分け
---------------*/
.valid_hidden_1,
.valid_rent_0 {
  display: none;
}

/*事前表示*/
.rental_future_wrap {
	text-align: center;
	line-height: 1.6;
	font-size: 12px;
	padding: 8px 4%;
}
.rental_future_wrap span {
	color: var(--ui-red);
}
.rental_future_wrap a {
	color: var(--text-link-blue);
}
/*---------------------
 配信お知らせメール配信設定
---------------------*/
#modal-content{
  width:90%;
  margin:0;
  padding-bottom:10px;
  border:2px solid #aaa;
  background:#fff;
  position:absolute;
  display:none;
  z-index:2;
  border-radius: 5px;
}
#modal-content p{
  padding: 10px 20px;
}
#modal-content p.title{
  background: #aaa;
  color: #fff;
  font-weight: bold;
}
#modal-content p.title a{
	float: right;
}
#modal-overlay{
  z-index:1;
  display:none;
  position:absolute;
  left:0;
  width:100%;
  height:120%;
  background-color:rgba(0,0,0,0.75);
}
#closebtn {
  width: 20px;
  height: 5px;
  background-color: #313f52;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  margin-top: 8px;
}
#closebtn:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-color: inherit;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
}
#modal-content p.note {
  color: #777;
  font-size: 12px;
  border-top: 1px dotted #777;
  margin: 0 20px;
  padding: 10px 0 0;
}
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}

/*会員登録系*/
.join_midashi {
  clear: both;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
  padding: 28px 0;
}
.join_step_wrap {
  text-align: center;
  margin-bottom: 28px;
}
.join_step_wrap li {
  display: inline-block;
  box-sizing: border-box;
  font-size: 12px;
  color: #4c4c4c;
}
.join_step_wrap li:not(:first-child) {
  position: relative;
  padding-left: 18px;
}
.join_step_wrap li:not(:first-child):before {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 3px 0 3px 5px;
  border-color: transparent transparent transparent #999;
  position: absolute;
  top: 50%;
  left: 6px;
  margin-top: -3px;
}
.step_now {
  color: #81c31f !important;
  font-weight: bold;
}
.join_text {
  font-size: 14px;
  text-align: center;
  line-height: 1.6;
  padding-bottom: 32px;
}
.green_bold {
  color: #80BB00;
  font-weight: bold;
}
.item_navi_footer {
  margin-top: 16px;
}
.item_navi_footer a {
  padding: 16px 0;
}
/* 還元 */
.item-reward_wrap {
	display:inline-block;
	font-size: 0;
	vertical-align: middle;
}

.item-list_reward {
    font-size: 12px;
    color: #444;
}
.item-user_rank0::before {
	display: none;
}
.item-user_rank1::before,
.item-user_rank2::before,
.item-user_rank3::before {
    content: "";
    display: inline-block;
    width: 13px;
    height: 13px;
    margin-right: 2px;
    vertical-align: middle;
    margin-bottom: 2px;
}
.item-user_rank1::before {
	background: url('https://img.papy.co.jp/lc/renta/img/other/user_rank/userrank_icon_rankid1.svg') no-repeat center / contain;
}
.item-user_rank2::before {
	background: url('https://img.papy.co.jp/lc/renta/img/other/user_rank/userrank_icon_rankid2.svg') no-repeat center / contain;
}
.item-user_rank3::before {
	background: url('https://img.papy.co.jp/lc/renta/img/other/user_rank/userrank_icon_rankid3.svg') no-repeat center / contain;
}

.item-list_reward_camp {
    font-size: 12px;
    color: #444;
}
.item-list_reward_camp span {
	color: #E34D4D;
}
.item-normal_reward {
	display: none;
}
.item-camp_reward {
	color: #F97942;
}
[data-rewardcamp="0"] {
	display: none;
}
[data-reward="0"] {
	display: inline;
}
/* /還元 */

.item_btn_wrap {
	position: relative;
	display: inline-flex;
	width: 100%;
	vertical-align: middle;
	font-size: 0;
	align-items: center;
	gap: 0 10px;
	max-width: 400px;
}
.item_btn_wrap .c-btn_free {
  margin-bottom: 16px;
}
.itemlist_prd_wrap .c-btn_free,
.itemlist_prd_wrap .c-btn_tertiary {
	height: 40px;
	border-radius: 40px;
	width: 100%;
}
.itemlist_prd_wrap button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
    font-size: 0;
}
.cart_join {
    width: 24px;
}
.cart_join img {
    width: 100%;
}
.itemlist_prd_wrap .c-btn_buy,
.itemlist_prd_wrap .c-btn_primary {
    height: 44px;
    border-radius: 44px;
    width: 100%;
    padding: 0;
}
.upgrade.c-btn_buy {
    background: #FF6600;
}
.item-btnstyle {
    font-size: 0;
}
.item-btn_point {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
	  color: #fff;
    margin-left: 4px;
   
}
.item-btn_point_before{
    text-decoration-line: line-through;
    font-weight: 300;
    font-size: 12px;
    margin-left: 1px;
    line-height: 1;
}
.item-btn_text {
    padding-left: 1px;
    font-size: 12px;
	color: #fff;
}
.item-btn_nowbuy_text {
    font-size: 10px;
    opacity: 0.8;
    padding-top: 2px;
	color: #fff;
}
.prd_camp_wrap {
	display: inline-block;
	width: 100%;
	font-size: 12px;
	vertical-align: middle;
}
main {
	max-width: 760px;
	margin: 0 auto;
	padding-bottom: 96px;	/* アプリタブの2倍 */
}
header {
    height: 54px;
}
/* iosのヘッダー（統一時削除） */
.pageHead_wrap{
	position: fixed;
	top: 0!important;
	left: 0;
	z-index: 600;
	width: 100%;
}
.header_nolinkNavi{
	height: 44px;
	background: #fff;
	border-bottom: 1px solid #dddddd;
}
.header_nolinkNavi ol {
	list-style: none;
	height: 44px;
	line-height: 46px;
	padding: 0 5px;
	background:#fff;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.header_nolinkNavi a{
	position: absolute;
	top: 50%;
	left: 7px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	height: 18px;
	padding: 0 4px;
	font-size: 0;
	line-height: 1;
}
.header_nolinkNavi img{
	height: 18px;
	transform: rotateY(180deg);
}
.header_nolinkNavi span{
	display: inline-block;
	width: 85%;
	font-size: 16px;
	font-weight: bold;
}
.headerTop_navi{
	font-size:0;
}
.headerTop_navi ol{
	list-style: none;
	height: 44px;
	line-height: 44px;
	padding: 0 5px;
}
/* /iosのヘッダー */

.content,
.message {
	text-align: center;
	font-weight: bold;
	padding-top: 16px;
	font-size: 14px;
}
.item-btn_pointbuy::before {
	width: 18px;
    height: 18px;
    content: "";
    display: inline-block;
    margin-right: 4px;
    background: url("https://img.papy.co.jp/lc/renta/img/other/user_rank/mypoint_icon.svg") no-repeat center / contain;
}
.item-btn_point::before{
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 1px;
    background: url(https://img.papy.co.jp/renta/img/mark/common/icon_point.svg) no-repeat center / contain;
}
#js-buySelect_contents {
    font-weight: bold;
}
/* 吹き出し */
.cart_joinText {
	display: block;
	position: absolute;
	top: -40px;
	right: 0;
	padding: 8px;
	box-shadow: var(--box-shadow-high);
	background: #fff;
	border-radius: 4px;
	color: var(--text-body);
	font-size: 12px;
	font-weight: bold;
	z-index: 100;
}
.cart_joinText::after {
	width: 25px;
    height: 8px;
    content: "";
    display: inline-block;
    background: url("https://img.papy.co.jp/lc/renta/img/mark/common/arrow_horn_white.svg") no-repeat center / contain;
    position: absolute;
    right: -2px;
    bottom: -6px;
}
#js-cart_change_period {
	color: var(--ui-red);
}
.block_mem_short_term, .block_free_sample, .block_norent, .block_upgrade {
    text-align: center;
    overflow: visible;
    margin: auto;
    width: 100%;
    padding: 0;
}
.block_upgrade{
  padding: 0;
  box-sizing: border-box;
  text-align: center;
}
.itemlist_sagaku_innerwrap .block_upgrade {
    padding-bottom: 16px;
}
.block_upgrade_inner{
    display: flex;
    gap: 8px;
}
.block_mem_short_term, .block_free_sample, .block_norent, .block_upgrade, 
.prd_single_wrap{
  margin: auto;
}
#js-buySelect_title {
	color: var(--ui-red);
}

.item_navi_topBack_wrap{
  font-weight: bold;
  padding: 0 0 24px 0;
  line-height: 1;
}

.last-item-message{
     margin: 34px auto 16px;
}
.item-btn_point_text{
  margin-right: 4px;
  display: inline-flex;
    align-items: center;
    font-size: 14px;
    color: #fff;
    margin-left: 4px;
}
.itemlist_prd_innerwrap {
  display: flex;
  box-sizing: border-box;
  padding: 16px var(--side-p) 8px var(--side-p);
}
.item-linkbtn{
  max-width: 400px;
  margin: auto;
  padding: 12px 0;
  text-align: center;
}
.item-linkbtn_login_off_new{
    max-width: 400px;
    margin: auto;
    padding: 16px;
    line-height: 0;
}
.item-linkbtn_login_off_new img{
  width: 100%;
}
.login_off_new_join_wrap{
  text-align: center;
  line-height: 0;
  padding-bottom: 12px;
}
.itemnavi-join {
	margin-top: 32px;
}
.item_navi_main{
  margin-top: 16px;
}
.end_item_none_message{
  padding-top: 32px;
  padding-bottom: 28px;
}
.itemlist_sagaku{
  margin-top: 16px;
}
.item_navi-banner_wrap{
  margin-bottom: 12px;
}
.prd_rental_wrap_0,
.prd_rental_wrap_1,
.set_prd_rental_wrap_0,
.set_prd_rental_wrap_1,
.buy_point_wrap {
	padding: 0 16px;
	box-sizing: border-box;
}
.item_navi-banner_wrap{
  margin: 0 16px 12px 16px;
}

.block_upgrade{
  border: none;
}
.c-popup_small, .c-popup_large {
    top: 150px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.itemNavi-recommend {
	border-top: 8px solid var(--border-low);
}
.join-coupon_text {
	display: none;
}

/* フッター */
.itemNavi-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 0 32px;
	margin-top: 16px;
}
.itemNavi-footer a {
	padding: 16px var(--side-p);
	color: var(--text-link-blue);
	font-size: 15px;
}

/* フラグ */
.prd_disp_flg_0 {
    display: none;
}

@media screen and (min-width: 600px) {
 	.buy_point_text {
		text-align: center;
	}
	.block_mem_short_term, .block_free_sample, .block_norent, .prd_single_wrap {
		max-width: 400px;
	}
}
@media screen and (min-width: 760px) {
  .item_navi_main{
    padding-right: 0;
    padding-left: 0;
  }
  /*価格回り*/
  .itemlist_prd_cover_wrap {
    margin:0 16px;
    float:left;
    overflow:hidden;
    box-sizing:border-box;
  }
  .prd_rental_wrap_0,
  .prd_rental_wrap_1,
  .set_prd_rental_wrap_0,
  .set_prd_rental_wrap_1,
  .buy_point_wrap {
    width: 100%;
  }
  .itemlist_prd_innerwrap {
    overflow: hidden;
    width: 100%;
  }
  .itemlist_prd_innerwrap_sagaku{
     padding: 16px 16px 8px 16px;
  }
  #modal-content {
    width: 50%;
  }
	.top_header {
		max-width: 760px;
		margin-left: auto;
		margin-right: auto;
	}
	.header_fixed_wrap {
        padding: 0;
    }
    .item_navi-banner_wrap{
    margin: 0 0 12px 0;
  }
}
/* UIマーク */
[data-new*="#dt:label_new"],
[data-type*="#dt:label_type"] {
	display: none;
}
/* 動画再生 */
.movie_note {
	display: none;
  font-size: 12px;
  line-height: 1.6;
  color: #E34D4D;
  text-align: left;
  margin: 0 16px 16px;
  border-radius: 8px;
}
.movie_note a {
	display: inline;
	font-weight: bold;
	color: #2861D4;
}
.movie_note span {
	font-weight: bold;
}
.movie_note br {
	display: none;
}
.android .movie_note {
	display: block;
}
@media screen and (min-width: 600px){
  .movie_note {
    text-align: center;
    font-size: 13px;
  }
	.movie_note br {
		display: block;
	}
}



:root {
	/*-----color ･鬣､･ﾈ･筍ｼ･ﾉ-----*/
	--base: #FFF;
	--background-modal: rgba(0, 0, 0, 0.60);
	--text-headline: #202020;
	--text-body: #303030;
	--text-caption-high: #646464;
	--text-caption-medium: #747474;
	--text-caption-low: #848484;
	--white :#FFF;

	/*-----size-----*/
	--vw: 1vw;
	--vh: 1vh;
	--scrollbar-w: 0;
	--header-h: 54px;
	scroll-padding: calc(var(--header-h) + 8px);
	--side-p: 16px;
	/*-----font-size-----*/
	--size-headline-large: 18px;
	--size-headline-medium: 16px;
	--size-headline-small: 14px;
	--size-body-large: 13px;
	--size-body-small: 12px;
	--size-caption-large: 11px;
	--size-caption-small: 10px;
}
/* ･ﾜ･ｿ･?魘?ｲｽ */
.itemnavi-popupwrap button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
    font-size: 0;
}
.itemnavi-popup_bg:hover,
.itemnavi-popup a:hover,
.itemnavi-popup:hover {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.itemnavi-popupwrap {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	visibility: hidden;
	opacity: 0;
	transition: 0.2s;
	background-color: rgba(0, 0, 0, 0.6);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
	text-align: center;
	font-size: 0;
	z-index: 1100;
	cursor: pointer;
}
.itemnavi-popup_bg {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1101;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.itemnavi-popup_on {
    visibility: visible;
    opacity: 1;
}
.itemnavi-popup {
	position: relative;
	background: var(--base);
	border-radius: 24px;
	transition: opacity 0.3s;
	font-size: 0;
	width: 86%;
	max-width: 400px;
	/* background: linear-gradient(180deg, #F5F3F1 0%, #FFF 23%);
	box-shadow: 0px 4px 2px 0px #FFF inset, 0px -3px 2px 0px rgba(0, 0, 0, 0.25) inset; */
	z-index: 1102;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	cursor: default;
}
.itemnavi-popup_innerwrap {
    overflow: hidden;
	border-radius: 24px;
	max-height: calc(var(--vh) * 100 - 120px);
}
.itemnavi-popup_scrollwrap {
	overflow-y: auto;
	max-height: calc(var(--vh) * 100 - 120px);
}
.itemnavi-popup_contens_regular {
    padding: 32px;
}
.itemnavi-popup_contens_hl {
    margin-bottom: 24px;
    color: var(--text-headline);
    text-align: center;
    font-size: var(--size-headline-small);
    font-weight: bold;
}
.itemnavi-popup_close a {
	display: inline-flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    min-width: 80px;
    text-align: center;
    font-weight: bold;
    line-height: 1;
    cursor: pointer;
    height: 30px;
    padding: 0 8px;
    border-radius: 16px;
    font-size: 12px;
    background: transparent;
    border: solid 2px var(--white);
    color: var(--white);
	cursor: default;
	text-decoration: none;
}
.itemnavi-popup_close {
	display: block;
	width: auto;
	position: absolute;
	bottom: -46px;
	left: 50%;
	transform: translateX(-50%);
}
.itemnavi-share_btn {
	display: flex;
	align-items: center;
	gap: 24px;
	justify-content: center;
}
.share_x button,
.share_line button,
.share_copy button {
	display: flex;
	width: 54px;
	height: 54px;
	justify-content: center;
	align-items: center;
	margin-bottom: 2px;
	border-radius: 100px;
	background: #848484;
}
.share_x span,
.share_line span,
.share_copy span {
	color: var(--text-caption-low);
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	line-height: 1.6;
}
.share_x img ,
.share_line img ,
.share_copy img {
	width: 30px;
	height: 30px;
	vertical-align: bottom;
}
.share_x button {
	background: #000;
}
.share_line button {
	background: #06C755;
}

/* いいね機能 */
/****************************** ここから ******************************/
/* 大枠 */
.activebutton-main {
	margin: 32px 0 24px;
	color: var(--text-body);
}
.activebutton-main h2 {
	font-size: var(--size-body-large);
	text-align: center;
	line-height: 1.4;
	margin-bottom: 24px;
}
/* メニュー内 */
.activebutton-menu {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	gap: 20px;
}
.activebutton-main button {
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.activebutton-btn_share,
.activebutton-btn_mylist {
	width: 92px;
}
.activebutton-btn_share img,
.activebutton-btn_mylist img {
	height: 32px;
	margin-bottom: 4px;
	vertical-align: bottom;
}
.activebutton-btn_share span,
.activebutton-btn_mylist span {
	display: block;
	width: 100%;
	font-size: 13px;
	font-weight: bold;
	text-align: center;
	line-height: 1.6;
	color: var(--text-body);
}
.activebutton-btn_good {
	height: 95px;
	position: relative;
}

/* ボタン大枠 */
.good .goodbutton-tap {
	display: flex;
	opacity: 0;
	align-items: center;
	justify-content: center;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	bottom: calc(100% + 16px);
	height: 30px;
	width: 54px;
	font-size: 13px;
	font-weight: bold;
	color: #fff;
	border-radius: 8px;
	background: #F06969;
	animation-name: count;
	animation-duration: 0.7s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}
.good .goodbutton-tap::after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	left: 50%;
	transform: translateX(-50%) rotate(90deg);
	-webkit-transform: translateX(-50%) rotate(90deg);
	-ms-transform: translateX(-50%) rotate(90deg);
	top: calc(100% - 10px);
	border-style: solid;
	border-color: transparent transparent transparent #F06969;
	border-width: 10px 0 10px 10px;
}

.good[data-count="1"] .goodbutton-tap::before {
	content: '1/10';
}
.good[data-count="2"] .goodbutton-tap::before {
	content: '2/10';
}
.good[data-count="3"] .goodbutton-tap::before {
	content: '3/10';
}
.good[data-count="4"] .goodbutton-tap::before {
	content: '4/10';
}
.good[data-count="5"] .goodbutton-tap::before {
	content: '5/10';
}
.good[data-count="6"] .goodbutton-tap::before {
	content: '6/10';
}
.good[data-count="7"] .goodbutton-tap::before {
	content: '7/10';
}
.good[data-count="8"] .goodbutton-tap::before {
	content: '8/10';
}
.good[data-count="9"] .goodbutton-tap::before {
	content: '9/10';
}
.good[data-count="10"] .goodbutton-tap::before {
	content: 'MAX';
}
/* 大枠のサイズ変更 */
@keyframes count {
	0% {
		opacity: 1;
	}
	99% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}
.goodbutton-button {
	position: relative;
	width: 68px;
	height: 68px;
	margin-bottom: 6px;
}
.goodbutton-button button {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 68px;
	height: 68px;
	position: relative;
	border-radius: 80px;
	background: #F06969;
	z-index: 10;
}
.good .goodbutton-button button {
	animation-name: goodbox;
	animation-duration: 0.5s;
}
.goodbutton-count {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	font-weight: bold;
	font-size: 13px;
	text-align: center;
	line-height: 1.6;
	color: #F06969;
}
/* 初期ボタンの色 0回目 */
[data-count="0"] button {
	background: var(--buttons-secondary, #D4D4D4);;	
}
[data-count="0"] .goodbutton-count {
	color: var(--text-body);
}

/* 大枠のサイズ変更 */
@keyframes goodbox {
	0% {
		transform: scale(1);
	}
	33% {
		transform: scale(0.8);
	}
	66% {
		transform: scale(1.1);
	}
	100% {
		transform: scale(1);	
	}
}

/* グッチョブ指 */
.goodbutton-button .goodicon {
	width: 36px;
	height: 36px;
	flex-shrink: 0;
	aspect-ratio: 1/1;
}
.good .goodicon {
	animation-name: goodmark;
	animation-duration: 0.3s;
	animation-timing-function: ease-out;
}
/* 指の動き10回まで星 */
@keyframes goodmark {
	0% {
		transform: rotate(-35deg) scale(0.6);
	}
	40% {
		transform: rotate(-15deg) scale(1);
	}
	80% {
		transform: rotate(4deg) scale(1.3);
	}
	100% {
		transform: rotate(0) scale(1);
	}
}

/* 指の動き10回目 */
.good[data-count="10"] .goodicon {
	animation-name: goodend;
    animation-duration: 0.8s;
	animation-fill-mode: forwards;
	animation-timing-function: ease;
}
@keyframes goodend {
	0% {
		transform: rotate(0) scale(1);
	}
	10% {
		transform: rotate(0) scale(0.6);
	}
	20% {
		transform: scale(-1, 1) scale(1.2);
	}
	30% {
		transform: rotate(-25deg) scale(1.3);
	}
	50% {
		transform: rotate(4deg) scale(1.5);
	}
	100% {
		transform: rotate(0) scale(1);
	}
}

/* 星 */
.staricon {
    position: absolute;
    bottom: calc(100% - 20px);
    left: calc(100% - 6px);
    transform: rotate(-20deg);
	height: 20px;
	width: 20px;
	opacity: 0;
}
.good .staricon {
	animation-name: shootingStar;
	animation-duration: 0.6s;
	animation-fill-mode:forwards;
	animation-delay: 0.3s;
}
.good[data-count="10"] .staricon {
	display: none;
}
@keyframes shootingStar {
	0% {
		opacity: 1;
		bottom: calc(100% - 20px);
		left: calc(100% - 6px);
		transform: rotate(-20deg);
		height: 20px;
		width: 20px;
	}
	50% {
		bottom: calc(100% - 5px);
		left: calc(100% + 9px);
		transform: rotate(-5deg);
		height: 15px;
		width: 15px;
	}	
	100% {
		bottom: calc(100% - 10px);
		left: calc(100% + 14px);
		transform: rotate(0deg);
		height: 10px;
		width: 10px;
	}
}


/* 音ゲーみたいなエフェクト */
.good .goodbutton-button::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	opacity: 0;
	border-radius: 80px;
	background: #F7B3B3;
	z-index: 0;
	animation-name: effect;
    animation-duration: 0.5s;
	width: 68px;
	height: 68px;
}
@keyframes effect {
	0% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1.1);
	}
	33% {
		opacity: 0.8;
		transform: translate(-50%, -50%) scale(0.9);
	}
	66% {
		opacity: 0.8;
		transform: translate(-50%, -50%) scale(1.2);
	}
	100% {
		opacity: 0.2;
		transform: translate(-50%, -50%) scale(1.3);
	}
}

/* 花火のところ */
.good[data-count="10"] .firework1::before,
.good[data-count="10"] .firework2::before,
.good[data-count="10"] .firework3::before,
.good[data-count="10"] .firework4::before,
.good[data-count="10"] .firework1::after,
.good[data-count="10"] .firework2::after,
.good[data-count="10"] .firework3::after,
.good[data-count="10"] .firework4::after {
	content: '';
    display: inline-block;
	opacity: 0;
	position: absolute;
    animation-duration: 0.4s;
	animation-delay: 0.3s;
    border-radius: 5px;
	animation-iteration-count: 1;
}
.firework1::before {
    width: 4px;
    height: 12px;
    top: -18px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    background: var(--common-blue, #527EF7);
	animation-name: firework1before;
	/*animation-direction: reverse;
	animation-fill-mode: forwards;*/

}
.firework1::after {
    width: 12px;
    height: 4px;
    top: 32px;
    right: -18px;
    background: #9C55F5;
	transform: translateY(0);
	animation-name: firework1after;
}
.firework2::before {
    width: 4px;
    height: 12px;
    bottom: -18px;
    left: 50%;
    transform: translateX(-50%) translateY(0);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
	background: #F7B90F;
	animation-name: firework2before;
}
.firework2::after {
    width: 12px;
    height: 4px;
    top: 32px;
    left: -18px;
	background: var(--common-green, #40C346);
	transform: translateX(0);
	animation-name: firework2after;
}

.firework3::before {
    width: 4px;
    height: 12px;
    top: -4px;
    right: -2px;
    transform: rotate(-135deg) translateY(0);
    background: var(--common-pink, #FA64BA);
	animation-name: firework3before;
}
.firework3::after {
    width: 4px;
    height: 12px;
    bottom: -4px;
    right: -1px;
    transform: rotate(315deg) translateY(0);
    background: #F89247;
	animation-name: firework3after;
}
.firework4::before {
    width: 4px;
    height: 12px;
    top: -4px;
    left: -1px;
    transform: rotate(135deg);
    background: #2DB4EE;
	animation-name: firework4before;
}
.firework4::after {
    width: 4px;
    height: 12px;
    bottom: -4px;
    left: -1px;
    transform: rotate(-315deg);
    background: #8CC712;
	animation-name: firework4after;
}

/* お得なセット */ 
.set_info_wrap {
	background: #fafafa;
	padding: 8px;
	margin: 8px 0;
	border-radius: 8px;
	line-height: 1.2;
}
.set_info_title {
	font-size: 12px;
}
.set_info_text_link {
	font-size: 11px;
}

/* 花火 */
@keyframes firework1before {
	0% {
		opacity: 1;
		height: 12px;
		transform: translateX(-50%) translateY(0);

	}
	100% {
		height: 4px;
		opacity: 1;
		transform: translateX(-50%) translateY(-8px);
	}
}
@keyframes firework1after {
	0% {
		opacity: 1;
		width: 12px;
		transform: translateX(0);
	}
	100% {
		width: 4px;
		opacity: 1;
		transform: translateX(8px);
	}
}
@keyframes firework2before {
	0% {
		opacity: 1;
		height: 12px;
		transform: translateX(-50%) translateY(0);
	}
	100% {
		height: 4px;
		opacity: 1;
  		transform: translateX(-50%) translateY(8px);
	}
}
@keyframes firework2after {
	0% {
		opacity: 1;
		width: 12px;
		transform: translateX(0);
	}
	100% {
		width: 4px;
		opacity: 1;
		transform: translateX(-8px);
	}
}
@keyframes firework3before {
	0% {
		opacity: 1;
		height: 12px;
		transform: rotate(-135deg) translateY(0);
	}
	100% {
		height: 4px;
		opacity: 1;
		transform: rotate(-135deg) translateY(8px);
	}
}
@keyframes firework3after {
	0% {
		opacity: 1;
		height: 12px;
		transform: rotate(315deg) translateY(0);
	}
	100% {
		height: 4px;
		opacity: 1;
		transform: rotate(315deg) translateY(8px);
	}
}
@keyframes firework4before {
	0% {
		opacity: 1;
		height: 12px;
		transform: rotate(135deg) translateY(0);
	}
	100% {
		height: 4px;
		opacity: 1;
		transform: rotate(135deg) translateY(8px);
	}
}
@keyframes firework4after {
	0% {
		opacity: 1;
		height: 12px;
		transform: rotate(-315deg) translateY(0);
	}
	100% {
		height: 4px;
		opacity: 1;
		transform: rotate(-315deg) translateY(8px);
	}
}