@charset "utf-8";

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

#wrapper { position:relative; overflow:hidden; width:100%; height: 100%;box-sizing: border-box;min-width:1340px;}
#wrapper a { display:inline-block; font-family:"Pretendard"; }
#wrapper button { visibility:visible; overflow:visible; display:inline-block; outline:none; cursor:pointer; font-family:"Pretendard"; }

#loader { z-index:1024; position:fixed; left:0; top:0; width:100%; height:100%; background:url("https://ssl.nexon.com/s2/game/fc/online/common/transparent.png") left top repeat #000; }

#middle { position: relative; width:100%;min-width:1340px;background: url("https://ssl.nexon.com/s2/game/fc/online/event/2023/230921_boost_s359xk2wq/bg.jpg") center 0 no-repeat;z-index: 10;box-sizing: border-box; height: 2900px;}
#middle .section { position:relative; width:100%;margin:0 auto;box-sizing: border-box; }
#middle .section.header .inner{width: 1340px;margin: 0 auto;position: relative; height: 800px; padding-top: 10px;}
#middle .section.header .btn_advice{position: absolute;top: 478px;left: 516px;width: 148px;height: 45px;background: transparent; color: #fff; line-height: 45px; text-align: center;  font-weight: 600; font-size: 16px;}
#middle .section.header .btn_reward{position: absolute;top: 478px;left: 675px;width: 148px;height: 45px;background: transparent; color: #fff; line-height: 45px; text-align: center;  font-weight: 600; font-size: 16px;}
/* #middle .section.header .btn_info{position: absolute;top: 506px;left: 730px;width: 160px;height: 38px;background: blue;} */
/* #middle .section.header .title{width: 1146px; height: 417px; margin: 0 auto; background: #000; } */
#middle .section.content .inner{width: 1340px;margin: 0 auto;position: relative;}
#middle .header .date{text-align: center; position: absolute; top: 570px; left: 50%; transform: translateX(-50%);}
#middle .header .date p {line-height: 27px;}
#middle .header .date span.tit{font-size: 19px; color: #431A18; font-weight: 900; margin-right: 10px;}
#middle .header .date span.dt{font-size: 19px; color: #441D14; }
#middle .header .date span.divide{margin: 0 10px; font-size: 19px;}
#middle .item_wrap{position: absolute;} 
#middle .item_wrap.weekday{top: 58px; left: 130px; width: 524px; height: 600px; box-sizing: border-box; margin: 0 auto; padding-top: 57px;}
#middle .item_wrap.weekend{top: 58px; right: 130px; width: 524px; height: 600px;  box-sizing: border-box; margin: 0 auto; padding-top: 57px;}
#middle .item_wrap._3{top: 883px; left: 130px; width: 1078px; height: 282px; box-sizing: border-box; margin: 0 auto; padding-top: 43px; }
#middle .item_wrap._4{top: 1183px; left: 130px; width: 1078px; height: 282px; box-sizing: border-box; margin: 0 auto; padding-top: 43px; }
#middle .item_wrap._5{top: 1483px; left: 130px; width: 1078px; height: 348px; box-sizing: border-box; margin: 0 auto; padding-top: 43px;}
#middle .item_wrap .image{width: 140px; height: 140px; margin: 0 auto;}
#middle .item_wrap .image img{width: 140px;}
#middle .item_wrap .text_area{margin-top: 25px; padding: 0 88px; text-align: center;}
#middle .item_wrap .text_area span{color: #f0f0ea; font-size: 20px; line-height: 1.1;}
#middle .item_wrap._3 .img_wrap:first-child{position: absolute; left: 379px; width: 250px; top: 42px;}
#middle .item_wrap._3 .img_wrap:nth-child(3){position: absolute; left: 600px; width: 250px; top: 42px;}
#middle .item_wrap._3 .text_area:nth-child(2){position: absolute; left: 377px; width: 250px; top: 153px; padding: 0 27px; box-sizing: border-box;}
#middle .item_wrap._3 .text_area:nth-child(4){position: absolute; left: 600px; width: 250px; top: 153px; padding: 0 27px; box-sizing: border-box; }
#middle .item_wrap._3 .text_area span{font-size: 16px;}
#middle .item_wrap._3 .image{width: 120px; height: 120px; margin: 0 auto;}
#middle .item_wrap._3 .image img{width: 120px;}
#middle .item_wrap._4 .img_wrap:first-child{position: absolute; left: 379px; width: 250px; top: 54px;}
#middle .item_wrap._4 .img_wrap:nth-child(3){position: absolute; left: 600px; width: 250px; top: 54px;}
#middle .item_wrap._4 .text_area:nth-child(2){position: absolute; left: 377px; width: 250px; top: 163px; padding: 0 27px; box-sizing: border-box;}
#middle .item_wrap._4 .text_area:nth-child(4){position: absolute; left: 600px; width: 250px; top: 163px; padding: 0 27px; box-sizing: border-box; }
#middle .item_wrap._4 .text_area span{font-size: 16px;}
#middle .item_wrap._4 .image{width: 120px; height: 120px; margin: 0 auto;}
#middle .item_wrap._4 .image img{width: 120px;}
#middle .item_wrap._5 .img_wrap:first-child{position: absolute; left: 221px; width: 250px; top: 87px;}
#middle .item_wrap._5 .img_wrap:nth-child(3){position: absolute; left: 421px; width: 250px; top: 87px;}
#middle .item_wrap._5 .img_wrap:nth-child(5){position: absolute; left: 760px; width: 250px; top: 48px;}
#middle .item_wrap._5 .text_area:nth-child(2){position: absolute; left: 241px; width: 213px; top: 198px; padding: 0 24px; box-sizing: border-box;}
#middle .item_wrap._5 .text_area:nth-child(4){position: absolute; left: 441px; width: 213px; top: 198px; padding: 0 24px; box-sizing: border-box; }
#middle .item_wrap._5 .text_area:nth-child(6){position: absolute; left: 779px; width: 213px; top: 161px; padding: 0 24px; box-sizing: border-box; }
#middle .item_wrap._5 .text_area span{font-size: 16px; }
#middle .item_wrap._5 .image{width: 120px; height: 120px; margin: 0 auto;}
#middle .item_wrap._5 .image img{width: 120px;}
#middle .item_wrap._5 .img_wrap:nth-child(5) .image::before{content:""; width: 100px; height: 34px; background: url("https://ssl.nexon.com/s2/game/fc/online/event/2023/230921_boost_s359xk2wq/btn_hundred.png") left top no-repeat; position: absolute; top: -23px; left: 75px;}
#middle .item_wrap .tooltip{
  width: 434px; height: 254px; background: url("https://ssl.nexon.com/s2/game/fc/online/event/2023/230921_boost_s359xk2wq/tooltip.png") left top no-repeat;
  margin: 0 auto; position: absolute; bottom: 45px; left: 45px; box-sizing: border-box; padding-top: 80px; text-align: center;
}
#middle .item_wrap .tooltip .tooltip_text{font-weight: 300; font-size: 16px; color: #141515; line-height: 1.15;}
#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; }

