/*
 * 공통 컴포넌트 CSS
	
	[Naming Convention]
	 - 모든 클래스명 앞에 "cmn_" 을 포함시킨다.
*/

/***********  링크 *************/
.cmn_link {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

:where(.cmn_link:link, .cmn_link:visited, .cmn_link:focus, .cmn_link:active) {
	color: rgba(1, 1, 0, 0.70);
}

.cmn_link:hover {
	color: rgba(1, 1, 0, 0.70);
	text-decoration: underline !important;
}
/***********  링크 *************/

/* 아이템 리스트  S */
.cmn_item_list {
	display : flex;
	gap : 16px;
	flex-wrap: wrap;
	max-height: 240px;
	overflow-y: auto;
}
.cmn_item_list .cmn_item {
	display: flex;
	height: 72px;
	padding: 11px 16px;
	gap: 8px;
	border-radius: 12px;
	border: 1px solid #EAEAEA;
	background: #FFF;
	width: 234px;
	box-sizing: border-box;
	align-items: center;
	justify-content: left;
	position: relative;
}

.cmn_industy:hover,
.cmn_item_list .cmn_item .cmn_name:hover {
	text-decoration : underline;
}

.cmn_item_list .cmn_item .cmn_name {
	overflow: hidden;
	color: #353C49;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	max-width: 150px;
	height: 28px;
    line-height: 28px;
}

.cmn_item_list > .cmn_item > .cmn_icon,
.cmn_item_list > .cmn_item > .cmn_icon_area > .cmn_icon {
	width: 40px;
	height: 40px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: unset;
	background-color: unset;
	overflow: hidden;
	border-radius: 6.75px;
    color: #FFF;
    font-size: 17.5px;
    font-weight: 400;
	background-size: 40px 40px;
    background-position: center;
    background-repeat: no-repeat;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 0px 1px inset;
}

.cmn_item_list > .cmn_item > .cmn_icon:has(.android_only_icon) {
	overflow : visible;
}

.cmn_item_list .cmn_item .cmn_edit_btn {
	width: 22px;
	height: 22px;
	border-radius: 11px;
	border: 1px solid #EEE;
	background: #FFF;
	margin-left: auto;
	background-image: url('/resources/img/common/edit_btn.svg');
	background-repeat: no-repeat;
	background-size: 14px;
	background-position: center;
}

.cmn_item_list .cmn_item .cmn_no_icon {
	background-color: #93DFFF;
    font-size: 14px;
    color: #FFF;
	width: 40px;
	height: 40px;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: 6.75px;
}

.cmn_item_list .cmn_item .cmn_icon .cmn_blur {
	width: 140%;
	height: 140%;
	position: absolute;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	background-color: lightgray;
	filter: blur(15px);
	-webkit-filter: blur(15px);
	opacity: 0.4;
}

.cmn_item_list .cmn_item .cmn_icon .cmn_icon_area {
	width: 22.5px;
	height: 22.5px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100%;
	z-index: 1799;
	border-radius: 6px;
}

.cmn_item_list .cmn_item .cmn_icon .cmn_icon_area.only_icon {
	width: 40px;
	height: 40px;
}

.cmn_item_list .cmn_item .cmn_os {
	display : flex;
	gap : 4px;
}

.cmn_item_list .cmn_item .cmn_os_item.small {
	padding : 2px;
}

.cmn_item_list .cmn_item .cmn_os_item {
	background-repeat: no-repeat;
	background-position: center;
	background-size : 10px;
	border-radius: 4px;
	border: 1px solid rgba(0, 0, 0, 0.05);
	display: flex;
	padding: 5px 6px;
	justify-content: center;
	align-items: center;
}

.cmn_item_list .cmn_item .cmn_os_item.dim {
    border: none;
    background-color: #F8F8F8;
    opacity: 1 !important;
}

.cmn_item_list .cmn_item .cmn_os .cmn_os_all .cmn_plus {
	width: 10px;
	height: 10px;
	background-image: url('/resources/img/app/plus.svg');
}

.cmn_item_list .cmn_item .cmn_os .cmn_ios {
	width: 10px;
	height: 10px;
	background-image: url('/resources/img/app/ios.svg');
}

.cmn_item_list .cmn_item .cmn_os .cmn_aos {
	width: 10px;
	height: 10px;
	background-image: url('/resources/img/app/aos.svg');
}

.cmn_aos.android_only_icon {
	width: 12px;
	height: 12px;
	padding : 3px;
	cursor : pointer;
	background-size : 12px;
	background-repeat: no-repeat;
	background-image: url('/resources/img/app/aos.svg');
	border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.05);
    background-position: center;
}

