@charset "UTF-8";

/*===================================================================
	reset
===================================================================*/
#header div, #header h1, #header h2, #header h3, #header h4, #header h5, #header h6, #header p, #header pre, #header blockquote, #header address, #header ul, #header ol, #header li, #header dl, #header dt, #header dd, 
#header table, #header caption, #header th, #header td, #header form, #header fieldset, #header textarea, #header iframe, 
#topicPath div, #topicPath h1, #topicPath h2, #topicPath h3, #topicPath h4, #topicPath h5, #topicPath h6, #topicPath p, #topicPath pre, #topicPath blockquote, #topicPath address, #topicPath ul, #topicPath ol, #topicPath li, #topicPath dl, #topicPath dt, #topicPath dd, #topicPath table, #topicPath caption, #topicPath th, #topicPath td, #topicPath form, #topicPath fieldset, #topicPath textarea, #topicPath iframe { margin:0; padding:0; }
#header p, 
#topicPath p { word-wrap:break-word; word-break:break-all; } /* For Japanese */
* html #header h1, * html #header h2, * html #header h3, * html #header h4, * html #header h5, * html #header h6, 
* html #topicPath h1, * html #topicPath h2, * html #topicPath h3, * html #topicPath h4, * html #topicPath h5, * html #topicPath h6 { height:1%; }
#header img, 
#topicPath img { line-height:1; border:none; vertical-align:top; }
#header table, 
#topicPath table { border:none; border-collapse:collapse; border-spacing:0; font-size:inherit; }
#header caption, #header th, #header td, 
#topicPath caption, #topicPath th, #topicPath td { text-align:left; }
#header a[name], 
#topicPath a[name] { color:#000; }
#header a[name]:hover, 
#topicPath a[name]:hover { color:#000; text-decoration:none !important; outline:0 !important; }
#header a img, 
#topicPath a img { color:#000; }
#header fieldset, 
#topicPath fieldset { border:none; }
#header input, #header textarea, #header select, 
#topicPath input, #topicPath textarea, #topicPath select { font-family:inherit; font-size:1em; }
#header input, 
#topicPath input { vertical-align:-3px; }
#header select, 
#topicPath select { vertical-align:middle; }
#header ul li, 
#topicPath ul li { list-style-type:none; }
#header li li, 
#topicPath li li { font-size:inherit; }
#header em, 
#topicPath em { font-style:normal; font-weight:bold; }
#header address, 
#topicPath address { font-style:normal; }
#header label, 
#topicPath label { cursor:pointer; }
#header legend, 
#topicPath legend { display:none; }
#header hr, 
#topicPath hr { display:none; visibility:hidden; height:0; border:0; }
#header h1, #header h2, #header h3, #header h4, #header h5, #header h6, #header form, #header fieldset, #header textarea, #header pre, #header blockquote, #header table, #header th, #header td, 
#topicPath h1, #topicPath h2, #topicPath h3, #topicPath h4, #topicPath h5, #topicPath h6, #topicPath form, #topicPath fieldset, #topicPath textarea, #topicPath pre, #topicPath blockquote, #topicPath table, #topicPath th, #topicPath td { font-size:100%; }
#header p, #header li, #header dt, #header dd, #header pre, #header legend, 
#topicPath p, #topicPath li, #topicPath dt, #topicPath dd, #topicPath pre, #topicPath legend { line-height:1.5; }
#header h1, #header h2, #header h3, #header h4, #header h5, #header h6, #header dt, 
#topicPath h1, #topicPath h2, #topicPath h3, #topicPath h4, #topicPath h5, #topicPath h6, #topicPath dt { font-weight:bold; }
/* ------ password ------ */
#header input[type="password"], 
#topicPath input[type="password"] { height:1.2em; font-family:arial; ime-mode:disabled; }
/* ------ button ------ */
#header input[type="submit"], #header input[type="reset"], #header input[type="button"], #header input[type="image"], 
#topicPath input[type="submit"], #topicPath input[type="reset"], #topicPath input[type="button"], #topicPath input[type="image"] { cursor:pointer; }
/* ------ file ------ */
#header input[type="file"], 
#topicPath input[type="file"] { height:20px; }

/*===================================================================
	clearfix
===================================================================*/
#areaContents:after,
#header #gNav:after, 
#header #headNav:after, 
#header .clearfix:after { display:block; clear:both; height:0; visibility:hidden; content:" "; }
#areaContents,
#header #gNav, 
#header #headNav, 
#header .clearfix { position:relative; display:inline-block; }

