body { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; min-width: 1400px; background-color: #d5d6d7; } body::after{ position:absolute; width:0; height:0; overflow:hidden; z-index:-1; content: url('../images/event02/nav02.png') url('../images/event02/nav03.png') url('../images/event02/nav04.png') url('../images/event02/pic02_1.png') url('../images/event02/pic02_2.png') url('../images/event02/pic03_1.png') url('../images/event02/pic03_2.png') url('../images/event02/pic04_1.png') url('../images/event02/pic04_2.png') url('../images/company/pic01.png') url('../images/company/pic02.png') url('../images/company/pic03.png') url('../images/company/pic04.png') url('../images/company/pic05.png') url('../images/company/pic06.png') url('../images/company/pic07.png'); } .htmlWrapper {width:100%;max-width:1920px;margin:0 auto;padding-bottom:0;position:relative;overflow:hidden;} .htmlWrapper section {background-position:center;min-width:1400px;overflow:hidden;} /* 상단 */ .htmlWrapper section.top_wrapper {position:relative;display:flex;justify-content:center;align-items:center;width:100%;height:50px;box-sizing:border-box;z-index:1;background:#FFFFFF;font-size:20px;font-family:'Pretendard';overflow:visible;} .htmlWrapper section.top_wrapper > .hx_top{position:relative;height:100%;display:flex;justify-content:center;align-items:center;gap:0 5px;} .htmlWrapper section.top_wrapper > .hx_top span{font-size:24px;font-weight:800;color:#E60012;font-family:'ONE-Mobile-Title';margin-top:10px;} .htmlWrapper section.top_wrapper > .hx_top span.com_logo{margin-top:7px;} .htmlWrapper section.top_wrapper > .hx_top span.first{} .htmlWrapper section.top_wrapper > .hx_top i{margin-top:3px;margin-right:10px;} .htmlWrapper section.top_wrapper > .hx_top .company_logo{} .htmlWrapper section.top_wrapper > .hx_top div.ment{margin-top:-5px;} .htmlWrapper section.top_wrapper > .hx_top .hx_txt{position:absolute;top:40px;} /* Visual */ .htmlWrapper section.visual_wrapper {position:relative;width:100%;height:880px;background-repeat:no-repeat;background-position:center;background-image:url('../images/visual/bg.jpg');} .htmlWrapper section.visual_wrapper .contents_wrap{position:relative;width:100%;height:100%;display:flex;justify-content:center;padding:240px 0 0 0;box-sizing:border-box;} .htmlWrapper section.visual_wrapper .contents_wrap .title_wrapper{position:relative;width:1440px;height:400px;display:flex;justify-content:center;align-items:center;} .htmlWrapper section.visual_wrapper .contents_wrap .title_wrapper .title{position:relative;width:1120px;height:320px;transition:1s all;} .htmlWrapper section.visual_wrapper .contents_wrap .title_wrapper .title.t01{background-image:url('../images/visual/title01.png');} .htmlWrapper section.visual_wrapper .contents_wrap .title_wrapper .title.t02{background-image:url('../images/visual/title03.png');} .htmlWrapper section.visual_wrapper .contents_wrap .title_wrapper .char01{position:absolute;left:-100px;top:129px;width:272px;height:274px;background-image:url('../images/visual/char01.png');z-index:2;} .htmlWrapper section.visual_wrapper .contents_wrap .title_wrapper .char02{position:absolute;left:372px;top:-166px;width:241px;height:238px;background-image:url('../images/visual/char02.png');z-index:2;animation:20s main_char02 infinite linear forwards;} .htmlWrapper section.visual_wrapper .contents_wrap .title_wrapper .char03{position:absolute;right:-140px;top:-20px;width:321px;height:316px;background-image:url('../images/visual/char03.png');z-index:2;} /* 다음 */ section.daum {position:relative;width:100%;height:334px;background:#FFFFFF;} section.daum .contents_wrap {display:flex;flex-direction:column;width:100%;height:100%;align-items:center;justify-content:center;gap:16px 0;} section.daum .contents_wrap .title{} section.daum .contents_wrap .box{position:relative;width:974px;height:124px;background-image:url('../images/daum/bg.png?v=1');background-repeat:no-repeat;background-position:center;display:flex;align-items:start;} section.daum .contents_wrap .box .typing-text{position:absolute;left:200px;top:22px;line-height:36px;font-family:'Pretendard',sans-serif;font-weight:700;font-size:32px; color:#1e1e1e; border-right:2px solid #333; animation: typing 6s steps(22) infinite; white-space: nowrap; overflow: hidden;} /* 다음 */ /* 동영상 */ section.movie {position:relative;width:100%;height:1183px;background-image:url('../images/movie/bg.jpg');} section.movie .contents_wrap {display:flex;flex-direction:column;width:100%;height:100%;align-items:center;padding:120px 0 0 0;box-sizing:border-box;gap:50px 0;} section.movie .contents_wrap .cover{position:relative;background-image:url('../images/movie/cover.png');width:936px;height:667px;display:flex;justify-content:center;padding:24px 0 0 0;box-sizing:border-box;} section.movie .contents_wrap .cover .movie{position:relative;width:872px;height:491px;border-radius:10px;overflow:hidden;} section.movie .contents_wrap .cover .movie iframe{width:100%;height:100%;} section.movie .contents_wrap .cover .btn_play{position:absolute;left:0;top:206px;left:396px;} section.movie .contents_wrap .cover .btn_subscribe{position:absolute;width:358px;height:48px;left:35px;bottom:35px;} section.movie .contents_wrap .cover .btn_subscribe a{position:relative;display:block;width:100%;height:100%;} section.movie .contents_wrap .cover .btn_subscribe a .hand{right:-45px;bottom:-40px;} /* 이벤트 01 */ section.event01 {position:relative;width:100%;height:1793px;background-image:url('../images/event01/bg.jpg');} section.event01.step02 {position:relative;width:100%;height:1793px;background-image:none;background:#EE1C24;} section.event01.step02.expand {height:2917px;transition:.3s all;} section.event01 .contents_wrapper {display:flex;flex-direction:column;width:100%;height:100%;align-items:center;padding:120px 0 0 0;box-sizing:border-box;} section.event01 .contents_wrapper .evt01_content_wrapper{display:flex;flex-direction:column;width:100%;height:100%;align-items:center;} section.event01 .contents_wrapper .evt02_content_wrapper{display:flex;flex-direction:column;width:100%;height:100%;align-items:center;} section.event01 .contents_wrapper .title{margin-bottom:60px;} section.event01 .contents_wrapper .schedule_wrapper{display:flex;width:1300px;justify-content:space-between;} section.event01 .contents_wrapper .evt01_content{margin:164px 0 0 0;width:100%;height:740px;background-image:url('../images/event01/in.png');background-size:100% 330px;background-postion:center top;background-repeat:no-repeat;} section.event01 .contents_wrapper .evt01_content .cont{position:relative;width:1300px;height:740px;margin:0 auto;} section.event01 .contents_wrapper .evt01_content .cont .char_wrap{position:relative;width:528px;height:628px;margin:0 auto;} section.event01 .contents_wrapper .evt01_content .cont .char_wrap .char01_1{position:absolute;left:0;bottom:120px;width:122px;height:175px;background-image:url('../images/event01/char01_1.png?v=1');} section.event01 .contents_wrapper .evt01_content .cont .char_wrap .char01_1.act{width:140px;height:217px;background-image:url('../images/event01/char01_1_2.png?v=3');animation:4s in_char01 infinite linear forwards;background-position:25px 8px;background-repeat:no-repeat;} section.event01 .contents_wrapper .evt01_content .cont .char_wrap .char01_1.on{width:140px;height:217px;background-image:url('../images/event01/char01_1_1.png?v=3');transform:scale(.3);background-position:center top;} section.event01 .contents_wrapper .evt01_content .cont .char_wrap .char01_2{position:absolute;left:109px;bottom:40px;width:327px;height:462px;background-image:url('../images/event01/char01_2.png?v=1');} section.event01 .contents_wrapper .evt01_content .cont .char_wrap .char01_2.act{background-image:url('../images/event01/char01_2_1.png?v=2');animation:4s in_char02 infinite linear forwards;} section.event01 .contents_wrapper .evt01_content .cont .char_wrap .char01_3{position:absolute;right:-20px;bottom:138px;width:122px;height:209px;background-image:url('../images/event01/char01_3.png?v=1');} section.event01 .contents_wrapper .evt01_content .cont .char_wrap .char01_3.act{width:131px;height:228px;background-image:url('../images/event01/char01_3_2.png?v=3');animation:4s in_char03 infinite linear forwards;background-position:center top;background-repeat:no-repeat;} section.event01 .contents_wrapper .evt01_content .cont .char_wrap .char01_3.on{width:131px;height:228px;background-image:url('../images/event01/char01_3_1.png?v=3');background-size:92%;} section.event01 .contents_wrapper .evt01_content .cont .char{position:absolute;} section.event01 .contents_wrapper .evt01_content .cont .btn_wrap{position:absolute;width:100%;bottom:0;display:flex;justify-content:center;} section.event01 .contents_wrapper .evt01_content .cont .btn_wrap .btn_in{position:relative;width:593px;height:112px;background-image:url('../images/event01/btn_go.png');cursor:pointer;} section.event01 .contents_wrapper .evt01_content .cont .btn_wrap .btn_in .hand{right:0px;bottom:-30px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content{padding:80px 0 0 0;width:1300px;display:flex;flex-direction:column;align-items:center;gap:20px 0;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts{position:relative;width:100%;height:740px;background-image:url('../images/event01/evt_cover.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper{position:absolute;z-index:2;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab{position:absolute;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab .p_stamp{position:absolute;right:-70px;top:-50px;background-image:url('../images/event01/s_complete.png');width:137px;height:137px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t03 .p_stamp{right:0;top:210px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t01{top:68px;left:68px;width:237px;height:64px;background-image:url('../images/event01/tab01.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t02{top:68px;left:572px;width:433px;height:64px;background-image:url('../images/event01/tab02.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t03{top:355px;left:1144px;width:89px;height:318px;background-image:url('../images/event01/tab03.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t04{top:608px;left:68px;width:237px;height:64px;background-image:url('../images/event01/tab04.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t01.on{background-image:url('../images/event01/tab01_on.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t02.on{background-image:url('../images/event01/tab02_on.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t03.on{background-image:url('../images/event01/tab03_on.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t04.on{background-image:url('../images/event01/tab04_on.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.on::before{position:absolute;left:-70px;top:-30px;width:130px;height:130px;content:'';background-image:url('../images/event01/qchar02.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .tab_wrapper .tab.t03.on::before{left:-10px;top:-60px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper{position:relative;width:944px;height:364px;margin:188px 182px;display:flex;flex-direction:column;justify-content:space-between;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .film_wrapper{position:relative;width:100%;height:192px;background-image:url('../images/event01/cover_gallery.png');display:flex;justify-content:center;align-items:center;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .film_wrapper .film_wrap{position:relative;width:880px;height:120px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .film_wrapper .film_wrap .stamp{position:absolute;z-index:50;left:260px;top:-50px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .film_wrapper .film_wrap .swiper-wrapper{transition: transform 0.3s linear;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .film_wrapper .film_wrap .swiper-slide{width:120px !important;height:120px !important;border-radius:4px;overflow:hidden;cursor:pointer;transition: transform 0.3s;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .film_wrapper .film_wrap .swiper-slide img{width:100%;height:100%;object-fit:cover;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .film_wrapper .film_wrap .film-button-prev{position:absolute;left:-16px;top:52px;width:8px;height:16px;background-image:url('../images/event01/btn_prev.png');z-index:5;cursor:pointer;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .film_wrapper .film_wrap .film-button-next{position:absolute;right:-16px;top:52px;width:8px;height:16px;background-image:url('../images/event01/btn_next.png');z-index:5;cursor:pointer;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .film_wrapper .hand{bottom:-10px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .photo_wrapper{position:relative;width:100%;height:164px;display:flex;justify-content:space-between;padding:0 6px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .photo_wrapper .sbox{position:relative;display:flex;flex-direction:column;width:120px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .photo_wrapper .sbox .photo{position:relative;width:100%;height:120px;border:2px solid #000000;border-radius:8px;box-sizing:border-box;overflow:hidden;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .photo_wrapper .sbox .photo img{width:100%;height:100%;object-fit:cover;border:10px solid #FFFFFF;box-sizing:border-box;border-radius:17px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .quest_wrapper .photo_wrapper .sbox .ttl{position:relative;width:100%;height:44px;display:flex;justify-content:center;align-items:center;text-align:center;font-size:18px;color:#111111;font-weight:700;line-height:1;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .btn_wrap{position:absolute;left:0;bottom:38px;width:100%;display:flex;justify-content:center;z-index:1;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .btn_wrap .btn_comment{position:relative;width:355px;height:112px;background-image:url('../images/event01/btn_comment.png');} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .btn_wrap .btn_comment.on{background-image:url('../images/event01/btn_comment_on.png');cursor:pointer;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .btn_wrap .btn_comment .hand{display:none;right:-20px;bottom:-40px;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts .btn_wrap .btn_comment.on .hand{display:block;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment{width:100%;height:1164px;padding:40px 0 0 0;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:42px 0;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .p_step02{} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .comment_wrapper{position:relative;width:1332px;height:778px;background-image:url('../images/event01/evt02_cont.png');display:flex;flex-direction:column;justify-content:end;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .comment_wrapper .conts{position:relative;width:100%;height:370px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px 0;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .comment_wrapper .conts .ttl{} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .comment_wrapper .conts .inbox{width:1220px;height:90px;background:#F6F6F6;border-radius:16px;display:flex;justify-content:center;align-items:center;padding:10px 10px;box-sizing:border-box;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .comment_wrapper .conts .inbox input{width:100%;height:100%;border:0;background:transparent;font-size:32px;font-weight:400;padding:0 18px;box-sizing:border-box;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .comment_wrapper .conts .inbox input:focus{outline:none;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .comment_wrapper .conts .inbox input::placeholder{color:#777777;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .comment_wrapper .conts .btns_wrap{display:flex;justify-content:center;} section.event01 .contents_wrapper .evt02_content_wrapper .evt02_content .p_conts_comment .comment_wrapper .conts .btns_wrap .btn_join{background-image:url('../images/event01/btn_join.png');width:435px;height:112px;cursor:pointer;} section.event01 .evt_pop{position:fixed;top:0;left:0;background-color:rgba(0,0,0,.7);width:100%;height:100%;z-index:90;display:flex;justify-content:center;align-items:center;} section.event01 .evt_pop .pop_contents{position:relative;width:1300px;} section.event01 .evt_pop .pop_contents .contents{position:relative;background:#F6F6F6;height:600px;border-radius:20px;padding:40px;box-sizing:border-box;display:flex;justify-content:space-between;} section.event01 .evt_pop .pop_contents .contents .info_wrapper{position:relative;width:620px;} section.event01 .evt_pop .pop_contents .contents .info_wrapper .photo_gallery{position:relative;width:100%;height:415px;} section.event01 .evt_pop .pop_contents .contents .info_wrapper .photo_gallery .gallery-button-prev{position:absolute;left:20px;top:182px;width:66px;height:66px;z-index:5;background-image:url('../images/event01/pop_btn_prev.png');cursor:pointer;} section.event01 .evt_pop .pop_contents .contents .info_wrapper .photo_gallery .gallery-button-next{position:absolute;right:20px;top:182px;width:66px;height:66px;z-index:5;background-image:url('../images/event01/pop_btn_next.png');cursor:pointer;} section.event01 .evt_pop .pop_contents .contents .info_wrapper .photo_gallery .swiper-slide{border-radius:8px;overflow:hidden;} section.event01 .evt_pop .pop_contents .contents .info_wrapper .photo_gallery .swiper-slide img{border-radius:8px;} section.event01 .evt_pop .pop_contents .contents .info_wrapper .ttl{font-size:22px;color:#222222;font-weight:600;margin-bottom:10px;margin-top:20px;} section.event01 .evt_pop .pop_contents .contents .info_wrapper .exp{font-size:22px;color:#555555;font-weight:400;} section.event01 .evt_pop .pop_contents .contents .detail{position:relative;width:560px;height:520px;background:#FFFFFF;padding:20px 16px;box-sizing:border-box;border-radius:20px;overflow:hidden;} section.event01 .evt_pop .pop_contents .contents .detail .info{position:relative;width:540px;height:480px;overflow:auto;} section.event01 .evt_pop .pop_contents .contents .detail .info img{width:100%;} section.event01 .evt_pop .pop_contents .contents .detail .hand.scroll{right:20px;animation:1s scroll_auto infinite linear forwards;} section.event01 .evt_pop .pop_contents .btns_wrap{position:relative;width:100%;display:flex;justify-content:center;margin:28px 0 0 0;} section.event01 .evt_pop .pop_contents .btns_wrap .btn_complete{position:relative;width:435px;height:112px;background-image:url('../images/event01/btn_complete_off.png');cursor:pointer;} section.event01 .evt_pop .pop_contents .btns_wrap .btn_complete.on{background-image:url('../images/event01/btn_complete.png');} section.event01 .evt_pop .pop_contents .btns_wrap .btn_complete .hand{display:none;right:0px;bottom:-20px;} section.event01 .evt_pop .pop_contents .btns_wrap .btn_complete.on .hand{display:block;} section.event01 .contents_wrapper > .join_wrapper {position:absolute;bottom:120px;display:flex;justify-content:center;align-items:center;font-family:'Pretendard',sans-serif;} section.event01 .contents_wrapper > .join_wrapper .join_wrap{position:relative;width:1132px;height:132px;background-image:url('../images/event01/bg_num.png');display:flex;justify-content:center;align-items:center;color:#555555;gap:0 5px;font-size:28px;} section.event01 .contents_wrapper > .join_wrapper .join_wrap div{line-height:1;} section.event01 .contents_wrapper > .join_wrapper .join_wrap .j_info{color:#EE1C24;font-weight:800;font-size:40px;line-height:0.7;} section.event01 .contents_wrapper > .join_wrapper .join_wrap .ttl{font-weight:800;padding:0 7px 0 12px;font-size:32px;color:#111111;} /* 이벤트 01 */ /* 사전링크 */ section.link {position:relative;width:100%;height:716px;background-image:url('../images/link/bg.jpg');} section.link .contents_wrap {width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:start;padding:381px 0 0 0;box-sizing:border-box;} section.link .contents_wrap .btn_wrap{} section.link .contents_wrap .btn_wrap .btn_in{position:relative;width:312px;height:112px;background-image:url('../images/link/btn_in.png');} section.link .contents_wrap .btn_wrap .btn_in a{display:block;width:100%;height:100%;} section.link .contents_wrap .btn_wrap .btn_in .hand{right:0;bottom:-20px;} /* 사전링크 */ /* 퀴즈 */ section.emoticon {position:relative;width:100%;height:1173px;background-image:url('../images/emoticon/bg.jpg');} section.emoticon .contents_wrap {width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:'LeferiPoint-BlackA';gap:40px 0;} section.emoticon .contents_wrap > div{flex:1;} section.emoticon .contents_wrap > div.character{padding-top:80px;box-sizing:border-box;} section.emoticon .contents_wrap > div.title{} section.emoticon .contents_wrap > div.txt_wrapper{flex:1;} section.emoticon .contents_wrap .txt_wrapper{position:relative;display:flex;gap:0 133px;left:20px;} section.emoticon .contents_wrap .txt_wrapper .txt{margin-top:20px;} /* 퀴즈 */ /* 대한적십자 */ section.company {position:relative;width:100%;height:1121px;background:#FFE3E2} section.company .contents_wrap {width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:start;font-family:'LeferiPoint-BlackA';} section.company .contents_wrap > div{position:relative;} section.company .contents_wrap .title{margin-top:120px;} section.company .contents_wrap .gallery{width:1200px;height:381px;display:flex;justify-content:center;margin:40px 0 0 0;} section.company .contents_wrap .gallery .gallery-button-next{position:absolute;right:-52px;top:170px;background-image:url('../images/company/btn_next.png');width:21px;height:36px;cursor:pointer;} section.company .contents_wrap .gallery .gallery-button-prev{position:absolute;left:-52px;top:170px;background-image:url('../images/company/btn_prev.png');width:21px;height:36px;cursor:pointer;} section.company .contents_wrap .gallery .swiper-slide .btn{position:absolute;right:32px;bottom:35px;cursor:pointer;} section.company .contents_wrap .gallery .swiper-slide { background-position: center; background-size: cover; width: 460px; height: 381px; } section.company .contents_wrap .processping{height:8px;width:1300px;background:#cfb9b9;display:flex;justify-content:start;border-radius:4px;overflow:hidden;margin:60px 0 60px 0;} section.company .contents_wrap .processping .process{height:100;width:0;background:#111116;transition:.5s all;border-radius:4px;} section.company .contents_wrap .btns{margin-top:100px;} section.company .contents_wrap .btns .btn{width:290px;height:102px;background-image:url('../images/company/btn_more.png');cursor:pointer;} section.company .contents_wrap .btns .btn a{display:block;width:100%;height:100%;} section.company .contents_wrap .btns .btn:hover{background-image:url('../images/company/btn_more_on.png');} /* 대한적십자 */ /* SNS SHARE */ section.snsshare {position:relative;width:100%;height:620px;background-image:url('../images/share/bg.jpg');} section.snsshare .contents_wrap {width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:60px 0;font-family:'ONE-Mobile-Title';text-align:center;font-weight:500;} section.snsshare .contents_wrap > .sns_wrapper{position:relative;} section.snsshare .contents_wrap > .sns_wrapper > ul{display:flex;gap:0 32px;} section.snsshare .contents_wrap > .sns_wrapper > ul > li{} /* 참여 정보 */ section.sec-join-info {position:relative;width:100%;height:208px;display:flex;justify-content:center;font-size:32px;align-items:center;color:#222222;background-color:#ffffff;font-family:'Pretendard';} section.sec-join-info div {font-weight:800;display:flex;align-items:center;} section.sec-join-info span.normal{font-weight:300;font-size:32px;margin-right:5px;margin-top:-5px;} section.sec-join-info span._visit_all_cnt{color:#E60012;margin-left:10px;margin-right:10px;margin-top:-10px;font-family:'ONE-Mobile-Title';line-height:0;} section.sec-join-info span._join_all_cnt{color:#E60012;margin-left:10px;margin-right:10px;margin-top:-10px;font-family:'ONE-Mobile-Title';} section.sec-join-info div span{font-size:48px;font-weight:900;font-family:"ONE-Mobile-Title",sans-serif;padding:0 0 0 5px;} /* 참여 정보 */ /* SNS */ .pop_evt2_wrapper {position:fixed;left:0;top:0;width:100%;height:100vh;background-color:rgba(0,0,0,.7);display:flex;justify-content:center;align-items:center;z-index:10;} .pop_evt2_wrapper .pop_content_wrapper{position:relative;width:1238px;height:1000px;margin:0 auto;background:#FFFFFF;border-radius:30px;scale:.8} .pop_evt2_wrapper .pop_content_wrapper .close{position:absolute;background-image:url('../images/btn_evt2_close.png');width:54px;height:54px;right:-80px;cursor:pointer;} .pop_evt2_wrapper .pop_content_wrapper .contents{position:relative;display:flex;width:100%;height:100%;border-radius:30px;overflow:hidden;} .pop_evt2_wrapper .pop_content_wrapper .contents .left_part{position:relative;width:588px;height:100%;background:#FED286;display:flex;align-items:center;justify-content:end;} .pop_evt2_wrapper .pop_content_wrapper .contents .left_part .data{position:relative;width:542px;} .pop_evt2_wrapper .pop_content_wrapper .contents .left_part .data .bg{position:absolute;background-image:url('../images/bg_pop_pic.png');width:300px;height:245px;right:0;top:-40px;} .pop_evt2_wrapper .pop_content_wrapper .contents .left_part .data .bg .pic{position:relative;display:flex;justify-content:center;align-items:center;top:45px;} .pop_evt2_wrapper .pop_content_wrapper .contents .left_part .data .txt{position:relative;font-size:46px;margin-bottom:38px;} .pop_evt2_wrapper .pop_content_wrapper .contents .left_part .data .txt p{position:relative;} .pop_evt2_wrapper .pop_content_wrapper .contents .left_part .data .txt p span{font-weight:700;} .pop_evt2_wrapper .pop_content_wrapper .contents .left_part .data .exp{font-weight:500;font-size:21px;color:#000000;line-height:1.4;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part{position:relative;width:650px;height:100%;display:flex;flex-direction:column;align-items:center;padding:37px 0 0 0;box-sizing:border-box;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data{position:relative;display:flex;justify-content:center;flex-direction:column;width:600px;align-items:center;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .title{font-size:24px;text-align:center;margin-bottom:40px;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .title span{font-weight:700;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .exp_wrap{position:relative;padding:54px 0 43px 0;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .exp_wrap .simple{position:relative;font-size:22px;text-align:center;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .exp_wrap .ttl{position:relative;font-size:28px;font-weight:700;text-align:center;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .pic_list_wrap {position:relative;width:100%;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .pic_list_wrap ul{position:relative;display:flex;justify-content:space-between;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .pic_list_wrap ul li{position:relative;width:190px;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .pic_list_wrap ul li .img{position:relative;width:190px;height:125px;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .pic_list_wrap ul li .img.on:before{position:absolute;0;content:'';background-image:url('../images/stamp.png');top:0;left:0;width:100%;height:100%;background-position:center;background-repeat:no-repeat;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .pic_list_wrap ul li .img img{width:100%;height:100%;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .r_data .pic_list_wrap ul li .ttl{font-size:18px;font-weight:500;letter-spacing:-1px;padding:5px 0 0 5px;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .btns{position:absolute;width:100%;bottom:110px;display:flex;justify-content:center;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .btns .btn_join{position:relative;background-image:url('../images/btn_evt2_join.png');width:419px;height:110px;cursor:pointer;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .btns .btn_join .hand{display:none;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .btns .btn_join.on{background-image:url('../images/btn_evt2_join_on.png');} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .btns .btn_join.on .hand{display:block;} .pop_evt2_wrapper .pop_content_wrapper .contents .right_part .txt{position:absolute;width:100%;bottom:57px;display:flex;justify-content:center;} .pop_evt2_wrapper .pop_content_wrapper .contents .frame_div {position:absolute;width:100%;height:58%;z-index:99;left:0;top:0;border:5px solid #000;box-sizing:border-box;border-radius:30px;background:#FFFFFF;overflow:hidden;} .pop_evt2_wrapper .pop_content_wrapper .contents .frame_div .pclose{position:absolute;right:10px;top:10px;cursor:pointer;z-index:9;} .pop_evt2_wrapper .pop_content_wrapper .contents .frame_div iframe{width:101%;height:100%;} /* 이벤트 02 */ /* 참여 정보 */ section.sec-copyright {position:relative;width:100%;height:162px;display:flex;justify-content:center;align-items:center;background:#f0f0f0;color:#555555;font-size:18px;} section.sec-copyright > .copyright {width:1400px;} section.sec-copyright > .copyright ul{} section.sec-copyright > .copyright ul li{float:left;width:60%;margin-bottom:10px;} section.sec-copyright > .copyright ul li:first-child{color:#262630;font-size:20px;font-weight:500;font-family:'Pretendard',sans-serif;} section.sec-copyright > .copyright ul li:nth-child(2n+2){text-align:right;width:40%;} section.sec-copyright > .copyright ul li:nth-child(4){display:flex;justify-content:end;} section.sec-copyright > .copyright ul li:nth-child(4) > div{text-align:right;margin-left:10px;} section.sec-copyright > .copyright ul li:nth-child(4) span{color:#555555;font-weight:800;font-family:'Pretendard',sans-serif;} /* 고정 메뉴 */ .navigator_wrapper {position:fixed;left:0;bottom:0;width:100%;height:110px;z-index:11; bottom: 0;overflow:hidden;} .navigator_wrapper .cont_wrap {width:100%;background:#B01F24;height:100%;display:flex;justify-content:center;} .navigator_wrapper .cont_wrap .navi_wrap {width:1300px;height:100%;display:flex;justify-content:space-between;align-items:center;padding:0 40px;box-sizing:border-box;} .navigator_wrapper .cont_wrap .navi_wrap > li{position:relative;flex:1;box-sizing:border-box;height:100%;display:flex;justify-content:center;align-items:center;} .navigator_wrapper .cont_wrap .navi_wrap > li > .n_menu{position:relative;width:83px;height:44px;cursor:pointer;z-index:3;background-image:url('../images/allmenu.png');background-repeat:no-repeat;} .navigator_wrapper .cont_wrap .navi_wrap > li:nth-child(1) {width:130px;} .navigator_wrapper .cont_wrap .navi_wrap > li:nth-child(2) {margin-right:8px;} .navigator_wrapper .cont_wrap .navi_wrap > li > div > a{width:100%;height:100%;display:flex;justify-content:center;align-items:center;} .navigator_wrapper .cont_wrap .navi_wrap > li > .n_top{position:relative;background-image:url('../images/top.png');width:80px;height:80px;cursor:pointer;background-repeat:no-repeat;} .n_menu_list {position:fixed;bottom:-800px;z-index:99;background:#e60012;width:500px;box-sizing:border-box;font-size:22px;} .n_menu_list.on {bottom:0;} .n_menu_list > .n_menu.close {float:right;background-image:url('../images/gnb_close.png');width:46px;height:46px;display:inline-block;margin-top:13px;margin-right:20px;cursor:pointer;} .n_menu_list > .m_list {width:100%;display:flex;flex-wrap:wrap;padding:10px 0 0 0;box-sizing:border-box;text-align:center;display:flex;flex-direction:column;} .n_menu_list > .m_list a {color:#FFFFFF;} .n_menu_list > .m_list div {border-bottom:2px solid #D9D9D9;width:433px;margin:0 auto;padding:15px 0;} .n_menu_list > .m_list a:last-child div{border-bottom:0;} .n_menu_list > .m_list div > span {display:flex;cursor:pointer;position:relative;width:433px;height:80px;line-height:1.4;align-items:center;justify-content:start;text-align:left;padding-left:20px;box-sizing:border-box;} .n_menu_list > .m_list div > span a{display:block;font-size:23px;color:#FFFFFF;font-weight:500;letter-spacing:-.5px;text-align:left;} .n_menu_list > .m_list div > span {position:relative;} .n_menu_list > .m_list div > span::after {content:'';width:80px;height:80px;position:absolute;left:10px;top:0;} .n_menu_list > .m_list div.on {background-color:rgba(255,255,255,.1);} /* 고정 메뉴 */ /* 기타 */ .join_info_wrapper {position:absolute;bottom:0;width:100%;text-align:center;} .join_info_wrapper.evt01 {bottom:150px;} .join_info_wrapper.evt01 .join_info{background:#dbf7da;border-radius:50px;color:#333333;display:inline-block;padding:0 30px;font-size:24px;height:92px;line-height:92px;vertical-align:middle;border:2px solid #3fa03b;} .join_info_wrapper.evt02 {bottom:124px;} .join_info_wrapper.evt02.result {bottom:30px;} .join_info_wrapper.evt02 .join_info{background:#bdddf3;border-radius:40px;color:#071b28;display:inline-block;padding:0 30px;font-size:22px;height:63px;line-height:63px;vertical-align:middle;} .join_info_wrapper.evt03 {bottom:150px;} .join_info_wrapper.evt03 .join_info{background:#3bd368;border-radius:40px;color:#071b28;display:inline-block;padding:0 30px;font-size:22px;height:63px;line-height:63px;vertical-align:middle;} .join_info_wrapper .join_info span.num{font-size:40px;color:#125400;font-weight:900;} .join_info_wrapper .join_info span.b{font-size:27px;font-weight:700;} .hand {position:absolute;z-index:5;animation:zoom 1s ease-in-out infinite;animation-delay:0.5s;animation-duration:1s;width:72px;height:79px;background-image:url(../images/hand.png);} .result_wrap {position:absolute;width:100%;text-align:center;bottom:100px;} .result_wrap > .btn.event_result2{width:463px;height:122px;display:inline-block;background-image:url('../images/event2_done.png');} .result_wrap > .btn.event_result2 > a {display:block;width:100%;height:100%;} /* 슬라이드 */ .swiper { width: 100%; height: 100%; } .swiper-slide { text-align: center; font-size: 18px; background: transparent; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; } .swiper-slide img {width:100%;} .cardNewsSwiper.citySwiper swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } .wallSwiper.citySwiper swiper-slide img { display: block; width: 100%; height: 100%; object-fit: cover; } .swiper-button-disabled {opacity:.2;} #cont_wrap {width:1200px;margin:0 auto;position:relative;} a:focus {outline:none;} .cardnew-swiper-button-prev {position:absolute;background-image:url('../images/cardnews/btn_prev.png');width:70px;height:70px;left:-110px;top:315px;cursor:pointer;} .cardnew-swiper-button-next {position:absolute;background-image:url('../images/cardnews/btn_next.png');width:70px;height:70px;right:-110px;top:315px;cursor:pointer;} .bounce1 {animation: bounce1 2s;} .bounce2 {animation: bounce2 1s;} .bounce3 {animation: bounce3 1s;} .kb_hand {position:absolute;background-image:url('../images/hand_ani.png');scale:.8;width:102px;height:96px;animation: vmove 1.5s infinite;animation-direction: reverse;animation-iteration-count: 3;z-index:999;bottom:0px;left:40px;} .b_hand {position:absolute;right:-50px;bottom:-20px;background-image:url('../images/hand_ani.png');width:102px;height:96px;animation: blink 1s infinite;} .b_hand.com {right:0;bottom:5px;zoom:.7;} .qb_hand {position:absolute;right:-50px;bottom:-20px;background-image:url('../images/hand_ani.png');width:102px;height:96px;animation: blink 1s infinite;} .qb_hand.hide {display:none;} .qb_hand.evt3 {display:none;} .hide {display:none !important;} .present_wrap .swiper-slide img {width:100%;} .j_wrap01{} .j_wrap02{margin-top:35px;} .j_wrap01 .swiper-slide{width:487px;height:120px;border-radius:60px;color:#004819;font-size:40px;font-weight:bold;display:flex;justify-content:center;align-items:center;} .j_wrap01 .swiper-slide:nth-child(1n+1){background-image: linear-gradient(#FFFFFF, #FFFFFF);} .j_wrap01 .swiper-slide:nth-child(2n+2){background-image: linear-gradient(#FFFFFF, #FFFFFF);} .j_wrap01 .swiper-slide:nth-child(3n+3){background-image: linear-gradient(#FFFFFF, #FFFFFF);} /* popup */ html.on { height:100%; overflow:hidden; } .pu_bg { position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.7); z-index:98; display:none; } .pu { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); z-index:99; display:none; } .pu .bt_close { position:absolute; top:0; right:-60px; width:48px; height:48px; background:url(../images/bt_pu_close.png?v=1) no-repeat 0 0; text-indent:-9999px; } .pu_event_youtube { width:800px; background:#fff;border-radius:15px;display:none; } .pu_event_youtube .p_con { position:relative; } .pu_event_youtube .p_con iframe {width:800px;height:450px;} .pu_event_info { width:675px; display:none; border-radius:20px;overflow:hidden;} .pu_event_info .form_top a{display:block;width:100%;height:100%;} .pu_event_info .p_con {position:relative;padding:30px;background: #fff;overflow: hidden;} .pu_event_info .p_con dt { position:relative; font-size:18px; color:#222;font-weight:700; } .pu_event_info .p_con .ty00 { position:relative; height:30px; padding-top:5px;padding-left:0;text-align:center; font-weight:600;} .pu_event_info .p_con .ty00 dd {display:inline-block;} .pu_event_info .p_con .ty00 dd + dd {padding-left:30px;} .pu_event_info .p_con .ty01 { position:relative; height:44px; padding-left:130px; margin-bottom:20px;} .pu_event_info .p_con .ty01 dt { position:absolute; top:0; left:0; width:120px; line-height:44px; text-align:left; } .pu_event_info .p_con .ty01 dd { position:relative; } .pu_event_info .p_con .ty01 dd input { height:44px; line-height:44px; background:#fff; border:1px solid #cdcdcd; padding:0 10px; box-sizing:border-box;} .pu_event_info .p_con .ty01 dd.num:after { content:''; clear:both; display:block; height:0; visibility:hidden; } .pu_event_info .p_con .ty01 dd.num input { text-align:center; float:left; width:134px; } .pu_event_info .p_con .ty01 dd.num i { float:left; width:20px; text-align:center; color:#fff; line-height:44px; } .pu_event_info .p_con .ty02 { margin-top:30px;} .pu_event_info .p_con .ty02 dt { margin-bottom:10px; margin-top:20px;} .pu_event_info .p_con .ty02 dt span { position:absolute; right:-5px; } .pu_event_info .p_con .ty02 dt span input { margin:0; } .pu_event_info .p_con .ty02 dd { background:#fff4e4; padding:15px 20px; } .pu_event_info .btns:before { position:absolute; content:''; top:0; left:50%; bottom:0; width:1px; ; z-index:1; } .pu_event_info .btns:after { content:''; clear:both; display:block; height:0; visibility:hidden; } .pu_event_info .btns a {position:relative;float:left; width:50%; display:flex; justify-content:center;align-items:center;height:100px; line-height:1.2; text-align:center; font-size:30px; color:#fff; font-weight:800; } .pu_event_info .btns a .hand{right:70px;bottom:-6px;} .pu_event_info .btns a:hover { text-decoration:none; } .pu_event_info .btns a.bt_participate_done {background:#E60012;color:#FFFFFF;} .pu_event_info .btns a.bt_participate_done.i01 {background:#07788F;} .pu_event_info .btns a.bt_participate_done.i02 {background:#B7612B;} .pu_event_info .btns a.bt_participate_done.i03 {background:#316F52;} .pu_event_info .btns a.bt_participate_done.i04 {background:#B02923;} .pu_event_info .btns a.bt_cancel {background:#333;} .pu_event_info table { width:100%; color:#333; line-height:18px; } .pu_event_info table th { font-size:16px; padding:10px; vertical-align:top; } .pu_event_info table td { font-size:16px; padding:10px; color:#333;letter-spacing:-1px;line-height:1.5;} .pu_event_info .checks input[type="checkbox"] { position:absolute; top:0; left:0; opacity:0; -webkit-opacity:0; } .pu_event_info .checks input[type="checkbox"] + label:after { content:' '; display:inline-block; width:32px; height:32px; line-height:32px; margin:-10px 0 0 10px; text-align:center; vertical-align:middle; background:url(../images/cb.png?v=1) no-repeat 0 0; } .pu_event_info .checks input[type="checkbox"]:checked + label:after { background:url(../images/cb_on.png?v=3) no-repeat 0 0; } .pu_event_info .radiob input[type="radio"] { position:absolute; top:0; left:0; opacity:0; -webkit-opacity:0; } .pu_event_info .radiob input[type="radio"] + label:after { content:' '; display:inline-block; width:33px; height:35px; line-height:35px; margin:-10px 0 0 10px; text-align:center; vertical-align:middle; background:url(../images/radio.png) no-repeat 0 4px; } .pu_event_info .radiob input[type="radio"]:checked + label:after { background:url(../images/radio-on.png) no-repeat 0 4px; } .pu_event_done { width:640px; display:none;} .pu_event_done .ph{ width:100%;} .pu_event_done .ph .close{position:absolute;background-image:url('../images/e_pop_close.png');width:70px;height:70px;right:-70px;top:0;} .pu_event_done .ph .close a{display:block;width:100%;height:100%;} .pu_event_done .ph .btn_wrap{ position:absolute;width:70px;height:70px;right:-70px;top:0;display:flex;justify-content:center;background-image:url('../images/evt_close.png');} .pu_event_done .ph .btn_wrap .btn{ position:relative;width:250px;height:100%;} .pu_event_done .ph .btn_wrap .btn .hand{ right:0px;bottom:-40px;} .pu_event_done .ph .btn_wrap .btn a { display:block; width:100%;height:100%;} .pu_event_done .ph .hand{right:200px;bottom:-30px;} .pu_event_done.e01 {background:#000000;} .pu_event_done.e02 {background:#000000;} .pu_event_done.e03 {background:#000000;} .tc {text-align:center;}