.album-list,.blog-list,.blog-list--grid,.grid,.header__heading {
    zoom:1}

.album-list:after,.album-list:before,.blog-list--grid:after,.blog-list--grid:before,.blog-list:after,.blog-list:before,.grid:after,.grid:before,.header__heading:after,.header__heading:before {
    content: "";
    display: table
}

.album-list:after,.blog-list--grid:after,.blog-list:after,.grid:after,.header__heading:after {
    clear: both
}

body {
    font-family: "Helvetica neue",Arial,Roboto,"Droid Sans","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif
}

a {
    text-decoration: none
}

a,button {
    outline: 0
}

.pc a:hover,.pc button:hover {
    opacity: .7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70)
}

@media only screen and (min-width: 801px) {
    .grid {
        padding:20px 0
    }

    .grid>[class*=col]>* {
        margin-top: 40px
    }
}

@media only screen and (max-width: 800px) {
    .grid {
        padding:15px 0
    }

    .grid>[class*=col]>* {
        margin-top: 30px
    }
}

.grid>[class*=col]>:first-child {
    margin-top: 0
}

@media only screen and (max-width: 800px) {
    .grid>[class*=col]+[class*=col] {
        margin-top:30px
    }
}

.grid.grid--title+.grid .block__outer .heading-lv2,.grid:first-child>[class*=col]>.block__outer:first-child>:first-child .heading-lv1 {
    margin-top: 0
}

.grid--l {
    margin-right: -20px;
    margin-left: -20px
}

@media only screen and (max-width: 800px) {
    .grid--l {
        margin-right:0;
        margin-left: 0
    }
}

.page__main,.site-info,.site-info__icon {
    margin-left: auto;
    margin-right: auto
}

.grid .col1-1--gtr-l,.grid .col1-2--gtr-l,.grid .col1-3--gtr-l,.grid .col1-4--gtr-l {
    padding-right: 20px;
    padding-left: 20px
}

.grid .col1-1,.grid .col1-2,.grid .col1-3,.grid .col1-4 {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: left
}

.btn__item,.header__inner {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box
}

.grid .col1-1 {
    width: 100%
}

.grid .col1-2 {
    width: 50%
}

@media only screen and (max-width: 800px) {
    .grid .col1-1--gtr-l,.grid .col1-2--gtr-l,.grid .col1-3--gtr-l,.grid .col1-4--gtr-l {
        padding-right:0;
        padding-left: 0
    }

    .grid .col1-1,.grid .col1-2,.grid .col1-3,.grid .col1-4 {
        float: none
    }

    .grid .col1-2 {
        width: 100%
    }
}

.grid .col1-3 {
    width: 33.333%
}

@media only screen and (max-width: 800px) {
    .grid .col1-3 {
        width:100%
    }
}

.grid .col1-4 {
    width: 25%
}

@media only screen and (max-width: 800px) {
    .grid .col1-4 {
        width:100%
    }
}

.page__main>.grid:first-child {
    padding-top: 0
}

.page__main>.grid:last-child {
    padding-bottom: 0
}

.heading-lv1__text {
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 1.6
}

.heading-lv2__text {
    font-weight: 700;
    font-size: 3.5rem;
    line-height: 1.4
}

.btn__item {
    box-sizing: border-box;
    display: inline-block;
    border: 1px solid;
    font-size: 1.6rem;
    font-weight: 700;
    padding: 10px 15px;
    text-align: center
}

@media only screen and (min-width: 801px) {
    .btn__item {
        max-width:240px
    }

    .btn__item--s {
        max-width: 170px;
        padding: 5px 10px
    }

    .btn__item--l {
        max-width: 380px;
        padding: 20px
    }
}

.blog-body__text h1,.txt h1 {
    font-size: 3.5rem;
    line-height: 1.4
}

.blog-body__text h2,.txt h2 {
    font-size: 2.5rem;
    line-height: 1.6
}

.blog-body__text h3,.txt h3 {
    font-size: 2.2rem;
    line-height: 1.6
}

.blog-body__text h4,.txt h4 {
    font-size: 2rem;
    line-height: 1.6
}

.blog-body__text blockquote,.blog-body__text div,.blog-body__text ol,.blog-body__text p,.blog-body__text ul,.txt blockquote,.txt div,.txt ol,.txt p,.txt ul {
    font-size: 1.6rem
}

.blog-body__text .fs-xxl {
    font-size: 3.5rem;
    line-height: 1.4
}

.blog-body__text .fs-xl {
    font-size: 2.5rem;
    line-height: 1.6
}

.blog-body__text .fs-l {
    font-size: 2.2rem;
    line-height: 1.6
}

.blog-body__text .fs-m {
    font-size: 2rem;
    line-height: 1.6
}

.blog-body__text .fs-s {
    font-size: 1.6rem
}

.page__inner {
    display: table!important;
    min-height: 100%!important;
    table-layout: fixed!important;
    width: 100%!important
}

.page__footer {
    display: table-row!important;
    height: 1px!important
}

.page__main-outer {
    position: relative;
    width: 100%
}

