@charset "utf-8";
@import url("https://fonts.googleapis.com/css?family=Roboto+Condensed");
@import url("https://fonts.googleapis.com/earlyaccess/notosansjapanese.css");

/* =========================================================================================== */
#gl_header .gl_hd {
	max-width: 1108px;
	margin: 0 auto;
}

#gl_header .gl_hd .inner {
	max-width: none;
}

#gl_header.hd_line{
	margin-bottom:0;
}

#gl_header .hd_ut ul.btn{
	text-align:center;
	/*width:356px;*/
	float: right;
	font-size:92%;
}
#gl_header .hd_ut ul.btn li:first-child{
	margin-left:0;
}
#gl_header .hd_ut ul.btn li.btn_top a{
	background:#666;
	color:#FFF;
	padding: 10px 0;
}
/* #gl_header .hd_ut ul.btn li:nth-of-type(2) a, */
#gl_header .hd_ut ul.btn li:not(:last-child) a,
#gl_header .hd_ut ul.btn li.download_bg a{
	background:#0f99c2;
	color:#FFF;
	line-height: 18px;
}
#gl_header .hd_ut ul.btn li a .iconset{
	margin:0 auto;
}
#gl_header .hd_ut ul.btn li a .hd_btn_icon{
    display: table-cell;
    padding: 0 0 0 10px;
    width: 30px;
	vertical-align: middle;
}
#gl_header .hd_ut ul.btn li a .hd_btn_icon.hd_btn_icon2 {
    padding: 0 0 0 0;
}
#gl_header .hd_ut ul.btn li a .hd_btn_icon i{
    vertical-align: top;
	text-align: right;
    margin-right: 4px;
	display: block;
	margin-top:2px;
}
#gl_header .hd_ut ul.btn li.btn_top a {
	line-height: 21px;
}
#gl_header .hd_ut ul.btn li.btn_top a strong {
	display:inline;
}
#gl_header .hd_ut ul.btn li a strong{
display: table-cell;
vertical-align: middle;
line-height: 1.1;
font-weight: 400;
}
#gl_header .hd_ut ul.btn li:last-child a{
	background:#d31d3e;
	color:#FFF;
	padding: 10px 25px 10px 15px;
}
#gl_header .hd_ut ul.btn li{
	display: inline-block;
	/* width: 190px;
	float:left; */
	margin-left:14px;
}
#gl_header .hd_ut ul.btn li a{
	/* background-color: #f8bf56;
	color: #333333; */
	padding: 10px 10px 10px 8px;
	display:block;
	text-decoration:none;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
}
#gl_header .hd_ut ul.btn li.download_bg a{
	padding: 7px 10px 7px 8px;
}

#gl_footer .ft_ut .ft_ut_inr {
	max-width: 1108px;
}
@media (max-width: 767px) {
	#gl_header .hd_ut ul.btn li a{
		font-size: 14px;
		padding-right: 10px;
		padding-left: 0;
	}
}



/* 2: other
=========================================================================================== */
body {
	font-family: "Noto Sans Japanese",'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
a:hover {
	text-decoration: none;
	opacity: 0.7;
	transition: all 400ms 0s ease;
}
/*clear fix*/
.clearfix:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}
.clearfix{
display:inline-table;
min-height:1%;
}
* html .clearfix{
height:1%;
}
.clearfix{
	display: block;
}
.tac {
	text-align: center !important;
}
.mb0 {
	margin-bottom: 0 !important;
}
.mt50 {
	margin-top: 50px !important;
}
.small {
	font-size: 68.75%!important;
	line-height: 1.6;
}
#contents{
	color:#333;
	font-weight: 400;
	font-size: 1em;
	line-height: 181.25%;
	box-sizing: border-box;
}
p,h1,h2,h3,h4,h5,ul,ol,li,dl,dt,dd {
	margin: 0;
	padding: 0;
	font-size: 100%;
	font-weight: normal;
	list-style: none;
}
#contents * {
	box-sizing: border-box;
}
#contents .button {
	border-radius: 0;
}
.image {
	position: relative;
	/* object-fit: cover; */
}
.image img {
	width: 100%;
	display: block;
	margin: auto;
}


section {
	display: block;
	width: 100%;
	max-width: 1000px;
	margin: auto;
	position: relative;
}

.allow_txt {
	color: #fff;
	position: relative;
	text-align: center;
}
.allow_txt>strong {
	position: absolute;
	width: 200px;
	left: calc(50% - 100px);
	z-index: 3;
	padding-top: 20px;
}
.allow_txt>strong::before,
.allow_txt>strong::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	top: 0;
	z-index: -1;
}
.allow_txt>strong::before {
	left: calc(50% - 267px);
	border-top: 96px solid #cf142b;
	border-left: 267px solid transparent;
}
.allow_txt>strong::after {
	right: calc(50% - 267px);
	border-top: 96px solid #c91833;
	border-right: 267px solid transparent;
}
.allow_txt::before {
	content: "";
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	left: calc(50% - 277px);
	border-top: 106px solid #fff;
	border-left: 277px solid transparent;
	border-right: 277px solid transparent;
}

@media (min-width: 768px) {
	main section {
		padding: 90px 0;
	}
	/*main aside {
		margin-bottom: 90px;
	}*/
	.image:not(:last-child),
	.txt:not(:last-child),
	h2:not(:last-child),
	h3:not(:last-child),
	h4:not(:last-child) {
		margin-bottom: 40px;
	}
	.lattice {
		background-image:
		  	linear-gradient(-45deg, rgba(0,0,0,.05) 16.66%, transparent 16.66%, transparent 50%, rgba(0,0,0,.05) 50%, rgba(0,0,0,.05) 66.67%, transparent 66.67%, transparent 100%),
		  	linear-gradient(45deg, rgba(0,0,0,.05) 16.66%, transparent 16.66%, transparent 50%,  rgba(0,0,0,.05) 50%, rgba(0,0,0,.05) 66.67%, transparent 66.67%, transparent 100%);
		background-size: 1800px 1800px;
	}
	.lattice_half {
		background-image:
		  	linear-gradient(-45deg, rgba(0,0,0,.02) 16.66%, transparent 16.66%, transparent 50%, rgba(0,0,0,.02) 50%, rgba(0,0,0,.02) 66.67%, transparent 66.67%, transparent 100%),
		  	linear-gradient(45deg, rgba(0,0,0,.02) 16.66%, transparent 16.66%, transparent 50%,  rgba(0,0,0,.02) 50%, rgba(0,0,0,.02) 66.67%, transparent 66.67%, transparent 100%);
		background-size: 1800px 1800px;
	}
}
@media (max-width: 767px) {
	body,
	#wrapper {
		overflow-x: hidden;
	}
	main section {
		padding: 20px 10px;
	}
	main aside {
		padding: 10px;
		margin-bottom: 10px;
	}
	main #case aside {
		padding: 10px 10px 20px 10px;
		margin-bottom: 0;
	}
	/*h1 br,
	h2 br,
	h3 br,
	h4 br {
		display: none;
	}*/
	h2 br {
		display: none;
	}
	.image:not(:last-child),
	.txt:not(:last-child),
	h2:not(:last-child),
	h3:not(:last-child),
	h4:not(:last-child) {
		margin-bottom: 20px;
	}
	.allow_txt {
		transform: scale(0.75,0.75);
	}
}
@media (min-width: 768px) {
	.sp {
		display: none!important;
	}
	br.pc {
		display: inline!important;
	}
	br.sp-2 {
		display: none!important;
	}
}
@media (max-width: 767px) {
	.pc {
		display: none!important;
	}
	br.sp {
		display: inline!important;
	}
}
@media (max-width: 767px) {
	br.sp-2 {
		display: none!important;
	}
}
@media (min-width: 768px) and (max-width: 1000px) {
	br.sp-2 {
		display: inline!important;
	}
}