.cmn_aos.android_only_icon.size_16 {
	width: 8px;
	height: 8px;
	padding : 3px;
	background-size : 10px;		
}

.cmn_aos.android_only_icon.size_12 {
	width: 8px;
	height: 8px;
	padding : 2px;
	background-size : 8px;
}

.cmn_item_list .cmn_item .cmn_os_item.small .cmn_ios,
.cmn_item_list .cmn_item .cmn_os_item.small .cmn_plus,
.cmn_item_list .cmn_item .cmn_os_item.small .cmn_aos,
.cmn_item_list .cmn_item .cmn_os_item.small.cmn_aos,
.cmn_item_list .cmn_item .cmn_os_item.small.cmn_ios{
	width : 8px;
	height : 8px;
	background-size : 8px;
}

.cmn_item_list .cmn_item .cmn_store {
	display : flex;
}

.cmn_item_list .cmn_item .cmn_store .cmn_icon {
	width: 14px;
	height: 14px;
	background-size : 14px 14px;
	
}

.cmn_item_list .cmn_item .cmn_store .cmn_icon.cmn_google{
	background-image: url('/resources/img/common/play_store_icon.svg');
}

.cmn_item_list .cmn_item .cmn_store .cmn_icon.cmn_apple{
	background-image: url('/resources/img/common/app_store.svg');
}

.cmn_item_list .cmn_item .cmn_os .cmn_aos.dim,
.cmn_item_list .cmn_item .cmn_os .dim .cmn_aos,
.cmn_os.dim .cmn_aos{
	background-image: url('/resources/img/common/android_dim.svg');
}

.cmn_item_list .cmn_item .cmn_os .cmn_ios.dim,
.cmn_item_list .cmn_item .cmn_os .dim .cmn_ios,
.cmn_os.dim .cmn_ios{
	background-image: url('/resources/img/common/ios_dim.svg');
}

.cmn_item_list .cmn_item .cmn_os .cmn_os_all.dim .cmn_plus,
.cmn_os.dim .cmn_plus{
	background-image: url('/resources/img/common/plus_dim.svg');
}

