@charset "utf-8";

/* common */
body{background:#000;font:15px NanumSquare}
h1,h2,h3,h4,h5,h6,li,p{font:15px NanumSquare}
button{border:none;background:0 0;cursor:pointer}
button>img{position:relative}
strong{font-weight:600}

/* layout */
.pcbang{position:relative;min-width:1241px;margin:0 auto}
.pcbang .frame{width:1081px;margin:0 auto}
.pcbang>h1{position:absolute;top:35px;left:30px}
.pcbang h2{height:957px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/intro_bg.jpg) center 0 no-repeat}
.pcbang h2 span{visibility:hidden}
.pcbang h2 img{position:absolute;top:562px;left:50%;margin-left:-540px}

.pcbang .util{position:absolute;top:40px;right:40px;text-align:right;font-size:0}
.pcbang .util button{display:inline-block;width:121px;height:56px;margin-right:-1px;vertical-align:top;color:#bc8649;font:600 22px NanumSquare;border:1px solid #76522c}
.pcbang .util button span{position:relative}
.pcbang .util a{display:inline-block;vertical-align:top;width:54px;height:54px;border:1px solid #76522c;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/ico_home.png) center no-repeat}
.pcbang .util .state span,.pcbang .util a span{font-size:1px;visibility:hidden}

.pcbang .util .state{position:relative;width:176px;height:44px;margin-top:18px}
.pcbang .util .state:after{display:none;content:"";position:absolute;top:49px;right:0;height:58px}
.pcbang .util .state.off{background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/benefit_off.png) no-repeat}
.pcbang .util .state:hover:after{display:block;width:231px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/benefit_off_txt.png) no-repeat}
.pcbang .util .state.on{background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/benefit_on.png) no-repeat}
.pcbang .util .state.on:hover:after{display:block;width:251px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/benefit_on_txt.png) no-repeat}

.pcbang .bt_search{position:absolute;top:664px;left:50%;height:45px;margin-left:-540px;padding:17px 25px 0 25px;border:1px solid #76572a;background:#120805}
.pcbang .bt_search img{vertical-align:middle}
.pcbang .bt_search img:last-child{margin:-1px 0 0 10px}

.pcbang .banner{position:absolute;top:733px;left:50%;margin-left:-540px;border:1px solid #b48422}
.pcbang .banner div{position:relative}
.pcbang .banner div:after{display:block;content:"";position:absolute;top:-2px;right:-2px;width:82px;height:82px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/ico_event.png) no-repeat}
.pcbang .banner img{width:455px;height:201px}

.pcbang .menu{position:sticky;top:0;left:0;z-index:3;width:100%;height:95px;padding:3px 0;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/menu_bg.jpg) 0 3px repeat-x;box-shadow:0 2px 5px #000}
.pcbang .menu:before,
.pcbang .menu:after{display:block;content:"";position:absolute;left:0;width:100%;height:3px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/menu_line.png) center 0 repeat-x}
.pcbang .menu:before{top:0}
.pcbang .menu:after{bottom:0}
.pcbang .menu .frame{font-size:0}
.pcbang .menu a{display:inline-block;vertical-align:top;width:216px}
.pcbang .menu .on{background:#130a04}
.pcbang .menu a span{display:block;height:95px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/menu_spr.png) no-repeat;text-indent:-9999px}
.pcbang .menu a:hover span,
.pcbang .menu a.on span{background-position-y:-95px}
.pcbang .menu a:nth-child(2) span{background-position-x:-216px}
.pcbang .menu a:nth-child(3) span{background-position-x:-432px}
.pcbang .menu a:nth-child(4) span{background-position-x:-648px}
.pcbang .menu a:nth-child(5) span{width:217px;background-position-x:-864px}

