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

/* ---------------------------------------------
 社長挨拶
--------------------------------------------- */

/* 下層ページレイアウト company */
#company.president .main_box .president_wrap{
	box-sizing:border-box;
	padding-bottom:30px;
}


#company.president .main_box .president_wrap dl{
	padding-top:90%;
	margin:0 0 20px 0;
	background: url("/img/company/president_onishi.webp") no-repeat center top;
	background-size:70%;
	position:relative;
}

#company.president .main_box .president_wrap dl dd{
	width:100%;
	position:absolute;
	bottom:0;
	background:#fff;
}

#company.president .main_box .president_wrap dl dd h5{
	font-size:110%;
	height:100%;
	font-weight:bold;
	margin-top:10px;
	padding:0 0.5em;
	line-height: 0;
	letter-spacing:0em;
}

#company.president .main_box .president_wrap dl dd h5 span{
	line-height:1.7em;
}
#company.president .main_box .president_wrap p span{
	font-weight:bold;
	font-size:105%;
}
#company.president .main_box .president_wrap p{
	margin-bottom: 20px;
}
#company.president .main_box .president_wrap dl dd h5:before,
#company.president .main_box .president_wrap dl dd h5:after{
	position: absolute;
	top: 0;
	content:'';
	width: 20px;
	height: 100%;
	display: inline-block;
}


#company.president .main_box .president_wrap p.text_r{
	margin-top: 10px;
	font-weight:bold;
	text-align:right !important;
}

#company.president .main_box .president_wrap p.text_r img{
	width:150px;
}
#company.president  .main_box .president_banner{
	width:100%;
	margin:0px auto 50px auto;
	padding:30px 30px;
	background:#f5f5f5;
	box-sizing:border-box;
		/* 200128追加 */
		display: flex;
		flex-wrap: wrap;
}

#company.president  .main_box .president_banner li{
	width:100%;
	height:auto;
	list-style:none;
	box-shadow:5px 5px;
	display:block;
	transition: 0.3s linear;
	margin-bottom:20px;
		/* 200128追加 */
		padding: 0;
		margin-bottom: 0;
}
	/* 200128追加 */
#company.president  .main_box .president_banner li:nth-child(n+2) {
	margin-top: 20px;
}

#company.president .main_box .president_banner li img{
	width:100%;
	list-style:none;
}

#company.president .main_box .president_banner li:hover{
	-webkit-transform: translate(5px, 5px);
	-moz-transform: translate(5px, 5px);
	-ms-transform: translate(5px, 5px);
	-o-transform: translate(5px, 5px);
	transform: translate(5px, 5px);
	-webkit-box-shadow: 0px 0px 0px 0px #000 !important;
	-moz-box-shadow: 0px 0px 0px 0px #000 !important;
	box-shadow: 0px 0px 0px 0px #000 !important;
}


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

	#company.president .main_box .president_wrap{
		background:#fff;
		box-sizing:border-box;
	}
	#company.president .main_box .president_wrap dl{
		padding-top:50%;
		margin:0 0 20px 0;
		background-size:auto 100%;
	}

	#company.president .main_box .president_wrap dl dd{

	}
	#company.president .main_box .president_wrap dl dd h5 span{
		background:none;
	}

	#company.president .main_box .president_wrap dl dd h5{
		font-size:140%;
		height:auto;
		width:auto;
		padding:10px;
		margin:0;
		-webkit-writing-mode: horizontal-tb;
     	 -ms-writing-mode: horizontal-tb;
          writing-mode: horizontal-tb;

	}

	#company.president .main_box .president_banner{
		width:100%;
		margin:0px auto 50px auto;
		padding:30px 50px;
		display:flex;
		justify-content:space-between;
		background:#f5f5f5;
		box-sizing:border-box;
			/* 200128追加 */
			display: flex;
			flex-wrap: wrap;
	}

	#company.president .main_box .president_banner li{
		width:60%;
		min-width:300px;
		height:auto;
		margin:auto auto;
		list-style:none;
		box-shadow:5px 5px;
		display:block;
		transition: 0.3s linear;
			/* 200128追加 */
			padding: 0;
			margin-bottom: 10px;
	}
		/* 200128追加 */
	#company.president .main_box .president_banner li:nth-child(n+2) {
		margin-top: 20px;
	}

	#company.president .main_box .president_banner li img{
		width:100%;
		list-style:none;
	}

	#company.president .main_box .president_banner li:hover{
		-webkit-transform: translate(5px, 5px);
		-moz-transform: translate(5px, 5px);
		-ms-transform: translate(5px, 5px);
		-o-transform: translate(5px, 5px);
		transform: translate(5px, 5px);
		-webkit-box-shadow: 0px 0px 0px 0px #000 !important;
		-moz-box-shadow: 0px 0px 0px 0px #000 !important;
		box-shadow: 0px 0px 0px 0px #000 !important;
	}
}