@charset "utf-8";
/*********** SP設定 ***********/
.sp_block{
	display: block;
}
.sp_inline{
	display:inline;
}
.sp_none{
	display: none;
}


/*********** リスト設定 ***********/
.ul_book,
.news_single .ul_book{
	gap:1.563rem 4.3%;
}
.ul_book li{
	width:30.46666666666667%;
}
.ul_book_cat span,
.news_single .ul_book_cat span{
	font-size:clamp(10px,2vw,12px);
}
.ul_book_ttl,
.news_single .ul_book_ttl{
	font-size:3vw;
}
.ul_book_name,
.ul_book_day,
.news_single .ul_book_name,
.news_single .ul_book_day{
	font-size:2.5vw;
}
.ul_book_wrap{
	overflow-x: auto;
	width:calc(100% + 40px);
	margin-left:-20px;
	box-sizing: border-box;
	padding:0 20px;
}
.ul_book_wrap .ul_book{
	gap:10px;
	width:max-content;
}
.ul_book_wrap .ul_book li{
	width:calc(100vw / 3 - 1.563rem);
}

.ul_book2{
	flex-wrap:wrap;
}


.ul_special li{
	width:48.75%;
}
.ul_special li:nth-last-of-type(-n+4){
	margin-bottom:2.5%;
}
.ul_special li:nth-last-of-type(-n+2){
	margin-bottom:2.5%;
}


/*********** 購入window設定（試し読み終了 #finish_wrap のみ想定） ***********/
/* binb専用スマホ: 試し読みに戻る→購入して続きを読むの縦配置、左右均等の余白 */
/* 上バーは低く、先頭へ／TOブックス／× を比例して小さく（SPデザイン正） */
#finish_wrap{
	--popup-header-h:2.35rem;
}
/* 外側グレー（オーバーレイ）を狭め、白パネルを画面幅に近づける（デザイン幅） */
#finish_wrap #buy_inner{
	padding:1rem 0.5rem;
	box-sizing:border-box;
	font-size:clamp(14px, 3.5vw, 18px);
}
#finish_wrap #buy_content{
	display:flex;
	flex-direction:column;
	margin-top:20px;
	width:100%;
	max-width:100%;
	padding:calc(var(--popup-header-h, 2.35rem) + 2.2rem) 10px 20px 10px;
	position:relative;
	box-sizing:border-box;
}
#finish_wrap #popup_header{
	height:var(--popup-header-h, 2.35rem) !important;
	min-height:0;
	padding:0 0.5rem;
	box-sizing:border-box;
	border-bottom:0;
}
#finish_wrap #popup_header .header-link{
	font-size:0.8125rem;
	font-weight:500;
	line-height:1.2;
}
#finish_wrap #popup_header .brand{
	height:1.05rem;
	width:auto;
}
#finish_wrap #popup_header #buy_close{
	top:50%;
	right:0.5rem;
	transform:translateY(-50%);
	width:auto;
	max-width:none;
}
#finish_wrap #popup_header #buy_close img{
	width:1rem;
	max-width:none;
	height:auto;
	display:block;
}
#finish_wrap #return_trial{
	position:absolute !important;
	top:calc(var(--popup-header-h, 2.35rem) + 0.75rem);
	right:0.5rem;
	left:0.5rem;
	display:flex !important;
	align-items:center;
	justify-content:flex-end;
	text-align:right;
	padding:0 0 0.65rem;
	margin:0;
	z-index:3;
	font-size:0.875rem !important;
}
#finish_wrap #return_trial .rt-arrow{
	display:inline-flex;
	align-items:center;
	vertical-align:middle;
	flex-shrink:0;
}
#finish_wrap #return_trial .rt-arrow svg{
	width:1.2em;
	height:1.2em;
	stroke:currentColor;
	stroke-width:2;
	fill:none;
}
#finish_wrap #buy_scroll{
	padding:0 0.625rem 8% !important;
	min-width:0;
	overflow-x:hidden;
	box-sizing:border-box;
}
/* 見出し＋一覧ボタン横並び：1行に収める（このシリーズの商品 等） */
#finish_wrap .ttl6_wrap{
	flex-wrap:nowrap;
	/* center だと h2 の padding-bottom 込みの箱で中央になり、ボタンが下に見える */
	align-items:flex-start;
	gap:0.375rem;
}
/* Blade 側で h2 は .ttl6（.ttl3 を付けない＝ティール下線なし） */
#finish_wrap .ttl6_wrap .ttl6{
	flex:1 1 auto;
	min-width:0;
	white-space:nowrap;
	font-size:clamp(0.95rem, 4vw, 1.2rem);
	line-height:1.25;
	margin:0;
	padding-bottom:0.5em;
}
#finish_wrap .ttl6_wrap > div{
	flex-shrink:0;
	min-width:0;
}
#finish_wrap .ttl6_wrap .btn1{
	flex-shrink:0;
	margin-top:0.12em;
	font-size:clamp(0.625rem, 2.45vw, 0.8125rem);
	padding:0.35em 0.9em 0.45em;
	white-space:nowrap;
}
#finish_wrap .ttl6_wrap .btn1:before{
	width:0.32rem;
	height:0.55rem;
	top:0.05rem;
}
#finish_wrap #buy_close{
	width:7%;
	max-width:5.125rem;
	top:1.5rem;
	right:1.5rem;
}
#finish_wrap #buy_close img{
	width:5.125rem;
}
#finish_wrap #buy_item{
	gap:1.625rem;
}
#finish_wrap #buy_cover{
	width:35%;
}
#finish_wrap #buy_info{
	width:calc(64% - 0.625rem);
}
#finish_wrap #buy_ttl{
	font-size:clamp(0.85rem, 3.2vw, 1.05rem);
}
#finish_wrap #buy_author{
	font-size:clamp(0.75rem, 2.8vw, 0.95rem);
}
#finish_wrap #buy_data{
	font-size:clamp(0.7rem, 2.5vw, 0.875rem);
}

