@charset "utf-8";
/* CSS Document */
/* html{font-size: 10px;} ike del */

/* clearfix */

.clearfix:before,
.clearfix:after {
	content: "";
	display: block;
	overflow: hidden;
}

.clearfix:after {
	clear: both;
	overflow: hidden;
}

/* For IE 6/7 (trigger hasLayout) */

.clearfix {
	zoom: 1;
	overflow: hidden;
}

/* ------ layout --------------------------------- */
.layout-4col { width: 23%; }
#product .layout-5col { width: 19%; } /* ike 1214 update */
#product .layout-unit { margin-left: 1%!important;}	/* ike 1214 update */

.table{
	display: table;
}
.table-fixed{
	table-layout: fixed;
}
.table-full{
	width: 100%;
}
.table-cell{
	display: table-cell;
}

/*@media screen and (max-width: 1110px) {　del oda 160623
	.content{
		width: 96%;
	}
}*/

/* ------  160616 koma add--------------------------------- */

@media screen and (max-width: 850px){.main_h1{font-size:4rem!important;}}

@media screen and (max-width: 739px){.main_h1{font-size:2.9rem!important; line-height:1.3;}}p.mt40_main {
    margin: 40px;
}
@media screen and (max-width: 1037px) {
	p.mt40_main {
	    margin: 0px;
	}
}

@media screen and (max-width: 850px){
	p.mt40_main {
	    margin: 35px !important;
	}
}

/* ------ h3 --------------------------------- */
@media screen and (max-width: 879px) {	/* 0809 ike add */
	.content h3 {
		font-size: 20px;
		font-size: 2.08rem;
	}
}
@media screen and (max-width: 739px) {
	.content h3,
	.g_content h3,
	.content_center h3,
	.g_content_wrapper h3 {
		font-size: 18px;
		font-size: 1.8rem;
		font-weight: bold;
/*		text-align: center;	0809 ike del */
	}
}

/* ------ color --------------------------------- */

.content p.buttonBlack{
	margin: 35px auto;
	width: 100%;
	max-width: 260px;
}
.content p.buttonBlack a{
	padding: 15px 0;
	text-align: center;
	display: block;
	width: 100%;
	font-weight: bold;
	font-size: 1.8rem;
}

.content p.buttonWhite{
	margin: 0 auto;
	width: 100%;
	max-width: 260px;
	color: #fff;
}
.content p.buttonWhite a{
	padding: 15px 0;
	text-align: center;
	display: block;
	width: 100%;
	font-weight: bold;
	font-size: 1.8rem;
}

/* white */
.color-white{
	color: #fff;
}
.content p.button a.color-white{
	color: #fff;
	border-color: #fff;
}
.content p.button a.color-white:hover{
	border-color: #fff;
	background: #fff;
	color: #4D9FEB;
}

/* black */
.color-black{
	color: #333;
}
.content p.button a.color-black{
	color: #333;
	border-color: #333;
}
.content p.button a.color-black:hover{
	border-color: #333;
	background: #333;
	color: #fff;
}


/* ------ arrow --------------------------------- */
.content .arrow{
	position: relative;
	padding-left: 1.3rem;
}
.content .arrow:after{
	content: '';
	border-right: 2px solid #fff;
	border-top: 2px solid #fff;
	margin: -5px 0 0 0;
	width: 5px;
	height: 5px;
	left: 0;
	position: absolute;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	top: 50%;
}

/* ------ arrow-beginner   160613 koma add --------------------------------- */
.content .arrow-beginner{
	position: relative;
	padding-left: 1.3rem;
}

.content .arrow-beginner:after{
	content: '';
	border-right: 2px solid #000;
	border-top: 2px solid #000;
	margin: -5px 0 0 0;
	width: 5px;
	height: 5px;
	left: 0;
	position: absolute;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	top: 50%;
}
	
/* ------ .header-fixed --------------------------------- */
#sb-site header .header-fixed{
	padding-top: 0;
}

@media screen and (max-width: 979px) {
	#sb-site header .header-fixed{
		padding-top: 0;
	}
}

@media screen and (max-width: 739px) {
	#sb-site header .header-fixed{
		padding-top: 0;
	}
}

/* ------ carousel --------------------------------- */
.content-carousel{
	overflow: visible;
}

/* Arrows */
.content-carousel .slick-prev,
.content-carousel .slick-next{
	position: absolute;
	display: block;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	color: transparent;
	background-color: transparent;
	border-color: transparent;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	border-width: 4px;
	border-style: solid;
	border-color: #fff;
	top: 40%;/*50%*/
	width: 20px;
	height: 20px;
	margin: -10px 0 0 0;
}
.content-carousel .slick-prev:hover,
.content-carousel .slick-prev:focus,
.content-carousel .slick-next:hover,
.content-carousel .slick-next:focus
{
	color: transparent;
	outline: none;background: transparent;
}
.content-carousel .slick-prev{
	left: -52px;
	border-right-width: 0;
	border-top-width: 0;
}
.content-carousel .slick-next{
	right: -52px;
	border-left-width: 0;
	border-bottom-width: 0;
}

/* Dots */
.slick-dots
{
	display: none! important;/*block*/
	width: 100%;
	padding: 0;
	list-style: none;
	text-align: center;
}
.slick-dots li
{
	position: relative;
	display: inline-block;
	margin: 0 5px;
	padding: 0;
}
.slick-dots li button{
	display: inline-block;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	color: transparent;
	padding: 0;
	border: 0;
	width: 10px;
	height: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background-color: #ccc;
}
.slick-dots li.slick-active button{
	background-color: #333;
}


