@charset "utf-8";


/*************************************************
*					LAYOUT						*
*************************************************/

.wrap{width:100%;margin:0;padding:0;position:relative;}
.header_wrap{width:100%;margin:0 auto;padding:0;position:fixed;top:0;display:block;z-index:1000;}
.mcontainer{width:100%;margin:0;padding:25px 15px 20px;position:relative;}
.bcontainer{width:100%;margin:0;padding:110px 0 20px;position:relative;}
.ccontainer{width:100%;margin:0;padding:50px 0 20px;position:relative;}
.dcontainer{width:100%;margin:0;padding:50px 0 20px;position:relative;}
.econtainer{width:100%;margin:0;padding:35px 0 20px;position:relative;}
.fcontainer{width:100%;margin:0;padding:85px 0 20px;position:relative;}
.gcontainer{width:100%;margin:0;padding:140px 0 20px;position:relative;}
.scontainer{width:100%;margin:0;padding:60px 0 20px;position:relative;}
.lcontainer{width:100%;margin:0;padding:0 0 20px;position:relative;}
.ncontainer{width:100%;margin:0;padding:0;position:relative;}
.footer{width:100%;margin:0;padding:0;position:fixed;bottom:0;z-index:1000;}






/************************************************
*		HEADER									*
************************************************/

