@charset "UTF-8";
/* ===================================================================
CSS information

 file name  : homepage.css
 author     : Ability Consultant
 style info : トップページ
=================================================================== */
/* -----------------------------------------------------------
	楽天サイトバー調整（各デザインごとに要調整）
----------------------------------------------------------- */
#htlSide-A {
	top: 1020px;
}

/* -----------------------------------------------------------
	.mainimg
----------------------------------------------------------- */
.mainimg {
	margin-left: -8px;
	margin-top: -8px;
}

.con_mainslide {
	position: relative;
	height: 590px;
}
.con_mainslide #obj_slider2 {
	margin-bottom: 0 !important;
}
.con_mainslide #obj_slider2 > div {
	display: none;
}
.con_mainslide #obj_slider2 > div:first-child {
	display: block;
}

.con_mainslide #obj_slider2 .slick-dots {
	bottom: 10px;
}
.con_mainslide #obj_slider2 .slick-dots li.slick-active button:before {
	background: url(../images/header/ic_thu_act.png) no-repeat center center;
}
.con_mainslide #obj_slider2 .slick-dots li button:before {
	content: '';
	opacity: 1;
	background: url(../images/header/ic_thu.png) no-repeat center center;
}



/* 全体 */
#r_wrapper{
  max-width: 1190px;
  margin:0 auto;
  position: relative;
  height:590px;
  width: 1190px;
}

#photo1,#photo2,#photo3,#photo4{
	position: absolute;
	height:590px;
	width: 1190px;
}

#photo1 img,#photo2 img,#photo3 img,#photo4 img{
	opacity:0;
	-moz-animation: imgTrans 24s infinite;
	-webkit-animation: imgTrans 24s infinite;
	animation: imgTrans 24s infinite;
}
#photo1 img {
	-moz-animation-delay: 0s;
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}
#photo2 img {
	-moz-animation-delay: 6s;
	-webkit-animation-delay: 6s;
	animation-delay: 6s;
}
#photo3 img {
	-moz-animation-delay: 12s;
	-webkit-animation-delay: 12s;
	animation-delay: 12s;
}
#photo4 img{
	-moz-animation-delay: 18s;
	-webkit-animation-delay: 18s;
	animation-delay: 18s;
}
#frame {
	height:590px;
	width: 1190px;
	position: relative;
	overflow: hidden;
}
@-webkit-keyframes imgTrans {
 0% { opacity:0; }
 3% { opacity:1; }
 20% { opacity:1; }
 25% { opacity:1; } 
 30% { opacity:0; } 
 100% { opacity:0; }
}
@-moz-keyframes imgTrans {
 0% { opacity:0; }
 3% { opacity:1; }
 20% { opacity:1; }
 25% { opacity:1; } 
  30% { opacity:0; } 
 100% { opacity:0; }
}
@keyframes imgTrans {
 0% { opacity:0; }
 3% { opacity:1; }
 20% { opacity:1; }
 25% { opacity:1; } 
  30% { opacity:0; } 
 100% { opacity:0; }
}



/* -----------------------------------------------------------
	.con_sp
----------------------------------------------------------- */
.con_sp ol {
	margin-top: -60px;
}
.con_sp ol li {
	margin-top: 60px;
}
.con_sp ol li .det {
	position: relative;
}
.con_sp ol li .det .btn {
	position: absolute;
}
.con_sp ol li .plan {
	text-align: center;
}
.con_sp ol li.sp1 .det .btn {
	left: 40px;
	bottom: 60px;
}
.con_sp ol li.sp2 .det .btn {
	right: 0;
	bottom: 30px;
}
.con_sp ol li.sp3 .det .btn {
	left: 0;
	width: 100%;
	bottom: 20px;
	text-align: center;
}
.con_sp ol li.sp4 .det .btn {
	right: 0;
	bottom: 30px;
}
.con_sp ol li.sp5 .det .btn {
	right: 0;
	bottom: 50px;
}
.con_sp ol li.sp5 .det .btn a:after {
	right: 20px;
	-moz-transition: right 0.5s;
	-o-transition: right 0.5s;
	-webkit-transition: right 0.5s;
	transition: right 0.5s;
}
.con_sp ol li.sp5 .det .btn a:hover:after {
	right: 10px;
}