@import url("/stylesheets/form.css");

/*
---------------------------------------------
layout base
---------------------------------------------
*/
#container{
width: 920px;
margin-top: 10px;
margin-left: auto;
margin-right: auto;
text-align: left;
}
div.side{
width: 210px;
float: left;
}
div.main{
width: 690px;
float: right;
}



/*
---------------------------------------------
layout pop
---------------------------------------------
*/
div.pop{
text-align: left;
margin-bottom: 15px;
}
div.pop .popMain{
margin: 15px;
}
div.pop h1{
background: url(/images/common/poptitleback.gif) repeat-x;
height: 41px;
margin: 0 0 18px 0;
padding: 0;
font-size: 115%;
color: #003366;
line-height: 2.9;
}
div.pop h1 .logo{
height: 41px;
margin: 0 0 0 8px;
padding: 0;
float: left;
}
div.pop h1 .logo img{
margin: 0 8px 0 0;
}
div.pop h1 .close{
margin: 12px 12px 0 0;
padding: 0;
float: right;
}
div.pop .footer{
margin: 0;
padding: 0;
font-size: 11px;
line-height: 1;
}



/*
---------------------------------------------
header
---------------------------------------------
*/
div.header{
width: 920px;
margin: 0;
padding: 0;
}
div.header h1{
height: 30px;
margin: 0;
padding: 0;
font-size: 12px;
font-weight: normal;
line-height: 2;
float:left;
}
div.header ul{
float:right;
}
div.header ul li{
height: 30px;
margin: 0 0 0 2px;
padding: 0;
line-height: 2;
float: left;
}
div.header .japanese{
background: url("/images/ja/common/title.gif?1") no-repeat left top;
width: 920px;
height: 86px;
clear: both;
}
div.header .english{
background: url("/images/en/common/title.gif") no-repeat left top;
width: 920px;
height: 86px;
clear: both;
}
div.header .chinese{
background: url("/images/ch/common/title.gif") no-repeat left top;
width: 920px;
height: 86px;
clear: both;
}
div.header .title a{
display:block;
width: 920px;
height: 86px;
}



/*
---------------------------------------------
footer
---------------------------------------------
*/
div.footer{
padding-top: 30px;
font-size: 11px;
text-align: center;
}
div.footer ul{
text-align: center;
}
div.footer ul li a:link, .footer ul li a:visited{
color:#333;
}
div.footer ul li a:hover{
color:#666;
}
div.footer ul.up{
border-top: #d2d2d2 1px solid;
padding: 13px 0 3px 0;
}
div.footer ul.down{
border-bottom: #d2d2d2 1px solid;
padding: 3px 0 13px 0;
}
div.footer h3{
margin: 10px 0;
font-size: 11px;
}



/*
---------------------------------------------
side
---------------------------------------------
*/
div.menu p{
background: #7C97C7 url("/images/common/menu_top.gif") no-repeat left top;
margin: 0;
padding: 7px 9px;
line-height: 1;
color: #fff;
}
div.menu ul{
background: #CAD9E9 url("/images/common/menu_bottom.gif") no-repeat left bottom;
}
div.menu li{
background: transparent url("/images/common/menu_seperator.gif") repeat-x;
background-position: bottom;
padding: 8px;
line-height: 1;
list-style: none;
list-style-type: none;
}
div.menu li.last{ 
background: none;
}
div.menu li a{
background: transparent url("/images/common/menu_off.gif") no-repeat;
background-position: left;
padding-left: 14px;
text-decoration: none;
display: block;
}
div.menu li a:hover{
background: transparent url("/images/common/menu_on.gif") no-repeat;
background-position: left;
}
div.menu li#on a{
background: transparent url("/images/common/menu_on.gif") no-repeat;
background-position: left;
}
div.menu ul ul{
background: none;
margin-top: 7px;
padding-left: 6px;
}
div.menu li ul li{
background: none;
line-height: 0;
}
div.menu li ul li a{
background: none;
padding-left: 0;
text-decoration: underline;
}
div.menu li ul li a:hover{
background: none;
}
div.menu li#on ul li a{
background: none;
}




/*
---------------------------------------------
banner
---------------------------------------------
*/
div.banner{
margin-top: 14px;
}
div.banner img{
margin-bottom: 4px;
}
div.banner span{
font-size: 80%;
line-height: 1.2;
}
div.banner a{
color:#006600;
text-decoration: none;
}
div.banner a:hover{
color:#666;
}



