/*Common*/
.section-title.large-top-space {
    margin-top: 60px;
}

.combobox-bottom-description {
    margin: 8px 8px 8px 18px;
}


.panel-sub-heading i {
    margin-right: 5px;
}


.inline-label {
    font-weight: bold;
}

.panel-heading.large {
    font-size: 1.2em;
}

.panel.alert ul {
    padding-left: 30px;
    padding-right: 20px;
}


.grid-top-panel {
    margin-bottom: 0px;
    border-radius: 0px;
}


ul.bootbox-popup-message {
    padding-left: 20px;
    margin-bottom: 15px;
}


/*페이지 헤더*/

@media (max-width: 991px) {
    .navbar-default.navbar-inverse + .main-header .page-title, .navbar-default.navbar-inverse + .main-header h1 {
        font-size:1.5em;

    }

}

/*오른쪽 depth가 잘리지 않게 하기 위함임*/
@media (min-width: 768px) {
       .page-title.breadcrumb-title {
        margin-right:250px;
    }
}

@media (min-width: 500px) {
       .page-title.breadcrumb-title {
        margin-right:230px;
    }
}

.login-form-message {
    margin-top: 10px;
}
 





/*--------------- 컨텐트 정보 페이지 ---------------------*/

/* 컨텐트 섬네일 아이템 레이아웃*/
/*content 클래스의 자손이면 컨텐트 섬네일이다.*/
.content .thumbnail-root {
    display:inline-block;
}


.content .thumbnail-root .thumbnail  {
    margin-bottom: 10px;
}

.content .thumbnail-root .thumbnail-box {
    margin-bottom: 30px;
    position: relative;
}

.thumbnail-container-horizontal-item-small .thumbnail-root .thumbnail-box {
    margin-bottom: 0px;
    position: relative;
}


.content .thumbnail-root .thumbnail-caption {
    /*max-height: 38px !important;
    min-height: 38px !important;*/
    max-height: 57px !important;
    min-height: 57px !important;
    vertical-align:top;
    overflow:hidden;
}

.content .thumbnail-root .thumbnail-caption h5,
.content .thumbnail-root .thumbnail-caption h6 {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    line-height:140%;
}


.content .thumbnail-root .thumbnail-info .user-name {
    font-size:0.82em;
    margin-left:2px;
    overflow: hidden;
}

.content .thumbnail-root .thumbnail-info .content-date {
    font-size: 0.82em;
    margin-right: 2px;
    margin-left: 6px;
}






/*북마크 섬네일 아이템 레이아웃*/
/*bookmark 클래스의 자손이면 컨텐트 섬네일이다.*/
.bookmark .thumbnail-root {
    display:inline-block;
}


.bookmark .thumbnail-root .thumbnail  {
    margin-bottom: 10px;
}

.bookmark .thumbnail-root .thumbnail-box {
    margin-bottom: 30px;
}


.bookmark .thumbnail-root .thumbnail-caption {
    /*max-height: 38px !important;
    min-height: 38px !important;*/
    max-height: 57px !important;
    min-height: 57px !important;
    vertical-align:top;
    overflow:hidden;
}

.bookmark .thumbnail-root .thumbnail-caption h5,
.bookmark .thumbnail-root .thumbnail-caption h6 {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    line-height:140%;
}

.bookmark .thumbnail-root .thumbnail-info .user-name {
    font-size:0.82em;
    margin-left:2px;
}

.bookmark .thumbnail-root .thumbnail-info .content-date {
    font-size:0.82em;
    margin-right:2px;
}


/*항목 정보 그리드*/

.item-info-grid {
    border-collapse:separate;
    border-spacing: 0 4px;
}

.item-info-grid .grid-label-cell {
    white-space: nowrap;
    padding-right:10px;
    vertical-align:top;
    font-weight:bold;
}


/*섬네일 정보*/

.panel.thumbnail-container > img {
    padding:5px;
}

.panel.thumbnail-container .thumbnail-box {
    position: relative;
}

.panel.thumbnail-container .thumbnail-box > img {
    padding:5px;
}








/*-------------------- Info 페이지 --------------------*/
.creator-install-instruction img + p {
    margin-left: 20px; 
    margin-right:20px; 
    margin-top: 3px;
}









/*------------------- 사용자 갤러리 페이지 ---------------------*/
.profile-header .user-profile-img.home-profile-img >img {
    width:200px;
    height:200px;
}


.profile-header.content-gallery.type-2 {
    margin-bottom:40px;
}

.profile-header.content-gallery.type-3 {
    margin-bottom:40px;
}



