/*　ページ背景の色を指定しています（白）　*/
body {
	background-color: #FFFFFF;
}


/* ヘッダー部分です（青）*/
#head {
	width: 820px;
	height: 92px;
	background-color: #3399FF;
	border: 1px solid #000000;
	margin-right: auto;
	margin-left: auto;
}

#head2 {
	width: 820px;
	height: 30px;
	background-color: #FFFFFF;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-color: #000000;
	border-right-color: #000000;
	border-bottom-color: #000000;
	border-left-color: #000000;
}

#head3 {
	width: 820px;
	height: 20px;
	background-color: #FFFFFF;
	border: 1px solid #000000;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}

/* メインエリア部分です　*/
#main {
	width: 800px;
	background-color: #FFFFFF;
	border-right: 1px solid #000000;
	border-left: 1px solid #000000;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-right: 10px;
	padding-left: 10px;
	margin-right: auto;
	margin-left: auto;
  
}
	

/* 左メニュー部分です（薄い黄色部分）*/
#leftbox {
    font-size: 12px;
	width: 200px;
	background-color: #3399FF;
    padding: 5px;
	float: left;
}
	

/* 右メニュー部分です（更新履歴部分）*/
#leftbox1 {
    font-size: 12px;
	width: 190px;
	background-color: #ffffff;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
    padding: 5px;
	margin-bottom: 10px;
}
	

/* 右メニュー部分です（メルマガ登録部分）*/
#leftbox2 {
	font-size: 12px;
	width: 190px;
	background-color: #ffffff;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
	padding: 5px;
	margin-bottom: 10px;
	text-align: center;
}
	
	
/*　右メニュー部分です（メニュー部分）*/
#leftbox3 {
    font-size: 12px;
	width: 190px;
	background-color: #ffffff;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
    padding: 5px;
	margin-bottom: 10px;
}
	

/* 右メニュー部分です（ピックアップ商品部分）*/
#leftbox4 {
    font-size: 12px;
	width: 190px;
	background-color: #ffffff;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
    padding: 5px;
	margin-bottom: 10px;
}
	

/* 左エリア部分です　*/
#rightbox {
	font-size: 12px;
	width: 550px;
	background-color: #FFFFFF;
	padding: 5px;
	float: right;
}


/* フッターエリア部分です（黒）*/
#footer {
	width: 820px;
	height: 60px;
	
	border: 1px solid #000000;
	font-size: 12px;
	text-align: center;
	padding-top: 10px;
	margin-right: auto;
	margin-left: auto;
  background-color : #3399FF;
}
	

/* ボックスエリア部分です（商品紹介エリア）*/
.box {
	font-size: 12px;
	border: 1px solid #000000;
	background-color: #ffffff;
	padding: 10px;
	width: 520px;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-right: auto;
	margin-left: auto;
}
	
	
/* ボックスエリア部分です（商品紹介部分）*/
.syouhinbox {
	font-size: 12px;
	background-color: #ffffff;
	border: 1px solid #000000;
	width: 500px;
	margin-right: 6px;
	margin-left: 6px;
	float:left;
	border-bottom: 1px solid #000000;
	border-top: 1px solid #000000;
}

.syouhintitlebox {
	background-color: #ffffff;
	width: 500px;
	margin-top: 3px;
	color: #0000FF;
	font-size: 12px;
	text-align: center;
	border-bottom: 1px solid #000000;
	border-top: 1px solid #000000;
}	

.syouhintitleboxmini {
	background-color: #ffffff;
	width: 115px;
	margin-top: 3px;
	color: #0000FF;
    font-size: 12px;
    text-align: center;
}	
/* ボックスエリア部分です（商品画像）*/
.imgbox {
	background-color: #ffffff;
	width: 500px;
	text-align: center;
	}
	
	
.imgboxmini {
	background-color: #ffffff;
	width: 115px;
	text-align: center;
	}
	
	
