/* -----------------------------------------------------------
    mainimage
-------------------------------------------------------------- */
#top .title_box .title_e{
	padding: 0;
}

#top_body{
	overflow-x: hidden;
}
#top #contents{
	position: relative;
}

#top .mv {

	width: 100%;
}

#top .mv_inner{
	width: 1100px;
	margin: auto;
	position: relative;
	height: 600px;
}

#top .mv_inner h1{
	position: absolute;
	bottom: 15px;
	right: 0;
	font-size: 1.1rem;
	color: #444;
	text-align: right;
}

#top .mv .title1{
	font-family: "Noto Sans Japanese";
	color: #000;
	font-size: 6.4rem;
	padding-top: 230px;
	font-weight: bold;
	text-align: center;
}

#top .mv .title1 span{
	font-family: 'Lato', sans-serif;
	color: #000;
	font-size: 7.4rem;
	font-weight: 900;
}
#top .mv .title2{
	font-family: 'Satisfy', cursive;
	color: #E50012;
	font-size: 3.6rem;
	position: relative;
	top:-8px;
	margin-bottom: -8px;
	margin-bottom: 45px;
	text-align: center;
}

#top .mv .btn1{
	margin: 0 auto;
	width: 300px;

	font-size: 1.6rem;
}
#top .mv .btn1 a{
	padding: 26px 0;
}



/*　左寄せ
#top .mv .title1{
	font-family: "Noto Sans Japanese";
	color: #251F1F;
	font-size: 6.0rem;
	padding-top: 235px;
	font-weight: bold;
}

#top .mv .title1 span{
	font-family: 'Lato', sans-serif;
	color: #251F1F;
	font-size: 7.0rem;
	font-weight: 900;
}
#top .mv .title2{
	font-family: 'Satisfy', cursive;
	color: #E50012;
	font-size: 3.2rem;
	position: relative;
	top:-8px;
	left: 20px;
	margin-bottom: -8px;
	margin-bottom: 65px;
}
*/



@media screen and (max-width: 667px){

	#top #contents{
		position: static;
	}

	#top .title_box .title_e{
		font-size: 2.8rem;
	}

	#top .mv {
		background:none;
		height: auto;
	}

	#top .mv_inner{
		width: 100%;
		position: relative;
		height: auto;
	}

	#top .mv_inner h1{
		position: absolute;
		top: 0;
		left:0;
		font-size: 1.0rem;
		width: 100%;
		height: 24px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		-webkit-text-overflow: ellipsis;
		-o-text-overflow: ellipsis;
		background-color: #232832;
		padding: 6px;
		text-align: left;
		color: #FFF;
	}

	#top .mv_sp{
		position: relative;

	}
	#top .mv_sp .btn1{
		position: absolute;
		left:50%;
		bottom: 50px;
		width: 200px;
		height: 50px;
		font-size: 1.5rem;
		text-align: center;
		margin-left: -100px;
	}
	#top .mv_sp .btn1 a{
		padding: 16px 0;
	}
	#top .mv_sp .mv_sp_img2{
		position: absolute;
		left:50%;
		top: 60px;
		width: 250px;
		margin-left: -125px;
		text-align: center;
	}


}

/* -----------------------------------------------------------
    お知らせ
-------------------------------------------------------------- */
#top .top_news_list li{
	line-height: 1.3;
	margin-bottom:10px;
}
#top .top_news_list li a{
	color: #FFF;
}

#top .top_news_list li:nth-child(n+4){
	display: none;
}

#top .top_news_new{
	color: #C11316;
	margin-left:10px;
}
#top .top_news_date{
	padding-right: 20px;
	font-size: 1.4rem;
	font-family: 'Lato', sans-serif;
}
#top .top_news{
	width: 100%;
	background-color: #50616D;
	padding: 25px 50px 20px;
}

#top .top_news .inner{
	color: #fff;
}

#top .top_news_tag{
	color: #fff;
	width: 80px;
	display: inline-block;
	font-size: 1.1rem;
	padding: 2px 0;
	font-weight: 500;
	margin-right: 20px;
	text-align: center;
	border: 1px solid #fff;
}

#top .top_news_txt{
	font-size: 1.5rem;
	width: 700px;
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	vertical-align: middle;
}

#top .top_news_tit{
	font-family: 'Lato', sans-serif;
	font-size: 1.8rem;
	width: 110px;
	float: left;
	letter-spacing: 2px;
	margin-top: 35px;
}

