@import "base/variables";

/* Tools */
@import "tools/mixin";
// @import "tools/fonts";
@import "tools/media";

/* Base */
@import "base/normalize";
@import "base/base";

/* Layout */
@import "layout/topbar";
@import "layout/header";
@import "layout/footer";

/* Modules */
// @import "modules/form";
// @import "modules/list";
// @import "modules/piclist";
// @import "modules/table";
@import "modules/button";
// @import "modules/single";
// @import "modules/toggle";

/* Components */
// @import "components/dropmenu";
// @import "components/panel";
@import "components/scrolltop";
// @import "components/slider";
// @import "components/tab";
@import "components/pop";

/* Common */

/* S iconfont */
@font-face {
    @include font-face-custom(iconfont);
}

.iconfont-custom {
    @include font-custom(iconfont);
}

/* S Main */
html, body{
    width: 100%;
    background-color: #f5f5f5;
}
.wrapper{
    padding-top: 53px;
    width: 100%;
    background-color: #f5f5f5;
}
/* E Main */

.m-postSub{
    overflow: hidden;
}

.m-postSub__title{
    input{
        -webkit-appearance: none;
        text-align: left;
        width: 100%;
        font-size: 18px;
        line-height: 24px;
        background-color: #f5f5f5;
        color: #999999;
        border: none;
        border-radius: 0;
        margin-bottom: 0;
        border-bottom: 1px solid #dfdfdf;
        &::-webkit-inner-spin-button{
            -webkit-appearance: none;
        }
        &::-webkit-outer-spin-button{
            -webkit-appearance: none;
        }
    }
}
.m-postSub__content{
    textarea{
        -webkit-appearance: none;
        text-align: left;
        width: 100%;
        height: 130px;
        font-size: 18px;
        line-height: 24px;
        background-color: #f5f5f5;
        color: #999999;
        border: none;
        border-radius: 0;
        resize: none;
        &::-webkit-inner-spin-button{
            -webkit-appearance: none;
        }
        &::-webkit-outer-spin-button{
            -webkit-appearance: none;
        }
    }
}

.m-postSub__control{
    background-color: #ececec;
    overflow: hidden;
    color: #666;
    height: 54px;
    margin-bottom: 10px;
    position: relative;
    select{
        -webkit-appearance: none;
        text-align: left;
        width: 120px;
        float: left;
        font-size: 18px;
        line-height: 24px;
        height: 24px;
        border: none;
        border-radius: 0;
        padding: 0;
        margin: 15px 0 15px 10px;
        background: none;
        &::-webkit-inner-spin-button{
            -webkit-appearance: none;
        }
        &::-webkit-outer-spin-button{
            -webkit-appearance: none;
        }
    }
    .icon-arrow{
        float: left;
        font-size: 12px;
        line-height: 54px;
    }
    .icon-pic{
        float: right;
        font-size: 28px;
        line-height: 54px;
        width: 48px;
        text-align: center;
        &:hover, &:active{
            background-color: #d8d8d8;
        }
    }
    input{
        position: absolute;
        display: block;
        width: 48px;
        height: 54px;
        right: 0;
        top: 0;
        opacity: 0;
        z-index: 101;
        -webkit-appearance: none;
        &::-webkit-inner-spin-button{
            -webkit-appearance: none;
        }
        &::-webkit-outer-spin-button{
            -webkit-appearance: none;
        }
    }
}

.m-postSub__picList{
    padding: 10px 0 10px 10px;
    height: 80px;
    overflow-y: hidden;
    overflow-x: scroll;
    background-color: #c4c4c4;
    ul{
        width: 2000px;        
    }
    li{
        width: 80px;
        height: 80px;
        float: left;
        margin-right: 10px;
        position: relative;
        background-color: #fff;
        img{
            width: 100%;
            height: 100%;
            display: block;
            overflow-x: hidden;
        }
        .icon-remove{
            position: absolute;
            display: block;
            right: -5px;
            top: -5px;
            width: 16px;
            height: 16px;
            line-height: 14px;
            font-size: 14px;
            text-align: center;
            border-radius: 8px;
            background-color: #e50050;
            color: #fff;
        }
    }
}

.pop-mod{
    background: none;
    box-shadow: none;
    .callback-text{
        text-align: center;
        span{
            display: inline-block;
            background-color: #313131;
            color: #fff;
            font-size: 16px;
            line-height: 24px;
            padding: 10px 14px;
            border-radius: 8px;
        }
    }
}

#pop-overlay{
    background: none;
}