@charset "UTF-8";

@media screen and (min-width:768px){


/* ===============================================
	layout
=============================================== */
body{
	font-family:'ＭＳ Ｐゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,sans-serif;
	font-size:16px;
	line-height:20px;
	color:#333;
}
#wrap{
	width:1100px;
	margin:0 auto;
	position:relative;
}
header{
	margin:15px 0 0 0;
	overflow:hidden;
}
nav{
	background-color:#76c947;
	border-radius:7px;
	margin-bottom:40px;
}
#container{
	width: 1100px;
	margin:0 auto;
	position:relative;
	margin-bottom:60px;
}
#content{
	margin:0 0 0 253px;
	width:850px;
	position:relative;
	z-index:100;
	min-height:1100px;
}
#top-content{
	margin:0 auto;
	width:637px;
	position:relative;
	z-index:100;
}
#side{
	position: absolute;
	top:0;
	left:0;
	z-index:50;
	width: 1100px;
	margin:0 auto;
	overflow: hidden;
}
#side-nav{
	float: left;
	width:213px;
}
#top-right{
	float: right;
	width:210px;
}
footer {
	margin: 0 calc(30% - 50vw);
	background:url(../img/common/bg_footer.jpg) repeat-x center 0;
	padding-top: 170px;
}

/* ===============================================
	header
=============================================== */

/* logo
-------------------------------------------------- */
h1{
	float:left;
}

/* top nav
-------------------------------------------------- */
.top-nav{
	float:right;
	margin-top:75px;
	overflow:hidden;
}

.top-nav-top{
	height:30px;
}
.top-nav-top ul{
	float:right;
	overflow:hidden;
}
.top-nav-top li{
	float:left;
	border-right:1px solid #613f22;
	padding:0 13px;
}
.top-nav-top li:last-child{
	border-right:none;
	padding-right:0;
}

.top-nav-bttm{
	height:28px;
	display:block;
	float:right;
}
.top-nav-bttm table{}
.top-nav-bttm th{
	vertical-align:top;
	padding:6px 0 0 0;
}
.top-nav-bttm td{
	vertical-align:top;
}

/* 文字サイズ
-------------------------------------------------- */
ul.textresizer {
	margin:5px 8px 0 8px;
}
ul.textresizer li {
	float:left;
	margin-right:4px;
}
ul.textresizer li a{
	display:block;
	width:20px;
    height:20px;
	text-indent:-9999px;
	text-align:left;
}
ul.textresizer li.fSml a{
	background-image:url(../img/common/btn_font.jpg);
	background-position:0 0;
}
ul.textresizer li.fMid a{
	background-image:url(../img/common/btn_font.jpg);
	background-position:0 -20px;
}
ul.textresizer li.fLrg a{
	background-image:url(../img/common/btn_font.jpg);
	background-position:0 -40px;
}
ul.textresizer li.fSml a.textresizer-active {
	background-position:-20px 0;
}
ul.textresizer li.fMid a.textresizer-active {
	background-position:-20px -20px;
}
ul.textresizer li.fLrg a.textresizer-active {
	background-position:-20px -40px;
}

/* ===============================================
	nav
=============================================== */
nav ul{
	overflow:hidden;
	width:100%;
	padding-left:5px;
}
nav li{
	float:left;
	width:198px;
	text-align:center;
	background-color:#fff;
	font-size:22px;
	color:#666;
	margin:15px 10px;
	padding:10px 0;
	border-radius:7px;
}
nav li:hover{
	background-color:#f5fff4;
}
nav li a{
	display:block;
	text-decoration:none;
	color:#666;
}

/* ===============================================
	side nav
=============================================== */
.user-box{
	background-color:#c9e0fa;
	border-radius:7px;
	padding:15px 9px;
	margin-bottom:20px;
}
.user-ttl{
	text-align:center;
	border-bottom:3px solid #0068b7;
	padding-bottom:5px;
	margin-bottom:10px;
}
.login-box{
	background-color:#fff;
	border:2px solid #ec6941;
	border-radius:7px;
	padding:10px 8px 0 8px;
	margin-top:5px;
}
a.btn-login{
	display:block;
	padding:10px;
	background-color:#ec6941;
	border-radius:7px;
	color:#fff;
	font-size:22px;
	font-weight:bold;
	text-align:center;
	text-decoration:none;
}
a.btn-login:hover{
	color:#fff;
}
ul.user-nav{
	margin:10px 0 0 15px;
}
ul.user-nav li{
	background:url(../img/common/bg_user.jpg) no-repeat 0 6px;
	padding-left:10px;
	margin-bottom:10px;
}
ul.user-nav li a{
	color:#333;
	text-decoration:none;
}

