@charset "utf-8";

* {
    margin: 0;
    padding: 0;
}

img {
    vertical-align: top;
}

li {
    list-style: none;
}

a {
    text-decoration: none;
}

body {}

#wrap {
    overflow: hidden;
}

.behide {
    /*영역을 차지하지 않도록*/
    /*최소 크기 설정*/
    /*브라우저 바깥으로 이동*/
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    left: -1px;
    top: 0;
}

.hidden {
    /*영역의 크기를 0으로*/
    /*콘텐츠의 크기를 0으로*/
    /*시각적으로 보이지 않게*/
    width: 0;
    height: 0;
    font: 0/0 '';
    visibility: hidden;
    position: absolute;
    overflow: hidden;
}

.scrollBtn {
    position: fixed;
    bottom: 5%;
    right: 20px;
    z-index: 5;
}

.scrollBtn > div {
    position: relative;
    height: 30px;
    width: 30px;
    cursor: pointer;
    transition: all 0.5s;
}

.scrollBtn > div:hover {
    background-color: #fff;
}

.scrollBtn > div:hover span {
    border-top: 3px solid #FDB913;
    border-right: 3px solid #FDB913;
}

.moveTopBtn {
    position: absolute;
    top: 0;
    border-radius: 50%;
    background-color: #FDB913;
    margin-bottom: 10px;
}

.moveBottomBtn {
    position: absolute;
    bottom: 0;
    border-radius: 50%;
    background-color: #FDB913;
}


.scrollBtn span {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    border-top: 3px solid #fff;
    border-radius: 0px;
    border-right: 3px solid #fff;
    box-sizing: border-box;
}

.moveTopBtn span {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -40%) rotate(-45deg);
}

.moveBottomBtn span {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -60%) rotate(135deg);
}

@font-face {
    font-family: 'nanum_REB';
    src: url('../fonts/NanumSquareRoundEB.ttf');
}

@font-face {
    font-family: 'nanum_R';
    src: url('../fonts/NanumSquareRoundR.ttf');
}

/*******번역기*******/
.gtranslate_wrapper {
    position: absolute;
    z-index: 101;
    opacity: 1;
}




/******************************모바일*************************/
/************ 인트로 원형,로고 *************/
#circle_container {
    top: 0;
    position: absolute;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background: black;
}

#circle {
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 280px;
    height: 280px;
    border-radius: 50%;
    background: #fff000;
}

#neople_logo {
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

#neople_logo img {
    width: 100%;
}

/******************* 헤더 ********************/
#header {
    height: 100vh;
    width: 100%;
    overflow: hidden;
}

#header > video {
    /*h1의 중앙에 고정*/
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    /*Z값 낮게*/
    z-index: -1;
    min-width: 100%;
    min-height: 100%;
    /*background-size:cover와 비슷, 기본크기 보장*/
}

.header_logo {
    height: 30px;
    margin-top: 10px;
    text-align: center;
}

.header_logo img {
    height: 100%;
}


/************ 주 메뉴 ************/
.lnb {
    position: fixed;
    top: 0;
    left: 10px;
    z-index: 100;
    background-color: #FDB913;
    /*    border-radius: 5px;*/
}

/*** 햄버거 버튼 ***/
.btn {
    /* 크기 30*30px, 여백 10px, 빨간색*/
    position: relative;
    /*span요소의 기준*/
    width: 30px;
    height: 30px;
    margin: 10px;
    cursor: pointer;
    z-index: 1;
}

.line1,
.line2,
.line3 {
    position: absolute;
    width: 100%;
    height: 4px;
    background-color: #fff;
    left: 0;
    transition: all 0.5s;
    border-radius: 5px;
}

.line1 {
    top: 0;
}

.deg45 {
    transform: translateY(13px) rotate(45deg) scaleX(1.3);
}

.line2 {
    top: 13px;
}

.y90deg {
    transform: rotateY(90deg);
}

.line3 {
    bottom: 0;
}

.deg-45 {
    transform: translateY(-13px) rotate(-45deg) scaleX(1.3);
}

/*********메뉴 컨테이너********/
.menu_container {
    left: 0;
    top: 0;
    position: fixed;
    width: 0%;
    overflow: hidden;
    height: 100vh;
    background-color: #fffa;
    /*    transition: all 0.5s;*/
}

.width_33 {
    width: 40%;
}

.transition500 {
    transition: all 0.5s;
}

/********** 메뉴 네오플 로고*********/
.lnb_logo {
    left: 50%;
    transform: translate(-50%);
    top: 10px;
    position: absolute;
    text-align: center;
    height: 30px;
}

.lnb_logo img {
    height: 100%;
}

/*** 메뉴 버튼 ***/
.menu_container {
    /*    display: none;*/
}

.menu {
    margin-top: 70px;
    padding-left: 15px;
    padding-right: 15px;
    /*    max-width: 1024px;*/
    /*모바일모드에서 숨김*/
}

.menu > li {
    height: 30px;
    overflow: hidden;
    text-align: center;
    margin-bottom: 15px;
    border-bottom: 2px solid #000;
    transition: all 0.5s;
}

.menu > li > p,
.menu > li > a {
    cursor: pointer;
    display: block;
    font: bold 1em/30px 'nanum_REB';
    color: #000;
}

.menu > li > p:hover,
.menu > li > a:hover {
    color: #FDB913;
}

.menu > li:nth-child(1):hover,
.menu > li:nth-child(2):hover {
    height: 150px;
}

.menu > li:nth-child(3):hover {
    height: 60px;
}

.menu_sub {
    position: relative;
}

.menu_sub > li {
    text-align: center;
}

.menu_sub > li > a {
    display: block;
    font: bold 14px/30px 'nanum_REB';
    color: #000;
}

.menu_sub > li > a:hover {
    color: #FDB913;
}

/***************배너 ******************/
#banner {
    overflow: hidden;
}

.game_banner {
    overflow: hidden;
}

.game_banner > li {
    height: 100vh;
    width: 100%;
    position: relative;
    overflow: hidden;
}

.game_banner > li > img {
    position: relative;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.more {
    cursor: pointer;
    left: 50%;
    transform: translate(-50%);
    text-align: center;
    position: absolute;
    width: 40%;
    bottom: 5%;
    background-color: #FDB913;
    color: #fff;
    font: bold 1.5em/2 'nanum_REB';
    border-radius: 20px;
    min-width: 250px;
    transition: all 0.5s;
}

.more:hover {
    background-color: #fff;
    color: #FDB913;
}

/*********** 모바일 슬라이드 버튼 안보이게 ************/
.prev,
.next {
    display: none;
}

/***************팝업*************/
.popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 102;
}

