@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after {
  content: "";
  content: none;
}

q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img {
  display: block;
}

a {
  text-decoration: none;
}

html {
  font-size: 100%;
  line-height: 1.5em;
}

.wrapper:after, .latest-news li:after, .page-wrapper:after, .list li:after, .list-thumb ul:after, .list-app ul:after, .list-book:after, .anime-other .anime-box:after {
  content: "";
  display: table;
}
.wrapper:after, .latest-news li:after, .page-wrapper:after, .list li:after, .list-thumb ul:after, .list-app ul:after, .list-book:after, .anime-other .anime-box:after {
  clear: both;
}
.wrapper, .latest-news li, .page-wrapper, .list li, .list-thumb ul, .list-app ul, .list-book, .anime-other .anime-box {
  *zoom: 1;
}

.logo a {
  text-indent: 200%;
  white-space: nowrap;
  overflow: hidden;
}

body {
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", "LiHei Pro", "蘋果儷中黑", "Apple LiGothic Medium", "微軟正黑體", "Microsoft JhengHei" sans-serif;
  background: url(../images/bgr.jpg) 0 0 repeat;
}

.top {
  width: 100%;
  height: 35px;
  padding-top: 7px;
  background-color: #849d82;
}

.top-inner {
  width: 960px;
  margin: 0 auto;
}

.lang {
  float: right;
  height: 28px;
  padding: 0 1em;
  background-color: #667964;
  -moz-border-radius: 14px;
  -webkit-border-radius: 14px;
  border-radius: 14px;
}
.lang p {
  font-size: 0.813em;
  line-height: 28px;
  color: white;
}
.lang p a {
  padding: 0 0.35em;
  color: white;
}
.lang p a:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75);
  opacity: 0.75;
}

.wrapper {
  width: 960px;
  padding-bottom: 50px;
  margin: 0 auto;
  background: url(../images/bg_bottom.jpg) left bottom no-repeat;
}

.header {
  width: 960px;
  height: 92px;
  margin: 0 auto;
}

.logo {
  float: left;
  background: url(../images/logo.jpg) 0 0 no-repeat;
}
.logo a {
  display: block;
  width: 300px;
  height: 92px;
}

.nav {
  float: right;
  padding-top: 25px;
  text-align: right;
}
.nav li {
  position: relative;
  display: inline-block;
  padding-left: 40px;
  line-height: 40px;
  font-size: 0.938em;
}
.nav li a {
  color: #6f5830;
}
.nav li a:hover {
  color: #a68336;
}
.nav li:hover .sub-nav {
  display: block;
}
.nav .sub-nav {
  display: none;
  position: absolute;
  left: 50%;
  top: 40px;
  z-index: 100;
  width: 150px;
  padding: 5px 0;
  margin-left: -55px;
  background-color: #a68336;
  background-color: rgba(166, 131, 54, 0.9);
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: 0 3px 8px #2c2c2c;
  -webkit-box-shadow: 0 3px 8px #2c2c2c;
  box-shadow: 0 3px 8px #2c2c2c;
}
.nav .sub-nav li {
  display: block;
  padding: 0 10px;
  text-align: center;
  font-style: 0.75em;
}
.nav .sub-nav li:hover {
  background-color: #6f5830;
  background-color: rgba(111, 88, 48, 0.85);
}
.nav .sub-nav li a {
  display: block;
  color: white;
}

.footer {
  padding: 20px 0;
  text-align: center;
  background-color: #a68336;
}
.footer h2 {
  margin-bottom: 10px;
  font-size: 1.125em;
  font-weight: normal;
  letter-spacing: 1px;
  color: white;
}
.footer .footer-nav {
  margin-bottom: 10px;
}
.footer .footer-nav p {
  color: #d1b269;
}
.footer .footer-nav a {
  display: inline-block;
  padding: 0 10px;
  font-size: 0.813em;
  color: white;
}
.footer .footer-nav a:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
  opacity: 0.85;
}
.footer .footer-info p {
  font-size: 0.813em;
  line-height: 1.65;
  color: #f0e0bc;
}
.footer .footer-info p span {
  padding: 0 10px;
}
.footer .footer-info p a {
  color: #d1b269;
  border-bottom: 1px solid #d1b269;
}
.footer .footer-info p a:hover {
  color: white;
  border-bottom: 1px solid white;
}

