@import url('https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900&display=swap&css');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900&display=swap&css');
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap&css');
/********** common **********/
/********** roomAddress **********/
/********** mypage **********/
html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
  text-rendering: optimizeLegibility;
}
* {
  box-sizing: border-box;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
button,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video,
select,
keygen,
xmp,
plaintext,
listing {
  margin: 0;
  padding: 0;
  outline: none;
  font-size: 100%;
  font-family: 'Lato', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', '돋움', dotum, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  line-height: 1;
  vertical-align: baseline;
}
/* body min widht */
body .desktop {
  min-width: 960px;
}
body .table,
body .mobile {
  min-width: 320px;
}
caption {
  display: none;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
section {
  display: block;
}
ul {
  list-style: none;
  *zoom: 1;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
  display: table;
}
a {
  text-decoration: none;
  color: inherit;
}
a:hover {
  color: inherit;
}
img {
  border: none;
  text-indent: -9999px;
}
strong,
b {
  font-weight: bold;
}
button {
  cursor: pointer;
  background: none;
  border: none;
  outline: none;
}
fieldset,
input {
  border: none;
}
label {
  display: block;
  margin: 0;
  max-width: none;
  vertical-align: middle;
}
input[type=checkbox],
input[type=radio] {
  margin: 0;
  vertical-align: middle;
}
input[type=number] {
  text-align: right;
}
select,
input,
textarea {
  outline: none;
  font-family: 'Lato', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', '돋움', dotum, 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
button,
a {
  border: none;
  outline: none;
  font-family: 'Lato', 'Noto Sans KR', '맑은 고딕', 'Malgun Gothic', '돋움', dotum, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  cursor: pointer;
}
em {
  font-style: normal;
}
.clearfix {
  *zoom: 1;
}
.clearfix:before,
.clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}
::-webkit-input-placeholder {
  color: #484848;
  vertical-align: middle;
  text-align: left;
  font-size: 14px;
  font-weight: normal;
}
.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}
.show {
  display: block;
}
.hidden {
  display: none;
}
.hidden-ip {
  display: none !important;
}
.screenCenter {
  display: flex;
  justify-content: center;
  align-items: center;
}
/************************************************************/
/************************************************************/
/************************************************************/
.pd00 {
  padding: 0 !important;
}
.redColor {
  color: #f05 !important;
}
.txL {
  text-align: left !important;
}
.txC {
  text-align: center !important;
}
.txR {
  text-align: right !important;
}
.underline {
  text-decoration: underline;
}
/************************************************************/
.site-wrapper,
.site-wrapper-inner {
  height: 100%;
}
.mypageBg {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url("../../../images/mypage/userBgImg.png") center top no-repeat;
  background-size: cover;
  filter: brightness(0.7);
}
:after,
:before {
  box-sizing: border-box;
}
/* -- input Range S -- */
.grm-input-range {
  text-align: center;
}
.grm-input-range input[type="range"],
.grm-input-range-desc {
  float: left;
  box-sizing: border-box;
  width: 40px;
  height: 100%;
  margin: 0;
  font-size: 1rem;
  color: #666;
  line-height: 50px !important;
}
.grm-input-range input[type="range"],
.grm-input-range-desc:hover {
  color: #59f;
}
.grm-input-range input[type="range"] {
  -webkit-appearance: none;
  width: 80px;
  padding: 18px 0;
  background: transparent;
  cursor: default;
  vertical-align: 1px;
}
.grm-input-range input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  border: 2px solid #09f;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: #fff;
  margin-top: -5px;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.6);
}
.grm-input-range input[type="range"]:focus {
  outline: none;
}
.grm-input-range input[type="range"]::-webkit-slider-runnable-track {
  width: 100%;
  height: 8px;
  background: rgba(0, 0, 0, 0.3);
  /*box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;*/
  /*background: #3071a9;*/
  border-radius: 10px;
  border: 1px solid #0cf;
}
.grm-input-range input[type="range"]:focus::-webkit-slider-runnable-track {
  background: #0cf;
}
/* -- input Range E -- */
/* -- Button S -- */
.btn-grm-normal-001 {
  display: inline-block;
  min-width: 40px;
  height: 40px;
  padding: 0 20px;
  border: 1px solid rgba(0, 0, 0, 0.4);
  border-radius: 4px;
  font-size: 0.9rem;
  text-align: center;
  line-height: 40px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}
