/************************************************** 
CSS(Cascading Style Sheets) for Instant Web Shop
**************************************************/



/**************** Body and tag styles ****************/

*{margin:0; padding:0;}

body{
font:85% osaka, Verdana, Arial, Helvetica, sans-serif; /* 76% Verdana,Tahoma,Arial,sans-serif; */
line-height:1.4em;
text-align:center;
color:#303030;
background:#e8eaec;
}

a{
color:DarkSlateBlue;
font-weight:bold;         /* bold, normal */
text-decoration:none;
background-color:inherit;
}

a:hover{color:#2a5a8a; text-decoration:none; background-color:inherit;}
a img{border:none;}

p{padding:0 0 1.6em 0;}
p form{margin-top:0; margin-bottom:20px;}

img.left,img.center,img.right{padding:4px; border:1px solid #a0a0a0;}
img.left{float:left; margin:0 12px 5px 0;}
img.center{display:block; margin:0 auto 5px auto;}
img.right{float:right; margin:0 0 5px 12px;}


tr.RowStyle td ul { padding-left:5px; margin-left:10px; list-style-type:disc; }
tr.AlternatingRowStyle td ul { padding-left:5px; margin-left:10px; list-style-type:disc; }

td.tdDataStyle ul { padding-left:5px; margin-left:10px; list-style-type:disc; }


/**************** Header and navigation styles ****************/

#container{
width:995px;           /* 760 */
/*width:1020px;           /* 760 */
margin:5px auto;        /* 20px - top/bottom, auto - left/right */
padding:1px 0;          /* 1px - top/bottom, 0 - left/right */    
text-align:left;
background:#ffffff;
color:#303030;
border:2px solid #a0a0a0;
}

#header{
height:110px;           /* 2016.4.7 k.goto TOPページに検索機能追加したので拡張 height:92px; */ /* 110px */
width:993px;           /* 760-2=758 */
/*width:1018px;           /* 760-2=758 */
margin:0 1px 1px 1px;   /* top, right, bottom, left */
background:DarkSlateBlue;
color:#ffffff;
}

#header h1{
padding:20px 0 0 20px;  /* 35px-top, 0-right, 0-bottom, 20px-left */
font-size:2.4em;
background-color:inherit;
color:#ffffff;
letter-spacing:-2px;
font-weight:bold;     /* normal, bold */
}

#header h2{
margin:10px 0 0 40px;   /* 10px-top, 0-right, 0-bottom, 40px-left */
font-size:1.4em;
background-color:inherit;
color:#f0f2f4;
letter-spacing:-1px;
font-weight:bold;     /* normal, bold */
}

#username{
float:right;
width: 20em;
margin:0 5px 5px 0;     /* 0 5px 5px 0 */
font-size:0.8em;
text-align: right;
}

/*************************** タイトルの下に表示されるメニュー ****************************/
#navigation{
height:2.2em;
line-height:2.2em;
width:993px;           /* 758 */
/*width:1018px;           /* 758 */
margin:0 1px;           /* 0-top/bottom, 1px-left/right */
background:SteelBlue;
color:#ffffff;
}

#navigation li{
float:left;
list-style-type:none;
border-right:1px solid #ffffff;
white-space:nowrap;
}

#navigation li a{
display:block;
padding:0 10px;                 /* top/bottom, left/right  */
font-size:0.8em;                /* 0.8em */
font-weight:bold;               /* bold, normal */
text-transform:uppercase;
text-decoration:none;
background-color:inherit;
color: #ffffff;
}

* html #navigation a {width:1%;}

#navigation .selected, #navigation a:hover{
background:SkyBlue;
color:#ffffff;
text-decoration:none;
}

#navigation .inputorder {
background:Blue;
color:#ffffff;
text-decoration:none;
}

/*****************************************************************************************/

#login {
float:right;  
width:7em;  /* 7em */
text-align:right;
margin-right:6px;
/* height:2.2em; */
/* line-height:2.2em; */
}

