@charset "utf-8";
@import url(/css/font.css);
html {.overflow:scroll; .overflow-x:auto;}
body {background-color:#fff; color:#666; font-size:14px; font-family:돋움,Dotum,굴림,Gulim,Apple-Gothic,sans-serif; letter-spacing:-1px; line-height:1em;  -webkit-text-size-adjust:none;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,button,p,blockquote,th,td {margin:0; padding:0;}
img,fieldset{border:0}
ul,ol,li{list-style:none;}
h1,h2,h3,h4,h5,h6 {font-size:100%; font-weight:normal;}
hr {display:none;}
a, a:link {color:#333; text-decoration:none;}
em,i {font-style:normal; font-weight:normal;}
legend,caption	{display:none; clear:both;}
button {border:none; font-family:돋움,Dotum,굴림,Gulim,Apple-Gothic,sans-serif; cursor:pointer; overflow:visible;}
input,textarea,select {font-family:inherit; font-size:inherit; font-weight:inherit; *font-size:100%;}
textarea, input {outline-color:-moz-use-text-color; outline-style:none; outline-width:medium;}
input[type="button"], input[type="submit"], input[type="text"] {-webkit-appearance:none;-webkit-border-radius:0;}
.type-text	{background:#fff; height:14px; text-align:left;}
.type-btn	{margin:0; padding:0; overflow:hidden; border:0; text-indent:-1000em; cursor:pointer; cursor:hand;}
.clearfix:after, .container:after {content: "."; display: block; height: 0;	clear: both; visibility: hidden;}
.clearfix, .container {display: inline-block;}
.clearfix, .container {display: block;}
.clear { clear: both;}

/* float 해제 */
.f_clear:after { content:""; height:0; display:block; visibility:hidden; clear:both; }
* html .f_clear { height:1px; }
.f_clear { display:block; min-height:1px; }

/* header */
#bodyarea { position:relative; width:100%; min-width:314px; min-height:373px; background:#fff; z-index:5; }
#header { position:relative; height:80px; background:#fff;}
#header h1 { position:absolute; top:8px; left:13px;}
#header h1.sub {width: 135px;}
#header h1 a.sub {background: url(/images/common/2015/cyear/logo_sub_cyear.gif) 0 0 no-repeat; display:block; width:135px; height:57px; overflow:hidden; text-indent:-1000em; font:0/0; float: left; }
#header h1 a.sub1 {background: url(/images/logo_sub7.gif) 0 0 no-repeat; display:block; width:81px; height:22px; overflow:hidden; text-indent:-1000em; font:0/0; float: left; }
#header .newsarea {float: right; margin: 10px 10px 0 0; width: 171px;}
#bodyarea .tm {background: url(/images/bg_tm00.gif) 0 0 repeat-x; width:100%; color: #FFFFFF; height: 42px; text-align: center;}
#bodyarea .tm .first {width: 20%; float: left; padding-top: 4px;}
#bodyarea .tm .mdl {width: 60%; float: left; padding-top: 10px; text-align: center;}
#bodyarea .tm .last {width: 20%; float: left; padding-top: 4px; text-align: right;}
#bodyarea .tm a.pre {background: url(/images/btn_tmpre00.gif) 0 0 no-repeat; width: 42px; height: 32px; display: block; margin-left: 10px; overflow:hidden; text-indent:-1000em; font:0/0;}
#bodyarea .tm a.home {background: url(/images/btn_tmhome00.gif) 0 0 no-repeat; width: 42px; height: 32px; display: inline-block; margin-right: 10px; overflow:hidden; text-indent: 1000em; font:0/0;}
#bodyarea .tm a.menu {background: url(/images/btn_tmmenu01.gif) 0 0 no-repeat; width: 42px; height: 32px; display: inline-block; margin-right: 10px; overflow:hidden; text-indent: 1000em; font:0/0;}
#bodyarea .contents {padding: 10px 10px; display: block; font-size:14px; line-height:1.5; margin:0 0 5% 0;}

/****** FOOTER
#footer { position:relative; width:100%; border-top:1px solid #d9d9d9; background-color:#f3f3f3; text-align:center; height: 80px;}
#footer .advice {display: block; width: 100%; text-align: center; padding-top:13px;}
#footer ul {display: block; height: 27px;}
#footer ul li {display:inline-block; padding: 8px 0 0 10px; font-size: 14px; font-weight: bold; color: #666666; vertical-align: middle;}
#footer ul li.first {padding-left: 0px; color: #222222;} 
#footer ul li.call {padding-top: 0px;}
#footer ul li.call a {background: url(/images/btn_call.gif) 0 0 no-repeat; width: 90px; height: 27px; display: block; overflow:hidden; text-indent:-1000em; font:0/0;}
#footer .copyright {display: block; margin-top: 10px; font-size: 12px; color: #888888; text-align: center;}
  ******/
/* COMMON */
.input_line {display: block; width: 100%; padding: 10px 0; border-bottom: solid 1px #e0e0e0;}
.input_line label {width:35%; display: block; float: left; font-size: 14px; color: #888888; font-weight: bold; padding: 7px 0 0 5px; letter-spacing: -2px;}
.input_line .input {display: block; width:60%; float: left;}
.input_line .input ul {display: block; width: 100%; background: url(/images/bg_inputm.gif) 0 0 repeat-x; height: 28px;}
.input_line .input ul li {display: block; height: 28px;}
.input_line .input ul li.first {background: url(/images/bg_inputl.gif) 0 0 no-repeat; padding-left: 6px; float: left; width: 90%;}
.input_line .input ul li.first input {background: none; border: 0px; height: 24px; padding: 4px; width: 90%; font-size: 12px; font-weight: bold; color: #222222;}
.input_line .input ul li.last {background: url(/images/bg_inputr.gif) 0 0 no-repeat; width: 6px; float: right;}

a.button {background: url(/images/btn_redl.gif) 0 0 no-repeat; display: inline-block; height: 27px; overflow: hidden;}
a.button div {background: url(/images/btn_redr.gif) right 0 no-repeat; width: 100%; text-align: center; color: #FFFFFF; font-size: 12px; padding-top: 4px; height: 27px;}

span.member_id {color: #a93b38; font-weight: bold;}
#bodyarea .contents .btn {padding-top: 19px; text-align: center;}
#bodyarea .contents .btn a {display: inline-block; width: 108px; height: 42px; overflow:hidden; text-indent:-1000em; font:0/0; margin: 0 3px;}
#bodyarea .contents .btn a.agree {background: url(/images/btn_agree.gif) 0 0 no-repeat;}
#bodyarea .contents .btn a.cancel {background: url(/images/btn_cancel.gif) 0 0 no-repeat;}
#bodyarea .contents .btn a.ok {background: url(/images/btn_ok.gif) 0 0 no-repeat;}
#bodyarea .contents .btn a.go_home {background: url(/images/btn_gomain.gif) 0 0 no-repeat; width: 130px;}
#bodyarea .contents .btn a.login {background: url(/images/btn_loginb.gif) 0 0 no-repeat; width: 270px;}
#bodyarea .contents .tit {height: 32px; display: block;}
#bodyarea .contents .stit {background: url(/images/dot_stit.gif) 0 center no-repeat #fff; padding: 12px 0 8px 17px; font-weight: bold; color: #ff0000; display: block; text-align:left; font-size:4vw; font-family: 'Noto Sans KR';}
#bodyarea .contents .tbl_list {display: block; background: #d2d2d2; font-size: 12px; color: #666666; text-align: center;}
#bodyarea .contents .tbl_list .ttit {background: #F3F3F3; font-weight: bold; font-size: 12px; color: #444444; height: 24px;}
#bodyarea .contents .tbl_list .tcon {background: #FFFFFF; font-size: 12px; color: #666666; padding: 5px 2px;}
#bodyarea .contents .tbl_list .tcon02 {background: #FFFFFF; font-size: 12px; color: #333; padding: 5px 2px; text-align:left;}
#bodyarea .contents .tit2 {background: #FFFFFF; font-size: 3.3vw; color: #666666; padding: 5px 0; font-family: 'Noto Sans KR';}
#bodyarea .contents .tbl_list .subject {font-family: 'Noto Sans KR'; background: #f9ecec; font-size: 3.6vw; color: #232323; height: 40px; text-align:center; padding-left: 10px;}
#bodyarea .contents .tbl_list .subject2{font-family: 'Noto Sans KR'; background: #f9ffd5; font-size: 3vw; color: #232323; height: 30px; text-align: left; padding-left: 10px;}

#bodyarea .contents .tab_stit {display: block; background: #0067d0;}
#bodyarea .contents .tab_stit .tab {color: #bcd5ee; background: #4c8ac9; text-align: center; cursor: pointer;}
#bodyarea .contents .tab_stit .crnt {color: #FFFFFF; background: #339eff; font-weight: bold;}

/* Sub TOP */
.menu_bar {text-align: center; padding: 0 10px 10px;}
.menu_bar a {display: inline-block; width: 96px; height: 107px;}
.menu_bar a.mdl {margin: 0 5px;}

/* .btn_bar {display: block; text-align: center; padding: 0px 0 0px 0; height:40px; border-top:solid 1px #d7d7d8; border-bottom::solid 1px #d7d7d8}
.btn_bar a {display: inline-block; width: 100px; height: 40px; font-size: 12px; color: #444444; text-align: center; line-height: 16px; font-weight: bold; vertical-align:middle;}
.btn_bar a img {width:45px}

.btn_bar a.first { border-right:1px solid #d7d7d8; padding-top:5px; padding-bottom:5px}
.btn_bar a.mdl { border-right:1px solid #d7d7d8; padding-top:5px; padding-bottom:5px}
.btn_bar a.cong {display:inline-block;padding-top:10px; border-right:1px solid #d7d7d8;   }
.btn_bar span.red { color:#ff0000}
.btn_bar a.last {padding-top:5px; padding-bottom:5px} */


/* JOIN */
#bodyarea .tab_join {padding: 6px 9px; text-align: center; background: #F3F3F3; }
#bodyarea .tab_join a {display: inline-block; width: 90px; height: 32px; overflow:hidden; text-indent:-1000em; font:0/0; }
#bodyarea .tab_join a.agree {background: url(/images/tab_join1.gif) left top no-repeat;}
#bodyarea .tab_join a.private_info {background: url(/images/tab_join2.gif) left top no-repeat; margin: 0 6px; width: 110px;}
#bodyarea .tab_join a.complete {background: url(/images/tab_join3.gif) left top no-repeat;}
#bodyarea .tab_join a.crnt {background-position: bottom;}
#bodyarea .contents .tab_terms {width: 100%; text-align: center;}
#bodyarea .contents .tab_terms a {display: inline-block; width:150px; height:30px; overflow:hidden; text-indent:-1000em; font:0/0;}
#bodyarea .contents .tab_terms a.use_terms {background: url(/images/tab_terms.gif) 0 0 no-repeat;}
#bodyarea .contents .tab_terms a.privacy_terms {background: url(/images/tab_privacy.gif) 0 0 no-repeat;}
#bodyarea .contents .tab_terms a.crnt {background-position: bottom;}
#bodyarea .contents .con_terms {display: block; border-bottom: solid 1px #E0E0E0; padding: 20px 10px 0;}
#bodyarea .contents .con_terms .txt_terms {font-size: 14px; line-height: 18px; color:#222222;}
#bodyarea .contents .con_terms .more {text-align: right; padding: 20px 10px 20px 0; }
#bodyarea .contents .con_terms .more a {font-size: 14px; color: #0066ff;}
.input_id .input_line, .input_pass .input_line {border: none; padding-bottom: 0px;}
.input_id, .input_pass {width: 100%; border-bottom: solid 1px #e0e0e0;}
.input_id .subcopy, .input_pass .subcopy {width: 100%; text-align: right; font-size: 12px; color: #888888; padding: 10px 0;}
.input_id .subcopy span.alert, .input_pass .subcopy span.alert {color: #a24141;}
#bodyarea .contents .img_msg {width: 100%; padding-top: 40px; text-align: center;}
#bodyarea .contents .txt_msg {width: 100%; padding: 25px 0; text-align: center; color: #666666; line-height: 20px;}

/* LOGIN */
#bodyarea .contents .login {height: 105px; margin: 0 10px; border-top: solid 1px #e0e0e0;}
.option {padding: 10px 0 0 20px;}
.option label {display: inline-block; float: left; color: #666666; font-size: 14px; }
.option label.last {border-left: solid 1px #E0E0E0; padding-left: 10px;}
.option input {float: left; margin: 0 10px 0 5px;}
.login_desc {margin-top: 20px; padding: 15px; background: #F3F3F3; font-size: 14px; line-height: 18px; color: #888888; display: block;}0066ff
.login_desc a {color: #0066ff; text-decoration: underline;}
.login_desc a {color: #0066ff; text-decoration: underline;}

/* WEB */
* html #footer ul li { display:inline; }
*:first-child+html #footer ul li { display:inline; }
* html #footer button { margin:0 1px; padding:0; }
*:first-child+html #footer button { margin:0 1px; padding:0; }



/* 오페라 미니 레이아웃 대응용 */
.operaMini { width:100%; table-layout:fixed; }
.operaMini td.operaMiniWrap { overflow:hidden; text-overflow:ellipsis; -o-text-overflow:ellipsis; }

/*버튼 개선 타입*/
.subscription_btnred{ 
				width:120px;
				display: block;
				color: white;
				font-weight: bold;
				text-align: center;
				padding: 6px;
				border-top: 1px solid #c14545;
				background: linear-gradient(to bottom,#ff5b5b ,#db2021);
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff5b5b', endColorstr='#db2021',GradientType=0 );
				border-top-left-radius: 2px;
				border-top-right-radius: 2px;
				border-bottom-left-radius: 2px;
				border-bottom-right-radius: 2px;
				clear: both;
				overflow: hidden;
				margin: 10px auto; }
.subscription_btngray{ 
				width:120px;
				display: block;
				color: white;
				font-weight: bold;
				text-align: center;
				padding: 6px;
				border-top: 1px solid #c575757;
				background: linear-gradient(to bottom,#717171 ,#3e3e3e);
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#717171', endColorstr='#3e3e3e',GradientType=0 );
				border-top-left-radius: 2px;
				border-top-right-radius: 2px;
				border-bottom-left-radius: 2px;
				border-bottom-right-radius: 2px;
				margin: 10px auto;
				clear: both;
				overflow: hidden; }
.subscription_btngreen{ 
				width:120px;
				display: block;
				color: white;
				font-weight: bold;
				text-align: center;
				padding: 6px;
				border-top: 1px solid #156fb1;
				background: linear-gradient(to bottom,#1d9ffe ,#0065cf);
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1d9ffe', endColorstr='#0065cf',GradientType=0 );
				border-top-left-radius: 2px;
				border-top-right-radius: 2px;
				border-bottom-left-radius: 2px;
				border-bottom-right-radius: 2px;
				margin: 10px auto;
				clear: both;
				overflow: hidden; }
a.extension_btn{
				color:  white;
				display:block;
				padding:1.5%;
				margin: 3px auto;
				letter-spacing: 0em;
				}
/*테이블타입추가*/
.tdstyle01 p{
	margin: 5px 20px 5px 10px;
	text-align: left;
	display: block;
	width: 90%; }

.tdstyle01 p b{
	font-weight: 900; }
.tcon2{ background-color: white;
	padding:10px;
	}
/*모바일퀴즈 추가 css*/
/*start*/
.visual00{
	font-family:돋움;
	background-color:#0c4580;
	display:block;
	position:relative;
	overflow:hidden;
	text-align:center;
	}

.visual01{
	color: black;
	clear:both;
	overflow: hidden;
	}

	.visual01 p.titlem{
	width: 95%;
	margin:0px auto;
	text-align: left;
	}

.visual01 .quizokgo{}

.width100{
	width: 100px;
	display:block;}

.width200{
	margin:20px 0 25px 0;
	display:block;
	text-align:center;}

.visual01 li{}
.visual02{
	margin:20px 0;
	font-family:돋움;
	text-align: left;	
	padding: 10px;
	color: black;
	border: 6px solid #0c4580;
	display:block;}

.visual02 p b, .visual03 p b{
	font-family:돋움;
	color: red;
}

div.quizgood{
	font-family:돋움;
	font-size: 21px;
	margin-top:10px;}

.label00{
cursor: pointer;
position:relative;
background-repeat: nor-repeat;
background-position: center top;
background-image: URL(/images/quiz/quiz_icon_0.gif);
width: 60px;
height: 57px;
display:block;
margin-left:20px;}

.label01{
cursor: pointer;
position:relative;
background-repeat: nor-repeat;
background-position: center top;
background-image: URL(/images/quiz/quiz_icon_x.gif);
width: 60px;
height: 57px;
display:block;
margin-left:20px;}

/*result*/
.visual03{
	font-family:돋움;
	margin-bottom:20px;
	color: black;
	text-align: left;
	font-weight: 600;
	clear:both;
	overflow: hidden;}

 .visual03 p { 
	margin-top:2%; 
}


/* 나의강의실 추가 */
.tab_stit {display: block; background: #1462b1; text-align: center; color: #FFFFFF; font-weight: bold; height:30px; line-height:30px; border:2px solid #2c5a89; letter-spacing:0em;}
.titlem {margin-bottom:6px;}
label, input {vertical-align:middle;}
div.quizgood img {max-width:100%; height:auto;}
.btn_guide {text-align:right;}
.btn_guide a {display:inline-block; line-height:27px; text-align:center; color:#fff; font-size:12px; padding:0px 10px; margin-top:10px; border-radius:2px; width:6em; border-top: 1px solid #c575757; background:#3e3e3e; background: linear-gradient(to bottom,#717171 ,#3e3e3e);}
.exmImage {margin:2px 0 6px 0;}

/* btn-type -------------------------------------------------------------------*/
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

.btn-type {display:inline-block;position:relative;cursor:pointer;text-align:center;transition:all 0.3s; font-size:0;}
.btn-type.btn1 {padding:0 15px;height:30px;line-height:28px;font-size:14px;letter-spacing:-0.03em;text-transform:uppercase;font-family: 'Nanum Gothic'; font-style: normal; font-weight: 400;box-sizing: border-box;-webkit-box-sizing:border-box; -moz-box-sizing:border-box;border-radius:16px;-moz-border-radius:16px;-webkit-border-radius:16px;-ms-border-radius:16px;-khtml-border-radius:16px;-o-border-radius:16px;}
.btn-type.btn1.black {color:#fff !important;border:1px solid #262729;background:#262729}
.btn-type.btn1.gray {color:#fff !important;border:1px solid #a8a8a8;background:#a8a8a8}
.btn-type.btn1.dblue {color:#fff !important;border:1px solid #333e7e;background:#333e7e}
.btn-type.btn1.blue {color:#fff !important;border:1px solid #275ec2;background:#275ec2}
.btn-type.btn1.red_line {color:#bf202f !important;border:1px solid #bf202f;background:#fff}
.btn-type.btn1.gray_line {color:#666 !important;border:1px solid #b1b1b1;background:#fff}
.btn-type.btn1.blue_line {color:#3d4b9b !important;border:1px solid #3d4b9b;background:#fff}
.btn-type.btn1.red_line {color:#bf202f !important;border:1px solid #bf202f;background:#fff}
.btn-type.btn1.red {color:#fff !important;border:1px solid #bf202f; background:#bf202f;}


/*영상관련 고객센터*/
.fs_btn1{ width:360px; position:relative; top:0; left:50%; margin-left:-180px; margin-bottom:30px; margin-top:10px;}
.fs_btn1 .fs_txt{background-color:#ac0000;  text-align:center; color:#fff; font-weight:bold; line-height:30px;}
.fs_btn1 .fs_txt a{color:#fff;}
#f_slide{line-height:35px; padding:0px 20px 30px 20px;}

.fs_btn2{ width:360px; position:relative; top:0; left:50%; margin-left:-180px; margin-bottom:30px; margin-top:0px;}
.fs_btn2 .fs_txt2{background-color:#ac0000;  text-align:center; color:#fff; font-weight:bold; line-height:30px;}
.fs_btn2 .fs_txt2 a{color:#fff; display:block;}



/*20210906 주문배송내역 추가*/
#bodyarea .contents .buy_info_title{ font-family: 'Noto Sans KR'; color:#232323; font-weight:500; font-size:22px; padding-top:2%;}
#bodyarea .contents .buy_info_sub{ font-family: 'Noto Sans KR'; color:#5c5c5c; font-weight:400; font-size:13px; padding-top:2%; padding-bottom:2%;}

#bodyarea .contents table.buy_info_top{position:relative; top:0; left:0; width:100%; font-family: 'Noto Sans KR'; color:#232323; border-collapse:collapse;}
#bodyarea .contents table.buy_info_top tr.bit_head{background-color:#dbf4ff; height:40px;}
#bodyarea .contents table.buy_info_top tr.bit_head td{text-align:center; font-size:13px; font-weight:400; border:1px solid #dadada; border-bottom:0; }

#bodyarea .contents table.buy_info{position:relative; top:0; left:0; width:100%; font-family: 'Noto Sans KR'; color:#232323; border-collapse:collapse;}
#bodyarea .contents table.buy_info tr.buy_head{background-color:#dbf4ff; height:40px;}
#bodyarea .contents table.buy_info tr.buy_head td{text-align:center; font-size:13px; font-weight:400;}
#bodyarea .contents table.buy_info tr td{border:1px solid #dadada; padding:0 3px;}

#bodyarea .contents .more_buy_page{ font-family: 'Noto Sans KR'; color:#232323; padding:3% 0; text-align:center; background-color:#f0f0f0; margin-bottom:5%; }

/*주문배송내역 페이징 처리*/
.off-screen {	display: none;}
#btnav {	width:100%;	text-align: center; margin:3% 0 5% 0;}
#btnav a {	display: inline-block;	padding: 0.5% 2%;	margin-right: 10px; font-family: 'Noto Sans KR';	background: #fff;	color: #000;	text-decoration: none; border: solid 1px #D0D0D0; border-radius:5px;}
#btnav a.active {background: #232323;	color: #fff; border: solid 1px #232323;}

#bodyarea .contents .search_row{text-align:right; font-family: 'Noto Sans KR'; color:#232323; margin:2% 0 1% 0;}
#bodyarea .contents .search_row input{border:1px solid #ccc; font-family: 'Noto Sans KR'; color:#232323; width:10%; text-align:center; vertical-align:top;}


/*20210906  포인트적립 사용내역 추가*/
#bodyarea .contents table.paginated{position:relative; top:0; left:0; width:100%; font-family: 'Noto Sans KR'; color:#232323; border-collapse:collapse;}
#bodyarea .contents table.paginated tr td{border:1px solid #dadada; padding:5px 3px;}

#bodyarea .contents .pagination{position:relative; top:0; left:0; width:100%; font-family: 'Noto Sans KR'; color:#232323; text-align:center; margin:5% 0 4% 0; }
#bodyarea .contents .pagination span#first{background-color: #fff; margin:0 5px 0 0;}
#bodyarea .contents .pagination span#back{background-color: #fff; margin:0;}
#bodyarea .contents .pagination span#next{background-color: #fff; margin:0;}
#bodyarea .contents .pagination span#last{ margin:0 0 0 5px;}
#bodyarea .contents .pagination span.pageNum{background-color: #fff; margin:0 1%; padding:0.5% 2%; border: solid 1px #D0D0D0; font-size:14px; border-radius:5px;}
#bodyarea .contents .pagination span.active{background-color:#232323; color:#fff; border: solid 1px #232323;}

#bodyarea .contents .mypoint{font-family: 'Noto Sans KR'; color:#232323; text-align:right; font-size:16px; margin-bottom:1%;}
#bodyarea .contents .mypoint b{color:#e41d3d;}


/*나의강의실 주문배송/포인트 버튼*/
#bodyarea .contents .buynpoint{display:block; text-align:center; margin-top:1%; margin-bottom:1%;}
#bodyarea .contents .buynpoint a{font-family: 'Noto Sans KR'; color:#232323; border:1px solid #ccc; border-radius:5px; display:inline-block; padding:1% 2%; background: linear-gradient(to top, #e6e6e6 10%, #ffffff 90%);}
#bodyarea .contents .buynpoint a:nth-child(2){margin-left:2%; margin-right:2%; }
#bodyarea .contents .buynpoint a:nth-child(4){margin-left:2%;}