/* 폰트 */
@font-face {
  font-family: "Daehan-Bold";
  src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Daehan-Bold.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 100;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Thin.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Thin.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Thin.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Thin.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Thin.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 200;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraLight.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraLight.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraLight.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraLight.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraLight.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 300;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Light.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Light.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Light.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Light.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Light.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Regular.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Regular.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Regular.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Regular.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Regular.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Medium.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Medium.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Medium.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Medium.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Medium.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-SemiBold.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-SemiBold.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-SemiBold.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-SemiBold.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-SemiBold.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Bold.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Bold.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Bold.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Bold.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Bold.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 800;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraBold.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraBold.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraBold.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraBold.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-ExtraBold.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "Pretendard";
  font-weight: 900;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Black.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Black.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Black.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Black.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/pretendard/Pretendard-Black.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "KOHIBaeum";
  font-weight: normal;
  font-style: normal;
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/kohi/KOHIBaeum.eot");
  src: url("https://cdn.jsdelivr.net/gh/webfontworld/kohi/KOHIBaeum.eot?#iefix") format("embedded-opentype"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/kohi/KOHIBaeum.woff2") format("woff2"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/kohi/KOHIBaeum.woff") format("woff"),
    url("https://cdn.jsdelivr.net/gh/webfontworld/kohi/KOHIBaeum.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "Dokrip";
  src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Dokrip.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}


/* 팝업 ============================================================================ */
.pop-parent {
  display: block;
  position: fixed;
  top: 200px;
  right: 0;
  z-index: 999;
  transition: all .2s;
}


.pop-parent .m-ratioBox-wrap {
  width: 100%;
  padding-top: 100%;
  position: relative;
  overflow: hidden;
}

.pop-parent .m-ratioBox-wrap .m-ratioBox {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-size: cover;
  background-position: center;
}

.pop-parent .m-ratioBox-wrap img {
  display: block;
  width: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateY(-50%) translateX(-50%);
  z-index: 1;
}

.pop-parent .m-ratioBox-wrap iframe {
  width: 105%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateY(-50%) translateX(-50%);
  z-index: 1;
}

.pop-parent .swiper {
  overflow: visible;
}

.pop-parent .swiper-container {
  overflow: hidden;
}

.pop-parent .swiper-pagination {
  display: flex;
}

.pop-parent .pop {
  width: 400px;
  position: relative;
}

.pop-parent .pop .btn-toggle {
  width: 40px;
  height: 40px;
  position: relative;
  background-color: black;
  cursor: pointer;
}

.pop-parent .pop .btn-toggle img {
  width: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-90deg);
  transition: all .3s;
}

.pop-parent .pop-btns {
  display: flex;
  position: absolute;
  top: 80px;
  left: -120px;
  background-color: #3c3c3c;
  opacity: 1;
  transform: rotate(90deg);
}

.pop-parent .pop-btns a {
  color: #fff;
  padding: 7px 14px;
}

.pop-parent .pop-btns #oneday_check {
  position: absolute;
  clip: rect(0, 0, 0, 0);
}

.pop-parent .pop-btns #oneday_check+label {
  display: flex;
  align-items: center;
  padding: 0 10px;
  font-size: 14px;
  color: #fff;
  cursor: pointer;
}

.pop-parent .pop-btns #oneday_check+label:before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-right: 10px;
  border: 1px solid #fff;
}

.pop-parent .pop-btns #oneday_check:checked+label .icon {
  position: absolute;
  left: 7px;
  top: 7px;
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url('/img/check_checked.png') no-repeat center center
}

.pop-parent .pop .swiper-btn-control {
  width: 8px;
  height: 11px;
  margin-left: 16px;
  position: relative;
  top: 2px;
}

.pop-parent .swiper-control {
  display: flex;
  align-items: center;
  position: absolute;
  top: 21px;
  right: 20px;
  z-index: 2;
}

.pop-parent .swiper-control .swiper-pagination {
  position: static;
}

.pop-parent .swiper-pagination-bullet {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  border-radius: 0;
  border: 1px solid white;
  opacity: 0.5;
  background-color: transparent;
}

.pop-parent .swiper-pagination-bullet-active {
  background-color: #fff;
  opacity: 1;
}

.pop-parent.active {
  right: -400px;
}

.pop-parent.active .btn-toggle {
  transform: rotate(180deg);
}

@media screen and (max-width:1200px) {
  .pop-parent .pop {
    width: 310px;
  }

  .pop-parent.active {
    right: -310px;
  }
}








.content {
  position: relative;
  display: flex;
  justify-content: space-between;
  margin-top: 138px;
}

.content .tit-box {
  display: flex;
}

.content .tit-box h2,
.content .tit-box p,
.content .tit-box span {
  color: #fff;
}

.content .tit-box h2 {
  font-family: "Dokrip";
  font-size: 56px;
  font-weight: normal;
}

.content .tit-box p {
  margin-top: 40px;
  font-weight: 600;
  font-size: 24px;

}

.content .tit-box span {
  font-weight: 300;
  font-size: 16px;
  margin-top: 8px;
  word-break: keep-all;
}

.content .tit-box .family-link {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 80px;
}

.content .tit-box .family-link li {
  display: flex;
  width: 210px;
  height: 40px;
  background-color: #fff;
  opacity: 0.3;
}

.content .tit-box .family-link li.active {
  width: 240px;
  height: 40px;
  background-color: #fff;
  opacity: 1;
}

.content .tit-box .family-link li.active a,
.content .tit-box .family-link li.active a span {
  color: #202020;
  font-weight: 600;
}

.content .tit-box .family-link li:hover {
  width: 240px;
  height: 40px;
  background-color: #fff;
  opacity: 1;
  transition: 0.5s;
}

.content .tit-box .family-link li:hover a,
.content .tit-box .family-link li:hover a span {
  color: #202020;
  font-weight: 600;
}

.content .tit-box .family-link li a {
  display: flex;
  align-items: center;
  padding-left: 24px;
  color: #808080;
  font-size: 20px;
  opacity: 1;
  width: 100%;
}

.content .tit-box .family-link li a span {
  padding-left: 12px;
  color: #808080;
  font-size: 20px;
  margin-top: 0;
}

.content .cont-box {
  display: flex;
  gap: 40px;
}

.content .cont-box .img-box {
  display: flex;
  gap: 28px;
  max-width: 590px;
}

.content .cont-box {
  position: relative;
  display: flex;
  max-width: 1160px;
  padding-top: 80px;
}

.content .cont-box .img-box img {
  width: 217px;
  height: 229px;
  object-fit: cover;
}

.content .cont-box .img-box img .content .cont-box .img-box .left-img {
  margin-top: 118px;
}

.content .cont-box .txt-ci {
  display: flex;
  flex-direction: column;
  justify-content: end;
}

.content .cont-box .ci-img {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 24px;
}

.content .cont-box .ceo-img .big {
  width: 458px;
  height: 348px;
}

.content .cont-box .ceo-img .small {
  width: 217px;
  height: 204px;
}

.content .cont-box .img-box .right-img {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.content .cont-box .txt-box {
  position: relative;
}

.content .ceo-box .txt-box {
  max-width: 425px;
}

.content .ceo-box .img-box {
  width: 100%;
  max-width: 336px;
  max-height: 335px;
}

.content .ceo-box .img-box img {
  width: 100%;
  height: unset;
}


.content .cont-box h3 {
  color: #fff;
  font-weight: 500;
  font-size: 24px;
  line-height: 1.33;
  word-break: keep-all;
}

.content .cont-box p {
  margin-top: 80px;
  line-height: 1.5;
  color: #fff;
  font-size: 16px;
  font-weight: 200;
  word-break: keep-all;
}

.content .cont-box .last {
  display: flex;
  margin-top: 30px;
  align-items: center;
}

.content .cont-box .last span {
  padding-left: 24px;
  font-size: 32px;
  color: #fff;
  font-family: "epilogue-210, sans-serif;";
}







.abooutSwiper .swiper-slide {
  width: 1160px;
  max-height: 600px;
}

.abooutSwiper .swiper-slide .box1 img {
  width: 217px;
  height: 229px;
}

.content-scroll::-webkit-scrollbar {
  display: none;
  /* Chrome , Safari , Opera */
}

.content-scroll {
  overflow: hidden;
  overflow-y: scroll;
  height: 600px;
  -ms-overflow-style: none
    /* IE and Edge */
  ;
}

.family-scroll {
  max-width: 1160px;
  width: 100%;
}

.content-scroll .box2 {
  margin-top: 254px;
}

.content-scroll .box3 {
  margin-bottom: 240px;
}

.family-wrap .content-scroll .cont-box .left-img {
  margin-top: 0;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 10.05%;
}

.family-wrap .content-scroll .cont-box .left-img img {
  width: 100%;
  height: auto;
  position: absolute;
  left: 0;
  top: 0;
}

.family-wrap .content .cont-box {
  gap: 55px;
}

.family-wrap .content .cont-box p {
  margin-top: 0;
}

.family-wrap .content .txt-box {
  margin-top: 18px;
}

.family-wrap .content .txt-box h3 {
  font-size: 56px;
  font-family: "Dokrip";
}

.family-wrap .content .txt-box p {
  margin-top: 16px;
  line-height: 1.56;
  font-size: 18px;
  font-weight: 300;
  word-break: keep-all;
}

.family-wrap .content .list-wrap {
  margin-top: 56px;
  gap: 16px;
  display: flex;
  flex-direction: column;
}

.family-wrap .content .list-wrap li .list-box {
  display: flex;
}

.family-wrap .content .list-wrap li .list-box p {
  position: relative;
  padding-left: 0px;
  margin-top: 0;
}

.family-wrap .content .list-wrap li {
  display: flex;
  gap: 37px;
}

.family-wrap .content .list-wrap li p {
  position: relative;
  margin-top: 0;
  font-size: 16px;
  font-weight: 600;
  padding-left: 12px;
}

.family-wrap .content .list-wrap li p::before {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  background-color: #fff;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
}

.family-wrap .content .list-wrap li .two::before {
  top: 22%;
}

.family-wrap .content .list-wrap li .three::before {
  top: 16%;
  left: 0;
}

.family-wrap .content .list-wrap li span {
  line-height: 1.5;
  font-weight: 200;
  font-size: 16px;
  color: #fff;
  opacity: 0.6;
  word-break: keep-all;
}

.family-wrap .content .list-wrap li:first-child {
  gap: 24px;
}

.community-wrap .tit-box h2 {
  color: #20381c;
  width: 344px;
}

.community-wrap .tit-box .title-about {
  color: #202020;
}

.community-wrap .tit-box p {
  color: #202020;
}

.community-wrap .tit-box span {
  color: #333333;
  font-weight: 300;
  line-height: 1.5;
}

.community-wrap #header .header-wrap .gnbBtn {
  color: #202020;
  text-align: center;
}