@media screen and (max-width: 739px) {
	
	.content-carousel{
		overflow: hidden;
	}

}

/* ------ carousel-banner --------------------------------- */
.content-carousel .carousel-banner{
	max-width: 100%;
	height: auto;
}
.content-carousel .carousel-banner li a{
	display: block;
}
.content-carousel .carousel-banner li img{
	margin-left: auto;
	margin-right: auto;
}
@media screen and (max-width: 739px) {
	.content-carousel .carousel-banner{
		padding-left: 30px;
		padding-right: 30px;
	}
	.content-carousel .carousel-banner .slick-prev{
		left: 5px;
	}
	.content-carousel .carousel-banner .slick-next{
		right: 5px;
	}
}

/* ------ block-starter-plan --------------------------------- */
.block-starter-plan a{
	display: block;
}
.block-starter-plan a:hover{
	filter:alpha(opacity=65);
	-moz-opacity:0.65;
	-khtml-opacity:0.65;
	opacity:0.65;
}
.block-starter-plan a:hover img{
	opacity: 1;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100);
	filter: alpha(opacity = 100);
}
.block-starter-plan p{
	margin: 0;
}

@media screen and (max-width: 739px) {
	.block-starter-plan p img{
		max-width: 260px;
	}
}

/* ------ block-reason --------------------------------- */
.block-reason{

}
.block-reason p{
	font-size: 1.6rem;
}

.block-reason .background-image{
	background-position: center 0;
	background-repeat: no-repeat;
	padding-top: 110px;
}

.block-reason .background-reason01{
	background-image: url(/sevice_shared/img/cloud/top/reason01.png);
}

.block-reason .background-reason02{
	background-image: url(/sevice_shared/img/cloud/top/reason02.png);
}

.block-reason .background-reason03{
	background-image: url(/sevice_shared/img/cloud/top/reason03.png);
}

.block-reason .background-reason04{
	background-image: url(/sevice_shared/img/cloud/top/reason04.png);
}

@media screen and (max-width: 739px) {
	
	.block-reason .background-image{
		display: block;
		width: auto;
		padding-top: 75px;
	}
	
	.block-reason h3{
		margin-top: 30px !important;
		margin-bottom: 30px !important;
		line-height: 1;
	}
	
	.block-reason p{
		font-size: 1.4rem;
		margin-bottom: 30px;
		line-height: 1.8;
	}
}


/* ------ block-scene --------------------------------- */
.block-scene{
	background-position: center 0;
	background-repeat: repeat;
	background-image: url(/sevice_shared/img/cloud/top/background_scene.png);
	padding-bottom: 50px;
	overflow: hidden;
	background-size: cover;
}
.block-scene .content,
.block-scene .content .layout-frame{
	overflow: visible;
}
.block-scene h2{
	color: #fff;
}
.block-scene p{
	margin-bottom: .8rem;
}

/* default */  /* update oda 160623 */
.block-scene p a{
	position: relative;
	display: block;
	color: #fff;
	text-align: center;
	line-height: 63px;
	font-size: 1.4rem;
	z-index: 0; }
.block-scene p a:before{
	content: ' ';
	position: absolute;
	top: 1px;
	left: 1px;
	width: 100%;
	height: 63px; }
.block-scene p a:after{
	content: ' ';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 63px;
	border: solid 1px #3C87D6;
	border-top: 0;
	border-left: 0;
	background-color: #fff;
	z-index: -1;
	opacity: 0.13;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 13);
	filter: alpha(opacity = 13); }
.block-scene p a:hover{
	text-decoration: none; }
.block-scene p a:hover:after{
	opacity: 0.30;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 30);
	filter: alpha(opacity = 30); }

/* link-type-2 */  /* update oda 160623 */
.block-scene .link-type-2 p a{
	padding: 58px 0 0 0;
	color: #333; }
.block-scene .link-type-2 p a{
	line-height: 3; }
.block-scene .link-type-2 p a:before{
	height: 100px;
	background-position: center 14px;
	background-size: 52px 40px;
	background-repeat: no-repeat; }
.block-scene .link-type-2 p a:after{
	height: 100px;
	opacity: 0.8;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 80);
	filter: alpha(opacity = 80); }
.block-scene .link-type-2 p a:hover:after{
	opacity: 1.0;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100);
	filter: alpha(opacity = 100); }

/* link-type-3 */  /* update oda 160623 */
.block-scene .link-type-3 p a{
	line-height: 3;
	color: #333;
	padding: 58px 0 0 0; }
.block-scene .link-type-3 p a:before{
	height: 100px;
	background-position: center 14px;
	background-size: 52px 40px;
	background-repeat: no-repeat;
	opacity: 0.80;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 80);
	filter: alpha(opacity = 80); }
.block-scene .link-type-3 p a:after{
	height: 100px;
	opacity: 0.8;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 80);
	filter: alpha(opacity = 80); }
.block-scene .link-type-3 p a:hover:after{
	opacity: 1.0;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100);
	filter: alpha(opacity = 100); }

/* link */
.block-scene .links{
	clear: both;
}
.block-scene .links li{
	display: inline-block;
	margin-left: 4rem;
}
.block-scene .links li a{
	color: #fff;
	display: inline-block;
	font-size: 1.4rem;
}

/*.block-scene .buttonBlack{
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}*/
.block-scene .buttonBlack a{
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	line-height: 28.8px;
	padding: 15px 0 !important;
}
.block-scene .buttonBlack a:before,
.block-scene .buttonBlack a:after{
	width: 0;
	height: 0;
}

