|
|
/* ========================================================================== 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ゴシック", "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;
}
|