@charset "utf-8";

.sub-header { position: fixed; width: 100%; background: #080d2c; z-index: 9; }
.sub-header .back-icon { position: absolute; left: 5.2vw; top: 4.5vw; }
.sub-header .back-icon img { width: 7.5vw; }
.sub-header .title { font-size: 1.500rem; font-weight: bold; color: #fff; text-align: center; padding: 4.5vw 0; }
.sub-header .close-icon { position: absolute; right: 5.2vw; top: 4.5vw; }
.sub-header .close-icon img { width: 7.5vw; }
.sub-header.close .back-icon { display: none; }
.sub-header.back .close-icon { display: none; }
.sub-header.none .back-icon,
.sub-header.none .close-icon { display: none; }
.sub-header + #contents { padding-top: 16vw; padding-bottom: 35vw;}
.sub-header .search-icon { position: absolute; right: 5.2vw; top: 4.5vw; }
.sub-header .search-icon img { width: 7.5vw; }
.sub-header .search-icon img.on { display: none; }
.sub-header .search-icon img.off { display: block; }
.sub-header .search-icon.active img.on { display: block; }
.sub-header .search-icon.active img.off { display: none; }

.alarm .list-wrap .item { padding: 5.2vw; border-bottom: solid 1px #979797; background: #fafafa; }
.alarm .list-wrap .item .title { font-size: 1.500rem; font-weight: bold; }
.alarm .list-wrap .item .title img { width: 4vw; }
.alarm .list-wrap .item .cont { font-size: 1.250rem; }
.alarm .list-wrap .item .time { color: #7b7b7b; }

.login { height: 100%; }
.login #contents { position: relative; padding-top: 30vw; height: 100%; box-sizing: border-box; }
.login #contents .logo { text-align: center; }
.login #contents .logo img { width: 40vw; }
.login #contents .box-wrap { position: absolute; bottom: 5vw; width: calc(100% - 10vw); margin: 0 5vw; background: #080d2c; border-radius: 9.5vw; padding: 6vw; box-sizing: border-box; }
.login #contents .box-wrap .login-input input { width: 100%; background: #303450; border: 0; font-size: 1.333rem; color: rgba(255, 255, 255, 0.5); padding: 4vw 0; text-indent: 4vw; border-radius: 14.5vw; }
.login #contents .box-wrap .login-input input + input { margin-top: 6.5vw; }
.login #contents .box-wrap .checkbox { margin-top: 3vw; }
.login #contents .box-wrap .checkbox .txt { color: #fff; }
.login #contents .box-wrap .error-txt { color: #f1424c; text-align: center; padding: 0 0 5vw 0; }
.login #contents .box-wrap .login-btn { padding-top: 5vw;}
.login #contents .box-wrap .login-btn a { display: block; background: #f1424c; padding: 3.5vw 0; font-size: 1.333rem; font-weight: bold; text-align: center; color: #fff; border-radius: 13vw; }
.login #contents .box-wrap .sub-btn { display: flex; justify-content: center; align-content: center; margin-top: 3vw; }
.login #contents .box-wrap .sub-btn a { color: #fff; font-size: 1.250rem; padding: 0 6vw; }
.login #contents .box-wrap .sub-btn a:first-child { border-right: solid 1px #fff; }
.login #contents .box-wrap .qr-btn { position: absolute; left: calc(50% - 18.2vw); bottom: 6vw; color: #fff; font-size: 1.333rem; font-weight: bold; display: flex; align-items: center; justify-content: center; }
.login #contents .box-wrap .qr-btn img { width: 6.5vw; margin-right: 2.6vw; }

.join #contents { padding-left: 5.5vw; padding-right: 5.5vw; }
.join #contents .type-box { border: solid 2px #d1d1d1; margin-top: 12vw; text-align: center; border-radius: 4vw; padding: 5vw 0; }
.join #contents .type-box img { width: 24vw; }
.join #contents .type-box .txt01 { font-size: 1.667rem; font-weight: bold; padding: 4vw 0; }
.join #contents .type-box .txt02 { font-size: 1.167rem; padding-bottom: 4vw; }
.join #contents .type-box .txt03 { font-size: 1.167rem; font-weight: bold; }

.join #contents .agree-box { margin-top: 3vw; }
.join #contents .agree-box textarea { width: 100%; height: 25vw; border: 0; background: #f8f8f8; padding: 2.6vw; box-sizing: border-box; margin-top: 3vw; }
.join #contents .agree-box .checkbox.active .txt { font-weight: bold; }
.join #contents .agree-box .noti-txt { color: #7b7b7b; padding: 2vw; font-size: 1.083rem; }

.join-input #contents { padding-left: 5.5vw; padding-right: 5.5vw; }
.join-input #contents h2 { position: relative; font-size: 1.500rem; font-weight: bold; text-align: center; margin: 5.5vw 0; }
.join-input #contents h2 span { position: absolute; right: 0; bottom: 0.5vw; font-size: 1rem; color: #f1424c; }
.join-input #contents h2 span i img { width: 2.4vw; margin-right: 1.3vw; }
.join-input #contents .user-info { background: #f8f8f8; border-radius: 4vw; padding: 5.5vw; }
.join-input #contents .user-info table th { width: 40%; font-size: 1.250rem; padding-bottom: 3vw; }
.join-input #contents .user-info table td { font-size: 1.333rem; padding-bottom: 3vw; }
.join-input #contents .user-info table tr:last-child th,
.join-input #contents .user-info table tr:last-child td { padding-bottom: 0; }
.join-input #contents .input-box { margin-top: 4vw; }
.join-input #contents .input-box > p { position: relative; }
.join-input #contents .input-box > p em { font-style: normal; font-size: 1.250rem; font-weight: bold; }
.join-input #contents .input-box > p em img { width: 2.4vw; margin-left: 1.3vw; }
.join-input #contents .input-box > p a { font-style: normal; font-size: 1.250rem; font-weight: bold; }
.join-input #contents .input-box > p a img { width: 5.2vw; margin-left: 1.3vw; vertical-align: middle; }
.join-input #contents .input-box > p span { font-size: 1rem; color: #7b7b7b; margin-left: 2.6vw; }
.join-input #contents .input-box > p span.error-txt { position: absolute; right: 0; }
.join-input #contents .input-box > div { width: 100%; margin-top: 3vw; }
.join-input #contents .input-box > div input { width: 100%; border: solid 1px #a7a7a7; border-radius: 2.6vw; font-size: 1.333rem; padding: 3.2vw 0; text-indent: 2.6vw; }
.join-input #contents .input-box > div input::placeholder { letter-spacing: -1.8px; }
.join-input #contents .input-box > div.in-btn { display: flex; }
.join-input #contents .input-box > div.in-btn input { width: 70%; margin-right: 2.6vw; }
.join-input #contents .input-box > div.in-btn a { width: 30%; padding: 3.4vw 0;}
.join-input #contents .tab-btn-wrap { display: flex; }
.join-input #contents .tab-btn-wrap a { border-radius: 8vw; }
.join-input #contents .tab-btn-wrap a.white { font-weight: normal; }
.join-input #contents .title-txt { font-size: 1.25rem; font-weight: bold; text-align: center; letter-spacing: -1.7px; }
.join-input #contents .title-txt em { display: block; font-style: normal; font-size: 2.500rem; }

.in-btn { display: flex; }
.in-btn input { width: 70%; margin-right: 2.6vw; }
.in-btn a { width: 30%; padding: 3.4vw 0;}

.join-complete #contents img { width: 100vw; }
.join-complete #contents .title-name { padding: 20vw 0 13vw 0; font-size: 2.083rem; font-weight: bold; text-align: center; }
.join-complete #contents .title-name em { display: block; font-style: normal; font-size: 2.500rem; }
.join-complete #contents .info { padding-bottom: 10vw; }
.join-complete #contents .info p { font-size: 1.417rem; font-weight: bold; text-align: center; margin-bottom: 5vw; }
.join-complete #contents .info table { width: 50vw; margin: 0 auto; }
.join-complete #contents .info table th { width: 40%; font-size: 1.250rem; padding: 2.6vw 0; }
.join-complete #contents .info table td { width: 60%; font-size: 1.333rem; padding: 2.6vw 0; }

.setting #contents .list a { display: flex; justify-content: space-between; align-content: center; font-size: 1.5rem; font-weight: bold; padding: 5.2vw; border-bottom: solid 1px #979797; }
.setting #contents .list a img { width: 5.2vw; height: 5.2vw; }
.setting #contents .list a .txt { font-size: 1.333rem; font-weight: normal; }
.setting #contents .list a .checkbox { width: auto; }
.setting #contents table { margin-top: 10vw; }
.setting #contents table th { width: 30%; font-size: 1.25rem; padding-bottom: 6.2vw; }
.setting #contents table th.top { vertical-align: top; }
.setting #contents table td { width: 70%; padding-bottom: 6.2vw; }

.record #contents h2 { position: relative; font-size: 1.25rem; margin-bottom: 1.6vw; display: flex; align-items: center; }
.record #contents h2 span { font-size: 1rem; color: #7b7b7b; font-weight: normal; margin-left: 1vw; }
.record #contents .period { font-size: 1.250rem; text-align: right; padding-top: 2vw;}
.record #contents .item-box { display: flex; justify-content: space-between; border: solid 1px #979797; border-radius: 1vw; padding: 2vw 3vw; }
.record #contents .item-box div { display: flex; justify-content: center; align-items: center; }
.record #contents .item-box div span { font-size: 1rem; margin-right: 1.5vw; }
.record #contents .item-box div em { font-style: normal; font-size: 1.3rem; font-weight: bold; }
.record #contents .btn-wrap.tab { margin-top: 5.2vw; }
.record #contents .btn-wrap.tab a { font-size: 1.083em; padding: 2.1vw 0; color: #f1424c; border: solid 1px #f1424c; border-radius: 5vw; font-weight: normal; }
.record #contents .btn-wrap.tab a.active { color: #fff; font-weight: bold; background: #f1424c; }
.record #contents .btn-wrap.tab a.disabled { opacity: 0.3; }
.record #contents .btn-wrap.tab a + a { margin-left: 2.6vw; }
.record #contents .chart { border-radius: 2.6vw; box-shadow: 0 0 15px 2px rgba(0, 0, 0, 0.1); background-color: #fff; }
.record #contents .record-box { background: #080d2c; border-radius: 2.6vw; box-shadow: 0 0 15px 2px rgba(0, 0, 0, 0.1); color: #fff; display: flex; }
.record #contents .record-box > div { width: 50%; padding: 2.6vw 0; }
.record #contents .record-box > div p { font-size: 1.25rem; font-weight: bold; text-align: center; padding-bottom: 2.6vw; }
.record #contents .record-box > div > div { background: rgba(255, 255, 255, 0.15); border-radius: 2.6vw; margin: 0 2.6vw; padding: 1.3vw 0; }
.record #contents .record-box > div > div table th { width: 50%; text-align: center; padding: 1.3vw 0; }
.record #contents .record-box > div > div table td { width: 50%; text-align: center; font-size: 1.25rem; font-weight: 900; }
.record #contents .record-by-date {}
.record #contents .record-by-date .date { display: flex; justify-content: space-between; background: #080d2c; font-size: 1.250rem; font-weight: bold; color: #fff; padding: 2.6vw 5.2vw; }
.record #contents .record-by-date .detail a { border-bottom: solid 1px #e5e5e5; display: flex; justify-content: space-between; align-items: center; padding: 3vw 5.2vw; }
.record #contents .record-by-date .detail a p.txt1 { font-size: 1.083rem; color: #7b7b7b; }
.record #contents .record-by-date .detail a p.txt2 { font-size: 1.250rem; }
.record #contents .record-by-date .detail a p.txt3 { font-size: 1.5rem; font-weight: bold; }
.record #contents .record-by-date .detail a p.txt3 > span { font-size: 1rem; display: flex; flex-direction: column; }
.record #contents .record-by-date .detail a p.txt3 > span img { width: 5vw; }
.record #contents .record-by-date .detail a .klsa-score { position: relative; width: 20%; }
.record #contents .record-by-date .detail a .klsa-score img { position: absolute; top: -5.5vw; left: -4.5vw; width: 13.4vw; z-index: -1; }
.record #contents .record-by-date .detail a .klsa-score > div { display: flex; justify-content: space-between; margin-left: -2vw; }
.record #contents .record-by-date .detail a .klsa-score > div span { display: block; background: #080d2c; border-radius: 100%; color: #fff; font-weight: bold; padding: 1.8vw 2vw; }
.record #contents .record-by-date .detail a .klsa-score > div .score { font-size: 1.667rem; font-weight: bold; }
.record #contents .record-by-date .detail a .klsa-score.rank { width: 20%; }
.record #contents .record-by-date .detail a .klsa-score.rank > div { margin-left: 0; }
.record #contents .record-by-date .detail a .klsa-score.rank > div > div { font-size: 1rem; color: #181818; }
.record #contents .record-by-date .detail a .klsa-score.rank > div > div span { display: block; padding-top: 1.3vw; background: none; color: #181818; padding: 0; }
.record #contents .record-by-date .detail a .klsa-score.rank > div .score { font-size: 1.667rem; color: #f1424c; }

.record #contents .record-wrap { width: 100%; background: #080d2c; border-radius: 2.6vw; padding: 2.6vw; box-sizing: border-box; }
.record #contents .record-wrap .record-box2 { display: flex; justify-content: space-between; align-content: center; }
.record #contents .record-wrap .record-box2 > div { width: 20vw; height: 24vw; text-align: center; background: rgba(255, 255, 255, 0.15); border-radius: 2.6vw; display: flex; flex-direction: column; justify-content: space-evenly; }
.record #contents .record-wrap .record-box2 > div:first-child { line-height: 3.6vw; position: relative; }
.record #contents .record-wrap .record-box2 > div a.btn-help { position: absolute; top: 1.3vw; right: 1.3vw; text-align: right; }
.record #contents .record-wrap .record-box2 > div a.btn-help img { width: 4.8vw; }
.record #contents .record-wrap .record-box2 > div.ea2 { width: 40vw; }
.record #contents .record-wrap .record-box2 > div.ea2 .score { line-height: 9vw; }
.record #contents .record-wrap .record-box2 > div.ea2 .score span { display: block; font-size: 1rem; font-weight: normal; letter-spacing: -1.1px; }
.record #contents .record-wrap .record-box2 > div p { color: #fff; font-size: 1.250rem; }
.record #contents .record-wrap .record-box2 > div p.score { font-size: 2rem; font-weight: 900; letter-spacing: -2.8px; }
.record #contents .record-wrap .record-box2 > div.standard { position: relative; width: 15vw; background: rgba(255, 255, 255, 0.33); padding: 1vw 0; }
.record #contents .record-wrap .record-box2 > div.standard p { position: absolute; top: -5.5vw; width: 100%; font-size: 1rem; }

.record #contents .player-rank { margin-top: 5.2vw; }
.record #contents .player-rank table tr.normal td { padding: 2.6vw 0; }
.record #contents .player-rank table th { width: 20%; font-size: 1rem; font-weight: normal; border-bottom: solid 1px #d1d1d1; text-align: center; }
.record #contents .player-rank table th.txt { width: 80%; color: #7b7b7b; }
.record #contents .player-rank table td { border-bottom: solid 1px #d1d1d1; text-align: center; }
.record #contents .player-rank table td.rank { width: 20%; position: relative; font-size: 1rem; font-weight: bold; color: #fff; }
.record #contents .player-rank table td.rank > div { display: flex; justify-content: center; }
.record #contents .player-rank table td.rank span { display: block; width: 8vw; height: 8vw; background: #080d2c; border-radius: 100%; display: flex; justify-content: center; align-items: center; line-height: 0; }
.record #contents .player-rank table td.rank img { width: 13.4vw; }
.record #contents .player-rank table td.rank img + span { position: absolute; top: 8.5vw; left: 6vw; color: #181818; background: none; display: block; }
.record #contents .player-rank table td.rank.bg-none span { width: auto; height: auto; background: none; color: #181818; }
.record #contents .player-rank table td.name { width: 30%; font-size: 1.500rem; font-weight: bold; }
.record #contents .player-rank table td.name > div { display: flex; overflow: hidden;}
.record #contents .player-rank table td.name img { width: 7.5vw; margin-right: 1.3vw; vertical-align: middle;}
.record #contents .player-rank table td.name span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.record #contents .player-rank table td.score { width: 20%; font-size: 1.667rem; }
.record #contents .player-rank table td.klsa { width: 20%; font-size: 1.250rem; font-weight: bold; }
.record #contents .player-rank table td.score em, .record #contents .player-rank table td.klsa em { font-style: normal; color: #f1424c; font-weight: bold; }
.record #contents .player-rank table td.klsa.disabled { opacity: 0.2; }
.record #contents .player-rank.live h2 { border-bottom: solid 1px #d1d1d1; margin: 0; padding: 2.6vw 0; }

.record #contents .search-form { padding-bottom: 5.2vw; border-bottom: solid 1px #d1d1d1; }
.record #contents .stadium-list .item { display: flex; justify-content: space-between; padding: 2.6vw; border: solid 1px #979797; border-radius: 1.3vw; margin-top: 2.6vw; }
.comp-no-data { display: flex; justify-content: space-between; padding: 2.6vw; border: solid 1px #979797; border-radius: 1.3vw; margin-top: 2.6vw; }
.record #contents .stadium-list .item > div .num { font-size: 1.5rem; font-weight: bold; }
.record #contents .stadium-list .item > div .num span:first-child { background: #080d2c; border-radius: 1.1vw; color: #fff; font-size: 1rem; font-weight: bold; padding: 1.1vw 4.5vw; margin-right: 1.3vw; }
.record #contents .stadium-list .item > div .name { font-size: 1.5rem; font-weight: bold; margin: 2.6vw 0; }
.record #contents .stadium-list .item > div .niti { font-size: 1.167rem; }
.record #contents .stadium-list .item > div a { display: flex; flex-direction: column; align-items: center; color: #fff; font-size: 1.333rem; font-weight: bold; background: #f1424c; border-radius: 2.6vw; padding: 5.2vw 5.4vw; line-height: 5vw; }
.record #contents .stadium-list .item > div a.ready { background-color: #7b7b7b; }
.record #contents .stadium-list .item > div a .cnt { font-size: 1.250rem; margin-bottom: 1.3vw; }
.record #contents .stadium-list .item > div a img { width: 3.5vw; }
comp-no-data

.record.live #contents { position: relative; }
.record #contents .stadium-info { width: 100%; box-shadow: 0 5px 9px 0 rgba(0, 0, 0, 0.15); background: #fff; }
.record #contents .stadium-info .item { padding: 2.6vw 5.2vw; }
.record #contents .stadium-info .item .num { display: flex; justify-content: space-between; font-size: 1.5rem; font-weight: bold; }
.record #contents .stadium-info .item .num span:first-child { background: #080d2c; border-radius: 1.1vw; color: #fff; font-size: 1rem; font-weight: bold; padding: 1.1vw 4.5vw; margin-right: 1.3vw; }
.record #contents .stadium-info .item .num img { width: 3.5vw; }
.record #contents .stadium-info .item .name { font-size: 1.5rem; font-weight: bold; margin: 2.6vw 0; }
.record #contents .stadium-info .item .niti { font-size: 1.167rem; }

.record #contents .reload-time { display: flex; align-items: center; }
.record #contents .reload-time .finish-msg { width: 100%; height: 16vw; font-size: 1.667rem; font-weight: bold; color: #f1424c; display: flex; align-items: center; justify-content: center; }
.record #contents .reload-time .bar { width: 80vw; height: 16vw; background: #f5f3f3; }
.record #contents .reload-time .bar .active-bar { height: 100%; background: #f1424c; }
.record #contents .reload-time .sec { width: 20vw; text-align: center; color: #f1424c; font-weight: bold; font-size: 2.083rem; }
.record #contents .reload-time .sec em { font-style: normal; font-size: 2.667rem; font-weight: 900; margin-right: 1vw; }

.record #contents .player-1st { position: relative; display: flex; justify-content: space-evenly; padding: 6.6vw 0 2.6vw 0; border: solid 1px #979797; border-radius: 1.3vw;  }
.record #contents .player-1st .medal { position: absolute; top: 0; left: -3vw; width: 18vw; height: 18vw; background: url('/static/img/img-gold-medal@2x.png') no-repeat; background-size: 100%; display: flex; align-items: center; justify-content: center; font-weight: bold; line-height: 3.5vw; text-align: center; padding-top: 2.3vw; margin-top: -1.2vw; }
.record #contents .player-1st .photo-name { font-size: 1.500rem; font-weight: bold; display: flex; flex-direction: column; align-items: center; justify-content: space-between; }
.record #contents .player-1st .photo-name img { width: 20vw; border-radius: 100%; }
.record #contents .player-1st .score { font-size: 1.250rem; font-weight: bold; display: flex; flex-direction: column; align-items: center; justify-content: space-between; }
.record #contents .player-1st .score em { font-style: normal; font-size: 1.667rem; color: #f1424c; margin-left: 2.6vw; }
.record #contents .player-1st .score .btn-wrap { margin-top: 3.6vw; }
.record #contents .player-1st .score .btn-wrap a { padding: 1.3vw 4.6vw; }

.record.detail #contents .item-box { justify-content: space-around; }
.record.detail #contents .region { display: flex; justify-content: flex-start; align-items: center; padding: 5.2vw 0; }
.record.detail #contents .region img { width: 6vw; height: 8.2vw; margin-right: 2.6vw; }
.record.detail #contents .region .number { font-size: 1.5rem; font-weight: bold; }
.record.detail #contents .region .addr { font-size: 1.167rem; }
.record.detail #contents .name-score { display: flex; justify-content: space-between; align-items: center; margin-top: 5.2vw; }
.record.detail #contents .name-score .name { font-size: 1.5rem; font-weight: bold; display: flex; justify-content: flex-start; align-items: center; }
.record.detail #contents .name-score .name img { width: 7vw; height: 7vw; margin-right: 2.6vw; }
.record.detail #contents .name-score .score { font-size: 2.083rem; }
.record.detail #contents .name-score .score em { font-style: normal; font-weight: bold; color: #f1424c; }
.record.detail #contents .target { position: relative; width: 330px; height: 330px; background: url('/static/img/img-target@2x.png') no-repeat; background-size: 100%; margin: 5.2vw auto 0 auto; }
.record.detail #contents .target .point { position: absolute; }
.record.detail #contents .score-table table th { font-size: 1.250rem; font-weight: bold; color: #fff; background: #080d2c; padding: 2.6vw; text-align: center; }
.record.detail #contents .score-table table td { font-size: 1.667rem; font-weight: bold; padding: 2.6vw; text-align: center; border-bottom: solid 1px #d1d1d1; }
.record.detail #contents .score-table table td img { width: 10vw; }
.record.detail #contents .score-table table td div.point { margin: 0 auto; }
.record.detail #contents .score-table table tr:nth-child(even) td { background: #f7f7f7; }
.record.detail #contents .analysis .score-box { background: #080d2c; border-radius: 1.3vw; display: flex; justify-content: space-between; padding: 2.6vw; }
.record.detail #contents .analysis .score-box > div { width: 30%; color: #fff; border-right: solid 1px #979797; text-align: center; }
.record.detail #contents .analysis .score-box > div:last-child { width: 40%; border: 0; }
.record.detail #contents .analysis .score-box > div .title { font-size: 1.167rem; }
.record.detail #contents .analysis .score-box > div .score { height: 10.2vw; font-size: 1.667rem; font-weight: bold; display: flex; align-items: center; justify-content: center; }
.record.detail #contents .analysis .score-box > div .score img { width: 10.2vw; height: 10.2vw; }
.record.detail #contents .compare .compare-box { border: solid 1px #979797; border-radius: 1.3vw; overflow: hidden; }
.record.detail #contents .compare .compare-box .player { display: flex; justify-content: center; padding: 5.2vw 4.3vw; }
.record.detail #contents .compare .compare-box .player > div { width: 37%; font-size: 1.5rem; font-weight: bold; display: flex; flex-direction: column; justify-content: center; align-content: center; text-align: center; align-items: center; }
.record.detail #contents .compare .compare-box .player > div.vs { width: 26%; font-weight: 900; }
.record.detail #contents .compare .compare-box .player > div img { width: 16vw; height: 16vw; border-radius: 100%; }
.record.detail #contents .compare .compare-box .score {}
.record.detail #contents .compare .compare-box .score ul { display: flex; justify-content: center; padding: 2.3vw 4.3vw; }
.record.detail #contents .compare .compare-box .score ul:nth-child(odd) { background: #f7f7f7; }
.record.detail #contents .compare .compare-box .score ul li { width: 37%; font-size: 1.667rem; font-weight: bold; text-align: center; }
.record.detail #contents .compare .compare-box .score ul li.title { width: 26%; font-size: 1.25rem; text-align: center; font-weight: normal; }
.record.detail #contents .compare .compare-box .compare-target { height: 70vw; margin-top: -20vw; display: flex; justify-content: center; transform: scale(0.4); }
.record.detail #contents .compare .player-list { display: flex; align-items: center; overflow-x: auto; overflow-y: hidden; margin-bottom: 2.6vw; }
.record.detail #contents .compare .player-list > div { width: 13.5vw; margin: 1.3vw; flex: 0 0 auto; text-align: center; }
.record.detail #contents .compare .player-list > div img { width: 13.5vw; border-radius: 100%; }
.record.detail #contents .compare .player-list > div span { font-weight: 900; font-size: 1.083rem; }
.record.detail #contents .compare .player-list > div.active img { border: solid 3px #f1424c; box-sizing: border-box; }
/*.record.detail #contents .player-record { position: fixed; top: 15.5vw; left: 0; width: 100%; box-sizing: border-box; display: flex; align-items: center; padding: 1.3vw 0; background: #fff; box-shadow: 0 5px 9px 0 rgba(0, 0, 0, 0.15); z-index: 1; }*/
.record.detail #contents .player-record { position: fixed; left: 0; width: 100%; box-sizing: border-box; display: flex; align-items: center; padding: 1.3vw 0; background: #fff; box-shadow: 0 5px 9px 0 rgba(0, 0, 0, 0.15); z-index: 1; }
.record.detail #contents .player-record div { text-align: center; }
.record.detail #contents .player-record div.rank { width: 20%; position: relative; font-size: 1rem; font-weight: bold; color: #fff; }
.record.detail #contents .player-record div.rank > div { display: flex; justify-content: center; }
.record.detail #contents .player-record div.rank span { display: block; width: 8vw; height: 8vw; background: #080d2c; border-radius: 100%; display: flex; justify-content: center; align-items: center; line-height: 0; }
.record.detail #contents .player-record div.rank img { width: 13.4vw; }
.record.detail #contents .player-record div.rank img + span { position: absolute; top: 8.5vw; left: 6vw; color: #181818; background: none; display: block; }
.record.detail #contents .player-record div.name { width: 30%; font-size: 1.500rem; font-weight: bold; }
.record.detail #contents .player-record div.name > div { display: flex; }
.record.detail #contents .player-record div.name img { width: 7.5vw; margin-right: 1.3vw; }
.record.detail #contents .player-record div.score { width: 35%; font-size: 1.667rem; }
.record.detail #contents .player-record div.score em { font-style: normal; color: #f1424c; font-weight: bold; }
.record.detail #contents .player-record div.klsa { width: 15%; font-size: 1.667rem; font-weight: bold; }

.record div.point { width: 15px; height: 15px; color: #fff; font-size: 10px; font-family: 'TmonMonsori'; display: flex; justify-content: center; align-items: center; }
.record div.point.big { width: 10.2vw; height: 10.2vw; font-size: 1.667rem; }
.record div.point.bg-blue { background: url('/static/img/img-shot-blue@2x.png') no-repeat; background-size: cover; }
.record div.point.bg-green { background: url('/static/img/img-shot-green@2x.png') no-repeat; background-size: cover; }
.record div.point.bg-orange { background: url('/static/img/img-shot-orange@2x.png') no-repeat; background-size: cover; }
.record div.point.bg-red { background: url('/static/img/img-shot-red@2x.png') no-repeat; background-size: cover; }
.record div.point.bg-gray { background: url('/static/img/img-shot-gray@2x.png') no-repeat; background-size: cover; }

/*!*.record .search-wrap { position: fixed; top: 15.9vw; background: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; z-index: 1; display: none; }*!*/
/*.record .search-wrap { position: fixed; top: 0vw; background: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; z-index: 1; display: none; }*/
/*.record .search-wrap .search-box { position: fixed; top: -90vw; left: 0; width: 100%; box-sizing: border-box; background: #fff; padding: 0 2.6vw 5vw 2.6vw; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; }*/
/*.record .search-wrap .search-box .item p { font-size: 1.25rem; font-weight: bold; padding: 3vw 0; }*/
/*.record .search-wrap .search-box .item .btn-wrap { margin-top: 5.2vw; }*/
/*.record .search-wrap .search-box .item .btn-wrap a { font-size: 1.083em; padding: 2.1vw 0; color: #f1424c; border: solid 1px #f1424c; border-radius: 5vw; font-weight: normal; }*/
/*.record .search-wrap .search-box .item .btn-wrap a.active { color: #fff; font-weight: bold; background: #f1424c; }*/
/*.record .search-wrap .search-box .item .btn-wrap a.disabled { opacity: 0.3; }*/
/*.record .search-wrap .search-box .item .btn-wrap a + a { margin-left: 2.6vw; }*/
/*.record .search-wrap.open { display: block; }*/
/*!*.record .search-wrap.open .search-box { top: 15.9vw; }*!*/
/*.record .search-wrap.open .search-box { top: 0vw; }*/

/*.record .search-wrap { position: fixed; top: 15.9vw; background: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; z-index: 1; display: none; }*/
.search-wrap { position: fixed; top: 0vw; background: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; z-index: 1; display: none; }
.search-wrap .search-box { position: fixed; top: -90vw; left: 0; width: 100%; box-sizing: border-box; background: #fff; padding: 0 2.6vw 5vw 2.6vw; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; }
.search-wrap .search-box .item p { font-size: 1.25rem; font-weight: bold; padding: 3vw 0; }
.search-wrap .search-box .item .btn-wrap { margin-top: 5.2vw; }
.search-wrap .search-box .item .btn-wrap a { font-size: 1.083em; padding: 2.1vw 0; color: #f1424c; border: solid 1px #f1424c; border-radius: 5vw; font-weight: normal; }
.search-wrap .search-box .item .btn-wrap a.active { color: #fff; font-weight: bold; background: #f1424c; }
.search-wrap .search-box .item .btn-wrap a.disabled { opacity: 0.3; }
.search-wrap .search-box .item .btn-wrap a + a { margin-left: 2.6vw; }
.search-wrap.open { display: block; }
/*.search-wrap.open .search-box { top: 15.9vw; }*/
.search-wrap.open .search-box { top: 0vw; }

.ranking #contents.reg { text-align: center; }
.ranking #contents.reg img { width: 60vw; margin: 5vw 0 10vw 0; }
.ranking #contents.reg.stadium img { width: 84vw; }
.ranking #contents.reg div { font-size: 1.917rem; font-weight: bold; }
.ranking #contents.reg p { font-size: 1.250rem; margin: 10vw 0; }

.ranking #contents .btn-wrap.tab.wrap a { line-height: 12px; padding: 1.5vw 0; display: flex; justify-content: center; align-items: center; }
.ranking #contents .player-rank.my-rank { background: #080d2c; border-radius: 2.6vw; color: #fff; }
.ranking #contents .player-rank.my-rank table { border-top: 0; }
.ranking #contents .player-rank.my-rank table td { border-bottom: 0; }
.ranking #contents .player-rank.my-rank table .normal td.rank span { color: #fff; }
.ranking #contents .player-rank table { border-top: solid 1px #d1d1d1; }
.ranking #contents .player-rank table td.name { width:60%; }

.ranking.record.detail #contents .player-record { position: relative; top: auto; left: auto; }
.ranking.record.detail #contents .player-record div.name { width: 65%; padding-left: 5.2vw; box-sizing: border-box; }
.ranking.record.detail #contents .player-record div.klsa { padding-right: 5.2vw; box-sizing: border-box; }

.search #contents h2 { position: relative; font-size: 1.25rem; margin-bottom: 1.6vw; display: flex; align-items: center; }
.search #contents .no-data { text-align: center; }
.search #contents .no-data img { width: 38.5vw; margin-top: 5vw; }
.search #contents .no-data div { font-size: 1.917rem; font-weight: bold; margin: 5vw 0; }
.search #contents .no-data p { font-size: 1.250rem; padding-bottom: 5vw; }
.search #contents .stadium-list .item { position: relative; border: solid 1px #979797; border-radius: 1.3vw; padding: 2.6vw; }
.search #contents .stadium-list .item + .item { margin-top: 2.6vw; }
.search #contents .stadium-list .item .favorite { position: absolute; right: 2.6vw; top: 2.6vw; }
.search #contents .stadium-list .item .favorite img { width: 8.3vw; }
.search #contents .stadium-list .item .info { display: flex; justify-content: center; align-items: center; }
.search #contents .stadium-list .item .info img { width: 30vw; height: 18vw; margin-right: 2.6vw; }
.search #contents .stadium-list .item .info > div { width: calc(100% - 30vw); }
.search #contents .stadium-list .item .info > div .name { font-size: 1.5rem; font-weight: bold; }
.search #contents .stadium-list .item .info > div .addr { font-size: 1.167rem; margin-top: 1vw; }

.search #contents .search-wrap { margin-top: 2.6vw; }
.search #contents .search-wrap a { position: relative; width: 90vw; margin: 0 auto; border: solid 1px #a7a7a7; box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3); font-size: 1.333rem; padding: 3.1vw 0; border-radius: 7vw; display: block; text-indent: 5vw; background: #fff; }
.search #contents .search-wrap a span { color: rgba(24, 24, 24, 0.5); }
.search #contents .search-wrap a p { position: absolute; right: 2.5vw; top: 1.7vw; width: 9vw; height: 9vw; background: #f1424c; border-radius: 100%; display: flex; justify-content: center; align-items: center; }
.search #contents .search-wrap a p img { width: 9vw; }

.search #contents .search-input { position: relative; margin-top: 2.6vw; }
.search #contents .search-input input { width: 90vw; margin: 0 auto; border: solid 1px #a7a7a7; font-size: 1.333rem; padding: 3.1vw 0; border-radius: 7vw; display: block; text-indent: 5vw; }
.search #contents .search-input a { position: absolute; right: 9.5vw; top: 4.5vw; display: flex; justify-content: center; align-items: center; }
.search #contents .search-input a img { width: 4vw; }
.search #contents .search-result { margin-top: 2.6vw; }
.search #contents .search-result ul { padding: 0 5.2vw; }
.search #contents .search-result ul li { font-size: 1.333rem; padding: 2.6vw; border-bottom: solid 1px #e7e7e7; }
.search #contents .search-result ul li em { font-style: normal; color: #f1424c; }

.search #contents .stadium-modal { position: absolute; top: 210vw; width: 100%; background: #fff; box-shadow: 0 -4px 7px 1px rgba(0, 0, 0, 0.2); border-radius: 8vw 8vw 0 0; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; z-index: 9;}
.search #contents .stadium-modal.open { top: 40vw; }
.search #contents .stadium-modal > a { display: block; text-align: center; padding: 3vw 0; }
.search #contents .stadium-modal > a .bar { display: inline-block; background: #9a9a9a; width: 65px; height: 5px; border-radius: 2.5px; }
.search #contents .stadium-modal .stadium-list { height: 76vh; overflow-x: hidden; overflow-y: auto; padding: 0 2.6vw; }
.search #contents .stadium-modal .stadium-list .item { border: 0; border-bottom: solid 1px #e7e7e7; border-radius: unset; }
.search #contents .stadium-modal .stadium-list .item > div { position: relative; }
.search #contents .stadium-modal .stadium-list .item > div .favorite { right: 0; top: 0; }
.search #contents .stadium-modal .stadium-list .item > div.top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 2.6vw; }
.search #contents .stadium-modal .stadium-list .item > div.top p:first-child { color: #7b7b7b; }
.search #contents .stadium-modal .stadium-list .item > div.btn-wrap { margin: 2.6vw 0; }
.search #contents .stadium-modal .stadium-list .item > div.btn-wrap a { display: block; width: 33.3%; border: solid 1px #f1424c; font-size: 1.333rem; font-weight: bold; color: #f1424c; border-radius: 2.6vw; text-align: center; padding: 1.3vw 0; }
.search #contents .stadium-modal .stadium-list .item > div.btn-wrap a + a { margin-left: 1.3vw; }
.search #contents .stadium-modal .my-location { position: absolute; top: -20vw; right: 2.6vw; }
.search #contents .stadium-modal .my-location img { width: 13vw; }

.search #contents .stadium-info { height: 45%; padding: 5.2vw; overflow: hidden; }
.search #contents .stadium-info .item { position: relative; }
.search #contents .stadium-info .item .name { font-size: 1.5rem; font-weight: bold; }
.search #contents .stadium-info .item .name span { font-size: 1rem; font-weight: normal; }
.search #contents .stadium-info .item .addr { font-size: 1.167rem; margin: 1.3vw 0; }
.search #contents .stadium-info .item .etc { font-size: 1rem; }
.search #contents .stadium-info .item .etc em { font-style: normal; font-weight: bold; margin-left: 1.3vw; }
.search #contents .stadium-info .item .favorite { position: absolute; right: 0; top: 0; }
.search #contents .stadium-info .item .favorite img { width: 8.3vw; }
.search #contents .stadium-info .item .btn-wrap { margin: 5.2vw 0; }
.search #contents .stadium-info .item .btn-wrap a { display: block; width: 50%; border: solid 1px #f1424c; font-size: 1.333rem; font-weight: bold; color: #f1424c; border-radius: 2.6vw; text-align: center; padding: 1.3vw 0; }
.search #contents .stadium-info .item .btn-wrap a + a { margin-left: 1.3vw; }
.search #contents .stadium-info .photo .swiper-slide { width: 85vw; }
.search #contents .stadium-info .photo img { width: 100%; height: 26vh; }
.search #contents .stadium-info + #map { position: relative; height: 55%; }

.notice .list-wrap .item { padding: 5.2vw; border-bottom: solid 1px #979797; }
.notice .list-wrap .item .title { font-size: 1.500rem; font-weight: bold; }
.notice .list-wrap .item .cont { display: -webkit-box; width: 100%; height: 35px; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical;color: #7b7b7b;}
.notice .list-wrap .item .date { color: #7b7b7b; display: flex; justify-content: space-between;  margin-top: 10px;}
.notice .detail .subject { padding: 5.2vw; border-bottom: solid 1px #979797; }
.notice .detail .subject .title { font-size: 1.500rem; font-weight: bold; margin-bottom: 1.3vw; }
.notice .detail .subject .date { color: #7b7b7b; display: flex; justify-content: space-between;}
.notice .detail .contents { padding: 5.2vw; }

.faq .search-form { padding: 5.2vw; border-bottom: solid 1px #979797; }
.faq .search-input { position: relative; margin: 5.2vw 0; }
.faq .search-input input { position: relative; width: 90vw; margin: 0 auto; border: solid 1px #a7a7a7; font-size: 1.333rem; padding: 3.1vw 0; border-radius: 7vw; display: block; text-indent: 5vw; background: #fff; }
.faq .search-input a { position: absolute; right: 2.5vw; top: 1.7vw; width: 9vw; height: 9vw; background: #f1424c; border-radius: 100%; display: flex; justify-content: center; align-items: center; }
.faq .search-input a img { width: 9vw; }
.faq .list .item .title { font-size: 1.5rem; font-weight: bold; display: flex; justify-content: space-between; align-items: center; padding: 5.2vw; border-bottom: solid 1px #979797; }
.faq .list .item .title ion-icon { font-size: 1.8rem; }
.faq .list .item .cont { font-size: 1.250rem; padding: 5.2vw; border-bottom: solid 1px #979797; display: none; }
.faq .list .item.active { background: #fafafa; }
.faq .list .item.active .title { border: 0; }
.faq .list .item.active .cont { display: block; }

.customer #contents { text-align: center; }
.customer .txt { font-size: 1.5rem; font-weight: bold; margin: 20vw 0; }
.customer .kakao { font-size: 1.25rem; font-weight: bold; }
.customer .kakao a { display: flex; align-items: center; justify-content: center; background: #fae100; margin-top: 2.6vw; padding: 2.6vw 0; border-radius: 2.6vw; }
.customer .kakao a img { width: 10vw; }
.customer .edugun-tel { font-size: 1.25rem; font-weight: bold; margin-top: 10vw; }
.customer .edugun-tel .tel { font-size: 2.5rem; margin-top: 2.6vw; }

.agree .btn-wrap.tab { margin-top: 2.6vw; flex-wrap: wrap; }
.agree .btn-wrap.tab a { width: 30%; font-size: 1.083em; padding: 2.1vw 0; color: #f1424c; border: solid 1px #f1424c; border-radius: 5vw; font-weight: normal; margin-top: 2.6vw; }
.agree .btn-wrap.tab a.active { color: #fff; font-weight: bold; background: #f1424c; }
.agree .btn-wrap.tab a.disabled { opacity: 0.3; }
.agree .btn-wrap.tab a { margin-right: 2.6vw; }
.agree .btn-wrap.tab a:last-child { margin-right: 0; }
.agree .cont { padding: 2.6vw; background: #f8f8f8; font-size: 1.333rem; margin-top: 2.6vw; }

.modify .password-confirm { margin-top: 20vw; }
.modify .password-confirm .txt { font-size: 1.5rem; font-weight: bold; text-align: center; margin-bottom: 10vw; }
.modify .password-confirm .error-txt { display: block; margin-top: 2.6vw; }
.modify .user-info { position: relative; }
.modify .user-info .btn { position: absolute; bottom: 3vw; right: 2.6vw; width: 21vw; padding: 2vw 0; }
.modify .input-box input:disabled { background: #f8f8f8; }

.mypage .my-info { display: flex; justify-content: space-between; margin: 1.3vw 0 5vw; }
.mypage .my-info .photo-name { display: flex; justify-content: flex-start; font-weight: bold; }
.mypage .my-info .photo-name .photo { margin-right: 1.3vw; }
.mypage .my-info .photo-name .photo img { width: 17.5vw; }
.mypage .my-info .photo-name .name { font-size: 1.833rem; display: flex; flex-direction: column; justify-content: center; }
.mypage .my-info .photo-name .name .id { font-size: 1.5rem; }
.mypage .my-info .badge { }
.mypage .my-info .badge p { display: flex; align-items: center; justify-content: flex-end; }
.mypage .my-info .badge p a { margin-right: 1.3vw; }
.mypage .my-info .badge p a img { width: 5.2vw; }
.mypage .my-info .badge p img { width: 13.3vw; }
.mypage .my-awards { background: #080d2c; color: #fff; border-radius: 3vw; text-align: center; padding: 2.5vw 0; margin-top: 5vw; }
.mypage .my-awards a { color: #fff; font-weight: bold; display: flex; align-items: center; justify-content: center; margin-bottom: 3vw; font-size: 1.333rem; }
.mypage .my-awards a img { width: 4.8vw; margin-left: 1.3vw; }
.mypage .my-awards > div { display: flex; justify-content: space-around; align-content: center; }
.mypage .my-awards > div .cnt { width: 13.3vw; height: 10.3vw; text-align: center; color: #181818; font-size: 1.417rem; font-weight: bold; display: flex; justify-content: center; align-items: center; padding-top: 3vw; }
.mypage .my-awards > div .rank0 .cnt { background: url('/static/img/img-red-jacket@2x.png') no-repeat; background-size: cover; padding-top: 1vw; height: 12.3vw; line-height: 6vw; }
.mypage .my-awards > div .rank0 .cnt span { display: block; width: 6vw; height: 6vw; margin: 0 auto; border-radius: 100%; background: rgba(255, 255, 255, 0.5); }
.mypage .my-awards > div .rank1 .cnt { background: url('/static/img/img-gold-medal@2x.png') no-repeat; background-size: cover; }
.mypage .my-awards > div .rank2 .cnt { background: url('/static/img/group-52-copy@2x.png') no-repeat; background-size: cover; }
.mypage .my-awards > div .rank3 .cnt { background: url('/static/img/group-52-copy-2@2x.png') no-repeat; background-size: cover; }

.error #contents > div { padding: 0 3.6vw; text-align: center; }
.error #contents > div .img img { width: 70vw; margin: 20vw 0 10vw 0; }
.error #contents > div .main-txt { font-size: 1.833rem; font-weight: bold; margin-bottom: 10vw; }
.error #contents > div .sub-txt { font-size: 1.250rem; }


.competition #contents h2 { position: relative; font-size: 1.25rem; margin-bottom: 1.6vw; display: flex; align-items: center; }
.competition #contents .btn-wrap.tab { margin-top: 5.2vw; }
.competition #contents .btn-wrap.tab a { font-size: 1.083em; padding: 2.1vw 0; color: #f1424c; border: solid 1px #f1424c; border-radius: 5vw; font-weight: normal; }
.competition #contents .btn-wrap.tab a.active { color: #fff; font-weight: bold; background: #f1424c; }
.competition #contents .btn-wrap.tab a.disabled { opacity: 0.3; }
.competition #contents .btn-wrap.tab a + a { margin-left: 2.6vw; }

.competition .list .item { padding: 5vw; border-bottom: solid 1px #979797; }
.competition .list .item .title { font-size: 1.5rem; font-weight: bold; }
.competition .list .item .title .type-01 { color: #f1424c; font-size: 1.167rem; background: rgba(241, 66, 76, 0.2); border-radius: 3vw; padding: 0vw 2vw; }
.competition .list .item .type-01 { color: #f1424c; font-size: 1.167rem; background: rgba(241, 66, 76, 0.2); border-radius: 3vw; padding: 0vw 2vw; font-weight: bold;}
.competition .list .item .title .type-02 { color: #1e35c4; font-size: 1.167rem; background: rgba(30, 53, 196, 0.1); border-radius: 3vw; padding: 0vw 2vw; }
.competition .list .item .place { font-size: 1.250rem; display: flex; justify-content: flex-start; align-items: center; margin: 1vw 0 2.5vw; }
.competition .list .item .place img { width: 3.9vw; margin-right: 1vw; }
.competition .list .item .info { padding: 4vw; border-radius: 5px; background: #f8f8f8; display: flex; justify-content: space-between; align-items: center; }
.competition .list .item .info .region { font-size: 1.250rem; }
.competition .list .item .info .region em { font-style: normal; font-weight: bold; font-size: 1.083rem; margin-right: 2vw; }
.competition .list .item .info .btn-01 { display: block; font-size: 1.167rem; font-weight: bold; color: #f1424c; background: #fff; border: solid 1px #f1424c; padding: 2.5vw 2vw; border-radius: 2.5vw; }
.competition .list .item .info .btn-02 { display: block; font-size: 1.167rem; font-weight: bold; color: #fff; background: #dcdcdc; border: solid 1px #dcdcdc; padding: 2.5vw 2vw; border-radius: 2.5vw; }
/*.competition .list .item .info .btn-01 a { display: block; font-size: 1.167rem; font-weight: bold; color: #f1424c; background: #fff; border: solid 1px #f1424c; padding: 2.5vw 2vw; border-radius: 2.5vw; }*/
/*.competition .list .item .info .btn-02 a { display: block; font-size: 1.167rem; font-weight: bold; color: #fff; background: #dcdcdc; border: solid 1px #dcdcdc; padding: 2.5vw 2vw; border-radius: 2.5vw; }*/
.competition .list.type-02 .item .info { padding: 2vw; }
/*.competition .list.type-02 .item .info .btn-01 { width: 18vw; padding: 1vw; text-align: center; }*/
.competition .list.type-02 .item .info .btn-02 { width: 18vw; padding: 1vw; text-align: center; }
.competition .list.type-02 .item .info .btn-01 { width: 18vw; padding: 1vw; text-align: center; }
.competition .list.type-02 .item .info .btn-02 { width: 18vw; padding: 1vw; text-align: center; }
/*.competition .list.type-02 .item .info .btn-01 a { width: 18vw; padding: 1vw; text-align: center; }*/
/*.competition .list.type-02 .item .info .btn-02 a { width: 18vw; padding: 1vw; text-align: center; }*/

.competition .detail .detail-info { padding: 5vw; border-bottom: solid 1px #979797; }
.competition .detail .detail-info .title { font-size: 1.5rem; font-weight: bold; }
.competition .detail .detail-info .title .type-01 { color: #f1424c; font-size: 1.167rem; background: rgba(241, 66, 76, 0.2); border-radius: 3vw; padding: 0vw 2vw; }
.competition .detail .detail-info .title .type-02 { color: #1e35c4; font-size: 1.167rem; background: rgba(30, 53, 196, 0.1); border-radius: 3vw; padding: 0vw 2vw; }
.competition .detail .detail-info .info { font-size: 1.250rem; }
.competition .detail .detail-info .info > div { margin-left: 2vw; margin-top: 1.5vw; }
.competition .detail .detail-info .info a { display: inline-block; font-weight: bold; background: #f1424c; color: #fff; padding: 0 2vw; border-radius: 1.5vw; margin-left: 2vw; }
.competition .detail .detail-info .info img { width: 2.5vw; margin-right: 1vw; }
.competition .detail .detail-info .info em { font-style: normal; font-weight: bold; font-size: 1.083rem; margin-right: 2vw; }
.competition .detail .detail-content { padding: 5vw 5vw 5vw 0; font-size: 1.250rem; }
.competition .detail .detail-content-group { font-size: 1.250rem; background: #f8f8f8; margin: 0 4vw 4vw 4vw; padding: 2vw;}
.competition .detail .detail-content img { max-width: 100%; }
.competition .detail .content-badge span { margin: 4vw; color: #333333; font-size: 1.167rem; background: #ffc000; border-radius: 3vw; padding: 0vw 2vw; }

.competition .detail-map .map-info { background: #fff; padding: 5vw; }
.competition .detail-map .map-info .title { font-size: 1.5rem; font-weight: bold; }
.competition .detail-map .map-info .place { font-size: 1.250rem; display: flex; justify-content: flex-start; align-items: center; margin: 2.5vw 0; }
.competition .detail-map .map-info .place img { width: 3.9vw; margin-right: 1vw; }
.competition .detail-map .map-info .addr { color: #7b7b7b; font-size: 1.250rem; }

.competition .list2 { padding: 5vw; }
.competition .list2 .item { border: solid 1px #979797; border-radius: 1.5vw; margin-bottom: 4vw; padding: 3vw; }
.competition .list2 .item a { display: flex; justify-content: space-between; }
.competition .list2 .item .info > div { font-size: 1.167rem; }
.competition .list2 .item .info .title { font-size: 1.417rem; font-weight: bold; }
.competition .list2 .item .status { text-align: center; border: solid 1px; padding: 0 4vw; border-radius: 2.5vw; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.competition .list2 .item .status p { font-weight: bold; }
.competition .list2 .item .status p:first-child { font-size: 1.167rem; }
.competition .list2 .item .status p em { font-style: normal; font-size: 1.667rem; margin-right: 1vw; }
.competition .list2 .item.type-01 .status { border-color: #f1424c; }
.competition .list2 .item.type-01 .status p:first-child { color: #f1424c; }
.competition .list2 .item.type-01 .status p em { color: #f1424c; }
.competition .list2 .item.type-02 .status { border-color: #f1424c; }
.competition .list2 .item.type-02 .status p { color: #f1424c; }
.competition .list2 .item.type-02 .status p em { color: #f1424c; }
.competition .list2 .item.type-03 { opacity: 0.3; }
.competition .list2 .item.type-03 .status { border-color: #181818; background: #181818; }
.competition .list2 .item.type-03 .status p { color: #fff; }
.competition .list2 .item.type-04 .status { border-color: #f1424c; background: #f1424c; }
.competition .list2 .item.type-04 .status p { color: #fff; }
.competition .list2 .item .arrow { display: flex; justify-content: center; align-items: center; }
.competition .list2 .item .arrow img { width: 13vw; }

.competition .detail2 > div { padding: 5vw; }
.competition .detail2 .title { font-size: 1.5rem; font-weight: bold; }
.competition .detail2 .title .type-01 { color: #f1424c; font-size: 1.167rem; background: rgba(241, 66, 76, 0.2); border-radius: 3vw; padding: 0vw 2vw; }
.competition .detail2 .title .type-02 { color: #1e35c4; font-size: 1.167rem; background: rgba(30, 53, 196, 0.1); border-radius: 3vw; padding: 0vw 2vw; }
.competition .detail2 .item { border: solid 1px #979797; border-radius: 1.5vw; margin-bottom: 4vw; padding: 3vw; }
.competition .detail2 .item .info > div { font-size: 1.167rem; }
.competition .detail2 .item .info .title { font-size: 1.417rem; font-weight: bold; }
.competition .detail2 .detail-info > div { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4vw; }
.competition .detail2 .detail-info > div span { font-weight: bold; }
.competition .detail2 .detail-info > div span:last-child { font-size: 1.667rem; }
.competition .detail2 .detail-info > div span em { font-style: normal; }
.competition .detail2 .detail-info > div span img { width: 4.5vw; margin-right: 2.6vw; }
.competition .detail2 .detail-info .pay { display: block; border-top: solid 1px #979797; padding-top: 2.6vw; }
.competition .detail2 .detail-info .pay > div { margin-top: 2.6vw; }
.competition .detail2 .detail-info .pay ul { background: #f8f8f8; padding: 2.6vw; }
.competition .detail2 .detail-info .pay ul li { font-size: 1.250rem; margin-bottom: 4vw; }
.competition .detail2 .detail-info .pay ul li:last-child { margin-bottom: 0; }
.competition .detail2 .detail-info.border-top { border-top: solid 1px #979797; padding-top: 4vw; }

.competition .player-rank { margin-top: 5.2vw; }
.competition .player-rank table tr td { padding: 1.6vw 0; }
.competition .player-rank table td { border-bottom: solid 1px #d1d1d1; text-align: center; }
.competition .player-rank table td.rank { width: 20%; position: relative; font-size: 1rem; font-weight: bold; color: #fff; }
.competition .player-rank table td.rank > div { display: flex; justify-content: center; }
.competition .player-rank table td.rank span { display: block; width: 8vw; height: 8vw; background: #080d2c; border-radius: 100%; display: flex; justify-content: center; align-items: center; line-height: 0; }
.competition .player-rank table td.rank img { width: 13.4vw; }
.competition .player-rank table td.rank img + span { position: absolute; top: 10.1vw; left: 6vw; color: #181818; background: none; display: block; }
.competition .player-rank table td.rank.bg-none span { width: auto; height: auto; background: none; color: #181818; }
.competition .player-rank table td.name { width: 50%; font-size: 1.500rem; font-weight: bold; text-align: left; }
.competition .player-rank table td.name > div { display: flex; flex-direction: column; justify-content: flex-start; }
.competition .player-rank table td.name span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.competition .player-rank table td.name span:last-child { font-weight: normal; font-size: 1.167rem; }
.competition .player-rank table td.score { width: 15%; font-size: 1.667rem; font-weight: bold; }
.competition .player-rank table td.score.etc { font-weight: normal; font-size: 1.250rem; color: #7b7b7b; }
.competition .player-rank table td.arrow { width: 15%; }
.competition .player-rank table td.arrow img { width: 13vw; vertical-align: middle; }
.competition .player-rank table tr.active td { color: #f1424c; }
.competition .player-rank table tr.active td.rank span { background: #f1424c; color: #fff; }
.competition .player-rank table tr.active td.rank img + span { background: none; color: #181818; }

.competition.record .item-box { flex-wrap: wrap; }
.competition.record .item-box > div { width: calc(50% - 10vw); justify-content: space-between !important; }
.competition.record .item-box > div:nth-child(odd) { margin-right: 10vw; }

/*.competition.record #contents .player-record { position: fixed; top: 16vw; left: 0; width: 100%; box-sizing: border-box; display: flex; align-items: center; padding: 1.3vw 0; background: #fff; box-shadow: 0 5px 9px 0 rgba(0, 0, 0, 0.15); z-index: 1; }*/
.competition.record #contents .player-record { position: fixed;left: 0; width: 100%; box-sizing: border-box; display: flex; align-items: center; padding: 1.3vw 0; background: #fff; box-shadow: 0 5px 9px 0 rgba(0, 0, 0, 0.15); z-index: 1; }
.competition.record #contents .player-record div { text-align: center; }
.competition.record #contents .player-record div.rank { width: 20%; position: relative; font-size: 1rem; font-weight: bold; color: #fff; }
.competition.record #contents .player-record div.rank > div { display: flex; justify-content: center; }
.competition.record #contents .player-record div.rank span { display: block; width: 8vw; height: 8vw; background: #080d2c; border-radius: 100%; display: flex; justify-content: center; align-items: center; line-height: 0; }
.competition.record #contents .player-record div.rank img { width: 13.4vw; }
.competition.record #contents .player-record div.rank img + span { position: absolute; top: 8.5vw; left: 6vw; color: #181818; background: none; display: block; }
.competition.record #contents .player-record div.name { width: 60%; font-size: 1.500rem; font-weight: bold; }
.competition.record #contents .player-record div.name > div { display: flex; flex-direction: column; justify-content: flex-start; }
.competition.record #contents .player-record div.name > div span { text-align: left; }
.competition.record #contents .player-record div.name > div span:last-child { font-weight: normal; font-size: 1.167rem; }
.competition.record #contents .player-record div.score { width: 20%; font-size: 1.667rem; font-weight: bold; }

.competition .live-list { padding: 5vw; }
.competition .live-list .place { font-size: 1.083rem; display: flex; justify-content: flex-start; align-items: center; margin: 1vw 0 2.5vw; font-weight: bold; }
.competition .live-list .place img { width: 3.9vw; margin-right: 1vw; }
.competition .live-list .item { position: relative; border: solid 1px #979797; border-radius: 1.5vw; margin-bottom: 4vw; padding: 3vw; }
.competition .live-list .item a { display: flex; justify-content: space-between; }
.competition .live-list .item .line { width: 7vw; height: 100%; background: #080d2c; color: #fff; font-weight: bold; font-size: 1.167rem; position: absolute; top: 0; left: 0; border-radius: 1.5vw 0 0 1.5vw; display: flex; justify-content: center; align-items: center; text-align: center; }
.competition .live-list .item .info { padding-left: 7vw; }
.competition .live-list .item .info > div { font-size: 1.167rem; }
.competition .live-list .item .info .title { font-size: 1.417rem; font-weight: bold; }
.competition .live-list .item .status { text-align: center; border: solid 1px; padding: 0 4vw; border-radius: 2.5vw; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.competition .live-list .item .status p { font-weight: bold; }
.competition .live-list .item .status p:first-child { font-size: 1.167rem; }
.competition .live-list .item .status p em { font-style: normal; font-size: 1.667rem; margin-right: 1vw; }
.competition .live-list .item .arrow { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-end; }
.competition .live-list .item .arrow img { position:absolute; right:0; bottom: 0; width: 13vw; }
.competition .live-list .item .arrow .score { font-size: 1.667rem; font-weight: bold; }
.competition .live-list .item .arrow .personnel { font-size: 1.250rem; }
.competition .live-list .item .arrow .personnel em { font-style: normal; color: #f1424c; }

.competition.record #contents .live-player { width: 100%; box-sizing: border-box; padding: 2.5vw 5vw; background: #fff; box-shadow: 0 5px 9px 0 rgba(0, 0, 0, 0.15); z-index: 1; }
.competition.record #contents .live-player .item { position: relative; padding: 3vw; display: flex; justify-content: space-between; }
.competition.record #contents .live-player .item .line { width: 7vw; height: 100%; background: #080d2c; color: #fff; font-weight: bold; font-size: 1.167rem; position: absolute; top: 0; left: 0; display: flex; justify-content: center; align-items: center; text-align: center; }
.competition.record #contents .live-player .item .info { padding-left: 7vw; }
.competition.record #contents .live-player .item .info > div { font-size: 1.167rem; }
.competition.record #contents .live-player .item .info .title { font-size: 1.417rem; font-weight: bold; }
.competition.record #contents .live-player .item .arrow { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; }
.competition.record #contents .live-player .item .arrow img { position:absolute; right:0; bottom: 0; width: 13vw; }
.competition.record #contents .live-player .item .arrow .score { font-size: 1.667rem; font-weight: bold; }
.competition.record #contents .live-player .item .arrow .personnel { font-size: 1.250rem; }
.competition.record #contents .live-player .item .arrow .personnel em { font-style: normal; color: #f1424c; }
.competition.record #contents .reload-time { margin-top: 0; }

.competition .my-list { padding: 5vw; }
.competition .my-list .place { font-size: 1.083rem; display: flex; justify-content: flex-start; align-items: center; margin: 1vw 0 2.5vw; font-weight: bold; }
.competition .my-list .place img { width: 3.9vw; margin-right: 1vw; }
.competition .my-list .item { position: relative; border: solid 1px #979797; border-radius: 1.5vw; margin-bottom: 4vw; padding: 3vw; }
.competition .my-list .item a { display: flex; justify-content: space-between; }
.competition .my-list .item .info > div { font-size: 1.167rem; }
.competition .my-list .item .info .title { font-size: 1.417rem; font-weight: bold; }
.competition .my-list .item .arrow { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-end; }
.competition .my-list .item .arrow img { position:absolute; right:0; bottom: 0; width: 13vw; }
.competition .my-list .item .arrow .score { font-size: 1.667rem; font-weight: bold; }
.competition .my-list .item .arrow .score.etc { color: #7b7b7b; }
.competition .my-list .rank { position: relative; font-size: 1rem; font-weight: bold; color: #fff; }
.competition .my-list .rank.top-rank { margin-left: -2.6vw; }
.competition .my-list .rank > div { display: flex; justify-content: center; }
.competition .my-list .rank span { display: block; width: 8vw; height: 8vw; background: #080d2c; border-radius: 100%; display: flex; justify-content: center; align-items: center; line-height: 0; margin-right: 2.6vw; }
.competition .my-list .rank img { width: 13.4vw; }
.competition .my-list .rank img + span { position: absolute; top: 8.3vw; left: 4.5vw; color: #181818; background: none; display: block; }
.competition .my-list .item .info .name { display: flex; justify-content: flex-start; align-items: center; }

.competition .coin-info { padding: 2.6vw 5vw; }
.competition .coin-info .current-coin { padding: 2.6vw 0; border: solid 1px #979797; border-radius: 1.6vw; display: flex; justify-content: center; align-items: center; }
.competition .coin-info .current-coin img { width: 7.5vw; margin-right: 2.6vw; }
.competition .coin-info .current-coin em { font-weight: bold; font-size: 2.917rem; font-style: normal; }
.competition .coin-list { border-top: solid 1px #d1d1d1; }
.competition .coin-list .item { display: flex; justify-content: space-between; align-items: flex-start; border-bottom: solid 1px #d1d1d1; padding: 2vw 5vw; }
.competition .coin-list .item > div p { font-size: 1.667rem; font-weight: bold; }
.competition .coin-list .item > div:last-child { text-align: right; }
.competition .coin-list .item > div.use p { color: #f1424c; }
.competition .coin-list .item > div.refund p { color: #a1a1a1; }
.competition .coin-list .item > div > p:last-child { font-size: 1.167rem; font-weight: normal; }

.competition .amount-detail { padding: 5vw; }
.competition .amount-detail .amount { display: flex; justify-content: center; align-items: center; padding: 15vw 0; border-bottom: solid 1px #979797; }
.competition .amount-detail .amount img { width: 7.5vw; margin-right: 2.6vw; }
.competition .amount-detail .amount em { font-weight: bold; font-size: 2.917rem; font-style: normal; }
.competition .amount-detail .amount span { font-weight: bold; font-size: 1.667rem; margin-left: 2.6vw; }
.competition .amount-detail .info { margin-top: 2.6vw; }
.competition .amount-detail .info .item { display: flex; justify-content: space-between; align-items: center; padding: 2.6vw 0; }
.competition .amount-detail .info .item div { font-weight: bold; font-size: 1.083rem; }
.competition .amount-detail .info .item div:last-child { font-size: 1.667rem; text-align: right; }
.competition .amount-detail .info .item div img { width: 4.5vw; }

.competition .charge {}
.competition .charge .amounts { }
.competition .charge .amounts .item { display: flex; justify-content: space-between; align-items: center; font-size: 1.667rem; font-weight: bold; border: solid 1px #979797; border-radius: 1.5vw; padding: 3vw; margin-bottom: 2vw; }
.competition .charge .amounts .item img { width: 4.5vw; margin-right: 1.6vw; }
.competition .charge .amounts .item.active { color: #f1424c; border: solid 1px #f1424c; }
.competition .charge .info-txt { font-size: 1.250rem; }
.competition .charge .info-txt-intro { font-size: 1.250rem; }
.competition .charge .info-txt ul { background: #f8f8f8; padding: 5vw; }
.competition .charge .info-txt ul li { margin-bottom: 2.6vw; }
.competition .charge .info-txt-intro ul li { margin-bottom: 2.6vw;}
.competition .charge .info-txt-intro ul li input {font-size: 1.333rem; font-weight: bold;}

.competition .charge .amounts .intro_amount { display: flex; align-items: center; font-size: 1.667rem; font-weight: bold; border-radius: 1.5vw; margin-bottom: 2vw; padding-left: 2vw;}
.competition .charge .amounts img { width: 4.5vw; margin-right: 1.6vw; }

.competition .charge .info-txt.footer { font-size: 1rem; letter-spacing :0.00em; }
.competition .charge .info-txt.footer ul { background: #f8f8f8; padding: 2vw; border: 1px solid black;}
.competition .charge .info-txt.footer ul li { margin-bottom: 0vw; }