@media screen and (max-width: 979px) {
	
	.block-scene p a{
		font-size: 1.2rem;
		font-size: 12px;
	}
	
	.block-scene .link-type-2 p a:before,
	.block-scene .link-type-2 p a:after,
	.block-scene .link-type-3 p a:before,
	.block-scene .link-type-3 p a:after{
		height: 92px;
	}
	
}


@media screen and (max-width: 739px) {
	
	.block-scene p{
		margin-bottom: 2px;
	}
	
	#product .block-scene .layout-5col{
		width: 48%;
		display: block;
		float: left;
		margin-left: 2%;
		margin-bottom: 0;
	}

	.block-scene p a,
	.block-scene .link-type-2 p a,
	.block-scene .link-type-3 p a{
		font-size: 1.3rem;
		font-size: 13px;
		line-height: 40px;
		color: #fff;
		background-image: none;
		padding: 0;
	}

	.block-scene p a:before,
	.block-scene .link-type-2 p a:before,
	.block-scene .link-type-3 p a:before{
		content: ' ';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 40px;
		background-image: none;
	}
	
	.block-scene p a:after,
	.block-scene .link-type-2 p a:after,
	.block-scene .link-type-3 p a:after{
		content: ' ';
		position: absolute;
		top: 1px;
		left: 1px;
		width: 100%;
		height: 40px;
		border: solid 1px #3C87D6;
		border-top: 0;
		border-left: 0;
		background-color: #fff;
		z-index: -1;
		opacity: 0.13;
		-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 13);
		filter: alpha(opacity = 13);
	}
	
	
	.block-scene .link-type-2 p a:hover:after,
	.block-scene .link-type-3 p a:hover:after{
		opacity: 0.30;
		-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 30);
		filter: alpha(opacity = 30);
	}
	
	.block-scene .links li{
		width: 100%;
		text-align: right;
		margin-left: 0;
	}

}

/* ------ block-been-selected --------------------------------- */
.block-been-selected p{
	font-size: 1.8rem;
}

@media screen and (max-width: 739px) {
	
	.block-been-selected p{
		font-size: 1.4rem;
	}
	
	.block-been-selected p img{
		max-width: 90%;
		height: auto;
	}
}


/* ------ carousel-user --------------------------------- */
.content-carousel .carousel-user{
	max-width: 100%;
	height: auto;
	padding-left: 30px;
	padding-right: 30px;
}
.content-carousel .carousel-user .slick-slide{
	padding-left: 5rem;
	padding-right: 5rem;
}
.content-carousel .carousel-user .slick-slide p{
}
.content-carousel .carousel-user .slick-slide .user img{
	display: inline-block;
	margin-right: 1rem;
}
.content-carousel .carousel-user .slick-slide .user a{
	margin-right: .5rem;
}
.content-carousel .carousel-user .slick-prev,
.content-carousel .carousel-user .slick-next{
	border-width: 7px;
	border-color: #333;
	top: 4rem;
	margin-top: 0;
}
.content-carousel .carousel-user .slick-prev{
	left: 0;
	border-right-width: 0;
	border-top-width: 0;
}
.content-carousel .carousel-user .slick-next{
	right: 0;
	border-left-width: 0;
	border-bottom-width: 0;
}

@media screen and (max-width: 1110px) {
	.content-carousel .carousel-user .slick-prev{
		left: 10px;
	}
	.content-carousel .carousel-user .slick-next{
		right: 10px;
	}
}

@media screen and (max-width: 739px) {
	.content-carousel .carousel-user{
		padding-left: 0;
		padding-right: 0;
	}
	.content-carousel .carousel-user .slick-slide{
		padding-left: 4rem;
		padding-right: 4rem;
	}
	.content-carousel .carousel-user .slick-prev{
		left: 10px;
	}
	.content-carousel .carousel-user .slick-next{
		right: 10px;
	}
}

/* ------ block-box-link-4col --------------------------------- */
.block-box-link-4col{
	padding-top: 0;
	padding-bottom: 0;
}
.block-box-link-4col p{
	margin-bottom: 0;
	display: table;
}
.block-box-link-4col a{
	position: relative;
	color: #fff;
	display: table-cell;
	width: 25%;
	text-align: center;
}
.block-box-link-4col a:first-child:before,
.block-box-link-4col a:after{
	content: '';
	position: absolute;
	top:10%;
	right: 0;
	bottom: 10%;
	border-left: 1px #69AEF3 solid;
}
.block-box-link-4col a:first-child:before{
	right: auto;
	left: 0;
}
.block-box-link-4col a:hover{
	background-color: #237DF2;
	text-decoration: none;
}
.block-box-link-4col a .title{
	display: inline-block;
	margin: 54px 0 0 0;
}
.block-box-link-4col a .message{
	display: block;
	padding: 20px 10px 54px 10px;
	text-align: left;
}
.block-box-link-4col .title{
	font-size: 1.8rem;
	font-weight: bold;
}
.block-box-link-4col .message{
	font-size: 1.6rem;
}

@media screen and (max-width: 739px) {
	.block-box-link-4col p{
		margin-left: auto;
		margin-right: auto;
		display: block;
		padding-top: 1rem;
	}
	.block-box-link-4col a{
		display: block;
		width: 100%;
		text-align: left;
	}
	.block-box-link-4col a .title{
		margin-top: 10px;
		margin-left: 1rem;
	}
	.block-box-link-4col a .message{
		padding-top: 1rem;
		padding-bottom: 2rem;
	}
	.block-box-link-4col a:first-child:before,
	.block-box-link-4col a:after{
		display: none;
	}
	.block-box-link-4col .message{
		font-size: 1.4rem;
	}
}

/* ------ block-box-link-4col-beginner   160613 koma add --------------------------------- */

