@charset "UTF-8";
/* CSS Document */


/* campaign-top */
#campaign { width:800px; margin:0 auto; text-align:center;}

#campaign .visa_cam img{ margin-top:20px;}

#campaign h3{ width:765px; margin:20px auto;}

#campaign .method{ margin-bottom:20px;}

#campaign #visa{ width:764px; margin:30px auto 0; background-color:#F5FAFF; text-align:left;}
#campaign #visa p{ padding:10px;}
#campaign #visa p.mark{ padding-right:140px; background:url(../../campaign/img/mark_visa.gif) 625px 35px no-repeat;}
#campaign #visa p span{ font-size:116%; font-weight:bold;}
#campaign #visa h4{ margin:0 10px;  padding:3px 0; background-color:#001E56; color:#FFF; font-weight:bold; text-align:center;}
#campaign #visa ol{ margin:0 10px;  padding:3px 0 10px;}
#campaign #visa li{ margin: 0 0 0 1em; text-indent:-1em;}

#rentacar { width:765px; margin:15px auto 0;}
.bnr { width:514px; margin:0 auto;}
.bnr a{ margin:0 auto; display:block;}

#campaign .map{ margin:30px 0 0 0; padding-bottom:30px;}
#campaign a:hover img
{
opacity:0.8;
filter: alpha(opacity=80);
-ms-filter: "alpha( opacity=80 )";
background: #fff;
}

#banner { margin-top:20px; width:933px; height:90px; position:relative;}
#banner .bnr01{ width:108px; height:75px; top:0; left:50; position:absolute;}
#banner .bnr02{ width:165px; height:41px; top:6px; left:316px; position:absolute;}
#banner .bnr03{ width:376px; height:38px; top:9px; left:547px; position:absolute;}


/*//////////////// campaign-area */
#campaign_area { width:800px; background-color:#FFF; margin:0 auto; text-align:center;}
#campaign_area h2{ margin:10px auto 0; padding-top:20px;}
#campaign_area .bg_pankuz3{ font-size:90%; text-align:left; color:#001B4A; margin:5px 25px;}
#campaign_area .bg_pankuz3 a{ text-align:left; color:#001B4A;}


#campaign_area .area_box{ width:765px; text-align:left; margin:15px auto 0;}

#campaign_area .area_left{ width:390px; float:left;}
#campaign_area .area_left p{ margin:10px 0 0; width:375px; font-size:106%; line-height:150%; text-indent:2em;}

#campaign_area .area_right{ width:375px; height:240px; float:right; position:relative;}
#campaign_area .area_right .img01{ top:0; left:0; position:absolute;}
#campaign_area .area_right .img02{ top:0; left:192px; position:absolute;}
#campaign_area .area_right .img03{ top:125px; left:0; position:absolute;}
#campaign_area .area_right .img04{ top:125px; left:192px; position:absolute;}

/* -color- */
.sapporo {background:url(../../campaign/area/img/bg_article01.gif) repeat-y top left;}
.sapporo .article h4{ color:#F36;}
.sapporo .article h4 span.number{ background-color:#F36;}

.otaru {background:url(../../campaign/area/img/bg_article02.gif) repeat-y top left;}
.otaru .article h4{ color:#03F;}
.otaru .article h4 span.number{ background-color:#03F;}

.niseko {background:url(../../campaign/area/img/bg_article03.gif) repeat-y top left;}
.niseko .article h4{ color:#00A599;}
.niseko .article h4 span.number{ background-color:#00A599;}

.furano {background:url(../../campaign/area/img/bg_article04.gif) repeat-y top left;}
.furano .article h4{ color:#924898;}
.furano .article h4 span.number{ background-color:#924898;}

.asahikawa {background:url(../../campaign/area/img/bg_article05.gif) repeat-y top left;}
.asahikawa .article h4{ color:#ED6C00;}
.asahikawa .article h4 span.number{ background-color:#ED6C00;}

.obihiro {background:url(../../campaign/area/img/bg_article06.gif) repeat-y top left;}
.obihiro .article h4{ color:#69F;}
.obihiro .article h4 span.number{ background-color:#69F;}


/* MAP&Article */
.map_article { width:765px; text-align:left; margin:15px auto 0; }

.article_left { width:375; float:left;}
.article_right { width:375; float:right;}
.article { width:375px; border-top:#FFF 10px solid; padding:10px 0;}
.article h4{ margin: 0 10px 10px 40px; font-size:150%; font-weight:bold; text-indent:-1.5em;}
.article h4 span.number{ color:#FFF; padding:2px 5px;}
.article .a_left{ width:170px; height:100px; position:relative; float:left;}
.article .a_left img{ top:0px; left:10px; position:absolute;}
.article .a_right { width:200px; float:left;}
.article .a_right .privilege{ color:#001B4A; font-size:145%; font-weight:bold; line-height:105%;}
.article .a_right .url{ margin:2px 0 3px;}
.article .a_right .notice{ margin:0 0 0 1em; text-indent:-1em; font-size:86%;}
.article .a_right .mapcode{ margin:3px 0 0 0;}
.article .a_right img{ margin-right:5px;}

.area_menu{ width:765px; height:160px; margin:20px auto 30px; position:relative;}
.area_menu .area01{ width:175px; height:49px; top:50px; left:0; position:absolute;}
.area_menu .area02{ width:175px; height:49px; top:50px; left:196px; position:absolute;}
.area_menu .area03{ width:175px; height:49px; top:50px; left:393px; position:absolute;}
.area_menu .area04{ width:175px; height:49px; top:50px; left:589px; position:absolute;}
.area_menu .area05{ width:175px; height:49px; top:109px; left:0; position:absolute;}
.area_menu .area06{ width:175px; height:49px; top:109px; left:196px; position:absolute;}
.area_menu .area07{ width:175px; height:49px; top:109px; left:393px; position:absolute;}
.area_menu a:hover img { opacity:0.6; filter: alpha(opacity=60);} /* ロールオーバー用不透明度 */
.area_menu img.on { opacity:0.6; filter: alpha(opacity=60);} /* ロールオーバー用不透明度 */

.font_s { font-size:75%;}
.float_l { float:left}
.float_r { float:right}

/*######## Googlemap ########*/
#info {font-size:13px; line-height:130%; width:300px;}
#info h1 {margin:0px; padding:2px; color:#FFFFFF; background-color:#FF9900; font-size:13px; height:15px;}
#info p {margin:3px;}
#info img {float:right; width:120px; height:90px;}


#shoplink{ text-align:center; margin-top:10px;}
#shoplink p { width:154px; margin:5px 3px; float:left;}