:root{--main-color:rgb(0,133,255); --intro-size:300px}
#wrap{min-width: 1400px; position: relative; padding: 0; margin: 0 ;background: #fff;}
.d_width{margin: 0 auto; width: 1600px; position: relative ; transition: all 0.2s ease-out;}

#header{position: absolute; top: 50px;left: 0;width: 100%; height: auto;z-index: 99; transition: all 0.2s ease-out; animation: fadeInDown 1s;}
#logo{margin:0 auto;text-align: center ;}

#main-visual{width: 100%;position: relative;text-align: center;overflow:hidden;}
#main-visual::after{content:"";width:100%; height:100%; display:block; background:url(../img/mv-img.png) no-repeat; background-position: center; background-size: cover;position:absolute; top:0; left:0;animation: mvFadeIn 1.2s ease forwards;}
@keyframes mvFadeIn {
    from {transform:scale(1) ;}
    to {transform:scale(1.05) ;}
}
.mv-wrap{ height:100vh ; min-height:930px;  position:relative; z-index:8; margin:0 auto; display: inline-block;text-align: center; padding-top: 300px;}
.mv-wrap .stit{font-size: 60px; color: #fff;letter-spacing: -2.6px;line-height: 75%;  white-space: nowrap; font-weight:200; }
.mv-wrap .tit{color: #fff;font-size: 80px; letter-spacing: -3px;font-weight:700 ;  white-space: nowrap;position: relative; display: inline-block; }
.mv-wrap .tit::after{content: "" ; height: 2px; width: 100%; background-color: #fff; display: block; position: absolute;bottom: 20px; }
.mv-deco{display: inline-block; position: relative;}
.mvdeco-txt{font-family: 'widndy';color: inherit; font-size:96px ; font-weight: 400;padding: 0 30px ; display: inline-block; transform: translateY(-18px); z-index: 1; position: relative;opacity: 0;-webkit-transform: translate3d(-20px, -18px, 0);transform: translate3d(-20px, -18px, 0);-webkit-animation: fadeInLeftDeco 0.6s ease forwards;animation: fadeInLeftDeco 0.6s ease forwards;animation-delay: 1.7s; }
.mvdeco-bg{background: url(../img/mv-deco.png) no-repeat ; width: 135px; height: 103px; display: inline-block;position: absolute; top: 13%; left: 50%; transform: translateX(-50%);background-size: 100%;  }
.txt-ani1,.txt-ani2 {opacity: 0;-webkit-transform: translate3d(-20px, 0, 0);transform: translate3d(-20px, 0, 0);}
/* 첫 번째 텍스트 */
.txt-ani1 {-webkit-animation: fadeInLeft 0.8s ease forwards;animation: fadeInLeft 0.8s ease forwards;animation-delay: 0.2s;}
/* 두 번째 텍스트 (딜레이 추가) */
.txt-ani2 {-webkit-animation: fadeInLeft 0.8s ease forwards;animation: fadeInLeft 0.8s ease forwards;animation-delay: 0.8s;}
@keyframes fadeInLeft {
  from {opacity: 0;transform: translate3d(-20px, 0, 0);}
  to {opacity: 1;transform: translate3d(0, 0, 0);}
}

.txt-ani1 .fwb {display: inline-block;animation: bounceText 1.2s ease-in-out infinite;transform-origin: center bottom;}
/* 글자마다 시간차 */
.txt-ani1 .fwb:nth-child(1) {animation-delay: 1.1s;}
.txt-ani1 .fwb:nth-child(2) {animation-delay: 1.25s;}
.txt-ani1 .fwb:nth-child(4) {animation-delay: 1.4s;}
.txt-ani1 .fwb:nth-child(5) {animation-delay: 1.55s;}
.txt-ani1 .fwb:nth-child(6) {animation-delay: 1.7s;}

/* 왼쪽에서 등장 */
@keyframes fadeInLeft {
    from {opacity: 0;transform: translate3d(-20px, 0, 0);}
    to {opacity: 1;transform: translate3d(0, 0, 0);}
}

/* 통통 튀는 애니메이션 */
@keyframes bounceText {
    0%, 100% {transform: translateY(0);}
    20% {transform: translateY(-6px);}
    40% {transform: translateY(0);}
    60% {transform: translateY(-3px);}
    80% {transform: translateY(0);}
}
/*놀이 애니메이션*/
@keyframes fadeInLeftDeco {
    from {opacity: 0;transform: translate3d(-20px, -18px, 0);}
    to {opacity: 1;transform: translate3d(0, -18px, 0);}
}

[id*="mc-cont"]{padding: 130px 0;position: relative;}

#mc-cont1{text-align: center;position: relative;overflow: hidden;}
.point-tit{color: var(--main-color) ; font-size: 20px; font-weight: 600; letter-spacing: -1px; border-radius: 30px; display: inline-block; border: 1px solid var(--main-color);padding: 5px 30px; }
.more-btn{color: #fff ; font-size: 20px; font-weight: 700; letter-spacing: -1px; border-radius: 30px; display: inline-block; background: var(--main-color); padding:  15px 60px; padding-left:80px; transition: all 0.3s; position: relative; z-index: 100;}
.more-btn span{display: inline-block; width: 39px; height: 39px; border-radius: 50px; background-color: rgba(255, 255, 255, 0.1);; position: absolute; top: 11px;left:11px;line-height: 39px;  text-align: center;transition: all 0.3s;color: #fff;}
.more-btn span::after{font-family: fontAwesome; content: "\f061";color:inherit;}
.more-btn:hover{background-color: #012475;box-shadow: 0 0 10px #33333359;color: #fff;}
.more-btn:hover span{background-color:#fff;color: #012475;}
.mc-tit{font-size: 50px; letter-spacing: -1px; font-weight: 900;margin-top: 35px;color: #000; line-height: 1.3;}
.mc-tit em{font-weight: inherit;}

.mintro .txt::before {content: "";display: block;width: 2px;height: 45px;margin: 25px auto;background: linear-gradient(to bottom,rgba(0,133,255,0) 0%,rgba(0,133,255,0.3) 20%,rgba(0,133,255,0.8) 40%,rgba(0,133,255,1) 50%,rgba(0,133,255,0.8) 60%,rgba(0,133,255,0.3) 80%,rgba(0,133,255,0) 100%);background-size: 100% 200%;animation: lineMove 2s linear infinite;}
@keyframes lineMove {
    0% {background-position: 0 100%;}
    100% {background-position: 0 -100%;}
}

/* 점선 */
.loading-vertical{margin: 30px auto;display: flex;flex-direction: column;align-items: center;gap: 6px;}
.loading-vertical .dot{width: 5px;height: 5px;border-radius: 50%;background: #a8a8a8;animation-duration: 2.5s;animation-iteration-count: infinite;animation-timing-function: linear;}
.loading-vertical .dot1{animation-name: dot1Flow;}
.loading-vertical .dot2{animation-name: dot2Flow;}
.loading-vertical .dot3{animation-name: dot3Flow;}
@keyframes dot1Flow{
    0%{opacity: 0.1;}
    33.333%{opacity: 1;}
    66.666%{opacity: 0.3;}
    100%{opacity: 0.1;}
}
@keyframes dot2Flow{
    0%{opacity: 0.5;}
    33.333%{opacity: 0.1;}
    66.666%{opacity: 1;}
    100%{opacity: 0.5;}
}
@keyframes dot3Flow{
    0%{opacity: 1;}
    33.333%{opacity: 0.5;}
    66.666%{opacity: 0.1;}
    100%{opacity: 1;}
}
.txt-wrap p{font-size: 19px; letter-spacing: -1px;line-height: 160%; color:#333 ;margin-top: 10px; }
/* 왼쪽사진 */
#mc-cont1 .d_width::before{content: ""; width: var(--intro-size); height: var(--intro-size); background: url(../img/mintro-deco4.png) no-repeat ; background-position: center; background-size: cover; position: absolute; bottom: 0%; left: -10%; }
/* 왼쪽색상 */
#mc-cont1 .d_width::after{content: ""; width: var(--intro-size); height: var(--intro-size); background:var(--main-color) ; opacity: 0.3;  position: absolute; top:0%; left: -10%; border-radius: 50%; }
/* 오른쪽 둘째줄 색상*/
#mc-cont1 .mc-tit::before{content: ""; width: var(--intro-size); height: var(--intro-size);background:var(--main-color) ; opacity: 0.3;    position: absolute; top:12%; right: -30%; border-radius: 50%;}
/* 슬라이드 위아래 흰색 필터 효과 */
#mc-cont1::before,
#mc-cont1::after {content: "";position: absolute;left: 0;width: 100%;pointer-events: none;z-index: 5;}
#mc-cont1::before {top: 0;height: 180px;background: linear-gradient(to bottom,#fff 0%,rgba(255,255,255,0) 50%,rgba(255,255,255,0) 100%);}
#mc-cont1::after {bottom: 0;height: 180px;background: linear-gradient(to top,#fff 0%,rgba(255,255,255,0) 50%,rgba(255,255,255,0) 100%);}
.bg-wrap .bg3{width: var(--intro-size); height: var(--intro-size); background-color: var(--main-color) ; border-radius: 50%; margin: 0 auto;}
.bg-wrap [class*="bg"]{margin: 30px auto; overflow: hidden;width: var(--intro-size);}
.mintro img{width: 100%;}
.bg-wrap{position: absolute; top: 0; right: 15% ; animation: rolling2 70s linear infinite;overflow: hidden;}
@keyframes rolling2 {100%{transform: translateY(-50%);}}

#mc-cont2 {background-color: #F8F9FD;text-align: center;overflow: hidden;}
.data-swiper {margin: 100px 0 60px;position:relative; z-index:100;}
.data-mySwiper {overflow: visible;padding-bottom: 20px;position:relative;}
.data-swiper .swiper-wrapper {align-items: flex-start;}
.data-swiper .swiper-slide {height: auto;}
.data-swiper .swiper-slide.up .item-wrap {transform: translateY(50px);}
.data-swiper .item-wrap{position: relative;}
.data-swiper .item-wrap .item {display: block;box-shadow: 0 0 15px #33333338;border-radius: 30px;overflow: hidden;background-color: #fff;}
.data-swiper .item-wrap .thumb {height: auto; width:100%; aspect-ratio:1/0.5555;}
.data-swiper .item-wrap .txt-wrap {padding: 10px 20px 25px;text-align: left;}
.data-swiper .item-wrap .tit {color: #000;font-size: 19px;letter-spacing: -1.2px;font-weight: 600;margin-bottom: 12px;width: 100%;  }
.hash-wrap p, .tag_wrap span {color: #666666;font-size: 14px;letter-spacing: -1.2px;font-weight: 500;padding: 3px 10px;background-color: #f2f2f2;display: inline-block;margin: 0 3px 6px 0;border-radius: 30px;}
.hash-wrap p::before {content: "#"; color: inherit; font-size: inherit;padding-right: 2px; }
.tag_wrap span::before {content: "#"; color: inherit; font-size: inherit;padding-right: 2px; }
.tag_wrap{margin-top:12px;}
.data-swiper .item-wrap .hover {display: block; opacity: 0; transition: all 0.3s; background: linear-gradient(to bottom, #0085FF00 0%, #0085FF00 40%, #0085FFFF 100%);border-radius: 30px;overflow: hidden;position: absolute; top: 0; left: 0;z-index: 9; width: 100%; height: 100%;}
.data-swiper .item-wrap .hover:hover{opacity: 1;}
.btn-hover{display: inline-block; border-radius: 30px; background-color:var(--main-color); color: #fff;font-size: 18px; letter-spacing: -1px;  text-align: center; padding: 10px 30px; padding-left: 50px;position: absolute;}
.mdata .btn-hover{ width: 190px;bottom:40px; left: 50%; transform: translateX(-50%); }
.btn-hover span{display: inline-block; width: 39px; height: 39px; border-radius: 50px; background-color:#fff; position: absolute; top: 5px;left:5px;line-height: 39px;  text-align: center; }
.btn-hover span::after{font-family: fontAwesome; content: "\f061";color: var(--main-color);color: var(--main-color);}
.btn-hover:hover{color: #fff;}
#mc-cont2::after{content:'';display:block;width:330px;position:absolute;left:10%;top:0;aspect-ratio:1/1;background:linear-gradient(-40deg, #73ccff 0%, #8db0ff 50%);border-radius:100%;filter:blur(50px);opacity:0.2;animation: circleOpacity 3s ease-in-out infinite;}
#mc-cont2::before{content:'';display:block;width:330px;position:absolute;right:10%;top:30%;aspect-ratio:1/1;background:linear-gradient(-40deg, #73ccff 0%, #8db0ff 50%);border-radius:100%;filter:blur(50px);opacity:0.2;animation: circleOpacity 3s ease-in-out infinite;}
.data-mySwiper::after{content:'';display:block;width:330px;position:absolute;left:30%;bottom:-15%;aspect-ratio:1/1;background:linear-gradient(-40deg, #73ccff 0%, #8db0ff 50%);border-radius:100%;filter:blur(50px);opacity:0.2;animation: circleOpacity 3s ease-in-out infinite;}
.swiper-button-prev svg,
.swiper-button-next svg{display: none; }
.swiper-button-prev,
.swiper-button-next {width: 44px;height: 44px;line-height:40px; background: transparent; border: 2px solid var(--main-color);border-radius: 50%;color: var(--main-color);transition:all 0.3s;}
.mdata .slide-btn{ width: 160px; position: absolute; top:-35%; left:calc(100% - 400px); z-index:9;}
.data-toggle{width: 44px;height: 44px;background: transparent;border: 2px solid var(--main-color) !important;border-radius: 50%;color: var(--main-color);cursor: pointer;transition:all 0.3s;}
.data-toggle i {pointer-events: none;}
.data-toggle .fa-play {display: none;}
.data-toggle.is-paused .fa-pause {display: none;}
.data-toggle.is-paused .fa-play {display: inline-block;}
.data-toggle.is-paused {border: 2px solid var(--main-color);}
.data-toggle:focus {outline: none;}
.data-toggle:hover{background:var(--main-color); color:#fff;}
.swiper-button-prev:hover,
.swiper-button-next:hover{background:var(--main-color); color:#fff;}


@keyframes circleOpacity{
  0%{
    opacity:0.2;
  }
  50%{
    opacity:0.4;
  }
  100%{
    opacity:0.2;
  }
}

.mgallery{position: relative;text-align: center;overflow: hidden;}
.mgallery .gal a:nth-child(1)::after{content: ""; background: url(../img/mgal-img1.png) no-repeat; opacity: 0.15; position: absolute; top: 150px; left:-10%; transform: rotate(-30deg);width:370px; height: 300px;}
.mgallery .gal a:nth-child(2)::after{content: ""; background: url(../img/mgal-img2.png) no-repeat; opacity: 0.15; position: absolute; top: 10%; right:calc(50% + 80px); width:370px; height: 300px;}
.mgallery .gal a:nth-child(3)::after{content: ""; background: url(../img/mgal-img3.png) no-repeat; opacity: 0.15; position: absolute; top: 10%;  left: calc(50% + 80px); width:370px; height: 300px;}
.mgallery .gal a:nth-child(4)::after{content: ""; background: url(../img/mgal-img4.png) no-repeat; opacity: 0.15; position: absolute; top: 150px; right: -10%;transform: rotate(30deg); width:370px; height: 300px;}
.mgallery .thumb{height: 300px;border-radius: 30px; overflow: hidden; }
.mgallery .gal{margin: 50px auto 65px;}
.mgallery .gal a{width: calc(25% - 40px); margin: 20px ;border-radius: 30px; box-sizing: border-box;}

.mchall{background: radial-gradient(circle, #275AAD 0%, #051154 100%);}
.mchall .tit-wrap{text-align: center; }
.mchall .point-tit{color: #fff; border-color:#fff ;}
.mchall .left-wrap{width: 570px;}
.mchall .row{justify-content: space-between;margin-top: 60px;}
.mchall .cont-wrap{position: relative;}
.mchall .cont-wrap span{display: inline-block; padding: 0px 70px; border-radius: 80px;text-align: center; }
.cont1-1{background-color: #000; color: #fff; font-weight: 700; font-size: 80px;position: relative; z-index: 9; }
.cont1-2{background-color: var(--main-color); color: #fff; font-weight: 700; font-size: 80px; transform: rotate(-15deg) ;margin-top: -3px; margin-left: 20px; position: relative; z-index: 8;}
.cont1-3{background-color: #FF9966;color: #fff; font-size: 50px; font-weight: 700;margin-left: 230px; margin-top: -56px; padding: 2px 40px !important;position: relative; z-index: 9;}
.cont1-4{background-color: #fff;color: #000; font-size: 80px; font-weight: 700; margin-top: -26px; position: relative; z-index: 7;padding:5px 80px !important;}
.mchall .cont-wrap::after{content: ""; display: block; background: url(../img/mchall-deco3.png) no-repeat center; position: absolute; top:10%; left: -10%; width: calc(100% - 40px); height: 230px;}
.mchall .cont-wrap::before{content: "" ; display: block; background:url(../img/mchall-deco2.png) no-repeat center ; position: absolute; bottom: -50px ; left: -100px;width: 62px; height: 62px;}
.cont1-1::before{content: "" ; display: block; background: url(../img/mchall-deco1.png) no-repeat center ; position: absolute; top: -30px; left: 30px; width: 44px; height: 65px;  }
.cont1-3::after{content: ""; display: block; background: url(../img/mchall-deco2.png) no-repeat center; position: absolute; top: 15px; right: -45px; width: 62px; height: 62px;}
.btn-chall{display: inline-block; margin:27px 0 50px; border-radius: 30px; background-color:  rgba(255, 255, 255, 0.1);; color: #fff;font-size: 18px; letter-spacing: -1px;  text-align: center;  position: relative ;padding: 12px 30px; padding-left: 60px;transition: all 0.3s;}
.btn-chall span{display: inline-block; width: 39px; height: 39px; border-radius: 50px; background-color: rgba(255, 255, 255, 0.1);; position: absolute; top: 7px;left:7px;line-height: 39px;  text-align: center;transition: all 0.3s; }
.btn-chall span::after{font-family: fontAwesome; content: "\f061";color: var(--main-color);color: #fff;}
.btn-chall:hover{background-color: #fff;color: var(--main-color);}
.btn-chall:hover span{background-color: var(--main-color);}
.mchall .tit{color: #fff; font-size: 44px; letter-spacing: -2px; font-weight: 700;position: relative;  }
.mchall .tit span{display: inline-block; background:linear-gradient(to bottom, transparent 20%, #04f0b57a 0) left center no-repeat ;  width: 200px; height: 10px;position: absolute;bottom: 10px; left: 0; }
.mchall .stit{color: #fff;font-size: 24px; letter-spacing: -1.3px;  line-height: 150%; margin-top: 17px;}
.mchall .board-write{background-color: rgba(255, 255, 255, 0.1);width: 50%; padding: 45px 58px ; border-radius: 30px;}
.mchall .board-write p{text-align:center ; color: #fff; font-size: 35px; letter-spacing: -1px; font-weight: 600;margin-bottom:50px ;}
.mchall .board-write table th{text-align: left; color: #fff;}
.mchall .board-write table input, .mchall .board-write table textarea{background-color:  rgba(255, 255, 255, 0.1); padding: 12px; border-radius: 10px;border: none;width: 100%;}
/*.input-area{width: 100%; margin-bottom: 20px;}*/
.input-area>label{width: 100%; margin-bottom: 15px; color: #fff; font-size: 20px; letter-spacing: -1px; font-weight: 500; }
.input-area .half-box>label{width: 100%; margin-bottom: 15px; color: #fff; font-size: 20px; letter-spacing: -1px; font-weight: 500; }
.input-area .half-box{width: calc(50% - 30px); margin: 15px; }
.half-wrap{margin: -15px;margin-bottom: 15px;}
/*.input-area input, .input-area textarea{background-color:  rgba(255, 255, 255, 0.1); padding: 12px; border-radius: 10px;border: none;width: 100%;}*/
.input-btn{background-color: var(--main-color); color: #fff;font-size: 20px; letter-spacing: -0.8px; font-weight: 700;  width: 350px; padding: 20px 0; text-align: center; border-radius: 50px; display: block; margin:0 auto ; margin-top: 40px;}
.input-btn:hover{color: #fff;}
#file-upload-button{background-color: var(--main-color); color: #fff;font-size: 16px; letter-spacing: -0.8px; }
.single-attach{display: flex; flex-flow: row wrap;background-color:  rgba(255, 255, 255, 0.1); border-radius:10px ;align-items: center;}
.mchall .board-write table .single-attach input{background:none;}
.single-attach label input{position: absolute; width: 100%; height: 100%; opacity: 0; top: 0 ;left: 0; overflow: hidden;padding: 0;cursor: pointer;}
.single-attach input[type="text"]{flex: 1 0 80%; padding-left: 11px; border: none; background: none; color:#fff ;}
.single-attach label{position: relative;}
.btn-d{line-height: 33px; background-color: var(--main-color); font-size:16px ; letter-spacing: -0.8px;padding: 0 12px;border: none; border-radius: 5px; margin-left: 10px;cursor: pointer;}

#mc-cont5{background-color: #F5F7F9;overflow: hidden;}
.mqna .tit-wrap{text-align: center;}
.mqna .tit-wrap .stit{color: #BAC4CF; font-size: 23px; font-weight: 600; letter-spacing: -1.2px;margin: 30px 0 55px;}
.qna-write {display: flex;align-items: center;gap: 24px;padding: 22px 30px;background: #f1f2f4;border-radius: 24px;box-sizing: border-box;width:980px ;margin: 0 auto;margin-bottom: 60px;}
.qna-write textarea {flex: 1;min-height: 106px;padding: 18px 6px;border: 0;background: transparent;resize: none;outline: none;color: #333;font-size: 18px;line-height: 1.4;font-family: inherit;box-sizing: border-box;}
.qna-write textarea::placeholder {color: #b8c0cc;font-weight: 600;}
.qna-write .submit-btn {flex-shrink: 0;width: 220px;padding: 25px; border: 0;border-radius: 16px;background: var(--main-color);color: #fff;font-size: 20px;font-weight: 700;cursor: pointer;transition: all 0.3s;}
.qna-write .submit-btn:hover {box-shadow: 0 0 10px #33333359;}
.blind {position: absolute;width: 1px;height: 1px;margin: -1px;padding: 0;overflow: hidden;border: 0;clip: rect(0, 0, 0, 0);}
.qnatxt-wrap .swiper-slide{background-color: #fff; padding: 30px; border-radius: 30px;height: 150px;}
.qnatxt-wrap .swiper-slide p {font-size: 17px; letter-spacing: -0.8px; color: #333; word-break: keep-all;}
.pna-mySwiper2{transform: translate(250px,30px);} 

.mmovie{overflow: hidden;text-align: center;}
.mmovie .mc-tit{font-family: "widndy"; font-weight: 400; letter-spacing: -2px; font-size: 60px;line-height: 110%;}
.mmovie .btn-hover{top: 165px; right: 0;width: 190px; transition: all 0.3s;}
.mmovie .btn-hover:hover{box-shadow: 0 0 10px #33333359;}
.mmovie .item{display: flex; justify-content: space-between; align-items: end;}
.mvideo{width:950px ; height: 530px;overflow: hidden; border-radius: 30px ;}
.mvideo iframe{width: 100%;height: 100%;}
.mprofile{width:360px ;height: 650px;overflow: hidden;border-radius: 400px;background-color: #F5F7F9; border: 2px solid #0085FF;position: relative;padding: 90px 40px;text-align: left; }
.mprofile img{position: absolute; bottom: 0%; right: -10%; width:350px ;}
.mmovie .tit{font-family: "widndy";color: var(--main-color) ; font-size: 32px; letter-spacing: -2.6px;margin-bottom: 13px;}
.mmovie .name{color: #000; font-size: 36px; letter-spacing: -0.8px; line-height: 110%;font-weight: 700;}
.mmovie .name span{color: var(--main-color) ; font-size: 20px; font-weight: 600;}
.mmovie .tit-wrap::before{content: "";display: block; background-color: var(--main-color); border-radius: 50%; width: 300px; height: 300px;position: absolute; top: 122px; left: -8%;}
.mmovie .d_width::after{content: "";display: block; background-color: var(--main-color); border-radius: 50%; width: 93px; height: 93px;position: absolute; right:-8%; bottom: -3%; z-index: 9;}
#mc-cont6::after{content: "";display: block; background-color: var(--main-color); border-radius: 50%; width: 66px; height: 66px;position: absolute; left:32%; bottom: 10%; z-index: 9;}
.mmovie .d_width::before{content: "";display: block; background-color: var(--main-color); border-radius: 50%; width: 40px; height: 40px;position: absolute; right:-9%; bottom: -10%; z-index: 9; opacity: 0.15;}
.mmovie::after{content: ""; display: block; background: url(../img/mmovie-deco1.png) no-repeat left bottom / 100% 100%;  position: absolute; bottom:90px; left: 0; width:100%; height: 39px; }
.mmovie::before{content: ""; display: block; background: url(../img/mmovie-deco2.png)no-repeat left bottom / 100% 100%; ;position: absolute; bottom:90px; left: 0; width: 100%; height: 195px;}
.mmovie .slide-btn{position: absolute;  bottom: 15%; left:calc(100% - 400px ); z-index: 9; width:120px;}

.mnotice{text-align: center;overflow: hidden; position: relative;background: linear-gradient(to bottom,#F2F5FB 0%,#f8f9fd00 100%);}
.tab{display: flex;justify-content: center; align-items: center; gap: 10px; margin-top: 85px;}
.tab a{ padding: 5px 30px; text-align: center;background-color: #E8EAEC;border: none;outline: none;cursor: pointer;font-size: 20px;transition: background-color 0.3s ease;display: inline-block;border-radius: 30px;font-weight: 600;color: #a5acb4;}
.tab a:hover {background-color: #e0e0e0;}
.mnotice .tab a.on {background-color: var(--main-color);color: white;font-weight: 600;}
.tab-content{margin:45px -20px 40px;}
.mnotice .thumb{height:auto; width:100%; aspect-ratio:1/ 0.810811; border-radius: 30px; }
.mnotice .tab-content a{width: calc(25% - 40px);margin: 20px;}
.mnotice .txt{text-align: left;padding: 20px 0;}
.mnotice .stit{color: #0085ff; font-weight: 600; font-size:16px; letter-spacing:-1px;margin-bottom:10px;}
.mnotice .tit{color: #000;  font-weight: 700;font-size: 23px; letter-spacing:-1.2px; margin-bottom: 15px;line-height:1.4;}
.mnotice .date{color: #b0b8bd;font-size: 15px; font-weight: 500;}
.mnotice::before{content: ""; width: 100%; height:100%; background-image: url(../img/mnotice-deco.png); background-size: cover; position: absolute;top: 0;left: 0; animation: mnotice-pattern 4s linear both infinite; transform-origin:50% 50% ;background-position: 50% 170%; opacity: 0;}
.btn-list{margin-top:30px; text-align:center; padding:15px 20px; border-radius:10px; background:#000; color:#fff; font-size:16px; }
@keyframes mnotice-pattern {
  0%{background-position: 50% 110%; transform: scale(1);opacity: 0;}
  30%{background-position: 50% 90%; transform: scale(1); opacity: 1;}
  60%{background-position: 50% 70%; transform: scale(1); opacity: 1;}
  90%{background-position: 50% 50%; transform: scale(1);opacity: 0;}
  100%{background-position: 50% 50%; transform: scale(1);opacity: 0;}
 }
.mnotice-list{margin:60px -15px 50px;}
.mnotice-list li{width:calc(25% - 30px); margin:15px;background-color:#fff;}
.mnotice-list li a{padding:30px; border:1px solid #DADADA;border-radius:10px; text-align:left; display:block; width:100%;}
 
.footer_banner{margin: 90px 0;position: relative;overflow: hidden;}
.banner{display: flex;align-items: center;width: max-content;animation: rolling 90s linear infinite; justify-content: space-between;gap: 123px;}
.banner img{flex-shrink: 0;}
@keyframes rolling {100%{transform: translateX(-50%);}}

#footer{padding: 85px 0 150px;background-color: #F7F7F7;}
.fbtm {padding-bottom: 35px; border-bottom: 1px solid #CBCFD3; justify-content: space-between;align-items: end; margin-bottom:20px ;}
#flogo{padding-bottom: 40px; }
address{color: #A8AFB7; font-size: 16px; letter-spacing: -0.5px; }
.fmn a{font-size: 18px; letter-spacing: -0.5px; font-weight: 500; padding-left: 30px; color: #A8AFB7; }
.copyright{text-align: right;font-size: 16px; letter-spacing: -0.5px; color:#A8AFB7 ; }
.copyright span{font-family:"Noto Sans KR" ; }

.slideContRight:not(.before){/* animation:slideContRight 1s ease both alternate; */}
.slideContRight.before:before{animation:slideContRight 1s ease both alternate;}
.slideContRight{animation: slideContRight 1s ease both alternate;}
@keyframes slideContRight {
    0% {
        clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
    }
    100% {
        clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    }
}


/* 모달창  */
.ui-widget.ui-widget-content{padding:35px;border-radius:30px;}
.ui-dialog .ui-dialog-titlebar{padding:0.4rem 0;}
.ui-corner-all{border-bottom-right-radius:0;border-bottom-left-radius:0;}
.ui-dialog .ui-dialog-title{margin:0 ;letter-spacing:-0.025rem;font-weight:var(--font-bold); font-size:1.5rem;font-family:'pretendard'; }
.ui-dialog .ui-dialog-content{padding: 0; border:none;overflow-x:hidden;font-family:"pretendard";}
.ui-widget-header{background:none;border:none;padding:0.4em 1em;}
.board_view{border:none;}
.category-bx a{padding:5px 30px; border-radius:30px; display:inline-block; background-color:#fff;  color:#a5acb4; font-size:17px;font-weight:500;font-family:'pretendard'; }
.category-bx a:hover{background:#E8EAEC;color:var(--main-color);}
.category-bx a.on{background:var(--main-color);color:#fff;}
.board-info .form-control{display:inline-block; width:auto;}
.board-info-search{position:relative;}
.board-info-right{text-align:right; justify-content:flex-end;}
.board-info-search button{ position:absolute; right:0; width:45px; text-align:center; top:50%; transform:translateY(-50%);background:transparent; color:var(--main-color);}
.board-info-search button:hover{background:transparent; color:var(--main-color); box-shadow:none; }
.board-info .col-wrap{justify-content:space-between;width:100%;}
.board-info .input-area{position:relative;}
.archive-list a{font-family:'pretendard';display:block; overflow:hidden; border-radius:10px;}
.archive-list li{width: calc(25% - 20px);margin: 10px; border-radius:10px; overflow:hidden;border:1px solid #eee;} 
.archive-list li a .thumb{height:auto; width:100%;aspect-ratio:1/0.5555; }
.archive-list .desc{background-color:#fcfeff; padding:20px; }
.archive-list .desc .category{font-size:14px; font-weight:600; color:var(--main-color);}
.archive-list .desc .subject {font-size:1.2rem; font-weight:700; }
.archive-list .desc .date {font-size:14px; font-weight:500; color:#999; margin-top:5px; }
.archive-list .row{margin:0 -10px;}
.board-info{margin:1.25rem 0; display:flex; flex-flow:row wrap; justify-content:end; align-items:center; font-size:1rem;padding-bottom:10px; border-bottom:1px solid #eee; }
.ui-dialog .ui-dialog-buttonpane{margin-top:0; padding:20px ;}
.ui-dialog .ui-dialog-buttonpane button{margin:0 auto;border:none; border-radius:30px; color:#fff; font-size:16px; font-weight:500; font-family:"pretendard";background:var(--main-color); padding:10px 40px; }
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset{float:none;text-align:center; }
.ui-dialog .ui-dialog-titlebar-close{top:-130%;width:50px; height:50px; background:#fff;right:-15px; display:none; }
.ui-dialog .ui-dialog-titlebar-close::after{content:"\f00d"; font-family:"fontAwesome";position:absolute; top:0; left:0;color:#000; }
/*.file-ico ul{display: flex;justify-content: center; align-items: center; gap: 10px; }
.file-ico li{ padding: 5px 30px; text-align: center;background-color: #E8EAEC;border: none;outline: none;cursor: pointer;font-size: 20px;transition: background-color 0.3s ease;display: inline-block;border-radius: 30px;font-weight: 600;color: #a5acb4;}
.file-ico li:hover {background-color: #e0e0e0;}*/

/*놀이자료 팝업창*/
.file-ico ul{display:flex;}
.file-ico li{font-size:0.9rem; line-height:40px; margin-right:10px;}
.file-ico li:before{content:"";display:inline-block; width:20px; height:20px; background-repeat:no-repeat; vertical-align:middle; margin-right:5px;}
.file-ico li:nth-child(1)::before{background-image:url(../img/file_doc_s.png);}
.file-ico li:nth-child(2)::before{background-image:url(../img/file_img_s.png);}
.file-ico li:nth-child(3)::before{background-image:url(../img/file_video_s.png);}
.file-ico li:nth-child(4)::before{background-image:url(../img/link.jpg);}
.archive-list li{position:relative;}
.archive-list .file-type{position:absolute;top:20px; right:20px; z-index:20; }
.file-type:before{content:"";display:inline-block; width:40px;height:40px; background-repeat:no-repeat;}
.file-type.ico-doc:before{background-image:url(../img/file_doc.png);}
.file-type.ico-img:before{background-image:url(../img/file_img.png);}
.file-type.ico-video:before{background-image:url(../img/file_video.png);}
.file-type.ico-link:before{background-image:url(../img/file_link.png);}
.alt-txt{position:absolute; overflow:hidden; clip:rect(0 0 0 0); margin:-1px;width:1px; height:1px;}

/*모달창 더보기*/
.board-view-title{text-align:center;border-top:2px solid #eaeaea;padding-top:30px;  }
.board-view-title .category{font-size:16px; font-weight:600; color:var(--main-color); text-align:center;}
.board_view .title{padding:0 0 35px; font-size:25px; letter-spacing:-2px; font-weight:600;}
.board_view .desc{background:none; color:#666; border-top:1px solid #eaeaea; font-weight:400; font-size:0.9rem;}
.board_view .attach a{font-size:14px;}
.board_view .cont{padding:30px 0;}

/* 반응형 */
@media only screen and (max-width:1600px)  {
  :root{--intro-size:200px;}
  #wrap{min-width: 1200px;}
  .d_width{width: 1400px; }
  /* mv */
  .mv-wrap .stit{font-size: var(--font-4xlg);line-height: 100%;}
  .mv-wrap .tit{font-size: var(--font-5xlg);}
  .mvdeco-txt{font-size: 65px;}
  .mvdeco-bg{top: 5%; width: 107px; }
  .mv-wrap .tit::after{bottom: 10px;}
  /* 놀이하우스 소개 */
  .bg-wrap{right: 5%;}
  #mc-cont1 .d_width::after{left: 5%;top: 15%;}
  #mc-cont1 .d_width::before{left: 5%;bottom: 15%;}
  #mc-cont1 .mc-tit::before{top: -11%; left:calc(100% - 400px);}
  .mc-tit{font-size: var(--font-3xlg);}
  .point-tit{font-size: 18px;}
  /* 공지사항 */
  .tab{margin: 40px 0 1rem 0;}
  .tab-content{margin: 40px -20px 40px;}
  .mnotice .mc-tit::before{width: 455px; height: 455px;}
  .mnotice .mc-tit::after{width: 355px; height: 355px;}
  /* 놀이자료 */
  .mdata .slide-btn{left: calc(100% - 300px);}
  /* 놀이갤러리 */
  .mgallery .gal a:nth-child(1)::after,
  .mgallery .gal a:nth-child(2)::after,
  .mgallery .gal a:nth-child(3)::after,
  .mgallery .gal a:nth-child(4)::after{width: 300px; height: 230px;border-radius: 30px;}
  .cont1-1, .cont1-2{font-size: var(--font-5xlg);}
  .cont1-3{font-size: 40px;}
  .cont1-4{font-size: 60px;margin-top: -20px;}
  /* 챌린지 */
  .mchall .tit{font-size: var(--font-3xlg);}
  .mchall .stit{font-size: var(--font-lg);}
  .mchall .cont-wrap::before{left: calc(0% - 70px);}
  /* qna */
  .mqna .tit-wrap .stit{font-size: var(--font-lg);margin: 10px 0 30px;}
  /* 전문가 한마디 */
  .mmovie .mc-tit{font-size: var(--font-4xlg);}
  /* footerbanner */
  .footer_banner{margin: 70px 0;}
  /* footer */
  #footer{padding: 40px 0 60px;}
  #flogo{padding-bottom: 20px;}
  .fmn a{font-size: 16px;}
}

@media only screen and (max-width:1440px) {
  .d_width{width: 1200px; }
  /* 놀이하우스 소개 */
  #mc-cont1 .d_width::after, #mc-cont1 .d_width::before{left: -5%; }
  #mc-cont1 .mc-tit::before{left: calc(100% - 300px);}
  .bg-wrap{right: 4%;}
  /* 공지사항 */
  .mnotice .tab-content a{width: calc(25% - 20px ); margin: 10px;}
  .mnotice .tit{min-height: 50px; font-size: 18px;}
  .tab-content{margin: 40px -10px 40px;}
  .data-swiper{margin: 60px 0 50px;}
  /* 놀이자료 */
  .mdata .slide-btn{left: calc(100% - 200px) ; top: -25%;}
  /* 하단 */
  .footer_banner{margin: 60px 0;}
  .banner img{width: 95%;}
  .mnotice-list{margin:60px -7.5px 50px;}
.mnotice-list li{width:calc(25% - 15px); margin:7.5px;}
}
@media only screen and (max-width:1240px) {
  #wrap{min-width: 960px;}
  .d_width{width: 960px; }
  :root{--intro-size:150px;}
  [id*="mc-cont"]{padding: 100px 0;}
  /* 놀이하우스 소개 */
  #mc-cont1 .d_width::after{top: 0%; left: -5%;}
  #mc-cont1 .d_width::before{bottom:0% ; left: -5%;}
  #mc-cont1 .mc-tit::before{left: calc(100% - 150px);}
  .bg-wrap{right: 0%;}
  /* 공지사항 */
  .mnotice .mc-tit::before{width: 400px; height: 400px;}
  .mnotice .mc-tit::after{width: 250px; height: 250px;right: -10%;}
  .mnotice .point-tit::after{width: 150px; height: 150px;top:-18%;}
  .mnotice .tab-content a:nth-child(3),
  .mnotice .tab-content a:nth-child(4){display: none;}
  .tab-content{margin: 40px -15px 40px;}
  .mnotice .tab-content a:nth-child(1),
  .mnotice .tab-content a:nth-child(2){width: calc(50% - 30px); margin: 15px ; }
  .mnotice .thumb{height: 330px;}
  /* 놀이자료 */
  .data-swiper{margin: 60px 20px 50px;}
  #mc-cont2::after,#mc-cont2::before{width:250px; }
  /* 하단배너 */
  .banner img{width: 85%;}
  .banner{gap: 80px;}
  .banner img{width: 75%;}
  .more-btn{padding: 10px 40px; font-size: 18px;padding-left:60px;}
  .more-btn span{width:35px; height:35px; line-height:35px; top:7px;left:7px; }
   /* 모달창 */
   .archive-list li{width:calc(33.33% - 20px ) ; margin:10px;}
   .archive-list .desc .subject{font-size:1.15rem;}
   .hash-wrap p, .tag_wrap span{padding:0 10px;}
     .mnotice-list{margin:40px -7.5px 35px;}
.mnotice-list li{width:calc(50% - 15px); margin:7.5px;}
}
@media only screen and (max-width:1023px) {
  :root{--intro-size:100px;}
  #wrap{min-width: 740px;}
  .d_width{width: auto; margin: 0 20px;}
  .mv-wrap .stit{font-size: var(--font-3xlg);}
  .mv-wrap .tit{font-size: var(--font-4xlg);}
  .point-tit{font-size: 16px; padding: 5px 20px;}
  .mc-tit{font-size: var(--font-2xlg);margin-top: 20px;}
  .txt-wrap p{font-size: 17px;}
  #mc-cont1 .d_width::after{top: 10%; left: 5%;}
  #mc-cont1 .d_width::before{bottom: 10%; left: 5%;}
  .mnotice .mc-tit::before{left:calc(100% - 100px);}
  .bg-wrap{right: 0;}
  .data-swiper{margin:80px 20px 50px ;}
  .tab a{font-size:18px; }
  #footer{padding:30px 0;}
  #flogo{padding-bottom:10px;}
  address, .copyright{font-size:14px;}
  .fbtm{padding-bottom:20px; margin-bottom:10px;}
  .fmn a{padding-left:0;padding-right:30px ; font-size:14px;}
  .fmn{margin-top:10px;}
  .ui-dialog .ui-dialog-title{font-size:1.2rem;}
  .category-bx a{margin:5px ;}
  .board_view .title{font-size:20px;padding:0 0 20px;word-break:keep-all;line-height:140%;}
}

@media only screen and (max-width:767px){
	#wrap{min-width: 320px;}
	[id*="mc-cont"]{padding:80px 0;}
	.mv-wrap{padding-top:30vh;}
	.mv-wrap .stit{font-size:var(--font-2xlg);}
	.mv-wrap .tit{font-size:var(--font-3xlg);}
	.mvdeco-txt{font-size:55px;}
	.mvdeco-bg{width:85px;}
	.mc-tit{font-size:var(--font-xlg);font-weight:700;}
	.mnotice .thumb{height:auto;}
	.mnotice .mc-tit::before{width:300px; height:300px;top:8%;}
	.txt-wrap p{font-size:16px;word-break:keep-all;z-index:9;position:relative;}
	.tab{margin:40px auto 1rem;width:75%;}
	#mc-cont2::after{left:-10%;}
	.mdata .slide-btn{left:calc(100% - 140px); top:-20%;width:135px;}
	.swiper-button-prev, .swiper-button-next{}
	.data-swiper .item-wrap .tit{font-size:17px; margin-bottom:10px;}
	.data-swiper .item-wrap .txt-wrap{padding:10px 20px;}
	.swiper-button-prev, .swiper-button-next{width:30px; height:30px; line-height:28px; font-size:14px;margin-top:-16px;}
	.data-toggle{width:30px; height:30px; line-height:28px; font-size:13px;}
	.hash-wrap p{font-size:15px;}
	.mdata .btn-hover{font-size:16px; width:160px; }
	.btn-hover span{width:35px; height:35px; line-height:35px;}
	.more-btn{font-size:15px;}
	.banner{gap:50px;}
	.bg-wrap, #mc-cont1 .mc-tit::before, #mc-cont1 .d_width::after, #mc-cont1 .d_width::before{opacity:0.2;}
	.more-btn span{top:5px; left:5px;}
	.data-mySwiper::after{width:250px; left:5%; bottom:-30%;}
	.archive-list .desc{padding:15px;}
	.archive-list li{width:calc(50% - 20px );}
	.archive-list .desc .subject{font-size:1rem;}
	.board_view .title{padding:0 0 10px;}
	.board-view-title{padding:10px;}
	.board_view .attach li{padding:8px 30px;}
	.board_view .desc{padding:5px 0 ; font-size:12px;}
	.point-tit{font-size:14px; padding:2px 20px;}
	.tab a{font-size:15px;}

}

@media only screen and (max-width:576px){
	.mv-wrap .tit{font-size:35px;}
	.mv-wrap .stit{letter-spacing:-1px;line-height:130%;}
	.mv-wrap .tit{letter-spacing:-1px;}
	.mv-wrap .tit::after{display:none;}
	.tab{width:100%;margin:30px auto 1rem;}
	.tab a{padding:5px 25px;}
	.mnotice .thumb{height:300px;}
	.mnotice .txt{padding:10px 0;}
	.mnotice .tab-content a:nth-child(1), .mnotice .tab-content a:nth-child(2){width:100%}
	.tab-content{margin:30px 0 30px;}
	.mvdeco-txt{padding:0 20px;}
	#mc-cont1 .d_width::before{bottom:-15%;left:-5%;}
	#mc-cont1 .d_width::after{top:-10% ; left:0;}
	#mc-cont1 .mc-tit::before{top:-120%;}
	.ui-dialog .ui-dialog-content{padding:1em 0;}
	.archive-list li{width:100%;}
	.ui-widget.ui-widget-content{padding:10px;}
	.category-bx a{font-size:15px;}
	.mdata .slide-btn{top:-15%;}
	     .mnotice-list{margin:35px 0 30px;}
.mnotice-list li{width:100%; margin:7.5px;}
.mnotice-list li:nth-child(4),.mnotice-list li:nth-child(3){display:none;}
}

@media only screen and (max-width:415px){
	.d_width{ margin: 0 10px;}
	.mnotice .thumb{height:260px;}
	.footer_banner{margin:40px 0;}
	.data-swiper{margin:80px 10px 50px ;}
	#mc-cont2::after{left:-30%; top:-10%;width:200px;}
	.category-bx a{margin:5px 3px; padding:5px 20px;}
	.board_view .title{font-size:18px; }
}

