@charset "UTF-8";
/* CSS3 Information ===============================
File name:company.css
Description:tokusan
Editor: iju
Date: 2014.10
Contents: *company
================================================ */

#company{
	margin:0;
	padding:0;
	}
/*==================================
page title
====================================*/
#company h3.pc_ttl{
	background-image:url(../img/company/company_ttl.jpg);
	background-repeat:no-repeat;
	background-position:0 0;
	background-size:cover;
	-moz-background-size:cover;
	width:100%;
	max-width:940px;
	height:200px;
	overflow-x:hidden;
	text-indent:-9999px;
	margin-bottom:30px;
	border-radius:20px;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	}
#company .mb_ttl{
	display:none;
	}

/*==================================
page navi(side)
====================================*/
#company .pagenavi{
	width:100%;
	}
#company .pagenavi li{
	width:100%;
	line-height:55px;
	text-align:center;
	font-size:18px;
	font-weight:bold;
	margin-bottom:10px;
	}
#company .pagenavi li a{
	color:#308f40;
	width:100%;
	display:block;
	height:60px;
	box-sizing:border-box;
	border:solid 4px #308f40;
	border-radius:10px;
	-moz-boder-radius:10px;
	}
#company .pagenavi li a:hover{
	color:#fff;
	background:#308f40;
	}

/*==================================
president（社長挨拶）
====================================*/
#company #president{
	width:100%;
	padding-bottom:20px;
	border-bottom:solid 1px #ccc;
	margin-bottom:30px;
	}
#company #president .message{
	width:62.76595744%;
	max-width:590px;
	float:left;
	}
#company #president .message dl{
	width:100%;
	margin-bottom:30px;
	}
#company #president .message dl dt{
	width:50%;
	float:left;
	text-align:left;
	}
#company #president .message dl dt span{
	display:inline-block;
	}
#company #president .message dl dt img{
	width:100%;
	max-width:270px;
	}
#company #president .message dl dd{
	width:50%;
	float:left;
	text-align:left;
	padding-top:15px;
	}
#company #president .message dl dd span{
	display:inline-block;
	}
#company #president .message dl dd img{
	width:100%;
	max-width:275px;
	}
#company #president .message p{
	width:100%;
	text-align:left;
	line-height:1.6em;
	font-size:13px;
	}
#company #president .message p span{
	display:block;
	}
#company #president .photo{
	width:37.23404255%;
	max-width:350px;
	float:right;
	}
#company #president .photo img{
	width:100%;
	max-width:333px;
	}

/*==================================
policy（企業理念）
====================================*/
#company #policy{
	width:100%;
	padding-bottom:20px;
	margin-bottom:30px;
	}
#company #policy .logo{
	width:35%;
	float:left;
	}
#company #policy .logo span{
	width:100%;
	display:block;
	text-align:center;
	}
#company #policy .logo span img{
	width:100%;
	max-width:143px;
	}
#company #policy .policy_con{
	width:65%;
	float:left;
	text-align:left;
	}
#company #policy .policy_con h4{
	width:100%;
	padding-bottom:3px;
	border-bottom:dotted 1px #308f40;
	margin-bottom:10px;
	color:#308f40;
	font-size:22px;
	font-weight:bold;
	}
#company #policy .policy_con p.lead{
	font-size:16px;
	font-weight:bold;
	text-align:left;
	margin-bottom:10px;
	}
#company #policy .policy_con p.lead span{
	display:inline-block;
	}
#company #policy .policy_con p.text{
	font-size:13px;
	text-align:left;
	line-height:1.6em;
	margin-bottom:10px;
	}

/*==================================
action(行動指針)
====================================*/
#company #action{
	width:100%;
	padding-bottom:20px;
	border-bottom:solid 1px #ccc;
	margin-bottom:30px;
	}
#company #action .zukei{
	width:35%;
	float:left;
	}
#company #action .zukei span{
	width:100%;
	display:block;
	text-align:center;
	padding-top:70px;
	}
#company #action .zukei span img{
	width:100%;
	max-width:230px;
	}
#company #action .action_con{
	width:65%;
	float:left;
	text-align:left;
	}