/* Hides from IE-mac \*/
* html #areaContents,
* html #header #gNav, 
* html #header #headNav, 
* html #header .clearfix { height:1%; }
#areaContents,
#header #gNav, 
#header #headNav, 
#header .clearfix { display:block; }
/* End hide from IE-mac */

#header .clearboth { clear:both; }
hr,
#header br.clear { clear:both; margin:0; padding:0; line-height:0; font-size:0; }

/*===================================================================
	base
===================================================================*/
body { margin:0; padding:0; background-color:#FFF !important; background-image:none !important; font-family:'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif; font-size:100.01% !important; /* font-size:16px; */ }

#global_container { width:100% !important; min-width:960px; margin:0 auto !important; background-color:#FFF !important; background-image:none !important; font-size:84%; }
#global_container #mainContainer,
#global_container #colorio_container,
#global_container #scanner_container,
#global_container #products_container,
#global_container #wgps_menu_container,
#global_container #dreamio_container,
#global_container #printer_container { width:920px !important; margin:0 auto !important; padding:0 10px !important; }
#global_container #mainContainer #contentsContainer #areaContents #contentsInner.bunkyo { padding: 0 10px; }

.mtA { margin:0 auto; }
.w725 { width:725px; }
.w920 { width:920px; } 
.w920 { width:960px; } 

/* ------ link ------ */
#header a:link, 
#topicPath a:link    { color:#005AB4; text-decoration:none; }
#header a:visited, 
#topicPath a:visited { color:#005AB4; text-decoration:none; }
#header a:hover, 
#topicPath a:hover   { color:#005AB4; text-decoration:underline; }
#header a:active, 
#topicPath a:active  { color:#005AB4; text-decoration:underline; }

/*===================================================================
	common
===================================================================*/
#header, 
#topicPath {
	font-family:'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
	font-size:14px; /* font-size:14px; */
}

#header p, #header ul, #header ul li, 
#topicPath p, #topicPath ul, #topicPath ul li {
	line-height:1.5 !important;
	letter-spacing:0 !important;
}

#header #top { position:absolute; width:1px; height:1px; text-indent: -9999px; }

/*===================================================================
	header
===================================================================*/
#header {
	width:960px;
	margin:0 auto;
	padding-top:15px;
	background:#FFF;
	color:#333;
}
#header.narrow {
	width:725px;
}

/* ------ headNav ------ */
#header #headNav { }

#header #headNav .headGroup {
	float:left;
	width:828px;
	font-size:79%; /* font-size:11px; */
	text-align:right;
}
#header.narrow #headNav .headGroup {
	width:593px;
}

#header #headNav .jpHeaderLogo {
	display: none;
}

#header #headNav .serch {
	float:right;
	width:132px;
}

#header #headNav .headGroup .nav, 
#header #headNav .headGroup .nav li, 
#header #headNav .headGroup .util, 
#header #headNav .headGroup .util li {
	display:inline-block;
	/display:inline;
	/zoom:1;
	vertical-align:middle;
}
#header #headNav .headGroup .nav li, 
#header #headNav .headGroup .util li {
	padding-right:15px;
}
#header #headNav .headGroup .util {
	padding-left:16px;
	background:url(../images/bg_dline_01.gif) repeat-y left top;
}
#header #headNav .headGroup .myEpson a img {
	vertical-align:-7px;
	margin-right:5px;
}
#header #headNav .serch {
	position:relative;
}
#header #headNav .serch p {
	width:132px;
	height:20px;
	overflow:hidden;
	background:url(/common/images/head/head_bg_serch_01.gif) no-repeat center center;
}
#header #headNav .serch p span.txt {
	position: relative;
}
#header #headNav .serch p input, 
#header #headNav .serch p label {
	vertical-align:middle;
	border:none;
	background-color:transparent;
	color:#FFF;
	line-height:2em;
	font-size:10px;
}
#header #headNav .serch p .img input[type="image"] {
	width:14px;
	padding-left: 9px;
	padding-right: 0;
	box-sizing: content-box;
}
#header #headNav .serch p .txt input, 
#header #headNav .serch p .txt label {
	width:92px;
	height:20px;
	padding-left: 3px;
}

/* ------ gNav ------ */
#header #gNav {
	width:960px;
	margin:0 auto;
	margin-top:15px;
}
#header.narrow #gNav {
	width:725px;
}

