@charset "UTF-8";
@font-face {
  font-family: "FontAwesome";
  src: url("../fonts/fontawesome-webfont.eot");
  src: url("../fonts/fontawesome-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/fontawesome-webfont.woff") format("woff"), url("../fonts/fontawesome-webfont.ttf") format("truetype"), url("../fonts/fontawesome-webfont.svg#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
#vivliostyle-page-navigation-up,
#vivliostyle-page-navigation-down,
#vivliostyle-page-navigation-left,
#vivliostyle-page-navigation-right {
  position: absolute;
  margin: 0;
  color: transparent;
  background: transparent;
  cursor: pointer;
  z-index: 1000;
  color: rgba(255, 255, 255, 0);
  background: transparent;
}
#vivliostyle-page-navigation-up.vivliostyle-menu-enabled,
#vivliostyle-page-navigation-down.vivliostyle-menu-enabled,
#vivliostyle-page-navigation-left.vivliostyle-menu-enabled,
#vivliostyle-page-navigation-right.vivliostyle-menu-enabled {
  color: rgba(0, 0, 0, 0.5);
  background: transparent;
  -moz-transition: ease-out 0.25s;
  -o-transition: ease-out 0.25s;
  -webkit-transition: ease-out 0.25s;
  transition: ease-out 0.25s;
}
#vivliostyle-page-navigation-up[data-vivliostyle-ui-state="attention"],
#vivliostyle-page-navigation-down[data-vivliostyle-ui-state="attention"],
#vivliostyle-page-navigation-left[data-vivliostyle-ui-state="attention"],
#vivliostyle-page-navigation-right[data-vivliostyle-ui-state="attention"] {
  color: rgba(255, 255, 255, 0.75);
  background: rgba(0, 0, 0, 0.25);
  -moz-transition: ease-in 0.25s;
  -o-transition: ease-in 0.25s;
  -webkit-transition: ease-in 0.25s;
  transition: ease-in 0.25s;
}
#vivliostyle-page-navigation-up:hover,
#vivliostyle-page-navigation-down:hover,
#vivliostyle-page-navigation-left:hover,
#vivliostyle-page-navigation-right:hover {
  color: rgba(255, 255, 255, 0.75);
  background: rgba(0, 0, 0, 0.25);
  -moz-transition: linear 0.1s !important;
  -o-transition: linear 0.1s !important;
  -webkit-transition: linear 0.1s !important;
  transition: linear 0.1s !important;
}
#vivliostyle-page-navigation-up:active,
#vivliostyle-page-navigation-down:active,
#vivliostyle-page-navigation-left:active,
#vivliostyle-page-navigation-right:active {
  color: white;
  background: rgba(0, 0, 0, 0.5);
  -moz-transition: linear 0.1s !important;
  -o-transition: linear 0.1s !important;
  -webkit-transition: linear 0.1s !important;
  transition: linear 0.1s !important;
}
#vivliostyle-page-navigation-up:after,
#vivliostyle-page-navigation-down:after,
#vivliostyle-page-navigation-left:after,
#vivliostyle-page-navigation-right:after {
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
  width: 21.6px;
  height: 21.6px;
  font-size: 23.04px;
  line-height: 1;
  text-align: center;
  vertical-align: middle;
  font-family: "FontAwesome";
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  speak: none;
}

#vivliostyle-page-navigation-up,
#vivliostyle-page-navigation-down {
  left: 0;
  right: 0;
  width: 100%;
  height: 36px;
}

#vivliostyle-page-navigation-up {
  top: 0;
}
#vivliostyle-page-navigation-up:after {
  content: "";
}
#vivliostyle-page-navigation-up:hover {
  cursor: n-resize;
}

#vivliostyle-page-navigation-down {
  bottom: 0;
  cursor: s-resize;
}
#vivliostyle-page-navigation-down:after {
  content: "";
}

#vivliostyle-page-navigation-left,
#vivliostyle-page-navigation-right {
  top: 0;
  bottom: 0;
  width: 36px;
  height: 100%;
}

#vivliostyle-page-navigation-left {
  left: 0;
  cursor: w-resize;
}
#vivliostyle-page-navigation-left:after {
  content: "";
}

#vivliostyle-page-navigation-right {
  right: 0;
  cursor: e-resize;
}
#vivliostyle-page-navigation-right:after {
  content: "";
  text-indent: .125em;
}