/*** 메뉴 : MENU ***/
.header{width:100%;height:56px;margin:0 auto;background-color:#212124;position:relative;}
/** 토글버튼 **/
.header .main .nav{
	width:20px;
	height:20px;
	margin:5px 0 0;
	background:url(../images/icon/l_menu.png) no-repeat 0 0;
	background-size:20px;
	line-height:50px;
	display:block;
}
/** 뒤로가기 **/
.header .back{
	width:25px;
	height:50px;
	position:absolute;
	left:0;
	top:0;
	z-index:100;
}
.header .back .close{
	width:100%;
	height:56px;
	background:url(../images/icon/h_back.png) no-repeat 50%;
	background-size:24px;
	line-height:56px;
	display:block;
	margin-left: 15px;
}
.header .back a{
	width:100%;
	height:56px;
	background:url(../images/icon/h_pre.png) no-repeat 50%;
	background-size:24px;
	line-height:56px;
	display:block;
	margin-left: 15px;
}
/** 로고 **/
.header .logo{
	height:50px;
	margin:0 0 0 45px;
	padding:0;
	text-align:left;
	font-size:18px;
	font-weight:400;
	color:#fff;
	line-height:50px;
	letter-spacing:-1px;
	position:absolute;
	left:0;
	top:-2px;
}
.header .logo img{width:auto;height:30px;}
.header .logo a{color:#212121;}

/** 타이틀 **/
.header .htit{
	width:100%;
	height:50px;
	padding:0;
	text-align:center;
	font-size:18px;
	font-weight:400;
	color:#fff;
	line-height:50px;
	letter-spacing:-1px;
	position:absolute;
	left:0;
	top:0;
}
/** 서브 타이틀 **/
.header .hsit{
	height:56px;
	margin:0 auto;
	padding:0;
	text-align:center;
	font-size:18px;
	font-weight:500;
	color:#fff;
	line-height:56px;
	letter-spacing:0;
	position:absolute;
	left:50%;
	transform: translateX(-50%);
	top:0;
}

/************************************************
*		SLIDER MENU								*
************************************************/

/* Reset */
*,
*:after,
*:before {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
	content:" ";
	display:table;
}
.clearfix:after {
	clear:both;
}

.main > section {
	max-width:20px;
	width:90%;
	margin-left:10px;
	position:fixed;
	top:10px;
	z-index:100000;
}
.main > section button {
	margin:0;
	padding:0 0 8px;
	opacity:1;
	color:#fff;
	display:block;
	cursor:pointer;
}
.main > section button:hover {
	opacity:1;
}
.main > section button.active {
	opacity:1;
}
.main > section button.disabled {
	opacity:1;
	pointer-events:none;
}

.bg_over{width:100%;height:100%;background-color:#000 !important;opacity:0.4 !important;position:fixed;left:0;top:0;z-index:10000;}


/* General styles for all menus */
.cbp-spmenu {
	background:#070707;
	border-right:1px solid #1f1f1f;
	overflow:hidden;
	overflow-x:hidden;
	overflow-y:scroll;
	position:fixed;
}
/* Orientation-dependent styles for the content of the menu */
.cbp-spmenu-vertical {
	width:280px;
	height:100%;
	top:0;
	z-index:999999;
}
.cbp-spmenu-vertical a {
	padding:0;
	color:#666;
}
.cbp-spmenu-horizontal {
	width:100%;
	height:150px;
	left:0;
	z-index:1000;
	overflow:hidden;
}
.cbp-spmenu-horizontal h3 {
	height:100%;
	width:20%;
	float:left;
}
.cbp-spmenu-horizontal a {
	float:left;
	width:20%;
	padding:0.8em;
	border-left:1px solid #258ecd;
}

/* Vertical menu that slides from the left or right */
.cbp-spmenu-left {
	left:-280px;
}
.cbp-spmenu-right {
	right:-280px;
}
.cbp-spmenu-left.cbp-spmenu-open {
	left:0;
}
.cbp-spmenu-right.cbp-spmenu-open {
	right:0;
}

/* Horizontal menu that slides from the top or bottom */
.cbp-spmenu-top {
	top:-280px;
}
.cbp-spmenu-bottom {
	bottom:-280px;
}
.cbp-spmenu-top.cbp-spmenu-open {
	top:0;
}
.cbp-spmenu-bottom.cbp-spmenu-open {
	bottom:0;
}

/* Push classes applied to the body */
.cbp-spmenu-push {
	overflow-x:hidden;
	position:absolute;
	left:0;
	z-index:0;
}
.cbp-spmenu-push-toright {
	left:280px;
}
.cbp-spmenu-push-toleft {
	left:-280px;
}

/* Transitions */
.cbp-spmenu,
.cbp-spmenu-push {
	-webkit-transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	transition:all 0.3s ease;
}

/* Example media queries */
@media screen and (max-width:55.1875em){
	.cbp-spmenu-horizontal {
		font-size:75%;
		height:130px;
	}
	.cbp-spmenu-top {
		top:-130px;
	}
	.cbp-spmenu-bottom {
		bottom:-130px;
	}
}

@media screen and (max-height:26.375em){
	.cbp-spmenu-vertical {
		font-size:90%;
		width:280px;
	}
	.cbp-spmenu-left,
	.cbp-spmenu-push-toleft {
		left:-280px;
	}
	.cbp-spmenu-right {
		right:-280px;
	}
	.cbp-spmenu-push-toright {
		left:280px;
	}
}






/*************************************************
*					CONTAINER					*
*************************************************/

/******************** MAIN **********************/
.n_wrap{
	width:100%;
	height:60px;
	background-color:#fff;
	position:relative;
	left:0;
	top:0;
	z-index:100;
}
.nw_case{
	height:30px;
	padding:0 5px;
	border-bottom:1px solid #000;
	font-size:12px;
	font-weight:500;
	color:#333;
	line-height:30px;
	letter-spacing:-1px;
	position:relative;
	display:block;
}
.nw_case .nc_c{
	width:20px;
	height:30px;
	line-height:30px;
	position:absolute;
	right:0;
	top:0;
}
.nw_case .nc_c a{
	width:100%;
	height:30px;
	background:url(../images/icon/p_close2.png) no-repeat center 50%;
	background-size:10px;
	line-height:30px;
	display:block;
}
.nw_case ul{margin:0;padding:0;position:relative;}
.nw_case li{
	height:30px;
	line-height:30px;
	display:block;
	float:left;
}

.m_content{
	width:100%;
	margin:0;
	padding:0;
	position:relative;
}

.mc_list{
	margin:0;
	padding:0;
	position:relative;
	overflow:auto;
}
.mc_list li:nth-child(2n){background-color:#333;}
.mc_list li:last-child{margin:0 0 10px;}
.mc_list li{
	margin:0;
	padding:5px;
	border-bottom:1px solid #313131;
	position:relative;
}
.mc_list li a{color:#fff;}
.mc_list li img{width:auto;height:10px;}
.mc_list li dl{height:40px;margin:5px 0;padding:0;letter-spacing:-1px;position:relative;}
.mc_list li dt{
	height:40px;
	line-height:40px;
	position:relative;
	display:block;
	float:left;
	overflow:hidden;
}
.mc_list li dd{
	height:40px;
	line-height:40px;
	position:relative;
	display:block;
	float:left;
	overflow:hidden;
}
.mc_list li dt b,
.mc_list li dd b,
.mc_list li dt p,
.mc_list li dd p{
	height:20px;
	margin:0;
	padding:0;
	line-height:20px;
	display:block;
	overflow:hidden;
}
.mc_list li dt b,
.mc_list li dd b{font-size:1em !important;font-weight:400;}
.mc_list li dt p,
.mc_list li dd p{font-size:0.8em !important;font-weight:300;}

/******** Start **********/
.start_wrap{margin: 170px 0;}
.start_wrap .st_logo{width: 146px;}
.start_wrap .st_name{font-size: 46px;line-height: 52px;color: #222;font-weight: 300;margin-top: 20px;}
.start_wrap .st_name span{display: block;font-weight: 600;}
.start_wrap>p{font-size: 22px;line-height: 55px;color: #a5a5a5;font-weight: 300;letter-spacing:1px;margin-bottom: 123px;}
.start_wrap .st_btn input[type="button"]{
	height: 58px;
    background-color: #ededed;
    border-radius: 6px;
    text-align: center;
    font-size: 16px;
    color: #c1c1c1 !important;
    line-height: 50px;
    display: block;
	font-weight: 500;
	box-shadow: none;
}
.start_wrap .st_btn:hover .start_wrap .st_btn input[type="button"],
.start_wrap .st_btn input[type="button"]:hover,
.start_wrap .st_btn input[type="button"]:focus{
	height: 58px;
    background-color: #C9202C;
    border-radius: 6px;
    text-align: center;
    font-size: 16px;
    color: #fff !important;
    line-height: 50px;
    display: block;
	font-weight: 500;
	box-shadow: none;
}

.btn_type1{text-align: center;display:block;width:100%;font-size: 16px;color: #fff;line-height: 26px;font-weight: normal;padding: 15px 0;background: rgb(212, 212, 212);border-radius: 8px;font-family: "Noto Sans KR";margin: 49px 0 0 ;}
.buttonLoginDisabled{background-color:#000;}

/******** JOIN **********/
.join_wrap{margin:50px 0 0;padding:0;position:relative;}
.join_wrap .jw_lcase{margin:0 0 20px;padding:0;text-align:left;font-size:18px;color:#260d0d;font-weight: 500;}
.join_wrap .jw_case{margin:0;padding:0;position:relative;}
.join_wrap .jw_case .ji_tit{margin:25px 0 0;text-align:left;font-size:16px;line-height:20px;position:relative;}
.join_wrap .jw_case .ji_inp{padding:0 0 2px;border-bottom:1px solid #a3a3a3;line-height:30px;position:relative;}
.join_wrap .jw_case .ji_inp input{
	width:100%;
	height:30px;
	margin:5px 0 0;
	padding:0;
	border:0 none;
	background-color:transparent;
	font-size:14px;
	line-height:30px;
	float:left;
}
.join_wrap .jw_case .ji_inp input[type="button"]{color:#18a2a2 !important;}
.join_wrap .jw_case .ji_inp input[type="button"].button{padding:0 10px;background-color:#18a2a2;color:#fff !important;}

.join_wrap .jw_check{margin:20px 0 200px;padding:0;position:relative;}
.join_wrap .jw_check .jw_all{padding:0 0 0 5px;text-align:left;font-size:16px;color:#dcdcdc;line-height:60px;height: 60px;background-color: #ededed;border-bottom: 1px solid #d7d7d7;}

.join_wrap .jw_check .jw_list{margin:0;padding:10px 0 10px 5px;background-color:#ededed;position:relative;}
.join_wrap .jw_check .jw_list li{margin:0;color:#dcdcdc;line-height:20px;display:block;height: 50px;}

.join_wrap .jw_check .jw_all input[type="checkbox"],
.join_wrap .jw_check .jw_list input[type="checkbox"]{height:0;}
.join_wrap .jw_check .jw_all input[type="checkbox"] + label,
.join_wrap .jw_check .jw_list input[type="checkbox"] + label{width:96%;padding:0 2%;}
.join_wrap .jw_check .jw_all input[type="checkbox"] + label b,
.join_wrap .jw_check .jw_list input[type="checkbox"] + label b{font-weight:500;}
.join_wrap .jw_check .jw_all input[type="checkbox"] + label:before,
.join_wrap .jw_check .jw_list input[type="checkbox"] + label:before{width:23px;height:23px;margin: 15px 0 0 15px;}

.join_wrap .jw_btn{height:50px;position:relative;}
.join_wrap .jw_btn input[type="button"]{height:58px;background-color:#C9202C;border-radius:0;text-align:center;font-size:18px;color:#fff !important;line-height:50px;display:block;border-radius: 6px;font-weight: 500;}

.join_wrap .jw_tbtn{height:50px;margin:35px 0 0;position:relative;}
.join_wrap .jw_tbtn input[type="button"]{height:50px;background-color:#17a3a2;border-radius:0;text-align:center;font-size:16px;color:#fff !important;line-height:50px;display:block;}

.join_wrap .jw_case .sb_inp{padding:0 0 2px;border-bottom:1px solid #a3a3a3;line-height:30px;position:relative;float:left;}
.join_wrap .jw_case .sb_inp input[type="text"]{
	width:100%;
	height:30px;
	margin:5px 0 0;
	padding:0;
	border:0 none;
	background-color:transparent;
	font-size:14px;
	line-height:30px;
	float:left;
}
.join_wrap .jw_case .sb_inp input[type="button"],
.join_wrap .jw_case .sb_ninp input[type="button"]{margin:1px 0;padding:0;background-color:transparent;color:#18a2a2 !important;}
.join_wrap .jw_case .sb_inp input[type="button"].button,
.join_wrap .jw_case .sb_ninp input[type="button"].button{padding:0;color:#fff !important;}

.join_wrap .jw_case .sb_inp .select-wrapper{height:30px !important;margin-bottom:0;line-height:30px !important;float:left;}
.join_wrap .jw_case .sb_inp .select-wrapper select{height:30px !important;border:0 none;color:#fff;line-height:30px !important;}
.join_wrap .jw_case .sb_inp .select-wrapper select option{background-color:#1a1a1a;}
.join_wrap .jw_case .sb_inp .select-txt{height:35px;text-align:center;line-height:35px;float:left;}

.join_wrap .jw_case .sb_ninp{margin:5px 0 0;padding:0 0 2px;line-height:34px;position:relative;}
.join_wrap .jw_case .sb_ninp input[type="checkbox"]{width:0;height:0;margin:0;}
.join_wrap .jw_case .sb_ninp input[type="checkbox"] + label{padding:0;float:left;}
.join_wrap .jw_case .sb_ninp input[type="checkbox"] + label b{
	width:100%;
	height:30px;
	margin:0;
	border:1px solid #18a2a2;
	text-align:center;
	font-weight:400;
	color:#fff;
	line-height:30px;
	display:block;
}
.join_wrap .jw_case .sb_ninp input[type="checkbox"]:checked  + label b{
	background-color:#18a2a2;
}
.join_wrap .jw_case .sb_ninp input[type="checkbox"] + label:before{width:100%;height:30px;left:0;}
.join_wrap .jw_case .sb_ninp input[type="checkbox"] + label:before {
    width:100%;
    height:30px;
    background:none;
    line-height:30px;
    left:0;
}
.join_wrap .jw_case .sb_ninp input[type="checkbox"]:checked + label:before {
	background:none;
	color:#fff;
}

.join_wrap .jw_case .jw_agree{margin:0 0 25px;padding:10px 5px;background-color:#1a1a1a;font-size:13px;color:#dcdcdc;line-height:20px;position:relative;}
.join_wrap .jw_case .jw_box{margin:0 0 15px;padding:10px 5px;background-color:#1a1a1a;font-size:13px;color:#dcdcdc;line-height:20px;position:relative;}
.join_wrap .jw_case .jw_box img{width:75%;}
.join_wrap .jw_case .jw_scr1{height:100px;overflow:hidden;overflow-x:hidden;overflow-y:scroll;}
.join_wrap .jw_case .jw_scr2{height:200px;overflow:hidden;overflow-x:hidden;overflow-y:scroll;}

.join_wrap .jw_case .jc_tbtn{margin:35px 0 0;text-align:left;font-size:16px;color:#18a2a2;line-height:20px;position:relative;}
.join_wrap .jw_case .jc_tbtn a{color:#18a2a2;}


.join_wrap .jw_list li{position: relative;}
.join_wrap .read_more{width: 24px;height: 24px;;background:url(../images/icon/more.png);background-size: 24px;;position: absolute;right: 5px;top: 50%;transform: translateY(-50%);}

.join_wrap .jw_check .jw_all {padding:0 0 0 30px;}
.join_wrap .jw_check .jw_list{padding:0 0 0 30px;}
.join_wrap .jw_check .jw_all input[type="checkbox"] + label, .join_wrap .jw_check .jw_list input[type="checkbox"] + label{padding:0 0 0 20px; width: 100%;font-size: 14px;line-height: 50px;}
.join_wrap .jw_check .jw_all input[type="checkbox"], .join_wrap .jw_check .jw_list input[type="checkbox"]{margin: 0;}
.join_wrap .jw_case .sb_inp input[type="button"]{
    background: #18a2a2 !important;
    color: #fff !important;
}
.join_wrap .jw_btn input[type="submit"]{
	height: 50px;
    background-color: #17a3a2;
    border-radius: 0;
    text-align: center;
    font-size: 16px;
    color: #fff !important;
    line-height: 50px;
    display: block;
}
.join_wrap .jw_case .sb_inp input[type="text"].file-upload-input {
	color: #fff;
	font-size: 16px;
	margin:0;
	height: 36px !important;
	line-height: 36px !important;
	float: left;
	border-bottom:1px solid #a3a3a3 !important;
	/* IE 9 Fix */
  }
  .join_wrap .jw_btn input[type="button"]:disabled{background: gray !important; opacity: 1!important; }
  input[type="checkbox"] + label:before {
    left: -30px;
}

/* register_p1 */
.profi_wrap{margin:30px 0 0;padding:0;position:relative;}

.iw_lntcon{margin:0;padding:25px 0;text-align:center;font-size:13px;line-height:20px;position:relative;border-bottom: 1px solid #f5f5f5;}
.iw_lntcon .il_con{width: 100%;}
.iw_lntcon .il_con img{width:24.44%;height:auto;}

.profi_wrap .dw_case{margin:20px 0 0;padding:0;position:relative;}
.profi_wrap .dw_case ul li{display: flex;justify-content: space-between;}
.profi_wrap .dc_tit{margin:0;text-align:left;font-size:14px;line-height:44px;position:relative;color: #222;width: 70px;font-weight: 500;}
.profi_wrap .dc_tit button{margin:0 0 0 5px;}
.profi_wrap .dw_case .dc_inp{margin:5px 0 0;padding:0 0 2px;border:1px solid #ededed;font-size:14px;font-weight:400;line-height:20px;position:relative;width:64%;}
.profi_wrap .dw_case .dc_inp input{
	width:100%;
	height:36px;
	margin:0;
	padding:0 0 0 15px;
	border:0 none;
	background-color:transparent;
	font-size:14px;
	color: #212124;
	line-height:36px;
	float:left;
}
.profi_wrap .dw_case .dc_inp input.big{
	text-align:right;
	font-size:22px;
	color:#fff;
}
.profi_wrap .dw_case .dc_inp.big{
	height:30px;
	text-align:right;
	font-size:22px;
	color:#fff;
	line-height:30px;
}
.profi_wrap .dw_case .dc_inp input[type="button"]{color:#18a2a2 !important;}
.profi_wrap .dw_case .dc_inp input[type="button"].button{padding:0 10px;background-color:#18a2a2;color:#fff !important;}

.profi_wrap .dw_case .dc_inp .select-wrapper{height:30px !important;margin-bottom:0;line-height:30px !important;float:left;}
.profi_wrap .dw_case .dc_inp .select-wrapper select{height:30px !important;border:0 none;color:#fff;line-height:30px !important;}
.profi_wrap .dw_case .dc_inp .select-wrapper select option{background-color:#1a1a1a;}

.profi_wrap .dw_case .dc_box{margin:0;padding:0;position:relative;}
.profi_wrap .dw_case .dc_box li{padding:10px 10px 5px;background-color:#1a1a1a;font-size:13px;color:#fff;line-height:18px;position:relative;}
.profi_wrap .dw_case .dc_box li .db_ti{width:50%;margin:0 0 5px;text-align:left;letter-spacing:-1px;float:left;}
.profi_wrap .dw_case .dc_box li .db_tx{width:50%;margin:0 0 5px;text-align:right;letter-spacing:-1px;float:right;}

.profi_wrap .dw_tbtn{height:58px;margin:53px 0 0;position:relative;}
.profi_wrap .dw_tbtn input[type="button"]{
	height:58px;
	background-color:#C9202C;
	border-radius:6px;
	text-align:center;
	font-size:16px;
	color:#fff !important;
	line-height:50px;
	display:block;
	font-weight: 500;
}


/* register_p3*/
.profi_wrap .ch_list li{border-bottom: 1px solid #f5f5f5;justify-content: flex-start !important;margin: 0 auto;width: 340px;}
.profi_wrap .pa_tit{margin:0;text-align:left;font-size:14px;line-height:44px;position:relative;color: #222;;font-weight: 500;}
.profi_wrap .ch_list input[type="checkbox"],
.profi_wrap .ch_list input[type="radio"] {
	width:1em;
	-moz-appearance:none;
	-webkit-appearance:none;
	-o-appearance:none;
	-ms-appearance:none;
	appearance:none;
	opacity:0;
	display:block;
	float:right;
	z-index:-1;
}

.profi_wrap .ch_list input[type="checkbox"] + label,
.profi_wrap .ch_list input[type="radio"] + label {
	text-decoration:none;
	font-size:14px;
	font-weight:500;
	line-height: 42px;
	color:#222;
	position:relative;
	cursor:pointer;
	display:inline-block;
}

.profi_wrap .ch_list input[type="checkbox"] + label:before {left: 0;}

.profi_wrap .ch_list input[type="checkbox"] + label:before,
.profi_wrap .ch_list input[type="radio"] + label:before {
    width:45px;
    height:48px;
    content:'';
    background:url(../images/check_before.png) center 50% no-repeat;
	background-size:100%;
    display:block;
    text-align:center;
    color:#ddd;
    line-height:36px;
    display:inline-block;
    position:absolute;
    left:270px;
    top:0;
}
.profi_wrap .ch_list input[type="checkbox"]:checked + label:before,
.profi_wrap .ch_list input[type="radio"]:checked + label:before {
	background:rgba(0, 0, 0, 0.15);
	color:#999;
	content:'';
	background:url(../images/check_after.png) center 50% no-repeat;
	background-size:100%;
}

/* check_box 끝 */

.profi_wrap .jw_check .jw_all input[type="checkbox"] + label:before,
.profi_wrap .jw_check .jw_list input[type="checkbox"] + label:before{width:23px;height:23px;margin: 15px 0 0 15px;}
.profi_wrap .jw_case .sb_ninp input[type="checkbox"] + label:before{width:100%;height:30px;left:0;}
.profi_wrap .jw_case .sb_ninp input[type="checkbox"] + label:before {
    width:100%;
    height:30px;
    background:none;
    line-height:30px;
    left:0;
}
.join_wrap .jw_case .sb_ninp input[type="checkbox"]:checked + label:before {
	background:none;
	color:#fff;
}
input[type="checkbox"] + label:before {
    left: -30px;
}

.profi_wrap .price_list{padding: 20px 0 0;}

.profi_wrap .buy_info{padding: 10px 0 0;}
.profi_wrap .buy_info li{display:flex;flex-direction: column;}
.profi_wrap .buy_info li input{height: 36px;font-size: 14px;text-align: center;}
.profi_wrap .buy_tit {
    margin: 0;
    text-align: left;
    font-size: 14px;
    line-height: 44px;
    position: relative;
    color: #222;
	width: 100%;
    font-weight: 500;
	margin-top: 10px;
}
.profi_wrap .buy_info div .card_num{display:flex;}
.profi_wrap .buy_info div .card_num input{border: 1px solid #ededed;width: 24%;margin-right: 1%;}
.profi_wrap .exp_date input{border: 1px solid #ededed;width: 24%;}

/* .profi_wrap .buy_info div .card_select{display: flex;width: 100%;justify-content: space-between;color: #212124;}
.profi_wrap .buy_info div .card_select>div{border: 1px solid #212124;width: 49%;height: 114px;border-radius: 6px;font-size: 14px;font-weight: 600;text-align: center;line-height: 116px;color: #212124;}
.profi_wrap .buy_info div .card_select>div:hover,
.profi_wrap .buy_info div .card_select>div:focus,
.profi_wrap .buy_info div .card_select>div:active{border: 1px solid #c9202c;color: #c9202c;} */

.profi_wrap .tabcontent .tabcon_tit{
	margin: 0;
    text-align: left;
    font-size: 14px;
    line-height: 44px;
    position: relative;
    color: #222;
	width: 100%;
    font-weight: 500;
}
.profi_wrap .tabcontent .bday{display: flex;width: 75%;}
.profi_wrap .tabcontent .bday input{border: 1px solid #ededed;width: 32%;margin-right: 1%;}
.profi_wrap .tabcontent .sa_num input{border: 1px solid #ededed;width: 75%;}


.profi_wrap .caution{font-size: 12px;color: #c9202c;font-weight: 300;}

.profi_wrap select{width: 24%;height: 36px;border:1px solid #ededed;color: #ccc;}

.profi_wrap .fin_tit{text-align: center;font-size: 17px;font-weight: 300;color: #222;margin-top: 332px;}

/*tab css*/
.profi_wrap .tab{/* float:left;  */width:100%; height:auto;}
.profi_wrap .tabnav{display: flex;width: 100%;justify-content: space-between;color: #212124;}
.profi_wrap .tabnav li{width: 49%;height: 114px;border-radius: 6px;font-size: 14px;font-weight: 600;text-align: center;line-height: 116px;color: #212124;}
.profi_wrap .tabnav li a:before{content:""; position:absolute; left:0; top:0px; width:100%; height:3px; }
/* .profi_wrap .tabnav li a.active:before{background:#7ea21e;} */
.profi_wrap .tabnav li a.active{border-bottom:1px solid #fff;}
.profi_wrap .tabnav li a{ position:relative; display:block; color: #000;line-height:46px; text-decoration:none; font-size:14px;width: 100%;border: 1px solid;border-radius: 6px;line-height: 114px;}
.profi_wrap .tabnav li a:hover,
.profi_wrap .tabnav li a.active{color:#c9202c; border: 1px solid #c9202c;}

/******** Pay **********/
.pay_wrap{margin: 0;position: relative;}
.pay_wrap .pf_img{width: 25px;height: 25px;position: absolute;right: 0;top: -80px;}
.pay_wrap .st_logo{width: 146px;margin: 75px auto 0;}
.pay_wrap .how_pay ul:nth-of-type(1){width: 100%;display: flex;justify-content: center;margin-top: 70px;}
.pay_wrap .how_pay ul:nth-of-type(1) li{width: 162px;height: 214px;}
.pay_wrap .how_pay ul:nth-of-type(1) li:nth-of-type(1){background: url(../images/pay_card.png) no-repeat;margin-right: 3px;}
.pay_wrap .how_pay ul:nth-of-type(1) li:nth-of-type(2){background: url(../images/pay_sms.png) no-repeat;margin-left: 3px;}
.pay_wrap .how_pay ul:nth-of-type(2){width: 100%;display: flex;justify-content: center;margin-top: 6px;}
.pay_wrap .how_pay ul:nth-of-type(2) li{width: 107px;height: 120px;}
.pay_wrap .how_pay ul:nth-of-type(2) li:nth-of-type(1){background: url(../images/pay_d1.png) no-repeat;margin-right: 3px;}
.pay_wrap .how_pay ul:nth-of-type(2) li:nth-of-type(2){background: url(../images/pay_d2.png) no-repeat;margin-left: 3px;}
.pay_wrap .how_pay ul:nth-of-type(2) li:nth-of-type(3){background: url(../images/pay_d3.png) no-repeat;margin-left: 3px;}
/* .pay_wrap .st_btn input[type="button"]{
	height: 58px;
    background-color: #C9202C;
    border-radius: 6px;
    text-align: center;
    font-size: 16px;
    color: #fff !important;
    line-height: 50px;
    display: block;
	font-weight: 500;
} */

.pay_wrap .fin_case{margin: 300px 0 0;text-align: center;}
.pay_wrap .fin_case .fin_tit{font-size: 29px;line-height: 35px;color: #222;}
.pay_wrap .fin_case > p{font-size: 17px;line-height: 24px;color: #222;margin-top: 50px;}

.pay_wrap .dw_tbtn{height:58px;margin:200px 0 0;position:relative;}
.pay_wrap .dw_tbtn input[type="button"]{
	height:58px;
	background-color:#C9202C;
	border-radius:6px;
	text-align:center;
	font-size:16px;
	color:#fff !important;
	line-height:50px;
	display:block;
}

/* Payment_status */
.payment_wrap{margin:30px 0 0;padding:0;position:relative;}
.payment_wrap .dw_case{padding: 12px 0 0;}
.payment_wrap .dw_case .payment_menu ul{display: flex;justify-content: space-between;}
.payment_wrap .dw_case .payment_menu ul li{font-size: 16px;line-height: 18px;font-weight: 400;color: #ababab;width: 25%;text-align: center;}
.payment_wrap .dw_case .payment_menu ul li.active{font-size: 16px;line-height: 18px;font-weight: 600;color: #212124;border-bottom: 2px solid #212124;padding: 0 0 15px;}

.payment_wrap .payment_con{width:100%;margin:0;padding:0;position:relative;}
.payment_wrap .payment_con .paycon_list{display: flex;justify-content: space-between;padding: 15px 30px;border-bottom: 1px solid #ededed;}
.payment_wrap .payment_con .paycon_list .pc_left .time{color: #212124;font-size: 14px;line-height: 22px;font-weight: 300;}
.payment_wrap .payment_con .paycon_list .pc_left .cont{color: #212124;font-size: 15px;line-height: 22px;font-weight: 500;}
.payment_wrap .payment_con .paycon_list .pc_left .status_cancel{color: #c9202c;font-size: 15px;line-height: 22px;font-weight: 500;}
.payment_wrap .payment_con .paycon_list .pc_left .status_request{color: #212124;font-size: 15px;line-height: 22px;font-weight: 500;}
.payment_wrap .payment_con .paycon_list .pc_left .status_fin{color: #ababab;font-size: 15px;line-height: 22px;font-weight: 500;}

.payment_wrap .payment_con .paycon_list .pc_right{color: #212124;font-size: 16px;line-height: 22px;font-weight: 500;padding-right: 20px;}
.payment_wrap .payment_con .paycon_list .pc_right img{width: 24px;}

.payment_wrap .payment_cancel_con{margin: 0 15px;}
.payment_wrap .payment_cancel_con ul{border: 1px solid #eaebf0;padding: 15px;border-radius: 7px;  box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.06);}
.payment_wrap .payment_cancel_con ul li{display: flex;height: 36px;line-height: 36px;}
.payment_wrap .payment_cancel_con ul li h5{padding-right: 40px;font-size: 14px;color: #777;font-weight: 400;line-height: 36px;}
.payment_wrap .payment_cancel_con ul li p{font-size: 14px;color: #222;font-weight: 400;}

.payment_wrap .payment_cancel_con_b{margin: 0 15px;}
.payment_wrap .payment_cancel_con_b ul{border: 1px solid #eaebf0;padding: 15px;border-radius: 7px;  box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.06);}
.payment_wrap .payment_cancel_con_b ul li{display: flex;height: 36px;line-height: 36px;}
.payment_wrap .payment_cancel_con_b ul li h5{padding-right: 40px;font-size: 14px;color: #212124;font-weight: 400;line-height: 36px;}
.payment_wrap .payment_cancel_con_b ul li p{font-size: 14px;color: #222;font-weight: 400;}

.payment_wrap .dw_tbtn{height:58px;margin:200px 15px 0;position:relative;}
.payment_wrap .dw_tbtn input[type="button"]{
	height:58px;
	background-color:#C9202C;
	border-radius:6px;
	text-align:center;
	font-size:16px;
	color:#fff !important;
	line-height:50px;
	display:block;
	font-weight: 600;
}

.payment_wrap .dw_case .payment_menu .du_month li{font-size: 16px;line-height: 18px;font-weight: 400;color: #ababab;width: 50%;text-align: center;}
.payment_wrap .dw_case .payment_menu .du_month li.active{font-size: 16px;line-height: 18px;font-weight: 600;color: #212124;border-bottom: 2px solid #212124;padding: 0 0 15px;}

.payment_wrap .payment_con .payment_con_total{margin: 20px 15px;}
.payment_wrap .payment_con .payment_con_total ul{border: 1px solid #eaebf0;padding: 15px 20px;border-radius: 7px;  box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.06);}
.payment_wrap .payment_con .payment_con_total ul li{display: flex;height: 30px;line-height: 30px;justify-content: space-between;}
.payment_wrap .payment_con .payment_con_total ul li h5{font-size: 16px;color: #212124;font-weight: 600;line-height: 30px;}
.payment_wrap .payment_con .payment_con_total ul li p{font-size: 16px;color: #222;font-weight: 600;}
.payment_wrap .payment_con .paycon_total_list {
    display: flex;
    justify-content: space-between;
    padding: 15px;
    border-bottom: 1px solid #ededed;
}
.payment_wrap .payment_con .paycon_total_list .pc_right {
    color: #212124;
    font-size: 16px;
    line-height: 22px;
    font-weight: 500;
    padding-right: 0;
}

/* Payment_simple */
.paysimple_wrap{margin:0;padding:0;position:relative;}
.paysimple_wrap .fin_case{margin: 300px 0 0;text-align: center;}
.paysimple_wrap .fin_case .fin_tit{font-size: 29px;line-height: 35px;color: #222;}
.paysimple_wrap .fin_case > p{font-size: 17px;line-height: 24px;color: #222;margin-top: 50px;}
.paysimple_wrap .dw_tbtn{height:58px;margin:200px 0 0;position:relative;}
.paysimple_wrap .dw_tbtn input[type="button"]{
	height:58px;
	background-color:#C9202C;
	border-radius:6px;
	text-align:center;
	font-size:16px;
	color:#fff !important;
	line-height:50px;
	display:block;
}
.paysimple_wrap .dw_tbtn2{height:58px;padding:0;position:relative;}
.paysimple_wrap .dw_tbtn2 input[type="button"]{
	height:58px;
	background-color:#ededed;
	border-radius:6px;
	text-align:center;
	font-size:16px;
	color:#c1c1c1 !important;
	line-height:50px;
	display:block;
}


/**payment_pwd.htm **/
#pp .back {
    background: url(../images/icon/arrow_back_w.png) no-repeat 5px 50%;
}

.nft_payment_cont {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.nft_payment_cont img {
    width: 110px;
    padding: 10px 0 0;
    display: block;
}

.nft_payment_cont span {
    display: block;
    padding-bottom: 20px;
    font-weight: 400;
    font-size: 1.2em;
}

.nft_payment_cont .npc_title {
    font-size: 20px;
    color: #222;
    font-weight: 400;
    display: block;
    margin: 140px auto 60px;
    padding-bottom: 0;
}

.nft_payment_cont .npc_txt {
    text-align: center;
    font-size: 15px;
    color: #c3c0c9;
    font-weight: normal;
    line-height: 1.5em;
}

/* 키패드화면 */
.device {
    margin: 0 auto;
    display: inline-block;
    transform: scale(1);
    width: 100%;
}

.device .device-viewport {
    width: 100%;
    margin: 0 auto;
    height: 500px;
}

.body-content {
    padding: 16px;
}

.body-content h3 {
    margin-bottom: 16px;
}

.body-content p {
    line-height: 1.5em;
    margin-bottom: 8px;
}

.body-content button {
    width: 100%;
    height: 48px;
    margin-top: 24px;
    cursor: pointer;
}

.pin-info {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: white;
    background: #EAEAEA;
}

.pin-display {
    position: fixed;
    bottom: 0px;
    left: 0;
    right: 0;
    width: 100%;
    background: white;
    z-index: 100000;
}

.keypad {
    width: 100%;
    margin: 0 auto;
    padding: 0;
    background: #292a2f;


}

.keypad--row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 34px 0;
}

.keypad--button {
    color: #fff;
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    font-weight: 400;
    cursor: pointer;
    transition: all 100ms ease-out;
}

.keypad--button:active {
    color: #000;
}

.confirmation-dots {
    margin-bottom: 100px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.confirmation-dots.error {
    animation-name: shake;
    animation-duration: 300ms;
}

.confirmation-dots svg {
    height: 24px;
    max-height: 24px;
    width: 220px;
}

.confirmation-dots .pin-circle {
    transition: all 100ms ease-out;
    fill: lightgray;
    stroke-width: 2px;
    stroke: lightgray;
    outline-offset: -2px;
    outline-width: 2px;
}

.confirmation-dots .pin-circle.entered {
    fill: black;
    stroke: black;
}

.confirmation-dots .pin-circle.success {
    fill: green;
    stroke: green;
}

.confirmation-dots .pin-circle.error {
    fill: red;
    stroke: red;
}

.circle-lock--container {
    height: 72px;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: row;
}

.circle-lock {
    width: 80px;
    height: 80px;
    background: white;
    border-radius: 1000px;
    position: relative;
    top: -40px;
    box-shadow: 0px 1px 1px 1px rgba(0, 0, 0, 0.12);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.circle-lock .lock-icon {
    color: #333;
}

.page-title {
    font-size: 28px;
    line-height: 32px;
    text-align: center;
    font-weight: 700;
}

.pin-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

@keyframes shake {
    10%, 90% {
        transform: translate3d(-1px, 0, 0);
    }
    20%, 80% {
        transform: translate3d(2px, 0, 0);
    }
    30%, 50%, 70% {
        transform: translate3d(-4px, 0, 0);
    }
    40%, 60% {
        transform: translate3d(4px, 0, 0);
    }
}