@charset "utf-8";

/***********************************
  NatureMuseumHokkaido
  www/style.css
***********************************/

@import "/common/css/base.css";


/*==================================
  Main Layout
==================================*/
div#header ul li#navi01 {background:url(./images/navi01_ov.gif); width:169px; height:30px; margin-top:92px;}
div#header ul li#navi02 {background:url(./images/navi02_ov.gif); width:227px; height:30px; margin:92px 0 0 169px;}
div#header ul li#navi03 {background:url(./images/navi03_ov.gif); width:168px; height:30px; margin:92px 0 0 396px;}
div#header ul li#navi04 {background:url(./images/navi04_ov.gif); width:168px; height:30px; margin:92px 0 0 564px;}
div#header ul li#navi05 {background:url(./images/navi05_ov.gif); width:168px; height:30px; margin:92px 0 0 732px;}
div#header ul li#navi06 {background:url(./images/navi06_ov.gif); width:54px; height:11px; margin:34px 0 0 793px;}
div#header ul li#navi07 {background:url(./images/navi07_ov.gif); width:42px; height:11px; margin:34px 0 0 847px;}

div#flashcontent {width:100%; height:430px; margin-bottom:12px;}

div#box-weathers {width:900px; height:78px; margin:0 auto 24px;}
div#box-sunmoon {width:443px; height:78px; background:url(./images/frame_weather.gif); float:left;}
div#box-sunmoon h2 {float:left; margin:8px 11px 0 0; padding-left:9px;}
div#box-sunmoon div#box-sun {width:121px; height:60px; background:url(./images/box_sun.gif); float:left; margin-top:8px; overflow:hidden;}
div#box-sunmoon div#box-moon {width:121px; height:60px; background:url(./images/box_moon.gif); float:left; margin-top:8px; overflow:hidden;}
div#box-sunmoon ul {list-style:none; padding:17px 0 0 9px;}
div#box-sunmoon ul li {width:48px; float:left;}
div#box-sunmoon ul li p {text-align:center; color:#adadad;}
div#box-weather {width:443px; height:78px; overflow:hidden; background:url(./images/frame_weather02.gif); float:right;}
div#box-weather h2 {display:none;}
div#box-weather p#bnr-weather {position:absolute; margin:48px 0 0 328px; width:115px; height:30px; overflow:hidden;}

div#box-weather dl {width:190px; height:50px; overflow:hidden; background:url(./images/back_hokkaido.gif) right top no-repeat; margin:15px 12px 0 0; position:absolute;}
div#box-weather dl dt {float:right; color:#adadad; font-size:10px; font-weight:bold; width:6.5em; text-align:center; padding-top:18px;}
div#box-weather dl dd {padding-left:6px;}
div#box-weather ul {list-style:none; padding-top:6px; position:absolute; width:130px; margin:0 7px 0 202px;}
div#box-weather ul li {width:61px; height:67px; overflow:hidden; float:left; margin-right:4px;}
div#box-weather ul li p {padding-top:15px; text-align:center;}
div#box-weather div {padding:17px 10px 0 0; float:right;}
div#box-weather div select {width:90px;}

div#box-photo {width:900px; height:80px; margin:0 auto 24px;}
div#box-photo dl {width:278px; float:left; background:url(./images/arrow.gif) right top no-repeat;}
div#box-photo dl dt {padding:5px 0 12px 10px;}
div#box-photo dl dd {padding-left:10px;}
div#box-photo ul {list-style:none;}
div#box-photo ul li {float:left; margin-right:13px;}
div#box-photo ul li img.border {border:1px solid #333;}
div#box-photo ul li.none {margin:0;}

div#box-main {width:900px; margin:0 auto; padding-bottom:25px;}
div#box-main div#box-main-left {width:686px; float:left;}
div#box-main div#box-main-left div#box-search {height:94px; background:url(./images/box_search.gif); overflow:hidden; margin-bottom:20px;}
div#box-main div#box-main-left div#box-search h2 {padding:13px 0 0 105px; font-size:0; line-height:0;}
div#box-main div#box-main-left div#box-search div select {font-size:14px; font-weight:bold; width:180px;}
div#box-main div#box-main-left div#box-search div {padding:11px 0 0 105px; float:left;}
div#box-main div#box-main-left div#box-search div select#area02-s {margin-right:37px;}
div#box-main div#box-main-left div#box-search button {width:110px; background:none; border:none; margin:5px 0 0 15px; cursor:pointer;}
div#box-main div#box-main-right {width:192px; float:right;}
div#box-main div#box-main-right ul {list-style:none;}
div#box-main div#box-main-right ul li {width:192px; height:26px; overflow:hidden; margin-bottom:8px;}
div#box-main div#box-main-right ul li#btn01 {background:url(./images/btn01_ov.gif);}
div#box-main div#box-main-right ul li#btn02 {background:url(./images/btn02_ov.gif);}
div#box-main div#box-main-right ul li#btn03 {background:url(./images/btn03_ov.gif);}
div#box-main div#box-main-right ul li a {display:block;}
div#box-main div#box-main-right ul li a:hover {background-color:transparent;}
div#box-main div#box-main-right ul li a:hover img {visibility:hidden;}


/*--second_page--*/
div#sky {background:url(images/back.jpg) top center no-repeat; padding-top:35px; text-align:center;}

div#pan {width:900px; height:25px; overflow:hidden; background:url(images/back_pan.gif); margin:0 auto;}
div#pan p {padding-left:10px; font-size:10px;}
div#pan p a {color:#fff;}

