@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Hammersmith+One');
@font-face {
	font-family: 'Noto Serif';
	src: url('../font/NotoSerif.otf');
	src: url('../font/NotoSerif.otf?#iefix') format('embedded-opentype'),
	url('../font/NotoSerif.otf') format('opentype'),
}
@font-face {
	font-family: 'Noto Sans M';
	src: url('../font/NotoSans_M.otf');
	src: url('../font/NotoSans_M.otf?#iefix') format('embedded-opentype'),
	url('../font/NotoSans_M.otf') format('opentype'),
}

body {
	font-size: 16px;
	line-height: 180%;
	max-width: 100%;
	min-width: 1280px;
	color: #000;
	margin: 0;
	letter-spacing: 2px;
    font-family: 'Noto Sans', sans-serif;
}
.inner {
	width: 1280px;
	margin: 0 auto;
}
a {
	transition: .7s;
	color: #000;
	text-decoration: none;
}
a:hover {
	color: #555;
	opacity: 0.7;
}
img {
	border: 0;
	vertical-align: bottom;
}

.sp { display: none; }

h1, h2, h3, p, ul, li {
	margin: 0;
	padding: 0;
	font-family: 'Noto Sans M', "sans-serif";
}
ul, li {
	list-style: none;
}
h2.h2_ttl {
	font-size: 32px;
	font-weight: 600;
	line-height: 160%;
	padding: 0 0 15px 0;
	margin: 0 0 30px 0;
	text-align: center;
	background: url(../img/common/ico/h2.png) no-repeat 50% 100%;
	background-size: 80px;
	font-family: 'Hammersmith One', 'Noto Sans M', "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "sans-serif";
	width: 100%;
}
h2.h2_ttl small {
	font-size: 16px;
	line-height: 140%;
	margin: 0 0 0 10px;
}
p.small {
	font-size: 14px;
	line-height: 180%;
	color: #555;
}
.btn a,
.btn input {
	display: block;
	border: 1px solid #000;
	width: 300px;
	text-align: center;
	padding: 10px;
	color: #000;
	text-decoration: none;
}
.btn a:hover,
.btn input:hover {
	color: #FFF;
	background: #000;
}

/* header */
header {
	position: absolute;
	top: 0;
	left: 0;
	width: 96%;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	justify-content: space-between;
	padding: 10px 2%;
	z-index: 100;
}
header .logo a {
	background: url(../img/common/header/logo.png) no-repeat;
	text-indent: -9999px;
	width: 190px;
	height: 75px;
	display: block;
	text-indent: -9999;
}
header .nav-button {
	display: none;
}
header #gNav {
	display: -webkit-flex;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
header #gNav li {
	margin: 0;
	padding: 0;
	align-items: center;
	background: #FFF;
	float: left;
}
header #gNav li a {
	padding: 5px 10px;
}
header #gNav li a:hover {
	background: #000;
	color: #FFF;
}
@media all and (max-width: 1000px) {
	header .logo a {
		background-size: 100%;
		width: 150px !important;
		height: 60px;
	}
	header #gNav li a {
		font-size: 14px;
		line-height: 130%;
		letter-spacing: -1px;
	}
}

/* footer */
footer {
	padding: 50px 0 0 0;
	border-top: 2px solid #EDEDED;
}
footer .footer_photo {
	background: url(../img/common/footer/photo.jpg) no-repeat 50% 50%;
	background-size: cover;
	height: 450px;
}
footer h3 {
	font-size: 21px;
	line-height: 160%;
	margin: 30px 0 20px 0;
}
footer p {
	margin: 15px 0;
}
footer ul {
    margin-bottom: 30px;
}
footer ul li {
	display: flex;
}
footer ul li .shop_txt {
	margin-left: 50px;
}
footer ul li .btn_kids {
    margin-bottom: 10px;
}
.instagram {
	position: fixed;
	bottom: 30px;
	right: 30px;
	z-index: 20000;
}
.instagram a {
	width: 80px;
	height: 80px;
	display: block;
	background: url(../img/common/ico/instagram.png) no-repeat;
	background-size: 100%;
	text-indent: -9999px;
}
.copyright {
	background: #000;
	color: #FFF;
	text-align: center;
	padding: 10px 0;
	font-size: 14px;
}
.copyright a {
	color: #FFF;
}

/* toppage */
#toppage .main_img {
	height: 650px;
}

#toppage #news {
	padding: 80px 0;
}
#toppage #news ul li .date {
	padding: 5px 10px;
	background: #000;
	color: #FFF;
	font-size: 14px;
	margin-right: 15px;
}
#toppage #news ul li {
	margin: 15px 0;
}
#toppage #news ul li a {
	text-decoration: none;
	border-bottom: 1px dashed #000;
	padding-bottom: 3px;
}
#toppage #news ul li a:hover {
	border-bottom: 1px dashed #DDD;
}
#toppage #news .btn.more {
	display: flex;
	justify-content: flex-end;
}
#toppage #news .btn.more a {
	width: 80px;
}

#toppage #story {
	background: url(../img/toppage/story.jpg) no-repeat fixed;
	background-size: cover;
	padding: 80px 0;
}
#toppage #story p {
	width: 600px;
	margin: 15px auto;
	text-align: center;
}
#toppage #story .btn a {
	margin: 0 auto;
}

#lineup {
	background: #ebebeb;
	padding: 80px 0;
}
#lineup ul {
    display: flex;
    flex-wrap: wrap;
}
#lineup ul li {
	margin: 1%;
	background: #FFF;
	box-shadow: 4px 4px 10px #EAEAEA;
	width: 31.3333%;
}
#lineup ul li a {
	display: block;
	color: #000;
	text-decoration: none;
	padding-left: 50%;
}
#lineup ul li a p {
	text-align: center;
	font-size: 21px;
	font-weight: bold;
	padding: 45px 0;
	background: url(../img/common/ico/arrow_right.png) no-repeat 94% 92%;
	background-size: 10px;
	transition: .5s;
}
#lineup ul li a:hover p {
	background: url(../img/common/ico/arrow_right.png) no-repeat 96% 92%;
	background-size: 10px;
}
#lineup ul li a p small {
	display: block;
	font-size: 14px;
	font-weight: normal;
}
#lineup ul li.tea a {
	background: url(../img/toppage/lineup_tea.jpg) no-repeat 0 50%;
	background-size: 50%;
}
#lineup ul li.teabag a {
	background: url(../img/toppage/lineup_teabag.jpg) no-repeat 0 50%;
	background-size: 50%;
}
#lineup ul li.flavor a {
	background: url(../img/toppage/lineup_flavor.jpg) no-repeat 0 50%;
	background-size: 50%;
}
#lineup ul li.sweets a {
	background: url(../img/toppage/lineup_sweets.jpg) no-repeat 0 50%;
	background-size: 50%;
}
#lineup ul li.terrine a {
	background: url(../img/toppage/lineup_terrine.jpg) no-repeat 0 50%;
	background-size: 50%;
}
#lineup ul li.goods a {
	background: url(../img/toppage/lineup_goods.jpg) no-repeat 0 50%;
	background-size: 50%;
}
#lineup ul li.takeout a {
	background: url(../img/toppage/lineup_takeout.jpg) no-repeat 0 50%;
	background-size: 50%;
}
#lineup ul li.gift a {
	background: url(../img/toppage/lineup_gift.jpg) no-repeat 0 100%;
	background-size: 50%;
}