header {
  background: #9676fe
}
header .logo {width: 193px;}

header .white_logo {
  background-image: url("/images/bbs2/logo.svg")
}

header .color_logo {
  background-image: url("/images/bbs2/logo_purple.svg")
}

header #gnb .menu>a {
  font-family: "GongGothicLight"
}

button {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  outline: none;
  cursor: pointer;
  font-family: "GongGothicLight"
}

.btn-gray {
  width: 200px;
  height: 50px;
  background: #f2f2f2;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: #777 !important;
  font-family: "GongGothicLight"
}

.box-btn {
  display: flex;
  gap: 20px;
  justify-content: center;
  align-items: center
}

.btn-purple {
  width: 200px;
  height: 50px;
  background: #9676fe;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: #fff !important;
  font-family: "GongGothicLight"
}

.swiper_bbs, .swiper_bbs2 {width:100%; overflow:hidden;}

.mo {
  display: none
}
.swiper_bbs .mo {
  display: none !important;
}

article {
  box-sizing: border-box;
  text-align: left
}

.article-myswiper {
  display: flex
}
.sticky {}
.sticky-pin {width:100%; position:fixed; top:61px; background:#fff; left:50%; transform:translateX(-50%); border-bottom:1px solid #ccc; z-index:500;}

.mySwiper {
  margin: 60px auto;
  width: auto;
  max-width: none;
  flex: 1
}

.mySwiper .swiper-slide {
  font-family: "GongGothicLight";
  transition: color .3s
}

.mySwiper .swiper-slide.active {
  font-family: "GongGothicMedium";
  color: #9676fe
}

.mySwiper .swiper-slide.active a {
  border-color: #9676fe;
  overflow: hidden
}

.mySwiper .swiper-slide:not(.active):hover {
  font-family: "GongGothicMedium";
  color: #9676fe
}

.mySwiper .swiper-slide:not(.active):hover a {
  border-color: #9676fe;
  overflow: hidden
}

.mySwiper .swiper-slide a {
  width: 70px;
  height: 70px;
  transition: .3s;
  border-radius: 15px;
  border: 1px solid rgba(0, 0, 0, 0)
}

.search {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 748px;
  width: 100%;
  height: 55px;
  margin: 60px auto
}

.search .box-category {
  width: 150px;
  height: 100%;
  position: relative;
  border-radius: 55px 0 0 55px;
  background: #9676fe
}

.search .box-category .btn-category {
  padding: 0 18px 0 33px;
  width: 150px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  font-size: 16px;
  font-family: "GongGothicLight";
  color: #fff
}

.search .box-category .category-list {
  width: 100%;
  height: 250px;
  padding-top: 20px;
  text-align: center;
  position: absolute;
  left: 0;
  overflow: auto;
  box-shadow: 4px 0 10px rgba(197, 197, 197, .5);
  border-radius: 10px;
  font-family: "GongGothicLight";
  opacity: 0;
  visibility: hidden;
  z-index: 90;
  background: #fff
}

.search .box-category .category-list .category-item {
  margin-bottom: 18px;
  font-size: 16px;
  color: #4f4a62;
  cursor: pointer;
  font-family: "GongGothicLight"
}

.search .box-category .category-list .category-item.active {
  font-family: "GongGothicMedium"
}

.search .box-category .category-list.active {
  opacity: 1;
  visibility: visible
}

.search .box-input {
  flex: 1;
  height: 100%;
  border: 1px solid #bdbdbd;
  border-radius: 0 55px 55px 0;
  position: relative;
  padding: 0 22px;
  display: flex;
  align-items: center
}

.search .box-input .search-input {
  flex: 1;
  background: none;
  outline: 0;
  border: 0;
  font-size: 16px;
  font-family: "GongGothicLight"
}

.search .box-input .search-input::-moz-placeholder {
  color: #bdbdbd
}

.search .box-input .search-input::placeholder {
  color: #bdbdbd
}

.line-purple {
  background: #f7f4ff
}

.line-purple .desc {
  color: #4f4a62;
  font-family: "GongGothicLight";
  font-size: 16px
}
.line-purple .marquee { width:calc(100% - 25px); height:40px; overflow:hidden; position:relative;}
.line-purple .marquee > div {width:200%; position:absolute; overflow:hidden; animation:marquee 15s linear infinite;}
.line-purple .marquee .desc {float:left; width:25%; line-height:40px;}

@keyframes marquee {
  0% { left: 0; }
  100% { left: -100%; }
}

.line-purple article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 40px
}

.line-purple .icon {
  position: relative
}

.line-purple .icon::before {
  content: "";
  font-family: "Material Icons Outlined";
  font-size: 19px;
  color: #9676fe;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%)
}

.article-ads {
  display: flex;
  gap: 20px;
  justify-content: space-between;
  margin: 60px auto
}

.article-ads .link-ads {
  width: calc(50% - 10px);
  height: 110px;
  display: flex;
  align-items: center;
  background: #fff;
  border-radius: 10px;
  border: 1px solid #e7e7e7;
  overflow: hidden;
  flex-wrap: wrap
}

.article-ads .link-ads .thumb {
  width: 212px;
  height: 100%
}

.article-ads .link-ads .thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

.article-ads .link-ads .info {
  flex: 1;
  height: 100%;
  padding: 26px 20px 0 20px;
  font-size: 16px;
  font-family: "GongGothicLight";
  text-align: left;
  line-height: 1
}

.article-ads .link-ads .info .title {
	font-size: 20px;
  margin-bottom: 10px
}

.article-ads .link-ads .info .desc {
  color: #777;
	margin-bottom:7px;
}

.article-ads .link-ads .info .more {
  text-align: right;
  color: #ada7bb;
  display: flex;
  gap: 18px;
  justify-content: flex-end;
  align-items: center
}

.article-ads .link-ads .info .more img {
  height: auto;
  width: auto
}

.article-ads .swiper-slide .link-ads {
  margin-bottom: 30px;
  box-sizing: border-box
}

.box-pagination {
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-bottom: 60px
}

.box-pagination .btn-prev,
.box-pagination .btn-next {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center
}

.box-pagination .btn-prev.deactive,
.box-pagination .btn-next.deactive {
  opacity: .3
}

.box-pagination .btn-prev img {
  transform: rotate(180deg)
}

.box-pagination .pagination {
  display: flex;
  gap: 6px
}

.box-pagination .pagination .btn-page {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  font-size: 16px;
  color: #4f4a62
}

.box-pagination .pagination .btn-page.active {
  border: 1px solid #9676fe;
  color: #9676fe;
  font-family: "GongGothicMedium"
}

.box-filter {
  position: relative
}

.box-filter .btn-filter {
  width: 160px;
  height: 48px;
  background: #fff;
  border-radius: 5px;
  border: 1px solid #ddd;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 18px
}

.box-filter .filter-list {
  width: 160px;
  padding-top: 20px;
  text-align: center;
  position: absolute;
  left: 0;
  overflow: auto;
  box-shadow: 4px 0 10px rgba(197, 197, 197, .5);
  border-radius: 10px;
  font-family: "GongGothicLight";
  opacity: 0;
  visibility: hidden;
  z-index: 90;
  background: #fff
}

.box-filter .filter-list .filter-item {
  margin-bottom: 18px;
  font-size: 16px;
  color: #4f4a62;
  cursor: pointer;
  font-family: "GongGothicLight";
  padding-left: 18px;
  text-align: left;
}

.box-filter .filter-list .filter-item.active {
  font-family: "GongGothicMedium"
}

.box-filter .filter-list.active {
  opacity: 1;
  visibility: visible
}

.btn-pop-search {
  width: 48px;
  font-size: 15px;
  text-align: center
}

.btn-pop-search img {
  width: 100%;
  margin-bottom: 4px
}

.box-info {
  width: 100%;
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: #b3b3b3;
  font-family: "GongGothicLight"
}

.box-info .user-name {
  color: #777
}

.box-info.mo {
  display: none
}

.user-info {
  display: flex;
  align-items: center;
  gap: 8px
}

.post-info {
  display: flex;
  align-items: center;
  gap: 20px
}

.post-info span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  line-height: 1
}

.no-post {
  margin-top: 30px;
  text-align: center;
  font-size: 16px;
  color: #9676fe;
  font-family: "GongGothicLight"
}

.no-post .gray {
  color: #aaa;
  margin-top: 30px;
  display: block
}

.main-visual {
  padding-top: 56px;
  width: 100%
}

.main-visual img {
  width: 100%;
  display: block
}

.purple-banner {
  width: 100%;
  height: 80px;
  background: #9676fe;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 55px;
  border-radius: 10px;
  margin-bottom: 58px
}

.purple-banner .desc {
  color: #fff;
  font-size: 24px;
  font-family: "GongGothicMedium"
}

.purple-banner .link {
  width: 135px;
  height: 40px;
  background: #f7f4ff;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-family: "GongGothicMedium";
  color: #765eb9
}

.article-board {
  padding: 0 34px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 60px 70px
}

/* 240116 고민여기 메인, 카테고리 상세, 게시글에 광고배너 추가 - s */
/* 미디어쿼리 1200, 768에도 있음 */
.article-board .article-top-banner {width:100%; height:200px; overflow:hidden;}
.article-banner {height:200px; overflow:hidden; margin:30px auto 0;}
	/*.article-banner.test-search:not(.swiper-banner) {margin-top:-30px; margin-bottom:50px;}*/
.article-banner.test-search.swiper-banner {margin-top:-30px; margin-bottom:50px;}
.article-board .article-top-banner .banner-wrap, .article-banner .banner-wrap {height:100%;}
.article-board .article-top-banner .banner-item, .article-banner .banner-item {display:flex; align-items:center; justify-content:center; width:100%; height:100%;}

