@charset "shift_jis";
/* ==========================================================================
	bravia-biz support products fw_bz css index.css
========================================================================== */
body {
    line-height: 1.6;
}

#mod-productsArea .titleArea h2,
#productsArea .title h2,
#purposeArea .title h2,
#productNews .title h2.main_title,
#inquiry .title h2 {
	clear: both;
	color: #666;
	font-size: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid #D0D0D0;
	padding: 0 0 5px 15px;
}
.pageSubContent#productNews #info .title h3,
.pageSubContent #menu-cat-03 .title h3 {
	clear: both;
	color: #666;
	font-size: 16px;
	padding: 0 0 5px 5px;
	margin-bottom: 15px;
	border-bottom: 1px solid #D0D0D0;
	position: relative;
}

/* mod-productsArea */
#mod-productsArea .mod-productsArea-inner {
	width: 950px;
	margin: 0 auto;
	text-align: center;
}
.topArea .imgArea {
	float: left;
	width: 250px;
	text-align: right;
	padding: 0;
	margin-top: 20px;
	margin-left: 40px;
}
.topArea .txtArea {
	float: right;
	width: 570px;
	text-align: left;
	margin-top: 30px;
}
.topArea .txtArea .productName {
	font-size: 26px;
	font-weight: 700;
	margin-bottom: 10px;
}

/*20210106追加*/
.topArea .txtArea .modelName {
	font-size: 20px;
}

/* productsArea purposeArea */
ul.btn_area_text {
	width: 950px;
	margin: 0 auto 50px;
	padding: 0;
}
ul.btn_area_text li {
	float: left;
	padding: 5px;
	width: 178px;
}
ul.btn_area_text .mod-linkButton {
	background: url(/bravia-biz/support/products/common/images/bg_mod-linkButton.jpg) repeat-x scroll 0 0;
	border: 1px solid #bcbcbc;
	border-radius: 6px;
	color: #333;
	cursor: pointer;
	display: inline-block;
	font-size: 12px;
/*	height: 120px;*/
	letter-spacing: 0.01em;
	line-height: 1.4;
	text-align: center;
	width: 178px;
	vertical-align: middle;
	transition: opacity .2s ease-in 0s;
/*	2023/05/01追記*/
	height: 8.625rem;
    background-size: contain;
}
ul.btn_area_text .mod-linkButton a {
	display: block;
	padding: 10px;
	color: #333;
	-webkit-transition: opacity .2s ease-in 0s;
	-moz-transition: opacity .2s ease-in 0s;
	-ms-transition: opacity .2s ease-in 0s;
	-o-transition: opacity .2s ease-in 0s;
	transition: opacity .2s ease-in 0s;
}
ul.btn_area_text .mod-linkButton .figure {
	display: block;
}
ul.btn_area_text .mod-linkButton .figure img {
	padding-bottom: 5px;
    max-width: none;
    display: inline-block;
}
ul.btn_area_text .mod-linkButton .content {
	background: url(/bravia-biz/support/products/common/images/arrow_black.png) no-repeat scroll 2px 4px;
	line-height: 16px !important;
	padding-left: 12px;
	margin-left: 0;
	display: inline-block;
}
/*20201020追記*/
ul.btn_area_text .mod-linkButton a:hover{
	opacity: .5;
    filter: alpha(opacity=50);
    -ms-filter: "alpha(opacity=50)";
    -moz-opacity: .5;
    -khtml-opacity: .5;
    zoom: 1;
    text-decoration: none;
    letter-spacing: .01em;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
ul.btn_area_text .mod-linkButton .commingsoon{
	cursor: default !important;
}

/*20201020追記*/
#mod-productsArea ul{
	margin: 1em 0 1em 0.3em;
    padding: 0;
}
#mod-productsArea ul li{
	float: left;
    padding: 8px 8px 8px 6px;
    width: 300px;
}
#mod-productsArea div.mod-linkButton{
    width: 300px;
	background: none;
    height: 90px;
	box-shadow: 5px 5px 5px rgba(0,0,0,0.2);
}
#mod-productsArea div.mod-linkButton a{
	overflow: hidden;
	padding: 10px;
}
#mod-productsArea div.mod-linkButton a:hover{
	opacity: .5;
    filter: alpha(opacity=50);
    -ms-filter: "alpha(opacity=50)";
    -moz-opacity: .5;
    -khtml-opacity: .5;
    zoom: 1;
    text-decoration: none;
    letter-spacing: .01em;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
