/* 여기에 작업 또는 수정할 당신의 css style을 설정하세요. (customizations) */

.tabs::-webkit-scrollbar{
    background-color:transparent;
    width:6px;
}
/* 스크롤바 막대 설정*/
.tabs::-webkit-scrollbar-thumb{
    background-color:#babac0;
    border-radius:16px;
}
.tabs::-webkit-scrollbar-thumb:hover{
    background-color:#a0a0a5;
}

/* sub nav */
.cont_area {
    display:flex;
    justify-content:flex-start;
    align-items: flex-start;
}
.cont_area .side_nav {
    position:relative;
    display:block;
}
.cont_area .side_nav ul {
    display:flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}
.cont_area .side_nav ul li {
    display:block;
    width:100%;
    border-bottom:1px solid #474747;
}
.cont_area .side_nav ul a {
    display:block;
    padding:.75em;
}
.cont_area .side_nav ul a p {
    font-size:1.125em;
    color:#858689;
}
.cont_area .side_nav ul .active a p {
    color:#fff;
}

.cont_area .side_nav .side_subnav {
    margin-top:2em;
    padding:1.75em 1em;
    border-radius:1em;
    background-color:#2a2a2a;
}
.cont_area .side_nav .side_subnav > span {
    display:block;
    margin-bottom:.5em;
    padding-bottom:.5em;
    font-weight:500;
    color:#e0e0e0;
    border-bottom:1px solid #363636;
}
.cont_area .side_nav .side_subnav ul li {
    border-bottom:1px solid #363636;
}
.cont_area .side_nav .side_subnav ul li a {
    color:#989898;
    text-align: center;
    border-radius:5em;
}
.cont_area .side_nav .side_subnav ul li.active {
    border-color:transparent;
}
.cont_area .side_nav .side_subnav ul li.active a {
    color:#fff;
    background-color:#141414;
}
.cont_area .content {
    position:relative;
    display:block;
}

.cont_area .content .cont_title {
    margin-bottom:1.25em;
}
.cont_area .content .cont_title span {
    font-size:1.625em;
    font-weight:600;
    color:#fff;
}
.cont_area .content .cont_title span small {
    font-size:.7em;
    font-weight:300;
    color:#b9b9b9;
}

.cont_area .content.list .terms_area {
    display:flex;
    flex-wrap:wrap;
    justify-content: flex-start;
    align-items: flex-start;
    gap:1em;
}
.cont_area .content.list .terms_area > div {
    position:relative;
    padding:1.5em 1.25em;
    background-color:#2a2a2a;
    border-radius:.625em;
}
.cont_area .content.list .terms_area > div.pickup_terms .input_area {
    gap:1em;
}
.cont_area .content.channel.list .terms_area .filter,
.cont_area .content.channel.list .terms_area .api_key {
    width:calc((100% - 1em) / 2);
}
.cont_area .content.channel.list .terms_area .search_terms,
.cont_area .content.list .terms_area .business_add {
    width:100%;
}

.cont_area .content.channel.list .terms_area > div > .title {
    margin-bottom:2em;
}
.cont_area .content.channel.list .terms_area > div > .title span {
    font-size:1.25em;
    color:#fff;
}
.input_area ul li {
	margin-bottom:10px;
}
.input_area input[type=text],
.input_area input[type=file],
.input_area input[type=number],
.sch_terms ul li .st_inp input[type=text],
.business_add .input_area input[type=text] {
    padding:1em;
    border-radius: .5em;
    border:none;
}

.input_area label{
	color:#fff;
}

.pickup_terms .input_area input[type=text],
.pickup_terms .input_area input[type=file] {
    min-width:50%;
    padding:.45em 1em;
}

.result_area ul {display:flex; font-size:1.5rem;}
.result_area ul li {text-align:center;margin-right:10px;}

.business_cal > .tit {
    display:block;
    margin-bottom:1em;
    padding:.75em 2em;
    width:100%;
    background-color:#0B0BD3;
    border-radius:.5em;
}
.business_cal > .tit span {
    display:block;
    font-size:1.25em;
    font-weight:500;
    color:#fff;
}

.calendar_area {
    padding:2em;
    background-color: #2a2a2a;
    border-radius: .5em;
}
.calendar_area .month_area {
    display:flex;
    justify-content: center;
    align-items: center;
    gap:4em;
}
.calendar_area .month_area span {
    font-size:1.5em;
    color:#858689;
}
.calendar_area .month_area span b {
    font-size:1.75em;
    color:#fff;
}
.calendar_area .calendar ul {
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
    align-items: center;
}
.calendar_area .calendar ul li {
    width:calc(100% / 7);
}
.calendar_area .calendar .weeks li {
    padding:.75em;
    background-color: #222;
}
.calendar_area .calendar .weeks li p {
    display:block;
    text-align:center;
    color:#fff;
}

.calendar_area .calendar .days {
    align-items: stretch;
}
.calendar_area .calendar .days li {
    padding:.5em;
    border-bottom:1px solid #494949;
}
.calendar_area .calendar .days li:nth-child(even) {
    background-color: #363636;
}
.calendar_area .calendar .days .today{
	background-color: #0b0bd4 !important;
}