#login a{
display:block;
padding:0 10px;
font-size:0.8em;    /* 1.0em */
font-weight:bold;
text-transform:uppercase;
text-decoration:none;
background-color:inherit;
color: #ffffff;
}

#logn a:hover{
background:SkyBlue;
color:#ffffff;
text-decoration:none;
}

#breadcrumbs
{
float:right;
width:985px;       /* 760-10=750 */
/*width:1010px;       /* 760-10=750 */
height:0.8em;       /* 1.0em */
color:#000000;
margin:0 5px 5px 0;
font-size:0.8em; 
text-align:right;
}

#breadcrumbs a{
color:#000000;
background-color:inherit; 
font-size:0.8em; 
font-weight:normal;
}

#breadcrumbs a:hover{
color:#000000; 
background-color:inherit;
text-decoration:underline;
}

/**************** Content styles ****************/

#content{
float:left;
width:975px;           /* 760-20=740 */
/*width:1000px;           /* 760-20=740 */
font-size:0.9em;
padding:0 0 10px 10px;  /* 20px-top, 0-right, 20px-buttom, 20px-left */
}

#content h2{
display:block;
margin:0 0 16px 0;
font-size:1.7em;
font-weight:normal;
letter-spacing:-1px;
color:#505050;
background-color:inherit;
}

#content h2 a{
font-weight:normal;
}

#content h3{
margin:5px 0 5px 0; /*  0 0 5px 0 */ 
font-size:1.1em;    /* 1.4em */
letter-spacing:-1px;
}

/*
#helpinfo {
float:left;
}

#helpinfo2 {
float:left;
width:730px;
}    

#contentdata {
float:left;
width:730px;    
}    
*/

.contentdata {
float:left;
width:965px;    /* 760-30=730 */
/*width:990px;    /* 760-30=730 */
}  

/**************** Admin Content Left/Right styles ****************/
/*
#contentleft{
float: left;
width: 150px;    
margin: 0 0 10px 10px;
padding: 0;
font-size: 0.9em;  
}
*/

/********************************* 管理者画面のメニュー **********************************/
#adminmenu {
clear: left;
float: left;
width: 150px;
margin: 0 0 10px 0;
padding: 0;
font-size: 0.9em;
}

#adminmenu ul {	
list-style: none;
width: 150px;
margin: 0 0 10px 0;     /* top, right, bottom, left */
padding: 0;
font-size: 1.1em;
}	

#adminmenu li {
margin-bottom: 4px;
}

#adminmenu li a {
font-weight: bold;
height: 20px;
text-decoration: none;
color: #505050;
display: block;
padding: 6px 0 0 10px;
background: #f4f4f4;
border-left: 4px solid #cccccc;
border-right: 4px solid #cccccc;
}	
	
#adminmenu li a:hover {
background: #eaeaea;
color: DarkSlateBlue; /* 286ea0 */
border-left: 4px solid DarkSlateBlue; /* 286ea0 */
}
/*****************************************************************************************/

#contentright
{
float:none;
width:auto;
font-size:1em;
margin-left:160px;
/*
float:none;
width:auto;
font-size:1em;
margin-left:160px;
*/
/* margin-right:10px; */
/* margin:20px 10px 10px 0; */
}

#contentright h2{
display:block;
margin:0 0 10px 0;
font-size:1.7em;
font-weight:normal;
letter-spacing:-1px;
color:#505050;
background-color:inherit;
}

#contentright h2 a{font-weight:normal;}
#contentright h3{margin:0 0 5px 0; font-size:1.4em; letter-spacing:-1px;}

.admincontent {
width:805px;    /* 760-190=570 */
/*width:830px;    /* 760-190=570 */
}    

/**************** Data control styles *************/
fieldset{
padding:10px 10px 10px 10px;    
}

/**************** Footer styles ****************/

