```css
/* =========================================================
   シルバニア手作り日記
   Hatena Blog カスタムCSS
   ========================================================= */


/* =========================================================
   01. 基本設定
   ========================================================= */

/* 使用テーマ */
@charset "UTF-8";@import"https://fonts.googleapis.com/css?family=Allura";/*! normalize.css v3.0.0 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}.clearfix{display:block;*zoom: 1}.clearfix:after{display:block;visibility:hidden;font-size:0;height:0;clear:both;content:"."}.inline-block{display:inline-block;*display: inline;*zoom: 1}.ellipsis{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}@font-face{font-family:HuiFontP109;src:url(https://cdn.blog.st-hatena.com/fonts/public/HuiFont/HuiFontP109.eot?version=d422509bd0b39c8cdd48718768287a);src:url(https://cdn.blog.st-hatena.com/fonts/public/HuiFont/HuiFontP109.eot?version=d422509bd0b39c8cdd48718768287a) format("embedded-opentype"),url(https://cdn.blog.st-hatena.com/fonts/public/HuiFont/HuiFontP109.woff?version=d422509bd0b39c8cdd48718768287a) format("woff"),url(https://cdn.blog.st-hatena.com/fonts/public/HuiFont/HuiFontP109.ttf?version=d422509bd0b39c8cdd48718768287a) format("truetype"),url(https://cdn.blog.st-hatena.com/fonts/public/HuiFont/HuiFontP109.svg?version=d422509bd0b39c8cdd48718768287a) format("svg")}body{font-family:Helvetica Neue,Helvetica,Arial,Hiragino Kaku Gothic Pro,Meiryo,MS PGothic,sans-serif;color:#524336;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/bg.gif?version=d422509bd0b39c8cdd48718768287a) repeat left top}a{color:#ffb2a4;font-style:normal;text-decoration:none}h1 a,h2 a,h3 a,h4 a,h5 a,h6 a,h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover,h1 a:visited,h2 a:visited,h3 a:visited,h4 a:visited,h5 a:visited,h6 a:visited{text-decoration:none;font-weight:400}a.keyword{text-decoration:none;border-bottom:1px dotted #ddd;color:#524336}a.keyword:hover{text-decoration:none!important}.btn{display:inline-block;*display: inline;*zoom: 1;padding:4px 10px;margin-bottom:0;line-height:18px;color:#90bac8;background-color:#edf5f8;text-align:center;vertical-align:middle;border-radius:2px;background-clip:padding-box;cursor:pointer;font-size:12px;text-decoration:none;border:1px solid #90bac8;text-decoration:none!important}.btn:hover{opacity:.7;filter:alpha(opacity=70);text-decoration:none!important}.btn-small{padding:2px 10px!important;font-size:11px!important}.btn-large{padding:13px 19px;font-size:17px;line-height:normal;font-weight:700}#globalheader-container{color:#524336;position:sticky;top:0}#container{width:1080px;margin-left:auto;margin-right:auto;padding-bottom:30px}#container #content{display:block;*zoom: 1}#container #content:after{display:block;visibility:hidden;font-size:0;height:0;clear:both;content:"."}#container-inner{width:980px;background:#fff;border-radius:5px;background-clip:padding-box;margin-left:auto;margin-right:auto;padding-left:50px;padding-right:50px}.globalheader-off #container{padding-top:0}#main{width:600px;float:left}#box2{width:300px;float:right}#blog-title-inner{margin:50px 0 15px;padding:20px 250px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/header-bg.png?version=d422509bd0b39c8cdd48718768287a) no-repeat 175px top}#blog-title-inner h1{font-size:40px;text-align:center;width:480px;margin-top:90px}#title{margin:0}#title a{color:#524336;font-family:HuiFontP109,sans-serif;font-weight:400}#blog-description{font-weight:400;font-size:80%;text-align:center;margin-top:10px}#top-editarea,.header-image-enable #content{margin-top:40px}.header-image-enable #container-inner{padding-top:10px}.header-image-enable #blog-title-inner{margin:40px 0 15px}.header-image-enable #blog-title-inner h1{margin-top:0}.header-image-enable #title{padding-top:50px}.header-image-enable #title,.header-image-enable #blog-description{padding-left:20px}#top-box{margin:10px auto 25px;font-size:90%}#top-box .breadcrumb a:hover{text-decoration:underline}.entry{position:relative;margin-bottom:100px}.entry-header{padding:0 0 10px;margin-bottom:20px;position:relative}.entry-title{font-family:HuiFontP109,sans-serif;font-size:24px;width:500px;margin:0 0 23px 10px;line-height:1.2;display:inline-block;vertical-align:middle}.entry-title a{color:#90bac8}.customized-header{margin-top:50px}.date{font-weight:400;margin-bottom:5px}.date a{color:#524336;font-family:Allura,cursive;text-decoration:none}.entry-date{width:82px;height:82px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/date-bg.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left top;display:inline-block;line-height:1}.entry-date .date-year{display:inline-block;font-size:18px;margin-top:22px;margin-left:23px}.entry-date .hyphen{display:none}.entry-date .date-month{margin-left:17px}.entry-date .date-month,.entry-date .date-day{font-size:22px}.categories{margin-top:5px;padding-top:20px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/entry-title-border.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left top;font-size:80%}.categories a{color:#90bac8;padding:3px 12px;margin-right:3px;background:#edf5f8;border-radius:5px;background-clip:padding-box;display:inline}.categories a:hover{text-decoration:none;opacity:.7;filter:alpha(opacity=70)}.entry-header-menu{position:absolute;top:0;right:0}.entry-header-menu a{display:inline-block;*display: inline;*zoom: 1;padding:4px 10px;margin-bottom:0;line-height:18px;color:#90bac8;background-color:#edf5f8;text-align:center;vertical-align:middle;border-radius:2px;background-clip:padding-box;cursor:pointer;font-size:12px;text-decoration:none;border:1px solid #90bac8;text-decoration:none!important}.entry-header-menu a:hover{opacity:.7;filter:alpha(opacity=70);text-decoration:none!important}.entry-content{font-size:95%;line-height:1.7;padding-bottom:10px}.entry-content a:hover{text-decoration:underline}.entry-content p{margin:0 0 1em}.entry-content img{max-width:100%}.entry-content h1,.entry-content h2,.entry-content h3,.entry-content h4,.entry-content h5,.entry-content h6{margin:1.3em 0 .8em;line-height:1.5;font-weight:400}.entry-content h1{font-size:160%;padding-left:40px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.entry-content h2{font-size:150%;padding-left:40px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.entry-content h3{font-size:140%;padding-left:40px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.entry-content h4{font-size:130%;padding-left:40px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.entry-content h5{font-size:110%}.entry-content h6{font-size:100%}.entry-content table{border-collapse:collapse;border-spacing:0;margin-bottom:1em}.entry-content table img{max-width:none}.entry-content table th,.entry-content table td{border:1px solid #c7dce3;padding:5px 10px}.entry-content table th{font-weight:400;background:#edf5f8}.entry-content blockquote{border-left:4px solid #ffb2a4;margin:0 0 10px;padding:20px}.entry-content blockquote p{margin-top:0;margin-bottom:0}.entry-content pre{border:1px solid #c7dce3;margin:0 0 10px;padding:20px;white-space:pre}.entry-content pre>code{margin:0;padding:0;white-space:pre;border:0;background:transparent;font-family:Monaco,Consolas,Courier New,Courier,monospace,sans-serif}.entry-content code{font-size:90%;margin:0 2px;padding:0 5px;border:1px solid #eaeaea;background-color:#f8f8f8;border-radius:3px;font-family:Monaco,Consolas,Courier New,Courier,monospace,sans-serif}.entry-content .hatena-asin-detail{border-left:4px solid #ffb2a4}.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-footer{margin-top:10px}.entry-footer-section{font-size:80%;color:#999}.entry-footer-section a{color:#999}.social-buttons,.entry-footer-html{margin:30px 0}#bottom-editarea{padding-bottom:50px}.comment-box ul{list-style:none;margin:0 0 15px;padding:0;font-size:95%}.comment-box li{padding:0 0 10px 60px;position:relative;margin-bottom:20px}.comment-box .read-more-comments{padding-left:0}.comment-box .hatena-id-icon{width:50px!important;height:50px!important;border-radius:3px;background-clip:padding-box;position:absolute;left:0;top:5px}.comment-nickname{display:inline-block;font-size:80%}.comment-user-name{display:inline-block;vertical-align:top;margin:0 0 5px;padding-left:6px}.comment-user-name a:hover{text-decoration:underline}.comment-content{font-size:90%;word-wrap:break-word;width:515px;min-height:30px;display:inline-block;vertical-align:top;line-height:1.7;margin-left:7px;padding:10px 15px;background:#edf5f8;border-radius:5px;background-clip:padding-box;position:relative}.comment-content:after{right:100%;top:20px;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none;border-right-color:#edf5f8;border-width:10px;margin-top:-10px}.comment-content p{margin:0 0 1em}.comment-metadata{font-size:80%;color:#999;margin:10px 0 0;padding-left:6px;display:inline-block}.comment-metadata a{color:#999}.leave-comment-title{color:#90bac8;font-family:HuiFontP109,sans-serif;padding:15px 45px 13px 18px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/comment.png?version=d422509bd0b39c8cdd48718768287a) no-repeat right bottom}.leave-comment-title:hover{text-decoration:none;color:#ffb2a4}#box2{font-size:85%;line-height:1.5}.hatena-module{margin-bottom:60px}.hatena-module-title{font-family:HuiFontP109,sans-serif;margin-bottom:15px;font-size:18px;padding:5px 0 5px 35px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-html.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-module-title a{color:#524336;text-decoration:none}.hatena-module-title a:hover{text-decoration:underline}.urllist-image{margin-bottom:0!important}.hatena-module-profile .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-profile.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-module-profile .profile-icon{float:left;margin:0 10px 10px 0;border-radius:5px;background-clip:padding-box}.hatena-module-profile .id{display:block;font-size:95%;margin-bottom:5px}.hatena-module-profile .id a:hover{text-decoration:underline}.hatena-module-profile .profile-description{font-size:90%}.hatena-module-profile .profile-description p{margin-top:0}.hatena-module-authors-list .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-profile.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-urllist{list-style:none;margin:0;padding:0}.hatena-urllist li{padding:8px 0;border-bottom:1px dashed #c7dce3;line-height:1.5}.hatena-urllist li a:hover{text-decoration:underline}.hatena-module-search-box .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-search.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-module-search-box .search-form{background:#edf5f8;width:100%;box-sizing:border-box;position:relative}.hatena-module-search-box .search-module-input{padding:5px;color:#524336;background:none;border:none;outline:none;height:20px;width:225px}.hatena-module-search-box .search-module-button{width:auto;height:30px;content:"検索";vertical-align:middle;font-family:HuiFontP109,sans-serif;color:#fff;border:none;outline:none;background:#90bac8;padding:0 .8em;position:absolute;right:0;top:0}.hatena-module-search-box .search-module-button:hover{opacity:.7;filter:alpha(opacity=70)}.hatena-module-links .hatena-module-title,.hatena-module-circles .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-link.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-module-recent-entries .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-recent.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-module-recent-entries .recent-entries li{font-size:100%}.hatena-module-recent-entries .recent-entries li .urllist-date-link{margin-bottom:5px}.hatena-module-recent-entries .recent-entries li .recent-entries-entry-body{margin-top:5px}.hatena-module-recent-entries .recent-entries li a{font-size:100%}.hatena-module-recent-entries .recent-entries li .recent-entries-category-link{font-size:90%}.hatena-module-archive .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-archive.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-module-recent-comments .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-comment.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-module-entries-access-ranking .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-crown.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-module-category .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-category.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.hatena-module-html .hatena-module-title{background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-html.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.pager{margin:1em 0 30px;display:block;*zoom: 1;font-size:85%}.pager:after{display:block;visibility:hidden;font-size:0;height:0;clear:both;content:"."}.pager a{padding:10px 15px;background:#fff2f0;display:inline-block;width:250px;border-radius:5px;background-clip:padding-box}.pager a:hover{text-decoration:underline}.pager .pager-prev{float:left;text-align:left;width:45%}.pager .pager-next{float:right;text-align:right;width:45%}#footer{padding:30px 0;text-align:center;color:#999;line-height:1.5;font-size:80%}#footer p{margin:0}#footer a{color:#999}.page-about dt{font-size:16px;border-bottom:1px dashed #c7dce3;margin-bottom:15px;padding:7px 0 5px 40px;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.page-about dd{margin-left:0;margin-bottom:30px}.page-archive .archive-entries{margin-top:50px}.page-archive .archive-entries .archive-entry{margin-bottom:3em}.page-archive .archive-entries .archive-entry .categories{padding-top:15px;margin-bottom:20px}.page-archive .archive-entries .archive-entry .categories a:hover{text-decoration:none}.page-archive .archive-entries .archive-entry .date{vertical-align:middle;background:none;width:100%;height:22px;margin-bottom:15px;padding-bottom:15px;border-bottom:1px dashed #c7dce3}.page-archive .archive-entries .archive-entry .date a{font-size:18px}.page-archive .archive-entries .entry-title{line-height:1.2;width:560px;margin-bottom:0;padding-left:40px;padding-bottom:4px;display:inline-block;vertical-align:middle;background:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon.png?version=d422509bd0b39c8cdd48718768287a) no-repeat left center}.page-archive .archive-entries .entry-title a{color:#90bac8;font-weight:400}.page-archive .archive-entries .categories{background:none;margin:0 0 .9em}.page-archive .archive-entries .categories.no-categories{margin:0}.page-archive .archive-entries .categories a{color:#90bac8;padding:3px 12px;background:#edf5f8;display:inline;border-radius:5px;background-clip:padding-box}.page-archive .archive-entries .entry-description{margin:0 0 1em;line-height:1.7em;font-size:95%}@media(-webkit-min-device-pixel-ratio:2){body:not(.header-image-enable) #blog-title-inner{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/header-bg@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:686px 163px}.date{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/date-bg@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:82px 81px}.categories{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/entry-title-border@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:639px 6px}.entry-content h1,.entry-content h2,.entry-content h3{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:25px 12px}.leave-comment-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/comment@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:175px 29px}.hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-html@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.hatena-module-profile .hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-profile@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.hatena-module-search-box .hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-search@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.hatena-module-links .hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-link@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.hatena-module-recent-entries .hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-recent@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.hatena-module-archive .hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-archive@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.hatena-module-recent-comments .hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-comment@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.hatena-module-entries-access-ranking .hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-crown@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.hatena-module-category .hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-category@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.hatena-module-html .hatena-module-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/side-html@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:30px 30px}.page-about dt{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:25px 12px}.page-archive .archive-entries .entry-title{background-image:url(https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon@2x.png?version=d422509bd0b39c8cdd48718768287a);background-size:25px 12px}}


/* 背景 */
body{
    background:#FFEFD3;
}


/* =========================================================
   02. カテゴリメニュー
   やさしいアトリエ風
   ========================================================= */

#menubar{
    position:relative;
    top:-25px;
    width:100%;
    margin:0;
    padding:0;
    background:transparent;
}

#menubar ul{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    width:100%;
    margin:0 0 14px;
    padding:0;
    background:transparent;
    list-style:none;
}

#menubar li{
    display:block;
    width:auto;
    padding:0;
    background:transparent;
}

#menubar li a{
    display:block;
    margin:0;
    padding:4px 13px;
    border:none;
    background:transparent;
    text-decoration:none;
    color:#6b5a49;
    text-align:center;
    font-size:15px;
    line-height:1.6;
    transition:color .25s ease;
}

/* カテゴリの間の「・」 */
#menubar li:not(:last-child) a::after{
    content:"・";
    color:#b9a48e;
    margin-left:26px;
}

/* カテゴリ ホバー */
#menubar li a:hover{
    background:transparent;
    color:#a47b55;
}


/* =========================================================
   03. カテゴリーメニューの飾り写真
   ========================================================= */

.atelier-menu-photo{
    position:absolute;
    transform:translateY(-40px);
}

.atelier-menu-photo img{
    width:70px;
    height:auto;
}

.atelier-menu-photo-left{
    left:150px;
}

.atelier-menu-photo-right{
    right:150px;
}

@media screen and (max-width:1000px){

    .atelier-menu-photo-left{
        transform:translate(-120px,-40px);
    }

    .atelier-menu-photo-right{
        transform:translate(220px,-40px);
    }

}


/* =========================================================
   04. カエレバ・ヨメレバ・トマレバ
   ========================================================= */

.cstmreba{
    width:98%;
    height:auto;
    margin:36px auto;
    font-family:'Lucida Grande','Hiragino Kaku Gothic ProN',Helvetica,Meiryo,sans-serif;
    line-height:1.5;
    word-wrap:break-word;
    box-sizing:border-box;
    display:block;
}

.cstmreba a{
    transition:.8s;
    color:#285EFF;
}

.cstmreba a:hover{
    color:#FFCA28;
}

/* 商品ボックス */
.cstmreba .booklink-box,
.cstmreba .kaerebalink-box,
.cstmreba .tomarebalink-box{
    width:100%;
    background-color:#fafafa;
    overflow:hidden;
    border-radius:0;
    box-sizing:border-box;
    padding:12px 8px;
    box-shadow:0 2px 5px 0 rgba(0,0,0,.26);
}

/* サムネイル */
.cstmreba .booklink-image,
.cstmreba .kaerebalink-image,
.cstmreba .tomarebalink-image{
    width:150px;
    float:left;
    margin:0 14px 0 0;
    text-align:center;
    background:#fff;
}

.cstmreba .booklink-image a,
.cstmreba .kaerebalink-image a,
.cstmreba .tomarebalink-image a{
    width:100%;
    display:block;
}

.cstmreba .booklink-image a img,
.cstmreba .kaerebalink-image a img,
.cstmreba .tomarebalink-image a img{
    margin:0;
    padding:0;
    text-align:center;
    background:#fff;
}

/* 商品情報 */
.cstmreba .booklink-info,
.cstmreba .kaerebalink-info,
.cstmreba .tomarebalink-info{
    overflow:hidden;
    line-height:170%;
    color:#333;
}

/* 商品情報内リンク */
.cstmreba .booklink-info a,
.cstmreba .kaerebalink-info a,
.cstmreba .tomarebalink-info a{
    text-decoration:none;
}

/* 商品名 */
.cstmreba .booklink-name>a,
.cstmreba .kaerebalink-name>a,
.cstmreba .tomarebalink-name>a{
    border-bottom:1px solid;
    font-size:16px;
}

.cstmreba .kaerebalink-name p,
.cstmreba .booklink-name p,
.cstmreba .tomarebalink-name p{
    margin:0;
}

/* powered by */
.cstmreba .booklink-powered-date,
.cstmreba .kaerebalink-powered-date,
.cstmreba .tomarebalink-powered-date{
    font-size:10px;
    line-height:150%;
}

.cstmreba .booklink-powered-date a,
.cstmreba .kaerebalink-powered-date a,
.cstmreba .tomarebalink-powered-date a{
    color:#333;
    border-bottom:none;
}

.cstmreba .booklink-powered-date a:hover,
.cstmreba .kaerebalink-powered-date a:hover,
.cstmreba .tomarebalink-powered-date a:hover{
    color:#333;
    border-bottom:1px solid #333;
}

/* 著者・住所 */
.cstmreba .booklink-detail,
.cstmreba .kaerebalink-detail,
.cstmreba .tomarebalink-address{
    font-size:12px;
}

/* ボタン内の画像を非表示 */
.cstmreba .kaerebalink-link1 div img,
.cstmreba .booklink-link2 div img,
.cstmreba .tomarebalink-link1 div img{
    display:none !important;
}

/* ボタンエリア */
.cstmreba .kaerebalink-link1,
.cstmreba .booklink-link2,
.cstmreba .tomarebalink-link1{
    display:inline-block;
    width:100%;
    margin-top:5px;
}

.cstmreba .booklink-link2>div,
.cstmreba .kaerebalink-link1>div,
.cstmreba .tomarebalink-link1>div{
    float:left;
    width:24%;
    min-width:128px;
    margin:.5%;
}

/* ボタン共通 */
.cstmreba .booklink-link2 a,
.cstmreba .kaerebalink-link1 a,
.cstmreba .tomarebalink-link1 a{
    width:100%;
    display:inline-block;
    text-align:center;
    box-sizing:border-box;
    margin:1px 0;
    padding:3% .5%;
    border-radius:8px;
    font-size:13px;
    font-weight:bold;
    line-height:180%;
    color:#fff;
    box-shadow:0 2px 4px 0 rgba(0,0,0,.26);
}

/* ---------------------------------------------------------
   トマレバ
   --------------------------------------------------------- */

.cstmreba .tomarebalink-link1 .shoplinkrakuten a{
    background:#76ae25;
    border:2px solid #76ae25;
}

.cstmreba .tomarebalink-link1 .shoplinkjalan a{
    background:#ff7a15;
    border:2px solid #ff7a15;
}

.cstmreba .tomarebalink-link1 .shoplinkjtb a{
    background:#c81528;
    border:2px solid #c81528;
}

.cstmreba .tomarebalink-link1 .shoplinkknt a{
    background:#0b499d;
    border:2px solid #0b499d;
}

.cstmreba .tomarebalink-link1 .shoplinkikyu a{
    background:#bf9500;
    border:2px solid #bf9500;
}

.cstmreba .tomarebalink-link1 .shoplinkrurubu a{
    background:#000066;
    border:2px solid #000066;
}

.cstmreba .tomarebalink-link1 .shoplinkyahoo a{
    background:#ff0033;
    border:2px solid #ff0033;
}

.cstmreba .tomarebalink-link1 .shoplinkhis a{
    background:#004bb0;
    border:2px solid #004bb0;
}

/* ---------------------------------------------------------
   カエレバ
   --------------------------------------------------------- */

.cstmreba .kaerebalink-link1 .shoplinkyahoo a{
    background:#ff0033;
    border:2px solid #ff0033;
    letter-spacing:normal;
}

.cstmreba .kaerebalink-link1 .shoplinkbellemaison a{
    background:#84be24;
    border:2px solid #84be24;
}

.cstmreba .kaerebalink-link1 .shoplinkcecile a{
    background:#8d124b;
    border:2px solid #8d124b;
}

.cstmreba .kaerebalink-link1 .shoplinkkakakucom a{
    background:#314995;
    border:2px solid #314995;
}

.cstmreba .kaerebalink-link1 .shoplinkwowma a{
    background:#319532;
    border:2px solid #319532;
}

/* ---------------------------------------------------------
   ヨメレバ
   --------------------------------------------------------- */

.cstmreba .booklink-link2 .shoplinkkindle a{
    background:#007dcd;
    border:2px solid #007dcd;
}

.cstmreba .booklink-link2 .shoplinkrakukobo a{
    background:#bf0000;
    border:2px solid #bf0000;
}

.cstmreba .booklink-link2 .shoplinkbk1 a{
    background:#0085cd;
    border:2px solid #0085cd;
}

.cstmreba .booklink-link2 .shoplinkehon a{
    background:#2a2c6d;
    border:2px solid #2a2c6d;
}

.cstmreba .booklink-link2 .shoplinkkino a{
    background:#003e92;
    border:2px solid #003e92;
}

.cstmreba .booklink-link2 .shoplinktoshokan a{
    background:#333;
    border:2px solid #333;
}

/* ---------------------------------------------------------
   Amazon・楽天・7net
   --------------------------------------------------------- */

.cstmreba .kaerebalink-link1 .shoplinkamazon a,
.cstmreba .booklink-link2 .shoplinkamazon a{
    background:#FF9901;
    border:2px solid #FF9901;
}

.cstmreba .kaerebalink-link1 .shoplinkrakuten a,
.cstmreba .booklink-link2 .shoplinkrakuten a{
    background:#bf0000;
    border:2px solid #bf0000;
}

.cstmreba .kaerebalink-link1 .shoplinkseven a,
.cstmreba .booklink-link2 .shoplinkseven a{
    background:#225496;
    border:2px solid #225496;
}

/* ---------------------------------------------------------
   ボタン ホバー
   --------------------------------------------------------- */

.cstmreba .booklink-link2 a:hover,
.cstmreba .kaerebalink-link1 a:hover,
.cstmreba .tomarebalink-link1 a:hover{
    background:#fff;
}

/* トマレバ */
.cstmreba .tomarebalink-link1 .shoplinkrakuten a:hover{color:#76ae25;}
.cstmreba .tomarebalink-link1 .shoplinkjalan a:hover{color:#ff7a15;}
.cstmreba .tomarebalink-link1 .shoplinkjtb a:hover{color:#c81528;}
.cstmreba .tomarebalink-link1 .shoplinkknt a:hover{color:#0b499d;}
.cstmreba .tomarebalink-link1 .shoplinkikyu a:hover{color:#bf9500;}
.cstmreba .tomarebalink-link1 .shoplinkrurubu a:hover{color:#000066;}
.cstmreba .tomarebalink-link1 .shoplinkyahoo a:hover{color:#ff0033;}
.cstmreba .tomarebalink-link1 .shoplinkhis a:hover{color:#004bb0;}

/* カエレバ */
.cstmreba .kaerebalink-link1 .shoplinkyahoo a:hover{color:#ff0033;}
.cstmreba .kaerebalink-link1 .shoplinkbellemaison a:hover{color:#84be24;}
.cstmreba .kaerebalink-link1 .shoplinkcecile a:hover{color:#8d124b;}
.cstmreba .kaerebalink-link1 .shoplinkkakakucom a:hover{color:#314995;}
.cstmreba .kaerebalink-link1 .shoplinkwowma a:hover{color:#319532;}

/* ヨメレバ */
.cstmreba .booklink-link2 .shoplinkkindle a:hover{color:#007dcd;}
.cstmreba .booklink-link2 .shoplinkrakukobo a:hover{color:#bf0000;}
.cstmreba .booklink-link2 .shoplinkbk1 a:hover{color:#0085cd;}
.cstmreba .booklink-link2 .shoplinkehon a:hover{color:#2a2c6d;}
.cstmreba .booklink-link2 .shoplinkkino a:hover{color:#003e92;}
.cstmreba .booklink-link2 .shoplinktoshokan a:hover{color:#333;}

/* Amazon・楽天・7net */
.cstmreba .kaerebalink-link1 .shoplinkamazon a:hover,
.cstmreba .booklink-link2 .shoplinkamazon a:hover{
    color:#FF9901;
}

.cstmreba .kaerebalink-link1 .shoplinkrakuten a:hover,
.cstmreba .booklink-link2 .shoplinkrakuten a:hover{
    color:#bf0000;
}

.cstmreba .kaerebalink-link1 .shoplinkseven a:hover,
.cstmreba .booklink-link2 .shoplinkseven a:hover{
    color:#225496;
}

.cstmreba .booklink-footer{
    clear:both;
}


/* =========================================================
   05. その他の基本デザイン
   ========================================================= */

.example table,
.example table th,
.example table td{
    border-style:none;
}

.atelier-message,
.atelier-message p{
    text-align:center !important;
}

.atelier-message{
    max-width:600px;
    margin:40px auto;
    padding:10px 20px;
    color:#6b5a49;
    line-height:2;
}

.atelier-thanks{
    font-size:18px;
    font-weight:600;
}

.atelier-welcome{
    font-size:16px;
}


/* =========================================================
   06. 記事下 Atelier Sylvanian アイコン
   ========================================================= */

.atelier-icons{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin:25px 0;
    flex-wrap:nowrap;
}

.atelier-icons a{
    display:flex;
    justify-content:center;
    align-items:center;
    flex:0 0 auto;
}

.atelier-icons img{
    width:100px;
    height:100px;
    object-fit:contain;
    display:block;
    transition:transform .25s ease;
}

.atelier-icons a:hover img{
    transform:scale(1.08);
}


/* =========================================================
   07. サイドバー応援ランキング
   ========================================================= */

.sidebar-ranking-title{
    text-align:center;
    font-weight:bold;
    margin:6px 0 0;
    color:#6b5a49;
}

.sidebar-ranking-icons{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin:0;
}

.sidebar-ranking-icons a{
    display:flex;
    justify-content:center;
    align-items:center;
}

.sidebar-ranking-icons img{
    width:110px;
    height:110px;
    object-fit:contain;
    display:block;
    transition:transform .25s ease;
}

.sidebar-ranking-icons a:hover img{
    transform:scale(1.08);
}


/* =========================================================
   08. サイドバー見出し
   ========================================================= */

.hatena-module-profile .hatena-module-title{
    background-image:url("https://cdn-ak.f.st-hatena.com/images/fotolife/s/sylvaniantedukuri/20260920/20260920115311.png");
    background-size:50px 50px;
    background-position:-10px center;
    background-repeat:no-repeat;
    filter:sepia(.7) saturate(.45) brightness(1.15);
}

.hatena-module-title{
    filter:sepia(1) saturate(.5) hue-rotate(330deg);
}


/* =========================================================
   09. 検索ボックス
   ========================================================= */

.hatena-module-search-box .search-form{
    background:#eee5d8;
}

.hatena-module-search-box .search-form input[type="submit"]{
    background:#8b9a7a;
    border-color:#8b9a7a;
    color:#fffaf2;
}


/* =========================================================
   10. リンク文字
   ========================================================= */

/* 通常リンク */
a{
    color:#7f8f70;
}

/* 記事タイトル */
.entry-title a{
    color:#A47B55;
}

/* コメントタイトル */
.leave-comment-title{
    color:#7f8f70;
}


/* =========================================================
   11. ページャー・コメント
   ========================================================= */

.pager a{
    background:#ddd4df;
}

.comment-content{
    background:#fff8ed;
}


/* =========================================================
   12. 検索結果・記事一覧・カテゴリー
   ========================================================= */

/* 検索結果・記事一覧のタイトル */
.page-archive .archive-entries .entry-title a{
    color:#A47B55 !important;
}

/* ---------------------------------------------------------
   リボンをくすみグリーンに
   --------------------------------------------------------- */

.page-archive .archive-entries .entry-title{
    background-image:none !important;
    position:relative;
}

.page-archive .archive-entries .entry-title::before{
    content:"";
    position:absolute;
    left:0;
    top:50%;
    width:25px;
    height:12px;
    transform:translateY(-50%);
    background:#7f8f70;

    -webkit-mask-image:url("https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon.png?version=d422509");
    mask-image:url("https://cdn.blog.st-hatena.com/css/theme/handwriting/img/ribbon.png?version=d422509");

    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;

    -webkit-mask-size:25px 12px;
    mask-size:25px 12px;
}

/* ---------------------------------------------------------
   記事下のカテゴリー
   --------------------------------------------------------- */

body .categories a{
    color:#7f8f70 !important;
    background:#f3eadc !important;
}


/* =========================================================
   13. フッター プライバシーポリシー
   ========================================================= */

.footer-policy{
    text-align:center;
    margin-top:15px;
    font-size:12px;
}

.footer-policy a{
    color:#8b6f5a !important;
    text-decoration:none;
}

.footer-policy a:hover{
    text-decoration:underline;
}


/* =========================================================
   14. ヘッダー SNS
   ※位置は現在の完成状態を維持
   ========================================================= */

#top-editarea .header-social-links{
    position:absolute;
    top:16px;
    left:50%;
    width:1000px;
    height:200px;
    transform:translateX(-50%);
    z-index:9999;
    pointer-events:none;
}

#top-editarea .header-social-link{
    position:absolute;
    display:block;
    width:45px;
    height:45px;
    pointer-events:auto;
}

/* X */
#top-editarea .header-social-x{
    left:454px;
    top:240px;
}

/* Instagram */
#top-editarea .header-social-instagram{
    left:504px;
    top:240px;
}


/* =========================================================
   15. SNS ホバー時のキラキラ
   ========================================================= */

#top-editarea .header-social-link::before,
#top-editarea .header-social-link::after{
    content:"✦";
    position:absolute;
    color:#d8b56a;
    font-size:14px;
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease,transform .25s ease;
}

#top-editarea .header-social-link::before{
    left:-10px;
    top:0;
}

#top-editarea .header-social-link::after{
    right:-10px;
    bottom:0;
}

#top-editarea .header-social-link:hover::before,
#top-editarea .header-social-link:hover::after{
    opacity:1;
    transform:scale(1.2);
}

/* SNSアイコン周辺の粒 */
#top-editarea .social-particles{
    position:absolute;
    left:50%;
    top:50%;
    width:1px;
    height:1px;
    pointer-events:none;
}

#top-editarea .social-particles i{
    position:absolute;
    left:0;
    top:0;
    width:4px;
    height:4px;
    border-radius:50%;
    background:#fff9e8;
    box-shadow:0 0 7px 3px rgba(255,225,170,.9);
    opacity:0;
    transform:translate(-50%,-50%) scale(.3);
}

/* 粒の位置 */
#top-editarea .social-particles i:nth-child(1){
    --x:-34px;
    --y:-9px;
    --d:.1s;
}

#top-editarea .social-particles i:nth-child(2){
    --x:-25px;
    --y:18px;
    --d:.35s;
}

#top-editarea .social-particles i:nth-child(3){
    --x:-10px;
    --y:32px;
    --d:.7s;
}

#top-editarea .social-particles i:nth-child(4){
    --x:14px;
    --y:29px;
    --d:.2s;
}

#top-editarea .social-particles i:nth-child(5){
    --x:31px;
    --y:14px;
    --d:.55s;
}

#top-editarea .social-particles i:nth-child(6){
    --x:34px;
    --y:-11px;
    --d:.9s;
}

#top-editarea .social-particles i:nth-child(7){
    --x:20px;
    --y:-29px;
    --d:.4s;
}

#top-editarea .social-particles i:nth-child(8){
    --x:-5px;
    --y:-35px;
    --d:.8s;
}

#top-editarea .social-particles i:nth-child(9){
    --x:-27px;
    --y:-25px;
    --d:.25s;
}

#top-editarea .social-particles i:nth-child(10){
    --x:-39px;
    --y:8px;
    --d:.65s;
}

#top-editarea .social-particles i:nth-child(11){
    --x:5px;
    --y:38px;
    --d:.45s;
}

#top-editarea .social-particles i:nth-child(12){
    --x:39px;
    --y:-2px;
    --d:.75s;
}

/* SNS ホバーアニメーション */
#top-editarea .header-social-link:hover .social-particles i{
    animation:socialParticle 1.4s ease-in-out var(--d) infinite;
}

@keyframes socialParticle{

    0%,100%{
        opacity:.15;
        transform:
            translate(-50%,-50%)
            translate(var(--x),var(--y))
            scale(.35);
    }

    35%{
        opacity:1;
        transform:
            translate(-50%,-50%)
            translate(var(--x),var(--y))
            scale(1.25);
    }

    60%{
        opacity:.55;
        transform:
            translate(-50%,-50%)
            translate(var(--x),var(--y))
            scale(.75);
    }

}


/* =========================================================
   16. スマートフォン用
   ========================================================= */

@media screen and (max-width:768px){

    /* 記事下アイコン */
    .atelier-icons{
        gap:2px;
    }

    .atelier-icons img{
        width:110px;
        height:110px;
    }

    /* 本文 */
    .entry-content{
        font-size:17px;
    }

    .entry-content p{
        font-size:17px !important;
        line-height:1.9;
    }

    body{
        font-size:17px;
    }

    /* カエレバ等 */
    .cstmreba .booklink-image,
    .cstmreba .kaerebalink-image,
    .cstmreba .tomarebalink-image{
        width:100%;
        float:none;
    }

    .cstmreba .booklink-link2>div,
    .cstmreba .kaerebalink-link1>div,
    .cstmreba .tomarebalink-link1>div{
        width:32.33%;
        margin:.5%;
    }

    .cstmreba .booklink-info,
    .cstmreba .kaerebalink-info,
    .cstmreba .tomarebalink-info{
        text-align:center;
        padding-bottom:1px;
    }

}


/* =========================================================
   17. スマートフォン小画面用
   ========================================================= */

@media screen and (max-width:480px){

    .cstmreba .booklink-link2>div,
    .cstmreba .kaerebalink-link1>div,
    .cstmreba .tomarebalink-link1>div{
        width:49%;
        margin:.5%;
    }

}
```