/*
このcssファイルには以下の段落が存在します。
段落名で検索することで、該当の行へアクセスできます。
 */
/* 全体 */
/* ヘッダーテーブル */
/* サイドテーブル */
/* 本体テーブル */
/* 共通部分CSS /common/css/cable-chart.css */

/* レイアウト変更用css */
/* 追加パーツ */






/* レイアウト変更用css  /////////////////////////////////////////////////////////////////////////////// */
/*
 サイドテーブルの幅 及び 本体とヘッダーテーブルの左マージン
*/
.u-sideTable__width{
	width: 220px;
}

.c-charttab__content__item em.slash{
	display:none;
}

@media only screen and (min-width:641px) {
	.u-sideTable__width{
		width: 220px;
	}
}

.u-scrollableTable__leftmargin{
	margin: 0 0 0 220px;
}
@media only screen and (min-width:641px) {
	.u-scrollableTable__leftmargin{
		margin: 0 0 0 220px;
	}
}

/* fixed見出し 青背景 */
.c-charttab__head__sidefixed{
	position: absolute;
	padding-bottom: 0px;
	width:calc(220px + 1px) ;
	margin-left: auto;
	z-index: 1;
	bottom: -1px;
	left: 0;
	display: block;
}
@media only screen and (min-width:641px) {
	.c-charttab__head__sidefixed{
		width:calc(220px + 1px);
	}
}

/*
主にPC表示時、テーブル幅よりセル数が少ないとき、
右端のセルにボーダーを追加
*/
@media only screen and (min-width:1222px) {
	.c-charttab-data td:nth-child(4):after{
		width: 1px;
	}
}
@media only screen and (min-width:1222px) {
	.c-charttab-data td:nth-child(6):after{
		width: 1px;
	}
}
@media only screen and (min-width:1222px) {
	.c-charttab-data td:nth-child(7):after{
		width: 1px;
	}
}

/*
	ヘッダーテーブルと本体テーブルのセルの横幅に係る要素
	ブレイクポイントごとに同じ横幅を指定してください
*/
.c-charttab__head td {
	background: #FFF;
	}
.c-charttab__head__item{
	padding-top: 10px;
	padding-bottom: 10px;
}
.c-charttab__itemwidth td{
	width: 270px;
	text-align: center;
}
@media only screen and (min-width:641px) {
	.c-charttab__itemwidth td{
		width: 270px;
	}
}
.c-charttab__itemwidth td >div{
	width: 270px;
	padding-left: 10px;
	padding-right: 10px;
}
@media only screen and (min-width:641px) {
	.c-charttab__itemwidth td >div{
		width: 270px;
		padding-left: 5px;
		padding-right: 5px;
	}
}


/* サイドテーブルと本体テーブルのセルの、高さに係る要素 */
.c-charttab__itemheight td >div{
	padding-top: 10px;
	padding-bottom: 10px;
	display: table-cell;

}
_:-ms-lang(x)::-ms-backdrop, .c-charttab__left td >div{
 /* IE11 のみ適用される */
 padding-bottom: 10px;
}

/* 見出し テキスト */
.c-chart__table__titwrap{
	margin-top: 40px;
}
@media screen and (min-width:641px) {
	.c-chart__table__titwrap{
		margin-top: 40px;
	}
}

.c-section-ttl__blb{
	border-left-color: #125a9e;
	border-left-width: 4px;
	border-left-style: solid;
	font-size: 116%;
	font-weight: bold;
	padding: 0 0 0 8px;
	line-height: 1.2;
	margin-top: 25px;
}
@media only screen and (min-width:641px) {
	.c-section-ttl__blb{
		margin-top: 40px;
	}
}

.c-chart__table__txt{
	margin-top: 10px;
	margin-left: 0;
}
@media only screen and (min-width:641px) {
	.c-chart__table__txt{
		margin-top: 20px;
	}
}


tr.abcabc td div.c-charttab__content__item{
	vertical-align: middle;
}


/* 追加パーツ /////////////////////////////////////////////////////////////////////////////// */
/*
ページごとに追加のcssが必要な際は以下に追記してください。
sampleファイルには過去制作したページの追加cssが記載されています。
 */


