/* button */
[class^='btnNormal'], a[class^='btnNormal'] { display:inline-block; padding:12px 20px; height:36px; font-size:12px; box-sizing:border-box; border:1px solid var(--mono-3-c9); line-height:1; font-weight:600; text-decoration:none; vertical-align:middle; word-spacing:-0.5px; letter-spacing:0; text-align:center; white-space:nowrap; color:#000; background-color:#fff; }
[class^='btnSubmit'], a[class^='btnSubmit'] { display:inline-block; padding:12px 20px; height:36px; font-size:12px; box-sizing:border-box; border:1px solid var(--point-color-primary); line-height:1; font-weight:bold; text-decoration:none; vertical-align:middle; word-spacing:-0.5px; letter-spacing:0; text-align:center; white-space:nowrap; color:var(--point-font-color-primary); background-color:var(--point-color-primary); }
[class^='btnEm'], a[class^='btnEm'] { display:inline-block; box-sizing:border-box; padding:2px 8px; border:1px solid transparent; font-size:12px; line-height:18px; font-weight:normal; text-decoration:none; vertical-align:middle; word-spacing:-0.5px; letter-spacing:0; text-align:center; white-space:nowrap; color:#fff !important; background-color:#737373; }
[class^='btnBasic'], a[class^='btnBasic'] { display:inline-block; box-sizing:border-box; padding:2px 8px; border:1px solid #d1d1d1; font-size:12px; line-height:18px; font-weight:normal; text-decoration:none; vertical-align:middle; word-spacing:-0.5px; letter-spacing:0; text-align:center; white-space:nowrap; color:#222; background-color:#f0f0f0; }
[class^='btnNormal']:not(.disabled):hover,
[class^='btnNormal']:not(.disabled).selected {border-color:#000;}
[class^='btnEm']:not(.disabled):hover { background-color:#77797d; }
[class^='btnBasic']:not(.disabled):hover { background-color:#e5e5e5; }
[class^='btnNormal'].disabled { border-color:#e3e3e3; color:#999; }
[class^='btnSubmit'].disabled { background-color:#9297a2; color:#f0f0f0; }
[class^='btnEm'].disabled { background-color:#b5b6b9; color:#f0f0f0; }
[class^='btnBasic'].disabled { color:#999; }
[class^='btn'] + [class^='btn'] { margin-left:6px; }

/* size */
[class^='btn'].sizeS { padding:0 15px; height:36px; font-size:12px; line-height: 34px;}
[class^='btn'].sizeM { padding:0 20px; height:36px; font-size:12px; line-height:34px; }
[class^='btn'].sizeL { padding:0 26px; height:50px; min-width:80px; font-size:14px; line-height:48px; font-weight:bold; }

/* sizeQty */
[class^='btn'].sizeQty { padding:9px 20px; height:30px; margin-left:6px; font-size:12px; line-height:12px; }

/* btnText */
.btnText { display:inline-block; font-size:13px; line-height:18px; text-decoration:underline; }

/* width full */
[class^='btn'].gFull { width:100%; }
[class^='btn'].gFull + [class^='btn'].gFull { margin:10px 0 0; }

/* width Fix */
[class^='btn'][class*='Fix'] { min-width:72px; word-break:keep-all; word-wrap:break-word; }
[class^='btn'][class*='Fix'].sizeS { min-width:96px; }
[class^='btn'][class*='Fix'].sizeM { min-width:135px; padding-left:15px; padding-right:15px; }
[class^='btn'][class*='Fix'].sizeL { min-width:160px; padding-left:8px; padding-right:8px; }

/* 배송 주소록 '고정/해제' 버튼 */
.xans-myshop-addrlist .addrlist_fix > a {padding: 0 8px; font-size: 12px; height: 25px; line-height: 23px; box-sizing: border-box;}

/* ec-base-button */
.ec-base-button { margin:20px 16px; text-align:center; }
.ec-base-button.justify { position:relative; }
.ec-base-button:after { display:block; content:""; clear:both; }
.ec-base-button .gLeft { float:left; text-align:left; }
.ec-base-button .gRight { float:right; text-align:right; }
.ec-base-button.justify .gLeft { position:absolute; left:0; }
.ec-base-button.justify .gRight { position:absolute; right:0; }
.ec-base-button .text { margin:0 6px 0 10px; color:#353535; line-height:24px; }
.ec-base-button [class^='btn'] + [class^='btn'] { margin-left:6px; }

/* type */
.ec-base-button.typeBorder { margin-top:-1px; padding:10px 20px; border:1px solid #d7d5d5; }

/* gBottom */
.ec-base-button.gBottom { margin:30px 0 0; }
.ec-base-button.gBottom [class^='btn'] + [class^='btn'] { margin-left:10px; }

/* gColumn */
.ec-base-button[class*="gColumn"] { margin:0 auto; display:-webkit-flex; display:-moz-flex; display:-ms-flex; display:flex; -webkit-justify-content:center; -moz-justify-content:center; -ms-justify-content:center; justify-content:center; }
.ec-base-button[class*="gColumn"]:after { display:none; }
.ec-base-button[class*="gColumn"] [class^='btn'] { margin:0 5px; padding-left:8px; padding-right:8px; word-break:keep-all; word-wrap:break-word; white-space:normal; -webkit-flex:1; -moz-flex:1; -ms-flex:1; flex:1; display:-webkit-flex; display:-moz-flex; display:-ms-flex; display:flex; -webkit-align-items:center; -moz-align-items:center; -ms-align-items:center; align-items:center; -webkit-justify-content:center; -moz-justify-content:center; -ms-justify-content:center; justify-content:center; }
.ec-base-button.gBottom { display:flex; margin-left:0; margin-right:0; }
.ec-base-button.gBottom .gLeft,
.ec-base-button.gBottom .gRight { display:flex; flex:1; }
.ec-base-button.gBottom [class^='btn'] { flex:1; border-radius: var(--radius-4);}
.ec-base-button.gBottom [class^='btn'] + [class^='btn'] { margin-left:10px; }

/* gFlex */
.ec-base-button[class*="gColumn"] .gFlex2 { -webkit-flex:2; -moz-flex:2; -ms-flex:2; flex:2; }
.ec-base-button[class*="gColumn"] .gFlex3 { -webkit-flex:3; -moz-flex:3; -ms-flex:3; flex:3; }
.ec-base-button[class*="gColumn"] .gFlex4 { -webkit-flex:4; -moz-flex:4; -ms-flex:4; flex:4; }

/* gFixed */
.ec-base-button.gFixed { position:fixed; z-index:990; left:0; bottom:0; max-width:100%; width:100%; margin:0; box-sizing:border-box; background:#fff; }
.ec-base-button.gFixed > .ec-base-button,
.ec-base-button.gFixed > .ec-base-button[class*="gColumn"] { margin:10px 11px; }

/* gBreak */
.ec-base-button.gBreak { flex-direction:column; }
.ec-base-button.gBreak .gLeft + .gRight { margin:10px 0; }
.ec-base-button.gBreak .gBreak { flex-direction:column; }
.ec-base-button.gBreak > [class^='btn'] + [class^='btn'],
.ec-base-button.gBreak .gBreak [class^='btn'] + [class^='btn'] { margin:10px 0 0; }
.ec-base-button .ec-base-button[class*="gColumn"] { margin:0 -5px; }

/* gColumnM (mobile only flex) */
.ec-base-button[class*="gMColumn"] { display:-webkit-flex; display:-moz-flex; display:-ms-flex; display:flex; -webkit-justify-content:center; -moz-justify-content:center; -ms-justify-content:center; justify-content:center; margin-left:11px; margin-right:11px; }
.ec-base-button[class*="gMColumn"]:after { display:none; }
.ec-base-button[class*="gMColumn"] [class^='btn'] { margin:0 5px; padding-left:8px; padding-right:8px; word-break:keep-all; word-wrap:break-word; white-space:normal; -webkit-flex:1; -moz-flex:1; -ms-flex:1; flex:1; display:-webkit-flex; display:-moz-flex; display:-ms-flex; display:flex; -webkit-align-items:center; -moz-align-items:center; -ms-align-items:center; align-items:center; -webkit-justify-content:center; -moz-justify-content:center; -ms-justify-content:center; justify-content:center; }
.ec-base-button[class*="gMColumn"] .gLeft,
.ec-base-button[class*="gMColumn"] .gRight { float:none; display:-webkit-flex; display:-moz-flex; display:-ms-flex; display:flex; width:100%; }

/* reset */
.gInnerMargin .ec-base-button,
.gInnerMargin .ec-base-button.gBottom,
.gInnerMargin.ec-base-button.gBottom { margin-left:0; margin-right:0; }