.page__main {
    max-width: 800px;
    padding: 140px 5% 60px
}

@media only screen and (max-width: 800px) {
    .page__main {
        padding:76px 20px 60px
    }
}

.home .page__main {
    padding-top: 40px
}

@media only screen and (max-width: 800px) {
    .home .page__main {
        padding-top:10px
    }
}

.page__main--blog-detail {
    max-width: none;
    padding: 0
}

.page__main--shop-item-detail {
    padding-top: 140px
}

.header {
    position: fixed;
    top: 72px;
    left: 0;
    right: 0;
    -webkit-transition: top .2s;
    transition: top .2s;
    width: 100%;
    z-index: 10
}

.hide-owndbar .header,.plan-premium .header {
    top: 0
}

@media only screen and (max-width: 800px) {
    .page__main--shop-item-detail {
        padding-top:76px
    }

    .header {
        position: absolute;
        top: 110px
    }
}

.header--fixed {
    position: fixed;
    top: 0;
    right: 0;
    left: 0
}

.header:not(.header--fixed).header--home {
    display: block;
    position: fixed;
    top: -80px
}

.header:not(.header--fixed).header--home .header__overlay-icon {
    display: block
}

@media only screen and (max-width: 800px) {
    .header:not(.header--fixed).header--home {
        top:-46px
    }
}

@media only screen and (max-width: 800px) and (orientation:portrait) {
    .header:not(.header--fixed).header--inner-hidden-on-postcover {
        position:fixed;
        top: -46px
    }

    .header:not(.header--fixed).header--inner-hidden-on-postcover .header__overlay-icon {
        display: block
    }
}

.header__overlay-icon {
    position: fixed;
    right: 20px;
    top: 92px;
    display: none
}

.hide-owndbar .header__overlay-icon,.plan-premium .header__overlay-icon {
    top: 20px
}

.header__overlay-icon.header-icon {
    color: #fff
}

@media only screen and (max-width: 800px) {
    .header__overlay-icon {
        top:110px
    }

    .hide-owndbar .header__overlay-icon,.plan-premium .header__overlay-icon {
        top: 0
    }
}

.header__static-icon {
    position: absolute;
    right: 20px;
    top: 20px
}

.body--nav .header .header-icon {
    color: #fff;
    right: 300px
}

@media only screen and (max-width: 800px) {
    .header__static-icon {
        top:0
    }

    .header .header-icon {
        right: 8px
    }

    .body--nav .header .header-icon {
        right: 75%
    }
}

.header__inner {
    width: 100%;
    box-sizing: border-box;
    border-bottom-style: solid;
    border-bottom-color: inherit;
    border-bottom-width: 1px;
    height: 80px;
    padding: 20px 92px 20px 20px
}

.global-nav__list,.site-icon__item {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box
}

.header__inner:before {
    position: absolute;
    top: -72px;
    left: 0;
    right: 0;
    background-color: inherit;
    width: 100%;
    height: 72px
}

.header--fixed .header__inner:before {
    content: "";
    display: block
}

@media only screen and (max-width: 800px) {
    .header__inner:before {
        top:-110px;
        height: 110px
    }

    .header__inner {
        height: 46px;
        padding-top: 8px;
        padding-bottom: 8px;
        padding-right: 83px
    }
}

.header__heading {
    display: inline-block;
    width: 100%;
    height: 100%
}

.header__site-icon {
    float: left;
    padding-right: 20px
}

.header__txt {
    font-size: 1.2rem;
    line-height: 40px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle
}

.header-icon {
    width: 40px;
    height: 40px
}

@media only screen and (max-width: 800px) {
    .header__site-icon {
        padding-right:6px
    }

    .header__txt {
        line-height: 30px
    }

    .header-icon {
        width: 46px;
        height: 46px
    }
}

.header-icon__item {
    font-size: 2rem;
    vertical-align: 0
}

.site-icon {
    color: #fff;
    width: 40px
}

@media only screen and (max-width: 800px) {
    .site-icon {
        width:30px
    }
}

.site-icon__item {
    background-color: #fff;
    border: 2px solid #fff;
    border-radius: 4px;
    box-sizing: border-box;
    display: block;
    overflow: hidden;
    position: relative;
    width: 40px;
    height: 40px
}

@media only screen and (max-width: 800px) {
    .site-icon__item {
        width:30px;
        height: 30px
    }
}

.global-nav {
    position: absolute;
    top: 0;
    right: -280px;
    overflow-y: auto;
    width: 280px;
    height: 100%
}

@media only screen and (max-width: 800px) {
    .global-nav {
        width:75%;
        right: -75%
    }
}

.body--nav .global-nav {
    right: 0
}

.global-nav-outer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none
}

.body--nav .global-nav-outer {
    background-color: rgba(17,17,17,.4);
    display: block
}

.global-nav__list {
    border-left: solid 1px;
    box-sizing: border-box;
    padding-top: 72px
}

.global-nav__item,.global-nav__item-inner {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box
}

@media only screen and (max-width: 800px) {
    .global-nav__list {
        padding-top:110px
    }
}

