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

.logo > img {
	width: 100px;
}

/* SECTION01 */
.main_sub_title {
	color: #7e7e7e;
}
#SECTION01 {
	padding: 0 0 60px;
}
#SECTION01 .main_fastly {
	background: #eee;
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding: 30px 50px;
}
#SECTION01 .main_fastly div:first-child figure {
	width: 108px;
}
#SECTION01 .main_fastly div:last-child a {
	width: 400px;
	display: block;
}
#SECTION01 .main_fastly p {
	margin: 10px;
}
#SECTION01 .main_lead figure {
	flex: none;
	margin-right: 20px;
}
/*#SECTION01 .leftBox{
	width: 46%;
	max-width: 445px;
}
#SECTION01 .rightBox{
	width: 50%;
	max-width: 480px;
}
#SECTION01 .rightBox p{
	text-align:left;
}*/
@media screen and (max-width: 1039px) {
	#SECTION01 .main_fastly {
		display: block;
		padding: 30px 0px;
	}
	.main_fastly figure,
	.main_fastly a {
		margin: 0 auto;
	}
	.main_fastly a {
		max-width: 300px;
	}
	#SECTION01 .main_lead {
		display: block;
	}
	#SECTION01 .main_lead figure {
		margin: 0 auto 20px;
		text-align: center;
	}
}
@media screen and (max-width: 740px) {
	#SECTION01 .leftBox{
		width: 96%;
		max-width: none;
		float: none;
		margin: 5% auto 0;
		text-align: center;
	}
	#SECTION01 .rightBox{
		width: 96%;
		max-width: none;
		float: none;
		margin: 0 auto;
	}
}

/* SECTION02 */

#SECTION02{
	background: #E6FFE5;
	padding: 100px 0;
}
#SECTION02 h2{
}

#SECTION02 table {
}
#SECTION02 table th {
	background: #515252;
	text-align: center;
	border-bottom: 1px solid #BFBFBF;
}
#SECTION02 table th a {
	color: #FFF;
	text-decoration: underline;
}
#SECTION02 table th a:hover {
	text-decoration: none;
}
#SECTION02 table th:first-child {
	background: #E5E5E5;
}
#SECTION02 table th:nth-of-type(2) {
	padding: 1em 0 1.2em;
	border-top: 8px solid #18AB01;
	border-bottom: 1px solid #18AB01;
	border-right: 8px solid #18AB01;
	border-left: 8px solid #18AB01;
	background: #18AB01;
	color: #fff;
	width: 36%;
	font-size: 20px;
	font-size: 2.0rem;
}
#SECTION02 table td {
	background: #FFF;
	padding: 1em 0.7em;
	text-align: center;
	border: 1px solid #BFBFBF;
	border-right: none;
	border-left: none;
}
#SECTION02 table td:nth-of-type(1) {
	background: #E5E5E5;
}
#SECTION02 table td:nth-of-type(2) {
	border-left: 8px solid #18AB01;
	border-right: 8px solid #18AB01;
}
#SECTION02 table tr:last-child td:nth-of-type(2) {
	border-bottom: 8px solid #18AB01;
}

@media screen and (max-width: 740px) {
	#SECTION02{
		padding: 40px 0 30px;
	}
	#SECTION02 table {
		margin: 0;
	}
	#SECTION02 table th {
	}
	#SECTION02 table td {
		text-align: left;
	}
	#SECTION02 table td:first-child {
		text-align: center;
	}
	#SECTION02 table th:nth-of-type(2) {
		width: auto;
		text-align: center;
	}
}

/* SECTION03 */

#SECTION03{
	background: #18AB01;
	padding: 70px 0 50px;
	color: #fff;
}
#SECTION03 h2{
	color: #FFF;
	margin-top: -120px !important;
	padding-top: 120px !important;
}
#SECTION03 h3 {
	text-align: center;
	font-size: 20px;
	font-size: 2.0rem;
}
#SECTION03 .col_btn {
	margin-top: 30px;
}
#SECTION03 p.sbutton_cv a {
	color: #FFF;
	box-shadow: 0 0 0 5px #FFF inset;
}
#SECTION03 p.sbutton_cv a:hover {
	background: #FFF;
	color: #4D9FEB;
}
#SECTION03 .img {
	vertical-align: middle;
	height: 180px;
	padding-top: 40px;
	box-sizing: border-box;
}

#SECTION03 .heightLine-list01, #SECTION03 .heightLine-list02 {
	background: #FFF;
	display: block;
	overflow: hidden;
	text-align: center;
	padding: 0 20px;
	padding-bottom: 2000px !important;
	margin-bottom: -2000px !important;
	box-sizing: border-box;
	font-size: 14px;
	font-size: 1.4rem;
}
#SECTION03 .heightLine-list02 {
	margin-top: 20px;
}
#SECTION03 p.sbutton_white_cv a:hover,
#SECTION03 p.sbutton_cv a:hover{
	color: #333;
}

@media screen and (max-width: 740px) {
	#SECTION03 {
		padding: 40px 0 30px;
	}
	#SECTION03 .layout-unit  {
		margin-bottom: 15px !important;
		padding-bottom:15px !important;
	}	
	#SECTION03 .heightLine-list02 {
		margin-top: 0;
	}
	#SECTION03 .col_btn {
		margin-top: 0;
	}
}
	
