@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.1.1
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/


/*▼ヘッダーメニューアイコン色変更▼*/

.kanpai {color: #800080} /* 乾杯グラス*/
.bottle {color: #2F4F4F} /* ボトル*/
.cart {color: #ff0000} /* カート*/
.infom {color: #0000FF} /* イベント詳細*/
.store {color: #008000} /* 飲食店*/





/*▲ヘッダーメニューアイコン色変更▲*/

/*▼ヘッダーメニュー太文字▼*/

nav#navi, .menu-header .sub-menu{
	font-weight: bold;
}

/*▲ヘッダーメニュー太文字▲*/
/*▼ヘッダーメニュー影付き▼*/

nav#navi, .menu-header .sub-menu{
	font-weight: bold;
	box-shadow:0 5px 15px -5px rgba(0,0,0,.8);
}

/*▲ヘッダーメニュー影付き▲*/



/*▼ヘッダーメニューに上下線を表示▼*/


nav#navi, .menu-header .sub-menu{
     border-bottom:2px solid;
     border-top:2px solid;
}

/*▲ヘッダーメニューに上下線を表示▲*/

/*▼ヘッダーメニューマウスホバー背景色下線表示▼*/

.menu-header .menu-item:hover{
         background-color: #ccff99;
	 border-bottom:4px solid #000000 !important;/*線の太さ色*/
	    transition: all .3s;/*線が出てくる時間*/
}
.sub-menu .menu-item:hover{
     background-color: #ccff99;
     border-bottom:4px solid #000000 !important;/*線の太さ色*/
	    transition: all .3s;/*線が出てくる時間*/
}

/*▲ヘッダーメニューマウスホバー背景色下線表示▲*/




/*▼ホバー時の背景設定▼*/

.widget_recent_entries ul li a:hover,
.widget_categories ul li a:hover,
.widget_archive ul li a:hover,
.widget_pages ul li a:hover,
.widget_meta ul li a:hover,
.widget_rss ul li a:hover,
.widget_nav_menu ul li a:hover,
.navi-in a:hover,
.navi-footer-in a:hover,
.a-wrap:hover,
.comment-reply-link:hover,
.recent-comments .a-wrap:hover .recent-comment-content,
.pagination a:hover,
.pagination-next-link:hover, .comment-btn:hover,
.pager-links a:hover span,
.pager-links a:hover span,
.mobile-menu-buttons .menu-button:hover,
.menu-drawer a:hover,
.bp-login-widget-register-link a:hover{
  background-color: #ccff99; /*背景色*/
  transition: all 0.8s ease; /*アニメーション*/
  color: #333; /*フォントカラー*/
}

/*▲ホバー時の背景設定▲*/


/*▼フロント固定ページカスタマイズ▼*/

/*フロント固定ページのタイトルを非表示*/
.home.page .entry-title{
display: none;
}
/*フロント固定ページのシェアボタンを非表示*/
.home.page .sns-share{
display: none;
}
/*フロント固定ページのフォローボタンを非表示*/
.home.page .sns-follow{
display: none;
}
/*フロント固定ページの投稿日を非表示*/
.home.page .post-date{
display: none;
}
/*フロント固定ページの更新日を非表示*/
.home.page .post-update{
display: none;
}
/*フロント固定ページの投稿者名を非表示*/
.home.page .author-info{
display: none;
}

/*▲フロント固定ページカスタマイズ▲*/

#popular_entries-5 .popular-entry-cards.large-thumb-on {
    display: flex;
}

#popular_entries-5 .popular-entry-cards.large-thumb-on a {
    width: 33%;
}

/*▼アイキャッチ画像のカテゴリ表示を非表示に▼*/

 .eye-catch .cat-label {
    display: none;
}

/*▲フロント固定ページカスタマイズ▲*/


/*▼サイドバープロフィールカスタマイズ▼*/


