@charset "shift_jis";

img {border: none;}
a {text-decoration: none;}

/* ------------- �y�[�W�S�̂������� ----------- */
@media screen and (min-width: 600px) {
#contents {font-size: 14px;}
body {padding-top: 60px;} /* �w�b�_�[�Œ胁�j���[���Ԃ��� */
}

@media screen and (max-width: 599px) {
#contents {font-size: 12px;}
body {padding-top: 0;} /* �w�b�_�[�Œ胁�j���[���Ԃ��� */
}

@media screen and (min-width: 1000px) {
#contents {width: 700px; margin: 0 auto;} /* �w�b�_�[�Œ胁�j���[���Ԃ��� */
}
/* ------------- �y�[�W�S�̂����܂� ----------- */


/* ------------- goods_���o�� ----------- */

#contents #goods {
	background: #fff;
	text-align: center;
	width: 100%;
}
#contents #pc_left ~ #goods {
	width: 740px;
	float: right;
}
#goods h2, #goods h3 {
	background: #eee;
	color: #111;
	font-size: 1.4em;
	margin: 0 0 1em;
	padding: .6em;
	text-align: left;
}
#goods h2 .kousin {
	display: inline-block;
	font-size: .7em;
	margin: 0 0 0 1em;
}


/* ------------- �X���C�v�����i�r��������
 ----------------------------------------------------- */
.flex-viewport {
	width: 100%;
	overflow-y: auto;
	margin: 1em 0 2em;
	text-align: left;
}

.flex-viewport:-webkit-scrollbar {
	display: none;
	height: 0 !important;
}
.flex-viewport ul li {
	box-sizing: border-box;
	display: block;
	float: left;
	font-size: 1em;
	line-height: 1.5;
	padding: 0 1.5% 2em;
	width: 33.33333%;
}
.flex-viewport ul li .photo {
	width: 100%;
}
.flex-viewport ul li a {
	color: #666;
}
@media screen and (max-width: 599px) {
.flex-viewport ul li {
	height: 14em;
}
}



/* ------------- �X���C�v�����i�r�����܂�
 ----------------------------------------------------- */

/* ------------- �y�[�W�㕔�i�r��������
 ----------------------------------------------------- */
.topNavi {
	box-sizing: border-box;
	font-weight: bold;
	margin: 0;
	padding: 2em 5%;
	text-align: center;
	width: 100%;
}
#contents #pc_left ~ .topNavi {
	float: right;
	margin: 2em 0;
	width: 740px;
}
.topNavi .wrap-topNavi:after {
	content: " ";
	clear: both;
	display: block;
}
.topNavi .wrap-topNavi li {
	float: left;
	list-style: none;
	margin-bottom: .6em;
	display: block;
}
.topNavi .wrap-topNavi li a {
	background-color: #eee;
	border-radius: 5px;
	color: #fff;
	padding: 0 0 1em 0;
	display: block;
	width: 100%;
	text-decoration: none;
}
.topNavi .wrap-topNavi li a span {
	display: block;
	height: 2.2em;
	line-height: 1.2;
}
.topNavi .wrap-topNavi li a:hover {
	background-color: #666;
	color: #fff;
}
/* ------------- �y�[�W�㕔�i�r �•ʒ��� ----------- */

.topNavi .list-1 {width: 100%;}
.topNavi .list-2 {width: 49.5%; margin-right: 1%;}
.topNavi .list-3 {width: 32.66%; margin-right: 1%;}
.topNavi .list-4 {width: 24.25%; margin-right: 1%;}

.topNavi .list-2:nth-child(2n),
.topNavi .list-3:nth-child(3n), 
.topNavi .list-4:nth-child(4n) {margin-right:0;}


/* ------------- �y�[�W�㕔�i�r �e�L�X�gver ----------- */
.topNavi .text li a {
	position: relative;
}
.topNavi .text li a:before {
	background: #d43734;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	content: '';
	display: block;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	width: 18px;
}
.topNavi .text li a:hover:before {
	background: #c51916;
}
.topNavi .text li a:after {
	border: 5px solid transparent;
	border-top-width: 5px;
	border-bottom-width: 5px;
	border-left-color: #FFFFFF;
	margin-top: -5px;
	content: '';
	position: absolute;
	right: 0px;
	top: 50%;
}

/* ------------- �y�[�W�㕔�i�r �摜ver ----------- */
.topNavi .img li img {
	width:100%;
	margin:-10px 0 3px 0;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

/* ------------- �y�[�W�㕔�i�r�X�}�z�p�������� ----------- */

@media screen and (max-width: 599px) {
#contents #pc_left ~ .topNavi {
	width: 96%;
	margin: 2em 2%;
}
}
/* ------------- �y�[�W�㕔�i�r�X�}�z�p�����܂� ----------- */



