@charset "UTF-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(https://fonts.googleapis.com/css?family=Lato:400,700);
/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:normal;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
/*================================================
 *  フェードアウト
 ================================================*/
body {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
/*================================================
 *  一般・共通設定
 ================================================*/
body {
	font-family: Lato, "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 14px;
}
.clear {
	clear: both;
}
.txtleft {
	text-align: left;
}
.center {
	text-align: center;
}
.minwidth {
	min-width: 960px;
	width: 960px;
	margin: 0 auto;
}
h2 {
	padding: 1em 0;
}
h3 {
	text-align: center;
	padding: 2em 0;
}
.pdng1em {
	padding: 1em 0;
}
.pdng2em {
	padding: 2em 0;
}
h4 {
	font-weight: bold;
	font-size: 15px;
	border-bottom: 1px solid #000;
	padding: 0.5em;
	text-align: center;
}
.imgsize2 img {
	max-width: 100%;
}
.sphidden {
	display: block;
}
.pchidden {
	display: none;
}
.borderNone {
	border: none;
}
.sp {
    display: none;
}
.pc {
    display: block;
}

/*================================================
 *  ナビゲーション
 ================================================*/
#nav {
	overflow: hidden;
	border-top: solid 1px #00A23E;
	width:100%;
}
#nav li {
	float:left;
	list-style:none;
	text-align: center;
}
#spheader {
	display: none;
}
.navsub {
	position: absolute;
	background-image: url('../images/pc/white.png');
	display: none;
}
#nav ul li > ul li {
	float: none;
}
#layerMenu {
	display: none;
}
/* スマートフォン */
#splogo {
	position: absolute;
	left: 0;
	top:0;
	padding: 0.5em;
}
#menuIcon {
	position: absolute;
	left: 0;
	top: 0;
	padding: 0.5em;
}
#openMenuTB,
#closeMenu,
#openMenu {
	position: absolute;
	right: 0;
	top: 0;
	padding: 0.5em;
}
#layerMenu {
	display: none;
	background: #fff;
	position: absolute;
	right: 0;
	top: 0;
}
.LayerMenuIcon {
	margin-top: 110px;
}

/*================================================
 *  TOP
 ================================================*/
.topimg {
	min-width: 1020px;
	width: 1020px;
	margin: 0 auto;
	text-align: center;
	padding-bottom: 1em;
}
.sptopimg {
	display: none;
}
.topicon {
	padding: 1em 0;
}
#main {
	min-width: 720px;
	width: 720px;
	margin: 3em auto;
}

.news {
	padding: 0.5em 0;
	border-top: 1px solid #b3b3ab;
	border-bottom: 1px solid #b3b3ab;
	height: 150px;
	overflow: scroll;
	overflow-x: hidden;
	width: 100%;
	color: #868679;
}
.news ul li {
	padding: 10px;
}
.news ul li a {
	color: #868679;
}
.news ul li a:hover,
.news ul li:hover {
	color: #00a23e;
}
.news ul li p {
	float: left;
	padding-right: 1em;
}
.welcome img {
	padding: 2em 0;
}
.reason {
	margin-bottom: 3em;
	border-top: 1px solid #b3b3ab;
}
.reason ul li {
	border-bottom: 1px solid #b3b3ab;
	padding: 1em 0;
	height: 190px;
}
.left {
	float: left;
	width: 210px;
}
.right {
	margin-left: 230px;
}
.right dt {
	padding-bottom: 1em;
}
.right dd {
	padding-left: 2em;
}
/*================================================
 *  会社案内
 ================================================*/