#footer{
clear:both;
width:993px;    /* 760-2=758 */
/*width:1018px;    /* 760-2=758 */
padding:5px 0;
margin:0 1px;
font-size:0.9em;
color:#f0f0f0;
background:DarkSlateBlue;
}

#footer p{
padding:0; 
margin:0; 
text-align:center;
}

#footer a
{
color:#f0f0f0; 
background-color:inherit; 
font-weight:normal;     /* bold */
}

#footer a:hover{
color:#ffffff; 
background-color:inherit; 
text-decoration: underline;
}

/**************** Misc classes and styles ****************/
 
.clear{clear:both;}
.small{font-size:0.8em;}
.hide{display:none;}
.textcenter{text-align:center;}
.textright{text-align:right;}
.important{color:#f02025; background-color:inherit; font-weight:bold;}

.box{
margin:0 0 20px 0;
padding:10px;
border:1px solid #c0c0c0;
background-color:#fafbfc;
color:#505050;
line-height:1.5em;
}

div.right {float:right}

/* checkout step */
.checkoutactive{
color:DarkSlateBlue; 
font-weight:bold; 
border:solid 1px DarkSlateBlue;
border-bottom-width:3px;
padding:3px;
}

/* waterark styles */
.unwatermarked {
height:18px;
width:148px;
font-weight:bold;
}

.watermarked {
height:18px;    /* 20px */
width:148px;    /* 150px */
padding:2px 0 0 2px;
/* border:1px solid #BEBEBE; */
/* background-color:#F0F8FF; */
color:gray;
}

/* validatorCallout */
.validatorCallout {
background-color: lemonchiffon; 
}

/* Help Info styles */
/*
.HelpHeader {
font-size:smaller; font-weight:normal; 
float:right;
} 

.HelpBody {
width:580px;
}

.HelpBody2 {
width:730px;
}

.HelpIndentPanel {
width:570px;
}
*/


/*
.FloatLeft{
float: left;
width: 100%;
padding-right: 10px;
}

.FloatLeft33{
float: left;
width: 33%;
padding-right: 10px;
}

.FloatLeft50{
float: left;
width: 50%;
padding-right: 10px;
}
*/

/**************** CSS for Default.aspx ****************/
/*
#welcome{
float:none;
margin:0 auto 10px auto;
font-size:1.2em;
font-weight:normal;
}

#campaign{
float:none;
margin:0 auto 10px auto;
font-size:1.2em;
font-weight:normal;
}    
 
#campaignproducts {
float:none;
margin:0 auto 10px auto;
font-size:0.8em;
font-weight:normal;
text-align:center;
} 
*/
/**************** CSS for Default.aspx/Products.aspx ****************/   

/********************************** カテゴリーメニュー ***********************************/
#categorymenu {
clear: left;
float: left;
width: 222px;
margin: 0 0 10px 0;
padding: 0;
font-size: 0.9em;
}

#categorymenu ul {	
list-style: none;
/* goto調整
width: 150px;
*/
width: 250px;
margin: 0 0 20px 0;     /* top, right, bottom, left  →  Top, Bottom, Right, Left */
padding: 0;
font-size: 1.1em;
}	

#categorymenu li {
margin-bottom: 4px;
}

#categorymenu li a {
font-weight: bold;
height: 20px;
text-decoration: none;
color: #505050;
display: block;
padding: 6px 0 0 10px;
background: #f4f4f4;
border-left: 4px solid #cccccc;
border-right: 4px solid #cccccc;
}	
	
#categorymenu li a:hover {
background: #eaeaea;
color:DarkSlateBlue;                     /* 286ea0 */
border-left: 4px solid DarkSlateBlue;     /* 286ea0 */
border-right: 4px solid DarkSlateBlue;     /* 286ea0 */
width:auto;
}



#categorymenu li b {
font-weight: bold;
height: 18px;
text-decoration: none;
color: #505050;
display: block;
padding: 0 6px 0 10px;
background: #f4f4f4;
}	
	
#categorymenu li b:hover {
background: #eaeaea;
color:DarkSlateBlue;                     /* 286ea0 */
width:auto;
}

