@charset "utf-8";* {
  font-family: 'メイリオ',Meiryo,'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','ＭＳ Ｐゴシック',sans-serif;
  margin: 0;
  padding: 0
}

[tabindex="-1"] {
  outline: 0
}

html {
  overflow-y: scroll;
  height: 100%;
  font-size: 1rem;
  color: #000;
  background-color: #fff
}

body {
  height: 100%;
  margin: 0;
  padding: 0;
  font-size: .9rem;
  line-height: 1.2rem;
  color: #000;
  background-color: #fff
}

table {
  margin: 0 auto;
  padding: 0;
  border-collapse: collapse;
  border-width: 0;
  empty-cells: show
}

td,th {
  text-align: left
}

dl,h1,h2,h3,ol,p,ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  font-size: 100%
}

p {
  font-size: 1rem
}

h1,h2,h3 {
  font-weight: 400
}

li {
  zoom: 1;
  list-style-type: none;
  list-style-position: outside
}

img {
  border: 0;
  vertical-align: text-bottom
}

em {
  font-weight: 700;
  font-style: normal
}

dt {
  font-weight: 700
}

dd,dt {
  line-height: normal
}

.clearfix {
  display: block
}

.clearfix:after {
  content: "";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden
}

a {
  color: #003366;
  text-decoration: none
}

a:link {
  color: #000;
  text-decoration: none
}

a:focus,a:hover {
  color: #ffaa00;
  text-decoration: underline
}

a:focus {
  outline: -webkit-focus-ring-color solid 1px;
  outline-offset: -1px
}

a:active {
  color: #003366;
  text-decoration: none
}

a:vlink {
  color: #ffaa00;
  text-decoration: none
}

a[name] {
  color: #000;
  text-decoration: none
}

a.button-link {
  color: #fff;
  background-color: #ff8800;
  transition: background-color .2s
}

a.button-link:focus,a.button-link:hover {
  background-color: #003366;
  text-decoration: none
}

a.premark:before {
  content: "« "
}

a.nextmark:after {
  content: " »"
}

.font10 {
  font-size: 77%
}

.font11 {
  font-size: 85%
}

.font12 {
  font-size: 93%
}

.font13 {
  font-size: 100%
}

.font14 {
  font-size: 108%
}

.font15 {
  font-size: 116%
}

.font16 {
  font-size: 123.1%
}

.font17 {
  font-size: 131%
}

.font18 {
  font-size: 138.5%
}

.font19 {
  font-size: 146.5%
}

.font20 {
  font-size: 153.9%
}

.font21 {
  font-size: 161.6%
}

.font22 {
  font-size: 167%
}

.font23 {
  font-size: 174%
}

.font24 {
  font-size: 182%
}

.font25 {
  font-size: 189%
}

.font26 {
  font-size: 197%
}

.left {
  float: left
}

.right {
  float: right
}

#container {
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: center
}

@media print and (max-width:800px) and (min-width:421px){
  #container {
    width: calc(1000% / 7);
    transform: scale(.7);
    -moz-transform: scale(.7);
    -webkit-transform: scale(.7);
    transform-origin: 0 0
  }

}

@media print{
  _::-webkit-full-page-media,_:future,:root #container {
    width: calc(1000% / 7);
    transform: scale(.7);
    -moz-transform: scale(.7);
    -webkit-transform: scale(.7);
    transform-origin: 0 0
  }

}

#container .main-box {
  clear: both;
  display: block;
  box-sizing: border-box;
  max-width: 1024px;
  padding: 0;
  margin: 0 auto
}

@media screen and (max-width:1064px),print and (max-width:595px){
  #container .main-box {
    margin: 0 10px
  }

}

@media screen and (max-width:880px),print and (max-width:516px){
  #container .main-box {
    margin: 0 0
  }

}

#container .main-box .headmark {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-height: 45px;
  line-height: 1.5rem;
  margin: 20px auto;
  padding: 13px 0 0 60px;
  font-size: 1.5rem;
  font-weight: 400;
  text-align: left;
  background: url(../images/default/h1.png) no-repeat 10px top
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container .main-box .headmark {
    min-height: 24px;
    line-height: 1.2rem;
    margin: 15px auto;
    padding: 3px 0 0 40px;
    font-size: 1.2rem;
    background: url(../images/default/h1-24.png) no-repeat 10px top
  }

}

#pageAllfeatures .main-box .headmark,#pageCalendar .main-box .headmark,#pageNoticelist .main-box .headmark,#pageVisitor .main-box .headmark {
  background: url(../images/default/h1-2.png) no-repeat 10px top
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageAllfeatures .main-box .headmark,#pageCalendar .main-box .headmark,#pageNoticelist .main-box .headmark,#pageVisitor .main-box .headmark {
    background: url(../images/default/h1-2-24.png) no-repeat 10px top
  }

}

#pageBook .main-box .headmark,#pageHoldingList .main-box .headmark,#pageVolumeList .main-box .headmark {
  font-size: 0;
  height: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  background: 0 0
}

#container .main-box .headmark .subtitle {
  font-size: .9rem;
  color: #777;
  margin-left: 15px
}

#container .main-box .headmark2 {
  display: block;
  height: 30px;
  line-height: 20px;
  margin: 20px 10px;
  font-size: 1.2rem;
  font-weight: 400;
  text-align: left
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container .main-box .headmark2 {
    height: 20px;
    margin: 10px;
    line-height: 18px;
    font-size: 1rem
  }

}

#container .main-box .headmark2:before {
  content: "";
  float: left;
  display: block;
  box-sizing: border-box;
  width: 12px;
  height: 20px;
  margin-right: 10px;
  background-color: #ff9900;
  border-top: 5px solid #003377
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container .main-box .headmark2:before {
    height: 18px
  }

}

#pageAllfeatures .main-box .headmark2 {
  border-bottom: 1px solid #ff9933
}

#container .main-box .hideheading {
  font-size: 0;
  height: 0
}

#contents .outline,#contents .pickup {
  border: 1px solid #ff9933;
  border-radius: 5px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #contents .outline,#contents .pickup {
    border-left: none;
    border-right: none;
    border-radius: 0
  }

}

#contents button {
  color: #fff;
  background-color: #ff9900;
  transition: background-color .2s;
  border: none;
  cursor: pointer
}

#contents button:focus,#contents button:hover {
  background-color: #10206a;
  text-decoration: none
}

input[type=password],input[type=text],select,textarea {
  font-size: .8rem;
  padding: 0 5px;
  box-sizing: border-box
}

@media screen and (max-width:720px),print and (max-width:420px){
  input[type=password],input[type=text],select {
    box-sizing: border-box;
    height: 32px
  }

  input[type=password],input[type=text],select,textarea {
    font-size: 1rem
  }

}

#container #header {
  clear: both;
  width: 100%;
  padding: 0;
  margin: 0 auto;
  font-size: 1rem;
  text-align: center;
  background-repeat: repeat-x;
  border-top: solid 5px #ffaa00
}

#container #header .main-box {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container #header .main-box {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
  }

}

#container #header #top-of-page {
  -webkit-flex: 1 0 auto;
  flex: 1 0 auto
}

#container #header hr {
  border-top: dotted 2px #ffaa00;
  border-bottom: none
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container #header #menu+hr {
    border-top: none
  }

}

#container #header ul.link {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
  align-items: center;
  height: 100%
}

#container #header ul.link li {
  height: 26px;
  line-height: 26px;
  font-size: .85rem;
  white-space: nowrap;
  padding: 0 10px;
  margin: 17px 0;
  box-sizing: border-box;
  max-width: 400px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container #header ul.link li {
    margin: 12px 0
  }

}

#container #header ul.link .login {
  min-width: 100px;
  border-left: 1px dotted #ffaa00
}

#container #header ul.link li a {
  display: block;
  overflow: hidden
}

#container #header ul.link li.languages {
  min-width: 100px;
  padding: 0
}

#container #header ul.link li.languages a {
  display: block
}

#container #header #library-logo,#container #header #library-title {
  -webkit-flex: 0 1 100%;
  flex: 0 1 100%;
  display: block;
  padding: 0;
  margin: 0
}

#container #header #library-title {
  height: 60px;
  line-height: 60px;
  font-size: 1.5rem;
  font-weight: 400;
  text-align: left;
  white-space: nowrap;
  overflow: hidden
}

#container #header #library-logo {
  margin: 3px 0;
  flex-basis: 420px;
  height: 54px;
  line-height: 54px;
  background: url(../images/library_logo.jpg) no-repeat left center
}

#container #header #library-logo a,#container #header #library-title a {
  display: block
}

#container #header #library-logo a {
  text-indent: -9999px
}

#container #header #menu {
  display: block;
  width: 100%;
  margin: 0;
  font-size: .9rem;
  border-top: solid 1px #ffaa00;
  background-color: #fefecc
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container #header #menu {
    margin-bottom: -1px;
    border-bottom: solid 1px #ffaa00;
    background-color: #fff0cc
  }

}

#container #header #menu ul {
  position: relative;
  max-width: 1024px;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0 auto
}

@media screen and (max-width:1064px),print and (max-width:595px){
  #container #header #menu ul {
    margin: 0 10px
  }

}

@media screen and (max-width:880px),print and (max-width:516px){
  #container #header #menu ul {
    margin: 0 0
  }

}

#container #header #menu li {
  display: block;
  width: 120px;
  height: 26px;
  line-height: 26px;
  font-size: .8rem;
  padding: 4px 2px
}

#container #header #menu .sitemap {
  -webkit-flex: 1 0 auto;
  flex: 1 0 auto;
  min-width: 120px;
  text-align: right;
  font-size: .7rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container #header #menu li {
    box-sizing: border-box;
    width: 50%;
    height: 40px;
    line-height: 39px;
    padding: 0;
    border-bottom: 1px solid #ffaa00
  }

  #container #header #menu .sitemap {
    -webkit-flex: 0 1 auto;
    flex: 0 1 auto;
    text-align: center;
    font-size: .8rem
  }

  #container #header #menu li .nextmark:after {
    content: none
  }

  #container #header #menu li:nth-child(2n+1) {
    border-right: 1px solid #ffaa00
  }

  #container #header #menu li:nth-child(n+5) {
    display: none
  }

}

#container #header #menu li a {
  display: block;
  color: #666;
  font-weight: 700;
  border-radius: 5px;
  white-space: nowrap;
  overflow: hidden;
  transition: background-color .2s
}

#container #header #menu .sitemap a {
  display: inline;
  font-weight: 400;
  color: #000
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container #header #menu .sitemap a,#container #header #menu li a {
    border-radius: 0;
    color: #666;
    background-color: #fdf5cc
  }

  #container #header #menu .sitemap a {
    display: block;
    font-weight: 700
  }

}

#container #header #menu li a em,#container #header #menu li a:focus,#container #header #menu li a:hover {
  color: #fff;
  background-color: #10206a;
  text-decoration: none
}

#container #header #menu .sitemap a:focus,#container #header #menu .sitemap a:hover {
  color: #ffaa00;
  background-color: transparent
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container #header #menu .sitemap a:focus,#container #header #menu .sitemap a:hover,#container #header #menu li a:focus,#container #header #menu li a:hover {
    color: #fff;
    background-color: #10206a
  }

}

#container #header #menu li a em {
  display: block;
  background-color: #ffaa00
}

#container #header #menu li span:not(.nextmark) {
  display: block;
  width: 100%;
  height: 100%;
  color: #fff;
  background-color: #3c7b97
}

#container #header #menu .sp-menu {
  display: none;
  float: right;
  width: 144px;
  height: 30px;
  padding-left: 6px;
  line-height: 30px;
  font-size: .8rem;
  overflow: hidden
}

#container #header #menu .sp-menu>* {
  display: block;
  width: 148px;
  height: 29px;
  -webkit-transform: skewX(20deg);
  -moz-transform: skewX(20deg);
  transform: skewX(20deg);
  border-left: 1px solid #ffaa00;
  border-bottom: 1px solid #ffaa00;
  background-color: #fdf5cc
}

#container #header #menu .sp-menu a {
  display: block;
  -webkit-transform: skewX(-20deg);
  -moz-transform: skewX(-20deg);
  transform: skewX(-20deg);
  outline: 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container #header #menu .sp-menu.sp-open-menu {
    display: block
  }

}

#container #footer {
  clear: both;
  height: 60px;
  margin-top: 20px;
  padding-top: 10px;
  font-size: .9rem;
  color: #333;
  text-align: center;
  border-top: dotted 2px #ffaa00
}

#container #footer .copyright {
  margin: 5px auto;
  text-align: center
}

#container #footer .copyright .company {
  display: inline-block;
  line-height: 30px
}

#container #footer .credit {
  line-height: .7rem;
  padding: 0 5px;
  text-align: right;
  font-size: .7rem
}

#container #contents {
  display: block;
  clear: both;
  width: 100%;
  min-height: 150px;
  height: auto!important;
  height: 150px
}

#container #contents .main-box .warning {
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center
}

#container #contents .main-box .warning:empty {
  display: none
}

#container #contents .main-box .no-hit {
  padding-top: 50px;
  padding-bottom: 10px
}

#container #contents .main-box .error-message-box {
  display: inline-block;
  min-width: 600px;
  margin: 50px auto;
  padding: 12px 0;
  border: 1px solid #ccc;
  border-radius: 7px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #container #contents .main-box .error-message-box {
    min-width: 100%;
    border-left: none;
    border-right: none;
    border-radius: 0
  }

}