#company #action .action_con h4{
	width:100%;
	padding-bottom:3px;
	border-bottom:dotted 1px #308f40;
	margin-bottom:10px;
	color:#308f40;
	font-size:22px;
	font-weight:bold;
	}
#company #action .action_con dl{
	width:100%;
	text-align:left;
	margin-bottom:10px;
	}
#company #action .action_con dl dt{
	font-size:16px;
	font-weight:bold;
	color:#f60;
	}
#company #action .action_con dl dd{
	font-size:13px;
	line-height:1.6em;
	}

/*==================================
overview
====================================*/
#company #overview{
	width:100%;
	padding-bottom:20px;
	margin-bottom:30px;
	}
#company #overview h4{
	width:100%;
	padding-bottom:3px;
	border-bottom:dotted 1px #308f40;
	margin-bottom:20px;
	color:#308f40;
	font-size:22px;
	font-weight:bold;
	}
#company #overview ul{
	width:100%;
	}
#company #overview ul li.left{
	width:49%;
	margin-right:1%;
	float:left;
	}
#company #overview ul li.right{
	width:49%;
	margin-left:1%;
	float:left;
	}
#company #overview ul li table{
	width:100%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
#company #overview ul li table tr{
	border-bottom:solid 1px #ccc;
	}
#company #overview ul li table th{
	width:25%;
	background:#FFD699;
	text-align:left;
	font-size:14px;
	padding:10px;
	vertical-align:middle;
	}
#company #overview ul li table td{
	width:75%;
	font-size:13px;
	padding:10px;
	line-height:1.6em;
	vertical-align:middle;
	}
#company #overview ul li table td span{
	display:inline-block;
	}

/*==================================
history/inquiry
====================================*/
#company #his_inq{
	width:100%;
	padding-bottom:20px;
	margin-bottom:30px;
	}
#company #his_inq h4{
	width:100%;
	padding-bottom:3px;
	border-bottom:dotted 1px #308f40;
	margin-bottom:20px;
	color:#308f40;
	font-size:22px;
	font-weight:bold;
	}
#company #his_inq #history{
	width:49%;
	margin-right:1%;
	float:left;
	}
#company #his_inq #history table{
	width:100%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	}
#company #his_inq #history table tr{
	border-bottom:solid 1px #ccc;
	}
#company #his_inq #history table th{
	width:25%;
	background:#FFD699;
	text-align:left;
	font-size:14px;
	padding:10px;
	vertical-align:middle;
	}
#company #his_inq #history table td{
	width:75%;
	font-size:13px;
	padding:10px 0px 10px 10px;
	line-height:1.6em;
	vertical-align:middle;
	}
#company #his_inq #history table th span,
#company #his_inq #history table td span{
	display:inline-block;
	}
#company #his_inq #inquiry{
	width:49%;
	margin-left:1%;
	float:left;
	}
#company #his_inq #inquiry ul{
	width:100%;
	text-align:left;
	}
#company #his_inq #inquiry ul li{
	font-size:14px;
	margin-bottom:10px;
	}
#company #his_inq #inquiry ul li span{
	display:inline-block;
	}
#company #his_inq #inquiry ul li.big{
	font-size:22px;
	font-weight:bold;
	color:#f60;
	}
#company #his_inq #inquiry ul li.btn{
	width:100%;
	text-align:center;
	font-size:16px;
	font-weight:bold;
	}
#company #his_inq #inquiry ul li.btn a{
	color:#308f40;
	width:100%;
	display:block;
	box-sizing:border-box;
	border:solid 4px #308f40;
	border-radius:10px;
	-moz-boder-radius:10px;
	padding:10px;
	}
#company #his_inq #inquiry ul li.btn a:hover{
	color:#fff;
	background:#308f40;
	}

/*==================================
accese
====================================*/
#company #access{
	position: relative;
	width:100%;
	padding-bottom:20px;
	margin-bottom:30px;
	}
#company #access h4{
	width:100%;
	padding-bottom:3px;
	border-bottom:dotted 1px #308f40;
	margin-bottom:20px;
	color:#308f40;
	font-size:22px;
	font-weight:bold;
	}
#company #access .map{
	position: relative;
	padding-bottom:56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
	width:100%;
	margin-bottom:15px;
	}
