@charset "utf-8";

/* 강좌 상세보기 상단 */
.con_section{margin-bottom:38px;}
.con_section .d_btn_area{ margin-right:0px; text-align:right;}
h4.detail {font-size:20px;color:#fff;background:#474e6d;padding:15px;text-align:center;}

/* PC & 테블릿 해상도 */
.detail_area {width:100%;margin:20px 0; overflow:hidden;}
.detail_area .detail_left {float:left; display:inline-block; width:49%; margin:0 1% 0 0; text-align:center;}
.detail_area .detail_left img{width:530px; max-width:100%; height:auto;}
.detail_area .detail_right {float:left; display:inline-block; width:50%;} 
.detail_area .detail_right .desc {font-size:15px;color:#444;line-height:20px;padding-top:15px;height:40px;}
.detail_area .detail_right .type {display: inline-block; margin-bottom: 5px; padding: 0 5px; min-width: 32px; line-height: 18px; font-size: 12px; color: #fff; background-color: #0841a8; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; text-align: center; vertical-align: top;}
.detail_area .info_list {border-top:1px solid #d4d4d4;border-bottom:1px solid #d4d4d4;padding:15px 20px;margin:15px 0;}
.detail_area .info_list li {overflow:hidden;color:#444;font-size:13px;padding-bottom:10px;}
.detail_area .info_list li strong{float:left;color:#a4a4a4;display:inline-block;width:70px;}
.detail_area .info_list li .book_list{float:left;}
.detail_area .cost {overflow: hidden; margin:10px 0;}
.detail_area .cost .box-l {float: left; padding-left:20px;}
.detail_area .cost .box-r {float: right;padding-right:50px;}
.detail_area .cost .box-r em {display: inline-block; text-align:left; font-size: 25px; color: #da3134; font-weight: bold;}


/* 장바구니, 수강신청 버튼 */
.tabList {margin:70px auto 0px;position:relative;overflow:hidden;}
.tabBt {width: 1140px; overflow: hidden; position: absolute; top: 0px; background: #fff; z-index: 9;}
.tabBt li {width:17%;float:left;}
.tabBt li a {display:block;height:50px;line-height:50px;padding:0 10px; background:#f4f4f4;border-bottom:1px #0841A8 solid; text-align:center; color:#000; font-size:18px; font-weight:600; }
.tabBt li.on a {color:#0841A8; background:#fff; border:1px #0841A8 solid; border-bottom:1px #fff solid;}

/* 모바일 해상도 */
@media all and (min-width:0px) and (max-width:767px) {

	.detail_area {width:100%;margin:20px 0; overflow:hidden;}
	.detail_area .detail_left {width:100%; text-align:center;}
	.detail_area .detail_left img{width:530px; max-width:100%; height:auto;}
	.detail_area .detail_right {width:100%;} 
	.detail_area .detail_right .desc {font-size:15px;color:#444;line-height:20px;padding-top:15px;height:40px;}
	.detail_area .detail_right .type {display: inline-block; margin-bottom: 5px; padding: 0 5px; min-width: 32px; line-height: 18px; font-size: 12px; color: #fff; background-color: #0841a8; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; text-align: center; vertical-align: top;}
	.detail_area .info_list {border-top:1px solid #d4d4d4;border-bottom:1px solid #d4d4d4;padding:15px 20px;margin:15px 0;}
	.detail_area .info_list li {overflow:hidden;color:#444;font-size:13px;padding-bottom:10px;}
	.detail_area .info_list li strong{float:left;color:#a4a4a4;display:inline-block;width:70px;}
	.detail_area .info_list li .book_list{float:left;}
	.detail_area .cost {overflow: hidden; margin:10px 0;}
	.detail_area .cost .box-l {float: left; padding-left:20px;}
	.detail_area .cost .box-r {float: right;padding-right:50px;}
	.detail_area .cost .box-r em {display: inline-block; text-align:left; font-size: 25px; color: #da3134; font-weight: bold;}
	

	/* 장바구니, 수강신청 버튼 */
	.tabList {width:100%;margin:50px auto 0px;position:relative;overflow:hidden;}
	.tabBt {width:100%;overflow:hidden;position:absolute;top:0px; background:#fff; z-index:9;}
	.tabBt li {float:left;}
	.tabBt li a {display:block;height:50px;line-height:50px;padding:0 10px; background:#f4f4f4;text-align:center; color:#000; font-size:1.4em; font-weight:600; }
	.tabBt li.on a {color:#0841A8; background:#fff; border:1px #0841A8 solid; border-bottom:1px #fff solid;}
}

.d_btn.red em {color:#fdff7b;}
.conList {margin-top:50px;}
#sCon01 { padding-top:30px;}

/* 강좌 리스트 */

table.a_basic {margin-top: 20px; border-top: 2px solid #eeeeee; border-bottom: 1px solid #d8d8d8; text-align: center;}
table.a_basic thead {}
table.a_basic tbody {}
table.a_basic tr {}
table.a_basic tr th {padding: 15px 0; background-color: #f7f7f7; border-bottom: 1px solid #d8d8d8;}
table.a_basic tr td {padding: 15px 0; border-top: 1px solid #d8d8d8;}
table.a_basic tr:first-child td {border-top: 0;}
table.a_basic tr th > div {position: relative; padding: 0 20px; font-size: 18px; color: #333d49; font-weight: 500;}
table.a_basic tr td > div {position: relative; padding: 0 20px;}

/*table.a_basic .thumb {width: 250px;}*/
table.a_basic .txt {text-align:left;padding-left: 20px; font-size: 0;}
table.a_basic .txt dl {display: inline-block; margin-bottom: 15px; width: 50%; font-size: 0; vertical-align: top;}
table.a_basic .txt dl dt,
table.a_basic .txt dl dd {display: inline-block; vertical-align: top;}
table.a_basic .txt dl dt {margin-right: 10px; font-size: 18px; color: #000; font-weight: 500;}
table.a_basic .txt dl dd {font-size: 18px; color: #666; font-weight: 400;}
table.a_basic .txt dl dd .cost {margin-top: -1px; font-size: 18px; color: #666;}
table.a_basic .type {display: inline-block; margin-bottom: 5px; padding: 0 5px; min-width: 32px; line-height: 18px; font-size: 12px; color: #fff; background-color: #0841a8; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; text-align: center; vertical-align: top;}
table.a_basic .type.pos {position: absolute; top: 50%; right: 20px; margin-top: -9px;}
table.a_basic .subject span {display: inline-block; margin: 3px 5px 0 0; padding: 0 5px; min-width: 32px; line-height: 18px; font-size: 12px; color: #fff; background-color: #f26806; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; text-align: center; vertical-align: top;}
table.a_basic .subject,
table.a_basic .subject a {line-height: 1.2em; font-size: 16px; color: #000; font-weight: 500;}
table.a_basic .subject a:hover {text-decoration: underline;}
table.a_basic .desc {margin-top: 2px; font-size: 12px; color: #999;}
table.a_basic .info {margin-top: 10px; font-size: 16px; color: #666;}
table.a_basic .info em.color {color: #f56505;}
table.a_basic .cost {font-size: 20px; color: #999;}
table.a_basic .cost em {display: inline-block; margin: -1px 2px 0 0; font-size: 25px; color: #da3134; font-weight: bold; vertical-align: top;}


table.a_basic .inner {padding: 0;}
table.a_basic .inner > div {padding: 0;}
table.a_basic .inner dl {position: relative; border-top: 1px solid #d8d8d8;}
table.a_basic .inner dl:first-child {border-top: 0;}
table.a_basic .inner dl dt {position: absolute; top: 0; left: 0; width: 177px; line-height: 58px; font-size: 18px; color: #000; font-weight: 500; background-color: #f7f7f7; text-align: center;}
table.a_basic .inner dl dd {padding-left: 200px; line-height: 58px; font-size: 20px; color: #666; font-weight: 500; text-align: left;}
table.a_basic .inner dl dd .cost {position: absolute; top: 0; right: 30px; line-height: 58px;}

/* 나의 강의실 강좌 리스트 */
table.a_basic_m {margin-top: 20px; width:100%; border-top: 2px solid #eeeeee; border-bottom: 1px solid #d8d8d8; text-align: center;}
table.a_basic_m thead {}
table.a_basic_m tbody {}
table.a_basic_m tr {}
table.a_basic_m tr th {padding: 15px 0; background-color: #f7f7f7; border-bottom: 1px solid #d8d8d8;}
table.a_basic_m tr td {padding: 15px 0; border-top: 1px solid #d8d8d8;}
table.a_basic_m tr:first-child td {border-top: 0;}
table.a_basic_m tr th > div {position: relative; padding: 0 20px; font-size: 18px; color: #333d49; font-weight: 500;}
table.a_basic_m tr td > div {position: relative; padding: 0 20px;}

/* add by Camsmon 2018-07-06 */
table.b_basic_s {margin-top: 30px; border-top: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8; border-left: 0; text-align: center;}
table.b_basic_s thead {}
table.b_basic_s tbody {}
table.b_basic_s tr {}
table.b_basic_s tr th {padding: 5px 0; background-color: #f7f7f7; border-bottom: 1px solid #d8d8d8; border-left: 0; border-right: 0; text-align:center;}
table.b_basic_s tr td {padding: 5px 0; border-top: 1px solid #d8d8d8; border-left: 0; border-right: 0;  text-align:center;}
table.b_basic_s tr:first-child td {border-top: 0;}

table.b_basic_s tr th > div {padding: 0 5px; font-size: 18px; color: #333d49; font-weight: 500;}
table.b_basic_s tr td > div {padding: 0 5px; font-size: 16px; color: #666; font-weight: 400;}
table.b_basic_s tr td > div em {font-weight: bold;}

.table_btn_area {text-align:center; margin:20px 0;}
.align_left {text-align:left;}
.align_right {text-align:right;}

/* add by Camsmon 2018-07-06 */

.inner_list ul {}
.inner_list ul li {font-size:13px;color:#444;border-top:1px solid #e6e6e6;padding:0px 0;text-align:right;overflow:hidden;}
.inner_list ul li:first-child {border:none;}
.inner_list ul li strong {font-size:12px;color:#a4a4a4;float:left;}
.inner_list ul li .price {letter-spacing:-1px;font-size:22px;}
.inner_list ul li .sale {font-size:13px;color:#444;text-decoration:line-through;display:block;}
.inner_list ul li .price_ori {font-size:13px;color:#444;display:block;}


/* 하위 강의 목록 */
.tab_type2 ul{overflow:hidden;background:url("/images/vod/tab_type2_line.png") repeat-x 0 51px;}
.tab_type2 ul li{float:left;width:15%;}
.tab_type2 ul li a{font-size:15px;background:#f8f8f8;border:1px solid #d9d9d9;border-left:0;border-bottom:0;display:block;height:50px;line-height:50px;color:#6d6d6d;font-size:1.5em; text-align:center;}
.tab_type2 ul li:first-child a{border-left:1px solid #d9d9d9;}
.tab_type2 ul li.on a,
.tab_type2 ul li a:hover{border:1px solid #de1a40;border-bottom:1px solid #fff;background:#fff;color:#DE1A40;font-size:1.5em; font-weight:600;}


/* 강좌상세보기 영상분류 명 */
.mcate_tit { width:100%; margin:40px 0 20px 0;}
.mcate_tit .size02 { position:relative; font-size:24px; color:#272727; font-weight:200; text-align:center; letter-spacing:-2px; margin:20px 0; font-family:'Noto Sans KR';}
.mcate_tit .size02 span {border-bottom:1px #ff5a00 solid; color:#ff6600;}
.mcate_tit .size03 { position:relative; font-size:20px; color:#272727; line-height:30px; font-weight:500; text-align:center; letter-spacing:0px; font-family:'Noto Sans KR'; }

/* 강좌상세보기 영상분류있는 테이블 */
table.b_basic_s_mcate {width:100%; margin-top: 0px; border-top: 1px dashed #d8d8d8; border-bottom: 1px dashed #d8d8d8; border-left: 0; text-align: center;}
table.b_basic_s_mcate thead {}
table.b_basic_s_mcate tbody {}
table.b_basic_s_mcate tr {}
table.b_basic_s_mcate tr th {padding: 5px 0; background-color: #f7f7f7; border-bottom: 1px dashed #d8d8d8; border-left: 0; border-right: 0; text-align:center;}
table.b_basic_s_mcate tr td {padding: 11px 0; border-top: 1px dashed #d8d8d8; border-left: 0; border-right: 0;  font-size:18px; text-align:center;}
table.b_basic_s_mcate tr:first-child td {border-top: 0;}

table.b_basic_s_mcate tr th > div {padding: 0 5px; font-size: 18px; color: #333d49; font-weight: 500;}
table.b_basic_s_mcate tr td > div {padding: 0 5px; font-size: 16px; color: #666; font-weight: 400;}
table.b_basic_s_mcate tr td > div em {font-weight: bold;}

/* 강좌 상세보기 페이지의 수강후기 */
#lecDetailArea_1 { padding:0 0;}
#lecDetailArea_1 .re { padding-left:5px; font-size:1.5em;}
#lecDetailArea_1 .reply { position:relative; width:100%; border-bottom:#81898c 1px solid; padding:20px 0; margin-bottom:10px; }
#lecDetailArea_1 .reply dt { position:relative; width:100%; height:22px; line-height:22px; font-size:14px; color:#1c6193; font-weight:600; margin-bottom:5px; }
#lecDetailArea_1 .reply dt .ico_best { position:relative; height:13px; line-height:13px; padding:0 7px; margin:0 10px; font-size:13px; color:#fff; background:#e84423; }
#lecDetailArea_1 .reply dd { position:relative; min-height:26px; font-size:12px; color:#060606; padding-bottom:10px; }
#lecDetailArea_1 .reply .fav { position:absolute; top:-20px; right:20px; }
#lecDetailArea_1 .reply .fav dd { position:relative; float:left; height:26px; line-height:26px; }
#lecDetailArea_1 .reply .fav dd a { display:inline-block; height:26px; line-height:26px; text-align:center; padding:0 10px; font-size:12px; color:#222; border-radius:5px; background:#fff; }
#lecDetailArea_1 .reply .fav dd a:hover { color:#fff; background:#242c32; }
#lecDetailArea_1 .reply .fav dd.blue a { display:inline-block; height:26px; line-height:26px; text-align:center; padding:0 10px; font-size:12px; color:#222; border-radius:5px; background:none; }
#lecDetailArea_1 .reply .fav dd.blue a:hover { color:#1c6193; background:none; }

.lecture .lecture_list{margin:0 0 46px 0;padding:32px 14px 80px 14px;border:solid 1px #d2d2d2}
.lecture .lecture_list .tit{margin:0 0 12px 0;padding:0 0 0 10px;font-size:24px}
.lecture .lecture_list .tit strong{font-weight:700}
.lecture .lecture_list .tablebox{border-top:solid 1px #555}
.lecture .lecture_list .tablebox .table_board{}
.lecture .lecture_list .tablebox .table_board thead th{border-left:solid 1px #fff;border-top:none;background:#f4f4f4; text-align:center;}
.lecture .lecture_list .tablebox .table_board tbody th{line-height:1.3;border-bottom:solid 1px #eee}
.lecture .lecture_list .tablebox .table_board tbody td{padding:10px;height:35px;border:solid #eee;border-width:0 0 1px 1px}
.lecture .lecture_list .tablebox .table_board tbody td a{display:inline-block;padding:5px 45px 5px 0;background:url('/asset/img/common/btn/btn_play.png') no-repeat 100% 50%}


/* 강좌 상세보기 custom design  */

.cusdiv1 {background-color:#f0f0f0;}
.cusdiv1 .inner1 {width:100%; padding:20px 0; margin:0 auto;}
.cusdiv1 .inner1 .b-tit {font-size:18px; font-family:'Noto Sans KR'; color:#222; font-weight:500; text-align:left; margin-bottom:10px;}
.cusdiv1 .inner1 .b-tit span {font-size:26px; color:#006ffd; font-weight:600;}
/*.cusdiv1 .inner1 .c-box {position:relative; background:url(/image/sub/cusdiv1-bg.jpg) top center no-repeat; background-size: cover;}*/
.cusdiv1 .inner1 .c-box {position:relative;}
.cusdiv1 .inner1 .c-box .txt-box { position:relative; left:42%; width:50%; height:200px; background-color:rgba(0, 112, 254, 0.5); color:#fff; font-size:10px; font-family:'Noto Sans KR'; text-align:left; padding:15px 10px; border-radius:20px 20px; overflow:scroll; overflow-x:hidden;}


.cusdiv2 { background-color:#fff;}
.cusdiv2 .inner2 {width:100%; padding:20px 0; margin:0 auto;}
.cusdiv2 .inner2 .b-tit2 {font-size:32px; font-family:'Noto Sans KR'; color:#006ffd; font-weight:600; text-align:center}
.cusdiv2 .inner2 .dotbox {margin-bottom:10px;}
.cusdiv2 .inner2 .dotbox .dot {width:37px; height:5px; background-color:#006ffd; margin:0 auto;}
.cusdiv2 .inner2 .tit-txt {color:#778296; font-size:13px; font-family:'Noto Sans KR'; line-height:19px; margin-bottom:20px; text-align:center;}
.cusdiv2 .inner2 .mov-box {}


.cusdiv3 { background-color:#006ffd;}
.cusdiv3 .inner3 {width:100%; padding:20px 0; margin:0 auto;} 
.cusdiv3 .inner3 .tit-pic {margin-bottom:20px;}
.cusdiv3 .inner3 .tit-pic img {max-width:100%;}
.cusdiv3 .inner3 ul {width:96%; background-color:#fff; padding:50px 0; margin:0 auto;}
.cusdiv3 .inner3 ul > li { margin:10px; 0;}


.cusdiv4{ background-color:#f0f0f0;}
.cusdiv4 .inner4 {width:100%; padding:20px 0; margin:0 auto; text-align:center;}
.cusdiv4 .inner4 .tit-box1 {font-size:14px; color:#222; font-weight:400; font-family:'Noto Sans KR';}
.cusdiv4 .inner4 .tit-box2 {margin-bottom:20px; font-size:22px; color:#222; line-height:30px; font-weight:500;}
.cusdiv4 .inner4 .tit-box2 .ft-b {font-weight:700;}
.cusdiv4 .inner4 .tit-box2 .pink {color:#ff0078;}


.cusdiv5 { background-color:#151515;}
.cusdiv5 .inner5 {width:96%; padding:20px 0; margin:0 auto;}
.cusdiv5 .inner5 .award-box {}


.cusdiv6 {background-color:#fff;}
.cusdiv6 .inner6 {width:100%; padding:10px 0; margin:0 auto;}
.cusdiv6 .inner6 .t-box {font-size:13px; color:#000; text-align:center;}
.cusdiv6 .inner6 .t-box .lev-b {font-size:16px; color:#006ffd; font-weight:600;}
.cusdiv6 .inner6 .t-box .line {padding:0 2px; font-size:20px; font-weight:200;}
.cusdiv6 .inner6 .t-box .txt-b {font-size:16px; color:#006ffd; font-weight:600;}

.cusdiv7 { background-color:#fff; padding:10px;}
.cusdiv7 .inner7 {width:100%; padding:0; margin:0 auto;}
.cusdiv7 .inner7 .b-tit2 {font-size:32px; font-family:'Noto Sans KR'; color:#006ffd; font-weight:600; text-align:center}
.cusdiv7 .inner7 .dotbox {margin-bottom:10px;}
.cusdiv7 .inner7 .dotbox .dot {width:37px; height:5px; background-color:#006ffd; margin:0 auto;}

/* 강좌 상세보기 custom design 하단 고정 장바구니 버튼 영역 */
#bottom_apply_form {width:100%; position:fixed; bottom: 0px; height:120px; background-color:#ff7200; z-index:99;}
#bottom_apply_form .inner-box {width:1140px; height:120px; margin: 0 auto; background:url(/image/sub/arr-bg.png) top center no-repeat;}

#bottom_apply_form .inner-box .name-box {float:left; margin-right:95px;}
#bottom_apply_form .inner-box .name-box .tit { width:390px;  padding:12px 10px; background-color:#3e1c01; font-family:'Noto Sans KR'; font-size:16px; color:#fff;}
#bottom_apply_form .inner-box .name-box .tit_s { width:390px;  padding:12px 10px; background-color:#3e1c01; font-family:'Noto Sans KR'; font-size:13px; color:#fff;}
#bottom_apply_form .inner-box .name-box .txt { margin-top:15px; color:#fff; font-family:'Noto Sans KR'; font-size:20px;}
#bottom_apply_form .inner-box .name-box .mon {margin-top:5px; color:#fff; font-family:'Noto Sans KR'; font-size:25px;}

#bottom_apply_form .inner-box .discount-pic {float:left; width:87px; height:87px; margin-right:76px; margin-top:17px; background:url(/image/sub/discount.png) top center no-repeat; color:#43250b; font-family:'Noto Sans KR'; font-size:22px;padding-top:20px; font-weight:600;}
#bottom_apply_form .inner-box .discount-pic span { font-size:18px; font-weight:400; line-height:30px;}

#bottom_apply_form .inner-box .price-box {float:left; margin-right:94px; padding-top:48px; color:#fff; font-family:'Noto Sans KR'; font-size:45px; font-weight:600;}
#bottom_apply_form .inner-box .bt-box {float:left; padding-top:16px;}
#bottom_apply_form .inner-box .bt-box img {display:block;}
#bottom_apply_form .inner-box .bt-box img:first-child {margin-bottom:10px;}

