@charset "UTF-8";


/* ------------------------------------------------------------
 ドライブプラザ　検索ページ　CSS
 更新日:07/07/31
 
 [目次]
  0:common style
	1:div.main
		1-1:div#searchArea(検索した条件を表示するエリア)
		1-2:div#infoArea(お知らせ)
	2:div.routeMain(検索結果詳細エリア※コンテンツ左エリア)
		2-1:common style
		2-2:div#resultArea(検索結果詳細)
			2-2-1:p.searchAreattl
			2-2-2:ul.searchConditionl
			2-2-3:table.searchTable
			2-2-4:table.routeDetailttl
			2-2-5:table.routeDetail
		2-3:div#researchArea(再検索)
	3:div.routeSub(お知らせ※コンテンツ右エリア)
		3-1:common style
		3-2:div#etcInfo(ETC・割引情報)
		3-3:div#recommendInfo(経路周辺のおすすめ情報)
 
------------------------------------------------------------ */

/*cleafix用CSS-----------------*/
@import "clearfix.css";

/* 
 0:common style
------------------------------ */


div#contents strong{
font-weight:bold;
}


/* 
 1:div.main
------------------------------ */


/*  1-1:div#searchArea -------------- */


div#searchArea{
border:1px solid #bfbfbf;
padding:1px;
font-weight:bold;
font-size:110%;
}

div#searchArea h2{
border-left:6px solid #6cc530;
padding:7px;
background:url(../img/bg_search_result.gif);
font-weight:bold;
font-size:110%;
}

div#searchArea h2 img{
vertical-align:middle;
}


div#searchArea select{
/*float:right;*/
width:120px;
/*text-align:middle;*/
/*vertical-align:bottom;*/
/*margin:-30px 12px 0 0;*/
}

div#searchArea h2 table{
width:100%;
/*border:1px solid #bfbfbf;*/
/*margin:0px;
padding:0px;*/
}


div#searchArea span{
float:right;
/*margin:0;
padding:0;*/
/*text-align:middle;
width:120px;
vertical-align:middle;
margin:-30px 12px 0 0;*/
}


div#searchArea p{
border-left:6px solid #6cc530;
padding:10px;
float:left;
width:8em;
}

div#searchArea dl{
padding:10px;
float:right;
width:400px;
text-align:right;
}

div#searchArea dt,
div#searchArea dd{
display:inline;
}

div#searchArea dd{
padding:0 0 0 10px;
}


/*  1-2:div#infoArea -------------- */


div#infoArea h3{
background:url(../img/info_h3_bg.gif) no-repeat left top;
border-bottom:1px solid #a2d88d;
font-weight:bold;
padding:2px 0 3px 15px;
margin:0 0 10px 0;
}


div#infoArea ul{
list-style-type:disc;
margin:0 0 0 35px;
}


/* 
 2:div.routeMain
------------------------------ */

div.routeMain{
width:950px;
float:left;
}


/*  2-0:common style -------------- */


a.anchor{
background:url(/common/img/arrow02.gif) no-repeat 0 2px;
padding:0 0 0 15px;
}

a.close{
background:url(/common/img/ico_close.gif) no-repeat;
padding:0 0 0 20px;
font-weight:bold;
}

a.caution{
background:url(/common/img/ico_caution.gif) no-repeat;
padding:0 0 3px 20px;
}


div.routeMain p.mobileLink a{
background:url(/common/img/ico_mobile.gif) no-repeat;
padding:3px 0 6px 20px;
}


div.routeMain p.searchLink{
margin:0 0 10px 0;
width:350px;
float:left;
}

div.routeMain p.mobileLink,
div.routeMain p.icLink{
margin:0 0 10px 0;
width:350px;
float:right;
text-align:right;
}


/*  2-2:div#resultArea -------------- */


div.routeMain div#resultArea {
position:relative;
top:0;
left:0;
}

/*  2-2-1:p.searchAreattl ---- */

div.routeMain div#resultArea p.searchAreattl{
font-size:110%;
font-weight:bold;
background:#008b00;
padding:5px;
color:#ffffff;
}

/*  2-2-2:ul.searchConditionl ---- */

div.routeMain div#resultArea ul.searchCondition{
position:absolute;
top:5px;
right:5px;
}

div.routeMain div#resultArea ul.searchCondition li{
display:inline;
color:#ffffff;
font-weight:bold;
}

div.routeMain div#resultArea ul.searchCondition li a{
color:#ffffff;
font-weight:normal;
}

/*  2-2-3:table.searchTable ---- */

div.routeMain div#resultArea table.searchTable{
width:950px;
border-collapse: separate;
border-spacing: 0;
border-right: 1px solid #bfbfbf;
border-bottom: 1px solid #bfbfbf;
margin:0 0 10px 0;
}


