@charset "utf-8";

/* 福顔酒造
---------------------------------
		1. Common(font/text)
		2. Elements
		3. Responsive
---------------------------------
*/

/*	1. Common(font/text)
-------------------------------------------------------*/
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic);
body {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	font-size: 16px;
	line-height: 1.8;
	letter-spacing: 0.1em;
	text-align: center;
	background: url("images/12.png")  fixed center center /cover;
	backgroun-color:#ABABAB;
	overflow: auto;
}
.clearfix:after {
	content: "";
	clear: both;
	display: block;
}
ul, ol, dl, dt, dd {
	list-style-type: none;
	margin-left: 0;
	padding-left: 0;
}
h1 {
	margin: 0 30px;
}
h2 {
	font-size: 38px;
	text-shadow: 0.02em 0.02em 0.02em #777;
}
.gothic {font-family: 'arial';	letter-spacing: 0;}

.h2-line {
	border: 0;
	height: 1px;
	background: #333;
	background-image: -webkit-linear-gradient(left, #ccc, #555, #ccc);
	background-image: -moz-linear-gradient(left, #ccc, #555, #ccc);
	background-image: -ms-linear-gradient(left, #ccc, #555, #ccc);
	background-image: -o-linear-gradient(left, #ccc, #555, #ccc);
	width: 15%;
	margin-bottom: 2em;
}
h3 {
	font-size: 28px;
	text-shadow: 0.02em 0.02em 0.02em #777;
}
.font-22 {
	font-size: 22px;
}
.alignleft {
	text-align: left;
	padding: 0 3em;
}
#Btn-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 77%;
}
.btn-default {
	background-color: #555555;
	border-color: #888888;
	color: #fff;
}
img {
	max-width: 100%;
	height: auto;
}
.insta {
	position: relative;
	top: -2px;
}
/*	2. Elements
-------------------------------------------------------*/
.container {
	margin: 0 auto;
	padding: 0;
}
footer {
	margin: 0;
	padding: 1em;
	color: #FFF;
	font-size: 14px;
}

footer > ul{ 
	list-style-type:none;
}

footer > ul > li{ 
	display:inline-block;
	padding:20px;
}
footer ul li a { 
	color:#FFF;
}
footer ul li a:hover { 
	color:#333;
}
header {
	margin: 0 auto;
}
/* movie */
.movie-wrap {
	position: relative;
	padding-bottom: 60%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
.movie-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}
/* nav */
.dropdown:hover > .dropdown-menu {
	display: block;
}
.dropdown-menu {
	border: none;
	background: linear-gradient(#555555, #888888);
}
.dropdown-menu > li > a {
	color: #ffffff;
}
.dropdown-menu > li > a:hover {
	color: #cccccc;
	background: none;
}
.navbar {
	margin-bottom: 0;
}
.navbar-default {
	border: none;
	background: linear-gradient(#555555, #888888);
	background: -webkit-linear-gradient(  #555555,  #888888);
}
.navbar-default ul {
	margin-top: 2em;
	font-size: 18px;
}
.navbar-default .navbar-nav > li > a {
	color: #ffffff;
}
.navbar-default .navbar-nav > li > a:hover {
	color: #cccccc;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
	background-color: #555;
}
/* section */
section {
	padding: 2em 0 0 0;
	text-align: center;
	width: 100%;
}
section .inner {
	padding: 3em;
}
#infomation {
	background: linear-gradient(180deg, rgba(180,180,180,0.5), rgba(0, 0 , 0, 0.5)),  url(images/bg_news.jpg) no-repeat;
	background-size: cover;
	color: #fff;
	background: -webkit-linear-gradient(270deg, rgba(180,180,180,0.5), rgba(0, 0 , 0, 0.5)),  url(images/bg_news.jpg) no-repeat;
}
#infomation .inner {
	padding: 1em 3em 3em 3em;
}
#infomation .news-box {
	background: linear-gradient(-45deg, rgba(180,180,180,0.5), rgba(0, 0 , 0, 0.5));
	background: -webkit-linear-gradient(45deg, rgba(180,180,180,0.5), rgba(0, 0 , 0, 0.5));
	padding: 2em;
	text-align: left;
}
#infomation .img-box {
	padding: 1em;
	background: #fff;
	border: 5px solid #CCC;
	text-align: center;
}
.news-text > h3 {
	font-size: 22px;
}
.news-text > h3 > a {
	color: #fff;
}
.news-text > h3 > a:hover {
	color: #ddd;
}
.news-text > .togo:hover {
	color: #ddd;
}
.more-link {
	display: none;
}
.news-text > p > a:hover {
	color: #ddd;
}
.screen-reader-text {
	display: none;
}
.togo {
	color: #CCFFFF;
}

#instagram{
	background-color:#D94C82;
	text-align:center;
	padding-bottom : 20px;
}

#intro {
	background: linear-gradient(#b2dcf6, #fff);
	background: -webkit-linear-gradient(#b2dcf6, #fff);
}
#intro .inner {
	padding: 0 3em 3em 3em;
}
#intro .font-22 ul {
	padding: 0 4em;
	list-style-type: disc;
	text-align: left;
}
.kodawari {
	margin: 2em 0;
}
.kodawari1 {
	background: #e7e5d8;
	text-align: left;
}
.kodawari1 img {
	margin-bottom: 2em;
}
.kodawari2 {
	background: #edf6fb;
	text-align: left;
}
.kodawari2 img {
	margin-bottom: 2em;
}
.kodawari3 {
	background: #feeed7;
	text-align: left;
}
.kodawari3 img {
	margin-bottom: 2em;
}
.kodawari1 p, .kodawari2 p, .kodawari3 p {
	padding: 2em;
}
#uta {
	background: linear-gradient(180deg, rgba(204,204,204,1), rgba(255, 255, 255, .5)), url(images/bg_song.jpg) no-repeat;
	background: -webkit-linear-gradient(-90deg, rgba(204,204,204,1), rgba(255, 255, 255, .5)), url(images/bg_song.jpg) no-repeat;
	background-size: cover;
}
#uta .inner {
	padding: 1em 20%;
}
#tastingmap {
	padding-top: 0;
}
#tastingmap .bg-h2 {
	background: linear-gradient(#CCC, #fff);
	background: -webkit-linear-gradient(#CCC, #fff);
	padding: 1.5em 0 0.5em 0 !important;
}
#tastingmap {
	background: linear-gradient(#f5e9bf, #fff);
	background: -webkit-linear-gradient(#f5e9bf, #fff);
}
#tastingmap .inner {
	padding: 2em 0 !important;
}
#tastingmap img {
	display: block;
	margin: 2em 0;
}
#cooking {
	margin-top: 2em;
}
#tastingmap .co-img {
	margin: 0 3em;
}
#products {
	background: linear-gradient(#f5e9bf, #fff);
	background: -webkit-linear-gradient(#f5e9bf, #fff);
}
#products .inner {
	background: #ededed;
}
#products ul li h3 {
	font-size: 16px;
}
#products .box2 {
	background: #FFF;
	padding: 0.5em;
	margin-bottom: 30px;
}
#productstable {
	background: linear-gradient(#f5e9bf, #fff);
	background: -webkit-linear-gradient(#f5e9bf, #fff);
}
#productstable .inner {
	background: linear-gradient(#b2dcf6, #fff);
	background: -webkit-linear-gradient(#b2dcf6, #fff);
}
#gold {
	background: linear-gradient(#f5e9bf, #fff);
	background: -webkit-linear-gradient(#f5e9bf, #fff);
}
#gold .inner {
	background: #555;
	color: #FFF;
}


#precepts, #privacy, #buy, #tokusyohou {
	background: linear-gradient(#f5e9bf, #fff);
	background: -webkit-linear-gradient(#f5e9bf, #fff);
}
#precepts h3, #privacy h3, #tokusyohou h3, #buy h3  {
	margin: 1.5em 0 1em 0;
}
#precepts .inner, #privacy .inner, #buy .inner, #buy .inner, #tokusyohou .inner {
	background: url(images/bg_kakun.gif);
	color: #FFF;
}
#ebisu {
	background: linear-gradient(#f5e9bf, #fff);
	background: -webkit-linear-gradient(#f5e9bf, #fff);
}
#ebisu .inner {
	background: #555;
	color: #FFF;
}
#ebisu p {
	padding-bottom: 1em;
}
#ebisu img {
	margin: 1em auto;
}
#aboutus {
	background: linear-gradient(#eddefa, #fff);
	background: -webkit-linear-gradient(#eddefa, #fff);
}
#aboutus h3 {
	margin: 1.5em;
}
#aboutus .inner {
	background: url(images/bg_company.jpg);
	color: #FFF;
}