header {
	display: block;
}
header>section {
	max-width: 1308px;
	position: relative;
}
/* header .button {
	display: block;
	width: 100%;
	text-align: center;
	background-color: #000;
}
header .button>li {
		position: relative;
}
header .button>li>a {
	display: block;
	width: 100%;
	background-color: #fff;
	color: #282828;
}
header .button>li>a::after {
	content: "";
	display: block;
	width: 11.66px;
	height: 11.66px;
	border: solid #cf142b;
	border-width: 2px 2px 0 0;
	position: absolute;
	right: 20px;
	top: calc(50% - 5.83px);
	transform: rotate(45deg);
} */
/* .contents header section .title>.txt {
	color: #cf142b;
	text-align: center;
}

header section>.button {
	padding: 0;
}
header section>.button>a {
	width: 100%;
	display: block;
	text-align: center;
	color: #fff;
	box-shadow: 0 0 10px 5px #fff;
}
header .button>a::after {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	border: solid #fff;
	border-width: 2px 2px 0 0;
	position: absolute;
	right: 20px;
	top: calc(50% - 5px);
	transform: rotate(45deg);
} */
/* header .button {
	display: block;
	width: 100%;
	text-align: center;
}
header .button>li {
		position: relative;
}
header .button>li>a {
	display: block;
	width: 100%;
	background-color: #343434;
	color: #fff;
}
header .button>li>a::before {
	content: "";
	display: block;
	width: 11.66px;
	height: 11.66px;
	border: solid #fff;
	border-width: 2px 2px 0 0;
	position: absolute;
	right: 20px;
	top: calc(50% - 5.83px);
	transform: rotate(45deg);
}
header .button>li>a[target="_blank"]::before {
	content: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/icon_s_newwindow_02.png);
	display: block;
	width: auto;
	height: auto;
	position: absolute;
	top: calc(50% - 35px);
	border: solid #fff;
	border-width: 0;
	transform: rotate(0deg);
} */

header section>.button {
	padding: 0;
}
header section>.button>a {
	width: 100%;
	display: block;
	text-align: center;
	color: #fff;
	box-shadow: 0 0 10px 5px #fff;
}
section>.button>a[target="_blank"]::after {
	content: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/icon_s_newwindow_02.png);
	display: block;
	width: auto;
	height: auto;
	position: absolute;
	left: 20px;
	border: solid #fff;
	border-width: 0;
	transform: rotate(0deg);
}
header .title {
	position: absolute;
	background-color: #fff;
}
@media (min-width: 768px) {
	header {
		background-position: center top;
		background-repeat: no-repeat;
	}
	.contents header {
		background-image: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/contents_head_bg2.jpg);
	}
	header>section {
		height: 558px;
	}
	header .title {
		left: calc(50% - 323px);
		right: calc(50% - 323px);
		padding: 50px 95px;
		box-shadow: 0 0 7px rgba(50,123,174,0.41);
		border-radius: 4px;
		top: 161px;
		bottom: 161px;
	}
	header .expansion .title{
		left: calc(50% - 375px);
		right: calc(50% - 375px);
	}
	.contents header .title {
		background-position: -710px -320px;
    	background-size: 1200px 1180px;
		padding: 30px 95px;
	}
	header .title::before,
	header .title::after {
		content: "";
		display: block;
		background-color: #dc1a37;
		position: absolute;
		border-radius: 4px;
	}
	header .title::before {
		width: 128px;
		height: 128px;
		left: -80px;
		top: -30px;
	}
	header .title::after {
		width: 18px;
		height: 18px;
		left: 40px;
		top: 90px;
	}
	.contents header section .title>.txt {
		font-size: 181.25%;
		white-space: nowrap;
		margin-bottom: 10px;
		font-weight: bold;
	}
	.contents header h1 {
		font-size: 250%;
		/* line-height: 137.5%; */line-height: 120%;
		letter-spacing: 10px;
		color: #222;
		font-weight: bold;
	}
	/* header .button {
		padding: 25px 0; padding: 50px 0 0;
	}
	header .button>li>a {
		line-height: 73px;
	}
	header .button>li {
		display: inline-block;
		width: calc(50% - 25px);
		max-width: 369px;
	}
	header .button>li:not(:last-child) {
		margin-right: 40px;
	} */
	header section>.button {
		left: calc(50% - 160px);
		width: 320px;
		position: absolute;
		bottom: 20px;
	}
	header section>.button>a {
		line-height: 100%;
		background-color: #333;
		padding: 25px 25px 25px 60px;
	}
	header section>.button {
		bottom: 50px;
	}
	header section>.button>a[target="_blank"]::after {
		top: calc(50% - 10px);
	}
}
@media (max-width: 767px) {
	header {
		display: block;
		background-repeat: no-repeat;
	}
	header>section {
		/* padding-top: 50%; */ padding-top: 40%;
		margin-bottom: 60px;
		background-size: cover;
		background-position: center top;
		position: relative;
	}
	header>section.expansion {
		padding-top: 50%;
	}
	
	/*header .button>li {
		margin: 10px;
		font-size: 75%;
	}
	header .button>li>a {
		padding: 20px;
	}*/
	.contents header>section {
		background-image: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/contents_head_bg2.jpg);
	}
	header .title {
		left: 10%;
		right: 10%;
		top: 10%;
		bottom: 10%;
		padding: 3% 0;
		box-shadow: 0 0 7px rgba(50,123,174,0.41);
		font-size: 4vw;
		line-height: 125%;
	}
	header .expansion .title {
		left: 8%;
		right: 8%;
	}
	.contents header .title {
    font-size: 3.6vw;
	}
	#contents header .title>* {
		margin-bottom: 0;
		padding: 0 10%;
	}
	#contents .contents header section .title>.txt {
		font-size: 100%;
		line-height: 100%;
		white-space: nowrap;
		margin-bottom: 10px;
		font-weight: bold;
	}
	.contents header h1 {
		font-size: 150%;
		line-height: 125%;
		letter-spacing: 2px;
		color: #222;
		font-weight: bold;
	}
	/* .contents header section .title>.txt {
		line-height: 200%;
		background-color: #eee;
		margin: 0;
		text-align: center;
	}
	.contents header h1 {
		font-size: 150%;
		line-height: 125%;
		padding: 10px;
		text-align: center;
		background-color: #fff;
	} */
	header section>.button {
		position: absolute;
		display: block;
		padding: 10px;
		background-color: #fff;
		top: (100% + 10px);
		left: 0;
		right: 0;
	}
	header section>.button>a {
		line-height: 300%;
		background-color: #333;
		position: relative;
	}
	header section>.button>a[target="_blank"]::after  {
		top: calc(50% - 24px);
	}
	/*.contents header h1 br {
		display: none;
	}*/
}



main h2 {
	text-align: center;
	margin-bottom: 50px;
}
main h2>* {
	display: block;
}
main h2>span::before,
main h2>span::after {
	content: "／";
}
main h2>span::before {
	margin-right: 20px;
}
main h2>span::after {
	margin-left: 20px;
}
main .linemenu {
	overflow: hidden;
	text-align: center;
}
main .linemenu>span {
	display: inline-block;
	position: relative;
	padding: 0 10px;
}
main .linemenu>span::before,
main .linemenu>span::after {
	content: "";
	display: block;
	position: absolute;
	width: 500px;
	height: 2px;
	top: calc(50% - 1px);
	background-color: #ddd;
}
main .linemenu>span::before {
	right: 100%;
}
main .linemenu>span::after {
	left: 100%;
}
@media (min-width: 768px) {
	main h2>strong {
		font-size: 225%;
		line-height: 127.77%;
		margin-bottom: 10px;
	}
	main h2>span {
		font-size: 87.5%;
		color: #cf142b;
		font-weight: bold;
	}
	main .linemenu>span {
		min-width: 464px;
	}
}
@media (max-width: 767px) {
	main h2>strong {
		font-size: 150%;
		line-height: 125%;
	}
	main h2>span {
		font-size: 87.5%;
		color: #cf142b;
	}
}
main .button {
	width: 100%;
	margin: 50px 0 0;
	padding: 0;
}
main .button li {
	position: relative;
}
main .button a {
	display: block;
	color: #fff;
	background-color: /*#343434*/#cf142b;
	text-align: center;
	position: relative;
}
main .button a::before {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	position: absolute;
	top: calc(50% - 5px);
	border: solid #fff;
	border-width: 2px 2px 0 0;
	transform: rotate(45deg);
}
main .button a[target="_blank"]::before {
	content: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/icon_s_newwindow_02.png);
	display: block;
	width: auto;
	height: auto;
	position: absolute;
	top: calc(50% - 35px);
	border: solid #fff;
	border-width: 0;
	transform: rotate(0deg);
}
@media (min-width: 768px) {
	main .button li {
		display: inline-block;
		width: calc(50% - 25px);
	}
	main .button li:not(:last-child) {
		margin-right: 25px;
	}
	main .button a {
		line-height: 78px;
		padding-left: 40px;
	}
	main .button a::before {
		left: 30px;
	}
}
@media (min-width: 768px) and (max-width: 900px;) {
	main .button a {
		padding-right: 40px;
	}
}
@media (max-width: 767px) {
	main .button li {
		margin-bottom: 10px;
	}
	main .button a {
		font-size: 75%;
		padding: 20px 30px;
	}
	main .button a::before {
		left: 10px;
	}
	main .button a[target="_blank"]::before {
		top: calc(50% - 10px);
	}
}
@media (min-width: 768px) {
.officesignage main #scene .button a {
    line-height: 78px;
    padding-left: 15px;
}
.officesignage main #scene .button a::before {
    left: 10px;
}
}
.contents main #internal .trouble li {
	background-color: #e9f2f4;
}
.contents main #internal .trouble li::before {
	content: "?";
	color: #515151;
	position: absolute;
	left: calc(50% - 30px);
	display: block;
	width: 60px;
	text-align: center;
	font-weight: 500;
}
.contents main #internal .trouble li>.txt>strong {
	color: #cf142b;
}
.contents main #internal .subcopy1 {
	color: #222;
	text-align: center;
	margin-bottom: 1em;
}
#internal .allow_txt {
	font-size: 275%;
}

