@charset "utf-8";

body,tr,td,th,input,textarea,select,option { 
font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo',sans-serif;
}

body,tr,td,th {
  -webkit-text-size-adjust: 100%;
font-size: 13px;
line-height:130%;
color: #333333;
}

body{padding:0;margin:0 10px 0;word-break: break-all;}

a{text-decoration:none;}
a:link{ color: #0000ff;}
a:visited{ color: #0000ff;}
a:active{ color: #ffd700;}
a:hover {color: #ff6caa;}
.nowrap{ white-space:nowrap; }
.center{text-align:center;}
.right{text-align:right;}
.left{text-align:left;}
.top{vertical-align:top;}
.b{font-weight:bold;}
.padtop{padding-top:20px;}
.magtop{margin-top:20px;}

big {
font-size: 14px;
font-weight: bold;
letter-spacing:1px;
}
small{font-size:11px;}

select,input,textarea{
	color: #333333; font-size: 13px;
	border-radius: 4px;border: 1px solid #979797;
}

/* 全体外枠 */
#outline{
	width:830px;
	margin:0 auto;
}

/* ヘッダ */
.header{
	position: relative;
	margin:0;;
}
/* ヘッダ画像 */
.header_image{width:100%;height:auto;}
/* タイトル */
.head_title{ 
display: table-cell;	vertical-align: middle;
position:absolute;top:35%; width:100%;
font-size:180%; text-align:center; font-weight:bold;
letter-spacing:0.1em; color:#ffff00;
text-shadow:2px 2px 2px #ca009e;
}

.header_link{margin:5px 0 10px;}

/* フッタ */
#footer{ 
clear: both;
margin:15px 0 10px; text-align:center;padding:20px 0;
box-shadow:0px 0px 5px rgba(0,0,0,0.3);
background-color:#ffffff;
}

/* 検索フォーム */
#search{
vertical-align:top;
width:100%;
padding:10px;margin: 0 0 15px;
line-height: 150%;
background-color:#ffffff;
border: 1px solid #d4d4d4;
text-align:left;
box-sizing:border-box;
border-radius: 8px;
box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
}

/* 検索フォーム各項目 */
.form01{margin:0 15px 5px 0;height:50px;float:left;}


/* カテゴリリンク一覧 */
#menu{
width:200px;
}
/* データ表示部 */
#data{
float:right; 
vertical-align:top;
width:610px;
}

/* ページNoリンク */
.pagelink{
margin:12px 0 12px;
text-align:center;font-size: 14px;
}
/* 現在表示されているページ番号 */
.col1{
color:#ff0000; font-weight: bold; font-size: 14px; margin:0 3px 0;
}
/* その他のページ番号(リンク) */
.col2{
font-weight: bold; font-size: 14px; margin:0 3px 0;
}
/* 次/前リンク(>>) */
.col3{
font-size: 13px;font-weight: bold;
}
/* 現在表示されている▼▲ */
.col4{
color:#ff0000;
}


/* カテゴリ指定フォーム */
#cate{
font-size:13px;
}
/* タイプ指定フォーム */
#type{
font-size:13px;
}
/* キーワード指定フォーム */
#SRHWRD{
width:120px;margin-top:3px;
font-size:12px;
}
/* 金額範囲指定フォーム 下限 */
#price_d{ width:55px;margin-top:2px;}
/* 金額範囲指定フォーム 上限 */
#price_u{ width:55px;margin-top:2px;}
/* [検索]ボタン */
.srhbutton{
width:70px;margin-top:2px;
}



/* リスト表示部 */
.list{
padding:10px 3px 20px 3px;
}
#menu a{display: block;}
/* カテゴリ リンク リスト */
.list6{
margin:5px 0 0; width:99.5%;
padding:0;list-style-type:none;
}
.list6 li{ 
margin:1px; padding:5px 0 5px;  text-align:center; 
background-color: #ffeb99; 
}
/* タイプ リンク リスト */
.menulink{
margin:5px 0 0; width:100%; 
padding:0;list-style-type:none;
}
.menulink li{ 
margin:1px; padding:5px 0 5px;  text-align:center;
background-color: #e3f9f9; 
}

/**** データ表示Table ****/
/* table外枠 */
.datatable{
background-color: #c7c7c7;
width:100%;
margin:2px 0 7px 0;
}
/* 一覧表示 背景色1(交互に変わる背景色) */
.tablebg1{
background-color: #ffffff;
}
/* 一覧表示 背景色2 */
.tablebg2{
background-color: #f2f2f2;
}

