@charset  "UTF-8";

body {
    background-color: #f5f5f5;
    margin: 0;
    padding: 0;
    font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ", Meiryo,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
}

.contents {
    margin: 0;
    padding: 10px;
    background-color: #fff;
}

/* ヘッダー */
.header-site img {
    margin: 0;
    max-width: 350px;
    height: auto;
    border: none;
}

.header-menu {
    margin: 16px 0;
}

.header-menu ul {
    list-style: none;
    text-align: right;
    font-size: 12px;
}

.header-menu ul li {
    padding: 5px;
}

.header-menu ul li a {
    padding: 3px;
    text-decoration: none;
    color: #000;
}

.header-menu ul a:hover {
    background-color: #eee;
}

.search {
    margin: 0;
    padding: 0;
}

#searchbtn {
    padding: 3px;
    background-color: #eee;
    border-style: none;
}

#searchbtn:hover {
    background-color: #ccc;
}

/* ヘッダ画像 */
.header-img {
	position: relative;
	z-index: 1;
}

.header-img-1 {
    margin-top: 15px;
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

.header-img-txt {
	position: absolute;
	left: 30px;
	bottom: 30px;
	color: #FFF;
	background-color: rgba(0,0,0,0.4);
	width: 35%;
	padding: 5px 15px;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.header-img-txt h1 {
	font-size: 18px;
	line-height: 1.333;
	margin: 0;
}

.header-img-txt p {
	font-size: 12px;
	line-height: 1.5;
	margin-bottom: 0;
}

.header-img ul {
	list-style-type: none;
}

/* フッター1 */
.footer-outer1 {
    margin: 0;
    padding: 10px;
    background-color: #e6e6e6;
}

.footer-1 {
    margin: 0;
    padding: 10px;
}

.footer-1 h1 {
    margin: 5px 0 0;
    padding: 3px;
    color: #000;
    font-size: 13px;
}

.footer-1 h1 a {
    margin: 0 15px 0 0;
    padding: 0 3px 3px 0;
    text-decoration: none;
    display: block;
    color: #000;
}

.footer-1 ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer-1 li a {
    text-decoration: none;
    display: block;
    margin: 0 15px 0 0;
    padding: 3px;
    color: #000;
    font-size: 13px;
}

.footer-1 a:hover {
    background-color: #ccc;
}

.footer-1 i {
    color: gray;
    font-size: .9em;
}

/* フッター2 */
.footer-outer2 {
    margin: 0;
    padding: 10px;
    color: #000;
    background-color: #ccc;
}

.footer-2 {
    margin: 10px;
    padding: 0;
}

.footer-2 img {
    margin: 10px;
    padding: 3px;
    float: left;
    width: 60px;
}

.footer-2 h1 {
    margin: 0;
    padding: 0;
    font-size: 13px;
}

.footer-2 ul {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
}

.footer-2 li a {
    margin: 0 15px 0 0;
    padding: 3px;
    color: #000;
    text-decoration: none;
    display: block;
}

.footer-2 li a:hover {
    background-color: #e6e6e6;
}

/* コピーライト */
.copyright {
    margin: 0;
    padding: 0 10px;
    color: #666;
    background-color: #f5f5f5;
}

.copyright p {
    margin: 0;
    font-size: 12px;
}

i {
    padding: 0 5px;
}

/* ---------------indexとお知らせページ------------------- */
/* お知らせ */
.news {
    margin-bottom: 10px;
    padding-top: 20px;
    padding-bottom: 10px;
}

.news h1 {
    margin: 5px;
    border-bottom: dotted 2px #ccc;
    font-size: 18px;
}

.news ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.news li a {
    padding: 5px;
    color: #000;
    font-size: 14px;
    text-decoration: none;
    display: block;
}

.news li a:hover {
    background-color: #ddd;
}

.news time {
    margin-right: 10px;
    font-weight: 700;
}

.news i {
    padding: 5px;
    font-size: 14px;
    color: #ccc;
}

/* カレンダー */
.calendar {
    padding-top: 10px;
    padding-bottom: 0;
}

.calendar h1 {
    margin: 5px;
    border-bottom: dotted 2px #ccc;
    font-size: 18px;
}

.calendar-table {
    border-collapse: collapse;
    text-align: center;
}

.calendar-table th {
    padding: 3px;
    border: 1px solid gray;
}

.calendar-table td {
    padding: 3px;
    border: 1px solid gray;
}

.calendar-exp {
    margin-top: 10px;
    margin-bottom: 5px;
    padding: 2px;
    border: solid 2px #ddd;
}

.calendar-exp ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.calendar-exp li {
    padding: 0;
    color: #000;
    font-size: 14px;
    display: block;
}

.calendar-exp p {
    padding: 3px;
    color: #000;
    font-size: 11px;
    display: block;
}

.calendar-exp a {
    color: #000;
    font-size: 12px;
    text-decoration: none;
}

.calendar-exp a:hover {
    text-decoration: underline;
}

/* カレンダー日付背景色 */
.general {
    background-color: #badcad;
}

.vacation {
    background-color: #add8e6;
}

.close {
    background-color: #ffb6c1;
}

/* 完全閉館*/
.compclose {
    background-color: #a4a8d4;
}

.week {
    background-color: #eee;
    color: #000;
}

.sun {
    background-color: #eee;
    color: #ff6347;
}

.sat {
    background-color: #eee;
    color: #004080;
}

/* 情報検索 */
.main-left h1 {
    margin: 5px;
    border-bottom: dotted 2px #ccc;
    font-size: 18px;
}

.main-left ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.main-left li a {
    padding: 5px;
    color: #000;
    font-size: 14px;
    text-decoration: none;
    display: block;
}

.main-left li a:hover {
    background-color: #ddd;
}

.main-left li img {
    width: 100%;
    height: auto;
    border: none;
    vertical-align: bottom;
}

.main-left-1 {
    margin-top: 5px;
    margin-bottom: 5px;
    padding: 5px;
    border: solid 6px #ddd;
}

.main-left i {
    padding: 0 5px;
    font-size: 14px;
    color: #a9a9a9;
}

/* ----------各ページ------------------ */
/* 記事本文 */
.page-article {
    margin: 10px;
    font-size: 14px;
}

.page-article a {
    display: inline;
    text-decoration: none;
    color: #ab7736;
}

.page-article a:hover {
    text-decoration: underline;
}

.page-article h1 {
    font-size: 25px;
    font-weight: 400;
}

.page-article h2 {
    margin: 20px 0 10px;
    padding: 5px 0 5px 10px;
    font-size: 20px;
    border-left: solid 10px #B8E18A;
    font-weight: 400;
}

.page-article h3 {
    display: block;
    background-color: #ddd;
    padding: 3px 5px;
    font-weight: 400;
}

.page-article ul {
    margin: 0;
    padding: 2px 19px;
}

.page-article dt {
    margin: 0;
    padding: 5px 5px 0;
    font-weight: 700;
    font-size: 15px;
}

.page-article dd {
    margin: 0;
    padding: 3px 5px;
}

.page-article p {
    margin: 0;
    padding: 0 5px 5px;
}

.page-table {
    margin: 10px;
    border-collapse: collapse;
}

.page-table th {
    padding: 6px;
    text-align: left;
    vertical-align: top;
    background-color: #eee;
    border: 1px solid;
}

.page-table td {
    padding: 6px;
    background-color: #fff;
    border: 1px solid;
}

/* 2カラムの場合のサイドメニュー*/
.page-menu {
    margin: 10px;
    padding: 10px;
    border: solid 5px #ddd;
}

.page-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.page-menu li a {
    padding: 5px;
    color: #000;
    font-size: 14px;
    text-decoration: none;
    display: block;
}

.page-menu li a:hover {
    background-color: #eee;
}

/* 利用案内 */
.user-guide-list ul {
    list-style: none;
    margin: 0;
    padding: 10px 0 0;
}

.user-guide-list ul:after {
    content: "";
    display: block;
    clear: both;
}

.user-guide-list li {
    padding: 3px 10px 0 0;
    float: left;
    width: auto;
}

.user-guide-list li a {
    color: #565656;
}

.user-guide-list li i {
    color: #B8E18A;
}

.pageup {
	color: #000;
    font-weight: 700;
    text-align: right;
}

/* アクセス googlemap*/
.ggmap {
    position: relative;
    margin: 20px;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.ggmap iframe,.ggmap object,.ggmap embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* ----------お知らせ 個別ページ------------------ */
.newspage h1 {
    margin: 10px;
    font-size: 20px;
}

.newspage h2 {
    margin: 10px;
    padding-left: 10px;
    font-size: 18px;
    border-left: solid 10px #888;
    font-weight: 400;
}

.newspage p a {
    margin-left: 10px;
    padding: 10px;
    color: #000;
    font-size: 14px;
    text-decoration: none;
}

.newspage p a:hover {
    text-decoration: underline;
}

.newspage ul {
    margin-left: 20px;
    padding: 0;
    list-style: none;
}

.newspage li a {
    display: block;
    padding: 5px;
    color: #000;
    font-size: 14px;
    text-decoration: none;
}

.newspage li a:hover {
    background-color: #ddd;
}

.newspage time {
    margin-right: 10px;
    font-weight: 700;
}

/* お知らせボックス */
.newsbox {
    border: solid 6px #d3d3d3;
    margin: 15px;
    padding: 15px;
}

.newsbox a {
	display: inline;
    text-decoration: none;
    color: #ab7736;
}

.newsbox a:hover {
    text-decoration: underline;
}

.newsbox h2 {
	margin: 10px;
    font-size: 18px;
    color: #000;
    font-weight: bold;
}

.newsbox h3 {
   margin: 10px;
   font-size: 18px;
   font-weight: 400;
   color: #000;
   border-style: solid;
   border-width: 0 0 1px 5px;
   border-color: #dcdcdc;
   padding: 5px 10px;
   -moz-border-radius: 0px;
   -webkit-border-radius: 0px;
   border-radius: 0px;
}

.newsbox dl {
    margin: 0;
    padding-left: 20px;
    font-size: 14px;
    color: #000;
}

.newsbox dd {
    margin: 0;
    padding-left: 20px;
}

.newsbox ul {
    margin: 0;
    padding-left: 20px;
    font-size: 14px;
    color: #000;
}

.newsbox li {
    margin: 0;
    padding-left: 20px;
}

.newsbox p {
    margin: 0;
    padding-left: 20px;
    font-size: 14px;
    color: #000;
}

/* 情報検索ツールリスト */
.search-table a {
	color: #401C00;
}

.search-table th {
	background: #EBFFEB;
}

/* ######### 567px以下 ##################################################### */
@media(max-width: 567px) {
    .header-site img {
        width: 100%;
    }

	/*ヘッダー画像上のテキストを削除*/
	.header-img-txt {display: none;}

    /* カレンダーの幅 */
    .calendar-curt {
        width: 90%;
        margin: 10px;
        padding: 10px;
    }

    .calendar-next {
        width: 90%;
        margin: 10px;
        padding: 10px;
    }

    .calendar-exp {
        width: 90%;
        margin: 10px;
    }

    /*フロアマップの幅 */
    .page-article img {
        padding: 5px;
        width: 100%;
    }

    /* アコーディオンメニュー */
    .drp {
        display: none;
    }

    .nav-acc label {
        background-color: #C9E8A5;
        color: #000;
        padding: 10px;
        display: block;
        margin: 0;
        border: 1px solid #fff;
    }

    .nav-acc label:hover {
        background: #B8E18A;
    }

    .nav-acc label a {
        display: block;
        text-decoration: none;
        color: #000;
    }

    .nav-acc input[type="checkbox"].on-off {
        display: none;
    }

    .nav-acc ul {
        -webkit-transition: all .5s;
        -moz-transition: all .5s;
        -ms-transition: all .5s;
        -o-transition: all .5s;
        transition: all .5s;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .nav-acc ul li ul li a {
        color: #000;
        padding: 3px 10px;
        display: block;
        text-decoration: none;
    }

    .nav-acc ul li ul li a:hover {
        background-color: #eee;
    }

    input[type="checkbox"].on-off + ul {
        height: 0;
        overflow: hidden;
    }
	
	/* 情報検索テーブル */
	.search-table {
		border-collapse: collapse;
		width: 100%;
	}

	.search-table tr,
	.search-table th,
	.search-table td {
		display: block;
		width: 100%;
		text-align: left;
	}

	.search-table th,
	.search-table td {
		padding: 3px 0px;
	}


    /* サブメニューの数と幅 */
    input[type="checkbox"].on-off2:checked + ul {
        height: 60px;
    }

    input[type="checkbox"].on-off3:checked + ul {
        height: 90px;
    }

    input[type="checkbox"].on-off4:checked + ul {
        height: 120px;
    }

    input[type="checkbox"].on-off5:checked + ul {
        height: 150px;
    }
}

/* ######### 568以上 ################################################################### */
@media(min-width: 568px) {
    /* siteとheader-menuのレイアウト */
    .header:after {
        content: "";
        display: block;
        clear: both;
    }

    .header-site {
        float: left;
        width: 70%;
    }

    .header-menu {
        float: left;
        width: 30%;
    }

    /* フッター1のレイアウト */
    .footer-1:after {
        content: "";
        display: block;
        clear: both;
    }

    .footer-1-1 {
        float: left;
        width: 16.6%;
    }

    /* フッター2のレイアウト */
    .footer-2:after {
        content: "";
        display: block;
        clear: both;
    }


    /* ドロップダウンメニュー */
    .nav-acc label {
        display: none;
    }

    #Panel1,#Panel2,#Panel3,#Panel4,#Panel5 {
        display: none;
    }

    #nav-drp {
        width: 100%;
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    #nav-drp * {
        transition: .15s linear;
        -webkit-transition: .15s linear;
        -moz-transition: .15s linear;
        -o-transition: .15s linear;
        -ms-transition: .15s linear;
    }

    #nav-drp ul {
        padding: 0;
        margin: 0;
        list-style: none;
    }

    #nav-drp ul li {
        position: relative;
        width: 20%;
        float: left;
        font-size: 14px;
    }

    #nav-drp ul li a {
        margin: 0;
        padding: 15px 0;
        display: block;
        color: #000;
        text-align: center;
        text-decoration: none;
    }

    #nav-drp ul li:hover a {
        background-color: #DEFFB7;
    }

    #nav-drp ul li ul {
        position: absolute;
        top: 100%;
        width: 100%;
        visibility: hidden;
        opacity: 0;
        -ms-filter: "alpha( opacity=0 )";
        filter: alpha(opacity=0);
    }

    #nav-drp ul li:hover ul {
        visibility: visible;
        opacity: 100;
        -ms-filter: "alpha( opacity=100 )";
        filter: alpha(opacity=100);
    }

    #nav-drp ul li ul li {
        margin: 0;
        padding: 0;
        float: none;
        width: 100%;
    }

    #nav-drp ul li ul li a {
        display: block;
        margin-top: 0;
    }

    #nav-drp ul li:hover ul li a {
        background-color: #C9E8A5;
    }

    #nav-drp ul li:hover ul li a:hover {
        background-color: #DEFFB7;
    }

    #nav-bg {
        background-color: #C9E8A5;
    }

    #nav-bghome {
        background-color: #B8E18A;
    }

	
	#nav-drp ul ul {
		position: absolute;
		z-index: 3;
	}

	#nav-drp:after {
		content: "";
		clear: both;
		display: block;
	}

	/* ----------index------------------ */
	/* main-rightとsidemenuのレイアウト */
    .main:after {
        content: "";
        display: block;
        clear: both;
    }

    .main-left {
        float: left;
        width: 30%;
    }

    .main-right {
        float: left;
        width: 70%;
    }

    .main-left {
        padding-right: 10;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .main-right {
        padding-left: 10px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    /* 右側のレイアウト */
    .main-right:after {
        content: "";
        display: block;
        clear: both;
    }

    .news {
        float: left;
        width: 100%;
    }

    .calendar {
        float: left;
        width: 100%;
    }

    .calendar-curt {
        float: left;
        width: 190px;
        margin: 10px;
    }

    .calendar-next {
        float: left;
        width: 190px;
        margin: 10px;
    }

    .calendar-exp {
        float: left;
        width: 180px;
    }

    .calendar-curt {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .calendar-next {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .calendar-exp {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    /* ----------2カラムページ------------------ */
    /* メニューと記事のレイアウト */
    .page-2clmn:after {
        content: "";
        display: block;
        clear: both;
    }

    .page-menubox {
        float: left;
        width: 20%;
    }

    .page-articlebox {
        float: left;
        width: 80%;
    }

    .page-menubox {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .page-articlebox {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    /* 見出し以外の文章は画像に回り込み */
    .page-article img {
        display: block;
        clear: both;
        float: right;
        padding: 5px;
    }

    .page-article img {
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

    .page-article h1,h2,h3,.pageup {
        clear: both;
    }

    /* 情報検索ツールリスト */
	.search-table {
		border-collapse: collapse;
		width: 100%;
	}

	.search-table th,
	.search-table td {
		border: 1px solid #B8E18A;
		padding: 8px;
	}
 
	.search-table th {
		text-align: left;
		width: 240px;
	}
	
    /* あぐりぶ3列 */
    .aglib:after {
        content: "";
        display: block;
        clear: both;
    }

    .aglib-1,.aglib-2,.aglib-3 {
        float: left;
        width: 33.33%;
    }
}

/* ######### 1040px以上 ########################################################## */
/* 全体の横幅を固定 */
@media(min-width: 1040px) {
    .header, #nav-drp, .header-img, .main, .footer-1, .footer-2, .page-2clmn, .page-1clmn, .copyright, .newspage, .newspage, .year {
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    }
	
    .contents, .footer-outer1, .footer-outer2, .copyright {
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
    }
}