.banner {
  height: 426px;
  padding: 7px;
  margin-bottom: 30px;
  background: url(../images/banner_frame.jpg) 0 0 no-repeat;
  -moz-box-shadow: 1px 2px 5px #A5A5A5;
  -webkit-box-shadow: 1px 2px 5px #A5A5A5;
  box-shadow: 1px 2px 5px #A5A5A5;
}
.banner .banner-inner {
  position: relative;
  width: 946px;
  height: 426px;
  overflow: hidden;
}
.banner li {
  position: absolute;
}
.banner a.prev, .banner a.next {
  position: absolute;
  top: 40%;
  z-index: 10;
  display: block;
  width: 87px;
  height: 50px;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  opacity: 0.5;
  -moz-transition: all 0.35s;
  -o-transition: all 0.35s;
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
}
.banner a.prev:hover, .banner a.next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
  opacity: 0.9;
}
.banner a.prev {
  left: 0;
  background: url(../images/icon_prev.png) 0 0 no-repeat;
}
.banner a.next {
  right: -2px;
  background: url(../images/icon_next.png) 0 0 no-repeat;
}
.banner .dot {
  position: absolute;
  right: 20px;
  bottom: 20px;
}
.banner .dot a {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin: 2px;
  background-color: #dbdbdb;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -moz-box-shadow: 0 2px 3px #2c2c2c;
  -webkit-box-shadow: 0 2px 3px #2c2c2c;
  box-shadow: 0 2px 3px #2c2c2c;
}
.banner .dot a.active {
  background-color: #b59c56;
}
.banner .banner-info {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 946px;
  height: 55px;
  background-color: black;
  background-color: rgba(0, 0, 0, 0.5);
}
.banner .banner-info h2 {
  padding: 0 1em;
  font-size: 1.313em;
  line-height: 55px;
  color: white;
  text-shadow: 1px 1px 2px #2c2c2c;
}

