@charset "utf-8";
/* CSS Document */


@media screen and (max-width: 768px) and (min-width: 641px) {
/*------------------
  Visual Area
------------------*/
#top_v_area {
	width: 100%;
	min-height: 280px;
	margin-bottom: 20px;
	margin: 0 auto;
	padding: 0;
	overflow: hidden;
	position: relative;
	background-color: #FFFFFF;
	border-bottom: solid 1px #e1e1e1;
}


#top_visual {
	width: 100%;
	height: 500px;
	padding: 0;
	margin: 0 auto;
	
}

/* .viewer
------------------------- */
.viewer {
	margin: 0 auto;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.viewer ul {
	width: 100%;
	overflow: hidden;
	position: relative;
}
.viewer ul li {
	top: 0;
	left: 0;
	width: 100%;
	position: absolute;
}
.viewer ul li img {
	width: 100%;
}




/*v_img01*/
@keyframes slide1 {
	0% {opacity: 0;}
	10% {opacity: 1;}
	30% {opacity: 1;}
	40% {opacity: 0;}
	100% {opacity: 0;}
}

/*v_img02*/
@keyframes slide2 {
	0% {opacity: 0;}
	30% {opacity: 0;}
	40% {opacity: 1;}
	60% {opacity: 1;}
	70% {opacity: 0;}
	100% {opacity: 0;}
}

/*v_img03*/
@keyframes slide3 {
	0% {opacity: 0;}
	60% {opacity: 0;}
	70% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}
/*v_img04*/
@keyframes slide4 {
	0% {opacity: 0;}
	60% {opacity: 0;}
	70% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}

/*v_img05*/
@keyframes slide5 {
	0% {opacity: 0;}
	60% {opacity: 0;}
	70% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}

/*v_img06*/
@keyframes slide6 {
	0% {opacity: 0;}
	60% {opacity: 0;}
	70% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}

/*v_img07*/
@keyframes slide7 {
	0% {opacity: 0;}
	60% {opacity: 0;}
	70% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}


/*v_img08*/
@keyframes slide8 {
	0% {opacity: 0;}
	60% {opacity: 0;}
	70% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}

/*v_img09*/
@keyframes slide9 {
	0% {opacity: 0;}
	60% {opacity: 0;}
	70% {opacity: 1;}
	90% {opacity: 1;}
	100% {opacity: 0;}
}
/*画像ブロック*/


/*３枚画像の共通設定*/
#slide1,#slide2,#slide3 {
	-webkit-animation-duration: 10s;	/*実行する時間。「s」は秒の事。*/
	animation-duration: 10s;			/*同上*/
	-webkit-animation-iteration-count:infinite;	/*実行する回数。「infinite」は無限に繰り返す意味。*/
	animation-iteration-count:infinite;			/*同上*/
}

/*v_img01*/
#slide1 {
	-webkit-animation-name: slide1;		/*上で設定しているキーフレーム（keyframes）の名前*/
	animation-name: slide1;				/*同上*/
	position: absolute;
	width: 960px;
	height: 300px;
	margin: 0 auto;
	padding: 0;
}

/*v_img02*/
#slide2 {
	-webkit-animation-name: slide2;		/*上で設定しているキーフレーム（keyframes）の名前*/
	animation-name: slide2;				/*同上*/
	position: absolute;
	width: 960px;
	height: 300px;
	margin: 0 auto;
	padding: 0;
}

/*v_img02*/
#slide3 {
	-webkit-animation-name: slide3;		/*上で設定しているキーフレーム（keyframes）の名前*/
	animation-name: slide3;				/*同上*/
	position: absolute;
	width: 960px;
	height: 300px;
	margin: 0 auto;
	padding: 0;
}


/*--------c_box→box--------*/

.box_605{
	width: 90%;
	height: auto;
	padding: 10px;
	margin-top: 15px;
	margin-bottom: 15px;
}	
	
.box_500{
	width: 50%;
	height: auto;
	min-height: 440px;
	padding: 10px;
	margin: 0 auto;
	margin-top: 15px;
	margin-bottom: 15px;
}

.box_400{
	width: 90%;
	height: auto;
	padding: 10px;
	margin: 0 auto;
	margin-top: 15px;
	margin-bottom: 15px;
}

.box_400:last-child{
     margin-right: 0px;
}

.box_400_b{
	max-width: 400px;
	width: 90%;
	height: auto;
	padding: 10px;
	margin: 0 auto;
	margin-top: 15px;
	margin-bottom: 15px;
	border: 1px solid #CCCCCC;
}

.box_400:last-child{
     margin-right: 0px;
}

