﻿.RPA_solution_list_box
{
    width:100%; 
    padding:2em 0;
}
.RPA_solution_list_box h1
{
    text-align:center;
    font-size:2em;
    margin-bottom:2em;
}
.carouselsection{
	display: flex;
	position: relative;
	width:1200px;
	margin:2em auto;
}
@media screen and (min-width:1024px){
	.carouselsection{
		flex-direction: row;
	}
}
.pagenumberlist{
	position: relative;
	z-index: 1;
	width:100%;
}
@media screen and (min-width:1024px){
	.pagenumberlist{
		flex-grow: 0;
		max-width: 33.3%;
		flex-basis: 33.3%;
		margin-top:4em;
	}
}
.pagenumberitem{
	cursor: pointer;
  padding: 1.5em;
  border-bottom: 1px solid rgba(192, 194, 197,0.3);
  border-top: 1px solid rgba(192, 194, 197,0.3);
}
.pagenumberitem:not(:first-child){
	border-top: none;
}
@media screen and (min-width:1024px){
	.pagenumberitem{
        padding: 1.5em;
	}
	.pagenumberitem:hover{
    background: rgb(236, 237, 238);
	}
	.pagenumberitem.active{
		background: #0067df;
	}
	.pagenumberitem.active:hover{
		background: #0067df;
	}
}
.pagenumberitem>p{
	color: #000;
  padding-bottom: 1.2em;
	margin: 0;
  position: relative;
  font-size:1.2em;
line-height:1.2em;
text-indent: 0;
}
@media screen and (min-width:1024px) {
	.pagenumberitem>p{
	  padding-bottom: 0;
	}
	.pagenumberitem.active>p{
	  color: #fff;
	}
}
.pagenumberitem .descul{
	display: none;
}
.pagenumberitem .lc{
	display: none;
}
@media screen and (max-width:1024px) {
	.pagenumberitem.activemobile .descul{
		display: block;
	}
	.pagenumberitem.activemobile .lc{
		display: block;
	}
}
.descul{
	display: block;
	list-style-type:none;
	color: #000;
	margin-top: 1em;
}
.descul li{
	font-size: 1em;
	line-height:2em;
	margin-bottom:1em;
	margin-left:1.2em;
}
.descul p{
	text-indent: 0;
	margin-bottom:1em;
}
.descul li:before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    background-color: #000;
    border-radius: 50%;
    margin-left:-20px;
    margin-right:10px;
}
@media screen and (min-width:1024px) {
	.pagenumberitem .descul{
		display: none;
	}
}
.pagenumberitem a.lc, .descbox a.lc{
	color: #0067df;
}
.pagenumberitem a.lc:hover, .descbox a.lc:hover{
	color: #0067df;
	text-decoration: underline;
}
.carouselbox{
	z-index: 0;
	position: absolute;
  left: 0;
  right: 0;
    background-color:#F9F9F9;
}
.semiIcon{
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 360px;
	height: 180px;
}
@media screen and (min-width:768px) {
	.semiIcon{
		right: 12px;
		left: unset;
		transform: none;
	}
}
@media screen and (min-width:1024px) {
	.carouselbox{
		position: relative;
		z-index: 1;
		padding-left: 12px;
		box-sizing: border-box;
		height: 100%;
		flex-grow: 0;
		max-width: 66.6%;
		flex-basis: 66.6%;
	}
	.semiIcon{
		top: -12px;
		width: 550px;
		height: 275px;
	}
}
@media screen and (min-width:1280px) {
	.carouselbox{
	}
	.semiIcon{
    width: 690px;
    height: 345px;
	}
}
.carouselslides{
	display: block;
	position: relative;
	z-index: 1;
	overflow: hidden;
	box-sizing: border-box;
}
@media screen and (min-width:1024px) {
	.carouselslides
	{
	    height:600px;
	}
}
@media screen and (min-width:1280px) {
	.carouselslides{
	}
}
.arrowbox{
	display:none;
}
@media screen and (min-width: 1024px){
	.arrowbox{
		display:flex;
		flex-direction: row;
		-webkit-box-align: center;
		align-items: center;
		position:relative;
		padding-top: 94px;
		margin: 0px 0px 24px 82px;
		z-index: 1;
	}
}

.solution_content div.pa, .solution_content div.na{
	z-index:5;
	display: inline-flex;
	outline:none;
	position: relative;}
/*.pa{
	left:0;}
.solution_content div.na{
	right:0;}*/

.solution_content div.pa, .solution_content div.na{
	display:block;
		width:56px;
		height:56px;
	line-height:56px;
	border-radius: 50%;
	border: 2px solid #000;
	font-size: 2em;
	background-color: #fff;
	transition: all .1s ease 0s;
	text-align:center;
	cursor:pointer;
}
.solution_content div.pa:hover, .solution_content div.na:hover{
	background: rgba(0, 0, 0, 0.2);
  transition: all .15s ease .1s;
}
@media screen and (min-width:1280px) {
	.pa, .na{
		width:56px;
		height:56px;
	}
}
.solution_content p.pagenumber{
	display: inline;
	color: #000;
	margin: 0 16px;
	font-size: 20px;
	line-height: 32px;
text-indent: 0;
}
.slick{
	width:600%;
	display: flex;
	flex-direction: row;
	position: absolute;
	margin-bottom: 24px;
	transition: transform 500ms ease 0s;
}
.slick.atpage1{
	transform: translateX(0);
}
.slick.atpage2{
	transform: translateX(-16.66%);
}
.slick.atpage3{
	transform: translateX(-33.33%);
}
.slick.atpage4{
	transform: translateX(-50%);
}
.slick.atpage5{
	transform: translateX(-66.66%);
}
.slick.atpage6{
	transform: translateX(-83.33%);
}
.descbox{
	display: block;
	float: left;
	height: 100%;
	margin-left: 82px;
	width: 100%;
	padding-right: 82px;
	box-sizing: content-box;
	opacity: 0;
	transition: opacity 240ms cubic-bezier(0.4, 0.14, 0.3, 1) 75ms;
	line-height:2em;
}
.descbox.active{
	opacity: 1;
	transition: opacity 240ms cubic-bezier(0.4, 0.14, 0.3, 1) 245ms;
}
.descbox>h3{
	font-size: 1.5em;
	line-height: 1.3em;
	margin: 0 0 12px;
	color: #000;
	text-align:left;
}
@media screen and (min-width:1280px) {
	.descbox>h3{
		font-size: 1.8em;
	}
}

.robot{
    display: block;
    position: absolute;
    bottom: -64px;
    right: 0px;
    width: 222px;
    height: 248px;
}