.beginner{
    padding: 10px 0 10px;
    }

.block-box-link-4col-beginner{
	padding-top: 0;
	padding-bottom: 0;
}
.block-box-link-4col-beginner p{
	margin-bottom: 0;
	display: table;
}
.block-box-link-4col-beginner a{
	position: relative;
	color: #333; /* #000 oda 160620 */
	display: table-cell;
	width: 25%;
	text-align: center;
}
.block-box-link-4col-beginner a:first-child:before,
.block-box-link-4col-beginner a:after{
	content: '';
	position: absolute;
	top:0%;
	right: 0;
	bottom: 0%;
	border-left: 2px #7bceff solid; /* 1px #999 solid  oda160620 */
}
.block-box-link-4col-beginner a:first-child:before{
	right: auto;
	left: 0;
}
.block-box-link-4col-beginner a:hover{
	background-color: #81CEFB;
	text-decoration: none;
}
.block-box-link-4col-beginner a .title{
	display: inline-block;
	margin-top: 20px; /* oda 160620 */
	/*margin: 54px 0 0 0;*/
}
.block-box-link-4col-beginner a .message{
	display: block;
	padding: 20px 10px 20px 10px; /* padding: 20px 10px 54px 10px; oda 160620 */
	text-align: left;
}
.block-box-link-4col-beginner .title{
	font-size: 1.8rem;
	font-weight: bold;
}
.block-box-link-4col-beginner .message{
	font-size: 1.6rem;
}

@media screen and (max-width: 739px) {
	.block-box-link-4col-beginner p{
		margin-left: auto;
		margin-right: auto;
		display: block;
		padding-top: 1rem;
	}
	.block-box-link-4col-beginner a{
		display: block;
		width: 100%;
		text-align: left;
	}
	.block-box-link-4col-beginner a .title{
		margin-top: 10px;
		margin-left: 1rem;
	}
	.block-box-link-4col-beginner a .message{
		padding-top: 1rem;
		padding-bottom: 2rem;
	}
	.block-box-link-4col-beginner a:first-child:before,
	.block-box-link-4col-beginner a:after{
		display: none;
	}
	.block-box-link-4col-beginner .message{
		font-size: 1.4rem;
	}
}

/* ------ block-news-list --------------------------------- */
.block-news-list{
}
.block-news-list ul{
	padding: 0 40px;
}
.block-news-list li{
	margin: 20px 0; 
	font-size: 1.4rem;
	font-size: 14px;
}
.block-news-list li:first-child{
	margin-top: 0;
}
.block-news-list li:last-child{
	margin-bottom: 0;
}
.block-news-list .date{
	color: #888;
}
.block-news-list .text-icon{
	margin: 0 1rem;
}

@media screen and (max-width: 739px) {
	
	.block-news-list ul{
		padding: 0;
	}

}


/* ------ carousel-news --------------------------------- */
.content-carousel .carousel-news{
	max-width: 100%;
	height: auto;
	padding-left: 30px;
	padding-right: 30px;
}

.content-carousel .carousel-news .slick-slide{
	padding-left: 1rem;
	padding-right: 1rem;
	display: table-cell;
	float: none;
}
.content-carousel .carousel-news .slick-slide .box{
	position: relative;
	height: 100%;
	margin: 0;
	padding: 0;
	font-size: 1.4rem;
	font-size: 14px;
	display: block;
	color: #333;
	line-height: 1.5;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.content-carousel .carousel-news .slick-slide .box:hover{
	background-color: #f7f7f7;
	text-decoration: none;
}
.content-carousel .carousel-news .slick-slide .box .text-icon{
	position: absolute;
	top: 0;
	left: 19px;
}
.content-carousel .carousel-news .slick-slide .box .date{
	color: #888;
	display: block;
	padding: 35px 20px 0 20px;
}
.content-carousel .carousel-news .slick-slide .box .message{
	padding: 0 20px 10px 20px;
	display: block;
}
.content-carousel .carousel-news .slick-slide .box:hover .message{
	text-decoration: underline;
}
.content-carousel .carousel-news .slick-slide .box .text-icon{
	margin-left: 0;
}
.content-carousel .carousel-news .slick-prev,
.content-carousel .carousel-news .slick-next{
	border-width: 7px;
	border-color: #333;
	top: 50%;
	margin-top: -10px;
}
.content-carousel .carousel-news .slick-prev{
	left: 10px;
	border-right-width: 0;
	border-top-width: 0;
}
.content-carousel .carousel-news .slick-next{
	right: 10px;
	border-left-width: 0;
	border-bottom-width: 0;
}

@media screen and (max-width: 979px) {
	.content-carousel .carousel-news .slick-prev{
		left: 10px;
	}
	.content-carousel .carousel-news .slick-next{
		right: 10px;
	}
}

@media screen and (max-width: 739px) {
	.content-carousel .carousel-news .slick-prev{
		left: 10px;
	}
	.content-carousel .carousel-news .slick-next{
		right: 10px;
	}
}





/* ------ carousel --------------------------------- */
.content-carousel{
	overflow: visible;
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
}
.carousel-banner .mosaic-block{
	border: 0;
	width: 100%;
	max-width: 301px;
	height: 160px;
	float: none;
	background: none;
	margin: 0 auto;
	padding: 0;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.carousel-banner-wrap { visibility: hidden; }
.carousel-banner li.slick-active:nth-of-type(1) .mosaic-block{
	margin-left: 0;
}
.carousel-banner li.slick-active:nth-of-type(2) .mosaic-block{
	
}
.carousel-banner .mosaic-block .mosaic-backdrop{
	background: none;
}
.carousel-banner .mosaic-block .mosaic-overlay{
	color: #fff;
	text-align: center;
	background: none;
}
.carousel-banner .mosaic-block img{
	opacity: 1;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100);
	filter: alpha(opacity = 100);
}
.carousel-banner .mosaic-block .mosaic-overlay{
}
.carousel-banner .mosaic-block .mosaic-overlay:hover{
	text-decoration: none;
}
.carousel-banner .mosaic-block .mosaic-overlay span{
	position: relative;
	top: 160px;
	display: block;
	width: 300px;
	height: 160px;
	margin: 0 auto;
	display: table-cell;
	vertical-align: middle;
	font-size: 1.6rem;
	font-size: 16px;
	text-align: center;
}
.carousel-banner .mosaic-block .mosaic-overlay span:before{
	content: '';
	background-color: #000;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 160px;
	z-index: -1;
	opacity: 0.8;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 80);
	filter: alpha(opacity = 80);
}
.slick-dots li button{
	background-color: #fff;
	width: 15px;
	height: 15px;
}
.slick-dots li.slick-active button{
	background-color: transparent;
}