.message p {
	padding-bottom: 1em;
}
.message {
	line-height: 1.5em;
}
.philosophy {
	width: 580px;
	margin: 2em auto;
}
.philosophy p {
	margin: 1em 0;
	line-height: 1.5em;
}
.philosophy2 {
	margin: 3em;
}
.philosophy2 p {
	text-align: center;
	margin: 3em 0;
}
.philosophy ul li {
	margin-left: 14px;
	line-height: 1.5em;
	margin-top: 1em;
	margin-bottom: 1em;
}
.philosophy li:before {
	content: '〇';
	margin-left: -14px;
}
.philosophy span {
	font-weight: bold;
}
.history,
.overview {
	line-height: 2em;
	padding-top: 1em;
	padding-bottom: 2em;
}
.history dl,
.overview dl {
	clear: both;
}
.history dl dt,
.overview dl dt {
	float: left;
	display: flex;
	justify-content: space-between;
}
.history dl dt {
	width: 160px;
}
.overview dl dt {
	width: 100px;
}
.history dl dd {
	margin-left: 160px;	
}
.overview dl dd {
	margin-left: 100px;	
}
.overview dl dd {
	padding-left: 2em;
}
.ggmap {
	text-align: center;
	margin: 3em 0;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
	width: 400px;
	height: 270px;
}
/*================================================
 *  事業内容
 ================================================*/
.business {
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	min-height: 100%;
	overflow: hidden;
	margin: 3em 0;
	padding: 1em 0;
}
.business dl dt {
	float: left;
	width: 290px;
}
.business dl dd {
	margin-left: 290px;
	padding-top: 3em;
}
.business li:before {
	content: '■';
	padding-right: 0.5em;
}
.business dl dd ul li {
	line-height: 1.5em;
}
.business ul li > ul li:before {
	content: '－';
	margin-left: 1em;
}
/*================================================
 *  採用情報
 ================================================*/
.recruit ul li {
	width: 50%;
	float: left;
	text-align: center;
}
.recruit>h2 {
	font-size: 1.5em;
	padding-bottom: 0.5em;
	border-bottom: 2px dotted #000;
}
.recruit table {
	width: 98%;
	margin: 1em auto;
}
.recruit table tr,
.recruit table th,
.recruit table td {
	border: 1px solid #000;
	height: 3em;
	padding: 1em;
	vertical-align: middle;
}
.recruit table th {
	width: 20%;
	background-color: #C2E0BB;
}
.recruit table td {
	width: 80%;
}
/*================================================
 *  お問い合わせ
 ================================================*/
.contact {
	background: #eee;
	color: #858579;
	padding: 3em;
	width: 500px;
	margin: 0 auto;
}
.contact textarea,
.contact input[type="email"],
.contact input[type="tel"],
.contact input[type="number"],
.contact input[type="text"] {
	width: 100%;
}
.contact input[type="reset"],
.contact input[type="submit"] {
	margin: 0 1em;
	width: 80px;
	border: solid 1px #858579;
	background: #fff;
}

.contact dl {
	clear: both;
	padding-bottom: 1em;
}
.contact dl dt {
	float: left;
	width: 90px;
}
.contact dl dd {
	margin-left: 90px;
}
.contact textarea {
	height: 130px;
}
/*================================================
 *  プライバシーポリシー
 ================================================*/
.privacy {
	width: 580px;
	margin: 0 auto 3em auto;
}
.privacy h3 {
	border-bottom: 1px solid #000;
}
.privacy p {
	padding: 1em 0;
	line-height: 1.5em;
}
/*================================================
 *  薩摩ハム
 ================================================*/
.ham p {
	margin: 2em 0;
	text-align: center;
}
.ham ul {
	margin: 2em 0;
}
.ham ul li {
	float: left;
	width: 50%;
	text-align: center;
}
/*================================================
 *  九州高原牧場
 ================================================*/
.farm {
	margin: 3em 0;
	text-align: center;
}
.farm p {
	margin: 2em 0;
}
.farm2 p {
	padding: 1em 0;
	line-height: 1.5em;
}
/*================================================
 *  フッター
 ================================================*/
#footer ul li {
	float: left;
}
#footer p {
	margin: 1em;
}
.address {
	border-top: 1px solid  #00A23E;
	line-height: 1.5em;
	padding-top: 1em;
}
.copyright {
	background: #b6c759;
	color: #fff;
	padding: 0.5em;
	margin-bottom: 2em;
}
.totop {
	position: fixed;
	bottom: 0;
	width: 100%;
	background: #7fcba1;
	color: #fff;
}
.totop a {
	color: #fff;
	text-decoration: none;
	display: block;
	padding: 0.5em 0;
}