.header--fixed .global-nav__list,.hide-owndbar .global-nav__list {
    padding-top: 0
}

.global-nav__item {
    font-size: 2rem;
    line-height: 1.6;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: inherit;
    box-sizing: border-box;
    width: 100%
}

.global-nav__item--active .global-nav__item-inner {
    opacity: 1;
    -ms-filter: none;
    -webkit-filter: none;
    filter: none
}

.global-nav__item-inner {
    box-sizing: border-box;
    display: block;
    padding: 24px 40px 23px;
    opacity: .4;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40)
}

.pc .global-nav__item-inner:hover {
    opacity: .7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70)
}

@media only screen and (max-width: 800px) {
    .global-nav__item {
        font-size:1.6rem
    }

    .global-nav__item-inner {
        padding: 15px 30px
    }
}

.keyvisual {
    width: 100%
}

.keyvisual__item {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%
}

.keyvisual__item:after {
    content: '';
    display: block;
    padding-top: 33.3%
}

.keyvisual__item:before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    content: "";
    display: block;
    background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(17,17,17,.3)),to(rgba(17,17,17,0)));
    background-image: linear-gradient(to bottom,rgba(17,17,17,.3) 0,rgba(17,17,17,0) 100%);
    width: 100%;
    height: 80px
}

.site-info {
    margin-top: -55px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: center
}

@media only screen and (min-width: 801px) and (max-width:1200px) {
    .site-info {
        margin-top:-45px
    }
}

@media only screen and (max-width: 800px) {
    .keyvisual__item:after {
        padding-top:50%
    }

    .keyvisual__item:before {
        height: 60px
    }

    .site-info {
        margin-top: -32px
    }
}

.site-info__icon {
    background-color: #fff;
    border-radius: 6px;
    display: block;
    width: 110px;
    height: 110px;
    border: 3px solid #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    overflow: hidden
}

.pc .site-info__icon:hover {
    opacity: 1;
    -ms-filter: none;
    -webkit-filter: none;
    filter: none
}

@media only screen and (min-width: 801px) and (max-width:1200px) {
    .site-info__icon {
        width:90px;
        height: 90px
    }
}

.site-info__description,.site-info__name {
    margin-left: auto;
    margin-right: auto;
    max-width: 600px
}

.site-info__name {
    font-size: 2.5rem;
    line-height: 1.6;
    margin-top: 20px
}

@media only screen and (max-width: 800px) {
    .site-info__icon {
        border-radius:4px;
        border-width: 2px;
        width: 64px;
        height: 64px
    }

    .site-info__description,.site-info__name {
        max-width: 320px
    }

    .site-info__name {
        font-size: 2rem;
        line-height: 1.6;
        margin-top: 12px;
        margin-bottom: 10px
    }
}

.site-info__description {
    font-size: 1.6rem;
    margin-top: 23px
}

@media only screen and (max-width: 800px) {
    .site-info__description {
        font-size:1.2rem;
        margin-top: 10px
    }

    .site-info__description--open .site-info__description-txt {
        display: block
    }

    .site-info__description--open .site-info__description-btn {
        -webkit-transform: rotate(-180deg);
        -ms-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    .site-info__description-txt {
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        white-space: normal;
        display: -webkit-box;
        overflow: hidden;
        text-overflow: ellipsis
    }

    .site-info__description-txt:only-child {
        margin-bottom: 14px
    }

    .site-info__description-btn {
        -webkit-transition: -webkit-transform .2s ease-in 0s;
        transition: -webkit-transform .2s ease-in 0s;
        transition: transform .2s ease-in 0s;
        transition: transform .2s ease-in 0s,-webkit-transform .2s ease-in 0s;
        padding: 10px;
        margin-top: 5px
    }
}

@media only screen and (min-width: 801px) {
    .site-info__description-btn {
        display:none
    }
}

#mdrd-a66be375c .footer {
    margin: 0!important;
    width: 100%!important;
    -webkit-transform: none!important;
    -ms-transform: none!important;
    transform: none!important
}

#mdrd-a66be375c .footer__inner {
    text-align: center!important;
    width: 100%!important;
    font-size: 1.2rem!important;
    border-top-style: solid!important;
    border-top-width: 1px!important;
    -webkit-box-sizing: border-box!important;
    -moz-box-sizing: border-box!important;
    box-sizing: border-box!important;
    letter-spacing: 0!important;
    margin: 0!important;
    position: static!important
}

.album-list__item,.footer__inner {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box
}

#mdrd-a66be375c .footer__item {
    margin-bottom: 0!important;
    padding: 0 10px!important
}

#mdrd-a66be375c .footer__copyright {
    margin-top: 20px!important;
    padding-left: 20px!important;
    padding-right: 20px!important
}

#mdrd-a66be375c .footer__copyright>small {
    opacity: 1!important;
    -ms-filter: none!important;
    -webkit-filter: none!important;
    filter: none!important;
    visibility: visible!important;
    text-indent: 0!important;
    -webkit-transform: none!important;
    -ms-transform: none!important;
    transform: none!important;
    display: block!important;
    pointer-events: none!important
}

