html.lock {
  overflow: hidden;
}
.sec_tit {
  font-size: clamp(24px, 1.25vw, 24px);
  font-weight: 600;
}
#sec1 {
  padding-top: clamp(145px, 7.55vw, 145px);
}
#sec1 .left {
	width: clamp(300px, 15.63vw, 300px);
	margin-right: clamp(20px, 1.04vw, 20px);
}
#sec1 .left .left_top_wrapper {
	border-bottom: 1px solid #eee;
}
#sec1 .left .category li:not(:last-child) {
	margin-right: 10px;
}
#sec1 .left .category li a {
	width: clamp(80px, 4.17vw, 80px);
	line-height: clamp(44px, 2.29vw, 44px);
	border: 1px solid #eee;
	border-radius: 4px;
	font-size: clamp(14px, 0.73vw, 14px);
	font-weight: 500;
	color: #444;
}
#sec1 .left .category .on a {
	background-color: var(--color-point);
	border-color: var(--color--point);
	font-weight: 700;
	color: #fff;
}
#sec1 .left .search_area input {
	width: calc(100% - clamp(90px, 4.69vw, 90px));
	border: 1px solid #eee;
	border-radius: 4px;
	margin-right: clamp(10px, 0.52vw, 10px);
	padding: 0 clamp(20px, 1.04vw, 20px);
	font-size: clamp(14px, 0.73vw, 14px);
	line-height: clamp(44px, 2.29vw, 44px);
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#sec1 .left .search_area .submit_btn {
	background-color: #111;
	color: #fff;
	font-size: clamp(14px, 0.73vw, 14px);
	font-weight: 700;
	width: clamp(80px, 4.17vw, 80px);
	border-radius: 4px;
	line-height: clamp(46px, 2.40vw, 46px);
}
#sec1 .left .chatting_list_wrapper li {
	border: 1px solid #eee;
	padding: clamp(15px, 0.78vw, 15px);
	background-color: #FFFFE1;
}
#sec1 .left .chatting_list_wrapper li:not(:last-child) {
	margin-bottom: 10px;
}
#sec1 .left .chatting_list_wrapper li .profile_area .profile_img {
	width: clamp(40px, 2.08vw, 40px);
	height: clamp(40px, 2.08vw, 40px);
	border-radius: 50%;
	overflow: hidden;
	margin-right: clamp(15px, 0.78vw, 15px);
}
#sec1 .left .chatting_list_wrapper li .profile_area .profile_img img {
	height: 100%;
	object-fit: cover;
}
#sec1 .left .chatting_list_wrapper li .profile_area .profile_txt {
	width: calc(100% - clamp(55px, 2.86vw, 55px));
}
#sec1 .left .chatting_list_wrapper li .profile_area p {
	font-size: clamp(14px, 0.73vw, 14px);
	color: #444;
}
#sec1 .left .chatting_list_wrapper li .profile_area .profile_name p .icon {
	width: clamp(20px, 1.04vw, 20px);
	height: clamp(20px, 1.04vw, 20px);
	border-radius: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin-right: 5px;
}
#sec1 .left .chatting_list_wrapper li .profile_area .profile_name .favorite_btn {
	width: clamp(16px, 0.83vw, 16px);
	height: clamp(15px, 0.78vw, 15px);
	background-image: url(../img/star_icon.svg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	cursor: pointer;
}
#sec1 .left .chatting_list_wrapper li .profile_area .profile_name .favorite_btn.on {
	background-image: url(../img/star_icon_y.svg);
}
#sec1 .left .chatting_list_wrapper li .profile_area .chatting_preview {
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
	font-size: clamp(14px, 0.73vw, 14px);
	color: #444;
}
#sec1 .left .chatting_list_wrapper li .campaign_info_area {
	padding: clamp(15px, 0.78vw, 15px);
	background-color: #F5F5F5;
	border-radius: 4px;
}
#sec1 .left .chatting_list_wrapper li .campaign_info_area h3 {
	font-size: clamp(14px, 0.73vw, 14px);
	font-weight: 700;
	color: #444;
}
#sec1 .left .chatting_list_wrapper li .campaign_info_area p {
	font-size: clamp(13px, 0.68vw, 13px);
	color: #444;
}
#sec1 .left .chatting_list_wrapper li .date {
	font-size: clamp(13px, 0.68vw, 13px);
	color: #999;
}
#sec1 .left .chatting_list_wrapper .check {
	background-color: #fff;
}
#sec1 .left .chatting_start_btn {
	line-height: clamp(46px, 2.40vw, 46px);
	width: 100%;
	background-color: var(--color-point);
	border-radius: 4px;
	font-size: clamp(14px, 0.73vw, 14px);
	font-weight: 700;
	color: #fff;
	margin-top: clamp(20px, 1.04vw, 20px);
}
#sec1 .right {
	width: calc(100% - clamp(320px, 16.67vw, 320px));
	border: 1px solid #eee;
	border-radius: 4px;
}
#sec1 .right .profile_wrapper {
	padding: clamp(20px, 1.04vw, 20px) clamp(30px, 1.56vw, 30px);
}
#sec1 .right .profile_wrapper .favorite_btn {
	width: clamp(30px, 1.56vw, 30px);
	height: clamp(30px, 1.56vw, 30px);
	background-image: url(../img/star_icon2.svg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	cursor: pointer;
	margin-right: clamp(30px, 1.56vw, 30px);
}
#sec1 .right .profile_wrapper .favorite_btn.on {
	background-image: url(../img/star_icon_y2.svg);
}
#sec1 .right .profile_wrapper .profile_img {
	width: clamp(60px, 3.13vw, 60px);
	height: clamp(60px, 3.13vw, 60px);
	border-radius: 50%;
	overflow: hidden;
	margin-right: clamp(20px, 1.04vw, 20px);
}
#sec1 .right .profile_wrapper .profile_img img {
	height: 100%;
	object-fit: cover;
}
#sec1 .right .profile_wrapper .profile_name {
	font-size: clamp(16px, 0.83vw, 16px);
	font-weight: 700;
	color: #444;
}
#sec1 .right .profile_wrapper .profile_name .icon {
	width: clamp(20px, 1.04vw, 20px);
	height: clamp(20px, 1.04vw, 20px);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin-right: 10px;
}
#sec1 .right .sub_area {
	position: relative;
	flex-direction: column;
}
#sec1 .right .sub_area .more_area {
	width: fit-content;
}
#sec1 .right .sub_area .more_btn {
	width: 4px;
	height: clamp(20px, 1.04vw, 20px);
	position: relative;
}
#sec1 .right .sub_area .more_btn span {
	width: 100%;
	height: 4px;
	background-color: #999;
	border-radius: 50%;
}
#sec1 .right .sub_area .more_btn span::before {
	content: "";
	width: 100%;
	height: 4px;
	background-color: #999;
	border-radius: 50%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}
