/*************************************************
style.css
**************************************************/
/* 共通スタイル */
/*検証用大枠css*/
.testmain{max-width: 1140px;margin: 0 auto;}
/*ここまで*/
:where(:root) {
  font-family: var(--font-primary);
  font-style: unset;
  font-weight: 500;
  line-height: 1.5;
  text-align: start;
  word-break: initial;
  line-break: strict;
  hyphens: auto;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
  box-sizing: border-box;
}

:where(body) {
  min-block-size: 100svb;
  margin: unset;
  padding: unset;
  background: var(--theme-color);
  color:var(--font-color) ;
  overflow-x: hidden;
}

:where(h1, h2, h3, h4, h5, h6) {
  margin-block: unset;
  font-size: unset;
}

img {
  max-inline-size: 100%;
  vertical-align: top;
}

ul {
  margin-block: unset;
  padding-inline-start: unset;
}

ul > li {
  list-style-type: '';
}

a {
  color: var(--link-color);
  text-decoration: none;
}
a:focus,a:hover{
  color:var(--hover-color) ;
  text-decoration: underline;
}

*:focus-visible {
  /* style */
  outline: 4px solid var(--border-focus);
  outline-offset: 2px;
  /* transition */
  transition: outline 0.3s ease-in-out;
}

.visually-hidden {
  position: fixed !important;
  /* keep it on viewport */
  top: 0px !important;
  left: 0px !important;
  /* give it non-zero size, VoiceOver on Safari requires at least 2 pixels
		 before allowing buttons to be activated. */
  width: 4px !important;
  height: 4px !important;
  /* visually hide it with overflow and opacity */
  opacity: 0 !important;
  overflow: hidden !important;
  /* remove any margin or padding */
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
  /* ensure no other style sets display to none */
  display: block !important;
}

.content {
  max-width: var(--container-content);
  width: 100%;
  margin-inline: auto;
  padding-inline: var(--space-16);
}
.fa, .far, .fas {
    font-family: "Font Awesome 5 Free";
}
.fab, .far {
    font-weight: 400;
}
.fa, .fab, .fad, .fal, .far, .fas {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}
p{line-height: 1.7;}
@media (min-width: 992px) {
  p{line-height: 1.9;}
}
p.mark_link{
  font-weight: bold;
}
p.mark_link a::before {
    font-family: "Font Awesome 5 Free";
    content: '\f138';
    color: #07519a;
    font-weight: 900;
    margin-right: 0.3em;
    vertical-align: middle;
}
/***********************
header追従
*************************/





/***********************
headerエリア
*************************/
.siteHeader{
    width: 100%;
    position: relative;
    z-index: var(--stack-head);
    top: 0;
    background-color: var(--white-color);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    margin-bottom: 0;
    min-height:var(--header-min-height);
    border: none;
}
.siteHeadContainer{
    margin: 0 auto;
    padding:16px 15px 44px ;
    position: relative;
}
/*logo*/
.siteHeader_logo {
    display: inline-block;
    height: auto;
    padding:var(--space-6) 0;
    margin: 0;
    font-size: var(--font-size-32);
    line-height: 1.5em;
    white-space: inherit;
}
.siteHeader_logo img {
    width: auto;
    max-height:40px;
    display: block;
}



/***********************
page_controlエリア
*************************/
.page_control {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 0;
    padding:0 var(--space-10);
    position: absolute;
    right: 0;
}
.UD {
    background-color: rgb(67 52 52 / 0%);
    margin: 0;
    padding: 0;
}
.page_control dl, .page_control dl dt, .page_control dl dd {
    min-height: var(--ud--change-button);
    margin: 0;
    padding: 0;
    font-size: var(--font-size-15);
}
.page_control dl {
    float: left;
    display: flex;
    height:var(--ud--change-button);
    margin: 0 0.5em 0 0;
    padding: 0;
    overflow: hidden;
}
.page_control dl.color_change dt, .page_control dl.textsize_change dt
 {
    display: flex;
    justify-content: center;
    align-items: center;
}
.page_control dl.textsize_change dt {
    width: 90px;
}
.page_control dl dd a {
    display: flex;
    width: 30px;
    height: 30px;
    margin: 2px;
    border: 2px solid #F0EFEE;
    border-radius: 0.3em;
    align-items: center;
    justify-content: center;
    color: #333;
    font-weight: bold;
}
.page_control dl.textsize_change dd.smaller a, .page_control dl.textsize_change dd.default a, .page_control dl.textsize_change dd.larger a {
    background-color: #e3d9ca;
}

/*検索フォーム*/
.page_control .search {
    width: var(--ud--search-size);
    margin: 0;
    padding: 0;
    float: right;
    text-align: center;
    border: 1px solid #ccc;
}
.page_control .search div {
    margin: 0;
    padding: 0;
}
.page_control .search label.search_txt {
    float: left;
    display: flex;
    align-items: center;
    justify-content: center;
    height: var(--ud--search-form-height);
    width: 0px;
    font-size: var(--font-size-14);
    overflow: hidden;
    color: #000;
    background-color: #fff;
}
.page_control .search input#search_txt {
    display: block;
    height: 30px;
    width: calc(100% - 4em);
    margin: 0%;
    padding: 0px 0.5em;
    line-height: 36px;
    background-color: #fff;
    border: none;
    float: left;
}
.page_control .search input.search_bt {
    display: block;
    width: 4em;
    height: 34px;
    margin: 0;
    padding: 0px 0;
    font-weight: bold;
    border: none;
    float: left;
}
.page_control .search input.search_bt {
    color: #FFF;
    background-color: #333;
}

/***********************
gnavエリア
*************************/
.gMenu_outer {
    width: 100%;
}
.gMenu {
    margin: 0 auto;
    padding: 0;
    display: flex;
    list-style: none;
    position: relative;
    width: 1110px;
}
.gMenu li {
    margin: 0;
    list-style: none;
    line-height: 1.4;
    position: relative;
    flex: 1 1 0;
}
.gMenu li a{
  border-right: 1px dashed #ccc;
    padding:14px 0 10px 0;
    display:block;
    width: 100%;
    text-align: center;
    color: #333;
    text-decoration: none;
}

.gMenu>li:before {
    position: absolute;
    left: 0;
    bottom: 0;
    content: "";
    width: 0;
    border-bottom: 1px solid #7b5e3c;
    transition: all .5s ease-out;
}

.gMenu>li:hover:before {
    width: 100%;
}
.gMenu>li .gMenu_name {
    font-size:var(--font-size-15);
    padding-top: 0.2em;
    display: block;
    white-space: nowrap;
}
/*nav画像*/
.gMenu li:first-child a:before{content: url(/core/img/komae_city_lib_cat-image_04_42px.png)}
.gMenu li:nth-child(2) a:before{content: url(/core/img/komae_city_lib_cat-image_03_42px.png)}
.gMenu li:nth-child(3) a::before{content: url(/core/img/komae_city_lib_cat-image_06_42px.png)}
.gMenu li:nth-child(4) a::before{content: url(/core/img/komae_city_lib_cat-image_05_42px.png)}
.gMenu li:nth-child(5) a::before{content: url(/core/img/komae_city_lib_cat-image_02_42px.png)}
.gMenu li:nth-child(6) a::before{content: url(/core/img/komae_city_lib_cat-image_08_42px.png)}
.gMenu li:nth-child(7) a::before{content: url(/core/img/komae_city_lib_cat-image_07_42px.png)}
/*gnavボタン*/
.SP-nav  {
    position: fixed;
    top: 5px;
    left: 5px;
    z-index: var(--stack-head);
    overflow: hidden;
    border: 1px solid #333;
    border-radius: 2px;
    width: 34px;
    height: 34px;
    cursor: pointer;
    text-indent: -9999px;
    background-size: 24px 24px;
    transition: border-color .5s ease-out;
    background:rgba(255, 255, 255, .8);
}
.menu_button {
            z-index: var(--stack-head);

        width: 34px;
        height: 34px;
        cursor: pointer;
}
.menu_button a {
    display: block;
    width: 100%;
    height: 100%;
}
.menu_button::before, .menu_button::after, .menu_button a::before {
    content: "";
    position: absolute;
    left: 6px;
    width: 20px;
    height: 2px;
        z-index: var(--stack-head);

    background: #333;
    transition: all 0.3s ease;
}
.menu_button::before{
        top: 9px;
}
.menu_button a::before {
    top: 16px;
}
.menu_button::after {
    top: 23px;
}