/* .community-wrap .header-wrap {
  border-bottom: 1px solid #202020;
} */
.community-wrap .tit-box .community-link li.active {
  background-color: #202020;
}

.community-wrap .tit-box .community-link li.active a {
  color: #fff;
}

.community-wrap .tit-box .community-link li {
  background-color: #808080;
  opacity: 0.4;
}

.community-wrap .tit-box .community-link li a {
  color: #202020;
  width: 100%;
}

.community-wrap .content .tit-box .family-link li:hover {
  width: 240px;
  background-color: #202020;
  opacity: 1;
  transition: 0.5s;
}

.community-wrap .content .tit-box .family-link li:hover a,
.community-wrap .content .tit-box .family-link li:hover a span {
  color: #fff;
  font-weight: 600;
}

.community-content {
  justify-content: unset;
  gap: 112px;
  padding: 0 24px;
  padding-bottom: 200px;
}

.community-content .content-box {
  margin-top: 85px;
}

.community-content .content-box h3 {
  font-size: 32px;
  color: #303a32;
  margin-bottom: 8px;
}

.community-content .content-box span {
  font-size: 152px;
  font-weight: bold;
  color: #e2e2e2;
  padding-top: 8px;
}

.community-content .content-box p {
  font-size: 24px;
  color: #20381c;
  margin-top: 16px;
  line-height: 1.33;
  font-weight: bold;
}

.history {
  display: flex;
  width: 100%;
  margin-bottom: 200px;
}

.history .content-scroll {
  margin-top: 124px;
  width: 100%;
  height: 1115px;
}

.history .content-scroll .year {
  font-size: 152px;
  font-weight: bold;
  z-index: 2;
  color: #20381c;
}

.history .content-scroll .community_list {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-top: 40px;
  border-bottom: 1px solid #20381c;
  padding-bottom: 48px;
}

.history .content-scroll .community_list li {
  display: flex;
}

.history .content-scroll .community_list li p {
  font-size: 16px;
  font-weight: bold;
  line-height: 1.5;
  color: #20381c;
}

.history .content-scroll .community_list li span {
  padding-left: 20px;
  color: #888888;
  font-weight: 500;
  line-height: 1.5;
  word-break: keep-all;
}

.history .content-scroll .box {
  position: relative;
  display: flex;
}

.history .content-scroll .box:not(:first-child) {
  margin-top: 88px;
}

.history .content-scroll .box:last-child {
  margin-bottom: 72px;
}

/* .history .content-scroll .box .img-box {
  margin-left: 100px;
}
.history .content-scroll .box .img-box img {
  padding-top: 60px;
  object-fit: cover;
} */

.history .content-scroll .box .img-box {
  position: relative;
}

.history .content-scroll .box .img-box::before {
  width: 100%;
  display: block;
  content: "";
  padding-top: 35.9559%;
}

.history .content-scroll .box .img-box img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  max-height: 380px;
  object-fit: cover;
  object-position: center;
}

/* 이미지가 없는 경우 */
.history .inner-wrap {
  margin-top: 132px;
  margin-left: -97px;
  z-index: 1;
}

/* 이미지 있는 박스 */
.history .img-in-box .inner-wrap {
  margin-top: 84px;
}

.history .content-scroll .box .txt-box .year {
  position: absolute;
  top: 0;
  left: 0;
}

.content .content-scroll .manager-img {
  margin-top: 80px;
}

.content .content-scroll .manager-img .img-box img {
  width: 1100px;
  height: 587px;
}

.content .manager-box {
  text-align: center;
  margin-top: 0;
}

.content .manager-box h3 {
  color: #fff;
}

.content .manager-box p {
  color: #fff;
  font-weight: 300;
  font-size: 18px;
  margin-top: 16px;
}

/* direction */

.intro-box {
  position: sticky;
  top: 400px;
  display: flex;
  gap: 40px;
  flex-direction: column;
  padding-top: 120px;
  padding-bottom: 54px;
  /* top: 617px; */
}

/*
.content .tit-box  {
  max-height: calc(100% - 240px);
} */

.intro-box li i,
.content .tit-box .intro-box li p {
  font-size: 18px;
}

.intro-box li i {
  margin-right: 8px;
}

.intro-box li {
  font-weight: 600;
  font-size: 18px;
}

.content .tit-box .intro-box li p {
  font-size: 16px;
  line-height: 1.5;
  margin-top: 12px;
  margin-bottom: 8px;
}

.content .tit-box .intro-box li span {
  padding-top: 8px;
  font-size: 16px;
  font-weight: 300;
}

.direction-box {
  position: relative;
  width: 100%;
  padding-top: 85px;
  max-width: 1160px;
}

.direction-box .map {
  height: 680px;
  width: 100%;
  background-color: red;
}

.direction-box .use {
  margin-top: 56px;
}

.direction-box .use .tit {
  font-size: 24px;
  font-weight: 600;
  padding-bottom: 16px;
  width: 100%;
  border-bottom: 1px solid #202020;
  margin-top: 40px;
}

.direction-box .use li .load-box {
  display: flex;
  gap: 62px;
  padding-left: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid #c5c5c5;
}

.direction-box .use li .load p,
.direction-box .use li {
  margin-top: 17px;
}

.direction-box .use li {
  font-size: 16px;
  font-weight: 300;
  word-break: keep-all;
  line-height: 1.43;
}

.direction-box .use li .load-box-plus {
  border: none;
  margin-bottom: 200px;
}

.load-box ul li span {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  width: 20px;
  height: 20px;
  background-color: #f77636;
  border-radius: 50%;
}

.load-box ul li span.n1 {
  background-color: #263c96;
}

.load-box ul li span.n5 {
  background-color: #8936e0;
}

.load-time li {
  display: flex;
  gap: 8px;
  align-items: center;
}

.load-box .load p {
  font-weight: 500;
  min-width: 42px;
}

/* swiper double slide */

.swiper {
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}

.swiper-slide {
  background-size: cover;
  background-position: center;
}

.thumbSwiper2 {
  margin-top: 16px;
  /* height: 75%; */
  width: 100%;
  z-index: 0;
  max-width: 1920px;
}

.thumbSwiper {
  /* height: 25%; */
  box-sizing: border-box;
  margin-top: 16px;
  padding-top: 24px;
  padding-bottom: 24px;
}

.under {
  border-top: 1px solid rgba(255, 255, 255, 0.32);
}

/*
.swiper-wrapper {
  max-height: 180px;
} */

.mobile-icon {
  display: none;
}

.next-slide {
  display: flex;
  align-items: center;
  flex-direction: column;
  padding-top: 52px;
}

.swiper-wrapper .next-slide:first-child img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.swiper-wrapper .next-slide img {
  width: 37px;
  height: 32px;
  object-fit: contain;
}

.slide-swiper {
  /* max-height: 593px; */
  margin-top: 16px;
}

.next-slide:nth-child(n + 2) {
  border-left: 1px solid #cacaca;
}

.next-slide:last-child {
  border-right: 1px solid #cacaca;
}

.slide-swiper .swiper-slide {
  display: flex;
  justify-content: center;
}

.slide-swiper .swiper-slide img {
  /* max-height: 593px; */
  object-fit: cover;
  z-index: -1;
  height: 100%;
}

.slide-swiper .slide-content {
  display: flex;
  flex-direction: column;
  text-align: center;
  position: absolute;
  /* padding-top: 156px; */
  /* padding-top: 8%; */
  padding-top: 136px;
}

.slide-swiper .slide-content .tit {
  font-size: 56px;
  color: #fff;
  font-weight: normal;
  font-family: "Dokrip";
}

.slide-swiper .slide-content .sub-tit {
  font-size: 28px;
  color: #fff;
  padding-top: 20px;
  font-family: "Dokrip";
  font-weight: normal;
}

.slide-swiper .slide-content .bold-txt::before {
  position: absolute;
  content: "";
  width: 1px;
  height: 56px;
  color: #fff;
  background-color: #fff;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
}

.slide-swiper .slide-content .bold-txt {
  position: relative;
  margin-top: 32px;
  padding-top: 88px;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  line-height: 1.5;
}