#container #contents .main-box .page-move+.error-message-box {
  margin-top: 30px
}

#container #contents .main-box .error-message-box .title {
  line-height: 24px;
  margin: 10px auto 20px auto;
  padding: 5px 20px;
  font-size: 1.4rem;
  border-bottom: 2px dotted #4584a2
}

#container #contents .main-box .error-message-box .message {
  display: inline-block;
  line-height: 50px;
  padding: 0 5px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container #contents .main-box .error-message-box .message {
    text-align: left
  }

}

#container #contents .main-box .error-message-box .error-status {
  margin: 10px;
  text-align: right;
  color: #666;
  font-size: .75rem
}

#container #contents .main-box .error-message-box .error-status .label:after {
  content: '：'
}

.codemaster-code,.codemaster-name,.item-data {
  display: inline
}

.item-data+.item-data {
  margin-left: 8px
}

.codemaster .codemaster-code~.codemaster-name:before,.status-date:before,.visitor-info .div-code:before {
  margin: 0 3px;
  content: '('
}

.codemaster .codemaster-code~.codemaster-name:after,.status-date:after,.visitor-info .div-code:after {
  margin: 0 3px;
  content: ')'
}

#contents .page-move {
  clear: both;
  display: block;
  margin: 0 auto;
  text-align: center
}

#contents .detail .page-move {
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 10px 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .detail .page-move .page-back {
    margin-top: 5px
  }

}

#contents .result .page-move .current-page,#contents .result .page-move .page-link {
  display: inline-block;
  width: 22px;
  height: 22px;
  line-height: 22px;
  font-size: .8rem;
  font-weight: 400;
  border: solid 1px #ffaa00;
  transition: background-color .2s;
  vertical-align: middle
}

#contents .result .page-move .current-page {
  color: #fff;
  background-color: #ffaa00
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .result .page-move .current-page {
    min-width: 90px;
    margin: 0 5px;
    color: #000;
    background-color: transparent;
    border: none
  }

}

#contents .result .page-move .current-page .total-page {
  display: none
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .result .page-move .current-page .total-page {
    display: inline
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .result .page-move .page-link:not(.prev-next-page) {
    display: none
  }

}

#contents .result .page-move .page-link.prev-next-page:after,#contents .result .page-move .page-link.prev-next-page:before {
  font-size: 1.2rem
}

#contents .result .page-move .page-link:focus,#contents .result .page-move .page-link:hover {
  text-decoration: none;
  color: #fff;
  background-color: #ffaa00
}

#contents .result .page-move .page-back {
  margin-left: 40px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .result .page-move .page-back {
    margin-left: 15px
  }

}

#contents .result .page-move .prev-next-page {
  padding: 1px;
  border: 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .result .page-move .prev-next-page {
    display: inline-block;
    width: 90px;
    height: 30px;
    line-height: 30px;
    padding: 0 5px;
    font-size: .8rem;
    color: #fff;
    background-color: #ffaa00;
    border-radius: 2px
  }

  #contents .result .page-move .prev-next-page>* {
    width: auto;
    height: auto;
    font-size: .8rem;
    vertical-align: middle
  }

  #contents .result .page-move .prev-next-page:focus,#contents .result .page-move .prev-next-page:hover {
    background-color: #003366;
    text-decoration: none
  }

  #contents .result .page-move .prev-next-page .reader {
    float: none
  }

  #contents .result .page-move .page-link.prev-next-page:after,#contents .result .page-move .page-link.prev-next-page:before {
    font-size: .8rem
  }

}

#contents .result .page-move .page-forward .current-page {
  width: auto;
  margin: 0 10px;
  color: #000;
  border: none;
  background-color: transparent
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .result .page-move .page-forward .current-page {
    margin: 0 5px
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .result .page-download {
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-end;
    justify-content: flex-end
  }

}

#contents .result .page-download a {
  display: inline-block;
  width: 100px;
  height: 24px;
  line-height: 24px;
  margin: 10px 10px 0 0;
  font-size: .7rem;
  border-radius: 2px;
  text-align: center
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .result .page-download a {
    box-sizing: border-box;
    width: 33.3%;
    margin: 0;
    border-radius: 0;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc
  }

  #contents .result .page-download a:nth-child(3n) {
    border-right: none
  }

}

#contents #page-top {
  display: none;
  position: fixed;
  right: 10px;
  bottom: 10px
}

@media screen and (max-width:720px){
  #contents #page-top {
    bottom: 30px
  }

}

#contents #page-top a {
  display: block;
  position: relative;
  width: 50px;
  height: 50px;
  text-decoration: none;
  text-indent: -9999px;
  overflow: hidden;
  background: #ffaa00;
  transition: background-color .2s;
  opacity: .6;
  border-radius: 50%
}

#contents #page-top a:focus,#contents #page-top a:hover {
  background: #ff9900;
  opacity: 1
}

#contents #page-top a::before {
  display: block;
  content: '\00a0';
  position: absolute;
  top: calc(50% - 5px);
  left: calc(50% - 10px);
  width: 15px;
  height: 15px;
  border: 3px solid;
  border-color: #fff #fff transparent transparent;
  transform: rotate(-45deg)
}

#contents #calendar .month {
  font-size: .9rem
}

#contents #calendar .month .year-month {
  margin: 5px auto;
  text-align: center;
  font-weight: 700;
  font-size: 1rem
}

#contents #calendar .month table {
  width: 100%;
  padding: 0;
  border-collapse: separate;
  border-spacing: 1px;
  border: solid 1px #ffaa00
}

#contents #calendar .month thead {
  font-size: .8rem;
  font-weight: 700;
  background-color: #fefecc
}

#contents #calendar .month tr {
  height: 35px
}

#contents #calendar .month td,#contents #calendar .month th,#contents #calendar .month tr {
  box-sizing: border-box;
  width: 14.2%
}

#contents #calendar .month td,#contents #calendar .month th {
  text-align: center;
  color: #333;
  border: dotted 1px #ffa500
}

#contents #calendar .month tr.title td {
  width: auto;
  text-align: left;
  padding-left: 10px;
  background-color: #ddd
}

#contents #calendar .month td.today {
  color: #000;
  border: solid 1.5px #ff0000
}

#contents #calendar .black {
  color: #000;
  font-weight: 400;
  background-color: #fff
}

#contents #calendar .green {
  color: #000;
  font-weight: 400;
  background-color: #9fe6da
}

#contents #calendar .blue {
  color: #000;
  font-weight: 400;
  background-color: #7ad2eb
}

#contents #calendar .purple {
  color: #000;
  font-weight: 400;
  background-color: #c9a8e2
}

#contents #calendar .pink {
  color: #000;
  font-weight: 400;
  background-color: #f1cde4
}

#contents #calendar .red {
  color: #000;
  font-weight: 400;
  background-color: #ffaa00
}

#contents #calendar ul#guide-area {
  font-size: .8rem
}

#contents #calendar ul#guide-area li {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  text-align: left;
  line-height: 25px;
  margin: 5px auto
}

#contents #calendar ul#guide-area li .guide-color {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  width: 25px;
  height: 25px;
  margin-right: 10px;
  text-align: center;
  vertical-align: top;
  border: solid 1px #ccc
}

#contents #calendar ul#guide-area li .guide-comment {
  -webkit-flex: 1 1 auto;
  flex: 1 1 auto;
  white-space: pre-wrap
}

#contents #calendar .no_calendar {
  padding-top: 20px
}

@media print{
  #contents #calendar .month td>:first-child {
    display: inline-block;
    box-sizing: border-box;
    width: 100%;
    height: 33px;
    line-height: 33px;
    border: solid 2px #fff
  }

  #contents #calendar ul#guide-area li .guide-color {
    box-sizing: border-box;
    width: 27px;
    height: 27px
  }

  #contents #calendar .month .green>:first-child,#contents #calendar ul#guide-area .green.guide-color {
    border: solid 2px #9fe6da
  }

  #contents #calendar .month .blue>:first-child,#contents #calendar ul#guide-area .blue.guide-color {
    border: solid 2px #7ad2eb
  }

  #contents #calendar .month .purple>:first-child,#contents #calendar ul#guide-area .purple.guide-color {
    border: solid 2px #c9a8e2
  }

  #contents #calendar .month .pink>:first-child,#contents #calendar ul#guide-area .pink.guide-color {
    border: solid 2px #f1cde4
  }

  #contents #calendar .month .red>:first-child,#contents #calendar ul#guide-area .red.guide-color {
    border: solid 2px #f06
  }

}

#container .headline {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

#container .headline>* {
  margin: 5px;
  line-height: 19px;
  font-size: .9rem;
  text-align: left
}

#container .headline .date {
  width: 120px;
  margin-right: 5px
}

#container.english .headline .date {
  width: 100px
}

#container .no-date .headline .date {
  display: none
}

#contents .headline .label {
  display: inline-block;
  box-sizing: border-box;
  width: 40px;
  height: 19px;
  line-height: 19px;
  margin-right: 5px;
  border-radius: 3px;
  vertical-align: middle;
  text-align: center;
  font-size: .8rem;
  color: #fff
}

#contents .headline .label>em {
  font-weight: 400
}

#contents .headline .label.new {
  background-color: #66ff00
}

#contents .headline .label.important {
  background-color: #ff0000
}

#container .headline .caption {
  -webkit-flex-basis: 100%;
  flex-basis: 100%
}

#container .headline-list .row {
  padding-top: 10px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container .headline-list .row {
    padding-bottom: 5px;
    border-bottom: 1px solid #ffaa00
  }

}

#container .headline-list .headline .caption {
  -webkit-flex: 1;
  flex: 1;
  white-space: pre-wrap;
  margin: 0;
  padding: 5px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #container .headline-list .headline .caption {
    -webkit-flex-basis: 100%;
    flex-basis: 100%
  }

}

#contents .search-box {
  display: block;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 20px;
  text-align: left;
  background-color: #fefecc;
  border-radius: 5px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #contents .search-box {
    border-radius: 0
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box {
    padding: 20px 0
  }

}

#contents .search-box .brackets:before {
  content: '('
}

#contents .search-box .brackets:after {
  content: ')'
}

#contents .search-box hr {
  margin: 15px auto;
  height: 1px;
  border-width: 0;
  background-color: #003366
}

#contents .search-box form {
  line-height: 40px;
  text-align: left
}

#contents .search-box.keyword-box select#mtld {
  box-sizing: border-box;
  height: 32px;
  width: 120px;
  padding: 2px
}

#contents .search-box.keyword-box #mtld+.keyword-submit {
  width: calc(100% - 130px)
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box.keyword-box select#mtld {
    width: auto
  }

  #contents .search-box.keyword-box #mtld+.keyword-submit {
    width: 100%
  }

}

#contents .search-box.keyword-box input#keyword {
  box-sizing: border-box;
  height: 32px;
  padding: 2px 6px;
  width: calc(100% - 110px)
}

#contents .search-box.keyword-box .keyword-submit {
  display: inline-block;
  width: 100%
}

#contents .search-box.advanced-search-box {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

#contents .search-box.advanced-search-box .condition-box,#contents .search-box.exterior .condition-box {
  box-sizing: border-box;
  width: calc(100% - 150px);
  padding-right: 50px
}

#contents .search-box.advanced-search-box.no-material-list .condition-box {
  width: 100%;
  padding-right: 0
}

@media screen and (max-width:880px),print and (max-width:516px){
  #contents .search-box.advanced-search-box .condition-box,#contents .search-box.exterior .condition-box {
    width: 100%;
    padding: 0 10px
  }

}

#contents .search-box.advanced-search-box .format-box {
  display: block;
  width: 150px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #contents .search-box.advanced-search-box .format-box {
    width: 100%;
    padding: 0 10px
  }

}

#contents .search-box.advanced-search-box .search-unit {
  margin: 5px 10px
}

#contents .search-box.advanced-search-box .search-unit.blank-after {
  margin-bottom: 20px
}

#contents .search-box.advanced-search-box search-unit.blank-before {
  margin-top: 20px
}

#contents .search-box .label,#contents .search-box label {
  display: inline-block;
  width: 120px;
  line-height: 24px;
  margin: 0;
  font-size: .8rem;
  font-weight: 700;
  vertical-align: top
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .label,#contents .search-box label {
    box-sizing: border-box;
    width: 100%;
    padding-left: 5px
  }

}

#contents .search-box input[type=checkbox]+label {
  width: auto;
  font-weight: 400
}

#contents .search-box input.search-item-from-to {
  max-width: 200px
}

#contents .search-box fieldset {
  border: 0
}

#contents .search-box span.text {
  margin-left: 5px;
  margin-right: 20px
}

#contents .search-box .buttons {
  width: 100%;
  text-align: center;
  position: relative
}

@media screen and (max-width:880px),print and (max-width:516px){
  #contents .search-box .buttons {
    margin: 15px 10px 0 10px;
    padding-top: 15px;
    border-top: 1px solid #003366
  }

  #contents .search-box.advanced-search-box.no-material-list .buttons {
    padding-top: 0;
    border-top: none
  }

}

