@charset "utf-8";
/*
        author : jooyeon Jin, publisher

        info: 
            max-width:1920px;
            inner-width:1460px;

            responsible: 1460px/1280px
        
        ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ

        changes
        - 20191111 : initially created
        - 20191120 : update list
    */
#mypage {
	max-width: 1920px;
	margin: 0 auto;
}
/* 회원 환영 visual 영역 */
.visual {
	width: 100%;
	height: 107px;
	background-image: url('../../images/img-mypage-top.png');
	background-repeat: no-repeat;
}
.visual p {
	text-align: center;
	font-size: 32px;
	color: #000;
	letter-spacing: -3.2px;
	padding-top: 24px;
	text-shadow: 3.2px 5.1px 6.9px rgba(19, 11, 21, 0.2);
}
.visual p .client_name {
	font-weight: bold;
}
.visual p .semilight {
	display: block;
	font-size: 17px;
	font-weight: 400;
	letter-spacing: 3.4px;
	color: #495e76;
}
.mypage_whole_content {
	max-width: 1460px;
	width: 100%;
	margin: 40px auto;
	overflow: hidden;
	display: flex;
}
/* lnb 영역 */
.lnb {
	width: 208px;
	float: left;
}
.lnb .lnb_list {
	width: 208px;
	height: 646px;
}
.lnb .lnb_list li {
	width: 100%;
	height: 60px;
	border-bottom: 1px solid #e4e4e4;
	box-sizing: border-box;
}
.lnb .lnb_list>li:first-child {
	border-top: 1px solid #e4e4e4
}
.lnb .lnb_list li a {
	display: block;
	padding-left: 30px;
	font-size: 18px;
	line-height: 59px;
	letter-spacing: -1.8px;
	font-weight: bold;
}
.lnb .lnb_list li>a.hvbg {
	height: 60px;
}
.lnb .lnb_list li a .lnb_title {
	display: block;
	float: left;
	letter-spacing: -0.1em;
}
.lnb .lnb_list li a .counting {
	font-size: 15px;
	line-height: 51px;
	color: #563da3;
	margin-left: 7px;
	margin-top: 4px;
	float: left;
}
.lnb .lnb_list li.sub_lnb {
	height: 143px;
}
.lnb .lnb_list li.sub_lnb>div {
	margin-top: 4px;
}
.lnb .lnb_list li.sub_lnb>div a {
	font-size: 16px;
	line-height: 30px;
	letter-spacing: -1.6px;
	color: #666;
	font-weight: normal;
}
.lnb .lnb_list li.sub_lnb>div a:before {
	display: inline-block;
	background-image: url('../../images/icn-lnb-point.png');
	background-repeat: no-repeat;
}
.bulleticn {
	position: relative;
	top: -5px;
}
/* lnb의 li에 hover 했을때 스타일값 */
.lnb .lnb_list li:hover>a.hvbg {
	background-image: url('../../images/img-mapage-lnb-h.png');
	background-repeat: no-repeat;
	box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.4);
	background-size: cover;
}
.lnb .lnb_list li:hover a {
	color: #fff;
}
.lnb .lnb_list li:hover .counting {
	color: #d0c1ff;
}
/* 그 영역 페이지일때 lnb 스타일값 */
.lnb .lnb_list li.active>a.hvbg {
	background-image: url('../../images/img-mapage-lnb-s.png');
	background-repeat: no-repeat;
	box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.4);
	position: relative;
	border-bottom: 0;
	background-size: cover;
}
.lnb .lnb_list li.active a {
	color: #fff;
}
.lnb .lnb_list li.active .counting {
	color: #d0c1ff;
}
/*--------------- 오른쪽 컨텐츠 영역 ------------------*/
.mypage_right_content {
	width: 1208px;
	margin: 0 0 136px 36px;
	float: left;
}
.mypage_right_content h3 {
	font-size: 27px;
	line-height: 31px;
	letter-spacing: -.06em;
	margin-bottom: 0;
	font-weight: bold;
}
/*----------------- 오른쪽 컨텐츠 영역 gnb list--------------------------------------*/
.mypage_right_content_gnb {
	width: 100%;
	height: 40px;
	margin-bottom: 20px;
}
.mypage_right_content_gnb_list {
	width: 471px;
	height: 40px;
	float: left;
}
.mypage_right_content_gnb_list li {
	width: 94px;
	border: 1px solid #ccc;
	border-right: 0;
	line-height: 40px;
	float: left;
	text-align: center;
}
.mypage_right_content_gnb_list li a {
	display: block;
	width: 100%;
	font-size: 15px;
	letter-spacing: -1.8px;
}
.mypage_right_content_gnb_list li:last-child {
	border: 1px solid #ccc;
}
.mypage_right_content_gnb_list li:hover {
	background-color: #7095e4;
}
.mypage_right_content_gnb_list li:hover a {
	color: #fff;
	font-weight: bold;
}
.mypage_right_content_gnb_list li.selected {
	background-color: #4d6eb3;
	box-shadow: 0.1px 4px 5px 0 rgba(0, 0, 0, 0.2);
}
.mypage_right_content_gnb_list li.selected a {
	color: #fff;
	font-weight: bold;
}
/*-----------------날짜달력조회--------------------------------------*/
.search_date_area {
	width: 710px;
	margin-left: 19px;
	float: left;
}
.search_date_area>p {
	float: left;
	width: 173px;
	border: 1px solid #ccc;
	line-height: 40px;
}
.search_date_area>p a {
	display: block;
	text-indent: 10px;
}
.search_date_area span {
	display: block;
	float: left;
	color: #ccc;
	line-height: 40px;
	margin: 0 7px;
}
.search_date_area>p i {
	display: block;
	width: 39px;
	height: 40px;
	text-align: center;
	float: right;
}
.search_date_area>p i img {
	display: block;
	margin: 12px 0 0 11px;
}
.search_date_area>p:hover a i {
	background-color: #f4f4f4;
}
.search_date_area>p.search_btn {
	width: 95px;
	border: 1px solid #ccc;
	line-height: 40px;
	float: left;
	text-align: center;
	background-color: #424242;
	margin-left: 9px;
}
.search_date_area>p.search_btn a {
	color: #fff;
	font-size: 16px;
	letter-spacing: -1.92px;
	font-weight: bold;
	text-indent: 0;
	display: block;
	width: 100%;
}
/*-----------------결과조회 동영상리스트--------------------------------------*/
.result_area {
	width: 100%;
	overflow: hidden;
}
.result_area_notice {
	line-height: 40px;
	overflow: hidden;
}
.result_area_notice>p {
	font-weight: bold;
	font-size: 16px;
	letter-spacing: -1.92px;
	line-height: 50px;
}
.result_area_notice>h4 {
	font-size: 26px;
	line-height: 40px;
	letter-spacing: -2.6px;
	font-weight: bold;
}
.result_area_notice .result_area_total {
	float: left;
}
.result_area_notice .result_area_total span.result_total_count {
	color: #0033ff;
}
.result_area_notice .edit_btn {
	display: block;
	float: right;
	width: 103px;
	height: 38px;
	border: 1px solid #999;
	text-align: center;
	line-height: 35px;
	margin-left: 20px;
	cursor: pointer;
}
.result_area_notice .delete_btn {
	display: none;
	float: right;
	width: 103px;
	height: 38px;
	text-align: center;
	line-height: 38px;
	margin-left: 20px;
	cursor: pointer;
	background-color: #ed0f69;
	color: #ffffff;
}
/* 편집 누르면 나타나게 .after_edit_btn클릭하면 display:block;*/
.result_area_notice .after_edit_btn {
	display: none;
	float: right;
	line-height: 38px;
	font-weight: normal;
}
/* 나타난 상태에서 전체삭제 누르면 컬러 바뀌게! */
.result_area_notice .after_edit_btn .whole_delete {
	color: #ed0f69;
	font-weight: bold;
	letter-spacing: -1.92px;
}
.result_area_notice .after_edit_btn .selected_delete {
	letter-spacing: -0.8px;
}
.mypage_result_vod {
	width: 100%;
	margin-bottom: 44px;
	text-shadow: none
}
.mypage_result_vod .common_vod_item .common_vod_item--bgbox {
	width: 232px;
	height: 130px;
	overflow: hidden;
}
.mypage_result_vod:after {
	content: "";
	display: block;
	clear: both;
}
.mypage_result_vod_list {
	margin:0 -6px;
}
.mypage_result_vod_list:after {
	content: "";
	display: block;
	clear: both;
}
/*-----------------결과조회 동영상리스트 (동영상 한개 스타일, hover)----------------------*/
.mypage_result_vod_list li {
	width: 20%;
	height: 234px;
	float: left;
	margin: 0;
	padding: 0 6px;
}
.mypage_result_vod_list li:hover .common_vod_item--wrap {
	margin: 0;
}
.mypage_result_vod_list li .thumb_img {
	position : relative;
}
.mypage_result_vod_list li:hover .thumb_img {
	box-shadow: 0.1px 4px 5px 0 rgba(0, 0, 0, 0.2);
	transform: translateY(-10px);
	transition: all .2s;
}
.mypage_result_program_list .common_vod_item--bgbox {
	width : 192px;
	height : 196px;
	overflow : hidden
}
.mypage_result_program_list .common_vod_item--bgbox img {
	width : 100%;
	height : auto;
}
.mypage_result_program {
	width : 100%;
	margin-bottom : 44px;
}
.mypage_result_program_list {
	margin: 0 -6px;
}
.mypage_result_program_list:after {
	content: "";
	display: block;
	clear: both;
}
/*-----------------결과조회 동영상리스트 (동영상 한개 스타일, hover)----------------------*/
.mypage_result_program_list li {
	width: 20%;
	height: 234px;
	float: left;
	margin: 0;
	padding: 0 6px;
}
.mypage_result_program_list li:hover .thumb_img {
	box-shadow: 0.1px 4px 5px 0 rgba(0, 0, 0, 0.2);
	transform: translateY(-10px);
	transition: all .2s;
}
.mypage_result_program_list li .thumb_img {
	position: relative;
	overflow: hidden
}
/* 프로그램 리스트 */
.program_list:after {
	content: "";
	display: block;
	clear: both;
}
.program_list .program_list_inner li {
	width: 192px;
	height: 260px;
	margin-right: 11px;
	float: left;
}
.program_list .program_list_inner li a {
	display: block;
}
.program_list .program_list_inner li a>div.thumb_img {
	position: relative;
}
.program_list .program_list_inner li:hover a>div>img {
	width: 100%;
	overflow: hidden;
	box-shadow: 0px 3px 12px 0 rgba(20, 47, 71, 0.8);
	margin-bottom: 5px;
}
.program_list .program_list_inner li a>div>p {
	font-size: 16px;
	font-weight: bold;
	letter-spacing: -1.6px;
	color: #090909;
	text-align: left;
}
.program_list .program_list_inner li:hover {
	margin-top: -10px;
}
.program_list .program_list_inner li a>div>p.delete {
	color: #999;
}
/* qna table */
.qna_table {
	width: 100%;
	table-layout: fixed
}
.qna_table thead th {
	padding: 10px 0;
	text-align: center;
	height: 41px;
}
/*
    삭제하기 눌렀을때 모든동영상에 체크박스 나타나게 처리! display:none; > display:block;
*/
input[class="cb-pink"]+label span {
	position: absolute;
	left: 8px;
	top: 8px;
	background: url() left top no-repeat;
}
.del_check {
	display: none;
}
input[class="cb-pink-media"]+label span {
	position: absolute;
	left: 8px;
	top: 8px;
	background: url() left top no-repeat;
}
.del_check_media {
	display: none;
}
.sub_title_area {
	margin-top: 7px;
	font-weight: bold;
}
.sub_title_area a {
	display: block;
	width: 100%;
}
.sub_title_area .sub_title {
	text-shadow: none
}
.sub_title_area a strong {
	font-size: 14px;
	letter-spacing: -1.05px;
	display: block;
	margin-bottom: 3px;
}
.sub_title_area a strong.pro_title {
	font-size: 18px;
	letter-spacing: -1.8px;
}
.sub_title_area a .about_date {
	font-size: 13px;
	color: #999;
}

@media screen and (max-width: 1500px) {
.mypage_whole_content {
	max-width: 1166px;
	width: 100%;
}
.mypage_right_content {
	max-width: 920px;
	width: 100%;
}
.mypage_right_content {
	margin-left: 31px
}
.mypage_result_vod_list li {
	margin-right: 9px;
	width: 221px;
}
.mypage_result_vod_list li .thumb_img a>img {
	width: 100%;
}
.mypage_result_vod_list li:nth-child(5n) {
	margin-right: 9px;
}
.mypage_result_vod_list li:nth-child(6n) {
	margin-right: 9px;
}
.mypage_result_vod_list li:nth-child(4n) {
	margin-right: 0;
}
}