@charset "utf-8";

/*
font-family: 'S-CoreDream'; font-weight:400;
font-family: 'S-CoreDream'; font-weight:500;
font-family: 'S-CoreDream'; font-weight:700;
font-family: 'Jalnan'; font-weight:400;
*/


/* **** Common Reset **** */
*{margin:0;padding:0;list-style:none;font-size:14px;font-weight:400;font-family: "S-CoreDream", sans-serif;box-sizing: border-box;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5{margin:0;padding:0;word-wrap:break-word;word-break:break-all;}
li,p,span,strong,a{font-size:inherit;color:inherit;font-family:inherit;}
body, html{width:100%;height:100%;}
body{overflow-x:hidden;background: #f6edf0;}
body.hide{overflow:hidden;}
input,select,img{vertical-align:middle;}
img{border:0;max-width:100%;max-height:100%;}
table{border-collapse:collapse;width:100%;}
table caption{position: absolute;top: 0px;left: 0px;overflow: hidden;display: block !important;width: 0px !important;height: 0px !important;margin: 0 !important;font-size: 0 !important;line-height: 0 !important;}
button,input,optgroup,select,textarea{margin:0;padding:0;border:1px solid;box-sizing:border-box;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit;vertical-align:middle}
button,input,select{display:inline-block}
button,input{overflow:visible}
input[type=search],input[type=text]{-webkit-border-radius:0;-webkit-appearance:none}
input[type=search]{outline-offset:-2px;-webkit-appearance:none}
input[type=search]::-webkit-search-decoration{-webkit-appearance:none}
input[type=file]{border:none}
input[type=file]::-webkit-file-upload-button{font:inherit;-webkit-appearance:button;-moz-appearance:button;border:1px solid #bbb;background:#e0e0e0;box-shadow:none}
input[type=checkbox],input[type=radio]{padding:0;border:none}
button,select{text-transform:none}
[type=button],[type=reset],[type=submit],button{overflow:visible;border-color:transparent;background-color:transparent;cursor:pointer}
textarea{display:block;overflow:auto;resize:vertical}
input[disabled]{background-color:#ebebeb}
select:disabled{background-color:#ebebeb}
select{border:0;position:relative;background: url(../images/common/select.png) no-repeat right 10px center;padding: 0 30px 0 10px;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-appearance: none;appearance: none;}
select::-ms-expand { display: none;}
address,cite,dfn,em,i{font-style:normal}


[hidden]{display:none!important}

.clear{clear:both;}
.clearfix::after{content:"";display:block;clear:both;}
.blind {position: absolute;top: 0px;left: 0px;overflow: hidden;display: inline-block !important;width: 1px !important;height: 1px !important;margin: 0 !important;font-size: 0 !important;line-height: 0 !important;}
a{display:inline-block;text-decoration:none;}

.skip-nav a {position:absolute; left:-3000%;}
.skip-nav a:focus { display:block; left:0; top:0; z-index:10000000000; width:100%; height:30px; line-height:30px; background:#ee2a32; color:#fff; text-align:center;}

.mt0{margin-top: 0px !important;}
.mt5{margin-top: 5px !important;}
.mt10{margin-top: 10px !important;}
.mt20{margin-top: 20px !important;}
.mt30{margin-top: 30px !important;}
.mt40{margin-top: 40px !important;}
.mt50{margin-top: 50px !important;}

.txl{text-align:left !important;}
.txc{text-align:center !important;}
.txr{text-align: right !important;}


.visual{width: 100%;height: 641px;background: url(../images/main_bg.jpg) center no-repeat #fff;background-size: cover;position: relative;box-shadow: 0px 24px 24px rgba(0, 0, 0, 0.07);}
.logo{position: absolute;top: 45px;left: 50px;}
.visual .title-wrap{padding: 55px 5% 35px;text-align: center;}
.year{position: relative;display: inline-block;min-width: 207px;height:64px;line-height:64px;background:#627cc4;font-size: 50px;font-family: "Jalnan";color: #ffffff;box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.05);border-radius: 35px;padding: 0 40px;}
.year::before,
.year::after{content:"";position: absolute;top: 50%;transform: translateY(-50%);width: 10px;height: 10px;background: #fff;border-radius: 50%;}
.year::before{left: 20px;}
.year::after{right: 20px;}
.title{margin: 40px 20px 20px;}
.title > p{display: inline-block;position: relative;font-size: 80px;font-family: "Jalnan";color: #9f5ed1;text-shadow: 12px 12px 12px rgba(164, 105, 209, 0.1);-webkit-text-stroke: 5px #ffffff;text-stroke: 5px #ffffff;}
.title > p::after{content:"";position:absolute;top: -40px;left: 100%;width: 399px;height: 281px;background: url(../images/zip.png) no-repeat;}
/*260420*/.title-wrap > p{font-size: 30px;font-family: "Jalnan";color: #444;line-height: 1.2;word-break: keep-all;}/*260420*/
.title-wrap > p span {color:#0f96f4;position: relative;text-shadow:
    -3px -3px 0 #fff,
     3px -3px 0 #fff,
    -3px  3px 0 #fff,
     3px  3px 0 #fff,
    -3px  0   0 #fff,
     3px  0   0 #fff,
     0   -3px 0 #fff,
     0    3px 0 #fff;margin-right:1px}



main{padding-top: 90px;padding-bottom:100px;max-width: 1410px;margin: 0 auto;}
.tab-nav {position: relative;margin-top: -130px;}
.tab-nav > ul{display: flex;justify-content: space-between;gap: 0 20px;}
.tab-nav > ul > li{width: calc(100% / 6);}
.tab-nav > ul > li a {display: flex;align-items: center;justify-content: center;height: 80px;border: 1px solid #dec9ee;border-radius: 40px;background-color: #fff;color: #222;font-size: 26px;cursor: pointer;transition: all 0.2s ease;box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.02);text-align: center;}
.tab-nav > ul > li a.active {background-color: #9f5ed1;color: #ffffff;position: relative;box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.1);border-color: transparent;}
.tab-nav > ul > li a.active::after {content: "";position: absolute;bottom: -16px;left: 50%;transform: translateX(-50%);border-left: 13px solid transparent;border-right: 13px solid transparent;border-top: 15px solid #9f5ed1;filter: drop-shadow(5px 6px 6px rgba(0, 0, 0, 0.2));}

/*260420 카테고리별 색상 구분 추가*/
.tab-nav > ul > li a.active[data-value="0"] {background-color:#a469d1;}
.tab-nav > ul > li a.active[data-value="0"]::after {border-top: 15px solid #a469d1;}

.tab-nav > ul > li a.active[data-value="1"] {background-color:#d169ce;}
.tab-nav > ul > li a.active[data-value="1"]::after {border-top: 15px solid #d169ce;}

.tab-nav > ul > li a.active[data-value="2"] {background-color:#5073e6;}
.tab-nav > ul > li a.active[data-value="2"]::after {border-top: 15px solid #5073e6;}

.tab-nav > ul > li a.active[data-value="3"] {background-color:#12aab3;}
.tab-nav > ul > li a.active[data-value="3"]::after {border-top: 15px solid #12aab3;}

.tab-nav > ul > li a.active[data-value="4"] {background-color:#686cbd;}
.tab-nav > ul > li a.active[data-value="4"]::after {border-top: 15px solid #686cbd;}

.tab-nav > ul > li a.active[data-value="5"] {background-color:#865675;}
.tab-nav > ul > li a.active[data-value="5"]::after {border-top: 15px solid #865675;}
/*260420*/

.tab-nav > ul > li:hover a,
.tab-nav > ul > li a.active{transform: translateY(-20px);}

.cont-wrap{margin-top:50px;}
.cont-wrap > ul{display:flex;flex-wrap: wrap;gap: 30px;}
.cont-wrap li {width: calc((100% - 30px * 2) / 3);border-radius: 30px;box-shadow: 0 6px 20px rgba(0,0,0,0.1);overflow: hidden;background: #fff;}
/*260420*/
.cont-wrap li a {position: relative;display: block;height: 100%;color: #333;overflow: hidden;border-radius: 30px;display: flex;flex-direction: column}
/*260420*/
.cont-wrap li a:hover{}
/*260420 색상변경*/
.cont-wrap li a:hover::after{content:"";position:absolute;inset:0;border: 4px solid #e881b8;box-sizing: border-box;overflow: hidden;border-radius: 30px;}
.cont-wrap li a:hover .card-sub{color:#ae79d3}
.cont-wrap li a:hover .card-title{color:#79499f;}
.cont-wrap li a:hover .card-btn{color:#fff;background: #ed94c2;box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.05)}
/*260420*/
.cont-wrap li a:hover .card-btn::after{background:url(../images/go_on.png) no-repeat;}

/* 카드 상단 이미지 영역 */
.card-img {width: 100%;max-height: 280px;display: block;text-align: center;}
/* 카드 텍스트 내용 */
/*260420 수정*/.card-content {padding: 40px 25px 25px 25px;text-align: center;background: #fff;display: flex;flex-direction: column;height: 100%;}/*260420*/
.card-sub {font-size: 20px;color: #686868;margin-bottom: 18px;font-weight: 500;}
.card-title {font-size: 30px;font-weight: 700;color: #222;line-height: 1.3;margin-bottom: 20px;}
.card-title b {font-size:18px;font-weight:700}
/*260420 수정*/.card-info {text-align: left;font-size: 16px;line-height: 1.5;display: flex;flex-direction: column;height: 100%;}/*260420*/
.card-info > div{display:flex;font-size: 16px;color: #444;margin-bottom:15px;letter-spacing: -0.5px;}
/*260420 수정*/.card-info span {flex: 0 0 auto;background: #f1e6f8;color: #444444;width: 79px;height: 27px;border-radius: 20px;margin-right: 10px;font-weight: 500;font-size: 16px;display: flex;align-items: center;justify-content: center;margin-top: -1px;}

/*260420*/
/* 자세히보기 버튼 */
/*260420 align self 추가*/
.card-btn {margin-top: 20px;background: #f1e6f8;width: 200px;height: 52px;border-radius: 50px;display: flex;align-items: center;justify-content: center;align-self:end;gap: 0 10px;margin: 25px auto 0;font-size: 20px;color: #222;font-weight: 500;flex-shrink: 0}/*260420*/
.card-btn::after{content:"";background:url(../images/go_off.png) no-repeat;width: 11px;height: 18px;}

footer{text-align: center;background-color: #6c5181;padding: 40px;color: #fff;line-height: 1.8;}
footer ul li{font-size:18px;font-weight: 500;}

@media screen and (max-width: 1800px){
    .visual{height:500px;}
    .title > p::after{background-size: 100% auto;width: 27%;}
}
@media screen and (max-width: 1500px){
    .title > p::after{width: 16%;top: 0;}
    main{padding-left: 20px;padding-right:20px;}
    .cont-wrap > ul{gap:20px;}
    .card-content{padding: 35px 20px 20px 20px;}
    .card-info span{margin-right:5px;}
}
@media screen and (max-width: 1280px){
    .visual{height: 450px;}
    .title > p::after{display:none;}

    .tab-nav > ul > li a{font-size:20px;}
    .cont-wrap li{width:calc((100% - 20px) / 2);}
    .card-img{max-height: max-content;}
    .card-img img{width:100%;}
    .card-content{padding: 35px 20px 40px 20px;}
    .card-info > div {word-wrap: break-word;word-break: keep-all}
    .card-info > div > br.for-pc {display:none}
}
@media screen and (max-width: 1024px){
    main{padding-top: 90px;padding-bottom: 50px;}
    .tab-nav{margin-top:-120px;}
    .tab-nav > ul{gap:10px;}
    .tab-nav > ul > li a{height: 60px;}

}
@media screen and (max-width: 768px){
    .visual{height:auto;padding-bottom: 50px;}
    .logo {width: 70px;top: 20px;left: 20px;}
    .title{width: 90%;text-align: center;margin: 20px auto 10px;}
    .title > p{display:block;height: auto;font-size: 0;}
    .title-wrap > p{font-size:22px;}
    .tab-nav > ul{flex-wrap:wrap;gap: 5px;}
    .tab-nav > ul > li{width: calc((100% - 10px) / 3);}
    .tab-nav > ul > li:hover a,
    .tab-nav > ul > li a.active{transform:none;}
    .tab-nav > ul > li a{border-radius:10px;font-size: 22px;}

    .cont-wrap li{width:100%;}
    .card-title,
    .card-info > div{word-break:keep-all;}

    .card-content{padding: 20px 20px 20px 20px;}
    .card-title{font-size:20px;margin-bottom: 10px;}
    .card-sub{margin-bottom: 10px;font-size: 17px;}
    .card-btn{margin-top:10px;}
}
@media screen and (max-width: 480px){
    .year{font-size:20px;min-width: auto;height: 50px;line-height: 50px;}
    .tab-nav > ul > li a{font-size:16px;}
}