/* Font */
@font-face {
	font-family: 'Pretendard';
	font-weight: 900;
	font-display: swap;
	src: local('Pretendard Black'), url(../fonts/Pretendard-Black.subset.woff2) format('woff2'), url(../fonts/Pretendard-Black.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 800;
	font-display: swap;
	src: local('Pretendard ExtraBold'), url(../fonts/Pretendard-ExtraBold.subset.woff2) format('woff2'), url(../fonts/Pretendard-ExtraBold.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 700;
	font-display: swap;
	src: local('Pretendard Bold'), url(../fonts/Pretendard-Bold.subset.woff2) format('woff2'), url(../fonts/Pretendard-Bold.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 600;
	font-display: swap;
	src: local('Pretendard SemiBold'), url(../fonts/Pretendard-SemiBold.subset.woff2) format('woff2'), url(../fonts/Pretendard-SemiBold.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 500;
	font-display: swap;
	src: local('Pretendard Medium'), url(../fonts/Pretendard-Medium.subset.woff2) format('woff2'), url(../fonts/Pretendard-Medium.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 400;
	font-display: swap;
	src: local('Pretendard Regular'), url(../fonts/Pretendard-Regular.subset.woff2) format('woff2'), url(../fonts/Pretendard-Regular.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 300;
	font-display: swap;
	src: local('Pretendard Light'), url(../fonts/Pretendard-Light.subset.woff2) format('woff2'), url(../fonts/Pretendard-Light.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 200;
	font-display: swap;
	src: local('Pretendard ExtraLight'), url(../fonts/Pretendard-ExtraLight.subset.woff2) format('woff2'), url(../fonts/Pretendard-ExtraLight.subset.woff) format('woff');
}

@font-face {
	font-family: 'Pretendard';
	font-weight: 100;
	font-display: swap;
	src: local('Pretendard Thin'), url(../fonts/Pretendard-Thin.subset.woff2) format('woff2'), url(../fonts/Pretendard-Thin.subset.woff) format('woff');
}

@font-face {
	font-family: 'BebasNeue-Regular';
	font-display: swap;
	src:url(../fonts/BebasNeue-Regular.woff2) format('woff2'), url(../fonts/BebasNeue-Regular.woff) format('woff');
}

@font-face {
    font-family: 'GyeonggiTitle';
    src: url(../fonts/GyeonggiTitle-Bold.otf) format('opentype');
    font-style: normal;
}


/*-------- css reset -------*/


* {margin: 0; padding: 0;}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td, tr {margin: 0; padding: 0;}
img {border: 0; vertical-align: middle;}
ol, ul, li {list-style: none;}
h1, h2, h3, h4, h5, h6 {font-size: 100%;}
body {font-size: 16px; font-family: "돋움", 'Dotum', 'Helvetica Neue BD', 'Malgun Gothic', '"Apple SD Gothic Neo"', sans-serif;}
fieldset {border: medium none;}
a {text-decoration: none; cursor: pointer;}
em {font-style: normal;}
html {height: 100vh; overflow-x: auto; overflow-y: auto;}
button {border:none; cursor: pointer;}
button:hover,
button:active {transition: all 0s;}
input:focus,
select:focus,
textarea:focus {outline: none;}
table {border-collapse:collapse; border-spacing:0;}
.pointer {cursor:pointer;}
/* css reset end */


.layout {
  position:sticky;
  width:100%;
  min-width:1230px;
  background: url('../images/renewal/bg-base.webp') 50% top no-repeat;
  background-size:cover;
  border-bottom:2px solid #ed3645;
}

.header {
  display:block;
  width:100%;
}

.header .bar-login {
	width:100%;
	background: url('../images/renewal/header/bar-login.webp') right 50% no-repeat #110000;
	background-size:cover;
}

.header .bar-login > div {
	display:flex;
	justify-content: space-between;
  align-items: center;
	
	width:1230px;
	height:96px;
	margin:0 auto;
}

.header .logo {
	width:188px;
	height:28px;
	font-size:0;
	background: url('../images/renewal/logo.webp') 50% 50% no-repeat;
  cursor:pointer;
}

.header form > button {
	display:inline-flex;
	align-items: center;
  justify-content: flex-end;
    
	padding:2px 26px 0 0;
	width:120px;
	height:40px;
	line-height:100%;
	font-family: 'Pretendard';
	font-weight:600;
	color:#fff;
	font-size:1rem;
	text-align:right;
	border:none;
}

.header .btn-login {
	background: url('../images/renewal/header/btn-login.webp') 50% 50% no-repeat;
  margin-right:0.5rem;
}

.header .btn-join {
	background: url('../images/renewal/header/btn-join.webp') 50% 50% no-repeat;
}

.header .bar-login .login-after {
  display:inline-flex;
  align-items: center;
  gap:0.5rem;

  line-height:100%;
  font-family: 'Pretendard';
}

.header .bar-login .login-after > span {
  color:#fff;
}

.header .bar-login .login-after .txt-nick i img{
  width:1.425rem;
}

.header .bar-login .login-after .txt-nick,
.header .bar-login .login-after .txt-money {
	font-weight:500;
	color:#fff;
  font-size:1rem;
}

.header .bar-login .login-after .txt-nick > span:last-child,
.header .bar-login .login-after .txt-money > span:first-child {
  color:#f94352;
}

.header .bar-login .login-after > button {
	display:inline-flex;
	align-items: center;
  justify-content: flex-end;
  
	width:120px;
	height:40px;
	line-height:100%;
	font-family: 'Pretendard';
	font-weight:600;
	color:#fff;
	font-size:1rem;
	text-align:right;
	border:none;
}

.header .btn-mypage {
  padding:2px 12px 0 0;
	background: url('../images/renewal/header/btn-mypage.webp') 50% 50% no-repeat;
}

.header .btn-logout {
  padding:2px 20px 0 0;
	background: url('../images/renewal/header/btn-logout.webp') 50% 50% no-repeat;
}


.header .bar-gnb .gnb > div {
	display:block;
	width:100%;
	max-width:1230px;
	margin:0 auto;
}

.header .bar-gnb .gnb ul {
	display:flex;
	align-items: center;
  gap:1.5rem;
}

.header .bar-gnb .gnb .change-mode {
	margin-left:auto;
}

.header .bar-gnb .gnb li > a {
  display:inline-flex;
  align-items: center;
  justify-content: center;
  gap:0.25rem;

  height:4.625rem;
  font-size:0.875rem;
  transition: all 0.2s;
}

.header .bar-gnb .gnb li i {
  width:3.25rem;
  height:3.25rem;
}

.icon-del > i {
  display:none;
}

.header .bar-gnb .gnb li span {
 color:#868686;
 font-family: 'Pretendard';
 font-weight:700;
}
.header .bar-gnb .gnb li a.current span,
.header .bar-gnb .gnb li a:hover span {
  color:#fe434e;
 }
 
.icon-home > i {background: url('../images/renewal/header/gnb-home.webp') 50% 50% no-repeat; background-size:contain !important;}
.icon-live > i {background: url('../images/renewal/header/gnb-casino.webp') 50% 50% no-repeat; background-size:contain !important;}
.icon-slot > i {background: url('../images/renewal/header/gnb-slot.webp') 50% 50% no-repeat; background-size:contain !important;}
.icon-holdem > i {background: url('../images/renewal/header/gnb-holdem.webp') 50% 50% no-repeat; background-size:contain !important;}
.icon-mini > i {background: url('../images/renewal/header/gnb-mini.webp') 50% 50% no-repeat; background-size:contain !important;}
.icon-sport > i {background: url('../images/renewal/header/gnb-sport.webp') 50% 50% no-repeat; background-size:contain !important;}
.icon-mobile > i {background: url('../images/renewal/header/gnb-mobile.webp') 50% 50% no-repeat;}

.header .bar-gnb .gnb li a.current.icon-home > i,
.header .bar-gnb .gnb li a:hover.icon-home > i {background: url('../images/renewal/header/gnb-home-over.webp') 50% 50% no-repeat; background-size:contain !important;}
.header .bar-gnb .gnb li a.current.icon-live > i,
.header .bar-gnb .gnb li a:hover.icon-live > i {background: url('../images/renewal/header/gnb-casino-over.webp') 50% 50% no-repeat; background-size:contain !important;}
.header .bar-gnb .gnb li a.current.icon-slot > i,
.header .bar-gnb .gnb li a:hover.icon-slot > i {background: url('../images/renewal/header/gnb-slot-over.webp') 50% 50% no-repeat; background-size:contain !important;}
.header .bar-gnb .gnb li a.current.icon-holdem > i,
.header .bar-gnb .gnb li a:hover.icon-holdem> i {background: url('../images/renewal/header/gnb-holdem-over.webp') 50% 50% no-repeat; background-size:contain !important;}
.header .bar-gnb .gnb li a.current.icon-mini > i,
.header .bar-gnb .gnb li a:hover.icon-mini > i {background: url('../images/renewal/header/gnb-mini-over.webp') 50% 50% no-repeat; background-size:contain !important;}
.header .bar-gnb .gnb li a.current.icon-sport > i,
.header .bar-gnb .gnb li a:hover.icon-sport> i {background: url('../images/renewal/header/gnb-sport-over.webp') 50% 50% no-repeat; background-size:contain !important;}


.header .bar-gnb .gnb .m-menu {
	display:none;
}

/* contents */
.contents {
  display:block;
  width:100%;
  min-width:1230px;
  margin:0 auto;
}

.visual-banner {
	display:flex;
  position: relative;
  width:100%;
  height:750px;
  background: url('../images/renewal/banner/bg-main-banner.webp') 50% 50% no-repeat;
  margin:0 auto;
}

.visual-banner .main-visual {
  position:relative;

  display:block;
	width:100%;
	height:633px;	
}

.visual-banner .img-banner-main {
  position:absolute;
  left:calc(50% - 664px);
  bottom:0;

  z-index:10;

  width:664px;
  height:595px;
  background: url('../images/renewal/banner/img-banner-main.webp') 50% 50% no-repeat;

  animation-duration: 2s;
  animation-name: fade-main;
}

@keyframes fade-main {
  0% {background-position:-332px bottom; opacity:0;}
  100% {background-position:50% bottom; opacity:1;}
}

.visual-banner .main-visual .banner-event {
  position: absolute;
  left: calc(50% - 376px);
  top: calc(50% + 58px);
  z-index:0;

  padding-left:376px;
  width: 567px;
  height: 313px;

  background: url('../images/renewal/banner/bg-banner-event.webp') 50% 50% no-repeat;
  transform: translate(0, -50%);

  animation-duration:1.5s;
  animation-name: fade-main-event;
}

@keyframes fade-main-event {
  0% {left:100%; background-position:2800px; opacity:0;}
  50% {opacity:0;}
  100% {left: calc(50% - 376px); background-position:50%; opacity:1;}
}

.visual-banner .main-visual .banner-event div.swiper-horizontal {
  padding:0 2rem 0 0;
  width:530px;
  height:calc(100% - 2rem);
  animation-duration:0.8s;
  animation-name: fade-main-event2;
  margin-top:0.875rem;
}

@keyframes fade-main-event2 {
  0% {background-position:100%s bottom; opacity:0;}
  100% {background-position:50% bottom; opacity:1;}
}

.visual-banner .main-visual .banner-event div.swiper-slide {
  display:inline-flex;
  align-items: center;
  justify-content: center;
}

.visual-banner .main-visual .banner-event div.swiper-slide img {
  max-height:224px;
}

.visual-banner .main-visual .banner-event div.swiper-slide-mt img {
  margin-top:0.875rem;
}

.visual-banner .main-visual .banner-event div.swiper-pagination {
  top: auto;
  right: 2rem;
  bottom: 1rem;
  left: auto;
  width: auto;
}

.visual-banner .main-visual .banner-event div.swiper-pagination span.swiper-pagination-bullet {
  width:0.75rem;
  height:0.75rem;
  background:#717171;
  opacity:1;
  transition: all 0.1s;
  border-radius:10in;
}

.visual-banner .main-visual .banner-event div.swiper-pagination span.swiper-pagination-bullet-active {
  width:1.875rem;
  background: linear-gradient(to top, #ff424c, #fd7d5a)
}


.visual-banner .main-visual .banner-event .deco-event-chip {
  position: absolute;
  top: 5rem;
  right: -1.75rem;
  width: 5.125rem;
  height: 7.625rem;
  background: url(../images/renewal/banner/deco-event-chip.webp) 50% 50% no-repeat;
}


.bar-ctn-jackpot {
  margin-top:-127px;
}

.bar-ctn-jackpot .txt-jackpot-area {
  position:relative;
  display:block;
  width:1118px;
  height:137px;
  background: url('../images/renewal/contents/bar-jackpot.webp') 50% 50% no-repeat;
  margin:0 auto;
}

.bar-ctn-jackpot .txt-jackpot-area .odometer-formatting-mark, .odometer-digit-spacer, .odometer-value {
  font-size:4rem;
  background: url('../images/renewal/contents/img-color-jackpot.webp') 50% 50% no-repeat !important;
  color: transparent !important;
  background-clip: text !important;
}

.bar-ctn-jackpot .txt-jackpot-area .odometer-formatting-mark {
  padding-top:1rem;
}

.bar-notice {
  margin-top:30px;
}

.bar-notice > div {
  position:relative;
  display:block;
  padding:0 1.5rem 0 6rem;
  width:calc(1072px - 7.5rem);
  color:#353535;
  line-height:40px;
  font-family: 'Pretendard';
  font-size:0.912rem;
  letter-spacing:-0.5px;
  background: linear-gradient(#ffffff, #fff5f6);
  border:1px solid #ff404f;
  border-radius:10in;
  margin:0 auto;
}

.bar-notice > div > i {
  position:absolute;
  top:-29px;
  left:24px;

  width:62px;
  height:62px;
  background: url('../images/renewal/contents/icon-notice.webp') 50% 50% no-repeat;
  background-size:contain;
}

.bar-notice > div > p {
  display:flex;
  align-items:center;
  overflow:hidden;
}

.bar-notice > div > p span{
    display:inline-block;
    padding-right:20%;
    width: 100%;
    font-family: 'Pretendard';
    font-weight:700;
    color:#444;
    cursor: pointer;
    white-space: nowrap;
    letter-spacing:0.5px;
    
    animation: 30000ms linear 0s infinite both running slide-main-bar;
}


@keyframes slide-main-bar {
  0%   {transform: translateX(0)}
  100%   {transform: translateX(-100%)}
}



.contents-main-title {
  line-height:100%;
  text-align:center;
  font-family: 'Pretendard';
  font-weight:700;
  color:#9f9f9f;
  font-size:1.125rem;
  margin:90px 0 46px;
}

.contents-main-title p:nth-child(2) {
  display:flex;
  justify-content: space-between;
  align-items: center;

  max-width:1108px;
  height:3rem;
  font-weight:900;
  color:#e93342;
  font-size:2.75rem;
  margin:32px auto 12px;
}

.contents-main-title p:nth-child(2) > span:first-child {
  width:396px;
  height:21px;
  background: url('../images/renewal/contents/line-title.webp') 50% 50% no-repeat;
}

.contents-main-title p:nth-child(2) > span:last-child {
  width:396px;
  height:21px;
  background: url('../images/renewal/contents/line-title.webp') 50% 50% no-repeat;
  transform:scaleX(-1);
}

.contents-main-title p:nth-child(3) {
  font-size:1.425rem; 
}

.tab-best {
  display:flex;
  justify-content: center;
  align-items: center;

  margin-bottom:2.875rem;
}

.tab-best li {
  margin:0 -4px;
}

.tab-best button {
  width:180px;
  height:61px;
  transition: all 0.25s;
}

.tab-best button.tab-live {background: url('../images/renewal/contents/tab-live.webp') 50% 50% no-repeat;}
.tab-best button.tab-slot {background: url('../images/renewal/contents/tab-slot.webp') 50% 50% no-repeat;}
.tab-best button.tab-holdem {background: url('../images/renewal/contents/tab-holdem.webp') 50% 50% no-repeat;}
.tab-best button.tab-mini {background: url('../images/renewal/contents/tab-mini.webp') 50% 50% no-repeat;}
.tab-best button.tab-sport {background: url('../images/renewal/contents/tab-sport.webp') 50% 50% no-repeat;}
.tab-best button.tab-live-sport {background: url('../images/renewal/contents/tab-live-sport.webp') 50% 50% no-repeat;}

.tab-best button.tab-live:hover,
.tab-best button.tab-live.current {background: url('../images/renewal/contents/tab-live-current.webp') 50% 50% no-repeat;}
.tab-best button.tab-slot:hover,
.tab-best button.tab-slot.current {background: url('../images/renewal/contents/tab-slot-current.webp') 50% 50% no-repeat;}
.tab-best button.tab-holdem:hover,
.tab-best button.tab-holdem.current {background: url('../images/renewal/contents/tab-holdem-current.webp') 50% 50% no-repeat;}
.tab-best button.tab-mini:hover,
.tab-best button.tab-mini.current {background: url('../images/renewal/contents/tab-mini-current.webp') 50% 50% no-repeat;}
.tab-best button.tab-sport:hover,
.tab-best button.tab-sport.current {background: url('../images/renewal/contents/tab-sport-current.webp') 50% 50% no-repeat;}
.tab-best button.tab-live-sport:hover,
.tab-best button.tab-live-sport.current {background: url('../images/renewal/contents/tab-live-sport-current.webp') 50% 50% no-repeat;}

.main-game-area {
  position:relative;
  width:1108px;
  height:1259px;
  background: url('../images/renewal/contents/bg-best-game.webp') 50% 50% no-repeat;
  margin:0 auto;
}

.main-game-visual {
  display:flex;
  align-items: center;
  justify-content:space-between;
  padding:0 32px 0 88px;
}

.main-game-visual > div:first-child {
  display:flex;
  align-items: flex-start;
  flex-direction: column;
  gap:70px;
  padding-top: 70px;
}

.title-live-casino > div {
  width:228px;
  height:131px;
  background: url('../images/renewal/contents/img-live-title.webp') 50% 50% no-repeat;
}

.title-live-casino > button {
  display:inline-flex;
  justify-content: center;
   align-items: center;

  width:151px;
  height:61px;
  color:#fff;
  font-size:1rem;
  font-family: 'Pretendard';
  font-weight:600;
  background: url('../images/renewal/contents/btn-live-move.webp') 50% 50% no-repeat;
}

.title-live-casino > button:hover {
  animation: play-btn 1s linear 0s infinite alternate;
}

.title-slot > div {
  width:153px;
  height:131px;
  background: url('../images/renewal/contents/img-slot-title.webp') 50% 50% no-repeat;
}

.title-slot > button {
  display:inline-flex;
  justify-content: center;
   align-items: center;

  width:151px;
  height:61px;
  color:#fff;
  font-size:1rem;
  font-family: 'Pretendard';
  font-weight:600;
  background: url('../images/renewal/contents/btn-live-move.webp') 50% 50% no-repeat;
}

.title-slot > button:hover {
  animation: play-btn 1s linear 0s infinite alternate;
}

.title-holdem > div {
  width:153px;
  height:144px;
  background: url('../images/renewal/contents/img-holdem-title.webp') 50% 50% no-repeat;
}

.title-holdem > button {
  display:inline-flex;
  justify-content: center;
   align-items: center;

  width:151px;
  height:61px;
  color:#fff;
  font-size:1rem;
  font-family: 'Pretendard';
  font-weight:600;
  background: url('../images/renewal/contents/btn-live-move.webp') 50% 50% no-repeat;
}

.title-holdem > button:hover {
  animation: play-btn 1s linear 0s infinite alternate;
}

.title-mini > div {
  width:205px;
  height:144px;
  background: url('../images/renewal/contents/img-mini-title.webp') 50% 50% no-repeat;
}

.title-mini > button {
  display:inline-flex;
  justify-content: center;
   align-items: center;

  width:151px;
  height:61px;
  color:#fff;
  font-size:1rem;
  font-family: 'Pretendard';
  font-weight:600;
  background: url('../images/renewal/contents/btn-live-move.webp') 50% 50% no-repeat;
}

.title-mini > button:hover {
  animation: play-btn 1s linear 0s infinite alternate;
}

.title-sport > div {
  width:232px;
  height:144px;
  background: url('../images/renewal/contents/img-sport-title.webp') 50% 50% no-repeat;
  background-size:contain;
}

.title-sport > button {
  display:inline-flex;
  justify-content: center;
   align-items: center;

  width:151px;
  height:61px;
  color:#fff;
  font-size:1rem;
  font-family: 'Pretendard';
  font-weight:600;
  background: url('../images/renewal/contents/btn-live-move.webp') 50% 50% no-repeat;
}

.title-sport > button:hover {
  animation: play-btn 1s linear 0s infinite alternate;
}

@keyframes play-btn {
	0% {font-size:1rem;}
  50% {font-size:1.25rem; letter-spacing:-0.5px;}
	100% {font-size:1rem;}
}

.img-live-casino {
  width:626px;
  height:466px;
  background: url('../images/renewal/contents/img-live-visual.webp') 0px bottom no-repeat;

  animation-duration: 2s;
  animation-name: fade-live;
}

.img-slot-visual {
  width:555px;
  height:466px;
  background: url('../images/renewal/contents/img-slot-visual.webp') 0px 50% no-repeat;

  animation-duration: 2s;
  animation-name: fade-live;
}

.img-holdem-visual {
  width:626px;
  height:466px;
  background: url('../images/renewal/contents/img-holdem-visual.webp') 0px 50% no-repeat;

  animation-duration: 2s;
  animation-name: fade-live;
}

.img-mini-visual {
  width:522px;
  height:466px;
  background: url('../images/renewal/contents/img-mini-visual.webp') 0px 50% no-repeat;

  animation-duration: 2s;
  animation-name: fade-live;
}

.img-sport-visual {
  width:568px;
  height:466px;
  background: url('../images/renewal/contents/img-sport-visual.webp') 0px 50% no-repeat;

  animation-duration: 2s;
  animation-name: fade-live;
}

@keyframes fade-live {
  0% {background-position:703px bottom; opacity:0;}
  100% {background-position:50% bottom; opacity:1;}
}

.main-live-list {
  position:relative;
  width:1034px;
  height:100%;
  max-height:606px;
  margin:0 38px 0 36px;
}

.main-live-list .swiper {
  padding-right:12px;
  width: 100%;
  height: 100%;
  margin:0;
}

.main-live-list .swiper .swiper-wrapper {
  flex-wrap: wrap;
  justify-content: space-between;
}

.main-live-list .swiper-slide {
  width:242px !important;
  height:286px !important;
  margin-right: 0 !important;
}

.main-live-list .swiper-slide .thd-img:hover > img {
 width:100%;
}

.bar-deco {
  display:flex;
  justify-content:center;
  align-items:center;

  margin-top:60px;
}

i.icon-deco {
  width:150px;
  height:33px;

  background: url('../images/renewal/contents/icon-deco.webp') 50% 50% no-repeat;
}

i.icon-deco-slot {
  width:150px;
  height:33px;

  background: url('../images/renewal/contents/icon-deco-slot.webp') 50% 50% no-repeat;
}

i.icon-deco-holdem {
  width:150px;
  height:33px;

  background: url('../images/renewal/contents/icon-deco-holdem.webp') 50% 50% no-repeat;
}

.contents-about {
  display:block;
  width:1108px;
  height:1228px;
  background: url('../images/renewal/contents/bg-about.webp') 50% 50% no-repeat;
  margin:0 auto 30px;
}

.title-about-service {
  padding:5.125rem 2.125rem 1rem;
  margin:0 auto;
}

.title-about-service  p:nth-child(2) > span:first-child,
.title-about-service  p:nth-child(2) > span:last-child {
  width:366px;
  background-position:right 50%;
}

.about-service-visual {
  display:flex;
  justify-items:center;
  justify-content: center;
  gap:36px;
}

.about-service-visual > div {
  width:477px;
  height:540px;
  background: url('../images/renewal/contents/img-about-visual.webp') 50% 50% no-repeat;
}

.about-service-visual > ul {
  display:flex;
  justify-items:center;
  align-items:center;
  flex-wrap: wrap;
  gap:10px;

  width:510px;
}

.about-service-visual > ul > li {
  display:inline-flex;
  flex-direction: column;
  justify-content: center;
  justify-items:center;
  align-items:center;
  gap:1.25rem;

  width:225px;
  height:225px;

  line-height:100%;

  font-family: 'Pretendard';
  font-weight:800;
  background: url('../images/renewal/contents/bg-about-step.webp') 50% 50% no-repeat;

  transition: ease 0.25s;
}

.about-service-visual > ul > li+li+li {
  margin-top:-86px;
}

.about-service-visual > ul > li.current {
  background: url('../images/renewal/contents/bg-about-step-on.webp') 50% 50% no-repeat;
}

.about-service-visual > ul > li > i {
  width:1.75rem;
  height:1.75rem;
}

i.icon-about-1 {
  background: url('../images/renewal/contents/icon-about-1.webp') 50% 50% no-repeat;
  background-size:contain;
}

i.icon-about-2 {
  background: url('../images/renewal/contents/icon-about-2.webp') 50% 50% no-repeat;
  background-size:contain;
}

i.icon-about-3 {
  background: url('../images/renewal/contents/icon-about-3.webp') 50% 50% no-repeat;
  background-size:contain;
}

i.icon-about-4 {
  background: url('../images/renewal/contents/icon-about-4.webp') 50% 50% no-repeat;
  background-size:contain;
}

.about-service-visual > ul > li p:nth-child(2) span:first-child {
  display:inline-block;
  width:56px;
  color:#363636;
  text-align:right;
  font-size:2.625rem;
  letter-spacing:-1px;
}

.about-service-visual > ul > li p:nth-child(2) span:last-child {
  padding-left:0.25rem;
  color:#e93342;
}

.about-service-visual > ul > li p:nth-child(3) {
  font-size:1.25rem;
  font-weight:600;
  color:#e93342;
}

.about-service-visual > ul > li p:nth-child(4),
.about-service-visual > ul > li p:nth-child(5) {
  color:#363636;
  font-weight:400;
}

.about-service-visual > ul > li p:nth-child(5) {
  margin-top:-1.25rem;
}

.about-service-visual > ul > li.current i {
  filter: brightness(5);
}

.about-service-visual > ul > li.current span,
.about-service-visual > ul > li.current p {
  color:#fff !important;
}

.about-service-detail {
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content:center;
  align-items: flex-start;

  gap:56px 66px;
  margin-top:40px;
}

.about-service-detail > div {
  display:inline-flex;
  justify-content: center;  
  gap:25px;
}

.about-service-detail i {
  width:80px;
  height:80px;
}

i.icon-detail-1 {
  background: url('../images/renewal/contents/icon-detail-1.webp') 50% 50% no-repeat;
  background-size:contain;
}
i.icon-detail-2 {
  background: url('../images/renewal/contents/icon-detail-2.webp') 50% 50% no-repeat;
  background-size:contain;
}
i.icon-detail-3 {
  background: url('../images/renewal/contents/icon-detail-3.webp') 50% 50% no-repeat;
  background-size:contain;
}
i.icon-detail-4 {
  background: url('../images/renewal/contents/icon-detail-4.webp') 50% 50% no-repeat;
  background-size:contain;
}

.about-service-detail > div > div {
  width:365px;
  font-family: 'Pretendard';
  font-weight:600;
  color:#444;
  font-size:0.875rem;
  word-break: keep-all;
}

.about-service-detail > div > div p:first-child {
  color:#fb4e5a;
  font-weight:700;
  font-size:1.125rem;
  margin-bottom:0.425rem;
}

.board-list-area {
  display:flex;
  justify-content: center;
  gap:1rem;

  margin-bottom:2.625rem;
}

.board-section {
  padding:4px;
  width:352px;
  height:496px;
  background: url('../images/renewal/contents/bg-board-section.webp') 50% 50% no-repeat; 
}

.board-section .title-board,
.board-section .tabs-board {
  display:inline-flex;
  justify-content: space-between;
  align-items: center;

  padding:0 22px;
  width:calc(100% - 44px);
  height:68px;
  font-size:1.125rem;
  font-family: 'Pretendard';
  font-weight:800;
}


.board-section .title-board > span:first-child {
  background: linear-gradient(167deg, #ff424c 100%, #fb4c5a 75%, #ff7557 25%, #e9d074 0%);
  color: transparent;
  background-clip: text;
}


.board-notice .title-board i:nth-child(2) {
  width:2.125rem;
  height:1.625rem;
  background: url('../images/renewal/contents/icon-board-notice.webp') 50% 50% no-repeat; 
  background-size:contain;
  margin:0 auto 0 0.425rem;
}


.board-notice .board-list {
  display:flex;
  flex-direction: column;

  padding-top:6px;
  margin:0 20px;
}

.board-notice .board-list > li {
  display:flex;
  justify-content:flex-end;
  align-items: center;
  gap:1.5rem;

  height:41px;
  font-family: 'Pretendard';
  font-weight:600;
  font-size:1rem;
}

.board-notice .board-list > li + li {
  border-top:1px solid #ececec;
}

.board-notice .board-list > li > a:first-child {
  margin-right:auto;
}

.board-notice .board-list > li > a {
  color:#363636;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.board-notice .board-list > li > span:last-child {
  color:#b8b8b8;
  white-space: nowrap;
}

.board-change .board-list > div > span:nth-child(2) {
  color:#ff424c;
  text-align:right;
}

.board-change .tabs-board {
  padding:0;
  width:100%;
}

.board-section .title-board > span:first-child {
  background:linear-gradient(to right, #ff1723 50%, #FF8601);
  color: transparent;
  background-clip: text;
}

.board-section .title-board > a {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  
  width:75px;
  height:1.5rem;
  text-align:center;
  font-size:0.75rem;
  color:#fff;
  font-family: 'Pretendard';
  font-weight:500;
  background:linear-gradient(to right, #ff1723, #FF8601);
  border-radius:10in;
}

.board-change .tabs-board > button {
  padding:14px 0 12px;
  width:50%;
  height:50px;
  line-height:100%;
  color:#d2d2d2;
  font-size:1.125rem;
  font-family: 'Pretendard';
  font-weight:800;
  background:none;
}

.board-change .tabs-board > button:hover,
.board-change .tabs-board > button.current {
  background:linear-gradient(to right, #ff1723 50%, #FF8601);
  color: transparent;
  background-clip: text;
}

.board-change .tabs-board > span {
  width:1px;
  height:52px;
  background:#e7e7e7;
}

.board-change .swiper {
  position:relative;
  width:calc(100% - 40px);
  height:414px;
  margin:0 20px 14px;
}

.board-change div.swiper-slide {
  display:flex;
  justify-content:flex-end;
  align-items:center;

  font-family: 'Pretendard';
  font-weight: 600;
  font-size: 1rem;
}

.board-change div.swiper-slide+div.swiper-slide {
  border-top: 1px solid #ececec;
}

.board-change div.swiper-slide span:first-child {
  margin-right:auto;
}

.board-change div.swiper-slide span:nth-child(2) {
  color:#ff424c;
  font-weight:600;
}

.board-change div.swiper-slide span:last-child {
  width:120px;
  color:#b8b8b8;
  text-align:right;
}

.board-top-rank .title-board i:nth-child(2) {
  width:1.625rem;
  height:1rem;
  background: url('../images/renewal/contents/icon-board-Top.webp') 50% 50% no-repeat; 
  background-size:contain;
  margin:0 auto 0 0.425rem;
}

.board-top-rank .board-list {
  display: flex;
  flex-direction: column;
  padding-top: 6px;
  margin: 0 20px;
}

.board-top-rank .board-list > div {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: 41px;
  font-family: 'Pretendard';
  font-weight: 600;
  color:#444;
  font-size: 1rem;
}

.board-top-rank .board-list > div + div {
  border-top:1px solid #ececec;
}

.board-top-rank .board-list > div  > span:first-child {
  width:2rem;
}

.board-top-rank .board-list > div  > span:nth-child(2) {
  margin-right:auto;
}

.board-top-rank .board-list > div  > span:last-child {
  color:#ff424c;
  font-weight:600;
}

.service-menu-area {
  display:block;
  width:1100px;
  margin:0 auto;
}

.service-menu-area > div {
  display:flex;
  justify-content: space-between;

  margin-bottom:4.625rem;
}

.service-menu-area > div > button {
  display:flex;
  align-items:center;
  gap:0.25rem;

  padding:9px;
  width:274px;
  height:130px;
  background: url('../images/renewal/contents/bg-quick.webp') 50% 50% no-repeat; 
}

.service-menu-area > div > button > i {
  width:3.625rem;
  height:3.625rem;

  margin-left:0.5rem;
}

i.icon-quick-1 {
  background: url('../images/renewal/contents/icon-quick-1.webp') 50% 50% no-repeat; 
  background-size:contain;
}
i.icon-quick-2 {
  background: url('../images/renewal/contents/icon-quick-2.webp') 50% 50% no-repeat; 
  background-size:contain;
}
i.icon-quick-3 {
  background: url('../images/renewal/contents/icon-quick-3.webp') 50% 50% no-repeat; 
  background-size:contain;
}
i.icon-quick-4 {
  background: url('../images/renewal/contents/icon-quick-4.webp') 50% 50% no-repeat; 
  background-size:contain;
}

.service-menu-area > div > button > div {
  display:inline-flex;
  flex-direction: column;
  align-items: flex-start;

  color:#363636;
  font-size:0.75rem;
  font-family: 'Pretendard';
  font-weight:600;
  letter-spacing:-0.5px;
}

.service-menu-area > div > button > div > span:last-child {
  font-size:1.125rem;
  letter-spacing:-0.5px;;
  background:linear-gradient(to right, #ff1723 50%, #FF8601);
  color: transparent;
  background-clip: text;
}

.third-party-area {
  display:block;
  width:1100px;
  padding-top:80px;
  margin:0 auto;
}

.third-party-area > ul {
  display:flex;
  flex-wrap:wrap;
  justify-content: center;
  gap:0.875rem 1.125rem;
}

.third-party-area > ul > li {
  width:9%;
}

.third-party-area span {
  display:block;
  width:100%;
  height:24px;

  background-size:contain !important;
  filter: invert(1) grayscale(1);
  opacity: 0.3;
}

.footer {
  display:block;
  width:1100px;
  margin:0 auto;
}

.footer > div {
  padding:8rem 0 4rem;
  text-align:center;
  color:#363636;
  font-family: 'Pretendard';
  font-weight:600;
  letter-spacing:-0.5px;
}

.footer .copy span {
  color:#fd4452;
}

/* game main */
.layout-game {
  background: url('../images/renewal/contents/bg-game-main.webp') 50% bottom no-repeat;
  background-size:cover;
}

.layout-game .bar-ctn-jackpot .odometer > div{
  display:flex;
}

.layout-game .bar-ctn-jackpot .txt-jackpot-area .odometer-formatting-mark {
  padding-top:0;
  margin-top:0.25rem;
}

.layout-game .visual-banner .casino-visual,
.layout-game .visual-banner .slot-visual,
.layout-game .visual-banner .holdem-visual,
.layout-game .visual-banner .mini-visual,
.layout-game .visual-banner .sport-visual {
  display:flex;
  justify-content: space-between;

	width:1200px;
	height:610px;
  margin:0 auto;
}

.layout-game .visual-banner .casino-visual .title-casino {
  width:400px;
  height:610px;

  background: url('../images/renewal/banner/img-casino-title.webp') 86px 50% no-repeat;
}

.layout-game .visual-banner .casino-visual .img-casino {
  width:730px;
  height:633px;
  background: url('../images/renewal/banner/banner-casino.webp') 50% bottom no-repeat;

  animation-duration: 2s;
  animation-name: fade-live;
}

.layout-game .visual-banner .slot-visual .title-slot {
  width:400px;
  height:610px;

  background: url('../images/renewal/banner/img-slot-main-title.webp') 86px 50% no-repeat;
}

.layout-game .visual-banner .slot-visual .img-slot {
  width:748px;
  height:633px;
  background: url('../images/renewal/banner/banner-slot.webp') 50% bottom no-repeat;

  animation-duration: 2s;
  animation-name: fade-live;
}

.layout-game .visual-banner .holdem-visual .title-holdem {
  width:400px;
  height:610px;

  background: url('../images/renewal/banner/img-holdem-main-title.webp') 86px 50% no-repeat;
}

.layout-game .visual-banner .holdem-visual .img-holdem {
  width:756px;
  height:633px;
  background: url('../images/renewal/banner/banner-holdem.webp') 50% bottom no-repeat;

  animation-duration: 2s;
  animation-name: fade-live;
}

.layout-game .visual-banner .mini-visual .title-mini {
  width:400px;
  height:610px;

  background: url('../images/renewal/banner/img-mini-main-title.webp') 86px 50% no-repeat;
}

.layout-game .visual-banner .mini-visual .img-mini {
  width:756px;
  height:633px;
  background: url('../images/renewal/banner/banner-mini.webp') 50% bottom no-repeat;

  animation-duration: 2s;
  animation-name: fade-live;
}

.layout-game .visual-banner .sport-visual .title-sport {
  width:400px;
  height:610px;

  background: url('../images/renewal/banner/img-sport-main-title.webp') 86px 50% no-repeat;
}

.layout-game .visual-banner .sport-visual .img-sport {
  width:756px;
  height:632px;
  background: url('../images/renewal/banner/banner-sport.webp') 50% bottom no-repeat;
  background-size:90%;

  animation-duration: 2s;
  animation-name: fade-live;
}

.layout-game .odometer.odometer-auto-theme,
.layout-game .odometer.odometer-theme-slot-machine {
  height:84px;
  overflow-y:hidden;
}

.bar-game-serarch {
  display:flex;
  justify-content: flex-end;
  align-items: center;

  width:1020px;
  margin:0 auto 38px;
}

.bar-game-serarch > div {
  display:flex;
  padding:0 1.5rem;

  background:#fff; 
  border:1px solid #f8e0e2;
  border-radius:10in;
  box-shadow:0 0 20px #ff424d1f;
}

.bar-game-serarch > div > input {
  width:276px;
  height:48px;

  color:#363636;
  font-size:1rem;
  font-family: 'Pretendard';
  font-weight:600;
  border:none;
  transition: all 0.5s;
}

.bar-game-serarch > div > input:focus {
  width:952px;
  color:#e93342;
  font-weight:700;
  font-size:1.125rem;
  text-align:center;
}

.bar-game-serarch > div > button {
  width:18px;
  height:48px;
  background:url('../images/renewal/contents/icon-serarch.webp') 50% 50% no-repeat  
}

.layout-game .list-games-area > ul {
  display:flex;
  flex-wrap: wrap;
  gap:30px 20px;

  width:1034px;
  margin:0 auto;
}

.layout-game .thd-img {
  position:relative;
  width:243px;
  height:288px;
}

.layout-game .thd-img > img {
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
}

.layout-game .thd-img:hover > img {
  z-index:100;
  transition: all 0.3s;

  animation: motion 1s linear 0s infinite alternate;
}

@keyframes motion {
	0% {top:50%;}
  50% {top:53%;}
  100% {top:50%;}
}

.layout-game .bar-deco {
  margin:98px 0;
}

/* logo img list */
.logo-1X2_Gaming{background:url('../images/logo/1X2 Gaming.svg') 50% 50% no-repeat;}
.logo-7-mojos,
.logo-7-mojos-slots {background:url('../images/logo/7mojos.svg') 50% 50% no-repeat;}
.logo-7777 {background:url('../images/logo/7777.png') 50% 50% no-repeat;}
.logo-absolute {background:url('../images/logo/absolute.png') 50% 50% no-repeat;}
.logo-Asia_Gaming {background:url('../images/logo/Asia Gaming.png') 50% 50% no-repeat;}
.logo-bfgames {background:url('../images/logo/bfgames.png') 50% 50% no-repeat;}
.logo-BigTimeGaming {background:url('../images/logo/BigTimeGaming.svg') 50% 50% no-repeat;}
.logo-bitville {background:url('../images/logo/bitville.svg') 50% 50% no-repeat;}
.logo-Blueprint_Gaming {background:url('../images/logo/Blueprint Gaming.svg') 50% 50% no-repeat;}
.logo-Booongo {background:url('../images/logo/Booongo.svg') 50% 50% no-repeat;}
.logo-bota {background:url('../images/logo/bota.png') 50% 50% no-repeat;}
.logo-caletagaming {background:url('../images/logo/caletagaming.svg') 50% 50% no-repeat;}
.logo-CQ9 {background:url('../images/logo/CQ9.svg') 50% 50% no-repeat;}
.logo-Dowin {background:url('../images/logo/Dowinn.png') 50% 50% no-repeat;}
.logo-Dragoon_Soft {background:url('../images/logo/Dragoon Soft.png') 50% 50% no-repeat;}
.logo-DreamGame {background:url('../images/logo/DreamGame.svg') 50% 50% no-repeat;}
.logo-dreamtech {background:url('../images/logo/dreamtech.svg') 50% 50% no-repeat;}
.logo-eagaming {background:url('../images/logo/eagaming.png') 50% 50% no-repeat;}
.logo-Elk_Studios {background:url('../images/logo/Elk Studios.svg') 50% 50% no-repeat;}
.logo-endorphina {background:url('../images/logo/endorphina.svg') 50% 50% no-repeat;}
.logo-EVOPLAY {background:url('../images/logo/EVOPLAY.svg') 50% 50% no-repeat;}
.logo-fils {background:url('../images/logo/fils.png') 50% 50% no-repeat;}
.logo-GameArt {background:url('../images/logo/GameArt.svg') 50% 50% no-repeat;}
.logo-globalbet {background:url('../images/logo/GlobalBet.svg') 50% 50% no-repeat;}
.logo-Habanero {background:url('../images/logo/Habanero.svg') 50% 50% no-repeat;}
.logo-inrace {background:url('../images/logo/InRace.png') 50% 50% no-repeat;}
.logo-intouch-games {background:url('../images/logo/intouch-games.svg') 50% 50% no-repeat;}
.logo-mancala {background:url('../images/logo/mancala.png') 50% 50% no-repeat;}
.logo-MicroGaming_Plus_Slo,
.logo-MicroGaming_Plus {background:url('../images/logo/MicroGaming Plus Slo.svg') 50% 50% no-repeat;}
.logo-Mobilots {background:url('../images/logo/Mobilots.svg') 50% 50% no-repeat;}
.logo-netent {background:url('../images/logo/netent.svg') 50% 50% no-repeat;}
.logo-Nolimit_City {background:url('../images/logo/Nolimit City.svg') 50% 50% no-repeat;}
.logo-onetouch-live,
.logo-onetouch {background:url('../images/logo/onetouch.svg') 50% 50% no-repeat;}
.logo-PG_Soft {background:url('../images/logo/PG Soft.svg') 50% 50% no-repeat;}
.logo-platingaming {background:url('../images/logo/platingaming.svg') 50% 50% no-repeat;}
.logo-platipus {background:url('../images/logo/platipus.png') 50% 50% no-repeat;}
.logo-PlayPearls {background:url('../images/logo/PlayPearls.svg') 50% 50% no-repeat;}
.logo-Playson {background:url('../images/logo/Playson.svg') 50% 50% no-repeat;}
.logo-PlayStar {background:url('../images/logo/PlayStar.svg') 50% 50% no-repeat;}
.logo-popok {background:url('../images/logo/popok.svg') 50% 50% no-repeat;}
.logo-PragmaticPlay_Live,
.logo-PragmaticPlay {background:url('../images/logo/PragmaticPlay.svg') 50% 50% no-repeat;}
.logo-redtiger {background:url('../images/logo/redtiger.svg') 50% 50% no-repeat;}
.logo-Relax_Gaming {background:url('../images/logo/Relax Gaming.svg') 50% 50% no-repeat;}
.logo-retrogames {background:url('../images/logo/retrogames.png') 50% 50% no-repeat;}
.logo-smartsoft {background:url('../images/logo/SmartSoftSprite.png') 50% 50% no-repeat;}
.logo-spinomenal {background:url('../images/logo/spinomenal.png') 50% 50% no-repeat;}
.logo-Skywind_Live {background:url('../images/logo/Skywind_Live.svg') 50% 50% no-repeat;}
.logo-Thunderkick {background:url('../images/logo/Thunderkick.svg') 50% 50% no-repeat;}
.logo-Triple_Profit_Gaming {background:url('../images/logo/Triple Profit Gaming.svg') 50% 50% no-repeat;}
.logo-vir2al,
.logo-vir2al2 {background:url('../images/logo/vir2al.png') 50% 50% no-repeat;}
.logo-vivo {background:url('../images/logo/vivo.png') 50% 50% no-repeat;}
.logo-Wazdan {background:url('../images/logo/Wazdan.svg') 50% 50% no-repeat;}
.logo-WM_Live {background:url('../images/logo/WM Live.svg') 50% 50% no-repeat;}
.logo-evolution {background:url('../images/logo/evolution.svg') 50% 50% no-repeat;}

/* sport */
.layout-sport {
  background:none;
}

.layout-sport .gnb {
  background: linear-gradient(to bottom, #e3e2de, #fefaf7);
  border-top:7px solid #fff;
  border-bottom:7px solid #fff;
}

.tabs-sport-type {
  display:flex;
  justify-content: center;
  align-items: center;

  width:100%;
  max-width:1230px;
  margin:0 auto;
}

.game-sport {
  
}

/* holdem */
.main-game-area.holdem .main-live-list  {
	width: 1043px;
  margin: 0 32px 0 32px;
}

.main-game-area.holdem .main-live-list > div {
	display:flex;
  justify-content: center;
  align-items: center;
  
  width:1043px;
  height:595px;
  
  background:url('../images/renewal/contents/bg-holdem-main.webp') 50% 50% no-repeat  
  
}

.main-game-area.holdem .main-live-list > div > div {
	position:relative;
	width:52%;
	height:100%;
}

.main-game-area.holdem .main-live-list > div > div > a {
	position:absolute;
	left:50%;
	bottom:82px;
	transform: translateX(-50%);
	
	width:177px;
	height:59px;
	
	background:url('../images/renewal/contents/btn-holdem-main.webp') 50% 50% no-repeat  ;
}

.main-game-area.holdem .main-live-list > div > ul {
	width:48%;
	
	display:flex;
  justify-content: center;
  align-items: center;
  flex-wrap:wrap;
  gap:0.75rem;
  
  margin-left:auto;
}


.main-game-area.holdem .main-live-list > div > ul > li {
	width:211px;
	height:250px;
	
	background:url('../images/renewal/contents/img-holdem-about1.webp') 50% 50% no-repeat  ;
}

.main-game-area.holdem .main-live-list > div > ul > li.about-2 {
	background:url('../images/renewal/contents/img-holdem-about2.webp') 50% 50% no-repeat ;
}

.main-game-area.holdem .main-live-list > div > ul > li.about-3 {
	background:url('../images/renewal/contents/img-holdem-about3.webp') 50% 50% no-repeat ;
}


.main-game-area.holdem .main-live-list > div > ul > li.about-4 {
	background:url('../images/renewal/contents/img-holdem-about4.webp') 50% 50% no-repeat ;
}

.holdem-sub {
	position:relative;
	display:block;
	width:1190px;
	height:1106px;
	
	background:url('../images/renewal/contents/bg-holdem-sub.webp') 50% 50% no-repeat ;
	margin:0 auto;
}

.holdem-sub > a {
	position:absolute;
	top:580px;
	left:50%;
	transform: translateX(-50%);
	
	width:227px;
	height:76px;
	
	background:url('../images/renewal/contents/btn-holdem-sub.webp') 50% 50% no-repeat  ;
}

/* mini */
.mini-list > ul {
  display:flex;
  flex-wrap: wrap;
  gap:1.25rem;
}