#xt_sticker_shop_wrap{background:#eee; padding:20px; position:relative; overflow:hidden;} #xt_sticker_shop_wrap .common{border:1px solid #ddd; padding:20px; min-height:50px;background:#fff;} /* 상단 */ #xt_sticker_shop_wrap .shop_top{margin-bottom:18px; position:relative; overflow:hidden;} #xt_sticker_shop_wrap .shop_top .title_img{position:absolute; top:12px;} #xt_sticker_shop_wrap .shop_top .xt_subsect{font-size:20px; margin-left:40px; font-weight:bold; color:#333;} #xt_sticker_shop_wrap .shop_top .xt_admin_btn{position:absolute; right:15px; font-size:16px; font-weight:bold; color:#333;} #xt_sticker_shop_wrap .shop_top .xt_admin_btn i{margin-left:5px;} #xt_sticker_shop_wrap .shop_top .xt_explain{display:block; margin:5px 0; margin-left:15px;font-size:13px; color:#777;} #xt_sticker_shop_wrap .shop_top .xt_explain_detail{margin-top:10px; padding:5px; border:1px solid #ddd; background:#f9f9f9; max-width:370px;} #xt_sticker_shop_wrap .shop_top .per{min-width:40px; display:inline-block; text-align:center;} #xt_sticker_shop_wrap .shop_top .type{min-width:17px; display:inline-block; text-align:right;} #xt_sticker_shop_wrap .rank_box {border: 1px solid #eee; position:absolute; width:180px; border-radius:3px; left:530px; top:70px;} #xt_sticker_shop_wrap .rank_title{ margin:0px; padding:0px; text-align:center; padding:10px 12px; border-bottom:1px solid #eee; background: #fafafa; font-size:12px;} #xt_sticker_shop_wrap .rank_box .rank_type{position:absolute; top:22px; left:24px; font-weight:bold; color:#222; font-size:12px;} #xt_sticker_shop_wrap .rank_box ul{ position:relative; list-style:none; margin:0; white-space:nowrap; padding:0; } #xt_sticker_shop_wrap .rank_box li{position:relative; margin:0px; height:60px; margin:10px;} #xt_sticker_shop_wrap .rank_box .rank_name{color:#555; position: absolute;font-size: 15px; bottom:3px;} #xt_sticker_shop_wrap .rank_box .rank_name img:nth-child(1){display:none;} #xt_sticker_shop_wrap .rank_box .rank_name img:nth-child(2){display:none;} #sticker_shop_point{color:#333;} /* 내용 */ #xt_sticker_shop_wrap .shop_content{margin-bottom:20px;} #xt_sticker_shop_wrap .shop_content .xt_profile_wrap{margin:0 15px; float:left; display:inline-block; min-height:150px; min-width:120px;} #xt_sticker_shop_wrap .shop_content .xt_profile_wrap .profile_img{height:80px; border-radius:50%; margin-bottom:5px; border:2px solid #ddd;} #xt_sticker_shop_wrap .shop_content .xt_profile_wrap .nick{text-decoration:none; color:#222; display:block; margin-bottom:5px; padding:4px 0;} #xt_sticker_shop_wrap .shop_content .xt_profile_wrap .etc{display:inline-block; margin:2px 0; margin-right:5px; padding:4px 7px; font-weight:bold; border-radius:3px;} #xt_sticker_shop_wrap .shop_content .xt_shop_wrap{display:inline-block;} #xt_sticker_shop_wrap .shop_content .xt_shop_wrap .shop{width:140px; transition:0.4s; border-radius:5px; min-height:150px; vertical-align:bottom; text-align:center; margin:10px; background:#eee; padding:10px; display:inline-block; border:1px solid #ddd;} #xt_sticker_shop_wrap .shop_content .xt_shop_wrap .shop:hover{box-shadow:0px 0px 3px #bbb;} #xt_sticker_shop_wrap .shop_content .xt_shop_wrap .shop span{display:block; margin:10px 0;} #xt_sticker_shop_wrap .shop_content .xt_shop_wrap .shop .xt_sbject{font-size:14px; word-spacing:3px; font-weight:700; margin-bottom:20px;} #xt_sticker_shop_wrap .shop_content .xt_shop_wrap .shop .xt_send{display:inline-block; vertical-align:bottom; height:20px; width:65px; margin-right:5px; border:1px solid #bbb; border-radius:3px; background:#fafafa; color:#000; padding:5px;} #xt_sticker_shop_wrap .shop_content .xt_shop_wrap .shop .xt_send_btn{display:inline-block; transition:0.4s; cursor:pointer; background:#333; box-shadow:1px 1px 1px #aaa; color:#fff; padding:9px; border-radius:3px; } #xt_sticker_shop_wrap .shop_content .xt_shop_wrap .shop .xt_send_btn:hover{background:#555;} /* 하단 */ #xt_sticker_shop_wrap .shop_bottom{} #xt_sticker_shop_wrap .shop_bottom .user_list{position:relative; margin:0px; background:white; border-collapse:collapse; width:100%; border:1px solid #eee;} #xt_sticker_shop_wrap .shop_bottom .user_list th{padding:10px 0px; text-align:center; border-right:1px solid #f4f4f4; background:#f8f8f8; color:#555; background:linear-gradient(to bottom,#FFF 0%,#F6F6F6 100%); background:-webkit-gradient(linear,0% 0%,0% 100%,from(#FFF),to(#F6F6F6));} #xt_sticker_shop_wrap .shop_bottom .user_list td{padding:8px 0px; border-right:1px solid #f4f4f4; text-align:center;} #xt_sticker_shop_wrap .shop_bottom .user_list td a{color:#000; text-decoration:none;} #xt_sticker_shop_wrap .shop_bottom .user_list tbody tr{transition:0.2s;} #xt_sticker_shop_wrap .shop_bottom .user_list tbody tr:nth-child(even){background:#f9f9f9;} #xt_sticker_shop_wrap .shop_bottom .user_list tbody tr:hover{background:lavender;} /* 페이지 */ #xt_sticker_shop_wrap .shop_bottom .page_navi{position:relative; width:100%; height:35px; line-height:35px; margin:10px 0px; text-align:center; } #xt_sticker_shop_wrap .shop_bottom .page_navi a{text-decoration:none; color:#222; margin:0px; padding:5px 8px; background:white; border:1px solid #eee; border-radius:3px; transition:0.2s;} #xt_sticker_shop_wrap .shop_bottom .page_navi a:hover{background:yellowgreen; color:white;} #xt_sticker_shop_wrap .shop_bottom .page_navi .page_seleted{background:yellowgreen; color:white;} /***********************************************/ /** 태블릿이하 **/ /***********************************************/ @media all and (max-width:820px){ /* 기본 */ #xt_sticker_shop_wrap .tb_hidden{display:none!important;} #xt_sticker_shop_wrap .shop_bg_img{display:none;} #xt_sticker_shop_wrap .shop_top .xt_explain_detail{width:95%;} #xt_sticker_shop_wrap .shop_content .xt_profile_wrap{min-height:110px;} #xt_sticker_shop_wrap .shop_content .xt_profile_wrap .profile_info{float:right; margin-left:15px;} } /***********************************************/ /** 모바일이하 **/ /***********************************************/ @media all and (max-width:480px){ #xt_sticker_shop_wrap .mb_hidden{display:none!important;} #xt_sticker_shop_wrap{padding:5px;} #xt_sticker_shop_wrap .common{padding:10px;} #xt_sticker_shop_wrap .shop_top .xt_explain{font-size:12px; margin-left:5px;} #xt_sticker_shop_wrap .shop_content .xt_profile_wrap{margin:0; margin-left:10px; min-height:90px;} #xt_sticker_shop_wrap .shop_content .xt_shop_wrap .shop{width:85%;} }