/* */
@charset "UTF-8";/*!
Theme: Smooth
Author: Hatena Blog Team
Responsive: yes
*//*!
* Bootstrap Reboot v4.2.1 (https://getbootstrap.com/)
* Copyright 2011-2018 The Bootstrap Authors
* Copyright 2011-2018 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
* Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
*/*,*:before,*:after{box-sizing:border-box}html{font-family:sans-serif;line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0)}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;text-align:left;background-color:#fff}[tabindex="-1"]:focus{outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem}p{margin-top:0;margin-bottom:1rem}abbr[title],abbr[data-original-title]{text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;border-bottom:0;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul,dl{margin-top:0;margin-bottom:1rem}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#007bff;text-decoration:none;background-color:transparent}a:hover{color:#0056b3;text-decoration:underline}a:not([href]):not([tabindex]){color:inherit;text-decoration:none}a:not([href]):not([tabindex]):hover,a:not([href]):not([tabindex]):focus{color:inherit;text-decoration:none}a:not([href]):not([tabindex]):focus{outline:0}pre,code,kbd,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}pre{margin-top:0;margin-bottom:1rem;overflow:auto}figure{margin:0 0 1rem}img{vertical-align:middle;border-style:none}svg{overflow:hidden;vertical-align:middle}table{border-collapse:collapse}caption{padding-top:.75rem;padding-bottom:.75rem;color:#6c757d;text-align:left;caption-side:bottom}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button{border-radius:0}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,input{overflow:visible}button,select{text-transform:none}button,[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{padding:0;border-style:none}input[type=radio],input[type=checkbox]{box-sizing:border-box;padding:0}input[type=date],input[type=time],input[type=datetime-local],input[type=month]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;max-width:100%;padding:0;margin-bottom:.5rem;font-size:1.5rem;line-height:inherit;color:inherit;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:none}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}summary{display:list-item;cursor:pointer}template{display:none}[hidden]{display:none!important}html,body{background:#f9fafb;font-family:helvetica,Segoe UI,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,メイリオ,Meiryo,sans-serif;color:#293030}html{line-height:1}body{font-size:17px;line-height:1.6}img{vertical-align:baseline}a{color:#293030}a:hover{color:#586767;transition:all .3s}.date{margin:0 0 .7em;font-size:.9rem}.date a{color:#6f8383}.date a:hover{color:#a5b3b3}.date-last-updated{color:#6f8383;font-size:.9rem}#globalheader-container{position:sticky;top:0;background:#f9fafb}#container{word-wrap:break-word}#blog-title{max-width:1280px;margin:auto;padding:4% 5%;text-align:center}#title{font-size:150%;font-family:Times New Roman,游明朝体,YuMincho,游明朝,Yu Mincho,serif;font-weight:400}@media (min-width: 768px){#title{font-size:215%}}#blog-description{font-size:90%;font-weight:400}#content-inner{width:100%;display:flex;flex-direction:column}@media (min-width: 768px){#content-inner{flex-direction:row;margin:auto;padding:0 20px}}@media (min-width: 1200px){#content-inner{width:1200px}}#wrapper{flex:0 0 100%;max-width:100%}@media (min-width: 768px){#wrapper{flex:0 0 75%;max-width:75%}}@media (min-width: 1020px){#main{padding:0 3% 0 0}}.header-image-enable #blog-title,.header-image-only #blog-title{padding:0 0 1.5em}@media (min-width: 1200px){.header-image-enable #blog-title,.header-image-only #blog-title{width:1160px}}.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}@media (min-width: 1200px){.header-image-enable #blog-title #blog-title-inner,.header-image-only #blog-title #blog-title-inner{background-size:100%}}.header-image-enable #blog-title-content,.header-image-only #blog-title-content{margin:0 .5em}.breadcrumb{font-size:.9rem}.categories{margin-bottom:2em}.categories a{display:inline-block;background:#e9f0f2;margin:0 .3em 0 0;padding:0 10px;font-size:12px}.pager{text-align:center;margin:3em .8em}@media (min-width: 1020px){.pager{margin:0}}.pager a{display:inline-block;width:100%;background:#eff1f5;padding:.7em 1.2em;border:none;font-weight:400;font-size:.9rem;color:#293030}.pager a:hover{background-color:#e9ecf1;text-decoration:none}.pager .pager-next,.pager .pager-prev{width:100%;padding:.5em 0}.pager .pager-prev+.pager-next{margin-left:1em;padding-left:1em}@media (min-width: 768px){.pager .pager-prev+.pager-next{margin-left:1.5em;padding-left:1.5em}}.pager.permalink{display:flex;justify-content:center;align-items:center;text-align:center}.hatena-urllist{padding-left:0;list-style:none}.hatena-urllist li{border-top:1px dotted #cfd8d8;padding-top:10px;padding-bottom:10px}.hatena-urllist .archive-module-year,.hatena-urllist .archive-module-month{line-height:2}.hatena-urllist .urllist-date-link a{color:#6f8383}.hatena-urllist .urllist-category-link{display:inline-block;background:#e9f0f2;margin:.5em .3em 0 0;padding:3px 10px;font-size:12px;line-height:1.3}.hatena-urllist .urllist-category-link:hover{background:#d9e5e9;text-decoration:none;transition:background .3s}.hatena-urllist .urllist-entry-body{margin-top:10px}.hatena-module{margin-bottom:3em;padding-left:20px;padding-right:20px;font-size:.85rem}.hatena-module:last-child{margin-bottom:0}.hatena-module-title{margin-bottom:12px;font-family:Times New Roman,游明朝体,YuMincho,游明朝,Yu Mincho,serif;font-size:20px}.hatena-module-body{font-size:15px}.hatena-module-body .urllist-title-link{font-size:100%}.hatena-module-body .archive-module-button{display:inline-block;width:15px;height:15px}.hatena-module-body .archive-module-hide-button,.hatena-module-body .archive-module-show-button{position:absolute;overflow:hidden;width:15px;height:15px;text-indent:-15px}.hatena-module-body .archive-module-hide-button:after,.hatena-module-body .archive-module-show-button:after{content:"";top:50%;display:inline-block;position:absolute;width:8px;height:8px;margin-top:-.1em;border-top:1px solid #6f8383;border-right:1px solid #6f8383}.hatena-module-body .archive-module-hide-button{transform:rotate(135deg);margin-top:.2em}.hatena-module-body .archive-module-show-button{transform:rotate(45deg);margin-top:.2em}@media (min-width: 481px){.search-result-form{margin:0 1em}}.search-result+p{background:#fff;border:1px solid #f0f1f1;margin:0 0 3em;padding:8% 0;font-weight:700;text-align:center}.search-form,.search-result-form{position:relative;width:100%;background:#fff;margin:auto;border:1px solid #eee;box-sizing:border-box}.search-form:hover,.search-result-form:hover{border-color:#ddd}.search-module-input,.search-result-form .search-result-input{width:90%;height:30px;padding:5px;background:#fff;border:none;outline:none}.search-module-input::-webkit-input-placeholder,.search-result-form .search-result-input::-webkit-input-placeholder,.search-module-input::-placeholder,.search-result-form .search-result-input::-placeholder{color:#9faba9}.search-module-button,.search-result-form .search-result-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}.search-module-button:hover,.search-result-form .search-result-button:hover{opacity:.85}#top-box{margin:0 auto;padding:0 10px}@media (min-width: 768px){#top-box{padding:0 20px}}@media (min-width: 1200px){#top-box{max-width:1200px}}.entry{background:#fff;border:1px solid #f0f1f1;margin-bottom:2em;padding:8% 5%}@media (min-width: 768px){.entry{padding:8% 9% 5%}}.entry-header{position:relative;margin-bottom:1.5em}@media (min-width: 481px){.entry-header{margin-bottom:3em}}.entry-header-menu{position:absolute;top:0;right:0;margin-bottom:1em}.entry-header-menu a{background:#f9fafb;border:1px solid #cfd8d8;padding:5px 10px;font-size:.9rem}.entry-header-menu a:hover{background:#f3f5f7;text-decoration:none}.entry-title{margin-bottom:.5em;font-family:Times New Roman,游明朝体,YuMincho,游明朝,Yu Mincho,serif;font-size:130%;font-weight:400;line-height:1.5}@media (min-width: 768px){.entry-title{font-size:190%}}.entry-content{line-height:1.85}.entry-content a{color:#119e4d}.entry-content a:hover{color:#0c7037}.entry-content a.keyword{-webkit-text-decoration:underline dotted #cfd8d8;text-decoration:underline dotted #cfd8d8}.entry-content a.keyword:hover{color:#586767;-webkit-text-decoration:underline dotted #ffffff;text-decoration:underline dotted #ffffff}.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:1.5em 0 .8em;line-height:1.3}.entry-content h1{padding-bottom:15px;font-size:190%;border-bottom:1px solid #cfd8d8}.entry-content h2{font-size:165%}.entry-content h3{padding-bottom:10px;font-size:140%;border-bottom:1px solid #cfd8d8}.entry-content h4{font-size:130%}.entry-content h5{padding-bottom:10px;font-size:120%;border-bottom:1px solid #cfd8d8}.entry-content h6{font-size:100%}.entry-content ul,.entry-content ol,.entry-content dd{margin:0 0 1em 1.5em;padding:0;line-height:1.7}.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 dl{margin-top:2em}.entry-content dl dt{margin-bottom:.8em}.entry-content p{margin:0 0 .7em}.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 blockquote{position:relative;padding:9px 15px 9px 40px;border:1px solid #f0f1f1}@media (min-width: 1020px){.entry-content blockquote{padding:20px 20px 20px 60px}}.entry-content blockquote:before{display:inline-block;position:absolute;top:10px;left:10px;vertical-align:middle;content:"“";font-size:40px;font-family:Times New Roman,游明朝体,YuMincho,游明朝,Yu Mincho,serif;color:#6f8383;line-height:1}@media (min-width: 1020px){.entry-content blockquote:before{left:15px;font-size:70px}}.entry-content blockquote p{margin-bottom:0}.entry-content blockquote cite{display:block;margin-top:.5rem;text-align:right;font-size:85%;line-height:1.3}.entry-content table{border-collapse:collapse;border-spacing:0;border-bottom:1em;margin-bottom:1em;width:100%;overflow:auto;display:block}.entry-content table th,.entry-content table td{border:1px solid #f0f1f1;padding:5px 10px}.entry-content table th{background:#f9fafb}.entry-content pre,.entry-content code{font-family:Monaco,Consolas,Courier New,Courier,monospace,sans-serif}.entry-content pre{background:#293030;border:none;white-space:pre-wrap;text-overflow:ellipsis ellipsis;font-size:100%;font-size:.9rem;padding:10px;color:#ccc}@media (min-width: 768px){.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 .1em;padding:0 5px;border-radius:3px}.entry-content .table-of-contents{background:#f9fafb;margin-left:0;padding:15px 10px 15px 35px;font-size:16px}@media (min-width: 768px){.entry-content .table-of-contents{padding:20px 20px 20px 50px}}.entry-footer{margin-top:1em}.entry-footer-modules .hatena-module{padding:0}.entry-footer-section{margin-bottom:8px;color:#6f8383;font-size:.9rem}.entry-footer-section a{color:#6f8383}.entry-footer-ad{margin-left:-9%;margin-right:-9%}.comment-box{margin:0 -5%;padding:5% 5% 0;border-top:1px solid #f0f1f1}@media (min-width: 768px){.comment-box{margin:0 -11%;padding:20px 11% 0}}.comment-box .leave-comment-title{background:#f9fafb;border:1px solid #cfd8d8;padding:.5rem 1rem;font-size:.9rem}.comment-box .leave-comment-title:hover{background:#f3f5f7}.comment-box .comment{list-style:none;padding-left:0}.comment-box .comment a{color:#119e4d}.comment-box .comment a:hover{color:#0c7037}.comment-box .comment .comment-user-id{font-size:14px;font-weight:700}.comment-box .comment .entry-comment{padding:20px 0 0;border-top:1px solid #f0f1ff;color:#6f8383}.comment-box .comment .entry-comment:first-child{padding-top:0;border-top:none}.comment-box .comment .entry-comment .comment-content{word-wrap:break-word}.comment-box .comment .entry-comment .comment-content p{font-size:14px}.comment-box .comment .entry-comment time{font-size:12px}.comment-box .comment .read-more-comments{font-size:14px}@media (min-width: 1020px){.comment-box .comment .read-more-comments{margin-right:25px}}.comment-box .comment .read-more-comments a{position:relative;display:inline-block}.comment-box .comment .read-more-comments a:after{content:"";top:20%;left:-20px;display:inline-block;position:absolute;width:8px;height:8px;border-top:1px solid #119e4d;border-right:1px solid #119e4d;transform:rotate(135deg);margin-top:1px}#box2{flex:0 0 100%;max-width:100%;background:#fff3;padding:1em 0}@media (min-width: 768px){#box2{flex:0 0 25%;max-width:25%}}#box2 .hatena-urllist>li:last-child{border-bottom:1px dotted #cfd8d8}.hatena-module-profile .profile-icon-link{display:inline;float:left;margin-right:.7em}.hatena-module-profile .profile-icon-link .profile-icon{border-radius:400px}@media (min-width: 1020px){.hatena-module-profile .profile-icon-link{display:block;float:none;margin-right:0}}.hatena-module-profile .id{display:block}.hatena-module-profile .id a{color:#119e4d;font-weight:700}.hatena-module-profile .id a:hover{color:#0c7037}.hatena-module-profile .profile-description p{font-size:80%}.archive-module-calendar .calendar-day a{color:#119e4d;font-weight:700}.archive-module-calendar .calendar-day a:hover{color:#0c7037}.hatena-module-recent-comments .user-id span{font-size:12px;opacity:.7}#footer{background:#fff;margin-top:2em;padding-top:2rem;padding-bottom:2rem;text-align:center;font-size:.9rem;color:#6f8383}#footer a{color:#6f8383}#footer p{margin:.5em auto}.archive-header-category{margin-bottom:.3em}.page-archive .archive-heading{margin:.5em .7em 1.3em;line-height:1.5}@media (min-width: 1020px){.page-archive .archive-heading{margin:.5em 0 1.3em}}.page-archive .archive-entry{background:#fff;border:1px solid #f0f1f1;margin-bottom:30px;padding:9% 6% 6%}@media (min-width: 768px){.page-archive .archive-entry{padding:6%}}@media (min-width: 768px){.page-archive .archive-entry .entry-title{font-size:150%}}
/* */
/* */
/* default */
/* */
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
overflow-x: hidden;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
* {
box-sizing: border-box;
}
html {
scroll-padding-top: 70px; /* 固定ヘッダの高さ分 */
font-size: 62.5%;
text-size-adjust: 100%;
vertical-align: bottom;
}
body {
line-height: 1.5;
font-family: noto-sans, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
color: #333333;
}
img {
max-width: 100%;
height: auto;
vertical-align: bottom;
-ms-interpolation-mode: bicubic;
}
#page_top {
z-index: 99999;
width: 50px;
height: 50px;
position: fixed;
right: 0;
bottom: 5px;
background: #000;
opacity: 0.6;
}
#page_top a {
position: relative;
display: block;
width: 50px;
height: 50px;
text-decoration: none;
}
#page_top a::before {
font-family: 'Font Awesome 5 Free';
font-weight: 900;
content: '\f106';
font-size: 25px;
color: #fff;
position: absolute;
width: 25px;
height: 25px;
top: 50%;
bottom: 0;
right: 0;
left: 0;
margin: auto;
margin-top: -18px;
text-align: center;
}
/*-----------------------------------------------
リセット
-------------------------------------------*/
.archive-entries{
margin-top: 90px;
}
.entry-description {
font-size: 1.6rem;
}
.hatena-module-title {
font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
}
.hatena-urllist li {
border-top: none;
}
.hatena-module {
padding: 0;
}
.no-entry{
margin-top: 100px;
}
.search-result+p{
margin: 6em 0 3em;
}
#wrapper .archive-entries .entry-title-link {
font-family: noto-sans, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
font-weight: bold;
font-size: 1.8rem;
}
.search-result {
margin-top: 90px;
margin-bottom: -35px;
}
#content-inner {
padding: 0 20px 60px 20px;
}
.breadcrumb {
font-size: 1.6rem;
}
.categories a {
display: inline-block;
background: none;
border: 1px solid #2d2d2d;
margin: 0 .3em 10px 0;
padding: 0 10px;
font-size: 12px;
}
.slide-width{
position: relative;
max-width: 1280px;
margin: 0 auto;
}
.swiper-button-prev {
background-image: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200306/20200306113930.png) !important;
left: -1vw !important;
right: auto!important;
}
.swiper-button-next {
background-image: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200306/20200306113936.png) !important;
right: -1vw!important;
left: auto!important;
}
.swiper-container {
max-width: 1280px!important;
}
.pager a {
height: 62px;
font-weight: bold;
font-size: 1.6rem;
}
.logo{
text-align: center;
}
.sub-text{
margin-bottom: 5px;
white-space: nowrap;
}
/*-----------------------------------------------
右ナビ
-------------------------------------------*/
#box2 {
margin-top: 90px;
}
.hfeed #box2 {
margin-top: 0;
}
#box2 .hatena-module-category ul.hatena-urllist li {
padding: 0;
border-bottom: none;
}
.libmo-link {
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20210126/20210126111937.jpg) no-repeat;
width: 100%;
background-size: contain;
}
.libmo-link a {
display: block;
text-indent: -9999px;
max-width: 312px;
width: 100%;
height: 173px;
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20210126/20210126111937.jpg) no-repeat;
background-size: contain;
}
.libmo-link:hover {
opacity:0.5;
}
/*.libmo-link {
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200305/20200305154703.png) no-repeat;
width: 100%;
background-size: contain;
}
.libmo-link a {
display: block;
text-indent: -9999px;
max-width: 312px;
width: 100%;
height: 173px;
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200305/20200305154703.png) no-repeat;
background-size: contain;
}
.libmo-link a:hover {
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200305/20200305154659.png) no-repeat;
background-size: contain;
}*/
/*-----------------------------------------------
右ナビ-人気記事
-------------------------------------------*/
#box2 .hatena-module:nth-child(2) ul.hatena-urllist.entries-access-ranking {
font-size: 1.6rem;
}
#box2 .hatena-module:nth-child(2) ul.hatena-urllist.entries-access-ranking li {
padding-top: 5px;
padding-bottom: 5px;
}
#box2 .hatena-module:nth-child(2) ul.hatena-urllist.entries-access-ranking li a.urllist-image-link {
position: relative;
}
/*順位番号*/
#box2 .hatena-module:nth-child(2) ul.hatena-urllist.entries-access-ranking li:nth-child(1) a.urllist-image-link::after {
position: absolute;
content: "1";
display: inline-block;
width: 30px;
height: 30px;
background: rgba(255, 238, 0, 0.7);
top: 0px;
left: -131px;
text-align: center;
padding: 5px 0 0 0;
font-weight: bold;
}
#box2 .hatena-module:nth-child(2) ul.hatena-urllist.entries-access-ranking li:nth-child(2) a.urllist-image-link::after {
position: absolute;
content: "2";
display: inline-block;
width: 30px;
height: 30px;
background: rgba(255, 238, 0, 0.7);
top: 0px;
left: -131px;
text-align: center;
padding: 5px 0 0 0;
font-weight: bold;
}
#box2 .hatena-module:nth-child(2) ul.hatena-urllist.entries-access-ranking li:nth-child(3) a.urllist-image-link::after {
position: absolute;
content: "3";
display: inline-block;
width: 30px;
height: 30px;
background: rgba(255, 238, 0, 0.7);
top: 0px;
left: -131px;
text-align: center;
padding: 5px 0 0 0;
font-weight: bold;
}
#box2 .hatena-module:nth-child(2) ul.hatena-urllist.entries-access-ranking li:nth-child(4) a.urllist-image-link::after {
position: absolute;
content: "4";
display: inline-block;
width: 30px;
height: 30px;
background: rgba(255, 238, 0, 0.7);
top: 0px;
left: -131px;
text-align: center;
padding: 5px 0 0 0;
font-weight: bold;
}
#box2 .hatena-module:nth-child(2) ul.hatena-urllist.entries-access-ranking li:nth-child(5) a.urllist-image-link::after {
position: absolute;
content: "5";
display: inline-block;
width: 30px;
height: 30px;
background: rgba(255, 238, 0, 0.7);
top: 0px;
left: -131px;
text-align: center;
padding: 5px 0 0 0;
font-weight: bold;
}
/*-----------------------------------------------
右ナビ-カテゴリ
-------------------------------------------*/
#box2 .hatena-module:nth-child(3) ul.hatena-urllist {
font-size: 1.6rem;
}
#box2 .hatena-module:nth-child(3) ul.hatena-urllist li {
padding-top: 5px;
padding-bottom: 5px;
}
#box2 .hatena-module:nth-child(3) ul.hatena-urllist li a {
display: block;
font-size: 1.3rem;
padding: 0;
background: none;
border-radius: 0;
margin-left: auto;
margin-bottom: auto;
}
#box2 .hatena-module:nth-child(3) {
position: relative;
}
#box2 .hatena-module:nth-child(3)::after {
position: absolute;
content: "";
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200306/20200306175314.png) no-repeat;
background-size: contain;
width: 92px;
height: 138px;
bottom: -47px;
right: 14px;
z-index: 99998;
}
/*-----------------------------------------------
右ナビ-タグ
-------------------------------------------*/
#box2 .hatena-module:nth-child(4) ul.hatena-urllist {
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: -10px;
}
#box2 .hatena-module:nth-child(4) ul.hatena-urllist li {}
#box2 .hatena-module:nth-child(4) ul.hatena-urllist li a {
display: block;
padding: auto;
}
.hatena-urllist .urllist-category-link {
display: inline-block;
background: none;
border: 1px solid #2d2d2d;
padding: 3px 10px;
font-size: 12px;
line-height: 1.3;
}
#box2 .hatena-module-category ul.hatena-urllist li a {
display: block;
font-size: 1.3rem;
background: #ffed00;
padding: 5px;
margin-left: 10px;
margin-bottom: 10px;
}
#box2 .hatena-module:nth-child(4) ul.hatena-urllist li a {
display: block;
font-size: 1.3rem;
background: none;
border: 1px solid #2d2d2d;
/* border-radius: 4px; */
padding: 5px;
margin-left: 10px;
margin-bottom: 10px;
}
#box2 .hatena-module:nth-child(4) ul.hatena-urllist li a:link {
text-decoration: none;
}
#box2 .hatena-module:nth-child(4) ul.hatena-urllist li a:hover {
opacity: 0.7;
}
/*-----------------------------------------------
記事欄
-------------------------------------------*/
.comment-box .leave-comment-title {
background: #f9fafb;
border: 1px solid #cfd8d8;
padding: .5rem 1rem;
font-size: 1.4rem;
}
.breadcrumb {
margin-bottom: 2em;
margin-top: 90px;
}
.m-wrap #main-inner {
width: 100%;
margin-right: 50px;
text-align: center;
}
#main-inner .hatena-urllist li {
width: calc(50% - 10px);
}
#main-inner .hatena-urllist li .urllist-item-inner {
width: 100%;
padding: 20px;
}
#main-inner .hatena-module-title {
font-family: noto-sans, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
margin-bottom: 40px;
position: relative;
font-size: 3rem;
text-align: center;
font-weight: bold;
z-index: 999;
}
#main-inner .urllist-title-link {
font-weight: bold;
font-size: 1.6rem;
}
#main-inner .hatena-module-title a:link {
text-decoration: none;
}
#main-inner .hatena-module-title::after {
content: "";
text-align: center;
position: absolute;
display: inline-block;
background: #ffed00;
height: 11px;
width: 20%;
left: 50%;
margin-left: -10%;
top: 36px;
z-index: -1;
}
#main-inner .recent-entries-see-more {
position: relative;
border-radius: 4px;
border: 1px solid #2d2d2d;
font-size: 2.5rem;
font-weight: bold;
width: 380px;
text-align: center;
margin: 50px auto 50px auto !important;
}
#main-inner .recent-entries-see-more a {
color: #2d2d2d;
display: block;
padding: 10px;
}
#main-inner .recent-entries-see-more:hover {
border: 1px solid #2d2d2d;
background: #2d2d2d;
text-decoration: none;
}
#main-inner .recent-entries-see-more a:hover {
color: #fff;
text-decoration: none;
}
#main-inner .recent-entries-see-more::after {
content: "";
display: inline-block;
width: 0;
height: 0;
border-left: 10px solid #2d2d2d;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
background: none;
position: absolute;
top: 50%;
margin-top: -9px;
right: 22px;
}
#main-inner .recent-entries-see-more:hover::after {
border-left: 10px solid #fff;
}
#header-modules .hatena-module-title {
display: none;
}
#box2 .hatena-module-title {
font-family: noto-sans, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
position: relative;
font-size: 2.4rem;
font-weight: bold;
z-index: 999;
}
#box2 .hatena-module-title::after {
content: "";
position: absolute;
display: inline-block;
background: #ffed00;
height: 18px;
width: 100%;
left: 0;
top: 15px;
z-index: -1;
}
#box2 .urllist-title-link {
font-weight: bold;
font-size: 1.4rem;
}
#main-inner .hatena-urllist {
display: flex;
flex-wrap: wrap;
}
#main-inner .ullist-item-inner {
display: flex;
}
#main-inner .urllist-with-thumbnails li .urllist-image {
float: none;
}
.urllist-item-inner {
padding: 10px;
}
#box2 .urllist-item-inner {
width: 100%;
}
#box2 .hatena-urllist {
flex-direction: coulmn;
}
/*----------------------------*/
.m-wrap {
padding: 40px 0;
position: relative;
width: 1000px;
margin: 0 auto;
padding-top: 90px;
text-align: left;
}
.entry-content {
padding: 20px;
text-align: left;
}
article .entry-inner .entry-header h1.entry-title {
font-family: "noto-sans", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
font-size: 3rem;
line-height: 1.4;
font-weight: bold;
}
article .entry-inner{
font-family: "noto-sans", "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
}
#main-inner .entry-footer-modules .hatena-module-related-entries .related-entries-item-inner {
}
#main-inner .entry-footer-modules .hatena-module-title {
font-family: noto-sans, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
margin: 40px 0 0 0;
position: relative;
font-size: 2.4rem;
text-align: left;
font-weight: bold;
z-index: 999;
}
#main-inner .entry-footer-modules .hatena-module-title::after {
display: none;
}
.entry-content h2 {
margin-bottom: 20px;
font-size: 2.6rem;
line-height: 1.4;
border-bottom: solid 4px #ccc;
position: relative;
font-weight: bold;
}
.entry-content h2:after {
position: absolute;
content: " ";
display: block;
border-bottom: solid 4px #ffed00;
bottom: -4px;
width: 30%;
}
.conceptpage .entry-content h2:after {
display: none;
}
.entry-content h3 {
position: relative;
margin-bottom: 30px;
margin-left: 15px;
padding: 0 0 0 10px;
font-size: 2.6rem;
line-height: 1.4;
font-weight: bold;
border-bottom: none;
}
.entry-content h3::before{
position: absolute;
content: "";
display: inline-block;
width: 10px;
height: 90%;
top: 7%;
left: -15px;
background: #ffed00;
}
.entry-content h4 {
margin-bottom: 10px;
font-size: 2rem;
line-height: 1.4;
font-weight: bold;
}
.entry-content h5 {
margin-bottom: 10px;
font-size: 1.8rem;
line-height: 1.4;
font-weight: bold;
}
.entry-content .date {
font-size: 1.8rem;
color: #333;
}
.entry-content p strong{
font-weight:bold;
}
.entry-content > p {
font-size: 1.6rem;
line-height: 1.8;
margin-bottom: 1em;
}
.entry-content > p:last-of-type {
margin-bottom: 50px;
}
.entry-content > ul {
margin-bottom: 30px;
padding: 20px;
background: #eeeeee;
border: 1px solid #ccc;
line-height: 1.8;
font-size: 1.6rem;
text-indent: -1em;
padding-left: 2em;
}
.entry-content > table {
display:table;
width: calc(100% - 2rem);
margin: 0rem 0.5rem;
border-top: 3px solid #c9c9c9;
border-right: 3px solid #c9c9c9;
border-bottom: 2px solid #c9c9c9;
border-left: 3px solid #c9c9c9;
border-radius: 4px;
border-collapse: separate;
}
.entry-content > table tbody {
font-size: 1.4rem;
}
.entry-content > table tbody tr td > p {
margin: 0;
}
.entry-content > table tbody tr td.ttl {
font-weight: bold!important;
text-align: center;
}
.entry-content > table tbody tr td {
text-align:center;
}
.entry-content > table tbody tr td:first-child {
background: #eeeeee;
padding: 10px;
border-bottom: 1px solid #c9c9c9;
border-right: 1px solid #c9c9c9;
}
.entry-content > table tbody tr td:not(:first-child) {
padding: 10px;
border-bottom: 1px solid #c9c9c9;
}
article .entry-inner .entry-header {
background: none;
}
/*----------------------------
アーカイブ
----------------------------*/
.archive-header-category {
background: none;
}
.archive-header-category h2 {}
.page-archive .archive-heading {
margin: .5em 0 1.3em;
margin-bottom: -40px;
font-family: noto-sans, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
font-size: 3rem;
line-height: 1.4;
font-weight: bold;
}
/*ヘッダ*/
/*検索フォーム*/
.search-form .search-module-input, .search-result-form .search-result-input {
width: 100%;
height: auto;
border: none;
padding: 1em;
color: #333;
outline: none;
font-size: 1rem;
}
header {
background: #2b2b2b;
}
header > .h-wrap {
height: 126px;
color: #fff;
width: 100%;
padding: 10px;
margin: 0 auto;
display: -webkit-flex;
display: flex;
align-items: center;
justify-content: space-between;
}
header .logo_header:hover {
opacity: 0.5;
}
.logo_header{
margin-left: 30px;
}
header .header > .sub-text {
font-size: 1.2rem;
}
nav.header-nav {
font-size: 1.9rem;
font-weight: bold;
position: absolute;
left: calc((100% - 1000px) / 2); /*(全体幅-要素幅)/2が余白*/
height: 66px;
z-index: 99999;
}
nav.header-nav > ul {
display: -webkit-flex;
display: flex;
width: 1000px;
margin: 0 auto;
text-align: center;
}
nav.header-nav > ul > li {
position: relative;
width: calc(100%/7);
vertical-align: middle;
height: 72px;
}
nav.header-nav > ul > li > a {
display: block;
padding: 20px 0 0 0;
text-decoration: none;
}
nav.header-nav > ul > li > a:link, nav.header-nav > ul > li > a:visited {
color: #2D2D2D;
}
nav.header-nav > ul > li:not(.current) > a:hover {
color: #f3dc24;
}
nav.header-nav > ul > li:not(.current) > a::after {
content: "";
display: inline-block;
background: #f3dc24;
width: 100%;
height: 8px;
transform: scale(0, 1);
transform-origin: left top;
transition: transform .3s;
}
nav.header-nav > ul > li:not(.current) > a:hover::after {
transform-origin: right top;
transform: scale(1, 1);
}
nav.header-nav > ul > li.current > a::after {
content: "";
display: inline-block;
background: #f3dc24;
width: 100%;
height: 8px;
}
nav.header-nav > ul > li::before {
position: absolute;
top: 50%;
margin-top: -18px;
left: 0;
content: "";
display: inline-block;
background: #6F6F6F;
width: 1px;
height: 35px;
}
nav.header-nav > ul > li:first-child:before {
display: none;
}
/*-----------------------------------------------
メインビジュアルの下
-------------------------------------------*/
#header-modules .urllist-with-thumbnails li .urllist-image {
margin: 0;
}
#header-modules {
width: 100%;
margin: 0 auto;
margin-bottom: 90px;
}
#header-modules ul {
display: -webkit-flex;
display: flex;
justify-content: space-between;
}
#header-modules ul li {
position: relative;
width: calc(100%/3 - 10px);
height: 100%;
padding: 0;
margin-right: 0;
}
a[href^="https://blog.libmo.jp/archive"] {
background: none;
}
/*バックアップ
#header-modules ul li a.urllist-title-link {
position: absolute;
top: 0;
left: 0;
background: #000;
opacity: 0.7;
font-weight: bold;
color: #fff;
width: 45%;
height: 100%;
padding: 10px;
}*/
#header-modules ul li a.urllist-title-link {
position: absolute;
top: auto;
bottom: 0;
left: 0;
background: #000;
opacity: 0.7;
font-weight: bold;
color: #fff;
width: 100%;
/* display: none; */
height: 25%;
padding: 10px;
font-size: 1.4rem;
}
#header-modules ul li .urllist-item-inner {
padding: 0;
}
/*メインビジュアル*/
.mv {
margin: 0 -200%;
padding: 0 200%;
text-align: center;
/*background: #e7e8e8;*/
margin-bottom: 30px;
}
.mv > .mv-inner {
margin: 0 auto;
width: 100%;
max-width: 1280px;
height: 0;
max-height: 710px;
padding-top: 43.4%;
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20210818/20210818180424.jpg);
background-size: cover;
}
.m-wrap {
display: -webkit-flex;
display: flex;
width: 1000px;
margin: 0 auto;
}
/*コンセプトフッタ*/
.sohu {
animation: sohu 2s steps(1) infinite;
}
@keyframes sohu {
0% {
transform: rotate(0deg) translate(0, 0);
}
50% {
transform: rotate(10deg) translate(0, 0);
}
}
.sobo {
position: absolute;
top: -50px;
right: 10px;
animation: sobo 1.5s steps(2) infinite;
}
@keyframes sobo {
0% {
transform: rotate(0deg) translate(0, 0);
}
50% {
transform: rotate(15deg) translate(0, 0);
}
}
.slide-sobo {
animation: slide-sobo 30s steps(50) infinite;
}
@keyframes slide-sobo {
0% {
transform: translate(0, 0);
}
100% {
transform: translate(-100%, 0);
}
}
.concept {
background: #2b2b2b;
position: relative;
}
.concept .c-inner {
width: 1000px;
margin: 0 auto;
padding: 40px 0;
color: #fff;
}
.concept .c-inner > h2 {
margin-bottom: 25px;
font-size: 2.5rem;
font-weight: bold;
}
.concept .c-inner > p {
font-size: 1.4rem;
padding-bottom: 10px;
}
.footerWrap01 {
background: #fff;
}
.footerWrap01 a:link, .footerWrap01 .f-menu01 a:visited, .footerWrap01 a:link, .footerWrap01 .f-menu02 a:visited {
text-decoration: none;
color: #333;
}
.footerWrap02 {
position: relative;
background: #c9c9c9;
}
.footerWrap02 .sohu {
position: absolute;
width: 41px;
top: -56px;
right: 3%;
z-index: 99998;
}
.footerWrap02 a:link, .footerWrap02 a:visited {
text-decoration: none;
color: #333;
}
/*リンク集フッター*/
.f-inner01 {
display: -webkit-flex;
display: flex;
width: 1000px;
margin: 0 auto;
font-size: 1.5rem;
padding: 45px;
}
.f-menu01 {
margin-right: 20px;
font-weight: bold;
}
.f-menu01 > li {
padding-bottom: 5px;
}
.f-menu02 {
margin-right: 50px;
}
.f-menu02 > p {
font-weight: bold;
padding-bottom: 5px;
}
.f-menu02 > ul > li {
padding-bottom: 5px;
}
.logo_footer{
margin-right:50px;
padding-top: 30px;
}
/*コピーライトフッター*/
.f-inner02 {
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
font-size: 1.5rem;
padding: 45px;
}
.f-inner02 > ol {
display: -webkit-flex;
display: flex;
}
.f-inner02 > ol > li {
position: relative;
margin: 0 20px 0 0;
}
.f-inner02 > ol > li:hover {
text-decoration: underline;
}
.f-inner02 > ol > li::after {
position: absolute;
content: "";
display: inline-block;
background: #333;
width: 1px;
height: 100%;
margin-left: 10px;
}
nav.header-nav.m_fixed {
position: fixed;
top: 0;
left: auto;
z-index: 99999;
width: 100%;
background: rgba(255, 255, 255, 0.8);
}
.sns-link {
text-align: center;
text-decoration: none;
line-height: 54px;
outline: none;
}
.sns-link::before, .sns-link::after {
position: absolute;
z-index: -1;
display: block;
content: '';
}
.sns-link, .sns-link::before, .sns-link::after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition: all .3s;
transition: all .3s;
}
.sns-link {
display: block;
font-weight: bold;
font-size: 2.2rem;
text-align: center;
width: 300px;
height: 75px;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #333;
color: #333;
line-height: 77px;
overflow: hidden;
margin-bottom: 10px;
}
.sns-link:hover {
color: #fff;
}
.sns-link:after {
top: -100%;
left: -100%;
width: 100%;
height: 100%;
}
.sns-link:hover:after {
top: 0;
left: 0;
background-color: #333;
}
.Toggle {
display: none;
}
/*------------------------------------------------------
スマホ表示
-------------------------------------------------------*/
nav.header-nav > ul.pc-hidden, p.pc-hidden {
display: none;
}
@media screen and (max-width: 640px) {
.slide-width{
overflow: hidden;
padding: 0 10px;
}
.archive-entries{
margin-top: 0;
}
nav.header-nav > ul.pc-hidden, p.pc-hidden {
display: block;
}#main-inner .recent-entries-see-more {
width: 100%;
}
#content-inner {
padding: 10px 20px 60px 20px;
}
.hatena-module {
margin-bottom: 20px;
padding-left: 0;
padding-right: 0;
font-size: .85rem;
}
#box2 {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
background: hsla(0, 0%, 100%, .2);
padding: 10px 10px 1em;
}
.Toggle {
display: block;
}
.head-search {
display: none;
}
/*ヘッダ*/
.logo {
width: 36%;
margin-left:40px;
}
/*検索フォーム*/
.search-form, .search-result-form {
position: relative;
width: 100%;
background: #fff;
margin: auto;
border: none;
box-sizing: border-box;
}
.search-form .search-module-input, .search-result-form .search-result-input {
width: 100%;
height: auto;
border: 1px solid #ccc;
padding: 1em;
color: #333;
outline: none;
font-size: 1rem;
border-radius: 4px;
}
header {
background: #2b2b2b;
}
header > .h-wrap {
height: 90px;
color: #fff;
width: 100%;
margin: 0 auto;
display: -webkit-flex;
display: flex;
align-items: center;
justify-content: flex-start;
}
header .logo_header{
width: 26%;
padding-left: 2%;
margin:0;
}
header .header > .sub-text {
font-size: 0.6rem;
}
.sub-text {
font-size: 0.6rem;
}
.sp-nav-ttl {
padding: 50px 0 0 0;
}
nav.header-nav {
font-size: 1.9rem;
font-weight: bold;
position: absolute;
left: calc((100% - 1000px) / 2); /*(全体幅-要素幅)/2が余白*/
height: 72px;
}
nav.header-nav > ul {
width: 100%;
margin: 0 auto;
text-align: center;
-webkit-flex-direction: column;
flex-direction: column;
background: #fff; /*背景をグレーにする*/
padding: 15px;
font-weight: normal;
}
nav.header-nav > ul > li {
position: relative;
width: calc(100%/6);
vertical-align: middle;
height: 72px;
}
nav.header-nav > ul > li > a {
display: block;
padding: 20px 0;
text-decoration: none;
}
nav.header-nav > ul > li > a:link, nav.header-nav > ul > li > a:visited {
color: #2D2D2D;
}
nav.header-nav > ul > li:not(.current) > a:hover {
/* opacity: 0.5;
background: #000;*/
color: #000;
}
nav.header-nav > ul > li:not(.current) > a::after {
display: none;
}
nav.header-nav > ul > li:not(.current) > a:hover::after {
transform-origin: right top;
transform: scale(1, 1);
}
nav.header-nav > ul > li.current > a::after {
display: none;
}
nav.header-nav > ul > li::before {
display: none;
}
nav.header-nav > ul > li:first-child:before {
display: none;
}
nav.header-nav.m_fixed {
position: fixed;
top: 0;
left: auto;
z-index: 2;
width: 100%;
background: #fff;
opacity: 0.7;
}
/*トグルメニュー*/
nav.header-nav {
position: fixed; /*表示位置を固定*/
z-index: 2; /*重ね順を変更*/
top: 0; /*表示位置を指定*/
left: 0; /*表示位置を指定*/
background: #fff; /*背景を白にする*/
color: #000; /*文字色を黒にする*/
text-align: center; /*テキストを中央揃え*/
width: 100%; /*全幅表示*/
height: 530px;
transform: translateY(-620px); /*ナビを上に隠す*/
transition: all 0.6s; /*アニメーションの時間を指定*/
}
nav.header-nav ul li {
font-size: 1.5rem;
list-style-type: none;
padding: 0;
width: 100%;
height: 60px;
border-bottom: 1px dotted #333;
}
nav.header-nav ul li:last-child {
padding-bottom: 0;
border-bottom: none; /*最後のメニュー項目のみ下線を消す*/
}
nav.header-nav ul li a {
display: block; /*クリックできる領域を広げる*/
color: #000;
padding: 1em 0;
}
/*トグルボタンが押されたときに付与するクラス*/
nav.header-nav.active {
transform: translateY(0);
z-index: 9999;
opacity: inherit;
}
.no-entry{
margin-top: 0;
}
/*-----------------------------------------------
メインビジュアルの下
-------------------------------------------*/
#header-modules .urllist-with-thumbnails li .urllist-image {
margin: 0;
max-width: 100%;
}
.urllist-item-inner {
padding: 10px;
width: 100%;
max-width: 100%;
margin: 0 auto;
}
#header-modules ul li a.urllist-title-link {
position: absolute;
top: 0;
left: 0;
background: #000;
opacity: 0.7;
font-weight: bold;
color: #fff;
width: 53%;
height: 100%;
padding: 10px;
}
#header-modules {
width: 100%;
margin: 0 auto;
margin-bottom: 40px;
}
#header-modules ul li {
width: 100%;
height: 100%;
margin: 0;
padding: 0 0 0 53%;
}
/*メインビジュアル*/
.mv {
margin: 0;
padding: 0;
background: #f1f1f1;
margin-bottom: 0;
}
.mv > .mv-inner {
margin: 0 auto;
width: 100%;
height: 200px;
}
.m-wrap {
display: -webkit-flex;
display: flex;
-webkit-flex-direction: column;
flex-direction: column;
width: 100%;
margin: 0 auto;
}
/*記事欄*/
.m-wrap #main-inner {
width: 100%;
margin-right: 50px;
text-align: center;
}
.m-wrap #main-inner > h2 {
position: relative;
font-size: 4rem;
text-align: center;
font-weight: bold;
}
.m-wrap #main-inner > h2::after {
content: "";
position: absolute;
display: inline-block;
background: #ffed00;
height: 18px;
width: 34%;
left: 50%;
margin-left: -16%;
top: 58px;
z-index: -1;
}
.m-wrap .main-nav {
width: 100%;
}
.box01 > h2 {
position: relative;
font-size: 2.4rem;
font-weight: bold;
}
.box01 {
position: relative;
font-size: 2.4rem;
font-weight: bold;
}
.box01 > h2::after {
content: "";
position: absolute;
display: inline-block;
background: #ffed00;
height: 18px;
width: 100%;
left: 0;
top: 15px;
z-index: -1;
}
/*-----------------------------------------------
記事欄
-------------------------------------------*/
.page-archive .archive-heading {
margin: .5em 0 1.3em;
font-family: noto-sans, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
font-size: 3rem;
line-height: 1.4;
font-weight: bold;
}
.m-wrap #main-inner {
width: 100%;
margin-right: 50px;
text-align: center;
}
#main-inner .hatena-module-title {
font-family: noto-sans, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
margin-bottom: 30px;
position: relative;
font-size: 3rem;
text-align: center;
font-weight: bold;
z-index: 999;
}
#main-inner .urllist-title-link {
font-weight: bold;
font-size: 1.8rem;
}
#main-inner .hatena-module-title a:link {
text-decoration: none;
}
#main-inner .hatena-module-title::after {
content: "";
position: absolute;
display: inline-block;
background: #ffed00;
height: 10px;
width: 50%;
left: 50%;
margin-left: -25%;
top: 40px;
z-index: -1;
}
#header-modules .hatena-module-title {
display: none;
}
#main-inner .hatena-urllist li {
width: 100%;
}
#box2 .hatena-module-title {
font-family: noto-sans, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
position: relative;
font-size: 2.4rem;
font-weight: bold;
z-index: 999;
}
#box2 .hatena-module-title::after {
content: "";
position: absolute;
display: inline-block;
background: #ffed00;
height: 18px;
width: 100%;
left: 0;
top: 15px;
z-index: -1;
}
#box2 .urllist-title-link {
font-weight: bold;
}
#main-inner .hatena-urllist {
justify-content: center;
flex-wrap: wrap;
-webkit-flex-direction: column;
flex-direction: column;
}
#main-inner .ullist-item-inner {
display: flex;
-webkit-display: flex;
}
#main-inner .urllist-with-thumbnails li .urllist-image {
float: none;
}
#box2 .urllist-item-inner {
width: 100%;
}
#box2 .hatena-urllist {
-webkit-flex-direction: column;
flex-direction: column;
}
/*----------------------------*/
.m-wrap {
padding: 40px 0;
position: relative;
width: 1000px;
margin: 0 auto;
padding-top: 90px;
text-align: left;
}
.entry-content {
padding: 0;
text-align: left;
}
.entry-content h1 {
font-size: 3rem;
line-height: 1.4;
font-weight: bold;
}
.entry-content h2 {
margin-bottom: 20px;
font-size: 2.6rem;
line-height: 1.4;
border-bottom: solid 4px #ccc;
position: relative;
font-weight: bold;
}
.entry-content h2:after {
position: absolute;
content: " ";
display: block;
border-bottom: solid 4px #ffed00;
bottom: -4px;
width: 30%;
}
.conceptpage .entry-content h2:after {
display: none;
}
.entry-content h3 {
margin-bottom: 20px;
font-size: 2.6rem;
line-height: 1.4;
border-bottom: solid 2px #ffed00;
font-weight: bold;
padding-bottom: 10px;
}
.entry-content h4 {
margin-bottom: 10px;
font-size: 2rem;
line-height: 1.4;
font-weight: bold;
}
.entry-content h5 {
margin-bottom: 10px;
font-size: 1.8rem;
line-height: 1.4;
font-weight: bold;
}
.entry-content .date {
font-size: 1.8rem;
color: #333;
}
.entry-content > p {
font-size: 1.6rem;
line-height: 1.8;
margin-bottom: 1em;
}
.entry-content > p:last-of-type {
margin-bottom: 50px;
}
.entry-content > ul {
margin-bottom: 30px;
padding: 20px;
background: #eeeeee;
border: 1px solid #ccc;
line-height: 1.8;
font-size: 1.6rem;
text-indent: -1em;
padding-left: 2em;
}
.entry-content > table {
display: table;
width: 100%;
margin: 0 auto;
border-top: 3px solid #c9c9c9;
border-right: 3px solid #c9c9c9;
border-bottom: 2px solid #c9c9c9;
border-left: 3px solid #c9c9c9;
border-radius: 4px;
border-collapse: separate;
}
.entry-content > table tbody {
font-size: 1.3rem;
}
.entry-content > table tbody tr th {
background: #eeeeee;
padding: 1rem;
border-bottom: 1px solid #c9c9c9;
border-right: 1px solid #c9c9c9;
}
.entry-content > table tbody tr td {
padding: 12px;
border-bottom: 1px solid #c9c9c9;
}
/*コンセプトフッタ*/
.concept {
background: #2b2b2b;
}
.concept .c-inner {
width: 100%;
margin: 0 auto;
padding: 40px 20px;
color: #fff;
}
.concept .c-inner > h2 {
margin-bottom: 25px;
font-size: 2rem;
font-weight: bold;
}
.concept .c-inner > p {
font-size: 1.4rem;
}
.footerWrap01 {
background: #fff;
}
.footerWrap02 {
background: #c9c9c9;
}
/*リンク集フッター*/
.f-inner01 {
-webkit-flex-direction: column;
flex-direction: column;
width: 100%;
margin: 0 auto;
font-size: 1.5rem;
padding: 45px;
}
/*コピーライトフッター*/
.f-inner02 {
-webkit-flex-direction: column;
flex-direction: column;
width: 100%;
margin: 0 auto;
font-size: 1.5rem;
padding: 45px;
}
.f-inner02 > small {
font-size: 1.3rem;
padding: 20px 0 20px 0;
-webkit-order: 2;
order: 2;
}
.f-inner02 > ol {
display: -webkit-flex;
display: flex;
-webkit-order: 1;
order: 1;
-webkit-flex-direction: column;
flex-direction: column;
}
.f-inner02 > ol > li {
position: relative;
display: 1.3rem;
padding: 0 0 10px 0;
}
.f-inner02 > ol > li::after {
display: none;
}
.f-menu01 {
margin-right: 20px;
}
.f-menu02 {
margin-bottom: 20px;
margin-right: 80px;
}
/*トグルボタンのスタイルを指定*/
.Toggle {
display: block;
position: fixed; /* bodyに対しての絶対位置指定 */
right: 13px;
top: 25px;
width: 42px;
height: 42px;
cursor: pointer;
z-index: 10000;
}
.Toggle span {
display: block;
position: absolute;
width: 30px;
border-bottom: solid 3px #fff;
-webkit-transition: .35s ease-in-out; /*変化の速度を指定*/
-moz-transition: .35s ease-in-out; /*変化の速度を指定*/
transition: .35s ease-in-out; /*変化の速度を指定*/
left: 6px;
}
.Toggle span.toggle_c {
border-bottom: solid 3px #000;
}
.Toggle span:nth-child(1) {
top: 9px;
}
.Toggle span:nth-child(2) {
top: 18px;
}
.Toggle span:nth-child(3) {
top: 27px;
}
/* 最初のspanをマイナス45度に */
.Toggle.active span:nth-child(1) {
top: 18px;
left: 6px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
border-bottom: solid 3px #000;
}
/* 2番目と3番目のspanを45度に */
.Toggle.active span:nth-child(2), .Toggle.active span:nth-child(3) {
top: 18px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
border-bottom: solid 3px #000;
}
.main_cover{
position: fixed;
width: 100%;
visibility: hidden;
z-index: -1;
-webkit-transition: .3s;
transition: .3s;
}
.main_cover.active{
height:100%;
visibility: visible;
background:rgba(0,0,0,0.4);
z-index:1000;
}
.sns-link {
display: block;
font-weight: bold;
font-size: 2.2rem;
text-align: center;
width: 100%;
height: 55px;
position: relative;
z-index: 2;
background-color: #fff;
border: 2px solid #333;
color: #333;
line-height: 51px;
overflow: hidden;
margin-bottom: 10px;
}
#wrapper,#box2{
flex: none;
}
.logo_footer{
width: 60%;
margin-bottom: 20px;
padding-top:0;
}
}
/*コメントボックス*/
.comment-box {
position: relative;
margin: 0 -11%;
padding: 135px 0% 0;
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200914/20200914140432.png) no-repeat 30px 20px;
}
.comment-box::after {
position: absolute;
content: "";
display: inline-block;
width: 6%;
height: 100%;
top: 13px;
left: 49%;
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200914/20200914140436.png) no-repeat;
background-size: contain;
}
.comment-box .leave-comment-title {
position: relative;
font-size: 16px;
padding: 10px 10px 10px;
margin-left: 30px;
background: #FFEE00;
font-weight: bold;
color: #000 !important;
text-align: center;
border-radius: 6px;
box-shadow: 1px 1px 0px 3px #000;
display: block;
width: 260px;
-webkit-transition: .4s;
-o-transition: .4s;
transition: .4s;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}.comment-box .leave-comment-title::after {
content: "";
display: inline-block;
position: absolute;
top: 50%;
margin-top: -11px;
left: 44px;
width: 22px;
height: 22px;
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200914/20200914105404.png) no-repeat;
background-size: contain;
}
.comment-box .comment {
list-style: none;
padding-left: 30px;
padding-bottom: 30px;
}
@media screen and (max-width: 640px) {
.comment-box {
position: relative;
margin: 0 -11%;
padding: 145px 0% 0;
background-size: 78%;
}
.comment-box::after {
position: absolute;
content: "";
display: inline-block;
width: 12%;
height: 100%;
top: 22px;
left: 82%;
background: url(https://cdn-ak.f.st-hatena.com/images/fotolife/l/libmo/20200914/20200914140436.png) no-repeat;
background-size: contain;
}
.comment-box .leave-comment-title {
font-size: 16px;
padding: 10px 10px 10px;
background: #FFEE00;
font-weight: bold;
color: #000 !important;
text-align: center;a
border-radius: 6px;
box-shadow: 1px 1px 0px 3px #000;
display: block;
width: 48%;
-webkit-transition: .4s;
-o-transition: .4s;
transition: .4s;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.comment-box .leave-comment-title::after {
content: "";
display: inline-block;
position: absolute;
top: 50%;
margin-top: -11px;
left: 8px;
width: 22px;
height: 22px;
background-size: contain;
}
.entry-content > table{
display: table;
}
}
/*-----------------------------------------------
20230405追加部分
-------------------------------------------*/
.nomadBtn4 {
display: inline-block;
padding: .5em 1em;
text-decoration: none !important;
background: #FFA500;
color: #FFF !important;
border-bottom: solid 3px #FF8C00;
border-radius: 3px;
text-decoration: none;
margin: 0 0 .5em;
font-weight: bold;
}
.nomadBtn4:active {
/*ボタンを押したときの動作*/
-webkit-transform: translateY(3px);
transform: translateY(3px);
border-bottom: none;
}
@media (max-width: 640px) {
.entry-content > .table_scroll {
overflow-x: auto;
}
.entry-content > .table_scroll th, .table-scroll td {
white-space: nowrap;
}}
.entry-content > .table_scroll p{
font-size: 1.4rem;
text-align: center;
}
.entry-content > .table_scroll tbody tr td:first-child{
background:#eeeeee;
border-right: 1px solid #c9c9c9;
}
.entry-content > .table_scroll tbody tr:first-child{
background:#eeeeee;
}
.entry-content > .table_scroll tbody tr:first-child td {
border-right: 1px solid #c9c9c9;
}
.entry-content > .table_scroll tr:first-child td:first-child{
border-bottom: 1px solid #c9c9c9;
border-right: 1px solid #c9c9c9;
}
.entry-content > .table_scroll tbody tr td:not(:first-child) {
border-bottom: 1px solid #c9c9c9;
}
.entry-content > .table_scroll tbody tr td:first-child {
border-bottom: 1px solid #c9c9c9;
border-right: 1px solid #c9c9c9;
}
.entry-content > .table_scroll > table tbody{
border: 3px solid #c9c9c9;
}