@charset "utf-8";
/* Reset Css
----------------------------------------------------------- */
body, div,
dl, dt, dd,
ul, ol, li,
h1, h2, h3, h4, h5, h6,
p, blockquote, pre,
form, fieldset, input, textarea,
th, td {
margin: 0;
padding: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset, img {
border: 0;
}
address, caption, cite, code, dfn,
em, strong, th, var {
font-style: normal;
font-weight: normal;
}
ol, ul {
list-style: none;
}
caption, th {
text-align: left;
}
h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: normal;
}
q:before, q:after {
content:'';
}
abbr, acronym {
border: 0;
}
/* html5 fix
------------------------------------------------------------ */
article, aside, figure, figcaption, footer, header,
hgroup, nav, section, summary { display: block; }
/* clearfix
------------------------------------------------------------ */
/* Modern browsers like Firefox, Safari, Opera */
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
/* IE 7 and MacIE*/
.clearfix {
display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix {
height: 1%;
}
.clearfix {
display: block;
}
/* End hide from IE-mac */
/* Common Setteing
----------------------------------------------------------- */
/* full screen */
html,
body {
height: 100%;
}
/* body */
body {
line-height: 1.2;
font-family: "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
font-size: 84%;
}
/* Link Color */
a { text-decoration: none;}
a:link { color: #888;}
a:visited { color: #888;}
a:hover { color: #ccc; text-decoration: underline;}
a:active { color: #888;}
/* font-size fix for textarea */
textarea { font-size: 84%; }
/* bottom space fix for img */
img { vertical-align: bottom; }
/* hr */
hr {
clear: both;
display: none;
overflow: hidden;
height: 1px;
margin: 9px 0 10px;
border: solid #dbdad5;
border-width: 1px 0 0 0;
}
/* jastify fix */
p { text-align: justify;}
#scrwindow {
height: 100%;
width: 100%;
overflow: hidden;
}
/* sub screen
----------------------------------------------------------- */
#sub_scrwindow {
z-index: 100;
display:none;
position: absolute;
top: 0px;
overflow: hidden;
width: 100%;
height: 100%;
/*
min-width: 980px;
min-height: 500px;
*/
}
#sub_scrwindow .mask_layer{
z-index: 9990;
}
/* sub_contents_frame
----------------------------------------------------------- */
#sub_contents_frame {
position: relative;
z-index: 9999;
/*
min-width: 830px;
*/
padding: 0px 75px;
height:100%;
overflow-y:auto;
}
/* page
----------------------------------------------------------- */
#page {
z-index: 1;
position: absolute;
width: 100%;
height: 100%;
margin-bottom: -50px;
}
#page .spacer {
width: 100%;
height: 50px;
}
#stage {
display: block;
position: relative;
overflow: hidden;
height: 100%;
margin: 0px;
padding: 0px;
}
#canvas_base {
margin-top:0px;
}
#canvas {
z-index: 15;
position: relative;
display: block;
overflow: hidden;
margin: 0px;
padding: 0px;
}
#canvas_base canvas{
z-index: 10; position: absolute; padding: 0px; margin: 0px;
}
/* close - back */
.close {
padding: 10px 0 0;
height: 30px;
}
.menu_back {
float: right;
width: 75px;
height: 28px;
}
.menu_back a {
display: block;
/*\*/overflow: hidden;/**/
width: 100%;
height: 100%;
background-image: url(../image/cmn/btn_ctrl.png);
background-repeat: no-repeat;
background-position: 0 -28px;
text-indent: -9999px;
}
* html .menu_back a {
background-image: url(../image/cmn/btn_ctrl.gif);
}
.menu_back a:hover { background-position: -75px -28px;}
#row_page{
padding: 0px;
margin: 0px auto;
display: block;
z-index: 15;
position: relative;
overflow: hidden;
text-align:center;
}
#row_page .page_left,#row_page .page_right{
display:none;
padding: 0px;
margin: 0px;
display: block;
z-index: 15;
position: relative;
overflow: hidden;
float:left;
background-repeat: no-repeat;
background-position: center center;
background-image: url(../image/cmn/spinner_32.gif);
background-color: transparent;
}
#row_page .page_right{
float:right;
}
#row_page img{
padding: 0px 0px;
margin: 0px 0px;
border: 0px;
}
#row_page .bookmark {
display:none;
position: absolute;
top: -1px;
width: 26px;
height: 64px;
background-image: url(../image/cmn/bookmark_thumb.png);
background-repeat: no-repeat;
background-position: left top;
text-indent: -9999px;
}
* html #row_page .bookmark {
background-image: url(../image/cmn/bookmark_thumb.gif);
}
#row_page .page_left .bookmark{
left: 10px;
}
#row_page .page_right .bookmark{
right: 10px;
}
#row_page .hit_area {
position: absolute;
padding: 0px;
margin: 0px;
display: block;
z-index: 999;
overflow: hidden;
top:0px;
cursor:pointer;
border:1px solid #0f0;
background-color: #888;
filter: alpha(opacity=1);
-moz-opacity: 0.01;
opacity: 0.01;
}
#row_page .page_left .hit_area{
left: 0px;
}
#row_page .page_right .hit_area{
right: 0px;
}
/* ctrl_header
----------------------------------------------------------- */
#ctrl_header {
z-index: 999;
position: absolute;
}
#ctrl_header .leftpage {
float: left;
cursor: pointer;
display: none;
}
#ctrl_header .rightpage {
float: right;
cursor: pointer;
display: none;
}
#ctrl_header ul li {
margin-top: 24px;
float: left;
width: 75px;
height: 28px;
}
#ctrl_header ul li a {
display: block;
/*\*/overflow: hidden;/**/
width: 100%;
height: 100%;
background-image: url(../image/cmn/btn_ctrl.png);
background-repeat: no-repeat;
text-indent: -9999px;
}
* html #ctrl_header ul li a {
background-image: url(../image/cmn/btn_ctrl.gif);
}
#ctrl_header .leftpage .menu_bookmark a { background-position: 0 -56px;}
#ctrl_header .leftpage .menu_zoom a { background-position: 0 0;}
#ctrl_header .leftpage .menu_bookmark a:hover { background-position: -75px -56px;}
#ctrl_header .leftpage .menu_zoom a:hover { background-position: -75px 0;}
#ctrl_header .rightpage .menu_bookmark a { background-position: 0 -84px;}
#ctrl_header .rightpage .menu_zoom a { background-position: 0 0;}
#ctrl_header .rightpage .menu_bookmark a:hover { background-position: -75px -84px;}
#ctrl_header .rightpage .menu_zoom a:hover { background-position: -75px 0;}
/* ctrl_footer
----------------------------------------------------------- */
#ctrl_footer {
display:none;
z-index: 11;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 50px;
background-image: url(../image/cmn/menu_bgrep.gif);
background-repeat: repeat-x;
background-position: left top;
}
#ctrl_footer_inner {
position: relative;
min-width: 300px;
width: 100%;
height: 50px;
}
#navi {
width: 460px;
height: 50px;
margin: 0 auto;
padding: 0px;
padding-right: 1px;
cursor:pointer;
}
* html #navi {
width: 460px;
}
#navi li {
float: left;
width: 60px;
height: 50px;
padding-left: 2px;
background-image: url(../image/cmn/separator.gif);
background-repeat: no-repeat;
background-position: left center;
}
#navi li a {
display: block;
/*\*/overflow: hidden;/**/
width: 100%;
height: 100%;
background-repeat: no-repeat;
text-indent: -9999px;
}
.navi_left li a {
background-image: url(../image/cmn/btn_navi_left_binding.gif);
}
.navi_right li a {
background-image: url(../image/cmn/btn_navi_right_binding.gif);
}
#navi li#menu_page_jump { width: 80px;}
#navi li#menu_index_page a { background-position: 0 0;}
#navi li#menu_list_page a { background-position: -60px 0;}
#navi li#menu_page_top a { background-position: -120px 0;}
#navi li#menu_page_prev a { background-position: -180px 0;}
#navi li#menu_page_next a { background-position: -240px 0;}
#navi li#menu_page_last a { background-position: -300px 0;}
#navi li#menu_auto_play a { background-position: -360px 0;}
#navi li#menu_print a { background-position: -500px 0;}
#navi li#end_dummy a { background: none;}
#navi li#end_dummy { width:1px;}
#navi li#menu_index_page a:hover { background-position: 0 -50px;}
#navi li#menu_list_page a:hover { background-position: -60px -50px;}
#navi li#menu_page_top a:hover { background-position: -120px -50px;}
#navi li#menu_page_prev a:hover { background-position: -180px -50px;}
#navi li#menu_page_next a:hover { background-position: -240px -50px;}
#navi li#menu_page_last a:hover { background-position: -300px -50px;}
#navi li#menu_auto_play a:hover { background-position: -360px -50px;}
#navi li#menu_print a:hover { background-position: -500px -50px;}
#navi li#menu_auto_play.now_playing a { background-position: -360px -50px;}
#pager_bar_pagelist {
z-index: 10;
position: absolute;
display: block;
float: none;
width: 80px;
height: 46px;
margin: 0;
padding: 0;
background-image: url(../image/cmn/btn_navi_left_binding.gif);
background-repeat: no-repeat;
text-align: center;
}
* html #pager_bar_pagelist {
width: 80px;
height: 40px;
padding-top: 4px;
}
#pager_bar_pagelist { background-position: -420px 0;}
#pager_bar_pagelist:hover { background-position: -420px -50px;}
#pager_bar_pagelist select {
height: 20px;
margin: 8px auto;
padding: 1px 2px;
text-align: center;
}
* html #pager_bar_pagelist select {
margin: 0px auto;
padding: 0px 2px;
}
#page_title {
position: absolute;
left : 15px;
top: 0;
width: 140px;
height: 12px;
margin-top: 8px;
padding: 8px;
background-image: url(../image/cmn/title_bg.gif);
background-repeat: no-repeat;
background-position: left top;
line-height: 1;
font-size: 12px;
overflow:hidden;
}
#page_title span{
height: 12px;
width: 140px;
overflow:hidden;
display:block;
white-space:nowrap;
}
#poweredby {
position: absolute;
right : 0;
top: 0;
height: 12px;
margin: 2px 0;
padding: 17px;
background-image: url(../image/cmn/separator.gif);
background-repeat: no-repeat;
background-position: left center;
line-height: 1;
font-size: 12px;
color:#ccc;
}
/* print_area
----------------------------------------------------------- */
.mask_layer {
z-index: 9900;
position: absolute;
top: 0;
display: none;
width: 100%;
height: 100%;
background-color: #111111;
filter: alpha(opacity=90);
-moz-opacity: 0.90;
opacity: 0.90;
}
#print_layer {
z-index: 9999;
position: absolute;
top: 0;
display: none;
width: 100%;
height: 100%;
}
#print_area {
position: absolute;
left: 50%;
top: 50%;
margin-top: -110px;
margin-left: -150px;
width: 298px;
height: 218px;
background-color: #080808;
border: 1px solid #707070;
}
#print_area #select_area {
width: 260px;
margin: 9px auto;
}
#print_area #select_area li {
padding-top: 6px;
}
#print_area #print_all {
width: 260px;
}
#print_area #print_left {
float: left;
width: 125px;
}
#print_area #print_right {
float: right;
width: 125px;
}
#print_area #select_area li a {
display: block;
width: 100%;
height: 100%;
border: 1px solid #707070;
background-color: #4d4d4d;
}
#print_area #select_area li.select a,
#print_area #select_area li a:hover {
border: 1px solid #219ec5;
}
#ctrl_print {
clear: both;
position:absolute;
bottom:4px;
width: 260px;
margin: 0 14px;
padding: 6px;
}
#ctrl_print li {
position:relative;
width: 75px;
height: 28px;
}
#ctrl_print li.cancel {float: left;}
#ctrl_print li.print { float: right;}
#ctrl_print li a {
position:relative;
display: block;
/*\*/overflow: hidden;/**/
width: 75px;
height: 25px;
background-image: url(../image/cmn/btn_ctrl.png);
background-repeat: no-repeat;
text-indent: -9999px;
}
* html #ctrl_print li a {
background-image: url(../image/cmn/btn_ctrl.gif);
}
#ctrl_print li.cancel a { background-position: 0 -112px;}
#ctrl_print li.print a { background-position: 0 -140px;}
#ctrl_print li.cancel a:hover { background-position: -75px -112px;}
#ctrl_print li.print a:hover { background-position: -75px -140px;}
#print_page{
position: relative;
display: none;
width: 1024px;
}
#print_page .page_left,#print_page .page_right{
position: relative;
display: block;
float: left;
}
#print_page img,#print_page img{
width: 500px;
}
/* contents header
----------------------------------------------------------- */
/* contents navi */
#contents_navi {
float: left;
margin: 10px 0 0;
}
#contents_navi ul {
margin: 0;
}
#contents_navi li {
float: left;
width: 75px;
height: 33px;
margin: 0 5px 0 0;
}
#contents_navi a {
display: block;
/*\*/overflow: hidden;/**/
width: 75px;
height: 24px;
padding: 8px 0 0;
background-image: url(../image/cmn/btnbg.png);
background-repeat: no-repeat;
background-position: left top ;
text-align: center;
font-size: 12px;
color: #ababab;
}
* html #contents_navi a {
background-image: url(../image/cmn/btnbg.gif);
background-color:#333;
}
#contents_navi a:hover ,
#contents_navi a.active{
background-position: -75px 0;
color: #FFFFFF;
}
/* searcher */
#searcher {
float: right;
width: 400px;
padding-top:4px;
}
#searcher p {
margin: 20px 0 0;
color: #FFFFFF;
}
#searcher div {
position: relative;
height: 34px
}
#keywords {
position: absolute;
left: 0;
top: 0;
width: 319px;
height: 34px;
background: #FFFFFF;
border: 1px solid #383838;
border-right: none;
font-size: 16px;
color: #000000;
}
#btn_search {
position: absolute;
left: 320px;
top: 0;
}
#btn_clear {
position: absolute;
left: 368px;
top: 6px;
}
/* pager
----------------------------------------------------------- */
#pager {
clear: both;
border-top: 1px solid #656565;
font-size: 1.2em;
color: #ababab;
}
/* page number */
#num_page {
float: left;
}
#num_page p {
float: left;
margin: 15px 0 0;
}
#num_page ul {
display: inline;
float: left;
margin: 15px 0 0 25px;
}
#num_page ul li {
display: inline;
padding: 0 2px;
font-size: 1.2em;
}
#num_page ul li a {
color: #009bdb;
}
/* number of items */
#num_item {
float: right;
margin: 10px 0 0;
}
/* canvas */
#l_canvas{
top:0px;
width: 100%;
z-index:100;
position: absolute;
padding: 0px;
margin:0px auto;
display: none;
background-image: url(../image/cmn/scrbg.gif);
background-repeat: repeat;
background-color: transparent;
}
#l_canvas #l_canvasbase{
display:block;
width:100%;
margin-top: 0px;
height: 100%;
background-repeat: no-repeat;
background-position: center center;
background-image: url(../image/cmn/spinner_32.gif);
background-color: transparent;
cursor:move;
text-align:center;
}
#l_canvasimg{
overflow: hidden;
display: block;
position: relative;
margin-top: 0px;
height: 100%;
}
#l_img{
display: block;
position: relative;
}
/* peephole
----------------------------------------------------------- */
#zoommap_wind {
z-index: 9999;
position: absolute;
right: 30px;
bottom: 30px;
background-color: #555;
border: 1px solid #222;
padding:15px 5px 5px 5px;
filter: alpha(opacity=90);
-moz-opacity:0.90;
opacity:0.90;
top:0px;
left:0px;
display:none;
}
#zoommap_wind img {
background-repeat: no-repeat;
background-position: left top;
position: absolute;
display:block;
filter: alpha(opacity=100);
-moz-opacity:1.00;
opacity:1.00;
padding:0px;
margin:0px;
}
#zoommap_wind #zoom_targetgrid{
position: relative;
display:block;
width: 100px;
height: 100px;
background-color: #444;
padding:0px;
margin:0px;
filter: alpha(opacity=50);
-moz-opacity:0.50;
opacity:0.50;
}
/* progressbar
----------------------------------------------------------- */
.ui-progressbar-value {
background-image: url(../image/cmn/pbar.gif);
height:16px;
}
#progressbar{
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
}
/* contents list
----------------------------------------------------------- */
#contents_thumblist {
clear: both;
}
#contents_thumblist ul {
min-width: 860px;
margin-left:-10px;
}
* html #contents_thumblist ul {
width: 860px;
}
#contents_thumblist ul li div{
position: relative;
display:block;
padding:0px 0;
margin:0 auto;
overflow:hidden;
}
#contents_thumblist ul li {
position: relative;
float: left;
width: 150px;
margin: 16px 10px 10px 10px;
}
#contents_thumblist ul li a.page_img {
display: block;
width: 128px;
height: 96px;
padding: 12px 10px;
border: 1px solid #656565;
background-color: #2a2a2a;
background-image: url(../image/cmn/contents_listbg.gif);
background-repeat: no-repeat;
background-position: center center;
text-align: center;
vertical-align:middle;
position:relative;
overflow:hidden;
}
#contents_thumblist ul li a.page_img:hover {
border: 1px solid #39aee5;
}
#contents_thumblist ul li a.page_img img.page_left,
#contents_thumblist ul li a.page_img img.page_right {
max-width:64px;
max-height:96px;
}
#contents_thumblist ul li a.page_img img.page_left {
display:block;
float:left;
}
#contents_thumblist ul li a.page_img img.page_right {
float:right;
}
#page_thumb_base .bookmark ,
#contents_thumblist ul li .bookmark {
position: absolute;
left: 10px;
top: -1px;
width: 26px;
height: 64px;
background-image: url(../image/cmn/bookmark_thumb.png);
background-repeat: no-repeat;
background-position: left top;
text-indent: -9999px;
}
* html #page_thumb_base .bookmark ,
* html #contents_thumblist ul li .bookmark {
background-image: url(../image/cmn/bookmark_thumb.gif);
}
#page_thumb_base .bookmarkr ,
#contents_thumblist ul li .bookmarkr {
position: absolute;
right: 10px;
top: -1px;
width: 26px;
height: 64px;
background-image: url(../image/cmn/bookmark_thumb.png);
background-repeat: no-repeat;
background-position: left top;
text-indent: -9999px;
}
* html #page_thumb_base .bookmarkr ,
* html #contents_thumblist ul li .bookmarkr {
background-image: url(../image/cmn/bookmark_thumb.gif);
}
#page_thumb_base p ,
#contents_thumblist ul li p {
line-height: 16px;
height: 16px;
overflow:hidden;
margin: 0px 0 0;
padding: 0 14px 0 0;
background-image: url(../image/cmn/bullet_thumb.png);
background-repeat: no-repeat;
background-position: right 2px;
}
* html #page_thumb_base p ,
* html #contents_thumblist ul li p {
background-image: url(../image/cmn/bullet_thumb.gif);
}
#contents_thumblist ul li p a.page_title {
font-size: 10px;
line-height: 16px;
color: #ababab;
}
#contents_thumblist ul li p a.page_title span {
padding-right: 5px;
}
/* contents list
----------------------------------------------------------- */
#contents_list {
clear:both;
padding: 4px 0 0;
display: block;
}
#xcontents_list:after{
content:'.';
visibility:hidden;
clear:both;
height:1px;
display:block;
}
#contents_list .column {
float: left;
width: 50%;
}
#contents_list ul {
padding: 0 ;
display: block;
position: relative;
width:100%;
}
#contents_list ul span{
display:inline;
position:relative;
}
#contents_list ul li {
position: relative;
display: block;
float: left;
width: 44%;
height: 25px;
margin: 11px 0 0 20px;
}
#page_list_base a ,
#contents_list ul li a {
overflow:hidden;
margin: 0px 0 0;
display: block;
height: 23px;
padding: 0 20px 0 30px;
background-color: #2a2a2a;
border: 1px solid #656565;
background-image: url(../image/cmn/bullet_list.png);
background-repeat: no-repeat;
background-position: right center;
line-height: 23px;
color: #ababab;
}
* html #page_list_base a ,
* html #contents_list ul li a {
background-image: url(../image/cmn/bullet_list.gif);
}
#contents_list ul li a:hover {
border: 1px solid #39aee5;
}
#page_list_base .bookmark ,
#contents_list ul li .bookmark {
position: absolute;
left: 4px;
top: -1px;
width: 13px;
height: 32px;
background-image: url(../image/cmn/bookmark_list.png);
background-repeat: no-repeat;
background-position: left top;
text-indent: -9999px;
}
* html #page_list_base .bookmark ,
* html #contents_list ul li .bookmark {
background-image: url(../image/cmn/bookmark_list.gif);
}
/* contents list
----------------------------------------------------------- */
#narrowContentsPageList {
clear: both;
padding: 19px 0 ;
overflow:auto;
height:auto;
}
#narrowContentsPageList ul {
padding: 0 2% 0 2%;
}
#narrowContentsPageList ul span{
position:relative;
}
#narrowContentsPageList ul li {
position: relative;
width: 100%;
height: 25px;
margin: 11px 0 0 0;
}
#narrowContentsPageList ul li a {
overflow:hidden;
margin: 0px 0 0;
display: block;
height: 23px;
padding: 0 20px 0 30px;
background-color: #2a2a2a;
border: 1px solid #656565;
background-image: url(../image/cmn/bullet_list.png);
background-repeat: no-repeat;
background-position: right center;
line-height: 23px;
color: #ababab;
}
* html #narrowContentsPageList ul li a {
background-image: url(../image/cmn/bullet_list.gif);
}
#narrowContentsPageList ul li a.active {
border: 1px solid #39aee5;
}
#narrowContentsPageList ul li .bookmark {
position: absolute;
left: 4px;
top: -1px;
width: 13px;
height: 32px;
background-image: url(../image/cmn/bookmark_list.png);
background-repeat: no-repeat;
background-position: left top;
text-indent: -9999px;
}
* html #narrowContentsPageList ul li .bookmark {
background-image: url(../image/cmn/bookmark_list.gif);
}
/* html5 toolbar style
----------------------------------------------------------- */
@media screen and (max-width: 1000px) {
.html5 ul#navi ,
ul#navi {
padding-left: 160px;
}
}
.html5 #ctrl_footer {
overflow: hidden;
}
.html5 #navi {
width: auto;
height: 50px;
margin: 0 auto;
padding: 0px;
padding-right: 1px;
cursor: default;
}
#navi li#menu_download {
display: none;
}
#navi li.disable {
opacity: 0.3;
}
.html5 #navi li:hover {
background-color: rgba(255,255,255,0.2);
}
.html5 #navi li.disable:hover, #navi li.disable:hover {
background-color: transparent;
}
#navi li.disable, #navi li.disable a {
cursor: default;
}
.html5 #navi li {
float: left;
width: 60px;
height: 50px;
padding-left: 2px;
position: relative;
overflow: hidden;
cursor: pointer;
}
.html5 #navi li a {
display: block;
text-indent: 0px;
position: relative;
width: 60px;
height: 50px;
background-image: none;
opacity: 0.8;
}
.html5 #navi li a:hover:before, .html5 #navi li a:hover:after, .html5 #navi li a:hover {
text-decoration: none;
}
.html5 #pager_bar_pagelist:after, .html5 #navi li a:before, .html5 #navi li a:after {
margin: 0;
padding: 0;
border: 0;
clear: both;
display: block;
position: absolute;
}
.html5 #navi li a:before {
content: '';
top: 4px;
background-image: url(../image/cmn/btn_navi_base2.png);
background-position: 0 0px;
width: 32px;
height: 32px;
text-align: center;
margin: 0 14px;
background-size: auto 32px;
}
.html5 #pager_bar_pagelist:after, .html5 #navi li a:after {
content: '';
height: 12px;
width: 60px;
color: #fff;
line-height: 11px;
font-size: 11px;
font-weight: 500;
bottom: 3px;
text-align: center;
}
.html5 #navi li#end_dummy {
background: none;
overflow: hidden;
}
.html5 #navi li#end_dummy a:hover, .html5 #navi li#end_dummy a {
cursor: default;
}
.html5 #navi li#menu_index_page a:before {
background-position: -160px 0;
}
.html5 #navi li#menu_list_page a:before {
background-position: -192px 0;
}
.html5 #navi li#menu_page_top a:before {
background-position: 0px 0;
}
.html5 #navi li#menu_page_prev a:before {
background-position: -32px 0;
}
.html5 #navi li#menu_page_next a:before {
background-position: -64px 0;
}
.html5 #navi li#menu_page_last a:before {
background-position: -96px 0;
}
.html5 #navi li#menu_auto_play a:before {
background-position: -128px 0;
}
.html5 #navi li#menu_print a:before {
background-position: -256px 0;
}
.html5 #navi li#menu_download a:before {
background-position: -224px 0;
}
.html5 #navi li#menu_page_jump span:after {
content: 'Jump';
}
.html5 #navi li#menu_index_page a:after {
content: 'Index';
}
.html5 #navi li#menu_list_page a:after {
content: 'List';
}
.html5 #navi li#menu_page_top a:after {
content: 'Top';
}
.html5 #navi li#menu_page_prev a:after {
content: 'Prev';
}
.html5 #navi li#menu_page_next a:after {
content: 'Next';
}
.html5 #navi li#menu_page_last a:after {
content: 'Last';
}
.html5 #navi li#menu_auto_play a:after {
content: 'Play';
}
.html5 #navi li#menu_print a:after {
content: 'Print';
}
.html5 #navi li#menu_download a:after {
content: 'Download';
}
.html5 .navi_right li#menu_page_top a:after {
content: 'Last' !important;
}
.html5 .navi_right li#menu_page_prev a:after {
content: 'Next' !important;
}
.html5 .navi_right li#menu_page_next a:after {
content: 'Prev' !important;
}
.html5 .navi_right li#menu_page_last a:after {
content: 'Top' !important;
}
.html5 #navi li#menu_auto_play.now_playing {
background-color: rgba(255,255,255,0.2);
}
.html5 #navi li#menu_page_jump {
width: 80px;
overflow: hidden;
}
.html5 #pager_bar_pagelist {
z-index: 10;
margin: 0;
padding: 0;
position: relative;
display: block;
width: 80px;
height: 50px;
text-align: center;
background: none;
}
.html5 #pager_bar_pagelist:after {
width: 80px !important;
}
.html5 #pager_bar_pagelist select {
height: 20px;
margin: 8px auto;
padding: 1px 2px;
text-align: center;
}
.html5 #page_title {
position: absolute;
left: 15px;
top: 0;
width: 140px;
height: 12px;
margin-top: 8px;
padding: 8px;
line-height: 1;
font-size: 12px;
overflow: hidden;
}
.html5 #page_title span {
height: 12px;
width: 140px;
overflow: hidden;
display: block;
white-space: nowrap;
}
.html5 #poweredby {
position: absolute;
background-repeat: no-repeat;
background-position: left center;
}
#navi li#menu_download a { background-position: -560px 0;}
#navi li#menu_download a:hover { background-position: -560px -50px;}
/* added style
----------------------------------------------------------- */
/* link map sample class */
.linkmapclass {
z-index: 999;
border: none;
background-color: #337733;
-moz-opacity: 0.1;
opacity: 0.1;
cursor: pointer;
}
._clickhover {
z-index: 9999;
border: none;
background-color: #777777;
-moz-opacity: 0.30;
opacity: 0.30;
cursor: pointer;
}
.linkmapclass{
filter: alpha(opacity=20);
}
._clickhover{
filter: alpha(opacity=30);
}
.youtube_rect{
filter: alpha(opacity=100);
opacity: 1;
}
/* optional layer
---------------------------------------------------------------*/
.disp_optional_layer #sub_contents_frame {
display: none !important;
}
.disp_optional_layer #sub_contents_block {
display: block !important;
}
.disp_optional_layer #download_frame {
display: none !important;
}
.disp_optional_layer .mask_layer {
display: block !important;
}
.disp_sub_frame_layer #sub_contents_frame {
display: block !important;
}
.disp_sub_frame_layer #sub_contents_block {
display: none !important;
}
.disp_sub_frame_layer .mask_layer {
display: block !important;
}
#sub_contents_block {
position: absolute;
z-index: 10000;
padding: 0px;
width: 100%;
height: 100%;
overflow: hidden;
}
#sub_contents_block .close {
position: absolute;
z-index: 10000;
top: 4%;
right: 5%;
width: 75px;
height: 28px;
padding: 0;
margin: 0;
}
#sub_contents_block_area {
position: absolute;
margin: 0 auto;
padding: 5%;
width: 90%;
height: 80%;
}
/* download layer
---------------------------------------------------------------*/
.disp_download_layer #sub_contents_frame {
display: none ;
}
.disp_download_layer #sub_contents_block_area{
display: none ;
}
.disp_download_layer #sub_contents_block .close {
display: none ;
}
.disp_download_layer #sub_contents_block {
display: block !important;
}
.disp_download_layer .mask_layer {
display: block !important;
}
.disp_download_layer #download_frame {
display: block;
}
#download_frame {
position: absolute;
left: 50%;
top: 50%;
margin-top: -110px;
margin-left: -150px;
width: 298px;
height: 188px;
background-color: #080808;
border: 1px solid #707070;
}
#download_area {
width: 260px;
margin: 9px auto;
}
#download_select_area .download_select2 {
width: 260px;
}
#download_select_area li {
padding-top: 6px;
}
#download_select_area .download_select {
width: 125px;
height: 73px;
}
#download_select_area #download_left {
float: left;
}
#download_select_area #download_right {
float: right;
}
#download_select_area li.download_select2 {
clear: both;
padding-top: 8px;
}
#download_select_area .download_select2 a {
display: block;
line-height: 30px;
font-size: 13px;
font-weight: bold;
color: #fff;
text-align: center;
}
#download_select_area .download_select2 a:link, #download_select_area .download_select2 a:visited {
text-decoration: none;
}
#download_select_area {
width: 260px;
margin: 9px auto;
}
#download_select_area li a {
display: block;
width: 100%;
height: 100%;
border: 1px solid #707070;
background-color: #4D4D4D;
}
#download_select_area li.select a, #download_select_area li a:hover {
border: 1px solid #219EC5;
}
#download_ctrl {
clear: both;
position: absolute;
bottom: 4px;
width: 260px;
margin: 0 14px;
padding: 6px;
}
#download_ctrl li {
text-align: center;
width: auto;
height: 25px;
}
#download_ctrl li.download_cancel {
float: left;
}
#download_ctrl li.download_submit {
float: right;
}
#download_ctrl li a {
display: block;
width: 90px;
height: 25px;
border: #c0c0c0 1px solid;
background: #f0f0f0;
color: #484848;
font-size: 11px;
font-weight: bold;
line-height: 25px;
text-indent: 0;
}
#download_ctrl li a:link, #download_ctrl li a:visited {
text-decoration: none;
}
body.resize {
overflow:hidden;
height: 100%;
width: 100%;
zoom: 1;
display:block;
}
body.resize scrwindow ,
body.resize sub_scrwindow {
display: none;
}
/**/
.html5 #ctrl_print .cancel a,
.html5 #ctrl_print .print a,
.html5 .menu_back a,
.html5 .button {
-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
box-shadow:inset 0px 1px 0px 0px #ffffff;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f7f7f7), color-stop(1, #dfdfdf) );
background:-moz-linear-gradient( center top, #f7f7f7 5%, #dfdfdf 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#dfdfdf');
background-color:#f7f7f7;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
border:1px solid #dcdcdc;
display:inline-block;
color:#777777;
font-family:arial;
font-size:11px;
font-weight:bold;
text-decoration:none;
text-shadow:1px 1px 0px #ffffff;
background-image:none !important;
position:relative;
}
.html5 #download_ctrl a:hover,
.html5 #ctrl_print .cancel a:hover,
.html5 #ctrl_print .print a:hover,
.html5 .close .menu_back a:hover,
.html5 .classname:hover {
background-color:#d8d8d8;
}
.html5 #ctrl_print .cancel a,
.html5 #ctrl_print .print a,
.html5 .close .menu_back a
{
height:20px !important;
width:66px !important;
}
.html5 #ctrl_print .cancel a:after,
.html5 #ctrl_print .print a:after,
.html5 .close .menu_back a:after{
display:block;
position:absolute;
height:20px !important;
width:66px !important;
bottom:2px;
left:0px;
text-align:center;
vertical-align:baseline;
color:#777777;
text-indent:0;
font-size:12px;
line-height:24px;
}
.html5 .close .menu_back a:after{
content:'Back';
}
.html5 #ctrl_print .cancel a:after{
content:'Cancel';
}
.html5 #ctrl_print .print a:after{
content:'Print';
}
/**/
.html5 #navi_menu_thumb a,
.html5 #navi_menu_list a{
background:none !important;
border-top:2px solid #aaaaaa;
}
.html5 #navi_menu_thumb a.active,
.html5 #navi_menu_list a.active{
border-top:2px solid #1090c5;
}
.html5 #navi_menu_thumb,
.html5 #navi_menu_list{
background: rgb(109,109,109);
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzZkNmQ2ZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjYwJSIgc3RvcC1jb2xvcj0iIzBlMGUwZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(top, rgba(109,109,109,1) 0%, rgba(14,14,14,1) 60%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(109,109,109,1)), color-stop(60%,rgba(14,14,14,1)));
background: -webkit-linear-gradient(top, rgba(109,109,109,1) 0%,rgba(14,14,14,1) 60%);
background: -o-linear-gradient(top, rgba(109,109,109,1) 0%,rgba(14,14,14,1) 60%);
background: -ms-linear-gradient(top, rgba(109,109,109,1) 0%,rgba(14,14,14,1) 60%);
background: linear-gradient(to bottom, rgba(109,109,109,1) 0%,rgba(14,14,14,1) 60%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d6d6d', endColorstr='#0e0e0e',GradientType=0 );
}
.html5 #page_list_base a,
.html5 #contents_list ul li a,
.html5 #page_thumb_base p,
.html5 #contents_thumblist ul li p{
background:none !important;
}
.html5 #download_select_area #download_left a img,
.html5 #download_select_area #download_right a img {
display:none;
}
.html5 #download_select_area #download_left a {
background: url(../image/cmn/print_area_left_2.gif) no-repeat 0 0;
background-size:cover;
}
.html5 #download_select_area #download_right a {
background: url(../image/cmn/print_area_right_2.gif) no-repeat 0 0;
background-size:cover;
}
.html5 #print_area #print_all a img,
.html5 #print_area #print_left a img,
.html5 #print_area #print_right a img{
display:none;
}
.html5 #print_area #print_left a,
.html5 #print_area #print_right a{
background-size:cover;
background-position:0 0;
background-repeat:no-repeat;
width:125px;
height:73px;
}
.html5 #print_area #print_left a{
background-image: url(../image/cmn/print_area_left_2.gif) ;
}
.html5 #print_area #print_right a{
background-image: url(../image/cmn/print_area_right_2.gif) ;
}
.html5 #print_area #print_all a{
background-image: url(../image/cmn/print_area_all_2.gif) ;
background-size:cover;
height:73px;
width:100%;
}
/*.html5 li.menu_bookmark a,
.html5 li.menu_zoom a,*/
/*.html5 li.menu_bookmark a:after,
.html5 li.menu_zoom a:after,*/
.html5 li.menu_bookmark a,
.html5 li.menu_zoom a{
height:28px !important;
width:48px !important;
background-color:rgba(44,44,44,0.8);
border-radius:1px;
border:1px solid #000;
display:inline-block;
color:#777777;
text-decoration:none;
background-image:none !important;
position:relative;
}
.html5 #ctrl_header .rightpage li a{
margin-left:7px;
}
.html5 #ctrl_header .leftpage li a{
margin-left:0px;
}
.html5 li.menu_bookmark a:hover,
.html5 li.menu_zoom a:hover{
background-color: rgba(99,99,99,0.8);
}
.html5 li.menu_bookmark a:after,
.html5 li.menu_zoom a:after{
content:' ';
background-image: url(../image/cmn/btn_navi_base2.png);
background-size: auto 28px;
background-repeat:no-repeat;
width: 28px;
height: 28px;
left:10px;
top:0px;
display:block;
position:absolute;
opacity:0.8;
}
.html5 li.menu_bookmark a:after{
background-position: -308px -1px;
}
.html5 li.menu_zoom a:after{
background-position: -252px -1px;
}
.html5 #ctrl_header ul li {
margin-top: 6px;
float: left;
width: 56px;
height: 30px;
}
/* narrow mode style
----------------------------------------------------------- */
html {
overflow: hidden;
-ms-content-zooming: none; /* Disable pan/zoom */
}
#narrowTools{
width:100%;
height:100%;
position:absolute;
left:0;
top:0;
z-index:100;
background:rgba(0,0,0,0.4);
display:block;
zoom:1.0;
}
#narrowTools_b_left ,
#narrowTools_b_right {
position:absolute;
top:0;
margin-top:0px
}
#narrowTools_b_top,
#narrowTools_b_bottom{
position:absolute;
}
#narrowTools_b_top { top:0;}
#narrowTools_b_left { left:0;}
#narrowTools_b_right{ right:0;}
#narrowTools_b_bottom{ bottom:0;}
#narrowTools ul{
margin: 0 auto;
padding: 0px;
position:relative;
margin:0;
border:none;
}
#narrowTools li{
cursor:pointer;
float: left;
width: 48px;
height: 48px;
position:relative;
overflow:hidden;
border:none;
margin:8px;
padding:0px;
position:relative;
}
#narrowTools li:after{
content:"";
display:block;
position:absolute;
background-image: url(../image/cmn/btn_navi_base2.png);
padding:0px;
margin:0px;
width: 48px;
height: 48px;
background-size:auto 48px;
background-repeat:no-repeat;
top:0px;
left:0px;
}
#narrowTools li.disable{
opacity:0.1;
cursor:default;
}
#narrowTools .narrowTools_h_item_1{
width:64px;
}
#narrowTools .narrowTools_h_item_2{
width:160px;
}
#narrowTools .narrowTools_h_item_3{
width:240px;
}
#narrowTools .narrowTools_v_item_1{
height:80px;
}
#narrowTools .narrowTools_v_item_2{
height:160px;
}
#narrowTools .narrowTools_v_item_3{
height:240px;
}
#narrowTools_b_left ul,
#narrowTools_b_right ul{
width: 64px;
height:100%;
margin: 0;
}
#narrowTools_b_top ,
#narrowTools_b_bottom {
width:100%;
}
#narrowTools_b_top ul,
#narrowTools_b_bottom ul{
height: 64px;
margin:0 auto;
}
.narrowTools_fix
#narrowTools_b_bottom ul{
}
#narrowTools_b_top ul{
width:64px;
}
.narrowTools_zoom
#narrowTools_b_bottom ul{
display:none;
}
li#narrowTools_top:after { background-position: 0px 0;}
li#narrowTools_left { top:50%;margin-top:-48px; position:fixed;left:0;}
li#narrowTools_left:after { background-position: -48px 0;}
li#narrowTools_right { top:50%;margin-top:-48px; position:fixed;right:0;}
li#narrowTools_right:after { background-position: -96px 0;}
li#narrowTools_last:after { background-position: -144px 0;}
li#narrowTools_play:after { background-position: -192px 0;}
li#narrowTools_index:after { background-position: -240px 0;}
li#narrowTools_list:after { background-position: -288px 0;}
li#narrowTools_download:after{ background-position: -336px 0;}
li#narrowTools_print:after { background-position: -384px 0;}
li#narrowTools_zoomin:after { background-position: -432px 0;}
li#narrowTools_zoomout:after{ background-position: -480px 0;}
.narrowTools_fix #narrowTools_zoomout{display:none;}
.narrowTools_zoom #narrowTools_zoomin {display:none;}
.narrowTools_zoom #narrowTools_list {display:none;}
.narrowTools_zoom #narrowTools_download{display:none;}
/* toolbar added style
----------------------------------------------------------- */
.html5 #ctrl_footer {
background: rgba(44,44,44,0.8);
border-top:1px solid black;
}
.html5 #navi li ,
.html5 .navi_left li a ,
.html5 .navi_right li a ,
.html5 #pager_bar_pagelist {
background-image: none;
}
.html5 #navi li {
border-left:1px solid rgba(0,0,0,0.2);
}
.html5 #page_title {
background-image: none;
border : 1px solid #2f2f2f;
margin:10px;
padding : 0px;
width : 153px;
height : 29px;
}
.html5 #page_title span{
background : #efefef;
border : 1px solid #8e8e8e;
width : 143px;
height : 15px;
margin:0px;
padding : 6px 4px;
color: #000;
font-size:12px;
line-height:12px;
background-image: none;
overflow:hidden;
display:block;
}
.html5 #poweredby {
background-image: none;
height:50px;
padding:0;
margin:0;
overflow:hidden;
border-left:1px solid rgba(0,0,0,0.5);
}
.html5 #poweredby a{
vertical-align:middle;
display:block;
position:relative;
height:50px;
padding:20px;
margin:0;
text-align:center;
font-size:12px;
color:#fff;
background-position: center center;
background-repeat: no-repeat;
overflow:hidden;
}
.html5 #poweredby span{
display:none;
}