div.routeMain div#resultArea table.searchTable th,
div.routeMain div#resultArea table.searchTable td{
border-top: 1px solid #bfbfbf;
border-left: 1px solid #bfbfbf;
padding:5px;
}


div.routeMain div#resultArea table.searchTable th.route{
/*width:86px;*/
width:145px;
}

div.routeMain div#resultArea table.searchTable th.time{
width:145px;
}

div.routeMain div#resultArea table.searchTable th.desc{
width:145px;
}

div.routeMain div#resultArea table.searchTable th.normal_fee{
width:132px;
}

div.routeMain div#resultArea table.searchTable th.etc_fee{
width:186px;
}


div.routeMain div#resultArea table.searchTable th{
background:#f7f7f7;
text-align:center;
font-weight:bold;
}

div.routeMain div#resultArea table.searchTable th span{
font-weight:normal;
}

div.routeMain table.searchTable td{
text-align:center;
}




/*  2-2-4:table.routeDetailttl ---- */

table.routeDetailttl{
clear:both;
width:950px;
border-collapse:collapse;
border-spacing:0;
border-right:1px solid #bfbfbf;
}

table.routeDetailttl th{
border-top:1px solid #008b00;
border-left:1px solid #008b00;
font-size:110%;
font-weight:bold;
background:#008b00;
padding:5px;
color:#ffffff;
width:86px;
text-align:left;
} 

table.routeDetailttl td{
border-top:1px solid #bfbfbf;
background:#e4f7b8;
padding:7px;
}

table.routeDetailttl td.time{
font-size:110%;
padding:7px;
}


table.routeDetailttl td.time em{
font-weight:bold;
}




table.routeDetailttl td span.routemap a{
background:url(../img/ico_routemap.gif) no-repeat top left;
padding:2px 0px 6px 25px;
}

table.routeDetailttl td span.mail{
padding:0 0 0 15px;
}

table.routeDetailttl td span.mail a{
padding:2px 0px 6px 0px;
}

table.routeDetailttl td span.myroute{
padding:0 0 0 15px;
}

table.routeDetailttl td span.myroute a{
padding:2px 0px 6px 0px;
}



table.routeDetailttl td.print a{
background:url(../img/ico_print.gif) no-repeat top left;
padding:2px 0 6px 25px;
}



/*  2-2-5:table.routeDetail ---- */



table.routeDetail{
width:950px;
border-top:1px solid #bfbfbf;
border-left:1px solid #bfbfbf;
border-collapse:collapse;
border-spacing:0;
margin:0 0 10px 0;
}

table.routeDetail th,
table.routeDetail td{
border-bottom:1px solid #bfbfbf;
border-right:1px solid #bfbfbf;
padding:5px;
}

table.routeDetail th{
font-weight:bold;
}


table.routeDetail th.time,
table.routeDetail td.time{
text-align:center;
width:85px;
}

table.routeDetail td.time span.jam{
color:#E70000;
font-weight:bold;
}


table.routeDetail th.route,
table.routeDetail td.route{
width:355px;
}

table.routeDetail th.price{
width:130px;
/*width:150px;*/
}


table.routeDetail th.etc{
width:186px;
}

table.routeDetail th.point{
width:130px;
}



table.routeDetail th.area{
text-align:left;
background:#ffffb4;
font-weight:normal;
}

table.routeDetail th.area p.spot{
/*width:300px;*/
float:left;
}

table.routeDetail th.area p.snow{
white-space: nowrap;
float:right;
text-align:right;
}

table.routeDetail th.area p.otherLink{
/*width:200px;
float:right;
text-align:right;*/
float:left;
}


table.routeDetail th.area span{
font-weight:bold;
font-size:105%;
}


table.routeDetail span.map{
background:url(../img/ico_shuuhen.gif) no-repeat top left;
padding:2px 0 6px 25px;
margin-left:20px;
}

table.routeDetail span.map a{
font-weight:normal;
font-size:95%;
}

table.routeDetail span.hotel{
background:url(../img/ico_shukuhaku.gif) no-repeat top left;
padding:2px 0 6px 25px;
margin-left:15px;
}

table.routeDetail span.hotel a{
font-weight:normal;
font-size:95%;
}

table.routeDetail span.city_road{
background:url(../img/ico_douro.gif) no-repeat top left;
padding:2px 0 6px 25px;
margin-left:15px;
}

table.routeDetail span.city_road a{
font-weight:normal;
font-size:95%;
}

table.routeDetail span.traffic{
padding:0 0 0 15px;
/*margin-left:15px;*/
}

table.routeDetail span.traffic a{
font-weight:normal;
font-size:95%;
}


table.routeDetail td.price{
text-align:center;
}


th.night,
th.office,
th.morning{
font-weight:normal !important;
}

td.normal,
td.night,
td.office,
td.morning{
text-align:center;
}

div.routeMain .office,
div.routeMain .morning{
text-align:center;
}

table.routeDetail td.time2{
width:90px;
}