@media screen and (max-width: 1110px) {
	.carousel-banner-wrap{
		margin-left: 80px;
		margin-right: 80px;
		width: auto;
	}
	.carousel-banner .mosaic-block{
		max-width: 90%;
		height: auto;
	}
}
@media screen and (max-width: 739px) {
	.carousel-banner-wrap{
		margin-top: 50px;
		margin-left: 0;
		margin-right: 0;
		width: auto;
	}
	
	.carousel-banner .mosaic-block{
		max-width: 230px;
		height: 123px;
	}
	.block-top .carousel-banner li.slick-active:nth-of-type(1) .mosaic-block,
	.block-top .carousel-banner li.slick-active:nth-of-type(2) .mosaic-block,
	.block-top .carousel-banner li.slick-active:nth-of-type(3) .mosaic-block{
		margin-left: auto;
		margin-right: auto;
	}
}




/* ------ carousel --------------------------------- */
.content-carousel{
	overflow: visible;
}

/* Arrows */
.content-carousel .slick-prev,
.content-carousel .slick-next{
	position: absolute;
	display: block;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	color: transparent;
	background-color: transparent;
	border-color: transparent;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	border-width: 4px;
	border-style: solid;
	border-color: #ffffff;
	top: 50%;
	width: 20px;
	height: 20px;
	margin: -10px 0 0 0;
}
.content-carousel .slick-prev:hover,
.content-carousel .slick-prev:focus,
.content-carousel .slick-next:hover,
.content-carousel .slick-next:focus
{
	color: transparent;
	outline: none;background: transparent;
}
.content-carousel .slick-prev{
	left: -52px;
	border-right-width: 0;
	border-top-width: 0;
}
.content-carousel .slick-next{
	right: -52px;
	border-left-width: 0;
	border-bottom-width: 0;
}

/* Dots */
.slick-dots
{
	display: block;
	width: 100%;
	padding: 0;
	list-style: none;
	text-align: center;
}
.slick-dots li
{
	position: relative;
	display: inline-block;
	margin: 0 5px;
	padding: 0;
}
.slick-dots li button{
	display: inline-block;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	color: transparent;
	padding: 0;
	border: 0;
	width: 10px;
	height: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background-color: #ccc;
}
.slick-dots li.slick-active button{
	background-color: #333;
}

@media screen and (max-width: 739px) {
	.content-carousel{
		overflow: hidden;
	}
}

/* ------ carousel-banner --------------------------------- */
.content-carousel .carousel-banner{
	max-width: 100%;
	height: auto;
}
.content-carousel .carousel-banner li a{
	display: block;
}
.content-carousel .carousel-banner li img{
	margin-left: auto;
	margin-right: auto;
}
@media screen and (max-width: 739px) {
	.content-carousel .carousel-banner{
		padding-left: 30px;
		padding-right: 30px;
	}
	.content-carousel .carousel-banner .slick-prev{
		left: 5px;
	}
	.content-carousel .carousel-banner .slick-next{
		right: 5px;
	}
}




/* ------ carousel --------------------------------- */
.content-carousel{
	overflow: visible;
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
}
.carousel-banner .mosaic-block{
	border: 0;
	width: 100%;
	max-width: 301px;
	height: 160px;
	float: none;
	background: none;
	margin: 0 auto;
	padding: 0;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}
.carousel-banner-wrap { visibility: hidden; }
.carousel-banner li.slick-active:nth-of-type(1) .mosaic-block{
	margin-left: 0;
}
.carousel-banner li.slick-active:nth-of-type(2) .mosaic-block{
	
}
.carousel-banner .mosaic-block .mosaic-backdrop{
	background: none;
}
.carousel-banner .mosaic-block .mosaic-overlay{
	color: #fff;
	text-align: center;
	background: none;
}
.carousel-banner .mosaic-block img{
	opacity: 1;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 100);
	filter: alpha(opacity = 100);
}
.carousel-banner .mosaic-block .mosaic-overlay{
}
.carousel-banner .mosaic-block .mosaic-overlay:hover{
	text-decoration: none;
}
.carousel-banner .mosaic-block .mosaic-overlay span{
	position: relative;
	top: 160px;
	display: block;
	width: 300px;
	height: 160px;
	margin: 0 auto;
	display: table-cell;
	vertical-align: middle;
	font-size: 1.6rem;
	font-size: 16px;
	text-align: center;
}
.carousel-banner .mosaic-block .mosaic-overlay span:before{
	content: '';
	background-color: #000;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 160px;
	z-index: -1;
	opacity: 0.8;
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity = 80);
	filter: alpha(opacity = 80);
}
.slick-dots li button{
	background-color: #fff;
	width: 15px;
	height: 15px;
}
.slick-dots li.slick-active button{
	background-color: transparent;
}

