/* Core Stylesheet - 1.0 */
/* :: 1.0 Import Fonts */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR|Noto+Sans+SC&subset=chinese-simplified,japanese,korean');
@import url(css/bootstrap.min.css);
@import url(css/classy-nav.css);
@import url(css/owl.carousel.min.css);
@import url(css/animate.css);
@import url(css/magnific-popup.css);
@import url(css/font-awesome.min.css);
/* :: 3.0 Base CSS */
* {
  margin: 0;
  padding: 0; }

body {
  min-width : 320px;
  font-family: 'Noto Sans KR', sans-serif;
  font-family: 'Noto Sans SC', sans-serif; }

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #424242;
  line-height: 1.3;
  font-weight: 700; }

p {
  color: #939393;
  font-size: 14px;
  line-height: 2.1;
  font-weight: 400; }

a,
a:hover,
a:focus {
  -webkit-transition-duration: 500ms;
  transition-duration: 500ms;
  text-decoration: none;
  outline: 0 solid transparent;
  color: #000000;
  font-weight: 600;
  font-size: 16px; }

.game-date a,
.game-date a:hover,
.game-date a:focus {
    -webkit-transition-duration: 500ms;
    transition-duration: 500ms;
    text-decoration: underline;
    outline: 0 solid transparent;
    color: #000000;
    font-weight: 600;
    font-size: 16px; }

ul,
ol {
  margin: 0; }
  ul li,
  ol li {
    list-style: none; }

img {
  height: auto;
  max-width: 100%; }

/* :: 3.1.0 Spacing */
.mt-15 {
  margin-top: 15px !important; }

.mt-30 {
  margin-top: 30px !important; }

.mt-50 {
  margin-top: 50px !important; }

.mt-70 {
  margin-top: 70px !important; }

.mt-100 {
  margin-top: 100px !important; }

.mb-15 {
  margin-bottom: 15px !important; }

.mb-30 {
  margin-bottom: 30px !important; }

.mb-50 {
  margin-bottom: 50px !important; }

.mb-70 {
  margin-bottom: 70px !important; }

.mb-100 {
  margin-bottom: 100px !important; }

.ml-15 {
  margin-left: 15px !important; }

.ml-30 {
  margin-left: 30px !important; }

.ml-50 {
  margin-left: 50px !important; }

.mr-15 {
  margin-right: 15px !important; }

.mr-30 {
  margin-right: 30px !important; }

.mr-50 {
  margin-right: 50px !important; }

.pb-70 {
  padding-bottom: 70px !important; }

/* :: 3.2.0 Height */
.height-400 {
  height: 400px !important; }

.height-500 {
  height: 500px !important; }

.height-600 {
  height: 600px !important; }

.height-700 {
  height: 700px !important; }

.height-800 {
  height: 800px !important; }

/* :: 3.3.0 Section Padding */
.section-padding-100 {
  padding-top: 100px;
  padding-bottom: 100px; }

.section-padding-150 {
  padding-top: 150px;
  padding-bottom: 150px; }

.section-padding-100-0 {
  padding-top: 100px;
  padding-bottom: 0; }

.section-padding-0-100 {
  padding-top: 0;
  padding-bottom: 100px; }

.section-padding-100-70 {
  padding-top: 100px;
  padding-bottom: 70px; }

/* :: 3.4.0 Preloader */
.preloader {
  background-color: #20d8da;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 99999; }
  .preloader .spinner {
    width: 70px;
    text-align: center; }
    .preloader .spinner div {
      width: 18px;
      height: 18px;
      background-color: #fff;
      border-radius: 100%;
      display: inline-block;
      -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
      animation: sk-bouncedelay 1.4s infinite ease-in-out both; }
    .preloader .spinner .bounce1 {
      -webkit-animation-delay: -0.32s;
      animation-delay: -0.32s; }
    .preloader .spinner .bounce2 {
      -webkit-animation-delay: -0.16s;
      animation-delay: -0.16s; }

@-webkit-keyframes sk-bouncedelay {
  0%,
    80%,
    100% {
    -webkit-transform: scale(0); }
  40% {
    -webkit-transform: scale(1); } }
@keyframes sk-bouncedelay {
  0%,
    80%,
    100% {
    -webkit-transform: scale(0);
    transform: scale(0); }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1); } }