.slide-swiper .slide-content p {
  position: relative;
  color: #fff;
  padding-top: 24px;
  line-height: 1.71;
  font-weight: 200;
  font-size: 14px;
}

.next-slide:first-child span,
.next-slide:first-child p {
  color: #f0e4c2;
}

.next-slide:first-child p {
  font-size: 20px;
}

.next-slide:first-child span {
  font-size: 16px;
}

.next-slide .num {
  margin-top: 20px;
  color: #fff;
}

.next-slide .text {
  margin-top: 16px;
  font-size: 18px;
  font-weight: 500;
  text-align: center;
  color: #fff;
  line-height: 1.33;
}

.down-wrapper .swiper-slide {
  width: 25%;
  position: relative;
  height: 180px;
  padding-top: 24px;
  max-height: 180px;
  cursor: pointer;
}

.down-wrapper .swiper-slide-thumb-active {
  background-color: #20381c;
}

.down-wrapper .swiper-slide:first-child {
  justify-content: center;
  padding-top: 0;
}

.fir-slide-wrap img {
  width: 100%;
  max-width: 106px;
}

/* .down-wrapper .swiper-slide-thumb-active:first-child {
  background-color: #000;
} */

.down-wrapper .swiper-slide-thumb-active .num,
.down-wrapper .swiper-slide-thumb-active .text {
  color: #f0e4c2;
}

.down-wrapper .swiper-slide-thumb-active img {
  display: none;
}

.down-wrapper .swiper-slide-thumb-active .activeImg {
  display: block !important;
}

.down-wrapper .swiper-slide .activeImg {
  display: none;
}

.container .slide-swiper .slide-wrap {
  justify-content: flex-start;
}

.container .slide-swiper .slide-wrap .slide-text-box {
  padding-top: 48px;
  display: flex;
  flex-direction: column;
}

.container .slide-swiper .slide-wrap .slide-text-box h3 {
  font-size: 56px;
  color: #fff;
  font-weight: normal;
  font-family: "Dokrip";
}

.container .slide-swiper .slide-wrap .slide-text-box p {
  margin-top: 40px;
  color: #fff;
  font-weight: 600;
  font-size: 24px;
}

.container .slide-swiper .slide-wrap .slide-text-box span {
  padding-top: 8px;
  font-size: 16px;
  color: #fff;
  line-height: 1.5;
  font-weight: 300;
  height: 497px;
  word-break: keep-all;
}

.slide-swiper .slide-wrap {
  gap: 204px;
}

.slide-wrap .slide-img-box {
  position: relative;
  display: flex;
  gap: 16px;
}

/* .slide-wrap .slide-img-box img {
  max-height: 497px;
} */
.slide-wrap .slide-img-box .img-text {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 36px 122px 36px 40px;
  background-color: rgba(0, 0, 0, 0.6);
}

.slide-wrap .slide-img-box .img-text-type2 {
  bottom: 169px;
}

.slide-wrap .slide-img-box .img-text p {
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  padding-bottom: 16px;
}

.slide-wrap .slide-img-box .img-text span {
  font-size: 16px;
  font-weight: 200;
  line-height: 1.5;
  color: #fff;
}

.slide-wrap .slide-img-box.two .left-img {
  /* width: 100%; */
  max-width: 647px;
  height: 497px;
}

.slide-wrap .slide-img-box.two .left-img img {
  width: 100%;
}

.slide-wrap .slide-img-box.two .right-img {
  width: 497px;
  height: 497px;
}

.slide-wrap .slide-img-box.three .right-img {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 60%;
}

.slide-wrap .slide-img-box.three .left-img {
  width: 40%;
  max-width: 444px;
  max-height: 497px;
}

.slide-wrap .slide-img-box.three .left-img img {
  width: 100%;
  height: 100%;
}

.slide-wrap .slide-img-box.three .right-img:first-child {
  width: 100%;
  max-width: 700px;
  height: 210px;
}

.slide-wrap .slide-img-box.three .right-img img {
  width: 100%;
  height: 100%;
}

.slide-wrap .slide-img-box.three .right-img .type1 {
  height: 100%;
  max-height: 210px;
}

.slide-wrap .slide-img-box.three .right-img .type2 {
  height: 100%;
  max-height: 270px;
}

.slide-wrap .slide-img-box.three .right-img:last-child {
  width: 100%;
  max-width: 700px;
  height: 273px;
  margin-top: 16px;
}

.slide-wrap .container {
  padding: 0 24px;
}

.slide-wrap .start-swiper {
  height: 593px;
}

.slide-swiper .swiper-num-1 {
  width: 100%;
  height: 100%;
  background-image: url('/images/slide_img01.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.slide-swiper .swiper-num-2 {
  height: 497px;
}

.slide-swiper .swiper-num-2 img {
  height: 100%;
}

/* .container .slide-swiper .slide-3-wrap {
  justify-content: space-between;
} */

.slide-wrap .box-3column {
  max-height: 497px;
  width: calc(100% - 540px);
  max-width: 1172px;
}


.slide-wrap .box-3column img {
  width: calc(100% / 3);
  max-width: 380px;
}

.slide-wrap .container {
  max-width: 1600px;
}

.slide-wrap .slide-img-box .complete-img {
  max-height: 497px;
}

.slide-wrap .slide-img-box .complete-img.left-img {
  max-width: 320px;
  max-height: 253px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}


.slide-wrap .slide-img-box.three .complete-img {
  max-width: 774px;
}

.slide-wrap .slide-img-box .complete-img .type2 {
  max-height: 228px;
}



.slide-wrap .mb {
  display: none;
}

.swiper-btn-wrap {
  display: none;
}

.slide-wrap .slide-info {
  display: none;
}

.slide-wrap .slide-img-box .re-img-text {
  right: -32px;
}

@media screen and (max-width: 1280px) {
  .slide-swiper .slide-wrap {
    gap: 124px;
  }

  .slide-wrap .slide-img-box .img-text {
    padding: 18px 62px 18px 24px;
  }

  .container .slide-swiper .slide-wrap .slide-text-box h3 {
    font-size: 35px;
  }

  .container .slide-swiper .slide-wrap .slide-text-box p {
    margin-top: 34px;
    font-size: 20px;
  }

  .container .slide-swiper .slide-wrap .slide-text-box span {
    font-size: 12px;
    height: 459px;
  }

  .slide-wrap .slide-text-box .pc {
    display: none;
  }

  .slide-wrap .slide-img-box .img-text-type2 {
    bottom: 100px;
  }

}

@media screen and (max-width: 1080px) {

  .container .slide-swiper .slide-wrap {
    flex-direction: column;
  }

  .slide-swiper .swiper-num-1 {
    background-image: url('/images/slide_img01-m.png');
  }

  .container .slide-swiper .slide-wrap .slide-text-box {
    padding-top: unset;
  }

  .slide-wrap .pc {
    display: none;
  }

  .slide-wrap .mb {
    display: flex;
  }

  .slide-wrap .slide-img-box.three .right-img.pc {
    display: none;
  }

  .slide-wrap .slide-img-box.three .left-img {
    width: 100%;
    max-width: unset;
    max-height: unset;
  }

  .container .slide-swiper .slide-wrap .slide-text-box p {
    font-size: 18px;
  }

  .under {
    display: none;
  }

  .slide-swiper {
    margin-top: unset;
    /* max-height: 522px; */
  }



  .thumbSwiper2 {
    margin-top: unset;
    padding-top: 96px;
    padding-bottom: 65px;
  }

  .slide-swiper .slide-content .tit {
    font-size: 35px;
  }

  .slide-swiper .slide-content .sub-tit {
    font-size: 18px;
    padding-top: 10px;
  }

  .slide-swiper .slide-content .bold-txt {
    margin-top: 20px;
    padding-top: 44px;
    font-size: 14px;
  }

  .slide-swiper .slide-content .bold-txt::before {
    height: 25px;
  }

  .slide-swiper .slide-content p {
    font-size: 13px;
    line-height: 1.54;
  }

  /* .slide-swiper .slide-content {
  padding-top: 106px;
} */

  .slide-swiper .slide-content {
    padding-top: unset;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
  }

  .slide-wrap .slide-img-box .img-text {
    display: none;
  }

  .slide-wrap .slide-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-top: 25px;
  }

  .slide-wrap .info-icon {
    max-width: 37px;
  }

  .slide-wrap .slide-info .text {
    font-size: 18px;
    font-weight: 300;
    color: #f0e4c2;
    margin-top: 20px;
    line-height: 1.33;
  }

  .slide-wrap .slide-info .bold {
    font-size: 18px;
    font-weight: 500;
    color: #f0e4c2;
  }

  .slide-wrap .slide-info .content {
    font-size: 14px;
    font-weight: 200;
    line-height: 1.57;
    color: #f0e4c2;
    text-align: center;
    padding-top: unset;
    margin-top: 15px;
  }

  .swiper-button-next::after,
  .swiper-button-prev::after {
    display: none;
  }



  .swiper-btn-wrap {
    position: relative;
    width: 74%;
    height: 40px;
    margin: 50px auto 0;
    display: flex;
    align-items: center;
    justify-content: space-around;
  }

  .swiper-btn {
    position: unset;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.28);
    z-index: 99;
  }

  .swiper-btn i {
    font-size: 20px;
    color: #fff;
  }

  .swiper-pagination {
    color: #fff;
    line-height: 40px;
  }

  .swiper-pagination * {
    color: #fff;
  }

  .slide-swiper .slide-wrap {
    gap: unset;
  }

  .slide-swiper .swiper-num-2 {
    height: unset;
  }

  .container .slide-swiper .slide-wrap .slide-text-box span {
    height: unset;
    margin-bottom: 30px;
    font-size: 12px;
  }

  .slide-wrap .start-swiper {
    height: unset;
  }

  .slide-wrap .slide-img-box.two .left-img {
    max-width: unset;
    height: 100%;
  }

  .slide-wrap .box-3column {
    width: 100%;
    max-height: unset;
    max-width: unset;
  }

  .slide-wrap .box-3column img {
    width: 100%;
    max-width: unset;
  }
}