#top .top_news_con{
	width:900px;
	margin-right: 0;
	float: left;
}

#top .top_news_btn{
	float: right;
	font-size: 1.5rem;
	margin: 32px 0 0 0;
}
#top .top_news_btn a {
	display: inline-block;
	padding: 5px;
	color: #FFF;
}
#top .top_news_btn a::before {
	display: inline-block;
	margin: 0 8px 0 0;
	content: "\f105";
	font-family: FontAwesome;
	font-size: 1.6rem;
	color: #E50012;
}


@media screen and (max-width: 667px){

	#top .top_news_list li a{
		color: #333;
	}

	#top .top_news_list li:nth-child(n+2){
		display: none;
	}
	#top .top_news_date{
		padding-right: 0;
		margin-right: 15px;
		font-size: 1.3rem;
	}
	#top .top_news{
		width: 100%;
		position: static;
		background-color: #fff;
		margin-bottom: 0;
		padding: 30px 0 25px 0;
	}

	#top .top_news .inner{
		width: 100%;
		color: #333;
	}

	#top .top_news_tag{
		color: #FFF;
		background: #50616D;
		width: 70px;
		display: inline-block;
		font-size: 1.1rem;
		margin-right: 0;
		border: none;
	}

	#top .top_news_txt{
		font-size: 1.5rem;
		margin-top: 8px;
		line-height: 1.4;
		width: auto;
		display: block;
		overflow: inherit;
		text-overflow: inherit;
		white-space: inherit;
	}

	#top .top_news_tit{
		width: 100%;
		float: left;
		margin-top: 0;
	}

	#top .top_news_con{
		width:100%;
		margin-right: 0;
		float: left;
	}

	#top .top_news_btn{
		font-size: 1.4rem;
		margin: -25px 0 15px 0;
	}
	#top .top_news_btn a{
		color: #333;
	}

}

/* -----------------------------------------------------------
    about
-------------------------------------------------------------- */

#top .top_abo{
	background: url( "../images/top_about.jpg" ) center top / cover no-repeat;
	width: 100%;
	height: auto;
	color: #fff;
	padding: 70px 0 70px;
}

#top .top_abo .top_abo_tit{
	font-size: 2.8rem;
	font-weight: 400;
	/* margin-bottom: 30px; */
	line-height: 1.6;
}
#top .top_abo .top_abo_tit.sub{
	font-size: 2.2rem;
	font-weight: 600;
	margin-bottom: 15px;
}

#top .top_abo .txt{
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 2.0;

}

@media screen and (max-width: 667px){

	#top .top_abo{
		background: url( "../images/top_about_sp.jpg" ) center top / cover no-repeat;
		width: 100%;
		height: auto;
		padding: 40px 0;
	}

	#top .top_abo .top_abo_tit{
		font-size: 2.0rem;
		font-weight: 500;
		margin-bottom: 20px;
		line-height: 1.6;
	}
	#top .top_abo .top_abo_tit.sub{
		font-size: 1.8rem;
		font-weight: 500;
		margin-bottom: 15px;
	}


	#top .top_abo .txt{
		font-size: 1.5rem;
		line-height: 2.0;
	}

}

/* -----------------------------------------------------------
    タブ切り替え
-------------------------------------------------------------- */

#top .tabs #field_tab,
#top .tabs #technology_tab{
	display: none;
}
#top .tabs .tab_item_ty{
	display: none;
}
#top .tabs .tab_item_t{
	display: none;
}
@media screen and (max-width: 667px){
	/*タブ切り替え全体のスタイル*/
	.tabs {
	  margin-top: 50px;
	  padding-bottom: 10px;
	  width: 100%;
	  margin: 0 auto;
	}

	/*タブのスタイル*/
	.tab_item {
	  width: calc(100%/2);
	  height: 54px;
	  border-bottom: 4px solid #004fa1;
	  background-color: #F0F0F0;
	  line-height: 50px;
	  font-size: 1.6rem;
	  text-align: center;
	  color: #333;
	  display: block;
	  float: left;
	  font-weight: bold;
	  transition: all 0.2s ease;
	}
	.tab_item:hover {
	  opacity: 0.75;
	}
	.tabs h3{
		font-size:1.6rem;
		font-weight: 500;

	}
	#top .tabs .tab_item_ty{
		display: block;
	}
	#top .tabs .tab_item_t{
		display: block;
	}

	/*ラジオボタンを全て消す*/
	input[name="tab_item"] {
	  display: none;
	}

	/*タブ切り替えの中身のスタイル*/
	.tab_content {
	  display: none;
	  padding: 5px 0 0;
	  clear: both;
	  overflow: hidden;
	}


	/*選択されているタブのコンテンツのみを表示*/
	#field_tab:checked ~ #field_tab_content,
	#technology_tab:checked ~ #technology_tab_content {
		display: block;
	}

	/*選択されているタブのスタイルを変える*/
	.tabs input:checked + .tab_item {
	  background-color: #004fa1;
	  color: #fff;
	}

	#technology_tab_content{
	}

}