#contents .search-box #submit {
  width: 80px;
  height: 32px;
  line-height: 32px;
  border: 0;
  vertical-align: middle;
  font-size: 1.1rem;
  text-align: center;
  border-radius: 16px
}

#contents .search-box.advanced-search-box #submit {
  width: 100px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box #submit {
    border-radius: 0
  }

  #contents .search-box.advanced-search-box #submit {
    width: 60%;
    height: 40px;
    line-height: 40px;
    border-radius: 2px
  }

}

#contents .search-box .input-warning {
  padding: 5px 0 5px 130px;
  font-size: .9rem;
  color: #e50000;
  text-align: left
}

#contents .search-box .input-warning:empty {
  display: none
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .input-warning {
    padding-left: 5px
  }

}

#contents .search-box .material-list .input-warning {
  padding-left: 0
}

#contents .search-box #reset {
  position: absolute;
  bottom: 0;
  right: 20px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box #reset {
    position: static;
    margin-top: 30px;
    text-align: right
  }

}

#contents .search-box #reset a {
  font-size: .8rem;
  text-decoration: underline
}

#contents .search-box .search-unit .code-ref,#contents .search-box .search-unit a,#contents .search-box .search-unit input,#contents .search-box .search-unit select {
  margin: 0 5px;
  vertical-align: middle
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .search-unit .code-ref,#contents .search-box .search-unit a,#contents .search-box .search-unit input,#contents .search-box .search-unit select {
    margin: 5px
  }

}

#contents .search-box .search-unit .checklist-block {
  display: inline-block;
  box-sizing: border-box;
  min-width: 450px;
  max-width: calc(100% - 130px);
  margin-left: 5px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .search-unit .checklist-block {
    min-width: 100%;
    max-width: 100%;
    padding-right: 15px
  }

}

#contents .search-box .search-unit .checklist-block .checklist {
  overflow: auto;
  border: 1px solid #a9a9a9
}

#contents .search-box .search-unit .checklist-block .checklist li {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: center;
  align-items: center;
  min-height: 30px;
  line-height: 30px;
  background-color: #fff;
  border-bottom: 1px dotted #a9a9a9

#contents .search-box .search-unit .checklist-block .checklist li input[type=checkbox] {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto
}

#contents .search-box .search-unit .checklist-block .all-check {
  display: inline-block;
  font-size: .8rem;
  line-height: 26px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .search-unit .checklist-block .all-check {
    margin: 5px
  }

}

#contents .search-box .search-unit .checklist-block .all-check .cancel {
  display: none
}

#contents .search-box .search-unit .checklist-block .counter {
  display: inline-block;
  margin-left: 10px;
  font-size: .8rem;
  color: #696969
}

#contents .search-box .search-unit .checklist-block .counter-label:after {
  content: '：'
}

#contents .search-box .search-unit .checklist-block .checklist.small-list {
  max-height: 105px
}

#contents .search-box .search-unit.keyword-unit {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

#contents .search-box .search-unit.keyword-unit input[type=text] {
  -webkit-flex: 1 0 0px;
  flex: 1 0 0px;
  min-width: 200px;
  margin-left: 10px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .search-unit.keyword-unit input[type=text] {
    margin-left: 5px
  }

}

#contents .search-box select.code-ref {
  max-width: 200px
}

#contents .search-box .search-unit .select-list {
  display: inline-block;
  width: calc(100% - 125px);
  list-style-type: none
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .search-unit .select-list {
    width: 100%
  }

}

#contents .search-box .search-unit .select-list ul {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

#contents .search-box .search-unit .select-list li {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-items: center;
  align-items: center;
  margin: 0 10px 5px 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .search-unit .select-list li {
    width: 100%
  }

}

#contents .search-box .search-unit .select-list li>input[type=checkbox] {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto
}

#contents .search-box .search-unit .select-list li>label {
  white-space: pre-wrap;
  vertical-align: middle
}

#contents .search-box .search-unit .select-list li:nth-last-child(2) {
  margin-right: 15px
}

#contents .search-box .search-unit .select-all button {
  width: 100px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  border: 0;
  border-radius: 2px;
  font-size: .8rem
}

#contents .search-box .search-unit .select-all button {
  width: auto;
  height: 20px;
  line-height: 20px;
  padding: 0 5px;
  font-size: .75rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .search-unit .select-all button {
    height: auto;
    line-height: 24px;
    margin-top: 10px;
    padding: 0 20px;
    font-size: .8rem
  }

}

@media screen and (min-width:881px),print and (min-width:517px){
  #contents .search-box .format-box .select-all .all {
    display: none
  }

  #contents .search-box .format-box .select-list {
    display: block;
    width: 100%
  }

  #contents .search-box .format-box .select-list li {
    width: 100%;
    margin: 1px 0
  }

  #contents .search-box .format-box .select-list input[type=checkbox]+label {
    margin: 1px 0
  }

  #contents .search-box .format-box .select-list .select-all>* {
    width: 100px;
    margin-top: 10px
  }

}

#contents .search-box .link {
  margin: 10px 20px 0 10px;
  text-align: right;
  font-size: .9rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .link {
    margin-top: 20px
  }

}

#contents .search-box .outer-links {
  box-sizing: border-box;
  width: 100%;
  margin-top: 15px;
  padding: 0 5px;
  border-top: 1px solid #ccc
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .outer-links {
    padding: 0 25px
  }

}

#contents .search-box .outer-links a {
  display: inline-block;
  box-sizing: border-box;
  min-width: 140px;
  height: 25px;
  line-height: 25px;
  margin: 15px 5px 0 5px;
  padding: 0 20px;
  font-size: .7rem;
  text-align: center;
  border-radius: 2px;
  background-image: url(../images/default/exlink-hv.png);
  background-repeat: no-repeat;
  background-position: right 5px center;
  transition: background-color .2s
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .search-box .outer-links a {
    width: calc(50% - 15px);
    height: 30px;
    line-height: 30px
  }

}

@media (max-width:420px){
  #contents .search-box .outer-links a {
    width: 100%
  }

}

#contents .search-box.exterior .search-unit {
  display: flex;
  margin: 2px 5px
}

#contents .search-box.exterior .input-warning {
  padding: 2px 0 2px 125px
}

#contents .search-box.exterior .condition-name {
  width: 110px;
  word-wrap: break-word
}

#contents .search-box.exterior .condition-name:after {
  content: ':'
}

#contents .search-box.exterior .condition-value {
  -webkit-flex: 1;
  flex: 1;
  padding-left: 10px;
  word-wrap: break-word
}

.styleList #contents .result .tab {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  height: 36px;
  margin: 25px auto 0 0;
  padding: 0;
  border-bottom: solid 3px #3c7b97 ;
  overflow: hidden
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .tab {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    height: auto;
    background-color: #fbfbfb;
    border-bottom: solid 1px #ccc
  }

}

.styleList #contents .result .tab li {
  box-sizing: border-box;
  width: 150px;
  margin-right: 3px;
  padding: 0;
  font-size: .8rem;
  line-height: 1rem;
  text-decoration: none;
  text-align: center
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .tab li {
    width: 33.3%;
    margin: 0;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc
  }

}

@media (max-width:420px){
  .styleList #contents .result .tab li {
    width: 50%
  }

}

.styleList #contents .result .tab li:nth-child(2) {
  margin-left: 23px
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .tab li:nth-child(2) {
    margin-left: 0
  }

}

.styleList #contents .result .tab li>* {
  display: block;
  height: 34px;
  padding-top: 2px;
  color: #fff;
  background-color: #767676;
  font-weight: 400
}

.styleList #contents .result .tab .mtl-name {
  border-radius: 8px 8px 0 0
}

.styleList #contents .result .tab .mtl-name>* {
  display: block;
  font-weight: 400
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .tab .mtl-name {
    border-radius: 0
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .tab .mtl-name .brackets {
    font-size: .7rem
  }

}

.styleList #contents .result .tab .current-mtl .mtl-name {
  background-color: #3c7b97
}

.styleList #contents .result .tab .brackets:before {
  content: '('
}

.styleList #contents .result .tab .brackets:after {
  content: ')'
}

.styleList #contents .result ul.tab li.m-next,.styleList #contents .result ul.tab li.m-prev {
  display: none;
  width: 20px
}

.styleList #contents .result ul.tab li.m-prev a {
  width: 20px;
  line-height: 30px;
  border-radius: 0 8px 0 0
}

.styleList #contents .result ul.tab li.m-next a {
  width: 20px;
  line-height: 30px;
  border-radius: 8px 0 0 0
}

.styleList #contents .result .tab-box {
  display: block;
  padding-top: 1px;
  min-height: 120px;
  text-align: left
}

.styleList #contents .result .tab-box.no-result {
  min-height: 60px
}

.styleList #contents .result .count .label:after,.styleList #contents .result .tab-box .label:after {
  content: '：'
}

.styleList #container.english #contents .result .tab-box .per-page .label:after {
  content: ''
}

.styleList #contents .result .count {
  display: block;
  text-align: left;
  line-height: 23px;
  margin-left: 10px
}

.styleList #contents .result .tab-box .tab-header-over {
  overflow: auto
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .tab-box .tab-header-over {
    margin-bottom: 10px
  }

}

.styleList #contents .result .tab-box .office,.styleList #contents .result .tab-box .right {
  display: inline-block
}

.styleList #contents .result .tab-box .office {
  margin-left: 10px
}

.styleList #contents .result .tab-box .right {
  margin-right: 10px;
  overflow: auto
}

.styleList #contents .result .tab-box .office>*,.styleList #contents .result .tab-box .right>* {
  display: inline-block;
  margin: 10px 0 5px 0
}

.styleList #contents .result .tab-box .right>* {
  margin-left: 10px
}

.styleList #contents .result .tab-box #office-items {
  max-width: 220px
}

.styleList #contents .result .display .label {
  display: inline-block;
  line-height: 23px;
  vertical-align: top
}

.styleList #contents .result .display .display-opt {
  display: inline-block;
  width: 26px;
  height: 23px;
  margin: 0 1px;
  padding: 0;
  vertical-align: top;
  font-size: 0
}

.styleList #contents .result .display .display-opt * {
  display: block;
  height: 100%
}

.styleList #contents .result .display .display-opt.list-style * {
  background: url(../images/default/list-style-list.gif) no-repeat left top
}

.styleList #contents .result .display .display-opt.thumbnail-style * {
  background: url(../images/default/list-style-thumb.gif) no-repeat left top
}

.styleList #contents .result .display .display-opt a:focus,.styleList #contents .result .display .display-opt a:hover {
  background-position: left -23px
}

.styleList #contents .result .display .display-opt.on em {
  background-position: left -23px
}

.styleList #contents .result .sort #sort-items {
  max-width: 130px
}

.styleList #contents .result .tab-box .tab-header-under {
  position: relative;
  min-height: 24px;
  margin: 20px 0 10px 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .tab-box .tab-header-under {
    margin-top: 10px
  }

}

.styleList #contents .result .page-download {
  position: absolute;
  bottom: 0;
  right: 0;
  min-height: 24px
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .page-download {
    position: static;
    margin-top: 20px;
    text-align: right
  }

}

.styleList #contents .result .tab-box .tab-footer {
  margin: 30px auto 10px auto
}

#contents .list-box .list-contents {
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap
}

#contents .thumbnail .list-box {
  margin: 0 auto
}

#contents .thumbnail .list-box .list-contents {
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

#contents .thumbnail .list-box .list-contents .book {
  box-sizing: border-box;
  width: 130px;
  height: 190px;
  line-height: 1.2rem;
  text-align: center;
  vertical-align: top;
  margin: 5px;
  padding: 9px 7px;
  overflow: hidden;
  border: 1px solid #ccc;
  border-radius: 7px
}

#contents .thumbnail .list-box .list-contents .book:focus,#contents .thumbnail .list-box .list-contents .book:hover {
  cursor: pointer;
  background-color: #fbfbfb;
  border: 1px solid #c34b00
}

#contents .thumbnail .list-box .list-contents .book br {
  display: none
}

#contents .thumbnail .list-box .list-contents .book .top {
  height: 105px
}

#contents .thumbnail.no-image .list-box .list-contents .top {
  width: 80px;
  margin: 0 auto;
  background: url(../images/default/no-image-S.gif) no-repeat
}

#contents .thumbnail .list-box .list-contents .book .second {
  height: calc(9.6rem + 10px);
  padding: 0 2px;
  overflow: hidden
}

#contents .thumbnail .list-box .list-contents .book .no {
  display: none
}

#contents .thumbnail.no-image .list-box .list-contents .book .cover {
  display: none
}

#contents .thumbnail .list-box .list-contents .book .cover {
  width: 100%;
  height: 100px;
  line-height: 100px;
  text-align: center
}

#contents .thumbnail .list-box .list-contents .book .cover img {
  max-height: 100px;
  max-width: 80px;
  min-height: 25px;
  font-size: 0
}

#contents .thumbnail .list-box .list-contents .book .column {
  font-size: .85rem;
  word-wrap: break-word;
  overflow-wrap: break-word
}

#contents .thumbnail .list-box .list-contents .book .col1 {
  height: 3.6rem;
  margin-top: 10px;
  font-size: 1rem
}

#contents .thumbnail .list-box .list-contents .book .col1 a {
  display: block;
  max-height: 3.6rem;
  overflow: hidden
}

#contents .thumbnail.booklist .ranking {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  margin-top: 5px;
  text-align: center
}

