@charset "utf-8";

@font-face {
    font-family:"FCOAllSans";
    font-weight:300;
    font-display:swap;
    src:url("https://fco.vod.nexoncdn.co.kr/fonts/FCOAllSans-Light.woff2") format("woff2");
}
@font-face {
    font-family:"FCOAllSans";
    font-weight:400;
    font-display:swap;
    src:url("https://fco.vod.nexoncdn.co.kr/fonts/FCOAllSans-Regular.woff2") format("woff2");
}
@font-face {
    font-family:"FCOAllSans";
    font-weight:500;
    font-display:swap;
    src:url("https://fco.vod.nexoncdn.co.kr/fonts/FCOAllSans-Medium.woff2") format("woff2");
}
@font-face {
    font-family:"FCOAllSans";
    font-weight:700;
    font-display:swap;
    src:url("https://fco.vod.nexoncdn.co.kr/fonts/FCOAllSans-Bold.woff2") format("woff2");
}

html,body 
html,body { width:100%; max-width:2560px; min-width:1300px;min-height: 800px; margin:0 auto; font-family:"FCOAllSans",sans-serif; color:#1e2028; background-color:#000000;}

#wrapper { position:relative; overflow:hidden; width:100%; height: 100%;box-sizing: border-box;min-width:1300px;}
#wrapper a { display:inline-block; font-family:"FCOAllSans"; }
#wrapper button { visibility:visible; overflow:visible; display:inline-block; outline:none; cursor:pointer; font-family:"FCOAllSans"; }
body,h1,h2,h3,h4,h5,h6,th,td,input,select,textarea,button,b,strong,span { font-family:"FCOAllSans","Pretendard",Dotum,"돋움",Helvetica,"Apple SD Gothic Neo",sans-serif; font-weight:normal; font-size:14px; color:#404040; line-height:1; letter-spacing:-1px; }

#wrapper button:focus { outline:none; }

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

#middle { position:relative; overflow:hidden; background-color:#000000; }
#middle .section { position:relative; }
#middle .section .inner { position:relative; box-sizing:border-box; width:1280px; margin:0 auto; }
#middle .event_cont.section { background:url("https://ssl.nexon.com/s2/game/fc/online/event/2024/240120_totytPromotion_dklxwte3k/bg.jpg") center top no-repeat; height:3400px;}
#middle .section .inner.title {height: 684px;}
#middle .section .inner.sec1 {height: 468px;padding-top: 55px; }
#middle .section .inner.sec2 {height: 1081px;}
#middle .section .inner.sec3 {height: 1166px;}
#middle .section .inner .toty {letter-spacing: -1.6px; }
#middle .section .inner .text_y { background: linear-gradient(to top, #e9c774, #fff9d0); color: transparent; -webkit-background-clip: text;}

#middle .section .inner.title .date {position: absolute; top: 483px; left: 50%; transform: translateX(-50%); width: 974px; height: 68px; text-align: center; font-size: 24px; color: #fff; display: flex; align-items: center; justify-content: center;}
#middle .section .inner.title p {font-weight: bold; color: #fff3a8; margin-right: 4px;}

#middle .section .inner.sec1 .title p:nth-of-type(1) {text-align: center; font-size: 44px; font-weight: 500;}
#middle .section .inner.sec1 .title p:nth-of-type(2) {padding-top: 15px; text-align: center; color: #fff; font-size: 24px; font-weight: 400;}
#middle .section .inner.sec1 .title p:nth-of-type(2) .toty {color: #fff; font-size: 24px; font-weight: 400;letter-spacing: -1.6px; margin-right: 2px;}

#middle .section .inner.sec1 .cont {display: flex; width: 1135px; margin: 0 auto; justify-content: space-between; padding-top: 65px;} 
#middle .section .inner.sec1 .cont .date_cont {width: 185px; text-align: center;}
#middle .section .inner.sec1 .cont .date_cont .week {font-weight: bold; font-size: 20px; color: #283496; text-align: center; padding: 3px 0px 1px; width: 63px; background: #fff3a8; margin: 0 auto;}
#middle .section .inner.sec1 .cont .date_cont .date {font-size: 28px; font-weight: 500; color: #fff3a8; padding-top: 15px;}
#middle .section .inner.sec1 .cont .date_cont .date_t {font-size: 16px; font-weight: 40; color: #fff; padding-top: 10px; line-height: 1.1;}

#middle .section .inner.t1 > div:nth-of-type(1) {height: 316px; text-align: center;}
#middle .section .inner.t1 > div:nth-of-type(1) p:nth-of-type(1) {font-size: 72px; font-weight: bold; color: #0f112d; padding-top: 116px;}
#middle .section .inner.t1 > div:nth-of-type(1) p:nth-of-type(1) .toty {font-size: 72px; font-weight: bold; color: #283496;}
#middle .section .inner.t1 > div:nth-of-type(1) p:nth-of-type(2) {font-size: 24px; font-weight: 400; color: #0f112d; line-height: 32px; padding-top: 15px;}
#middle .section .inner.t1 > div:nth-of-type(1) p:nth-of-type(2) .toty {font-size: 24px; font-weight: 400; color: #0f112d; line-height: 32px;}
#middle .section .inner.t1 > div:nth-of-type(1) p:nth-of-type(2) .strong {font-weight: bold; color: #283496;font-size: 24px; position: relative;}
#middle .section .inner.t1 > div:nth-of-type(1) p:nth-of-type(2) .strong .toty {color: #283496; font-weight: bold;}
#middle .section .inner.t1 > div:nth-of-type(1) p:nth-of-type(2) .strong::after {position: absolute; content: ''; width: 100%; height: 2px; background: #a8abcd; left: 0; bottom: 1px;}
#middle .section .inner.t1 > div:nth-of-type(2) {height: 481px; text-align: center; display: flex; width: 1304px; margin: 0 auto; margin-left: -11px;}
#middle .section .inner.t1 > div:nth-of-type(2) .box_inner {width: 50%; text-align: center; padding-top: 70px;}
#middle .section .inner.t1 > div:nth-of-type(2) .box_inner .title .text_y {font-size: 32px; font-weight: 500;}
#middle .section .inner.t1 > div:nth-of-type(2) .box_inner .title .text_y .toty {font-size: 32px; font-weight: 500; background: linear-gradient(to top, #e9c774, #fff9d0); color: transparent; -webkit-background-clip: text;}
#middle .section .inner.t1 > div:nth-of-type(2) .box_inner .title p:nth-of-type(2) {color: #fff;font-size: 18px; padding-top: 5px;}
#middle .section .inner.t1 > div:nth-of-type(2) .box_inner .title p:nth-of-type(2) .toty {color: #fff;font-size: 18px; padding-top: 5px;}
#middle .section .inner.t1 > div:nth-of-type(2) .box_inner .item_wrap {padding-top: 230px; display: flex; width: 335px; justify-content: space-between; margin: 0 auto;}
#middle .section .inner.t1 > div:nth-of-type(2) .box_inner .item_wrap p {color: #ececec; font-size: 18px; width: 159px; line-height: 1.2;}
#middle .section .inner.t1 > div:nth-of-type(2) .box_inner .item_wrap p .toty {color: #ececec; font-size: 18px;}
#middle .section .inner.t1 > div:nth-of-type(3) {position: absolute; left: 50%; transform: translateX(-50%); padding-top: 35px;}
#middle .section .inner.sec3.t1 > div:nth-of-type(3) {position: absolute; left: 50%; transform: translateX(-50%); padding-top: 12px;}
#middle .section .inner.t1 > div:nth-of-type(3) p { font-size: 16px; color: #0f112d;padding-top: 8px; padding-left: 13px; white-space: nowrap; width: fit-content;}
#middle .section .inner.t1 > div:nth-of-type(3) p .toty { font-size: 16px; color: #0f112d; padding: 0 2px;}
#middle .section .inner.t1 > div:nth-of-type(3) p .strong { font-size: 16px; color: #283496;font-weight: 500; display: inline-block;} 
#middle .section .inner.t1 > div:nth-of-type(3) p .strong .toty { font-size: 16px; color: #283496;font-weight: 500;} 
#middle .section .inner.t1 > div:nth-of-type(3) p.dot {position: relative;}
#middle .section .inner.t1 > div:nth-of-type(3) p.dot::after {position: absolute; content:'\25C6'; font-size:10px; color: #0f112d; left: 0; line-height: 1.7;}
#middle .section .inner.t1 > div:nth-of-type(3) p.dot:nth-of-type(1):before {position: absolute; content: ''; width: calc(100% - 13px); height: 1px; background: #a8abcd; left: 13px; bottom: -2px;}
#middle .section .inner.sec3.t1 > div:nth-of-type(3) p.dot:nth-of-type(7):before {position: absolute; content: ''; width: calc(100% - 13px); height: 1px; background: #a8abcd; left: 13px; bottom: -2px;}

#middle .section .inner.t1.sec3 > div:nth-of-type(1) p:nth-of-type(1) {padding-top: 136px;}
#middle .section .inner.t1.sec3 > div:nth-of-type(2) .box_inner {width: 100%;}

#footer { position:relative; width:100%; min-width:1040px; text-align:center; background-color:#000000; }
#footer .inner { width:100%; padding:40px 0; }
#footer .inner .logo { margin-bottom:22px; line-height:0; }
#footer .inner .logo img{width: 364px;}
#footer .inner .information { position:relative; overflow:hidden; width:1142px; margin:0 auto;  display: flex; justify-content: center;}
#footer .inner .information .company { position:relative;   display: flex; align-items: center; box-sizing: border-box; padding: 0 20px 0 0;}
#footer .inner .information .company .bt-nexon {position: relative; top: -5px; }
#footer .inner .information .company .bt-ea { position: relative;}
#footer .inner .information .copyright {width:584px; height:46px; }

.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 ; }
.event_layer_popup .content {  position:absolute; left:50%; top:50%; box-sizing:border-box; width:680px; box-shadow:0 0 32px rgba(0,0,0,0.8); -ms-transform:translateX(-50%) translateY(-50%); transform:translateX(-50%) translateY(-50%); background-color:#fff;z-index:100; }
.event_layer_popup .content .btn_close { 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/fc/online/event/2020/200402_layer_common_/btn_close.png) left top no-repeat;z-index:16;  }
.event_layer_popup .content .title { 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); position: relative;z-index: 10;background: #fff;}
.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; }
.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 .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-weight:bold; font-size:18px; line-height:26px; color:#08de68; letter-spacing:0; vertical-align:top; }
.event_layer_popup .content .button { font-size:0; line-height:0; }
.event_layer_popup .content .button .btn_link { width:50%; padding:8px 0; font-size:24px; line-height:32px; color:#ffffff; letter-spacing:0; text-align:center; vertical-align:top; background-color:#000000; }
.event_layer_popup .content .button .btn_half {width:50%; font-size:24px; line-height:80px; color:#ffffff; letter-spacing:0; text-align:center; vertical-align:top; background-color:#000000; }
.event_layer_popup .content .button .btn_confirm { width:50%; font-size:24px; line-height:80px; color:#ffffff; letter-spacing:0; text-align:center; vertical-align:top; background-color:#08de68; }