ul.series-list{
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #828282;
	padding: 0 0 0.75em 0;
	margin: 0 0 0.5em 0;
}
ul.series-list li{
	font-size: 85%;
	padding:0 0 0.5em;
	display:inline-block;
}
p.option{
	padding: 0.25em 0.5em;
	margin: 0 0 0 0;
	/* [disabled]float: left; */
	clear: both;
	/* [disabled]width: 940px; */
	color: #666;
	text-align: right;
	font-size: 85%;
}
/*
p.option{
	font-size: 85%;
	padding: 1em 15px 1em;
	margin: 0;
	line-height:1.8;
}
p.option span{
	font-size:93%;
	color:#666;
}
*/


.rowHighlight {
	background-color: #e8eef5;
}
.columnHighlight {
	background-color: #e8eef5;
}


h2 span {
	display: inline;
	font-size:60%;
}

tr.product-list ul {
	width: 100%;
}
tr.product-list a {
	color: #2051b2;
}
tr.product-list a:hover {
	text-decoration: underline;
}

.func-icons {
	vertical-align: top;
}
.func-icons ul{
	width: 100%;
}
.func-icons ul li {
	background: #2f6ab9;
	color: #FFF;
	padding: 6px 3px;
	margin: 0 0 0.5em 0;
	border-radius: 3px;
	font-size: 85%;
}
.func-icons ul li span {
	display: block;
	font-size:80%;
}

tr.accessories td {
	text-align:left;
}


.c-section-conectlist__bluehead{
	position: relative;
	padding-bottom: 0px;
	width: calc(100% - 130px);
	margin-left: auto;
	height: 44px;
}
@media only screen and (min-width:641px) {
	.c-section-conectlist__bluehead{
		width: calc(100% - 200px);
	}
}
.c-section-conectlist__bluehead__img{
	width: 100%;
}
.c-section-conectlist__bluehead__tit{
	position: relative;
	background-color: #004994;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 44px;
	color: #fff;
	font-weight: bold;
	border-bottom: solid 1px #cccccc;
	/*! border-bottom:none; */
	font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
}
.c-section-conectlist__bluehead__tit .c-section-conectlist__bluehead__txt{
	margin-left: 5px;
}

.u-fix{
	position: relative;
	height: 100%;
}

.u-fix_bn{
	position: absolute;
	top: 10px;
	left: 10px;
}

.c-charttab__left__item {
	text-align:left;
	line-height: 1.8;
}
.c-charttab__left__item__img{
	text-align: center;
	font-weight: bold;
	width: 110px;
}
@media only screen and (min-width:641px) {
	.c-charttab__left__item__img{
		top: 20px;
		left: 10px;
		padding-bottom: 0px;
		margin-bottom: 15px;
		width: 150px;
	}
}
.c-charttab__left__item__img img{
	width: 96px;
	height: auto;
}
@media only screen and (min-width:641px) {
	.c-charttab__left__item__img img{
		width: 140px;
	}
}

a.c-section-destinations__item{
	border: 1px solid #cacaca;
	display: inline-block;
	width: 100%;
	margin-top: 20px;
	box-shadow: 0 7px 11px rgba(0, 0, 0, 0.05), 0 1px 5px rgba(0, 0, 0, 0.1);
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
@media only screen and (min-width:980px)  {
	a.c-section-destinations__item{
		background-color: #fff;
		transition: all 0.2s;
	}
}
@media only screen and (min-width:980px) {
	a.c-section-destinations__item:hover{
		box-shadow: 0 6px 22px rgba(0, 0, 0, 0.1), 0 3px 10px rgba(0, 0, 0, 0.2);;
		opacity: 0.6;
	}
}

.c-section-destinations__item__content{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	padding: 10px;
}
@media only screen and (min-width:641px)  {
	.c-section-destinations__item__content{
		padding: 15px;
	}
}


.c-section-destinations__item__img{
	width: 60px;
	height: auto;
}
.c-section-destinations__item__img img{
	width: 60px;
	height: auto;
}


.c-section-destinations__word{
	width: calc(100% - 75px);
}


.c-section-destinations__subtit{
	font-size: 108%;
	color: #004994;
	font-weight: bold;
	line-height: 1.3;
}


.c-section-destinations__subtxt{
	font-size: 89%;
	margin-top: 5px;
	line-height: 1.4;
}

/*Windows NAS タイトル調整　20190823*/
.c-heading-2__title{
display: inline!important;
margin-right: 0.25em!important;
}
.c-heading-2__desc{
	display: inline!important;
}

p.option {
    font-size: 85%;
    padding: 1em 15px 1em;
    margin: 0;
    line-height: 1.8;
    text-align: left;
}