.icon-ar.icon-ar-big {
  width: 54px;
  height: 54px;
  font-size: 26px;
  line-height: 2.2;
}

.profile-header .subtitle-2 {
    font-size: 1.15em;
}




.profile-header.type-2 .profile-image {
    margin-top: 20px;
    margin-bottom: 20px;
}

.profile-header.type-3 .profile-image {
    margin-top: 20px;
    margin-bottom: 20px;
}

.profile-header.type-4 .profile-image {
    margin-top: 30px;
    margin-bottom: 20px;
}

.profile-header.type-4 .subtitle-2 {
    margin-top: 30px;
    margin-bottom: 30px;
}

.user-contents-gallery.external-link .section-title {
    font-size: 1.4em;
}

.user-contents-gallery.external-link ul {
    list-style-type:none;
    padding: 0px;
}

.user-contents-gallery.external-link ul a {
    /*text-decoration: underline;
    text-underline-position: under;*/
}





/*------------------- 마이페이지 ----------------------*/
.panel .panel-body table {
    margin-bottom: 0px;
}

.glyphicon {
    margin-right: 5px;
}


.hr-small-top-margin {
    margin-top: 10px;
}


.data-input-grid {
    border-collapse:separate;
    border-spacing: 0 8px;
}

.data-input-grid .grid-label-cell {
    white-space: nowrap;
    padding-right:10px;
    vertical-align:top;
    font-weight:bold;
}

table.data-input-grid {
    width:auto;
}

td.data-input-grid {
  white-space:nowrap;
}

.data-input-grid td:last-child {
  width:100%;
}

.data-input-grid td input {
  width:100%;
}


.table>tbody>tr>td.narrow {
    padding: 4px 8px;
}





/*-------------------- 사용자 컨텐츠 갤러리 설정 편집 페이지 -----------------------*/
.user-contents-gallery.setting-page.layout-settings .banner-image-list img {
    min-height: 150px;
    max-height: 340px;
}

.user-contents-gallery.setting-page.layout-settings .banner-image-list.type-1 img {
    min-height: 80px;
    max-height: 200px;
}

.user-contents-gallery.setting-page.layout-settings .profile-image-list img {
    min-height: 64px;
    max-height: 340px;
}

.inline-uploadfile-button {
    display: inline-block;
    vertical-align: middle;
    margin-left: 12px;
    margin-top: -2px;
}

.inline-uploadfile-button .e-inputbtn.e-btn {
    font-size: 14px;
}


.inline-uploadfile-button .e-uploadbox.e-js.e-widget {
    height: 30px !important;
}

.user-contents-gallery.setting-page.layout-settings .radio.user-custom-img label {
    width:100%;
}

.user-contents-gallery.setting-page.layout-settings .radio.user-custom-img img {
    margin-top: 10px;
    min-height: 150px;
    max-height: 340px;
}








/*------------------------ Post 페이지 ------------------------------*/

.post-header-root {
    position: relative;
}

.write-post .post-title:empty::before {
    content: "제목을 입력하세요";
    cursor: text;
}

.write-post .post-subtitle:empty::before {
    content: "소제목을 입력하세요";
    cursor: text;
}

.post-title {
    font-size: 2.6em;
}

.post-header-root .post-title {
    border: none;
}

.post-subtitle {
    font-size: 1.3em;
    border: none;
}

.post-information {
    font-size: 1em;
}



/*----------------------- 포스트 리스트 페이지 -------------------------------*/







/*----------------------- 포스트 쓰기 페이지 -------------------------------*/

.site-post-editor .e-rte.e-rte-wrapper.e-widget.e-box {
    min-height: 400px;
}

.site-post .post-header .overlay-toolbar {
    left: 0px;
    right: 0px;
    margin-top: 10px;
    background-color:rgba(0,0,0,0.1);
    padding: 6px 8px;
    z-index: 999;
}

.site-post .post-header .overlay-toolbar .function-toolbar .btn {
  /*margin-left: 2px;*/
}


/*사이트 포스트 보기 페이지 본문
텍스트 에디터의 iframe의 head에 있는 기본 속성을 넣어줘야 에디터와 실제 글의 모양이 같아진다.*/
.site-post .site-post-content-body {
    font-family:Nanum Gothic,Malgun Gothic, Arial;
    word-wrap: break-word;
    padding: 8px;
    box-sizing: border-box;
    margin: 0px;
    line-height: 1.75em;
    color: #5C5C5C;
}

