@charset "utf-8";

html,body { width:100%; font-family:"Noto Sans KR",sans-serif; background-color:#000000; }
button:focus {outline:0;}
#wrapper { position:relative; overflow:hidden; box-sizing:border-box; width:100%; margin:0 auto; font-family:"Noto Sans KR",sans-serif; line-height:0; box-shadow:0 0 32px rgba(0,0,0,0.8); }
#wrapper a { display:inline-block; font-family:"Noto Sans KR"; }
#wrapper button { display:inline-block; margin:0; padding:0; cursor:pointer; font-family:"Noto Sans KR"; }

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

#middle { position:relative; width:100%; margin:0 auto;}
#middle .section { position:relative; width:100%; margin:0 auto; }
#middle .section  img{width: 100%}

#middle .section .btn_area{position: absolute;width: 100%;margin-top:717px;height: 76px;z-index: 2}
#middle .section .btn_area .btn_detail{background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat;position: absolute;top:0;left:355px;width: 300px;height: 76px;}
#middle .section .btn_area .btn_event{background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat;position: absolute;top:0;left:663px;width: 300px;height: 76px;}
#middle .section .frame{position: absolute;    position: absolute;width: 42.5%;margin-top: 43%;margin-left: -21.25%;height: 25%;top: 8.2%;left: 50%;z-index: 1;}
#middle .section .frame iframe{width: 100%;height: 100%;}

#middle .section.event1 .btn_africa{position: absolute;top: 1466px;left: 50%;width: 850px;height: 75px;z-index: 10;background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat;margin-left: -425px;}
#middle .section.event3 .btn_africa{position: absolute;top: 236px;left: 50%;width: 950px;height: 77px;z-index: 10;background:url("https://ssl.nexon.com/s2/game/fo4/common/transparent.png") left top repeat;margin-left: -475px;}

#footer { position:relative; width:100%; min-width:1200px; text-align:center; background-color:#1e1e40; }
#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; }