html{color:#333;background:#fff;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;text-rendering:optimizelegibility}html.borderbox *,html.borderbox *:before,html.borderbox *:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}body,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,menu,nav,section{margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,menu,nav,section{display:block}audio,canvas,video{display:inline-block}body,button,input,select,textarea{font:300 1em/1.8 arno-pro-display,serif}button::-moz-focus-inner,input::-moz-focus-inner{padding:0;border:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}blockquote{position:relative;color:#999;font-weight:400;border-left:1px solid #1abc9c;padding-left:1em;margin:1em 3em 1em 2em}@media only screen and (max-width:640px ){blockquote{margin:1em 0}}acronym,abbr{border-bottom:1px dotted;font-variant:normal}abbr{cursor:help}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:400}ul,ol{list-style:none}caption,th{text-align:left}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative}:root sub,:root sup{vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a{color:#1abc9c}a:hover{text-decoration:underline}.typo a{border-bottom:1px solid #1abc9c}.typo a:hover{border-bottom-color:#555;color:#555;text-decoration:none}ins,a{text-decoration:none}u,.typo-u{text-decoration:underline}mark{background:#fffdd1;border-bottom:1px solid #ffedce;padding:2px;margin:0 5px}pre,code,pre tt{font-family:Courier,'Courier New',monospace}pre{background:#f8f8f8;border:1px solid #ddd;padding:1em 1.5em;display:block;-webkit-overflow-scrolling:touch}hr{border:none;border-bottom:1px solid #cfcfcf;margin-bottom:.8em;height:10px}small,.typo-small,figcaption{font-size:.9em;color:#888}strong,b{font-weight:bold}[draggable]{cursor:move}.clearfix:before,.clearfix:after{content:"";display:table}.clearfix:after{clear:both}.clearfix{zoom:1}.textwrap,.textwrap td,.textwrap th{word-wrap:break-word;word-break:break-all}.textwrap-table{table-layout:fixed}.serif{font-family:Palatino,Optima,Georgia,serif}.typo p,.typo pre,.typo ul,.typo ol,.typo dl,.typo form,.typo hr,.typo table,.typo-p,.typo-pre,.typo-ul,.typo-ol,.typo-dl,.typo-form,.typo-hr,.typo-table,blockquote{margin-bottom:1.2em}h1,h2,h3,h4,h5,h6{font-family:arno-pro-display,serif;font-style:normal;font-weight:300;color:#000;line-height:1.35}.typo h1,.typo h2,.typo h3,.typo h4,.typo h5,.typo h6,.typo-h1,.typo-h2,.typo-h3,.typo-h4,.typo-h5,.typo-h6{margin-top:1.2em;margin-bottom:.6em;line-height:1.35}.typo h1,.typo-h1{font-size:2em}.typo h2,.typo-h2{font-size:1.8em}.typo h3,.typo-h3{font-size:1.6em}.typo h4,.typo-h4{font-size:1.4em}.typo h5,.typo h6,.typo-h5,.typo-h6{font-size:1.2em}.typo ul,.typo-ul{margin-left:1.3em;list-style:disc}.typo ol,.typo-ol{list-style:decimal;margin-left:1.9em}.typo li ul,.typo li ol,.typo-ul ul,.typo-ul ol,.typo-ol ul,.typo-ol ol{margin-bottom:.8em;margin-left:2em}.typo li ul,.typo-ul ul,.typo-ol ul{list-style:circle}.typo table th,.typo table td,.typo-table th,.typo-table td,.typo table caption{border:1px solid #ddd;padding:.5em 1em;color:#666}.typo table th,.typo-table th{background:#fbfbfb}.typo table thead th,.typo-table thead th{background:#f1f1f1}.typo table caption{border-bottom:none}.typo-input,.typo-textarea{-webkit-appearance:none;border-radius:0}.typo-em,.typo em,legend,caption{font-weight:inherit}.typo-em{position:relative}.typo-em:after{position:absolute;top:.65em;left:0;width:100%;overflow:hidden;white-space:nowrap;content:"・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・"}.typo img{max-width:100%}body{font:300 1.1em/1.8 arno-pro-display,serif;margin:0;padding:0;--main-color:#666}h1,h2,h3,h4,h5,h6{font-weight:400}a{transition:all .3s ease;text-decoration:none;color:#4a4a4a}a:hover{color:var(--main-color);text-decoration:none}.blog-title{font-size:3.0em;margin-top:1.6em;line-height:1.5}.blog-description{color:#999}.post-nav{display:none;font-size:.84em;color:#ccc;margin-left:1em}.top-nav ul{display:inline-block;list-style:none}.top-nav li{margin:0 6px;float:left}.post-nav li{float:left}.post-nav li>a{margin:0 4px}.top-nav a{border:none}.post-nav a{color:#ccc;border:none}.post-nav ul > li:not(:last-child)::after {content:'·'}.top-nav .nav-current{border-bottom:1px solid #3a4145}.index-tag-cloud{margin-top:1.2rem;line-height:2;max-width:90%}.top-nav{display:flex;align-items:left;justify-content:left;margin:1em 0}.search-bar{display:inline-block;margin-left:4px}.search-bar .iconfont{color:#4a4a4a}.search-bar .iconfont:hover{color:var(--main-color)}#input-div{display:none;padding:.2em 1em;background:#f6f6f6;border-radius:8px}#search-input{border:none;width:10em;margin:0;background:transparent;outline:none}#search-btn{padding:.2em 0}.index-search-list{padding:1.6em 0;display:none}.single-post{margin:0}.post-blog-title{display:flex;align-items:left;font-size:1.1em;margin-top:2.4em}.post-blog-title:hover .post-nav{display:inline;animation:left-in .4s ease-out 1}.post-blog-title a{font-weight:300;color:#999}.post-blog-title a:hover{color:var(--main-color)}.post-header{margin-top:2.8em;margin-bottom:2.4em;border-bottom:1px solid #eee;padding-bottom:1em}.post-title{font-size:1.6em;color:#606266}.index-post .post-toptitle{margin-bottom:.8em}.index-post .post-excerpt{color:#999}.index-post .post-meta,.post-header .post-meta{font-size:.96em;display:block;color:#9eabb3;font-weight:300;margin-top:.6em}.post-meta a{transition:all .3s ease;text-decoration:none;color:#9eabb3;font-weight:300}.post-meta a:hover{color:var(--main-color)}.post-meta .tags{margin-left:.6em;display:block;overflow:auto}.index-post{padding:1.6em 0;border-bottom:#ebf2f6 1px solid;word-wrap:break-word}.tags a{position:relative;padding:.1em .6em;margin-right:.4em;background:#f6f6f6;color:#9eabb3;white-space:nowrap}.tags a:hover{opacity:.7;background:var(--main-color);color:#fff}.tags a::before{content:"#"}.tag-cloud{line-height:2.2}.post-readmore{display:-webkit-box;display:-moz-box;display:flex;padding-top:1em;border-top:#ebf2f6 1px solid}.post-readmore div{width:50%;position:relative}.post-readmore .prev{text-align:left;margin-right:.3em}.post-readmore .next{text-align:right;margin-left:.3em}.iconfont{color:var(--main-color)}.single-post a,.typo a{opacity:.8;position:relative;color:var(--main-color);padding-bottom:3px}.single-post a:hover,.typo a:hover{opacity:1;color:var(--main-color)}.single-post a::before{content:"";position:absolute;width:0;right:0;bottom:0;height:1px;background:var(--main-color);-webkit-transition:width .3s ease;transition:width .3s ease}.single-post a:hover::before{width:100%;left:0;right:auto}.single-post table{width:100%}.single-post img{display:block;margin:auto;max-width:100%;min-width:50%;height:auto;box-shadow:0 0 10px #ddd}.single-post .kg-width-wide{width:106%;max-width:none;margin-left:-3%}.single-post .kg-width-full{width:100%}.single-post em{font-style:italic}.single-post .hljs{padding:1.2em;border:1px solid #eee;border-radius:5px}.single-post p code{color:#a96360;padding:.1rem .5rem;background:rgba(169,99,96,.05);border-radius:3px;word-spacing:normal;word-break:normal;word-wrap:break-word;font-size:.9em}.single-post blockquote{border-left:4px solid rgba(158,171,179,.5);margin:0}.typo a{border-bottom:none}.typo h2{position:relative;font-size:1.4em;margin-top:1.8em;padding-top:.8em}.typo h2::before{color:var(--main-color);content:"# ";position:absolute;left:-1em}.typo h3{font-size:1.25em}.typo h4{font-size:1.1em}.typo h5,h6{font-size:1em}.single-post ul li,.typo ul li{list-style:circle}pre{background:none;border:none;padding:0;font-size:.85em;line-height:1.3}.kg-gallery-container{display:flex;flex-direction:column;margin:1.5em auto;max-width:1040px;width:100vw}.kg-gallery-row{display:flex;flex-direction:row;justify-content:center}.kg-gallery-image img{display:block;margin:0;width:100%;height:100%}.kg-gallery-row:not(:first-of-type) {margin:.75em 0 0 0}.kg-gallery-image:not(:first-of-type) {margin:0 0 0 .75em}.kg-image-card,.kg-gallery-card{margin:0 0 1.5em}.kg-image-card figcaption,.kg-gallery-card figcaption{margin:.8em 0 1.4em;text-align:center;font-size:.85em;color:#bbb}.post-footer{margin-top:4.8em}.author-card{background:#f6f6f6;padding:.8em 1.2em;border-radius:8px;display:flex;margin-bottom:2em}.author-card .author-profile-image{width:60px;height:60px;border-radius:100%}.author-card .author-profile-image-a{margin:0;padding:0;margin-right:.8em;line-height:0}.author-card .author-card-name{font-size:1.2em;margin:0;line-height:1.65;font-weight:bold}.author-card .author-card-bio{color:#999}.author-card .author-card-bio a{color:var(--main-color)}.author-card .author-card-bio a:hover{color:var(--main-color)}.post-footer .tags{display:block;overflow:auto;margin:.6em 0}.pagination{display:-webkit-box;display:-moz-box;display:flex;margin-top:1em}.pagination div{position:relative}.pagination .prev{width:30%;text-align:left}.pagination .page-number{width:40%;text-align:center;color:#9eabb3}.pagination .next{width:30%;text-align:right}.iconfont{color:var(--main-color)}.blog-footer{margin:2em auto 1em;text-align:center}.blog-footer p{display:block;font-size:.9em;color:rgba(158,171,179,.6);line-height:1}.blog-footer .line-2{display:inline}.blog-footer a{color:rgba(158,171,179,.7)}.blog-footer a:hover{color:var(--main-color)}#toc{position:fixed;left:50%;top:20%;margin-left:400px;border-left:1px solid #ddd}#toc a{display:block;color:#ccc}#toc a:hover{padding:0;color:var(--main-color)}#toc .active a{color:var(--main-color)}#toc ul{margin-left:1em}#toc li{display:block}#comment{margin-top:3.2em;position:relative}#comment .vnick{color:#666}#comment .comment-header{margin:.6em 0;font-size:1.6em}#comment .comment-header::before{color:var(--main-color);content:"@ ";position:absolute;left:-1em}#comment-box .vwrap{border:none;border-radius:0;padding:0}#comment-box .vlist .vcard .vhead .vname:hover{color:var(--main-color)}#comment-box .veditor{font-size:1em;padding:.6em .8em;border-radius:5px;border:1px solid #f0f0f0;background:#fcfcfc;min-height:4em;height:4em}#comment-box .veditor:focus{border:1px solid var(--main-color);height:7em;background:#fff}#comment-box ::-webkit-input-placeholder{color:#ccc}#comment-box ::-moz-placeholder{color:#ccc}#comment-box :-ms-input-placeholder{color:#ccc}#comment-box .vwrap .vheader .vinput{width:25%;border:1px solid #f0f0f0;margin-right:1em;margin-bottom:8px;padding:.4em 1em;display:none;border-radius:8px;background:#fcfcfc;font-size:.8em}#comment-box .vwrap .vheader .vinput:focus{border:1px solid var(--main-color)}#comment-box .vwrap .vheader .vinput:focus{background:#fff}#comment-box .display{display:inline!important}#comment-box .vwrap .vcontrol{padding-top:8px;display:none}#comment-box .vwrap .vedit .vctrl{display:none}#comment-box .vwrap .vcontrol .col.col-60{display:none}#comment-box .vwrap .vcontrol .col.col-40{width:100%}#comment-box .vbtn:active,#comment-box .vbtn:hover{color:#fff;opacity:.7;border-color:var(--main-color);background-color:var(--main-color)}#comment-box .vlist .vcard section .vfooter .vat{color:#b3b3b3}#comment-box .vlist .vcard section .vfooter .vat:hover{color:var(--main-color)}#comment-box .vlist .vcard .vcontent{font-size:1em}#comment-box .vlist .vcard .vcontent a{opacity:.7;color:var(--main-color)}#comment-box .vlist .vcard .vcontent a:hover{opacity:1;color:var(--main-color)}#comment-box .vlist .vcard .vhead .vsys{background: #00000005;padding:.2em .5em}#comment-box .vlist .vcard .vh .vmeta .vat{color:#999}#comment-box .power{color:#ccc}#comment-box a{color:#bbb}#comment-box a:hover{color:var(--main-color)}#comment-box a::before{background:var(--main-color)}#comment-box .vlist .vcard .vhead .vnick::before{background:var(--main-color)}#comment-box .gt-container .gt-svg svg{fill:#666}#nprogress{pointer-events:none}#nprogress .bar{background:var(--main-color);position:fixed;z-index:1031;top:0;left:0;width:100%;height:2px}#nprogress .peg{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:0 0 10px var(--main-color) , 0 0 5px var(--main-color);opacity:1.0;-webkit-transform:rotate(3deg) translate(0,-4px);-ms-transform:rotate(3deg) translate(0,-4px);transform:rotate(3deg) translate(0,-4px)}#nprogress .spinner{display:block;position:fixed;z-index:1031;top:15px;right:15px}#nprogress .spinner-icon{width:18px;height:18px;box-sizing:border-box;border:solid 2px transparent;border-top-color:var(--main-color);border-left-color:var(--main-color);border-radius:50%;-webkit-animation:nprogress-spinner 400ms linear infinite;animation:nprogress-spinner 400ms linear infinite}.nprogress-custom-parent{overflow:hidden;position:relative}.nprogress-custom-parent #nprogress .spinner,.nprogress-custom-parent #nprogress .bar{position:absolute}@-webkit-keyframes nprogress-spinner {
    0%   { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}@keyframes nprogress-spinner {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}.go-to-top{background-image:url(https://www.hapq.me/assets/images/go-to-top.png);width:30px;height:30px;position:fixed;bottom:30px;left:50%;-webkit-transform:translateX(400px);-moz-transform:translateX(400px);transform:translateX(400px);border:none;display:none;opacity:.3;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s}.go-to-top:hover{opacity:1}#archives-list time{color:#666}#archives-list a{margin-left:1em}#archives-list a:hover{color:var(--main-color)}#archives-list .search-item{font-size:1.2em}#archives-list .no-result{color:#999}.error-message{text-align:center;margin-left:auto;margin-right:auto;margin-top:1.8em}.error-code{margin:0;font-size:4em;opacity:.3}.error-description{margin:0;color:#999}.left{text-align:left}.right{text-align:right}.center{margin-right:auto;margin-left:auto;text-align:center}.justify{text-align:justify}.container{width:80%;margin-right:auto;margin-left:auto}@media only screen and (max-width:540px){.container{width:90%}.typo h2::before{position:relative;left:0}#comment .comment-header::before{position:relative;left:0}#comment .vwrap .vheader.item2 .vinput,#comment .vwrap .vheader .vinput{width:100%}#toc{display:none}}@media only screen and (min-width:960px){.container{width:75%;max-width:700px}}@keyframes left-in{
    0% {
        opacity: 0;
        transform: translateX(-10px);
    }
    40% {
        opacity: 1;
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}