@charset "utf-8";

/* **************************** //필수 CSS 수정 및 삭제 불가 **************************** */

* {box-sizing: border-box;}
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,img { margin:0; padding:0; word-break:keep-all;}
html { width:100%; }
body { height:100%; font-family:'Roboto', 'Noto_Sans',sans-serif; color:#000; font-size:16px; line-height:1.6em; letter-spacing:-0.02em;}
body { overflow-y:auto; }
body.hidden { overflow-y:hidden; }
body#popup { min-width:0; }
li { list-style:none; }
img,fieldset { border:none; vertical-align:top; }
table { width:100%; border:0; border-spacing:0; border-collapse:collapse; }
caption { display:none; }
th,td { border:0; vertical-align:top; }
table.timeline_table th, table.timeline_table td { vertical-align:middle; }
button { overflow:visible; padding:0; margin:0; border:0; cursor:pointer; font-family:'Roboto', 'Noto_Sans',sans-serif !important;}
hr.layout { display:none; }

/* select, input {height:25px; font-size:16px; font-family:'OpenSans', 'Noto_Sans',sans-serif; color:#000; padding:0 6px; border:1px solid #ccc;} */

.floaleft {float:left}
.floaright {float:right}

a { text-decoration:none; color:inherit;}
a:hover { text-decoration:none;  color:inherit;}
a:active { text-decoration:none;  color:inherit;}

/* html::-webkit-scrollbar {width: 4px;  } */
/* html::-webkit-scrollbar-thumb {background-color: #444; border-radius: 3px;} */
/* html::-webkit-scrollbar-track {background-color:#f97244;} */
html::-webkit-scrollbar { width: 10px; height: 10px; }
html::-webkit-scrollbar-track { background-color:#0000; }
html::-webkit-scrollbar-thumb { background: #ccc; }
html::-webkit-scrollbar-thumb:hover { background: #404040; }
html::-webkit-scrollbar-thumb:active { background: #808080; }
html::-webkit-scrollbar-button { display: none; }
html::-webkit-scrollbar-corner { background-color:#0000; }
/***********************************/
.mt0 {margin-top:0px !important;}
.mt1 {margin-top:1px !important}
.mt2 {margin-top:2px !important}
.mt3 {margin-top:3px !important}
.mt4 {margin-top:4px !important}
.mt5 {margin-top:5px !important}
.mt10 {margin-top:10px !important}
.mt15 {margin-top:15px !important}
.mt20 {margin-top:20px !important}
.mt25 {margin-top:25px !important}
.mt30 {margin-top:30px !important}
.mt40 {margin-top:40px !important}
.mt50 {margin-top:50px}
.mt60 {margin-top:60px}
.mt70 {margin-top:70px}
.mt80 {margin-top:80px}
.mt90 {margin-top:90px}
.mt100 {margin-top:100px}

.mb0 {margin-bottom:0px !important}
.mb5 {margin-bottom:5px !important}
.mb8 {margin-bottom:8px !important}
.mb10 {margin-bottom:10px !important}
.mb15 {margin-bottom:15px !important}
.mb20 {margin-bottom:20px !important}
.mb25 {margin-bottom:25px !important}
.mb30 {margin-bottom:30px !important}
.mb40 {margin-bottom:40px !important}
.mb45 {margin-bottom:45px !important}
.mb50 {margin-bottom:50px !important}
.mb60 {margin-bottom:60px !important}
.mb70 {margin-bottom:70px}
.mb80 {margin-bottom:80px !important}
.mb90 {margin-bottom:90px}
.mb100 {margin-bottom:100px}
.mb110 {margin-bottom:110px}
.mb120 {margin-bottom:120px}
.mb130 {margin-bottom:130px}
.mb140 {margin-bottom:140px}
.mb150 {margin-bottom:150px}

.pt0 {padding-top:0px !important}
.pt8 {padding-top:8px}
.pt10 {padding-top:10px}
.pt11 {padding-top:11px}
.pt15 {padding-top:15px}
.pt20 {padding-top:20px}
.pt30 {padding-top:30px}
.pt40 {padding-top:40px !important}
.pt50 {padding-top:50px}
.pt60 {padding-top:60px !important}
.pt70 {padding-top:70px}
.pt80 {padding-top:80px}
.pt90 {padding-top:90px}
.pt100 {padding-top:100px}

.pb0 {padding-bottom:0px !important;}
.pb7 {padding-bottom:7px}
.pb8 {padding-bottom:8px}
.pb10 {padding-bottom:10px}
.pb15 {padding-bottom:15px}
.pb20 {padding-bottom:20px !important;}
.pb30 {padding-bottom:30px}
.pb40 {padding-bottom:40px}
.pb50 {padding-bottom:50px}
.pb60 {padding-bottom:60px}
.pb70 {padding-bottom:70px}
.pb80 {padding-bottom:80px}
.pb90 {padding-bottom:90px}
.pb100 {padding-bottom:100px}
/**********************************/
.ico{
    width: 26px;height: 26px; margin: 20px 2px;
}
.w100p {width:100%; height:auto;}

.centercenter {width:auto;height:auto; position:absolute; left:50%; top:50%; z-index:99;
-ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
.leftcenter {width:100%; margin:0 auto; height:auto; position:absolute; /*left:50%; margin-left:-568px;*/ top:64%; z-index:1;
-ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%);}

.mainVisual.gameVisual .centercenter {top: 65%;}

.leftcenter .index_ti li.small {font-size:16px; font-weight:500; letter-spacing:-0.02em; line-height:1.1em; margin-bottom:8px;}
.leftcenter .index_ti li {font-size:40px; color:#fff; font-weight:900; letter-spacing:-0.0em; line-height:1.1em; color:#fff; text-shadow: 0px 0px 2px rgba(0,0,0,0.4);}

.textleft {text-align:left !important;}
.textcenter, .text_center {text-align:center;}
.underline {display:inline-block; border-bottom:1px solid #e33139;}
.em_orange {color:#e33139}

.displaynone { display:none; }

.videoWrapper {padding:0; text-align:center; position: relative; padding-bottom: 56.25%; height: 0; }
.videoWrapper iframe, .videoWrapper video {position: absolute; top: 0; left:0; width: 100%; height: 100%; }

/*body#index_body .videoWrapper {padding-bottom: 0; height: 100vh; }
body#index_body .videoWrapper iframe, body#index_body .videoWrapper video {width: 100%; height: 100%; }*/

/** 애니메이션 **/
@-webkit-keyframes fadeIn {
    from {opacity: 0}
    100% {opacity: 1}
}
@keyframes fadeIn {
    from {opacity: 0}
    100% {opacity: 1}
}

strong {font-weight:500;}
.btn_top {position: fixed; right: 30px; bottom: 30px; z-index: 10; width: 46px; height: 46px; line-height: 46px; text-align: center; border-radius: 22px;  color: #fff; background-color: #6f23f9;
letter-spacing: 0.06em; font-size: 14px; cursor: pointer;}
.white {color:#fff !important}

/** 버튼 **/
.btn_normal {display: inline-block; width: auto; height: 50px; line-height: 50px; padding: 0 40px; font-size: 18px; border:1px solid #111;}
.btn_normal:hover {background-color:#6f23f9; color:#fff; transition: background-color 0.4s; border:1px solid #6f23f9;}
.small_btn {display: inline-block; width: auto; height: 25px; line-height: 24px; padding: 0 10px; font-size: 14px; border:1px solid #111; font-weight:400;}
.small_btn:hover {background-color:#6f23f9; color:#fff; transition: background-color 0.4s; border:1px solid #6f23f9;}

h3 {text-transform:uppercase; letter-spacing: -0.015em;}
ul.conList2_1 {margin-top: 50px !important;}

.board_gallery {
    border-collapse: collapse;
    width: 100%;
}
.board_gallery td, .board_gallery a {
    color: #fff;
}
.board_gallery .g_type:nth-child(3n+1) {
    margin-left: 0;
}
.board_gallery .g_type .g_con a {
    display: block;
    height: 260px;
}
.board_gallery .g_type .g_text {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 8px 0 16px;
    background: rgba(0,0,0,0.6);
}
.board_gallery .g_type .g_text a {
    display: block;
    width: 90%;
    margin: 0 auto;
    padding: 5px 0 2px 0;
    white-space: nowrap;
    overflow: hidden;
    font-size: 17px;
    color: #fff;
}
.board_gallery .g_type {
    position: relative;
    width: 31%;
    float: left;
    margin: 10px 0 10px 3.5%;
    display: inline-block;
}
select, input {
    height: 44px;
    font-size: 16px;
    font-family: 'OpenSans', 'Noto_Sans',sans-serif;
    color: #000;
    padding: 0 6px;
    border: 1px solid #ccc;
}
/*
중앙정렬
-ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%);
:after {content:" "; display:block; clear:both; *zoom:1;}
버튼 속도
-webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); 
-webkit-transform: translateX(-50%); transform: translateX(-50%);
transition: background-color 0.4s;
*/

/* 메인칼라
6f23f9
*/