.contents main #internal aside {
	background-color: #cf142b;
	color: #fff;
	min-height: 1479px;
}
.contents main #internal aside ol {
	counter-reset: internal;
}
.contents main #internal aside ol>li {
	counter-increment: internal;
}
.contents main #internal aside h3 {
	position: relative;
	z-index: 1;
}
.contents main #internal aside li:not(:last-child) {
	margin-bottom: 60px;
}
.contents main #internal aside li>div {
	bottom: 0;
}
.contents main #internal aside .txt {
	color: #333;
	background-color: #fff;
}
.contents main #internal aside .image {
	max-width: 540px;
	z-index: 1;
}
.contents main #internal aside li:nth-of-type(2n-1)>div {
	left: 0;
}
.contents main #internal aside li:nth-of-type(2n-1)>.image {
	right: 0;
}
.contents main #internal aside li:nth-of-type(2n)>div {
	right: 0;
}
.contents main #internal aside li:nth-of-type(2n)>.image {
	left: 0;
}
.contents main #internal aside .image::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	right: 10px;
	bottom: 10px;
	border: 3px solid #fff;
}
@media (min-width: 768px) {
	.contents main #internal .trouble {
		height: 428.75px;
		position: relative;
		margin: 70px 0 50px;
	}
	.contents main #internal .trouble li {
		width: 302px;
		height: 302px;
		display: flex;
		justify-content: center;
		align-items: center;
		position: absolute;
		border-radius: 50%;
		top: 80px;
		text-align: center;
	}
	.contents main #internal .trouble li::before {
		font-size: 500%;
		top: 0px;
	}
	.contents main #internal .trouble li:first-of-type {
		left: 2.25%;
	}
	.contents main #internal .trouble li:nth-of-type(2) {
		left: calc(50% - 151px);
		top: 0;
	}
	.contents main #internal .trouble li:last-of-type {
		right: 2.25%;
	}
	.contents main #internal .trouble li>.txt>strong {
		font-size: 162.5%;
	}
	.contents main #internal .trouble li>.txt::before,
	.contents main #internal .trouble li>.txt::after {
		content: "";
		display: block;
		border-radius: 50%;
		position: absolute;
		background-color: #e9f2f4;
	}
	.contents main #internal .trouble li>.txt::before {
		width: 42px;
		height: 42px;
	}
	.contents main #internal .trouble li>.txt::after {
		width: 21px;
		height: 21px;
	}
	.contents main #internal .trouble li:first-of-type>.txt::before {
		left: 260px;
		bottom: 45px;
	}
	.contents main #internal .trouble li:first-of-type>.txt::after {
		left: 310px;
		bottom: 40px;
	}
	.contents main #internal .trouble li:nth-of-type(2)>.txt::before {
		top: 260px;
		right: 45px;
	}
	.contents main #internal .trouble li:nth-of-type(2)>.txt::after {
		top: 310px;
		right: 65px;
	}
	.contents main #internal .trouble li:last-of-type>.txt::before {
		right: 260px;
		bottom: 45px;
	}
	.contents main #internal .trouble li:last-of-type>.txt::after {
		right: 310px;
		bottom: 40px;
	}
	.contents main #internal .trouble .image {
		position: absolute;
		left: calc(50% - 65px);
		bottom: 0;
	}
	.contents main #internal aside {
	    background-position: -950px -250px;
	}
	.contents main #internal aside h3 {
		font-size: 162.5%;
		line-height: 153.846153846153846%;
	}
	.contents main #internal aside ol>li {
		position: relative;
		min-height: 372px;
	}
	.contents main #internal aside li:not(:last-child) {
		margin-bottom: 60px;
	}
	.contents main #internal aside li>* {
		width: calc(50% + 50px);
		position: absolute;
	}
	.contents main #internal aside li>div>* {
		padding: 45px 50px;
		margin: 0;
	}
	.contents main #internal aside h3 {
		font-size: 162.5%;
		line-height: 153.846153846153846%;
		letter-spacing: 2px;
		font-weight: bold;
	}
	.contents main #internal aside li:nth-of-type(2n-1)>div>* {
		padding-right: 120px;
	}
	.contents main #internal aside li:nth-of-type(2n)>div>* {
		padding-left: 120px;
	}
	.contents main #internal .subcopy1 {
		font-size: 162.5%;
	}
	.contents main #internal aside li>div::before {
		content: counter(internal);
		font-size: 1450%;
		color: #8c0818;
		position: absolute;
		top: 57px;
		left: 30px;
	}
	.contents main #internal aside li:nth-of-type(2n)>div::before {
		left: 90px;
	}
}
@media (min-width: 960px) {
	.contents main #internal aside h3 {
		white-space: nowrap;
	}
}
@media (min-width: 768px) and (max-width: 959px) {
	.contents main #internal aside h3 br {
		display: none;
	}
}
@media (max-width: 767px) {
	.contents main #internal .trouble li {
		padding: 20px;
		border-radius: 20px;
		margin-bottom: 10px;
		position: relative;
	}
	.contents main #internal .trouble li::before {
		font-size: 300%;
		top: -10px;
	}
	.contents main #internal .trouble li br {
		display: none;
	}
	.contents main #internal .trouble .image {
		margin-top: -30px;
	}
	.contents main #internal .subcopy1 {
		margin-top: 20px;
		font-size: 150%;
	}
	.contents main #internal aside h3 {
		line-height: 150%;
	}
	.contents main #internal aside h3 br {
		display: none;
	}
	.contents main #internal aside {
		margin-top: 50px;
	}
	.contents main #internal aside .txt {
		padding: 10px;
	}
	.contents main #internal aside .image {
		margin: auto;
	}
}


.contents main #making li {
	width: 100%;
	min-height: 472px;
	margin-bottom: 20px;
}
.contents main #making h3 {
	color: #fff;/* color: #333; */
	text-align: center;
	vertical-align: middle;
	position: relative;
}
.contents main #making li:nth-of-type(2n-1) h3 {
	background-color: #217892;
}
.contents main #making li:nth-of-type(2n) h3 {
	background-color: #dc1a37;
}
.contents main #making h3>span {
	color: rgba(255,255,255,0.5);
	font-weight: 200;
}
.contents main #making div {
	border: solid rgba(0,0,0,0.15);
}
.contents main #making h4 {
	font-size: 125%;
	color: #333;
	position: relative;
	padding-bottom: 25px;
	margin-bottom: 25px;
	border-bottom: 2px solid #c2c2c2;
	font-weight: bold;
}
.contents main #making h4::before {
	content: "";
	width: 159px;
	height: 2px;
	display: block;
	position: absolute;
	bottom: -2px;
	left: 0;
	background-color: #217892;
}
.contents main #making li:nth-of-type(2n) h4::before {
	background-color: #cf142b;
}
@media (min-width: 768px) {
	.contents main #making li {
		display: table;
	}
	.contents main #making li>* {
		display: table-cell;
	}
	.contents main #making h3 {
		width: 156px;
		padding: 0 46px;
	}
	.contents main #making h3>* {
		-webkit-writing-mode: vertical-rl;
		-ms-writing-mode: tb-rl;
		writing-mode: vertical-rl;
		color: #fff;
		/* position: absolute;*/
		/* top: 18%; */
		/* bottom: 18%; */
		/* height: 64%; */
		height: 160px;
	}
	.contents main #making div {
		padding: 60px;
		border-width: 1px 1px 1px 0;
	}
	.contents main #making h3>strong {
		font-size: 200%;
		/* text-align-last: justify; */
		/* left: calc(50% + 5px); */
		text-align: left;
		letter-spacing: 5px;
		float: right;
	}
	.contents main #making h3>span {
		font-size: 150%;
		/* right: calc(50% + 5px); */
		text-align: left;
		float: left;
	};
}
@media (max-width: 767px) {
	.contents main #making h3 {
		margin-bottom: 0;
	}
	.contents main #making div {
		padding: 10px;
		border-width: 0 1px 1px;
	}
	.contents main #making h3 {
		font-size: 125%;
		padding: 5px;
	}
	.contents main #making h3>* {
		display: block;
	}
	.contents main #making h3>span {
		font-size: 87.5%;
	}
}


