body{background1:#f7f7f7}
#container_title{background1:#de7940;}
.team_info{background:#fff;f4f6f8;padding:10px 0;margin:5px 15px;position:relative}
.team_info h2{font-size:20px;font-weight:500}
.team_info div{font-size:14px}
.team_info p{font-size:12px}
#copy_addr{background: #9370f0;color:#fff;padding:2px 5px;border-radius:10px;font-size:12px;}
.team_info_1{font-size:14px}
.team_info_2{font-size:14px}
.write_btn01{position:fixed;bottom:5px;width:100%;max-width:450px}
.write_btn01 a{border-radius:10px;background:var(--c1);linear-gradient(135deg, var(--primary), #6a5af9);#9370f0;color:#fff;display:block;margin:0 10px;left:0;right:0;text-align:center;padding:10px 0;font-size:16px}
.write_btn01 span{vertical-align:middle}
.tab01{display:flex;margin-top:10px;width:100%}
.tab01 a{width:50%;padding:10px 0;margin:5px;background:#f4f6f8;text-align:center;border1:1px solid #ddd}
.tab01 div span{vertical-align:middle;color:#999;margin-right:5px}
.ed_tm{position:absolute;top:0px;right:0px}
button{border:0;background:none}
.btn_submit_01{position:absolute;right:15px;top:15px;z-index:999;padding:5px 5px; background:#333; color:#fff; border:0;}
.list-comment-wrap{display:none; margin-top1:5px; padding:10px; background1:#f5f5f5; border-radius:5px;position:relative}
.wr_content_01{width:100%; resize:none;border:1px solid #999}
.btn_list_good{font-size:14px;font-weight:600}
.team_hero {
    width: 100%;
    height-: 270px;         /* 원하는 높이로 고정 (예: 250px 또는 20vh) */
    overflow: hidden;      /* 영역 밖으로 나가는 이미지 숨김 */
    display: flex;
    justify-content: center; /* 가로 중앙 정렬 */
    align-items: center;    /* 세로 중앙 정렬 */
    position: relative;    /* 뒤로가기 버튼 위치 기준 */
    background-color: #f8f8f8; /* 이미지 로딩 전 빈 공간 색상 */
}
.team_hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;     /* 중요: 비율을 유지하며 영역을 꽉 채움 (잘리는 부분 발생) */
    /* 만약 이미지 전체가 다 보여야 한다면 object-fit: contain; 으로 변경하세요 */
}

#container_title{display:none}
.team_hero img{width:100%}
.team_hero .material-icons-outlined{position:absolute;top:10px;left:10px;color:#fff;font-size:30px;text-shadow: 0px 2px 4px rgba(0,0,0,0.9);} 


#sch_btn{position:absolute;right:0px;bottom:10px;border:1px solid #ccc;border-radius:3px;font-size:14px;padding:2px 10px;display:none}
/* #sch01 폼을 가로 전체 영역에 맞춤 */
#sch01 {padding:10px;border-top:1px solid #ccc}
#sch01 form {
    display: flex;
    align-items: center;
    gap: 5px;
    width: 100%; /* 가로 영역 100% 차지 */
}

/* 입력창이 남는 공간을 모두 채우도록 확장 */
#sch01 .frm_input {
    flex: 1; /* 가변적으로 남은 공간을 꽉 채움 */
    height: 32px;
    padding: 0 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 13px;
    outline: none;
    box-sizing: border-box; /* 패딩 포함 넓이 자동 계산 */
}

#sch01 .frm_input:focus {
    border-color: #888;
}

/* 검색 버튼은 글자 크기에 맞게 고정 */
#sch01 .btn_submit {
    flex-shrink: 0; /* 창이 좁아져도 버튼 크기는 줄어들지 않게 고정 */
    height: 32px;
    padding: 0 12px;
    background-color: #555;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 13px;
    cursor: pointer;
    transition: background-color 0.2s;
}

#sch01 .btn_submit:hover {
    background-color: #333;
}

.team_detail {margin:0px 15px}
.team_detail h2{font-size:16px;padding:0px 0 5px}
.ct01{background:#f4f6f8;padding:10px;font-size:14px !important}

.impact-dashboard {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 1*2 구조 */
    gap: 12px;                     /* 카드 사이 간격 */
    padding: 15px 0;
}

.impact-item {
    background-color: #f8f9fa;     /* 은은한 연그레이 배경 */
    padding: 20px 0px;
    border-radius: 12px;           /* 부드러운 곡선 */
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    transition: transform 0.2s;    /* 살짝 반응하는 효과 */
}

/* 약간의 포인트를 주고 싶을 때 (마우스 오버나 터치 시) */
.impact-item:active {
    transform: scale(0.98);
    background-color: #f1f3f5;
}

.impact-num {
    font-size: 1.5rem;
    font-weight: 800;
    color: #ff5722;#333;                   /* 텍스트는 명확하게 */
    margin-bottom: 4px;
    font-variant-numeric: tabular-nums;
}

.impact-label {
    font-size: 0.85rem;
    color: #888;                   /* 라벨은 흐릿하게 대비 */
    font-weight: 500;
}




.lst{background:#fff}
.lst li{border-top:10px solid #eee;f4f6f8;eee}
.lst img{width:100%}
.lst .nm{font-size:14px;padding:15px 10px;}
.lst .nm01{display:flex;line-height:18px;color:#000}
.lst .nm01 b{color:#000}
.lst .nm01 dd{color:#999}
.lst .nm02{font-size:14px;line-height:14px;padding:10px 10px 0;}

.lst .nm01 img{
    border-radius: 50%;
    width: 40px;height:40px;
	text-align:middle;margin-right:10px
}
.lst .good_div{display:flex}
.lst .good_div div{width1:50%;padding:7px 0px;text-align:center;font-size:13px}
.lst .good_div div span{vertical-align:middle;font-size:14px}
.lst .good_div div dd{display:inline;}

.post-actions-row {
	display: flex;
	align-items: center;
	gap1: 25px;
	padding-top1: 10px;
	border-top1: 1px solid red;#e9ecef;
	margin-top1: 15px;width:100%;
}

.post-action {
	display1: flex;  flex-basis1: 50%;width:100%;
	align-items: center;
	 text-align: center !important; 
	gap: 8px;
	color: #868e96;
	font-size: 1.5rem;
	transition: color 0.3s;

}

.post-action:hover {
	color: #4e73df;
}

.post-action i {
	font-size: 1.25rem;vertical-align:middle
}
.dv10{padding:0 10px;position: fixed;bottom: 5px;width:100%;max-width:450px}
.bt10{background:var(--c1);color:#fff;font-weight:600;font-size:16px;width:100%;display:block;padding:10px;text-align:center;border-radius:10px}

.good_show{display:none;padding:10px 10px 5px;background:#fff;border-top:1px solid #eee}
.good_cnt{color:#000 !important;margin-left:2px}
.good_show span{background:#fff;border-radius:10px;border:1px solid #ccc;padding:0 10px;margin-bottom:5px;display:inline-block}


.tabs {
  display: flex; /* 가로 배치 핵심 */
  width: 100%;
  border-bottom: 1px solid #ccc;
}

.tab {
  flex: 1; /* 4개의 탭이 동일한 너비를 가짐 */
  padding: 10px 0;
  text-align: center;
  cursor: pointer;
  background-color: #fff;f1f1f1;
  border: 1px solid #eee;ccc;
  transition: 0.3s;
  font-size:15px;font-weight:600
}

.tab:hover {
  background-color: #ddd;
}

.tabs .on{
background:#000;9370f0;color:#fff
}
.sticky-header {
  position: -webkit-sticky; /* 사파리 호환성 */
  position: sticky;         /* 핵심 속성 */
  top: 0;                   /* 상단에서 0px 지점에 고정 */
  z-index: 99;            /* 다른 요소들보다 앞에 보이게 설정 */
}

#myPopup{max-width:600px;margin:auto; transform1ss: translate(-50%, 0) !important; top: 10% !important;}
#myPopup .code_txt{border:1px solid #555;padding:10px;border-radius:10px;display:block;margin-bottom:10px;width:100%}	
.sbm10{background:var(--c1);color:#fff;font-size:16px;border:0;width:100%;padding:10px 0;text-align:center}
.downupPopup-content{width:100%;padding:20px}
#myPopup h2{text-align:center}
.downup-popup-container {
    height: 100% !important;
}

#myPopup011 {
    height: 100% !important; /* 팝업 전체 높이를 화면 끝까지 */
    top: 0 !important;      /* 화면 최상단부터 시작 */
    transform: translate(-50%, 0) !important; /* 아래로 밀려있던 60vh 제거 */
    border-radius: 20px 20px 0px 0px;
    box-sizing: border-box; /* 패딩 포함 전체 높이 계산 */
    display: flex;
    flex-direction: column;
}

#myPopup .downupPopup-content {
    flex: 1;                /* 헤더를 제외한 나머지 공간을 꽉 채움 */
    overflow-y: auto;       /* 내용이 길어질 경우 내부 스크롤 활성화 */
    padding: 20px;
	min-height:500px;
}
/*
 position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 600px;
  height: 90%;
  background: white;
  border-radius: 20px 20px 0 0;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
  display: flex;
  flex-direction: column;
  z-index: 1000;
  padding: 20px;
  box-sizing: border-box;
*/
.bottom-sheet {
  padding: 20px;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 450px;
  
  /* 핵심: 고정 높이를 없애고 최대 높이만 지정 */
  max-height: 90vh; 
  height: auto; 
  
  background: white;
  border-radius: 20px 20px 0 0;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
  display: flex;
  flex-direction: column;
  z-index: 1000;
  box-sizing: border-box;
  
  /* 전환 효과 */
  transition: transform 0.3s ease-out;
}

.sheet-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size:16px;font-weight:600;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee;
}

.sheet-content {
  flex-grow: 1;
  overflow-y: auto; /* 내용이 많으면 여기서 스크롤 */
  padding-top: 20px;
  flex-grow: 1;
  overflow-y: auto;    /* 내용이 넘치면 스크롤 */
  -webkit-overflow-scrolling: touch; /* 모바일 부드러운 스크롤 */
  padding: 15px 10px;20px;
}

.sheet-close {
  cursor: pointer;
  border: none;
  background: none;
  font-size: 20px;
}
.bottom-sheet.hidden {
  display: none; /* 혹은 transform: translateY(100%); 로 애니메이션 효과 가능 */
}
.bottom-sheet {
  /* ...기존 스타일 유지... */
  transition: transform 0.3s ease-out; /* 부드러운 등장 */
}

.bottom-sheet.hidden {
  transform: translate(-50%, 100%); /* 화면 아래로 숨김 */
  pointer-events: none; /* 숨겨져 있을 땐 클릭 방지 */
}
body.scroll-locked {
  overflow: hidden;
  height: 100vh;
}
.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5); /* 반투명 검정 */
  z-index: 999; /* 시트(1000)보다 낮게 */
  transition: opacity 0.3s;
}

.overlay.hidden {
  display: none;
  opacity: 0;
}

.usr{font-size:16px;border-bottom:1px solid #eee;padding:10px 0}
