@charset "utf-8";
/* ---------- 버튼 스타일 ---------- */


/* 버튼 정렬 */
.btnarea{position:relative; overflow:hidden}
.btnarea_right{position:relative; text-align:right}
.btnarea_center{position:relative; text-align:center}
.btnarea_left{position:relative; text-align:left}

.list_btn{position:relative; margin-top:15px; overflow:hidden}
.list_btn.center{text-align:center}
.list_btn.right{text-align:right}
.list_btn.left{text-align:left}

/* 버튼 노멀 */
.btn_normal
{
    display:inline-block; line-height:150%; margin:0; padding:0;
    color:#606060; text-align:center; vertical-align:middle; background:#fff; border:1px solid #d6d6d6;
    letter-spacing:-0.5px; border-radius:2px; cursor:pointer; font-weight:normal; letter-spacing:-0.8px; transition:all .25s ease
}
.btn_normal span{display:block; padding:9px 15px 8px; font-size:13px}
.btn_normal.small span{padding:5px 12px 6px}
.btn_normal.xsmall span{padding:2px 10px 2px; font-size:13px}
.btn_normal.large span{padding:14px 18px; font-size:15px}
.btn_normal i{font-size:14px; vertical-align:middle; margin-top:-2px}
.btn_normal.large i{font-size:16px}
.btn_normal.ico_l i{margin-right:2px}
.btn_normal.ico_r i{margin-left:2px}
.btn_normal.ico_l span{padding-left:12px}
.btn_normal.ico_r span{padding-right:12px}
.btn_normal.large.ico_l span{padding-left:18px}
.btn_normal.disabled{opacity:0.4}

.btn_normal:hover, .btn_normal.active{border:1px solid #193975}

.btn_normal.info{background:#30a5d7; border:1px solid #30a5d7; color:#fff !important}
.btn_normal.info.active{background:#30a5d7}

.btn_normal.primary{background:#193975; border:1px solid #193975; color:#fff !important}
.btn_normal.primary.active{background:#193975}

.btn_normal.success{background:#08c564; border:1px solid #08c564; color:#fff !important}
.btn_normal.success.active{background:#11d26f}

.btn_normal.warning{background:#f47808; border:1px solid #f47808; color:#fff !important}
.btn_normal.warning.active{background:#ff871a}

.btn_normal.danger{background:#a50034; border:1px solid #a50034; color:#fff !important}
.btn_normal.danger.active{background:#b7003a}

.btn_normal.sereni{background:#4d5265; border:1px solid #4d5265; color:#fff !important}
.btn_normal.sereni.active{background:#4d5265}

.btn_normal.blank{background:#f8f8f8; border:1px solid #d6d6d6}
.btn_normal.blank.active{background:#f8f8f8}


/* 버튼 라인 */
.btn_line
{
    display:inline-block; line-height:150%; margin:0; padding:0;
    color:#606060; text-align:center; vertical-align:middle; background:#fff; border:1px solid #d6d6d6;
    letter-spacing:-0.5px; border-radius:2px; cursor:pointer; font-weight:normal; letter-spacing:-0.8px; transition:all .25s ease; box-sizing:border-box
}
.btn_line span{display:block; padding:9px 15px 8px; font-size:13px}
.btn_line.small span{padding:5px 12px 6px}
.btn_line.xsmall span{padding:2px 10px 2px; font-size:13px}
.btn_line.large span{padding:14px 18px; font-size:15px}
.btn_line i{font-size:14px; vertical-align:middle; margin-top:-2px}
.btn_line.large i{font-size:16px}
.btn_line.ico_l i{margin-right:2px}
.btn_line.ico_r i{margin-left:2px}
.btn_line.ico_l span{padding-left:12px}
.btn_line.ico_r span{padding-right:12px}
.btn_line.large.ico_l span{padding-left:18px}
.btn_line.disabled{opacity:0.4}

.btn_line:hover, .btn_line.active{border:1px solid #193975}

.btn_line.info{border:1px solid #30a5d7; color:#30a5d7 !important}
.btn_line.info.active{background:#30a5d7; color:#fff !important}

.btn_line.primary{border:1px solid #193975; color:#193975 !important}
.btn_line.primary.active{background:#193975; color:#fff !important}

.btn_line.success{border:1px solid #08c564; color:#08c564 !important}
.btn_line.success.active{background:#08c564; color:#fff !important}

.btn_line.warning{border:1px solid #f47808; color:#f47808 !important}
.btn_line.warning.active{background:#f47808; color:#fff !important}

.btn_line.danger{border:1px solid #a50034; color:#a50034 !important}
.btn_line.danger.active{background:#a50034; color:#fff !important}

.btn_line.sereni{border:1px solid #4d5265; color:#4d5265 !important}
.btn_line.sereni.active{background:#4d5265; color:#fff !important}

.btn_line.blank.active{border:1px solid #9b9b9b}


/* 버튼 아이콘 */
.btn_ico
{
    display:inline-block; margin:0; padding:0; position: relative;
    color:#606060; text-align:center; vertical-align:middle; background:#fff; border:1px solid #d6d6d6; width:34px; height:34px;
    letter-spacing:-0.5px; border-radius:2px; cursor:pointer; font-size:18px; font-weight:normal; letter-spacing:0; transition:all .25s ease; box-sizing:border-box
}
.btn_ico i{vertical-align:middle; margin-top:-2px}
.btn_ico.small{font-size:16px; width:30px; height:30px}
.btn_ico.circle{border-radius:50%}

.btn_ico.info{background:#018de7; border:1px solid #018de7; color:#fff !important}
.btn_ico.primary{background:#193975; border:1px solid #193975; color:#fff !important}
.btn_ico.sereni{background:#4d5265; border:1px solid #4d5265; color:#fff !important}
.btn_ico.blank{background:#f8f8f8; border:1px solid #f8f8f8; color:#808080 !important}


/* SNS버튼 */
.btn_sns{display:inline-block; width:38px; height:38px; border-radius:2px; vertical-align:middle; transition:all .30s ease}
.btn_sns.fb{background-color:rgba(24,119,242,1); background-image:url("../images/common/fsns_fb.png"); background-repeat:no-repeat; background-position:14px 50%; background-size:10px 17px}
.btn_sns.fb.active{background-color:rgba(24,119,242,.5)}
.btn_sns.nb{background-color:rgba(0,199,60,1); background-image:url("../images/common/fsns_nb.png"); background-repeat:no-repeat; background-position:50% 50%; background-size:13px 13px}
.btn_sns.nb.active{background-color:rgba(24,119,242,.5)}