/* -----------------------------------------------------------
    ソリューション
-------------------------------------------------------------- */

/* ---- particles.js container ---- */
#particles-js{
	position:absolute;
	width: 100%;
	height: 1600px;
	background-image: url("");
	background-repeat: no-repeat;
	background-size: auto auto;
}


#top .top_sol{
/*
  background-image:
    url("../images/top_bg1.png"),
    url("../images/top_bg2.png");

  background-repeat:
    no-repeat,
	no-repeat;

  background-position:
    left top,
	right bottom;
	*/
	padding: 95px 0;
	position: relative;
}

#top .top_sol .title_box{
	/*
	width: 225px;
	*/
	float: left;
}

#top .top_sol .title_box_sub{
	float: right;
	text-align: right;
	color: #333;
	font-size: 1.8rem;
	font-weight: 400;
	padding: 20px 0 0 0;
}

#top .top_sol .cate_title{
	font-size: 2rem;
	font-weight: 500;
	color: #fff;
	padding: 20px 30px 22px 30px;
	background: url( "../images/red_title_bg.png" ) repeat left top;
}

/*fie*/
.top_sol_list{
	width:100%;
	margin: auto;
}
.top_sol_list li{
	width:260px;
	/*height: 300px;*/
	float: left;
	margin-right: 20px;
	/*
	box-shadow: rgba(204,204,204,0.6) 3px 3px 0;
	*/
	box-shadow: 2px 2px 16px #CCC;
	overflow: hidden;
}
.top_sol_list li img {
	vertical-align: bottom;
	transition-duration: 0.3s;
}
.top_sol_list li:hover img {
	opacity: 1;
	transform: scale(1.08);
	transition-duration: 0.3s;
}

.top_sol_list li a{
	display: block;
	width:260px;
	/*height: 300px;*/
}

.top_sol_list li:nth-child(4n){
	margin-right: 0;
}

/*tec*/

.top_sol_list.style2 li{
	width:354px;
	/*height: 200px;*/
	margin-right: 19px;
	margin-bottom: 19px;
}
.top_sol_list.style2 li a{
	display: block;
	width:354px;
	/*height: 200px;*/
}

.top_sol_list.style2 li:nth-child(4n){
	margin-right: 19px;
}
.top_sol_list.style2 li:nth-child(3n){
	margin-right: 0;
}




/*共通*/

#top .top_sol .title_box{
	margin-bottom:55px;
}

.top_sol_list li{
	position: relative;
}
.top_list_tit{
	font-size: 2.0rem;
	font-weight: 500;
	color: #000;
	padding: 18px;
	margin-left: 15px;
	/*position: absolute;*/
	/*bottom: 25px;*/
	background: url( "../images/icon_line.png" ) #fff left top 60% / 10px auto no-repeat;
}

#top .amazon_icon{
	width: 610px;
	position: relative;
	top: -180px;
	/*left:430px; */
	left: 480px;
	margin-bottom: -30px;
}

#top .amazon_icon_img{
	float: right;
	width: 320px;
}
#top .amazon_icon_txt{
	float: left;
	width: 290px;
	padding-top: 35px;
	line-height: 1.8;
}


