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.
767 lines
13 KiB
767 lines
13 KiB
/* ==========================================================================
|
|
HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
|
|
========================================================================== */
|
|
|
|
html,
|
|
button,
|
|
input,
|
|
select,
|
|
textarea {
|
|
color: #222;
|
|
}
|
|
|
|
body {
|
|
font-family: "メイリオ", Meiryo, "MS Pゴシック", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
|
|
font-size: 1em;
|
|
line-height: 1.4;
|
|
background: url(../img/furley_bg02.png);
|
|
/*background: url(http://subtlepatterns.com/patterns/solid.png);*/
|
|
|
|
}
|
|
/*テキストを選択した時の色*/
|
|
::-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%;}
|
|
|
|
|
|
/* ==========================================================================
|
|
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;
|
|
}
|
|
|
|
/* ==========================================================================
|
|
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;}
|
|
|
|
.list_details.notice_text{
|
|
font-size: 70%;
|
|
color:#666;
|
|
text-align: left;
|
|
}
|
|
|
|
/*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;
|
|
}
|
|
|
|
/*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: 60%;
|
|
width: 100%;
|
|
display: block;
|
|
text-indent: 0px;
|
|
color: #666;
|
|
}
|
|
.book_title01 strong{
|
|
max-height: 7em;
|
|
overflow: hidden;
|
|
display:block;
|
|
text-indent:0px;
|
|
word-wrap: break-word;
|
|
}
|
|
|
|
|
|
.copyright_box{
|
|
font-size: 75%;
|
|
color: #666;
|
|
}
|
|
|
|
.subtitle01{
|
|
font-size: 160%;
|
|
line-height: 40px;
|
|
border-bottom:solid 1px #ccc ;
|
|
font-weight: normal;
|
|
margin-bottom:10px;
|
|
position: relative;
|
|
}
|
|
|
|
.subtitle02{
|
|
font-size: 120%;
|
|
line-height: 40px;
|
|
border-bottom:solid 1px #ccc ;
|
|
font-weight: normal;
|
|
margin-bottom: 10px;
|
|
}
|
|
.subtitle03{
|
|
font-size: 100%;
|
|
line-height: 35px;
|
|
border-bottom:solid 1px #ccc ;
|
|
font-weight: normal;
|
|
margin-bottom: 10px;
|
|
}
|
|
.subtitle04{
|
|
font-size: 100%;
|
|
line-height: 30px;
|
|
color: #666;
|
|
border-bottom:dashed 1px #ccc ;
|
|
font-weight: bold;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
|
|
.subtitle{
|
|
font-size: 60%;
|
|
color: #666;
|
|
margin-left: 25px;
|
|
}
|
|
|
|
/*メインレイアウト*/
|
|
.wrapper{
|
|
float: left;
|
|
width: 100%;
|
|
text-align: center;
|
|
padding-top: 20px;
|
|
}
|
|
.container{
|
|
position: relative;
|
|
width: 980px;
|
|
margin: 0px auto;
|
|
text-align: left;
|
|
border-top:solid #666666 5px;
|
|
background:url("../img/bg_grad01.png") repeat-x top #FCFCFC;
|
|
|
|
-webkit-box-shadow: 0px 3px 5px rgba(0, 0, 0, .8); /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
|
|
-moz-box-shadow: 0px 3px 5px rgba(0, 0, 0, .8); /* FF3.5 - 3.6 */
|
|
box-shadow: 0px 3px 5px rgba(0, 0, 0, .8); /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
|
|
}
|
|
|
|
.header{
|
|
float: left;
|
|
width: 100%;
|
|
}
|
|
|
|
.contents{
|
|
float: left;
|
|
width: 950px;
|
|
margin-top: 15px;
|
|
margin-left: 15px;
|
|
margin-bottom: 5px;
|
|
min-height: 600px;
|
|
}
|
|
.pagelist .contents{
|
|
margin-top: 0px;
|
|
}
|
|
|
|
/*IE6 only*/
|
|
.lt-ie7 .contents{
|
|
margin-left: 7px;
|
|
}
|
|
|
|
.section01{
|
|
float: left;
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
/*list view*/
|
|
.listview01{
|
|
list-style-type: none;
|
|
}
|
|
.listview01 li{
|
|
float: left;
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
}
|
|
.list_thum01{
|
|
float: left;
|
|
width: 160px;
|
|
margin-right: 10px;
|
|
line-height: 230px;
|
|
text-align: center;
|
|
}
|
|
|
|
.list_thum02{
|
|
float: left;
|
|
width: 150px;
|
|
margin-right: 10px;
|
|
}
|
|
.list_details{
|
|
float: left;
|
|
width: 100%;
|
|
}
|
|
.list_details .btn_m{
|
|
float: left;
|
|
width: 100%;
|
|
text-align: left;
|
|
}
|
|
|
|
|
|
.list_txt{
|
|
float: right;
|
|
width: 240px;
|
|
margin-left: 130px;
|
|
padding: 10px 10px 0px 10px ;
|
|
min-height: 200px;
|
|
background:#E5E5E5;
|
|
-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;
|
|
-webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, .5); /* Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
|
|
-moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, .5); /* FF3.5 - 3.6 */
|
|
box-shadow: 0px 0px 2px rgba(0, 0, 0, .5); /* Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
|
|
}
|
|
|
|
.list_txt01 {
|
|
float: right;
|
|
width: 240px;
|
|
padding: 10px 10px 0px 10px ;
|
|
min-height: 200px;
|
|
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);
|
|
padding: 10px;
|
|
/*background:url("http://subtlepatterns.com/patterns/tiny_grid.png") #FCFCFC;*/
|
|
background:#DDDDDD;
|
|
position:relative;
|
|
border:1px solid #fff;
|
|
}
|
|
|
|
|
|
.list_txt01 .inner{
|
|
min-height: 120px;
|
|
}
|
|
|
|
|
|
.list_txt02{
|
|
float: right;
|
|
width: 530px;
|
|
}
|
|
.side_contents01{
|
|
float: left;
|
|
width: 230px;
|
|
}
|
|
.list_details{
|
|
font-size: 80%;
|
|
text-align: center;
|
|
}
|
|
|
|
.list_details .btn01{
|
|
float: left;
|
|
width: 48%;
|
|
}
|
|
.list_details .btn02{
|
|
float: right;
|
|
width: 48%;
|
|
}
|
|
.list_details .btn03{
|
|
float: left;
|
|
width: 100%;
|
|
}
|
|
.list_txt01 .category_list01{
|
|
min-height: 100px;
|
|
}
|
|
.category_list01{
|
|
width:100%;
|
|
float: left;
|
|
}
|
|
.category_list01 a{
|
|
margin: 0px 5px;
|
|
}
|
|
.category_list01 dt{
|
|
clear: both;
|
|
color: #555;
|
|
float: left;
|
|
font-size: 90%;
|
|
margin-bottom: 15px;
|
|
width: 28%;
|
|
font-weight: bold;
|
|
/*text-shadow: 1px 1px 2px rgba(0, 0, 0, .5); /* FF3.5+, Opera 9+, Saf1+, Chrome, IE10 */*/
|
|
}
|
|
.category_list01 dd{
|
|
float: left;
|
|
margin:0px 0px 15px 10px;
|
|
width: 65%;
|
|
}
|
|
.list_detail{
|
|
clear: both;
|
|
}
|
|
|
|
.main_contents{
|
|
float: left;
|
|
width: 100%;
|
|
}
|
|
|
|
.footer{
|
|
clear: both;
|
|
float: left;
|
|
width: 100%;
|
|
background: #efefef;
|
|
}
|
|
|
|
.footer_inner{
|
|
border-top:solid 1px #ccc;
|
|
clear: both;
|
|
padding: 10px 0px 10px;
|
|
font-size: 12px;
|
|
}
|
|
.footer_inner nav{
|
|
float: left;
|
|
width: 400px;
|
|
margin: 10px;
|
|
display: inline;
|
|
}
|
|
.footer_inner .copyright{
|
|
float: right;
|
|
text-align: right;
|
|
width: 400px;
|
|
margin: 10px;
|
|
display: inline;
|
|
}
|
|
|
|
|
|
/*resposible*/
|
|
.breadcrumbs{
|
|
font-size: 80%;
|
|
margin: 9px 0px;
|
|
}
|
|
.book_detail{
|
|
float: left;
|
|
margin-bottom: 15px;
|
|
margin-top: 20px;
|
|
width: 100%;
|
|
}
|
|
.pagelist .book_detail{
|
|
margin-top: 0px;
|
|
|
|
}
|
|
|
|
p.photobox01{
|
|
margin: 0px;
|
|
}
|
|
|
|
p.photobox01 img{
|
|
border: solid 1px #ccc;
|
|
}
|
|
|
|
.app_download_box{
|
|
background:url("../img/bg_grad01.png") repeat-x top #fff;
|
|
clear: both;
|
|
border: solid 1px #ccc;
|
|
padding: 10px;
|
|
margin-top: 10px;
|
|
border-radius: 5px;
|
|
position: relative;
|
|
}
|
|
.app_title{
|
|
float: left;
|
|
font-size: 80%;
|
|
line-height: 40px;
|
|
margin-right: 10px;
|
|
width: 280px;
|
|
}
|
|
.app_title img{
|
|
width:40px;
|
|
height:40px;
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.ban_holder01{
|
|
list-style: none;
|
|
float: left;
|
|
width: 630px;
|
|
}
|
|
.ban_holder01 li{
|
|
list-style: none;
|
|
display: inline-block;
|
|
}
|
|
.lt-ie8 .ban_holder01 li{
|
|
float: left;
|
|
width: 25%;
|
|
text-align: center;
|
|
}
|
|
.ban_holder01 li img{
|
|
max-width: 100%;
|
|
height: 40px;
|
|
}
|
|
|
|
.detail_text01{
|
|
padding: 10px;
|
|
clear:both;
|
|
background:url("../img/bg_grad01.png") repeat-x top #fff;
|
|
border-radius: 5px;
|
|
/* useful if you don't want a bg color from leaking outside the border: */
|
|
position: relative;
|
|
border: solid 1px #ccc;
|
|
}
|
|
|
|
.book_data{
|
|
float: left;
|
|
width: 100%;
|
|
font-size: 80%;
|
|
color: #888;
|
|
}
|
|
.book_data dl{
|
|
float: left;
|
|
}
|
|
.book_data dt{
|
|
float: left;
|
|
margin-right: 20px;
|
|
}
|
|
.book_data dd{
|
|
float: left;
|
|
margin-right: 20px;
|
|
}
|
|
|
|
|
|
.operating_env{
|
|
font-size: 85%;
|
|
height: 250px;
|
|
overflow-x: hidden;
|
|
overflow-y: scroll;
|
|
padding-right: 12px;
|
|
}
|
|
.operating_env dl{
|
|
margin-left: 10px;
|
|
color: #777;
|
|
}
|
|
.operating_env dt{
|
|
color: #555;
|
|
}
|
|
|
|
|
|
.title_box01{
|
|
left: 50%;
|
|
margin-left: -305px;
|
|
position: absolute;
|
|
top: 45px;
|
|
width: 505px;
|
|
}
|
|
|
|
.operating_env_wrap{
|
|
float: left;
|
|
width: 48%;
|
|
}
|
|
.copyright_box_wrap{
|
|
float: right;
|
|
width: 48%;
|
|
}
|
|
|
|
/*pagelist*/
|
|
|
|
a.current {
|
|
font-weight: bold;
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.pagelist_wrap{
|
|
float: left;
|
|
width: 100% ;
|
|
margin-bottom: 20px;
|
|
}
|
|
.listbox01_left {
|
|
float: left;
|
|
height: auto !important;
|
|
list-style-type: none;
|
|
min-height: 160px;
|
|
padding-bottom: 10px;
|
|
width: 100%;
|
|
margin-top: 20px;
|
|
}
|
|
.listbox01_left li {
|
|
float: left;
|
|
list-style-type: none;
|
|
padding-bottom: 35px;
|
|
text-align: center;
|
|
width: 12.5%;
|
|
}
|
|
.listbox01_left li img, .listbox01_right li img {
|
|
border: 1px solid #CCCCCC;
|
|
max-width: 97px;
|
|
}
|
|
|
|
|
|
.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: 12.5%;
|
|
}
|
|
|
|
.list_pager {
|
|
list-style: none outside none;
|
|
text-align: center;
|
|
}
|
|
.list_pager li {
|
|
display: inline;
|
|
margin-right: 0.5em;
|
|
}
|
|
.pagelist_link{
|
|
clear: both;
|
|
float: left;
|
|
font-size: 80%;
|
|
margin-top: 5px;
|
|
text-align: right;
|
|
width: 100%;
|
|
}
|
|
.small_txt{
|
|
font-size: 80%;
|
|
}
|
|
|
|
/*lt IE 9 only*/
|
|
.lt-ie9 .container.localonly{
|
|
border-left: solid 1px #ccc;
|
|
border-right: solid 1px #ccc;
|
|
border-bottom: solid 1px #ccc;
|
|
|
|
}
|