@charset "UTF-8";


/* main */

body {
	width:100%;
	height:auto;
	padding: 0;
	margin: 0;
	background-size: cover;
	font-family: 'Oxygen', sans-serif;
	color: #000;
	text-align: center;
	-moz-background-size:cover;
	-moz-osx-font-smoothing: grayscale;
}

.jp {
	font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",Meiryo,"メイリオ","游ゴシック" ,Osaka,"MS PGothic",sans-serif;
	font-weight: bold;
	float: none;
	padding: 0;

}


#wrap {
	/* width:1024px; */
	height:auto;
    letter-spacing: 0.04em;
	overflow: hidden;
}
.box {
    overflow: hidden;
	zoom: 1;
}
.box h1#logo {
	padding: 5% 0 0;
	margin: 0 auto;
	text-align: center;
}
.box h1#logo img {
	width: 50%;
	max-width: 290px;
}
.box p#mlogo img {
	max-width: 120px;
}
.box #marche {
	position: absolute;
	top: 30px;
	right: 40px;
}
.box #marche p {
	margin: 0 0 8%;
	padding: 0;
	font-size: 85%;
}
.box #marche p a {
	padding: 0 5% 0 15%;
}
.box #marche p a:hover {
	opacity: 0.5;
	transition: 150ms ease-out 0s;
}
.box p.txt {
	letter-spacing: 0.13em;
	font-size: 20px;
	margin: 0;
}
.box p.txt span {
	letter-spacing: 0.13em;
	font-size: 16px;
	display: block;
}
.box p.txt_sub {
	letter-spacing: 0.13em;
	font-size: 16px;
	margin: 20px 0 15px;
}
.box p.txt img {
	width: 50%;
	max-width: 504px;
}
.box #webshop {
	padding: 96px 0 0;
    letter-spacing: 0.15em;
}
.box #webshop a {
	transition: 150ms ease-out 0s;
	border-bottom: 2px solid #000;
	padding: 0 0 0.3% 1.5%;
	font-size: 110%;
}
.box #webshop a.hifood{
	border-bottom: none;
	padding: 0 0 3% 0;
	font-size: 110%;
	display: inline-block;
}
.box #webshop a.normal{
	border-bottom: none;
}
.box #webshop a:hover {
	opacity: 0.5;
	transition: 150ms ease-out 0s;
}
.box #contact {
	padding: 72px 0 ;
    letter-spacing: 0.15em;
}
.box #contact a {
	transition: 150ms ease-out 0s;
	padding: 0;
	font-size: 15px;
	border-bottom: 2px solid #000;
	padding-bottom: 0.3%;
}
.box #contact a:hover {
	opacity: 0.5 ;
	transition: 150ms ease-out 0s;
}



footer {
	margin: 0;
	padding: 0 0 6%;
	width:100%;
}
footer h1 {
	padding: 0 0 0.5%;
	margin: 0;
	font-size: 90%;
}
address {
	margin: 0 auto;
	padding: 0 0 2%;
	font-style: normal;
	font-size: 75%;
	width: 498px;
	letter-spacing: 0.1em;
	text-align: center;
}
address span {
	display: block;
	padding: 0 1%;
	/*float: left;*/
}
address span.jp {
	display: inline;
	padding: 0;
	float: none;
}
small {
	color: #000;
	font-size: 0.7em;
}
#contents {
	margin: 3% 0 0;
	padding: 0;
}



a.bl {
 	background: url("../images/icon_blank.png") no-repeat left center;
	background-size: 8px;
 }



 /* 事務所移転 */
.itenbn {
	padding: 2% 0 6%;
	letter-spacing: 0.1em;
}
.itenbn a {
	transition: 150ms ease-out 0s;
	border: 2px solid #000;
	padding: 1.1% 1.5% 1% 3.1%;
	font-size: 100%;
	background: url("../images/icon_blank.png") no-repeat 13px center;
	background-size: 8px;
}
.itenbn a:hover {
	opacity: 0.5 ;
	transition: 150ms ease-out 0s;
}
.moving2018{margin: 90px auto;}
.moving2018 a:hover{opacity: 0.75;}
.moving2018 img{width: 190px;}



@media screen and ( max-width:800px ) {
	address {
		width: auto;
		text-align: center;
	}
	address span {
		display: block;
		padding: 0;
		float: none;
	}
}


@media screen and ( max-width:600px ) {
	body {
		font-size: 0.8em;
		min-width: 320px;
	}
	.box h1#logo {
		padding: 15% 0 0;
		margin: 0 auto;
		text-align: center;
	}
	.box h1#logo img {
			width: 231px;
	}
	.box p.txt img {
		width: 310px;
	}
	.box #contact {
		padding: 80px 0 65px;
	}
	#contents {
		margin: 100px 3% 3%;
	}
	address img {
		width: 310px;
	}
	.box #webshop a {
		transition: 150ms ease-out 0s;
		border-bottom: 2px solid #000;
		padding: 0 0 0.3% 3.5%;
		font-size: 110%;
	}
	.itenbn a {
		transition: 150ms ease-out 0s;
		border: 2px solid #000;
		padding: 2.6% 3.2% 2% 7%;
		font-size: 100%;
		background: url("../images/icon_blank.png") no-repeat 9px center;
		background-size: 8px;
	}
	.box #webshop a {display: block;}
	.box #webshop a.normal:nth-child(2){margin: 45px 0;}
	footer{padding: 0 20px 6%;box-sizing: border-box;}
	footer h1{font-size: 14px;}
	footer address{font-size: 11px;}
}






/* link */

a:link,
a:active {
	text-decoration: none;
	color: #000;
}

a:hover,
a:visited {
	text-decoration: none;
	color: #000;
}
