*{box-sizing: border-box}
/*::-webkit-scrollbar{display: none;}*/
html, body{width:100%; padding : 0; margin : 0 auto; font-size : 14px; word-break:keep-all; color:#000; letter-spacing:-0.1px; -ms-overflow-style: none;}
ul, li{list-style:none; padding: 0; margin: 0}
ul:after{content:""; clear:both; display:block;}
a{display:inline-block; text-decoration:none; color: #000}
a:focus{color:inherit; text-decoration:none;}
a:hover{color:inherit; text-decoration:none;}
a:link{color:inherit; text-decoration:none;}

input {border:0; color:#000!important; font-weight:bold; background-color:#fff; appearance: none; -webkit-appearance:none; border:0; border-radius:0; padding:0; margin:0; line-height:1.5; width:100%; min-width:200px; max-width:100%; text-indent:5px;}
input:focus{outline : none;}
input::placeholder{color : #aeb5ba; font-weight:normal; }
/* table */
th, tr{text-align : center; }
.table th, .table thead th, .table td, table th{border-bottom : 0px; border-top : 0px;}
.table tbody tr td:first-child{border-top-left-radius : 10px; border-bottom-left-radius : 10px;}
.table tbody tr td:last-child{border-top-right-radius : 10px; border-bottom-right-radius : 10px;}
table tr td{color:#5d5d5d;}
.table th{padding:0 0 1.5rem 0; font-weight:normal;}

select{width:100%; height:100%; box-sizing:border-box; margin:0; background: url('../business/images/UI/btnexpand_idle.png') no-repeat; background-position: right center; background-size: 45px auto; appearance: none; -webkit-appearance:none; border:0; border-radius:0; text-indent:10px; outline:none;}
select:focus{ outline:none;}
@media (max-width: 430px){
    select{background-size: 30px auto}
}

textarea{appearance: none; -webkit-appearance:none; outline:none; font-weight:bold; padding:7px 12px; border:1px solid #bfbfbf; color:#000; line-height:1.5;}
textarea:focus{outline:none;}
textarea::placeholder{color : #aeb5ba; font-weight:normal; }
p{margin: 0}
button:focus{outline: none}
button, a, select{cursor: pointer}

.align-center{align-self: center}
.break-all{word-break: break-all}


.main_header{max-width: 430px; margin: 0 auto; padding: 15px 10px; height: 100%; display: flex; justify-content: space-between;}
.main_header .left{width: 60%; align-self: center}
.main_header .left img{width: 100%; max-width: 230px; max-height: 45px}
.main_header .right{width: 40%; height: 100%; text-align: right;}
.main_header .right .header_user_img{width: 40px; height: 40px; border-radius: 50%; position: relative; top: 50%; transform: translateY(-50%); display: inline-block;}
.main_header .right img{width: 100%; height: auto; min-width: 40px; min-height: 40px; max-width:40px; max-height: 40px;}

.content{max-width: 430px; margin: 0 auto; padding-bottom: 100px}
.content .main_bg{width: 100%; max-height: 240px;}

.main_menu{padding: 0 30px; position: relative; top: -35px}
.main_menu .division_line span{display: block; position: absolute;  background-color: rgb(233,233,233)}
.main_menu .division_line .line1{width: calc(100% - 60px); height: 1px; top: 50%; left: 50%; transform: translate(-50% , -50%)}
.main_menu .division_line .line2{height: 100%; width: 1px; top: 0; left: calc(33.333% + 10px);}
.main_menu .division_line .line3{height: 100%; width: 1px; top: 0; right: calc(33.333% + 10px);}

.main_menu ul{width: 100%; display: flex; flex-wrap: wrap; border-radius: 10px; overflow: hidden; box-shadow: 0 3px 6px rgba(0,0,0,0.15); background-color: #ffffff}
.main_menu ul li{width: 33.333%;}
.main_menu ul li a{width: 100%; padding: 10px;}
.main_menu ul li a img{height: 30px; width: auto}
.main_menu ul li a .menu_name{font-size: 13px; font-weight: bold; margin-top: 10px}
.main_menu ul li a .menu_count{font-size: 13px; color: rgb(174, 181, 186);}

.extra_service{padding: 0 30px}
.extra_service h3{font-size: 13px; font-weight: bold; margin-bottom: 20px;}
.extra_service ul{width: 100%;}
.extra_service ul li{border: 1px solid rgb(174, 181, 186); border-radius: 10px;  width: 100%;}  /*margin-bottom: 20px;*/
.extra_service ul li a{display: flex;  padding: 10px 20px;}
.extra_service ul li a .left{width: 20%; min-width: 75px; margin-right: 15px; align-self: center;}
.extra_service ul li a .left img{border-radius: 20px}
.extra_service ul li a .right{width: 80%; padding: 8px}
.extra_service ul li a .right .service_name{font-size: 14px; font-weight: bold}
.extra_service ul li a .right .service_txt{word-break: break-all; width:100%; font-size: 12px; line-height: 1.5; height: 40px; display: -webkit-box; padding: 2.5px; overflow: hidden; white-space: normal; text-overflow: ellipsis; -webkit-box-orient: vertical;-webkit-line-clamp: 2;}

.extra_service .service_icon{display: flex; flex-wrap: wrap;}
.extra_service .service_icon > li{width: calc(33.333% - 4px);  min-height: 95px; border: 0; margin-right: 5px; margin-bottom: 5px}
.extra_service .service_icon > li:nth-of-type(3n){margin-right: 0}
.extra_service .service_icon > li a{position: relative; width: 100%; height: 100%; display: inline-block; word-break: break-all;  padding: 0px 5px; border-radius: 5px; border: 2px solid rgb(233,233,233);}
/*.extra_service .service_icon > li a img{position: absolute; right: 15px; bottom: 15px; height: 20px; min-width: 18px} */

.footer_menu{width: 100%; height: 130px; position: fixed; left: 0; bottom: 0; background: url(../business/images/footer_menu_bg.png) no-repeat top center; background-size: cover; z-index: 102;}
.footer_menu ul{width: 430px; padding: 0 30px; height: 55px; position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%);  display: flex; justify-content: space-between;}
.footer_menu ul li{width: 20%; margin: 0 5px; text-align: center;}
.footer_menu ul li a{width: 100%; height: 100%; padding: 5px}
.footer_menu ul li a img{height: 30px}
.footer_menu ul li a span{display: block; font-size: 12px; font-weight: bold; line-height: 10px; margin-top: 3px}

.footer_menu ul  .footer_camera > div{width: 60px; height: 60px; border-radius: 50%; background-color: #ffffff; box-shadow: 0 0 20px rgba(0,0,0,0.07); top: -15px; cursor: pointer}
.footer_menu ul  .footer_camera > div > div{background-color: #6B60D8; border-radius: 50%; width: 45px; height: 45px;}
.footer_menu ul  .footer_camera > div > div img{width: auto; height: 50%}

.main_popup{width: 300px; border-radius: 30px; padding: 0 15px; text-align: center}
.main_popup img{width: 35%; margin: 45px auto 20px}
.main_popup p{margin-bottom: 10px; font-size: 15px}
.main_popup .btn{width: 80%; height: 50px; background-color: #8774f0; line-height: 2.5; font-size: 15px; color: #fff; box-shadow: none; border: 0; margin-bottom: 30px}



/*footer menu*/
.fl-wrapper {position: fixed; left: 50%; transform: translateX(-50%); bottom: -300%; width: 700px; height: 700px;
    background: transparent; z-index: 98; transition: all ease 0.4s; box-sizing: border-box;
}
.fl-wrapper_active {bottom: -475px; transition: all ease 0.4s;}
.fl-bg { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%; height: 100%; background: #8774f0;
    opacity: 1; border-radius: 50%; box-sizing: border-box; z-index: 99;
}
.fl-inner {position: relative; list-style: none; width: 48%; height: 50%; padding: 0; overflow: hidden; z-index: 100; text-align: center; margin: 0 auto}
.fl-inner img{width: 70%}
.fl-inner > li{position: absolute; width: 25%; max-width: 100px; height: 100%; font-weight: bold; color: #fff; text-align: center; bottom: -50%; left: 50%; padding: 0 10px; transform: translateX(-50%);}
.fl-inner_active > li{transition: all ease 0.5s;}
.fl-inner_active > li:nth-child(1){padding-top: 18%; left: 0; bottom: 0; transform: none}
.fl-inner_active > li:nth-child(2){padding-top: 8%; left: 25%; bottom: 0; transform: none}
.fl-inner_active > li:nth-child(3){padding-top: 8%; left: 50%; bottom: 0; transform: none}
.fl-inner_active > li:nth-child(4){padding-top: 18%; left: 75%; bottom: 0; transform: none}
.fl-inner_active > li span{margin-top: 7px; display: inline-block; font-size: 13px; color: #ffffff}

/*MY 정보*/
.content.my_info{padding: 30px}
.my_info_user{display: flex;}
.my_info_user .user_img{width: 56px; position: relative; margin-right: 10px}
.my_info_user .user_img > div{position: relative; width: 56px; height: 56px; border-radius: 50%; overflow: hidden;}
.my_info_user .user_img > div > img{min-width: 56px; min-height: 56px;}
.my_info_user .user_img .change_img_btn{position: absolute; left: 35px; bottom: 0px; width: 27px; height: 27px; border-radius: 50%; overflow: hidden; padding: 3px 6px; background-color: #8774f0; border: 0}

.my_info_user .user_info{width: 100%; padding: 8px;}
.my_info_user .user_info .name{font-size: 17px; font-weight: bold;}
.my_info_user .user_info .name span{color: rgb(181,181,181); font-size: 11px; margin-left: 5px}
.my_info_user .user_info .company{color: rgb(181,181,181); font-size: 11px;}


.point{display: flex;  margin: 20px 0; justify-content: space-between; width: 100%; background-color: #ffffff; border: 1px solid rgb(157,165,185); padding: 15px 20px; border-radius: 10px}
.point p{font-size: 15px;}
.point div{display: flex}
.point div p{font-size: 1rem; text-align: right;  font-weight: bold}
.point div p span{color: rgb(239,113,113);}
.point div img{height: 15px; margin-left: 20px}

.sub_title{width: 100%; font-size: 13px; background-color: rgb(239,242,246); border-radius: 10px; padding: 10px; text-align: center}
.team_input{display: flex; margin-top: 32px;}
.team_input h4{background-color: rgb(249,250,252); border-radius: 10px; text-align: center; margin-right: 10px; font-size: 15px; height: 60px; line-height: 60px; width: 105px}
.team_input select{border-bottom: 1px solid rgba(0,0,0,0.4); font-weight: normal; height: 60px; padding-right: 5px}
/* 둥근 메뉴 */
.my_info_user .change_btn{width : 100%; font-size: 13px; max-width : 130px; max-height : 50px; min-width : 70px; min-height : 30px; border-radius : 5px; background-color : #48abff; color: #ffffff; position: relative}
.my_info_user .change_btn span{display: inline-block; text-align: center}

.change_btn.roundDiv{min-height: auto; padding: 10px 0}
.change_btn_wrap.round-wrapper{width: auto; align-self: center;}
.change_btn.scale-big{
    transform : scale(1);
    transition : all ease 0.5s; z-index: 110;
    position: fixed;
    left: -40%; top: -80%;
    width:250%; height:250%;
    max-width : 1200px; max-height : 1200px;
    min-width : 750px; min-height : 750px;
    border-radius : 50%;
}

.menu_close{position: absolute; top: 15px; right: -15%;}
.my_info_user .change_btn.scale-big span{display: none}

.roundDiv-align-left{top : 0; left : 0;}
.roundDiv-align-right{top : 0; right : 0;}
.menu-list-wrapper{z-index: 1012; display: none; opacity: 0}
.visible{animation : fadein 2s; display : block; opacity : 1;}
.menu-list{padding-right: 0}
.menu-list li{padding-bottom: 20px; text-decoration: none; list-style: none; cursor: pointer}
.menu-list-head{background-color: transparent; width: 3.75rem; height: 3.75rem; max-width: 60px; max-height: 60px; min-width: 30px; min-height: 30px;}


/*명하상세*/
.card_img{width: 100%; background-color: #eee;text-align: center; padding: 20px;}
.connection_request{margin-top: 10px; padding: 10px 20px; border-bottom: 1px solid rgba(0, 0, 0, 0.12); display: flex}
.user_info{width: 75%;}
.connection_request .name{font-size: 17px; font-weight: bold;}
.connection_request .division{font-size: 14px; font-weight: bold; color: grey;}
.connection_request .company{font-size: 14px; color: grey;}
.connection_request .btn_wrap{width: 25%; align-self: center;}
.connection_request button{width: 100%; border-radius: 5px; background-color: #8774f0; color: #fff; font-weight: bold; padding: 10px; font-size: 13px; border: 0}

.user_detail li{border-bottom: 1px solid rgba(0,0,0,0.12); font-size: 14px}
.user_detail li > div{display: flex; align-items: center; min-height: 50px; height: 0}
.user_detail li .list_title{width: 80px; margin-right: 20px}
.user_detail li .list_info{width: 84%; display: flex; justify-content: space-between}
.user_detail li .list_info span{align-self: center; display: inline-block;}
.user_detail li .button_icon{text-align: right;}
.user_detail li .button_icon button{width: 40px; height: 40px; padding: 10px; border: 0; border-radius: 50%; background-color: transparent}
.user_detail li .button_icon button:hover{background-color: rgba(0, 0, 0, 0.04);}
.user_detail .sns{padding: 20px 0;}
.user_detail .sns button{width: 50px; height: 50px; border-radius: 50%; overflow: hidden; margin-right: 10px; border: 0; padding: 0}
.user_detail .sns button:last-of-type{margin-right: 0}
.user_detail .sns button img{border-radius: 50%;}

.user_detail li > div.lately_written{display: block; margin-top: 20px}
.lately_written .written_list{width: 90%; border: 1px solid rgba(0,0,0,0.12); border-radius: 10px; margin: 20px auto 0; }
.lately_written .written_list > li{padding: 10px; display: flex; justify-content: space-between}
.lately_written .written_list > li:last-of-type{border-bottom: 0;}

.user_detail li > button{border: 0; background-color: transparent; display: flex; width: 100%; justify-content: space-between; min-height: 50px; height: 0; align-items: center; font-size: 15px; font-weight: bold}
.user_detail li > button > img{height: 15px}
.change_info_btn{width: 100%; border: 0; margin-top: 20px; color: #ffffff; background-color: #8774f0; font-size: 15px; padding: 15px 10px; border-radius: 25px; box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2), 0px 4px 5px 0px rgba(0,0,0,0.14), 0px 1px 10px 0px rgba(0,0,0,0.12);}
.content.card_detail{padding-bottom: 30px}


/* 명함촬영팁 */
.shooting_tip{display: flex; justify-content: space-between}
.shooting_tip > div{width: 50%; margin-right: 10px; text-align: center}
.shooting_tip > div img{width: 100%}
.shooting_tip > div:last-of-type{margin-right: 0}
.shooting_tip > div span{margin-top: 5px; display: inline-block;}

.shooting_tip_check{cursor: pointer}
.shooting_tip_check > div{align-self: center}

/*MY 명함*/
.active-underline .uk-tab{padding: 0 25px} /*justify-content: space-between;*/
.active-underline .uk-tab:after{display: none}
.active-underline .uk-tab li{width: auto; background-color: #8d8d8d; padding: 2px 10px; border-radius: 30px; margin-right: 10px}/*/width: 30%;*/
.active-underline .uk-tab li a{color: #fff}
.active-underline .uk-tab > li.uk-active{border-bottom: 0; background-color: #8774f0;}
.active-underline .uk-tab > li.uk-active > a{color: #ffffff}

.search_wrap{border-top: 1px solid #eee; margin-top: 10px; padding: 5px 25px}
@media (max-width: 500px){
    .search_wrap select{background-size: 25px auto;}
}

#menu-title .title_camera_btn{width: 60px; height: 60px; padding: 12px; border: 0; position: absolute; top: 50%; right: 20px; transform: translateY(-50%); background-color: transparent; cursor: pointer}
.mycard_menu{top: 30px;}
.mycard_menu .menu-list li{padding-bottom: 5px}
.mycard_menu .menu_close{right: -12%;}
.menu_bg{width: 20%;  max-width:100px; max-height: 100px; min-width: 10px; min-height: 50px; border-radius: 50%;
    background-color: #816cf5; position: absolute; top: 0; left: 50%; transform: translateX(-50%) scale(0); opacity: 0}
.menu_bg.scale-big{
    transform: translateX(-50%) scale(1);
    opacity: 1;
    transition: all ease 0.5s;
    z-index: 110;
    position: fixed;
    left: 50%;
    top: -45%;
    width: 250%;
    height: 250%;
    max-width: 1500px;
    max-height: 1000px;
    min-width: 750px;
    min-height: 750px;
    border-radius: 50%;
}
@media (max-width: 500px){
    .menu_bg.scale-big{top: -50%; left: 75%}
}

.memo_textarea textarea{min-height: 150px}
/* 글쓰기 */
.writing_title input{padding: 7px 12px; border: 1px solid #bfbfbf;}
.writing_txt textarea{min-height: 200px}
.affixation > button{border: 0; padding: 3px; margin-right: 5px; background-color: transparent}
.img_area > div{position: relative; width: 33%; min-height: 80px; overflow: hidden; margin-right: 5px; }
.img_area > div > img{width: 100%; height: 80px}
.img_area > div > button{position: absolute; top: 5%; right: 3%; border: 0; background-color: rgba(255,255,255,0.5); border-radius: 50%; width: 20px; height: 20px; padding: 1px 5px}
.img_area > div > p{position: absolute; top: 5%; right: 3%; border: 0; background-color: rgba(255,255,255,0.5); border-radius: 50%; width: 20px; height: 20px; padding: 1px 5px}
.file_area > div > button , .file_area > div > p , .card_area > div > button
{position: absolute; top: 50%; right: 3%; transform: translateY(-50%); border: 0; background-color: transparent; width: 20px; height: 20px; padding: 2px 5px}
/*상세*/
.img_area > div > span{display: inline-block; background-color: rgba(0,0,0,0.3); position: absolute; width: 100%; bottom: 0; left: 0; padding: 5px 10px;}

.file_area .file_btn button{width: 25px; height: 25px; padding: 0 3px; border: 0; background-color: transparent}

@media (max-width: 430px){
    .img_area > div > span{display: inline-block; background-color: rgba(0,0,0,0.5); position: absolute; width: 100%; bottom: 0; left: 0; padding: 0 5px;}

}

.name_my{padding-right: 45px; max-width: 180px; overflow-wrap: break-word; line-height: 1.3}
.name_my span{display: inline-block; position: absolute; top: 0; right: 0; line-height: 1; background-color: #FF0000; color: #fff; font-weight: normal; padding: 5px 10px; border-radius: 15px;}
.file_input label {
    cursor: pointer;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
    height: 30px;
    width: 30px;
    border-radius: 0;
    text-align: center;
    line-height: 1.2;
    padding: 5px;
    background-image: none;
    background-color: transparent;
}
.file_input:first-of-type label {
    width: 40px;
}

.keyword{display: flex; justify-content: space-between}
.keyword input{width: 32%; min-width: auto; max-width: 32%;}
.arrow-left-admin:after{border-top-color: #2b427c; border-left-color: #2b427c}

/*keyword - absolute 안 쓰고, 리스트 옆으로 차곡차곡 쌓을 때 버전*/
/*.keyword{display: flex; }*/
/*.keyword input{width: 32%; min-width: auto; max-width: 32%; margin: 5px 2% 5px 0;}*/
/*.keyword input:nth-of-type(3n){margin: 5px 0 5px 0;}*/


/* 프리미엄 서식 대분류 */
.freeForm_category{padding: 20px 10px}

/*.freeForm_category ul{width: 100%;}*/
.freeForm_category ul li{border: 1px solid rgb(174, 181, 186); border-radius: 10px;  width: 100%;}  /*margin-bottom: 20px;*/
.freeForm_category ul li a{display: flex; flex-wrap: wrap; justify-content: space-between;  padding: 10px 20px;}

.freeForm_category .service_icon{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.freeForm_category .service_icon > li{width: 48%;  min-height: 65px; border: 0; margin-right: 5px; margin-bottom: 10px}
.freeForm_category .service_icon > li a{position: relative; width: 100%; height: 100%; word-break: break-all;  padding: 5px; border-radius: 5px; border: 2px solid rgb(233,233,233);}

.freeForm_category ul li a div .category_name{font-size: 13px; font-weight: bold; padding-top: -5px}
.freeForm_category ul li a div .category_count{font-size: 12px; color: rgb(174, 181, 186);}

.marketing_profile{ width: 35px; height: 35px; border-radius: 50%;  display: inline-block; background-color: #ededed; overflow: hidden;}
.marketing_my{max-height:25px; margin-left:10px; padding: 0px 10px;  padding-top: 3px; background-color: #FF0000;color: #fff; border-radius: 15px;}
