@charset "utf-8";
.input{margin:1px; padding:0px 5px; border:1px solid #ccc; vertical-align:middle; background:#f5f5f5; box-sizing:border-box}
select{font-size:15px}
input[type=text]{appearance:none; -moz-appearance:none; -webkit-appearance:none; -o-appearance:none; -ms-appearance:none; font-size:15px; box-sizing:border-box}
input[type=submit]{cursor:pointer; appearance:none; -moz-appearance:none; -webkit-appearance:none; -o-appearance:none; -ms-appearance:none}
button{cursor:pointer; appearance:none; -moz-appearance:none; -webkit-appearance:none; -o-appearance:none; -ms-appearance:none}
.mbtn{display:inline-block; text-align:center; margin:2px 0px 0px 0px; padding:0px 22px; min-width:60px; height:40px; line-height:40px; font-size:16px; background:#f0f0f0; border:1px solid #ccc !important; vertical-align:middle; box-sizing:border-box; letter-spacing:-.5px}
input.mbtn{cursor:pointer}


.btn_forinput{border-radius:0;}
.btn_search{}

.btn{padding-left:25px; padding-right:25px; font-weight:500;}
table.general_board thead th{font-size:17px;}
.board_view .title{font-size:20px;}
.btn_preview{background-color:#333 !important;}
.btn_preview span{color:#fff;}

.board_view>ul.datalist>li,
.board_view .other_con li,
table.general_board thead th,
table.general_board tbody td{padding-top:15px; padding-bottom:15px;}
.board_view .title, .board_view div.title{text-align:center; padding:15px 10px;}
.board_view div.title p{font-size:20px;}
.board_view2 div.title{text-align:center; margin-top:-1px; padding:15px 10px; border-top:2px solid #333; border-bottom:1px solid #333}
.board_view2 div.title p{font-size:20px;}
.board_view2 div.title p.period{display:inline-block; margin-top:10px; padding:0px 20px; font-size:1.07em; background:#e3e3e3; border-radius:60px; letter-spacing:0px; }
.board_view2 .title+.data_list{margin-top:0px; border-top:0px}
.board_view2 .data_list>li{overflow:hidden; border-top:1px dotted #ccc}
.board_view2 .data_list>li:first-child{border-top:0px}
.board_view2 .data_list>li dl{display:table; width:100%}
.board_view2 .data_list>li dl>dt, 
.board_view2 .data_list>li dl>dd{display:table-cell; font-size:1.05em; padding:10px 5px 10px 20px;}
.board_view2 .data_list>li dl dt{width:150px; font-weight:bold; color:#333}
.board_view .data_list>li dl>dt, .data_list>li dl>dd{padding-top:10px; padding-bottom:10px;}
.board_view2 .detail{padding:30px 15px; border-bottom:1px solid #ddd;}
.board_view2 .detail+.detail{border-bottom-color:#ccc;}
.board_view2 .detail .tit{margin-bottom:10px; font-size:18px; font-weight:500;}
.board_view2+.btnBox{margin-top:20px;}
.board_view .con{margin-bottom:20px;}
.board_view div.con .detail table{width:100% !important;}

.board_write>li{padding:15px 0;}
.board_write>li dt{font-size:17px; font-weight:400;}
.board_write>li dd{font-size:17px;}
.board_write input[type="text"], .board_write input[type=password]{font-size:0.9em;}

.add_file dl{display:table; width:100%}
.add_file dl>dt,
.add_file dl>dd{display:table-cell; padding:5px 0px; padding-left:20px}
.add_file dl>dt{width:150px; font-weight:bold; color:#333}
.add_file{position:relative; padding:10px 80px 10px 0px; background:#f9f9f9; border-bottom:1px solid #ddd}
.add_file dl>dd ul li{position:relative; padding-left:15px}
.add_file dl>dd ul li img{vertical-align:middle}
.add_file dl>dd ul li span.byte{padding-left:5px; color:#666; font-weight:bold; font-size:.9em; letter-spacing:0px}
.product_view div.info ul.list .add_file li:after{display:none;}

/****************************************************************************************
	.tag_state - 상태(ex-강좌리스트, 예약)
	.lec_state - 강좌상태(큼, ex-상세)
	.tag_txt - 네모카테고리(네모 ex-리스트답변완료)
	.tag_cate - 둥근카테고리(원 ex-포토갤러리카테)
	.tag_ic - 리스트에서 타이틀 앞에 아이콘
*****************************************************************************************/
.tag_state{display:inline-block; text-align:center; padding:0px 10px 1px; min-width:50px; border-radius:100px; border:1px solid #ddd; line-height:140%; }
.lec_state{display:inline-block; text-align:center; padding:10px; min-width:110px; border-radius:3px; border:1px solid #ddd; line-height:150%; font-size:1.2em}
.tag_txt{display:inline-block; text-align:center; margin-right:8px; padding:0px 5px 1px; width:70px; line-height:140%; border:1px solid #ddd}
.tag_cate{display:inline-block; text-align:center; margin:1px 0px; padding:0px 10px 1px; min-width:40px; border-radius:100px; border:1px solid #ddd; line-height:140%; }
.tag_ic{display:inline-block; vertical-align:middle; margin-right:7px; width:16px; height:20px; background-image:url(/share/images/program/ic_board.gif); text-indent:-5000px}
.tag_ic.ic_reply{margin-left:10px; background-position:left center}
.tag_ic.ic_open{background-position:-40px center}
.tag_ic.ic_close{background-position:-80px center}
.tag_ic.ic_new{width:33px; background-position:-120px center}
.tag_notice{margin-right:5px; color:#1a5194; font-weight:bold; font-size:0.93em}
/* 태그 및 버튼 색상 */
.c_rd{border-color:#a82a2a; color:#a82a2a}
.c_or{border-color:#da6506; color:#f16c00}
.c_yg{border-color:#5a9020; color:#5a9020}
.c_gr{border-color:#187332; color:#187332}
.c_gb{border-color:#1b7f74; color:#1b7f74}
.c_bg{border-color:#1c789a; color:#1c789a}
.c_bl{border-color:#1a5194; color:#1a5194}
.c_nv{border-color:#122e74; color:#122e74}
.c_vi{border-color:#5c3ca7; color:#5c3ca7}
.c_pp{border-color:#883a99; color:#883a99}
.c_pk{border-color:#d23f62; color:#d23f62}
.c_bk{border-color:#333; color:#333}
.c_gy{border-color:#666; color:#666}
.bg_rd{background:#a82a2a; border-color:#a82a2a; color:#fff}
.bg_or{background:#da6506; border-color:#f16c00; color:#fff}
.bg_yg{background:#5a9020; border-color:#5a9020; color:#fff}
.bg_gr{background:#187332; border-color:#187332; color:#fff}
.bg_gb{background:#1b7f74; border-color:#1b7f74; color:#fff}
.bg_bg{background:#1c789a; border-color:#1c789a; color:#fff}
.bg_bl{background:#1a5194; border-color:#1a5194; color:#fff}
.bg_nv{background:#122e74; border-color:#122e74; color:#fff}
.bg_vi{background:#5c3ca7; border-color:#5c3ca7; color:#fff}
.bg_pp{background:#883a99; border-color:#883a99; color:#fff}
.bg_pk{background:#d23f62; border-color:#d23f62; color:#fff}
.bg_bk{background:#333; border-color:#333; color:#fff}
.bg_gy{background:#666; border-color:#666; color:#fff}

/*** 검색 ***/
div.search{text-align:center; margin-top:-1px; padding:3.5%; background:#f5f5f5; border:1px solid #ddd}
div.search>div *{vertical-align:middle}
div.search select{margin:2px 0px; padding:0px 30px 0px 10px; width:20%; max-width:135px; height:40px; line-height:40px; border:1px solid #ccc; appearance:none; -moz-appearance:none; -webkit-appearance:none; -o-appearance:none; -ms-appearance:none; background:#fff url(../images/program/select_arr.gif) no-repeat right 13px center}
div.search select::-ms-expand{display:none}
div.search input[type="text"], div.search p.entertxt input[type="text"]{margin-left:-1px; padding:0px 8px; width:100%; height:40px; line-height:40px; border:1px solid #ccc}
div.search input[type="submit"], div.search p.entertxt input[type="submit"]{width:108px; height:40px; line-height:40px; border-width:0px; background:#333; color:#fff; font-size:18px}
div.search .word, div.search p.entertxt{position:relative; display:inline-block; padding:0 113px 0 0 !important; margin:2px 0px; width:35%;}
div.search .word input[type=submit], div.search p.entertxt input[type="submit"]{position:absolute; right:0px; top:2px}
div.search p.entertxt{max-width:100%;}
div.search input[maxlength="10"]{max-width:130px;}

div.search .range{display:inline-block; position:relative; width:42%}
div.search .range.cal{ padding-right:35px; width:30%}
div.search .range.cal img[src*=ic_cal]{position:absolute; top:2px; right:0px}
div.search .field_gyeyak:After,
div.search .field_gyeyak li:After{display:block; content:''; clear:both}
div.search .field_gyeyak li{float:left; width:55%; text-align:left}
div.search .field_gyeyak li:first-child{width:45%}
div.search .field_gyeyak li:last-child dl{float:left; width:50%}
div.search .field_gyeyak li:last-child dl:first-child{width:100%}
div.search .field_gyeyak dl{position:relative; margin-top:5px; padding-left:90px; box-sizing:border-box}
div.search .field_gyeyak dl dt{position:absolute; left:0px; top:5px; text-align:RIGHt; width:75px; font-weight:bold} 
div.search .field_array{padding-bottom:20px; margin-bottom:20px; border-bottom:1px dotted #ddd}
div.search .field_array li{display:inline-block; vertical-align:top; margin:5px 8px}
div.search .field_array li select{min-width:150px}
div.search .field_array dl{box-sizing:border-box}
div.search .field_array dl dt{display:inline-block; margin:0px 5px; font-weight:bold} 
div.search .field_array dl dd{display:inline-block} 
div.search div.search_btn{position:relative; margin-top:3%; padding-top:3%;  border-top:1px dotted #ccc}
div.seacrch div.search_btn input[type=submit]{position:static;  min-width:20%} 

/*** 리스트 ***/
.board_list{}
.nodata{padding:80px 10px; text-align:center; font-size:1.07em; border-top:2px solid #333; border-bottom:1px solid #aaa}
/* 제픔홍보관 */
.program_tab{margin-bottom:20px}
.product{overflow:hidden; padding-bottom:20px; border-top:2px solid #333; border-bottom:1px solid #ddd}
.product>li{float:left; margin:30px 1%; width:23%}
.product>li p.img{position:relative; height:256px; overflow:hidden; border-radius:15px; border:1px solid #ebebeb;}
.product>li p.img img{position:absolute; left:50%; top:50%; width:100%; max-height:100%; transform:translate(-50%, -50%);}
.product>li p.category{margin-top:15px; color:#7f8d9f; font-size:13px; font-weight:300;}
.product>li p.name{margin-bottom:35px; margin-top:3px; font-size:1.15em; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.product>li .price{overflow:hidden;}
.product>li .price>p.off{float:left; font-weight:600; color:#7f8d9f; font-style:italic; font-size:2.1em;}
.product>li .price>p.pay{float:right; font-size:1.65em; font-weight:500;}
.product>li .price>p.pay .cost{padding-right:10px; color:#afafaf; font-size:13px; font-weight:400; text-decoration:line-through;}
.product>li .price>p.pay .won{font-size:15px; font-weight:400;}
.product>li .txt{padding-top:15px; padding-left:3px; margin-top:5px; color:#777; font-size:13px; border-top:1px solid #ebebeb; font-weight:300;}
.product_view:after{display:block; content:''; clear:both}
.product_view div.photo{float:left; width:45%}
.product_view div.photo ul{position:relative; overflow:hidden; padding-top:365px; text-align:center}
.product_view div.photo ul li{display:inline; font-size:0px}
.product_view div.photo ul li p.thumb{display:inline-block; margin:3px 2px; width:15%; max-width:50px; overflow:hidden; z-index:1}
.product_view div.photo ul li p.thumb img{width:100%; height:45px; border:3px solid #fff; box-sizing:border-box}
.product_view div.photo ul li p.thumb a.on img{border-color:#0a59ba}
.product_view div.photo ul li p.img{display:none; position:absolute; left:0px; top:0px; width:100%; height:420px; z-index:-1}
.product_view div.photo ul li:first-child p.img{display:block}
.product_view div.photo ul li p.img img{ position:relative; top:0; width:100%; height:420px}
.product_view div.photo ul li p.img:after{display:block; content:''; position:absolute; bottom:0px; width:100%; height:60px; background:#000; background:rgba(0,0,0,.3)}
.product_view div.info{position:relative; float:right; padding-bottom:20px; margin-bottom:0px; width:52%; min-height:420px; border-top:3px solid #1b1b1b; border-bottom:1px solid #aaa}
.product_view div.info div.name{padding:25px 15px; border-bottom:1px dashed #e1e1e1}
.product_view div.info div.name p.tit{margin-top:5px; font-weight:bold; font-size:26px; color:#333; letter-spacing:-1px; line-height:130%}
.product_view div.info div.price{/* display:none; */ overflow:hidden; padding:15px 15px 10px; border-bottom:1px solid #aaa; letter-spacing:-1px}
.product_view div.info div.price p.off{float:left; font-weight:bold; font-size:50px; color:#7f8d9f; line-height:100%}
.product_view div.info div.price p.off span{font-size:25px}
.product_view div.info div.price>div{float:left; margin-left:10px}
.product_view div.info div.price>div p{line-height:120%}
.product_view div.info div.price>div p.price1{font-size:16px; text-decoration:line-through}
.product_view div.info div.price>div p.price2{font-weight:bold; font-size:28px}
.product_view div.info p.txt{padding:20px 20px 0px; font-size:14px; line-height:140%; word-break:keep-all}
.product_view div.info ul.list{padding:20px 20px 0px}
.product_view div.info ul.list li{position:relative; padding-left:10px; min-height:23px;  color:#484848; font-size:14px}
.product_view div.info ul.list li:after{display:block; content:''; position:absolute; left:0px; top:9px; width:5px; height:1px; background:#aaa}
.product_btn{margin-top:30px; text-align:right}

/* 한줄리스트 */
.board_list .oneList{border-top:2px solid #333}
.board_list .oneList>li{overflow:hidden; margin-bottom:10px; padding:2.5% 3%; border:1px solid #ddd}
.board_list .oneList>li:first-child{border-top:0px}
.board_list .oneList>li p.tit{overflow:hidden}
.board_list .oneList>li p.tit a{font-size:1.4em; color:#333; line-height:130%}
.board_list .oneList>li div.con{margin-top:15px; position:relative; }
.board_list .oneList>li div.con ul.list_info{overflow:hidden}
.board_list .oneList>li div.con ul.list_info li{float:left; width:50%}
.board_list .oneList>li div.con ul.list_info li.long{clear:both; float:none; width:100%; }
.board_list .oneList.haveBtn>li div.con{padding-right:100px}
.board_list .oneList>li div.con ul.oneList_btn{position:absolute; right:0px; top:0px}
.board_list .oneList>li div.con ul.oneList_btn li{margin-bottom:3px}
.board_list .oneList>li div.con ul.oneList_btn li a{text-align:center; width:70px}
/* 강의 */
.board_list ul.lecList{overflow:hidden; padding-top:1px}
.board_list ul.lecList>li{position:relative; float:left; margin-bottom:10px; width:49.6%; box-sizing:border-box}
.board_list ul.lecList>li:nth-child(even){float:right}
.board_list ul.lecList>li:nth-child(1):after, 
.board_list ul.lecList>li:nth-child(2):after{display:block; content:''; position:absolute; top:-1px; left:0px; width:100%; height:2px; 
background:#333}
.board_list ul.lecList>li.close *{color:#888; font-weight:normal}
.board_list ul.lecList>li.close p.tit a{color:#888; font-weight:normal}
.board_list ul.lecList>li>div{padding:30px 30px 27px; border:1px solid #ddd;}
.board_list ul.lecList>li p.tit{padding-right:85px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden}
.board_list ul.lecList>li p.tit a{color:#333; font-size:1.4em; font-weight:bold;}
.board_list ul.lecList>li .tag_state{position:absolute; top:25px; right:25px; min-width:60px}
.board_list ul.lecList>li ul{overflow:hidden; margin-top:20px}
.board_list ul.lecList>li ul>li{position:relative; float:left; width:50%; min-width:210px; padding-left:8px; box-sizing:border-box; text-overflow:ellipsis; overflow:hidden; white-space:nowrap}
.board_list ul.lecList>li ul>li:after{display:block; content:''; position:absolute; left:0px; top:12px; width:3px; height:3px; background:#ccc}
.board_list ul.lecList>li ul>li.long{clear:both; float:none; width:100%; }
/*** 상세 ***/
/* 작성정보,첨부파일(상세,) */
.data_list{margin-top:40px; border-top:1px solid #ccc; border-bottom:1px solid #ccc}
.add_file+.data_list{margin-top:-1px;}
.title+.data_list{margin-top:0px; border-top:0px}
.comment+.data_list{margin-top:50px}
.data_list>li{overflow:hidden; border-top:1px dotted #ccc}
.data_list>li:first-child{border-top:0px}
.data_list>li dl{display:table; width:100%}
.data_list>li.col2 dl{float:left; width:50%}
.data_list>li dl>dt, 
.data_list>li dl>dd{display:table-cell; padding:5px; padding-left:20px}
.data_list>li dl dt{width:90px; font-weight:bold; color:#333}
.data_list .local_cate{float:right; margin-left:10px}

/*******************************************************************************************************************/

@media screen and (min-width:801px){
	.dp_mb{display:none}
	.input{height:40px; line-height:40px;}
}

@media screen and (max-width:800px){
	.dp_pc{display:none}
	.btnBox{margin-top:40px; text-align:center}	
	div.search{padding:3.5% 0%}
	div.search select{width:25%;}
	div.search .word, div.search p.entertxt{padding-right:85px !important; width:55%; min-width:140px;}
	div.search .word input[type=submit], div.search p.entertxt input[type="submit"]{width:80px}
	.product>li{width:46%; margin-left:2%; margin-right:2%;}
	.product>li p.img{height:210px;}
	.product_view:after{display:block; content:''; clear:both}
	.product_view div.photo{float:none; margin-left:10%; width:80%}
	.product_view div.info{float:none; margin-top:20px; width:100%; min-height:auto}
	.board_list .oneList.haveBtn>li div.con{padding-right:0px}
	.board_list .oneList>li div.con ul.oneList_btn{position:static; text-align:center; margin-top:20px; padding:15px 10px 3px; border-top:1px dashed #ccc}
	.board_list .oneList>li div.con ul.oneList_btn li{display:inline-block}
	.board_list .oneList>li div.con ul.oneList_btn li .tag_txt{margin-right:0px}
	.board_list ul.lecList>li{width:100%; margin:3px 0px}
	.board_list ul.lecList>li:nth-child(2):after{display:none}
	.board_list ul.lecList>li.close *{color:#aaa}
	.board_list ul.lecList>li>div{padding:10px 15px 15px; border-width:0px 0px 1px 0px}
	.board_list ul.lecList>li .tag_state{top:15px; right:15px; min-width:60px; }
	.board_list ul.lecList>li ul{margin-top:8px}
	.data_list>li.col2 dl{float:none; width:100%; border-top:1px dotted #ccc}
	.data_list>li.col2 dl:first-child{border-top:0px}
	.add_file dl>dt,
	.data_list>li dl>dt,
	.add_file dl>dd,
	.data_list>li dl>dd{padding-left:15px}
	.add_file dl>dt,
	.data_list>li dl dt{width:80px}
}

@media screen and (max-width:480px){
	.product{margin-top:20px}
	.product>li{position:relative; margin:0px; padding-left:140px; width:100%; min-height:130px; border-bottom:1px solid #ddd}
	.product>li p.img{position:absolute; left:10px; top:10px; width:110px; height:110px;}
	.product>li p.img img{min-height:110px}
	.product>li p.name{margin-bottom:10px;}
	.product>li .price>p{display:block; padding-right:15px;}
	.product>li .price>p.pay{float:none; font-size:1.3em; line-height:1em;}
	.product>li .price>p.pay .cost{display:block;}
	.product>li .txt{display:none;}
	.product_view div.photo ul{padding-top:285px}
	.product_view div.photo ul li p.img{height:340px}
	.product_view div.photo ul li p.img img{height:340px}
}