body.gnavmenu-open .menu_button::before {
    transform: translateY(7px) rotate(45deg);
}
    body.gnavmenu-open .menu_button a::before {
    opacity: 0;
}
    body.gnavmenu-open .menu_button::after {
    transform: translateY(-7px) rotate(-45deg);
}
/*SP-gnav*/
.SP-gnav {
    position: fixed;
    top:-2000px;
    z-index: var(--stack-drawer);
    width: 100%;
    height: 100%;
    display: block;
    padding: 45px 10px;
    background-color: #fff;
    border-bottom: 1px solid #e5e5e5;
    transition: top .5s ease-out;}
body.gnavmenu-open .SP-gnav {
    top:0;left: 0;}
.global-nav{
    margin-bottom: 1.5em;
}
 .SP-gnav .global-nav ul{
    padding: 0;
    margin: 0;
    border-top: 1px solid #ccc;
}
 .SP-gnav .global-nav ul li{
    line-height: 1.65;
    position: relative;
    margin-bottom: 0;
}
 .SP-gnav .global-nav ul li a{
    padding: .7em .5em;
    position: relative;
    display: block;
    overflow: hidden;
    border-bottom: 1px solid #ccc;
    color: #333;
}
 .SP-gnav .global-nav ul li a::before{
    margin-right: 0.5em;
    vertical-align: middle;
}
/*nav画像*/
.SP-gnav .global-nav ul li:first-child a:before{content: url(/core/img/komae_city_lib_cat-image_04_42px.png)}
.SP-gnav .global-nav ul li:nth-child(2) a:before{content: url(/core/img/komae_city_lib_cat-image_03_42px.png)}
.SP-gnav .global-nav ul li:nth-child(3) a::before{content: url(/core/img/komae_city_lib_cat-image_06_42px.png)}
.SP-gnav .global-nav ul li:nth-child(4) a::before{content: url(/core/img/komae_city_lib_cat-image_05_42px.png)}
.SP-gnav .global-nav ul li:nth-child(5) a::before{content: url(/core/img/komae_city_lib_cat-image_02_42px.png)}
.SP-gnav .global-nav ul li:nth-child(6) a::before{content: url(/core/img/komae_city_lib_cat-image_08_42px.png)}
.SP-gnav .global-nav ul li:nth-child(7) a::before{content: url(/core/img/komae_city_lib_cat-image_07_42px.png)}

/***********************
    sidemenuエリア
*************************/
.side-menu {
order: 1;        
padding: 0 15px;
    }

.subSection{
    display: block;
    margin-bottom: var(--space-24);
}

/***********かんたん検索**********/

#search_box {
    background-color: var(--sub-color-03);
    border-top: 5px solid var(--sub-color-04);
    padding: 1em;
}
#search_box h2 {
    color: var(--black-color);
    font-size: var(--font-size-20);
    margin-bottom: var(--space-10);
    padding-bottom: var(--space-4);
}
.fa-search:before {
  font-family: "Font Awesome 5 Free";
    content: "\f002";
    font-style: normal;
}
.form-box {
    margin: 0 !important;
    width: 100%;
}
.btn {
    display: inline-block;
    font-weight: 400;
    text-align: center;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size: var(--font-size-16);
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.form-control {
    display: block;
    height: 45px;
    margin-right: 0;
        margin-bottom: 3px;

    padding: .8em;
    width: 100%;
    font-size: var(--font-size-16);
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
#opac-search-form{
    position: relative;
    width: 100%;}
#opac-search-button {
    background-color: #47351f;
    border: 1px solid #47351f;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
    color: #ffffff;
    height: 45px;
    line-height: 0.5px;
    position: absolute;
    padding: .8em;
    right: 0;
    top: 0;
    vertical-align: middle;
    cursor: pointer;
}


.detailed_search {
    display: block;
    line-height: 1.9;
    -webkit-line-break: -height;
    background-color: #d3381c;
    border-radius: .4rem;
    color: #ffffff;
    margin: 0.8em 0 0 0;
    padding: 0.5em 0.2em;
    text-align: center;
    cursor: pointer;
}
.detailed_search:hover,.detailed_search:focus{
  background-color: #a92d16;
}
.search-menu-box {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    cursor: pointer;
}
.search-menu,
a.search-menu {
    display: block;
    line-height: 1.9;
    border: 1.5px solid var(--sub-color-05);
    border-radius:var(--rounded-4);
    color: var(--sub-color-05);
    font-size: var(--font-size-15);
    font-family: 'Noto Sans JP', sans-serif !important;
    margin: var(--space-12) 0 0 0;
    padding: var(--space-10) 0 var(--space-3) 0 ;
    text-align: center;
}
.search-menu:hover,.search-menu:focus{
  background-color: #c4b49b;
}
.fa-book:before {
  font-family: "Font Awesome 5 Free";
    content: "\f02d";
        font-weight: 900;
    font-size:  var(--font-size-32);
    font-style: normal;
}
.fa-crown:before {
  font-family: "Font Awesome 5 Free";
    content: "\f521";
        font-weight: 900;
    font-size: var(--font-size-32);
    font-style: normal;
}
.user-menu-box {
    border-top: 1px dashed #000;
    margin-top: 1em;
    
}
.user-menu {
    display: block;
    background-color: var(--sub-color-06);
    border: 1px dashed #ffffff;
    border-radius:var(--rounded-6);
    box-shadow: 0 0 0 5px var(--sub-color-06);
    color: #ffffff;
    /*font-size: --font-size;*/
    line-height: 1.9;
    margin: var(--space-12) 0 0 0;
    padding: var(--space-8) var(--space-2);
    text-align: center;
    cursor: pointer;
}
.user-menu:hover,.user-menu:focus{
      background-color:#3a4a18;

}
.search-menu-box > * {
    width: calc((100% - 16px) / 2);
}
.user-menu::before {
    content: '';
    background-image: url(/core/img/login_user_icon2.png);
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    height: 30px;
    margin-right: var(--space-6);
    width: 30px;
    vertical-align: middle;
}
/***********カレンダー**********/
.subSection-title{
    padding-bottom: 8px;
    position: relative;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    margin:18px 0 15px 0;
}
.subSection-title i {
    margin-right: 8px;
}
.subSection-title:after, h3:after {
    content: ".";
    line-height: 0;
    display: block;
    overflow: hidden;
    position: absolute;
    bottom: -1px;
    width: 30%;
    border-bottom: 1px solid #337ab7;
}
h3:after, .subSection-title:after {
    border-bottom-color: var(--sub-color-01);
}

#libraryHours-main {
    box-sizing: border-box;
    background-color: #fff;
    width: 100%;
    height: 100%;
    border: 1px solid #ccc;
}
.libraries {
    height: auto;
    padding: 10px 0px;
    border-bottom: 1px solid #ccc;
    background: #7b5e3c;
    z-index: 0;
}
.selects {
    background: #fff;
    border-radius: 5px;
    margin: 0 auto;
    position: relative;
    width: 90%;
}
.selects select {
  width: 100%;
  height: 32px;
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 1px 20px 0px 10px;
  font-size: var(--font-size-14);
  background: url("/core/img/iconMenuTriangleSP.png") no-repeat;
  background-position-y: 12px;
  background-position-x: 95%;
  /* appearance:none; */
  -moz-appearance:none;
  -webkit-appearance:none;
}

.selects select:focus{
  outline: 1px dotted #212121;
}

.selects select::-moz-focus-inner{
  border: 0;
}

.select select option{
  text-shadow: none;
}

.icon-down{
  display: inline-block;
  width:20px;
  height:16px;
}

.calendar {
  font-size: var(--font-size-14);
  border-collapse: collapse;
  width: 100% !important;
  text-align: center;
}

