@charset "utf-8";

html,body { width:100%; max-width:2560px; min-width:1330px; margin:0 auto; font-family:"Noto Sans KR",sans-serif; background-color:#000000; }
h1,h2,h3,h4,h5,h6,th,td,input,select,textarea,button,b,strong,span { font-family:"Noto Sans KR",sans-serif; }
button:focus,input:focus,textarea:focus { outline:0; }

#wrapper { position:relative; overflow:hidden; width:100%; max-width:2560px; min-width:1330px; margin:0 auto; font-size:0; line-height:0; }
#wrapper a { font-family:"Noto Sans KR",sans-serif; cursor:pointer; }
#wrapper button { font-family:"Noto Sans KR",sans-serif; outline:none; cursor:pointer; }
#wrapper button:focus { outline:none; }

#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; padding-bottom:98px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220908_autumn_attendancebook/bg_middle_1102.jpg") center top no-repeat; }
#middle .section { position:relative; }
#middle .section .inner { position:relative; box-sizing:border-box; width:1330px; margin:0 auto; }
#middle .header.section .inner { height:770px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220908_autumn_attendancebook/bg_middle_1102.jpg") -615px 0 no-repeat; }
#middle .header.section .inner .btn_notice { z-index:4; position:absolute; left:516px; top:478px; width:144px; height:44px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat; }
#middle .header.section .inner .btn_reward { z-index:4; position:absolute; left:670px; top:478px; width:144px; height:44px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat; }
#middle .header.section .inner .user { z-index:4; position:absolute; left:0; bottom:0; box-sizing:border-box; width:1330px; height:150px; }
#middle .header.section .inner .user .login { z-index:8; position:absolute; left:0; top:26px; box-sizing:border-box; width:1330px; height:98px; }
#middle .header.section .inner .user .login .btn_login { width:100%; height:98px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat; }
#middle .header.section .inner .user .login .btn_login p { font-weight:bold; font-size:26px; line-height:98px; color:#ffffff; letter-spacing:0; text-align:center; }
#middle .header.section .inner .user .login .btn_login p strong { font-weight:bold; font-size:26px; line-height:98px; color:#ffff00; letter-spacing:0; vertical-align:top; }
#middle .header.section .inner .user .login .none { padding:24px 0; font-weight:bold; font-size:26px; line-height:26px; color:#ffffff; letter-spacing:0; text-align:center; }
#middle .header.section .inner .user .login .none strong { font-weight:bold; font-size:26px; line-height:26px; color:#ffff00; letter-spacing:0; vertical-align:top; }
#middle .header.section .inner .user .login .none span { display:block; padding-top:8px; font-size:16px; line-height:16px; color:#c08662; letter-spacing:0; }
#middle .header.section .inner .user .login .btn_check { z-index:8; position:absolute; left:0; top:0; width:330px; height:98px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220908_autumn_attendancebook/btn_check.png") left top no-repeat; }
#middle .header.section .inner .user .login .message { z-index:8; position:absolute; right:0; top:0; box-sizing:border-box; width:1000px; height:98px; padding-right:330px; font-weight:bold; font-size:26px; line-height:98px; color:#ffffff; letter-spacing:0; text-align:center; }
#middle .header.section .inner .user .login .end { font-weight:bold; font-size:26px; line-height:98px; color:#ffffff; letter-spacing:0; text-align:center; }
#middle .header.section .inner .user .login .check { z-index:8; position:absolute; right:160px; top:0; box-sizing:border-box; width:840px; height:98px; }
#middle .header.section .inner .user .login .check li { float:left; width:420px; height:98px; }
#middle .header.section .inner .user .login .check li dl { font-size:0; line-height:0; }
#middle .header.section .inner .user .login .check li dl dt { float:left; width:130px; height:98px; font-weight:bold; font-size:14px; line-height:98px; color:#ffffff; text-align: center; }
#middle .header.section .inner .user .login .check li dl dd { float:left; width:154px; height:98px; }
#middle .header.section .inner .user .login .check li dl dd:last-child { width:136px; }
#middle .header.section .inner .user .login .check li:nth-child(1) dl dd p:nth-child(1) { display:inline-block; width:40px; vertical-align:top; font-weight:bold; font-size:14px; line-height:98px; color:#a85e32; text-align:left; }
#middle .header.section .inner .user .login .check li:nth-child(1) dl dd p:nth-child(2) { display:inline-block; width:96px; vertical-align:top; font-weight:bold; font-size:22px; line-height:98px; color:#ffff00; text-align:left; }
#middle .header.section .inner .user .login .check li:nth-child(2) dl dd:nth-child(2) p:nth-child(1) { display:inline-block; width:46px; margin:26px 0; vertical-align:top; font-size:14px; line-height:46px; color:#ffffff; text-align:center; border-radius:100%; background-color:#0a6096; }
#middle .header.section .inner .user .login .check li:nth-child(2) dl dd:nth-child(3) p:nth-child(1) { display:inline-block; width:46px; margin:26px 0; vertical-align:top; font-size:14px; line-height:46px; color:#ffffff; text-align:center; border-radius:100%; background-color:#009e7e; }
#middle .header.section .inner .user .login .check li:nth-child(2) dl dd p:nth-child(2) { display:inline-block; width:82px; margin-left:8px; vertical-align:top; font-weight:bold; font-size:22px; line-height:98px; color:#ffffff; text-align:left; }
#middle .header.section .inner .user .login .check li:nth-child(2) dl dd p:nth-child(2).success { color:#00fff6; }
#middle .header.section .inner .user .login .check li:nth-child(2) dl dd p:nth-child(2).fail { color:#fa0000; }
#middle .header.section .inner .user .login .btn_history { z-index:4; position:absolute; right:20px; top:28px; width:120px; height:42px; border-radius:32px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat #ce6c30; }
#middle .header.section .inner .user .login .btn_history p { font-weight:bold; font-size:14px; line-height:42px; color:#000000; letter-spacing:0; text-align:center; }
#middle .tab.section .inner { height:136px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220908_autumn_attendancebook/bg_middle_1102.jpg") -615px -770px no-repeat; }
#middle .tab.section .inner ul { z-index:4; position:absolute; left:50px; top:66px; width:1230px; height:66px; }
#middle .tab.section .inner ul li { position:relative; float:left; width:136px; height:66px; }
#middle .tab.section .inner ul li:last-child { width:142px; }
#middle .tab.section .inner ul li:first-child::before { display:none; }
#middle .tab.section .inner ul li::before { content:""; z-index:8; position:absolute; left:0; top:18px; display:block; width:2px; height:38px; background-color:#4e2c1c; }
#middle .tab.section .inner ul li button { position:relative; width:100%; height:66px; padding-top:8px; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat transparent; }
#middle .tab.section .inner ul li button p { font-weight:bold; font-size:18px; line-height:58px; color:#8a624e; letter-spacing:0; text-align:center; }
#middle .tab.section .inner ul li.active { padding-top:0; }
#middle .tab.section .inner ul li.active button { z-index:16; width:138px; border-radius:8px 8px 0 0; background:linear-gradient(to bottom,#c2581e,#ba460a); }
#middle .tab.section .inner ul li.active:last-child button { width:142px; }
#middle .tab.section .inner ul li.active button p { color:#ffffff; padding-right:2px; }
#middle .tab.section .inner ul li.active:last-child button p { padding-right:0; }
#middle .tab.section .inner ul li.current::after { content:"진행 중"; z-index:32; position:absolute; left:50%; top:-16px; width:90px; height:32px; margin-left:-46px; font-weight:bold; font-size:16px; line-height:32px; color:#321400; letter-spacing:0; text-align:center; border-radius:32px; background-color:#ffff00; }
#middle .tab.section .inner ul li.alarm button p::after { content:""; z-index:32; position:absolute; left:8px; top:16px; box-sizing:border-box; display:block; width:14px; height:14px; border-radius:100%; background-color:#00fff6; }
#middle .event.section .inner { height:1326px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220908_autumn_attendancebook/bg_middle_1102.jpg") -615px -906px no-repeat; }
#middle .event.section .inner .btn_notice { z-index:4; position:absolute; right:-160px; top:-32px; width:232px; height:160px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220908_autumn_attendancebook/btn_notice.png") left top repeat; }
#middle .section .inner .daily { z-index:4; position:absolute; left:50px; top:136px; width:1230px; height:484px; }
#middle .section .inner .daily li { position:relative; float:left; box-sizing:border-box; width:172px; margin-right:4px; }
#middle .section .inner .daily li:last-child { margin-right:0; }
#middle .section .inner .daily li .wrapper { font-size:0; line-height:0; border-radius:8px; box-shadow:0 16px rgba(44,16,0,0.4); background-color:#ffffff; }
#middle .section .inner .daily li.weekend .wrapper { background-color:#ffeed4; }
#middle .section .inner .daily li .date { position:relative; height:64px; font-weight:bold; font-size:16px; line-height:64px; color:#ffffff; letter-spacing:0; text-align:center; border-radius:8px 8px 0 0; background-color:#660000; }
#middle .section .inner .daily li.weekend .date { background-color:#fa7c00; }
#middle .section .inner .daily li .date::after { content:""; z-index:4; position:absolute; left:78px; bottom:-12px; display:block; width:0; height:0; border-style:solid; border-width:0 8px 12px; border-color:transparent transparent #660000; transform:rotate(-180deg); -webkit-transform:rotate(-180deg); }
#middle .section .inner .daily li.weekend .date::after { border-color:transparent transparent #fa7c00; }
#middle .section .inner .daily li .item:nth-child(2) { padding-top:28px; }
#middle .section .inner .daily li .item:nth-child(3) { padding-top:16px; }
#middle .section .inner .daily li .item .image { width:88px; height:88px; margin:0 auto; background-color:#f0f0f0; }
#middle .section .inner .daily li.weekend .item .image { background-color:#f0e0c8; }
#middle .section .inner .daily li .item .image img { width:88px; height:88px; }
#middle .section .inner .daily li .item .text { height:48px; padding:8px 8px 0 8px; font-size:12px; line-height:16px; color:#4a1a00; letter-spacing:0; text-align:center; }
#middle .section .inner .daily li .item .image { border:4px solid transparent; }
#middle .section .inner .daily li .item.active .image { border:4px solid #fa7c00; }
#middle .section .inner .daily li .button { padding:22px 0 16px 0; font-size:0; line-height:0; text-align:center; }
#middle .section .inner .daily li .btn_reward { box-sizing:border-box; width:132px; height:50px; cursor:default; border-radius:8px; background:linear-gradient(to bottom,#a8a8a8 10%,#7a7a7a 40%); }
#middle .section .inner .daily li .btn_reward p { font-weight:bold; font-size:18px; line-height:50px; color:#cccccc; letter-spacing:0; text-align:center; }
#middle .section .inner .daily li .btn_reward.active { cursor:pointer; background:linear-gradient(to bottom,#ff9200 10%,#ff2a00 40%); }
#middle .section .inner .daily li .btn_reward.active p { color:#ffffff; }
#middle .section .inner .daily li .btn_reward.complete,
#middle .section .inner .daily li .btn_reward.none { background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat #bcbcbc; }
#middle .section .inner .daily li .btn_reward.complete p,
#middle .section .inner .daily li .btn_reward.none p { color:#989898; }
#middle .section .inner .daily li.today::before { content:""; z-index:4; position:absolute; left:38px; top:-14px; display:block; width:96px; height:28px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2022/220908_autumn_attendancebook/img_today.png") left top no-repeat; }
#middle .section .inner .daily li.attend::after { content:"출석"; z-index:4; position:absolute; left:8px; top:16px; display:block; box-sizing:border-box; width:34px; height:34px; font-weight:bold; font-size:14px; line-height:34px; color:#000000; letter-spacing:0; text-align:center; border-radius:100%; background-color:#ffff00; }
#middle .section .inner .daily li.today .wrapper .date { box-shadow:inset 4px 0 0 #fa0446, inset -4px 0 0 #fa0446, inset 0 4px 0 #fa0446; }
#middle .section .inner .daily li.today .wrapper { box-shadow:inset 4px 0 0 #fa0446, inset -4px 0 0 #fa0446, inset 0 -4px 0 #fa0446; }
#middle .section .inner p.week { z-index:4; position:absolute; left:480px; bottom:608px; width:110px; height:24px; font-weight:bold; font-size:24px; line-height:24px; color:#ffffff; letter-spacing:0; text-align:center; }
#middle .section .inner div.week { z-index:4; position:absolute; bottom:74px; width:604px; height:484px; }
#middle .section .inner div.week._01 { left:50px; }
#middle .section .inner div.week._02 { right:50px; }
#middle .section .inner div.week .item { padding-top:180px; font-size:0; line-height:0; text-align:center; }
#middle .section .inner div.week .item .wrapper { display:inline-block; width:192px; vertical-align:top; border:4px solid transparent; }
#middle .section .inner div.week .item .wrapper .image { width:128px; margin:0 32px; background-color:#f0f0f0; }
#middle .section .inner div.week .item .wrapper.active .image { border:4px solid #fa7c00; }
#middle .section .inner div.week .item .wrapper .image img { width:128px; height:128px; }
#middle .section .inner div.week .item .wrapper .text { height:48px; padding:8px 8px 0 8px; font-size:12px; line-height:16px; color:#4a1a00; letter-spacing:0; text-align:center; }
#middle .section .inner div.week .button { padding-top:32px; font-size:0; line-height:0; text-align:center; }
#middle .section .inner div.week .btn_reward { box-sizing:border-box; width:256px; height:50px; cursor:default; border-radius:8px; background:linear-gradient(to bottom,#a8a8a8 10%,#7a7a7a 40%); }
#middle .section .inner div.week .btn_reward p { font-weight:bold; font-size:18px; line-height:50px; color:#cccccc; letter-spacing:0; text-align:center; }
#middle .section .inner div.week .btn_reward.active { cursor:pointer; background:linear-gradient(to bottom,#ff9200 10%,#ff2a00 40%); }
#middle .section .inner div.week .btn_reward.active p { color:#ffffff; }
#middle .section .inner div.week .btn_reward.complete,
#middle .section .inner div.week .btn_reward.none { background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat #bcbcbc; }
#middle .section .inner div.week .btn_reward.complete p,
#middle .section .inner div.week .btn_reward.none p { color:#989898; }

#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 ; }
.notice.event_layer_popup .content { width:640px; }
.event_layer_popup .content .title { z-index:10; position:relative; height:64px; font-weight:500; font-size:20px; line-height:64px; color:#000000; text-align:center; box-shadow:inset 0 -1px 0 rgba(220,220,220,1); background-color:#ffffff; }
.event_layer_popup .content .btn_close { z-index:16; position:absolute; right:0; top:0; width:64px; height:64px; box-shadow:inset 1px 0 0 rgba(220,220,220,1); background:url("https://ssl.nexon.com/s2/game/fo4/event/2020/200402_layer_common_/btn_close.png") left top no-repeat; }
.event_layer_popup .content .message { padding:32px 0; font-size:18px; line-height:26px; color:#000000; letter-spacing:0; text-align:center; }
.event_layer_popup .content .message strong { font-size:18px; line-height:26px; color:#08de68; letter-spacing:0; vertical-align:top; }
.event_layer_popup .content .advice { padding:32px; font-size:14px; line-height:22px; color:#949494; letter-spacing:0; text-align:center; background-color:#eaeaea; }
.event_layer_popup .content .button { font-size:0; line-height:0 }
.event_layer_popup .content .button .btn_confirm { width:50%; height:72px; font-size:24px; line-height:72px; color:#ffffff; letter-spacing:0; text-align:center; vertical-align:top; background-color:#08de68; }
.event_layer_popup .content .button .btn_notice { width:50%; height:72px; font-size:24px; line-height:72px; color:#ffffff; letter-spacing:0; text-align:center; vertical-align:top; background-color:#000000; }
.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; }