@media screen and (max-width: 667px){

	#particles-js{
		height: 150px;
	}

	#top .top_sol .title_box{
		margin-bottom:0;
	}
	#top .top_sol{
		/*
	  background-image:
		url("../images/top_bg1_sp.png"),
		none;
	  background-size:
		contain;

	  background-repeat:
		no-repeat;
	  background-position:
		left top;
		*/
		padding: 40px 0 30px;
	}
	.top_sol_list li:nth-child(2n+1){
		clear: both;
	}

	#top .top_sol .title_box{
		width: 100%;
	}
	#top .top_sol .title_box_sub{
		width: 100%;
		float: none;
		text-align: left;
		padding: 20px 0 30px 0;
		clear: both;
		font-size: 1.6rem;
	}

	/*fie*/
	.top_sol_list{
		padding: 0 10px 20px 10px;
	}
	.top_sol_list li{
		width:100%;
		max-width: 400px;
		height: auto;
		float: none;
		margin-right: 0;
		box-shadow: none;
		text-align: center;
		margin: 15px auto 0;
		overflow: inherit;
	}
	.top_sol_list li img {
		width: 100%;
		max-width: 400px;
		transition-duration: 0.3s;
		box-shadow: 2px 2px 10px #CCC;
	}
	.top_sol_list li:hover img {
		transform: scale(1.00);
		transition-duration: 0.3s;
	}

	.top_sol_list li a{
		display: block;
		width:auto;
		height: auto;
	}

	.top_sol_list li:nth-child(4n){
		margin: 15px auto 0;
	}

	/*tec*/

	.top_sol_list.style2 li{
		width:100%;
		max-width: 400px;
		height: auto;
		margin-right: 0;
		margin-bottom: 0;
		margin: 15px auto 0;
		overflow: inherit;
	}
	.top_sol_list.style2 li a{
		display: block;
		width:auto;
		height: auto;
	}

	.top_sol_list.style2 li:nth-child(4n){
		margin-right: 0;
		margin: 15px auto 0;
	}
	.top_sol_list.style2 li:nth-child(3n){
		margin-right: 0;
		margin: 15px auto 0;
	}



	/*共通*/

	.top_list_tit{
		font-size: 1.6rem;
		padding-left: 18px;
		margin-left: 5px;
		bottom: 18px;
	}

	#top .amazon_icon{
		width: 240px;
		position: static;
		margin: 0 auto;
	}

	#top .amazon_icon_img{
		float: none;
		width: 100%;
	}
	#top .amazon_icon_img img{
		/*width: 240px;*/
		width: 150px;
	}
	#top .amazon_icon_txt{
		float: none;
		text-align: center;
		font-size: 1.5rem;
		width: 100%;
		padding-top: 10px;
	}

}


/* -----------------------------------------------------------
    サービス
-------------------------------------------------------------- */

.top_ser{
	padding: 0 0 60px 0;
}

.top_ser .title_box{
	padding-top: 80px;
	color:#fff;
}

.top_ser .title_box .title_e{
	color:#fff;
	margin-bottom: 0;
}
.top_ser .title_box .title_j{
	color:#fff;
}
.top_ser_bg{
	width: 100%;
	height: 380px;
	background: url( "../images/top_ser_mv.jpg" ) top center / cover no-repeat;
}
.top_ser_bg.rei{
	background: url( "../images/top_ser_mv2.jpg" ) top center / cover no-repeat;
}

.ser_inner{
	width: 1240px;
	margin: auto;
	background-color: #fff;
	padding: 65px;
	position: relative;
	top:-100px;
	margin-bottom: -100px;
}

.top_ser_list li{
	width: 354px;
	float: left;
	margin-right: 20px;
	margin-bottom: 55px;
}

.top_ser_list li .thumb{
}
.top_ser_list li .thumb img{
	vertical-align: bottom;
	box-shadow: 2px 2px 12px #DDD;
}

/*.top_ser_list li:nth-last-child(-n+2){
	margin-bottom: 0;
}*/

.top_ser_list li:nth-child(3n){
	margin-right: 0;
}

.top_ser_list li h3{
	font-size: 2.0rem;
	font-weight: 700;
	margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
}

.top_ser_list li p{
	font-size: 1.5rem;
	font-weight: 300;
	color: #333;
	line-height: 1.2;
	text-align: center;
}

.top_ser_list li p img{
    max-width: 100%;
}

.top_ser_list li a{
	display: block;
}


.top_ser .title_box_sub{
	font-size: 2.6rem;
	font-weight: 400;
	color: #fff;
	margin-top: 30px;
}

