@charset "utf-8";
/* CSS Document */

/* ----- style.css ----- */

/* OS support information (Global site) 用 css */

/****************************************************
 00. reset
****************************************************/
/* 初期値 リセット */
*,
::before,
::after{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, u, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video{
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	}

hr{
	height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main{
	display:block;
	}


/****************************************************
000. template
****************************************************/
/* ########## 768px 以上 ########## */
@media screen and (min-width:768px){
	
	
	}

/* ########## 768px 未満 ########## */
@media screen and (max-width:767px){
	
	
	}

/* ########## 600px 以上 768px 未満 ########## */
@media screen and (min-width:600px) and (max-width:767px){
	
	
	}

/* ########## 600px 未満 ########## */
@media screen and (max-width:599px){
	
	
	}


/****************************************************
 01. base
****************************************************/
body{
	max-width:1000px;		/*ページの最大幅*/
	padding:0 auto;		/*  */
	margin:0 auto;		/*コンテンツの表示をページのセンターにする*/
	background-color:white;		/*ページの背景色*/
	font-family:"Avenir","Helvetica Neue","Helvetica","Arial", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", "Meiryo", "游ゴシック", "Yu Gothic", "ＭＳ Ｐゴシック", sans-serif;		/*フォントタイプの設定*/
	font-size:1.0em;		/*文字サイズの設定*/
	}


/****************************************************
 02. header
****************************************************/
header{
	margin:0 auto;		/*  */
	color:#fff;		/*  */
	}


/* ============================== blue bar ============================== */
header .blue_bar{
	background-color:#0d2ea0;		/*  */
	height:60px;		/*  */
	position:relative;		/*  */
	}

header .blue_bar:after{
	content:"";			/*  */
	display:block;			/*  */
	clear:both;			/*  */
	}


/* ============================== Logo ============================== */
header .blue_bar .left_logo{
	float:left;		/**/
	width:50%;		/**/
	height:60px;		/**/
	}

header .blue_bar .brother_logo{
	display:inline-block;
	width:104px;		/*  */
	height:40px;		/*  */
	position:absolute;		/*  */
	padding-top:10px;		/*  */
	padding-bottom:10px;		/*  */
	padding-left:16px;		/*  */
	}

header .blue_bar .left_logo:after{
	content:"";			/*  */
	display:block;			/*  */
	clear:both;			/*  */
	}


/* ============================== menu ============================== */
header .blue_bar .right_menu{
	float:right;		/**/
	width:50%;		/**/
	height:60px;		/**/
	text-align:right;		/**/
	}

header .blue_bar .right_menu:after{
	content:"";			/*  */
	display:block;			/*  */
	clear:both;			/*  */
	}


/****************************************************
 03. contents (main)
****************************************************/
/* ============================== メイン ============================== */
main{
	margin:0 auto;
	}


/* ============================== パンくずリスト ============================== */
main .breadcrumbs{
	display:block;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	margin-left:0px;
	padding-top:0px;
	padding-right:2px;
	padding-bottom:0px;
	padding-left:20px;
	font-size:0.75em;
	line-height:2.0em;
	background-image:url(css_img/common_icon_home.png);
	background-repeat:no-repeat;
	background-size:auto;
	background-position:2px center;
	background-origin:padding-box;
	background-clip:border-box;
	}

main .breadcrumbs ul{
	display:inline-block;
	list-style:none;
	margin-left:3px;
	vertical-align:middle;
	}

main .breadcrumbs li{
	list-style:none;
	float:left;
	vertical-align:middle;
	margin-right:6px;
	padding-right:3px;
	}

main .breadcrumbs li:after{
	content:"";
	display:inline-block;
	vertical-align:middle;
	text-decoration:none;
	width:6px;
	height:6px;
	border-top:1px solid #333;
	border-right:1px solid #333;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	margin-top:0;
	margin-left:3px;
	}

main .breadcrumbs li:last-child::after{
	padding-right:0;
	border: none;
	}

main .breadcrumbs a{
	color: #1a74ba;
	text-decoration: none;
	}

/* ########## 600px 未満 ########## */
@media screen and (max-width:599px){
	main .breadcrumbs{
		display:block;
		margin-top:0px;
		margin-right:0px;
		margin-bottom:0px;
		margin-left:0px;
		padding-top:0px;
		padding-right:2px;
		padding-bottom:0px;
		padding-left:2px;
		font-size:0.75em;
		line-height:2.0em;
		color: #fff;
		background-image:none;
		background-color: #51536d;
		}

	main .breadcrumbs ul{
		display:inline-block;
		list-style:none;
		margin-left:3px;
		vertical-align:middle;
		}

	main .breadcrumbs li{
		list-style:none;
		float:left;
		vertical-align:middle;
		margin-right:6px;
		padding-right:3px;
		}

	main .breadcrumbs li:last-child{
		display:none;
		}

	main .breadcrumbs li:after{
		content:"";
		display:inline-block;
		vertical-align:middle;
		text-decoration:none;
		width:6px;
		height:6px;
		border-top:1px solid #fff;
		border-right:1px solid #fff;
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
		margin-top:0;
		margin-left:3px;
		}

	main .breadcrumbs li:nth-last-child(2)::after{
		display:none;
		}

	main .breadcrumbs a{
		color: #fff;
		text-decoration: none;
		}
	}
/* ↑↑↑↑↑↑↑↑↑↑ 600px 未満 ↑↑↑↑↑↑↑↑↑↑ */

main .breadcrumbs:after{
	content:"";			/*  */
	display:block;			/*  */
	clear:both;			/*  */
	}


/* ============================== コンテンツ ============================== */
main .contents{
	padding-top:0.5em;
	padding-right:0.5em;
	padding-bottom:0.5em;
	padding-left:0.5em;
	font-size:90%;
	}

main .contents a,
main .contents a:after{
	color:#1a74ba;
	text-decoration:none;
	}
main .contents a:hover, 
main .contents a:focus, 
main .contents a:active{
	color:#ba1a31;
	text-decoration:underline;
	}


/* ============================== セクション ブロック ============================== */
main .contents .mod-heading{
	margin-top:0.25em;		/*セクション間の間隔（上）*/
	margin-bottom:0.5em;		/*セクション間の間隔（下）*/
	}

main .contents .os-info-top, 
main .contents .os-support-list{
	margin-top:1.0em;		/*セクション間の間隔（上）*/
	margin-bottom:2.0em;		/*セクション間の間隔（下）*/
	}

main .contents .box-support-list, 
main .contents .box-category-list{
	margin-top:1.0em;		/*セクション間の間隔（上）*/
	margin-bottom:2.0em;		/*セクション間の間隔（下）*/
	}

main .contents .box-list-info, 
main .contents .tbl-model-list{
	margin-top:0.5em;		/*セクション間の間隔（上）*/
	margin-bottom:0.5em;		/*セクション間の間隔（下）*/
	}

main .compatibility-symbols-info, 
main .contents .os-supplemental-info{
	margin-top:0.5em;		/*セクション間の間隔（上）*/
	margin-bottom:0.5em;		/*セクション間の間隔（下）*/
	}


/* ============================== 見出し ============================== */
/* [h1] 太字 */
main .contents h1{
	display:block;
	margin-top:0.25em;		/*行の間隔（上）*/
	margin-right:0px;		/* */
	margin-bottom:0.5em;		/*行の間隔（下）*/
	margin-left:0px;		/* */
	padding-top:0px;		/*余白*/
	padding-right:0px;		/*余白*/
	padding-bottom:0px;		/*余白*/
	padding-left:0px;		/*余白*/
	color:#000000;			/*文字の色*/
	background-color: #ffffff;		/*背景色*/
	border:none;		/*ボックスの囲み線*/
	line-height:1.5em;		/*行の高さ*/
	font-size:1.5em;		/*文字のサイズ*/
	font-weight:bold;		/*文字の太さ*/
	}

/* ########## 600px 未満 ########## */
@media screen and (max-width:599px){
	main .contents h1{
		line-height:1.5em;		/*行の高さ*/
		font-size:1.25em;		/*文字のサイズ*/
		}
	}
/* ↑↑↑↑↑↑↑↑↑↑ 600px 未満 ↑↑↑↑↑↑↑↑↑↑ */


/* [h2] 左に線＋背景色＋全体を線で囲む */
main .contents h2{
	position:relative;		/**/
	margin-top:1.0em;		/*行の余白（前）*/
	margin-bottom:0.5em;		/*行の余白（後）*/
	padding-top:0.5em;		/*余白*/
	padding-right:0.5em;		/*余白*/
	padding-bottom:0.5em;		/*余白*/
	padding-left:1.5em;		/*余白*/
	border:1px solid #e6e6e6;		/*ボックスの囲み線*/
	border-radius:2px;		/*ボックスを角丸にする*/
	line-height:1.5em;		/*行の高さ*/
	font-size:1.1em;		/*文字のサイズ*/
	font-weight:bold;		/*文字の太さ*/
	background-color:#f6f6f6;
}
main .contents h2:after{
	position:absolute;		/**/
	top:50%;		/**/
	left:0.7em;		/**/
	transform:translateY(-50%);		/**/
	content:" ";		/**/
	width:5px;		/**/
	height:25px;		/**/
	background-color:#7fa308;		/**/
	border-radius:4px;		/**/
}

main .contents h2 span{
	vertical-align:middle;
	padding-left:0.25em;		/*余白*/
}

/* ########## 600px 未満 ########## */
@media screen and (max-width:599px){
	main .contents h2{
		font-size:1.0em;		/*文字のサイズ*/
		}
	}
/* ↑↑↑↑↑↑↑↑↑↑ 600px 未満 ↑↑↑↑↑↑↑↑↑↑ */


/* [h3] 途中で下線の色を変える */
main .contents h3{
	// margin-left:10px;
	position:relative;		/**/
	margin-top:1.0em;		/*行の余白（前）*/
	margin-bottom:1.0em;		/*行の余白（後）*/
	padding-top:0.5em;		/*余白*/
	padding-right:0.1em;		/*余白*/
	padding-bottom:0.25em;		/*余白*/
	padding-left:0.1em;		/*余白*/
	border-bottom:solid 3px #dedede;		/*下線1*/
	line-height:1.2em;		/*行の高さ*/
	font-size:1.0em;		/*文字のサイズ*/
	font-weight:bold;		/*文字の太さ*/
	}

main .contents h3:after{
	position:absolute;		/**/
	content:" ";		/**/
	display:block;		/**/
	border-bottom:solid 3px #7fa308;		/*下線2*/
	bottom:-3px;		/**/
	width:1.5em		/*下線2の長さ*/
	}

main .contents h3 span{
	vertical-align:middle;
	padding-left:0.25em;		/*余白*/
}
/* ########## 600px 未満 ########## */
@media screen and (max-width:599px){
	main .contents h3{
		
		}
	}
/* ↑↑↑↑↑↑↑↑↑↑ 600px 未満 ↑↑↑↑↑↑↑↑↑↑ */


/* [h4] */
main .contents h4{
	// margin:10px 20px;
	padding: 5px 9px;
	border: 1px solid #E6E6E6;
	border-bottom: 2px solid #A6C814;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-ms-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: inset 0 0 1px white, 0 1px 1px rgba(0, 0, 0, .2);
	-moz-box-shadow: inset 0 0 1px #fff, 0 1px 1px rgba(0,0,0,.2);
	-ms-box-shadow: inset 0 0 1px #fff, 0 1px 1px rgba(0,0,0,.2);
	-o-box-shadow: inset 0 0 1px #fff, 0 1px 1px rgba(0,0,0,.2);
	box-shadow: inset 0 0 1px white, 0 1px 1px rgba(0, 0, 0, .2);
	}

/* [h5] */
main .contents h5{
	// margin:20px 30px;
	padding: 0 2px 5px;
	background: url(css_img/icon_dot_g_r_01.gif) left bottom repeat-x;
	}


/* ============================== 区切り ============================== */
/* [hr] 区切り */
main .contents hr{
	border-top:1px solid #fff;
	border-bottom:1px solid #ccc;
}


/* ============================== 段落 ============================== */
/* [p] 段落 */
main .contents .mod-heading p.leadtxt{
	margin-top:0;		/*行の間隔（上）*/
	margin-right:0;		/* */
	margin-bottom:0;		/*行の間隔（下）*/
	margin-left:0;		/* */
	color:#7fa308;			/*文字の色*/
	line-height:1.0em;		/*行の高さ*/
	font-size:1.0em;		/*文字のサイズ*/
	font-weight:bold;		/*文字の太さ*/
	}

main .contents .os-info-top p, 
main .contents .box-list-info p{
	line-height:1.25em;		/*行の高さ*/
	font-size:1.0em;		/*文字のサイズ*/
	font-weight:normal;		/*文字の太さ*/
	}


/* ============================== リスト ============================== */
main .contents .os-supplemental-info ol{
	counter-reset:list;
	list-style-type:none;
	font-size:0.9em;
	font-weight:normal;
	margin-bottom:1.0em;		/*  */
	margin-top:1.0em;			/*  */
	margin-left:1.0em;			/*  */
	margin-right:1.0em;			/*  */
	padding:0;			/**/
	}

main .contents .os-supplemental-info li{
	line-height:1.5em;
	position:relative;
	padding-left: 2.0em;
	}

main .contents .os-supplemental-info li:before{
	counter-increment:list;
	content:"*"counter(list)" : ";
	display:inline-block;		/**/
	vertical-align:middle;		/**/
	text-decoration:none;		/**/
	margin-top:-0.25em;		/**/
	margin-right:0.5em;		/**/
	margin-left:-3px;		/**/
	position: absolute;
	left: 0.20em;
	top: 0.20em;
	}

main .contents .compatibility-symbols-info{
	display: flex;		/**/
	justify-content: flex-end;		/* 要素を右寄せする */
	}

main .contents .compatibility-symbols-info ul{
	display:inline-block;		/**/
	list-style:none;		/**/
	font-size:0.9em;		/*文字のサイズ*/
	margin-bottom:0.25em;		/*  */
	margin-top:0.25em;			/*  */
	margin-left:0;			/*  */
	margin-right:0.5em;			/*  */
	padding:0;			/**/
	}

main .contents .compatibility-symbols-info li{
	float:left;		/**/
	padding-right:2.0em;		/**/
	line-height:1.5em;		/**/
	}

main .contents .compatibility-symbols-info li:last-child{
	padding-right:0;		/**/
	}

main .contents .compatibility-symbols-info:after{
	content:"";			/*  */
	display:block;			/*  */
	clear:both;			/*  */
	}


/* ============================== テーブル ============================== */

main .contents .tbl-model-list table{
	table-layout:fixed;
	width:100%;		/**/
	/*font-size:0.9em;*/		/*文字のサイズ*/
	margin-bottom:0.5em;		/*  */
	margin-top:0.75em;			/*  */
	margin-left:0;			/*  */
	margin-right:0;			/*  */
	}

main .contents .tbl-model-list table{
	border-collapse:collapse;		/**/
	}

main .contents .tbl-model-list .col01{
	width: 64%;		/**/
	}

main .contents .tbl-model-list .col02{
	width: 36%;		/**/
	}

main .contents .tbl-model-list thead th{
	border:1px solid #dedede;		/**/
	vertical-align: middle;		/**/
	padding:0.5em 0.5em;		/*要素の内側の余白（上下、左右）*/
	font-weight: bold;		/**/
	font-size:1.0em;		/*文字のサイズ*/
	line-height:1.5em;		/**/
	text-align:center;		/**/
	background:#8f8f8f;		/**/
	color:#ffffff;		/**/
	}

main .contents .tbl-model-list thead th.thc01{
			/**/
	}

main .contents .tbl-model-list thead th.thc02{
			/**/
	}

main .contents .tbl-model-list tbody td{
	border:1px solid #dedede;		/**/
	vertical-align:middle;		/**/
	padding:0.5em 1.0em;		/*要素の内側の余白（上下、左右）*/
	font-weight:normal;		/**/
	font-size:0.90em;		/*文字のサイズ*/
	line-height:1.5em;		/**/
}

main .contents .tbl-model-list tbody th.tbc01{
	text-align:left;		/**/
}

main .contents .tbl-model-list tbody td.tbc02{
	text-align:center;		/**/
}

main .contents .tbl-model-list tbody tr:nth-child(even){
	background:#eee;		/**/
	}








/* ============================== ページ内のリンク (アンカー指定) ============================== */

main .contents .anchorList1{
	font-size:0.9em;		/*文字のサイズ*/
	line-height:1.0em;		/**/
	margin:1.5em 1.0em;		/*要素の外側の余白（上下、左右）*/
	}

main .contents .anchorList1 ul{
	display:inline-block;		/**/
	list-style:none;		/**/
	margin:0;		/**/
	padding:0;		/**/
	margin-left:-10px;		/**/
	margin-bottom:-15px;		/**/
	}

main .contents .anchorList1 li{
	float:left;		/**/
	padding-right:15px;		/**/
	border-right:solid 1px #656565;		/**/
	margin:0 0 15px 10px;		/**/
	}

main .contents .anchorList1 li:last-child{
	border-right:none;
	}

main .contents .anchorList1 a{
	color:#1a74ba;		/**/
	text-decoration:none;		/**/
	}

main .contents .anchorList1 a:after{
	content:"";		/**/
	display:inline-block;		/**/
	vertical-align:middle;		/**/
	text-decoration:none;		/**/
	width:6px;		/**/
	height:6px;		/**/
	border-top:2px solid #333;		/**/
	border-right:2px solid #333;		/**/
	-webkit-transform:rotate(-225deg);
	transform:rotate(-225deg);		/**/
	margin-top:-.45em;		/**/
	margin-left:10px;		/**/
	}

main .contents .anchorList1 a:active,
main .contents .anchorList1 a:hover{
	outline-width:0;		/**/
	}

main .contents .anchorList1 a:hover, 
main .contents .anchorList1 a:focus{
	opacity:0.6;		/**/
	}

main .contents .anchorList1 a:hover, 
main .contents .anchorList1 a:focus, 
main .contents .anchorList1 a:active{
	color:#ba1a31;		/**/
	text-decoration:underline;		/**/
	}


/* ============================== ページ外のリンク (サイト内は相対パスで指定) ============================== */

main .contents .linkList1{
	margin:2em 0 2em 0;		/*要素の外側の余白（上、右、下、左）*/
	}

main .contents .linkList1 ul{
	list-style:none;		/**/
	margin:0 1.0em;		/*要素の外側の余白（上下、左右）*/
	padding:0;		/**/
	}

main .contents .linkList1 li{
	padding-left:1em;		/**/
	text-indent:-1em;		/**/
	margin-bottom:7px;		/**/
	}

main .contents .linkList1 a{
	color:#1a74ba;		/**/
	text-decoration:none;		/**/
	}

main .contents .linkList1 a:before{
	content:"";		/**/
	display:inline-block;		/**/
	vertical-align:middle;		/**/
	text-decoration:none;		/**/
	width:6px;		/**/
	height:6px;		/**/
	border-top:2px solid #333;		/**/
	border-right:2px solid #333;		/**/
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);		/**/
	margin-top:-.25em;		/**/
	margin-right:11px;		/**/
	margin-left:-3px;		/**/
	}

main .contents .linkList1 a:hover, 
main .contents .linkList1 a:focus{
	opacity:0.6;		/**/
	}

main .contents .linkList1 a:hover, 
main .contents .linkList1 a:focus, 
main .contents .linkList1 a:active{
	color:#ba1a31;		/**/
	text-decoration:underline;		/**/
	}

/* ============================== 行間 ============================== */
.mod-mb10em{
	margin-bottom:1.0em;		/**/
	}
.mod-mb15em{
	margin-bottom:1.5em;		/**/
	}
.mod-mb20em{
	margin-bottom:2.0em;		/**/
	}
.mod-mb25em{
	margin-bottom:2.5em;		/**/
	}
.mod-mb30em{
	margin-bottom:3.0em;		/**/
	}



/****************************************************
 04. Back to the top on this page
****************************************************/

.backToTop{
	display:none;		/**/
	}

.backToTop.showButton{
	display:block;		/**/
	}

.button-backToTop{
	box-sizing:border-box;		/**/
	width:50px;		/**/
	height:50px;		/**/
	position:fixed;		/**/
	right:20px;		/**/
	bottom:20px;		/**/
	background:#fff;		/**/
	border:solid 1px #ccc;		/**/
	}

.button-backToTop:hover, 
.button-backToTop:focus{
	opacity:0.6;
	}
.button-backToTop:active, 
.button-backToTop:hover{
	outline-width:0;
	}

.button-backToTop:before{
	content:"";		/**/
	display:inline-block;		/**/
	vertical-align:middle;		/**/
	text-decoration:none;		/**/
	width:6px;		/**/
	height:6px;		/**/
	border-top:2px solid #333;		/**/
	border-right:2px solid #333;		/**/
	-webkit-transform:rotate(-45deg);
	transform:rotate(-45deg);		/**/
	border-color:#333;		/**/
	position:absolute;		/**/
	top:2px;		/**/
	right:0;		/**/
	bottom:0;		/**/
	left:0;		/**/
	margin:auto;		/**/
	}


/****************************************************
05. hooter
****************************************************/

footer{
	text-align:center;
	border-top:1px solid #999999;
	font-size:0.8em;
	background:#eeeeee;
	margin-top:1.0em;
	margin-bottom:1.0em;
	padding:0.5em 0.1em;
	}


footer ul{
	display:inline-block;
	margin:0.1em 2em;
	}


footer li{
	list-style:none;
	float:left;
	margin-right:1.0em;
	padding-right:1.0em;
	border-right:solid 1px #999999;
	}


footer li:last-child{
	padding-right:0;
	border-right:none;
	}


footer .txt-copyright{
	color:#808080;
	text-align:center;
	margin:0.5em;
	}


footer a{
	color:#1a74ba;
	text-decoration:none;
	}


footer a:hover, footer a:focus, footer a:active{
	color:#ba1a31;
	text-decoration:underline;
	}


/****************************************************
99. template
****************************************************/

/* ########## 768px 以上 ########## */
/*@media screen and (min-width:768px){
	
	
	}*/


/* ########## 768px 未満 ########## */
/*@media screen and (max-width:767px){
	
	
	}*/


/* ########## 600px 以上 768px 未満 ########## */
/*@media screen and (min-width:600px) and (max-width:767px){
	
	
	}*/


/* ########## 600px 未満 ########## */
/*@media screen and (max-width:599px){
	
	
	}*/


