@charset "utf-8";


/* top ---------------------------------- */

.toppage_scroll{
	position: absolute;
	top: -100px;
	transition: all 0.5s 0s ease;
	z-index: 3;
}


#pc_top_nav ul{
	display: flex;
	position: absolute;
	padding-top: 40px;
	z-index: 2;
}

#pc_top_nav ul li{
	margin-right: 50px;
}

#pc_top_nav ul li a{
	font-size: 18px;
	font-weight: 400;
	padding: 0px 0 10px 0;
	display: block;
	color: #FFF;
	border-bottom: solid 1px #FFF;
}

#pc_top_nav ul li a{
	font-size: 18px;
	font-weight: 400;
	padding: 0px 0 10px 0;
	display: block;
	color: #FFF;
	border-bottom: solid 1px #FFF;
	transition: all 0.5s 0s ease;
}

#pc_top_nav ul li a:hover{
	opacity: 0.5;


}

	


/* mainv ---------------------------------- */


#mainv{
	position: relative;
	width: 100%;
	height: 554px;
	background: url(../image/top/mv.jpg) no-repeat top center;
	background-size: cover;
	margin-bottom: 95px;
}

#mainv p{
	text-align: center;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	height: 194px;
	width: 397px;
}

#mainv p img{
	width: 100%;
}


#company{
	padding-top: 115px;
	margin-top: -115px;
}



@media screen and (max-width: 834px){
	#pc_top_nav{
		display: none;
	}

	#mainv{
		height: 412px;
		background: url(../image/top/mv_sp.jpg) no-repeat top center;
		background-size: cover;
		margin-bottom: 40px;
	}
	
	#mainv p{
		width: auto;
		max-width: 300px;
	}


	#company{
		padding-top: 75px;
		margin-top: -75px;
	}

}


.c_left{
	float: left;
	width: calc(100% - 564px);
}

.c_right{
	float: right;
	max-width: 524px;
	height: auto;
}

.c_right img{
	width: 100%;
	height: auto;
}


@media screen and (max-width: 834px){
	
	.c_left{
		float: none;
		width: 100%;
	}
	
	.c_left p{
		margin-bottom: 40px;
	}
	
	.c_right{
		float: none;
		margin-bottom: 40px;
	}
	
}





#philosopht{
	background: url(../image/top/bg_ph1.jpg) no-repeat top right;
	background-size: contain;
	padding-bottom: 100px;
}

#ph_bg{
	background: url(../image/top/bg_ph2.jpg) repeat-x center bottom;
	background-size: contain;
	height: 220px;
	margin-top: 30px;
}

@media screen and (max-width: 834px){
	#philosopht{
		background: linear-gradient(450deg, transparent 0%, transparent 28%,#D9F6F6 0%, #D9F6F6 100%);
		background-size: contain;
		padding-bottom: 100px;
	}
	
	.sp_philosopht_bg{
		background: url(../image/top/bg_ph1_sp.jpg) no-repeat top right;
		background-size: 70%;
	}

	#ph_bg{
		background: url(../image/top/bg_ph2.jpg) repeat-x top left;
		background-size: 300%;
		height: 166px;
		margin-top: 40px;
		/*margin-left: 36px;*/
	}
}



.b_left{
	float: left;
	max-width: 524px;
	height: auto;
	padding-top: 12px;
}

.b_left img{
	width: 100%;
	height: auto;
}

.b_right{
	float: right;
	width: calc(100% - 564px);
}

.b_right h2{
	margin-bottom: 30px;
}

.b_right p{
	margin-bottom: 46px;
}



#link{
	background: url(../image/top/bg_link.jpg) no-repeat center center;
	background-size: cover;
	height: 270px;
	text-align: center;
	padding-top: 60px;
	margin-bottom: 0px;
}

.l_left{
	float: left;
	width: 50%;
}

.l_right{
	float: right;
	width: 50%;
}

#link h3{
	color: #1865B1;
	font-family: 'Hind', sans-serif;
	font-weight: 400;
	font-size: 30px;
	margin-bottom: 90px;
}

#link .btn_link{
	margin: auto;
	display: inline-block;
}


@media screen and (max-width: 834px){
	.b_left{
		float: none;
		width: 100%;
		margin-bottom: 40px;
	}

	.b_right{
		float: none;
		width: 100%;
	}

	#link{
		background: none;
		background-size: cover;
		height: auto;
		text-align: center;
		padding-top: 0px;
		margin-bottom: 0px;
	}
	
	#link h3{
		margin-bottom: 40px;
	}

	.l_left{
		background: url(../image/top/bg_link_sp01.jpg) no-repeat center center;
		background-size: cover;
		float: none;
		width: 100%;
		padding: 50px 0 0px 0;
		height: 197px;

	}

	.l_right{
		background: url(../image/top/bg_link_sp02.jpg) no-repeat center center;
		background-size: cover;
		float: none;
		width: 100%;
		padding: 50px 0 0px 0;
		height: 197px;

	}

	#link .wrap{
		padding: 0;
		width: 100%;
	}
	


}