.community-content .inner-wrap {
  width: calc(100% - 375px);
}


.community-box {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

.community-box li {
  display: flex;
  max-width: 370px;
  width: calc((100% - 24px * 2) / 3);
}

.community-box li:nth-child(n + 4) {
  margin-top: 24px;
}

.community-box li a {
  width: 100%;
}

.community-box li a .img-box {
  width: 100%;
  max-width: 370px;
  max-height: 307px;
  position: relative;
}


.community-box li a .img-box::before {
  width: 100%;
  display: block;
  content: "";
  padding-top: 83.19%;
}

.community-box li a .img-box img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}


.community-box li a p {
  padding-top: 18px;
  padding-bottom: 12px;
  font-weight: bold;
  font-size: 18px;
  word-break: keep-all;
  line-height: 1.43;
}

.community-box li a span {
  line-height: 1.43;
  font-size: 14px;
}

.news-detail {
  display: flex;
  flex-direction: column;
  margin-top: 64px;
}

.news-detail .detail-day {
  opacity: 0.5;
  font-size: 24px;
  font-weight: 300;
}

.news-detail .detail-tit {
  margin-top: 16px;
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 72px;
}

.news-detail img {
  /* margin-top: 72px;
  object-fit: cover; */
  max-width: 1003px;
  /* height: 598px; */

}

.news-detail .txt-box {
  margin-top: 40px;
  padding-bottom: 64px;
  max-width: 1440px;
  border-bottom: 1px solid #dedede;
}

.news-detail .txt-box p {
  line-height: 1.5;
  font-size: 16px;
  font-weight: 600;
  white-space: pre-line;
}

.detail-btn {
  display: flex;
  justify-content: space-between;
  width: 100%;
  max-width: 1440px;
  align-items: center;
  margin-bottom: 200px;
}

/* 버튼 고정 크기 제외 50%값 사용 */
.detail-btn li {
  min-width: calc((100% - 144px) / 2);
}

.detail-btn li.next {
  display: flex;
  justify-content: flex-end;
}

.detail-btn .navigation {
  margin-top: 24px;
}

.detail-btn .navigation a {
  color: #a4a4a4;
  font-weight: bold;
  font-size: 17px;
}

.detail-btn .navigation a span {
  color: #a4a4a4;
  font-weight: 300;
  font-size: 17px;
  margin-left: 16px;
  max-width: 340px;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.detail-btn .prev i {
  color: #a4a4a4;
  margin-right: 8px;
}

.detail-btn .next i {
  color: #a4a4a4;
  margin-left: 8px;
}

.detail-btn .next span {
  margin-right: 16px;
}

.detail-btn .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 24px;
  width: 144px;
  min-width: 144px;
  height: 56px;
  background-color: #20381c;
}

.detail-btn .btn a {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}

.evnet-text {
  color: #333333;
  opacity: 0.6;
}

.event_detail {
  margin-bottom: 280px;
}

.event_detail .date {
  border-bottom: 3px solid black;
  padding-bottom: 3px;
  font-size: 16px;
  font-weight: bold;
}

.event_detail .tit {
  font-size: 56px;
  margin-top: 48px;
}

.event_detail .event_txt {
  margin-top: 88px;
}

.event_detail .event_txt li {
  line-height: 1.5;
  font-size: 16px;
}

.event_detail .event_txt li:nth-child(n + 2) {
  margin-top: 15px;
}

.event_detail .btn-box {
  margin-top: 143px;
  display: flex;
  gap: 16px;
}

.event_detail .btn-box button {
  width: 136px;
  height: 56px;
  border: 1px solid #202020;
  font-weight: bold;
  color: #202020;
}

.event_detail .btn-box .next-btn:hover {
  background-color: #20381C;
  color: #fff;
}

.event_detail .btn-box .next-btn:hover i {
  color: #fff;
}

.event_detail .btn-box button.disabled {
  opacity: 0.3;
}

.event_detail .btn-box button i {
  font-size: 14px;
  margin-right: 4px;
}

.event-img-box {
  width: 100%;
}

.event-img-box img {
  object-fit: contain;
}

.artwork-box {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.artwork-box li {
  max-width: 284px;
  display: flex;
  flex-direction: column;
}

.artwork-box li p {
  font-size: 18px;
  font-weight: bold;
  margin-top: 16px;
  margin-bottom: 12px;
}

.artwork-box li span {
  opacity: 0.6;
  line-height: 1.43;
}

.artwork-box li:nth-child(n + 5) {
  margin-top: 32px;
}

.follow-box li:nth-child(n + 5) {
  margin-top: 0;
}

.follow-box {
  margin-bottom: 232px;
}

.follow-box a {
  display: flex;
  width: 100%;
  max-width: 287px;
  max-height: 287px;
  position: relative;
}


.follow-box a::before {
  width: 100%;
  display: block;
  content: "";
  padding-top: 100%;
}

.follow-box a img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.follow-wrap {
  width: 100%;
}




tbody {
  display: flex;
}

.inquiry-wrap {
  width: 100%;
  max-width: 1160px;
}

.inquiry-wrap .chapter {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.inquiry-wrap .chapter li {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 297px;
  padding-bottom: 25px;
  padding-left: 4.14%;
  padding-top: 32px;
  padding-right: 1.5%;
  background-color: #e4e4e4;
  cursor: pointer;
}

.inquiry-wrap .chapter li .active-txt {
  display: none;
}

.inquiry-wrap .chapter li.active {
  width: calc(100% - 594px);
  background-color: #202020;
}

.inquiry-wrap .chapter li img {
  max-width: 52px;
  width: auto;
  height: 59px;
  object-fit: contain;
}

.inquiry-wrap .chapter li.active .step-num {
  color: #fff;
  padding-top: 32px;
  font-size: 20px;
  font-weight: 300;
  opacity: 0.66;
}

.inquiry-wrap .chapter li.active .txt-bold {
  padding-top: 8px;
  font-weight: bold;
  font-size: 20px;
  color: #fff;
  opacity: 1;
}

.inquiry-wrap .chapter li.active .active-txt {
  display: block;
  font-size: 16px;
  padding-top: 8px;
  line-height: 1.5;
  opacity: 0.6;
  color: #fff;
  word-break: keep-all;
}

.inquiry-wrap .chapter li .step-num {
  padding-top: 72px;
  color: #202020;
  opacity: 0.22;
  font-size: 20px;
}

.inquiry-wrap .chapter li .txt-bold {
  padding-top: 8px;
  color: #202020;
  font-weight: bold;
  opacity: 0.22;
  font-size: 20px;
}

.inquiry-wrap .chapter li:nth-child(2)::after {
  position: absolute;
  width: 1px;
  height: 80%;
  content: "";
  background-color: #202020;
  right: 0;
  opacity: 0.09;
}

.inquiry-wrap .chapter li:nth-child(2)::before {
  position: absolute;
  width: 1px;
  height: 80%;
  content: "";
  background-color: #202020;
  left: 0;
  opacity: 0.09;
}


.inquiry-wrap .chapter li .active-icon {
  display: none;
}

.inquiry-wrap .chapter li.active .active-icon {
  display: flex;
  position: absolute;
  font-size: 24px;
  color: #fff;
  right: 40px;
  top: 20px;
}

.inquiry-table {
  margin-top: 80px;
  width: 100%;
}

.inquiry-table span {
  font-size: 24px;
  color: #20381c;
  font-weight: bold;
  font-family: "Daehan-Bold";
}

.inquiry-table h3 {
  font-size: 56px;
  margin-top: 16px;
}

.inquiry-table .table-wrap {
  display: flex;
  margin-top: 80px;
  gap: 16px;
  flex-wrap: wrap;
}

.inquiry-table .table-wrap li {
  display: flex;
  flex-direction: column;
  width: calc((100% - 16px) / 2);
}

.inquiry-table .table-wrap li:nth-child(n + 3) {
  margin-top: 48px;
}

.inquiry-table .table-wrap li p {
  position: relative;
  margin-bottom: 32px;
  font-weight: bold;
  font-size: 18px;
}

.inquiry-table .table-wrap li p.serious::after {
  right: 0;
  top: 0;
  content: "*";
  color: #ff0000;
}

.inquiry-wrap .next-btn {
  margin-top: 88px;
  text-align: center;
  width: 520px;
  border: 1px solid #767676;
  color: #767676;
  font-size: 16px;
  font-weight: 600;
  padding: 27px 0;
}

.inquiry-wrap .next-btn:hover {
  background-color: #20381C;
  color: #fff;
}

.btn-box {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 226px;
}

.inquiry-table .table-wrap.wrap2 li {
  width: 100%;
}

.checkbox-wrap .box-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.inquiry-wrap .wrap1 li input {
  padding: 10px 0 15px 10px;
  border-bottom: 1px solid #707070;
}

.inquiry-wrap .wrap1 li input::placeholder {
  color: #a8a8a8;
  font-size: 16px;
}

.inquiry-table .table-wrap #txt01 {
  border-bottom: 1px solid #707070;
  padding-bottom: 15px;
}

.checkbox-wrap {
  margin-top: 48px;
}

.box-wrap {
  display: flex;
  gap: 7px 16px;
  flex-wrap: wrap;
}

.box-wrap .radio {
  display: none !important;
}

.box-wrap .radio+label {
  display: inline-block;
  background: #fcfcfd;
  border: 2px solid #e5e5e5;
  width: 572px;
  padding: 18px 0;
  text-align: center;
  color: #a8a8a8;
}

.box-wrap .radio:checked+label {
  background: #20381c;
  border: 2px solid #20381c;
  color: #fff;
  font-weight: bold;
}

.box-wrap2 .radio+label {
  width: 278px;
}

.inquiry-table.on {
  display: block;
}

.inquiry-table {
  display: none;
}

.main-section .videoTxtBox {
  padding-right: 150px;
}

.mobile-header {
  display: none;
}


/* 반응형 */
@media screen and (max-width: 1080px) {

  .main-section .videoTxtBox {
    padding-right: 0;
  }

  .content {
    margin-top: 40px;
  }
}

@media screen and (max-width: 1600px) {
  .header-wrap .nav-wrap .gnbBtn {
    padding: 0 25px;
  }

  .header-wrap .sub-nav-wrap a {
    padding: unset;
  }

}

@media screen and (max-width: 1424px) {
  .header-wrap .nav-wrap a.gnbBtn {
    padding: 0 16px;
  }

  .header-wrap .ri-wrap button {
    width: 100px;
  }

  .header-wrap .ri-wrap {
    gap: 8px;
  }

  .header-wrap .gnb-wrap {
    gap: 8px;
  }
}

@media screen and (max-width: 1280px) {
  #header .logo {
    max-width: 200px;
  }
}