.calendar-box{
	border:1px solid #333;
	border-radius:7px;
	padding:15px 10px;
	margin-bottom:14px;
}
.calendar-ttl{
	text-align:center;
	border-bottom:3px solid #0068b7;
	padding-bottom:5px;
	margin-bottom:10px;
}
p.ttl-month{
	text-align:center;
	margin-bottom:5px;
}
.calendar-box table{
	border-collapse:collapse;
	width:100%;
}
.calendar-box th,
.calendar-box td{
	border:1px solid #333;
	text-align:center;
	line-height:24px;
	width:14%;
}
.calendar-box th{
	background-color:#b4d8f1;
}
p.ttl-open{
	background-color:#d2d2d2;
	padding:2px 5px;
}
p.txt-open{
	margin:5px 0 0 4px;
}

ul.sidenav-btn{
	margin-bottom:20px;
}
ul.sidenav-btn li{
	margin-bottom:7px;
}
ul.sidenav-btn li a{
	display:block;
	height:42px;
}
ul.sidenav-btn li a.sn-suishin{
	background:url(../img/common/btn_suishin.jpg) no-repeat 0 0;
}
ul.sidenav-btn li a.sn-suishin:hover{
	background:url(../img/common/btn_suishin.jpg) no-repeat 0 -42px;
}
ul.sidenav-btn li a.sn-unei{
	background:url(../img/common/btn_unei.jpg) no-repeat 0 0;
}
ul.sidenav-btn li a.sn-unei:hover{
	background:url(../img/common/btn_unei.jpg) no-repeat 0 -42px;
}
ul.sidenav-btn li a.sn-sentei{
	background:url(../img/common/btn_sentei.jpg) no-repeat 0 0;
}
ul.sidenav-btn li a.sn-sentei:hover{
	background:url(../img/common/btn_sentei.jpg) no-repeat 0 -42px;
}
ul.sidenav-btn li a.sn-toukei{
	background:url(../img/common/btn_toukei.jpg) no-repeat 0 0;
}
ul.sidenav-btn li a.sn-toukei:hover{
	background:url(../img/common/btn_toukei.jpg) no-repeat 0 -42px;
}

a.btn-contact{
	background:url(../img/common/btn_contact.jpg) no-repeat 20px 0;
	display:block;
	height:31px;
}
a.btn-contact:hover{
	background:url(../img/common/btn_contact.jpg) no-repeat 20px -31px;
}

/* ===============================================
	content
=============================================== */

/* top page - center column
-------------------------------------------------- */
.search-box{
	background-color:#e0f0a6;
	border-radius:7px;
	padding:20px;
}
.ttl-search{
	height:42px;
	font-size:28px;
	color:#000;
	background:url(../img/top/bg_search.png) no-repeat 0 0;
	padding:9px 0 0 48px;
	overflow:hidden;
	margin-bottom:15px;
}
.btn-detailed{
	height:24px;
	background:url(../img/top/bg_search.png) no-repeat 0 0;
	background-size:auto 22px;
	font-size:21px;
	display:block;
	float:right;
	padding:2px 0 0 28px;
	text-decoration:none;
	color:#333;
}
.search-box td input{ 
	vertical-align:0.1em;
}
.search-box td label{
	margin:0 15px 0 5px;
}
.inp-search {
	width:480px;
    height:40px;
    border:1px solid #7d7d7d;
	padding:0 10px;
	margin-bottom:10px;
}
.btn-search{
	width:100px;
	height:40px;
	background-color:#0068b7;
	color:#fff;
	font-size:22px;
    border:0 none;
    cursor:pointer;
	margin:0 8px;
	margin-bottom:10px;
}
.btn-search:hover{
	background-color:#3e95d8;
}

ul.search-btn{
	overflow:hidden;
	margin:15px 0 10px 7px;
}
ul.search-btn li{
	float:left;
	margin:0 3px;
	width:150px;
	border:1px solid #a0a0a0;
	border-radius:5px;
	background-color:#fff;
	text-align:center;
}
ul.search-btn li:hover{
	background-color:#f6fff4;
}
ul.search-btn li a{
	text-decoration:none;
	display:block;
	padding:8px 0;
	color:#333;
}

