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

/*各その他ページ共通部分*/
#other_head{
	height: 260px;
	width: 100%;
	position: relative;
}

.other_head_back01{
	background: url("../img/choose/main_title_back_choose.jpg")no-repeat; background-size: cover; background-position: center;
}
.other_head_back02{
	background: url("../img/service/main_title_back_service.png"); background-size: cover; background-position: center;
}
.other_head_back03{
	background: url("../img/flow/main_title_back_flow.png") no-repeat; background-size: cover; background-position: center;
}

.other_head_back04{
	background: url("../img/original/main_title_back_original.jpg") no-repeat; background-size: cover; background-position: center;
}

.other_head_back05{
	background: url("../img/equipment/main_title_back_equipment.jpg")no-repeat; background-size: cover; background-position: center;
}

.other_head_back06{
	background: url("../img/company/main_title_back.jpg")no-repeat; background-size:cover; background-position: bottom; border-bottom: 2px solid #DDDDDD;
}

.other_title{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
}

.other_title_01{ width: 338px; }
.other_title_02{ width: 312px; }
.other_title_03{ width: 373px; }
.other_title_04{ width: 390px; }
.other_title_05{ width: 285px; }
.other_title_06{ width: 337px; }

.other_waku{
	padding: 50px 0px 30px 0px;
}

/*フェードイン*/
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}


/*弊社が選ばれる理由*/

.choose_waku{
	padding: 50px 20px 30px 50px;
	margin-top: 20px;
	min-height: 240px;
}

.choose_waku_b{
	padding: 50px 20px 30px 50px;
	margin-top: 20px;
	min-height: 240px;
	position: relative;
}

.choose_back_01{
	background: url("../img/choose/choose_back_img01.png") no-repeat;
	background-position: right 20px top 20px;
}

.choose_back_02{
	background: url("../img/choose/choose_back_img02.png") no-repeat;
	background-position: left 50px top 20px;
}

.choose_back_03{
	background: url("../img/choose/choose_back_img03.png") no-repeat;
	background-position: right 20px top 20px;
}

.choose_back_04{
	background: url("../img/choose/choose_back_img04.png") no-repeat;
	background-position: left 50px top 20px;
}

.choose_back_05{
	background: url("../img/choose/choose_back_img05.png") no-repeat;
	background-position: right 20px top 20px;
}

.choose_box01{
	position: relative;
	width: 480px;
	text-align: center;
	margin-top: 1em;
	padding: 40px 0px 30px 0px;
	border: 5px solid black;
	background-color: rgba( 255, 255, 255, 0.2 );
	}

.choose_box01 .choose{
	position: absolute;
	color: #ec6c00;
	top: 0;
	left: 0;
	font-size: 58px;
	padding: 0 10px;
	margin: -10px 0px 0px 0px;
	background:  url("../img/common/back_dot01.png") repeat #FFFFFF;
	transform: translateY(-50%) translateX(1em);
	}
	
.choose_box02{
	position: relative;
	width: 480px;
	text-align: center;
	margin-top: 1em;
	padding: 40px 0px 30px 0px;
	border: 5px solid black;
	right: 0px;
	background-color: rgba( 255, 255, 255, 0.2 );
	margin-left: auto;
	}

.choose_box02 .choose{
	position: absolute;
	color: #ec6c00;
	top: 0;
	left: 0;
	font-size: 58px;
	padding: 0 10px;
	margin: -10px 0px 0px 0px;
	background:  url("../img/common/back_dot01.png") repeat #FFFFFF;
	transform: translateY(-50%) translateX(1em);
	}
	
.choose_box_title_padding{
	padding: 55px 0px 40px 0px !important;
	
}

	.choose_title{
		font-size: 29px;
		font-weight: bold;
		line-height: 29px;
	}

	.choose_sub_title{
		font-size: 20px;
		color: #ec6c00;
	}
	
	.choose_text_waku_01{
		margin: 50px 0px 0px 0px;
		padding-bottom: 50px;
		width: 100%;
	}
	
	.choose_text_waku_02{
		position: relative;
		margin: 50px 0px 0px 0px;
		padding-bottom: 50px;
		width: 100%;
	}
	.choose_text_orange{
		font-size: 20px;
		color: #ec6c00;
		font-weight: bold;
		margin-bottom: 10px;
	}

	.choose_button_waku{
		position: absolute;
		bottom: 0px;
		right: 0px;
	}
	
