@charset "utf-8";


/************************************************************
	共通設定
*************************************************************/
a { -webkit-tap-highlight-color:rgba(0, 0, 0, 0)!important; } 

/*.mm-menu {
    -webkit-overflow-scrolling: auto;
}*/

/************************************************************
	display設定
*************************************************************/
#page nav {
	display: none;
}

	@media all and (min-width: 768px){
		div.hdNav {
			display: block !important;
		}
		/* mmenu 開閉 非表示 */
		header#mmenu{
			display: none;
		}
	}
	@media screen and (max-width: 767px){
		div.hdNav nav {
			display: none !important;
		}
	}


/********************************************************
	ヘッダー
*********************************************************/

	/********************************************************
		jQuery.mmenu CSS // Mobile
	*********************************************************/
	@media only screen and (max-width: 767px){
		/* 基本設計
		------------------------------------------------------------*/
		/* jquery.mmenu.all.css */	

		/* 開閉メニュー
		------------------------------------------------------------*/
		header#mmenu {
			z-index: 200;
			width: auto;
			background: none;
			position: fixed;
			bottom: 0;
			top: inherit;
			background: #2E1A14;
			width: 100%;
		}
		header#mmenu a {
			font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
			display: block;
			width: 100%;
			text-decoration: none;
			color: #FFF;
			text-align:center;
			font-size: 1rem;
			padding:0.5rem 0;
			border-right:1px dotted #FFF;
		}
		header#mmenu ul.mm-listview {
			background: #F7F7F2;
		}
		header#mmenu > ul > li:last-of-type a {
			border-right:none;
		}
		header#mmenu a:before {
			font-size: 2.5rem;
			display:block;
		}
		header#mmenu > ul > li:nth-of-type(1) a:before { content: "\f015";}
		header#mmenu > ul > li:nth-of-type(2) a:before { content: "\f0c9";}
		header#mmenu > ul > li:nth-of-type(3) a:before { content: "\f07a";}
		header#mmenu > ul > li {
			float: left;
			width: 33.33%;
		}
		header#mmenu > ul > li:nth-of-type(3) {
			background:#61881E;
		}
		nav#menu ul > li {
			/*border-bottom: 1px dashed #CCC;*/
			background: #F7F7F2;
			float: left;
			text-align: center;
		}
		nav#menu ul > li:last-of-type {
			border-bottom:  none;
		}

		nav#menu ul > li.title {
			width: 100%;
			background: #61881E;
			text-align: center!important;
			color: #FFF;
		}

		nav#menu ul > li.main {
			width: 33.33%;
			height: 12rem;
		}
		nav#menu ul > li.main a > img {
			width: 100px;
		}

		nav#menu ul > li.sub {
			width: 20%;
			height: 11rem;
		}
		nav#menu ul > li.sub a > img {
			width: 50px;
		}
		nav#menu ul > li.category {
			text-align: left;
			padding: 0 0 0 1rem;
			box-sizing: border-box;
		}
		nav#menu ul > li.category.unbaked ,
		nav#menu ul > li.category.baked ,
		nav#menu ul > li.category.gift {
			width: 33.33%;
		}
		nav#menu ul > li.category.tea ,
		nav#menu ul > li.category.season {
			width: 50%;
		}
		nav#menu ul > li.category a:before {
			content:"\f0da"
		}

		nav#menu ul > li.function {
			width: 50%;
			text-align: left;
			padding: 0 0 0 1rem;
			box-sizing: border-box;
			background: #071209;
		}
		nav#menu ul > li.function a {
			color:#FFF;
		}
		nav#menu ul > li.function a:before {
			content:"\f0da"
		}

		nav#menu ul > li a {
			color: #1F1813;
			padding: 1.5rem 0.3rem;
		}
		nav#menu ul > li a > img {
			width: 50px;
			vertical-align: middle;
			margin-bottom: 0.5rem;
		}
		nav#menu ul > li a > span {
			padding: 0;
			vertical-align: middle;
			font-size: 0.9rem;
			display: block;
			line-height: 1.2;
		}

		/* Icon
		------------------------------------------------------------*/
		.mm-navbar-bottom a:before {
			margin-right: 0.4em;
			font-family: FontAwesome;
			font-style: normal;
			font-weight: normal;
			line-height: 1;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			content: "\f07a";
		}

		/* Theme Black 文字色（テーマ上書き）
		------------------------------------------------------------*/
		.mm-menu.mm-theme-black { color: rgba(255, 255, 255, 1) !important; background-color:#071209!important;} /* default 0.6 */
		.mm-menu.mm-theme-black .mm-navbar > *, .mm-menu.mm-theme-black .mm-navbar a { color: rgba(255, 255, 255, 1) !important;} /* default 0.4 */
		.mm-menu.mm-theme-black em.mm-counter { color: rgba(255, 255, 255, 1) !important;} /* default 0.4 */
		.mm-menu.mm-theme-black .mm-listview > li .mm-prev::before, .mm-menu.mm-theme-black .mm-listview > li .mm-next::after, .mm-menu.mm-theme-black .mm-listview > li .mm-arrow::after { border-color: rgba(25, 79, 22, 1) !important;} /* default 0.4 */
	}