#mdrd-a66be375c .footer--pagetop {
    border-top: none!important
}

#mdrd-a66be375c .footer--pagetop .footer__item {
    border-top-style: solid!important;
    border-top-width: 1px!important
}

#mdrd-a66be375c.plan-premium .footer__item {
    padding-bottom: 20px!important
}

.footer__inner {
    text-align: center;
    width: 100%;
    font-size: 1.2rem;
    border-top-style: solid;
    border-top-width: 1px;
    box-sizing: border-box;
    letter-spacing: 0
}

.footer__item {
    padding: 0 10px
}

.footer__copyright {
    margin-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 1rem
}

.footer__copyright>small {
    pointer-events: none
}

.footer--pagetop {
    border-top: none
}

.blog-list--magazine .blog-item,.footer .pagetop__link:before,.footer--pagetop .footer__item {
    border-top-style: solid;
    border-top-width: 1px
}

.footer .pagetop {
    height: 35px;
    margin-top: 60px
}

.footer .pagetop__link {
    cursor: pointer;
    display: block;
    text-indent: 101%;
    white-space: nowrap;
    overflow: hidden;
    position: relative;
    word-wrap: normal
}

.footer .pagetop__link:before {
    content: "";
    display: block;
    position: absolute;
    top: 4px;
    left: 50%;
    border-right-style: solid;
    border-right-width: 1px;
    border-color: inherit;
    width: 20px;
    height: 20px;
    margin-left: -10px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.album-list {
    margin-left: -20px;
    margin-right: -20px
}

.album-list .feed-header {
    margin-left: 20px;
    margin-right: 20px
}

@media only screen and (max-width: 800px) {
    #mdrd-a66be375c .page__inner--post-cover .footer {
        background-color:inherit;
        -ms-transform: translate3d(0,0,0)!important;
        transform: translate3d(0,0,0)!important;
        -webkit-transform: translate3d(0,0,0)!important
    }

    .album-list {
        padding-left: 1px
    }
}

.album-list__item {
    box-sizing: border-box;
    float: left;
    margin-top: 40px;
    padding-left: 20px;
    padding-right: 20px;
    width: 33.3333%
}

@media only screen and (max-width: 800px) {
    .album-list__item {
        padding-left:0;
        padding-right: 1px;
        padding-top: 1px;
        margin-top: 0
    }
}

.album-list__item:nth-child(1),.album-list__item:nth-child(2),.album-list__item:nth-child(3) {
    margin-top: 0
}

.album-item__img {
    display: block;
    width: 100%;
    position: absolute;
    top: 0;
    right: -100%;
    bottom: -100%;
    left: -100%;
    margin: 0 auto auto
}

.blog-list--magazine .blog-item:first-child {
    border-top: none
}

.blog-list--magazine .blog-item:first-child .blog-item__inner {
    padding-top: 0
}

.blog-list--magazine .blog-item:first-child .blog-item__img {
    margin-top: 0
}

.blog-list--magazine .blog-item__inner {
    display: block;
    padding-top: 24px;
    padding-bottom: 24px
}

.blog-list--magazine .blog-item__img {
    margin-top: 6px;
    margin-bottom: 25px
}

@media only screen and (max-width: 800px) {
    .blog-list--magazine {
        margin-left:-20px;
        margin-right: -20px
    }

    .blog-list--show-title.blog-list--magazine .blog-item:first-child {
        border-top-style: solid;
        border-top-width: 1px;
        border-top-color: inherit
    }

    .blog-list--show-title.blog-list--magazine .blog-item:first-child .blog-item__inner {
        padding-top: 24px
    }

    .blog-list--show-title.blog-list--magazine .blog-item:first-child .blog-item__img {
        margin-top: 6px
    }

    .blog-list--magazine .blog-item__inner {
        padding-left: 20px;
        padding-right: 20px
    }

    .blog-list--magazine .blog-item__img {
        margin-bottom: 18px
    }
}

.blog-list--magazine .blog-item__img-inner {
    display: block;
    position: relative;
    overflow: hidden;
    width: 100%
}

.blog-list--magazine .blog-item__img-inner:after {
    content: '';
    display: block;
    padding-top: 66.7%
}

.blog-list--magazine .blog-item__img-inner>img {
    display: block;
    width: 100%;
    position: absolute;
    top: 0;
    right: -100%;
    bottom: -100%;
    left: -100%;
    margin: 0 auto auto
}

.blog-list--magazine .blog-item__date {
    font-size: 1rem;
    display: block
}

.blog-list--magazine .blog-item__date .reblog-icon {
    font-size: inherit;
    margin-right: 6px;
    vertical-align: -.1em;
    width: 1em;
    height: 1em
}

.blog-list--magazine .blog-item__text {
    font-size: 1.6rem;
    margin-top: 18px
}

@media only screen and (max-width: 800px) {
    .blog-list--magazine .blog-item__text {
        font-size:1.2rem;
        margin-top: 12px
    }
}

@media only screen and (min-width: 801px) {
    .blog-list--magazine .blog-title+.blog-item__text {
        margin-top:14px
    }
}

