@charset "utf-8";

#gnb { z-index:516; position:fixed; left:0; top:0; width:100%; min-width:1280px; height:50px; font-family:"Noto Sans KR",sans-serif; line-height:0; box-shadow:0 0 32px rgba(0,0,0,0.8); }
#gnb a { display:inline-block; font-family:"Noto Sans KR",sans-serif; }
#gnb button { display:inline-block; margin:0; padding:0; font-family:"Noto Sans KR",sans-serif; outline:0; border:0; cursor:pointer; }

#header { z-index:516; position:absolute; left:0; top:0; width:100%; min-width:1280px; height:50px; text-align:center; box-shadow:0 0 32px rgba(0,0,0,0.4); background-color:#ffffff; }
#header .bt-logo { z-index:2; position:absolute; left:0; top:0; font-size:0; line-height:0; }
#header .bt-eacc { z-index:2; position:absolute; left:50px; top:0; width:254px; height:50px; padding:14px 16px; text-align:left; font-weight:bold; font-size:16px; line-height:22px; color:#000000; border-left:1px solid #dcdcdc; border-right:1px solid #dcdcdc; }
#header .bt-eacc:after { content:""; display:inline-block; width:22px; height:22px; margin-left:64px; vertical-align:top; background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/ico_eacc_list.png") 0 0 no-repeat; }
#header .bt-eacc.active:after { background-position:0 -22px; }
#header .eacc { z-index:4; position:absolute; left:50px; top:50px; display:none; width:252px; }
#header .eacc.active { display:block; }
#header .eacc li { margin-bottom:1px; }
#header .eacc li a { display:block; padding:16px; font-size:14px; line-height:14px; color:#ffffff; text-align:left; background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat rgba(0,0,0,0.8); }
#header .eacc li a:hover { background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat rgba(0,60,255,0.8); }

#header .tab { z-index:4; position:absolute; left:50%; top:0; overflow:hidden; margin-left:-264px; }
#header .tab li { float:left; }
#header .tab li:nth-child(1) { width:174px; }
#header .tab li:nth-child(2) { width:216px; }
#header .tab li:nth-child(3) { width:140px; }
#header .tab li a { display:block; padding:14px 0; font-weight:bold; font-size:16px; line-height:22px; color:#000000; text-align:center; }
#header .tab li.active a { padding-bottom:10px; font-weight:500; color:#0064ff; border-bottom:4px solid #0064ff; }

#header .menu { z-index:2; position:absolute; right:0; top:0; width:300px; height:50px; }
#header .menu .bt-login { z-index:6; position:absolute; left:0; top:0; overflow:hidden; width:120px; height:50px; text-indent:-9999px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/bt_login.png") right top no-repeat; }
#header .menu .bt-logout { z-index:6; position:absolute; left:0; top:0; overflow:hidden; width:120px; height:50px; text-indent:-9999px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/bt_logout.png") right top no-repeat; }
#header .menu .bt-gamestart { z-index:4; position:absolute; right:50px; top:0; width:130px; height:50px; text-indent:-9999px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/bt_gamestart.png") left top no-repeat; }
#header .menu .bt-control { z-index:6; position:absolute; right:0; top:0; overflow:hidden; width:50px; height:50px; background-color:#003cff; }
#header .menu .bt-control .inner { height:auto !important; padding:18px 0; -ms-transform:rotate(0); transform:rotate(0); transition-duration:0.4s; }
#header .menu .bt-control .inner span { display:block; width:18px; height:2px; margin:0 auto; text-indent:-9999px; background-color:#ffffff; }
#header .menu .bt-control .inner:before { content:""; display:block; width:18px; height:2px; margin:0 auto 4px auto; background-color:#ffffff; }
#header .menu .bt-control .inner:after { content:""; display:block; width:18px; height:2px; margin:4px auto 0 auto; background-color:#ffffff; }
#header .menu .bt-control.on .inner { -ms-transform:rotate(90deg); transform:rotate(90deg); }

