@charset "utf-8";
@import url(font.css);
@import url(simple-line-icons.css);
@import url(font-awesome.min.css);

/* ==================== GOLBAL ==================== */
*{margin:0;padding:0;box-sizing:border-box;font-family:'Nanum Barun Gothic', dotum, '돋움', gulim, '굴림', Arial, AppleGothic, verdana, sans-serif, helvetica;}
body{font-size:13px; font-weight:normal;background-color:#fff;color:#666;font-family:'Nanum Barun Gothic', dotum, '돋움', gulim, '굴림', Arial, AppleGothic, verdana, sans-serif, helvetica;}
body, table, div, p {font-family:'Nanum Barun Gothic', dotum, '돋움', gulim, '굴림', Arial, AppleGothic, verdana, sans-serif, helvetica;}
td *, div *, li *, span *, p *  {vertical-align: middle;}
ul, ol, li{list-style:none; }
img, hr{border:none;}
img{vertical-align:middle; border:0px ;}

/* Link Style */
a:link    {text-decoration:none;}
a:visited {text-decoration:none;}
a:active  {text-decoration:none;}
a:hover   {text-decoration:underline;cursor:pointer;}

a.tm:link      {text-decoration:none;color:#fff;}
a.tm:visited   {text-decoration:none;color:#fff;}
a.tm:active    {text-decoration:none;color:#fff;}
a.tm:hover     {text-decoration:none;cursor:pointer;color:#39d91f;}

/* From Style */
textarea{padding:5px; border:1px solid #ccc !important; background-color:#fff;box-sizing: border-box;overflow:auto; font-size:15px;}
textarea:focus {outline: 0px solid #aaa !important}
input{vertical-align:middle;}
input.chk{}
input.radio{}
select      {height: 36px; line-height:28px; border: solid 1px #bdbdbd; background-color:#fff;vertical-align:middle;min-width:110px;font-size: 14px;}
select.page   {height: 36px; line-height:28px; border: solid 1px #bdbdbd; background-color:#fff;vertical-align:middle;min-width: 50px !important; padding-left: 8px;font-size: 14px;}
caption       {display:none;}
legend      {position:absolute; height:0; font-size:0px; line-height:0; overflow:hidden; text-indent:-20000px; }
address,cite,em {font-style:normal;}
fieldset    {border:0; padding:0; }
label     {cursor:pointer;}
img, fieldset, button{border:none;}
caption{visibility:hidden;line-height:0;}
li, dl, dt, dd{list-style:none;}
legend{position:absolute;top:0;left:0;width:0;height:0;overflow:hidden;visibility:hidden;font-size:0;line-height:0;} /* For Screen Reader */ 
sup {position:relative;top:-4px;}
input[type="text"] ,input[type="password"] , input[type="file"] , input[type="tel"] , input[type="email"] { border:1px solid #d0d0d0; background:#FFF; padding: 6px; font-size: 14px; -webkit-border-radius:0;/*height: 36px;*/ box-sizing:border-box;}
/* ==================== 스타일추가 ==================== */

/* 기타 */
.ml15 {margin-left: 15px !important;}
.ml20 {margin-left: 20px !important;}
.mr4 {margin-right:4px !important;}
.mr10 {margin-right: 10px !important;}
.mr15 {margin-right: 15px !important;}
.mr20 {margin-right: 20px !important;}
.mr30 {margin-right: 30px !important;}
.mr40 {margin-right: 40px !important;}
.mr5 {margin-right: 5px !important;}
.mr0 {margin-right: 0px !important;}
.mt0 {margin-top: 0px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb15 {margin-bottom: 15px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb50 {margin-bottom: 50px !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;}
.mt55 {margin-top: 55px !important;}
.pr0 {padding-right: 0 !important}
.pr25 {padding-right: 25px !important}
.pt10 {padding-top: 10px !important}
.pt30 {padding-top: 30px !important}
.tar {text-align:right !important;}
.tac {text-align:center !important;}
.tal {text-align:left !important;}
.fr {float: right !important;}
.fl {float: left !important;}
.clearfix:after {display:block; content:''; clear:both}
.col_w {color:#fff !important;}
.bypro {z-index: 900000; display: inline-block;position: absolute;right: 120px; bottom: 10px; width:80px; height:80px;}

/* ==================== GA 포인트칼라 ==================== */
:root {
	--main-color:#42909b;
	--main-h-color:#327f8a;
	--main-color2:#555;
	--main-h-color2:#333;
	--point-bg-color:#eba334;
	--point-color:#fcaf3e;
}
 
 /* ==================== ACFP계산기 스타일추가 ==================== */
 .calculatorbox{
	width: 100%;
	position:absolute;
	top: 30px;
	left: 0px;
 }
table.calculatortable {
	width:80%;
	height:35%;
    margin-bottom: 50px;
    margin-top:20px;
    border-collapse: collapse; 
} 
table.calculatortable.tr {
	width:80%;
} 

table, td, th {
  border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    font-size: 14px;
}


/* ==================== Button ==================== */
button.gb01 { padding-left:25px;color:#222; height: 25px; position:relative;}
button.gb01:before {content:""; display:block; width: 16px; height:16px; background:url(/gamserp/resources/images/common/settings.svg) no-repeat center/ 100%; position:absolute; left:4px; top:3px; }
button.gb01:hover {background-color: #eee;}
button.gb02 {padding-left:25px;color:#222; height: 25px; position:relative;}
button.gb02:before {content:""; display:block; width: 18px; height:16px; background:url(/gamserp/resources/images/common/manage.svg) no-repeat center/ 100%; position:absolute; left:4px; top:3px; }
button.gb02:hover {background-color: #eee;}
button.gb022 {background: #fff; color: #937b6e; height: 26px; padding: 0 15px !important; font-weight: bold; border: 1px solid #ddd; letter-spacing: -1px; border-radius: 2px; }
button.gb022:hover {background: #f6f6f6;color: #000;}
button.btn_login{background:#f3feff; border:1px solid #b2e4e8; color:#0cc5d4; height:24px; width:68px; font-size:11px;}
button.btn_login:hover {background:#d6f0f2 !important; border:1px solid #b2e4e8; color:#0cc5d4;}
/* ==================== Title ==================== */
h2 {
	
	color: #000 !important;
	font-size: 25px
}


h3 {
	font-family: 'Nanum Square' !important;
	color: #000 !important;
	font-size: 25px
}

h4 {
	font-family: 'Nanum Barun Gothic';
	color: #0089ff;
	font-size: 18px;
	clear: both;
	display: block;
	margin-bottom: 20px;
	letter-spacing: -1px;
	padding-top: 30px
}

h5 {
	font-family: 'Nanum Square' !important;color: #000;
	font-size: 25px;margin-top: 7px;
}


/* ==================== Navi  &  Main ==================== */
#wrap {
	width: 100%;
	/* height: 100%; */
}
#headerwrap {background: #fff; width: 100%; color: #01427a; font-size: 12px;}
#footer {position: fixed;width: 100%; height:32px; bottom: 0px; background-color: #e8ecec;}
footer {width:100%;font-size: 11px;color: #888;letter-spacing: 0px;box-sizing: border-box;display: block;text-align: center;border-top: 1px solid #42909b; line-height: 24px;}
nav.gb_gnb {height:31px; border-bottom: 1px solid #eee;box-sizing: border-box;padding: 2px 20px 0 20px}
.footer {width:1180px;margin:auto;font-size: 11px;text-align: center;padding: 20px;color: #888;letter-spacing: 0px;box-sizing: border-box;}
nav.gb_gnb span {color:#888;}
nav.gnb {box-sizing: border-box;display: flex;}
nav.gnb img.tlogo {margin: 12px 45px 0px 20px;}
nav.gnb img.tcar {margin: 6px 20px 0 0; width: 136px; height: 54px;}
nav.gnb a.nor {font-size: 18px; font-family:'Nanum Square' !important; color:#222;padding-right: 30px;font-weight: bold;}
nav.gnb a:hover.nor {
	color: var(--main-color);
	text-decoration: none;
	font-family: 'Nanum Square' !important;
}

nav.gnb a.sel {
	font-size: 18px;
	font-family: 'Nanum Square' !important;
	color: var(--main-color);
	padding-right: 30px;
	text-decoration: none;font-weight: bold;
}
nav.gnb div {display: inline-block; white-space: nowrap; width: 100%; box-sizing: border-box; margin-top: 20px; margin-bottom:20px; margin-left:10px; }

#container {height: 85%;width: 100%; position: absolute;white-space: nowrap;display: flex;}
.depth2 {height: 100%; min-width: 215px;width: 10%;border-right: 1px solid #b6b6b6; display: inline-block;background:#fff ; float: left;position: relative;-webkit-box-shadow: 1px 0px 1px 1px rgba(0,0,0,0.07);
-moz-box-shadow: 1px 0px 1px 1px rgba(0,0,0,0.07);box-shadow: 1px 0px 1px 1px rgba(0,0,0,0.07);}
.content {height: 100%;width: 100%; min-width:1150px; box-sizing: border-box; float: left;display: inline-block; padding: 15px 20px 0px 20px; }

.insucom {width: 140px; height: 24px; background:#937B6E; color:#f0f2e8; box-sizing: border-box;padding:5px 5px 0 15px;margin-right: 5px}
.insucom:hover {color:#f78f20;}

/* ==================== LEFT MENU ==================== */
#left_nav {
    width: 214px;/*
    margin-left: 20px;*/
    font-size: 13px;
    font-weight: bold;
    height: 100%;
    display: inline-block;
    overflow: auto;
}
#left_nav li a {
    display: block;
    box-sizing: border-box;
    padding: 7px 12px 0 25px;
    height: 30px;
    /*background: #ccc;*/
    border-bottom: 1px solid #ccc;
    text-decoration: none;
    color: #000;
}
#left_nav li a:hover, #nav li a.active {
    /*background: #999;*/
    color: var(--main-color);
}
#left_nav li ul {
    display: none; // used to hide sub-menus
}
#left_nav li ul li a {
    padding: 7px 0 0 25px;
    background: #eee;
    border-bottom: 1px solid #fff;
}

.bb01 {border-bottom: 1px solid #ccc !important;}



/* Menu 움직임 */

button.hamburger {
 position: absolute;top:48%;left:214px;cursor:pointer;outline:none;
}

.hamburger:before {
  content: ""; /* hamburger icon */
  display: block;
  background:url(/gamserp/resources/images/common/btn_toggle02.png) no-repeat 0 0;
  width:12px; height:57px;
}

.openNav .hamburger:before {
  content: ""; /* close icon */
  display: block;
  background:url(/gamserp/resources/images/common/btn_toggle01.png) no-repeat 0 0;
  width:12px; height:57px;
}

.new-wrapper {
  position: absolute;
  width: calc(100% - 0px);
  transition: transform 0.45s cubic-bezier(0.77, 0, 0.175, 1);
}

.openNav .new-wrapper {
  position: absolute;
  transform: translate3d(210px, 0, 0);
  width: calc(100% - 210px);
  transition: transform 0.45s cubic-bezier(0.77, 0, 0.175, 1);
}


.menu {
  position: absolute;
  display: block;
  left: -212px;
  top: 0;
  transition: all 0.45s cubic-bezier(0.77, 0, 0.175, 1);
  z-index: 999;
  height: 100%;
}

.openNav .menu {  
  transform: translate3d(200px, 0, 0);
  transition: transform 0.45s cubic-bezier(0.77, 0, 0.175, 1);
  min-height: 750px;
}

/* TAB */
.top_tab {
	width: 100%;
	height: 36px;
	background: var(--main-color);
}

.top_tab_1 {
	height: 36px;
	margin: 0 auto;
	font-size: 15px;
	overflow: hidden;font-family: 'Nanum Barun Gothic' !important;
}

.top_tab_1 a {
	float: left
}

.top_tab_1 .t_sel {
	position: relative;
	display: inline-block; /*max-width:190px;*/
	height: 36px;
	border-right: 1px solid rgba(255, 255, 255, 0.2);
	box-sizing: border-box;
	color: #fff !important;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-wrap: normal;
	overflow: hidden;
	padding: 8px 65px 0 25px;
	background: var(--point-bg-color);
	font-family: 'Nanum Barun Gothic' !important;
}

.top_tab_1 .t_nor {
	position: relative;
	display: inline-block; /* max-width:190px;*/
	height: 36px;
	border-right: 1px solid rgba(255, 255, 255, 0.2);
	box-sizing: border-box;
	color: #fff !important;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-wrap: normal;
	overflow: hidden;
	padding: 8px 65px 0 25px
}

.top_tab_1 .t_nor img {
	position: absolute;
	top: 5px;
	right: 8px;
}

button.t_close_sel {
	background: url(/gamserp/resources/images/common/k_btn_close_nor.png) 0 0;
	position: absolute;
	top: 5px;
	right: 10px;
	outline: none;
	width: 25px;
	height: 25px;
	border: 0;
	text-indent: -9999em;
	cursor: pointer;
}

button.t_close_sel:hover {
	background: url(/gamserp/resources/images/common/k_btn_close_nor_over.png) 0 0;
}

button.t_close_nor {
	background: url(/gamserp/resources/images/common/k_btn_close_nor.png) 0 0;
	position: absolute;
	top: 5px;
	right: 10px;
	outline: none;
	width: 25px;
	height: 25px;
	border: 0;
	text-indent: -9999em;
	cursor: pointer;
}

button.t_close_nor:hover {
	background: url(/gamserp/resources/images/common/k_btn_close_nor_over.png) 0 0;
}

button.t_rel_nor {
	background: url(/gamserp/resources/images/common/k_btn_reload_nor.png) no-repeat
		0 0;
	position: absolute;
	top: 5px;
	right: 30px;
	outline: none;
	width: 25px;
	height: 25px;
	border: 0;
	text-indent: -9999em;
	cursor: pointer;
}

button.t_rel_nor:hover {
	background: url(/gamserp/resources/images/common/k_btn_reload_over.png) 0 0;
}

button.t_rel_sel {
	background: url(/gamserp/resources/images/common/k_btn_reload_nor.png) no-repeat
		0 0;
	position: absolute;
	top: 5px;
	right: 30px;
	outline: none;
	width: 25px;
	height: 25px;
	border: 0;
	text-indent: -9999em;
	cursor: pointer;
}

button.t_rel_sel:hover {
	background: url(/gamserp/resources/images/common/k_btn_reload_over.png) 0 0;
}

.top_tab_2 {
	float: left;
	width: 212px;
	height: 36px;
	color: #fff;
	font-size: 17px;
	padding-top: 10px;
	padding-left: 15px;font-family: 'Nanum Barun Gothic';
}

.top_tab_2 img {
	padding: 0px 12px;
    float: right;
}


/* ==================== LOGIN ==================== */
.lotxt_1 {position: absolute; width:720px;height: 30px; box-sizing: border-box;text-align: center; left:50%;margin-left: -360px; top:120px;color:#ff0000;}
.login-box {
    /* top: 190px;
    position: absolute; */
    right: 270px;
    width: 331px;
    height: 419px;
    }
.login-top-text {font-size: 22px;padding-bottom: 28px;}
.login-top-text span {color:#999;}
.left-bg {position: relative; right:0; top:0;  width:100vw; height: 100vh; background:url(/gamserp/resources/images/login/login_2.jpg) no-repeat right top;}
.login_1 {
    width: 330px;
    height: 360px;  
    background:#fff;
    box-sizing: border-box;
    padding: 35px 25px;
    -webkit-box-shadow: -2px 29px 99px -4px rgb(0 0 0 / 25%);
    -moz-box-shadow: -2px 29px 99px -4px rgba(0, 0, 0, 0.25);
    box-shadow: -2px 5px 50px -4px rgb(0 0 0 / 25%);
}
.login_1 ul {display: inline-block; width: 100%; text-align: left;}
.lo_input01 {height: 46px !important;width: 100% !important; background:#f3f3f3 !important; margin-bottom:2px;
border: 0px !important;font-size: 15px !important;outline: none}
.lo_input01::placeholder {color: #888; opacity: 1; /* Firefox */ font-size: 15px; background:#fff;}
.lo_input01:-ms-input-placeholder { /* Internet Explorer 10-11 */color:#888;font-size: 15px}
.lo_input01::-ms-input-placeholder { /* Microsoft Edge */ color: #888;font-size: 15px}
button.btlogin {
	width: 100%; 
	height: 55px;
	border-radius: 2px;
	background: #111;
	color: #fff;
	font-weight: bold;
	font-size: 16px;
	cursor: pointer;
}
button.btlogin:hover {background:#222 }
.login-text-area {position: absolute;top: 25%;left: 50%;margin-left: -406px;}
.login-text-box h2 {
	 font-family: 'Nanum Square' !important;
	 letter-spacing: -4px;
	 padding: 30px 0 20px 0;
	 font-size: 38px; color:#413b3c;
	 font-weight:
	 normal;
	 }
.login-text-box h2 span {color:#0a9882;}
.login-text-box p {color:#7a561e;font-size: 17px;}
.footer_login {width: 100%;
	font-size: 12px;	
	color: #555;
	letter-spacing: 0px;
	box-sizing: border-box;
	padding-top:215px;
	line-height: 1.3;
	}
.listy {height: 40px; padding-top: 15px}

.login_r01 {width: 812px;
    border: 1px solid rgba(255,255,255,0.8);
    box-sizing: border-box;
    padding: 20px 20px 15px 20px;
    background: rgba(255,255,255,0.2);
    box-shadow: -2px 5px 50px -4px rgb(0 0 0 / 15%);
}

    
/* Checkbox */
.ch_container {
    display: block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    font-size: 13px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.ch_container input {
    position: absolute;
    opacity: 0;
}
.checkmark {
    position: absolute;
    top: -3px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #eee;
    border-radius: 2px; 
    border:1px solid #ddd;
}
.ch_container:hover input ~ .checkmark {
    background-color: #eee;
}

/* When the checkbox is checked, add a blue background */
.ch_container input:checked ~ .checkmark {
    background-color: #1f88ff;
    border:1px solid #1f88ff;
}
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
.ch_container input:checked ~ .checkmark:after {
    display: block;
}
.ch_container .checkmark:after {
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/*LOCK*/
.lock_m {display: inline-block;position: absolute;top: 198px;right: 80px;}
.lock {
  position: relative;
  background: #00aabb;
  border-radius: 50px;
  width: 180px;
  height: 30px;
  color:#fff;
  text-align: center;
  padding-top: 8px;
  box-sizing: border-box;
}

.lock:after {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 0;
  border: 14px solid transparent;
  border-bottom-color: #00aabb;
  border-top: 0;
  border-right: 0;
  margin-left: -17px;
  margin-top: -12px;
}
/*Error*/
.error {margin:auto;margin-top:150px;width:500px;height:335px; background:#0249bf;text-align:center;box-sizing: border-box;padding:;
-webkit-box-shadow: -2px 29px 99px -4px rgba(80,102,111,0.71);
-moz-box-shadow: -2px 29px 99px -4px rgba(80,102,111,0.71);
box-shadow: -2px 29px 99px -4px rgba(80,102,111,0.71);
position: relative;
}
.error img {margin-top: 40px;opacity: 0.5;}
.error p {color: #ffce0c;font-size: 33px;margin-top: 20px;}
.error span {color: #ddd;padding-top: 10px;display: inline-block;}
button.bt_error01 {height: 45px;border-radius: 50px;background:#eee;color: #000;font-size: 14px;cursor: pointer;width: 150px;}
button.bt_error01:hover {background:#ccc }
.error div {margin-top: 30px}

.grid-header-stress > a {color: #f00 !important;font-weight: bold !important;}

/* genexon.confirm 확인 버튼 색상 .k-primary와 동일하게 세팅 */
button.confirm_yes {
	background-color: var(--main-color);
	color: #fff;
	height:34px; 
	min-width:80px;
	border-radius:2px;
}

button.confirm_yes:hover {	

    background-color: var(--main-h-color);
}

button.confirm_no  {
	background-color:#b0bbbd;
	color: #fff;
	height:34px; 
	min-width:80px;
	border-radius:2px;
}

button.confirm_no :hover {	

    background-color: #92a6aa;
}

.bt_bottom {
	position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-81px);
    width: 165px;
}

.ta_sample2 > .org_sort > tr > td {
	text-align: center;
	cursor: pointer;
}

.ta_sample2 .org_sort tr td:hover {
	background-color: #e4edf5;
    color: #222;
}

.ta_sample2 .org_sort tr td.selectedOrg {
	border-bottom: 3px double red;
	color: red;
}

/* 회원 아이디/비밀번호 찾기 */
div.getUserAuthInfo{
	margin-top: 14px; 
	font-size: 14px; 
	text-align: right; 
	font-weight: normal; 
	width: 130px; 
	color:rgba(120, 120, 120, 10);  
	text-align: -1px; 
	letter-spacing: -1px;
}

div.getUserAuthInfo span{
	cursor:pointer;
}

/* ==================== 스타일추가 ==================== */
button.p_btn01 {background:#0063b8; border:1px solid #0056a0;width:100px;height: 40px;cursor: pointer; border-radius: 2px; color:#fff; font-size: 15px;margin-right:5px;}
button.p_btn01:hover {background:#000;border:3px solid #000; color: rgba(255,255,255,0.5);}
button.p_btn02 {background:#0063b8;border:1px solid #0056a0;width:100px;height: 30px;cursor: pointer;border-radius: 2px;color:#fff;margin-left: 5px;vertical-align: bottom;}
button.p_btn02:hover {background:#000;border:3px solid #000; color: rgba(255,255,255,0.5);}

.table_st1 {width: 100%; border-top:2px solid #000;letter-spacing:-1px; font-size: 13px}
.table_st1 th {background-color: #f6f6f6;color: #000;white-space:nowrap;height: 35px;box-sizing: border-box;text-align:center;border-bottom: 1px solid #dddddd;border-right: 1px solid #dddddd;border-left: 1px solid #dddddd;vertical-align: middle;}
.table_st1 td {color:#333;border-bottom: solid 1px #dddddd;border-right: solid 1px #dddddd;text-align:left;box-sizing: border-box; padding:5px;word-break:break-all;vertical-align:middle;}
.table_st1 td input {width: 100%}

/* ==================== POPUP ==================== */ 
.pop_st01 {width: 100%; line-height: 1.5; font-size: 13px; color:#333;margin-top: 20px; overflow: auto;}
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    width: 800px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s;
    padding-bottom: 23px;
    box-sizing: border-box;
}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0} 
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

.pop_tit {float: left;color:#000;font-size: 17px;letter-spacing: -1px; font-weight: bold;font-family:'Nanum Square' !important;}

/* The Close Button */
.close {
    color:var(--main-color);
    float: right;
    font-size: 30px;
    margin-top:-7px;
    font-weight: lighter;
}
.close3 {
    color:var(--main-color);
    float: right;
    font-size: 30px;
    margin-top:-7px;
    font-weight: lighter;
}
.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}
.close3:hover,
.close3:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}
.modal-header {
    height: 35px;
    box-sizing: border-box;
    border-bottom: 1px solid #ccc
}

.p_st01 {letter-spacing: -1px; margin-bottom: 15px}
.p_st01 span {font-weight: bold; letter-spacing: normal;color: #000}

/* Video Content */
/* 추가 200826 */
.tac {text-align: center !important;}
.main_sty01 {display: inline-block;}
.main_sty02 {
    width: 1270px;
    float: left;
    margin-top: 30px;
    display: inline-block;
    margin-left: 30px;
}

.swiper-container {
      width: 100%;
      height: 100%;
}
.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.vttxt01 {font-size: 20px;font-family:'Nanum Square' !important;font-weight: bold;color: #000;margin: 45px 0 20px 0;width: 100%}
.vttxt01 span {font-size:20px;font-family:'Nanum Square' !important;font-weight: bold;color: #3ba4ff !important;padding-left: 15px}
.vttxt01 button {background:#388ffa url(/gamserp/resources/images/common/ic_3.png) no-repeat 45px 5px; padding:7px 20px 7px 10px; color: rgba(255,255,255,0.8); font-weight: bold; font-size: 13px; border-radius: 2px;float: right; }
.bbox01 {display: inline-block;width: 100%; box-sizing: border-box;padding: 25px 20px;border: 1px solid #ddd; border-radius: 4px;
-webkit-box-shadow: -1px 3px 19px -9px rgba(0,0,0,0.75);
-moz-box-shadow: -1px 3px 19px -9px rgba(0,0,0,0.75);
box-shadow: -1px 3px 19px -9px rgba(0,0,0,0.75);}

.vod01 {display: inline-block !important;width: 100% !important;}
.vod01 ul {display: inline-block !important; width: 23% !important; margin-right: 14px}
.vodmAuto {margin:0 10px 0 10px !important; text-align:left !important;  background-color:white; transition: background-color .5s;}
.vodmAuto:hover{background-color:rgb(240, 240, 240);}
.vod01_1 {display: inline-block;background: #555;width: 100% !important; height: 170px !important; position: relative;}
.vod01_1 span {position: absolute;right: 0; bottom: 0; background: #000; color:#ddd; font-size: 12px;padding: 6px 10px 3px 10px;font-weight: bold;width: auto !important; border:0px !important;}
.vod01_2 {overflow: hidden;text-overflow: ellipsis; display: -webkit-box !important;-webkit-line-clamp: 2;height:60px !important; padding-left: 0 !important;
            -webkit-box-orient: vertical;font-size: 15px !important;margin: 10px 0 10px 0; line-height: 1.4;letter-spacing: -1px;color: #222 !important; width:100% !important;border-right: 0px !important; }
.vod01_3 {color: #777 !important;font-size: 13px !important; padding-left: 0px !important; height: auto !important; display: block !important; border-right: 0px !important; width: auto !important; margin-bottom: 5px !important;}
.vod01_3 b {color: #000 !important; font-weight: bold !important ; font-size: 13px !important; display: inline-block !important;width: auto !important;margin-bottom: 0px !important;}
.vod01_3 span {padding-left:15px; border: 0px !important; display: unset !important;}
.sel_top {min-width: 160px;font-size: 16px; padding: 10px;font-weight: bold;height: 43px;background: #388ffa; color: #fff; border: 0 }
.swiper-slide ul {
    width: 80%;
    display: inline-block;
}
.swiper-slide ul li {float: left;font-size: 16px;width: 25%;border-right: 1px solid #ddd;display: inline-block;word-break: break-all;height: 90px;text-align: left;box-sizing: border-box;padding-left: 35px;color: #888}
.swiper-slide ul li b {display: block;font-size: 22px;font-family:'Nanum Square' !important;font-weight: bold;color: #000;margin-bottom: 10px;width: 90%;
text-overflow:ellipsis;
white-space:nowrap;
word-wrap:normal;
overflow:hidden;}

.swiper-button-prev {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%234c71ae'%2F%3E%3C%2Fsvg%3E") !important;
}

.swiper-button-next {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%234c71ae'%2F%3E%3C%2Fsvg%3E") !important;
}
.swiper-button-next,
.swiper-button-prev {
    background-color: white;
    background-color: rgba(255, 255, 255, 0.5);
    right:10px;
    padding: 10px;
    color: transparent !important;
    fill: black !important;
    stroke: black !important;
}

.ttxt02 {display: inline-block;width:100%;margin-bottom: 20px;}
.ttxt02_1 {font-family:'Nanum Square' !important;display: inline-block;font-size: 20px;color: #777; font-weight: bold;}
.ttxt02_2 {font-family:'Nanum Square' !important;font-size: 40px;display: inline-block;margin-left: 380px;color: #0089ff;}
.ttxt02_2 b {font-family:'Nanum Square' !important;}
.t_sel01 {height: 40px !important;font-size: 16px !important;padding-left: 5px !important;background: #eee;}
.orga {display: inline-block;width: 100%;}
.orga_1 {display: inline-block;width: 90px;height: 90px;background:#ecf3f7;border-radius: 50%;font-size: 40px;color: #0089ff;text-align: center;box-sizing: border-box;padding-top: 18px;float: left;margin-right: 20px;}
.orga_1 span {display: block;font-size: 15px;color: #aebecc;font-weight: bold;margin-top: -5px;}
.orga li {float: left;min-height: 90px;
    font-size: 16px;
    width: 22%;
    border-right: 1px solid #ddd;
    display: inline-block;
    word-break: break-all;
    text-align: left;
    box-sizing: border-box;
    padding: 0 35px;
    color: #888;}
.orga_2 p {    display: block;
    font-size: 22px;
    font-family: 'Nanum Square' !important;
    font-weight: bold;
    color: #000;
    margin-bottom: 10px;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;}
.orga_2 span {font-size: 16px;overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2; 
            -webkit-box-orient: vertical;}
.bbox02 {display: inline-block;width: 100%; box-sizing: border-box;padding: 35px 25px;border: 1px solid #ddd; border-radius: 4px; margin-bottom: 30px;
-webkit-box-shadow: -1px 3px 19px -9px rgba(0,0,0,0.75);
-moz-box-shadow: -1px 3px 19px -9px rgba(0,0,0,0.75);
box-shadow: -1px 3px 19px -9px rgba(0,0,0,0.75);}
.ttxt03 {padding: 30px 25px !important;}
hr.line01 {display: block;border-bottom: 1px dashed #ccc; margin:10px 0;}
button.btn_orga {background: #388ffa;color: #fff;border-radius: 2px; padding: 6px 13px 5px 13px; float: right;}
button.btn_orga02 {background:#e4e4e4 url(/gamserp/resources/images/common/ic_plus02.png) no-repeat center center; width:36px;height:36px;border-radius: 50%; text-indent: -99999px;display: block;margin: 10px auto;}

.orga_3 {text-align: center !important;font-size: 15px !important; color: #333 !important;font-weight: bold !important;}
.t_sty01 {margin-bottom: 10px !important}
.t_sty02 {margin-top: -10px !important;}
.t_sty03 {width: 84px !important; height: 84px !important; padding-top: 7px !important;}
.t_sty04 {margin-top: -13px !important;}
.t_sty05 {padding: 0 15px !important;}
.t_sty06 {padding: 20px 25px !important;margin-bottom: 20px !important;}
.t_sty07 {padding-top: 34px !important;display: inline-block !important;color: #ff0000 !important; font-size: 15px !important; letter-spacing: -1px}
.t_sty08 {padding: 0 0px 0 15px !important;}
.t_sty09 {width: 300px; display: block; margin: 30px auto;}
.t_sty10 {display: block; font-family: 'Nanum Square' !important;
    width: 100%;
    font-size: 25px;
    text-align: center;
    margin-bottom: 40px;
    color: #ff0000;
    font-weight: bold;}
    

        

/* ==================== POPUP ==================== */ 
.divsty02 {width: 100%; line-height: 1.5; font-size: 13px; color:#333;margin-top: 20px; overflow: auto;}
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    width: 700px;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s;
    padding-bottom: 23px;
    box-sizing: border-box;
}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {top:-300px; opacity:0} 
    to {top:0; opacity:1}
}

@keyframes animatetop {
    from {top:-300px; opacity:0}
    to {top:0; opacity:1}
}

.pop_tit {float: left;color:#000;font-size: 17px;letter-spacing: -1px; font-weight: bold;font-family:'Nanum Square' !important;}

/* The Close Button */
.close {
    color:var(--main-color);
    float: right;
    font-size: 30px;
    margin-top:-7px;
    font-weight: lighter;
}
.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}
.modal-header {
    height: 35px;
    box-sizing: border-box;
    border-bottom: 1px solid #ccc
}

 button.max {width: 30px; height: 35px; background:url(../img/btn_wide_nor.png) no-repeat 0 0;float: right; text-indent: -9999em}
 button.max:hover {background:url(../img/btn_wide_over.png) no-repeat 0 0;}
 button.close1 {width: 30px; height: 35px; background:url(../img/btn_close_nor.png) no-repeat 0 0;float: right; text-indent: -9999em}
 button.close1:hover {background:url(../img/btn_close_over.png) no-repeat 0 0;}
 button.p_btn01 {background:#0063b8; border:1px solid #0056a0;width:100px;height: 40px;cursor: pointer; border-radius: 2px; color:#fff; font-size: 15px;margin-right:5px;}
 button.p_btn01:hover {background:#000;border:3px solid #000; color: rgba(255,255,255,0.5);}
 
 .br0 { border-right: 0px !important; }
/* Video Content end*/

.txt-r {text-align:right; padding-bottom:5px;}

.ifr_1 {width: 100px;
    float: left;
    /* border: 1px solid; */
    height: 34px;
    /* vertical-align: middle; */
    display: inline-flex;
    align-items: center;
    font-size: 16px;
    color: #f59d14;
    font-weight: bold;}
.ifr_2 {display: inline-block;float: left;width: calc(100% - 102px);}
.ifr_3 {color: #f59d14;text-align: right;padding-top: 10px;}
.ifr_4 {color: #42909b;
    font-family: 'Nanum Square' !important;
    font-size: 24px;
    font-weight: bold;
    padding: 10px 0 20px 110px;
    text-align: center;}
.ifr_4 span {float: right;
    padding-top: 9px;
    padding-right: 10px;
    color: #666;font-weight: normal;font-size: 15px;}
.ifr_5 {
    display: flex;
    border-bottom: 1px solid #ddd;
    font-family: 'Nanum Square' !important;
    font-size: 19px;
    color: #000;
    justify-content: flex-end;
    margin-top: 30px;
    margin-bottom: 27px;
    flex-direction: row;
    flex-wrap: nowrap;
    padding: 10px;
    align-items: flex-start;
    box-shadow: rgba(50, 50, 93, 0.1) 0px 2px 5px -1px;
    }
.ifr_5 li {width: 30%;font-family: 'Nanum Square' !important;}

.ifr_6 {
    margin-right: 20px;
    box-sizing: border-box;
    background: #e3f0f3;}
.ifr_6 tr {}
.ifr_6 th {
    width: 73px;
    padding: 10px 0;
    font-size: 15px;
    letter-spacing: -1px;
    text-align: left;color:#368D99;
    text-align: center;
    }
.ifr_6 td {
    color: #000;
    font-size: 16px;
    font-weight: bold;
    white-space: nowrap;
    width: 150px;
    padding: 0 10px;
    text-align: right;
    }
.ifr_6 td span {color:#368D99;padding-left: 5px;display: inline-block;font-weight: normal; font-size: 14px;vertical-align: text-top;}
.ifr_7 {width:100%;display: inline-flex;flex-wrap: nowrap;align-items: center;justify-content: space-between;font-size: 15px;color: #000;width: calc(100% - 110px);}
.ifr_7 li {
    display: inline-block;
    width: 25%;
    box-sizing: border-box;
    border-right: 1px dashed #bbb;
    margin-right: 15px;
    padding: 10px 20px 10px 0;
    }
.ifr_7 div {float: right;
    display: table-cell;
    color: #f59d14;
    font-size: 16px;
    font-weight: bold;}
.ifr_7 div span {color:#999;font-size: 15px;
    margin-top: -4px;
    display: inline-block;
    margin-left: 4px;font-weight: normal;}
.ifr_8 {vertical-align: sub;margin-right: 7px; margin-left: 27px; height: 18px; width: 18px;}

/* css로 readonly 설정 */
.k-readonly {
    pointer-events: none;
    background-color: #f5f5f5;
}