.cmn_item_list .cmn_item .cmn_store .cmn_name {
	color: #707683;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}
/* 아이템 리스트  E */


/***********  버튼 그룹   *************/
.cmn_button_group  {
	box-sizing: border-box;
	width: fit-content;
    display: flex;
    border-radius: 4px;
    border: 1px solid #EAEAEA;
    background-color: #FFFFFF;
    height: 28px;
}

.cmn_button_group:has(.integrate_excel) {
	border : none;
}

.cmn_button_group.h20  {
	height: 20px;
	border-radius : 4px;
}

.cmn_button_group.h36  {
	height: 36px;
	border-radius : 6px;
}

.cmn_button_group.h40  {
	height: 40px;
	border-radius : 6px;
}

.cmn_button_group.h48  {
	height: 48px;
	border-radius : 8px;
}

.cmn_button_group .btn_item {
	padding: 15px 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    font-weight: 400;
    font-size: 13px;
    color: #707683;
	border-radius : 4px;
}

.cmn_button_group .btn_item .wrapper {
	font-size : 12px;
}

.cmn_button_group.h36 .btn_item .wrapper {
	font-size : 13px;
}

.cmn_button_group.h40 .btn_item .wrapper,
.cmn_button_group.h48 .btn_item .wrapper{
	font-size : 14px;
}

.cmn_button_group .btn_item  {
	padding: 0px 12px;
}

.cmn_button_group.h36 .btn_item  {
	padding: 0px 20px;
}
 
.cmn_button_group.h40 .btn_item  {
	padding: 0px 28px;
}

.cmn_button_group.h48 .btn_item  {
	padding: 0px 36px;
}

.cmn_button_group.icon .btn_item  {
	padding: 5px;
}

.cmn_button_group.icon.h20 .btn_item  {
	padding: 3.571px;
}

.cmn_button_group.icon.h36 .btn_item  {
	padding: 8px;
}
 
.cmn_button_group.icon.h40 .btn_item  {
	padding: 8px;
}

.cmn_button_group.icon.h48 .btn_item  {
	padding: 11px;
}

.cmn_button_group .btn_item + .btn_item {
	border-left: 1px solid rgba(234, 234, 234, 1);
}

.cmn_button_group .btn_item:not(.selected) + .btn_item:not(.selected) {
    border-top-left-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
}

.cmn_button_group.h36 .btn_item.selected  {
	border-radius : 6px;
}
 
.cmn_button_group.h40 .btn_item.selected  {
	border-radius : 6px;
}

.cmn_button_group.h48 .btn_item.selected  {
	border-radius : 8px;
}

.cmn_button_group .btn_item.selected {
	box-shadow: 0 0 0 1px #0099FF;
	color: #09F;
	background: #F8FBFF;
	border-radius : 4px;
}

.cmn_button_group .btn_item.dim {
	background: #FBFBFB;
}

.cmn_button_group .btn_item.selected:hover {
	background: linear-gradient(0deg, rgba(0, 153, 255, 0.02) 0%, rgba(0, 153, 255, 0.02) 100%), #F8FBFF !important;
}

.cmn_button_group .btn_item.selected .wrapper {
	font-weight : 500;
}

.cmn_button_group .btn_item:not(.dim):hover {
	background: rgba(0, 0, 0, 0.02);
}

.cmn_button_group .btn_item#prevBtn:not(.dim):hover {
    border-top-right-radius: unset;
    border-bottom-right-radius: unset;
}

.cmn_button_group .btn_item.selected + .btn_item,
.cmn_button_group .btn_item + .btn_item.selected {
	border-left: 1px solid rgba(234, 234, 234, 0 ) !important;
}