#contents .thumbnail.booklist .ranking>* {
  -webkit-flex: 1 0 50%;
  flex: 1 0 50%;
  line-height: 1.2rem;
  margin-right: 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden
}

#contents .thumbnail.booklist .ranking .ranking-rank+.ranking-count {
  font-size: .7rem
}

#contents .thumbnail .list-box .list-contents .ranking+.basic .col1 {
  margin-top: 5px
}

#contents .result .status * {
  display: inline-block
}

#contents .result .status .hideheading,#contents .result .status .info {
  display: block
}

#contents .result .status .info>div {
  box-sizing: border-box;
  min-width: 120px;
  line-height: 30px;
  padding: 5px 10px;
  margin: 5px 10px 5px 0;
  text-align: center;
  font-size: .8rem;
  border: 1px solid #ccc;
  border-radius: 3px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .result .status .info>div {
    border: none;
    border-bottom: 1px solid #ccc;
    width: 100%;
    text-align: left;
    border-radius: 0
  }

}

#contents .result .status .restricted {
  color: #e50000;
  font-weight: 700;
  border-color: #e50000
}

#contents .result .status .action-block .act {
  min-width: 60px;
  line-height: 20px;
  padding: 0 5px;
  border-radius: 2px;
  text-align: center
}

#contents .result .status .act-label+.action-block .act,#contents .result .status .action-block .status-link+.act,#contents .result .status .visitor-info+.action-block .act {
  margin-left: 10px
}

#contents .result .status .action-block .act.loading {
  width: 62px;
  background: url(../images/default/status-loading.gif) no-repeat left center;
  text-indent: -9999px
}

#contents .result .status .error {
  margin-left: 10px
}

#contents .result .status .error em {
  color: #e50000
}
 
#contents .result .status .binding em {
  color: #1515dd
}

#contents .result .status .visitor-info {
  font-size: 0;
  height: 30px
}

#contents .result .status .visitor-info>* {
  margin-left: 5px;
  font-size: .7rem
}

#contents .result .status .act-label+.action-block .status-link:before,#contents .result .status .act-label+.visitor-info:before {
  content: '：';
  font-size: .8rem
}

#contents .result .status .error .label:after {
  content: '：';
  font-size: .8rem;
  font-weight: 400;
  color: #000
}

#contents .result .status .visitor-info+.action-block .status-link:before {
  content: "/";
  margin-right: 3px
}

#contents .result .status .reserved {
  position: relative
}

#contents .result .detail .outline {
  display: block;
  padding: 5px;
  text-align: left
}

@media screen and (max-width:880px),print and (max-width:516px){
  #contents .result .detail .outline {
    padding: 5px 0
  }

}

#contents .result .switch-show {
  text-align: left;
  padding-left: 16px;
  margin: 20px auto 0 0
}

#contents .result .switch-show.closed {
  background: url(../images/default/tri-closed.gif) no-repeat
}

#contents .result .switch-show.opened {
  background: url(../images/default/tri-opened.gif) no-repeat
}

#pageHome #contents .link {
  margin: 10px 20px 0 10px;
  text-align: right;
  font-size: .9rem
}

#pageHome #contents .main-box {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents .main-box {
    -webkit-flex-direction: column;
    flex-direction: column
  }

}

#pageHome #contents #main-box-single {
  width: 100%;
  margin: 0 auto
}

#pageHome #contents #main-box-left {
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-flex: 1 1 0px;
  flex: 1 1 0px;
  min-width: 0
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents #main-box-left {
    width: 100%;
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto
  }

}

#pageHome #contents #main-box-right {
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  width: 240px;
  margin-left: 20px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents #main-box-right {
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    width: 100%;
    margin-left: 0
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageHome #contents .link {
    margin-top: 20px
  }

}

#pageHome #contents .pickup {
  clear: both;
  display: block;
  box-sizing: border-box;
  margin: 20px 0 0 0;
  padding: 12px 20px;
  background-color: transparent;
  overflow: hidden
}

@media print{
  #pageHome #contents .pickup {
    overflow: visible;
    page-break-inside: avoid
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageHome #contents .pickup {
    border: 0
  }

}

#pageHome #contents #main-box-single .pickup {
  padding: 12px 50px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents #main-box-single .pickup {
    padding: 12px 20px
  }

}

#pageHome #contents .pickup .pickup-title {
  line-height: 33px;
  text-indent: 10px;
  text-align: left;
  font-weight: 400;
  font-size: 1.4rem;
  border-bottom: 2px dotted #ff0000
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageHome #contents .pickup .pickup-title {
    font-size: 1rem
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageHome #contents .keyword-box {
    margin-top: 0
  }

}

#contents .keyword-box form {
  margin: 10px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .keyword-box form {
    padding: 0 20px
  }

  #pageHome #contents .keyword-box form {
    padding: 0
  }

}

#pageHome #contents .pickup .thumbnail {
  margin-top: 20px
}

#pageHome #contents .pickup .thumbnail .book {
  width: calc(16.6% - 10px)
}

@media screen and (min-width:1025px),print and (min-width:771px){
  #pageHome #contents #main-box-left .pickup .thumbnail .book {
    width: calc(20% - 10px)
  }

}

@media screen and (max-width:1024px) and (min-width:881px),print and (max-width:770px) and (min-width:517px){
  #pageHome #contents #main-box-left .pickup .thumbnail .book {
    width: calc(25% - 10px)
  }

  #pageHome #contents #main-box-single .pickup .thumbnail .book {
    width: calc(20% - 10px)
  }

}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents .pickup .thumbnail .book {
    width: calc(20% - 10px)
  }

}

@media screen and (max-width:750px),print and (max-width:440px){
  #pageHome #contents .pickup .thumbnail .book {
    width: calc(25% - 10px)
  }

}

@media screen and (max-width:580px),print and (max-width:340px){
  #pageHome #contents .pickup .thumbnail .book {
    width: calc(33.3% - 10px)
  }

}

@media screen and (max-width:440px),print and (max-width:258px){
  #pageHome #contents .pickup .thumbnail .book {
    width: calc(50% - 10px)
  }

}

#pageHome #contents .pickup .thumbnail.booklist .book .basic .column {
  height: 2.4rem
}

#pageHome #contents .pickup .thumbnail.booklist .book .basic .column a {
  max-height: 2.4rem
}

#pageHome #contents #main-box-right #calendar {
  display: block;
  margin-top: 20px;
  padding-top: 12px;
  padding-bottom: 14px;
  max-width: 450px;
  min-width: 240px;
  font-size: .9rem
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents #main-box-right #calendar {
    width: calc(50% - 20px);
    margin-left: 10px;
    margin-right: 10px
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageHome #contents #main-box-right #calendar {
    width: calc(100% - 20px);
    margin-left: auto;
    margin-right: auto
  }

}

#pageHome #contents #main-box-right #calendar .title {
  font-weight: 400;
  font-size: .8rem
}

#pageHome #contents #main-box-right #calendar .title.hide {
  display: none
}

#pageHome #contents #main-box-right #calendar ul#guide-area {
  display: block;
  margin-top: 10px;
  margin-left: 20px;
  font-size: .8rem
}

#pageHome #contents #main-box-right #calendar ul#guide-area li {
  line-height: 14px
}

#pageHome #contents #main-box-right #calendar ul#guide-area li .guide-color {
  width: 14px;
  height: 14px
}

#pageHome #contents #main-box-right #calendar p.link {
  font-size: .8rem
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents #main-box-right #calendar p.link {
    font-size: .9rem
  }

}

#pageHome #contents #main-box-right #calendar .month .year-month {
  font-size: .9rem;
  line-height: 1.2rem
}

#pageHome #contents #main-box-right #calendar .month .year-month .current {
  margin: auto 2rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageHome #contents #main-box-right #calendar .year-month .next,#pageHome #contents #main-box-right #calendar .year-month .prev {
    display: none
  }

}

#pageHome #contents #main-box-right #booklist {
  display: block;
  margin-top: 20px;
  padding-bottom: 14px;
  width: 100%;
  min-width: 240px;
  font-size: .9rem
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents #main-box-right #calendar+#booklist {
    width: 50%
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageHome #contents #main-box-right #calendar+#booklist {
    box-sizing: border-box;
    width: 100%;
    padding: 12px 20px 12px 20px
  }

}

#pageHome #contents #main-box-right #booklist #booklist-area {
  padding: 5px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents #main-box-right #calendar+#booklist #booklist-area {
    border: none
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageHome #contents #main-box-right #booklist #booklist-area {
    padding: 0
  }

}

#pageHome #contents #main-box-right #booklist #booklist-area ul {
  font-size: .9rem
}

#pageHome #contents #main-box-right #booklist #booklist-area ul li {
  margin-left: 12px;
  padding: 3px;
  text-align: left;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageHome #contents #main-box-right #booklist #booklist-area ul li {
    margin: 10px 3px 10px 15px;
    line-height: 30px
  }

}

#pageHome #contents #main-box-right #booklist #booklist-area .separator {
  margin-top: 5px;
  margin-left: 3px;
  padding-top: 5px;
  border-bottom: 2px dotted #4584a2;
  font-size: .8rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageHome #contents #main-box-right #booklist #booklist-area .separator {
    margin-left: 0;
    text-indent: 10px;
    font-size: 1rem
  }

}

#pageHome #contents #main-box-right #booklist #booklist-area .link {
  text-align: right
}

#pageHome #contents #message-board {
  box-sizing: border-box;
  margin-top: 20px;
  padding: 12px 20px
}

#pageHome #contents #message-board #message-board-contents {
  max-height: 190px;
  margin: 5px 0;
  overflow: hidden;
  text-align: left
}

#pageHome #contents #message-board.large #message-board-contents {
  max-height: 380px
}

#pageHome #contents #message-board.small #message-board-contents {
  max-height: 95px
}

#pageHome #contents #message-board.nolimit #message-board-contents {
  max-height: none
}

#pageHome #contents #message-board #message-board-contents pre {
  white-space: pre-wrap
}

#pageHome #contents #message-board .link {
  position: relative;
  margin: -35px 0 0 0;
  padding: 35px 20px 0 0;
  text-align: right;
  background-image: linear-gradient(180deg,rgba(255,255,255,.5),#fff)
}

#pageHome #contents #message-board .link.close {
  display: none;
  margin-top: 0;
  padding-top: 0;
  background-image: none
}

#pageHome #contents .headline-list .headline .caption {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden
}

#pageHome #contents #notice.no-notice {
  display: none
}

#pageCalendar #contents #calendar {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: center;
  justify-content: center;
  padding: 20px 20px 0 20px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageCalendar #contents #calendar {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 20px 0 0 0
  }

}

#pageCalendar #contents #calendar .page-move {
  margin: 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageCalendar #contents #calendar .page-move {
    width: 100%
  }

}

#pageCalendar #contents #calendar .page-move .page-link {
  width: 20px;
  height: 50px;
  line-height: 50px;
  margin: 130px 10px 0 10px;
  border: solid 1px #3c7b97
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageCalendar #contents #calendar .page-move .page-link {
    width: 200px;
    height: 30px;
    line-height: 30px;
    margin: 20px auto
  }

}

#pageCalendar #contents #calendar #calendar-area {
  -webkit-flex: 1 1 auto;
  flex: 1 1 auto;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: center;
  justify-content: center
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageCalendar #contents #calendar #calendar-area {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    min-width: 100%;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
  }

}

#pageCalendar #contents #calendar .month {
  -webkit-flex: 1 1 auto;
  flex: 1 1 auto;
  box-sizing: border-box;
  width: 100%;
  max-width: 450px;
  min-width: 240px;
  padding: 0 10px;
  margin: 0;
  vertical-align: top
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageCalendar #contents #calendar .month {
    width: 100%;
    margin: 10px auto
  }

}

#pageCalendar #contents #calendar .month .comment {
  margin: 10px;
  text-align: left;
  font-size: .9rem
}

#pageCalendar #contents #calendar #guide {
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  width: 220px;
  box-sizing: border-box;
  padding: 40px 0 0 20px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageCalendar #contents #calendar #guide {
    width: 100%;
    padding: 20px 10px 0 10px
  }

}

#pageCalendar #contents #calendar #guide-area {
  display: inline-block;
  max-width: 100%;
  margin: 0 auto
}

#pageCalendar #contents #calendar-select {
  text-align: left
}

#pageCalendar #contents #calendar-select ul {
  padding: 0 20px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageCalendar #contents #calendar-select ul {
    padding: 0
  }

}

#pageCalendar #contents #calendar-select li {
  display: inline-block;
  margin: 10px;
  text-align: left;
  white-space: pre-wrap
}

#pageCalendar #contents #calendar-select li .visited {
  display: inline-block;
  padding: 7px;
  color: #c34b00;
  font-weight: 400;
  border: 1px solid #c34b00
}

#pageList #contents .result .query-info {
  display: block;
  margin: 20px auto 20px 40px;
  text-align: left
}

#pageList #container #contents {
  min-height: 0
}

.styleList #contents .switch-show {
  margin: 0 5px 10px 5px
}

.styleList #contents .switch-show.opened {
  display: none
}

.styleList #contents .condition {
  display: none;
  margin-top: 5px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #contents .list .list-box {
    border-top: 2px solid #dde;
    border-bottom: 2px solid #dde
  }

}