#sec1 .right .sub_area .more_btn span::after {
	content: "";
	width: 100%;
	height: 4px;
	background-color: #999;
	border-radius: 50%;
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
}
#sec1 .right .sub_area .sub_btn_area {
	width: clamp(100px, 5.21vw, 100px);
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: clamp(15px, 0.78vw, 15px) 0;
	position: absolute;
	right: clamp(20px, 1.04vw, 20px);
	top: 0;
	flex-direction: column;
	background-color: #fff;
	display: none;
}
#sec1 .right .sub_area .sub_btn_area button {
	line-height: 1;
	font-size: clamp(14px, 0.73vw, 14px);
	color: #888;
	font-weight: 700;
}
#sec1 .right .sub_area .sub_btn_area button:not(:last-child) {
	margin-bottom: clamp(10px, 0.52vw, 10px);
}
#sec1 .right .sub_area .sub_btn_area.open {
	display: flex;
}
#sec1 .right .chatting_wrapper {
	padding: clamp(20px, 1.04vw, 20px) clamp(30px, 1.56vw, 30px);
	background-color: #F5F5F5;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	height: clamp(1000px, 52.08vw, 1000px);
	overflow-y: auto;
}
#sec1 .right .chatting_wrapper::-webkit-scrollbar {
	width: 4px;
}
#sec1 .right .chatting_wrapper::-webkit-scrollbar-track {
	background: transparent;
}
#sec1 .right .chatting_wrapper::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.25);
}
#sec1 .right .chatting_wrapper .date {
	font-size: 13px;
	color: #666;
	background-color: #fff;
	border-radius: 20px;
	width: fit-content;
	padding: 6px clamp(22px, 1.15vw, 22px);
	margin-bottom: clamp(30px, 1.56vw, 30px);
}
#sec1 .right .chatting_wrapper .message {
	margin-bottom: 10px;
}
#sec1 .right .chatting_wrapper .message .profile_img {
	width: clamp(40px, 2.08vw, 40px);
	height: clamp(40px, 2.08vw, 40px);
	border-radius: 50%;
	overflow: hidden;
	margin-right: clamp(15px, 0.78vw, 15px);
}
#sec1 .right .chatting_wrapper .message .profile_img img {
	height: 100%;
	object-fit: cover;
}
#sec1 .right .chatting_wrapper .message .bubble {
	max-width: 80%;
	width: 100%;
}
#sec1 .right .chatting_wrapper .message .bubble p {
	font-size: clamp(14px, 0.73vw, 14px);
	color: #444;
	padding: clamp(15px, 0.78vw, 15px);
	background-color: #fff;
	border: 1px solid #eee;
	border-radius: 4px;
	line-height: 1.6;
	max-width: calc(100% - clamp(45px, 2.34vw, 45px));
}
#sec1 .right .chatting_wrapper .message .bubble .time,
#sec1 .right .chatting_wrapper .message .bubble .delete_btn {
	font-size: 13px;
	color: #999;
	margin-left: 10px;
}
#sec1 .right .chatting_wrapper .message .bubble .delete_btn {
	text-decoration: underline;
}
#sec1 .right .chatting_wrapper .message.other {
	justify-content: flex-start;
}
#sec1 .right .chatting_wrapper .message.me {
	justify-content: flex-end;
}
#sec1 .right .chatting_wrapper .message.me .bubble {
	justify-content: flex-end;
}
#sec1 .right .chatting_wrapper .message.me .bubble .time,
#sec1 .right .chatting_wrapper .message.me .bubble .delete_btn {
	margin-left: 0;
	margin-right: 10px;
}
#sec1 .right .chatting_wrapper .message.me + .message.other,
#sec1 .right .chatting_wrapper .message.other + .message.me {
	margin-top: clamp(20px, 1.04vw, 20px);
}
#sec1 .right .chatting_wrapper .message.me + .date,
#sec1 .right .chatting_wrapper .message.other + .date {
	margin-top: clamp(30px, 1.56vw, 30px);
}
#sec1 .right .chatting_wrapper .message.image .bubble img {
	width: clamp(300px, 15.63vw, 300px);
	height: clamp(230px, 11.98vw, 230px);
	object-fit: cover;
}
#sec1 .right .chatting_wrapper .message.file .file_area {
	width: clamp(290px, 15.10vw, 290px);
	padding: clamp(15px, 0.78vw, 15px);
	background-color: #fff;
	border: 1px solid #eee;
	
}
#sec1 .right .chatting_wrapper .message.file .file_txt {
	width: calc(100% - clamp(45px, 2.34vw, 45px));
}
#sec1 .right .chatting_wrapper .message.file .file_name,
#sec1 .right .chatting_wrapper .message.file .file_info {
	padding: 0;
	border: none;
	background-color: transparent;
	max-width: 100%;
}
#sec1 .right .chatting_wrapper .message.file .file_name::before {
	content: "";
	width: clamp(20px, 1.04vw, 20px);
	height: clamp(20px, 1.04vw, 20px);
	background-image: url(../img/file_icon.svg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	margin-right: 10px;
	display: block;
}
#sec1 .right .chatting_wrapper .message.file .file_name span:first-child {
	max-width: calc(100% - clamp(55px, 2.86vw, 55px));
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
#sec1 .right .chatting_wrapper .message.file .file_info {
	margin-top: 10px;
}
#sec1 .right .chatting_wrapper .message.file .file_info span {
	font-size: clamp(13px, 0.68vw, 13px);
	color: #999;
}
#sec1 .right .chatting_wrapper .message.file .file_info .file_expire {
	margin-right: clamp(20px, 1.04vw, 20px);
}
#sec1 .right .chatting_wrapper .message.file .file_download {
	width: clamp(25px, 1.30vw, 25px);
	height: clamp(25px, 1.30vw, 25px);
	background-image: url(../img/download_icon.svg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	display: block;
	margin-left: clamp(20px, 1.04vw, 20px);
}
#sec1 .right .chatting_write_wrapper {
	position: relative;
}
#sec1 .right .chatting_write_wrapper .button_area label,
#sec1 .right .chatting_write_wrapper .button_area button {
	width: clamp(120px, 6.25vw, 120px);
	line-height: clamp(46px, 2.40vw, 46px);
	font-size: clamp(14px, 0.73vw, 14px);
	font-weight: 700;
	color: #fff;
	background-color: #016FA0;
	border-radius: 4px;
}
#sec1 .right .chatting_write_wrapper {
	padding: clamp(15px, 0.78vw, 15px);
}
#sec1 .right .chatting_write_wrapper .button_area .file_btn {
	background-color: #F09200;
	margin-right: 10px;
	cursor: pointer;
}
#sec1 .right .chatting_write_wrapper .file_name {
	display: none;
	font-size: clamp(13px, 0.68vw, 13px);
	color: #999;
}
#sec1 .right .chatting_write_wrapper .file_name.on {
	display: block;
}
#sec1 .right .chatting_write_wrapper .write_area textarea {
	width: calc(100% - clamp(110px, 5.73vw, 110px));
	border: 1px solid #ddd;
	padding: 10px;
	font-size: clamp(15px, 0.78vw, 15px);
}
#sec1 .right .chatting_write_wrapper .write_area .send_btn {
	width: clamp(95px, 4.95vw, 95px);
	border-radius: 4px;
	background-color: var(--color-point);
	font-size: clamp(14px, 0.73vw, 14px);
	font-weight: 700;
	color: #fff;
	margin-left: clamp(15px, 0.78vw, 15px);
}
#sec1 .right .chatting_write_wrapper .point_area {
	position: absolute;
	bottom: 100%;
	left: 0;
	background-color: #fff;
	width: 100%;
	padding: clamp(15px, 0.78vw, 15px);
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
	display: none;
}
#sec1 .right .chatting_write_wrapper .point_area.on {
	display: block;
}
#sec1 .right .chatting_write_wrapper .point_area .h_point {
	font-size: clamp(14px, 0.73vw, 14px);
	font-weight: 700;
	color: #444;
}
#sec1 .right .chatting_write_wrapper .point_area .h_point span {
	font-size: clamp(15px, 0.78vw, 15px);
	margin-left: clamp(20px, 1.04vw, 20px);
}
#sec1 .right .chatting_write_wrapper .point_area .input_area input {
	width: clamp(160px, 8.33vw, 160px);
	line-height: clamp(44px, 2.29vw, 44px);
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 0 10px;
	font-size: clamp(14px, 0.73vw, 14px);
	text-align: right;
}
#sec1 .right .chatting_write_wrapper .point_area .input_area span {
	font-size: 13px;
	color: #888;
	margin-left: 10px;
}
#sec1 .right .chatting_write_wrapper .point_area .present_btn {
	width: clamp(120px, 6.25vw, 120px);
	height: clamp(46px, 2.40vw, 46px);
	font-size: clamp(14px, 0.73vw, 14px);
	font-weight: 700;
	color: #fff;
	background-color: #016FA0;
	border-radius: 4px;
}
#sec1 .right .chatting_write_wrapper .point_area .error_txt {
	font-size: 13px;
	display: none;
}
#sec1 .right .chatting_write_wrapper .point_area .error_txt.on {
	display: block;
}
.image_viewer {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  display: none;
  z-index: 9999;
  justify-content: center;
  align-items: center;
}
.image_viewer.active {
  display: flex;
}
.image_viewer img {
  max-width: 90%;
  max-height: 90%;
  object-fit: contain;
}
.viewer_close {
  position: absolute;
  top: 20px;
  right: 30px;
  font-size: 32px;
  color: #fff;
  background: none;
  border: 0;
  cursor: pointer;
}
#sec1 .right .chatting_top_wrapper {
	padding: clamp(20px, 1.04vw, 20px) clamp(30px, 1.56vw, 30px);
}
#sec1 .right .chatting_top_wrapper .select_list label {
	width: clamp(90px, 4.69vw, 90px);
	font-size: clamp(14px, 0.73vw, 14px);
	font-weight: 700;
}
#sec1 .right .chatting_top_wrapper .select_list select {
	width: calc(100% - clamp(90px, 4.69vw, 90px));
	height: clamp(46px, 2.40vw, 46px);
	border: 1px solid #ddd;
	border-radius: 4px;
	font-size: clamp(14px, 0.73vw, 14px);
	padding: 0 clamp(15px, 0.78vw, 15px);
	appearance: none;
	background-image: url(../img/down_arrow_1.png);
	background-repeat: no-repeat;
	background-position: right clamp(15px, 0.78vw, 15px) center;
	background-size: 10px 6px;
}
#sec1 .right .chatting_top_wrapper .reviewer_list select {
	width: clamp(260px, 13.54vw, 260px);
}
#sec1 .right .chatting_wrapper .start_txt {
	font-size: clamp(13px, 0.68vw, 13px);
	color: #999;
}
#sec1 .right .chatting_start .chatting_wrapper {
	height: clamp(840px, 43.75vw, 840px);
}
#sec1 .right .empty_txt {
	font-size: clamp(14px, 0.73vw, 14px);
	color: #999;
	display: none;
}
#sec1.empty .right {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 400px;
	background-color: #F5F5F5;
}
#sec1.empty .right .empty_txt {
	display: block;
}