@charset "utf-8";
/* CSS Document */

/*******************

PC ability

********************/


.ability__txt{
	text-align:center;
	margin:200px 0 100px;
}
.ability__txt img{
	margin:0 auto 1em;
}
.ability{
	position:relative;
	display: block;
}
#ability1{
	background:url(img/ability01_img.png) 0 150px no-repeat;
	padding-left:350px;
	position: relative;
	display: block;
   margin-top:-100px;
   padding-top:100px;
   z-index:1;
   left: 0;
   top: 0;
}
#ability2{
	background:url(img/ability02_img.png) 100% 150px no-repeat;
	padding-right:480px;
	position: relative;
	display: block;
   margin-top:-130px;
   padding-top:130px;
   z-index:5;
   left: 0;
   top:1em;
}
#ability3{
	background:url(img/ability03_img.png) 0 150px no-repeat;
	padding-left:350px;
	position: relative;
	display: block;
   margin-top:-130px;
   padding-top:130px;
   z-index:2;
   left: 0;
   top:3em;
}

.ability__menu{
	width:1100px;
	margin:0 auto;
	display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  gap:3%;
  margin-bottom:200px;
	}

.ability .comment--box{
  margin-bottom:60px;
}

.ability .comment--txt{
  margin:0 30px;
}
.ability .comment--txt .no img{
	margin-bottom:20px;
}
.ability .comment--txt .name{
	font-size:1.4em;
	margin-bottom:1em;
	color:#5e952d;
	font-weight:500;
	padding-left:50px;
}
.ability .comment--txt p{
	margin-top:15px;
	margin-bottom:30px;
	padding-left:50px;
}
.ability .comment--txt .btn{
	margin-left:50px;
}

.ability__menu .btn__gr2 {
  box-sizing: border-box;
  border-radius: 3em;
  color: #fff;
  display: block;
  font-size: 1.2em;
  line-height: 1em;
  font-weight: 600;
  overflow: hidden;
  padding: 1em;
  position: relative;
  overflow: hidden;
  z-index: 2;
  width: 89.3333%;
  margin: 1em auto;
  vertical-align: middle;
  background-color: #5e952d;
  text-align:center;
  
}
.ability__menu .btn__gr2 span {
  -webkit-background-size: auto 1em;
  background-size: auto .5em;
  box-sizing: border-box;
  display: inline-block;
  padding-right: 1.5em;
  position: relative;
  z-index: 3;
  background-image: url(../shared/img/ic_ar_sp2.png);
  background-position:100% 50%;
  background-repeat:no-repeat;
}
.ability__menu .btn__gr2 span span{
  background-image:none;
  box-sizing: border-box;
  display: inline-block;
  padding-right:.2em;
  font-size:1.6em;
  vertical-align:top;
}
.ability__menu .btn__gr2:before {
  content: "";
  width: 300%;
  height: 0%;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transform: rotate(45deg) translate3d(50%,0,0) scale3d(1,1,1);
  -ms-transform: rotate(45deg) translate3d(50%,0,0) scale3d(1,1,1);
  -o-transform: rotate(45deg) translate3d(50%,0,0) scale3d(1,1,1);
  transform: rotate(45deg) translate3d(50%,0,0) scale3d(1,1,1);
  -webkit-transform-origin: top right;
  -moz-transform-origin: top right;
  -ms-transform-origin: top right;
  -o-transform-origin: top right;
  transform-origin: top right;
  z-index: 1;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
  background-color: #154d8f;
}
.ability__menu .btn__gr2:hover:before {
  content: "";
  height: 500%;
}


/* about */

.column--box{
	border:25px solid #f3f3f3;
	background-color:#fff;
	padding:40px;
	text-align:center;
	margin-bottom:60px;
}
.column--box p{
	text-align:left;
	margin-bottom:15px;
}
.column--logo{
	width:364px;
	margin:0 auto;
	vertical-align:baseline;
		}
.column--box .ttl{
	font-size:30px;
	font-weight:600;
	color:#5e952d;
	margin-bottom:10px;
	}
.column--box .bn{
	display: inline-block;
}


/* system */

.system__img{
	background:url(system/img/img_system_01.jpg) 100% 0 no-repeat;
	min-height:610px;
	margin-bottom:30px;
	}
.system__img .comment--txt{
	width:550px;
}

.infra{
	margin-top:200px;
	}
.infra .contents__ttl2{
	padding-left:200px;
}
.infra .comment--box{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap:nowrap;
  -ms-align-items: flex-start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: center;
  margin-bottom:60px;
  align-items: flex-start;
  margin-top:20px;
  margin-left:120px;
}

.infra .comment--txt{
  margin:10px 0 0 30px;
  padding-top:30px;
}
.infra .comment--txt .name{
	font-size:1.2em;
	margin-bottom:1em;
	color:#000;
	font-weight:500;
}
.system--box{
	background-color:#f3f3f3;
	padding:40px;
	margin-bottom:100px;
}
.system--box .comment--box{
	margin:0;
}
.system--box .comment--box img{
	padding-top:30px;
}

/* soft */
.soft--box{
	background-color:#f3f3f3;
	padding:40px;
	margin-bottom:100px;
}
.soft--box dl{
	background-color:#fff;
	padding:30px;
}
.soft--box dl dt{
	color:#5e952d;
	font-weight:500;
	padding-left:200px;
	font-size:1.1em;
}
.soft--box dl dd{
	padding-left:200px;
	margin-bottom:30px;
}
.soft--box dl.kouzou{
	background:url(soft/img/ttl_kouzou.png) 40px 40px no-repeat;
	background-color:#fff;
	padding:30px;
	margin-bottom:30px;
	}
.soft--box dl.isho{
	background:url(soft/img/ttl_isho.png) 40px 40px no-repeat;
	background-color:#fff;
	padding:30px;
	margin-bottom:30px;
	}
.soft--box dl.uchiwake{
	background:url(soft/img/ttl_uchiwake.png) 40px 40px no-repeat;
	background-color:#fff;
	padding:30px;
	}
.soft--box ul{
	padding-left:1.4em;
	}
.soft--box ul li{
	list-style-type:disc;
	padding-left:.3em;
	}
.soft--box dl.isho p{
	font-weight:500;
	}