.contents main #performance {
	background-color: #f3f3f3;
}
.contents main #performance ul {
	text-align: center;
}
.contents main #performance ul>li {
	display: inline-block;
	vertical-align: top;
}
.contents main #performance ul>li>.image {
	margin-bottom: 10px;
}
.contents main #performance ul>li>.txt {
	font-size: 87.5%;
	line-height: 150%;
/*	white-space: nowrap;*/
}
.contents main #performance ul>li:nth-of-type(4) {
	margin-right: 0;
}
.contents main #performance .button a {
	font-weight: normal;
	background-color: #999999;
}
.contents main #performance .button a:after {
	display: none;
}

@media (min-width: 768px) {
	.contents main #performance {
		background-position: 340px -310px;
	}
	.contents main #performance ul>li {
		width: calc(25% - 13px);
		margin: 0 13px 50px 0;
	}
	.contents main #performance ul>li:nth-last-of-type(-n+3)>.image>img {
		width: auto;
		margin: auto;
	}
	.contents main #performance .button {
		width: calc(50% - 25px);
		margin: 0 auto;
		display: block;
	}
}
@media (max-width: 767px) {
	.contents main #performance ul>li {
		width: calc(50% - 10px);
		margin-bottom: 10px;
	}
	.contents main #performance ul>li:nth-child(2n-1) {
		margin-right: 10px;
	}
	.contents main #performance ul>li:nth-last-of-type(-n+3)>.image>img {
		width: auto;
		max-height: 140px!important;
		margin: auto;
	}
}

.contents main #customer {
    border: solid #e3e3e3;
    border-width: 1px 0;
    background-color: #f8f8f8;
}
.contents main #customer .list>li {
	border: 1px solid rgba(0,0,0,0.15);
	background-color: #fff;
}
.contents main #customer .list>li>a {
	display: block;
}
.contents main #customer .image {
	margin: 0;
}
.contents main #customer h4 {
	color: #fff;
	text-align: center;
	line-height: 200%;
	background-color: #cf142b;
	margin-bottom: 0;
}
@media (min-width: 768px) {
	.contents main #customer .list {
		display: flex;
		flex-wrap: wrap;
	}
	.contents main #customer .list>li {
		display: inline-block;
		vertical-align: top;
		/* width: calc(33.33% - 20px); */width: calc(50% - 16px);
		margin-bottom: 50px;
	}
	.contents main #customer .list>li:not(:nth-of-type(2n)) {
	/*.contents main #customer .list>li:not(:nth-of-type(3n)) {
		margin-right: 20px;*/
		margin-right: 28px;
	}
	.contents main #customer .list>li .txt {
		/* padding: 15px 30px; */ padding: 25px 50px 50px;
		color: #333;
	}
}
@media (max-width: 767px) {
	.contents main #customer .list>li {
		margin-bottom: 10px;
	}
	.contents main #customer .image>span {
		transform: scale(0.75,0.75);
	}
	.contents main #customer .list>li .txt {
		padding: 20px 10px 10px;
		color: #333;
	}
}

.contents main #support .list>li {
	border: 1px solid rgba(0,0,0,0.15);
}
.contents main #support .image {
	margin: 0;
}
.contents main #support .image>span {
	font-size: 125%;
	color: #fff;
	text-align: center;
	width: 280px;
	line-height: 44px;
	background-color: #333;
	border-radius: 22px;
	white-space: nowrap;
	position: absolute;
	left: calc(50% - 140px);
	bottom: -22px;
}
@media (min-width: 768px) {
	.contents main #support h2+.txt {
		/* white-space: nowrap; */
		margin-right: -10px;
		margin-left: -10px;
	}
	.contents main #support .list {
		display: flex;
		flex-wrap: wrap;
	}
	.contents main #support .list {
		display: flex;
		flex-wrap: wrap;
	}
	.contents main #support .list>li {
		display: inline-block;
		vertical-align: top;
		width: calc(50% - 16px);
		margin-bottom: 50px;
	}
	.contents main #support .list>li:nth-of-type(2n-1) {
		margin-right: 28px;
	}
	.contents main #support .list>li>.txt {
		padding: 50px;
	}
}
@media (max-width: 767px) {
	.contents main #support .list>li {
		margin-bottom: 10px;
	}
	.contents main #support .image>span {
		transform: scale(0.75,0.75);
	}
	.contents main #support .list>li>.txt {
		padding: 20px 10px 10px;
	}
}

main #about {
	background-color: #f3f3f3;
}
main #about h3 {
	font-size: 125%;
	color: #333;
	font-weight: bold;
}
main #about .linemenu>span::before,
main #about .linemenu>span::after {
	background-color: #cf142b;
}
main #about .reason>li {
	display: inline-block;
	vertical-align: top;
}
main #about h4 {
	font-size: 112.5%;
	color: #333;
	text-align: center;
	margin-bottom: 30px;
	font-weight: bold;
}
main #about .txt {
	font-size: 93.75%;
	color: #333;
}
@media (min-width: 768px) {
	main #about {
		background-position: -940px -270px;
	}
	main #about h2 strong {
		letter-spacing: 7.2px;
	}
	main #about h3 {
		text-align: left;
		margin-top: 10px;
		margin-bottom: 30px;
		letter-spacing: 1.6px;
	}
	main #about .reason>li {
		width: calc(20% - 20px);
	}
	main #about .reason>li .image>img {
		max-width: 150px!important;
		max-height: 150px!important;
	}
	main #about .reason>li:not(:last-child) {
		margin-right: 20px;
	}
	@supports (-ms-ime-align: auto) {
		main #about .reason>li:not(:last-child) {
			margin-right: 19px;
		}
	}
}
@media (max-width: 767px) {
	main #about h3 br {
		display: none;
	}
	main #about .reason {
		font-size: 87.5%;
		line-height: 150%;
	}
	main #about .reason>li {
		width: calc(50% - 10px);
	}
	main #about .reason>li:not(:nth-child(2n)) {
		margin-right: 10px;
	}
}


.contents main #faq {
  background-image: radial-gradient(#e7e7e7 1px, transparent 0), radial-gradient(#e7e7e7 1px, transparent 0);
  background-position: 0 0, 5px 5px;
  background-size: 10px 10px;
}
.contents main #faq dt {
	color: #222;
	font-weight: bold;
}
.contents main #faq dt,
.contents main #faq dd {
	line-height: 20px;
	position: relative;
	padding: 15px 0 15px 75px;
}
.contents main #faq dd {
    padding: 12px 0 15px 75px;
}
.contents main #faq dd {
	line-height: 150%;
}
.contents main #faq dd a {
	text-decoration: underline;
	color: #cf142b;
}
.contents main #faq dl>dt:not(:first-child) {
	margin-top: 50px;
}
.contents main #faq dl>dt:not(:last-child) {
	margin-bottom: 20px;
}
.contents main #faq dt::before,
.contents main #faq dd::before {
	font-size: 20px;
	line-height: 50px;
	display: block;
	color: #fff;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
	width: 50px;
	height: 50px;
	overflow: hidden;
	border-radius: 50%;
}
.contents main #faq dt::before {
	content: "Q";
	background-image: linear-gradient(-45deg, #c3162f 50%, #dc1a37 50%);
}
.contents main #faq dd {
	/* display: none; */
	color: #222;
}
.contents main #faq dd::before {
	content: "A";
	background-image: linear-gradient(-45deg, #247d94 50%, #2a90a9 50%);
}
@media (min-width: 768px) {
	.contents main #faq dt {
		font-size: 125%;
	}
}
@media (max-width: 767px) {
}