.blog-list--magazine .blog-title__text {
    font-weight: 700;
    margin-top: 18px;
    font-size: 2.2rem;
    line-height: 1.6
}

.blog-list--list .blog-item+.blog-item {
    border-top-style: solid;
    border-top-width: 1px
}

.blog-list--list .blog-item__inner {
    display: block;
    padding-top: 25px;
    padding-bottom: 24px
}

@media only screen and (max-width: 800px) {
    .blog-list--magazine .blog-title__text {
        margin-top:10px;
        font-size: 2rem;
        line-height: 1.6
    }

    .blog-list--list {
        margin-left: -20px;
        margin-right: -20px
    }

    .blog-list--list .blog-item__inner {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 25px
    }
}

.blog-list--list .blog-item:first-child .blog-item__inner {
    padding-top: 0
}

.blog-list--list .blog-item__date {
    font-size: 1rem;
    display: block
}

.blog-list--list .blog-item__date .reblog-icon {
    font-size: inherit;
    margin-right: 6px;
    vertical-align: -.1em;
    width: 1em;
    height: 1em
}

.blog-list--list .blog-item__text {
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.6;
    margin-top: 10px
}

@media only screen and (max-width: 800px) {
    .blog-list--list .blog-item__text {
        font-size:1.6rem
    }
}

.page__main--blog-detail .blog-title__text {
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 1.6
}

@media only screen and (max-width: 800px) {
    .page__main--blog-detail .blog-title__text {
        font-size:2.2rem;
        line-height: 1.6
    }
}

.page__main--blog-detail .reblog-article .blog-title__text {
    font-size: 2rem;
    line-height: 1.6;
    font-weight: 400;
    margin-top: 15px
}

.page__main--blog-detail .blog-body .reblog-article__body .blog-title__text {
    margin-bottom: 20px
}

.page__main--blog-detail .blog-meta {
    display: table
}

.page__main--blog-detail .blog-meta__tmb {
    display: table-cell;
    padding-right: 20px;
    vertical-align: top
}

.page__main--blog-detail .blog-meta__tmb>img {
    width: 38px;
    height: 38px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,.4)
}

@media only screen and (max-width: 800px) {
    .page__main--blog-detail .blog-body .reblog-article__body .blog-title__text {
        margin-bottom:15px
    }

    .page__main--blog-detail .blog-meta__tmb {
        padding-right: 10px
    }

    .page__main--blog-detail .blog-meta__tmb>img {
        width: 32px;
        height: 32px;
        border-radius: 17px
    }
}

.page__main--blog-detail .blog-meta__body {
    line-height: 1.4
}

#mdrd-a66be375c .page__main--blog-detail .blog-article {
    position: static!important
}

.page__main--blog-detail .blog-meta__name {
    font-size: 1rem;
    display: block
}

.page__main--blog-detail .blog-meta__name+.blog-article__date {
    margin-top: 4px
}

.page__main--blog-detail .blog-body {
    margin-top: 16px
}

.page__main--blog-detail .blog-body .reblog-article__item+.reblog-article__item,.page__main--blog-detail .blog-body__item+.blog-body__item {
    margin-top: 24px
}

.page__main--blog-detail .blog-article .blog-body,.page__main--blog-detail .blog-article__header--cover-blank {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    max-width: 840px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px
}

@media only screen and (min-width: 801px) {
    .page__main--blog-detail .blog-article .blog-cover {
        -webkit-box-sizing:border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        max-width: 840px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 20px;
        padding-right: 20px
    }

    .page__main--blog-detail .blog-cover .blog-title {
        margin-bottom: 46px
    }
}

.page__main--blog-detail .blog-article .blog-cover--hide {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0)
}

.page__main--blog-detail .blog-article__content {
    padding-bottom: 60px
}

.page__main--blog-detail .blog-article--title-blank .blog-body {
    margin-top: 25px
}

@media only screen and (max-width: 800px) {
    .page__main--blog-detail .blog-article .blog-cover .blog-title {
        margin-left:20px;
        margin-right: 20px
    }

    .page__main--blog-detail .blog-article .blog-cover .blog-meta {
        margin-left: 20px;
        margin-right: 56px
    }

    .page__main--blog-detail .blog-article--title-blank .blog-body {
        margin-top: 12px
    }
}

.page__main--blog-detail .blog-article__date {
    font-size: 1rem;
    display: block
}

.page__main--blog-detail .blog-article__date .reblog-icon {
    font-size: inherit;
    margin-right: 6px;
    vertical-align: -.1em;
    width: 1em;
    height: 1em
}

.page__main--blog-detail .blog-article__header .blog-title {
    margin-top: 20px
}

@media only screen and (max-width: 800px) {
    .page__main--blog-detail .blog-article__header .blog-title {
        margin-top:12px
    }

    .page__main--blog-detail .blog-article__header--cover-show+.blog-article__content {
        -ms-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0)
    }

    .page__main--blog-detail .blog-article__header--cover-show+.blog-article__content .blog-body {
        padding-top: 32px;
        margin-top: 0
    }
}

