@charset "utf-8";
@import url('//fonts.googleapis.com/earlyaccess/nanumgothic.css');
/* 
font-family: 'Nanum Gothic';
Regular 400
Bold 700
ExtraBold   800
*/
@font-face {
	font-family: 'GongGothicLight';
	src: url('//cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicLight.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
  font-family: "NanumSquareRound";
  font-style: normal;
  font-weight: 400;
  src: local("img/NanumSquareRoundR"), /* computer */
    url("/img/NanumSquareRoundR.eot"), /* IE9 Compat Modes */
    url("/img/NanumSquareRoundR.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("/img/NanumSquareRoundR.woff2") format("woff2"), /* Modern Browsers */    
    url("/img/NanumSquareRoundR.woff") format("woff"), /* Modern Browsers */
    url("/img/NanumSquareRoundR.ttf") format("truetype"); /* Safari, Android, iOS */
}
@font-face {
  font-family: "NanumSquareRound";
  font-style: normal;
  font-weight: 700;
  src: local("img/NanumSquareRoundB"), /* computer */
    url("/img/NanumSquareRoundB.eot"), /* IE9 Compat Modes */
    url("/img/NanumSquareRoundB.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("/img/NanumSquareRoundB.woff2") format("woff2"), /* Modern Browsers */
    url("/img/NanumSquareRoundB.woff") format("woff"), /* Modern Browsers */
    url("/img/NanumSquareRoundB.ttf") format("truetype"); /* Safari, Android, iOS */
}
@font-face {
  font-family: "NanumSquareRound";
  font-style: normal;
  font-weight: 800;
  src: local("img/NanumSquareRoundEB"), /* computer */
    url("/img/NanumSquareRoundEB.eot"), /* IE9 Compat Modes */
    url("/img/NanumSquareRoundEB.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("/img/NanumSquareRoundEB.woff2") format("woff2"), /* Modern Browsers */
    url("/img/NanumSquareRoundEB.woff") format("woff"), /* Modern Browsers */
    url("/img/NanumSquareRoundEB.ttf") format("truetype"); /* Safari, Android, iOS */
}

@font-face {
    font-family: 'MICEGothic Bold';
    src: url('//cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-01@1.0/MICEGothic Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

/* **** Common Reset **** */
*{margin:0;padding:0;list-style:none;font-size:13px;font-weight:400;font-family: "NanumSquareRound",sans-serif;box-sizing: border-box;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5{margin:0;padding:0;word-wrap:break-word;word-break:break-all;}
li,p,span,strong,a,i,em{font-size:inherit;color:inherit;font-family:inherit;}
b, strong{font-weight:700;color: inherit;font-size: inherit;}
font{font-weight:700;font-size:inherit;}
body, html{width:100%;height:100%;/*background: #000;*/ background: url(/img/back2.jpg) no-repeat center center fixed;background-size: cover;}
input,select,img{vertical-align:middle;}
img{border:0;}
table{width:100%;border-collapse: collapse;}
table caption{position: absolute;top: 0px;left: 0px;overflow: hidden;display: block !important;width: 0px !important;height: 0px !important;margin: 0 !important;font-size: 0 !important;line-height: 0 !important;}
.clear{clear:both;}
.clearfix::after{content:"";display:block;clear:both;}
.blind {position: absolute;top: 0px;left: 0px;overflow: hidden;display: inline-block !important;width: 1px !important;height: 1px !important;margin: 0 !important;font-size: 0 !important;line-height: 0 !important;}
a{display:inline-block;text-decoration:none;transition:all 0.2s ease-in-out;}
i{font-style:normal;}
input[type="password"]{font-family: 'Nanum Gothic';}

.blue{color: #317efe !important;}
.blue2{color: #21b4f1 !important;}
.green{color: #33f80c !important;}
.red{color: #e75300 !important;}
.grey{color:#989898 !important;}
.pink{color:#ff0e7f !important;}
.qing{color:#19f3f0 !important;}
.qing2{color:#00d2ff !important;}
.orange{color:#fb7d0e !important;}
.yellow2{color:#f2f511 !important;}

#header{position: relative;z-index: 2;height: 110px;min-width: 1200px;text-align: center;background: #222;}
.header-tp{height: 40px;line-height: 40px;background: #111;border-bottom: 3px solid ;overflow: hidden;border-image: linear-gradient(to right, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 100%, transparent 100%);border-image-slice: 1;}
.header-tp-cont{margin:0 auto;}
.header-tp-lf{float:left;}
.header-tp-lf > div{float:left;}
.header-tp-lf .date{color:#d2d2d2;margin-right:80px;}
.header-tp-lf .notice{color: #a5a5aa;padding-left: 60px;}
.header-tp-lf .notice span{color: #deef1b;}

/* 20201025 */
.login-before{float:right;height: 40px;margin-right: 30px;overflow: hidden;}
.login-before ul{float:left;}
.login-before ul > li{float:left;/*color: #fff;*//*border-right: 1px solid #86551e;*/}
.login-before ul > li:first-child{border-left: 1px solid #272f4b;}
.login-before ul > li a{display:block;padding: 0 20px;}
.login-before ul > li a i{vertical-align: -2px;margin-right: 5px;}

.login-box { display:none;z-index:11;border: 2px solid #009526;}
/*.pop-bg{display:none;position:fixed;top:0;left:0;z-index:9;width:100%;height:100%;background:rgba(0, 0, 0, 0.5);}*/
.join-box{display:none;z-index:10;border: 2px solid #009526;}
.join-box{position:absolute !important;top: 6%;left: 0;right: 0;padding: 0 !important;}
.pop-close{position:absolute;top: 20px;right: 20px;}
.pop-close i{font-size: 30px;color:#fff;}
/* //20201025 */

.header-tp-rt{ float:right;height: 40px;margin-right: 30px;overflow: hidden; }
.header-tp-rt ul{float:left;}
.header-tp-rt ul:first-child{margin-left:0;background:none;}
.header-tp-rt ul > li{float:left;color:  #af9242;padding: 0 20px;border-right: 1px solid #272f4b;}

.header-tp-rt ul.ul1 > li{/* margin-left: 15px; */}
.header-tp-rt ul.ul1 > li:first-child{margin-left:0;}
.header-tp-rt ul.ul2 > li{/* margin-left: 20px; */}
.header-tp-rt ul.ul2 > li:first-child{border-left: 0;}
.header-tp-rt ul.ul2 > li:first-child .iconfont{font-size: 21px;vertical-align: middle;margin-right: 5px;}
.header-tp-rt ul > li:first-child{/* padding-left:0; */background:none;border-left: 1px solid #2e2c44;}
.header-tp-rt ul > li:last-child{/* padding-right:0; */}
.header-tp-rt ul > li .yellow{color: #e5e750;}
.header-tp-rt ul > li .white{color: #fff;}
.header-tp-rt ul > li .iconfont{margin-right:5px;vertical-align:middle;;}
.header-tp-rt ul > li .purple{color: #a5a5aa;vertical-align: middle;}
.header-tp-rt ul > li .purple i{font-size: 14px;color: #ffffff;}
.header-tp-rt ul > li .dark-purple{color: #a5a5aa;vertical-align: middle;}
.header-tp-rt ul > li .dark-purple i{font-size: 14px;color: #ffffff;}
.header-tp-rt ul > li span.blue{color: #7599eb;}
.header-tp-rt ul > li span.green{color: #a2e00e;}
.header-tp-rt ul > li span.red{color:#f95157;}
.header-tp-rt ul > li .point{height: 22px;line-height: 22px;background: #af9242;font-weight: 700;color: #fff;margin-left: 10px;padding: 0 7px;}
.header-tp-rt ul > li a.tp-btn{margin:0 12px 0 6px;}
.header-tp-rt ul.ul3 > li{/* margin-left: 15px; */}
.header-tp-rt ul.ul3 > li:last-child{border-right: 0;padding-right: 0;}

.header-bt{height: 80px;margin:0 auto;position: relative;text-align: center;background:#2e3645;}

.logo{position: absolute;top: 10px;left: 60px;margin:-10px;}
.logo img{width: 180px;margin-top:-5px;}
.header-bt-ct{
    height: 70px;
    /*border-bottom: 3px solid;border-image: linear-gradient(to right, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 100%, transparent 100%);border-image-slice: 1;*/
}
.nav{padding-top:10px;}
.nav::after{content:"";display:block;clear:both;}
.nav > ul > li{position:relative;margin-left: 30px;display: inline-block;}
.nav > ul > li:first-child{margin-left:0;}
.nav > ul > li > a{ font-family:'GongGothicLight' ; font-size: 1.4rem;color: #fff;line-height: 70px;}
.nav > ul > li > a:hover, 
.nav > ul > li > a.on{
  background-image: linear-gradient(45deg, #f3ec78, #af4261);
    background-size: 100%;
	background-repeat: repeat;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; 
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
 }

.nav > ul > li > .deph2{font-family: 'GongGothicLight';display:none;position:absolute;top: 73px;left: -10px;z-index: 1;width: 200px;padding: 12px 0;background: #030303;border: 2px solid;border-image: linear-gradient(to right, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 100%, transparent 100%);border-image-slice: 1;box-shadow: 0px 5px 20px rgba(19, 154, 210, 0.35);}
.nav > ul > li > .deph2::before{display: none;content:"";position: absolute;top: -6px;left: 27px;background: url(../images/common/menu_icon.png) no-repeat;width: 14px;height: 6px;}
.nav > ul > li > .deph2 > li{margin-top: 6px;line-height: 20px;text-align: left;}
.nav > ul > li > .deph2 > li:first-child{margin-top:0;}
.nav > ul > li > .deph2 > li > a{display: block;font-size: 14px;font-weight: 700;color:#fff;padding: 0px 25px;height: 40px;line-height: 40px;}
.nav > ul > li > .deph2 > li > a:hover{/* background: #2d3e51; */text-decoration: none;color: #139ad2;}

.header-bt-rt{position: absolute;top: 20px;right: 50px;font-size: 0;}
.header-bt-rt a{position:relative;display:inline-block;box-sizing: border-box;padding-left: 30px;}
.header-bt-rt a:first-child{padding-right: 30px;}
.header-bt-rt a:first-child::after{content:"";position:absolute;top: calc(50% - 17px);right:0;width:1px;height:35px;background:#2e2c44;}
.header-bt-rt a span{text-align:center;vertical-align: middle;}
.header-bt-rt a span.iconfont{font-size: 45px;color: #fff;width: 100%;margin-right: 10px;}
.header-bt-rt a span.tit{width: 100px;height: 31px;line-height: 31px;display:inline-block;border: 1px solid;margin-left: 3px;font-size:1.2rem;color: #fff;text-align: center;border-radius: 5px;box-sizing: content-box;border-image: linear-gradient(to right, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 100%, transparent 100%);border-image-slice: 1;}
.header-bt-rt a:hover { color:  #39e5b3; text-decoration:none}
.header-bt-rt a:hover span.iconfont{color:  #39e5b3; text-decoration:none}
.header-bt-rt a:first-child span.iconfont{font-size: 49px;}
.header-bt-rt a:first-child span.tit{}

.left-quick{position: absolute;left: 0;z-index: 1;width: 70px;height: 100%;border-right: 1px solid #2a2b2c;background: #060606;}
.left-quick a{display:block;position: relative;padding-top: 16px;height: 70px;box-sizing: border-box;border-bottom: 1px solid #2a2b2c;}
.left-quick a span{display:block;width:100%;text-align:center;}
.left-quick a span.icon{font-size:20px;color:#fff;}
.left-quick a:hover span.icon{color: #ed0104; text-decoration:none}
.left-quick a span.txt{position: absolute;top: 45px;font-size:12px;font-weight:700;color:#fff;}





.top{display: none;position:fixed;bottom: 100px;right: 50%;z-index: 1;margin-right: -899px;}


#footer {background: #000;text-align:center;position: relative;/*min-width: 1200px;*/}
.footer-tp{height: 97px;font-size:0;padding-top: 20px;border-bottom: 1px solid #313133;border-top: 1px solid #303032;}
.footer-tp a{margin: 0 35px;}
.footer-tp a.on{-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray;}
.footer-bt{ background:#1a1a1c; height: 76px;line-height:76px;padding: 0 60px;overflow:hidden;}
.footer-bt .left{float:left;color:#797979;}
.footer-bt .left strong{font-weight:700;color:#bcbcbc;}
.footer-bt .right{float:right;font-size:14px;color:#fff;}
.footer-bt .right img{margin-right:12px;width:50px}
.footer-bt .right strong{font-size:18px;}

.mobileview a{width: 137px;height: 39px;line-height: 39px;text-align:center;background: #27272a;border: 1px solid #313133;color: #828282;border-radius: 5px;}


.popup_layer {
    z-index: 10000;
    display: none;
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    overflow: none;
}
.popup_wrapper {
    display: flex;
    position: absolute;
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
	top:200px !important;
	max-height:90vh;
	overflow-y:auto;
}
.popup_wrapper::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #F5F5F5;
}

.popup_wrapper::-moz-scrollbar-track {
    border-radius: 10px;
    background-color: #F5F5F5;
}

/* ��ũ�� �ڵ� (�巡�׵Ǵ� �κ�) */
.popup_wrapper::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #A0A0A0;
    box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}

.popup_wrapper::-moz-scrollbar-thumb {
    border-radius: 10px;
    background-color: #A0A0A0;
    box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}

/* ��ũ�ѹ� �ʺ� */
.popup_wrapper::-webkit-scrollbar {
    width: 8px;
}

.popup_wrapper::-moz-scrollbar {
    width: 8px;
}

.popup_item {
    display: inline-block;
    z-index: 10001;
    border-bottom: 3px solid;
    border-image: linear-gradient(to right, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 100%, transparent 100%);
    border-image-slice: 1;
    min-width: 300px;
    min-height: 200px;
}
.popup_item .popup_content {
    display: inline-block;
    min-width: 300px;
    /*padding: 10px;*/
    background-color: rgba(0,0,0,0.6);
    color: #fff;
    /*height: calc(100% - 40px);*/
	/*height:443px;*/
	border:1px solid #ddad2d;
}
.popup_item .popup_footer {
    display: block;
    position: relative;
    height: 40px;
    cursor: pointer;
}
.popup_item .popup_footer .popup_dismiss {
    background-color: #000;
    float: left;
    padding-left: 10px;
    width: 50%;
    height: 100%;
    color: #fff;
    font-size: 1.2rem;
}
.popup_item .popup_footer i {
    display: inline-block;
    position: absolute;
    top: 5px;
    width: 20px;
    height: 20px;
}
.popup_item .popup_footer span {
    display: inline-block;
    position: absolute;
    top: 10px;
    left: 50px;
}
.popup_item .popup_footer .popup_close {
    display: inline-block;
    width: 50%;
    height: 100%;
    background-color: #000;
    text-align: right;
    padding-right: 30px;
    color: #fff;
    font-size: 1.2rem;
}
.popup_item .popup_footer i {
    display: inline-block;
    position: absolute;
    top: 5px;
    width: 20px;
    height: 20px;
}

@media screen and (max-width:1780px){
	.header-bt-rt a{padding-left: 10px;}
	.header-bt-rt a:first-child{padding-right: 10px;}
}
@media screen and (max-width:1742px){
	.nav{}
	.nav > ul > li{margin-left: 15px;}
	.header-tp-lf{max-width: 30%;}
	.header-tp-lf .notice{/* width: 100%; */padding-left:30px;white-space: nowrap;/* overflow: hidden; *//* text-overflow: ellipsis; */}
	.header-tp-rt{margin-right:30px;}
	.header-tp-rt ul > li{padding: 0 4px;}
	.logo{left:30px;}
	.header-bt-rt{right:30px;}
	.header-bt-rt a:first-child{/* margin-right:15px; */}
}
@media screen and (max-width:1700px){
	.nav{}
	.nav > ul > li{margin-left: 15px;}
	.header-tp-lf{max-width: 30%;}
	.header-tp-lf .notice{/* width: 100%; */padding-left:30px;white-space: nowrap;/* overflow: hidden; *//* text-overflow: ellipsis; */}
	.header-tp-rt{margin-right:30px;}
	.header-tp-rt ul > li{padding: 0 4px;}
	.logo{left:30px;}
	.header-bt-rt{right:30px;}
	.header-bt-rt a:first-child{/* margin-right:15px; */}
}
@media screen and (max-width:1500px){
	.nav{}
	.nav > ul > li{margin-left: 10px;}
	.header-tp-lf{max-width: 35%;}
	.header-tp-lf .notice{/* width: 100%; */padding-left:30px;white-space: nowrap;/* overflow: hidden; *//* text-overflow: ellipsis; */}
	.header-tp-rt{margin-right:30px;}
	.header-tp-rt ul > li{padding: 0 4px;}
	.logo{left:30px;}
	.header-bt-rt{right:30px;}
	.header-bt-rt a:first-child{/* margin-right:15px; */}
}
@media screen and (max-width:1425px){
	.header-tp-lf {/* display:none;*/}
	.nav > ul > li{margin-left:20px;}
	.nav > ul > li > a{font-size:17px;}
}

@media screen and (max-width:1900px){
	.header-tp-lf {/* display:none;*/}
	.nav > ul > li{margin-left:20px;}
}

li.coupon { position:relative;}
.coupon_count { position:absolute; color:#fff; background-color:red; width:25px;height:25px;line-height:27px;border-radius:50%; top:0px;right:-5px;  z-index:10}

.container {
  width: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  background-color: #dc143c;
}

.card {
  width: 400px;
  height: 130px;
  border-radius: 5px;
  box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.2);
  background-color: #fff;
  padding: 10px 10px;
  position: relative;
}

.main,
.copy-button {
  display: flex;
  justify-content: space-between;
  padding: 0 10px;
  align-items: center;
}


.card::before {
  position: absolute;
  content: "";
  height: 40px;
  left: -20px;
  border-radius: 40px;
  z-index: 1;
  top: 45px;
  background-color: #19191B;
  width: 40px;
}

.co-img img {
  width: 100px;
  height: 100px;
}
.vertical {
  border-left: 5px dotted black;
  height: 100px;
  position: absolute;
  left: 40%;
}

.content h1 {
  font-size: 35px;
  margin-left: -20px;
  color: #565656;
}

.content h1 span {
  font-size: 18px;
}
.content h2 {
  font-size: 18px;
  margin-left: -20px;
  color: #565656;
  text-transform: uppercase;
}

.content p {
  font-size: 16px;
  color: #696969;
  margin-left: -20px;
}

.banner-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.banner-left {
  width: 50%;
  max-width: 1200px;
  height: auto;
  border: solid 2px #ead6b0;
  border-radius: 10px;
}


.banner-right {
  width: 50%;
  max-width: 1200px;
  height: auto;
  border: solid 2px #ead6b0;
  border-radius: 10px;
  margin-left:10px;
}

.banner-left img {
  width: 100%;
  height: auto;
  border-radius: 10px;
}

.banner-right img {
  width: 100%;
  height: auto;
  border-radius: 10px;
}
.customer_box { position:absolute; width:80px ;height:80px; bottom:50px; right:50px;z-index:200; cursor:pointer; border-radius:50%; background-color:rgba(0,0,0,0.5); text-align:center;padding-top:10px;}
.customer_box img { width:60px; height:60px; }

.customer_win {
	display:none;
	max-width:500px!important;
	background-color: rgba(30,27,21, 0.9);
	border: 1px solid #737300;
	/* height: 820px; */
	padding: 20px 20px 30px;
	text-align: center;
	display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.customer_win > h1 {
	text-align: center;
	font-weight: 500;
	font-size: 35px;
	line-height: 37px;
	color: #FFF;
}
.customer_win > h2 {
	margin-bottom: 10px;
	text-align: center;
	color: #737300;
	display: inline-block;
	padding: 0 10px 2px;
	letter-spacing: 3px;
	font-size: 12px;
	line-height: 17px;
}
.customer_win > h3 {
	margin-bottom: 30px;
	text-align: center;
	font-size: 14px;
	color: #d32626;
}
.customer_win > h4 {
	display:flex;
	margin-bottom: 40px;
	overflow: hidden;
}
.customer_win > h4 > ul.left{
	border-left: 0px;
}

.customer_win > h4 > ul {
	margin:auto;
	width: 420px;
	border-left: 1px solid #222;
}
.customer_win > h5 {
	text-align: center;
	margin-bottom: 20px;
}
.customer_win > h5 > span.join {
	color: #fff;
	border: 2px solid #737300;
}



.customer_win > h4 > ul > li > input.essential {
	background-color:#111;
	color:#fff;
	border:1px solid #777;
	border-radius:5px;
	padding: 10px 10px 10px 25px;	
	height:40px;
	width:300px;
}
.customer_win > h4 > ul > li.gap {
	margin-bottom: 15px;
}
.customer_win > h4 > ul > li > span {
	color: #a2a2a2;
}
.customer_win > h4 > ul > li {
	position: relative;
	width: 400px;
	margin: 0 0 5px 20px;
	overflow: hidden;
}
.customer_win > h4 > ul > li > dfn {
	display: inline-block;
	float: left;
	width: 82px;
	height: 38px;
}
.customer_win > h4 > ul > li > dfn > span {
	display: inline-block;
	position: relative;
	width: 82px;
	height: 44px;
	font-size: 15px;
	color: #fff;
	background: none;
	background: #737300;
	border-radius: 2px;
	cursor: pointer;
	opacity: 1;
	filter: alpha(opacity=100);
	transition: .3s;
}

.customer_win > h4 > ul > li > dfn > span > em {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 100%;
	text-align: center;
	overflow: hidden;
	transition: .3s;
}
.customer_win > h4 > ul > li > dfn > span > code {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	font-size: 16px;
	line-height: 40px;
	overflow: hidden;
	transition: .2s;
	font-family: "Noto Sans KR", sans-serif;
	font-weight: 600;
}
.customer_win > h5 > span {
	display: inline-block;
	position: relative;
	width: 120px;
	height: 45px;
	text-align: center;
	font-weight: bold;
	font-size: 17px;
	line-height: 30px !important;
	background: none;
	border-radius: 5px;
	cursor: pointer;
	opacity: 1;
	filter: alpha(opacity=100);
	transition: .3s;
	vertical-align: top;
}
.customer_win > h5 > span.join {
	color: #fff;
	border: 2px solid #737300;
}
.customer_win > h5 > span > em {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 100%;
	text-align: center;
	overflow: hidden;
	transition: .3s;
}
.customer_win > h5 > span > code {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	font-weight: bold;
	font-size: 17px;
	line-height: 40px;
	overflow: hidden;
	transition: .2s;
}
.customer_win > h5 > span.cancel {
	color: #929292;
	border: 2px solid #929292;
}

.customer_win textarea.essential {
	background-color: #111;
	color: #fff;
	border: 1px solid #777;
	border-radius: 5px;
	padding: 10px 10px 10px 25px;
	height: 120px;
	width:300px;
}

.homecas-content {
  animation: homecas-fadein 0.5s;
  -webkit-animation: homecas-fadein 0.5s;
  /*background: white;*/
  pointer-events: all;
  -webkit-backface-visibility: hidden;
}

.homecas-games-page{
  /*padding: 1em 1em;*/
  padding: 0 10px;
}

.homecas-games-page nav{
  margin: 10px 0 15px 0;
}
.homecas-games-page nav .list-inline{
  margin-left: 0;
  /*padding-right: 48px;*/
}

.homecas-games-page nav .list-inline>li{
  width: 234px;
  height: 50px;
  text-transform: uppercase;
  background-color: #333333;
  border: solid 1px #454444;
  color: #ffc527;
  line-height: 46px;
  padding: 0;
  margin-right: 4px;
  cursor: pointer;

}
.homecas-games-page nav .close-container{
  background-color: #000000;
  height: 50px;
  width: 50px;
  position: absolute;
  top: 0;
  right: 0;
}

/*.homecas-games-page nav .list-inline>li:hover,*/
.homecas-games-page nav .list-inline>li.active,
.btn-violet.active{
  border: 1px solid #fad981;
  background: -moz-linear-gradient(top, #efd48c 0%, #ddad2d 100%);
  background: -webkit-linear-gradient(top, #efd48c 0%,#ddad2d 100%);
  background: linear-gradient(to bottom, #efd48c 0%,#ddad2d 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efd48c', endColorstr='#ddad2d',GradientType=0 );
  color: #121212;
}
.homecas-games-page nav .list-inline>li.active a{
  color: #121212;
}


.homecas-games-page nav .list-inline>li>a{
  text-decoration: none;
  color: #ffffff;
  font-weight: 700;
}

.homecas-games-page .game-button-container2{
  width: 1000px;
  position: relative;
  font-size: 0;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  animation: cc_anim 1s ease 1;
}

.homecas-games-page .game-buttons-popup{
  width: 188px;
  height: 221px;
  margin-right: 15px;
  margin-bottom: 10px;
  position: relative;
  cursor: pointer;
}

.homecas-games-page .game-buttons-popup.sports{
  width: calc(100% / 3 - 15px);
}

/*.homecas-games-page .game-buttons-popup.sports{
  width: calc(98% / 2);
  height: 373px;
  float: left;
  margin-right: 14px;
  position: relative;
  cursor: pointer;
  border: none;
}*/

/*.homecas-games-page .game-buttons-popup.Others{
  width: 100%;
  height: 373px;
  border: none;
}*/
/*
.homecas-games-page .game-buttons-popup.sports:nth-of-type(2){
  margin-right: 0;
}*/

.homecas-games-page .game-buttons-popup.live:nth-of-type(5n + 5),
.homecas-games-page .game-buttons-popup.live:nth-of-type(13),
.homecas-games-page .game-buttons-popup.slot:nth-of-type(5n + 5),
.homecas-games-page .game-buttons-popup.sports:nth-of-type(3n + 3),
.homecas-games-page .game-buttons-popup.sports:nth-of-type(7),
.homecas-games-page .game-buttons-popup.Others:nth-of-type(5n + 5),
.homecas-games-page .game-buttons-popup.Others:nth-of-type(11){
  margin-right: 0;
}

.homecas-games-page .game-buttons-popup.live:nth-of-type(n + 11),
.homecas-games-page .game-buttons-popup.slot:nth-of-type(n + 21){
  margin-bottom: 20px;
}

/*.homecas-games-page ..game-buttons-popup.live:hover::after,
.homecas-games-page .game-buttons-popup.slot:hover::after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  border: 3px solid #fff;
  box-shadow: 0px 0px 10px #d153c7, 0px 0px 10px #d153c7;
  transition: 0.5s;
}*/

@keyframes cc_anim {
  0% {
    top: -20px;
    opacity: 0;
  }
  100% {
    top: 0;
    opacity: 1;
  }
}

.homecas-games-page .game-buttons-popup:hover .overlay{
  opacity: 1;
}

.homecas-games-page .game-buttons-popup .overlay {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 1s;
  opacity: 0;
  background: rgba(16, 16, 16, 0.72);
  z-index: 999;
}

.homecas-games-page .game-buttons-popup .overlay .tbl {
  display: table;
  width: 100%;
  height: 100%;
}

.homecas-games-page .game-buttons-popup .overlay .center {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  width: auto;
  height: auto;
}

.homecas-games-page .game-buttons-popup .overlay button {
  width: 80px;
  height: 80px;
  background-color: transparent;
  border: none;
  color: #fff;
  position: relative;
  font-size: 15px;
  text-align: center;
}

.homecas-games-page .game-buttons-popup .overlay button img {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 100%;
  animation: play_anim 2s linear infinite;
}

.homecas-games-page .game-buttons-popup .overlay .title {
  width: 130px;
  height: 35px;
  margin: 20px auto 0;
  display: table;
  line-height: 35px;
  padding: 0;
  border: 1px solid #fad981;
  background: #000000;
  color: #f4b741;
}

.homecas-games-page .game-buttons-popup .overlay .title:hover {
  border: 1px solid #fad981;
  background: #000000;
}

.homecas-games-page .game-buttons-popup .overlay .title p {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  color: #f4b741;
  font-size: 12px;
  font-family: NotoSansKr-Regular;
}

@keyframes play_anim {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.info_dw_img {
	width:calc(50% - 10px);
}
.snb_btn_img {
	display:flex;
    justify-content: space-between;
	background:#000;
	/*width:297px;*/
}
.snb_btn_img a {
	padding:5px;
	width:138px;
	height:70px;
	overflow:hidden;
	display:inline-block;
	position:relative;
	background:#222;
}
.snb_btn_img img {
	width:100%;
	box-shadow:0px 0px 3px rgb(0 0 0);
}
.snb_btn_img span {
	position:absolute;
	padding:3px 5px;
	background:rgba(0,0,0,0.8);
	color:#ffc105;
	left:10px;
	top:10px;
}
.snb_left { width:250px;}
.snb_left ul {
	width:250px;
	background:#222;height:203px;
	padding-bottom:3px;
}
.snb_left ul li { float:left; margin-left:1px; }
.snb_left ul li a {
display:block;width:82px;height:40px;line-height:40px;text-align:center;margin-top:1px;
background:#111;
color:#fff;
}
.snb_left ul li a.btn_gray {
background: radial-gradient(ellipse farthest-corner at right bottom, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 40%, transparent 80%), radial-gradient(ellipse farthest-corner at left top, #d3c23e 0%, #D1B464 8%, #D1B464 25%, #5d4a1f 62.5%, #5d4a1f 100%);
color:#fff;
border: solid 1px #9f7928;
}
.snb_left ul li a i {
	color:#fff;
}