.styleList #contents .result .list .book {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  width: 100%;
  padding: 5px 0 10px 0;
  text-align: left
}

.styleList #contents .result .list .book br {
  display: none
}

.styleList #contents .result .list .book.list-head {
  padding: 0;
  background-color: #eef
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list .book.list-head {
    display: none
  }

}

.styleList #contents .result .list .book.odd {
  background-color: #fff
}

.styleList #contents .result .list .book.even {
  background-color: #faf8de
}

.styleList #contents .result .list .book .top {
  width: 125px
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list .book .top {
    width: 115px
  }

}

.styleList #contents .result .list .book .second {
  -webkit-flex: 1;
  flex: 1;
  min-width: 0
}

.styleList #contents .result .list .book .action {
  min-height: 30px;
  line-height: 30px;
  margin: 4px 0 0 25px;
  padding: 10px 0 0 5px;
  border-top: 1px solid #ccc
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list .book .action {
    margin-left: 0;
    padding-left: 10px
  }

}

.styleList #contents .result .list.no-action .book .action {
  display: none
}

.styleList #contents .result .list .book.list-head .action {
  display: none
}

.styleList #contents .result .list .book .action.loading {
  height: 31px;
  background: url(../images/default/status-loading.gif) no-repeat left center
}

.styleList #contents .result .list .book .action.nothing {
  height: 32px;
  border-top: none
}

.styleList #contents .result .list .book .action>* {
  margin-right: 10px;
  font-size: .7rem;
  font-weight: 400
}

.styleList #contents .result .list .book .action>:last-child {
  margin-right: 0
}

.styleList #contents .result .list .book .action em {
  font-weight: 400
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list .book .action>* {
    line-height: 30px;
    font-size: .8rem
  }

  .styleList #contents .result .status .visitor-info>* {
    font-size: .8rem
  }

  .styleList #contents .result .list .book .action .act {
    line-height: 26px;
    padding: 0 15px
  }

}

.styleList #contents .result .list .book .second .basic {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  font-size: 1rem;
  line-height: 40px;
  min-height: 40px
}

.styleList #contents .result .list .book .second .values {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  font-size: .8rem;
  line-height: 20px;
  height: 20px;
  padding-left: 30px
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list .book .second .values {
    height: auto;
    line-height: 25px;
    padding-left: 10px
  }

}

.styleList #contents .result .list .book.list-head .second .basic {
  background-color: #dde
}

.styleList #contents .result .list .book .column {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
  font-size: .8rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list .book .column {
    width: 100%!important
  }

}

.styleList #contents .result .list .book .column em {
  font-weight: 400;
  color: red
}

.styleList #contents .result .list .book .no {
  display: inline-block;
  box-sizing: border-box;
  width: 15px;
  height: 40px;
  line-height: 40px;
  color: #666;
  text-align: center;
  vertical-align: top;
  font-size: .6rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list .book .no {
    width: 100%;
    height: 10px;
    line-height: 10px;
    padding-left: 5px;
    text-align: left;
    vertical-align: middle
  }

}

.styleList #contents .result .list .book .cover {
  display: inline-block;
  box-sizing: border-box;
  width: 100px;
  height: 110px;
  line-height: 110px;
  padding: 5px 0;
  text-align: center
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list .book .cover {
    width: 100%
  }

}

.styleList #contents .result .list .book .cover img {
  max-height: 100px;
  max-width: 80px;
  min-height: 25px;
  font-size: 0
}

.styleList #contents .result .list .book .cover img:hover {
  cursor: pointer
}

.styleList #contents .result .list .book.list-head .top .upper {
  width: 100%;
  height: 40px;
  background-color: #dde
}

.styleList #contents .result .list .book.list-head .top .lower {
  width: 100%;
  height: 20px
}

.styleList #contents .result .list .book .col1 {
  font-size: 1rem
}

.styleList #contents .result .list .book .col2 {
  width: 30%
}

.styleList #contents .result .list .book .col3 {
  width: 24%
}

.styleList #contents .result .list .book .col4 {
  width: 16%
}

.styleList #contents .result .list .book .col5 {
  width: 18%
}

.styleList #contents .result .list .book .col6 {
  width: 12%
}

.styleList #contents .result .list.no-image .book .top {
  width: 20px
}

.styleList #contents .result .list.no-image .book .cover {
  display: none
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list.no-image .book .no {
    height: 40px;
    line-height: 40px
  }

}

.styleList #contents .thumbnail .list-box .book {
  height: 290px
}

.styleList #contents .thumbnail .list-box .book {
  width: calc(14.2% - 10px)
}

@media (max-width:1024px){
  .styleList #contents .thumbnail .list-box .book {
    width: calc(16.6% - 10px)
  }

}

@media (max-width:860px){
  .styleList #contents .thumbnail .list-box .book {
    width: calc(20% - 10px)
  }

}

@media screen and (max-width:720px),print and (max-width:580px){
  .styleList #contents .thumbnail .list-box .book {
    width: calc(25% - 10px)
  }

}

@media screen and (max-width:580px),print and (max-width:520px){
  .styleList #contents .thumbnail .list-box .book {
    width: calc(33.3% - 10px)
  }

}

@media screen and (max-width:440px),print and (max-width:420px){
  .styleList #contents .thumbnail .list-box .book {
    width: calc(50% - 10px)
  }

}

.styleList #contents .thumbnail .list-box .book.list-head {
  display: none
}

.styleList #contents .result .list.location-list .book .col1 {
  -webkit-flex: 1 0;
  flex: 1 0
}

.styleList #contents .result .list.location-list .book .location {
  line-height: 40px;
  margin: 0 10px;
  font-size: .9rem
}

.styleList #contents .result .list.location-list .book .column.location {
  display: block
}

.styleList #contents .result .list.location-list .book .second .values+.location {
  display: none
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleList #contents .result .list.location-list .book .column.location {
    display: none
  }

  .styleList #contents .result .list.location-list .book .second .values+.location {
    display: block
  }

}

.styleList #contents .result .list.location-list .book .location>a {
  display: inline-block;
  min-width: 100px;
  line-height: 26px;
  padding: 0 10px;
  border-radius: 2px;
  text-align: center
}

.styleBook #contents .switch-show {
  margin: 0 5px 10px 5px;
  padding-bottom: 10px;
  border-bottom: dotted 1px #4583a1
}

.styleBook #contents .switch-show.opened {
  border-bottom: none
}

.styleBook #contents .result em {
  font-weight: 700
}

.styleBook #contents hr {
  margin: 40px auto 10px auto;
  border-top: 0;
  border-bottom: dotted 1px #4583a1
}

.styleBook #contents .headmark2 {
  margin-top: 50px;
  border-bottom: dotted 1px #4583a1
}

.styleBook #contents .detail .page-move.lower {
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
  margin-top: 20px
}

.styleBook #contents .detail .page-move .page-back {
  margin-left: 10px
}

.styleBook #contents .detail .page-move .page-forward {
  margin-right: 10px
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleBook #contents .detail .page-move .page-forward {
    width: 100%;
    margin-right: 0
  }

  .styleBook #contents .detail .page-move .page-back+.page-forward {
    margin-top: 15px
  }

}

.styleBook #contents .detail .page-menu {
  margin: 15px 0 10px 0
}

.styleBook #contents .detail .page-menu .page-download {
  position: static;
  text-align: right
}

.styleBook #contents .result .detail table {
  width: 100%;
  margin: 0 auto;
  text-align: left;
  border: solid 1px #ccc;
  border-collapse: separate;
  border-spacing: 2px
}

.styleBook #contents .result .detail .outline table {
  border: 0
}

.styleBook #contents .result .detail .outline table td {
  box-sizing: border-box
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleBook #contents .result .detail .outline table td {
    display: block
  }

}

.styleBook #contents .result .detail .outline .image {
  width: 220px;
  padding: 10px;
  text-align: center;
  vertical-align: top;
  border: 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleBook #contents .result .detail .outline .image {
    width: 100%
  }

}

.styleBook #contents .result .detail .outline .image.no-image {
  width: 10px;
  padding: 0
}

.styleBook #contents .result .detail .outline .image #artwork img {
  display: block;
  margin: 0 auto
}

.styleBook #contents .result .detail .outline .image #artwork #bookweb {
  margin-top: 10px
}

.styleBook #contents .result .detail .outline .outline-body {
  width: auto;
  border: 0;
  text-align: left;
  vertical-align: top;
  padding: 10px
}

.styleBook #contents .result .detail .outline .series {
  color: #666;
  font-size: .9rem;
  line-height: 1.5rem
}

.styleBook #contents .result .detail .outline .title {
  color: #000;
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.7rem;
  margin-top: 5px
}

.styleBook #contents .result .detail .outline .subTitle {
  color: #000;
  font-size: 1rem
}

.styleBook #contents .result .detail .outline .author {
  color: #000;
  font-size: .9rem;
  margin: .9rem auto
}

.styleBook #contents .result .detail .outline .publisher {
  color: #000;
  font-size: .9rem
}

.styleBook #contents .result .detail .outline .date {
  color: #000;
  font-size: .9rem
}

.styleBook #contents .result .detail .outline .isbn {
  color: #000;
  font-size: .9rem;
  margin: 1rem auto
}

.styleBook #contents .result .detail .notice-bookweb {
  font-size: .7rem;
  color: #444;
  margin-top: 40px;
  text-align: left
}

.styleBook #contents .result .detail .notice-bookweb.hide {
  display: none
}

.styleBook #contents .result .detail .outline .source {
  padding: 0 10px;
  text-align: right;
  font-size: .75rem
}

.styleBook #contents .result .detail .outline .source .copyright {
  display: none;
  margin: 10px;
  text-align: left;
  font-size: .75rem;
  color: #444
}

.styleBook #contents .result .detail .outline .location {
  font-size: .8rem;
  text-align: left;
  margin-top: 20px
}

.styleBook #contents .result .detail .outline .location>a {
  display: inline-block;
  line-height: 26px;
  padding: 0 15px;
  border-radius: 2px
}

.styleBook #contents .result .detail .outline .item-name:after {
  content: "：";
  padding-right: 5px
}

.styleBook #contents .result .detail .page-url {
  margin-top: 20px
}

.styleBook #contents .result .detail .page-url>* {
  font-size: .7rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleBook #contents .result .detail .page-url>* {
    line-height: 26px
  }

}

.styleBook #contents .result .detail .page-url label {
  display: inline-block;
  width: 80px
}

.styleBook #contents .result .detail .page-url input {
  box-sizing: border-box;
  width: calc(100% - 80px);
  padding: 0 5px;
  border: 1px solid #ccc;
  cursor: pointer
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleBook #contents .result .detail .page-url input {
    font-size: 1rem
  }

}

.styleBook #contents .result .detail .page-url input:focus {
  outline: 0
}

.styleBook #contents .result .status {
  display: block;
  margin: 10px;
  text-align: left
}

.styleBook #contents .result .status .info .restricted {
  border-color: #e50000
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleBook #contents .result .status .info .restricted {
    border-color: #ccc
  }

}

.styleBook #contents .result .status .info .on-loan em {
  color: #e50000
}

#contents .result .status .binding .act-label+a:before,.styleBook #contents .result .status .info .act-label+.visitor-info:before,.styleBook #contents .result .status .info .visitor-info>* {
  font-size: .8rem
}

.styleBook #contents .result .status .info .action-block .act {
  padding: 0 15px;
  line-height: 26px
}

.styleBook #contents .result .status .info .hideheading {
  display: block
}

.styleBook #contents .result .status #reserve-list-box {
  display: none;
  position: absolute;
  left: 0;
  margin-top: 10px;
  padding: 10px;
  border: 1px solid #ccc;
  background-color: #fff;
  border-radius: 3px
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleBook #contents .result .status #reserve-list-box {
    width: calc(100% - 20px)
  }

}

.styleBook #contents .result .status #reserve-list-box.loading {
  height: 40px;
  width: 170px;
  background: #fff url(../images/loading.gif) no-repeat center
}

.styleBook #contents .result .status #reserve-list-box #reserve-list-name {
  position: relative;
  width: 100%;
  text-align: left;
  text-indent: 10px;
  font-size: .9rem;
  background-color: #dde
}

.styleBook #contents .result .status #reserve-list-box .list {
  display: block;
  max-height: 150px;
  overflow-y: scroll
}

.styleBook #contents .result .status #reserve-list-box .list ul {
  display: block;
  overflow: hidden
}

.styleBook #contents .result .status #reserve-list-box .list .row {
  display: block;
  white-space: nowrap;
  text-align: left
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleBook #contents .result .status #reserve-list-box .list .row {
    height: auto;
    white-space: normal
  }

}

.styleBook #contents .result .status #reserve-list-box .list .row:nth-child(2n) {
  background-color: #faf8de
}

.styleBook #contents .result .status #reserve-list-box .list .column {
  display: inline-block;
  box-sizing: border-box;
  min-width: 0;
  height: 30px;
  line-height: 30px;
  width: 150px;
  margin: 0;
  padding: 0 5px;
  border: none;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis
}

@media screen and (max-width:720px),print and (max-width:420px){
  .styleBook #contents .result .status #reserve-list-box .list .column {
    display: block;
    width: 100%;
    height: 25px;
    line-height: 25px
  }

}

