@charset "utf-8";

*{margin:0; padding:0}
*{-webkit-tap-highlight-color:transparent;}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    /* font-family:'Nanum Barun Gothic', 'NanumBarunGothic', '나눔바른고딕', 'Apple SD Gothic Neo' , sans-serif; */
    font-family: 'Nanum Barun Gothic', 'NanumBarunGothic', '나눔바른고딕', 'Apple SD Gothic Neo' , sans-serif;
    /* font-family: 'Nanum Gothic', NanumGothic, 나눔고딕, Dotum, 돋움, sans-serif; */
    /* color:#2f2f2f; */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
ul,li {list-style:none;}
address{font-style:normal;}
fieldset{border:0;}
legend{display:none;}
button, img{border:none;}
table{border-collapse:collapse; border-spacing:0; border-collapse: inherit;}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal}
.center{vertical-align:middle;}
.veralign{vertical-align:sub;}
.v_top{vertical-align:top;}
.v_btm{vertical-align:bottom;}
radio{border:none;}
.clear {clear:both}
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden}
/* .clearfix {display:inline-block} */
/* Hides from IE-mac */
*html .clearfix {height:1%}
.clearfix {display:block}
/* End hide from IE-mac */

.fl{float:left !important;}
.fr{float:right !important;}
.tc{text-align: center !important;margin: 0 auto;}
.tl{text-align: left !important;}
.tr{text-align: right !important;}
.clr{clear:both;}
.on{display:block;}
.dis-inline{display:inline-block;}
/* .off, */
.blind{display:none !important;}
.fwn{font-weight:normal;}
.font_s{font-size: smaller}
.font_l{font-size: larger;font-family: 'Roboto', sans-serif;}
.font_L{font-size: larger;}
span{display:inline-block;}
del{margin:0; padding:0;}
.png24 {tmp:expression(setPng24(this));}
.font700{font-weight:700;}
/* a,a:hover,a:active { text-decoration: none; color:#2f2f2f; cursor:pointer; } */
a {color:inherit; background-color:transparent; text-decoration:none; outline:0;cursor: pointer;}
img{border:0;vertical-align: top;max-width: 100%;outline:none;}
b, strong {font-weight: bold;}
pre {overflow:auto}
code, kbd, pre, samp {font-family:monospace, monospace; font-size:1em}
button, input, optgroup, select, textarea {/*color:inherit; font:inherit;*/font-family: 'Nanum Gothic', NanumGothic, 나눔고딕, Dotum, 돋움, sans-serif; color: #2f2f2f; margin:0; vertical-align:middle; font-size: 13px;}
select, button {overflow:visible; padding:0; margin:0;	outline:0; border:none;	background:transparent; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
button, select {text-transform:none}
select {color: #777;background: #fff url(../images/ico_sel.png) no-repeat;background-size: 25px auto;background-position: right 5px;box-sizing: border-box;-webkit-appearance: none;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance:button;	cursor:pointer}
button[disabled], html input[disabled] {cursor:default}
button::-moz-focus-inner, input::-moz-focus-inner {border:0; padding:0}
input {border:none;outline:0;line-height:normal;padding:0;vertical-align:middle;color:#777;}
@media only screen and (max-width : 320px) {input {}}
input[type="checkbox"], input[type="radio"] {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; padding:0; -webkit-appearance: none;}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {height:auto}
input[type="search"] {-webkit-appearance:textfield; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;	box-sizing:content-box}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration	{-webkit-appearance:none}
fieldset {border:0; padding:0;	margin:0}
header {background-color: #fff;padding: 0px; text-decoration: none;position: absolute;width: 100%;z-index: 2;}
/*table {border-collapse: collapse;border-spacing: 0;}*/
/* Smartphones (portrait) */
@media only screen and (max-width : 320px) {
    th,td,li,p,span {
        font-size: 95% !important;
        letter-spacing: -0.8px !important;
    }
    h1,h2,h3,h4,h5 {
        font-size: 110% !important;
    }
}

/* iPads (portrait) */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
    th, td {
        font-size : 105% !important;
    }
}

/* Desktops and laptops */
@media only screen
and (min-width : 1224px) {
    th, td {
        font-size : 115% !important;
    }
}

body{font-size: 75%;}
h1{font-size: 1.7em;}
h2{font-size: 1.65em;}
h3{font-size: 1.5em;}
h4{font-size: 1.3em;}
h5{font-size: 1.15em;}
/* p{font-size: 1.1em;} */
th,td,li {font-size: 1.05em;letter-spacing: -0.5px;}

#header_wrap {

    width: 100%;
}

#content {
    background-color: #FFFFFF;
    padding: 0;
    padding-top: 100px;/* 수정 : 20190510 */
    padding-bottom: 50px;
    margin:0;
    position: relative;
    height: 100%;
}
#hamburger {
    cursor: pointer;
}

section {
    display: inline-block;
    width: 100%;
    padding: 0px;
    margin-top: 0px;/*수정 : 20190515*/
}

nav {
    opacity: 0;
    left: 0px;
    top: 0px;
    position: fixed;
    z-index: 0;
    width: 100%;
    height: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
}
#contentLayer {
    display: none;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 13%;
    height:55px;
    z-index: 5;
}
/* 토글버튼
.checkbox label .toggle,
.checkbox-inline .toggle {
	margin-left: -20px;
	margin-right: 5px;
}

.toggle {
	position: relative;
	overflow: hidden;
}
.toggle input[type="checkbox"] {
	display: none;
}
.toggle-group {
	position: absolute;
	width: 200%;
	top: 0;
	bottom: 0;
	left: 0;
	transition: left 0.35s;
	-webkit-transition: left 0.35s;
	-moz-user-select: none;
	-webkit-user-select: none;
}
.toggle.off .toggle-group {
	left: -100%;
}
.toggle-on {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 50%;
	margin: 0;
	border: 0;
	border-radius: 0;
}
.toggle-off {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	right: 0;
	margin: 0;
	border: 0;
	border-radius: 0;
}
.toggle-handle {
	position: relative;
	margin: 0 auto;
	padding-top: 0px;
	padding-bottom: 0px;
	height: 100%;
	width: 0px;
	border-width: 0 1px;
}

.toggle.btn { min-width: 35px; min-height: 22px; }
.toggle-on.btn { padding-right: 12px; }
.toggle-off.btn { padding-left: 12px; }

.toggle.btn-lg { min-width: 79px; min-height: 45px; }
.toggle-on.btn-lg { padding-right: 31px; }
.toggle-off.btn-lg { padding-left: 31px; }
.toggle-handle.btn-lg { width: 40px; }

.toggle.btn-sm { min-width: 50px; min-height: 30px;}
.toggle-on.btn-sm { padding-right: 20px; }
.toggle-off.btn-sm { padding-left: 20px; }

.toggle.btn-xs { min-width: 35px; min-height: 22px;}
.toggle-on.btn-xs { padding-right: 12px; }
.toggle-off.btn-xs { padding-left: 12px; }
.btn-default {color:#333; background-color:#fcfcfc; border-color: #ddd}
*/