/* SECTION04 */

#SECTION04{
	background: #EEE;
	padding: 70px 0 50px;
}
#SECTION04 h2{
	margin-top: -120px !important;
	padding-top: 120px !important;
}
#SECTION04 h4 {
	color: #fff;
	font-size: 2.3rem;
	text-align: center;
	margin-top: 0px;
	padding: 14px;
	position: absolute; 
	top: -20px; 
	left: 35px;
	width: 90%;
}

ul.scene li {
	background: url(/sevice_shared/img/cloud/gcp/storage/icn_check.png) no-repeat 0 2px;
	padding-left: 24px;
	margin-bottom: 5px;
}
ul.point li {
	background: url(/sevice_shared/img/cloud/rdb/rdb_icn_point.png) no-repeat 0 2px;
	padding-left: 24px;
	margin-bottom: 5px;
}
.color {
	background-color: #18AB01;
}
#SECTION04 h5 {
	color: #4d9feb;
	font-size: 2.0rem;
	text-align: left;
	font-weight: bold;
	margin-bottom: 5px;
}
.h5_point {
	color: #fabc06!important;
}
.ua {
	position: relative;
}
.ua_2 {
	padding: 60px 20px 25px;
}
#SECTION04 figure {
	border: 3px solid #ccc;
}

@media screen and (max-width: 979px){
	#SECTION04 h4 {
		position: static;
		font-size: 2.0rem;
		width: 100%; 
		padding: 14px 0;
	}
	.ua_2 {
		padding: 0px 20px 25px;
	}
	#SECTION04 h5 {
		margin-top: 15px;
	}
}

@media screen and (max-width: 740px) {
	#SECTION04{
		padding: 40px 0 30px;
	}
}

/* SECTION05 */

#SECTION05{
	padding: 70px 0 50px;
}
#SECTION05 h2{
	margin-top: -120px !important;
	padding-top: 120px !important;
}

#SECTION05 table {
	margin-top: -30px;
}
#SECTION05 table thead th{
	background-color: #18AB01;
	text-align: center;
	color: #FFF;
	font-size:18px;
	font-size: 1.8rem;
}
#SECTION05 table thead th.gray {
	background-color: #EEE;
	color: inherit;
	font-size: 14px;
	font-size: 1.4rem;
}
#SECTION05 table th ,
#SECTION05 table td {
	padding: 10px;
}
#SECTION05 table th {
	text-align: center;
}
#SECTION05 .scroll:nth-of-type(2) table th:first-of-type + td {
	border-right: 1px solid #DDD;
}

#SECTION05 .price {
	border-top: 2px solid #ccc;
	padding-top: 60px;
}
#SECTION05  .price h2 {
	margin-top: -120px !important;
	padding-top: 120px !important;
}
#SECTION05 .price table {
	margin:0;
}

#SECTION05 .price ul.link {
	float: right;
}


@media screen and (max-width: 740px) {
	#SECTION05{
		padding: 40px 0 30px 0;
	}
	#SECTION05 .price {
		padding-top:40px;
	}
	#SECTION05  .price h2 {
		margin-top: -80px !important;
		padding-top: 80px !important;
	}
	#SECTION05 table {
		margin-top:0;
	}
	#SECTION05 .function dl dt{
		width: 100%;
		max-width: none;
		float: none;
		border-bottom: none;
		padding: 15px 10px 0 10px;
	}
	#SECTION05 .function dl dd{
		width: 100%;
		max-width: none;
		float: none;
		padding: 0px 10px 15px 10px;
	}
}

@media screen and (max-width: 600px) {
	#SECTION05 .price .scroll {
		width: 100%;
		overflow-x: scroll;
		overflow-y: hidden;
	}
	#SECTION05 .price .scroll table {
		width: 600px;	
	}
	.scroll::-webkit-scrollbar{height:10px;}/*バーの太さ*/
	.scroll::-webkit-scrollbar-track{background:#DDD;}/*バーの背景色*/
	.scroll::-webkit-scrollbar-thumb{background:#AAA;}/*バーの色*/
}

/* SECTION06 */

#SECTION06{
	padding: 80px 0;
	background: #F4F4F4;
}
#SECTION06 .inner .Box{
	width: 27%;
	max-width: 260px;
	padding: 4% 2% 2% 2%;
	float: left;
	text-align: center;
	background: #fff;
}
#SECTION06 .inner .Box a{
	color: #00A3D8;
}
#SECTION06 .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%;
}
#SECTION06 .inner .Box p.image02{
	padding: 0 0 21px 0;
}
#SECTION06 .inner .Box p.image03{
	padding: 0 0 15px 0;
}
#SECTION06 .inner .Box p.name{
	margin: 30px 0 0 0;
	font-weight: bold;
}
#SECTION06 .inner .Box p a.arrow{
	background: url(/img/cloud/ico_arrow002.png) no-repeat left 50%;
	font-weight: bold;
	font-size: 1.6rem;
	padding: 0 0 0 15px;
}

@media screen and (max-width: 740px) {
	#SECTION06{
		padding: 40px 0;
	}
	#SECTION06 .inner .Box{
		width: auto;
		max-width: none;
		padding: 40px 20px 20px 20px;
		float: none;
		text-align: center;
		background: #fff;
	}
	#SECTION06 .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%;
	}
}