/*****************************************************
    ヘッダー 
*****************************************************/
header {
	width:100%;
	line-height:1.6;
	position:fixed;
	top:0;
	z-index:100;
	background-color:rgba(255,255,255,0.5);
}
header .inner {
    box-sizing: border-box;
	padding:1rem 0 0;
	position:relative;
}
	.hdLogo {
		width:123px;
		float:left;
		margin-right: 2rem;
	}
		.hdLogo a {
		}
			.hdLogo a img {
			}
	.hdNav {
	}
		.hdNav .hdNav-desc {
			font-size:1.2rem;
			float:left;
		}
		.hdNav .hdNav-subNav {
			font-size:1.2rem;
			float:right;
		}
			.hdNav .hdNav-subNav > ul > li {
				float: left;
				margin-right: 1rem;
			}
			.hdNav .hdNav-subNav > ul > li:last-of-type {
				margin-right: 0;
			}
				.hdNav .hdNav-subNav > ul > li a:before {
					margin-right: 0.5rem;
					content:"\f138";
				}
		.hdNav .hdNav-globalNav {
			float: left;
		}
			.hdNav .hdNav-globalNav > ul > li {
				float: left;
			}
				.hdNav .hdNav-globalNav > ul > li > a  {
					text-align: center;
					padding: 2.6rem 0;
					display: block;
					line-height: 1.8;
					font-weight: bold;
				}
					.hdNav .hdNav-globalNav > ul > li > a > p {
						padding: 2rem 2.7rem;
						border-left: 1px solid #EAE8E7;
					}
					.hdNav .hdNav-globalNav > ul > li:last-of-type > a > p {
						border-right: 1px solid #EAE8E7;
					}
						.hdNav .hdNav-globalNav > ul > li > a > p > span {
							font-size:1rem;
							display:block;
						}
	.hdInfo {
		width:340px;
		float:right;
		margin-left: 2rem;
	}
	.hdInfo .hdInfo-ship {
		text-align: center;
		border-top: 1px solid #666;
		border-bottom: 1px solid #666;
		padding: 1rem 0 0.5rem;
		font-size: 2rem;
		font-weight: bold;
		margin-bottom: 0.5rem;
		line-height: 1;
	}
		.hdInfo .hdInfo-ship > span {
			font-size:1.4rem;
			margin-right:0.5rem;
		}
	.hdInfo .hdInfo-contact {
	}
		.hdInfo .hdInfo-contact > div {
			float:left;
		}
			.hdInfo .hdInfo-contact .hdInfo-contact-hours {
				font-size: 1.1rem;
			}
			.hdInfo .hdInfo-contact .hdInfo-contact-tel {
				font-size:3.4rem;
				line-height: 1;
			}
		.hdInfo .hdInfo-contact .btnContact {
			float: right;
			width: 116px;
			margin: 0.5rem 0;
			padding: 1rem 0;
			font-size:1.2rem;
		}
	.hdInfo .hdInfo-btn {
	}
		.hdInfo .hdInfo-btn .btn {
			width:165px;
			margin: 1rem 0;
			font-size:1.2rem;
			display:block;
		}
		.hdInfo .hdInfo-btn .btnLogin {
			float: left;
		}
		.hdInfo .hdInfo-btn .btnBasket {
			float: right;
		}
	@media only screen and (max-width: 1199px) {
	header .inner {
		max-width: 1000px;
	}
		.hdNav .hdNav-desc ,
		.hdInfo .hdInfo-contact {
			display:none;
		}
		.hdLogo {
			width:auto;
		}
			.hdLogo a {
			}
				.hdLogo a img {
					width: 80px;
				}
		.hdNav {
			float: left;
		}
			.hdNav .hdNav-subNav {
				float: none;
			}
				.hdNav .hdNav-subNav > ul > li {
					margin-right: 2rem;
				}
			.hdNav .hdNav-globalNav {
				margin-top: 1rem;
			}
				.hdNav .hdNav-globalNav > ul > li > a {
					padding: 1rem 0;
					font-size: 1.2rem;
				}
					.hdNav .hdNav-globalNav > ul > li > a > p {
						padding: 1.5rem 1.7rem;
					}
					.hdNav .hdNav-globalNav > ul > li > a > p > span {
						display: none;
					}
		.hdInfo {
			width: auto;
			margin-left: 1rem;
		}
			.hdInfo .hdInfo-btn .btn {
				width: 150px;
				margin: 1rem 0.5rem;
				font-size: 1.1rem;
			}
			.hdInfo .hdInfo-btn .btn:before {
				margin-right:0.5rem;
			}
	}
	@media only screen and (min-width: 999px) and (max-width: 1199px) {
	}
	@media only screen and (max-width: 999px) {
		header .inner {
			max-width: 769px;
		}
		.hdInfo .hdInfo-ship {
			display:none;
		}
		.hdLogo {
		}
			.hdLogo a {
			}
				.hdLogo a img {
					width: 50px;
				}
		.hdNav {
		}
			.hdNav .hdNav-globalNav {
				margin-top: 0;
			}
				.hdNav .hdNav-globalNav > ul > li > a {
					padding: 0.5rem 0;
				}
				.hdNav .hdNav-globalNav > ul > li > a > p {
					padding: 0.4rem 1rem;
				}
			.hdInfo .hdInfo-btn .btn {
				width: 90px;
			}
	}
	@media only screen and (max-width: 767px) {
		header.simpleNav {
			position:inherit;
		}
		header .inner {
			padding: 0;
			margin: 0;
			width: 100%;
		}
		.hdLogo {
			padding: 0.5rem 0 0 0.5rem;
		}
		.hdInfo {
			float: right;
			padding: 0.5rem 0.5rem 0 0;
		}
		.hdInfo .hdInfo-ship {
			border-top: none;
			border-bottom: none;
			padding: 0;
			margin-bottom: 0;
			font-size: 1.4rem;
			display:block;
		}
		.hdInfo .hdInfo-ship > span {
			font-size: 1.1rem;
		}
		.hdInfo .hdInfo-contact .hdInfo-contact-tel {
			font-size: 2.8rem;
		}
		.hdInfo .hdInfo-contact {
			display:block;
		}
		.hdInfo .hdInfo-contact .hdInfo-contact-hours {
			font-size: 0.8rem;
		}
		.hdInfo-contact {
			display:block;
		}
		.hdInfo .hdInfo-contact .btnContact {
			display: none;
		}
		.hdInfo-btn {
			display:none;
		}
		.hdNav {
			width: 100%;
			display: block;
			clear: both;
		}
		.hdNav .hdNav-desc {
			display: block;
			font-size: 1rem;
			width: 100%;
			text-align: center;
			background: #2E1A14;
			color: #FFF;
		}
	}

