@charset "utf-8";

html,body { width:100%; max-width:2560px; min-width:1360px; margin:0 auto; font-family:"Noto Sans KR",sans-serif; letter-spacing:-1px; background-color:#000000; }
#wrapper { position:relative; overflow:hidden; box-sizing:border-box; width:100%; max-width:2560px; min-width:1360px; margin:0 auto; font-family:"Noto Sans KR",sans-serif; letter-spacing:0; line-height:0; }
#wrapper a { display:inline-block; font-family:"Noto Sans KR",sans-serif; letter-spacing:0; }
#wrapper button { overflow:visible; font-family:"Noto Sans KR",sans-serif; }
#wrapper button:focus { outline:0 ;}
#wrapper p,
#wrapper strong,
#wrapper span { font-family:"Noto Sans KR",sans-serif; letter-spacing:0; }

#loader { z-index:1024; position:fixed; left:0; top:0; width:100%; height:100%; background-color:#000000; }

img { image-rendering:-webkit-optimize-contrast; }

#middle { position:relative; overflow:hidden; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/bg_middle.jpg") center top no-repeat #000000; }
#middle .section { position:relative; }
#middle .section .inner { position:relative; box-sizing:border-box; width:1380px; margin:0 auto; }
#middle .header.section .inner { height:794px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/bg_middle.jpg") -590px 0 no-repeat; }
#middle .content.section .inner { height:1566px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/bg_middle.jpg") -590px -794px no-repeat; }

#middle .section .inner > .btn_link { z-index:4; position:absolute; left:392px; top:650px; width:206px; height:44px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat; }
#middle .section .inner > .btn_notice { z-index:4; position:absolute; left:598px; top:650px; width:110px; height:44px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat; }
#middle .section .inner > .btn_tip { z-index:4; position:absolute; left:708px; top:650px; width:136px; height:44px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat; }
#middle .section .inner > .btn_reward { z-index:4; position:absolute; left:844px; top:650px; width:124px; height:44px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat; }

#middle .section .inner .user { z-index:4; position:absolute; left:0; top:110px; box-sizing:border-box; width:452px; height:984px; padding:40px; box-shadow:0 8px 16px rgba(0,0,0,0.4); background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/bg_user.png") left top no-repeat; }
#middle .section .inner .user .wrapper { overflow:hidden; height:904px; }
#middle .section .inner .user .login { z-index:4; position:relative; box-sizing:border-box; height:350px; padding:40px 0; box-shadow:0 4px 4px rgba(0,0,0,0.2); background-color:#7e29e7; }
#middle .section .inner .user .login .message { padding:24px 16px; font-size:16px; line-height:20px; color:#d3beea; letter-spacing:0; text-align:center; }
#middle .section .inner .user .login .message.none { padding:62px 16px 64px 16px; font-size:24px; line-height:28px; }
#middle .section .inner .user .login .message span { font-size:12px; line-height:20px; color:#d3beea; letter-spacing:0; text-align:center; vertical-align:top; }
#middle .section .inner .user .login .btn_login { display:block; width:304px; height:94px; margin:0 auto; filter:drop-shadow(0 4px 8px rgba(0,0,0,0.4)); background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/btn_login.png") left top no-repeat; }
#middle .section .inner .user .login .btn_check { display:block; width:304px; height:94px; margin:0 auto; filter:drop-shadow(0 4px 8px rgba(0,0,0,0.4)); background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/btn_check.png") left top no-repeat; }
#middle .section .inner .user .login .button { padding:0 42px 0 40px; }
#middle .section .inner .user .login .button .btn_list { display:block; width:290px; height:40px; margin-bottom:8px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/btn_list.png") left top no-repeat; }
#middle .section .inner .user .login .button .btn_list.disable{opacity: 0.5;cursor: default;pointer-events: none;}
#middle .section .inner .user .login .button .btn_link { display:block; width:290px; height:40px;background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/btn_link.png") left top no-repeat; }
#middle .section .inner .user .login .button .btn_link.disable{opacity: 0.5;cursor: default;pointer-events: none;}
#middle .section .inner .user .check { margin:2px 0; background-color:#5911b1; }
#middle .section .inner .user .check li { margin:0 40px; padding:28px 0; font-size:0; line-height:0; border-bottom:1px solid #7423d7; }
#middle .section .inner .user .check li:last-child { border-bottom:none; }
#middle .section .inner .user .check li p:nth-child(1) { display:inline-block; width:182px; font-size:20px; line-height:24px; color:#d5bef3; letter-spacing:-1px; vertical-align:top; }
#middle .section .inner .user .check li p:nth-child(2) { display:inline-block; width:110px;font-size:24px; line-height:24px; color:#c8afe7; letter-spacing:0; text-align:right; vertical-align:top; }
#middle .section .inner .user .check li p:nth-child(2) strong { font-weight:bold; font-size:24px; line-height:24px; color:#ffff00; letter-spacing:0; vertical-align:top; }
#middle .section .inner .user .use { padding:40px;background-color: #370574; }
#middle .section .inner .user .use .btn_use { display:block; width:292px; height:66px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/btn_use.png") left top no-repeat; }
#middle .section .inner > .list { z-index:4; position:absolute; right:0; top:110px; width:872px; }
#middle .section .inner > .list li { float:left; box-sizing:border-box; width:284px; height:426px; margin:0 10px 10px 0; padding-top:60px; box-shadow:0 4px 8px rgba(0,0,0,0.4); background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/bg_list.png") left top no-repeat; }
#middle .section .inner > .list li:nth-child(3n) { margin-right:0; }
#middle .section .inner > .list li:nth-child(1) { background-position:0 0; }
#middle .section .inner > .list li:nth-child(2) { background-position:-284px 0; }
#middle .section .inner > .list li:nth-child(3) { background-position:-568px 0; }
#middle .section .inner > .list li:nth-child(4) { background-position:0 -426px; }
#middle .section .inner > .list li:nth-child(5) { background-position:-284px -426px; }
#middle .section .inner > .list li:nth-child(6) { background-position:-568px -426px; }
#middle .section .inner > .list li:nth-child(7) { margin-bottom:0; background-position:0 -852px; }
#middle .section .inner > .list li:nth-child(8) { margin-bottom:0; background-position:-284px -852px; }
#middle .section .inner > .list li:nth-child(9) { margin-bottom:0; background-position:-568px -852px; }
#middle .section .inner > .list li .item { position:relative; padding:32px 16px 36px 16px; }
#middle .section .inner > .list li .item .image { position:relative; width:128px; height:128px; margin:0 auto; background-color:#f0f0f0; }
#middle .section .inner > .list li .item .image img { width:128px; height:128px; }
#middle .section .inner > .list li .item .text { height:36px; padding:32px 0; font-size:14px; line-height:18px; color:#525252; letter-spacing:0; text-align:center; }
#middle .section .inner > .list li .button .btn_exchange { display:block; width:100%; height:70px; cursor:default; background-color:#b083e8; }
#middle .section .inner > .list li .button .btn_exchange p { font-weight:bold; font-size:18px; line-height:70px; color:#5f457f; letter-spacing:0; text-align:center; }
#middle .section .inner > .list li .button .btn_exchange p strong { font-weight:bold; font-size:18px; line-height:70px; color:#5f457f; letter-spacing:0; vertical-align:top; }
#middle .section .inner > .list li .button .btn_exchange.active { cursor:pointer; background-color:#e6753d; }
#middle .section .inner > .list li .button .btn_exchange.active p { color:#ffffff; }
#middle .section .inner > .list li .button .btn_exchange.active p strong { color:#ffff00; }
#middle .section .inner > .list li .button .btn_exchange.active p{position: relative;}
#middle .section .inner > .list li .button .btn_exchange.active p span{width: 12px;height: 12px;background: url(https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/arr.png) 0 0 no-repeat;vertical-align: top;margin-top: 29px;margin-left: 6px;;}
#middle .section .inner > .list li .button .btn_exchange.none p { color:#00043c; }


.tooltip { z-index:8; position:absolute; left:130px; bottom:36px; width:22px; height:22px; cursor:pointer; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/ico_tooltip.png") left top repeat; }
.tooltip .wrapper { z-index:32; position:absolute; left:50%; top:100%; display:none; box-sizing:border-box; width:400px; margin:4px 0 0 -200px; padding:32px 16px; border:1px solid #b2b2b2; box-shadow:4px 4px 8px rgba(0,0,0,0.4); background-color:#ffffff; }
.tooltip:hover .wrapper { display:block; }
.tooltip .wrapper > p { font-size:14px; line-height:18px; color:#000000; text-align-last:center; letter-spacing:0; }
.tooltip .wrapper > p strong { display:block; padding-bottom:16px; font-weight:bold; font-size:16px; line-height:16px; color:#000000; text-align-last:center; letter-spacing:0; }


#footer { position:relative; width:100%; min-width:1040px; text-align:center; background-color:#000000; }
#footer .inner { width:100%; padding:64px 0; }
#footer .inner .logo { margin-bottom:64px; line-height:0; }
#footer .inner .information { position:relative; overflow:hidden; width:1142px; margin:0 auto; }
#footer .inner .information .company { position:relative; float:left; width:254px; height:62px; }
#footer .inner .information .company .bt-nexon { position:absolute; left:0; top:12px; }
#footer .inner .information .company .bt-ea { position:absolute; left:162px; top:12px; }
#footer .inner .information .copyright { float:left; width:888px; height:62px; }

.event_layer_popup { overflow-y:auto; z-index:1080; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background-color:rgba(0,0,0,0.8); }
.event_layer_popup .content { z-index:128; position:absolute; left:50%; top:50%; width:320px; box-shadow:0 0 32px rgba(0,0,0,0.8); transform:translateX(-50%) translateY(-50%); -webkit-transform:translateX(-50%) translateY(-50%); -ms-transform:translateX(-50%) translateY(-50%); background-color:#ffffff ; }
.loading.event_layer_popup { z-index:14320 !important; }
.loading.event_layer_popup .content { z-index:256 !important; width:272px; box-shadow:none; border-radius:0; border:none; background:transparent; }
.loading.event_layer_popup .content ul { width:128px; margin:0 auto 32px auto; }
.loading.event_layer_popup .content ul li { float:left; width:24px; height:24px; margin:0 4px; box-shadow:0 0 32px rgba(0,0,0,1); background-color:#ffffff; }
.loading.event_layer_popup .content p { text-align:center; color:#ffffff; text-shadow:0 0 32px rgba(0,0,0,1); }
.loading.event_layer_popup .content p:nth-child(2) { margin-bottom:16px; font-size:48px; line-height:48px; font-weight:bold; }
.loading.event_layer_popup .content p:nth-child(3) { font-size:32px; line-height:32px; }

.howto.event_layer_popup .content { z-index:128; position:absolute; left:50%; top:50%; box-sizing:border-box; width:1200px; box-shadow:0 0 32px rgba(0,0,0,0.8); background-color:#ffffff; }
.howto.event_layer_popup .content .btn_today {position: absolute;top: 13px;right: 82px;width: 151px;height: 37px;background:url(https://ssl.nexon.com/s2/game/fo4/event/2022/220623_summer33_sd8y734hy/check.png) 0 0 no-repeat;z-index: 2;opacity: 0.7;}
.howto.event_layer_popup .content .btn_today.active{background: url(https://ssl.nexon.com/s2/game/fo4/event/2022/220623_summer33_sd8y734hy/check.png) 0 -37px no-repeat;}
.howto.event_layer_popup .content .btn_close { z-index:16; position:absolute; left:auto;right:0;top:0; width:64px; height:64px; background:none;}

.howto.event_layer_popup .content .howto { position:relative; width:1200px; height:593px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220804_point_sa897duy/popup.png") left top no-repeat; }
.howto.event_layer_popup .content .howto .btn_mission { z-index:4; position:absolute; left:160px; top:560px; width:280px; height:58px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat; }
.howto.event_layer_popup .content .howto .playt1{position: absolute;top:251px;left:640px;width: 500px;text-align: center;line-height: 1.5;;font-size: 20px;color: #000;font-weight: 600;}
.howto.event_layer_popup .content .howto .playt1 span{display: inline;line-height: 1.5;;font-size: 20px;color: #000;font-weight: 600;}
.howto.event_layer_popup .content .howto .playt1 .t1{color: #008ae2;;}
.howto.event_layer_popup .content .howto .playt2{position: absolute;top:431px;left:640px;width: 500px;text-align: center;line-height: 1.5;;font-size: 20px;color: #000;font-weight: 600;}
.howto.event_layer_popup .content .howto .playt2 span{display: inline;line-height: 1.5;;font-size: 20px;color: #000;font-weight: 600;}
.howto.event_layer_popup .content .howto .playt2 .t1{color: #008ae2;;}
.howto.event_layer_popup .content .howto .playt2 .t2{color: #e20000;;}
.howto.event_layer_popup .content .howto .p_fieldset{position: absolute;top:347px;left:640px;width: 500px;padding-left: 278px;box-sizing: border-box;}
.howto.event_layer_popup .content .howto .p_fieldset > input{position: absolute;top: 11px;left: 98px;z-index: 1;width: 61px;height: 32px;line-height: 32px;text-align: center;}
.howto.event_layer_popup .content .howto .p_fieldset .selector div{line-height: 59px;float: left;margin-right: 10px;;}
.howto.event_layer_popup .content .howto .p_fieldset .selector div input[type=checkbox]{display: none;}
.howto.event_layer_popup .content .howto .p_fieldset .selector div input[type=checkbox]:checked + label span{background: url(https://ssl.nexon.com/s2/game/fo4/event/2022/220623_summer33_sd8y734hy/tipradio.png) -71px 0 no-repeat;}
.howto.event_layer_popup .content .howto .p_fieldset .selector div label{padding-left: 25px;position: relative;line-height: 59px;vertical-align: top;cursor: pointer;}
.howto.event_layer_popup .content .howto .p_fieldset .selector div label span{position: absolute;top:2px;left:0;width: 15px;height: 15px;background: url(https://ssl.nexon.com/s2/game/fo4/event/2022/220623_summer33_sd8y734hy/tipradio.png) 0 0 no-repeat;;}