/* 価格 */
.price{
color:#ff0000;
font-size:14px;
letter-spacing:1px;
white-space: nowrap;
font-weight: bold;
}

/* 画像 データ詳細 */
.data_img{float:left; width:250px; text-align:center;}
.data_img img{
box-shadow: 3px 3px 10px 1px rgba(0,0,0,0.2);
margin:4px 0 7px;padding:5px;
}
.data_table{float:left;width:500px; text-align:left;}





/* ************* カート・注文フォーム ***************** */
/*商品表示Table*/
.formtable1{
  width:100%;
  border-top:1px solid #777777;
  border-left:1px solid #777777;
}
.td1{
  font-weight: bold;
  background-color: #f2f2ed;
  text-align:center;
  border-bottom:1px solid #777777;
  border-right:1px solid #777777;
}
.td2{
  background-color: #ffffff;
  border-bottom:1px solid #777777;
  border-right:1px solid #777777;
}
.border_bk{border-top:1px solid #555555;padding:1px;margin:7px 0 10px;}
.border_rd{border-top:1px solid #ff0000;padding:1px;margin:10px 0 7px;}
/* 狭い画面用*/
.td25{
  background-color: #ffffff;
  border-bottom:1px solid #777777;
  text-align:left;
}
.wid2{width:100px;white-space:nowrap;}

#carttable_01{display:inline;}/* 広画面table表示 */
#carttable_02{display:none;}/* 狭画面table非表示 */
/* ご注文ボタン */
.orderbutton{padding:5px 30px 5px;}


/* 注文 入力フォーム */
.inputform{ margin:20px auto; width:620px; }
.inputform input,textarea,select{margin:3px 1px 3px;}
.formtitle{margin:15px 0 15px;font-size:110%;font-weight:bold;text-align:left;}
.fm1{float:left;width:200px;padding:8px 0 8px;background-color:#f6f6f6;font-weight:bold;}
.fm2{float:left;width:400px;padding:1px 0 10px 3px; text-align:left;}
/* フォーム */
.input1{max-width:98%; width:400px;}
.textarea1{max-width:98%; width:400px;}


/* 入力内容 確認Table*/
.formtable2{ margin:20px auto; width:620px; }
.int{border-top:1px dotted #555555;padding:1px;margin:10px 0 7px;}
.td3{
  width:180px;
  text-align:left; white-space:nowrap;
  padding:4px 10px 4px; box-sizing:border-box;
}
.td4{ text-align:left; }


/* ボタンhover 背景色変更 */
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover{background-color:#c5e1f9; }

/* iPhone特有フォームデザイン解除 */
input[type=text],input[type=tel],input[type=email],input[type=button],input[type=submit],input[type=password],input[type=reset], textarea{ -webkit-appearance: none; }
input[type=submit]{background-color:#f3f4f4;  }

/******************* レスポンシブ設定 ****************************/

/********** 850未満 *****/
@media screen and (max-width:850px){ 
#outline{width:700px;}
#data{width:480px; }
.data_img{width:100%;}
.data_table{width:100%;} 
.data_table table{margin:0 auto;}
}


/********** 700未満 *****/
@media screen and (max-width:700px){ 
#outline{width:100%;}
#search{width:100%;}
#menu{width:100%; }
#data{width:100%; }
.form01{float:left;margin-right:15px;}
.col3{margin:0;padding:2px 12px 2px; border:solid 1px #acacac; background-color:#f6f6f6;font-size:15px;}
.list6 li{ width:24.6%; float:left;  }


}

/********** 600未満 *****/
@media screen and (max-width:600px){
.head_title{font-size:120%;}
.list6 li{ width:49.5%;   }
.inputform{width:420px;}
.fm1{width:410px;text-align:left;padding-left:10px;box-sizing:border-box;}
.formtable2{width:100%; }
}

/********** 450未満 *****/
@media screen and (max-width:450px){ 
.form01{width:100%;}
.list6 li{width:99.5%; }
.head_title{ top:10%; }
#carttable_01{display:none;}/* 広画面table非表示 */
#carttable_02{display:inline;}/* 狭画面table表示 */

.inputform{width:100%;}
.fm1{width:98%;} 
.fm2{width:98%;padding:1px 0 10px; } 
.td3{width:20%; padding:4px 20px 4px 0;} 
}