@media screen and (max-width: 1110px) {
	.carousel-banner-wrap{
		margin-left: 80px;
		margin-right: 80px;
		width: auto;
	}
	.carousel-banner .mosaic-block{
		max-width: 90%;
		height: auto;
	}
}
@media screen and (max-width: 739px) {
	.carousel-banner-wrap{
		margin-top: 0px; /* ike 1109 50px */
		margin-left: 0;
		margin-right: 0;
		width: auto;
	}
	
	.carousel-banner .mosaic-block{
		max-width: 230px;
		height: 123px;
	}
	.block-top .carousel-banner li.slick-active:nth-of-type(1) .mosaic-block,
	.block-top .carousel-banner li.slick-active:nth-of-type(2) .mosaic-block,
	.block-top .carousel-banner li.slick-active:nth-of-type(3) .mosaic-block{
		margin-left: auto;
		margin-right: auto;
	}
}

/* ------ carousel --------------------------------- */
.content-carousel{
	overflow: visible;
}

/* Arrows */
.content-carousel .slick-prev,
.content-carousel .slick-next{
	position: absolute;
	display: block;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	color: transparent;
	background-color: transparent;
	border-color: transparent;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	border-width: 4px;
	border-style: solid;
	border-color: #ffffff;
	top: 50%;
	width: 20px;
	height: 20px;
	margin: -10px 0 0 0;
}
.content-carousel .slick-prev:hover,
.content-carousel .slick-prev:focus,
.content-carousel .slick-next:hover,
.content-carousel .slick-next:focus
{
	color: transparent;
	outline: none;background: transparent;
}
.content-carousel .slick-prev{
	left: -52px;
	border-right-width: 0;
	border-top-width: 0;
}
.content-carousel .slick-next{
	right: -52px;
	border-left-width: 0;
	border-bottom-width: 0;
}

/* Dots */
.slick-dots
{
	display: block;
	width: 100%;
	padding: 0;
	list-style: none;
	text-align: center;
}
.slick-dots li
{
	position: relative;
	display: inline-block;
	margin: 0 5px;
	padding: 0;
}
.slick-dots li button{
	display: inline-block;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	color: transparent;
	padding: 0;
	border: 0;
	width: 10px;
	height: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	background-color: #ccc;
}
.slick-dots li.slick-active button{
	background-color: #333;
}

@media screen and (max-width: 739px) {
	.content-carousel{
		overflow: hidden;
	}
}

/* ------ carousel-banner --------------------------------- */
.content-carousel .carousel-banner{
	max-width: 100%;
	height: auto;
}
.content-carousel .carousel-banner li a{
	display: block;
}
.content-carousel .carousel-banner li img{
	margin-left: auto;
	margin-right: auto;
}
@media screen and (max-width: 739px) {
	.content-carousel .carousel-banner{
		padding-left: 30px;
		padding-right: 30px;
	}
	.content-carousel .carousel-banner .slick-prev{
		left: 5px;
	}
	.content-carousel .carousel-banner .slick-next{
		right: 5px;
	}
}

/* ------ price.css 20151127 Fe --------------------------------- */

.content_center { position: relative; }