.popup > ul {
    width: 100%;
    overflow: hidden;
    /*높이자동*/
}

.popup > ul > li {
    width: 100%;
    height: 100vh;
    background-color: #000a;
    position: relative;
}

.popup > ul > li > div {
    position: absolute;
    width: 80%;
    height: 80%;
    min-width: 360px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 20px;
    overflow: hidden;
    background-color: #fff;
}

.popup_container {}

.banner_close,
.banner_close2 {
    position: absolute;
    content: "";
    width: 30px;
    height: 5px;
    background-color: #fff;
    right: 10%;
    top: 5%;
    transition: all 0.5s;
    z-index: 9999;
    cursor: pointer;
}

.banner_close {
    transform: rotate(45deg);
}

.banner_close2 {
    transform: rotate(-45deg);
}

.popup_container:hover span {
    background-color: #FDB913;
}

.popup_img {
    width: 100%;
    height: 75%;
    overflow: hidden;
}

.popup_img img {
    position: relative;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.popup_text {
    height: 25%;
    overflow: hidden;
    width: 100%;
    position: absolute;
    color: #fff;
    background-color: #000;
    border-radius: 0 0 20px 20px;
    font: 1em/1.5 'nanum_REB';
    text-align: justify;
}

.popup_text > div {
    float: left;
    padding: 10px;
    box-sizing: border-box;
}

.popup_text > div:first-child {
    width: 35%;
    text-align: center;
}

.popup_text > div:last-child {
    width: 65%;
}

.popup_more {
    margin-top: 1em;
    position: relative;
    text-align: center;
    width: 40%;
    cursor: pointer;
    background-color: #FDB913;
    border-radius: 10px;
    min-width: 150px;
    max-width: 250px;
}

.popup_more a {
    display: block;
    color: #fff;
    transition: all 0.5s;
}

.popup_more a:hover {
    background-color: #000;
    color: #FDB913;
}






/*************기업**************/
#sec1 {
    overflow: hidden;
    position: relative;

}

#sec1_bottom {
    position: relative;
    overflow: hidden;
    height: 70vh;
    /*    background-color: red;*/
}

.enterprise {
    position: relative;
    height: 70vh;
    background-color: #fffa;
    text-align: center;
    /*    font: bold 1.5em/2 'nanum_REB';*/
    overflow: hidden;
}

.enter_top {
    height: 45vh;
}

.enter_top p {
    margin: 0 auto 0 auto;
    min-width: 300px;
    max-width: 900px;
}

.enter_top > p:nth-child(1) {
    font: bold 1.5em/1.8 'nanum_REB';
    padding-top: 10vh;
}

.enter_top > p:nth-child(2) {
    font: bold 1em/1.8 'nanum_REB';
    padding-top: 5vh;
}

.enterprise > p:nth-child(2) > br {}

.enter_more {
    margin: 2.5vh auto 2.5vh auto;
    width: 40%;
    height: 5vh;
    cursor: pointer;
    background-color: #FDB913;
    color: #fff;
    border-radius: 20px;
    min-width: 350px;
    max-width: 500px;
    transition: all 0.5s;
    font: 1.5em/5vh "nanum_REB";
}

.enter_more:hover {
    background-color: #fff;
    color: #FDB913;
}

.enteretc {
    position: relative;
    cursor: pointer;
    display: grid;
    grid-template-columns: 1fr 1fr;
    background-color: #fff;
    font: bold 1.5em/15vh 'nanum_REB';
}

.enteretc > li {
    position: relative;
}

.enteretc > li:nth-child(2) {
    background-color: #FDB913;
}

.enteretc span {
    position: absolute;
    content: "";
    width: 100px;
    height: 2px;
    background-color: #000;
    left: 50%;
    bottom: 30%;
    transform: translate(-50%);
    transition: all 0.5s;
}

.enteretc > li:nth-child(2) span {
    width: 200px;
}

.enteretc > li:hover span {
    transform: translate(-10%);
}

/**********contact us popup***********/
.contact_popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 102;
    text-align: justify;
    font: 1em/1.5 '';
}

.contact_popup > ul {
    width: 100%;
    overflow: hidden;
    /*높이자동*/
}

.contact_popup > ul > li {
    width: 100%;
    height: 100vh;
    background-color: #000a;
    overflow: hidden;
    position: relative;
}

.contact_popup > ul > li > div {
    position: absolute;
    width: 80%;
    height: 80%;
    min-width: 360px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 20px;
    background-color: #fff;
    overflow: hidden;
}

.contact_popup_container {}

.contact_close,
.contact_close2 {
    position: absolute;
    content: "";
    width: 30px;
    height: 5px;
    background-color: #fff;
    right: 10%;
    top: 5%;
    transition: all 0.5s;
    z-index: 9999;
    cursor: pointer;
}

.contact_close {
    transform: rotate(45deg);
}

.contact_close2 {
    transform: rotate(-45deg);
}

.contact_popup_container:hover span {
    background-color: #FDB913;
}

/*****************폼 스타일******************/
.content_head {
    text-align: center;
    font: 2em/2 "nanum_REB";
    margin-top: 5%;
}

.contact_form_container {
    width: 80%;
    margin: 0 auto;
}

.contact_text {
    text-align: center;
    font-size: 20px;
    font: 1.5em/1.5 "nanum_R";
}

.form-elements {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}

form {
    margin-top: 5%;
}

#text_title {
    width: 100%;
    height: 25px;
    font: 14px "nanum_R";
}

#email {
    width: 100%;
    height: 25px;
    font: 14px "nanum_R";
}

#text_contents {
    width: 100%;
    font: 14px "nanum_R";
}

.btn-dark {
    background-color: #FDB913;
    padding: 5px 10px;
    border: 1px solid #fff;
    color: #fff;
    font-weight: bold;
    border-radius: 5px;
    cursor: pointer;
}

.btn-dark:hover {
    background-color: #000;
}

.thankyou_message {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 80%;
    color: #FDB913;
    font: 1.5em/2 "nanum_REB";

}


/***********푸터**************/
#footer {
    border-top: 1px solid #000;
    box-sizing: border-box;
    background-color: #fff;
    height: 30vh;
    width: 100%;
    overflow: hidden;
    position: relative;
}