div#contents div#main {width:840px;}
div#contents div#main h2.box-top {background:url(./images/top_white.gif) bottom no-repeat; padding-bottom:12px; font-size:0; line-height:0;}
div#contents div#main div#sub-contents {background:#fff; padding:15px 25px;}
div#contents div#main div#sub-contents p {padding-bottom:25px;}
div#contents div#main div#sub-contents ul {padding:0 0 20px 25px;}
div#contents div#main div#sub-contents ul li {margin-bottom:5px;}
div#contents div#main div.white-bottom {background:url(./images/bottom_white.gif); height:6px; margin-bottom:20px;}

div#contents div#main dl.typeA {padding:5px;}
div#contents div#main dl.typeA dt {width:300px; float:left;}
div#contents div#main dl.typeA dd {width:460px; float:right;}
div#contents div#main dl.typeA dd ol {padding-left:25px;}
div#contents div#main dl.typeA dd ol li {padding-bottom:25px;}
div#contents div#main div#sub-contents dl.typeA dd ol li p {padding:5px 0 0 0;}
div#contents div#main ol.ol-list {padding-left:25px;}

/*--search--*/
div#sky {background:url(./images/back.jpg) top center no-repeat; padding-top:35px; text-align:center;}

div#pan {width:900px; height:25px; overflow:hidden; background:url(./images/back_pan.gif); margin:0 auto;}
div#pan p {padding-left:10px; font-size:10px;}
div#pan p a {color:#fff;}

div#search-box {padding:30px 30px 30px 20px;}
div#search-box ul {list-style:none; padding:30px 0 40px;}
div#search-box ul li {float:left; background:url(./search/images/x.gif) right no-repeat;}
div#search-box ul li#date {width:310px;}
div#search-box ul li#date dl {width:210px; height:161px; overflow:hidden; background:url(./search/images/box01.gif);}
div#search-box ul li#time {width:280px;}
div#search-box ul li#time dl {width:180px; height:161px; overflow:hidden; background:url(./search/images/box02.gif);}
div#search-box ul li#area {width:210px; background:none;}
div#search-box ul li#area dl {width:210px; height:161px; overflow:hidden; background:url(./search/images/box01.gif);}
div#search-box ul li dl dt {padding:25px 0 20px 12px;} 
div#search-box ul li dl dd {color:#e6e6e6; font-size:12px; padding-left:20px;}
div#search-box ul li dl dd p {margin-top:15px;}
div#search-box ul li dl dd select {font-size:14px; font-weight:bold; margin:0 5px;}
div#search-box ul li#date select {width:50px;}
div#search-box ul li#date select#s-year {width:100px;}
div#search-box ul li#time select {width:110px;}
div#search-box ul li#area select {width:160px;}
div#search-box p#search-btn {text-align:center;}
div#search-box p#search-btn button {width:244px; background:none; border:none; cursor:pointer;}


/*  result
-----------------------------------*/
div#title-area {margin:10px 12px 0 2px;}
div#title-area h2 {float:left; width:500px;}
div#title-area p {width:118px; float:right; background:url(./search/images/btn_research_ov.gif);}
div#title-area p a {display:block;}
div#title-area p a:hover {background-color:transparent;}
div#title-area p a:hover img {visibility:hidden;}

p#title-time {margin:18px 10px 10px 0; text-align:center;}

div#photo-box {margin:0 22px 20px 12px;}
div#photo-box h3 {width:618px; padding:8px 0; background:url(./search/images/back_photo.gif); margin-left:100px;}
div#photo-box h3 img {margin-left:8px;}
div#photo-box ul {list-style:none; position:absolute; margin-top:-240px; width:816px;}
div#photo-box ul li#back-hour {width:100px; position:absolute;}
div#photo-box ul li#next-hour {width:100px; position:absolute; margin-left:716px;}
div#photo-box ul li#back-hour dt {width:25px; height:50px; background:url(./search/images/arrow01_ov.gif); margin-left:37px;}
div#photo-box ul li#next-hour dt {width:25px; height:50px; background:url(./search/images/arrow02_ov.gif); margin-left:38px;}
div#photo-box ul li dt a {display:block;}
div#photo-box ul li dt a:hover {background-color:transparent;}
div#photo-box ul li dt a:hover img {visibility:hidden;}
div#photo-box ul li dd p {margin-top:10px; text-align:center;}

div#photo-list {width:795px; margin-left:22px; background:url(./search/images/time_line.gif) bottom no-repeat; padding-bottom:17px;}
div#photo-list ul {list-style:none;}
div#photo-list ul li {float:left; padding:3px 0 3px 3px; background:url(./search/images/back_photo.gif);}
div#photo-list ul li.none {padding:3px;}
div#photo-list ul li.this img {border-bottom:2px solid #fff; padding-bottom:3px;}

p#photo-link {padding:15px 15px 10px; text-align:right; color:#999;}
p#photo-link a {margin:0 3px; color:#999;}

div.line {height:3px; margin:0 10px 0 0; background:url(./search/images/back_photo.gif);}

div#other-area {margin:0 10px 25px 0;}
div#other-area div#other-title {width:264px; height:115px; float:left; background:url(./search/images/back_hokkaido.gif) top right no-repeat;}
div#other-area div#other-title p {padding:12px;}
div#other-area div#other-title p img {margin-bottom:7px;}
div#other-area ul {list-style:none; float:left; width:574px; padding-top:15px;}
div#other-area ul li {float:left; margin-right:8px; width:74px;}
div#other-area ul li.none {margin:0;}
div#other-area ul li dt {background:url(./search/images/back_photo.gif); padding:5px; margin-bottom:3px;}