@charset "utf-8";

header{width:100%; background: #ffff; position: fixed; border-bottom: solid 1px #e5e5e5; box-sizing: border-box; top:0;z-index:3}
header.player{position: relative}
header .top{width:1120px; margin:0 auto}
header .play_area{height:88px; padding:0 20px}
header .area_wrap{width:100%; display: flex; position: relative}
header .logo{width:196px; height:51px; background: url(/images/kacpta_logo.jpg) no-repeat; overflow: hidden; text-indent: -9999px; position: absolute; top:24px;}
header .logo a{width:100%; height:100%; display: block}

header .search{width:100%;  padding:0 135px; display: flex; align-items: center; justify-content: center}
header .search .search_wrap{width:100%; height:100%; min-widht:314px; max-width:434px; position: relative;}
header .search .search_wrap2{width:100%; position: absolute; top:17px; left:0}
header .search .search_wrap2 .on{background: #fff; border: solid 1px #e5e5e5; border-radius: 15px; box-shadow: 0 10px 10px rgba(0,0,0,0.07)}
header .search .search_wrap3{padding-top:6px; border: solid 1px #fff}
header .search .search_box{padding:0 6px;}
header .search .search_box .search_box_wrap{height:44px; border: solid 1px #e5e5e5; box-sizing: border-box; border-radius:25px; position:relative;}
header .search .on .search_box .search_box_wrap{height:44px; border: solid 1px #0069b4; box-sizing: border-box; border-radius:25px; position:relative}
header .search .search_box .inp_ser{width:calc(100% - 50px); height:100%; box-sizing: border-box; border:0; outline: none; background: rgba(0,0,0,0); text-indent: 20px}
header .search .search_box button.btn_ser{
	width:18px; height:17px; background: url(/images/ico_ser.png) 50% no-repeat; text-indent: -9999px; overflow: hidden; padding:18px;
	position: absolute; top:3px; right:10px; border:0
}
header .search .ser .search_ser_wrap{display: block}
header .search .search_ser_wrap{display: none}
header .search .search_ser_wrap .search_ser{font-size: 14px; line-height: 30px}
header .search .search_ser_wrap .search_ser ul{padding:10px 0}
header .search .search_ser_wrap .search_ser ul li{padding:0 20px; white-space:nowrap; text-overflow:ellipsis; overflow: hidden; position: relative}
header .search .search_ser_wrap .search_ser ul li:hover{background: #f2f8ff}
header .search .search_ser_wrap .search_ser strong{color:#0069b4}

header .search .his .search_his_wrap{display: block;}
header .search .search_his_wrap{display: none}
header .search .search_his_wrap .search_his{font-size: 14px; line-height: 30px}
header .search .search_his_wrap .search_his a{width:100%; height:100%;}
header .search .search_his_wrap .search_his ul{padding:10px 0}
header .search .search_his_wrap .search_his ul li{padding:0 40px 0 20px; white-space:nowrap; text-overflow:ellipsis; overflow: hidden; position: relative}
header .search .search_his_wrap .search_his ul li:hover{background: #f2f8ff}
header .search .search_his_wrap .search_his button.btn_del{
	width:9px; height:9px; background:  url(/images/ser_del.png) 50% no-repeat; border:0; overflow: hidden; text-indent: -9999px; transition: all .3s ease; padding:10px;
	position: absolute; top:5px; right:10px
}
header .search .search_his_wrap .search_his button.btn_del:hover{transform: rotate(180deg);}

header .search_his_wrap .search_auto{height:40px; line-height: 40px; background: #edf0f2; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; font-size: 14px; padding:0 20px;}
header .search_his_wrap .search_auto button.btn_off{
	font-family: NanumEB;
	width:32px; height:15px; background: #bbb; font-size: 8px; border-radius:8px; border:0; color: #fff; vertical-align: middle; margin-left:10px; line-height: 15px
}
header .search_his_wrap .search_auto button.btn_on{
	font-family: NanumEB;
	width:32px; height:15px; background: #0069b4; font-size: 8px; border-radius:8px; border:0; color: #fff; vertical-align: middle; margin-left:10px; line-height: 15px
}
header .search_his_wrap .search_auto button.btn_alldel{position: absolute; right:20px; border:0px; background: rgba(0,0,0,0); margin-top:15px}

header .tr_wrap{display: flex; position: absolute; top:24px; right: 0}
/* 알림 */
header .tr_wrap button.alert{width:36px; height:36px; margin-top:5px; position: relative; background: rgba(0,0,0,0)}
header .tr_wrap button.alert:hover{background: #f5f6f7; border-radius:20px}
header .tr_wrap button.alert .bell{width:100%; height:100%; display: block; background: url(/images/bell.png) 50% no-repeat; overflow: hidden; text-indent: -9999px;}
header .tr_wrap button.alert .bell_chek{width:5px; height:5px; background: #ff0000; border-radius:3px; position: absolute; top:6px; right:6px}
header .tr_wrap .alert_box{
	position: absolute; width:250px; height:400px; border-radius: 15px; border: solid 1px #e5e5e5; top:50px; background: #fff; font-size: 14px; padding-top:20px; margin-left:-100px;
	overflow-y:auto; display: none; box-shadow: 0 10px 10px rgba(0,0,0,0.07)
}
header .tr_wrap .alert_box.on{display: block;}
header .tr_wrap .alert_box::-webkit-scrollbar{width:5px;}
header .tr_wrap .alert_box::-webkit-scrollbar-thumb{background: #d6d9db; border-radius:5px}

header .tr_wrap .alert_box .alert_title{display:flex; justify-content: space-between; flex-wrap: wrap; padding:0 20px}
header .tr_wrap .alert_box .alert_title .alert_st{font-family: NanumB; font-size: 14px}
header .tr_wrap .alert_box .alert_title button.btn_all_del{font-size: 11px; background: rgba(0,0,0,0); margin-top:5px}
header .tr_wrap .alert_box .alert_title .btn_all_del:hover{text-decoration: underline}
header .tr_wrap .alert_box .alert_dd{margin-top:15px}
header .tr_wrap .alert_box .alert_dd li.not_reading{background: #f2f8ff}
header .tr_wrap .alert_box .alert_dd li:nth-last-child(1){border-bottom-left-radius: 15px; border-bottom-right-radius: 15px}
header .tr_wrap .alert_box .alert_dd li a{display: flex; position: relative}
header .tr_wrap .alert_box .alert_dd li.not_alert{text-align: center; background: url(/images/cha_unreg.png) 50% 80% no-repeat; padding-top:200px}
header .tr_wrap .alert_box .alert_dd a{padding:10px 0}
header .tr_wrap .alert_box .alert_dd a:hover .alert_dd_wrap .alert_dd_st{text-decoration: underline}
header .tr_wrap .alert_box .alert_dd .alert_dd_wrap{display: block; padding:0 30px 0 20px;}
header .tr_wrap .alert_box .alert_dd .alert_dd_wrap .alert_dd_st{display: block; font-size: 12px; line-height: 18px}
header .tr_wrap .alert_box .alert_dd .alert_dd_wrap .alert_dd_date{display: block; font-size: 11px; color:#9c9c9c; margin-top:5px}
header .tr_wrap .alert_box .alert_dd .alert_dd_del{
	position: absolute; width:20px; height:20px; background: url(/images/ser_del.png) 50% no-repeat; overflow: hidden; text-indent: -9999px; right:15px; top:8px; transition: all .3s ease;
}
header .tr_wrap .alert_box .alert_dd .alert_dd_del:hover{transform: rotate(180deg);}

/* main - 로그인 */
header .tr_wrap button.login{font-family: NanumB; padding:12px; background: rgba(0,0,0,0); border:0; font-size: 16px; margin:0 0 0 30px}
header .tr_wrap button.login:hover{background: #f5f6f7; border-radius: 5px}
header .tr_wrap button.login_out{
	font-family: NanumB; padding:12px 44px 12px 12px; background: url(/images/id_arrow.png) 90%  50% no-repeat; border:0; font-size: 16px; margin:0 0 0 30px}
header .tr_wrap button.login_out:hover{background: url(/images/id_arrow.png) 90%  50% no-repeat #f5f6f7; border-radius: 5px}

/*내정보*/
header .tr_wrap .mem_info{
	position: absolute; width:195px; border-radius: 15px; border: solid 1px #e5e5e5; top:50px; right:-10px; background: #fff; font-size: 14px; display: none; box-shadow: 0 10px 10px rgba(0,0,0,0.07)
}
header .tr_wrap .mem_info.on{display: block;}
header .tr_wrap .mem_info .info_ico{display: flex; border-bottom:solid 1px #e5e5e5}
header .tr_wrap .mem_info .info_ico .info_fav{width:50%; height:73px; background: url(/images/ico_fav.png) 50% 15px no-repeat; text-align: center}
header .tr_wrap .mem_info .info_ico .info_fav a{width:100%; height:100%; padding-top:44px; box-sizing: border-box; display: block}
header .tr_wrap .mem_info .info_ico .info_11{width:50%; height:73px; background: url(/images/ico_11.png) 50% 15px no-repeat; text-align: center; border-left:solid 1px #e5e5e5}
header .tr_wrap .mem_info .info_ico .info_11 a{width:100%; height:100%; padding-top:44px; box-sizing: border-box; display: block}
header .tr_wrap .mem_info .info_pt{display: block; box-sizing: border-box; padding:18px 0 18px 20px}
header .tr_wrap .mem_info .info_fp{display: block; box-sizing: border-box; padding:18px 0 18px 20px; line-height: 20px}
header .tr_wrap .mem_info .info_ip{width:100%; background: #f3f6f8; display:flex; justify-content: space-between; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px}
header .tr_wrap .mem_info .info_ip .info_my a{padding:18px 15px 18px 20px; background: url(/images/ico_key.png) 100% 50% no-repeat; display: block}
header .tr_wrap .mem_info .info_ip .info_out a{padding:18px 20px; display: block}
header .tr_wrap .mem_info .cect{color:#0069b4; font-family: NanumB; letter-spacing: -1px}

/* 메뉴 */
nav{width:100%; display: block; margin:110px 0 40px 0}
nav dl{display: flex; justify-content: space-between}
nav dd{}
nav a{}
nav a:hover{color: #0069b4}
nav .on a{color: #0069b4; font-family: NanumEB; font-size: 18px}

nav .menu_box{width:100%; height:460px; background: #fff; position: absolute; top:219px; left:0; display: none}
nav .menu_box .menu_con{width:1120px; height:100%; display: block; margin:0 auto; border-left:solid 1px #edf0f2; border-right:solid 1px #edf0f2; position: relative}
nav .menu_box .menu_con .banner_macgo{width:251px; height:358px; background: url(/images/banner_macgo.png) no-repeat; position: absolute; right:20px; top:20px}
nav .menu_box .menu_con .banner_macgo a{width:100%; height:100%; display: block; overflow: hidden; text-indent: -9999px}
nav .menu_box button.btn_menu_close{
	width:38px; height:19px; background: url(/images/menu_arrow.png) no-repeat; display: block !important;
	margin:0 auto; text-indent: -9999px; overflow: hidden
}
nav .menu_blr{width:100%; height:100%; position:fixed; background: rgba(0,0,0,0.8); top:219px; left:0; display: none; z-index: -100}

nav .menu_st{font-size:18px; padding-bottom:40px}
nav .menu_dd{padding:20px}
nav .menu_dd>li{line-height: 30px; font-size: 16px;}
nav .menu_dd .msub_st{}
nav .menu_dd .msub_st a:hover{width:230px; display: block; background: url(/images/arrow.png) 100% 50% no-repeat}
nav .menu_dd .msub_st.on{width:230px; display: block; background: url(/images/arrow.png) 100% 50% no-repeat}

nav .menu_dd .msub_dd{height:100%; position: absolute; margin-left:250px; top:0; border-left:solid 1px #edf0f2; padding:20px; font-size: 14px; box-sizing: border-box; display: none}
nav .menu_dd .msub_dd > li:nth-child(n+28):nth-child(-n+42) { margin-left: 600px; }
nav .menu_dd .msub_dd > li:nth-child(n+15):nth-child(-n+28) { margin-left: 270px; }
nav .menu_dd .msub_dd > li:nth-child(15) { margin-top: -420px; }
/* 25번째 항목에 대해서는 margin-top -360px 적용 */
nav .menu_dd .msub_dd > li:nth-child(29) { margin-top: -420px; }
/*
nav .menu_dd .msub_dd>li:nth-child(n+25):nth-child(-n+37){margin-left:600px}
nav .menu_dd .msub_dd>li:nth-child(n+13):nth-child(-n+24){margin-left:270px}
nav .menu_dd .msub_dd>li:nth-child(13){margin-top:-360px}
nav .menu_dd .msub_dd>li:nth-child(25){margin-top:-360px}
*/
/*nav .menu_dd .msub_dd>li:nth-child(24){margin-top:-390px}*/

/*회원가입*/
#member{background: #f3f6f8}
#member .login_set{}
#member .login_set dd{margin-bottom:20px !important}
#member .login_set dd input{height:60px !important}
#member .mem_login{width:460px; margin: 100px auto}
#member .mem_login dd{margin-bottom:20px}
#member .mem_login .login_tip{margin:30px 0 0 0; display: block; font-size: 14px; line-height: 18px; text-align: center; padding:10px; border-radius: 15px; background: #f54545; color: #fff}

#member .mem_login input[type=text],
#member .mem_login input[type=password],
#member .mem_login input[type=email],
#member .mem_login input[type=tel]{
	width:100%; height:50px; border:solid 1px rgba(0,0,0,0); border-radius: 15px; box-sizing: border-box; text-indent: 15px; font-size: 16px; outline: none
}
#member .mem_login input[type=text]:focus,
#member .mem_login input[type=password]:focus,
#member .mem_login input[type=email]:focus,
#member .mem_login input[type=tel]:focus
{
	border:solid 1px #0069b4; box-sizing: border-box
}
#member .mem_login input[type=text]::placeholder,
#member .mem_login input[type=password]::placeholder,
#member .mem_login input[type=email]::placeholder,
#member .mem_login input[type=tel]::placeholder
{
	font-size: 16px
}
#member .mem_login input[readonly] {background: #fff; caret-color: transparent; cursor:auto}
#member .mem_login input[readonly]:focus {border:solid 1px rgba(0,0,0,0)}
#member .mem_login .mem_inptt{width:100%; display: block; margin-bottom:13px}
#member .mem_login .mem_inptt em{background: #d6d9db; font-size: 12px; padding:3px 10px; border-radius: 10px; font-style: normal}
#member .mem_login .mem_login_tt{display: block; font-size: 14px; padding:10px 0; line-height: 18px; letter-spacing: -1px}
#member .mem_login input[type=text].mem_mod{color:#000; font-family: NanumB}

/*회원가입 - 로그인*/
#member .mem_login .logo{width:171px; height:41px; background: url(/images/logo.png) no-repeat; overflow: hidden; text-indent: -9999px; margin: 0 auto; margin-bottom:35px}
#member .mem_login .logo a{width:100%; height:100%; display: block}
#member .mem_login .btn_login{width:100%; height:50px; background: #0069b4; color: #fff; border-radius: 15px; font-family: NanumB}
#member .mem_login ul.id_chkop{display: flex}
#member .mem_login ul.id_chkop li{width:50%; position: relative}
#member .mem_login ul.id_chkop li input.inp_log_chk, #member .mem_login ul.id_chkop li input.inp_idsa_chk{
	display: none
}
#member .mem_login ul.id_chkop li input.inp_log_chk+label.log_chk, #member .mem_login ul.id_chkop li input.inp_idsa_chk+.idsa_chk{
	display: inline-block; cursor: pointer; width: 20px; height: 20px; background: #777
}
#member .mem_login ul.id_chkop li input.inp_log_chk:checked+label.log_chk, #member .mem_login ul.id_chkop li input.inp_idsa_chk:checked+.idsa_chk{
	display: inline-block; cursor: pointer; width: 20px; height: 20px; background: url(/images/chk.png) 50% no-repeat #0069b4
}
#member .mem_login ul.id_chkop li label.log_chk span, #member .mem_login ul.id_chkop li label.idsa_chk span{
	position: absolute; top:2px; left:30px; font-family: NanumB; cursor: pointer; caret-color: transparent;
}
#member .mem_login ul.ser_chkop{width:100%; display: flex; margin-top:20px; justify-content: center}
#member .mem_login ul.ser_chkop li{padding:10px 20px; }
#member .mem_login ul.ser_chkop li:nth-child(1),#member .mem_login ul.ser_chkop li:nth-child(2){background: url(/images/ser_sec.png) 100% 50% no-repeat}
#member .mem_login ul.login_social{margin-top:50px}
#member .mem_login ul.login_social li{margin-bottom:10px}
#member .mem_login ul.login_social button.btn_naver{width:100%; height:50px; border-radius: 15px; background: url(/images/ico_naver.png) 30% 50% no-repeat #03c75a; font-family: NanumB}
#member .mem_login ul.login_social button.btn_kakao{width:100%; height:50px; border-radius: 15px; background: url(/images/ico_kakao.png) 30% 50% no-repeat #fee102; font-family: NanumB}

/*회원가입 - 간편회원가입*/
#member .mem_login .itgo_join{width:100%; display: block}
#member .mem_login .itgo_join .btn_join{
	width:100%; height:80px; border-radius: 15px; background: url(/images/join_cha.png) 22% 50% no-repeat #0069b4; font-family: Nanum; color:#fff; font-size:18px
}
#member .mem_login .itgo_join .btn_join span{font-family: NanumEB}
#member .mem_login dl.sim_join{}
#member .mem_login dl.sim_join dt{padding:50px 0 10px 0; border-top:solid 1px #dadada; margin-top:50px}
#member .mem_login dl.sim_join dd{margin-bottom:10px}
#member .mem_login dl.sim_join dd button.btn_naver{width:100%; height:50px; border-radius: 15px; background: url(/images/ico_naver.png) 30% 50% no-repeat #03c75a; font-family: NanumB}
#member .mem_login dl.sim_join dd button.btn_kakao{width:100%; height:50px; border-radius: 15px; background: url(/images/ico_kakao.png) 30% 50% no-repeat #fee102; font-family: NanumB}
/*회원가입 - 이용약관*/
#member .mem_login .term{font-size: 18px;}
#member .mem_login .term .pb1{font-family: NanumEB; display: block; font-size: 18px; padding:0 0 20px 0}
#member .mem_login .term .pb2{font-family: NanumB; display: block; font-size: 16px; padding-bottom:10px}
#member .mem_login .term .check_wrap{background: #fff; padding:15px}
#member .mem_login .term .term_box{background: #fff; padding:35px; margin-top:2px}
#member .mem_login .term .term_box .box_tt{height:150px; font-size: 14px; overflow-y: scroll; word-break:break-all; display: block; box-sizing: border-box; line-height: 24px}
#member .mem_login .term .term_box .box_tt::-webkit-scrollbar{width:5px;}
#member .mem_login .term .term_box .box_tt::-webkit-scrollbar-thumb{background: #777; border-radius:5px}
#member .mem_login .term li{position: relative}
#member .mem_login .term li:nth-child(1) .check_wrap{border-top-left-radius: 15px; border-top-right-radius: 15px; padding-bottom:15px}
#member .mem_login .term li:nth-child(3) .term_box{border-bottom-left-radius: 15px; border-bottom-right-radius: 15px}
#member .mem_login .term li:nth-child(2), #member .mem_login .term li:nth-child(3){margin-top:10px}
#member .mem_login .term input.inp_all_chk, #member .mem_login .term input.inp_term1_chk, #member .mem_login .term input.inp_term2_chk{
	display: none
}
#member .mem_login .term input.inp_all_chk+label.all_chk, #member .mem_login .term input.inp_term1_chk+label.term1_chk, #member .mem_login .term input.inp_term2_chk+label.term2_chk{
	display: inline-block; cursor: pointer; width: 20px; height: 20px; background: #777; caret-color: transparent;
}
#member .mem_login .term input.inp_all_chk:checked+label.all_chk, #member .mem_login .term input.inp_term1_chk:checked+label.term1_chk, #member .mem_login .term input.inp_term2_chk:checked+label.term2_chk{
	display: inline-block; cursor: pointer; width: 20px; height: 20px; background: url(/images/chk.png) 50% no-repeat #0069b4
}
#member .mem_login .term label.all_chk span, #member .mem_login .term label.term1_chk span, #member .mem_login .term label.term2_chk span{
	position: absolute; top:17px; left:45px; font-family: NanumB
}
/*회원가입 - 정보입력*/
#member .mem_login .id_set{position: relative; display: block; padding:0 90px 0 0}
#member .mem_login .id_set input{border-top-right-radius:0 !important; border-bottom-right-radius:0 !important}
#member .mem_login .id_set .id_chk{
	width:90px; height:50px; position: absolute; right:0; border-top-right-radius:15px; border-bottom-right-radius:15px; color: #fff;
	background:#0069b4; cursor: pointer; font-size: 16px
}

#member .mem_login .inf_box{display: flex; flex-wrap: wrap; background: #fff; padding:20px; border-radius:15px; position: relative}
#member .mem_login .inf_box dd{position: relative; width:50%}
#member .mem_login .inf_box dd:last-of-type{display: block; margin:0; width:100%}

#member .mem_login .inf_box input.inp_to_email,
#member .mem_login .inf_box input.inp_to_sms{
	display: none
}
#member .mem_login .inf_box input.inp_to_email+label.to_email{
	display: inline-block; cursor: pointer; width: 20px; height: 20px; background: #777
}
#member .mem_login .inf_box input.inp_to_sms+label.to_sms{
	display: inline-block; cursor: pointer; width: 20px; height: 20px; background: #777
}
#member .mem_login .inf_box input.inp_to_email:checked+label.to_email,
#member .mem_login .inf_box input.inp_to_sms:checked+label.to_sms{
	display: inline-block; cursor: pointer; width: 20px; height: 20px; background: url(/images/chk.png) 50% no-repeat #0069b4
}
#member .mem_login .inf_box label.to_email span,
#member .mem_login .inf_box label.to_sms span{width:150px; display: block; padding-left:30px; cursor: pointer; caret-color: transparent;}

#member .mem_login .register{background: #fff; padding:50px; border-radius: 15px; margin-top:10px; line-height: 24px; position: relative}
#member .mem_login .register_st{font-size: 18px; font-family: NanumB}
#member .mem_login .register_dd{margin-top:10px; display: block}
#member .mem_login .cha_un{width:112px; height:108px; background: url(/images/cha_unreg.png) no-repeat; display: block; position: absolute; right:-20px; bottom:-10px}
#member .mem_login .cha_reg{width:89px; height:125px; background: url(/images/cha_reg.png) no-repeat; display: block; position: absolute; right:-20px; bottom:-10px}

#member .mem_login .mem_out{background: #fff; border-radius: 15px; padding:20px; margin-top:100px}
#member .mem_login .mem_out .mem_out_st{font-family: NanumB; font-size: 20px }
#member .mem_login .mem_out ul.mem_out_dd{margin-top:20px}
#member .mem_login .mem_out ul.mem_out_dd li{line-height: 24px}
#member .mem_login .mem_out button.btn_mem_out{padding:5px 10px; background: #eee; margin-top:20px; border-radius: 10px}


/*#banner{width: 100%; height:410px; background: url(/images/banner001.jpg) 50% 0 no-repeat; margin:219px 0 0 0}*/
#banner{width: 100%; height:344px; background: url(/images/banner_bg.jpg) 50% 0 no-repeat; margin:219px 0 0 0}
#banner .banner_tt {
    width: 100%;
    height: 299px;
    display: block;
    background: url(/images/banner_kacpta.png) 50% 0 no-repeat;
    position: absolute;
}
#banner .banner_tt2 {
    width: 976px;
    height: 30px;
    display: block;
    color: #fff;
    margin: 0 auto;
    padding: 250px 0 0 0
}
/* 강의실 */
#sub_banner_classroom{width: 100%; height:400px; background: url(/images/sub_classroom.jpg) 50% 0 no-repeat; margin:166px 0 0 0}
#sub_banner_classroom .sub_banner_classroom_wrap{width:1120px; margin:0 auto; display: block;}
#sub_banner_classroom h2.bnst{font-family: NanumH; padding-top:130px; font-size: 58px; color: #fff}
#sub_banner_classroom .bntt{font-family: NanumB; margin-top:15px; display: block; line-height: 24px; color: #fff}
/* 내강의실 */
#sub_banner_myclass{width: 100%; height:400px; background: url(/images/sub_myclass.jpg) 50% 0 no-repeat; margin:166px 0 0 0}
#sub_banner_myclass .sub_banner_myclass_wrap{width:1120px; margin:0 auto; display: block;}
#sub_banner_myclass h2.bnst{font-family: NanumH; padding-top:130px; font-size: 58px; color: #fff}
#sub_banner_myclass .bntt{font-family: NanumB; margin-top:15px; display: block; line-height: 24px; color: #fff}
/* 고객센터 */
#sub_banner_customer{width: 100%; height:400px; background: url(/images/sub_customer.jpg) 50% 0 no-repeat; margin:166px 0 0 0}
#sub_banner_customer .sub_banner_customer_wrap{width:1120px; margin:0 auto; display: block;}
#sub_banner_customer h2.bnst{font-family: NanumH; padding-top:130px; font-size: 58px; color: #fff}
#sub_banner_customer .bntt{font-family: NanumB; margin-top:15px; display: block; line-height: 24px; color: #fff}
/* 자유이용권 */
#sub_banner_freepass{width: 100%; height:400px; background: url(/images/sub_freepass.jpg) 50% 0 no-repeat; margin:166px 0 0 0}
#sub_banner_freepass .sub_banner_freepass_wrap{width:1120px; margin:0 auto; display: block;}
#sub_banner_freepass h2.bnst{font-family: NanumH; padding-top:105px; font-size: 58px; color: #fff; line-height: 64px}
#sub_banner_freepass .bntt{font-family: NanumB; margin-top:15px; display: block; line-height: 24px; color: #fff}
/* 이벤트 */
#sub_banner_event{width: 100%; height:400px; background: url(/images/sub_event.jpg) 50% 0 no-repeat; margin:166px 0 0 0}
#sub_banner_event .sub_banner_event_wrap{width:1120px; margin:0 auto; display: block;}
#sub_banner_event h2.bnst{font-family: NanumH; padding-top:105px; font-size: 58px; color: #fff; line-height: 64px}
#sub_banner_event .bntt{font-family: NanumB; margin-top:15px; display: block; line-height: 24px; color: #fff}

#cont{width:1120px; margin:0 auto}
#cont .notice_wrap{width:100%; height:56px; padding:50px 0 0 0; display: flex}
#cont .notice_wrap .notice{
	width:45%; height:100%; display: block; background: #edf0f2; border-radius:30px; font-size: 18px; line-height: 56px; box-sizing: border-box; padding:0 15px 0 0;
	letter-spacing: -1px; overflow: hidden; text-overflow:ellipsis; white-space:nowrap;
}
#cont .sub_title{font-size:30px; font-family: NanumEB; margin-top:100px}
#cont .sub_tip{height:40px; font-size:14px; margin-top:20px; line-height: 40px; background: #3badff; display: inline-block; padding:0 20px; border-radius: 20px; color: #fff}
#cont .sub_tip2{font-size:14px; margin-top:20px; line-height: 20px}

/* main */
#cont .notice_wrap .notice .ico_notice{font-size:14px; padding:0 10px 0 20px}
#cont .notice_wrap .itgo_class{width:55%; height:100%; display: block; line-height: 56px; font-size: 20px; letter-spacing: -1px; text-align: right}
#cont .notice_wrap .itgo_class .ect{color:#ff0000; font-family: NanumB}

#cont .pop_class{margin:50px 0 0 0}
#cont .pop_class h2{font-size: 24px; padding:0 0 5px 0}
#cont .pop_class ul{display: flex; flex-wrap: wrap; justify-content: space-between}
#cont .pop_class ul>li{margin:20px 0 0 0}
#cont .pop_class ul>li img{}


#cont .rec_class{margin:100px 0 0 0}
#cont .rec_class h2{font-size: 24px; padding:0 0 5px 0}
#cont .rec_class ul{display: flex; flex-wrap: wrap; justify-content: space-between}
#cont .rec_class ul>li{margin:20px 0 0 0}

/* sub */
/* 강의실 */
#cont .freepass{display: flex; margin-top:75px;}
#cont .freepass dd{height:268px}
#cont .freepass dd a{width:100%; height:100%; color:#fff; font-size: 24px; display: block; font-family: NanumEB;}
#cont .freepass dd .free_tt{display: block; padding:25px 0 0 15px; font-family: NanumH; line-height: 28px; letter-spacing: -1px}
#cont .freepass dd .free_price{color: #fff200; font-family: NanumH; display: block; letter-spacing: -2px}
#cont .freepass dd .free_price2{font-size: 12px; text-decoration: line-through; font-family: NanumB}
#cont .freepass dd .free_sale{font-size: 12px; background: #db0000; border-radius: 10px; margin:0 0 0 5px; padding:2px 5px; font-family: NanumB}
#cont .freepass dd .free_rest{font-size: 12px; font-family: NanumB}
#cont .freepass dd .free_em{font-size:18px}
#cont .freepass dd .btn_app{
	margin-top:10px;
	width:52px; height:20px; font-size: 11px; background: #fff; color:#000; display: block; border-radius: 20px; line-height: 20px; text-align: center; font-family: NanumEB
}
#cont .freepass dd.fp3m{width:151px; background: url(/images/freepass_3m.png) no-repeat;}
#cont .freepass dd.fp6m{width:151px; margin-left:19px; background: url(/images/freepass_6m.png) no-repeat;}
#cont .freepass dd.fpst{width:478px; background: url(/images/freepass_st.png) 0 40px no-repeat; text-align: center; box-sizing: border-box}
#cont .freepass dd.fpst .fpst_st{font-size:48px; font-family: NanumH; padding-top:65px; display: block; line-height: 30px}
#cont .freepass dd.fpst .fpst_st .fpst_em{font-size:16px; font-family: NanumEB}
#cont .freepass dd.fpst .fpst_tt{display: block; font-size: 14px; font-family: NanumB; line-height: 18px; margin-top:30px}
#cont .freepass dd.fp12m{width:151px; background: url(/images/freepass_12m.png) no-repeat;}
#cont .freepass dd.fp24m{width:151px; margin-left:19px; background: url(/images/freepass_24m.png) no-repeat;}

/* 자유이용권 등록 */
#cont .freepass_app{}
#cont .freepass_app .fp_app_classnum{width:100%; height:50px; line-height: 50px; display: block; text-align: center; font-family: NanumH; font-size: 24px; margin-top:50px; letter-spacing: -1px}
#cont .freepass_app .fp_app_classnum .fp_act1{color: #0069b4; font-family: NanumH}
#cont .freepass_app .fp_app_classnum .fp_act2{color: #0069b4; font-family: NanumH}
#cont .freepass_app .fp_app_classnum .fp_act3{color: #FF0000; font-family: NanumH}
#cont .freepass_app .fp_app_tab{width:100%; margin-top:10px; font-size: 14px}
#cont .freepass_app .fp_app_tab caption{font-family:NanumEB; text-align: left; font-size: 30px; padding-bottom:20px}
#cont .freepass_app .fp_app_tab thead{width:100%; height:49px; line-height: 49px; margin-top:20px; background: #f3f6f8; border-top:solid 1px #d6d9db;}
#cont .freepass_app .fp_app_tab thead>tr{}
#cont .freepass_app .fp_app_tab thead>tr>th{font-family: Nanum; font-weight: normal}
#cont .freepass_app .fp_app_tab tbody>tr>td{padding:20px 0; text-align: center; background: url(/images/tab_line.png) 0 100% repeat-x}
#cont .freepass_app .fp_app_tab tbody>tr:hover{background: #fffdea}
#cont .freepass_app .fp_app_tab .price_un{margin-right:5px; text-decoration: line-through}     
#cont .freepass_app .fp_app_tab .price_b{margin-left:5px; font-family: NanumEB; color:#ff0000}
#cont .freepass_app .fp_app_tab .fp_app_tab_st{width:50%; text-align: left; padding-left:20px}
#cont .freepass_app .fp_app_tab .fp_app_tab_st .fp_sale{margin-left:5px; font-family: NanumEB; color:#ff0000}
#cont .freepass_app .fp_app_tab .btn_class_app{background: #0069b4; width:85px; height:33px; border-radius: 20px;; color: #fff}

#cont .freepass_app .freepass_box{padding:60px; border:solid 1px #d6d9db; margin-top:50px; display: flex; flex-wrap: wrap; justify-content: space-between}
#cont .freepass_app .freepass_box .fp_box_st{width:100%; display: block; text-align: center; font-size: 30px; letter-spacing: -2px}
#cont .freepass_app .freepass_box .fp_box_st .fp_box_st_ev{font-family: NanumEB}
#cont .freepass_app .freepass_box ul{margin-top:30px; box-sizing: border-box}
#cont .freepass_app .freepass_box ul>li{padding-left:60px; margin-top:30px}
#cont .freepass_app .freepass_box ul>li .fp_box_dd{font-size: 18px; display: block; font-family: NanumEB}
#cont .freepass_app .freepass_box ul>li .fp_box_em{font-size: 14px; display: block; margin-top:5px; letter-spacing: -1px; line-height: 20px;}
#cont .freepass_app .freepass_box ul>li.fp_box_li1{background: url(/images/fp_ico001.png) no-repeat}
#cont .freepass_app .freepass_box ul>li.fp_box_li2{background: url(/images/fp_ico002.png) no-repeat}
#cont .freepass_app .freepass_box ul>li.fp_box_li3{background: url(/images/fp_ico003.png) no-repeat}
#cont .freepass_app .freepass_box ul>li.fp_box_li4{background: url(/images/fp_ico004.png) no-repeat}
#cont .freepass_app .freepass_box ul>li.fp_box_li5{background: url(/images/fp_ico005.png) no-repeat}
#cont .freepass_app .freepass_box ul:nth-child(3){padding-left:30px}

/* 테이블 디자인 */
#cont .class_list{}
#cont .class_list h2{width:100%; height:55px; margin-top:75px; display: flex; justify-content: center; line-height: 55px;}
#cont .class_list h2 .title_ico{width:60px; height:55px; background: url(/images/title_ico.png) no-repeat}
#cont .class_list h2 .title_tt{font-size: 36px; font-family: NanumH; letter-spacing: -2px;}
#cont .class_list .sub_tag{display: flex; flex-wrap: wrap; margin-top:15px;}
#cont .class_list .sub_tag dd{height:33px; line-height:33px; background: #edf0f2; border-radius:20px; margin:10px 10px 0 0}
#cont .class_list .sub_tag dd a{height:100%; padding:0 10px; font-size: 14px; display: block}
#cont .class_list .sub_tag dd:hover{background: #3badff}
#cont .class_list .sub_tag dd a:hover{color:#fff}
#cont .class_list .sub_tag dd.active{background: #3badff}
#cont .class_list .sub_tag dd.active a{color:#fff; font-family: NanumB}

#cont .class_list_tab{width:100%; margin-top:100px; font-size: 14px}
#cont .class_list_tab caption{font-family:NanumEB; text-align: left; font-size: 30px; padding-bottom:20px}
#cont .class_list_tab thead{width:100%; height:49px; line-height: 49px; margin-top:20px; background: #f3f6f8; border-top:solid 1px #d6d9db;}
#cont .class_list_tab thead>tr{}
#cont .class_list_tab thead>tr>th{font-family: Nanum; font-weight: normal}
#cont .class_list_tab tbody>tr>td{padding:20px 0; text-align: center; background: url(/images/tab_line.png) 0 100% repeat-x}
#cont .class_list_tab tbody>tr:hover{background: #fffdea}
#cont .class_list_tab .class_list_tab_st{text-align: left; padding-left:10px}

/* 즐겨 찾는 강좌 */
#cont .bookmark{}
#cont .bookmark button.btn_favdel{height:33px; background: #0069b4; border-radius: 20px; color: #fff; padding:0 20px}
#cont .bookmark .all_favdel{width:100%; text-align: right; display: block}
#cont .bookmark .all_favdel button.btn_all_favdel{
	height:33px; background: #213a4a; border-radius: 20px; color: #fff; padding:0 20px; margin:20px 0 0 10px;
}

/* 수강리스트 */
#cont .class_list{}
#cont .class_list button.btn_clcancle{height:33px; background: #0069b4; border-radius: 20px; color: #fff; padding:0 20px}
#cont .class_list .classlist_info{
	width:13px; height:13px; background: url(/images/classlist_info.png) no-repeat; display: inline-block; vertical-align: middle; margin-left:5px;
	overflow: hidden; text-indent: -9999px
}
#cont .class_list .classlist_info_box{
	position: absolute; border: solid 1px #d6d9db; padding:20px; text-align: left; line-height: 20px; box-sizing: border-box;
	border-radius: 5px; border-top-left-radius: 0; background: url(/images/box_point.png) no-repeat #fff
}

/*출석현황보기*/
#cont .attendance{margin-top:100px}
#cont .attendance .att_top{display: flex; justify-content: space-between}
#cont .attendance .att_top h2{font-size: 30px; font-family: NanumEB}
#cont .attendance .att_top dl{display: flex}
#cont .attendance .att_top dl>dd.att_tt{font-size: 30px; font-family: NanumEB; margin:0 20px}
#cont .attendance .att_top dl>dd button{width:80px; height:33px; border:solid 2px #000; border-radius: 20px; background: #fff; font-family: NanumB}
#cont .attendance .att_top .today button{width:80px; height:33px; background: #0069b4; border-radius: 20px; color: #fff}
#cont .attendance .att_top .today .btn_today{width:80px; height:33px; background: #0069b4; border-radius: 20px; color: #fff}
#cont .attendance .att_tab{width:100%; margin-top:20px}
#cont .attendance .att_tab th{
	height:50px; line-height: 50px; border-top:solid 1px #d6d9db; box-sizing: border-box; background: url(/images/att_line.png) 100% 0 repeat-y #f3f6f8; font-weight: normal}
#cont .attendance .att_tab td{height:120px; font-size: 12px}
#cont .attendance .att_tab td.today_chk{background: #fffdea}
#cont .attendance .att_tab td span.tab_wrap1{width:100%; height:100%; display: block; background: url(/images/att_line.png) 100% 0 repeat-y}
#cont .attendance .att_tab td:nth-last-child(1) span.tab_wrap1{background: none}
#cont .attendance .att_tab td:nth-last-child(n+7){color:#e74c3c}
#cont .attendance .att_tab td span.tab_wrap2{width:100%; height:100%; display: block; background: url(/images/tab_line.png) 0 100% repeat-x; padding:10px; box-sizing: border-box}
#cont .attendance .att_tab td span.today_chk{width:100%; height:100%; background: url(/images/stamp.png) 50% no-repeat; display: block}

/*출석 이벤트*/
#cont .attendance_event{display: flex; flex-wrap: wrap; margin-top:50px}
#cont .attendance_event .ev_roulette{width:50%; display:flex; justify-content: center}
#cont .attendance_event .ev_roulette .roulette_start{width:490px; height:490px; position: absolute; background: url(/images/roulette_start.png) no-repeat; z-index: 2; cursor: pointer; overflow: hidden; text-indent: -9999px}
#cont .attendance_event .ev_roulette .roulette_wrap{width:490px; height:490px; background: #0069b4; border-radius: 250px; padding:10px; box-sizing: border-box; position: relative}
#cont .attendance_event .ev_roulette .roulette_wrap .roulette_stop{
	width:40px; height:50px; background: url(/images/roulette_stop.png) no-repeat; position: absolute; top:-15px; left:225px; z-index: 1;  caret-color: transparent;
}
#cont .attendance_event .ev_roulette .roulette_wrap .roulette_cha{
	width:156px; height:154px; background: url(/images/roulette_cha.png) no-repeat; position: absolute; top:167px; left:169px; z-index: 1;  caret-color: transparent;
}
#cont .attendance_event .ev_roulette .roulette_wrap .roulette_img{
	width:470px; height:470px; background: url(/images/roulette2.png) no-repeat; overflow: hidden; text-indent: -9999px;
	/*animation: roulette_img 3s ease; -webkit-animation-fill-mode:both*/
}
#cont .attendance_event .ev_calendar{width:50%}
#cont .attendance_event .ev_calendar h3{text-align: center}
#cont .attendance_event .ev_calendar table{width:100%; margin-top:15px}
#cont .attendance_event .ev_calendar th{width:calc(100% / 7); height:50px; line-height: 50px; background: url(/images/att_line.png) #f3f6f8 repeat-y; border-top:solid 1px #d6d9db; font-size: 12px; font-weight: 400}
#cont .attendance_event .ev_calendar th:nth-of-type(1){background: #f3f6f8}
#cont .attendance_event .ev_calendar td span{
	height:71px; display: block; padding:10px; box-sizing: border-box; background: url(/images/att_line.png) repeat-y, url(/images/tab_line.png) repeat-x; font-size: 12px
}
#cont .attendance_event .ev_calendar td:nth-of-type(1) span{background: url(/images/tab_line.png) repeat-x}
#cont .attendance_event .ev_calendar tr:nth-of-type(1)>td span{background: url(/images/att_line.png) repeat-y}
#cont .attendance_event .ev_calendar tr:nth-of-type(1)>td:nth-of-type(1) span{background: none}
#cont .attendance_event .ev_calendar td.att_chk{background: url(/images/att_chk.png) 70% 70% no-repeat}

