@charset "utf-8";

/*
  특수교육원 진로·직업교육용 콘텐츠 COMMON STYLE
  WRITER : Kim Cheon-hyun
  Last Modify Date : 2017. 06. 08.
*/

@import url("/eduCnts/common/css/base.css");
html, body { position:relative; width:100%; height:100%; }
body { min-width:320px; min-height:480px; -webkit-text-size-adjust:none; transition: all 0.4s; }
body.sub { background:#f7f7f7; }
body.topAll .sectionTit { position:fixed; left:0; top:0; width:100%; }
body.topAll .sectionTit>span { width:100%; }
#wrap { position:relative; width:100%; min-width:320px; }
#header { position:relative; width:100%; background-color:#353b91; z-index:22; }
#container { position:relative; width:100%; height:100%; }
.content { max-width:1024px; margin:0 auto; }
#contents { position:relative; }
body.sub #contents { width:100%; height:100%; margin-right:60px; }
#contents article { padding:12px 20px 0; }
#contents article.intro,
#contents article.quiz,
#contents article.quizStyle02 { padding:0;}
#footer { position:fixed; left:0; bottom:0; width:100%; padding:20px; background-color:#fff; background:rgba(255,255,255,0.5); z-index:1100; box-sizing:border-box; }
button { overflow:visible; border:0 none; background:transparent; cursor:pointer; text-align:center; }

/* pc layout */
.sub #header { position:fixed; left:0; top:0; width:100%; }
.sub #wrap { height:100%; padding-top:108px; box-sizing:border-box;}
.sub .pageSTitle { position:fixed; left:0; top:53px; width:100%; z-index:3; }

.sliderContent,
.bx-wrapper,
.bx-viewport { height:100% !important; }

/*
.sliderContent { height:100%; }
.bx-wrapper { height:100%; }
.bx-viewport { height:100% !important; }
*/
/* // pc layout */

/* header */
.pageNavi { position:relative; line-height:53px; }
.pageNavi p { float: left; width:63px; height:53px; line-height:53px; background-color:#000560; border-right:1px solid #292e76; text-align:center; }
.pageNavi p img { padding-top:13px; }
.pageNavi>ul>li { position:relative; float:left; padding-right: 20px; padding-left:18px; border-right:1px solid #515590; }
.pageNavi>ul>li>a { display: block; padding-right:50px; background:url(/eduCnts/images/common/arrow_down.gif) right center no-repeat; white-space:nowrap; color:#fff; font-size:19px; }
.pageNavi>ul>li>ul { display:none; position:absolute; left:0; top:52px; min-width:200px; max-width:500px; line-height:1.2; background-color:#fff; border:1px solid #2f347e; }
.pageNavi>ul>li>ul>li>a { display:block; padding:5px 10px; }
.btnLnb { position:fixed; right:0; top:0; z-index:40; }
.btnLnb button { width:56px; height:53px; background:#353b91; }
#lnb { position:fixed; display: none; right:-355px; top:53px; width:300px; height:100%; background:#2f347e; z-index:40; }
#lnb ul ul { padding-left:10px; background:#fff; }
#lnb ul ul ul { padding-left:10px; }
#lnb ul ul ul ul { display:none; }
#lnb>ul>li { border-bottom:1px solid #515590; }
#lnb a { display:block; padding:3px 2px; color:#fff; font-size:1em; }
#lnb>ul>li>a { padding:10px; }
#lnb>ul>li>ul>li { border-bottom:1px solid #777; }
#lnb ul ul a { color:#000; }
#lnb ul ul ul a { color:#000; }
#lnb .otherList { overflow:hidden; }
#lnb .otherList li { float:left; width:33.33333%; text-align:center; border-left:1px solid #262a68; box-sizing:border-box; }
#lnb .otherList li:first-child { border-left:none; }
#lnb .otherList li a { padding:40px 0 10px; background-position:center 10px; background-repeat:no-repeat; }
#lnb .otherList li.otherBtn01 a { background-image:url(/eduCnts/images/common/icon_other02.png); } /* 자료창고 */
#lnb .otherList li.otherBtn02 a { background-image:url(/eduCnts/images/common/icon_other01.png); } /* 용어사전 */
#lnb .otherList li.otherBtn03 a { background-image:url(/eduCnts/images/common/icon_other03.png); } /* 이용안내 */

/* container */
.pageTitle { margin-bottom:20px; padding:20px; background-color:#f2f2f2; border-bottom:1px solid #d3d3d3; }
.borderTopLine { border-top:1px solid #d3d3d3; }
.pageTitle>h1 { max-width:921px; line-height:1; margin:0 auto; padding-left:39px; background:url(/eduCnts/images/common/icon_title.gif) no-repeat left center; font-size:1.875em; font-weight:bold; }
.pageSTitle { position:relative; min-height:54px; padding:0; background:#fff; border-bottom:1px solid #8a8a8a; box-sizing:border-box; }
.pageSTitle h1,
.pageSTitle h2 { float:left; max-width:28%; line-height:54px; color:#000; font-size:19px; box-sizing:border-box; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pageSTitle h1 { margin-left:16px; padding:0 0 0 30px; background:url(/eduCnts/images/common/icon_h1.gif) left center no-repeat; }
.pageSTitle h2 { padding-left:30px; background:url(/eduCnts/images/common/arrow_page.gif) left center no-repeat; }
.pageSTitle p.otherTxt { margin-left:16px; padding:16px 0 16px 30px; background:url(/eduCnts/images/common/icon_h1.gif) left center no-repeat; color:#000; font-size:19px; box-sizing:border-box; }
/* pageControl Area */
.controlArea { position:absolute; right:0; top:0; z-index:20; }
.controlArea .goFirst,
.controlArea .planGroup { float:left; }
.controlArea .goFirst button,
.controlArea .planGroup { border:1px solid #d66f25; border-radius:20px; overflow:hidden; }
.controlArea .goFirst { padding:9px 10px 10px 0; border-right:1px solid #dcdcdc; }
.controlArea .goFirst button { width:78px; height:36px; color:#a5450a; font-size:16px;}
.planGroup { margin:8px 10px 0 10px; padding:3px; }
.planGroup ul { display:inline; }
.pageNumList li { display:inline; }
.pageNumList li a { display:inline-block; width:28px; line-height:28px; background:#fff; border:1px solid #d36515; border-radius:20px; text-align:center; color:#d56c20; font-size:17px; }
.pageNumList li a.icon { display:none; }
.controlArea .goFirst.active button,
.pageNumList li a.active { background:#d36515; color:#fff; }
.pageLinkControl { margin-left:10px; font-size:0; }
.pageLinkControl li { display:inline-block; margin-top:4px; font-size:17px; vertical-align:top; }
.pageLinkControl li.prevBtn { margin-right:5px; padding-left:16px; background:url(/eduCnts/images/common/arrow_prev.gif) left 1px no-repeat; }
.pageLinkControl li.nextBtn { padding-left:5px; padding-right:16px; background:url(/eduCnts/images/common/arrow_next.gif) right 1px no-repeat; border-left:1px solid #eeb388; }
.pageLinkControl a { font-size:15px; color:#a5450a; }
.pageLinkControl .disabled { opacity:0.5; }
.controlArea .goLast { float:right; width:70px; line-height:55px; border-left:1px solid #dcdcdc; text-align:center; }
.controlArea .goLast button { padding-left:24px; background:url(/eduCnts/images/common/icon_btn_quiz.gif) left center no-repeat; color:#7e3319; font-size:17px; }

/* content */
/* 목차 영역 */
.sNavWrap { width: 93.75%; /* 960/1024 */ margin:0 auto; padding-bottom:3.6em; }
.sNavWrap>section { clear:both; overflow:hidden; }
.sNavWrap>section>h2 { margin:20px 0 10px; padding-left:14px; background:url(/eduCnts/images/common/icon_stitlet.gif) left center no-repeat; font-size:23px; }
.sNavList { float:left; width:31.96058%; margin-right:1.37275%; margin-bottom:10px; padding-bottom:5px; background:#fff; letter-spacing:-1px; }
.sNavList>h2,
.sNavList>h3 { padding:18px 0; border-width:1px; border-style:solid; text-align:center; color:#fff; font-size:1.3125em; font-weight:bold; }
.sNavList>h2.line01,
.sNavList>h3.line01 { background-color:#e68a01; border-color:#c4790a; }
.sNavList>h2.line02,
.sNavList>h3.line02 { background-color:#c24a25; border-color:#993213; }
.sNavList>h2.line03,
.sNavList>h3.line03 { background-color:#bc2f30; border-color:#902122; }
.sNavList>ul { border:1px solid #c5c5c5; border-top:none ; }
.sNavList>ul>li { border-top:1px solid #c5c5c5; }
.sNavList>ul li:first-child { border:none; }
.sNavList>ul>li>a { display: block; margin:0 15px; padding:13px 20px 13px 0; background:url(/eduCnts/images/common/arrow_tdown.gif) right center no-repeat; font-size:1.0625em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sNavList>ul>li.open>a { background-image:url(/eduCnts/images/common/arrow_right.gif); }
.sNavList>ul>li>div { border-top:1px solid #c5c5c5; }
.sNavList>ul>li>div>ul>li { border-top:1px solid #c5c5c5; }
.sNavList>ul>li>div>ul>li>a { display:block; padding:8px 20px 7px; font-size:0.9375em; color: #6f6f6f; }

/* sub Style */
/* chapter Style */
#chapterTit { position:fixed; left:0; top:0; width:100%; height:100%; padding:14% 10%; background-size:auto; z-index:21; box-sizing:border-box; text-align:right; }
.bgSub01 { background:#edc661 url(/eduCnts/images/sub01/bg_chapter01.png) 0 100% no-repeat; }
.bgSub02 { background:#edc661 url(/eduCnts/images/sub02/bg_chapter01.png) 0 100% no-repeat; }
.bgSub03 { background:#edc661 url(/eduCnts/images/sub03/bg_chapter01.png) 0 100% no-repeat; }
.bgSub04 { background:#edc661 url(/eduCnts/images/sub04/bg_chapter01.png) 0 100% no-repeat; }
article { width:auto; height:100%; box-sizing:border-box; overflow:hidden; }
article.intro { background:#f3f2f3; }
article section { width:auto; max-width:1024px; margin:0 auto; }
/* intro Layout */
.intro section { overflow:hidden; height:100%; text-align:center; padding-bottom:50px; box-sizing:border-box; }
.intro section.active { cursor:pointer; }
.intro section video { width:auto; max-width:970px; height:580px; }
.quiz section { max-width:none; margin:0; }
.conSlide { overflow:hidden; }
.conSlide div { position:relative; width:100%; overflow:hidden; padding-left:40px; box-sizing:border-box; }
.conSlide div.checkAnswer,
.conSlide div.checkAnswer div{ padding:0; }
.conSlide div.checkAnswer div.scrollHeight { overflow:auto; }
.checkAnswer .quizScroll { position:relative; width:90%; max-height:450px; margin:0 auto; overflow-y:auto; overflow-x:hidden; }
.checkAnswer .answer .scrollTop { width:96.4%; margin:0 auto; padding-right:14px; }
.checkAnswer .quizScroll table.quizTable { width:100%; }
.checkAnswer .quizScroll table.quizTable thead { display:none; }
.conSlide [aria-hidden='true'] { visibility:hidden !important; }
/* content01 */
/*
.defaultPage h2 { margin-bottom:18px; padding:2px 0 20px 20px; color:#222; font-size:22px; vertical-align:middle; }
.defaultPage h2 span { display:inline-block; line-height:30px; margin-right:8px; padding:0 16px; background-color:#fff; border:2px solid #c7c7c7; border-radius:15px; color:#353b91; font-size:20px; }
*/
.defaultPage .pageVideo { width:100%; max-height:430px; padding-bottom:50px; }
.defaultPage .pageFrame { width:100%; height:430px; border:none; }
.answer .pageVideo,
.answer .pageFrame { width:94%; height:430px; border:none; }
.defaultPage h2,
.defaultPage h3 { padding:10px 0 20px; font-size:33px; text-align:center; }
.defaultPage h2.smallTxt { font-size:25px; }

/* default Style */
.fullImg,
.defaultList { text-align:center; }
.fullImg { padding-bottom:2%; }
.fullImg textarea { width:90%; height:500px; padding:2%; font-size:21px; box-sizing:border-box; }
.defaultList,
ul.count3,
ul.imgSort,
.lineList>ul { font-size:0; }
ul.count3>li { display:inline-block; width:33%; font-size:17px; }
ul.imgSort { margin:0 5%; }
ul.imgSort>li,
.defaultList>li,
.btnSlideList li { display:inline; }
p.rePoint { max-width:840px; margin:0 auto; padding-bottom:14px; text-align:right; color:#6a6a6a; font-size:19px; }
p.contentTopTxt,
div.contentTopTxt { max-width:700px; margin:0 auto; padding-bottom:10px; color:#333; font-size:21px; }
div.contentTopTxt p { padding-bottom:14px; }
div.contentTopTxt dl dt { padding-bottom:6px; }
div.contentTopTxt dl dd { margin-left:10px; padding-left:14px; background:url(/eduCnts/images/common/bol_quiz.gif) left center no-repeat; }
ul.blockList li { display:block; padding:5px 0; }
ul.blockList li.btnSpeak button { margin:0; padding:0; border:none; }
.defaultList>li>div { display:inline-block; width:32%; margin:0 0.5%; padding-bottom:2%; vertical-align:top; }
ul.imgSort>li>div { display:inline-block; text-align:center; vertical-align:middle; }
ul.imgSort>li>div>p.tit span { display:inline-block; padding:20px 10px; background:url(/eduCnts/images/common/bu_imgtit.gif) left center no-repeat; text-align:center; color:#444; font-size:21px; }
ul.imgSort>li.before>div { width:50%; }
ul.imgSort>li.arrow>div { width:10%; }
ul.imgSort>li.after>div { width:40%; vertical-align:bottom; }
ul.jolib>li.before>div { width:60%; }
ul.jolib>li.arrow>div { width:10%; }
ul.jolib>li.after>div { width:30%; vertical-align:bottom; }
.pageTable,
.scrollHeight { width:100%; max-height:460px; overflow:auto; }
.pageTable table { width:100%; margin:0 auto; }
.pageTable th,
.pageTable td { padding:4px 8px; border:1px solid #777; box-sizing:border-box; }
.pageTable th { width:30%; color:#fff; font-size:21px; }
.pageTable thead th { background:#0d80c8; }
.pageTable tbody th { background:#0d80c8; text-align:left; }
.pageTable th.inputTh { background-color:#fff; }
.pageTable td { width:auto; background:#fff; }
.pageTable .thBig th { width:auto; }
.pageTable .thBig td { width:14%; }
.pageTable th.inputTh input { width:100%; }
.pageTable td textarea { width:100%; max-height:200px; padding:10px; border:1px solid #ccc; font-size:19px; box-sizing:border-box; }
.pageTable input.pageInputAnswer { width:100%; padding:5px 0; text-align:center; border:3px solid #cfbdab; border-radius:10px; box-sizing:border-box; }
.btnSlideList { text-align:center; }
.btnSpeak,
.btnMovie,
.btnDetail { text-align:center; vertical-align:middle; }
.btnSpeak { clear:both; }

.btnSpeak button,
.btnMovie a,
.btnDetail a { display:inline-block; min-width:233px; margin:4px; padding:0 20px; border-radius:10px; color:#fff; font-size:23px; box-sizing:border-box; }
.btnSpeak button,
.btnMovie a,
.btnDetail a { background-color:#fff; font-size:18px; }
.btnSpeak button { border:1px solid #1d9f67; }
.btnMovie a { border:1px solid #d36515; }
.btnDetail a { border:1px solid #e4520a; }
.btnSpeak button span,
.btnMovie a span,
.btnDetail a span { display:inline-block; line-height:50px; padding-left:66px; }
.btnSpeak button span { background:url(/eduCnts/images/common/btn_speak.png) left center no-repeat; color:#039347; }
.btnMovie a span { background:url(/eduCnts/images/common/btn_movie.png) left center no-repeat; color:#a6440f; }
.btnDetail a span { background:url(/eduCnts/images/common/btn_detail.png) left center no-repeat; color:#e4520a; }
.defaultList .btnSpeak button,
.defaultList .btnMovie a,
.defaultList .btnDetail a { min-width:140px; margin:4px; }
.defaultList .btnSpeak button span { padding:10px 5px 10px 66px; line-height:1.2; text-align:left; }
.defaultList .btnMovie a span { padding:10px 5px 10px 50px; line-height:1.2; text-align:left; }
.defaultList .btnDetail a span { padding:10px 5px 10px 66px; line-height:1.2; text-align:left; }
/*
.btnSpeak button,
.btnMovie a { display:inline-block; width:60px; height:60px; margin:6px 4px; padding:0; background-color:#fff; background-position:center; background-repeat:no-repeat; border:1px solid; border-radius:50px; color:transparent; text-indent:-9999px; }
.btnSpeak button { background-image:url(/eduCnts/images/common/icon_speck.gif); border-color:#d45016; }
.btnMovie a { background-image:url(/eduCnts/images/common/icon_movie.gif); border-color:#0da55c; }
.btnDetail a { background-color:#d34f15; }
.btnDetail a span { display:inline-block; line-height:50px; padding-left:50px; }
.btnDetail a span { background:url(/eduCnts/images/common/icon_detail.png) left center no-repeat; }
*/
.defaultPage .bx-controls { position:absolute; left:0; top:0; width:63px; height:100%; background:#d6d6d6 url(/eduCnts/images/common/bg_pagenavi3.gif) right top repeat-y; }
.defaultPage .bx-controls-direction { display:none; }
.defaultPage .bx-pager { position:absolute; width:63px; height:100%; }
.defaultPage .bx-controls p.pageTit { padding:6px 0; background:#117853; color:#fff; }
.defaultPage .bx-controls p.pageTit span { display:block; text-align:center; }
.defaultPage .bx-pager div a { display:block; line-height:38px; margin-top:-1px; border:1px solid #d0d0d0; text-align:center; color:#010101; font-size:17px; }
.defaultPage .bx-pager div a.active { position:relative; background:#159768; border:1px solid #006842; text-decoration:underline; color:#fff; }
dl.imgList,
dl.dtQuList { overflow:hidden; margin-left:20px; }
dl.imgList>dt,
dl.dtQuList>dt { float:left; width:24%; }
dl.imgList>dt { margin-top:10%; }
dl.imgList>dd { margin-left:25%; }
dl.imgCount2>dt,
dl.dtQuList>dt { width:42%; }
dl.imgCount2>dd,
dl.dtQuList>dd { margin-left:43%; }
dl.imgCount3>dt { width:30%; }
dl.imgCount3>dd { margin-left:30%; }
.imgConList { font-size:0; }
.imgConList li { display:inline; font-size:19px; }
.imgConList li div { display:inline-block; padding-bottom:10px; text-align:center; }
dl.imgCount2>dd .imgConList li div { width:50%; }
dl.imgCount2>dd .imgConList li.fullColume div { width:100%; }
dl.imgList>dd .imgCount3 li div,
dl.imgCount3>dd .imgConList li div { width:33.33333%; }
.lineList>ul>li { display:inline; text-align:center; font-size:17px; }
.lineList>ul>li>div { position:relative; display:inline-block; width:33.33333%; padding:2% 1%; box-sizing:border-box; }
.lineList>ul>li>div i { display:none; }
.lineList>ul>li.active>div i,
.lineList>ul>li>div.lock i { display:block; position:absolute; left:0; top:20px; width:100%; height:40px; background:transparent url(/eduCnts/images/common/icon_checkqu.png) 16% center no-repeat; color:transparent; }
.lineList>ul>li>div.call i.true { background-color:#00f; }
.lineList>ul>li>div.call i.false { background-color:#333; }
.contQuiz>ul>li>div { background-image:url(/eduCnts/images/common/bu_line.png); background-repeat:no-repeat; }
.contQuiz>ul.lineTop>li>div { background-position:center bottom; }
.contQuiz>ul.lineBottom>li>div { background-position:center top; }
.contQuiz .pcView { display:block; line-height:1; }
.contQuiz .moView { display:none; }
.listCount2>li>div { width:49%; }
.listCount4>li>div { width:24%; }
.listCount5>li>div { width:19%; }
.txtBox { margin:0 5%; padding:10px 3.4%; background:#004b74; border-radius:10px; color:#fff; font-size:22px; word-break:keep-all; }
dl.anList { overflow:hidden; max-width:800px; margin:0 auto; }
dl.anList dt { float:left; width:20%; padding-top:80px;}
dl.anList dd { float:right; width:77%; }
/* 콘텐츠 내 이미지 전화 스타일 */
.clickOpen .answer { display:none; }
/* 콘텐츠 내 테이블 및 계획 스타일 */
.quistionTable {}
.quistionTable .quistion { padding:2px 0 12px 26px; background:url(/eduCnts/images/sub04/icon_question.png) left 2px no-repeat; color:#444; font-size:23px; font-weight: bold; }
.quistionTable .centerMargin { margin-left: 164px; }
.quistionTable .AlignRight { color: #a0a0a0; font-size:17px; }
.tableLayout p.tit { float:left; width:164px; background:url(/eduCnts/images/sub04/line_tit.png) right 104px no-repeat; }
.tableLayout .tableArea { margin-left:164px; padding-top:20px; }
.tableLayout table { width:99%; border:1px solid #d0c4bc; box-sizing: border-box; }
.tableLayout table th,
.tableLayout table td { padding:6px 5px; background:#fff; border:1px solid #e8e8e8; vertical-align: middle; font-size:17px; }
.tableLayout table th { background:#005d93; border-bottom:1px solid #014e7a; color: #fff; }
.tableLayout table td textarea { width:100%; height:2em; border: none; }
.tableLayout table td.bigTxt { color: #0074b7; font-size: 21px;}
/* 콘텐츠 내 체크 스타일 */
.conCheckList {}
.conCheckList p.img { float:left; width:50%; text-align:center; }
.bgBoxRadio { max-width:374px; margin-left:50%; padding:20px; background:url(/eduCnts/images/sub04/bg_13010302.png) center top no-repeat; box-sizing:border-box; }
.radioListArea { background:#fff; border-radius:20px; }
.radioListArea p.txt { min-height:86px; padding:20px 10px 20px 110px; background:#077a9e url(/eduCnts/images/sub04/icon_book.png) 10px 20px no-repeat; border-top-left-radius: 20px; border-top-right-radius: 20px; color:#fff; font-size:20px; }
.radioListArea ol { padding:10px 16px; }
.radioListArea ol li { margin-bottom:10px;}
.radioListArea ol li img { padding-right:5px; vertical-align:middle; }
.radioListArea ol li label { display:block; padding:4px 0; background:url(/eduCnts/images/sub04/icon_radio.png) right center no-repeat; vertical-align:middle; color:#044a7b; font-size:22px; cursor: pointer; }
.radioListArea ol li label.on { background-image:url(/eduCnts/images/sub04/icon_radio_on.png); }
.radioListArea ol li input { display:none; }
/* 콘텐츠 테이블 스타일 */
.tableBgStyle { max-width: 722px; margin:0 auto; padding:10px 20px; background:url(/eduCnts/images/sub04/bg_13020201.png) center top no-repeat; box-sizing: border-box; }
.tableBgStyle table { width:60%; }
.tableBgStyle table th,
.tableBgStyle table td { padding:5px 8px; border:1px solid #d3d3d3; vertical-align: middle; }
.tableBgStyle table th { width:20%; background:#5a5b7a; border-bottom-color: #4d4e6d; color:#fff; font-size:19px; }
.tableBgStyle table td { background:#fff; }
.tableBgStyle table td dt { padding:0 0 0 16px; background:url(/eduCnts/images/sub04/icon_question2.png) left center no-repeat; color: #be0b0b; font-size: 17px; }
.tableBgStyle table td dd input { width:100%; padding:1px 5px; border: 3px solid #cfbdab; border-radius:20px; box-sizing: border-box;}
/* popup Layer */
/*.popLayer { position:fixed; left:0; top:0; width:100%; height:100%; background:#f00; z-index:30; }*/
/*.popupLayout { position:absolute; left:0; top:0; width:50%; background:#fff; }*/
.popView { display:none; }
.popupLayout { position:relative; background:#fff; border-radius:12px; }
.popupLayout h3 { height:68px; min-height:1em; line-height:68px; padding:0 80px 0 34px; background:#5056af; border-top-right-radius:12px; border-top-left-radius:12px; text-align:left; color:#fff; font-size:25px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.popupLayout p.txt,
.popupLayout p.txt02,
.popupLayout ul.txt { margin:2% 2% 0 4%; text-align:left; }
.popupLayout p.txt,
.popupLayout ul.txt li { padding:0 0 0 10px; background:url(/eduCnts/images/common/bu_popli.gif) left 11px no-repeat; font-size:21px; letter-spacing:-1px; word-break:keep-all; }
.popupLayout p.txt span { font-weight:bold; }
.popupLayout p.txt02 { padding-right:2%; padding-bottom:20px; color:#064f94; font-size:21px; text-indent:-16px; word-break:keep-all; }
.popupLayout .fullImg { padding:4%; }
.popupLayout .fullImg img { border:1px solid #d0c4bc; }
.popupLayout .img { padding:20px; text-align:left; font-size:0; }
.popupLayout .img>li { display:inline; font-size:3px; text-align:center; }
.popupLayout .img>li>div { display:inline-block; width:25%; padding:1% 0; }
.popupLayout .col2>li>div { width:50%; }
.popupLayout .col3>li>div { width:33.33333%; }
.popupLayout .col4>li>div { width:25%; }
.popupLayout .img>li span { display:block; font-size:23px; }
.popupLayout .popVideo { width:100%; height:530px; padding-bottom:20px; overflow:hidden; }
.popupLayout .popVideo video { width:100%; height:100%; }
.popupLayout .popVideo .pageFrame { width:90%; height:90%; margin:5%; } /* 1018수정 */
.popupLayout p.btnClose { position:absolute; right:30px; top:20px; }
.popupLayout p.btnClose button { color:#fff; font-size:21px; }
.popupLayout .btnSpeak { padding:10px; }
.popupLayout .btnSpeak button { width:100%; margin:0; }
.popupLayout .dtCon { width:98%; max-height:300px; margin:3% auto; text-align:left; overflow-y:auto; }
.popupLayout .dtCon dl { margin-bottom:20px; color:#064f94; }
.popupLayout .dtCon dl dt { font-size:21px; }
.popupLayout .dtCon dl dd { margin-left:10px; padding:5px 0 0 12px; background:url(/eduCnts/images/common/bu_dd.png) left 14px no-repeat; font-size:17px; }
.popupLayout .popTable { width:96%; margin:0 auto; padding:2% 0; }
.popupLayout .popTable table { width:100%; }
.popupLayout .popTable table thead th,
.popupLayout .popTable table tbody td { padding:5px; border:1px solid #d4d4d4; }
.popupLayout .popTable table thead th { background:#1666b0; color:#fff; font-size:21px; }
.popupLayout .popTable table tbody td { vertical-align:middle; color:#072746; font-size:21px; }
/* contentStyle01 */
/* 평가하기 확인 팝업 */
.answerPop { display:none; }
.answerPopArea { width:100%; height:200px; background:#f00; }
.answerPopArea p.txt { height:160px; text-align:center; }
.answerPopArea p.btnClose { width:100%; height:40px; background:#00f; }
/* //평가하기 확인 팝업 */
/* 음성자막 스타일 */
.soundTrack { display:none; position:fixed; left:0; bottom:0; width:100%; min-width:320px; height:100%; background:rgba(0,0,0,0.3); z-index:1200; }
.soundTrack .innerSound { position:absolute; left:0; bottom:-100%; width:100%; min-height:150px; padding:20px 20px 40px 240px; background:#fff; box-sizing:border-box;}
.soundTrack .innerSound .soundIcon { position:absolute; left:26px; top:-56px; width:196px; height:205px; font-size:25px; }
.sortLayer { display:none; }
.soundTrack .innerSound h3 { padding-right:150px; padding-bottom:10px; font-size:31px; color:#c96606; }
.soundTrack .sortLayer p { width:100%; font-size:21px; word-break:keep-all; height:3.6em; overflow-y:auto; }
.soundTrack .sortLayer p a { text-decoration: underline; }
.soundTrack .innerSound ul.btnControl { position:absolute; right:80px; top:10px; }
.soundTrack .innerSound ul.btnControl li { display:inline; }
.soundTrack .innerSound p.btnClose { position:absolute; right:26px; top:14px; }
.soundTrack .innerSound p.btnClose button { color:#000; font-weight:bold; }

/* quiz Layout */
/*
.quiz { position:relative; }
.quiz section { position:relative; height:100%; }
.quiz form { height:100%; }
.quiz .question { float:left; width:194px; height:100%; padding:30px 0 0; background:#e4720d; color:#fff; font-size:18px; box-sizing:border-box;}
.quiz .question h2 { padding-bottom:10px; font-size:24px; }
.quiz .question p.bgIcon { position:absolute; left:12px; bottom:0; }
.quiz .answer { margin-left:250px; padding-top:4%; color:#877e77; }

.quiz .question p.txt { line-height:1.2; padding-bottom:10px; word-break:keep-all; }
.quiz .question dl { position:relative; margin-top:20px; background:#cf5800; border:3px solid #fff0b4; border-radius:14px; z-index:2; }
.quiz .question dl dt { max-width:70%; line-height:32px; margin:-20px auto 0; padding:0 10px; background:#e67a11; border:3px solid #fff0b4; border-radius:20px; text-align:center; }
.quiz .question dl dd { padding:10px 4px 10px 24px; font-size:17px; box-sizing:border-box; }
.quiz .question dl dd ol li { line-height:1.4; padding-bottom:10px; word-break:keep-all; }
.quiz .question dl dd ol li b { display:inline-block; min-width:1em; margin-left:-16px; margin-right:4px; }

.quiz .answer ul { font-size:0; }
.quiz .answer ul>li { font-size:18px; }
*/
#contents .quizStyle02 { padding:0; background:#f2f2f2; }
.quizStyle02 .titArea { position:absolute; left:0; top:0; width:194px; height:100%; background:#d9610c; z-index:10; }
.quizStyle02 .tit { position:relative; height:102px; background:#b53b10; z-index:12; }
.quizStyle02 .tit h2 { padding-top:15px; text-align:center; color:#fff; font-size:31px; }
.quizStyle02 .noSlide h2 { padding-top:30px; }
.quizStyle02 .titArea p.bgIcon { position:absolute; left:0; bottom:0; width:300px; }
.quizStyle02 .quizSlide { height:100%; box-sizing:border-box; overflow:hidden; }
.quizStyle02 .quizArea { height:100%; padding-left:194px; box-sizing:border-box;}
.quizStyle02 .bx-controls { position:absolute; left:0; top:62px; width:194px; background:url(/eduCnts/images/common/bg_quiznum01.png) left bottom repeat-x; text-align:center; color:#fff; z-index:20; }
.quizStyle02 .bx-controls-direction { display:none; }
/*.quizStyle02 .bx-pager { background:; }*/
.quizStyle02 .bx-pager-item { display:inline-block; }
.quizStyle02 .bx-controls a { display:block; width:50px; line-height:47px; margin:0 1px; background:#be5207 url(/eduCnts/images/common/bg_quiznum02.png) left bottom repeat-x; border-top-left-radius:10px; border-top-right-radius:10px; color:#f5e4dd; font-size:27px; text-align:center; }
.quizStyle02 .bx-controls a.active { background:#d9610b; color:#f5e4dd; font-weight:bold; }
.quizStyle02 .question { padding:10px 5% 10px 5%; background:#f9f9f9; border-bottom:1px solid #dcdcdc; font-size:19px; box-sizing:border-box;}
.quizStyle02 .question h3 { display:none; }
.quizStyle02 .question p.txt { margin-bottom:8px; padding-left:10px; background:url(/eduCnts/images/common/bu_line.png) left 6px no-repeat; }
.quizStyle02 .question dl { margin-bottom:8px; }
.quizStyle02 .question dl dt,
.quizStyle02 .question dl dd { vertical-align:top; }
.quizStyle02 .question dl dt { float:left; width:74px; line-height:24px; background:#7c6963; border-radius:5px; text-align:center; color:#fff; font-size:16px; }
.quizStyle02 .question dl dd { margin-left:84px; color:#7d4e39; font-size:19px; }
.quizStyle02 .question dl dd ul li { display:inline-block; padding:0 10px 5px; }
.quizStyle02 .question dl dd ul.ListBlock li { display:block; }
.quizStyle02 .answer { margin-left:40px; padding-top:20px; }

/* quiz Content Style */
.quiz { position:relative; }
.quiz .answer,
.quizArea .answer { position:relative; z-index:11;}
.quiz .answer h4 { margin-left:3%; padding:10px 0; }
.quiz .answer .quizImg { margin:10px; text-align:center; }
.quiz .answer .answerList,
.quiz .answer .imgList{ max-width:900px; margin:0 auto; }
.quiz .answer ul.answerList { font-size:0; }
.quiz .answer ol.answerList li { padding:10px; color:#3e3936; vertical-align:middle; font-size:20px; }
.quiz .answer ol.answerList li>span,
.quiz .answer ol.answerList li>p.AlignRight>span { position:relative; display:inline-block; margin:0 10px; padding:4px 10px; background:#fff; border:2px solid #cfbdab; border-radius:20px; }
.quiz .answer li input { text-align:center; box-sizing:border-box; }
.quiz .answer ol.answerList li>p.AlignRight>span input,
.quiz .answer ol.answerList li>span input { width:9em; height:24px; background:transparent; border:none; text-align:center; font-size:1em; }
.quiz .answer ul.answerList>li { position:relative; display:inline; text-align:center; font-size:19px; }
.quiz .answer ul.answerList>li div { position:relative;/* 1018수정 */ display:inline-block; margin-bottom:5px; padding:5px 1%; box-sizing:border-box; }
.quiz .answer ul.count4>li div { width:24%; }
.quiz .answer ul.count3>li div { width:33.33333%; }
.quiz .answer ul.count2>li div { width:50%; }
.quiz .answer ul.count2>li div img { max-width:260px; }
.quiz .answer ul>li.AlignCenter div { display:block; margin:0 auto; }
.quiz .answer ul.answerList>li span,
.quizArea .answer .quizTable td span { position:relative; display:block; max-width:210px; width:100%; margin:6px auto; padding:4px 10px; background:#fff; border:3px solid #cfbdab; border-radius:22px; box-sizing:border-box; }
.quiz .answer ul.answerList>li span.inlineBlock { display:inline-block; }
.quiz .answer ul.answerList>li img.ValignMiddle { padding-right:5px; }
.quiz .answer ul.answerList.BlockList>li { display:block; }
.quiz .answer ul.answerList.BlockList>li div { width:100%; text-align:left; }
.quiz .answer ul.answerList.BlockList>li div span { display:inline-block; }
.quiz .answer ul.answerList>li span input,
.quizArea .answer .quizTable td span input { width:100%; border:none; background:transparent; }
.quiz .answer .answerList li span.anTrue,
.quizArea .answer .quizTable td span.anTrue { padding-left:30px; }
.quiz .answer .answerList li span.anTrue i,
.quizArea .answer .quizTable td span.anTrue i { position:absolute; left:6px; top:5px; width:24px; height:24px; background:url(/eduCnts/images/common/icon_antrue.png) center no-repeat; vertical-align:middle;}
.quiz .answer .answerList li span.anFalse i,
.quizArea .answer .quizTable td span.anFalse i { position:absolute; left:50%; top:16px; width:90%; height:2px; margin-left:-45%; background:url(/eduCnts/images/common/icon_anfalse.png) center repeat-x; }
.quiz .answer p.pointTxt { padding:10px 20px; text-align:right; color:#d9610c; font-size:19px; }
/* 퀴즈 테이블 스타일 */
.quizArea .answer .quizTable { width:92%; margin:0 auto; background:#fff; }
.quizArea .answer .quizTable th,
.quizArea .answer .quizTable td { padding:4px 8px; box-sizing:border-box; }
.quizArea .answer .minHeight th,
.quizArea .answer .minHeight td { padding:0 8px; }
.quizArea .answer .quizTable thead th { padding:10px 8px; background:#0d80c8; border-left:1px solid #0c71b0; color:#fff; font-size:21px; }
.quizArea .answer .quizTable thead th.yesCol { background-color:#007090; }
.quizArea .answer .quizTable thead th.noCol { background-color:#025c76; }
.quizArea .answer .quizTable thead th.col01 { background-color:#0a6197; }
.quizArea .answer .quizTable thead th.col02 { background-color:#970a3c; }
.quizArea .answer .quizTable thead th.col03 { background-color:#00478f;}
.quizArea .answer .quizTable thead th.col04 { background-color:#006f8f;}
.quizArea .answer .quizTable thead th:first-child { border-left:none; }
.quizArea .answer .quizTable tfoot th,
.quizArea .answer .quizTable tbody th,
.quizArea .answer .quizTable td { border:1px solid #d3d3d3; font-size:19px; vertical-align:middle;}
.quizArea .answer .quizTable th { word-break:keep-all; }
.quizArea .answer .quizTable tfoot th,
.quizArea .answer .quizTable tbody th { max-width:none; background:#f3faff; }
.quizArea .answer .quizTable th img { max-width:240px; }
.quizArea .answer .quizTable td span { max-width:90%; }
.quizArea .answer .quizTable td span input { text-align:center; }
.quizArea .answer .quizTable td span.totalNum { height:40px; line-height:40px; padding:0; border:none; font-size:20px; }
.quizArea .answer .quizTable td.imgCell { background:#addaf6; text-align:center; }
/* 상중하 체크 */
.quizArea .checkAnswer table { width:100%; margin-bottom:24px; }
.quizArea .checkAnswer table th,
.quizArea .checkAnswer table td{ min-width:100px; padding:10px 10px; border:1px solid #c5c5c5; }
.quizArea .checkAnswer table th { background-color:#eee; font-weight:normal; }
.quizArea .checkAnswer table tbody th { background-color:#eee; vertical-align:middle; }
.quizArea .checkAnswer table td { position:relative; text-align:center; }
.quizArea .checkAnswer table td input[type="radio"] { position:absolute; overflow:hidden; left:0; top:0; width:1px; height:1px; margin-left:-9999px; text-indent:-9999px; }
.quizArea .checkAnswer table td label { display:inline-block; width:100%; height:50px; color:transparent; cursor:pointer; }
.quizArea .checkAnswer table td.on label { background:url(/eduCnts/images/common/icon_check_answer.png) center no-repeat; }
.quizArea .OXStyle02 table td.on label.yes { background:url(/eduCnts/images/common/icon_check_yes.png) center no-repeat; }
.quizArea .OXStyle02 table td.on label.no { background:url(/eduCnts/images/common/icon_check_no.png) center no-repeat; }
/* 선긋기 퀴즈 */
section.lineAnswer .answer>div { position:relative; width:100%; height:100%; overflow:hidden; }
section.lineAnswer .answer>div ul { width:40%; margin:0; padding:0; }
section.lineAnswer .answer>div ul>li { margin-bottom:4px; overflow:hidden; }
section.lineAnswer .answer>div>ul>li>div i { display:none; }
section.lineAnswer .answer>div>ul>li.active>div i,
section.lineAnswer .answer>div>ul>li>div.lock i{ display:block; position:absolute; left:0; top:0; width:100%; height:40px; background:url(/eduCnts/images/common/icon_checkqu.png) 0 center no-repeat; color:transparent; }
section.lineAnswer .answer>div>ul>li>div.call i.true { background:#00f; }
section.lineAnswer .answer>div>ul>li>div.call i.false { background:#333; }
section.lineAnswer .answer>div ul li img,
section.lineAnswer .answer>div ul li span { display:block; text-align:center;}
.quiz section ul.lineTop>li>div,
.quiz section ul.lineBottom>li>div { position:relative; display:inline-block; cursor:pointer; vertical-align:top; }
.quiz section ul.lineTop>li.active,
.quiz section ul.lineBottom>li.active { font-style:italic; text-decoration:underline; }
.quiz section ul.lineTop { float:left; }
.quiz section ul.lineBottom { float:right; }
.quiz section ul.lineTop>li { padding-right:15px; background:url(/eduCnts/images/common/bol_quiz.gif) right center no-repeat; }
.quiz section ul.lineBottom>li { padding-left:15px; background:url(/eduCnts/images/common/bol_quiz.gif) left center no-repeat; }
.quiz section ul.lineTop>li>div { float:right; width:60%; min-width:11em; height:100%; padding:10px; background:#d3ebff; border-radius:10px; box-sizing:border-box; }
.quiz section ul.largeHeight>li>div { margin:20px 0; }
.quiz section ul.backgroundNone>li>div { width:auto; min-width:0; /* padding:0 10px; */ padding:0; background:none; border-radius:0; }
.quiz section svg { float:left; width:20%; padding:0; }
svg { width:100%; padding:0; box-sizing:border-box; }
svg line { display:none; stroke:#f00; stroke-width:2px; }
/* 4지선다 */
.quiz p.quizTopTxt { padding-bottom:20px; color:#222; font-size:23px; }
.quiz .quizBox { width:98%; background:url(/eduCnts/images/common/bg_quizbox.png); border:1px solid #d1c5bd; }
.quiz .quizBox ol { min-height:300px; padding:2%; background:url(/eduCnts/images/common/bg_quizbox2.png) right bottom no-repeat; }
.quiz .textList li { position:relative; padding:2% 0; color:#494949; font-size:21px; }
.quiz .textList li.on { color:#f60; }
.quiz .callReturn li.on { text-decoration:line-through; }
.quiz .callReturn li.correct.on { text-decoration:none; }
.quiz .textList input,
.quiz .answer ol.imgList input { position:absolute; overflow:hidden; left:0; top:0; width:1px; height:1px; margin-left:-9999px; text-indent:-9999px; }
.quiz .answer ol.imgList { font-size:0; }
.quiz .answer ol.imgList>li { position:relative; display:inline; text-align:center; font-size:19px; }
.quiz .answer ol.imgList>li>div { display:inline-block; width:50%; margin-bottom:5px; padding:5px 1%; box-sizing:border-box; }
.quiz .answer ol.imgList>li label { position:relative; display:inline-block; cursor:pointer;}
.quiz .answer ol.imgList>li span { position:absolute; display:block; right:17px; top:17px; width:46px; line-height:30px; background:#2172aa; border-radius:5px; color:#fff; }
.quiz .answer ol.imgList>li.on span { background:#e1620e; }
.quiz .answer ol.imgList>li i { display:none; }
.quiz .answer ol.imgList>li.on.correct i{ display:block; position:absolute; left:-10px; top:-10px; width:40px; height:40px; background:url(/eduCnts/images/common/icon_checkqu.png) center no-repeat; color:transparent; z-index:3; }
.quiz .leftRight p.viewQuestion { float:left; width:29%; margin-top:50px; text-align:center; }
.quiz .leftRight ol.imgList { margin-left:30%; }
/* scene Style */
.sceneStyle { overflow:hidden; max-width:670px; margin:0 auto; background:url(/eduCnts/images/sub04/line_scene.png) center top repeat-y; }
.sceneStyle>div { position:relative; width:50%; max-width:334px; }
.sceneBG2103>div { background:url(/eduCnts/images/sub04/bg_scene2103.png) center bottom no-repeat; }
.sceneStyle .scene1 { float:left; text-align:right; }
.sceneStyle .scene2 { float:right; }
.sceneBG2103>div ul { padding-bottom:250px; text-align:center; }
.sceneStyle ul li { padding-bottom:10px;}
.sceneStyle ul li button { max-width:245px; width:80%; height:74px; border:2px solid; border-radius:10px; overflow:hidden; }
.sceneStyle ul li.on button { text-indent:-9999px; }
.sceneStyle ul li button.false { color:#ff8400; }
.sceneStyle ul li button.true { color:#007ae2; }
.imgTureFalse ul { text-align:center; font-size:0; }
.imgTureFalse ul li { display:inline-block; width:50%; text-align:center; font-size:17px; }
.imgTureFalse ul li button { max-width:320px; max-height:400px; width:100%; height:100%; margin:0; padding:0; border-radius:0; }
.imgTureFalse ul li .questionImg { display:block; }
.imgTureFalse ul li .answerImg { display:none; }
.imgTureFalse ul li.on .questionImg { display:none; }
.imgTureFalse ul li.on .answerImg { display:block; }
.sceneStyle ul li.on button.false { background:#ff8400 url(/eduCnts/images/sub04/icon_scenefalse.png) center no-repeat; color:#ff8400; }
.sceneStyle ul li.on button.true { background:#007ae2 url(/eduCnts/images/sub04/icon_scenetrue.png) center no-repeat; color:#007ae2; }
.sceneStyle p { position:absolute; left:0; bottom:0; width:100%; padding:14px 5px; text-align:center; color:#fff; font-size:21px; box-sizing:border-box; }
.sceneStyle .scene1 p { background:rgba(255,67,67,0.85); }
.sceneStyle .scene2 p { background:rgba(204,50,50,0.85); }
/* turn Style */
.turnAnswer .turnArea li button { width:100%; height:auto; }
.turnAnswer .turnArea ul.answerList li div span { position:absolute; left:50%; top:50%; width:80px; line-height:80px; /*margin:0 0 0 -34px;*/margin:-50px 0 0 -40px;/* 1018수정 */ padding:0; border-radius:50%; text-align:center; color:#000; font-size:41px; font-weight:bold; }
.turnAnswer .turnArea.callReturn div.true button span { width:100%; line-height:100px; margin-left:-19%; border-radius:0; color:#00f; }
.turnAnswer .turnArea.callReturn div.false button span { color:#f00; font-size:21px; }
.turnAnswer .turnArea.callReturn div.true button span:before { content:"맞아요"; }
.turnAnswer .turnArea.callReturn div.false button span:before { content:"틀려요"; }
.turnAnswer .listLine ol>li { position:relative; width:96%; margin-bottom:22px; border-radius:40px; }
.turnAnswer .listLine ol>li.listCol1 { background-color:#5b92c5; }
.turnAnswer .listLine ol>li.listCol2 { background-color:#4f81af; }
.turnAnswer .listLine ol>li.listCol3 { background-color:#43719b; }
.turnAnswer .turnArea ol>li.listCol4 { background-color:#396186; }
.turnAnswer .listLine ol>li.turnItem>div span { position:absolute; left:10px; top:10px; width:57px; height:57px; line-height:57px; background:#fff; border-radius:50%; font-size:41px; font-weight:bold; }
.turnAnswer .listLine ol>li.listCol1>div span { color:#5b92c5; }
.turnAnswer .listLine ol>li.listCol2>div span { color:#4f81af; }
.turnAnswer .listLine ol>li.listCol3>div span { color:#43719b; }
.turnAnswer .listLine ol>li.listCol4>div span { color:#396186; }
.turnAnswer .listLine ol>li.turnItem button { width:100%; height:77px; padding-left:80px; color:#fff; font-size:22px; text-align:left; box-sizing:border-box;}
.turnAnswer .listLine ol>li.turnItem button span { padding-left:0; text-align:center; }
.turnAnswer .listLine .teacher { position:absolute; right:0; bottom:0; width:26%;}
.turnAnswer .listLine.callReturn div.true button span,
.turnAnswer .listLine.callReturn div.false button span { width:57px; line-height:57px; margin:0; border-radius:50%; }
.turnAnswer .listLine.callReturn div.false button span { display:none; }
.turnAnswer .listLine.callReturn div.true button span:before { content:""; }
.turnAnswer .listLine.callReturn div.false button span:before { content:""; }
/* OX 문제 */
.OXAnswer dl.oxQuiz { margin:10px; border:1px solid #c5c5c5; }
.OXAnswer div.oxQuiz { margin:10px auto; max-width:960px; }
.OXAnswer .oxQuiz dt { padding:5px; border-bottom:1px solid #c5c5c5; text-align:center; font-size:17px; }
.OXAnswer .oxQuiz dd { text-align:center; }
.OXAnswer .oxQuiz dd ul,
.OXAnswer div.oxQuiz ul { font-size:0; }
.OXAnswer .oxQuiz dd ul li,
.OXAnswer div.oxQuiz ul li { position:relative; display:inline-block; width:48%; padding:1% 1%; text-align:center; }
.OXAnswer .oxQuiz dd ul li label,
.OXAnswer div.oxQuiz ul li label { position:relative; display:inline-block; font-size:15px; }
.OXAnswer .oxQuiz dd ul li label span,
.OXAnswer div.oxQuiz ul li label span { position:absolute; display:block; left:0; top:0; width:100%; height:100%; border-radius:20px; }
/*
.OXAnswer .oxQuiz dd ul li.nonActive label span,
.OXAnswer div.oxQuiz ul li.nonActive label span { background-image:url(/eduCnts/images/common/icon_quizx.png); background-color:rgba(0,0,0,0.7); background-position:center; background-repeat:no-repeat; }
.OXAnswer .oxQuiz dd ul li.correct.active label span,
.OXAnswer div.oxQuiz ul li.correct.active label span{ background-image:url(/eduCnts/images/common/icon_quizo.png); background-color:rgba(0,0,0,0.7); background-position:center; background-repeat:no-repeat; }
*/
.OXAnswer .oxQuiz dd ul li input,
.OXAnswer div.oxQuiz ul li input { position:absolute; left:0; top:0; width:1px; height:1px; margin-left:-9999px; overflow:hidden; }
.conOxQuiz .OXAnswer .answer ul { float:left; width:50%; border:1px dotted #333; border-top:none; box-sizing:border-box; }
.conOxQuiz .OXAnswer .answer ul.leftNone { clear:left; border-left:none; }
.conOxQuiz .OXAnswer .answer ul.borderNone { clear:left; float:none; margin:0 auto; border:none; }
/* textAreaQuiz */
.txtAreaQuiz { padding-bottom:40px; }
.txtAreaQuiz textarea.quizTextarea { width:100%; height:3em; padding:5px; border:3px solid #cfbdab; border-radius:10px; box-sizing:border-box; font-size:20px; font-family:'Noto Sans KR'; }
.fullText { padding-bottom:40px; }
td.fullText { padding-bottom:0; }
.fullText textarea { width:95%; height:300px; padding:1%; border:3px solid #cfbdab; border-radius:10px; font-size:20px; font-family:'Noto Sans KR'; }
td.fullText textarea { height:50px; }
.textAreaDl { width:96%; margin:0 auto;}
.textAreaDl dt { padding:10px; font-size:21px; }
/* click view Style */
.viewArea ul { font-size:0; text-align:center; }
.viewArea ul li { display:inline; }
.viewArea ul li div { display:inline-block; max-width:320px; margin:0 auto; font-size:17px; }
.viewArea ul li button { width:90%; height:56px; margin-top:20px; background:#ffc947; border:1px solid #ddc59d; border-radius:10px; color:#ffc947; }
.viewArea ul li.on button { color:#fff; }
/* quiz Btn */
.btnArea { position:relative; width:100%; }
.quiz .btnList { padding-top:10px; text-align:center; font-size:0; }
.quiz .btnList li { display:inline; padding:0; }
.quiz button,
.btnSlideList .resetBtnApp,
.btnSlideList .answerBtnApp,
.btnSlideList .addBtn,
.btnSlideList .delBtn { min-width:138px; height:44px; background-color:transparent; color:#fff; font-size:19px; }
.quiz .resetBtnApp,
.btnSlideList .resetBtnApp,
.btnSlideList .addBtn { background-color:#934902; border-top-left-radius:20px; border-bottom-left-radius:20px; }
.quiz .answerBtnApp,
.btnSlideList .answerBtnApp,
.btnSlideList .delBtn { background-color:#d86a00; border-top-right-radius:20px; border-bottom-right-radius:20px; }
.btnList li .VisibleHidden { padding:0 !important; border-radius:0 !important; min-width:1px !important; text-indent:-9999px; }
.oneButton { margin:0; border-radius:20px; }
.btnSlideList .resetBtnApp { height:56px; margin-right:-2px; margin-top:10px; }
.btnSlideList .answerBtnApp { height:56px; margin-left:-2px; margin-top:10px; }
.btnSlideList .addBtn { margin-right:-2px; margin-top:10px; }
.btnSlideList .delBtn { margin-left:-2px; margin-top:10px; }
.printBtn { position:absolute; right:5%; bottom:0; }
.printBtn.PositionRelative { position:static; margin-top:20px; margin-right:50px; text-align:right; }
.defaultPage .printBtn { bottom:10px; }
.printBtn button { width:130px; height:36px; padding-right:10px; background:#391f06 url(/eduCnts/images/common/btn_print.gif) 86% center no-repeat; border-radius:5px; color:#fff; font-size:19px; box-sizing:border-box; }

/* 기타 페이지 스타일 */
.otherColor,
.otherContent { background:#f2f2f2; }
.dictionary,
.dataroom,
.infoArea { max-width:940px; margin:27px auto; }
.searchGroup { margin-bottom:20px; }
div.searchArea,
div.searchList,
.infoArea .infoTxt { overflow:hidden; background:#fff; border:1px solid #d7d7d7; }
div.searchArea { margin-bottom:20px; padding:16px 8px 0; border-radius:10px; }
div.searchArea ul,
div.searchArea dl { padding-bottom:14px; }
div.searchArea ul,
div.searchArea dl,
div.searchArea dl dt,
div.searchArea dl dd { float:left; }
div.searchArea ul { margin-right:10px; font-size:0; }
div.searchArea ul li,
div.searchArea dt,
div.searchArea dd { display:inline; }
div.searchArea ul li a { display:inline-block; width:33px; line-height:33px; margin:0 2px 2px; background:#fff; border:2px solid #dadada; border-radius:50%; text-align:center; color:#dadada; font-size:21px; font-weight:bold; }
div.searchArea ul li.active a { background:#e58a00; border-color:#e58a00; color:#fff; }
div.searchArea dl { background:url(/eduCnts/images/dictionary/line_search.png) left 10px no-repeat; }
div.searchArea dt { line-height:33px; padding:0 10px; color:#222; font-size:19px; }
div.searchArea dd { border:1px solid #eaeaea; font-size:17px; }
div.searchArea dd input.inputSearch { width:150px; height:33px; background:#f7f7f7; border:none; }
div.searchArea .selectList { float:none; margin-left:-1%; padding:0 20px 16px; text-align:center; font-size:0; }
div.searchArea .selectList li { display:inline; }
div.searchArea .selectList li.btn { display:block; }
div.searchArea .selectList li select { width:24%; height:38px; margin-left:1%; border:1px solid #d7d7d7; box-sizing:border-box; font-size:17px; }
div.searchArea .selectList li input { width:99%; height:38px; margin-left:1%; margin-top:10px; background:#0858bb; border:none; color:#fff; font-size:17px; }
div.searchList { margin-bottom:16px; padding:20px 30px; }
div.searchList ul { font-size:0; }
div.searchList ul li { display:inline; }
div.searchList ul li a { display:inline-block; width:50%; min-width:130px; line-height:30px; padding:0 0 0 10px; background:url(/eduCnts/images/dictionary/bu_list.png) left 14px no-repeat; vertical-align:top; color:#555; font-size:17px; box-sizing:border-box; }
div.searchList ul li.active a { background-image:url(/eduCnts/images/dictionary/bu_list_on.png); color:#e58a00; font-weight:bold; text-decoration:underline; letter-spacing:-0.1px; }
div.searchList ul li.noData { display:block; width:100%; padding:10px; text-align:center; font-size:21px; box-sizing:border-box; }
.boardList>ul { font-size:0; }
.boardList>ul>li { display:inline-block; width:48%; margin:0 1% 20px; background:#fff; }
.boardList>ul>li.noData { display:block; width:98%; }
.boardList>ul>li a,
.boardList>ul>li p { display:block; padding:16px; border:1px solid #d7d7d7; box-shadow:3px 3px 3px #dedede; font-size:17px; }
.boardList>ul>li p { padding:20px 5px; font-size:21px; text-align:center; }
.boardList>ul>li dl dt { width:100%; padding-bottom:14px; color:#393f46; font-size:24px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.boardList>ul>li dl dd { margin-left:72px; }
.boardList>ul>li dl dd.img { float:left; width:56px; margin-left:0; }
.boardList>ul>li dl dd.txt { display:block; height:2.4em; min-height:2.4em; padding:10px 0 5px; color:#72767e; font-size:17px; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
.boardList>ul>li dl dd.date { text-align:right; }
.boardList>ul>li dl dd.date span { display:inline-block; padding-left:20px; background:url(/eduCnts/images/dataroom/icon_date.gif) left center no-repeat; color:#6f7a84; font-size:15px; }
.pageList { text-align:center; }
.pageList ul { font-size:0; }
.pageList ul li { display:inline; }
.pageList ul li a,
.pageList ul li strong { display:inline-block; min-width:38px; line-height:36px; margin-left:-1px; background:#fff; border:1px solid #dadada; font-size:13px; box-sizing:border-box; }
.pageList ul li.pageBtn a { width:45px; }
.pageList ul li a { color:#6f6f70; }
.pageList ul li strong { background:#8b5400; border-color:#8b5400; color:#fff; text-decoration:underline; }
.resultGroup h3 { padding:0 0 14px 30px; background:url(/eduCnts/images/dictionary/icon_dictionary.png) left 3px no-repeat; color:#e58a00; font-size:21px; }
.resultGroup div { line-height:1.8; padding:15px 20px; background:#fffbf5; border-top:1px solid #e58a00; color:#321f03; font-size:17px; }
.resultGroup div p.img { max-width:400px; margin:20px auto; text-align:center; }
.resultGroup div p.img img { border:1px solid #b4b4b4; }
.boardView .viewArea { padding:20px 0; border-bottom:1px solid #d7d7d7; text-align:center; }
.boardView .viewArea p.img { width:90%; margin:0 auto; }
.boardView .viewArea p.img img { border:1px solid #d7d7d7; box-shadow:3px 3px 3px #dedede; }
.boardView .viewArea .videoArea { display:block; width:90%; margin:0 auto; }
.boardView .viewArea h3 { padding:20px 20px 0; color:#393f46; font-size:26px; }
.boardView .viewArea p.txt { padding:20px; color:#72767e; font-size:21px; }
.boardView .viewArea ul { text-align:right; }
.boardView .viewArea ul li { padding-right:20px; font-size:16px; }
.boardView .viewArea ul li.file { color:#c97600; }
.boardView .viewArea ul li.file img { padding-right:5px; vertical-align:middle; }
.boardView .viewArea ul li.date { padding-left:20px; background:url(/eduCnts/images/dataroom/icon_date.gif) left center no-repeat; color:#6f7a84; }
.boardView .btnArea { padding:20px; text-align:center; }
.boardView .btnArea li { display:inline; }
.boardView .btnArea li a { display:inline-block; min-width:300px; line-height:54px; margin:0 5px; padding:0 20px; border-radius:5px; }
.boardView .btnArea li a span { display:inline-block; padding-left:30px; background-position:left center; background-repeat:no-repeat; color:#fff; font-size:21px; font-weight:bold; }
.boardView .btnArea li a.btnDown { background:#d46516; }
.boardView .btnArea li a.btnDown span { background-image:url(/eduCnts/images/common/icon_down.gif); }
.boardView .btnArea li a.btnList { background:#934902; }
.boardView .btnArea li a.btnList span { background-image:url(/eduCnts/images/common/icon_list.gif); }
.infoArea .infoTxt { margin-bottom:20px; padding:20px; border-radius:10px; }
.infoArea .infoTxt p { margin-bottom:10px; color:#343434; font-size:16px; }
.infoArea .infoTxt ul { font-size:0; }
.infoArea .infoTxt ul li { display:inline; }
.infoArea .infoTxt dl { display:inline-block; width:24%; padding:1% 0.5%; vertical-align:top;  text-align:center; }
.infoArea .infoTxt dl dt { padding:70px 0 10px; color:#282828; font-size:17px; }
.infoArea .infoTxt dl.use01 dt { background:url(/eduCnts/images/info/icon_use01.gif) center 13px no-repeat; }
.infoArea .infoTxt dl.use02 dt { background:url(/eduCnts/images/info/icon_use02.gif) center top no-repeat; }
.infoArea .infoTxt dl.use03 dt { background:url(/eduCnts/images/info/icon_use03.gif) center 8px no-repeat; }
.infoArea .infoTxt dl.use04 dt { background:url(/eduCnts/images/info/icon_use04.gif) center 1px no-repeat; }
.infoArea .infoTxt dl dd { color:#606060; font-size:14px; word-break:keep-all; }
.infoArea .tabList { border-bottom:1px solid #686b93; text-align:center; font-size:0; }
.infoArea .tabList li { display:inline; }
.infoArea .tabList li a { display:inline-block; min-width:230px; line-height:48px; background:#fff; border:1px solid #686b93; border-bottom:none; color:#717279; font-size:18px; }
.infoArea .tabList li.active a { background:#686b93; color:#fff; }
.infoArea .infoList { padding:0 30px; background:#fff; }
.infoArea .infoList dl { position:relative; padding:20px 0 20px 100px; border-top:1px solid #dfdfe2; }
.infoArea .infoList dl:first-child { border-top:none; }
.infoArea .infoList dl dt { min-height:3em; padding-bottom:16px; color:#343871; font-size:17px; font-weight:bold; word-break:keep-all; }
.infoArea .infoList dl dt strong { position:absolute; left:0; top:14px; color:#343871; font-size:40px; }
.infoArea .infoList dl dt span { color:#d20505; }
.infoArea .infoList dl dd.img { margin-bottom:20px; }
.infoArea .infoList ol { margin:20px; }
.infoArea .infoList li { margin-bottom:6px; color:#321f03; font-size:15px; }
/* clearfix */
.pageNavi:after,
.sNavWrap:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }
.pageNavi,
.sNavWrap {display: inline-block;}
* html .pageNavi,
* html .sNavWrap {height: 1%;}
.pageNavi,
.sNavWrap {display: block;}

@media only screen and (min-width: 1200px) {
    .intro section.wide { max-width:none; }
    .intro section.wide video { width:auto; max-width:none; height:100%; }
}
@media only screen and (max-width:960px) {
    .turnAnswer .listLine .teacher { display:none; }
}

@media only screen and (max-width: 768px) {
    .sNavWrap { padding-bottom:0; }
    #footer { position:static; left:0; bottom:0; }
    /* 목차 */
	.sNavList { width:100%; float:none; margin-bottom:20px; }

    /* tablet layout */
    .sub #header { position:relative; }
    .sub #wrap { width:auto; height:auto; padding-top:0; padding-right:0; box-sizing:border-box;}
    .sub #container { width:auto; height:auto; }
    .sub .pageSTitle { position:relative; top:0; }
    .sub .pageSTitle h1 { max-width:none; }
    .sub .pageSTitle h2 { display:none; }
    #wrap #chapterTit { background-size:50%; z-index:1000; }
    section h2 { margin-top:80px; text-align:center; }
    .question h2 { margin-top:0; }
    /* #wrap section h2 span { display:table; margin:0 auto; } */
    /* slider 해제 */
    .sliderContent,
    .conSlide,
    .quizSlide { transform:none !important; }
    .conSlide div,
    .quizArea { float:none !important; }
    .prevConBtn,
    .nextConBtn { display:none !important; }
    article { min-height:auto; }
    .intro section { padding-top:0; }
    .intro section video { max-width:100%; max-height:480px; }
    .conSlide [aria-hidden='true'] { visibility:visible !important; }
    .conSlide div { padding-left:0; }
    /* // tablet layout */
    /* 상단 네비 */
    .pageNavList { display:none; }
    .controlArea { display:none; }

    /* popupLayer */
    .popView { display:block; padding-top:40px; }
    .popupLayout { margin-bottom:30px; }
    .popupLayout h3 { height:auto; line-height:1.4; padding:10px; font-size:20px; letter-spacing:-1px; }
    .popupLayout .popVideo { height:auto; padding:0; }
    .popupLayout p.btnClose { display:block; }
    .popView .popupLayout p.btnClose { display:none; }
    /* content Style */
    .popupLayout .FloatLeft,
    .popupLayout .FloatRight { float:none; width:100% !important; }
    .defaultList { text-align:left; }
    .defaultList li,
    .popupLayout .img>li { display:inline-block; width:50%; }
    .defaultList li div,
    .popupLayout .img>li div { display:block; width:100%; text-align:center; }
    .fullImg img,
    .defaultList li div img { width:90%; }
    .bx-controls { display:none; }
    .lineList { overflow:hidden; padding-bottom:3%; }
    .lineList>ul { width:45%; }
    .lineList>ul.lineTop,
    .lineList>ul.topLine { float:left; }
    .lineList>ul.bottomLine,
    .lineList>ul.lineBottom { float:right; }
    .lineList>ul>li { display:block; }
    .lineList>ul>li>div { display:block; width:100%; padding:1% 2%; }
    .contQuiz>ul.lineTop>li>div { background-position:right center; }
    .contQuiz>ul.lineBottom>li>div { background-position:left center; }
    .contQuiz .pcView { display:none; }
    .contQuiz .moView { display:block; float:left; width:10%; }
    #wrap .btnSpeak,
    #wrap .btnMovie,
	#wrap .btnDetail { position:static; } 
    #wrap .btnSpeak button,
    #wrap .btnMovie a,
	#wrap .btnDetail a{ width:90%; padding:0 2%; font-size:16px; letter-spacing:-1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-sizing:border-box; }

    /* 콘텐츠 내 체크 스타일 */
    .conCheckList { overflow:hidden; }
    .conCheckList p.img { float:none; width:100%; text-align:center; }
    .bgBoxRadio { max-width:none; margin-left:0; padding:0; background:none; }
    .radioListArea { background:#fff; border-radius:20px; }
    .radioListArea ol li label { font-size:16px; }
    /* 콘텐츠 테이블 스타일 */
    .tableBgStyle { max-width:none; margin:0 auto; padding:0; background:none; }
    .tableBgStyle table { width:100%; }
    .tableBgStyle table th,
    .tableBgStyle table td { padding:2px 4px; }
    .tableBgStyle table th,
    .tableBgStyle table td dt { font-size: 16px; }
    
    /* quiz Layout */
    .quizStyle02 .titArea { position:relative; left:0; top:0; width:100%; }
    .quizStyle02 .tit { height:60px; }
    .quizStyle02 .titArea p.bgIcon { display:none; }
    .quizStyle02 .quizArea { padding:0; }
    .quiz .answer { margin-left:0; }
    .quiz .answer ul.count3 li div { width:50%; padding:1%; }
    .quiz .answer ul.answerList li input { max-width:210px; width:100%; }
    .conOxQuiz .OXAnswer .answer ul { float:none; width:100%; }
    
    /* dataroom */
    .boardList>ul>li { display:block; width:98%; }
    
    /* 소사이즈 보정 */
    #contents article { padding:10px; }
    .defaultPage h2, .defaultPage h3 { margin:20px 0; padding:10px; background:#37c; color:#fff; }
    .defaultPage h2, .defaultPage h3,
    .quizStyle02 h2 { font-size:20px !important; text-align:left !important; }
	.defaultPage h2 span, .defaultPage h3 span { margin:0 !important; text-align:left; }
    .quizStyle02 h2 { padding:20px 10px !important; padding-left:10px;}
    .quizStyle02 .question { min-height:auto; padding-top:10px; font-size:16px; }
    .quiz .textList li,
	.quizStyle02 .question dl dd{ font-size:16px; }
    .quizArea .answer .quizTable thead th,
    .quizArea .answer .quizTable tbody th,
    .quizArea .answer .quizTable td { font-size:16px; }
    .quizArea .answer .quizTable td span { min-width:98px;}
    .quizArea .checkAnswer table th, .quizArea .checkAnswer table td { min-width:54px; }
    .quiz button, .btnSlideList .resetBtnApp, .btnSlideList .answerBtnApp, .btnSlideList .addBtn, .btnSlideList .delBtn { min-width:100px; height:30px; font-size:16px;}
/*    .quiz .btnList { text-align:left; }*/
    .printBtn { display:none; }
    .popupLayout h3 { padding:10px; font-size:18px; }
    .soundTrack .innerSound { padding:40px 20px 20px 10px; }
    .soundTrack .innerSound .soundIcon { display:none; }
    .soundTrack .innerSound h3 { font-size:20px; }
	.textAreaDl dt,
    .soundTrack .sortLayer p { font-size:16px; }
	.turnAnswer .listLine ol > li.turnItem button { padding:0 80px; text-align:left; font-size:18px; letter-spacing:-1px; }
	.turnAnswer .listLine ol > li.turnItem button span { text-align:center; text-indent:0; }
    div.searchArea .selectList li select { width:49%; margin-bottom:5px; }
    .popupLayout p.txt, .popupLayout p.txt02, .popupLayout ul.txt li,
	.popupLayout .dtCon dl dd,
	p.contentTopTxt,
	.popupLayout .popTable table thead th, .popupLayout .popTable table tbody td { font-size:16px; }
	.popupLayout .dtCon dl dt { font-size:18px; }

    /* 이용안내 */
    .infoArea .infoTxt ul li { display:block; }
    .infoArea .infoTxt dl { width:98%; padding:1% 1%; vertical-align:top; text-align:center; }
    .infoArea .infoTxt dl dd { text-align:left; }
    .infoArea .tabList li { display:block; }
    .infoArea .tabList li a { width:100%; box-sizing:border-box; }
    .infoArea .infoList dl { padding-left:0; }
    .infoArea .infoList dl dt { padding-left:70px; }
    .infoArea .infoList ol { margin:10px; }
}

@media only screen and (max-width: 480px) {
    /* quiz */
    /* .quiz .answer ul.count3 li div,
    .quiz .answer ul.answerList li img { width:50%; } */
    .quiz .answer ul.answerList li input { max-width:100%; }
    /* 자료창고 */
    div.searchArea .selectList li select { width:99%; }
    /* 음성자막 */
/*
    .soundTrack .innerSound { padding-left:130px; }
    .soundTrack .innerSound .soundIcon { left:0; top:-34px; width:120px; height:auto; }
*/
}

@media only screen and (max-height: 760px) {
    .fullImg img { max-height:400px; }
    video { max-height:600px; }
    .quiz .question p.bgIcon { display:none; }
}
@media only screen and (max-height: 700px) {
    .fullImg img { max-height:280px; }
    video { max-height:400px; }
}

@media print {
    @page{ size:a4;}
    body { width:100%; }
    #header,
    #lnb,
    .btnLnb,
    .pageSTitle,
    .bx-controls,
    .titArea,
    .btnList,
    .printBtn,
    .btnSlideList,
    #wrap [aria-hidden="true"],
    .lineList>ul>li>div.lock i { display:none !important; }
    #wrap { float:none; }
    .bx-viewport,
    article,
    .quizStyle02 .quizSlide { overflow:visible !important; }
    .sliderContent,
    .conSlide,
    .quizSlide { transform:none !important; }
    .sub #wrap,
    .conSlide div,
    .sub .quizArea,
    .sub .answer { margin:0; padding:0; }
    .conSlide, .conSlide>div, .defaultPage, .quizStyle02, .quizSlide, .quizArea { max-width:none !important; width:100% !important; }
    .conSlide div .pageTable,
    .scrollHeight,
    .conSlide div.checkAnswer div.scrollHeight { width:100%; max-height:none; overflow:visible; }
    .quiz .checkAnswer table td.on label { color:#000; }
    #wrap input { width:100%; border:none; }
    .txtAreaQuiz textarea.quizTextarea { width:auto; height:auto; }
    td.txtAreaQuiz textarea.quizTextarea { width:98%; }
    ::-webkit-input-placeholder{color:transparent;} /* WebKit browsers */
    :-moz-placeholder{color:transparent;} /* Mozilla Firefox 4 to 18 */
    ::-moz-placeholder{color:transparent;} /* Mozilla Firefox 19+ */
    :-ms-input-placeholder{color:transparent;} /* Internet Explorer 10+ */
    .checkAnswer .quizScroll { max-height:none; overflow:visible; }
    .checkAnswer .answer .scrollTop { display:none; }
    .checkAnswer .quizScroll table.quizTable thead { display:table-header-group; }
    .checkAnswer .quizScroll table.quizTable td label { height:22px; }
}