.plan { margin: 50px 0 0; }/* 30px 0 0   160616 koma add*/
.plan .col_03 { padding: 0 0 20px; } /* 0 0 50px */
.plan .col_03:after{display:block;content:"";clear:both;overflow:hidden;}/* 2015/09/29 h9 */
.plan .col_03.col_03_flex .col_block { float:left;margin: 0 0.51%; padding: 26px 0; width: 32.3%; }/* 2015/09/29 h9 */
.plan .col_03.col_03_flex .col_block:first-child { padding: 0; }
.plan .col_03.col_03_flex .col_block .inner { border-top: #2F95FA 5px solid; background: #FFF; padding: 40px 0 5px; }
.plan .col_03.col_03_flex .col_block.first .inner { border-top: #00C7F2 10px solid; border-right: #00C7F2 2px solid; border-bottom: #00C7F2 2px solid; border-left: #00C7F2 2px solid; }
.plan .price { text-align: center; font-size: 220%; line-height: 1; padding-bottom: 25px; font-weight: bold; margin: 0; }
.plan .first .price { font-size: 320%; padding-bottom: 30px; }
.plan .price span { font-size: 60%; }
.plan .feature { background: #2F95FA; border-radius: 100px; padding: 5px; border-bottom: #EEEEEE 1px solid; color: #FFF; width: 70%; margin: 0 auto 30px; text-align: center; }
.plan .first .feature { background: #00C7F2; width: 66%; font-weight: bold; }
.plan .detail { border-top: #EEEEEE 1px solid; padding: 15px 0 13px; font-size: 14px; height: auto; }
.plan .detail li { padding: 0 0 7px 1em; text-indent: -1em; margin: 0 10px; }
.plan .detail li:last-child { padding-bottom: 0; }
.plan .detail li span { color: #2692FD; }
.plan .first .detail li span { color: #FF7366; }
.plan ul.spec { font-size: 120%; border-top: #EEEEEE 1px solid; }
.plan ul.spec span { font-size: 80%; font-weight: normal; color: #999999; }
.plan .first  ul.spec { font-size: 140%; }
.plan ul.spec li { padding: 8px 0 8px;; text-align: center; border-bottom: #EEEEEE 1px solid; } /* 0801 ike update	font-weight: bold; padding: 10px 0 8px	*/
.plan ul.spec li.kind { text-align: center; color: #2692FD; font-weight: bold; } /* 0801 ike update */
.plan .first ul.spec li { padding: 10px 0; } /* 0801 ike update padding: 16px 0 15px; */
.plan .first ul.spec li.kind { color: #00C7F2; padding: 13px 0 7px; }

.plan .col_block .link { margin: 0 0 0 10px; }
.plan .col_block .link li { display: inline-block; margin: 23px 0 22px 20px; }

.view-pc { display: inline; }
.view-sp { display: none; }
.slide-pc { display: inline-block; }
.slide-sp { display: none; }

@media screen and (max-width: 739px) {
	.view-pc { display: none; }
	.view-sp { display: inline; }
	.plan { padding: 40px 0; }
	.plan .price { padding: 10px 0 19px !important; }
	.plan .first .price { padding: 0 0 10px !important; }
	.plan .col_03 { padding: 30px 0 0; }
	.plan .col_03.col_03_flex .col_block { width: auto; margin: 0 16px; padding: 0; }
	.plan .col_03.col_03_flex .col_block .inner { padding: 15px 0 5px }
	.plan .feature { font-size: 105%; margin: 0 auto 18px; padding: 7px 15px; }
	.plan .select { width: 180px; }
	.plan ul.spec li { display: inline-block; width: 24.333333333%; line-height: 1; font-size: 16px; padding: 15px 0 14px !important; } /* 0801 ike update	 width: 33.333333333%; */
	.plan ul.spec li.kind { display: block; width: 100%; font-size: 20px; }
	.plan .first ul.spec li.kind { font-size: 24px; padding: 13px 0 12px !important; }
	.plan ul.spec li:nth-child(6) { width: 100%; } /* 0801 ike update */
	/* .plan ul.spec li:nth-child(5), .plan ul.spec li:nth-child(6) { width: 50%; } */  /* 0801 ike update */
	.plan .detail { padding-bottom: 18px; }
	.plan .detail li { font-size: 90%; }
	.plan .col_block .list_ul { font-size: 16px; }
	.plan .col_block .list_item_link { padding: 9px 0 12px 20px; }
	.plan .col_block .list_ul .list_item_link > a:before { top: 12px; }
	
	/* Arrows */
	.plan .slick-prev,
	.plan .slick-next{
		position: absolute;
		display: block;
		font-size: 0;
		line-height: 0;
		cursor: pointer;
		color: transparent;
		background-color: transparent;
		border-color: transparent;
		transform: rotate(45deg);
		-webkit-transform: rotate(45deg);
		border-width: 4px;
		border-style: solid;
		border-color: #63ACF3;
		top: 50%;
		width: 20px;
		height: 20px;
		margin: -12px 0 0 0;
	}
	.plan .slick-prev:hover,
	.plan .slick-prev:focus,
	.plan .slick-next:hover,
	.plan .slick-next:focus	{
		color: transparent;
		outline: none;background: transparent;
	}
	.plan .slick-prev{
		left: -2px;
		border-right-width: 0;
		border-top-width: 0;
	}
	.plan .slick-next{
		right: -2px;
		border-left-width: 0;
		border-bottom-width: 0;
	}	
}
@media screen and (max-width: 350px) {
	.plan .detail { font-size: 12px; }
}
.bg_blue { background: #2089EA; } /* add 201512 ike */
.bg_blue2 { background: #00C7F2; } /* add 201604 ike */
.bg_gray { background: #5D5C5C; } /* add 201604 ike */

/* ------ Service-Menu Dropdown 20151224 Fe --------------------------------- */

/* clearfix */
.block-top .clearfix:before,
.block-top .clearfix:after {
	overflow: visible;
}
/* For IE 6/7 (trigger hasLayout) */
.block-top .clearfix {
	overflow: visible;
}
/* Dropdown */
.block-top-scroll #snav li ul.snav_box01 {
	margin: 13px 0 0 -145px;
	display: none; /* 20160106 Fe */
}
.block-top-scroll #snav li ul.snav_box01::after {
	left: 187px;
}
.block-top-scroll #snav li ul.snav_box01 li {
	width: 100px;
	float: left;
	font-size: 12px;
	line-height: 1.4;
	margin: 0;
	padding: 40px 0 0;
	text-align: center;
}
.block-top-scroll #snav li ul.snav_box01 li img {
	padding: 0 0 10px;	
}
.block-top-scroll #snav li ul.snav_box01 li.snav_box01_br {
	clear: both;
	padding-left: 30px;
}
.block-top-scroll #snav li ul.snav_box01 li.snav_box01_link {
	clear: both;
	float: none;
	font-size: 14px;
	width: 100%;
}
.block-top-scroll #snav li ul.snav_box01 li.snav_box01_link a {
	background: #eee;
	border: solid 1px #eee;
	display: block;
	margin: 0;
	padding: 10px 0;
	text-align: center;
}
.block-top-scroll #snav li ul.snav_box01 li.snav_box01_link a:hover {
	background: #f5f5f5;
	border: solid 1px #f5f5f5;
}
.block-top-scroll #snav li ul.snav_box02 {
	margin: 13px 0 0 -508px;
}
.block-top-scroll #snav li ul.snav_box02::after {
	left: 532px;
}


/* 160613 koma add */
.bg_category_beginner{
	color: #000;
}

@media screen and (max-width: 739px) {
.bg_category{
	padding: 40px 0;
}
}


/* p.sbutton_500 160614 koma add */

p.sbutton a:hover{ color: #fff; }
p.sbutton_500 a{
    color: #00c7f2;
	box-shadow: 0 0 0 3px #00c7f2 inset;
}
p.sbutton_500 a:hover{
	box-shadow: 0 0 0 3px #00c7f2 inset;
	background: #00c7f2;
	color: #fff;
}

p.sbutton_500{
	margin: 30px auto;
	width: 100%;
	max-width: 250px;
}
p.sbutton_500 a {
	padding: 15px 0;
	text-align: center;
	display: block;
	width: 100%;
	font-weight: bold;
	font-size: 1.8rem;
}
p.sbutton_500 a:hover{
	text-decoration: none;
}

/* ------ block-service  160613 koma add--------------------------------- */
.block-service #new_func {
	/*width: 94%;*/ /*  oda 160623           1013 ike update 90%; 45%;  2015/09/28 h9 */
    padding: 14px; /*  1013 ike update 20px; */
	background: #7CB5EC; /* #f1f1f1; */
	/*display: block;    del oda 160623 */
	/*float: left;       del oda 160623 */ /* right */
}
.block-service #new_func_inner {
	background: #fff;
	padding: 20px;
	/*width: 91%; oda 160623 */
}
.block-service #new_func_inner dt {
  float: left;
}
.block-service #new_func_out {
	width: 32%;
}
.block-service #new_func_inner dt {
	float: left;
}
.block-service #new_func_inner dd {
	margin-left: 64px; /* 90 */
	padding-left: 20px;
	padding-bottom: 10px;
	border-left: 2px solid #f1f1f1;
    font-size: 15px; /* ike add 1621 */
    font-size: 1.5rem; /* ike add 1621 */
}
.block-service #new_func_inner dd span {
	width: 12px;
	height: 12px;
	padding-right: 20px;
	margin-left: -27px;
	background: url(/img/cloud/top/cercle_gray.png) no-repeat ;
	background-position: 0 7px;
}
.block-service #new_func_inner dd span.on_active {
	background: url(/sevice_shared/img/cloud/idcfcloud/cercle_blue.png) no-repeat !important ;
	background-position: 0 7px !important ;
}
.block-service img.ico_release {
	margin-left: 5px;
	margin-top: -3px;
}

