/* */
@charset "utf-8";
/*
Theme: Creativity
Url: https://www.yume-kawa.com/
Description:
そのまま使っても何となくおしゃれに見せられるテーマです。
CSSが弄れる方はお好きにカスタマイズして自分だけのオリジナルデザインにしてくださいませ。
Licensed under the MIT license.
*/
/* Responsive: yes */
html {
font-family: sans-serif;
/* 1 */
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
/* 2 */
}
/**
* Remove default margin.
*/
body {
margin: 0;
}
/* HTML5 display definitions
========================================================================== */
/**
* Correct `block` display not defined for any HTML5 element in IE 8/9.
* Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
* Correct `block` display not defined for `main` in IE 11.
*/
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
display: block;
}
/**
* 1. Correct `inline-block` display not defined in IE 8/9.
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
*/
audio,
canvas,
progress,
video {
display: inline-block;
/* 1 */
vertical-align: baseline;
/* 2 */
}
/**
* Prevent modern browsers from displaying `audio` without controls.
* Remove excess height in iOS 5 devices.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Address `[hidden]` styling not present in IE 8/9/10.
* Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
*/
[hidden],
template {
display: none;
}
/* Links
========================================================================== */
/**
* Remove the gray background color from active links in IE 10.
*/
a {
background: transparent;
}
/**
* Improve readability when focused and also mouse hovered in all browsers.
*/
a:active,
a:hover {
outline: 0;
}
/* Text-level semantics
========================================================================== */
/**
* Address styling not present in IE 8/9/10/11, Safari, and Chrome.
*/
abbr[title] {
border-bottom: 1px dotted;
}
/**
* Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
*/
b,
strong {
font-weight: bold;
}
/**
* Address styling not present in Safari and Chrome.
*/
dfn {
font-style: italic;
}
/**
* Address variable `h1` font-size and margin within `section` and `article`
* contexts in Firefox 4+, Safari, and Chrome.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/**
* Address styling not present in IE 8/9.
*/
mark {
background: #ff0;
color: #000;
}
/**
* Address inconsistent and variable font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
/* Embedded content
========================================================================== */
/**
* Remove border when inside `a` element in IE 8/9/10.
*/
img {
border: 0;
}
/**
* Correct overflow not hidden in IE 9/10/11.
*/
svg:not(:root) {
overflow: hidden;
}
/* Grouping content
========================================================================== */
/**
* Address margin not present in IE 8/9 and Safari.
*/
figure {
margin: 1em 40px;
}
/**
* Address differences between Firefox and other browsers.
*/
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
/**
* Contain overflow in all browsers.
*/
pre {
overflow: auto;
}
/**
* Address odd `em`-unit font size rendering in all browsers.
*/
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
/* Forms
========================================================================== */
/**
* Known limitation: by default, Chrome and Safari on OS X allow very limited
* styling of `select`, unless a `border` property is set.
*/
/**
* 1. Correct color not being inherited.
* Known issue: affects color of disabled elements.
* 2. Correct font properties not being inherited.
* 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
*/
button,
input,
optgroup,
select,
textarea {
color: inherit;
/* 1 */
font: inherit;
/* 2 */
margin: 0;
/* 3 */
}
/**
* Address `overflow` set to `hidden` in IE 8/9/10/11.
*/
button {
overflow: visible;
}
/**
* Address inconsistent `text-transform` inheritance for `button` and `select`.
* All other form control elements do not inherit `text-transform` values.
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
* Correct `select` style inheritance in Firefox.
*/
button,
select {
text-transform: none;
}
/**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between image-type
* `input` and others.
*/
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
/* 2 */
cursor: pointer;
/* 3 */
}
/**
* Re-set default cursor for disabled elements.
*/
button[disabled],
html input[disabled] {
cursor: default;
}
/**
* Remove inner padding and border in Firefox 4+.
*/
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
/**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
* the UA stylesheet.
*/
input {
line-height: normal;
}
/**
* It's recommended that you don't attempt to style these elements.
* Firefox's implementation doesn't respect box-sizing, padding, or width.
*
* 1. Address box sizing set to `content-box` in IE 8/9/10.
* 2. Remove excess padding in IE 8/9/10.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box;
/* 1 */
padding: 0;
/* 2 */
}
/**
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
* `font-size` values of the `input`, it causes the cursor style of the
* decrement button to change from `default` to `text`.
*/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Address `appearance` set to `searchfield` in Safari and Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari and Chrome
* (include `-moz` to future-proof).
*/
input[type="search"] {
-webkit-appearance: textfield;
/* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
/* 2 */
box-sizing: content-box;
}
/**
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
* Safari (but not Chrome) clips the cancel button when the search input has
* padding (and `textfield` appearance).
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Define consistent border, margin, and padding.
*/
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct `color` not being inherited in IE 8/9/10/11.
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
*/
legend {
border: 0;
/* 1 */
padding: 0;
/* 2 */
}
/**
* Remove default vertical scrollbar in IE 8/9/10/11.
*/
textarea {
overflow: auto;
}
/**
* Don't inherit the `font-weight` (applied by a rule above).
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
*/
optgroup {
font-weight: bold;
}
/* Tables
========================================================================== */
/**
* Remove most spacing between table cells.
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
/* import mixin */
.clearfix {
display: block;
*zoom: 1;
}
.clearfix:after {
display: block;
visibility: hidden;
font-size: 0;
height: 0;
clear: both;
content: ".";
}
.inline-block {
display: inline-block;
*display: inline;
*zoom: 1;
}
.ellipsis {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
/* import variable */
/* Common */
html,
body {
font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
color: #454545;
width: 100%;
}
a {
color: #666A73;
}
a:visited {
color: #666A73;
}
a:hover {
color: #2F3540;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover,
h1 a:visited,
h2 a:visited,
h3 a:visited,
h4 a:visited,
h5 a:visited,
h6 a:visited {
color: #454545;
text-decoration: none;
}
a.keyword {
text-decoration: none;
border-bottom: 1px dotted #dddddd;
color: #454545;
}
/* Buttons */
.btn {
display: inline-block;
*display: inline;
*zoom: 1;
padding: 4px 10px 4px;
margin-bottom: 0;
line-height: 18px;
color: #454545;
background-color: #ffffff;
text-align: center;
vertical-align: middle;
border-top-right-radius: 2px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
border-radius: 2px;
background-clip: padding-box;
cursor: pointer;
font-size: 12px;
text-decoration: none;
font-weight: bold;
border: 1px solid rgba(0, 0, 0, 0.2);
text-decoration: none !important;
}
.btn:hover {
background-color: #f5f5f5;
text-decoration: none !important;
}
.btn-small {
padding: 2px 10px !important;
font-size: 11px !important;
}
.btn-large {
padding: 13px 19px;
font-size: 17px;
line-height: normal;
font-weight: bold;
}
/* ヘッダ（グローバルヘッダ）
グローバルヘッダの中はiframeですが、
#globalheader-container に背景色や文字色を指定することでiframeの中にも色が反映されます。
*/
#globalheader-container {
background: #333;
color: #fff;
position: fixed;
top: 0;
left: 0;
width: 100%;
}
/* container */
#container {
width: 1250px;
margin-left: auto;
margin-right: auto;
padding-top: 37px;
}
#container #container-inner {
background: #fff;
padding: 0 25px;
}
#container #content {
margin-top: 30px;
display: block;
*zoom: 1;
}
#container #content:after {
display: block;
visibility: hidden;
font-size: 0;
height: 0;
clear: both;
content: ".";
}
.globalheader-off #container {
padding-top: 0;
}
/* 2カラムレイアウト */
#main {
width: 860px;
float: left;
}
#box2 {
width: 336px;
float: right;
}
/* header */
#blog-title {
padding: 45px 0;
background-color: #ffffff;
text-align: center;
border-bottom: 1px solid #dddddd;
}
#title {
margin: 0;
}
#title a {
color: #454545;
}
#blog-description {
font-weight: normal;
font-size: 80%;
margin: 5px 0 0 0;
text-align: center;
}
/* ヘッダ画像を設定したとき */
.header-image-enable #title {
padding-top: 70px;
}
.header-image-enable #title,
.header-image-enable #blog-description {
padding-left: 20px;
}
/* パンくず（カテゴリーページで表示されます） */
#top-box {
margin: 10px auto 20px;
font-size: 90%;
}
#top-box .breadcrumb {
border-bottom: 1px solid #dddddd;
padding: 10px;
}
/* ヘッダ下 */
#top-editarea {
font-size: 90%;
padding: 10px 0;
border-bottom: 1px solid #dddddd;
}
/* entry */
#main-inner {
width: 830px;
}
.page-index #main-inner {
display: flex;
flex-direction: row;
flex-wrap: wrap;
width: 860px;
}
.page-archive #main-inner {
width: 830px;
}
.page-index .hentry {
flex-basis: 400px;
margin-right: 30px;
}
.no-entry {
width: 830px;
}
.entry {
width
position: relative;
margin-bottom: 50px;
}
.entry-header {
padding: 0 0 10px 0;
margin-bottom: 20px;
position: relative;
}
.entry-title {
margin: 0;
line-height: 1.3;
font-size: 120%;
}
/* 日付 */
.date {
font-weight: bold;
margin-bottom: 10px;
padding: 6px;
text-align: center;
border: 3px solid #f7f7f7;
}
.date a {
text-decoration: none;
font-size: 80%;
}
/* カテゴリ */
.categories {
margin-top: 10px;
font-size: 9px;
}
.categories a {
padding: 5px 8px;
background: #8F8B90;
border-radius: 3px;
text-decoration: none;
color: #fff;
}
.categories.no-categories {
margin: 0;
}
/* 「編集する」ボタン */
.entry-header-menu {
position: absolute;
bottom: 0px;
left: -60px;
}
.entry-header-menu a {
display: inline-block;
*display: inline;
*zoom: 1;
padding: 4px 10px 4px;
margin-bottom: 0;
line-height: 18px;
color: #454545;
background-color: #ffffff;
text-align: center;
vertical-align: middle;
border-top-right-radius: 2px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
border-radius: 2px;
background-clip: padding-box;
cursor: pointer;
font-size: 12px;
text-decoration: none;
font-weight: bold;
border: 1px solid rgba(0, 0, 0, 0.2);
text-decoration: none !important;
}
.entry-header-menu a:hover {
background-color: #f5f5f5;
text-decoration: none !important;
}
/* entry-content の中の書式 */
.entry-content {
font-size: 95%;
line-height: 1.7;
padding-bottom: 10px;
}
.entry-content p {
margin: 0 0 1em 0;
}
.entry-content img {
max-width: 100%;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
margin: 1.3em 0 0.8em 0;
line-height: 1.5;
}
.entry-content h1 {
font-size: 160%;
}
.entry-content h2 {
font-size: 150%;
}
.entry-content h3 {
font-size: 140%;
}
.entry-content h4 {
font-size: 130%;
}
.entry-content h5 {
font-size: 110%;
}
.entry-content h6 {
font-size: 100%;
}
.entry-content table {
border-collapse: collapse;
border-spacing: 0;
margin-bottom: 1em;
}
.entry-content table img {
max-width: none;
}
.entry-content table th,
.entry-content table td {
border: 1px solid #ddd;
padding: 5px 10px;
}
.entry-content table th {
background: #f5f5f5;
}
.entry-content blockquote {
border: 1px solid #dddddd;
margin: 0 0 10px;
padding: 20px;
}
.entry-content blockquote p {
margin-top: 0;
margin-bottom: 0;
}
.entry-content pre {
border: 1px solid #dddddd;
margin: 0 0 10px;
padding: 20px;
white-space: pre;
}
.entry-content pre > code {
margin: 0;
padding: 0;
white-space: pre;
border: 0;
background: transparent;
font-family: 'Monaco', 'Consolas', 'Courier New', Courier, monospace, sans-serif;
}
.entry-content code {
font-size: 90%;
margin: 0 2px;
padding: 0 5px;
border: 1px solid #eaeaea;
background-color: #f8f8f8;
border-radius: 3px;
font-family: 'Monaco', 'Consolas', 'Courier New', Courier, monospace, sans-serif;
}
.entry-content .hatena-asin-detail li {
line-height: 1.4;
}
a.entry-see-more {
padding: 8px;
border: 1px solid #dddddd;
text-decoration: none;
text-align: center;
font-size: 80%;
border-radius: 3px;
display: block;
}
/* entry-footer */
.entry-footer {
margin-top: 10px;
}
.entry-footer-section {
font-size: 80%;
color: #999999;
}
.entry-footer-section a {
color: #999999;
}
.page-index .hatena-star-container,
.page-index .hatena-star-metadata,
.page-index .social-buttons,
.page-index .comment-box,
.page-index .entry-footer-section {
display: none;
}
.entry-footer-html {
margin: 10px 0;
}
/* コメント */
.comment-box ul {
list-style: none;
margin: 0 0 15px 0;
padding: 0;
font-size: 95%;
line-height: 1.7;
}
.comment-box li {
padding: 10px 0 10px 60px;
border-bottom: 1px solid #dddddd;
position: relative;
}
.comment-box li:first-child {
border-top: 1px solid #dddddd;
}
.comment-box .read-more-comments {
padding-left: 0;
}
.comment-box .hatena-id-icon {
position: absolute;
top: 10px;
left: 0;
width: 50px !important;
height: 50px !important;
border-top-right-radius: 3px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
border-radius: 3px;
background-clip: padding-box;
}
.comment-user-name {
margin: 0 0 10px 0;
font-weight: bold;
}
.comment-content {
font-size: 90%;
margin: 0 0 10px 0;
word-wrap: break-word;
}
.comment-content p {
margin: 0 0 10px 0;
}
.comment-metadata {
font-size: 80%;
color: #999999;
margin: 0;
}
.comment-metadata a {
color: #999999;
}
.leave-comment-title {
display: inline-block;
*display: inline;
*zoom: 1;
padding: 4px 10px 4px;
margin-bottom: 0;
line-height: 18px;
color: #454545;
background-color: #ffffff;
text-align: center;
vertical-align: middle;
border-top-right-radius: 2px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
border-radius: 2px;
background-clip: padding-box;
cursor: pointer;
font-size: 12px;
text-decoration: none;
font-weight: bold;
border: 1px solid rgba(0, 0, 0, 0.2);
text-decoration: none !important;
}
.leave-comment-title:hover {
background-color: #f5f5f5;
text-decoration: none !important;
}
/* sidebar */
#box2 {
font-size: 85%;
line-height: 1.5;
}
.hatena-module {
margin-bottom: 60px;
}
.hatena-module-title {
font-weight: bold;
margin-bottom: 15px;
background: #f7f7f7;
padding: 10px;
text-align: center;
}
.hatena-module-title a {
color: #454545;
text-decoration: none;
}
.hatena-module-title a:hover {
text-decoration: underline;
}
/* Profile module */
.hatena-module-profile .profile-icon {
float: left;
margin: 0 10px 10px 0;
border-top-right-radius: 5px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
border-radius: 50%;
background-clip: padding-box;
}
.hatena-module-profile .id {
display: block;
font-weight: bold;
font-size: 110%;
margin-bottom: 5px;
}
.hatena-module-profile .profile-description {
font-size: 90%;
}
.hatena-module-profile .profile-description p {
margin-top: 0;
}
/* urllist module
リンク・最新記事・最近のコメント・月別アーカイブ・カテゴリモジュールは .hatena-urllist という共通の class が振られます
*/
.urllist-with-thumbnails li .urllist-image {
border-radius: 50%;
}
.hatena-urllist {
list-style: none;
margin: 0 0 0 0;
padding: 0 0 0 0;
border-collapse: separate;
border-spacing: 5px;
}
.hatena-urllist li {
padding: 8px 0;
line-height: 1.5;
}
.hatena-urllist li a {
text-decoration: none;
}
.hatena-module-category .hatena-urllist li {
padding: 3px 8px;
margin-right: 5px;
margin-bottom: 5px;
display: table-cell;
border: 1px solid #dddddd;
border-radius: 3px;
}
.urllist-category-link {
color: #adbcc3 !important;
text-decoration: underline !important;
}
/* Search module */
.hatena-module-search-box .search-form {
border: 1px solid #dddddd;
border-top-right-radius: 3px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
border-radius: 3px;
background-clip: padding-box;
width: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.hatena-module-search-box .search-module-input {
padding: 5px;
color: #454545;
background: none;
border: none;
outline: none;
height: 20px;
width: 90%;
}
.hatena-module-search-box .search-module-button {
width: 20px;
height: 20px;
background: transparent url(https://cdn.blog.st-hatena.com/images/theme/search.png) no-repeat right center;
border: none;
outline: none;
text-indent: -9999px;
position: absolute;
top: 5px;
right: 5px;
opacity: 0.5;
}
.hatena-module-search-box .search-module-button:hover {
opacity: 0.85;
}
/* Pager */
.pager {
margin: 1em 0;
display: block;
width: 830px;
*zoom: 1;
}
.pager:after {
display: block;
visibility: hidden;
font-size: 0;
height: 0;
clear: both;
content: ".";
}
.pager .pager-prev {
float: left;
text-align: left;
width: 45%;
}
.pager .pager-next {
float: right;
text-align: right;
width: 45%;
}
/* Footer */
#footer {
border-top: 1px solid #ddd;
width: 1250px;
margin: 0 auto;
padding: 30px 0;
text-align: center;
color: #999999;
line-height: 1.5;
font-size: 80%;
background: #ffffff;
}
#footer p {
margin: 0;
}
#footer a {
color: #999999;
}
/* About ページ */
.page-about dt {
font-size: 16px;
font-weight: bold;
border-bottom: 1px solid #ddd;
margin-bottom: 5px;
}
.page-about dd {
margin-left: 0;
margin-bottom: 30px;
}
/* archive ページ */
.page-archive .archive-entries .archive-entry {
margin-bottom: 3em;
}
.page-archive .archive-entries .entry-title {
font-size: 130%;
margin: 0 0 .5em;
}
.page-archive .archive-entries .categories {
margin: 0 0 .5em;
}
.page-archive .archive-entries .entry-description {
margin: 0 0 1em;
line-height: 1.7em;
font-size: 95%;
}
.page-archive .categories a {
color: #fff;
background: #aaa;
padding: 3px 5px;
border-radius: 3px;
text-decoration: none;
display: inline-block;
*display: inline;
*zoom: 1;
margin-right: 2px;
}
/* import media queries */
/* Media Queries - Retina Display */
@media (-webkit-min-device-pixel-ratio: 2) {
.hatena-module-search-box .search-module-button {
background: transparent url(https://cdn.blog.st-hatena.com/images/theme/search@2x.png) no-repeat right center;
background-size: 20px 20px;
}
}
/* Media Queries - Tablet */
@media (min-width: 1024px) and (max-width: 1250px) {
#container,
#footer {
width: 1024px;
}
#main {
width: 700px;
}
#box2 {
width: 245px;
}
#globalheader-container {
position: none;
}
#main-inner {
width: 670px;
}
.page-archive #main-inner,
.page-index #main-inner {
display: block;
width: 670px;
}
.page-index .hentry {
margin-right: 10px;
}
.pager {
width: 100%;
}
}
/* Media Queries - Small Tablet & Smartphone */
@media (max-width: 1023px) {
#globalheader-container {
position: static;
}
#main-inner {
width: 100%;
}
.page-archive #main-inner,
.page-index #main-inner {
display: block;
width: 100%;
}
.page-index .hentry {
margin-right: 0;
}
#container,
#footer {
width: 93.75%;
word-wrap: break-word;
overflow: hidden;
padding-top: 0;
}
#main {
width: 100%;
float: none;
}
#box2 {
width: 100%;
float: none;
}
#box2-inner {
width: 100%;
}
.hatena-module {
width: 100%;
float: none;
}
.entry-header-menu {
top: -30px;
left: 0px;
}
.pager {
width: 100%;
}
}
/* Media Queries - Smartphone */
/* */
/* */
body{background:#f5f5f5;}
/* */
.date {
position: absolute;
top: -30px;
border:none;
font-weight:normal
}
/*タイトル*/
.entry-title {
}
.entry-title{
font-weight: bold!important;
font-size: 17.5px!important;
padding: .75em 1em!important;
border: 1px solid #ccc!important;
border-top: 3px solid #E13A3E!important;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%)!important;
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%)!important;
box-shadow: 0 -1px 0 rgba(255, 255, 255, 1) inset!important;
}
@media screen and (min-width: 1000px) {
#main {
width: 650px;
}
#box2 {
width: 340px;
}
}
.urllist-with-thumbnails li .urllist-image {
border-radius: 5%; /* 角を少し丸める */
}
/* 記事欄に背景色と影*/
@media screen and (min-width: 767px) {
.entry-inner {
background-color:#fff;
padding:10px 54px 42px;
border-radius: 2px;/* 記事欄枠の角を丸くする*/
}
}
/*サイドバーのカスタマイズ*/
@media screen and (min-width: 767px) {
.hatena-module{
margin-bottom:0em;
font-size:14px;
background: #fff;
padding:2em 1em!important;
margin:0 -5px -5px -5px;
box-shadow: 0 1px 6px #dddddd;
padding: 1me 1em 1em 1em;
border-radius: 3px;
padding:1px 1px;
}
.entry {
border-radius:5px 5px 0px 0px / 5px 5px 0px 0px;/*角の丸み*/
margin-bottom:0em;
background: #fff;
margin:0 -5px -5px -5px;
box-shadow: 0 5px 6px #dddddd;
border-radius: 3px;
}
}
@media screen and (max-width: 768px){
#container{
background-color: white;
}
}
.twitter-tweet{
margin: auto;
}
.line {
border-bottom: dotted 1.5px #D00328;
padding-top: 1em;
margin: 0 0 -.5em;
}
.center {
margin-left: auto;
margin-right: auto;
display: block
}
.video-wrap {
position: relative;
}
.video-btn {
content: "";
position: absolute;
top:0;
left:0;
right:0;
bottom:40px; /*コントローラー分下部に余白を*/
cursor: pointer;
}
.upright {
-webkit-text-orientation: upright;
text-orientation: upright;
}
/*ここまで*/
@media screen and (min-width: 767px) {
.page-index .penta,
.page-archive .penta{
display: none;
}
body:not(.page-index) .penta{
background-size: cover;
background-position: center center;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: -1;
filter: brightness(300%) contrast(40%) saturate(40%) blur(10px);
}}
body:not(entry-date) :not(.page-index)
.page-archive .date {
display: inline-block;
padding: 3px 5px;
color: #fff;
box-sizing:border-box;
font-family: 'blogicon';
content: '\f043';
}
body:not(.date entry-date) :(entry-date)
.page-archive .date-year, .date-month, .date-day {
color:white;
color:black;
color:black;
}
body:not(.page-archive) :not(.page-index)
.entry-title .date-year .date-month .date-day {
color:white;
color:white;
color:white;
}
/*タイトル*/
.entry-title {
}
.page-archive .entry-title{
font-weight: bold!important;
font-size: 15px!important;
padding: .75em 1em!important;
border: 1px solid #ccc!important;
border-top: 3px solid #E13A3E!important;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%)!important;
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%)!important;
box-shadow: 0 -1px 0 rgba(255, 255, 255, 1) inset!important;
}
/*ここまで*/
/*ここまで*/
/* 日付背景色付き */
.entry-header {
position: relative;
}
/*日付*/
.entry-date a::before {
margin-right: 1px;
font-family: 'blogicon';
content: '\f043';
}
.entry-date .hyphen {
display: none;
}
.entry-date .date-month::before,
.entry-date .date-day::before {
content: '.';
color:black;
}
.page-archive .date {
display: inline-block;
padding: 3px 5px;
color: #D00328;
box-sizing:border-box;
background:whitesmoke;
}
/* Pager */
/*ページャー（２段）*/
.pager
{display:block;
font-size:90%;margin-bottom:1em;}
.pager > span
{max-width:100%;}
.pager-prev
{float:left;}
.pager-next
{float:right;}
.pager::after
{display:block;clear:both;content: " ";visibility: hidden;}
@media (max-width: 767px) {.page-index .pager{padding:0 1em;}}
.pager {
position: relative;
margin: 2em 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.pager a {
color:black;
}
.pager a:hover {
color:cdcdcd;
}
.pager.autopagerize_insert_before .pager-prev {
padding: .5em 0;
border: 1px solid #ddd;
border-radius: 3px;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.autopagerize_insert_before .pager-prev a {
padding: .5em 1em .5em 2em;
}
.pager.autopagerize_insert_before .pager-prev:before {
content: "";
font-weight: 900;
position: absolute;
left: .5em;
top: .5em;
color: RGB(68, 153, 187);
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.autopagerize_insert_before .pager-next {
padding: .5em 0;
border: 1px solid #ddd;
margin-left: auto;
border-radius: 3px;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.autopagerize_insert_before .pager-next a {
padding: .5em 2em .5em 1em;
}
.pager.autopagerize_insert_before .pager-next:after {
content: "";
font-weight: 900;
position: absolute;
right: .5em;
top: .5em;
color: RGB(68, 153, 187);
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.pager-permalink .pager-prev {
margin-right: .25em;
padding: .5em;
border: 1px solid #ddd;
border-radius: 3px;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.pager-permalink .pager-next {
margin-left: auto;
padding: .5em;
border: 1px solid #ddd;
border-radius: 3px;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
/*はてな目次のデザイン*/
ul.table-of-contents {
border: 1px solid #ccc;
padding: 1.2em 1em 1em 2em;
margin: 0.5em 0 2em 0;
position: relative;
background-color: #fff;
border-radius: 3px;
}
ul.table-of-contents:before {
content: "Index";
display: inline-block;
position: absolute;
top: -0.6em;
left: 0.5em;
background: #fff;
padding: 0 0.5em;
font-weight: 700;
color: #ccc;
}
.table-of-contents ul ul{
display: none;/*3階層以降を消す*/
}
.table-of-contents li,
.table-of-contents ul{
list-style-type: none;/*表示一時的に消す*/
}
ul.table-of-contents li:before {
content: "▼"; /*記号に変更*/
color: #b0d7fd;
padding-right: 0.5em;
font-size: 80%;
vertical-align: text-top;
}
}
.table-of-contents ul{
font-size: 95%;/*h3以降小さく*/
}
.table-of-contents a{
color:#444;
text-decoration: none;
}
.table-of-contents a:hover {
color: #ccc ;/* リンクにマウスを重ねた時の色 */
text-decoration: underline;
}
/*隠れる目次のデザイン*/
.table-of-contents{
display: none;
}
.show-area{
display: inline-block;
font-size:0.7em;
padding: 10px;
border-radius: 5px;
cursor: pointer;
margin-bottom: 0;
color: #4f96f6;
}
/*archive-page*/
.archive-entries .entry-thumb{
display: none;
}
.archive-entries{
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
}
.archive-entries .archive-entry{
width: 49%;
padding: 200px 0 0 0;
position: relative;
}
.archive-entries .entry-thumb-link{
display: block;
width: 100%;
height: 200px;
background-position: center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
}
.archive-entries .date{
position: absolute;
right: 0px;
top : 175px;
z-index: 10;
}
.archive-entries .entry-title{
padding: 0.5em 0 0 0;
}
/*はてなスター*/
.star-container {
display : none;
}
@media (max-width: 767px) {
.entry {
border: none;
padding;
}
}
#top-box .breadcrumb {
background:white;
}
/* プロフィールimg*/
.profile-img {
text-align: center;
display: inline-block;
padding-top:5px;
}
.profile-img {
text-align: center;
border-radius: 50%;
border: solid 1px black;/*丸いりんかくを作る*/
content: '';/*何も入れない*/
display: inline-block;/*忘れずに！*/
width: 100px;/*画像の幅*/
height: 100px;/*画像の高さ*/
background-image: url(https://cdn-ak.f.st-hatena.com/images/fotolife/s/samham0105/20181031/20181031225843.png);
background-size: contain;
vertical-align: middle;
}
/* サイドバーのプロフィール*/
.urllist-with-thumbnails li .urllist-image {
border-radius: 5%; /* 角を少し丸める */
}
/* 記事欄に背景色と影*/
@media screen and (min-width: 767px) {
.entry-inner {
background-color:#fff;
padding:10px 54px 42px;
border-radius: 2px;/* 記事欄枠の角を丸くする*/
}
}
/*サイドバーのカスタマイズ*/
@media screen and (min-width: 767px) {
.hatena-module{
margin-bottom:0em;
font-size:14px;
background: #fff;
padding:2em 1em!important;
margin:0 -5px -5px -5px;
box-shadow: 0 1px 6px #dddddd;
padding: 1me 1em 1em 1em;
border-radius: 3px;
padding:1px 1px;
}
.entry {
border-radius:5px 5px 0px 0px / 5px 5px 0px 0px;/*角の丸み*/
margin-bottom:0em;
background: #fff;
margin:0 -5px -5px -5px;
box-shadow: 0 5px 6px #dddddd;
border-radius: 3px;
}
}
@media screen and (max-width: 768px){
#container{
background-color: white;
}
}
.twitter-tweet{
margin: auto;
}
.line {
border-bottom: dotted 1.5px #D00328;
padding-top: 1em;
margin: 0 0 -.5em;
}
.center {
margin-left: auto;
margin-right: auto;
display: block
}
.video-wrap {
position: relative;
}
.video-btn {
content: "";
position: absolute;
top:0;
left:0;
right:0;
bottom:40px; /*コントローラー分下部に余白を*/
cursor: pointer;
}
.upright {
-webkit-text-orientation: upright;
text-orientation: upright;
}
/*ここまで*/
@media screen and (min-width: 767px) {
.page-index .penta,
.page-archive .penta{
display: none;
}
body:not(.page-index) .penta{
background-size: cover;
background-position: center center;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: -1;
filter: brightness(300%) contrast(40%) saturate(40%) blur(10px);
}}
body:not(entry-date) :not(.page-index)
.page-archive .date {
display: inline-block;
padding: 3px 5px;
color: #fff;
box-sizing:border-box;
font-family: 'blogicon';
content: '\f043';
}
body:not(.date entry-date) :(entry-date)
.page-archive .date-year, .date-month, .date-day {
color:white;
color:black;
color:black;
}
body:not(.page-archive) :not(.page-index)
.entry-title .date-year .date-month .date-day {
color:white;
color:white;
color:white;
}
/*タイトル*/
.entry-title {
}
.page-archive .entry-title{
font-weight: bold!important;
font-size: 15px!important;
padding: .75em 1em!important;
border: 1px solid #ccc!important;
border-top: 3px solid #E13A3E!important;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%)!important;
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%)!important;
box-shadow: 0 -1px 0 rgba(255, 255, 255, 1) inset!important;
}
/*ここまで*/
/*ここまで*/
/* 日付背景色付き */
.entry-header {
position: relative;
}
/*日付*/
.entry-date a::before {
margin-right: 1px;
font-family: 'blogicon';
content: '\f043';
}
.entry-date .hyphen {
display: none;
}
.entry-date .date-month::before,
.entry-date .date-day::before {
content: '.';
color:black;
}
.page-archive .date {
display: inline-block;
padding: 3px 5px;
color: #D00328;
box-sizing:border-box;
background:whitesmoke;
}
/* Pager */
/*ページャー（２段）*/
.pager
{display:block;
font-size:90%;margin-bottom:1em;}
.pager > span
{max-width:100%;}
.pager-prev
{float:left;}
.pager-next
{float:right;}
.pager::after
{display:block;clear:both;content: " ";visibility: hidden;}
@media (max-width: 767px) {.page-index .pager{padding:0 1em;}}
.pager {
position: relative;
margin: 2em 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.pager a {
color:black;
}
.pager a:hover {
color:cdcdcd;
}
.pager.autopagerize_insert_before .pager-prev {
padding: .5em 0;
border: 1px solid #ddd;
border-radius: 3px;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.autopagerize_insert_before .pager-prev a {
padding: .5em 1em .5em 2em;
}
.pager.autopagerize_insert_before .pager-prev:before {
content: "";
font-weight: 900;
position: absolute;
left: .5em;
top: .5em;
color: RGB(68, 153, 187);
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.autopagerize_insert_before .pager-next {
padding: .5em 0;
border: 1px solid #ddd;
margin-left: auto;
border-radius: 3px;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.autopagerize_insert_before .pager-next a {
padding: .5em 2em .5em 1em;
}
.pager.autopagerize_insert_before .pager-next:after {
content: "";
font-weight: 900;
position: absolute;
right: .5em;
top: .5em;
color: RGB(68, 153, 187);
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.pager-permalink .pager-prev {
margin-right: .25em;
padding: .5em;
border: 1px solid #ddd;
border-radius: 3px;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
.pager.pager-permalink .pager-next {
margin-left: auto;
padding: .5em;
border: 1px solid #ddd;
border-radius: 3px;
background: -webkit-linear-gradient(top, #fff 0%, #f0f0f0 100%);
background: linear-gradient(to bottom, #fff 0%, #f0f0f0 100%);
}
/*はてな目次のデザイン*/
ul.table-of-contents {
border: 1px solid #ccc;
padding: 1.2em 1em 1em 2em;
margin: 0.5em 0 2em 0;
position: relative;
background-color: #fff;
border-radius: 3px;
}
ul.table-of-contents:before {
content: "Index";
display: inline-block;
position: absolute;
top: -0.6em;
left: 0.5em;
background: #fff;
padding: 0 0.5em;
font-weight: 700;
color: #ccc;
}
.table-of-contents ul ul{
display: none;/*3階層以降を消す*/
}
.table-of-contents li,
.table-of-contents ul{
list-style-type: none;/*表示一時的に消す*/
}
ul.table-of-contents li:before {
content: "▼"; /*記号に変更*/
color: #b0d7fd;
padding-right: 0.5em;
font-size: 80%;
vertical-align: text-top;
}
}
.table-of-contents ul{
font-size: 95%;/*h3以降小さく*/
}
.table-of-contents a{
color:#444;
text-decoration: none;
}
.table-of-contents a:hover {
color: #ccc ;/* リンクにマウスを重ねた時の色 */
text-decoration: underline;
}
/*隠れる目次のデザイン*/
.table-of-contents{
display: none;
}
.show-area{
display: inline-block;
font-size:0.7em;
padding: 10px;
border-radius: 5px;
cursor: pointer;
margin-bottom: 0;
color: #4f96f6;
}
/*archive-page*/
.archive-entries .entry-thumb{
display: none;
}
.archive-entries{
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
}
.archive-entries .archive-entry{
width: 49%;
padding: 200px 0 0 0;
position: relative;
}
.archive-entries .entry-thumb-link{
display: block;
width: 100%;
height: 200px;
background-position: center center;
background-size: cover;
position: absolute;
top: 0;
left: 0;
}
.archive-entries .date{
position: absolute;
right: 0px;
top : 175px;
z-index: 10;
}
.archive-entries .entry-title{
padding: 0.5em 0 0 0;
}
/*はてなスター*/
.star-container {
display : none;
}
@media (max-width: 767px) {
.entry {
border: none;
padding;
}
}
#top-box .breadcrumb {
background:white;
}
/* プロフィールimg*/
.profile-img {
text-align: center;
display: inline-block;
padding-top:5px;
}
.profile-img {
text-align: center;
border-radius: 50%;
border: solid 1px black;/*丸いりんかくを作る*/
content: '';/*何も入れない*/
display: inline-block;/*忘れずに！*/
width: 100px;/*画像の幅*/
height: 100px;/*画像の高さ*/
background-image: url(https://cdn-ak.f.st-hatena.com/images/fotolife/s/samham0105/20181031/20181031225843.png);
background-size: contain;
vertical-align: middle;
}
/* サイドバーのプロフィール*/
.profile-box{
border-radius:5px 5px 0px 0px / 5px 5px 0px 0px;/*角の丸み*/
text-align: center;
margin-bottom:0em;
font-size:14px;
background: #fff;
padding:2em 1em!important;
border-radius: 3px;
}
.profile-box a{
color: #555;
text-decoration: underline; /* リンクの下線あり・なし */
}
.profile-inbox{
border-radius:0px 0px 5px 5px / 0px 0px 5px 5px;/*角の丸み*/
background: #D00328;
text-align: center;
padding-top:1em!important;
padding-bottom:1em!important;
margin:0 -5px -5px -5px;
font-size:14px;
color: #fff;
}
.profile-inbox a,.profile-inbox a:hover{
color: #fff;
}
/* プロフィール */
.p-box{
box-shadow: 0 0 1px #dddddd;
padding: 1me 1em 1em 1em;
border-radius: 3px;
box-shadow: 0 3px 6px rgba(0,0,0,.3);
}
.p-box a{
color: #6490cd;
text-decoration: none;
}
.p-box a:hover {
opacity: 0.8;
filter: alpha(opacity=60);
-moz-opacity:0.6;
}
/*サイドバーフォローボタン*/
.sidebar-follow-buttons{
width: 100%;
text-align: center;
letter-spacing: -.40em;
}
.sidebar-follow-buttons a {
display: inline-block;
letter-spacing: normal;
width: 40px;
margin:2px;
margin-top:15px;
height: 40px;
line-height: 40px;
font-size: 20px;
text-align: center;
text-decoration: none;
border-radius: 0px;
text-align: center;
vertical-align: middle;
overflow: hidden;
font-weight: bold;
transition: .3s;
}
.sidebar-follow-buttons a:hover {
transition: all .3s;
}
.sidebar-follow-buttons .inner-text {
font-size:12px;
padding-left:5px;
}
.sidebar-follow-buttons .hatena {
color: #fff;
border: 0px solid #375A7F;
background: #D00328;
}
.sidebar-follow-buttons .hatena:hover {
color: #38393C;
}
.sidebar-follow-buttons .twitter {
color: #fff;
border: 0px solid #375A7F;
background: #D00328;
}
.sidebar-follow-buttons .twitter:hover {
color: #55acee;
}
.sidebar-follow-buttons .feedly {
color: white;
border: 0px solid #375A7F;
background: #D00328;
}
.sidebar-follow-buttons .feedly:hover {
color: #6cc655;
}
}
.show-area{
display: inline-block;
font-size:0.7em;
padding: 10px;
border-radius: 5px;
cursor: pointer;
margin-bottom: 0;
color: #4f96f6;
}
.neos21-share {
width:100%;
padding:0;
list-style:none;
}
.neos21-share li {
float:left;
width:25%;
}
.neos21-share li:first-child {
border-top-left-radius:3px;
border-bottom-left-radius:3px;
}
.neos21-share li:last-child {
border-top-right-radius:3px;
border-bottom-right-radius:3px;
}
.neos21-share a {
display:block;
padding:3px 0;
color:#fff !important;
text-align:center;
transition:0.3s;
}
.neos21-share a:hover {
background:rgba(255, 255, 255, 0.2);
}
.neos21-share i {
display:block;
margin:0 0 -5px;
font-size:140%;
}
.neos21-share span {
font-size:70%;
}
.neos21-share-hatebu { background:#006fbb; }
.neos21-share-twitter { background:#55acee; }
.neos21-share-facebook { background:#3a5795; }
.neos21-share-pocket { background:#ed4055; }
/* スマートフォン1列 */
@media only screen and (max-width:767px){
#entry-footer-secondary-modules .related-entries li {
float: none;
width: 100%;
height: auto;
}
}
.page-archive .archive-entries .entry-description {
margin: 0 0 1em;
line-height: 1.6em;
font-size: 75%;
}
a.archive-entries-see-more{position:absolute;top:0;width:100%;height:100%;color:transparent;}
.hatena-module .hatena-urllist li .urllist-image {
border: 1px solid #dfe5e7;
box-sizing: border-box;
}
/* To Top */
.toTop-nav {
position: fixed;
bottom: 10px;
right: 10px;
display: -webkit-flex;
display: flex;
padding: 0;
margin: 0;
z-index: 999; }
.toTop-nav li {
list-style-type: none;
background: rgba(0, 0, 0, 0.3);
border-radius: 50px;
text-align: center; }
.toTop-nav li:first-child {
margin-right: 10px; }
.toTop-nav li a {
display: block;
width: 50px;
height: 50px;
font-size: 30px;
line-height: 50px; }
.toTop-nav li a {
color: #fff;
text-decoration: none; }
.toTop-nav li a:visited {
color: #fff; }
.toTop-nav li a:hover {
color: #fff;
text-decoration: underline; }
.toTop-nav li a:active, .toTop-nav li a:focus {
color: #fff; }
.toTop-nav li a:hover {
text-decoration: none; }
#entry-footer-secondary-modules .hatena-module-related-entries{padding-top:1rem;}
#entry-footer-secondary-modules .related-entries{
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#entry-footer-secondary-modules .related-entries-item{
width: 46.5%;
border:1px solid #e0e0e0;
border-radius:1px;
margin: 0 0 0.5em 0;
padding: 0.5em;
}
#entry-footer-secondary-modules .related-entries-title{
font-weight:bold;
font-size; 100%;
padding: 0 0 0.5em 0;
}
#entry-footer-secondary-modules .related-entries-entry-body{
overflow:hidden;
}
#entry-footer-secondary-modules .related-entries-image{
border-radius:0;width:100px;height:100px;
}
#entry-footer-secondary-modules .related-entries-item:nth-of-type(5){
display:none;
}
.customized-footer{
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
table {
width: 100%;
}
td {
text-align: center;
vertical-align: middle;
}
a{/*リンクされた文字*/
color:#2a2a2a; /*←色指定*/
font-style:normal;
}
.entry-content a {
color: #E13A3E;
}
a:hover {/*マウスをのせたとき*/
color:#EA7577
text-decoration:none;
}
a:active {/*クリック中*/
text-decoration:none;
}
.hatena-citation{
display:none;
}
#footer p {
display: none;
}
.footer-address-name:before {
font-family:"FontAwesome";
content:"\f1f9";
margin-right:4px;
}
#footer a {
color: white;
}
#footer a :hover {
color:#E13A3E;
}
#footer {
padding: 20px;
text-align: center;
background: #353535;/* 背景色 */
font-size: 12px;
color:#fff;/* 文字の色 */
margin-bottom: 0;
}
.breadcrumb div {display: inline;}
.breadcrumb div a{
word-wrap:break-word;
color:#E13A3E;
background:white;
border-radius: 5px;
left:10px;
}
.breadcrumb div a:hover {
word-wrap:break-word;
opacity: .6;
border-radius: 5px;
left:10px;
}
.breadcrumb::before {
content: "\f017";/* 左のアイコン */
font-family: blogicon;
padding-right:5px;
vertical-align: text-bottom;
}
/* ******** SNSボタン ******** */
.snsbtns1, .snsbtns2, .snsbtns3, .snsbtns4{display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;margin:0 0 1rem 0;position:relative;}
.snsbtns1 a, .snsbtns2 a, .snsbtns3 a, .snsbtns4 a{display:block;width:100%;padding:1em 0;color:#fff;text-align:center;line-height:1;font-size:110%;margin-left:0.2rem;position:relative;overflow:hidden;}
.snsbtns1 a:hover, .snsbtns2 a:hover{box-shadow:0px 2px 3px rgba(0,0,0,0.2);transition: .5s;}
.snsbtns1 a:nth-of-type(1), .snsbtns2 a:nth-of-type(1), .snsbtns3 a:nth-of-type(1), .snsbtns4 a:nth-of-type(1){margin-left:0;}
.snsbtns1 a::before, .snsbtns3 a::before, .snsbtns4 a::before{font-family:blogicon;margin-right:0.5em;font-weight:normal;}
.sns-fb::before{content:'\f036';}
.sns-tw::before{content:'\f035';}
.sns-po::before{content:'\f008';}
.sns-hb::before{content:'\f027';}
.sns-fb{background:#365899;}
.sns-tw{background:#1b95e0;}
.sns-po{background:#EF4056;}
.sns-hb{background:#008fde;}
.sns-fb:hover{background:#4267b2;}
.sns-tw:hover{background:#31a3ea;}
.sns-po:hover{background:#f65065;}
.sns-hb:hover{background:#009FF8;}
.snsbtns2 a::before{font-family:blogicon;position:absolute;top:0rem;left:-1rem;font-size:420%;color:rgba(255,255,255,0.25);}
#content a {
text-decoration: none;
}
#content a:hover {
opacity: .6;
}
#box2-img a:hover {
opacity: .6;
}
.urllist-date-link a::before {
font-family: 'blogicon';
content: '\f043';
}
.urllist-categories a::before {
font-family: 'blogicon';
content: '\f022';
}
/*関連記事のタイトル*/
a.urllist-title-link.urllist-title{
text-decoration: none;
color: #525252;
font-weight: bold;
}
/*関連記事のタイトル*/
a.urllist-title-link.urllist-title:hover {
opacity: .6;
}
.page-index .hatena-module-recent-entries{display:none;}
.hatena-urllist{margin:0 0 0 0;padding:0 0 0 0;}
.hatena-urllist li{list-style-type:none;}
.hatena-urllist li a{}
.hatena-urllist li:first-child{}
.hatena-urllist li:last-child{}
.urllist-item-inner{font-size:12px;line-height:18px;}
.urllist-date-link{}
.urllist-date-link a{font-weight:bold;color:#E13A3E;}
.urllist-title{}
.recent-entries-item{min-height:72px;margin:0 0 1em 0;}
.recent-entries-item:last-of-type{margin:0 0 0 0;}
.hatena-module-archive .hatena-module-body{font-size:0.8rem;}
#entry-footer-secondary-modules.recent-entries,
.entries-access-ranking,
.related-entries {
margin: 0 0 10px 0;
padding: 10;
}
#entry-footer-secondary-modules .hatena-module-title{
font-size:0;
}
#entry-footer-secondary-modules .hatena-module-title::before{
content:'\f019 こんな記事も書いています';
font-size:0.9rem;
font-weight:bold;
margin-bottom: 2px;
margin-top: 2px;
}
.customized-footer{
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
.snsbtn-bottom{
-webkit-order: -2;
order: -2;
}
.iine{
-webkit-order: 3;
order: 3;
}
.entry-footer-modules{
-webkit-order: 1;
order: 1;
}
/* ^^^^^^^^ Milliard関連記事 ^^^^^^^^^^ */
.page-index .comment-box, .page-category-category_name .comment-box, .page-entries-year-month-day .comment-box{
display:none;
}
#container {
padding-top: 0px;
}
.box-b {
padding: 0.5em 1em;
margin: 2em 0;
font-weight: normal;
border: solid 1.5px #cccccc;
}
.box-b p {
margin: 0;
padding: 0;
}
.s-tbl tr:hover {
background: #ffffa3;
}
#topmenu {
background-repeat: repeat-x;
height: 48px;
line-height: 42px;
width: 100%;
position: absolute;
margin: 0px;
padding: 0px;
background-image: url(img/topmenu.jpg);
background-position: left top;
font-size: 13px;
display: none; //ここに追記
}
body {
font-family: 'MS Sans Serif',sans-serif;
}
.entry-content img.hatena-fotolife{
width:auto ;
height:auto ;
}
#globalheader-container {
display: none;
}
/* SNSフォローボタン上テキストのCSS指定 */
.sns-txt{
display: inline-block;
margin: 10px 0;
width: 100%;
text-align: center;
line-height: 2em;
font-size: 13px; /* 文字の大きさを変える時は変更する */
border-top: 1px solid #3b3b3b; /* 上のボーダーの色や太さを変える時は変更 */
border-bottom: 1px solid #3b3b3b; /* 下のボーダーの色や太さを変える時は変更 */
}
/* SNSフォローボタン枠のCSS指定 */
.sns-follow{
display: table;
width: 100%;
margin: 0 auto 32px;
}
/* SNSフォローボタンのCSS指定 */
.sns-follow a {
display: table-cell;
font-size: 35px; /* SNSマークの大きさを変えたい場合は変更する */
text-align: center;
vertical-align: middle;
text-decoration: none;
width: 25%; /* SNSを増やす場合は変更する。 合計で100%以下になるように。 */
height: 48px; /* ボックスの高さを変えたい場合は変更する */
layout-grid-line: 50px; /* 変更しない IE7以下対応 */
color: #fff; /* SNSロゴの色を変えたい場合は変更する */
}
.sns-follow .hatena-button {
transition: 1s ease;
background: #54575d;
}
.sns-follow .twitter-button {
transition: 1s ease;
background: #5db9ff; /* 背景色を変更したい場合は変更する */
}
.sns-follow .facebook-button {
transition: 1s ease;
background: #395eaf; /* 背景色を変更したい場合は変更する */
}
.sns-follow .feedly-button {
transition: 1s ease;
background: #84c34c; /* 背景色を変更したい場合は変更する */
}
/* SNSフォローボタンオーバーフロー時のCSS指定 */
.sns-follow .hatena-button:hover {
transition: .3s ease;
color: #3d3f44; /* 背景色を変更したい場合は変更する */
background:#fff;
}
.sns-follow .twitter-button:hover {
transition: .3s ease;
color: #55acee; /* 背景色を変更したい場合は変更する */
background:#fff;
}
.sns-follow .facebook-button:hover {
transition: .3s ease;
color: #305097; /* 背景色を変更したい場合は変更する */
background:#fff;
}
.sns-follow .feedly-button:hover {
transition: .3s ease;
color: #75ad43; /* 背景色を変更したい場合は変更する */
background:#fff;
}
/*aboutページ、デフォdl（プロフィール〜読者までを囲うエリア）*/
.page-about dl {
text-align: center;
margin: 0;
}
/*aboutページ、デフォdt（プロフィール等のタイトル）*/
.page-about dt {
text-align: center;
font-weight: bold;
font-size: 1.3em;
color: #676F74;
margin-bottom: 15px;
}
/*aboutページ、デフォdd→吹き出し風に*/
.page-about dd {
text-align: center;
position: relative;
display: inline-block;
margin: 0.5em auto 1.5em;
padding: 7px 10px;
min-width: 120px;
max-width: 100%;
color: #676F74;
font-size: 16px;
background: #FFF;
border: solid 3px #676F74;
box-sizing: border-box;
border-radius: 10px;
}
.page-about dd:before{
content: "";
position: absolute;
top: -23px;
left: 50%;
margin-left: -15px;
border: 12px solid transparent;
border-bottom: 12px solid #FFF;
z-index: 2;
}
.page-about dd:after{
content: "";
position: absolute;
top: -30px;
left: 50%;
margin-left: -17px;
border: 14px solid transparent;
border-bottom: 14px solid #676F74;
z-index: 1;
}
/*aboutページ、読者数（＼99人／のところ）*/
.about-subscription-count {
display: table;
position: relative;
padding: 0 30px;
color: #676F74;
font-size: 1.5em;
font-weight: bold;
line-height: 1;
letter-spacing: 1px;
margin: 12px auto;
}
.about-subscription-count:before,
.about-subscription-count:after {
display: inline-block;
position: absolute;
top: 50%;
width: 20px;
height: 3px;
border-radius: 3px;
background-color: #676F74;
content: "";
}
.about-subscription-count:before {
left: 0;
-webkit-transform: rotate(50deg);
transform: rotate(50deg);
}
.about-subscription-count:after {
right: 0;
-webkit-transform: rotate(-50deg);
transform: rotate(-50deg);
}
/*aboutページ、読者アイコン（拡大＆円形＆ふわっとアニメーション）*/
.page-about .entry-content img.profile-icon {
height: 45px;
width: 45px;
border-radius: 50%;
margin: 4px 4px;
transition: .3s;
}
.page-about .entry-content img.profile-icon:hover {
box-shadow: 0 10px 20px -4px rgba(0,0,0,.25);
transform: translateY(-3px);
}
/*tableをスクロールさせる*/
/*tableのセル内にある文字の折り返しを禁止*/
table {
overflow: auto;
white-space: nowrap;
display:block;
width:auto;
}
table tbody {
width: 100%;
display:table;
}
/*tableにスクロールバーを追加*/
table::-webkit-scrollbar {
height: 5px;
}
/*tableにスクロールバーを追加*/
table::-webkit-scrollbar-track {
background: #F1F1F1;
}
/*tableにスクロールバーを追加*/
table::-webkit-scrollbar-thumb {
background: #BCBCBC;
}
.entry-content {
font-size:15.5px;
line-height:1.8em;
}
{Title}{BookmarkCount}
{CategoryLinks}
{EntryBody}
.box1 {
padding: 0.5em 1em;
margin: 2em 0;
font-weight: bold;
border: solid 3px #000000;
}
.box1 p {
margin: 0;
padding: 0;
}
.box27 {
position: relative;
margin: 2em 0;
padding: 0.5em 1em;
border: solid 3px #62c1ce;
}
.box27 p {
margin: 0;
padding: 0;
}
GSW2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #0068b2;/*左線*/
}
DET2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #0B479D;/*左線*/
}
CHA2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #008DA8;/*左線*/
}
SAC2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #5A2D81;/*左線*/
}
UTA2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #0C2340;/*左線*/
}
BOS2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #008248;/*左線*/
}
TOR2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #A0A0A3;/*左線*/
}
POR2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #E13A3E;/*左線*/
}
DEN2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #5091CD;/*左線*/
}
MIN2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #002B5C;/*左線*/
}
DAL2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #007DC5;/*左線*/
}
LAC2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #ED174C;/*左線*/
}
CHI2 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: black;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #CE1141;/*左線*/
}
MIA{
background: #98002E;
box-shadow: 0px 0px 0px 4px #F9A01B;
border: solid 2px #000000;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
CHA{
background: #1D1160;
box-shadow: 0px 0px 0px 4px #00788C;
border: solid 2px #888B8D;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
ORL{
background: #0B77BD;
box-shadow: 0px 0px 0px 4px #C2CCD2;
border: solid 2px #000000;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
GSW{
background: #0068b2;
box-shadow: 0px 0px 0px 4px #FFCD34;
border: solid 2px #FFFFFF;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
HOU{
background: #CE1141;
box-shadow: 0px 0px 0px 4px #FDB927;
border: solid 2px #000000;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
WAS{
background: #002B5C;
box-shadow: 0px 0px 0px 4px #E31837;
border: solid 2px #C4CED4;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
NOP{
background: #002B5C;
box-shadow: 0px 0px 0px 4px #E31837;
border: solid 2px #B4975A;
padding: 0.2em 0.5em;color: white;
border-radius: 0.1em;/*角の丸み*/
}
MIL{
background: #00471B;
box-shadow: 0px 0px 0px 4px #EEE1C6;
border: solid 2px #0057B8;
padding: 0.2em 0.5em;color: white;
border-radius: 0.1em;/*角の丸み*/
}
NYK{
background: #006BB6;
box-shadow: 0px 0px 0px 4px #F58426;
border: solid 2px #BEC0C2;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
ATL{background: #E03A3E;
box-shadow: 0px 0px 0px 4px #C4D600;
border: solid 2px #25282A;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/}
BOS{
background: #008248;
box-shadow: 0px 0px 0px 4px #BA9653;
border: solid 2px #A63732;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
BRK{
background: #000000;
box-shadow: 0px 0px 0px 4px #FFFFFF;
border: solid 2px ;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
CHI{
background: #CE1141;
box-shadow: 0px 0px 0px 4px #000000;
border: solid 2px ;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
CLE{
background: #6F2633;
box-shadow: 0px 0px 0px 4px #FFB81C;
border: solid 2px #041E42;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
DAL{
background: #007DC5;
box-shadow: 0px 0px 0px 4px #C4CED4;
border: solid 2px #000000;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
DEN{
background: #00285E;
box-shadow: 0px 0px 0px 4px #5091CD;
border: solid 2px #FDB927;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
DET{
background: #ED174C;
box-shadow: 0px 0px 0px 4px #0067B1;
border: solid 2px #002D62;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
IND{
background: #002D62;
box-shadow: 0px 0px 0px 4px #FDBB30;
border: solid 2px #BEC0C2;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
LAC{
background: #ED174C;
box-shadow: 0px 0px 0px 4px #006BB6;
border: solid 2px #BEC0C2;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
LAL{
background: #552583;
box-shadow: 0px 0px 0px 4px #FDB927;
border: solid 2px #000000;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
MEM{
background: #00285E;
box-shadow: 0px 0px 0px 4px #6189B9;
border: solid 2px #B8CFE9;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
MIN{
background: #002B5C;
box-shadow: 0px 0px 0px 4px #005083;
border: solid 2px #7AC143;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
OKC{
background: #007AC1;
box-shadow: 0px 0px 0px 4px #002D62;
border: solid 2px #F05133;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
PHI{
background: #006BB6;
box-shadow: 0px 0px 0px 4px #ED174C;
border: solid 2px #FFFFFF;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
PHX{
background: #E56020;
box-shadow: 0px 0px 0px 4px #1D1160;
border: solid 2px #F9A01B;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
POR{
background: #E13A3E;
box-shadow: 0px 0px 0px 4px #C4CED4;
border: solid 2px #000000;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
SAC{
background: #5A2D81;
box-shadow: 0px 0px 0px 4px #63727A;
border: solid 2px #000000;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
SAS{
background: #C4CED4;
box-shadow: 0px 0px 0px 4px #000000;
border: solid 2px #ffffff;
padding: 0.2em 0.5em;
color: black;
border-radius: 0.1em;/*角の丸み*/
}
TOR{
background: #CD1141;
box-shadow: 0px 0px 0px 4px #A0A0A3;
border: solid 2px #000000;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
UTA{
background: #0C2340;
box-shadow: 0px 0px 0px 4px #00471B;
border: solid 2px #F9A01B;
padding: 0.2em 0.5em;
color: white;
border-radius: 0.1em;/*角の丸み*/
}
/*続きを読むボタン*/
a.entry-see-more {
word-wrap:break-word;
border: solid 1px darkcyan;
padding: 5px 20px;
color:darkcyan;
background:white;
border-radius: 5px;
float:right; //右寄せのおまじない
}
/*続きを読むボタンのマウスオーバー*/
a.entry-see-more:hover {
word-wrap:break-word;
border: solid 1px darkcyan;
padding: 5px 20px;
color:none;
background:darkcyan;
border-radius: 5px;
float:right; //右寄せのおまじない
}
/* 記事本文のカテゴリーカスタマイズ */
.categories a {
color: black; /* 文字色 */
background: none; /* 背景色 */
border: solid 1px #b7b7b7;
padding: 5px 8px;
font-weight: bold;/* 文字太さ */
font-size: 9px;
border-radius: 2px;
letter-spacing: 0.05em;
text-decoration: none;
display: inline-block;
}
/* 記事一覧カテゴリーカスタマイズ */
.page-archive .categories a {
color: black;
border: solid 1px #b7b7b7;
font-size: 9px;
background: white;
padding: 5px 8px;
border-radius: 2px;
text-decoration: none;
display: inline-block;
margin-right: 2px;
font-weight: bold;
}
.categories a:hover {
color: white; /* ホバー時の文字色 */
background-color: #b7b7b7; /* ホバー時の背景色 */
}
.page-archive .categories a:hover{
color: white; /* ホバー時の文字色 */
background-color: #b7b7b7; /* ホバー時の背景色 */
}
/*--------------------------------------
サイドバーのタイトルの見た目
--------------------------------------*/
.hatena-module-title{
font-size: 12pt;
color: #4d504c;
font-weight: bold;
border-top: 2px solid #E13A3E;
border-bottom: 2px solid #000000;
padding:5px 0px 5px 15px;
}
/*サイドバータイトルblogicon*/
.hatena-module-title:before{
font-family:blogicon;
font-size: 1.2em;
font-weight: normal;
font-style: normal;
display: inline-block;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.hatena-module-profile .hatena-module-title:before {
content: '\f00c'; /*プロフィール*/
}
.hatena-module-search-box .hatena-module-title:before {
content: '\f01a'; /*検索*/
}
.hatena-module-links .hatena-module-title:before {
content: '\f042'; /*リンク*/
}
.hatena-module-recent-entries .hatena-module-title:before {
content: '\f010'; /*最新記事*/
}
.hatena-module-archive .hatena-module-title:before {
content: '\f009'; /*月別アーカイブ*/
}
.hatena-module-entries-access-ranking .hatena-module-title:before {
content: '\f01b'; /*注目記事*/
}
.hatena-module-category .hatena-module-title:before {
content: '\f04a'; /*カテゴリー*/
}
.hatena-module-recent-comments .hatena-module-title:before {
content: '\f01d'; /*最近のコメント*/
}
.hatena-module-circles .hatena-module-title:before {
content: '\f021'; /*参加グループ*/
}
.hatena-module-related-entries .hatena-module-title:before {
content: '\f019'; /*関連記事*/
}
.hatena-module-html .hatena-module-title:before {
content: '\f02d'; /*HTML編集*/
}
.balloon2-top {
position: relative;
display: inline-block;
margin: 1.5em 0;
padding: 0px 9px;
min-width: 120px;
max-width: 100%;
color: white;
font-size: 18px;
background:#62c1ce ;
border: solid 3px #62c1ce;
box-sizing: border-box;
font-weight: bold;
border-radius: 10px;
}
.balloon2-top p {
margin: 0;
padding: 0;
}
.breadcrumb li{
display:inline;/*横に並ぶように*/
list-style: none;
font-weight: bold;/*太字*/
}
.breadcrumb li:after{/* ▶を表示*/
font-family: FontAwesome;
content: '\f0da';
padding: 0 3px;
color: silver;
}
blockquote {
position: relative;
padding: 10px 15px 10px 60px;
box-sizing: border-box;
font-style: italic;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(248,248,248,1)));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f8f8f8',GradientType=0 );
color: #555;
}
blockquote:before { content: "\f10d";
font-family: FontAwesome; font-size:20px; font-weight:bold; line-height:40px; width:10px; height:30px; position:absolute; top:5px; left:20px; color:#999; }
blockquote:after { content: "\f10d";
font-family: FontAwesome; font-size:20px; font-weight:bold; text-align:left; line-height:60px; width:10px; height:30px; position:absolute; bottom:20px; right:20px; color:#999; }
blockquote p {
padding: 0;
margin: 10px 0;
line-height: 1.7;
}
blockquote cite {
display: block;
text-align: right;
color: #888888;
font-size: 0.9em;
}
.breadcrumb li:last-child:after{
content: '';
}
.breadcrumb li a {
text-decoration: none;
color: #888;
}
.box17{
margin:2em 0;
position: relative;
padding: 0.5em 1.5em;
border-top: solid 2px #62c1ce;
border-bottom: solid 2px #62c1ce;
}
.box17:before, .box17:after{
content: '';
position: absolute;
top: -10px;
width: 2px;
height: -webkit-calc(100% + 20px);
height: calc(100% + 20px);
background-color: #62c1ce;
}
.box17:before {left: 10px;}
.box17:after {right: 10px;}
.box17 p {
margin: 0;
padding: 0;
}
.box-black{
margin:2em 0;
position: relative;
padding: 0.5em 1.5em;
border-top: solid 2px black;
border-bottom: solid 2px black;
}
.center {text-align: center}
.box-black:before, .box-black:after{
content: '';
position: absolute;
top: -10px;
width: 2px;
height: -webkit-calc(100% + 20px);
height: calc(100% + 20px);
background-color: black;
}
.box-black:before {left: 10px;}
.box-black:after {right: 10px;}
.box-black p {
margin: 0;
padding: 0;
}
.box8 {
padding: 0.5em 1em;
margin: 2em 0;
color: black;
background: whitesmoke;
border-left: solid 10px black;
}
.box8 p {
margin: 0;
padding: 0;
}
.entry-header .category-tree{
list-style: none;
margin: 0px;
margin-top: 0.7em;
}
.entry-header .category-tree li{
display: inline-block;
margin-right: 0.3em;
}
.entry-header .category-tree li a{
display: inline-block;
font-size:12px;
font-weight: bold;
text-decoration: none;
white-space: nowrap;
margin-right:0.5em;
}
.entry-header .category-tree li a,
.entry-header .category-tree li a:link,
.entry-header .category-tree li a:active,
.entry-header .category-tree li a:visited,
.entry-header .category-tree li a:hover{
text-decoration: none;
font-weight: bold;
}
.entry-header .category-tree-top:after{
display: inline-block;
font-family: blogicon;
content: "\f006";
margin-left: 5px;
margin-right: 7px;
}
.entry-header .category-tree-child:after{
display: inline-block;
font-family: blogicon;
content: "\f006";
margin-left: 5px;
margin-right: 7px;
}
/*ブログカード下のURL削除*/
.hatena-citation{
display:none;
}
/*記事下のIDと時刻非表示*/
span.author.vcard{
display:none;
}
span.entry-footer-time {
display: none;
}
/*記事下のIDと時刻非表示*/
/* 邪魔なキーワード下線を消す */
a.keyword {
border: 0 !important;
text-decoration: none !important;
pointer-events: none !important;
cursor: default;
color: #5A5A5A;
}
/* カテゴリーをタグにする */
/* category css */
.hatena-module-category .hatena-module-body ul.hatena-urllist li {
list-style-type: none;
margin: 0 2px 2px;
padding: 7px;
background-color: #ffffff;/* 背景色 */
text-decoration: none;
border-radius: 5px 5px 5px 5px/* 角丸 */
}
.hatena-module-category .hatena-module-body ul.hatena-urllist li a{
color: black;/* 文字色 */
font-size: 0.8em;/* 文字サイズ */
font-weight: bold;/* 文字太さ */
border-bottom: dashed 0.5px darkcyan;
}
/* カテゴリーを枠で囲む */
.hatena-module-category .hatena-module-body ul.hatena-urllist li{
font-size: 14px !important;
border: solid 1px #E13A3E;/* 枠の色 */
border-radius: 5px;
display: inline-block;
padding: 5px;
margin-bottom: 8px;
}
div.hatena-module-category div.hatena-module-body ul li:hover {
background-color: #ffc0cb; /* お好きな色に */
}
header iframe {
vertical-align: bottom;
}
.leave-comment-title {
display: inline-block;
*display: inline;
*zoom: 1;
padding: 10px;
margin-bottom: 0;
line-height: 20px;
color: #454545;
background-color: #ffffff;
text-align: center;
vertical-align: middle;
border-radius: 4px;
background-clip: padding-box;
cursor: pointer;
font-size: 14px;
text-decoration: none;
font-weight: bold;
border: 1px solid #454545;
text-decoration: none !important;
}
.leave-comment-title::before {
font-family: "blogicon";
content: "\f01d";
padding-right: 5px;
}
.leave-comment-title:hover {
color: white;
background-color: #b7b7b7;
text-decoration: none !important;
}
#blog-title-content a {
font-size: 50px;
font-weight: 100;
color: #fff;
}
.footer-links ul {
list-style: none;
padding: 0;
}
.footer-links ul li {
display: inline-block;
padding: 0 6px;
font-size: 14.5px;
box-sizing: border-box;
}
.copyright {
font-size: 10px;
}
.box-black{
margin:2em 0;
position: relative;
padding: 0.5em 1.5em;
border-top: solid 2px black;
border-bottom: solid 2px black;
}
.box-black:before, .box-black:after{
content: '';
position: absolute;
top: -10px;
width: 2px;
height: -webkit-calc(100% + 20px);
height: calc(100% + 20px);
background-color: black;
}
.box-black:before {left: 10px;}
.box-black:after {right: 10px;}
.box-black p {
margin: 0;
padding: 0;
}
.box8 {
padding: 0.5em 1em;
margin: 2em 0;
color: black;
background: whitesmoke;
border-left: solid 10px black;
}
.box8 p {
margin: 0;
padding: 0;
}
.sample-box-1 {
padding: 0.5em 1em;
margin: 1em 0;
background: whitesmoke;
border: solid 1px whitesmoke;/*点線*/
}
.sample-box-1 p {
margin: 0;
padding: 0;
}
.movie{
position:relative;
width:100%;
padding-top:57%;
}
.movie iframe{
position:absolute;
top:0;
right:0;
width:100%;
height:100%;
}
h5 {
padding: 0.25em 0.5em;/*上下 左右の余白*/
color: #494949;/*文字色*/
background: transparent;/*背景透明に*/
border-left: solid 5px #353535/*左線*/
}
h4 {
padding: .25em 0 .5em .75em;
border-bottom: 1px solid #ccc;
}
.breadcrumb li:first-child a:before{/*家アイコン*/
font-family: FontAwesome;
content: '\f015';
font-weight: normal;
font-size: 1.1em;
color: #f3948f;
}
.breadcrumb li a:hover {
text-decoration: underline;
}
.profile-box{
border-radius:5px 5px 0px 0px / 5px 5px 0px 0px;/*角の丸み*/
text-align: center;
margin-bottom:0em;
font-size:14px;
background: #fff;
padding:2em 1em!important;
border-radius: 3px;
}
.profile-box a{
color: #555;
text-decoration: underline; /* リンクの下線あり・なし */
}
.profile-inbox{
border-radius:0px 0px 5px 5px / 0px 0px 5px 5px;/*角の丸み*/
background: #D00328;
text-align: center;
padding-top:1em!important;
padding-bottom:1em!important;
margin:0 -5px -5px -5px;
font-size:14px;
color: #fff;
}
.profile-inbox a,.profile-inbox a:hover{
color: #fff;
}
/* プロフィール */
.p-box{
box-shadow: 0 0 1px #dddddd;
padding: 1me 1em 1em 1em;
border-radius: 3px;
box-shadow: 0 3px 6px rgba(0,0,0,.3);
}
.p-box a{
color: #6490cd;
text-decoration: none;
}
.p-box a:hover {
opacity: 0.8;
filter: alpha(opacity=60);
-moz-opacity:0.6;
}
/*サイドバーフォローボタン*/
.sidebar-follow-buttons{
width: 100%;
text-align: center;
letter-spacing: -.40em;
}
.sidebar-follow-buttons a {
display: inline-block;
letter-spacing: normal;
width: 40px;
margin:2px;
margin-top:15px;
height: 40px;
line-height: 40px;
font-size: 20px;
text-align: center;
text-decoration: none;
border-radius: 0px;
text-align: center;
vertical-align: middle;
overflow: hidden;
font-weight: bold;
transition: .3s;
}
.sidebar-follow-buttons a:hover {
transition: all .3s;
}
.sidebar-follow-buttons .inner-text {
font-size:12px;
padding-left:5px;
}
.sidebar-follow-buttons .hatena {
color: #fff;
border: 0px solid #375A7F;
background: #D00328;
}
.sidebar-follow-buttons .hatena:hover {
color: #38393C;
}
.sidebar-follow-buttons .twitter {
color: #fff;
border: 0px solid #375A7F;
background: #D00328;
}
.sidebar-follow-buttons .twitter:hover {
color: #55acee;
}
.sidebar-follow-buttons .feedly {
color: white;
border: 0px solid #375A7F;
background: #D00328;
}
.sidebar-follow-buttons .feedly:hover {
color: #6cc655;
}
}
.show-area{
display: inline-block;
font-size:0.7em;
padding: 10px;
border-radius: 5px;
cursor: pointer;
margin-bottom: 0;
color: #4f96f6;
}
.neos21-share {
width:100%;
padding:0;
list-style:none;
}
.neos21-share li {
float:left;
width:25%;
}
.neos21-share li:first-child {
border-top-left-radius:3px;
border-bottom-left-radius:3px;
}
.neos21-share li:last-child {
border-top-right-radius:3px;
border-bottom-right-radius:3px;
}
.neos21-share a {
display:block;
padding:3px 0;
color:#fff !important;
text-align:center;
transition:0.3s;
}
.neos21-share a:hover {
background:rgba(255, 255, 255, 0.2);
}
.neos21-share i {
display:block;
margin:0 0 -5px;
font-size:140%;
}
.neos21-share span {
font-size:70%;
}
.neos21-share-hatebu { background:#006fbb; }
.neos21-share-twitter { background:#55acee; }
.neos21-share-facebook { background:#3a5795; }
.neos21-share-pocket { background:#ed4055; }
/* スマートフォン1列 */
@media only screen and (max-width:767px){
#entry-footer-secondary-modules .related-entries li {
float: none;
width: 100%;
height: auto;
}
}
.page-archive .archive-entries .entry-description {
margin: 0 0 1em;
line-height: 1.6em;
font-size: 75%;
}
a.archive-entries-see-more{position:absolute;top:0;width:100%;height:100%;color:transparent;}
.hatena-module .hatena-urllist li .urllist-image {
border: 1px solid #dfe5e7;
box-sizing: border-box;
}
/* To Top */
.toTop-nav {
position: fixed;
bottom: 10px;
right: 10px;
display: -webkit-flex;
display: flex;
padding: 0;
margin: 0;
z-index: 999; }
.toTop-nav li {
list-style-type: none;
background: rgba(0, 0, 0, 0.3);
border-radius: 50px;
text-align: center; }
.toTop-nav li:first-child {
margin-right: 10px; }
.toTop-nav li a {
display: block;
width: 50px;
height: 50px;
font-size: 30px;
line-height: 50px; }
.toTop-nav li a {
color: #fff;
text-decoration: none; }
.toTop-nav li a:visited {
color: #fff; }
.toTop-nav li a:hover {
color: #fff;
text-decoration: underline; }
.toTop-nav li a:active, .toTop-nav li a:focus {
color: #fff; }
.toTop-nav li a:hover {
text-decoration: none; }
#entry-footer-secondary-modules .hatena-module-related-entries{padding-top:1rem;}
#entry-footer-secondary-modules .related-entries{
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#entry-footer-secondary-modules .related-entries-item{
width: 46.5%;
border:1px solid #e0e0e0;
border-radius:1px;
margin: 0 0 0.5em 0;
padding: 0.5em;
}
#entry-footer-secondary-modules .related-entries-title{
font-weight:bold;
font-size; 100%;
padding: 0 0 0.5em 0;
}
#entry-footer-secondary-modules .related-entries-entry-body{
overflow:hidden;
}
#entry-footer-secondary-modules .related-entries-image{
border-radius:0;width:100px;height:100px;
}
#entry-footer-secondary-modules .related-entries-item:nth-of-type(5){
display:none;
}
.customized-footer{
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
table {
width: 100%;
}
td {
text-align: center;
vertical-align: middle;
}
a{/*リンクされた文字*/
color:#2a2a2a; /*←色指定*/
font-style:normal;
}
.entry-content a {
color: #E13A3E;
}
a:hover {/*マウスをのせたとき*/
color:#EA7577
text-decoration:none;
}
a:active {/*クリック中*/
text-decoration:none;
}
.hatena-citation{
display:none;
}
#footer p {
display: none;
}
.footer-address-name:before {
font-family:"FontAwesome";
content:"\f1f9";
margin-right:4px;
}
#footer a {
color: white;
}
#footer a :hover {
color:#E13A3E;
}
#footer {
padding: 20px;
text-align: center;
background: #353535;/* 背景色 */
font-size: 12px;
color:#fff;/* 文字の色 */
margin-bottom: 0;
}
.breadcrumb div {display: inline;}
.breadcrumb div a{
word-wrap:break-word;
color:#E13A3E;
background:white;
border-radius: 5px;
left:10px;
}
.breadcrumb div a:hover {
word-wrap:break-word;
opacity: .6;
border-radius: 5px;
left:10px;
}
.breadcrumb::before {
content: "\f017";/* 左のアイコン */
font-family: blogicon;
padding-right:5px;
vertical-align: text-bottom;
}
/* ******** SNSボタン ******** */
.snsbtns1, .snsbtns2, .snsbtns3, .snsbtns4{display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;margin:0 0 1rem 0;position:relative;}
.snsbtns1 a, .snsbtns2 a, .snsbtns3 a, .snsbtns4 a{display:block;width:100%;padding:1em 0;color:#fff;text-align:center;line-height:1;font-size:110%;margin-left:0.2rem;position:relative;overflow:hidden;}
.snsbtns1 a:hover, .snsbtns2 a:hover{box-shadow:0px 2px 3px rgba(0,0,0,0.2);transition: .5s;}
.snsbtns1 a:nth-of-type(1), .snsbtns2 a:nth-of-type(1), .snsbtns3 a:nth-of-type(1), .snsbtns4 a:nth-of-type(1){margin-left:0;}
.snsbtns1 a::before, .snsbtns3 a::before, .snsbtns4 a::before{font-family:blogicon;margin-right:0.5em;font-weight:normal;}
.sns-fb::before{content:'\f036';}
.sns-tw::before{content:'\f035';}
.sns-po::before{content:'\f008';}
.sns-hb::before{content:'\f027';}
.sns-fb{background:#365899;}
.sns-tw{background:#1b95e0;}
.sns-po{background:#EF4056;}
.sns-hb{background:#008fde;}
.sns-fb:hover{background:#4267b2;}
.sns-tw:hover{background:#31a3ea;}
.sns-po:hover{background:#f65065;}
.sns-hb:hover{background:#009FF8;}
.snsbtns2 a::before{font-family:blogicon;position:absolute;top:0rem;left:-1rem;font-size:420%;color:rgba(255,255,255,0.25);}
#content a {
text-decoration: none;
}
#content a:hover {
opacity: .6;
}
#box2-img a:hover {
opacity: .6;
}
.urllist-date-link a::before {
font-family: 'blogicon';
content: '\f043';
}
.urllist-categories a::before {
font-family: 'blogicon';
content: '\f022';
}
/*関連記事のタイトル*/
a.urllist-title-link.urllist-title{
text-decoration: none;
color: #525252;
font-weight: bold;
}
/*関連記事のタイトル*/
a.urllist-title-link.urllist-title:hover {
opacity: .6;
}
.page-index .hatena-module-recent-entries{display:none;}
.hatena-urllist{margin:0 0 0 0;padding:0 0 0 0;}
.hatena-urllist li{list-style-type:none;}
.hatena-urllist li a{}
.hatena-urllist li:first-child{}
.hatena-urllist li:last-child{}
.urllist-item-inner{font-size:12px;line-height:18px;}
.urllist-date-link{}
.urllist-date-link a{font-weight:bold;color:#E13A3E;}
.urllist-title{}
.recent-entries-item{min-height:72px;margin:0 0 1em 0;}
.recent-entries-item:last-of-type{margin:0 0 0 0;}
.hatena-module-archive .hatena-module-body{font-size:0.8rem;}
#entry-footer-secondary-modules.recent-entries,
.entries-access-ranking,
.related-entries {
margin: 0 0 10px 0;
padding: 10;
}
#entry-footer-secondary-modules .hatena-module-title{
font-size:0;
}
#entry-footer-secondary-modules .hatena-module-title::before{
content:'\f019 こんな記事も書いています';
font-size:0.9rem;
font-weight:bold;
margin-bottom: 2px;
margin-top: 2px;
}
.customized-footer{
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
}
.snsbtn-bottom{
-webkit-order: -2;
order: -2;
}
.iine{
-webkit-order: 3;
order: 3;
}
.entry-footer-modules{
-webkit-order: 1;
order: 1;
}
/* ^^^^^^^^ Milliard関連記事 ^^^^^^^^^^ */
.page-index .comment-box, .page-category-category_name .comment-box, .page-entries-year-month-day .comment-box{
display:none;
}
#container {
padding-top: 0px;
}
.box-b {
padding: 0.5em 1em;
margin: 2em 0;
font-weight: normal;
border: solid 1.5px #cccccc;
}
.box-b p {
margin: 0;
padding: 0;
}
.s-tbl tr:hover {
background: #ffffa3;
}
#topmenu {
background-repeat: repeat-x;
height: 48px;
line-height: 42px;
width: 100%;
position: absolute;
margin: 0px;
padding: 0px;
background-image: url(img/topmenu.jpg);
background-position: left top;
font-size: 13px;
display: none; //ここに追記
}
body {
font-family: 'MS Sans Serif',sans-serif;
}
.entry-content img.hatena-fotolife{
width:auto ;
height:auto ;
}
#globalheader-container {
display: none;
}
/* SNSフォローボタン上テキストのCSS指定 */
.sns-txt{
display: inline-block;
margin: 10px 0;
width: 100%;
text-align: center;
line-height: 2em;
font-size: 13px; /* 文字の大きさを変える時は変更する */
border-top: 1px solid #3b3b3b; /* 上のボーダーの色や太さを変える時は変更 */
border-bottom: 1px solid #3b3b3b; /* 下のボーダーの色や太さを変える時は変更 */
}
/* SNSフォローボタン枠のCSS指定 */
.sns-follow{
display: table;
width: 100%;
margin: 0 auto 32px;
}
/* SNSフォローボタンのCSS指定 */
.sns-follow a {
display: table-cell;
font-size: 35px; /* SNSマークの大きさを変えたい場合は変更する */
text-align: center;
vertical-align: middle;
text-decoration: none;
width: 25%; /* SNSを増やす場合は変更する。 合計で100%以下になるように。 */
height: 48px; /* ボックスの高さを変えたい場合は変更する */
layout-grid-line: 50px; /* 変更しない IE7以下対応 */
color: #fff; /* SNSロゴの色を変えたい場合は変更する */
}
.sns-follow .hatena-button {
transition: 1s ease;
background: #54575d;
}
.sns-follow .twitter-button {
transition: 1s ease;
background: #5db9ff; /* 背景色を変更したい場合は変更する */
}
.sns-follow .facebook-button {
transition: 1s ease;
background: #395eaf; /* 背景色を変更したい場合は変更する */
}
.sns-follow .feedly-button {
transition: 1s ease;
background: #84c34c; /* 背景色を変更したい場合は変更する */
}
/* SNSフォローボタンオーバーフロー時のCSS指定 */
.sns-follow .hatena-button:hover {
transition: .3s ease;
color: #3d3f44; /* 背景色を変更したい場合は変更する */
background:#fff;
}
.sns-follow .twitter-button:hover {
transition: .3s ease;
color: #55acee; /* 背景色を変更したい場合は変更する */
background:#fff;
}
.sns-follow .facebook-button:hover {
transition: .3s ease;
color: #305097; /* 背景色を変更したい場合は変更する */
background:#fff;
}
.sns-follow .feedly-button:hover {
transition: .3s ease;
color: #75ad43; /* 背景色を変更したい場合は変更する */
background:#fff;
}
/*aboutページ、デフォdl（プロフィール〜読者までを囲うエリア）*/
.page-about dl {
text-align: center;
margin: 0;
}
/*aboutページ、デフォdt（プロフィール等のタイトル）*/
.page-about dt {
text-align: center;
font-weight: bold;
font-size: 1.3em;
color: #676F74;
margin-bottom: 15px;
}
/*aboutページ、デフォdd→吹き出し風に*/
.page-about dd {
text-align: center;
position: relative;
display: inline-block;
margin: 0.5em auto 1.5em;
padding: 7px 10px;
min-width: 120px;
max-width: 100%;
color: #676F74;
font-size: 16px;
background: #FFF;
border: solid 3px #676F74;
box-sizing: border-box;
border-radius: 10px;
}
.page-about dd:before{
content: "";
position: absolute;
top: -23px;
left: 50%;
margin-left: -15px;
border: 12px solid transparent;
border-bottom: 12px solid #FFF;
z-index: 2;
}
.page-about dd:after{
content: "";
position: absolute;
top: -30px;
left: 50%;
margin-left: -17px;
border: 14px solid transparent;
border-bottom: 14px solid #676F74;
z-index: 1;
}
/*aboutページ、読者数（＼99人／のところ）*/
.about-subscription-count {
display: table;
position: relative;
padding: 0 30px;
color: #676F74;
font-size: 1.5em;
font-weight: bold;
line-height: 1;
letter-spacing: 1px;
margin: 12px auto;
}
.about-subscription-count:before,
.about-subscription-count:after {
display: inline-block;
position: absolute;
top: 50%;
width: 20px;
height: 3px;
border-radius: 3px;
background-color: #676F74;
content: "";
}
.about-subscription-count:before {
left: 0;
-webkit-transform: rotate(50deg);
transform: rotate(50deg);
}
.about-subscription-count:after {
right: 0;
-webkit-transform: rotate(-50deg);
transform: rotate(-50deg);
}
/*aboutページ、読者アイコン（拡大＆円形＆ふわっとアニメーション）*/
.page-about .entry-content img.profile-icon {
height: 45px;
width: 45px;
border-radius: 50%;
margin: 4px 4px;
transition: .3s;
}
.page-about .entry-content img.profile-icon:hover {
box-shadow: 0 10px 20px -4px rgba(0,0,0,.25);
transform: translateY(-3px);
}
/*tableをスクロールさせる*/
/*tableのセル内にある文字の折り返しを禁止*/
table {
overflow: auto;
white-space: nowrap;
di