.calendar thead {
  background-color: #f5f5f5;
}

.calendar tbody {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  background: #fff;
}

.calendar tbody td {
  padding:5px;

}

.calendar tr:first-child > td {
  padding-top: 5px;
}

.calendar tr:last-child > td span {
  margin-bottom: 4px;
}

.calendar tr td span {
  display: block;
  margin: 0 auto;
  width: 25px;
}
#calendar {
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}
.calendar thead tr:nth-child(2) th {
  color: #555;
  padding-top: 5px;
}

.calendar thead tr th:first-of-type,
.calendar tr > td:first-of-type {
  padding-left: 10px;
}

.calendar thead tr > th:last-of-type,
.calendar tr > td:last-of-type {
  padding-right: 10px;
}

.calendar th, .calendar td {
  padding: 5px;
  text-align: center;
  -webki-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.calendar .currDay {
  cursor: default;
}

.calendar .selected {
  background-color: #22A7F0 !important;
  color: #FFF !important;
}

.calendar #currM {
  font-size: var(--font-size-18);
  padding-top: 4px;
}

.calendar #prev {
  background: url("/core/img/iconCalendarPrev.png") no-repeat right;
  cursor: pointer;
}

.calendar #next {
  background: url("/core/img/iconCalendarNext.png") no-repeat left;
  cursor: pointer;
}

.calendar .currDay span {
  text-decoration: underline;
}

.calendar .eventDay span {
  border-radius: 3px;
  background: #208880;
  color: #fff;
}

.calendar .eventDay {
  cursor: pointer;
}

.calendar .closingDay span {
  border-radius: 100%;
  background: #f3b3cd;
}
.library-select-wrapper{
  background: #7b5e3c;
}
.library-select-wrapper>#library-select{
  margin-bottom: 0;
  margin: 10px 0;
  background:#fff url(/core/img/iconMenuTriangleSP.png) no-repeat;
    background-position-y: 12px;
    background-position-x: 95%;
}

.calendarIcon {
  height: 18px;
  margin-left: 0;
  padding-left:1em;
  padding-top: 0.8em;
    padding-bottom: 1.8em;
    background: #fff;
}

.calendarIcon li {
  float: left;
  font-size:  var(--font-size-12);
  list-style: none;
  margin-right: 10px;
}

.calendarIcon li:last-child {
  margin-right: 0px;
}

.calendarIcon .todayIcon {
  border-bottom: 1px solid #212121;
}

.calendarIcon .closedIcon::before {
  content: url('/core/img/iconCalendarListClosed.png');
  padding-right: 4px;
}

.calendarIcon .eventIcon::before {
  content: url('/core/img/iconCalendarListEvent.png');
  padding-right: 4px;
}

.blocks-gallery-item__caption{
  padding:2em 0 0 0 !important;

}

li.blocks-gallery-item {
  height: 150px;
}

.rl-gallery .rl-gallery-link .rl-gallery-caption{
  background:linear-gradient(0deg,rgba(0,0,0,.7),rgba(0,0,0,.3) 70%,transparent) !important;
  text-align:center !important;
  padding:0.5em 0 !important;
}




/*================side-menu================*/
.side-b-frame a{
  border: 1.8px solid #c99f29;
  border-radius:5px;
  color: #555;
  font-size:  var(--font-size-19);
  font-weight: bold !important;
  padding:0.6em 0.6em 0.5em 0.6em;
  margin-bottom:0 !important;
  position: relative;
  width: 100%;
  display: inline-block;
}

.side-b-frame a::after{
  font-family: "Font Awesome 5 Free";
  /* content: '\f105'; */
  color: #c99f29;
  font-weight: 900;
  float: right;
  right: 0.5em;
  margin-top: 0.1em;
  vertical-align: middle;
  position: absolute;
}

.side-b-frame a:hover{
  background-color:#fff;
}

.side-b-frame a:hover{
  text-decoration:none;
}
/*サイドメニューアイコン*/
.shien a::before {
    content: '';
    background-image: url('/core/img/komae_city_lib_cat-image_01.png');
    background-size: contain;
    display: inline-block;
    height: 40px;
    margin-right: 0.4em;
    width: 40px;
    vertical-align: middle;
}
.yukari a::before {
    content: '';
    background-image: url('/core/img/komae_city_lib_cat-image_02.png');
    background-size: contain;
    display: inline-block;
    height: 40px;
    margin-right: 0.4em;
    width: 40px;
    vertical-align: middle;
}
.side-b-frame.album a::before {
    content: '';
    background-image: url('/core/img/komae_city_lib_cat-image_04c.png');
    background-size: contain;
    display: inline-block;
    height: 40px;
    margin-right: 0.4em;
    width: 40px;
    vertical-align: middle;
}
.tdb a::before {
    content: '';
    background-image: url('/core/img/komae_city_lib_cat-image_03.png');
    background-size: contain;
    display: inline-block;
    height: 40px;
    margin-right: 0.4em;
    width: 40px;
    vertical-align: middle;
}
.volunteer a::before {
    content: '';
    background-image: url('/core/img/komae_city_lib_cat-image_06_42px.png');
    background-size: contain;
    display: inline-block;
    height: 40px;
    margin-right: 0.4em;
    width: 40px;
    vertical-align: middle;
}
.ya a::before{
    content: '';
    background-image: url('/core/img/komae_city_lib_cat-image_09.png');
    background-size: contain;
    display: inline-block;
    height: 40px;
    margin-right: 0.4em;
    width: 40px;
    vertical-align: middle;
}


.kids-page{
	background-image: url(https://www.library.komae.tokyo.jp/site/wp-content/uploads/2020/11/komae_city_lib_kids_page_side_banner_02.png);
	background-size: 100% auto;
	background-position:50% 50%;
	background-repeat: no-repeat;
	height:80px;
}

.kids-page p{
	border:none !important;
	color:#7b5e3c;
	font-size: var(--font-size-22);
	font-weight:bold !important;
	text-align:center;
	padding: 6% 0 0 0!important;
}

.kids-page :hover{
	opacity:0.7;
}

.kids-page a:hover{
  text-decoration:none;
}



.req-form a p::before{
  content: '';
  background-image: url(https://www.library.komae.tokyo.jp/site/wp-content/uploads/2021/01/komae_city_lib_cat-image_10v.png);
  background-size: contain;
  display: inline-block;
  height: 40px;
  margin-right:0.4em;
  width: 40px;
  vertical-align: middle;
}

#custom_html-6,#custom_html-7,#custom_html-8,#custom_html-9,
#custom_html-23,#custom_html-25,#custom_html-34{
  margin-bottom: 0.8em;
}
.side-b-frame a::after {
    font-family: "Font Awesome 5 Free";
    content: '\f105';
    color: #c99f29;
    font-weight: 900;
    float: right;
    right: 0.5em;
    margin-top: 0.1em;
    vertical-align: middle;
    position: absolute;
}
.subSection .side-b{
  margin-top: 1em;
}

.txtbox h2>img{margin-right:10px;width: 40px;}













/*================side-menu end================*/

/***********************
    textboxエリア
*************************/
.mainSection{
  padding: 0 15px;
}
/*locusエリア*/
.locus-container {
    display: flex;
    height: min-content;
    margin-inline: auto;
    margin-block-end: var(--space-none);
    background: var(--theme-color);
    font-size: var(--font-size-14);
    border-bottom: 1px solid rgba(0, 0, 0, .05);
    padding: 0 15px;
}
.fa-home:before {
    font-family:"Font Awesome 5 Free";
    font-weight: 900;
    content: "\f015";
}
p.locus{
    margin: 0.5em 0;
}
.locus span:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
    content: "\f015";
}
/*更新日時・カテゴリエリア*/
.content-date-wrap {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1em;
}
body.album1 .content-date-wrap {
    margin-bottom: .5em;
}
.content-date-area{
  display: flex;
  font-size: var(--font-size-12);
}
.content-date{
  padding: 0 !important;
}
.content-library::before {
    margin-right: 5px;
    font-family: "Font Awesome 5 Free";
    content: "\f303";
    font-weight: 900;
}
.content-date:before{
  margin-right: 5px;
    font-family: "Font Awesome 5 Free";
    content: "\f073";
    font-weight: 900;
}
.content-category-area {
  display: flex;
  gap: var(--space-14);
  flex-wrap: wrap;
}
.komae__category{
    font-size: var(--font-size-12);
    float: right;
    margin-right: 0;
}

