@charset "utf-8";

/*=================================================
  common
=================================================*/
#container.container-matching {background-color: #fff; }

.tagsinput span.tag {border: 1px solid #7d95b2; background-color: rgba(95, 125, 160, 0.7); font-family:  'NotoSansVI', 'Roboto', Helvetica, Arial, 'NotoSansKR'; color: #fff; text-align: left; white-space: inherit; line-height: 14px; }

/* manager-tabs
---------------------------------------------*/
.manager-tabs {margin-top: 50px; margin-bottom: 50px; display: table; width: 100%; table-layout: fixed; box-sizing: border-box; }
.manager-tabs > li {display: table-cell; float: none; width: 50%;  box-sizing: border-box; }
.manager-tabs > li:first-child {border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
.manager-tabs > li:first-child > a {border-left: 0; }
.manager-tabs > li:last-child {border-top-right-radius: 3px; border-bottom-right-radius: 3px; }
.manager-tabs > li > a {display: block; height: 60px; padding: 0 ; background-color: #f6f6f6;  border-left: 1px solid #e6e6e6; line-height: 60px; font-size: 18px; color: #666; font-weight: 400; text-align: center;  }
.manager-tabs > li > a:hover {background-color: #eee; }
.manager-tabs > li.active > a {background-color: #1079f9; color: #fff; }


/*=================================================
	container-manager list
=================================================*/
.table-list-manager .td-thumb {padding-left: 0; padding-right: 0; }
.table-list-manager .td-thumb a {display: inline-block; width: 120px; height: 68px; }
.table-list-manager .td-thumb img {width: 120px; height: 68px; }
.table-list-manager .td-title {text-align: left; }
.table-list-manager .td-title .btn-link {color: #333; font-size: 14px;  }
.table-list-manager .hash-box {margin-top: 5px; padding: 10px 15px; border-radius: 5px; background-color: #e9f0f8; }
.table-list-manager .hash-wrapper {font-size: 12px; line-height: 16px; cursor: default; user-select: none; }
.table-list-manager .td-modify {padding-left: 0; }

/*=================================================
	container-manager write
=================================================*/
.section-manager-write .textarea {min-height: 170px; max-height: 170px; height: 170px;  }
.section-manager-write .agree-wrapper .agree-box {margin-bottom: 10px; }
.section-manager-write .btn-delete-tag {margin-left: 10px; }

/* tag input */
#media_tag_tag {width: auto;  } 
#MAT_TAG_tag {width: auto;  font-family:  'NotoSansVI', 'Roboto', Helvetica, Arial, 'NotoSansKR';} 
.btn-delete-tag {margin-left: 5px; display: inline-block; background-color: #fff; padding: 5px 10px; border: 1px solid #bec8d5; border-radius: 3px; font-family:  'NotoSansVI', 'Roboto', Helvetica, Arial, 'NotoSansKR'; font-size: 12px; font-weight: 400;  color: #97a1ae;  }





/*=================================================
	container-matching list
=================================================*/
.table-list-matching {}
.table-list-matching tbody tr:hover td {cursor: pointer; background-color: #efefef; }
.table-list-matching td {text-align: left; vertical-align: top; }
.table-list-matching .td-date {text-align: center; vertical-align: middle; }
.table-list-matching .td-thumb {padding-left: 0; }
.table-list-matching .td-thumb img {display: inline-block; width: 100px; height: 57px; }
.table-list-matching .td-title p {margin-top: 5px; }





/*=================================================
	container-matching write
=================================================*/
.matching-editor-container {}
.matching-editor-container:after {content: ""; clear: both; display: block; height: 0; visibility: hidden;  }

/* matcing-editor */
.matching-editor {position: relative; float: left; width: calc(50% - 280px); height: 1187px; padding: 0 0 30px; border: 1px solid #e3e4e5; border-top: 4px solid #1079f9; border-radius: 3px; box-sizing: border-box;  background-color: #fff; }
.matching-editor:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }


/* matcing-editor > matching-header */
.matching-header {padding: 0 30px; }
.matching-header-title {font-size: 16px; color: #202020; font-weight: 400; }
.matching-header-title strong	{font-weight: 600; }

/* matcing-editor > search-wrapper */
.matching-editor .search-wrapper {width: 100%; margin-top: 15px;  padding: 0 30px; }
.matching-editor .search-wrapper .input-search {width: calc(100% - 35px); }
.matching-editor .search-wrapper .btn-search {min-width: 35px; width: 35px; }


/* matching-editor > matching-list-bottom */
.matching-list-bottom {margin-top: 20px; padding: 0 30px; text-align: center; }
.matching-list-bottom .pagination > li > a,
.matching-list-bottom .pagination > li > span {padding: 3px 4px; min-width: 26px; height: 26px; font-size: 13px; }
.matching-list-bottom .pagination > li .page-arrow {width: 26px; height: 26px; }


/* matching-editor > matching-list-wrapper */
.matching-list-wrapper {width: 100%; }
.matching-list-wrapper .sort-wrapper {margin-top: 10px; padding: 0 30px;  }
.matching-list-wrapper .sort-wrapper .sort {float: left; margin: 8px 0; }
.matching-list-wrapper .sort-wrapper .sort-checkbox {width: 100%; margin: 0 0 20px; padding: 15px; border-radius: 3px; background-color: #f8f8f8; }
.matching-list-wrapper .sort-checkbox .checkbox {margin-top: 10px; }
.matching-list-wrapper .sort-checkbox .checkbox:first-child {margin-top: 0; }
.matching-list-wrapper .sort-checkbox label {font-size: 12px; color: #707070; }
.matching-editor-video .sort-wrapper {margin-top: 25px; }


/* matching-list-video
------------------------------------------------------*/
.matching-list-video {padding: 0 30px; }
.matching-list-video .movie {position: relative; width: 100%; height: 155px; margin-top: 20px; background-color: #e2e2e2; background-position: center; background-repeat: no-repeat; background-size: cover; cursor: move; }
.matching-list-video .movie:first-child {margin-top: 0; }
.matching-list-video .movie iframe {display: none; }
.matching-list-video .media-cnt {position:absolute; right: 5px; top: 5px; padding: 4px 6px; font-weight: 400; background-color:#e60e61; -moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.4); box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.4);  } 



/* matching-list-product
------------------------------------------------------*/
.matching-list-porduct {margin-top: 29px; border-top: 1px solid #e3e4e5; }
.matching-list-porduct .product {width:100%; height: 99px; padding-right: 20px; box-sizing: border-box; border-bottom: 1px solid #e3e4e5; }
.matching-list-porduct .product:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.matching-list-porduct .product  img {float: left; width: 98px; height: 98px; cursor: move; }
.matching-list-porduct .product .product-del {display: inline-block; position: absolute; right: 10px; top: 10px; z-index: 2000;  padding: 0; width: 38px; height: 38px; background-color: #1079f9;  background-image: url("../images/sub/btn_movie_delete.png"); background-repeat: no-repeat; background-position: center; background-size: 16px 16px; border-radius: 50%; line-height: 38px; text-align: center; cursor: pointer; color:#fff; }
.matching-list-porduct .product .text-box {float: right; width: calc(100% - 100px); padding: 5px 0 0 16px; line-height: 14px; }
.matching-list-porduct .item-title {font-size: 13px; line-height: 18px; height: 36px; margin-bottom: 10px;  }
.matching-list-porduct .price-box > p {font-size:12px; text-align: right; }

/* matching-list card no-data */
.matching-list-video .card.no-data,
.matching-list-porduct .card.no-data {float: none; width: 100%; border: 0; }


/* matching-zone */
.matching-zone {position: relative; float: left; width: 500px; margin: 0 30px;  }

.matching-movie-zone {position: relative; width: 100%; height: 278px; background: #f8f8f8; border: 4px solid #d5d5d5; background-repeat: no-repeat; background-position: center; background-size: 100% 255px; text-align: center; }
.matching-movie-zone .movie {position: relative; width: 100%; height: 278px; overflow: hidden; }

.matching-movie-zone div span {display: none; }
.matching-movie-zone iframe {position: relative; width: 100%; height: 278px; margin: 0 auto; }
.matching-movie-zone .media-del {display: inline-block; position: absolute; right: 10px; top: 10px; z-index: 2000;  padding: 0; width: 38px; height: 38px; background-color: #1079f9;  background-image: url("../images/sub/btn_movie_delete.png"); background-repeat: no-repeat; background-position: center; background-size: 16px 16px; border-radius: 50%; line-height: 36px; text-align: center; cursor: pointer; color: #fff;  }
.matching-movie-zone .matching-zone-guide {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #1079f9; }

/* matching-item */
.product-zone .line {margin-top: 10px; }
.product-zone .line:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.product-zone .matching-item {float: left; position: relative; width: 160px; margin-left: 10px;  }
.product-zone .matching-item:first-child {margin-left: 0; }

.product-zone .matching-item .img-box {width: 160px; height: 160px; margin-bottom: 5px; background: #f8f8f8; border: 1px solid #d0d0d0; border-radius: 3px; box-sizing: border-box; overflow: hidden; }
.product-zone .matching-item .img-box img {width: 100%; height: 100%; cursor: move; }

.product-zone .matching-time {width: 100%; border: 1px solid #d0d0d0; border-radius: 3px;  overflow: hidden; box-sizing: border-box; }
.product-zone .matching-time:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.product-zone .input-matching {float: left; width: 128px; height: 30px; padding: 0 5px; border: 0; border-radius: 0;  text-align: center; }
.product-zone .btn-play {float: right; width: 30px; height: 30px; box-sizing: border-box; border: 0; border-left: 1px solid #d0d0d0; border-radius: 0; background-image: url("../images/sub/icon_play.png"); background-repeat: no-repeat; background-position: center; }
.product-zone .btn-play:hover {background-color: #1079f9; background-image: url("../images/sub/icon_play_on.png"); }

.product-zone .matching-item .product-del {display: inline-block; position: absolute; right: 8px; top: 8px; z-index: 2000;  padding: 0; width: 30px; height: 30px; background-color: #1079f9;  background-image: url("../images/sub/btn_movie_delete.png"); background-repeat: no-repeat; background-position: center; background-size: 12px 12px; border-radius: 50%; line-height: 36px; text-align: center; cursor: pointer; color: #fff;  }

 .dragNothing { }
 .dragOver {background-color: #dbebfe !important;  border: dotted 3px #1079f9 !important;  }

/* matching-movie-zone 언어별 bg img*/
/*.KR .matching-movie-zone {background-image: url("/images/sub/bg_moviezone_KR.png");  }*/

.matching-input-group dl {margin-top: 20px; }
.matching-input-group .label-title {margin-bottom: 5px; font-size: 14px; font-weight: 500; color: #333; }
.matching-input-group .matching-tag-group {position: relative; display: block; width: 100%;  }
.matching-input-group .matching-tag-group .label-title {line-height: 29px; }
.matching-input-group .matching-tag-group .btn-delete-tag {position: absolute; right: 0; top: 0; background-color: #fff; border: 1px solid #bec8d5;  font-size: 12px;  color: #97a1ae;  font-weight: 400;  }
.matching-input-group .tagsinput {border-color: #d0d0d0; border-radius: 3px; }
.matching-input-group .tagsinput:focus {border-color: #1079f9; }
.matching-input-group .textarea {min-height: 128px; height: 128px; }

.btn-matching-reset {display: block; width: 100%; height: 45px;  padding: 0; margin-top: 20px; border-color: #1079f9; background-color: #fff; color: #1079f9;  line-height: 43px; }

.matching-agree-container {margin-top: 55px; }
.matching-agree-container .agree-box {margin-bottom:  0;}
.matching-agree-container + .page-bottom {margin-top: 30px; }

 #mov_list div iframe, 
 #mov_list div .media-del {display: none; }

  #img_list div .product-del {display: none; }


.matching-preview-container {z-index: 9999; width: 500px; padding: 10px 10px; background-color: #fff; border: 1px solid #aaa; -webkit-box-shadow: 3px 3px 3px 1px rgba(0, 0, 0, .1); -moz-box-shadow: 3px 3px 3px 1px rgba(0, 0, 0, .1);  box-shadow: 3px 3px 3px 1px rgba(0, 0, 0, .1); }
.matching-preview-container .btn-close-preview {display: block; float: right; width: 36px; height: 36px; background-color: transparent; background-image: url("/images/sub/btn_preview_close.png"); background-repeat: no-repeat; background-position: center; border: 0; }
.matching-preview-container .matching-preview-title {font-size: 16px; line-height: 22px; padding: 5px 20px 0 0; }
.matching-preview-container .player {margin-top: 15px; width: 100%; }





/*=================================================
	container-matching view
=================================================*/
.matching-modify:after {content: ""; clear:both; display: block; height: 0; visibility: hidden; }
.matching-modify-left {position: relative; float: left; width: 700px; margin-right: 40px;}

.matching-modify .movie-wrapper { }
.matching-modify .hash {color: #333; }

.matching-modify-right {position: relative; float: right; width: 500px; }
.matching-modify-right .btn-group {text-align: right; }
.btn-matching-delete {min-width: 100px; height: 40px; padding: 0;background-color: #fff; border: 1px solid #bec8d5;  color: #97a1ae;  line-height: 38px; }

.matching-modify .product-wrapper:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }

.matching-modify .matching-item {position: relative; float: left; width: 160px; margin-left: 10px; margin-top: 20px; box-sizing: border-box; }
.matching-modify .matching-item:first-child,
.matching-modify .matching-item:nth-child(4) {margin-left: 0; }

.matching-modify .matching-item .img-box {width: 160px; height: 160px;  margin-bottom: 5px; background-color: #f8f8f8; border: 1px solid #d0d0d0;  border-radius: 3px; box-sizing: border-box; overflow: hidden; }
.matching-modify .matching-item .img-box  img {width: 100%; height: 100%; cursor: move; }

.matching-modify .matching-time {width: 100%; border: 1px solid #d0d0d0; border-radius: 3px;  overflow: hidden; box-sizing: border-box;  }
.matching-modify .matching-time:after {content: ""; clear: both; display: block; height: 0; visibility: hidden; }
.matching-modify .matching-time .input-matching {float: left; width: 128px; height: 30px; padding: 0 5px; border: 0; border-radius: 0;  text-align: center; }
.matching-modify .matching-time .btn-play {float: right; width: 30px; height: 30px;border: 0; border-left: 1px solid #d0d0d0; border-radius: 0; background-image: url("../images/sub/icon_play.png"); background-repeat: no-repeat; background-position: center; }
.matching-modify .matching-time .btn-play:hover {background-color: #1079f9; background-image: url("../images/sub/icon_play_on.png"); }
.matching-modify .matching-title {margin-top: 5px; text-align: left; font-size: 13px; line-height: 16px;  }


/* container-matching 매칭관리
-------------------------------------------
.container-matching .section {margin-bottom: 50px; }
.container-matching .bbs-matching .tag {display: inline-block; min-width: 30px; }
.container-matching .bbs-matching tbody td span {cursor: pointer; }
  
.container-matching .matching-wrapper {}
.container-matching .matching-wrapper:after {}
.container-matching .matching-wrapper .tag {display: inline-block; min-width: 25px; border: 1px solid  #7a7595; background-color: rgba(90, 83, 128, 0.7);  color: #fff; }
.container-matching .matching-wrapper .tag a {color: #e6e4f2; }
.container-matching .matching-wrapper .mediatags_clear {margin: 3px 0 0 7px; padding: 6px; border-radius: 3px; background-color: #ddd; }
.container-matching .agree-container .agree-wrapper .agree-box {height: 100px; margin: 0 0 8px 0; }


.container-matching .matching-info {margin-top: 50px; margin-bottom: 50px; padding-top: 30px; border-top: 1px solid #e4e5e6;  }
.container-matching .matching-info .hash {font-size: 14px; }

*/