﻿@charset "utf-8";/* CSS Document */

/*********** ********** ********** ********** *********** ********** ********** ********** *********** ********** ********** **********
* index.html
*/

/*トップページコンテンツ*/
div#content_index{width:100%;height:auto;position:relative;display:inline-block;}

/*左カラムのバナーエリア共通*/
#banner_area{width:100%;height:auto;float:left;}
#banner_area .banner{position:relative;width:100%;height:auto;margin-bottom:10px;float:left;}
#banner_area .banner a{display:block;width:100%;}
#banner_area .banner.search{width:100%;}
#banner_area .banner.search label{margin-left:5%;}
#banner_area .banner.search input[type='text']{width:89.6%;height:28px;margin-left:5%;border:1px #999999 solid;background:#fff;color:#333;outline:none;font-size:180%;display:block;}

/*横幅width28%で252px, 4:3だとheight189px*/
#banner_area .banner.slider{width:100%;background-color:#d4edde;border:1px solid #999;}
#banner_area .banner.slider fieldset{width:100%;height:100%;}
#banner_area .banner.slider legend{width:100%;background:#444;color:#FFF;font-size:210%;padding-top:1%;text-align:center;}
/*#banner_area .banner.slider p{display:inline-block;width:88%;height:3em;border:#999 1px solid;padding:3px 6px;font-size:150%;font-weight:bold;cursor:pointer;margin:2%;background:#fafafa;background:linear-gradient(#fafafa, #e6e6e6);overflow:hidden;}*/
#banner_area .banner.slider p{display:inline-block;width:98%;height:3em;margin-bottom:5px;font-size:150%;color:#006622;background:#e9f5eb;background:linear-gradient(#cfe6cf, #e9f5eb);display:block;border:solid 1px #999;line-height:1.5;}

/*サイネージ*/
#banner_area .banner #slider{width:100%; height:185px;border:1px solid #CCC;margin-bottom:10px;}
#banner_area .banner #slider div{width:100%;text-align:center;}
#banner_area .banner #slider img{width:80%; background-size:cover;box-shadow:rgba(0, 0, 0, 0.498039) 0px 3px 6px 0px;-webkit-box-shadow:rgba(0, 0, 0, 0.498039) 0px 3px 6px 0px;-moz-box-shadow:rgba(0, 0, 0, 0.498039) 0px 3px 6px 0px;-webkit-box-shadow:#666 0px 3px 6px;-moz-box-shadow:#666 0px 3px 6px;box-shadow:#666 0px 3px 6px;background:#4D9980;}
#banner_area .banner #slide-thumb{width:100%;font-size:160%;text-align:center;margin-top:-5px;margin-bottom:3px;}
#banner_area .banner #slide-thumb a{margin-left:2px;margin-right:2px;margin-bottom:2px;width:30px;font-weight:bold;padding:3px 0px;display:inline-block;}
#banner_area .banner #slide-thumb a{background-color:#CCC;color:#333;}
#banner_area .banner #slide-thumb a.activeSlide{background-color:#333;color:#CCC;}

/*らくらく検索*/
#banner_area .banner.search{width:100%;height:auto;background-color:#d4edde;}
#banner_area .banner.search legend{width:100%;background:#00896f;color:#FFF;font-size:210%;text-align:center;padding-top:1%;}
#banner_area .banner.search label{color:#006622;font-size:140%;display: block;margin-top:3px;}
#banner_area .banner.search input[type='text']{border:1px #236600 solid;}
#banner_area .banner.search label.submit{font-size:100%;max-width:210px;border:#236600 1px solid;cursor:pointer;padding:4px 18px;margin-top:8px;display:inline-block;float:right;margin-bottom:5%;margin-right:5%;background:#4d9980;position:relative;background:linear-gradient(#4d9980, #40806a);}
#banner_area .banner.search label.submit input[type='submit']{font-size:150%;color:#FFF;font-weight:bold;cursor:pointer;text-indent:12px;line-height:1.0;padding:4px 0 2px}
#banner_area .banner.search label.submit:before{width:100%;height:100%;background:url(../img/icon_search.png) no-repeat left center;display:inline-block;content:' ';position:absolute;left:10%;top:0;}

