.layout-content {padding:5rem 0;}

.article-menu-wrapper {display:flex;margin:2rem auto;}
.article-menu-wrapper a {
    flex:.5;display:flex;align-items:center;justify-content:center;
    border:1px solid #eeeeee;background-color:#fff;font-size:1.6rem;
    padding:1.6rem;
}
.article-menu-wrapper a:hover {border-color:#eb6ea0;}
.article-menu-wrapper a.selected {background-color:#eb6ea0;border-color:#eb6ea0;color:#fff;position:relative;}
.article-menu-wrapper a:first-child {border-right:0;}
.article-menu-wrapper a:last-child {border-left:0;}

.article-view-wrapper {margin-bottom:5rem;}
.article-top {display:flex;border-bottom:2px solid #c8c7c7;padding:1.25rem 1.5rem;align-items:flex-end;}
.article-top h2 {margin:0;padding:0;flex:auto;color:#242424;font-size:1.9rem;font-weight:normal;}
.article-top .date {flex:none;color:#949494;}
.article-content {padding:3rem 1.5rem;}
.article-content img {max-width:100%;}
.article-buttons {padding:2rem 1.5rem;border-top:1px solid #eeeeee;}
.article-buttons a {border:1px solid #e1e1e5;display:inline-block;padding:1rem 1.75rem;color:#848484;}
.article-buttons a:hover {color:#eb6ea0;border-color:#eb6ea0;}

.article-all-wrapper {margin:4rem auto 8rem;font-size:1.5rem;}
.article-list-wrapper {border-top:2px solid #c8c7c7;margin-bottom:3rem;}
.article-one {display:flex;border-bottom:1px solid #eee;padding:2rem;}
.article-one .thumb {margin-right:3.5rem;}
.article-one .thumb img {width:220px;height:165px;}
.article-one .title {flex:auto;display:flex;align-items:center;justify-content:flex-start;}
.article-one .visited {color:#848484;}
.article-one .selected {color:#242424;font-weight:bold;}
.article-one .title a:hover {color:#eb6ea0;}

.article-one .date {flex:none;display:flex;align-items:center;margin-left:3rem;color:#949494;}