.footer_top {
    margin-top: 10px;
    width: 100%;
    height: 80px;
    display: flex;
    justify-content: space-between;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
}

.footer_top > div {}

.bottom_logo {
    width: 130px;
}

.bottom_logo img {
    width: 100%;
}

.blog_etc {
    width: 123px;
    height: 35px;
}

.blog_etc img {
    height: 100%;
}

.footer_bottom {
    text-align: center;
    width: 100%;
}

.footer_bottom_left {
    display: none;
}

.fnb {
    margin: 0 auto;
    max-width: 1024px;
    min-width: 350px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    font: bold 1em/1.5 'nanum_REB';
    margin-bottom: 10px;
}

.fnb > li {
    cursor: pointer;
    position: relative;
    color: #000;
    /*    font-size: 14px;*/
}

.fnb > li::after {
    content: "";
    width: 2px;
    height: 15px;
    position: absolute;
    background-color: #000;
    top: 4px;
    right: 0;
    border-radius: 1px;
}

.fnb > li:nth-child(6)::after {
    content: none;
}

.fnb > li:hover::after {
    color: #000;
}



.fnb > li > a {
    color: #000;
    display: block;
}

.fnb > li:hover {
    color: #FDB913;
}

.fnb > li > a:hover {
    color: #FDB913;
}

.fnb > li:last-child {
    border-right: 0;
}

.footer_bottom p {}

/*패밀리사이트*/
.family_site {
    cursor: pointer;
}

.family_site:hover {
    color: #FDB913;
}

.family_site ul {
    position: absolute;
    top: 1.5;
    width: 100%;
    background: #283341;
}

.family_site ul li a {
    display: block;
    position: relative;
    padding: 5px 0;
    font-size: 12px;
    color: #dddfe2;
    text-decoration: none;
}

.footer_bottom_right > p {
    font: normal 14px/1.5 'nanum_R';
}

.footer_bottom_right > small {
    font: 12px/1.5 'nanum_R';
}

.family_site ul li a:hover {
    color: #FDB913;
}

.footer_bottom_right > p > strong {
    cursor: pointer;
    color: #FDB913;
    font: bold 1em/1 '';
}

.footer_bottom_right > p > strong:hover {
    color: #000;
}

/*******하단 팝업 *********/
.footer_popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 102;
    text-align: justify;
    font: 1em/1.5 '';
}

.footer_popup > ul {
    width: 100%;
    overflow: hidden;
    /*높이자동*/
}

.footer_popup > ul > li {
    width: 100%;
    height: 100vh;
    background-color: #000a;
    overflow: hidden;
    position: relative;
}

.footer_popup > ul > li > div {
    position: absolute;
    width: 80%;
    height: 80%;
    min-width: 360px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 20px;
    background-color: #fff;
    overflow: hidden;
}

.footer_popup > ul > li > div > div {
    overflow: scroll;
    position: relative;
    padding-top: 5%;
    padding-bottom: 5%;
    box-sizing: border-box;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 90%;
    height: 80%;
}

.footer_popup > ul > li > div > div > p {
    width: 95%;
}

.footer_popup_ul_li {
    width: 95%;
    border: 1px solid #000;
    border-radius: 5px;
    box-sizing: border-box;
    overflow: hidden;
}

.footer_popup_ul_li a {
    color: #FDB913;
}

.footer_popup_ul_li a:hover {
    color: #000;
}

.footer_popup_ul_li > li {
    padding: 10px;
    border-bottom: 1px solid #000;
    box-sizing: border-box;
    overflow: hidden;
}

.footer_popup_ul_li > li:last-child {
    border-bottom: 0;
}

.footer_popup_ul_li > li:nth-child(n+1):nth-child(-n+16) > div:nth-child(1) {
    font: bold 1em/1.5 '';
}

.footer_popup_ul_li > li:nth-child(n+1):nth-child(-n+16) > div:nth-child(2) {
    font: 1em/1.8 '';
}

.footer_popup_ul_li > li:nth-child(17) {
    font: 1em/1.8 '';
}


.footer_banner_close,
.footer_banner_close2 {
    position: absolute;
    content: "";
    width: 30px;
    height: 5px;
    background-color: #fff;
    right: 10%;
    top: 5%;
    transition: all 0.5s;
    z-index: 9999;
    cursor: pointer;
}

.footer_banner_close {
    transform: rotate(45deg);
}

.footer_banner_close2 {
    transform: rotate(-45deg);
}

.footer_popup_container:hover span {
    background-color: #FDB913;
}

.policy_table {
    width: 95%;
    border-collapse: collapse;
    text-align: center;
}


/******** scroll 이쁘게 꾸미기 *********/
/***** scroll bar *****/
body::-webkit-scrollbar {
    width: 8px;
    /* 스크롤바의 너비 */
    height: 8px;
}

body::-webkit-scrollbar-thumb {
    height: 30%;
    /* 스크롤바의 길이 */
    background: #ffa500;
    /* 스크롤바의 색상 */
    border-radius: 10px;
}

body::-webkit-scrollbar-track {
    background: #000;
    /*스크롤바 뒷 배경 색상*/
}



.footer_popup > ul > li > div > div::-webkit-scrollbar {
    width: 8px;
    /* 스크롤바의 너비 */
    height: 0px;
}

.footer_popup > ul > li > div > div::-webkit-scrollbar-thumb {
    height: 30%;
    /* 스크롤바의 길이 */
    background: #FDB913;
    /* 스크롤바의 색상 */
    border-radius: 10px;
}

.footer_popup > ul > li > div > div::-webkit-scrollbar-track {
    background: #000;
    /*스크롤바 뒷 배경 색상*/
}

/********************* 소개 ********************/
/************** 네오플 소개**************/
#sec2 {
    display: none;
    overflow: hidden;
}

#sec2_1,
#sec2_2,
#sec2_3,
#sec2_4 {
    position: relative;
    height: 1080px;
    background-color: #000;
}

.sec2_1_logo {
    position: relative;
    height: auto;
    margin: 0 auto;
    width: 50%;
    max-width: 600px;
    min-width: 400px;
    top: 50%;
    transform: translate(0, -50%);
    opacity: 0;
    transition: all 1s;
}

.sec2_1_logo img {
    position: relative;
    width: 100%;
}

