@charset "UTF-8";

@import "/datarecovery/include/css/import.sp.css";

@import "voice.sp.css";



/* ---------------------------------------------------------

	CSS Document bg

--------------------------------------------------------- */



#bg {

	background: url(../top/bg_01.png) fixed top;

}



/* ---------------------------------------------------------

	CSS Document main_slick

--------------------------------------------------------- */



#main_slick .slider {

	white-space: nowrap;

}



#main_slick .slide {

	display: inline-block;

	vertical-align: top;

}



#main_slick .article {

	position: relative;

	z-index: 0;

}



#main_slick .slick-dots {

	margin-top: 10px;

	font-size: 0;

}



#main_slick .slick-dots button {

	width: 100%;

	height: 100%;

	background: none;

	font-size: 0;

}



#main_slick .slick-dots li {

	display: inline-block;

	vertical-align: top;

	width: 8px;

	height: 8px;

	margin: 0 5px;

	border-radius: 100%;

	background: #ccc;

}



#main_slick .slick-dots li.slick-active {

	background: #333;

}



/* ---------------------------------------------------------

	CSS Document top > reason

--------------------------------------------------------- */



#reason {

	padding: 40px 20px;

}



#reason h2 {

	margin-bottom: 20px;

	font-weight: normal;

	font-size: 34px;

	line-height: 1.2;

}



#reason ul {

	margin-bottom: 20px;

}



#reason li {

	display: inline-block;

	vertical-align: top;

	width: 45%;

	font-size: 12px;

	line-height: 18px;

	color: #777;

	position: relative;

}



#reason li:nth-child(odd) {

	margin-right: 4%;

}



#reason li:before {

	content: '';

	display: block;

	height: 70px;

	margin-bottom: 10px;

	border-bottom: solid 1px #c3c3c3;

}



#reason li:nth-child(1):before {

	background: url(../top/reason_01.png) no-repeat center;

}



#reason li:nth-child(2):before {

	background: url(../top/reason_02.png) no-repeat center;

}



#reason li:nth-child(3):before {

	background: url(../top/reason_03.png) no-repeat center;

}



#reason li:nth-child(4):before {

	background: url(../top/reason_04.png) no-repeat center;

}



#reason li:nth-child(5):before {

	background: url(../top/reason_05.png) no-repeat center;

}



#reason li:nth-child(6):before {

	background: url(../top/reason_06.png) no-repeat center;

}



#reason li:nth-child(7):before {

	background: url(../top/reason_07.png) no-repeat center;

}



#reason li:nth-child(7) {

	margin-right: 0;

}



#reason .btn a {

	width: 90%;

	height: 37px;

	overflow: hidden;

	margin: 0 auto;

	border-radius: 30px;

	-webkit-border-radius: 30px;

	-moz-border-radius: 30px;

	background: #1e4580;

	line-height: 35px;

}



#reason .btn a:before {

	content: url(../top/reason_arrow.png);

	display: inline-block;

	vertical-align: 0;

	margin-right: 5px;

}



#reason .btn a:after {

	display: none;

}



/* ---------------------------------------------------------

	CSS Document top > flow

--------------------------------------------------------- */



#flow {

	padding: 15px 10px;

}



#flow h2 {

	margin-bottom: 10px;

	font-weight: normal;

	font-size: 34px;

	line-height: 1.2;

}



#flow li {

	display: inline-block;

	vertical-align: top;

	width: 115px;

	height: 125px;

	padding-top: 28px;

	background-size: 115px ! important;

	color: #fff;

	position: relative;

}



#flow li span {

	display: block;

	font-weight: bold;

	font-size: 17px;

}



#flow li:nth-child(1) {

	background: url(../top/flow_01.png) no-repeat 0 0;

}



#flow li:nth-child(2) {

	background: url(../top/flow_02.png) no-repeat 0 0;

}



#flow li:nth-child(3) {

	background: url(../top/flow_03.png) no-repeat 0 0;

}



#flow li:nth-child(4) {

	background: url(../top/flow_04.png) no-repeat 0 0;

}



#flow li:nth-child(5) {

	background: url(../top/flow_05.png) no-repeat 0 0;

}



#flow li:nth-child(5):after {

	display: none;

}



/* ---------------------------------------------------------

	CSS Document top > service

--------------------------------------------------------- */



#service {

	margin-top: -30px;

	padding: 50px 10px 10px;

	background: url(../top/bg_03.png) no-repeat center top;

	background-size: auto 100%;

	color: #fff;

}



#service h2 {

	margin-bottom: 20px;

	font-weight: 700;

	font-size: 6vw;

	line-height: 1;

}



#service h2 span {

	color: #d52233;

}



#service ul {

	display: inline-block;

}



#service li {

	height: 80px;

	margin-bottom: 20px;

	padding-top: 5px;

	padding-left: 90px;

	background: url(../top/service_01.png) no-repeat left top;

	vertical-align: top;

	text-align: left;

}



#service li:nth-child(1) span ,

#service li:nth-child(2) span {

	display: block;

	font-size: 18px;

}



#service li:nth-child(1) a {

	display: block;

	text-decoration: none;

	font-size: 28px;

	line-height: 1;

	color: #fff;

}



#service li:nth-child(2) {

	background: url(../top/service_02.png) no-repeat left top;

}



#service li:nth-child(3) {

	background: url(../top/service_03.png) no-repeat left top;

}



#service li:nth-child(3) a {

	display: block;

	text-decoration: none;

	font-size: 18px;

	color: #fff;

}



#service li:nth-child(3):hover {

	opacity: 0.8;

	filter: Alpha(opacity=80);

}



/* ---------------------------------------------------------

	CSS Document footer

--------------------------------------------------------- */



#footer {

	margin-top: 0;

}