#company {
	background-image:url(images/bg_fooder.jpg);

}
#company .inner {
	background: url(images/bg_kakun.gif);
	color: #FFF;
}

#company .gothic2 {
	font-family: 'arial';	letter-spacing: 0;
	font-size:1.5em;
	color:#878787;
}
#company section {
	text-align: left;
	padding: 2em 4em;
	margin: 0;
}
#company, #privacy {
	padding-bottom: 0;
}

}
/*	3. Responsive
-------------------------------------------------------*/

@media screen and (min-width:992px) and ( max-width:1199px) {
img {
	max-width: 100%;
	height: auto;
}
.insta img {
	width: 30px;	
}
.insta {
	position: relative;
	top: -2px;
}
/*-----------*/
/*-----------*/
}

@media screen and (min-width:768px) and ( max-width:991px) {
img {
	max-width: 100%;
	height: auto;
}
.insta img {
	width: 30px;	
}
.insta {
	position: relative;
	top: -2px;
}
/*-----------*/
.navbar-default ul {

}
.dropdown-menu {
	margin: 0 !important;
}
/*-----------*/
}

@media screen and (max-width:767px) {
img {
	max-width: 100%;
	height: auto;
}
.insta {
	position: relative;
	top: -2px;
}
.insta img {
	width: 30px;	
}
/*-----------*/
.dropdown:hover > .dropdown-menu {
	display: none;
}
header {
	text-align: left;
}
.caret {
	display: none;
}
#intro .font-22 ul {
	padding: 0 2em;
}