main #download {
	border-top: 1px solid #e3e3e3;
}
main #download>section {
	border: 4px solid #cf142b;
	padding: 0;
}
main #download>section>div {
	border: 2px solid #ebf2f9;
}
main #download h3,
main #download .ribbon,
main #download .checklist {
	font-size: 125%;
	color: #fff;
}
main #download .ribbon {
	line-height: 110%;
	text-align: center;
}
main #download .ribbon>span {
	background-color: #dc1a37;
	text-align: center;
	display: block;
}
main #download .checklist {
	width: 280px;
	line-height: 32px;
	border-radius: 16px;
	background-color: #333;
	text-align: center;
	margin: -20px auto 30px;
	position: relative;
}
main #download .checklist::before {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	bottom: -10px;
	left: calc(50% - 10px);
	border-top: 10px solid #333;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
}
main #download div>.txt {
	margin-top: 30px;
	border-top: 2px solid #333;
	padding-top: 50px;
}
main #download ul,
main #download ol {
	counter-reset: download;
	border: 1px solid #e5e5e5;
	background-color: #fff;
}
main #download ul>li {
	list-style: disc;
	margin-left: 2em;
}
main #download h2>span {
	color: #333;
}
.contents main #download h2>strong {
	color: #cf142b;
}
main #download h2>span::before,
main #download h2>span::after {
	display: none;
}
main #download h3 {
	color: #fff;
	background-color: #333;
	text-align: center;
	margin-bottom: 0;
}
main #download ol>li {
	counter-increment: download;
}
main #download ol>li>.txt::before {
	content: counter(download) ". ";
}
main #download ol>li>strong {
	font-size: 275%;
}
main #download ol>li>dl>dt {
	width: 300px;
	margin-right: 20px;
	position: relative;
}
main #download ol>li>dl strong {
	color: #cf142b;
}
main #download ol>li>dl>dd::before {
	top: 0;
	content: "ここがポイント";
	font-size: 75%;
	color: #fff;
	background-color: #333;
	display: block;
	text-align: center;
	width: 123px;
	border-radius: 11px;
}
main #download .link {
	padding: 45px 0;
	background-color: #dc1a37;
}
main #download .link>a {
	display: block;
	width: calc(100% - 10px);
	max-width: 484px;
	line-height: 78px;
	background-color: #fff;
	color: #222;
	text-align: center;
	margin: auto;
	border-radius: 4px;
	position: relative;
    font-weight: bold;
}
main #download .link>a::before {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	position: absolute;
	left: 30px;
	top: calc(50% - 5px);
	border: solid #222;
	border-width: 2px 2px 0 0;
	transform: rotate(45deg);
}
main #download .link>a[target="_blank"]::before {
	top: calc(50% - 35px);
	content: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/icon_s_newwindow_02-2.png);
    display: block;
    width: auto;
    height: auto;
    position: absolute;
	left: 20px;
    border: solid #fff;
    border-width: 0;
	transform: rotate(0deg);
}
.officesignage main #download p.sub {
	font-weight: bold;
	text-align: center;
}
.officesignage main #download h2 {
	color: #cf142b;
}
.officesignage main #download h2>span {
	color: #cf142b;
	font-weight: bold;
}



main #download .baloon{
	margin: 0 auto 40px auto;
	width: 462px;
	height: 51px;
	border: 2px solid #cccccc;
	border-radius: 10px;
	background: #ffffff;
	text-align: center;
	font-size: 15px;
	line-height: 51px;
	font-weight: bold;
	position: relative;
}

main #download .baloon:before{
	content: '';
	position: absolute;
	margin: auto;
	left: 0;
	right: 0;
	bottom: -19px;
	display: block;
	width: 26px;
	height: 19px;
	background: url('/-/Media/Ricoh/Sites/co_jp/signage/special/officesignage/images/_baloon_arrow.png');
	background-size: 26px 19px;
}

@media (min-width: 768px) {
	main #download>section {
		margin: 100px auto;
	}
	main #download>section>div {
		margin: 16px;
		padding: 60px 70px;
		background-image :
			repeating-linear-gradient(to bottom,	/* 横線 */
				transparent 13px,
				#f1f6fb 14px,  #f1f6fb 14px,
				transparent 15px,  transparent 27px,
				#f1f6fb 28px,  #f1f6fb 28px,
				transparent 29px,  transparent 41px,
				#f1f6fb 42px,  #f1f6fb 42px,
				transparent 43px,  transparent 55px,
				#f1f6fb 56px,  #f1f6fb 56px,
				transparent 57px,  transparent 69px,
				#f1f6fb 70px,  #f1f6fb 70px),
			repeating-linear-gradient(to right,		/* 縦線 */
				transparent 13px,
				#f1f6fb 14px,  #f1f6fb 14px,
				transparent 15px,  transparent 27px,
				#f1f6fb 28px,  #f1f6fb 28px,
				transparent 29px,  transparent 41px,
				#f1f6fb 42px,  #f1f6fb 42px,
				transparent 43px,  transparent 55px,
				#f1f6fb 56px,  #f1f6fb 56px,
				transparent 57px,  transparent 69px,
				#f1f6fb 70px,  #f1f6fb 70px);
	}
	main #download .ribbon {
		position: absolute;
		width: 200px;
		height: 200px;
		overflow: hidden;
		left: -12px;
		top: -12px;
	}
	main #download .ribbon::before,
	main #download .ribbon::after {
		content: "";
		display: block;
		width: 10px;
		height: 10px;
		background-color: #8f1322;
		position: absolute;
	}
	main #download .ribbon::before {
		left: 0;
		bottom: 0;
	}
	main #download .ribbon::after {
		right: 0;
		top: 0;
	}
	main #download .ribbon>span {
		transform: rotate(-45deg);
		padding: 10px;
		width: 400px;
		height: 65px;
		position: absolute;
		top: 45px;
		left: -125px;
		box-shadow: 0 10px 2px rgba(0,0,0,0.1);
		z-index: 1;
	}


	main #download p.sub {
		font-size: 162.5%;
		margin-bottom: 20px;
	}

	main #download h2 {
		font-size: 111%;
	}

	main #download h2>span {
		font-size: 162.5%;
		margin-bottom: 20px;
	}
	main #download ul,
	main #download ol {
		padding: 40px 35px;
	}
	main #download h3 {
		line-height: 50px;
	}
	main #download ul {
		font-size: 125%;
	}
	main #download ol>li>.txt {
		font-size: 162.5%;
	}
	main #download ol>li>dl {
		padding-left: 1em;
		margin-bottom: 30px;
		line-height: 22px;
	}
	main #download ol>li>dl>dt::after {
		content: "";
		display: block;
		width: 50px;
		height: 1px;
		position: absolute;
		right: 0;
		top: calc(50% - 0.5px);
		background-color: #333;
	}
	main #download ol>li>dl>dd::before {
		margin-right: 10px;
		position: absolute;
		left: 0;
		top: 0;
	}
	main #download ol>li>dl>dd {
		width: calc(100% - 320px);
		position: relative;
		padding-left: 133px;
	}
	.officesignage main #download div>.txt {
		text-align: center;
	}
}
@media (min-width: 900px) {
	main #download ol>li>dl>* {
		display: inline-block;
		margin-bottom: 1em;
		vertical-align: top;
	}
}
@media (min-width: 768px) and (max-width: 899px) {
	main #download ol>li>dl>dd {
		width: 100%;
	}
	main #download ol>li>dl>dd {
		margin: 10px 0 20px 60px;
	}
}
@media (max-width: 767px) {
	main #download>section {
		/* margin: 10px; */ margin: 50px 10px 10px;
		width: calc(100% - 20px);
		position: relative;
	}
	main #download>section>div {
		margin: 16px;
		padding: 40px 10px 10px;
		background-image: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/download_bg_sp.png);
	}
	main #download .ribbon {
		position: absolute;
		top: -42px;
		left: -4px;
		right: -4px;
	}
	main #download .ribbon>span {
		line-height: 200%;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
	}
	main #download .ribbon br {
		display: none;
	}


	main #download .baloon{
		width: 326px;
		font-size: 13px;
	}



	main #download ul,
	main #download ol {
		padding: 10px;
	}
	main #download .checklist {
		transform: scale(0.75,0.75);
		margin: 10px 0;
	}
	main #download h2 {
		margin-bottom: 0;
	}
	main #download h2>span {
		line-height: 150%;
	}
	main #download h3 {
		line-height: 200%;
	}
	main #download ol>li>dl {
		margin-bottom: 30px;
	}
	.officesignage main #download div>.txt br {
		display: none;
	}
}








.officesignage header .title>.txt {
	background-color: #eee;
	text-align: center;
}
.officesignage header .title strong {
	color: #cf142b;
}
@media (min-width: 768px) {
	.officesignage header {
		background-image: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/officesignage_head_bg.jpg);
	}
	.officesignage header .title>h1 {
		font-size: 262.5%;
		line-height: 133.33%;
		height: 171px;
		position: absolute;
		top: 30px;
		font-weight: bold;
	}
	.officesignage header .title>.txt {
		font-size: 150%;
		line-height: 65px;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		font-weight: bold;
	}
}
@media (max-width: 767px) {
	.officesignage header>section {
		background-image: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/officesignage_head_bg.jpg);
	}
	#contents.officesignage header .title>h1 {
		font-size: 150%;
		line-height: 125%;
		background-color: #fff;
		padding: 3% 9%;
		font-weight: bold;
	}
	/* .officesignage header .title>h1 br {
		display: none;
	} */
	#contents.officesignage header .title>.txt {
		line-height: 200%;
		padding: 0;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 0;
		font-weight: bold;
	}
}
@media (max-width: 500px) {
	#contents.officesignage header .title>h1 {
		letter-spacing: 0;
	}
}

.officesignage #internal aside>section {
	background-color: #f3f3f3;
}
.officesignage #internal aside h3 {
	font-size: 225%;
	text-align: center;
}
.officesignage #internal aside h3>strong {
	color: #cf142b;
}

