/* BASIC css start */
/* 퀵메뉴 */
.quick_menu { position: fixed; z-index: 900; bottom: 23px; right: 8px; padding-top: 40px; display: grid; gap: 10px; transition: bottom .3s linear; }
.quick_menu .cs_btn { position: relative; background: #000; width: 38px; height: 38px; border-radius: 38px; box-sizing: border-box; margin-bottom: 10px; cursor: pointer; color: #fff; }
.quick_menu .cs_btn img { width: 30px; height: 30px; padding: 4px; }
.quick_menu .top_btn a { position: relative; display: block; width: 38px; height: 38px; background: rgba(0, 0, 0, .6); cursor: pointer; }
.quick_menu .top_btn a { border-radius: 38px; }
.quick_menu .top_btn a:after { content: ""; display: block; width: 7px; height: 7px; position: absolute; top: 45%; left: 38%; transform: rotate(-135deg); border-bottom: 1px solid #fff; border-right: 1px solid #fff; transition: 0.4s;  }
.quick_menu .bottom_btn a { position: relative; display: none; width: 38px; height: 38px; background: rgba(0, 0, 0, .6); cursor: pointer; }
.quick_menu .bottom_btn a { border-radius: 0 0 40px 40px; }
.quick_menu .bottom_btn a:after { content: ""; display: block; width: 7px; height: 7px; position: absolute; top: 20%; left: 38%; transform: rotate(45deg); border-bottom: 1px solid #fff; border-right: 1px solid #fff; transition: 0.4s; }
.quick_Back { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; background: rgba(0,0,0,0.65); visibility: hidden; transition: opacity 0.3s ease; opacity: 0; }
.quick_Back.active { position: fixed; z-index: 901; opacity: 1; visibility: visible; }


/* 채널톡 */
.my-channel-btn { position: relative; width: 38px; height: 38px; padding: 0; border: none; background-color: transparent; cursor: pointer; }
.my-channel-btn__icon { width: 100%; pointer-events: none; }
.my-channel-btn__badge { position: absolute; top: 0; right: 0; min-width: 17px; height: 17px; border-radius: 9px; background-color: #ff3b30; color: #fff; font-size: 9px; line-height: 17px; text-align: center; display: none; }


/* 인센토 */
.incento_btn { display: block; position: absolute; top: -10px; right: 0; width: 80px; height: 40px; z-index: 902; }
.incento_btn .incento_img { position: absolute; bottom: 0; right: 0; display: block; }
.incento_btn .incento_img.is-main { width: 0; height: 0; opacity: 0; z-index: 2; }
.incento_btn .incento_img.is-sub { width: 38px; height: 38px; opacity: 1; z-index: 1; }
html.is-main-page .incento_btn .incento_img.is-main { width: 100%; height: 100%; opacity: 1; }
html.is-main-page .incento_btn .incento_img.is-sub { opacity: 0; }
.incento_btn.is-animate .incento_img { transition: width 0.6s ease, height 0.6s ease, opacity 0.6s ease; }
html.is-main-page .incento_btn.is-changed .incento_img.is-main { width: 0; height: 0; opacity: 0; }
html.is-main-page .incento_btn.is-changed .incento_img.is-sub { opacity: 1; }
/* BASIC css end */