.tab_box{
    width:636px;
    margin:20px auto;
}
input[type="radio"]{
    display:none;
}
.tab_area{
    font-size:0;
}
.tab_area label{
    width:150px;
    display:inline-block;
    padding:10px 0;
    text-align:center;
    font-size:16px;
    border-radius:7px 7px 0 0;
	cursor:pointer;
}
.panel_area{
    background:#fff;
}
.tab_panel{
    width:100%;
    padding:0;
    display:none;
}
.tab1_label{
	background-color:#76c947;
	color:#fff;
	margin-right:12px;
}
.tab2_label{
	background-color:#f0f684;
	color:#333;
	margin-right:12px;
}
.tab3_label{
	background-color:#c9e0fa;
	color:#333;
	margin-right:12px;
}
.tab4_label{
	background-color:#f4dadc;
	color:#333;
}
#tab1:checked ~ .tab_area .tab1_label{background:#76c947; color:#fff;}
#tab1:checked ~ .panel_area #panel1{display:block; background-color:#76c947; border-radius:0 0 7px 7px; padding:13px 10px 10px 10px;}
#tab2:checked ~ .tab_area .tab2_label{background:#f0f684; color:#333;}
#tab2:checked ~ .panel_area #panel2{display:block; background-color:#f0f684; border-radius:0 0 7px 7px; padding:13px 10px 10px 10px;}
#tab3:checked ~ .tab_area .tab3_label{background:#c9e0fa; color:#333;}
#tab3:checked ~ .panel_area #panel3{display:block; background-color:#c9e0fa; border-radius:0 0 7px 7px; padding:13px 10px 10px 10px;}
#tab4:checked ~ .tab_area .tab4_label{background:#f4dadc; color:#333;}
#tab4:checked ~ .panel_area #panel4{display:block; background-color:#f4dadc; border-radius:0 0 7px 7px; padding:13px 10px 10px 10px;}

.panel-content{
	background-color:#fff;
	border-radius:5px;
	padding:20px 15px 15px 15px;
}
.scroll{
	height:400px;
	overflow-y:scroll;
}
ul.library-news{
}
ul.library-news li{
	padding-left:85px;
	margin-bottom:15px;
	min-height:22px;
}
ul.library-news li.kyotsu{
	background:url(../img/common/icn_kyotsu.jpg) no-repeat 0 0;
}
ul.library-news li.wakaba{
	background:url(../img/common/icn_wakaba.jpg) no-repeat 0 0;
}
ul.library-news li span{
	color:#003399;
}
.all-list{
	border-top:1px dotted #333;
	text-align:right;
	padding-top:15px;
}
a.btn-all{
	width:180px;
	height:40px;
	display:inline-block;
	background:url(../img/top/btn_all.jpg) no-repeat 0 0;
	text-indent:-9999px;
}
a.btn-all:hover{
	background:url(../img/top/btn_all.jpg) no-repeat 0 -40px;
}

.ttl-library-map{
	background:#f18048 url(../img/top/icn_library.jpg) no-repeat 13px center;
	color:#fff;
	border-radius:7px;
	padding:10px 0 10px 45px;
	font-size:22px;
	display:block;
}

p.txt-map{
	padding:20px 2px 30px 2px;
}

.qr-url{
	width:100%;
	margin-top:50px;
	overflow:hidden;
}
a.qr-sp{
	float:left;
	width:315px;
	height:80px;
	background:url(../img/top/qr_sp.jpg) no-repeat 0 0;
	display:block;
}
a.qr-sp:hover{
	background:url(../img/top/qr_sp.jpg) no-repeat 0 -80px;
}
a.qr-gara{
	float:right;
	width:315px;
	height:80px;
	background:url(../img/top/qr_gara.jpg) no-repeat 0 0;
	display:block;
}
a.qr-gara:hover{
	background:url(../img/top/qr_gara.jpg) no-repeat 0 -80px;
}

.qr-sp-sp,
.qr-gara-sp{
	display:none;
}

/* top page - right column
-------------------------------------------------- */
a.btn-kodomo,
a.btn-ya{
}
a.btn-kodomo img,
a.btn-ya img{
	margin-bottom:40px;
}
a.btn-kodomo-sp,
a.btn-ya-sp{
	display:none;
}

