You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
802 lines
15 KiB
802 lines
15 KiB
/* ==========================================================================
|
|
HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
|
|
========================================================================== */
|
|
|
|
html,
|
|
button,
|
|
input,
|
|
select,
|
|
textarea {
|
|
color: #222;
|
|
}
|
|
|
|
body {
|
|
font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Osaka","メイリオ","ＭＳ Ｐゴシック","Helvetica",arial,sans-serif;
|
|
font-size: 1em;
|
|
line-height: 1.4;
|
|
}
|
|
/*テキストを選択した時の色*/
|
|
::-moz-selection {
|
|
background: #b3d4fc;
|
|
text-shadow: none;
|
|
}
|
|
|
|
::selection {
|
|
background: #b3d4fc;
|
|
text-shadow: none;
|
|
}
|
|
|
|
hr {
|
|
display: block;
|
|
margin: 1em 0;
|
|
padding: 0;
|
|
height: 1px;
|
|
border: 0;
|
|
border-top: 1px solid #ccc;
|
|
}
|
|
|
|
img {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
fieldset {
|
|
margin: 0;
|
|
padding: 0;
|
|
border: 0;
|
|
}
|
|
|
|
textarea {
|
|
resize: vertical;
|
|
}
|
|
|
|
.chromeframe {
|
|
margin: 0.2em 0;
|
|
padding: 0.2em 0;
|
|
background: #ccc;
|
|
color: #000;
|
|
}
|
|
|
|
|
|
/* ==========================================================================
|
|
Author's custom styles
|
|
========================================================================== */
|
|
|
|
.w10{ width: 10%;}
|
|
.w20{ width: 20%;}
|
|
.w25{ width: 25%;}
|
|
.w30{ width: 30%;}
|
|
.w33{ width: 33%;}
|
|
.w40{ width: 40%;}
|
|
.w50{ width: 50%;}
|
|
.w60{ width: 60%;}
|
|
.w70{ width: 70%;}
|
|
.w80{ width: 80%;}
|
|
.w90{ width: 90%;}
|
|
.w100{ width: 100%;}
|
|
|
|
img{max-width: 100%; height: auto;}
|
|
|
|
|
|
|
|
|
|
/* ==========================================================================
|
|
Helper classes
|
|
========================================================================== */
|
|
|
|
.ir {
|
|
overflow: hidden;
|
|
border: 0;
|
|
background-color: transparent;
|
|
*text-indent: -9999px;
|
|
}
|
|
|
|
.ir:before {
|
|
display: block;
|
|
width: 0;
|
|
height: 100%;
|
|
content: "";
|
|
}
|
|
|
|
.visuallyhidden {
|
|
position: absolute;
|
|
overflow: hidden;
|
|
clip: rect(0 0 0 0);
|
|
margin: -1px;
|
|
padding: 0;
|
|
width: 1px;
|
|
height: 1px;
|
|
border: 0;
|
|
}
|
|
|
|
.visuallyhidden.focusable:active,
|
|
.visuallyhidden.focusable:focus {
|
|
position: static;
|
|
overflow: visible;
|
|
clip: auto;
|
|
margin: 0;
|
|
width: auto;
|
|
height: auto;
|
|
}
|
|
|
|
.invisible {
|
|
visibility: hidden;
|
|
}
|
|
|
|
.clearfix:before,
|
|
.clearfix:after {
|
|
display: table;
|
|
content: " ";
|
|
}
|
|
|
|
.clearfix:after {
|
|
clear: both;
|
|
}
|
|
|
|
.clearfix {
|
|
*zoom: 1;
|
|
}
|
|
|
|
.flr{
|
|
float: right;
|
|
|
|
}
|
|
|
|
/* ==========================================================================
|
|
Print styles
|
|
========================================================================== */
|
|
|
|
@media print {
|
|
* {
|
|
background: transparent !important;
|
|
box-shadow:none !important;
|
|
color: #000 !important; /* Black prints faster: h5bp.com/s */
|
|
text-shadow: none !important;
|
|
}
|
|
|
|
a,
|
|
a:visited {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
a[href]:after {
|
|
content: " (" attr(href) ")";
|
|
}
|
|
|
|
abbr[title]:after {
|
|
content: " (" attr(title) ")";
|
|
}
|
|
|
|
/*
|
|
* Don't show links for images, or javascript/internal links
|
|
*/
|
|
|
|
.ir a:after,
|
|
a[href^="javascript:"]:after,
|
|
a[href^="#"]:after {
|
|
content: "";
|
|
}
|
|
|
|
pre,
|
|
blockquote {
|
|
border: 1px solid #999;
|
|
page-break-inside: avoid;
|
|
}
|
|
|
|
thead {
|
|
display: table-header-group; /* h5bp.com/t */
|
|
}
|
|
|
|
tr,
|
|
img {
|
|
page-break-inside: avoid;
|
|
}
|
|
|
|
img {
|
|
max-width: 100% !important;
|
|
}
|
|
|
|
@page {
|
|
margin: 0.5cm;
|
|
}
|
|
|
|
p,
|
|
h2,
|
|
h3 {
|
|
orphans: 3;
|
|
widows: 3;
|
|
}
|
|
|
|
h2,
|
|
h3 {
|
|
page-break-after: avoid;
|
|
}
|
|
}
|
|
/*utility*/
|
|
.txt_small{
|
|
font-size: 85%;
|
|
}
|
|
|
|
.txt_normal{
|
|
font-size: 100%;
|
|
}
|
|
|
|
.txt_large{
|
|
font-size: 120%;
|
|
}
|
|
.txt_xlarge{
|
|
font-size: 150%;
|
|
}
|
|
|
|
.txt_r{
|
|
text-align: right;
|
|
}
|
|
|
|
.txt_l{
|
|
text-align: left;
|
|
}
|
|
|
|
.txt_c{
|
|
text-align: center;
|
|
}
|
|
.txt_alert{
|
|
color: #FF3300;
|
|
}
|
|
.line_150{
|
|
line-height: 150%;
|
|
}
|
|
.line_180{
|
|
line-height: 180%;
|
|
}
|
|
.line_200{
|
|
line-height: 200%;
|
|
}
|
|
.line_250{
|
|
line-height: 250%;
|
|
}
|
|
.flt{
|
|
float: left;
|
|
}
|
|
.flr{
|
|
float: right;
|
|
}
|
|
.mt10{ margin-top: 10px;}
|
|
.mb10{ margin-bottom: 10px;}
|
|
.ml10{ margin-left: 10px;}
|
|
.mr10{ margin-right: 10px;}
|
|
|
|
/*table settings*/
|
|
|
|
table {
|
|
background-color: transparent;
|
|
border-collapse: collapse;
|
|
border-spacing: 0;
|
|
max-width: 100%;
|
|
font-size: 70%;
|
|
}
|
|
.table {
|
|
background: none repeat scroll 0 0 #FFFFFF;
|
|
border-radius: 5px 5px 5px 5px;
|
|
width: 100%;
|
|
}
|
|
.table th, .table td {
|
|
border-top: 1px solid #DDDDDD;
|
|
line-height: 18px;
|
|
padding: 8px;
|
|
text-align: left;
|
|
vertical-align: top;
|
|
}
|
|
.table .highlight{
|
|
background: #efefef;
|
|
}
|
|
.table th {
|
|
font-weight: bold;
|
|
}
|
|
.table thead th {
|
|
border-bottom: 1px solid #DDDDDD;
|
|
vertical-align: bottom;
|
|
}
|
|
.table thead tr.dcms_table_fold_title th {
|
|
background: none repeat scroll 0 0 #EBEBEB;
|
|
vertical-align: bottom;
|
|
}
|
|
.table colgroup + thead tr:first-child th, .table colgroup + thead tr:first-child td, .table thead:first-child tr:first-child th, .table thead:first-child tr:first-child td {
|
|
border-top: 0 none;
|
|
}
|
|
.table tbody + tbody {
|
|
border-top: 2px solid #DDDDDD;
|
|
}
|
|
.table-condensed th, .table-condensed td {
|
|
padding: 4px 5px;
|
|
}
|
|
.table-bordered {
|
|
-moz-border-bottom-colors: none;
|
|
-moz-border-left-colors: none;
|
|
-moz-border-right-colors: none;
|
|
-moz-border-top-colors: none;
|
|
border-collapse: separate;
|
|
border-color: #DDDDDD #DDDDDD #DDDDDD -moz-use-text-color;
|
|
border-image: none;
|
|
border-radius: 4px 4px 4px 4px;
|
|
border-style: solid solid solid none;
|
|
border-width: 1px 1px 1px 0;
|
|
}
|
|
.table-bordered th, .table-bordered td {
|
|
border-left: 1px solid #DDDDDD;
|
|
}
|
|
.table-bordered thead:first-child tr:first-child th, .table-bordered tbody:first-child tr:first-child th, .table-bordered tbody:first-child tr:first-child td {
|
|
border-top: 0 none;
|
|
}
|
|
.table-bordered thead:first-child tr:first-child th:first-child, .table-bordered tbody:first-child tr:first-child td:first-child {
|
|
border-radius: 4px 0 0 0;
|
|
}
|
|
.table-bordered thead:first-child tr:first-child th:last-child, .table-bordered tbody:first-child tr:first-child td:last-child {
|
|
border-radius: 0 4px 0 0;
|
|
}
|
|
.table-bordered thead:last-child tr:last-child th:first-child, .table-bordered tbody:last-child tr:last-child td:first-child {
|
|
border-radius: 0 0 0 4px;
|
|
}
|
|
.table-bordered thead:last-child tr:last-child th:last-child, .table-bordered tbody:last-child tr:last-child td:last-child {
|
|
border-radius: 0 0 4px 0;
|
|
}
|
|
.table-striped tbody tr:nth-child(2n+1) td, .table-striped tbody tr:nth-child(2n+1) th {
|
|
background-color: #F9F9F9;
|
|
}
|
|
|
|
/*subtitles*/
|
|
.book_title01{
|
|
font-size: 100%;
|
|
border-bottom:solid 1px #ccc ;
|
|
font-weight: normal;
|
|
margin-bottom: 10px;
|
|
text-indent: 5px;
|
|
}
|
|
.book_title01 .small_title{
|
|
font-size: 50%;
|
|
display: block;
|
|
text-indent: 0px;
|
|
margin: 0px 5px;
|
|
color: #666;
|
|
}
|
|
.book_title01 strong{
|
|
max-height: 7em;
|
|
margin: 0px 5px;
|
|
overflow: hidden;
|
|
display:block;
|
|
text-indent:0px;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
.subtitle01{
|
|
font-size: 160%;
|
|
line-height: 40px;
|
|
border-bottom:solid 1px #ccc ;
|
|
font-weight: normal;
|
|
margin-bottom:0.5em;
|
|
text-indent: 5px;
|
|
position: relative;
|
|
}
|
|
|
|
.subtitle01_double{
|
|
border-bottom: 1px solid #CCCCCC;
|
|
font-size: 130%;
|
|
font-weight: normal;
|
|
margin-bottom: 2.5em;
|
|
position: relative;
|
|
text-indent: 0;
|
|
}
|
|
.subtitle02{
|
|
border-bottom: 1px solid #CCCCCC;
|
|
font-size: 120%;
|
|
font-weight: normal;
|
|
line-height: 40px;
|
|
margin-bottom: 10px;
|
|
}
|
|
.subtitle03{
|
|
border-bottom: 1px solid #CCCCCC;
|
|
font-size: 100%;
|
|
font-weight: normal;
|
|
line-height: 35px;
|
|
margin-bottom: 10px;
|
|
text-indent: 5px;
|
|
}
|
|
.subtitle04{
|
|
border-bottom: 1px dashed #CCCCCC;
|
|
font-size: 120%;
|
|
font-weight: bold;
|
|
line-height: 30px;
|
|
margin-bottom: 10px;
|
|
text-indent: 5px;
|
|
}
|
|
|
|
.bold_title01{
|
|
font-weight: bold;
|
|
}
|
|
.side_detail_box01{
|
|
font-size: 50%;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0px;
|
|
}
|
|
.side_detail_box01 .btn_m{
|
|
text-indent: 0px;
|
|
padding: 4px 5px;
|
|
width: 35px;
|
|
}
|
|
|
|
.subtitle{
|
|
font-size: 85%;
|
|
color: #666;
|
|
margin-left: 5px;
|
|
}
|
|
.switch_view_title{
|
|
float: left;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.copyright_box{
|
|
font-size: 85%;
|
|
color: #666;
|
|
}
|
|
|
|
|
|
/*main_layout*/
|
|
.wrapper{
|
|
float: left;
|
|
width: 100%;
|
|
text-align: center;
|
|
}
|
|
.container{
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
text-align: left;
|
|
border-top:solid #666666 3px;
|
|
}
|
|
.inner {
|
|
margin: 0 5px;
|
|
content: " ";
|
|
}
|
|
.inner:after {
|
|
clear: both;
|
|
}
|
|
|
|
.inner {
|
|
*zoom: 1;
|
|
}
|
|
|
|
.title_box01{
|
|
float: left;
|
|
width: 100%;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.contents{
|
|
float: left;
|
|
width: 100%;
|
|
margin-top: 10px;
|
|
min-height: 280px;
|
|
}
|
|
.pagelist .contents{
|
|
margin-top: 0px;
|
|
}
|
|
|
|
.section01{
|
|
float: left;
|
|
width: 100%;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.photobox01{
|
|
background: #fff;
|
|
margin: 0px;
|
|
}
|
|
|
|
.photobox01 img{
|
|
border: solid 1px #ccc;
|
|
}
|
|
|
|
.detailbox01{
|
|
float: left;
|
|
width: 100%;
|
|
}
|
|
|
|
/*list view*/
|
|
.listview01{
|
|
list-style-type: none;
|
|
}
|
|
.listview01 li{
|
|
float: left;
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
}
|
|
.listview01 li img{
|
|
max-width: 140px;
|
|
}
|
|
.list_thum01{
|
|
float: left;
|
|
width: 140px;
|
|
line-height: 170px;
|
|
margin-right: 10px;
|
|
margin-bottom: 20px;
|
|
text-align: center;
|
|
}
|
|
|
|
.list_details{
|
|
float: left;
|
|
width: 100%;
|
|
}
|
|
.list_details.notice_text{
|
|
font-size: 70%;
|
|
color:#666;
|
|
text-align: left;
|
|
}
|
|
.list_txt01{
|
|
margin-left: 150px;
|
|
background: #E5E5E5;
|
|
min-height: 180px;
|
|
position: relative;
|
|
-webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.5);
|
|
-moz-box-shadow: 0px 1px 3px rgba(0,0,0,.5);
|
|
box-shadow: 0px 1px 3px rgba(0,0,0,.5);
|
|
/*background:url("http://subtlepatterns.com/patterns/tiny_grid.png") #FCFCFC;*/
|
|
background:#DDDDDD;
|
|
position:relative;
|
|
border:1px solid #fff;
|
|
}
|
|
.list_txt01 .inner{
|
|
min-height: 120px;
|
|
}
|
|
.book_detail .list_txt01 .inner{
|
|
min-height: 200px;
|
|
}
|
|
|
|
.list_txt02{
|
|
width:100%;
|
|
}
|
|
.list_txt03{
|
|
margin-left: 120px;
|
|
}
|
|
|
|
.side_contents01{
|
|
float: left;
|
|
width: 230px;
|
|
}
|
|
.list_details{
|
|
font-size: 80%;
|
|
text-align: center;
|
|
}
|
|
.list_details .btn_m{
|
|
padding: 4px 8px;
|
|
float: left;
|
|
width: 100%;
|
|
text-align: left;
|
|
}
|
|
|
|
.main_contents{
|
|
float: left;
|
|
width: 100%;
|
|
min-height: 280px;
|
|
}
|
|
|
|
.app_download_box{
|
|
background:url("../img/bg_grad01.png") repeat-x top #fff;
|
|
clear: both;
|
|
border: solid 1px #ccc;
|
|
padding: 10px;
|
|
margin:10px 5px 0px;
|
|
border-radius: 5px;
|
|
}
|
|
.app_title{
|
|
font-size: 80%;
|
|
margin-bottom: 0.8em;
|
|
}
|
|
.app_title img{
|
|
width:20px;
|
|
height:20px;
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.ban_holder01{
|
|
list-style: none;
|
|
|
|
}
|
|
.ban_holder01 li{
|
|
list-style: none;
|
|
width: 48%;
|
|
display: inline-block;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
.footer{
|
|
clear: both;
|
|
float: left;
|
|
width: 100%;
|
|
padding-bottom: 10px;
|
|
background: #000;
|
|
}
|
|
|
|
.footer_inner{
|
|
border-top:solid 1px #ccc;
|
|
clear: both;
|
|
font-size: 12px;
|
|
background: #666666;
|
|
}
|
|
|
|
.footer_inner .copyright{
|
|
background-color: #000000;
|
|
color: #FFFFFF;
|
|
display: inline;
|
|
float: left;
|
|
margin: 0;
|
|
padding: 2px 5px;
|
|
text-align: right;
|
|
width: 100%;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
}
|
|
|
|
.switch_view{
|
|
list-style-type: none;
|
|
}
|
|
|
|
.small_txt{
|
|
font-size: 70%;
|
|
}
|
|
/*Book open btns toggle*/
|
|
.flash_box{
|
|
display: none;
|
|
}
|
|
.pc .flash_box{
|
|
display: block;
|
|
}
|
|
|
|
.pc .flashonly_notice{
|
|
display: none;
|
|
}
|
|
|
|
.html5_box{
|
|
display: block;
|
|
}
|
|
|
|
.appli_box{
|
|
display: block;
|
|
}
|
|
|
|
.detail_text01{
|
|
padding: 5px;
|
|
margin: 0 5px;
|
|
clear:both;
|
|
background:url("../img/bg_grad01.png") repeat-x top #fff;
|
|
-webkit-border-radius: 5px; /* Saf3-4, iOS 1-3.2, Android <e;1.6 */
|
|
-moz-border-radius: 5px; /* FF1-3.6 */
|
|
border-radius: 5px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
|
|
|
|
/* useful if you don't want a bg color from leaking outside the border: */
|
|
-moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
|
|
border: solid 1px #ccc;
|
|
}
|
|
|
|
|
|
.book_data{
|
|
float: left;
|
|
width: 150px;
|
|
font-size: 80%;
|
|
color: #888;
|
|
}
|
|
|
|
.book_data dt{
|
|
float: left;
|
|
margin-right: 10px;
|
|
margin-left: 5px;
|
|
}
|
|
.book_data dd{
|
|
float: left;
|
|
margin: 0px;
|
|
}
|
|
|
|
.pagelist_link{
|
|
float: right;
|
|
margin: 0px;
|
|
font-size: 80%;
|
|
margin-right: 5px;
|
|
}
|
|
.operating_env{
|
|
font-size: 75%;
|
|
}
|
|
.operating_env dl{
|
|
margin-left: 10px;
|
|
}
|
|
|
|
.breadcrumbs{
|
|
padding: 5px 5px;
|
|
font-size: 70%;
|
|
margin-bottom: 10px;
|
|
border-bottom: solid 1px #ccc;
|
|
background-color: #efefef;
|
|
}
|
|
|
|
.pagelist_wrap{
|
|
float: left;
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
}
|
|
.listbox01_left {
|
|
float: left;
|
|
height: auto !important;
|
|
list-style-type: none;
|
|
min-height: 250px;
|
|
padding-bottom: 10px;
|
|
width: 100%;
|
|
margin-top: 20px;
|
|
}
|
|
.listbox01_left li {
|
|
float: left;
|
|
list-style-type: none;
|
|
padding-bottom: 35px;
|
|
text-align: center;
|
|
width: 50%;
|
|
}
|
|
.listbox01_left li img, .listbox01_right li img {
|
|
border: 1px solid #CCCCCC;
|
|
max-width: 85px;
|
|
}
|
|
|
|
|
|
.listbox01_right {
|
|
float: left;
|
|
height: auto !important;
|
|
list-style-type: none;
|
|
min-height: 250px;
|
|
padding-bottom: 10px;
|
|
width: 100%;
|
|
margin-top: 20px;
|
|
}
|
|
.listbox01_right li {
|
|
float: right;
|
|
list-style-type: none;
|
|
padding-bottom: 35px;
|
|
text-align: center;
|
|
width: 50%;
|
|
}
|
|
|
|
|
|
/*page_list*/
|
|
.list_pager {
|
|
list-style: none outside none;
|
|
text-align: center;
|
|
font-size: 75%;
|
|
}
|
|
.list_pager li {
|
|
display: inline;
|
|
margin-right: 0.5em;
|
|
}
|
|
a.current {
|
|
font-weight: bold;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
|
|
/*mobile_landscape*/
|
|
|
|
@media screen and (orientation: portrait) {
|
|
.ban_holder01 li {
|
|
width: 48%;
|
|
}
|
|
.icon.arrow {
|
|
background-image: url("../img/icon_arrow.png");
|
|
float: left;
|
|
height: 45px;
|
|
margin: 0 10px 0 0;
|
|
width: 6px;
|
|
}
|
|
}
|
|
|
|
@media screen and (orientation: landscape) {
|
|
.ban_holder01 li {
|
|
width: 32%;
|
|
}
|
|
.listbox01_left li{
|
|
width: 32%;
|
|
}
|
|
|
|
}
|
|
|