/* 페이지 공통 */
.page_boundary{ width:100%; height:8px; background-color:#eee; clear:both;}

/* 탭 공통 */
.tab { border:1px solid #ddd; border-left:none; background:#fff; overflow:hidden; }
.tab li { float:left; width:33.3%; border-left:1px solid #ddd; text-align:center; box-sizing:border-box; }
.tab li { display:inline-block; padding:20px; cursor:pointer; }
.tab li.on { background-color:#eee; color:#f00; }
.tab_cont { clear:both; margin-top:5px; border:1px solid #ddd; }
.tab_cont div { height:100px; background:#fff; line-height:100px; text-align:center; }

/* 테이블 공통 */
/* 테이블공통 - 리스트형 */
.list_table{ width:100%; }
.list_table tr th,
.list_table tr td{ line-height:1.6; padding:15px; border-bottom:1px solid #ddd; word-break:break-all; }
.list_table tr td .icon_new{ width:14px; vertical-align:-3px; }
.list_table tr.list_answer td{ line-height:1.6; background-color:#f9f9f9; }
.list_table tr td .list_desc{ max-height:35px; display:block; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; }
.list_table tr td .list_date{ margin-top:5px;  color:#999; }
/*
.list_table tr td .list_title{ display:block; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; word-break:break-all; }
 */

/* 기본테이블 - 디자인없음 */
.basic_table{ display: inline-table;width:100%; }
.basic_table tr th{ padding:5px 0; font-weight:normal; text-align:left; }
.basic_table tr.double_line th{ padding-top:18px; vertical-align:top !important; }
.basic_table tr td{ padding:5px; }
.basic_table tr td .half{ width:50%; margin:5px 0; float:left; }
.basic_table select{ width:100%; height:35px; padding:0 10px; }
/* .basic_table input[type='text'],
.basic_table input[type='number']{ width:100%; height:38px; border:0; }
.basic_table .phone_input{ width:100%; margin:0; padding:7px 0; border:1px solid #ddd; } */
.basic_table textarea{ width:100%; margin:10px 0 5px 0; border:none; }


/* 테이블공통 - 데이터형 */
.data_table{ width:100%; border:2px solid #2f2f2f; border-width:2px 0 0; }
.data_table tr th{padding: 15px 10px 15px 15px;;font-weight:normal;color: #999;font-size: 12.5px;border:1px solid #ddd;border-width: 0 0px 1px 0;background-color: #f9f9f9;text-align:left;}
.data_table tr th .red {/* position: absolute; */ margin: 1px 0 0 3px;}
.data_table tr td {position: relative;/* line-height: 1.4; */padding:10px 8px;font-size: 12.5px;border:1px solid #ddd;border-width:0 1px 1px 0;}
.data_table tr td input[type='text'],
.data_table tr td input[type='number']{width:100%;height:35px;border: 0px solid #ddd; background: #fff;}
.data_table tr td .button {position: absolute;top: -1px;right: -1px;width: 78px;height: 43px;bottom: 0;text-align: center;background: #999;color: #fff;padding: 13px 0px;letter-spacing: -1px;font-size: 12px;border: 1px solid #888;}

@media only screen and (max-width : 320px) {
    .data_table tr th {padding: 10px 5px 10px 10px;}
    .data_table tr td {padding: 10px 5px;}
    .data_table tr td input[type='text'], .data_table tr td input[type='number'] {height: 32px;}
    .data_table tr td .button {width: 60px;height: 37px;padding: 10px 0px;}

}

.data_table tr:last-child th,
.data_table tr:last-child td{ /* border-bottom:0; */ }
.data_table tr th:last-child,
.data_table tr td:last-child{ border-right:0; }
.data_table tr td .data_lst {position: relative;padding: 5px 0 5px 15px;line-height: 1.4;}
.data_table tr td .data_lst:after{position: absolute;top: 11px;left: 5px;width: 3px;height: 3px;border-radius: 100%;background: #303033;content: "";}
.data_table tr td .data_one{ display:block; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; word-break:break-all; }
.data_table tr td .btn {position: absolute;bottom: -1px;right: 10px;text-align: center;border: 1px solid #7d7d7d;padding: 0px 8px;letter-spacing: -1px;line-height: 3.2;font-size: 12.5px;background: #999;color: #fff;}
.data_table tr td.title { font-size: 14px; font-weight:500;}

.basic_table .phone_input{ width:100%; margin:0; padding:4px 0; border:1px solid #ddd; }

/* 테이블내부 전화입력부 */
.phone_input{ width:100%; margin:7px 0; }
.phone_input tr td{padding:0;border: 0;line-height: 1.2;}
.phone_input tr td.text_input{ padding:0px; border-left:1px solid #ddd;/* text-indent: 10px;  */} /* 수정 : 2019.05.14 */
.phone_input select{font-size: 13px;height:38px;border:none;}
.phone_input input[type='text'],
.phone_input input[type='number']{height:31px !important;border: 0px !important;}

/* 테이블공통 - 장바구니형 */
.basket_table{ width:100%; border:1px solid #aaa; border-width:1px 0 0; }
.basket_table tr th{ padding:10px 8px; font-weight:600; color:#333; text-align:left; background-color: #f5f5f5; line-height: initial; }
.basket_table tr td{ position: relative; line-height:2.15; vertical-align: top; padding:10px 15px 5px; word-break:break-all;border-bottom: 1px solid #eee; }
.basket_table tr td strong { font-family: 'Roboto', 'sans-serif';}
.basket_table tr th:last-child,
.basket_table tr td:last-child{ border-right:0; }
.basket_table .option {color:#999; font-size:11px; padding: 5px 0;}
.basket_table a.product_name {display:block; line-height: 1.4;word-break:break-all;text-overflow: ellipsis; -webkit-line-clamp: 1;overflow: hidden;word-break: break-all;}

/* 테이블공통 - 박스형 */
.box_table{margin: 10px 10px 0;border: 1px solid #ddd;background-color:#fff;width: -webkit-calc(100% - 20px);width: -moz-calc(100% - 20px);width: calc(100% - 20px);}
.box_table input[type='text'],
.box_table input[type='number'],
.login_input input[type='password']{ width:100%; height:45px; border:0; }
.box_table .radio_idt{ margin:12px 0; }
.box_table tr th{ padding:5px 15px; border-width:0 1px 1px 0; font-weight:normal; text-align:left; }
.box_table tr td{padding:0 10px; background: #f8f8f8;}
.box_table tr:last-child th,
.box_table tr:last-child td{ border-bottom:0; }
.box_table select{ width:100%; height:31px; padding:0 10px 0 15px; border:0; }
.box_table textarea{ width:100%; margin:10px 0; border:none; line-height:20px;}
.box_table tr td .icon_new{ width:14px; vertical-align:-3px; }
.box_table.box_solid tr td{line-height:1.8;padding:15px 0;position:relative;text-align:center;}
.box_table.box_solid tr td .img_calcul{height:28px;position:absolute;top:33%;right:-15px;z-index: 1;}
.box_table.box_solid tr td.total_calcul{padding: 15px;background: #fff;border: 10px solid #f8f8f8;}

/*쇼핑스토리*/
table.info_stable2{ width: 100%; margin:10px 0; }
table.info_stable2 tr th {padding:5px 0; font-size :15px; font-weight:500; text-align :left; position:relative; }
table.info_stable2 tr th h4 {position:absolute;bottom:-10px; font-size :17px;background:#fff;padding-right:10px;text-indent: 0px;}
table.info_stable2 tr th span{ line-height:1.4; padding-right:10px;  background-color:#fff ; position :absolute; bottom:-10px; }
table.info_stable2 tr td {position: relative; font-size: 13px; color: #777; line-height:1.6; padding:10px 0 10px 0; border:none; }
table.info_stable2 tr td .data_lst:after{position: absolute;top: 8px;left: -10px;width: 3px;height: 3px;border-radius: 100%;background: #2f2f2f;content: "";}
table.info_stable2 tr td p {position: relative; padding-bottom: 8px;}
table.info_stable2 tr th{ border-bottom:2px solid #2f2f2f; color:#2f2f2f; }
table.info_stable2 tr td .img_process {margin-top:15px;width:100%;}

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (min-width : 1824px)
and (orientation : landscape){
    table.info_stable2 tr td .img_process {
        margin-top:15px;
        width:75%;
    }
}

/* 테이블하단 디스크립션 */
.table_bottom_desc{ line-height:1.6; margin-top:5px; }
.table_bottom_desc p{ font-size:11px; color:#666; }

/* 테이블공통 - 데이터없는테이블 */
.none_table{ width:100%; text-align:center; }
.none_table tr td{ height:200px; background-color:#f9f9f9; }

/* 회색박스 */
.box_gray {font-size: 1.075em;text-align:left;color:#d01f1f !important;padding: 0px 15px 12px;margin: 0px 0px 15px;line-height: 1.4;font-size: inherit;}
.buy_amount {float: left;background: #fff;vertical-align:middle;border: 1px solid #ddd;padding: 0px;}
.buy_amount input {vertical-align: middle;font-family: 'Roboto';padding: 10px 0 10px;font-size: 15px;border: 1px solid #ddd;border-width: 0px 1px 0px 1px;width: 40px;text-align: center;}
.buy_amount img {vertical-align:middle;width: 50%;}
.buy_amount tr td {text-align:center}

/* 칸 글자줄임 */
.ellipsis  {overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; word-wrap:break-word}
.ellipsis2 {overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; word-wrap:break-word}
.ellipsis3 {overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; word-wrap:break-word}

/* 숫자 폰트 */
.num  { font-family: 'Roboto', sans-serif !important; }

/*color*/
.red{color:#d01f1f !important;}
.blue{color:#0053fc !important;}
.dgray{color:#2f2f2f !important;}
.gray{color:#666 !important;}
.lgray{color:#999 !important;}
.c_graya {color:#aaa !important;}
.orin{color:#ff5f09 !important;}
.white{color:#fff !important;}

.C_red {color:#d01f1f !important;font-family: 'Roboto', sans-serif;}
.C_dgray{color:#2f2f2f !important;font-family: 'Roboto', sans-serif;}
.C_gray{color:#666 !important;font-family: 'Roboto', sans-serif;}
.C_lgray{color:#999 !important;font-family: 'Roboto', sans-serif;}

/* 보더& 마진 무효화 */
/* .border-dashed{border-top:1px dashed #d6d6d6;}
.border-top{border-top:1px solid #d6d6d6;}
.border-bottom1{border-bottom:1px solid #d6d6d6;}
.border-right{border-right:1px solid #d6d6d6;}
.border-left{border-left:1px solid #d6d6d6;} */
.b_left {border-left: 1px solid #ddd !important;}
.b_right {border-right: 1px solid #ddd !important;}

.b_top {border-top: 1px solid #ddd !important;}
.b_top_aaa {border-top: 1px solid #aaa !important;}
.b_top_ccc {border-top: 1px solid #ccc !important;}

.b_right_dot {border-right: 1px dotted #aaa !important;}

.b_bottom {border-bottom: 1px solid #eee !important;}
.b_bottom_dot {border-bottom: 1px dotted #aaa !important;}
.b_bottom_2f2f2f {border-bottom: 1px solid #2f2f2f !important;}
.b_bottom_aaa {border-bottom: 1px solid #aaa !important;}
.b_bottom_ddd {border-bottom: 1px solid #ddd !important;}
.b_bottom_eee {border-bottom: 1px solid #eee !important;}
.b_bottom_444 {border-bottom: 1px solid #444 !important;}

.border_r_none {border-right: none !important;}
.border_l_none {border-left: none !important;}
.border_b_none {border-bottom: none !important;}
.border_t_none {border-top: none !important;}
.border_none{border: none !important;}
.margin_none{margin: 0px !important;}
.b_dd {border: 1px solid #ddd !important;}
.b_bf {border: 1px solid #ddd !important;}

/*select, textarea*/
.select0 {padding:3px 0 5px 0; font-weight:700; border:none; cursor:pointer}
.select { /* background:#fff; */ width: 100%;height: 37px !important;padding: 0 33px 0 6px;font-size: 12.5px;border: 1px solid #ddd;}
.select2 { /* background:#fff; */ padding:7px 5px 8px 10px; border:1px solid #ddd;
    display: inline-block;
    background: #fff url(http://mustit.co.kr/lib/img/m/m_common/icon_barrow_down.png) no-repeat right 10px center;
    background-size: 7.5px 4.5px;
    outline: none;
    -webkit-appearance: none;
    -webkit-border-radius: 0;}

.select45 {width:45%}
.select50 {width:50%}
.select60 {width:60%}
.select70 {width:70%}
.select100 {width:100%}
.select_100    {width:-webkit-calc(100% - 80px) !important; width:-moz-calc(100% - 80px) !important; width:calc(100% - 80px) !important;}
.select_100_20 {width:-webkit-calc(100% - 20px) !important; width:-moz-calc(100% - 20px) !important; width:calc(100% - 20px) !important;}
.select_50 {width:-webkit-calc(50% - 2px); width:-moz-calc(50% - 2px); width:calc(50% - 2px);}
.select33 {width:-webkit-calc(33.3% - 2px); width:-moz-calc(33.3% - 2px); width:calc(33.3% - 2px); line-height: 1.4;}

.select_155{width:100%;height:37px !important;padding:0 33px 0 6px;font-size:12.5px;border:1px solid #ddd;}

.textarea {width:100%;padding: 7px;background:#fff;line-height: 1.4;color: #777;border:1px solid #ddd;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}/*수정 : 20190514*/

/*text-indent*/
.ti5 {text-indent: 5px !important;}
.ti10 {text-indent: 10px !important;}
.ti15 {text-indent: 15px !important;}
.ti20 {text-indent: 20px !important;}
.ti25 {text-indent: 25px !important;}

/*right 추가 : 20190514*/
.r10 {right:10px !important;}
.r20 {right:20px !important;}
.r30 {right:30px !important;}
.r40 {right:40px !important;}
.r50 {right:50px !important;}
.r60 {right:60px !important;}
.r70 {right:70px !important;}

/*margin,padding*/
.mg0 {margin:0px !important;}
/* .phone_input {margin:5px 0 !important;} */
.mg5 {margin:5px !important;}
.mg10 {margin:10px !important;}
.mg20 {margin:20px !important;}
.mg30 {margin:30px !important;}
.mg40 {margin:40px !important;}
.mg50 {margin:50px !important;}

.mgt-1{margin-top:-1px !important;}
.mgt-3{margin-top:-3px !important;}
.mgt-5{margin-top:-5px !important;}
.mgt-10{margin-top:-10px !important;}
.mgt-15{margin-top:-15px !important;}
.mgt-20{margin-top:-20px !important;}
.mgt-25{margin-top:-25px !important;}
.mgt-33{margin-top:-33px !important;}
.mgt-35{margin-top:-35px !important;}
.mgt-40{margin-top:-40px !important;}
.mgt0{margin-top:0px !important;}
.mgt5{margin-top:5px !important;}
.mgt6{margin-top:6px !important;}
.mgt7{margin-top:7px !important;}
.mgt8{margin-top:8px !important;}
.mgt10{margin-top:10px !important;}
.mgt15{margin-top:15px !important;}
.mgt20{margin-top:20px !important;}
.mgt25{margin-top:25px !important;}
.mgt30{margin-top:30px !important;}
.mgt35{margin-top:35px !important;}
.mgt40{margin-top:40px !important;}
.mgt45{margin-top:45px !important;}
.mgt50{margin-top:50px !important;}
.mgt55{margin-top:55px !important;}
.mgt60{margin-top:60px !important;}
.mgt65{margin-top:65px !important;}
.mgt70{margin-top:70px !important;}
.mgt75{margin-top:75px !important;}
.mgt80{margin-top:80px !important;}

.mgb-5{margin-bottom:-5px !important;}
.mgb0{margin-bottom:0px !important;}
.mgb5{margin-bottom:5px !important;}
.mgb10{margin-bottom:10px !important;}
.mgb15{margin-bottom:15px !important;}
.mgb20{margin-bottom:20px !important;}
.mgb25{margin-bottom:25px !important;}
.mgb30{margin-bottom:30px !important;}
.mgb35{margin-bottom:35px !important;}
.mgb40{margin-bottom:40px !important;}
.mgb45{margin-bottom:45px !important;}
.mgb50{margin-bottom:50px !important;}
.mgb60{margin-bottom:60px !important;}
.mgb70{margin-bottom:70px !important;}
.mgb80{margin-bottom:80px !important;}

.mgl-1{margin-left:-1px !important;}
.mgl-5{margin-left:-5px !important;}
.mgl0{margin-left:0px !important;}
.mgl5{margin-left:5px !important;}
.mgl8{margin-left:8px !important;}
.mgl10{margin-left:10px !important;}
.mgl15{margin-left:15px !important;}
.mgl20{margin-left:20px !important;}
.mgl25{margin-left:25px !important;}
.mgl30{margin-left:30px !important;}
.mgl35{margin-left:35px !important;}
.mgl40{margin-left:40px !important;}
.mgl45{margin-left:45px !important;}
.mgl50{margin-left:50px !important;}
.mgl55{margin-left:55px !important;}
.mgl60{margin-left:60px !important;}
.mgl65{margin-left:65px !important;}
.mgl70{margin-left:70px !important;}
.mgl75{margin-left:75px !important;}
.mgl150{margin-left:150px !important;}

.mgr0{margin-right:0px !important;}
.mgr5{margin-right:5px !important;}
.mgr10{margin-right:10px !important;}
.mgr15{margin-right:15px !important;}
.mgr20{margin-right:20px !important;}
.mgr25{margin-right:25px !important;}
.mgr30{margin-right:30px !important;}
.mgr35{margin-right:35px !important;}
.mgr40{margin-right:40px !important;}
.mgr45{margin-right:45px !important;}
.mgr50{margin-right:50px !important;}

.pdt0{padding-top:0px !important;}
.pdt3{padding-top:3px !important;}
.pdt5{padding-top:5px !important;}
.pdt8{padding-top:8px !important;}
.pdt10{padding-top:10px !important;}
.pdt15{padding-top:15px !important;}
.pdt20{padding-top:20px !important;}
.pdt25{padding-top:25px !important;}
.pdt30{padding-top:30px !important;}
.pdt35{padding-top:35px !important;}
.pdt40{padding-top:40px !important;}
.pdt45{padding-top:45px !important;}
.pdt50{padding-top:50px !important;}
.pdt110{padding-top:110px !important;}
.pdt120{padding-top:120px !important;}

.pdb0{padding-bottom:0px !important;}
.pdb2{padding-bottom:2px !important;}
.pdb5{padding-bottom:5px !important;}
.pdb8{padding-bottom:8px !important;}
.pdb10{padding-bottom:10px !important;}
.pdb15{padding-bottom:15px !important;}
.pdb20{padding-bottom:20px !important;}
.pdb25{padding-bottom:25px !important;}
.pdb30{padding-bottom:30px !important;}
.pdb35{padding-bottom:35px !important;}
.pdb40{padding-bottom:40px !important;}
.pdb45{padding-bottom:45px !important;}
.pdb50{padding-bottom:50px !important;}

.pdl0{padding-left:0px !important;}
.pdl2{padding-left:2px !important;}
.pdl5{padding-left:5px !important;}
.pdl8{padding-left:8px !important;}
.pdl10{padding-left:10px !important;}
.pdl15{padding-left:15px !important;}
.pdl20{padding-left:20px !important;}
.pdl25{padding-left:25px !important;}
.pdl30{padding-left:30px !important;}
.pdl35{padding-left:35px !important;}
.pdl40{padding-left:40px !important;}
.pdl45{padding-left:45px !important;}
.pdl50{padding-left:50px !important;}

.pdr0{padding-right:0px !important;}
.pdr5{padding-right:5px !important;}
.pdr10{padding-right:10px !important;}
.pdr15{padding-right:15px !important;}
.pdr20{padding-right:20px !important;}
.pdr25{padding-right:25px !important;}
.pdr30{padding-right:30px !important;}
.pdr35{padding-right:35px !important;}
.pdr40{padding-right:40px !important;}
.pdr45{padding-right:45px !important;}
.pdr50{padding-right:50px !important;}

.padding_25 {padding: 25px !important;}
.padding_20 {padding: 20px !important}
.padding_15 {padding: 15px !important;}
.padding_13 {padding: 13px !important;}
.padding_14 {padding: 14px !important;}
.padding_12 {padding: 12px !important;}
.padding_10 {padding: 10px !important;}
.padding_0 {padding: 0px !important;}
.padding_1 {padding: 1px !important;}
.padding_2 {padding: 2px !important;}
.padding_3 {padding: 3px !important;}
.padding_4 {padding: 4px !important;}
.padding_5 {padding: 5px !important;}

.text-justify{text-align:justify;}
.text-center{text-align:center;}
.text-left{text-align:left;}
.text-right{text-align:right;}

.w10{width:10% !important;}
.w15{width:15% !important;}
.w20{width:20% !important;}
.w225{width:22.5% !important;}
.w25{width:25% !important;}
.w28{width:28% !important;}
.w30{width:30% !important;}
.w40{width:40% !important;}
.w50{width:50% !important;}
.w55{width:55% !important;}
.w60{width:60% !important;}
.w70{width:70% !important;}
.w80{width:80% !important;}
.w85{width:85% !important;}
.w90{width:90% !important;}
.w100{width:100% !important;}
.wd50{width: 50px !important;}
.wd80{width: 80px !important;}
.wd100{width: 100px !important;}
.wd120{width: 120px !important;}
.wd150{width: 150px !important;}
.wd180{width: 180px !important;}
.w33{width:33.33% !important;}

.h50 {height: 50px !important;}

.form-150{width:80%; border:3px solid #575757;height:20px; padding:0 5px; vertical-align:middle; float:left;}
.round7{border-radius:7px;}
.round15{border-radius:15px;}
.round25{border-radius:25px;}
.round50{border-radius:50px;}
.round100{border-radius:100px;}
.btnr{margin-right:5px;  float:right;}

.fs9 {font-size: 9px !important;}
.fs10 {font-size: 10px !important;}
.fs11 {font-size: 11px !important;}
.fs12 {font-size: 12px !important;}
.fs13 {font-size: 13px !important;}
.fs14 {font-size: 14px !important;}
.fs15 {font-size: 15px !important;}
.fs16 {font-size: 16px !important;}
.fs17 {font-size: 17px !important;}
.fs18 {font-size: 18px !important;}
.fs19 {font-size: 19px !important;}
.fs20 {font-size: 20px !important;}
.fs21 {font-size: 21px !important;}
.fs22 {font-size: 22px !important;}
.fs24 {font-size: 24px !important;}
.fs25 {font-size: 25px !important;}

.extra {font-weight: 900 !important;}
.bold {font-weight: bold !important;}
.normal {font-weight: normal !important;}
.underline {text-decoration: underline;}
.line-through {text-decoration: line-through}

span.span200 {font-weight:200;}
span.span300 {font-weight:300;}
span.span400 {font-weight:400;}
span.span700 {font-weight:700;}

/* 배경색 */
.bg-0 {background: #000 !important;}
.bg-fff {background: #fff !important;}
.bg-2f {background: #2f2f2f !important;}
.bg-f0 {background: #f0f0f0 !important;}
.bg-f5 {background: #f5f5f5 !important;}
.bg-f8 {background: #f8f8f8 !important;}

.box_bg {background: #e5e5e5;padding: 20px 10px 20px;color: #fff;margin: 0 10px;}
.box_bg_s{background: #f5f5f5;padding: 0 6px;color: #999;margin: 0px;height: 30px;line-height: 2.3;}
.box_bg_b{background: #eee;padding: 20px 10px 20px;color: #fff;margin: 0px;}

/* opacity */
.op50 {opacity: 0.5;}
.op60 {opacity: 0.6;}
.op70 {opacity: 0.7;}
.op80 {opacity: 0.8;}

/* 블로거 아이콘 */
.bloger_pt  {position: absolute;top: 10px;left: 0px;text-align: center;}/* 수정 : 2019.05.14 */
.bloger_pt img {border-radius: 50px;width: 45px;height: 45px;}/* 수정 : 2019.05.14 */
.bloger_pt .name  {font-size: 11px !important;color: #999;}

.bloger_s_pt  {position: absolute;top: 5px;right: 0px;text-align: center;}
.bloger_s_pt img {border-radius: 50px;width: 50px;height: 50px;}
.bloger_s_pt .name  {font-size: 11px !important;margin-top:3px;}

.bloger_ss_pt  {margin: 0;float: left;width: 20%;text-align: center;}
.bloger_ss_pt img {border-radius: 60px;width: 28px;height: 28px;}
.bloger_ss_pt:last-child  {margin: 0px;}

.btn_bord_b_s  {border:1px solid #2f2f2f;padding: 6px 8px;letter-spacing: -1px;display: inline-block;font-size: 12px;line-height: 1.2;}
.btn_bord_b_s1 {border: 1px solid #888;padding: 1px 5px;letter-spacing: -1px;line-height: 3.3;background: #999;color: #fff;font-size: 12px;}
.btn_bord_b_s2 {border:1px solid #2f2f2f;padding: 6px 8px;letter-spacing: -1px;background-color:#2f2f2f;color:#fff;display: inline-block;font-size: 12px;}
.btn_bord_b_s3 {border:1px solid #2f2f2f; padding: 8px 10px;letter-spacing: -1px; background-color: #fff;color: #2f2f2f;font-size: 12px;}
.btn_bord_b_s4 {border:1px solid #2f2f2f; padding:0px 7px; letter-spacing: -1px; background-color:#fff;color:#2f2f2f;line-height: 2.1;font-size: 12px;}
.btn_bord_b_s5 {border: 1px solid #999;padding:8px 7px 8px;letter-spacing: -1px;background-color: #999;color: #fff;font-size: 12px;}
.btn_bord_b_s6 {border: 1px solid #2f2f2f;padding:8px 7px 8px;letter-spacing: -1px;background-color: #2f2f2f;color: #fff;font-size: 12px;}
.btn_bord_b_s2:active,
.btn_bord_b_s6:active,
.btn_back_b_b:active  {color: #fff;}

.btn_back_b_b {display: inline-block;background-color: #2f2f2f;color:#fff;text-align: center;border: 1px solid #2f2f2f;padding: 10px 30px 10px;font-size: 13px;font-weight: 500;line-height: 1.3;}
.btn_back_h_b {display: inline-block;background-color: #fff;color: #2f2f2f;text-align:center;border: 1px solid #2f2f2f;padding: 10px 30px 10px;font-size: 13px;font-weight: 500;line-height: 1.3;}

@media only screen and (max-width : 320px) {
    .btn_bord_b_s {border:1px solid #2f2f2f; padding:6px 3px; letter-spacing: -1px; font-size: 11px;}
    .btn_bord_b_s1 {border:1px solid #888;padding: 0px 5px;letter-spacing: -1px;font-size: 12px;line-height: 3.2;}
    .btn_bord_b_s2 {padding: 0px 5px;line-height: 1.9;}
    .btn_back_b_b {background-color: #2f2f2f;color: #fff;text-align: center;font-size: 11px;border: 1px solid #2f2f2f;line-height: 1.3;padding: 7px 28px 7px;}
    .btn_back_h_b {background-color: #fff;color: #2f2f2f;text-align:center;border: 1px solid #2f2f2f;padding: 6px 10px 7px;font-size: 12px;font-weight: 500;}
}

/*버튼 fade animation*/
.ani_fade_in {animation:fade_in 0.25s forwards;-webkit-animation:fade_in 0.25s forwards;}
.ani_fade_out {animation:fade_out 0.25s forwards;-webkit-animation:fade_out 0.25s forwards;}

@-webkit-keyframes fade_in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-webkit-keyframes fade_out {
    from {
        opacity: 1;
        display:block;
    }
    to {
        opacity: 0;
        display:none;
    }
}
@keyframes fade_in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes fade_out {
    from {
        opacity: 1;
        display:block;
    }
    to {
        opacity: 0;
        display:none;
    }
}

@media screen and (min-width: 769px) {
    /* STYLES HERE */
}

@media screen and (min-device-width: 481px) and (max-device-width: 768px) {
    /* STYLES HERE */
}

@media only screen and (max-device-width: 480px) {
    /* STYLES HERE */
}