/*****************************************************
   ヘッダー ※スクロール時
*****************************************************/
.simple .hdNav .hdNav-desc ,
.simple .hdNav .hdNav-subNav ,
.simple .hdInfo .hdInfo-ship ,
.simple .hdInfo .hdInfo-contact {
	display:none;
}
.simple .hdLogo {
	width: auto;
}
	.simple .hdLogo a img {
		width: 50px;
	}
.simple .hdNav .hdNav-globalNav {
	margin-top: 0;
	float: none;
}
	.simple .hdNav .hdNav-globalNav > ul > li > a {
		padding: 0.8rem 0;
	}
		.simple .hdNav .hdNav-globalNav > ul > li > a > p {
			padding: 0 2.95rem;
		}
	@media only screen and (max-width: 1199px) {
		.simple .hdLogo a img {
			width: 40px;
		}
		.simple .hdNav .hdNav-globalNav > ul > li > a {
			padding: 1rem 0;
		}
			.simple .hdNav .hdNav-globalNav > ul > li > a > p {
				padding: 0.4rem 2rem;
			}
		.simple .hdInfo .hdInfo-btn .btn {
			margin: 0 0.5rem;
		}
	}
	@media only screen and (max-width: 999px) {
		.simple .hdNav .hdNav-globalNav > ul > li > a {
			padding: 1rem
		}
			.simple .hdNav .hdNav-globalNav > ul > li > a > p {
				padding: 0.4rem;
			}
	}
	@media only screen and (max-width: 767px) {
	}