.sec2_1_logo > p {
    text-align: center;
    color: #fff;
    font: 1.5em/1.5 'nanum_REB';
    margin-top: 5%;
}



#sec2_2 {
    background-color: #ffeeda;
    overflow: hidden;
    position: relative;
}

.sec2_2_box {
    position: relative;
    padding-top: 10vh;
    margin: 0 auto;
    width: 80%;
    height: 100%;
    max-width: 500px;
    box-sizing: border-box;
}

.sec2_2_box > li {
    opacity: 0;
    transition: all 1s;
}

.sec2_2_box > li > p:nth-child(2) {
    text-align: center;
    font: 1em/1.5 'nanum_REB';
}

.sec2_2_box > li > p:nth-child(3) {
    text-align: center;
    font: 1.5em/1.8 'nanum_REB';
    color: #ffa500;
}

.sec2_2_box > li > p:nth-child(4) {
    text-align: center;
    font: 1em/1.8 'nanum_REB';
}

.sec2_2_box_img {
    /*    background-color: #fff;*/
    position: relative;
    left: 50%;
    transform: translate(-50%);
}

.sec2_2_box_img img {
    position: relative;
    width: 15vh;
    left: 50%;
    transform: translate(-50%);
}


#sec2_3 {
    overflow: hidden;
    background-color: #FDB913;
}

.sec2_3_ul {
    position: relative;
    top: 50%;
    transform: translate(0, -50%);
    width: 80%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    max-width: 1000px;
}

.sec2_3_ul > li > div {
    text-align: center;
    position: relative;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.sec2_3_ul > li:nth-child(1) {
    grid-row: 1 / span 3;
    width: 80%;
}

.sec2_3_ul > li:nth-child(1) p {
    font: 1.5em/1.5 'nanum_REB';
    color: #fff;
    margin-top: 10px;
}

.sec2_3_ul > li img {
    width: 30%;
}

.sec2_3_ul > li:nth-child(2),
.sec2_3_ul > li:nth-child(3),
.sec2_3_ul > li:nth-child(4) {
    grid-column: 2 / span 2;
    width: 100%;
    margin-bottom: 30px;
}

.sec2_3_ul > li:nth-child(2) > div > p:nth-child(1),
.sec2_3_ul > li:nth-child(3) > div > p:nth-child(1),
.sec2_3_ul > li:nth-child(4) > div > p:nth-child(1) {
    font: 1.5em/1.5 'nanum_REB';
    color: #fff;
    background-color: #000;
    border-radius: 5px;
    margin-bottom: 15px;
}

.sec2_3_ul > li:nth-child(2) > div > p:nth-child(2),
.sec2_3_ul > li:nth-child(3) > div > p:nth-child(2),
.sec2_3_ul > li:nth-child(4) > div > p:nth-child(2) {
    font: 1em/1.8 'nanum_REB';
    text-align: justify;
}

#sec2_4 {
    background-color: #e2e2e2;
    height: auto;
    overflow: hidden;
}

.sec2_4_1 {
    margin-top: 10%;
    box-sizing: border-box;
    width: 100%;
    text-align: center;
    background-image: url(../img/neople_sogae/neople_back.png);
    background-position: center;
    background-repeat: no-repeat;
    padding-top: 3%;
    padding-bottom: 3%;
    overflow: hidden;
}

.sec2_4_1 img {
    width: 80%;
    max-width: 600px;
}

.sec2_4_2 {
    overflow: hidden;
    margin-bottom: 50px;
    /*    background-color: pink;*/
}

.sec2_4_2 > p {
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
}

.sec2_4_2 > p:nth-child(1) {
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
    font: 1.5em/2 "nanum_REB";
}

.sec2_4_2 > p:nth-child(2) {
    font: 1em/1.8 "nanum_R";
    min-width: 360px;
    max-width: 1024px;
    text-align: justify;
    margin: 0 auto;
}

.sec2_4_3 {
    overflow: hidden;
}

.neople_ci_ul {
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr;
}

.neople_ci_ul > li {
    text-align: center;
}

.neople_ci_ul > li:last-child {
    margin-bottom: 100px;
}

.neople_ci_ul > li > img {
    width: 80%;
    max-width: 500px;
}

.neople_ci_ul > li > p {
    margin-top: 30px;
    margin-bottom: 30px;
    font: 1.5em/1.5 "nanum_REB";
}

/************** 걸어온길**************/
#sec3 {
    display: none;
    overflow: hidden;
}

#sec3_1 {
    position: relative;
    overflow: hidden;
    /*    background-color: #e2e2e2;*/
}

.sec3_1_container {
    position: relative;
}

.sec3_1_ul {
    margin: 150px auto 150px auto;
    width: 80%;
    height: auto;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.sec3_1_ul > li {
    position: relative;
    /*    border-radius: 50%;*/
    left: 50%;
    transform: translate(-50%);
    overflow: hidden;
    /*    background-color: #ddd;*/
}

.sec3_1_ul_top {
    left: 50%;
    transform: translate(-50%);
    position: relative;
    width: 200px;
    height: 200px;
    background-color: #000;
    border-radius: 50%;
    margin-bottom: 20px;
    overflow: hidden;
}

.sec3_1_ul_top > p {
    position: relative;
    top: 50%;
    transform: translate(0, -50%);
    font: 2em/1 'nanum_REB';
    color: #fff;
}

.sec3_1_ul_bottom {
    position: relative;
    margin: 0 auto;
    min-width: 400px;
    /*    max-width: 500px;*/
}

.sec3_1_ul_bottom > ul > li {
    margin-bottom: 20px;
}

.sec3_1_ul_bottom > ul > li > p:nth-child(1) {
    font: 1.5em/2 'nanum_REB';
}

.sec3_1_ul_bottom > ul > li > p:nth-child(2) {
    font: 1em/1.8 'nanum_R';
    /*    border-bottom: 3px solid #FDB913;*/
}

.sec3_1_ul_li {
    display: none;
}

.sec3_1_ul_btn {
    z-index: 1;
    position: absolute;
    width: 80%;
    max-width: 1024px;
    top: 100px;
    left: 50%;
    transform: translate(-50%);
}

.sec3_1_ul_prev,
.sec3_1_ul_next {
    cursor: pointer;
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    border-top: 5px solid #000;
    border-right: 5px solid #000;
}

.sec3_1_ul_prev {
    transform: rotate(-135deg);
    left: 15px;
}

.sec3_1_ul_next {
    transform: rotate(45deg);
    right: 15px;
}





/************** 소식 **************/
#sec4 {
    display: none;
    position: relative;
    /*    background-color: #dedede;*/

}

