@charset "UTF-8";

/* reset.scss start*/
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote,
q {
  quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs
*/
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input,
select {
  vertical-align: middle;
}

.clearfix:after {
  content: " ";
  display: block;
  clear: both;
}

/* reset.scss end*/
/* setting.scss start*/
body {
  letter-spacing: 0em;
  font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Hiragino Sans", "ヒラギノ角ゴシック", "メイリオ", sans-serif;
  font-weight: 400;
  color: #1D1D1D;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: #F4F5F5;
  min-height: 100dvh;
  font-size: 1rem;
  line-height: 1.6;
  min-width: 1200px;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.mainMenu-ticketArea-add,
.ticketArea-addMember_btn,
.ticketArea-addSchedule_btn,
.ticketArea-addFile_btn .upload-label,
.btn-minutes,
.sort-style_link {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.boxwrap {
  width: 1000px;
  margin: 0 auto;
}

@media screen and (max-width: 1300px) {
  .boxwrap {
    width: 94%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}

.side-menu-profile,
.side-group-profile,
.channel-header-detail_btn,
.channel-header_request,
.channelMenu-menber-list_link,
.mainMenu-header-URLlist a,
.mainMenu-ticketArea-add,
.ticketArea-addMember_btn,
.ticketArea-addSchedule_btn,
.ticketArea-addFile_btn .upload-label,
.btn,
.footer-login_list a {
  transition: 0.2s ease-in-out;
  -o-transition: 0.2s ease-in-out;
  -moz-transition: 0.2s ease-in-out;
  -webkit-transition: 0.2s ease-in-out;
}

.side-menu-profile:hover,
.side-group-profile:hover,
.channel-header-detail_btn:hover,
.channel-header_request:hover,
.channelMenu-menber-list_link:hover,
.mainMenu-header-URLlist a:hover,
.mainMenu-ticketArea-add:hover,
.ticketArea-addMember_btn:hover,
.ticketArea-addSchedule_btn:hover,
.ticketArea-addFile_btn .upload-label:hover,
.btn:hover,
.footer-login_list a:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
}

.pc {
  display: block !important;
}

@media screen and (max-width: 568px) {
  .pc {
    display: none !important;
  }
}

.sp {
  display: none !important;
}

@media screen and (max-width: 568px) {
  .sp {
    display: block !important;
  }
}

.ipad {
  display: none !important;
}

@media screen and (max-width: 768px) {
  .ipad {
    display: block !important;
  }
}

.ipad_pc {
  display: block !important;
}

@media screen and (max-width: 768px) {
  .ipad_pc {
    display: none !important;
  }
}

.ipadPro_sp {
  display: none !important;
}

@media screen and (max-width: 1024px) {
  .ipadPro_sp {
    display: block !important;
  }
}

.ipadPro_pc {
  display: block !important;
}

@media screen and (max-width: 1024px) {
  .ipadPro_pc {
    display: none !important;
  }
}

.ipad_pc {
  display: block !important;
}

@media screen and (max-width: 768px) {
  .ipad_pc {
    display: none !important;
  }
}

.pc_inline {
  display: inline-block !important;
}

@media screen and (max-width: 568px) {
  .pc_inline {
    display: none !important;
  }
}

.sp_inline {
  display: none !important;
}

@media screen and (max-width: 568px) {
  .sp_inline {
    display: inline-block !important;
  }
}

.clearfix:after {
  content: " ";
  display: block;
  clear: both;
}

* {
  min-width: 0;
  min-height: 0;
}

li {
  list-style: none;
}

ul {
  padding: 0;
  margin: 0;
}

img {
  vertical-align: top;
}

a {
  color: #1D1D1D;
  text-decoration: none;
}

a:hover,
a:link,
a:visited,
a:active,
a:focus {
  color: #1D1D1D;
  text-decoration: none;
}

/* setting.scss end*/
.header-login {
  padding: 30px;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

.footer-login {
  color: #999;
  padding: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  position: -webkit-sticky;
  position: sticky;
  top: 100%;
}

.footer-login_list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.footer-login_list li {
  margin-right: 20px;
  padding-right: 20px;
  position: relative;
}

.footer-login_list li:last-of-type {
  margin-right: 0;
  padding-right: 0;
}

.footer-login_list li:last-of-type::after {
  display: none;
}

.footer-login_list li::after {
  content: "";
  display: block;
  width: 1px;
  height: 16px;
  background-color: #999;
  margin: auto 0;
  position: absolute;
  right: 0;
  top: 0;
}

.footer-login_list a {
  color: #999;
}

.parent-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: 100vh;
}

.login {
  margin: auto;
}

.login_title {
  font-size: 2.125rem;
  text-align: center;
  margin-bottom: 60px;
}

.login_title.nomab {
  margin-bottom: 20px;
}

.login_subTitle {
  font-size: 1.5rem;
  text-align: center;
  margin-bottom: 60px;
}

.login_subTitle.nomab {
  margin-bottom: 20px;
}

.login_text {
  font-size: 1.125rem;
  text-align: center;
  margin-bottom: 30px;
}

.login-position {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: 0 auto;
}

.login-Area {
  background-color: #fff;
  border-radius: 10px;
  border: 1px solid #ccc;
  margin: 0 auto;
  padding: 50px 25px;
}

.login-Area.normal {
  width: 650px;
}

.login-Area_minWidth {
  width: 370px;
  margin: 0 auto;
}

.login-Area_menuTitle {
  font-size: 1rem;
  margin-bottom: 10px;
}

.login-Area_midTitle {
  font-size: 1.25rem;
  margin-bottom: 20px;
  text-align: center;
}

.login-Area_formTitle {
  font-size: 1.125rem;
  margin-bottom: 10px;
}

.login-Area_form.confirmationCode {
  width: 90%;
  margin: 0 auto 30px;
}

.login-Area_form .confirmationCode-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto 10px;
  position: relative;
}

.login-Area_form .confirmationCode-flex::after {
  content: "";
  display: block;
  width: 15px;
  height: 1px;
  background-color: #D6D6D6;
  position: absolute;
  right: 0;
  left: 0;
  margin: 0 auto;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.login-Area_form .confirmationCode-flex input {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-align: center;
  font-size: 3.125rem;
  border-radius: 0;
  border-right: unset;
  margin-bottom: 0;
}

.login-Area_form .confirmationCode-flex input:nth-of-type(3n) {
  border-right: 1px solid #D6D6D6;
  border-radius: 0 4px 4px 0;
}

.login-Area_form .confirmationCode-flex input:nth-of-type(3) {
  margin-right: 40px;
}

.login-Area_form .confirmationCode-flex input:nth-of-type(1),
.login-Area_form .confirmationCode-flex input:nth-of-type(4) {
  border-radius: 4px 0 0 4px;
}

.login-Area_form .numberOfCharacters {
  position: relative;
}

.login-Area_form .numberOfCharacters input {
  padding-right: 40px;
}

.login-Area_form .numberOfCharacters-count {
  position: absolute;
  top: 14px;
  color: #C1C1C1;
  right: 14px;
  font-size: 1rem;
}

.login-Area_form .profile-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.login-Area_form .profile-flex_img {
  width: 120px;
  height: 120px;
  margin-right: 20px;
}

.login-Area_form .profile-flex_img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.login-Area_form .profile-flex_imgUp {
  display: none;
}

.login-Area_form .custom-file-upload {
  border-radius: 4px;
  border: 1px solid #D6D6D6;
  background: #FFF;
  padding: 8px 20px;
  font-size: 0.875rem;
  cursor: pointer;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.login-Area_form .custom-file-upload:hover {
  background: #F4F5F5;
}

.login-Area_formInput {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  padding: 14px;
  border: 1px solid #D6D6D6;
  border-radius: 4px;
  margin-bottom: 10px;
  font-size: 1.125rem;
}

.login-Area_formInput.error {
  border: 1px solid #ff0000;
}

.login-Area_formInput::-webkit-input-placeholder {
  color: #C1C1C1;
}

.login-Area_formInput::-moz-placeholder {
  color: #C1C1C1;
}

.login-Area_formInput:-ms-input-placeholder {
  color: #C1C1C1;
}

.login-Area_formInput::-ms-input-placeholder {
  color: #C1C1C1;
}

.login-Area_formInput::placeholder {
  color: #C1C1C1;
}

.login-Area-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
}

.login-Area-flex .login-Area {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.btn {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 1rem;
  color: #fff;
  text-align: center;
  width: 100%;
  display: block;
  padding: 15px;
  border-radius: 4px;
  background: #3475e0;
  cursor: pointer;
}

.btn:hover,
.btn:link,
.btn:visited,
.btn:active,
.btn:focus {
  color: #fff;
}

.btn.border {
  border: 1px solid #3475e0;
  background: #fff;
  color: #3475e0;
}

.btn.border:hover,
.btn.border:link,
.btn.border:visited,
.btn.border:active,
.btn.border:focus {
  color: #3475e0;
}

.btn.transmission {
  width: 160px;
  margin: 0 auto;
}

.height-50 {
  height: 50px;
}

.btn.sent {
  color: #FFF;
  background-color: #ccc;
  pointer-events: none;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  font-weight: 600;
}

.btn.unsent {
  background-color: #3C8CE2;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #FFF;
  font-size: 18px;
  font-weight: 600;
}

.btn:disabled {
  background: #c1c1c1;
  color: #fff;
  cursor: not-allowed;
}

.btn:disabled:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}

.login-Area_formTitle_add-member {
  color: #333;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.font-size-bace {
  font-size: 1rem;
}

.font-size-middle {
  font-size: 1.125rem;
}

.font-size-small {
  font-size: 0.875rem;
}

.gray-text {
  color: #999;
}

.center {
  text-align: center;
}

.bold {
  font-weight: 600;
}

.error,
.red {
  color: #ff0000;
}

.waiting {
  margin: 0 auto;
  width: 100px;
  height: 100px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.addBtn {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  width: 19px;
  height: 23px;
  background-image: url("data:image/svg+xml,%3Csvg width='19' height='23' viewBox='0 0 19 23' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='2' width='19' height='19' rx='4' fill='%23E0E1E1'/%3E%3Cpath d='M10.04 11.81V16.46H8.96V11.81H4.355V10.76H8.96V6.29H10.04V10.76H14.645V11.81H10.04Z' fill='%23707070'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  margin-left: 10px;
  cursor: pointer;
}

.reduce {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: block;
  width: 25px;
  height: 38px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='48' viewBox='0 0 28 48' fill='none'%3E%3Cg filter='url(%23filter0_d_678_8889)'%3E%3Cpath d='M4 4H16C20.4183 4 24 7.58172 24 12V36C24 40.4183 20.4183 44 16 44H4V4Z' fill='white'/%3E%3C/g%3E%3Cpath d='M10 23.5L15.25 20.4689L15.25 26.5311L10 23.5Z' fill='%23222222'/%3E%3Cdefs%3E%3Cfilter id='filter0_d_678_8889' x='0' y='0' width='28' height='48' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset/%3E%3CfeGaussianBlur stdDeviation='2'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.3 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_678_8889'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_678_8889' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: -18px;
  z-index: 0;
  cursor: pointer;
}

.notice {
  position: absolute;
  top: 0;
  right: 13px;
  color: #fff;
  font-size: 0.625rem;
  background-color: #3c8ce2;
  border-radius: 100px;
  width: 20px;
  height: 20px;
}

.notice span {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: 0 auto;
}

.grayArrow {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 28px;
  height: 28px;
  margin: 0 1px;
}

.grayArrow.left {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28' fill='none'%3E%3Cpath d='M23 0H5C2.23858 0 0 2.23858 0 5V23C0 25.7614 2.23858 28 5 28H23C25.7614 28 28 25.7614 28 23V5C28 2.23858 25.7614 0 23 0Z' fill='%23F4F5F5'/%3E%3Cpath d='M12.4649 19.2563C12.5766 19.3474 12.7186 19.3929 12.8625 19.3836C13.0063 19.3743 13.1413 19.311 13.2404 19.2063C13.3395 19.1017 13.3953 18.9634 13.3967 18.8193C13.3981 18.6752 13.345 18.5359 13.2479 18.4293L8.86994 14.2773L20.2769 14.2773C20.3539 14.2805 20.4306 14.2682 20.5027 14.241C20.5747 14.2137 20.6405 14.1722 20.696 14.1189C20.7516 14.0656 20.7958 14.0017 20.826 13.9308C20.8563 13.86 20.8718 13.7838 20.8718 13.7068C20.8718 13.6298 20.8563 13.5536 20.826 13.4828C20.7958 13.412 20.7516 13.348 20.696 13.2947C20.6405 13.2414 20.5747 13.1999 20.5027 13.1727C20.4306 13.1455 20.3539 13.1331 20.2769 13.1363L8.89294 13.1363L13.2479 8.98432C13.306 8.93365 13.3533 8.87173 13.3868 8.8023C13.4203 8.73287 13.4394 8.65738 13.443 8.58036C13.4466 8.50334 13.4345 8.4264 13.4075 8.35418C13.3805 8.28196 13.3392 8.21595 13.286 8.16013C13.2328 8.10432 13.1689 8.05984 13.0981 8.0294C13.0272 7.99896 12.951 7.98318 12.8739 7.98302C12.7968 7.98285 12.7204 7.99829 12.6495 8.02842C12.5785 8.05855 12.5144 8.10274 12.4609 8.15832L7.48194 12.9003C7.37507 13.0071 7.29048 13.1341 7.23307 13.2738C7.17566 13.4136 7.14658 13.5633 7.14751 13.7144C7.14844 13.8655 7.17937 14.0149 7.23849 14.1539C7.29762 14.2929 7.38376 14.4189 7.49194 14.5243L12.4649 19.2563Z' fill='%23707070'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}

.grayArrow.right {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28' fill='none'%3E%3Cpath d='M23 0H5C2.23858 0 0 2.23858 0 5V23C0 25.7614 2.23858 28 5 28H23C25.7614 28 28 25.7614 28 23V5C28 2.23858 25.7614 0 23 0Z' fill='%23F4F5F5'/%3E%3Cpath d='M15.5619 8.15712C15.4515 8.0573 15.3064 8.00456 15.1576 8.01017C15.0088 8.01578 14.8681 8.07928 14.7654 8.18714C14.6628 8.29499 14.6063 8.43868 14.6081 8.58756C14.6099 8.73644 14.6697 8.87874 14.7749 8.98412L19.1529 13.1361H7.74992C7.67299 13.1329 7.59621 13.1453 7.52418 13.1725C7.45216 13.1997 7.38638 13.2412 7.33081 13.2945C7.27524 13.3478 7.23102 13.4118 7.20081 13.4826C7.1706 13.5534 7.15503 13.6296 7.15503 13.7066C7.15503 13.7836 7.1706 13.8598 7.20081 13.9306C7.23102 14.0015 7.27524 14.0654 7.33081 14.1187C7.38638 14.172 7.45216 14.2135 7.52418 14.2408C7.59621 14.268 7.67299 14.2803 7.74992 14.2771H19.1339L14.7789 18.4291C14.7208 18.4798 14.6736 18.5417 14.6401 18.6111C14.6065 18.6806 14.5874 18.7561 14.5839 18.8331C14.5803 18.9101 14.5924 18.987 14.6194 19.0593C14.6463 19.1315 14.6877 19.1975 14.7409 19.2533C14.794 19.3091 14.858 19.3536 14.9288 19.384C14.9996 19.4145 15.0759 19.4303 15.153 19.4304C15.2301 19.4306 15.3064 19.4152 15.3774 19.385C15.4484 19.3549 15.5125 19.3107 15.5659 19.2551L20.5449 14.5131C20.6518 14.4063 20.7364 14.2794 20.7938 14.1396C20.8512 13.9999 20.8803 13.8501 20.8793 13.699C20.8784 13.548 20.8475 13.3986 20.7884 13.2595C20.7292 13.1205 20.6431 12.9946 20.5349 12.8891L15.5619 8.15712Z' fill='%23707070'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}

.lightbox {
  position: fixed;
  z-index: 1000;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.4);
}

.opacity-06 {
  background-color: rgba(0, 0, 0, 0.6);
}

.lightbox.hidden {
  display: none;
}

.lightbox-content__add-member {
  padding: 22px;
  width: 644px;
  margin: 0 auto;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  border-radius: 10px;
  border: 1px solid #D6D6D6;
  background: #FFF;
  max-width: 94%;
}

.lightbox-content__accept-member {
  background-color: #383838;
  padding: 21px;
  width: 495px;
  margin: 0 auto;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  border-radius: 4px;
  border: 1px solid #5C5C5C;
  color: #FFF;
  flex-shrink: 0;
}

.lightbox-content {
  background-color: #fefefe;
  padding: 22px;
  width: 550px;
  margin: 0 auto;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  border-radius: 10px;
}

@media screen and (max-width: 1024px) {

  .lightbox-content__add-member,
  .lightbox-content {
    width: 90%;
  }
}

.lightbox-content .scrollArea {
  overflow: scroll;
}

@media screen and (max-width: 1024px) {
  .lightbox-content .scrollArea {
    max-height: 64vh;
  }
}

.lightbox-content-title {
  text-align: left;
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.4;
}

.lightbox-content-titleWrap {
  position: relative;
  margin-bottom: 20px;
}

.lightbox-content-close {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0px;
  font-size: 0;
  width: 15px;
  height: 15px;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.16 14L7 8.86L1.86 14L0.42 12.56L5.56 7.42L0.42 2.28L1.86 0.84L7 5.98L12.16 0.84L13.58 2.26L8.44 7.42L13.58 12.56L12.16 14Z' fill='%23444444'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  cursor: pointer;
}

@media screen and (max-width: 568px) {
  .lightbox-content-close {
    right: 10px;
  }
}

.lightbox-content-text {
  font-size: 1rem;
  text-align: center;
  margin: 20px auto;
}

.lightbox-content-text__add-member {
  text-align: center;
  font-size: 22px;
  font-weight: 600;
  margin: 29px 0 27px 0;
  color: #333;
}

.lightbox-content-text__accept-member {
  text-align: center;
  font-weight: 600;
  margin: 0 auto;
  font-size: 20px;
  line-height: normal;
  font-style: normal;
}

.login-Area_form .center-text {
  text-align: center;
}

.thumb__accept-member {
  width: 163px;
  height: 163px;
  flex-shrink: 0;
  object-fit: cover;
  border-radius: 8px;
  margin: 0 auto;
  margin-top: 47px;
  margin-bottom: 10px;
}

.name_accept-member {
  color: #FFF;
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  padding-bottom: 10px;
}

.symbol_accept-member {
  color: #FFF;
  text-align: center;
  font-size: 15px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  padding-bottom: 24px;
}

.time__accept-member {
  color: #FFF;
  text-align: center;
  font-size: 15px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  padding-bottom: 33px;
}

.submit_accept-member {
  width: 327px;
  height: 40px;
  flex-shrink: 0;
  border-radius: 6px;
  background: #3C8CE2;
  box-shadow: none;
  color: #FFF;
  text-align: center;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  border: none;
  cursor: pointer;
  margin-bottom: 34px;
}

.submit_no-accept-member {
  width: 327px;
  height: 40px;
  border-radius: 6px;
  border: 2px solid #5C5C5C;
  background: #434343;
  color: #FFF;
  text-align: center;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  margin-bottom: 16px;
  cursor: pointer;
}

.submit_no-accept-member:hover,
.submit_accept-member:hover {
  color: #FFF;
  opacity: 0.7;
}

.add-member-Area_bottom {
  display: flex;
  justify-content: space-between;
  padding-bottom: 9px;
}

.add-member-Area_bottom .right {
  color: #AAA;
  font-size: 18px;
  font-weight: 600;
}

.add-member-Area_bottom .left {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.add-member-Area_bottom .left img {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  fill: #E2E2E2;
  border-radius: 50%;
  object-fit: cover;
}

.add-member-Area_bottom .left span {
  color: #333;
  font-size: 18px;
  font-weight: 600;
}

.lightbox-content .tableStyle-pattern2 {
  width: 94%;
  margin: 0 auto;
}

.lightbox-content .checkbox-style {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 1rem;
  margin-bottom: 30px;
}

.lightbox-content .checkbox-style label:has(:checked)::after {
  top: 8px;
}

.lightbox-content.scrollOn {
  height: 600px;
  overflow: scroll;
}

@media screen and (max-width: 1024px) {
  .lightbox-content.scrollOn {
    max-height: 64vh;
  }
}

.lightbox .withdrawal-amount {
  width: 60%;
  margin-bottom: 10px;
}

.lightbox .withdrawal-amount-wrap {
  width: 94%;
  margin: 0 auto;
}

.lightbox .withdrawal .tableStyle-pattern2 th,
.lightbox .withdrawal .tableStyle-pattern2 td {
  padding: 6px 10px;
}

.lightbox .withdrawal .lightbox-content-text {
  margin: 10px auto;
}

.lightbox .withdrawal .checkbox-style {
  margin-bottom: 10px;
}

.radio-button {
  display: inline-block;
  position: relative;
  padding-left: 35px;
  margin-right: 15px;
  cursor: pointer;
  font-size: 1.125rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-weight: 600;
}

.radio-button input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #fff;
  border-radius: 50%;
  border: 2px solid #d6d6d6;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.radio-button input:checked~.checkmark:after {
  display: block;
}

.checkmark:after {
  top: 3px;
  left: 3px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #6e6e6e;
}

.input-member-style {
  width: 100%;
  padding: 6px;
  border-radius: 4px;
  font-size: 1.125rem;
  min-height: 50px;
  position: relative;
  padding-left: 18px;
}

.input-member-style-add {
  background-color: #f4f5f5;
  padding: 6px 10px;
  border-radius: 4px;
  margin: 0 4px;
  word-break: break-all;
}

.input-member-style-add img {
  width: 28px;
  height: 28px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
  margin-right: 2px;
}

.input-member-style-border {
  border: 1px solid #d6d6d6;
  width: 100%;
}

.member-delete {
  display: inline-block;
  width: 13px;
  height: 13px;
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.16 14L7 8.86L1.86 14L0.42 12.56L5.56 7.42L0.42 2.28L1.86 0.84L7 5.98L12.16 0.84L13.58 2.26L8.44 7.42L13.58 12.56L12.16 14Z' fill='%23707070'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  margin-left: 15px;
  cursor: pointer;
}

.input-member-list {
  position: absolute;
  top: 0px;
  left: -1%;
  width: 102%;
  background-color: #fff;
  border-radius: 4px;
  -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3);
  padding: 4px 0;
}

.input-member-list-wrap {
  position: relative;
}

.input-member-list.notShow {
  display: none;
}

.input-member-list-link {
  padding: 5px 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  font-size: 1.125rem;
  cursor: pointer;
}

.input-member-list-link:hover {
  background-color: #3c8ce2;
  color: #fff;
}

.input-member-list-link img {
  width: 28px;
  height: 28px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
  margin-right: 8px;
}

.input-member-list-li.mail .input-member-list-link svg {
  width: 19px;
  height: 16px;
  margin-right: 8px;
  margin-top: 8px;
}

.input-member-list-li.mail .input-member-list-link:hover svg path {
  fill: #fff;
}

.input-member-list-li.mail .input-member-list-link .input-member-list-name {
  word-break: break-all;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.input-member-addList_title {
  font-size: 1.125rem;
  font-weight: 600;
}

.input-member-addList-list {
  position: relative;
  left: -22px;
  width: calc(100% + 44px);
  max-height: 320px;
  overflow-y: auto;
}

.input-member-addList-list li {
  padding: 10px 22px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  font-size: 1.125rem;
  position: relative;
}

.input-member-addList-list li:hover {
  background-color: #f4f5f5;
}

.input-member-addList-list li:hover .input-member-addList-remove {
  display: block;
}

.input-member-addList-list li img {
  width: 28px;
  height: 28px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
  margin-right: 8px;
}

.input-member-addList-list li button {
  cursor: pointer;
}

.input-member-addList-text {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 22px;
}

.input-member-addList-remove {
  display: none;
}

.btn-minutes {
  width: 15px;
  height: 19px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='20' viewBox='0 0 16 20' fill='none'%3E%3Cpath d='M4.25 15.75H11.75V14.25H4.25V15.75ZM4.25 11.75H11.75V10.25H4.25V11.75ZM2.3077 19.5C1.80257 19.5 1.375 19.325 1.025 18.975C0.675 18.625 0.5 18.1974 0.5 17.6923V2.3077C0.5 1.80257 0.675 1.375 1.025 1.025C1.375 0.675 1.80257 0.5 2.3077 0.5H10.25L15.5 5.74995V17.6923C15.5 18.1974 15.325 18.625 14.975 18.975C14.625 19.325 14.1974 19.5 13.6922 19.5H2.3077ZM9.5 6.49995V1.99998H2.3077C2.23077 1.99998 2.16024 2.03203 2.09612 2.09613C2.03202 2.16024 1.99997 2.23077 1.99997 2.3077V17.6923C1.99997 17.7692 2.03202 17.8397 2.09612 17.9038C2.16024 17.9679 2.23077 18 2.3077 18H13.6922C13.7692 18 13.8397 17.9679 13.9038 17.9038C13.9679 17.8397 14 17.7692 14 17.6923V6.49995H9.5Z' fill='%23B0B0B0'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  cursor: pointer;
}

.minutes-area {
  position: absolute;
  top: 34px;
  left: 10px;
  width: 195%;
  padding-top: 30px;
  z-index: 100;
}

.minutes-area-back {
  background-color: #fff;
  -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.3);
  border-radius: 4px;
  position: relative;
  padding: 4px;
}

.minutes-area-back::before,
.minutes-area-back::after {
  content: "";
  position: absolute;
  left: 7px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 25px solid #fff;
}

.minutes-area-back::before {
  top: -24px;
}

.minutes-area-back::after {
  top: -22px;
  border-bottom-color: rgba(0, 0, 0, 0.3);
  -webkit-filter: drop-shadow(0px -4px 8px rgba(0, 0, 0, 0.5));
  filter: drop-shadow(0px -4px 8px rgba(0, 0, 0, 0.5));
  z-index: -1;
}

.minutes-area-list {
  max-height: calc(100vh - 180px);
  height: auto;
  overflow-y: auto;
}

.minutes-area-list-border {
  border-radius: 4px;
  border: 1px solid #d2d2d2;
  padding: 10px;
  background-color: #f4f5f5;
  margin-bottom: 4px;
  position: relative;
}

.minutes-area-list-border::after {
  content: "";
  display: block;
  position: absolute;
  top: 28px;
  right: 20px;
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M10.9288 4.93152H7.28682C7.2299 4.93152 7.17531 4.9089 7.13506 4.86865C7.0948 4.82839 7.07219 4.77379 7.07219 4.71685V1.07139C7.07219 0.787243 6.95933 0.514729 6.75844 0.313804C6.55755 0.112879 6.28508 0 6.00097 0C5.71687 0 5.4444 0.112879 5.2435 0.313804C5.04261 0.514729 4.92975 0.787243 4.92975 1.07139V4.71394C4.92975 4.77087 4.90714 4.82547 4.86689 4.86573C4.82663 4.90599 4.77204 4.92861 4.71512 4.92861H1.07122C0.787115 4.92861 0.514646 5.04148 0.313753 5.24241C0.11286 5.44334 0 5.71585 0 6C0 6.28415 0.11286 6.55666 0.313753 6.75759C0.514646 6.95852 0.787115 7.07139 1.07122 7.07139H4.71318C4.7701 7.07139 4.82469 7.09401 4.86494 7.13427C4.90519 7.17453 4.92781 7.22913 4.92781 7.28606V10.9286C4.92781 11.2128 5.04067 11.4853 5.24156 11.6862C5.44245 11.8871 5.71492 12 5.99903 12C6.28313 12 6.5556 11.8871 6.7565 11.6862C6.95739 11.4853 7.07025 11.2128 7.07025 10.9286V7.288C7.07038 7.25973 7.07609 7.23176 7.08705 7.2057C7.09801 7.17964 7.11402 7.15601 7.13414 7.13615C7.15427 7.11629 7.17811 7.10061 7.20432 7.09C7.23052 7.07938 7.25856 7.07405 7.28682 7.07431H10.9288C11.2129 7.07431 11.4854 6.96143 11.6862 6.7605C11.8871 6.55958 12 6.28707 12 6.00291C12 5.71876 11.8871 5.44625 11.6862 5.24532C11.4854 5.0444 11.2129 4.93152 10.9288 4.93152Z' fill='%23333333'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}

.minutes-area-list-border.open {
  background-color: #fff;
}

.minutes-area-list-border.open::after {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='2' viewBox='0 0 12 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='1' y1='1' x2='11' y2='1' stroke='%23333333' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}

.minutes-area-list-border .meeting-text {
  display: none;
}

.minutes-area-list-border .date {
  margin-right: 10px;
}

.sort-style {
  position: absolute;
  top: 30px;
  z-index: 100;
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid #c7c7c7;
  overflow: auto;
}

.sort-style.list-status {
  left: 120px;
}

.sort-style.list-tracking {
  left: 240px;
}

.sort-style.list-person {
  left: 332px;
  width: 120px;
}

.sort-style.list-person .sort-style_link {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.sort-style_list {
  border-bottom: 1px solid #c7c7c7;
}

.sort-style_list:last-child {
  border-bottom: none;
}

.sort-style_link {
  display: block;
  padding: 4px 8px;
  font-size: 0.75rem;
}

.sort-style_link:hover {
  background-color: #F4F5F5;
}

.sort-style_color {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #aaaaaa;
  display: inline-block;
  vertical-align: middle;
  margin-right: 4px;
}

.sort-style_img {
  width: 12px;
  height: 12px;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  margin-right: 4px;
}

.select-container {
  position: relative;
  display: inline-block;
}

.select-container::after {
  content: "";
  display: block;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='7' viewBox='0 0 9 7' fill='none'%3E%3Cpath d='M1.86358 0.999896L7.68457 0.999896L4.77408 5.54224L1.86358 0.999896Z' fill='%23676767'/%3E%3Cpath d='M4.77393 4.61542L6.77021 1.49987L2.77765 1.49987L4.77393 4.61542ZM4.77393 6.46899L0.949233 0.499874L8.59863 0.499874L4.77393 6.46899Z' fill='%23707070'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  position: absolute;
  top: 50%;
  right: 10px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 9px;
  height: 7px;
}

/* アイコンを表すspanのスタイル */
.icon-span {
  position: absolute;
  left: 10px;
  /* アイコンの位置を調整 */
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 13px;
  /* アイコンの大きさ */
  width: 13px;
  /* アイコンの大きさ */
  border-radius: 50%;
  /* 丸くする */
  background-color: #fff;
  /* 初期色は白（非表示） */
  display: none;
  /* 初期状態では非表示 */
}

.custom-select {
  padding-left: 28px;
  /* アイコンのスペースを確保 */
  -webkit-appearance: none;
  /* デフォルトのドロップダウンアイコンを消す */
  -moz-appearance: none;
  appearance: none;
  height: 25px;
  border: 1px solid #D8D8D8;
  border-radius: 100px;
  padding-right: 22px;
}

.acoBtn {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 13px;
  height: 13px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 13 13' fill='none'%3E%3Cpath d='M11.9163 8.80221L10.9549 9.76367L6.49967 5.30846L2.04447 9.76367L1.08301 8.80221L6.49967 3.38555L11.9163 8.80221Z' fill='%23666666'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}

.acoBtn.off {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}

.acoBtn.on {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

.acoClose {
  display: none;
}

.margin-top10 {
  margin-top: 10px;
}

.margin-top20 {
  margin-top: 20px;
}

.margin-top30 {
  margin-top: 30px;
}

.margin-top40 {
  margin-top: 40px;
}

.margin-top50 {
  margin-top: 50px;
}

.margin-top60 {
  margin-top: 60px;
}

.margin-top70 {
  margin-top: 70px;
}

.margin-top80 {
  margin-top: 80px;
}

.margin-top90 {
  margin-top: 90px;
}

.margin-top100 {
  margin-top: 100px;
}

.margin-bottom0 {
  margin-bottom: 0;
}

.margin-bottom5 {
  margin-bottom: 5px;
}

.margin-bottom10 {
  margin-bottom: 10px;
}

.margin-bottom15 {
  margin-bottom: 15px;
}

.margin-bottom20 {
  margin-bottom: 20px;
}

.margin-bottom29 {
  margin-bottom: 29px !important;
}

.margin-bottom30 {
  margin-bottom: 30px;
}

.margin-bottom40 {
  margin-bottom: 40px;
}

.margin-bottom50 {
  margin-bottom: 50px;
}

.margin-bottom60 {
  margin-bottom: 60px;
}

.margin-bottom70 {
  margin-bottom: 70px;
}

.margin-bottom80 {
  margin-bottom: 80px;
}

.margin-bottom90 {
  margin-bottom: 90px;
}

.margin-bottom100 {
  margin-bottom: 100px;
}

.side {
  width: 144px;
  height: 100vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
  box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
  position: relative;
  z-index: 2;
}

.side-menu-list_link,
.side-group-list_link {
  position: relative;
  display: block;
  margin: 28px auto;
  text-align: center;
}

.side-menu-list_link-icon,
.side-group-list_link-icon {
  display: block;
  width: 34px;
  height: 34px;
  margin: 0 auto;
}

.side-menu-list_link-icon.plus,
.side-group-list_link-icon.plus {
  width: 24px;
  height: 24px;
  padding-top: 6px;
}

.side-menu-list_link-icon-img,
.side-group-list_link-icon-img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.side-menu-list_link path,
.side-group-list_link path {
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.side-menu-list_link:hover path,
.side-group-list_link:hover path {
  fill: #3C8CE2;
}

.side-menu-list_link.now path,
.side-group-list_link.now path {
  fill: #3C8CE2;
}

.side-menu-profile,
.side-group-profile {
  display: block;
  margin: 0 auto;
  width: 44px;
  height: 44px;
}

.side-menu-profile img,
.side-group-profile img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 50%;
}

.side-menu {
  width: 50%;
  background-color: #222222;
  height: 100%;
  position: relative;
}

.side-menu-profile {
  position: absolute;
  bottom: 10px;
  left: 0;
  right: 0;
}

.side-group {
  width: 50%;
  background-color: #fff;
  height: 100%;
  overflow-y: auto;
}

.side-group-profile {
  margin-bottom: 15px;
  border: 1px solid #999999;
  border-radius: 50%;
  font-size: 1.25rem;
  text-align: center;
  position: relative;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

.side-group-profile .center-text {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.side-group-profile.now {
  border: 3px solid #999999;
}

.side-group-list li {
  margin-top: 20px;
}

.main {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow: hidden;
}

.main-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.channel {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.channel-header {
  width: 100%;
  height: 60px;
  background-color: #fff;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid #CCC;
}

.channel-header-title {
  font-size: 1.125rem;
  font-weight: 600;
}

.channel-header-detail {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.channel-header-detail_btnArea {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-left: 150px;
  margin-right: 10px;
}

.channel-header-detail_btn {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 28px;
  height: 28px;
  margin-right: 4px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  cursor: pointer;
}

.channel-header-detail_btn.prev {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28' fill='none'%3E%3Cpath d='M23 0.5H5C2.51472 0.5 0.5 2.51472 0.5 5V23C0.5 25.4853 2.51472 27.5 5 27.5H23C25.4853 27.5 27.5 25.4853 27.5 23V5C27.5 2.51472 25.4853 0.5 23 0.5Z' stroke='%23999999'/%3E%3Cpath d='M12.4642 19.2563C12.5759 19.3474 12.7179 19.3929 12.8617 19.3836C13.0056 19.3743 13.1406 19.311 13.2396 19.2063C13.3387 19.1017 13.3946 18.9634 13.396 18.8193C13.3974 18.6752 13.3442 18.5359 13.2472 18.4293L8.8692 14.2773L20.2762 14.2773C20.3531 14.2805 20.4299 14.2682 20.5019 14.241C20.574 14.2137 20.6397 14.1722 20.6953 14.1189C20.7509 14.0656 20.7951 14.0017 20.8253 13.9308C20.8555 13.86 20.8711 13.7838 20.8711 13.7068C20.8711 13.6298 20.8555 13.5536 20.8253 13.4828C20.7951 13.412 20.7509 13.348 20.6953 13.2947C20.6397 13.2414 20.574 13.1999 20.5019 13.1727C20.4299 13.1455 20.3531 13.1331 20.2762 13.1363L8.8922 13.1363L13.2472 8.98432C13.3053 8.93365 13.3525 8.87173 13.3861 8.8023C13.4196 8.73287 13.4387 8.65738 13.4423 8.58036C13.4458 8.50334 13.4337 8.4264 13.4068 8.35418C13.3798 8.28196 13.3385 8.21595 13.2853 8.16013C13.2321 8.10432 13.1682 8.05984 13.0973 8.0294C13.0265 7.99896 12.9502 7.98318 12.8731 7.98302C12.796 7.98285 12.7197 7.99829 12.6487 8.02842C12.5778 8.05855 12.5136 8.10274 12.4602 8.15832L7.4812 12.9003C7.37434 13.0071 7.28975 13.1341 7.23234 13.2738C7.17493 13.4136 7.14585 13.5633 7.14678 13.7144C7.14771 13.8655 7.17863 14.0149 7.23776 14.1539C7.29688 14.2929 7.38303 14.4189 7.4912 14.5243L12.4642 19.2563Z' fill='%23999999'/%3E%3C/svg%3E");
}

.channel-header-detail_btn.next {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28' fill='none'%3E%3Cpath d='M23 0.5H5C2.51472 0.5 0.5 2.51472 0.5 5V23C0.5 25.4853 2.51472 27.5 5 27.5H23C25.4853 27.5 27.5 25.4853 27.5 23V5C27.5 2.51472 25.4853 0.5 23 0.5Z' stroke='%23999999'/%3E%3Cpath d='M15.5612 8.15712C15.4507 8.0573 15.3056 8.00456 15.1568 8.01017C15.0081 8.01578 14.8673 8.07928 14.7647 8.18714C14.6621 8.29499 14.6056 8.43868 14.6074 8.58756C14.6092 8.73644 14.669 8.87874 14.7742 8.98412L19.1522 13.1361H7.74919C7.67226 13.1329 7.59547 13.1453 7.52345 13.1725C7.45142 13.1997 7.38565 13.2412 7.33008 13.2945C7.2745 13.3478 7.23028 13.4118 7.20008 13.4826C7.16987 13.5534 7.1543 13.6296 7.1543 13.7066C7.1543 13.7836 7.16987 13.8598 7.20008 13.9306C7.23028 14.0015 7.2745 14.0654 7.33008 14.1187C7.38565 14.172 7.45142 14.2135 7.52345 14.2408C7.59547 14.268 7.67226 14.2803 7.74919 14.2771H19.1332L14.7782 18.4291C14.7201 18.4798 14.6728 18.5417 14.6393 18.6111C14.6058 18.6806 14.5867 18.7561 14.5831 18.8331C14.5796 18.9101 14.5916 18.987 14.6186 19.0593C14.6456 19.1315 14.6869 19.1975 14.7401 19.2533C14.7933 19.3091 14.8572 19.3536 14.9281 19.384C14.9989 19.4145 15.0752 19.4303 15.1523 19.4304C15.2294 19.4306 15.3057 19.4152 15.3767 19.385C15.4476 19.3549 15.5118 19.3107 15.5652 19.2551L20.5442 14.5131C20.6511 14.4063 20.7356 14.2794 20.7931 14.1396C20.8505 13.9999 20.8795 13.8501 20.8786 13.699C20.8777 13.548 20.8468 13.3986 20.7876 13.2595C20.7285 13.1205 20.6424 12.9946 20.5342 12.8891L15.5612 8.15712Z' fill='%23999999'/%3E%3C/svg%3E");
}

.channel-header_request {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #E36666;
  padding: 12px;
  color: #fff;
  font-weight: 600;
  font-size: 1rem;
  margin-left: auto;
  margin-right: 0;
  border-radius: 10px;
  width: 260px;
  cursor: pointer;
}

.channel-header_request .plus {
  margin-right: 20px;
}

.channel-header_request .plus::before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'%3E%3Cpath d='M13.661 6.1644H9.10853C9.03737 6.1644 8.96913 6.13613 8.91882 6.08581C8.86851 6.03548 8.84024 5.96723 8.84024 5.89607V1.33924C8.84024 0.984053 8.69916 0.643412 8.44805 0.392255C8.19693 0.141098 7.85635 0 7.50121 0C7.14608 0 6.8055 0.141098 6.55438 0.392255C6.30326 0.643412 6.16219 0.984053 6.16219 1.33924V5.89242C6.16219 5.96359 6.13392 6.03184 6.08361 6.08216C6.03329 6.13249 5.96505 6.16076 5.8939 6.16076H1.33903C0.983894 6.16076 0.643308 6.30186 0.392191 6.55301C0.141075 6.80417 0 7.14481 0 7.5C0 7.85519 0.141075 8.19583 0.392191 8.44699C0.643308 8.69814 0.983894 8.83924 1.33903 8.83924H5.89147C5.96262 8.83924 6.03087 8.86751 6.08118 8.91784C6.13149 8.96816 6.15976 9.03641 6.15976 9.10758V13.6608C6.15976 14.0159 6.30084 14.3566 6.55195 14.6077C6.80307 14.8589 7.14365 15 7.49879 15C7.85392 15 8.1945 14.8589 8.44562 14.6077C8.69674 14.3566 8.83781 14.0159 8.83781 13.6608V9.11C8.83797 9.07466 8.84511 9.0397 8.85881 9.00713C8.87252 8.97455 8.89252 8.94501 8.91768 8.92019C8.94283 8.89537 8.97264 8.87576 9.00539 8.86249C9.03815 8.84923 9.0732 8.84256 9.10853 8.84289H13.661C14.0161 8.84289 14.3567 8.70179 14.6078 8.45063C14.8589 8.19947 15 7.85883 15 7.50364C15 7.14845 14.8589 6.80781 14.6078 6.55666C14.3567 6.3055 14.0161 6.1644 13.661 6.1644Z' fill='white'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  vertical-align: middle;
  margin-right: 50px;
}

.lightbox-request .lightbox-content {
  width: 1000px;
  padding-left: 60px;
  padding-right: 60px;
  max-height: 800px;
  overflow: scroll;
}

.lightbox-request .lightbox-content-titleWrap {
  margin-top: 20px;
}

.lightbox-request .lightbox-content-titleWrap .lightbox-content-close {
  top: -20%;
}

.lightbox-request .lightbox-content-title {
  text-align: center;
  font-size: 1.625rem;
  margin-bottom: 15px;
}

.lightbox-request__text {
  text-align: center;
}

.lightbox-request--list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  -webkit-column-gap: 60px;
  -moz-column-gap: 60px;
  column-gap: 60px;
  row-gap: 15px;
}

.lightbox-request--list button {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid #D6D6D6;
  border-radius: 4px;
  padding: 15px 20px;
  background-color: #fff;
  width: 100%;
  text-align: left;
  cursor: pointer;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  height: 100%;
}

.lightbox-request--list button:hover {
  background-color: #3C8CE2;
  border: 1px solid #3C8CE2;
  color: #fff;
}

.lightbox-request--list__wrap {
  position: relative;
}

.lightbox-request--list__wrap.active {
  background-color: #3C8CE2;
  border: 1px solid #3C8CE2;
  color: #fff;
}

.lightbox-request--list__title {
  font-size: 1.25rem;
}

.lightbox-request--list__text {
  word-break: break-all;
}

.lightbox-request--list__point {
  position: absolute;
  top: 15px;
  right: 20px;
}

.lightbox-request__agreement {
  font-size: 1.375rem;
  font-weight: 600;
  text-align: center;
  margin: 20px auto;
}

.lightbox-request .btn {
  font-weight: 600;
  font-size: 1.25rem;
  width: 320px;
  margin: 0 auto;
}

.lightbox-request .lightbox-request--step1,
.lightbox-request .lightbox-request--step2,
.lightbox-request .lightbox-request--step3,
.lightbox-request .lightbox-request--step4 {
  display: none;
  /* デフォルトは非表示 */
}

.lightbox-request .lightbox-request--step1 {
  display: block;
  /* 初期ステップは表示 */
}

.search-form {
  position: relative;
}

.search-form-input {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  padding: 10px 20px;
  -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);
  border-radius: 100px;
  width: 650px;
  font-size: 0.75rem;
}

.search-form-input::-webkit-input-placeholder {
  color: #c1c1c1;
}

.search-form-input::-moz-placeholder {
  color: #c1c1c1;
}

.search-form-input:-ms-input-placeholder {
  color: #c1c1c1;
}

.search-form-input::-ms-input-placeholder {
  color: #c1c1c1;
}

.search-form-input::placeholder {
  color: #c1c1c1;
}

.search-form-button {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 20px;
  width: 15px;
  height: 16px;
}

.channelMenu {
  position: relative;
  width: 230px;
  height: calc(100vh - 60px);
  background-color: #fff;
  border-right: 1px solid #CCC;
  z-index: 1;
}

.channelMenu-wrap {
  overflow-y: auto;
  height: 100%;
  z-index: 1;
  background-color: #fff;
  position: relative;
}

.channelMenu-list li {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.channelMenu-list li .addBtn {
  margin-right: 10px;
}

.channelMenu-list li .acoBtn {
  margin-right: 10px;
}

.channelMenu-list_title {
  padding: 10px 10px;
  display: inline-block;
  font-size: 0.9375rem;
  font-weight: 600;
}

.channelMenu-list_title.white {
  background-color: #fff;
  font-size: 0.6875rem;
}

.channelMenu-list .acoArea {
  cursor: pointer;
}

.channelMenu-list.otherMenu .channelMenu-underList-name {
  font-size: 0.6875rem;
}

.channelMenu-underList {
  background-color: rgba(153, 153, 153, 0.1);
  width: 100%;
}

.channelMenu-underList li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.channelMenu-underList li:hover {
  background-color: rgba(153, 153, 153, 0.1);
}

.channelMenu-underList li.now {
  background-color: rgba(153, 153, 153, 0.1);
}

.channelMenu-underList li.now a {
  position: relative;
  padding-right: 20px;
}

.channelMenu-underList li.now a::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 10px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M4.68141 12.8334L3.646 11.798L8.44391 7.00008L3.646 2.20216L4.68141 1.16675L10.5147 7.00008L4.68141 12.8334Z' fill='%23333333'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}

.channelMenu-underList a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 10px 10px;
  width: 100%;
}

.channelMenu-underList-img {
  width: 24px;
  height: 24px;
  margin-right: 5px;
  border-radius: 100px;
  overflow: hidden;
}

.channelMenu-underList-img img {
  width: 24px;
  height: 24px;
  -o-object-fit: cover;
  object-fit: cover;
}

.channelMenu-underList-name {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.channelMenu-menber {
  padding: 20px;
  background-color: rgba(153, 153, 153, 0.1);
  width: 100%;
}

.channelMenu-menber_title {
  font-size: 0.9375rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-weight: 600;
  margin-bottom: 10px;
}

.channelMenu-menber_groupTitle {
  font-size: 0.9375rem;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-weight: 300;
  margin-bottom: 10px;
}

.channelMenu-menber-list li {
  margin-bottom: 10px;
}

.channelMenu-menber-list_link {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.channelMenu-menber-list img {
  width: 20px;
  height: 20px;
  border-radius: 50px;
  -o-object-fit: cover;
  object-fit: cover;
  margin-right: 10px;
}

.channelMenu-menber_name {
  font-size: 0.9375rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  font-weight: 300;
}

.mainMenu {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  position: relative;
  z-index: 0;
}

.mainMenu-CreateNewBtn {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 180px;
  height: 180px;
  border-radius: 10px;
  background-color: rgba(235, 236, 236, 0.6);
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
  cursor: pointer;
  border: unset;
}

.mainMenu-CreateNewBtn:hover {
  background-color: rgb(235, 236, 236);
}

.mainMenu-CreateNewBtn-center {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: 0 auto;
  text-align: center;
}

.mainMenu-CreateNewBtn_text {
  line-height: 1.4;
  display: block;
  font-size: 0.875rem;
}

.mainMenu-header {
  padding: 4px 15px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 0.75rem;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

.mainMenu-header-wrap {
  overflow-x: auto;
  width: 100%;
  border-bottom: 1px solid #F4F5F5;
  background-color: #fff;
  height: 35px;
}

.mainMenu-header-wrap.custom {
  display: flex;
  justify-content: space-between;
}

.mainMenu-header-list {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-left: 10px;
}

.mainMenu-header-list.custom {
  background: #F4F5F5;
  border: 1px solid #C8C8C8;
  border-radius: 4px;
  padding-top: 1px;
  padding-bottom: 1px;
  padding-left: 10px;
}

.mainMenu-header-list li {
  margin-right: 4px;
  position: relative;
}

.mainMenu-header-list_link {
  display: block;
  background-color: #F4F5F5;
  padding: 3px 8px;
  border-radius: 2px;
}

.mainMenu-header-list_link.category {
  border-radius: 4px;
  margin-top: 4px;
}

.mainMenu-header-Area .category-box {
  display: none;
  position: absolute;
  z-index: 10001;
  left: 15px;
  height: 166px;
  overflow-y: auto;
  background-color: #fff;
  width: 127px;
  top: 30px;
  left: 24px;
  border: 1px solid #C7C7C7;
  border-radius: 4px;
  scrollbar-width: thin;
  scrollbar-color: #aaa transparent;
}

.mainMenu-header-Area .category-box.show {
  display: unset;
}

.mainMenu-header-Area .category-box::-webkit-scrollbar {
  width: 6px;
}

.mainMenu-header-Area .category-box::-webkit-scrollbar-track {
  background: transparent;
}

.mainMenu-header-Area .category-box::-webkit-scrollbar-thumb {
  background-color: #999;
  border-radius: 10px;
  border: 2px solid transparent;
  background-clip: content-box;
}

.mainMenu-header-Area .category-box ul li {
  border-bottom: 1px solid #C7C7C7;
  display: flex;
  justify-content: start;
  align-items: center;
}

.mainMenu-header-Area .category-box ul li a {
  padding-left: 6px;
  display: flex;
  align-items: center;
  width: 100%;
  font-size: 12px;
  font-weight: 300;
  gap: 3px;
}

.mainMenu-header-Area .category-box ul li a::before {
  content: "";
  width: 12px;
  height: 12px;
  background: #E2E2E2;
  display: inline-block;
  border-radius: 50%;

}

.mainMenu-header-Area .category-box ul li:hover>a {
  color: #3984D4;
  font-weight: 600;
  background: #EDF5FF;
}

.mainMenu-header-Area .category-box ul li:hover>a::before {
  background: #3984D4;
}

.menu-category {
  display: block;
  padding: 3px 8px;
  border-radius: 2px;
  color: #333;
  font-size: 18px;
  font-weight: 600;
}

.mainMenu-header-list_link.now {
  background-color: #3C8CE2;
  color: #fff;
}

.mainMenu-header-URLlist {
  margin-left: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.mainMenu-header-URLlist li {
  margin-right: 15px;
}

.mainMenu-header-URLlist_link::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M19 0H5C2.23858 0 0 2.23858 0 5V19C0 21.7614 2.23858 24 5 24H19C21.7614 24 24 21.7614 24 19V5C24 2.23858 21.7614 0 19 0Z' fill='%23F4F5F5'/%3E%3Cpath d='M13.9719 14.9584L11.9998 16.9305C11.6805 17.2605 11.297 17.5215 10.8729 17.6975C10.4488 17.8735 9.99321 17.9607 9.53412 17.9537C9.0751 17.9605 8.61954 17.8731 8.19559 17.697C7.77164 17.5209 7.38829 17.2598 7.06916 16.9298C6.7392 16.6106 6.47815 16.227 6.30217 15.8029C6.12619 15.3789 6.03898 14.9232 6.04595 14.4641C6.03917 14.0053 6.12647 13.5499 6.30245 13.1261C6.47842 12.7022 6.73935 12.319 7.06915 11.9999L9.04127 10.0277L10.0277 11.0142L8.05557 12.9863C7.85611 13.177 7.6979 13.4066 7.59074 13.661C7.48359 13.9153 7.42976 14.1889 7.4326 14.4648C7.42884 14.7404 7.48161 15.0139 7.58766 15.2683C7.69371 15.5227 7.85079 15.7527 8.04919 15.9441C8.24054 16.1425 8.47054 16.2996 8.72497 16.4056C8.97939 16.5117 9.25284 16.5644 9.52846 16.5607C9.80407 16.5644 10.0775 16.5117 10.332 16.4056C10.5864 16.2996 10.8164 16.1425 11.0077 15.9441L12.9798 13.972L13.9719 14.9584ZM10.5205 14.4656L9.53412 13.4791L13.4784 9.53488L14.4648 10.5213L10.5205 14.4656ZM14.9576 13.9727L13.9719 12.987L15.944 11.0148C16.1424 10.8235 16.2995 10.5935 16.4056 10.3391C16.5116 10.0847 16.5644 9.8112 16.5606 9.53559C16.5644 9.25997 16.5116 8.98652 16.4056 8.7321C16.2995 8.47768 16.1424 8.24767 15.944 8.05632C15.7527 7.85792 15.5227 7.70084 15.2683 7.59479C15.0138 7.48874 14.7404 7.43597 14.4648 7.43973C14.1892 7.43603 13.9157 7.48883 13.6613 7.59488C13.4069 7.70092 13.1769 7.85799 12.9855 8.05634L11.0141 10.0278L10.0277 9.04132L11.9998 7.0692C12.3191 6.73924 12.7026 6.47819 13.1266 6.30221C13.5507 6.12623 14.0064 6.03906 14.4655 6.04603C14.9246 6.03906 15.3802 6.12623 15.8043 6.30221C16.2284 6.47819 16.6119 6.73924 16.9312 7.0692C17.2611 7.38848 17.5222 7.77201 17.6982 8.19608C17.8741 8.62016 17.9613 9.07578 17.9543 9.53487C17.9613 9.99396 17.8741 10.4496 17.6982 10.8737C17.5222 11.2978 17.2611 11.6813 16.9312 12.0006L14.9576 13.9727Z' fill='%23707070'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  vertical-align: middle;
  margin-right: 4px;
}

.mainMenu-ticketArea {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: calc(100% - 35px);
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

.mainMenu-ticketArea-wrap {
  width: 100%;
  overflow-x: scroll;
}

.mainMenu-ticketArea-box {
  width: 350px;
  border-right: 1px solid #CCC;
}

.mainMenu-ticketArea-box.custom {
  width: 375px;
}

.mainMenu-ticketArea-box-wrap {
  padding: 15px 20px;
  height: calc(100vh - 143px);
  overflow-y: auto;
}

.mainMenu-ticketArea-box.no-project {
  position: relative;
}

.mainMenu-ticketArea-box.no-project .mainMenu-CreateNewBtn {
  width: 140px;
  height: 140px;
}

.mainMenu-ticketArea-title {
  padding: 10px 20px;
  background-color: #fff;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 48px;
  position: relative;
}

.mainMenu-ticketArea-title_textWrap {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.mainMenu-ticketArea-title_textWrap p {
  font-size: 0.6875rem;
  padding-left: 10px;
}

.mainMenu-ticketArea-title_text {
  font-size: 1.1875rem;
  padding-left: 10px;
  position: relative;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  line-height: 1.2;
}

.mainMenu-ticketArea-title_button {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.mainMenu-ticketArea-add {
  background-color: #fff;
  padding: 12px 20px;
  text-align: center;
  width: 100%;
  cursor: pointer;
}

.mainMenu-ticketArea-add_text {
  padding-left: 20px;
  position: relative;
  font-size: 0.9375rem;
  font-weight: 600;
}

.mainMenu-ticketArea-add_text::before {
  content: "";
  display: block;
  width: 13px;
  height: 13px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 13 13' fill='none'%3E%3Cpath d='M11.2501 5.07407H7.50007C7.44146 5.07407 7.38525 5.05079 7.3438 5.00934C7.30235 4.9679 7.27907 4.91168 7.27907 4.85307V1.10007C7.27907 0.807537 7.16286 0.526984 6.95601 0.320132C6.74916 0.113279 6.4686 -0.00292969 6.17607 -0.00292969C5.88354 -0.00292969 5.60298 0.113279 5.39613 0.320132C5.18928 0.526984 5.07307 0.807537 5.07307 1.10007V4.85007C5.07307 4.90868 5.04979 4.96489 5.00834 5.00634C4.9669 5.04779 4.91068 5.07107 4.85207 5.07107H1.10007C0.807537 5.07107 0.526984 5.18728 0.320132 5.39413C0.113279 5.60098 -0.00292969 5.88154 -0.00292969 6.17407C-0.00292969 6.4666 0.113279 6.74716 0.320132 6.95401C0.526984 7.16086 0.807537 7.27707 1.10007 7.27707H4.85007C4.90868 7.27707 4.96489 7.30035 5.00634 7.3418C5.04779 7.38324 5.07107 7.43946 5.07107 7.49807V11.2481C5.07107 11.5406 5.18728 11.8212 5.39413 12.028C5.60098 12.2349 5.88154 12.3511 6.17407 12.3511C6.4666 12.3511 6.74716 12.2349 6.95401 12.028C7.16086 11.8212 7.27707 11.5406 7.27707 11.2481V7.50007C7.2772 7.47096 7.28308 7.44217 7.29437 7.41534C7.30566 7.38851 7.32214 7.36418 7.34286 7.34374C7.36358 7.32329 7.38813 7.30715 7.41511 7.29622C7.44209 7.2853 7.47096 7.27981 7.50007 7.28007H11.2501C11.5426 7.28007 11.8232 7.16386 12.03 6.95701C12.2369 6.75016 12.3531 6.4696 12.3531 6.17707C12.3531 5.88454 12.2369 5.60398 12.03 5.39713C11.8232 5.19028 11.5426 5.07407 11.2501 5.07407Z' fill='%23333333'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  position: absolute;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}

.mainMenu-ticketArea-list {
  margin-top: 12px;
}

.mainMenu-ticketArea-list-pack {
  background-color: #fff;
  padding: 12px;
  margin-bottom: 12px;
  border-radius: 0 10px 10px 0;
  position: relative;
  cursor: pointer;
}

.mainMenu-ticketArea-list-pack.bdl-green {
  border-left: 9px solid #9ED372;
}

.mainMenu-ticketArea-list-pack.bdl-red {
  border-left: 9px solid #E36666;
}

.mainMenu-ticketArea-list-pack.done {
  background-color: #E5E5E5;
  border-width: 3px;
}

.mainMenu-ticketArea-list-pack.requestTicket {
  background-color: #E36666;
  color: #fff;
}

.mainMenu-ticketArea-list-pack.requestTicket .progress.doing {
  background-color: #fff;
  color: #E36666;
}

.mainMenu-ticketArea-list-pack .info-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.mainMenu-ticketArea-list-pack .info-flex_date {
  font-size: 0.75rem;
}

.mainMenu-ticketArea-list-pack .progress {
  background-color: #E36666;
  padding: 4px 15px;
  color: #fff;
  font-size: 0.625rem;
  font-weight: 600;
  border-radius: 100px;
}

.mainMenu-ticketArea-list-pack .progress.doing {
  background-color: #E36666;
}

.mainMenu-ticketArea-list-pack .progress.editing {
  background-color: #E29D62;
}

.mainMenu-ticketArea-list-pack .progress.checking {
  background-color: #C07EF0;
}

.mainMenu-ticketArea-list-pack .progress.submitting {
  background-color: #6E8698;
}

.mainMenu-ticketArea-list-pack .progress.complete {
  background-color: #AAAAAA;
}

.mainMenu-ticketArea-list-pack .notice-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  right: 12px;
  top: 12px;
}

.mainMenu-ticketArea-list-pack .notice-flex .num {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #EAEAEA;
  text-align: center;
  font-size: 0.6875rem;
  position: relative;
  margin-left: 4px;
}

.mainMenu-ticketArea-list-pack .notice-flex .num:first-child {
  margin-left: 0;
}

.mainMenu-ticketArea-list-pack .notice-flex .num.border {
  background-color: #fff;
  border: 1px solid #ACACAC;
}

.mainMenu-ticketArea-list-pack .notice-flex .num.border.noticeOn {
  border: 1px solid #E36666;
}

.mainMenu-ticketArea-list-pack .notice-flex .num.max::before {
  content: "";
  display: block;
  position: absolute;
  right: 0px;
  top: 0px;
  width: 7px;
  height: 7px;
  background-color: #fff;
}

.mainMenu-ticketArea-list-pack .notice-flex .num.max::after {
  content: "+";
  display: block;
  position: absolute;
  right: -1px;
  top: -5px;
  font-size: 12px;
  line-height: 1;
}

.mainMenu-ticketArea-list-pack .notice-flex .num.max.noticeOn::before {
  background-color: transparent;
}

.mainMenu-ticketArea-list-pack .notice-flex .num.max.noticeOn::after {
  color: #1D1D1D;
}

.mainMenu-ticketArea-list-pack .notice-flex .num.noticeOn {
  background-color: #E36666;
  color: #fff;
}

.mainMenu-ticketArea-list-pack .notice-flex .centerPs {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: 0 auto;
}

.mainMenu-ticketArea-list_title {
  font-size: 0.9375rem;
  font-weight: 500;
  margin-bottom: 10px;
  padding-right: 60px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.ticketArea {
  position: absolute;
  top: 0;
  right: -600px;
  /* 初期位置を右端に設定 */
  background-color: #FFFFFF;
  height: 100%;
  width: 600px;
  padding: 40px;
  border-left: 2px solid #D6D6D6;
  -webkit-transition: right 0.3s ease;
  transition: right 0.3s ease;
  /* 右方向へのアニメーションを追加 */
  overflow-y: scroll;
}

.ticketArea.active {
  right: 0;
  /* アクティブな場合は右端から0に移動 */
}

.ticketArea.makeTicket.active {
  right: 600px;
}

.ticketArea-code {
  font-size: 0.75rem;
  color: #989898;
}

.ticketArea-title {
  font-size: 1.25rem;
  font-weight: 600;
}

.ticketArea-Flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 0.875rem;
  margin-bottom: 10px;
}

.ticketArea-Flex_author,
.ticketArea-Flex_pulldown {
  margin-right: 20px;
}

.ticketArea-Flex_tracking {
  margin-right: 10px;
}

.ticketArea-Flex_pulldown {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.ticketArea-Flex_member {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.ticketArea-Flex_member p {
  margin-right: 10px;
}

.ticketArea-addMember_btnWrap {
  position: relative;
}

.ticketArea-addMember_btn {
  width: 24px;
  height: 20px;
  background-color: #E3E3E3;
  border-radius: 4px;
  cursor: pointer;
  position: relative;
}

.ticketArea-addMember_btn::after {
  content: "";
  display: block;
  background-image: url("data:image/svg+xml,%3Csvg width='11' height='11' viewBox='0 0 11 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.04 5.81V10.46H4.96V5.81H0.355V4.76H4.96V0.289999H6.04V4.76H10.645V5.81H6.04Z' fill='%23222222'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  width: 9px;
  height: 9px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0;
  left: 0;
  margin: 0 auto;
}

.ticketArea-addMenber_select {
  display: none;
}

.ticketArea-addMenber_select.active {
  display: block;
  position: absolute;
  left: 27px;
  top: 0;
  z-index: 1;
  width: 120px;
  height: 160px;
  overflow-y: scroll;
}

.ticketArea-addMenber_select select {
  width: 100%;
}

.ticketArea-detail {
  background-color: #F4F5F5;
  padding: 20px;
  position: relative;
  border-radius: 6px;
  margin-top: 10px;
}

.ticketArea-detail-flexWrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.ticketArea-detail-flexWrap .flexItem01 {
  width: 41%;
}

.ticketArea-detail-flexWrap .flexItem02 {
  width: 27%;
}

.ticketArea-detail-flexWrap .flexItem03 {
  width: 27%;
}

.ticketArea-detail_title {
  margin-bottom: 2px;
}

.ticketArea-detail .select-container {
  width: 100%;
}

.ticketArea-detail .custom-select {
  font-size: 12px;
  width: 100%;
}

.ticketArea-detail .schedule-table {
  margin-bottom: 5px;
}

.ticketArea-detail .schedule-table__row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

.ticketArea-detail .schedule-table__row .date-ttl {
  width: 45%;
}

.ticketArea-detail .schedule-table__row .date-edit {
  width: 55%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.ticketArea-detail .schedule-table__row:hover .delete-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #fff;
  border: solid 1px #D6D6D6;
  border-radius: 50%;
  width: 23px;
  height: 23px;
  line-height: 23px;
  position: absolute;
  right: -23px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 10;
}

.ticketArea-detail .schedule-table .delete-row {
  display: none;
  cursor: pointer;
}

.ticketArea-detail .schedule-table .delete-row span {
  color: #868686;
  font-size: 17px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
}

.ticketArea-detail .schedule-table input {
  border: none;
  background: none;
  max-width: 120px;
}

.ticketArea-detail .saveBtnWrap {
  position: absolute;
  right: 6px;
  bottom: 12px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 5px;
}

.ticketArea-detail .saveBtnWrap button {
  width: 87px;
  height: 25px;
  border-radius: 4px;
  cursor: pointer;
}

.ticketArea-detail .saveBtnWrap .ticketArea-detail_cancelBtn {
  color: #7E7E7E;
  background-color: #fff;
  border: solid 1px #D8D8D8;
}

.ticketArea-detail .saveBtnWrap .ticketArea-detail_saveBtn {
  color: #fff;
  background-color: #3C8CE2;
  border: solid 1px #3C8CE2;
}

.ticketArea-addSchedule_btn {
  width: 100%;
  height: 20px;
  background-color: #E3E3E3;
  border-radius: 12px;
  cursor: pointer;
  position: relative;
}

.ticketArea-addSchedule_btn::after {
  content: "";
  display: block;
  background-image: url("data:image/svg+xml,%3Csvg width='11' height='11' viewBox='0 0 11 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.04 5.81V10.46H4.96V5.81H0.355V4.76H4.96V0.289999H6.04V4.76H10.645V5.81H6.04Z' fill='%23222222'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  width: 9px;
  height: 9px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0;
  left: 0;
  margin: 0 auto;
}

.ticketArea_formInput-wrap {
  margin-bottom: 10px;
}

.ticketArea_formInput {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  font-size: 0.75rem;
  border: #E2E2E2 solid 1px;
  padding: 6px 10px;
  border-radius: 4px;
}

.ticketArea_formInput::-webkit-input-placeholder {
  color: #c1c1c1;
}

.ticketArea_formInput::-moz-placeholder {
  color: #c1c1c1;
}

.ticketArea_formInput:-ms-input-placeholder {
  color: #c1c1c1;
}

.ticketArea_formInput::-ms-input-placeholder {
  color: #c1c1c1;
}

.ticketArea_formInput::placeholder {
  color: #c1c1c1;
}

.ticketArea_head {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 5px;
}

.ticketArea-watchBtn {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: #E2E2E2 solid 1px;
  background-color: #fff;
  color: #9B9B9B;
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 0.5625rem;
  border-radius: 40px;
  cursor: pointer;
}

.ticketArea-watchBtn.active {
  color: #fff;
  border: #E2E2E2 solid 1px;
  background-color: #6E6E6E;
}

.ticketArea-closeBtn-wrap {
  position: absolute;
  right: 0;
  top: 0;
}

.ticketArea-closeBtn {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 40px;
  width: 40px;
  padding: 10px;
  cursor: pointer;
}

.ticketArea-editor textarea {
  width: 100%;
}

.ticketArea-addFile_btn {
  margin-bottom: 10px;
}

.ticketArea-addFile_btn .upload-label {
  width: 24px;
  height: 20px;
  border: #E3E3E3 solid 1px;
  background-color: #fff;
  border-radius: 4px;
  cursor: pointer;
  display: block;
  position: relative;
}

.ticketArea-addFile_btn .upload-label::after {
  content: "";
  display: block;
  background-image: url("data:image/svg+xml,%3Csvg width='11' height='11' viewBox='0 0 11 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.04 5.81V10.46H4.96V5.81H0.355V4.76H4.96V0.289999H6.04V4.76H10.645V5.81H6.04Z' fill='%23222222'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  width: 9px;
  height: 9px;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0;
  left: 0;
  margin: 0 auto;
}

.ticketArea-addFile_btn .upload-label input {
  display: none;
}

.ticketArea-file_imgArea {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 10px;
}

.ticketArea-file_imgArea div {
  width: calc(14.2857142857% - 8.5714285714px);
  position: relative;
}

.ticketArea-file_imgArea div img {
  vertical-align: top;
  max-width: 100%;
  height: auto;
}

.ticketArea-file_imgArea .delete-btn {
  cursor: pointer;
  display: none;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #fff;
  border: solid 1px #D6D6D6;
  border-radius: 50%;
  width: 23px;
  height: 23px;
  line-height: 23px;
  position: absolute;
  right: 3px;
  top: 3px;
  z-index: 10;
}

.ticketArea-file_imgArea div:hover .delete-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.sideOv-menu {
  position: relative;
}

.sideOv-menuBox {
  position: absolute;
  top: 0;
  left: 70px;
  width: 400px;
  z-index: 100;
  background-color: #383838;
  color: #fff;
}

.sideOv-menuBox-list li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.sideOv-menuBox-list_titleArea {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 8px 10px;
  font-size: 1rem;
  font-weight: 600;
}

.sideOv-menuBox-list_name {
  width: 100px;
  padding: 8px 10px;
  font-size: 0.875rem;
}

.request_form__box {
  margin-bottom: 20px;
}

.request_form__box.flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.request_form__box--input {
  width: 44%;
}

.request_form__box--input.culumn3 {
  width: 30%;
}

.request_form__box--input .px {
  position: relative;
}

.request_form__box--input .px::after {
  content: "px";
  display: block;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 10px;
  font-size: 1.125rem;
  font-weight: 600;
}

.request_form__box--input .login-Area_formInput {
  padding-right: 40px;
}

.request_form--title {
  font-size: 1.125rem;
  margin-bottom: 10px;
}

.request_form--point {
  font-size: 1.25rem;
  font-weight: 600;
  background-color: #F4F4F4;
  padding: 10px 20px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.request_form #fileButton {
  cursor: pointer;
}

.request_form .file-list .file-item {
  margin-bottom: 8px;
}

.request_form__nextBackBtn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 20px;
}

.request_form__nextBackBtn .btn {
  width: 250px;
  margin: 0;
}

.request_form__nextBackBtn .btn-back-step {
  background-color: #fff;
  border-radius: 4px;
  border: 1px solid #A6A6A6;
  color: #333;
  position: relative;
}

.request_form__nextBackBtn .btn-back-step::before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='13' viewBox='0 0 12 13' fill='none'%3E%3Cpath d='M7.74544e-08 6.49504L11.25 -0.000147685L11.25 12.9902L7.74544e-08 6.49504Z' fill='%23333333'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 30px;
}

.request_form__nextBackBtn .btn-next-step {
  position: relative;
}

.request_form__nextBackBtn .btn-next-step::after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='13' viewBox='0 0 12 13' fill='none'%3E%3Cpath d='M11.25 6.49519L3.85847e-07 12.9904L9.53674e-07 -4.91753e-07L11.25 6.49519Z' fill='white'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 30px;
}

.request_form .step3__list {
  margin-bottom: 30px;
}

.request_form .step3__list>li {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 10px;
}

.request_form .step3__list>li:nth-of-type(even) {
  background-color: #F2F2F2;
}

.request_form .step3__list--title {
  width: 180px;
  font-size: 0.875rem;
}

.request_form .step3__list__checkList {
  display: grid;
  grid-template-columns: repeat(5, 110px);
  row-gap: 6px;
}

.request_form .step3__list__checkList li {
  width: 110px;
}

.request_form .step3__list__checkList li:nth-of-type(5n) {
  width: 150px;
}

.request_form .step3__list__checkList li.long {
  width: 300px;
}

.request_form .step3__list .checkbox__flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.request_form .step3__list .checkbox__flex .custom-value-input {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.lightbox-request--step4 .summary>div {
  margin-bottom: 20px;
}

.lightbox-request--step4 .summary>div h3 {
  margin-bottom: 8px;
}

.lightbox-request--step4 .summary .summary-step1__flex {
  font-size: 1.25rem;
  font-weight: 600;
  background-color: #F4F4F4;
  padding: 10px 20px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.lightbox-request--step4 .summary .summary-step2 p,
.lightbox-request--step4 .summary .step-summary p {
  font-size: 1.125rem;
  font-weight: 600;
  margin-bottom: 5px;
  word-break: break-all;
}

.lightbox-request--step4 .summary .summary-step2 p span,
.lightbox-request--step4 .summary .step-summary p span {
  font-weight: 400;
}

.ticketArea__request--title {
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 10px;
}

.ticketArea__request--box {
  font-size: 0.8125rem;
  word-break: break-all;
  margin-bottom: 10px;
}

.ticketArea__request--box .date-ttl {
  font-weight: 600;
}

.ticketArea__request--box .date-edit.oneColumn {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

.ticketArea__request--box .schedule-table__row .date-ttl {
  font-weight: 400;
}

.ticketArea__request--box.hearing .schedule-table__row {
  margin-top: 8px;
}

.ticketArea__request--box.hearing .schedule-table__row .date-ttl {
  width: 150px;
}

.ticketArea__request--box.hearing .schedule-table__row .date-edit {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.ticketArea__request--file {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  padding: 20px;
  margin-top: 10px;
}

.ticketArea__request--file .file--img {
  width: 40px;
  height: 40px;
  border-radius: 5px;
  overflow: hidden;
  margin-right: 10px;
}

.ticketArea__request--file .file--img img {
  width: 100%;
  height: auto;
}

.ticketArea__request--file .file__text {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.ticketArea__request--file .file__text--title {
  font-size: 0.75rem;
  font-weight: 600;
}

.ticketArea__request--file .file__text--inner {
  font-size: 0.625rem;
}

.ticketArea__request--ticketBtn {
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #E36666;
  padding: 12px;
  color: #fff;
  font-weight: 600;
  font-size: 1rem;
  margin-left: auto;
  margin-right: auto;
  margin-top: 20px;
  border-radius: 10px;
  width: 260px;
  display: block;
  cursor: pointer;
}

/*# sourceMappingURL=style.css.map */
.btn-group__create {
  width: 505px;
  height: 50px;
  margin: 0 auto;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  border-radius: 6px;
  background: #3C8CE2;
  padding: 0;
  margin-top: 60px;
}

.notify {
  position: fixed;
  width: 390px;
  height: calc(100vh - 163px);
  max-height: 557px;
  border-radius: 4px;
  border: 1px solid #5C5C5C;
  background: #383838;
  top: 205px;
  left: 63px;
  z-index: 1001;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: #888 #383838;
}

.notify::-webkit-scrollbar {
  width: 4.518px;
}

.notify::-webkit-scrollbar-thumb {
  background-color: #939393;
  border-radius: 2.259px;
}

.notify::-webkit-scrollbar-track {
  background-color: #383838;
}

.notify ul {
  list-style: none;
  margin-top: 40px;
}

.notify .title {
  width: 388px;
  position: fixed;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #222;
  border-radius: 4px 4px 0px 0px;
  height: 40px;
  color: #fff;
  padding: 8px 9px;
  margin-bottom: 10px;
  z-index: 1002;
}

.notify .title a {
  color: #999;
  font-size: 12px;
  font-weight: 300;
}

.notify .title span:first-child {
  font-weight: 600;
  font-size: 16px;
  line-height: 100%;
  letter-spacing: 0%;
}

.notify .title a:hover {
  color: #3C8CE2;
}

.notify li {
  padding: 0;
  border-bottom: 1px solid #5C5C5C;
}

.notify li:hover {
  background-color: #5C5C5C;
}

.notify li .head-content {
  display: flex;
  gap: 5px;
  justify-content: space-between;
  align-items: center;
  color: #999;
  font-size: 12px;
  font-weight: 300;
  padding-left: 9px;
  padding-right: 4px;
  padding-bottom: 6px;
  padding-top: 8px;
  font-style: normal;
  line-height: normal;
}

.notify li .head-content span:first-child {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 70%;
}

.notify li .head-content span:last-child {
  width: 30%;
  text-align: right;
}


.notify li .user-content {
  display: flex;
  justify-content: start;
  align-items: center;
  color: #999;
  font-size: 12px;
  font-weight: 300;
  padding-left: 9px;
  padding-right: 16px;
  padding-bottom: 6px;
}

.notify li .user-content span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 90%;
}

.notify li .user-content svg {
  margin-right: 9px;
}

.notify li .user-content img {
  width: 20px;
  height: 20px;
  object-fit: cover;
  border-radius: 50%;
  margin-right: 9px;
}

.notify li .user-content span {
  color: #fff;
  font-size: 14px;
  font-style: normal;
  line-height: normal;
  font-weight: 600;
}

.notify li .content {
  color: #fff;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  padding-left: 9px;
  padding-right: 23px;
  padding-bottom: 10px;
}

.notify li .content .tag {
  color: #E36666;
}

.notify li .content .tag-me {
  color: #438DE5;
}

.notify li .content {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tasks,
.follows {
  position: fixed;
  width: 390px;
  height: calc(100vh - 500px);
  max-height: 557px;
  border-radius: 4px;
  border: 1px solid #5C5C5C;
  background: #383838;
  top: 85px;
  left: 63px;
  z-index: 1001;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: #888 #383838;

  color: #FFF;
  font-family: "Hiragino Kaku Gothic ProN";
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.tasks {
  top: 135px;
}

.tasks::-webkit-scrollbar,
.follows::-webkit-scrollbar {
  width: 4.518px;
}

.tasks::-webkit-scrollbar-thumb,
.follows::-webkit-scrollbar-thumb {
  background-color: #939393;
  border-radius: 2.259px;
}

.tasks::-webkit-scrollbar-track,
.follows::-webkit-scrollbar-track {
  background-color: #383838;
}

.tasks .title,
.follows .title {
  border-radius: 4px 4px 0px 0px;
  background: #222;
  display: flex;
  position: sticky;
  top: 0;
  z-index: 1002;
}

.tasks .title .desc,
.follows .title .desc {
  color: #fff;
  font-size: 16px;
  width: 76%;
  border-right: 1px solid #5C5C5C;
  border-bottom: 1px solid #5C5C5C;
  padding: 8px;
  height: 40px;
}

.tasks .title .action,
.follows .title .action {
  color: #fff;
  font-size: 14px;
  border-bottom: 1px solid #5C5C5C;
  width: 24%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 400;
}

.tasks ul li,
.follows ul li {
  display: flex;
}

.tasks ul li:hover,
.follows ul li:hover {
  background: #464646;
}

.tasks ul li div,
.follows ul li div {
  width: 76%;
  height: 50px;
  border-right: 1px solid #5C5C5C;
  border-bottom: 1px solid #5C5C5C;
  position: relative;
}

.follows ul li div.non-active::after,
.follows ul li div.active::after {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-size: contain;
  margin-top: 12px;
  margin-left: 9px;
}

.follows ul li div.active::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12.0028 15.5769C13.1359 15.5769 14.0983 15.1803 14.89 14.3871C15.6816 13.5939 16.0775 12.6308 16.0775 11.4977C16.0775 10.3646 15.6809 9.40224 14.8877 8.61058C14.0945 7.81891 13.1314 7.42308 11.9983 7.42308C10.8652 7.42308 9.90283 7.81966 9.11116 8.61283C8.3195 9.40601 7.92366 10.3692 7.92366 11.5023C7.92366 12.6353 8.32025 13.5977 9.11341 14.3894C9.9066 15.181 10.8697 15.5769 12.0028 15.5769ZM12.0006 14.2C11.2506 14.2 10.6131 13.9375 10.0881 13.4125C9.56306 12.8875 9.30056 12.25 9.30056 11.5C9.30056 10.75 9.56306 10.1125 10.0881 9.58748C10.6131 9.06248 11.2506 8.79998 12.0006 8.79998C12.7506 8.79998 13.3881 9.06248 13.9131 9.58748C14.4381 10.1125 14.7006 10.75 14.7006 11.5C14.7006 12.25 14.4381 12.8875 13.9131 13.4125C13.3881 13.9375 12.7506 14.2 12.0006 14.2ZM12.0019 18.5C9.70232 18.5 7.607 17.8657 5.71596 16.5971C3.82495 15.3285 2.43265 13.6295 1.53906 11.5C2.43265 9.37049 3.8245 7.67146 5.71461 6.40288C7.60471 5.13429 9.69957 4.5 11.9992 4.5C14.2988 4.5 16.3941 5.13429 18.2852 6.40288C20.1762 7.67146 21.5685 9.37049 22.4621 11.5C21.5685 13.6295 20.1766 15.3285 18.2865 16.5971C16.3964 17.8657 14.3016 18.5 12.0019 18.5ZM12.0006 17C13.8839 17 15.6131 16.5041 17.1881 15.5125C18.7631 14.5208 19.9672 13.1833 20.8006 11.5C19.9672 9.81664 18.7631 8.47914 17.1881 7.48748C15.6131 6.49581 13.8839 5.99998 12.0006 5.99998C10.1172 5.99998 8.38806 6.49581 6.81306 7.48748C5.23806 8.47914 4.0339 9.81664 3.20056 11.5C4.0339 13.1833 5.23806 14.5208 6.81306 15.5125C8.38806 16.5041 10.1172 17 12.0006 17Z' fill='%23999999'/%3E%3C/svg%3E");
}

.follows ul li div.non-active::after {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M12.0028 15.5769C13.1359 15.5769 14.0983 15.1803 14.89 14.3871C15.6816 13.5939 16.0775 12.6308 16.0775 11.4977C16.0775 10.3646 15.6809 9.40224 14.8877 8.61058C14.0945 7.81891 13.1314 7.42308 11.9983 7.42308C10.8652 7.42308 9.90283 7.81966 9.11116 8.61283C8.3195 9.40601 7.92366 10.3692 7.92366 11.5023C7.92366 12.6353 8.32025 13.5977 9.11341 14.3894C9.9066 15.181 10.8697 15.5769 12.0028 15.5769ZM12.0006 14.2C11.2506 14.2 10.6131 13.9375 10.0881 13.4125C9.56306 12.8875 9.30056 12.25 9.30056 11.5C9.30056 10.75 9.56306 10.1125 10.0881 9.58748C10.6131 9.06248 11.2506 8.79998 12.0006 8.79998C12.7506 8.79998 13.3881 9.06248 13.9131 9.58748C14.4381 10.1125 14.7006 10.75 14.7006 11.5C14.7006 12.25 14.4381 12.8875 13.9131 13.4125C13.3881 13.9375 12.7506 14.2 12.0006 14.2ZM12.0019 18.5C9.70232 18.5 7.607 17.8657 5.71596 16.5971C3.82495 15.3285 2.43265 13.6295 1.53906 11.5C2.43265 9.37049 3.8245 7.67146 5.71461 6.40288C7.60471 5.13429 9.69957 4.5 11.9992 4.5C14.2988 4.5 16.3941 5.13429 18.2852 6.40288C20.1762 7.67146 21.5685 9.37049 22.4621 11.5C21.5685 13.6295 20.1766 15.3285 18.2865 16.5971C16.3964 17.8657 14.3016 18.5 12.0019 18.5ZM12.0006 17C13.8839 17 15.6131 16.5041 17.1881 15.5125C18.7631 14.5208 19.9672 13.1833 20.8006 11.5C19.9672 9.81664 18.7631 8.47914 17.1881 7.48748C15.6131 6.49581 13.8839 5.99998 12.0006 5.99998C10.1172 5.99998 8.38806 6.49581 6.81306 7.48748C5.23806 8.47914 4.0339 9.81664 3.20056 11.5C4.0339 13.1833 5.23806 14.5208 6.81306 15.5125C8.38806 16.5041 10.1172 17 12.0006 17Z" fill="%23E36666"/><path d="M3 20L21 2" stroke="%23E36666" stroke-width="2" stroke-linecap="round"/></svg>');
}

.tasks ul li div .name,
.follows ul li div .name {
  position: absolute;
  top: 4px;
  left: 40px;
  color: #999;
  font-size: 12px;
  font-weight: 300;
  max-width: 248px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tasks ul li div .desc,
.follows ul li div .desc {
  position: absolute;
  top: 23px;
  left: 40px;
  max-width: 248px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
  font-weight: 600;
}

.tasks ul li div .name,
.tasks ul li div .desc {
  left: 10px;
}

.tasks ul li div .desc {
  max-width: 275px;
}

.tasks ul li .action,
.follows ul li .action {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 24%;
  border-bottom: 1px solid #5C5C5C;
}

.tasks ul li .action span,
.follows ul li .action span {
  max-width: 85px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #FFF;
  font-size: 12px;
  font-weight: 300;
}

.tasks ul li .action span {
  font-size: 14px;
  font-weight: 600;
}

.tasks .color-red {
  color: #E36666 !important;
}

.tasks .tag {
  color: #fff;
  border-radius: 100px;
  height: 16px;
  box-sizing: border-box;
  font-size: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 6px;
  padding-right: 6px;
  right: 4px;
  top: 5px;
  position: absolute;
}

.tasks .tag-red {
  background-color: #E36666;
}

.tasks .tag-yellow {
  background-color: #E29D62;
}

.tasks .tag-purple {
  background-color: #C07EF0;
}

.tasks .tag-blue {
  background-color: #438DE5;
}

.profile {
  width: 333px;
  background-color: #383838;
  border-radius: 4px;
  border: 1px solid #5C5C5C;
  position: absolute;
  bottom: 30px;
  left: 59px;
  color: #fff;
  font-size: 15px;
  font-weight: 300;
  z-index: 2001;
  line-height: normal;
  font-style: normal;
  overflow: hidden;
}


.profile .info {
  display: flex;
  align-items: center;
  gap: 17px;
  padding-top: 27px;
  padding-left: 26px;
  margin-bottom: 13px;
}

.profile .info img {
  border-radius: 8px;
  background: #D9D9D9;
  width: 58px;
  height: 58px;
  object-fit: contain;
  min-width: 58px;
}

.profile .info .user .name {
  font-size: 16px;
  font-weight: 600;
  padding-right: 22px;
}

.profile .info .user .status .active {
  color: #9ED372;
  padding-right: 5px;
  width: 22px;
}

.profile .info .user .status .non-active {
  color: rgba(255, 255, 255, 0.50);
  padding-right: 5px;
  width: 22px;
}

.profile .set-status {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 5px;
}

.profile .set-status input {
  border-radius: 4px;
  border: 1px solid #5C5C5C;
  background: #222;
  width: 281px;
  height: 34px;
  padding-left: 58px;
  color: rgba(255, 255, 255, 0.50);
  font-family: inherit;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
}

.profile .menu hr {
  margin: 0;
  padding: 0;
  border-color: #666;
}

.profile .menu ul {
  list-style: none;
}

.profile .menu ul li a {
  display: flex;
  color: #fff;
  font-size: 15px;
  font-weight: 300;
  line-height: 40px;
  padding: 0;
  margin: 0;
  padding-left: 26px;
  width: 100%;
}

.profile .menu ul li a:hover {
  background-color: #3c8ce2;
}

.lightbox-setting {
  background-color: #383838;
  width: 891px;
  height: 676px;
  margin: 0 auto;
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 0;
  right: 0;
  border-radius: 4px;
  border: 1px solid #5C5C5C;
  color: #FFF;
  flex-shrink: 0;
}

.lightbox-setting .title {
  border-radius: 4px 4px 0px 0px;
  background: #222;
  height: 60px;
  width: 888px;
  padding-left: 21px;
  display: flex;
  align-items: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.lightbox-setting .setting-content {
  display: flex;
  flex-shrink: 0;
  border-top: 1px solid #5C5C5C;
}

.lightbox-setting .setting-content .action.bg-permission {
  background: #383838;
  border-left: unset;
  border-bottom: unset;
  padding-right: 8px;
}

.lightbox-setting .menu {
  width: 233px;
  height: 615px;
  border-right: 1px solid #5C5C5C;
}

.lightbox-setting .menu ul {
  list-style: none;
  /* padding-top: 8px; */
}

.lightbox-setting .menu ul li {
  height: 44px;
  display: flex;
  align-items: center;
}

.lightbox-setting .menu ul a {
  color: #FFF;
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  padding-left: 24px;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}

.lightbox-setting .menu ul a:hover {
  background: #464646;
}

.lightbox-setting .menu ul li .active {
  background: #464646;
}

.lightbox-setting .content .action {
  width: 658px;
  height: 521px;
  border-radius: 0 0 4px 0;
  border: 1px solid #5C5C5C;
  background: #5A5A5A;
}


.lightbox-setting .content .action .auto-add-group {
  display: flex;
  justify-content: start;
  gap: 16px;
  color: #FFF;
  font-family: "Hiragino Kaku Gothic ProN";
  font-size: 12px;
  font-style: normal;
  font-weight: 300;
  line-height: 1.5em;
  padding-left: 23px;
  margin-bottom: 31px;
}

.lightbox-setting .content .action .auto-add-group .bd-btn {
  padding: 3px;
  border: 2px solid #3C8CE2;
  border-radius: 6px;
  margin-top: 7px;
}

.lightbox-setting .content .action .auto-add-group .bd-btn.bd-gray {
  border: 2px solid #6D6D6D;
}

.lightbox-setting .content .action .auto-add-group .btn-auto {
  display: flex;
  justify-content: center;
  gap: 12px;
  align-items: center;
  background: #3C8CE2;
  color: #fff;
  width: 263px;
  height: 60px;
  border-radius: 4px;
}

.lightbox-setting .content .action .auto-add-group .btn-auto.bg-tran {
  background: transparent;
}

.lightbox-setting .content .action .auto-add-group .g-title span {
  color: #E36666;
}

.lightbox-setting .content .action.custom {
  background: #383838 !important;
  border: 1px solid #383838;
  border-right: none;
  width: 652px;
}

.lightbox-setting .content .title {
  width: 656px;
  height: 50px;
  border-bottom: 1px solid #5C5C5C;
  background-color: #383838;
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.lightbox-setting .content .title.no-border {
  border: none !important;
}

.lightbox-setting .content .title.custom {
  color: #999;
  font-size: 14px;
  font-weight: 300;
  height: 45px;
}

.lightbox-setting .content .tab {
  width: 658px;
  height: 43px;
}

.lightbox-setting .content .tab ul {
  display: flex;
  padding-left: 18px;
  padding-top: 5px;
  gap: 8px;
}

.lightbox-setting .content .tab ul li a {
  position: relative;
  width: 100%;
  height: 40px;
  padding-left: 16px;
  padding-top: 7px;
  display: block;
  border-radius: 4px 4px 0 0;
  border: 1px solid #5C5C5C;
  color: #AEAEAE;
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  background: #2E2E2E;
  border-bottom: 2px solid #5C5C5C;
}

.lightbox-setting .content .tab ul li .active {
  color: #fff;
  background-color: #5A5A5A;
  position: relative;
  width: 100%;
  height: 40px;
  padding-left: 16px;
  padding-top: 7px;
  display: block;
  border-radius: 4px 4px 0 0;
  border: none;
}

.lightbox-setting .content .tab ul li {
  width: 231px;
}

.lightbox-setting .action .text {
  display: inline-grid;
  padding-left: 34px;
  padding-top: 25px;
}

.lightbox-setting .action .point,
.lightbox-setting .action .time,
.lightbox-setting .action .description {
  display: inline-grid;
  padding-left: 34px;
  padding-top: 19px;
}

.lightbox-setting .action label {
  padding-bottom: 3px;
  color: #FFF;
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.lightbox-setting .action .text input {
  border-radius: 6px;
  background: #FFF;
  width: 592px;
  height: 40px;
  border: none;
  padding-left: 10px;
  color: #000;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  font-family: inherit;
}

.lightbox-setting .action .description textarea {
  border-radius: 6px;
  background: #FFF;
  width: 592px;
  height: 61px;
  border: none;
  padding: 10px;
  color: #000;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  resize: none;
  font-family: inherit;
  padding-bottom: 5px;
}

.lightbox-setting .action .point .point-input-wrapper,
.lightbox-setting .action .time .time-input-wrapper {
  position: relative;
  display: inline-block;
}

.lightbox-setting .action .point input,
.lightbox-setting .action .time input {
  border-radius: 6px;
  background: #FFF;
  width: 154px;
  height: 40px;
  border: none;
  padding-left: 10px;
  padding-right: 30px;
  display: inline-block;
  color: #000;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
}

.lightbox-setting .action .time .time-input-wrapper::before {
  content: "h";
  color: #000;
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  pointer-events: none;
}

.lightbox-setting .action .point .point-input-wrapper::before {
  content: "pt";
  color: #000;
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  pointer-events: none;
}

.lightbox-setting .action .confirm {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 64px;
}

.lightbox-setting .action .confirm .btn-setting {
  height: 50px;
  width: 160px;
  background-color: #3C8CE2;
  color: #FFF;
  font-size: 15px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  border: unset;
  border-radius: 4px;
  cursor: pointer;
}

.lightbox-setting .action .confirm .btn-setting:hover {
  background-color: #4282c7;
}

.lightbox-setting .action .setting-list ul {
  padding-left: 12px;
  margin-top: 15px;
  height: 220px;
  overflow-y: auto;
  scroll-padding-right: 10px;
}

.lightbox-setting .action .setting-list ul li {
  display: flex;
  align-items: center;
  margin-bottom: 4px;
}

.lightbox-setting .action .setting-list ul li svg {
  cursor: pointer;
}

.lightbox-setting .action .setting-list ul li svg:hover path {
  fill: #FF4444;
}

.lightbox-setting .action .setting-list ul::-webkit-scrollbar {
  width: 6px;
}

.lightbox-setting .action .setting-list ul::-webkit-scrollbar-thumb {
  background-color: #939393;
  border-radius: 100px;
}

.lightbox-setting .action .setting-list ul .item {
  padding-left: 14px;
  background-color: #fff;
  color: #000;
  height: 40px;
  width: 592px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 6px 6px 6px 6px;
  border-left: 10px solid #ccc;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  margin-left: 10px;
}

.lightbox-setting .action .setting-list ul .item .circle {
  width: 20px;
  height: 20px;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
  margin-right: 7px;
}

.lightbox-setting .action .setting-list ul .item .circle.red {
  background: #FF6060;
}

.lightbox-setting .action .setting-list ul .item .circle.pink {
  background: #FFA3B9;
}

.lightbox-setting .action .setting-list ul .item .circle.purple1 {
  background: #E592F4;
}

.lightbox-setting .action .setting-list ul .item .circle.purple2 {
  background: #A9A1FF;
}

.lightbox-setting .action .setting-list ul .item .circle.blue {
  background: #9DD5FF;
}

.lightbox-setting .action .setting-list ul .item.red {
  border-left: 10px solid #FF6060;
}

.lightbox-setting .action .setting-list ul .item.pink {
  border-left: 10px solid #FFA3B9;
}

.lightbox-setting .action .setting-list ul .item.purple1 {
  border-left: 10px solid #E592F4;
}

.lightbox-setting .action .setting-list ul .item.purple2 {
  border-left: 10px solid #A9A1FF;
}

.lightbox-setting .action .setting-list ul .item.blue {
  border-left: 10px solid #9DD5FF;
}

.lightbox-setting .action .setting-list ul .item a {
  padding: 18px 10px 10px 10px;
}

.lightbox-setting .action .setting-list .center {
  text-align: center;
  display: flex;
  justify-content: center;
}


.color-picker-box {
  position: absolute;
  border-radius: 8px;
  border: 1px solid #5C5C5C;
  background: #464646;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
  padding: 10px;
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 1000;
  width: 400px;
}

.color-picker-box.hidden {
  display: none;
}

.color-picker-box input {
  padding-left: 12px;
  border: none;
  height: 40px;
  color: #000;
  font-size: 14px;
  font-weight: 300;
}

.options-box {
  max-width: 400px;
  overflow-x: auto;
  white-space: nowrap;
}

.options-box {
  max-width: 400px;
  overflow-x: auto;
  white-space: nowrap;
  scrollbar-width: thin;
  scrollbar-color: #ccc transparent;
}

.options-box::-webkit-scrollbar {
  height: 1px;
}

.options-box::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 1px;
}

.options-box::-webkit-scrollbar-track {
  background: transparent;
}

.color-options {
  display: inline-block;
}

.color-options .color {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: 4px;
  border-radius: 50%;
  cursor: pointer;
}

.color {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid transparent;
}

.color:hover {
  border: 2px solid #fff;
}

.lightbox-setting .action .setting-list .add-setting {
  width: 592px;
  height: 40px;
  flex-shrink: 0;
  border-radius: 6px;
  border: 2px solid #5C5C5C;
  background: #434343;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 15px;
  margin-top: 11px;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.lightbox-setting .action .setting-list .add-setting:hover {
  background: #504d4d;
}

.lightbox-setting .setting-content .content .tab-permission ul {
  display: flex;
  justify-content: space-between;
}

.lightbox-setting .setting-content .content .tab-permission ul li.user-mail {
  margin-right: 100px;
}

.lightbox-setting .setting-content .content .tab-permission ul li a {
  display: flex;
  align-items: center;
  color: #999;
  font-size: 14px;
  font-weight: 300;
  padding: 10px 13px 10px 10px;
}

.lightbox-setting .setting-content .content .tab-permission .w-250 {
  width: 250px;
}

.lightbox-setting .setting-content .content .tab-permission .sort {
  margin-left: 7px;
}

.lightbox-setting .setting-content .content .tab-permission .remove {
  font-size: 12px;
  font-weight: 300;
  color: #F44;
  position: relative;
}

.lightbox-setting .setting-content .content .tab-permission .remove::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 14px;
  bottom: 8px;
  height: 1px;
  background-color: #F44;
}

.setting-checkbox-input {
  display: none;
}

.setting-checkbox {
  background: #383838;
  width: 24px;
  aspect-ratio: 1 / 1;
  border-radius: 5px;
  border: 1px solid #5C5C5C;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-right: 20px;
}

.setting-checkbox::after {
  content: '';
  display: none;
  width: 17px;
  height: 17px;
  mask: url('data:image/svg+xml;utf8,<svg fill="white" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M20.285 6.709a1 1 0 00-1.414-1.418l-9.9 9.878-4.242-4.24a1 1 0 00-1.414 1.415l5 4.998a1 1 0 001.414 0l10.556-10.633z"/></svg>') no-repeat center / contain;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg fill="white" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M20.285 6.709a1 1 0 00-1.414-1.418l-9.9 9.878-4.242-4.24a1 1 0 00-1.414 1.415l5 4.998a1 1 0 001.414 0l10.556-10.633z"/></svg>') no-repeat center / contain;
  background-color: white;
}

.setting-checkbox-input:checked+.setting-checkbox {
  background: #3C8CE2;
  padding-bottom: unset;
}

.setting-checkbox-input:checked+.setting-checkbox::after {
  display: block;
}

.permission-user-img {
  width: 30px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  object-fit: cover;
  margin-right: 8px;
}

.setting-content .permission-list {
  display: block;
  position: relative;
  max-height: 500px;
  overflow-y: auto;
  border-bottom: 1px solid #5C5C5C;
}

.setting-content .permission-list::-webkit-scrollbar {
  width: 6px;
}

.setting-content .permission-list::-webkit-scrollbar-track {
  background: transparent;
}

.setting-content .permission-list::-webkit-scrollbar-thumb {
  background-color: #939393;
  border-radius: 100px;
}

.setting-content .permission-list::-webkit-scrollbar-thumb:hover {
  background-color: #a0a0a0;
}

.setting-content .permission-list table {
  width: 100%;
  table-layout: auto;
  border-collapse: collapse;
}

.setting-content .permission-list table tr {
  border-bottom: 1px solid #5C5C5C;
}

.setting-content .permission-list table td.cb-wrap {
  width: 1%;
  white-space: nowrap;
  padding: 10px 0 10px 10px;
}

.setting-content .permission-list table td.img-wrap {
  width: 1%;
  white-space: nowrap;
  padding: 10px 0 10px 0;
}

.setting-content .permission-list table td.name-wrap {
  width: 1%;
  white-space: nowrap;
  padding-right: 10px;
}

.setting-content .permission-list table td.name-wrap p {
  max-width: 168px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 168px;
}

.setting-content .permission-list table td.mail-wrap p {
  max-width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.setting-content .permission-list table td.action-wrap {
  float: right;
  padding: 15px;
  padding-right: 25px;
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.action-box {
  width: 125px;
  border-radius: 4px;
  border: 1px solid #CCC;
  background: #383838;
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
  box-sizing: border-box;
}

.setting-content .permission-list table td.action-wrap a svg {
  margin-left: 12px;
}

.setting-content .permission-list table td.action-wrap a {
  color: #999999;
  display: flex;
  justify-content: start;
  align-items: center;
}

.setting-content .permission-list table td.action-wrap a:hover {
  color: #fff;
}

.action-box a {
  padding: 5px;
  width: 100%;
  color: #fff;
  display: flex;
}

.action-box a:hover {
  background: #3C8CE2;
}

.setting-content .permission-list table td {
  padding: 10px 0 10px 0;
  padding-right: unset;
  font-size: 14px;
  font-weight: 300;
  color: #fff;
  border: none;
  word-break: break-word;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  text-overflow: ellipsis;
  position: relative;
}

.setting-content .permission-list table td.user-name {
  display: flex;
  width: 257px;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---------------- CHANNEL------------------ */
.mainMenu-channelArea-wrap {
  width: 100%;
  overflow-x: hidden;
  font-family: "Hiragino Kaku Gothic ProN";
  font-style: normal;
  line-height: normal;
  height: calc(100vh - 5px);
}

.channelList {
  column-count: 4;
  column-gap: 20px;
  padding: 20px;
}

.channelItem {
  background: white;
  border-radius: 8px;
  margin-bottom: 20px;
  display: inline-block;
  width: 100%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  padding: 16px;
  box-sizing: border-box;
}

.channelItem.nonbg {
  background: transparent;
  box-shadow: unset;
}

.channelItem .item {
  position: relative;
}

.channelItem .item .item-tag {
  position: absolute;
  top: -16px;
  right: 0;
}

.channelItem .item .item-tag-line {
  position: absolute;
  top: -10px;
  right: 0;
}

.channelItem .item .item-title-line {
  color: #999;
  font-size: 15px;
  font-weight: 600;
  margin-top: -6px;
  width: 100%;
  padding-bottom: 6px;
  position: relative;
  margin-bottom: 7px;
}

.channelItem .item .item-title-line::after {
  content: "";
  width: calc(100% + 34px);
  top: 100%;
  height: 1px;
  background: #dcdcdc;
  left: -17px;
  position: absolute;
}

.channelItem .item .item-title {
  color: #000;
  font-size: 15px;
  font-weight: 600;
  width: 100%;
  margin-bottom: 6px;
}

.channelItem .item .sub-row,
.channelItem .item .row {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.channelItem .item .row-point {
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 22px;
}

.channelItem .item .row-point p {
  color: #000;
  font-size: 12px;
  font-weight: 600;
  position: relative;
  display: flex;
  align-items: center;
}

.channelItem .item .row-point p::before {
  content: "";
  display: flex;
  align-items: center;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  margin-right: 2px;
  margin-bottom: 3px;
}

.channelItem .item .row-point p.p-red::before {
  background-color: #E36666;
}

.channelItem .item .row-point p.p-green::before {
  background-color: #9ED372;
}

.channelItem .item .row-point p.p-blue::before {
  background-color: #3C8CE2;
}

.channelItem .item .row-point p.p-yellow::before {
  background-color: #E29D62;
}

.channelItem .item .row-point p .label {
  position: absolute;
  top: -25px;
  left: 0;
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 2px 6px;
  font-size: 12px;
  color: #333;
  border-radius: 6px;
  white-space: nowrap;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  display: none;
  z-index: 1;
}

.channelItem .item .row-point p.p-red .label {
  border: 1px solid #E36666;
  color: #E36666;
}

.channelItem .item .row-point p.p-green .label {
  border: 1px solid #9ED372;
  color: #9ED372;
}

.channelItem .item .row-point p.p-blue .label {
  border: 1px solid #3C8CE2;
  color: #3C8CE2;
}

.channelItem .item .row-point p.p-yellow .label {
  border: 1px solid #E29D62;
  color: #E29D62;
}

.channelItem .item .row-point p:hover .label {
  display: block;
}

.channelItem .item .process {
  font-weight: 300;
  font-size: 13px;
  line-height: 33px;
  letter-spacing: 0;
}

.channelItem .item .row .title {
  color: #000;
  font-size: 15px;
  font-weight: 600;
  line-height: 33px;
  display: inline-block;
  max-width: 180px;
  white-space: nowrap;
  overflow: hidden;
  padding-right: 11px;
  text-overflow: ellipsis;
  position: relative;
  margin-right: 3px;
}

.channelItem .item .row .title.fw300 {
  font-weight: 300 !important;
  max-width: 149px;
}

.channelItem .fw600 {
  font-weight: 600 !important;
}

.channelItem .item .sub-row .title {
  color: #000;
  font-size: 12px;
  font-style: normal;
  font-weight: 300;
  line-height: 28px;
  text-overflow: ellipsis;
  max-width: 195px;
  white-space: nowrap;
  overflow: hidden;
}

.channelItem .item .sub-row .ticket,
.channelItem .item .row .ticket {
  display: flex;
  justify-content: space-between;
  min-width: 103px;
  align-items: center;
  gap: 3px;
}

.channelItem .item .row .ticket.custom {
  gap: 28px !important;
}

.channelItem .item .sub-row .ticket .ticketItem,
.channelItem .item .row .ticket .ticketItem {
  display: flex;
  align-items: center;
  gap: 3px;
  width: 50px;
  color: #3C8CE2;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 33px;
  position: relative;
}

.channelItem .item .sub-row .ticket .ticketItem {
  font-size: 12px;
  line-height: 28px
}

.channelItem .item .sub-row .ticket .ticketItem.open-blue::after,
.channelItem .item .row .ticket .ticketItem.open-blue::after {
  content: "";
  background: #3C8CE2;
  opacity: 0.2;
  height: 18px;
  width: 50px;
  border-radius: 4px;
  position: absolute;
  left: -2px;
}

.channelItem .item .sub-row .ticket .ticketItem.open-red::after,
.channelItem .item .row .ticket .ticketItem.open-red::after {
  content: "";
  background: #E36666;
  opacity: 0.2;
  height: 18px;
  width: 50px;
  border-radius: 4px;
  position: absolute;
  left: -2px;
}

.channelItem .item .sub-row .ticket .ticketItem.open-gray::after,
.channelItem .item .row .ticket .ticketItem.open-gray::after {
  content: "";
  background: #D9D9D9;
  opacity: 0.6;
  height: 18px;
  width: 50px;
  border-radius: 4px;
  position: absolute;
  left: -2px;
}

.mw130 {
  max-width: 130px !important;
}

.gray-color {
  color: #999 !important;
}

.red-color {
  color: #E36666 !important;
}

.channelItem .item .row .title.open::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 10px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='9' height='5' viewBox='0 0 9 5' fill='none'><path d='M9 4.24628L8.20125 5L4.5 1.50743L0.79875 5L0 4.24628L4.5 0L9 4.24628Z' fill='%23666666'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  top: 50%;
  transform: translateY(-30%);
  right: 0;
}

.channelItem .item .row .title.close::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 10px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='9' height='5' viewBox='0 0 9 5' fill='none'><path d='M0 0.753715L0.79875 0L4.5 3.49257L8.20125 0L9 0.753716L4.5 5L0 0.753715Z' fill='%23666666'/></svg>");
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  top: 50%;
  transform: translateY(-30%);
  right: 0;
}

/* ------------------CHANNEL INVITED---------------- */

.channel-invited {
  padding: 20px;
}

.channel-invited .title {
  color: #1D1D1D;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 16px;
}

.channel-invited .channel-invited-wrap {
  max-height: calc(100vh - 157px);
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #aaa transparent;
}

.channel-invited .channel-invited-wrap::-webkit-scrollbar {
  width: 6px;
}

.channel-invited .channel-invited-wrap::-webkit-scrollbar-track {
  background: transparent;
}

.channel-invited .channel-invited-wrap::-webkit-scrollbar-thumb {
  background-color: #999;
  border-radius: 10px;
  border: 2px solid transparent;
  background-clip: content-box;
}

.channel-invited .channel-invited-wrap .invite-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  background: #fff;
  box-sizing: border-box;
  margin-bottom: 10px;
  border-radius: 8px;
}

.channel-invited .channel-invited-wrap .invite-box a {
  color: #999999;
  border: 1px solid #999999;
}

.channel-invited .channel-invited-wrap .invite-box a:hover {
  color: #fff;
  border: 1px solid #3C8CE2;
  background: #3C8CE2;
}

.channel-invited .channel-invited-wrap .invite-box {
  border: 2px solid #fff;
}

.channel-invited .channel-invited-wrap .invite-box:hover {
  border: 2px solid #3C8CE2;
}

.channel-invited .channel-invited-wrap .invite-box .invite-group {
  color: #1D1D1D;
  font-size: 18px;
  font-weight: 600;
}

.channel-invited .channel-invited-wrap .invite-box .invite-detail {
  color: #999999;
  font-size: 14px;
  font-weight: 300;
}

.btn-invited {
  width: 120px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
}


/* ----------------------GRANTT------------------------- */

.gantt-container {
  overflow-x: auto;
  width: 100%;
}

.gantt-header {
  display: flex;
  position: sticky;
  top: 0;
  background: white;
  z-index: 10;
  width: calc(125vw - 100px);
}

.gantt-task-header {
  min-width: 232px;
  height: 52px;
  background: #fff;
  padding: 5px;
  border-right: 1px solid #ccc;
  position: sticky;
  left: 0;
  z-index: 11;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 1px solid #ccc;
}

.gantt-date-header {
  display: flex;
  flex-grow: 1;
  border-top: 1px solid #ccc;
}

.gantt-date {
  min-width: 50px;
  max-width: 50px;
  background: #f9f9f9;
  font-size: 15px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: end;
}

.gantt-body {
  display: flex;
  flex-direction: column;
}

.gantt-row {
  display: flex;
  min-height: 30px;
  border-top: 1px solid #eee;
  width: calc(125vw - 100px);
}

.gantt-task {
  min-width: 232px;
  padding: 5px;
  border: 1px solid #ccc;
  border-bottom: none;
  background: #fafafa;
  position: sticky;
  left: 0;
  z-index: 1;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.45em;
  height: 44px;
  display: flex;
  align-items: center;
}

.gantt-task.lv1 {
  background: #F4F5F5;
  ;
}

.gantt-task.lv2 {
  background: #E8E8E8;
  padding-left: 32px;
}

.gantt-task.lv3 {
  background: #E8E8E8;
  padding-left: calc(32px + 18px);
}

.gantt-task.lv4 {
  background: #E8E8E8;
  padding-left: calc(32px + 18px + 18px);
}

.gantt-bars {
  position: relative;
  flex-grow: 1;
  border: 1px solid #ccc;
  border-bottom: none;
  border-left: none;
}

.gantt-task.last,
.gantt-bars.last {
  border-bottom: 1px solid #ccc !important;
}

.gantt-bar {
  position: absolute;
  height: 20px;
  background: #999;
  border-radius: 4px;
  top: 50%;
  transform: translateY(-50%);
}

/* ---------------TICKET DETAIL------------------ */
.mainMenu-ticketArea-wrap {
  position: relative;
}

.ticket-detail {
  position: absolute;
  top: 0;
  right: 0;
  width: 700px;
  height: calc(100vh - 95px);
  background: #fff;
  padding-top: 27px;
  padding-left: 38px;
  padding-right: 42px;
  padding-bottom: 30px;
  border-left: 2px solid #D6D6D6;
  border-top: 1px solid #D6D6D6;
  border-bottom: 1px solid #D6D6D6;
  box-sizing: border-box;
  overflow-x: auto;
}

.ticket-detail #ticket-detail-close {
  position: absolute;
  top: 5px;
  right: 0;
  cursor: pointer;
}

.ticket-detail .head-detail {
  color: #989898;
  font-size: 12px;
  font-weight: 300;
  display: flex;
  justify-content: space-between;
  padding-bottom: 5px;
}

.ticket-detail .head-detail .button-on-cover {
  border: 1px solid #D6D6D6;
  border-radius: 15px;
  padding: 1px;
}

.ticket-detail .head-detail .button-on {
  color: #FFF;
  font-size: 9px;
  font-weight: 300;
  background: #6E6E6E;
  border-radius: 15px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 3px;
  padding-bottom: 3px;
}

.ticket-detail .title {
  color: #333;
  font-size: 20px;
  font-weight: 600;
  padding-bottom: 10px;
}

.ticket-detail .user-info {
  display: flex;
  justify-content: start;
  gap: 30px;
}

.ticket-detail .user-info li {
  color: #222;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 10px;
}

.ticket-detail .user-info .add-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 21px;
  border: 1px solid #D6D6D6;
  border-radius: 5px;
  margin-left: 8px;
}

.ticket-detail .task-info {
  border-radius: 10px;
  background: #EFEFEF;
  padding: 18px;
  margin-top: 15px;
  position: relative;
}

.ticket-detail .task-info .task {
  display: flex;
  justify-content: center;
  align-items: start;
  gap: 25px;
  position: relative;
}

.ticket-detail .task-info .chart {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 0.5s ease, opacity 0.3s ease;
}

.ticket-detail .task-info .chart.active {
  max-height: 500px;
  margin-top: 25px;
  opacity: 1;
}

#chart-icon {
  transition: transform 0.3s ease;
}

#chart-icon.rotated {
  transform: rotate(180deg);
}

.ticket-detail .task-info .chart img {
  padding: 20px;
  background: #fff;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.ticket-detail .task-info .chart .title {
  color: #222;
  font-size: 13px;
  font-weight: 600;
  padding-left: 3px;
  padding-bottom: 8px;
}

.ticket-detail .task-info #show-chart {
  position: absolute;
  bottom: -25px;
  left: 50%;
  cursor: pointer;
  border: none;
  width: 40px;
  padding-bottom: 3px;
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
  background: #EFEFEF;
  transform: translate(-50%, -50%);
}

.ticket-detail .task-info .status-item:first-child {
  padding-bottom: 25px;
}

.ticket-detail .task-info .title {
  color: #222;
  font-size: 13px;
  font-weight: 600;
  padding-bottom: 2px;
}

.ticket-detail .task-info .deadline-info .row {
  display: flex;
  margin-bottom: 4px;
  color: #222;
  font-size: 13px;
  font-weight: 300;
}

.ticket-detail .task-info .deadline-info .label {
  min-width: 120px;
  display: inline-block;
}

.ticket-detail .task-info .deadline-info .value {
  flex: 1;
}

.ticket-detail .overview {
  margin-top: 35px;
  margin-bottom: 18px;
}

.ticket-detail .overview .title {
  color: #222;
  font-size: 13px;
  font-weight: 600;
}

.ticket-detail .overview p {
  color: #333;
  font-size: 14px;
  font-weight: 300;
  font-feature-settings: "palt";
}

.ticket-detail .overview p a {
  color: #134AE0;
  font-size: 14px;
  font-weight: 300;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}

.ticket-detail hr {
  border: none;
  margin: 0;
  border-bottom: 1px solid #E2E2E2;
}

.ticket-detail .answer {
  margin-top: 14px;
}

.ticket-detail .answer .title {
  color: #7CAAF2;
  text-align: center;
  font-size: 13px;
  font-weight: 600;
}

.ticket-detail .group-comment {
  background: #F4F5F5;
  border-radius: 10px;
  padding: 16px;
  margin-top: 22px;
  margin-bottom: 24px;
}

.ticket-detail .group-comment .group-user {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 8px;
}

.ticket-detail .group-comment .group-user .title {
  color: #222;
  font-size: 13px;
  font-weight: 600;
  padding-bottom: 0;
}

.ticket-detail .group-comment .group-user .tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.ticket-detail .group-comment .group-user .tag {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2px 8px;
  border: 1px solid #ccc;
  border-radius: 50%;
  width: 24px;
  aspect-ratio: 1/1;
  background: #fff;
  margin-right: -7px;
  color: #666;
  font-size: 12px;
  font-weight: 300;
}

.ticket-detail .show-more-answer {
  text-align: center;
  color: #7CAAF2;
  font-size: 13px;
  font-weight: 600;
  padding: 15px;
}


.ticket-detail .task-group {
  display: flex;
  flex-direction: column;
  gap: 12px;
  color: #222;
  font-size: 12px;
  font-weight: 300;
  margin-bottom: 10px;
}

.ticket-detail .task-group2 {
  display: flex;
  align-items: center;
  gap: 30px;
  color: #222;
  font-size: 12px;
  font-weight: 300;
  margin-bottom: 10px;
}

.ticket-detail.hide {
  display: none;
}

.react-select__control::after {
  content: '';
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 15px;
  height: 15px;
  background-size: contain;
  background-repeat: no-repeat;
}

.highlighted-ticket {
  animation: highlight 2s;
}

@keyframes highlight {
  0% {
    background-color: yellow;
  }

  100% {
    background-color: transparent;
  }
}

/* ----------------------GRANTT------------------------- */

.gantt-container {
  overflow-x: auto;
  width: 100%;
}

.gantt-header {
  display: flex;
  position: sticky;
  top: 0;
  background: white;
  z-index: 10;
  width: calc(125vw - 100px);
}

.gantt-task-header {
  min-width: 232px;
  height: 52px;
  background: #fff;
  padding: 5px;
  border-right: 1px solid #ccc;
  position: sticky;
  left: 0;
  z-index: 11;
  font-size: 15px;
  font-weight: 600;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 1px solid #ccc;
}

.gantt-date-header {
  display: flex;
  flex-grow: 1;
  border-top: 1px solid #ccc;
}

.gantt-date {
  min-width: 50px;
  max-width: 50px;
  background: #f9f9f9;
  font-size: 15px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: end;
}

.gantt-body {
  display: flex;
  flex-direction: column;
}

.gantt-row {
  display: flex;
  min-height: 30px;
  border-top: 1px solid #eee;
  width: calc(125vw - 100px);
}

.gantt-task {
  min-width: 232px;
  padding: 5px;
  border: 1px solid #ccc;
  border-bottom: none;
  background: #fafafa;
  position: sticky;
  left: 0;
  z-index: 1;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.45em;
  height: 44px;
  display: flex;
  align-items: center;
}

.gantt-task.lv1 {
  background: #F4F5F5;
  ;
}

.gantt-task.lv2 {
  background: #E8E8E8;
  padding-left: 32px;
}

.gantt-task.lv3 {
  background: #E8E8E8;
  padding-left: calc(32px + 18px);
}

.gantt-task.lv4 {
  background: #E8E8E8;
  padding-left: calc(32px + 18px + 18px);
}

.gantt-bars {
  position: relative;
  flex-grow: 1;
  border: 1px solid #ccc;
  border-bottom: none;
  border-left: none;
}

.gantt-task.last,
.gantt-bars.last {
  border-bottom: 1px solid #ccc !important;
}

.gantt-bar {
  position: absolute;
  height: 20px;
  background: #999;
  border-radius: 4px;
  top: 50%;
  transform: translateY(-50%);
}

/* ---------------TICKET DETAIL------------------ */
.mainMenu-ticketArea-wrap {
  position: relative;
}

.ticket-detail {
  position: absolute;
  top: 0;
  right: 0;
  width: 700px;
  height: calc(100vh - 95px);
  background: #fff;
  padding-top: 27px;
  padding-left: 38px;
  padding-right: 42px;
  padding-bottom: 30px;
  border-left: 2px solid #D6D6D6;
  border-top: 1px solid #D6D6D6;
  border-bottom: 1px solid #D6D6D6;
  box-sizing: border-box;
  overflow-x: auto;
}

.ticket-detail #ticket-detail-close {
  position: absolute;
  top: 5px;
  right: 0;
  cursor: pointer;
}

.ticket-detail .head-detail {
  color: #989898;
  font-size: 12px;
  font-weight: 300;
  display: flex;
  justify-content: space-between;
  padding-bottom: 5px;
}

.ticket-detail .head-detail .button-on-cover {
  border: 1px solid #D6D6D6;
  border-radius: 15px;
  padding: 1px;
}

.ticket-detail .head-detail .button-on {
  color: #FFF;
  font-size: 9px;
  font-weight: 300;
  background: #6E6E6E;
  border-radius: 15px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 3px;
  padding-bottom: 3px;
}

.ticket-detail .title {
  color: #333;
  font-size: 20px;
  font-weight: 600;
  padding-bottom: 10px;
}

.ticket-detail .user-info {
  display: flex;
  justify-content: start;
  gap: 30px;
}

.ticket-detail .user-info li {
  color: #222;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 10px;
}

.ticket-detail .user-info .add-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 25px;
  height: 21px;
  border: 1px solid #D6D6D6;
  border-radius: 5px;
  margin-left: 8px;
}

.ticket-detail .task-info {
  border-radius: 10px;
  background: #EFEFEF;
  padding: 18px;
  margin-top: 15px;
  position: relative;
}

.ticket-detail .task-info .task {
  display: flex;
  justify-content: center;
  align-items: start;
  gap: 25px;
  position: relative;
}

.ticket-detail .task-info .chart {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height 0.5s ease, opacity 0.3s ease;
}

.ticket-detail .task-info .chart.active {
  max-height: 500px;
  margin-top: 25px;
  opacity: 1;
}

#chart-icon {
  transition: transform 0.3s ease;
}

#chart-icon.rotated {
  transform: rotate(180deg);
}

.ticket-detail .task-info .chart img {
  padding: 20px;
  background: #fff;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.ticket-detail .task-info .chart .title {
  color: #222;
  font-size: 13px;
  font-weight: 600;
  padding-left: 3px;
  padding-bottom: 8px;
}

.ticket-detail .task-info #show-chart {
  position: absolute;
  bottom: -25px;
  left: 50%;
  cursor: pointer;
  border: none;
  width: 40px;
  padding-bottom: 3px;
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
  background: #EFEFEF;
  transform: translate(-50%, -50%);
}

.ticket-detail .task-info .status-item:first-child {
  padding-bottom: 25px;
}

.ticket-detail .task-info .title {
  color: #222;
  font-size: 13px;
  font-weight: 600;
  padding-bottom: 2px;
}

.ticket-detail .task-info .deadline-info .row {
  display: flex;
  margin-bottom: 4px;
  color: #222;
  font-size: 13px;
  font-weight: 300;
}

.ticket-detail .task-info .deadline-info .label {
  min-width: 120px;
  display: inline-block;
}

.ticket-detail .task-info .deadline-info .value {
  flex: 1;
}

.ticket-detail .overview {
  margin-top: 35px;
  margin-bottom: 18px;
}

.ticket-detail .overview .title {
  color: #222;
  font-size: 13px;
  font-weight: 600;
}

.ticket-detail .overview p {
  color: #333;
  font-size: 14px;
  font-weight: 300;
  font-feature-settings: "palt";
}

.ticket-detail .overview p a {
  color: #134AE0;
  font-size: 14px;
  font-weight: 300;
  text-decoration-line: underline;
  text-decoration-style: solid;
  text-decoration-skip-ink: none;
  text-decoration-thickness: auto;
  text-underline-offset: auto;
  text-underline-position: from-font;
}


.ticket-detail .answer {
  margin-top: 14px;
}

.ticket-detail.hide {
  display: none;
}

.ticket-detail .task-item {
  gap: 10px;
  cursor: pointer;
  line-height: 1.6;
  position: relative;
}

.ticket-detail input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  border: 1px solid #ccc;
  border-radius: 50%;
  cursor: pointer;
  position: absolute;
  top: 45%;
  left: 0;
  transform: translate(-50%, -50%);
  background-color: #fff;
  transition: all 0.2s ease;
}

.ticket-detail .task-group2 input[type="checkbox"] {
  top: 30%;
}

.ticket-detail input[type="checkbox"]:checked::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  background-color: #C9C9C9;
  border-radius: 50%;
}

.ticket-detail .task-group2 input[type="checkbox"]:checked::before {
  background-color: #6E8698;
}

.ticket-detail .task-item input[type="checkbox"]:checked+.task-text {
  text-decoration: line-through;
  color: #999;
}

.ticket-detail .task-text2,
.ticket-detail .task-text {
  display: inline-block;
  white-space: pre-wrap;
  word-break: break-word;
  padding-left: 25px;
}

.ticket-detail .task-text2 {
  padding-left: 20px;
}

.ticket-detail .checklist {
  margin-top: 20px;
  margin-bottom: 20px;
}

.ticket-detail .checklist .title {
  color: #222;
  font-size: 13px;
  font-weight: 600;
}

.ticket-detail .checklist textarea {
  width: 100%;
  resize: none;
  height: 65px;
  border: 1px solid #E2E2E2;
  border-radius: 10px;
  padding: 10px;
  margin-bottom: 12px;
}

/* -------------------------------------------- */
.chat-message {
  font-family: sans-serif;
  font-size: 14px;
  background: #fff;
  padding: 0 10px;
  padding-left: 16px;
  border-left: 5px solid #FC9E9E;
  margin-bottom: 22px;
  margin-top: 10px;
  position: relative;
  line-height: 1.6;
}

.chat-message.bg {
  background: #F4F5F5;
}

.meta {
  font-size: 12px;
  margin-bottom: 5px;
  display: flex;
  align-items: center;
  color: #9B9B9B;
  font-size: 13px;
  font-weight: 300;
  gap: 12px;
}

.meta .time,
.meta .name {
  color: #9B9B9B;
  padding-top: 3px;
}

.chat-message .message-image {
  display: flex;
  justify-content: start;
  flex-wrap: wrap;
  gap: 15px 15px;
  margin-top: 10px;
  margin-bottom: 10px;
}

.chat-message .message-image img {
  width: 60px;
  height: 60px;
  border: 2px solid #EFEFEF;
  border-radius: 10px;
  object-fit: contain;
}

.message-body {
  margin-bottom: 8px;
}

.reaction-bar {
  display: inline-flex;
  align-items: end;
  gap: 6px;
  position: relative;
  margin-left: 10px;
}

.reaction {
  font-size: 13px;
}

.reaction-menu-trigger img {
  cursor: pointer;
  width: 19px;
  height: 19px;
}

.reaction-menu {
  position: absolute;
  background: #fff;
  border-radius: 8px;
  padding: 8px 10px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  display: none;
  flex-wrap: wrap;
  gap: 6px;
  z-index: 9999;
  width: 208px;
}

.reaction-menu .emoji {
  font-size: 20px;
  cursor: pointer;
  transition: transform 0.2s;
  border: none;
  outline: none;
  background: none;
  padding: 0;
}

.reaction-menu .emoji:hover {
  transform: scale(1.3);
}

/* -------------------------------------------- */

.btn-add-schedule {
  background: #E3E3E3;
  border: none;
  width: 100%;
  border-radius: 25px;
  cursor: pointer;
}

.btn-add-schedule.color {
  color: #AFAFAF;
}

.status-select {
  position: relative;
  display: inline-block;
}

.status-indicator {
  display: flex;
  align-items: center;
  padding: 1px 12px;
  border: 1px solid #ccc;
  border-radius: 20px;
  background-color: white;
  cursor: pointer;
  color: #818181;
  font-size: 13px;
  font-weight: 300;
  width: 130px;
}

.status-indicator.w150 {
  width: 150px;
}

.status-indicator.fz12 {
  font-size: 12px;
}

.status-indicator .dot {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  margin-right: 6px;
}

.status-indicator .undot {
  width: 0;
  height: 13px;
  margin-right: 0;
}

.status-indicator .red {
  background-color: #E36666;
}

.status-indicator .green {
  background-color: #9ED372;
}

.status-indicator .arrow {
  position: absolute;
  right: 7%;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #888;
}

.status-select select {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

/* ---------------------------------TEXTAREA */
.editor-wrapper {
  margin-bottom: 20px;
}

.editor-container {
  border: 1px solid #ddd;
  border-radius: 8px;
  font-family: sans-serif;
  background: #fff;
}

.toolbar {
  border-bottom: 1px solid #ddd;
  padding: 5px;
  display: flex;
  gap: 5px;
}

.toolbar button {
  background: none;
  border: none;
  color: #555;
  cursor: pointer;
  border-right: 1px solid #E2E2E2;
  width: 33px;
  color: #767676;
  font-size: 15px;
  font-weight: 600;
}

.toolbar button:hover {
  color: #000;
}

.rich-textarea {
  min-height: 120px;
  padding: 10px;
  outline: none;
  border: none;
}

textarea.hidden-textarea {
  display: none;
}

.group-btn-sb {
  display: flex;
  justify-content: flex-end;
}

.button-submit-area {
  background: #5D5D5D;
  color: #FFF;
  font-size: 12px;
  font-weight: 600;
  width: 95px;
  height: 31px;
  border: none;
  border-radius: 5px;
  margin-top: -10px;
}

.input-date {
  background-color: transparent;
  border: none;
}

.task-buttons-right {
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
}

.task-button {
  margin-left: 10px;
}


.btn-cancel-task {
  background-color: white;
  color: #4a4a4a;
  /* xám đậm */
  border: 1px solid #ccc;
  padding: 8px 16px;
  border-radius: 4px;
  cursor: pointer;
  width: 120px;
}

.btn-cancel-task:hover {
  background-color: #f5f5f5;
}

.btn-save-task {
  background-color: #4285f4;
  /* xanh giống nút trong ảnh */
  color: white;
  border: none;
  padding: 8px 16px;
  border-radius: 4px;
  margin-left: 8px;
  cursor: pointer;
  width: 120px;
}

.btn-save-task:hover {
  background-color: #357ae8;
}


.color-picker-container {
  width: 100%;
  overflow-x: auto;
}

.color-picker {
  display: flex;
  padding: 10px 0;
  width: max-content;
}

.color-circle {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: none;
  margin: 0 5px;
  cursor: pointer;
  flex-shrink: 0;
}

.color-circle.selected {
  border: 4px solid white;
}

.edit-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.edit-form input[type="text"] {
  padding: 10px;
  border: 1px solid #ccc;
}

.edit-form button {
  padding: 5px 10px;
  background-color: #007bff;
  /* color: white; */
  border: none;
  cursor: pointer;
}

.edit-form button:hover {
  background-color: #0056b3;
}

.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.modal-content {
  background-color: #464646;
  padding: 20px;
  border-radius: 5px;
  width: 80%;
  max-width: 500px;
}

.modal-buttons {
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
}

.modal-buttons button {
  margin-left: 10px;
}

.limit-message {
  font-size: 13px;
  color: red;
  margin-top: 10px;
}

.react-select-container {
  width: 100%;
}

.react-select__control {
  border-radius: 4px;
  border: 1px solid #ccc;
}

.react-select__option {
  cursor: pointer;
}

.react-select__option--is-selected {
  background-color: #3C8CE2;
}

.react-select__dropdown-indicator {
  display: none;
}

.react-select__control::after {
  content: '';
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 15px;
  height: 15px;
  background-size: contain;
  background-repeat: no-repeat;
}

.highlighted-ticket {
  animation: highlight 2s;
}

@keyframes highlight {
  0% {
    background-color: yellow;
  }

  100% {
    background-color: transparent;
  }

}