.cmn_button_group.icon .btn_item .icon {
	width: 18px;
	height: 18px;
	background-size: 18px 18px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button_group.icon.h20 .btn_item .icon {
	width: 12.857px;
	height: 12.857px;
	background-size: 12.857px 12.857px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button_group.icon.h36 .btn_item .icon {
	width: 19px;
	height: 19px;
	background-size: 19px 19px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button_group.icon.h40 .btn_item .icon {
	width: 24px;
	height: 24px;
	background-size: 24px 24px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button_group.icon.h48 .btn_item .icon {
	width: 26px;
	height: 26px;
	background-size: 26px 26px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button_group.icon .btn_item.prev_btn .icon {
	background-image:url("/resources/img/common/prev_btn.svg");
}

.cmn_button_group.icon .btn_item.next_btn .icon {
	background-image:url("/resources/img/common/next_btn.svg");
}

.has_tooltip_btn .tooltip_crew {
  left: 50%;
  transform: translateX(-50%);
}

.cmn_button_group .btn_item .tooltip_crew,
.has_tooltip_btn .tooltip_crew {
	display: none;
	position: absolute;
	padding: 6px 10px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 2px;
	z-index : 9999;
	border-radius: 6px;
	border: 1px solid rgba(0, 0, 0, 0.10);
	background: rgba(255, 255, 255, 0.90);
	box-shadow: 0px 4px 8px -2px rgba(0, 0, 0, 0.08), 0px 2px 4px -2px rgba(0, 0, 0, 0.04);
	backdrop-filter: blur(5px);
	white-space: nowrap;
}

.cmn_button_group .btn_item .tooltip_crew,
.has_tooltip_btn .tooltip_crew {
	top: 32px;
}

.cmn_button_group.h36 .btn_item .tooltip_crew {
	top: 40px;
}

.cmn_button_group.h40 .btn_item .tooltip_crew {
	top: 44px;
	z-index : 9000;
}

.cmn_button_group.h48 .btn_item .tooltip_crew {
	top: 52px;
}

.cmn_button_group .btn_item:not(.dim):hover .tooltip_crew,
.has_tooltip_btn.avtive:not(.dim):hover .tooltip_crew {
	display: inline-flex;
}

.cmn_button_group .btn_item .tooltip_crew .tooltip_text,
.has_tooltip_btn .tooltip_crew .tooltip_text {
	color: #56687F;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 18px;
	-webkit-user-select: none; /* Safari/Chrome */
	-moz-user-select: none;    /* Firefox */
	-ms-user-select: none;     /* IE/Edge */
	user-select: none;         /* 표준 */
}
/***********  버튼 그룹   *************/


/***********  버튼 *************/
.cmn_button{
	box-sizing: border-box;
	display: inline-flex;
	height: 28px;
	padding: 0px 12px 0 10px;
	justify-content: center;
	align-items: center;
	gap: 4px;
	flex-shrink: 0;
	border-radius: 4px;
	border: 1.002px solid #EAEAEA;
	color: #707683;
	font-size: 12px;
	font-weight: 400;
	cursor: pointer;
}

.cmn_button.h36{
	height: 36px;
	border-radius: 6px;
	padding: 0px 20px;
	font-size: 13px;
	gap: 4px;
}

.cmn_button.h40{
	height: 40px;
	border-radius: 6px;
	padding: 0px 28px;
	font-size: 14px;
	gap: 4px;
}

.cmn_button.h40 div {
	font-size : 14px;
}

.cmn_button.h48{
	height: 48px;
	border-radius: 8px;
	padding: 0px 36px;
	font-size: 14px;
	gap: 12px;
}

.cmn_button:hover, 
.cmn_button.hover {
	background: rgba(0, 0, 0, 0.02);
}

.cmn_button.dim{
	opacity: 0.3 !important;
	cursor: default;
}

.cmn_button.round{
	border-radius: 14px;
}

.cmn_button.round.h36{
	border-radius: 18px;
}

.cmn_button.round.h40{
	border-radius: 20px;
}

.cmn_button.round.h48{
	border-radius: 24px;
}

.cmn_button:where(.selected, .softfill){
	border: 1.002px solid #09F;
	background: #F8FBFF;
	color: #09F;
}

.cmn_button:where(.selected, .softfill):hover,
.cmn_button:where(.selected, .softfill).hover{
	background: linear-gradient(0deg, rgba(0, 153, 255, 0.02) 0%, rgba(0, 153, 255, 0.02) 100%), #F8FBFF;
}

.cmn_button:where(.fill){
	border: none;
	background: #09F;
	color: #FFF;
}

.cmn_button:where(.fill):hover,
.cmn_button:where(.fill).hover{
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.05) 100%), #09F;
}

.cmn_button:where(.ghost){
	border: none;
	background: transparent;
	color: #707683;
}

.cmn_button:where(.ghost):hover,
.cmn_button:where(.ghost).hover{
	background: rgba(0, 0, 0, 0.02);
}

.cmn_button.icon .icon{
	width: 14px;
	height: 14px;
	background-size: 14px 14px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button.icon.h36 .icon{
	width: 18px;
	height: 18px;
	background-size: 18px 18px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button.icon.h40 .icon{
	width: 20px;
	height: 20px;
	background-size: 20px 20px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button.icon.h48 .icon{
	width: 20px;
	height: 20px;
	background-size: 20px 20px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button.icon {
	gap: 2px;
}

.cmn_button.icon.h36 {
	gap: 4px;
}

.cmn_button.icon.h40 {
	gap: 4px;
}

.cmn_button.icon.h48 {
	gap: 6px;
}

.cmn_button.icon.left .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_left_nor.svg');
}

.cmn_button.icon.left.check .icon{
	background-image: url('/resources/img/common/ico_check.svg');
}

.cmn_button.icon.left:hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_left_nor_hover.svg');
}

.cmn_button.icon.left.check:hover .icon{
	background-image: url('/resources/img/common/ico_check.svg');
}

.cmn_button.selected.icon.left.check:hover .icon{
	background-image: url('/resources/img/common/btn_check_none.svg');
}

.cmn_button.icon.left:where(.selected, .softfill) .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_left_softfill.svg');
}

.cmn_button.icon.left.check:where(.selected, .softfill) .icon{
	background-image: url('/resources/img/common/btn_check_none.svg');
}

.cmn_button.icon.left:where(.selected, .softfill):hover .icon,
.cmn_button.icon.left:where(.selected, .softfill).hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_left_softfill_hover.svg');
}

.cmn_button.icon.left.check:where(.selected, .softfill):hover .icon,
.cmn_button.icon.left.check:where(.selected, .softfill).hover .icon{
	background-image: url('/resources/img/common/btn_check_foc.svg');
}

.cmn_button.icon.left:where(.fill) .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_left_fill.svg');
}

.cmn_button.icon.left:where(.fill):hover .icon,
.cmn_button.icon.left:where(.fill).hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_left_fill_hover.svg');
}

.cmn_button.icon.right .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_right_nor.svg');
}