.styleBook #contents .result .status #reserve-list-box #reserve-list-close {
  position: absolute;
  top: 0;
  right: 0;
  padding: 0 10px
}

.styleBook #contents .result .detail .outline+section:not(.status) {
  margin-top: 20px
}

.styleBook #contents .result .detail .book,.styleBook #contents .result .detail .saimoku {
  display: block;
  width: 100%;
  margin: 20px auto;
  text-align: center
}

.styleBook #contents .result .detail .book:last-child,.styleBook #contents .result .detail .saimoku:last-child {
  margin-bottom: 0
}

.styleBook #contents .result .detail .book {
  margin-top: 0
}

.styleBook #contents .result .detail table tr {
  line-height: 1.1rem
}

.styleBook #contents .result .detail table th {
  width: 20%;
  min-width: 100px;
  padding: 5px;
  font-size: .8rem;
  font-weight: 700
}

.styleBook #contents .result .detail table td {
  width: 80%;
  padding: 5px;
  font-size: .8rem;
  border-bottom: solid 1px #ccc
}

.styleBook #contents .result .detail table tr.bottom-row td {
  border-bottom: 0
}

.styleBook #contents .result .detail .book th {
  background-color: #a0c6d7
}

.styleBook #contents .result .detail .saimoku th {
  background-color: #ccc
}

.styleBook #contents .result .detail .saimoku table caption {
  font-size: .9rem;
  text-align: left;
  color: #333;
  margin: 5px 10px
}

.styleBook #contents .result .detail .ext {
  display: none
}

.styleBook #contents .result .binding-detail {
  text-align: left;
  margin: 10px auto 5px 20px
}

.styleBook #contents .result .detail #bookdata-asp {
  margin-bottom: 20px
}

.styleBook #contents .result .detail #bookdata-asp .image img {
  max-width: 195px
}

.styleBook #contents .result .detail #bookdata-asp .item-name {
  display: block;
  font-size: 1rem;
  padding-bottom: 10px
}

.styleBook #contents .result .detail #bookdata-asp .item-name:after {
  content: ""
}

.styleBook #contents .result .detail #bookdata-asp .item-value {
  padding: 0 0 10px 18px
}

.styleBook #contents .result .detail #bookdata-asp .title .item-value {
  padding: 0 0 10px 0
}

.styleBook #contents .result .detail #bookdata-asp .table-contents .item-value li {
  padding-bottom: 5px
}

.styleBook #contents .result .detail #bookdata-asp .authors-note .author-name {
  line-height: 30px;
  font-weight: 700
}

.styleBook #contents .result .detail #bookdata-asp .message {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ccc;
  font-size: .75rem;
  font-weight: 700
}

.styleBook #contents .result .detail #bookdata-asp .error-message {
  padding: 10px;
  text-align: center
}

#pageMagazine #contents .select-mtld {
  text-align: left;
  margin: 20px auto 30px 15px
}

#pageMagazine #contents .select-mtld .label:after {
  content: "："
}

#pageMagazine #contents #index>* {
  display: inline-block;
  box-sizing: border-box;
  width: calc(50% - 12px);
  vertical-align: top
}

#pageMagazine #contents #index #index-left {
  padding: 0 10px 0 0
}

#pageMagazine #contents #index #index-right {
  padding: 0 0 0 10px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageMagazine #contents #index #index-left,#pageMagazine #contents #index #index-right {
    width: 100%;
    padding: 5px 15px
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageMagazine #contents #index #index-left,#pageMagazine #contents #index #index-right {
    padding: 5px 0
  }

}

#pageMagazine #contents #index .section {
  display: flex;
  -webkit-justify-content: space-around;
  justify-content: space-around;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageMagazine #contents #index .section {
    -webkit-justify-content: flex-start;
    justify-content: flex-start
  }

}

#pageMagazine #contents #index .section .title {
  width: 100%;
  padding: 5px 1rem;
  font-weight: 700;
  font-size: .9rem;
  text-align: left;
  color: #666;
  border-bottom: 2px solid #4584a2
}

#pageMagazine #contents #index .section .block {
  display: inline-block;
  width: 100%;
  text-align: left
}

#pageMagazine #contents #index .kana.section .block {
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-align-content: space-around;
  align-content: space-around;
  height: 200px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageMagazine #contents #index .kana.section .block {
    -webkit-align-content: stretch;
    align-content: stretch;
    max-width: 680px;
    height: 160px
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageMagazine #contents #index .kana.section .block {
    max-width: 600px;
    height: 250px
  }

}

@media screen and (max-width:580px),print and (max-width:340px){
  #pageMagazine #contents #index .kana.section .block {
    height: auto
  }

}

#pageMagazine #contents #index .section .block ul {
  display: inline;
  font-size: 0
}

#pageMagazine #contents #index .kana.section .block ul {
  display: inline-block;
  width: 200px;
  height: 40px;
  white-space: nowrap
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageMagazine #contents #index .kana.section .block ul {
    margin: 0 40px 0 0
  }

}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageMagazine #contents #index .kana.section .block ul {
    width: 250px;
    height: 50px;
    margin: 0 50px 0 0
  }

}

#pageMagazine #contents #index .section .block li {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: 5px;
  line-height: 30px;
  text-align: center;
  font-size: .9rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageMagazine #contents #index .section .block li {
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 1rem
  }

}

#pageMagazine #contents #index .section .block li.visited {
  box-sizing: border-box;
  color: #c34b00;
  border: 1px solid #c34b00
}

#pageMagazine #contents #index .section .block li.visited em {
  font-weight: 400
}

#pageMagazine #contents #index .all.section .block li {
  width: auto;
  padding: 1px 8px
}

#pageMagazine #contents #index .all.section .block li.visited {
  width: auto;
  padding: 0 7px
}

#pageVolumeList #contents .result .volumes {
  display: block;
  float: left;
  margin: 10px 30px 5px 10px;
  text-align: left
}

#pageVisitor #contents .main-box .result {
  position: relative;
  margin-bottom: 50px
}

#pageVisitor #contents .main-box .settinglink {
  position: absolute;
  top: 0;
  right: 10px;
  line-height: 45px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .main-box .settinglink {
    line-height: 24px
  }

}

#pageVisitor #contents .main-box .settings {
  line-height: 25px;
  padding: 5px 10px 5px 30px;
  font-size: 1rem;
  background-image: url(../images/default/settings-16.png);
  background-repeat: no-repeat;
  background-position: 5px center;
  border-radius: 3px
}

#pageVisitor #contents .headmark2 {
  margin-top: 40px
}

#pageVisitor #contents .page-inner-link {
  margin: 0 15px 15px 15px;
  text-align: left
}

#pageVisitor #contents .page-inner-link li {
  display: inline-block;
  margin: 0 5px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .page-inner-link li {
    margin: 10px 5px
  }

}

#pageVisitor #contents .page-inner-link li a {
  display: inline-block;
  height: 26px;
  line-height: 26px;
  background-image: url(../images/default/mvdown-16.png);
  background-repeat: no-repeat;
  background-position: 5px center;
  text-indent: 25px
}

#pageVisitor #contents .page-inner-link li a:focus,#pageVisitor #contents .page-inner-link li a:hover {
  background-image: url(../images/default/mvdown-h-16.png)
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .page-inner-link li a {
    font-size: 1rem
  }

}

#pageVisitor .lent-label:after,#pageVisitor .reserved-label:after {
  content: " : "
}

#pageVisitor #contents .page-move .page-back {
  margin-left: 10px
}

#pageVisitor #contents .outline {
  padding: 10px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageVisitor #contents .outline {
    padding: 10px 0
  }

}

#pageVisitor #contents .page-move+.outline {
  margin-top: 30px
}

#pageVisitor #contents .outline table {
  width: 90%;
  border: 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .outline table {
    width: 100%
  }

}

#pageVisitor #contents .outline table * {
  border: 0
}

#pageVisitor #contents .outline th {
  width: 200px;
  height: 1.5rem;
  text-align: center;
  font-size: .8rem;
  color: #444
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .outline th {
    width: 120px
  }

}

#pageVisitor #contents .outline td {
  width: calc(100% - 200px);
  text-align: left;
  padding-left: 1rem
}

#pageVisitor #contents .status {
  display: block;
  margin: 10px;
  text-align: left
}

#pageVisitor #contents .status .expired,#pageVisitor #contents .status .suspended {
  color: #e50000;
  font-weight: 700;
  border-color: #e50000
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .status .expired,#pageVisitor #contents .status .suspended {
    border-color: #ccc
  }

}

#pageVisitor #contents .board-list {
  padding: 0 10px
}

#pageVisitor #contents .board-list .row {
  padding-bottom: 15px;
  text-align: left
}

#pageVisitor #contents .board-list .board {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

#pageVisitor #contents .board-list .board * {
  line-height: 22px
}

#pageVisitor #contents .board-list .board .date {
  width: 120px
}

#pageVisitor .english #contents .board-list .board .date {
  width: 100px
}

#pageVisitor #contents .board-list .board .label {
  width: 20px;
  padding: 0;
  font-size: 0;
  background-repeat: no-repeat;
  background-position: left 2px
}

#pageVisitor #contents .board-list .board .label.alert {
  background-image: url(../images//default/alert-s.gif)
}

#pageVisitor #contents .board-list .board .label.warning {
  background-image: url(../images//default/warning-s.gif)
}

#pageVisitor #contents .board-list .board .label.notice {
  background-image: url(../images//default/notice-s.gif)
}

#pageVisitor #contents .board-list .board .message-block {
  -webkit-flex: 1;
  flex: 1;
  min-width: 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .board-list .board .message-block {
    -webkit-flex: 1 1 100%;
    flex: 1 1 100%;
    margin-top: 10px
  }

}

#pageVisitor #contents .board-list .board .message-block .board-message {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  height: auto
}

#pageVisitor #contents .board-list .board .message-block .board-message.compact {
  height: 22px;
  overflow: hidden
}

#pageVisitor #contents .board-list .board .message-block .board-message.compact:after {
  content: " ";
  position: absolute;
  top: 0;
  right: 0;
  width: 80px;
  height: 22px;
  background-image: linear-gradient(to right,rgba(255,255,255,.1),#fff)
}

#pageVisitor #contents .board-list .board .message-block .board-message pre {
  white-space: pre-wrap
}

#pageVisitor #contents .board-list .board .message-block .board-message.compact pre {
  word-break: break-all
}

#pageVisitor #contents .board-list .board .message-block .close,#pageVisitor #contents .board-list .board .message-block .more {
  display: none;
  font-size: .7rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .board-list .board .message-block .close,#pageVisitor #contents .board-list .board .message-block .more {
    margin-top: 10px;
    font-size: .9rem
  }

}

#pageVisitor #contents .errors {
  padding: 0 10px;
  text-align: left;
  font-size: 1rem
}

#pageVisitor #contents .errors dt {
  font-weight: 400
}

#pageVisitor #contents .errors .error-data {
  display: flex
}

#pageVisitor #contents .errors .error-data>* {
  display: inline-block;
  vertical-align: middle
}

#pageVisitor #contents .errors .error-data .error-book-link {
  min-width: 130px
}

#pageVisitor #contents .errors .error-data .error-book-title {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden
}

#pageVisitor #contents .errors .error-reason {
  display: inline-block;
  min-width: calc(100% - 260px);
  margin: 10px 0 10px 10px
}

#pageVisitor #contents .errors .error-reason em {
  color: #e50000;
  font-weight: 400
}

#pageVisitor #contents .errors .error-act {
  display: inline-block;
  width: 240px;
  margin: 10px 0;
  text-align: right
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .errors .error-act {
    text-align: left
  }

}

#pageVisitor #contents .errors .error-act .act {
  display: inline-block;
  width: 100px;
  line-height: 24px;
  padding: 0 5px 0 5px;
  text-align: center;
  font-size: .9rem;
  border-radius: 3px
}

#pageVisitor #contents .errors .error-act .act:nth-child(n+2) {
  margin-left: 5px
}

#pageVisitor #contents .result {
  display: block;
  margin-bottom: 50px
}

#pageVisitor #contents .result .list .list-head.book:empty {
  height: 10px
}

#pageVisitor #contents .result .list .book .second .values {
  height: auto
}

#pageVisitor #contents .result .list .book .column em {
  font-weight: 400;
  color: #e50000
}

#pageVisitor #contents .result .list .book .second .item-name:after {
  content: "："
}

#pageVisitor #contents .result .list .book .rgtn {
  width: 100%;
  margin-bottom: 5px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .result .list .book .rgtn {
    font-size: .9rem;
    margin-bottom: 0
  }

}

#pageVisitor #contents .result .list .book .date {
  width: 170px
}

#pageVisitor #contents .result .list .book .return {
  width: 170px
}

#pageVisitor #contents .result .list .book .notes {
  width: calc(100% - 340px);
  white-space: normal
}

#pageVisitor .english #contents .result .list .book .date {
  width: 190px
}

#pageVisitor .english #contents .result .list .book .return {
  width: 210px
}

#pageVisitor .english #contents .result .list .book .notes {
  width: calc(100% - 400px)
}

#pageVisitor #contents .result .reserved.list .book .order {
  width: 150px
}

#pageVisitor .english #contents .result .reserved.list .book .date {
  width: 190px
}

