﻿@charset "utf-8";

/*Common*/
html, body {margin:0; padding:0; background-color:#fff; width:100%; height:100%; font-family: 'Arial','Verdana','sans-serif','Dotum','돋움'; color:#666; font-size:12px;}
hr {display:none;}
img,fieldset {border:0 none;outline:none;}
dl,ul,ol,li {list-style: none;}
h1,h2,h3,h4,h5,dl,dt,dd,ul,li,ol,th,td,p,blockquote,form,fieldset,legend {margin:0; padding:0; font-weight:normal;}
table {border-collapse:collapse; font-size:12px;}
a {background-color:transparent;}
a ,a:link, a:hover {text-decoration:none; color:#5f5f5f;} 
a:hover {text-decoration:none; color:#5f5f5f;} 
a:active {text-decoration:none;}
input,select,textarea {color:#666; margin:0; padding:0; font-size:12px; font-family: 'Arial','Verdana','sans-serif','Dotum','돋움'; border:1px solid #d8d8d8;}
select {border:1px solid #c1c1c1;}
body {font-size:12px;}
caption {display:none;}
table {border-collapse:collapse;}
focus {outline:none;}
em {font-style: normal;}
.border_none {border:none !important;}
.tl {text-align:left !important;}
.tc {text-align:center !important;}
.tr {text-align:right !important;}

/*Login*/
#login_wrap {background:#000; width:100%; min-height:100%;}
#login_container {background:url(../images/bg_login.gif) no-repeat; width:1200px; height:800px; margin:0 auto; padding:30px 0; position:relative;}
.login_title {text-align:center; margin-top:60px;}
.login_title dt {font-size:40px; color:#fff;}
.login_title dd {font-size:28px; color:#bbb; }
.login_input_wrap {width:344px; height:252px; border:1px solid #333; text-align:center; position:absolute; right:150px; top:330px;}
.login_input_wrap p {background:#191919; height:47px; line-height:47px; color:#777; font-size:14px; }
.login_input {padding:20px;}
.login_input li {width:300px; height:43px; background:#fff; border:1px solid #666; text-align:left; margin-bottom:10px;}
.login_input li input {height:43px; border:none; margin:0 0 0 70px; width:220px; background:none; color:#fff; font-size:16px; outline:none;}
.login_input .user {background:url(../images/ico_user.png) 25px 12px no-repeat;}
.login_input .pw {background:url(../images/ico_pw.png) 25px 12px no-repeat;}
.login_input .btn_login {background:#333; color:#fff; cursor:pointer; height:50px; line-height:50px; font-size:20px; text-align:center; display:block;}
.login_input .btn_login:hover {}

/*Home*/
#home_wrap {background:#000; width:100%; height:100%; min-height:700px; min-width:1100px; overflow:hidden;}
#home_wrap .container {width:1024px; height:100%; margin:0 auto; position:relative;}
#home_wrap .header {padding:20px 0 35px;}
.home_contents {padding:50px 35px; color:#fff;}
.home_contents .line {display:block; position:absolute; top:98px; left:0; width:100%; height:100%; box-sizing:border-box;}
.home_contents .line:after {display:block; content:''; width:100%; height:100%; border:1px solid #804033; box-sizing:border-box;}
.home_contents h2 {font-size:45px; margin-bottom:40px;}
.home_contents .info_wrap {font-size:15px; line-height:21px; min-height:300px;}
.home_contents .btn_wrap {text-align:center; width:954px; z-index:10; margin-top: -5%;}
.home_contents .btn_wrap a {border:1px solid #888888; font-size:24px; display:inline-block; height:50px; line-height:48px; width:170px; padding:0 10px; color:#fff; text-align:center; transition:all .8s ease;}
.home_contents .btn_wrap a:hover {background:#fff; color:#000;}

/*Header*/
#header_wrap {background:#000;}
#header_wrap .header * {vertical-align:middle;}
#header_wrap .header {width:1024px; margin:0 auto; text-align:center; position:relative; height:86px;}
#header_wrap h1 {display:inline-block; position:absolute; left:0; top:20px;}
#header_wrap .name {display:table-cell; color:#fff; height:86px; width:1024px;}
#header_wrap .name dt {font-size:22px; position:relative; top:2px;}
#header_wrap .name dd {font-size:16px; color:#ddd;}
#header_wrap .title {margin-left: 27%; display: inline-block;}
#header_wrap .privacy_policy {width: 30%; float: right; font-size: 15px !important; top: 25px !important;}
#header_wrap .privacy_policy a {color: white !important;}
#header_wrap .logout {position:absolute; top:34px; right:0; color:#999; font-size:14px; transition:color .8s ease;}
#header_wrap .logout:hover {color:#ddd;}
#header_wrap .logout img {position:relative; top:-3px; margin-left:5px;}

/*GNB*/
.gnb_wrap {background:#e1e1e1;}
.gnb_wrap ul {width:1024px; margin:0 auto; text-align:center;}
.gnb_wrap li {display:inline-block; height:40px; line-height:42px; position:relative;}
.gnb_wrap li a {display:inline-block; padding:0 25px; font-size:13px; color:#666; transition:color .8s;}
.gnb_wrap li a:hover {color:#000;}
.gnb_wrap li a.active {color:#804033;}
.gnb_wrap li a:after {content:''; width:1px; height:9px; background:#c1c1c1; display:block; position:absolute; top:50%; right:0; margin-top:-4px;}
.gnb_wrap li a:after:last-child {width:0;}

/**Container**/
#container {width:1024px; margin:20px auto;}
#contents h4 {color:#804033; font-size:16px; margin-bottom:10px; position:relative;}

/*Update Screen*/
.screen_wrap {margin-bottom:20px;}
.screen_wrap .btn_wrap {position:absolute; right:0; }
.screen_wrap .btn_wrap a {font-size:13px; color:#804033; border:1px solid #804033; padding:0 5px; min-width:170px; text-align:center; transition:all .8s ease; height:23px; line-height:25px; display:inline-block;}
.screen_wrap .btn_on {font-size:13px; color:#666; margin-right:10px; }
.screen_wrap .btn_on input {position:relative; top:2px; margin-right:3px;}
.screen_wrap h4 a:hover {background:#804033; color:#fff;}
.screen_wrap textarea {width:1002px; height:125px; padding:10px; font-size:13px;}

.course_wrap table {width:100%; margin-bottom:20px;}
.course_wrap td {padding:5px 0;}
.course_wrap .title {font-size:14px; color:#000;}
.course_wrap .input input {width:95%; padding:0 10px; height:29px; line-height:31px;}
.course_wrap .button input {background:#999; color:#fff; text-align:center; font-size:13px; width:100%; border:none; cursor:pointer; font-family:'Arial'; height:31px; line-height:33px;}

.btn_bottom {text-align:center; margin-top:50px;}
.btn_bottom input {display:inline-block; font-size:15px; background:#000; min-width:198px; padding:0 5px; height:41px; line-height:41px; text-align:center; font-family:'Arial'; color:#fff; cursor:pointer; border:none; clear:both; transition:all .8s;}
.btn_bottom input:hover {color:#000; background:#fff;}
.btn_bottom a {display:inline-block; font-size:15px; background:#000; min-width:198px; padding:0 5px; height:39px; line-height:39px; text-align:center; font-family:'Arial'; color:#fff; cursor:pointer; border:none; clear:both; transition:all .8s; margin:0 3px; border:1px solid transparent}
.btn_bottom a.btn_type2 {background:#6f6f6f;}
.btn_bottom a:hover {color:#000; background:#fff; border:1px solid #ddd;}

/*Course Manage*/
.search_wrap * {vertical-align:middle;}
.search_wrap {background:#f7f7f7; padding:15px; text-align:center; font-size:14px; }
.search_wrap span {display:inline-block;}
.search_wrap span:first-child {margin-right:20px;}
.search_wrap span:last-child {margin-left:5px;}
.search_wrap label {margin-right:20px;}
.search_wrap input {padding:0 5px; height:29px; line-height:29px;}
.search_wrap .btn {background:#000; height:31px; line-height:33px; width:125px; padding:0 10px; border:none; color:#fff; font-size:14px; cursor:pointer; transition:all .8s; display:inline-block; font-family:'Arial';}
.search_wrap .btn:hover {background:transparent; color:#000;}

.list_wrap {margin:15px 0;}
.list_wrap p {text-align:right;}
.list_wrap p input {text-align:center; border:1px solid #804033; color:#804033; height:27px; line-height:27px; padding:0 5px; background:#fff; font-size:13px; width:110px; cursor:pointer; transition:all .8s ease;}
.list_wrap p a:hover {background:#804033; color:#fff;}
.list_wrap p a {display:inline-block; text-align:center; border:1px solid #804033; color:#804033; height:25px; line-height:27px; padding:0 5px; background:#fff; font-size:13px; width:110px; cursor:pointer; transition:all .8s ease; }
.list_wrap p input:hover {background:#804033; color:#fff;}
.list_wrap table {width:100%; border-top:1px solid #d2d2d2; border-bottom:1px solid #d2d2d2; margin-top:7px;}
.list_wrap tr {border-bottom:1px solid #e6e6e6;}
.list_wrap tr:last-child {border-bottom:none;}
.list_wrap tr:hover {background:#f9f9f9;}
.list_wrap th {background:#f7f7f7; height:45px; color:#000; border-right:1px solid #e6e6e6; border-bottom:1px solid #d2d2d2; cursor:text;}
.list_wrap th:last-child {border-right:none;}
.list_wrap td {text-align:center; padding:5px 10px; border-right:1px solid #e6e6e6; height:26px;}
.list_wrap td:last-child {border-right:none;}
.list_wrap .btn_manage a {background:#f7f7f7; border:1px solid #e1e1e1; height:22px; line-height:24px; padding:0 10px; width:65px; display:inline-block; margin:0 2px; font-family:'Arial';}
.list_wrap .btn_manage a:hover {color:#000;}

.pager_wrap * {vertical-align:middle;}
.pager_wrap {text-align:center;}
.pager_wrap a {display:inline-block; padding:0 15px; color:#888;}
.pager_wrap a:hover {color:#804033; text-decoration:underline;}
.pager_wrap a.active {color:#804033; text-decoration:underline;}
.pager_wrap .active {color:#804033; text-decoration:underline;}
.pager_wrap .btn_arrow {padding:0 3px;}

.index {position:absolute; right:0; color:#000; }

.upload_wrap table {width:100%;}
.upload_wrap td {padding:10px 0;}
.upload_wrap .title {font-size:13px; color:#000; width: 15%;}
.upload_wrap .input {width:60%;}
.upload_wrap .input input {width:90%; padding:0 10px; height:29px; line-height:31px; color:#999;}
.upload_wrap .image img {width:260px; height:182px; border:1px solid #aaa;}

/*Course Search Popup*/
.popup_wrap .outer_table {width: 650px; margin: 1.5%; border-top: 1px solid #CCCCCC; border-bottom: 1px solid #CCCCCC;}
.popup_wrap .inner_table {width: 100%; height: 100%;}
.popup_wrap .table_header {width: 100px; background-color: #f7f7f7; color: black; font-weight: bold; vertical-align: middle; text-align: center;}
.popup_wrap .search_number {width: 40px; color: black; font-weight: bold}
.popup_wrap .search_name {width: 70px; color: black; font-weight: bold}
.popup_wrap .outer_row {height: 50px; border-bottom: 1px solid #CCCCCC;}
.popup_wrap select {height: 150px; width: 100%;}

/*User Main*/
.user_main_wrap .news {background:#f7f7f7; border:1px solid #e7e7e7; padding:5px 5px 5px 150px; height:36px; line-height:36px; position:relative; font-size:13px; color:#666; margin-bottom:25px;}
.user_main_wrap .news span {display:inline-block; min-width:90px; height:34px; line-height:36px; position:absolute; left:5px; background:#804033; font-size:14px; color:#fff; padding:0 10px; }
.user_main_wrap .news span:after {left:100%; top:50%; border:solid transparent; content:" "; height:0; width:0; position:absolute; pointer-events:none; z-index:20; border-left-color:#804033; border-width:17px; margin-top:-17px;}

.content_wrap {position:relative; height:580px;}
.link_contents {display:inline-block; width: 95%;}
.link_contents dl {display:inline-block; width:316px; margin:0 22px 15px 0; border:1px solid #c8c8c8;}
.link_contents dt img {width:316px; height:204px;}
.link_contents dd {font-size:15px; color:#000; text-align:center; height:37px; display:table-cell; width:316px; border-top:1px solid #c8c8c8; }
.search_contents {position:absolute; right:0; top:0;}
.search_contents .search * {vertical-align:middle;}
.search_contents .search input {height:37px; padding:0 10px; width:230px; margin-right:7px; font-size:14px;}
.search_contents .search a {display:inline-block;}
.search_contents .search_list {border:1px solid #d8d8d8; padding:15px; margin-top:20px; height:420px; overflow-y:scroll;}
.search_contents .search_list a {border-bottom:1px solid #e6e6e6; height:39px; line-height:39px; font-size:13px; display:block; padding:0 10px;}
.search_contents .search_list a:hover {background:#804033; color:#fff;}

/*Marquee*/
@keyframes marquee {
    0%   { text-indent: 430px }
    100% { text-indent: -485px }
}

@-webkit-keyframes marquee {
    0%   { text-indent: 430px }
    100% { text-indent: -485px }
}

.marquee {overflow: hidden; white-space: nowrap; animation: marquee 17s linear infinite; -webkit-animation: marquee 17s linear infinite;}
.marquee:hover {-webkit-animation-play-state: paused; animation-play-state: paused;}