@media screen and (max-width: 667px){

	.top_ser{
		padding: 0 0 30px;
	}
	.top_ser .title_box{
		padding-top: 50px;
	}

	.top_ser .title_box .title_e{
		color:#fff;
		margin-bottom: 0;
	}
	.top_ser .title_box .title_j{
		color:#fff;
	}

	.top_ser_bg{
		width: 100%;
		height: 170px;
		background: url( "../images/top_ser_mv_sp.jpg" ) top center / cover no-repeat;
	}

	.ser_inner .btn1{
		margin: 0 auto;
		text-align: center;
	}
	.ser_inner{
		width: 100%;
		padding: 30px 20px;
		position: relative;
		top:-30px;
		margin:0 0 -30px 0;
	}

	.top_ser_list li{
		width: 354px;
		float: left;
		margin-right: 20px;
		margin-bottom: 55px;

	}

	.top_ser_list li .thumb{
	}
	.top_ser_list li .thumb img{
		box-shadow: none;
	}

	.ser_img_sp{
		border:4px solid #2D2726;
	}

	.top_ser_list li:nth-last-child(-n+2){
		margin-bottom: 0;

	}

	.top_ser_list li:nth-child(3n){
		margin-right: 0;
	}

	.top_ser_list li h3{
		font-size: 2.0rem;
		font-weight: 700;
		margin-top: 15px;
		margin-bottom: 10px;
		text-align: center;
	}

	.top_ser_list li p{
		font-size: 1.4rem;
		font-weight: 300;
		color: #333;
		line-height: 1.4;
		text-align: center;

	}

	.top_ser .title_box_sub{
		margin-bottom: 25px;
		margin-top: 0;
		text-align: center;
		color:#333;
		font-size: 1.8rem;
		line-height: 1.2;
	}


}

/* -----------------------------------------------------------
    recruit
-------------------------------------------------------------- */

#top .top_rec{
	width: 100%;

}



#top .rec_bg_slide {
	position: relative;
	padding-top: 85px;
	background: url(../images/top_rec_mv.jpg) repeat-x 0 0;
	background-size: auto 480px;
	width: 100%;
	height: 480px;
	overflow: hidden;

	-moz-animation: loop 55s linear infinite;
	animation: loop 55s linear infinite;
}

/*アニメーション*/
@keyframes loop {
0% {
	background-position: 0 0;
	}

100% {
	background-position: -1620px 0;
	}
}


#top .top_rec_bg_sub{
	width:100%;
	height: 72px;
	background: url( "../images/top_rec_mv_wht.png" ) center top / 100% 72px  no-repeat;
	position: absolute;
	bottom:0;
}

#top .top_rec .title_box{
	width: 280px;
	height: 250px;
	background-color: #004fa1;
}

#top .top_rec .title_box .title_e{
	color:#fff;
	margin-bottom: 10px;
	padding-top: 80px;
	padding-left: 40px;
}
#top .top_rec .title_box .title_j{
	color:#fff;
	padding-left: 40px;
}

.top_rec_list{
	margin-bottom: 20px;
}
.top_rec_list li{
	position: relative;
	width: 260px;
	height: 300px;
	float: left;
	margin-right: 20px;
	box-shadow: 2px 2px 16px #CCC;
	overflow: hidden;
}

.top_rec_list li:nth-last-child(1){
	margin-right: 0;
}

.top_rec_list li img {
	vertical-align: bottom;
	transition-duration: 0.3s;
}
.top_rec_list li:hover img {
	opacity: 1;
	transform: scale(1.08);
	transition-duration: 0.3s;
}

.top_rec_list li a{
	display: block;
	width: 260px;
	height: 300px;
}


.top_rec_list li .top_rec_title{
	position: absolute;
	bottom: 25px;
	padding: 0 0 0 10px;
}
.top_rec_list li .top_rec_tit_j{
	font-size: 1.8rem;
	font-weight: 500;
	color: #fff;
	padding-left: 18px;
	background: url( "../images/icon_line.png" ) left top 50% / 10px auto no-repeat;
}
.top_rec_list li .top_rec_tit_e{
	font-family: 'Satisfy', cursive;
	color: #E50012;
	font-size: 1.6rem;
	padding-left: 20px;
	padding-top: 5px;
}



.top_rec_tit{
	font-family: 'Satisfy', cursive;
	color: #E50012;
	font-size: 6.0rem;
	margin: 30px 0 25px 0;
	text-align: center;
}

.top_rec_tit2{
	color: #333;
	font-size: 3.0rem;
	text-align: center;
	margin-bottom: 70px;
}

