@charset "utf-8";

/* ------------------------

※すべての要素に「box-sizing:border-box;」を指定してあります※

	01. reset
	02. 共通
	03. header
	04. contentsWrap
	05. sideL
	06. sideR
	07. footer
	
------------------------ */


/*==============================================================
	
	01. reset
	
==============================================================*/

html,body,div,h1,h2,h3,h4,p,ul,ol,figure,adress {
	margin:0;
	padding:0;
}

h1,h2,h3,h4 {
	font-size:100%;
	font-weight:normal;
}

ol,ul {
	list-style:none;
}

a {
	text-decoration:none;
}

a:hover {
	opacity:0.7;
	text-decoration:none;
}

a img {
	border:none;
}

img {
	width:100%;
	vertical-align:middle;
}
	
*, *:before, *:after {
    -webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}


/*==============================================================
	
	02. 共通
	
==============================================================*/

body {
	color:#333;
	font-family:"メイリオ","Hiragino Kaku Gothic ProN", sans-serif;
}

header,.slider,.container,footer {
	width:100%;
}

.ct {
	text-align:center;
	}
.text_bold {
	font-weight:bold;
}

/*文字装飾*/
.u {text-decoration:underline;}
.r {color:#f00;}
.y {background-color:#ff0;}
.fw10 {font-weight:100;}
.fw30 {font-weight:300;}
.fw50 {font-weight:500;}
.fw70 {font-weight:700;}
.fw90 {font-weight:900;}
.fs11 {font-size:1.1em;}
.fs12 {font-size:1.2em;}
.fs13 {font-size:1.3em;}
.fs14 {font-size:1.4em;}
.fs15 {font-size:1.5em;}
.fs16 {font-size:1.6em;}
.fs17 {font-size:1.7em;}
.fs18 {font-size:1.8em;}
.fs19 {font-size:1.9em;}
.fs20 {font-size:2em;}
.fs25 {font-size:2.5em;}
.lh15 {line-height: 1.5;}
.lh16 {line-height: 1.6;}
.lh17 {line-height: 1.7;}
.lh18 {line-height: 1.8;}
.lh19 {line-height: 1.9;}
.lh20 {line-height: 2.0;}

/* clearfix */

.clearfix:after,.header_pc:after,.header_nav:after,.archive01:after,
footer ul:after,.ranking div:after,.news div:after,.news_list:after,
.ttl_page:after,.breadcrumb:after,.category:after,.archive02:after,
.btBox:after,.item_photoBox ul:after {
	clear:both;
	content:"";
	display:block;
}

/**/

/* タイトル */

.ttl_page {
	background:url(../img/top_bg.jpg) no-repeat;
	background-size:cover;
	padding:1.7em 3em 1.3em;
	width:100%;
}

.ttl_page h2 {
	float:left;
	font-size:1.125em;
	font-weight:bold;
}

.ttl_01 {
	border-bottom:solid 3px #ccc;
	font-size:1.5em;
	font-weight:bold;
	padding-bottom:0.5em;
}
.ttl_01 br {
	display:none;
}
	
.ttl_02 {
	font-size:1.125em;
	font-weight:bold;
	margin-bottom:3em;
}
.ttl_03 {
	background:url(../img/arrow04.png) no-repeat left center;
	font-size:1.125em;
	font-weight:bold;
	margin-bottom:1em;
	padding-left:1em;
	text-decoration:underline;
}

/**/

/* パンくずリスト */

.breadcrumb {
	float:right;
	font-size:0.75em;
}
.breadcrumb li {
	float:left;
}
.breadcrumb li a {
	color:#333;
}
.breadcrumb li span {
	padding:0 0.5em;
}

/**/

/* 一覧 */
.archive01 {
	background:#fff;
}
.archive01 a {
	color:#333;
}
.archive01 figure {
	float:left;
	margin-bottom:2em;
	padding:1em;
	width:20%;
}
.archive01 figure figcaption {
	font-weight:bold;
	padding:1em;
	text-align:center;
}

.archive02 a {
	color:#333;
}
.archive02 div {
	border:solid 5px #ccc;
	float:left;
	margin:0 2% 2em;
	padding:1em;
	width:29.33%;
}

.archive02 div h4 {
	font-size:0.875em;
	margin-bottom:1em;
}
.archive02 div p:last-child {
	font-size:0.75em;
	margin-top:1em;
	text-align:right;
}
/**/

/* ボタン */
.bt_submit {
	background:#4ec24e url(../img/arrow05.png) no-repeat center right 25%;
	border:none;
	color:#fff;
	display:block;
	margin:0 auto;
	padding:1.5em 2em 1.5em 0;
	text-align:center;
	width:250px;
}
.bt_submit:hover,.bt_cartIn:hover {
	opacity:0.7;
}
.bt_cartIn {
	background:#4ec24e url(../img/cartIn.png) no-repeat center left 22%;
	border:none;
	color:#fff;
	display:block;
	padding:1em 0 1em 2em;
	text-align:center;
	width:250px;
}

.bt_01 {
	background:url(../img/arrow06.png) no-repeat center right 15%;
	border:solid 1px #ddd;
	color:#555;
	display:block;
	padding:1em 2em 1em 0;
	text-align:center;
	width:250px;
}
/**/

/* list */
.list_square {
	list-style:square;
	margin-left:1em;
}
.list_alpha {
	list-style:lower-alpha;
	margin:0 0 1em 2em;
}
.list_disc {
	list-style:disc;
	margin-left:1.5em;
}
/**/

@media screen and (max-width: 767px) {
	
	/*文字装飾*/
.fs11 {font-size:1em;}
.fs12 {font-size:1em;}
.fs13 {font-size:1.1em;}
.fs14 {font-size:1.1em;}
.fs15 {font-size:1.2em;}
.fs16 {font-size:1.2em;}
.fs17 {font-size:1.5em;}
.fs18 {font-size:1.3em;}
.fs19 {font-size:1.4em;}
.fs20 {font-size:1.4em;}
.fs25 {font-size:1.5em;}

	.ttl_page {
		padding:1.5em 1em;
	}
	.ttl_01 {
		border-bottom:solid 3px #ccc;
		font-size:1em;
		font-weight:bold;
		padding-bottom:0.5em;
	}
	.ttl_01 br {
		display:inline;
	}

	.ttl_02 {
		font-size:0.875em;
		margin-bottom:1em;
	}
	.ttl_03 {
		font-size:0.875em;
		margin-bottom:1em;
	}

	.breadcrumb {
		display:none;
	}
	.archive01 {
		padding:1em;
	}
	.archive01 figure {
		margin-bottom:0;
		padding:0.5em;
		width:33.333%;
	}
	.archive01 figure figcaption {
		font-size:0.8em;
		padding:0.5em;
	}
	.archive02 div {
		border:solid 3px #ccc;
		margin:0 1% 1em;
		padding:0.5em;
		width:48%;
	}
	.bt_cartIn {
		margin:0 auto;
	}
	
}



/*==============================================================
	
	03. header
	
==============================================================*/

.header_pc {
	min-width:1000px;
}

.header_sp {
	display:none;
}

.headerL {
	display:table;
	float:left;
	width:30%;
}
.headerL a {
	display:table-cell;
	vertical-align:middle;
}
.home {
	background:#4ec24e;
	color:#fff;
	font-size:0.875em;
	text-align:center;
	width:15%;
}
.home:before {
	content:url(../img/home.png);
	display:block;
}
.home img {
	max-width:17px;
}
.logo {
	width:85%;padding-left:20px;
}
.logo img {
	max-width:300px;
}
	
.headerR {
	border-left:dotted 1px #ddd;
	float:right;
	width:70%;
}
.header_wrap {
	display:table;
	width:100%;
}
.header_wrap p {
	display:table-cell;
	font-size:0.85em;
	padding:1em 0 1em 30px;
	vertical-align:middle;
	width:76%;
}
.register_bt,.login_bt {
	color:#fff;
	display:table-cell;
	font-size:0.85em;
	vertical-align:middle;
	padding:1.5em 0;
	text-align:center;
	width:12%;
}
.register_bt {
	background:#4ec24e;
}
.register_bt:before {
	content:url(../img/register.png);
	display:block;
}
.login_bt {
	background:#333;
}
.login_bt:before {
	content:url(../img/login_key.png);
	display:block;
}

.header_nav {
	border-top:solid 1px #ddd;
	padding-left:30px;
}
.header_nav li {
	float:left;
}
.header_nav li a {
	color:#333;
	display:block;
	padding:1.5em 2em 1.5em 0;	
}

@media screen and (max-width: 767px) {

	.header_pc {
		display:none;	
	}
	.header_sp {
		display:table;
		width:100%;
	}
	.logo {
		display:table-cell;
		padding-left:0;
		vertical-align:middle;
		width:40%;
	}
	.register_bt,.login_bt {
		display:table-cell;
		font-size:0.7em;
		width:20%;
	}
	.drawernavbar-header {
		background:#222;
		display:table-cell;
		float:none;
		vertical-align:middle;
		width:20%;
	}
	.drawernavbar-toggle {
		background:#333;
		float:none;
		margin:0 10px 0;
		padding:9px 10px 3px;
		position:static;
		text-align:center;
	}

}


/*==============================================================
	
	04. contentsWrap
	
==============================================================*/

.contentsWrap {
	display:table;
	min-width:1000px;
	width:100%;
}

@media screen and (max-width: 767px) {
	.contentsWrap {
		min-width:100%;
	}
}


/*==============================================================
	
	05. sideL
	
==============================================================*/

.sideL {
	background:#f2f2f2;
	display:table-cell;
	min-width:200px;
	padding:10px;
	vertical-align:top;
	width:15%;
}

.sideL nav {
	margin-bottom:1.5em;
	padding:1em 0 1em 0.5em;
}
.sideL nav ul li a {
	background:url(../img/arrow02.png) no-repeat center left;
	color:#333;
	display:block;
	padding:0.8em 0 0.8em 1em;
}

.ad p {margin-bottom:10px;}

@media screen and (max-width: 767px) {
	.sideL {
		display:none;
	}
}


/*==============================================================
	
	06. sideR
	
==============================================================*/

.sideR {
	display:table-cell;
	padding-bottom:100px;
	position:relative;
	width:85%
} 

/* トップに戻るボタン */

.bt_top {
	position:fixed;
	bottom:25px;
	right:25px;
}
.bt_top a {
	background:#4ec24e;
	border-radius:100px;
	color:#fff;
	display:block;
	padding:1.2em 1em 0.8em;
	text-align:center;
	width:95px;
}
.bt_top a span {
	display:none;
}
.bt_top a:before {
	content:url(../img/arrow_top.png);
	display:block;
}

@media screen and (max-width: 767px) {

	.sideR {
		width:100%;
		padding-bottom:1em;
	}
	.bt_top {
		position:static;
	}
	.bt_top a {
		border-radius:0;
		margin:0 auto;
		padding:1em 0;
		width:90%;
	}
	.bt_top a span {
		display:inline;
	}
	.bt_top a:before {
		display:none;
	}

}


/*==============================================================
	
	07. footer
	
==============================================================*/

footer {
	background:#66cc66;
}

footer ul {
	margin:0 auto;
	padding:0.5em;
	width:980px;
}
footer ul li {
	float:left;
}
footer ul li a {
	color:#fff;
	font-size:0.875em;
	display:block;
	padding:0.5em 1em;
}

footer address {
	background:#222;
	color:#fff;
	font-size:0.75em;
	font-style:normal;
	padding:1em 0;
	text-align:center;
	width:100%;
	}
footer address a {
	color:#fff;
}

@media screen and (max-width: 767px) {

	footer ul {
		display:none;
	}

}