.site-post .site-post-content-body p {
    -webkit-margin-after: 16px;
    -webkit-margin-before: 16px;
    -webkit-margin-end: 0px;
    -webkit-margin-start: 0px;
}

.site-post .site-post-content-body h1,
.site-post .site-post-content-body h2,
.site-post .site-post-content-body h3,
.site-post .site-post-content-body h4,
.site-post .site-post-content-body h5,
.site-post .site-post-content-body h6 {
    color: #5C5C5C;
    font-family:Nanum Gothic,Malgun Gothic, Arial;
    font-weight:bold;
    line-height:normal;
}

.site-post .site-post-content-body h2 {
    font-size: 1.5em;
}

.site-post .site-post-content-body h3 {
    font-size: 1.17em;
}

.site-post .site-post-content-body h4 {
    font-size: 1.15em;
}

.site-post .site-post-content-body h5 {
    font-size: 0.95em;
}

.site-post .site-post-content-body h6 {
    font-size: 0.8em;
}



.site-post .icon-ccl {
    font-size: 19px;
}




/*Site Post Style Type0*/
.site-post .post-header.type0 {
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center;
    margin-bottom: 10px;
}

.site-post .post-header.type0.write-post .post-title:empty::before {
    color: #666;
    opacity: 0.6;
}

.site-post .post-header.type0.write-post .post-subtitle:empty::before {
    color: #666;
    opacity: 0.6;
}

.site-post .post-header.type0 .button.design-setting-button {
    background-color: #666;
}

.site-post .post-header.type0 .overlay-toolbar {
    background-color: transparent; 
}

.site-post .post-header.type0 .overlay-toolbar.header-design-toolbar {

}

.site-post .post-header.type0 .post-header-root {
    padding: 30px 0 20px 0;
    display: flex;
    align-items: center;
}

.site-post.site-post-editor .post-header.type0 .post-header-root {
    padding: 70px 0 20px 0;
}

.site-post .post-header.type0 .post-title {
    text-align:left;
    margin: 0 0 15px 0;
}

.site-post .post-header.type0 .post-subtitle {
    text-align: left;
}

.site-post .post-header.type0 .post-information {
    margin-top: 0px;
    padding: 0px;
    overflow: hidden;
    vertical-align: baseline;
    position: relative;
    text-align:right;
}

.site-post .post-header.type0 .post-header-root .bottom-line {
    border-bottom-style: solid;
    border-bottom-width: 1px;
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    margin-left: 15px;
    margin-right: 15px;
}


@media (min-width: 768px) {

    .site-post .post-header.type0 .post-subtitle {
        float: left;
        margin: 0px;
        padding-bottom: 10px;
    }
    .site-post .post-header.type0 .post-information {

    }
}


@media (max-width: 767px) {

    .site-post .post-header.type0 .post-title {
        text-align:center;
    }

    .site-post .post-header.type0 .post-subtitle {
        text-align: center;
        padding-bottom: 0px;
    }

    .site-post .post-header.type0 .post-information {
        text-align:center;
        padding-bottom: 10px;
    }

}






/*Site Post Style Type1*/
.site-post .post-header.type1 {
  min-height: 300px;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: center center;
  color: #fff;
  margin-bottom: 40px;
}

.site-post .post-header.type1.write-post .post-title:empty::before {
    color: #fff;
    opacity: 0.6;
}

.site-post .post-header.type1.write-post .post-subtitle:empty::before {
    color: #fff;
    opacity: 0.6;
}

.site-post .post-header.type1 .button.design-setting-button {
    background-color: #666;
}

.site-post .post-header.type1 .overlay-toolbar {
    background-color: transparent; 
}


.site-post .post-header.type1 .post-header-root {
    min-height: 300px;
    background-color: rgba(0, 0, 0, 0.32);
    padding: 60px 0 40px 0;
    /*vertical-align*/
    display: flex;
    align-items: center;
}


.site-post .post-header.type1 .post-title {
    text-align:center;
    color: #fff !important;
}

.site-post .post-header.type1 .post-subtitle {
    text-align:center;
    color: #fff !important;
}


.site-post .post-header.type1 .post-information {
    margin-top: 60px;
    padding: 5px 0;
    overflow: hidden;
    vertical-align: baseline;
    position: relative;
    text-align:center;
    color: #fff;
}

.site-post .post-header.type1 .post-information  a {
    color: #fff;
}






/*Site Post Style Type2*/

.site-post .post-header.type2 {
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  color: #fff;
  margin-bottom: 40px;
}

.site-post .post-header.type2.write-post .post-title:empty::before {
    color: #fff;
    opacity: 0.6;
}