/*利用者メニュー*/
#banner_area .banner.login{width:100%;background-color:#d4edde;border:1px solid #999;}
#banner_area .banner.login fieldset{width:100%;height:100%;}
#banner_area .banner.login legend{width:100%;background:#444;color:#FFF;font-size:210%;padding-top:1%;text-align:center;}
#banner_area .banner.login p{width:auto;border:#999 1px solid;padding:6px 12px;font-size:160%;font-weight:bold;line-height:1.5;cursor:pointer;margin:3%;background:#fafafa;background:linear-gradient(#fafafa, #e6e6e6);}
#banner_area .banner.login p a{display:inline;color:#004d4d;background:url(../img/nav_icon_05_g.png) no-repeat left center;text-align:center;padding-left:1.5em;margin-left:2em;}

/*横断検索*/
#banner_area .banner.crossSearch {background-color:#d4edde;height:auto;}
#banner_area .banner.crossSearch p a{text-align:center;color:#006622;padding:9px 0px;font-size:140%;}

/*広島府中市立図書館に移動*/
#banner_area .banner.fLibrary{background-color:#d4edde;height:auto;}
#banner_area .banner.fLibrary p a{text-align:center;color:#006622;padding:9px 0px;font-size:140%;}


/*ADEACリンクに移動*/
#banner_area .banner.adeac{background-color:#FFFFFF;height:auto;text-align:center;}
#banner_area .banner.adeac a img{width:160px;}

/*FACEBOOKリンクに移動*/
#banner_area .banner.facebook{background-color:#FFFFFF;height:auto;text-align:center;}
#banner_area .banner.facebook a img{width:160px;}

/*レファレンスサービス*/
#banner_area .banner.reference{background-color:#d4edde;width:100%;height:auto;clear:both;}
#banner_area .banner.reference h3{letter-spacing:0em;line-height:2.1em;text-align:center;background-color:#00896f;color:#FFF;font-size:180%;display:block;}
#banner_area .banner.reference span{display:inline-block;width:60%;height:auto;padding:10% 2% 10% 38%;background:url(../img/icon_reference.png) no-repeat left center;color:#333;font-size:140%;}
#banner_area .banner.reference p{width:auto;border:#999 1px solid;text-align:center;padding:6px 12px;font-size:160%;font-weight:bold;line-height:1.5;cursor:pointer;margin:3%;background:#fafafa;background:linear-gradient(#fafafa, #e6e6e6);}
#banner_area .banner.reference p a{display:inline;color:#004d4d;}

/*郷土メニュー*/
#banner_area .banner.hometown{border:solid 1px #999;width:100%;height:auto;}
#banner_area .banner.hometown img{display:block;width:100%;height:100% }
/*こどもページ*/
#banner_area .banner.kids{border:solid 1px #999;width:100%;height:auto;}
#banner_area .banner.kids img{display:block;width:100%;height:100% }
/*モバイル携帯電話*/
#banner_area .banner.qrcode{background-color:#d4edde;height:auto;}
#banner_area .banner.qrcode a p{text-align:center;color:#006622;padding:9px;font-size:140%;}
#banner_area .banner.qrcode a img{max-width:100%;height:auto;display:block;margin:0 auto 5%;}

/*図書館からのお知らせ*/
#news_area{background:#e9f4f0;border:#ccc 1px solid;margin-bottom:10px;position:relative;}
#news_area h2{font-size:180%;}
#news_area .title{width:100%;height:auto;background-color:#a3cccc;display:block;}
#news_area .title h2{padding-top:1%;color:#004d4d;background:url(../img/icon_news.png) no-repeat left center;text-indent:30px;}
#news_area .content_oshirase{width:100%;height:190px;margin:12px 0;}
#news_area .content_oshirase #oshiraseFrame{font-size:140%;height:90%;overflow:auto;}
#news_area .content_oshirase table td{padding-left:1em;padding-top:3px;vertical-align:middle;}
#news_area #backDispLink,#news_area #backHideLink{position:absolute;bottom:10px; right:10px;}
#news_area .oshiraseTable{width:100%;}
#news_area .oshiraseTable tr,#news_area .oshiraseTable tbody{display:block;width:100%;}
#news_area .oshiraseTable tr{border-bottom:dashed 1px #aaa;}
#news_area .oshiraseTable tr>:first-child{width: 35px; }


