/* A타입 */ .dabory-quick-A { position: fixed !important; top: 0 !important; right: 0 !important; height: 100vh !important; border-left: 1px solid #ddd !important; background-color: #fff !important; margin: 0 !important; padding: 0 !important; font-size: 14px !important; color: #333 !important; line-height: 150% !important; font-weight: 300 !important; z-index: 9999 !important; } .dabory-quick-A ul { height: 100% !important; margin: 0 !important; padding: 0 !important; font-size: 14px !important; line-height: 150% !important; font-weight: 300 !important; } .dabory-quick-A ul > li { width: 100px !important; height: 10% !important; list-style: none !important; transition: 0.5s ease-in-out !important; } .dabory-quick-A ul > li > a, .dabory-quick-A ul > li > button { background-color: unset !important; display: flex !important; flex-wrap: wrap !important; flex-direction: column !important; justify-content: center !important; align-items: center !important; width: 100% !important; height: 100% !important; text-align: center !important; } .dabory-quick-A ul > li .txt { padding-top: 10px !important; line-height: 100% !important; font-size: 12px !important; color: #333 !important; } .dabory-quick-A ul > li.act .txt, .dabory-quick-A ul > li.active .txt, .dabory-quick-A ul > li.act .txt, .dabory-quick-A ul > li:hover .txt { color: #22a1ff !important; } .dabory-quick-A ul > li .ico.ico-bottom { background-image: url(image/r_quick_ico1.png) !important; width: 24px !important; height: 24px !important; transform: rotate( 180deg ) !important; } .dabory-quick-A ul > li img { width: 24px !important; height: 24px !important; } .dabory-quick-A ul > li .ico.ico-top { background-image: url(image/r_quick_ico1.png) !important; width: 24px !important; height: 24px !important; } /* B타입 */ .dabory-quick-B { position: fixed !important; right: 30px !important; top: 50% !important; transform: translate(0, -50%) !important; z-index: 9999 !important; background-color: #fff !important; padding: 7px 7px !important; border-radius: 40px !important; border: 1px solid #e1e1e1 !important; } .dabory-quick-B li { text-align: center !important; border-bottom: 1px solid #d3d3d3 !important; } .dabory-quick-B li > button { background-color: unset !important; display: block !important; padding: 15px 0 !important; margin: auto !important; } .dabory-quick-B ul > li .ico.ico-bottom { display: flex !important; align-items: center !important; margin: auto !important; background-image: url(image/r_quick_ico1.png) !important; width: 24px !important; height: 24px !important; transform: rotate( 180deg ) !important; } .dabory-quick-B ul > li img { display: flex !important; align-items: center !important; margin: auto !important; width: 24px !important; height: 24px !important; } .dabory-quick-B ul > li .ico.ico-top { display: flex !important; align-items: center !important; margin: auto !important; background-image: url(image/r_quick_ico1.png) !important; width: 24px !important; height: 24px !important; } .dabory-quick-B > ul > li:last-child { border-bottom: 0 !important; } .dabory-quick-B > ul > li .txt { padding-top: 10px !important; line-height: 100% !important; font-size: 12px !important; color: #333 !important; } .dabory-quick-B > ul > li.act .txt, .dabory-quick-B > ul > li.active .txt, .dabory-quick-B > ul > li.act .txt, .dabory-quick-B > ul > li:hover .txt { color: #22a1ff !important; } .dabory-quick-B > ul > li button[data-widget="coupon"] .txt {color: #e17070 !important;} @media only screen and (max-width:991px){ .dabory-quick-B {right: 0!important; left: 0; top: auto!important; bottom: 0; transform: translate(0, 0) !important; border: none!important; border-top: 1px solid #e1e1e1!important; border-radius: 0!important; padding: 0px 7px!important; box-shadow: 0px -1px 8px rgba(0, 0, 0, 0.1);} .dabory-quick-B ul {display:flex;} .dabory-quick-B li {flex:auto; border-bottom:none!important;} .dabory-quick-B li:first-of-type {display:none;} .dabory-quick-B li:last-of-type {position:absolute; top:-60px; right:0;} .dabory-quick-B ul > li .ico.ico-bottom, .dabory-quick-B ul > li .ico.ico-top {width: 40px!important; height: 40px!important; background-color: #1c2f5e; border-radius: 50px; background-repeat: no-repeat; background-position: center; background-image: url(image/r_quick_ico1_mob.png) !important;} .dabory-quick-B ul > li img {width:20px!important; height:20px!important;} }