.content { max-width: inherit; }
.index_btn_area { margin: 0; padding: 80px 120px; max-width: 980px; }
.index_btn_area p { font-weight: bold; }

.function { margin-top: 110px; }
.function .btn-list { width: 100%; display: inline-block; text-align: center; }
.function .btn-list li { display: inline-block; }
.function .btn-list li a {
	display: block;
	width: 105px;
	margin: 0 14px;
	padding: 9px 25px 7px;
	font-weight: bold;
	text-align: center;
	color: #00d7ff;/* update ike 160620 #4D9FEB */
	border: 3px solid #00d7ff; /* add oda 160615 */
	border-radius: 20px;
	background: #fff; }
.function .btn-list li a:hover, .function .btn-list li a.selected { background: #00d7ff; color: #fff; text-decoration: none; }/* update ike 160620 #439BF1 */
.function h3 { text-align: center; margin: 80px 0 40px; }
.function h3.computing img { width: 48px; padding-right: 10px; }
.function .function-list { letter-spacing: -.40em; margin-right: -1%; }
.function .function-list li { display: inline-block; letter-spacing: normal; width: 19%; margin: 0 1% 1% 0; text-align: center; position: relative; }
.function .function-list li .img { text-align: center; margin: 25px 0 3px; }
.function .function-list li .img img { width: 52px; height: 52px; opacity: 1 !important; }
.function .function-list li .img span { display: table-cell; vertical-align: middle; width: 1%; font-size: 87.5%; height: 44px; font-weight: bold; line-height: 1.3; } /* ike update padding-top: 24px */
.function .function-list li .text { display: none; text-align: left; position: absolute; bottom: 0; left: 0; background-color: #fff; height: 100%; padding: 0 13px; margin: 0; font-size: 12px; }
.function .function-list li .text span.title { display: block; font-weight: bold; text-align: center; padding: 9px 0 5px; font-size: 14px; line-height: 1.4; } /* 1019 ike class-name-updaste .function .function-list li .text span */
.function .function-list li .text span.tc_red { font-size: 14px; color: #f00000 !important; } /* 1019 add ike  */
.function .function-list li a { color: #333; }
.function .function-list li a:hover { text-decoration: none; }

.construction { border-top: #EEEEEE 1px solid; }

.links { background: rgba(77, 159, 235, 0.13); padding: 50px 0 40px; margin-top: 40px; margin-top: 0px!important; } /* 0801 ike update background: #F4F4F4 margin-top: 80px; */
.links li { display: inline-block; padding-right: 15px; }

.present { text-align: center; font-size: 18px; }
.present span.bg_y { background: #FED500; color: #333; padding: 3px 7px; vertical-align: middle; font-size: 14px; font-weight: bold; }

@media screen and (max-width: 739px) {
.content { width: 100%; }
.content h2 { margin: 40px 0; }
.index_btn_area { padding: 40px 10px 40px 0; }

.function { margin-top: 40px; }
.function h3 { margin: 40px 0 20px; }
.function .function-list li { width: 23%; /* 0801 ike update width: 49%; */ }
.function .function-list li .img span { 
padding-top: 10px; 
font-weight: normal; } /* 0801 ike add */
.function .function-list li.hover { background: #fff; }

.links { padding: 20px 0 10px; margin-top: 40px; }
.links li { display: inline-block; width: 49%; padding-right: 0; }

.content p.sbutton_cv { margin: 40px auto 10px; }
.present { width: 90%; margin: 0 auto; max-width: 290px; }
.present span.bg_y { font-size: 12px; }
.present span.auto_br { font-size: 14px; }

.view-pc { display: none; }
.view-sp { display: inline; }

}

@media screen and (max-width: 600px) {
	.function .btn-list li { margin: 0 3px; }
.function .btn-list li a { margin: 0; width: 85px; /* 90px; del oda 160627 */ }
.links li { display: block; width: auto; }
}
@media screen and (max-width: 350px) {
.present { width: 280px; }
}


/* ------ 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: #439BF1;
	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;
	}
}

/*----- 連携サービスリンク -----*/
	.pservice a{
		color: #00A3D8!important;
	}

	.pservice a:hover{
		text-decoration: underline!important;
	}

	.pservice span:hover{
		text-decoration: underline!important;
	}

@media screen and (max-width: 390px) {
	.pservice{
		left: 0px!important;
	}
}