.article-top-banner .banner-item img, .article-banner .banner-item img {width:100%;}
	/* .article-top-banner .banner-item img.pc_img, .article-banner .banner-item img.pc_img {display:block;}
	.article-top-banner .banner-item img.mo_img, .article-banner .banner-item img.mo_img {display:none;} */

/* 240116 고민여기 메인, 카테고리 상세, 게시글에 광고배너 추가 - e */

.article-board .box-board {
  width: 100%;
  max-width: 530px
}
.article-board .box-board.best {
	max-width:initial;
}

.article-board .box-board .box-title {
  padding: 0 20px 20px 20px;
  border-bottom: 1px solid #ddd;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between
}
.article-board .box-board.best .box-title {
	padding-left:0;
	justify-content:flex-start;
	gap:10px;
	border-bottom:0;
}
.article-board .box-board.best .box-title img {margin-top:-5px;}

.article-board .box-board .box-title .title {
  font-size: 24px;
  font-family: "GongGothicMedium";
  margin: 0;
  font-weight: 400
}

.article-board .box-board .post {
  border-bottom: 1px solid #ddd;
  height: 50px;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between
}
.article-board .box-board.best .post {border:1px solid #ddd;}
.article-board .box-board.best .post:not(:last-child) {margin-bottom:20px;}
 
.article-board .box-board.best .post .link {display:flex; width:100%;}
.article-board .box-board.best .post .link > span {display:inline-block;}
.article-board .box-board.best .post .best_num {width:30px; margin-right:20px; font-weight:bold; padding-left:20px;}
.article-board .box-board.best .post .best_cate {width:65px; margin-right:20px; color:#948abf;}
.article-board .box-board.best .post .best_title {width:calc(100% - 70px - 85px - 70px); overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}
.article-board .box-board.best .post .best_like img {width:15px;}
.article-board .box-board.best .post .best_like {display:flex !important; align-items:center; margin-left:auto; gap:5px; padding-right:15px; color:#b3b3b3;}

.article-board .box-board .post.mo {
  display: none
}

.article-board .box-board .post.mo .link {
  color: #4f4f4f
}

.article-board .box-board .link {
  font-family: "GongGothicLight";
  text-align: left;
  width: calc(100% - 80px);
  word-break: keep-all;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}

.article-board .box-board .view {
  font-family: "GongGothicLight";
  color: #b3b3b3;
  display: flex;
  align-items: center;
  gap: 5px;
}

.article-board .empty {
  width: 100%;
  height: 250px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "GongGothicLight";
  color: #4f4f4f
}

.main-detail {
  padding-top: 60px
}

.main-detail .board-header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 60px
}

.main-detail .board-header .btn-write {
  width: 220px;
  height: 48px;
  background: #9676fe;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #fff
}

.main-detail .article-list .no-post {
  margin-bottom: 315px
}

.main-detail .article-list.best {margin-bottom:70px;}
.main-detail .article-list.best .list-post li h4 {display:flex; align-items:center; font-size:24px; font-weight:normal; margin-bottom:20px;}
.main-detail .article-list.best .list-post li h4 img {margin-top:-5px; margin-right:10px;}

.main-detail .article-list .list-title {
  font-size: 24px;
  font-family: "GongGothicMedium";
  padding-bottom: 30px;
}

.main-detail .article-list .item-post {
  border: 1px solid #ddd;
  padding: 20px 30px;
  font-family: "GongGothicLight";
  font-size: 16px;
  line-height: 1;
  margin-bottom: 20px
}
.main-detail .article-list .item-post.notice {
	border-color:#9676fe;
}
.main-detail .article-list .item-post.best {
	border-width:3px;
	border : 1px solid #333;
}

.main-detail .article-list .item-post .post-title {
  margin-bottom: 20px
}
.main-detail .article-list.best .item-post .post-title strong {
	margin-right:5px;
}

.main-detail .article-list .item-post .post-content {
  color: #777;
  margin-bottom: 16px;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: justify;
}

.article-title {
  font-size: 26px;
  font-family: "GongGothicMedium";
  padding-bottom: 30px;
  border-bottom: 1px solid #000;
  margin: 0;
  margin-bottom: 30px
}

.main-write {
  padding-top: 116px
}

.main-write .article-title {
  font-weight: 400
}

.main-write .box-border {
  border: 1px solid #ddd;
  height: 50px;
  display: flex;
  width: 100%;
  align-items: center;
  margin-bottom: 20px;
  padding: 0 30px
}

.main-write .box-category {
  width: 100%;
  height: 100%;
  position: relative
}

.main-write .box-category .btn-category {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  font-size: 16px;
  font-family: "GongGothicLight"
}

.main-write .box-category .category-list {
  width: 100%;
  height: 250px;
  padding: 0 30px;
  padding-top: 20px;
  text-align: left;
  position: absolute;
  left: -30px;
  overflow: auto;
  box-shadow: 4px 0 10px rgba(197, 197, 197, .5);
  border-radius: 10px;
  font-family: "GongGothicLight";
  opacity: 0;
  visibility: hidden;
  z-index: 90;
  background: #fff
}

.main-write .box-category .category-list .category-item {
  margin-bottom: 18px;
  font-size: 16px;
  color: #4f4a62;
  cursor: pointer;
  font-family: "GongGothicLight"
}

.main-write .box-category .category-list .category-item.active {
  font-family: "GongGothicMedium"
}

.main-write .box-category .category-list.active {
  opacity: 1;
  visibility: visible
}

.main-write .input-title {
  width: 100%;
  height: 100%;
  background: none;
  border: none;
  outline: none;
  font-family: "GongGothicLight";
  font-size: 16px
}

.main-write .input-title::-moz-placeholder {
  color: #9b9b9b
}

.main-write .input-title::placeholder {
  color: #9b9b9b
}

.main-write .box-gray {
  color: #9b9b9b
}

.main-write .box-textarea {
  border: 1px solid #ddd;
  width: 100%;
  margin-bottom: 60px
}

.main-write .box-textarea .box-head {
  background: #fcfcfc;
  padding: 0 30px;
  border-bottom: 1px solid #ddd;
  height: 50px;
  display: flex;
  align-items: center;
  width: 100%
}

.main-write .box-textarea label {
  width: 100%;
  height: 100%;
  display: flex;
  gap: 5px;
  align-items: center;
  color: #9b9b9b;
  cursor: pointer;
  font-family: "GongGothicLight"
}

.main-write .box-textarea label input {
  display: none
}

.main-write .box-textarea textarea {
  width: 100%;
  height: 596px;
  resize: none;
  padding: 20px 30px;
  border: none;
  outline: none;
  font-family: "GongGothicLight";
  box-sizing: border-box;
  font-size: 16px
}

.main-write .box-textarea textarea::-moz-placeholder {
  color: #9b9b9b
}

.main-write .box-textarea textarea::placeholder {
  color: #9b9b9b
}

.box-range{
  font-family: "GongGothicMedium";
  margin-bottom: 60px;
}
.box-range .range-title{
  font-size: 16px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items:center;
}
.box-range .range-title .write_modal_btn {margin:0 auto 0 5px; color:#999; font-size:16px;}

.box-range .range-title > div {
  display:inline-block;
  color: #9579e0;
}
.box-range .range-title > div input[type="text"] {
  border:1px solid #bbb;
  padding:8px 0;
  text-align:center;
  width:50px;
  font-family: "GongGothicMedium";
}

.box-range .range-value{
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 15.5px;
  margin-bottom: 30px;
}

.box-range .label-range{
  position: relative;
  width: 100%;
  height: 3px;
  display: block;
  background: #e5e5e5;
  border-radius: 1.5px;
  margin: 23px 0;
}

.box-range .label-range input{
  -webkit-appearance: none;
  width: 100%;
  height: 3px;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  pointer-events: none;
}
/* .box-range .label-range input::-webkit-slider-runnable-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  background: #ddd;
  border-radius: 1.5px;
} */

.box-range .label-range input::-webkit-slider-thumb {
  position: relative;
  z-index: 2;
  width: 29px;
  height: 29px;
  margin-top: 0px;
  background: #fff;
  border: 1px solid #dddddd;
  box-shadow: 2px 0 3px rgba(214, 214, 214, 0.5);
  border-radius: 50%;
  cursor: pointer;
  -webkit-appearance: none;
  pointer-events: all;
}

.main-write .box-btn {
  display: flex;
  gap: 20px;
  justify-content: center;
  align-items: center;
  margin-bottom: 60px
}

.main-post {
  padding-top: 116px
}

.main-post .box-btn {
  justify-content: flex-end;
  margin: 30px 0 60px 0
}

.main-post .article-post .box-post {
  padding: 30px 20px;
  border: 1px solid #ddd
}

.main-post .article-input-comment {
  margin-top: 60px
}

.main-post .post-header {
  padding: 0 10px;
  border-bottom: 1px solid #ddd
}

.main-post .post-header .category-type {
  font-family: "GongGothicLight";
  font-size: 16px;
  display: flex;
  align-items: center;
  gap: 18px;
  line-height: 1;
  margin-bottom: 20px
}

.main-post .post-header .category-type img {
  margin-bottom: 2px
}

.main-post .post-header .post-title {
  font-size: 20px;
  font-family: "GongGothicMedium";
  margin-bottom: 15px
}

.main-post .post-header .box-info {
  font-size: 16px
}

.main-post .post-header .user-info {
  margin-bottom: 25px
}

.main-post .post-header .user-info .name {
  color: #777
}

.main-post .post-header .user-info .date {
  margin-left: 10px
}

.main-post .post-header .user-info img {
  width: 25px
}

.main-post .post-header .post-info .name {
  color: #777
}

.main-post .post-header .post-info span {
  font-size: 14px
}

.main-post .post-body {
  font-size: 16px;
  font-family: "GongGothicLight";
  padding: 30px 10px;
  height: 400px;
  border-bottom: 1px solid #ddd;
}

/* 240116 고민여기 메인, 카테고리 상세, 게시글에 광고배너 추가 - s */
/* 미디어쿼리 768에도 있음 */
.main-post.test240116 .post-body {
	border-bottom:0;
}
.main-post.test240116 .dp-media-preview_list {
	border-top: 1px solid #ddd;
	padding-top:20px;
	margin:0;
}
/* 240116 고민여기 메인, 카테고리 상세, 게시글에 광고배너 추가 - e */

.main-post .post-body.notice {
	border-bottom:0;
}

.box-solution p{
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.box-solution p span{
  color: #9579e0;
}

.main-post .box-input {
  font-size: 15px
}

.main-post .box-input p {
  font-family: "GongGothicMedium";
  margin-bottom: 10px
}

.main-post .box-input textarea {
  width: 100%;
  height: 130px;
  resize: none;
  padding: 32px 30px;
  border: none;
  outline: none;
  font-family: "GongGothicLight";
  box-sizing: border-box;
  font-size: inherit;
  border: 1px solid #ddd
}

.main-post .box-input textarea::-moz-placeholder {
  color: #9b9b9b
}

.main-post .box-input textarea::placeholder {
  color: #9b9b9b
}

.main-post .list-comment .box-filter {
  margin-bottom: 30px
}

.main-post .list-comment .box-comment {
  border-top: 1px solid #ddd;
  padding: 32px 0
}

.main-post .list-comment .box-comment .box-input-recomment {
  display: none
}

.main-post .list-comment .box-comment .box-input-recomment.active {
  display: block
}

.main-post .list-comment .box-comment .box-input {
  margin-top: 20px;
  margin-left: 30px;
  height: 130px
}

.main-post .list-comment .box-comment .box-input textarea {
  background: #f5f6f8;
  border: none;
  border-radius: 10px
}

.main-post .list-comment .box-comment .box-btn {
  margin: 20px 0 0 0;
  padding: 0 0 0 30px;
}

.main-post .list-comment .box-comment.deleted {
  padding: 0;
  padding-bottom: 32px
}

.main-post .list-comment .box-comment.deleted .notice {
  font-family: "GongGothicMedium";
  background: #f8f8f8;
  padding-left: 30px;
  width: 100%;
  height: 74px;
  display: flex;
  align-items: center;
  box-sizing: border-box
}

.main-post .list-comment .comment {
  font-size: 16px;
  font-family: "GongGothicLight"
}

.main-post .list-comment .comment .user-info {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-bottom: 5px
}

.main-post .list-comment .comment .user-info .profile {
  width: 35px
}

.main-post .list-comment .comment .user-info .name {
  font-family: "GongGothicMedium";
  display: flex;
  align-items: center;
  gap: 5px;
  line-height: 1
}

.main-post .list-comment .comment .user-info .name .writer {
  width: 42px;
  height: 16px;
  border-radius: 16px;
  font-size: 10px;
  color: #9676fe;
  border: 1px solid #9676fe;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 16px
}

.main-post .list-comment .comment .content {
  padding-left: 45px;
  margin-bottom: 15px
}

.main-post .list-comment .comment .post-info {
  padding-left: 45px;
  display: flex;
  gap: 20px;
  align-items: center;
  color: #b3b3b3;
  line-height: 1
}

.main-post .list-comment .comment .post-info button {
  font-size: inherit;
  line-height: 1
}

.main-post .list-comment .comment .btn-heart {
  display: flex;
  gap: 5px;
  margin-left: auto
}

.main-post .list-comment .comment .btn-heart .heart {
  width: 16px;
  aspect-ratio: 16/15;
  background: url("/images/bbs2/icon-heart-purple.svg") no-repeat
}

.main-post .list-comment .comment .btn-heart.active {
  color: #9676fe
}

.main-post .list-comment .comment .btn-heart.active .heart {
  background: url("/images/bbs2/icon-heart-purple-fill.svg") no-repeat;
  background-size: contain
}

.main-post .list-comment .comment.recomment {
  margin-top: 25px;
  padding-left: 45px
}

.main-post .btn-more {
  max-width: 1200px;
  width: 100%;
  height: 54px;
  background: #505251;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: "GongGothicMedium";
  margin: 0 auto;
  margin-bottom: 160px
}

.main-join {
  padding-top: 116px;
  color: #000
}

.main-join header {
  background: #9676fe
}

.main-join .article-join {
  padding: 0 200px;
  margin-bottom: 60px
}

.main-join .join_box {
  padding: 60px;
  border: 1px solid #ddd
}

.main-join .join_box .title {
  font-size: 26px;
  font-family: "GongGothicMedium";
  margin-bottom: 30px
}

.main-join .join_box p.choose_txt {
  margin-top: 0;
  font-family: "GongGothicLight"
}

.main-join .join_box table tbody td:not(.title) {
  padding: 0;
  height: 75px;
  display: flex;
  align-items: center
}

.main-join .join_box table tbody td:not(.title)>a span {
  color: gray;
  font-family: "GongGothicLight";
  transition: .2s;
  width: 110px !important;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center
}

.main-join .join_box table tbody td:not(.title)>a span:hover {
  color: #fff
}

.main-join .join_box table tbody td:not(.title)>a span.label-white {
  background: #fff;
  border: 1px solid #ddd
}

.main-join .join_box table tbody td:not(.title)>a span.label-white:hover {
  color: #fff;
  background: #333
}

.main-join .join_box table tbody td:not(.title) input[type=text] {
  height: 100%
}

.main-join .join_box table tbody .photo_area td {
  height: auto;
  display: block
}

.main-join .join_box table tbody .photo_area .pic {
  margin-bottom: 30px
}

.main-join .join_box table tbody .photo_area .pic label {
  width: auto;
  margin-right: 30px;
  cursor: pointer
}

.main-join .join_box table tbody .photo_area .pic label input {
  cursor: pointer
}

.main-join .join_box table tbody .photo_area .pic label span {
  display: block
}

.main-join .join_box table tbody .photo_area .pic label span img {
  width: 57px;
  max-width: none;
  display: block;
  margin-bottom: 20px
}

.main-join .join_box table tbody .phone_area .btn-cancle {
  display: none
}

.main-join .join_box table tbody .phone_area .btn-change {
  display: block
}

.main-join .join_box table tbody .phone_area.hide {
  display: none
}

.main-join .join_box table tbody .phone_area.active {
  display: block
}

.main-join .join_box table tbody .phone_area.active .btn-cancle {
  display: block
}

.main-join .join_box table tbody .phone_area.active .btn-change {
  display: none
}

.main-join .join_box table input:not([type=radio]):not([type=checkbox]):focus {
  background: #fff
}

.main-join .join_box table input:not([type=radio]):not([type=checkbox]):focus::-moz-placeholder {
  color: #9b9b9b
}

.main-join .join_box table input:not([type=radio]):not([type=checkbox]):focus::placeholder {
  color: #9b9b9b
}

.main-join .join_box table tfoot tr td {
  padding: 0;
  padding-top: 30px;
  color: #9b9b9b;
  font-size: 16px
}

.main-join .join_box table tfoot tr p.btn_see {
  font-size: 16px
}

.main-join .join_box table tfoot tr .check {
  line-height: 1;
  padding-top: 28px;
  color: #9b9b9b
}

.main-join .join_box table tfoot tr .check a {
  color: #9b9b9b;
  font-size: inherit
}

.main-join .join_box table tfoot .agree {
  font-size: 16px;
  color: #666;
  font-family: "GongGothicLight";
  height: 75px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid #666;
  padding: 0
}

.main-join .join_box .gender label {
  color: #9b9b9b;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-right: 30px;
  font-family: "GongGothicLight"
}

.main-join .join_box .join_btn {
  width: 100%;
  height: 50px;
  background: #9676fe;
  border-radius: 10px;
  color: #fff;
  font-family: "GongGothicLight";
  margin: 0;
  margin-top: 60px
}

.main-join .join_box .join_btn.btn-gray {
  background: #f2f2f2;
  color: #777
}

.main-join .join_box .btn-white {
  background: #fff;
  color: #777;
  border: 1px solid #ddd;
  width: 100%;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  margin-top: 20px;
  font-family: "GongGothicLight"
}

.wrap-modal {
  background: rgba(0, 0, 0, .5);
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  transition: .2s;
  pointer-events: none
}

.wrap-modal.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto
}

.wrap-modal.active .modal {
  pointer-events: auto;
	display:block;
	left:50%;
	top:50%;
	transform:translate(-50%, -50%);
	overflow:hidden;
}
.wrap-modal.active .modal.join, .wrap-modal.active .modal.mypage  {
	position:absolute;
}

.wrap-modal .modal {
  width: 450px;
  height: 154px;
  padding: 30px 0;
  background: #fff;
  border-radius: 10px;
  pointer-events: none
}

.wrap-modal .modal.modal-big {
  height: 179px
}

.wrap-modal .modal .msg {
  font-size: 16px;
  font-family: "GongGothicLight";
  margin-bottom: 30px;
  color: #4f4a62;
  text-align: center
}

.wrap-modal .modal .btn-purple {
  width: 200px;
  margin: 0 auto
}

.main-sub {
  padding-top: 116px
}

.main-sub .article-sub {
  padding: 0 200px;
  margin-bottom: 60px
}

.main-sub .box-sub {
  padding: 60px 60px 0 60px;
  border: 1px solid #ddd;
  margin-bottom: 60px;
  font-family: "GongGothicLight";
  box-sizing: border-box;
  width: 100%
}

.main-sub .box-sub .head {
  font-family: "GongGothicMedium";
  display: flex;
  justify-content: space-between;
  align-items: center;
  line-height: 1;
  margin-bottom: 30px;
  color: #000
}

.main-sub .box-sub .head .title {
  font-size: 26px
}

.main-sub .box-sub .head .btn-modify {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 24px;
  color: #666;
  font-family: "GongGothicLight"
}

.main-sub .user-info {
  gap: 20px;
  margin-bottom: 15px;
}

.main-sub .user-info .profile {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden
}

.main-sub .user-info .profile img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

.main-sub .black {
  font-family: "GongGothicLight";
  font-size: 18px
}

.main-sub .gray {
  font-family: "GongGothicLight";
  font-size: 18px;
  color: #ada7bb
}

.main-sub .d-flex {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 20px;
  line-height: 1;
  margin-bottom: 30px
}

.main-sub .d-flex:nth-child(4) {
  margin-bottom: 60px;
}

.main-sub .d-flex .black {
  width: 68px
}

.main-sub .link {
  display: flex;
  align-items: center;
  font-family: "GongGothicLight";
  font-size: 16px;
  height: 74px;
  border-top: 1px solid #ebebeb;
  margin-top: -1px;
  gap: 16px
}

.main-sub .link .icon {
  width: 24px
}

.main-sub .link .icon img {
  width: 100%;
  display: block
}

.main-sub .link .arrow {
  margin-left: auto
}

.main-sub .article-ads {
  padding: 0 200px;
  margin-top: 0;
  margin-bottom: 30px
}

.main-sub .article-ads .link-ads {
  width: 100%
}

.main-sub .divider {
  width: 100%;
  height: 1px;
  background: #ddd;
  margin: 60px 0
}

.main-sub .box-secession .divider {
  margin: 30px 0
}

.main-sub .box-secession .box-btn .btn-gray,
.main-sub .box-secession .box-btn .btn-purple {
  width: auto;
  flex: 1
}

.main-sub .input-info {
  width: 100%;
  height: 50px;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 0 20px;
  font-family: "GongGothicLight";
  font-size: 16px;
  color: #000;
  margin-bottom: 20px;
  box-sizing: border-box
}

.main-sub .input-info::-moz-placeholder {
  color: #9b9b9b
}

.main-sub .input-info::placeholder {
  color: #9b9b9b
}

.main-sub .box-btn {
  margin-bottom: 60px
}

.main-sub .article-login {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(100vh - 222px);
  margin-bottom: 0
}

.main-sub .article-login .box-sub {
  margin-bottom: 0
}

.main-sub .article-login .box-btn {
  padding: 0;
  margin-bottom: 25px
}

.main-sub.main-login {
  padding-top: 56px
}

.main-sub.main-pwd .box-btn .btn-gray,
.main-sub.main-pwd .box-btn .btn-purple {
  width: auto;
  flex: 1
}

.main-sub.main-secession .desc {
  margin-bottom: 30px
}

.main-sub.main-secession .red {
  color: red;
  margin-bottom: 30px
}

.main-sub.main-secession .box-gray {
  padding: 30px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background: #f2f2f2
}

.main-sub.main-secession .box-gray .desc {
  margin-bottom: 0
}

.main-sub.main-secession .box-radio {
  display: flex;
  flex-wrap: wrap
}

.main-sub.main-secession .box-radio label {
  width: 50%;
  margin-bottom: 30px;
  color: #666;
  display: flex;
  align-items: center;
  line-height: 1
}

.main-sub.main-secession .input-radio {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 20px;
  height: 18px;
  display: block;
  background: url("/images/checked(0928).png");
  background-position: left;
  margin: 0;
  margin-right: 10px
}

.main-sub.main-secession .input-etc {
  margin-left: 8px;
  flex: 1;
  height: 30px;
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 0 10px;
  font-size: 14px;
  font-family: "GongGothicLight"
}

.main-sub.main-secession .input-etc::-moz-placeholder {
  color: #9b9b9b
}

.main-sub.main-secession .input-etc::placeholder {
  color: #9b9b9b
}

.main-sub.main-secession .box-btn button {
  flex: 1
}

.main-sub .box-support {
  min-height: calc(100vh - 342px)
}

.main-sub .box-support .head {
  align-items: center;
  justify-content: flex-start;
  gap: 20px;
  line-height: 1
}

.main-sub .box-support .head a {
  display: block
}

.main-sub .box-support .head .arrow {
  transform: rotate(180deg);
  display: block
}

.main-sub .box-support .head .icon-support {
  width: 27px
}

.main-sub .box-support .head .title {
  margin-top: 4px
}

.main-sub .box-support .purple-banner {
  font-size: 16px;
  color: #9676fe;
  font-family: "GongGothicLight";
  background: #f7f4ff;
  border-radius: 5px;
  height: 60px
}

.main-sub .box-support .box-filter .filter-list .filter-item {
  padding-left: 18px;
  text-align: left
}

.main-sub .box-list .box-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-bottom: 30px;
  border-bottom: 1px solid #ddd
}

.main-sub .box-list .box-title .list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: 30px
}

.main-sub .box-list .box-title .btn-delete {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 16px;
  font-family: "GongGothicLight";
  color: #282828
}

.main-sub .box-list input[type=checkbox] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 17px;
  height: 17px;
  display: block;
  border: 1px solid #e1e1e1;
  border-radius: 3px;
  margin: 0
}

