@charset "utf-8";
/* ============================== Common ============================== */
.mfpsContents main {
	font-family: "Source Sans 3", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}
.mfpsContents  main img {
	max-width: 100%;
	width: 100%;
}

/* ============================== Header ============================== */
#mfps__header {
	width: 100%;
	background-color: #fff;
}
#mfps__header__ttl {
	font-weight: 500;
}
#mfps__header__nav > li a {
	display: inline-block;
	padding-left: 1em;
	margin-left: 1.5em;
	position: relative;
}
#mfps__header__nav > li a::before {
	content: '';
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-top: 0.4em solid transparent;
	border-bottom: 0.4em solid transparent;
	border-left: 0.5em solid #000;
	border-right: 0;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}

/* #bread_crumb */
#bread_crumb {
 margin-top: 0;
 width: 100%;
 padding:0 5%;
 background-color: #eeeddf;
}
#bread_crumb > ol {
 margin: 0 auto;
 max-width: 1200px;
 padding: 1.5em 0 1em;
}
#bread_crumb > ol > li {
 font-size: 1.2rem;
 color: #707070;
 line-height: 1.2;
 display: inline-block;
 vertical-align: top;
 padding-left: 0;
 text-indent: 0;
}
#bread_crumb > ol > li + li:before {
 position: relative;
 display: inline-block;
 counter-increment: none;
 content: " > ";
 padding-left: 5px;
 padding-right: 5px;
}
#bread_crumb > ol > li:before { display: inline-block; content: ""; }
#bread_crumb a { color: inherit; text-decoration: none; }

/* ============================== Footer ============================== */
.gnav > li a {
	display: block;
	width: 100%;
	padding: 1em 0 1.06em 0;
	background-color: #403d33;
	color: #fff;
	text-decoration: none;
}
.gnav > li a span {
	display: inline-block;
	padding-left: 0.25em;
}

/* ============================== Layout ============================== */
/* index list */
.index-products-list,
.index-download-list {
	display: flex;
}
.index-products-list > li,
.index-download-list > li {
	box-shadow: 0 5px 15px 5px rgba(0,0,0,0.2);
}
.index-products-list > li a,
.index-download-list > li a {
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 500;
	background-color: #fff;
	color: #333;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: 100% 4px;
}
.index-products-list > li.a3-c a,
.index-products-list > li.a4-c a {
	background-image: url("/products/copier/img/products/products-list-line-c.png");
}
.index-products-list > li.a3-b a,
.index-products-list > li.a4-b a {
	background-image: url("/products/copier/img/products/products-list-line-b.png");
}
.index-download-list li a > span::before {
	content: '';
	display: block;
	background: #333;
	margin-left: auto;
	margin-right: auto;
}
.index-products-list > li.active a,
.index-download-list > li.active a,
.more-btn:hover {
	background-color: #999;
	color: #fff;
}
/* Support Information */
.support-info-list {
	border-top: #d9d9d9 1px solid;
}
.support-info-list > li {
	border-bottom: #d9d9d9 1px solid;
}
.support-info-list,
.support-info-list a {
	color: #333;
}
.more-btn {
	display: block;
	background-color: #fff;
	text-align: center;
	box-shadow: 0 5px 15px 5px rgba(0,0,0,0.2);
	padding: 0.5em 0.25em;
}
.more-btn > span::before {
	content: '';
	display: inline-block;
	vertical-align: middle;
	width: 0.3em;
	height: 0.3em;
	border-top: 2px solid #333;
	border-right: 2px solid #333;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	margin-right: 0.5em;
	margin-bottom: 0.25em;
}
.support-info-list + .btn__wrap {
	margin-left: auto;
	margin-right: auto;
}
/* Products */
main.mfpsPage {
	background-color: #f5f5f7;
}
.mfpsPage #contentTtl {
	color: #333;
	font-weight: 700;
	text-align: center;
}
.mfpsContents main .moreInfo {
	text-align: right;
	font-weight: 400;
	font-size: 1.4rem;
}
.mfpsContents main .moreInfo a {
	display: inline-block;
	color: #000;
	text-decoration: none;
	padding-left: 1em;
	position: relative;
}
.mfpsContents main .moreInfo a::before {
	content: '';
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-top: 0.4em solid transparent;
	border-bottom: 0.4em solid transparent;
	border-left: 0.5em solid #000;
	border-right: 0;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}
#resultListWrap + .moreInfo {
	margin-top: 2em;
}