table.routeDetail td.sapa{
width:260px;
font-weight:bold;
}

table.routeDetail td.sapa p{
width:150px;
float:left;
}

table.routeDetail td.sapa div.ico{
width:100px;
float:right;
text-align:right;
}

table.routeDetail td.sapa div.ico img{
margin:0 2px 0 0;
}


table.routeDetail td.route p.traffic{
font-weight:bold;
width:200px;
float:left;
}

table.routeDetail td.route p.option{
width:150px;
float:right;
line-height:2;
text-align:right;
}

table.routeDetail td.route p.sapa{
clear:both;
margin:10px 0 0 0;
}


table.routeDetail td.route a.congestion{
/*background:url(../img/ico_congestion.gif) no-repeat top left;
padding:0 0 5px 25px;*/
}

table.routeDetail td.route a.snow{
/*background:url(../img/ico_snow.gif) no-repeat top left;
padding:0 0 5px 25px;*/
padding:0 0 0 10px;
}



table.routeDetail td.route p.sapa a{
background:url(/common/img/arrow03.gif) no-repeat;
padding:0 0 0 18px;
font-weight:bold;
}


/*  2-3:div#researchArea -------------- */


div.routeMain div#researchArea{
clear:both;
}

div.routeMain div#researchArea h2{
background:#E8E8E8;
border:1px solid #cccccc;
padding:10px;
}

div.routeMain div#researchArea h2 span{
font-weight:bold;
font-size:110%;
}


div.routeMain div#researchArea table.researchTable{
border-collapse: separate;
border-spacing: 0;
width:950px;
border-left:1px solid #cccccc;
border-right:1px solid #cccccc;
border-bottom:1px solid #cccccc;
}

div.routeMain div#researchArea table.researchTable input{
border:1px solid #A7A6AA;
width:140px;
}

div.routeMain div#researchArea table.researchTable th{
font-weight:bold;
text-align:left;
padding:3px;
}

div.routeMain div#researchArea table.researchTable td{
padding:3px;
}

div.routeMain div#researchArea table.researchTable td.routeChange{
width:400px;
}

div.routeMain div#researchArea table.researchTable td.routeChange a{
background:url(/common/img/ico_change.gif) no-repeat;
padding:2px 0 4px 25px;
}

div.routeMain div#researchArea table.researchDetail{
border-collapse: separate;
border-spacing: 0;
width:950px;
border-left:1px solid #cccccc;
border-bottom:1px solid #cccccc;
margin:0 0 25px 0;
}

div.routeMain div#researchArea table.researchDetail th{
font-weight:bold;
text-align:left;
}

div.routeMain div#researchArea table.researchDetail th,
div.routeMain div#researchArea table.researchDetail td{
border-right:1px solid #cccccc;
padding:3px;
}

div.routeMain div#researchArea div.btn{
text-align:center;
}

div.routeMain div#researchArea option{
padding-right:10px;
}


/* 
 3:div.routeSub
------------------------------ */


div.routeSub{
width:200px;
float:right;
}


/*  3-1:common style -------------- */


div.routeSub h3 img{
display:block;
}

div.routeSub div.section{
margin:0 0 8px 0;
background:url(../img/routesub_section_bg.gif) no-repeat bottom;
padding:0 0 6px 0;
}

div.routeSub div.section div.block{
border-left:1px solid #B8B8B8;
border-right:1px solid #B8B8B8;
padding:10px 7px;
width:184px;
background:url(../img/routesub_block_bg.gif) no-repeat bottom;
}

div.routeSub div.section div.end{
background:none;
}


/*  3-2:div#etcInfo -------------- */


div.routeSub div.section#etcInfo div.block img{
float:left;
}


div.routeSub div.section#etcInfo div.block p{
margin:0 0 0 65px;
}

div.routeSub div.section#etcInfo div.block p.linkText{
clear:left;
margin:10px 0 0 50px;
}


div.routeSub div.section#etcInfo div.block h4{
font-weight:bold;
margin:0 0 10px 65px;
}


/*  3-3:div#recommendInfo -------------- */


div.routeSub div.section#recommendInfo div.block h4{
font-weight:bold;
margin:0 0 10px 0;
}

div.routeSub div.section#recommendInfo div.block h4 img{
vertical-align:middle;
margin:0 5px 0 0;
}

div.routeSub div.section#recommendInfo div.block img{
float:left;
}

div.routeSub div.section#recommendInfo div.block p.linkText{
margin:0 0 0 65px;
}

div.routeSub div.section#recommendInfo div.block p.linkText em{
color:#e70000;
}



div.routeSub div.section#recommendInfo div.block p.linkText02{
text-align:right;
}

div.routeSub div.section#recommendInfo div.block p.exText{
clear:left;
margin:10px 0;
}

div.routeSub div.section#recommendInfo div.block ul{
list-style-type:disc;
margin:0 0 0 20px;

}