h2 {
	font-size: 24px;
}
/*-----------*/
}

@media screen and (max-width:410px) {
	
h2 {
	font-size: 24px;
}
img {
	max-width: 100%;
	height: auto;
}
.insta {
	width: 100%;	
}
.insta img {
	width: 30px;	
}
/*-----------*/
.dropdown:hover > .dropdown-menu {
	display: none;
}
header {
	text-align: left;
}
.caret {
	display: none;
}
#intro .font-22 ul {
	padding: 0;
}
#uta ul li {
	font-size: 14px;
}
.alignleft {
	padding: 0;
}
#company section {
	padding: 1em;
}
#intro .inner {
0 1em 2em 1em
}
#products .inner {
	padding: 2em 1em 2em 1em;
}
}
#company section {
	padding: 2em 2em;
}
#aboutus .inner {
	padding: 3em 1em 3em 1em;
}
#ebisu .inner {
	padding: 3em 1em 3em 1em;
}
#precepts .inner, #privacy .inner, #buy .inner, #buy .inner, #tokusyohou .inner {
	padding: 3em 1em 3em 1em;
}
/* 音楽再生用 */

          /*　プレイヤー（再生バー）の高さ、幅、背景色の指定　*/
.audiojs {

	height: 60px;
	background: #333333;
	width: 100px;

}
/*　再生・停止ボタンの高さ、幅、パディングの指定　*/
.audiojs .play-pause {
	width: 30px;
	height: 30px;
	padding: 0px 8px 0px 0px;
}
/*　再生・停止ボタンなどの p 要素　*/
.audiojs p {
	width: 25px;
	height: 20px;
	margin: -3px 0px 0px -1px;
}
/*　進行状態・ロードの状態を表示する部分　*/
.audiojs .scrubber {
	background: #5a5a5a;
	width: 80px;
	height: 10px;
	margin: 5px;
}
/*　進行状態を表示するバーの部分　*/
.audiojs .progress {
	height: 10px;
	width: 90px;
	background: #ccc;
}
/*　ロード状態を表示するバーの部分　*/
.audiojs .loaded {
	height: 10px;
	background: #000;
}
/*　再生時間の部分　*/
.audiojs .time {
	float: left;
	height: 25px;
	line-height: 25px;
}
.audiojs .error-message {
	height: 24px;
	line-height: 24px;
}
/*　再生している曲の情報　*/
.track-details {
	clear: both;
	height: 20px;
	width: 100px;
	padding: 1px 6px;
	background: #eee;
	color: #222;
	font-size: 11px;
	line-height: 20px;
}
.track-details:before {
	content: '♬  Now Playing: ';
}
}