#mod-productsArea div.mod-linkButton span.figure{
	float: left;
    display: inline-block;
}
#mod-productsArea div.mod-linkButton span.content{
	line-height: 16px !important;
    padding-left: 12px;
    float: left;
    margin: 15px 0 0 10px;
    color: #43677e;
    font-weight: 700;
}


/* productNews inquiry */
#info,
#menu-cat-03 {
	width: 565px;
	float: left;
	margin: 0 15px 0;
}
#productNews .productNews_area {
	margin: 0 auto 50px;
	padding: 0;
}
#productNews .productNewsList,
.js-include-list {
	margin: 0 5px;
}
.pageSubContent ul,
#info ul,
#info ul {
	zoom: 1;
	padding-left: 0;
}
#productNews .productNewsList .info-date,
.newsContent .js-include-list .info-date {
	display: block;
	margin: 10px 0 0;
	padding-left: 0;
	font-size: 16px;
	font-weight: 400;
	color: #333;
}

#productNews .productNewsList .info-description,
.newsContent .js-include-list .info-description {
	margin: .2em 0 .5em;
    padding: 0 0 0 10px;
    line-height: 1.5;
    background: url(/support/share/images/arrow_black.png) no-repeat left .4em;
    word-break: break-all;
	font-size:16px;
}


#inquiry ul.txtlink {
	margin-left: 5px;
}
#inquiry ul.txtlink li {
	display: block;
	font-size: 16px;
	font-weight: 400;
	color: #333;
}

.icon-importance {
    background: url(/support/share/images/bt-02.gif) left top no-repeat !important;
    padding-left: 20px !important;
}






/*
----------------------------------------------------------------------------
画面幅＜640px＞以下のときに適用
----------------------------------------------------------------------------
*/
@media screen and (max-width: 640px) {
	#mod-productsArea .mod-productsArea-inner {
		width: 96%;
		margin: 0 10px 0 10px;
	}
	.mod-productsArea-inner .productsArea-main {
		text-align: left;
		width: 100%;
	}
	.mod-productsArea-inner .topArea {
		text-align: left;
		width: 100%;
	}
	.topArea .imgArea {
		width: 40%;
		padding: 0 0 10px;
		vertical-align: top;
		float: none;
		display: inline-block;
		margin-left: 0px;
	}
	.topArea .imgArea img {
		width: 100%;
		height: auto;
		margin: 0;
	}
	.topArea .txtArea {
		text-align: left;
		width: 55%;
		padding-bottom: 10px;
		float: none;
		display: inline-block;
	}
	.topArea .txtArea .productNameSub,
	.topArea .txtArea .modelName {
		font-size: .71429em;
		margin: 0 auto;
	}
	.topArea .txtArea .productName {
		margin: 0 auto 5px auto;
	}
	ul.btn_area_text {
		width: auto;
		margin-left: 0!important;
		margin-right: 0!important; 
	}
	#info, #menu-cat-03 {
		width: 94%;
		margin-bottom: 30px;
	}
	#inquiry {
		margin-bottom: 50px;
	}
	
	/*20201020追記*/
	#mod-productsArea ul{
		margin: 1em 0;
	}
	#mod-productsArea ul li{
		width: 45%;
    	max-height: 90px;
	}
	#mod-productsArea div.mod-linkButton{
		background: none;
		letter-spacing: 0.01em;
		text-align: left;
		width: 97%;
		max-height: 90px;
		float: none;
	}
	#mod-productsArea div.mod-linkButton span.figure{
		/* float: none;
		margin: 10px 0 0 0; */
		display: table-cell;
	}
	#mod-productsArea div.mod-linkButton span.figure img{
		height: auto;
		vertical-align: middle;
		width: 40px;
		float: left;
		padding-bottom: 0;
	}
	#mod-productsArea div.mod-linkButton span.content{
		/* float: none; */
		margin: 0;
		background: url(/support/share/images/arrow_black.png) no-repeat scroll 2px 4px;
	}
	
}

@media screen and (max-width: 500px) {
	.topArea .txtArea .productName {
		font-size: 20px;
	}
}

