@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
.entry-title {
    display: none;
}
body a {text-decoration: none;}
body a:hover { color: #a0a0a0; }
body a:hover img { opacity: 0.8; }
/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}
@media screen and (max-width: 959px) {
/* 959px以下に適用されるCSS（タブレット用） */

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

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}
/* ▼ title ▼ */
.st_wrap {
	margin: 0 auto;
	width: 100%;
	text-align: center;
	font-family: 'Cormorant Garamond', serif;
	font-weight: 400;
}
.st_wrap h2 span.st_e {
	padding: 0 70px 10px;
	position: relative;
	display: inline-block;
	font-size: 1.25rem;
	font-weight: 200;
}
.st_wrap h2 span.st_e:before, .st_wrap h2 span.st_e:after {
	content: '';
	position: absolute;
	top: 35%;
	display: inline-block;
	width: 50px;
	height: 1px;
	background-color: #a0a0a0;
}
.st_wrap h2 span.st_e:before {
	left:0;
}
.st_wrap h2 span.st_e:after {
	right: 0;
}
.st_wrap h2 span.st_j {
	display: block;
	font-size: 1.875rem;
	font-weight: 400;
}
/* ▲ title ▲ */
/* ▼ 酒類注意書き ▼ */
.note_footer {
	margin: 0 auto 80px;
	padding: 15px 30px;
	width: 80%;
	text-align: center;
	font-size: 1rem;
	line-height: 1.5;
	color: #222;
	border: 1px solid #a0a0a0;
}
@media screen and (max-width: 959px) {
	.note_footer {
		width: 85%;
		font-size: 0.75rem;
	}
}
@media screen and (max-width: 480px) {
	.note_footer {
		width: 80%;
	}
}
/* ▲ 酒類注意書き ▲ */
/* ▼ 投稿ページ ▼ */
.article h2 {
	padding: 25px 0;
}
.article blockquote {
	padding-left: 0;
	color: #a0a0a0;
}
/*投稿日を非表示にする*/
.post-date {
	display: none;
}
/* ▲ 投稿ページ ▲ */
/*FONT
-------------------------------------*/
ol li {
	list-style: none;
}
.tips {
	font-weight: 600;
}
/* ▼ spec ▼ */
.tax {
	font-size: 0.8rem;
}
.note-price {
	font-size: 0.8rem;
	text-align: right;
}
/* ▲ spec ▲ */
/* ▼ heading ▼ */
.catch_wrap {
	text-align: center;
}
.catch_wrap h3 {
	margin-bottom: 10px;
	color: #1e846a;
	font-weight: 600;
	font-size: 1.375em;
}
.article h3.gr,
.article h4.gr,
.article h5.gr {
	padding-left: 0;
	padding-right: 0;
	color: #1e846a;
	font-weight: 600;
}
.article h3.gr {
	margin-bottom: 15px;
	font-size: 1.625em;
	border-bottom: 1px solid #1e846a; 
}
.article h4.gr {
	margin-bottom: 15px;
	font-size: 1.5em;
	border-bottom: 1px solid #1e846a; 
}
.article h5.gr {
	margin-bottom: 0;
	font-size: 1.25em;
}
/* ▲ heading ▲ */
/* =================================================
	改行位置切り替え
=================================================*/
br.br-pc {
	display: inline;
}
br.br-sp {
	display: none;
}
br.br-tab {
	display: none;
}
br.br-tabmini {
	display: none;
}
br.br-iPhone {
	display: none;
}
br.br-se {
	display: none;
}
@media screen and (max-width: 768px) {
	br.br-pc {
		display: none;
	}
	br.br-sp {
		display: block;
	}
	br.br-tab {
		display: inline;
	}
}
@media screen and (max-width: 699px) {
	br.br-tabmini {
		display: inline;
	}
}
@media screen and (max-width: 600px) {
	br.br-sp {
		display: inline-block;
	}
}
@media screen and (max-width: 480px) {
	br.br-iPhone {
		display: inline;
	}
}
@media screen and (max-width: 320px) {
	br.br-se {
		display: inline;
	}
}
/* ▼ 汎用エリア ▼ */
.article,
.article_wrap {
	margin: 0 auto;
	width: 920px;
}
@media screen and (max-width: 959px) {
/* 959px以下に適用されるCSS（タブレット用） */
	.article,
	.article_wrap {
		width: 96%;
	}
}
/* ▲ 汎用エリア ▲ */
/* ▼ 矢印 ▼ */
.arrow {
	display: inline-flex;
	color: #222;
}
.arrow::after {
	content: '';
	width: 24px;
	height: 8px;
	border-bottom: solid 1px;
	border-right: solid 1px;
	transform: skew(45deg);
	color: #222;
}
a:hover span.arrow,
a:hover span.arrow::after {
	color: #a0a0a0;
}
a span.arrow {
	transition: all 0.5s;
}
a:hover span.arrow {
	transform: translate(5px,0);
}
/* ▲ 矢印 ▲ */
/* ▼ ヘッダーエリアPC ▼ */
#header-container {
	padding-top: 10px;
	height: 80px;
	box-shadow: 0px 10px 10px -5px rgba(0,0,0,0.1);
}
.header-container-in.hlt-top-menu .logo-image {
	padding-top: 5px;
}
/* ▲ ヘッダーエリアPC ▲ */
/* ▼ フッターエリア ▼ */
#footer {
	background: #005840 url("https://www.yaesu-meijo.co.jp/shirakami/images/common/foot.png") repeat-x top left;
	background-size: contain;
}
#custom_html-3 {
	margin-top: 90px;
	margin-bottom: 0;
}