/*****************************************************
	メガメニュー
*****************************************************/

/*基本設定*/
.hdNav-globalNav .head-category{
	/*position:relative;	*/
}
.hdNav-globalNav .head-category:hover #Mega {
	visibility: visible;;
	opacity:1;	
	top: 16.3rem;
}
.hdNav-globalNav #Mega a:hover{
	text-decoration:none;	
}
.hdNav-globalNav #Mega{
	display:inline;	
	visibility:hidden;
	opacity:0;	
	position: absolute;
	top: 15rem;
	border-top: 3px solid #61881E;
	border-bottom: 3px solid #61881E;
	z-index: 50;
	width: 100%;
	padding: 2rem 3rem;
	box-sizing: border-box;
	font-weight: bold;
	transition-property: top opacity;
	transition-duration: 0.2s;
}
.simple .hdNav-globalNav #Mega{top:5.9rem;}
.simple .hdNav-globalNav .head-category:hover #Mega{top: 6.9rem;}

.hdNav-globalNav #Mega ul.Mega_inner {
	font-size: 0;
	text-align: left;
	width:920px;
	margin:0 auto;
	position:relative;
}
	@media only screen and (max-width: 1199px) {
		.hdNav-globalNav .head-category:hover #Mega {
			top: 11rem;
		}
		.hdNav-globalNav #Mega{
			top: 10rem;
		}
		.simple .hdNav-globalNav #Mega{top:4.9rem;}
		.simple .hdNav-globalNav .head-category:hover #Mega{top: 5.9rem;}
			.hdNav-globalNav #Mega ul.Mega_inner {
				width:100%;
			}
	}
	@media only screen and (max-width: 999px) {
		.hdNav-globalNav .head-category:hover #Mega {
			top: 6.8rem;
		}
		.hdNav-globalNav #Mega{
			top: 6rem;
		}
			.hdNav-globalNav #Mega ul.Mega_inner {
				width:100%;
			}
	}
	@media only screen and (max-width: 767px) {
	}

	/*****************************************************
		商品一覧 .megaItem
	*****************************************************/
	.hdNav-globalNav #Mega.megaItem{left:0;}
	.simple .hdNav-globalNav #Mega.megaItem{left: 0;}

		.hdNav-globalNav #Mega.megaItem ul.Mega_inner > li {
			margin: 0;
			width: 20%;
			display: inline-block;
			padding:1%;
			font-size: 1.4rem;
			vertical-align: top;
			box-sizing: border-box;
			height:140px;
			line-height: 1.3;
		}
		.hdNav-globalNav #Mega ul.Mega_inner li.main {
			width:33.33%;
			height:170px;
		}
		.hdNav-globalNav #Mega ul.Mega_inner li.category {
			height: auto;
			text-align: center;
			border-bottom: 1px solid rgba(97, 136, 30, 0.15);
			margin-bottom: 1rem;
			padding-bottom: 2rem;
		}
		.hdNav-globalNav #Mega ul.Mega_inner li.category a:before {
			content:"\f0da";
		}
		.hdNav-globalNav #Mega.megaItem ul.Mega_inner > li:hover {
			transition: background 0.2s ease-out; 
			/*border: 1px dashed;*/
		}
			.hdNav-globalNav #Mega.megaItem ul.Mega_inner > li > a > span {
				display:block;
				text-align:center;
				color:#230706;
			}
			.hdNav-globalNav #Mega.megaItem ul.Mega_inner > li > a > img {
				display:block;
				margin:0 auto 1rem;
				width:100px;
			}
			.hdNav-globalNav #Mega.megaItem ul.Mega_inner > li:hover > a > img {
				transition: width 0.3s ease-out;  
				width:113px;
			}
			.hdNav-globalNav #Mega.megaItem ul.Mega_inner li.main > a > img {
				width:200px;
			}
			.hdNav-globalNav #Mega.megaItem ul.Mega_inner li.main:hover > a > img {
				width:215px;
			}