.main-sub .box-list input[type=checkbox]:checked {
  background: #9676fe
}

.main-sub .box-list label,
.main-sub .box-list .label {
  display: flex;
  align-items: center;
  gap: 8px
}

.main-sub .box-list .btn-filter {
  height: 40px
}

.main-sub .box-list .gray {
  color: #aaa;
  font-size: 16px
}

.main-sub .box-list .list-body {
  color: #282828
}

.main-sub .box-list .list-body .category {
  color: #8e88a1
}

.main-sub .box-list .list-body .mt {
  margin-top: 60px
}

.main-sub .box-list .list-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 30px 0;
  width: 100%;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  margin-top: -1px;
  line-height: 1
}

.main-sub .box-list .list-item.item-support .completed {
  color: #9676fe
}

.main-sub .box-list .list-item.item-support .item-title {
  padding-left: 0
}

.main-sub .box-list .list-item.item-qna {
  padding: 0;
  margin-bottom: 0;
  margin-top: 30px;
  border: none;
  justify-content: flex-start
}

.main-sub .box-list .list-item.item-qna .link-qna {
  margin-left: 10px
}

.main-sub .box-list .list-item.item-qna .right {
  margin-left: auto
}

.main-sub .box-list .list-item.item-qna:nth-last-child(1) {
  margin-bottom: 60px
}

