@charset "UTF-8";

.btn_list {}
.btn_list .list_inner {text-align:center}
.btn_list .li {display:inline-block;vertical-align:top}
.btn_list {margin:20px auto 10px auto}
.btn_list.mt0 {margin-top:0}
.btn_list.mb0 {margin-bottom:0} 

/* 기본 버튼 */
.btn_default {display:inline-flex;align-items:center;justify-content:center;padding:6px 15px;text-align:center;font-weight:500;color:var(--colorWhite);border:1px solid var(--colorMain);border-radius:5px;background-color:var(--colorMain);box-sizing:border-box;transition:0.2s}
.btn_default .text {}
.btn_default:not(.disabled):hover, 
.btn_default:not(.disabled):focus, 
.btn_default.on {border-color:#DF225D;background-color:#DF225D}
.btn_default.disabled {cursor:inherit !important;color:var(--colorFontGray) !important;border-color:var(--colorLightGray) !important;background-color:var(--colorBgGray) !important}
.btn_default.small {padding:3px 10px;font-size:13px}
.btn_default.large {min-width:100px;padding-top:13px;padding-bottom:13px}
.btn_default.min_w {min-width:100px}
.btn_default .icon {margin-right:5px}
.btn_default .icon.lf {margin:0 0 0 5px}

.btn_default.dc2 {background-color:var(--colorSub);border-color:var(--colorSub)}
.btn_default.white {color:var(--colorBlack2);background-color:var(--colorWhite);border-color:var(--colorWhite)}
.btn_default.black2 {background-color:var(--colorBlack2);border-color:var(--colorBlack2)}
.btn_default.dgray {background-color:var(--colorDarkGray);border-color:var(--colorDarkGray)}
.btn_default.fgray {background-color:var(--colorFontGray);border-color:var(--colorFontGray)}
.btn_default.navy {background-color:var(--colorNavy);border-color:var(--colorNavy)}
.btn_default.blue {background-color:var(--colorBlue);border-color:var(--colorBlue)}
.btn_default.green {background-color:var(--colorGreen);border-color:var(--colorGreen)}
.btn_default.red {background-color:var(--colorRed);border-color:var(--colorRed)}

/* 기본 버튼 hover, focus */
.btn_default.dc2:hover, 
.btn_default.dc2:focus {background-color:#2141af;border-color:#2141af}
.btn_default.white:hover, 
.btn_default.white:focus {background-color:var(--colorBgGray);border-color:var(--colorBgGray)}
.btn_default.black2:hover, 
.btn_default.black2:focus {background-color:#424242;border-color:#424242}
.btn_default.dgray:hover, 
.btn_default.dgray:focus {background-color:#313336;border-color:#313336}
.btn_default.fgray:hover, 
.btn_default.fgray:focus {background-color:#525252;border-color:#525252}
.btn_default.navy:hover, 
.btn_default.navy:focus {background-color:#000b23;border-color:#000b23}
.btn_default.blue:hover, 
.btn_default.blue:focus {background-color:#0065d2;border-color:#0065d2}
.btn_default.green:hover, 
.btn_default.green:focus {background-color:#62911f;border-color:#62911f}
.btn_default.red:hover, 
.btn_default.red:focus {background-color:#b92929;border-color:#b92929}

/* 기본 버튼 outline */
.btn_default.line {background-color:var(--colorWhite) !important;color:var(--colorMain)}
.btn_default.line.dc2 {background-color:var(--colorWhite) !important;color:var(--colorSub)}
.btn_default.line.black2 {background-color:var(--colorWhite) !important;color:var(--colorBlack2)}
.btn_default.line.dgray {background-color:var(--colorWhite) !important;color:var(--colorDarkGray)}
.btn_default.line.fgray {background-color:var(--colorWhite) !important;color:var(--colorFontGray)}
.btn_default.line.navy {background-color:var(--colorWhite) !important;color:var(--colorNavy)}
.btn_default.line.blue {background-color:var(--colorWhite) !important;color:var(--colorBlue)}
.btn_default.line.green {background-color:var(--colorWhite) !important;color:var(--colorGreen)}
.btn_default.line.red {background-color:var(--colorWhite) !important;color:var(--colorRed)}

/* 기본 버튼 outline hover, focus*/
.btn_default.line:hover,
.btn_default.line:focus {color:#DF225D}
.btn_default.line.dc2:hover, 
.btn_default.line.dc2:focus {color:#2141af}
.btn_default.line.white:hover, 
.btn_default.line.white:focus {color:var(--colorBgGray)}
.btn_default.line.black2:hover, 
.btn_default.line.black2:focus {color:#424242}
.btn_default.line.dgray:hover, 
.btn_default.line.dgray:focus {color:#313336}
.btn_default.line.fgray:hover, 
.btn_default.line.fgray:focus {color:#525252}
.btn_default.line.navy:hover, 
.btn_default.line.navy:focus {color:#000b23}
.btn_default.line.blue:hover, 
.btn_default.line.blue:focus {color:#0065d2}
.btn_default.line.green:hover, 
.btn_default.line.green:focus {color:#62911f}
.btn_default.line.red:hover, 
.btn_default.line.red:focus {color:#b92929}
/* 링크 버튼 */
.btn_link {}
.btn_link .icon {color:var(--colorLightBlue)}
.btn_link:not(.disabled):hover, 
.btn_link:not(.disabled):focus, 
.btn_link.on {color:var(--colorLightBlue)}
.btn_link:not(.disabled):hover .text, 
.btn_link:not(.disabled):focus .text, 
.btn_link.on .text {text-decoration:underline}

/* 작은 버튼  */
.btn_small {display:inline-block;padding:0 8px;font-size:15px;line-height:22px;color:var(--colorBlack);background-color:var(--colorWhite);border:1px solid var(--colorFontGray);border-radius:5px}
.btn_small.red {color:var(--colorRed);border-color:var(--colorRed)}
.btn_small.blue {color:#428be9;border-color:#428be9}
.btn_small .icon {display:inline-block;vertical-align:middle;transform:translateY(-2px)}
.btn_small:hover, 
.btn_small:focus, 
.btn_small.on {color:var(--colorWhite);background-color:var(--colorBlack)}
.btn_small.red:hover, 
.btn_small.red:focus, 
.btn_small.red.on {color:var(--colorWhite);background-color:var(--colorRed)}
.btn_small.blue:hover, 
.btn_small.blue:focus, 
.btn_small.blue.on {color:var(--colorWhite);background-color:#428be9}

.btn_icon {display:inline-block;font-size:18px}
.btn_icon .icon {}
.btn_icon:hover {opacity:0.7}