#cont .attendance_event .ev_notice{width:50%; font-size: 14px; margin-top:80px; line-height: 24px}
#cont .attendance_event .ev_notice ul{}
#cont .attendance_event .ev_notice ul>li{background: url(/images/list_st.png) 0 11px no-repeat; padding:0 0 0 10px}
#cont .attendance_event .ev_event{width:50%; margin-top:50px}
#cont .attendance_event .ev_event ul{display: flex; justify-content: space-between}
#cont .attendance_event .ev_event ul>li{width:180px; height:175px; box-sizing: border-box; border:solid 1px #0069b4; background: #f3f6f8; text-align: center; padding:30px 0 0 0; font-size: 18px}
#cont .attendance_event .ev_event ul>li span{display: block; font-family: NanumB; letter-spacing: -1px}
#cont .attendance_event .ev_event ul>li span.mypt001{width:100%; height:40px; background: url(/images/mypt100.png) 50% 50% no-repeat; text-indent: -9999px; overflow: hidden; margin-top:10px;}
#cont .attendance_event .ev_event ul>li span.mypt002{width:100%; height:40px; background: url(/images/mypt300.png) 50% 50% no-repeat; text-indent: -9999px; overflow: hidden; margin-top:10px;}
#cont .attendance_event .ev_event ul>li span.mypt003{width:100%; height:40px; background: url(/images/mypt_gift.png) 50% 50% no-repeat; text-indent: -9999px; overflow: hidden; margin-top:10px;}
#cont .attendance_event .ev_event ul>li button{display: block; font-size: 14px; background: #213a4a; padding:10px 15px; color: #fff; border-radius: 20px; margin:15px auto 0 auto; font-family: NanumB}