#header #gNav .logo {
	float:left;
	width:168px;
}
#header.narrow #gNav .logo {
	width:131px;
}

#header #gNav .nav {
	float:left;
	width:792px;
}
#header.narrow #gNav .nav {
	width:594px;
}

#header #gNav .nav li {
	float:left;
	width:132px;
	height:60px;
}
#header.narrow #gNav .nav li {
	width:99px;
}

#header #gNav .nav li a {
	display:block;
	width:100%;
	height:100%;
}
#header #gNav.products li.gnav01 a,
#header #gNav li.gnav01 a:hover { background:url(/common/images/head/head_nav_global_01_on.gif) no-repeat left top; }
#header #gNav.b_solution li.gnav02 a,
#header #gNav li.gnav02 a:hover { background:url(/common/images/head/head_nav_global_02_on.gif) no-repeat left top; }
#header #gNav.katsuyou li.gnav03 a,
#header #gNav li.gnav03 a:hover { background:url(/common/images/head/head_nav_global_03_on.gif) no-repeat left top; }
#header #gNav.support li.gnav04 a,
#header #gNav li.gnav04 a:hover { background:url(/common/images/head/head_nav_global_04_on.gif) no-repeat left top; }
#header #gNav.download li.gnav05 a,
#header #gNav li.gnav05 a:hover { background:url(/common/images/head/head_nav_global_05_on.gif) no-repeat left top; }
#header #gNav.shopping li.gnav06 a,
#header #gNav li.gnav06 a:hover { background:url(/common/images/head/head_nav_global_06_on.gif) no-repeat left top; }
#header.narrow #gNav.products li.gnav01 a,
#header.narrow #gNav li.gnav01 a:hover { background:url(/common/images/head/head_nav_global_narrow_01_on.gif) no-repeat left top; }
#header.narrow #gNav.b_solution li.gnav02 a,
#header.narrow #gNav li.gnav02 a:hover { background:url(/common/images/head/head_nav_global_narrow_02_on.gif) no-repeat left top; }
#header.narrow #gNav.katsuyou li.gnav03 a,
#header.narrow #gNav li.gnav03 a:hover { background:url(/common/images/head/head_nav_global_narrow_03_on.gif) no-repeat left top; }
#header.narrow #gNav.support li.gnav04 a,
#header.narrow #gNav li.gnav04 a:hover { background:url(/common/images/head/head_nav_global_narrow_04_on.gif) no-repeat left top; }
#header.narrow #gNav.download li.gnav05 a,
#header.narrow #gNav li.gnav05 a:hover { background:url(/common/images/head/head_nav_global_narrow_05_on.gif) no-repeat left top; }
#header.narrow #gNav.shopping li.gnav06 a,
#header.narrow #gNav li.gnav06 a:hover { background:url(/common/images/head/head_nav_global_narrow_06_on.gif) no-repeat left top; }

#header #gNav.products li.gnav01 a img,
#header #gNav.b_solution li.gnav02 a img,
#header #gNav.katsuyou li.gnav03 a img,
#header #gNav.support li.gnav04 a img,
#header #gNav.download li.gnav05 a img,
#header #gNav.shopping li.gnav06 a img,
#header #gNav.corporate li.gnav06 a img,
#header #gNav .nav li a:hover img {
	visibility:hidden;
}

/*===================================================================
	topicPath
===================================================================*/
#topicPath {
    width: 960px;
    margin: 0 auto;
    padding: 15px 0 30px 0;
}


.header_broad ~ #topicPath,
.header_broad #topicPath{
    max-width: calc(1210px + 30px);
    width:auto;
	margin: 15px auto 32px;
    padding: 0 15px;
    box-sizing: border-box;
}

#topicPath.narrow {
	width:725px;
}

#topicPath li {
	display:inline-block;
	/display:inline;
	/zoom:1;
	vertical-align:middle;
	margin-right:7px;
	padding:0 13px 0 0;
	background:url(/common/images/bg_topicpath_01.gif) no-repeat right center;
	font-size:79%; /* font-size:11px; */
}
#topicPath li.current {
	background:none;
}

/*===================================================================
	module
===================================================================*/
/* ------ iLink ------ */
#header .iLink01, 
#topicPath .iLink01 { display:block; padding:0 0 0 21px; background:url(/common/images/ico_link_01.gif) no-repeat left top; }
#header .iLink02, 
#topicPath .iLink02 { display:inline-block; /display:inline; /zoom:1; padding:0.2em 0 0 21px; background:url(/common/images/ico_link_01.gif) no-repeat left 0.2em; }