/* ------------- �y�[�W�����J�e�S�������N�������� ----------- */
/* ------------- �J�e�S���������� ----------- */
.cat {
	text-align: left;
}
.cat .wrap-topNavi li {
	border-bottom: 1px dashed #fff;
	margin-bottom: 0;
}
.cat .wrap-topNavi li a {
	border-radius: 0;
	box-sizing: border-box;
	color: #333;
	height: 3.5em;
	padding: .8em 0 .8em 1.2em;
	vertical-align: bottom;
}
.cat .wrap-topNavi li a img {
	float: left;
	width: 11.2%;
}
.cat .wrap-topNavi li a span {
	float: left;
	padding: .5em 0 0 .5em;	
	width: 80%;
}
.cat .wrap-topNavi li a span:after {
	clear: both;
	content: "";
	display: block;
}
.cat .img li a:before {
	background: none;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.cat .img li a:hover:before {
	background: #f60;
}
.cat .img li a:after {
	border-left-color: #333;
}

@media screen and (max-width: 599px) {
.cat .wrap-topNavi li a {
	padding: .8em 0 .8em .5em;
}
.cat .wrap-topNavi li a img {
	padding: 0 0 0 0;	
	width: 20%;
}
.cat .wrap-topNavi li a span {
	padding: .5em 0 0 .5em;	
	width: 60%;
}
}

/* ------------- �J�e�S�������܂� ----------- */

.footerstore {background: #fff;}
.footerstore .wrap-topNavi li a {background: #eee; color: #333; text-align: left; padding-left: 1em;}
.footerstore .wrap-topNavi li a:hover {background: #666;}

/* ------------- �y�[�W�����J�e�S�������N�����܂� ----------- */
/* ------------- �t�@�[�X�g�r���[�i�r�����܂�
 ----------------------------------------------------- */







/* ------------- �w�b�_�[�Œ�i�r��������
 ----------------------------------------------------- */
#headNavi {
	background: #ffeb3b;
	border-bottom: 3px #dbc62b solid;
	left: 0;
	position: fixed;
	text-align: center;
	top: 0;
	width: 100%;
	z-index: 999;
	filter: alpha(opacity=95);
	-moz-opacity: 0.95;
	opacity: 0.95;
}
#headNavi .wrap-headNavi {
	margin: 0 auto;
	width: 940px;
}
#headNavi .wrap-headNavi li a {
	background: #367ABD;
	border-radius: 5px;
	color:#fff;
	font-size: .85em;
	font-weight: bold;
	float: left;
	line-height: 1.4em;
	margin:.8em 1% .8em 0;
	padding: .7em 0;
	text-decoration: none;
}
#headNavi .wrap-headNavi li a:after {
	content: " ";
	clear: both;
	display: block;
}
#headNavi  .wrap-headNavi li a span {
	font-size:1.2em;
}
#headNavi .navi-8 a {width: 11.625%;}
#headNavi .navi-7 a {width: 13.428%;}
#headNavi .navi-6 a {width: 15.833%;}
#headNavi .navi-5 a {width: 19.2%;}
#headNavi .navi-4 a {width: 24.25%;}
#headNavi .navi-3 a {width: 32.666%;}

#headNavi .wrap-headNavi li:last-of-type a {margin-right: 0;}

/* ------------- �w�b�_�[�i�r�X�}�z�p�������� ----------- */
@media screen and (max-width: 599px) {
#headNavi {
	border-bottom: none;
	border-top: 3px #333 solid;
	bottom: 0;
	padding:0 1%;
	top: auto;
	width: 98%;
}
#headNavi .wrap-headNavi {
	padding:0 1%;
	width: 98%;
}
}
/* ------------- �w�b�_�[�i�r�X�}�z�p�����܂� ----------- */

/* ------------- �w�b�_�[�Œ�i�r�����܂�
 ----------------------------------------------------- */


/* ------------- �E���y�[�WTOP�փ{�^����������
 ----------------------------------------------------- */
#pagetop a {
	background: #c00;
	border-radius: 5em;
	box-sizing: border-box;
	bottom: 2em;
	color: #fff;
	display: block;
	font-weight: bold;
	font-size: 1em;
	height: 6em;
	line-height: 1;
	position: fixed;
	padding: .5em 0 0;
	right: 2.5em;
	text-align: center;
	text-decoration: none;
	width: 6em;
}
#pagetop a span {
	font-size: 4em;
}
@media screen and (max-width: 599px) {
#pagetop a {
	background: #fff;
	bottom: 6em;
	border: 1px #ccc solid;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	border-top-right-radius: 0px;
	border-bottom-right-radius: 0px;
	color: #ccc;
	font-size: .8em;
	height: 3em;
	right: 0;
	opacity:0.9;
	padding: .4em 0;
	width: 4em;
	z-index: 9999;
}
#pagetop a span {
	font-size: 1.2em;
}
}