/* 휴학/복학하기 */
#cont .rest{}
#cont .rest .rest_tt{padding:20px 0; display: block; line-height: 24px; font-size: 14px}
#cont .rest_box{background: #f3f6f8; padding:50px 100px; margin-top:50px}
#cont .rest_box .rest_box_st{width:100%; display: block; text-align: center; padding-bottom:20px; font-size: 18px; font-family: NanumB}
#cont .rest_box .resr_box_tab{background: #fff; padding:50px; box-sizing: border-box; margin: 0 auto; border-radius: 15px}
#cont .rest_box .resr_box_tab .class_list_tab{margin:0}
#cont .rest_box .resr_box_tab .btn_rest_set{width:100%; display: block; text-align: center; margin-top:40px}
#cont .rest_box .resr_box_tab .btn_rest_set button.btn_rest{height:40px; background: #0069b4; padding:0 20px; color: #fff; border-radius: 20px}

#cont .pop_rest{width:100%; height:100%; position:fixed; background: rgba(0,0,0,0.8); top:0; left:0; display: none}
#cont .pop_rest .pop_rest_wrap{width:460px; background: #fff; padding:40px; margin: calc(10% + 80px) auto; border-radius: 15px; font-size: 18px}
#cont .pop_rest .pop_rest_wrap .prest_st{display: block}
#cont .pop_rest .pop_rest_wrap .prest_dd{display: block; padding:80px 0; text-align: center; font-family: NanumB}