.pcbang .popup{display:none;position:absolute;z-index:2;width:657px;margin-left:-389.5px;padding:60px 55px;text-align:left;border:6px solid #b37a44;background:#18120f}
.pcbang .popup .bt_popClose{position:absolute;top:10px;right:10px}
.pcbang .popup h1{margin-bottom:35px}
.pcbang .popup ul{margin-bottom:20px}
.pcbang .popup li{padding-left:9px;color:#a9a6a6;font-size:15px;line-height:26px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/bullet4.png) 0 10px no-repeat}
.pcbang .popup li strong{color:#ffc95d;font-weight:400}
.pcbang .popup dl{padding:17px 19px;border:1px solid #514300;color:#6d6d6d}
.pcbang .popup dt{margin-bottom:10px;padding-left:23px;font-size:17px;color:#ff6000;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/ico_warning.png) 0 center no-repeat}
.pcbang .popup dd{padding:3px 0;color:#6d6d6d}
.pcbang .popup dd strong{color:#6d6d6d}

.frame h3{text-align:center}

.pcbang .section1{position:relative;height:1348px;text-align:center;background:#241c18 url(https://lwi.nexon.com/heroes/home/guide/pcbang/section1_bg.jpg) center 0 no-repeat}
.pcbang .section1 .frame{padding-top:119px;width:1240px}
.pcbang .section1 h3{margin-bottom:59px}
.pcbang .section1 table{margin:0 auto 30px;width:1064px;border:3px solid #c78d3e;table-layout:fixed}
.pcbang .section1 table thead th{padding:23px 0;border-left:1px solid #75542a;background:#c78d3e}
.pcbang .section1 table tbody th{width:14%;background:#815922}
.pcbang .section1 table tbody tr:first-child th{border-bottom:1px solid #5c3f2d}
.pcbang .section1 table td{height:60px;vertical-align:middle;text-align:center;border-left:1px solid #5c3f2d;border-bottom:1px solid #5c3f2d;font:18px NanumSquare;font-weight:600;color:#856f5d;font-size:16px}
.pcbang .section1 table strong{color:#fff;font-size:18px}
.pcbang .section1 table td strong,
.pcbang .section1 table td b{color:#fff;font-weight:400}
.pcbang .section1 table td strong span{display:block;font-size:16px;color:#ff9c00}
.pcbang .section1 .tip{margin-bottom:58px}
.pcbang .section1 .popup{top:520px;left:50%}

.pcbang .section2{position:relative;height:1483px;text-align:center;background:#1e0c04 url(https://lwi.nexon.com/heroes/home/guide/pcbang/section2_bg.jpg) center 0 no-repeat}
.pcbang .section2 .frame{padding-top:119px}
.pcbang .section2 h3{margin-bottom:52px}
.pcbang .section2 .avatar{margin-bottom:30px}
.pcbang .section2 .tip{margin-bottom:56px}
.pcbang .section2 .popup{top:900px;left:50%}

.pcbang .section3{height:1054px;background:#2a1f1b url(https://lwi.nexon.com/heroes/home/guide/pcbang/section3_bg.jpg) center 0 no-repeat}
.pcbang .section3 .frame{padding-top:117px}
.pcbang .section3 h3{margin-bottom:59px}
.pcbang .section3 .item{display:flex;justify-content:center}
.pcbang .section3 .item:after{display:block;clear:both;content:""}
.pcbang .section3 .item li{width:254px;height:133px;margin:0 0 13px 13px;padding:28px 0;text-align:center;font-size:16px;color:#ffc95d;border:3px solid #b37a44;background:#18120f}
.pcbang .section3 .item li:nth-child(4n-3){margin-left:0}
.pcbang .section3 .item li img{width:60px;height:60px}
.pcbang .section3 .item li p{padding-top:12px;line-height:18px}
.pcbang .section3 .item li p em{display:block;color:#604b40;margin-top:4px}
.pcbang .section3 .item li p strong{display:block;color:#fff;font-weight:400}
.pcbang .section3 h4,
.pcbang .section5 h4{margin-bottom:16px;padding-left:30px;font-weight:600;font-size:18px;line-height:24px;color:#a77a6d;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/ico_notice.png) 0 center no-repeat}
.pcbang .guide li{padding:0 0 5px 11px;font-size:15px;line-height:22px;color:#6f5047;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/bullet1.png) 0 9px no-repeat}
.pcbang .guide li strong{color:#a77a6d}
.pcbang .guide li p{padding-left:9px;line-height:22px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/bullet2.png) 0 6px no-repeat}

.pcbang .section4{height:968px;background:#1d0b03 url(https://lwi.nexon.com/heroes/home/guide/pcbang/section4_bg.jpg) center 0 no-repeat}
.pcbang .section4 .frame{padding-top:116px}
.pcbang .section4 h3{margin-bottom:59px}
.pcbang .section4 .ticket{position:relative;width:849px;min-height:80px;margin-bottom:79px;padding:40px 0 35px 225px;color:#ffc95d;line-height:23px;font-size:15px;border:3px solid #b37a44;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/ico_ticket.jpg) 46px center no-repeat,url(https://lwi.nexon.com/heroes/home/guide/pcbang/ticket_bg.gif) repeat-y}
.pcbang .section4 .ticket span{color:#ffe4ae}
.pcbang .section4 .ticket img{margin-top:5px}
.pcbang .section4 .ticket:after{display:block;content:"";position:absolute;bottom:-75px;left:50%;width:96px;height:72px;margin-left:-48px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/ico_arrow.png) no-repeat}
.pcbang .section4 .item{width:1080px;height:184px;padding-top:124px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/ticket_box.png) no-repeat}
.pcbang .section4 .item ul:after{display:block;clear:both;content:""}
.pcbang .section4 .item li{float:left;width:270px;font-size:16px;color:#fff;text-align:center}
.pcbang .section4 .item li img,.pcbang .section5 .item li img{display:block;width:60px;height:60px;margin:0 auto 14px auto}
.pcbang .section4 .item li span{color:#979797}

.pcbang .section5{height:856px;background:#261c19 url(https://lwi.nexon.com/heroes/home/guide/pcbang/section5_bg.jpg) center 0 no-repeat}
.pcbang .section5 .frame{padding-top:118px}
.pcbang .section5 h3{margin-bottom:46px}
.pcbang .section5 .item{margin-bottom:30px}
.pcbang .section5 .item:after{display:block;clear:both;content:""}
.pcbang .section5 .item li{position:relative;float:left;width:339px;margin-left:22px;padding-top:38px;font-size:16px;color:#fff;text-align:center;border:3px solid #b37a44;background:#18120f}
.pcbang .section5 .item li:nth-child(3n-2){margin-left:0}
.pcbang .section5 .item .label{position:absolute;top:-17px;left:21px;width:auto;height:auto;margin:0}
.pcbang .section5 .item li span{display:block;margin-bottom:40px;padding-top:5px;color:#979797}
.pcbang .section5 .item li em{display:block;position:relative;padding:30px 0;font-weight:600;line-height:24px;color:#856f5d;background:#3e2f28}
.pcbang .section5 .item li em:before{display:block;content:"";position:absolute;top:-13px;left:50%;width:18px;height:13px;margin-left:-9px;background:url(https://lwi.nexon.com/heroes/home/guide/pcbang/bullet3.png) no-repeat}
.pcbang .section5 .item li:nth-child(3) em{height:72px}
.pcbang .section5 .tip{margin-bottom:60px;text-align:center}

.pcbang .copy{padding:96px 0;text-align:center;background:#261c19}

.layer_start{display:none;position:fixed;top:0;left:0;top:0;right:0;bottom:0;width:100%;height:100%;min-width:1280px;z-index:9999999}
.layer_start .dim{position:absolute;top:0;left:0;bottom:0;right:0;width:100%;height:100%;background:#000;opacity:.85}
.layer_start .blind{position:absolute;left:-1000%;top:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden;text-indent:-10000px}
.layer_start .modal_wrap{position:absolute;top:50%;left:50%}
.modal_pop .btn_close{position:absolute;right:0;top:0;width:40px;height:40px;background:0 0}
.layer_start .modal_wrap{width:417px;height:176px;margin-top:-200px;transform:translateX(-50%);background:url(https://lwi.nexon.com/heroes/home/common/pop_gamestart_re.png) no-repeat}
.layer_start .btn_32bit,.layer_start .btn_64bit{position:absolute;bottom:40px;left:50%;margin-left:-84px;width:76px;height:34px;text-indent:-9999px;overflow:hidden}
.layer_start .btn_64bit{margin-left:5px}
.layer_start .btn_close{position:absolute;right:0;top:0;width:45px;height:45px;background:0 0;text-indent:-9999px;overflow:hidden}
.margin_none{margin:0!important}