.cmn_button.icon.right:hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_right_nor_hover.svg');
}

.cmn_button.icon.right:where(.selected, .softfill) .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_right_softfill.svg');
}

.cmn_button.icon.right:where(.selected, .softfill):hover .icon,
.cmn_button.icon.right:where(.selected, .softfill).hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_right_softfill_hover.svg');
}

.cmn_button.icon.rightt:where(.fill) .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_right_fill.svg');
}

.cmn_button.icon.right:where(.fill):hover .icon,
.cmn_button.icon.right:where(.fill).hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_right_fill_hover.svg');
}
/***********  버튼 *************/


/***********  아이콘버튼 *************/
.cmn_button_icon{
	box-sizing: border-box;
	display: inline-flex;
	height: 28px;
	width: 28px;
	justify-content: center;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
	border-radius: 4px;
	border: 1.002px solid #EAEAEA;
	background: #FFF;
	position: relative;
	cursor: pointer;
}

.cmn_button_icon.h36{
	width: 36px;
	height: 36px;
	border-radius: 6px;
	gap: 10px;
}

.cmn_button_icon.h40{
	width: 40px;
	height: 40px;
	border-radius: 6px;
	gap: 10px;
}

.cmn_button_icon.h48{
	width: 48px;
	height: 48px;
	border-radius: 8px;
	gap: 10px;
}

.cmn_button_icon:hover, 
.cmn_button_icon.hover {
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.02) 100%), #FFF;
}

.cmn_button_icon.dim{
	opacity: 0.3 !important;
	cursor: default;
}

.cmn_button_icon.round{
	border-radius: 14px;
}

.cmn_button_icon.round.h36{
	border-radius: 18px;
}

.cmn_button_icon.round.h40{
	border-radius: 20px;
}

.cmn_button_icon.round.h48{
	border-radius: 24px;
}

.cmn_button_icon:where(.selected, .softfill){
	border: 1.002px solid #09F;
	background: #F8FBFF;
	color: #09F;
}

.cmn_button_icon:where(.selected, .softfill):hover,
.cmn_button_icon:where(.selected, .softfill).hover{
	background: linear-gradient(0deg, rgba(0, 153, 255, 0.02) 0%, rgba(0, 153, 255, 0.02) 100%), #F8FBFF;
}

.cmn_button_icon:where(.fill){
	border: none;
	background: #09F;
	color: #FFF;
}

.cmn_button_icon:where(.fill):hover,
.cmn_button_icon:where(.fill).hover{
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.05) 100%), #09F;
}

.cmn_button_icon:where(.ghost){
	border: none;
	background: transparent;
	color: #707683;
}

.cmn_button_icon:where(.ghost):hover,
.cmn_button_icon:where(.ghost).hover{
	background: rgba(0, 0, 0, 0.02);
}