/*****************************************************
    フッター　#footer
*****************************************************/
footer {
	position:relative;
    width: 100%;
	clear:both;
}
	footer > div {
		padding:4rem 0;	
		text-align:left;
		font-size:14px;
		position: relative;
	}
			footer div > div.inner .ftBox {
				float:left;
				box-sizing: border-box;
				padding:0 2%;
			}
				.ftBox h5 {
					font-weight: bold;
					font-size: 1.6rem;
					border-bottom: 1px solid;
					margin-bottom: 1rem;
					position: relative;
					line-height: 1;
					padding-bottom: 0.5rem;
				}
					.ftBox h5 a {
						font-size:1.2rem;
						position:absolute;
						right:1rem;
						line-height: 1.5;
						color: #230706;
					}
					.ftBox h5 a:before {
						content:"\f0da";
						margin-right:0.5rem;
					}
					.ftBox a:hover:before {
						text-decoration:none;
					}
					.ftBox section {
						padding: 0 1rem 1rem;
					}
						.ftBox section > p {
							margin-bottom: 2.5rem;
						}
						.ftBox li{
							margin-bottom:2rem;	
						}
						.ftBox h6{
							font-weight:bold;
						}
	@media only screen and (max-width: 1199px) {
		footer{
			width: 100%;
		}
			.footer-inner {
				width:97%;
			}
				footer div > div.inner .ftBox {
					float: left;
					box-sizing: border-box;
					padding: 0 1.5%;
				}
	}
	/*****************************************************
		ご利用ガイド .ftGuide
	*****************************************************/
	.ftGuide{
	}
		.ftGuide .ftBox {
			width:33.33%;	
		}
			.ftGuide .ftBox ul li img {
				display:block;
				margin:1rem auto;
				width:95%;
			}

	/*****************************************************
		フッターナビ .ftNav
	*****************************************************/
	.ftNav{
	}
		.ftNav .ftBox{
			width:20%;
		}
		.ftNav .ftBox:last-child{
			width:40%;
		}
		.ftNav-title{
			margin-bottom: 1.5rem;
			font-weight: bold;
			font-size: 1.5rem;
			border-bottom: 1px solid;
			padding: 0 1rem 1rem;
			line-height: 1;
			position: relative;
		}
			.ftNav .ftBox ul {
				margin-bottom:5rem;	
				padding: 0 1rem;
			}
			.ftNav .ftBox ul:last-of-type {
				margin-bottom:5rem;;	
			}
				.ftNav .ftBox ul li {
					margin-bottom: 1rem;
					text-indent: -1.6rem;
					margin-left: 1.6rem;
					line-height: 1.6;
				}
				.ftNav .ftBox:last-child ul li {
					float: left;
					width: 40%;
					font-size: 1.6rem;
					font-weight: bold;
					margin-right: 6%;
					margin-bottom:1rem;	
				}
				.ftNav .ftBox ul li a:before {
					content:"\f105";
				}


				.ftNav .ftBox-info .ftBox-info-logo {
					float:left;
					margin-right:2rem;
				}
				.ftNav .ftBox-info .ftBox-info-company {
					font-weight:bold;
					font-size:1.6rem;
				}
				.ftNav .ftBox-info .ftBox-info-hours {
					font-size:1.3rem;
					line-height: 1.2;
				}
					.ftNav .ftBox-info .ftBox-info-hours span {
						font-size:4rem;
						display:block;
					}
				.ftNav .ftBox-info .ftBox-info-address {
					font-size:1.2rem;
					line-height: 1.6;
				}

		@media only screen and (max-width: 1199px) {
			.ftNav .ftBox {
				width: 33.33%;
			}
				.ftNav .ftBox:last-child {
					width: 100%;
				}
				.ftNav .ftBox-info {
					text-align: center;
				}
					.ftNav .ftBox-info .ftBox-info-logo {
						float: none;
						margin-right: 0;
					}
		}
		@media only screen and (max-width: 767px) {
			footer div > div.inner .ftBox {
				float: none;
				width: 100%;
			}
			.ftNav .ftBox:last-child ul li {
				float: none;
				width: 100%;
				font-size: 1.6rem;
				margin-right: 0;
			}
			.ftNav .ftBox:nth-of-type(1) ,
			.ftNav .ftBox:nth-of-type(2) ,
			.ftNav .ftBox:nth-of-type(3) {
				display:none;
			}
		}
	/*****************************************************
		コピーライト .ftNav
	*****************************************************/
	.copyright{
		text-align: center;
		padding: 1rem 0;
	}
	.copyright{
		font-size: 8px;
	}