.latest-news {
  float: left;
  width: 710px;
  margin-bottom: 15px;
}
.latest-news .title {
  position: relative;
  width: 680px;
  margin-bottom: 20px;
  background: url(../images/title_dot.png) left bottom repeat-x;
}
.latest-news .title h2 {
  width: 650px;
  height: 45px;
  padding-left: 40px;
  font-size: 1.313em;
  line-height: 45px;
  background: url(../images/icon_latest_news.png) 0 0 no-repeat;
}
.latest-news .title h2 a {
  color: #528753;
}
.latest-news .title a.more {
  position: absolute;
  right: 0;
  top: 13px;
  display: block;
  width: 40px;
  height: 16px;
  padding: 1px 5px;
  border: 1px solid #b59c56;
  font-size: 0.75em;
  text-align: center;
  line-height: 15px;
  color: #b59c56;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.latest-news .title a.more:hover {
  color: white;
  background-color: #a68336;
}
.latest-news ul {
  float: left;
  width: 330px;
  margin-right: 25px;
}
.latest-news li {
  margin-bottom: 12px;
  font-size: 0.813em;
  line-height: 1.5;
}
.latest-news li span.date {
  float: left;
  display: block;
  width: 70px;
}
.latest-news li span.news-title {
  float: left;
  width: 260px;
}
.latest-news li span.btn {
  display: inline-block;
  font-size: 0.923em;
  color: white;
  background-color: #df8230;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RmODIzMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2FiNjMyNSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #df8230), color-stop(100%, #ab6325));
  background-image: -moz-linear-gradient(#df8230, #ab6325);
  background-image: -webkit-linear-gradient(#df8230, #ab6325);
  background-image: linear-gradient(#df8230, #ab6325);
}
.latest-news li span.btn span {
  display: inline-block;
  height: 18px;
  padding: 0 0.5em 0 1.5em;
  line-height: 18px;
  background: url(../images/icon_arrow.png) 5px 4px no-repeat;
}
.latest-news li a {
  display: block;
  color: #2c2c2c;
}
.latest-news li a:hover {
  color: #667964;
}

.sub-banner {
  width: 250px;
  float: right;
  margin-bottom: 0.75em;
}
.sub-banner a {
  display: block;
  margin: 0 0 8px;
}
.sub-banner a:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
  opacity: 0.5;
}

.wisdom-books {
  clear: both;
}
.wisdom-books .title {
  position: relative;
  width: 100%;
  margin-bottom: 20px;
  background: url(../images/title_dot.png) left bottom repeat-x;
}
.wisdom-books .title h2 {
  height: 45px;
  padding-left: 40px;
  font-size: 1.313em;
  line-height: 45px;
  color: #528753;
  background: url(../images/icon_wisdom_book.png) 0 0 no-repeat;
}
.wisdom-books .title h2 a {
  color: #528753;
}
.wisdom-books .title a.more {
  position: absolute;
  right: 0;
  top: 13px;
  display: block;
  width: 40px;
  height: 16px;
  padding: 1px 5px;
  border: 1px solid #b59c56;
  font-size: 0.75em;
  text-align: center;
  line-height: 15px;
  color: #b59c56;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.wisdom-books .title a.more:hover {
  color: white;
  background-color: #a68336;
}
.wisdom-books li {
  display: block;
  float: left;
  margin-right: 25px;
}
.wisdom-books li:last-child {
  margin-right: 0;
}

.book-box {
  width: 280px;
  padding-top: 20px;
}
.book-box.book-box-latest {
  position: relative;
  padding: 19px;
  border: 1px solid #edc6a5;
  background-color: white;
  background-color: rgba(255, 255, 255, 0.65);
}
.book-box.book-box-latest .tag-new {
  position: absolute;
  left: -2px;
  top: -2px;
}
.book-box .book-cover {
  float: left;
  margin-right: 10px;
}
.book-box .book-des {
  padding-top: 5px;
}
.book-box .book-des h3 {
  margin-bottom: 10px;
  font-size: 0.938em;
  color: #4c2d11;
}
.book-box .book-des p {
  font-size: 0.813em;
  line-height: 1.5;
  text-align: justify;
  min-height: 85px;
}
.book-box .btn {
  text-align: right;
}
.book-box .btn a {
  display: inline-block;
  padding: 5px 12px;
  margin-left: 2px;
  font-size: 0.813em;
  color: white;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
}
.book-box .btn a:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
  opacity: 0.85;
}
.book-box .btn a.download {
  background-color: #a68336;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E2ODMzNiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzZmNTgzMCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #a68336), color-stop(100%, #6f5830));
  background-image: -moz-linear-gradient(#a68336, #6f5830);
  background-image: -webkit-linear-gradient(#a68336, #6f5830);
  background-image: linear-gradient(#a68336, #6f5830);
}
.book-box .btn a.read {
  background-color: #528753;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzg0OWQ4MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzUwNWY0ZSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #849d82), color-stop(100%, #505f4e));
  background-image: -moz-linear-gradient(#849d82, #505f4e);
  background-image: -webkit-linear-gradient(#849d82, #505f4e);
  background-image: linear-gradient(#849d82, #505f4e);
}

.page {
  border-top: 1px solid #a68336;
  background: url(../images/page_bgr.png) 0 0 repeat-x;
}

.page-wrapper {
  width: 960px;
  margin: 0 auto;
  background: url(../images/bg_bottom.jpg) left bottom no-repeat;
}

.page-wrapper {
  width: 960px;
  margin: 0 auto;
}

.page-nav {
  float: left;
  width: 215px;
  padding-top: 36px;
}
.page-nav .page-nav-title {
  background: url(../images/title_dot.png) left bottom repeat-x;
  margin-bottom: 0.75em;
}
.page-nav .page-nav-title h2 {
  padding: 0 0 10px 25px;
  font-size: 1.313em;
  line-height: 1.35;
  color: #667964;
  background: url(../images/page_nav_title) 5px 8px no-repeat;
}
.page-nav li {
  position: relative;
}
.page-nav li a {
  display: block;
  color: #2c2c2c;
}
.page-nav li a:hover {
  color: #a68336;
}
.page-nav li a span.icon-down {
  position: absolute;
  right: 0;
  top: 15px;
}
.page-nav ul.first-nav > li.current > a {
  color: #a68336;
  background: url(../images/page_nav_list_gold.png) left 8px no-repeat;
}
.page-nav ul.first-nav > li > a {
  padding: 8px 20px 8px 25px;
  font-size: 0.938em;
  line-height: 1.5;
  border-bottom: 1px solid #e7e7e7;
  background: url(../images/page_nav_list.png) left 8px no-repeat;
}
.page-nav ul.first-nav > li > a:hover {
  background: url(../images/page_nav_list_gold.png) left 8px no-repeat;
}
.page-nav ul.second-nav {
  display: none;
  padding: 8px 0;
  border-bottom: 1px solid #e7e7e7;
  margin: 1px 0;
  background-color: #f3eee7;
}
.page-nav ul.second-nav > li > a {
  padding: 8px 0 8px 25px;
  font-size: 0.85em;
  line-height: 1.35;
}

.main {
  width: 730px;
  margin: 0 auto;
  padding-top: 36px;
  background: url(../images/main_bg.png) 0 0 no-repeat;
}
.main.right {
  float: right;
}

.main-content {
  width: 600px;
  padding: 0 65px 50px;
  margin: 0 auto;
  background: url(../images/main_bgr.png) 0 0 repeat;
}

.main-title {
  background: url(../images/main_title_bg.jpg) left bottom no-repeat;
}
.main-title h2 {
  padding-bottom: 0.5em;
  font-size: 1.125em;
  line-height: 1.5;
  color: #ab6325;
  margin-bottom: 1.125em;
}

.main-intro {
  margin-bottom: 1.5em;
}
.main-intro p {
  font-size: 0.938em;
  line-height: 1.5;
  margin-bottom: 0.525em;
}

.breadcrumb {
  text-align: right;
  font-size: 0.75em;
  line-height: 1.5;
  margin-bottom: 0.525em;
}
.breadcrumb a {
  padding: 0 0.35em;
  color: #595959;
}
.breadcrumb a.current {
  color: #528753;
  padding: 0 0 0 0.35em;
}

.list li {
  position: relative;
  padding-bottom: 1em;
  border-bottom: 1px solid #dbdbdb;
  margin-bottom: 1.5em;
}
.list h3 {
  float: left;
  width: 500px;
  font-size: 0.938em;
  line-height: 1.5;
}
.list h3 a {
  color: #528753;
}
.list a.btn {
  position: absolute;
  right: 0;
  top: 3px;
  display: inline-block;
  font-size: 0.75em;
  color: white;
  background-color: #df8230;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RmODIzMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2FiNjMyNSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #df8230), color-stop(100%, #ab6325));
  background-image: -moz-linear-gradient(#df8230, #ab6325);
  background-image: -webkit-linear-gradient(#df8230, #ab6325);
  background-image: linear-gradient(#df8230, #ab6325);
}
.list a.btn span {
  display: inline-block;
  padding: 0.2em 1em 0.2em 2em;
  background: url(../images/icon_arrow.png) 5px 3px no-repeat;
}

.list-thumb {
  border-bottom: 1px solid #dbdbdb;
}
.list-thumb h3 {
  padding-bottom: 10px;
  color: #528753;
  border-bottom: 1px solid #e7e7e7;
  margin-bottom: 0.75em;
}
.list-thumb li {
  display: block;
  float: left;
  width: 180px;
  margin-right: 20px;
  text-align: center;
  margin-bottom: 1.5em;
}
.list-thumb li:hover {
  opacity: 0.85;
}
.list-thumb li img {
  display: block;
  width: 100%;
  padding: 4px;
  border: 1px solid #a68336;
  background-color: white;
  margin-bottom: 0.225em;
  -moz-box-shadow: 0 1px 3px #A5A5A5;
  -webkit-box-shadow: 0 1px 3px #A5A5A5;
  box-shadow: 0 1px 3px #A5A5A5;
}
.list-thumb li h4 {
  font-size: 0.813em;
  line-height: 1.5;
}
.list-thumb li h4 a {
  color: #595959;
}

.list-app {
  border-bottom: 1px solid #dbdbdb;
}
.list-app h3 {
  padding-bottom: 10px;
  color: #528753;
  border-bottom: 1px solid #e7e7e7;
  margin-bottom: 0.75em;
}
.list-app li {
  display: block;
  float: left;
  width: 100px;
  margin-right: 20px;
  text-align: center;
  margin-bottom: 1.5em;
}
.list-app li:hover {
  opacity: 0.85;
}
.list-app li img {
  display: block;
  width: 100%;
  margin-bottom: 0.225em;
}
.list-app li h4 {
  font-size: 0.813em;
  line-height: 1.5;
}
.list-app li h4 a {
  color: #595959;
}

.list-book {
  padding-bottom: 1em;
  border-bottom: 1px solid #dbdbdb;
}
.list-book li {
  float: left;
  margin-bottom: 25px;
}
.list-book li:first-child {
  margin-right: 30px;
}

.qrcode {
  padding: 3em 0 0;
}
.qrcode ul {
  text-align: center;
}
.qrcode li {
  display: inline-block;
  width: 120px;
  padding: 0 1em;
}
.qrcode li img {
  width: 100%;
  display: block;
  border: 1px solid #dbdbdb;
  margin-bottom: 0.5em;
}
.qrcode li p {
  font-size: 0.813em;
}

.detail p {
  font-size: 0.938em;
  line-height: 1.5;
  margin-bottom: 0.525em;
}

.main-btn {
  padding-top: 1em;
  border-top: 1px solid #dbdbdb;
  text-align: center;
  margin-top: 1.5em;
}
.main-btn a.btn {
  display: inline-block;
  padding: 0.5em 1.5em;
  font-size: 1.15em;
  color: white;
  background-color: #df8230;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RmODIzMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2FiNjMyNSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #df8230), color-stop(100%, #ab6325));
  background-image: -moz-linear-gradient(#df8230, #ab6325);
  background-image: -webkit-linear-gradient(#df8230, #ab6325);
  background-image: linear-gradient(#df8230, #ab6325);
}
.main-btn a.btn span {
  display: inline-block;
  padding: 0.2em 1em 0.2em 2em;
  background: url(../images/icon_arrow.png) 5px 3px no-repeat;
}

.anime-main {
  padding-bottom: 3em;
}
.anime-main h2 {
  font-size: 0.938em;
  color: #528753;
  margin-bottom: 0.75em;
}
.anime-main h2 .tag {
  position: relative;
  display: inline-block;
  height: 22px;
  padding: 0 10px 0 20px;
  margin-right: 15px;
  font-size: 0.75em;
  line-height: 22px;
  color: white;
  list-style-type: disc;
  background: #992e2e url(../images/icon_now_play_dot.png) 7px 8px no-repeat;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.anime-main h2 .tag span {
  position: absolute;
  right: -9px;
  top: 0;
}
.anime-main .video {
  margin-bottom: 0.75em;
}
.anime-main p {
  font-size: 0.813em;
  line-height: 1.5;
}

.anime-other {
  position: relative;
}
.anime-other .anime-box {
  width: 570px;
  padding: 20px 0 20px 15px;
  border: 1px solid #edc6a5;
  background-color: white;
  background-color: rgba(255, 255, 255, 0.65);
  -moz-box-shadow: 0 2px 3px #dbdbdb;
  -webkit-box-shadow: 0 2px 3px #dbdbdb;
  box-shadow: 0 2px 3px #dbdbdb;
}
.anime-other .anime-box-content {
  width: 570px;
  overflow: hidden;
}
.anime-other h3 {
  font-size: 0.938em;
  color: #4c2d11;
  margin-bottom: 0.75em;
}
.anime-other li {
  display: block;
  float: left;
  margin-right: 20px;
  text-align: center;
}
.anime-other li:hover {
  opacity: 0.85;
}
.anime-other li:last-child {
  margin-right: 0;
}
.anime-other li img {
  display: block;
  width: 100%;
  margin-bottom: 0.3em;
}
.anime-other li a {
  font-size: 0.813em;
  color: #595959;
}
.anime-other a.btn {
  position: absolute;
  display: block;
  width: 26px;
  height: 50px;
  z-index: 100;
}
.anime-other a.btn.prev {
  top: 80px;
  left: -23px;
  background: url(../images/icon_anime_prev.png) top left no-repeat;
}
.anime-other a.btn.prev:hover {
  background: url(../images/icon_anime_prev.png) bottom left no-repeat;
}
.anime-other a.btn.next {
  top: 80px;
  right: -27px;
  background: url(../images/icon_anime_next.png) top left no-repeat;
}
.anime-other a.btn.next:hover {
  background: url(../images/icon_anime_next.png) bottom left no-repeat;
}

.pager {
  text-align: center;
  margin-top: 1.5em;
}
.pager a {
  display: inline-block;
  width: 25px;
  height: 25px;
  border: 1px solid #A5A5A5;
  font-size: 0.938em;
  font-weight: bold;
  line-height: 25px;
  vertical-align: top;
  color: #84682b;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.pager a:hover {
  border: 1px solid #a68336;
  background-color: #a68336;
  color: white;
}
.pager a.current {
  border: 1px solid #a68336;
  background-color: #a68336;
  color: white;
}
.pager a.prev {
  background: url(../images/icon_pager_prev.png) top left no-repeat;
}
.pager a.prev:hover {
  background: #a68336 url(../images/icon_pager_prev.png) bottom left no-repeat;
}
.pager a.next {
  background: url(../images/icon_pager_next.png) top left no-repeat;
}
.pager a.next:hover {
  background: #a68336 url(../images/icon_pager_next.png) bottom left no-repeat;
}

.gallery {
  width: 100%;
  border-top: 1px solid #a68336;
  background: url(../images/gallery_bgr.jpg) 0 0 repeat;
}

.gallery-wrapper {
  background: url(../images/gallery_topr.jpg) 0 0 repeat-x;
}

.gallery-content {
  background: url(../images/gallery_bottom.jpg) bottom left repeat-x;
}

.gallery-main {
  width: 980px;
  min-height: 450px;
  padding: 20px 0 150px;
  margin: 0 auto;
  background: url(../images/gallery_top.jpg) 0 0 no-repeat;
}

.gallery-title {
  text-align: center;
  margin-bottom: 30px;
}
.gallery-title h2 {
  height: 45px;
  padding-left: 55px;
  display: inline-block;
  font-size: 1.125em;
  line-height: 31px;
  font-weight: normal;
  color: #84682b;
  background: url(../images/gallery_title_left.png) left bottom no-repeat;
}
.gallery-title h2 span.gallery-title-wrapper {
  display: inline-block;
  height: 45px;
  padding-right: 24px;
  background: url(../images/gallery_title_right.png) right bottom no-repeat;
}
.gallery-title h2 span.gallery-title-main {
  display: inline-block;
  height: 33px;
  margin-top: 12px;
  background: url(../images/gallery_titler.png) left bottom repeat-x;
}

.writing {
  text-align: center;
}
.writing li {
  display: inline-block;
  width: 240px;
  padding-bottom: 30px;
}
.writing li .scroll-top {
  width: 240px;
  height: 36px;
  background: url(../images/scroll_top.png) 0 0 no-repeat;
}
.writing li .scroll-bottom {
  width: 240px;
  height: 36px;
  background: url(../images/scroll_bottom.png) 0 0 no-repeat;
}
.writing li .scroll-main {
  background: url(../images/scroll_bgr.png) top center repeat-y;
}
.writing li .scroll-main img {
  width: 182px;
  margin: 0 auto;
}
.writing li h3 {
  padding: 0 1em;
  font-size: 0.813em;
  color: #4c2d11;
}

.painting {
  text-align: center;
}
.painting li {
  display: inline-block;
  width: 240px;
  padding-bottom: 30px;
  vertical-align: middle;
}
.painting li h3 {
  padding: 0 1em;
  font-size: 0.813em;
  color: #4c2d11;
}
.painting li.frame-ver .frame-top {
  width: 240px;
  height: 11px;
  background: url(../images/frame_ver_top.png) top center no-repeat;
}
.painting li.frame-ver .frame-bottom {
  width: 240px;
  height: 16px;
  background: url(../images/frame_ver_bottom.png) top center no-repeat;
}
.painting li.frame-ver .frame-main {
  background: url(../images/frame_ver_bgr.png) top center repeat-y;
}
.painting li.frame-ver .frame-main img {
  width: 149px;
  margin: 0 auto;
}
.painting li.frame-hor .frame-top {
  width: 240px;
  height: 11px;
  background: url(../images/frame_hor_top.png) top center no-repeat;
}
.painting li.frame-hor .frame-bottom {
  width: 240px;
  height: 16px;
  background: url(../images/frame_hor_bottom.png) top center no-repeat;
}
.painting li.frame-hor .frame-main {
  background: url(../images/frame_hor_bgr.png) top center repeat-y;
}
.painting li.frame-hor .frame-main img {
  width: 204px;
  margin: 0 auto;
}