.sec4_1_img {
    margin: 0 auto;
    margin-bottom: 5%;
    max-width: 1024px;
}

.sec4_1_img img {
    position: relative;
    left: 50%;
    transform: translate(-50%);
    min-width: 20%;
    max-width: 50%;
}

#sec4_1 {
    padding-top: 10%;
    padding-bottom: 10%;
    box-sizing: border-box;
    min-height: 100vh;
    position: relative;
}

#sec4_1 > p {
    text-align: center;
    font: 2em/1.5 'nanum_REB';
}

#result {
    padding-left: 15px;
    min-width: 300px;
    max-width: 1024px;
    margin: 0 auto;
}

.news_top,
.news_bottom {
    padding-left: 15px;
    padding-right: 15px;
    max-width: 1024px;
    margin: 0 auto;
}

.news_top {
    margin: 0 auto 0px auto;
    background-color: #ffa500;
    border-radius: 5px;
}

.news_bottom {
    margin-bottom: 50px;
}

.news_top > li {
    display: grid;
    grid-template-columns: 3fr 1fr;
    text-align: center;
    color: #fff;
    font: 18px/2 'nanum_REB';
}

.news_top > li > div:nth-child(1) {}

.news_top > li > div:nth-child(2) {
    /*    background-color: #ffa500;*/
}

.news_bottom > li {
    display: grid;
    grid-template-columns: 3fr 1fr;
    border-bottom: 1px dashed #000;
}

.news_bottom > li > div:nth-child(1),
.news_bottom > li > div:nth-child(2) {
    cursor: pointer;
    text-align: center;
    font: 16px/2.5 'nanum_REB';
}

.news_bottom > li > div:nth-child(1):hover,
.news_bottom > li > div:nth-child(2):hover {
    color: #ffa500;
}

.news_bottom > li > div:nth-child(3) {
    text-align: justify;
    grid-column: 1 / span 2;
    font: 16px/1.8 'nanum_R';
}

.news_bottom_box {
    position: relative;
    left: 50%;
    transform: translate(-50%);
    width: 90%;
    margin-bottom: 20px;
}

.news_more_10 {
    min-width: 100px;
    max-width: 150px;
    background-color: #FDB913;
    border-radius: 10px;
    margin: 0 auto;
    cursor: pointer;
    color: #fff;
    transition: all 0.5s;
}

.news_more_10 > p {
    font: 1em/2 'nanum_REB';
    text-align: center;
    display: block;
}

.news_more_10:hover {
    background-color: #fff;
    color: #FDB913;
}

.news_small_10 {
    min-width: 100px;
    max-width: 150px;
    background-color: #FDB913;
    border-radius: 10px;
    margin: 0 auto;
    cursor: pointer;
    color: #fff;
    transition: all 0.5s;
}

.news_small_10 > p {
    font: 1em/2 'nanum_REB';
    text-align: center;
    display: block;
}

.news_small_10:hover {
    background-color: #fff;
    color: #FDB913;
}

#result {
    margin-top: 10px;
    margin-bottom: 10px;
    font: 1em/1.5 'nanum_REB';
}

/***********검색창**************/

.search {
    width: 100%;
    position: relative;
    min-width: 300px;
    max-width: 1024px;
    margin: 20px auto;
    overflow: hidden;
    text-align: right;
    padding-right: 15px;
    box-sizing: border-box;
}

.search_list {
    height: 30px;
}

input {
    border: 1px solid #000;
    position: relative;
    height: 20px;
}


.searchB {
    position: absolute;
    top: 0;
    right: 15px;
    height: 30px;
    width: 30px;
    border: 1px solid #000;
    background-color: #ffa500;
    cursor: pointer;
}

.rect {
    position: absolute;
    border: 2px solid #fff;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    left: 10%;
    top: 10%;
}

.line {
    position: absolute;
    height: 2px;
    width: 14px;
    left: 16px;
    top: 20px;
    background-color: #fff;
    transform: rotate(40deg);
}




/************** 오시는 길 **************/
#sec5 {
    display: none;
    overflow: hidden;
}

#sec5_1 {
    overflow: hidden;
    /*    background-color: #ffeeda;*/
}

.sec5_1_map {
    padding-top: 10%;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
    margin: 0 auto;

    margin-bottom: 150px;
    max-width: 1024px;
    min-width: 350px;
    /*    background-color: red;*/
}

.sec5_1_map > ul > li {
    position: relative;
    margin-bottom: 10%;
}

.sec5_1_map iframe {
    border-radius: 20px;
    width: 100%;
    position: relative;
    left: 50%;
    transform: translate(-50%);
}

.sec5_1_map > ul > li:nth-child(1) p:nth-child(1) {
    font: 1.5em/2 'nanum_REB';
    margin-bottom: 10px;
}



.sec5_1_map>ul>li:nth-child(2)>div>p:nth-child(1),.sec5_1_map>ul>li:nth-child(3)>div>p:nth-child(1){
    font: 1em/2 'nanum_REB'
}

.sec5_1_map > ul > li:nth-child(2)>div>p:nth-child(3),
.sec5_1_map > ul > li:nth-child(2) p:nth-child(5) {
    font: 1em/1 'nanum_R';
    margin-bottom: 10px;
}


.sec5_1_map > ul > li:nth-child(3) p:nth-child(3),
.sec5_1_map > ul > li:nth-child(3) p:nth-child(5) {
    font: 1em/1 'nanum_R';
    margin-bottom: 10px;
}






.sec5_1_map > ul > li:nth-child(2) img {
    position: relative;
    width: 40px;
    left: 20px;
    top: -5px;
}

.sec5_1_map > ul > li:nth-child(3) img {
    position: relative;
    width: 40px;
    left: 20px;
    top: -5px;
}

/********************* 게임 ********************/
#sec6 {
    display: none;
    overflow: hidden;
}

#sec6_1 {
    overflow: hidden;
    position: relative;
    /*    height: 100vh;*/
}

.sec6_1_1 > li {
    position: relative;
    height: 100vh;
    overflow: hidden;
}

.sec6_1_1 > li img {
    position: relative;
    left: 50%;
    transform: translate(-50%);
}

.sec6_1_1 > li:nth-child(4) img {
    transform: translate(-70%);
}

