@charset "utf-8";

/* =================================================================
 * Common
 * ================================================================= */
.font-en {
	font-family:'Helvetica Neue', 'Helvetica', 'Apple SD Gothic Neo', 'Open Sans', '맑은 고딕', 'Malgun Gothic', Sans-serif;
}
a:hover,a:active,a:focus { color: #5d86a4; }

.web_btn { display: inline-block; margin:2px; padding:1px 5px; font-size: 13px;
	border:1px solid transparent; border-radius:0px; }
.web_btn { color:#5d86a4; background-color:#fff; border:1px solid #5d86a4; }
.web_btn:hover, .web_btn:focus, .web_btn:active { color: #fff; background-color:#5d86a4; }

/* 헤드라인 */
.headline_center { text-align: center; margin-bottom: 30px; }
.headline_center h4 { font-weight: bold; line-height: 30px; }
.icon_bordered { position: relative; padding: 0 10px; color: #555; }
.icon_bordered::before, .icon_bordered::after { content: " "; position: absolute; top: 8px; width: 100px; height: 1px; background-color: #777; }
.icon_bordered::before { left: 100%; }
.icon_bordered::after { right: 100%; }

.section_contents { margin-bottom: 30px; padding: 10px 0; }
.margin-bottom-0 { margin-bottom: 0px; }
.margin-bottom-10 { margin-bottom: 10px; }
.margin-bottom-20 { margin-bottom: 20px; }
.margin-bottom-30 { margin-bottom: 30px; }
.margin-bottom-50 { margin-bottom: 50px; }
.margin-top-20 { margin-top: 20px; }
.margin-top-50 { margin-top: 50px; }
.border_bottom { border-bottom: 1px solid #777; padding-bottom: 10px; margin-bottom: 10px; }

/* visual 이미지 2:1, 웹 높이 230px */
#visual_wrap { position: relative; overflow: hidden; max-width:1200px; margin: 0 auto; margin-bottom: 30px; }
.visual_img { height: 300px; background-size: cover; background-repeat: no-repeat;	background-position: center center; }
.visual_blur { position: absolute; width:100%; height: 60px; bottom: 0px; background-color: rgba(255,255,255,0.4); }

@media (max-width: 768px) {
	.visual_img { height: 240px; }
}

@media (min-width: 992px) { .col-md-2.col-fix-5 { width: 20% ; } } /* 줄당 5개 */


 /* =================================================================
 * Header
 * ================================================================= */
header#gnb_menu_pc { margin: 45px auto; margin-bottom: 20px; position: relative; max-width: 1200px; }
.header_bg { position: absolute; top: 0; bottom: 0; width: 100%; }
.header_bg > div:first-child { background-color: #5d86a4; height: 54px; }
.header_bg > div:last-child { background-color: #ec7b59; height: 54px; }

header .btn-interview-link {
	position: absolute; top: -28px; right: 226px; display: inline-block; border: 1px solid #aaa; border-radius: 3px;
	padding: 4px 8px; font-size: 11px; white-space: nowrap; color: #e5e5e5; background-color: #7cac08;
}
header .btn-interview-link > i { font-size: 1.2em; position: relative; top: 1px; }
header .btn-interview-link:hover, header .btn-interview-link:focus, header .btn-interview-link:active {
	opacity: .9;
}

header .btn-qa-link {
	position: absolute; top: -28px; right: 112px; display: inline-block; border: 1px solid #aaa; border-radius: 3px;
	padding: 4px 8px; font-size: 11px; white-space: nowrap; color: #e5e5e5; background-color: #50539c;
}
header .btn-qa-link > i { font-size: 1.2em; position: relative; top: 1px; }
header .btn-qa-link:hover, header .btn-qa-link:focus, header .btn-qa-link:active {
	opacity: .9;
}

header .btn-contact-us {
	position: absolute; top: -28px; right: 0px; display: inline-block; border: 1px solid #aaa; border-radius: 3px;
	padding: 4px 8px; font-size: 11px; white-space: nowrap; color: #e5e5e5; background-color: #454545;
}
header .btn-contact-us > i { font-size: 1.2em; position: relative; top: 1px; }
header .btn-contact-us:hover, header .btn-contact-us:focus, header .btn-contact-us:active {
	opacity: .9;
}

header .btn-edu-link {
	position: absolute; top: -28px; left: 0px; display: inline-block; border: 1px solid #d42b81; border-radius: 3px;
	padding: 4px 8px; font-size: 11px; white-space: nowrap; color: #fff; background-color: #d42b81;
}
header .btn-edu-link > i { font-size: 1.2em; position: relative; top: 1px; }
header .btn-edu-link:hover, header .btn-edu-link:focus, header .btn-edu-link:active {
	opacity: .8;
}

header .btn-edu-blog {
	position: absolute; top: -28px; left: 65px; display: inline-block; border: 1px solid #d42b81; border-radius: 3px;
	padding: 4px 8px; font-size: 11px; white-space: nowrap; color: #d42b81; background-color: #fff;
}
header .btn-edu-blog > i { font-size: 1.2em; position: relative; top: 1px; }
header .btn-edu-blog:hover, header .btn-edu-blog:focus, header .btn-edu-blog:active {
	opacity: .8;
}

.gnb_left, .gnb_brand, .gnb_right { text-align: center; margin-left: -15px; margin-right: -15px; font-size: 13px; }
.gnb_brand { padding-top: 16px; margin-right: 10px; margin-left: 10px; background-color: #fff; height: 54px; }
.gnb_brand img { width: 60px; }
.gnb_left { background-color: #5d86a4; color: #fff; margin-right: -40px; border-left: 0px solid #fff; border-right: 1px solid #fff; }
.gnb_right { background-color: #ec7b59; color: #fff; margin-left: -40px; border-left: 1px solid #fff; border-right: 0px solid #fff; }

.gnb_left ul, .gnb_right ul { position: relative; margin-bottom: 0; }

.gnb_left li, .gnb_right li { white-space: nowrap; cursor: pointer; padding: 18px 0; position: relative; }

/* 서브 */
.gnb_left > a, .gnb_right > a { color: #fff; }
.gnb_left li:hover, .gnb_right li:hover { color: #ddd; }

.gnb_left_sub > a, .gnb_right_sub > a { display: block; padding: 5px 0; }

.gnb_left_sub, .gnb_right_sub {
	position: absolute; top: 58px; left: 0; right: 0; display: none;
	background-color: #fff; z-index: 999;
}
.gnb_left_sub { height: 225px; border-bottom: 1px solid #5d86a4; box-shadow: 0px 2px 3px #ccc; }
.gnb_right_sub { height: 345px; border-bottom: 1px solid #ec7b59; box-shadow: 0px 2px 3px #ccc; }
.gnb_left li:first-child .gnb_left_sub, .gnb_right li:first-child .gnb_right_sub { border-left: 0px solid #ddd; }
.gnb_left li:last-child .gnb_left_sub, .gnb_right li:last-child .gnb_right_sub { border-right: 0px solid #ddd; }
.gnb_sub_title, .gnb_sub_title:hover { background-color: #ddd; color: #333; cursor: default; }

@media (max-width: 992px) {
	.gnb_left, .gnb_right { font-size: 12px; }
}


/* 모바일 메뉴 */
.gnb_mobile { background-color: #54a2c0; padding-top: 5px; padding-bottom: 5px; color: #fff; }
.gnb_mobile h4 { color: #fff; font-weight: bold; display: inline-block; }
.gnb_mobile i { margin-top: 3px; cursor: pointer; display: inline-block;
	font-size: 25px; color: #fff; padding: 4px 10px 4px 10px;
}
.gnb_mobile .gnb_mobile_link_wrap { text-align: right; padding-right: 3px !important; line-height: 0.97; font-size: 7px; margin-top: -1px; margin-bottom: -2px; }
.gnb_mobile .btn-edu-link {
	position: relative; top : 11px; left: initial; right: initial; display: inline-block; background-color: initial;
	padding: 0px 2px; border: 1px solid #d42b81; font-size: 11px; color: #daeaf0; white-space: nowrap; background-color: #d42b81
}
.gnb_mobile .btn-edu-link:hover { color: #e5e5e5; border: 1px solid #e5e5e5; }
.gnb_mobile .btn-interview-link {
	position: relative; top : initial; left: initial; right: initial; display: inline-block; background-color: initial;
	padding: 0px 2px; border: 1px solid #7cac08; color: #daeaf0; white-space: nowrap; background-color: #7cac08;
	width: 84px; text-align: center; margin-bottom: 2px;
}
.gnb_mobile .btn-interview-link:hover { color: #e5e5e5; border: 1px solid #e5e5e5; }
.gnb_mobile .btn-qa-link {
	position: relative; top : initial; left: initial; right: initial; display: inline-block; background-color: initial;
	padding: 0px 2px; border: 1px solid #50539c; color: #daeaf0; white-space: nowrap; background-color: #50539c;
	width: 84px; text-align: center; margin-bottom: 2px;
}
.gnb_mobile .btn-qa-link:hover { color: #e5e5e5; border: 1px solid #e5e5e5; }
.gnb_mobile .btn-contact-us {
	position: relative; top : initial; left: initial; right: initial; display: inline-block; background-color: initial;
	padding: 0px 2px; border: 1px solid #454545; color: #daeaf0; white-space: nowrap; background-color: #454545;
	width: 84px; text-align: center;
}
.gnb_mobile .btn-contact-us:hover { color: #e5e5e5; border: 1px solid #e5e5e5; }

.gnb_mobile_title, .gnb_mobile_sub, .gnb_mobile_sub > a { display: block; }
.gnb_mobile_title { padding: 10px; text-indent: 20px; border-bottom: 1px solid #ddd; background-color: #e0e2de; font-weight: bold; }
.gnb_mobile_sub { text-indent: 50px; background-color: #fff; }
.gnb_mobile_sub > a { padding: 10px; border-bottom: 1px solid #ddd; }

#gnb_menu_mobile > ul { position: absolute; left: 0; right: 0; z-index: 999; display: none; box-shadow: 0px 2px 5px #aaa; }

#background_mask { display: block; position: absolute; top:0; left:0; right: 0; background-color: rgba(0,0,0,0.7); z-index: 998; }


@media (max-width: 899px) {
	#gnb_menu_pc { display: none; }
	#gnb_menu_mobile { display: block; }
	#background_mask { top: 50px; }
}
@media (min-width: 900px) {
	#gnb_menu_pc { display: block; }
	#gnb_menu_mobile { display: none; }
}
@media (max-width: 360px) {
	.gnb_mobile > .row > div { padding-left: 0; padding-right: 0; }
}

/* =================================================================
 * Footer
 * ================================================================= */
footer { margin-bottom: 0; margin-top: 10px; background-color: #fff; }

.footer_top { padding-top: 5px; }
.footer_top > div > div { padding-left: 25px; padding-right: 25px; }
.footer_top .btn { width: 120px; display: block; }
.footer_top .btn:first-child { background-color: #5d86a4; color: #fff; }
.footer_top .btn:first-child:hover { opacity: .85; }
.main_info_phone { font-weight: bold; font-size: 1.1em; text-align: right; color: #5d86a4; }
.main_info_phone span { display:inline-block; }
.main_info_phone span:first-child { vertical-align:top; padding-right:10px; }
.main_info_phone i { font-size: 1.2em; position: relative; top: .5px; }

.donate_wrap { padding: 10px 0; }
.donate_wrap strong { color: #555; font-size: .95em; }
.donate_count { color: #ff6600; }

.footer_wrap { background-color: #eee; border-top: 1px solid #ddd; color: #777; font-size: 13px; line-height: 1.6; }
.footer_brand { padding: 3.5em 2em; }
.footer_copyright { padding: 1em 1em 0.5em 1em; text-align: center; }
.footer_copyright a { color: #777; }
.footer_copyright a:hover, .footer_copyright a:active, .footer_copyright a:focus { color: #5d86a4; }

@media (max-width: 767px) {
	.footer_top .footer_top_btn_wrap { padding: 0 0 15px 0; text-align: center; }
	.footer_top .btn { width: 100px; display: inline-block; }
	.main_info_phone { font-size: 1.1em; }
	.donate_wrap { margin: 0 -8px 0 -2px; line-height: 1; }
	.footer_brand { display: none; }
	.footer_copyright { font-size: 0.9em; }
	.footer_copyright .view_x { display: none; }
}
@media (max-width: 480px) {
    .main_info_phone { text-align: center; }
    .footer_campus > div { width: 100%; padding-left: 20px; }
    .footer_campus > div:not(:last-child) { padding-bottom: 10px; }
}

/* =================================================================
 * Main
 * ================================================================= */
.main_text { position: relative; padding:10px 20px; border-left: 5px dotted #ccc; border-right: 5px dotted #ccc; margin-bottom: 30px; }
.main_text span {
	display: inline-block; padding: 7px; margin-top: 10px; background-color: #fff; color: #5d86a4; border: 5px solid #5d86a4;
	border-radius: 10px; position: absolute; top: -10px; left: -80px;
}
@media (max-width: 900px) {	.main_text span { display: none; } }
@media (max-width: 768px) {	.main_text { border: 0px; } }


.main_title_icon { font-size: 16px; font-weight: bold; margin-top: 20px; margin-bottom: 40px; text-align: center; }
.main_title_icon span { padding: 10px; border-radius: 30px; background-color: #fff; border: 3px solid #72c02c; }
.main_title_icon i { font-size: 22px; color: #72c02c; position: relative; top: 3px; }

.main_box { background-color: #fff; padding: 15px; text-align: justify; position: relative; margin-bottom: 5px; }
.main_box p { margin: 0; height: 83px; }

.main_icon_more { display: none;
	position: absolute; right: 15px; bottom: -5px; display: inline-block; padding-left: 15px;
	font-size: .9em; border: 1px solid #5d86a4; padding: 1px 10px; color: #5d86a4; background-color: #fff;
}
.main_icon_more:hover { background-color: #5d86a4; color: #fff; cursor: pointer; }

.main_line { width: 96%; height: 1px; background-color: #e5e5e5; margin: 10px auto; margin-top: 0; }

@media (max-width: 768px) {
    .main_box p { height: auto; min-height: 35px; padding: 0 15px; }
}

.main_middle_text, .main_middle_video { display: inline-block; float: left; padding: 0 15px; margin-bottom: 45px; }
.main_middle_video { padding-top: 5px; }
@media (max-width: 768px) {
	.main_middle_text, .main_middle_video { margin-bottom: 25px; }
	.main_middle_video { padding-top: 0; }
}
.main_middle_video_title {
	padding-top: 5px; font-weight: bold; text-align: center;
	white-space:nowrap; text-overflow: ellipsis; word-wrap: normal; overflow: hidden;
}
.main_middle_text {
	scrollbar-arrow-color: #efefef;
    scrollbar-Track-Color: #efefef;
    scrollbar-base-color: #dfdfdf;
    scrollbar-Face-Color: #dfdfdf;
    scrollbar-3dLight-Color: #dfdfdf;
    scrollbar-DarkShadow-Color: #dfdfdf;
    scrollbar-Highlight-Color: #dfdfdf;
    scrollbar-Shadow-Color: #dfdfdf;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}
.main_middle_text::-webkit-scrollbar { width: 6px; height: 0px;  }
.main_middle_text::-webkit-scrollbar-button:start:decrement,
.main_middle_text::-webkit-scrollbar-button:end:increment { display: block; width: 6px;height: 0px; background: url() rgba(0,0,0,.05); }
.main_middle_text::-webkit-scrollbar-track { background: rgba(0,0,0,.05); }
.main_middle_text::-webkit-scrollbar-thumb { background: rgba(0,0,0,.1); }


/* =================================================================
 * Sub
 * ================================================================= */
/* 구문정독이란 */
.tov_info_top_text { padding: 0 200px; line-height: 2; font-size: 1.5em; }
.tov_info_top_text span { display: inline-block; border-bottom: 2px solid #72c02c; }
@media (max-width: 992px) { .tov_info_top_text { padding: 0 100px; } }
@media (max-width: 768px) { .tov_info_top_text { padding: 0px; font-size: 1.2em; } }

@media (min-width: 768px) {
	.tov_info { position: relative; background-image: url('/img_web/tov_info.jpg');
		background-size: cover; background-repeat: no-repeat;	background-position: center center; }
}
@media (max-width: 769px) {
	.tov_info { position: relative; background-color: #f5f5f5; }
}

.tov_info_box { padding: 30px 15px 20px 15px; line-height: 2; margin-bottom: 0px; }
.tov_info_box > p { margin: 0 0 20px; }
.tov_info_title { font-weight: bold; color: #555; }
.tov_info_title span { padding: 10px 12px 5px 12px ; border-radius: 30px; background-color: #72c02c; }
.tov_info_title i { font-size: 26px; color: #fff; }

.tov_info_img_text { position: absolute; bottom: 50px; right: 50px; color: #fff; text-align: center; }
@media (max-width: 768px) { .tov_info_img_text { display: none; } }


/* 선생님소개 */
.teacher_box { padding: 25px; }
.teacher_box > img { border: 3px solid #f5f5f5; border-radius: 10px; margin: 0 auto;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-o-transition: all .5s ease;
	-ms-transition: all .5s ease;
	transition: all .5s ease;
}
.teacher_box > img:hover { transform: scale(1.1); border-color: #eee; }
.teacher_box > div { position: relative; bottom: 0; font-weight: bold; font-size: 14px; text-align: center; padding: 5px 2px; width: 98%; margin: 0 auto; border-radius: 5px; letter-spacing: -1px;
	-webkit-transition: bottom 1s;
	-moz-transition: bottom 1s;
	-o-transition: bottom 1s;
	-ms-transition: bottom 1s;
	transition: bottom 1s;
 }
.teacher_box:hover div { bottom: 30px; color: #fff; background-color: rgba(0,0,0,0.4); }
.teacher_title { font-weight: bold; font-size: 16px; text-align: center; position: relative; margin-top: 40px; }
.teacher_title:before {
	content: ""; position: absolute; top: -7px; left: 50%; margin-left: -15px;
	width: 30px; height: 3px; background-color: #1ab7ea;
}

@media (max-width: 991px) {
	.teacher_box:not(.teacher_box-2x) { max-width: 300px; margin: 0 auto; }
	.teacher_box > div { width: 78%; }
}
@media (max-width: 768px) {
	.teacher_box { padding: 10px 5px; }
	.teacher_box > div { font-size: .9em; width: 90%; margin: 0 auto; }
	.teacher_title { margin-bottom: 10px; }
}


/* Q & A */
.qa_wrap { background-color: #f5f5f5; padding-left: 10px; padding-right: 10px; }
.qa_list { position: relative; max-width: 800px; margin-bottom: 30px; }
.qa_title { font-weight: bold; background-color: #556; color: #fff; padding: 5px 30px; border-radius: 10px; }
.qa_contents { padding-left: 30px; }
.qa_title:before { content: "Q. "; position: absolute; left: 10px; }
.qa_contents:before { content: "A. "; position: absolute; left: 10px; }
.qa_title i { position: absolute; top: 10px; right: 15px; }


 /* 오시는 길 */
.location_box { background-color: #556; color: #fff; padding-left: 60px; padding-right: 60px; width: 96%; margin-bottom: 50px; }
.subway_wrap { margin: 0 10px; }
.subway1 { padding: 8px 5px; background-color: #edb217; font-size: 12px; }
.subway1 > span { padding: 5px 16px; background-color: #FFF; color: #edb217; font-weight: bold; border-radius: 20px; }
.subway2 { padding: 8px 5px; background-color: #a8022d; font-size: 12px; }
.subway2 > span { padding: 5px 10px; background-color: #FFF; color: #a8022d; font-weight: bold; border-radius: 20px; }

@media (max-width: 768px) {
	.location_box { padding-left: 20px; padding-right: 20px; font-size: .9em; margin-bottom: 30px; }
	#map_view + .location_box { margin-bottom: 40px; }
	.subway1 > span { padding: 5px 15px; }
}
@media (min-width: 769px) {
	.location_box p br { display: none; }
}


/* ================================================================================= */
/* 교육과정 */
.curriculum { padding: 15px; line-height: 1.8; }
.curriculum_bg { background-color: #f5f5f5; background-image: url('/img_web/bg.jpg'); }
.curriculum p:not(:last-child) { margin: 0 0 20px; }
.effect_underline { border-bottom: 1px solid #555; padding-bottom: 1px; }
.effect_highlight { color: #a10f2b; font-weight: bold; font-size: 1.2em; }


.curriculum_hi3_top { font-weight: bold; color: #a10f2b; }
.curriculum_hi3_top > div { display: inline-block; margin-right: auto; margin-left: auto; }
.curriculum_hi3_top > div > span:first-child {
	border: 1px solid #a10f2b; padding: 2px 10px; margin-right: 10px; position: absolute; display: inline-block;
}
.curriculum_hi3_top > div > span:last-child { padding-left: 70px; padding-top: 2px; display: inline-block; }


.curriculum_hi_title {
	padding: 20px; margin: 60px 0px 0px 0px; background-color: #556; border-radius: 10px;
	text-align: center; font-weight: bold; font-size: 18px; color: #fff;
}
.curriculum_hi_title span { padding: 12px 9px 9px 9px ; border-radius: 30px; background-color: #72c02c; }
.curriculum_hi_title i { font-size: 26px; color: #fff; }
.curriculum_hi_table { background-color: #54a2c0; color: #fff; width: 80%; margin: 0 auto; }
.curriculum_hi_table td { padding: 7px 10px; min-width: 100px; }
.curriculum_hi_table tr > td:first-child { text-align: center; }
@media (max-width: 768px) {	.curriculum_hi_table { width: 100%; } }


.curriculum_hi_be div:first-child { margin-bottom: 20px; padding: 0; text-align: center; }
.curriculum_hi_be div:first-child span { font-weight: bold; font-size: 14px; border-bottom: 2px solid #54a2c0; }


/* TOV 자체교재 */
.tov_books_title { padding: 10px; background-color: #556; color: #fff; border-top: 7px solid #ddd; border-bottom: 7px solid #ddd; }
.tov_books_title > div { padding-left: 5px; padding-right: 5px; }

.tov_books_title > div:first-child { text-align: center; }
.tov_books_title > div:first-child span {
	color: #f5f5f5; display: inline-block; padding: 5px 7px; margin-bottom: 15px; margin-top: 10px;
	background-color: #54a2c0; border-radius: 10px; border: 2px solid #f5f5f5; font-weight: bold;
}
@media (min-width: 992px) { .tov_books_title > div:first-child span { margin-right: 50px; } }

.tov_books_list > div { display: inline-block; margin-right: auto; margin-left: auto; }
.tov_books_list > div > i { position: absolute; display: inline-block; }
.tov_books_list > div > span { padding-left: 22px; display: inline-block; }

@media (max-width: 767px) { .tov_books_item > div { margin: 20px 0; } }

/* ================================================================================= */
/* 입학안내 */
.admission_guide_title { font-weight: bold; margin-top: 20px; margin-bottom: 20px; text-align: center; }
.admission_guide_title span { padding: 12px 12px 8px 12px ; border-radius: 30px; background-color: #72c02c; }
.admission_guide_title i { font-size: 26px; color: #fff; }
.admission_guide_box { margin: 0 30px; margin-bottom: 30px; padding-left: 35px; padding-right: 35px; background-color: #556; color: #fff; }
.admission_guide_box p { line-height: 2; }
@media (max-width: 768px) {	.admission_guide_box { margin: 0; margin-bottom: 30px; padding: 10px; font-size: .9em; } }


/* 진단테스트 */
.admission_test { padding: 0; margin-bottom: 0px; }
.admission_test_box { padding: 20px 25px; background-color: #f2f2f2; line-height: 2; height: 400px; }
.admission_test_box > p { margin: 0 0 20px; font-weight: 700; }
.admission_icon {
	display: inline-block; width: 70px; border: 1px solid #555; background-color: #fff; text-align: center;
	position: relative; top: 10px;
}

.admission_test_img {
	position: relative; background-image: url('/img_web/admission_test.jpg');
	height: 400px; background-size: cover; background-repeat: no-repeat;	background-position: center center;
}
.admission_test_img div { position: absolute; top: 0; bottom: 0px; left: 0; right: 0; background-color: rgba(0,0,0,0.7); text-align: center; }
.admission_test_img div span:first-child {
	color: #fff; display: inline-block; padding: 10px 20px; margin-top: 100px; border: 3px solid #fff;
}
.admission_test_img div span:last-child {	color: #fff; display: inline-block; margin-top: 120px; }
.admission_test_img div { visibility: hidden; }
.admission_test_img:hover div { visibility: visible; }

/* ================================================================================= */
/* 라이브러리 온라인 (숙제프로그램) */

/* 메뉴이미지 V1 시작 */
.menu_v1 {
	position: relative; display: block; height: 34px; min-width: 170px;
	color: #fff; background-color: #556; border-radius: 0 5px 5px 0;
	margin-left: 15px; padding: 6px 0 6px 30px; z-index: 3;
}
.menu_v1:before {
	content: ""; width: 30px; height: 28px; background-color: #3aafbe; border-radius: 3px 0 0 3px;
	position: absolute; left: -15px; top: 3px; z-index: 2;
}
.menu_v1:after {
	content: ""; width: 25px; height: 20px; background-color: #3aafbe; border-radius: 8px;
	position: absolute; left:-5px; top: 7px; z-index: 1;
}
.menu_v1 > i.fa { position: absolute; left: -5px; top: 12px; color: #fff; z-index: 4; }

.bg_cyan, .bg_cyan_before:before, .bg_cyan_after:after { background-color: #3aafbe; }
.bg_blue, .bg_blue_before:before, .bg_blue_after:after { background-color: #4a92cc; }
.bg_orange, .bg_orange_before:before, .bg_orange_after:after { background-color: #e6663f; }
.bg_green, .bg_green_before:before, .bg_green_after:after { background-color: #8bc34a; }
.bg_purple, .bg_purple_before:before, .bg_purple_after:after { background-color: #9b6bcc; }
.bg_yellow, .bg_yellow_before:before, .bg_yellow_after:after { background-color: #f1c40f; }
.bg_dgreen, .bg_dgreen_before:before, .bg_dgreen_after:after { background-color: #34a064; }
.bg_red, .bg_red_before:before, .bg_red_after:after { background-color: #e42359; }

.color_cyan, .color_cyan_before:before, .color_cyan_after:after { color: #3aafbe; }
.color_blue, .color_blue_before:before, .color_blue_after:after { color: #4a92cc; }
.color_orange, .color_orange_before:before, .color_orange_after:after { color: #e6663f; }
.color_green, .color_green_before:before, .color_green_after:after { color: #8bc34a; }
.color_gray, .color_gray_before:before, .color_gray_after:after { color: #777; }
.color_purple, .color_purple_before:before, .color_purple_after:after { color: #9b6bcc; }
.color_yellow, .color_yellow_before:before, .color_yellow_after:after { color: #f1c40f; }
.color_dgreen, .color_dgreen_before:before, .color_dgreen_after:after { color: #34a064; }
.color_red, .color_red_before:before, .color_red_after:after { color: #e42359; }
/* 메뉴이미지 V1 끝 */


.menu { padding: 15px; padding-right: 0; }
.menu_v1 { padding-top: 10px; }
.menu_v1_sub { margin-left: 0px; }
.menu_v1_sub a { display: block; padding-left: 20px; line-height: 2.3em; }
.menu_v1_sub a:hover { font-weight: bold; }

.menu_user { padding: 0 0 5px 17px; color: #556; font-weight: bold; }


.menu_member_info {
	position: absolute; bottom: 15px; left: 15px; right: 0; margin-bottom: 0px;
	background-color: #556; padding: 5px 15px; border-radius: 5px; min-width: 185px;
}
.menu_member_info a { color: #fff; }
.menu_member_info a:hover { color: #5d86a4; }
.menu_member_info > div { padding: 5px 15px; }
.menu_member_info > div:not(:last-child) { border-bottom: 1px solid #aaa; }


/* 게시판 */
form > div { border: 0; }


.xwboard_list { background-color: transparent; }
.xwboard_list { width: 100%; max-width: 100%; margin-bottom: 10px; }
.xwboard_list > thead, .xwboard_list > tr:first-child { text-align: center; font-weight: bold; }
.xwboard_list th, .xwboard_list td { padding: 8px; line-height:1.42857143; vertical-align:middle; text-align: center; }
.xwboard_list-sm th, .xwboard_list-sm td { padding: 5px; }

.xwboard_list tr { border-top: 1px solid #ddd; }
.xwboard_list thead tr, .xwboard_list > tr:first-child {
	border-top: 2px solid #54a2c0; border-bottom: 1px solid #9cc3d2;
}
.xwboard_list tbody tr:last-child { border-bottom: 1px solid #9cc3d2; }

@media (max-width: 768px) {
	.xwboard_list th, .xwboard_list td { padding-left: 2px; padding-right: 2px; }
	.mobile_disp_none { display: none; }
}


.xwboard_list_hover tbody tr:hover { background-color: #f5f5f5; }


.xwboard_btn { display: inline-block; margin:2px; padding:1px 5px; font-size: 13px;
	border:1px solid transparent; border-radius:0px; }
.xwboard_btn { color:#54a2c0; background-color:#fff; border:1px solid #54a2c0; }
.xwboard_btn:hover, .xwboard_btn:focus, .xwboard_btn:active { color: #fff; background-color:#54a2c0; }
.xwboard_btn.xwboard_btn-la { font-size: 14px; padding:2px 10px; }


.xwboard_pg .pagination { margin: 5px; }
.xwboard_pg .pagination > li > a, .xwboard_pg .pagination > li > span {
	color: #54a2c0 !important; background-color: #fff !important; border: 1px solid #ddd !important;
}
.xwboard_pg .pagination > li > a:hover, .xwboard_pg .pagination > li > span:hover,
.xwboard_pg .pagination > li > a:focus, .xwboard_pg .pagination > li > span:focus {
	background-color: #eee !important; }
.xwboard_pg .pagination > .active > a, .xwboard_pg .pagination > .active > span,
.xwboard_pg .pagination > .active > a:hover, .xwboard_pg .pagination > .active > span:hover,
.xwboard_pg .paginationn > .active > a:focus, .xwboard_pg .pagination > .active > span:focus {
	color: #fff !important; background-color: #54a2c0 !important; border-color: #54a2c0 !important; }
.xwboard_pg .pagination > .disabled > span, .xwboard_pg .pagination > .disabled > a,
.xwboard_pg .pagination > .disabled > span:hover, .xwboard_pg .pagination > .disabled > a:hover,
.xwboard_pg .pagination > .disabled > span:focus, .xwboard_pg .pagination > .disabled > a:focus {
  color: #aaa !important; background-color: #fff !important; }
@media (max-width: 768px) {
	.xwboard_pg .pagination { font-size: .9em; }
}


.xwboard_help { color: #777; font-size: .85em; }


.xwboard_popup { padding: 15px; }
.xwboard_popup_headline {
	font-size: 16px; font-weight: bold; border-bottom: 0px solid #555;
	display: inline-block; padding-bottom: 5px; margin-bottom: 15px;
}
.xwboard_popup_body {
	margin: 5px 0 15px 0; padding: 5px; border-top: 1px solid #aaa; border-bottom: 1px solid #aaa; font-size: 13px;
}
.xwboard_popup_body [type=file] { font-size: 12px; }
.xwboard_popup_info { font-size: .85em; color: #a58e21; padding-top: 10px; }
#xwboard_popup_result { font-size: 12px; color: #eee; background-color: #000; position: absolute; }

.pager li > a { border: 1px solid #54a2c0; border-radius: 0; padding:1px 5px; font-size: 13px; }
.pager li > a:hover, .pager li > a:focus, .pager li > a:active { color: #fff; background-color:#54a2c0; }


.xwboard_view_head { padding: 10px 15px; background-color: #eaf1f5; border: 1px solid #ddd; }
.xwboard_view_head > div:first-child { border-bottom: 1px solid #ddd; padding-bottom: 20px; margin-bottom: 10px; }
.xwboard_view_head > div:last-child { font-size: .85em; }

.xwboard_view_content { padding: 15px; border: 0px solid #ddd; margin-top: 10px; margin-bottom: 10px; }
.xwboard_view_content iframe { display: block; margin: 15px auto; max-width: 1200px; max-height: 600px; }

.xwboard_view_comment { border-top: 1px solid #ddd; padding: 15px; }
.xwboard_view_comment i { color: #777; }

.xwboard_view_comment_in { padding: 10px 15px; background-color: #eaf1f5; margin: 15px 0; }


.xwboard_write tr { border-top: 1px solid #ddd; }
.xwboard_write tr:first-child { border-top: 2px solid #54a2c0; }
.xwboard_write tr:last-child { border-bottom: 1px solid #9cc3d2; }