.txtbox{
    width: 66.66667%;
    order: 2;
}






/***********************
footerエリア
*************************/
.Remarks{
  max-width: 1140px;
  font-size: 0.8em;
  padding:0 16px ;
  margin: 0 auto 0.8em;
}
#backtop{
  position: fixed;
    cursor: pointer;
    z-index: 199;
  opacity: 0.8;
    right: 20px;
    bottom: 20px;
    display: block;
}
#backtop:hover,#backtop:focus{
  opacity: 1;
}
.siteFooter{
  border-top: 3px solid var(--sub-color-01) ;
  background-color: var(--white-color-01) ;
}
.siteFooter nav{
    max-width: 1140px;
        margin: 0 auto;

}
.siteFooter-nav{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.siteFooter-nav li{
    font-size: 1.1em !important;
    font-weight: bold;
}

.siteFooter-nav li a{text-decoration: none;border-left: 1px solid var(--color-footer-border, #ccc);color: #464646;}
.siteFooter-nav li a:hover,.siteFooter-nav li a:focus{text-decoration: underline;}

.siteFooter-nav li:first-child a::before {
    font-family: "Font Awesome 5 Free";
    content: '\f108';
    font-weight: 900;
    padding-right: 0.3em;
}
.siteFooter-nav li:nth-child(2) a::before {
    font-family: "Font Awesome 5 Free";
    content: '\f0e0';
    font-weight: 900;
    padding-right: 0.3em;
}
.siteFooter-nav li:nth-child(3) a::before {
    font-family: "Font Awesome 5 Free";
    content: '\f0c1';
    font-weight: 900;
    padding-right: 0.3em;
}
.siteFooter-nav li:nth-child(4) a::before {
    font-family: "Font Awesome 5 Free";
    content: '\f0e8';
    font-weight: 900;
    padding-right: 0.3em;
}
.siteFooter-nav li:nth-child(5) a::before {
    font-family: "Font Awesome 5 Free";
    content: '\f086';
    font-weight: 900;
    padding-right: 0.3em;
}
/*********footer中部**********/
.footerWidget{
    padding-top: var(--space-32);
    max-width: 1140px;
    margin: 0 auto;
}
.widget{
    margin-bottom: var(--space-24);
}
.footerWidget h2{
    font-size: var(--font-size-24);
    margin-bottom: var(--space-8);
}
.footerWidget p{
    line-height: 1.3;
    margin-bottom: var(--space-8);
    margin-top: 0;
}
.footerWidget p:first-of-type{
  margin: 0;
}
.copySection{
    padding-bottom: var(--space-32);
    border-top: var(--color-footer-border, #ccc);
    text-align: center;
}
.copySection p {
    font-size:  var(--font-size-12);
    margin: 0 15px 5px;
}
.siteFooter nav{
    padding-inline: var(--space-16);
    padding-top: 15px;
  }
.siteFooter .footerWidget{
  padding-inline: var(--space-16);
}
.contents_inside{
  padding: 3.5em 0 4em 0;
}

/*******************
     min-width
*******************/
@media (min-width: 576px) {
  .content,.Remarks{
    max-width: 540px;
  }
    .contents_main article {
        max-width: 540px;
        margin: 0 auto;
    }
    .siteFooter nav{
      max-width: 540px;
    }
    .siteFooter .footerWidget{
      max-width: 540px;
    }
}

@media (min-width: 768px) {
    .content,.Remarks{
    max-width: 720px;
  }
    .siteFooter-nav li a {
        border-left: 1px solid var(--color-footer-border, #ccc);
        padding: 0 1em;
    }
    .siteFooter-nav li:last-child a {
        border-right: 1px solid var(--color-footer-border, #ccc);
    }
    /*footer中部*/

 .contents_main article{
      max-width: 720px;
    }
      .siteFooter nav{
      max-width: 720px;
    }
    .siteFooter .footerWidget{
      max-width: 720px;
    }

}
@media (min-width: 960px) {
    .search-menu-box div {
        width: 48%;
    }

}
@media (min-width: 992px) {
   .content,.Remarks{
    max-width: 960px;
  }
.contents_inside {
    display: flex;
}
body.top .mainSection {
        order: 2;}
body.album .contents_inside {
    display: block;
}
    .siteHeadContainer {
        padding-top: var(--space-16);
        padding-bottom: var(--space-4);
    }
    .navbar-header {
        height: 80px;
        margin-bottom: 1em;}
    .siteHeader_logo img {
        max-height: 70px !important;
    }
        .gMenu_outer {

        transition: top 1s;
    }
    .gMenu li:first-child {
        border-left: 1px dashed #ccc;
    }
    .SP-nav{display: none;}
    .side-menu {
        width: calc(100% - 66.66667% - 3rem);
        
    }
    .contents_main article{
      max-width: 1140px;
      margin: 0 auto;
    }
    .side-menu {
order: 1;        
margin-right: 50px;
    }
      .siteFooter nav{
      max-width: 960px;
    }
    .siteFooter .footerWidget{
      max-width: 960px;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .side-menu{
    padding: 0 3.6px;}}
@media (min-width: 1200px) {
   .content,.Remarks,.siteFooter nav,.siteFooter .footerWidget{
    max-width: 1140px;


  }

    .siteHeadContainer{
        max-width:var(--max-viewport-width);
    }
    .siteHeader_logo {
        float: left;
    }
        .gMenu_outer {
        width: auto;
        min-height: 4em;
        display: table;
    }
    .gMenu_outer nav {
        display: table-cell;
        vertical-align: middle;
    }
    .gMenu {
        right: 0;
        margin: 0 auto;
        float: none;
    }
    .photo-list__detail-link{
      width: 100%;
    }
}





/*******************
     max-width
*******************/
@media (max-width: 660px) {
.content-date-wrap {
  flex-direction: column;
}

.komae__category {
    width: 100%;
}
    .siteHeader_logo img {
        float: none;
        display: block;
        margin: 0 auto;
        max-height: 40px;
        margin-left: 1em;
    }
    .siteHeadContainer .page_control{
      display: none;
    }

}
@media (max-width: 767px) {
    .siteFooter-nav {
        display: unset;
    }
    .siteFooter-nav li{
        overflow: hidden;
        padding: 8px 0;
    }
    .siteFooter-nav li a{
        border-left: none;
    }
   
}
@media (max-width: 959px) {
    .side-menu #search_box {
        display: none ;
    }

}
@media (max-width: 991.98px) {
    .navbar-header {
        float: none;
    }
        .siteHeader_logo {
        font-size: 1.6rem;
        float: inherit;
        text-align: center;
        display: block;
        margin: 0 auto;
        padding: 0 25px;
    }
             .global-nav .page_control {
    display: flex;
    align-items: center;
    margin: 2em 0 0 0;
    padding: 0 var(--space-10);
    position: absolute;
    right: 0;
    width: 100%;
    justify-content: center;
}
        .siteHeader_logo img {
        float: left;
        display: block;
        margin: 0 auto;
        max-height: 40px;
        margin-left: 1em;
        position: absolute;
        top: 5px;
    }
        .gMenu_outer
 {
        display: none;
    }
.sideSection {
        width: 100%;
    }
    .contents_inside {
    display:block;
    padding: 1.5em 0 0 0;
}
}
@media (max-width: 1100px) {
      .gMenu {
        width: 1000px;
    }
}
@media (max-width: 1199.98px) {
    .siteHeader_logo{
        width: 100%;
        text-align: center;
    }
    .gMenu_outer nav {
        text-align: center;
    }
    .gMenu {
        display: inline-flex;
        margin: 0 auto;
    }
}




@media (min-width: 960px) {
    .search-menu-box div {
        width: 48%;
    }
    .entry-body #search_box{
  display: none;
}
}





/* ===============================
TxtBox(CMS用)
================================ */
:root {
  /*----- txtbox common -----*/
  /* テキスト */
  --txtbox-font-size: var(--font-size-16);
  --txtbox-font-weight: var(--fontweight-regular);
  --txtbox-line-height: 1.7;
  /* リンク */
  --txtbox-link-color: var(--link-color);
  --txtbox-link-color-hover: var(--link-color) ;
  /* マーカー */
  --txtbox-marker-color: #333;
  --txtbox-marker-size: 7px;
  /*----- heading -----*/
  /* h1 */
  --heading-h1-border-color: var(--sub-color-01);
  --heading-h1-text-color: var(--font-color);
  --heading-h1-background-color: var(--sub-color-01);
  --heading-h1-font-size: var(--font-size-30);
  --heading-h1-font-weight: var(--fontweight-regular);
  --heading-h1-letter-spacing: var(--tracking-value-4);
  --heading-h1-line-height: 1.1;
  /* h2 */
  --heading-h2-bg-color: var(--sub-color-07);
  --heading-h2-border-color: transparent;
  --heading-h2-border-radius: var(--rounded-4);
  --heading-h2-text-color: currentColor;
  --heading-h2-font-size: var(--font-size-26);
  --heading-h2-font-weight: var(--fontweight-semibold);
  --heading-h2-line-height: 1.5;
  --heading-h2-letter-spacing: var(--tracking-value-5);
  /* h3 */
  --heading-h3-marker-color: var(--sub-color-01);
  --heading-h3-border-color: var(--sub-color-01);
  --heading-h3-text-color: var(--color-text-default);
  --heading-h3-font-size: var(--font-size-24);
  --heading-h3-font-weight: var(--fontweight-semibold);
  --heading-h3-line-height: 1.5;
  --heading-h3-letter-spacing: var(--tracking-value-5);
  /* h4 */
  --heading-h4-marker-color: var(--sub-color-01);
  --heading-h4-text-color: currentColor;
  --heading-h4-font-size: var(--font-size-22);
  --heading-h4-font-weight: var(--fontweight-semibold);
  --heading-h4-line-height: 1.6;
  --heading-h4-letter-spacing: var(--tracking-value-5);
  /* h5 */
  --heading-h5-marker-color: var(--sub-color-04);
  --heading-h5-border-radius: 0;
  --heading-h5-text-color: currentColor;
  --heading-h5-font-size: var(--font-size-20);
  --heading-h5-font-weight: var(--fontweight-semibold);
  --heading-h5-line-height: 1.5;
  --heading-h5-letter-spacing: var(--tracking-value-5);
  /* h6 */
  --heading-h6-marker-color: none;
  --heading-h6-text-color: currentColor;
  --heading-h6-font-size: var(--font-size-18);
  --heading-h6-font-weight: var(--fontweight-semibold);
  --heading-h6-line-height: 1.6;
  --heading-h6-letter-spacing: var(--tracking-value-6);
  /*----- table -----*/
  --table-border-color: var(--font-color);
  --table-header-bg-color: var(--sub-color-07);
  --table-cell-bg-color: var(--white-color);
  --table-text-color: currentColor;
  --table-header-text-color: currentColor;
}
.txtbox {
  /* size */
  width: 100%;
  text-spacing-trim: trim-start;
}
.txtbox:not(h1, h2, h3, h4, h5, h6) {
  color: var(--font-color);
  font-size: var(--txtbox-font-size);
  font-weight: var(--txtbox-font-weight);
  line-height: var(--txtbox-line-height);

}

.txtbox {
  margin-block-start: var(--space-10);
  padding: 0 15px;
}
.txtbox i,
.txtbox em {
  text-indent: 0.5em;
}
.txtbox ul {
  margin-block-end: 1.2em;
}
.txtbox ul > li {
  position: relative;
}
.txtbox ul > li:before {
  /* layout */
  content: "";
  display: block;
  /* position */
  position: absolute;
  inset-inline-start: 1em;
  inset-block-start: 0.5em;
  /* size */
  width: var(--txtbox-marker-size);
  height: var(--txtbox-marker-size);
  /* style */
  background: var(--txtbox-marker-color);
  border-radius: var(--rounded-full);
}
ul + h2,
ol + h2 {
  margin-block-start: var(--space-32);
}
ul + img,
ol + img {
  margin-block-start: var(--space-24);
}
.txtbox table.wide_table caption,
.txtbox table.widetable caption {
  text-align: center;
}
.txtbox a {
  text-underline-offset: 0.2em;
}
a.outside,
a.sizeview {
  color: var(--txtbox-link-color);
  /* transition */
  transition: color 0.3s ease;
}
.txtbox a:hover,
.txtbox a:focus-within {
  color: var(--color-text-link-hover);
}

.image_box_left + div {
  ul, ol {
    overflow: hidden;
  }
  li {
    float: left;
    width: 100%;
  }
}

/* heading h1 */
.category-title-top {
  /* layout */
  position: relative;
  display: block;
  width: 100%;
  padding: var(--space-36) 0;
  /* style */
  color:#fff;
  background-color: var(--heading-h1-background-color);
  text-align: center;
  /* typography */
  font-size: var(--heading-h1-font-size);
  font-weight: var(--heading-h1-font-weight);
  line-height: var(--heading-h1-line-height);
}
h1.page-title-top {
  /* layout */
  position: relative;
  display: block;
  width: 100%;
  padding: var(--space-34) 0;
  /* style */
  color:#fff;
  background-color: var(--heading-h1-background-color);
  text-align: center;
  /* typography */
  font-size: var(--heading-h1-font-size);
  font-weight: var(--heading-h1-font-weight);
  line-height: var(--heading-h1-line-height);
}
h1.page-title {
  /* layout */
  position: relative;
  display: block;
  width: 100%;
  padding:0 0 .5em 0;
  /* style */
  color: var(--heading-h1-text-color);
  /* typography */
  font-size: var(--heading-h1-font-size);
  font-weight: 500;
  line-height: var(--heading-h1-line-height);
  margin-bottom: 2.2rem;
  border-bottom: 1px solid rgba(0, 0, 0, .05);
}

.category-title-top>h1.page-title {
  /* layout */
  position: relative;
  display: block;
  padding:0;
  /* style */
  color:#fff;
  /* typography */
  font-size:unset;
  font-weight: var(--heading-h1-font-weight);
  line-height:var(--heading-h1-line-height);
  margin-bottom: 0;
  border-bottom:0;
}
/* heading h2 */
.txtbox h2 {
  /* layout */
  position: relative;
  width: 100%;
  margin-block-end: var(--space-20);
  padding-inline: var(--space-16);
  padding-block: var(--space-12);
  /* style */
  border: 1px solid var(--heading-h2-border-color);
  border-radius: var(--heading-h2-border-radius);
  color: var(--heading-h2-text-color);
  border-top: 2px solid var(--sub-color-01);
  border-bottom: 2px dashed #c69b21;
  /* typography */
  font-size: var(--heading-h2-font-size);
  font-weight: var(--heading-h2-font-weight);
  line-height: var(--heading-h2-line-height);
  letter-spacing: var(--heading-h2-letter-spacing);
  * + & {
    margin-block-start: var(--space-44);
  }
  
}
body.album1 h2.page-title {
  /* layout */
  position: relative;
  display: block;
  width: 100%;
  padding:0 0 .5em 0;
  margin-top: 0;
  /* style */
  color: var(--heading-h1-text-color);
  /* typography */
  font-size: var(--heading-h1-font-size);
  font-weight:500;
  line-height: var(--heading-h1-line-height);
  margin-bottom: 2.2rem;
  border-bottom: 1px solid rgba(0, 0, 0, .05);
  border-top: none;
}
/* heading h3 */
.txtbox h3 {
  /* layout */
  position: relative;
  /* sytle */
  color: var(--heading-h5-text-color);
  font-size: var(--heading-h3-font-size);
  font-weight: var(--heading-h5-font-weight);
  letter-spacing: var(--heading-h5-letter-spacing);
  border-bottom: 1px solid #c99f29;
  padding-bottom: 0.2em;
}
.txtbox h3::before {
font-family: "Font Awesome 5 Free";
    content: '\f276';
    color: #c99f29;
    font-weight: 900;
    margin-right: 0.3em;
    vertical-align: middle;
}
/* heading h4 */

.txtbox h4 {
  /* layout */
  position: relative;
  margin-block-end: var(--space-16);
  padding-block-start: var(--space-8);
  padding-block-end: var(--space-8);
  padding-inline-start: calc(5px + var(--space-12));
  border-bottom: 1px solid rgba(0, 0, 0, .1);
  /* style */
  color: var(--heading-h3-text-color);
  /* typography */
  font-size: var(--heading-h4-font-size);
  font-weight: var(--heading-h3-font-weight);
  line-height: var(--heading-h3-line-height);
  letter-spacing: var(--heading-h3-letter-spacing);
}
.txtbox h4::after {
    content: ".";
    line-height: 0;
    display: block;
    overflow: hidden;
    position: absolute;
    bottom: -1px;
    width: 30%;
    left: 0px;
    border-bottom: 1px solid var(--sub-color-01);
}
/* heading h5 */


.txtbox h5 {
  /* layout */
  border-left: 5px solid #c99f29;
    font-weight: bold;
    padding-left: 0.3em;
  /* style */
  color: var(--heading-h4-text-color);
  font-size: var(--heading-h5-font-size);
  font-weight: var(--heading-h4-font-weight);
  line-height: var(--heading-h4-line-height);
  letter-spacing: var(--heading-h4-letter-spacing);
}
/* heading h6 */
.txtbox h6 {
  position: relative;
  padding-inline-start: calc(0 + var(--space-6));
  font-size: var(--heading-h6-font-size);
  font-weight: var(--heading-h6-font-weight);
  letter-spacing: var(--heading-h6-letter-spacing);
}

/* table */
.txtbox table {
}
.txtbox table th {
  border: 1px solid #ccc;
}
.txtbox table td {
  border: 1px solid #ccc;
}
.txtbox table th {
  color: var(--table-header-text-color);
  background: #c99f2938;
}
.txtbox table th[scope="col"] {
  background: var(--table-header-bg-color);
}
.txtbox table th[scope="row"] {
  background: var(--table-header-bg-color);
  border: 1px solid var(--table-border-color);
}
.txtbox table td {
  background: var(--table-cell-bg-color);
}
.txtbox h3, .txtbox h4, .txtbox h5, .txtbox h6{
  margin-block-start: var(--space-46);
  margin-block-end: var(--space-36);
}
@media (width < 768px) {
  h1.page-title {
    padding-block-end: var(--space-8);
    /* typography */
    font-size: calc(var(--heading-h1-font-size) * 0.88);
  }
  h1.page-title::after {
    inset-block-end: calc(-1 * var(--space-4));
  }
  .txtbox h2 {
    font-size: calc(var(--heading-h2-font-size) * 0.8);
  }
  .txtbox h3 {
    font-size: calc(var(--heading-h3-font-size) * 0.85);
  }
  .txtbox h4 {
    font-size: calc(var(--heading-h4-font-size) * 0.85);
  }
  .txtbox h5 {
    font-size: calc(var(--heading-h5-font-size) * 0.88);
  }
  .txtbox h6 {
    font-size: calc(var(--heading-h6-font-size) * 0.9);
  }
  .txtbox:not(h1, h2, h3, h4, h5, h6) {
    font-size: calc(var(--txtbox-font-size) * 0.89);
  }
}

/*更新日カテゴリエリア*/
.wrap.locus_wrap.content{
  padding: 0;
}
.news-list__meta>.komae__category{
  float: none;
  margin-right: 1em;
}
.komae__category a{
    text-decoration: none;
    color:var(--font-color) ;
    cursor: pointer;
    padding: var(--space-6) var(--space-14);
    border-radius:var(--rounded-6) ;
    font-weight: bold;
}
.komae__category a:focus,.komae__category a:hover{
    color:var(--white-color) ;
}
.komae__category-01 a{
    background-color: var(--sub-color-02);
    border: none;
}
.komae__category-02 a{
    background-color:#7fd7b6;
    border: none;
}
.komae__category-03 a{
    background-color:#a0d8ef;
    border: none;
}
.komae__category-04 a{
    background-color:#ffbbab;
    border: none;
}
.komae__category-05 a{
    background-color:#ee827c;
    border: none;
}
.komae__category-06 a{
  background-color: #ffa692;
  border: none;
}
.komae__category-07 a{
  background-color: #deb068;
  border: none;
}
.komae__category-08 a{
  background-color: #cca6bf;
  border: none;
}
.komae__category-09 a{
  background-color: #bce2e8;
  border: none;
}
.komae__category-10 a{
  background-color: #c5c56a;
  border: none;
}
.komae__category-11 a{
  background-color: #b9d08b;
  border: none;
}
.komae__category-12 a{
  background-color: #f6b894;
  border: none;
}
.komae__category-13 a{
  background-color: #ebe1a9;
  border: none;
}
.komae__category-14 a{
  background-color: #e9dfe5;
  border: none;
}

.entry-meta-dataList dl{
  display: flex;
}
.entry-meta-dataList dt
 {
    float: left;
    background-color: #666;
    color: #fff;
    font-size: 0.6em;
    line-height: 1.1em;
    padding: 6px 8px 4px 8px;
    font-weight: lighter;
    margin-right: 10px;
    border: none;
    min-width: 10em;
    text-align: center;
    border-radius: 3px;
}
.entry-meta-dataList dd {
    font-size: 0.8em;
    border: none;
    padding-left: 0;
}
.entry-meta-dataList a{
  font-weight: bold;
}
@media (min-width: 992px) {
    .txtbox {
        width: 66.66667%;
    }
}
.txtbox a {
  font-weight: bold;
}
div.txtbox.link_section,div.txtbox.file_section{
  float: none;padding: 0;
}

/*ページ内リンクエリア*/
ul.news-paper-list, ul.guidance-list, ul.documents-list, ul.facility-list, ul.service-list, ul.yukari-list, ul.faq-list {
    background-color: rgba(255, 255, 255, 0.7);
    border: 2px solid #af8700;
    border-radius: 10px;
    padding: 1em;
    margin-top: 0;
}
.guidance-list>li, .documents-list li, .faq-list li {
    display: inline-block;
    padding: 0 1em 0 1em !important;
    margin-bottom: 0;
}
.guidance-menu li a, .documents-menu li a, .facility-menu li a, .news-paper-list li a, .guidance-list li a, .documents-list li a, .facility-list li a, .service-list li a, .yukari-list li a, .faq-list a {
    color: #333333 !important;
  font-weight: bold;
}
.guidance-menu li a::before, .documents-menu li a::before, .facility-menu li a::before, .news-paper-list li a::before, .guidance-list li a::before, .documents-list li a::before, .facility-list li a::before, .service-list li a::before, .yukari-list li a::before, .faq-list li a::before {
    font-family: "Font Awesome 5 Free";
    content: '\f0a9';
    font-weight: 900;
    padding-right: 0.3em;
}
.txtbox ul.guidance-list>li:before{
  display: none;
}
.txtbox ul.guidance-list>li{
  font-size: 0.9em;
  margin:0;
}














.mainSection{
  width: 100%;
}
/*本日の開館状況*/
.container-3 {
    display: flex;
    gap: 2em;
    flex-wrap: nowrap;
    box-sizing: border-box;
    border-bottom: 2px solid #7b5e3c;
    margin-bottom: 1.2em;
    padding-bottom: 0.3em;
}
.block-column {
    flex-grow: 1;
    min-width: 0;
    word-break: break-word;
    overflow-wrap: break-word;
}
.container-1>h5{
    border-bottom: 1px solid #c99f29;
    font-weight: bold;
    padding-bottom: 0.2em;
    font-size: var(--font-size-20);
    margin: 1.5em 0 1.2em;
    line-height: 1.2;
    width: 85%;
}
.container-1>h5::before {
    font-family: "Font Awesome 5 Free";
    content: '\f276';
    color: #c99f29;
    font-weight: 900;
    margin-right: 0.3em;
    vertical-align: middle;
}
.has-black {
    color:#000;
}
.has-black a {
        color: #07519a;
    line-height: 1.65em;
    letter-spacing: .05em;
    text-decoration: none;
}
.has-black a:hover,.has-black a:focus{
  color: #0056b3;
  text-decoration: underline;
}

.container-2:first-child{float: right;}
.date_for_events {
    font-size:  var(--font-size-20);
    float: right;
}



/*図書館開館情報*/
.todays-events{
  margin-top: 1.5em;
  margin-bottom: 1.2em;
}
.todays-events>li>table{
  width: 100%;
    border-collapse: separate;
    border-spacing: 1em 0;
    border: none;
}
.todays-events>li>table>tbody>tr{
      border: none;
}

.todays-events>li>table>tbody>tr>td{
    width: 50%;
    text-align: center;
    padding:1.5em 1em 0.5em 1em;
    font-size: 14px;
}
.todays-events>li>table>tbody>tr>td>span{
  font-size: 16px;
}
.todays-events>li>table>tbody>tr>td.frame {
    border: 1px solid #c99f29;
    background-color: #ffffff;
    padding:0.6em 0.5em;
    margin-bottom: 0.8em;

}

/***************
重要なお知らせ
***************/
.top-important-news {
    background-color: #ffffff;
    border: 2px solid #d12525;
    border-radius: 5px;
    padding: 0.5em;
    margin-bottom: 1.7em;
    margin-top: 3em;
}
.top-important-news h4 {
    border-bottom: 2px dashed #d12525;
    border-left: none !important;
    font-size: 18px;
    font-weight: bold;
    padding: 0.5em 0 0.4em 0.5em;
}
.top-important-news h4 i:before{
  content: "\f06a";
}

/***************
お知らせ欄
***************/
.top-info__content{
  background-color:#fff;
}
.top-info__panel{
  border-bottom: 1px dashed #ccc;
    padding: 2em 15px 15px 15px;
}

.top-info__panel {
    display: none;
}

.top-info__panel.is-active {
    display: block;
}


.top-info__tabs{
    display: flex;
    justify-content: space-between;
}
/*タブの色*/
#tab-all {background: rgb(234 188 70 / 80%);}
#tab-all.is-active {background: rgb(234 188 70);}
#tab-kids {background: rgb(155 204 138 / 80%);}
#tab-kids.is-active {background: rgb(155 204 138);}
#tab-notices {background: rgb(255 187 171 / 80%);}
#tab-notices.is-active {background: rgb(255 187 171);}
.top-info__tabs a{
    display: inline-block;
    margin-right: 3px;
    padding: 10px 15px;
    min-height: 40px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    color: #333;
    font-size: 16px;
    font-weight: bold;
    line-height: 20px;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: all .2s;
    transition: all .2s;
    flex: 1;
    text-align: center;
}
.news-list__list{
  margin: 1.5em 0 1.2em;
  padding-left: 0.5em;
}
.news-list__item{
  margin-bottom: 0.8em;
  border-bottom: 1px dashed #ccc;
  padding-bottom: 0.5em;
}
.news-list__item:last-child{
  border-bottom: none;
}
.news-list__title a{
  font-weight: bold ;
color: #07519a;
text-decoration: none;
}
.news-list__title a:focus,.news-list__title a:hover{
color: #0056b3;
text-decoration: underline;
}
.top-info__panel>.news-list__list{
  margin: 0 0 1.2em;
}
#panel-all{
  border-top: 5px solid #eabc46;
    border-bottom: 5px solid #eabc46;
}
#panel-news{
  border-top: 5px solid #9bcc8a;
    border-bottom: 5px solid #9bcc8a;
}
#panel-blog{
border-top: 5px solid #ffbbab;
    border-bottom: 5px solid #ffbbab;
}
.past-news{
  text-align: right;
  font-weight: bold;
  background: var(--theme-color);
}
.past-news a i:before {
    content: "\f022";
}
/***********
min-width
***************/

@media (min-width: 992px) {
    .mainSection{
        width: 66.66667%;
        float: right;
    }
}


/***********
max-width
***************/
@media (max-width: 768px) {
    .container-3{
      display: block ;
    }
    .date_for_events {
      float: none;
      text-align: right;
  }
  
  
  }
@media (max-width: 781px) {
    .block-column {
        flex-basis: 100% ;
    }
}



.siteHeader {
  transition: transform 0.7s ease;
}

.siteHeader.is-fixed {
  position: fixed;
  top: 0;
  left: 50%;
  width: 100%;
  transform: translateX(-50%) translateY(-100%);
  z-index: 9999;
}

.siteHeader.is-fixed.is-slide-in {
  transform: translateX(-50%) translateY(-50%);
  transition: transform 0.7s ease;
}

@keyframes headerSlideIn {
  from {
    transform: translateX(-50%) translateY(-100%);
  }
  to {
    transform: translateX(-50%) translateY(-50%);
  }
}

















/********************************
スライダー
*******************************/
.box_slide{
  border-bottom: 1px solid rgba(0, 0, 0, .05);
    display: block;
    overflow: hidden;
    width: 100%;
}

/*header追従*/
.gMenu_outer_placeholder {
  height: 0;
}

@media (min-width: 992px) {
  .header_scrolled .gMenu_outer {
    clear: both;
    z-index: 1000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: unset;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
    animation: gmenuSlideDown 1s ease forwards;
  }

  @keyframes gmenuSlideDown {
    from {
      transform: translateY(-40px);
    }
    to {
      transform: translateY(0);
    }
  }
}
body.top .news-list__category.news-list__lib{
  display: none;
}
/*****************
アルバムページ用
***************/
.Big-image{
  margin: 2rem 0;
}
.Big-image img {
    display: block;
    width: auto;
    max-width: 750px;
    margin: 0 auto;
    object-fit: cover;
    box-sizing: border-box;
    background: #fff;
}
.photo-caption{
  text-align: center;
}

body.nonside .txtbox{
  float: none;
  width: 100%;
}




/*****************
アルバム一覧用
***************/

.photo-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 34px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.txtbox ul > li.photo-list__item {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 0 0 15px;
  background: #fff;
}

.txtbox ul > li.photo-list__item::before {
  display: none;
}

/* ---------- 画像 ---------- */

.photo-list__image {
  flex-shrink: 0;
  margin: 0 0 10px;
}

.photo-list__image-link {
  display: block;
  overflow: hidden;
  height: 150px;
}

.photo-list__image-link img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---------- タイトル・説明文エリア ---------- */

.photo-list__body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 0 10px;
  justify-content: space-between;
}

.txtbox p.photo-list__title {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3em;
  margin: 0;
  font-size: 1.25rem;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
}
.txtbox p.photo-list__title a.photo-list__title-link{
  align-self: flex-start;
}
.txtbox p.photo-list__text {
  margin: 0;
  line-height: 1.8;
  text-align: center;
}
/* ---------- 詳細リンク ---------- */

.photo-list__detail-link {
  display: block;
  flex-shrink: 0;
  margin-top: auto;
  padding: 3px 2px 2px;
  border: 1px solid #cfcfcf;
  color: #333;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.3s;
  width: 207px;
  margin: 5px auto 0;
}

.photo-list__detail-link:hover,
.photo-list__detail-link:focus {
  background: #f5f5f5;
}
@media (min-width: 1200px) {
    .photo-list__detail-link{
      width: 100%;
    }
}
/* ---------- Tablet ---------- */

@media screen and (max-width: 1024px) {

  .photo-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
.photo-list__item{
  width: 328px;
        margin: 0 auto;
}
}

/* ---------- SP ---------- */

@media screen and (max-width: 767px) {

  .photo-list {
    grid-template-columns: 1fr;
    gap: 32px;
    max-width: 440px;
        margin: 0 auto;
  }
.photo-list__item{
  max-width: 100%;
}

  .photo-list__title {
    min-height: auto;
  }

}

.photo-list__title-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.txtbox a.photo-list__detail-link:hover,.txtbox a.photo-list__detail-link:focus,
.txtbox a.photo-list__title-link:hover,
.txtbox a.photo-list__title-link:focus {
  text-decoration: underline;
  color: #333;
}




/*****************
ページ一覧用
***************/
body.List .txtbox ul>li.news-list__item{
  padding-left: 0;
  margin-bottom: 1em;
}
body.List .txtbox ul>li.news-list__item::before{
  display: none;
}
body.List .news-list__head{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
body.List .news-list__date-wrap{
  width: 40%;
    margin-bottom: 0.5em;

}

body.List .txtbox p.news-list__title{
  padding: 0;
  font-size: var(--font-size-18);
  margin: 0;
}
body.List .news-list__title a,body.List .txtbox a.news-list__summary-link{
    color: #464646;
}

body.List .news-list__title a:hover,body.List .news-list__title a:focus{
      color: #af8700;
  text-decoration: none;
}
body.List .txtbox a.news-list__summary-link:hover,body.List .txtbox a.news-list__summary-link:focus{
        color: #464646;
}

body.List .txtbox p.news-list__summary{
  padding: 0;
  line-height: 1.2;
}
body.List .news-list__item {
    border-bottom: 1px solid #ccc;
}
body.List .txtbox a.news-list__summary-link{
  font-size: 0.8em;
  font-weight: normal !important;
}

@media screen and (max-width: 1200px) and (min-width: 993px) {

p.locus {
    padding-left: 10px;
}
}




p.mark_link{font-weight:bold;}

h2[class^="doc-"]::before {
	content: '';
	background-size: contain;
	display: inline-block;
	height: 40px;
	margin-right: 0.4em;
	width: 40px;
	vertical-align: middle;
}
h2.doc-1::before {
	background-image: url(/core/img/komae_city_lib_cat-image_04c.png);
}
h2.doc-2::before {
	background-image: url(/core/img/komae_city_lib_cat-image_03_42px.png);
}
h2.doc-3::before {
	background-image: url(/core/img/komae_city_lib_cat-image_06_42px.png);
}
h2.doc-4::before {
	background-image: url(/core/img/komae_city_lib_cat-image_05_42px.png);
}
h2.doc-5::before {
	background-image: url(/core/img/komae_city_lib_cat-image_02_42px.png);
}
h2.doc-6::before {
	background-image: url(/core/img/komae_city_lib_cat-image_08_42px.png);
}
h2.doc-7::before {
	background-image: url(/core/img/komae_city_lib_cat-image_07_42px.png);
}
h2.doc-8::before {
	background-image: url(/core/img/komae_city_lib_cat-image_08_a.png);
}
h2.doc-9::before {
	background-image: url(/core/img/komae_city_lib_cat-image_09.png);
}


.textbox-wrap details{
  border-bottom: 1px dashed #7b5e3c;
}
.textbox-wrap details summary::marker{
  content: "";
  display: none;
}
.textbox-wrap details summary>p{
  font-weight: bold;
  margin: .6em 0;
  padding-left: 1.5em;
}


.textbox-wrap details summary {
    cursor: pointer;
    list-style: none;
    position: relative;
}


.textbox-wrap details summary::before {
    position: absolute;
    left: 0px;
    top: 5px;
    display: block;
    width: 20px;
    height: 20px;
    line-height: 21px;
    text-align: center;
    font-size: 14px;
  background-image: url(/core/img/dr_arow1.png);
  background-size: contain;
   content: "";
}

.textbox-wrap details[open] summary::before {
    position: absolute;
    left: 0px;
    top: 5px;
    display: block;
    width: 20px;
    height: 20px;
    line-height: 21px;
    text-align: center;
    font-size: 14px;
  background-image: url(/core/img/dr_arow2.png);
  background-size: contain;
   content: "";
}

.news-list__date{
  font-size: 0.8em;
}
body.top .news-list__date{
  font-size: 1em;
}
.news-list__date::before{
      margin-right: 5px;
    font-family: "Font Awesome 5 Free";
    content: "\f073";
    font-weight: 900;
}
body.top .news-list__date::before{
  display: none;
}
body.top .news-list__title{
  margin-block-end: 0;
  margin-block-start: .5em;
}
.menu-nav__list{
  display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-20);
}
.txtbox ul.menu-nav__list > li:before{
  display: none;
}
.menu-nav__link {
    display: grid;
    align-items: center;
    position: relative;
    block-size: 100%;
    padding-block: var(--space-16);
    padding-inline: var(--space-20) var(--space-48);
    border: 2px var(--sub-color-07) solid;
    border-radius: var(--rounded-8);
    background: #fbfbfb;
    color: currentColor;
    font-size: var(--font-size-20);
    outline: 2px transparent solid;
    outline-offset: -4px;
    text-decoration: none;
    font-weight: bold;
}
.txtbox a.menu-nav__link:hover{
  color: currentColor;
}
.txtbox a.menu-nav__link::before{
      position: absolute;
    right: 5px;
    top: 35%;
    display: block;
    width: 20px;
    height: 20px;
    line-height: 21px;
    text-align: center;
    font-size: 14px;
  background-image: url(/core/img/dr_arow1.png);
  background-size: contain;
   content: "";
}
.txtbox a.menu-nav__link:hover::before{
    right: 2px;

}

/*アルバム昭和の狛江メインページ*/

body.album .slick-dots{
  display: none !important;
}
body.album .buttons{
  display: none;
}
body.album .box_slide{
  margin-bottom: 3em;
}
.wrap-album{
  display: flex;
  gap: 2em;
  flex-wrap: wrap;
  justify-content: space-around;
}
.wrap-album a{
display: inline-block;
margin-bottom: 1em;
}

.albumsearch .search_inner{
  display: flex;
  height: 45px;
}
.albumsearch .search_txt{
  width: 55%;
  border-radius: 5px;
}
.albumsearch .search_bt{
  margin: 0 0 0 1em;
  border-radius: 5px;
  background-color: #af8700;
  color: #fff;
  width: 80px;
}
.albumsearch .search_bt:hover,.albumsearch .search_bt:focus{
  background-color:#7b5e3c ;
}





body.kidstop .txtbox ul>li::before{content: none;}
body.kidstop .txtbox .news-list__title{
  margin-top: .3em;margin-bottom: 0;padding-left: 0;
}
body.kidstop .news-list__date::before{content: none;}

.detailed_search a,
.user-menu a,
a.detailed_search,
a.user-menu
{color: #ffffff;}

.search-menu a{color: var(--sub-color-05);}

.side-b.opac a{    display: flex;background: #fff;width: 210px;justify-content: center;color: #333;text-decoration: none;}
.side-b.opac a img{width: 90px;}
.side-b.opac a span{display: flex;align-items: center;}

/* 施設マップ */
.map_komae { position: relative; width: 100%; max-width: 840px; height: auto;}
.map_komae a {
	position: absolute; display: block; border-radius: 50%; width: calc(10% * 1.3); height: calc(10% * 1.3); z-index: 2; overflow: hidden;
}
.map_komae .area_01 { top: 41%; left: 43%;}
.map_komae .area_02 { top: 46%; left: 21%;}
.map_komae .area_03 { top: 11.5%; left: 39%;}
.map_komae .area_04 { top: 14%; left: 22.5%;}
.map_komae .area_05 { top: 49.25%; left: 65.5%;}
.map_komae .area_06 { top: 72.5%; left: 48.5%;}
.map_komae .area_07 { top: 50%; left: 52.5%;}
.map_komae span.hiding { display: inline-block; text-indent: -1000em;}
.map_komae .map_komae__base { z-index: 1; max-width: 100%; height: auto;}

@media (width < 768px) {
	.image_box.map_komae__master { flex-wrap: wrap;}
	.image_box.map_komae__master .image_box_left { width: 100%!important; max-width: inherit; margin: 0 0 0.5em;}
	.image_box.map_komae__master .guidance-list {}
}

.entry-meta-dataList{margin-top: 2.5em;}
.textbox-wrap{margin-bottom: 2em;}
body.gnavmenu-open {
    overflow: hidden;
}

body.gnavmenu-open .SP-gnav {
    height: 100vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
p.locus a{text-decoration: underline;}