@media screen and (max-width: 1151px) {

  .header-wrap:hover .sub-nav-wrap a {
    padding: unset;
  }

  .header-wrap .ri-wrap button {
    width: 100px;
  }

  .header-wrap .gnbBtn {
    font-size: 15px;
  }

}


@media screen and (max-width: 1080px) {

  .header-wrap .sub-nav-bg {
    background: none;
  }

  #main-header {
    display: none;
  }

  #header {
    position: fixed;
    display: block;
    top: 0;
  }

  .nav-wrap,
  .header-wrap .ri-wrap {
    display: none;
  }

  .sub-nav-wrap.active {
    display: none;
  }

  .header-wrap {
    padding: 10px 20px 10px 24px;
    background-color: rgba(0, 0, 0, 0.2) !important;
    border-bottom: unset;
  }

  .header-wrap .container {
    padding: unset;
  }

  .header-wrap img {
    width: 169px;
  }

  .header-wrap:hover {
    background: none;
  }

  .header-wrap .gnb-wrap {
    height: auto;
    padding-right: 0;
  }

  .mobile-icon {
    display: block;
    color: #fff;
    font-size: 32px;
    cursor: pointer;
  }

  #header .logo .ceo {
    display: block;
  }

  #header .logo img {
    display: none;
  }

  .header-wrap .sub-nav-bg.active {
    display: none;
  }

  .mobile-header {
    position: absolute;
    width: 100%;
    height: 100%;
    margin-top: 18px;
    padding: 0 24px;
    background-color: #fff;
  }

  .mobile-link div {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }

  .pc-footer {
    display: none;
  }

  .mobile-header {
    display: none;
  }

  .mobile-header.active {
    display: block;
  }

  .mobile-ceo {
    background-color: #000;
  }

  .content {
    margin-top: unset;
    padding-top: 90px;
  }

  .main-section .txtBox {
    padding-right: unset;
  }

  #section2 .main-section {
    justify-content: unset;
    align-items: center;
  }

  .main-section .videoTxtBox {
    padding-top: 102px;
    padding-right: unset;
    text-align: center;
  }


  #section2 .videoTxtBox {
    /* position: unset; */
    order: 1;
  }

  #section2 #video-wrap {
    order: 2;
    top: 57%;
    transform: translateY(-50%);
  }

}

@media screen and (max-width: 768px) {
  #section2 #video-wrap {
    top: 67%;
  }
}

@media screen and (max-width: 1024px) {

  .main-section {
    justify-content: center;
  }

  .main-section .txtBox {
    display: flex;
    flex-direction: column;
  }

  .main-section .txtBox span,
  .main-section .txtBox h2,
  .main-section .txtBox p {
    text-align: center;
    line-height: 1.33;
  }

  .main-section .videoTxtBox p {
    padding-top: 10px;
  }

  .main-section .videoTxtBox h2 {
    padding-top: 15px;
  }

  #fp-nav.fp-right ul {
    display: none;
  }

  .mobile-main #header {
    display: block;
  }

  .mobile-ceo #header {
    display: block;
  }

  .main-section {
    align-items: center;
  }

  .wrap #section0 {
    background: url("/images/m_main_bg1.png") no-repeat;
    background-size: cover;
  }

  .wrap #section1 {
    background: url("/images/m_main_bg2.png") no-repeat;
    background-size: cover;
  }

  .wrap #section3 {
    background: url("/images/m_main_bg3.png") no-repeat;
    background-size: cover;
  }

  .main-section2 {
    align-items: flex-start;
    transform: translateY(-50%);
    padding-top: unset;
    top: 50%;
    position: absolute;
    max-width: unset !important;
  }

  .white-box,
  .white-box2 {
    left: 0;
    width: 100%;
  }

  #section4 .main-section .imgBox {
    margin-bottom: 80px;
    margin-top: 40px;
  }

  #section4 .main-section .imgBox li {
    width: calc((100% / 3) - 2px);
  }


}

@media screen and (max-width: 768px) {

  .main-section2 span,
  .main-section span {
    font-size: 15px;
  }

  .main-section h2,
  .main-section2 h2 {
    font-size: 25px;
  }

  .main-section2 p,
  .main-section p {
    font-size: 15px;
  }
}




/*  ====== 반응형 ====== */


@media screen and (max-width: 1080px) {
  .container.w1680 {
    max-width: 768px;
  }

  br.pc {
    display: none;
  }
}


/* ABOUT */
.ceon-content {
  padding: 0 24px;
  gap: 24px;
  margin-top: 64px;
}

.ceon-content .content-scroll {
  padding-top: 80px;
  height: 780px;
}

.ceon-content .cont-box {
  padding-top: unset;
}

.ceon-content .tit-box {
  min-width: 279px;
}

.ceon-content .mb {
  display: none;
}

.content .box1 .left-img {
  height: 306px;
  margin-top: 118px;
}

.content .box1 .left-img img {
  height: 306px;
}

.ceon-content .cont-box .img-box .img03 {
  height: 306px;
}

.content .cont-box .last span {
  font-family: 'InkLipquid';
}


.ceon-content .ceo-txt-box {
  padding-top: 24px;
}



@media screen and (max-width: 1280px) {

  .ceon-content .tit-box h2 {
    font-size: 48px;
  }

  .ceon-content .tit-box p {
    font-size: 22px;
  }

  .ceon-content .tit-box span {
    font-size: 14px;
  }

  .ceon-content .tit-box {
    min-width: 248px;
  }

  .ceon-content .cont-box {
    flex-direction: column;
  }
}

@media screen and (max-width: 1080px) {

  .ceon-content {
    flex-direction: column;
    gap: unset;
    padding-bottom: 130px;
    margin-top: unset;
    padding-top: 96px;
  }

  .ceon-content .cont-box .img-box {
    max-width: unset;
    gap: 10px;
  }

  .ceon-content .box1 .left-img {
    width: 60%;
    margin-top: unset;
  }

  .ceon-content .cont-box .img-box .right-img {
    width: 50%;
    gap: 10px;
  }

  .ceon-content .cont-box .img-box img {
    width: 100%;
    height: unset;
  }

  .ceon-content .cont-box .img-box .img03 {
    height: unset;
  }

  .ceon-content .cont-box h3 {
    font-size: 20px;
  }

  .ceon-content .cont-box p {
    margin-top: 40px;
    font-size: 14px;
  }

  .ceon-content .cont-box:not(:first-child) {
    margin-top: 80px;
  }

  .ceon-content .cont-box .last span {
    font-size: 24px;
    padding-left: 16px;
  }

  .ceon-content .logo-img {
    max-width: 573px;
    margin: 0 auto;
  }

  .ceon-content .ceo-txt-box {
    padding-top: unset;
  }

  .ceon-content .ceo-box .img-box {
    max-height: unset;
  }
}

@media screen and (max-width: 1024px) {
  .ceon-content .pc {
    display: none;
  }

  .ceon-content .mb {
    display: flex;
  }

  .ceon-content {
    flex-direction: column;
    max-width: 768px;
    width: 100%;
    margin-bottom: unset;
    padding-bottom: 130px;
  }

  .ceon-content .cont-box:not(:first-child) {
    padding-top: 56px;
  }

  .ceon-content .cont-box .img-box {
    max-width: unset;
    gap: 10px;
  }

  .ceon-content .tit-box p {
    margin-top: 35px;
    font-size: 20px;
  }

  .ceon-content .tit-box h2 {
    font-size: 35px;
  }

  .ceon-content .tit-box span {
    margin-top: 10px;
    font-size: 15px;
  }

  .ceon-content .cont-box .img-box img {
    height: unset;
  }

  .ceon-content .cont-box .img-box .right-img {
    gap: 10px;
  }

  .ceon-content .cont-box h3 {
    font-size: 20px;
    line-height: 1.25;
  }

  .ceon-content .cont-box p {
    margin-top: 40px;
    line-height: 1.25;
    font-size: 14px;
  }

  .ceon-content .content-scroll {
    height: 510px;
    padding-top: unset;
    margin-top: 80px;
  }

  .ceon-content .cont-box .last {
    margin-top: 16px;
  }

  .ceon-content .cont-box .last span {
    font-size: 24px;
    padding-left: 8px;
  }

  .ceon-content .content-scroll .box2 {
    margin-top: 80px;
  }

  .ceon-content .box3 {
    padding-top: unset;
  }

  .ceon-content .content-scroll .box3 {
    margin-top: 40px;
  }

  .ceon-content .box3 .logo-img {
    max-width: 473px;
    margin: 0 auto;
  }

  .ceon-content .box3.cont-box p {
    padding-bottom: 30px;
  }

  .content .box1 .left-img {
    height: unset;
    margin-top: unset;
  }

  .content-scroll .box3 {
    margin-bottom: unset;
  }
}

