@charset "utf-8";

/************************************** import **************************************/


/* search css */
@import url('../home-search/home-search.css');


/************************************** my dashboard **************************************/


/************************************** 발행 대시보드 **************************************/
.view-wrap .group:last-child {margin-bottom:0;}
.sch-info-area {margin-bottom:0; border-bottom:0; padding-top:23px; border-top:1px solid #000;}
.view-wrap.type-list .group .box-wrap .g-box .list-bottom > .btn-area .btn .icon.manage .material-icons {font-size:20px}

.g-box .check-input-box {float:left;}
.g-box .check-input-box label {text-indent: -9999px;}
.view-wrap.type-list .group .box-wrap .g-box .list-top .title-area {width:calc(100% - 243px)}


@media(max-width:850px) {
    .view-wrap.type-list .group .box-wrap .g-box .hashtag > span { max-width: inherit; }
    .view-wrap.type-list .group .box-wrap .g-box .list-bottom { padding:10px;}
    .view-wrap.type-list .group .box-wrap .g-box .list-top .img-area { width: 100%; margin-right:0; margin-bottom:15px; height:0; padding-bottom:56%; }    
    .view-wrap.type-list .group .box-wrap .g-box .list-top .title-area { width:100%; }
    .sch-info-area .view-filter-wrap .filter-wrap {float:right}
    .g-box .check-input-wrap {margin-bottom:10px;}
    .g-box .check-input-box {float:none}
    .view-wrap.type-list .group .box-wrap .g-box .list-bottom .cate-summary { position: relative; width:100%; float: none; text-align: center; padding-bottom:10px; }
    .view-wrap.type-list .group .box-wrap .g-box .list-bottom .cate-summary .cate-tit .btn-area { position: static; display: inline; vertical-align: middle; }
    .view-wrap.type-list .group .box-wrap .g-box .list-bottom .cate-summary .cate-tit .btn-area .detail-area { left:50%; transform: translateX(-50%); min-width:100%; }
    .view-wrap.type-list .group .box-wrap .g-box .list-bottom > .btn-area { width:100%; float: none; }
    .view-wrap.type-list .group .box-wrap .g-box .list-bottom > .btn-area .btn .txt { bottom: inherit; top: calc(100% + 6px); }
    .view-wrap.type-list .group .box-wrap .g-box .list-bottom > .btn-area .btn .txt:after {border-bottom: 4px solid #7562ff; border-top:0; top: -4px; bottom: inherit; }    
}

.btn-wrap.delete-btn button > .material-icons {margin-right:5px}


@media(max-width:768px) {
    .sch-info-area {border-top:0; padding-top:0;}
}

/* share pop up */

/* url복사 */
.popup-wrap.share-popup.url .popup {width:550px; height:400px;}

/* 코드복사 */
.popup-wrap.share-popup.code .popup {width:550px; height:550px;}

/* 공통 */
.popup-wrap.share-popup .popup .modal-text-area {height: calc(100% - 60px);}
.popup-wrap.share-popup .modal-tab > ul {background:#e7e9f5;border-radius:45px; margin-bottom:20px;}
.popup-wrap.share-popup .modal-tab > ul > li {float:left; text-align: center; width:50%; color:#696f93; position:relative; padding:15px 10px;font-weight:600; font-size:1.3rem;cursor:pointer;}
.popup-wrap.share-popup .modal-tab > ul > li.select:after {content:''; position:absolute; top:0; left:0; background:#fff; border:1px solid var(--theme-color); width:100%; height:100%; border-radius:45px; z-index:-1}
.popup-wrap.share-popup .modal-tab > ul > li.select {z-index:1; color:var(--theme-color)}

.url-share {position: relative;}
.url-share input[type="text"].text-input {border-radius: 30px; padding: 18px 90px 18px 25px; font-size:1.4rem; cursor:pointer; height:auto;}
.url-share .btn-wrap {position:absolute; top:7px; right:10px;}
.url-share .btn-wrap button.input-btn {padding:0 25px }
.url-share .btn-wrap button.input-btn .material-icons {font-size:15px; margin-right:5px;}

/* sns 바로가기 */
.share-shortcut { padding: 15px; margin-top: 20px; border: 1px dashed #ccc; }
.share-shortcut h4 { font-size: 1.2rem;margin-bottom: 25px;color: #000000;}
.share-shortcut ul li {float:left; width:calc(20% - 20px); margin-right:25px; text-align: center;}
.share-shortcut ul li a { font-size:1.2rem; font-weight:600;color:#9b9b9b; display:block;}
.share-shortcut ul li:last-child {margin-right:0;}
.share-shortcut ul li .img-wrap {width: 50px;height: 50px;border-radius: 50%;text-align: center;margin: 0 auto;background: #aaa;padding: 8px; border:1px solid #aaa;margin-bottom:5px;}
.share-shortcut ul li img {max-height:90%; max-width:90%; position:relative;}
.share-shortcut ul li:hover {opacity:.7;}

.share-shortcut ul li .img-wrap.twitter {background:#2aa9e0; border-color:#2aa9e0;}
.share-shortcut ul li .img-wrap.twitter img {top:5px; left:1px;}
.share-shortcut ul li .img-wrap.facebook {background:#1977f3; border-color:#1977f3;}
.share-shortcut ul li .img-wrap.facebook img {top:-2px; left:-1px; max-width:95%; max-height:95%;}
.share-shortcut ul li .img-wrap.gmail {background:#fff; border-color:#d2d2d2;}
.share-shortcut ul li .img-wrap.gmail img {top:4px;}
.share-shortcut ul li .img-wrap.kakaostory {background:#ffc20e; border-color:#ffc20e;}
.share-shortcut ul li .img-wrap.kakaotalk {background:#ffe812; border-color:#ffe812;}
.share-shortcut ul li .img-wrap.kakaotalk img {top:1px; left:-1px;}

/* 코드복사 공간 */
.code-share .code-area {background:#f0f0f0; border-radius:8px; padding:15px; white-space: pre-wrap; font-size:1.4rem; height:310px; line-height:20px; overflow-y:auto}
.btn-wrap.code-copy-btn {margin-top:25px;}
.btn-wrap.code-copy-btn button .material-icons {margin-right:5px; font-size:18px;}

/* 권한 수정 */
.popup-wrap.manage .popup {height:auto; width:550px}
.popup-wrap.manage .popup .modal-text-area {padding:30px 20px;}
.manage-wrap .radio-input-wrap:not(:first-child) { margin-top: 15px; }
.manage-wrap .radio-input-wrap .radio-input-title { display: inline-block; font-size: 1.4rem; font-weight: 600; color:#444; padding-right: 25px; vertical-align: middle;}
.manage-wrap .radio-input-wrap .radio-input-box { display: inline-block; margin-right: 20px;}
.manage-wrap .added-item .item { position: relative; display: inline-block; padding: 3px 40px 3px 15px; font-size: 1.3rem; font-weight: 600; border-radius: 30px; margin-right: 3px; background:#fff; margin-bottom: 5px;}
.manage-wrap .added-item .item .del-btn { position: absolute; top: 4px; right: 10px; width: 17px; height: 17px; text-align: center; border-radius: 50%;  cursor: pointer; }
.manage-wrap .added-item .item .del-btn:hover { background-color: #eae7fd; }
.manage-wrap .added-item .item .del-btn .material-icons { font-size: 13px; color: var(--theme-color); }
.manage-wrap .email-add-wrap { margin-top: 15px; }
.manage-wrap .email-add-wrap .added-item { padding: 15px; background-color: #f4f4f4; border-radius: 5px; height: 120px;}
.manage-wrap .email-add-wrap .added-item .item.sucess { border: 1px solid #76c1a3; color: #76c1a3; }
.manage-wrap .email-add-wrap .added-item .item.sucess .del-btn:hover { background: #e9f5f0; }
.manage-wrap .email-add-wrap .added-item .item.sucess .del-btn .material-icons { color: #76c1a3; }
.manage-wrap .email-add-wrap .added-item .item.fail { border: 1px solid #da7676; color: #da7676; }
.manage-wrap .email-add-wrap .added-item .item.fail .del-btn:hover { background: #fcf1f1; }
.manage-wrap .email-add-wrap .added-item .item.fail .del-btn .material-icons { color: #da7676; }
.manage-wrap .input-box { position: relative; margin:15px 0; }
.manage-wrap .input-box .btn-wrap {position:absolute; top:7px; right:10px;z-index: 1;}
.manage-wrap .input-box .btn-wrap button {height:30px; padding:0 25px; }
.manage-wrap input[type="text"].text-input { height: 45px; border-radius: 50px; padding: 0 20px; font-size: 1.4rem; }
.popup-wrap.manage .btn-wrap.manage-btn button {height: 35px;font-size: 1.3rem;padding: 0 40px;}



@media(max-width: 650px) {
	.popup-wrap.share-popup.url .popup,
    .popup-wrap.share-popup.code .popup,
    .popup-wrap.manage .popup {width: calc(100% - 60px); height:auto;}
	.popup-wrap.share-popup .popup .modal-title-area {font-size: 1.5rem;padding: 15px;}
	.popup-wrap.share-popup .popup .modal-title-area .close-btn {top: 14px; right: 15px;}
	.popup-wrap.share-popup .popup .modal-foot-area {padding: 15px;}
	.popup-wrap.share-popup .popup .modal-text-area {height: calc(100% - 120px)}

    .code-share .code-area {font-size:1.3rem;}
    .manage-wrap .radio-input-wrap .radio-input-title {font-size:1.3rem; padding-right:15px;}
    .manage-wrap .radio-input-wrap .radio-input-box {margin-right:10px}

    .manage-wrap .added-item .item {font-size:1.2rem; padding: 3px 30px 3px 11px;}
    .manage-wrap .added-item .item .del-btn {right:7px;}
}

@media(max-width: 500px) {
    .popup-wrap.manage .popup .modal-text-area {padding:20px}
    .url-share .btn-wrap button.input-btn {padding:0 16px;font-size:1.2rem;}
    .url-share .btn-wrap button.input-btn .material-icons {font-size:12px; position:relative; top:1px;}
    .share-shortcut ul li {width:calc(33.33% - 17px); margin-bottom:10px;}
    .share-shortcut ul li:nth-child(3) {margin-right:0;}
    .share-shortcut ul li .img-wrap {width:40px; height:40px; padding:7px}
    .popup-wrap.share-popup .modal-tab > ul > li {font-size:1.2rem; padding:10px;}
    .url-share input[type="text"].text-input {padding: 15px 90px 15px 15px}
	.popup-wrap .popup .modal-title-area {font-size: 1.5rem;}
	.popup-wrap .popup .modal-title-area .close-btn {top: 13px}
    .share-shortcut ul li .img-wrap.twitter img {top:2px; left:0px;}
    .share-shortcut ul li .img-wrap.facebook img {top:-1px}
    .share-shortcut ul li .img-wrap.gmail img {top:1px}
    .share-shortcut ul li .img-wrap.kakaostory img {top:1px}
    .share-shortcut ul li .img-wrap.kakaotalk img {top:1px; max-width:95%; max-height:95%}
    .manage-wrap .radio-input-wrap:not(:first-child) {border-top:1px solid #dee3eb; padding-top:15px}
    .manage-wrap .radio-input-wrap .radio-input-title{display:block; margin-bottom:10px;}
    .manage-wrap .radio-input-wrap .radio-input-box {float:left; margin-bottom:8px}
    .manage-wrap .radio-input-wrap .radio-input-box.second-box {margin-right:0;}
    .manage-wrap input[type="text"].text-input {height:40px;}
    .manage-wrap input[type="text"].text-input::placeholder {font-size:1.2rem;}
    .manage-wrap .input-box .btn-wrap {top: 5px; right: 7px;}
}

/************************************** 담은 대시보드 **************************************/

.bread-wrap {padding:17px 0; border-top:1px solid #000;}
.bread-wrap .back-btn {background:#f4f4f4; padding:10px; border-radius:5px; float:left; margin-right:12px; cursor:no-drop}
.bread-wrap .back-btn .material-icons {color:#b1b1b1; font-size:2rem;}
.bread-wrap .bread-txt {float:left; font-weight:600; font-size:1.4rem;width: calc(100% - 52px);}
.bread-wrap .bread-txt li {float:left; word-break: break-all; line-height:40px;}
.bread-wrap .bread-txt li:last-child {width:calc(100% - 98px); white-space:nowrap; text-overflow: ellipsis; overflow:hidden;}
.bread-wrap .bread-txt .unit .material-icons {color:#9c9c9c;}
.category-box .categ-common .depth-tit:hover {color: var(--theme-color)}
.categ-add-btn {background:#dee3eb; color:#5d5478; transition: opacity .3s ease}
.categ-add-btn:hover {border-color:#dee3eb; color:#5d5478; opacity:.8;}
.category-box .categ-common .depth-tit.my-d-tit {cursor:default;}
.category-box .categ-common .depth-tit.my-d-tit:hover {text-decoration: none; color:#000;}
.bread-wrap .back-btn.on {background: var(--theme-color); cursor:pointer;}
.bread-wrap .back-btn.on .material-icons {color:#fff;}
.sch-info-area.favorite {border-top:1px solid #d7d7d7; padding-top:15px;}
.sch-info-area.favorite .view-filter-wrap {position:relative; top:8px;}
.sch-info-area .folder-txt { float: left; position: relative; font-size: 1.4rem; width:calc(100% - 118px)}
.sch-info-area .folder-txt > .material-icons.folder-ico {background:#ebe7f9; padding:6px 8px; color: var(--theme-color); border-radius:5px; margin-right:7px; float:left;}
.folder-name-edit .input-box input[type="text"].text-input {height:32px;}
.sch-info-area .folder-txt h3 {float:left; width:calc(100% - 50px); text-overflow: ellipsis; white-space: nowrap; word-break: break-word; overflow: hidden; position:relative; top:-1px; padding: 7px 35px 7px 10px; cursor:pointer; }
.sch-info-area .folder-txt .edit-icon { position: absolute; top: 5px; right: 5px; cursor: pointer; }
.sch-info-area .folder-txt .edit-icon .material-icons { opacity: .5; margin: 0 2px;}
.sch-info-area .folder-txt h3:hover {background:#f7f7f7; border-radius:5px;}

.folder-name-edit{float:left;width: calc(100% - 43px);}
.folder-name-edit .input-box {float:left; width:calc(100% - 64px); position:relative; top:-2px}
.folder-name-edit ul.checking {float:left; position:relative; top:4px; float:right; right:-1px}
.folder-name-edit ul.checking li {float:left; padding:5px; background:#eeecf2; color:#5c5b8a; border-radius:4px; margin-left:8px; transition:background .3s ease, color .3s ease; cursor:pointer;} 
.folder-name-edit ul.checking .material-icons {font-size:1.4rem; font-weight:600}
.folder-name-edit ul.checking li:hover {color:#fff; background: #e1dde9;}

@media(max-width:768px) {
    .bread-wrap {border-top:0; padding:0 0 20px;}
    .bread-wrap .back-btn {padding:5px; margin-right:8px;}
    .bread-wrap .back-btn .material-icons {font-size:1.8rem;}
    .sch-info-area .folder-txt h3 {font-size:1.5rem; top:-3px; width:calc(100% - 33px)}
    .sch-info-area .folder-txt > .material-icons.folder-ico {margin-right:2px; font-size:1.5rem; }
    .bread-wrap .bread-txt li {line-height:26px;}
    .sch-info-area.favorite .view-filter-wrap{top:4px;}
    .folder-name-edit {width: calc(100% - 33px)}
    .folder-name-edit .input-box input[type="text"].text-input {height:31px;}
    .folder-name-edit ul.checking {top:-1px}
}

@media(max-width:600px) {
    .sch-info-area .view-filter-wrap {width:auto; margin-top:0;}
}

@media(max-width:500px) {
    .bread-wrap .bread-txt {font-size:1.3rem;}
    .sch-info-area .folder-txt > .material-icons.folder-ico {display:none;}
    .sch-info-area.favorite .view-filter-wrap{top:6px;}
    .sch-info-area .folder-txt h3 {width:100%; top:0;}
    .folder-name-edit {width:100%;}
}