@charset "utf-8"; /************************************************** Layout **************************************************/ html{overflow-x: hidden; overflow-y: scroll; -webkit-text-size-adjust: 100%; text-size-adjust: 100%;} body{overflow: hidden; padding-top: 80px;} #header{position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 100; background: #fff;box-shadow: 0px 2px 4px 0px rgba(153, 153, 153, 0.25);} /* #header.scroll{box-shadow: -1px 2px 10px 4px rgba(0,0,0,0.05);} #header.scroll:hover{box-shadow: none;} #header.scroll .inner {height: 85px;} #header.scroll .logo {top: 5px;line-height: 86px;} #header.scroll .logo img {width: 340px;} #header.scroll #gnb {top: 10px;left: 530px;} #header.scroll #gnb > li > a {line-height: 75px;font-size: 18px;} #header.scroll #hdMenu {top: 5px;} #header.scroll #hdMenu ul li {padding: 0 9px;} #header.scroll #hdBtns {display: none;} #header.scroll #gnbBg {top: 85px;} #header.scroll #hdMenu .menu-ico {display: flex;gap: 32px;position: absolute;top: 27px;right: 0;} */ #header #hdMenu .menu-ico {} #header #hdMenu .menu-ico a img {width: 23px;} /* #header.scroll #hdMenu ul {display: none;} #header.scroll #gnb > li > div > ul{left: 36.5%;} #header.scroll #gnb > li:nth-child(2) > div > ul{left: 44%;} #header.scroll #gnb > li:nth-child(3) > div > ul{left: 50%;} #header.scroll #gnb > li:nth-child(4) > div > ul{left: 63%;} */ #header .inner{position: relative; width: 1400px; margin: 0 auto;display: flex;height: 80px;align-items: center;justify-content: space-between;} #header .logo{} #header .logo a{display: block;} #header .logo a img{vertical-align: middle;transition: all 0.2s;} #gnb{display: flex;gap: 60px;} #gnb > li{position: relative;height: 80px;line-height: 80px;} #gnb > li > a{position: relative; display: block; font-weight: 600; font-size: 20px; color: #222;transition: all 0.2s;} #gnb > li > a:after{display: block; content: ''; width: 0; height: 3px; position: absolute; bottom: 0; left: 50%; background: #6aaae4; transition: all 0.25s;} #gnb > li:hover > a:after, #gnb > li.active > a:after{width: 100%; left: 0;} #gnb > li:hover > a {color: #6aaae4;} #gnb > li > div {background: #fff;position: fixed; left: 0; width: 100%; top: 80px;height: 60px;/* visibility: hidden; opacity: 0; transition: all 0.2s; */display: none;} #gnb > li > div > ul{position: absolute;left: 39.5%;height: 60px;line-height: 60px;} #gnb > li:nth-child(2) > div > ul{left: 45%;} #gnb > li:nth-child(3) > div > ul{left: 55%;} #gnb > li:nth-child(4) > div > ul{left: 64%;} #gnb > li > div > ul > li{display: inline-block; vertical-align: middle; padding: 0 15px;} #gnb > li > div > ul > li:first-child{padding-left: 0;} #gnb > li > div > ul > li > a{display: block; font-weight: 300; font-size: 18px; line-height: 65px; color: #222; text-align: center;} #gnb > li > div > ul > li:hover > a, #gnb > li > div > ul > li.active > a{color: #6aaae4;} #gnb > li > div > ul > li.active a{font-weight: 600;} #gnb > li > div > ul > li > ul{display: none;} /* #gnb > li:hover > div {visibility: visible; opacity: 1;} */ #gnb > li.hidden-gnb{display: none;} /* #header.scroll #gnb > li > ul > li > a{padding-top: 10px;} */ #header.scroll:hover #gnb > li > ul > li > a{padding-top: 0;} #gnbBg{display: none; position: fixed; top: 135px; left: 0; width: 100%; height: 65px; background: #fff; box-shadow: -1px 2px 10px 4px rgba(0,0,0,0.1); z-index: 1;} #drdw{position: fixed; top: 80px; left: 0; width: 100%; background: #fff; border-top: 1px solid #ddd; border-bottom: 3px solid #6aaae4; z-index: 91; display: none;} #drdw .inner{position: relative; width: 1200px; margin-left: 350px; border-right: 1px solid #e8e8e8; font-size: 0;} #drdw .inner > li{display: inline-block; padding: 45px 0; vertical-align: top;} #drdw .inner > li:before{content: ''; display: block; position: absolute; top: 0; height: 100%; width: 1px; background: #e8e8e8;} #drdw .inner > li:first-child{border-left-width: 1px;} #drdw .inner > li > a{display: block; margin-bottom: 15px; font-weight: 500; font-size: 20px; color: #6aaae4; text-align: center; font-weight: bold;} #drdw .inner > li ul li a{display: block; font-weight: 400; font-size: 16px; line-height: 30px; color: #555555; text-align: center;} #drdw .inner > li ul li.active a{font-weight: bold;} #drdw .inner > li > ul > li > ul{display: none;} #drdw .inner > li.hidden-gnb{display: none;} #hd-lan{position: absolute; top: 40px; right: 110px; z-index: 92;} #hd-lan > a{display: block; line-height: 40px; padding: 0 22px 0 28px; font-size: 14px; color: #2e3144; text-decoration: none; text-transform: uppercase; background: url('/images/layout/hd-lan-ico.png') no-repeat 0 center, url('/images/layout/hd-lan-spr.png') no-repeat right center;} #hd-lan > ul{position: absolute;top: 40px;left: 50%;display: none;width: 80px;margin-left: -40px;padding: 10px 0;border: 1px solid #b8b8b8;background: #fff;} #hd-lan > ul:before{position: absolute;top: -7px;left: 50%;content: '';display: block;width: 6px;height: 7px;margin-left: -3px;background: url('/images/layout/hd-lanbox-spr.png');} #hd-lan > ul li a{display: block;font-size: 14px;line-height: 26px;color: #666666;text-decoration: none;text-align: center;text-transform: uppercase;} #hd-lan:hover > ul{display: block;} #hdMenu {position: relative;} #hdMenu ul li a {font-size: 14px;font-weight: 500;color: #222;line-height: 24px;} #hdMenu .join_ico {cursor: pointer;} #hdMenu .join_ico img {width: 20px;} #hdMenu .join_menu {display: none;box-sizing: border-box;position: absolute;top: 36px;left: 50%;transform: translate(-50%, 0);padding: 10px;background: #FFF;width: max-content;text-align: center;border: 1px solid #DDD;} /* #hdMenu {position: absolute; top: 0; right: 0;transition: all 0.2s;display: none;} #hdMenu ul {} #hdMenu ul li {position: relative; display: inline-block; vertical-align: middle; padding: 0 15px;transition: all 0.2s;} #hdMenu ul li:before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 1px; height: 12px; background: rgba(255,255,255,0.2)} #hdMenu ul li:first-child:before {display: none} #hdMenu ul li:last-child{padding-right: 0;} #hdMenu ul li a {display: block; font-weight: 300; font-size: 14px; line-height: 40px; color: #fff; letter-spacing: -0.5px} */ #hdBtns {position: relative;display: flex;gap: 40px;align-items: center;} #hdBtns > * { /* display: inline-block; vertical-align: middle; width: 50px; height: 50px; border: 2px solid #dddddd; box-sizing: border-box; border-radius: 50%; margin-left: 10px */ } #tnb{} #tnb {} #tnb a{display: block; line-height: 46px; text-indent: -999em; background: url('../images/layout/hd_login_ico.png') no-repeat center} #hd-sch{position: relative} #hd-sch .btn{display: inline-block;width: 46px;height: 46px; background: url('/images/layout/hd-sch-btn.png') no-repeat center;text-indent: -999em;border: none;} #hd-sch form{position: absolute;display: none;top: 56px;right: 0;width: 200px;padding-right: 45px;border: 1px solid #333;border-radius: 5px;overflow: hidden;background: #fff;} #hd-sch legend{display: none;} #hd-sch .inp{width: 100%;height: 43px;line-height: 43px;text-indent: 10px;background: none;border: none;} #hd-sch .sbm{position: absolute;top: 0;right: 0;width: 45px;height: 45px;background: #333 url('/images/layout/hd-sch-btn2.png') no-repeat center center;border: none;text-indent: -999em;} #hd-sch.on form{display: block;} #footer{position: relative; z-index: 3; background: #333;} #footer .fnbWrap{} #footer .fnbWrap .inner{position: relative; width: 1400px; margin: 0 auto; padding: 40px 0 20px 0; border-bottom: 1px solid #3d3d3d; display: flex; align-items: center; justify-content: space-between;} #footer .ftWrap{position: relative;width: 1400px;margin: 0 auto; padding: 10px 0 70px 0;} #footer address{margin-top: 20px; font-size: 16px; font-weight: 300; line-height: 26px; color: #999;} #footer address span{margin: 0 14px; font-weight: 100;} #footer address .copyright{margin-top: 12px; font-size: 13px;} #footer address .mbr {display: none;} #ftBox {} #ftBox > * {display: inline-block; vertical-align: middle} #ftBox > h5 {margin-right: 40px; font-family: neo; font-weight: 800; font-size: 21px; line-height: 30px; color: #fff} #ftInfo {position: absolute; top: 30px; right: 0} #ftInfo > * {font-family: neo; text-align: right} #ftInfo h6 {font-weight: 700; font-size: 18px; color: #fff; line-height: 30px} #ftInfo h6 strong {margin-left: 20px; font-weight: 900; font-size: 28px; line-height: inherit} #ftInfo p {margin-top: 10px; font-weight: normal; font-size: 13px; color: #ccc} #ftInfo em {display: block; margin-top: 25px; font-style: normal; font-weight: normal; font-size: 13px; line-height: 19px; color: #8bc64a} #sns-ico{} #sns-ico li {display: inline-block;margin-right: 10px; width: 33px; height: 33px; background-position: center; background-repeat: no-repeat} #sns-ico li.fb {background-image: url('../images/layout/ft_sns_fb_ico.png')} #sns-ico li.insta {background-image: url('../images/layout/ft_sns_insta_ico.png')} #sns-ico li.ytb {background-image: url('../images/layout/ft_sns_ytb_ico.png')} #sns-ico li.twt {background-image: url('../images/layout/ft_sns_twt_ico.png')} #sns-ico li:hover {background: none} #sns-ico li img {opacity: 0; visibility: hidden} #sns-ico li:hover img {opacity: 1; visibility: visible} #gotop2{position: absolute;top: 10px;right: 0;display: block;background: url('/images/layout/ft-top-btn.jpg') no-repeat center center;width: 50px;height: 50px;text-indent: -999em;} #fnb > li{position: relative; display: inline-block;padding: 0 15px} #fnb > li:before {content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 1px; height: 12px; background: #999999} #fnb > li:first-child{padding-left: 0;background: none;} #fnb > li:first-child:before {display: none} #fnb > li a{font-size: 18px; font-weight: 300; color: #fff; line-height: 55px;} #famWrap {display: flex;} #ft-contact {line-height: 55px;padding: 0 30px;border: 1px solid #444;font-size: 16px;font-weight: 400;color: #aaa;margin-right: 11px;} #ft-fam{position: relative; width: 400px; height: 55px;} #ft-fam > a{display: block; line-height: 55px; padding: 0 30px; border: 1px solid #444; font-size: 16px; font-weight: 400; color: #aaa; } #ft-fam > a img {width: 12px;position: absolute;top: 45%;right: 8%;transition: all 0.2s;} #ft-fam ul{position: absolute; top: 56px; left: 0; display: none; width: 400px; padding: 10px 15px; background: #444; box-sizing: border-box;z-index: 10;} #ft-fam ul li{border-top: 1px solid #575757;} #ft-fam ul li:first-child{border-top: none;} #ft-fam ul li a{display: block; font-size: 16px; line-height: 46px; color: #f7f7f7; text-align: center;} /* #ft-fam:hover ul{display: block;} */ #ft-fam.on > a img {transform: rotate(180deg);} #slide-btn{width: 28px;height: 21px;position: relative;} #slide-btn button {width: 28px; height: 21px; outline: none;} #slide-btn button span, #slide-btn button:before, #slide-btn button:after{border-radius: 2px;overflow: hidden;position: absolute;left: 0;width: 100%;height: 3px;background: #222;} #slide-btn button span{display: block;top: 50%;margin-top: -1px;opacity: 1;transition: all 0.3s;} #slide-btn button:before{content: '';display: block;top: 0;transition: all 0.3s;} #slide-btn button:after{content: '';display: block;bottom: 0;transition: all 0.3s;} #slide-btn button.on span{opacity: 0;} #slide-btn button.on:before{top: 50%;margin-top: -1px;transform: rotate(45deg);} #slide-btn button.on:after{bottom: 50%;margin-bottom: -2px;transform: rotate(-45deg);} #slide-bg{display: none;} #slide-menu{display: none;} #quickMenu {position: fixed; top: 50%; right: 30px; transform: translateY(-50%); width: 100px; z-index: 99} #quickMenu .close {position: absolute; top: -5px; right: -5px; z-index: 3} #quickMenu.on .close {display: none} #quickMenu .wrap {} #quickMenu .box {position: relative; border-radius: 10px} #quickMenu .box a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2} #quickMenu .box.event {} #quickMenu .box.event > img {border-radius: 10px} #quickMenu .box.event .hov {position: absolute; top: 0; right: 115px; width: 500px; height: 300px; opacity: 0; visibility: hidden; transition: all .3s ease} #quickMenu .box.event:hover .hov {opacity: 1; visibility: visible; transition: all .3s ease} #quickMenu .box.event .thumb {padding-bottom: 60%; background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 10px} #quickMenu.on .box.event {display: none} #quickMenu .box.done {padding: 20px 0 18px 0; text-align: center; background: #00a040} #quickMenu .box.done img {} #quickMenu .box.done p {margin-top: 14px; font-family: neo; font-weight: 700; font-size: 15px; line-height: 18px; color: #fff; letter-spacing: -0.5px} #quickMenu button {display: block; width: 100%; text-align: center; font-family: neo; font-weight: normal; font-size: 14px; line-height: 34px; color: #fff; letter-spacing: -0.5px; border-radius: 10px; border: 0; background: #666} /************************************************** Ajax Popup **************************************************/ #popup{position: fixed;top: 50%;left: 50%;width: 600px;height: 500px;margin-top: -250px;margin-left: -300px;padding-top: 60px;z-index: 301;background: #fff;border-radius: 5px;overflow: hidden;box-sizing: border-box;opacity: 0;transition: all 0.3s;box-shadow: 0 0 10px rgba(0,0,0,0.1);} #popup .pop-tit{position: absolute;top: 0;left: 0;width: 100%;height: 60px;background: #6aaae4;padding: 0 15px;box-sizing: border-box;} #popup .pop-tit h3{font-size: 20px;color: #fff;font-weight: 500;line-height: 60px;} #popup .pop-tit .close{display: block;position: absolute;top: 0;right: 0;width: 60px;height: 60px;line-height: 60px;text-align: center;font-size: 24px;color: #fff;background: #6aaae4;} #popup .pop-wrap{height: 100%;overflow-y: auto;padding: 30px;box-sizing: border-box;} #popup.on{opacity: 1;} #popupBG{position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 300;background: rgba(0,0,0,0.5);opacity: 0;transition: all 0.3s;} #popupBG.on{opacity: 1;} #popup2 {position:fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width:100%; width:900px; background:#f7f7f7; z-index:301; padding: 0; box-sizing: border-box; opacity: 0} #popup2 .popClose {position: absolute; top: 25px; right: 25px; border: 0; background: none} #popup2 .tit {font-family: neo; font-weight: 800; font-size: 28px; line-height: 80px; color: #fff; letter-spacing: -1px; background: rgb(118,183,41); background: linear-gradient(310deg, rgba(118,183,41,1) 0%, rgba(0,157,61,1) 100%); text-align: center} #popup2 .wrap {border: 5px solid #009d3d; border-top: 0; padding: 30px; box-sizing: border-box; max-height: 500px; overflow-y: scroll} #popup2 .wrap ul {margin: -15px -10px} #popup2 .wrap ul:after {content: ''; display: block; clear: both} #popup2 .wrap ul li {display: inline-block; vertical-align: top; width: calc(100% / 3 - 20px); margin: 15px 10px} #popup2 .wrap ul li .thumb {padding-bottom: 70%; background-size: cover; background-repeat: no-repeat; background-position: center} #popup2 .wrap ul li p {margin-top: 15px; text-align: center; font-family: neo; font-weight: 700; font-size: 18px; line-height: 26px; color: #333} #popup2.on{opacity: 1;} #popupBG2{position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 300;background: rgba(0,0,0,0.5);opacity: 0;transition: all 0.3s;} #popupBG2.on{opacity: 1;} /* sitemap */ #popup .sitemap{ text-align: center; } #popup .sitemap > li{display: inline-block;width: 32%;vertical-align: top;margin-bottom: 10px;} #popup .sitemap > li > a{display: block;text-align: center;font-size: 14px;letter-spacing: -1px;background: #f7f7f7;font-weight: 500;line-height: 40px;border-radius: 3px;} #popup .sitemap > li ul li{border-top: 1px solid #f7f7f7;text-align: left;} #popup .sitemap > li ul li:first-child{border-top: none;} #popup .sitemap > li ul li a{display: block;font-size: 13px;color: #333;line-height: 18px;padding: 10px 0;text-align: center;} /************************************************** Main **************************************************/ #main{overflow: hidden} #main #content{ } #main #mainWrap{position: relative} #main #mainWrap .inner {position: relative; max-width: 1400px; margin: 0 auto} #main #mainWrap .title {} #main #mainWrap .title > * {font-family: neo} #main #mainWrap .title span {display: block; margin-bottom: 25px; font-weight: 900; font-size: 24px; line-height: 30px; color: #00a040; text-transform: uppercase} #main #mainWrap .title h5 {font-weight: 800; font-size: 60px; line-height: 70px; color: #222; letter-spacing: -0.5px} #main #mainWrap .title h5 strong {font-weight: inherit; color: #11a14a} #main #mainWrap .title p {margin-top: 50px; font-weight: normal; font-size: 22px; line-height: 36px; color: #333333} #main .visual{position: relative;} #main .visual .roll .item{position: relative;overflow: hidden;} /*#main .visual .roll .item img{position: relative;top: 0;left: 50%;margin-left: -900px;}*/ #main .visual .roll .item img{position: relative;top: 0;left: 50%;margin-left: -960px;} /*#main .visual .slick-dots {position: absolute;bottom: 265px;left: 140px; margin: 0 auto; z-index: 81}*/ #main .visual div {vertical-align: text-top;} #main .visual .slick-dots {position: absolute; bottom: 30px; left: 50%; margin: 0 auto; z-index: 81; transform: translate(-50%);} #main .visual .slick-dots li{display: inline-block; vertical-align: bottom; margin: 0 8px;padding: 10px 0;cursor: pointer;outline: none;} #main .visual .slick-dots li:first-child {margin-left: 0} #main .visual .slick-dots li button{display: block;width: 40px;height: 5px;background: #fff;text-indent: -999em;overflow: hidden;border: none;outline: none;} #main .visual .slick-dots li.slick-active button{height: 10px; background: #6aaae4;} #main .visual .slick-dots > a {display: inline-block; width: 9px; height: 12px; margin-right: 15px; cursor: pointer} #main .visual .slick-dots > a.pause {margin-left: 30px; background: url('../images/main/vis_pause_ico.png') no-repeat center / contain} #main .visual .slick-dots > a.play {background: url('../images/main/vis_play_ico.png') no-repeat center / contain} #main .visual .slick-photo{display: block; width: 100%; height: calc(100vh - 80px); position: relative;transform: scale(1.1);transition: all 3s;} #main .visual .slick-active .slick-photo {transform: scale(1);} #main .visual .slick-photo img{width: 100%; height: 100%; object-fit: cover;} #main .visual .slick-photo:after{content: ""; position: absolute; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3);} #main .visual .slick-txt{position: absolute; bottom: 20%; left: 13%; color: #fff; text-align: left; word-break: keep-all; width: 1400px;} #main .visual .slick-txt h4{font-size: 50px; font-weight: 600; line-height: 54px;} #main .visual .slick-txt .txt {margin-top: 20px;} #main .visual .slick-txt p{font-size: 26px; font-weight: 400; line-height: 34px;} /* 메인 리뉴얼 */ #main .visual .slick-txt .tit {overflow: hidden;} #main .visual .slick-txt .tit h4 {font-size: clamp(2.4rem, 2.222vw + 0.733rem, 5rem);} #main .visual .slick-txt .tit h4 span {transform: translate(0, 100%);transition: all 1s cubic-bezier(0.76, 0, 0.24, 1);display: inline-block;margin-right: clamp(0.5rem, 0.427vw + 0.179rem, 1rem);} #main .visual .slick-txt .tit h4 span:nth-child(2) {transition-delay: 0.1s;} #main .visual .slick-txt .tit h4 span:nth-child(3) {transition-delay: 0.2s;} #main .visual .slick-txt .tit h4 span:nth-child(4) {transition-delay: 0.3s;} #main .visual .slick-txt .tit h4 span:nth-child(5) {transition-delay: 0.4s;} #main .visual .slick-active .slick-txt .tit h4 span {transform: translate(0, 0);} #main .visual .slick-txt .txt {overflow: hidden;} #main .visual .slick-txt .txt p {font-size: clamp(1.4rem, 1.026vw + 0.631rem, 2.6rem);transform: translate(0, 100%);transition: transform 1s cubic-bezier(0.76, 0, 0.24, 1);transition-delay: 0.4s; } #main .visual .slick-active .slick-txt .txt p {transform: translate(0, 0);} @media screen and (max-width: 1400px) { #main .visual .slick-photo {height: calc(100vh - 60px);} } .mainSec{position: relative; padding: 100px 0;} .mainSec_tit{font-size: 3.125rem; font-weight: 700; text-align: center;} .mainSec_subTit{font-size: 32px; font-weight: 600; text-align: center;margin-top: 20px;} .mainSec_tap{margin: 50px 0;} .mainSec_tap ul{display: flex; align-items: center; justify-content: center; gap: 50px;} .mainSec_tap ul li{position: relative; padding-bottom: 20px;} .mainSec_tap ul li button{font-size: 1.375rem; font-weight: 600; color: #999; margin: 0; padding: 0;} .mainSec_tap ul li button:after{display: block; content: ''; width: 0; height: 2px; position: absolute; bottom: 10px; left: 50%; background: #6aaae4; transition: all 0.25s;} .mainSec_tap ul li:hover button, .mainSec_tap ul li.active button{color: #6aaae4;} .mainSec_tap ul li:hover button:after, .mainSec_tap ul li.active button:after{width: 100%; left: 0;} .mainSec_game_box{margin-top: 50px;} .mainSec_game_box ul{display: flex; flex-wrap: wrap; gap: 25px; position: relative;padding: 0 12%;} .mainSec_game_box ul li{width: calc(100% / 2 - 20px); border: 1px solid #ddd; border-radius: 12px; margin-bottom: 20px;} .mainSec_game_box ul li:nth-child(n+3){display: none;} .mainSec_game_list{padding: 20px;} .mainSec_game_gal{display: block; width: 100%; height: 270px; position: relative;} .mainSec_game_gal img{width: 100%; height: 100%; object-fit: cover; border-radius: 10px;} .mainSec_game_info{height: 150px; padding-top: 10px;} .mainSec_game_info span{display: inline-block; padding: 4px 8px; border-radius: 20px; font-size: 0.75rem; color: #fff; margin-bottom: 4px;} .mainSec_game_info h3{font-size: 1.25rem; font-weight: 600; letter-spacing: -0.5px; line-height: 26px; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .mainSec_game_info p{font-size: 1rem; font-weight: 300; letter-spacing: -0.5px; color: #999; margin-top: 8px;} .mainSec_game_info p:first-of-type{margin-top: 12px;} .mainSec_game_txt{padding: 10px 0 20px;} .mainSec_game_txt h3{font-size: 1.25rem; font-weight: 600; letter-spacing: -0.5px; line-height: 26px; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .mainSec_game_txt ul{display: flex; align-items: center; gap: 20px; margin-top: 20px;} .mainSec_game_txt ul li{font-size: 1rem; color: #999; position: relative; width: auto; border: none; margin: 0;} .mainSec_game_txt ul li:before{content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: -11px; width: 1px; height: 13px; background: #999;} .mainSec_game_txt ul li:first-child:before{display: none;} .mainSec_game_btn{display: flex; align-items: center; gap: 20px;} .mainSec_game_btn a{display: block; background: #6aaae4; width: 84px; height: 36px; border-radius: 4px; font-size: 1rem; color: #fff;position: relative;} .mainSec_game_btn a span {position: absolute;top: 50%;left: 0;transform: translate(0,-50%);width: 100%;text-align: center;z-index: 10;} .mainSec_game_btn a:after{content: '';display: block;position: absolute;top: 0;left: 0;width: 0%;height: 100%;background-color: #006ab5;transition: all 0.2s;border-radius: 4px;} .mainSec_game_btn a:hover:after{width: 100%;} .mainSec_more_btn{display: flex; align-items: center; justify-content: center; gap: 20px; margin-top: 30px;} .mainSec_more_btn a{display: block; background: #04599e; padding: 14px 40px; border-radius: 4px; font-size: 1.125rem; color: #fff;} .mainSec_benefit_box{margin-top: 50px;} .mainSec_benefit_box ul{display: flex; flex-wrap: wrap; gap: 25px; position: relative;} .mainSec_benefit_box ul li{width: calc(100% / 4 - 22px); border: 1px solid #ddd; background: #fff; border-radius: 12px;} .mainSec_benefit_list{display: flex; flex-direction: column; align-items: center; padding: 80px 20px;} .mainSec_benefit_list span{width: 50px; height: 50px; background: linear-gradient(130deg, #04599e 48%, #1a05b3); padding: 30px; border-radius: 50%; text-align: center;} .mainSec_benefit_list span img{width: 100%;} .mainSec_benefit_list h3{font-size: 1.25rem; font-weight: 600; line-height: 26px; letter-spacing: -0.5px; text-align: center; word-break: keep-all; margin-top: 30px;} .mainSec_benefit_list p{font-size: 1rem; font-weight: 300; line-height: 20px; letter-spacing: -0.5px; color: #999; text-align: center; word-break: keep-all; margin-top: 10px;} .mainSec_btn_more{position: absolute; top: 3px; right: 10px; background: #ddd; padding: 10px 11px; border-radius: 50%;} .mainSec_btn_more:hover img {transform: rotate(180deg);} .mainSec_btn_more img{width: 100%;transform: rotate(0);transition: all 0.3s;} .mainSec_notice_box{margin-top: 50px;} .mainSec_notice_box ul li{border-bottom: 1px solid #ddd; padding: 40px 20px;} .mainSec_notice_box ul li:first-child{border-top: 2px solid #ddd;} .mainSec_notice_box ul li a{display: block; position: relative;} .mainSec_notice_box ul li a p{font-size: 1.4rem; font-weight: 500; padding-right: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .mainSec_notice_box ul li a span{position: absolute; top: 50%; right: 20px; transform: translateY(-50%); font-size: 1.125rem; font-weight: 400; color: #999;} .mainSec_news_box{margin-top: 50px;} .mainSec_news_box ul{position: relative; width: 100%; overflow: hidden;} .mainSec_news_box ul li{display: block; float: left; padding: 7px; width: 33%; box-sizing: border-box;} .mainSec_news_box ul li a{display: block; background: #fff; border: 1px solid #ddd;} .mainSec_news_box ul li a img{width: 100%;} .mainSec_news_box{margin-top: 50px; position: relative;overflow: hidden;} .mainSec_news_box .block{position: relative; width: 100%; overflow: hidden;} .mainSec_news_box .block{display: block; float: left; padding: 7px; width: 25%; box-sizing: border-box;} .mainSec_news_box .block a{display: block; background: #fff; border: 1px solid #ddd;} .mainSec_news_box .block a img{width: 100%;height: auto;object-fit: scale-down;} .mainSec_news_info{padding: 30px 16px;} .mainSec_news_info .container, .mainSec_news_info .inner {height: 600px;overflow: hidden;} .mainSec_news_info em{font-size: 1rem; font-weight: 400; letter-spacing: -0.5px; color: #666;} .mainSec_news_info em span{margin-left: 10px;} .mainSec_news_info h3{font-size: 1.25rem; font-weight: 600; letter-spacing: -0.5px; line-height: 26px; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 20px;} .mainSec_news_info p{font-size: 1rem; font-weight: 300; line-height: 20px; letter-spacing: -0.3px; color: #999; text-overflow: ellipsis; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin-top: 12px;} .mainSec_photo_box{margin-top: 50px;} .mainSec_photo_box ul{display: flex; flex-wrap: wrap; gap: 25px; position: relative;} .mainSec_photo_box ul li{width: calc(100% / 3 - 20px); margin-bottom: 40px;} .mainSec_photo_box ul li a{display: block;} .mainSec_photo_box h3{font-size: 1.25rem; font-weight: 600; line-height: 26px; letter-spacing: -0.5px; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 10px;} .mainSec_photo_gal{display: block; width: 100%; height: 320px; position: relative;} .mainSec_photo_gal img{width: 100%; height: 100%; object-fit: cover; border-radius: 10px;} .mainSec_partner_box{margin-top: 50px;} /*.mainSec_partner_box ul{max-width: 1920px; width: 100%; animation: roll 50s linear infinite; white-space: nowrap;} .mainSec_partner_box ul li{padding: 0 26px; display: inline-block;}*/ .mainSec_partner_box ul{width: 1400px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 40px;} .mainSec_partner_box ul li{width: 17.5%;} .mainSec_partner_box ul li span{display: inline-block; width: 100%; height: 160px;} .mainSec_partner_box ul li span img{width: 100%; height: 100%; object-fit: cover;} .mainLankSec .inner {display: flex;gap:20px;} .mainLankSec .mainSec_tit {font-size: 32px;margin-bottom: 30px;} .LankSec .lb_score_name.member {background: url(/front/zones/img/plkmember_icon.png) 0 50% no-repeat;background-size: 20px;padding-left: 25px;} .mainSec_tournament .tournament_group:nth-child(1) {margin-bottom: 8%;} .mainSec_tournament .tournament_group:nth-child(1):after {content: '';display: block;width: 300px;height: 1px;background: #ddd;margin: 5% auto 0;} .mainSec_partner_box ul li img{height: 160px;} @keyframes roll { 0%{transform: translateX(0);} 100%{transform: translateX(-100%);} } /************************************************** Sub **************************************************/ #sub{overflow: hidden;} #sub #content{position: relative;width: 1400px;margin: 0 auto;padding: 120px 0; min-height: 600px;} #sub #content.pd0 {padding: 0 !important} .tabBox ~ #content {padding-top: 100px !important} #sub #content > *{} #sub .container{position: relative; width: 1400px; margin: 0 auto; padding: 120px 0;} #sub .sub-vis{position: relative;height: 240px;overflow: hidden;text-align: center;background-position: center center;background-size: cover;} #sub .sub-vis:before{position: relative;content: '';display: inline-block;vertical-align: middle;width: 0;height: 100%;} #sub .sub-vis h2{display: inline-block;vertical-align: middle;text-align: center;font-size: 35px;color: #fff;letter-spacing: -1px;z-index: 2;} #sub .sub-vis h2 em{display: block;margin-top: 10px;font-style: normal;font-size: 18px;font-weight: normal;} #sub .sub-tit, #sub .sub-tit2 {position: relative; padding-bottom: 100px} #sub .sub-tit > *, #sub .sub-tit2 > * {text-align: center} #sub .sub-tit.left > * {text-align: left} #sub .sub-tit h3, #sub .sub-tit2 h3{font-size: 60px; font-weight: 700; color: #222;} #sub .sub-tit p {margin-top: 30px; font-weight: normal; font-size: 22px; line-height: 36px; color: #777; letter-spacing: -1px} #sub .sub-tit.left p {margin-top: 40px} #sub .sub-tit .btns {display: inline-block; vertical-align: top; margin-left: 60px} #sub .sub-tit .btns a {display: inline-block; vertical-align: top; width: 260px; margin-right: 10px; font-family: neo; font-weight: 700; font-size: 22px; color: #fff; letter-spacing: -1px; text-align: center; line-height: 60px; border-radius: 31px; background: #00a040; text-decoration: none} .lnbWrap{width: 1400px; margin: 0 auto} #lnb{display: flex; flex-flow: row wrap; border: 1px solid #ddd; border-radius: 34px; margin: 100px 0} #lnb > li a{position: relative; display: block; text-align: center; font-weight: normal; font-size: 20px; line-height: 66px; color: #999999; text-decoration: none} #lnb > li a:after {content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 20px; background: #ddd; z-index: -1} #lnb > li.active a{margin: -1px; font-weight: 700; color: #fff; line-height: 68px; background: #6aaae4; border-radius: 34px} #status{position: absolute;bottom: 20px;right: 0;} #status > ul > li{display: inline-block;} #status > ul > li .spr{display: inline-block;vertical-align: middle;margin: 0 10px;color: #999;font-size: 11px;line-height: 11px;} #status > ul > li a{font-size: 13px;color: #999;text-decoration: none;} #status > ul > li:last-child a{color: #000;} #status > ul > li > ul{display: none;} #navigator{display: none; border: 1px solid #ddd;border-width: 1px 0 1px 0;} #navigator > ul{width: 1200px;position: relative;margin: 0 auto;border-left: 1px solid #ddd;box-sizing: border-box;background: #fff;} #navigator > ul > li{position: relative;display: inline-block;border-right: 1px solid #ddd;vertical-align: top;z-index: 89;} #navigator > ul > li > a{display: block;min-width: 200px;font-size: 15px;font-weight: 500;color: #333;text-decoration: none;padding: 0 60px 0 15px;line-height: 50px;background: url('/images/layout/ft-family-spr.png') no-repeat 95% center;} #navigator > ul > li:first-child a{min-width: 0;width: 50px;text-align: center;padding: 0;background: #f7f7f7;color: #888;font-size: 20px;} #navigator > ul > li > ul{position: absolute;top: 50px;left: -1px;width: 100%;border: 1px solid #ddd;visibility: hidden;opacity: 0;transition: all 0.2s;} #navigator > ul > li > ul li a{display: block;padding: 12px 15px;font-size: 15px;border-top: 1px solid #ddd;text-decoration: none;transition: all 0.3s;} #navigator > ul > li > ul li:first-child a{border-top: none;} #navigator > ul > li > ul li:hover a{background: #f7f7f7;} #navigator > ul > li.on > ul{background: #fff;visibility: visible;opacity: 1;} #navigator > ul > li > ul li.hidden-gnb{display: none;} .subTit{position: relative; padding: 15px 0 50px; letter-spacing: -0.5px;} .subTit:before{content: ''; position: absolute; top: 0; left: 0; width: 50px; height: 4px; background: #6aaae4;} .subTit h5{font-size: 34px; font-weight: 600; color: #222;} .subTit span{font-size: 16px; font-weight: 400; color: #222; display: block; margin-top: 10px;} .subTit em{font-size: 22px;} .subTit.tac:before {left: 50%; transform: translateX(-50%)} .subTit.tac h5 {text-align: center} .subTit p {margin-top: 35px; padding-top: 40px; border-top: 1px solid #ddd; font-family: neo; font-weight: normal; font-size: 24px; line-height: 40px; color: #777; letter-spacing: -1px} .subTit .moreBtn {position: absolute; top: 35px; right: 0; width: 300px; padding: 0 10px; box-sizing: border-box; border-top: 2px solid #cccccc; line-height: 60px; font-family: neo; font-weight: normal; font-size: 18px; color: #aaa; letter-spacing: -1px; text-align: left; text-decoration: none; transition: all .3s ease} .subTit .moreBtn:after {content: ''; position: absolute; top: 50%; right: 10px; transform: translateY(-50%); width: 8px; height: 8px; background: #cccccc; border-radius: 50%; transition: all .3s ease} .subTit .moreBtn:hover {color: #11a14a; border-color: #11a14a; transition: all .3s ease} .subTit .moreBtn:hover:after {background: #11a14a; transition: all .3s ease} .tabBox {max-width: 1400px; margin: 0 auto; margin-top: 100px} .allTab {display: flex; flex-flow: row wrap; border: 1px solid #ddd; border-radius: 34px} .allTab li {} .allTab.w25 li {flex: 1 25%} .allTab.w30 li {flex: 1 30%} .allTab.w50 li {flex: 1 50%} .allTab li a {position: relative; display: block; text-align: center; font-family: neo; font-weight: normal; font-size: 20px; line-height: 66px; color: #999999; text-decoration: none} .allTab li a:after {content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 1px; height: 20px; background: #ddd; z-index: -1} .allTab li.active a {margin: -1px; font-weight: 700; color: #fff; line-height: 68px; background: #00a040; border-radius: 34px} .fullBox {position: relative; top: 0; left: 50%; width: 1920px; height: 100%; margin-left: -960px} .fullBox .inner {max-width: 1400px; margin: 0 auto} .bgBox {padding: 100px 0; background: #f8f8f8} .logoBox {position: relative; padding: 140px 0; z-index: 1} .logoBox:before {content: ''; position: absolute; top: 115px; right: -10px; width: 840px; height: 200px; z-index: -1} .logoBox.gy:before {background: url('../images/sub/logo_box_bg.png') no-repeat center / contain} .logoBox.wt:before {background: url('../images/sub/logo_box_bg_wt.png') no-repeat center / contain} .stepBox {padding-top: 140px} .stepBox ul {background: #fff; border-top: 2px solid #11a14a; box-sizing: border-box} .stepBox ul.w16 {padding: 90px 45px; border: 8px solid #eeeeee; border-radius: 50px 50px 50px 0} .stepBox ul.w25 {padding: 50px 40px} .stepBox ul.w20 {padding: 85px 30px; border: 8px solid #eeeeee; border-radius: 50px 50px 50px 0} .stepBox ul li {position: relative; display: inline-block; vertical-align: top; text-align: center; z-index: 1} .stepBox ul.w16 li {width: 16.66%} .stepBox ul.w25 li {width: 25%} .stepBox ul.w20 li {width: 20%} .stepBox ul li:before, .stepBox ul li:after {content: ''; position: absolute; top: 154px; width: 50%; height: 1px; background: #ddd; z-index: -1} .stepBox ul.w16 li:before, .stepBox ul.w16 li:after {top: 156px} .stepBox ul li:before {left: 0} .stepBox ul li:after {right: 0} .stepBox ul li:first-child:before, .stepBox ul li:last-child:after {display: none} .stepBox ul li > * {font-family: neo} .stepBox ul li img {} .stepBox ul li span {display: block; margin: 30px auto; margin-bottom: 35px; width: 90px; line-height: 26px; background: #11a14a; border-radius: 13px; font-weight: 700; font-size: 12px; color: #fff} .stepBox ul li h6 {position: relative; padding-top: 45px; font-weight: 800; font-size: 26px; line-height: 34px; color: #222; letter-spacing: -0.5px; text-align: center} .stepBox ul li h6:before {content: ''; position: absolute; top: -8px; left: 50%; transform: translateX(-50%); width: 16px; height: 16px; background: url('../images/sub/step_dots.png') no-repeat center / contain} .stepBox ul li h6:after {content: ''; position: absolute; top: -6px; right: -6px; width: 12px; height: 11px; background: url('../images/sub/step_arrow.png') no-repeat center / contain} .stepBox ul li:last-child h6:after {display: none} .stepBox ul li h6 p {margin-top: 20px; font-family: inherit; font-weight: normal; font-size: 18px; line-height: 30px; color: #777; letter-spacing: -1px} .listBox {padding: 150px 0} .listBox ul {} .listBox ul li {display: inline-block; vertical-align: top; width: 50%} .topInfo {padding-bottom: 140px; text-align: right} .topInfo .thumb {padding-bottom: 36%; background-size: cover; background-repeat: no-repeat; background-position: center} .topInfo dl {display: inline-block; width: 1050px; margin-top: -130px; padding: 75px 0 0 100px; box-sizing: border-box; text-align: left; background: #fff} .topInfo dl > * {font-family: neo} .topInfo dt {position: relative; margin-bottom: 40px; padding-bottom: 35px; font-weight: 800; font-size: 42px; line-height: 50px; color: #333; letter-spacing: -0.5px; border-bottom: 1px solid #ddd} .topInfo dt a {position: absolute; top: -5px; right: 0; width: 260px; line-height: 60px; background: #00a040; border-radius: 30px; text-align: center; font-family: inherit; font-weight: 700; font-size: 22px; color: #fff; letter-spacing: -1px; text-decoration: none} .topInfo dd {font-weight: normal; font-size: 24px; line-height: 40px; color: #777; letter-spacing: -1px} .topInfo dd ul {margin-top: 50px; border-top: 2px solid #11a14a} .topInfo dd ul li {display: inline-block; vertical-align: top; width: 33.33%; padding: 60px 0 45px 0; border: 1px solid #ddd; border-width: 0 1px 1px 0; box-sizing: border-box; text-align: center} .topInfo dd ul li:last-child {border-right: 0} .topInfo dd ul li img {} .topInfo dd ul li strong {display: block; margin-top: 25px; font-family: neo; font-weight: 800; font-size: 26px; line-height: 34px; color: #11a14a; letter-spacing: -0.5px} .topInfo dd span {display: block; margin-top: 20px; font-family: inherit; font-weight: inherit; font-size: 15px; line-height: 26px; letter-spacing: -1px} .topInfo dd span.grn {color: #00a040} .topInfo dd ol {display: flex; flex-flow: row wrap; margin-top: 50px; padding-top: 50px; border-top: 2px solid #11a14a} .topInfo dd ol li {position: relative; box-sizing: border-box} .topInfo dd ol li:nth-child(odd) {width: 36%; padding-left: 120px} .topInfo dd ol li:nth-child(even) {width: 64%; padding-left: 190px} .topInfo dd ol li:after {content: ''; position: absolute; top: 50%; right: -1px; transform: translateY(-50%); width: 2px; height: 28px; background: #ddd} .topInfo dd ol li:last-child:after {display: none} .topInfo dd ol li > * {font-family: neo; line-height: 40px; letter-spacing: -0.5px} .topInfo dd ol li span {position: absolute; top: 0; margin: 0; padding-left: 35px; font-weight: 700; font-size: 18px; color: #999} .topInfo dd ol li:nth-child(odd) span {left: 0; background: url('../images/sub/cmp_tel_ico.png') no-repeat left center} .topInfo dd ol li:nth-child(even) span {left: 40px; background: url('../images/sub/cmp_mail_ico.png') no-repeat left center} .topInfo dd ol li a {font-weight: 800; font-size: 30px; color: #222; text-decoration: none; letter-spacing: 0} .mnvBox {position: relative; top: 0; left: 50%; width: 1680px; height: 100%; margin-left: -840px; padding: 150px 0; background: url('../images/sub/abs_sec02_bg.jpg') no-repeat center / cover} .mnvBox dl {display: flex; flex-flow: row wrap; max-width: 1400px; margin: 0 auto; background: #fff; border-top: 2px solid #11a14a; box-sizing: border-box} .mnvBox dl > * {width: 50%} .mnvBox dt {} .mnvBox dd {} .mnvBox dl .img {padding: 65px 0; text-align: center} .mnvBox dt .img {border-right: 1px solid #ddd; box-sizing: border-box} .mnvBox dl h6 {font-family: neo; font-weight: 800; font-size: 26px; color: #fff; letter-spacing: -0.5px; line-height: 65px; text-align: center} .mnvBox dt h6 {background: #7bc14a} .mnvBox dd h6 {background: #11a14a} /* .mnvBox .imgBox {padding-top: 25px; text-align: center} .mnvBox .imgBox img {} */ .idenBox {padding: 150px 0} .idenBox ul {display: flex; flex-flow: row wrap; border-top: 2px solid #11a14a} .idenBox ul li {flex: 1 30%; padding: 115px 0 75px 60px; box-sizing: border-box; border: 1px solid #ddd; border-width: 0 1px 1px 0; background-repeat: no-repeat; background-position: 90% 70px} .idenBox ul li:nth-child(3n) {border-right: 0} .idenBox ul li:last-child {position: relative; border-bottom: 0} .idenBox ul li .mid {} .idenBox ul li .mid > * {font-family: neo} .idenBox ul li .mid h6 {font-weight: 800; font-size: 30px; line-height: 40px; color: #222; letter-spacing: -0.5px} .idenBox ul li .mid h6 span {margin-left: 20px; font-family: inherit; font-weight: normal; font-size: 16px; color: #777} .idenBox ul li .mid h6 span b {font-weight: normal; color: #11a14a} .idenBox ul li .mid p {margin-top: 30px; font-weight: normal; font-size: 20px; line-height: 32px; color: #777; letter-spacing: -1px} .idenBox ul li > img {display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%)} .ciBox {padding-bottom: 90px} .ciBox dl {display: flex; flex-flow: row wrap; align-items: center; margin-top: 100px} .ciBox dl > * {width: calc(50% - 50px)} .ciBox dt {margin-right: 50px; padding: 105px 0; background: url('../images/sub/abs_ci_bg.jpg') no-repeat center / cover; border-top: 4px solid #11a14a; text-align: center} .ciBox dd {margin-left: 50px} .ciBox dd .mid {} .ciBox dd h6 {padding-bottom: 15px; font-family: neo; font-weight: 800; font-size: 30px; line-height: 40px; color: #222; letter-spacing: -0.5px; border-bottom: 1px solid #ddd} .ciBox dd p {font-family: neo; font-weight: normal; font-size: 24px; line-height: 40px; color: #777; letter-spacing: -1px} .ciBox dd .mid > p {margin: 25px 0 35px} .ciBox dd p strong {font-weight: 700; color: #11a14a} .ciBox dd ul {} .ciBox dd ul li {position: relative; margin-top: 20px; padding-left: 80px} .ciBox dd ul li img {position: absolute; top: 50%; left: 0; transform: translateY(-50%)} .ciBox dd ul li strong {display: block; margin-bottom: 5px; font-family: neo; font-weight: 700; font-size: 20px; letter-spacing: -1px; color: #333} .ciBox dd ul li p {font-family: neo; font-weight: normal; font-size: 17px; line-height: 30px; color: #777; letter-spacing: -1px} .ciBox dd ul li p span {font-family: inherit; font-weight: inherit; font-size: inherit; line-height: inherit; color: inherit; letter-spacing: inherit; margin-right: 15px} .ciBox ol {display: flex; flex-flow: row wrap; margin: 0 -50px} .ciBox ol li {width: calc(50% - 100px); margin: 0 50px} .ciBox ol li .img {position: relative; height: 380px; border: 1px solid #ddd; background: url('../images/sub/abs_logo_bg.jpg') no-repeat center / cover; box-sizing: border-box; text-align: center; padding: 155px 0} .ciBox ol li .img img {} .ciBox ol li p {margin-top: 25px; font-family: neo; font-weight: 800; font-size: 30px; line-height: 40px; color: #222; letter-spacing: -0.5px; text-align: center} .tblBox {} .tblBox .tbl {} .tblBox .tbl table {width: 100%; border-top: 4px solid #6aaae4;} .tblBox .tbl table tr > * {padding: 25px 10px; font-weight: 500; font-size: 20px; line-height: 30px; color: #666; letter-spacing: -1px; border: 1px solid #ddd; background: #fff; text-align: center; vertical-align: middle;} .tblBox .tbl table tr > *:first-child {border-left: 0} .tblBox .tbl table tr > *:last-child {border-right: 0} .tblBox .tbl table tr th {font-weight: 500; color: #333333; background: #f8f8f8} .tblBox .tbl table tr td {text-align: left;} .topBox {} .topBox img {border-radius: 50px 0 0 0} .besgBox {padding: 150px 0} .besgBox h5 {margin-bottom: 95px; padding-bottom: 35px; font-family: neo; font-weight: 800; font-size: 42px; line-height: 50px; color: #333; letter-spacing: -0.5px; border-bottom: 1px solid #ddd} .besgBox dl {display: flex; flex-flow: row wrap; align-items: center} .besgBox dl > * {width: 50%; box-sizing: border-box} .besgBox dt {padding-right: 50px; text-align: center} .besgBox dt img {} .besgBox dd {padding-left: 50px} .besgBox ul {} .besgBox ul li {margin-bottom: 70px} .besgBox ul li:last-child {margin-bottom: 0} .besgBox ul li h6 {font-family: neo; font-weight: 800; font-size: 30px; line-height: 40px; color: #222; letter-spacing: -0.5px} .besgBox ul li h6 span {display: block; margin-bottom: 10px; font-family: inherit; font-weight: inherit; font-size: 16px; line-height: 24px; color: #11a14a} .besgBox ul li p {margin-top: 20px; font-family: neo; font-weight: normal; font-size: 20px; line-height: 32px; color: #777; letter-spacing: -1.25px} .coreBox {position: relative; padding: 150px 0 100px 0} .coreBox:before {content: ''; position: absolute; top: 0; left: 50%; width: 1800px; height: 600px; margin-left: -800px; background: url('../images/sub/bnsn_core_bg.jpg') no-repeat center / contain; z-index: -1} .coreBox.wlogo {} .coreBox .img {position: relative} .coreBox .img img {} .coreBox.wimg .img .box {position: absolute; top: 0; left: 70px; z-index: 3} .coreBox .txt {position: relative; width: calc(100% - 100px); z-index: 1; margin-top: -60px; padding-top: 75px; background: #fff} .coreBox.wimg .txt {padding-top: 90px} .coreBox.wlogo .txt {background: #fff url('../images/sub/bnsn11_core_logo.png') no-repeat right top} .coreBox .txt h6 {} .coreBox .txt p {margin-top: 30px; font-family: neo; font-weight: normal; font-size: 20px; line-height: 34px; color: #777; letter-spacing: -1px} .coreBox .txt p span {display: block; font-family: inherit; font-weight: inherit; font-size: 15px; line-height: 26px; color: inherit; letter-spacing: inherit} .coreBox .txt p span.grn {color: #00a040} .coreBox2 {position: relative; padding: 150px 0} .coreBox2:before {content: ''; position: absolute; top: 0; left: 50%; width: 1920px; height: 100%; margin-left: -960px; background: url('../images/sub/bnsn_core2_bg.jpg') no-repeat center / cover; z-index: -1} .coreBox2.nBg:before {display: none} .coreBox2 .box {} .coreBox2 .box dl {display: flex; flex-flow: row wrap; align-items: center; margin-bottom: 80px; background: #fff} .coreBox2.nBg .box dl {background: #f8f8f8} .coreBox2 .box dl:last-child {margin-bottom: 0} .coreBox2 .box dl > * {width: 50%} .coreBox2 .box dt {} .coreBox2 .box dd {padding: 0 60px; box-sizing: border-box} .coreBox2 .box .mid {} .coreBox2 .box .mid h6 {font-family: neo; font-weight: 800; font-size: 30px; line-height: 40px; color: #222; letter-spacing: -0.5px} .coreBox2 .box .mid h6 span {display: block; margin-top: 30px; font-family: inherit; font-weight: normal; font-size: 20px; line-height: 34px; color: #777; letter-spacing: -1px} .coreBox2 .box .mid p {font-family: neo; font-weight: normal; font-size: 20px; line-height: 34px; color: #777; letter-spacing: -1px} .coreBox2 .box .mid p.br {margin-top: 40px; padding-top: 40px; border-top: 1px solid #ddd} .coreBox2 .box .mid p strong {font-weight: 800; color: #00a040} .coreBox2 .box dl:last-child .mid p strong {display: block; line-height: 40px} .coreBox2 .box .mid .tt {margin-top: 35px; padding-top: 45px; border-top: 1px solid #ddd; font-family: neo; font-weight: normal; font-size: 20px; line-height: 34px; color: #777; letter-spacing: -1px} .coreBox2 .box .mid .tt strong {display: inline-block; margin-bottom: 5px} .coreBox2 .box .mid .tt strong.grn {color: #00a040} .txtBox {padding: 100px 0} .txtBox:before {content: ''; position: absolute; top: 0; left: 50%; width: 1800px; height: 100%; max-height: 620px; margin-left: -960px; background: url('../images/sub/bnsn_txt_bg.jpg') no-repeat center / cover; z-index: -1} .txtBox dl {display: flex; align-items: center} .txtBox.right dl:nth-child(even) {margin-top: -70px} .txtBox.left dl {flex-flow: row wrap} .txtBox.right dl {flex-flow: row-reverse wrap} .txtBox.right dl:nth-child(even) {flex-flow: row wrap} .txtBox dl > * {width: 50%; box-sizing: border-box} .txtBox dt {} .txtBox.left dt {padding-right: 50px} .txtBox.right dt {padding-left: 50px} .txtBox.right dl:nth-child(even) dt {padding-left: 0; padding-right: 50px} .txtBox dt img {border-radius: 50px 0 50px 0} .txtBox.right dl:nth-child(even) dt img {border-radius: 0} .txtBox dd {} .txtBox.left dd {padding-left: 50px} .txtBox.right dd {padding-right: 50px} .txtBox.right dl:nth-child(even) dd {padding-right: 0; padding-left: 50px} .txtBox dd .mid {} .bnsn23 .txtBox.right dl:nth-child(odd) dd .mid {margin-top: -70px} .bnsn23 .txtBox.right dl:nth-child(even) dd .mid {padding-top: 190px} .txtBox dd h6 {} .txtBox dd p {margin-top: 35px; font-family: neo; font-weight: normal; font-size: 20px; line-height: 34px; color: #777; letter-spacing: -1.5px} .imgList {} .imgList .inner {position: relative} .imgList .inner .slick-arrow {position: absolute; top: 50%; transform: translateY(-50%); width: 37px; height: 73px; margin-top: -155px; text-indent: -9999em; border: 0} .imgList .inner .slick-prev {left: -50px; background: url('../images/sub/bnsn_prev_arrow.png') no-repeat center / contain} .imgList .inner .slick-next {right: -50px; background: url('../images/sub/bnsn_next_arrow.png') no-repeat center / contain} .imgList .inner > ul {margin: -50px} .imgList .inner .slick-track {margin-left: 0 !important} .imgList .inner > ul li {position: relative; width: calc(50% - 100px); margin: 50px} .imgList .inner > ul li > a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 10} .imgList .inner > ul li > * {font-family: neo} .imgList .inner > ul li img {} .imgList .inner > ul li .ico {position: absolute; top: 290px; right: 0} .imgList .inner > ul li .ico > a > img {border-radius: 30px 0 30px 0} .imgList .inner > ul li h6 {margin-top: 55px; font-weight: 800; font-size: 30px; line-height: 40px; color: #222; letter-spacing: -0.5px} .imgList .inner > ul li p {min-height: 102px; margin-top: 30px; font-weight: normal; font-size: 20px; line-height: 34px; color: #777; letter-spacing: -1px} .imgList .inner > ul li > span {position: relative; display: inline-block; margin-top: 45px; padding-right: 25px; font-weight: normal; font-size: 18px; line-height: 34px; color: #aaa; letter-spacing: -1px; text-decoration: none; transition: all .3s ease} .imgList .inner > ul li > span:after {content: ''; position: absolute; top: 50%; right: 0; transform: translateY(-50%); width: 8px; height: 8px; background: #cccccc; border-radius: 50%; transition: all .3s ease} .imgList .inner > ul li:hover > span {color: #00a040; transition: all .3s ease} .imgList .inner > ul li:hover > span:after {background: #00a040; transition: all .3s ease} .ptnBox {padding: 150px 0} .ptnBox ul {display: flex; flex-flow: row wrap; margin: -15px} .ptnBox ul li {width: calc(100% / 3 - 30px); margin: 15px} .ptnBox ul li .thumb {padding-bottom: 63.4%; background-size: cover; background-repeat: no-repeat; background-position: center} .ptnBox ul li img {width: 100%} .ptnBox ul li p {margin-top: 35px; font-family: neo; font-weight: 700; font-size: 25px; line-height: 34px; color: #222; letter-spacing: -0.5px; text-align: center} .inqBox {padding-top: 40px} .inqBox ul {display: flex; flex-flow: row wrap; margin: -15px} .inqBox ul li {width: calc(100% / 3 - 30px); margin: 15px; padding: 55px 0; border: 1px solid #ddd; box-sizing: border-box; text-align: center} .inqBox ul li > * {font-family: neo} .inqBox ul li.tel {} .inqBox ul li.mail {} .inqBox ul li.inq {} .inqBox ul li span {display: block; padding-top: 30px; font-weight: 700; font-size: 22px; line-height: 30px; color: #999; letter-spacing: -0.5px} .inqBox ul li.tel span {background: url('../images/sub/bnsn_tel_ico.png') no-repeat center top} .inqBox ul li.mail span {background: url('../images/sub/bnsn_mail_ico.png') no-repeat center top} .inqBox ul li.inq span {background: url('../images/sub/bnsn_inq_ico.png') no-repeat center top} .inqBox ul li a {display: inline-block; margin-top: 20px; font-weight: 800; font-size: 30px; line-height: 40px; color: #222; letter-spacing: -1px; text-decoration: none} .inqBox ul li.inq a {width: 200px; background: #11a14a; border-radius: 20px; font-weight: 700; font-size: 16px; color: #fff; letter-spacing: -1px} .result_date{display: flex; align-items: center; justify-content: center;} .result_date a img{width: 46px;} .result_date span{font-size: 2.4rem; font-weight: 600; padding: 0 20px;} .result_list{margin-top: 40px;} .result_list ul{display: flex; flex-wrap: wrap; justify-content: space-between;} .result_list ul li{width: 32%; margin-bottom: 20px;} .result_list ul li a{display: block;} .result_list_sum{display: block; width: 100%; height: 280px; position: relative;} .result_list_sum img{width: 100%; height: 100%; object-fit: cover; border-radius: 10px;} .result_list_hide{position: absolute; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6); border-radius: 10px;} .result_list_hide p{height: 100%; font-size: 3rem; font-weight: 600; color: #fff; display: flex; align-items: center; justify-content: center;} .result_list_txt{height: 80px; padding: 10px;} .result_list_txt p{font-size: 1.25rem; font-weight: 400; line-height: 26px;} .result_over_list ul li{margin-bottom: 50px;} .result_over_itembox{display: flex; align-items: center; justify-content: space-between; padding: 32px 16px; border: 1px solid #ddd; border-radius: 10px;} .result_over_item01{width: 10%;} .result_over_item01 img{height: 70px; border-radius: 6px;} .result_over_item02{width: 50%; font-size: 1.7rem; font-weight: 600; line-height: 36px; padding-left: 10px;} .result_over_item03{width: 10%; font-size: 1.125rem; font-weight: 400; text-align: center; padding: 0 50px;} .result_over_item04{width: 20%; font-size: 1.125rem; font-weight: 400; text-align: center; line-height: 24px; padding: 0 20px;} .result_over_item05{width: 10%; display: flex; justify-content: flex-end; padding-left: 40px;} .result_over_item05 a{display: inline-block; padding: 14px; background: #6aaae4; font-size: 1.125rem; font-weight: 400; color: #fff; text-align: center; border-radius: 4px;} .extra_wrap{width: 100%; height: 100vh; background: #04599e;} .extra_box{display: flex; justify-content: center; flex-direction: column; align-items: center; position: absolute; left: 0; top: 0; right: 0; bottom: 0;} .extra_box img{height: 260px;} .extra_btn{width: 100%; display: flex; align-items: center; justify-content: center; gap: 50px; margin-top: 120px;} .extra_btn a{display: block; background: #6aaae4; width: 30%; font-size: 24px; font-weight: 600; color: #fff; text-align: center; border-radius: 6px; padding: 20px 0;} .mem_btn{display: flex; align-items: center; justify-content: center; gap: 20px;} .mem_btn button, .mem_btn a {text-align: center;min-width: 150px; padding: 16px 0; color: #fff; font-size: 20px; font-weight: 600; border-radius: 30px;} #sb-list .list_tbl{width: 100%;border-top: 4px solid #6aaae4;} #sb-list .list_tbl tr > *{position: relative; padding: 25px 20px; border-bottom: 1px solid #dddee0; font-size: 18px; line-height: 24px; text-align: center; color: #666; letter-spacing: -1px; vertical-align: middle;} #sb-list .list_tbl tr.tr_notice{background: #f3f4f7;} #sb-list .list_tbl thead tr th{font-weight: 600; font-size: 20px; color: #222; letter-spacing: -1px; background: #f8f8f8;} #sb-list .list_tbl tbody tr td.no, #sb-list .list_tbl tbody tr td.date, #sb-list .list_tbl tbody tr td.view{} #sb-list .list_tbl tbody tr td.sbj{text-align: left;} #sb-list .list_tbl tbody tr td.sbj a{} #sb-list .list_tbl tbody tr td.sbj img{max-height:15px;width: auto;height: auto;} #sb-list .list_tbl tbody tr td.sbj .cmnt{font-weight: bold;color: #cb0f16;font-size: 12px;margin-left: 10px;} #sb-list .list_tbl tbody tr td em{display: none;} /* 참가신청서 대회 참가 비용 테이블 */ .entry_fee_tbl .point_input{width: 58%;height: 38px;font-size: 16px;} .entry_fee_tbl input[type="checkbox"] {width: 17px; height: 17px;vertical-align: middle;} .entry_fee_tbl .mem_info {display: flex;text-align: left;justify-content: center;align-items: center;gap: 18px;} .entry_fee_tbl .select_wrap select {font-size: 16px;height: 38px;width: 165px;} .entry_fee_tbl .select_wrap .mem_status {display: none;margin-top: 10px;} #sb-list .entry_fee_tbl .em {color: #f00;} #sb-form{} #sb-form .privacy {height: 120px; margin-bottom: 20px} #sb-form .privacy{height: 380px;overflow-y: scroll;background: #fff;border: 1px solid #eee;padding: 5px 15px 15px 15px;font-size: 13px;line-height: 18px;color: #666;margin-bottom: 20px; box-sizing: border-box} #sb-form .privacy > * {} #sb-form .privacy > * > * {font-family: inherit} #sb-form .privacy .privacy_txt{font-size: 1rem; font-weight: 300; line-height: 22px;} #sb-form .agree {font-size: 14px} #sb-form .agree input {width: 16px; height: 16px} #sb-form .agree{display: block;text-align: right; font-size: 16px; letter-spacing: -1px} #sb-form .agree input {width: 20px; height: 20px} #sb-form input[type=checkbox], #sb-wrap input[type=radio] {border: none; vertical-align: middle;} #sb-form .agree input#only_plk {margin: 0;vertical-align: text-bottom;margin-right: 5px;} .member_join h4 {font-size: 30px;font-weight: 500;margin-bottom: 100px;} #sb-form.join_form_chk {border: 1px solid #eee;border-top: 4px solid #6aaae4;padding: 30px;} #sb-form.join_form_chk .agree_item {margin-bottom: 20px;padding-left: 20px;} #sb-form.join_form_chk .agree_item:nth-child(1) {padding-left: 0;} #sb-form.join_form_chk .agree_item .group {display: flex;align-items: center;} #sb-form.join_form_chk .agree_item .agree {text-align: left; display: flex;width: 80%;gap: 5px;align-items: flex-start; } #sb-form.join_form_chk .agree_item label {width: 100%;line-height: 20px;font-size: 16px;} #sb-form.join_form_chk .agree_item input {margin: 0;} #sb-form.join_form_chk .agree_item .agree em {color: #CE0000;} #sb-form.join_form_chk .agree_item .agree_more {border-bottom: 1px solid #333;margin-left: auto;cursor: pointer;} #sb-form.join_form_chk .agree_item .privacy {display: none;margin-top: 10px;} #sb-form.join_form_chk .privacy_info {border-top: 1px solid #eee;padding-top: 30px;padding-left: 30px;line-height: 24px;font-size: 1rem;} #sb-form.join_form_chk .privacy_info a {border-bottom: 1px solid #000;} /* 이용약관 버전 관리 */ .terms_box {display: flex;justify-content: space-between;align-items: baseline;} .terms_history {line-height: 20px;font-size: 14px;position: relative;} .terms_history .history_tit {display: block;width: 110px; box-sizing: border-box; color: #666;cursor: pointer;position: relative; z-index: 10; background: #fff; border: 1px solid #dbdbdb; padding: 8px; border-radius: 6px;} .terms_history .history_tit img {width: 10px;position: absolute;top: 14px;right: 8px;transition: all 0.2s;} .terms_history.on .history_tit img {transform: rotate(180deg);} .terms_history .history_btn {display: none;border: 1px solid #dbdbdb; padding: 10px;width: 110px; border-radius: 6px;position: absolute;top: 32px; left: 0;background: #fff;} /* .terms_history.on .history_btn {display: block;} */ .terms_history .history_btn span {color: #0600ff;border-bottom: 1px solid #0600ff;cursor: pointer;white-space: nowrap;display: block;} .version_popup {display: none;border-radius: 10px;border: 1px solid #CCC;background: #FFF;box-shadow: 1px 1px 40px 0px rgba(0, 0, 0, 0.35);position: fixed;top: 13%;left: 50%;transform: translate(-50%, 0);max-width: 92%;width: 526px; z-index: 100;} .version_popup .popup_header {border-bottom: 1px solid #ccc;padding: 3% 5%;} .version_popup h6 {font-weight: 500;width: 80%;line-height: 20px;} .version_popup .popup_content {font-size: 14px;line-height: 18px;padding: 4% 5%;height: 70vh;overflow: auto;} .version_popup .popup_close {position: absolute;top: 13px;right: 15px;cursor:pointer;} .version_popup .popup_close img {width: 22px;} .tbl_star{color: #f20b48; margin-left: 3px;} .tbl_form{display: flex; align-items: center; gap: 6px;} .tbl_form_pl{display: flex; flex-direction: column; gap: 6px;} .tbl_btn{height: 54px; padding: 0 20px; color: #fff; font-size: 16px; font-weight: 600; word-break: keep-all;white-space: nowrap;} input[type="text"]{width: 100%; height: 54px; padding: 0 10px; font-size: 18px; font-weight: 400; color: #666; letter-spacing: -1px; border: 1px solid #ddd; border-radius: 0; box-sizing: border-box;} input[type="password"]{width: 100%; height: 54px; padding: 0 10px; font-size: 18px; font-weight: 400; color: #666; letter-spacing: -1px; border: 1px solid #ddd; border-radius: 0; box-sizing: border-box;} select{width: 100%; height: 54px; padding: 0 10px; font-size: 18px; font-weight: 400; color: #666; letter-spacing: -1px; border: 1px solid #ddd; box-sizing: border-box; background: #fff;} textarea{width: 100%; height: 200px; padding: 10px; font-size: 18px; font-weight: 500; color: #666; letter-spacing: -1px; border: 1px solid #ddd; border-radius: 0; box-sizing: border-box;} .tbl_form input[type="radio"] {display:none;} .tbl_form input[type="radio"] + label{padding-left:25px; display:inline-block; height:20px; background:url(/front/zones/img/ico_radio.png) no-repeat; background-size: 20px 40px; background-position: 0 0; font-size:20px; line-height:20px; color:#333;} .tbl_form input[type="radio"]:checked + label {background-position: 0 -20px;} input[type="text"].regist_num01 {width: 44%;} input[type="text"].regist_num02 {width: 40px;text-align: center;} input.readonly {background: #f7f7f7;} input.readonly {background: #f7f7f7;} input[type="radio"].readonly + label {background:url(/front/zones/img/ico_radio_readonly.png) no-repeat;background-size: 20px 40px; background-position: 0 0;} .common_tbl_star{color: #f20b48; margin-left: 3px;} .common_tbl_form{display: flex; align-items: center; gap: 6px;} .common_tbl_form_pl{display: flex; flex-direction: column; gap: 6px;} .common_tbl_btn{height: 54px; padding: 0 20px; color: #fff; font-size: 16px; font-weight: 600; word-break: keep-all;} .common_tbl_form input[type="radio"] {display:none;} .common_tbl_form input[type="radio"] + label{padding-left:25px; display:inline-block; height:20px; background:url(/front/zones/img/ico_radio.png) no-repeat; background-size: 20px 40px; background-position: 0 0; font-size:20px; line-height:20px; color:#333;} .common_tbl_form input[type="radio"]:checked + label {background-position: 0 -20px;} .common_tbl_w{width: 100%; border-top: 4px solid #6aaae4;} .common_tbl_w tr > *{font-size: 1.25rem; font-weight: 500; line-height: 30px; color: #666; letter-spacing: -1px; border: 1px solid #ddd; background: #fff; text-align: center; vertical-align: middle; padding: 25px 10px;} .common_tbl_w tr > *:first-child{border-left: none;} .common_tbl_w tr > *:last-child{border-right: none;} .common_tbl_w tr th{font-weight: 500; color: #333; background: #f8f8f8;} .common_tbl_w tr td{text-align: left;} .common_tbl_h{width: 100%; border-top: 4px solid #6aaae4;} .common_tbl_h tr > *{font-size: 1.125rem; line-height: 24px; text-align: center; color: #666; letter-spacing: -1px; vertical-align: middle; padding: 25px 20px; border-bottom: 1px solid #ddd; position: relative;} .common_tbl_h thead tr th{font-size: 1.25rem; font-weight: 600; color: #222; letter-spacing: -1px; background: #f8f8f8;} .common_searchbox{display: flex; justify-content: flex-end; gap: 10px; margin-bottom: 30px;} .common_searchbox select{width: 180px;} .common_search{display: flex; align-items: center;} .common_search input{width: 400px;} .common_search button{width: 90px; height: 54px; background: #333 url(/front/zones/img/ico_sch.png) no-repeat center center; background-size: 26px 26px;} .common_viewbox{display: flex; flex-direction: column; border-top: 4px solid #6aaae4;} .common_view_tit{display: flex; flex-direction: column; padding: 40px 0; border-bottom: 1px solid #ddd;} .common_view_tit h3{font-size: 2rem; font-weight: 600; line-height: 40px; text-align: center;} .common_view_tit ul{display: flex; align-items: center; gap: 20px; margin-top: 30px;} .common_view_tit ul li{font-size: 1rem; color: #666; position: relative;} .common_view_tit ul li:before{content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: -11px; width: 1px; height: 13px; background: #999;} .common_view_tit ul li:first-child:before{display: none;} .common_view_con{font-size: 1.125rem; line-height: 28px; padding: 40px 0; border-bottom: 1px solid #ddd;} .common_view_con img{max-width: 100%;height: auto;} .common_view_btn{display: flex; align-items: center; justify-content: center; margin-top: 50px;} .common_view_btn a{display: block; background: #04599e; padding: 14px 40px; border-radius: 4px; font-size: 1.125rem; color: #fff;} .mem_txt_end{display: flex; align-items: center; flex-direction: column;} .mem_txt_end img{width: 10%;} .mem_txt_end p{font-size: 40px; font-weight: 700; line-height: 50px; text-align: center; margin: 30px 0;} .mem_txt_end span{font-size: 20px; font-weight: 400; line-height: 24px; text-align: center;} .lb_txtbox{background: #eee; padding: 30px 0; text-align: center;} .lb_txtbox h7{font-size: 40px; font-weight: 600; margin-bottom: 10px; display: block;} .lb_txtbox p{font-size: 30px; font-weight: 600; margin-bottom: 16px; display: block;} .lb_txtbox span{font-size: 24px; font-weight: 500; display: block;} .lb_schbox{display: flex; align-items: center; width: 100%;} .lb_schbox button{width: 90px; height: 54px; background: #333 url(/front/zones/img/ico_sch.png) no-repeat center center; background-size: 26px 26px;} /* 마이페이지 포인트 랭킹 */ .score_tbl_tab {display: flex;text-align: center;} .score_tbl_tab li {font-size: 18px;color: #222;min-width: 125px;padding: 15px 10px;background: #eee;cursor: pointer;transition: all 0.2s;} .score_tbl_tab li.active, .score_tbl_tab li:hover {background: #6aaae4;color: #fff;} .point_rank_box .lb_score_tbl{display: none;} .point_rank_box .lb_score_tbl.active{display: table;} .point_rank_box .lb_score_tbl .point_color {color: #6aaae4;} .lb_scorebox{width: 100%; margin-top: 100px;} .lb_score_tbl{width: 100%; border-top: 4px solid #6aaae4;} .lb_score_tbl caption{text-align: left;font-weight: 600;margin-bottom: 10px;} .lb_score_tbl tr > *{position: relative; padding: 25px 10px; border-bottom: 1px solid #ddd; font-size: 18px; line-height: 24px; text-align: center; color: #666; letter-spacing: -1px; vertical-align: middle; background: #fff;} .lb_score_tbl thead tr th{font-weight: 600; font-size: 18px; color: #222; letter-spacing: -1px; background: #F4F7FD;} /* .lb_score_w01{width: 3%;} .lb_score_w02{width: 5%;} .lb_score_w03{width: 15%;} .lb_score_w05{width: 6%;} */ .lb_score_w01{width: 6%;} .lb_score_w02{width: 7%;} .lb_score_w03{width: 10%;} .lb_score_w05{width: 6%;} .lb_score_w06{width: 18%;} .lb_score_w07{width: 20%;} .point_rank_tbl .lb_score_w03{width: 14%;} .lb_score_step{display: flex; align-items: center; justify-content: center; gap: 2px;} .lb_score_step_chart{display: flex; align-items: center;} .lb_score_step_chart img{height: 16px;} .lb_score_step_num{font-size: 14px;} .lb_score_txt{display: flex; align-items: center;gap: 16px;text-align: left; cursor: pointer;} .lb_score_name{font-size: 20px; font-weight: 600;position: relative;} .lb_score_name .item {padding-left: 25px;} .lb_score_name .item:first-child {margin-bottom: 3px;} .lb_score_name .item.member{background: url(/front/zones/img/plkmember_icon.png) 0 50% no-repeat;background-size: 20px;} .lb_score_name i{position: absolute;top: 16px;left: 130px;} .lb_score_area{font-size: 16px; font-weight: 300;} .lb_score_parbox{width: 100%;} .lb_score_round{background: #f4f6f7; color: #333; padding: 20px 0; border-bottom: 1px solid #222;} .lb_score_round ul{display: flex; align-items: center; justify-content: center; gap: 20px;} .lb_score_round ul li a{display: block; font-size: 18px; padding: 4px 20px; border: 1px solid #666; border-radius: 20px; color: #666; background: #fff;} .lb_score_round ul li.on a{background: #6aaae4; border: 1px solid #6aaae4; color: #fff;} .lb_score_time{display: block; font-size: 16px; margin-top: 20px;} .lb_score_par{display: flex; align-items: center;} .lb_score_info{display: flex; flex-direction: column; padding: 0 12px;} .lb_score_infobox_m{width: 100%; /*border-bottom: 1px solid #ddd;*/} .lb_score_info_m{display: flex; align-items: center; justify-content: center; flex-direction: row; gap: 20px; padding: 20px;} .lb_score_photo{width: 100px; height: 100px; border-radius: 50%;} .lb_score_photo span img{width: 100%; height: 100%; object-fit: cover; border-radius: 50%;} .lb_score_pl{margin-top: 10px; display: flex; flex-direction: column; gap: 2px;} .lb_score_pl_name{font-size: 18px; font-weight: 600;white-space: nowrap;padding-left: 25px;cursor: pointer;} .lb_score_pl_name.member{background: url(/front/zones/img/plkmember_icon.png) 0 50% no-repeat;background-size: 20px;} .program_view h6 {text-align: center;font-size: 40px;font-weight: 600;margin-bottom: 30px;} .program_view h6 img {width: 30px;} .program_view .file_down {text-align: right;} .program_view .file_down a {display: inline-block;margin: 3px;border: 1px solid #000;border-radius: 6px;padding: 10px;font-weight: 700;} .program_view .file_down img {vertical-align: middle;} .program_view .leaderboard_img {margin-top: 50px;text-align: center;} .program_view .leaderboard_img img {width: 100%;} .program_view .cutoff td {background: #22c388;color: #fff;padding: 15px 10px;} @media screen and (max-width: 750px) { .program_view h6 {font-size: 1.25rem;} .program_view h6 img {width: 17px;} .program_view .file_down {text-align: left;} .program_view .file_down a {font-size: 0.875rem;padding: 3px 5px;} .program_view .file_down img {width: 20px;} .program_view .cutoff td {padding: 5px 10px;} .lb_score_tbl caption {font-size: 14px;} } @media screen and (max-width: 497px) { .program_view .file_down a {width: calc(100% - 15px);} } ._detail_view {cursor: pointer;} .lb_score_pl_area{font-size: 16px; font-weight: 300;} .lb_score_par_pc{display: flex; align-items: center;} .lb_score_par_m{display: none;} .lb_score_detail_tbl_m{width: 100%;} .lb_score_detail_tbl_m tbody:first-child td:last-child{display: none;} .lb_score_detail_tbl_m tr > *{position: relative; border-bottom: 1px solid #ddd; font-size: 1rem; padding: 0; text-align: center; letter-spacing: 0; vertical-align: middle; width: auto;} .lb_score_detail_tbl_m tr th{width: 10%; font-size: 0.688rem; color: #333; padding: 0 4px; background: #f8f8f8; border-right: 1px solid #666;} .lb_score_detail_tbl_m tr th div{display: flex; align-items: center; justify-content: center;} .lb_score_detail_tbl_m tr td{background: #eee; font-size: 0.75rem; padding: 0 2px;} .lb_score_detail_tbl_m tr td div{height: 40px; display: flex; align-items: center; justify-content: center;} .lb_score_detail_tbl_m tr td div span{width: 15px; height: 15px; line-height: 15px;} .lb_score_detail_tbl_m tr:last-child td{background: #fff;} .lb_score_fix_tit_m{background: #04599e !important; color: #fff !important; border-left: 1px solid #333;} .lb_score_fix_tit_m div span{width: auto !important;} .lb_score_fix_txt_m{background: #333 !important; color: #fff !important; border-left: 1px solid #333;} .lb_score_detail_tbl_m tr td.lb_score_fix_tit_m {width: 16%;} .lb_score_detail_tbl_m tr td.lb_score_fix_tit_m span {font-size: 11px;} .lb_score_detail_tbl{width: 100%;} .lb_score_detail_tbl tr > *{position: relative; border-bottom: 1px solid #666; font-size: 16px; padding: 0; text-align: center; letter-spacing: 0px; vertical-align: middle; width: auto;} .lb_score_detail_tbl tr th{width: 90px; background: #f8f8f8; border-left: 1px solid #666; border-right: 1px solid #666;} .lb_score_detail_tbl tr th div{height: 64px; display: flex; align-items: center; justify-content: center;font-size: 15px;} .lb_score_detail_tbl tr th div span{width: auto;} .lb_score_detail_tbl tr td{width: auto; background: #eee;} .lb_score_detail_tbl tr td div{height: 64px; display: flex; align-items: center; justify-content: center;} .lb_score_detail_tbl tr td div span{width: 35px; height: 35px; line-height: 35px;font-size: 15px;} .lb_score_detail_tbl tr:last-child td{background: #fff;} .lb_score_fix_tit{background: #04599e !important; color: #fff !important; border-left: 1px solid #333; width: 95px !important;} .lb_score_detail_tbl tr td.lb_score_fix_tit div span {width: 85px;white-space: nowrap;} .lb_score_fix_txt{background: #333 !important; color: #fff !important; border-left: 1px solid #333;} .lb_score_board{width: 100%;} .lb_score_parlist{background: #fff; padding: 20px 0px; color: #333;} .lb_score_parlist > ul{display: flex; align-items: center; justify-content: center; gap: 50px;} .lb_score_parlist > ul li{display: flex; align-items: center; font-size: 0.875rem;} .lb_score_parlist > ul li:first-child:before{content: ""; display: inline-block; border-width: 4px; width: 7px; height: 7px; border-radius: 8px; border-style: double; margin-right: 4px; color: #00AA33;} .lb_score_parlist > ul li:nth-child(2):before{content: ""; display: inline-block; border-width: 1px; width: 14px; height: 14px; border-radius: 15px; border-style: solid; margin-right: 4px; color: #00AA33;} .lb_score_parlist > ul li:nth-child(3):before{content: ""; display: inline-block;} .lb_score_parlist > ul li:nth-child(4):before{content: ""; display: inline-block; border-width: 1px; width: 14px; height: 14px; border-style: solid; margin-right: 4px; color: #00AA33;} .lb_score_parlist > ul li:nth-child(5):before{content: ""; display: inline-block; border-width: 4px; width: 7px; height: 7px; border-style: double; margin-right: 4px; color: #00AA33;} .lb_score_eg{border-width: 4px; width: 12px; height: 12px; border-radius: 40px; border-style: double; border-color: #00AA33;} .lb_score_bd{border-width: 1px; width: 19px; height: 19px; border-radius: 40px; border-style: solid; border-color: #00AA33;} .lb_score_p{} .lb_score_b{border-width: 1px; width: 19px; height: 19px; border-style: solid; border-color: #00AA33;} .lb_score_db{border-width: 4px; width: 12px; height: 12px; border-style: double; border-color: #00AA33;} .lb_tapbox{display: flex; align-items: center; justify-content: space-between; gap: 200px;} .lb_tap{display: table; width: 100%; margin: 80px 0;} .lb_tap > ul{display: flex; width: 100%; background: #eee; border-radius: 30px;} .lb_tap > ul li{width: 50%;} .lb_tap > ul li a{display: flex; align-items: center; justify-content: center; color: #000; padding: 20px 0; font-size: 1.125rem; font-weight: 500;} .lb_tap > ul li.active a{display: flex; align-items: center; justify-content: center; color: #fff; background: #6aaae4; border-radius: 30px;} .lb_tapbox02{display: flex; align-items: center; justify-content: space-between; gap: 200px;} .lb_tap02{display: table; width: 100%; margin-bottom: 70px;} .lb_tap02 > ul{display: flex; width: 100%; background: #eee; border-radius: 30px;} .lb_tap02 > ul li{width: 50%;} .lb_tap02 > ul li a{display: flex; align-items: center; justify-content: center; color: #000; padding: 20px 0; font-size: 1.3rem; font-weight: 500;} .lb_tap02 > ul li.active a{display: flex; align-items: center; justify-content: center; color: #fff; background: #6aaae4; border-radius: 30px;} .lb_tap03{display: table; width: 100%;} .lb_tap03 > ul{display: flex; width: 100%; background: #eee; border-radius: 30px;} .lb_tap03 > ul li{width: 50%;} .lb_tap03 > ul li a{display: flex; align-items: center; justify-content: center; color: #000; padding: 20px 0; font-size: 1.3rem; font-weight: 500;} .lb_tap03 > ul li.active a{display: flex; align-items: center; justify-content: center; color: #fff; background: #6aaae4; border-radius: 30px;} .lb_tap04{margin-bottom: 100px;} .lb_tap04 > ul{display: flex; flex-wrap: wrap; justify-content: center; gap: 20px;} .lb_tap04 > ul li a{display: flex; align-items: center; justify-content: center; color: #000; background: #eee; padding: 20px 40px; border-radius: 30px; font-size: 1.3rem; font-weight: 500;} .lb_tap04 > ul li.active a{color: #fff; background: #6aaae4;} .prog_list{margin-top: 40px;} .prog_list ul{display: flex; flex-wrap: wrap; gap: 25px; position: relative;} .prog_list ul li{width: calc(100% / 3 - 20px); border: 1px solid #ddd; border-radius: 12px; margin-bottom: 40px;} /*.prog_list ul li:after{content: ""; background: rgba(0, 0, 0, 0.4); width: calc(100% / 3 - 20px); height: 490px; position: absolute; top: 0; left: 0; border-radius: 12px;}*/ .prog_list ul li a{display: block; padding: 20px;} .prog_list_sum{display: block; width: 100%; height: 250px; position: relative;} .prog_list_sum img{width: 100%; height: 100%; object-fit: cover; border-radius: 10px;} .prog_list_state{display: inline-block; font-size: 1rem; color: #fff; padding: 6px 10px; margin: 10px 0;} .st01{background: #f5a33c;} .st02{background: #6aaae4} .st03{background: #bbb;} .st04{background: #00aa33;} .st05{background: #666;} .prog_list_txt{height: 150px; padding: 10px 0; border-top: 1px solid #ddd;} .prog_list_txt p{font-size: 1.25rem; font-weight: 600; line-height: 26px; margin-bottom: 10px;} .prog_list_txt ul{display: flex; flex-direction: column; justify-content: space-between; gap: 0;} .prog_list_txt ul li{width: auto; padding: 0; border: none; border-radius: 0; margin-bottom: 8px; display: flex; align-items: center; gap: 10px;} /*.prog_list_txt ul li:after{content: none;}*/ .prog_list_ico img{width: 16px;} .prog_list_info{font-size: 1rem; font-weight: 300; color: #999;} .prog_list02{margin-top: 40px;} .prog_list02 ul{display: flex; flex-wrap: wrap; justify-content: space-between;} .prog_list02 ul li{width: 32%; border: 1px solid #ddd; border-radius: 12px; margin-bottom: 40px;} .prog_list_wordarea{} .prog_list_wordarea ul{display: flex; flex-direction: column; justify-content: space-between;} .prog_list_wordarea ul li{width: auto; padding: 0; border: none; border-radius: 0; margin-bottom: 8px; display: flex; align-items: center; gap: 10px;} .prog_list_wordbox{} .prog_list_word01{} .prog_list_word02{} .prog_list_word03{} .prog_infobox{margin-bottom: 100px;} .prog_info dl{display: flex; gap: 20px; font-size: 18px; margin-bottom: 14px;} .prog_info dl dt{width: 76px; color: #999;} .prog_noti_txt{display: inline-block; font-size: 0.913rem; color: #999; border: 1px solid #999; padding: 6px; margin-top: 10px;} .prog_menual dl{margin-top: 100px;} .prog_menual dl:first-child{margin-top: 0;} .prog_menual dl dt{display: flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 600; margin-bottom: 30px;} .prog_menual dl dt span{width: 26px; height: 26px; line-height: 26px; background-color: #04599e; font-size: 16px; color: #fff; border-radius: 50%; text-align: center;} .prog_menual dl dd{font-size: 18px; line-height: 28px;} .prog_banner ul{display: flex; flex-wrap: wrap; gap: 50px;} .prog_banner ul li{width: calc(100% / 5 - 40px); height: 150px;} .prog_banner ul li img{width: 100%; height: 100%; object-fit: cover;} .prog_tit_area{background: #e4eef7; padding: 60px; display: flex; align-items: center; gap: 30px; margin-bottom: 100px;} .prog_tit_gal{width: 300px; height: 200px;} .prog_tit_area img{width: 100%; height: 100%; object-fit: cover; border-radius: 12px;} .prog_tit_name{display: flex; flex-direction: column; gap: 10px; align-items: flex-start;} .prog_tit_name p{font-size: 2.8rem; font-weight: 500;} .prog_tit_name span{font-size: 1.8rem; font-weight: 500;} .prog_tit_name a{background: #22c388; padding: 16px 20px; font-size: 1.4rem; color: #fff; text-align: center; border-radius: 10px; margin-top: 20px;} .prog_team_schbox{display: flex; align-items: center; justify-content: space-between; margin-bottom: 100px;} .prog_team_tap{margin: 50px 0;} .prog_team_tap ul{display: flex; align-items: center; justify-content: center; gap: 50px;} .prog_team_tap ul li{position: relative; padding-bottom: 20px;} .prog_team_tap ul li button{font-size: 1.3rem; font-weight: 600; color: #999; margin: 0; padding: 0;} .prog_team_tap ul li button:after{display: block; content: ''; width: 0; height: 2px; position: absolute; bottom: 10px; left: 50%; background: #6aaae4; transition: all 0.25s;} .prog_team_tap ul li:hover button, .prog_team_tap ul li.active button{color: #6aaae4;} .prog_team_tap ul li:hover button:after, .prog_team_tap ul li.active button:after{width: 100%; left: 0;} .prog_team_selbox{display: flex; justify-content: flex-end; gap: 20px;} .prog_team_selbox select{width: 180px;} .prog_team_selbox input{width: 300px;} .prog_team_list ul{display: flex; flex-wrap: wrap; align-items: flex-start;} .prog_team_list ul li{width: 12.5%; margin-bottom: 70px;} .prog_team_list ul li a{display: flex; flex-direction: column; align-items: center;} .prog_team_sum{display: block; width: 110px; height: 110px; border-radius: 50%; position: relative;} .prog_team_sum span img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;} .prog_team_info{text-align: center;} .prog_team_info p:first-child{font-size: 1.2rem; font-weight: 600; color: #666; margin-top: 14px;} .prog_team_info .prog_team_name {font-size: 1.12rem; font-weight: 600; line-height: 24px; margin-top: 10px;text-align: left;} .prog_team_info .prog_team_name .item {padding-left: 25px;} .prog_team_info .prog_team_name .item.member {background: url(/front/zones/img/plkmember_icon.png) 0 50% no-repeat;background-size: 20px;} .prog_team_info p:nth-child(3){font-size: 1rem; margin-top: 10px;} .prog_team_info .plk_member_ico {width: 20px;vertical-align: text-top;} .lank_searchbox {justify-content: space-between;margin-bottom: 17px;margin-top: 17px;} .prog_play_area{display: flex; justify-content: center; gap: 70px;} .prog_play_info_l{display: flex; flex-direction: column; align-items: center;} .prog_play_sum{display: block; width: 150px; height: 150px; border-radius: 50%; position: relative;} .prog_play_sum span img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;} .prog_play_info_l p:first-of-type{font-size: 1.8rem; font-weight: 600; margin-top: 14px;} .prog_play_info_l p:first-of-type.member{background: url(/front/zones/img/plkmember_icon.png) 0 50% no-repeat;background-size: 25px;padding-left: 30px;} .prog_play_info_l p:nth-of-type(2){font-size: 0.875rem; color: #fff; background: #44cd75; padding: 4px 12px; border-radius: 20px; margin-top: 7px;} .prog_play_mark01{position: absolute; bottom: 0; left: 6px; z-index: 2; width: 40px; height: 40px; padding: 0;} .prog_play_mark01 img{width: 100%;} .prog_play_mark02{position: absolute; bottom: 0; right: 6px; z-index: 2; width: 40px; height: 40px; padding: 0;} .prog_play_mark02 img{width: 100%;} .prog_play_info_r{display: flex; flex-direction: column; gap: 50px;} .prog_play_info_r ul{display: flex; align-items: flex-start; gap: 70px;} .prog_play_info_r ul li{display: flex; flex-direction: column; gap: 12px; position: relative;} .prog_play_info_r ul li:before{content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: -35px; width: 1px; height: 30px; background: #999;} .prog_play_info_r ul li:first-child:before{display: none;} .prog_play_info_r ul li label{font-size: 1rem; color: #999;} .prog_play_info_r ul li h8{font-size: 1.8rem; font-weight: 700;} .prog_play_info_r ul li h9{font-size: 1rem;} .prog_play_info_c{display: flex; flex-direction: column; align-items: center; margin-bottom: 50px;} .prog_play_info_c p:first-of-type{font-size: 1.8rem; font-weight: 600; margin-top: 14px;} .prog_play_info_c p:first-of-type.member{background: url(/front/zones/img/plkmember_icon.png) 0 50% no-repeat;background-size: 25px;padding-left: 30px;} .prog_play_info_c p:nth-of-type(2){font-size: 0.875rem; color: #fff; background: #44cd75; padding: 4px 12px; border-radius: 20px; margin-top: 7px;} .prog_play_record{width: 50%; margin: 0 auto; margin-top: 56px; display: flex; gap: 30px;} .prog_play_record button{width: 100%; padding: 16px 0; color: #fff; font-size: 20px; font-weight: 600;} .prog_play_rival{display: flex; align-items: flex-start; justify-content: center; gap: 200px;} .prog_play_zone{display: flex; flex-direction: column; align-items: center; gap: 70px;} .prog_play_info_v ul{display: flex; flex-direction: column; align-items: center; gap: 50px;} .prog_play_info_v ul li{display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; position: relative;} .prog_play_info_v ul li label{font-size: 1rem; color: #999;} .prog_play_info_v ul li h8{font-size: 1.8rem; font-weight: 700;} .prog_play_info_v ul li h9{font-size: 1rem; line-height: 18px;} .prog_wish_list ul{display: flex; flex-wrap: wrap; align-items: flex-start;} .prog_wish_list ul li{width: 12.5%; margin-bottom: 70px;} .prog_wish_info{display: flex; flex-direction: column; align-items: center;} .prog_wish_sum{display: block; width: 110px; height: 110px; border-radius: 50%; position: relative;} .prog_wish_sum span img{width: 100%; height: 100%; border-radius: 50%; object-fit: cover;} .prog_wish_txt{text-align: center;} .prog_wish_txt p:first-of-type{font-size: 1.2rem; font-weight: 600; margin-top: 14px;} .prog_wish_txt p:nth-of-type(2){font-size: 0.875rem; color: #fff; background: #44cd75; padding: 4px 12px; border-radius: 20px; margin-top: 4px;} .prog_wish_txt p:nth-of-type(3){font-size: 1rem; margin-top: 10px;} .after_sch{display: flex; flex-direction: column; align-items: center;padding: 7% 0;width: 100%;} .after_sch img{width: 100px;} .after_sch span{font-size: 1.3rem; font-weight: 400; margin-top: 30px;} .hide {display: none !important;} .join_select ul{display: flex; flex-wrap: wrap; gap: 25px; position: relative; justify-content: center;} .join_select ul li{width: calc(100% / 3 - 20px); border: 1px solid #ddd; border-radius: 12px;} .join_select_info{display: flex; flex-direction: column; align-items: center; padding: 80px 0;} .join_select_info img{width: 90px;} .join_select_info p{font-size: 26px; font-weight: 600; margin-top: 20px;} .join_select_info a{background: #6aaae4; padding: 14px 40px; border-radius: 6px; font-size: 20px; font-weight: 500; color: #fff; margin-top: 70px;} .login_box{width: 600px; margin: 0 auto; padding-bottom: 30px;} .login_enter{display: flex; flex-direction: column; gap: 15px;} .login_chk{display: flex; align-items: center; justify-content: space-between; margin-top: 20px;} .login_find{margin: 0 auto; padding-top: 30px;} .login_find ul{display: flex; justify-content: center; gap: 20px;} .login_find ul li{position: relative;} .login_find ul li:before{content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: -11px; width: 1px; height: 13px; background: #999;} .login_find ul li:first-child:before{display: none;} .login_find ul li a{font-size: 16px; color: #666;} .login_num{display: flex; gap: 10px;} .login_result{text-align: center; font-size: 20px; line-height: 28px; padding-bottom: 70px;} .login_result span{font-weight: 700; color: #6aaae4;} .login_btn{margin-top: 50px;} .login_btn button{padding: 16px 0; color: #fff; font-size: 20px; font-weight: 600;} .qa_box ul li{padding-top: 20px; border-bottom: 1px solid #ddd;} .qa_box ul li:first-child{border-top: 4px solid #6aaae4;} .qa_list_tit{font-size: 1.125rem; line-height: 24px; position: relative; padding-left: 36px; padding-right: 61px; margin-bottom: 20px;} .qa_list_tit:before{content: "Q"; position: absolute; top: 0; left: 10px; font-size: 1.6rem; font-weight: 700; color: #04599e;} .qa_list_tit:after{content: ""; position: absolute; top: 8px; right: 16px; background:url(/front/zones/img/ico_downward.png); width: 16px; height: 16px; background-size: contain; background-repeat: no-repeat; transform: rotate(0); transition: .5s; background-position: 50%;} .qa_list_tit.on:after{transform: rotate(-180deg);} .qa_list_txt{padding: 20px; font-size: 1rem; line-height: 22px; background: #f4f4f4; /*display: none;*/} .photo_slide{position: relative;} .photo_gal{width: 100%; height: 720px;} .photo_gal img{width: 100%; height: 100%; object-fit: cover;} .photo_btn_prev{position: absolute; top: 50%; left: 0; transform: translate(0, -50%); padding: 0;} .photo_btn_next{position: absolute; top: 50%; right: 0; transform: translate(0, -50%); padding: 0;} .photo_page{width: calc(100% / 18); margin: 0 auto; margin-top: 30px; background: #555; padding: 4px; color: #fff; text-align: center; border-radius: 20px;} .policy_text{font-size: 1.125rem; font-weight: 300; line-height: 28px;} .drag-over{border:solid 1px #000 !important;} /* ������û�Ϸ� */ .enter_form_complete {text-align: center;} .enter_form_complete p {line-height: 20px;margin-top: 30px;} .enter_form_complete p strong {font-weight: 600;} /* 메인 리뉴얼 250512 */ :root { --font-size-80: clamp(2.8rem, 4.444vw - 0.533rem, 8rem); --font-size-24: clamp(1.4rem, 0.855vw + 0.759rem, 2.4rem); --font-size-20: clamp(1.4rem, 0.513vw + 1.015rem, 2rem); --font-size-16: clamp(1.2rem, 0.342vw + 0.944rem, 1.6rem); } .main_common {color: #444;} .main_common .inner02 {padding: clamp(7rem, 2.564vw + 5.077rem, 10rem) clamp(1rem, 3.419vw - 1.564rem, 5rem);display: flex;gap: clamp(5rem, 12.821vw - 4.615rem, 20rem);justify-content: space-between;align-items: center;} .main_common .category {display: block;color: #6AAAE4;font-size: var(--font-size-20);font-weight: 700;margin-bottom: 10px;} .main_common h2 {display: inline-block;font-size: var(--font-size-80);font-weight: 800;margin-bottom: 30px; -webkit-text-fill-color: rgb(29 31 34 / 30%);-webkit-background-clip: text;background-repeat: no-repeat;background-image: linear-gradient(#444, #444);background-size: 0% 100%;transition: all 1.2s;transition-delay: 0.2s;} .main_common h2.active {background-size: 100% 100%;} .main_common .description {font-size: var(--font-size-24);line-height: clamp(2rem, 1.368vw + 0.974rem, 3.6rem);word-break: keep-all;margin-bottom: clamp(2rem, 1.709vw + 0.718rem, 4rem);} .main_common .more_btn {display: inline-block;max-width: 260px;min-width: 90px;width: 14vw;height: clamp(3.4rem, 1.88vw + 1.99rem, 5.6rem);line-height: clamp(3.4rem, 1.88vw + 1.99rem, 5.6rem);opacity: 0;transform: translate(0,20px);transition: all 0.8s;transition-delay: 0.3s;font-size: var(--font-size-24);text-align: center;color: #fff;font-weight: 700;background: #0F6ADA;border-radius: 6px;} .main_common .more_btn.active {opacity: 1;transform: translate(0,0);} .main_common .slick-arrow {width: clamp(2.6rem, 2.906vw + 0.421rem, 6rem);height: clamp(2.6rem, 2.906vw + 0.421rem, 6rem);position: absolute;top: 50%;transform: translate(0, -50%);color: transparent;} .main_common .slick-prev {background: url(/front/zones/img/icon_slide_prev.png) no-repeat 0 0 / clamp(2.6rem, 2.906vw + 0.421rem, 6rem);left: 0;} .main_common .slick-next {background: url(/front/zones/img/icon_slide_next.png) no-repeat 0 0 / clamp(2.6rem, 2.906vw + 0.421rem, 6rem);right: 0;} .main_common .img_box {width: 42.2vw;overflow: hidden;} .main_common .img_box img {width: 100%;object-fit: cover;border-radius: 7px;/* clip-path: circle(37% at 50% 50%); */clip-path: polygon(60% 0, 60% 0, 40% 100%, 40% 100%);transition: clip-path 1s ease-out;} .text_banner {text-align: center;display: none;} #main #mainWrap .text_banner .inner {padding: clamp(2.3rem, 3.419vw - 0.264rem, 6.3rem) clamp(1rem, -1.923vw + 3.692rem, 0rem);} .text_banner .text {font-size: var(--font-size-24);display: flex !important;align-items: center;height: clamp(3.4rem, 1.88vw + 1.99rem, 5.6rem);} .text_banner .text p {width: 70%;margin: 0 auto;word-break: keep-all;line-height: clamp(1.8rem, 1.368vw + 0.774rem, 3.4rem);overflow: hidden;white-space: normal;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;} .plkcup_section {background: #283762;} .plkcup_section .description {margin-bottom: 0;} .plkcup_section h2 {-webkit-text-fill-color: rgb(255 255 255 / 10%);-webkit-background-clip: text;background-repeat: no-repeat;background-image: linear-gradient(#ffffff, #ffffff);background-size: 0% 100%;} .plkcup_section .description {color: #fff;} .membership_section {background: #283762;} .membership_section h2 {-webkit-text-fill-color: rgb(255 255 255 / 10%);-webkit-background-clip: text;background-repeat: no-repeat;background-image: linear-gradient(#ffffff, #ffffff);background-size: 0% 100%;} .membership_section .description {color: #fff;} #main #mainWrap .partner_section .inner {padding: clamp(2.8rem, 2.735vw + 0.749rem, 6rem) 0;} .partner_section .logo {display: flex !important;justify-content: center;align-items: center;height: clamp(7rem, 9.402vw - 0.051rem, 18rem);} .partner_section .logo img {width: 180px;display: inline-block;} .partner_section .slick-list {/*width: 1180px;*/width: 84%;margin: 0 auto;} .ssang_golf_section {background: #F4F4F4;} .ssang_golf_section .inner02 {justify-content: normal;} .news_section {text-align: center;background: #F4F4F4;} .news_section .inner02 {display: block;padding: clamp(7rem, 2.564vw + 5.077rem, 10rem) 0;} .news_section h2 {margin-bottom: clamp(3rem, 1.709vw + 1.718rem, 5rem);} .news_section .news_box {text-align: left;} .news_section .news_box .news_item {position: relative;border-radius: 6px;} /* .news_section .news_box .news_img {min-width: 300px;} */ .news_section .news_box .news_img img {width: 100%;} .news_section .news_box .content {position: absolute;bottom: 0;left: 0;background: rgba(33, 77, 157, 0.80);width: 100%;padding: clamp(1.5rem, 0.427vw + 1.179rem, 2rem);padding-right: clamp(1.5rem, 4.701vw - 2.026rem, 7rem);border-radius: 0 0 6px 6px;} .news_section .news_box .content span {font-size: var(--font-size-16);color: #6AAAE4;font-weight: 700;display: inline-block;margin-bottom: clamp(0.4rem, 0.513vw + 0.015rem, 1rem);} .news_section .news_box .content h3 {font-size: var(--font-size-24);color: #fff;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;word-break: break-all;margin-bottom: clamp(1.2rem, 0.684vw + 0.687rem, 2rem);} .news_section .news_box .content em {font-size: var(--font-size-16);color: #aaa;} .news_section .more_btn {margin-top: clamp(3rem, 3.419vw + 0.436rem, 7rem);} @media screen and (max-width: 1400px) { #main #mainWrap .partner_section .inner {padding: clamp(2.8rem, 2.735vw + 0.749rem, 6rem) 10px;} .partner_section .logo img {width: 130px;} } @media screen and (max-width: 1024px) { .main_common .inner02 {flex-wrap: wrap;} .main_common .img_box {width: 100%;} .ssang_golf_section .img_box {order: 1;} .membership_section02 .img_box {order: 1;} } @media screen and (max-width: 750px) { .main_common .content_box {text-align: center;width: 100%;} .membership_section .description br {display: none;} .partner_section .logo img {width: clamp(6.4rem, 24.354vw - 5.266rem, 13rem);} .news_section .news_box .news_item {width: 300px;} }