@charset "utf-8";
/* =======================================

	Structure CSS

 -----------------------------------------
	INDEX
 -----------------------------------------
 	1.all
	2.header
	3.gNavi
	4.contents
	5.pageTop
	6.footer

========================================== */

body {
	background: #fff;
	color: #333;
	line-height: 1.8;
	min-width: px;
}
article {
	max-width: 1200px;
	margin: 0 auto 60px;
}

@media screen and (max-width:1300px) {
	article {	margin: 0 20px 30px;}
}

a {
	color: #06c;
	text-decoration: none;
}
footer #footerLinks a {	color: #333;}

a:hover {	text-decoration: underline;}

/* ふわっとコンテンツ表示JS
========================================== */
.list {
	overflow: hidden;
}
.list div {
	transition: .9s;
}
.list-mv07 {
	opacity: 0;
	transform: translate(0, 60px);
	-webkit-transform: translate(0, 60px);
	margin-bottom: 50px;
}
.mv07 {
	opacity: 1.0;
	transform: translate(0, 0);
	-webkit-transform: translate(0, 0);
}

/* 1.all
---------------------------------------------------------- */
.smf700 {	display: none;}

@media screen and (max-width:700px) {
	.pc700 {	display: none;}
	.smf700 {	display: block;}
}
.detailLink {
	max-width: 150px!important;
	margin: 20px auto 0!important;
}

/* 2.header
---------------------------------------------------------- */
#header {
	background: url(../../images/common/bg-05.png) repeat-x 0 100%;
	margin-bottom: 30px;
}
#home #header {	margin-bottom: 60px;}
#headerInner {
	background: url(../../images/common/bg-04.png) no-repeat 50% 100%;
	padding-bottom: 9px;
}
#logoWrap {
	margin: 0 auto 10px;
	max-width: 1050px;
}
#logoWrap_inner {	overflow: hidden;}
#headerLogo {
	max-width: 350px;
	float: left;
}
#logoWrap p {
	max-width: 350px;
	float: right;
}

@media screen and (max-width:700px) {
	#header {	margin-bottom: 0;}
	#home #header {	margin-bottom: 35px;}
	#headerInner {
		background: none;
		padding-bottom: 0;
	}
	#headerLogo {
		max-width: 350px;
		width: 50%;
	}
	#logoWrap {
		background: url(../../images/common/logo-04.png) no-repeat 0 100% /100%;
		padding-bottom: 50px;
		margin: 0;
	}
	#logoWrap p {
		max-width: 303px;
		width: 43%;
	}
}

@media screen and (max-width:600px) {
	#logoWrap {padding-bottom: 40px;}
}
@media screen and (max-width:500px) {
	#logoWrap {padding-bottom: 34px;}
}


/* 3.gNavi
---------------------------------------------------------- */
#menu-box {	clear: both;}
#toggle {	display: none;}
#menu-box ul {
	max-width: 1060px;
	margin: auto;
	font-size: 0;
}
#menu-box ul li {
	font-size: 15px;
	display: inline-block;
	margin: 16px 0;
	border-right: 1px solid #ccc;
}
#menu-box ul li:last-child {	border: none;}
#menu-box ul li:hover {	opacity: 0.7;}
#menu-box ul li a {
	text-indent: -9999px;
	display: block;
	max-height: 26px;
}
#menu-box ul li#gNav01 {
	background: url(../../images/common/nav-01.png) no-repeat 50% 50% /contain;
	width: 16.7%;
}
#menu-box ul li#gNav02 {
	background: url(../../images/common/nav-02.png) no-repeat 50% 50% /contain;
	width: 16.6%;
}
#menu-box ul li#gNav03 {
	background: url(../../images/common/nav-03.png) no-repeat 50% 50% /contain;
	width: 16.6%;
}
#menu-box ul li#gNav04 {
	background: url(../../images/common/nav-04.png) no-repeat 50% 50% /contain;
	width: 16.6%;
}
#menu-box ul li#gNav05 {
	background: url(../../images/common/nav-05.png) no-repeat 50% 50% /contain;
	width: 16.6%;
}
#menu-box ul li#gNav06 {
	background: url(../../images/common/nav-06.png) no-repeat 50% 50% /contain;
	width: 16.6%;
}