.main-sub .box-list .list-item.item-qna .item-info {
  margin-bottom: 0
}

.main-sub .box-list .list-item:nth-last-child(1) {
  border-bottom: 0;
  margin-bottom: 30px
}

.main-sub .box-list .list-item .item-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 20px
}

.main-sub .box-list .list-item .right {
  display: flex;
  gap: 8px
}

.main-sub .box-list .list-item .item-title .post-info {
  color: #b3b3b3;
  margin-top: 17px;
  gap: 15px;
}

.main-sub .box-list .list-item .right .completed {
  color: #9676fe
}

.main-sub .box-list .list-item .post-info .right {
  margin-left: auto;
}

.main-sub .box-list .list-item .item-title {
  padding-left: 25px;
  /*text-overflow:ellipsis; white-space:nowrap; overflow:hidden;*/
}

.main-sub .box-list .list-item .item-comment {
  padding-left: 28px;
  width: 100%;
  display: flex;
  gap: 10px;
  margin-top: 16px;
  box-sizing: border-box
}

.main-sub .box-list .list-item .item-comment span {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transform: translateY(4px)
}

.main-sub .box-list .list-item .status {
  display: flex;
  gap: 20px;
  margin-bottom: 20px
}

.main-sub .box-list .list-item .box-thumb {
  display: flex;
  gap: 30px;
  align-items: center
}

.main-sub .box-list .list-item .box-thumb .thumb {
  width: 60px;
  height: 60px;
  border-radius: 10px;
  overflow: hidden
}

.main-sub .box-list .list-item .box-thumb .thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

.main-sub .box-list .list-item .box-thumb .item-info {
  margin-bottom: 10px
}


