#menuline {
clear: both;
border-top: 1px solid #dcdcdc;
width: 100%;
margin: 0 auto;
}
#membericon {
clear: both;
width: 100%;
margin: 0;
font-family: "Malgun Gothic",맑은 고딕,AppleGothic,돋움,Dotum;
font-size: 11px;
}
#membericon li {
float: left;
width: 25%;
vertical-align: middle;
text-align: center;
}

#membericon1 {
font-family: "돋움", Dotum, AppleGothic, sans-serif; 
color: #000;
border-right: 1px solid #e3e3e3;
padding: 15px 0 12px 0;
}
#membericon2 {
font-family: "돋움", Dotum, AppleGothic, sans-serif; 
color: #000;
padding: 15px 0 12px 0;
}

.tab a {
float: left;
width: 100%;
padding: 10px 0;
font-size: 13px;
font-weight: bold;
font-family: 'Roboto',sans-serif;
color: #000;
text-align: center;
border-bottom: 1px solid #e3e3e3;
background-color: #FFF;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-sizing: border-box;
-o-sizing: border-box;
box-sizing: border-box;
border-bottom: 1px solid #dcdcdc;
}

.tab1 a {
float: left;
width: 100%;
padding: 10px 0;
font-size: 13px;
font-weight: bold;
font-family: 'Roboto',sans-serif;
color: #000;
text-align: center;
background-color: #FFF;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-sizing: border-box;
-o-sizing: border-box;
box-sizing: border-box;
}

#menuline {
clear: both;
border-top: 1px solid #dcdcdc;
width: 100%;
margin: 0 auto;
}

#bottommenu {
clear: both;
width: 100%;
margin: 0;
font-family: dotum;
font-size: 11px;
}

#bottommenu li {
list-style: none;
float: left;
width: 25%;
vertical-align: middle;
text-align: center;
}



#bottommenu1 {
color: #000;
border-right: 1px solid #e3e3e3;
padding: 10px 0 10px 0;
}

#bottommenu2 {
color: #000;
padding: 10px 0 10px 0;
}



#sns {
padding: 10px 0;
text-align: center;
}

#sns span {
font-size: 11px;
font-family: 'Oxygen',sans-serif;
font-weight: bold;
letter-spacing: 1px;
}

#sns img {
width: 25px;
padding-left: 2px;
vertical-align: middle;
}

.footer_sns {
    width: 100%;
    background: #a7a7a7;
    padding: 10px 30%;
    box-sizing: border-box;
    overflow: hidden;
}
.footer_sns li {
    width: 50%;
    text-align: center;
    display: inline-block;
    box-sizing: border-box;
    float: left;
}
.footer_sns li img {
    height: 15px;
}
.call_bank {
    color: #757575;
    height: 170px;
    font: 100% Helvetica, Helvetica Neue, Arial;
}
.call_bank ul {
    width: 50%;
    float: left;
    display: inline-block;
    box-sizing: border-box;
    padding: 10PX 0 0 0px;
    position: relative;
}
.call_info, .bank_info {
    height: 220px;
    padding: 0 0 0 10px;
}
.call_info h2 {
    font-family: pt sans,sans-serif;
    font-size: .95em;
    margin: 17px 0 8px 0;
    font-weight: normal;
    text-indent: 5px;
}
.call_info .call {
    font-weight: bold;
    font-size: 1.1em;
    margin-bottom: 5px;
    color: #757575;
}
.call_bank ul li {
    font-size: .79em;
    margin: 2px 0;
    text-indent: 5px;
    letter-spacing: .4px;
}
.bank_info h2 {
    font-family: pt sans,sans-serif;
    font-size: .95em;
    margin: 15px 0;
    font-weight: normal;
    text-indent: 5px;
}

.bank_info .owner {
    font-weight: bold;
    font-size: .75em;
    margin-bottom: 10px;
    color: #757575;
}



        
/*==============================
TOP FLIP BANNER CSS START
==============================*/

#SMS_flipBannerContainer{
width: 100%;
position: relative;
line-height:0px;
background:#333;
}

#SMS_flipBannerContainer img{
width:100%;
}

#SMS_flipBannerContainer .origin{
opacity:0;
}

#SMS_flipBanner{

}