/* ------ iPop ------ */
#header .iPop01, 
#topicPath .iPop01 { display:inline-block; /display:inline; /zoom:1; }
#header .iPop01 img, 
#topicPath .iPop01 img { margin-right:5px; vertical-align:-2px; }
#header a.iPop01 img, 
#topicPath a.iPop01 img { margin-right:5px; margin-left:5px; vertical-align:-1px; }

/* ------ iDown ------ */
#header .iDown01, 
#topicPath .iDown01 { display:block; padding:0 0 0 21px; background:url(/common/images/ico_down_01.gif) no-repeat left top; }
#header .iDown02, 
#topicPath .iDown02 { display:inline-block; /display:inline; /zoom:1; padding:0.2em 0 0 21px; background:url(/common/images/ico_down_01.gif) no-repeat left 0.2em; }

/* ------ myEpson ------ */
#header .myEpson, 
#topicPath .myEpson { display:inline-block; /display:inline; /zoom:1; }
#header .myEpson img, 
#topicPath .myEpson img { margin-right:5px; vertical-align:-7px; }

/* ------ headMod ------ */
#header .headMod01, 
#topicPath .headMod01 { font-size:143%; } /* font-size:20px; */
#header .headMod02, 
#topicPath .headMod02 { font-size:129%; } /* font-size:18px; */
#header .headMod03, 
#topicPath .headMod03 { font-size:115%; } /* font-size:16px; */

/* ------ table ------ */
#header .tblMod01, 
#topicPath .tblMod01 { width:100%; border-top:1px solid #E5E5E5; border-left:1px solid #E5E5E5; border-collapse:collapse; }
#header .tblMod01 th, 
#topicPath .tblMod01 th { background-color:#FAFAFA; }
#header .tblMod01 th, 
#header .tblMod01 td, 
#topicPath .tblMod01 th, 
#topicPath .tblMod01 td { padding:15px; border-right:1px solid #E5E5E5; border-bottom:1px solid #E5E5E5; }



/*===================================================================
	header_broad
===================================================================*/

@media screen and (min-width: 768px){
#header.header_broad{
    width: 1240px;
}

#header.header_broad #gNav {
    width: 100%;
}

#header.header_broad #gNav .nav {
    width: 1020px;
}

#header.header_broad #gNav .logo {
    width: 220px;
    
}

#header.header_broad #gNav .nav li{
    width: 170px;
}

#header.header_broad #headNav .headGroup {
    width: 1100px;
}



#header.header_broad #gNav.products li.gnav01 a,
#header.header_broad #gNav li.gnav01 a:hover { background:url(/common/images/head/head_nav_global_broad01_on.gif) no-repeat left top; }
#header.header_broad #gNav.b_solution li.gnav02 a,
#header.header_broad #gNav li.gnav02 a:hover { background:url(/common/images/head/head_nav_global_broad02_on.gif) no-repeat left top; }
#header.header_broad #gNav.katsuyou li.gnav03 a,
#header.header_broad #gNav li.gnav03 a:hover { background:url(/common/images/head/head_nav_global_broad03_on.gif) no-repeat left top; }
#header.header_broad #gNav.support li.gnav04 a,
#header.header_broad #gNav li.gnav04 a:hover { background:url(/common/images/head/head_nav_global_broad04_on.gif) no-repeat left top; }
#header.header_broad #gNav.download li.gnav05 a,
#header.header_broad #gNav li.gnav05 a:hover { background:url(/common/images/head/head_nav_global_broad05_on.gif) no-repeat left top; }
#header.header_broad #gNav.shopping li.gnav06 a,
#header.header_broad #gNav li.gnav06 a:hover { background:url(/common/images/head/head_nav_global_broad06_on.gif) no-repeat left top; }
#header.header_broad #gNav.corporate li.gnav06 a,
#header.header_broad #gNav li.gnav06 a:hover { background:url(/common/images/head/head_nav_global_broad06_on.gif) no-repeat left top; }

}

@media screen and (max-width:767px) {
	#topicPath {
		box-sizing: border-box !important;
		width: 100% !important;
		min-width: 100%;
		padding: 5px 2% 20px 2% !important;
		margin: 0 auto !important;
	}
	
	.header_broad ~ #topicPath,
	.header_broad #topicPath{
		margin: 15px auto 20px !important;
	    padding: 0 15px !important;
}
	
}