.box_400_bgwh{
	width: 40%;
	height: auto;
	padding: 10px;
	margin: 0 auto;
	margin-top: 15px;
	margin-bottom: 15px;
	background-color: #FFFFFF;
}

.box_300{
	width: 30%;
	height: auto;
	padding: 0;
	margin: 0 auto;
	margin-top: 15px;
	margin-left: 15px;
	margin-bottom: 15px;
	overflow: hidden;
}

.box_300:last-child{
     margin-right: 0px;
}

/*---------------*/
	
.box_300_b{
	width: 30%;
	height: auto;
	padding: 0px;
	margin: 0 auto;
	margin-top: 15px;
	margin-left: 15px;
	margin-bottom: 15px;
	border: 1px solid #CCCCCC;
	overflow: hidden;
}

.box_300_b:last-child{
     margin-right: 0px;
}

/*------------------
   rcd_item
------------------*/
.rcd_item_img{
	max-width: 300px;
	width: 30%;
	height: auto;
	margin-bottom: 10px;
}
	
.rcd_item_wrap{
	width: 55%;
	height: auto;
	margin-bottom: 20px;
	padding: 0 0  20px 15px;
	display: block;
}



.rcd_item_name{
	width: 100%;
	height: auto;
	min-height: 22px;
	margin: 0 auto;
	padding: 15px 0;
	text-align: center;
}		
	
.rcd_item_txt01{
	width: 98%;
	min-height: 88px;
	margin: 10px 0 0 0;
	padding: 15px 0 0 7px;
}
	
/*------------------
   category_index
------------------*/

.ct_index_wrap{
	width: 90%;
	height: auto;
	margin-bottom: 20px;
	padding: 0 0  20px 0;
	display: block;
}

.ct_index_wrap ul li{
	float: left;
}

.ct_index_wrap ul li.icon{
	width: 50%;
	max-width: 93px;
	min-height: 88px;
	margin: 0;
	padding: 0;
	display: block;
	vertical-align: middle;
	border: 1px solid #E1E1E1;
}


.ct_index_wrap ul li.txt{
	width: 75%;
	min-height: 88px;
	margin: 0;
	padding: 0 0 0 15px;
}

/*------------------
   category_index2
------------------*/

.ct_index02_wrap{
	width: 100%;
	max-width: 600px;
	height: auto;
	margin-bottom: 20px;
	padding: 0 0  20px 0;
	display: block;
}

.ct_index02_wrap ul li{
	float: left;
}

.ct_index02_wrap ul li.icon{
	width: 17%;
	max-width: 100px;
	min-height: 100px;
	margin: 0;
	padding: 0;
	display: block;
	vertical-align: middle;
}

.ct_index02_wrap ul li.txt{
	width: 80%;
	min-height: 88px;
	margin: 0;
	padding: 0 0 0 15px;
}
	
.ct_index02_wrap ul li.txt02{
	width: 98%;
	min-height: 88px;
	margin: 10px 0 0 0;
	padding: 15px 0 0 15px;
}	
/*------------------
   category_index_font
------------------*/
.ct_index_ti{
	width: 98%;
	height: auto;
	margin: 0;
	padding: 5px;
	border-bottom: 1px dashed #E1E1E1;
}

.ct_index_ti02{
	width: 98%;
	height: auto;
	margin: 0;
	padding: 5px;
}

.ct_index_ti p{
	display: block;
	font-weight: bold;
}

.ct_index_txt{
	width: 98%;
	height: auto;
	margin: 0;
	padding: 5px;
}

.ct_index_text p{
	line-height: 20px;
	font-weight:normal;
}

.ct_index_next{
	width: 39%;
	min-width: 125px;
	height: auto;
	display: block;
	float: right;
	margin-top: 15px;
}

.ct_index_next02{
	width: 26%;
	min-width: 115px;
	height: auto;
	display: block;
	float: right;
	margin-top: 15px;
}

	
/*---Category_banner---*/

.c_box li.ctgy_box{
	width: 90%;
	max-width: 475px;
	height: auto;
	margin: 0 auto;
	padding: 0;
	margin-top: 25px;
	margin-right: 20px;
	margin-bottom: 25px;
}
.c_box li.ctgy_box:first-child{
     margin-left: 23px;
}

.c_box li.ctgy_box:last-child{
	 margin-left: 23px;
     margin-right: 0px;
}

.w_new_ti{
	width: 262px;
	height: 35px;
	margin-left: 0;
	margin-bottom: 10px;
	padding: 0;
	display: block;	
}