/* page ---------------------------------- */

.business{
	background: url(../image/page/mv_business.jpg) no-repeat bottom center;
	background-size: cover;
}

.company{
	background: url(../image/page/mv_company.jpg) no-repeat bottom center;
	background-size: cover;
}

.recruit{
	background: url(../image/page/mv_recruit.jpg) no-repeat bottom center;
	background-size: cover;
}

.privacy{
	background: url(../image/page/mv_privacy.jpg) no-repeat bottom center;
	background-size: cover;
}

.contact{
	background: url(../image/page/mv_contact.jpg) no-repeat bottom center;
	background-size: cover;
}


@media screen and (max-width: 834px){
	.business{
		background: url(../image/page/mv_business_sp.jpg) no-repeat bottom center;
		background-size: cover;
	}

	.company{
		background: url(../image/page/mv_company_sp.jpg) no-repeat bottom center;
		background-size: cover;
	}

	.recruit{
		background: url(../image/page/mv_recruit_sp.jpg) no-repeat bottom center;
		background-size: cover;
	}

	.privacy{
		background: url(../image/page/mv_privacy_sp.jpg) no-repeat bottom center;
		background-size: cover;
	}

	.contact{
		background: url(../image/page/mv_contact_sp.jpg) no-repeat top center;
		background-size: cover;
	}

}





#sec_business{
	margin-bottom: 0;
}


#sec_business h3{
	font-size: 24px;
	font-weight: 500;
	margin-bottom: 20px;
	
}

.b_img{
	text-align: center;
	background: #D9F6F6;
	position: relative;
	width: 100%;
	height: 100%;
	display: block;
	margin-top: 95px;
	padding-bottom: 50px;
	margin-bottom: 95px;
}

.b_img img{
	position: relative;
	top: -45px;
	width: 100%;
	max-width: 980px;
	height: auto;
}

.b_img.nocss{
	margin-bottom: 0px;
}


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


	.b_img img{
		position: relative;
		width: calc(100% - 72px);
		max-width: 980px;
		height: auto;
	}
    



}

@media screen and (max-width: 834px){
	.b_img{
		text-align: center;
		background: #D9F6F6;
		background: linear-gradient(180deg, transparent 0%, transparent 66%,#D9F6F6 0%, #D9F6F6 100%);
		position: relative;
		width: calc(100% - 72px);
		height: 100%;
		display: block;
		margin-top: 0;
		margin-bottom: 50px;
		padding: 55px 36px 100px 36px;
	}

	.b_img img{
		position: relative;
		top: 0%;
		width: 100%;
		max-width: 980px;
		height: auto;
	}

}





.shadow_box{
	width: auto;
	max-width: 890px;
	margin: auto;
	box-shadow: 0px 5px 30px 0px rgba(26, 19, 17, 0.08);
	padding: 35px 45px 30px 45px;
	display: flex;
	flex-wrap: wrap;
	margin-top: 30px;
}


@media screen and (max-width: 1012px){
	.shadow_box{
		width: auto;
		max-width: 890px;
		margin: auto;
		padding: 35px 25px 30px 25px;
		margin-top: 30px;
		margin: 30px 36px 0 36px;
	}
}


.business_list dl:nth-child(1){
	width: 30%;
}

.business_list dl:nth-child(2){
	width: 40%;
}

.business_list dl:nth-child(3){
	width: 30%;
}

.business_list dt{
	margin-bottom: 5px;
}

.business_list dd{
	padding-left: 1.2em;
	font-size: 14px;
}


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

	.business_list dt{
		font-size: 14px;
	}

	.business_list dd{
		font-size: 12px;
	}

	.business_list dd:last-child{
		margin-bottom: 0.8em
	}
}



.company_bg{
	width: 100%;
	background: url(../image/page/c_img01.jpg) no-repeat center right;
	background-size: contain;
}

.company_bg h2{
	width: 100%;
}

.company_bg p{
	font-size: 16px;
	width: calc(100% - 192px);
	display: block;
}