.cmn_button_icon .icon{
	width: 18px;
	height: 18px;
	background-size: 18px 18px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button_icon.h36 .icon{
	width: 19px;
	height: 19px;
	background-size: 19px 19px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button_icon.h40 .icon{
	width: 24px;
	height: 24px;
	background-size: 24px 24px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button_icon.h48 .icon{
	width: 26px;
	height: 26px;
	background-size: 26px 26px;
	background-position: center;
	background-repeat: no-repeat;
}

.cmn_button_icon .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_arrow_nor.svg');
}

.cmn_button_icon:hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_arrow_nor_hover.svg');
}

.cmn_button_icon.close .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_arrow_close_nor.svg');
}

.cmn_button_icon.close:hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_arrow_close_nor_hover.svg');
}

.cmn_button_icon:where(.selected, .softfill) .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_arrow_softfill.svg');
}

.cmn_button_icon:where(.selected, .softfill):hover .icon,
.cmn_button_icon:where(.selected, .softfill).hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_arrow_softfill_hover.svg');
}

.cmn_button_icon:where(.fill) .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_arrow_fill.svg');
}

.cmn_button_icon:where(.fill):hover .icon,
.cmn_button_icon:where(.fill).hover .icon{
	background-image: url('/resources/img/common/ico_cmn_btn_arrow_fill_hover.svg');
}

.cmn_button_icon.integrate_excel {
	border: 1.002px solid #107C41;
	background: #F1FFF8;
}

.cmn_button_icon.integrate_excel:hover{
	background: linear-gradient(0deg, rgba(16, 124, 65, 0.02) 0%, rgba(16, 124, 65, 0.02) 100%), #F1FFF8;
}

.cmn_button_icon.integrate_excel .icon {
	background-image: url(/resources/img/common/Icon_excel.svg);
}

.cmn_button_icon.integrate_excel:hover .icon {
	background-image: url(/resources/img/common/Icon_excel_hover.svg);
}

.cmn_button_icon.single_excel .icon {
	background-image: url(/resources/img/common/ico_single_excel.svg);
}

.cmn_button_icon.single_excel:hover .icon {
	background-image: url(/resources/img/common/ico_single_excel_hover.svg);
}
/***********  아이콘버튼 *************/

/***********  버튼/버튼그룹 내 툴팁 *************/
:where(.cmn_button_icon, .cmn_button_group .btn_item) .tooltip_crew {
	display: none;
	position: absolute;
	padding: 6px 10px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 2px;
	border-radius: 6px;
	border: 1px solid rgba(0, 0, 0, 0.05);
	background: rgba(255, 255, 255, 0.90);
	box-shadow: 0px 4px 8px -2px rgba(0, 0, 0, 0.08), 0px 2px 4px -2px rgba(0, 0, 0, 0.04);
	backdrop-filter: blur(5px);
	white-space: nowrap;
	z-index: 999;
}

:where(.cmn_button_icon, .cmn_button_group .btn_item) .tooltip_crew {
	top: 32px;
}

:where(.cmn_button_icon.h36, .cmn_button_group.h36 .btn_item) .tooltip_crew {
	top: 40px;
}

:where(.cmn_button_icon.h40, .cmn_button_group.h40 .btn_item) .tooltip_crew {
	top: 44px;
}

:where(.cmn_button_icon.h48, .cmn_button_group.h48 .btn_item) .tooltip_crew {
	top: 52px;
}

:where(.cmn_button_icon, .cmn_button_group .btn_item):not(.dim):hover .tooltip_crew {
	display: inline-flex;
}

:where(.cmn_button_icon, .cmn_button_group .btn_item) .tooltip_crew .tooltip_text {
	color: #56687F;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 18px;
    width: max-content;
    max-width: 300px;
    white-space: break-spaces;
    word-break: break-word;
}
/***********  버튼/버튼그룹 내 툴팁 *************/

/***********  아이콘 제목 *************/
.cmn_icon_title {
	display: flex;
    align-items: center;
    justify-content: flex-start;
}

.cmn_icon_title .cmn_icon_crew {
	position: relative;
}