/*
---------------------------------------------
title
---------------------------------------------
*/
div.title{
background: url("/images/common/background_maintitle.jpg") no-repeat left top;
width: 690px;
height: 59px;
margin: 0 0 18px 0;
padding-top: 4px;
}
div.title .left{
background: url("/images/common/background_mainleft.gif") no-repeat 4px top;
width: 12px;
height: 51px;
float:left;
}
div.title .right{
background: url("/images/common/background_mainright.gif") no-repeat left top;
width: 49px;
height: 51px;
float:left;
}
div.title h2{
background: url("/images/common/background_maincenter.gif") repeat-x left top;
height: 51px;
padding-top:17px;
padding-right: 80px;
color: #fff;
font-size: 16px;
line-height: 1;
float:left;
}
ul.title{
background: url("/images/common/background_subtitle.jpg") no-repeat left top;
margin: 0 0 10px 0;

padding: 0;
width: 690px;
height: 41px;
color: #fff;
}
ul.title li{
padding-top: 22px;
font-size:100%;
line-height: 0;
float: left;
}
ul.title li.head{
padding-left: 15px;
}
ul.title li.id{
padding-left: 6px;
color: #FFCC00;
}
ul.title li.sub{
margin-top: 11px;
padding: 0 11px 0 0;
float: right;
}
ul.title li.list{
padding-right: 16px;
float: right;
}
ul.title li.list a{
color: #ECCE65;
text-decoration: none;
}
ul.title li.list a:hover{
color: #ffffff;
}




p.titleM2{
border-left:5px solid #003366;
padding:5px 0 4px 7px;
color:#003366;
font-size:110%;
font-weight:bold;
line-height:1;
}



/*
---------------------------------------------
pn
---------------------------------------------
*/
p.box{
margin: 20px 0 0 0;
padding: 6px 8px;
}



/*
---------------------------------------------
table
---------------------------------------------
*/
table{border-collapse: collapse;border-spacing: 0;line-height: 1.2;}
table tr.vtop{vertical-align:top;}
table tr.line14{line-height: 1.4;}
table tr.line16{line-height: 1.6;}
table tr.line18{line-height: 1.8;}
table td.nowrap{white-space: nowrap;}
table th,td{padding: 0;}

table td.par50{
width: 50%;
padding: 5px 6px;
}

table.no{
width: 100%;
}
table.no td{
padding: 5px 6px;
}

table.company{
width: 100%;
border-bottom: #d2d2d2 1px solid;
}
table.company td.left{
width: 20%;
}
table.company td{
border-top: #d2d2d2 1px solid;
padding: 10px;
}
table.company td.title{
background: #d2d2d2;
padding: 8px 8px 7px 10px;
color: #fff;
}

table.products{
width: 100%;
border-top: #d2d2d2 1px solid;
border-left: #d2d2d2 1px solid;
border-bottom: #d2d2d2 1px solid;
margin-bottom: 5px;
}
table.products th{
background:url(/images/common/table_thback.jpg) repeat-x;
border-right: #d2d2d2 1px solid;
font-weight: normal;
padding: 5px 6px;
white-space: nowrap;
}
table.products td{
border-top: #d2d2d2 1px solid;
border-right: #d2d2d2 1px solid;
padding: 5px 6px;
}

table.products td.bkColor{
background: #e2e2e2;
}
table.products tr.store td{
width: 20%;
}
table.products tr.store td.name{
width: 40%;
}

table.confirm{
background: url("/images/common/dotted.gif") repeat-x left bottom;
width: 100%;
margin: 10px 0;
border-collapse: separate;
border-spacing: 0;
text-align: left;
}
table.confirm td{
background: url("/images/common/dotted.gif") repeat-x left top;
width: 100%;
padding: 5px 10px;
}
table.confirm td.left{
width: 31%;
white-space: nowrap;
}



/*
---------------------------------------------
 ul li
---------------------------------------------
*/
ul.inline li{display: inline;}
ul.listMark12 li,
ul.listMark10 li{
background: url("/images/common/menu_list.gif") no-repeat left 4px;
padding: 0 0 0 16px;
line-height: 1.5;
list-style: none;
list-style-type: none;
}
ul.listMark12 li{font-size: 100%;}
ul.listMark10 li{font-size: 88%;}
ul.circle li{
margin: 0.1em 0 0 22px;
list-style: disc;
}


/*
---------------------------------------------
page move buttom
---------------------------------------------
*/
div.currentTop{
margin: 0 0 10px 0;
font-size: 90%;
}
div.currentBottom{
margin: 15px 0 0 0;
font-size: 90%;
clear: both;
float:right;
}
div.currentBottom ul{
margin: 0;
padding: 0;
}
div.currentBottom ul li{
display:inline;
margin-left: 8px;
line-height: 1.1;
}
div.currentBottom ul li.back{
background: url("/images/common/btn_arrowback.gif") no-repeat left 1px;
padding-left: 14px;
}
div.currentBottom ul li.up{
background: url("/images/common/btn_arrowup.gif") no-repeat left 1px;
padding-left: 14px;
}