.page__main--blog-detail .blog-article__header--cover-blank {
    padding-top: 160px
}

.page__main--blog-detail .blog-article .blog-cover.blog-cover--overlay .blog-title,.page__main--blog-detail .blog-article--content-blank .blog-cover .blog-title {
    border-bottom: none;
    padding-bottom: 0
}

.page__main--blog-detail .blog-cover {
    width: 100%
}

.page__main--blog-detail .blog-cover .blog-title {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    padding-bottom: 30px
}

@media only screen and (min-width: 801px) {
    .page__main--blog-detail .blog-cover {
        height:auto!important
    }
}

@media only screen and (orientation: landscape) {
    .page__main--blog-detail .blog-cover {
        height:auto!important
    }
}

@media only screen and (max-width: 800px) {
    .page__main--blog-detail .blog-article__header--cover-blank {
        padding-top:75px
    }

    .page__main--blog-detail .blog-cover .blog-title {
        padding-bottom: 22px
    }

    .page__main--blog-detail .blog-cover {
        height: inherit
    }

    .page__main--blog-detail .blog-cover__inner {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding-top: 30px
    }

    .page__main--blog-detail .blog-cover:not(.blog-cover--animate) {
        margin-top: 46px
    }
}

.page__main--blog-detail .blog-cover__img {
    cursor: pointer;
    cursor: -moz-zoom-in;
    cursor: zoom-in;
    display: block;
    width: 100%;
    height: inherit;
    overflow: hidden
}

.pc .page__main--blog-detail .blog-cover__img:hover {
    opacity: 1;
    -ms-filter: none;
    -webkit-filter: none;
    filter: none
}

.page__main--blog-detail .blog-cover__img>img {
    display: block;
    width: 100%
}

@media only screen and (min-width: 801px) {
    .page__main--blog-detail .blog-cover__img {
        margin-bottom:28px;
        margin-top: 140px;
        max-height: none
    }
}

@media only screen and (max-width: 800px) and (orientation:portrait) {
    .page__main--blog-detail .blog-cover--animate {
        position:relative
    }

    .page__main--blog-detail .blog-cover--animate .blog-cover__img {
        position: fixed;
        top: 110px
    }

    .hide-owndbar .page__main--blog-detail .blog-cover--animate .blog-cover__img,.plan-premium .page__main--blog-detail .blog-cover--animate .blog-cover__img {
        top: 0
    }

    .page__main--blog-detail .blog-cover--animate .blog-cover__img:before {
        position: fixed;
        top: 110px;
        right: 0;
        left: 0;
        content: "";
        display: block;
        background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(17,17,17,.3)),to(rgba(17,17,17,0)));
        background-image: linear-gradient(to bottom,rgba(17,17,17,.3) 0,rgba(17,17,17,0) 100%);
        width: 100%;
        height: 60px;
        z-index: 1;
        -webkit-transition: opacity .2s;
        transition: opacity .2s
    }

    .hide-owndbar .page__main--blog-detail .blog-cover--animate .blog-cover__img:before,.plan-premium .page__main--blog-detail .blog-cover--animate .blog-cover__img:before {
        top: 0
    }

    .page__main--blog-detail .blog-cover--animate.blog-cover--meta-hidden .blog-cover__img:before {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0)
    }

    .page__main--blog-detail .blog-cover--animate .blog-cover__inner {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0
    }

    .page__main--blog-detail .blog-cover--animate.blog-cover--overlay .blog-cover__img:after {
        content: "";
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(17,17,17,0)),to(rgba(17,17,17,.75)));
        background-image: linear-gradient(to bottom,rgba(17,17,17,0) 0,rgba(17,17,17,.75) 100%);
        height: 75%;
        opacity: 1;
        -ms-filter: none;
        -webkit-filter: none;
        filter: none;
        -webkit-transition: opacity .2s ease-in 0s;
        transition: opacity .2s ease-in 0s
    }

    .page__main--blog-detail .blog-cover--animate.blog-cover--overlay .blog-cover__img>img {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0
    }

    .page__main--blog-detail .blog-cover--overlay {
        position: relative;
        height: inherit
    }

    .page__main--blog-detail .blog-cover--overlay .blog-cover__inner {
        right: auto;
        background-color: transparent;
        padding-bottom: 25px;
        -webkit-transition: opacity .5s;
        transition: opacity .5s
    }

    .page__main--blog-detail .blog-cover--overlay.blog-cover--meta-hidden .blog-cover__img:after,.page__main--blog-detail .blog-cover--overlay.blog-cover--meta-hidden .blog-cover__inner {
        opacity: 0;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        filter: alpha(opacity=0)
    }

    .page__main--blog-detail .blog-cover--overlay.blog-cover--meta-hidden.blog-cover--scroll-bottom .blog-cover__img:after {
        opacity: 1;
        -ms-filter: none;
        -webkit-filter: none;
        filter: none;
        background-image: none;
        background-color: inherit
    }

    .page__main--blog-detail .blog-cover--overlay .blog-cover__inner .blog-article__date,.page__main--blog-detail .blog-cover--overlay .blog-cover__inner .blog-meta__name,.page__main--blog-detail .blog-cover--overlay .blog-cover__inner .blog-title__text {
        color: #fff
    }

    .page__main--blog-detail .blog-cover--overflowed-img .blog-cover__img>img {
        margin: auto
    }
}