/* 로그인시 메인 이벤트 팝업 231115 : s */
.modal_wrap.event_popup .show_btns {position:absolute; left:10px; top:10px;}
.modal_wrap.event_popup .show_btns button {background:#fff; padding:10px 30px; border-radius:10px;}

.modal_wrap.event_popup, .modal_wrap.write_popup {color: #333 !important; position: fixed; z-index: 1000; top: 0; left: 0; background: rgba(0,0,0,0.6); width: 100%; height: 100%;}
.modal_wrap.event_popup #my_modal, .modal_wrap.write_popup #my_modal {width: 810px; height: auto; max-height:80vh; overflow-y: auto; overflow-x:hidden; background-color: #fefefe; border-radius: 5px; position: relative; text-align: center; padding-top: 40px; margin: auto; top: 50%; transform:translateY(-50%);}
.modal_wrap.event_popup #my_modal .modal_close_btn {display: block; margin-top: 20px; background: #9676fe; padding: 20px 0; text-align: center; color: #fff; font-size: 25px; cursor: pointer; font-family: 'GongGothicLight';}
.modal_wrap.event_popup #my_modal h2 {color: #333 !important; font-size: 30px; font-family: 'GongGothicMedium'; margin: 0;}
.modal_wrap.event_popup #my_modal .mainTxt {font-size: 25px; font-family: 'GongGothicMedium'; margin-bottom: 20px; margin-top: 20px;}
.modal_wrap.event_popup #my_modal .mainTxt br.hidden {display:none;}
.modal_wrap.event_popup#my_modal.point .mainTxt {margin-top: 20px;}
.modal_wrap.event_popup #my_modal .subTxt a {color: #9676fe; text-decoration: underline;}
.modal_wrap.event_popup #my_modal .subTxt span { color: #777; padding:0 20px;}
.modal_wrap.event_popup #my_modal .mainTxt b {color:#9676fe; font-weight:normal;}
.modal_wrap.event_popup #my_modal .mainTxt {line-height:1.3em;}
.modal_wrap.event_popup #my_modal .mainTxt span {color:#9676fe;}
.modal_wrap.event_popup #my_modal form {padding-top:20px; padding-bottom:80px; position:relative;}
.modal_wrap.event_popup #my_modal form * {box-sizing:border-box;}
.modal_wrap.event_popup #my_modal form > div {width:calc(100% - 94px); margin:0 47px; display:flex; align-items:center; justify-content:flex-end;}
.modal_wrap.event_popup #my_modal form > div:not(:last-child) {margin-bottom:16px;}
.modal_wrap.event_popup #my_modal form .etc {display:block; border:1px solid #ccc; font-size:13px;  font-family: 'GongGothicLight'; padding:20px; text-align:left; word-break:break-all; margin:10px auto 25px !important;}
.modal_wrap.event_popup #my_modal form .etc li {position:relative; padding-left:8px;}
.modal_wrap.event_popup #my_modal form .etc li::before {content:'*'; position:absolute; left:0; top:5px; width:10px;}
.modal_wrap.event_popup #my_modal form .etc h3 {font-size:22px; margin:20px 0 0;}
.modal_wrap.event_popup #my_modal form .etc h3 br {display:none;}
.modal_wrap.event_popup #my_modal form label {display:inline-block; width:54px; padding-right:10px; text-align:right;}
.modal_wrap.event_popup #my_modal form input[type="text"],
.modal_wrap.event_popup #my_modal form input[type="number"],
.modal_wrap.event_popup #my_modal form input[type="tel"],
.modal_wrap.event_popup #my_modal form input[type="button"],
.modal_wrap.event_popup #my_modal form input[type="submit"] {-webkit-appearance: none; -moz-appearance: none; appearance:none; border:0; }
.modal_wrap.event_popup #my_modal form input[type="text"],
.modal_wrap.event_popup #my_modal form input[type="tel"],
.modal_wrap.event_popup #my_modal form input[type="number"] {width:calc(100% - 54px); background:#ebebeb; color:#444; height:45px; line-height:45px; padding:0  15px; font-family: 'GongGothicLight'; font-weight:normal; font-size:16px;}
.modal_wrap.event_popup #my_modal form input[type="text"]::placeholder,
.modal_wrap.event_popup #my_modal form input[type="number"]::placeholder {opacity:0.6;}
.modal_wrap.event_popup #my_modal .modal_close_btn {width:100%; height:69px; position:absolute; bottom:0; box-sizing:border-box;}
.modal_wrap.event_popup #my_modal form .submit_btn {width:100%; margin-top:34px;}
.modal_wrap.event_popup #my_modal form > .form_item.address {flex-wrap:wrap;}
.modal_wrap.event_popup #my_modal form > .form_item.address input[type="number"] {width:calc(100% - 54px - 126px);}
.modal_wrap.event_popup #my_modal form > .form_item.address input[type="button"] {width:100%; max-width:116px; margin-left:10px; background:#9676fe; color:#fff; height:45px; font-family:'GongGothicLight'; font-weight:normal; font-size:16px;}
.modal_wrap.event_popup #my_modal form > .form_item.address input[type="text"] {margin-top:16px;}
.modal_wrap.event_popup #my_modal .form_agree {display:block; text-align:left; width:calc(100% - 147px); margin:0 47px 0 100px;}
.modal_wrap.event_popup #my_modal .form_agree label {text-align:left; width:auto; display:inline-block; padding-right:0;}
.modal_wrap.event_popup #my_modal .form_agree input[type="checkbox"] {/*-webkit-appearance: none; -moz-appearance: none; appearance: none; width: 20px; height: 18px; display: inline-block; background: url('../../images/checked(0928).png') no-repeat left;*/ margin:0; transform: translateY(4px);}
.modal_wrap.event_popup #my_modal .form_agree input[type="checkbox"]:checked {background-position:right;}
.modal_wrap.event_popup #my_modal .form_agree label,
.modal_wrap.event_popup #my_modal .form_agree a,
.modal_wrap.event_popup #my_modal .form_agree p {font-family:'GongGothicLight'; font-size:14px; font-weight:300; color:#666;}
.modal_wrap.event_popup #my_modal .form_agree a {color:#333;}
.modal_wrap.event_popup #my_modal .form_agree p {font-size:13px; color:#999; letter-spacing:-0.03em; margin-top:7px; word-break:break-all;}
.modal_wrap.event_popup #my_modal .form_agree p::before {content:'*'; float:left; margin:4px 4px 0 0;}
.modal_wrap.event_popup .close_btn {position:absolute; left:calc(50% + 390px); transform:translateX(-50%); top:calc(10vh - 50px); font-size:40px; color:#fff;}

.modal_wrap.write_popup {display:none;}
.modal_wrap.write_popup.active {display:block;}
.modal_wrap.write_popup #my_modal {max-width:500px; border-radius:10px; padding:0;}
.modal_wrap.write_popup #my_modal p {padding:30px 20px 50px; font-family: 'GongGothicLight' !important;}
.modal_wrap.write_popup .popup_head {width:100%; line-height:50px; border-bottom:1px solid #ccc; padding:0 20px; word-break:keep-all; text-align:left; position:relative;}
.modal_wrap.write_popup .close_btn {position:absolute; right:20px; top:50%; transform:translateY(-50%);}
/* 로그인시 메인 이벤트 팝업, 게시글 작성 팝업 231117 : e */

/*팝업 모달*/
.sect_modal .modal {width: 602px;}
.sect_modal .modal-content {width: 600px; height:600px;}
.sect_modal .modal button {font-family:Arial;}

@media screen and (max-width: 1200px) {
  main article {
    padding: 0 30px
  }

  .box-btn {
    margin-bottom: 25px;
    padding: 0 15px
  }

  .box-btn button {
    /* width: auto;
    flex: 1 */
  }
	.main-write .box-btn * {
		width:50%;
	}

  .article-board {
    gap: 50px 40px
  }
	
  .article-board .article-top-banner {height:15.75vw;}
	.article-banner  {height:15.834vw; width:calc(100% - 60px); max-width:1140px; padding:0; margin:30px 30px 0;}

  .article-board .box-board {
    width: calc(50% - 20px)
  }

  .article-ads .link-ads {
    flex-direction: column;
    height: auto;
    flex-wrap: nowrap
  }

  .article-ads .link-ads .thumb {
    width: 100%
  }

  .article-ads .link-ads .info {
    width: 100%;
    padding: 22px 18px;
    display: flex;
	flex-direction:column;
    /* justify-content: space-between;
    align-items: center */
	position:relative;
  }

  .article-ads .link-ads .info .title {
    font-size: 14px
  }

  .article-ads .link-ads .info .desc {
    font-size: 11px;
	margin-bottom:0;
  }

  .article-ads .link-ads .info .more {
    font-size: 10px;
    gap: 10px;
	position:absolute;
	right:18px;
	top:50%;
	transform:translateY(-50%);
  }

  .article-ads .link-ads .info .more img {
    width: 5px !important
  }

  .article-ads .swiper-slide .link-ads {
    margin-bottom: 15px
  }

  .main-join .article-join {
    padding: 0 100px
  }

  .main-sub .article-sub {
    padding: 0 100px
  }
}
@media screen and (max-width:1000px){
	.line-purple .marquee > div {width:200%;}
	.line-purple .marquee .desc {width:50%; }
}
@media screen and (max-width: 768px) {
  .mo {
    display: block
  }
	.swiper_bbs .mo {display:flex !important;}

  .no-post .gray {
    margin-top: 15px
  }

  .btn-purple,
  .btn-gray {
    height: 42px;
    font-size: 12px;
    border-radius: 5px
  }

  .box-pagination {
    margin-bottom: 25px
  }

  .box-pagination .pagination .btn-page {
    width: 25px;
    height: 25px;
    font-size: 13px
  }

  .box-pagination .btn-next,
  .box-pagination .btn-prev {
    width: 25px;
    height: 25px
  }

  .wrap-common {
    display: flex;
    flex-direction: column
  }

  .wrap-common .article-search {
    order: 2
  }

  .btn-pop-search {
    font-size: 13px
  }

  header .color_logo {
    background-image: url("/images/bbs2/logo_purple.svg")
  }

  .box-info {
    font-size: 11px;
    flex-direction: column
  }

  .box-info .user-info {
    margin-bottom: 13px
  }

  .box-info .post-info {
    gap: 10px;
    width: 100%
  }

  .box-info .post-info span img {
    height: 9px
  }

  main article {
    padding: 0 15px
  }
	.main-detail .article-list.best {margin-bottom:40px;}

  main .mySwiper {
    padding: 0 15px;
    margin: 25px auto;
  }
  /*main .sticky-pin .mySwiper {
	margin: 10px auto 8px;
	transition:margin 0.3s ease;
	transition-delay:300ms;
  }*/

  main .mySwiper .swiper-slide {
    width: 48px
  }

  main .mySwiper .swiper-slide a {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    box-sizing: border-box;
  }

  .article-search {
    display: none
  }

  .article-search.active {
    display: block
  }
	.sticky-pin .article-search.active {margin-top:-10px;}

  .search {
    margin: 0 auto 25px auto;
    height: 30px
  }

  .search .box-category {
    width: 75px;
    border-radius: 5px 0 0 5px
  }

  .search .box-category .btn-category {
    width: 100%;
    font-size: 12px;
    padding: 0 10px
  }

  .search .box-category .btn-category img {
    width: 7.5px
  }

  .search .box-category .category-list {
    width: 75px;
    height: 180px;
    margin-bottom: 9px;
    padding-top: 10px;
    box-sizing: border-box
  }

  .search .box-category .category-list .category-item {
    font-size: 12px;
    margin-bottom: 10px
  }

  .search .box-input {
    border-radius: 0 5px 5px 0;
    padding: 0 10px
  }

  .search .box-input .search-input {
    font-size: 12px
  }

  .search .box-input .btn-search img {
    width: 15px
  }

  .search .box-input button {
    height: 15px
  }

  .search .category-list {
    width: 100%;
    margin-bottom: 9px
  }

  .search .category-list .category-item {
    font-size: 12px
  }

  .line-purple .desc {
    font-size: 12px
  }

  .line-purple .info::before {
    font-size: 14px
  }

  .purple-banner {
    height: auto;
    flex-direction: column;
    gap: 15px;
    padding: 15px;
    line-height: normal
  }

  .purple-banner .desc {
    font-size: 18px;
    text-align: center
  }

  .purple-banner .link {
    width: 100%;
    font-size: 18px
  }

  .article-board {
    gap: 25px 0;
    padding: 0 15px
  }

	/*.article-board .article-top-banner {height:31.25vw;} /*메인*/
	/*.article-banner {width:100%; height:31.25vw; margin:0 0 20px;} /*카테고리상세*/
	/*.test240116 .article-banner {height:32.554vw;} /*게시글*/
	.test240116 .article-banner {width:100%; margin:0 0 30px;}
		.main-post.test240116 .article-post .box-info.mo {margin-bottom:0 !important;}
	.article-banner.test-search {width:calc(100% - 30px); margin-left:auto; margin-right:auto;}
		/*.article-banner.test-search:not(.swiper-banner) {margin-top:-20px; margin-bottom:20px;}*/
	.article-banner.test-search.swiper-banner {margin-top:-20px; margin-bottom:20px;}

	.article-top-banner .banner-item img.pc_img, .article-banner .banner-item img.pc_img {display:none !important;}
	.article-top-banner .banner-item img.mo_img, .article-banner .banner-item img.mo_img {display:block !important;}

  .article-board .box-board {
    width: 100%;
    max-width: 100%
  }

  .article-board .box-board .post {
    height: 40px;
    padding: 0 15px
  }

  .article-board .box-board .post.mo {
    display: flex
  }

	.article-board .box-board.best .post .best_num {
		width:25px; padding-left:0; margin-right:0;
	}
	.article-board .box-board.best .post .best_cate {
		width:55px; margin-right:0;
	}
	.article-board .box-board.best .post .best_title {
		width:calc(100% - 25px - 55px - 40px);
	}
	.article-board .box-board.best .post:not(:last-child) {
		margin-bottom:10px;
	}
	.article-board .box-board.best .post .best_like {
		padding-right:0;
		font-size:8px;
	}

  .article-board .box-board .box-title {
    padding: 0 0 15px 0
  }

  .article-board .box-board .box-title .title {
    font-size: 17.5px
  }
  .main-detail .article-list.best .list-post li h4 {font-size:17.5px; margin:30px 0 10px;}

  .article-board .box-board .link {
    font-size: 12px
  }

  .article-board .box-board .view {
    font-size: 8px
  }

  .article-board .empty {
    height: 200px
  }

  .box-ads {
    width: 100%
  }

  .box-ads:nth-last-child(1) {
    margin-bottom: 25px
  }

  .box-ads .thumb {
    width: 100%;
    aspect-ratio: 744/389;
    border-radius: 10px 10px 0 0;
    overflow: hidden
  }

  .box-ads .thumb img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
  }

  .box-ads .info {
    background: #fff;
    border-radius: 0 0 10px 10px;
    padding: 10px 14px;
    font-size: 16px;
    font-family: "GongGothicLight";
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    line-height: 1;
    border: 1px solid #e7e7e7;
    border-top: none
  }

  .box-ads .info .title {
    font-size: 14px;
    margin-bottom: 6.5px
  }

  .box-ads .info .desc {
    color: #777;
    font-size: 11px
  }

  .box-ads .info .more {
    text-align: right;
    color: #ada7bb;
    display: flex;
    gap: 9px;
    justify-content: flex-end;
    align-items: center;
    font-size: 10px
  }

  .box-ads .info .more img {
    width: 5px;
    height: 8px
  }

  .box-filter .btn-filter {
    width: 100px;
    height: 30px;
    font-size: 12px;
    padding: 0 10px
  }

  .box-filter .filter-list {
    width: 100px;
    padding-top: 10px
  }

  .box-filter .filter-list .filter-item {
    font-size: 12px;
    margin-bottom: 10px;
    text-align: left;
    padding: 0 10px;
  }

  .main-detail .board-header {
    gap: 10px;
    margin-bottom: 25px
  }

  .main-detail .board-header .btn-write {
    flex: 1;
    width: auto;
    font-size: 12px;
    height: 30px
  }

  .main-detail .article-list .no-post {
    margin-top: 25px;
    margin-bottom: 65px;
    font-size: 13px
  }

  .main-detail .article-list .box-ads {
    margin: 25px 0
  }

  .main-detail .article-list .list-title {
    font-size: 17.5px;
    padding-bottom: 15px
  }

  .main-detail .article-list .item-post {
    font-size: 12px;
    padding: 16px 15px;
    margin-bottom: 10px
  }

  .main-detail .article-list .item-post .post-title {
    margin-bottom: 15px
  }

  .main-detail .article-list .item-post .post-content {
    margin-bottom: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: initial;
    line-height: 1.5;
	text-align:initial;
	word-break:break-all;
  }

  .main-detail .article-list .item-post .box-info {
    font-size: 11px;
    flex-direction: column
  }

  .main-detail .article-list .item-post .box-info .user-info {
    margin-bottom: 13px
  }

  .main-detail .article-list .item-post .box-info .post-info {
    gap: 10px;
    width: 100%
  }

  .main-detail .article-list .item-post .box-info .post-info span img {
    height: 9px
  }

  .main-detail .article-list .item-post .box-info .post-info span:nth-last-child(1) {
    margin-left: auto
  }

  .main-write {
    padding-top: 75px
  }

  .main-write article {
    padding: 0
  }

  .main-write .article-title {
    font-size: 17.5px;
    padding: 0 15px;
    padding-bottom: 15px;
    margin-bottom: 0px;
    border-bottom: 0
  }

  .main-write .box-border {
    height: 42px;
    padding: 0;
    margin-bottom: 0;
    border-right: none;
    border-left: none;
    margin-top: -1px
  }

  .main-write .btn-category {
    font-size: 12px
  }

  .main-write .box-category {
    padding: 0 15px
  }

  .main-write .box-category .btn-category {
    font-size: 12px
  }

  .main-write .box-category img {
    width: 9px
  }

  .main-write .box-category .category-list {
    height: 170px;
    padding: 15px;
    left: 0;
    box-sizing: border-box;
    text-align: left;
    border-radius: 0 0 5px 5px
  }

  .main-write .box-category .category-list .category-item {
    font-size: 12px;
    margin-bottom: 13px
  }

  .main-write .box-category .category-list .category-item:nth-last-child(1) {
    margin-bottom: 0
  }

  .main-write .input-title {
    font-size: 12px;
    padding-left: 15px
  }

  .main-write .box-gray {
    font-size: 12px
  }

  .main-write .box-textarea {
    margin-bottom: 25px;
    border: none;
    border-bottom: 1px solid #ddd
  }

  .main-write .box-textarea .box-head {
    padding: 0 15px;
    font-size: 13px;
    height: 42px
  }

  .main-write .box-textarea .box-head img {
    width: 12.5px
  }

  .main-write .box-textarea textarea {
    height: 400px;
    padding: 15px;
    font-size: 12px
  }

  .box-range{
    padding: 0 15px;
    border-bottom: 1px solid #dddddd;
    margin-bottom: 25px;
  }

  .box-range .range-title{
    font-size: 15px;
  }

  .box-range .range-value{
    font-size: 15px;
    margin-bottom: 25px;
    padding-left: 15px;
    padding-right: 15px;
    font-family: "GongGothicLight";
  }

  .box-range .label-range{
    margin: 30px 0 15px;
    margin-left: 15px;
    width: calc(100% - 30px);
  }
  
  .box-range .label-range input::-webkit-slider-thumb {
	width: 15px;
	height: 15px;
  }

  .main-write .box-btn {
    margin-bottom: 25px;
	gap:10px;
  }

  .main-post {
    padding-top: 75px
  }
	.main-post.test240116 .dp-media-preview_list {
		border-top:0; padding-bottom:30px;
	}

  .main-post .article-post .box-post {
    padding: 0;
    border: none
  }

  .main-post .article-post .category-type {
    font-size: 12px;
    margin-bottom: 15px
  }

  .main-post .article-post .category-type img {
    display: none
  }

  .main-post .article-post .box-info.mo {
    display: block;
    padding: 15px 0;
    position: relative;
    margin-bottom: 25px;
    margin-top: -1px
  }

  .main-post .article-post .box-info.mo::before {
    content: "";
    width: 100vw;
    height: 1px;
    background: #ddd;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%)
  }

  .main-post .article-post .box-info.mo::after {
    content: "";
    width: 100vw;
    height: 1px;
    background: #ddd;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%)
  }

  .main-post .article-post .box-info.mo:not(.notice) span:nth-last-child(1) {
    margin-left: auto
  }

  .main-post .article-post .post-header {
    padding: 0;
    border: none
  }

  .main-post .article-post .post-header .post-title {
    font-size: 17.5px;
    padding-top: 15px;
    margin-bottom: 15px;
    line-height: 1;
    position: relative
  }

  .main-post .article-post .post-header .post-title::after {
    content: "";
    width: 100vw;
    height: 1px;
    background: #ddd;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%)
  }

  .main-post .article-post .post-header .box-info {
    font-size: 12px
  }

  .main-post .article-post .post-header .user-info {
    padding-bottom: 15px;
    gap: 4px;
    position: relative;
    margin-bottom: 0
  }

  .main-post .article-post .post-header .user-info::after {
    content: "";
    width: 100vw;
    height: 1px;
    background: #ddd;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%)
  }

  .main-post .article-post .post-header .user-info img {
    width: 15px
  }

  .main-post .article-post .post-header .user-info .date {
    margin-left: auto
  }

  .main-post .article-post .post-info {
    gap: 10px;
    width: 100%;
    display: flex
  }

  .main-post .article-post .post-info span img {
    height: 12.5px;
    margin-top: -2px
  }

  .main-post .article-post .post-body {
    padding: 15px 0;
    font-size: 13px;
    height: 360px;
    position: relative;
    border-bottom: none;
  }
  .box-solution{
    padding-bottom: 25px;
    position: relative;
  }
  .box-solution::after {
    content: "";
    width: 100vw;
    height: 1px;
    background: #ddd;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%)
  }
  .box-solution p{
    margin-top: 25px;
    font-size: 15px;
  }

  .box-solution p span{
    color: #9579e0;
  }


  .main-post .article-post .post-body::after {
    content: "";
    width: 100vw;
    height: 1px;
    background: #ddd;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%)
  }
	.main-post .article-post .post-body.notice::after {display:none;}

  .main-post .article-input-comment {
    margin-top: 0
  }

  .main-post .box-btn {
    padding: 0;
    margin: 25px 0
  }

  .main-post .box-input {
    font-size: 12px
  }

  .main-post .box-input P {
    margin-bottom: 15px
  }

  .main-post .box-input .input-title {
    font-size: 15px;
    margin-bottom: 10px
  }

  .main-post .box-input textarea {
    padding: 15px;
    font-size: 12px
  }

  .main-post .article-list {
    padding: 0
  }

  .main-post .list-comment .box-filter {
    margin-left: 15px;
    margin-bottom: 15px
  }

  .main-post .list-comment .box-comment {
    padding: 13px 15px
  }

  .main-post .list-comment .box-comment .box-btn {
    margin: 15px 0 0 30px;
    padding: 0;
  }

  .main-post .list-comment .box-comment .box-input {
    height: 118px
  }

  .main-post .list-comment .box-comment .box-input textarea {
    height: 118px;
    border-radius: 5px;
  }

  .main-post .list-comment .box-comment.deleted {
    padding-bottom: 15px
  }

  .main-post .list-comment .box-comment.deleted .notice {
    height: 42px;
    font-size: 12px
  }

  .main-post .list-comment .comment {
    font-size: 13px
  }

  .main-post .list-comment .comment.recomment {
    padding-left: 43px
  }

  .main-post .list-comment .box-comment.deleted .comment.recomment {
    padding-right: 15px;
    padding-left: 58px;
    margin-top: 15px;
  }

  .main-post .list-comment .comment .user-info {
    margin-bottom: 0
  }

  .main-post .list-comment .comment .user-info .profile {
    width: 33px
  }

  .main-post .list-comment .comment .content {
    margin-bottom: 10px;
    padding-left: 43px
  }

  .main-post .list-comment .comment .post-info {
    font-size: 10px;
    padding-left: 43px
  }

  .main-post .list-comment .comment .btn-heart {
    gap: 4px
  }

  .main-post .list-comment .comment .btn-heart .heart {
    width: 12px;
    background-size: contain;
    margin-top: -1
  }

  .main-post .btn-more {
    height: 42px;
    font-size: 12px;
    margin-bottom: 0
  }

  .main-join {
    padding-top: 75px
  }

  .main-join .article-join {
    padding: 0 15px
  }

  .main-join .join_box {
    padding: 25px 15px;
    font-size: 13px
  }

  .main-join .join_box .title {
    font-size: 17.5px;
    margin-bottom: 15px
  }

  .main-join .join_box .join p.choose_txt {
    font-size: 12px;
    margin-bottom: 15px
  }

  .main-join .join_box .gender label {
    gap: 4px
  }

  .main-join .join_box table tbody input[type=radio], .choose_cate_wrap li input[type="checkbox"] {
    width: 12px !important;
    height: 12px !important;
    background-size: cover
  }

  .main-join .join_box table tbody .photo_area td {
    height: auto !important
  }

  .main-join .join_box table tbody .photo_area .pic {
    margin-bottom: 15px
  }

  .main-join .join_box table tbody .photo_area .pic label {
    margin-right: 22px
  }

  .main-join .join_box table tbody .photo_area .pic label:nth-last-child(1) {
    margin-right: 0
  }

  .main-join .join_box table tbody .photo_area .pic label span img {
    width: 45px;
    margin-bottom: 6px
  }

  .main-join .join_box table tbody td:not(.title) {
    height: 45px
  }

  .main-join .join_box table tbody td:not(.title)>a span {
    width: 60px !important;
    height: 28px;
    font-size: 11px
  }

  .main-join .join_box table tbody td:not(.title) input {
    font-size: 13px !important
  }

  .main-join .join_box table tfoot {
    font-size: 13px
  }

  .main-join .join_box table tfoot input[name=checkAll],
  .main-join .join_box table tfoot input[name=agree],
  .main-join .join_box table tfoot input[name=market_agree] {
    width: 12px !important;
    height: 12px !important;
    background-size: cover
  }

  .main-join .join_box table tfoot .agree {
    font-size: 13px;
    padding: 15px 0;
    height: auto
  }

  .main-join .join_box table tfoot .agree label {
    display: flex;
    align-items: flex-start;
    gap: 4px
  }

  .main-join .join_box table tfoot .agree input {
    transform: none
  }

  .main-join .join_box table tfoot .agree span {
    line-height: 1;
    flex: 1
  }

  .main-join .join_box table tfoot tr td {
    padding-top: 15px;
    font-size: 13px
  }

  .main-join .join_box table tfoot tr p.btn_see {
    font-size: 13px
  }

  .main-join .join_box table tfoot tr .check {
    padding-top: 15px;
    color: #666
  }

  .main-join .join_box table tfoot tr .check a {
    color: #666
  }

  .main-join .join_box table tfoot tr:nth-child(3) td {
    padding-top: 8px
  }

  .main-join .join_box .join_btn {
    margin-top: 25px
  }

  .main-join .join_box .box-btn {
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
    gap: 10px
  }

  .main-join .join_box .box-btn .btn-gray,
  .main-join .join_box .box-btn .btn-purple {
    height: 42px;
    border-radius: 5px
  }

  .main-join .join_box .btn-white {
    width: 100%;
    height: 42px;
    font-size: 12px;
    margin-top: 10px;
    border-radius: 5px
  }

  .wrap-modal .modal {
    width: 313px;
    height: 115px;
    padding: 20px 0
  }

  .wrap-modal .modal .msg {
    font-size: 13px;
    margin-bottom: 20px
  }

  .wrap-modal .modal .btn-purple {
    width: 182px;
    height: 42px
  }

  .wrap-modal .modal.modal-big {
    height: 134px
  }

  .main-sub {
    padding-top: 86px
  }

  .main-sub.main-pwd .box-btn {
    gap: 10px
  }

  .main-sub.main-pwd .input-info {
    border-radius: 5px
  }

  .main-sub .article-sub {
    padding: 0 15px;
    margin-bottom: 25px
  }

  .main-sub .box-sub {
    padding: 25px 15px 0 15px;
    margin-bottom: 25px
  }

  .main-sub .box-sub .head {
    margin-bottom: 10px
  }

  .main-sub .box-sub .head .title {
    font-size: 17.5px
  }

  .main-sub .box-sub .head .btn-modify {
    font-size: 15px
  }

  .main-sub .box-sub .head .btn-modify img {
    width: 17px
  }

  .main-sub .box-sub .user-info {
    gap: 10px
  }

  .main-sub .box-sub .user-info .profile {
    width: 30px;
    height: 30px;
    margin-right: 4px
  }

  .main-sub .box-sub .black {
    font-size: 15px
  }

  .main-sub .box-sub .gray {
    font-size: 15px
  }

  .main-sub .box-sub .d-flex {
    gap: 15px;
    margin-bottom: 15px
  }

  .main-sub .box-sub .d-flex .black {
    width: 54px
  }

  .main-sub .box-sub .link {
    height: 43px;
    font-size: 13px;
    gap: 15px
  }

  .main-sub .box-sub .link .icon {
    width: 19px
  }

  .main-sub .box-sub .link .arrow {
    width: 5.5px;
    display: block
  }

  .main-sub .article-ads {
    padding: 0 15px
  }

  .main-sub .desc {
    font-size: 12px
  }

  .main-sub .divider {
    margin: 25px 0
  }

  .main-sub .input-info {
    padding: 0 15px;
    height: 42px;
    margin-bottom: 12px;
    font-size: 13px
  }

  .main-sub .article-login {
    height: calc(100vh - 382px);
    margin-bottom: 0
  }

  .main-sub.main-secession {
    font-size: 12px
  }

  .main-sub.main-secession .desc {
    margin-bottom: 15px
  }

  .main-sub.main-secession .red {
    margin-bottom: 15px
  }

  .main-sub.main-secession .box-gray {
    padding: 15px
  }

  .main-sub.main-secession .box-radio label {
    width: 100%;
    font-size: 13px;
    margin-bottom: 15px;
    flex-wrap: wrap
  }

  .main-sub.main-secession .box-radio label:nth-last-of-type(1) {
    margin-bottom: 0
  }

  .main-sub.main-secession .box-radio label input {
    width: 12px;
    height: 12px;
    margin-right: 4px;
    background-size: cover
  }

  .main-sub.main-secession .box-radio label .input-etc {
    width: 100%;
    margin-top: 10px;
    flex: auto;
    height: 42px;
    font-size: 12px;
    margin-left: 0;
    border-radius: 5px;
    margin-right: 0
  }

  .main-sub.main-secession .box-btn {
    padding: 0;
    gap: 10px;
    margin: 25px 0
  }

  .main-sub .box-support {
    font-size: 13px
  }

  .main-sub .box-support .head {
    margin-bottom: 15px;
    gap: 10px
  }

  .main-sub .box-support .head .arrow {
    width: 6.5px
  }

  .main-sub .box-support .head .title {
    font-size: 17.5px
  }

  .main-sub .box-support .head .btn-modify {
    font-size: 15px
  }

  .main-sub .box-support .head .btn-modify img {
    width: 6.5px
  }

  .main-sub .box-support .head .icon-support {
    width: 19px
  }

  .main-sub .box-support .purple-banner {
    font-size: 13px;
    height: 50px;
    margin-bottom: 25px;
    border-radius: 10px
  }

  .main-sub .box-support .box-filter .filter-list .filter-item {
    padding-left: 10px
  }

  .main-sub .box-support .box-list .btn-filter {
    height: 30px
  }

  .main-sub .box-support .box-list .btn-filter img {
    width: 7.5px
  }

  .main-sub .box-support .box-list .box-title {
    padding-bottom: 15px
  }

  .main-sub .box-support .box-list .box-title .list-head {
    margin-top: 25px
  }

  .main-sub .box-support .box-list .box-title .btn-delete {
    font-size: 13px;
    gap: 5px
  }

  .main-sub .box-support .box-list .box-title .btn-delete img {
    width: 10px
  }

  .main-sub .box-support .box-list .box-title .gray {
    font-size: 13px
  }

  .main-sub .box-support .box-list input[type=checkbox] {
    width: 12px;
    height: 12px
  }

  .main-sub .box-support .box-list label,
  .main-sub .box-support .box-list label {
    gap: 6px
  }

  .main-sub .box-support .box-list .list-body .gray {
    font-size: 13px
  }

  .main-sub .box-support .box-list .list-body .mt {
    margin-top: 30px
  }

  .main-sub .box-support .box-list .list-item {
    padding: 15px 0
  }

  .main-sub .box-support .box-list .list-item.item-qna {
    padding: 0;
    margin-bottom: 0;
    margin-top: 25px;
    border: none
  }

  .main-sub .box-support .box-list .list-item.item-qna .item-info {
    margin-bottom: 0
  }

  .main-sub .box-support .box-list .list-item.item-qna:nth-last-child(1) {
    margin-bottom: 25px
  }

  .main-sub .box-support .box-list .list-item .item-info {
    margin-bottom: 6px
  }

  .main-sub .box-support .box-list .list-item .item-info .title {
    font-size: 13px;
    padding-left: 17px
  }

  .main-sub .box-support .box-list .list-item .status {
    margin-bottom: 10px;
    gap: 10px
  }

  .main-sub .box-support .box-list .list-item .box-thumb {
    gap: 18px
  }

  .main-sub .box-support .box-list .list-item .box-thumb .thumb {
    width: 50px;
    height: 50px
  }

  .main-sub .box-support .box-list .list-item .item-title {
    font-size: 13px;
    padding-left: 18px
  }

  .main-sub .box-list .list-item .item-title .post-info {
    margin-top: 10px;
    gap: 10px;
  }

  .main-sub .box-support .box-list .list-item.item-support .item-title {
    padding-left: 0
  }

  .main-sub .box-support .box-list .list-item .item-comment {
    font-size: 13px;
    padding-left: 18px;
    gap: 4px
  }

  .main-sub .box-support .box-list .list-item .item-comment img {
    width: 8.5px;
    height: 9px
  }

  .main-sub .box-support .box-list .list-item .item-comment span {
    transform: translateY(0)
  }

  .main-sub .no-post {
    margin-bottom: 135px
  }


	/* 로그인시 메인 이벤트 팝업 231115 : s */
	.modal_wrap.event_popup #my_modal {width: 90%; top: 50%; transform: translateY(-50%);}
	.modal_wrap.event_popup #my_modal > div img {width: 90%;}
	.modal_wrap.event_popup #my_modal .mainTxt {font-size: 20px; margin-bottom: 20px; margin-top: 20px;}
	.modal_wrap.event_popup #my_modal .subTxt {font-size: 0.7rem;}
	.modal_wrap.event_popup #my_modal form > div {margin:0 25px; width:calc(100% - 50px); font-size:14px;}
	.modal_wrap.event_popup #my_modal .form_agree {margin:0 25px 0 78px; width:calc(100% - 103px);}
	.modal_wrap.event_popup #my_modal form > div:not(:last-child) {margin-bottom:10px;}
	.modal_wrap.event_popup #my_modal form input[type="text"], .modal_wrap.event_popup #my_modal form input[type="number"] {height:34px; line-height:34px; font-size:14px; padding:0 7px;}
	.modal_wrap.event_popup #my_modal form > .form_item.address input[type="button"] {max-width:70px; height:34px; padding:0;}
	.modal_wrap.event_popup #my_modal form > .form_item.address input[type="text"] {margin-top:10px;}
	.modal_wrap.event_popup #my_modal form > .form_item.address input[type="number"] {width:calc(100% - 54px - 80px);}
	.modal_wrap.event_popup .close_btn {left:calc(50% + 42vw);}
	.modal_wrap.event_popup #my_modal form .etc {padding:12px; font-size:11px;}
	.modal_wrap.event_popup #my_modal form .etc h3 {font-size:16px; margin-top:10px;}
	.modal_wrap.event_popup #my_modal form .etc h3 br {display:inline-block;}
	/* 로그인시 메인 이벤트 팝업 231115 : e */

	.sect_modal .modal {width: calc(60% + 2px); padding:0;}
	.sect_modal .modal-content {width: 100%; height:60vw;}
	.sect_modal .modal-content.bbs {min-height:300px;}
}

@media all and (max-width:600px) {
	.modal_wrap.write_popup #my_modal {width:calc(100% - 40px); max-width:initial; margin:0 auto;}
}

@media all and (max-width:425px) {
	/* 로그인시 메인 이벤트 팝업 231115 : s */
	.modal_wrap.event_popup #my_modal .mainTxt {font-size: 17px; /*margin-bottom: 10px;*/}
	.modal_wrap.event_popup #my_modal .mainTxt br.hidden {display:inline-block;}
	.modal_wrap.event_popup #my_modal .subTxt {font-size: 0.7rem;}
	.modal_wrap.event_popup #my_modal .modal_close_btn {margin-top: 10px; }
	.modal_wrap.event_popup #my_modal .subTxt {padding:0 15px;}
	.modal_wrap.event_popup #my_modal form > div {margin:0 15px; width:calc(100% - 30px);}
	.modal_wrap.event_popup #my_modal .form_agree {margin:0 20px; width:calc(100% - 40px);}
	.modal_wrap.event_popup #my_modal .form_agree label {margin-top:10px;}
	.modal_wrap.event_popup #my_modal .form_agree label, .modal_wrap.event_popup #my_modal .form_agree a, .modal_wrap.event_popup #my_modal .form_agree p {font-size:12px;}
	.modal_wrap.event_popup #my_modal .form_agree p {letter-spacing:0; word-break: keep-all;}
	.modal_wrap.event_popup #my_modal form > div:not(:last-child) {margin-bottom:5px;}
	.modal_wrap.event_popup #my_modal form > .form_item.address input[type="text"] {margin-top:5px;}
	.modal_wrap.event_popup #my_modal form > .form_item.address input[type="button"] {max-width:54px; font-size:12px; margin-left:5px;}
	.modal_wrap.event_popup #my_modal form > .form_item.address input[type="number"] {width:calc(100% - 54px - 59px);}
	/* 로그인시 메인 이벤트 팝업 231115 : e */
}
@media all and (max-width:375px) {
	.sect_modal .modal-content.bbs {min-height:270px;}
}

/*# sourceMappingURL=style.css.map */