@charset "utf-8";
/*  
	-----------------------------------------------
	* main.css (포털 메인)
	-----------------------------------------------
*/
body #wrap {overflow:hidden;}

.visual_wrap {height:640px; position:relative;}
.visual_wrap .bgslide  {position:absolute; top:0; left:0; width:100%; height:100%;}
.visual_wrap .bgslide .vbg {height:640px; width:100%; background-size:cover!important;}
.visual_wrap .bgslide .mb01 {background:url(/pspace/images/main/bg01.jpg) no-repeat 50% 50%;}
.visual_wrap .bgslide .mb02 {background:url(/pspace/images/main/bg02.jpg) no-repeat 50% 50%;}

.visual_wrap .vcon {position:relative; height:100%;}
.visual_wrap .vcopy {padding-top:20rem;}

.popupzone {background:#fff; width:700px; height:390px; border-radius:50px; overflow:hidden; position:absolute; top:60px; right:0;  }
.popupzone .tit {display:flex; align-items:center; justify-content:center; transform:rotate(90deg); width:400px; height:65px; position:absolute; top:165px; right:-168px; z-index:1;}
.popupzone .tit > p {font-size:2rem; margin-right:2rem;}
.popupzone .tit > p strong {font-weight:700;}
.popupzone .tit .controll {display:flex; align-items:center; }
.popupzone .tit .controll .count {font-weight:700; font-size:1.2rem; color:#a6a6a6; margin-right:2rem;}
.popupzone .tit .controll .count .current{color:#000;}
.popupzone .tit .controll button {width:20px; height:20px; background-image:url(/pspace/images/main/controll_bg.png); background-repeat:no-repeat; margin:0 2px; overflow:hidden; text-indent:-9999px;}
.popupzone .tit .controll button.prev-slide {background-position:0 0;}
.popupzone .tit .controll button.stop-slide {background-position:0 -20px;}
.popupzone .tit .controll button.start-slide {background-position:0 -40px;}
.popupzone .tit .controll button.next-slide {background-position:0 -60px;}
.popupzone .popupzone_slide {background:#000; width:calc(100% - 65px); height:390px;}
.popupzone .popupzone_slide .items img {width:100%;}

.noti {position:absolute; bottom:-1px; right:-110px; background:url(/pspace/images/main/notibg.png) no-repeat 0 bottom; width:880px; padding:40px 200px 0 200px; height:145px; transition:all .2s;}
.noti > div {position:relative; }
.noti .tit {display:flex; justify-content:center; align-items:center; margin-bottom:20px;}
.noti h3 {font-size:2.5rem; background:url(/pspace/images/main/notititbg.png) no-repeat 0 bottom; padding-left:40px; margin-top:0;}
.noti .controll {display:flex; align-items:center; margin-top:0; margin-left:20px;}
.noti .controll button {width:20px; height:20px; background-image:url(/pspace/images/main/controll_bg.png); background-repeat:no-repeat; margin:0 2px; overflow:hidden; text-indent:-9999px;}
.noti .controll button.prev-slide {background-position:0 0;}
.noti .controll button.stop-slide {background-position:0 -20px;}
.noti .controll button.start-slide {background-position:0 -40px;}
.noti .controll button.next-slide {background-position:0 -60px;}
.noti .controll a {width:20px; height:20px; background:url(/pspace/images/main/moreicon.png) no-repeat 50% 50%; overflow:hidden; text-indent:-9999px;}

.notislide .items {padding-left:10px; position:relative;}
.notislide .items:before {content:''; display:block; width:0.5rem; height:0.5rem; border-radius:50%; background:#008656; position:absolute; top:0.5rem; left:0;}
.notislide .items a {position:relative; display:flex; justify-content:space-between; font-size:1.6rem; }
.notislide .items a span.notitit {width:calc(100% - 120px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.notislide .items a span.notidate {width:100px; text-align:right;}
.daegwan {position:absolute; bottom:0; right:-110px; animation:daegwan 1.5s linear infinite;  transition:all .2s;}
@keyframes daegwan {
	0%{transform:translateY(0);}
	50% {transform:translateY(-10px);}
	100% {transform:translateY(0);}
}

@media (max-width:1800px) {
	.noti {right:0px;}
	.daegwan {right:0px;}
}

@media (max-width:1580px) {
	.visual_wrap .vcon {width:calc(100% - 20px);}
	.visual_wrap .vcopy {width:calc(100% - 750px);}
	.visual_wrap .vcopy img {max-width:100%;}
}
@media (max-width:1280px) {
	.visual_wrap {height:auto;}
	.visual_wrap .bgslide .slick-list,
	.visual_wrap .bgslide .slick-track,
	.visual_wrap .bgslide .slick-slide,
	.visual_wrap .bgslide .slick-slide > div,
	.visual_wrap .bgslide .vbg {height:100%;}
	.popupzone {position:relative; top:initial; right:initial;  margin:0 auto;}	
	.visual_wrap .vcopy {padding-top:5rem; width:100%; text-align:center;}
	.noti {position:relative; bottom:initial; right:initial; margin:20px auto 0;}
}

@media (max-width:1024px) {
	.noti { background:url(/pspace/images/main/notibg.png) no-repeat 50% bottom; width:calc(100% + 20px); margin-left:-10px; padding:40px 0 0 0; height:145px; transition:all .2s;}
	.noti > div {max-width:550px; margin:0 auto; padding:0 10px;}
}
@media (max-width:768px) {
	.daegwan {display:none;}
	.popupzone {background:#fff; width:auto; height:auto; max-width:700px;}
	.popupzone .tit {transform:rotate(0); width:100%; height:65px; position:relative; top:initial; right:initial; z-index:1;}
	.popupzone .popupzone_slide {width:100%; height:auto;}
	.popupzone .popupzone_slide .items {height:100%; display:block!important;}
}

.mainschedule {margin:3rem 0 6rem; position:relative;}
.mainschedule > div:before {content:''; display:block; width:319px; height:293px; background:url(/pspace/images/main/scbbg.png) no-repeat 50% 50%; position:absolute; top:0; right:-100px; z-index:0;}
.mainschedule > div:after {content:''; display:block; width:250px; height:388px; background:url(/pspace/images/main/scbbg2.png) no-repeat 50% 50%; position:absolute; bottom:-90px; left:-160px; z-index:2;}
.mainschedule h3 {font-family: 'OAGothic'; font-weight:800; font-size:4.8rem; margin-top:0; margin-bottom:8rem;}
.mainschedule h3:before {content:''; display:inline-block; width:10rem; height:10rem; background:url(/pspace/images/main/scbg.png) no-repeat 50% 50%; background-size:100%; transform:translateY(3rem); margin-right:2rem;}
.mainschedule h3:after {content:''; display:inline-block; width:5rem; height:8.9rem; background:url(/pspace/images/main/scbg2.png) no-repeat 50% 50%; background-size:100%; transform:translateY(6rem); margin-left:2rem;}
.mainschedule h3 span {color:#f73b73;}

.mainschedule .sc {background:#fff; border-radius:50px; overflow:hidden; display:flex; flex-wrap:wrap; align-items:center; box-shadow:3px 3px 15px rgba(0,0,0,0.2); z-index:1; position:relative;}
.mainschedule .sc .cal-month {background:#000; color:#fff; width:150px; height:100%; padding:5rem 3rem; text-align:center; font-size:2rem; font-weight:700; line-height:1.2em; text-align:center;}
.mainschedule .sc .cal-month img { display:block; line-height:1.4em; margin:0.5rem auto 0; }

.mainschedule .sc .sc_slide {width:calc(100% - 150px); padding:2.5rem 7rem; }
.mainschedule .sc .sc_slide .week {display:flex!important; justify-content:space-around;}
.mainschedule .sc .sc_slide .week a {display:block; text-align:center; font-size:2.5rem; font-weight:700; color:#9c9c9c; line-height:1.2em;  border-radius:50px; width:6rem; padding:2rem 0;}
.mainschedule .sc .sc_slide .week a span {display:block; font-weight:700;}
.mainschedule .sc .sc_slide .week a strong {display:block; color:#000; margin-top:1rem; font-weight:700;}
.mainschedule .sc .sc_slide .week a strong em {font-size:1.6rem; opacity:0.3; color:#000; display:block; line-height:1em; }

.mainschedule .sc .sc_slide .week a.today {background:#f9f9f9;}
.mainschedule .sc .sc_slide .week a.inhave {background: -webkit-gradient(linear, left top, right top, color-stop(0, #f72583), color-stop(1, #f79c25));
	background: -moz-linear-gradient(left, #f72583 0%, #f79c25 100%);
	background: -webkit-linear-gradient(left,  #f72583 0%, #f79c25 100%);
	background: -o-linear-gradient(left,  #f72583 0%, #f79c25 100%);
	background: -ms-linear-gradient(left,  #f72583 0%, #f79c25 100%);
	background: linear-gradient(left,  #f72583 0%, #f79c25 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f72583', endColorstr='#f79c25', gradientType=1);
}
.mainschedule .sc .sc_slide .week a.sun span,
.mainschedule .sc .sc_slide .week a.sun strong,
.mainschedule .sc .sc_slide .week a.sun strong em {color:#df2954!important;}
.mainschedule .sc .sc_slide .week a.sat span,
.mainschedule .sc .sc_slide .week a.sat strong,
.mainschedule .sc .sc_slide .week a.inhave strong em {color:#0941c1!important;}
.mainschedule .sc .sc_slide .week a.inhave span,
.mainschedule .sc .sc_slide .week a.inhave strong,
.mainschedule .sc .sc_slide .week a.inhave strong em {color:#fff!important;}
.mainschedule .sc .sc_slide .week a.off {opacity:0.2;}
.mainschedule .sc .sc_slide button {position:absolute; top:calc(50% - 2.2rem); border-radius:50%; width:4.4rem; height:4.4rem; overflow:hidden; text-indent:-9999px;}
.mainschedule .sc .sc_slide button.slick-prev {left:20px; background:#000 url(/pspace/images/main/cal_left.png) no-repeat 50% 50%;}
.mainschedule .sc .sc_slide button.slick-next {right:20px; background:#000 url(/pspace/images/main/cal_right.png) no-repeat 50% 50%;}
.mainschedule .sc .sc_slide button.slick-disabled {opacity:0.1; cursor:default;}

.sc-con {background:#f9f9f9; padding:3rem 5rem; margin-top:5rem; border-radius:50px; display:flex; flex-wrap:wrap; justify-content:space-between;}
.sc-con .sctab {width:25%;}
.sc-con .sctab a {background:#efefef; display:block; border-radius:30px; margin:2rem 0; padding:3px;}
.sc-con .sctab a p {background:#fff;  padding:3rem; border-radius:28px; height:100%;}
.sc-con .sctab a p span {font-size:1.8rem; font-weight:700; color:#444; display:block;}
.sc-con .sctab a p strong {font-size:2.4rem; font-weight:700;  color:#333; display:block; line-height:1.4em; }
.sc-con .sctab a.on {background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #de5889), color-stop(1, #613db6));
	background: -moz-linear-gradient(top, #de5889 0%, #613db6 100%);
	background: -webkit-linear-gradient(top,  #de5889 0%, #613db6 100%);
	background: -o-linear-gradient(top,  #de5889 0%, #613db6 100%);
	background: -ms-linear-gradient(top,  #de5889 0%, #613db6 100%);
	background: linear-gradient(top,  #de5889 0%, #613db6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#de5889', endColorstr='#613db6', gradientType=0);}

.sc-con .sctab a[href="#sc01"] p{background:#fff url(/pspace/images/main/stab01.png) no-repeat right 50%;}
.sc-con .sctab a[href="#sc02"] p{background:#fff url(/pspace/images/main/stab02.png) no-repeat right 50%;}
.sc-con .sctab a[href="#sc03"] p{background:#fff url(/pspace/images/main/stab03.png) no-repeat right 50%;}
.sc-con .sctab a[href="#sc04"] p{background:#fff url(/pspace/images/main/stab04.png) no-repeat right 50%;}

.sc-con .sclist {width:calc(75% - 50px); background:#fff; border-radius:30px; padding:3rem 3rem 3rem 5rem; margin:2rem 0;}
.sc-con .sclist > ul {overflow-y:auto; height:460px; padding-right:3rem;}
.sc-con .sclist > ul > li {border-bottom:1px solid #e5e5e5; padding:3rem 0; position:relative;}
.sc-con .sclist > ul > li p.tit {font-size:2.4rem; font-weight:300; font-family: 'GmarketSans'; line-height:1.4em; margin-bottom:1rem;}
.sc-con .sclist > ul > li p.tit:before {content:''; display:inline-block; width:1.2rem; height:1.2rem; border-radius:50%; background:#eb245c; transform:translateY(-1px); margin-right:5px;}

.sc-con .sclist > ul > li > ul {display:flex;}
.sc-con .sclist > ul > li > ul > li {margin-right:5rem; font-size:2rem;}
.sc-con .sclist > ul > li > ul > li strong {color:#000;}
.sc-con .sclist > ul > li > ul > li strong:after {content:''; display:inline-block; width:1px; height:10px; background:#ccc; transform:translateY(-2px); margin:0 10px;}
.sc-con .sclist > ul > li > ul > li span {color:#4d4d4d;}
.sc-con .sclist > ul > li > em {background:#000; color:#fff; font-family: 'GmarketSans';  padding:1.2rem 3rem 1rem 3rem; border-radius:30px; font-size:2rem; position:absolute; top:calc(50% - 2rem); right:0;}
.sc-con .sclist > ul > li.nodata {border-bottom:0; display:flex; height:100%; align-items:center; justify-content:center; font-size:2rem; color:#666;}


@media (max-width:1580px) {
	.mainschedule > div {width:calc(100% - 20px);}
	.mainschedule > div:after {display:none;}
}
@media (max-width:1280px) {
	.sc-con .sclist > ul {height:410px;}
	.sc-con {padding:1rem 3rem;}
	.sc-con .sclist {width:calc(75% - 20px);}
}
@media (max-width:1024px) {
	.mainschedule {margin:3rem 0;}
	.mainschedule > div:before {transform:scale(0.7);}
	.sc-con {margin-top:2rem; padding:2rem;}
	.sc-con .sctab {width:100%; display:flex; flex-wrap:wrap;  justify-content:space-around;}
	.sc-con .sctab a {width:calc(25% - 1rem); margin:1rem 0;}
	.sc-con .sctab a p {text-align:center; padding:2rem 0.5rem; background:#fff!important;}
	.sc-con .sctab a p strong{font-size:2rem;}
	.sc-con .sctab a p span {display:none;}
	.sc-con .sclist {width:100%;}
}
@media (max-width:768px) {
	.mainschedule {margin-top:0;}
	.mainschedule > div:before {top:-50px; right:-100px;}
	.mainschedule h3 {font-size:3rem; margin-bottom:3rem;}
	.mainschedule h3:before {width:5rem; height:5rem;  transform:translateY(1.3rem); margin-right:1rem;}
	.mainschedule h3:after {width:3rem; height:5.34rem; transform:translateY(2rem); margin-left:1rem;}
	.mainschedule h3 span {color:#f73b73;}
	
	.mainschedule .sc {display:block;}
	.mainschedule .sc .cal-month { width:100%; height:auto; padding:1rem 5rem; display:flex; align-items:center; justify-content:center; text-align:center;}
	.mainschedule .sc .cal-month img { display:block;width:3rem; height:3rem; margin:0;  margin-left:1rem; }
	.mainschedule .sc .sc_slide {width:100%; padding:1.5rem 4rem;}
	.mainschedule .sc .sc_slide .week a {font-size:2rem; width:auto; padding:1rem 0; width:4rem;}
	.mainschedule .sc .sc_slide .week a strong {margin-top:0.5rem;}
	.mainschedule .sc .sc_slide button {transform:scale(0.75);}
	.mainschedule .sc .sc_slide button.slick-prev {left:0px;}
	.mainschedule .sc .sc_slide button.slick-next {right:0px;}	
	
	.sc-con .sclist {padding:1rem 1rem 1rem 3rem; margin:2rem 0;}	
	.sc-con .sclist > ul {height:360px; padding-right:2rem;}
	.sc-con .sclist > ul > li > ul {flex-direction:column; gap:1.5rem;}
	.sc-con .sclist > ul > li > ul > li strong {color:#000; display:inline-block; width:80px; position:relative;}	
	.sc-con .sclist > ul > li > ul > li strong:after {content:''; display:inline-block; margin:0; position:absolute; top:3px; right:10px;}
	.sc-con .sclist > ul > li > em {position:relative; top:initial; right:initial; display:inline-block; margin-top:1rem;}
}
@media (max-width:520px) {
	.mainschedule > div:before {display:none;}
	.sc-con .sctab a {width:calc(50% - 1rem); margin:0.5rem 0;}
	.sc-con .sctab a p {padding:1rem 0.5rem;}
}

.maininfo {margin:7rem 0; position:relative; }
.maininfo > div:before {content:''; display:block; width:350px; height:288px; background:url(/pspace/images/main/fesbbg.png) no-repeat 50% 50%; position:absolute; top:0; right:-100px; z-index:0;}
.maininfo h3 {font-family: 'OAGothic'; font-weight:800; font-size:4.8rem; margin-top:0; margin-bottom:6rem;}
.maininfo h3:before {content:''; display:inline-block; width:10rem; height:10rem; background:url(/pspace/images/main/fesbg.png) no-repeat 50% 50%; background-size:100%; transform:translateY(3rem); margin-right:2rem;}
.maininfo h3:after {content:''; display:inline-block; width:4.4rem; height:6.7rem; background:url(/pspace/images/main/fesbg2.png) no-repeat 50% 50%; background-size:100%; transform:translateY(0.8rem); margin-left:2rem;}
.maininfo h3 span {color:#4d36ff;}

.maininfo > div > div{display:flex; justify-content:space-between; position:relative; z-index:1; flex-wrap:wrap;}
.maininfo > div > div a {border-radius:20px; background:#fff; box-shadow:3px 3px 10px rgba(0,0,0,0.2);width:calc(25% - 20px); padding:3px; transition:all .2s; position:relative;}
.maininfo > div > div a > div {background:#fff;  padding:50px;border-radius:18px; height:100%;}
.maininfo > div > div a .title {font-size:2.8rem; font-family: 'GmarketSans'; color:#000; transition:all .2s; line-height:1.2em; position:relative; z-index:1;}
.maininfo > div > div a .copy {font-size:1.8rem; color:#595959; margin-top:1rem; position:relative; z-index:1; line-height:1.2em;}
.maininfo > div > div a .baro {margin-top:3rem; display:inline-block; padding-right:30px;  font-family: 'OAGothic'; font-weight:400; color:#000; font-size:1.6rem; line-height:20px;  position:relative; z-index:1;}
.maininfo > div > div a .baro:after {content:''; display:block; width:20px; height:20px; background:url(/pspace/images/main/placeicon.png) no-repeat 50% 50%; position:absolute; top:0; right:0; opacity:0.3; transition:all .2s;}

.maininfo > div > div a:hover {background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #de5889), color-stop(1, #613db6));
	background: -moz-linear-gradient(top, #de5889 0%, #613db6 100%);
	background: -webkit-linear-gradient(top,  #de5889 0%, #613db6 100%);
	background: -o-linear-gradient(top,  #de5889 0%, #613db6 100%);
	background: -ms-linear-gradient(top,  #de5889 0%, #613db6 100%);
	background: linear-gradient(top,  #de5889 0%, #613db6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#de5889', endColorstr='#613db6', gradientType=0);}

.maininfo > div > div a:hover .title {color:#b71f25;}
.maininfo > div > div a:hover .baro:after {opacity:1;}

.maininfo > div > div a:before {content:''; display:block; width:10rem; height:10rem; background-size:100%!important; position:absolute; bottom:10px; right:10px; z-index:0;}
.maininfo > div > div a:nth-of-type(1):before {background:url(/pspace/images/main/placeimg01.png) no-repeat 50% 50%;}
.maininfo > div > div a:nth-of-type(2):before {background:url(/pspace/images/main/placeimg02.png) no-repeat 50% 50%;}
.maininfo > div > div a:nth-of-type(3):before {background:url(/pspace/images/main/placeimg03.png) no-repeat 50% 50%;}
.maininfo > div > div a:nth-of-type(4):before {background:url(/pspace/images/main/placeimg04.png) no-repeat 50% 50%;}
@media (max-width:1580px) {
	.maininfo > div{width:calc(100% - 20px);}
}
@media (max-width:1024px) {
	.maininfo > div > div a {width:calc(50% - 10px); margin-bottom:20px;}
}
@media (max-width:768px) {
	.maininfo {margin-top:0;}
	.maininfo h3 {font-size:3rem; margin-bottom:3rem;}
	.maininfo h3:before {width:5rem; height:5rem;  transform:translateY(1.3rem); margin-right:1rem;}
	.maininfo h3:after {width:3rem; height:5.34rem; transform:translateY(2rem); margin-left:1rem;}
	.maininfo > div > div a > div {padding:20px;}
	.maininfo > div > div a:before {width:7.5rem; height:7.5rem;}
}
@media (max-width:520px) {
	.maininfo > div > div a {width:100%;}
	.maininfo h3 {font-size:2.4rem;}
}