@media only screen and (max-width: 800px) and (orientation:landscape) {
    .page__main--blog-detail .blog-cover--animate {
        margin-top:46px
    }
}

.page__main--shop-item-detail .blog-article__title {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    max-width: 840px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px
}

.blog-list--full .blog-title__text {
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 1.6
}

@media only screen and (max-width: 800px) {
    .blog-list--full .blog-title__text {
        font-size:2.2rem;
        line-height: 1.6
    }
}

.blog-list--full .reblog-article .blog-title__text {
    font-size: 2rem;
    line-height: 1.6;
    font-weight: 400;
    margin-top: 8px
}

.blog-list--full .blog-body .reblog-article__body .blog-title__text {
    margin-bottom: 20px
}

.blog-list--full .blog-meta {
    display: table
}

.blog-list--full .blog-meta__tmb {
    display: table-cell;
    padding-right: 20px;
    vertical-align: top
}

.blog-list--full .blog-meta__tmb>img {
    width: 38px;
    height: 38px;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,.4)
}

.blog-list--full .blog-meta__body {
    line-height: 1.4
}

@media only screen and (max-width: 800px) {
    .blog-list--full .blog-body .reblog-article__body .blog-title__text {
        margin-bottom:15px
    }

    .blog-list--full .blog-meta__tmb {
        padding-right: 10px
    }

    .blog-list--full .blog-meta__tmb>img {
        width: 32px;
        height: 32px;
        border-radius: 17px
    }

    .blog-list--full .reblog-article .blog-title__text {
        margin-top: 10px
    }

    .blog-list--full .blog-cover {
        margin-left: -20px;
        margin-right: -20px
    }

    .blog-list--full .blog-cover__inner {
        margin-left: 20px;
        margin-right: 20px
    }
}

.blog-list--full .blog-cover__img {
    margin-bottom: 28px;
    width: 100%
}

.blog-list--full .blog-cover__img>img {
    width: 100%
}

.blog-list--full .blog-body {
    margin-top: 14px
}

@media only screen and (max-width: 800px) {
    .blog-list--full .blog-body {
        margin-top:15px
    }
}

.blog-list--full .blog-body .reblog-article__item+.reblog-article__item,.blog-list--full .blog-body__item+.blog-body__item {
    margin-top: 24px
}

@media only screen and (max-width: 800px) {
    .blog-list--full .blog-body .reblog-article__item+.reblog-article__item,.blog-list--full .blog-body__item+.blog-body__item {
        margin-top:20px
    }
}

.blog-list--full .blog-item {
    padding-top: 80px;
    margin-top: 80px;
    position: relative
}

.blog-list--full .blog-item:before {
    position: absolute;
    top: 0;
    left: 50%;
    border-top-color: inherit;
    border-top-style: solid;
    border-top-width: 1px;
    content: "";
    display: block;
    margin-left: -25px;
    width: 50px;
    height: 1px
}

.blog-list--full .blog-item:first-child {
    padding-top: 0;
    margin-top: 0
}

.blog-list--full .blog-item:first-child:before {
    display: none
}

.blog-list--full .blog-item__header {
    display: block
}

.blog-list--full .blog-item__header .blog-title {
    margin-top: 20px
}

@media only screen and (max-width: 800px) {
    .blog-list--full .blog-item__header .blog-title {
        margin-top:12px
    }
}

.blog-list--full .blog-item__header--cover-show+.blog-item__content {
    border-top-style: solid;
    border-top-width: 1px;
    margin-top: 30px;
    padding-top: 32px
}

@media only screen and (max-width: 800px) {
    .blog-list--full .blog-item__header--cover-show+.blog-item__content {
        margin-top:22px;
        padding-top: 17px
    }
}

.blog-list--full .blog-item__date {
    font-size: 1rem;
    display: block
}

.blog-list--full .blog-item__date .reblog-icon {
    font-size: inherit;
    margin-right: 6px;
    vertical-align: -.1em;
    width: 1em;
    height: 1em
}

.blog-list--full .blog-item--content-blank .blog-item__content {
    border-top: none;
    margin-top: 0;
    padding-top: 0
}

.blog-list--full .blog-item--title-blank .blog-item__header--cover-show+.blog-item__content {
    margin-top: 38px
}

.blog-list--full .blog-item--title-blank .blog-item__header--cover-show+.blog-item__content .blog-body {
    margin-top: 14px
}

.blog-list--full .blog-item--title-blank .blog-body {
    margin-top: 22px
}

@media only screen and (max-width: 800px) {
    .blog-list--full .blog-item--title-blank .blog-body {
        margin-top:12px
    }
}

.blog-list--grid {
    margin-left: -20px;
    margin-right: -20px
}