@media screen and (max-width: 344px) {
	#mod-productsArea div.mod-linkButton span.content{
		word-break: break-all;
	}
}


/* 20210624 */

#purposeArea ul.btn_area_text.ml10{
	margin-left: 10px;
}

#productsArea ul.btn_area_text .mod-linkButton{
	box-sizing: border-box;
	height: 128px;
	background-position: 0 10px;
}

#productsArea ul.btn_area_text .mod-linkButton a {
	padding: 0;
	height: 100%;
}

#productsArea ul.btn_area_text .mod-linkButton .figure {
	padding-top: 10px;
}

a:focus-visible{
	outline: thin dotted;
}

/* 20220805 */
#mod-productsArea div.mod-linkButton span.tx8  {
    text-indent: 0.8em
}

#mod-productsArea {
	margin-bottom: 3em
}


@media screen and (max-width: 640px) {
	#mod-productsArea ul li {
		width: 100%;
		max-height: 90px;
	}
	
	#mod-productsArea div.mod-linkButton span.tx8 {
		text-indent: 0;
	}
	
	#mod-productsArea div.mod-linkButton span.content {
		margin: 0.5em 0 0 1em;
	}
	
	#mod-productsArea div.mod-linkButton {
		width: 97%;
		max-height: 60px;
	}
	
	#mod-productsArea ul li {
		max-height: 60px;
	}
	
		/*	2023/05/01追記*/	
	#purposeArea ul.btn_area_text li {
		float: none;
		width: calc(100% - 10px) !important;
		max-width: 100%;
	}
	#purposeArea ul.btn_area_text li > .mod-linkButton {
		background: url("/support/share/images/bg_mod-linkButton.jpg") repeat-x scroll 0 0;
		text-align: left;
		height: auto;
		width: 100%;
		max-width: 100%;
		background-size: contain;
		box-sizing: border-box;
	}
	
	#purposeArea ul.btn_area_text li > .mod-linkButton a{
		display: flex;
		align-items: center;
	}
	
	#purposeArea ul.btn_area_text li > .mod-linkButton a .figure img {
		height: auto;
	}
	#purposeArea ul.btn_area_text li > .mod-linkButton a img {
		width: 40px;
	}
	
	#purposeArea ul.btn_area_text li > .mod-linkButton a span.content,
	#purposeArea ul.btn_area_text li > .mod-linkButton a span.threeLine{
		margin: 0 0 0 1em !important;
		padding: 0 0 0 1em!important;
	}
	#purposeArea .mod-linkButton .font {
		font-size: 1rem;
	}
}

/* 2023/06/01 */
#productsArea ul.btn_area_text .mod-linkButton.comingsoon_h {
    height: 145px;
	padding: 0 0.5em;
}

#productsArea ul.btn_area_text .mod-linkButton.comingsoon {
    height: 145px;
	padding: 0 0.5em;
	cursor: default;
}

/* 2023/11/08 */
h3.s5-heading4 {
	margin: 30px 0 5px 10px;
}

#mod-productsArea ul.clearfix.btn_area_text.list {
	margin-top: 0;
}

#mod-productsArea div.mod-linkButton span.content.left {
	text-align: left;
}

/* 20231215 */
.annotation {
    padding-left: 1em;
    text-indent: -1em;
}
	
.mod-mainContentContainer a.textLink {
	display: inline;
	margin: 0 3px 0 0;
	background-position: 0px;
}


/* 20240404 */
#mod-productsArea ul li {
	width: calc((100% - 42px) / 3);
}

#mod-productsArea div.mod-linkButton{
	width: 100%;
	height: 5.625rem;
	max-height: unset;
	text-align: left;
	box-sizing: border-box;
}

#mod-productsArea div.mod-linkButton span.content,
#purposeArea ul.btn_area_text .mod-linkButton .content{
	line-height: 1.4 !important;
}

@media screen and (max-width: 640px) {
	#mod-productsArea ul li {
		width: 100%;
		height: auto !important;
		max-height: unset;
	}
	#mod-productsArea div.mod-linkButton{
		width: 100%;
		height: auto !important;
	}
}

/* 20250801 */

@media (max-width: 1249px){
	#menu-cat-03{
		margin-top: 10px;
	}
}


}