.calendar_area .calendar .days li .day_num {
    margin-bottom:.5em;
}
.calendar_area .calendar .days li .day_num span {
    display:block;
    font-size:1.125em;
    text-align:center;
    color:#fff;
}
.calendar_area .calendar .days li .input_area {
    display:flex;
    justify-content: center;
    align-items: stretch;
    gap:.25em;
}
.calendar_area .calendar .days li .input_area button {
    display:block;
    padding:0 .5em;
    font-size:1.5em;
    color:#fff;
    background:none;
    border:1px solid #494949;
    border-radius:.5em;
}
.calendar_area .calendar .days li .input_area input {
    padding:.4em;
    width:3em;
    text-align:center;
}

.business_cal .result_area {
    margin-top:4em;
}
.business_cal .result_area > div > ul {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items: stretch;
    gap:0.5em;
}

.business_cal .result_area .result_top ul li {
    display:flex;
    justify-content: center;
    align-items: center;
    gap:1em;
    padding:1em;
    width:calc((100% - 3em) / 3);
    background-color: #2a2a2a;
    border-radius:.5em;
}
.business_cal .result_area .result_top ul li span {
    display:block;
    padding:20px;
    font-size:1.125em;
    color:#fff;
    background-color:#141414;
    border-radius:.8em;
}
.business_cal .result_area .result_top ul li p {
    display:flex;
    justify-content:center;
    align-items: center;
    gap:.5em;
    font-size:1.125em;
    color:#fff;
}
.business_cal .result_area .result_top ul li p b {
    font-size:1.75em;
}

.business_cal .result_area .result_bottom ul li {
    padding:20px;
	margin-top:1em;
    width:calc((100% - 6em) / 5);
	background-color: #2a2a2a;
	border-radius: .5em;
}
.business_cal .result_area .result_bottom ul li * {
    display:block;
    text-align:center;
}
.business_cal .result_area .result_bottom ul li .tit {
    font-size:0.9em;
    color:#fff;
}
.business_cal .result_area .result_bottom ul li .num {
    margin:.25em 0;
    font-size:1.875em;
    font-weight:600;
    color:#fff;
}
.business_cal .result_area .result_bottom ul li p {
    color:#989898;
}

.business_cal .guide_area {
    padding:2em;
    background-color:#141414;
    border-radius:1.875em;
}

.business_cal .guide_area .tit {
    display:flex;
    justify-content: flex-start;
    align-items: center;
    font-size:1.5em;
    color:#fff;
    gap:.25em;
}
.business_cal .guide_area .tit img {
    display:block;
}
.business_cal .guide_area > p {
    display:table;
    margin:1em 0 .5em;
    padding:.25em .5em;
    background-color: #e0e0e0;
    border-radius:5em;
}
.business_cal .guide_area ul li p {
    padding-left:.75em;
    position:relative;
    font-weight:300;
    color:#fff;
}
.business_cal .guide_area ul li p:before {
    content:'·';
    position:absolute;
    top:50%;
    left:0;
    font-size:2em;
    color:#fff;
    transform:translateY(-50%);
}

.result_area.dashboard {
    margin:2em 0;
}
.business_cal.dashboard > .tit {
    display:flex;
    justify-content: flex-end;
    align-items: center;
    gap:1em;
    padding:1em 2em;
}
.business_cal.dashboard > .tit a img {
    display:block;
}

.chart_area {
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
    align-items: stretch;
    gap:1.5em;
    margin:2em 0;
}
.chart_area .chart1 {
    padding:1em;
    width:100%;
    background-color:#fff;
    border-radius:1em;
}
.chart_area.check_list .chart1 {
    padding:1em;
    width:100%;
    height:30vw;
	min-height:190px;
    background-color:#fff;
    border-radius:1em;
}
.chart_area.check_list .chart2 {
    padding:1em;
    width:calc((100% - 1.5em) / 5 * 2);
    height:18vw;
    background-color:#fff;
    border-radius:1em;
}
.chart_area.check_list .chart3 {
    padding:1em;
	width:calc((100% - 1.5em) / 5 * 3);
	height:18vw;
    background-color:#fff;
    border-radius:1em;
	text-align:center;
}

.chart_area.check_list .chart2 #myChart2{
	margin: 0px auto;
}

.list_checkbox{
	width:20px;
	height:20px;
}