.site-post .post-header.type2.write-post .post-subtitle:empty::before {
    color: #fff;
    opacity: 0.6;
}

.site-post .post-header.type2 .button.design-setting-button {
    background-color: #666;
}

.site-post .post-header.type2 .overlay-toolbar {
    background-color: transparent; 
}


.site-post .post-header.type2 .post-header-root {
    background-color: rgba(0, 0, 0, 0.32);
    padding: 60px 0 60px 0;
    /*vertical-align*/
    display: flex;
    align-items: center;
}


.site-post .post-header.type2 .post-title {
    text-align:center;
    color: #fff !important;
    font-size: 3em;
}

.site-post .post-header.type2 .post-subtitle {
    text-align:center;
    color: rgba(255,255,255,0.85);
    font-size: 1.7em;
}


.site-post .post-header.type2 .post-information {
    margin-top: 80px;
    padding: 5px 0;
    overflow: hidden;
    vertical-align: baseline;
    position: relative;
    text-align:center;
    color: #fff;
    font-size: 1.3em;
}

.site-post .post-header.type2 .post-information  a {
    color: #fff;
}


@media (min-width: 0px) and (max-width: 767px) {
    .site-post .post-header.type2.write-post,
    .site-post .post-header.type2.write-post .post-header-root {
        min-height: calc(100vh - 120px);
    }
    .site-post .post-header.type2,
    .site-post .post-header.type2 .post-header-root {
        min-height: calc(100vh - 50px);
    }

    .site-post .post-header.type2 .post-title {
        font-size: 2.3em;
    }
    .site-post .post-header.type2 .post-subtitle {
        font-size: 1.4em;
    }
    .site-post .post-header.type2 .post-information {
        position: absolute;
        bottom: 10px;
        left:50%;
        transform:translateX(-50%);
        font-size: 1em;
    }
}
@media (min-width: 768px) and (max-width: 991px) {
    .site-post .post-header.type2.write-post,
    .site-post .post-header.type2.write-post .post-header-root {
        min-height: calc(100vh - 208px);
    }
    .site-post .post-header.type2,
    .site-post .post-header.type2 .post-header-root {
        min-height: calc(100vh - 136px);
    }
    .site-post .post-header.type2 .post-information {
        position: absolute;
        bottom: 10px;
        right: 20px;
        font-size: 1.1em;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .site-post .post-header.type2.write-post,
    .site-post .post-header.type2.write-post .post-header-root {
        min-height: calc(100vh - 200px);
    }
    .site-post .post-header.type2,
    .site-post .post-header.type2 .post-header-root {
        min-height: calc(100vh - 136px);
    }
}
@media (min-width: 1200px) {
    .site-post .post-header.type2.write-post,
    .site-post .post-header.type2.write-post .post-header-root {
        min-height: calc(100vh - 214px);
    }
    .site-post .post-header.type2,
    .site-post .post-header.type2 .post-header-root {
        min-height: calc(100vh - 136px);
    }
}





/*Site-Post 아이템 스타일*/

.site-post.content-box {
    text-align: left;
}

.site-post.small-post-list-item .post-title {
    margin-top: 5px;
    margin-bottom: 5px;
    text-align: center;
    font-size: 1.4em;
}

.site-post.large-post-list-item .post-title {
    text-align: center;
    font-size: 1.3em;
    text-align: left;
}

.site-post.large-post-list-item.post {
    margin-top: 10px;
    margin-bottom: 0px;
}

.site-post.large-post-list-item.post .panel-footer .post-information {
    margin-top: 5px;
    margin-bottom: 5px;
}


@media (max-width: 767px) {
    .site-post.large-post-list-item.post .panel-footer .post-information {
        margin-top: 0px;
        margin-bottom: 8px;
        text-align: center
    }

    .masonry-item.blog-item.site-post-item {
        width: 100%;
    }
}

.site-post-item.masonry-item.blog-item .subtitle {
    opacity: 0.8;
    font-size: 1.1em;
}

.site-post-item.masonry-item.blog-item .summary {
    max-height: 120px;
    overflow:hidden;
}

.site-post-item.masonry-item.blog-item .thumbnail {
    overflow:hidden;
}

/*테스트용*/
/*.site-post-item.masonry-item.blog-item .thumbnail .thumbnail-image {
    transition: all .5s;
}

.site-post-item.masonry-item.blog-item .thumbnail .thumbnail-image:hover {
    transform: scale(1.02);
}*/






/*----------------------- 마이 페이지 -------------------------------*/

.setting-description {
    font-size: 13px;
    color: #707070;
}