// 背景が白 / テキスト 黒 で固定された要素
%bgfff {
    color: #333;
    background-color: #fff;
}

// object-fit
%objFitCover {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-family: "object-fit: cover;";
}

// レイヤー要素
%absLayer {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    // display: block;
    width: 100%;
    height: 100%;
    content: "";
}

%figcaption {
    display: block !important;
    margin-top: .75em;
    margin-bottom: 0; //core上書き
    color: inherit; //core上書き
    font-size: .8em;
    text-align: center;
    opacity: .8;
}

// 画像用のシャドウ
%imageShadow {
    box-shadow:
        0 2px 4px rgba(0, 0, 0, .1),
        0 4px 8px -4px rgba(0, 0, 0, .2);
}

// 投稿リストのサムネイル画像は少しスッとさせる
%thumbShadow {
    box-shadow:
        0 2px 4px rgba(0, 0, 0, .1),
        0 4px 4px -4px rgba(0, 0, 0, .1);
}

// 記事コンテンツの浮き出し系
%boxShadow {
    box-shadow:
        0 2px 2px rgba(0, 0, 0, .05),
        0 4px 4px -4px rgba(0, 0, 0, .1);
}


// ボタン用シャドウ（SWELLボタンなどしっかりしたボタン用）
%buttonShadow {
    box-shadow:
        0 2px 2px rgba(0, 0, 0, .1),
        0 4px 8px -4px rgba(0, 0, 0, .2);
}

%postParts_margin {
    margin: 2em 0;
}

// before要素でアイコンを使う時用
%arkheIcon {
    font-weight: 400;
    font-family: arkhe-icon !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    vertical-align: bottom;
}