/* ボックスエリア部分です（商品価格部分）*/
.kakakubox {
	background-color: #ffffff;
	width: 500px;
	margin-top: 3px;
	color: #000000;
	font-size: 12px;
	border-bottom: 1px solid #000000;
	border-top: 1px solid #000000;
}

.kakakuboxmini {
	background-color: #ffffff;
	width: 115px;
	margin-top: 3px;
	color: #FF0000;
	font-size: 12px;
	text-align: center;
}



/* ボックスエリア部分です（商品説明部分）*/
.setumeibox {
	background-color: #ffffff;
	width: 500px;
	font-size: 12px;
	text-align: center;
	border-top: 1px solid #000000;
}

	 
.setumeiboxmini {
	background-color: #ffffff;
	width: 115px;
	font-size: 12px;
	text-align: left;
}

	
/* 右メニューエリアです（ピックアッププレゼント部分）*/
.picupbox {
	font-size: 12px;
	background-color: #FFFBFF;
	border: 1px solid #000000;
	width: 115px;
	margin-right: auto;
	margin-left: auto;
}
#head img {
	float: right;
}



/* 強調タグ部分です */
h1 {
	font-size: 12px;
	color: #999999;
	margin: 5px;
	text-align: center;
}
	
h2 {
	font-size: 10px;
	color: #999999;
	margin: 5px;
	text-align: center;
}
h3 {
	font-size: 12px;
	color: #333333;
	margin: 5px;
}
h4 {
	font-size: 12px;
	color: #333333;
	margin: 5px;
}
h5 {
	font-size: 12px;
	color: #333333;
	margin: 5px;
	text-align: justify;
}
h6 {
	color: #333333;
	font-size: 12px;
	margin: 5px;
}


/* テキスト部分です */
p {
	font-size: 12px;
	line-height: 17px;
	margin: 5px;
}

.mini {
	font-size: 12px;
}
.list {
	font-size: 12px;
	text-transform: none;
	color: #333333;
	font-weight: bold;
}


.syouhin {
	font-size: 12px;;
}
	
.white {
	font-size: 14px;
	line-height: 14px;
	text-align: left;
	color: #FFFFFF;
}

.white2 {
	font-size: 11px;
	line-height: 14px;
	color: #FFFFFF;
}

.red {
 color: #FF0000;
 }
 
.kakaku {
 color: #FF0000;
 font-size: 12px;
 text-align: center;
 }
	 
	 
/* 中央構え */
.center{
text-align: center;
}
	
	 
/* 右構え */
.right{
text-align: right;
}
	 
	 
/* 回り込み解除 */
.clear{
clear: both;
}
	 
#head img2 {
	float: right;
}

A{
  color : navy;
  text-decoration : none;
  font-size : 12px;
}

A:HOVER{
  color : blue;
  background-color : silver;
  text-decoration : underline;
}

A:LINK{
  color : navy;
}

A:VISITED{
  color : navy;
}
em {
	font-size: 12px;
	text-decoration: none;
	font-weight: bold;
	font-style: normal;
}

.tyuumonbox {
	font-size: 12px;
	background-color: #ffffff;
	border: 1px solid #000000;
	width: 500px;
	margin-right: 6px;
	margin-left: 6px;
	float:left;
}
/*===============================================
●style.css 画面の横幅が769px以上
===============================================*/
@media screen and (min-width: 769px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
#container{
width:100%;
}
〜以下、画面の横幅が768pxまでの場合のスタイル記入〜
}
/*===============================================
●tablet.css 画面の横幅が768pxまで
===============================================*/
@media screen and (max-width: 768px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
#container{
width:100%;
}
〜以下、画面の横幅が768pxまでの場合のスタイル記入〜
}
/*===============================================
●smart.css  画面の横幅が640pxまで
===============================================*/
@media screen and (max-width:640px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
#container{
width:100%;
}
〜以下、画面の横幅が640pxまでの場合のスタイル記入〜
}