/*
Theme Name: Storefront Child
Author: Daisuke Matsuno
Description: Child theme of Storefront. 
Version: 1.20.4
Template: storefront
*/

@import url(https://use.fontawesome.com/releases/v5.0.3/css/all.css);
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');



p{
	text-align: justify;
	text-justify: auto;
}


/* [WHOLE]Price 価格の表示(色、ｻｲｽﾞ)を商品の表示に合わせる */
.woocommerce-tabs ul.tabs li.active a,
ul.products li.product .price,
.onsale,
.wc-block-grid__product-onsale,
.widget_search form:before,
.widget_product_search form:before {
	color: #333333 !important;
}
li.product{
    font-size: 1rem !important;
}

/* [WHOLE]商品画像と商品名の間隔調整 */
ul.products li.product img,
ul.products li.product.product-category img{
	margin-bottom: 0.4em;
}



/* [HOME]Logo size for desktop site */
@media screen and (min-width: 768px) {
	.site-header .site-branding img,
	.site-header .site-logo-anchor img,
	.site-header .site-logo-link img {
		height: auto;
		max-height: none;
		max-width: none;
		width: 360px !important;
	}
}
@media screen and (min-width: 768px) {
	.woocommerce-active .site-header .site-branding img {
		max-width: 200%; 
	}
}

/* [HOME]Logo size for mobile site */
@media screen and (max-width: 768px) {
	.site-header .site-branding img {
		max-height: none !important;
		max-width: none !important;
		width: 360px !important;
	}
}


/* [HOME]ﾍｯﾀﾞｰのﾛｺﾞを含むｴﾘｱ */
header#masthead > div:first-child{
	padding-top:1em;
	padding-bottom:1em;
}

/* [HOME]ﾍｯﾀﾞｰ(PC)とﾌｯﾀｰ(Mobile)のｶｰﾄｱｲｺﾝを変更 */
/* PC */
.site-header-cart .cart-contents::after,
.storefront-handheld-footer-bar ul li.cart > a::before {
	content: "\f07a";
}


/* [HOME]ﾒｲﾝﾒﾆｭｰのﾘｽﾄ間隔（英語/日本語） */
#menu-main li{padding-right:1.4em;}
#menu-main-japanese li{margin-right:-0.6em;}

/* [HOME]ﾒｲﾝｻﾌﾞﾒﾆｭｰ */
.sub-menu{
	width:18em;
	white-space: nowrap;
}
.main-navigation ul ul li a {
	width:20.5em;
}


/* [HOME]ｺﾝﾃﾝﾂの一番上の部分（Handmade with Alohaの表示） */
.above-content-widget-title{
	text-align: center;
	font-size: 2.4em;
	margin-bottom: 0;
}

/* [HOME]SHOPﾎﾞﾀﾝ*/
.btn-flat-border {
	display: inline-block;
	padding: 0.5em 1em;
	text-decoration: none;
	color: #999;
	border: solid 2px #1a1a1a;
	border-radius: 3px;
	transition: .4s;
	background: #1a1a1a;
	color: white;
}
.btn-flat-border:hover {
	background: #fff;
	color: #999;
}

/* [HOME]Featured Productsなどの、行間調整*/
.storefront-product-section ul.products li.product{
    margin-bottom: 0;
}




/* [SHOP]商品(及びｶﾃｺﾞﾘｰ)表示を1段3列表示した場合、右側に余計なｽﾍﾟｰｽが表示されるので対処 */
ul.columns-3 {
	padding-left: 2em;
	padding-right:2em;
}




/* [FOTTER] **************************/
.site-footer a{
	text-decoration:none !important;
}
.site-footer a:hover{
	color:#bbb !important;
}
.nav2 a{	/* Footer Widget1 */
	font-size:1.2em;
	color:#6d6d6d !important;
}