.set6_1_text {
    /*    overflow: hidden;*/
    width: 80%;
    min-width: 300px;
    max-width: 500px;
    position: absolute;
    left: 50%;
    bottom: 20%;
    transform: translate(-50%);
    background-color: #000a;
    /*    z-index: 1;*/
    text-align: center;
    color: #fff;
    border-radius: 10px;
}

.set6_1_text > p:nth-child(1) {
    font: bold 2em/2 'nanum_REB';
}

.set6_1_text > p:nth-child(2) {
    font: bold 1em/2 'nanum_REB';
}

.set6_1_text > p:nth-child(3) {
    position: relative;
    left: 50%;
    transform: translate(-50%);
    width: 300px;
    text-align: justify;
    line-height: 1.8;
    margin-bottom: 10px;
    display: none;
}

.sec6_1_1_imgbox {
    overflow: hidden;
    position: absolute;
    left: 50%;
    bottom: 10%;
    transform: translate(-50%);
    width: 360px;
    border: 1px solid #fff;
    /*    z-index: 1;*/
    cursor: pointer;
    background-color: #FDB913;
}

.sec6_1_1_imgbox > a {
    display: block;
}

.sec6_1_1_imgbox:hover > .sec6_1_1_imgbox_back {
    height: 0%;
}

.sec6_1_1_imgbox_back {
    overflow: hidden;
    transition: all 0.5s;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #000;
}

.sec6_1_1_imgbox img {
    padding: 2%;
}

.sec6_1_1_icon {
    position: fixed;
    top: 8%;
    left: 50%;
    transform: translate(-50%);
    overflow: hidden;
    width: 360px;
    height: 60px;
    z-index: 2;
}

.sec6_1_1_icon > ul {
    position: absolute;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
}

.sec6_1_1_icon > ul > li {
    /*    cursor: pointer;*/
}

.sec6_1_1_icon > ul > li > a {
    display: block;
    width: 100%;
    height: 100%;
}

.sec6_1_1_icon > ul > li:nth-child(1) {
    width: 90px;
    height: 50px;
    background-image: url(../img/game_sogae/game_icon/dnf_swipe.png);
    background-repeat: no-repeat;
    background-position: top;
}

.sec6_1_1_icon > ul > li:nth-child(1):hover {
    background-position: 0 -50px;
}

.sec6_1_1_icon > ul > li:nth-child(1).back_pos_1 {
    background-position: 0 -50px;
}


.sec6_1_1_icon > ul > li:nth-child(2) {
    width: 90px;
    height: 50px;
    background-image: url(../img/game_sogae/game_icon/dnf_m_swipe.png);
    background-repeat: no-repeat;
    background-position: top;
}

.sec6_1_1_icon > ul > li:nth-child(2):hover {
    background-position: 7px -50px;
}

.sec6_1_1_icon > ul > li:nth-child(2).back_pos_2 {
    background-position: 7px -50px;
}



.sec6_1_1_icon > ul > li:nth-child(3) {
    width: 90px;
    height: 50px;
    background-image: url(../img/game_sogae/game_icon/cyphers_swipe.png);
    background-repeat: no-repeat;
    background-position: 25px 0px;
}

.sec6_1_1_icon > ul > li:nth-child(3):hover {
    background-position: 25px -50px;
}

.sec6_1_1_icon > ul > li:nth-child(3).back_pos_3 {
    background-position: 25px -50px;
}



.sec6_1_1_icon > ul > li:nth-child(4) {
    width: 90px;
    height: 55px;
    background-image: url(../img/game_sogae/game_icon/dnf_duel_swipe.png);
    background-repeat: no-repeat;
    background-position: top;
}

.sec6_1_1_icon > ul > li:nth-child(4):hover {
    background-position: 11px -59.5px;
}

.sec6_1_1_icon > ul > li:nth-child(4).back_pos_4 {
    background-position: 11px -59.5px;
}


/********************* 채용 ********************/
#sec7 {
    display: none;
    overflow: hidden;
}

#sec7_1 {
    overflow: hidden;
    /*    height: 100vh;*/
    background-color: #fff;
}

.sec7_1_1,
.sec7_1_3,
.sec7_1_4 {
    overflow: hidden;
    text-align: center;
    color: #000;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
    margin: 100px auto;
    width: 100%;
    max-width: 1024px;
}

#sec7_1 > div:nth-child(1) {
    margin-top: 10%;
}

.sec7_1_1 > p:nth-child(1) {
    font: 2em/2 "nanum_REB";
}

.sec7_1_1 > p:nth-child(2) {
    font: 1em/1.8 "nanum_REB";
}

.sec7_1_2 {
    overflow: hidden;
    text-align: center;
    padding-left: 0;
    padding-right: 0;
    max-width: 100%;
}

.sec7_1_2 > p:nth-child(1) {
    background-color: #FDB913;
    padding-top: 50px;
    font: 1.5em/2 "nanum_REB";
}

.sec7_1_2 > p:nth-child(2) {
    background-color: #FDB913;
    font: 1em/1.8 "nanum_REB";
    padding-bottom: 50px;
    margin-bottom: 100px;
}

.sec7_1_2 > ul {}

.sec7_1_2 > ul > li {
    margin-bottom: 30px;
}

.sec7_1_3 > p:nth-child(1) {
    font: 1.5em/2 "nanum_REB";
}

.sec7_1_3 > p:nth-child(2) {
    font: 1em/1.8 "nanum_REB";
}

.sec7_1_4 > p:nth-child(1) {
    font: 1.5em/1.5 "nanum_REB";
}

.sec7_1_2_1 {
    position: relative;
    margin: 0 auto;
    width: 300px;
    height: 300px;
    background-color: #000;
    border-radius: 50%;
}

.sec7_1_2 > ul > li > div > div {
    position: absolute;
    font: 3em/300px "nanum_REB";
    color: #fff;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.sec7_1_2 > ul > li > p {
    font: 1em/1.8 "nanum_REB";
}

.temwork_br {
    display: none;
}

.sec7_1_3 > div {
    width: 100%;
    margin-top: 50px;
    overflow: hidden;
}

.sec7_1_3 > div > img {}

.sec7_1_4 {
    position: relative;
}

.sec7_1_4 > div:last-child {
    background-color: #FDB913;
    margin: 80px auto;
    width: 240px;
    font: 1.5em/50px "nanum_REB";
    border-radius: 20px;
    transition: all 0.5s;
}

