@charset "UTF-8";
/* CSS Document */

.bgScreenSizeMain{
	min-height: initial !important;
	min-height: auto !important;
}
.indexOffice{
	background-image: url(../images/pages/bg_officesupport.jpg);
}


@media (orientation: landscape) and (max-width: 767px) {/* 横向き対応 */
}
@media screen and (max-width: 767px) {/*スマホ対応*/
}
@media (orientation: portrait) {/* 縦向き対応 */
}
@keyframes aniname {/*アニメーション*/
0% {
}
100% {
}
}


h1.osTitle{
	text-align: center;
	margin: 100px auto 40px;
	padding: 0 0 10px;
	font-size: 30px;
	line-height: 100%;
	color: #fff;
}
.bgOScontents{
	position: relative;
	z-index: 0;
	margin: 0 auto;
	padding: 0 20px 150px;
	max-width: 1240px;
}
.osContents{
}


/*------------------------------------------------------------------------------ fulfillment.html / performance.html  _____*/
.flexcontainerOS{
	position: relative;
	z-index: 0;
	width: 100%;
	margin: 0;
	padding: 50px 0 0;
	display: flex;
	flex-wrap: wrap;
	align-content: stretch;
	text-align: left;
	border-top: 5px solid #FFFFFF;
}
.flexitemOS{
	position: relative;
	z-index: 0;
	margin: 0 10px 20px;
	padding: 0 0px 0px;
	flex-basis: calc(33.333% - 20px);
	background-color: #FFFFFF;
	border-radius: 10px;
}
@media screen and (max-width: 1023px) {
.flexitemOS{
	flex-basis: calc(50% - 20px);
}
}
@media (orientation: portrait) {/*縦*/
.flexitemOS{
}
}

@media screen and (max-width: 767px) {/*スマホ対応*/
.flexitemOS{
	margin: 0 5px 20px;
	flex-basis: calc(100% - 12px);
}
}
.flexitemInOS{/*inner*/
	margin: 0px;
	padding: 0 0 50px;
}

h2.H2os{
	text-align: center;
	margin: 20px 0;
	padding: 0;
	font-size: 30px;
	line-height: 30px;
}
h2.H2os.dm, h2.H2os.sports{color: #34AB99;}
h2.H2os.ticket, h2.H2os.arts{color: #EA535E;}
h2.H2os.office, h2.H2os.com{color: #64A9DE;}
h2.H2os.logi, h2.H2os.car{color: #F29938;}
h2.H2os.data{color: #9BC713;}
h2.H2os.invoice{color: #E46A8A;}
@media screen and (max-width: 1023px) {
h2.H2os{
	font-size: 20px;
}
}

h3.H3os{
	margin: 20px 0 0;
	padding: 15px 30px 10px 30px;
	font-size: 20px;
	line-height: 30px;
	color: #FFFFFF;
}
h3.H3os.dm, h3.H3os.sports{background-color: #34AB99;}
h3.H3os.ticket, h3.H3os.arts{background-color: #EA535E;}
h3.H3os.office, h3.H3os.com{background-color: #64A9DE;}
h3.H3os.logi, h3.H3os.car{background-color: #F29938;}
h3.H3os.data{background-color: #9BC713;}
h3.H3os.invoice{background-color: #E46A8A;}
h3.H3os.arts, h3.H3os.sports, h3.H3os.car, h3.H3os.com{
	text-align: center;
}
@media screen and (max-width: 1023px) {
h3.H3os{
	font-size: 16px;
	line-height: 24px;
}
}

p.osDescription{
	margin: 20px 10px 0 10px;
	padding: 0px 0 10px 50px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: 40px;
}
p.osDescription.dm{
	color: #34AB99;
	background-image: url(../images/pages/ico_OS_dm.png);
}
p.osDescription.ticket{
	color: #EA535E;
	background-image: url(../images/pages/ico_OS_ticket.png);
}
p.osDescription.office{
	color: #64A9DE;
	background-image: url(../images/pages/ico_OS_office.png);
}
p.osDescription.logi{
	color: #F29938;
	background-image: url(../images/pages/ico_OS_logi.png);
}
p.osDescription.data{
	color: #9BC713;
	background-image: url(../images/pages/ico_OS_data.png);
}
p.osDescription.invoice{
	color: #E46A8A;
	background-image: url(../images/pages/ico_OS_invoice.png);
}


.flexitemOS img{
	width: 100%;
}




/*------------------------------------------------------------------------------ performance.html  _____*/
div.pfmcTxt{
	width: 100%;
	margin: 0 auto 80px;
	padding: 0;
	text-align: center;
}
p.pfmcTxt{
	max-width: 750px;
	margin: 0 auto;
	padding: 0;
	font-size: 24px;
	line-height: 48px;
	color: #FFFFFF;
}

.flexitemOS.pfmc{
	flex-basis: calc(50% - 20px);
}
@media screen and (max-width: 767px) {/*スマホ対応*/
.flexitemOS.pfmc{
	margin: 0 5px 20px;
	flex-basis: calc(100% - 12px);
}
}

.fmcList{
	max-width: 90%;
	margin: 20px auto 0;
	padding: 0;
	text-align: center;
}
p.fmcList{
	display: inline-block;
	text-align: left;
	font-size: 20px;
	line-height: 200%;
}
p.fmcList.arts{color: #EA525D;}
p.fmcList.sports{color: #34AB99;}
p.fmcList.car{color: #F29938;}
p.fmcList.com{color: #64A9DE;}
@media screen and (max-width: 767px) {/*スマホ対応*/
p.fmcList{
	font-size: 16px;
}
}


form{width: 100%};
.line_gy {
    border-bottom: 1px dotted #CCCCCC;
}

/*------------------------------------------------------------------------------ button.css  _____*/

.btbl{/*ボタン：ブルー*/
	border: 1px solid #FFFFFF;
}

.btgy{/*ボタン：グレー*/
	border: 1px solid #FFFFFF;
}