/*図書館カレンダー*/
#calendar_area{float:left;background:#fafafa;border:#ccc 1px solid;margin-bottom:10px;position:relative;}
#calendar_area h2{font-size:180%;}
#calendar_area .calendar_block{width:100%;}
#calendar_area .title{width:100%;height:auto;background:#ebebeb;float:left;}
#calendar_area .title h2{float:left;padding-top:1%;color:#000;background:url(../img/icon_calendar.png) no-repeat left center;text-indent:30px;}
#calendar_area .other{float:right;}
#calendar_area .other{font-size:140%;}
#calendar_area .other a:before{display:inline-block;line-height:0;background:url(../img/btn_bg_triangle_gray.png) no-repeat left center;width:24px;padding:7% 0;content:'　';}
#calendar_area .other a p{line-height:0;color:#000;display:inline-block;background:url(../img/btn_bg_gray.png) repeat-x center;padding:7% 0;text-align:center;}
#calendar_area .other a:after{display:inline-block;line-height:0;background:url(../img/btn_bg_end_gray.png) no-repeat left center;width:46px;padding:7% 0;content:'　';}

/*カレンダー*/
#calendar_area .calendar_block{float:left;width:48%;height:auto;background:#fff;margin:12px 1% 0;}
#calendar_area .calendar_block_wrapper{float:left;width:96%;height:auto;padding:0 2% 4%;border:solid 1px #ccc;}
#calendar_area .calendar_block_wrapper .hed{background-color:#DDDDDD;}
#calendar_area .calendar_block_wrapper caption{padding:10px;font-size:210%;text-align:left;}

#calendar_area table{float:left;border-collapse:separate;border-spacing:0px 1px;}
#calendar_area table thead tr td{width:26px;height:24px;width:1%;text-align:left;border:solid 1px #FFF;font-size:140%;padding:0 1%;color:#666;}
#calendar_area table tbody tr td{width:26px;height:24px;width:1%;text-align:left;border:solid 1px #FFF;font-size:130%;padding:0 1%;position:relative;background:#f3f3f3;}

/*カレンダー上のアイコン*/
#calendar_area td.emp{background-color:#fff;}
#calendar_area th.sun{background-color:#FFE4F0;color:#751D31;}
#calendar_area td.sun{background-color:#FFE4F0;color:#751D31;}
#calendar_area th.sat{background-color:#E4F0FF;color:#1D4975;}
#calendar_area td.sat{background-color:#E4F0FF;color:#1D4975;}
#calendar_area td.cal0eve{width:100%;border:0px;}
#calendar_area td.cal1{border:#ffa380 1px solid;background:url(../img/mark_closed.png) no-repeat;background-color:#fff;}
#calendar_area td.cal2{}
#calendar_area td.cal3{}
#calendar_area .calinfo{margin-left:20px;font-size:100%;color:#f00;margin-bottom:30px;}
#calendar_area .event_click{width:100%;height:100%;text-decoration:underline;cursor:pointer;}
#calendar_area .events{background-position:0 0;}
#calendar_area .calendar_block_wrapper table tbody tr td div span img{width:9px;height:9px;float:right;}
#calendar_area .calendar_block_wrapper table tbody tr td div span{width:50%;height:100%;float:right;}
/*アイコン判例*/
#calendar_area .calendar_example{float:left;width:100%;height:auto;margin:12px 0;}
#calendar_area .calendar_example li{float:left;font-size:120%;height:24px;}
#calendar_area .calendar_example li span{width:20px;height:20px;display:inline-block;}
#calendar_area .calendar_example li.cal1{margin-left:15px;padding-left:40px;background:url(../img/mark_closed_legend.png) no-repeat center left;}
#calendar_area .calendar_example li img {float:left;padding-left:30px;height:24px;width:24px;}

#calendar_area .content_calendar .title{background-color:#fff;}
#calendar_area .content_calendar .title h2{background:none;}
#calendar_area .calendar_pagination{display:none;}

/*パンくず*/
div#content .breadlist{display:none;}


/*********** ********** ********** **********
* MediaOnly
*/
@media only screen and (max-width:640px)
{
    /*サイネージ*/
    #banner_area .banner #slider{height:250px;}
}

