@charset "utf-8";


/* 뷰보드 내 탭메뉴 */
.tabs{overflow:hidden; position:relative; background:#494949;}
ul.tabs li{padding: 10px 0;float:left; cursor: pointer; color:#fff; border-left:1px solid #fff; width:220px; text-align:center;}
ul.tabs li:first-child{padding-left:21px !important; border-left:0;}
ul.tabs li:hover{background-color:#739b42;}
#tab_1, #tab_2{clear:both;}
ul.tabs li.current{background:#739b42;}
.tab_content{display: none;}
.tab_content.current{display: inherit;}
.tab_content strong{font-size:18px; line-height:120%;}
.date {text-align:center;}
.con-tbl th{line-height:130%}
/*뷰보드 공통 끝 ===================================================================*/



/*개인정보처리방침*/
.level1_1{font-size:25px; font-weight:600; margin-top:40px; margin-bottom:30px;}
.level1_1:first-child{margin-top:0px;}
.level1_2{font-size:16px;font-weight:600; margin-top:40px; margin-bottom:30px;}
.level1_2_1{font-weight:600; margin-top:40px; margin-bottom:10px;font-size:20px}
.level1_2_1:first-child{margin-top:0px;}
.level1_3{margin-top:10px; margin-bottom:5px;}
.level1_4{margin-bottom:5px; padding-left:22px; text-indent:-21px;}
.level1_4_1{text-indent:-22px; padding-left:22px;  margin-bottom:5px;}
.level1_4_2{text-indent:-19px; padding-left:38px;  margin-bottom:5px;}
.level1_5{text-indent:-1px; padding-left:24px;  margin-bottom:5px;}
.level1_5_1{text-indent:-1px; padding-left:17px;  margin-bottom:5px;}
.level1_6{text-indent:0px; padding-left:37px;margin-bottom:5px;}
.level1_7{text-indent:0px; padding-left:42px;margin-bottom:5px;}
.ctt_privacy  .bo_v_tit{font-size:26px;margin-bottom:40px !important;display:inline-block}

/*이용약관*/
.level2_1{font-size:25px; font-weight:600; margin-top:40px; margin-bottom:30px;}
.level2_1:first-child{margin-top:0px;}
.level2_2{font-size:16px;font-weight:600; margin-top:40px; margin-bottom:30px;}
.level2_2_1{margin-top:10px; margin-bottom:5px; text-indent:0px; padding-left:0px}
.level2_3{margin-top:10px; margin-bottom:5px;text-indent:-0px; padding-left:0px;}
.level2_3_1{margin-top:10px; margin-bottom:5px;text-indent:-20px; padding-left:20px;}
.level2_4{margin-bottom:5px; padding-left:38px; text-indent:-16px;}
.level2_4_1{text-indent:-21px; padding-left:22px;  margin-bottom:5px;}
.level2_4_2{text-indent:-19px; padding-left:38px;  margin-bottom:5px;}
.level2_5{text-indent:-21px; padding-left:58px;  margin-bottom:5px;}
.level2_6{padding-left:38px;  margin-bottom:5px;}
.ctt_provision .bo_v_tit{font-size:26px;margin-bottom:40px !important;display:inline-block}


/* 이용/처리방침 리스트 */
.level-ul1{}
.level-ul1 li{margin:10px 0; padding-left:15px; text-indent:-15px;}
.level-ul1 li:before{content:''; display:inline-block; vertical-align:5px; margin-right:10px; width:6px; height:2px; background:#739b42;}
.level-ul1 li .in_li-tit{display:inline-block; padding-left:15px; width:calc(100% - 15px);}
.level-ul1 li ul li strong{margin:10px 0 5px;}

.level-ul2{margin-top:10px; margin-left:-15px;}
.level-ul2 li{position:relative; margin:5px 0; padding-left:10px; text-indent:-10px;}
.level-ul2 li:first-child{margin-top:0;}
.level-ul2 li:last-child{margin-bottom:0;}
.level-ul2 li:before{content:''; display:inline-block; vertical-align:4px; margin-right:5px; width:3px; height:3px; background:#474747; border-radius:20px;}



/*이미지 정렬박스*/
div [class^="img-box"] .con-img img{width:100%;max-width:100%}

.img-box2 .con-img{float:left;width:calc(50% - 5px);margin-right:10px;display:inline-block;}
.img-box2 .con-img:nth-child(2n){margin-right:0px}

.img-box3 .con-img{float:left;width:calc(33.333333% - 7px);margin-right:10px;display:inline-block;}
.img-box3 .con-img:nth-child(3n){margin-right:0px}
.img-box3 .con-img:nth-child(n+4){margin-top:10px}

.img-box4 .con-img{float:left;display:inline-block;width:calc(25% - 8px);margin-right:10px}
.img-box4 .con-img:nth-child(4n){margin-right:0px}
.img-box4 .con-img:nth-child(n+5){margin-top:10px}


/*왼쪽박스, 오른쪽박스 기본값*/
.left-box, .right-box{float:Left;display:inline-block;box-sizing:border-box;margin:10px auto;}
.left-box{width:30%;padding:10px}
.right-box{width:70%;padding-left:30px}
.left-box img, .right-box img{max-width:100% !important}


/*제목있는 박스 3x3*/
.wd-body{width:100%;display:inline-block;}
.wd-body .wd-box{float:left;display:inline-block;width:calc(33.33333% - 7px);margin:5px;box-sizing:border-box;}
.wd-body > .wd-box:first-child, .wd-body > .wd-box:nth-child(3n+1) {margin-left:0px}
.wd-body .wd-box:nth-child(3n){margin-right:0px}
.wd-body .wd-title{font-weight:bold;font-size:14px;text-align:center;background:#3f51b5;color:#fff;padding:15px 0;letter-spacing:-1px;border-radius:20px 20px 0 0}
.wd-body .wd-con{padding:20px;min-height:150px;background:#f1f1f1; border-radius:0 0 20px 20px}


.mo-none{display:block !important;}
.m-block, .pv-none{display:none !important;}

.aw-box3 {display:flex; align-items:center; }
.aw-box3 .abox{border:1px solid #ddd; border-radius:20px; padding:20px }

.aw-box6{display:flex;align-items: stretch; }
.aw-box6 .abox{display:flex;align-items: center; flex-direction: column; width:100%; border:1px solid #ddd; background:#fafafa; padding:20px;}
.aw-box6 .abox .con-txt{width:100%}
.aw-box6 .abox .con-tit{padding:10px}
.aw-box6 .arbox{width:100%; max-width:11px; margin:0 10px;    display: flex;    align-items: center;}

/*Responsive 370, 480, 768, 992, 1160*/
@media all and (max-width:768px){
	.aw-box5, .aw-box10{flex-direction: column;justify-content: center;}
	.aw-box5 .abox, .aw-box10 .abox {width:100%;margin:0 auto}
	.aw-box5 .arbox, .aw-box10 .arbox{margin:10px auto}
	.aw-box5 .arbox img, .aw-box10 .arbox img{-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);}
}


/*연혁*/
/*Responsive 370, 480, 768, 992, 1160*/
@media all and (max-width:480px){
	.year{margin-bottom:0px}
	.year:after{left:12px;top:40px}
	.con_wrap{padding-left:30px;margin:-3px 0 0 20px}
}



/* 약관 전용 스타일 */
.policy-wrapper {
	max-width: 900px;
	margin: 20px auto;
	padding: 40px;
	background: #fff;
	border: 1px solid #ddd;
	color: #333;
	line-height: 1.8;

}
.policy-wrapper h1 { font-size: 24px; text-align: center; margin-bottom: 30px; border-bottom: 2px solid #333; padding-bottom: 10px; }
.policy-wrapper h2 { font-size: 20px; margin-top: 30px; color: #0056b3; border-left: 4px solid #0056b3; padding-left: 10px; }
.policy-wrapper h3 { font-size: 16px; margin-top: 20px; font-weight: bold; background: #f4f4f4; padding: 5px 10px; }
.policy-wrapper p { margin: 10px 0; white-space: pre-wrap; word-break: break-all; }
.policy-wrapper .depth-2 { padding-left: 20px; }
.policy-wrapper .depth-3 { padding-left: 40px; }
.policy-footer { margin-top: 40px; text-align: right; font-weight: bold; }

.policy-wrapper .section-item { margin-bottom: 25px; padding-bottom: 15px; border-bottom: 1px dashed #eee; }
.policy-wrapper .section-title { font-weight: bold; color: #0056b3; margin-bottom: 10px; display: block; }
.policy-wrapper p { margin: 10px 0; white-space: pre-wrap; word-break: break-all; font-size: 14px; }
.policy-wrapper ul { list-style: none; padding-left: 15px; }
.policy-wrapper ul li { margin-bottom: 8px; position: relative; }
.policy-wrapper ul li::before { content: "•"; position: absolute; left: -15px; color: #0056b3; }
.important-note { background: #fff9db; padding: 15px; border-radius: 4px; border: 1px solid #fab005; font-weight: bold; }




#wrapper .h1{line-height:160%;  margin-bottom:20px;position: relative;font-size:1.8rem;    margin-top: 0;}
#wrapper .h2{position:relative; margin-bottom:15px;font-size:1.5rem;    margin-top: 0;}
#wrapper .h3{position:relative; margin-bottom:10px;font-size:1.2rem;    margin-top: 0;}

/*웹접근성 이미지 설명 누락 표시*/
/*img[alt=""]{border: 5px solid #c00;}*/
/*img:not([alt]){border: 5px solid #c00;}*/

/*콘텐츠 스타일*/
.B01 .con-img{width:100%; max-width:250px; height:auto !important}

/*임직원현황*/
.tbl_wrap { width: 100%; margin: 20px 0; font-family: 'Malgun Gothic', dotum, sans-serif; }
.tbl_wrap h2 { font-size: 1.25rem; margin-bottom: 10px; color: #333; border-left: 5px solid #2c3e50; padding-left: 10px; }

.responsive_table { width: 100%; border-collapse: collapse; border-top: 2px solid #2c3e50; margin-bottom: 40px; }
.responsive_table th, .responsive_table td { border: 1px solid #ddd; padding: 12px; text-align: center; font-size: 0.95rem; }
.responsive_table th { background-color: #f8f9fa; font-weight: bold; color: #333; }

/* 직책별 배경색 포인트 (이미지 디자인 반영) */
.bg_chair { background-color: #e8edff !important; } /* 회장 */
.bg_v_chair { background-color: #f1f8e9 !important; } /* 부회장 */
.bg_audit { background-color: #fce4ec !important; } /* 감사 */
.bg_director { background-color: #fff3e0 !important; } /* 이사 */

/* 모바일 반응형 스타일 */
@media screen and (max-width: 768px) {
	.responsive_table { border-top: none; }
	.responsive_table thead { display: none; } /* 헤더 숨김 */
	.responsive_table tr { display: block; border: 1px solid #ddd; margin-bottom: 15px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
	.responsive_table td { display: flex; justify-content: space-between; align-items: center; border: none; border-bottom: 1px solid #eee; padding: 10px 15px; text-align: right; }
	.responsive_table td:last-child { border-bottom: none; }
	.responsive_table td::before { content: attr(data-label); font-weight: bold; float: left; color: #666; }
}

/*국학기공의 이해*/
/* config.css 기반 커스텀 보완 스타일 */
.gh_page { color: var(--text); font-family: var(--font-family), sans-serif; }

/* 제목 스타일 - config.css의 sb-title 클래스 활용 및 보완 */
.gh_page .main_h2 { margin-bottom: 30px; padding-bottom: 15px; border-bottom: 1px solid #eee; position: relative; }
.gh_page .main_h2::after { content: ''; position: absolute; left: 0; bottom: -1px; width: 60px; height: 3px; background: var(--main-point); }

/* 박스 스타일 - config.css의 box1, round20 활용 */
.intro_content { padding: 40px; border-radius: var(--round20); background-color: #f8fbff; border: 1px solid #e9f2ff; }

/* 카드 디자인 - config.css의 shadow 및 transition 효과 반영 */
.principle_card {
	display:flex;
	gap:30px;
	background: #fff;
	padding:  20px;
	border-radius: var(--round20);
	border: 1px solid #f1f1f1;
	transition: all 0.5s ease;
	height: 100%;
}
.principle_card:hover {
	box-shadow: 0 15px 35px rgba(50, 50, 93, 0.1);
	transform: translateY(-10px);
	border-color: var(--main-point);
}

/* 뱃지 및 태그 - config.css의 badge 스타일 참조 */
.award_list{display:flex; gap:10px}
.award_tag {
	flex:1;
	display: inline-block;
	background: #fff;
	border: 1px solid #dee2e6;
	padding: 15px 10px;
	border-radius: var(--round10);
	font-weight: 600;
	font-size: 1.1rem;
	letter-spacing:-1px;
	text-align: center;
}
.award_tag i { color: #f39c12; margin-right: 8px; }

/* 단계 표시 - flow_box */
.step_container { display: flex; align-items: center; gap: 10px; margin: 20px 0; flex-wrap: wrap; }
.step_item { background: #edf2f7; padding: 6px 15px; border-radius: var(--round5); font-weight: 600; font-size: 13px; color: var(--main-point); }

.B05 .principle_card  .con-img{width:30%}
.B05 .principle_card  .con-txt{width:70%}


/*국학기공의 뿌리*/
/* config.css 기반 타임라인 커스텀 스타일 */
.history_wrap { font-family: var(--font-family), sans-serif; color: var(--text); }

/* 섹션 제목 스타일 (기존 페이지와 통일) */
.history_wrap .main_h2 { margin-bottom: 30px; padding-bottom: 15px; border-bottom: 1px solid #eee; position: relative; }
.history_wrap .main_h2::after { content: ''; position: absolute; left: 0; bottom: -1px; width: 60px; height: 3px; background: var(--main-point); }

/* 타임라인 구조 */
.timeline { position: relative; padding: 20px 0; }
.timeline::before { content: ''; position: absolute; left: 31px; top: 0; width: 2px; height: 100%; background: #e9ecef; }

.timeline_item { position: relative; margin-bottom: 50px; padding-left: 80px; }
.timeline_item:last-child { margin-bottom: 0; }

/* 타임라인 포인트 (config.css의 bg-blue-point 활용) */
.timeline_marker {
	position: absolute; left: 20px; top: 0; width: 24px; height: 24px;
	background: #fff; border: 4px solid var(--main-point); border-radius: 50%; z-index: 2;
}

/* 시대별 박스 디자인 (config.css의 box1, round15 활용) */
.timeline_content {
	background: #fafafa; padding: 30px; border-radius: var(--round15);
	border: 1px solid #f1f1f1; transition: all 0.3s ease;
}
.timeline_item:hover .timeline_content { background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,0.05); border-color: var(--main-point); }

.era_title { display: block; font-size: 1.2rem; font-weight: 800; color: var(--main-point); margin-bottom: 15px; }

/* 고대/고려/조선 등 구분 태그 */
.era_tag {
	display: inline-block; background: var(--main-point); color: #fff;
	padding: 3px 12px; border-radius: var(--round5); font-size: 0.85rem; margin-bottom: 10px;
}

/* 리스트 스타일 (config.css check_list 스타일 보완) */
.hist_list { list-style: none; padding: 0; margin: 15px 0 0; }
.hist_list li { position: relative; padding-left: 20px; margin-bottom: 8px; font-size: 0.95rem; line-height: 1.6; }
.hist_list li::before { content: '•'; position: absolute; left: 0; color: var(--main-point); font-weight: bold; }

/* 모바일 대응 */
@media screen and (max-width: 768px) {
	.timeline::before { left: 21px; }
	.timeline_marker { left: 10px; width: 20px; height: 20px; }
	.timeline_item { padding-left: 50px; }
	.timeline_content { padding: 20px; }
}

.B05 .sm-section01{flex-direction: column;}




.effect_wrap { font-family: var(--font-family), sans-serif; color: var(--text); }

/* 섹션 제목 */
.effect_wrap .main_h2 { margin-bottom: 30px; padding-bottom: 15px; border-bottom: 1px solid #eee; position: relative; }
.effect_wrap .main_h2::after { content: ''; position: absolute; left: 0; bottom: -1px; width: 60px; height: 3px; background: var(--main-point); }

/* 2x2 배열 그리드 수정 */
.effect_grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr); /* PC에서 무조건 2열 배치 */
	gap: 25px;
}

.effect_card {
	background: #fff; padding: 35px; border-radius: var(--round20);
	border: 1px solid #f1f1f1; box-shadow: 0 4px 15px rgba(0,0,0,0.02);
	transition: all 0.4s ease;
	display: flex; flex-direction: column;
}
.effect_card:hover { transform: translateY(-7px); box-shadow: 0 12px 30px rgba(0,0,0,0.07); border-color: var(--main-point); }

/* 아이콘 숫자 포인트 */
.eff_num {
	display: inline-flex; align-items: center; justify-content: center;
	width: 32px; height: 32px; background: var(--main-point); color: #fff;
	border-radius: 50%; font-weight: 800; margin-bottom: 15px; font-size: 0.9rem;
}

/* 리스트 스타일 */
.eff_list { list-style: none; padding: 0; margin: 15px 0; flex-grow: 1; }
.eff_list li { position: relative; padding-left: 22px; margin-bottom: 10px; font-size: 1rem; color: #555; }
.eff_list li i { position: absolute; left: 0; top: 6px; color: var(--main-point); font-size: 0.85rem; }

/* 원리 설명 박스 */
.theory_box {
	background: #f8fbff; padding: 15px 20px; border-radius: var(--round10);
	margin-top: 15px;font-size: 0.95rem;
}

/* 대상별 효과 태그 */
.target_box { background: #fafafa; padding: 30px; border-radius: var(--round15); border: 1px solid #eee; }
.target_item { margin-bottom: 15px; display: flex; align-items: center; }
.target_item:last-child { margin-bottom: 0; }
.target_label {
	min-width: 100px; background: #fff; border: 1px solid var(--main-point);
	color: var(--main-point); text-align: center; padding: 3px 10px;
	border-radius: var(--round5); font-weight: 700; font-size: 0.9rem; margin-right: 15px;
}

/* 모바일 대응: 1열로 전환 */
@media screen and (max-width: 992px) {
	.effect_grid { grid-template-columns: 1fr; }
	.effect_card { padding: 25px; }
}
#group_head{display:none !important}







/*수련 효과*/
/* 2*3 그리드 레이아웃 설정 */
.effect_grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* PC 2열 */
    gap: 30px;
    margin-bottom: 50px;
}

/* 카드 스타일 정의 */
.effect_card {
    background: #fff;
    padding: 35px;
    border-radius: var(--round20);
    border: 1px solid #eee;
    display: flex;
    flex-direction: column;
    position: relative;
    transition: all 0.4s ease;
}

/* 번호 디자인 (가독성 강화) */
.eff_index {
    display: block;
    font-size: 2.2rem;
    font-weight: 900;
    color: var(--main-point);
    opacity: 0.15; /* 너무 가리지 않도록 적절한 투명도 */
    line-height: 1;
    margin-bottom: 10px;
    font-family: 'Arial', sans-serif;
}

.card_head {
    margin-bottom: 15px;
}

.card_head h3 {
    margin-top: -15px; /* 번호와 겹치게 배치하여 디자인적 요소 강조 */
    position: relative;
}

.card_summary {
    color: var(--main-point);
    font-weight: 700;
    margin-bottom: 20px;
    font-size: 1.05rem;
    word-break: keep-all;
}

/* 리스트 스타일 */
.eff_list {
    margin-bottom: 25px;
    flex-grow: 1;
}

.eff_list li {
    position: relative;
    padding-left: 18px;
    margin-bottom: 8px;
    font-size: 0.95rem;
    color: #555;
    line-height: 1.5;
}

.eff_list li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 9px;
    width: 6px;
    height: 1.5px;
    background: var(--main-point);
}

/* 하단 강조 박스 */
.theory_box {
    background: #f8fbff;
    padding: 15px 18px;
    border-radius: var(--round10);
/*    border-left: 3px solid var(--main-point);*/
}

.theory_box strong {
    display: block;
    margin-bottom: 5px;
    font-size: 0.9rem;
}

.theory_box p {
    font-size: 0.88rem;
    margin: 0;
    color: #666;
    line-height: 1.4;
}

/* 6번 카드 전용 스타일 */
.effect_card_highlight {
    background: #fdfdfd;
    border-color: var(--main-point);
}

.target_list_box {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 10px;
}

.target_small_item {
    padding: 10px 15px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: var(--round5);
}

.target_small_item strong {
    display: block;
    color: var(--main-point);
    font-size: 0.9rem;
    margin-bottom: 2px;
}

.target_small_item span {
    font-size: 0.85rem;
    color: #777;
}

/* 반응형 처리 */
@media (max-width: 992px) {
    .effect_grid {
        grid-template-columns: 1fr; /* 모바일 1열 */
    }
}


.B05 .principle_card .con-img img{border-radius:20px}
.B05 .intro_content_body .intro_conbody_left{max-width:65%; padding-right:50px}
.B05 .intro_content_body .intro_conbody_right{padding-top:20px}
.B05 .intro_content_body .intro_conbody_right  img{border-radius:20px}

.B07 .con-box .con-img{border-radius:20px}
.B07 .con-box .con-img img{border-radius:20px}