.w_new_box{
   width: 90%;
   height: auto;
   max-width: 465px;
   max-height: 228px;
   display: block;
   border-top: #333333 solid 1px;
   border-left: #333333 solid 1px;
   border-right: #333333 solid 1px;
   border-bottom: #333333 solid 1px;
   /*border-radius: 0px 0px 7px 7px / 0px 0px 7px 7px;*/
   padding-top: 5px;
   padding-left: 0px;
  margin: 0 auto;
}

.w_new_box p{
	max-width: 463px;
	width: 95%;
	height: auto;
	padding-left: 18px;
	line-height: 20px;
	margin-bottom: 7px;
}

/*---Category_banner---*/

/*---Category_banner---*/

.c_item_img{
	max-width: 298px;
	width: 100%;
	height: auto;
	margin: 0 auto;
	margin-bottom: 10px;
	border: 1px solid #F7F7F7;
}

.c_item_name{
	max-width: 300px;
	width: 100%;
	height: auto;
	display: block; 	
	padding-bottom: 5px;
	text-align: center;
}

.c_item_price{
	width: 300px;
	height: auto;
	display: block;
	margin: 0 auto;
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center; 
}

.c_item_txt{
	width: 300px;
	height: auto;
	display: block;
	padding-top: 5px; 	
	padding-bottom: 5px;
	border-top: #E7E7E7 dashed 1px;
}


.c_item_shousai{
	width: 200px;
	height: auto;
	display: block;
}
/*------------------
  Item Cont
------------------*/

#item_cont{
	width: 100%;
	height: auto;
	margin: 0;
	padding-top: 10px;
	float: left;
	border: #EBEBEB solid 1px;
}

#item_cont li{
	float: left;
}


#item_cont li.v_area{
	width: 75%;
	height: auto;
	padding: 0;
	margin: 0;
}

#item_cont li.b_area{
	width: 25%;
	height: auto;
	padding: 0;
	margin: 0;
}

.item_ti{
    width: 100%;
	height: auto;
}

.btn{
    width: 180px;
	height: 30px;
}


.item_ti{
	width: 100%;	
	height: auto;
	margin-top: 22px;
}

.other{
	width: 100%;	
	height: auto;
}

#txt_cont{
	width: 100%;
	height: auto;
	margin-top: 15px;
	margin-bottom: 10px;
}

.table_01{
width: 95%;
border-collapse: collapse;
margin-top: 5px;
margin-bottom: 20px;
margin-left: 15px;
}

.table_01 th{
width: 20%;
padding: 6px;
text-align: left;
vertical-align: top;
color: #333;
border: 1px solid #b9b9b9;
}

.table_01 td{
width: 30%;
padding: 6px;
border: 1px solid #b9b9b9;
}

/*-------------------------------
   送料改定
-------------------------------*/

.wrap_100p{width: 95%; max-width: 960px; height: auto; padding: 0; margin: 20px 0; border: 1px solid #777777;}
.setsumei_ti{width: 95%; height: auto; min-height: 20px; padding: 5px 10px; border-bottom: 1px dotted #777777; margin: 0 auto;}
.setsumei_ti p{line-height: 28px; color: #777777; font-weight: normal; text-align:center; font-size: 1.2em;}
.setsumei_cont{width: 99%; height: auto; padding: 10px; margin: 0; text-align: left;}
.setsumei_cont p{line-height: 24px; color: #777777;}
.setsumei_next{
	width: 50%;
	height: auto;
	display: block;
	float: right;
	margin-top: 15px;
	margin-bottom: 20px;
}


/*-------------------------------
c_line
-------------------------------*/

.c_line_75{
	width: 75%;
    height: 5px;
	margin-bottom: 15px;
	border-bottom: #CCCCCC dotted 1px; 
}

.c_line_93{
	width: 93%;
    height: 5px;
	margin-bottom: 15px;
	border-bottom: #CCCCCC dotted 1px; 
}

/*-------------------------------
�e�L�X�g�\�������Ȃ�
-------------------------------*/
.logo span,
li span,
h1 span,
h2 span,
h3 span,
h4 span,
p span{
	display:none;
}

/*-----------------------------
Text
-------------------------------*/

.h3_txt{display: inline-block; margin: 0 auto; margin-bottom: 15px;}
h3 p{font-size: 15px; font-weight: bold; text-align: center;}
h3 strong{font-size: 22px; font-weight: bold; color: #555555; display:inline; line-height: 22px;}


}


/*---------------------
	
ChromeとOperaのみだけに適用されるCSSハック

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

@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
.tk_v_area{
	width: 100%;
	height: auto;
	max-width: 640px;
	height: 155px;
	margin:0;
	display: block;
	padding-top: 15px;
	background-image: url(../images/footer_bg02.jpg);
	background-repeat: no-repeat;
	overflow: hidden;
}
}