.footer-widgets {
	margin: 0;
}
.footer-left {
	padding: 0 0 0 10px;
}
.footer-bottom {
	margin-top: 0;
}
@media screen and (max-width: 959px) {
	#footer {
		padding-top: 40px;
	}
}
/* ▲ フッターエリア ▲ */
/* ▼ フッターエリア 八重寿リンク ▼ */
#footer #yaesu {
	font-size: 1.75rem;
	font-weight: 600;
	line-height: 1;
	text-shadow: 0 0 10px #003124;
}
#footer #yaesu a:hover {
	background-color: rgba(255, 255, 255, 0);
	opacity: 0.7;
}
/* ▲ フッターエリア 八重寿リンク ▲ */
/* ▼ コピーライト ▼ */
.copyright {
	font-size: 12px;
}
/* ▲ コピーライト ▲ */
/* ▼ footer-widgetsを表示 ▼ */
@media screen and (max-width: 834px) {
	.footer-widgets {
		display: block;
	}
	#custom_html-3 {
		margin: 30px 0 10px;
		text-align: center;
	}
	.footer-left,
	.footer-right,
	.footer-center {
		padding: 0
	}
	#footer #yaesu {
		font-size: 1.375rem;
	}
}
@media screen and (max-width: 480px) {
	#custom_html-3 {
		margin: 10px 0 15px;
		text-align: center;
	}
}
/* ▲ footer-widgetsを表示 ▲ */
/* ▼ パンくず ▼ */
.article nav {
	margin-top: 50px;
}
.article nav ol li {
	margin: 0 10px 0 0;
	display: block;
	float: left;
}
.article nav ol li a {
	position: relative;
	display: inline-block;
	padding: 0 14px 0 0;
}
.article nav ol li a:after {
	content: '';
	display: block;
	width: 5px;
	height: 5px;
	border-right: solid 1px #a5afaf;
	border-bottom: solid 1px #a5afaf;
	position: absolute;
	right: 0;
	top:9px;
	color: #a5afaf;
	-webkit-transform: rotateZ(-45deg);
	transform: rotateZ(-45deg);
}
/* ▲ パンくず ▲ */
/* ▼ パンくずとフッターの空き ▼ */
.entry-content{
	margin-bottom: 0;
}
/* ▲ パンくずとフッターの空き ▲ */
/* =================================================
	フェードイン　アニメーション
=================================================*/
/* 下から上に移動しながらフェードイン */
.fadeInUp {
	opacity: 0;
	transform: translateY(100px);
}
/* 上から下に移動しながらフェードイン */
.fadeInDown {
	opacity: 0;
	transform: translateY(-100px);
}
/* 右から左に移動しながらフェードイン */
.fadeInLeft {
	opacity: 0;
	transform:  translate(-100px, 0);
}
/* 左から右に移動しながらフェードイン */
.fadeInRight {
	opacity: 0;
	transform: translateX(100px);
}
/* その場でフェードイン */
.fadeInDisplay {
	opacity: 0;
}
/* フェードインアニメーション */
@keyframes fadeIn {
	0% {
	}
	100% {
		opacity: 1;
		transform: translate(0);
	}
}
/* フェードインさせるクラス */
.fadeIn {
	animation-name: fadeIn;
	animation-duration: 1s;
	animation-fill-mode: forwards;
}
/* ▼ アニメーション その場 ▼ */
.anim-show {
	animation: animShow 3s ease forwards;
}
@keyframes animShow {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}
/* ▲ アニメーション その場 ▲ */
/* =================================================
	商品情報頁共通
=================================================*/
.pro_wrap {
	margin: 0 auto;
	width: 920px;
	display: flex;
	align-items: center;
}
.pro_pct {
	width: 50%;
}
dl.pro_text dt {
	padding-bottom: 10px;
	font-size: 2rem;
	line-height: 1.5;
	font-weight: 600;
	border-bottom: 1px solid #a0a0a0;
}
dl.pro_text dd {
	margin-left: 0;
	padding: 10px 0 20px;
	font-size: 1.125rem;
}
dl.pro_text dd.pro_catch {
	font-size: 1.375rem;
}
.article_spec {
	margin: 0 auto;
	width: 700px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.pro_spec {
	width: 50%;
}
.chart {
	width: 48%;
}
@media screen and (max-width: 959px) {
	.pro_wrap {
		margin: 0 auto;
		display: block;
		width: 70%;
	}
	.pro_spec,
	.chart,
	.pro_pct,
	.pro_text {
		width: 100%;
	}
	.article_spec {
		width: 96%;
	}
	.pro_text {
		text-align: center;
	}
}
@media screen and (max-width: 480px) {
	.article_spec {
		display: block;
	}
	.pro_wrap {
		width: 96%;
		text-align: center;
	}
	dl.pro_text dt {
		font-size: 1.75rem;
	}
	dl.pro_text dd.pro_catch {
		font-size: 1.25rem;
	}
	.pro_pct,
	.pro_text {
		margin: 0 auto;
		width: 96%;
	}
}
/* =================================================
	商品情報｜関連商品
=================================================*/
.items h4 {
	border-bottom: solid 1px #acacac;
}
.items_wrap {
	margin: 0 auto 15px;
	width: 920px;
	display: flex;
	justify-content: flex-start;
}
.items_pro {
	width: 22%;
	text-align: center;
	border: #cccccc solid 1px;
	display: block;
	position: relative;
}
.items-pro_img {
	margin: 15px auto 5px;
	width: 85%;
}
.items_pro a::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top:0;
	left:0;
}
.items_pro a p {
	margin-bottom: 15px;
}
.release-info {
	display: flex;
	align-items: center;
}
.article p.cat {
	margin: 0.2rem 0 0.5rem;
	padding: 0.1rem 0.3rem;
	font-size: 16px;
	border: solid 1px #acacac;
	display: inline-block;
	vertical-align: middle;
}
.article p.release-date {
	margin-bottom: 5px;
	padding: 0 0 0 15px;
	font-size: 16px;
	color: #cc3333;
}
@media screen and (max-width: 959px) {
	.items_wrap {
		width: 100%;
	}
	.release-info {
		margin-top: 20px;
		justify-content: center;
	}
}
@media screen and (max-width: 480px) {
	.items_pro {
		margin-bottom: 20px;
		width: 47%;
	}
}
/* ▼ 関連商品 サムネイル空き▼ */
.article .related-pro {
	margin-right: 20px;
}
@media screen and (max-width: 480px) {
	.article .items_wrap {
		justify-content: space-between;
	}
	.article .related-pro {
		margin-right: 0;
	}
}
/* ▲ 関連商品 サムネイル空き▲ */