.buy_ul li{
	width:50%;
    border: 0.125rem solid #ebebeb;
	border-left:0;
}
.buy_ul li:nth-of-type(n+6){
	border-top:0.125rem solid #ebebeb;
}
.buy_ul li:nth-of-type(n+3){
	border-top:0;
}
.buy_ul li.sp_block{
	width:100%;
	box-sizing: border-box;
	padding:0 8%;
}
.buy_ul img{
	width:100%;
}
#finish_wrap .ul_book li:nth-child(n+4){
	display: none;
}
.comingsoon{
	width:100%;
	font-size:1rem;
}
#finish_wrap #finish_ttl{
	margin-top:1em;
	font-size:clamp(1rem, 4.2vw, 1.35rem);
	word-break:break-word;
	overflow-wrap:break-word;
	max-width:100%;
}
#finish_wrap #finish_text {
    font-size:clamp(0.875rem, 3.5vw, 1.1rem);
	word-break:break-word;
	overflow-wrap:break-word;
	max-width:100%;
}
/* common の 0.25rem 相当。#finish_text:after だけだと詳細度同一で sp_binb が後勝ちし 0.7rem≈11px になる */
/* rem 拡大で太く見えないよう px 固定（Blade でも同指定あり） */
#finish_wrap #finish_text:after{
	content:'';
	display:block;
	width:2em;
	height:3px;
	background:#1fcabc;
	position:absolute;
	bottom:0;
	border-radius:2px;
}
#finish_wrap .ttl3_wrap{
	border-bottom:3px solid #ebebeb;
}
#finish_wrap .ttl3_wrap .ttl3{
	font-weight:bold;
	font-size:clamp(1.35rem, 4.5vw, 1.75rem);
	line-height:1.25;
	border-bottom:3px solid #1fcabc;
	margin-bottom:-3px;
	padding-bottom:0.5em;
	white-space:nowrap;
}
#finish_wrap .btn1{
	font-size:clamp(0.7rem, 2.4vw, 0.9rem);
}
#finish_wrap .btn1:before {
    width: 0.35rem;
    height: 0.55rem;
}

/*********** 余白設定 ***********/
.mb30{
	margin-bottom: 4%;
}
.mb40{
	margin-bottom: 5%;
}
.mb45{
	margin-bottom: 5.5%;
}
.mb50{
	margin-bottom: 6%;
}
.mb70{
	margin-bottom: 9%;
}
.mb80{
	margin-bottom: 10%;
}
.ptb100{
	padding-top:13%;
	padding-bottom:13%;
}
.pt100{
	padding-top:13%;
}
.pb100,
.pb100.pc_pb180{
	padding-bottom:13%;
}