.cmn_icon_title .cmn_icon_crew .cmn_icon {
	width: 40px;
    height: 40px;
    border-radius: 8.889px;
    border: 1px rgba(0, 0, 0, 0.05);
    flex-shrink: 0;
    background-size: 40px 40px;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(/resources/img/common/img_app_detail_default.png);
}

.cmn_icon_title .cmn_icon_crew .cmn_icon:has(.cmn_blur) {
	position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: unset;
    background-color: unset;
    overflow: hidden;
}

.cmn_icon_title .cmn_icon_crew .cmn_icon .cmn_blur {
	width: 140%;
    height: 140%;
    position: absolute;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-color: lightgray;
    filter: blur(15px);
    -webkit-filter: blur(15px);
    opacity: 0.4;
}

.cmn_icon_title .cmn_icon_crew .cmn_icon .cmn_icon_area {
	width: 22.5px;
    height: 22.5px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    z-index: 1799;
    border-radius: 6px;
}

.cmn_icon_title .cmn_icon_crew .cmn_item_idx_icon {
	width: 12px;
    height: 12px;
    position: absolute;
    right: -5px;
    bottom: -4px;
    border-radius: 50%;
    border: 4px solid #FFFFFF;
    background-color: #D4E0EB;
}

.cmn_icon_title .cmn_text_crew {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	margin-left: 8px;
}

.cmn_icon_title .cmn_text_crew .cmn_name {
	display: flex;
    height: 28px;
    flex-direction: column;
    justify-content: center;
    flex-shrink: 0;
    align-self: stretch;
    
	color: #353C49;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 15px;
	font-weight: 400;
}

.cmn_icon_title .cmn_text_crew .cmn_name :where(.cmn_link:link, .cmn_link:visited, .cmn_link:focus, .cmn_link:active) {
	color: #353C49;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 15px;
	font-weight: 400;
}

.cmn_icon_title .cmn_text_crew .cmn_name .cmn_link:hover {
	color: #353C49;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 15px;
	font-weight: 400;
	text-decoration: underline !important;
}

.cmn_industy {
	display: flex;
	height: 20px;
	flex-direction: column;
	justify-content: center;
	flex-shrink: 0;
	align-self: stretch;
	cursor : pointer;
	color: #707683;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 12px;
	font-weight: 400;
}
/***********  아이콘 제목 *************/

.float_menu .wrapper_content .cmn_button_group .btn_item{
	border-radius : 4px;
}

/************ 보기설정 버튼 ************/
.setting_btn_area .setting_btn_group {
	margin-left : 16px;
	width: max-content;
}

.setting_btn_area .setting_btn_group.open {
	border: 1.002px solid #09F;
    background: #F8FBFF;
    color: #09F;
}

.setting_btn_area .setting_btn_group.open .text {
	font-weight : 400;
	white-space: nowrap;
}

.setting_btn_area .setting_btn_group .wrapper {
	display: flex;
    justify-content: center;
    align-items: center;
}

.setting_btn_area .setting_btn_group.selected .wrapper .text{
	color: #09F;
	font-size: 13px;
	font-weight: 400;
}

.setting_btn_area .setting_btn_group .wrapper .checkbox{
	width : 18px;
	height : 18px;
	background-image: url("/resources/img/common/visibility_hidden.svg");
	background-repeat: no-repeat;
	background-size: 18px;
	background-position: center;
}

.setting_btn_area .setting_btn_group:where(.selected, .open) .wrapper .checkbox{
	background-image: url("/resources/img/common/visibility_visible.svg") !important;
}

.setting_btn_area .setting_btn_group .wrapper .setting_btn_child {
	border-radius: 6px;
	display: none;
	width: fit-content;
	flex-direction: column;
	align-items: flex-start;
	position: absolute;
	right: -21px;
	top: 30px;
	z-index: 1800;
	overflow: hidden;
	box-sizing: border-box;
	border: 1px solid #09F;
}

.setting_btn_area .setting_btn_group.open .wrapper .setting_btn_child {
	display : flex;
}

.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn{
	display: flex;
	height: 40px;
	padding: 0 16px;
	align-items: center;
	gap: 10px;
	min-width: 300px;
	align-self: stretch;
	background-color: #FFF;
}

