@charset "utf-8";

#contents{padding: 0;margin: 0;}
.lottery{margin: 0 auto;width: 100%;background-image: url(../../asset/images/top/lottery/bg.png);background-repeat: repeat-y;background-position: center top;background-size: 100% auto;}
.lottery .lotteryTit{margin: 0 auto;width: 100%;}
.lottery .lotteryInner{padding: 5.333vw 6.4vw;}
.lottery .lotteryInner .campaignBox{border: 3px solid #CF2C37;border-top: none;background-color: #fff;border-radius: 9px;padding: 0;margin-bottom: 13.6vw;}
.lottery .lotteryInner .campaignBox .campaignTit{color: #ffff;font-size: 5vw;font-weight: 700;background-color: #CF2C37;border-radius: 7px 7px 9px 9px;height: 8.533vw;justify-content: center;align-items: center;}
.lottery .lotteryInner .campaignBox .campaignInner{padding: 4vw 4.8vw;background-color: #FDF6CE;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList{width: 100%;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li{width: 100%;background-color: #CF2C37;border-radius: 8px;padding: 2.933vw 0 3.466vw;text-align: center;color: #fff;position: relative;margin-bottom: 6.6vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .titStep{font-size: 4vw;font-weight: 900;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .titStep span{font-size: 5.6vw;font-weight: 900;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .textStep{font-size: 4vw;font-weight: 900;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .textStep.large{font-size: 7.2vw;font-weight: 900;margin: 6vw 0;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep01{position: absolute;width: 29.8vw;left: -8.5vw;top: -13vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep02{position: absolute;width: 19.733vw;right: -3.2vw;top: -10.6vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep03{position: absolute;width: 21.3vw;left: -3.7vw;top: -5.86vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep04{position: absolute;width: 22.9vw;right: -3.7vw;top: -12vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep05{position: absolute;width: 17.6vw;left: -3.7vw;top: -7.7vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .bnrStep{border-bottom: 2px solid #fff;border-top: 2px solid #fff;padding: 1.466vw 0 2.666vw;width: 89%;margin: 2vw auto 0;font-size: 3.733vw;font-weight: 700;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .bnrStep span{display: block;font-size: 2.666vw;font-weight: 700;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li::after{content: "";border-right: 10px solid transparent;border-left: 10px solid transparent;border-top: 10px solid #CF2C37;border-bottom: 0;position: absolute;left: 45%;bottom: -18px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li:last-of-type::after{display: none;}
.lottery .lotteryInner .campaignBox .campaignInner .stepNote{background-color: #FEEAED;padding: 2vw;color: #CF2C37;font-size: 2.4vw;line-height: 1.3;}
.lottery .lotteryInner .campaignBox .campaignInner .stepSns{width: 100%;background-color: #CF2C37;border-radius: 8px;padding: 3.2vw 0 5vw;text-align: center;color: #fff;margin-bottom: 2.1vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepSns .snsTitle{font-size: 4.26vw;color: #fff;font-weight: 700;text-align: center;margin-bottom: 3.2vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepSns .snsList{margin: 0 auto;width: 52.2vw;display: flex;justify-content: space-between;}
.lottery .lotteryInner .campaignBox .campaignInner .stepSns .snsList li{width: 17.3%;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail{width: 96%;margin: 0 auto 2vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl{font-size: 3.2vw;color: #203165;display: flex;justify-content: space-between;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl:last-of-type{border-top: 2px solid #203165;padding: 1vw 0 0;margin-top: 1vw;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl dt{font-weight: 700;width: 21%;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl dd{font-weight: 700;width: 79%;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl dd small{font-size: 2.6vw;font-weight: 700;display: block;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl dd span{font-weight: 700;font-size: 2.6vw;margin-left: 10vw;}
.lottery .lotteryInner .campaignBox .campaignMap{width: 100%;background-color: #CF2C37;border-radius: 9px 9px 6px 6px;height: 14.6vw;display: flex;justify-content: center;align-items: center;color: #fff;}
.lottery .lotteryInner .campaignBox .campaignMap span{color: #fff;font-size: 5vw;font-weight: 700;background: url(../images/top/lottery/btn_map.png) no-repeat right center;padding: 2vw 9.6vw 2vw 0;background-size: 6.9vw auto;}
.lottery .lotteryInner .campaignBox .campaignMap .popup-open{width: 100% !important;background: none !important;}
.popup {z-index: 10;position: fixed;top: 0;left: 0;width: 100%;height: 100%;transform: scale(0);opacity: 0;transition: opacity 0.3s, transform 0s 0.3s;}

.lottery .lotteryInner .presentBox{padding: 0 4.26vw 4.26vw;background-color: #FDF6CE;border: 3px solid #CF2C37;border-radius: 9px;text-align: center;}
.lottery .lotteryInner .presentBox .presentTit{margin: -7.5vw auto 0;width: 74.1vw;height: 14.1vw;background: url(../../asset/images/top/lottery/bg_present.png) no-repeat center top;background-size: 100% auto;font-size: 7.466vw;color: #FCF7CD;font-weight: 900;text-align: center;}
.lottery .lotteryInner .presentBox .presentPrize{font-size: 10.9vw;font-weight: 900;text-align: center;color: #CF2C37;line-height: 1;padding: 3.73vw 18.4vw 4vw;background-image: url(../../asset/images/top/lottery/bg_prize_left.png), url(../../asset/images/top/lottery/bg_prize_left.png);background-repeat: no-repeat;background-position: left center, right center;background-size: 15.7vw auto;display: inline-block;}
.lottery .lotteryInner .presentBox .presentPrize.opt{margin: 4vw 0;}
.lottery .lotteryInner .presentBox dl{}
.lottery .lotteryInner .presentBox dl dt{background-color: #203165;color: #fff;font-size: 2.4vw;font-weight: 600;text-align: center;padding: 1vw 0;}
.lottery .lotteryInner .presentBox dl dd{background-color: #fff;text-align: center;padding: 2.666vw 0 4vw;}
.lottery .lotteryInner .presentBox dl dd .presentText{font-size: 2.784vw;line-height: 1.36;margin-bottom: 1.5vw;}
.lottery .lotteryInner .presentBox dl dd .presentImg{margin: 0 auto;width: 48.8vw;}
.lottery .lotteryInner .presentBox dl dd .presentNote{font-size: 2.784vw;line-height: 1.36;margin:1vw 0 1.5vw;}



@media screen and (min-width: 1024px) {
.lottery .lotteryInner{padding: 40px 48px;}
.lottery .lotteryInner .campaignBox{margin-bottom: 100px;}
.lottery .lotteryInner .campaignBox .campaignTit{font-size: 38px;height: 64px;}
.lottery .lotteryInner .campaignBox .campaignInner{padding: 30px 36px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li{padding: 11px 0 25px;margin-bottom: 57px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .titStep{font-size: 30px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .titStep span{font-size: 58px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .textStep{font-size: 30px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .textStep.large{font-size: 54px;margin: 50px 0 40px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep01{width: 224px;left: -64px;top: -90px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep02{width: 148px;right: -26px;top: -80px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep03{width: 160px;left: -28px;top: -44px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep04{width: 172px;right: -18px;top: -106px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .imgStep05{width: 133px;left: -26px;top: -60px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .bnrStep{padding: 11px 0 20px;margin: 14px auto 0;font-size: 28px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li .bnrStep span{font-size: 20px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepList li::after{border-right: 20px solid transparent;border-left: 20px solid transparent;bottom: -30px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepNote{padding: 15px;font-size: 18px;}
.lottery .lotteryInner .campaignBox .campaignInsta{height: 146px;justify-content: center;align-items: center;}
.lottery .campaignInsta img{width: 94px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepSns{padding: 24px 0 36px;margin-bottom: 16px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepSns .snsTitle{font-size: 32px;margin-bottom: 24px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepSns .snsList{width: 68.7%;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail{margin: 0 auto 30px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl{font-size: 24px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl:last-of-type{padding: 12px 0 0;margin-top: 12px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl dd span{font-size: 20px;margin-left: 70px;}
.lottery .lotteryInner .campaignBox .campaignInner .stepDetail dl dd small{font-size: 18px;}
.lottery .lotteryInner .campaignBox .campaignMap{height: 110px;}
.lottery .lotteryInner .campaignBox .campaignMap span{font-size: 38px;padding: 20px 72px 20px 0;background-size: 52px auto;}
}



@media screen and (min-width: 1024px) {
.lottery .lotteryInner .presentBox{padding: 0 32px 32px;}
.lottery .lotteryInner .presentBox .presentTit{margin: -56px auto 0;width: 84%;height: 106px;font-size: 56px;}
.lottery .lotteryInner .presentBox .presentPrize{font-size: 82px;padding: 28px 140px 30px;background-size: 120px auto;}
.lottery .lotteryInner .presentBox .presentPrize.opt{margin: 30px 0;}

.lottery .lotteryInner .presentBox dl{}
.lottery .lotteryInner .presentBox dl dt{font-size: 18px;padding: 10px 0;}
.lottery .lotteryInner .presentBox dl dd{padding: 20px 0 40px;}
.lottery .lotteryInner .presentBox dl dd .presentText{font-size: 22px;margin-bottom: 10px}
.lottery .lotteryInner .presentBox dl dd .presentImg{width: 366px;}
.lottery .lotteryInner .presentBox dl dd .presentNote{font-size: 22px;margin:12px 0 30px;}
}