#SMS_flipBanner .SMSFlipper .front,#SMS_flipBanner .SMSFlipper .back{
width: 100%;
height: 100%;
-o-transition: all .5s;
-ms-transition: all .5s;
-moz-transition: all .5s;
-webkit-transition: all .5s;
transition: all .5s;
-webkit-backface-visibility: hidden;
-ms-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
position: absolute;
top: 0px;
left: 0px;
}

#SMS_flipBanner .SMSFlipper .front{
z-index: 2;
}

#SMS_flipBanner .SMSFlipper .back{
z-index: 1;
-webkit-transform: rotateX(-180deg);
-ms-transform: rotateX(-180deg);
-moz-transform: rotateX(-180deg);  
transform: rotateX(-180deg);  
}


@-webkit-keyframes animationFrontBanner{
0% {
z-index: 2;
-webkit-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
transform: rotateX(0deg);
}
40% {
z-index: 2;
-webkit-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
transform: rotateX(0deg);
}

50%{
z-index: 1;
-webkit-transform: rotateX(-180deg);
-ms-transform: rotateX(-180deg);
-moz-transform: rotateX(-180deg);
transform: rotateX(-180deg);
}

90%{
z-index: 2;
-webkit-transform: rotateX(-180deg);
-ms-transform: rotateX(-180deg);
-moz-transform: rotateX(-180deg);
transform: rotateX(-180deg);
}
100%{
z-index: 2;
-webkit-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
transform: rotateX(0deg);
}
}

.animationFrontBanner {
display:inline-block;
-webkit-animation:animationFrontBanner 7s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: ease-in-out;
}



@-webkit-keyframes animationBackBanner{
0% {
z-index: 2;
-webkit-transform: rotateX(-180deg);
-ms-transform: rotateX(-180deg);
-moz-transform: rotateX(-180deg);
transform: rotateX(-180deg);
}
40% {
z-index: 2;
-webkit-transform: rotateX(-180deg);
-ms-transform: rotateX(-180deg);
-moz-transform: rotateX(-180deg);
transform: rotateX(-180deg);
}

50%{
z-index: 1;
-webkit-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
transform: rotateX(0deg);
}

90%{
z-index: 2;
-webkit-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
transform: rotateX(0deg);
}
100%{
z-index: 2;
-webkit-transform: rotateX(-180deg);
-ms-transform: rotateX(-180deg);
-moz-transform: rotateX(-180deg);
transform: rotateX(-180deg);
}
}

.animationBackBanner {
display:inline-block;
-webkit-animation:animationBackBanner 7s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: ease-in-out;
}

/* 탑버튼 */

 #back-top {
  position: fixed;
   bottom: 0px;
   right: 0px;
   cursor:pointer;
   height:75px;
   display:none;
   z-index:10000000;
  }