/* 수강신청 */
#cont .app_step{display: flex; margin-top:33px}
#cont .app_step li{width:240px; height:142px; background: url(/images/app_step_arrow.png) 87% 50% no-repeat}
#cont .app_step li:nth-last-child(1){background: none}
#cont .app_step li .as_circle{
	width:142px; height:142px; border-radius: 71px; display: block; text-align: center; padding-top:100px; box-sizing: border-box; font-family: NanumB; letter-spacing: -1px; font-size: 14px
}
#cont .app_step li:nth-child(1) .as_circle{background: url(/images/app_step1.png) #f3f6f8 55% 40% no-repeat}
#cont .app_step li:nth-child(2) .as_circle{background: url(/images/app_step2.png) #f3f6f8 50% 40% no-repeat}
#cont .app_step li:nth-child(3) .as_circle{background: url(/images/app_step3.png) #f3f6f8 47% 40% no-repeat}
#cont .app_step li:nth-child(1).as_active .as_circle{background: url(/images/app_step1_on.png) #0069b4 55% 40% no-repeat; color: #fff}
#cont .app_step li:nth-child(2).as_active .as_circle{background: url(/images/app_step2_on.png) #0069b4 50% 40% no-repeat; color: #fff}
#cont .app_step li:nth-child(3).as_active .as_circle{background: url(/images/app_step3_on.png) #0069b4 47% 40% no-repeat; color: #fff}