@media only screen and (min-width: 801px) {
    .blog-list--grid .blog-item {
        margin-top:40px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: left;
        padding-left: 20px;
        padding-right: 20px;
        width: 33.3333%;
        height: 400px
    }

    .blog-list--grid .blog-item:nth-child(-n+3) {
        margin-top: 0
    }
}

@media only screen and (min-width: 801px) and (max-width:1200px) {
    .blog-list--grid .blog-item {
        padding-left:1%;
        padding-right: 1%;
        margin-top: 2%
    }
}

@media only screen and (max-width: 800px) {
    .blog-list--grid .blog-item {
        width:100%
    }

    .blog-list--grid .blog-item+.blog-item {
        border-top-style: solid;
        border-top-width: 1px;
        border-top-color: inherit
    }

    .blog-list--grid .blog-item--img-show .blog-item__content {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0
    }
}

.blog-list--grid .blog-item--img-show,.blog-list--grid .blog-item--img-show+.blog-item {
    border-top: none
}

.blog-list--grid .blog-item--img-show .blog-item__inner:after {
    background-color: transparent;
    background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(17,17,17,0)),to(rgba(17,17,17,.75)));
    background-image: linear-gradient(to bottom,rgba(17,17,17,0) 0,rgba(17,17,17,.75) 100%)
}

.blog-list--grid .blog-item--img-show .blog-item__date,.blog-list--grid .blog-item--img-show .blog-title__text,.blog-list--grid .blog-item--img-show .reblog-icon {
    color: #fff
}

.blog-list--grid .blog-item__inner {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden
}

.blog-list--grid .blog-item__inner:after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: inherit;
    display: block;
    content: ""
}

.blog-list--grid .blog-item__img-inner {
    display: block;
    position: relative;
    overflow: hidden;
    width: 100%
}

.blog-list--grid .blog-item__img-inner:after {
    content: '';
    display: block;
    padding-top: 166.7%
}

.blog-list--grid .blog-item__img-inner>img {
    display: block;
    width: 100%;
    position: absolute;
    top: 0;
    right: -100%;
    bottom: -100%;
    left: -100%;
    margin: 0 auto auto
}

.blog-list--grid .blog-item__content {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 20px;
    z-index: 1
}

@media only screen and (min-width: 801px) {
    .blog-list--grid .blog-item__content {
        position:absolute;
        bottom: 0;
        left: 0;
        right: 0
    }
}

@media only screen and (max-width: 800px) {
    .blog-list--grid .blog-item__content {
        position:relative;
        padding: 8% 5%
    }
}

.blog-list--grid .blog-item__body {
    font-size: 2rem;
    line-height: 1.6;
    font-weight: 700;
    margin-top: 10px
}

.blog-list--grid .blog-item__date {
    font-size: 1rem;
    display: block
}

.blog-list--grid .blog-item__date .reblog-icon {
    font-size: inherit;
    margin-right: 6px;
    vertical-align: -.1em;
    width: 1em;
    height: 1em
}

.blog-list--grid .blog-item__text {
    font-size: 1rem;
    background-color: rgba(17,17,17,.75);
    color: #fff;
    display: inline-block;
    padding: 4px 10px 3px
}

.u-base-bg-clr,.u-nav-bg-clr {
    background-color: #fff
}

.u-btn-clr,.u-nav-clr,.u-site-clr {
    color: #111
}

.u-nav-bdr-clr {
    border-color: #111
}

.u-nav-bg-bdr-clr {
    border-color: #fff
}

.u-btn-clr--active,.u-btn-clr:hover {
    color: #888
}

.u-btn-clr--disabled,.u-btn-clr:disabled {
    color: #cfcfcf
}

.u-btn-bdr-clr {
    border-color: #111
}

.u-btn-bdr-clr--active,.u-btn-bdr-clr:hover {
    border-color: #888
}

.u-btn-bdr-clr--disabled,.u-btn-bdr-clr:disabled {
    border-color: #cfcfcf
}

.u-btn-bg-clr {
    background-color: #111
}

.u-btn-bg-clr--active,.u-btn-bg-clr:hover {
    background-color: #888
}

.u-btn-bg-clr--disabled,.u-btn-bg-clr:disabled {
    background-color: #cfcfcf
}

.u-txt-clr {
    color: #111
}

.u-txt-clr--lv1 {
    color: #585858
}

.u-txt-clr--lv2 {
    color: #888
}

.u-txt-clr--lv3 {
    color: #cfcfcf
}

.u-txt-bg-clr {
    background-color: #e7e7e7
}

.u-lnk-clr {
    color: #3dc49d
}

.u-lnk-clr:visited {
    color: #9ee1ce
}

.u-lnk-clr:hover {
    color: #c4ede1
}

.u-ttl-blk-clr {
    color: #111
}

.u-ttl-blk-bdr-clr {
    border-color: #111
}

.u-ttl-blk-bdr-clr--lv1 {
    border-color: #cfcfcf
}

.u-bdr-clr {
    border-color: #eee
}

.u-acnt-bdr-clr {
    border-color: #f6f6f6
}

.u-acnt-bg-clr {
    background-color: #f6f6f6
}