.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn:hover {
	background: linear-gradient(0deg, rgba(0, 153, 255, 0.02) 0%, rgba(0, 153, 255, 0.02) 100%), #FFF;
}

/* 토글 버튼 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn .toggle_btn {
	width: 20px;
	height: 20px;
	position: relative;
	cursor: pointer;
	background-image: none;
}

/* OFF 이미지 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn .toggle_btn::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	background-image: url("/resources/img/common/btn_check_nor.svg");
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: center;
	opacity: 1;
	transition: opacity 0.2s ease-in-out;
	z-index: 1;
}

/* ON 이미지 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn .toggle_btn::after {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	background-image: url("/resources/img/common/btn_check_foc.svg");
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: center;
	opacity: 0;
	transition: opacity 0.2s ease-in-out;
	z-index: 2;
}

/* 순위 - 토글 버튼 */
.page_orderby .setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn .toggle_btn {
	width : 32px;
}

/* 순위 - OFF 이미지 */
.page_orderby .setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn .toggle_btn::before {
	background-image: url("/resources/img/common/toggle_off.svg");
	background-size: 32px 20px;
}

/* 순위 - ON 이미지 */
.page_orderby .setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn .toggle_btn::after {
	background-image: url("/resources/img/common/toggle_on.svg");
	background-size: 32px 20px;
}

.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn.selected .toggle_btn::before {
	opacity: 0;
}

.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn.selected .toggle_btn::after {
	opacity: 1;
}
/* 토글 버튼 // */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn + .child_btn {
	border-top: 1px solid #EEE;
}

.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn .title_area {
	width: fit-content;
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 1 0 0;
}
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn .title_area .title_icon{
	width : 20px;
	height : 20px;
	background-repeat: no-repeat;
	background-size: 20px;
	background-position: center;
}

.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_btn .title_area .text {
	overflow: hidden;
	color: #707683;
	width: fit-content;
	text-overflow: ellipsis;
	font-size: 14px;
	font-style: normal;
	font-weight: 300;
	line-height: normal;
	white-space : nowrap;
}

/* Android Only 아이콘 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .android_only_btn .title_area .title_icon {
	background-image: url("/resources/img/app/icon_android.svg");
}
/* 통계오류 가능성 제외 아이콘 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .stat_error_btn .title_area .title_icon {
	background-image: url("/resources/img/common/rank_stat_icon.svg");
}
/* 데이터 없는 항목 제외 아이콘 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .no_data_btn .title_area .title_icon {
	background-image: url("/resources/img/common/no_data_icon_view_btn.svg");
}
/* 신규 진입 순위 아이콘 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .new_rank_btn .title_area .title_icon {
	width: 20px;
	height: 20px;
	background-size : 20px;
	background-image: url("/resources/img/common/new_icon.svg");
}
/* 2단계 앱 보기 아이콘 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .depth_two_btn .title_area .title_icon {
	background-image: url("/resources/img/common/depth_two.svg");
}
/* 하위 업종 순위 보기 아이콘 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .child_industry .title_area .title_icon {
	background-image: url("/resources/img/common/child_industry.svg");
}
/* 비교하기 - 같은 업종 보기 아이콘 */
.setting_btn_area .setting_btn_group .wrapper .setting_btn_child .compare_same_industry .title_area .title_icon {
	border-radius: 17px;
	background-color: #416EA7;
	background-image: url("/resources/img/common/same_industry_icon.svg");
	background-size :  11.25px;
}


.setting_btn_area .setting_btn_group .wrapper .selected_text.has-text{
	color: #0099FF;
	font-size: 11px;
	border-radius: 12px;
	width: 18px;
	height: 13px;
	text-align: center;
	padding: 2px 0 3px 0;
	margin-left: 4px;
	font-weight: 590;
	line-height: 14.5px;
	background-color: rgba(0, 153, 255, 0.10);
}

.setting_btn_area .setting_btn_group.open .wrapper .selected_text.has-text{
	color: #FFF;
	background-color: #09F;
}	
/************ 보기설정 버튼 ************/