main.namespace-blog{overflow:hidden}@media screen and (min-width: 800px){main.namespace-blog section{display:flex}main.namespace-blog section .content{flex:1}}@media screen and (min-width: 800px){main.namespace-blog section .content{margin:-24px;padding:24px}}main.namespace-blog section .content>div.article{box-shadow:0 6px 24px 0 rgba(0,0,0,.15);background-color:#fff;overflow:hidden}@media screen and (min-width: 550px){main.namespace-blog section .content>div.article{border-radius:12px}}main.namespace-blog section .content>div.article img{display:block;width:100%}@media screen and (min-width: 800px){main.namespace-blog section>header{display:none}}main.namespace-blog section aside .follow{padding:0 24px 24px}main.namespace-blog section aside .follow .signup{display:inline-block;margin-bottom:16px;padding:2px 8px;border-radius:4px;background-color:#785095;color:#fff;font-size:14px;transition:background-color .3s}html:not(.s-touchevents-yes) main.namespace-blog section aside .follow .signup:hover{background-color:#604077}html:not(.s-touchevents-yes) main.namespace-blog section aside .follow .signup:active,html.s-touchevents-yes main.namespace-blog section aside .follow .signup:active{background-color:#48305a}main.namespace-blog section aside .follow>div{display:block;margin-bottom:16px}main.namespace-blog section aside .ads{padding:0 24px 24px}main.namespace-blog section aside .ads div{margin:0 auto;text-align:center}main.page-blog-articles section{padding:24px 12px 96px}@media screen and (min-width: 550px){main.page-blog-articles section{padding:24px 24px 96px}}main.page-blog-articles section .content ul{margin-bottom:52px}@media screen and (min-width: 550px){main.page-blog-articles section .content ul{display:grid;grid-template-columns:repeat(auto-fill, minmax(245px, 1fr));grid-gap:12px}}main.page-blog-articles section .content ul li{border-radius:12px;box-shadow:0 6px 24px 0 rgba(0,0,0,.15);background-color:#fff;overflow:hidden}@media screen and (min-width: 0px)and (max-width: 549px){main.page-blog-articles section .content ul li:not(:last-child){margin-bottom:12px}}main.page-blog-articles section .content ul li img{display:block;width:100%}main.page-blog-articles section .content ul li .text{padding:24px;line-height:1.5}main.page-blog-articles section .content ul li .text a.title{display:block;padding-bottom:12px;cursor:pointer;color:#4d4d4d;font-size:20px;text-align:center;transition:color .3s}html:not(.s-touchevents-yes) main.page-blog-articles section .content ul li .text a.title:hover{color:#1a1a1a}main.page-blog-articles section .content ul li .text a.title span{display:block;overflow:hidden}@media screen and (min-width: 550px){main.page-blog-articles section .content ul li .text a.title span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-height:48px;font-size:20px;line-height:1.2;word-wrap:break-word}}main.page-blog-articles section .content ul li .text p{-webkit-hyphens:auto;hyphens:auto;text-align:justify}main.page-blog-articles section .content ul li .text p a{background:#785095 linear-gradient(to bottom right, hsl(312, 33%, 54%), hsl(242, 37%, 41%));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);color:#785095;position:relative;cursor:pointer;display:inline-block;margin:0;padding:0;font-weight:bold}html:not(.s-touchevents-yes) main.page-blog-articles section .content ul li .text p a:hover::after{width:calc(100% - 0)}main.page-blog-articles section .content ul li .text p a:after{background:#785095 linear-gradient(to bottom right, hsl(312, 33%, 54%), hsl(242, 37%, 41%));content:"";display:block;position:absolute;bottom:0;width:0;height:1px;transition:width .3s}html[dir=ltr] main.page-blog-articles section .content ul li .text p a:after{left:0}html[dir=rtl] main.page-blog-articles section .content ul li .text p a:after{right:0}main.page-blog-article section{padding:24px 0 96px}@media screen and (min-width: 550px){main.page-blog-article section{padding:24px 24px 96px}}@media screen and (min-width: 0px)and (max-width: 549px){main.page-blog-article section>header{margin:0 12px}}main.page-blog-article section .content .article img{display:block;width:100%}main.page-blog-article section .content .article .rich-text .submitter{color:#8c8c8c;font-size:14px;font-weight:bold}main.page-blog-article section .content .article .follow,main.page-blog-article section .content .article .share{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;margin-top:16px}main.page-blog-article section .content .article .follow>div,main.page-blog-article section .content .article .share>div{margin-top:8px;line-height:initial}html[dir=ltr] main.page-blog-article section .content .article .follow>div,html[dir=ltr] main.page-blog-article section .content .article .share>div{margin-right:16px}html[dir=rtl] main.page-blog-article section .content .article .follow>div,html[dir=rtl] main.page-blog-article section .content .article .share>div{margin-left:16px}main.page-blog-article section .content nav{box-shadow:0 6px 24px 0 rgba(0,0,0,.15);background-color:#fff;display:flex;justify-content:space-between;margin-top:12px;padding:16px;background-color:#fff}@media screen and (min-width: 550px){main.page-blog-article section .content nav{border-radius:12px}}main.page-blog-article section .content nav a{overflow:hidden;line-height:1.5;text-overflow:ellipsis;white-space:nowrap;position:relative;cursor:pointer;display:block;position:relative;max-width:43%}html:not(.s-touchevents-yes) main.page-blog-article section .content nav a:hover::after{width:calc(100% - 0)}main.page-blog-article section .content nav a:after{background:currentcolor;content:"";display:block;position:absolute;bottom:0;width:0;height:1px;transition:width .3s}html[dir=ltr] main.page-blog-article section .content nav a:after{left:0}html[dir=rtl] main.page-blog-article section .content nav a:after{right:0}main.page-blog-article section .content nav a .app-icon{position:absolute;top:50%;width:20px;height:20px;display:block}html[dir=ltr] main.page-blog-article section .content nav a[rel=next]{margin-left:12px;padding-right:22px}html[dir=rtl] main.page-blog-article section .content nav a[rel=next]{margin-right:12px;padding-left:22px}html[dir=ltr] main.page-blog-article section .content nav a[rel=next] .app-icon{right:0;transform:translateY(-50%)}html[dir=rtl] main.page-blog-article section .content nav a[rel=next] .app-icon{left:0;transform:translateY(-50%) scaleX(-1)}html[dir=ltr] main.page-blog-article section .content nav a[rel=previous]{margin-right:12px;padding-left:22px}html[dir=rtl] main.page-blog-article section .content nav a[rel=previous]{margin-left:12px;padding-right:22px}html[dir=ltr] main.page-blog-article section .content nav a[rel=previous] .app-icon{left:0;transform:translateY(-50%)}html[dir=rtl] main.page-blog-article section .content nav a[rel=previous] .app-icon{right:0;transform:translateY(-50%) scaleX(-1)}