/************************************************************
	PAGE TOP
*************************************************************/
#page-top {
	position: fixed;
	bottom: 1em;
	right: 1em;
	font-size: 90%;
}
	#page-top a {
		border:3px solid #0B0F08;
		display: block;
		line-height: 17px;
		padding: 0.4em 1em;
		opacity: 0.7;
		filter: alpha(opacity=70);
		-moz-opacity:0.7;
		-ms-filter: "alpha( opacity=70 )";
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-ms-border-radius: 5px;
		-o-border-radius: 5px;
		-webkit-box-shadow: 0 0 1px #666; /* for Android2.3 */
		background: #9CC479;
		text-decoration: none;
		color: #0B0F08;
		text-align: center;
	}
				#page-top a:before {
					font-family: FontAwesome;
					font-style: normal;
					font-weight: normal;
					line-height: 1;
					-webkit-font-smoothing: antialiased;
					-moz-osx-font-smoothing: grayscale;
					content: "\f106";
				}
		#page-top a:hover {
			color: #fff;
			background: #0B0F08;
			-moz-transition: 0.5s ease-in-out;
			-webkit-transition: 0.5s ease-in-out;
			transition: 0.5s ease-in-out;
			text-decoration: none;
		}
			#page-top a span {
				display: block;
			}

	@media only screen and (max-width: 767px){
		#page-top {
			bottom: 6rem;
			right: 0.5em;
			font-size: 100%;
		}
			#page-top a {
				padding: 1rem;
				font-size: 1rem;
			}
				#page-top a:before {
					margin-right: 0.2em;
					font-family: FontAwesome;
					font-style: normal;
					font-weight: normal;
					line-height: 1;
					-webkit-font-smoothing: antialiased;
					-moz-osx-font-smoothing: grayscale;
					content: "\f106";
				}
				#page-top a span {
					display: none;
				}
	}