#top .top_rec_bnr{
	margin-bottom: 50px;
	box-shadow: 2px 2px 16px #CCC;
	overflow: hidden;
}
#top .top_rec_bnr img{
	vertical-align: bottom;
}

.top_rec_list2{
	margin-bottom: 130px;
}
.top_rec_list2 li{
	float: left;
	margin-right: 30px;
}
.top_rec_list2 li:nth-last-child(1){
	margin-right: 0;
}


@media screen and (max-width: 667px){

	#top .top_rec_bg{
		display: none;
	}

	#top .top_rec_bg_sub{
		display: none;
	}

	.top_rec_list{
		width: auto;
		margin: 0 auto;
		text-align: center;
	}

	.top_rec_list li{
		height: auto;
		float: left;
		width: 44%;
		margin-right: 0;
		margin: 4% 0 0 4%;
		box-shadow: none;
		overflow: inherit;
		text-align: center;
	}
	.top_rec_list li:nth-last-child(1){
		margin: 4% 0 0 4%;
	}
	.top_rec_list li:nth-child(even){
		float: right;
		margin: 4% 4% 0 0;
	}

	.top_rec_list li img {
		width: 100%;
		max-width: 300px;
		transition-duration: 0.3s;
		box-shadow: 2px 2px 10px #CCC;
	}
	.top_rec_list li:hover img {
		opacity: 1;
		transform: scale(1.00);
		transition-duration: 0.3s;
	}

	.top_rec_list li a{
		display: block;
		width: auto;
		height: auto;
	}

	.top_rec_list li .top_rec_title{
		bottom: 10px;
		padding: 0;
		margin: 0 auto;
		width: 100%;
		text-align: center;
	}
	.top_rec_list li .top_rec_tit_j{
		font-size: 1.6rem;
		font-weight: 500;
		padding-left: 0;
		text-align: center;
		background: none;
		line-height: 1.4;
	}
	.top_rec_list li .top_rec_tit_e{
		font-size: 1.4rem;
		padding-left: 0;
		text-align: center;
		padding-top: 2px;
	}



	.top_rec_tit{
		font-size: 3.4rem;
		margin: 30px 0 15px 0;
	}

	.top_rec_tit2{
		font-size: 2.4rem;
		margin-bottom: 25px;
		line-height: 1.5;
	}

	#top .top_rec_bnr{
		box-shadow: none;
		text-align: center;
		overflow: inherit;
		margin: 20px 4% 30px 4%;
	}
	#top .top_rec_bnr img{
		width: 100%;
		max-width: 480px;
		vertical-align: bottom;
		box-shadow: 2px 2px 10px #CCC;
	}

	.top_rec_list2{
		margin-bottom: 0;
		width: 100%;
		text-align: center;
		margin: 0 auto 40px;
	}
	.top_rec_list2 li{
		float: none;
		margin-right: 0;
		margin-bottom: 10px;
		padding: 0 20px;
	}
	.top_rec_list2 li:nth-last-child(1){
		margin-right: 0;
	}


	.top_rec_list2 .btn1.style440,
	.top_rec_list2 .btn1.style300{
		width: auto;
	}


}

/* -----------------------------------------------------------
    company
-------------------------------------------------------------- */

#top .top_com{
	width: 100%;
	position: relative;
}

#top .top_com_l{
	/*
	width: 93%;
	*/
	/*
	background: url( "../images/top_com_bg.jpg" ) repeat-x;
	*/
	background: url( "../images/top_com_bg2.jpg" ) repeat;
	padding:150px 0;
}

#top .top_com_bg{
	background: url( "../images/top_com_img_pc.png" ) no-repeat center top;
	min-height: 500px;
}
#top .top_com_r{
	/*
	position: absolute;
	left: 45%;
	top:110px;
	width: 850px;
	height: 500px;
	background: url( "../images/top_com_img.jpg" ) no-repeat 110px top;
	z-index:1;
	*/
}

#top .top_com_list{
	/*
	width:1100px;
	*/
	width: 800px;
	z-index:2;
	position: relative;

}
#top .top_com_list li{
	float: left;
	/*
	width: 245px;
	height: 125px;
	*/
	width: 380px;
	background-color: #fff;
	/*
	box-shadow: 5px 5px #004fa1;
	border-top: 1px solid #333;
	border-left: 1px solid #333;
	*/
	margin-right: 20px;
	margin-bottom: 20px;
}
#top .top_com_list li a{
	/*
	position: relative;
	*/
	display: block;
	color: #333;
	border: 1px solid #333;
	border-right: 6px solid #1d438c;
	padding: 30px 40px;
	position: relative;
}
#top .top_com_list li a::after {
    position: absolute;
    right: 20px;
    top: 50%;
    margin: -10px 0 0 0;
    display: inline-block;
    content: "\f105";
    font-family: FontAwesome;
    font-size: 2rem;
    color: #1d438c;
}