/*
---------------------------------------------
block r
---------------------------------------------
*/
.spiffy{
display: block;
}
.spiffy *{
display: block;
height: 1px;
overflow: hidden;
background: #DDD;
}
b.spiffy1{
margin-left: 3px;
margin-right: 3px;
padding-left: 1px;
padding-right: 1px;
border-left: 1px solid #E6E6E6;
border-right: 1px solid #E6E6E6;
background: #E0E0E0;
}
b.spiffy2{
margin-left: 1px;
margin-right: 1px;
padding-right: 1px;
padding-left: 1px;
border-left: 1px solid #EEE;
border-right: 1px solid #EEE;
background: #E2E2E2;
}
b.spiffy3{
margin-left: 1px;
margin-right: 1px;
border-left: 1px solid #E2E2E2;
border-right: 1px solid #E2E2E2;
}
b.spiffy4{
border-left: 1px solid #E6E6E6;
border-right: 1px solid #E6E6E6;
}
b.spiffy5{
border-left: 1px solid #E2E2E2;
border-right: 1px solid #E2E2E2;
}
div.spiffyfg{
background:#ddd;
padding: 0 11px;
}
div.spiffyfg img{
border: 1px solid #d2d2d2;
}



/*
---------------------------------------------
sup
---------------------------------------------
*/
sup{
font-size: 88%;
line-height: 0;
}
span.sup{
vertical-align: super;
font-size: 0.8em;
line-height: 0;
}
span.sub{
vertical-align: sub;
font-size: 0.8em;
line-height: 0;
}



/*
---------------------------------------------
[icon] train, bus, car, pdf
---------------------------------------------
*/
div.train{
background: url("/images/common/icon_train.gif") no-repeat left top;
height: 26px;
}
div.bus{
background: url("/images/common/icon_bus.gif") no-repeat left top;
height: 26px;
}
div.car{
background: url("/images/common/icon_car.gif") no-repeat left top;
height: 26px;
}
div.train p,
div.bus p,
div.car p{
margin-left: 35px;
font-size: 90%;
line-height: 1.1;
}
div.btnPrint{
float:right;
font-size: 90%;
}
div.btnPrint a{
display: block;
background: url("/images/common/icon_print.gif") no-repeat;
height: 20px;
padding-left: 22px;
line-height: 2;
}
span.pdf{
font-size: 90%;
}
span.pdf img{
margin-right: 4px;
vertical-align: bottom;
}



/*
---------------------------------------------
button
---------------------------------------------
*/

button.cssbutton{
border:0; text-align:center; margin:0; padding:0; cursor:pointer;
}
button.cssbutton span{
color:#666; display:block; white-space:nowrap; cursor:pointer; position:relative; margin-left:1px; padding:0 10px 0 8px;
}

a.cssbutton{
border:0; text-align:center; margin:0; padding:0; cursor:pointer; text-decoration: none; float:left;
}
a.cssbutton span{
color:#666; display:block; white-space:nowrap; cursor:pointer; float: left; margin-left:1px; padding:0 10px 0 8px;
}

div.cssbutton{
border:0; text-align:center; margin:0; padding:0; cursor:pointer; float:left; 
}
div.cssbutton input{
color:#666; display:block; white-space:nowrap; cursor:pointer; float: left; margin-left:1px; padding:0 10px 0 8px; border:0;
}


button.cssbutton.glass span,a.cssbutton.glass span,div.cssbutton.glass input{
height: 21px; font-size: 88%; line-height: 21px; color: #fff;
}
button.cssbutton.glass.c span,a.cssbutton.glass.c span,div.cssbutton.glass.c input{
background: url("/images/common/glassright.gif") no-repeat right 0;
}
button.cssbutton.glass.c,a.cssbutton.glass.c,div.cssbutton.glass.c {
background: url("/images/common/glassleft.gif") no-repeat 0 center;
}
button.cssbutton.glass.c:hover span,a.cssbutton.glass.c:hover span,div.cssbutton.glass.c:hover input{
background: url("/images/common/glassright.gif") no-repeat right 100%;
}
button.cssbutton.glass.c:hover,a.cssbutton.glass.c:hover,div.cssbutton.glass.c:hover{
background:url("/images/common/glassleft.gif") no-repeat -272px center;
}