#cont .app_tab{}
#cont .app_tab{width:100%; margin-top:100px; font-size: 14px}
#cont .app_tab caption{font-family:NanumB; text-align: left; font-size: 18px; padding-bottom:20px}
#cont .app_tab tr>th{width:120px; font-family: Nanum; font-weight: normal; background: url(/images/tab_line.png) 0 100% #f3f6f8 repeat-x;}
#cont .app_tab tr:nth-child(1){border-top:solid 1px #d6d9db}
#cont .app_tab tr>td{padding:20px 0; background: url(/images/tab_line.png) 0 100% repeat-x; text-align: left; padding-left:20px; box-sizing: border-box}
#cont .app_tab tr:nth-last-child(1)>th{background: #f3f6f8; border-bottom:solid 1px #d6d9db}
#cont .app_tab tr:nth-last-child(1)>td{background: none; border-bottom:solid 1px #d6d9db}

#cont .app_tt{}
#cont .app_tt dl{margin-top:45px}
#cont .app_tt dt{font-size: 14px; font-family: NanumB; margin-bottom:5px}
#cont .app_tt dd{font-size: 14px; line-height: 20px}
#cont .app_tt .appbr{display: block; margin-left:10px}
#point-cancel{padding:5px 10px; background: #0069b4; margin-left:10px; border-radius: 20px; color: #fff}

#cont .app_tab .pt_wrap{display: flex}
#cont .app_tab .pt_set{width:195px; height:35px; background: #f3f6f8; border-radius: 10px; display: flex}

#cont .app_tab .pt_set input.pt_inp{
	width:147px; height:35px; background: rgba(0,0,0,0); text-indent: 10px; outline: none; border-top-left-radius: 10px; border-bottom-left-radius: 10px;
	box-sizing: border-box; border: solid 1px rgba(0,0,0,0)
}
#cont .app_tab .pt_set input.pt_inp:focus{border:solid 1px #0069b4}
#cont .app_tab .pt_set .btn_pt{width:48px; height:35px; background: #0069b4; color: #fff; border-top-right-radius: 10px; border-bottom-right-radius: 10px;}
#cont .app_tab .pt_tt{line-height: 35px; text-indent: 20px}


#cont .app_tab .pay_select_box{display: flex}
#cont .app_tab .pay_select_box .circjk{width:18px; height:18px; background: #777; border-radius: 9px; display: inline-block; margin-right:5px; vertical-align: middle}
#cont .app_tab .pay_select_box input.inp_app_pay{display: none}
#cont .app_tab .pay_select_box input.inp_app_pay+label.to_app_pay{
	cursor: pointer; caret-color: transparent;
	/*width:18px; height:18px; background: #777; border-radius: 9px; display: inline-block;*/
}
#cont .app_tab .pay_select_box input.inp_app_pay:checked+label.to_app_pay span.circjk{
	width:18px; height:18px; background: #0069b4; border-radius: 9px; display: inline-block;
}
#cont .app_tab .pay_select_box label.to_app_pay{vertical-align: middle}
#cont .app_tab .pay_select_box .pay_wrap{display: block; margin-right:20px}
#cont .app_tab .pay_sale{color:#FF0000; font-family: NanumH}


/* 플레이어 */
#ply_cont{display: flex; justify-content: center}

/*플레이어-리스트*/
#ply_cont .ply_list{height:100%; padding:20px 20px 0 0}
#ply_cont .ply_list dl{}

#ply_full .ply_info dl.ply_list{width:100%; height:457px; padding:0 0 0 20px; overflow-y: scroll; margin-top:20px}
#ply_full .ply_info dl.ply_list::-webkit-scrollbar{width:5px;}
#ply_full .ply_info dl.ply_list::-webkit-scrollbar-thumb{background: #d6d9db; border-radius:5px}