@media (max-width: 767px) {
	.officesignage #internal aside h3 {
		font-size: 150%;
		line-height: 125%;
	}
}

.officesignage #internal aside ul {
	margin: auto;
	overflow: hidden;
	counter-reset: internal;
}
.officesignage #internal aside li {
		background-color: #fff;
		overflow: hidden;
		counter-increment: internal;
}
.officesignage #internal aside li>h4 {
	font-size: 112.5%;
	color: #ffffff;
	background-color: #cf142b;
	margin-bottom: 0;
}
.officesignage #internal aside li>h4>span {
	display: block;
	color: #fff;
	background-color: #353535;
}
.officesignage #internal aside li>h4>span::after {
	content: counter(internal);
}
.officesignage #internal aside li .txt {
	margin-bottom: 20px;
}
@media (min-width: 768px) {
	.officesignage #internal aside>section {
		padding-left: 50px;
		padding-right: 50px;
	}
	.officesignage #internal aside ul {
		width: 100%;
		max-width: 900px;
		display: flex;
		flex-wrap: wrap;
		align-content: space-between;
	}
	.officesignage #internal aside li {
		display: inline-block;
		vertical-align: top;
		width: calc(50% - 22px);
		margin-bottom: 40px;
	}
	.officesignage #internal aside li>div {
		padding: 35px;
	}
	.officesignage #internal aside li>h4 {
		height: 60px;
		line-height: 60px;
	}
	.officesignage #internal aside li>h4>span {
		float: left;
		height: 60px;
		padding: 0 20px;
		margin-right: 20px;
	}
	.officesignage #internal aside li:not(:nth-child(2n)) {
		margin-right: 40px;
	}
	.officesignage #internal aside li>h4>span::after {
		font-size: 237.5%;
		margin-left: 2px;
	}
}
@media (max-width: 767px) {
	.officesignage #internal aside li>h4 {
		line-height: 200%;
	}
	.officesignage #internal aside li>h4>span {
		font-size: 75%;
		display: inline-block;
		padding: 0 5px;
		margin-right: 10px;
	}
	.officesignage #internal aside li {
		display: block;
		margin-bottom: 10px;
	}
	.officesignage #internal aside li>div {
		padding: 10px;
	}
}



.officesignage #scene {
	background-color: #cf142b;
	color: #fff;
}
.officesignage #scene h2>span{
	color: #fff;
}
.officesignage #scene h3 {
	font-weight: bold;
}
.officesignage #scene h3 strong {
	font-size: 137.5%;
}
.officesignage #scene .linemenu>span::before,
.officesignage #scene .linemenu>span::after {
	background-color: #fff;
}
.officesignage #scene li {
	display: inline-block;
	vertical-align: top;
	width: calc(33.33% - 27px);
	margin-bottom: 50px;
}
.officesignage #scene li .image {
	margin-bottom: 20px
}
.officesignage #scene li h4 {
	position: relative;
}
.officesignage #scene .button {
  width: 33%;
  display: inline-block;
  text-align: center;
  margin-right: 5px;
}
.officesignage #scene .button:last-child {
    margin-right: 0;
}

.officesignage #scene .button a {
	background-color: #999999;
}
/*.officesignage #scene li h4::after {
	content: "";
	display: block;
	width: 20px;
	height: 2px;
	background-color: #fff;
	position: absolute;
	bottom: -10px;
	left: 0;
}*/
@media (min-width: 768px) {
	.officesignage #scene {
		background-position: 300px;
	}
	.officesignage #scene li {
		width: calc(33.33% - 27px);
		margin-bottom: 50px;
	}
	.officesignage #scene li:not(:nth-of-type(3n)) {
		margin-right: 36px;
	}
	@supports (-ms-ime-align: auto) {
		.officesignage #scene li:not(:nth-of-type(3n)) {
			margin-right: 35px;
		}
	}
	.officesignage #scene li h4 {
	margin-bottom: 10px;
    font-size: 18px;
    font-weight: bold;
	}
}
@media (max-width: 767px) {
	.officesignage #scene li {
		font-size: 87.5%;
		line-height: 150%;
	}
	.officesignage #scene li {
		width: calc(50% - 10px);
		margin-bottom: 10px;
	}
	.officesignage #scene li:not(:nth-of-type(2n)) {
		margin-right: 10px;
	}
	.officesignage #scene li h4 {
		margin-bottom: 20px;
		font-size: 16px;
		font-weight:bold;
	}
	.officesignage #scene .button {
		width: 100%;
    margin-top: 10px;
	}
}

.officesignage #cont {
	border-bottom: 1px solid #e3e3e3;
}
.officesignage #cont h3 {
	font-size: 125%;
	color: #333;
	font-weight: bold;
	text-align: left;
}

@media (min-width: 768px) {
	.officesignage #cont h3 {
		margin-top: 10px;
		margin-bottom: 30px;
		letter-spacing: 1.6px;
	}
	.officesignage #cont .linemenu {
		clear: both;
	}
	.officesignage #cont div:after {
		content: "";
		display: block;
		clear: both;
	}
	.officesignage #cont div .image{
		width: 41.4%;
		float: right;
		margin-left: 60px;
	}
	.officesignage #cont div:last-of-type .image {
		margin-bottom: 0;
	}
}
@media (max-width: 767px) {
	.officesignage #cont h3 {
		letter-spacing: 1px;
	}
	.officesignage #cont div .image{
		margin-bottom: 20px;
	}
	.officesignage #cont div:first-of-type p {
		margin-bottom: 20px;
	}
}



.officesignage #case {
  background-image: radial-gradient(#e7e7e7 1px, transparent 0), radial-gradient(#e7e7e7 1px, transparent 0);
  background-position: 0 0, 5px 5px;
  background-size: 10px 10px;
}
.officesignage #case h3 {
	font-weight: bold;
}
.officesignage #case .illustration {
    margin-top: 30px;
    border-top: 1px solid #e3e3e3;
    padding-top: 50px;
}
.officesignage #case .illustration>li {
	display: inline-block;
	vertical-align: top;
}
.officesignage #case .illustration>li .image {
	margin-bottom: 20px;
	position: relative;
}
.officesignage #case .illustration .icon {
	margin-bottom: 5px;
}
.officesignage #case .illustration .icon>span {
	font-size: 75%;
	line-height: 200%;
	padding: 0 10px;
	margin: 5px 5px 0 0;
	color: #fff;
	background-color: #666;
	display: inline-block;
}
/*l.officesignage #case .illustration li>.image>span {
	font-size: 75%;
	ine-height: 120%;
	padding: 10px;
	color: #fff;
	width: 50px;
	height: 50px;
	border-radius: 25px;
	background-color: #333;
	position: absolute;
	top: -18px;
	text-align: center;
	border: 2px solid #fff;
}
/*.officesignage #case .illustration li>.image>span.p1 {
	background-color: #217892;
	padding: 5px 10px;
}
.officesignage #case .illustration li>.image>span.p2 {
	background-color: #cf142b;
}
.officesignage #case .illustration li>.image>span.p3 {
	background-color: #f8bf56;
	color: #333;
}
.officesignage #case .illustration li>.image>span.p4 {
	background-color: #333;
}
.officesignage #case .illustration>li>.image>span:nth-of-type(1) {
	right: -10px;
}
.officesignage #case .illustration>li>.image>span:nth-of-type(2) {
	right: 35px;
}
.officesignage #case .illustration>li>.image>span:nth-of-type(3) {
	right: 80px;
}*/
.officesignage #case .illustration>li>h4 {
	/* margin-bottom: 10px; */ margin-bottom: 0;
	font-weight: bold;
	line-height: 150%;
}
.officesignage #case aside section {
	padding: 0;
	margin-bottom: 50px;
}
.officesignage #case aside section.point {
	padding: 0;
	margin-bottom: 0 !important;
	padding-bottom: 100px;
}
.officesignage #case aside .point>div {
	background-color: #e9f2f4;
}
.officesignage #case aside .study>div {
	background-color: #f3f3f3;
}
.officesignage #case aside section>h3 {
	color: #fff;
	text-align: center;
	margin-bottom: 0;
}
.officesignage #case aside .point>h3 {
	background-color: #217892;
}
.officesignage #case aside .study>h3 {
	background-color: #cf142b;
}
.officesignage #case aside .point>div {
	background-color: #e9f2f4;
}
.officesignage #case aside .study>div {
	background-color: #f3f3f3;
}
.officesignage #case aside .point h4 {
	color: #217892;
}
.officesignage #case aside .study h4 {
	text-align: center;
	color: #333;
	padding-bottom: 12px;
	border-bottom: 3px solid #cf142b;
}
.officesignage #case aside .study h4>strong {
	font-size: 161.5384%;
	color: #cf142b;
	font-weight: normal;
}
/*
.officesignage #case aside .study ul {
	width: 100%;
	margin: auto;
}
.officesignage #case aside .study li {
	position: relative;
}
.officesignage #case aside .study li .image>span {
	position: absolute;
	width: 280px;
	line-height: 44px;
	border-radius: 22px;
	left: calc(50% - 140px);
	bottom: -22px;
	text-align: center;
	font-size: 125%;
	color: #fff;
}
.officesignage #case aside .study li:first-of-type .image>span {
	background-color: #222;
}
.officesignage #case aside .study li:last-of-type .image>span {
	background-color: #cf142b;
}
.officesignage #case aside .study li:first-of-type::after {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-left: 18px solid #cf142b;
	border-top: 36px solid transparent;
	border-bottom: 36px solid transparent;
}
#case .allow_txt {
	font-size: 150%;
	height: 140px;
}*/

