/*
************************************************************************
* アイコン
* @copyright Revolme Inc.
************************************************************************
*/

.icon
{
	padding-left:1.3em;
}
.icon::before,
.icon::after
{
    content: "";

    position:absolute;
    top:50%;
    left:0;
    transform:translateY(-50%);

    display:block;
    width:1.0em;
    height:1.0em;

    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
}

.title-lv1 .icon::before
{
    width:2.0em;
    height:2.0em;
    background-image: url(../../img/common/bg-tit-left.svg);
}
.title-lv1 .icon::after
{
    width:2.0em;
    height:2.0em;
    left: auto;
    right: 0;
    background-image: url(../../img/common/bg-tit-right.svg);
}
.icon.ic-category {
    padding-left: 2em;
}
.icon.ic-category:before {
    width: 1.5em;
    height: 1.5em;
    background-image: url(../../icon/ic-category-wh.svg);
}


.icon.ic-category.ic-category-blue:before {
    width: 1.2em;
    height: 1.2em;
    background-image: url(../../icon/ic-category-blue.svg);
}
.icon.ic-post {
    padding-left: 2em;
}
.icon.ic-post:before {
    width: 1.5em;
    height: 1.5em;
    background-image: url(../../icon/ic-post-blue.svg);
}



/* ################################################################################################ */
/* ## スマホサイト用スタイル ###################################################################### */
/* ################################################################################################ */
@media screen and (max-width:640px) {

    .title-lv1 .icon::before
    {
        width:1.0em;
        height:1.0em;
        background-image: url(../../img/common/bg-tit-left.svg);
    }
    .title-lv1 .icon::after
    {
        width:1.0em;
        height:1.0em;
        left: auto;
        right: 0;
        background-image: url(../../img/common/bg-tit-right.svg);
    }
}