/*****************************************************************************************/

#topmessage
{
float:none;

width:auto;
/* goto調整
margin-left:160px;
*/
margin-left:260px;
margin-right:10px;
/* 2015.9.17 変更 高さを指定しているのでおすすめ商品と重なるのでautoに変更　Start */

height:auto;
/* 2016.8.19 k.goto スクロールバーのサンプル用
height:100px;
overflow: scroll;
*/

/* height: 124px; */
/* 2015.9.17 変更 高さを指定しているのでおすすめ商品と重なるのでautoに変更　End */
	
}

#topmessage2
{
float:none;
width:auto;
margin-left:260px;
margin-right:10px;
height:auto;
}


#topmessage3
{
float:none;
width:auto;
margin-left:260px;
margin-right:10px;
height:auto;
}



#bottommessage
{
float:none;

width:auto;
margin-left:260px;
margin-right:10px;
height:auto;
}

/* 2016.8.22 追加 */
#whatnew
{
float:none;
width:360px;
margin-left:260px;
margin-right:10px;
height:160px;	
}
/*
{
float:none;
width:360px;
margin-left:260px;
margin-right:10px;
height:160px;	
}
*/
#productsbycategory{
float:none; 
width:auto;
/* goto調整
margin-left:235px;
*/
margin-left:260px;
margin-right:10px;
}


/**************** CSS for OrderInfo.aspx ****************/
.orderlist{
float: left;  /* left */
width: 50%;
padding-right: 10px;
}

.orderdetails {
width:auto;
}  

/**************** CSS for admin/Customers.aspx ****************/
.admincustomers{
float: left;
width: 97%;
padding-right: 10px;
}

.admincustomerdetail {
width:auto;
	height: 487px;
}

/**************** CSS for admin/Orders.aspx ****************/
.admincustomerlist 
{
float:left;
width: 100%;
}

.adminorderlist {
float:left; 
/*margin-left:0; */ 
/*margin-right:5px;  */ 
width: 300px; /*380px; */  /* 300px */
}

.adminorderdetails {
float:left; /* none */
width: auto; /* auto */
}
/**************** CSS for PrivacyPolicy.aspx ****************/ 

/*
.privacyPolicy {float:left; list-style-type:circle; margin:10px 10px 10px 10px;}
ui.privacyPolicy1 {float:left; list-style-type:circle; margin:10px 50px 10px 50px;}
ol.privacyPolicy2 {float:left; list-style-type:circle; margin:10px 50px 10px 50px;}
*/

/*************** Table Styles ************/  

.tableStyle
{
width:955px;    /* 760-40=720*/
/*width:980px;    /* 760-40=720*/
border-width: 1px;
border-style: None;
border-collapse: collapse;
}


.tdStyle{
padding-left:5px;    
background-color: SteelBlue;
color:White;
}    

.tdHeaderStyle{
width:120px;
padding-left:5px;    
background-color: SteelBlue;
color:White;
} 
  
.tdDataStyle{
padding-left:5px;    
}   
  
/*************** Data Web Control Styles ************/

.DataWebControlStyle{
font-size: 100%;
}

.HeaderStyle{
background-color: SteelBlue;
color: White;
font-weight: bold;
padding-left: 3px;
padding-right: 3px;
}

.HeaderStyle a, .HeaderStyle a:visited{
color: White;
}

.FooterStyle{
background-color: #ffffff;
color: #000000;
text-align: right;
}

.AlternatingRowStyle{
background-color: #ffffff;
}

.RowStyle{
background-color: #ffffff;
}

.SelectedRowStyle{
background-color:Cyan;
}

.PagerRowStyle{
background-color: #ffffff;
text-align: right;
}

.SortHeaderRowStyle{
background-color: SteelBlue;
text-align: left;
font-weight: bold;
color: White;
}  

/*************** img ************/

p.sample img {
    width: 230px;
    height: auto;
}