#company #access .map iframe,
#company #access .map object,
#company #access .map embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height:100%;
	}
#company #access .map .mb_tach{
	display:none;
	}
#company #access p{
	font-size:14px;
	text-align:center;
	width:100%;
	}
#company #access p a{
	text-decoration:underline;
	}

#company .access_views{
	width:100%;
	text-align:center;
	}
#company .access_views p{
	width:100%;
	font-size:13px;
	text-align:left;
	margin-bottom:10px;
	color:#308f40;
	}
#company .access_views .flexslider ul li span{
	width:100%;
	font-size:11px;
	padding:10px 0;
	line-height:1em;
	}




/*====================
responsive(company)
=====================*/
@media only screen and (min-width:1280px) {
	/*=================================()*/
	}

@media only screen and (max-width: 1279px) {
	/*=================================(president)*/
	#company #president .message dl{
		margin-bottom:15px;
		}
	#company #president .message dl dt{
		width:100%;
		float:none;
		}
	#company #president .message dl dd{
		width:100%;
		float:none;
		}
	#company #president .message p{
		width:90%;
		}
	#company #president .message p span{
		display:inline;
		}
	/*=================================(overview)*/
	#company #overview ul li.left{
		width:100%;
		margin-right:0;
		float:none;
		}
	#company #overview ul li.right{
		width:100%;
		margin-left:0;
		float:none;
		}
	#company #overview ul li table th{
		width:20%;
		}
	#company #overview ul li table td{
		width:80%;
		}
	/*=================================(history/inquiry)*/
	#company #his_inq #history{
		width:100%;
		margin-right:0;
		float:none;
		margin-bottom:20px;
		}
	#company #his_inq #history table th{
		width:20%;
		}
	#company #his_inq #history table td{
		width:80%;
		}
	#company #his_inq #inquiry{
		width:100%;
		margin-left:0;
		float:none;
		}
	#company #his_inq #inquiry ul li,
	#company #his_inq #inquiry ul li.btn{
		width:50%;
		float:left;
		}
	}

@media only screen and (max-width: 1100px) {
	/*=================================(president)*/
	#company #president .photo{
		padding-top:30px;
		}
	/*=================================(policy)*/
	#company #policy .policy_con p.lead span{
		display:inline;
		}
	}

@media only screen and (max-width:1024px) {
	/*=================================(president)*/
	#company #president .photo{
		padding-top:60px;
		}
	#company #action .zukei span img{
		max-width:200px;
		}
	}

@media only screen and (max-width: 900px) {
	/*=================================(contents)*/
	#company{
		padding-top:2px;
		}
	/*=================================(ttl)*/
	#company h3.pc_ttl{
		display:none;
		}
	#company .mb_ttl{
		display:block;
		background:#308f40;
		}
	#company .mb_ttl h3{
		background-image:url(../img/company/company_ttl.jpg);
		background-repeat:no-repeat;
		background-position:0 0;
		background-size:cover;
		-moz-background-size:cover;
		width:100%;
		height:200px;
		overflow-x:hidden;
		text-indent:-9999px;
		}
	/*=================================(pagenavi)*/
	#company .pagenavi li{
		width:48%;
		margin:0 1% 10px 1%;
		float:left;
		font-size:16px;
		}
	/*=================================(policy)*/
	#company #policy .logo span{
		padding-top:20px;
		}
	/*=================================(access)*/
	#company #access .map .mb_tach{
		display:block;
		position: absolute;
		top:0;
		right:0;
		width:10%;
		height:100%;
		background:#308f40;
		opacity:.8;
		}
	#company #access p a{
		text-decoration:none;
		}
	}

@media only screen and (max-width:768px) {
	/*=================================(president)*/
	#company #president{
		width:100%;
		margin-bottom:20px;
		}
	#company #president .message{
		width:100%;
		max-width:100%;
		float:none;
		}
	#company #president .message dl dt,
	#company #president .message dl dd{
		text-align:center;
		}
	#company #president .photo{
		width:100%;
		max-width:100%;
		float:none;
		}
	#company #president .message p{
		width:100%;
		}
	#company #president .photo{
		padding-top:20px;
		text-align:center;
		}
	}