#pageVisitor .english #contents .result .reserved.list .book .order {
  width: 130px
}

#pageVisitor #contents .result .reserved.list .book .notes {
  width: calc(100% - 320px)
}

#pageVisitor #contents .result .list .book .notes .item-data {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row
}

#pageVisitor #contents .result .list .book .notes .item-data * {
  display: inline-block
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .result .list .book .notes .item-data {
    display: block
  }

}

#pageVisitor #contents .result .list .book .notes .item-data .notes-content {
  -webkit-flex: 1;
  flex: 1
}

#pageVisitor #contents .result .list .book .notes .item-data .notes-content>* {
  margin-right: 10px
}

#pageVisitor #contents .result .list .book .notes .item-data .notes-content em {
  white-space: pre-wrap
}

#pageVisitor #contents .result .list .book .notes .item-data .notes-content .act-label em {
  margin: 0;
  color: #000
}

#pageVisitor #contents .result .list .book .notes .item-data .notes-action {
  box-sizing: border-box;
  padding: 0 10px 0 5px
}

#pageVisitor #contents .result .list .book .notes .item-data .notes-action:empty {
  padding: 0
}

#pageVisitor #contents .result .list .book .notes .item-data .notes-action a {
  min-width: 60px;
  padding: 0 5px;
  border-radius: 2px;
  text-align: center
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .result .list .book .notes .item-data .notes-action a {
    line-height: 26px
  }

}

#pageVisitor #contents .result .list .book .item-data.loading {
  background: url(../images/default/status-loading.gif) no-repeat left center;
  height: 20px
}

#pageVisitor #contents .result .list .book .notes .notes-action a.loading {
  display: inline-block;
  text-indent: -9999px;
  background: url(../images/default/status-loading.gif) no-repeat left center;
  outline: 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .result .list .book .second .basic .column:nth-child(n+2) {
    line-height: 25px;
    padding-left: 10px
  }

  #pageVisitor #contents .result .list .book .second .values {
    min-height: 30px;
    line-height: 30px;
    margin: 4px 0 0 0;
    padding: 10px 0 0 10px;
    border-top: 1px solid #ccc
  }

}

#pageVisitor #contents fieldset {
  border: 0
}

#pageVisitor #contents .settings-box {
  display: block;
  padding: 10px 40px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .settings-box {
    padding: 10px
  }

}

#pageVisitor #contents .settings-box .comment {
  box-sizing: border-box;
  width: 100%;
  margin: 5px auto 10px auto;
  text-align: left
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .settings-box .comment {
    padding: 0
  }

}

#pageVisitor #contents .settings-box .settings-row .label {
  display: inline-block;
  width: 300px;
  height: 24px;
  line-height: 24px;
  font-weight: 700;
  text-align: left
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .settings-box .label {
    width: 100%!important;
    margin-bottom: 10px
  }

}

#pageVisitor #contents .settings-box .settings-list {
  max-width: 880px;
  margin: 0 auto
}

#pageVisitor #contents .settings-box .settings-list .settings-row {
  padding: 5px 0
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .settings-box .settings-list .settings-row {
    width: 100%
  }

}

#pageVisitor #contents .settings-box input[type=checkbox] {
  margin-right: 5px;
  vertical-align: middle
}

#pageVisitor #contents .settings-box input[type=text] {
  box-sizing: border-box;
  width: calc(100% - 300px);
  padding: 0 5px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .settings-box input[type=text] {
    width: 100%
  }

}

#pageVisitor #contents .settings-box .act {
  display: inline-block;
  margin: 20px 5px 0 5px;
  width: 140px;
  line-height: 35px;
  border-radius: 3px;
  font-size: .75rem;
  vertical-align: top
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .settings-box .act {
    width: 110px
  }

  #pageVisitor .english #contents .settings-box .act {
    font-size: .6rem
  }

}

#pageVisitor #contents .settings-box .act.save {
  width: 200px;
  font-size: 1rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .settings-box .act.save {
    width: 160px
  }

}

#pageVisitor #contents .settings-box .act.disabled {
  color: grey;
  background-color: #e0e0e0
}

#pageVisitor #contents .settings-box.mail-notify .settings-list {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap
}

#pageVisitor #contents .mail-notify li {
  display: inline-block;
  width: calc(50% - 10px)
}

#pageVisitor #contents .mail-notify li:nth-child(2n) {
  margin-left: 10px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .mail-notify li:nth-child(2n) {
    margin-left: 0
  }

}

#pageVisitor #contents .mail-notify .label {
  width: 180px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageVisitor #contents .mail-notify .label,#pageVisitor #contents .mail-notify select {
    width: 100%
  }

}

#pageVisitor #contents .mail-notify select {
  vertical-align: top
}

#pageVisitor #contents .settings-box .message {
  margin: 10px auto;
  padding-bottom: 5px;
  text-align: center;
  border-bottom: 1px dotted #4584a2
}

#pageVisitor #contents .all.error,#pageVisitor #contents .settings-box .error {
  color: #e50000
}

#pageVisitor #contents .settings-box input+.error {
  padding: 5px 0 0 300px;
  font-size: .75rem;
  text-align: left
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageVisitor #contents .settings-box input+.error {
    padding: 5px 0 0 0
  }

}

#pageVisitor #contents .main-box>div.message {
  background: #fff url(../images/default/h1-2.gif) no-repeat left;
  line-height: 45px;
  font-size: 1.3rem;
  margin-top: 10px;
  padding-left: 48px;
  text-align: left
}

#pageVisitor #contents .settings-box.password .settings-list .label {
  width: 200px
}

#pageVisitor #contents .settings-box.password .settings-row input {
  width: 300px
}

#pageVisitor #contents .settings-box.password .password_message {
  margin: 10px auto;
  display: inline-block
}

#pageVisitor #contents .settings-box.password .password_message p {
  font-size: .9rem;
  text-align: left
}

#pageVisitor #contents .settings-box.password>p:last-of-type {
  font-size: .9rem;
  margin-top: 20px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #contents .settings-box.password .settings-row input {
    width: 100%
  }

}

#pageVisitor #contents .comment-content {
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  margin: 15px 0;
  padding: 15px;
  overflow-wrap: break-word;
  text-align: left;
  border: 3px solid #ccc;
  border-radius: 5px
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageVisitor #contents .comment-content {
    border-left: none;
    border-right: none;
    border-radius: 0
  }

}

#pageVisitor #contents .comment-content pre {
  white-space: pre-wrap
}

#styleShelfmap .area-object,#styleShelfmap .back-img {
  display: none
}

#styleShelfmapOverlay {
  display: none;
  background-color: rgba(0,0,0,.8);
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0
}

#styleShelfmap {
  display: none;
  background-color: #fff;
  position: absolute;
  width: 150px;
  height: 200px;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  padding: 10px
}

#styleShelfmap .loading {
  background: #fff url(../images/loading.gif) no-repeat center;
  width: 100%;
  height: 100%
}

#styleShelfmap .close {
  margin-top: 15px
}

#styleShelfmap .close a {
  width: 35px;
  float: right;
  padding-bottom: .7em;
  outline: 0
}

#styleShelfmap .close a:before {
  content: url(../images/close.png)
}

#pageLogin #contents .login-box {
  padding-top: 40px
}

#pageLogin #contents .login-box .error {
  margin: 10px;
  color: #e50000;
  outline: 0
}

#pageLogin #contents .login-box .login {
  display: inline-block;
  box-sizing: border-box;
  width: 410px;
  height: 350px;
  margin: 0 auto 20px auto;
  padding: 30px 40px;
  background-color: #eff3f4;
  border-radius: 5px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageLogin #contents .login-box .login {
    width: 100%;
    border-radius: 0
  }

}

#pageLogin #contents .login-box .login>div {
  margin-bottom: 30px;
  text-align: left
}

#pageLogin #contents .login-box .login .submit-box {
  margin-bottom: 0;
  text-align: center
}

#pageLogin #contents .login-box .login label {
  display: block;
  margin: 10px 0
}

#pageLogin #contents .login-box .login label:after {
  content: "："
}

#pageLogin #contents .login-box .login input {
  box-sizing: border-box;
  width: 100%;
  height: 38px;
  padding: 6px
}

#pageLogin #contents .login-box .login #submit {
  width: 130px;
  height: 32px;
  line-height: 32px;
  margin-top: 20px;
  color: #fff;
  font-size: .9rem;
  text-align: center;
  cursor: pointer;
  border: 0;
  background-color: #397d9a;
  border-radius: 15px;
  transition: background-color .2s
}

#pageLogin #contents .login-box .login #submit:disabled {
  cursor: default;
  background-color: #666
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageLogin #contents .login-box .login #submit {
    width: 60%;
    height: 40px;
    line-height: 40px;
    border-radius: 2px
  }

}

#pageLogin #contents .login-box .login #submit:focus:not(:disabled),#pageLogin #contents .login-box .login #submit:hover:not(:disabled) {
  background-color: #195d7a
}

#pageLogin #contents .login-box.pin-box .code-box {
  margin-top: 70px
}

#pageLogin #contents .comment {
  margin-bottom: 20px
}

#pageLogin #contents .comment-content {
  display: inline-block;
  max-width: 600px;
  overflow-wrap: break-word;
  text-align: left
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageLogin #contents .comment-content {
    max-width: calc(100% - 20px)
  }

}

#pageLogin #contents .comment-content pre {
  white-space: pre-wrap
}

#pageBooklist #booklist-area {
  padding: 10px 5px;
  margin-bottom: 10px;
  text-align: left
}

#pageBooklist #booklist-area ul {
  font-size: 1rem
}

#pageBooklist #booklist-area ul li {
  display: inline-block;
  margin: 10px;
  text-align: left
}

#pageBooklist #booklist-area .separator {
  display: block;
  margin: 15px 0 10px 0;
  padding: 0 0 10px 10px;
  border-bottom: 2px dotted #4584a2;
  font-size: .9rem
}

#pageBooklist #booklist-area ul.first li:first-of-type {
  margin-top: 0
}

#pageBooklist .condition #booklist-area .visited {
  display: inline-block;
  padding: 7px;
  color: #c34b00;
  font-weight: 400;
  border: 1px solid #c34b00
}

#pageBooklist .condition #booklist-area div.visited span {
  font-weight: 400
}

#pageBooklist.styleList #contents .result .closed-booklist {
  margin: -20px 0 20px 60px;
  font-size: small;
  color: #e50000;
  text-align: left
}

#pageBooklist.styleList #contents .result .list.booklist .ranking {
  min-height: 20px;
  margin-top: 5px
}

#pageBooklist.styleList #contents .result .list.booklist .list-head.book:empty {
  height: 2px
}

#pageBooklist.styleList #contents .result .list.booklist .ranking>* {
  display: inline-block;
  line-height: 20px;
  margin-right: 10px;
  font-size: .8rem
}

#pageBooklist.styleList #contents .result .list.booklist .ranking .ranking-rank+.ranking-count {
  font-size: .7rem
}

#pageBooklist.styleList #contents .result .thumbnail.booklist .ranking {
  -webkit-flex-direction: column;
  flex-direction: column;
  min-height: 1.2rem
}

#pageBooklist.styleList #contents .result .thumbnail.booklist .ranking>* {
  -webkit-flex: 1 0 auto;
  flex: 1 0 auto
}

#pageBooklist #container .main-box div.booklist-comment {
  margin-bottom: 20px;
  padding: 20px;
  text-align: left;
  border: 1px solid #ccc;
  border-radius: .3rem;
  overflow: hidden
}

@media screen and (max-width:880px),print and (max-width:516px){
  #pageBooklist #container .main-box div.booklist-comment {
    padding: 20px 10px;
    border-left: none;
    border-right: none;
    border-radius: 0
  }

}

#pageBooklist.styleList #contents .result ul.tab {
  height: 0
}

#pageBooklist.styleList #contents .result .ranking.count {
  margin-left: 0
}

#pageAllfeatures #container .main-box #sitemap {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0 0 40px 15px
}

#pageAllfeatures #container .main-box .group-map {
  width: 270px;
  margin-right: 20px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageAllfeatures #container .main-box .group-map {
    width: 100%;
    margin-right: 0
  }

}

#pageAllfeatures #container .main-box .group-map:last-child {
  margin-right: 0
}

#pageAllfeatures #container .main-box .group-map li {
  line-height: 30px;
  margin: 5px 0 0 20px;
  text-align: left;
  text-indent: 10px;
  font-size: .9rem
}

#pageNoticelist #container .main-box .result {
  margin-bottom: 20px
}

#pageNoticelist #container .main-box .headline-list {
  margin: 20px 25px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageNoticelist #container .main-box .headline-list {
    margin: 20px 10px
  }

}

#pageNoticelist #container .main-box .headline-list .row {
  margin-bottom: 15px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageNoticelist #container .main-box .headline-list .row {
    margin-bottom: 0
  }

}

#pageNoticelist #container .main-box .detail .headline {
  margin: 30px 35px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageNoticelist #container .main-box .detail .headline {
    margin: 30px 10px
  }

}

#pageNoticelist #container .main-box .detail .headline .caption {
  line-height: 30px;
  margin: 5px 0;
  padding: 0 5px;
  font-size: 1.2rem;
  border-bottom: 1px solid #4584a2;
  display: block
}