ul.right-nav{
	background-color:#e0f0a6;
	border-radius:7px;
	padding:12px;
	margin-bottom:20px;
}
ul.right-nav li{
	background-color:#fff;
	margin-bottom:12px;
}
ul.right-nav li:last-child{
	margin-bottom:0;
}
ul.right-nav li:hover{
	background-color:#f6fff4;
}
ul.right-nav li a{
	display:table-cell;
  	vertical-align:middle;
	height:75px;
	text-decoration:none;
	padding-left:60px;
}
ul.right-nav li a.rn-shogai{
	background:url(../img/top/icon_clover.png) no-repeat 12px center;
	color:#225722;
}
ul.right-nav li a.rn-chiiki{
	background:url(../img/top/icon_map.png) no-repeat 7px center;
	color:#074356;
}
ul.right-nav li a.rn-shinbun{
	background:url(../img/top/icon_newsp.png) no-repeat 11px center;
	color:#333;
}
ul.right-nav li a.rn-online{
	background:url(../img/top/icon_database.png) no-repeat 14px center;
	color:#651c1c;
}
ul.right-nav li a.rn-dayori{
	background:url(../img/top/icon_dayori.png) no-repeat 10px center;
	color:#5c5c0e;
}
ul.right-nav li a.rn-link{
	background:url(../img/top/icon_link.png) no-repeat 13px center;
	color:#a04917;
}

a.btn-digital{}
a.btn-digital-sp{
	display:none;
}
a.hvr-opacity:hover,
img.hvr-opacity:hover{
	opacity:0.9;
	filter:alpha(opacity=90);
	-ms-filter:"alpha( opacity=90 )";
}

/*  kccs add (Start) */
.org_tw-box{
	background-color: #c9e0fa;
}

.tw-box{
	background-color:#c9e0fa;
	border-radius:7px;
	padding:15px 9px;
	margin-bottom:20px;
}
.tw-ttl{
	text-align:center;
	border-bottom:3px solid #0068b7;
	padding-bottom:5px;
	margin-bottom:10px;
}

.musuaum-box{
	background-color:#f7f8f7;
	border-left:2px solid #666;
	color:#666;
	font-size:18px;
	font-weight:nomal;
	padding:10px;
	margin-bottom:15px;
}
.musuaum-txt{
	text-align:left;
	font-size:20px;
	line-height:24px;
	margin-bottom:10px;
}

.musuaum-img{
	margin:15px 0;
}
.musuaum-img img{
	width:100%;
}

/* KCCS ADD (End) */

/* content
-------------------------------------------------- */
.path{
	color:#666;
	margin-bottom:20px;
}
h2{
	background-color:#f5fff4;
	color:#4a8a3c;
	border-bottom:5px solid #4a8a3c;
	font-size:20px;
	font-weight:bold;
	padding:15px;
	margin-bottom:15px;
}
h3{
	background-color:#f7f8f7;
	border-left:5px solid #666;
	color:#666;
	font-size:20px;
	font-weight:bold;
	padding:15px;
	margin-bottom:15px;
}
p.txt{
	padding:15px;
	line-height:24px;
	margin-bottom:40px;
}

/* common :form
-------------------------------------------------- */
/*select*/
select::-ms-expand {
	display:none;
}
select {
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	padding:5px 30px 5px 10px;
	border:1px solid #39455a;
	background-image:url(../img/common/select_arrow.png);
	background-repeat:no-repeat;
	background-size:12px 10px;
	background-position:right 10px center;
	background-color:#fff;
	color:#555;
	width:100%;
	border-radius:0;
}

/* common :font & margin & padding
-------------------------------------------------- */
a{
	color:#003399;
}
a:hover{
	color:#666;
}

.mb-0{
	margin-bottom:0px;
}
.mb-1{
  margin-bottom:10px;
}
.mb-2{
	margin-bottom:20px;
}
.mb-3{
   margin-bottom:30px;
}
.mb-4{
	margin-bottom:40px;
}
.my-3{
	margin:30px 0;
}
.my-1{
	margin:10px 0;
}
.mt-1{
	margin-top:10px;
}
.mt-2{
	margin-top:20px;
}

.w-full{
	width:100%;
	box-sizing:border-box;
}

/* ===============================================
	Footer
=============================================== */
.page-top{
	width:1100px;
	margin:0 auto;
	text-align:right;
	height:35px;
}
.footer-body{
	background-color:#f4f2d0;
}
.footer-content{
	width:1100px;
	margin:0 auto;
	color:#6a3906;
	padding:25px 0 15px 0;
	position:relative;
	background-color:#f4f2d0;
}
.copyright{
	position:absolute;
	right:0;
	bottom:15px;
}


/*画面幅が781px以上の時*/
}