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

.bg_blue01{
	padding-top: 5pc;
	padding-bottom: 5pc;
}
.heading{
	height: 260px;
	text-align: center;
	background: url(/sevice_shared/img/cloud/connect/bg_main.png)no-repeat right 0;
	margin-bottom: 40px;
}
.heading p{
	padding: 40px 0 10px;
}
.heading p img {
	width: 100px;
}
.heading h1{
	font-size: 40px;
	font-size: 4rem;
	color: #333;
	margin: 0 5%;
}
#Connect{
	padding: 20px 0;
}
#Connect .inner .Box{
	width: 27%;
	max-width: 260px;
	padding: 4% 2% 2%;
	float: left;
	text-align: center;
	background: #fff;
}
#SConnect .inner .Box a{
	color: #00a3d8;
}
#Connect .inner .arrowBox{
	width: 3.5%;
	height: 260px;
	float: left;
	background-image: url(/img/cloud/ico_arrow003.png);
	background-repeat: no-repeat;
	background-position: center 50%;
}
#Connect .inner .Box {
	min-height: 208px;
}
#Connect .inner .Box p.image02{
	padding: 0 0 21px;
}
#Connect .inner .Box p.image03{
	padding: 0 0 15px;
}
#Connect .inner .Box p.name{
	margin: 30px 0 0;
	font-weight: 700;
}
#Connect .inner .Box p a.arrow{
	background: url(/img/cloud/ico_arrow002.png)no-repeat left 50%;
	font-weight: 700;
	font-size: 1.6rem;
	padding: 0 0 0 15px;
}

/* 740px以下での表示 */
@media screen and (max-width:739px){
.heading h1{
	font-size: 22px;
	font-size: 2.2rem;
}
.bg_blue01{
	padding-top: 40px;
	padding-bottom: 40px;
}
#Connect{
	padding: 40px 0;
}
#Connect .inner .Box{
	width: auto;
	max-width: none;
	padding: 40px 20px 20px;
	float: none;
	text-align: center;
	background: #fff;
}
#Connect .inner .arrowBox{
	width: 100%;
	padding: 3% 0;
	float: none;
	height: auto;
	background-image: url(/img/cloud/ico_arrow004.png);
	background-repeat: no-repeat;
	background-position: center 50%
}
#connect_pattern div div {
	display: block;
}
}