.tails { border:1px solid #e0e0e0;	}
.tailwrite {height:145px; background-color:#f8f8f8;text-align:center;padding-top:10px;vertical-align:top;	}
.tailt { padding-bottom:2px;height:25px;	}
.tailt:after{content:".";clear:both;display:block;height:0;visibility:hidden;}
.tailt .icons { float:left;display:inline;width:0px;height:20px;	}
.tailt .icons span { display:inline-block;	}
.tailt .namesd { float:left;display:inline;padding:4px 0 4px 1px;	}

.taillist { padding:10px 10px 0 10px;	}
.tlist_top { width:100%;border-bottom:1px solid #e6e6e6;	}
.tlist { width:100%;padding-top:10px;}
.tlist:after{content:".";clear:both;display:block;height:0;visibility:hidden;}
.tlist .writers { float:left;display:inline;width:120px;padding-top:10px; margin-left:5px;}
.tlist .writers img { vertical-align:middle;	}
.tlist .memos {	  float:left;display:inline;padding:15px;width:380px;}
.tlist .others { float:right;display:inline;text-align:right; width:100px; margin-right:10px;}
.tlist .others a { font-size:11px;	}

.subicons { position:absolute;display:none;top:22px;left:0px;	}
.subicons ul li {	border:1px solid #cbcbcb;background-color:#FFFFFF;	}
.subiconsr { position:absolute;display:none;top:22px;left:0px;z-index:1000;	}
.subiconsr ul li {	border:1px solid #cbcbcb;background-color:#FFFFFF;	}

.btns { margin-top:10px;	}
.searchbbs	{	height:20px;	}
.searchbbs input {	vertical-align:top;	}

.board_list_button{text-align:right;padding-top:20px;}
.board_button{width:150px;padding:4px;background:#FFF;border:1px solid #000;text-align:center;font-size:11px;letter-spacing:2px;display:inline-block;}

 #paging{clear:both;padding-top:30px;text-align:center;}
 #paging p{zoom:1;display:inline-block;*display:inline;_display:inline;margin:10px;font-size:10px;letter-spacing:2px;font-family:Times New Roman;}
 #paging ol{zoom:1;display:inline-block;*display:inline;_display:inline;margin:0 15px 0 15px;}
 #paging li{zoom:1;display:inline-block;*display:inline;_display:inline;font-size:12px;margin:5px;}
 #paging li a:link,#paging li a:visited{color:#878787;}
 #paging li a.this{color:#000;font-weight:bold;}


/* 탑버튼 */

 #back-top {
  position: fixed;
   bottom: 0px;
   right: 0px;
   cursor:pointer;
   height:75px;
   display:none;
   z-index:10000000;
  }




  #ins {clear:both;text-align:left;}
  #ins .insta_box {font-size:0;line-height:0;padding:10px 10px 10px ;background:#f7f7f7;border-top:1px solid #ddd;}
  #ins .insta_box .insta {margin:0 0 2px 0; }
  #ins .insta_box .insta img {  width:100px;}
  #ins  .insta_box .insta:after{content:"";display:block;clear:both;}
  #ins .insta_box .insta_img {border:1px solid #eee;padding:6px 0px 4px 3px; background:#fff; text-align: center;}




.colorchip_wrap {float: right; position: relative; left: -50%;  text-align: left;}
.colorchip_wrap p {position: relative; left: 50%;  float:left; margin-left:1px; border: 1px solid #ddd;}
.colorchip { width:3px; height:7px;  float:left; background-color: var(--chip); }

[x-cloak] {
    display: none !important;
}

/* from _common/header.htm */
#menuline {
clear: both;
border-top: 1px solid #dcdcdc;
width: 100%;
margin: 0 auto;
}
#membericon {
clear: both;
width: 100%;
margin: 0;
font-family: "Malgun Gothic",맑은 고딕,AppleGothic,돋움,Dotum;
font-size: 11px;
}
#membericon li {
float: left;
width: 25%;
vertical-align: middle;
text-align: center;
}
#membericon1 {
font-family: "돋움", Dotum, AppleGothic, sans-serif; 
color: #000;
border-right: 1px solid #e3e3e3;
padding: 15px 0 12px 0;
}
#membericon2 {
font-family: "돋움", Dotum, AppleGothic, sans-serif; 
color: #000;
padding: 15px 0 12px 0;
}
.tab a {
float: left;
width: 100%;
padding: 10px 0;
font-size: 13px;
font-weight: bold;
font-family: 'Roboto',sans-serif;
color: #000;
text-align: center;
border-bottom: 1px solid #e3e3e3;
background-color: #FFF;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-sizing: border-box;
-o-sizing: border-box;
box-sizing: border-box;
border-bottom: 1px solid #dcdcdc;
}
.tab1 a {
float: left;
width: 100%;
padding: 10px 0;
font-size: 13px;
font-weight: bold;
font-family: 'Roboto',sans-serif;
color: #000;
text-align: center;
background-color: #FFF;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-sizing: border-box;
-o-sizing: border-box;
box-sizing: border-box;
}

.main-pop__img { margin:0; }
.main-pop__img img { display:block; width:100%; }
.main-pop__bar { display:flex; justify-content:space-between; align-items:center; box-sizing:border-box; height:25px; padding:0 10px; background:#000; font-size:12px; line-height:1; }
.main-pop__bar a { color:#fff; text-decoration:none; }

/* ── 공통 다이얼로그 / 토스트 (notify.js: confirmDialog/alertDialog/toast → SweetAlert2) ──
   ui-swal / ui-toast 데코 — 바이크셀링 모바일 (검정) 톤. 계약 클래스는 notify.js SWAL_CLASS/TOAST_CLASS.
   메인 레이어 팝업(.main-pop, z-index 5000000)보다 위에 뜨도록 컨테이너를 올린다 */
.ui-swal-container { z-index: 2147483647 !important; }
.ui-swal {
    width: 360px !important;
    max-width: calc(100% - 32px);
    border: 1px solid #d5d5d5;
    border-radius: 3px !important;
    padding: 24px 20px 20px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
    font-family: "돋움", Dotum, AppleGothic, sans-serif;
}
.ui-swal__title {
    font-size: 15px !important;
    font-weight: bold !important;
    color: #2e2e2e !important;
    padding: 4px 0 0 !important;
}
.ui-swal__text {
    font-size: 13px !important;
    color: #555 !important;
    line-height: 1.6 !important;
    margin-top: 10px !important;
    white-space: pre-line !important; /* confirm 문구 \n 줄바꿈 렌더 */
}
.ui-swal__actions { margin-top: 20px !important; gap: 6px; }
.ui-swal__btn {
    display: inline-block;
    min-width: 80px;
    height: 36px;
    padding: 0 16px;
    font-family: "돋움", Dotum, AppleGothic, sans-serif;
    font-size: 13px;
    font-weight: bold;
    line-height: 34px;
    white-space: nowrap;
    border: 1px solid transparent;
    border-radius: 3px;
    cursor: pointer;
}
.ui-swal__btn--primary { background: #000; border-color: #000; color: #fff; }
.ui-swal__btn--primary:hover { background: #333; border-color: #333; }
.ui-swal__btn--ghost { background: #fff; border-color: #ccc; color: #333; }
.ui-swal__btn--ghost:hover { border-color: #333; }
.ui-swal .swal2-icon { transform: scale(.6); margin: -10px auto -6px !important; }
.ui-swal .swal2-icon,
.ui-swal .swal2-icon * { animation: none !important; }
.ui-swal.swal2-show { animation: ui-swal-pop .12s ease-out !important; }
.ui-swal.swal2-hide { animation: ui-swal-fade .1s ease-in forwards !important; }
@keyframes ui-swal-pop { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: none; } }
@keyframes ui-swal-fade { to { opacity: 0; } }
.ui-swal .swal2-icon.swal2-question,
.ui-swal .swal2-icon.swal2-info { border-color: #999; color: #757575; }
.ui-swal .swal2-icon.swal2-success { border-color: transparent; color: #000; }
.ui-swal .swal2-icon.swal2-success .swal2-success-ring { border-color: #000; }
.ui-swal .swal2-icon.swal2-success [class^='swal2-success-line'] { background-color: #000; }
.ui-swal .swal2-icon.swal2-error { border-color: #c4122f; color: #c4122f; }
.ui-swal .swal2-icon.swal2-error [class^='swal2-x-mark-line'] { background-color: #c4122f; }
.ui-swal .swal2-icon.swal2-warning { border-color: #e67e22; color: #e67e22; }

/* Toast — 하단 다크 카드 */
.ui-toast {
    border-radius: 3px !important;
    background: #2e2e2e !important;
    color: #fff !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25) !important;
    padding: 10px 18px !important;
    margin-bottom: 24px !important;
}
.ui-toast__title { font-family: "돋움", Dotum, AppleGothic, sans-serif; font-size: 13px !important; color: #fff !important; font-weight: bold; }
.ui-toast__btn { background: transparent !important; border: 0 !important; box-shadow: none !important; margin: 0 0 0 10px !important; padding: 0 !important; font-family: "돋움", Dotum, AppleGothic, sans-serif; font-size: 13px; font-weight: bold; color: #fff !important; text-decoration: underline; cursor: pointer; }
.ui-toast .swal2-icon,
.ui-toast .swal2-icon * { animation: none !important; }
.ui-toast .swal2-icon {
    transform: scale(.5);
    transform-origin: center center;
    margin: -18px -4px -18px -12px !important;
    flex-shrink: 0;
}
.ui-toast .swal2-icon.swal2-success .swal2-success-ring { border-color: rgba(255, 255, 255, .4); }
.ui-toast .swal2-icon.swal2-success [class^='swal2-success-line'] { background-color: #fff; }
.ui-toast .swal2-icon.swal2-success [class^='swal2-success-circular-line'],
.ui-toast .swal2-icon.swal2-success .swal2-success-fix { background: transparent !important; }
.ui-toast__bar { background: rgba(255, 255, 255, .35) !important; }
/* hidden 속성이 li/div display 규칙에 덮이지 않게 — user-state.js 의 data-user-login/anon 토글 */
[hidden] { display: none !important; }
