/* */ @charset "UTF-8";@import"https://fonts.googleapis.com/css?family=PT+Sans:400,400i,700,700i";/*! Theme: Life Author: Hatena Blog Team Responsive: yes *//*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}template{display:none}[hidden]{display:none}.clearfix:after{content:" ";display:table;clear:both}html,body{font-family:PT Sans,Helvetica Neue,Arial,Hiragino Kaku Gothic Pro,Meiryo,MS PGothic,sans-serif;color:#3d3f44;background-color:#fff}body{overflow-x:hidden}@media (min-width: 768px){body.globalheader-off{padding-top:1.5em;padding-bottom:1.5em}body.globalheader-off #container-inner{margin-top:0}}a{color:#5684d7}a:hover{color:#3067cb}h1,h2,h3,h4,h5,h6{color:#2e3034}h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:#2e3034;text-decoration:none}h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover{color:#3067cb}#globalheader-container{position:sticky;top:0;color:#3d3f44;background-color:#fff}#container,#footer{padding-left:10px;padding-right:10px}@media (min-width: 768px){#container,#footer{width:720px;margin:auto;padding-left:0;padding-right:0}}@media (min-width: 1020px){#container,#footer{width:960px}}#container{background:#fff;line-height:1.5;word-wrap:break-word}@media (min-width: 768px){#container-inner{padding:1.5em;margin-top:1.5em}}#blog-title{text-align:center;margin:0;padding-bottom:1.5em;padding-top:1em}@media (min-width: 481px){#blog-title{padding-bottom:1.5em;padding-top:2em}}@media (min-width: 768px){#blog-title{margin:1.5em 0 0;padding-top:0}}@media (min-width: 768px){.page-index #blog-title{margin:3em 0 0;padding-bottom:2em}}#title{font-size:1rem}@media (min-width: 768px){#title{font-size:1.1rem}}.page-index #title{font-size:1.2rem}@media (min-width: 768px){.page-index #title{font-size:1.3rem}}#blog-description{font-size:.7rem;font-weight:400;color:#959c9e}@media (min-width: 768px){#blog-description{font-size:.8rem}}.page-index #blog-description{font-size:.8rem}.header-image-enable #blog-title,.header-image-only #blog-title{margin:0 -10px;padding-bottom:1.5em;padding-top:0}@media (min-width: 768px){.header-image-enable #blog-title,.header-image-only #blog-title{margin:0 auto}}.header-image-enable #blog-title #blog-title-inner,.header-image-only #blog-title #blog-title-inner{display:flex;align-items:center;justify-content:center;height:50vw;max-height:200px}.header-image-enable #blog-title-content,.header-image-only #blog-title-content{margin:0 .5em}#top-editarea{margin:0 auto 1em}#top-box{margin:0 auto 1.5em}.breadcrumb{font-size:.85rem;color:#959c9e}@media (min-width: 768px){#content{padding-top:1em}}@media (min-width: 768px){.page-index #content{padding-top:2em}}.entry{margin-bottom:3em}@media (min-width: 768px){.entry{margin-bottom:6em}}.entry-header{text-align:center;position:relative;margin-bottom:2em}.entry-header-menu{position:absolute;top:0;right:0}.entry-header-menu a{display:inline-block;text-align:center;cursor:pointer;line-height:1.5;font-size:.8rem;overflow:hidden;color:#3d3f44;background-color:transparent;text-decoration:none!important;border:1px solid #d2d7e5;transition:all .2s;padding:.2em .5em;font-size:.75rem}.entry-header-menu a:hover{color:#3d3f44;background-color:#f7f8f9;text-decoration:none;border-color:#b2bad2}.entry-header-menu a img,.entry-header-menu a svg{vertical-align:top;margin-right:.3em}.date{font-size:.8rem}.date a{text-decoration:none;color:#959c9e}.date a:hover{color:#3067cb}.date-last-updated{color:#959c9e;font-size:.8rem}.entry-title{font-size:1.3rem;font-weight:400;margin:.4em 0}@media (min-width: 768px){.entry-title{font-size:1.5rem}}.page-entry .entry-title{font-size:1.6rem}@media (min-width: 768px){.page-entry .entry-title{font-size:1.8rem}}@media (min-width: 1020px){.page-entry .entry-title{font-size:2rem}}.entry-categories{margin:.8em 0}.categories a{display:inline-block;text-align:center;cursor:pointer;line-height:1.5;font-size:.8rem;overflow:hidden;color:#3d3f44;background-color:transparent;text-decoration:none!important;border:1px solid #d2d7e5;transition:all .2s;padding:.2em .5em;font-size:.75rem;margin:0 .1em}.categories a:hover{color:#3d3f44;background-color:#f7f8f9;text-decoration:none;border-color:#b2bad2}.categories a img,.categories a svg{vertical-align:top;margin-right:.3em}.customized-header{margin:.8em 0}.entry-content,.entry-footer{margin:auto}@media (min-width: 768px){.entry-content,.entry-footer{max-width:720px}}.entry-content{line-height:1.7;max-width:720px;font-size:.9rem}@media (min-width: 768px){.entry-content{font-size:1rem}}.entry-content a{text-decoration:underline}.entry-content a.keyword{text-decoration:none;border-bottom:1px dotted #d2d7e5;color:#3d3f44}.entry-content p{margin:1em 0}.entry-content img,.entry-content video{max-width:100%;height:auto}.entry-content h1,.entry-content h2,.entry-content h3,.entry-content h4,.entry-content h5,.entry-content h6{margin:1em 0 .8em;line-height:1.3}.entry-content h1,.entry-content h2{padding-bottom:.1em;border-bottom:1px solid #d2d7e5}.entry-content h1{font-size:140%}@media (min-width: 1020px){.entry-content h1{font-size:160%}}.entry-content h2{font-size:130%}@media (min-width: 1020px){.entry-content h2{font-size:150%}}.entry-content h3{font-size:120%}@media (min-width: 1020px){.entry-content h3{font-size:130%}}.entry-content h4{font-size:110%}@media (min-width: 1020px){.entry-content h4{font-size:120%}}.entry-content h5{font-size:100%}@media (min-width: 1020px){.entry-content h5{font-size:110%}}.entry-content h6{font-size:95%}.entry-content ul,.entry-content ol,.entry-content dd{margin:0 0 1em 1.5em;padding:0}.entry-content ul li ul,.entry-content ol li ul,.entry-content dd li ul,.entry-content ul li ol,.entry-content ol li ol,.entry-content dd li ol{margin-bottom:0}.entry-content h1,.entry-content h2,.entry-content h3,.entry-content h4,.entry-content h5,.entry-content h6,.entry-content .footnote-number{scroll-margin-top:56px}.entry-content table{border-collapse:collapse;border-spacing:0;border-bottom:1em;margin-bottom:1em;width:100%;overflow:auto;display:block;font-size:.8rem}@media (min-width: 768px){.entry-content table{font-size:.9rem}}.entry-content table th,.entry-content table td{border:1px solid #d2d7e5;padding:5px 10px}.entry-content table th{background:#f7f8f9}.entry-content .hatena-asin-detail li{line-height:1.4}.entry-content blockquote{margin:1em 0;padding:5px 5px 5px 15px;border-left:2px solid #959c9e}@media (min-width: 1020px){.entry-content blockquote{margin:1.5em 3em;padding:5px 20px}}.entry-content blockquote p:first-child{margin-top:0}.entry-content blockquote p:last-child{margin-bottom:0}.entry-content pre,.entry-content code{font-family:Monaco,Consolas,Courier New,Courier,monospace,sans-serif}.entry-content pre{background:#f7f8f9;border:none;white-space:pre-wrap;text-overflow:ellipsis ellipsis;font-size:100%;line-height:1.3;font-size:.8rem;padding:10px}@media (min-width: 1020px){.entry-content pre{font-size:.85rem;padding:15px}}.entry-content pre>code{margin:0;padding:0;white-space:pre;border:none;background-color:transparent;font-family:Monaco,Consolas,Courier New,Courier,monospace,sans-serif}.entry-content code{font-size:90%;margin:0 2px;padding:0 5px;background-color:#f7f8f9;border-radius:3px}.entry-content hr{width:50%;border:0;border:none;border-top:1px solid #d2d7e5;margin:2em auto}.entry-content .hatena-asin-detail,.entry-content .itunes-embed{background-color:#f7f8f9;border-color:#d2d7e5}.entry-content .entry-see-more{display:inline-block;text-align:center;padding:.8em 1.2em;cursor:pointer;line-height:1.5;font-size:.8rem;overflow:hidden;color:#3d3f44;background-color:transparent;text-decoration:none!important;border:1px solid #d2d7e5;transition:all .2s;width:100%;box-sizing:border-box;text-decoration:none}.entry-content .entry-see-more:hover{color:#3d3f44;background-color:#f7f8f9;text-decoration:none;border-color:#b2bad2}.entry-content .entry-see-more img,.entry-content .entry-see-more svg{vertical-align:top;margin-right:.3em}.entry-content .table-of-contents{padding:1em 1em 1em 2em;margin:1em 0;border:1px solid #d2d7e5}.entry-footer-section{color:#959c9e;font-size:.8rem}.entry-footer-section a{color:#959c9e}.entry-footer-section a:hover{color:#3067cb}.comment-box{margin:1em 0}.comment-box .comment{list-style:none;margin:0 0 15px;padding:0;line-height:1.7;font-size:.85rem}@media (min-width: 768px){.comment-box .comment{font-size:.9rem}}.comment-box .entry-comment{padding:10px 0 10px 60px;border-bottom:1px solid #d2d7e5;position:relative}.comment-box .entry-comment:first-child{border-top:1px solid #d2d7e5}.comment-box .read-more-comments{padding:10px 0}.comment-box .hatena-id-icon{position:absolute;top:10px;left:0;width:50px!important;height:50px!important;border-radius:3px}.comment-user-name{margin:0 0 .4em;font-weight:700}.comment-content{margin:0 0 .4em;word-wrap:break-word;color:#3d3f44;font-size:.85rem}.comment-content p{margin:0 0 .6em}.comment-metadata{color:#959c9e;margin:0;font-size:.8rem}.comment-metadata a{color:#959c9e}.leave-comment-title{display:inline-block;text-align:center;cursor:pointer;line-height:1.5;font-size:.8rem;overflow:hidden;color:#3d3f44;background-color:transparent;text-decoration:none!important;border:1px solid #d2d7e5;transition:all .2s;padding:.6em 1em}.leave-comment-title:hover{color:#3d3f44;background-color:#f7f8f9;text-decoration:none;border-color:#b2bad2}.leave-comment-title img,.leave-comment-title svg{vertical-align:top;margin-right:.3em}.pager{text-align:center;margin:3em auto}.pager a{display:inline-block;text-align:center;padding:.8em 1.2em;cursor:pointer;line-height:1.5;font-size:.8rem;overflow:hidden;color:#3d3f44;background-color:transparent;text-decoration:none!important;border:1px solid #d2d7e5;transition:all .2s}.pager a:hover{color:#3d3f44;background-color:#f7f8f9;text-decoration:none;border-color:#b2bad2}.pager a img,.pager a svg{vertical-align:top;margin-right:.3em}.pager.permalink{display:flex;justify-content:center;align-items:center;text-align:center}@media (min-width: 768px){.pager.permalink{width:70%}}.pager.permalink a{color:#3d3f44!important;border:none;padding:0;font-weight:400;font-size:.9rem}@media (min-width: 768px){.pager.permalink a{font-size:1.1rem}}.pager.permalink a:hover{background-color:transparent;color:#3067cb!important}.pager.permalink .pager-next,.pager.permalink .pager-prev{width:50%;padding:.5em 0}.pager.permalink .pager-prev+.pager-next{border-left:1px solid #d2d7e5;margin-left:1em;padding-left:1em}@media (min-width: 768px){.pager.permalink .pager-prev+.pager-next{margin-left:1.5em;padding-left:1.5em}}#box2-inner{display:flex;flex-wrap:wrap;flex-direction:column;justify-content:flex-start}@media (min-width: 481px){#box2-inner{flex-direction:row;margin-left:-20px}}@media (min-width: 1020px){#box2-inner{margin-left:-30px}}#box2-inner>.ad{width:100%}#box2-inner .hatena-module{width:100%}@media (min-width: 481px){#box2-inner .hatena-module{width:50%;padding-left:20px}}@media (min-width: 768px){#box2-inner .hatena-module{width:33.3333%}}@media (min-width: 1020px){#box2-inner .hatena-module{padding-left:30px}}.hatena-module{box-sizing:border-box;margin-bottom:2em;font-size:.85rem}@media (min-width: 768px){.hatena-module{font-size:.85rem}}.hatena-module-title{margin-bottom:.6em;padding-bottom:.2em;border-bottom:1px solid #d2d7e5;font-size:1rem}.hatena-module-title a{color:#3d3f44;text-decoration:none}.hatena-module-title a:hover{text-decoration:underline}.hatena-module-profile .profile-icon{float:left;margin:0 10px 10px 0}.hatena-module-profile .id{display:block;font-weight:700;margin-bottom:.5em}.hatena-module-profile .profile-description p{margin-top:0}.hatena-urllist{list-style:none;margin:0;padding:0}.hatena-urllist li{padding:.5em 0;line-height:1.5}.hatena-urllist li:last-child{padding-bottom:0}.hatena-urllist li a{text-decoration:none}.hatena-urllist .urllist-category-link{display:inline-block;text-align:center;cursor:pointer;line-height:1.5;font-size:.8rem;overflow:hidden;color:#3d3f44;background-color:transparent;text-decoration:none!important;border:1px solid #d2d7e5;transition:all .2s;font-size:.75rem;font-size:.7rem;padding:.1em .3em;line-height:1.2}.hatena-urllist .urllist-category-link:hover{color:#3d3f44;background-color:#f7f8f9;text-decoration:none;border-color:#b2bad2}.hatena-urllist .urllist-category-link img,.hatena-urllist .urllist-category-link svg{vertical-align:top;margin-right:.3em}.hatena-urllist .urllist-title-link{line-height:1.3}.hatena-urllist .urllist-date-link a{color:#959c9e}.hatena-urllist .urllist-entry-body{margin-top:.3em;line-height:1.4}.hatena-module-search-box .search-form{border:1px solid #d2d7e5;border-radius:3px;width:100%;box-sizing:border-box;position:relative}.hatena-module-search-box .search-form:hover{border-color:#959c9e}.hatena-module-search-box .search-module-input{padding:5px;color:#3d3f44;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@2x.png?version=e0e0a3993d8aff6a6344f19dd784d5) no-repeat right center;background-size:20px 20px;border:none;outline:none;text-indent:-9999px;position:absolute;top:5px;right:5px;opacity:.5;cursor:pointer}.hatena-module-search-box .search-module-button:hover{opacity:.85}#footer{margin-top:2em;padding-bottom:2rem;text-align:center;font-size:.8rem;color:#959c9e}#footer a{color:#959c9e}#footer p{margin:.5em auto}.page-about dd{margin-bottom:1.5em}.page-about dd:last-child{margin-bottom:0}.archive-header-category{text-align:center}.page-archive .archive-entry{margin-bottom:3em;max-width:720px;margin-left:auto;margin-right:auto;line-height:1.3}.page-archive .archive-entry-header{text-align:center}.page-archive .entry-title{margin:.2em auto}.page-archive .categories{text-align:center;margin:.4em auto}.page-archive .entry-thumb{width:80px;height:80px;background-size:cover}@media (min-width: 768px){.page-archive .entry-thumb{width:120px;height:120px}}.page-archive .entry-description{margin:0;font-size:.85rem;line-height:1.5}@media (min-width: 768px){.page-archive .entry-description{font-size:.9rem}}.page-archive .social-buttons{display:block;margin-top:.3em} /* */ /*目次ルーズリーフ*/ .entry-content .table-of-contents { display: inline-block; padding: 0 1em 1em; background: #ffffff14; border-top: 0; border-right: 0; border-bottom: 0; border-left: 8px dotted #e1e1e2; box-shadow: 0px 0px 0 7px #ffffff, 1px 0px 0 7px #959595d4, 2px 0px 0 7px #fff, 3px 0px 0 7px #898989de, 4px 0px 0 7px #fff, 5px 0px 0 7px #858585de, 4px 0px 10px 9px #b8b8b896; width:70%; } .entry-content .table-of-contents::before { content: "CONTENTS"; display: block; position: static; margin: .3em 0 .4em; padding: 0; border-bottom: 2px solid #ddd; font-size: 1rem; font-weight: normal; text-align: start; } .entry-content .table-of-contents li { list-style-type: none; margin: 0 0 0 1em; font-size: 1.1em; } .entry-content .table-of-contents li ul { margin: 0 0 1em .5em; padding: 0; } .entry-content .table-of-contents li ul li { list-style-type: disc; color: #8d8d8d; font-size: .9em; } .entry-content .table-of-contents a { color: #5a5a5a; text-decoration: none; position: relative; display: block; line-height: 2em; background-image: linear-gradient(90deg, rgba(237, 119, 128, 0) 0%, rgba(237, 119, 128, 0) 50%, #fff 0%, #fff 100%), linear-gradient(180deg, rgba(100, 100, 100, 0) 0%, rgba(100, 100, 100, 0) 95%, #666 100%); background-size: 8px; } .table-of-contents{ padding: 20px 10px 20px 40px; border-radius: 5px; background: #ccffcc; } .entry-content h3 { padding: 4px 8px; color: #333; line-height: 2.0; background-color: #000080; } .entry-content h4{ border-left: 6px solid #333; padding-left: 8px; position: relative; color: #333; line-height: 1.5; } h5 { position: relative; display: inline-block; padding: 0 55px; } h5:before, h5:after { content: ''; position: absolute; top: 50%; display: inline-block; width: 45px; height: 1px; background-color: black; } h5:before { left:0; } h5:after { right: 0; } /* 改行修正 */ .entry-content p { margin:0} /* はてなブログにデフォルトで付いてる余白消す */ #level-gnav ul{ padding-left:0; } #level-gnav{ background: linear-gradient(#1a1a1a, #676767, #1a1a1a);/*グローバルナビの背景色*/ } #menu-btn{ color:#fff;/*スマホ画面の、「メニュー」ボタンの文字色*/ display:none; } .level-1{ display:flex; flex-wrap: wrap;/*文字を改行してナビを1行にするにはこれ消す*/ margin:0 auto; max-width:1200px; justify-content: center; /*ナビ中央寄せ*/ } .level-1 li{ list-style: none; position:relative; } #level-gnav a{ color:#fff;/*グローバルナビの文字色*/ text-decoration: none; display:block; padding:15px 18px; font-size:12px;/*文字の大きさ*0 } #level-gnav a:hover{ background:#777;/*マウスを乗せた時の色*/ } .level-2{ position:absolute; background:#333;/*下層メニューの背景色*/ top:100%; left:0; display:none; z-index: 2; width:100%; } /* --------タブレット・スマホ画面--------- */ @media(max-width:960px){ #menu-btn{ display:block; padding-left:10%; padding-top:10px; padding-bottom:10px; text-align:left; } .level-1{ display:none; } .level-2{ position:static; } #level-gnav a{ text-align:left; } #level-gnav .level-2 li a{ padding-left:35px; } } /* 表 */ .entry-content table { width: auto; /* 大きさを自動に */ } .entry-content table caption{ /* タイトル */ font-size: 20px; /* 文字の大きさ */ padding: 0.5px; /* 文字周りの余白 */ } .entry-content table th { /* 見出しセル */ border: 1px solid #a2a9b1; /* 線の太さ・種類・色コード */ background: #eaecf0; /* 背景色 */ text-align: center; /* 中央揃え */ padding: 0.35em; /* 文字周りの余白 */ width:auto;/* 大きさを自動に */ white-space:nowrap; /* 文字を折り返さない */ } .entry-content table td { /* 普通のセル */ border: 1px solid #a2a9b1; /* 線の太さ・種類・色コード */ padding: 0.35em; /* 文字周りの余白 */ width:auto;/* 大きさを自動に */ white-space:nowrap; /* 文字を折り返さない */ } /*記事の日付を消す*/ .date { display: none; } .entry-footer-time { display: none; } /* 記事の日付を消す終わり */ .ttl_center4 { font-weight: bold; padding: 0 1.5em; width: fit-content; margin: 0 auto; text-align: center; position: relative; } .ttl_center4::before, .ttl_center4::after { content: ''; background: #4c9ac0; width: 1em; height: 3px; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); } .ttl_center4::before { left: 0; } .ttl_center4::after { right: 0; } .ttl_background3 { text-align: center; margin: 0 auto; font-size: 15px !important;/*文字のサイズ*/ background: #0000cd;/*背景色*/ padding: .6em .7em;/*余白*/ color: #FFF; margin-bottom: -10px; } .ttl_background4 { text-align: center; font-size: 14px !important;/*文字のサイズ*/ background: #ffea00;/*背景色*/ padding: .3em .7em;/*余白*/ color: #00F; margin-bottom: 5px; } .ttl_background5 { text-align: center; margin: 0 auto; font-size: 14px !important;/*文字のサイズ*/ background: #0000cd;/*背景色*/ padding: .3em .7em;/*余白*/ color: #FFF; margin-bottom: 5px; } .ttl_background6 { text-align: center; margin: 0 auto; font-size: 13px !important;/*文字のサイズ*/ background: #da253a;/*背景色*/ padding: .3em .7em;/*余白*/ color: #FFF; margin-bottom: 5px; } /***サイドバーの画像サイズ調整***/ .urllist-image { width: 100%; } /***サイドバーの画像サイズ調整ここまで***/ /* ページトップへ戻るボタン */ #page-top { display:none; position:fixed; right:15px; bottom:10px; margin: 0; } #move-page-top{ opacity: 0.7; /* ふだんのボタンの透明度 */ display:block; cursor:pointer; } /* ポインタを重ねた時 */ #move-page-top a:hover{ opacity: 1.0; /* ポインタを重ねたときの透明度 */ } #page-top img { width:120px; height:auto; } /*マーカー線・黄色*/ .marker-yellow { background: linear-gradient(transparent 60%, #fff799 0%); font-weight: bold; } /*マーカー線・ピンク*/ .marker-pink { background: linear-gradient(transparent 60%, #ff99ff 0%); font-weight: bold; } /*マーカー線・黄色フル*/ .marker-yellow1 { background: linear-gradient(transparent 0%, #ffea00 0%); font-weight: bold; } /* 吹き出しのCSS　*/ .entry-content .l-fuki, .entry-content .r-fuki { position: relative; width: 80%; box-sizing: border-box; -webkit-box-sizing: border-box; padding: 20px; border-radius: 6px; border: 2px solid #999; box-shadow: 1px 1px 5px #aaa; background-color: #fff; z-index: 1; } .entry-content .l-fuki { margin: 20px 20% 60px 0; } .entry-content .r-fuki { margin: 20px 0 60px 19%; } .entry-content .l-fuki::before, .entry-content .r-fuki::before { position: absolute; content: ""; top: 16px; width: 10px; height: 10px; border-right: 2px solid #999; border-bottom: 2px solid #999; background-color: #fff; z-index: 2; } .entry-content .l-fuki::before { right: -7px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); } .entry-content .r-fuki::before { left: -7px; transform: rotate(135deg); -webkit-transform: rotate(135deg); } .entry-content .l-fuki::after, .entry-content .r-fuki::after { white-space: pre-wrap; font-size: 10px; text-align: center; line-height: 1.5em; position: absolute; width: 75px; height: 75px; top: -10px; border-radius: 40px; border: 3px solid #fff; background-size: cover; background-position: center center; background-repeat: no-repeat; box-shadow: 1px 1px 5px #aaa; } .entry-content .l-fuki::after { right: -110px; } .entry-content .r-fuki::after { left: -110px; } @media screen and (max-width: 620px) { .entry-content .l-fuki, .entry-content .r-fuki { width: 70% } .entry-content .l-fuki { margin-right: 30%; } .entry-content .r-fuki { margin-left: 30%; } } @media screen and (max-width: 478px) { .entry-content .l-fuki::after, .entry-content .r-fuki::after { width: 60px; height: 60px; border-radius: 30px; } .entry-content .l-fuki::after { right: -84px; } .entry-content .r-fuki::after { left: -84px; } } /* .XXX::after {background-image:url(画像のURL); content: "\a\a\a\a 名前"} */ .reowlkun::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240402/20240402093554.png); content: "\a\a\a\a\a\a リアウルくん"} .dansyaku::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240402/20240402093442.png); content: "\a\a\a\a\a\a ダンシャク"} .reowlkunase::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240402/20240402082506.png); content: "\a\a\a\a\a\a リアウルくん"} .dansyakuase::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240402/20240402085548.png); content: "\a\a\a\a\a\a ダンシャク"} .reowlkunbatsu::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240402/20240402082528.png); content: "\a\a\a\a\a\a リアウルくん"} .reowlkunneboke::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240402/20240402095215.png); content: "\a\a\a\a\a\a リアウルくん"} .hisyo::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240402/20240402105206.png); content: "\a\a\a\a\a\a 秘書"} .reowlkunniko::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240408/20240408221024.png); content: "\a\a\a\a\a\a リアウルくん"} .sekiduka::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240410/20240410084948.png); content: "\a\a\a\a\a\a 関塚スカウト"} .bukuro1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240502/20240502141111.png); content: "\a\a\a\a\a\a ???"} .bukuro2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240502/20240502150528.png); content: "\a\a\a\a\a\a ???"} .bukuro-up::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240509/20240509175022.png); content: "\a\a\a\a\a\a ブクロウ"} .bukuronomal::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240502/20240502150528.png); content: "\a\a\a\a\a\a ブクロウ"} .reowlkunmetoji::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240509/20240509181606.png); content: "\a\a\a\a\a\a リアウルくん"} .reowlkunkura::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240509/20240509172613.png); content: "\a\a\a\a\a\a リアウルくん"} .danmen1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240522/20240522225637.png); content: "\a\a\a\a\a\a ダンメン"} .danmen2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240522/20240522225637.png); content: "\a\a\a\a\a\a ???"} .atena1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240714/20240714201748.png); content: "\a\a\a\a\a\a ???"} .atena2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240716/20240716205410.png); content: "\a\a\a\a\a\a ???"} .atena3::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240716/20240716205410.png); content: "\a\a\a\a\a\a アテナ・ミズキ"} .hachi1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240716/20240716220830.png); content: "\a\a\a\a\a\a ???"} .hachi2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240720/20240720154744.png); content: "\a\a\a\a\a\a ハチロウ"} .miyade1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240915/20240915115442.png); content: "\a\a\a\a\a\a 宮出"} .oguro1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240915/20240915182212.png); content: "\a\a\a\a\a\a 大黒マリー"} .oguro2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240915/20240915184139.png); content: "\a\a\a\a\a\a 大黒マリー"} .oguro3::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240915/20240915190720.png); content: "\a\a\a\a\a\a 大黒マリー"} .kyama1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240922/20240922064233.png); content: "\a\a\a\a\a\a やまもと"} .reowlkunegg::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240922/20240922074131.png); content: "\a\a\a\a\a\a リアウルくん"} .bukuro3::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240502/20240502141111.png); content: "\a\a\a\a\a\a ブクロウ"} .hachiase::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240922/20240922092237.png); content: "\a\a\a\a\a\a ハチロウ"} .bukuropika::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240922/20240922143030.png); content: "\a\a\a\a\a\a ブクロウ"} .bukuro5::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240502/20240502150528.png); content: "\a\a\a\a\a\a ブクロウ"} .kyama2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240922/20240922223139.png); content: "\a\a\a\a\a\a やまもと"} .oguro4::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240922/20240922233353.png); content: "\a\a\a\a\a\a 大黒マリー"} .bigvan1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240923/20240923002321.png); content: "\a\a\a\a\a\a ゆでたまご"} .reowlkunasemetoji::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240923/20240923110915.png); content: "\a\a\a\a\a\a リアウルくん"} .bukurokie::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240923/20240923085823.png); content: "\a\a\a\a\a\a ブクロウ"} .bigvan2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240923/20240923122136.png); content: "\a\a\a\a\a\a Ｂバンエッグ"} .bigvan3::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240923/20240923122136.png); content: "\a\a\a\a\a\a Ｂバンエッグ"} .bigvan4::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240923/20240923144732.png); content: "\a\a\a\a\a\a Ｂバンエッグ"} .bigvan5::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240923/20240923144846.png); content: "\a\a\a\a\a\a Ｂバンエッグ"} .oguro5::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20240924/20240924094610.png); content: "\a\a\a\a\a\a 大黒マリー"} .hisyo2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241103/20241103224427.png); content: "\a\a\a\a\a\a 秘書"} .goro1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241104/20241104222347.png); content: "\a\a\a\a\a\a ゴロスケ"} .goroase::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241104/20241104224632.png); content: "\a\a\a\a\a\a ゴロスケ"} .power1::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241104/20241104220847.png); content: "\a\a\a\a\a\a 地球パワー"} .powerase::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241104/20241104224705.png); content: "\a\a\a\a\a\a 地球パワー"} .goro2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241105/20241105173352.png); content: "\a\a\a\a\a\a ゴロスケ"} .goro3::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241106/20241106052232.png); content: "\a\a\a\a\a\a ゴロスケ"} .goro5::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241106/20241106053818.png); content: "\a\a\a\a\a\a ゴロスケ"} .goro6::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241106/20241106134530.png); content: "\a\a\a\a\a\a ゴロスケ"} .goroko::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241108/20241108220751.png); content: "\a\a\a\a\a\a ゴロスケ"} .goropun::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241108/20241108220815.png); content: "\a\a\a\a\a\a ゴロスケ"} .goroko2::after {background-image:url(https://cdn-ak.f.st-hatena.com/images/fotolife/k/kuromatch/20241110/20241110040258.png); content: "\a\a\a\a\a\a ゴロスケ"} /* ボタンリンク */ /* テーブル全体 */ .ta02 {/* ボタンリンク全体の名前。変更したらHTMLも変える */ border: solid 2px #ffffff;/* テーブルの線を白にする。背景色に合わせて変更 */ margin: auto;/* テーブルを真ん中にする */ padding: 10px 15px; } /* ボタンリンク下部分 */ .btn000 {/* ボタン下部の名前。変更したらHTMLも変える */ text-decoration: none;/* リンクの下線消す */ background: linear-gradient(45deg, #9ae25b, #00c1e3);/* ボタンの色指定。＃～の色コードOK */ text-align: center;/* リンク文字を真ん中にする */ width:80%; padding: 5px 0px;} .btn000 a {/* ボタンのリンク関連の設定 */ text-decoration: none;/* リンクの下線消す */ background: linear-gradient(45deg, #9ae25b, #00c1e3); /* ボタンの色指定。＃～の色コードOK */ color: white;/* 文字色指定。＃～の色コードOK */ font-weight:bold;/* 文字を太字にする */ } .btn000:hover a {/* カーソルを置いた時の設定 */ text-decoration: none;/* 文字の下線消す */ color: gainsboro;/* オンマウスで文字色変える */ } /* ボタンリンク上部分 */ .tt00 {/* ボタン上部の呼びかけ部分 */ font-size: 90%;/* 文字サイズを変更したい時。変更不要なら削除してOK */ color: #000000;/* 文字色設定 */ text-align:center;/* 文字を真ん中にする */ font-weight:bold;/* 文字を太字にする */ } .parent { display: flex; } .child { color: #fff; border: solid 1px #fff; text-align: center; line-height: 25px; width: 116px; height: 25px; background-color: blue; font-size: 12px; font-weight: bolder; } table.doubutsu1 th{ /* 見出しセル */ border: 1px solid #a2a9b1; /* 線の太さ・種類・色コード */ background: #0000cd; /* 背景色 */ text-align: center; /* 中央揃え */ padding: 0.25em; /* 文字周りの余白 */ width:80%;/* 大きさを自動に */ white-space:nowrap; /* 文字を折り返さない */ font-size: 18px; } table.doubutsu1 td{ /* 見出しセル */ border: 1px solid #a2a9b1; /* 線の太さ・種類・色コード */ text-align: center; /* 中央揃え */ padding: 0.35em; /* 文字周りの余白 */ white-space:nowrap; /* 文字を折り返さない */ font-size: 16px; font-weight: bolder;} table.doubutsu2 th{ /* 見出しセル */ border: 1px solid #a2a9b1; /* 線の太さ・種類・色コード */ background: #8ACEFF; /* 背景色 */ text-align: center; /* 中央揃え */ padding: 0.1em; /* 文字周りの余白 */ width:100PX;/* 大きさを自動に */ white-space:nowrap; /* 文字を折り返さない */ } table.doubutsu2 td{ /* 見出しセル */ border: 1px solid #a2a9b1; /* 線の太さ・種類・色コード */ padding: 0.5em; /* 文字周りの余白 */ width:45PX;/* 大きさを自動に */ white-space:nowrap; /* 文字を折り返さない */ } table.doubutsu3 th{ /* 見出しセル */ border: 1px solid #a2a9b1; /* 線の太さ・種類・色コード */ background: #eaecf0; /* 背景色 */ text-align: center; /* 中央揃え */ padding: 0.1em; /* 文字周りの余白 */ width:100PX;/* 大きさを自動に */ white-space:nowrap; /* 文字を折り返さない */ } /* div.footnote */ div.footnote { border-radius: 10px; background-color: #efebdd; font-size: 77%; margin: 0.1em !important; padding: 20px 10px 10px 20px !important; } /* 黒板 */ .blackboard { position: relative; margin: 0 auto 1.5rem; padding: 1.6rem 1rem; font-size: 1.2rem; color: #fff; border: 2px solid #000; border-radius: 5px; box-shadow: 0 0 0 4px #fff inset; background-color: rgba(0,0,0,0.9); } .blackboard.answer p { margin-left: 1.7rem; } .blackboard .blink-before { font-size: 1.2rem; } .blackboard a { text-decoration: none; color: #fff; } .blackboard .blink-before::before { content: '▶'; position: absolute; left: 1rem; animation: blink 1.4s infinite; } .blackboard p:last-of-type { margin-bottom: 0; } /* 回り込み */ .float-r { float: right; } /* 回り込み解除 */ .clearfix { zoom: 1; } .clearfix:after { clear: both; content: ""; display: block; } /* 点滅 */ @keyframes blink { 50% { opacity: 0; } } @-webkit-keyframes blink { 50% { opacity: 0; } } /* LINE001 */ .button_line001 a { position: relative; display: flex; justify-content: space-around; align-items: center; margin: 0 auto; max-width: 200px; padding: 10px 25px; color: #ff0000; transition: 0.3s ease-in-out; font-weight: 600; text-decoration: none; font-size: 18px;} .button_line001 a:before { position: absolute; bottom: 0px; left: 50%; content: ''; width: 100%; height: 2px; background: rgba(0,0,0,.1); transform: translateX(-50%); } .button_line001 a:after { position: absolute; bottom: 0px; left: 0; content: ''; width: 100%; height: 2px; background: #000; transform: scale(0, 1); transform-origin: left top; transition: transform .3s; } .button_line001 a:hover { opacity: 0.7; } .button_line001 a:hover:after { transform: scale(1, 1); } summary { cursor: pointer; }