.company_bg p.sp{
	display: none;
}



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

	.company_bg{
		width: 100%;
		background: none;
		background-size: contain;
	}


	.company_bg p{
		font-size: 16px;
		width: calc(100%);
		display: block;
	}
	
	
	#sec_company p.sp{
		padding-top: 1.5em;
		text-align: center;
		max-width: 200px;
		width: 100%;
		margin: auto;
		display: block;
	}
	
	#sec_company img{
		width: 100%;

	}
}







#sec_company .shadow_box{
	max-width: 850px;
	margin-bottom: 70px;
}




table{
	width: 100%;
	font-size: 16px;
	border-collapse: separate;
	border-spacing: 0px;
}


table th{
	font-weight: 300;
	color: #1865B1;
	border-bottom: solid 1px #1865B1;
	padding: 20px;
}

table td{
	font-weight: 300;
	border-bottom: solid 1px #AAAAAA;
}

#sec_company .info{
	margin-bottom: 50px;
	overflow: hidden;
}

#sec_company .info h2{
	width: 230px;
	float: left;
}

#sec_company .info table{
	width: calc(100% - 230px);
	float: right;
}

#sec_recruit h3{
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 20px;
	vertical-align: middle;
}

#sec_recruit h3 span{
	font-size: 18px;
	color: #FFF;
	background: #1A1311;
	display: inline-block;
	border-radius: 5px;
	padding: 0 8px 2px 8px;
	margin-left: 10px;
	vertical-align: text-bottom;
}



@media screen and (max-width: 834px){
	#sec_company .info h2{
		width: 230px;
		padding-left: 36px;
		float: none;
	}

	#sec_company .info table{
		width: calc(100% - 72px);
		float: none;
		margin: 0 36px;
	}

	table th{
		width: 5em;
		font-weight: 300;
		color: #1865B1;
		border-bottom: solid 1px #1865B1;
		padding: 0.8em 1em 1.5em 1em;
		vertical-align: top;
	}

	table td{
		width: auto;
		font-weight: 300;
		border-bottom: solid 1px #AAAAAA;
		padding: 0.8em 0em 1.2em 0em;
	}
	
	.map_wrap{
		padding: 0 36px;
	}

	#sec_recruit h3 span{
		display: block;
		width: auto;
		width: 4.5em;
		text-align: center;
	}

}



.rec_left{
	background: #D9F6F6;
	background: linear-gradient(270deg, transparent 0%, transparent 24%,#D9F6F6 0%, #D9F6F6 100%);
	padding: 50px 0;
	margin-bottom: 100px;
}


.rec_txt01{
	width: calc(100% - 384px);
	float: left;
}

.ret_img01{
	float: right;
	width: 334px;
	padding-top: 30px;
}

.ret_img01 img{
	width: 100%;
}


.rec_right{
	background: #D9F6F6;
	background: linear-gradient(450deg, transparent 0%, transparent 24%,#D9F6F6 0%, #D9F6F6 100%);
	padding: 50px 0;
	margin-bottom: 45px;
}

.rec_txt02{
	width: calc(100% - 384px);
	float: right;
	padding-top: 5px;
}

.ret_img02{
	float: left;
	width: 334px;
}

.ret_img02 img{
	width: 100%;
}



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

	.rec_left{
		background: #D9F6F6;
		background: linear-gradient(270deg, transparent 0%, transparent 24%,#D9F6F6 0%, #D9F6F6 100%);
		padding: 50px 0;
		margin-bottom: 100px;
	}

	.rec_txt01{
		width: 100%;
		float: none;

	}

	.ret_img01{
		float: none;
/*		max-width: 334px;*/
		width: 100%;
		padding-top: 10px;
		margin-bottom: 10px;
	}



	.rec_txt02{
		width: 100%;
		float: none;
	}

	.ret_img02{
		width: 100%;
		float: none;
		margin-bottom: 10px;
	}

}





#sec_recruit .shadow_box{
	max-width: 570px;
	text-align: center;
	padding: 35px 0;
}

#sec_recruit .shadow_box p{
	text-align: center;
	width: 100%;

}

#sec_recruit .shadow_box p:nth-child(1){
	font-size: 16px;
	font-weight: bold;
}

#sec_recruit .shadow_box p:nth-child(2){
	margin-bottom: 50px;
}

#sec_recruit .shadow_box p.btn_link a{
	width: 268px;
	margin: auto;
	font-weight: 400;
}


@media screen and (max-width: 834px){
	#sec_recruit .shadow_box{
		max-width: 570px;
		width: calc(100% - 72px);
		text-align: center;
		padding: 35px 10px;
		margin: auto;
	}
}






#sec_privacy .shadow_box{
	max-width: 820px;
	padding: 60px 60px;
}

#sec_privacy .shadow_box h3{
	font-weight: 24px;
	margin-bottom: 40px;
}

