@charset "utf-8";

*{box-sizing:border-box;}

@font-face {
    font-family: 's-core-dream-bold';
    src: url('/font/scdream6-webfont.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

.sb_boxarea{background-color:#212121; padding:4vw; position:relative; aspect-ratio:1.977 / 1; overflow:hidden; width:100%; max-height:100%; min-height: 47vw;}



.sb_setting{position:absolute; right:0; top:0;}
.sb_setting .sset_btn{padding:0.8vw 0.8vw; width:4vw; height: 4vw;}
.sb_setting .sset_btn a{width:100%; display:block; background:url(/images/scoreboard/setting_icon.png) no-repeat; background-size:100%; height:100%;}

.sset_list{position:absolute; height:100vh; background-color:#000;  right:-16vw; z-index:100; top:0; min-width:80px; transition:0.4s all ease; display:none;}
.sset_list .close_box{border-bottom:1px solid #fff; padding: 2vw 1vw; position:relative;}
.sset_list .close_box .ss_close{display:block; position:absolute; width:2.5vw; height:2.5vw; right:1vw; top:50%; transform:translateY(-50%);}
.sset_list .close_box .ss_close:before{display:block; position:absolute; content:""; background:#fff; width:2.3vw; height:1.5px; transform:rotate(45deg); left:0; top:1.2vw; transition:0.5s all ease;}
.sset_list .close_box .ss_close:after{display:block; position:absolute; content:""; background:#fff; width:2.3vw; height:1.5px; transform:rotate(135deg); left:0; top:1.2vw; transition:0.5s all ease;}
.sset_list .close_box .ss_close:hover:before{transform:rotate(135deg);}
.sset_list .close_box .ss_close:hover:after{transform:rotate(45deg);}
.sset_list ul{height:44vw;}
.sset_list ul li{width:100%; height:calc(100% / 4); text-align:center; position:relative;}
.sset_list ul li:before{display:inline-block; vertical-align:middle; width:0; height:100%; content:"";}
.sset_list ul li:after{width:80%; border-bottom:1px dashed #fff; display:block; content:""; position:absolute; bottom:0; left:50%; transform:translateX(-50%); }
.sset_list ul li a{padding:0 1.25vw; display:inline-block; text-align:center; vertical-align:middle;}
.sset_list ul li a img{width:4.19vw;}
.sset_list ul li a span{display:block; color:#fff; font-weight:400; font-size:1.2vw; margin-top:0.8vw;}
.sset_list ul li a:hover span{color:#eaff00;}
.sset_list ul li:last-child:after{display:none;}

.sb_in{background-color:#181818; position:relative; height:100%; z-index:1;}

#sbbA .sb_in:before{display:block; content:"A"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}
#sbbB .sb_in:before{display:block; content:"B"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}
#sbbC .sb_in:before{display:block; content:"C"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}
#sbbD .sb_in:before{display:block; content:"D"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}
#sbbE .sb_in:before{display:block; content:"E"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}
#sbbF .sb_in:before{display:block; content:"F"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}
#sbbG .sb_in:before{display:block; content:"G"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}
#sbbH .sb_in:before{display:block; content:"H"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}
#sbbI .sb_in:before{display:block; content:"I"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}
#sbbJ .sb_in:before{display:block; content:"J"; position:absolute; left:50%; top:45%; transform:translate(-50%, -50%); color:#fff; font-size:24vw;  opacity:0.2; z-index:-1; font-weight:600;}

.total_score{text-align:center; position:absolute; left:50%; transform:translateX(-50%); top:1.4vw; z-index:1;}
.total_score > span{display:inline-block; vertical-align:middle; font-family: 's-core-dream-bold'; position:relative;}
.total_score > span.ts{color:#eaff00; font-size:4.5vw;}
.total_score > span.ts input{color:#eaff00; font-size:4.5vw; background:none; border:none; width:4vw; text-align:center;}
.total_score > span.ts .sc_arr{display:block; position:absolute; top:2vw;}
.total_score > span.team1 .sc_arr{left:-2vw;}
.total_score > span.team2 .sc_arr{right:-2vw;}
.total_score > span.ts .sc_arr a{display:block; width:1.2vw;}
.total_score > span.ts .sc_arr a img{width:100%; display:block;}
.total_score > span.ts .sc_arr a.up{margin-bottom:0.65vw;}
.total_score > span.gameset{color:#fff; font-size:2.5vw; margin:0 1.5vw; letter-spacing:-0.1vw;}
.tiebreak{color:#ff9090; font-size:2.5vw; position:absolute; left:50%; transform:translateX(-50%); top:8.5vw; letter-spacing:-0.1vw;}

.score_here{display:flex; flex-wrap:wrap; padding:3vw 3vw 1vw 3vw; position:relative;}
.score_here:after{display:block; content:""; position:absolute; width:1.85vw; height:6.7vw; left:50%; transform:translateX(-50%); top:16vw; background:url(/images/scoreboard/board_middle.png) no-repeat; background-size:100%; animation: blink 1.5s step-end infinite;}

@keyframes blink{
 50%{opacity:0;}
}


.score_here > div{display:inline-block; vertical-align:middle; width:50%; text-align:center;}
.score_here > div.s_team1{padding-right:5vw;}
.score_here > div.s_team2{padding-left:5vw;}
.score_here .team_name{font-size:1.8vw; letter-spacing:-0.1vw; font-weight:600; color:#fff;}
.score_here > div.s_team1 .team_name{padding-right:8vw;}
.score_here > div.s_team2 .team_name{padding-left:8vw;}
.score_here .team_name span{display:inline-block; padding-bottom:1vw; position:relative;}
.score_here .now_palying .team_name span{padding-left:2.5vw; padding-right:0.35vw;}
.score_here .now_palying .team_name span:before{display:block; width:1.4vw; height:1.4vw; background-color:#eaff00; content:""; position:absolute; left:0; top:0.3vw; border-radius:50%;}
.score_here .now_palying .team_name span:after{display:block; width:100%; height:0.3vw; background-color:#eaff00; content:""; position:absolute; left:0; bottom:0; border-radius:10px;}
.score_here .score{padding-top:4vw;}
.score_here .score input{font-size:12.5vw; font-family: 's-core-dream-bold'; color:#fff; background:none; border:none; padding:0; width: 15vw; text-align: center;}
.score_here .score a{color:#fff; font-size:12.5vw; font-family:'s-core-dream-bold';}

.cancle_score{position:absolute; left:50%; transform:translateX(-50%); bottom:8vw;}
.cancle_score .cs_btn{display:inline-block; color:#fff; font-size:1.35vw; font-weight:500; background-color:#1c1c1c; border-radius:100px; padding:0.7vw 4vw 1vw 4vw; box-shadow: inset -0.15em 0.1em 0.1em 0 rgba(255,255,255,0.4), inset 0.3em -0.3em 0.1em 0 rgba(0,0,0,0.5); transition:0.3s all ease;}
.cancle_score .cs_btn:hover{box-shadow: inset 0.15em -0.15em 0.1em 0 rgba(255,255,255,0.4), inset -0.15em 0.2em 0.2em 0 rgba(0,0,0,0.5);}

.ad_box{position:absolute; width:100%; bottom:1.5vw; left:0;}
.ad_box ul{display:flex; flex-wrap:wrap; justify-content:center; width:100%;}
.ad_box ul li{display:inline-block; vertical-align:middle; width:calc(100% / 7);}
.ad_box ul li img{width:100%;}




/*231128 ´ëȸº¸±â È­¸é ½ºÄھµå*/
.sb_area .sb_box a{display:block; width:100%; height:100%;}
.sb_area .sb_box .sb_boxarea{width:100%; height:100%; padding:10px; background-color:#212121; position:relative; overflow:hidden; min-height: inherit;}
.sb_area .sb_box .sb_in{background-color:#181818; position:relative; height:100%;}


.sb_area .sb_box#sbbA .sb_in:before{display:block; content:"A"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}
.sb_area .sb_box#sbbB .sb_in:before{display:block; content:"B"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}
.sb_area .sb_box#sbbC .sb_in:before{display:block; content:"C"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}
.sb_area .sb_box#sbbD .sb_in:before{display:block; content:"D"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}
.sb_area .sb_box#sbbE .sb_in:before{display:block; content:"E"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}
.sb_area .sb_box#sbbF .sb_in:before{display:block; content:"F"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}
.sb_area .sb_box#sbbG .sb_in:before{display:block; content:"G"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}
.sb_area .sb_box#sbbH .sb_in:before{display:block; content:"H"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}
.sb_area .sb_box#sbbI .sb_in:before{display:block; content:"I"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}
.sb_area .sb_box#sbbJ .sb_in:before{display:block; content:"J"; position:absolute; left:50%; top:58%; transform:translate(-50%, -50%); color:#fff; font-size:115px;  opacity:0.2; z-index:-1; font-weight:600;}


.sb_area .sb_box .total_score{top:0;}
.sb_area .sb_box .total_score > span.ts{font-size:30px;}
.sb_area .sb_box .total_score > span.gameset{color:#fff; font-size: 15px; margin: 0 5px; letter-spacing: -1px;}
.sb_area .sb_box .tiebreak{font-size:18px; top:45px; letter-spacing:-1px;}

.sb_area .sb_box .score_here{padding:10px 5px 5px 5px;}
.sb_area .sb_box .score_here:after{width:6px; height:27px; top:102px;}
.sb_area .sb_box .score_here > div{display:inline-block; vertical-align:middle; width:50%; text-align:center; position:relative;}
.sb_area .sb_box .score_here > div.s_team1{padding-right:25px;}
.sb_area .sb_box .score_here > div.s_team1 .team_name{text-align:left;}
.sb_area .sb_box .score_here > div.s_team2{padding-left:25px;}
.sb_area .sb_box .score_here > div.s_team2 .team_name{text-align:right;}
.sb_area .sb_box .score_here .team_name{font-size:15px; letter-spacing:-1.5px; font-weight:500; line-height: 1em;}
.sb_area .sb_box .score_here .team_name span{padding-bottom:8px;}

.sb_area .sb_box .score_here > div.s_team1 .team_name{padding-right:24%;}
.sb_area .sb_box .score_here > div.s_team2 .team_name{padding-left:24%;}
.sb_area .sb_box .score_here .now_palying .team_name span{padding-left:0; padding-right:0;}
.sb_area .sb_box .score_here .now_palying .team_name span:before{display:none;}
.sb_area .sb_box .score_here .now_palying .team_name span:after{height:3px;}
.sb_area .sb_box .score_here .score{font-size:60px; padding-top:0; color:#fff; position:absolute; left:50%; transform:translateX(-50%); top:65px;}