.loading.layer_popup { z-index:10030 !important; }
.loading.layer_popup .content { z-index:138 !important; box-shadow:none; border-radius:0; border:none; background:transparent; }
.loading.layer_popup .content ul { width:128px; margin:0 auto 48px auto; }
.loading.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.layer_popup .content p:nth-child(2) { width:100%; margin-bottom:16px; font-size:48px; line-height:48px; font-weight:bold; color:#ffffff; text-align:center; text-shadow:0 0 32px rgba(0,0,0,1); }
.loading.layer_popup .content p:nth-child(3) { width:100%; font-size:32px; line-height:32px; color:#ffffff; text-align:center; text-shadow:0 0 32px rgba(0,0,0,1); }
.layer_popup .content .message {
  padding: 32px 0;
  font-size: 18px;
  line-height: 26px;
  color: #000000;
  letter-spacing: 0;
  text-align: center;
}
.layer_popup .content .message strong {
  font-size: 18px;
  line-height: 26px;
  color: #08de68;
  letter-spacing: 0;
  vertical-align: top;
}
.layer_popup .content .message span strong{color: #08de68; font-size: 14px; line-height: 26px; padding: 0; vertical-align: baseline; margin: 0 2px; letter-spacing: 0;}
#layerTable .content{width: 780px;}
#layerTable .content .item .table thead > tr th:first-child{background-color: #000; color: #fff;}
#layerTable .content .item .table tbody tr.left_header{background-color: #666666;}
#layerTable .content .item .table tbody tr.left_header td{color: #fff; line-height: 1.3;}
#layerTable .content col.col1{width: 90px;}
#layerTable .content col.col2{width: 130px;}
#layerTable .content .item .message { box-shadow:0 0 10px rgba(0,0,0,0.2);padding-top:22px;padding-bottom:22px; font-size:14px; line-height:16px; color:#818080; text-align:center; position: relative;z-index: 9;}
#layerTable .content .item .message strong{ font-size:14px; line-height:16px; color:#08de68; }

#layerTable .content .item .table { box-sizing: border-box;text-align:center; border-bottom: 1px solid #e0e1e2; background-color:#fff; }

#layerTable .content .item .table .selector{padding:30px;position: relative;background-color: #eee;height: 41px;}
#layerTable .content .item .table .selector strong{display: block;line-height: 1.5;font-size: 17px;font-weight: 800;}
#layerTable .content .item .table .selector span{display: block;line-height: 1.5;}
#layerTable .content .item .table .btn_prev{position: absolute;top:0;left:0;width: 100px;height: 100px;background-color: #fff;;}
#layerTable .content .item .table .btn_prev:before{position: absolute;top:10px;left:50px;width: 1px;height: 50px;background-color: #333;content: "";transform:rotate(45deg)}
#layerTable .content .item .table .btn_prev:after{position: absolute;top:45px;left:50px;width: 1px;height: 50px;background-color: #333;content: "";transform:rotate(-45deg)}
#layerTable .content .item .table .btn_next{position: absolute;top:0;right:0;width: 100px;height: 100px;background-color: #fff;;}
#layerTable .content .item .table .btn_next:before{position: absolute;top:10px;left:50px;width: 1px;height: 50px;background-color: #333;content: "";transform:rotate(-45deg)}
#layerTable .content .item .table .btn_next:after{position: absolute;top:45px;left:50px;width: 1px;height: 50px;background-color: #333;content: "";transform:rotate(45deg)}

#layerTable .content .item table tr:nth-child(1) td{font-size: 15px;color: #000;}
#layerTable .content .item table th{height: 30px;line-height: 30px;font-size: 15px;}
#layerTable .content .item table td{height: 30px;line-height: 30px;font-size: 15px;}

#layerTable .content .item .table .reward_table_wrap{padding:10px;}
#layerTable .content .item .table .reward_table_wrap .tit{background: #ddd;line-height: 2;color: #000;font-size: 17px;;}
#layerTable .content .item .table .reward_table_wrap .tit strong{color: red;font-size: 17px;;}
#layerTable .content .item .table .reward_table_wrap table th{border:1px solid #ddd}
#layerTable .content .item .table .reward_table_wrap table th strong{color: red;font-size: 17px;;}
#layerTable .content .item .table .reward_table_wrap table td{border:1px solid #ddd}
#layerTable .content .item .table .reward_table_wrap table td.active{background-color: #feffb9;}
#layerTable .content .item table tr:nth-child(4) td{color: #000000;}

#layerTable .content .advice { padding:22px 32px; font-size:13px; line-height:24px; color:#939393; text-align:center; background-color:#eaeaea; }
#layerTable .content .advice .align_center{text-align: left;;display: inline-block;padding-left:35px;background: url(https://ssl.nexon.com/s2/game/fo4/event/2020/200402_layer_common_/ico_i.png) 0 center no-repeat;font-size:13px; line-height:24px; color:#939393;;}
#layerTable .content .advice .align_center span{text-align: left;font-size:13px; line-height:24px; color:#939393;;}
#layerTable .content .advice .align_center span + span{margin-top:5px;}
#layerTable .content .advice strong { font-size:14px; line-height:24px; color:#08de68; }
.layer_popup .content .btn_today {z-index: 16;position: absolute;right: 80px;top: 24px;font-size: 16px;line-height: 16px;color: #949494;letter-spacing: 0;}
.layer_popup .content .btn_today p::before {content: "";box-sizing: border-box;overflow: hidden;width: 16px;height: 16px;display: inline-block;margin-right: 4px;vertical-align: top;border: 1px solid #949494;box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);}
.layer_popup.remain_ticket .content .message {padding: 32px 25px;font-size: 20px;line-height: 28px;color: #000000;letter-spacing: 0;text-align: center;}
.layer_popup.remain_ticket .content .message strong {font-size: 20px;line-height: 28px;color: #08de68;letter-spacing: 0;vertical-align: top;
}
.layer_popup.remain_ticket .content .advice {padding: 32px;font-size: 16px;line-height: 24px;color: #949494;text-align: center;background-color: #eaeaea;}
.match_list.layer_popup .content .item{padding: 32px 15px; text-align: center;} 
.match_list.layer_popup .content .item p {font-size: 16px; color: #000; line-height: 22px; margin-bottom: 20px;}
/* .layer_popup .content .item .message { padding-top:32px;padding-bottom:32px; font-size:14px; line-height:16px; color:#818080; text-align:center; position: relative;z-index: 9;} */
.match_list.layer_popup .match_table{width: 100%; display: flex; flex-basis: 650px;}
.match_list.layer_popup .match_table .left{flex-basis: 70px;}
.match_list.layer_popup .match_table .left .tit{background-color: #383838; padding: 10px 5px; border:1px solid #555555; box-sizing: border-box; color: #fff;}
.match_list.layer_popup .match_table .left .con{background-color: #cfcfcf; padding: 10px 5px; border:1px solid #555555; box-sizing: border-box; color: #000;}
.match_list.layer_popup .match_table .right{flex-basis: 580px; display: flex; flex-wrap: wrap;}
.match_list.layer_popup .match_table .right li{flex-basis: 82.85px; }
.match_list.layer_popup .match_table .right .tit{background-color: #5F5F5F; padding: 10px 5px; border:1px solid #555555; box-sizing: border-box; color: #fff;}
.match_list.layer_popup .match_table .right .con{background-color: #fff; padding: 10px 5px;  box-sizing: border-box; border-width: 1px 1px 1px 0; border-color: #555555; border-style: solid;}
.match_list.layer_popup .match_table .right .con.blue{color:#00478B;}
.match_list.layer_popup .match_table .right .con.red{color:rgb(199, 30, 30);}
.match_list.layer_popup .match_table .right .con.not{color:#4a4c4d;}
.ticket_info.layer_popup .content{width: 780px;}
.ticket_info.layer_popup .item{padding: 32px 15px; text-align: center;}
.ticket_info.layer_popup .match_table{width: 100%; display: flex; flex-basis: 750px;}
.ticket_info.layer_popup .match_table .left{flex-basis: 190px;}
.ticket_info.layer_popup .match_table .left li .el1{background-color: #000; color: #fff; text-align: center; padding: 10px 5px;  border:1px solid #999;}
.ticket_info.layer_popup .match_table .left li .el2{display: flex;}
.ticket_info.layer_popup .match_table .left li .el2 .el2_left{width: 60px; padding: 10px 5px; background-color: #5F5F5F; color: #fff; line-height: 16px; display: flex; align-items: center; justify-content: center;  border:1px solid #999;}
.ticket_info.layer_popup .match_table .left li .el2 .el2_right{width: 120px; }
.ticket_info.layer_popup .match_table .left li .el2 .el2_right div{padding: 10px 5px; border-width: 0 0 1px 0; border-color: #999; border-style: solid;}
.ticket_info.layer_popup .match_table .left li .el3{padding: 10px 5px; background-color: #5F5F5F; color: #fff;  border-width: 1px 1px 0 1px; border-style: solid; border-color: #999;}
.ticket_info.layer_popup .content .item p.cnt {font-size: 18px; color: #000; line-height: 22px; margin-bottom: 20px; font-weight: 600;}
.ticket_info.layer_popup .content .item p.cnt span {font-size: 18px; color: #000; line-height: 22px; font-weight: 600;}
.ticket_info.layer_popup .match_table .right{flex-basis: 560px;  display: flex; flex-wrap: wrap; height: 176px;}
.ticket_info.layer_popup .match_table .right li{flex-basis: 79px;}
.ticket_info.layer_popup .match_table .right .tit{background-color: #5F5F5F; padding: 10px 5px; box-sizing: border-box; color: #fff; border-width: 1px 1px 1px 1px; border-color: #555555; border-style: solid;}
.ticket_info.layer_popup .match_table .right .con{background-color: #fff; padding: 10px 5px;  box-sizing: border-box; border-width: 0 1px 1px 1px; border-color: #999; border-style: solid;}
.layer_popup.ticket_info .content{top:56px; transform: translateX(-50%) translateY(0);}
.ticket_info .content .item .message { padding-top:0;padding-bottom:22px; font-size:14px; line-height:16px; color:#818080; text-align:left; position: relative;z-index: 9;}
.ticket_info .content .item .message span{font-size: 15px; font-weight: 600; color: #000; line-height: 22px;}
.ticket_info .content .item .message strong{ font-size:14px; line-height:16px; color:rgb(199, 30, 30);; }