.btn-ani-arrow-left {
  padding: 12px 14px;
  border-radius: 4px;
  background: url(../../../images/icon/ico_arrowLeft_white.svg) -20px center no-repeat;
  background-size: auto 40%;
  background-color: #737898;
  font-size: 0.8rem;
  color: white;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  transition: 0.2s ease-out;
}
.btn-ani-arrow-left:hover {
  padding: 12px 14px 12px 34px;
  background: url(../../../images/icon/ico_arrowLeft_white.svg) 8px center no-repeat;
  background-size: auto 40%;
  background-color: #09f;
}
.btn-ani-arrow-right {
  display: inline-block;
  min-width: 40px;
  height: 40px;
  padding: 0 20px;
  background: url(../../../images/icon/ico_arrowRight_white.svg) 130% center no-repeat;
  background-size: auto 44%;
  background-color: #09f;
  color: white;
  text-align: left;
  font-size: 1rem;
  font-weight: bold;
  border-radius: 4px;
  line-height: 40px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  transition: 0.2s ease-out;
}
.btn-ani-arrow-right:hover {
  padding: 0 60px 0 20px;
  background: url(../../../images/icon/ico_arrowRight_white.svg) 90% center no-repeat;
  background-size: auto 44%;
  background-color: #205dcf;
}
/* -- Button E -- */
/* -- Dialog S -- */
.grm-dialog {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  /********** Emergency Notification **********/
}
.grm-dialog .grm-dialog-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  text-align: center;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer {
  padding: 0;
  background: white;
  border: none;
  overflow: hidden;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .grm-dialog-top {
  padding: 24px 30px;
  background-color: #ff0069;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .grm-dialog-title {
  font-size: 24px;
  font-weight: 100;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .grm-dialog-body {
  padding: 24px 30px;
  text-align: left;
  color: #666;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .grm-dialog-body > p {
  margin-bottom: 18px;
  letter-spacing: -0.5px;
  line-height: 1.8;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .grm-dialog-body label {
  display: block;
  padding-bottom: 10px;
  font-size: 12px;
  color: #07f;
  line-height: 1;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .grm-dialog-body .updateDateRec {
  margin-bottom: 24px;
  padding: 14px;
  background-color: #f0f3f5;
  border-radius: 2px;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .grm-dialog-body .noticeDate {
  color: #333;
  font-weight: bold;
  letter-spacing: 0;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .dialogBottomBtnRec {
  text-align: center;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .grm-dialog-footer .todayNotView {
  padding: 6px 0;
  background-color: #e5e5e5;
  text-align: center;
}
.grm-dialog[data-s-notice] .grm-dialog-msg-layer .grm-dialog-footer .todayNotView > label {
  font-size: 11px;
  color: #999;
}
.grm-dialog.updateVersion {
  display: none;
  right: 0;
  bottom: 0;
  width: auto;
  height: auto;
  justify-content: center;
  align-items: center;
  z-index: 9;
}
.grm-dialog.updateVersion[data-show="true"] {
  display: flex;
}
.grm-dialog-header {
  padding: 30px 30px 16px;
}
.grm-dialog-header .clsBtnRec {
  position: absolute;
  top: 20px;
  right: 20px;
  height: 40px;
}
.grm-dialog-header .clsBtnRec .clsBtn {
  width: 40px;
  height: inherit;
  background: url("../../../images/icon/ico_x.svg") center no-repeat;
  background-size: auto 40%;
  border-radius: 50%;
  opacity: 0.5;
  transition: 0.2s ease-out;
}
.grm-dialog-header .clsBtnRec .clsBtn:hover {
  background: #eee url("../../../images/icon/ico_x.svg") center no-repeat;
  background-size: auto 30%;
  opacity: 1;
  transform: rotate(90deg);
}
.grm-dialog-msg-layer {
  display: inline-block;
  position: relative;
  top: 50%;
  min-width: 320px;
  max-width: 440px;
  background-color: white;
  border-radius: 10px;
  text-align: center;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
  transform: translateY(-50%);
  z-index: 99;
}
.grm-dialog-msg-layer .grm-dialog-top {
  padding: 36px 30px 20px;
}
.grm-dialog-msg-layer .grm-dialog-title {
  text-align: center;
  font-size: 24px;
}
.grm-dialog-msg-layer .grm-dialog-body {
  padding: 0 30px;
  text-align: center;
  font-size: 14px;
  color: #666;
  line-height: 1.6;
  word-wrap: break-word;
}
.grm-dialog-msg-layer .grm-dialog-body .grm-dialog-body-txt {
  line-height: 1.5;
}
.grm-dialog-msg-layer .grm-dialog-body.pd00 {
  padding: 0;
}
.grm-dialog-msg-layer [data-tmp-pass] {
  box-sizing: border-box;
  width: 100%;
  height: 40px;
  padding: 0 12px;
  border-radius: 20px;
  background-color: #f2f4f6;
  text-align: center;
  font-size: 16px;
  color: #333;
  line-height: 40px;
  transition: 0.1s ease-out;
}
.grm-dialog-msg-layer [data-tmp-pass]::-webkit-input-placeholder {
  text-align: center;
  font-size: 15px;
  font-weight: normal;
  color: rgba(0, 0, 0, 0.4);
}
.grm-dialog-msg-layer [data-tmp-pass]:focus {
  background-color: rgba(0, 0, 0, 0.1);
}
.grm-dialog-msg-layer .grm-dialog-footer {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30px;
}
.grm-dialog-msg-layer .grm-dialog-bottomBtnsRec {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  font-size: 0;
}
.grm-dialog-msg-layer.newDialog {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  min-width: auto;
  max-width: 100%;
  margin: 0;
  padding: 0;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
  border: none;
  border-radius: 0;
  outline: none;
  box-shadow: none;
  transform: none;
  pointer-events: auto;
}
/* -- Dialog E -- */
/* -- grm tooltip S -- */
.grm-tooltip {
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 1;
  color: #fff;
  font-size: 0.9rem;
  pointer-events: none;
  opacity: 0.9;
}
.grm-tooltip > div {
  display: block;
}
.grm-tooltip .grm-tooltip-body {
  position: relative;
  padding: 8px;
  border-radius: 6px;
  background-color: #000;
  text-align: center;
  line-height: 1.5;
}
.grm-tooltip .grm-tooltip-arrow {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 7px solid #000;
}
.grm-tooltip[data-tooltip-direction="down"] .grm-tooltip-arrow,
.grm-tooltip[data-tooltip-direction="up"] .grm-tooltip-arrow,
.grm-tooltip[data-tooltip-direction="leftdown"] .grm-tooltip-arrow {
  margin: 0 auto;
}
.grm-tooltip[data-tooltip-direction="right"] > div {
  display: inline-block;
}
.grm-tooltip[data-tooltip-direction="right"] .grm-tooltip-arrow {
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-right: 7px solid #000;
}
.grm-tooltip[data-tooltip-direction="left"] > div {
  display: inline-block;
}
.grm-tooltip[data-tooltip-direction="left"] .grm-tooltip-arrow {
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 7px solid #000;
}
.grm-tooltip[data-tooltip-direction="up"] .grm-tooltip-arrow {
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 7px solid transparent;
  border-top: 7px solid #000;
}
.grm-tooltip[data-tooltip-direction="bottom"] .grm-tooltip-arrow {
  margin-left: 10px;
}
.grm-tooltip.room-user-btn .grm-tooltip-body {
  background-color: #09f;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.grm-tooltip.room-user-btn .grm-tooltip-body > p {
  line-height: 1.6;
}
.grm-tooltip.room-user-btn .grm-tooltip-arrow {
  border-bottom: 7px solid #09f;
}
/* -- grm tooltip E -- */
/* -- select S -- */
/* IE 10, 11의 네이티브 화살표 숨기기 */
.grm-select {
  position: relative;
  display: inline-block;
}
.grm-select select {
  /* 네이티브 외형 감추기 */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  /* 원하는 너비설정 */
  width: inherit;
  height: inherit;
  padding: 0 24px 0 10px;
  /* .3em 2em 0.3em 0.8em; */
  /* 여백으로 높이 설정 */
  letter-spacing: 0;
  /* 네이티브 화살표 대체 */
  /* 	background: url(https://farm1.staticflickr.com/379/19928272501_4ef877c265_t.jpg) no-repeat 95% 50%; */
  background-color: #333;
  color: white;
  border: none;
  border-radius: 20px;
  /* iOS 둥근모서리 제거 */
  line-height: 24px;
}
.grm-select select:focus {
  outline: none;
}
.grm-select select::-ms-expand {
  display: none;
}
.grm-select select.select-box-size-s {
  width: 72px;
}
.grm-select:before,
.grm-select:after {
  content: '';
  position: absolute;
  display: block;
  background-color: #09f;
  width: 2px;
  height: 25%;
  border-radius: 2px;
  transition: transform 0.3s;
}
.grm-select:before {
  transform: rotate(-45deg);
  top: 38%;
  right: 14px;
}
.grm-select:after {
  transform: rotate(45deg);
  top: 38%;
  right: 10px;
}
/* -- select E -- */
/* -- grm toggle S -- */
/* -- toggle default [off] -- */
[data-grm-checkbox="toggle"] {
  position: relative;
  background-color: rgba(0, 0, 0, 0.4);
  box-sizing: border-box;
  width: 72px;
  height: 24px;
  border-radius: 30px;
  text-align: center;
  font-size: 11px;
  font-weight: bold;
  line-height: 24px;
  cursor: pointer;
  transition: 200ms ease-out;
}
[data-grm-checkbox="toggle"]:before {
  content: '';
  position: absolute;
  left: -1px;
  top: -1px;
  width: 26px;
  height: 26px;
  border-radius: 100%;
  background-color: #666;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
  transition: inherit;
}
[data-grm-checkbox="toggle"][data-grm-checkbox-offcolor="gray"]:before {
  background-color: #666666;
}
[data-grm-checkbox="toggle"][data-grm-checkboxSize="S"] {
  width: 40px;
  height: 10px;
}
[data-grm-checkbox="toggle"][data-grm-checkboxSize="S"]:before {
  top: -4px;
  width: 18px;
  height: 18px;
}
[data-grm-checkbox="toggle"][data-grm-checkboxSize="S"][data-grm-on="true"]:before {
  left: calc(100% - 18px);
}
[data-grm-checkbox="toggle"].toggle-ui-light {
  background-color: rgba(0, 0, 0, 0.1);
}
[data-grm-checkbox="toggle"].toggle-ui-light:before {
  background-color: white;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
[data-grm-checkbox="toggle"][data-checkbox-bg="white"] {
  background-color: #ddd;
}
[data-grm-checkbox="toggle"][data-checkbox-bg="white"]:before {
  background-color: white;
}
[data-grm-checkbox="toggle"][data-grm-on="true"] {
  padding: 0 24px 0 0;
  background-color: #36f;
  color: white;
}
[data-grm-checkbox="toggle"][data-grm-on="true"]:before {
  left: 46px;
  background-color: #59f;
}
[data-grm-checkbox="toggle"][data-grm-on="false"] {
  padding: 0 0 0 22px;
  color: #aaa;
  /*
		&[data-grm-name="open-type"] {
			padding: 0 0 0 20px !important;
			background-color: rgba(255,0,90,0.7);
			color: white;

			&:before {
				background-color: #f05;
			}
		}
		*/
}
[data-grm-checkbox="toggle"][data-grm-on="false"]:before {
  left: 0;
}
/* -- grm toggle E -- */
/***********************************/
/********** common footer **********/
.footerSec {
  position: relative;
  max-width: 1000px;
  margin: 0 auto;
  padding: 60px 0;
  font-size: 0;
}
.footerSec > div {
  display: inline-block;
  box-sizing: border-box;
  width: 25%;
  padding-right: 30px;
  vertical-align: top;
}
.footerSec .logoRec {
  width: 20%;
  height: 30px;
  background: url("../../../images/logo/logo_grm_white.svg") left center no-repeat;
  background-size: auto 150%;
  opacity: 0.5;
}
.footerSec .contactRec > p,
.footerSec .companyInfoRec > p {
  margin-bottom: 10px;
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0;
  line-height: 1.6;
}
.footerSec .contactRec > p > span,
.footerSec .companyInfoRec > p > span {
  padding-left: 6px;
  color: white;
  letter-spacing: 0.5px;
}
.footerSec .contactRec > p.companyName,
.footerSec .companyInfoRec > p.companyName {
  color: white;
}
.footerSec .contactRec > p:last-child,
.footerSec .companyInfoRec > p:last-child {
  margin: 0;
}
.footerSec .companyInfoRec > p > span {
  color: rgba(255, 255, 255, 0.4);
}
.copyrightRec {
  padding: 20px 0;
  background-color: rgba(0, 0, 0, 0.2);
  text-align: center;
  font-size: 0.75rem;
  font-weight: 100;
  color: rgba(255, 255, 255, 0.3);
  letter-spacing: 0.5px;
}
/*******************************************************/
/******************** sign in layer ********************/
/*******************************************************/
.signin-btn {
  display: inline-block;
  padding: 10px 14px;
  border: 1px solid white;
  border-radius: 2px;
  font-size: 1.5rem;
  color: white;
  line-height: 1;
  cursor: pointer;
}
.signin-btn.join {
  margin-right: 6px;
}
.signin-btn:hover,
.signin-btn:active {
  background-color: white;
  color: #333;
}
.loginPopupLayer {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 80px 0;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 99;
}
.loginPopupLayer[data-show="true"] {
  display: flex;
}
.loginPopupLayer.bgColorNone {
  background: none;
}
.signin-popup-layer {
  position: absolute;
  top: 0;
  right: 0;
  width: 580px;
  border-radius: 6px;
  background-color: rgba(0, 0, 0, 0.9);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
  text-align: left;
  display: none;
  letter-spacing: -0.5px;
}
.signin-popup-layer .regLogin,
.signin-popup-layer .snsLogin {
  width: 100%;
  padding: 30px;
}
.signin-popup-layer .snsLogin {
  border-top: 1px solid rgba(0, 0, 0, 0.2);
}
.signin-popup-layer[data-apptype="ios"] {
  width: auto;
}
.signin-popup-layer [data-social="linkedin"] {
  display: none !important;
}
.signin-popup-layer.ori-signin-only {
  width: auto;
}
.signin-popup-layer.ori-signin-only .snsLogin {
  display: none !important;
}
.signin-popup-layer.newVer {
  display: block;
  position: relative;
  top: auto;
  right: auto;
  width: 360px;
  background-color: white;
  overflow-y: auto;
}
.signin-popup-layer.newVer .popupClsBtn {
  position: absolute;
  top: 30px;
  right: 30px;
  width: 24px;
  min-width: auto;
  height: 24px;
  padding: 0;
  border-radius: 50%;
  background: url("../../../images/icon/ico_x.svg") center no-repeat;
  background-size: auto 50%;
  opacity: 0.5;
  transition: 0.2s ease-out;
}
.signin-popup-layer.newVer .popupClsBtn:hover {
  background: #f05 url("../../../images/icon/ico_x_white.svg") center no-repeat;
  background-size: auto 40%;
  opacity: 1;
  transform: rotate(90deg);
}
.signin-popup-layer.edu-type-login .signin-popup-header-default {
  display: none;
}
.signin-popup-layer.edu-type-login .signin-popup-header-edu-type {
  display: block;
}
.signin-popup-layer .inputField {
  box-sizing: border-box;
  width: 100%;
  height: 44px;
  margin-bottom: 8px;
  padding: 12px 14px;
  background-color: #f4f4f4;
  border: 1px solid #f4f4f4;
  border-radius: 4px;
  font-size: 14px;
  font-weight: bold;
  outline: none;
  color: #333;
  transition: 0.2s ease-out;
}
.signin-popup-layer .inputField::-webkit-input-placeholder {
  color: #999;
  font-size: 14px;
  letter-spacing: 0 !important;
}
.signin-popup-layer .inputField:focus {
  background-color: white;
  border-color: #59f;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
}
.signin-popup-header {
  position: relative;
  line-height: 1;
}
.signin-popup-header-title {
  font-size: 18px;
  font-weight: bold;
}
.signin-popup-header-title > span {
  letter-spacing: 0.2px;
}
.signin-popup-header-desc {
  padding-top: 10px;
  font-size: 14px;
  color: #999;
  letter-spacing: -0.2px;
}
.signin-popup-header-desc.edu-type {
  line-height: 1.6;
}
.signin-popup-header-edu-type {
  display: none;
}
.joinFindPwdRec {
  margin-top: 24px;
}
.findPwdRec,
.joinRec {
  display: flex;
  justify-content: space-between;
  line-height: 1;
}
.findPwdRec .secTitle,
.joinRec .secTitle,
.findPwdRec .secBtn,
.joinRec .secBtn {
  margin: 0;
  padding: 0;
  font-size: 13px;
  color: #999;
}
.findPwdRec .secBtn:hover,
.joinRec .secBtn:hover {
  color: #59f;
}
.joinRec {
  margin-top: 18px;
}
.signin-popup-body {
  margin-top: 20px;
  font-size: 0;
  /* line-height: 25px; */
}
.signin-popup-body .btnLogin {
  width: 100%;
  height: 44px;
  background-color: #09f;
  font-size: 18px;
  color: white;
  cursor: pointer;
  border-radius: 4px;
  border: none;
  outline: none;
  letter-spacing: -1px;
}
.signin-popup-body ul {
  margin: 0;
  padding: 0;
  font-size: 0;
}
.signin-popup-body .loginOption {
  display: flex;
  margin-top: 16px;
}
.signin-popup-body .loginOption li {
  flex: 1;
}
.signin-popup-body .loginOption li label {
  display: flex;
  align-items: center;
  font-size: 13px;
  font-weight: normal;
  color: #aaa;
}
.signin-popup-body .loginOption li label > span {
  margin-left: 6px;
}
.signin-popup-body .loginOption li input[type=checkbox] {
  width: 16px;
  height: 16px;
  border-radius: 100%;
  background: #ddd url('../../../images/icon/ico_check_white.svg') center no-repeat;
  background-size: auto 50%;
  -webkit-appearance: none;
  appearance: none;
  border: none;
  outline: none;
}
.signin-popup-body .loginOption li input[type=checkbox]:checked {
  background-color: #59f;
}
.signin-social-btn {
  display: block;
  width: 100%;
  height: 40px;
  margin-top: 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: 200ms;
  opacity: 0.8;
}
.signin-social-btn:first-child {
  margin: 0;
}
.signin-social-btn:hover {
  opacity: 1;
}
.signin-social-btn[data-social="facebook"] {
  background: #33599d url("../../../images/social/facebook/btn_facebook.png") center no-repeat;
  background-size: auto 90%;
}
.signin-social-btn[data-social="google"] {
  background: #ee2c19 url("../../../images/social/google/btn_google.png") center no-repeat;
  background-size: auto 90%;
}
.signin-social-btn[data-social="naver"] {
  background: #23b300 url("../../../images/social/naver/btn_naver.svg") center no-repeat;
  background-size: auto 40%;
}
.signin-social-btn[data-social="linkedin"] {
  background: #0374b3 url("../../../images/social/linkedin/btn_linkedin.png") center no-repeat;
  background-size: auto 90%;
}
.signin-social-btn[data-social="apple"] {
  background: white url("../../../images/social/apple/btn_apple.png") center no-repeat;
  background-size: auto 40%;
  border: 1px solid #666;
}
.signin-popup-input-row {
  display: block;
  padding: 10px 0px;
  font-size: 1em;
}
.signin-popup-input-row label {
  display: inline-block;
  width: 65px;
}
.signin-popup-input-row input {
  display: inline-block;
  width: 200px;
  border: 1px solid #ccc;
  border-radius: 5px;
  background-color: #333333;
  color: #fff;
  padding: 0px 5px;
}
.signin-popup-footer {
  clear: both;
  padding: 18px 0 24px;
  text-align: center;
}
.signin-user-layer {
  display: flex;
  position: relative;
  align-items: center;
}
.signin-user-profile-img {
  position: relative;
  width: 36px;
  height: 36px;
  background: url("../../../images/common/signin/loginNoImage.svg") no-repeat;
  background-size: 100%;
  cursor: pointer;
}
.signin-user-profile-img:after {
  content: '';
  display: none;
  position: absolute;
  right: -4px;
  bottom: -4px;
  width: 18px;
  height: 18px;
  border-radius: 100%;
  box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.2);
}
.signin-user-profile-img img {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.3);
}
.signin-user-profile-img img[src=""] {
  display: none;
}
.signin-user-profile-img[data-social-providerid]:after {
  display: none;
}
.signin-user-profile-img[data-social-providerid="facebook"]:after {
  background: url("../../../images/social/facebook/ico_facebook.svg") center no-repeat;
  background-size: auto 100%;
  display: block;
}
.signin-user-profile-img[data-social-providerid="google"]:after {
  background: white url("../../../images/social/google/ico_google.svg") center no-repeat;
  background-size: auto 50%;
  display: block;
}
.signin-user-profile-img[data-social-providerid="naver"]:after {
  background: url("../../../images/social/naver/ico_naver.svg") center no-repeat;
  background-size: auto 120%;
  display: block;
}
.signin-user-info {
  display: none;
  box-sizing: border-box;
  height: 40px;
  padding: 6px 60px 0 56px;
  min-width: 120px;
  text-align: left;
}
.signin-user-info-btn-arrow {
  position: relative;
  display: inline-block;
  width: 24px;
  height: 24px;
  margin-left: 8px;
  border-radius: 100%;
  background: rgba(255, 255, 255, 0.2) url('../../../images/icon/ico_arrowLineDown_white.svg') center no-repeat;
  background-size: auto 36%;
  cursor: pointer;
}
.signin-user-info-btn-arrow:hover {
  background: white url('../../../images/icon/ico_arrowLineDown.svg') center no-repeat;
  background-size: auto 36%;
}
.signin-user-popup-layer {
  display: none;
  position: absolute;
  top: 50px;
  right: 0;
  z-index: 10;
}
.signin-user-popup-wrapper {
  background-color: white;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
}
.signin-user-popup-profile {
  display: flex;
  align-items: center;
  padding: 20px 26px 20px 20px;
}
.signin-user-popup-profile .profile-img-wrapper {
  width: 40px;
  height: 40px;
  border-radius: 100%;
  background: url("../../../images/common/signin/loginNoImage.svg") no-repeat;
  background-size: auto 100%;
  overflow: hidden;
}
.signin-user-popup-profile .profile-img {
  width: 100%;
  height: 100%;
}
.signin-user-popup-profile .profile-img[src=""] {
  display: none;
}
.profile-popup-info {
  margin-left: 16px;
}
.profile-popup-info .user-info-name {
  font-size: 14px;
  font-weight: 500;
  color: black;
}
.profile-popup-info .user-email {
  margin-top: 6px;
  font-size: 13px;
  color: #999;
}
.profile-popup-info .user-email > a {
  white-space: nowrap;
}
.signin-user-popup-btn {
  width: 100%;
  padding: 12px;
  background-color: #f4f4f4;
  text-align: center;
  font-size: 13px;
  color: #666;
  line-height: 1;
  cursor: pointer;
}
.signin-user-popup-btn:hover {
  background-color: #59f;
  color: white;
}
/***********************************/
/********** common dialog **********/
/***********************************/
.grm-modal-dialog-bg {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 500;
  background-color: rgba(0, 0, 0, 0.4);
  box-sizing: border-box;
}
.grm-modal-dialog-bg.show {
  display: block;
}
.grm-modal-dialog-content {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  justify-content: center;
  align-items: center;
  z-index: 501;
}
.grm-modal-dialog-content.highlight {
  color: #09f;
}
.grm-modal-dialog-content.show {
  display: flex !important;
}
.grm-modal-dialog-content-wrapper {
  display: inline-block;
  position: relative;
  box-sizing: border-box;
  min-width: 340px;
  max-width: 360px;
  border-radius: 10px;
  background-color: white;
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.4);
}
.grm-modal-dialog-header {
  padding: 30px 30px 16px;
}
.grm-modal-dialog-icon-wrap {
  text-align: center;
}
.grm-modal-dialog-icon {
  display: inline-block;
  width: 72px;
  height: 72px;
  margin: 0;
  padding: 0;
  border-radius: 100%;
  background-color: rgba(255, 0, 85, 0.1);
  text-align: center;
  font-size: 50px;
  font-weight: 300;
  color: #f05;
  line-height: 56px;
  box-shadow: none;
}
.grm-modal-dialog-title {
  text-align: center;
  font-size: 20px;
}
.grm-modal-dialog-body-content {
  padding: 0 30px;
  text-align: center;
  font-size: 14px;
  color: #666;
  line-height: 1.6;
  word-break: keep-all;
}
.grm-modal-dialog-footer {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 24px 30px 30px;
}
.grm-btn {
  display: inline-block;
  min-width: 100px;
  height: 40px;
  margin-left: 10px;
  padding: 0 24px;
  background-color: #f1f2f3;
  border-radius: 6px;
  text-align: center;
  font-size: 15px;
  color: #666;
  cursor: pointer;
}
.grm-btn.ok,
.grm-btn.confirm {
  background-color: #59f;
  font-weight: 500;
  color: white;
}
.grm-btn.ok:hover,
.grm-btn.confirm:hover {
  background-color: #05f;
}
.grm-btn:hover {
  background-color: #ddd;
}
.grm-btn:first-child {
  margin: 0;
}
.cancel-reason-select {
  margin-top: 24px;
  text-align: left;
}
.cancel-reason-select > label {
  margin-top: 16px;
  font-size: 14px;
  font-weight: normal;
  color: #333;
}
.cancel-reason-select input[type="radio"] {
  margin-right: 8px;
  vertical-align: 1px;
}
.cancel-reason-select .input-text {
  min-width: 90%;
  max-width: 90%;
  min-height: 50px;
  margin: 10px 0 0 20px;
  padding: 12px;
  border-radius: 4px;
  background-color: #f8f8f8;
  border: 1px solid #eaeaea;
  font-size: 14px;
}
.cancel-reason-select .input-text::placeholder {
  font-size: 14px;
  color: #999;
}
.popupContainer {
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0;
  padding: 0;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
  pointer-events: auto;
  z-index: 999;
  /***********************************/
  /***********************************/
  /**** animate S ****/
  /**** animate E ****/
}
.popupContainer.interview {
  top: 50px;
}
.popupContainer.show {
  display: flex;
}
.popupContainer[data-show] {
  display: none;
}
.popupContainer[data-show="true"] {
  display: flex;
}
.popupContainer[data-show="false"] {
  display: none;
}
.popupContainer.bg-light {
  background-color: rgba(0, 0, 0, 0.3);
}
.popupContainer.bg-no {
  background: none;
}
.popupContainer.bottom-con {
  align-items: flex-end;
  padding: 12px;
  line-height: 0;
}
.popupContainer.browser-alert-container {
  align-items: flex-end;
  animation: bg-chg 500ms forwards ease-out;
}
.popupContainer.browser-alert-container[data-show="true"] {
  display: flex;
}
.popupContainer.guide {
  display: none;
  flex-direction: column;
}
.popupContainer.guide[data-show="true"] {
  display: flex;
}
.popupContainer .popupDialog {
  position: relative;
  width: 440px;
  border-radius: 6px;
  background-color: white;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}
.popupContainer .popupDialog.loading-layer {
  width: 100px;
  height: 100px;
  background: url("../../../images/loading/loading_gooroomee_white.gif") center no-repeat;
  background-size: 100% auto;
  box-shadow: none;
}
.popupContainer .popupDialog.bottom-dialog {
  border-radius: 12px;
  padding: 40px 30px 48px;
}
.popupContainer .popupDialog.browser-alert-dialog {
  width: 760px;
  animation: layer-down-up 800ms forwards ease-out;
}
.popupContainer .popupDialog.alert {
  background: linear-gradient(120deg, #83f, #f83);
}
.popupContainer .popupDialog.guide-dialog {
  width: 814px;
  border-radius: 12px;
  overflow: unset;
  margin-bottom: 20px;
}
.popupContainer .popup-dialog-header {
  position: relative;
  padding: 30px 30px 18px;
}
.popupContainer .popup-clsBtn-wrapper {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 999;
}
.popupContainer .popup-clsBtn-wrapper .popup-clsBtn {
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 100%;
  background: url('../../../images/icon/ico_x.svg') center no-repeat;
  background-size: auto 50%;
  border: none;
  opacity: 0.5;
  cursor: pointer;
  transition: 120ms ease-out;
  position: relative;
}
.popupContainer .popup-clsBtn-wrapper .popup-clsBtn:hover {
  background: #f05 url('../../../images/icon/ico_x_white.svg') center no-repeat;
  background-size: auto 36%;
  opacity: 1;
  transform: rotate(90deg);
}
.popupContainer .popup-clsBtn-wrapper .guide-popup-clsBtn {
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 100%;
  background: url('../../../images/icon/ico_x.svg') center no-repeat;
  background-size: auto 50%;
  border: none;
  opacity: 0.5;
  cursor: pointer;
  transition: 120ms ease-out;
  position: relative;
}
.popupContainer .popup-dialog-body {
  padding: 0 30px;
  text-align: center;
}
.popupContainer .popup-dialog-footer {
  display: flex;
  flex-direction: column;
  padding: 20px 30px 30px;
}
.popupContainer .popup-dialog-footer .popup-footer-btn {
  flex: 1;
  margin: 4px 4px;
  padding: 18px;
  border-radius: 4px;
  font-size: 15px;
  text-align: center;
  transition: 200ms ease-out;
}
.popupContainer .popup-dialog-footer .popup-footer-btn.ok {
  background-color: #59f;
  font-weight: 500;
  color: white;
}
.popupContainer .popup-dialog-footer .popup-footer-btn.ok:hover {
  background-color: #36f;
}
.popupContainer .popup-dialog-footer .popup-footer-btn.cancel {
  background-color: #eee;
  color: #666;
}
.popupContainer .popup-dialog-footer .popup-footer-btn.cancel:hover {
  background-color: white;
}
.popupContainer .popup-dialog-footer .popup-footer-btn.delete {
  background-color: #eee;
  color: #666;
}
.popupContainer .popup-dialog-footer .popup-footer-btn.delete:hover {
  background-color: white;
}
.popupContainer .popup-dialog-footer .popup-footer-btn:hover {
  box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.1);
}
.popupContainer .popup-img-reg-wrap {
  text-align: center;
}
.popupContainer .popup-img-reg-wrap .profile-img-url {
  width: 240px;
  height: 240px;
  border-radius: 100%;
}
.popupContainer .browser-alert-dialog {
  text-align: center;
}
.popupContainer .browser-alert-dialog h4 {
  margin: 0;
  font-size: 30px;
  font-weight: 600;
  line-height: 1.6;
  letter-spacing: -0.4px;
}
.popupContainer .browser-alert-dialog > section {
  margin-top: 12px;
}
.popupContainer .browser-alert-dialog .browser-alert-tx {
  font-size: 16px;
  font-weight: 300;
  color: #666;
  line-height: 1;
}
.popupContainer .browser-alert-dialog > footer {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}
.popupContainer .browser-alert-dialog .browser-down-btn {
  width: 240px;
  height: 50px;
  padding-left: 20px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
  color: white;
  line-height: 50px;
  transition: 200ms ease-out;
}
.popupContainer .browser-alert-dialog .browser-down-btn.chrome {
  background: #3674e0 url('../../../images/logo/logo_chrome.png') 18px center no-repeat;
  background-size: auto 44%;
}
.popupContainer .browser-alert-dialog .browser-down-btn.whale {
  margin-left: 20px;
  background: #000f3b url('../../../images/logo/logo_whale.png') 18px center no-repeat;
  background-size: auto 44%;
}
.popupContainer .browser-alert-dialog .browser-down-btn:hover {
  text-decoration: none;
  box-shadow: 4px 8px 20px rgba(0, 0, 0, 0.3);
  opacity: 0.9;
}
.popupContainer .popupDialog-header.edu-info {
  background: url('../../../images/mypage/edu_dialog_info_top.jpg') center no-repeat;
  background-size: 100% auto;
}
.popupContainer .popupDialog-header.edu-info > h4 {
  padding: 60px 20px;
  text-align: center;
  font-size: 22px;
  color: white;
}
.popupContainer .popupDialog-header.guide-header {
  width: 100%;
}
.popupContainer .popupDialog-header.guide-header > h4 {
  padding: 56px 20px 16px 20px;
  text-align: center;
  font-size: 28px;
  font-weight: 700;
}
.popupContainer .popupDialog-header.guide-header > ul {
  width: 491px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.popupContainer .popupDialog-header.guide-header > ul > li {
  width: fit-content;
  text-align: center;
  color: #6A6A6A;
  font-size: 14px;
  line-height: 23px;
}
.popupContainer .popupDialog-body {
  margin-top: 24px;
  padding: 0 30px;
}
.popupContainer .popupDialog-body .dialog-body-tx > p {
  font-size: 14px;
  color: #666;
  line-height: 1.8;
  word-break: keep-all;
}
.popupContainer .popupDialog-body .dialog-body-tx > p.color-black {
  color: black;
}
.popupContainer .popupDialog-body .dialog-body-tx > p.size-b {
  font-size: 15px;
}
.popupContainer .popupDialog-body .dialog-body-tx > p.strong {
  font-weight: 500;
}
.popupContainer .popupDialog-body .dialog-body-tx > p.bullet {
  padding-left: 14px;
  background: url('../../../images/icon/ico_circle_gray.svg') 2px 11px no-repeat;
  background-size: auto 4px;
}
.popupContainer .popupDialog-body .dialog-body-tx > p.final {
  margin-top: 10px;
}
.popupContainer .popupDialog-body.guide-process-container {
  margin-top: 52px;
}
.popupContainer .popupDialog-body.guide-process-container > p {
  text-align: center;
  font-weight: bold;
  font-size: 16px;
}
.popupContainer .popupDialog-body.guide-process-container > p > em {
  color: #0060F0;
}
.popupContainer .popupDialog-body.guide-process-container > p.guide-process-title.pc {
  display: block;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process {
  min-width: 734px;
  height: 200px;
  margin: 25px auto;
  background: #F0F6FF;
  border: 1px solid rgba(189, 215, 255, 0.2);
  box-sizing: border-box;
  border-radius: 12px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process p {
  font-size: 12px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process p.guide-process-title.mobile {
  display: none;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart {
  padding: 28px 64px 20px;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  gap: 36px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  gap: 36px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li {
  width: 120px;
  height: 120px;
  background: #FFFFFF;
  border-radius: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  justify-content: center;
  position: relative;
  text-align: center;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li .num {
  opacity: 0.5;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li .text {
  margin-top: 6px;
  font-weight: bold;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li::after {
  content: '';
  display: block;
  width: 7px;
  height: 14px;
  position: absolute;
  right: -22px;
  background: url(../../../images/icon/ico_arrowLineRight_light_blue.svg) 100% center no-repeat;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li.final {
  background: #5599FF;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li.final .num {
  color: #FFFFFF;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li.final .text {
  color: #FFFFFF;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li.final::after {
  display: none;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-desc {
  color: #247BFF;
  text-align: center;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room {
  height: 164px;
  width: 698px;
  border-radius: 16px 0 16px 0;
  background: linear-gradient(87.75deg, #50374F 0%, #7D5758 100%);
  margin: 35px 0 0 35px;
  display: flex;
  padding: 24px 25px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 27px;
  text-align: left;
  color: #FFFFFF;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content {
  width: 490px;
  margin-left: 45px;
  display: flex;
  flex-direction: column;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-desc {
  font-size: 13px;
  line-height: 18px;
  text-align: left;
  opacity: 0.6;
  color: #FFFFFF;
  margin-bottom: 24px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-select {
  display: flex;
  justify-content: space-between;
  position: relative;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-select > p {
  font-size: 14px;
  font-style: normal;
  line-height: 19px;
  text-align: left;
  color: #FFFFFF;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-select .desc-wrapper {
  background: rgba(255, 255, 255, 0.7);
  position: absolute;
  top: 4px;
  right: 116px;
  padding: 6px;
  border-radius: 0 4px 4px 4px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-select .desc-wrapper .desc {
  color: #714F56;
  font-size: 10px;
  font-weight: 700;
  line-height: 14px;
  text-align: center;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-select .desc-wrapper::after {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: 230px;
  width: 0;
  height: 0;
  border-top: 10px solid rgba(255, 255, 255, 0.7);
  border-left: 10px solid transparent;
  border-right: 0px solid transparent;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-select .toggle-button {
  width: 36px;
  height: 18px;
  background: url(../../../images/icon/icon_toggle_button.svg) 100% center no-repeat;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .line {
  display: block;
  width: 100%;
  height: 1px;
  background: #FFFFFF;
  opacity: 0.1;
  margin: 17px 0 11px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list {
  height: 164px;
  width: 662px;
  border-radius: 16px 16px 0 0;
  background: #FFFFFF;
  margin: 35px 0 0 35px;
  padding: 24px 25px;
  overflow: hidden;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-waiting-list-title {
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 27px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content {
  width: 100%;
  margin-top: 17px;
  display: flex;
  flex-direction: column;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header {
  display: flex;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item {
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
  line-height: 15px;
  text-align: left;
  color: #666666;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.number {
  width: 10%;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.user-name {
  width: 18%;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.device-cam {
  width: 18%;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.device-mic {
  width: 18%;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.user-role {
  width: 22%;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.request-enter {
  width: 14%;
  padding-left: 10px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .line {
  display: block;
  width: 100%;
  height: 1px;
  background: #E4E4E4;
  margin: 14px 0 7px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .line:nth-of-type(2) {
  opacity: 0.5;
  margin: 7px 0;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body {
  display: flex;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body:nth-of-type(3) {
  opacity: 0.3;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item {
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
  line-height: 15px;
  text-align: left;
  color: #333333;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.number {
  width: 10%;
  margin-top: 7px;
  padding-left: 7px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.user-name {
  width: 18%;
  margin-top: 7px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.device-cam {
  width: 18%;
  margin-top: 7px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.device-mic {
  width: 18%;
  margin-top: 7px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.user-role {
  width: 22%;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.user-role > select {
  appearance: none;
  width: 70%;
  height: 30px;
  padding: 0 8px;
  border-radius: 4px;
  background: #f1f1f1 url("../../../images/icon/ico_arrowTriangleDown.svg") right 10px center / auto 12% no-repeat;
  border: none;
  font-size: 13px;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.request-enter {
  width: 14%;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.request-enter > button {
  width: 56px;
  height: 29px;
  background: #FFFFFF;
  border: 0.761752px solid #F1F1F1;
  box-sizing: border-box;
  box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-left: 10px;
  position: relative;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.request-enter > button::before {
  content: '';
  display: block;
  position: absolute;
  bottom: -12px;
  right: -12px;
  width: 24px;
  height: 24px;
  border-radius: 100%;
  background: #FF756C;
  opacity: 0.3;
}
.popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.request-enter > button::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -6px;
  right: -6px;
  width: 12px;
  height: 12px;
  border-radius: 100%;
  background: #FF756C;
}
.popupContainer .popupDialog-footer {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0 32px;
}
.popupContainer .popupDialog-footer .popupFooterBtn {
  display: inline-block;
  min-width: 100px;
  margin-left: 8px;
  padding: 12px 18px;
  border-radius: 4px;
  text-align: center;
  font-size: 15px;
  z-index: 1;
}
.popupContainer .popupDialog-footer .popupFooterBtn:first-child {
  margin: 0;
}
.popupContainer .popupDialog-footer .popupFooterBtn:hover {
  text-decoration: none;
  box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.2);
}
.popupContainer .popupDialog-footer .cancel {
  background-color: #eaeeef;
  color: #666;
}
.popupContainer .popupDialog-footer .cancel:hover {
  background-color: #d6dee1;
}
.popupContainer .popupDialog-footer .ok {
  background-color: #59f;
  font-weight: 500;
  color: white;
}
.popupContainer .popupDialog-footer .ok:hover {
  background-color: #36f;
}
.popupContainer .popupDialog-footer .disabled {
  background-color: white;
  font-size: 14px;
  font-weight: normal;
  color: #aaa;
  user-select: none;
  pointer-events: none;
}
.popupContainer .popupDialog-footer.guide-footer {
  justify-content: space-between;
  margin: 0 40px 32px;
}
.popupContainer .popupDialog-footer.guide-footer > button {
  font-size: 14px;
  color: #247BFF;
}
.popupContainer .popupDialog-footer.guide-footer > button.disabled {
  color: #CCCCCC;
}
.popupContainer .popupDialog-footer.guide-footer .progress-container {
  display: flex;
  width: 30px;
  justify-content: space-between;
}
.popupContainer .popupDialog-footer.guide-footer .progress-container .progress-dot {
  width: 6px;
  height: 6px;
  background: #E4E4E4;
  border-radius: 100%;
}
.popupContainer .popupDialog-footer.guide-footer .progress-container .progress-dot.selected {
  background: #247BFF;
}
.popupContainer .close-btn-container.mobile {
  display: none;
}
.popupContainer .check-btn-container {
  display: block;
}
.popupContainer .check-btn-container .check-btn {
  display: none;
}
.popupContainer .check-btn-container .check-btn:checked + .check-label::before {
  border: 1px solid #59f;
  background: #59f url('../../../images/icon/ico_check_white.svg') no-repeat center / 8px auto;
}
.popupContainer .check-btn-container .check-label {
  font-weight: 400;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.popupContainer .check-btn-container .check-label::before {
  content: '';
  width: 15px;
  height: 15px;
  margin-right: 6px;
  border: 1px solid #fff;
  border-radius: 100%;
  background: url('../../../images/icon/ico_check_white.svg') no-repeat center / 8px auto;
  display: block;
}
.popupContainer .check-btn-container .check-label.white {
  color: #fff;
}
.popupContainer .popup-clsBtn-wrapper {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 999;
}
.popupContainer .popup-clsBtn-wrapper .popup-clsBtn {
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 100%;
  background: url('../../../images/icon/ico_x.svg') center no-repeat;
  background-size: auto 50%;
  border: none;
  opacity: 0.5;
  cursor: pointer;
  transition: 120ms ease-out;
}
.popupContainer .popup-clsBtn-wrapper .popup-clsBtn:hover {
  background: #f05 url('../../../images/icon/ico_x_white.svg') center no-repeat;
  background-size: auto 36%;
  opacity: 1;
  transform: rotate(90deg);
}
.popupContainer .popup-clsBtn-wrapper .popup-clsBtn.color-white {
  background: url('../../../images/icon/ico_x_white.svg') center no-repeat;
  background-size: auto 50%;
}
.popupContainer.change-profile-img-popup-layer {
  z-index: 100;
}
@keyframes slide-up {
  0% {
    opacity: 0;
    transform: translateY(100%);
  }
  99% {
    opacity: 1;
    transform: translateY(0%);
  }
}
@keyframes slide-down {
  0% {
    opacity: 0;
    transform: translateY(-100%);
  }
  99% {
    opacity: 1;
    transform: translateY(0%);
  }
}
@keyframes slide-left {
  0% {
    opacity: 0;
    transform: translateX(100%);
  }
  99% {
    opacity: 1;
    transform: translateX(0%);
  }
}
@keyframes slide-left-out {
  0% {
    opacity: 1;
    transform: translateX(0%);
  }
  99% {
    opacity: 0;
    transform: translateX(-100%);
  }
  100% {
    display: none;
    opacity: 0;
    transform: translateX(-100%);
  }
}
@keyframes slide-right {
  0% {
    display: none;
    opacity: 0;
    transform: translateX(-100%);
  }
  99% {
    opacity: 1;
    transform: translateX(0%);
  }
}
@keyframes flicker-opacity {
  from {
    opacity: 1;
  }
  to {
    opacity: 0.3;
  }
}
@keyframes opacity-chg-loof {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes bg-chg {
  from {
    background-color: rgba(0, 0, 0, 0);
  }
  to {
    background-color: rgba(0, 0, 0, 0.3);
  }
}
@keyframes layer-down-up {
  from {
    bottom: -320px;
  }
  to {
    bottom: 20px;
  }
}
@media (max-width: 543px) {
  .popupContainer .grm-dialog-msg-layer {
    max-width: 90vw;
  }
  .popupContainer .grm-dialog-msg-layer.interview {
    max-width: 100%;
  }
}
/****************** Mobile ******************/
@media (max-width: 768px) {
  .popupContainer .popupDialog.guide-dialog {
    height: 100%;
    margin-bottom: 0;
    width: 100%;
    border-radius: 0;
  }
  .popupContainer .popupDialog-header.guide-header > h4 {
    margin: 0 24px;
    padding: 60px 0 16px;
    font-size: 20px;
    line-height: 30px;
    overflow: hidden;
    word-break: keep-all;
  }
  .popupContainer .popupDialog-header.guide-header > ul {
    width: 100%;
  }
  .popupContainer .popupDialog-header.guide-header > ul > li {
    font-size: 13px;
    line-height: 20px;
    padding: 0 24px;
    overflow: hidden;
    word-break: keep-all;
    letter-spacing: 0.03rem;
  }
  .popupContainer .guide-slide-contents {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: calc(100% - 166px - 74px);
  }
  .popupContainer .popupDialog-body {
    padding: 0 24px;
  }
  .popupContainer .popupDialog-body.guide-process-container {
    margin-top: 0;
  }
  .popupContainer .popupDialog-body.guide-process-container > p.guide-process-title.pc {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process {
    min-width: 100%;
    height: 320px;
    margin: 0;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process p {
    font-size: 12px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process p.guide-process-title.mobile {
    display: block;
    text-align: center;
    font-size: 14px;
    line-height: 24px;
    padding-top: 25px;
    min-width: 230px;
    max-width: 230px;
    overflow: hidden;
    word-break: keep-all;
    margin: 0 auto;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process p.guide-process-title.mobile > em {
    color: #0060F0;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process.create-room .guide-process-title.mobile {
    padding-top: 36px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process.waiting-list .guide-process-title.mobile {
    padding-top: 36px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart {
    padding: 17px 64px 25px;
    display: flex;
    flex-direction: column;
    gap: 19px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
    gap: 25px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li {
    width: 105px;
    height: 105px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li::after {
    right: -18px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li:nth-of-type(2) {
    display: flex;
    justify-content: center;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul > li:nth-of-type(2)::after {
    right: initial;
    bottom: -18px;
    transform: rotate(90deg);
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul:nth-of-type(2) {
    flex-direction: row-reverse;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul:nth-of-type(2) > li::after {
    right: 115px;
    transform: scaleX(-1);
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-flowchart > ul:nth-of-type(2) > li.final::after {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-desc {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room {
    height: 200px;
    width: 264px;
    background: linear-gradient(60.15deg, #50374F 0%, #7D5758 100%);
    border-radius: 23px 23px 0 0;
    margin: 35px auto;
    display: flex;
    padding: 36px 16px;
    flex-direction: column;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-title {
    font-size: 14px;
    line-height: 19px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content {
    width: 100%;
    margin-left: 0;
    margin-top: 26px;
    display: flex;
    flex-direction: column;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-desc {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-select > p {
    font-size: 13px;
    line-height: 17px;
    max-width: 180px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-select .desc-wrapper {
    width: 240px;
    position: absolute;
    top: 44px;
    right: -5px;
    border-radius: 4px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-create-room .guide-process-create-room-content .guide-process-create-room-select .desc-wrapper::after {
    content: '';
    display: block;
    position: absolute;
    top: -16px;
    right: 215px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-left: 8px solid transparent;
    border-right: 0 solid transparent;
    border-bottom: 8px solid rgba(255, 255, 255, 0.7);
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list {
    height: 200px;
    width: 264px;
    border-radius: 20px 20px 0 0;
    margin: 35px auto;
    padding: 30px 16px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-waiting-list-title {
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 27px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content {
    width: 100%;
    margin-top: 26px;
    display: flex;
    flex-direction: column;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header {
    display: flex;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item {
    font-size: 12px;
    line-height: 16px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.number {
    width: 25%;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.user-name {
    width: 30%;
    padding-left: 7px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.device-cam {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.device-mic {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.user-role {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-header .header-item.request-enter {
    width: 45%;
    padding-left: 26px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .line {
    display: block;
    width: 100%;
    height: 1px;
    background: #E4E4E4;
    margin: 16px 0 10px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .line:nth-of-type(2) {
    opacity: 0.5;
    margin: 14px 0 10px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body {
    display: flex;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body:nth-of-type(3) {
    opacity: 0.3;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item {
    font-size: 13px;
    line-height: 16px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.number {
    width: 25%;
    margin-top: 7px;
    padding-left: 7px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.user-name {
    width: 30%;
    margin-top: 7px;
    padding-left: 3px;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.device-cam {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.device-mic {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.user-role {
    display: none;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.request-enter {
    width: 45%;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.request-enter > button {
    width: 80px;
    height: 33px;
    background: #FFFFFF;
    border: 0.761752px solid #F1F1F1;
    box-sizing: border-box;
    box-shadow: 4px 4px 12px rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    margin-left: 10px;
    position: relative;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.request-enter > button::before {
    content: '';
    display: block;
    position: absolute;
    bottom: -12px;
    right: -12px;
    width: 24px;
    height: 24px;
    border-radius: 100%;
    background: #FF756C;
    opacity: 0.3;
  }
  .popupContainer .popupDialog-body.guide-process-container > .guide-process .guide-process-waiting-list .guide-process-create-room-content .user-list-body .list-body-item.request-enter > button::after {
    content: '';
    display: block;
    position: absolute;
    bottom: -6px;
    right: -6px;
    width: 12px;
    height: 12px;
    border-radius: 100%;
    background: #FF756C;
  }
  .popupContainer .popupDialog-footer {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .popupContainer .popupDialog-footer.guide-footer {
    justify-content: space-between;
    margin: 0;
    width: 100%;
    padding: 0 24px;
    position: absolute;
    bottom: 60px;
  }
  .popupContainer .close-btn-container.mobile {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 52px;
    display: flex;
    justify-content: center;
    background: #F4F4F4;
  }
  .popupContainer .close-btn-container.mobile > button {
    min-width: 50%;
    font-weight: 400;
    font-size: 14px;
    line-height: 19px;
  }
  .popupContainer .close-btn-container.mobile > button:nth-of-type(1) {
    border-right: 1px solid #E4E4E4;
  }
  .popupContainer .check-btn-container {
    display: none;
  }
  .popup-clsBtn-wrapper {
    display: none;
  }
}