/* [FOTTER] SNS BOTTON **************************/
.sns_box{
	width:160px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

.sns_button {
	float:left;
	box-shadow: inset 0 0 0 2px #999;
	border-radius: 100%;
	-moz-transition: all 280ms ease;
	-o-transition: all 280ms ease;
	-webkit-transition: all 280ms ease;
	transition: all 280ms ease;
}
.sns_button a {
	display: table-cell;
	width: 44px;
	height: 44px;
	color: #fff;
	text-align: center;
	vertical-align: middle;
	-moz-transition: all 280ms ease;
	-o-transition: all 280ms ease;
	-webkit-transition: all 280ms ease;
	transition: all 280ms ease;
}
.sns_button i {
	font-size: 20px;
	vertical-align: middle;
}
.sns_button:hover {
	box-shadow: inset 0 0 0 22px #fcfcfc;
}

.sns_button + .sns_button {
	margin: 0 0 0 12px;
}

.twitter:hover a {color: #1B95E0 !important;}
.facebook:hover a {color: #00f !important;}
.instagram:hover a {color: #f88 !important;}





.mep_event_grid_item .mep_list_thumb img {
    height: auto !important;
}


/* Header*/
.site-header .site-branding img{
    max-width: 270px; /* original:230px*/
}

/* Menu*/
/* 高さ調整 */
.main-navigation ul.menu > li > a,
.main-navigation ul.nav-menu > li > a {
    padding: 0.6em 1em;
}

.site-header-cart .cart-contents {
    padding: 0.6em 0;
}

/* ﾒﾆｭｰ下のｳｨｼﾞｪｯﾄ */
#text-7{
	padding:0.3em 0 !important;
}

/* TOP画像 ｽﾏﾎは崩れるのでPCだけ固定設定 */
/* 事前準備：CSSﾊｯｸｽｸﾘﾌﾟﾄ "css_browser_selector.js" を/wp/jsに配置する。 */
.win .has-post-thumbnail,
.mac .has-post-thumbnail{
	background-attachment: fixed;
	height:500px !important;
}

/* TOPテキスト（ﾃｷｽﾄは非表示中）余白 */
.page-template-template-homepage.has-post-thumbnail .type-page.has-post-thumbnail {
/*	padding-top:    10.8535260698em;
	padding-bottom: 10.8535260698em;
*/	
	padding-top:    13em;
	padding-bottom: 13em;
}



/* TOPﾍﾟｰｼﾞ */
/* 商品ｴﾘｱ全体の間隔 */
.content-area, .widget-area {
/***	margin-bottom: 0;*/
}
/* Best SellersとWe Recommendの間隔 */
.columns-4 ul.products li.product {
/***    margin-bottom: -2em;*/
}



/* ﾊﾟﾝくずﾘｽﾄ*/
.storefront-breadcrumb {
    margin: 0 0 1em;
}



h1, .section-title{
	font-family: 'Open Sans', sans-serif !important;
}

/* display設定（Contactで使用）*/
.dp-t	{display:table;margin-bottom:1em;}
.dp-tr	{display:table-row;}
.dp-tc	{display:table-cell;padding-right:0.5em;}


hr {
    margin: 1.41575em 0;
}

a  {
    outline :none !important;
}

.red{color:#f00;}

.entry-header .entry-title{text-align:center;}






/* SHOP */
/* ｺﾝﾃﾝﾂ高さ調整 */
.storefront-full-width-content .woocommerce-products-header, .storefront-full-width-content.woocommerce-account .entry-header, .storefront-full-width-content.woocommerce-cart .entry-header, .storefront-full-width-content.woocommerce-checkout .entry-header {
    padding: 0 0 1.6em;
}

/* 固定ﾍﾟｰｼﾞ */
/* ｺﾝﾃﾝﾂ高さ調整 */
h1.entry-title {
    margin-bottom: 1em;
}

h1.entry-title.loaded,
h1.sub-title{
	color: #fff !important;
/*	text-shadow: 0 0 10px #df5464, 0 0 15px #df5464;
*/ 
}

h1.sub-title{margin-bottom: 4px;}


.box1 {
    position: relative;
    padding: 20px !important;
	margin-bottom:40px;
    border: 2px solid #aaa;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0);
}



/* [よくあるご質問] FAQﾊﾟﾈﾙ */
.faq-pretty .faq-question{
	border: 1px solid #a1917e;	/* biege a1917e*/
	color: #a1917e;
	font-size: 1.0rem;
	font-weight: 400;
}

.faq-pretty .faq-item.highlight .faq-question{
	border: 1px solid #72c6f9;	/* blue */ 
	color: #72c6f9;
	border-bottom: 0px;
}

.faq-pretty .faq-answer{
	border: 1px solid #72c6f9;
	border-top: 0px;
}




/******************** CONTACT ********************/
.left {float:left;}
.clear{clear:both;}

#mc_embed_signup .input-text,
#mc_embed_signup input[type="email"],
#mc_embed_signup input[type="text"],
#mc_embed_signup textarea,
.wpcf7-form .input-text,
.wpcf7-form input[type="email"],
.wpcf7-form input[type="text"],
.wpcf7-form textarea
{
	padding: 0.5em;
	background-color: #f2f2f2;
	color: #43454b;
	border: 0 !important;
	-webkit-appearance: none;
	box-sizing: border-box;
	font-weight: 400;
	box-shadow: inset 0 1px 4px rgba(0,0,0,.125);
	width:96%;
}

#mc_embed_signup input,
.wpcf7-form input{
	border-radius:3px;
	margin-bottom:1em;
}


/* Mail Chimp*/
#mc_embed_signup .button {
/*	height: 2.6em !important; */
}

.asterisk{color:#ff0000;}


/* Contact Form 7*/
.wpcf7-form {
	display: block;
	position: relative;
	text-align: left;
/*
	padding: 10px 0 10px 3%;
*/
}

.indicates-required {
	text-align: right;
	font-size: 12px;
	margin-right: 4%;
}

input[type="submit"] {
	background-color: #333 !important;
	border-color: #333;
	font-size:16px !important;
	color: #fff;
}
/******************** CONTACT ********************/




/******************** EVENT INFO ********************/
.ticker-news-box {overflow: hidden !important;}
.ticker-news-box span.breaking-news {background: #c89393;;}
.ticker-news-box span.breaking-news {
    display: inline-block;
    float: left;
    position: relative;
    margin-right: 25px;
    color: #ffffff;
    font-size: 14px;
    line-height: 12px;
    text-transform: uppercase;
    padding: 8px 17px 8px 12px;
    background: #c89393;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
}

.ticker-news-box span.breaking-news::after {background: #c89393;;}
.ticker-news-box span.breaking-news::after {
    content: '';
    position: absolute;
    width: 22px;
    height: 22px;
    background: #c89393;;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 3px;
    right: -7px;
}

.header-widget-region .widget {
    padding: 1.2em 0 0 0;
}
/******************** EVENT INFO ********************/


/******************** FOOTER BAR ********************/
.storefront-handheld-footer-bar ul li.home > a:before {
	content: "\f015";
}
.footer-widget-1 .widget{
	margin: 0 0 1em;
}

.footer-widgets {
    padding-top: 1.3em;
}

.site-footer{
	padding: 0.8em 0 2em 0;
}

.site-info{
	padding: 1.5em 0 0 0;
}


/* 未使用 ********************
.nav1 ul{
	display: table;
	margin: 0 auto;
	padding: 0 ;
	width: 100%;
	text-align: center;
}

.nav1 li{
	display: table-cell;
	min-width: 50px;
}

.nav1 a{
	text-decoration:none !important;
	font-weight: bold;
}

.nav1 a:hover{
	color:#999;
}
** 未使用 ***********************/
/******************** FOOTER BAR ********************/






/******************** Woocommerce Events Manager ********************/
/* ﾃﾞｻﾞｲﾝ 調整*/
/****** ﾊﾞｰｼﾞｮﾝｱｯﾌﾟに伴いｺﾒﾝﾄｱｳﾄ
.mep_event_grid_item {
	text-align:center;
}

.mep_event_grid_item {
	margin-bottom: 5%;
}

.mep_list_thumb {
	max-height: 240px;
}

.mep-month {
	margin: -8px;
}

.evl-cc {
	width: 80%;
}
****** ここまで/

/* No Seat Avaulable, Share This Eventを表示しない*/
.event-expire-btn {
    display: none !important;
}

/* EVENT 料金・席・SNSを表示しない */
.df-price,
.df-seat,
.mep-default-sidrbar-social{
    display: none !important;
}

.fa .fa-facebook::before {
	font-family: "Font Awesome 5 Free" !important;
	font-weight: 900 !important;
	content: "\f39e" !important;
}
/******************** Woocommerce Events Manager ********************/


/******************** Woocommerce Products Per Page ********************/
/* Woocommerce Events Manager とｺﾝﾌﾘｸﾄするので対策 */
.woocommerce-pagination .page-numbers {
	border: 0px solid #ddd;
	padding: 0;
}
/******************** Woocommerce Products Per Page ********************/

/******************** CHECK OUT ********************/
/* Woocommerce Events Manager とｺﾝﾌﾘｸﾄするので対策 */
#customer_details .col-2{
    width: 100%;
}
/******************** CHECK OUT ********************/