/* ------------- �E���y�[�WTOP�փ{�^�������܂�
 ----------------------------------------------------- */
 
/* ------------- �����ƌ��邱������
 ----------------------------------------------------- */
#goods .morebtn {
	background: #f60;
	color: #fff;
	display: block;
	box-sizing: border-box;
	font-size: 2em;
	font-weight: bold;
	margin: 0 10% 2em;
	padding: 1.2em 0;
	width: 80%;
	text-align: center;
	text-decoration: none;
	border-radius: 4px;
}

@media screen and (max-width: 599px) {
#goods .morebtn {
	font-size: 1.2em;
}
}
#goods .morebtn:hover {
	background: #E10033;
	}

/* ------------- �����ƌ��邱���܂�
 ----------------------------------------------------- */
 
/* ------------- ���w�肱������
 ----------------------------------------------------- */
.bnr-100 {width: 100%;}
.bnr-95 {width: 95%;}
.bnr-90 {width: 90%;}
.bnr-85 {width: 85%;}
.bnr-80 {width: 80%;}
.bnr-75 {width: 75%;}
.bnr-70 {width: 70%;}
.bnr-65 {width: 65%;}
.bnr-60 {width: 60%;}
.bnr-55 {width: 55%;}
.bnr-50 {width: 50%;}
.bnr-45 {width: 45%;}
.bnr-40 {width: 40%;}

.bnr-100, .bnr-95, .bnr-90, .bnr-85, .bnr-80, .bnr-75, .bnr-70, .bnr-65, .bnr-60, .bnr-55, .bnr-50, .bnr-45, .bnr-40 {margin: 0 auto; line-height: 0;}
.bnr-100 img, .bnr-95 img, .bnr-90 img, .bnr-85 img, .bnr-80 img, .bnr-75 img, .bnr-70 img, .bnr-65 img, .bnr-60 img, .bnr-55 img, .bnr-50 img, .bnr-45 img, .bnr-40 img {width: 100%;}



/* ------------- ���w�肱���܂�
 ----------------------------------------------------- */


/* ------------- �����{�b�N�X��������
 ----------------------------------------------------- */

.searchBox {
	box-sizing: border-box;
	margin: .5em 5%;
	width: 90%;
	}
.searchBox .frame {
	float: left;
	position: relative;
	width: 60%;
	}
.searchBox .frame input {
	border: #999 1px solid;
	padding: .5em 0 .5em 5%;
	width: 95%;
	}
.searchBox label {
	display: block;
	float: left;
	width: 25%;
	}
.searchBox label input[type="submit"] {
	background: #f60;
	border: none;
	border-radius: 3px;
	box-sizing: border-box;
	color: #fff;
	padding: .5em 0;
	margin: 0 0 0 5%;
	width: 95%;
	}
.searchBox:after {
	content: " ";
	clear: both;
	display: block;
}
input[type="TEXT"], input[type="button"], input[type="submit"] {
	-webkit-appearance: none;
}
.searchBox .clearButton {
	position: absolute;
	top: 0.4em;
	right: 2%;
	z-index: 99;
	}
/* �u���E�U�̃f�t�H���g�N���A�{�^�����o���Ȃ� */
.searchBox .search::-webkit-search-cancel-button {
	color: #fff;
}
.searchBox .search::-ms-clear {
	color: #fff;
}

@media screen and (min-width: 600px) {
.searchBox {
	margin: .5em auto;
	width: 600px;
	}
.searchBox .frame {
	width: 70%;
	}
.searchBox label {
	width: 30%;
	}
}


/* ------------- �����{�b�N�X�����܂�
 ----------------------------------------------------- */


a#link01, a#link02, a#link03, a#link04, a#link05, a#link06, a#link07, a#link08, a#link09, a#link10, a#link01b, a#link02b, a#link03b, a#link04b, a#link05b, a#link06b, a#link07b, a#link08b, a#link09b, a#link10b, h2#link01, h2#link02, h2#link03, h2#link04, h2#link05, h2#link06, h2#link07, h2#link08, h2#link09, h2#link10, h2#link01b, h2#link02b, h2#link03b, h2#link04b, h2#link05b, h2#link06b, h2#link07b, h2#link08b, h2#link09b, h2#link10b {
	display:block;
	margin-top:-60px !important;
	padding-top:60px !important;
}
}