.nwa .author-box {
    text-align: center;
    max-width: 100%;
}
.sidebar .author-box {
    border: none;
    border-radius: 4px;
    margin: 1em 0;
    line-height: 1.4;
    position: relative;
    padding: 1.4% 2% 1.8%;
}
.nwa .author-box .author-thumb {
    float: none;
    width: 100%;
    margin: 9px auto 0;
    background: url(../../uploads/2020/05/447275.jpg) center no-repeat;
    background-size: cover;
    height: 0;
    padding-top: calc(100%*970/1559);
    position: relative;
}
.sidebar .author-thumb img {
    border: 0px solid #fff;
    width: 30%;
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -25%;
}
.nwa .author-box .author-content {
    margin-top: 16%;
    font-size: 0.9em;
}
.author-name {
    font-size: 1.1em;
    font-weight: bold;
    margin-bottom: 10px;
}
.author-box .author-name a {
    text-decoration: none;
    color: #333;
}
.author-box p {
    margin-top: 0.3em;
    line-height: 1.6;
}
.author-box p a {
    text-decoration: none;
    color: #008cee;
}
.author-box p a:hover {
    text-decoration: underline;
    color: #008cee;
}
.author-box .sns-follow-buttons a.follow-button {
    font-size: 20px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    margin-bottom: 4px;
    margin-right: 8px;
    background: none;
    color: #fff;
}
.author-box a.follow-button span {
    line-height: 40px;
}
.author-box a.follow-button span::before {
    font-size: 22px;
}
.author-box .icon-twitter-logo::before {
    font-family: FontAwesome;
    content: "\f099"
}
.author-box .icon-facebook-logo::before {
    font-family: FontAwesome;
    content: "\f09a";
}
.author-box .icon-instagram-new::before {
    font-family: FontAwesome;
    content: "\f16d";
}
.author-box .icon-hatebu-logo::before {
    font-family: Verdana;
    content: 'B!';
    font-weight: bold;
}
.author-box .icon-google-plus-logo::before {
    font-family: FontAwesome;
    content: "\f0d5";
}
.author-box .icon-youtube-logo::before {
    font-family: FontAwesome;
    content: "\f167";
}
.author-box .icon-pinterest-logo::before {
    font-family: FontAwesome;
    content: "\f231";
}
.author-box .icon-amazon-logo::before {
    font-family: FontAwesome;
    content: "\f270";
}
.author-box .icon-github-logo::before {
    font-family: FontAwesome;
    content: "\f09b";
}
.author-box .website-button { background-color: #47555c !important; }
.author-box .twitter-button { background-color: #1da1f2 !important; }
.author-box .facebook-button { background-color: #3b5998 !important; }
.author-box .hatebu-button { background-color: #2c6ebd !important; }
.author-box .google-plus-button { background-color: #dd4b39 !important; }
.author-box .instagram-button { background: #e1306c !important; }
.author-box .youtube-button { background-color: #ef1515 !important; }
.author-box .flickr-button { background-color: #0063dc !important; }
.author-box .pinterest-button { background-color: #bd081c !important; }
.author-box .line-button { background-color: #00c300 !important; }
.author-box .amazon-button { background-color: #ff9900 !important; }
.author-box .rakuten-room-button { background-color: #c42e7f !important; }
.author-box .github-button { background-color: #333 !important; }
.author-box .feedly-button { background-color: #2bb24c !important; }
.author-box .rss-button { background-color: #f26522 !important; }
.author-box .soundcloud-button { background-color: #ff7700 !important; }


/*▲サイドバープロフィールカスタマイズ▲*/



/*▼投稿ページの日付とパンくず削除▼*/

/* 投稿日時・投稿者・カテゴリーを消す */
.entry-meta {
    display: none;
}

/* 投稿日時を消す */
.post-date {
    display: none;
}

#breadcrumb {
display:none;
}

/* 全投稿ページと全固定ページでタイトルを非表示 */
.post .entry-title {
    display: none;
}

.page .entry-title{
	display: none;
}

/*▲投稿ページの日付とパンくず削除▲*/


/*Contact Form 7カスタマイズ*/
/*スマホContact Form 7カスタマイズ*/
@media(max-width:500px){
.inquiry th,.inquiry td {
 display:block!important;
 width:100%!important;
 border-top:none!important;
 -webkit-box-sizing:border-box!important;
 -moz-box-sizing:border-box!important;
 box-sizing:border-box!important;
}
.inquiry tr:first-child th{
 border-top:1px solid #d7d7d7!important;
}
/* 必須・任意のサイズ調整 */	
.inquiry .haveto,.inquiry .any {	
font-size:10px;
}}
/*見出し欄*/
.inquiry th{
 text-align:left;
 font-size:14px;
 color:#444;
 padding-right:5px;
 width:30%;
 background:#f7f7f7;
 border:solid 1px #d7d7d7;
}
/*通常欄*/
.inquiry td{
 font-size:13px;
 border:solid 1px #d7d7d7;	
}
/*横の行とテーブル全体*/
.entry-content .inquiry tr,.entry-content table{
 border:solid 1px #d7d7d7;	
}
/*必須の調整*/
.haveto{
 font-size:7px;
 padding:5px;
 background:#ff9393;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*任意の調整*/
.any{
 font-size:7px;
 padding:5px;
 background:#93c9ff;
 color:#fff;
 border-radius:2px;
 margin-right:5px;
 position:relative;
 bottom:1px;
}
/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item{
 display:block;
}
/*送信ボタンのデザイン変更*/
#formbtn{
 display: block;
 padding:1em 0;
 margin-top:30px;
 width:100%;
 background:#ffaa56;
 color:#fff;
 font-size:18px;
 font-weight:bold;	 
 border-radius:2px;
 border: none;
}
/*送信ボタンマウスホバー時*/
#formbtn:hover{
 background:#fff;
 color:#ffaa56;
}

/*H6見出しをリセットして再構築*/

.article h6 {
    padding: 0;
    background: none;
}

.article h6 {
    position:relative;
    background: #4aa7bf;/* 背景色 */
    color: #fff;/* 文字色 */
    font-size: 125%;/* 文字サイズ */
    font-weight: 700;/* 太さ */
    padding: 1em 1.1em;
    margin-top: 2.1em;
    margin-bottom: 1em;
    -webkit-border-radius: 3px;
    border-radius: 3px;/* 丸み */
    box-shadow: 0 1px 5px rgba(0,0,0,.03);
}

.article h6:before {
    position: absolute;
    left: 40px;/* 吹き出し位置左右 */
    bottom: -12px;/* 上下*/
    border-top: 12px solid #4aa7bf;/* 色 */
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 0;
    content: "";
}

/*----------------------------------------------------
  .res-img
----------------------------------------------------*/
.res-img { width: 50%; height:auto; }
 
@media only screen and (max-width:640px){
  .res-img {
  width: 100%;
  }
}


/*----------------------------------------------------
  会社情報表デザイン
----------------------------------------------------*/

.kaisha2{
  width: 100%;
  border-collapse: collapse;
}

.kaisha2 tr{
  border-bottom: solid 2px white;
}

.kaisha2 tr:last-child{
  border-bottom: none;
}

.kaisha2 th{
  position: relative;
  text-align: left;
  width: 30%;
  background-color: #52c2d0;
  color: white;
  text-align: center;
  padding: 10px 0;
}

.kaisha2 th:after{
  display: block;
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  top:calc(50% - 10px);
  right:-10px;
  border-left: 10px solid #52c2d0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

.kaisha2 td{
  text-align: left;
  width: 70%;
  text-align: center;
  background-color: #eee;
  padding: 10px 0;
  line-height: 140%;	
}


/*----------------------------------------------------
  画像横並びレスポンシブ
----------------------------------------------------*/


[class^="img-flex-"] {
	margin-bottom: 20px;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.img-flex-2 img { 
width: 49%;
height: auto;
align-self: flex-start;
}
.img-flex-3 img {
	width: 32%; 
height: auto;
align-self: flex-start;
}
.img-flex-4 img { width: 24%; }

/*----------------------------------------------------
　酒質表
----------------------------------------------------*/

.sake{
  border-collapse: collapse;
  border-spacing: 0px 0px;
  margin: 0 auto;
}

.sake td,th{
  padding: 10px;
  line-height: 105%;	
}
.sake th{
  background: #10a0e0;
  color: #fff;
}

.sake td{
  background: #f1fafe;
}


/*----------------------------------------------------
　カテゴリラベルを非表示
----------------------------------------------------*/

.cat-label {
display: none;
}


/*----------------------------------------------------
　横並び要素
----------------------------------------------------*/


*, *:before, *:after {
	box-sizing: border-box;
}
.col_2{
	width: 100%;
	display: flex;
	display: -ms-flexbox; /* IE10 */
	flex-wrap: wrap;
	-ms-flex-wrap: wrap; /* IE10 */
}
.col_2 > div{
	width: 50%;
	padding: 10px;
}
@media screen and (max-width: 960px) {
	.col_2 > div{
		width: 100%;
	}
}


/*----------------------------------------------------
　蔵人紹介
----------------------------------------------------*/

.cp_qa *, .cp_qa *:after, .cp_qa *:before {
	font-family:"Font Awesome 5 Free";, sans-serif;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.cp_qa dt {
	position: relative;
	margin: 0 0 1.5em 0;
}
.cp_qa dd {
	position: relative;
	margin: 0 0 2em 0;
	padding: 0 0 1.5em 2em;
	border-bottom: 1px dotted #0097a7;
}
.cp_qa dt::before, .cp_qa dd::before {
	font-size: 1.2em;
	margin: 0 0.5em 0 0;
	color: #ffffff;
	border-radius: 50%;
	display: inline-block;
	width: 1.3em;
	height: 1.3em;
	line-height: 1.2em;
}
.cp_qa dt::before {
	padding: 0.1em 0.3em;
	content: "\f128";
	background: #f57c00;
	font-weight: 900;
}
.cp_qa dd::before {
	padding: 0.12em 0.45em;
	content: "\f12a";
	background: #0097a7;
	font-weight: 900;
}
.cp_qa dt::after, .cp_qa dd::after {
	position: absolute;
	top: 0.5em;
	display: inline-block;
	width: 0;
	height: 0;
	content: '';
	border-width: 5px 0 5px 5px;
	border-style: solid;
}
.cp_qa dt::after {
	left: 1.5em;
	border-color: transparent transparent transparent #f57c00;
}
.cp_qa dd::after {
	left: 3.5em;
	border-color: transparent transparent transparent #0097a7;
}



/*----------------------------------------------------
　文字装飾
----------------------------------------------------*/

.shadow{
    color: #00BCD4;
    text-shadow: 2px 2px #fff, 3px 3px rgba(0, 188, 212, 0.4);
}



/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}





/************************************
** フッターロゴ
************************************/


.footer {
  margin-top: 40px; /*フッターとコンテンツの間に余白追加*/
  background: #222222; /*フッター背景色*/
}
.footer-bottom {
  margin-top: 14px; /*フッター内上部の余白を詰める*/
}
.footer-bottom-logo { /*ロゴの位置調整*/
  float: none;
  bottom: auto;
  position: static;
  margin-bottom: 10px;
}
.footer-bottom-logo .logo-image {
  padding: 0;
  max-width: 240px; /*ロゴ画像を少し大きく*/
  margin: 0 auto;
}
.footer-bottom-content { /*メニュー＆クレジットの位置調整*/
  float: none;
  text-align: center;
}
.navi-footer-in > .menu-footer { /*メニューの位置調整*/
  justify-content: center;
  margin-bottom: 1em;
}
.navi-footer-in a {
  color: #aab3b9; /*メニューの文字色*/
}
.navi-footer-in a:hover { /*メニューのマウスホバー時の指定*/
  color: #aab3b9; /*文字色を通常時と同じに*/
  background: none; /*背景色をなしに*/
  text-decoration: underline; /*アンダーラインを追加*/
}
.footer-bottom.fnm-text-width .menu-footer li {
  line-height: 1; /*メニューの区切りボーダーの高さを1文字分にする*/
}
.copyright {
  color: #aab3b9; /*クレジットの文字色*/
}
@media screen and (max-width: 834px) {
  .navi-footer-in > .menu-footer li.menu-item {
    border: none; /*モバイルでメニューのボーダーを消す*/
  }
}
@media screen and (max-width: 460px) {
  .navi-footer-in > .menu-footer li.menu-item { /*モバイルでメニューを1カラムにする*/
    width: 100%;
    display: block;
    flex: auto;
    padding: 0.3em 0;
  }
}



/************************************
** サイドバーSNS
************************************/

.sidebar .sns-follow-buttons {
  justify-content: center; /*ボタンを中央寄せにする*/
}
.sidebar .sns-follow {
  margin: 0 0 24px 0;
}
.sidebar .sns-follow-buttons a {
  border-radius: 50%;
  width: 40px; /*ボタンの横の大きさ*/
  height: 40px; /*ボタンの縦の大きさ*/
  font-size: 20px; /*アイコンのサイズ*/
  margin: 0 6px; /*ボタン同士の間隔*/
}
.sidebar .instagram-button {
  background-color: #c522b8 !important;
}

/************************************
** youtube中央配置
************************************/


.video-container {
margin: 0px auto;
}

/************************************
** コンテンツ上部余白消去
************************************/

.content-top {
  margin-top: 0;
}

.n2-ss-spinner-simple-white-container {
  padding: 0 ;
}



/*ヘッダーの色と高さ、アイコンの位置を調整*/
.search-menu-button.menu-button,
.navi-menu-button.menu-button{
	background-color: #FFFFFF;
	color: #000000;
	height: 60px;
	padding-top: 10px;
}

/************************************
** モバイルメニュー調整
************************************/


.logo-menu-button.menu-button{
	background-color: #FFFFFF;
	height: 60px;
}

/*768px以下でロゴの大きさ変更*/
@media screen and (max-width: 768px){
img.site-logo-image{
	width: 140px;
	margin: 5px auto 0;
}
}


/*スライドインメニューを右から*/
.navi-menu-content{
	left: auto;
	right: 0;
	background-color: #FFFFFF;
	transform: translateX(101%);
	max-width: 220px;}

.menu-drawer a{
	font-size: 1.2em;/*文字の大きさ*/
	color: #000000;/*文字の色*/
	height: 3em;/*行の高さ*/
}