@media (max-width: 768px) {
    .container, .container-md, .container-sm {
        width: 90% !important;
    }
}

 .ch_list li .btn_area div {
	cursor:pointer;
    display:flex;
    justify-content: center;
    align-items: center;
    gap:.5em;
    padding:.5em 1em;
    background-color: #363636;
    border-radius:5em;
    transition: all ease-in-out .3s;
 }

 .ch_list li .btn_area div:hover {
    background-color: #0B0BD3;
 }

 .ch_list li .btn_area div p {
    font-size:.875em;
    color:#fff;
 }
 
 .ch_list li .btn_area div span {
    display:flex;
    justify-content: center;
    align-items: center;
    width:3em;
    height:3em;
    font-size:.5em;
    color:#fff;
    border-radius:50%;
    background-color: #1a1a1a;
 }
 
 .privacy-page{
	background:#fff;
	padding:20px;
 }
 
 .provision-page{
 	background:#fff;
	padding:20px;
 }
 
 
 .recommended_video,
 .recommended_channel {
    position: relative;
 }
 .content .recommended_video,
 .content .recommended_channel {
    margin-top:1em;
 }
 .content .recommended_video .conBox,
 .content .recommended_channel .conBox {
    padding-bottom:2em;
    border-bottom:1px solid #494949;
}
 .sec_title {
    display:flex;
    justify-content: space-between;
    align-items: center;
    width:100%;
 }
 .tap_wrap .sec_title {
    display:flex;
    flex-wrap:wrap;
    justify-content: flex-start;
    align-items: center;
    gap:1.25em;
 }
 .main-contents .sec_title > span {
    font-size:1.625em;
    font-weight:600;
    color:#fff;
 }
 
 .sec_title .more_btn {
    display:flex;
    justify-content: flex-end;
    align-items: center;
    gap:1em;
 }
 .sec_title .more_btn p {
    color:#6c6c6c;
 }
 
 .recommended_video .sec_title,
 .recommended_channel .sec_title {
    margin-bottom:1.25em;
 }
 .tap_wrap .tabs ul {
    display:flex;
    justify-content:flex-start;
    align-items: center;
    gap:.5em;
 }
 .tap_wrap .tabs ul li {
    padding:.5em 1em;
    border:1px solid #474747;
    border-radius:5em;
    color:#858689;
    cursor:pointer;
 }
 .tap_wrap .tabs ul li.on {
    background-color:#0B0BD3;
    border-color:#0B0BD3;
    color:#fff;
 }
 .conBox {
    display:none;
 }
 .conBox.on {
    display:block;
 }

 .ch_list > li div {
    background-color: #2a2a2a;
    border-radius: .5em;
 }
 
 .video_list li > *,
 .ch_list li > * {
    color:#fff;
 }
 .ch_list li .text_area * {
    text-align:center;
 }
 .video_list li .img_area,
 .ch_list li .img_area {
    width:100%;
    overflow:hidden;
 }
 .video_list li .img_area img {
    display:block;
    width:100%;
    transition:all ease-in-out .3s;
 }
 .ch_list li .img_area img {
    display:block;
    margin:0 auto;
    width:auto;
    max-width:100%;
 }
 .video_list li:hover .img_area img {
    transform:scale(1.1);
 }
 .video_list li .text_area {
    width:100%;
 }
 .video_list li .text_area .tit {
    display:block;
    width:100%;
    font-weight:600;
    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
 }
 .video_list li .text_area .name {
    display:block;
    margin-bottom: .25em;
    font-size:.875em;
    font-weight:400;
    color:#858689;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
 }
 .ch_list li .text_area .name {
    display:block;
    width:100%;
    font-weight:600;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
 }
 .video_list li .text_area .info {
    margin-bottom:.25em;
 }
 
 .video_list li .text_area .info li,
 .ch_list li .text_area .info li {
    display:flex;
    justify-content: center;
    gap:.5em;
 }
 .video_list li .text_area .info li {
    justify-content: flex-start;
 }
 .video_list li .text_area .info li p,
 .ch_list li .text_area .info li p {
    font-size:.875em;
 }
 .video_list li .text_area .info li p:first-child,
 .ch_list li .text_area .info li p:first-child {
    font-weight:500;
    color:#858689;
 }
 .video_list li .text_area .info li p:last-child,
 .ch_list li .text_area .info li p:last-child {
    font-weight:600;
    color:#B9B9B9;
 }
 .video_list li .text_area .date,
 .ch_list li .text_area .date {
    font-size:.875em;
    font-weight:600;
    color:#858689;
 }
 .video_list li .btn_area div,
 .ch_list li .btn_area div {
	cursor:pointer;
    display:flex;
    justify-content: center;
    align-items: center;
    gap:.5em;
    padding:.5em 1em;
    background-color: #363636;
    border-radius:5em;
    transition: all ease-in-out .3s;
 }
 .video_list li .btn_area div:hover,
 .ch_list li .btn_area div:hover {
    background-color: #0B0BD3;
 }
 .video_list li .btn_area div p,
 .ch_list li .btn_area div p {
    font-size:.875em;
    color:#fff;
 }
 .ch_list li .btn_area div span {
    display:flex;
    justify-content: center;
    align-items: center;
    width:3em;
    height:3em;
    font-size:.5em;
    color:#fff;
    border-radius:50%;
    background-color: #1a1a1a;
 }
 
@media (max-width: 768px) {
    .video_list {
        height: 392px;
		overflow-y: scroll;
		flex-wrap: nowrap;
    }
	
	.video_list li .img_area img{
		height:230px !important;
	}
	
	.ch_list {
        height: 454px;
		overflow-y: scroll;
		flex-wrap: nowrap;
    }
}