@media only screen and (max-width: 700px) {
	#menu {	display: none;}
	#menu-box ul li {
		width: 100%;
		border: none;
		margin: 0;
	}
	#menu-box ul li#gNav01, #menu-box ul li#gNav02,
	#menu-box ul li#gNav03, #menu-box ul li#gNav04,
	#menu-box ul li#gNav05, #menu-box ul li#gNav06,
	#menu-box ul li#gNav07, #menu-box ul li#gNav08 {
		background: url(../../images/common/bg-01s.png) no-repeat 50% 100%;
		width: 100%;
	}
	#menu-box ul li a {
		text-indent: 0;
		margin-bottom: 10px;
		font-size: 15px;
		color: #000;
	}
	#menu-box ul li a:first-child {	margin-top: 10px;}
	#toggle {
		display: block;
		position: relative;
		width: 100%;
		background: #999999;
	}
	#toggle a {
		background: url(../../images/common/toggle.png) no-repeat 10px 50% /auto 70%;
		display: block;
		position: relative;
		padding: 12px 0;
		color: #ccc;
		text-align: center;
		text-decoration: none;
	}
}

/* 4.contents
---------------------------------------------------------- */
.mainBody {}
.mainBody .pageTitle {			max-width: 165px;}
#alcohol .mainBody .pageTitle {	max-width: 248px;}
#company .mainBody .pageTitle, #hapiie .mainBody .pageTitle {
	margin: 0 auto 60px;
}
#concept .mainBody .pageTitle {
	margin: 0 auto 40px;
}
.mainBody p {	margin-bottom: 30px;}

/* 5.pageTop
---------------------------------------------------------- */
#pagetop {
	position: fixed;
	right: 10%;
	bottom: 10%;
	opacity: 0;
	-ms-filter: "alpha( opacity=0 )";
	filter:alpha(opacity:0);
	zoom: 1;
	z-index: 9999;
}
#pagetop a {
	display: block;
	padding: 20px;
	background: url(../../images/common/btn-01.png) no-repeat 0 0 /contain;
	text-indent: -9999px;
	height: 50px;
	width: 50px;
}

/* 6.footer
---------------------------------------------------------- */
#footer {
	background: url(../../images/common/bg-08.png) repeat-x 0 0;
	clear: both;
}
#footerIn {
	margin: 0 auto;
	padding-top: 45px;
	max-width: 1200px;
	text-align: center;
}
.footBody {
	float: right;
	width: 1200px;
	margin: 0 0 25px 0px;
}
.footBody p {	margin-bottom: 15px;}
.footBody p img {
	max-width: 350px;
}
.footBody .address {
	margin-bottom: 30px;
}
.footBody .address p {
	line-height: 1.5;
	margin-bottom: 0;
}
.footBody li {
	display: inline-block;
}
.footBody li img {
	max-width: 31px;
	margin-right: 10px;
}
#footerLinks {
	margin-left: 390px;
	margin-bottom: 25px;
}
#footerLinks li {
	background: url(../../images/common/ico-dot.png) no-repeat 0 50%;
	list-style: none;
	padding: 0 0 0 20px;
	margin-left: 40px
}
#copyright {
	background: url(../../images/common/bg-line.png) no-repeat 50% 0;
	text-align: center;
	clear: both;
	padding: 15px 0;
}

@media screen and (max-width:700px) {
#footerIn {	background: none;}
#copyright {	background: url(../../images/common/bg-01s.png) no-repeat 50% 0 /contain;}
}
@media screen and (max-width:600px) {
	#footer {}
	#footerIn {	margin: 0 20px;}
	.footBody {
		float: none;
		width: 100%;
		border-right: none;
		margin: 0;
	}
	#footerLinks {	margin: 40px 0;}
	#footerLinks li {	margin-left: 0;}
}