/*取扱いサービス一覧*/
.service_waku{
	display:flex;
	flex-wrap: wrap;
	margin-bottom: 30px;
}
.service_box{
	width: 31%;
	box-sizing: border-box;
	padding: 20px;
	background-color: #fff;
	margin: 1%;
	border: 1px solid #DDDDDD;
}

.service_sizai_list_img{
	width: 100%;
}
.service_sizai_list_title{
	font-size: 20px;
	font-weight: bold;
	margin: 5px 0px;
}
.service_sizai_list_text{
	min-height: 80px;
	margin: 5px 0px 20px 0px;
	font-size: 13px;
}

ul.service_sizai_list {
	list-style: none;
}
ul.service_sizai_list li {
	float: left;
	padding: 4px 10px 5px 10px;
	background: #333333;
	color: #ffffff;
	font-size: 12px;
	line-height: 12px;
	margin: 3px 2px 0px 0px;
	display: inline-block;
	vertical-align: bottom;
}

/*ご依頼の流れ*/

.circle_waku_flow{
	margin: 30px auto 0px auto;
	text-align: center;
	width: 460px;
}

.flow_plus{
	text-align: center;
	padding: 0px 0px 20px 0px;
}

.flow_plus_img{
	width: 41px;
}

.flow_box_last{
	 width: 100%;
	 min-height: 210px;
	 padding: 20px;
	 box-sizing: border-box;
	 margin: 0px 0px 30px 0px;
	 border: 2px solid #DDDDDD;
	 background: url("../img/flow/flow_after.png") no-repeat #FFFFFF;
	 background-position: right 20px center;
}

.flow_service{
	text-align: center;
	margin-bottom: 10px;
	font-size: 13px;
}

.flow_text_orange{
	color: #ec6c00;
	font-size: 20px;
	font-weight: bold;
	border: 2px solid #ec6c00;
	padding: 10px 20px;
	width: 480px;
	text-align:center; 
	background: #FFFFFF;
	margin: 0px auto 10px auto;
	border-radius: 50px;
}