/* ==========================================================================
 SP
========================================================================== */
@media screen and (max-width: 767px) {
/* ============================== Common ============================== */
.spDisNone {
	display: none !important;
}

/* ============================== Header ============================== */
.mfpsContents #contents__indexTop {
	padding-top: 0;
}
#mfps__header {
	padding-top: 57px;
}
#mfps__header__nav__wrap {
	display: flex;
	flex-direction: column;
	padding: 4% 2.5%;
}
#mfps__header__ttl {
	order: 2;
	text-align: center;
	font-size: 2rem;
	margin-top: 0.25em;
}
#mfps__header__nav {
	order: 1;
	display: flex;
	justify-content: flex-end;
	font-size: 1.1rem;
}

/* ============================== Footer ============================== */
.gnav {
	display: flex;
	flex-wrap: wrap;
	font-size: 1.1rem;
	border-bottom: #999 1px solid;
	margin-bottom: 25px;
}
.gnav > li {
	width: 50%;
	height: 52px;
	text-align: center;
	border-bottom: #999 1px solid;
}
.gnav > li:nth-child(odd) {
	border-right: 1px solid #999;
}
.gnav > li:last-child {
	border-bottom: none;
}
.gnav > li a {
	display: flex;
	height: 100%;
	align-items: center;
	justify-content: center;
	padding: 5px;
}

/* ============================== Layout ============================== */
.articleContents.mfpsContents .l-contents {
	margin-bottom: 0;
}
#contents__indexTop {
	padding-bottom: 40px;
}
/* index list */
.index-products-list,
.index-download-list {
	flex-wrap: wrap;
}
.index-products-list > li,
.index-download-list > li {
	width: calc((100% - 10px) / 2);
	margin-right: 2%;
	margin-top: 10px;
	box-shadow: 0 1px 8px 1px rgba(0,0,0,0.2);
}
.index-products-list > li:nth-child(even),
.index-download-list > li:nth-child(even) {
	margin-right: 0;
}
.index-products-list > li:nth-child(-n + 2),
.index-download-list > li:nth-child(-n + 2) {
	margin-top: 0;
}
.index-products-list > li a,
.index-download-list > li a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 60px;
	font-size: 1.8rem;
}
.index-download-list > li a {
	height: 90px;
}
.index-download-list li a > span::before {
	width: 50px;
	height: 50px;
}
.index-download-list li.drivers a > span::before {
	-webkit-mask: url("/products/copier/img/downloads/ic_drivers.svg") no-repeat center;
	mask: url("/products/copier/img/downloads/ic_drivers.svg") no-repeat center;
	-webkit-mask-size: 50px auto;
	mask-size: 50px auto;
}
.index-download-list li.manuals a > span::before {
	-webkit-mask: url("/products/copier/img/downloads/ic_usersmanuals.svg") no-repeat center;
	mask: url("/products/copier/img/downloads/ic_usersmanuals.svg") no-repeat center;
	-webkit-mask-size: 50px auto;
	mask-size: 50px auto;
}
.index-download-list li.faq a > span::before {
	-webkit-mask: url("/products/copier/img/downloads/ic_faqs.svg") no-repeat center;
	mask: url("/products/copier/img/downloads/ic_faqs.svg") no-repeat center;
	-webkit-mask-size: 50px auto;
	mask-size: 50px auto;
}
.index-download-list li.brochures a > span::before {
	-webkit-mask: url("/products/copier/img/downloads/ic_brochures.svg") no-repeat center;
	mask: url("/products/copier/img/downloads/ic_brochures.svg") no-repeat center;
	-webkit-mask-size: 60px auto;
	mask-size: 60px auto;
}
.support-info-list {
	font-size: 1.6rem;
}
.support-info-list .date,
.support-info-list .txt {
	display: block;
}
.support-info-list > li {
	padding: 0.5em 0;
}
.more-btn {
	font-size: 1.8rem;
	box-shadow: 0 1px 8px 1px rgba(0,0,0,0.2);
}

.support-info-list + .btn__wrap {
	width: 70%;
	margin-top: 20px;
}
/* Products */
main.mfpsPage {
	padding: 50px 0;
}
.mfpsPage #contentTtl {
	font-size: 2.5rem;
	margin-bottom: 0.5em;
}
#contents__productsIndex .index-products-list {
	width: 90%;
	margin: 0 auto 30px;
}
.mfpsContents main .moreInfo {
	font-size: 1.6rem;
}
}



/* ==========================================================================
 PC
========================================================================== */
@media print, all and (min-width: 768px) {
/* ============================== Common ============================== */
.pcDisNone {
	display: none !important;
}

/* ============================== Header ============================== */
.mfpsContents #contents__indexTop {
	padding-top: 0;
}
#mfps__header {
	padding-top: 73px;
}
#mfps__header__nav__wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
	max-width: 1200px;
	height: 50px;
	margin-left: auto;
	margin-right: auto;
}
#mfps__header__ttl {
	font-weight: 500;
	font-size: 2.4rem;
}
#mfps__header__nav {
	display: flex;
	justify-content: flex-end;
	font-size: 1.8rem;
}
/* #bread_crumb */
#mfps__header__nav > li {
}

