@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');

/* wrap */
.skip-nav{position:absolute;left:0;top:-30px;z-index:9999;}
.skip-nav li{position:absolute;left:0;top:0;width:200px;}
.skip-nav a{position:absolute;left:0;top:0;display:block;width:100%;height:30px;line-height:30px;color:#fff;background:#002960;}
.skip-nav a:focus{top:30px;}
.mobile .skip-nav{display:none;}

.container{background: url(../img/event/allBg.png)no-repeat center top #121328;}
.content {width:1100px;margin:0 auto;}
.content > div{padding-bottom: 50px;}

body{font-family: "Noto Sans KR", "dotum", "Arial"; font-size: 16px; letter-spacing: -0.7px;}

strong.title{display: block; padding-bottom: 20px; font-size: 36px; font-weight: 500; color:#fff;}
div.box{padding:40px; border-radius: 20px;  position: relative; }
div.box > strong{display:block; text-align:center; font-size: 32px; color:#222; letter-spacing: -1.8px; padding-bottom: 26px;}
.listCon.minus li{padding-left: 15px; position: relative; line-height: 160%; font-size: 24px; color:#000}
.listCon.minus li::before{content: '';display: block; width: 7px; height: 2px; background: #000; position: absolute; left:0; top:16px;}
p.copy{font-size: 27px; color:#fff; text-align: center; padding-bottom: 30px;}

.section0{display: flex; align-items: center ; padding:30px 0 70px 0} 
.section0 img{padding-right: 30px;}
.section0 p{display:inline-block; font-size: 46px; color:#fff}
.section0 p span{font-weight: 600;}

.section1 .box{background:#fbdc5b;}
.section1 .box:after{content:''; display: block; position:absolute; background: url(../img/event/section01_icon.png)no-repeat; width: 305px; height: 225px; right: -180px;; top:45%;}
.section1 div.info{display: flex; margin-bottom:10px;}
.section1 div.info > strong{min-width: 130px; height: 46px; font-weight:500; text-align: center; line-height: 46px; color:#fff; font-size: 24px; border-radius: 30px; margin-right: 30px;}
.section1 div.info > strong.pink{background: #b50679;}
.section1 div.info > strong.pink.type2{font-size: 21px; letter-spacing: -0.8px;}
.section1 div.info > strong.blue{background: #0665b5;}
.section1 div.info > p{font-size:24px; color:#000; padding-top: 5px; line-height: 150%;}
.section1 div.info > p span.pink{color:#b50679; font-weight: 600;}
.section1 div.info > p span.subTxt{font-size: 18px; padding-left: 20px;}
.section1 div.info > ul{width:100%}
.section1 div.info > ul li{display: flex; font-size: 24px; color:#000; line-height: 160%; letter-spacing: -1.6px;}
.section1 div.info > ul li p{padding-top: 3px; }
.section1 div.info > ul li span{padding-right: 5px;padding-top: 3px;}

.section2 div.box{background:#8ccef7; text-align: center;}
.section2 div.box:after{content:''; position: absolute; background: url(../img/event/section02_icon.png)no-repeat; width:231px; height:169px; left:-170px; top:50%; transform: translateY(-50%);}
.section2 div.box ul{ text-align: left; padding-left: 120px;}

.section3 div.box{background:#d38cf7; text-align: center;padding: 60px }
.section3 div.box:after{content:''; position: absolute; background: url(../img/event/section03_icon.png)no-repeat; width: 312px; height: 184px; right: -150px; top:50%; transform: translateY(-50%);}
.section3 div.box ul{ text-align: left; padding-left: 210px;}


@media all and (max-width:1500px) {
    div.box:after{display: none !important;}
}
@media all and (max-width:1200px) {
   .container{padding: 0 20px; background-size: auto 100%;}
   .content{width: auto;}
   .section0{justify-content: center;}
}
@media all and (max-width:960px) {
    .section0{flex-direction: column;}
    .section0 p{font-size: 36px;}
    strong.title{font-size: 28px;}
    div.box > strong{font-size: 28px;}
    ul.listCon{padding-left: 0 !important;}
}
@media all and (max-width:640px) {
    .container{padding: 0 10px;}
    .content > div{padding-bottom: 30px;}
    div.box{padding: 20px;}
    div.box > strong{font-size: 18px; padding-bottom: 15px;}
    .listCon.minus li{font-size: 16px; padding-left: 10px;}
    .listCon.minus li::before{height: 1px; width: 5px; top:13px;}
    strong.title{font-size: 22px; padding-bottom: 15px;}
    p.copy{font-size: 16px;}
    .section0 p{font-size: 26px;}
    .section0 img{padding-right: 0;}
    .section1 div.info > strong,
    .section1 div.info > strong.pink.type2{min-width: 110px; font-size: 17px; height: 35px; line-height: 35px; margin-right: 15px;}
    .section1 div.info > p{width: 100%; font-size: 15px;}
    .section1 div.info > p br{display: none;}
    .section1 div.info > p span.subTxt{display:block; padding-left: 0; font-size: 13px;}
    .section1 div.info.mgt30{flex-direction: column;}
    .section1 div.info > ul li{font-size: 16px;}
    .section1 div.info > strong.blue{width: 110px; margin-bottom: 10px;}
    .section1 div.info > ul li p{padding-top: 0;}
    
    .section3 div.box{padding:20px}
}
@media all and (max-width:440px) {
    .section0 img{width: 200px;}
    .section1 div.info{flex-direction: column;}
    .section1 div.info > strong, .section1 div.info > strong.pink.type2{width: 110px;}
}