@media only screen and (max-width:740px) {
	/*=================================(policy)*/
	#company #policy .logo{
		width:100%;
		float:none;
		text-align:center;
		margin-bottom:20px;
		}
	#company #policy .policy_con{
		width:100%;
		float:none;
		text-align:left;
		}
	#company #policy .policy_con h4{
		text-align:center;
		margin-bottom:20px;
		}
	#company #policy .policy_con p.lead{
		text-align:center;
		}
	#company #policy .policy_con p.lead span{
		display:block;
		}
	/*=================================(action)*/
	#company #action .zukei{
		width:100%;
		float:none;
		margin-bottom:20px;
		}
	#company #action .zukei span{
		padding-top:0px;
		}
	#company #action .action_con{
		width:100%;
		float:none;
		}
	#company #action .action_con h4{
		text-align:center;
		margin-bottom:20px;
		}
	/*=================================(overview)*/
	#company #overview{
		margin-bottom:20px;
		}
	#company #overview h4{
		text-align:center;
		}
	/*=================================(history/inquiry)*/
	#company #his_inq{
		margin-bottom:20px;
		}
	#company #his_inq h4{
		text-align:center;
		}
	/*=================================(accese)*/
	#company #access{
		margin-bottom:20px;
		}
	#company #access h4{
		text-align:center;
		}
	}

@media only screen and (max-width:640px) {
	/*=================================(ttl)*/
	#company .mb_ttl h3{
		height:150px;
		}
	/*=================================(policy)*/
	#company #policy{
		padding-bottom:10px;
		}
	#company #policy .logo span{
		padding-top:0px;
		}
	#company #policy .policy_con h4{
		margin-bottom:15px;
		font-size:16px;
		}
	#company #policy .policy_con p.lead{
		text-align:left;
		font-size:14px;
		}
	#company #policy .policy_con p.lead span{
		display:inline;
		}
	/*=================================(action)*/
	#company #action{
		padding-bottom:10px;
		}
	#company #action .action_con h4{
		font-size:16px;
		margin-bottom:15px;
		}
	#company #action .action_con dl dt{
		font-size:14px;
		margin-bottom:5px;
		}
	/*=================================(overview)*/
	#company #overview{
		padding-bottom:10px;
		}
	#company #overview h4{
		font-size:16px;
		margin-bottom:15px;
		}
	#company #overview ul li table th{
		width:30%;
		font-size:13px;
		}
	#company #overview ul li table td{
		width:70%;
		}
	/*=================================(history/inquiry)*/
	#company #his_inq{
		padding-bottom:10px;
		}
	#company #his_inq h4{
		font-size:16px;
		margin-bottom:15px;
		}
	#company #his_inq #history table th{
		width:30%;
		font-size:13px;
		}
	#company #his_inq #history table td{
		width:70%;
		}
	#company #his_inq #inquiry ul li{
		font-size:13px;
		margin-bottom:10px;
		width:100%;
		float:none;
		}
	#company #his_inq #inquiry ul li.big{
		font-size:16px;
		color:#f60;
		}
	#company #his_inq #inquiry ul li.btn{
		width:100%;
		font-size:14px;
		}
	/*=================================(accese)*/
	#company #access h4{
		font-size:16px;
		margin-bottom:15px;
		}
	#company #access .map .mb_tach{
		width:20%;
		}
	}

@media only screen and (max-width:480px) {
	/*=================================(ttl)*/
	#company .mb_ttl h3{
		height:110px;
		}
	/*=================================(pagenavi)*/
	#company .pagenavi li{
		font-size:14px;
		}
	/*=================================(president)*/
	#company #president .message dl dt img{
		width:250px;
		}
	/*=================================(policy)*/
	#company #policy .logo span img{
		width:110px;
		}
	}

@media only screen and (max-width:400px) {
	/*=================================()*/
	}

@media only screen and (max-width:320px) {
	/*=================================(pagenavi)*/
	#company .pagenavi li{
		font-size:13px;
		line-height:35px;
		}
	#company .pagenavi li a{
		height:38px;
		border:solid 2px #308f40;
		border-radius:5px;
		-moz-boder-radius:5px;
		}
	}

/*====================
responsive(company)height
=====================*/
@media only screen and (max-height: 800px) {
	/*=================================()*/
	}