#sec_privacy .shadow_box dt{
	font-weight: bold;
}

#sec_privacy .shadow_box dd.dltitle{
	font-size: 16px;
	margin-bottom: 20px;
	padding-left: 0em;
	text-indent: 0em;
}

#sec_privacy .shadow_box dd{
	font-size: 14px;
	padding-left: 0.8em;
	text-indent: -0.8em;
}

#sec_privacy .shadow_box dd.ddbtm{
	margin-bottom: 40px;
}

#sec_privacy .shadow_box dd.ddbtm2{
	margin-bottom: 20px;
}

#sec_privacy .shadow_box dd.ddbtm3{
	margin-bottom: 0px;
}

#sec_privacy .shadow_box dd.ddtel{
	font-size: 24px;
	font-family: 'Hind', sans-serif;
	font-weight: bold;
}

#sec_contact .wrap{
	max-width: 824px;
	margin: auto;
}

#sec_contact p:nth-child(1){
	margin-bottom: 1em;
}

#sec_contact p:nth-child(2){
	margin-bottom: 0.25em;
}

#sec_contact p:nth-child(3){
	font-weight: bold;
	margin-bottom: 2em;
}

#sec_contact p:nth-child(4){
	margin-bottom: 2em;
}

#sec_contact p:nth-child(4) a{
	font-weight: bold;
	color: #1865B1;
	text-decoration: underline;

}


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

	#sec_privacy .shadow_box{
		padding: 40px 30px;
	}


}

form{
	padding: 50px 30px 0 30px;
}


@media screen and (max-width: 834px){
form{
	padding: 30px 0px 0 0px;
}

}



#contact_form dt{
	font-weight: bold;
	margin-bottom: 10px;
}

#contact_form dt span{
	background: #1866B1;
	color: #FFF;
	font-size: 12px;
	display: inline-block;
	padding: 1px 5px;
	margin-left: 5px;
}

#contact_form dt span.nini{
	background: #D8F6F6;
	color: #A4ADAC;

}

#contact_form dd{
	font-weight: 400;
	margin-bottom: 20px;
}


input,
textarea{
	border: none;
	background: #F5F5F5;
	padding: 5px 10px;
	width: 100%;
	box-sizing: border-box;
}

textarea{
	padding: 10px 10px;
}


#contact_form dd label{
	font-weight: 500;
	background: #F5F5F5;
	display: inline-block;
	margin-right: 10px;
	width: 200px;
	padding: 5px 10px;
}


#contact_form dd label input{
	font-weight: 500;
	background: #F5F5F5;
	display: inline-block;
	margin-right: 10px;
	width: auto;
	padding: 5px 10px;
}

#contact_form dd input{
		font-weight: 500;
	background: #F5F5F5;
	display: inline-block;
	margin-right: 10px;
	width: 200px;
	padding: 10px 10px;
	width: 100%;
}





@media screen and (max-width: 834px){
	#contact_form dd label{
		width: 100%;
		margin-bottom: 10px;
		box-sizing: border-box;
	}
}


.btn_submit{
	border: none;
	padding: 0;
	margin: auto;
	display: block;
	margin-bottom: 20px;



}

.btn_submit p{
	margin-bottom: 0!important;
}

.btn_submit a{
    color: #FFF;
    background: #1865B1;
    position: relative;
    text-align: center;
    line-height: 3.7;
    font-weight: 600;
    /*font-weight: bold;*/
    font-size: 16px;
    cursor: pointer;

}



.btn_link input{
	display: block;
	width: 230px;
	height: 62px;
	background: #1865B1;
	color: #FFF;
	font-weight: bold;
}


.btn_link input:after{
	content: "";
	width: 40px;
	height: 40px;
	background: #000;
	position: absolute;
	right: -10px;
	top: 0;
	bottom: 0;
	margin: auto;
	z-index: 2;
}


.btn_link input:before{
	content: "";
	position: absolute;
	right: 7px;
	top: 0;
	bottom: 0;
	margin: auto;
		z-index: 2;
	display: inline-block;
	box-sizing: border-box;
	width: 10px;
	height: 10px;

	border-right: solid 3px #FFF;
	border-top: solid 3px #FFF;
	transform: rotate(45deg);
	z-index: 2;
}

@media screen and (max-width: 834px){
	.btn_link span{
		margin: auto;
	}
}


.formTable{
	margin-bottom: 40px;
}

.formTable th{
	width: 140px;
}


#sec_contact p.error_messe{
	font-weight: bold;
	color: red;
	margin-bottom: 2em;
}


#sec_contact p.btm40{
	margin-bottom: 40px !important;
}

#formWrap a{
	cursor: pointer;
}