@media screen and (max-width: 979px) {
.block-service #new_func_inner dt {
  float: none;
}
.block-service #new_func_inner  dd {
	margin-left: 15px;
	padding-left: 20px;
	padding-bottom: 10px;
	border-left: 2px solid #f1f1f1;
}
.block-service #new_func_inner dd span {
	background-position: 0 4px;
}
.block-service #new_func_inner dd span.on_active {
	background-position: 0 2px !important ;
}
.block-service #new_func_out {
	width: 31%;
}
}

@media screen and (max-width: 739px) {
.block-service #new_func {
  /*width: 94%;  del oda 160623 */
  /* margin-left: 0; */
  padding: 20px;
  background: #7CB5EC; /* #f1f1f1; */
  margin: auto;
  display: block;
}
.block-service .layout-frame .layout-unit.layout-2col-50w:last-child #new_func { /* oda 160623 */
	margin-top: 20px; }
	
.block-service #new_func_inner {
  background: #fff;
  /*padding: 5px; del oda 160623 */
  /*width: 93%; del oda 160623 */	/* 97% */
}
.block-service #new_func_out {
	width: auto;
	float: left;
}
.block-service #new_func_inner dt {
  float: none;
}
.block-service #new_func_inner  dd {
	margin-left: 15px;
	padding-left: 20px;
	padding-bottom: 10px;
	border-left: 2px solid #f1f1f1;
}
.block-service #new_func_inner dd span {
	background-position: 0 4px;
}
.block-service #new_func_inner dd span.on_active {
	background-position: 0 2px !important ;
}
}
/* 170309 ike move */
.link_right:after{display: block;content: "";clear: both;overflow: hidden;}
.link_right ul{
	margin-top:9px;
  float: right;
}
.link_right li{
  display: inline-block;
}
.link_right li:nth-child(2){margin-left:10px;}
.link_right li a{
  display: inline-block;
  text-align: center;
  color:#333;
  padding:0 18px 0 0;
  background:url(/sevice_shared/img/top/ico_arrow_02.png) right 0.05em no-repeat;
  background-size:11px 9px;
  font-size: 90%;
	line-height: 1.1;
}
.link_right li a:hover{
	color: #00A3D8;
}

@media screen and (max-width:850px){
.block-scene .image-scene-virtual-machine:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_computing08.png");
}

.block-scene .image-scene-hardware-occupied-machine:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_ssd.png");
}

.block-scene .image-scene-object-strage:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_service03.png");
}

.block-scene .image-scene-contents-cache:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_service04.png");
}

.block-scene .image-scene-dns:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_dns.png");
}

.block-scene .image-scene-gslb:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_gslb.png");
}

.block-scene .image-scene-ilb:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_ilb.png");
}

.block-scene .image-scene-private-connect:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_service06.png");
}

.block-scene .image-scene-ddos:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_service07.png");
}

.block-scene .image-scene-unauthorized-invasion:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_service08.png");
}

.block-scene .image-scene-internet:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_computing15.png");
}

.block-scene .image-scene-firewall:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_computing20.png");
}

.block-scene .image-scene-load-balancer:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_computing21.png");
}

.block-scene .image-scene-remote-access-vpn:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_computing22.png");
}

.block-scene .image-scene-volume:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_computing09.png");
}}

.block-scene .image-scene-snapshot:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_computing10.png");
}

.block-scene .image-scene-template:before {
background-image:url("//cdn.www.idcf.jp/sevice_shared/img/cloud/spec/icon_computing11.png");
}