.ply_list{max-width:400px}
.ply_list dd{padding:7px; display: flex; line-height: 20px; border-bottom:solid 1px #eee}
.ply_list dd a{font-size: 14px}
.ply_list dd:hover{font-weight: 800}
.ply_list dd.chk{background: #f3f6f8}
.ply_list dd.chk a{color:#777}
.ply_list dd.ply_act{font-weight: 800}


#ply_cont .ply_info{padding:20px}

/*플레이어-플레이어바*/
.play_bar{padding:20px 20px 30px 20px; background: #1e242c; position: relative;display:block; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; user-select: none}
.play_bar .pro_bar{cursor: pointer; position:relative; color: #fff; margin-bottom:20px}
.play_bar .pro_bar .pro_point{width:12px; height:12px; background: rgba(255,255,255,0); border-radius:6px; position: absolute; margin:-4px 0 0 -6px; z-index: 99999; transition: background .3s ease;}
.play_bar .pro_bar .pro_prog{width:100%; height:4px; background: rgba(255,255,255,.5); border-radius: 2px}
.play_bar .pro_bar .pro_prog .pro_prog_ing{height:4px; background: #fff; display: block; border-radius: 2px}

.play_bar em{display: none}
.play_bar ul{display: flex; font-size: 12px}
.play_bar ul>li{}
.play_bar ul.play_bar_left{position: absolute;}
.play_bar ul.play_bar_right{position: absolute; bottom:20px; right:20px}
.play_bar .plybar_play{width:40px; height:40px; background: url(../images/ply_play.png) 50% no-repeat; text-indent: -9999px; overflow: hidden; cursor: pointer}
.play_bar .plybar_play:hover{background: url(../images/ply_play.png) 50% no-repeat rgba(255,255,255,.1); border-radius: 20px; transition: background .5s ease;}

.play_bar .plybar_pause{width:40px; height:40px; background: url(../images/ply_pause.png) 50% no-repeat; text-indent: -9999px; overflow: hidden; cursor: pointer}
.play_bar .plybar_pause:hover{background: url(../images/ply_pause.png) 50% no-repeat rgba(255,255,255,.1); border-radius: 20px; transition: background .5s ease;}


.play_bar .plybar_next{width:40px; height:40px; background: url(../images/ply_next.png) 50% no-repeat; cursor: pointer}
.play_bar .plybar_next:hover{background: url(../images/ply_next.png) 50% no-repeat rgba(255,255,255,.1); border-radius: 20px; transition: background .5s ease;}
.play_bar .plybar_next em{
	width:60px; height:25px; line-height: 25px; position: absolute; background: #fff; font-size: 12px; margin:-35px 0 0 -28px;
	border-radius: 20px; text-align: center; border: solid 2px #1e242c
}
.play_bar .plybar_sound{width:40px; height:40px; background: url(../images/ply_sound.png) 50% no-repeat; cursor: pointer}
.play_bar .plybar_sound:hover{background: url(../images/ply_sound.png) 50% no-repeat rgba(255,255,255,.1); border-radius: 20px; transition: background .5s ease;}
.play_bar .plybar_sound em{
	width:60px; height:25px; line-height: 25px; position: absolute; background: #fff; font-size: 12px; margin:-35px 0 0 -25px;
	border-radius: 20px; text-align: center; border: solid 2px #1e242c
}
.play_bar .plybar_son_mute{background: url(../images/ply_sound_mute.png) 50% no-repeat}
.play_bar .plybar_son_mute:hover{background: url(../images/ply_sound_mute.png) 50% no-repeat rgba(255,255,255,.1); border-radius: 20px; transition: background .5s ease;}

.plybar_sound_warp{width:30px; transition: width .3s ease; overflow: hidden}
.play_bar .plybar_sodbar_wrap{width:50px; position: relative; cursor:pointer; margin:-28px 0 0 40px; padding:6px 0}
.play_bar .plybar_sodbar_wrap .plybar_sodbar{width:50px; height:4px; background: rgba(255,255,255,0.5); border-radius: 2px; overflow: hidden; text-indent: -9999px}
.play_bar .plybar_sodbar_wrap .plybar_sodbar em{background: #fff; display: block}
.play_bar .plybar_sodbar_wrap .plybar_sodpoint{
	width:12px; height:12px; background: rgba(255,255,255,0); border-radius: 6px; position: absolute; margin-top:-4px; text-indent: -9999px; transition: background .3s ease;
}

.play_bar .plybar_time{line-height: 20px; color: #fff; margin:10px 0 0 20px; outline: none;}

.play_bar dl.plybar_speed{display: flex; justify-content: center; margin:30px 0 0 0}
.play_bar dl.plybar_speed dd{padding:4px; cursor: pointer; outline: none;}
.play_bar dl.plybar_speed dd span{width:12px; height:12px; display: block; background: rgba(255,255,255,.5); border-radius: 6px; outline: none;}
.play_bar dl.plybar_speed dd span:hover{animation-duration: .3s;  animation-name: slidein;}
@keyframes slidein {
  from {transform: scale(1.5);}
  to {transform: scale(1);}
}
.play_bar dl.plybar_speed dd span:hover+em{
display:block
}
.play_bar dl.plybar_speed dd.active span{background: rgba(255,255,255,1)}
.play_bar dl.plybar_speed dd span>em{
	width:60px; height:25px; line-height: 25px; position: absolute; background: #fff; font-size: 12px; margin:-39px 0 0 -28px;
	border-radius: 20px; text-align: center; border: solid 2px #1e242c; outline: none; z-index: 2
}

.play_bar .plybar_help{width:40px; height:40px; background: url(../images/ply_help.png) 50% no-repeat; cursor: pointer}
.play_bar .plybar_help:hover{background: url(../images/ply_help.png) 50% no-repeat rgba(255,255,255,.1); border-radius: 20px; transition: background .5s ease;}
.play_bar .plybar_help em{
	width:60px; height:25px; line-height: 25px; position: absolute; background: #fff; font-size: 12px; margin:-35px 0 0 -12px;
	border-radius: 20px; text-align: center; border: solid 2px #1e242c; outline: none; z-index: 2
}

.play_bar .plybar_wide{width:40px; height:40px; background: url(../images/ply_wide.png) 50% no-repeat; cursor: pointer}
.play_bar .plybar_wide:hover{background: url(../images/ply_wide.png) 50% no-repeat rgba(255,255,255,.1); border-radius: 20px; transition: background .5s ease;}
.play_bar .plybar_wide em{
	width:60px; height:25px; line-height: 25px; position: absolute; background: #fff; font-size: 12px; margin:-35px 0 0 -12px;
	border-radius: 20px; text-align: center; border: solid 2px #1e242c; outline: none; z-index: 2
}

.play_bar .plybar_default{width:40px; height:40px; background: url(../images/ply_wide_m.png) 50% no-repeat; cursor: pointer}
.play_bar .plybar_default:hover{background: url(../images/ply_wide_m.png) 50% no-repeat rgba(255,255,255,.1); border-radius: 20px; transition: background .5s ease;}
.play_bar .plybar_default em{
	width:85px; height:25px; line-height: 25px; position: absolute; background: #fff; font-size: 12px; margin:-35px 0 0 -25px;
	border-radius: 20px; text-align: center; border: solid 2px #1e242c; outline: none; z-index: 2
}

.play_bar .plybar_max{width:40px; height:40px; background: url(../images/ply_max.png) 50% no-repeat; cursor: pointer}
.play_bar .plybar_max:hover{background: url(../images/ply_max.png) 50% no-repeat rgba(255,255,255,.1); border-radius: 20px; transition: background .5s ease;}
.play_bar .plybar_max em{
	width:60px; height:25px; line-height: 25px; position: absolute; background: #fff; font-size: 12px; margin:-35px 0 0 -12px;
	border-radius: 20px; text-align: center; border: solid 2px #1e242c; outline: none; z-index: 2
}
/* 플레이어-썸네일 */
#ply_cont .ply_info .thumb_box{width:1280px; height:720px; display: block; position: relative}
#ply_cont .ply_info .thumb_box .thumb_tt{
	height:50px; line-height: 50px; position: absolute; top:40px; right:40px; background: #0069b4; padding:0 50px; border-radius: 30px; color: #fff; font-family:  NanumB
}
#ply_cont .ply_info .thumb_box .thumb_img{}

/*플레이어-동영상*/
#ply_cont .ply_info .ply_mov{display:inline-block}
#ply_full .ply_mov{background: #000}
#ply_full .ply_mov .ply_mov_wrap{}
/*#ply_full .ply_mov .ply_mov_wrap video{width:100%; max-width:1380px}*/

/*플레이어-강좌정보*/
#ply_cont .ply_info .ply_set{}
#ply_full .ply_info{max-width:1280px; display: flex; justify-content: space-between; margin: 0 auto}
#ply_full .ply_info .ply_set{width:70%}
 .ply_sample{position: absolute; width:100%; height:50px; line-height: 50px; text-align: center; background: rgba(0,105,180,0.8); color: #fff}

.ply_info .st_wrap{display: flex}
.ply_info .st_wrap .itgo_pro{width:78px; height:78px; border-radius: 39px; border-radius: 40px; overflow: hidden; display: block; cursor: pointer}
.ply_info .st_wrap .itgo_pro .tea_pop{border:solid 1px #d6d9db; position: absolute; font-size: 14px; border-radius: 5px; background: #fff; margin:60px 0 0 -16px;display:none}
.ply_info .st_wrap .itgo_pro .tea_pop .tea_pop_wrap{display: block; position: relative; line-height: 24px;}
.ply_info .st_wrap .itgo_pro .tea_pop .pop_point{width:10px; height:10px; background: url(/images/pop_point.png) no-repeat; position: absolute; left:-1px; top:-1px}
.ply_info .st_wrap .itgo_pro .tea_pop .tea_pop_wrap .pop_box{}
.ply_info .st_wrap .itgo_pro .tea_pop .tea_pop_wrap .pop_box .pop_box_st{
	height:40px; line-height: 40px; background: #f3f6f8; padding:0 20px; display: block; border-top-left-radius: 5px; border-top-right-radius: 5px}
.ply_info .st_wrap .itgo_pro .tea_pop .tea_pop_wrap .pop_box ul{padding:20px}
.ply_info .st_wrap .itgo_pro .tea_pop .tea_pop_wrap .pop_box ul>li{}

.ply_info .st_wrap h2{font-size: 18px; padding:15px 0 0 15px; line-height: 24px}
.ply_info .st_wrap h2 .st_tea{font-size: 14px; font-weight: 400}
.ply_info .st_wrap button{margin:10px 0 0 5px}
.ply_info .st_wrap .btn_fav{width:113px; min-width:113px; height:33px; background: #fff; border:solid 2px #d6d9db; border-radius: 20px}
.ply_info .st_wrap .btn_fav.atvice{background: #0069b4; color:#fff;border: solid 2px #0069b4;}
.ply_info .st_wrap .fav_pop{border:solid 1px #d6d9db; position: absolute; font-size: 14px; border-radius: 5px; background: #fff; margin:33px 0 0 -12px;display:none}
.ply_info .st_wrap .fav_pop .fav_pop_wrap{padding:20px; display: block; position: relative; line-height: 24px;}
.ply_info .st_wrap .fav_pop .pop_point{width:10px; height:10px; background: url(/images/pop_point.png) no-repeat; position: absolute; left:-1px; top:-1px}
.ply_info .st_wrap .btn_doc{width:81px; min-width:81px; height:33px; background: #0069b4; color:#fff; border-radius: 20px}


.ply_info .tag_wrap{display: flex; justify-content: right; padding-top:15px}
.ply_info .tag_wrap dl{display: flex}
.ply_info .tag_wrap dl>dd{margin:0 10px 0 0}
.ply_info .tag_wrap dl>dd a{font-size:14px; padding:0 10px}
.ply_info .class_code{text-align: right; background: #f3f6f8; height:30px; line-height: 30px; border-radius: 15px; padding:0 10px; font-size: 14px}

.ply_info .ply_tab{width:100%; margin-top:30px; font-size: 14px; border-top:solid 1px #d6d9db}
.ply_info .ply_tab tr>th{padding:0 10px; font-weight: 400; background:url(/images/tab_line.png) 0 100% repeat-x #f3f6f8}
.ply_info .ply_tab tr>td{padding:15px 20px; background:url(/images/tab_line.png) 0 100% repeat-x}
.ply_info .ply_tab tr:nth-last-child(1)>th{background-image: none; border-bottom:solid 1px #d6d9db}
.ply_info .ply_tab tr:nth-last-child(1)>td{background-image: none; border-bottom:solid 1px #d6d9db}
.ply_info .ply_tab button{width:85px; height:33px; border-radius: 20px; margin-left:5px}
.ply_info .ply_tab .ply_on{background: #0069b4; color: #fff}
.ply_info .ply_tab .class_cer{}
.ply_info .ply_tab .class_cer .cer_pop{border:solid 1px #d6d9db; position: absolute; font-size: 14px; border-radius: 5px; background: #fff; margin:23px 0 0 -11px;display:none}
.ply_info .ply_tab .class_cer .cer_pop .cer_pop_wrap{padding:20px; display: block; position: relative; line-height: 24px;}
.ply_info .ply_tab .class_cer .cer_pop .pop_point{width:10px; height:10px; background: url(/images/pop_point.png) no-repeat; position: absolute; left:-1px; top:-1px}

.ply_info .ply_note{background: #f3f6f8; border-radius: 15px; padding:20px; margin-top:50px; font-size: 14px; line-height: 20px}
.ply_info .ply_note dt{font-family: NanumB; margin-bottom:10px}

#ply_mov_basic{position: relative}

/* 결제 */
.pay_set{width:100%; background: #eee; bottom:0; position: fixed; display: flex; justify-content: space-between; padding:20px 0; z-index: 1}
.pay_set .itgo_cha_set{position: absolute; top:-137px; right:250px}
.pay_set .itgo_cha_set .itgo_cha_wrap{position: relative}
.pay_set .itgo_cha_set .itgo_cha1{
	position: absolute; width:121px; height:116px; background: url(/images/itgo_cha_face.gif) no-repeat; display: block; left:0; top:0;
	animation-name: itgo_face; animation-duration: 3s; animation-iteration-count: infinite; animation-timing-function: ease-in-out;
}
.pay_set .itgo_cha_set .itgo_cha2{
	position: absolute; width:72px; height:66px; background: url(/images/itog_cha_hand.png) no-repeat;
	display: block; left:75px; top:65px;
	animation-name: itgo_hello; animation-duration: 2s; animation-iteration-count: infinite; animation-timing-function: ease-in-out;
}
@keyframes itgo_face{
	0% {
		transform: rotate(0deg);
		transform-origin: bottom center;
	}
	25% {
		transform: rotate(-2deg);
		transform-origin: bottom center;
	}
	50% {
		transform: rotate(0deg);
		transform-origin: bottom center;
	}
	75% {
		transform: rotate(1deg);
		transform-origin: bottom center;
	}
	100% {
		transform: rotate(0deg);
		transform-origin: bottom center;
	}
}

@keyframes itgo_hello{
	0% {
		transform: rotate(-5deg);
		transform-origin: bottom left;
	}
	50% {
		transform: rotate(10deg);
		transform-origin: bottom left;
	}
	100% {
		transform: rotate(-5deg);
		transform-origin: bottom left;
	}
}
.pay_set .itgo_cha_set .itgo_cha3{position: absolute; width:87px; height:32px; background: url(/images/itog_cha_body.png) no-repeat; display: block; left:0; top:116px}
.pay_set .pay_tt{padding:10px 10%; font-size: 18px; font-family: NanumB; position: relative}
.pay_set .pay_tt .itgo_cha{width:54px; height:53px; background: url(/images/itgo_cha_free.png) no-repeat; display: block; position: absolute; top:-10px; margin-left:-64px}
.pay_set .pay_tt em{color:#0069b4; font-family: NanumEB}
.pay_set .pay_app{display: flex; padding-right:20px}
.pay_set .pay_app li{}
.pay_set .pay_app li button{min-width:135px; height:40px; border-radius: 20px; margin-left:10px; padding:0 20px}
.pay_set .pay_app li button.btn_payapp{background: rgba(0,0,0,0); border: solid 2px #0069b4; color: #0069b4; font-family: NanumB}
.pay_set .pay_app li button.btn_payfree{background: #0069b4; color: #fff}

.qna_set{position: fixed; right:80px; bottom:80px; display: none}
.qna_set .qna_set_wrap{position: relative}
.qna_set .qna_cha{width:59px; height:59px; display: block; background: url(/images/join_cha.png) no-repeat; position: absolute}
.qna_set .qna_pop{width:42px; height:42px; background: #000; position: absolute;
	z-index: -1; margin:-25px 0 0 22px; border-radius: 21px; color: #fff; font-size: 12px; padding:7px; box-sizing: border-box; text-align: center
}

/* 고객센터 */
/* 고객센터-공지사항 */
#cont .sub_menu{display: flex; flex-wrap: wrap; margin-top:50px}
#cont .sub_menu dd{height:33px; line-height:33px; background: #edf0f2; border-radius:20px; margin:10px 10px 0 0}
#cont .sub_menu dd a{height:100%; padding:0 20px; font-size: 14px; display: block}
#cont .sub_menu dd:hover{background: #3badff}
#cont .sub_menu dd a:hover{color:#fff}
#cont .sub_menu dd.active{background: #3badff}
#cont .sub_menu dd.active a{color:#fff; font-family: NanumB}

#cont .notice{}
#cont .notice .notice_tab{width:100%; margin-top:30px; font-size: 14px}
#cont .notice .notice_tab thead{width:100%; height:49px; line-height: 49px; margin-top:20px; background: #f3f6f8; border-top:solid 1px #d6d9db;}
#cont .notice .notice_tab thead>tr{}
#cont .notice .notice_tab thead>tr>th{font-family: Nanum; font-weight: normal}
#cont .notice .notice_tab tbody>tr>td{padding:20px 0; text-align: center; background: url(/images/tab_line.png) 0 100% repeat-x}
#cont .notice .notice_tab tbody>tr:hover{background: #fffdea}
#cont .notice .notice_tab .notice_tab_st{text-align: left; padding-left:10px}
#cont .notice .notice_btn_set{display: flex; justify-content: center; margin-top: 100px}
#cont .notice .notice_btn_set .notice_btn{width:135px; height:40px; background: #0069b4; color: #fff; border-radius: 20px; margin:0 15px}
#cont .notice .notice_btn_set .notice_inp{width:60px; height:40px; border:solid 1px #d6d9db; border-radius: 20px; text-align: center}
#cont .notice .notice_btn_set .notice_inp:focus{outline: none; border: solid 1px #0069b4}
#cont .notice .notice_btn_set .notice_tt{height:40px; line-height: 40px; margin-left:10px}

#cont .notice .notice_read{}
#cont .notice .notice_read dt{font-size: 18px; font-family: NanumB; margin-top:50px}
#cont .notice .notice_read dd{}
#cont .notice .notice_read .notice_date{
	width:100%; height:50px; line-height: 50px; background: #f3f6f8; border-top:solid 1px #d6d9db; box-sizing: border-box; text-align: right; font-size: 14px; padding:0 30px 0 0;
	margin:15px 0;
}
#cont .notice .notice_read .notice_cont{line-height: 24px; font-size: 14px}

/* 마이포인트 */
#cont .point{}
#cont .point .point_wrap{margin-top:30px}
#cont .point .mypoint{display: flex}
#cont .point .mypoint .mypoint01{width:277px; height:174px; border:solid 1px #d6d9db; border-radius: 15px; text-align: center; box-sizing: border-box; position: relative;}
#cont .point .mypoint .mypoint01 dl{}
#cont .point .mypoint .mypoint01 dl>dt{margin-top:35px; font-family: NanumB}
#cont .point .mypoint .mypoint01 dl>dd{}
#cont .point .mypoint .mypoint01 dl>dd:nth-of-type(1){font-family: NanumEB; font-size: 36px; letter-spacing: -3px; color: #0069b4; margin-top:10px;}
#cont .point .mypoint .mypoint01 dl>dd:nth-of-type(1) em{font-size: 14px;}
#cont .point .mypoint .mypoint01 dl>dd:nth-of-type(2){
	width:100%; height:39px; line-height: 39px; position: absolute; bottom:0; background: #f3f6f8; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; font-size: 14px; letter-spacing: -1px
}
#cont .point .mypoint .mypoint02{padding:40px 0 0 40px}
#cont .point .mypoint .mypoint02 dl{}
#cont .point .mypoint .mypoint02 dl>dt{font-size: 14px; font-family: NanumB; margin-bottom:10px}
#cont .point .mypoint .mypoint02 dl>dd{font-size: 14px; line-height: 20px}
#cont .point .point_tip{padding:50px 0 0 0; text-align: center; font-size: 14px}
#cont .point .point_tip .point_allpt{display: block; font-size: 16px; font-family: NanumEB}
#cont .point .point_tab{width:100%; margin-top:30px; font-size: 14px}
#cont .point .point_tab thead{width:100%; height:49px; line-height: 49px; margin-top:20px; background: #f3f6f8; border-top:solid 1px #d6d9db;}
#cont .point .point_tab thead>tr{}
#cont .point .point_tab thead>tr>th{font-family: Nanum; font-weight: normal}
#cont .point .point_tab thead>tr>th:nth-of-type(1){width:150px}
#cont .point .point_tab thead>tr>th:nth-of-type(2){width:80px}
#cont .point .point_tab thead>tr>th:nth-of-type(3){}
#cont .point .point_tab thead>tr>th:nth-of-type(4){width:150px}
#cont .point .point_tab thead>tr>th:nth-of-type(5){width:150px}
#cont .point .point_tab tbody>tr>td{padding:20px 0; text-align: center; background: url(/images/tab_line.png) 0 100% repeat-x}
#cont .point .point_tab tbody>tr:hover{background: #fffdea}
#cont .point .point_tab .point_tab_st{text-align: left; padding-left:10px}
#cont .point .point_tab .pt_save{font-family: NanumEB; color: #0069b4}
#cont .point .point_btn_set{display: flex; justify-content: center; margin-top: 100px}
#cont .point .point_btn_set .point_btn{width:135px; height:40px; background: #0069b4; color: #fff; border-radius: 20px; margin:0 15px}
#cont .point .point_btn_set .point_inp{width:60px; height:40px; border:solid 1px #d6d9db; border-radius: 20px; text-align: center}
#cont .point .point_btn_set .point_inp:focus{outline: none; border: solid 1px #0069b4}
#cont .point .point_btn_set .point_tt{height:40px; line-height: 40px; margin-left:10px}

/* 고객센터-FAQ */
#cont .faq{}
#cont .faq .faq_title{display: flex; justify-content: space-between; width:100%; height:49px; background: #f3f6f8; border-top:solid 1px #d6d9db; box-sizing: border-box; margin-top:30px}
#cont .faq .faq_title dd{width:10%; text-align: center; line-height: 49px; font-size: 14px}
#cont .faq .faq_title dd:nth-child(1){width:80%;}
#cont .faq .faq_cont{}
#cont .faq .faq_cont li{}
#cont .faq .faq_cont li:hover{background: url(/images/tab_line.png) 0 100% repeat-x #fffdea;}
#cont .faq .faq_cont .faq_list_q{background: url(/images/tab_line.png) 0 100% repeat-x; padding:18px 0; font-size: 14px; display: flex}
#cont .faq .faq_cont .faq_list_q span{width:10%; display: block; text-align: center}
#cont .faq .faq_cont .faq_list_q span:nth-child(2){width:80%; text-align: left; line-height: 20px}
#cont .faq .faq_cont .faq_list_a{padding: 30px; background: #f3f6f8; font-size: 14px; line-height: 20px}
#cont .faq .faq_btn_set{display: flex; justify-content: center; margin-top: 100px}
#cont .faq .faq_btn_set .faq_btn{width:135px; height:40px; background: #0069b4; color: #fff; border-radius: 20px; margin:0 15px}
#cont .faq .faq_btn_set .faq_inp{width:60px; height:40px; border:solid 1px #d6d9db; border-radius: 20px; text-align: center}
#cont .faq .faq_btn_set .faq_inp:focus{outline: none; border: solid 1px #0069b4}
#cont .faq .faq_btn_set .faq_tt{height:40px; line-height: 40px; margin-left:10px}

/* 고객센터-증빙서류발급안내 */
#cont .doc_app{}
#cont .doc_app ul{}
#cont .doc_app ul>li{}
#cont .doc_app{}
#cont .doc_app h3{margin-top:50px}
#cont .doc_app .doc_tt_wrap{display: block; line-height: 24px; margin-top:10px; font-size: 14px; padding-left:10px; background: url(/images/doc_st.gif) 0 10px no-repeat}

/* 고객센터-1:1문의 */
#cont .inquiry{}
#cont .inquiry .inquiry_tab{width:100%; margin-top:30px; font-size: 14px}
#cont .inquiry .inquiry_tab thead{width:100%; height:49px; line-height: 49px; margin-top:20px; background: #f3f6f8; border-top:solid 1px #d6d9db;}
#cont .inquiry .inquiry_tab thead>tr{}
#cont .inquiry .inquiry_tab thead>tr>th{font-family: Nanum; font-weight: normal}
#cont .inquiry .inquiry_tab tbody>tr>td{padding:20px 0; text-align: center; background: url(/images/tab_line.png) 0 100% repeat-x}
#cont .inquiry .inquiry_tab tbody>tr:hover{background: #fffdea}
#cont .inquiry .inquiry_tab .notice_act td{font-family: NanumEB}
#cont .inquiry .inquiry_tab .notice_act td:nth-child(2){font-family: NanumEB; color: #ff0000}
#cont .inquiry .inquiry_tab .notice_act td.inquiry_tab_st a{font-family: NanumEB}
#cont .inquiry .inquiry_tab td.inquiry_tab_st{text-align: left}

#cont .inquiry .inquiry_read{}
#cont .inquiry .inquiry_read dt{font-size: 18px; font-family: NanumB; margin-top:50px}
#cont .inquiry .inquiry_read dd{}
#cont .inquiry .inquiry_read dd.inquiry_info{
	width:100%; height:50px; line-height: 50px; background: #f3f6f8; border-top:solid 1px #d6d9db; box-sizing: border-box; font-size: 14px; 			
	padding:0 30px;	margin:15px 0; display: flex; justify-content: space-between
}
#cont .inquiry .inquiry_read dd.inquiry_info ul{display: flex}
#cont .inquiry .inquiry_read dd.inquiry_info ul>li{margin-right:20px}
#cont .inquiry .inquiry_read dd.inquiry_cont{line-height: 24px; font-size: 14px;}
#cont .inquiry .inquiry_read dd.inquiry_answer{line-height: 24px; font-size: 14px; margin-top:20px; padding-top:20px; background: url(/images/tab_line.png) repeat-x}
#cont .inquiry .inquiry_read dd.inquiry_btn_set{display: flex; justify-content:space-between; margin-top: 100px}
#cont .inquiry .inquiry_read dd.inquiry_btn_set .inquiry_btn_q{width:calc(50% + 100px); display: block; text-align: right}
#cont .inquiry .inquiry_read dd.inquiry_btn_set .inquiry_btn_q button.btn_inqq{width:100px; height:40px; background: #0069b4; color: #fff; border-radius: 20px}
#cont .inquiry .inquiry_read dd.inquiry_btn_set .inquiry_btn_mset{display: flex}
#cont .inquiry .inquiry_read dd.inquiry_btn_set .inquiry_btn_mset li{margin:0 0 0 10px}
#cont .inquiry .inquiry_read dd.inquiry_btn_set .inquiry_btn_mset li button{
	width:100px; height:40px; background: rgba(0,0,0,0); color: #0069b4; border-radius: 20px; border: solid 2px #0069b4; font-family: NanumB;
}
#cont .inquiry .inquiry_btn_wrap{width:100%; display: flex; margin-top:100px; justify-content: center}
#cont .inquiry .inquiry_btn_wrap .btn_inquiry{width:135px; height:40px; background: #0069b4; color: #fff; border-radius:20px}

#cont .inquiry .inquiry_box{background: #f3f6f8; padding:50px; border-radius: 15px; margin-top:20px}
#cont .inquiry .inquiry_box li.inquiry_wst{}
#cont .inquiry .inquiry_box li.inquiry_wst input[type=text]{width:100%; height:50px; border-radius: 15px; padding:0 20px; box-sizing: border-box; outline: none; border: solid 1px rgba(0,0,0,0)}
#cont .inquiry .inquiry_box li.inquiry_wst input[type=text]:focus{border:solid 1px #0069b4}
#cont .inquiry .inquiry_box .inq_t30{margin-top:30px}
#cont .inquiry .inquiry_box .inq_t30 input[type=text]{width:100%; height:50px; border-radius: 15px; padding:0 20px; box-sizing: border-box; outline: none; border: solid 1px rgba(0,0,0,0)}
#cont .inquiry .inquiry_box .inq_t30 input[type=text]:focus{border:solid 1px #0069b4}

#cont .inquiry .inquiry_box li.inquiry_wdd{margin-top:30px}
#cont .inquiry .inquiry_box li.inquiry_wdd textarea{width:100%; height:200px; border-radius: 15px; padding:20px; box-sizing: border-box; outline: none; border: solid 1px rgba(0,0,0,0)}
#cont .inquiry .inquiry_box li.inquiry_wdd textarea:focus{border:solid 1px #0069b4}
#cont .inquiry .inquiry_box li.inquiry_wdd textarea::-webkit-scrollbar{width:5px}
#cont .inquiry .inquiry_box li.inquiry_wdd textarea::-webkit-scrollbar-thumb{background: #d6d9db; border-radius:5px}

#cont .inquiry .inquiry_box li.inquiry_wfile{margin-top:20px; display: flex}
#cont .inquiry .inquiry_box li.inquiry_wfile input[type=text]{width:100%; height:50px; border-radius: 15px; padding:0 20px; box-sizing: border-box}
#cont .inquiry .inquiry_box li.inquiry_wfile .inq_file{display: none; width:0}
#cont .inquiry .inquiry_box li.inquiry_wfile .btn_inp_file{
	width:100px; height:50px; line-height: 50px; background: #0069b4; display: block; color: #fff; text-align: center; font-size: 14px;
	border-top-left-radius: 15px; border-bottom-left-radius: 15px; caret-color: transparent; cursor: pointer
}
#cont .inquiry .inquiry_box li.inquiry_wfile .inq_file_name{width:50%; padding-left:20px; border-top-right-radius: 15px; border-bottom-right-radius: 15px; background: #fff; caret-color: transparent;}
#cont .inquiry .inquiry_box .inq_inptt{width:100%; display: block; margin-bottom:13px}
#cont .inquiry .inquiry_box .inq_inptt em{background: #d6d9db; font-size: 12px; padding:3px 10px; border-radius: 10px; font-style: normal}
#cont .inquiry .inquiry_box .inquiry_wfile_btnset{display: flex; justify-content: space-between; margin-top:100px;}
#cont .inquiry .inquiry_box .inquiry_wfile_btnset button{}
#cont .inquiry .inquiry_box .inquiry_wfile_btnset li.btn_inqq2{width:calc(50% + 100px); display: block; text-align: right}
#cont .inquiry .inquiry_box .inquiry_wfile_btnset li.btn_inqq2 button{width:100px; height:40px; background: #0069b4; color: #fff; border-radius: 20px}
#cont .inquiry .inquiry_box .inquiry_wfile_btnset li.btn_inqlist button{
	width:100px; height:40px; background: #f3f6f8; color: #0069b4; border: solid 2px #0069b4; border-radius: 20px; font-family: NanumB;
}

/* 수강권 등록/자유이용권 구매 */
#cont .edu_app{}
#cont .edu_app .edu_p1{display: flex; flex-wrap: wrap; margin-top:50px}
#cont .edu_app h3.edu_p_st{width:100%; display: block}
#cont .edu_app .edu_p1 .edu_p_gr{width:412px; height:255px; background: url(/images/online_edu.png) no-repeat; margin-top:20px;}
#cont .edu_app .edu_p1 .class_p_gr{width:412px; height:255px; background: url(/images/online_class.png) 50% no-repeat; margin-top:20px;}
#cont .edu_app .edu_p_dd{margin:50px 0 0 50px}
#cont .edu_app .class_card{margin:40px 0 0 50px}
#cont .edu_app .edu_p1 .edu_p_dd .edu_p_inpset{display: flex}
#cont .edu_app .edu_p1 .edu_p_dd .edu_p_inpset .edu_inp{
	width:350px; height:50px; background: #f3f6f8;
	border-top-left-radius: 15px; border-bottom-left-radius: 15px; outline: none; text-indent: 15px; font-size: 18px; font-family: NanumEB;
	border:solid 1px rgba(0,0,0,0)
}
#cont .edu_app .edu_p1 .edu_p_dd .edu_p_inpset .edu_inp:focus{border:solid 1px #0069b4}
#cont .edu_app .edu_p1 .edu_p_dd .edu_p_inpset .edu_inp::placeholder{font-size: 14px; font-family: Nanum}
#cont .edu_app .edu_p_dd .edu_p_inpset .btn_inp{width:60px; background: #0069b4; border-top-right-radius: 15px; border-bottom-right-radius: 15px; color: #fff}
#cont .edu_app .edu_p_dd .edu_p_tt{margin-top:20px}
#cont .edu_app .edu_p_dd .edu_p_tt li{line-height: 24px; font-size: 14px; background: url(/images/doc_st.gif) 0 10px no-repeat; padding-left:10px; margin-left:10px}

#cont .edu_app .edu_p2{display: flex; flex-wrap: wrap; margin-top:100px}
#cont .edu_app .edu_p2 .edu_p_gr{width:412px; height:255px; background: url(/images/online_edu2.png) 50% 20px no-repeat; margin-top:20px;}
#cont .edu_app .edu_p2 .edu_p_dd .edu_p_inpset{display: flex; background: #f3f6f8; border-top-left-radius: 15px; border-bottom-left-radius: 15px;}
#cont .edu_app .edu_p2 .edu_p_dd .edu_p_inpset .edu_inp{
	width:80px; height:50px; background: rgba(0,0,0,0); outline: none; font-size: 18px; font-family: NanumEB; text-align: center; box-sizing: border-box
}
#cont .edu_app .edu_p2 .edu_p_dd .edu_p_inpset .edu_inp:focus{border:solid 1px #0069b4}
#cont .edu_app .edu_p2 .edu_p_dd .edu_p_inpset .edu_inp_fst{
	width:80px; height:50px; background: rgba(0,0,0,0); outline: none; font-size: 18px; font-family: NanumEB; text-align: center; box-sizing: border-box
}
#cont .edu_app .edu_p2 .edu_p_dd .edu_p_inpset .edu_inp_fst:focus{border:solid 1px #0069b4; border-top-left-radius: 15px; border-bottom-left-radius: 15px}
#cont .edu_app .edu_p2 .edu_p_dd .edu_p_inpset .edu_inp_sec{display: block; line-height: 50px}

/* 멤버쉽카드/자유이용권 등록하기 */
#cont .memcard{display: flex}
#cont .memcard .memcard_gr{display: flex; margin-top:20px}
#cont .memcard .memcard_gr li{text-indent: -9999px; overflow: hidden}
#cont .memcard .memcard_gr li.memcard_mem{width:242px; height:156px; background: url(/images/mem_img001.png) no-repeat}
#cont .memcard .memcard_gr li.memcard_free{width:106px; height:156px; background: url(/images/mem_img002.png) no-repeat; margin-left:10px}
#cont .memcard .memcard_num_set{margin:50px 0 0 50px; display: flex}
#cont .memcard .memcard_num_set .memcard_inp{
	width:300px; height:50px; background: #f3f6f8; outline: none; border: solid 1px rgba(0,0,0,0); box-sizing: border-box; border-top-left-radius: 15px; border-bottom-left-radius: 15px;
	text-indent: 15px;  font-size: 18px; font-family: NanumEB;
}
#cont .memcard .memcard_num_set .memcard_inp:focus{border:solid 1px #0069b4}
#cont .memcard .memcard_num_set .memcard_inp::placeholder{font-size: 14px; font-family: Nanum}

#cont .memcard .memcard_num_set .btn_memcard{width:60px; height:50px; background: #0069b4; border-top-right-radius: 15px; border-bottom-right-radius: 15px; color: #fff}

/* 메인_고객센터 */
#info{width:100%; background: #edf0f2; margin:100px 0 0 0; padding:50px 0; display:inline-block}
#info .info_wrap{width:1120px; margin:0 auto}
#info .customer{width:40%; display: flex; letter-spacing: -1px; float:left}
#info .customer .cus_part1{}
#info .customer .cus_part1 h2{font-size: 150%; font-family: NanumB}
#info .customer .cus_part1 .tel{font-size: 220%; font-family: NanumEB; letter-spacing: -2px; display: block; margin:10px 0 0 0}

#info .customer .cus_part2{margin:-6px 0 0 10%; display: block}
#info .customer .cus_part2 span:first-of-type{}
#info .customer .cus_part2 span{display: block; margin-top:8px}

#info .bank{width:60%; display: flex; letter-spacing: -1px; float:right}
#info .bank .bank_part1{margin-left:10%; padding-left:10%; background: url(/images/customer_line.png) 0 50% no-repeat}
#info .bank .bank_part1 h2{font-size: 150%; font-family: NanumB}
#info .bank .bank_part1 .bank_num{font-size: 220%; font-family: NanumEB; letter-spacing: -2px; display: block; margin:10px 0 0 0}

#info .bank .bank_part2{margin:7px 0 0 10%; display: block}
#info .bank .bank_part2 span:first-of-type{}
#info .bank .bank_part2 span{display: block; margin-top:8px}

#itgo_rule{padding:20px; font-size: 16px}
#itgo_rule .logo{width:105px; height:38px; background: url(/images/logo.png) no-repeat; overflow: hidden; text-indent: -9999px; margin-bottom:35px}
#itgo_rule .rule_box{line-height: 18px}
#itgo_rule h2{margin-bottom:20px}
#itgo_rule .pb1{font-family: NanumEB; display: block; font-size: 18px; padding:50px 0 20px 0}
#itgo_rule .pb2{font-family: NanumB; display: block; font-size: 16px; padding-bottom:10px}

footer{width:1120px; margin:0 auto; position: relative}
footer .family_site{position: absolute; right:0; margin-top:88px}
footer .family_site ul.family_list{position: absolute; margin-top:-183px; display: none; background: #fff}
footer .family_site ul.family_list li{width:242px; height:42px; margin-bottom:5px}
footer .family_site ul.family_list li:nth-child(1){background: url(/images/family_bn001.png) 120px 50% no-repeat #f3f6f8}
footer .family_site ul.family_list li:nth-child(2){background: url(/images/family_bn002.png) 120px 50% no-repeat #f3f6f8}
footer .family_site ul.family_list li:nth-child(3){background: url(/images/family_bn003.png) 120px 50% no-repeat #f3f6f8}
footer .family_site ul.family_list li em{width:121px; height:42px;  font-size: 12px; line-height: 42px; text-align: center; display: block}
footer .family_basic{width:242px; height:42px; background: url(/images/footer_arrow.png) 200px 50% #f3f6f8 no-repeat; display: block; line-height: 42px; text-align: center; font-size: 14px; cursor: pointer}
footer .condition{display: flex; font-size:18px; padding:100px 0 50px 0; justify-content: center}
footer .condition dd{}
footer .condition dd a{padding:5px 30px}
footer .copyright{font-size: 12px; padding-bottom:50px; line-height: 16px; text-align: center}







