.code_wrap{
    background-color: #1E99DF;
}
.top_bg_box{}
.top_bg_box .top_bg{
    background-image: url("/static/pringles_worldcup_web/img/guide/flag.webp");
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 0;
    padding-top: 26.944%;
    position: relative;
}
.top_bg_box .top_bg .logo_box{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: calc(45 / 360 * 100%);
}
.top_bg_box .top_bg .logo_box .logo{
    background-image: url("/static/pringles_worldcup_web/img/guide/logo.webp");
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 0;
    padding-top: 124.4%;
}
.sec2_img_box{
    margin: 0 7.77% 35px 7.77%;
    background-color: #fff;
    border-radius: 16.67px;
    padding: 2px;
    position: relative;
}
.sec2_img_box .box_title_box{
    background-color: #E40426;
    border-top-right-radius: 16.67px;
    border-top-left-radius: 16.67px;
    text-align: center;
    color: #fff;
    padding: 14px 0;
}
.sec2_img_box .box_title_box .box_title{
    font-size: clamp(18px, calc(21.67 / 360 * 100vw), 24px);
    letter-spacing: -0.54175px;
    padding-bottom: 6px;
    line-height: 25.12px;
}
.sec2_img_box .box_title_box .box_title span{
    color: #fcf157;
}
.sec2_img_box .box_title_box .sub_title{
    font-family: 'Pretendard';
    font-weight: 700;
    font-size: clamp(10px, calc(13.33/360 * 100vw), 14px);
    letter-spacing: -0.1333px;
}
.guide_img_box{
    width: 100%;
    
}
.guide_img_box .guide_img{
    background-image: url("/static/pringles_worldcup_web/img/guide/image.webp");
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 0;
    padding-top: 100.7246%;
    border-radius: 16.67px;
}


.footer_area{
    background-color: #282828;
    color: #000;
    padding: 23px 6.944%;
}
.footer_area .footer_title_box{text-align: center; margin-bottom: 12px;}
.footer_area .footer_title_box .text{
    font-size: clamp(10px, calc(11.32 / 360 * 100vw), 12px);
    line-height: 14.77px;
    letter-spacing: -0.2264px;
    font-family: "Pretendard";
    color: #fff;
}
.footer_area .footer_title_box .text span{
    color: #FAE301;
}

.kakao_box{margin-bottom: 10px;}
.kakao_box .kakao_box_bg{
    background-color: #FAE301;
    border-radius: 13px;
    padding: 11px 29px;
}
.kakao_box .kakao_box_bg .channel_box{
    display: flex; 
    gap: 11px;
    justify-content: center;
    align-items: center;
    margin-bottom: 6px;
}
.kakao_box .kakao_box_bg .channel_box .icon_box{max-width: 31.57px;}
.kakao_box .kakao_box_bg .channel_box .qr_box{max-width: 26px;}
.kakao_box .kakao_box_bg .channel_box img{width: 100%;}
.kakao_box .kakao_box_bg .channel_box .channel_text_box{
    
}
.kakao_box .kakao_box_bg .channel_box .channel_text_box .text_bg{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 36px;
    background-color: #fff;
    border-radius: 100px;
    padding: 2px 3px 2px 14px;

}
.kakao_box .kakao_box_bg .channel_box .channel_text_box .text_bg .text{
    font-family: "Pretendard";
    font-weight: 700;
    color: #000;
    font-size: clamp(10px, calc(11.49 / 360 * 100vw), 12px);
    letter-spacing: -0.5745px;
}
.kakao_box .kakao_box_bg .channel_box .channel_text_box .text_bg .plus_icon_box{
    width: 20px;
    height: 20px;
    background-color: #282828;
    border-radius: 100px;
    position: relative;
}
.kakao_box .kakao_box_bg .channel_box .channel_text_box .text_bg .plus_icon_box span{
    width: 2px;
    height: 10px;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.kakao_box .kakao_box_bg .channel_box .channel_text_box .text_bg .plus_icon_box span:last-child{
    width: 10px;
    height: 2px;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.kakao_box .kakao_box_bg .channel_order{text-align: center;}
.kakao_box .kakao_box_bg .channel_order .order{
    font-family: "Pretendard";
    color: #000;
    font-size: 10px;
    line-height: 14px;
    font-weight: 500;
    letter-spacing: -0.5px;
}
.footer_area .operating_hours{text-align: center;}
.footer_area .operating_hours .text{
    font-family: 'Pretendard';
    font-size: 10px;
    line-height: 14px;
    letter-spacing: -0.8px;
    font-weight: 500;
    color:#fff
}