#pageNoticelist #container .main-box .detail .headline .content {
  width: 100%;
  margin: 10px 0 5px 0;
  padding: 0 5px;
  padding-bottom: 10px;
  border-bottom: 1px solid #4584a2
}

#pageNoticelist #container .main-box .detail pre {
  line-height: 24px;
  white-space: pre-line;
  white-space: -moz-pre-wrap
}

#pageNoticelist #container .main-box .detail .page-move.lower .premark,#pageNoticelist #container .main-box .detail .page-move.lower .premark+.nextmark {
  margin: 0 40px
}

#pageNoticelist #container .main-box .detail .page-move.lower .nextmark {
  margin: 0 40px 0 auto
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageNoticelist #container .main-box .detail .page-move.lower .premark+.nextmark,#pageNoticelist #container .main-box .detail .page-move.lower .prev-next-page {
    width: 120px;
    margin: 0 10px
  }

  #pageNoticelist #container .main-box .detail .page-move.lower .nextmark {
    margin: 0 10px 0 auto
  }

}

#pageError #contents dl#message {
  padding-top: 30px;
  padding-bottom: 30px
}

#pageError #contents dl#message dt {
  line-height: 220%;
  font-size: 2rem
}

#pageError #contents dl#message dd {
  font-size: 1.2rem
}

#NotFound {
  color: #444;
  padding: 70px 0 70px
}

#NotFound h1 {
  font-family: SF Pro JP","SF Pro Display","SF Pro Icons","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック","Helvetica Neue","Helvetica","Arial",sans-serif";
  font-size: 3em;
  padding: 20px 5px
}

#NotFound p {
  font-size: 1.1em;
  line-height: 1.6;
  padding: 15px 0
}

#NotFound a {
  text-decoration: underline!important
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #container .main-box .headmark .subtitle {
    font-size: 0
  }

  #pageVisitor #container .main-box .headmark .subtitle .verb {
    font-size: .9rem
  }

}

#pageVisitor #request {
  margin-bottom: 50px
}

#pageVisitor #request fieldset {
  border: 0
}

#pageVisitor #request .error-message {
  margin-top: 40px;
  font-size: 1rem
}

#pageVisitor #request .item-list {
  display: block;
  padding: 20px;
  text-align: left
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #request .item-list {
    padding: 20px 10px
  }

}

#pageVisitor #request .item-list .example {
  display: inline-block;
  margin-bottom: 10px
}

#pageVisitor #request .item-list .example .any {
  width: auto
}

#pageVisitor #request .item-list li {
  margin: 5px auto;
  line-height: 26px;
  font-size: 0
}

#pageVisitor #request .item-list li>* {
  display: inline-block;
  font-size: .9rem;
  vertical-align: top
}

#pageVisitor #request .item-list .name {
  box-sizing: border-box;
  width: 200px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #request .item-list .name {
    width: 100%;
    padding: 0 5px
  }

}

#pageVisitor #request .item-list .any,#pageVisitor #request .item-list .require {
  color: #e50000;
  font-size: .6rem;
  font-weight: 400
}

#pageVisitor #request .item-list .any:before,#pageVisitor #request .item-list .require:before {
  content: "【"
}

#pageVisitor #request .item-list .any:after,#pageVisitor #request .item-list .require:after {
  content: "】"
}

#pageVisitor #request .item-list .value {
  box-sizing: border-box;
  width: calc(100% - 200px);
  padding-left: 10px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #request .item-list .value {
    width: 100%;
    padding: 5px;
    font-size: 1rem;
    border-top: 1px dotted #ccc
  }

  #pageVisitor #request .item-list.form .value {
    padding: 0;
    border: none
  }

}

#pageVisitor #request .item-list .value pre {
  overflow-wrap: break-word
}

#pageVisitor #request .item-list .value input {
  padding: 2px 5px 2px 5px;
  vertical-align: middle
}

#pageVisitor #request .item-list .value input[type=text] {
  box-sizing: border-box;
  width: 100%;
  max-width: 430px
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #request .item-list .value input[type=text] {
    max-width: 100%
  }

}

#pageVisitor #request .item-list .value input+label {
  margin-left: 5px
}

#pageVisitor #request .item-list .value label+input {
  margin-left: 15px
}

#pageVisitor #request .item-list .value textarea {
  box-sizing: border-box;
  width: 100%;
  max-height: 60px;
  padding: 2px 5px;
  vertical-align: bottom
}

#pageVisitor #request .item-list .value .error {
  font-size: .75rem;
  color: #e50000
}

#pageVisitor #request .item-list .value pre {
  white-space: pre-wrap
}

#pageVisitor #request .item-list .clear-row {
  display: inline-block;
  box-sizing: border-box;
  width: 100%;
  margin-top: 10px;
  padding: 0 10px;
  text-align: right;
  font-size: .75rem;
  line-height: 26px;
  border-top: 1px dotted #ccc
}

#pageVisitor #request .comment {
  margin-top: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: left
}

#pageVisitor #request .comment .headmark3 {
  margin: 5px 10px;
  font-size: .9rem;
  font-weight: 700
}

#pageVisitor #request .comment .headmark3 .annotation {
  margin-left: 5px;
  font-weight: 400;
  font-size: .75rem
}

#pageVisitor #request .comment .headmark3:before {
  content: "";
  display: inline-block;
  margin-right: 5px;
  width: 10px;
  height: 10px;
  background-color: #3c7b97
}

#pageVisitor #request .comment .comment-content {
  padding: 10px;
  overflow-wrap: break-word
}

#pageVisitor #request .comment .comment-content pre {
  white-space: pre-wrap
}

#pageVisitor #request .comment .comment-content textarea {
  box-sizing: border-box;
  width: 100%;
  padding: 5px
}

#pageVisitor #request .comment #privacy pre {
  max-height: 150px;
  padding: 5px 10px;
  overflow: auto;
  overflow-wrap: break-word;
  border: 1px solid #ccc
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #request .comment #privacy pre {
    margin: 0;
    padding: 5px
  }

}

#pageVisitor #request .comment #privacy-agreement {
  height: 40px;
  line-height: 40px;
  margin-top: 10px;
  text-align: center;
  font-size: 1rem;
  color: #000
}

#pageVisitor #request .comment #privacy-agreement input[type=checkbox] {
  margin-right: 10px;
  width: 20px;
  height: 20px;
  vertical-align: middle
}

#pageVisitor #request .comment+.headmark2,#pageVisitor #request .comment+section .headmark2 {
  margin-top: 20px
}

#pageVisitor #request .act-box {
  margin: 10px auto 20px auto
}

#pageVisitor #request .act-box>* {
  vertical-align: top
}

#pageVisitor #request .act {
  display: inline-block;
  box-sizing: border-box;
  height: 40px;
  line-height: 40px;
  margin: 10px 10px 0 10px;
  padding: 0 10px;
  text-decoration: none;
  border-radius: 2px
}

#pageVisitor #request .act.fix {
  font-size: .8rem
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #request .act.fix {
    font-size: 0
  }

  #pageVisitor #request .act.fix .verb {
    font-size: .8rem
  }

}

#pageVisitor #request .act.submit {
  font-size: 1.2rem;
  min-width: 280px;
  border: 0
}

#pageVisitor #request .act.submit:disabled {
  cursor: default;
  background-color: #195d7a
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #request .act.fix+.act.submit {
    min-width: 200px
  }

}

#pageVisitor #request .act-box .option {
  margin: 15px 0
}

#pageVisitor #request .act-box .option input[type=checkbox] {
  vertical-align: middle
}

#pageVisitor #request .act-box .option input~label {
  padding-left: 10px;
  vertical-align: middle
}

#pageVisitor #request .ano {
  line-height: 24px;
  padding-left: 30px;
  font-size: 1.6rem;
  text-align: left
}

@media screen and (max-width:720px),print and (max-width:420px){
  #pageVisitor #request .ano {
    padding-left: 10px;
    font-size: 1.2rem
  }

}

.stepbar {
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row
}

.stepbar li {
  -webkit-flex: 1;
  flex: 1;
  position: relative;
  height: 40px;
  line-height: 40px;
  padding: 0 40px 0 20px;
  font-size: 1rem;
  background-color: #eee;
  box-sizing: border-box
}

@media screen and (max-width:720px),print and (max-width:420px){
  .stepbar li {
    font-size: 0
  }

  .stepbar li .verb {
    font-size: 1rem
  }

}

.stepbar li:after,.stepbar li:before {
  position: absolute;
  left: -15px;
  display: block;
  content: '';
  background-color: #eee;
  border-left: 4px solid #fff;
  width: 20px;
  height: 20px
}

.stepbar li:after {
  top: 0;
  transform: skew(30deg)
}

.stepbar li:before {
  bottom: 0;
  transform: skew(-30deg)
}

.stepbar li:first-child {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px
}

@media screen and (max-width:880px),print and (max-width:516px){
  .stepbar li:first-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
  }

}

.stepbar li:first-child:after,.stepbar li:first-child:before {
  content: none
}

.stepbar li:last-child {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px
}

@media screen and (max-width:880px),print and (max-width:516px){
  .stepbar li:last-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
  }

}

.stepbar li.current {
  color: #fff;
  background-color: #3c7b97
}

.stepbar li.current em {
  font-weight: 400
}

.stepbar li.current:after,.stepbar li.current:before {
  background-color: #3c7b97
}

#pageCalendar.parts-calendar .main-box {
  max-width: none
}

@media screen and (max-width:1064px){
  #pageCalendar.parts-calendar #container .main-box {
    margin: 0
  }

}

#pageCalendar.parts-calendar #contents #calendar {
  padding: 20px 20px 0 20px
}

#pageCalendar.parts-calendar #contents h1.title {
  padding: 20px 0 0 0;
  font-size: 1.2em
}

#pageCalendar.parts-calendar #contents #calendar #calendar-area {
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  overflow: hidden
}

#pageCalendar.parts-calendar #contents #calendar .month {
  -webkit-flex: 1 1 282px;
  flex: 1 1 282px;
  padding: 10px;
  width: auto
}

#pageCalendar.parts-calendar #contents #calendar .month.dummy {
  height: 0;
  padding: 0 10px;
  margin: 0
}

@media screen and (max-width:720px){
  #pageCalendar.parts-calendar #contents #calendar .month {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 100%;
    margin: 10px auto
  }

}

#pageCalendar.parts-calendar #contents p.link {
  margin: 10px 20px 10px 10px;
  text-align: right;
  font-size: .9em
}

#pageAboutOPAC4 #container #contents {
  min-height: auto
}

#pageAboutOPAC4 #container .main-box {
  max-width: 500px;
  min-height: auto;
  margin: 60px auto;
  padding: 30px;
  text-align: left;
  border: solid 1px #ccc;
  border-radius: 5px
}

@media screen and (max-width:560px){
  #pageAboutOPAC4 #container .main-box {
    margin: 60px 10px
  }

}

#pageAboutOPAC4 #container .main-box .credit {
  margin-top: 30px
}

#pageAboutOPAC4 #container .main-box .credit .title {
  margin-bottom: 5px;
  border-bottom: solid 1px #ccc
}

#pageAboutOPAC4 #container #footer {
  height: 0;
  margin-top: 0
}

.reader {
  display: inline-block;
  float: right;
  font-size: 0;
  width: 0;
  height: 0
}

.lb-loader,.lightbox {
  text-align: center;
  line-height: 0;
  position: absolute;
  left: 0
}

body.lb-disable-scrolling {
  overflow: hidden
}

.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: #000;
  opacity: .8;
  display: none
}

.lightbox {
  width: 100%;
  z-index: 10000;
  font-weight: 400;
  outline: 0
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  max-height: none;
  border-radius: 3px;
  border: 4px solid #fff
}

.lightbox a img {
  border: none
}

.lb-outerContainer {
  position: relative;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;
  background-color: #fff
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both
}

.lb-loader {
  top: 43%;
  height: 25%;
  width: 100%
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(../images/loading.gif) no-repeat
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10
}

.lb-container>.nav {
  left: 0
}

.lb-nav a {
  outline: 0;
  background-image: url(data:image/gif;
  base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==)}

.lb-next,.lb-prev {
  height: 100%;
  cursor: pointer;
  display: block
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(../images/prev.png) left 48% no-repeat;
  opacity: 0;
  -webkit-transition: opacity .6s;
  -moz-transition: opacity .6s;
  -o-transition: opacity .6s;
  transition: opacity .6s
}

.lb-nav a.lb-prev:hover {
  opacity: 1
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(../images/next.png) right 48% no-repeat;
  opacity: 0;
  -webkit-transition: opacity .6s;
  -moz-transition: opacity .6s;
  -o-transition: opacity .6s;
  transition: opacity .6s
}

.lb-nav a.lb-next:hover {
  opacity: 1
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  width: 100%;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both
}

.lb-data {
  padding: 0 4px;
  color: #ccc
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: 700;
  line-height: 1em
}

.lb-data .lb-caption a {
  color: #4ae
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(../images/close.png) top right no-repeat;
  text-align: right;
  outline: 0;
  opacity: .7;
  -webkit-transition: opacity .2s;
  -moz-transition: opacity .2s;
  -o-transition: opacity .2s;
  transition: opacity .2s
}

.lb-data .lb-close:hover {
  cursor: pointer;
  opacity: 1
}