@media screen and (max-width: 768px) {
  .ceon-content {
    max-width: 768px;
  }

  .ceon-content .cont-box .img-box img {
    width: 100%;
  }

  .ceon-content .cont-box .img-box .right-img {
    width: 50%;
    min-width: 143px;
  }

  .ceon-content .cont-box .ceo-img .big {
    width: 100%;
    height: unset;
  }

  .ceon-content .cont-box .ceo-img .small {
    width: 50%;
    height: unset;
  }

  .ceon-content .box3 .logo-img {
    max-width: unset;
  }
}



/* About- master */
.master-content {
  padding: 0 24px;
  gap: 24px;
}

.master-content .cont-box .img-box {
  width: 100%;
}

.master-content .box2 {
  padding-top: 184px;
}

.master-content .tit-box {
  min-width: 373px;
}

.master-content .txt-box {
  min-width: 394px;
}

.master-content .tit-box span {
  line-height: 1.33;
}

.master-content .box2::after {
  position: absolute;
  content: "";
  width: 100%;
  border: 1px dashed #ebebe615;
  top: 3px;
  left: 0;
}

.master-content .box2::before {
  position: absolute;
  content: "";
  width: 100%;
  border: 1px dashed #ebebe615;
  top: 8px;
  left: 0;
}

.master-content .box2 {
  padding-top: 80px;
  margin-top: 240px;
}

.family-wrap .content .txt-box p .mb {
  display: none;
}

@media screen and (max-width: 1484px) {
  .family-wrap .content .cont-box {
    gap: 24px;
  }

  .master-content .tit-box {
    min-width: 280px;
  }
}

@media screen and (max-width: 1280px) {

  .master-content .tit-box h2 {
    font-size: 48px;
  }

  .master-content .tit-box p {
    font-size: 22px;
  }

  .master-content .tit-box span {
    font-size: 14px;
  }

  .master-content .tit-box .family-link li.active {
    width: 210px;
  }

  .master-content .tit-box .family-link li a {
    padding-left: 15px;
  }
}

@media screen and (max-width: 1260px) {

  .family-wrap .content-scroll .cont-box .left-img img {
    min-width: 490px;
  }

  .master-content .tit-box {
    min-width: 252px;
  }

}

@media screen and (max-width: 1080px) {
  .master-content {
    padding-top: 96px;
    padding-bottom: 80px;
    flex-direction: column;
    margin-top: unset;
    gap: unset;
  }

  .master-content .cont-box {
    flex-direction: column;
  }

  .master-content .cont-box {
    position: unset;
  }

  .family-scroll {
    height: unset;
    overflow: inherit;
  }

  .family-wrap .content .txt-box {
    position: unset;
    width: 90%;
    margin-top: 26px;
  }

  .ceo-wrap {
    height: unset;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }

  .master-content .tit-box .family-link {
    margin-top: 40px;
    flex-wrap: wrap;
    flex-direction: row;
    gap: 10px;
  }

  .master-content .tit-box .family-link li {
    width: calc((100% - 10px * 1) / 2);
    height: 40px;
  }

  .master-content .tit-box .family-link li.active {
    width: calc((100% - 10px * 1) / 2);
    height: 40px;
  }

  .content .tit-box .family-link li:hover {
    width: calc((100% - 10px * 1) / 2);
    height: 40px;
    background-color: #fff;
    opacity: 1;
    transition: 0.5s;
  }

  .content .tit-box .family-link li:hover a,
  .content .tit-box .family-link li:hover a span {
    color: #202020;
    font-weight: 600;
  }

  .master-content .txt-box {
    min-width: unset;
  }

  .family-wrap .content .cont-box {
    align-items: center;
  }

  .family-wrap .content-scroll .cont-box .left-img {
    position: unset;
    margin-top: unset;
    height: unset;
    padding-bottom: unset;
  }

  .family-wrap .content-scroll .cont-box .left-img img {
    position: unset;
  }

  .family-wrap .content .txt-box h3 {
    font-size: 35px;
  }

  .family-wrap .content .txt-box p {
    font-size: 16px;
    margin-top: 10px;
  }

  .family-wrap .content .list-wrap {
    margin-top: 40px;
  }

  .family-wrap .content .list-wrap li p {
    font-size: 15px;
    padding-left: 10px;
    min-width: 36px;
  }

  .family-wrap .content .list-wrap li span {
    font-size: 15px;
  }

  .master-content .box2 {
    position: relative;
    width: 100%;
    padding-top: unset;
    margin-top: 60px;
  }

  .master-content .box2::after {
    position: absolute;
    content: "";
    width: 100%;
    border: 1px dashed #ebebe615;
    top: -20px;
    left: 0;
  }

  .master-content .box2::before {
    position: absolute;
    content: "";
    width: 100%;
    border: 1px dashed #ebebe615;
    top: -25px;
    left: 0;
  }

  .master-content .box2 .txt-box {
    margin-top: unset;
  }

  .master-content .box2 .img-box {
    order: 1;
  }

  .master-content .box2 .txt-box {
    order: 2;
  }

  .master-content .cont-box .img-box {
    max-width: unset;
  }

  .master-content .tit-box .family-link li a {
    font-size: 14px;
    width: 100%;
  }

  .master-content .tit-box .family-link li a span {
    font-size: 14px;
    padding-left: 10px;
  }

  .family-wrap .content-scroll .box3 .left-img {
    padding-top: 40px;
  }

  .family-wrap .content .list-wrap li p::before {
    top: 10px;
    transform: unset;
  }

  .family-wrap .content .list-wrap li .three::before {
    top: 10px;
    transform: unset;
  }

  .family-wrap .content .list-wrap li .two::before {
    top: 10px;
    transform: unset;
  }

  .master-content .box3 {
    margin-top: 80px;
  }

  .master-content .manager-img {
    margin-top: 80px;
  }

  .family-wrap .content .manager-box {
    width: 100%;
    margin-top: 40px;
  }

  .family-wrap .content-scroll .cont-box .left-img img {
    min-width: unset;
  }

  .master-content.content .tit-box .family-link li {
    width: calc((100% - 10px * 1) / 2);
    height: 32px;
  }

  .master-content.content .tit-box .family-link li.active {
    width: calc((100% - 10px * 1) / 2);
    height: 32px;
  }
}

@media screen and (max-width: 768px) {

  .family-wrap .content .txt-box p .mb {
    display: block;
  }

}



/* directions */

.dir-content {
  padding: 0 24px;
  gap: unset;
  justify-content: space-between;
}

.dir-content .pc {
  display: none;
}

.dir-content .tit-box {
  width: 100%;
  max-width: 344px;
  min-width: 313px;
}

.dir-content .tit-box h2 {
  width: 100%;
}

.direction-box .mb {
  display: none;
}

.direction-box .use .mb-type li p {
  display: none;
}

.dir-content .pc {
  display: flex;
}

.dir-content .load.pc {
  display: block;
}

.dir-content .mb-type .mb {
  display: none;
}

@media screen and (max-width: 1080px) {
  .dir-content .pc {
    display: none;
  }

  .direction-box .mb {
    display: flex;
    top: unset;
    padding-top: unset;
  }

  .dir-content .load.pc {
    display: none;
  }

  .direction-box .use .mb-type li p {
    display: block;
  }

  .dir-content .tit-box {
    max-width: unset;
    min-width: unset;
  }

  .content .tit-box h2 {
    font-size: 35px;
  }

  .intro-box {
    padding-bottom: unset;
  }

  .intro-box li {
    font-size: 16px;
  }

  .dir-content .tit-box .intro-box li p {
    font-size: 14px;
    font-weight: 500;
    margin-top: 11px;
    margin-bottom: unset;
    width: 100%;
  }

  .dir-content .tit-box .intro-box li span {
    font-size: 14px;
    padding-top: unset;
    margin-top: 10px;
  }

  .dir-content .intro-box li i {
    font-size: 16px;
    margin-right: 5px;
  }

  .dir-content {
    padding-top: 96px;
    flex-direction: column;
  }

  .root_daum_roughmap .wrap_map {
    height: 584px !important;
  }

  .community-wrap .tit-box p {
    margin-top: 35px;
    font-size: 20px;
  }

  .community-wrap .tit-box span {
    font-size: 15px;
  }

  .direction-box {
    padding-top: unset;
  }

  .intro-box {
    margin-top: 34px;
  }

  .direction-box .use {
    margin-top: 50px;
  }

  .direction-box .use .tit {
    font-size: 20px;
    padding-bottom: 10px;
  }

  .direction-box .use li .load-box {
    flex-direction: column;
    gap: unset;
    padding-left: unset;
  }

  .direction-box .use li .load p,
  .direction-box .use li {
    margin-top: 15px;
    font-size: 16px;
    line-height: 1.5;
  }

  .direction-box .use li {
    font-size: 14px;
    color: #8f8f8f;
    line-height: 1.43;
    align-items: baseline;
  }

  .direction-box .use .mb-type li {
    display: flex;
    gap: 25px;
  }

  .direction-box .use .mb-type li p {
    font-size: 16px;
    font-weight: 500;
    color: #202020;
    min-width: 48px;
  }

  .load-box ul li span {
    font-size: 10px;
    min-width: 20px;
    min-height: 20px;
  }

  .direction-box .use li .load-box-plus {
    border-bottom: 1px solid #c5c5c5;
    margin-bottom: 80px;
  }
}