#aside { z-index:514; position:absolute; right:-200px; top:0; opacity:0; width:300px; min-height:auto; padding-top:50px; box-sizing:border-box; transition-duration:0.4s; box-shadow:0 0 32px rgba(0,0,0,0.4); background-color:#c2c2c2; }
#aside.on { right:0; opacity:1; }
#aside .button-box { overflow:hidden; position:relative; min-height:64px; }
#aside .button-box a { float:left; width:150px; height:64px; overflow:hidden; font-size:14px; color:#8c8c96; line-height:64px; text-align:center; }
#aside .button-box .bt-home:before { content:""; display:inline-block; width:24px; height:64px; margin-right:8px; vertical-align:top; background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/bt_home.png") left top no-repeat; }
#aside .button-box .bt-share:before { content:""; display:inline-block; width:12px; height:64px; margin-right:8px; vertical-align:top; background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/bt_share.png") left top no-repeat; }
#aside .button-box a:hover { color:#3e3e54; background-color:#e8e8e8; }
#aside .button-box a:hover:before { background-position:0 -64px; }
#aside .button-box:after { content:""; display:block; position:absolute; left:50%; top:22px; width:2px; height:20px; margin:0 0 0 -1px; background-color:#a8aaae; }
#aside .scroll-box { overflow:hidden; min-height:530px; }
#aside .scroll-box ul { padding-bottom:32px; }
#aside .scroll-box ul li { line-height:0; }
#aside .scroll-box ul li a { position:relative; overflow:hidden; width:200px; border-bottom:1px solid #acacac; background-color:#c2c2c2; line-height:0; }
#aside .scroll-box ul li a .thumb { opacity:0.6; width:180px; height:72px; padding:16px 10px 10px 10px; }
#aside .scroll-box ul li a p { opacity:0.6; overflow:hidden; padding-bottom:16px; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; width:180px; margin:0 auto; font-size:14px; line-height:14px; color:#000000; text-align:center; }
#aside .scroll-box ul li a:hover { background-color:#e8e8e8; }
#aside .scroll-box ul li a:hover .thumb { opacity:1; }
#aside .scroll-box ul li a:hover p { opacity:1; }
#aside .scroll-box ul li.on a { background-color:#e8e8e8; }
#aside .scroll-box ul li.on a .thumb { opacity:1; }
#aside .scroll-box ul li.on a p { opacity:1; }
#aside .scroll-bar { z-index:2; position:absolute; right:2px; top:88px; opacity:1; width:10px; min-height:258px; }
#aside .scroll-bar .handle { position:relative; opacity:0.4; width:4px; margin-left:6px; padding:16px 0 16px 0; box-sizing:border-box; }
#aside .scroll-bar .handle span { display:block; height:100%; border-radius:4px; box-sizing:border-box; background-color:#000; }

#share { z-index:508; display:none; position:fixed; left:50%; top:50%; -ms-transform:translateX(-50%) translateY(-50%); transform:translateX(-50%) translateY(-50%); box-shadow:0 0 32px rgba(0,0,0,0.8); }
#share .title { position:relative; padding:16px; background-color:#ffffff; }
#share .title h4 { padding-left:35px; font-size:24px; line-height:24px; color:#000000; background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/ico_fo4.png") left top no-repeat; }
#share .title .bt-close { position:absolute; right:16px; top:16px; width:24px; height:24px; text-indent:-9999px; background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/bt_close.png") left top no-repeat; }
#share .inner { padding:64px 128px; background-color:#e6e6e6; }
#share .inner button { width:100px; margin:0 16px; padding-top:116px; font-weight:bold; font-size:18px; line-height:18px; color:#565656; }
#share .inner .bt-kakaotalk { background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/bt_kakaotalk.png") left top no-repeat; }
#share .inner .bt-facebook { background:url("https://ssl.nexon.com/s2/game/fo4/event/2019/191209_eacc_xElIIon/gnb/bt_facebook.png") left top no-repeat; }

#dimmed { z-index:504; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background-color:rgba(0,0,0,0.6); }