@media screen and (max-width: 750px) { /*TAB*/

/*各その他ページ共通部分*/
.other_title_01{ width: 80%; }
.other_title_02{ width: 80%; }
.other_title_03{ width: 80%; }
.other_title_04{ width: 80%; }
.other_title_05{ width: 70%; }
.other_title_06{ width: 80%; }

/*弊社が選ばれる理由*/
.choose_waku{
	padding: 200px 10px 10px 10px;
	margin-top: 20px;
	min-height: 240px;
}

.choose_waku_b{
	padding: 200px 10px 30px 10px;
	margin-top: 20px;
	min-height: 240px;
	position: relative;
}

.choose_back_01{
	background: url("../img/choose/choose_back_img01_sp.png")no-repeat;
	background-position: top 0 center;
	background-size: contain;
}

.choose_back_02{
	background: url("../img/choose/choose_back_img02_sp.png") no-repeat;
	background-position: top 0 center;
	background-size: contain;
}

.choose_back_03{
	background: url("../img/choose/choose_back_img03_sp.png") no-repeat;
	background-position: top 0 center;
	background-size: contain;
}

.choose_back_04{
	background: url("../img/choose/choose_back_img04_sp.png") no-repeat;
	background-position: top 0 center;
	background-size: contain;
}

.choose_back_05{
	background: url("../img/choose/choose_back_img05_sp.png") no-repeat;
	background-position: top 0 center;
	background-size: contain;
}

.choose_box01{
	position: relative;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	margin-top: 1em;
	padding: 40px 0px 30px 0px;
	border: 5px solid black;
	background-color: rgba( 255, 255, 255, 0.7 );
	}

.choose_box01 .choose{
	position: absolute;
	color: #ec6c00;
	top: 0;
	left: 0;
	font-size: 30px;
	padding: 20px 20px;
	margin: 0px 0px 0px 0px;
	background:#000000;
	transform: translateY(-50%) translateX(1em);
	border-radius: 50%;
	}
	
.choose_box02{
	position: relative;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	margin-top: 1em;
	padding: 40px 0px 30px 0px;
	border: 5px solid black;
	right: 0px;
	background-color: rgba( 255, 255, 255, 0.7 );
	margin-left: 0px;
	}

.choose_box02 .choose{
	position: absolute;
	color: #ec6c00;
	top: 0;
	left: 0;
	font-size: 30px;
	padding: 20px 20px;
	margin: 0px 0px 0px 0px;
	background:#000000;
	transform: translateY(-50%) translateX(1em);
	border-radius: 50%;
	}
	
.choose_box_title_padding{
	padding: 55px 0px 40px 0px !important;
	
}

	.choose_title{
		font-size: 29px;
		font-weight: bold;
		line-height: 29px;
	}

	.choose_sub_title{
		font-size: 20px;
		color: #ec6c00;
	}
	
	.choose_text_waku_01{
		margin: 20px 0px 0px 0px;
		padding-bottom: 50px;
		width: 100%;
	}
	
	.choose_text_waku_02{
		position: relative;
		margin: 20px 0px 0px 0px;
		padding-bottom: 50px;
		width: 100%;
	}
	.choose_text_orange{
		font-size: 20px;
		color: #ec6c00;
		font-weight: bold;
		margin-bottom: 10px;
	}

	.choose_button_waku{
		position: absolute;
		bottom: 0px;
		right: 0px;
	}

/*取扱いサービス一覧*/
.service_waku{
	display:flex;
	flex-wrap: wrap;
	margin-bottom: 30px;
	margin-top: 20px;
}
.service_box{
	width: 48%;
	box-sizing: border-box;
	padding: 10px;
	background-color: #fff;
	margin: 1%;
	border: 1px solid #DDDDDD;
}

.service_sizai_list_img{
	width: 100%;
}
.service_sizai_list_title{
	font-size: 20px;
	font-weight: bold;
	margin: 5px 0px;
}
.service_sizai_list_text{
	min-height: 80px;
	margin: 5px 0px 20px 0px;
	font-size: 13px;
}

/*ご依頼の流れ*/

.circle_waku_flow{
	margin: 30px auto 0px auto;
	text-align: center;
	width: auto;
}

.flow_plus{
	text-align: center;
	padding: 0px 0px 0px 0px;
}

.flow_plus_img{
	width: 30%;
	max-width: 60px;
}

.flow_box_last{
	 width: 100%;
	 min-height: 300px;
	 padding: 20px;
	 box-sizing: border-box;
	 margin: 0px 0px 30px 0px;
	 border: 2px solid #DDDDDD;
	 background: url("../img/flow/flow_after_sp.png")no-repeat #FFFFFF;
	 background-position: right 20px bottom 20px;
	 background-size: contain;
}

.flow_text_orange{
	color: #ec6c00;
	font-size: 16px;
	font-weight: bold;
	border: 2px solid #ec6c00;
	padding: 10px 20px;
	text-align:center; 
	background: #FFFFFF;
	margin: 20px 10px 10px 10px;
	border-radius: 50px;
	width: auto;
}

}/*750ここまで*/

@media screen and (max-width: 450px) { /*SP2*/

/*弊社が選ばれる理由*/
.choose_waku{
	padding: 120px 10px 10px 10px;
	margin-top: 20px;
	min-height: 240px;
}

.choose_waku_b{
	padding: 120px 10px 30px 10px;
	margin-top: 20px;
	min-height: 240px;
	position: relative;
}

.choose_box01 .choose{
	font-size: 20px;
	padding: 20px 20px;
	}
	
.choose_box02 .choose{
	font-size: 20px;
	padding: 20px 20px;
	}

	.choose_title{
		font-size: 20px;
		font-weight: bold;
		line-height: 25px;
	}
	
/*取扱いサービス一覧*/
.service_waku{
	display:flex;
	flex-wrap: wrap;
	margin-bottom: 30px;
	margin-top: 20px;
}
.service_box{
	width: 100%;
	box-sizing: border-box;
	padding: 10px;
	background-color: #fff;
	margin: 1% 1% 30px 1%;
	border: 1px solid #DDDDDD;
}

}/*450ここまで*/