.sec7_1_4 > div:last-child > a {
    transition: all 0.5s;
    display: block;
    color: #fff;
}

.sec7_1_4 > div:last-child:hover {
    background-color: #fff;
}

.sec7_1_4 > div:last-child > a:hover {
    color: #FDB913;
}

.sec7_1_4_arrow {
    min-width: 350px;
}

.sec7_1_4_arrow > img:nth-child(1) {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-180px, -40px);
}

.sec7_1_4_arrow > img:nth-child(2) {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(120px, -40px);
}

.sec7_1_4_arrow > img:nth-child(3) {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-210px, -80px);
    animation: bunjuck 2s infinite;
}

.sec7_1_4_arrow > img:nth-child(4) {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(160px, -80px);
    animation: bunjuck 2s infinite;
}

@keyframes bunjuck {
    0% {
        opacity: 0;
    }

    49% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    99% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}


/********************* IR ********************/
#sec8 {
    display: none;
    position: relative;
    /*    background-color: #dedede;*/
}

.sec8_1_img {
    margin: 0 auto;
    margin-bottom: 5%;
    max-width: 1024px;
}

.sec8_1_img img {
    position: relative;
    left: 50%;
    transform: translate(-50%);
    min-width: 20%;
    max-width: 50%;
}

#sec8_1 {
    padding-top: 10%;
    padding-bottom: 10%;
    box-sizing: border-box;
    min-height: 100vh;
    position: relative;
}

#sec8_1 > p {
    text-align: center;
    font: 2em/1.5 'nanum_REB';
}

#result_2 {
    padding-left: 15px;
    min-width: 300px;
    max-width: 1024px;
    margin: 10px auto;
    font: 1em/1.5 'nanum_REB';
}


.ir_top,
.ir_bottom {
    padding-left: 15px;
    padding-right: 15px;
    max-width: 1024px;
    margin: 0 auto;
}

.ir_top {
    margin: 0 auto 0px auto;
    background-color: #ffa500;
    border-radius: 5px;
}

.ir_bottom {
    margin-bottom: 50px;
}

.ir_top > li {
    display: grid;
    grid-template-columns: 3fr 1fr;
    text-align: center;
    font: 18px/2 'nanum_REB';
    color: #fff;
}

.ir_top > li > div:nth-child(1) {}

.ir_top > li > div:nth-child(2) {
    /*    background-color: #fff;*/
}

.ir_bottom > li {
    display: grid;
    grid-template-columns: 3fr 1fr;
    border-bottom: 1px dashed #000;
}

.ir_bottom > li > div:nth-child(1),
.ir_bottom > li > div:nth-child(2) {
    cursor: pointer;
    text-align: center;
    font: 16px/2.5 'nanum_REB';
}

.ir_bottom > li > div:nth-child(1):hover,
.ir_bottom > li > div:nth-child(2):hover {
    color: #ffa500;
}


.ir_bottom > li > div:nth-child(3) {
    text-align: justify;
    grid-column: 1 / span 2;
    font: 16px/1.8 '';
}

.ir_bottom_box {
    position: relative;
    left: 50%;
    transform: translate(-50%);
    /*    width: 90%;*/
    margin-bottom: 20px;
}

.ir_bottom_box > img {
    position: relative;
    left: 50%;
    transform: translate(-50%);
    width: 80%;
}