.officesignage #case02 {
	background-position: -940px -270px;
}
.officesignage #case02 .img {
	overflow: hidden;
}
.officesignage #case02 .button {
	width: calc(50% - 25px);
	display: block;
	text-align: center;
	margin: auto;
}
.officesignage #case02 .button a {
	background-color: #cf142b;
}
.officesignage #case02 .button a:after {
	display: none;
}

@media (min-width: 768px) {
	.officesignage #case .illustration>li {
		width: calc(33.33% - 27px);
		margin-bottom: 50px;
	}
	.officesignage #case h3.linemenu {
		margin-top: 50px;
		font-size: 150%;
		letter-spacing: 10px;
	}
	.officesignage #case h3.linemenu+.txt {
		letter-spacing: -0.5px;
	}
    .officesignage #case .illustration>li>h4.tworow {
        height: 48px;
    }
	.officesignage #case .illustration>li:not(:nth-of-type(3n)) {
		margin-right: 36px;
	}
	@supports (-ms-ime-align: auto) {
		.officesignage #case .illustration>li:not(:nth-of-type(3n)) {
			margin-right: 35px;
		}
	}
	.officesignage #case aside section>h3 {
		font-size: 150%;
		line-height: 64px;
		background-position: 0px 200px;
		background-size: 1000px 1000px;
	}
	.officesignage #case aside section>div {
		padding: 60px;
	}
	.officesignage #case aside .point h4 {
		font-size: 150%;
	}
	.officesignage #case aside .study h4 {
		font-size: 200%;
		line-height: 200%;
	}
	.officesignage #case aside .point .image {
		width: 41.4%;
		float: right;
		margin-left: 60px;
	}
	.officesignage #case aside .study ul {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	/*
	.officesignage #case aside .study li:first-of-type {
		width: 38%;
	}
	.officesignage #case aside .study li:first-of-type::after {
		position: absolute;
		right: -35px;
		top: calc(50% - 36px);
	}
	.officesignage #case aside .study li:last-of-type {
		width: calc(62% -70px);
		border: 3px solid #cf142b;
	}*/
	.officesignage #case02 .img img{
		width: auto;
		height: 178px;
	}
	.officesignage #case02 .cnt_max {
		margin-bottom: 50px;
	}
}
@media (max-width: 767px) {
	.officesignage #case aside section>h3 {
		font-size: 125%;
		line-height: 200%;
	}
	.officesignage #case aside .point h4,
	.officesignage #case aside .study h4 {
		font-size: 125%;
	}
	.officesignage #case .illustration {
		font-size: 87.5%;
		line-height: 150%;
	}
	.officesignage #case .illustration>li {
		width: calc(50% - 10px);
		margin-bottom: 10px;
	}
	.officesignage #case .illustration>li:not(:nth-of-type(2n)) {
		margin-right: 10px;
	}
	.officesignage #case aside section>div {
		padding: 10px;
	}
	.officesignage #case aside .study li:first-of-type::after {
		margin: auto;
		transform: rotate(90deg);
	}
	/* .officesignage #case .illustration li>.image>span {
		transform: scale(0.75,0.75);
		bottom: -20px;
		top: auto;
	}
	.officesignage #case .illustration>li>.image>span:nth-of-type(1) {
		right: -10px;
	}
	.officesignage #case .illustration>li>.image>span:nth-of-type(2) {
		right: 20px;
	}
	.officesignage #case .illustration>li>.image>span:nth-of-type(3) {
		right: 50px;
	} */

	.officesignage #case02 {
		padding-bottom: 50px;
		background-color: #f3f3f3;
	}
	.officesignage #case02 .img img {
		width: 100%;
		height: auto;
	}
	.officesignage #case02 .cnt_max {
		margin-bottom: 20px;
	}
	.officesignage #case02 .button {
		width: 100%;
	}
	.officesignage #case02 .button a:after {
		display: none;
	}

}

#related {
	border-top: 1px solid #e3e3e3;
}
#related section:after {
	content: "";
	display: block;
	clear: both;
}
#related .lead_txt {
	font-size: 190%;
	font-weight: bold;
	padding-bottom: 22px;
	position: relative;
	text-align: left;
}
#related h2.lead_txt {
	border-left: solid 5px #333333;
	padding: 5px 0px 10px 10px;
}
@media (max-width: 767px) {
	#related section {
		padding: 30px 0 40px;
	}
	#related .lead_txt {
		margin-bottom: 20px;
		font-size: 150%;
	}
	#related .clm2 .clm {
		width: 100%;
	}
}

.officesignage main #faq {
  padding: 40px 0 0 0;
}
.officesignage main #faq dt {
	color: #222;
	font-weight: bold;
}
.officesignage main #faq dt,
.officesignage main #faq dd {
	line-height: 20px;
	position: relative;
	padding: 15px 0 15px 75px;
}
.officesignage main #faq dd {
    padding: 12px 0 15px 75px;
}
.officesignage main #faq dd {
	line-height: 150%;
}
.officesignage main #faq dd a {
	text-decoration: underline;
	color: #cf142b;
}
.officesignage main #faq dl>dt:not(:first-child) {
	margin-top: 50px;
}
.officesignage main #faq dl>dt:not(:last-child) {
  margin-bottom: 10px;
  border-bottom: 1px solid #222;
  padding-bottom: 20px;
}
.officesignage main #faq dt::before,
.officesignage main #faq dd::before {
	font-size: 20px;
	line-height: 50px;
	display: block;
/*	color: #fff;*/
  color: #222;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
	width: 50px;
	height: 50px;
	overflow: hidden;
	border-radius: 50%;
  font-weight: 600;
}
.officesignage main #faq dt::before {
	content: "Q.";
/*	background-image: linear-gradient(-45deg, #c3162f 50%, #dc1a37 50%);*/
}
.officesignage main #faq dd {
	color: #222;
}
.officesignage main #faq dd::before {
	content: "A.";
/*	background-image: linear-gradient(-45deg, #247d94 50%, #2a90a9 50%);*/
}
@media (min-width: 768px) {
	.officesignage main #faq dt {
		font-size: 125%;
	}
}


#contact {
	/* background-color: #343434; */ background-color: #f6fafb;
	padding: 0;
}
#contact>section {
	/* padding: 30px 10px; */ padding: 30px 0 40px;
	text-align: center;
}
#contact .txt {
	margin-bottom: 30px;
	font-weight: bold;
}
#contact .button {
	display: block;
	text-align: center;
	margin: auto;
	border-radius: 4px;
	position: relative;
}
#contact a {
	/* background-color: #f8bf56; */ background-color: #dc1a37;
	border-radius: 4px;
}
#contact a::after {
	content: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/icon_s_mail_02.png);
	line-height: 100%;
	position: absolute;
	left: 20px;
	top: calc(50% - 10px);
}
#contact a::before {
	display: none;
}
@media (min-width: 768px) {
	#contact .button {
		width: calc(50% - 25px);
	}
	#contact .txt {
		font-size: 125%;
	}
}
@media (max-width: 767px) {
	#contact {
		padding: 0 10px;
	}
	#contact .button {
		width: 100%;
	}
}


#fix_footer {
	display: block;
	background-color: rgba(0,0,0,0.7);
	padding: 30px 10px 20px;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 100;
}
#fix_footer ul {
	display: block;
	margin: auto;
	text-align: center;
	width: 100%;
