/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[11].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[11].use[3]!./node_modules/next/dist/build/webpack/loaders/resolve-url-loader/index.js??ruleSet[1].rules[14].oneOf[11].use[4]!./node_modules/next/dist/compiled/sass-loader/cjs.js??ruleSet[1].rules[14].oneOf[11].use[5]!./src/components/common/common.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
:root {
  --primary: #f0002e;
}

h1,
h2,
h3,
h4,
h5 {
  margin: 0;
}

.MuiPickersLayout-root {
  background: #121212;
  box-shadow: 5px 5px 10px #000;
}

button {
  background: transparent;
  border: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

.sr-only {
  display: none;
}

.popup-img-wrapper-list iframe,
.popup-img-wrapper-daycalandar iframe,
.popup-img-wrapper-save iframe {
  width: 140px !important;
  height: 175px !important;
  border: none;
  object-fit: cover;
}

.moreview {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
}
.moreview a {
  display: block;
  font-size: 14px;
  color: #fff;
  white-space: pre;
}
.moreview a:hover {
  color: #fff;
  font-weight: 700;
}

.popup-img {
  width: 140px;
  height: 140px;
  object-fit: cover;
}

.popup-name {
  font-size: 16px;
  font-weight: 700;
}
.popup-name p {
  word-break: break-all;
}

.popup-location {
  font-size: 12px;
  opacity: 0.6;
  font-weight: 600;
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 3px;
}
.popup-location img {
  display: block;
  width: 10px;
}

.popup-date {
  font-size: 14px;
  font-weight: 700;
  text-align: right;
  padding-top: 20px;
}

.key-text {
  color: #f0002e;
}

.popupbanner-wrap {
  width: 100%;
  max-width: 960px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.popupbanner-wrap header {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: space-between;
  padding: 0 20px;
  box-sizing: border-box;
}
.popupbanner-wrap header .moreview {
  padding: 0;
}
.bookmark-wrap {
  position: relative;
  display: block;
  height: -moz-fit-content;
  height: fit-content;
  padding: 4px;
  z-index: 10;
}

.bg {
  display: none;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: #121212;
  opacity: 0.5;
  z-index: 99;
}

.submenu {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  margin: 15px 0 20px;
  padding-bottom: 8px;
}
.submenu.back > a {
  position: relative;
  cursor: default;
}
.submenu.back > a .arrow {
  width: 16px;
  height: 16px;
  position: absolute;
  left: 6px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  padding: 10px;
}
.submenu > a {
  display: block;
  width: 30%;
  text-align: center;
  border-bottom: 1px solid #2c2c2c;
  padding: 10px 0;
  flex: 1 1 auto;
}
.submenu > a.on {
  color: #f0002e;
  border-bottom: 2px solid #f0002e;
  font-weight: 900;
}
.submenu > a h2 {
  font-size: 16px;
  margin: 0;
  font-weight: 600;
}

.search-area {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin: 50px 10px 30px;
}
.search-area input[type=search] {
  width: 95%;
  height: 48px;
  border: 1px solid #fff;
  background: url("/assets/img/layout/search-bg.svg") 96% center no-repeat;
  border-radius: 10em;
  padding: 0 20px;
  font-size: 15px;
  color: #fff;
}
.search-area input[type=search]:focus {
  outline: none;
}
.search-area input[type=search].line {
  border: none;
  border-bottom: 1px solid #f0002e;
  border-radius: 0;
  background: url("/assets/img/layout/search-red.svg") 95% center no-repeat;
}

.page-area {
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 50px 0;
}
.page-area ul {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  column-gap: 10px;
}
.page-area ul li {
  width: 10%;
}
.page-area ul li a {
  display: block;
  width: 100%;
  color: #999;
}
.page-area ul li a.on {
  font-weight: 700;
  color: #fff;
}

.prev-btn {
  position: relative;
}
.prev-btn::after {
  content: "<";
  color: #fff;
  display: block;
}

.next-btn {
  position: relative;
}
.next-btn::after {
  content: ">";
  display: block;
  color: #fff;
}

.go-back {
  padding-left: 20px;
  font-size: 14px;
}

.likebutton-wrap {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  padding: 0 20px;
  column-gap: 10px;
}

.likebutton {
  display: block;
  height: 32px;
  line-height: 32px;
  font-size: 13px;
  color: #fff;
  padding: 0 12px;
  border: 1px solid #fff;
  border-radius: 5px;
  background: none;
  transition: all 0.2s;
  box-sizing: border-box;
}
.likebutton:hover {
  background: #fff;
  color: #767676;
}

button.pagination:disabled {
  background: transparent !important;
}

.full-btn {
  width: 100%;
  height: 48px;
  padding: 0 20px;
  border: 1px solid #767676;
  background: #121212;
  color: #fff;
  font-size: 15px;
  text-align: center;
}
.full-btn-red {
  border-color: transparent;
  background: #f0002e;
}
.full-btn.more-list {
  border-radius: 4px;
  width: 90%;
  margin: 20px auto;
}
.full-btn.more-list:hover {
  background: #f0002e;
  border: 1px solid #f0002e;
}

a.full-btn {
  display: block;
  line-height: 48px;
  box-sizing: border-box;
}

.page-info-area {
  width: 100%;
  height: 50vh;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
}
.page-info-area-explore {
  position: initial;
  top: initial;
  transform: none;
  padding: 20px 20px 40px;
}
.page-info-area-inner {
  text-align: center;
  word-break: keep-all;
  font-size: 14px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.page-info-area-inner img {
  display: block;
  margin: 0 auto;
  margin-bottom: 15px;
}
.page-info-area-inner h5 {
  font-size: 14px;
  margin: 0;
  margin-bottom: 15px;
}
.page-info-area-inner p {
  color: #999;
  line-height: 24px;
}
.page-info-area-inner a {
  border-radius: 4px;
  margin-top: 15px;
}

.gradiant::after {
  content: " ";
  width: 100vw;
  height: 100vh;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  background: url("/assets/img/gradiant_mo.png") center center no-repeat;
  background-size: cover;
  z-index: -1;
}

.popup-img-wrap {
  grid-row-start: 1;
  grid-row-end: 4;
}

.popup-img {
  width: 140px;
  height: 140px;
  object-fit: cover;
}

.calendar-wrap {
  width: 90%;
  font-size: 14px;
  padding: 20px 10px 40px;
  background: #212121;
  border-radius: 20px;
  position: absolute;
  left: 16px;
  top: 55px;
  box-shadow: 0 0 15px #000;
}
.calendar-wrap .calendar-header {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.calendar-wrap .calendar-header button {
  background: none;
  border: none;
}
.calendar-wrap .calendar-header button img {
  width: 18px;
}
.calendar-wrap .calendar-header .today-btn {
  color: #f0002e;
  font-size: 12px;
}
.calendar-wrap .react-calendar {
  padding: 5px;
  background: #121212;
  border-radius: 13px;
}
.calendar-wrap .react-calendar .react-calendar__navigation {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px;
}
.calendar-wrap .react-calendar .react-calendar__navigation .react-calendar__navigation__arrow {
  font-size: 24px;
  line-height: 0;
  font-weight: 200;
}
.calendar-wrap .react-calendar .react-calendar__navigation button {
  background: none;
  border: none;
  color: #fff;
}
.calendar-wrap .react-calendar .react-calendar__month-view__weekdays__weekday {
  text-align: center;
  padding-bottom: 4px;
}
.calendar-wrap .react-calendar .react-calendar__month-view__weekdays__weekday abbr {
  text-decoration: none;
  font-size: 12px;
  color: #999;
}
.calendar-wrap .react-calendar .react-calendar__month-view__weekdays__weekday abbr[title=토요일],
.calendar-wrap .react-calendar .react-calendar__month-view__weekdays__weekday abbr[title=일요일] {
  color: #f0002e;
}
.calendar-wrap .react-calendar .react-calendar__tile {
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 600;
  position: relative;
  z-index: 1;
}
.calendar-wrap .react-calendar .react-calendar__tile.disabled {
  opacity: 0.5;
  font-weight: 200;
}
.calendar-wrap .react-calendar .react-calendar__tile:disabled {
  opacity: 0.3;
  font-weight: 200;
  color: #999;
}
.calendar-wrap .react-calendar .react-calendar__tile.react-calendar__tile--active::after,
.calendar-wrap .react-calendar .react-calendar__tile :hover::after,
.calendar-wrap .react-calendar .react-calendar__tile :focus::after {
  content: "";
  display: block;
  width: 40px;
  height: 40px;
  background: #f0002e;
  border-radius: 50%;
  opacity: 0.2;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}
.calendar-wrap .react-calendar button.react-calendar__tile.react-calendar__month-view__days__day.react-calendar__month-view__days__day--weekend {
  color: #f0002e;
}
.calendar-wrap .react-calendar button.react-calendar__tile.react-calendar__month-view__days__day.react-calendar__month-view__days__day--weekend abbr {
  color: #f0002e;
}

nav {
  width: 100%;
  max-width: 960px;
  height: auto;
  background: transparent;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 10px 20px;
  align-items: center;
  box-sizing: border-box;
  z-index: 101;
  margin: 0 auto;
  position: fixed;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  gap: 8px;
}
nav a {
  display: flex;
  align-items: center;
  position: relative;
  width: 89px;
}
nav img {
  width: 100%;
}
nav svg {
  width: 89px;
  height: auto;
  shape-rendering: geometricPrecision;
}
nav div.header-search {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  column-gap: 16px;
  flex: 1 1;
}
nav div.header-search .header-search-container {
  width: 100%;
  justify-content: flex-end;
  padding: 8px 12px;
  border: 1px solid #767676;
  background: #2c2c2c;
  border-radius: 10em;
  display: flex;
  align-items: center;
  cursor: pointer;
}
nav div.header-search .header-search-query {
  width: calc(100% - 22px);
}
nav div.header-search .header-search-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  background: url("/assets/img/layout/search.svg") center center no-repeat;
  background-size: 16px;
  border-radius: 10em;
}
nav .header-icon-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}
nav .header-icon-wrap .mypage-btn img {
  width: 28px;
  height: 28px;
  aspect-ratio: 1/1;
}
nav .header-icon-wrap .hamburger-menu-btn img {
  width: 22px;
  height: 22px;
  aspect-ratio: 1/1;
}

nav.div-menu-bar.sticky {
  -webkit-backdrop-filter: blur(5px);
          backdrop-filter: blur(5px);
}

.search-box {
  width: 100%;
  max-width: 960px;
  height: 0;
  background: #121212;
  padding: 0 20px;
  position: fixed;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  z-index: 101;
  overflow: hidden;
  transition: all 0.3s;
}
.search-box-cont.search-box {
  height: auto;
  position: initial;
  transform: initial;
}
.search-box-cont.search-box header {
  border-bottom: 0;
  justify-content: center;
  padding-bottom: 5px;
}
.search-box-cont.search-box header p {
  width: 100%;
}
.search-box header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 20px;
  border-bottom: 1px solid #2c2c2c;
}
.search-box header img {
  cursor: pointer;
}
.search-box header p {
  width: 90%;
  position: relative;
}
.search-box header p input[type=search] {
  width: 100%;
  background: none;
  border: 1px solid #fff;
  border-radius: 32px;
  color: #fff;
  font-family: "Pretendard Variable";
}
.search-box header p input[type=search]:focus {
  outline: none;
}
.search-box header p input[type=search]::placeholder {
  font-size: 14px;
  letter-spacing: -1px;
}
.search-box header p a {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  height: auto;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}
.search-box-inner {
  width: 100%;
  height: auto;
  padding-top: 20px;
}
.search-box-inner > p {
  font-size: 14px;
  font-weight: 700;
  color: #999;
  margin-bottom: 10px;
}
.search-box-inner ul {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 10px;
  column-gap: 10px;
  padding-bottom: 20px;
}
.search-box-inner ul li {
  padding: 4px 14px;
  border: 1px solid #2c2c2c;
  border-radius: 20px;
  font-size: 14px;
  font-weight: 200;
  cursor: pointer;
  background: none;
  text-align: center;
}
.search-box-inner ul li.key-hashtag {
  background: #f0002e;
  border: 1px solid #f0002e;
}
.search-box-inner a {
  margin-top: 10px;
  display: block;
  text-align: center;
  color: #999;
  text-decoration: underline;
  font-size: 14px;
}
.search-box-inner a:hover {
  font-weight: 600;
  color: #fff;
}
.search-box.down {
  height: auto;
  padding: 20px;
  border-bottom: 2px solid #f0002e;
}

.menu-box {
  width: 100%;
  max-width: 960px;
  height: 0;
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  padding: 0 20px;
  background: #121212;
  z-index: 101;
  transition: all 0.3s;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 64px;
  max-height: 93vh;
}
.menu-box .menu-box-logo {
  width: 89px;
}
.menu-box .menu-box-logo img {
  width: 100%;
}
.menu-box header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.menu-box .menu-box-top {
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.menu-box ul {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.menu-box ul .menu-box-top-title {
  font-size: 12px;
  color: #767676;
}
.menu-box ul li {
  font-size: 24px;
  font-weight: 700;
}
.menu-box ul li a {
  display: flex;
  align-items: baseline;
  column-gap: 6px;
}
.menu-box ul li span {
  font-weight: 400;
  font-size: 16px;
}
.menu-box ul li span.nickname {
  margin-left: 0;
  font-weight: 700;
}
.menu-box div.menu-box-bottom {
  padding: 10px 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.menu-box div.menu-box-bottom .profile {
  font-size: 16px;
  font-weight: 500;
  color: #d9d9d9;
  padding-left: 10px;
}
.menu-box div.menu-box-bottom .profile strong {
  font-weight: 700;
}
.menu-box div.menu-box-bottom .nickname-wrap {
  padding-left: 5px;
}
.menu-box div.menu-box-bottom-list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  font-size: 14px;
  gap: 16px;
  row-gap: 8px;
}
.menu-box div.menu-box-bottom-list a {
  font-size: 14px;
  font-weight: 200;
  display: flex;
  align-items: center;
  gap: 16px;
}
.menu-box div.menu-box-bottom-list a p {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 90px;
  justify-content: center;
  white-space: pre;
}
.menu-box div.menu-box-bottom-list a:after {
  width: 1px;
  height: 20px;
  background: #767676;
  content: "";
  display: block;
}
.menu-box div.menu-box-bottom-list a:last-child:after {
  display: none;
}
.menu-box div.menu-box-bottom-list img {
  width: 18px;
  height: 18px;
  object-fit: contain;
}
.menu-box.down {
  height: auto;
  padding: 20px 20px 20px 20px;
  border-bottom: 2px solid #f0002e;
  z-index: 9999;
}

.slick-slide {
  transition: transform 0.3s ease-in-out;
}

.slide-content {
  width: 100%;
  height: auto;
  position: relative;
  overflow: hidden;
}
.slide-content .slide-img-wrap {
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 600px;
  max-height: 600px;
  position: relative !important;
  left: 0;
  bottom: 0;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none; /* 드래그 시 블록 선택 방지 */
  -webkit-user-drag: none; /* 이미지 드래그 방지 (웹킷 브라우저) */
  -webkit-touch-callout: none; /* 모바일에서 이미지 드래그 방지 */
}
.slide-content .slide-img-wrap::after {
  background: url("/assets/img/common/filter.png") 0 0;
}
@media only screen and (max-width: 768px) {
  .slide-content .slide-img-wrap {
    height: 480px;
  }
}
.slide-content .slide-img-wrap .blur-background-top {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 0;
}
.slide-content .slide-img-wrap .blur-background-top img {
  top: 0;
  position: absolute;
  left: 50%;
  transform: translateX(-50%) translateY(25%) scale(1.5);
  object-fit: cover;
  filter: blur(20px);
}
.slide-content .slide-img-wrap .blur-background {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 0;
}
.slide-content .slide-img-wrap .blur-background img {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%) translateY(-25%) scale(1.5);
  object-fit: cover;
  filter: blur(20px);
}
.slide-content .slide-img-wrap .main-img-container {
  position: relative;
  z-index: 10;
  width: 100%;
  height: 100%;
  object-fit: contain;
  left: 0;
  bottom: 0;
}
.slide-content .slide-img-wrap .main-img-container img {
  position: initial !important;
  object-fit: cover;
}
.slide-content .slide-img-wrap .main-img-container-comment {
  position: relative;
  z-index: 10;
  width: 100%;
  height: 100%;
  object-fit: cover;
  left: 0;
  bottom: 0;
}
@media only screen and (max-width: 768px) {
  .slide-content .slide-img-wrap .main-img-container-comment {
    height: 240px;
  }
}
.slide-content .slide-img-wrap .main-img-container-comment img {
  position: initial !important;
}
.slide-content div {
  width: 100%;
  height: auto;
  position: absolute;
  left: 20px;
  bottom: 60px;
  z-index: 10;
}
.slide-content div p {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  column-gap: 5px;
  font-size: 14px;
  font-weight: 400;
  padding-bottom: 5px;
}
.slide-content div p img {
  display: block;
  width: 10px;
  height: auto;
}
.slide-content div p.slide-tit {
  width: 92%;
  font-size: 24px;
  font-weight: 700;
  word-break: keep-all;
}

.popup-banner-dots {
  width: 80%;
  position: absolute;
  left: 50%;
  bottom: 30px;
  transform: translateX(-50%);
  display: flex !important;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.popup-banner-dots li {
  width: 100%;
  height: 2px;
  background: #fff;
  opacity: 0.3;
}
.popup-banner-dots li button {
  opacity: 0;
}
.popup-banner-dots li.slick-active {
  opacity: 1;
}

.popupdetail-banner {
  overflow: hidden;
  height: 100%;
}
.popupdetail-banner .slide-img-wrap::after {
  background: url("/assets/img/common/popupdetailbanner-filter.png") 0 bottom;
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.popupdetail-banner-dots {
  width: 50%;
  position: absolute;
  left: 50%;
  bottom: 20px;
  transform: translateX(-50%);
  display: flex !important;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  column-gap: 5px;
}
.popupdetail-banner-dots li {
  width: 4px;
  height: 4px;
  background: #fff;
  opacity: 0.3;
  border-radius: 50%;
}
.popupdetail-banner-dots li button {
  opacity: 0;
}
.popupdetail-banner-dots li.slick-active {
  width: 10px;
  border-radius: 10px;
  background: #f0002e;
  opacity: 1;
}

.skeleton-container {
  display: flex;
  gap: 20px;
}

.article-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 64px;
  margin-top: 0;
  overflow: hidden;
}

.main-map-area {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.main-map-area .map-container {
  height: 100%;
}
.main-map-area .map-area {
  height: 500px;
}
.main-map-area .wheelLockButton {
  top: 25%;
}
.main-map-area .quick-search-slider {
  width: 100%;
}
.main-map-area .quick-search-slider .slick-list {
  width: 100%;
}
.main-map-area .quick-search-slider .slick-track {
  margin-left: 0;
  margin-right: auto;
  display: flex;
  align-items: center;
}
.main-map-area .quick-search-slider .slick-slide {
  width: auto !important;
}
.main-map-area .quick-search-slider .slick-slide > div {
  display: inline-block;
  margin-right: 8px;
}
.main-map-area .quick-search-chip {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  border-radius: 100px;
  padding: 6px 12px;
  font-size: 16px;
  cursor: pointer;
  background: transparent;
  color: #999;
  border: 1px solid #2c2c2c;
  transition: all 0.2s ease;
  white-space: nowrap;
}
.main-map-area .quick-search-chip:hover {
  border-color: #fff;
}
.main-map-area .quick-search-chip.active {
  background: #f0002e;
  border: none;
  color: #fff;
}
.main-map-area-title {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;
}
.main-map-area-title-tooltip {
  width: 28px;
  height: 28px;
  object-fit: contain;
}
.main-map-area-title-tooltip-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.main-map-area-title-tooltip-wrap:hover .main-map-area-title-tooltip-box {
  opacity: 1;
  visibility: visible;
}
.main-map-area-title-tooltip-box {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 260px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 400;
  white-space: normal;
  z-index: 10;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.main-map-area-title-tooltip-box::before {
  content: "";
  position: absolute;
  top: -6px;
  left: 50%;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #111;
}
.main-map-area-title-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.main-map-area .moreview {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  color: #fff !important;
}
@media (max-width: 768px) {
  .main-map-area {
    padding: 0 16px;
  }
}

.calendar-list {
  width: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.calendar-list header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.calendar-list ul {
  display: flex;
  flex-direction: row;
  column-gap: 2.5%;
  align-items: center;
  justify-content: flex-start;
  overflow-x: scroll;
}
.calendar-list ul::-webkit-scrollbar {
  display: none;
}
.calendar-list ul li div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #2c2c2c;
  cursor: pointer;
}
.calendar-list ul li div span {
  font-size: 12px;
  display: none;
}
.calendar-list ul li div p {
  font-size: 16px;
  color: #767676;
}
.calendar-list ul li div.calendar-list-box-select {
  width: 60px;
  height: 60px;
  background: #f0002e;
}
.calendar-list ul li div.calendar-list-box-select span {
  display: block;
  font-weight: 600;
  color: #fff;
}
.calendar-list ul li div.calendar-list-box-select p {
  font-size: 16px;
  line-height: 1;
  font-weight: 600;
  color: #fff;
}

.awards-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 20px 0 32px 0;
}
@media (max-width: 768px) {
  .awards-container {
    padding: 64px 0;
  }
}
.awards-container .awards-title p {
  font-size: 48px; /* 원하는 크기로 조절 */
  font-weight: bold;
  background-image: linear-gradient(93deg, #edecec 30%, #3a3a3a 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text; /* 일부 브라우저용 */
  color: transparent; /* fallback */
  margin: 0;
  font-family: "Paperlogy8";
  text-align: center;
}
.awards-container .awards-title p:nth-child(1) {
  font-family: "Paperlogy6";
  font-size: 40px;
}
@media (max-width: 768px) {
  .awards-container .awards-title p:nth-child(1) {
    font-family: "Paperlogy6";
    font-size: 24px;
  }
  .awards-container .awards-title p {
    font-size: 32px;
  }
}
.awards-container .awards-start-button {
  width: -moz-fit-content;
  width: fit-content;
  height: 100%;
  background-color: rgb(22, 18, 21, var(--tw-bg-opacity, 1));
  color: #fff;
  font-size: 24px;
  font-weight: 900;
  border-radius: 10px;
  position: relative;
  margin-top: 6rem;
}
@media (max-width: 768px) {
  .awards-container .awards-start-button {
    margin-top: 4rem;
  }
}
.awards-container .awards-start-button button {
  background-image: linear-gradient(155deg, #ff8adc -153.9%, #83405d 161.91%);
  mix-blend-mode: color-dodge;
  padding: 24px 48px;
  border-radius: 100px;
  font-size: 24px;
  font-weight: 500;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
@media (max-width: 768px) {
  .awards-container .awards-start-button button {
    padding: 20px 40px;
    font-size: 16px;
  }
}

.speech-bubble {
  animation: motion 2s linear 0s infinite;
  margin-top: 0;
}

@keyframes motion {
  0% {
    margin-top: 0px;
  }
  20% {
    margin-top: 10px;
  }
  40% {
    margin-top: 0px;
  }
  60% {
    margin-top: 10px;
  }
  80% {
    margin-top: 0px;
  }
  100% {
    margin-top: 0px;
  }
}
.calendar-list-wrap {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.calendar-popup-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 16px;
}
.calendar-popup-list.popuplist-board {
  padding-bottom: 100px;
}
.calendar-popup-list.popuplist-board.popup-search-list {
  padding-bottom: 0;
}
.calendar-popup-list.popuplist-board > ul > li {
  width: 100%;
}
.calendar-popup-list.popuplist-board > ul > li .pre-wrap {
  display: flex !important;
  justify-content: flex-end;
  grid-column-start: 2;
  grid-column-end: 5;
  column-gap: 8px;
}
.calendar-popup-list.popuplist-board > ul > li .pre {
  width: -moz-fit-content;
  width: fit-content;
  height: -moz-fit-content;
  height: fit-content;
  font-size: 12px;
  color: #999;
  background: #2c2c2c;
  border: 2px solid transparent;
  border-radius: 10em;
  padding: 6px 12px;
  justify-self: self-end;
}
.calendar-popup-list.popuplist-board > ul > li .pre.own {
  color: #fff;
  border: 2px solid #f0002e;
  background: transparent;
  font-weight: 700;
}
.calendar-popup-list .moreview {
  padding: 0;
}
@media (max-width: 768px) {
  .calendar-popup-list .moreview {
    padding: 0 20px;
  }
}
.calendar-popup-list > ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 24px;
  gap: 24px;
  grid-row-gap: 48px;
  row-gap: 48px;
  box-sizing: border-box;
}
.calendar-popup-list > ul > li {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  column-gap: 10px;
}
@media (max-width: 768px) {
  .calendar-popup-list > ul > li > div:first-child {
    padding: 0 20px;
  }
}
.calendar-popup-list > ul > li div {
  width: 100%;
  display: grid;
  grid-template-columns: 0.7fr 1fr;
  grid-template-rows: 3fr 0.1fr;
  grid-column-gap: 10px;
  column-gap: 10px;
  padding: 0 20px;
}
@media (max-width: 768px) {
  .calendar-popup-list > ul > li div {
    padding: 0;
  }
}
.calendar-popup-list > ul > li div .popup-info-wrap {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.calendar-popup-list > ul > li div .popup-info-wrap .popup-info-wrap-upper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  column-gap: 10px;
}
.calendar-popup-list > ul > li div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.calendar-popup-list > ul > li div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
}
.calendar-popup-list > ul > li div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item span {
  font-size: 12px;
  font-weight: 400;
}
.calendar-popup-list > ul > li div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item img {
  width: 16px;
  height: 16px;
}
.calendar-popup-list > ul > li div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item .bookmark-wrap {
  padding: 0;
}
.calendar-popup-list > ul > li div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item .bookmark-wrap img {
  width: 20px;
  height: 20px;
}
.calendar-popup-list > ul > li div .popup-info-wrap .popup-info-wrap-lower {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.calendar-popup-list > ul > li div .popup-bookmark {
  display: flex;
  justify-self: right;
}
.calendar-popup-list > ul > li div .bookmark-wrap {
  display: flex;
  justify-content: flex-end;
  padding: 0 0 10px 10px;
}
.calendar-popup-list > ul > li div .popup-img-wrap {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  border-radius: 8px;
  width: 140px;
  height: 175px;
}
.calendar-popup-list > ul > li div .popup-img-wrap.none-thumb-container {
  align-items: center;
  background-color: #000;
}
.calendar-popup-list > ul > li div .popup-img {
  grid-row-start: 1;
  grid-row-end: 4;
}
.calendar-popup-list > ul > li div .popup-img-wrap {
  position: relative;
  overflow: hidden;
}
.calendar-popup-list > ul > li div .popup-img-wrap .blur-background-wrapper {
  position: absolute;
  object-fit: cover;
  left: 50%;
  bottom: 0;
  width: 150%;
  height: 150%;
  transform: translateX(-50%);
  z-index: 0;
}
.calendar-popup-list > ul > li div .popup-img-wrap .blur-background-wrapper .blur-background {
  filter: blur(20px);
}
.calendar-popup-list > ul > li div .popup-img-wrap .popup-img-wrapper {
  position: relative;
  z-index: 1;
  width: 140px;
  height: 100%;
  object-fit: cover;
}
.calendar-popup-list > ul > li div ul {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}
.calendar-popup-list > ul > li div ul li {
  word-break: keep-all;
}
.calendar-popup-list > ul > li div .pre-wrap {
  display: flex !important;
  grid-column-start: 2;
  grid-column-end: 5;
  justify-content: flex-start;
  column-gap: 8px;
}
.calendar-popup-list > ul > li div .pre {
  font-size: 12px;
  border: 2px solid transparent;
  background: #212121;
  color: #fff;
  width: -moz-fit-content;
  width: fit-content;
  padding: 4px 10px;
  border-radius: 10em;
}
.calendar-popup-list > ul > li div .pre.own {
  color: #fff;
  border: 2px solid #f0002e;
  background: none;
  font-weight: 600;
}
.calendar-popup-list > ul > li div .popup-date-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.calendar-popup-list > ul > li div .popup-date-wrap .popup-date {
  grid-column-start: 2;
  grid-column-end: 5;
  grid-row-start: 3;
  grid-row-end: 4;
  text-align: start;
  word-break: keep-all;
  padding-top: 0;
  align-self: end;
  font-weight: 400;
}
.calendar-popup-list > ul > li:last-child {
  border-bottom: none;
}
.calendar-popup-list .full-btn {
  margin: 0 auto;
}

.calendar-popup-list-blank {
  height: 1100px;
}

@media (max-width: 768px) {
  .calendar-list header {
    padding: 0 20px;
  }
  .calendar-popup-list > ul {
    grid-template-columns: repeat(1, 1fr);
  }
}
.popup-read-ad-banner-inner {
  width: 100%;
}
.popup-read-ad-banner-inner .popup-read-ad-banner-slide {
  padding: 0;
}
.popup-read-ad-banner-inner .popup-read-ad-banner-link {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 56px;
  padding: 16px 20px;
  box-sizing: border-box;
  text-decoration: none;
  color: #121212;
  background: #f6fce4;
}
.popup-read-ad-banner-inner .popup-read-ad-banner-text {
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  gap: 8px;
  min-width: 0;
  color: #121212;
}
.popup-read-ad-banner-inner .popup-read-ad-banner-text h3 {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  white-space: pre-line;
  word-break: keep-all;
}
.popup-read-ad-banner-inner .popup-read-ad-banner-text span {
  background-color: #f0002e;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  padding: 4px 8px;
  border-radius: 4px;
}

.popup-read-ad-recommend-banner-inner {
  width: 100%;
}
.popup-read-ad-recommend-banner-inner .slick-dots {
  bottom: -28px;
}
.popup-read-ad-recommend-banner-inner .slick-dots li {
  width: 8px;
  height: 8px;
  margin: 0 4px;
}
.popup-read-ad-recommend-banner-inner .slick-dots li button {
  width: 8px;
  height: 8px;
  padding: 0;
}
.popup-read-ad-recommend-banner-inner .slick-dots li button::before {
  width: 8px;
  height: 8px;
  font-size: 8px;
  color: #d9d9d9;
  opacity: 1;
}
.popup-read-ad-recommend-banner-inner .slick-dots li.slick-active button::before {
  color: #000;
}

.popup-read-ad-recommend-banner-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-gap: 20px;
  gap: 20px;
}
.popup-read-ad-recommend-banner-row.single {
  grid-template-columns: 1fr;
}

.popup-read-ad-recommend-banner-card {
  position: relative;
  display: block;
  height: 110px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  text-decoration: none;
}

.popup-read-ad-recommend-banner-dim {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.5) 45%, rgba(255, 255, 255, 0.08) 100%);
  z-index: 1;
}

.popup-read-ad-recommend-banner-content {
  position: relative;
  z-index: 2;
  height: 100%;
  padding: 20px 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}
.popup-read-ad-recommend-banner-content h3 {
  margin: 0;
  color: #121212;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.3;
}
.popup-read-ad-recommend-banner-content p {
  margin: 0;
  color: #2c2c2c;
  font-size: 14px;
  font-weight: 500;
}

@media (max-width: 768px) {
  .popup-read-ad-recommend-banner-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .popup-read-ad-recommend-banner-card {
    height: 96px;
  }
  .popup-read-ad-recommend-banner-content {
    padding: 18px 20px;
    gap: 10px;
  }
  .popup-read-ad-recommend-banner-content h3 {
    font-size: 18px;
  }
  .popup-read-ad-recommend-banner-content p {
    font-size: 13px;
  }
}
.responsive-banner-wrap {
  width: 100%;
}
.responsive-banner-wrap .banner-slide {
  padding: 0;
}
.responsive-banner-wrap .banner-link {
  position: relative;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 136px;
  max-height: 136px;
  padding: 24px 20px;
  box-sizing: border-box;
  text-decoration: none;
  background: linear-gradient(90deg, #c7193c 0%, #c65836 100%);
}
.responsive-banner-wrap .banner-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 2;
  min-width: 0;
}
.responsive-banner-wrap .banner-text h3 {
  margin: 0 0 10px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  white-space: pre-line;
  word-break: keep-all;
}
.responsive-banner-wrap .banner-text span {
  position: relative;
  display: inline-flex;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  opacity: 0.95;
}
.responsive-banner-wrap .banner-text span::after {
  content: "›";
  margin-left: 6px;
  font-size: 16px;
  line-height: 1;
}
.responsive-banner-wrap .banner-thumb-wrap {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.responsive-banner-wrap .banner-thumb {
  width: 114px;
  height: 114px;
  object-fit: contain;
}
.responsive-banner-wrap .banner-ad {
  position: absolute;
  top: -4px;
  right: -2px;
  z-index: 3;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  padding: 4px 8px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.15);
}
@media (max-width: 768px) {
  .responsive-banner-wrap .banner-thumb-wrap {
    background-size: cover;
    background-position: right top;
  }
  .responsive-banner-wrap .banner-ad {
    top: 16px;
    right: 16px;
  }
  .responsive-banner-wrap .banner-link {
    min-height: 108px;
    padding: 20px 16px;
  }
  .responsive-banner-wrap .banner-text h3 {
    font-size: 16px;
    margin-bottom: 8px;
  }
  .responsive-banner-wrap .banner-text span {
    font-size: 13px;
  }
  .responsive-banner-wrap .banner-thumb {
    width: 100%;
    height: 100%;
  }
  .responsive-banner-wrap .banner-ad {
    font-size: 12px;
  }
}

.popupbanner-inner {
  width: 100%;
  max-width: 960px;
  height: -moz-fit-content;
  height: fit-content;
}
@media (max-width: 768px) {
  .popupbanner-inner {
    padding-left: 20px;
  }
}
.popupbanner-inner .slick-list {
  width: 100%;
  max-width: 960px;
  height: -moz-fit-content;
  height: fit-content;
  margin: 0 auto;
}
.popupbanner-inner .slick-list .slick-track {
  margin: 0;
  display: flex !important;
  align-items: center;
}
.popupbanner-inner .slick-list .slick-slide {
  box-sizing: content-box;
  width: -moz-fit-content !important;
  width: fit-content !important;
  height: auto !important;
  float: none !important;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list {
  width: -moz-fit-content !important;
  width: fit-content !important;
  height: 100%;
  position: relative;
  cursor: pointer;
  margin: 0 16px 0 0;
  display: inline-block !important;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .popupbanner-list-bookmark-wrap {
  position: absolute;
  top: 16px;
  right: 10px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
  z-index: 2;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .popupbanner-list-bookmark-wrap .bookmark-wrap {
  padding: 0;
  filter: drop-shadow(0 2px 4px rgb(0, 0, 0));
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .popupbanner-list-bookmark-wrap span {
  font-size: 12px;
  filter: drop-shadow(0 2px 4px rgb(0, 0, 0));
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .slide-img-wrap {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  position: relative;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .popular-banner-badge {
  position: absolute;
  border-radius: 4px;
  bottom: 12px;
  left: 12px;
  padding: 4px;
  background-color: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  z-index: 2;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .blur-background-wrapper {
  position: absolute;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 150%;
  height: 150%;
  z-index: 0;
  overflow: hidden;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .blur-background {
  object-fit: cover;
  filter: blur(20px);
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .popup-img-wrapper {
  position: relative;
  width: 260px;
  height: 100%;
  z-index: 1;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .slide-img-wrap {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: 240px;
  height: 300px;
  border-radius: 8px;
  position: relative;
  overflow: hidden;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list .slide-img-wrap::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: url("/assets/img/common/popupbanner-filter.png") 0 bottom;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list-content-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-bottom-left-radius: 7px;
  border-bottom-right-radius: 7px;
  min-width: 0;
  width: 100%;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list-info .popup-name {
  width: 240px;
  min-width: 0;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list-info .popup-name p {
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 16px;
  font-weight: 700;
  line-height: 24px;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list-info .popup-date-wrap {
  font-size: 14px;
  font-weight: 400;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list-info .popupbanner-list-info-item-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list-info .popupbanner-list-info-item {
  display: flex;
  align-items: center;
  gap: 5px;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list-info .popupbanner-list-info-item img {
  width: 16px;
  height: 16px;
  fill: white;
}
.popupbanner-inner .slick-list .slick-slide .popupbanner-list-info .popupbanner-list-info-item span {
  font-size: 12px;
  font-weight: 400;
}

.stack-swiper {
  width: 100%;
  height: 480px;
  padding-bottom: 30px;
  margin: 0 auto;
}
.stack-swiper .swiper-slide {
  border-radius: 12px;
  overflow: hidden;
  background-color: transparent;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.stack-swiper .popupbanner-list {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
}
.stack-swiper .slide-img-wrap {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}
.stack-swiper .popup-banner-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.stack-swiper .slide-tit {
  padding: 12px;
  padding: 70px 12px 20px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 2;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 20%, rgba(0, 0, 0, 0.6) 60%, rgba(0, 0, 0, 0.3) 80%, transparent 100%); /* 그라데이션 확장 및 단계 조정 */
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.stack-swiper .slide-tit h3 {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  color: white;
}
@media (max-width: 768px) {
  .stack-swiper .slide-tit h3 {
    margin-bottom: 0;
  }
  .stack-swiper .slide-tit p {
    margin-bottom: 0;
  }
}
.stack-swiper .banner-date {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 6px;
}
.stack-swiper .banner-location {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 15px;
}
.stack-swiper .banner-location img {
  width: 12px;
  height: 12px;
  filter: brightness(0) invert(1);
}

.swiper-pagination-stack {
  position: absolute;
  bottom: -40px !important;
  width: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  gap: 10px;
  z-index: 3;
  height: 20px;
}

.swiper-pagination-stack .swiper-pagination-bullet-stack {
  width: 6px;
  height: 6px;
  background-color: #ccc;
  opacity: 0.5;
  border-radius: 50%;
  margin: 0;
  transition: all 0.3s ease;
  cursor: default;
}

.swiper-pagination-stack .swiper-pagination-bullet-active-stack,
.swiper-pagination-stack .swiper-pagination-bullet-stack.active-bullet {
  width: 20px;
  border-radius: 3px;
  background-color: #fff;
  opacity: 1;
}

@media (max-width: 768px) {
  .stack-swiper {
    width: 100%;
    height: 520px;
  }
  .slide-tit h3 {
    font-size: 18px;
  }
  .banner-date,
  .banner-location {
    font-size: 12px;
  }
}
@media (max-width: 480px) {
  .stack-swiper {
    width: 100%;
    height: 340px;
  }
  .slide-tit {
    padding: 8px;
  }
  .slide-tit h3 {
    font-size: 16px;
    margin-bottom: 4px;
  }
  .banner-date,
  .banner-location {
    font-size: 11px;
    margin-bottom: 4px;
  }
  .banner-location {
    margin-bottom: 10px;
  }
}
.ad-popup-banner-wrap .slick-track {
  display: flex !important;
  gap: 12px;
}
.ad-popup-banner-wrap .slick-slide {
  box-sizing: border-box;
}
.ad-popup-banner-wrap .slick-slide > div {
  height: 100%;
}
.ad-popup-banner-wrap .slick-list {
  margin-right: -12px;
}
.ad-popup-banner-wrap .slick-dots {
  position: static;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
  padding: 0;
}
.ad-popup-banner-wrap .slick-dots li {
  width: auto;
  height: auto;
  margin: 0;
}
.ad-popup-banner-wrap .slick-dots button {
  width: 6px;
  height: 6px;
  padding: 0;
  border: 0;
  border-radius: 9999px;
  background: #ccc;
  font-size: 0;
  line-height: 0;
  cursor: pointer;
  transition: all 0.3s ease;
}
.ad-popup-banner-wrap .slick-dots button::before {
  display: none;
}
.ad-popup-banner-wrap .slick-dots .slick-active button {
  width: 20px;
  background: #fff;
}

.ad-popup-banner-slide {
  width: 100%;
}

.ad-popup-banner {
  width: 360px;
}
.ad-popup-banner__image-wrap {
  position: relative;
  width: 360px;
  height: 360px;
  overflow: hidden;
  border-radius: 12px;
  background: #111;
}
.ad-popup-banner__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ad-popup-banner__content {
  width: 360px;
  padding: 12px 4px;
  box-sizing: border-box;
}
.ad-popup-banner__desc {
  width: 100%;
  overflow: hidden;
}
.ad-popup-banner__desc-text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: keep-all;
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;
}
.ad-popup-banner__more {
  display: inline-block;
  margin-top: 4px;
  color: #999;
  text-decoration: underline;
}

@media (max-width: 768px) {
  .ad-popup-banner-wrap {
    width: 100%;
    overflow: hidden;
  }
  .ad-popup-banner-wrap .slick-list {
    margin-right: 0 !important;
    overflow: hidden;
  }
  .ad-popup-banner-wrap .slick-track {
    gap: 0 !important;
  }
  .ad-popup-banner-wrap .slick-slide {
    padding: 0 16px;
    box-sizing: border-box;
  }
  .ad-popup-banner-slide,
  .ad-popup-banner {
    width: 100%;
  }
  .ad-popup-banner__image-wrap {
    width: 100%;
    height: calc(100vw - 32px);
    max-height: 360px;
  }
  .ad-popup-banner__content {
    width: 100%;
    padding: 12px 4px 16px;
    overflow: hidden;
  }
}
.magazine-banner-wrap {
  width: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.magazine-banner-wrap header {
  display: flex;
  justify-content: space-between;
  padding: 0;
  align-items: center;
  padding: 0 20px;
}
.magazine-banner-wrap .slick-list {
  overflow: visible !important;
  padding-left: 20px;
}
.magazine-banner-wrap .slick-track {
  display: flex !important;
  margin-left: 0 !important;
}
.magazine-banner-wrap .slick-slide {
  display: flex;
  width: auto !important;
  margin-right: 20px;
}
.magazine-banner-wrap .slick-prev,
.magazine-banner-wrap .slick-next {
  display: none !important;
}
.magazine-banner-wrap .slick-dots {
  bottom: -30px;
}
.magazine-banner-wrap .slick-dots li {
  margin: 0 5px;
}
.magazine-banner-wrap .slick-dots li button:before {
  font-size: 10px;
  color: #999;
  opacity: 0.5;
}
.magazine-banner-wrap .slick-dots li.slick-active button:before {
  color: white;
  opacity: 1;
}
.magazine-banner-wrap .magazine-banner-item {
  width: 300px !important;
  height: 375px !important;
  cursor: pointer;
}
.magazine-banner-wrap .magazine-banner-item .magazine-image-container {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
}
.magazine-banner-wrap .magazine-banner-item .magazine-image-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 12px;
}
.magazine-banner-wrap .magazine-banner-item .magazine-image-container .magazine-gradient-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
  z-index: 1;
}
.magazine-banner-wrap .magazine-banner-item .magazine-image-container .magazine-title {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 20px;
  z-index: 2;
  color: white;
}
.magazine-banner-wrap .magazine-banner-item .magazine-image-container .magazine-title h3 {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 5px;
}
.magazine-banner-wrap .magazine-banner-item .magazine-image-container .magazine-title h4 {
  font-size: 14px;
  margin: 0;
}

.article-bottom-wrap {
  display: flex;
  flex-direction: column;
  gap: 60px;
}

.MuiBottomNavigation-root {
  height: auto !important;
  background-color: #2c2c2c !important;
  padding: 4px 4px 6px;
  z-index: 102;
  width: 100%;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  color: inherit;
}
.MuiBottomNavigation-root button.MuiBottomNavigationAction-root {
  min-width: auto;
  padding: 4px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 6px;
  color: #fff;
}
.MuiBottomNavigation-root .MuiBottomNavigationAction-label {
  font-size: 12px;
  font-weight: 200;
  color: #fff;
  white-space: pre;
}
.MuiBottomNavigation-root .MuiBottomNavigationAction-label.Mui-selected {
  font-weight: 700;
  font-size: 12px;
}
.MuiBottomNavigation-root .MuiBottomNavigationAction-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 6px;
  color: #fff;
}

.MuiBottomNavigation-root {
  width: 100%;
  position: fixed;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}

footer {
  width: 100%;
  max-width: 960px;
  height: auto;
  margin: 0 auto;
  background: #222;
  padding: 28px 20px 90px;
  box-sizing: border-box;
}
footer .footer-top-wrap {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
@media (max-width: 768px) {
  footer .footer-top-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
  }
}
footer .footer-top {
  width: 70%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  column-gap: 15px;
  row-gap: 8px;
}
@media (max-width: 768px) {
  footer .footer-top {
    width: 58%;
  }
}
footer .footer-top li a {
  display: block;
  font-size: 12px;
  font-weight: 600;
}
footer #footer-familysite {
  width: 278px;
  background: #222;
  padding: 10px;
  color: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: url("/assets/img/common/arrow_bottom.svg");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 14px;
}
footer .footer-bottom {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 10px 0;
}
@media (max-width: 768px) {
  footer .footer-bottom {
    padding: 40px 0;
  }
}
footer .footer-bottom .info-list {
  width: 100%;
}
footer .footer-bottom .info-list .tel {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  column-gap: 8px;
}
footer .footer-bottom .info-list .tel p {
  white-space: nowrap;
}
footer .footer-bottom .icon-list {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  column-gap: 16px;
  margin-top: 10px;
}
@media (max-width: 768px) {
  footer .footer-bottom .icon-list {
    justify-content: flex-start;
    margin-top: 24px;
  }
}
footer .footer-bottom .icon-list a {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 6px;
  color: #fff;
  font-weight: 400;
}
footer .footer-bottom .icon-list img {
  width: 20px;
  height: 20px;
  object-fit: cover;
}
footer .footer-bottom li {
  font-size: 12px;
  line-height: 17px;
  color: #767676;
  font-weight: 600;
}
footer span {
  font-size: 12px;
  color: #767676;
}
footer span.copyright {
  display: block;
}
@media (max-width: 768px) {
  footer span.copyright {
    display: none;
  }
}
footer span.copyright-m {
  display: none;
}
@media (max-width: 768px) {
  footer span.copyright-m {
    display: block;
    margin-top: 24px;
  }
}
footer .mark-wrap {
  padding-top: 10px;
}
footer .mark-wrap img {
  max-width: 140px;
}

.main-quick-menu {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 24px;
  gap: 24px;
  width: 100%;
}
.main-quick-menu__item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 20px 16px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 8px;
  background: linear-gradient(0deg, #1a181b 0%, #1a181b 100%), #fff;
  color: #fff;
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
.main-quick-menu__item:hover {
  border-color: rgba(255, 255, 255, 0.45);
  background: linear-gradient(180deg, #1a1a1a 0%, #1a1a1a 100%);
}
.main-quick-menu__item:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.main-quick-menu__label-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.main-quick-menu__icon-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #f5f5f5;
}
.main-quick-menu__icon {
  width: 24px;
  height: 24px;
  display: block;
}
.main-quick-menu__badge {
  width: 22px;
  height: 22px;
  aspect-ratio: 1/1;
  padding: 4px;
  border-radius: 100%;
  background: #ff1744;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  line-height: 22px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
}
.main-quick-menu__label {
  font-size: 14px;
  font-weight: 200;
  line-height: 1;
  color: #fff;
}

@media (max-width: 1024px) {
  .main-quick-menu {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .main-quick-menu {
    width: calc(100% - 72px);
    margin: 0 auto;
    gap: 20px;
  }
  .main-quick-menu__item {
    min-height: 84px;
    gap: 15px;
    padding: 12px;
  }
  .main-quick-menu__label {
    font-size: 14px;
  }
}
.required-read-area {
  width: 90%;
  margin: 0 auto;
  padding: 10px;
  background: #2c2c2c;
  border-radius: 10px;
}
.required-read-area p {
  font-size: 14px;
  font-weight: 700;
  line-height: 34px;
}
.required-read-area p span {
  padding: 3px 7px;
  background: #f0002e;
  border-radius: 5px;
  margin-right: 10px;
  font-weight: 400;
}

.contact-wrap {
  width: 100%;
  height: auto;
  overflow-x: auto;
  padding: 0 20px;
}
.contact-wrap table {
  width: 100%;
}
.contact-wrap table tr th {
  border: none;
  padding: 10px 5px;
  font-size: 16px;
}
.contact-wrap table tr td {
  border: none;
  font-size: 16px;
  padding: 10px 5px;
  word-break: keep-all;
}
.contact-wrap table tr td:nth-of-type(1) {
  width: 70%;
}
.contact-wrap table tr td:nth-of-type(2) {
  font-size: 14px;
  text-align: right;
  color: #767676;
}
.contact-wrap::-webkit-scrollbar {
  display: none;
}

.view-wrap {
  width: 100%;
  padding: 0 20px;
  margin-top: 20px;
}
.view-wrap a {
  word-break: break-word;
}
.view-wrap h1 {
  font-size: 16px;
  margin: 0;
  padding-bottom: 10px;
  border-bottom: 1px solid #2c2c2c;
}
.view-wrap > p {
  font-size: 14px;
  text-align: right;
  margin: 10px 0 0;
  color: #999;
}
.view-wrap .view-inner {
  width: 100%;
  word-break: keep-all;
  font-size: 16px;
  line-height: 25px;
  margin-bottom: 20px;
  padding: 30px 0;
  border-bottom: 1px solid #2c2c2c;
}

.text-form {
  width: 100%;
  height: auto;
  margin: 0 auto;
  margin-top: 20px;
  padding: 0 20px 100px;
  box-sizing: border-box;
}
.text-form .ck.ck-voice-label {
  display: none !important;
}
.text-form.biz-form .text-form-inner {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  flex-wrap: wrap;
  column-gap: 2.5%;
}
.text-form.biz-form .text-form-inner > span {
  display: block;
  width: 100%;
}
.text-form.biz-form .text-form-inner > p {
  width: 100%;
}
.text-form.biz-form .text-form-inner > p label {
  display: block;
  max-width: 55px;
  word-break: keep-all;
}
.text-form.biz-form .text-form-inner > p input[type=text] {
  width: 100%;
}
.text-form.biz-form .text-form-inner .edit-area {
  width: 100%;
}
.text-form .likebutton-wrap {
  padding: 0;
  margin-bottom: 100px;
}
.text-form-inner {
  overflow: hidden;
}
.text-form-inner p {
  width: 100%;
  margin: 0 0 10px;
  padding-bottom: 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: baseline;
}
.text-form-inner p label {
  display: flex;
  width: auto;
  min-width: 55px;
  font-size: 14px;
  margin-bottom: 10px;
  position: relative;
  letter-spacing: -1px;
  flex-direction: row;
  justify-content: flex-start;
  align-items: baseline;
}
.text-form-inner p label .required-mark {
  display: inline;
  font-size: 14px;
  font-weight: 700;
  color: #f0002e;
  border: none;
  padding: 0;
  margin: 0;
}
.text-form-inner p input[type=text] {
  width: 90%;
}
.text-form-inner p select {
  width: 100%;
  max-width: 960px;
  height: 48px;
  padding: 0 10px;
  border-radius: 0;
  outline: none;
}
.text-form-inner p textarea {
  width: 100%;
  border: none;
  outline: none;
  border-radius: 0;
  font-size: 14px;
  padding: 20px;
  box-sizing: border-box;
}
.text-form-inner p ul.report-location-wrap {
  flex-direction: column;
}
.text-form-inner p ul.report-location-wrap li {
  width: 100%;
}
.text-form-inner p ul {
  width: 93%;
  max-width: 960px;
  height: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
}
.text-form-inner p ul li p {
  align-items: center;
}
.text-form-inner p ul li p button {
  width: 100%;
  max-width: 120px;
  height: 32px;
  padding: 0 20px;
  background: #fff;
  color: #121212;
  border: 0;
}
.text-form-inner p .report-date-wrap li {
  padding-bottom: 10px;
  width: 100%;
}
.text-form-inner p .report-date-wrap li input[type=date] {
  width: 100%;
  height: 32px;
  line-height: 32px;
  border: 0;
  border-bottom: 1px solid #fff;
  box-sizing: border-box;
}
.text-form-inner span {
  display: block;
  font-size: 12px;
  line-height: 24px;
  border: 1px solid #fff;
  padding: 5px 10px;
  box-sizing: border-box;
  margin-bottom: 20px;
}
.text-form-inner .edit-area {
  flex-direction: column;
}
.text-form-inner .edit-area .ck.ck-reset.ck-editor.ck-rounded-corners {
  width: 100%;
  max-width: 100%;
}
.text-form-inner .checkbox-wrap {
  justify-content: flex-start;
  align-items: center;
}
.text-form-inner .checkbox-wrap label {
  margin: 0;
}

.rdw-editor-wrapper ul.rdw-dropdown-optionwrapper {
  width: 100%;
}
.rdw-editor-wrapper span {
  line-height: initial;
  padding: 0;
  margin: 0;
}
.rdw-editor-wrapper ul {
  width: auto;
}
.rdw-editor-wrapper .rdw-editor-toolbar {
  padding: 6px 5px;
  margin-bottom: 0;
  position: relative;
}
.rdw-editor-wrapper .rdw-editor-toolbar div {
  position: initial;
}
.rdw-editor-wrapper .rdw-dropdownoption-default {
  color: #121212;
}
.rdw-editor-wrapper .rdw-dropdown-selectedtext {
  color: #121212;
}
.rdw-editor-wrapper .rdw-fontsize-dropdown {
  max-width: 40px;
}
.rdw-editor-wrapper .rdw-dropdown-carettoopen,
.rdw-editor-wrapper .rdw-dropdown-carettoclose {
  width: 8px;
  height: 5px;
  position: absolute !important;
  border: none;
}
.rdw-editor-wrapper .rdw-dropdown-carettoopen {
  background: url("/assets/img/common/icon_answerBottom_black.png") 0 0 no-repeat;
  background-size: cover;
}
.rdw-editor-wrapper .rdw-dropdown-carettoclose {
  background: url("/assets/img/common/icon_arrowTop_black.png") 0 0 no-repeat;
  background-size: cover;
}
.rdw-editor-wrapper .rdw-image-modal,
.rdw-editor-wrapper .rdw-embedded-modal,
.rdw-editor-wrapper .rdw-link-modal,
.rdw-editor-wrapper .rdw-colorpicker-modal,
.rdw-editor-wrapper .rdw-emoji-modal {
  height: 220px;
  position: absolute !important;
  color: #121212;
  box-sizing: border-box;
  box-shadow: none;
  left: 0;
  top: initial;
  bottom: -220px;
}
.rdw-editor-wrapper .rdw-image-modal-header {
  margin: 0;
}
.rdw-editor-wrapper .rdw-link-modal-input {
  width: 100%;
  line-height: normal;
}
.rdw-editor-wrapper .rdw-embedded-modal-size-input {
  width: 50%;
}
.rdw-editor-wrapper .rdw-emoji-icon {
  font-size: 16px;
}
.rdw-editor-wrapper .rdw-colorpicker-modal-header span {
  margin: 0 auto;
}
.rdw-editor-wrapper .rdw-colorpicker-modal-options {
  display: flex;
}
.rdw-editor-wrapper .public-DraftStyleDefault-block {
  margin: 0;
}

.demo-editor {
  width: 100%;
  max-width: 960px;
  min-height: 200px;
  margin: 0 auto;
  padding: 5px 10px;
  background: #fff;
  cursor: text;
}
.demo-editor div {
  color: #121212;
}
.demo-editor span {
  display: inline;
  border: none;
  font-size: 14px;
  line-height: 20px;
  padding: 0;
  margin: 0;
}

.list-wrap {
  width: 100%;
  height: auto;
  padding: 0 20px;
}
.list-wrap ul li a {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  column-gap: 5px;
  row-gap: 5px;
  padding: 10px 0;
  border-bottom: 1px solid #fff;
}
.list-wrap ul li a > p:first-child {
  cursor: pointer;
  padding: 5px 0;
}
@media screen and (max-width: 768px) {
  .list-wrap ul li a {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
  }
}
.list-wrap ul li p {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 10px;
  row-gap: 5px;
  word-break: keep-all;
}
.list-wrap ul li p .category {
  color: #999;
  font-size: 14px;
}
.list-wrap ul li p .state {
  color: #fff;
  font-size: 14px;
}
.list-wrap ul li p .state-ok {
  color: #f0002e;
  font-weight: 700;
}
.list-wrap ul li p .date {
  font-size: 14px;
  color: #767676;
}

.edit-area.qna-form .ck {
  border: 1px solid #fff;
  min-width: 100px;
  border-radius: 150px;
  height: 300px;
}

.faq-list-wrap {
  width: 100%;
  padding: 0 20px;
}
.faq-list-wrap ul li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  row-gap: 5px;
}
.faq-list-wrap ul li .faq-category {
  font-size: 14px;
  color: #999;
}
.faq-list-wrap ul li p {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  font-size: 16px;
  column-gap: 5px;
  cursor: pointer;
}
.faq-list-wrap ul li p a {
  word-break: keep-all;
}
.faq-list-wrap ul li p span {
  display: block;
  font-size: 14px;
  color: #999;
}
.faq-list-wrap ul li > a {
  width: 100%;
}
.faq-list-wrap ul li div {
  width: 100%;
  height: 0;
  background: #2c2c2c;
  padding: 0 20px;
  margin: 10px 0;
  border-radius: 5px;
  font-size: 16px;
  transition: all 0.3s;
  overflow: hidden;
}
.faq-list-wrap ul li div.active {
  height: auto;
  padding: 10px 20px;
}

.popup-report-wrap {
  width: 100%;
  padding: 0 20px;
  overflow: hidden;
}

.report-btn {
  background-color: #f0002e;
  border: 1px solid #f0002e;
}
.report-btn:hover {
  border: 1px solid #e9e9e9;
}

.text-form-inner.report-form {
  display: flex;
  flex-direction: column;
  gap: 25px;
}
.text-form-inner.report-form .ck {
  border: 1px solid #fff !important;
  border-radius: 10px;
  margin-top: 15px;
}
.text-form-inner.report-form .ck-content {
  min-width: 100px;
}
.text-form-inner.report-form .input-category {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 15px;
}
.text-form-inner.report-form .input-category label {
  flex-shrink: 0;
}
.text-form-inner.report-form .input-category input {
  flex-grow: 1;
  height: 37px;
  margin: 0;
}
.text-form-inner.report-form .input-category.address {
  align-items: flex-start;
}
.text-form-inner.report-form .input-category.address label {
  margin-top: 10px;
}
.text-form-inner.report-form .thumbnail-img-wrap {
  position: relative;
  width: 100px;
  height: 100px;
}
.text-form-inner.report-form .thumbnail-img-wrap button {
  position: absolute;
  top: -10px;
  right: -13px;
  width: 24px;
  background: #767676;
  height: 24px;
  z-index: 99;
  border-radius: 100px;
  border: none;
}
.text-form-inner.report-form .thumbnail-img-wrap img {
  width: 100%;
  height: 100%;
}
.text-form-inner.report-form .likebutton-wrap {
  padding: 0;
}
.text-form-inner.report-form .upload-file-area {
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.text-form-inner.report-form .upload-file-area p {
  font-size: 14px;
  justify-content: flex-start;
  margin: 0;
}
.text-form-inner.report-form .upload-file-area p span {
  border: none;
  color: #999;
  margin: 0;
}
.text-form-inner.report-form .upload-file-area > div {
  position: relative;
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: row;
  column-gap: 20px;
}
.text-form-inner.report-form .upload-file-area > div .preview-wrap {
  width: 100px;
  height: 100px;
  display: none;
}
.text-form-inner.report-form .upload-file-area > div .preview-wrap-shown {
  display: block;
}
.text-form-inner.report-form .upload-file-area > div .preview-wrap img {
  display: block;
  object-fit: cover;
}
.text-form-inner.report-form .upload-file-area > div label {
  width: 100px;
  height: 100px;
  background: #121212;
  border: 1px solid #fff;
  color: #fff;
  cursor: pointer;
  box-sizing: border-box;
}
.text-form-inner.report-form .upload-file-area > div label span {
  border: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 0;
  margin: 0;
  font-size: 16px;
}
.text-form-inner.report-form .upload-file-area > div #p_image_upload {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
}

.view-wrap.popup-report-view-wrap .subject-bottom {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  column-gap: 10px;
  margin-top: 10px;
}
.view-wrap.popup-report-view-wrap .subject-bottom p {
  font-size: 14px;
  color: #999;
}
.view-wrap.popup-report-view-wrap .subject-bottom p.check {
  font-weight: 600;
}
.view-wrap.popup-report-view-wrap .subject-bottom p.check-ok {
  font-weight: 700;
  color: #f0002e;
}
.view-wrap.popup-report-view-wrap ul {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  overflow: hidden;
}
.view-wrap.popup-report-view-wrap ul li {
  display: flex;
  flex-direction: row;
  font-size: 16px;
  font-weight: 600;
  padding-bottom: 10px;
  word-break: keep-all;
  align-items: baseline;
}
.view-wrap.popup-report-view-wrap ul li p {
  font-size: 14px;
  font-weight: 700;
  padding-right: 10px;
}

.search-filter-box {
  width: 100%;
  height: auto;
  padding: 0 20px;
}
.search-filter-box .filter-category {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.search-filter-box .filter-category > li {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  padding: 15px 0;
  border-bottom: 1px solid #212121;
  word-break: keep-all;
}
.search-filter-box .filter-category > li.filter-plus {
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  color: #999;
  text-decoration: underline;
}
.search-filter-box .filter-category > li.filter-plus-none {
  display: none;
}
.search-filter-box .filter-category > li.noneborder-filter {
  height: 0;
  padding: 0;
  overflow: hidden;
  transition: all 0.3s;
  border: none;
  opacity: 0;
}
.search-filter-box .filter-category > li.noneborder-filter .filter-contents .filter-contents-list li {
  border: none;
  padding: 8px 6px;
  font-weight: normal;
}
.search-filter-box .filter-category > li.noneborder-filter .filter-contents .filter-contents-list li.select {
  border: none;
  color: #f0002e;
  background: none;
  font-weight: 700;
}
.search-filter-box .filter-category > li.noneborder-filter-shown {
  padding: 15px 0;
  height: auto;
  transition: all 0.3s;
  border-bottom: 1px solid #212121;
  opacity: 1;
}
.search-filter-box .filter-category > li.period-li {
  height: 0;
  padding: 0;
  overflow: hidden;
  transition: all 0.3s;
  border: none;
}
.search-filter-box .filter-category > li.period-li-shown {
  height: auto;
  padding: 10px 0 15px;
  transition: all 0.3s;
  border-bottom: 1px solid #212121;
}
.search-filter-box .filter-category > li p {
  width: 100%;
  max-width: 70px;
  padding-right: 10px;
  font-size: 16px;
  font-weight: 700;
  box-sizing: border-box;
}

.filter-contents {
  display: block;
  overflow-x: scroll;
  scroll-behavior: smooth;
  cursor: pointer;
  position: relative;
}
.filter-contents ul {
  width: 100%;
  max-width: 960px;
  min-width: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  column-gap: 8px;
  transition: all 0.3s;
}
.filter-contents ul.filter-date-pick li {
  width: 45%;
  border: none;
  padding: 0;
  flex: 1 0 auto;
}
.filter-contents ul.filter-date-pick li input[type=date] {
  width: 100%;
  box-sizing: border-box;
  border-bottom: 2px solid #fff;
}
.filter-contents ul.filter-date-pick li input[type=date]:active {
  border-bottom: 2px solid #f0002e;
}
.filter-contents ul.filter-date-pick li input[type=date]:focus {
  border-bottom: 2px solid #f0002e;
}
.filter-contents ul li {
  width: 100%;
  white-space: nowrap;
  border: 1px solid #2c2c2c;
  border-radius: 35px;
  padding: 8px 22px;
  background: none;
  font-size: 14px;
  color: #999;
}
.filter-contents ul li.select {
  background: #f0002e;
  color: #fff;
  border-color: #f0002e;
}
.filter-contents::-webkit-scrollbar {
  display: none;
}

.area-box {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}
.area-box ul {
  display: block !important;
  overflow-y: scroll;
  max-height: 400px;
}
.area-box ul li {
  text-align: center;
}

.popuplist-filter {
  width: 100%;
  padding: 20px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.popuplist-filter.event-filter {
  justify-content: flex-end;
}
.popuplist-filter.event-filter img {
  vertical-align: middle;
}
.popuplist-filter p {
  font-weight: 600;
  cursor: pointer;
}
.popuplist-filter.popup-search-filter {
  font-size: 18px;
  background: #212121;
  border-bottom: 1px solid #767676;
  padding: 10px 16px;
  cursor: pointer;
}
.popuplist-filter.popup-search-filter img {
  width: 16px;
  transition: all 0.3s;
}
.popuplist-filter.popup-search-filter img.on {
  transform: rotate(180deg);
}

.magazinelist-filter {
  width: 100%;
  padding: 0 20px 20px;
}
.magazinelist-filter p {
  width: -moz-fit-content;
  width: fit-content;
  cursor: pointer;
}

.map-list-container {
  position: relative;
  width: 100%;
  height: 100dvh;
  overflow: hidden;
}

.map-list-filter {
  width: 100%;
  max-width: 928px;
  margin: 0 auto;
  padding: 0 20px;
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: start;
  gap: 8px;
}
.map-list-filter__input-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.map-list-filter__input-wrap > input {
  height: 44px !important;
  background: #fff;
  border-radius: 100px;
  color: #121212;
  margin-bottom: 0;
  box-shadow: 0 0 4.6px 0 rgba(0, 0, 0, 0.25), 0 2px 8px 0 rgba(0, 0, 0, 0.25);
}

.map-list-overlay {
  position: absolute;
  inset: 0;
  z-index: 20;
  pointer-events: none;
}

.map-list-overlay > * {
  pointer-events: auto;
}

.map-list-open-button {
  position: fixed;
  left: 50%;
  bottom: 100px;
  transform: translateX(-50%);
  z-index: 102;
  width: -moz-fit-content;
  width: fit-content;
  padding: 8px 12px;
  border: 0;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25), 0 1px 9.7px 0 rgba(0, 0, 0, 0.25);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  color: #121212;
}

.map-bottom-sheet {
  position: fixed;
  left: 50%;
  bottom: 0;
  z-index: 101;
  width: 100%;
  max-width: 960px;
  height: 100dvh;
  background: #121212;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transform: translateX(-50%);
  will-change: transform;
}
.map-bottom-sheet__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  z-index: 100;
}
.map-bottom-sheet__backdrop.is-active {
  opacity: 1;
  pointer-events: auto;
}
.map-bottom-sheet--full {
  border-radius: 0;
}
.map-bottom-sheet__handle-area {
  flex-shrink: 0;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #121212;
  touch-action: none;
  cursor: -webkit-grab;
  cursor: grab;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.map-bottom-sheet__handle-area:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
.map-bottom-sheet__handle {
  width: 40px;
  height: 4px;
  border-radius: 999px;
  background: #777;
}
.map-bottom-sheet__filter {
  flex-shrink: 0;
  padding: 0 22px 32px;
  background: #121212;
}
.map-bottom-sheet__content {
  flex: 1 1;
  overflow-y: auto;
  background: #121212;
}
.map-bottom-sheet__content::-webkit-scrollbar {
  width: 6px;
}
.map-bottom-sheet__content::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 999px;
}
.map-bottom-sheet__content::-webkit-scrollbar-track {
  background: transparent;
}

.map-list-filter--in-sheet {
  position: static;
  width: 100%;
  padding: 0;
  background: transparent;
  transform: translateX(0%);
}

.area-quick-search {
  width: 100%;
  max-width: 928px;
  margin: 0 auto;
}
.area-quick-search__list {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.area-quick-search__list li {
  list-style: none;
}
.area-quick-search__list button {
  padding: 6px 12px;
  border: 1px solid #ddd;
  color: #121212;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 -1px 4.8px 0 rgba(0, 0, 0, 0.08), 0 2px 6.8px 0 rgba(0, 0, 0, 0.22);
  font-size: 14px;
  font-weight: 400;
  cursor: pointer;
  transition: all 0.2s ease;
}
.area-quick-search__list button.select {
  border-color: #111;
  background: #111;
  color: #fff;
}

.location-consent-modal {
  position: fixed;
  inset: 0;
  z-index: 2000;
}
.location-consent-modal__dim {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
}
.location-consent-modal__panel {
  position: absolute;
  left: 50%;
  top: 50%;
  width: calc(100% - 24px);
  max-width: 320px;
  padding: 20px;
  border-radius: 16px;
  background: #1e1e1e;
  transform: translate(-50%, -50%);
  box-sizing: border-box;
}
.location-consent-modal__description {
  margin: 12px 0 0;
  color: #fff;
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.6;
  word-break: keep-all;
}
.location-consent-modal__agree-row {
  margin-top: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.location-consent-modal__checkbox-wrap {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.location-consent-modal__agree-text {
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.5;
}
.location-consent-modal__view {
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;
  font-weight: 400;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}
.location-consent-modal__confirm {
  width: 100%;
  margin-top: 24px;
  border: 0;
  border-radius: 4px;
  padding: 16px 24px;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}
.location-consent-modal__confirm.is-active {
  background: #f0002e;
}
.location-consent-modal__confirm.is-disabled {
  background: #8a8a8a;
  cursor: not-allowed;
}

.location-consent-modal__terms {
  position: fixed;
  inset: 0;
  z-index: 2100;
}

.location-consent-modal__terms-dim {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}

.location-consent-modal__terms-panel {
  position: absolute;
  left: 50%;
  top: 50%;
  width: calc(100% - 32px);
  max-width: 400px;
  transform: translate(-50%, -50%);
  background: #1e1e1e;
  border-radius: 16px;
  padding: 20px;
  color: #fff;
}

.location-consent-modal__terms-content {
  margin-top: 12px;
  font-size: 14px;
  line-height: 1.6;
  color: #ccc;
}

.location-consent-modal__terms-close {
  margin-top: 20px;
  width: 100%;
  height: 44px;
  background: #f0002e;
  border-radius: 8px;
  color: white;
}

.popup-list-filter {
  width: 100%;
  padding: 20px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.popuplist-filter-box {
  width: 100%;
  max-width: 960px;
  height: 0;
  background: #212121;
  border-radius: 5px 5px 0 0;
  padding: 0 20px;
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 101;
  overflow: hidden;
  transition: all 0.3s ease-out;
}
.popuplist-filter-box-up {
  height: auto;
  padding: 30px 20px 80px;
}
.popuplist-filter-box::after {
  content: " ";
  display: block;
  position: absolute;
  top: 15px;
  left: 50%;
  transform: translateX(-50%);
  width: 45px;
  height: 3px;
  background: #3c3c3c;
  border-radius: 2px;
}
.popuplist-filter-box ul {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.popuplist-filter-box ul::-webkit-scrollbar {
  display: none;
}
.popuplist-filter-box ul li {
  width: 100%;
  padding: 15px 0;
  border-bottom: 1px solid #2c2c2c;
  position: relative;
  cursor: pointer;
}
.popuplist-filter-box ul li.select {
  font-weight: 700;
}
.popuplist-filter-box ul li.select::after {
  content: "";
  display: block;
  width: 13px;
  height: 10px;
  background: url("/assets/img/common/filter-check.png") center center no-repeat;
  background-size: cover;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.popup-slide-container {
  height: 0;
  padding: 0 0 20px;
  transition: all 0.3s;
}
.popup-slide-container.on {
  height: auto;
  padding: 2px 0 0;
  transition: all 0.3s;
}

.popup-search-dots {
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
}
.popup-search-dots li {
  display: none;
}
.popup-search-dots li:first-child {
  display: block;
}
.popup-search-dots li:first-child div {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 6px;
  font-size: 18px;
  color: #fff;
}
.popup-search-dots li:first-child div .gray {
  color: #999;
}

.listPrevious {
  position: absolute;
  bottom: 3px;
  left: 20%;
  z-index: 1;
  border: 0;
  cursor: pointer;
}
.listPrevious.disabled {
  opacity: 0;
  cursor: default;
}
.listPrevious::after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background: url("/assets/img/common/arrow_left_big.png") center center no-repeat;
  background-size: cover;
}

.listNext {
  position: absolute;
  bottom: 3px;
  right: 20%;
  z-index: 1;
  border: 0;
  cursor: pointer;
}
.listNext.disabled {
  opacity: 0;
  cursor: default;
}
.listNext::after {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background: url("/assets/img/common/arrow_right_big.png") center center no-repeat;
  background-size: cover;
}

.popup-search-list {
  width: 100%;
  margin-bottom: 50px;
}
.popup-search-list-wrap {
  margin: 40px 0;
  padding-bottom: 100px;
}
.popup-search-list .slick-track {
  margin-right: auto !important;
  margin-left: 0 !important;
}
.popup-search-list .slick-slider {
  width: 100%;
  overflow: hidden;
}
.popup-search-list .slick-slide {
  padding: 0 20px;
}

.search-banner-wrap {
  width: 100% !important;
  max-width: 500px;
  padding: 20px 0;
}
.search-banner-wrap > div {
  width: 100%;
  display: grid;
  grid-template-columns: 0.3fr 1fr;
  grid-template-rows: 3fr 0.1fr;
  grid-column-gap: 10px;
  column-gap: 10px;
  padding: 0 20px;
}
@media (max-width: 768px) {
  .search-banner-wrap > div {
    padding: 0;
  }
}
.search-banner-wrap > div .popup-info-wrap {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.search-banner-wrap > div .popup-info-wrap .popup-info-wrap-upper {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  column-gap: 10px;
}
.search-banner-wrap > div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.search-banner-wrap > div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
}
.search-banner-wrap > div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item span {
  font-size: 12px;
  font-weight: 400;
}
.search-banner-wrap > div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item img {
  width: 16px;
  height: 16px;
}
.search-banner-wrap > div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item .bookmark-wrap {
  padding: 0;
}
.search-banner-wrap > div .popup-info-wrap .popup-info-wrap-upper .popup-info-wrap-upper-right .popup-info-wrap-upper-right-item .bookmark-wrap img {
  width: 20px;
  height: 20px;
}
.search-banner-wrap > div .popup-info-wrap .popup-info-wrap-lower {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.search-banner-wrap > div .popup-bookmark {
  display: flex;
  justify-self: right;
}
.search-banner-wrap > div .bookmark-wrap {
  display: flex;
  justify-content: flex-end;
  padding: 0 0 10px 10px;
}
.search-banner-wrap > div .popup-img-wrap {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  border-radius: 8px;
  width: 140px;
  height: 175px;
  grid-row-start: 1;
  grid-row-end: 4;
}
.search-banner-wrap > div .popup-img-wrap.none-thumb-container {
  align-items: center;
  background-color: #000;
}
.search-banner-wrap > div .popup-img-wrap {
  position: relative;
  overflow: hidden;
}
.search-banner-wrap > div .popup-img-wrap .popup-img-wrapper {
  position: relative;
  z-index: 1;
  width: 140px;
  height: 100%;
  object-fit: cover;
}
.search-banner-wrap > div .popup-img-wrap .blur-background-wrapper {
  position: absolute;
  width: 150%;
  height: 150%;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
}
.search-banner-wrap > div .popup-img-wrap .blur-background {
  object-fit: cover;
  filter: blur(20px);
  z-index: 0;
}
.search-banner-wrap > div ul {
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}
.search-banner-wrap > div ul li {
  word-break: keep-all;
}
.search-banner-wrap > div .pre-wrap {
  display: flex !important;
  grid-column-start: 2;
  grid-column-end: 5;
  justify-content: flex-start;
  column-gap: 8px;
}
.search-banner-wrap > div .pre {
  font-size: 12px;
  border: 2px solid transparent;
  background: #212121;
  color: #fff;
  width: -moz-fit-content;
  width: fit-content;
  padding: 4px 10px;
  border-radius: 10em;
}
.search-banner-wrap > div .pre.own {
  color: #fff;
  border: 2px solid #f0002e;
  background: none;
  font-weight: 600;
}
.search-banner-wrap > div .popup-date-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.search-banner-wrap > div .popup-date-wrap .popup-date {
  grid-column-start: 2;
  grid-column-end: 5;
  grid-row-start: 3;
  grid-row-end: 4;
  text-align: start;
  word-break: keep-all;
  padding-top: 0;
  align-self: flex-end;
  font-weight: 400;
}

.blank-list {
  width: 100%;
  max-width: 980px;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 30px;
  margin: 100px auto 80px;
}
.blank-list .keyword {
  font-weight: 700;
  font-size: 16px;
}
.blank-list .keyword-wrap {
  font-size: 14px;
  text-align: center;
  font-weight: 200;
}

.blank-tit {
  padding: 0 16px;
}
.blank-tit h2 {
  margin: 0;
  line-height: 1.5;
}

.reservation-full {
  width: 100%;
  padding: 16px;
  background: #f0002e;
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.reservation-full.end {
  background: #999;
}
.reservation-full.pre {
  background: #fff;
  color: #121212;
}

.reservation-link-button {
  display: block;
  width: 100%;
  margin: 10px auto;
  background: #f0002e;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.popupdetail {
  width: 100%;
  position: relative;
}
.popupdetail-banner {
  width: 100%;
  max-width: 960px;
  max-height: 480px;
  max-height: 600px;
  margin: 0 auto;
}
.popupdetail-wrap {
  width: 100%;
  padding: 0 20px;
}
.popupdetail-top {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 15px 0 0;
}
.popupdetail-top li {
  width: auto;
}
.popupdetail-top li a {
  display: block;
}
.popupdetail-top li a.bookmark-wrap {
  padding: 0;
}
.popupdetail-top li ul {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  column-gap: 13px;
}
.popupdetail-top li ul li {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 5px;
}
.popupdetail-top li ul li img {
  display: block;
  cursor: pointer;
}
.popupdetail-top li ul li button {
  border: none;
  background: none;
  cursor: pointer;
}
.popupdetail-top li ul li span {
  font-size: 14px;
  font-weight: 500;
}
.popupdetail-inner {
  width: 100vw;
  height: auto;
  margin-left: calc(-50vw + 50%);
}
.popupdetail-title {
  width: 100%;
  height: auto;
  padding: 0 20px;
}
.popupdetail-title-top {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.popupdetail-title-top li {
  display: flex;
  flex-direction: row;
}
.popupdetail-title-top li .popupbrand {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  column-gap: 4px;
}
.popupdetail-title-top li p {
  font-size: 14px;
  color: #999;
  cursor: pointer;
}
.popupdetail-title-top li span {
  font-size: 12px;
  color: #999;
}
.popupdetail-title-top li img {
  display: block;
  margin-left: 3px;
  object-fit: contain;
}
.popupdetail-title-info .tit {
  font-size: 32px;
  font-weight: 700;
  line-height: 34px;
  margin-bottom: 8px;
}
.popupdetail-title-info .date {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 4px;
  line-height: 20px;
}
.popupdetail-title-info .date-info {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 8px;
  color: #999;
  line-height: 20px;
}
.popupdetail-title-info .location {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}
.popupdetail-title-info p {
  font-size: 14px;
}
.popupdetail-title-info .search-box-inner ul {
  border: none;
}
.popupdetail-title-info .search-box-inner ul li {
  padding: 8px 12px;
}
.popupdetail .popupdetail-warning-text {
  font-size: 14px;
  color: #999;
  margin-top: 6px;
  padding: 0.5rem 1rem;
}
.popupdetail-icon-area {
  width: 100%;
  padding: 20px;
  border-top: 1px solid #212121;
  border-bottom: 1px solid #212121;
}
.popupdetail-icon-area ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  row-gap: 15px;
}
.popupdetail-icon-area ul li {
  width: 25%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 10px;
}
.popupdetail-icon-area ul li.false {
  display: none;
}
.popupdetail-icon-area ul li p {
  font-size: 12px;
  text-align: center;
  letter-spacing: -0.5px;
  white-space: nowrap;
}
.popupdetail-time {
  width: 100%;
  padding: 20px;
}
.popupdetail-time header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.popupdetail-time header h3 {
  cursor: pointer;
}
.popupdetail-time header img {
  display: block;
  width: 12px;
  height: 6px;
  margin-bottom: 12px;
  transform: rotate(180deg);
  transition: all 0.2s;
  cursor: pointer;
}
.popupdetail-time header img.open {
  transform: rotate(0);
}
.popupdetail-time ul {
  height: 0;
  overflow: hidden;
  padding: 0 20px;
  transition: all 0.3s;
}
.popupdetail-time ul.open {
  height: auto;
  padding: 0 0px 20px;
  transition: all 0.3s;
}
.popupdetail-time ul li {
  font-size: 14px;
  font-weight: 400;
}
.popupdetail-time ul li:last-child {
  padding-bottom: 0;
}
.popupdetail-time ul li.time-notice {
  padding-top: 8px;
  color: #767676;
}
.popupdetail-time ul p {
  font-size: 14px;
  font-weight: 600;
}
.popupdetail .info-tit {
  font-size: 16px;
  font-weight: 700;
  margin: 0;
  margin-bottom: 15px;
}
.popupdetail .info-tit span {
  font-size: 14px;
  color: #999;
}
.popupdetail-info {
  width: 100%;
}
.popupdetail-info h2 {
  padding: 0 20px;
}
.popupdetail-info-inner {
  padding: 30px 20px;
  background: #2c2c2c;
}
.popupdetail-info-inner > * {
  margin: 0;
  font-size: 14px;
  color: #999;
  line-height: 1.5;
}
.popupdetail-info-inner p {
  font-size: 14px;
  color: #fff;
  line-height: 1.5;
}
.popupdetail-caution {
  padding: 20px;
}
.popupdetail-caution div p {
  font-size: 14px;
  font-weight: 600;
  color: #999;
  padding-bottom: 5px;
}
.popupdetail-map {
  width: 100%;
  max-width: 960px;
  height: auto;
}
.popupdetail-map > div {
  width: 100%;
  max-height: 200px;
  position: relative;
  overflow: hidden;
}
.popupdetail-map > div .map-area {
  min-height: 200px;
  margin-top: 0;
}
.popupdetail-map > div .zoom-button {
  display: block;
  position: absolute;
  top: 5px;
  right: 2px;
  z-index: 100;
  cursor: pointer;
}
.popupdetail-map > div .naver-marker-wrap img {
  position: initial;
}
.popupdetail-map ul {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  background: #212121;
}
.popupdetail-map ul li:first-child {
  flex: 1 1 auto;
}
.popupdetail-map ul li p {
  width: 95%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
}
.popupdetail-map ul li button {
  width: 71px;
  height: 32px;
  padding: 0 12px;
  font-size: 13px;
  border: 1px solid #767676;
  border-radius: 5px;
  background: none;
  color: #fff;
  cursor: pointer;
  transition: all 0.3s;
}
.popupdetail-map ul li button:hover {
  background: #fff;
  color: #121212;
  border-color: #fff;
}
.popupdetail-link {
  width: 100%;
  margin-bottom: 40px;
}
.popupdetail-link ul li {
  width: 100%;
  border-bottom: 1px solid #212121;
}
.popupdetail-link ul li a {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  color: #999;
  padding: 15px 20px;
  box-sizing: border-box;
}

.review-wrap {
  width: 100%;
  height: auto;
}
.review-wrap .review-keyword-wrap {
  margin: 0px 0 25px;
}
@media (max-width: 768px) {
  .review-wrap .review-keyword-wrap {
    padding: 0 20px;
  }
}
.review-wrap .button-wrap {
  padding: 12px 20px 0;
}
.review-wrap .button-wrap button {
  width: 100%;
  height: 48px;
  padding: 0 20px;
  font-size: 15px;
  border: none;
  border-radius: 5px;
  background: #f0002e;
  color: #fff;
  cursor: pointer;
  transition: all 0.3s;
}
.review-wrap .button-wrap button:hover {
  background: #f0002e;
  border-color: #f0002e;
}

.review-list-data-title {
  color: #acacac;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  padding: 4px 10px;
  border-radius: 4px;
  background: #414141;
}

.review-list-data-comment {
  height: 55px;
  max-height: 55px;
  overflow-y: auto;
}
.review-list-data-comment::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 10em;
}
.review-list-data-comment::-webkit-scrollbar {
  width: 3px;
  height: auto;
  background: #121212;
  border-radius: 10em;
}

.delete-modal {
  background: #000;
  padding: 32px;
  border-radius: 8px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  width: 350px;
  height: 200px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.popupdetail-wrap .review-list {
  border: none;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.popupdetail-wrap .review-list .review-button {
  display: flex;
  justify-content: flex-end;
}
.popupdetail-wrap .review-list .review-button button {
  border: none;
  border-radius: 5px;
  background: #f0002e;
  color: #fff;
  padding: 10px 30px;
  font-size: 16px;
  font-weight: 700;
}
@media (max-width: 768px) {
  .popupdetail-wrap .review-list .review-button {
    justify-content: center;
  }
  .popupdetail-wrap .review-list .review-button button {
    width: 100%;
  }
}
.popupdetail-wrap .review-list .review-avg-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.popupdetail-wrap .review-list .review-avg-wrap ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.popupdetail-wrap .review-list .review-avg-wrap ul li {
  border-radius: 8px;
  font-size: 12px;
}
.popupdetail-wrap .review-list .review-avg-wrap ul li button {
  height: auto;
  padding: 4px 10px;
  background: #707070;
  border: 1px solid #999;
  transition: all 0.3s ease;
  text-align: left;
  color: #fff;
  border-radius: 8px;
}
.popupdetail-wrap .review-list .review-avg-wrap ul li button:hover {
  background: transparent;
}
.popupdetail-wrap .review-list .review-avg-wrap p {
  font-weight: 700;
}
.popupdetail-wrap .review-list .review-avg-wrap .review-avg-text .avg {
  font-size: 12px;
  color: #a4a4a4;
}
.popupdetail-wrap .button-wrap {
  padding: 12px 20px 0;
}
.popupdetail-wrap .button-wrap button {
  width: 100%;
  height: 48px;
  padding: 0 20px;
  font-size: 15px;
  border: none;
  border-radius: 5px;
  background: #f0002e;
  color: #fff;
  cursor: pointer;
  transition: all 0.3s;
}
.popupdetail-wrap .button-wrap button:hover {
  background: #f0002e;
  border-color: #f0002e;
}

.review-top {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
  margin-bottom: 24px;
}
.review-top div {
  font-size: 16px;
  font-weight: 600;
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: center;
}
.review-top div span {
  font-size: 14px;
  color: #a4a4a4;
}

.review-slide {
  width: 100%;
  margin-bottom: 40px;
}
@media (max-width: 768px) {
  .review-slide {
    padding-left: 20px;
  }
}
.review-slide .slick-track {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  column-gap: 10px;
  margin: 0;
}
.review-slide-blank {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  row-gap: 6px;
  word-break: keep-all;
  text-align: center;
  padding: 0 10px;
  line-height: 1.5;
  color: #999;
  margin: 40px 0;
}
.review-slide-blank .tit {
  color: #fff;
  font-size: 16px;
}

.review-popupname {
  font-size: 14px;
  font-weight: 700;
  color: #999;
  padding-bottom: 5px;
}

.review-list-contents {
  min-height: -moz-fit-content !important;
  min-height: fit-content !important;
}

.review-title p {
  font-size: 24px;
  font-weight: 600;
}

.review-contents {
  width: 380px !important;
  height: auto;
  min-height: 450px;
  max-height: 550px;
  border-radius: 5px;
  background: #121212;
  padding: 16px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
  border: 1px solid #2c2c2c;
  border-radius: 8px;
}
.review-contents.full-width {
  width: 100% !important;
}
@media screen and (max-width: 768px) {
  .review-contents {
    width: 330px !important;
  }
}
.review-contents ul.review-list-data {
  display: flex;
  flex-direction: column;
  row-gap: 14px;
}
.review-contents ul.review-list-data .profile-wrap {
  display: flex;
  align-items: center;
  gap: 4px;
}
.review-contents ul.review-list-data li button.review-store-title {
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  color: #fff;
  margin-top: 8px;
  width: -moz-fit-content;
  width: fit-content;
  min-width: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.review-contents ul.review-list-data li button.review-store-title img {
  width: 16px;
  height: 16px;
  margin-right: 4px;
}
.review-contents ul.review-list-data li button.review-store-title.active {
  border-color: #f0002e;
  color: #f0002e;
}
.review-contents ul.review-list-data li button.review-store-title:hover {
  background: #363636;
}
.review-contents ul.review-list-data li.review-image-wrap {
  justify-content: space-between;
  align-items: flex-end;
}
.review-contents ul.review-list-data li:last-child {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
}
.review-contents ul.review-list-data li ul.review-image {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 5px;
}
.review-contents ul.review-list-data li ul.review-image li {
  width: 85px;
  height: 110px;
}
.review-contents ul.review-list-data li ul.review-image img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  object-fit: cover;
  border-radius: 12px;
}
.review-contents ul.review-list-data li ul.review-image .more-image {
  position: relative;
  cursor: pointer;
}
.review-contents ul.review-list-data li img {
  display: block;
  width: 32px;
  height: 32px;
}
.review-contents ul.review-list-data li p {
  color: #fff;
}
.review-contents ul.review-list-data li p.comment {
  color: #fff;
}
.review-contents ul.review-list-data li span {
  font-size: 14px;
  color: #fff;
}
.review-contents ul.review-list-data li span div span {
  color: #f0002e;
}
.review-contents ul.review-list-data li button {
  height: 32px;
  border: 1px solid #767676;
  border-radius: 5px;
  padding: 0 12px;
  font-size: 13px;
  background: none;
  color: #fff;
  transition: all 0.3s;
}
.review-contents ul.review-list-data li button.thumb-up {
  background: #f0002e;
  border: 1px solid #f0002e;
}
.review-contents ul.review-list-data li button.thumb-up p {
  color: #fff;
}
.review-contents ul.review-list-data li button.thumb-up p::after {
  background: url("/assets/img/common/thumb-up-white.svg") center center no-repeat;
}
.review-contents ul.review-list-data li button .thumb-wrap {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
}
.review-contents ul.review-list-data li button .thumb-wrap p {
  font-size: 12px;
  color: #999;
  padding-right: 5px;
  position: relative;
}
.review-contents ul.review-list-data li button .thumb-wrap p::after {
  content: " ";
  display: block;
  position: absolute;
  width: 12px;
  height: 11px;
  background: url("/assets/img/common/thumb-up.svg") center center no-repeat;
  background-size: contain;
  right: 0;
  top: 0;
}

.review-info span {
  font-size: 14px;
  color: #999;
}
.review-info > ul {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 20px 0;
}
.review-info > ul > li {
  width: 60%;
  display: flex;
  justify-content: center;
  flex: 1 1 auto;
}
.review-info > ul > li:first-child {
  width: 40%;
}
.review-info > ul > li > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.review-info > ul > li > div > div {
  color: #f0002e;
}
.review-info > ul > li > div > p {
  font-size: 14px;
  padding-top: 5px;
}
.review-info > ul > li ul li {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  padding-bottom: 5px;
}
.review-info > ul > li ul li span {
  display: block;
  padding-bottom: 10px;
}
.review-info > ul > li ul li p {
  padding-right: 5px;
  font-size: 12px;
}
.review-info > ul > li ul li progress {
  height: 5px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
}
.review-info > ul > li ul li progress::-webkit-progress-bar {
  background: #2c2c2c;
  border-radius: 10px;
}
.review-info > ul > li ul li progress::-webkit-progress-value {
  background: #f0002e;
  border-radius: 10px;
}

.review-image-area {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}

.review-image-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.review-image-list h3 {
  margin: 0;
}
.review-image-list h3 p {
  font-size: 14px;
  font-weight: 700;
  color: #999;
}
.review-image-list .review-image-item {
  border-radius: 5px;
  position: relative;
  overflow: hidden;
}
.review-image-list .review-image-item .img-wrap {
  width: 80px;
  height: 80px;
}
.review-image-list .review-image-item .img-wrap img {
  width: 100%;
  max-width: 100%;
  height: 100%;
  object-fit: cover;
}

.review-list {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  border-top: 1px solid #212121;
  padding: 20px 0;
}
.review-list h3 {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.review-list .review-image-area {
  cursor: pointer;
}
.review-list .more-overlay {
  background: rgba(0, 0, 0, 0.7);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
  color: #999;
  cursor: pointer;
}
.review-list .review-contents .comment {
  color: #fff;
}

.layer-popup {
  display: none;
  width: 100vw;
  max-width: 960px;
  height: 100vh;
  margin: 0 auto;
  padding: 0 0 70px;
  z-index: 101;
  position: fixed;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  background: #121212;
}
.layer-popup.shown {
  display: block;
}
.layer-popup.detail {
  z-index: 101;
}
.layer-popup header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 25px 20px 25px;
}
.layer-popup header p {
  width: 100%;
  text-align: center;
  position: relative;
}
.layer-popup header p button {
  position: absolute;
  right: 0;
  top: -10px;
}
.layer-popup header p button img {
  width: 24px;
}
.layer-popup header button {
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
}
.layer-popup article ul {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 25px 20px;
}
.layer-popup article ul li {
  font-size: 14px;
  flex: 1 1 auto;
}
.layer-popup article ul li:last-child {
  text-align: right;
}
.layer-popup article ul li p {
  width: 80%;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
}
.layer-popup article ul li button {
  min-width: 72px;
  height: 32px;
  font-size: 13px;
  border: 1px solid #767676;
  background: none;
  padding: 0 12px;
  border-radius: 5px;
  color: #fff;
}
.layer-popup .full-btn {
  display: block;
  width: 90%;
  margin: 0 auto;
  border-radius: 4px;
}
.layer-popup .full-btn:hover {
  background: #f0002e;
  border: 1px solid #f0002e;
}
.layer-popup .map-area-wrap,
.layer-popup .map-container {
  height: 70vh;
}
.layer-popup .map-area {
  width: 100%;
  height: 100%;
  min-height: 0;
  margin-top: 0;
}

.detail-review-image {
  width: 100%;
  height: 300px;
}
.detail-review-image div {
  display: block;
  width: 100%;
  height: 100%;
}
.detail-review-image .slide-content {
  aspect-ratio: 0;
}
.detail-review-image .slick-list .slick-track {
  display: flex !important;
  column-gap: 0;
  margin-left: 0;
  gap: 8px;
}
.detail-review-image .slide-img-wrap {
  width: 100%;
  overflow: hidden;
}
.detail-review-image .slide-img-wrap img {
  width: 100%;
  height: 100%;
  border-radius: 5px;
  object-fit: cover;
}

.layer-review-inner {
  width: 100%;
  scroll-behavior: smooth;
  max-height: 90%;
  height: 90vh;
  overflow-y: auto;
  padding: 35px 0;
}
.layer-review-inner li.layer-review-profile {
  width: 100%;
}
.layer-review-inner::-webkit-scrollbar {
  display: none;
}
.layer-review-inner div.profile-wrap {
  display: flex !important;
  gap: 17px;
  align-items: center;
}
.layer-review-inner div.profile-wrap .name {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 14px;
}
.layer-review-inner div.profile-wrap p {
  display: flex;
  gap: 17px;
  align-items: center;
  flex: 1 1;
}
.layer-review-inner div.profile-wrap img {
  width: 24px;
  height: 24px;
}
.layer-review-inner > p {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 0 20px 10px;
  font-weight: 700;
}
.layer-review-inner > p span {
  font-size: 14px;
  color: #999;
  font-weight: 600;
}
.layer-review-inner .name-wrap {
  width: 100%;
  text-align: left;
}
.layer-review-inner .name-wrap .brand-name {
  display: block;
  font-size: 14px;
  color: #999;
  font-weight: 600;
  margin-bottom: 4px;
}
.layer-review-inner .name-wrap .store-name {
  display: block;
  font-size: 16px;
  color: #fff;
  font-weight: 700;
}
.layer-review-inner .review-contents {
  height: auto;
  margin: 0 20px;
}
.layer-review-inner .review-contents ul li:last-child {
  text-align: left;
}
.layer-review-inner .review-contents ul li div {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.layer-review-inner .review-contents ul li p.comment {
  font-size: 14px;
  color: #fff;
  display: block;
  text-overflow: initial;
}
.layer-review-inner .review-contents ul li button.notify {
  min-width: 50px;
  height: 24px;
  padding: 0 8px;
  font-size: 12px;
  border: 0;
  color: #999;
}
.layer-review-inner .review-contents-layer {
  background: none;
  padding: 0 20px;
  margin: 0;
}
.layer-review-inner .review-contents-layer ul.review-content-detail {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.layer-review-inner .review-contents-layer li {
  justify-content: space-between;
}
.layer-review-inner .review-contents-layer li:last-child {
  justify-content: flex-end;
}
.layer-review-inner .review-contents-layer li .comment {
  white-space: pre-wrap;
}
.layer-review-inner .review-file-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.layer-review-inner .review-file-wrap p {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  columns: #767676;
}
.layer-review-inner .review-file-wrap p img {
  vertical-align: sub;
  margin-right: 8px;
}
.layer-review-inner .review-file-wrap textarea {
  background: #2c2c2c;
  color: #fff;
  border: 1px solid #2c2c2c;
  border-radius: 8px;
  min-height: 300px;
}
.layer-review-inner .review-file-wrap textarea::-webkit-scrollbar {
  display: none;
}
.layer-review-inner .review-file-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.layer-review-inner .review-file-wrap p {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  columns: #767676;
}
.layer-review-inner .review-file-wrap p img {
  vertical-align: sub;
  margin-right: 8px;
}
.layer-review-inner .review-file-wrap textarea {
  background: #2c2c2c;
  color: #fff;
  border: 1px solid #2c2c2c;
  border-radius: 8px;
  min-height: 300px;
}
.layer-review-inner .review-file-wrap textarea::-webkit-scrollbar {
  display: none;
}
.layer-review-inner .file-upload-content {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-gap: 10px;
  gap: 10px;
}
@media (max-width: 1024px) {
  .layer-review-inner .file-upload-content {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media (max-width: 768px) {
  .layer-review-inner .file-upload-content {
    grid-template-columns: repeat(3, 1fr);
  }
}
.layer-review-inner .review-done-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}
.layer-review-inner .review-done-wrap .popupbanner-wrap header {
  padding: 0;
}
.layer-review-inner .review-done-wrap .popupbanner-wrap .popupbanner-tit p {
  font-size: 27px;
}
.layer-review-inner .review-done-wrap .popupbanner-wrap .popupbanner-list-info p {
  font-size: 14px;
}
.layer-review-inner .review-done-wrap .popupbanner-wrap .moreview a {
  color: #767676;
}
.layer-review-inner .review-done-wrap .popupbanner-inner {
  padding: 0;
}
.layer-review-inner .review-done-wrap h1 {
  text-align: center;
}
.layer-review-inner .review-done-wrap p {
  color: #f5f5f7;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
}
.layer-review-inner .review-done-wrap span {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
}
.layer-review-inner .review-done-wrap .review-done-detail {
  width: 100%;
  background: #212121;
  border-radius: 8px;
}
.layer-review-inner .review-done-wrap .review-done-detail .review-done-profile {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
}
.layer-review-inner .review-done-wrap .review-done-detail .profile-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}
.layer-review-inner .review-done-wrap .review-done-detail .profile-wrap img {
  width: 32px;
  height: 32px;
}
.layer-review-inner .review-done-wrap .review-done-detail .review-done-title {
  border-radius: 4px;
  color: #767676;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  display: block;
  margin-top: 5px;
}
.layer-review-inner .review-done-wrap .review-done-detail .review-done-date {
  color: #767676;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}
.layer-review-inner .review-done-wrap .review-done-detail .review-done-keyword ul {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.layer-review-inner .review-done-wrap .review-done-detail .review-done-item {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 15px;
  background: #212121;
  padding-bottom: 30px;
}
.layer-review-inner .review-done-wrap .review-done-detail .review-done-comment {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  white-space: pre-wrap;
}
.layer-review-inner .review-done-wrap .review-done-detail .review-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.layer-review-inner .popup-input-file-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.layer-review-inner .popup-input-file-wrap p {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  color: #767676;
}
.layer-review-inner .popup-input-file-wrap .file-upload-content {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
}
@media (max-width: 1024px) {
  .layer-review-inner .popup-input-file-wrap .file-upload-content {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media (max-width: 768px) {
  .layer-review-inner .popup-input-file-wrap .file-upload-content {
    grid-template-columns: repeat(3, 1fr);
  }
}
.layer-review-inner .popup-input-file-wrap label {
  width: 100%;
  height: auto;
  aspect-ratio: 3/4;
  font-size: 14px;
  margin-bottom: 0;
  vertical-align: middle;
  text-align: center;
  border: 1px dashed #fff;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
  position: relative;
  box-sizing: border-box;
  padding: 0px;
  background: #121212;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.layer-review-inner .popup-input-file-wrap label:hover {
  background: #121212;
}
.layer-review-inner .popup-input-file-wrap label span {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 6px;
  height: 100%;
  width: 100%;
  color: #fff;
}
.layer-review-inner .popup-input-file-wrap label input[type=file]#p_image_upload {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
}
.layer-review-inner .popup-input-file-wrap .p_input_info_text {
  font-size: 12px;
  font-weight: 600;
  color: #999;
}
.layer-review-inner .popup-input-file-wrap .p_input_info_text span {
  display: block;
}
.layer-review-inner .popup-input-file-wrap .popup-input-thumbnail-wrap {
  margin-top: 10px;
}
.layer-review-inner .popup-input-file-wrap .popup-input-thumbnail-wrap li {
  width: 82px;
  height: 110px;
  border-radius: 12px;
  overflow: hidden;
}
.layer-review-inner .popup-input-file-wrap .popup-input-thumbnail-wrap img {
  width: 100%;
  height: 100%;
}
.layer-review-inner .review-btn {
  background: #f0002e;
  border-color: #f0002e;
}
.layer-review-inner .popup-input-file-wrap {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.layer-review-inner .popup-input-file-wrap p {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  color: #767676;
}
.layer-review-inner .popup-input-file-wrap .file-upload-content {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-gap: 10px;
  gap: 10px;
}
@media (max-width: 1024px) {
  .layer-review-inner .popup-input-file-wrap .file-upload-content {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media (max-width: 530px) {
  .layer-review-inner .popup-input-file-wrap .file-upload-content {
    grid-template-columns: repeat(3, 1fr);
  }
}
.layer-review-inner .popup-input-file-wrap label {
  width: 100%;
  height: auto;
  aspect-ratio: 3/4;
  font-size: 14px;
  margin-bottom: 0;
  vertical-align: middle;
  text-align: center;
  border: 1px dashed #fff;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.2s;
  position: relative;
  box-sizing: border-box;
  padding: 0px;
  background: #121212;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.layer-review-inner .popup-input-file-wrap label:hover {
  background: #121212;
}
.layer-review-inner .popup-input-file-wrap label span {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 6px;
  height: 100%;
  width: 100%;
  color: #fff;
}
.layer-review-inner .popup-input-file-wrap label input[type=file]#p_image_upload {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
}
.layer-review-inner .popup-input-file-wrap .p_input_info_text {
  font-size: 12px;
  font-weight: 600;
  padding-bottom: 6px;
  color: #999;
}
.layer-review-inner .popup-input-file-wrap .popup-input-thumbnail-wrap {
  margin-top: 10px;
}
.layer-review-inner .popup-input-file-wrap .popup-input-thumbnail-wrap li {
  width: 82px;
  height: 110px;
  border-radius: 12px;
  overflow: hidden;
}
.layer-review-inner .popup-input-file-wrap .popup-input-thumbnail-wrap img {
  width: 100%;
  height: 100%;
}
.layer-review-inner .review-btn {
  background: #f0002e;
  border-color: #f0002e;
}

.review-mood-wrap {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.review-mood-input-wrap input[type=text] {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  padding: 12px 0 12px 0px;
}
.review-mood-input-wrap p.info {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  color: #767676;
  margin-top: 18px;
}
.review-mood-input-wrap ul {
  display: flex;
  flex-direction: column;
}
.review-mood-input-wrap ul > li {
  display: flex;
  align-items: center;
  gap: 16px;
  border-bottom: 1px solid #2c2c2c;
}
.review-mood-input-wrap ul > li span {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  color: #767676;
}

.guest-access-inner div .close-btn {
  border: none;
  font-weight: 400;
  color: #999;
  text-decoration: underline;
}

.layer-review-inner-write {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0 20px;
  row-gap: 40px;
}
.layer-review-inner-write span.caution-text {
  text-align: left;
  font-size: 12px;
  line-height: 18px;
  color: #f0002e;
  font-weight: 700;
  word-break: keep-all;
}
.layer-review-inner-write .drag-star {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  column-gap: 5px;
  cursor: pointer;
}
.layer-review-inner-write textarea {
  display: block;
  width: 100%;
  background: transparent;
  border: 1px solid #767676;
  color: #fff;
  font-size: 14px;
  border-radius: 5px;
  margin-top: 0.5rem;
  box-sizing: border-box;
}
.layer-review-inner-write button {
  width: 100%;
  height: 48px;
  padding: 0 20px;
  border: none;
  border-radius: 5px;
  font-size: 15px;
  color: #fff;
  background: none;
}

.review-write-list-wrap {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.thumbsup-wrap p.thumbsup {
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  text-align: left;
  margin-bottom: 24px;
}
.thumbsup-wrap span.thumbsup-desc {
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
  display: block;
  text-align: center;
}
.thumbsup-wrap span.thumbs-label {
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  display: block;
  text-align: center;
}
.thumbsup-wrap .thumbs-control {
  display: flex;
  justify-content: center;
  justify-content: space-around;
  gap: 16px;
}
.thumbsup-wrap .thumbs-control img {
  display: block;
  margin: 0 auto;
  margin-bottom: 11px;
}
.thumbsup-wrap .thumbs-control button {
  width: 100px;
  padding: 0;
}
.thumbsup-wrap .thumbs-control button:hover {
  background: transparent;
  border: none;
}
.thumbsup-wrap ul {
  display: flex;
  flex-direction: column;
  gap: 26px;
}
.thumbsup-wrap li {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.thumbsup-wrap li .tit {
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-weight: 400;
}
.thumbsup-wrap li .review-write-standard-wrap {
  width: 150px;
  margin: 0 auto;
  font-size: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.review-write-list-title {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.review-write-list-title span {
  font-size: 14px;
  color: #fff;
  line-height: 1.2rem;
  display: block;
}
.review-write-list-title p {
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
}

.review-write-list-wrap {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.thumbsup-wrap p.thumbsup {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  text-align: left;
  margin-bottom: 24px;
}
.thumbsup-wrap span.thumbsup-desc {
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
  display: block;
  text-align: center;
}
.thumbsup-wrap span.thumbs-label {
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  display: block;
  text-align: center;
  line-height: 1.5;
}
.thumbsup-wrap .thumbs-control {
  display: flex;
  justify-content: center;
  justify-content: space-around;
  gap: 16px;
}
.thumbsup-wrap .thumbs-control img {
  display: block;
  margin: 0 auto;
  margin-bottom: 11px;
}
.thumbsup-wrap .thumbs-control button {
  width: 100px;
  padding: 0;
}
.thumbsup-wrap .thumbs-control button:hover {
  background: transparent;
  border: none;
}
.thumbsup-wrap ul {
  display: flex;
  flex-direction: column;
  gap: 26px;
}
.thumbsup-wrap li {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.thumbsup-wrap li .tit {
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-weight: 400;
}
.thumbsup-wrap li .review-write-standard-wrap {
  width: 150px;
  margin: 0 auto;
  font-size: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.review-write-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
}
.review-write-item p.thumbsup {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  text-align: left;
  margin-bottom: 8px;
}
.review-write-item span.thumbsup-desc {
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 18px;
  display: block;
  text-align: left;
  color: #86868b;
}
.review-write-item span {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}
.review-write-item ul.keyword-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
@media (max-width: 768px) {
  .review-write-item ul.keyword-list {
    height: 30vh;
    overflow-y: auto;
  }
}
.review-write-item ul.keyword-list li {
  border-radius: 8px;
  line-height: 1.5rem;
  font-size: 14px;
}
.review-write-item ul.keyword-list li button {
  height: auto;
  padding: 4px 10px;
  background: #363636;
  border: 1px solid #363636;
  transition: all 0.3s ease;
  text-align: left;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
}
.review-write-item ul.keyword-list li button.active {
  background: #6b6b6b;
  border-color: #fff;
  color: #fff;
}
.review-write-item ul.keyword-list li button:hover {
  background: #6b6b6b;
  border-color: #fff;
  box-sizing: border-box;
}

.review-list-data-profile {
  background: #212121;
  border: 1px solid #2c2c2c;
  display: flex;
  flex-direction: column;
  border-radius: 10px;
  padding: 15px;
}

.review-done-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  width: 100%;
}
.review-done-wrap h1 {
  text-align: center;
}
.review-done-wrap p {
  color: #f5f5f7;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
}
.review-done-wrap span {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
}
.review-done-wrap .review-done-detail {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.review-done-wrap .review-done-detail .review-done-item-top {
  background-color: #313131;
  padding: 15px;
  border-radius: 10px;
}
.review-done-wrap .review-done-detail .review-done-item-top .thumbs-control button {
  width: -moz-fit-content;
  width: fit-content;
}
.review-done-wrap .review-done-detail .review-done-profile {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
}
.review-done-wrap .review-done-detail .profile-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}
.review-done-wrap .review-done-detail .profile-wrap img {
  width: 32px;
  height: 32px;
}
.review-done-wrap .review-done-detail .review-done-title {
  border-radius: 4px;
  color: #767676;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  display: block;
  margin-top: 5px;
}
.review-done-wrap .review-done-detail .review-done-date {
  color: #767676;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}
.review-done-wrap .review-done-detail .review-done-keyword-edit {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.review-done-wrap .review-done-detail .review-keyword-edit-btn {
  color: #878787;
  font-size: 14px;
  text-align: right;
  transition: all 0.3s;
}
.review-done-wrap .review-done-detail .review-keyword-edit-btn:hover {
  color: #fff;
  background: transparent;
}
.review-done-wrap .review-done-detail .keyword-edit-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.review-done-wrap .review-done-detail .keyword-edit-modal-header h2 {
  font-size: 20px;
}
.review-done-wrap .review-done-detail .review-done-keyword ul {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  color: #fff;
}
.review-done-wrap .review-done-detail .review-member-list {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.review-done-wrap .review-done-detail .review-done-item {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 15px;
  background: #212121;
  border-radius: 10px;
}
.review-done-wrap .review-done-detail .review-done-item .file-upload-content {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-gap: 10px;
  gap: 10px;
}
@media (max-width: 1024px) {
  .review-done-wrap .review-done-detail .review-done-item .file-upload-content {
    grid-template-columns: repeat(8, 1fr);
  }
}
@media (max-width: 768px) {
  .review-done-wrap .review-done-detail .review-done-item .file-upload-content {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media (max-width: 480px) {
  .review-done-wrap .review-done-detail .review-done-item .file-upload-content {
    grid-template-columns: repeat(3, 1fr);
  }
  .review-done-wrap .review-done-detail .review-done-item .file-upload-content label {
    width: 100%;
  }
}
.review-done-wrap .review-done-detail .review-done-item label {
  width: 100%;
  height: 130px;
  font-size: 14px;
  margin-bottom: 0;
  vertical-align: middle;
  text-align: center;
  border: 1px dashed #666;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.2s;
  position: relative;
  box-sizing: border-box;
  padding: 0px;
  background: #121212;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.review-done-wrap .review-done-detail .review-done-item label:hover {
  background: #121212;
}
.review-done-wrap .review-done-detail .review-done-item label span {
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 6px;
  height: 100%;
  width: 100%;
  color: #fff;
}
.review-done-wrap .review-done-detail .review-done-item label input[type=file]#p_image_upload {
  position: absolute;
  width: 0;
  height: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
}
.review-done-wrap .review-done-detail .review-done-comment {
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  white-space: pre-wrap;
}
.review-done-wrap .review-done-detail .review-edit-btn {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}
.review-done-wrap .review-done-detail .review-edit-btn button {
  color: #d9d9d9;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.review-done-wrap .review-done-detail .review-edit-btn button img {
  width: 16px;
  height: 16px;
}
.review-done-wrap .review-done-detail .review-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pagination-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
}
.pagination-wrap button {
  color: #fff;
}
.pagination-wrap button.active {
  color: #f0002e;
  font-weight: 700;
}

.layer-page {
  width: 100%;
  max-width: 960px;
  padding: 40px 20px 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.layer-page a {
  display: flex;
  align-items: center;
  column-gap: 5px;
}
.layer-page a:hover {
  font-weight: 700;
}
.layer-page a img {
  vertical-align: middle;
}

.notify-list {
  padding: 10px 20px 0;
}
.notify-list li {
  padding-bottom: 20px;
}
.notify-list li input[type=radio] {
  margin-right: 5px;
}
.notify-list li label {
  cursor: pointer;
}
.notify-list li textarea {
  width: 95%;
  max-width: 900px;
  margin-top: 12px;
  background: #2c2c2c;
  border: none;
  color: #fff;
  position: relative;
}
.notify-list li.count-txt-wrap {
  position: relative;
  padding-bottom: 10px;
}
.notify-list li .count-txt {
  position: absolute;
  bottom: 35px;
  right: 5%;
  font-size: 14px;
  color: #999;
}
.notify-list li span {
  font-size: 12px;
}
.notify-list li button {
  width: 100%;
  height: 48px;
  padding: 0 20px;
  font-size: 15px;
  border: 1px solid #767676;
  background: none;
  color: #fff;
  border-radius: 5px;
}

.layer-review-image-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
.layer-review-image-list li {
  width: 32%;
  height: 350px;
}
.layer-review-image-list li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 768px) {
  .layer-review-image-list {
    gap: 0.2rem;
  }
  .layer-review-image-list li {
    height: 200px;
  }
}

.layer-edit-inner {
  width: 100%;
  max-height: 500px;
  padding: 20px 16px 35px;
  border-top: 1px solid #212121;
  overflow-y: auto;
}
.layer-edit-inner::-webkit-scrollbar {
  display: none;
}
.layer-edit-inner > p {
  font-size: 14px;
  text-align: center;
  line-height: 1.5;
}
.layer-edit-inner > p.warning {
  font-weight: 600;
  color: #f0002e;
}
.layer-edit-inner form {
  max-width: 600px;
  margin: 20px auto;
}
.layer-edit-inner form > div {
  width: 90%;
  margin: 0 auto 10px;
}
.layer-edit-inner form div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.layer-edit-inner form div span {
  display: none;
  font-size: 14px;
  color: #999;
}
.layer-edit-inner form div span.show {
  display: block;
}
.layer-edit-inner form div div {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  column-gap: 8px;
}
.layer-edit-inner form div div input {
  border: 1px solid #fff;
  margin: 0;
  flex: 1 0 auto;
}
.layer-edit-inner form div div button {
  height: 44px;
  border-radius: 0;
  background: #f0002e;
  border: 1px solid #f0002e;
  padding: 0 8px;
  flex: 1 0 auto;
}
.layer-edit-inner form div div button:hover {
  border: 1px solid #fff;
  font-weight: 600;
}
.layer-edit-inner form span {
  display: block;
  width: 90%;
  margin: 0 auto 20px;
  font-size: 14px;
}
.layer-edit-inner .full-btn {
  display: block;
  width: 90%;
  margin: 0 auto;
  transition: all 0.3s;
  border-radius: 4px;
}
.layer-edit-inner .full-btn:hover {
  background: #f0002e;
  border: 1px solid #f0002e;
}

.layer-popup-white {
  background: #fff;
  color: #121212;
}

.share-popup {
  display: none;
  width: 90%;
  max-width: 350px;
  padding: 10px 10px 40px;
  font-size: 14px;
  border-radius: 10px;
}
.share-popup.show {
  display: block;
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
.share-popup .header {
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  padding: 10px 0;
  border-bottom: 1px solid #212121;
  position: relative;
}
.share-popup .header button {
  position: absolute;
  right: 0;
  bottom: 10px;
  cursor: pointer;
}
.share-popup .share-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  column-gap: 32px;
  padding: 26px 0;
}
.share-popup .share-wrap div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 4px;
  cursor: pointer;
}
.share-popup .share-wrap img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  filter: invert(1);
}
.share-popup .link-wrap {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.share-popup .link-wrap button {
  height: 44px;
  background: #f0002e;
  color: #fff;
  padding: 10px;
  border: 1px solid #f0002e;
  cursor: pointer;
}
.share-popup input {
  height: 44px;
  border: 1px solid #212121;
  color: #121212;
  border-right: 0;
  margin: 0;
  box-sizing: border-box;
}
.share-popup input:hover {
  background: none;
}

.cancel-popup {
  display: none;
  width: 90%;
  max-width: 350px;
  padding: 10px 10px 30px;
  font-size: 14px;
  border-radius: 10px;
}
.cancel-popup.show {
  display: block;
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  padding: 30px;
}
.cancel-popup .txt-wrap {
  margin-bottom: 20px;
  line-height: 1.25;
}
.cancel-popup p {
  text-align: center;
}
.cancel-popup .btn-wrap {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  column-gap: 8px;
}
.cancel-popup .btn-wrap button {
  background: #212121;
  color: #fff;
  padding: 10px;
  border-radius: 5px;
  border: 1px solid transparent;
  width: 100%;
}
.cancel-popup .btn-wrap button:first-child {
  background: #f0002e;
}

.layer-exit-popup-inner {
  font-size: 14px;
  padding: 1rem 1.5rem;
  line-height: 1.5;
}
.layer-exit-popup-inner label {
  display: block;
  margin: 1.5rem 0;
}
.layer-exit-popup-inner button {
  margin: 1.5rem auto;
}

.map-container {
  width: 100%;
  height: 100%;
  position: relative;
}

.wheelLockButton {
  position: absolute;
  top: 40%;
  right: 10px;
  transform: translateY(-60%);
  z-index: 100;
  width: 30px;
  height: 30px;
  background: #fff;
  border: 1px solid #2c2c2c;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
}
.wheelLockButton.is-locked {
  background: #ddd;
}
.wheelLockButton .wheelLockButton-icon {
  position: static !important;
}
@media (max-width: 768px) {
  .wheelLockButton {
    top: 30%;
    right: 10px;
    transform: translateY(-50%);
  }
}

.map-area-wrap {
  width: 100%;
  height: 100%;
  position: relative;
}

.map-area {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  height: 100%;
  min-height: 410px;
  border-radius: 8px;
}

.map-info-layer {
  width: 90%;
  max-width: 480px;
  height: auto;
  padding: 16px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  box-shadow: 2px 5px 10px rgba(0, 0, 0, 0.2);
  color: #bababa;
  font-size: 12px;
  font-weight: 600;
  z-index: 100;
}
.map-info-layer-inner {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  column-gap: 12px;
}
.map-info-layer .thumbnail-wrap {
  width: 80px;
  min-width: 80px;
  height: 80px;
  min-height: 80px;
  background: #121212;
  border-radius: 0.3rem;
  overflow: hidden;
  background-size: cover;
  background-position: center center;
}
.map-info-layer .thumbnail-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0.3rem;
}
.map-info-layer .info-wrap {
  flex: 1 1;
}
.map-info-layer .info-wrap .brand-name {
  color: #767676;
}
.map-info-layer .info-wrap .popup-title {
  font-weight: 500;
  font-size: 14px;
  padding-bottom: 8px;
  color: #fff;
  line-height: 20px;
}
.map-info-layer .info-wrap .popup-date,
.map-info-layer .info-wrap .popup-address {
  text-align: left;
  padding-top: 0;
  font-weight: 500;
  font-size: 12px;
  line-height: 18px;
}

.naver-marker-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  justify-content: center;
  align-items: center;
  column-gap: 3px;
  transform: translate(-50%, 0%);
}
.naver-marker-wrap .naver-container-img {
  width: 28px;
  height: 28px;
}
.naver-marker-wrap img {
  object-fit: cover;
}

.naver-marker-popup-name {
  width: 130px;
  word-break: keep-all;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 4px 5px;
  border-radius: 4px;
  color: white;
  background: rgba(18, 18, 18, 0.45);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  border: 0.5px solid #eaeaea;
  letter-spacing: -0.12px;
  line-height: 18px;
  transition: all 0.3s;
}
.naver-marker-popup-name-selected {
  background: #f8f9fa;
  color: #121212;
  border: 0.5px solid #f8f9fa;
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

.naver-marker-popup-name:hover {
  background: #f8f9fa;
  color: #121212;
  border: 0.5px solid #f8f9fa;
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

.naver-marker-custom-arrow {
  position: absolute;
  left: 50%;
  bottom: -22px;
  transform: translateX(-50%);
  width: 36px;
  height: 24px;
  overflow: hidden;
}

.naver-marker-custom-arrow::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -6px;
  transform: translateX(-50%) rotate(45deg);
  width: 16px;
  height: 16px;
  background: white;
  border-radius: 4px;
}

.map-marker-container img {
  width: 80%;
}

.naver-container {
  color: #121212;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  border-radius: 6px;
  border: 2px solid #f0002e;
  background: #fff;
  box-shadow: 1px 2px 8px rgba(0, 0, 0, 0.3);
  letter-spacing: -0.5px;
}
.naver-container.img-container {
  width: 48px;
  height: 48px;
  position: relative;
  border: 2px solid #f0002e;
}
.naver-container.img-container::after {
  bottom: -7px;
  left: calc(50% - 5px);
}
.naver-container::after {
  content: " ";
  position: absolute;
  bottom: -3px;
  left: calc(50% - 3px);
  height: 0;
  z-index: -1;
  border-bottom: 5px solid;
  border-left: 5px solid rgba(0, 0, 0, 0);
  border-right: 5px solid rgba(0, 0, 0, 0);
  color: #f0002e;
  transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
  -moz-transform: rotate(-180deg);
  -o-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
}
.naver-container img {
  width: 100%;
  height: 100%;
  border-radius: 6px;
  object-fit: cover;
  position: absolute;
  image-rendering: -webkit-optimize-contrast;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.naver-container span {
  display: block;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  padding: 10px 8px 8px;
  box-sizing: border-box;
}

.magazine-list-header {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  padding: 0 16px;
}
.magazine-list-header ul {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 40px;
  border-bottom: 1px solid #2c2c2c;
}
.magazine-list-header ul li {
  width: 192px;
  text-align: center;
  box-sizing: border-box;
  border-bottom: 1px solid transparent;
}
.magazine-list-header ul li.select {
  border-bottom: 1px solid #f0002e;
}
.magazine-list-header ul li.select button {
  color: #f0002e;
}
.magazine-list-header ul button {
  padding: 8px 0;
  width: 100%;
  color: #fff;
  font-weight: 700;
  line-height: 150%;
  letter-spacing: -0.16px;
  font-size: 16px;
}

.magazine-list-wrap {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}
.magazine-list-wrap > ul {
  display: grid;
  grid-auto-rows: 1px;
  justify-items: center;
  grid-template-columns: repeat(auto-fill, 50%);
  padding: 0 16px;
}
.magazine-list-wrap > ul > li {
  width: calc(100% - 10px);
  height: 272px;
  grid-row-end: span 282;
  position: relative;
  overflow: hidden;
}
.magazine-list-wrap > ul > li.is-large {
  height: initial;
  grid-row-end: span 330;
}
.magazine-list-wrap > ul > li.is-large::before {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.magazine-list-wrap > ul > li.is-large a {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
@media (max-width: 768px) {
  .magazine-list-wrap > ul > li.is-large {
    margin-bottom: 10px;
  }
  .magazine-list-wrap > ul > li.is-large .newsletter-thumbnail-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .magazine-list-wrap > ul > li.is-large .newsletter-thumbnail-wrap .newsletter-main-info {
    bottom: 1.5rem;
  }
  .magazine-list-wrap > ul > li.is-large .newsletter-thumbnail-wrap h2 {
    font-size: 18px;
  }
  .magazine-list-wrap > ul > li.is-large .newsletter-thumbnail-wrap h3 {
    font-size: 14px;
    position: absolute;
    z-index: 2;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 60%;
  }
}
@media (min-width: 767px) and (max-width: 960px) {
  .magazine-list-wrap > ul > li .newsletter-thumbnail-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .magazine-list-wrap > ul > li .newsletter-thumbnail-wrap h2 {
    font-size: 24px;
  }
  .magazine-list-wrap > ul > li .newsletter-thumbnail-wrap h3 {
    font-size: 18px;
    position: absolute;
    z-index: 2;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 65%;
  }
  .magazine-list-wrap > ul > li .newsletter-thumbnail-wrap img {
    width: 60%;
    margin: 0 auto;
  }
}
@media (max-width: 766px) {
  .magazine-list-wrap > ul > li .newsletter-thumbnail-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .magazine-list-wrap > ul > li .newsletter-thumbnail-wrap h2 {
    font-size: 18px;
  }
  .magazine-list-wrap > ul > li .newsletter-thumbnail-wrap .newsletter-main-info {
    bottom: 1.5rem;
  }
  .magazine-list-wrap > ul > li .newsletter-thumbnail-wrap h3 {
    font-size: 14px;
    position: absolute;
    z-index: 2;
    left: 50%;
    transform: translate(-50%, -50%);
    top: 62%;
  }
}
.magazine-list-wrap .magazine-thumbnail-wrap {
  width: 100%;
  height: 100%;
  position: relative;
}
.magazine-list-wrap .magazine-thumbnail-wrap::after {
  content: " ";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  background: #121212;
  opacity: 0.4;
  background-size: cover;
  left: 0;
  top: 0;
  transition: all 0.2s;
}
.magazine-list-wrap .magazine-thumbnail-wrap:hover::after {
  opacity: 0;
}
.magazine-list-wrap .magazine-thumbnail-wrap:hover .magazine-main-info {
  text-shadow: 0 0 10px #121212;
}
.magazine-list-wrap .magazine-thumbnail {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 100%;
  object-fit: cover;
}

.magazine-main-info {
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 1.5rem;
  padding: 0 20px;
  margin: 0;
  font-size: 18px;
  line-height: 1.5;
  text-align: left;
  font-weight: 700;
  word-break: keep-all;
  box-sizing: border-box;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  z-index: 2;
  transition: all 0.2s;
}
.magazine-main-info h2 {
  font-size: 18px;
  margin: 0;
}
.magazine-main-info h3 {
  font-size: 16px;
  margin: 0;
}

.newsletter-thumbnail-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.newsletter-main-info {
  position: absolute;
  left: 0;
  bottom: 3.5rem;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  z-index: 2;
  padding: 0 20px;
  text-align: center;
  width: 100%;
  overflow: hidden;
}
.newsletter-main-info h2 {
  font-size: 24px;
  margin: 0;
}

.newsletter-sub-title {
  font-size: 28px;
  margin: 0;
  position: absolute;
  z-index: 2;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 61%;
  color: #020a0f;
  font-family: "Cafe24Danjunghae";
}

.filter-tab {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.filter-tab li {
  width: 100%;
  text-align: center;
  border-bottom: 1px solid #2c2c2c;
  padding: 0px 5px 10px;
}
.filter-tab li.select {
  border-bottom: 2px solid #f0002e;
  color: #f0002e;
  font-weight: 700;
}

.magazine-search {
  width: 95%;
  margin: 20px auto 40px;
}
.magazine-search p {
  width: 100%;
  position: relative;
  box-sizing: border-box;
}
.magazine-search p a {
  display: block;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}
.magazine-search p a img {
  display: block;
  max-width: 100%;
  max-height: 48px;
}
.magazine-search input {
  width: 100%;
  border: 1px solid #fff;
  border-radius: 10em;
  color: #fff;
  font-size: 18px;
  padding: 10px 32px;
  box-sizing: border-box;
  margin: 0;
  line-height: 2;
}

.magazine-detail-header {
  width: 100%;
  height: auto;
  position: relative;
  margin-top: 100px;
  padding: 0 16px;
}
.magazine-detail-header h1 {
  margin: 0;
  font-size: 24px;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-height: 34px;
  padding: 10px 0;
  border-bottom: 4px solid #fff;
}
.magazine-detail-header h2 {
  font-size: 18px;
  color: #999;
  font-style: italic;
  text-decoration: underline;
  margin: 0;
}
.magazine-detail-header ul {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  column-gap: 3px;
  padding: 10px;
}
.magazine-detail-header ul span {
  color: #999;
  font-size: 14px;
}

.magazine-detail-text-wrap {
  margin-top: 30px;
  font-size: 14px;
  color: #999;
  line-height: 1.5;
  text-align: center;
  padding-bottom: 80px;
  position: relative;
}
.magazine-detail-text-wrap p {
  text-align: left;
  word-break: keep-all;
  line-height: 1.5;
  font-size: 16px;
  color: #fff;
  padding-bottom: 20px;
}
.magazine-detail-text-wrap .big-text {
  font-size: 24px;
  font-weight: 700;
}
.magazine-detail-text-wrap .caption {
  font-size: 12px;
  margin-top: -10px;
  margin-bottom: 8px;
  color: #767676;
  text-align: center;
}
.magazine-detail-text-wrap img {
  width: 480px;
  max-width: 100%;
  margin: 20px auto;
}
.magazine-detail-text-wrap .magazine-detail-dimmed-area {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(18, 18, 18, 0) 0%, rgba(18, 18, 18, 0.5) 30%, rgb(18, 18, 18) 50%, rgb(18, 18, 18) 100%);
  z-index: 1;
}
.magazine-detail-text-wrap .magazine-detail-dimmed-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
.magazine-detail-text-wrap .magazine-detail-dimmed-content p {
  font-size: 18px;
  color: #fff;
  text-align: center;
}
.magazine-detail-text-wrap .magazine-detail-dimmed-content button {
  background: #f0002e;
  color: #fff;
  font-size: 18px;
  padding: 12px 32px;
  border-radius: 8px;
}

.newsletter-detail-text-wrap p {
  color: #292929;
}

.magazine-detail-content {
  margin-bottom: 40px;
  padding: 0 16px;
}
.magazine-detail-content .slick-slider {
  margin-bottom: 10px;
}
.magazine-detail-content .popup-banner-dots {
  bottom: 10px;
}
.magazine-detail-content .popup-banner-dots li {
  height: 3px;
}
.magazine-detail-content p {
  max-width: 600px;
  margin: 0 auto;
  line-height: 1.8;
}
.magazine-detail-content p b,
.magazine-detail-content p strong {
  text-decoration: underline;
}
.magazine-detail-content .btn-wrap {
  display: flex;
  column-gap: 1rem;
  row-gap: 0.5rem;
  flex-wrap: wrap;
  max-width: 600px;
  margin: 0 auto;
  justify-content: center;
  align-items: center;
}
.magazine-detail-content-button {
  display: block;
  width: 100%;
  background: #fff;
  color: #121212;
  padding: 1rem 3rem;
  border-radius: 5px;
  font-size: 15px;
  font-weight: 700;
  transition: all 0.3s;
}
.magazine-detail-content-button:hover {
  background: #f0002e;
  color: #fff;
}

.magazine-preview-content {
  max-width: 600px;
  margin: 1rem auto;
  padding: 1.5rem 2rem;
}
.magazine-preview-content .magazine-preview-content-title {
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 0.5rem;
  border-bottom: 2px solid #767676;
}
.magazine-preview-content p {
  padding: 0.25rem;
  line-height: 1.5;
}

.magazine-detail-bottom {
  padding-bottom: 180px;
  color: #999;
  border-top: 2px solid #2c2c2c;
  padding: 20px 16px 0;
  text-align: center;
}
.magazine-detail-bottom .toList {
  text-indent: -9999px;
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
}
.magazine-detail-bottom .toList a {
  display: block;
  text-indent: -9999px;
  width: 60px;
  height: 40px;
  background: url("/assets/img/magazine/arrow.png") center center no-repeat;
}
.magazine-detail-bottom .title {
  padding: 8px 0;
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.5;
}
.magazine-detail-bottom div p {
  padding-bottom: 4px;
  font-size: 14px;
}
.magazine-detail-bottom .biz {
  margin: 40px auto;
  text-align: center;
  color: #fff;
}
.magazine-detail-bottom .biz a {
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  margin: 0 auto 8px;
  font-size: 18px;
  background: #f0002e;
  padding: 1rem 5rem;
  border-radius: 4px;
  font-weight: 700;
}
.magazine-detail-bottom img {
  width: 600px;
  max-width: 100%;
  margin: 20px 0;
}
.magazine-detail-bottom .slick-slider {
  padding: 0;
  max-width: 555px;
  margin: 0 auto;
}
.magazine-detail-bottom .more-contents {
  width: 100%;
  max-width: 960px;
  margin: 30px auto;
  padding: 30px 16px 100px;
  position: relative;
  z-index: 1;
}
.magazine-detail-bottom .more-contents::before {
  content: "";
  display: block;
  width: 100%;
  max-width: 100vw;
  min-width: 100vw;
  height: 400px;
  background: #212121;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  z-index: -1;
}
.magazine-detail-bottom .more-contents > p {
  font-size: 24px;
  font-weight: 700;
  text-align: left;
  color: #fff;
  margin-bottom: 10px;
}
.magazine-detail-bottom .more-contents > p span {
  color: #f0002e;
}
.magazine-detail-bottom .more-contents .slick-slider {
  width: 100%;
  max-width: 100%;
}
.magazine-detail-bottom .more-contents .more-contents-wrap {
  height: 272px;
  cursor: pointer;
}
.magazine-detail-bottom .more-contents .more-contents-wrap img {
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: cover;
}
.magazine-detail-bottom .more-contents .more-contents-wrap p {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  text-align: left;
  margin-top: 20px;
  padding: 0 10px 0 0;
}

.magazine-fix-bar {
  width: 100%;
  background: rgb(33, 33, 33);
  background: linear-gradient(0deg, rgb(33, 33, 33) 70%, rgb(44, 44, 44) 100%);
  position: fixed;
  bottom: 0;
  left: 0;
  padding-bottom: 65px;
  border-top: 2px solid #f0002e;
  z-index: 99;
  transition: all 0.5s;
}
.magazine-fix-bar.hide {
  bottom: -200px;
}
.magazine-fix-bar ul {
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.magazine-fix-bar ul li {
  width: 20%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  flex: 1 0 auto;
  padding: 10px 16px;
}
.magazine-fix-bar ul li span {
  padding-right: 5px;
}
.magazine-fix-bar ul li button {
  height: 22px;
  background: none;
  border: none;
  padding: 0;
  color: #fff;
  font-size: 13px;
  line-height: 20px;
  display: flex;
  align-items: flex-end;
  column-gap: 6px;
}
.magazine-fix-bar ul li button img {
  height: 22px;
}
.magazine-fix-bar ul li img {
  cursor: pointer;
}

.profile-img-area {
  width: 100%;
  height: auto;
}
.profile-img-area img {
  display: block;
  margin: 0 auto;
}

.profile-text-area {
  display: flex;
  width: 100%;
  margin: 10px auto 50px;
  padding: 0 20px;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 32px;
}
.profile-text-area li {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 8px;
}
.profile-text-area li div.profile-text-memberName {
  background: #2c2c2c;
  width: 100%;
  padding: 12px 0px;
  color: #999;
}
.profile-text-area li div.profile-text-memberName p {
  padding: 0 16px;
}
.profile-text-area li:first-child p {
  border-bottom: none;
}
.profile-text-area li.switch-wrap {
  padding: 10px 0 0;
  width: 100%;
}
.profile-text-area li.switch-wrap .marketing-wrap {
  width: 100%;
  list-style: disc;
}
.profile-text-area li.switch-wrap .switch-line-wrap {
  display: flex;
  gap: 24px;
}
.profile-text-area li.switch-wrap .view-more {
  text-decoration: underline;
  font-size: 12px;
  color: white;
}
.profile-text-area li.switch-wrap p {
  width: auto;
  font-size: 14px;
  border-bottom: 0;
  padding: 0;
  color: #767676;
}
.profile-text-area li span.subTitle {
  margin: 0;
  font-size: 10px;
  color: #fff;
  margin-left: 8px;
}
.profile-text-area li span {
  font-size: 12px;
  color: #999;
  margin-bottom: 4px;
}
.profile-text-area li p {
  width: 100%;
  padding: 12px 0px;
  border-bottom: 2px solid #fff;
  font-size: 14px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.profile-text-area li p.disabled {
  background: #2c2c2c;
  color: #767676;
  padding: 5px 0 8px;
}
.profile-text-area li p.switch-line {
  display: flex;
  align-items: center;
  justify-content: left;
  gap: 8px;
  line-height: 20px;
  margin-top: 8px;
}
.profile-text-area li p.switch-line span {
  margin-bottom: 0;
}
.profile-text-area li p.switch-line span.switch-title {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  color: #fff;
}
.profile-text-area li p img {
  display: block;
  width: 18px;
  height: 18px;
  object-fit: contain;
}
.profile-text-area li p button {
  border: 1px solid #767676;
  background: none;
  color: #fff;
  font-size: 15px;
  padding: 8px 20px;
  border-radius: 5px;
}
.profile-text-area li p button.edit-btn {
  font-size: 12px;
  padding: 6px 24px;
}
.profile-text-area li p button.push-alert-agree {
  background: #f0002e;
  border-color: #f0002e;
}
.profile-text-area li .modify-contact-area {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
}
.profile-text-area li .modify-contact-area .inner-container {
  width: 100%;
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.profile-text-area li .modify-contact-area .inner-container select {
  background-color: #000;
  color: #fff;
  margin-top: 10px;
}
.profile-text-area li .modify-contact-area .inner-container input {
  height: 30px;
  width: 200px;
  margin: 0;
}
@media (max-width: 550px) {
  .profile-text-area li .modify-contact-area .inner-container {
    gap: 5px;
  }
  .profile-text-area li .modify-contact-area .inner-container select {
    width: 120px;
  }
  .profile-text-area li .modify-contact-area .inner-container input {
    width: 100px;
    max-width: 100%;
  }
}
.profile-text-area li .modify-contact-area .inner-container .info-input-submit-area {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.profile-text-area li .modify-contact-area .inner-container .upper-area {
  display: flex;
  gap: 5px;
}
.profile-text-area li .modify-contact-area .inner-container .btns-container {
  display: flex;
  gap: 5px;
}
.profile-text-area li .modify-contact-area .inner-container .btns-container button {
  border: 1px solid #767676;
  background: none;
  color: #fff;
  font-size: 12px;
  padding: 4px 10px;
  border-radius: 5px;
  white-space: nowrap;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.4);
}
.profile-text-area li .modify-contact-area .inner-container .btns-container button.edit-btn {
  font-size: 12px;
  padding: 4px 10px;
}
.profile-text-area li .modify-contact-area .inner-container .btns-container button.push-alert-agree {
  background: #f0002e;
  border-color: #f0002e;
}
.profile-text-area li .modify-contact-area .inner-container .btns-container .save-btn {
  border: 2px solid #767676;
}
.profile-text-area li .kakao-icon {
  width: 24px;
  height: 24px;
}
.profile-text-area li .apple-icon {
  background-color: #fff;
  padding: 3px;
  border-radius: 50%;
}
.profile-text-area li .google-icon {
  width: 24px;
  height: 24px;
}

.warning-text span {
  color: #f0002e !important;
}

.switch_btn {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 20px;
}
.switch_btn input {
  opacity: 0;
  width: 0;
  height: 0;
}
.switch_btn .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #414141;
  border: 1px solid transparent;
  transition: 0.3s;
  border-radius: 20px;
}
.switch_btn .slider::before {
  content: " ";
  position: absolute;
  height: 14px;
  width: 14px;
  left: 2px;
  bottom: 2px;
  background: #000;
  transition: 0.3s;
  border-radius: 50%;
}
.switch_btn .slider::after {
  display: block;
  color: #121212;
  font-size: 12px;
  position: absolute;
  left: 24px;
  top: 2px;
  transition: none;
}

.switch_btn input:checked + .slider {
  background: #f0002e;
}

.switch_btn input:checked + .slider::before {
  transform: translateX(20px);
  background: #000;
}
.switch_btn input:checked + .slider::after {
  left: 10px;
  color: #fff;
}

.member-inner {
  width: 100%;
  padding: 0 20px;
  margin-bottom: 50px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.member-inner p {
  font-size: 0.75rem;
  color: #767676;
  margin-bottom: 8px;
}
.member-inner p img {
  vertical-align: bottom;
}
.member-inner button.accountCanclebutton {
  color: #fff;
  text-decoration: underline;
}
.member-inner button {
  font-size: 15px;
  color: #999;
  font-weight: 400;
  border: none;
  background: none;
}

.guest-access {
  width: 100%;
  max-width: 960px;
  height: 80vh;
  text-align: center;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
.guest-access-inner {
  width: 100%;
}
.guest-access-inner-box {
  padding: 20px;
  border-bottom: 1px solid #212121;
}
.guest-access-inner-box:last-child {
  border: none;
}
.guest-access-inner-social-box {
  padding: 20px;
}
.guest-access-inner-social-box:last-child {
  border: none;
}
.guest-access-inner-social-btn {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  column-gap: 45px;
  margin-top: 10px;
}
.guest-access-inner-social-kakao {
  width: 62px;
}
.guest-access p {
  padding: 10px 0;
}

.category-select {
  width: 100%;
  flex-direction: row !important;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  column-gap: 10px;
  row-gap: 10px;
}
.category-select button {
  width: -moz-fit-content;
  width: fit-content;
  border: 1px solid #2c2c2c;
  border-radius: 8px;
  background: #2c2c2c;
  color: #9f9f9f;
  padding: 6px 10px;
  white-space: nowrap;
  margin: 0 !important;
  line-height: 20px;
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  font-size: 13px;
}
.category-select button:hover {
  background: #2c2c2c;
  color: #fff;
}
.category-select button.picked {
  background: #f0002e;
  color: #fff;
  border-color: #f0002e;
  font-weight: 700;
}

.invite-card {
  border-radius: 16px;
  border: 1px solid #2c2c2c;
  padding: 28px;
  margin: 40px auto;
  color: #fff;
  font-family: sans-serif;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.invite-header h3 {
  font-size: 20px;
  margin-bottom: 6px;
}

.invite-header p {
  font-size: 14px;
  color: #aaa;
}

.invite-btn {
  width: 100%;
  padding: 14px;
  background: #ff1f3d;
  border: none;
  border-radius: 12px;
  font-weight: bold;
  font-size: 15px;
  color: #fff;
  cursor: pointer;
  transition: 0.3s ease;
}

.invite-btn:hover {
  background: #ff3b57;
}

.invite-count {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #222;
  padding-top: 18px;
  font-size: 14px;
  color: #aaa;
}

.invite-count strong {
  font-size: 20px;
  color: #ff1f3d;
}

.invite-link-section label {
  font-size: 13px;
  color: #aaa;
  display: block;
  margin-bottom: 8px;
}

.invite-link-box {
  display: flex;
  gap: 10px;
}
@media (max-width: 325px) {
  .invite-link-box {
    flex-direction: column;
  }
}

.invite-link-box input {
  flex: 1 1;
  background: #1a1a1a;
  border: 1px solid #333;
  border-radius: 10px;
  color: #777;
  margin-bottom: 0px;
  font-size: 14px;
}

.copy-btn {
  padding: 10px 18px;
  border-radius: 10px;
  border: 1px solid #444;
  background: #222;
  color: #fff;
  cursor: pointer;
  transition: 0.2s ease;
  white-space: pre;
  font-size: 14px;
}

.copy-btn:hover {
  background: #333;
  border-color: #fff;
}

article.member-review-list-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 60vh;
  max-width: 90vw;
  height: 100%;
}

.member-top-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (max-width: 768px) {
  .member-top-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
}

.member-review-sort-wrap {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 14px;
}
.member-review-sort-wrap li button {
  padding: 0;
}
.member-review-sort-wrap li:last-child {
  display: flex;
  align-items: center;
  gap: 4px;
}

#review-category {
  border: none;
  background: transparent;
  color: #fff;
  min-width: 55px;
}
#review-category option {
  background: black;
  color: #fff;
  padding: 3px;
  border: none;
}
#review-category option:hover {
  background: #f0002e !important;
}

.member-keyword-wrap {
  position: relative;
}
.member-keyword-wrap input[type=search] {
  border: 1px solid white;
  border-radius: 999px;
  width: 343px;
  min-height: 24px;
  padding: 0 20px;
}
.member-keyword-wrap .search-icon {
  position: absolute;
  right: 15px;
  top: 10px;
}

@media (max-width: 768px) {
  .member-keyword-wrap input[type=search] {
    width: 100%;
  }
  .member-top-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .member-keyword-wrap {
    width: 100%;
  }
}
.member-review-none {
  text-align: center;
  justify-content: center;
  display: flex;
  align-items: center !important;
  color: #999;
  min-height: 50vh;
  font-size: 14px;
}

.member-reviw-list-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: 100%;
}

.my-review-wrap {
  width: 100%;
  height: auto;
  position: relative;
  background: #2c2c2c;
  border-radius: 8px;
  padding: 15px 12px;
  margin-bottom: 10px;
}
.my-review-wrap > img {
  display: block;
  width: 14px;
  position: absolute;
  top: 10px;
  right: 10px;
}

.my-review-info {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  column-gap: 8px;
  font-size: 12px;
  color: #999;
  margin-bottom: 10px;
}
.my-review-info img {
  display: block;
  width: 32px;
  height: 32px;
  object-fit: cover;
}
.my-review-info span {
  font-size: 11px;
}

.my-review-text {
  font-size: 12px;
  line-height: 22px;
}

.pre-status {
  width: 100%;
  margin-top: 20px;
  padding: 0 16px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  column-gap: 16px;
  row-gap: 16px;
}
.pre-status li {
  padding: 8px 16px;
  border: 1px solid #2c2c2c;
  font-size: 12px;
  border-radius: 10em;
}

.pre-reservation-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 40px;
  padding: 0 16px;
  margin-top: 20px;
}

.no-reservation {
  height: 50vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
.no-reservation p {
  color: #f5f5f7;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
}

.pre-reservation-content {
  width: 100%;
  font-size: 14px;
  line-height: 1.5;
  border: 1px solid #2c2c2c;
  border-radius: 10px;
}
.pre-reservation-content-inner {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  column-gap: 14px;
  padding: 10px;
}
.pre-reservation-content-inner .right {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  word-break: keep-all;
}
.pre-reservation-content-inner .right .info-text {
  width: 98%;
  margin-right: 10px;
}
.pre-reservation-content-inner .right .info-text .flex-p {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  column-gap: 6px;
  margin-top: 18px;
}
.pre-reservation-content-inner .right .more-btn {
  width: 2%;
  padding: 3px 10px;
}
.pre-reservation-content-inner .pre-reservation-status {
  width: -moz-fit-content;
  width: fit-content;
  font-size: 12px;
  border: 1px solid #999;
  padding: 2px 10px;
  border-radius: 4px;
  margin-bottom: 4px;
}
.pre-reservation-content-inner .pre-reservation-status.enter-done, .pre-reservation-content-inner .pre-reservation-status.enter {
  border: 1px solid #fff;
}
.pre-reservation-content-inner .pre-reservation-status.cancel, .pre-reservation-content-inner .pre-reservation-status.enter-expired {
  border: 1px solid transparent;
  background: #2c2c2c;
  color: #999;
}
.pre-reservation-content-inner .pre-reservation-status.waiting {
  border: 1px solid #f0002e;
}
.pre-reservation-content .popupstore-name {
  padding: 0;
  font-weight: 700;
  margin-bottom: 4px;
}
.pre-reservation-content .thumbnail {
  width: 100px;
  min-width: 100px;
  height: 100px;
  min-height: 100px;
  object-fit: cover;
  border-radius: 10px;
}
.pre-reservation-content .reservation-link-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  text-align: center;
  background: #2c2c2c;
  padding: 8px 10px;
  box-sizing: border-box;
  border-radius: 0 0 10px 10px;
}
.pre-reservation-content .arrow {
  width: 14px;
  height: 12px;
  margin-left: 10px;
}
.pre-reservation-content .more-btn {
  cursor: pointer;
  position: relative;
}
.pre-reservation-content .more-menu {
  position: absolute;
  right: 0;
  background: #2c2c2c;
  border-radius: 8px;
  padding: 0 10px;
  z-index: 1;
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.4);
  display: none;
}
.pre-reservation-content .more-menu.visible {
  display: block;
}
.pre-reservation-content .more-menu button {
  min-width: 150px;
  padding: 10px 0;
  font-size: 12px;
  font-weight: 600;
  color: #fff;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  column-gap: 8px;
  cursor: pointer;
}
.pre-reservation-content .more-menu button:nth-child(2) {
  border-top: 1px solid #767676;
  border-bottom: 1px solid #767676;
}

.common-review-layer .subtitle {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  margin-bottom: 24px;
}
.common-review-layer > .layer-review-inner {
  height: 100% !important;
}

.calendar-review-wrap {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.review-popup-search-wrap {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #2c2c2c;
}
.review-popup-search-wrap input {
  border: none;
  width: 100%;
}

.MuiSvgIcon-root {
  fill: #fff !important;
  color: #fff !important;
}

.back-bg-wrap {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

.comment-list-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  border-radius: 16px;
  background: #121212;
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.25);
  font-size: 14px;
  font-weight: 500;
  color: #fff;
  width: 50%;
  min-height: 200px;
  z-index: 9999;
}

.comment-list-header {
  border-bottom: 1px solid #666;
  padding: 20px 20px 10px 20px;
}
.comment-list-header .comment-list-title {
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 10px;
}
.comment-list-header .comment-list-desc {
  font-size: 12px;
  font-weight: 500;
  color: #666;
}

.comment-content-wrap {
  padding: 10px 20px;
}

.comment-list-count {
  font-size: 12px;
  font-weight: 500;
  color: #666;
  margin-bottom: 10px;
  display: block;
}

.comment-list {
  overflow-y: auto;
  max-height: 100px;
}
.comment-list > li {
  cursor: pointer;
}
.comment-list > li:hover {
  background: #121212;
}

.comment-item-inner {
  display: flex;
  align-items: center;
  column-gap: 10px;
}
.comment-item-inner .comment-num {
  background: #666;
  padding: 4px;
  border-radius: 50%;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 500;
  color: #fff;
  width: 14px;
  height: 14px;
}
.comment-item-inner .comment-txt {
  flex: 1 1;
}

.comment-item {
  display: flex;
  justify-content: space-between;
  padding: 8px 0;
  align-items: center;
}
.comment-item .comment-date {
  font-size: 12px;
  font-weight: 500;
  color: #666;
}

.search-store-list {
  position: absolute;
  top: 100%;
  width: 100%;
  z-index: 10;
  max-height: 150px;
  overflow-y: auto;
  background: #121212;
  font-size: 14px;
  font-weight: 500;
  color: #fff;
  padding: 8px;
  cursor: pointer;
  z-index: 999999 !important;
}
.search-store-list::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  background: #121212;
}
.search-store-list::-webkit-scrollbar-track {
  background: #121212;
}
.search-store-list::-webkit-scrollbar-thumb {
  background: #f5f5f7;
  border-radius: 10em;
}
.search-store-list li {
  padding: 8px;
  cursor: pointer;
}
.search-store-list li:hover {
  background: #f0002e;
  color: #fff;
}

.template-list {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px;
}
.template-list .image-slider {
  width: 100% !important;
  margin: 0 !important;
  min-height: 200px;
}
.template-list .image-slider .slick-slide {
  width: auto !important;
  aspect-ratio: 4/3;
  min-height: 200px;
}
.template-list .image-slider .slick-list {
  overflow: visible !important;
}
.template-list p {
  font-size: 14px;
  text-align: center;
  white-space: pre;
}
.template-list li {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  height: 180px;
  gap: 16px;
  cursor: pointer;
}
.template-list li:first-child img {
  margin-top: 20px;
}
.template-list li:nth-child(2) img {
  margin-top: 10px;
}
@media only screen and (max-width: 768px) {
  .template-list li {
    width: 33%;
    height: 125px;
  }
  .template-list li img {
    width: 100%;
  }
}
.template-list li img.template-list-item-img.active {
  border: 2px solid #f6510a;
  border-radius: 4px;
}

.color-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  padding: 20px;
  border-radius: 16px;
}
.color-list li {
  width: 150px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  cursor: pointer;
}
@media only screen and (max-width: 768px) {
  .color-list li {
    width: 30%;
  }
  .color-list li img {
    width: 100%;
  }
}
.color-list li img {
  width: 100%;
}
.color-list li img.active {
  border: 2px solid #f6510a;
  border-radius: 4px;
}

.template-list-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.template-list-item {
  border-bottom: 1px solid #2c2c2c;
  padding-bottom: 12px;
  cursor: pointer;
}
.template-list-item span {
  font-size: 14px;
}
.template-list-item .template-list-item-select {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* 슬라이더 페이지네이션 */
.calendar-banner-dots {
  position: absolute;
  bottom: 10%;
  left: 50%;
  transform: translateX(-50%);
  display: flex !important;
  gap: 8px;
  padding: 0;
  margin: 0;
  list-style: none;
  z-index: 10;
}

.calendar-banner-dots li {
  width: 8px;
  height: 8px;
}

.calendar-banner-dots li button {
  width: 100%;
  height: 100%;
  padding: 0;
  border: none;
  border-radius: 50%;
  background-color: rgba(18, 18, 18, 0.4);
  opacity: 0.4;
  cursor: pointer;
  transition: opacity 0.3s;
}

.calendar-banner-dots li.slick-active button {
  opacity: 1;
  background-color: #121212; /* 활성화 색상 */
}

.normal-slide-content {
  aspect-ratio: 4/5;
}

.pre-reservation-deatil-wrap {
  font-size: 14px;
  padding: 0 16px;
}
.pre-reservation-deatil-wrap .field-wrap {
  margin-bottom: 40px;
}
.pre-reservation-deatil-wrap .small-text {
  padding-bottom: 5px;
}
.pre-reservation-deatil-wrap .popupstore-name {
  padding: 0;
}
.pre-reservation-deatil-wrap .popupstore-name img {
  width: 17px;
  height: 17px;
  vertical-align: middle;
  margin-left: 6px;
}
.pre-reservation-deatil-wrap .field-tit {
  padding-bottom: 10px;
}
.pre-reservation-deatil-wrap .field-text-wrap {
  background: #212121;
  padding: 16px;
  line-height: 1.5;
  font-size: 14px;
  color: #999;
}
.pre-reservation-deatil-wrap .field-text-wrap .notice-wrap {
  max-height: 200px;
  overflow-y: scroll;
  padding-right: 6px;
  word-break: keep-all;
}
.pre-reservation-deatil-wrap .field-text-wrap .notice-wrap::-webkit-scrollbar {
  width: 3px;
  height: auto;
  background: #121212;
  border-radius: 10em;
}
.pre-reservation-deatil-wrap .field-text-wrap .notice-wrap::-webkit-scrollbar-thumb {
  width: 3px;
  height: auto;
  background: #777;
  border-radius: 10em;
}
.pre-reservation-deatil-wrap .field-text-wrap p {
  padding: 0;
  line-height: 1.5;
}
.pre-reservation-deatil-wrap .qr-area {
  width: 300px;
  margin: 16px auto;
  padding: 20px 40px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pre-reservation-deatil-wrap .qr-area .svg {
  display: block;
  width: 150px;
  height: 150px;
  object-fit: cover;
}
.pre-reservation-deatil-wrap .qr-area div.svg {
  display: flex;
  align-items: center;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  word-break: keep-all;
  line-height: 1.5;
  padding: 20px 0;
  background: url("/assets/img/reservation/qr_frame.png") center center no-repeat;
  background-size: cover;
}
.pre-reservation-deatil-wrap .qr-area div.svg p {
  width: 95px;
  margin: 0 auto;
}
.pre-reservation-deatil-wrap .gray {
  display: block;
  margin: 0 auto;
  height: 32px;
  text-align: center;
  width: 70%;
  max-width: 280px;
  background: #2c2c2c;
  font-size: 13px;
  color: #fff;
  border-radius: 5px;
}

.reservation-wrap .reservation-store-title {
  font-size: 18px;
  margin-bottom: 20px;
  padding: 0 16px;
}
.reservation-wrap .reservation-form .sub-text {
  padding: 16px;
  background: #212121;
  border-radius: 12px;
}
.reservation-wrap .reservation-form .sub-text p {
  padding: 0 16px;
}
.reservation-wrap .reservation-form .field-wrap {
  margin-bottom: 16px;
}
.reservation-wrap .reservation-form .field-wrap.field-top-wrap {
  padding: 0 16px;
}
.reservation-wrap .reservation-form .field-wrap.field-top-wrap label {
  display: inline-block;
  width: 35px;
}
.reservation-wrap .pre-survey-text-wrap {
  margin: 40px auto 0px;
  width: 95%;
  padding: 20px 8px 8px;
  border-top: 1px solid #767676;
}
.reservation-wrap .pre-survey-text-wrap .sub-text p {
  padding: 0;
}
.reservation-wrap .survey-form-wrap {
  border-top: 0;
  border-bottom: 1px solid #767676;
  margin-bottom: 40px;
  padding-top: 20px;
}
.reservation-wrap .survey-form-wrap .q-wrap {
  margin-bottom: 0px;
}
.reservation-wrap .survey-form-wrap .q-wrap .q-tit {
  padding: 0 16px;
}
.reservation-wrap .survey-form-wrap .a-wrap {
  padding: 0 16px;
}

.site-document {
  padding: 0 20px 100px;
  box-sizing: border-box;
}
.site-document h2 {
  text-align: center;
  margin: 20px 0;
}
.site-document h3 {
  margin: 0;
  margin-top: 20px;
}
.site-document .close-btn {
  width: 100%;
  display: flex;
  justify-content: flex-end;
}
.site-document div {
  margin: 10px 0;
}
.site-document .info {
  padding-bottom: 10px;
}
.site-document .term-title {
  font-size: 14px;
  font-weight: 700;
  padding-top: 20px;
}
.site-document .term-text {
  display: block;
  padding-bottom: 5px;
  font-size: 14px;
  line-height: 20px;
}
.site-document > ul {
  padding-top: 10px;
  padding-left: 10px;
}
.site-document > ul li {
  font-size: 14px;
  line-height: 24px;
}
.site-document > ul li p {
  font-size: 14px;
  padding-bottom: 10px;
  line-height: 20px;
}
.site-document > ul ul {
  padding: 0 0 10px 10px;
  font-size: 12px;
}
.site-document > ul ul li {
  line-height: 18px;
}
.site-document .sub-list {
  font-size: 12px;
}
.site-document .sub-list li {
  line-height: 18px;
  list-style: inside;
}

.popupdetail-time-area {
  display: flex;
  justify-content: space-between;
  column-gap: 32px;
}
.popupdetail-time-area .open-session {
  margin-bottom: 6px;
}
.popupdetail-time-area .open-session p {
  font-size: 14px;
}
.popupdetail-time-area .session-tit {
  font-size: 14px;
  font-weight: 700;
  color: #acacac;
  margin: 4px 0;
}
@media (max-width: 768px) {
  .popupdetail-time-area {
    flex-direction: column;
    column-gap: 0;
  }
}

.popupdetail-time {
  width: 100%;
}

.popupdetail-session {
  width: 100%;
}

.popupdetail-session-closed header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.popupdetail-session-closed ul {
  display: none;
  font-size: 14px;
  font-weight: 400;
}
.popupdetail-session-closed ul li {
  display: flex;
  align-items: center;
  gap: 4px;
}
.popupdetail-session-closed ul p {
  width: 40px;
}

.popupdetail-session-closed ul.open {
  display: block;
}

.popupdetail-session-closed img {
  transition: transform 0.2s;
  cursor: pointer;
  width: 12px !important;
  height: 12px !important;
  transform: rotate(180deg);
}

.popupdetail-session-closed img.open {
  transform: rotate(0deg);
}

@media all and (min-width: 960px) {
  .gradiant::after {
    background: url("/assets/img/gradiant_pc.png") center center no-repeat;
    background-size: cover;
  }
  .full-btn.more-list {
    width: 100%;
  }
  .mainPrevious {
    width: 5%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    background: rgb(0, 0, 0);
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.4738270308) 0%, rgba(255, 255, 255, 0) 50%);
  }
  .mainPrevious::after {
    content: "";
    display: block;
    width: 20px;
    height: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url("/assets/img/common/arrow_left_big.png") center center no-repeat;
    background-size: cover;
    cursor: pointer;
  }
  .mainNext {
    width: 5%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
    background: rgb(0, 0, 0);
    background: linear-gradient(270deg, rgba(0, 0, 0, 0.4738270308) 0%, rgba(255, 255, 255, 0) 50%);
  }
  .mainNext::after {
    content: "";
    display: block;
    width: 20px;
    height: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: url("/assets/img/common/arrow_right_big.png") center center no-repeat;
    background-size: cover;
    cursor: pointer;
  }
  .main-empty-favorite {
    margin-top: 40px;
  }
  .main-empty-favorite h3 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 16px;
  }
  .main-empty-favorite__box {
    border-radius: 20px;
    padding: 32px 20px;
    text-align: center;
  }
  .main-empty-favorite p {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 16px;
  }
  .main-empty-favorite button {
    border-radius: 999px;
    background: #222;
    color: #fff;
    padding: 12px 20px;
    font-weight: 600;
  }
  .calendar-popup-list.popuplist-board > ul > li div {
    grid-template-columns: 0.3fr 1fr;
  }
  .calendar-popup-list > ul {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 0;
  }
  .calendar-popup-list > ul > li {
    border-bottom: 0;
  }
  .calendar-popup-list > ul > li div {
    padding: 0;
  }
  .calendar-popup-list > ul > li div a li.popup-date {
    text-align: left;
  }
  nav {
    padding: 20px 4px;
  }
  nav div.header-search {
    width: 100%;
    column-gap: 22px;
  }
  nav div.header-search .header-search-container {
    padding: 8px 12px;
  }
  .search-box header p {
    width: 95%;
  }
  .search-box-inner ul li {
    font-size: 14px;
    font-weight: 400;
    padding: 7.5px 20px;
  }
  .popupbanner-wrap header {
    justify-content: space-between;
    padding: 0;
  }
  .popupbanner-inner .slick-list .slick-slide:first-child {
    padding: 0;
  }
  .MuiBottomNavigation-root button.MuiBottomNavigationAction-root {
    min-width: 80px;
  }
  footer .footer-bottom .info-list .tel {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    column-gap: 8px;
  }
  footer .footer-bottom .icon-list {
    width: 35%;
    justify-content: flex-end;
  }
  footer .footer-sns-wrap {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: flex-end;
  }
  .text-form {
    padding: 0 0 100px;
  }
  .text-form.biz-form .text-form-inner > p {
    width: 48%;
  }
  .search-filter-box {
    padding: 0;
  }
  .popup-search-list .slick-list {
    overflow: hidden;
  }
  .popup-search-list .slick-slide > div {
    width: 100%;
  }
  .listPrevious {
    left: 40%;
    bottom: 2px;
  }
  .listNext {
    right: 40%;
    bottom: 2px;
  }
  .search-banner-wrap {
    width: 98% !important;
  }
  .blank-tit {
    padding: 0;
  }
  .popupdetail-wrap {
    scroll-margin-top: 80px;
  }
}
@media (min-width: 960px) and (max-width: 768px) {
  .popupdetail-wrap {
    scroll-margin-top: 120px;
  }
}
@media all and (min-width: 960px) {
  .popupdetail-wrap,
  .popupdetail-title {
    padding: 0;
  }
  .popupdetail-wrap .popupdetail-warning-text,
  .popupdetail-title .popupdetail-warning-text {
    padding: 0.5rem 0;
    color: #dfdfdf;
  }
  .popupdetail-icon-area,
  .popupdetail-time,
  .popupdetail-session,
  .popupdetail-caution {
    padding: 20px 0;
  }
  .popupdetail-icon-area img,
  .popupdetail-time img,
  .popupdetail-session img,
  .popupdetail-caution img {
    display: block;
    width: 36px;
    height: 36px;
    object-fit: contain;
  }
  .popupdetail-info {
    padding: 20px 0;
  }
  .popupdetail-info h2 {
    padding: 0;
    margin-bottom: 0;
  }
  .popupdetail-inner {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
  }
  .popupdetail-icon-area {
    border-top: none;
  }
  .popupdetail-icon-area ul li {
    width: 20%;
  }
  .popupdetail-link ul {
    display: flex;
    align-items: center;
    gap: 16px;
  }
  .popupdetail-link ul li {
    border: none;
    width: auto;
    min-width: 88px;
  }
  .popupdetail-link ul li a {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 0;
    text-decoration: none;
    color: #a2a2a2;
    font-size: 14px;
    font-weight: 500;
  }
  .popupdetail-link ul li a .link-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
  .popupdetail-link ul li a .link-left p {
    background: #1c1c1b;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
  }
  .popupdetail-link ul li a .link-left img {
    width: 24px;
    height: 24px;
  }
  .popupdetail-link ul li a .link-left span {
    font-size: 14px;
    font-weight: 500;
  }
  .review-wrap .button-wrap {
    padding: 12px 0 0;
  }
  .review-top {
    padding-left: 0;
  }
  .popupdetail-map > div {
    min-height: 480px;
  }
  .popupdetail-map > div .map-area {
    min-height: 480px;
  }
  .layer-review-profile-wrap {
    display: flex;
    gap: 17px;
    font-size: 14px;
  }
  .layer-review-profile-wrap .review-content-detail-date {
    color: #999;
    font-style: normal;
    font-weight: 400;
  }
  .layer-review-profile-wrap img {
    width: 32px;
    height: 32px;
  }
  .review-image-area {
    column-gap: 8px;
    row-gap: 8px;
  }
  .review-image-area .moreview {
    background-color: #414141;
    width: 110px;
    height: 110px;
    text-align: center;
    border-radius: 14px;
    line-height: 1.5rem;
  }
  .review-image-area .review-image-item {
    border-radius: 14px;
  }
  .review-image-area .review-image-item .img-wrap {
    width: 110px;
    height: 110px;
  }
  .submenu a {
    width: 20%;
  }
  .magazine-list-wrap > ul {
    grid-template-columns: repeat(auto-fill, 320px);
    padding: 0;
  }
  .magazine-list-wrap > ul > li {
    width: 310px;
    height: 516px;
    grid-row-end: span 526;
  }
  .magazine-list-wrap > ul > li.is-large {
    height: 320px;
    grid-row-end: span 330;
  }
  .magazine-list-wrap > ul > li.is-large .newsletter-thumbnail-wrap img {
    width: 60%;
    margin: 0 auto;
  }
  .magazine-list-wrap > ul > li.is-large .newsletter-main-info {
    left: 50%;
    transform: translateX(-50%);
    white-space: pre-wrap;
    width: 100%;
    bottom: 1.5rem;
  }
  .magazine-list-wrap > ul > li.is-large .newsletter-main-info h2 {
    font-size: 24px;
    text-align: center;
  }
  .magazine-list-wrap > ul > li.is-large .newsletter-sub-title {
    font-size: 20px;
  }
  .magazine-list-wrap > ul > li.is-large img {
    width: 100%;
    margin: 0 auto;
  }
  .magazine-main-info {
    font-size: 24px;
  }
  .magazine-main-info h2 {
    font-size: 24px;
  }
  .magazine-main-info h3 {
    font-size: 18px;
  }
  .magazine-search {
    width: 100%;
  }
  .magazine-detail-header {
    padding: 0;
  }
  .magazine-detail-bottom .more-contents .more-contents-wrap {
    height: 418px;
  }
  .magazine-detail-content-button {
    width: -moz-fit-content;
    width: fit-content;
  }
  .magazine-detail-content p {
    max-width: 800px;
    line-height: 1.8;
  }
  .popuplist-filter {
    padding: 20px 0;
  }
  .noneborder-filter .filter-contents > ul {
    padding: 0 25px;
  }
  .prev {
    width: 30px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: rgb(0, 0, 0);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.3) 50%, rgba(255, 255, 255, 0) 100%);
    cursor: pointer;
    z-index: 1;
  }
  .next {
    width: 30px;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background: rgb(0, 0, 0);
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.3) 50%, rgba(255, 255, 255, 0) 100%);
    cursor: pointer;
    z-index: 1;
  }
  .next::after {
    content: "";
    display: block;
    width: 10px;
    height: 25px;
    background: url("/assets/img/common/arrow_right_small.svg") center center no-repeat;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
  .layer-popup {
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 100;
    padding: 70px 0 70px;
  }
  .layer-popup .full-btn {
    width: 100%;
  }
  .layer-edit-inner form > div {
    width: 100%;
  }
  .layer-edit-inner form div div button {
    flex: none;
  }
  .layer-edit-inner form span {
    width: 100%;
  }
  .profile-text-area li.switch-wrap {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    gap: 8px;
  }
  .layer-popup-map .map-area {
    min-height: 65vh;
    margin-top: 0;
  }
  .pre-reservation-list {
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
  }
  .pre-reservation-content {
    width: 49%;
  }
  .reservation-wrap .reservation-store-title {
    padding: 0;
  }
  .reservation-wrap .pre-survey-text-wrap {
    width: 100%;
    margin: 40px 0 20px;
    padding: 0;
  }
  .reservation-wrap .reservation-form .field-wrap {
    padding: 0;
  }
  .reservation-wrap .reservation-form .field-wrap.field-top-wrap {
    padding: 0;
  }
  .reservation-wrap .reservation-form .sub-text p {
    padding: 0;
  }
  .reservation-wrap .survey-form-wrap .q-wrap .q-tit {
    padding: 0;
  }
  .reservation-wrap .survey-form-wrap .a-wrap {
    padding: 0;
  }
}
@media all and (min-width: 481px) {
  .inquiry-wrap ul li {
    flex-direction: row;
    justify-content: space-between;
  }
  .text-form-inner p .report-date-wrap {
    column-gap: 20px;
  }
  .text-form-inner p .report-date-wrap li {
    width: auto;
  }
  .calendar-popup-list > ul > li div {
    grid-template-columns: 0.3fr 1fr;
  }
  .layer-edit-inner form div div button {
    padding: 0 12px;
  }
}
@media all and (max-width: 780px) {
  .popupbanner-tit {
    font-size: 20px;
  }
  .gradiant::after {
    background: url("/assets/img/gradiant_tab.png") center center no-repeat;
    background-size: cover;
  }
  .thumbs-control button {
    padding: 0;
    width: 100px;
  }
  .thumbs-control img {
    width: 20px;
    height: 20px;
  }
  .reservation-link-button {
    width: 95%;
  }
  .popupdetail-link {
    padding: 0 20px;
  }
  .popupdetail-link ul {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 16px;
    gap: 16px;
  }
  .popupdetail-link ul li {
    border: none;
    width: auto;
    min-width: 88px;
  }
  .popupdetail-link ul li a {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 0;
    text-decoration: none;
    color: #a2a2a2;
    font-size: 14px;
    font-weight: 500;
  }
  .popupdetail-link ul li a .link-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
  .popupdetail-link ul li a .link-left p {
    background: #1c1c1b;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100px;
  }
  .popupdetail-link ul li a .link-left img {
    width: 24px;
    height: 24px;
  }
  .popupdetail-link ul li a .link-left span {
    font-size: 14px;
    font-weight: 500;
  }
}
/* Add this CSS to your styles */
.skeleton-loader {
  height: 45vw; /* Half the width */
  max-height: 480px;
  max-width: 960px;
  width: 90vw; /* Adjust height as needed */
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #2c2c2c; /* Light gray background */
  position: relative;
  border-radius: 5px; /* Rounded corners */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
  overflow: hidden;
}

.skeleton-content {
  text-align: center;
}

.skeleton-text {
  font-size: 24px; /* Adjust font size as needed */
  font-weight: bold;
  color: #555; /* Darker gray for text */
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.7);
}

.popupbanner-inner .slick-track {
  width: 1106px;
}

.ck-content [class*=ck-widget__] {
  display: none !important;
}

@media all and (max-width: 960px) {
  .menu-box {
    gap: 24px;
  }
  .menu-box .menu-box-top {
    gap: 16px;
  }
  nav .header-icon-wrap {
    gap: 4px;
  }
}