/************************** 태블릿 PC 추가 설정*****************************/
@media all and (min-width:768px) {
    .header_logo {
        display: none;
    }

    .btn {
        display: none;
    }

    .menu_container {
        width: 100%;
        height: auto;
        overflow: hidden;
        background-color: #fff;
    }

    .lnb_logo {
        left: 50px;
    }

    .menu {
        margin: 30px auto;
        width: 600px;
    }

    .menu_sub > li > a {
        display: block;
        font: bold 14px/30px 'nanum_REB';
        color: #000;
    }

    .menu > li {
        float: left;
        width: calc(100% / 4);
        border-bottom: 0;
        position: relative;
    }

    .menu > li > p:hover::after,
    .menu > li > a:hover::after {
        color: #000;
    }

    .menu > li > p::after {
        content: "";
        width: 2px;
        height: 15px;
        position: absolute;
        background-color: #000;
        top: 7px;
        right: 0;
        border-radius: 1px;
    }


    /***************슬라이드************/
    #banner {
        overflow: hidden;
        width: 100%;
        position: relative;
    }

    .game_banner {
        width: 400%;
        position: relative;
    }

    .game_banner > li {
        width: 25%;
        float: left;
    }

    .prev,
    .next {
        /*크기 지정*/
        display: block;
        width: 3em;
        height: 3em;
        position: absolute;
        /*세로: #banner의 중앙*/
        top: 50%;
        transform: translate(0, -50%);
        cursor: pointer;
    }

    .prev {
        /*왼쪽 끝*/
        left: 10px;
    }

    .next {
        right: 10px;
    }

    .prev span,
    .next span {
        /*윗쪽과 오른쪽에 보더*/
        position: absolute;
        width: 2em;
        height: 2em;
        border-top: 5px solid #fff;
        border-right: 5px solid #fff;
        box-sizing: border-box;
        top: 0.5em;
        left: 0.5em;
    }

    .prev span:hover,
    .next span:hover {
        border-top: 5px solid #FDB913;
        border-right: 5px solid #FDB913;
    }

    .prev span {
        /*회전*/
        transform: rotate(-135deg);
    }

    .next span {
        /*회전*/
        transform: rotate(45deg);
    }

    .sec2_2_box {
        padding-top: 15%;
        display: grid;
        grid-template-columns: 1fr 1fr;
        max-width: 1000px;
        grid-gap: 100px;
    }

    .sec2_2_box_img {
        /*        background-color: #fff;*/
        height: 300px;
    }

    .sec2_2_box_img > img {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 50%;
    }

    .sec2_2_box > li > p:nth-child(2) {
        font: 2em/1.5 'nanum_REB';
    }

    .sec2_2_box > li > p:nth-child(3) {
        font: 1.5em/2 'nanum_REB';
    }

    .sec2_2_box > li > p:nth-child(4) {
        font: bold 1em/2 'nanum_R';
    }

    .sec2_3_ul {
        grid-gap: 30px;
    }

    .sec2_3_ul > li > div {}

    .sec2_3_ul > li:nth-child(1) {
        grid-column: 1 / span 3;
        width: 100%;
    }

    .sec2_3_ul > li:nth-child(1) p {
        font: 2em/1.5 'nanum_REB';
        color: #fff;
    }

    .sec2_3_ul > li img {
        width: 30%;
    }

    .sec2_3_ul > li:nth-child(2),
    .sec2_3_ul > li:nth-child(3),
    .sec2_3_ul > li:nth-child(4) {
        grid-column: initial;
    }

    .sec2_3_ul > li:nth-child(2) > div,
    .sec2_3_ul > li:nth-child(3) > div,
    .sec2_3_ul > li:nth-child(4) > div {
        position: relative;
        top: 0;
        transform: translate(-50%, 0);
    }

    .sec2_3_ul > li:nth-child(2) > div > p:nth-child(2),
    .sec2_3_ul > li:nth-child(3) > div > p:nth-child(2),
    .sec2_3_ul > li:nth-child(4) > div > p:nth-child(2) {
        font: bold 1em/1.8 'nanum_R';
        text-align: justify;
    }

    .sec2_4_2 > p:nth-child(2) {
        text-align: center;
    }

    .sec2_4_3 {
        overflow: hidden;
    }

    .neople_ci_ul {
        grid-template-columns: 1fr 1fr 1fr;
        max-width: 1024px;
        margin: 0 auto;
    }

    .sec5_1_map > ul {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .sec5_1_map > ul > li:nth-child(1) {
        grid-column: 1 / span 2;
    }

    .sec5_1_map > ul > li:nth-child(2),
    .sec5_1_map > ul > li:nth-child(3) {
        width: 60%;
        left: 20%;
    }


    /************ 하단 사업자정보란 *****************/
    .footer_popup_ul_li {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .footer_popup_ul_li > li:last-child {
        display: grid;
        grid-column: 1 / span 2;
    }

    .footer_popup_ul_li > li:nth-child(5),
    .footer_popup_ul_li > li:nth-child(n+12):nth-child(-n+16) {
        display: grid;
        grid-template-columns: 1fr 3fr;
        grid-column: 1 / span 2;
    }

    .footer_popup_ul_li > li:nth-child(1),
    .footer_popup_ul_li > li:nth-child(2),
    .footer_popup_ul_li > li:nth-child(3),
    .footer_popup_ul_li > li:nth-child(4),
    .footer_popup_ul_li > li:nth-child(6),
    .footer_popup_ul_li > li:nth-child(7),
    .footer_popup_ul_li > li:nth-child(8),
    .footer_popup_ul_li > li:nth-child(9),
    .footer_popup_ul_li > li:nth-child(10),
    .footer_popup_ul_li > li:nth-child(11) {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    /***********게임소개 텍스트*****************/
    .set6_1_text > p:nth-child(3) {
        display: block;
    }

    /************게임소개 아이콘*****************/
    .sec6_1_1 > li:nth-child(4) img {
        transform: translate(-50%);
    }

    .sec6_1_1_icon {
        top: 20%;
        left: 5%;
        width: 90px;
        height: 270px;
    }

    .sec6_1_1_icon > ul {
        position: absolute;
        overflow: hidden;
        display: block;
    }

    .sec6_1_1_icon > ul > li {
        margin-bottom: 20px;
    }


    .sec7_1_2_ul {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-gap: 50px;
        max-width: 1024px;
        margin: 0 auto;
        overflow: hidden;
    }

    .sec7_1_2_1 {
        position: relative;
        margin: 0 auto;
        width: 100%;
        height: calc((100vw - 100px) / 3);
        max-height: calc((1024px - 100px) / 3);
        background-color: #000;
        border-radius: 50%;
    }


    .sec7_1_2 > ul > li > div > div {
        font: 2.5em/calc((1024px - 100px) / 3) "nanum_REB";
    }

    .temwork_br {
        display: block;
    }


    .sec7_1_4 > p:nth-child(1) {
        font: 2em/2 "nanum_REB";
    }

    .sec7_1_4 > div:last-child {
        width: 340px;
    }

    .sec7_1_4_arrow > img:nth-child(1) {
        transform: translate(-240px, -30px);
    }

    .sec7_1_4_arrow > img:nth-child(2) {
        transform: translate(180px, -30px);
    }

    .sec7_1_4_arrow > img:nth-child(3) {
        transform: translate(-280px, -70px);
    }

    .sec7_1_4_arrow > img:nth-child(4) {
        transform: translate(220px, -70px);
    }
}



/************************** PC웹 추가 설정*****************************/
@media all and (min-width:1024px) {
    .menu {
        margin: 30px auto;
        width: 80%;
        min-width: 500px;
        max-width: 1024px;
    }

    .menu_sub > li > a {
        display: block;
        font: bold 14px/30px 'nanum_REB';
        color: #000;
    }

    #banner {
        overflow: hidden;
        width: 100%;
        position: relative;
    }

    .game_banner {
        width: 100%;
    }

    .game_banner_back {
        left: 0;
        top: 0;
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: #0007;
    }

    .game_banner > li:hover .game_banner_back {
        background-color: #0000;
    }

    .game_banner > li {
        transition: all 0.5s;
    }

    .more {
        font: bold 1.5em/1.5 'nanum_REB';
        min-width: 200px;
    }

    .prev,
    .next {
        /*크기 지정*/
        display: none;
    }

    .sec2_2_box > li > img {
        height: 400px;
    }

    .footer_bottom {
        width: 100%;
        /*        overflow: hidden;*/
    }

    .footer_bottom > div {
        float: left;
    }

    .footer_bottom_left {
        display: block;
        position: relative;
        width: 25%;
        margin-right: 15%;
        margin-left: calc(10% - 15px);

    }

    .footer_bottom_left > ul {}

    .footer_bottom_left > ul > li {
        float: left;
        width: 33.333333%;
        font-family: "nanum_REB";
        font: 16px/1.5 'nanum_REB';
    }

    .footer_bottom_left > ul > li > ul > li > a {
        display: block;
        color: #000;
        font: 14px/1.8 'nanum_REB';
    }

    .footer_bottom_left > ul > li > ul > li > a:hover {
        color: #FDB913;
    }

    .footer_bottom_left {}

    .footer_bottom_right {
        position: relative;
        width: 50%;
        right: 15px;
    }

    .footer_bottom_right > p,
    .footer_bottom_right > small {
        display: block;
        text-align: right;
        padding-right: 25px;
        box-sizing: border-box;
    }
}