@media screen and (max-width: 768px) {
  .dir-content .mb-type .mb {
    display: block;
  }
}


/* 커뮤니티 */

@media screen and (max-width: 1343px) {
  .community-content {
    gap: 60px;
  }

  .community-wrap .tit-box h2 {
    font-size: 43px;
    width: 263px;
  }
}

@media screen and (max-width: 1080px) {

  .community-content .inner-wrap {
    width: 100%;
  }

  .community-wrap .tit-box h2 {
    font-size: 35px;
  }

  .community-content {
    flex-direction: column;
    gap: 80px;
    padding-bottom: unset;
  }

  .community-box {
    gap: 50px;
  }

  .community-box li {
    max-width: unset;
    width: 100%;
  }

  .community-box li a {
    width: 100%;
  }

  .content .tit-box .family-link li a {
    font-size: 14px;
    padding-left: 15px;
  }

  .community-box li a .img-box {
    max-width: unset;
    max-height: unset;
  }

  .content .tit-box .family-link li.active {
    width: 100%;
    height: 32px;
  }

  .content .tit-box .family-link li {
    width: 90%;
    height: 32px;
  }

  .content .tit-box .family-link {
    gap: 10px;
    margin-top: 40px;
  }

  .community-box li a .img-box::before {
    padding-top: 83.646%;
  }

  .community-box li a p {
    font-size: 15px;
    padding-top: 15px;
    padding-bottom: 10px;
  }

  .community-box li:nth-child(n + 4) {
    margin-top: unset;
  }

  .community-box li a span {
    font-size: 13px;
    line-height: 1.53;
  }

  .community-wrap .content .tit-box .family-link li:hover {
    width: 90%;
    height: 32px;
  }

  .community-wrap .content .tit-box .family-link li.active:hover {
    width: 100%;
  }

  .community-wrap .content .tit-box .family-link li:hover a,
  .community-wrap .content .tit-box .family-link li:hover a span {
    color: #fff;
    font-weight: 600;
  }
}

@media screen and (max-width: 353px) {
  .master-content .tit-box .family-link li a {
    padding-left: 4px;
  }
}

/* artwork */

.artwork-box {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.artwork-box li {
  max-width: 284px;
  width: calc((100% - 8px * 3) / 4);
  display: flex;
}

.artwork-box li p {
  font-size: 18px;
  font-weight: bold;
  margin-top: 16px;
  margin-bottom: 12px;
}

.artwork-box li span {
  opacity: 0.6;
  line-height: 1.43;
}

.artwork-box li a .img-box {
  width: 100%;
  max-width: 284px;
  max-height: 283px;
  position: relative;
}


.artwork-box li a .img-box::before {
  width: 100%;
  display: block;
  content: "";
  padding-top: 100%;
}

.artwork-box li a .img-box img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}



@media screen and (max-width: 1080px) {
  .artwork-box {
    gap: 5px;
    margin-bottom: 50px;
  }

  .artwork-box li {
    width: calc((100% - 5px * 1) / 2);
    max-width: unset;
  }

  .artwork-box li a .img-box {
    max-width: unset;
    max-height: unset;
  }

  .artwork-box li a p {
    font-size: 15px;
    padding-top: 15px;
    padding-bottom: 10px;
  }

  .artwork-box li:nth-child(n + 5) {
    margin-top: unset;
  }

  .artwork-box li a span {
    font-size: 13px;
    line-height: 1.53;
  }
}


/* 뉴스 디테일 */
.news-detail {
  padding: 0 24px;
}

@media screen and (max-width: 1080px) {
  .news-detail {
    margin-top: unset;
    padding-top: 96px;
  }

  .news-detail .detail-day {
    font-size: 15px;
  }

  .news-detail .detail-tit {
    font-size: 20px;
    margin-top: 10px;
    margin-bottom: 40px;
  }

  .news-detail .txt-box {
    margin-top: 30px;
    padding-bottom: 40px;
  }

  .detail-btn .navigation a span {
    display: none;
  }

  .detail-btn {
    margin-top: 15px;
  }

  .detail-btn .navigation {
    margin-top: unset;
  }

  .detail-btn .btn {
    width: 104px;
    min-width: 104px;
    margin-top: unset;
    height: 32px;
  }

  .detail-btn .btn a {
    font-size: 14px;
  }

  .detail-btn .prev i {
    font-size: 20px;
  }

  .detail-btn .navigation a {
    font-size: 12px;
    display: flex;
    align-items: center;
  }

  .detail-btn {
    margin-bottom: 80px;
  }
}


/* 이벤트디테일 */
.event-detail-content .inner-wrap {
  width: 100%;
  display: flex;
  gap: 120px;
  margin-top: 100px;
}

.event-detail-content .event-img-box {
  width: 100%;
  max-width: 600px;
  max-height: 600px;
  position: relative;
}


.event-detail-content .event-img-box::before {
  width: 100%;
  display: block;
  content: "";
  padding-top: 100%;
}