/* ============================== Footer ============================== */
.articleContents.mfpsContents #global__footer {
	padding: 0 0 60px;
}
.articleContents.mfpsContents #global__footer--common {
	border-top: none;
}
.fnav,
.l-gnav {
	width: 100%;
}
.gnav {
	width: 100%;
	display: flex;
	justify-content: center;
	border-bottom: 1px solid #999999;
}
.gnav > li {
	width: calc(100% / 3);
	text-align: center;
	border-left: 1px solid #999999;
}
.gnav > li:first-child {
	border-left: none;
}
.gnav > li a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 60px;
	font-size: 1.6rem;
}
.gnav > li i {
	display: inline-block;
	margin-right: 5px;
}
.gnav > li i.is-individual {
	width: 41px;
	height: 22px;
	background: url(/shared_top/img/icon_products_01.svg) 0 50% no-repeat;
}
.gnav > li i.is-business {
	width: 20px;
	height: 24px;
	background: url(/shared_top/img/icon_business_01.svg) 0 50% no-repeat;
}
.gnav > li i.is-support {
	width: 25px;
	height: 24px;
	background: url(/shared_top/img/icon_support_01.svg) 0 50% no-repeat;
}

/* ============================== Layout ============================== */
#contents__indexTop {
	padding-bottom: 80px;
}
.mfpsContents .l-contents {
	margin-bottom: 0;
}
/* index list */
.index-products-list > li,
.index-download-list > li {
	width: 23.5%;
	margin-right: 2%;
}
.index-products-list > li:nth-child(4n),
.index-download-list > li:nth-child(4n) {
	margin-right: 0;
}
.index-products-list > li a,
.index-download-list > li a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 154px;
	font-size: 2.8rem;
}
.index-download-list li a > span::before {
	width: 80px;
	height: 80px;
}
.index-download-list li.drivers a > span::before {
	-webkit-mask: url("/products/copier/img/downloads/ic_drivers.svg") no-repeat center;
	mask: url("/products/copier/img/downloads/ic_drivers.svg") no-repeat center;
	-webkit-mask-size: 80px auto;
	mask-size: 80px auto;
}
.index-download-list li.manuals a > span::before {
	-webkit-mask: url("/products/copier/img/downloads/ic_usersmanuals.svg") no-repeat center;
	mask: url("/products/copier/img/downloads/ic_usersmanuals.svg") no-repeat center;
	-webkit-mask-size: 80px auto;
	mask-size: 80px auto;
}
.index-download-list li.faq a > span::before {
	-webkit-mask: url("/products/copier/img/downloads/ic_faqs.svg") no-repeat center;
	mask: url("/products/copier/img/downloads/ic_faqs.svg") no-repeat center;
	-webkit-mask-size: 80px auto;
	mask-size: 80px auto;
}
.index-download-list li.brochures a > span::before {
	-webkit-mask: url("/products/copier/img/downloads/ic_brochures.svg") no-repeat center;
	mask: url("/products/copier/img/downloads/ic_brochures.svg") no-repeat center;
	-webkit-mask-size: 80px auto;
	mask-size: 80px auto;
}
/* Support Information */
.support-info-list {
	font-size: 2rem;
}
.support-info-list a {
	display: flex;
}
.support-info-list .date {
	width: 9em;
	padding-right: 2em;
}
.support-info-list > li {
	padding: 1em 0;
}
.more-btn {
	font-size: 2.2rem;
}
.support-info-list + .btn__wrap {
	width: 300px;
	margin-top: 45px;
}
/* Products */
main.mfpsPage {
	padding: 50px 0;
}
.mfpsPage #contentTtl {
	font-size: 3.8rem;
	margin-bottom: 1em;
}
#contents__productsIndex .index-products-list {
	max-width: 1200px;
	margin: 0 auto 60px;
}
.mfpsContents main .moreInfo {
	font-size: 1.7rem;
}
}

/* ============================== Hover ============================== */
@media (hover: hover) {
.bnr-list a,
.gnav > li a,
.index-products-list > li a,
.index-download-list > li a,
.more-btn,
.support-info-list a {
	transition: 0.3s;
}
.gnav > li a:hover {
	background-color: #000;
}
.index-products-list > li a:hover,
.index-download-list > li a:hover,
.more-btn:hover {
	background-color: #999;
	color: #fff;
}
.index-download-list li a:hover > span::before {
	background: #fff;
}
.more-btn:hover span::before {
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}
.support-info-list a:hover {
	text-decoration: underline;
}
}