/* :: 3.5.0 Miscellaneous */
.section-title {
  font-size: 32px;
  font-weight: 400; }

@media only screen and (max-width: 575px) {
	.section-title{
		font-size: 5.57vw;
	}
}

.section-content {
  font-size: 18px;
  color: #0e0e0e;
  font-weight: 400; }
  @media only screen and (max-width: 575px) {
	.section-content{
		font-size: 3.13vw;
	}}
  
 .section-detail {
  	font-size: 26px;
  	color: #0e0e0e;
  	font-weight: 400;
  }
  @media only screen and (max-width: 575px) {
	.section-detail{
		font-size: 4.53vw;
	}
}
  
  .section-bar {
  	width:130px; 
  	border:1px solid gray; 
  	margin:0 auto;
  }

.tooltip-inner {
  background-color: #20d8da; }

.tooltip .arrow::before {
  border-top-color: #20d8da; }

.bg-img {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat; }

.bg-white {
  background-color: #ffffff !important; }

.bg-dark {
  background-color: #000000 !important; }

.bg-transparent {
  background-color: transparent !important; }

.bg-gray {
  background-color: #f0f4f8; }

.font-bold {
  font-weight: 700; }

.font-light {
  font-weight: 300; }

.bg-overlay {
  position: relative;
  z-index: 2;
  background-position: center center;
  background-size: cover; }
  .bg-overlay::after {
    background-color: rgba(0, 0, 0, 0.6);
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: ""; }

.bg-pattern {
  position: relative;
  z-index: 2; }
  .bg-pattern::after {
    background-image: url(img/core-img/pattern.png);
    background-repeat: repeat;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: -1; }

.bg-pattern2 {
  position: relative;
  z-index: 2; }
  .bg-pattern2::after {
    background-image: url(img/core-img/pattern2.png);
    background-repeat: repeat;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: -1; }

.bg-fixed {
  background-attachment: fixed !important; }

/* :: 3.6.0 ScrollUp */
#scrollUp {
  background-color: #000000;
  border-radius: 0;
  bottom: 50px;
  color: #ffffff;
  font-size: 24px;
  height: 40px;
  line-height: 37px;
  right: 50px;
  text-align: center;
  width: 40px;
  border-radius: 50%;
  -webkit-transition-duration: 500ms;
  transition-duration: 500ms;
  box-shadow: 0 1px 5px 2px rgba(0, 0, 0, 0.15); }
  #scrollUp:hover, #scrollUp:focus {
    background-color: #20d8da;
    color: #ffffff; }

/* 1.0 Superplanet Background Area */
.superplanet-bg-area {
	margin : 0 auto;
	max-width: 1920px;
	max-height:500px;
 	width: 100vw;
  	height : calc(100vw*50/192);
  	background-size : contain;
  	background-position : center center;
 }
 
  @media only screen and (max-width : 719px){
    .superplanet-bg-area {
      height : 0; } }
      
/* :: 2.0 Header Area CSS */
.header-area {
  background-color: #0e0e0e;
  position: relative;
  z-index: 1000;
  width: 100%; }
	.header-area .top-header-area {
    	position: relative;
    	z-index: 1;
    	width: 100%;
    	height: 85px; }
	.header-area .superplanet-main-menu {
    	position: relative;
    	width: 100%;
    	height: 70px; }
  		.header-area .superplanet-main-menu .classy-navbar {
		    height: 70px;
		    padding: 0;
		    -webkit-box-pack: center;
		  	-ms-flex-pack: center;
		  	justify-content: center; }
	    @media only screen and (max-width: 991px) {
	      .header-area .superplanet-main-menu .classy-navbar {
	        -webkit-box-orient: horizontal;
	        -webkit-box-direction: reverse;
	        -ms-flex-direction: row-reverse;
	        flex-direction: row-reverse;
	        -webkit-box-pack: justify;
			-ms-flex-pack: justify;
			justify-content: space-between; } }
	.header-area .superplanet-main-menu .classy-navbar .logo {
			width : 8rem;
		}
		@media only screen and (min-width: 992px) {
			.header-area .superplanet-main-menu .classy-navbar .logo {
				margin-right : 100px;
				width : 10rem;
			}
		}
   .header-area .superplanet-main-menu .classy-navbar .classynav {
     max-width: 1600px;
    }
   .header-area .superplanet-main-menu .classy-navbar .classynav ul li {
     margin-right : 25px;
    }
   .header-area .superplanet-main-menu .classy-navbar .classynav ul li a {
     font-weight: 600;
     text-transform: capitalize;
     cursor: pointer;
     font-size: 16px;
     padding: 0 10px;
     color: #ffffff; }
     .header-area .superplanet-main-menu .classy-navbar .classynav ul li a:hover, .header-area .superplanet-main-menu .classy-navbar .classynav ul li a:focus {
       color: #20d8da; }
   .header-area .superplanet-main-menu .classy-navbar .classynav > ul > li:first-child a {
     padding-left: 0; }
	@media only screen and (min-width: 768px) and (max-width: 991px) {
      .header-area .superplanet-main-menu .classy-navbar .classynav > ul > li:first-child a {
        padding-left: 10px; } }
    @media only screen and (max-width: 767px) {
      .header-area .superplanet-main-menu .classy-navbar .classynav > ul > li:first-child a {
        padding-left: 10px; } }
   .header-area .superplanet-main-menu .classy-navbar .classynav ul li ul li a {
	    color: #ffffff;
	    font-size: 14px;
	    padding: 0 20px; 
    }
     @media only screen and (min-width: 1199px) {
    .header-area .superplanet-main-menu .language-tab {
      margin-left : 250px; } }
    @media only screen and (max-width: 1198px) and (min-width: 992px){
    .header-area .superplanet-main-menu .language-tab {
      margin-left : 110px; } }
    .header-area .superplanet-main-menu .language-tab button{
    	background-color :#0F1729;
    	border :none;
    	cursor: pointer;
    }
    .header-area .superplanet-main-menu .language-tab button p{
      font-size: 14px;
      color: #ffffff;
      display: inline-block;
      margin-left: 30px; }
      @media only screen and (min-width: 768px) and (max-width: 991px) {
        .header-area .superplanet-main-menu .language-tab button{
          margin-left: 0;
          margin-right: 30px; } }
      @media only screen and (max-width: 767px) {
        .header-area .superplanet-main-menu .language-tab button{
          margin-left: 0;
          margin-right: 15px; } }
      .header-area .superplanet-main-menu .language-tab button p:hover, .header-area .superplanet-main-menu .language-tab button p:focus {
        color: #20d8da; }
  .header-area .is-sticky .superplanet-main-menu {
    z-index: 9999;
    box-shadow: 0 5px 50px 0 rgba(0, 0, 0, 0.2); }

/* :: 3.0 Hero Area CSS */
.hero-area {
  position: relative;
  z-index: 1; }
.hero-post-slides{
	position:relative;
	max-width : 1920px;
	max-height : 500px;
	width: 100vw;
	height : calc(100vw*50/192);
	margin : 0 auto;
	text-align :center;
	z-index: 1;
}
 @media only screen and (max-width : 719px){
    .hero-post-slides {
   	  max-width : 720px;
	  height : calc(100vw*50/72);}}
	  
.hero-post-dots {
	top :-45px;
	display: inline-block;
	text-align: center;
	position: relative;
	z-index : 9999;
}  
 @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .hero-post-dots {
      top : -30px; } }
  @media only screen and (max-width: 991px) {
    .hero-post-dots {
      opacity : 0; } }
.hero-post-dots .dots {
	background-color: #828282;
	display: inline-block;
	width: 0.80em; 
	height: 0.80em; 
	border-radius: 50%; 
	margin-right:40px;
	border : 1px solid white; } 
.hero-post-dots .active { background-color:#eb9138; }

.single-slide {
  position: relative;
  z-index: 1;
  max-width : 1920px;
  max-height : 500px;
  width: 100vw;
  height : calc(100vw*50/192);
  background-size : contain;
 }
 
 @media only screen and (max-width : 719px){
    .single-slide {
      background-size : cover;
      background-repeat : no-repeat;
      max-width : 720px;
	  height : calc(100vw*50/72); } }

/* :: 4.0 Games Area CSS */
.latest-games-area {
  position: relative;
  z-index: 1;
  text-align: center; 
  max-width : 1920px;
  max-height : 500px;
  margin-top : 5.6vw;
  width: 100vw;
  height : calc(100vw*50/192);
  background-size : contain;
  margin-left: auto;
  margin-right : auto;
  background-position : center center;
  }
  @media only screen and (max-width : 719px){
    .latest-games-area {
      background-size : cover;
      background-repeat : no-repeat;
      max-width : 720px;
	  height : calc(100vw*50/72); } }
.latest-games-area .latest-game-detail{
	z-index: 9999;
	position: absolute;
	bottom: 3%;
	width : 100%;
	text-align :center;
}
.latest-games-area .latest-game-detail h3 {
	color : #ffffff;
}

/* :: 5.0 Footer Area CSS */
.footer-area {
  position: relative;
  z-index: 1;
  background-color: #848484;
  background-image: url(img/core-img/pattern.png);
  background-repeat: repeat; }
  .footer-area .single-footer-widget {
    position: relative;
    z-index: 1; }
    .footer-area .single-footer-widget .widget-title {
      display: block;
      margin-bottom: 60px; }
      .footer-area .single-footer-widget .widget-title h4 {
        font-weight: 400;
        color: #fff;
        margin-bottom: 0;
        line-height: 1; }
    .footer-area .single-footer-widget .widget-content p {
      margin-bottom: 0;
      color: #ffffff; }
    .footer-area .single-footer-widget .widget-content ul li a {
      display: block;
      color: #ffffff;
      font-size: 14px;
      margin-bottom: 20px;
      font-weight: 400; }
      .footer-area .single-footer-widget .widget-content ul li a:focus, .footer-area .single-footer-widget .widget-content ul li a:hover {
        color: #20d8da; }
  .footer-area .copyright-content {
    position: relative;
    z-index: 1;
    background-color: #0F1729;
    width: 100%;
    padding: 15px 0; 
    text-align : center;}
    .footer-area .copyright-content .copyright-text {
      font-size: 12px;
      margin-bottom: 0;
      color: #ffffff;
      font-weight: 400; }
       @media only screen and (max-width: 575px) {
          .footer-area .copyright-content .copyright-text{
            font-size: 2vw; } }
      .footer-area .copyright-content .copyright-text a {
        color: #20d8da;
        font-size: 12px;
        font-weight: 400; }
        @media only screen and (max-width: 575px) {
          .footer-area .copyright-content .copyright-text a {
            font-size: 2vw; } }
        .footer-area .copyright-content .copyright-text a:hover, .footer-area .copyright-content .copyright-text a:focus {
          color: #20d8da; }
    .footer-area .copyright-content .footer-nav {
      position: relative;
      z-index: 1; }
      .footer-area .copyright-content .footer-nav ul {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -ms-grid-row-align: center;
        align-items: center;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end; }
        @media only screen and (max-width: 767px) {
          .footer-area .copyright-content .footer-nav ul {
            -webkit-box-pack: start;
            -ms-flex-pack: start;
            justify-content: flex-start; } }
      .footer-area .copyright-content .footer-nav li a {
        position: relative;
        z-index: 1;
        color: #ffffff;
        font-size: 14px;
        font-weight: 400;
        padding: 0 15px; }
        @media only screen and (max-width: 767px) {
          .footer-area .copyright-content .footer-nav li a {
            padding: 0 5px; } }
        .footer-area .copyright-content .footer-nav li a:hover, .footer-area .copyright-content .footer-nav li a:focus {
          color: #20d8da; }

/* :: 6.0 Company Area CSS */
.company-area {
  position: relative;
  z-index: 1;
  background-color: #ffffff;
  overflow: hidden;
  padding: calc(150*(100vw/1920)); }
  
  @media only screen and (min-width : 1921px){
    .company-area {
      padding : 100px; } }
  
  .company-area .company-item {
  	margin-bottom : calc(100*(100vw/1920)); }
  
  @media only screen and (min-width : 1921px){
    .company-area .company-item {
      margin-bottom : 100px; } }
      
  .company-area .company-image {
    border:none;
    max-width : 221px;
    max-height : 221px;
    width: 22vw;
    height: 22vw; 
    margin-bottom: calc(20*(100vw/1920));
    background-size : contain;
    background-repeat : no-repeat;
    background-position : center center;}
     @media only screen and (min-width : 1921px){
    .company-area .company-image {
      margin-bottom : 20px; } }
    
    .company-area .company-tab{
    	margin : 0;
    	padding : 3px;
    }
    .company-area .company-tab a{
    	border : 1px solid black;
    	border-radius : 25px;
    	font-weight : lighter;
    	font-size : 15px;
    	cursor : pointer;
    	padding-left : 20px;
    	padding-right: 20px;
    	padding-bottom: 8px;
    	padding-top : 8px;
    }
    @media only screen and (max-width : 575px){
    .company-area .company-tab a {
      	font-size : 2.61vw;
      	padding-left : 2vw;
    	padding-right: 2vw;
    	padding-bottom: 1vw;
    	padding-top : 1vw; } }
      
    .company-area .company-tab .tab-title {
    	width : 100%;
    	max-height : 40px;
    	height : 40px;
    	text-align : center;
    	margin-top : 8px;
    }
    @media only screen and (max-width : 575px){
    .company-area .company-tab .tab-title {
      margin-top : 1.4vw;
      height : 7vw;
    } }
    
    .company-area .company-tab h3 {
    	font-size : 21px;
    }
    @media only screen and (max-width : 575px){
    .company-area .company-tab h3 {
      font-size : 3.65vw; } }
    
    .company-area .company-tab .tab-content {
    	width : 100%;
    	max-height : 46.4px;
    	height : 46.4px;
    	margin-bottom : 8px;
    }
    @media only screen and (max-width : 575px){
    .company-area .company-tab .tab-content {
      height : 9vw;
      margin-bottom : 1vw; } }
      
    .company-area .company-tab p {
    	font-size : 12px;
    	line-height : 1.3;
    }
    @media only screen and (max-width : 575px){
    .company-area .company-tab p {
      font-size : 2vw; } }

/* :: 7.0 Game LineUp Area CSS */
.game-lineup-area {
  position: relative;
  z-index: 1; 
  width : 100%;
  padding : calc(150*(100vw/1920)); }
  
  @media only screen and (min-width : 1921px){
    .game-lineup-area {
      padding : 150px; } }
      
.game-lineup-area .game-intro {
	position: relative;
  	text-align : center;
  	margin-bottom : calc(100*(100vw/1920)); }
  
  @media only screen and (min-width : 1921px){
    .game-lineup-area .game-intro {
      margin-bottom : 100px; } }
      
 .game-lineup-area .game-intro img {
 	position: relative;
 	max-width : 68px;
 	max-height : 58px;
 	width: 11.8vw;
 	height: 10vw;
 	margin-right : 5px;
 	display:inline;
 }
 .game-lineup-area .game-intro h1 {
 	position: relative;
 	font-size : 26px;
 	top : calc(15*(100vw/1920));
 	display:inline;
 }
  @media only screen and (min-width : 1921px){
    .game-lineup-area .game-intro h1 {
      top : 15px; } }
  @media only screen and (max-width : 575px){
    .game-lineup-area .game-intro h1 {
      font-size : 4.52vw; } }
 
 .game-lineup-area .game-tab {
 	margin : 0;
 	padding : 3px;
 }
      
 .game-lineup-area .single-game-area {
 	position: relative;
 	margin : calc(10*(100vw/1920));
 	padding : calc(30*(100vw/1920));
 	border : 1px solid gray;
 	border-radius : 15px;
  	text-align : center;
  	height: 98%;
 	
 }
  @media only screen and (min-width : 1921px){
    .game-lineup-area .single-game-area {
      margin : 10px;
 	padding : 30px; } }
 
 .game-lineup-area .single-game-area .game-icon {
 	margin-left : auto;
 	margin-right :auto;
 	max-width: 240px;
 	max-height: 240px;
  	width : 12.5vw;
   	height : 12.5vw;
   	margin-bottom : calc(20*(100vw/1920));
 }
 @media only screen and (min-width : 1921px){
    .game-lineup-area .single-game-area .game-icon {
      margin-bottom : 20px; } }
 @media only screen and (min-width: 576px) and (max-width: 767px) {
      .game-lineup-area .single-game-area .game-icon {
  		width : 18.75vw;
   		height : 18.75vw; } }
    @media only screen and (max-width: 575px) {
      .game-lineup-area .single-game-area .game-icon {
        width : 25vw;
   		height : 25vw; } }
   		
 .game-lineup-area .single-game-area .game-content .game-title {
 	font-size : 18px;
 	position : relative;
 	max-height: 55px;
 	height : 55px;
 }
    @media only screen and (max-width: 575px) {
      .game-lineup-area .single-game-area .game-content .game-title {
        font-size : 4vw;
        height : 9.6vw;
        max-height: 55px; } }
 
 .game-lineup-area .single-game-area .game-content .game-date{
 	font-size : 15px;
 }
 @media only screen and (min-width: 768px) and (max-width: 992px) {
   .game-lineup-area .single-game-area .game-content .game-date{
      font-size : 11.25px; } }
 @media only screen and (min-width: 576px) and (max-width: 767px) {
      .game-lineup-area .single-game-area .game-content .game-date {
        font-size : 13px; } }
    @media only screen and (max-width: 575px) {
      .game-lineup-area .single-game-area .game-content .game-date {
        font-size : 2.61vw; } }
 
 .game-lineup-area .single-game-area .game-content .game-detail{
 	font-size : 15px;
 	height : 76.8px;
 	max-height : 76.8px;
 	line-height : 1.3;
 }
 @media only screen and (min-width: 768px) and (max-width: 992px) {
   .game-lineup-area .single-game-area .game-content .game-detail{
      font-size : 11.25px;
      height : 72px;
 	  } }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
      .game-lineup-area .single-game-area .game-content .game-detail {
        font-size : 13px;
        height : 86px;
   } }
    @media only screen and (max-width: 575px) {
      .game-lineup-area .single-game-area .game-content .game-detail {
        font-size : 2.61vw;
        height : 13.4vw;
        max-height : 76.8px; } }
 
 .game-lineup-area .single-game-area .download-area a{
 	margin : 1px;
 }
      
 .game-lineup-area .single-game-area .download-area img{
 	width : calc(123*(100vw/1150));
 	height : auto;
 	max-width : 123px;
 	max-height: auto;
 }
 	@media only screen and (min-width: 768px) and (max-width: 992px) {
    .game-lineup-area .single-game-area .download-area img{
       width : calc(0.75*123*(100vw/1150));
 	  height : calc(0.75*41*(100vw/1150)); } }
  	@media only screen and (min-width: 576px) and (max-width: 767px) {
    .game-lineup-area .single-game-area .download-area img{
      width : calc(1.125*123*(100vw/1150));
 	  height : calc(1.125*41*(100vw/1150)); } }
  	@media only screen and (max-width: 575px) {
    .game-lineup-area .single-game-area .download-area img{
      width : 21vw;
 	  height : 7vw; } }
  
/* 8.0 Business Area */
.business-area {
  position: relative;
  z-index: 1;
  background-color: #ffffff;
  overflow: hidden;
  padding : calc(150*(100vw/1920)); }
  
   @media only screen and (min-width : 1921px){
    .business-area {
      padding-bottom : 150px; } }
  
  .business-area .company-item {
  	margin-bottom: calc(100*(100vw/1920));
  	text-align : center;
  	margin-left : auto;
  	margin-right : auto;
  }
  @media only screen and (min-width : 1921px){
    .business-area {
      margin-bottom : 100px; } }
      
  .business-area .company-image {
    border:none;
    width: 29vw;
    height: 29vw;
    max-width : 331px;
    max-height : 331px; 
    margin-bottom: calc(20*(100vw/1920));}
    @media only screen and (min-width : 1921px){
    .business-area .company-image {
      margin-bottom : 20px; } }
 
.world-bg-area {
	margin : 0 auto;
	max-width: 1920px;
	max-height:500px;
 	width: 100vw;
  	height : calc(100vw*50/192);
  	background-size : contain;
  	background-position : center center;
  	background-image : url(image/bg/world_bg.jpg);
 }
 @media only screen and (max-width : 720px){
    .world-bg-area {
	margin : 0 auto;
	max-width: 720px;
	max-height:500px;
 	width: 100vw;
  	height : calc(100vw*50/72);
  	background-image : url(image/bg/world_bg_mobile.jpg);
 } }
 .single-game-img-slides {
  position: relative;
  z-index: 1; }
  .single-game-img-slides .single-game-slide {
    position: relative;
    padding-left: 0;
    margin-right: 0;
    margin-left: 0;
    margin-top: calc(15*(100vw/1920));
    margin-left: 0;
    margin-right: calc(15*(100vw/1920));}
 @media only screen and (min-width : 1921px){
    .single-game-img-slides .single-game-slide {
      margin-top : 15px;
      margin-right : 15px; } }
    
    .single-game-img-slides .single-game-slide img {
        width : 100%;
    	height: 59%; } }
   
   .single-game-img-slides .single-game-slide h6 {
   		font-size : 18px;
   }
   @media only screen and (min-width: 992px) and (max-width: 1199px) {
      .single-game-img-slides .single-game-slide h6 {
        font-size : 15px; } }
    @media only screen and (min-width: 768px) and (max-width: 991px) {
      .single-game-img-slides .single-game-slide h6 {
        font-size : 12px; } }
    @media only screen and (max-width: 767px) {
      .single-game-img-slides .single-game-slide h6 {
        font-size : 10px; } }
    
    .single-game-img-slides .single-game-slide p {
   		font-size : 15px;
   		line-height : 1.3;
   }
   @media only screen and (min-width: 992px) and (max-width: 1199px) {
      .single-game-img-slides .single-game-slide p {
        font-size : 13px; } }
    @media only screen and (min-width: 768px) and (max-width: 991px) {
      .single-game-img-slides .single-game-slide p {
        font-size : 12px; } }
    @media only screen and (max-width: 767px) {
      .single-game-img-slides .single-game-slide p {
        font-size : 10px; } }
   
   .contact-area {
  	  position: relative;
	  z-index: 1;
	  text-align: center; 
	  width: 100vw;
	  height : calc(100vw*50/192);
	  max-width : 1920px;
	  max-height : 500px;
	  margin: 0 auto;
	  background-image : url(image/bg/bottom_biz.jpg);
	  background-position : center center;
   }
   @media only screen and (max-width : 719px){
    .contact-area {
      max-width : 720px;
	  height : calc(100vw*50/72);
	  background-image : url(image/bg/bottom_biz_mobile.jpg); } }
      
.contact-area .contact-info{
	z-index: 9999;
	position: absolute;
	bottom: calc(100*(100vw/1920));
	width : 100%;
	text-align :center;
	opacity : 0.8;
}
@media only screen and (min-width : 1921px){
    .contact-area .contact-info {
      bottom : 100px; } }
@media only screen and (min-width : 720px) and (max-width : 991px){
    .contact-area .contact-info {
      bottom: 0.7vw; } }
@media only screen and (max-width : 719px){
    .contact-area .contact-info {
      bottom: 10vw; } }
 
     
/* 9.0 Career Area */
.career-area {
  position: relative;
  z-index: 1;
  background-color: #ffffff;
  overflow: hidden;
  padding: calc(150*(100vw/1920));
  margin-bottom : calc(300*(100vw/1920)); }
  @media only screen and (min-width : 1921px){
    .career-area {
      padding : 150px; } }
 
  .career-area .company-item {
  	margin-bottom: calc(100*(100vw/1920));
  	text-align : center;
  	margin-left : auto;
  	margin-right : auto;
  }
  @media only screen and (min-width : 1921px){
    .career-area .company-item {
      margin-bottom : 100px; } }
  
  .career-area .company-image {
    border:none;
    width: 19.4vw;
    height: 19.4vw;
    max-width : 221px;
    max-height : 221px; 
    margin-bottom: calc(20*(100vw/1920));
    }
    @media only screen and (min-width : 1921px){
    .career-area .company-image {
      margin-bottom : 20px; } }
    @media only screen and (max-width : 575px){
    .career-area .company-image {
      margin-bottom : 1vw; } }
      
	.career-area .company-image img {
		margin : 0 auto;
	}
	
 .career-area .dept-intro {
 	margin : 0;
 	padding : 3px;
 }
	
  .career-area .company-tab {
 	position: relative;
 	margin : calc(10*(100vw/1920));
 	padding : calc(30*(100vw/1920));
 	border : 1px solid gray;
 	border-radius : 15px;
  	text-align : center;
  	height: 95%;
 }
  @media only screen and (min-width : 1921px){
    .career-area .company-tab {
      margin : 10px;
 	padding : 30px; } }
 
   .career-area .company-tab h3 {
   		margin-top : calc(20*(100vw/1140));
    	font-size : 18px;
    }
    
     @media only screen and (max-width : 575px){
    .career-area .company-tab h3 {
      font-size : 3.13vw;
      margin-top : 1.56vw; } }
      
    .career-area .company-tab p {
    	font-size : 15px;
    	line-height : 1.3;
    }
    @media only screen and (max-width : 575px){
    .career-area .company-tab p {
      font-size : 2.61vw; } }
      
	.career-area .employ-tab {
		margin-top : calc(150*(100vw/1920));
		margin-left : auto;
		margin-right : auto;
		width : 33vw;
		max-width: 331px;
		height : 9vw;
		max-height: 79px;
		padding-top : 5px;
		padding-bottom : 5px;
		padding-left : 10px;
		padding-right : 10px;
		border-radius : 50px;
		background-color : #1d95d1;
		display : flex;
	}
	@media only screen and (min-width : 1921px){
     .career-area .employ-tab {
      margin-top : 150px; } }
      
    @media only screen and (max-width : 575px){
     .career-area .employ-tab {
      padding-left : 1vw;
	  padding-right : 1vw; } }
	
	.career-area .employ-tab a {
		margin : auto;
		text-align : center;
		cursor : pointer;
		font-size : 18px;
		color : #fefefe;
	}
	@media only screen and (max-width : 575px){
     .career-area .employ-tab a{
      font-size : 3.13vw; } }

/* :: 13.0 Contact Area CSS */
.contact-content {
  position: relative;
  z-index: 1; }
  .contact-content p {
    margin-bottom: 0; }

.single-contact-info {
  position: relative;
  margin-bottom: 15px; }
  .single-contact-info:last-child {
    margin-bottom: 0; }
  .single-contact-info .title {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 99px;
    flex: 0 0 99px;
    max-width: 99px;
    width: 99px;
    height: 32px;
    background-color: #20d8da;
    text-align: center;
    margin-right: 20px; }
    .single-contact-info .title p {
      color: #fff;
      line-height: 32px;
      font-size: 14px;
      margin-bottom: 0; }
  .single-contact-info p {
    font-size: 14px;
    margin-bottom: 0; }

.contact-form-area .form-control {
  position: relative;
  z-index: 2;
  height: 45px;
  width: 100%;
  background-color: #eff4f9;
  font-size: 12px;
  margin-bottom: 30px;
  border-radius: 0;
  padding: 15px 30px;
  font-weight: 600;
  font-style: italic;
  color: #ababab;
  -webkit-transition-duration: 500ms;
  transition-duration: 500ms;
  border: none; }
  .contact-form-area .form-control:focus {
    box-shadow: none; }
.contact-form-area textarea.form-control {
  height: 190px; }

.map-area {
  position: relative;
  z-index: 2; }
  .map-area iframe {
    width: 100%;
    height: 515px;
    border: none;
    margin-bottom: 0; }
    @media only screen and (max-width: 767px) {
      .map-area iframe {
        height: 300px; } }

/* ====== The End ====== */

/*# sourceMappingURL=style.css.map */
/* 드랍다운 박스 내부 버튼 스타일 통일 */
.classy-navbar .classynav ul li .dropdown li button {
    width: 100%;
    background-color: #0F1729; /* 배경색 통일 */
    border: none;
    padding: 10px 20px;
    text-align: left;
    display: block;
    cursor: pointer;
    transition: all 0.3s;
}

/* 버튼 안의 텍스트 여백 제거 및 색상 통일 */
.classy-navbar .classynav ul li .dropdown li button p {
    margin: 0 !important;
    padding: 0 !important;
    color: #ffffff !important;
    font-size: 14px;
}

/* 호버 시 색상 변경 */
.classy-navbar .classynav ul li .dropdown li button:hover p {
    color: #20d8da !important;
}

/* 불필요하게 밀리는 마진 제거 */
.language-tab {
    margin-left: 0 !important;
}