@charset "utf-8";

/*
@font-face {
    font-family: 'FlightSans-Title';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/2410-1@1.0/FlightSans-Title.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}
*/
@font-face{
	font-family: 'Pretendard';
	font-weight: 300;
	src: url("../fonts/Pretendard-Light.woff2") format('woff2'),
	url("../fonts/Pretendard-Light.woff") format('woff');
}
@font-face{
	font-family: 'Pretendard';
	font-weight: 400;
	src: url("../fonts/Pretendard-Regular.woff2") format('woff2'),
	url("../fonts/Pretendard-Regular.woff") format('woff');
}
@font-face{
	font-family: 'Pretendard';
	font-weight: 600;
	src: url("../fonts/Pretendard-Bold.woff2") format('woff2'),
	url("../fonts/Pretendard-Bold.woff") format('woff');
}
@font-face{
	font-family: 'Pretendard';
	font-weight: 800;
	src: url("../fonts/Pretendard-Black.woff2") format('woff2'),
	url("../fonts/Pretendard-Black.woff") format('woff');
}




body{font-family: 'Pretendard', sans-serif; color:#3d3d3d;}
body.layout-admin{background:#F4F4F6;}
.row > *{padding-left:10px; padding-right:10px; padding-top:10px; padding-bottom:10px;}





/*left menu*/
/*
.aside-primary{background-color:#fff;}
nav .nav-link{padding-top:18px; padding-bottom:18px;}
nav.nav-deep-dark .nav-item > a.nav-link{color:#3d3d3d;}
nav.nav-deep-dark.nav-deep-hover > ul > li.nav-item:hover,
nav.nav-deep-dark.nav-deep-hover > ul > li.nav-item.active{background-color:#F4F4F6 !important; border-left:4px solid #407FF5; }
nav.nav-deep-dark .nav-item:hover > .nav-link,
nav.nav-deep-dark .nav-item.active > .nav-link{color:#111; font-weight:600;}
nav .left_company{font-family: 'FlightSans-Title'; background-color:#407FF5 !important; color:#fff;}
nav .left_logout{font-weight:600;}
nav .left_logout a{display:block; color:#407FF5 !important;}
nav .left_logout:hover{background-color:#407FF5 !important;}
nav .left_logout:hover a{color:#fff !important;}
*/
.nav-link{color:#3d3d3d;}
.aside-primary{background-color:#fff;}
aside .nav-deep > ul > li.nav-title,
aside .nav-deep > ul > li > a.nav-link,
nav.nav-deep-dark .nav-item > a.nav-link{padding-top:17px; padding-bottom:17px; font-size:16px; color:#3d3d3d; word-break: keep-all;}
nav.nav-deep-dark.nav-deep-hover > ul > li.nav-item:hover,
nav.nav-deep-dark.nav-deep-hover > ul > li.nav-item.active{background-color:#F4F4F6 !important; border-left:5px solid #407FF5;}
nav.nav-deep-dark .nav-item.active > a.nav-link.depth_1{color:#407FF5; font-weight:600;}

nav.nav-deep-dark .nav-item:hover > .nav-link,
nav.nav-deep-dark .nav-item.active > .nav-link{color:#111;}
nav.nav-deep-dark .nav-item:hover > a.nav-link.depth_1{color:#407FF5; font-weight:600;}
nav.nav-deep-dark .nav-item:hover > a.nav-link.depth_2{color:#111; font-weight:600;}
nav.nav-deep-dark .nav-item.active > .nav-link.depth_2{font-weight:600;}



nav.nav-deep-dark.nav-deep-hover > ul > li.nav-item.active{position:relative;}
nav.nav-deep-dark.nav-deep-hover > ul > li.nav-item.active::before{position:absolute; display:block; width:30px; height:30px; right:0; top:-30px; content:''; background:url('../images/page/left_active_deco1.png') no-repeat center center / contain; }
nav.nav-deep-dark.nav-deep-hover > ul > li.nav-item.active::after{position:absolute; display:block; width:30px; height:30px; right:0; bottom:-30px; content:''; background:url('../images/page/left_active_deco2.png') no-repeat center center / contain; }
.nav-deep > ul > li > ul{padding-left:10px;}


nav .left_company{background-color:#407FF5 !important; color:#fff; font-weight:600;}
nav .left_logout{text-align:center;}
nav .left_logout a{display:inline-block; min-width:85%; color:#fff !important; font-weight:600; text-align:center; border-radius:30px; background-color:#1152cc; transition:0.3s;}
nav .left_logout:hover a{margin-left:-15px; background-color:#0c3f9e;}

nav.nav-deep-dark .nav-item > a.nav-link .group-icon.float-end i{display:none;}

@media screen and (max-width:768px) {
    aside .nav-deep > ul > li.nav-title,
    aside .nav-deep > ul > li > a.nav-link,
    nav.nav-deep-dark .nav-item > a.nav-link{padding-top:12px; padding-bottom:12px;}

    nav.nav-deep-dark .nav-item > a.nav-link{font-size:14px !important;}
}


/*하단 문의하기 버튼*/
.left_consult{background-color:#1152cc !important;}
.left_consult a{display:block; width:100%; height:100%; font-size:17px; font-weight:600; transition:0.3s;}
.left_consult a i{margin-right:10px;}
.left_consult a:hover{background-color:#0c3f9e;}
@media screen and (max-width:640px) {
    .left_consult a{font-size:15px;}
}











/*공통 스타일*/
.item_shadow_1{box-shadow: 5px 5px 20px rgba(0,0,0,0.1) !important;}
.bg_white{background-color:#fff;}
.flex_style{display:flex;}

@media screen and (max-width:1900px) {
    .w1900_full{width:100%;}
}

@media screen and (max-width:1700px) {
    .w1700_full{width:100%;}
}

@media screen and (max-width:1500px) {
    .w1500_full{width:100%;}
    .w1500_50{width:50%;}
}

@media screen and (max-width:768px) {
    .w768_full{width:100%;}
    .flex_none_w768{flex-direction: column; gap:20px;}
}






.page_title{position:relative; display:block; text-align:left; margin-bottom:10px !important; font-size:25px; color:#407FF5; font-weight:600;}
/* .page_title::before{position:absolute; display:block; width:100vw; height:100%; left:50%; top:0; transform:translateX(-50%); content:''; background:#407FF5; z-index: -1;} */


.box_inner{padding:20px; border-radius:20px;}
.box_title{position:relative; margin-bottom:10px; padding-bottom:10px; text-align:center; font-size:17px; color:#000; font-weight:600; border-bottom:1px solid #ddd;}
.box_title i{margin-right:7px;}
.box_title i::before{color:#5292FC;}
.box_title + .box_contents{margin-top:var(--bs-gutter-y);}



.count_box .item{margin-top:0; padding-top:0; padding-bottom:0; padding-left:5px; padding-right:5px;}
.count_box .item:nth-child(+n+3){margin-top:10px;}
.count_box .item_con{display:flex; flex-direction:column; justify-content: center; padding-top:15px; padding-bottom:15px; padding-left:15px; padding-right:15px;}
.count_box .item .icon{display:flex; justify-content: center; align-items: center; width:40px; height:40px; background-color:#fff; border-radius:10px; box-shadow: 5px 5px 20px rgba(0,0,0,0.1);}
.count_box .item .text_group{margin-top:10px;}
.count_box .item .text_group .dd{font-size:22px; font-weight:600; color:#407FF5;}
.count_box .item .text_group .dt{margin-top:5px; font-size:14px; color:#333; word-break: keep-all; font-weight:400;}
.count_box .item .text_group .dt .light{font-weight:300;}
/*색상
.count_box .item.n1 .item_inner{background:linear-gradient(to right, #43C2F8, #8FDCFE);}
.count_box .item.n2 .item_inner{background:linear-gradient(to right, #47DBB0, #75D7BD);}
.count_box .item.n3 .item_inner{background:linear-gradient(to right, #6E48FF, #8C6BFE);}
.count_box .item.n4 .item_inner{background:linear-gradient(to right, #407FF5, #6FA1FD);}
.count_box .item.n1 .icon i{color:#43C2F8;}
.count_box .item.n2 .icon i{color:#47DBB0;}
.count_box .item.n3 .icon i{color:#6E48FF;}
.count_box .item.n4 .icon i{color:#407FF5;}*/
.count_box .item .item_inner{background-color:#F1F2F7;}
.count_box .item .icon i{color:#407FF5;}
/*
#chatwordcloud span{display:block; border-radius:10px;}
#chatwordcloud span:nth-child(4n+1) { background-color: #43C2F8 !important; }
#chatwordcloud span:nth-child(4n+2) { background-color: #47DBB0 !important; }
#chatwordcloud span:nth-child(4n+3) { background-color: #6E48FF !important; }
#chatwordcloud span:nth-child(4n+4) { background-color: #407FF5 !important; }
*/
@media screen and (max-width:1900px){
    /*google ads*/
    .count_box.length5 .item{width:20% !important;}
    .count_box.length5 .item:nth-child(+n+3){margin-top:0;}
}
@media screen and (max-width:1620px){
    /* .count_box .item .text_group .dd{font-size:18px;} */
}
@media screen and (max-width:1400px){
    /*google ads*/
    .count_box.length5 .item:nth-child(1),
    .count_box.length5 .item:nth-child(2){width:50% !important;}
    .count_box.length5 .item:nth-child(3),
    .count_box.length5 .item:nth-child(4),
    .count_box.length5 .item:nth-child(5){width:33.333% !important; margin-top:10px;}

}
@media screen and (max-width:1700px) and (min-width:992px){
    .count_box .item{width:25% !important;}
    .count_box .item:nth-child(+n+3){margin-top:0;}
    .count_box .item_con{padding-left:25px;}
    /* .card-body{padding-left:0; padding-right:0;} */
}
@media screen and (max-width:1000px){
    .page_title{font-size:22px;}
}
@media screen and (max-width:768px){
    .count_box .item_con{flex-direction: row; gap:5px; justify-content: start; padding-top:10px; padding-bottom:10px;}
    .count_box .item .icon{width:20px; height:20px; border-radius:0; box-shadow: none; background:none;}
    .count_box .item .icon i::before{font-size:17px;}
    .count_box .item .text_group{margin-top:0;}
    .count_box .item .text_group .dd{font-size:17px;}
}
@media screen and (max-width:640px){
    .page_title{font-size:20px;}
    .card-body{padding-left:5px; padding-right:5px;}

    .count_box.length5 .item:nth-child(3),
    .count_box.length5 .item:nth-child(4){width:50% !important;}
    .count_box.length5 .item:nth-child(5){width:100% !important;}
    

}
@media screen and (min-width:992px){

}

.table > :not(caption) > * > *{color:#3d3d3d !important;}
.table-striped > tbody > tr{border-bottom:1px solid #eee;}
.table-striped > tbody > tr:first-child{border-top:1px solid #eee;}
.table-striped > tbody > tr:nth-of-type(odd) > *{--bs-table-bg-type:none !important;}
.table-striped > tbody > tr:hover td{background-color:#E7F5FF !important; --bs-table-bg-type:#E7F5FF !important;}




/*페이징*/
.pagination{justify-content: center;}
.page-link{border:none; font-size:16px; color:#6d6d6d;}
/* .pagination .page_arrow{display:block; } */
.pagination .page-item.page_arrow a{display:block; width:10px; height:36px; font-size:0; line-height:0;}
.pagination .page-item.page_arrow.first a{background:url('../images/page/btn_first.gif') no-repeat center center;}
.pagination .page-item.page_arrow.prev a{background:url('../images/page/btn_prev.gif') no-repeat center center;}
.pagination .page-item.page_arrow.next a{background:url('../images/page/btn_next.gif') no-repeat center center;}
.pagination .page-item.page_arrow.last a{background:url('../images/page/btn_end.gif') no-repeat center center;}


/*active*/
.page-link.active, .active > .page-link{background:none ; border:none; font-weight:600; color:#1152cc;}



/*레이어팝업*/
.modal-header{padding-left:30px !important; padding-right:30px !important;}
.modal-body{padding-left:30px !important; padding-right:30px !important;}
.modal-title{font-weight:600;}
@media screen and (max-width:640px){
    .modal-header{padding-left:20px !important; padding-right:20px !important;}
    .modal-body{padding-left:20px !important; padding-right:20px !important;}

}



/*유튜브*/
.youtube_con .card-body{padding-left:15px !important; padding-right:15px !important; color:#3d3d3d !important;}
.youtube_con .thumb_title{font-weight:500;}
.youtube_con .thumb_date{font-size:14px; color:#7d7d7d;}
.youtube_modal .youtube_desc{color:#3d3d3d !important;}
.youtube_modal .card-body{display:flex; gap:5px; justify-content: center; align-items: center;}
.youtube_modal .card-title{font-size:17px; color:#3d3d3d; }
.youtube_modal .card-title i{margin-right:5px;}
.youtube_modal .card-title i::before{color:#407FF5;}
.youtube_modal .card-text{font-size:17px; color:#407FF5; font-weight:600;}
.youtube_modal .modal_desc{color:#3d3d3d;}
.youtube_modal .youtube_date{color:#3d3d3d !important;}
.youtube_modal .youtube_date span{color:#3d3d3d !important;}
@media screen and (max-width:992px){
    .youtube_modal .card-body{display:block;}
    .youtube_modal .youtube_count .item{padding-left:3px; padding-right:3px; padding-bottom:6px;}
}
@media screen and (max-width:768px){
    .youtube_modal .card-body{display:flex; padding-top:7px; padding-bottom:7px;}
    .youtube_modal .youtube_count .item:nth-child(+n+3){margin-top:0; padding-top:0;}
    .youtube_modal .youtube_count .card-text{font-size:14px !important;}

}


/*모바일*/
body.layout-admin #header{background-color:#407FF5;}
#aside-main .logo_area{position:relative;}
#aside-main .logo_area .menu_close{position:absolute; display:none; width:30px; height:30px; right:-40px; top:10px;}
#aside-main .logo_area .menu_close img{width:100%;}


#aside-main.js-aside-show .logo_area .menu_close{display:block;}






/*모바일 테이블*/
@media screen and (max-width:768px){
    .table-responsive.m_table_650 .table{min-width:650px !important;}
}







/*go top*/
#btnScrollTo{background:linear-gradient(180deg, #5292FC 0, #5292FC) !important;}





/*버튼 focus purple -> blue*/
.btn-close{--bs-btn-close-focus-shadow: 0 0 0 0.25rem rgba(64, 127, 245, 0.25) !important;}
.pagination{--bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(64, 127, 245, 0.25) !important;}





/*이용약관, 개인정보처리방침*/
.terms{margin-top:50px;}
.terms .title{margin-bottom:40px; font-size:30px; text-align:center; font-weight:600;}
.terms h5{margin-bottom:5px; font-size:18px;color:#000; font-weight:500;}
.terms p{font-size:15px;color:#3d3d3d;}
.terms .hr{margin:0 !important; padding:0 !important; height:15px;}
.terms strong{font-weight:600;}
.terms ul,
.terms ol{padding:20px 40px; background-color:#f9f9f9;}
.terms ol ol,
.terms ol ul,
.terms ul ul,
.terms ul ol{padding-top:10px; padding-bottom:10px;}
.terms p + ul,
.terms p + ol{margin-top:-20px;}
.terms li{font-size:15px;color:#3d3d3d;}
@media screen and (max-width:992px){
    .terms{margin-top:20px;}
    .terms .title{margin-bottom:20px; font-size:20px;}
    .terms h5{font-size:16px;}
    .terms p{font-size:13px;}
    .terms ul,
    .terms ol{padding:10px 30px;}
    .terms li{font-size:13px;}

}



/*셀렉트박스 focus*/
.form-select:focus{box-shadow: 0 0 0 0.25rem rgba(64, 127, 245, 0.25) !important;}




/*히트맵 페이지*/
.hitmap_report .box_container.n1 .box_contents{display:flex;}
.hitmap_report .box_container .group.n1{position:sticky; top:0; display:flex; flex-direction:column; gap:40px; width:350px; height:450px; text-align:center;}
.hitmap_report .box_container .group.n1 .box_title{padding-bottom:5px; border-bottom:none; text-align: left;}
.hitmap_report .box_container .group.n1 .select_box{width:100%;}
.hitmap_report .box_container .group.n1 .item .btn_group{padding:10px 20px !important; font-size:0; line-height:0; background-color:#f4f8ff; border-radius:30px;}
.hitmap_report .box_container .group.n1 .item .btn{height:40px; padding-left:20px; padding-right:20px; font-size:15px; border-radius:30px; font-weight:500; border:none !important;}
/* .hitmap_report .box_container .group.n1 .item .btn + .btn{margin-left:0;} */
.hitmap_report .box_container .group.n1 .item .btn:hover{background-color:#407FF5 !important; color:#fff !important; box-shadow: none !important;}
.hitmap_report .box_container .group.n1 .item .btn.btn-primary{background-color:#407FF5; box-shadow: 0 5px 5px rgba(0,0,0,0.08);}
.hitmap_report .box_container .group.n1 .item .btn.btn-secondary{background:none; color:#3d3d3d;}
.hitmap_report .box_container .group.n2{width:calc(100% - 350px);}
/* .hitmap_report .box_container .group.n2{margin-top:40px;} */
/* .hitmap_report .box_container .group.n2 .nav-tabs{border-bottom:none;} */
.hitmap_report #heatmap-container canvas{width:100%; max-width:100%; border-radius:8px;}
.hitmap_report #scroll-bar-container {width: 20px; position: relative; background: transparent; display: none;}
.hitmap_report #scroll-bar-container div {position: absolute; width: 100%; border-radius: 5px;}
.hitmap_report .box_container .group.n2 .url_desc{margin:10px auto; padding-left:15px; padding-right:15px; /*background-color:#f4f8ff;*/}
.hitmap_report .box_container .group.n2 .url_desc .device-text{color:#407FF5;}
.hitmap_report .box_container .group.n2 .url_desc .desc{margin-bottom:0; font-weight:600;}
.hitmap_report .box_container .group.n2 .url_desc .desc strong{color:#407FF5;}
.hitmap_report .box_container .group.n2 .url_desc .desc strong i{margin-right:5px;}

/*탭메뉴*/
.hitmap_report .tab_group .nav-tabs{padding:10px 20px !important; border:none; background-color:#f4f8ff; border-radius:10px; border-radius:30px;}
.hitmap_report .tab_group .nav-tabs .nav-item + .nav-item{margin-left:.5rem;}
.hitmap_report .tab_group .nav-tabs .nav-link{display:inline-block; height:40px; padding:0 20px; line-height:40px; font-size:15px; border-radius:30px; font-weight:500; border:none !important; color:#3d3d3d;}
.hitmap_report .tab_group .nav-tabs .nav-link:hover{background-color:#407FF5 !important; color:#fff !important;}
.hitmap_report .tab_group .nav-tabs .nav-link.active{background-color:#407FF5; color:#fff; box-shadow: 0 5px 5px rgba(0,0,0,0.08);}

/*클릭 히트맵*/
.hitmap_report #heatmap-container #heatmap-image{display: none; max-width: 100%; width: 750px; height: auto;  border: 1px solid #ddd; border-radius: 8px;}
.hitmap_report #heatmap-container #heatmap-image.tablet_img{width:550px;}
.hitmap_report #heatmap-container #heatmap-image.m_img{width:400px;}

/*스크롤 히트맵*/
.hitmap_report #scroll-container #scroll-image{display: none; max-width:100%; width: 750px; border: 1px solid #ddd; border-radius: 8px;}
.hitmap_report #scroll-container #scroll-image.tablet_img{width:550px;}
.hitmap_report #scroll-container #scroll-image.m_img{width:400px;}

@media screen and (max-width:1400px){
    .hitmap_report .box_container .group.n1{width:280px;}
    .hitmap_report .box_container .group.n1 .item .btn_group{padding:10px 10px; border-radius:10px;}
    .hitmap_report .box_container .group.n1 .item .btn{padding-left:10px; padding-right:10px; border-radius:5px; font-size:14px;}
    .hitmap_report .box_container .group.n2{width:calc(100% - 280px);}
    .hitmap_report .tab_group .nav-tabs{border-radius:10px;}
    .hitmap_report .tab_group .nav-tabs .nav-link{padding-left:10px; padding-right:10px; border-radius:5px; font-size:14px;}

}
@media screen and (max-width:1200px){
    .hitmap_report .box_container .group.n1{gap:25px;}
    .hitmap_report .box_container .group.n2 .url_desc .device-text{display:block;}
}
@media screen and (max-width:768px){
    .hitmap_report .box_container.n1 .box_contents{flex-direction: column; gap:20px;}
    .hitmap_report .box_container .group.n1{width:100%; height:auto; position:relative;}
    .hitmap_report .box_container .group.n1 .box_title{padding-bottom:0;}
    .hitmap_report .box_container .group.n1 .item .btn_group{padding-top:7px; padding-bottom:7px;}
    .hitmap_report .box_container .group.n1 .item .btn{height:35px;}
    .hitmap_report .box_container .group.n2{width:100%;}
    .hitmap_report .tab_group .nav-tabs{padding-top:7px; padding-bottom:7px;}
    .hitmap_report .tab_group .nav-tabs .nav-link{height:35px; line-height:35px;}
}