/*	max-width: 1060px;*/
	max-width: 1600px;
}
#fix_footer li {
	/* margin-bottom: 10px; */
	position: relative;
}
#fix_footer li>a {
	display: block;
	padding: 16px 0;
	background-color: #cf142b;
	color: #fff;
	width: 100%;
	line-height: 100%;
	position: relative;
	font-weight: bold;
}
#fix_footer li>a:hover {
	text-decoration: none;
	opacity: 0.6;
	/* transition: all 400ms 0s ease; */
}
#fix_footer li>a::before {
    top: calc(50% - 10px);
    display: block;
    width: auto;
    height: auto;
    position: absolute;
	left: 10px;
    border: solid #fff;
    border-width: 0;
}
#fix_footer li>a[target="_blank"]::before {
	content: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/icon_s_newwindow_02.png);
}
#fix_footer li>a.icon-download::before {
	content: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/icon_s_newwindow_02-1.png);
}
#fix_footer li>a.mailto::before {
	content: url(/-/Media/Ricoh/Sites/co_jp/signage/special/img/icon_s_mail_02.png);
  left: 2px;
}
#fix_footer.hidden {
	display: none!important;
	transition: all 400ms 0s ease;
}
@media (min-width: 1000px) {

  #fix_footer ul.officesignage,
  #fix_footer ul.contents {
    letter-spacing: -0.5px;
  }
	#fix_footer li {
/*	width: calc(25% - 25px);*/
    width: calc(17% - 18px);
	}
	#fix_footer li {
		margin: 0 5px;
	}
	/*#gl_footer {
		padding-bottom: 100px;
	}*/
}
@media (min-width: 768px) {
	#fix_footer li {
		display: inline-block;
	}
	#fix_footer li>a {
		border-radius: 10px;
	}
	#fix_footer li>a {
		padding-left: 25px;
		box-sizing: border-box;
	}
	#fix_footer .officesignage li,
	#fix_footer .contents li {
		display: inline-table;
    vertical-align: bottom;
	}
	#fix_footer .officesignage li.lh200per a,
	#fix_footer .contents li.lh200per a {
		line-height: 200%;
	}

}
@media (min-width: 768px) and (max-width: 999px) {
	#fix_footer li {
		width: calc(50% - 25px);
	}
	#fix_footer li:nth-child(2n-1) {
		margin-right: 10px;
	}
	#fix_footer li:not(:nth-last-child(-n+2)) {
		margin-bottom: 15px;
	}
	/*#gl_footer {
		padding-bottom: 200px;
	}*/
}
@media (max-width: 767px) {
	#fix_footer li {
		width: 100%;
	}
	#fix_footer li:not(:last-child) {
		margin-bottom: 10px;
	}
	#fix_footer li>a {
		border-radius: 4px;
	}
	/* #gl_footer {
		padding-bottom: 300px;
	} */
}

@media (min-width: 768px) {
	#fix_footer .sp_button {
		display: none;
	}
}
@media (max-width: 767px) {
	#fix_footer {
		padding: 0;
		box-shadow: 0px -3px 5px 0px rgba(0, 0, 0, 0.1);
	}
	#fix_footer>ul {
		margin: 15px;
		height: 282px;
		width: calc(100% - 30px);
		transition: all 400ms 0s ease;
		transform: translateY(0);
	}

	#fix_footer>ul.officesignage {
		height: 330px;
	}

	#fix_footer>ul.contents {
		height: 300px;
	}

	#fix_footer>.sp_button.closed+ul {
		transition: all 400ms 0s ease;
		transform: translateY(100%);
		height: 0;
		padding: 0;
		margin: 0 15px;
		overflow: hidden;
	}
	#fix_footer>.sp_button {
		background-color: #ff6112;
		padding: 15px;
		position: relative;
		text-align: center;
		line-height: 1;
		color: #fff;
	}
	#fix_footer>.sp_button::before {
		content: "";
		display: block;
		width: 8px;
		height: 8px;
		border: solid #fff;
		border-width: 2px 2px 0 0;
		position: absolute;
		right: 20px;
		top: calc(50% - 5.83px);
		transform: rotate(135deg);
	}
	#fix_footer>.sp_button.closed::before {
		transform: rotate(-45deg);
		top: calc(50% - 0.83px);
	}
}

#customer ul.button {
    margin-top: 0;
}
@media (max-width: 767px) {
    #customer ul.button {
        margin-top: 10px;
        margin-bottom: 10px;
    }
}








/*#boxer .boxer-content .boxer-iframe {
  width: 640px;
  height: 360px;
}*/
#boxer .boxer-content .boxer-iframe video {
width: 640px;
height: 360px;
}
#boxer .boxer-content {
height: 100%;
}
.boxer:hover img {
	opacity: .7;
}
.rotate90 video {
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-o-transform: rotate(90deg);
-ms-transform: rotate(90deg);
}
.rotate90 .inline_content {
position: relative;
}
.rotate90 video {
position: absolute;
    width: 640px !important;
    left: -140px;
    top: 140px;
}


@media (max-width: 767px) {

}

/* ===== セミナー */
UL.event {
  border-top: 1px solid #c9c9c9;
}
UL.event LI {
  border-bottom: 1px solid #c9c9c9;
  padding:8px 0;
}
UL.event DT {
  width:8em;
  color:#333;
  font-size:14px;
  text-decoration:none;
  margin-top:1px;
  float:left;
}
UL.event DD {
  padding-left:8em;
}
UL.event .lb_ico {
  width:6em;
  text-decoration:none;
  text-align:center;
  vertical-align:top;
  margin:0 0 0 8px;
  float:right;
}

@media (max-width:640px) {
}

#gl_header .hd_ut ul.btn li.download_bg.bgy a {
    background: #f6ab00;
}

@media (max-width: 640px){
	.clm3 .clm{
		width: 100%;
	}
}

/* #solution_block */

.bg_f3f {
    background-color: #f3f3f3 !important;
}
#solution_block .contents {
    max-width: 1020px;
    width: 100%;
    margin: 0 auto;
    padding: 100px 0;
}
#solution_block .contents.fourth {
    padding-top: 90px;
    padding-bottom: 75px;
}
#solution_block h2:not(:last-child) {
    margin-bottom: 0;
}
#solution_block .lead_txt {
    font-size: 30px;
    font-weight: bold;
    padding-bottom: 22px;
    position: relative;
}
#solution_block .third .lead_txt,
#solution_block .fourth .lead_txt {
    font-size: 40px;
    line-height: 50px;
    padding-bottom: 26px;
}
#solution_block .clm_small {
    max-width: 640px;
    width: 100%;
    margin: auto;
}
#solution_block .text_area_txt {
    line-height: 28px;
}
#solution_block .clm {
    position: relative;
    padding: 30px 20px;
    width: 100%;
    float: left;
}
#solution_block .clm4.solution_box .clm {
    width: 25%;
    box-sizing: border-box;
    float: left;
    padding: 8px;
}
#solution_block .clm3:after,
#solution_block .clm4:after,
#solution_block .contents:after,
#solution_block .contents:after,
#solution_block .clm_small:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
#solution_block .image_mn .dtl {
    padding: 16px 24px 16px 16px;
    background: url(/-/Media/Ricoh/Common/cmn_v1/img/icon_s_right_01.png) 100% 50% no-repeat #ffffff;
}
#solution_block .image_mn .dtl .ttl {
    font-size: 16px;
    font-weight: bold;
}
#solution_block .button {
    display: inline-block;
    margin: 0;
    padding: 20px 16px 23px;
    border: none;
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.2;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    max-width: 650px;
    width: 100%;
    box-shadow: 0 12px 10px -10px rgb(0 0 0 / 40%);
}
#solution_block .button.cnv_05 {
    background-color: #ff6112;
    color: #fff;
}
#solution_block .button:link {
    text-decoration: none;
}

#solution_block .fs26 {
    font-size: 26px !important;
}
#solution_block .icon {
    display: inline-block;
    background-repeat: no-repeat;
    padding: 4px 0 4px 60px;
    background-position: -8px center;
}
#solution_block .section .icon,
#solution_block footer .icon {
    padding-left: 45px;
}
#solution_block .cnv_01 .icon.newwindow,
#solution_block .cnv_05 .icon.newwindow {
    background-image: url(/-/Media/Ricoh/Common/cmn_v1/img/icon_m_newwindow_02.png) !important;
}
@media (max-width: 640px) {
  #solution_block .contents.third,
  #solution_block .contents.fourth,
  #solution_block .contents.faq {
      padding-top: 30px;
      padding-bottom: 40px;
  }
  #solution_block .clm4.solution_box .clm {
      width: 100%;
  }
  #solution_block .fourth .lead_txt {
      line-height: 24px;
      padding-bottom: 15px;
      font-size: 20px;
      margin-bottom: 0;
  }
  #solution_block .text_area_txt {
      line-height: 26px;
      font-size: 14px;
  }
  #solution_block .icon {
      padding: 4px 0 4px 47px;
      background-position: 0 center;
  }
  #solution_block .icon.newwindow {
      background-size: auto !important;
  }
  #solution_block .rsp_fs20 {
      font-size: 20px !important;
  }
  #solution_block .rsp_pb0 {
    padding-bottom: 0 !important;
  }
  #solution_block .pt0 {
    padding-top: 0 !important;
  }
}