.event-detail-content .event-img-box img {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

@media screen and (max-width: 1080px) {

  .detail-btn .next i {
    font-size: 20px;


  }

  .event_detail {
    margin-bottom: 80px;
  }

  .event-detail-content .inner-wrap {
    flex-direction: column-reverse;
    margin-top: unset;
    gap: 30px;
  }

  .event-detail-content .event-img-box {
    max-width: unset;
    max-height: unset;
  }

  .event_detail .date {
    font-size: 14px;
  }

  .event_detail .tit {
    margin-top: 30px;
    font-size: 35px;
  }

  .event_detail .event_txt {
    margin-top: 50px;
  }

  .event_detail .event_txt li {
    font-size: 14px;
    line-height: 1.43;
  }

  .event_detail .btn-box {
    margin-top: 40px;
    margin-bottom: unset;
    border-top: 1px solid #dedede;
    padding-top: 20px;
  }

  .event_detail .btn-box a {
    width: calc(100% / 3);
  }

  .event_detail .btn-box button {
    width: 100%;
    height: 40px;
    font-size: 14px;
  }

}



/* faq */
.faq-content {
  padding: 0 24px;
  padding-bottom: 200px;
  gap: 24px;
}

.faq-wrap {
  margin-top: 95px;
}

.faq-wrap .que-content-wrap {
  display: flex;
}

@media screen and (max-width: 1080px) {

  .faq-content {
    flex-direction: column;
    gap: unset;
    padding-top: 96px;
    padding-bottom: unset;
  }

  .faq-content .tab-content {
    border-top: unset;
  }

  .faq-content .tab-content:first-child {
    border-top: 2px solid #a8a8a8;
  }

  .faq-wrap {
    margin-top: 80px;
  }

  .que-wrap {
    padding: 20px 0;
    border-bottom: 1px solid #a8a8a8;
  }

  .que-wrap .content-wrap {
    align-items: baseline;
    gap: 25px;
  }

  .faq-wrap .que-content-wrap {
    flex-direction: column;
    gap: 5px;
  }

  .que-wrap .content-wrap .question-title {
    font-size: 15px;
    margin-left: unset;
  }

  .que-wrap i {
    display: none;
  }

  .que-wrap .que-text {
    font-size: 20px;
  }

  .que-wrap .content-wrap .question-type {
    margin-left: unset;
    font-size: 15px;
  }

  .anw-wrap .anw-text {
    font-size: 20px;
  }

  .anw-content {
    margin-left: 25px;
    padding-bottom: 24px;
  }

  .anw-content p {
    font-size: 14px;
    line-height: 1.35;
  }

}



/* contact us */

.contact-content input {
  padding-left: 10px;
}

.contact-content input::placeholder {
  font-size: 16px;
  color: #a8a8a8;
}

.contact-content .btn-box {
  display: flex;
}

.contact-content .step3-btn-box {
  display: none;
}


@media screen and (max-width: 1517px) {

  .inquiry-wrap .chapter li {
    /* width: calc(100% / 3); */
    width: calc(97% / 3);
    max-width: 245px;
  }

  .inquiry-wrap .chapter li.active {
    width: calc(100% - 590px);
    /* max-width: calc(100% / 3); */
    max-width: unset;
    min-width: 239px;
  }

}

@media screen and (max-width: 1080px) {

  .contact-content input {
    padding: 10px 0 14.5px 10px;
  }

  .contact-content input::placeholder {
    font-size: 14px;
  }

  .contact-content {
    gap: 40px;
  }

  .inquiry-wrap .chapter li.active .active-txt {
    display: none;
  }

  .box-wrap .radio+label {
    width: 100%;
  }

  .inquiry-table .table-wrap {
    margin-top: 40px;
    flex-direction: column;
    gap: 40px;
  }

  .inquiry-table .table-wrap li {
    width: 100%;
  }

  .inquiry-wrap .chapter li .step-num {
    padding-top: 20px;
    font-size: 14px;
  }

  .inquiry-wrap .chapter li:nth-child(2)::after {
    display: none;
  }

  .inquiry-wrap .chapter li.active .step-num {
    padding-top: 20px;
    font-size: 14px;
  }

  .inquiry-wrap .chapter li img {
    height: unset;
    max-width: 23px;
    min-width: 26px;
  }

  .inquiry-wrap .chapter li.active .active-icon {
    font-size: 14px;
    right: 20px;
    top: 10px;
  }

  .inquiry-wrap .chapter li.active {
    min-width: 106px;
    width: calc(100% / 3);
  }

  .inquiry-wrap .chapter li.active .txt-bold {
    font-size: 14px;
  }

  .inquiry-wrap .chapter li {
    padding: 20px 13px;
  }

  .inquiry-wrap .chapter li .txt-bold {
    font-size: 14px;
  }

  .inquiry-table span {
    font-size: 18px;
  }

  .inquiry-table h3 {
    margin-top: 10px;
    font-size: 35px;
    font-weight: 600;
  }

  .inquiry-table .table-wrap li p {
    font-size: 16px;
    margin-bottom: 10px;
  }

  .inquiry-wrap .wrap1 li input {
    padding: 10px 0 14.5px 10px;
  }

  .inquiry-wrap .wrap1 li input::placeholder {
    font-size: 14px;
  }

  .inquiry-table .table-wrap li:nth-child(n + 3) {
    margin-top: unset;
  }

  .inquiry-wrap .next-btn {
    margin-top: 40px;
    width: 100%;
    background-color: #20381c;
    border-color: #20381c;
    padding: unset;
    height: 48px;
    color: #fff;
  }

  .inquiry-wrap .btn-box {
    margin-bottom: 80px;
  }

  .checkbox-wrap {
    margin-top: unset;
  }

  .inquiry-table .table-wrap .checkbox-wrap p {
    margin-bottom: 20px;
  }

  .inquiry-table .box-wrap {
    gap: 10px;
  }

  .inquiry-table .box-wrap .radio+label {
    padding: 12px 20px;
    text-align: left;
    font-size: 14px;
  }
}




/* history */
@media screen and (max-width: 1280px) {
  .his-content .content-box h3 {
    font-size: 24px;
  }

  .history .content-scroll {
    margin-top: 115px;
  }

  .history .content-scroll .community_list {
    padding-bottom: 59px;
  }

  .his-content .content-box p {
    font-size: 20px;
  }

  .his-content .content-box .year-txt {
    font-size: 124px;
  }

  .history .content-scroll .year {
    font-size: 124px;
  }

}

@media screen and (max-width: 1080px) {
  .history {
    flex-direction: column;
    margin-bottom: 80px;
  }

  .his-content .content-box {
    margin-top: unset;
  }

  .his-content .content-box p {
    display: none;
  }

  .his-content .content-box h3 {
    font-size: 20px;
    margin-bottom: 10px;
  }

  .his-content .content-box .year-txt {
    padding-top: unset;
    font-size: 60px;
  }

  .history .content-scroll {
    margin-top: unset;
  }

  .history .content-scroll .year {
    font-size: 60px;
  }

  .history .content-scroll {
    height: unset;
    overflow: unset;
  }

  .history .content-scroll .box {
    display: flex;
  }

  .history .content-scroll .box:not(:first-child) {
    margin-top: 26px;
  }

  .history .content-scroll .community_list {
    margin-left: unset;
    padding-top: unset;
    padding-bottom: 40px;
    gap: 15px;
    border-bottom: 1px solid #aaa;
  }

  .history .content-scroll .box .img-box img {
    max-height: unset;
  }

  .history .inner-wrap {
    margin-left: 10px;
    margin-top: unset;
  }

  .history .img-in-box .inner-wrap {
    display: flex;
    flex-direction: column;
    margin-top: unset;
    gap: 20px;
  }

  .history .content-scroll .box .img-box::before {
    padding-top: 55.19%;
  }

  .history .content-scroll .community_list li p {
    font-size: 14px;
  }

  .history .content-scroll .community_list li span {
    font-size: 14px;
    padding-left: 15px;
  }

  .history .content-scroll .box:last-child {
    margin-bottom: unset;
  }

  .history .content-scroll .box:last-child .community_list {
    border-bottom: unset;
  }
}



/* 모바일 메뉴 */
.mb-hd {
  display: none;
}

.mb-hd-wrap {
  display: none;
}




#header .mb-hd {
  display: block;
}



#header .mb-hd .mb-hd-wrap {
  position: fixed;
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #333333e6;
  display: none;
  justify-content: flex-end;
  z-index: 9999;
  height: 100vh;
}

#header .mb-hd .scoll-wrap {
  height: calc(100% - 56px);
  overflow: auto;
  /* display: flex;
  flex-direction: column;
  justify-content: space-between; */
}

#header .mb-hd .mb-hd-wrap.open {
  display: flex;
}

#header .mb-hd .mb-hd-box {
  width: 375px;
  background-color: #fff;
  box-shadow: -5px 0 5px 0 rgba(0, 0, 0, 0.3);
  position: relative;

}

#header .mb-hd .mb-top-wrap {
  display: flex;
  justify-content: space-between;
  padding: 8px 24px;
}

#header .mb-hd .mb-hd-box .mb-logo {
  max-width: 169px;

}

#header .mb-hd .mb-hd-box .mb-login {
  display: flex;
  justify-content: center;
  gap: 20px;
  padding: 10px 0;
  font-weight: 400;
}

#header .mb-hd .mb-hd-box .mb-login>a {
  color: #7d7d7d;
  width: 50%;
  text-align: center;
  cursor: pointer;
}

#header .mb-hd .mb-nav .mb-sm-nav-top {
  width: 100%;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
  border-bottom: 1px solid #efefef;
  cursor: pointer;
}

#header .mb-hd .mb-nav .mb-sm-nav-top p,
#header .mb-hd .mb-nav .mb-sm-nav-top a {
  color: #20381c;
  font-size: 17px;
  font-weight: 600;
}

#header .mb-hd .mb-nav .mb-sm-nav-top i {
  font-size: 18px;
  color: #333;
}



#header .mb-hd .mb-nav .mb-sm-nav-top.active i {
  transform: rotate(0.5turn);
}

#header .mb-hd .mb-nav .mb-sm-nav {
  flex-direction: column;
  background-color: #f5f5f5;
  display: none;
}

#header .mb-hd .mb-nav .mb-sm-nav a {
  padding: 0 24px;
  font-size: 14px;
  width: 100%;
  height: 46px;
  display: flex;
  align-items: center;
  line-height: 40px;
  color: #333;
  letter-spacing: -0.35px;
}

#header .mb-hd .mb-nav .instant a {
  width: 100%;
  height: 48px;
  display: flex;
  align-items: center;
  padding: 0 24px;
  color: #333;
  letter-spacing: -0.4px;
  font-weight: bold;
  border-bottom: 1px solid #efefef;
}

#header .mb-hd .mb-nav .instant .counsel-btn {
  width: 100%;
  height: 48px;
  display: flex;
  align-items: center;
  padding: 0 24px;
  color: #333;
  letter-spacing: -0.4px;
  font-weight: bold;
  border-bottom: 1px solid #efefef;
  font-size: 16px;
}

#header .mb-hd .sns-wrap-mb {
  display: flex;
  gap: 16px;
  position: absolute;
  right: 24px;
  bottom: 24px;
}

#header .mb-hd .menubar-wrap {
  cursor: pointer;
}

#header .mb-hd .close-btn i {
  font-size: 32px;
  color: #20381c;
}

#header .mb-hd .ri-wrap {
  gap: 16px;
  margin: 40px auto 104px;
  justify-content: center
}

#header .mb-hd .ri-wrap button {
  width: 152px;
  padding: 12px 0;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
}

#header .mb-hd .ri-wrap .menuBarBtn {
  background-color: #20381c;
  color: #f0e4c2;
  cursor: pointer;
}

#header .mb-hd .ri-wrap .transBtn {
  background-color: #f0e4c2;
  color: #20381c;
}


/* top-btn */
#main-topBtn {
  display: none;
  z-index: 991;
  cursor: pointer;
  position: fixed;
  right: 24px;
  bottom: 55px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 2px solid #20381c;
  text-align: center;
  transition: .3s;
  background-color: #fff;
}

#main-topBtn i {
  font-size: 29px;
  color: #20381c;
  line-height: 54px;
}

.top-btn {
  position: fixed;
  bottom: 56px;
  right: 24px;
  z-index: 10;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  text-align: center;
  cursor: pointer;
  transition: .3s;
  opacity: 0;
  background-color: #fff;
}

#top_menu.active .top-btn {
  opacity: 1;
}

.top-btn:hover {
  box-shadow: rgba(0, 0, 0, 0.1) 0px 8px 30px 0px;
}

.top-btn i {
  font-size: 29px;
  color: #20381c;
  line-height: 56px;
  z-index: 2;
}

@media screen and (max-width: 1080px) {

  #main-topBtn {
    right: 16px;
    bottom: 40px;
  }

  .top-btn {
    bottom: 40px;
  }
}

.mobile-footer {
  position: relative;
}


/* 탑버튼 상태바 */
.progress_bar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;

}

/* progress_bar의 테두리 정도를 남겨두고 동그라미로 가린 용도 */
.progress_bar::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  height: 90%;
  border-radius: 100%;
  background-color: #fff;
}



/* 퀼 속성 */
.ql-editor {
  padding: unset;
}



