@charset "utf-8";
/*
Theme Name: Clown Belt Homies
Template: storefront
*/
@import "css/cart.css";
@import "css/qa.css";
@import "css/single.css";
@import "css/shop.css";
@import "css/page.css";
@import "css/category.css";
@import "css/footer.css";
@import "css/header.css";
@import "css/item.css";
@import "css/jquery.bxslider.css";
@import "css/page-front.css";
@import "css/style_pc.css";
@import "css/style_sp.css";
@import "css/my_page.css";
@import "css/contact.css";


/* =Base
-------------------------------------------------------------- */
body {
	color: #000;
	font-family: "Sawarabi Gothic";
	background-color:#fff;
	font-style: normal;
	font-size: .875em;
	margin: 0;
	padding: 0;
	word-wrap: break-word;}


ol,
ul {
	list-style:none;
	margin:0;
	padding:0;}

.clearfix::after {
	content: "";
	display: block;
	clear: both;
}

/* =Font
-------------------------------------------------------------- */
.whisper-regular {
  font-family: "Whisper", cursive;
  font-weight: 400;
  font-style: normal;
}


/* =Link
-------------------------------------------------------------- */
a:link,
a:visited {
	text-decoration:none;
	border-style:none;
	outline: none;
	color:#49491e;
	}

a:hover,
a:active {opacity: 0.7;
	border-style:none;
	outline: none;
	color:#006699;} 



p.has-text-align-center{
	text-align:center;}

figure.left_figure{
	width:60%;
	margin-right:3%;
	float:left;}

figure.left_figure img{
	width:100%;
	height:auto;
	display:block;}


.mt100{ margin-top:100px;}
.mb30{ margin-bottom:30px;}

/* =Title
-------------------------------------------------------------- */
header.woocommerce-products-header h1.woocommerce-products-header__title page-title,
header.woocommerce-products-header h1.page-title,
header.category-header h1.page-title{
	text-align:center;
	color:#49491e !important;
	font-weight:bold;}

/**********************************************************/
/*コンテンツ            
/**********************************************************/
.page-template-template-front_fullwidth-php .content-area{
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0; }

.entry-content ul.products li.product-category img{
	border-radius: 300px;        /* CSS3草案 */  
	-webkit-border-radius: 300px;    /* Safari,Google Chrome用 */  
	-moz-border-radius: 300px;   /* Firefox用 */}

.entry-content p.has-text-align-center{
	display:block;
	text-align:center;}

/* =contetns
-------------------------------------------------------------- */

/* -- content -- */
#content {
	padding: 0 !important;	
	margin: 0 !important;
}

#content.site-content{
	padding: 0 !important;
	margin: 0 !important;
	}

#content header {
	position: inherit;
	margin: 0 0 1.42857em;
	padding: 0;	
	border: none;
}
#content .page-title,
#content .entry-title{
	font-size: 2.142857em;
	margin-bottom: 1.25em;
	line-height: 1.25em;
}

/* -- show-on-front -- */

/* - blog - */
.blog #content article {
	margin-bottom: 1.42857em;
	padding-bottom: 1.42857em;
	border-bottom: 1px solid #eaeaea;
}
.blog #content .entry-title {
	margin-bottom: 20px;
}
.blog #content .entry-meta {
	margin-bottom: 20px;
}
.blog #content .entry-content {
	margin-bottom: 0;
}
.blog #content .entry-content .loopimg {
	margin-bottom: 20px;
}

/**********************************************************/
/*メニュー                           　　　　　　　　　　　*/
/**********************************************************/

.cl {
  line-height: 0;
  font-size: 0;
  clear: both;
  padding: 0;
  margin: 0;
  height: 0;
  width: 0;
}

.btn {
  background: url(images/btn.png);
  background-color:transparent;
  background-position:0 0;
  background-repeat:no-repeat;
  background-size: 60px 30px;
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 15px;
  right: 10px;
  cursor: pointer;
  z-index: 200 !important;}

.peke {
  background-position: -30px 0;
  z-index: 300 !important;
}

.drawr {
  display: none;
  background-color: rgba(0,0,0,0.6);
  position: absolute;
  top: 0px;
  right: 0;
  width: 260px;
  padding: 60px 0 20px 20px;
  z-index: 100;
}

.drawr a{
	color:#fff;}

.drawr ul#menu{
	width:210px;
	border-top:1px #fff dotted;
	margin: 0 50px 0 0;
	padding: 0;}

.drawr ul#menu li{
	width:100% !important;
	display:block;
	padding:5px 0;
	margin:0;
	border-bottom:1px #fff dotted;
	font-size:100%;}

/**********************************************************/
/*トップページ
/**********************************************************/

@media screen and (min-width: 769px){
.storefront-breadcrumb,
#content.site-content,
.wp-block-woocommerce-empty-cart-block{
	max-width:1200px !important;
	width:90% !important;
    	margin-left: auto !important;
    	margin-right: auto !important;}

body.single-product #content.site-content{
	max-width:1200px !important;
	width:90% !important;
    	margin-left: auto !important;
    	margin-right: auto !important;}

body.single-product #content.site-content #primary.content-area{
	width:100% !important;}

.col-full{
	max-width:1200px !important;
	width:100% !important; }

}


@media screen and (max-width: 768px){
.storefront-breadcrumb,
#content.site-content,
.wp-block-woocommerce-empty-cart-block{
	width:95% !important;
    	margin-left: auto !important;
    	margin-right: auto !important;}}

  .col-full header.entry-header h1.entry-title{
	font-size:350%;
	margin-bottom:50px;}

  .col-full .entry-content p{
	text-align:left;}

section.storefront-product-categories ul.products li img{
	border-radius: 300px;		/* CSS3草案 */
	-webkit-border-radius: 300px;	/* Safari,Google Chrome用 */
	-moz-border-radius: 300px;	/* Firefox用 */
	}

/**********************************************************/
/*google map 
/**********************************************************/
.entry-content iframe{
	width:100%;
	height:300px;}