#top .top_com_list li a .title_e{
	color: #999;
}
#top .top_com_list li a:hover{
	background: #1d438c;
	color: #FFF;
	border: 1px solid #1d438c;
	border-right: 6px solid #1d438c;
}
#top .top_com_list li a:hover::after {
    color: #FFF;
}
#top .top_com_list li a:hover .title_e{
	color: #FFF;
	-webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -ms-transition: 0.3s;
    transition: 0.3s;
}
/*
#top .top_com_list li a::after {
	position: absolute;
	right: 20px;
	top: 50%;
	margin: -10px 0 0 0;
	display: inline-block;
	content: "\f105";
	font-family: FontAwesome;
	font-size: 2rem;
	color: #E50012;
}
*/

#top .top_ser_list img{
	margin: auto;
}
#top .top_com_list .title_j{
	font-size: 1.6rem;
	margin-bottom:8px;
}

#top .top_com_list .title_e{
	font-family: 'Lato', sans-serif;
	font-size: 1.2rem;
	font-weight: 700;
}

#top .top_com .title_box_sub{
	font-size: 3.0rem;
	font-weight: 300;
	line-height: 1.6;
	text-align: left;
	position: relative;
	z-index:2;
	margin: 45px 0 55px;
	color: #333;
}


@media screen and (max-width: 667px){

	#top .top_com{
		position: static;
        margin-top: 20px;
	}

	#top .top_com_l{
		width: 100%;
		height: auto;
		background-image: none;
		background-color: #F0F4F7;
		padding:0 0 50px;
	}

	#top .top_com_bg{
		background: none;
		min-height: inherit;
	}

	#top .top_com_l .inner{

	}
	#top .top_com_r{
		position: static;
		width: 100%;
		height: auto;
		background: none;
		z-index:1;
	}

	.top_com_img_title{
		background: url( "../images/top_com_img_sp.jpg" ) top center / cover no-repeat ;
		width: 100%;
		padding: 50px 0;
	}
	#top .top_com_list{
		width:100%;
		z-index:2;
		position: relative;

	}


	#top .top_com_list li{
		float: none;
		width: auto;
		height: auto;
		margin-right: 0;
		margin-bottom: 0;
		text-align: left;
		margin: 0 0 10px;
	}
	#top .top_com_list li a{
		padding: 20px;
		position: relative;
		border-right: 1px solid #333;
	}
	#top .top_com_list li a .title_e{
	}
	#top .top_com_list li a:hover{
		border-right: 1px solid #E50012;
	}
	#top .top_com_list li a:hover .title_e{
	}
	#top .top_com_list li a::after {
		position: absolute;
		right: 15px;
		top: 50%;
		margin: -10px 0 0 0;
		display: inline-block;
		content: "\f105";
		font-family: FontAwesome;
		font-size: 2rem;
		color: #E50012;
	}
	#top .top_com_list li a:hover::after {
		color: #FFF;
	}


	/*
	#top .top_com_list li{
		float: none;
		width: 100%;
		height: auto;
		box-shadow: 5px 5px #50616D;
		margin-right: 0;
		margin-bottom: 10px;
		text-align: left;
		background: url( "../images/yazirusi.png" ) right 20px top 50% / 7px auto no-repeat #fff;
	}
	#top .top_com_list li a{
		display: block;
		padding: 17px 20px 15px;
	}
	*/

	#top .top_ser_list img{
		margin: auto;
	}
	#top .top_com_list .title_j{
		font-size: 1.6rem;
		margin-bottom:0;
	}

	#top .top_com_list .title_e{
		display: none;
	}
	#top .top_com_bg_sp{
		background-color: #F0F4F7;
		position:relative;
		top:-30px;
		margin-bottom: -30px;
		padding-top: 30px;
	}
	#top .top_com .title_box_sub{
		font-size: 1.8rem;
		margin-bottom: 25px;
		margin-top: 0;
		text-align: center;
	}

}