@import url("../fonts/font.css");
/**/
.tit01{ padding-left:15px; margin:0 0 20px; background:url('../img/basic/title_bg_01.png') no-repeat 0 7px ; color:#111; font-family:"nanum-square-r"; font-size:20px; font-weight: bold; }
.tit02{ padding-left:20px; margin:0 0 15px; background:url('../img/basic/title_bg_02.png') no-repeat 7px 4px;  color:#222222;font-size:18px; font-family:"nanum-square-r"; font-weight:normal}
.tit03{ padding-left:25px; margin:0 0 10px; background:url('../img/basic/title_bg_03.png') no-repeat 13px 5px; color:#222222;font-size:16px;font-family:"nanum-square-r";}

/**/
.dashline { width: 100%; height: 1px; display: inline-block; margin: 30px 0 ; border-bottom: dashed 1px #ccc;}
.dashed_txt_box { padding: 20px; background: #fafafa; border:dashed 1px #eee; border-radius: 5px; }
.txt_box { padding: 20px; background: #fafafa; border:solid 1px #eee; font-size: 15px; font-weight: 400; }

/**/
.ul_list { }
.ul_list li {
    margin-top:10px;padding-left:8px;
    background:url('../img/basic/ul_bg.png') no-repeat 8px 9px;
    line-height: 1.4; font-size: 15px; color: #666; font-weight: 400;
}
.ul_list li:first-child { margin-top: 0; }
.ul_list li a {color: #666; }

.ol_list { margin:10px 0 0; padding: 0 0 0 20px; font-size:15px;color:#767676;}
.ol_list li { margin-bottom:8px; list-style-type: decimal; line-height: 1.4; font-size: 15px; color: #444; }

/**/
.Arealine { height: 1px; width: 100%; display: inline-block; margin: 15px 0; border-bottom: solid 1px #ddd; }
.dashedline { height: 1px; width: 100%; display: inline-block; margin: 15px 0; border-bottom: dashed 1px #ddd; }
.slashline { clear: both; background:url('../img/basic/slash_bg.png') repeat; width: 100%; height:8px; margin:30px 0; opacity: 0.7; }

/**/
.txt01 { font-size: 15px; color: #666;}


/**/
.circle { width: 100px; height: 100px; text-align: center; line-height: 100px; display: inline-block; font-size: 24px; color: #fff; }
.circle.circle_blue { background: url('../img/content/circle_blue.png') no-repeat; }
.circle.circle_cyan { background: url('../img/content/circle_cyan.png') no-repeat; }

/**/
.table.tableCont { width: 100%; border-top:solid 1px #bbb; }
.table.tableCont th { background:#fafafa; text-align:center; padding:14px 0; font-size: 15px; color: #333; border:solid 1px #ddd; border-left: dashed 1px #ddd; }
.table.tableCont td { padding: 13px 10px; border:solid 1px #ddd; font-size: 14px;  color: #555; vertical-align: middle; }


.wImg { display:block ; }
.mImg { display: none; }
.contentPage { font-family:'nanum-square-r', Nanum Gothic, Malgun Gothic, sans-serif; font-weight: 400; line-height: 1.4; }
.contentPage img { max-width: 100%;height: auto; }

.toptxt {  padding: 80px 0; text-align: center; }
.toptxt h4 { position: relative; font-size: 36px; font-weight: bold; display: inline-block; }
.toptxt h4::before {
    content: '';
    position: absolute; top:-15px; left: -30px;
    width: 25px; height: 25px;
    background-image:url('../img/content/dot_left.png');
}
.toptxt h4::after {
    content: '';
    position: absolute; bottom: -15px; right: -30px;
    width: 25px; height: 25px;
    background-image:url('../img/content/dot_right.png');
}

.content0101 {
    background-image:url('../img/content/content0101_bg.png');
    background-position: 0 50%;
}
.content0101 .imgbox { position: relative; width: 100%; height: 260px; background:url('../img/content/content0101_1.png') no-repeat; margin: 30px 0 0; }
.content0101 .imgbox .txt_box { background: #59647a; float: right; width:300px; height: 260px; margin: -40px 0 0; padding: 30px; }
.content0101 .imgbox .txt_box strong { font-size: 20px; color: #fff; }
.content0101 .imgbox .txt_box p { margin: 15px 0 0; font-size: 16px; color: #ddd; }
.content0101 .txt01 { padding:30px; font-size: 16px; color: #666; }
.content0101 .txt02 { margin: 30px 0 0; text-align: right; font-size: 18px; color: #333; }


.content0103 { width: 100%; text-align: center; }
.content0103 .imgbox { width: 100%; display: inline-block;}


.content0201 { width: 100%; }
.content0201 .procedure_dl { }
.content0201 .procedure_dl > dl.noneborder { border:0; }
.content0201 .procedure_dl > dl { width: 33.3%; float: left; margin: 0; padding:0 15px; border-left: dashed 1px #ddd; }
.content0201 .procedure_dl > dl > dt { width: 100%; float: left;  text-align: center;  }
.content0201 .procedure_dl > dl > dt .txt { display: block; text-align: center; font-size: 18px; color: #2a8cdf; }
.content0201 .procedure_dl > dl > dd { float: left; padding: 10px 0; }
.content0201 .procedure_dl > dl > dd .ul_list li { margin-top:5px; }


.content0202 { width: 100%; }
.content0202 .text_book_list {  }
.content0202 .text_book_list > ul {  }
.content0202 .text_book_list > ul > li { width: 100%; display: inline-block; padding: 15px 0; border-bottom: dashed 1px #ddd; }
.content0202 .text_book_list > ul > li .img { width: 20%; float: left; }
.content0202 .text_book_list > ul > li .info { width: 78%;  float: left; padding-left: 20px; }
.content0202 .text_book_list > ul > li .info strong { font-size: 20px; }
.content0202 .text_book_list > ul > li .info > ul { margin-top: 10px; }
.content0202 .toptxt { padding: 30px 0; }
.content0202 .toptxt h4 { position: relative; font-size: 24px; font-weight: 500; }
.content0202 .circle { width: 40px; height: 40px; float: left; margin-right: 10px; line-height: 40px; background-size:40px 40px; font-size: 18px; font-weight: bold; color: #fff; }
.content0202 .feature_ul {}
.content0202 .feature_ul li { position: relative; background: #f5f5f5; border-radius: 20px 5px 5px 20px; margin-bottom: 10px; }
.content0202 .feature_ul li .txt { padding: 10px 0; font-size: 15px; }

/* 교재구성 */
.content0202 .composed_ul {}
.content0202 .composed_ul > li { position: relative; width: 33.3%;  float: left; margin-bottom: 10px; padding:0 8px; }
.content0202 .composed_ul > li .tit { text-align: center; }
.content0202 .composed_ul > li .tit img { display: inline-block; }
.content0202 .composed_ul > li .tit strong { display: block; margin: 10px 0 0; font-size: 20px; }
.content0202 .composed_ul > li .txt { background: #f5f5f5; height: 175px; border-radius: 5px; padding: 15px; margin: 10px 0 0; }
.content0202 .composed_ul > li .txt > p { margin: 0 0 10px; font-size: 15px; font-weight: 500; }
.content0202 .composed_ul > li > .txt > ul > li { margin: 5px 0 0; color: #666; font-size: 14px; }

/* 교재 컨텐츠 구성 */
.content0202 .composed_content ul {}
.content0202 .composed_content ul > li { float: left; width: 25%; padding:0 5px 5px; }
.content0202 .composed_content ul > li > span { display: block; padding: 10px 15px; font-size: 14px; }


/* content0301 컨텐츠 구성 */
.content0301 {}
.content0301 .toptxt { padding: 40px 0; }
.content0301 .toptxt h4 { position: relative; font-size: 24px; font-weight: bold; display: inline-block; }

/* content0302 컨텐츠 구성 */
.content0302 {}
.content0302 .dashed_txt_box { height: 340px; }
.content0302 .dashed_txt_box .tit_box { border-radius: 5px; margin: -40px 0 20px; padding: 10px 0; text-align: center; font-size: 18px; color: #fff; font-weight: bold; }


.content0303 {}
.content0303 .system_dl { }
.content0303 .system_dl > dl { width: 33.3%; float: left; margin: 0; padding:0 15px;  }
.content0303 .system_dl > dl > dt { width: 100%; padding: 15px 0; text-align: center; border-radius:5px 5px 0 0 ; color: #fff; }
.content0303 .system_dl > dl > dd { width: 100%; background: #fafafa; border-radius: 0 0 5px 5px;padding:15px; }
.content0303 .system_dl > dl > dd .ul_list li { margin-top:5px; }
.content0303 .system_ul { width: 100%; display: inline-block; }
.content0303 .system_ul > li { float: left; width: 25%; padding: 0 10px; text-align: center; }
.content0303 .stdent_manage { width: 100%; display: inline-block; }
.content0303 .stdent_manage > li { float: left; width: 33.3%; padding: 0 10px; margin-bottom: 10px; text-align: center;}
.content0303 .stdent_manage > li > div { border: solid 1px #ddd; }
.content0303 .stdent_manage > li .txt_box { height: 100px; padding:10px; font-size: 15px; color: #fff; }
.content0303 .stdent_manage > li .txt_box > ul { margin-top: 10px; text-align: left; }
.content0303 .stdent_manage > li .txt_box > ul > li { color: #fff; font-size: 14px; }


/*location*/
.location { font-family: 'nanum-square-r', sans-serif; }

.location .mapbox .map { left:0; top:0!important; margin: 0; padding: 0; }
.location .mapbox .root_daum_roughmap { width: 100%; }
.location .mapInfo { padding:15px 10px; font-size: 16px; color: #333; text-align: center; font-weight: bold; font-family: 'nanum-square-r', sans-serif; }
.location .mapInfo .mapadrass { position: relative; margin: 10px 0 0; padding-top: 15px; font-size: 15px; color: #777;  font-family: 'nanum-square-r', sans-serif; }
.location .mapInfo .mapadrass::before { content: ''; position: absolute; top:0; left:50%; margin: 0 0 0 -15px; width: 30px; height: 2px; background: #00AFF0;}

.location .title { font-size: 24px; font-weight: bold;}
.location .txt01 {
	position: relative;
	background: #fafafa;
    margin: 15px 0 0;
	padding:15px 0;
	border-top:solid 2px #ccc;
	border-bottom:solid 1px #ddd;
	font-size: 18px; line-height: 1.5;
}
.location .txt01 ul { }
.location .txt01 ul li { margin: 8px 0 0; padding: 0 20px; color: #777; }
.location .txt01 ul li b { color: #444; }


/* history */
.history_top{ background:url('../img/basic/bg_history.png') right bottom no-repeat;}
.history_top .txt{padding-top:60px;}
.history { position: relative; }
.history_cont{overflow:hidden;padding:30px 0 0 35px;}
.history_cont .year_box {
	overflow:hidden;width:100%;
	background:url('../img/basic/bg_history_y.png')  repeat-y;
}
.history_cont .year_box strong.tit_year{ position: absolute; float:left;padding:0 0 0 25px;font-weight:normal;font-size:22px;color:#0089d0;line-height:1em;background:url('../img/basic/bg_year.png') 0 0  no-repeat;font-family:"nanum-square-r";}
.history_cont .year_box ul{ float:left;margin:0 0 30px 120px;}
.history_cont .year_box ul li{margin:-2px 0 25px;}
.history_cont .year_box ul li:after{content:"";display:block;clear:both;}
.history_cont .year_box ul li strong{ position: absolute; display:inline-block;width:80px;line-height: 1.4;font-weight:normal;font-size:17px}
.history_cont .year_box ul li .cont {float:left; margin-left: 80px; }
.history_cont .year_box ul li .cont .title { padding-left:12px;font-size:15px; color: #333; background: url(../img/basic/bg_dot.png) 0 8px no-repeat;}
.history_cont .year_box ul li .cont .txt { margin:6px 0 0 12px; color: #888;  }
.history_cont .first_year ul{margin-bottom:0;}
.history_cont .first_year ul li.last{margin-bottom: 0;}

@media (max-width:991px) {
    .wImg { display: none; }
    .mImg { display: block; }


    .content0101 {
        background-image:url('../img/content/content0101_bg.png');
        background-position: 0 50%;
    }
    .content0101 .toptxt {  padding: 50px 0; text-align: center; }
    .content0101 .toptxt h4 { font-size:28px;}
    .content0101 .imgbox { height: 240px; background:url('../img/content/content0101_1.png') no-repeat; margin: 30px 0 0; }
    .content0101 .imgbox .txt_box { width:260px; height: 220px;  }
    .content0101 .txt01 { padding:15px; font-size: 15px; }
}
@media (max-width:767px) {

    .content0201 .procedure_dl > dl.noneborder { border-bottom:dashed 1px #ddd; }
    .content0201 .procedure_dl > dl { width: 100%; padding:15px 0; border-top:dashed 1px #ddd; border-left: 0; }
    .content0201 .procedure_dl > dl > dt { width: 100%; text-align: center; }
    .content0201 .procedure_dl > dl > dd { float: left; padding: 10px 25px; }

    .content0202 .text_book_list > ul > li .img { width: 100%; float: none; display: inline-block; text-align: center; }
    .content0202 .text_book_list > ul > li .info { width: 100%;  float: left; padding: 15px; }
    .content0202 .text_book_list > ul > li .info strong { display: block; text-align: center; }
    .content0202 .circle { position: absolute; top:50%; margin: -20px 0 0 -20px; left: 0; }
    .content0202 .feature_ul { margin-top: 20px; }
    .content0202 .feature_ul > li { border-radius:5px; margin:0 0 10px 20px;  }
    .content0202 .feature_ul > li .txt { padding: 10px 15px 10px 25px; text-align: left; }
    .content0202 .composed_ul > li { position: relative; width: 100%; margin-bottom: 20px; }
    .content0202 .composed_ul > li .txt { height: auto; }
    .content0202 .composed_content ul > li { float: left; width:50%; }

    .content0202 .toptxt h4::before {
        content: '';
        position: absolute; top:-35px; left:50%; margin-left: -12.5;
        width: 25px; height: 25px;
        background-image:url('../img/content/dot_left.png');
    }
    .content0202 .toptxt h4::after {
        content: '';
        position: absolute; bottom: -35px; left:50%; margin-left: -12.5;
        width: 25px; height: 25px;
        background-image:url('../img/content/dot_right.png');
    }

    .content0303 .system_ul > li { width:50%; }
    .content0303 .stdent_manage > li { width: 50%; }
}