/* CSS Document */ /* base.less by HATENA-BLOG TEAM */ /* LESS Mixins */ /* box properties */ .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; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; } /* text properties */ .font-default { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; } /* CSS3 properties */ .border-box { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .center { text-align: center; margin-left: auto; margin-right: auto; } .left { float: left; } .right { float: right; } .nofloat { float: none; } .clear { clear: both; } .block { display: block; } .inline { display: inline; } .nodisplay { display: none; } .relative { position: relative; } .absolute { position: absolute; } .static { position: static; } .fixed { position: fixed; } .margin0 { margin: 0 !important; } .padding0 { padding: 0 !important; } .bold { font-weight: bold; } .normal { font-weight: normal; font-style: normal; } .thin { font-weight: 300; } .italic { font-style: italic; } .nodeco { text-decoration: none; } .underline { text-decoration: underline; } .nolist { list-style-type: none; } .disc { list-style-type: disc; } .circle { list-style-type: circle; } .textleft { text-align: left; } .textright { text-align: right; } @font-face { font-family: 'blogicon'; src: url('/fonts/public/blogicon/blogicon-regular.eot'); src: url('/fonts/public/blogicon/blogicon-regular.eot?#iefix') format('embedded-opentype'), url('/fonts/public/blogicon/blogicon-regular.woff') format('woff'), url('/fonts/public/blogicon/blogicon-regular.ttf') format('truetype'), url('/fonts/public/blogicon/blogicon-regular.svg#blogicon') format('svg'); font-weight: normal; font-style: normal; } [class*="blogicon-"] { display: inline-block; font-family: 'blogicon'; font-style: normal; font-weight: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } [class*="blogicon-"].lg { font-size: 1.3333333333333333em; line-height: 0.75em; vertical-align: -10%; } .blogicon-hatenablog:before { content: '\f000'; } .blogicon-plus:before { content: '\f001'; } .blogicon-minus:before { content: '\f002'; } .blogicon-reorder:before { content: '\f003'; } .blogicon-grid:before { content: '\f004'; } .blogicon-chevron-left:before { content: '\f005'; } .blogicon-chevron-right:before { content: '\f006'; } .blogicon-chevron-up:before { content: '\f007'; } .blogicon-chevron-down:before { content: '\f008'; } .blogicon-external:before { content: '\f009'; } .blogicon-plugin:before { content: '\f00a'; } .blogicon-member:before { content: '\f00b'; } .blogicon-account:before { content: '\f00c'; } .blogicon-design:before { content: '\f00d'; } .blogicon-cog:before { content: '\f00e'; } .blogicon-edit:before { content: '\f010'; } .blogicon-addstar:before { content: '\f011'; } .blogicon-subscribe:before { content: '\f012'; } .blogicon-entry:before { content: '\f013'; } .blogicon-notify:before { content: '\f014'; } .blogicon-private:before { content: '\f015'; } .blogicon-user:before { content: '\f016'; } .blogicon-home:before { content: '\f017'; } .blogicon-setting:before { content: '\f018'; } .blogicon-draft:before { content: '\f019'; } .blogicon-search:before { content: '\f01a'; } .blogicon-analytics:before { content: '\f01b'; } .blogicon-help:before { content: '\f01c'; } .blogicon-comment:before { content: '\f01d'; } .blogicon-import:before { content: '\f01e'; } .blogicon-truck:before { content: '\f020'; } .blogicon-group:before { content: '\f021'; } .blogicon-folder:before { content: '\f022'; } .blogicon-add:before { content: '\f023'; } .blogicon-pen:before { content: '\f024'; } .blogicon-close:before { content: '\f025'; } .blogicon-trash:before { content: '\f026'; } .blogicon-bookmark:before { content: '\f027'; } .blogicon-redirect:before { content: '\f028'; } .blogicon-check:before { content: '\f029'; color: #c3c1fd; } .blogicon-crop:before { content: '\f02a'; } .blogicon-repeat:before { content: '\f02b'; } .blogicon-logout:before { content: '\f02c'; } .blogicon-star:before { content: '\f02d'; } .blogicon-pro:before { content: '\f02e'; } .blogicon-myblog:before { content: '\f030'; } .blogicon-recent:before { content: '\f031'; } .blogicon-info:before { content: '\f032'; } .blogicon-good:before { content: '\f033'; } .blogicon-amazon:before { content: '\f034'; } .blogicon-twitter:before { content: '\f035'; } .blogicon-facebook:before { content: '\f036'; } .blogicon-share:before { content: '\f037'; } .blogicon-code:before { content: '\f038'; } .blogicon-list:before { content: '\f039'; } .blogicon-calender:before { content: '\f03a'; } .blogicon-bracket:before { content: '\f03b'; } .blogicon-photo:before { content: '\f03c'; } .blogicon-color:before { content: '\f03d'; } .blogicon-public:before { content: '\f03e'; } .blogicon-realtime-preview:before { content: '\f040'; } .blogicon-warning:before { content: '\f041'; } .blogicon-link:before { content: '\f042'; } .blogicon-time:before { content: '\f043'; } .blogicon-markdown:before { content: '\f044'; } .blogicon-evernote:before { content: '\f045'; } .blogicon-music:before { content: '\f046'; } .blogicon-niconico:before { content: '\f047'; } .blogicon-heart:before { content: '\f048'; } .blogicon-heart-alt:before { content: '\f049'; } .blogicon-tag:before { content: '\f04a'; } .blogicon-mail:before { content: '\f04b'; } .blogicon-help-alt:before { content: '\f04c'; } .blogicon-sushi:before { content: '\f04d'; } .blogicon-rss:before { content: '\f04e'; } .blogicon-smartphone:before { content: '\f051'; } .blogicon-laptop:before { content: '\f052'; } /* @HATENA-MODULE-FOLLOW-BUTTON */ .hatena-follow-button-box { clear: both; font-size: 10px !important; height: 20px; margin: 0.7em 0; display: block; *zoom: 1; } .hatena-follow-button-box:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } .hatena-follow-button { display: inline-block; *display: inline; *zoom: 1; height: 18px !important; padding-left: 20px; padding-right: 5px; min-width: 40px; border: 1px solid #bbb !important; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; transition: 0.3s ease; transition-property: opacity, border, color, background; -o-transition: 0.3s ease; -o-transition-property: opacity, border, color, background; -moz-transition: 0.3s ease; -moz-transition-property: opacity, border, color, background; -webkit-transition: 0.3s ease; -webkit-transition-property: opacity, border, color, background; line-height: 18px !important; font-weight: bold; text-decoration: none; color: #555 !important; background: #ebebeb; float: left; letter-spacing: 0 !important; white-space: nowrap; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; } .hatena-follow-button:hover { text-decoration: none !important; } .hatena-follow-button.unsubscribing { background: #f5f5f5 url('/images/theme/hatena-follow-button.png') no-repeat 0 0; background: url('/images/theme/hatena-follow-button.png') no-repeat 0 0, -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#dddddd)); background: url('/images/theme/hatena-follow-button.png') no-repeat 0 0, -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%); background: url('/images/theme/hatena-follow-button.png') no-repeat 0 0, -o-linear-gradient(top, #ffffff 0%, #dddddd 100%); } .hatena-follow-button.unsubscribing:hover { border: 1px solid #888; color: #222 !important; } .hatena-follow-button.subscribing { color: #2F81D5 !important; background: #f5f5f5 url('/images/theme/hatena-follow-button.png') no-repeat 0 -18px; background: url('/images/theme/hatena-follow-button.png') no-repeat 0 -18px, -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#dddddd)); background: url('/images/theme/hatena-follow-button.png') no-repeat 0 -18px, -moz-linear-gradient(top, #ffffff 0%, #dddddd 100%); background: url('/images/theme/hatena-follow-button.png') no-repeat 0 -18px, -o-linear-gradient(top, #ffffff 0%, #dddddd 100%); } .hatena-follow-button.subscribing:hover { width: 65px; color: #fff !important; border: 1px solid #666; background: #666666 url('/images/theme/hatena-follow-button.png') no-repeat 0 -36px; } .hatena-follow-button-box .subscription-count-box { display: none; position: relative; float: left; margin: 0 0 0 5px !important; } .hatena-follow-button-box i, .hatena-follow-button-box u { position: absolute; z-index: 10; zoom: 1; line-height: 0; width: 0; height: 0; left: 0; top: 50%; margin: -4px 0 0 -4px; border: 4px transparent solid; border-right-color: #bbb; border-left: 0; } .hatena-follow-button-box u { margin-left: -3px; border-right-color: #fff; } .hatena-follow-button-box .subscription-count { float: left; border: 1px solid #bbb; height: 18px; line-height: 18px; padding: 0 5px; display: block; min-width: 8px; font-size: 12px; color: #454545 !important; background: #fff; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; margin-left: -1px; position: relative; z-index: 9; font-family: 'Helvetica', 'Ariel', sans-serif; } .hatena-module .hatena-follow-button .background { display: none; } .hatena-module .hatena-follow-button:hover .foreground { display: none; } .hatena-module .hatena-follow-button:hover .background { display: inline; } .hatena-module .hatena-follow-button .subscribing, .hatena-module .hatena-follow-button .unsubscribing, .hatena-module .hatena-follow-button .friend, .hatena-module .hatena-follow-button .non-friend { display: none; } .hatena-module .hatena-follow-button.subscribing .subscribing, .hatena-module .hatena-follow-button.unsubscribing .unsubscribing, .hatena-module .hatena-follow-button.friend .friend, .hatena-module .hatena-follow-button.non-friend .non-friend { display: inline; } /* RESET */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } html, body { margin: 0; padding: 0; } img { border: none; } /* @COMMON STYLE */ .leave-comment-title { cursor: pointer; } #footer address { font-style: normal; } #globalheader { width: 100%; height: 37px; border: none; } #globalheader-container { position: relative; z-index: 9999; } .entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6, .entry-footer { clear: both; } span a.keyword { color: inherit !important; _color: expression(this.parentNode.currentStyle.color); font-weight: inherit !important; font-style: inherit !important; font-size: 100%; } .entry-content iframe { max-width: 100%; } .entry-content table { max-width: none; } .entry-content img { max-width: 100%; } .entry-content a { word-wrap: break-word; } .entry-content .http-favicon, .entry-content .hatena-id-icon { margin-right: .2em; vertical-align: middle; } .entry-content .http-bookmark, .entry-content .http-star { margin: 0 .1em; vertical-align: middle; } .pocket-btn { display: inline-block; *display: inline; *zoom: 1; vertical-align: top; } #box2 { word-wrap: break-word; } #box2 img { max-width: 100%; height: auto; } img.photo { float: right; margin: 0.8em 0 1em 1em; } div.footnote { font-size: 90%; margin-top: 3em; } p.footnote { margin: .5em 0; line-height: 1.5; } /* @Comment */ .read-more-comments { text-align: center; list-style-type: none; } .read-more-comments a { cursor: pointer; } .entry-comment { position: relative; } .entry-comment .hatena-id-icon { width: 16px; height: 16px; } .entry-comment .comment-delete-button img { display: none; position: absolute; top: 8px; right: 8px; text-align: right; } .entry-comment:hover .comment-delete-button img { display: block; } /* @Quote-star */ .quote-stars { margin-top: 8px; } .quote-stars .quote-description { margin-bottom: 13px; } .quote-stars .quote-star { margin-bottom: 9px; } .quote-stars .quote-text { color: #aaa; font-style: italic; display: inline; } .quote-star-show { cursor: pointer; margin-bottom: 6px; display: inline-block; zoom: 1; *display: inline; padding: 5px 5px; background: #f5f5f5; border: 1px solid #ccc; border-radius: 0px; width: 71px; text-align: center; } .quote-star-show:hover { border-color: #bbb; background-color: #eee; text-decoration: none !important; } .quote-star-show .quote-star-show-text { font-size: 10px; } /* Delete Star */ .star-delete-button { cursor: pointer; position: absolute; width: 11px; height: 11px; z-index: 120; } /* @HATENA-SYNTAX */ img.hatena-fotolife { cursor: pointer; } .hatena-image-right { float: right; margin: 0 0 1em 1em; } .hatena-image-left { float: left; margin: 0 1em 1em 0; } pre { overflow: auto; overflow-y: hidden; } pre.code { font-family: 'Monaco', 'Consolas', 'Courier New', Courier, monospace, sans-serif; } .gist { line-height: 1.4; } .gist .line-numbers, .gist .line-pre { line-height: 1.4; } .gist .line-data { border: 0; } .gist .line-number, .gist .line { height: 1.4em; } .gist pre { border-radius: none; -webkit-border-radius: none; -moz-border-radius: none; box-shadow: none; -webkit-box-shadow: none; -moz-box-shadow: none; font-size: inherit !important; box-shadow: none !important; -moz-box-shadow: none !important; -webkit-box-shadow: none !important; } .footnote-delimiter { padding-right: 0.5em; } /* SUPER PRE SYNTAX HIGHLIGHT */ .synSpecial { color: #c000c0; } .synType { color: #3EC63E; } .synComment { color: #4F80E5; } .synPreProc { color: #9355E6; } .synIdentifier { color: #51CFCF; } .synConstant { color: #FF6666; } .synStatement { color: #D88A17; } /* ascii-art AA*/ pre.lang-aa { font-family: "Mona", "IPA MONAPGOTHIC", "MS PGothic", "ＭＳ Ｐゴシック", "MS Pｺﾞｼｯｸ", "MS Pゴシック", sans-serif; font-size: 12pt; line-height: 18px; padding: 0; background: transparent; border-radius: none; -webkit-border-radius: none; -moz-border-radius: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } /* 文中のcodeタグのスタイル */ .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 rgba(0, 0, 0, 0.08); background-color: rgba(0, 0, 0, 0.03); border-radius: 3px; font-family: 'Monaco', 'Consolas', 'Courier New', Courier, monospace, sans-serif; } /* asin */ .hatena-asin-detail { margin: 1em 0; border-image: initial; font-size: 90%; display: block; *zoom: 1; } .hatena-asin-detail:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } .hatena-asin-detail .hatena-asin-detail-image { float: left; margin-right: 15px; } .hatena-asin-detail .hatena-asin-detail-title { margin-top: 0; font-weight: bold; margin: 0 0 .3em 0; } .hatena-asin-detail p { text-indent: 0; } .hatena-asin-detail ul { list-style: none; margin: 0; padding: 0; } .hatena-asin-detail .hatena-asin-detail-foot { clear: left; } .hatena-asin-detail, .itunes-embed { padding: 0.8em 0.6em; border: 1px solid #ddd; } /* iTunes 貼り付け（概ねasin貼り付けと同じスタイル） */ .itunes-embed { margin: 1em 0; border-image: initial; font-size: 90%; display: block; *zoom: 1; } .itunes-embed:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } .itunes-embed .itunes-embed-image { float: left; margin-right: 15px; max-width: 100px; } .itunes-embed .itunes-embed-title { margin-top: 0; font-weight: bold; margin: 0 0 .3em 0; } .itunes-embed p { text-indent: 0; } .itunes-embed ul { list-style: none; margin: 0; padding: 0; } .itunes-embed ul li { line-height: 1.5; } .itunes-embed .itunes-embed-preview { margin: 10px 0; } .itunes-embed.itunes-kind-software .itunes-embed-image { -webkit-border-top-right-radius: 15px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 15px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 15px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } /* twitter:123456789:tweet */ div.twitter-tweet { text-align: left; margin: 0; border-bottom: 1px solid #ddd; } p.twitter-tweet-info { font-size: 0.85em; } div.twitter-tweet p.twitter-tweet-text, div.twitter-tweet p.twitter-tweet-info { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } /* twitter:123456789:detail */ div.twitter-detail { overflow: hidden; text-align: left; margin: 0; border-bottom: 1px solid #ddd; } div.twitter-detail:after { content: "."; font-size: 0.1em; line-height: 0; display: block; height: 0.1px; visibility: hidden; clear: both; } div.twitter-detail-user { margin: auto; width: 58px; } div.twitter-detail-left div.twitter-detail-user { text-align: left; } div.twitter-detail-right div.twitter-detail-user { text-align: right; } div.twitter-detail div.twitter-detail-user, div.twitter-detail-left div.twitter-detail-user { float: left; } div.twitter-detail-right div.twitter-detail-user { float: right; } div.twitter-detail-tweet { margin-left: 60px; margin-right: 60px; } div.twitter-detail div.twitter-detail-tweet { _height: 1%; } div.twitter-detail-tweet p.twitter-detail-text, div.twitter-detail-tweet p.twitter-detail-info { clear: none; line-height: 1.4; } div.twitter-detail-tweet p.twitter-detail-text { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } p.twitter-detail-info { font-size: 0.85em; margin-top: 0.3em; margin-bottom: 0; padding-top: 0; padding-bottom: 6px; } /* 毎日のツイートのまとめ */ div.twitter-tweet-wrapper { overflow: hidden; } div.twitter-tweet-wrapper div.twitter-tweet span.twitter-tweet-text-user { display: none; } div.twitter-tweet-wrapper div.twitter-tweet span.twitter-tweet-info-date { display: none; } div.tweet-images { width: 95%; margin-left: auto; margin-right: auto; } /* twitter-entry-icon */ a.twitter-header-icon img, a.twitter-entry-icon img { border: none; } /* social-button */ .social-buttons > div, .social-buttons > a, .social-buttons > iframe { margin-right: .3em; } .fb_iframe_widget > span { vertical-align: baseline !important; } /* はてなスター */ .hatena-star-container { margin-top: 10px; margin-bottom: 10px; min-height: 24px; } .hatena-star-add-button { margin: 1px !important; } .hatena-big-star-star-container { display: inline-block; position: relative; width: 20px; height: 20px; margin: 2px; vertical-align: middle; border-radius: 2px; overflow: hidden; } .hatena-star-user { width: 20px; height: 20px; position: absolute; top: 0px; left: 0px; margin: 0px; padding: 0px; margin-bottom: 0px !important; z-index: 10; border-radius: 3px; } .hatena-big-star-star-container > .hatena-star-star { position: absolute; bottom: 0px; left: 0px; margin: 0px; padding: 0px; margin-bottom: 0px !important; z-index: 11; background: rgba(255, 255, 255, 0.8); border-top-right-radius: 2px; border-bottom-left-radius: 2px; } .hatena-star-comment-container { display: none; } .hatena-star-comment-container.hatena-star-comment-active { display: inline; } /* @HATENA-MODULE */ .recent-comments { word-wrap: break-word; word-break: break-all; } .recent-comments .user-id img { vertical-align: text-bottom; margin-right: 3px; word-wrap: break-word; word-break: break-all; } .recent-comments .recent-comment-time { filter: alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7; font-style: italic; font-size: 90%; } .urllist-date-link { font-size: 85%; } .urllist-title-link { font-size: 110%; } .urllist-category-link { font-size: 85%; margin-right: .5em; } .urllist-entry-body { font-size: 90%; line-height: 1.5; } .urllist-with-thumbnails li { display: block; *zoom: 1; } .urllist-with-thumbnails li:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } .urllist-with-thumbnails li .urllist-image { margin: 0 .7em .7em 0; float: left; } .hatena-module-archive .hatena-urllist { padding-left: 0; margin-left: 0; } .hatena-urllist .archive-module-year { list-style-type: none; margin: 0; padding-left: 0; line-height: 1.5; background: none; } .hatena-urllist .archive-module-year:before, .hatena-urllist .archive-module-year:after { content: none !important; } .hatena-urllist .archive-module-year .archive-module-button { opacity: 0.6; } .hatena-urllist .archive-module-year .archive-module-months { padding-left: 0; margin-left: 0; background: none; } .hatena-urllist .archive-module-year .archive-module-month { margin: 0 0 0 2.5em; padding: 0; border: none; list-style-type: none !important; background: none; } .hatena-urllist .archive-module-year .archive-module-month:before, .hatena-urllist .archive-module-year .archive-module-month:after { content: none !important; } /* calendar 版のarchive module */ .archive-module-calendar { text-align: center; } .archive-module-calendar .archive-module-calendar-selector { display: inline-block; margin-bottom: 1em; } .archive-module-calendar table { width: 100%; table-layout: fixed; border-collapse: collapse; border-spacing: 0; } .archive-module-calendar th { font-size: 0.8em; text-align: center; padding: .3em 0; } .archive-module-calendar .archive-module-calendar-week td { text-align: center; } .facebook-follow-button { display: inline-block; padding-left: 20px; padding-right: 5px; border: solid 1px #cad4e7; border-radius: 4px; -moz-border-radius: 4px; height: 20px; line-height: 20px; background: url('/images/admin/curation/services/facebook.png') no-repeat 2px center #eceef5; text-decoration: none; color: #3c5995 !important; font-weight: bold; } .facebook-follow-button:hover { border: solid 1px #9dacce; text-decoration: none; } .cannot-facebook-follow { display: none; } .cannot-facebook-subscribe { display: none; } .cannot-twitter-button { display: none; } .cannot-facebook-follow-display { display: inline; } .cannot-facebook-subscribe-display { display: inline; } .cannot-twitter-button-display { display: inline; } /* @PREVIEW */ body.preview { margin: 10px; background: #fff !important; color: #000 !important; font-size: 100%; line-height: 1.7; font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; } body.preview img { max-width: 100%; } body.preview p { line-height: 1.5; margin: 0.5em 0; padding: 0; } body.preview blockquote { border-left: 4px solid #ddd; padding-left: .6em; } body.preview #mceResizeHandlen, body.preview #mceResizeHandlee, body.preview #mceResizeHandlew, body.preview #mceResizeHandles { display: none !important; } body.preview .mce-pagebreak { border-bottom: none; border-left: none; border-right: none; } .hatena-module-recent-comments .hatena-id-icon { width: 16px; height: 16px; } /* @div.google_afc */ .google-afc-image #google_afc_user_container_0, .google-afc-text #google_afc_user_container_0, .google-afc-image #google_afc_user_container_1, .google-afc-text #google_afc_user_container_1, .google-afc-image #google_afc_user_container_2, .google-afc-text #google_afc_user_container_2, .google-afc-image #google_afc_user_container_3, .google-afc-text #google_afc_user_container_3, .google-afc-image #google_afc_user_container_4, .google-afc-text #google_afc_user_container_4, .google-afc-image #google_afc_user_container_5, .google-afc-text #google_afc_user_container_5 { display: block !important; visibility: visible !important; width: auto !important; height: auto !important; opacity: 1 !important; position: static !important; filter: alpha(opacity=100) !important; } .google-afc-image * { opacity: 1 !important; filter: alpha(opacity=100) !important; } .google-afc-image, .google-afc-text { font-size: 16px; margin: 1em 0; clear: both; font-family: 'Helvetica', 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif; } .google-afc-image div#google_#google_afc_user_user_container, .google-afc-text div#google_#google_afc_user_user_container { min-height: 12em !important; margin-left: 1em; margin-right: 1em; } .google-afc-image div.google_ads_by, .google-afc-text div.google_ads_by { font-size: 0.8em; margin: 0 0 0.8em 0; } .google-afc-image ul, .google-afc-text ul { font-size: 100%; list-style: none outside none; margin: 0 0 5px; padding: 0; } .google-afc-image li, .google-afc-text li { background: none repeat scroll 0 0 transparent; list-style-image: none; list-style-type: none; margin: 0 0 2em !important; padding: 0; } .google-afc-image .google_ads_by a, .google-afc-text .google_ads_by a { display: inline !important; text-decoration: none; border: medium none; filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; margin-bottom: .5em; } .google-afc-image ul .title, .google-afc-text ul .title { font-size: 100%; font-weight: bold; margin: 0; line-height: 1.2em; display: block !important; } .google-afc-image ul .title a, .google-afc-text ul .title a { letter-spacing: 0.3em; font-size: 17px !important; text-decoration: underline; padding: .5em 0; } .google-afc-image ul .summary, .google-afc-text ul .summary { display: inline !important; font-size: 13px !important; line-height: 1em; margin: 0.2em 0.5em 0 0; filter: alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; letter-spacing: 0; } .google-afc-image ul .visible_url, .google-afc-text ul .visible_url { font-size: 0.8em; margin-left: 0; } .google-afc-image ul .visible_url a, .google-afc-text ul .visible_url a { font-size: 13px !important; border: medium none; font-weight: normal; text-decoration: none; letter-spacing: 2px; padding: .5em 0; } .google-afc-image .visible_url a:hover, .google-afc-text .visible_url a:hover { text-decoration: underline; } .google-afc-image p.google_afc_inactive_notice, .google-afc-text p.google_afc_inactive_notice { font-size: 0.9em; margin-top: 0; margin-right: 1em; margin-left: 1em; padding-top: 0; text-align: right; } .google-afc-image p.google_afc_inactive_notice a, .google-afc-text p.google_afc_inactive_notice a { text-decoration: underline; } /* @HATENA-FOTOLIFE LIGHTBOX */ /* ColorBox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper { position: absolute; top: 0; left: 0; z-index: 9999; overflow: hidden; } #cboxOverlay { position: fixed; width: 100%; height: 100%; } #cboxMiddleLeft, #cboxBottomLeft { clear: left; } #cboxContent { position: relative; } #cboxLoadedContent { overflow: auto; -webkit-overflow-scrolling: touch; } #cboxTitle { margin: 0; } #cboxLoadingOverlay, #cboxLoadingGraphic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow { cursor: pointer; } .cboxPhoto { float: left; margin: auto; border: 0; display: block; max-width: none; } .cboxIframe { width: 100%; height: 100%; display: block; border: 0; } #colorbox, #cboxContent, #cboxLoadedContent { box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; } /* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay { background: #fff; } #colorbox { outline: 0; } #colorbox #cboxContent { margin-top: 32px; overflow: visible; background: #000; /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */ /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */ } #colorbox #cboxContent .cboxIframe { background: #fff; } #colorbox #cboxContent #cboxError { padding: 50px; border: 1px solid #ccc; } #colorbox #cboxContent #cboxLoadedContent { background: #000; padding: 1px; } #colorbox #cboxContent #cboxLoadingGraphic { background: url(/images/loading.gif) no-repeat center center; } #colorbox #cboxContent #cboxLoadingOverlay { background: #000; } #colorbox #cboxContent #cboxTitle { position: absolute; top: -22px; left: 0; color: #000; } #colorbox #cboxContent #cboxCurrent { position: absolute; top: -22px; right: 205px; text-indent: -9999px; } #colorbox #cboxContent #cboxPrevious, #colorbox #cboxContent #cboxNext, #colorbox #cboxContent #cboxSlideshow, #colorbox #cboxContent #cboxClose { border: 0; padding: 0; margin: 0; overflow: visible; text-indent: -9999px; width: 20px; height: 20px; position: absolute; top: -20px; background: url(/images/controls.png) no-repeat 0 0; } #colorbox #cboxContent #cboxPrevious:active, #colorbox #cboxContent #cboxNext:active, #colorbox #cboxContent #cboxSlideshow:active, #colorbox #cboxContent #cboxClose:active { outline: 0; } #colorbox #cboxContent #cboxPrevious { background-position: 0px 0px; right: 44px; } #colorbox #cboxContent #cboxPrevious:hover { background-position: 0px -25px; } #colorbox #cboxContent #cboxNext { background-position: -25px 0px; right: 22px; } #colorbox #cboxContent #cboxNext:hover { background-position: -25px -25px; } #colorbox #cboxContent #cboxClose { background-position: -50px 0px; right: 0; } #colorbox #cboxContent #cboxClose:hover { background-position: -50px -25px; } #colorbox #cboxContent .cboxSlideshow_on #cboxPrevious, #colorbox #cboxContent .cboxSlideshow_off #cboxPrevious { right: 66px; } #colorbox #cboxContent .cboxSlideshow_on #cboxSlideshow { background-position: -75px -25px; right: 44px; } #colorbox #cboxContent .cboxSlideshow_on #cboxSlideshow:hover { background-position: -100px -25px; } #colorbox #cboxContent .cboxSlideshow_off #cboxSlideshow { background-position: -100px 0px; right: 44px; } #colorbox #cboxContent .cboxSlideshow_off #cboxSlideshow:hover { background-position: -75px -25px; } /* @PAGE-ABOUT */ .page-about .entry-content img.profile-icon { height: 16px; width: 16px; } /* @PAGE-ARCHIVE */ .page-archive .bookmark-widget-counter { text-decoration: none; } .page-archive .bookmark-widget-counter img { vertical-align: middle; } .page-archive .archive-entry { display: block; *zoom: 1; } .page-archive .archive-entry:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } .page-archive .entry-thumb { width: 120px; height: 120px; float: left; margin-right: 10px; } .page-archive span.highlight { background-color: #ffff8c; font-weight: bold; padding: .1em .2em; font-style: inherit; margin: .2em; color: #333333; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } /* @Custom Header-image */ .header-image-enable #blog-title { background: transparent; } .header-image-enable #blog-title #title, .header-image-enable #blog-title #blog-description { background: transparent; } .header-image-enable #blog-title #blog-title-inner { background-repeat: no-repeat; position: relative; height: 200px; } .header-image-enable #blog-title #title a { color: #fff; -moz-text-shadow: 0px 0px 20px #000; -webkit-text-shadow: 0px 0px 20px #000; text-shadow: 0px 0px 20px #000; } .header-image-enable #blog-title #blog-description { font-weight: bold; color: #fff; -moz-text-shadow: 0px 0px 10px #000; -webkit-text-shadow: 0px 0px 10px #000; text-shadow: 0px 0px 10px #000; } .header-image-only #blog-title { background: transparent; } .header-image-only #blog-title #title, .header-image-only #blog-title #blog-description { background: transparent; } .header-image-only #blog-title #blog-title-inner { background-repeat: no-repeat; position: relative; height: 200px; } .header-image-only #blog-title #title a { filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0; position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .header-image-only #blog-title #blog-description { visibility: hidden; } /* Welcome Message (AB test) */ .welcome-tooltip-newentry { position: absolute; width: 180px; height: 60px; top: 40px; right: 200px; background: #14afd6; text-shadow: 0 -1px 0px #164a5a; -moz-text-shadow: 0 -1px 0px #164a5a; -webkit-text-shadow: 0 -1px 0px #164a5a; padding: 10px; font-size: 80%; line-height: 1.5em; color: #fff; text-align: left; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: 1px solid #2e69a4; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); cursor: pointer; } .welcome-tooltip-newentry p { margin: 0 0 5px 0; } .welcome-tooltip-newentry .btn { display: inline-block; *display: inline; *zoom: 1; padding: 4px 10px 4px; margin-bottom: 0; line-height: 18px; color: #454545 !important; background-color: #f5f5f5; text-align: center; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); -moz-text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); -webkit-text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); vertical-align: middle; border: 1px solid #cccccc; border-bottom-color: #c0c0c0; -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 3px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; cursor: pointer; *margin-left: .3em; *padding: 0px 0px 0px; font-size: 90%; } .welcome-tooltip-newentry .btn:hover { border-color: #bbb; background-color: #eee; text-decoration: none !important; } .tipsy-arrow.blue { position: absolute; background: url('/images/admin/tipsy-blue.gif') no-repeat top left; width: 9px; height: 5px; } .tipsy-n .tipsy-arrow { top: -5px; left: 50%; margin-left: -4px; } /* Star Navigation (ABTest) */ .star-navigation-tooltip { width: 180px; height: 47px; background: #3f8ad6; background: -webkit-gradient(linear, left top, left bottom, from(#3f8ad6), to(#3675b4)); background: -ms-linear-gradient(top, #3f8ad6, #3675b4); background: -moz-linear-gradient(top, #3f8ad6 0%, #3675b4 100%); text-shadow: 0 -1px 0px #164a5a; -moz-text-shadow: 0 -1px 0px #164a5a; -webkit-text-shadow: 0 -1px 0px #164a5a; padding: 10px; margin: 10px 2px 2px; line-height: 1.4em; color: #fff; text-align: left; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: 1px solid #2e69a4; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); cursor: pointer; position: relative; } .star-navigation-tooltip p { font-size: 12px !important; line-height: 1.4 !important; margin: 0 !important; } .star-navigation-tooltip .btn { display: inline-block; *display: inline; *zoom: 1; padding: 4px 10px 4px; margin-bottom: 0; line-height: 18px; color: #454545 !important; background-color: #f5f5f5; text-align: center; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); -moz-text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); -webkit-text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); vertical-align: middle; border: 1px solid #cccccc; border-bottom-color: #c0c0c0; -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 3px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; cursor: pointer; *margin-left: .3em; *padding: 0px 0px 0px; font-size: 90%; } .star-navigation-tooltip .btn:hover { border-color: #bbb; background-color: #eee; text-decoration: none !important; } /* Select Star AB Test */ .select_star_button_container { position: absolute; width: 32px; height: 32px; opacity: 0.6; display: none; z-index: 3000; } .select_star_button_container .select_star_star { position: absolute; left: 0px; top: 0px; } .message-box { position: absolute; display: none; margin: 0px; padding: 5px 10px 5px 35px; background: #eff3ff url('/images/admin/check.png') no-repeat 7px center; border: 1px solid #C6C3FF; font-size: 12px; font-weight: bold; line-height: 19px; color: #454545; z-index: 2000; } .message-box a { font-weight: normal; } /* Title Star */ .title-star-container { display: inline-block; margin-left: 4px; } .title-star-container .title-star-count { height: 14px; } .title-star-container .title-star-add-button { font-size: 26px; display: inline; cursor: pointer; } /* Circle */ .hatena-module-body .circle-urllist li { display: block; *zoom: 1; } .hatena-module-body .circle-urllist li:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } .hatena-module-body .circle-urllist .circle-image { width: 48px; height: 48px; float: left; margin: 0 10px 0 0; } /* archive module */ .hatena-module-body .archive-module-button { display: inline; } .hatena-module-body .archive-module-show-button { cursor: pointer; display: none; } .hatena-module-body .archive-module-hide-button { cursor: pointer; } .hatena-module-body .archive-module-year-hidden .archive-module-months { display: none; } .hatena-module-body .archive-module-year-hidden .archive-module-show-button { display: inline; } .hatena-module-body .archive-module-year-hidden .archive-module-hide-button { display: none; } /* 関連記事 */ .related-entries { font-size: 100%; } .related-entries h2 { margin: 0 0 .8em 0; } .related-entries .related-entries-list { margin: 0; padding: 0; } .related-entries .related-entries-list li { list-style: none; margin-bottom: 10px; display: block; *zoom: 1; } .related-entries .related-entries-list li:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } .related-entries .related-entry-title { font-size: 120%; font-weight: bold; } .related-entries .related-thumb { width: 120px; height: 120px; float: left; margin: 0 10px 10px 0; } /* ブログ内検索 */ .hatena-module-search-top-box .search-form { border: 1px solid; -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 3px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; width: 200px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; float: right; position: relative; } .hatena-module-search-top-box .search-module-input { padding: 5px; background: none; border: none; outline: none; height: 20px; width: 90%; } .hatena-module-search-top-box .search-module-button { width: 20px; height: 20px; background: transparent url(http://blog.hatena.ne.jp/images/theme/search.png) no-repeat right center; border: none; outline: none; text-indent: -9999px; position: absolute; top: 5px; right: 5px; -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5; -webkit-opacity: 0.5; filter: alpha(opacity=50); } .hatena-module-search-top-box .search-module-button:hover { -moz-opacity: 0.85; opacity: 0.85; -khtml-opacity: 0.85; -webkit-opacity: 0.85; filter: alpha(opacity=50); } /* 検索結果 */ .search-result { margin-bottom: 3em; } .search-result-form { border: 1px solid rgba(0, 0, 0, 0.15); -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 3px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; max-width: 20em; -moz-box-sizing: border-box; box-sizing: border-box; position: relative; background-color: rgba(255, 255, 255, 0.8); } .search-result-form .search-result-input { padding: 5px; color: #333; background: none; border: none; outline: none; height: 20px; width: 90%; } .search-result-form .search-result-button { width: 20px; height: 20px; background: transparent url(http://blog.hatena.ne.jp/images/theme/search.png) no-repeat right center; border: none; outline: none; text-indent: -9999px; position: absolute; top: 5px; right: 5px; -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5; -webkit-opacity: 0.5; } .search-result-form .search-result-button:hover { -moz-opacity: 0.85; opacity: 0.85; -khtml-opacity: 0.85; -webkit-opacity: 0.85; } pre.code .comment { color: #51cfcf; } pre.code .lparen, pre.code .rparen { color: #f333d1; } pre.code .keyword, pre.code .keyword, pre.code .keyword\.operator { color: #ff4545; } pre.code .support\.function { color: #ff4545; } pre.code .identifier { color: #578cf9; } pre.code .string { color: #d88a17; } pre.code .string\.regexp { color: #d88a17; } pre.code .constant, pre.code .constant\.numeric, pre.code .constant\.language\.boolean { color: #ff4545; } pre.code .variable { color: #3ec63e; } pre.code .variable\.language { color: #b680ff; } /* LESS Variables Description: for Hatena Blog Admin Author: Hatena Blog Team Version: 1.0 */ /* Background color */ /* Light Gray Background color */ /* dark background color */ /* Base text color */ /* light text color */ /* 標準リンク色 */ /* リンクのhover */ /* グレーの標準ボタン色 */ /* 標準ボタンの文字色 */ /* 青い標準ボタン色 */ /* 青い標準ボタン色(hover) */ /* Register系の緑色ボタン */ /* Register系の緑色ボタン（hover） */ /* LESS Mixins */ /* box properties */ .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; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; } /* text properties */ .font-default { font-family: 'Helvetica Neue', 'Helvetica', 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; } /* CSS3 properties */ .border-box { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .center { text-align: center; margin-left: auto; margin-right: auto; } .left { float: left; } .right { float: right; } .nofloat { float: none; } .clear { clear: both; } .block { display: block; } .inline { display: inline; } .nodisplay { display: none; } .relative { position: relative; } .absolute { position: absolute; } .static { position: static; } .fixed { position: fixed; } .margin0 { margin: 0 !important; } .padding0 { padding: 0 !important; } .bold { font-weight: bold; } .normal { font-weight: normal; font-style: normal; } .thin { font-weight: 300; } .italic { font-style: italic; } .nodeco { text-decoration: none; } .underline { text-decoration: underline; } .nolist { list-style-type: none; } .disc { list-style-type: disc; } .circle { list-style-type: circle; } .textleft { text-align: left; } .textright { text-align: right; } /* Common.LESS Description: ユーザーのブログ、service、admin の全てで読みこまれるスタイル Author: Hatena Blog Team */ /* 広告消すボタンからPROに誘導する */ .modal-window-background { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background-color: #000000; z-index: 100; -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5; -webkit-opacity: 0.5; filter: alpha(opacity=50); } a.open-pro-modal { visibility: hidden; } .pro-modal-container { position: fixed; width: 500px; height: 250px; z-index: 110; background-color: #ffffff; } .favicon { margin-right: .3em; vertical-align: text-top; } @font-face { font-family: 'blogicon'; src: url('/fonts/public/blogicon/blogicon-regular.eot'); src: url('/fonts/public/blogicon/blogicon-regular.eot?#iefix') format('embedded-opentype'), url('/fonts/public/blogicon/blogicon-regular.woff') format('woff'), url('/fonts/public/blogicon/blogicon-regular.ttf') format('truetype'), url('/fonts/public/blogicon/blogicon-regular.svg#blogicon') format('svg'); font-weight: normal; font-style: normal; } [class*="blogicon-"] { display: inline-block; font-family: 'blogicon'; font-style: normal; font-weight: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } [class*="blogicon-"].lg { font-size: 1.3333333333333333em; line-height: 0.75em; vertical-align: -10%; } .blogicon-hatenablog:before { content: '\f000'; } .blogicon-plus:before { content: '\f001'; } .blogicon-minus:before { content: '\f002'; } .blogicon-reorder:before { content: '\f003'; } .blogicon-grid:before { content: '\f004'; } .blogicon-chevron-left:before { content: '\f005'; } .blogicon-chevron-right:before { content: '\f006'; } .blogicon-chevron-up:before { content: '\f007'; } .blogicon-chevron-down:before { content: '\f008'; } .blogicon-external:before { content: '\f009'; } .blogicon-plugin:before { content: '\f00a'; } .blogicon-member:before { content: '\f00b'; } .blogicon-account:before { content: '\f00c'; } .blogicon-design:before { content: '\f00d'; } .blogicon-cog:before { content: '\f00e'; } .blogicon-edit:before { content: '\f010'; } .blogicon-addstar:before { content: '\f011'; } .blogicon-subscribe:before { content: '\f012'; } .blogicon-entry:before { content: '\f013'; } .blogicon-notify:before { content: '\f014'; } .blogicon-private:before { content: '\f015'; } .blogicon-user:before { content: '\f016'; } .blogicon-home:before { content: '\f017'; } .blogicon-setting:before { content: '\f018'; } .blogicon-draft:before { content: '\f019'; } .blogicon-search:before { content: '\f01a'; } .blogicon-analytics:before { content: '\f01b'; } .blogicon-help:before { content: '\f01c'; } .blogicon-comment:before { content: '\f01d'; } .blogicon-import:before { content: '\f01e'; } .blogicon-truck:before { content: '\f020'; } .blogicon-group:before { content: '\f021'; } .blogicon-folder:before { content: '\f022'; } .blogicon-add:before { content: '\f023'; } .blogicon-pen:before { content: '\f024'; } .blogicon-close:before { content: '\f025'; } .blogicon-trash:before { content: '\f026'; } .blogicon-bookmark:before { content: '\f027'; } .blogicon-redirect:before { content: '\f028'; } .blogicon-check:before { content: '\f029'; color: #c3c1fd; } .blogicon-crop:before { content: '\f02a'; } .blogicon-repeat:before { content: '\f02b'; } .blogicon-logout:before { content: '\f02c'; } .blogicon-star:before { content: '\f02d'; } .blogicon-pro:before { content: '\f02e'; } .blogicon-myblog:before { content: '\f030'; } .blogicon-recent:before { content: '\f031'; } .blogicon-info:before { content: '\f032'; } .blogicon-good:before { content: '\f033'; } .blogicon-amazon:before { content: '\f034'; } .blogicon-twitter:before { content: '\f035'; } .blogicon-facebook:before { content: '\f036'; } .blogicon-share:before { content: '\f037'; } .blogicon-code:before { content: '\f038'; } .blogicon-list:before { content: '\f039'; } .blogicon-calender:before { content: '\f03a'; } .blogicon-bracket:before { content: '\f03b'; } .blogicon-photo:before { content: '\f03c'; } .blogicon-color:before { content: '\f03d'; } .blogicon-public:before { content: '\f03e'; } .blogicon-realtime-preview:before { content: '\f040'; } .blogicon-warning:before { content: '\f041'; } .blogicon-link:before { content: '\f042'; } .blogicon-time:before { content: '\f043'; } .blogicon-markdown:before { content: '\f044'; } .blogicon-evernote:before { content: '\f045'; } .blogicon-music:before { content: '\f046'; } .blogicon-niconico:before { content: '\f047'; } .blogicon-heart:before { content: '\f048'; } .blogicon-heart-alt:before { content: '\f049'; } .blogicon-tag:before { content: '\f04a'; } .blogicon-mail:before { content: '\f04b'; } .blogicon-help-alt:before { content: '\f04c'; } .blogicon-sushi:before { content: '\f04d'; } .blogicon-rss:before { content: '\f04e'; } .blogicon-smartphone:before { content: '\f051'; } .blogicon-laptop:before { content: '\f052'; } .icon-allabout-guide { background-image: url(/images/sprite.png); width: 44px; height: 11px; background-position: 0px -210px; } .icon-curation-amazon-search-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: 0px -150px; } .icon-curation-amazon-search { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -150px -120px; } .icon-curation-archive-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: 0px -30px; } .icon-curation-archive { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -30px -30px; } .icon-curation-bar-close-hover { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -60px 0px; } .icon-curation-bar-close { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -60px -30px; } .icon-curation-bar-open-hover { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: 0px -60px; } .icon-curation-bar-open { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -30px -60px; } .icon-curation-beginner-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -60px -60px; } .icon-curation-beginner { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -90px 0px; } .icon-curation-bookmark-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -90px -30px; } .icon-curation-bookmark { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -90px -60px; } .icon-curation-category-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: 0px -90px; } .icon-curation-category { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -30px -90px; } .icon-curation-evernote-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -60px -90px; } .icon-curation-evernote { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -90px -90px; } .icon-curation-flickr-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -120px 0px; } .icon-curation-flickr { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -120px -30px; } .icon-curation-fotolife-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -120px -60px; } .icon-curation-fotolife { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -120px -90px; } .icon-curation-gist-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: 0px -120px; } .icon-curation-gist { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -30px -120px; } .icon-curation-gnavi-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -60px -120px; } .icon-curation-gnavi { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -90px -120px; } .icon-curation-google-picker-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -120px -120px; } .icon-curation-google-picker { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -150px 0px; } .icon-curation-gourmet-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -150px -30px; } .icon-curation-gourmet { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -150px -60px; } .icon-curation-hatena-bookmark-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -150px -90px; } .icon-curation-hatena-bookmark { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: 0px 0px; } .icon-curation-home-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -30px 0px; } .icon-curation-home { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -30px -150px; } .icon-curation-instagram-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -60px -150px; } .icon-curation-instagram { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -90px -150px; } .icon-curation-itunes-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -120px -150px; } .icon-curation-itunes { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -150px -150px; } .icon-curation-miil-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -180px 0px; } .icon-curation-miil { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -180px -30px; } .icon-curation-nicovideo-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -180px -60px; } .icon-curation-nicovideo { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -180px -90px; } .icon-curation-option-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -180px -120px; } .icon-curation-option { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -180px -150px; } .icon-curation-paint-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: 0px -180px; } .icon-curation-paint { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -30px -180px; } .icon-curation-pixiv-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -60px -180px; } .icon-curation-pixiv { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -90px -180px; } .icon-curation-twitter-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -120px -180px; } .icon-curation-twitter { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -150px -180px; } .icon-curation-youtube-selected { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -180px -180px; } .icon-curation-youtube { background-image: url(/images/sprite.png); width: 30px; height: 30px; background-position: -210px 0px; } .icon-customize-article { background-image: url(/images/sprite.png); width: 16px; height: 16px; background-position: -210px -30px; } .icon-customize-background-color { background-image: url(/images/sprite.png); width: 16px; height: 15px; background-position: -210px -94px; } .icon-customize-background-image { background-image: url(/images/sprite.png); width: 16px; height: 12px; background-position: -210px -124px; } .icon-customize-css { background-image: url(/images/sprite.png); width: 16px; height: 15px; background-position: -210px -109px; } .icon-customize-footer { background-image: url(/images/sprite.png); width: 16px; height: 16px; background-position: -210px -46px; } .icon-customize-header { background-image: url(/images/sprite.png); width: 16px; height: 16px; background-position: -210px -62px; } .icon-customize-sidebar { background-image: url(/images/sprite.png); width: 16px; height: 16px; background-position: -210px -78px; } .icon-customize-smartphone { background-image: url(/images/sprite.png); width: 10px; height: 16px; background-position: -226px -30px; } .icon-library { background-image: url(/images/sprite.png); width: 41px; height: 11px; background-position: -44px -210px; } .icon-npo { background-image: url(/images/sprite.png); width: 25px; height: 11px; background-position: -210px -136px; } .icon-pro { background-image: url(/images/sprite.png); width: 25px; height: 11px; background-position: -210px -147px; } .icon-sponsored { background-image: url(/images/sprite.png); width: 58px; height: 11px; background-position: -85px -210px; } [class^="icon-"], [class*=" icon-"] { display: inline-block; vertical-align: text-top; background-repeat: no-repeat; *margin-right: .3em; margin-right: 2px; } [class^="icon-"]:last-child, [class*=" icon-"]:last-child { *margin-left: 0; } [class^="icon-big-"], [class*=" icon-big-"] { display: inline-block; vertical-align: text-top; background-repeat: no-repeat; *margin-right: .3em; padding-right: 0; margin-right: 3px; } .icon-pro, .icon-npo, .icon-sponsored, .icon-library, .icon-allabout { margin: 0 3px; vertical-align: middle; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) { [class^="icon-"], [class*=" icon-"] { background-image: url(/images/sprite@2x.png); background-size: 240px auto; } } #header, #globalheader { position: relative; z-index: 99; width: 100%; border: none; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; } #globalheader-container { height: 37px; width: 100%; z-index: 99; } .browsing-with-smartphone #globalheader-container { height: 44px; } .browsing-with-smartphone #globalheader-container iframe#globalheader { height: 44px; } .global-page #header a:link, .global-page #header a:visited { color: #333 !important; } #header a:hover { text-decoration: underline; } .page-globalheader { margin: 0; padding: 0; height: 37px; overflow: hidden; } #header { width: 100%; background: transparent; /* service header-bg color */ } #header #header-body { width: 100%; height: 37px; display: block; *zoom: 1; text-align: center; font-size: 75%; position: fixed; top: 0; left: 0; z-index: 9998; } #header #header-body:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } #header img { border: 0; } #header a { text-decoration: none; } #header a:hover { text-decoration: underline; } .globalheader-nav { position: relative; float: left; margin: 0; padding: 0; list-style: none; display: block; *zoom: 1; } .globalheader-nav:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } .globalheader-nav > li { float: left; padding: 0 10px; } .globalheader-nav > li a { float: none; line-height: 37px; text-decoration: none; } .globalheader-nav > li span { float: none; line-height: 37px; cursor: pointer; } .globalheader-nav .service-logo { vertical-align: middle; height: 37px; } .globalheader-nav .current-blog a { display: block; max-width: 180px; white-space: nowrap; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; } .globalheader-nav .blog-private-badge { display: none; margin-right: .3em; float: left; } .globalheader-nav #subscribe span:hover { text-decoration: underline; } .globalheader-nav .subscribe .subscribe-count { vertical-align: middle; background: rgba(0, 0, 0, 0.3); padding: 3px 5px; font-size: 10px; -webkit-border-top-right-radius: 2px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 2px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 2px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; color: #fff; } .globalheader-nav [class*="blogicon-"] { vertical-align: middle; font-size: 14px; margin-right: .2em; } .service-menu { position: absolute; top: 0; right: 0; margin: 0; padding: 0; display: block; *zoom: 1; } .service-menu:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } .service-menu li { float: left; padding: 0 8px; line-height: 37px; vertical-align: middle; list-style-type: none; } .service-menu li span { cursor: pointer; } .service-menu li img { vertical-align: middle; margin-top: -2px; } .service-menu .upgrade-pro a { color: #62d7f4 !important; } .service-menu .header-user-image { width: 20px; height: 20px; -webkit-border-top-right-radius: 2px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 2px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 2px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .service-menu .header-notify, .service-menu .header-services { width: 36px; height: 37px; } .service-menu .global-notify { width: 25px; height: 25px; } .service-menu .global-logo { padding-left: 3px; } .service-menu .global-logo .global-hatena-logo { width: 76px; height: 12px; } #header .header-dropdown { background: url('/images/header/dropdown.gif') center right no-repeat; background-size: 12px 12px; height: 37px; cursor: pointer; display: block; padding-right: 12px; } #header .header-dropdown img { vertical-align: middle; } .header-my .header-user-image { *padding-top: 11px !important; } .header-services img, .header-notify img { *padding-top: 8px; } .global-logo img { *padding-top: 14px; } #header .header-notify, #header .header-services { margin-right: 2px; position: relative; padding: 0 3px !important; } #header .header-services span.header-dropdown { padding-right: 12px; } #header .header-notify span.header-dropdown, #header .header-services span.header-dropdown { padding-right: 9px; width: 25px; } #header .header-notify img { opacity: 1 !important; } #header .header-notify .notify-count { font-weight: bold; color: #fff; display: inline-block; background: url(/images/header/count-bg.png) top left no-repeat; background-size: 14px 14px; _display: inline; text-align: center; margin-right: 6px; position: absolute; top: 3px; _top: -3px; *top: -3px; right: 4px; width: 14px; height: 14px; line-height: 14px; font-size: 80%; display: none; } @media (-webkit-min-device-pixel-ratio: 2) { #header .header-notify .notify-count { background-image: url(/images/header/count-bg@2x.png); } } .page-globalheader .btn { display: inline-block; *display: inline; *zoom: 1; padding: 4px 10px 4px; margin-bottom: 0; line-height: 18px; color: #777777; background-color: #f5f5f5; text-align: center; vertical-align: middle; border: 1px solid #dddddd; -webkit-border-top-right-radius: 2px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 2px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 2px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; cursor: pointer; font-size: 12px; text-decoration: none; font-weight: bold; -webkit-appearance: none; } .page-globalheader .btn:hover { border-color: #ccc; background-color: #eeeeee; text-decoration: none !important; } .page-globalheader .btn-blue, .page-globalheader .btn-primary { color: #fff !important; background: #14afd6; border: 1px solid transparent; } .page-globalheader .btn-blue:hover, .page-globalheader .btn-primary:hover { border-color: #129fc2; background: #129fc2; background: -webkit-gradient(linear, left top, left bottom, from(#14afd6), to(#129fc2)); background: -ms-linear-gradient(top, #14afd6, #129fc2); background: -moz-linear-gradient(top, #14afd6 0%, #129fc2 100%); } .page-globalheader .btn-register { color: #fff !important; background: #49ba8c; border: 1px solid transparent; } .page-globalheader .btn-register:hover { background: #2ea074; background: -webkit-gradient(linear, left top, left bottom, from(#49ba8c), to(#2ea074)); background: -ms-linear-gradient(top, #49ba8c, #2ea074); background: -moz-linear-gradient(top, #49ba8c 0%, #2ea074 100%); border-color: #2ea074; } .page-globalheader .btn-pro { color: #fff !important; background: #333; border: 1px solid transparent; } .page-globalheader .btn-pro:hover { background: #111111; background: -webkit-gradient(linear, left top, left bottom, from(#333333), to(#111111)); background: -ms-linear-gradient(top, #333333, #111111); background: -moz-linear-gradient(top, #333333 0%, #111111 100%); border-color: #000; } .page-globalheader .btn-small { padding: 2px 10px !important; font-size: 11px !important; } .page-globalheader .btn-large { padding: 13px 19px; font-size: 17px; line-height: normal; font-weight: bold; } .page-globalheader .btn[disabled="disabled"], .page-globalheader .btn[disabled="disabled"]:hover, .page-globalheader input#submit[disabled="disabled"], .page-globalheader input#submit[disabled="disabled"]:hover, .page-globalheader form input[disabled="disabled"], .page-globalheader form input[disabled="disabled"]:hover { -moz-opacity: 0.4; opacity: 0.4; -khtml-opacity: 0.4; -webkit-opacity: 0.4; cursor: default; white-space: nowrap; } .page-globalheader .btn.disabled, .page-globalheader .btn.disabled:hover { -moz-opacity: 0.4; opacity: 0.4; -khtml-opacity: 0.4; -webkit-opacity: 0.4; cursor: default; white-space: nowrap; } #header .cookie-notify { margin: 10px 10px 20px 10px; padding: 2px 10px 2px 30px; background: #ddcccc url('/images/admin/error.png') no-repeat 5px center; background-size: contain; border: 1px solid #EFCFD1; font-size: 11px; color: #9b4d51; } #header .cookie-notify a { font-weight: normal; } #header .btn { line-height: 13px; position: relative; top: -1px; } @media screen and (max-width: 550px) { #current-blog { display: none !important; } } #header-body-mobile { display: block; height: 44px; margin-left: 8px; margin-right: 8px; } #header-body-mobile .service-logo { height: 37px; margin: 4px 0 3px 0; } #header-body-mobile .globalheader-right { position: absolute; top: 0; right: 8px; margin: 9px 0; height: 26px; } #header-body-mobile .globalheader-right-nav { margin: 0; padding: 0; list-style: none; display: block; *zoom: 1; } #header-body-mobile .globalheader-right-nav:after { display: block; visibility: hidden; font-size: 0; height: 0; clear: both; content: "."; } #header-body-mobile .globalheader-right-nav li { float: left; margin-left: 5px; } #header-body-mobile .globalheader-right-nav i { vertical-align: middle; } #header-body-mobile .profile-image { width: 26px; height: 26px; -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 3px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } #header-body-mobile .btn { display: inline-block; *display: inline; *zoom: 1; padding: 0px 5px; margin-bottom: 0; line-height: 26px; text-align: center; vertical-align: middle; border: 1px solid transparent; -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 3px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; cursor: pointer; font-size: 70%; font-weight: normal; background: transparent; } #header-body-mobile .btn-register { background-color: #49ba8c; border: 1px solid #49ba8c; } .hatena-globalheader-window { position: fixed; top: 37px; right: 100px; width: 150px; height: 300px; margin: 0; padding: 0; border: 1px solid #ccc; background: #fff; font-size: 75%; z-index: 9999; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } .hatena-globalheader-window iframe { width: 100%; height: 100%; } .hatena-globalheader-window.message { font-weight: bold; font-size: 100%; font-size: 13px; line-height: 30px; margin: 0 0 20px 0; padding: 5px 10px 5px 35px; border: 1px solid #C6C3FF; background: #eff3ff url('/images/admin/check.png') no-repeat 7px 7px; color: #454545; } .globalheader-dropdown-wrapper .iframe-dropdown-list { padding: 5px 0 5px 0; margin: 0; } .globalheader-dropdown-wrapper .iframe-dropdown-list a, .globalheader-dropdown-wrapper .iframe-dropdown-list li > span { display: block; width: 176px; padding: 8px 12px; color: #454545; height: 16px; line-height: 16px; white-space: nowrap; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; cursor: pointer; } .globalheader-dropdown-wrapper .iframe-dropdown-list a:hover, .globalheader-dropdown-wrapper .iframe-dropdown-list li > span:hover { text-decoration: none; background-color: #f5f5f5; } .globalheader-dropdown-wrapper .iframe-dropdown-list a .blogicon-subscribe, .globalheader-dropdown-wrapper .iframe-dropdown-list li > span .blogicon-subscribe { margin: 0 .1em; } .globalheader-dropdown-wrapper .iframe-dropdown-list .favicon { vertical-align: text-bottom; -webkit-border-top-right-radius: 2px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 2px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 2px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .globalheader-dropdown-wrapper .iframe-dropdown-list .dropdown-divider { padding-top: 1px; margin: 5px 1px 6px; border-bottom: 1px solid #dddddd; } .globalheader-dropdown-wrapper .iframe-dropdown-list.section { padding-bottom: 5px; } .globalheader-dropdown-wrapper .upgrade-pro a { color: #14afd6 !important; } .globalheader-dropdown-wrapper .arrow a { background-image: url('/images/header/header-arrow.png'); background-repeat: no-repeat; background-position: 5% 50%; padding-left: 25px; width: 163px; } .globalheader-dropdown-wrapper h1 { margin-left: 8px; margin-right: 8px; margin-bottom: 0 !important; padding-top: 10px !important; } .globalheader-dropdown-wrapper h1 a { color: #333333; } .globalheader-dropdown-wrapper .search { padding: 8px; } .globalheader-dropdown-wrapper .search-form { width: 100%; border: 1px solid #dddddd; -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-topleft: 0; border-top-right-radius: 3px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-top-left-radius: 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; position: relative; } .globalheader-dropdown-wrapper .search-form .search-module-input { padding: 5px; color: #555555; background: none; border: none; outline: none; height: 30px; width: 90%; box-shadow: none; } .globalheader-dropdown-wrapper .search-form .search-module-button { width: 20px; height: 20px; background: transparent url(http://blog.hatena.ne.jp/images/theme/search.png) no-repeat right center; border: none; outline: none; text-indent: -9999px; position: absolute; top: 5px; right: 5px; -moz-opacity: 0.5; -khtml-opacity: 0.5; -webkit-opacity: 0.5; opacity: 0.5; filter: alpha(opacity=50); cursor: pointer; } @media (-webkit-min-device-pixel-ratio: 2) { .globalheader-dropdown-wrapper .search-form .search-module-button { background: transparent url(http://blog.hatena.ne.jp/images/theme/search@2x.png) no-repeat right center; background-size: 20px 20px; } .globalheader-dropdown-wrapper .arrow a { background-image: url('/images/header/header-arrow@2x.png'); background-size: 7px 10px; } } #hatena-diary-dropdown-mymenu, #hatena-diary-dropdown-blogmenu, .hatena-diary-dropdown-myblogs { width: 200px; } #hatena-diary-feedback { position: fixed; padding: 0; margin: 0; top: 37px; right: 188px; border: 1px solid #ccc; background: #fff; z-index: 9999; } #hatena-diary-edit-in-place { max-width: 982px !important; left: 10%; top: 37px; border: 1px solid #ccc; overflow: hidden; background: #fff; } #hatena-diary-dropdown-notify { width: 250px; height: 300px; } .hatena-iframe-container { position: fixed; top: 37px; padding: 0; margin: 0; border: 1px solid #ccc; overflow: hidden; background: #fff; z-index: 9999; } .hatena-iframe-container .loading { display: block; position: absolute; margin: 0; padding: 10% 0; width: 100%; height: 100%; line-height: 100%; text-align: center; background: #fff; opacity: 0.8; } .hatena-iframe-container .loading img { vertical-align: middle; margin: 2px; } .hatena-iframe-container iframe { width: 100%; height: 100%; } .hatena-iframe-container.popup { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } .globalheader-config-dropdown-window { padding: 10px; font-size: 12px; } .globalheader-config-dropdown-window h1 { border-bottom: 1px solid #ccc; margin-bottom: 8px; padding: 5px 0; } .globalheader-config-dropdown-window h1 a { display: block; color: #333333; } .globalheader-config-dropdown-window ul a { display: block; padding: 8px 0; color: #333333; white-space: nowrap; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; } .globalheader-config-dropdown-window ul a:hover { text-decoration: underline; } .globalheader-config-dropdown-window ul .goto-dashboard a { border-top: 1px solid #ccc; margin-top: 5px; padding-top: 13px; } #username-window { right: 0; width: 150px; overflow: hidden; } #username-window li a { display: block; color: #333; } #username-window li img { vertical-align: middle; margin-bottom: 2px; margin-left: 3px; border: 0; background: #fff; } #username-window img { border: 0; } #username-window a { text-decoration: none; } #username-window a:hover { text-decoration: underline; } #username-window dt.label span, #username-window li.label span { display: block; font-weight: bold; margin-top: 3px; padding: 3px 0 5px 3px; border-bottom: 1px solid #ddd; background: #fff; color: #000; } #username-window dt, #username-window dd, #username-window li { display: block !important; line-height: 1.5; margin: 0 !important; padding: 3px 5px; text-align: left; } #username-window dd img { margin-right: 4px; margin-left: 3px; } #username-window a { color: #333 !important; } #username-window li:last-child { border-bottom: 0; } #username-window img { vertical-align: middle; margin-top: -2px; } #notify-window { width: 250px; } #header-container #sp-suggest { background: #333333; padding: 1em; text-align: center; } #header-container #sp-suggest a { display: inline-block; color: #333333; background: #fff; padding: 1em; border-radius: .5em; } @media (min-width: 300px) { #header-container #sp-suggest a { font-size: 16px; } } @media (min-width: 900px) { #header-container #sp-suggest { padding: 3em; text-align: center; } #header-container #sp-suggest a { font-size: 50px; padding: 1em; border-radius: .5em; } } body.hide-global-header #globalheader-container { display: none; } #header.admin { background: #000000 url('/images/stripe_gray.gif') !important; color: #fff; } #header.admin a:link, #header.admin a:visited { color: #fff !important; text-decoration: none; } #header.admin a:hover { text-decoration: underline; } #header.admin #userinfo { background: #000000 url('/images/stripe_gray.gif'); color: #fff; border: 1px solid #333; line-height: 2; padding: 10px; } #header.admin #userinfo table { border-collapse: collapse; margin: 0; padding: 0; width: 100%; } #header.admin #userinfo tr, #header.admin #userinfo th { text-align: left; margin: 0; padding: 0 1em; overflow: hidden; } .globalheader-fixed { margin-top: 37px; } .globalheader-fixed #globalheader-container { width: 100%; position: fixed; z-index: 9999; top: 0; left: 0; }