@charset "Shift_JIS";

/*
	================================================================================================
		index.css
	================================================================================================
*/
a.textLink_2 {
	display: inline;
	margin: 0 5px 0 0;
	padding: 0 0 0 10px;
	background: url(/share/images/arrow_black.gif) no-repeat left .4em;
}
#contents a.textLink {
	display: inline-block;
}

#contents ul.recommended li ol {
	margin-top: 20px;
}
#contents ul li ol li {
	list-style: decimal;
}
#contents img.icon {
	vertical-align: middle;
	margin: 0px 6px;
}

#contents div.pct300 img {
	max-width: 300px!important;
	border: 1px solid #ccc;
} 

/*===========================================
	anchorBtn アンカーボタン
=============================================*/

.clearfix {
	display: block;
	zoom: 1;
}
.btn_area_text {
	list-style-type: none;
	text-align: left;
}

ul.btn_area_text li{
	display: inline-block;
	padding: 5px;
	width: 300px;
	margin-right: 0px;
	vertical-align: top;
}

.model-linkButton a {
	display: block;
	padding: 15px;
	transition: opacity .2s ease-in 0s;
	text-decoration: none !important;
}

.model-txt {
	background: url(/support/tv/special/beans/rimo/images/arrow_black-b.png) no-repeat scroll 0 10px;
	padding-left: 15px;
	word-break: break-all;
	display: inline-block;
	margin: 1em 1em 0 0.5em;
}

.model-img {
	display: block;
	text-align: center;
}

img.ButtonIcon{
	float:right;
	margin: 10px 0 0 2px;
	vertical-align:middle;
}
.model-linkButton {
	background: url("/support/tv/special/beans/rimo/images/bg_mod-linkButton.jpg") repeat-x scroll 0 0;
	border: 2px solid #bcbcbc;
	border-radius: 10px;
	color: #333;
	cursor: pointer;
	display: inline-block;
	height: 70px;
	letter-spacing: 0.01em;
	text-align: left;
	width: 300px;
	background-size: contain;
}

#contents ul.btn_area_text li a:focus, #contents ul.btn_area_text li a:hover {
	opacity: 0.5;
	text-decoration: none;
}

#contents .pct a:focus, #contents .pct a:hover {
	opacity: 0.5;
	text-decoration: none;
}

@media screen and (min-width: 800px) {
	.model-linkButton {
		height: 170px;
	}
}

@media screen and (max-width: 640px) {
	div.modelArea ul li,
	.model-linkButton {
		width: 96%;
	}
	.btn_area_text {
		padding-left: 0;
		text-align: center;
	}
	.model-txt {
	height: auto;
	display: inline-block;
	min-height: 43px;
	}

}

/*
----------------------------------------------------------------------------
	画面幅＜640px＞以下のときに適用
----------------------------------------------------------------------------
*/
@media screen and (max-width: 640px) {
	#contents ul.recommended li ol {
		margin-left: 0;
	}

	#contents .section ol li ul.annotation {
		margin-left: 0;
		margin-right: 0;
	}
	#contents ul:not(.annotation), #contents dl {
		margin: 1em 0 1.5em 0;
	}
}


/*
----------------------------------------------------------------------------
	画面幅＜800px＞以上のときに適用
----------------------------------------------------------------------------
*/

/* 20220830 */
#contents .btnArea{
	display: flex;
	padding: 1em;
	justify-content: center;
	align-items: center;
}
#contents .btnArea > ul.btnList > li{
	list-style-type: none;
	margin-bottom: 10px;
}
#contents .btnArea > ul.btnList > li > a{
	width: 100%;
	padding: 10px;
	background: url("/support/tv/special/beans/rimo/images/bg_mod-linkButton.jpg");
	background-size: contain;
	border: 2px solid #bcbcbc;
	border-radius: 10px;
	color: #333;
	display: inline-block;
	text-decoration: none;
	box-sizing: border-box;
}

#contents .btnArea > ul.btnList > li > a span.textLink.inner{
	display: block;
	padding: 10px 15px;
	background: url(/support/tv/special/beans/rimo/images/arrow_black-b.png) no-repeat;
	margin-left: 10px;
	background-position: 0 22px;
}



/* 20240402 */
#contents .btnArea > ul.btnList > li > a span.s5-linkV3.s5-linkV3--down{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	color: #333;
	background: none;
}

#contents .btnArea > ul.btnList > li > a span.s5-linkV3.s5-linkV3--down:after{
	display: inline-block;
	width: 0.8em;
	height: 0.8em;
	margin-left: 5px;
	background: url(/share5/svg/icon/angle-down.svg) no-repeat;
	background-size: contain;
}

@media (max-width: 414px){
	#contents .btnArea{
		flex-direction: column;
		padding: 1em 0;
	}
	#contents .btnArea > ul.btnList{
		padding-left: 0;
	}
	
}