.lead { font-size:16px; line-height:1.75; letter-spacing:-0.02em; color:#555; font-weight:300;  word-break:keep-all}


@media screen and (max-width: 640px) {
input:not([type=checkbox]):not([type=radio]) { /* 체크박스·라디오는 빼야 모바일에서 체크칸이 보임 */
   -webkit-appearance: none;
   -webkit-border-radius: 0;
}
.lead { font-size:17px; font-weight:400}
}


/*헤드메뉴*/
#header_wrap {position: fixed; width:100%; height:81px; background:rgba(0,0,0,0.5); z-index:10}
.scrolled #header_wrap  { background-color:#000; border-bottom:none; -webkit-transition:all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}
#header {position:relative; width:100%; z-index:6;-webkit-transition:all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}
#header .header-inner {width:100%; height:100% }
#header .gnb { list-style:none; height:100%; position:absolute; right:0px}
#header .gnb > li { float:left; position:relative; display:inline-block; width:100px;  vertical-align:middle; text-align:center;}
#header .gnb > li > a {display:inline-block; line-height:1em; width:100%; color:#ddd; font-size:15px; letter-spacing:-0.5px; font-weight:600; text-decoration:none;}
#header .gnb > li > a:hover {color: #fff}
#header .gnb > li.active {background-color: #b0905e}
#header .gnb > li.active > a {color: #fff}
#header .gnb .login {  font-size:12px; width:70px; color:#fff}
#header .gnb .join { font-size:12px; color:#fff; margin-left:20px}
#header .gnb .login a { color:#ddd; font-size:12px}
#header .gnb .login a:hover { color:#fff}
#header .gnb .join a { color:#ddd; font-size:12px}
#header .gnb .join a:hover { color:#fff}
#header .header-inner .menu {cursor:pointer;text-indent:-9999px; position:absolute;top:29px; left:50%;width:25px;height:20px; background-image:url(../img/cate_more.gif); margin-left:200px; border:0; display:none}
#header .header-inner .menu.on {background-image: url(../img/cate_close.gif)}
#header .gnb > li, #header #right-side-open {height:80px;line-height:80px; -webkit-transition: all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}
#header #right-side-open { position:absolute; right:0; width:100px; cursor:pointer; border-left:1px solid rgba(255,255,255,0.3); text-align:center; display: inline-block; }
#header #right-side-open span{display:inline-block;width:20px; height:20px;font-size:20px;line-height:1em;margin-top:-10px; margin-left:-10px; position:absolute; top:50%;left:50%; color:#fff;}
#header .gnb .snb {list-style:none; display:none;}
#header #logo { margin-left:25px; padding:0}
#header #logo a { display:block; width:100px; height:80px; line-height:80px}
#header #logo img { width:100%}
#header .gnb .snb,.device-md #header .gnb .snb{display: none;position: absolute;right: -82px;width: 200px; top:80px; border-top: 0;background-color: #000; z-index:2}
#header .gnb .snb li { font-size:14px; line-height:3.1; text-align:left; border-top:1px solid #414141;}
#header .gnb .snb li a { color:#FFF; display:block; padding-left:20px}
#header .gnb .snb li a:hover {color:#fff;  display:block; background-color:#2253b8; text-decoration:none; line-height:3.1}
#header .gnb .snb li:first-child { border-top:0}

/*헤드메뉴*/



/*메인배너 : 가운데 1200x600 + 양옆 슬라이드 미리보기(간격 60px), 화살표는 가운데 슬라이드 양끝 (index.php / 관리자 메인슬라이드 관리)*/
#main-visual {position:relative; padding-top:60px; overflow:hidden}
#main-visual .mv-swiper {overflow:visible}
#main-visual .mv-swiper:not(.swiper-initialized) .swiper-wrapper {justify-content:center} /* 1장일 때 / 스크립트 로딩 전에도 가운데 */
#main-visual .swiper-slide {width:min(1200px, calc(100% - 80px)); height:auto; aspect-ratio:2/1; border-radius:16px; overflow:hidden; background-color:#f1f3f6}
#main-visual .swiper-slide a {display:block; height:100%}
#main-visual .swiper-slide picture, #main-visual .swiper-slide img {display:block; width:100%; height:100%}
#main-visual .swiper-slide img {object-fit:cover}
#main-visual .mv-ctrl {position:absolute; top:60px; left:50%; z-index:2; width:min(1200px, calc(100% - 80px)); aspect-ratio:2/1; transform:translateX(-50%); pointer-events:none}
#main-visual .mv-arrow {position:absolute; top:50%; display:flex; align-items:center; justify-content:center; width:40px; height:40px; padding:0; border:1px solid #ddd; border-radius:50%; background-color:#fff; font-size:20px; color:#222; cursor:pointer; pointer-events:auto; transition:all 0.5s}
#main-visual .mv-arrow:hover {border-color:#222; background:#222; color:#fff}
#main-visual .mv-prev {left:0; transform:translate(-50%, -50%)}
#main-visual .mv-next {right:0; transform:translate(50%, -50%)}
#main-visual .mv-dots {display:flex; justify-content:center; gap:8px; padding-top:13px}
#main-visual .mv-dots button {width:10px; height:10px; padding:0; border:0; border-radius:50%; background-color:#ccc; cursor:pointer; transition:background-color .2s}
#main-visual .mv-dots button.on {background-color:#111}

@media screen and (max-width:768px) {
	#main-visual {padding-top:20px}
	#main-visual .swiper-slide {width:calc(100% - 48px); aspect-ratio:auto; border-radius:10px}
	#main-visual .swiper-slide picture, #main-visual .swiper-slide img {height:auto}
	#main-visual .mv-ctrl {display:none}
	#main-visual .mv-dots {padding-top:12px; gap: 6px;}
	#main-visual .mv-dots button {width:6px; height:6px}
}
/*메인배너*/

/*카드배너 : 290x290 카드 (PC 4장 = 1200px), 화살표 없이 아래 스크롤바로 이동 (index.php / 관리자 카드배너 관리)*/
#main-card {padding-top:80px}
#main-card .mc-inner {position:relative; max-width:1200px; margin:0 auto; padding:0 20px; box-sizing:content-box}
#main-card .swiper-slide {width:290px; height:auto; aspect-ratio:1/1; border-radius:8px; overflow:hidden; background-color:#f1f3f6}
#main-card .swiper-slide a {display:block; height:100%}
#main-card .swiper-slide img {display:block; width:100%; height:100%; object-fit:cover}
#main-card .mc-scrollbar {position:relative; left:auto; bottom:auto; z-index:auto; width:100%; height:2px; margin-top:30px; border-radius:0; background-color:#ccc}
#main-card .mc-scrollbar .swiper-scrollbar-drag {border-radius:0; background-color:#111; cursor:grab}
#main-card .mc-scrollbar.swiper-scrollbar-lock {display:none} /* 카드가 한 화면에 다 들어가면 바 숨김 */

@media screen and (max-width:768px) {
	#main-card {padding-top:60px}
	#main-card .mc-inner {padding:0 16px}
	#main-card .swiper-slide {width:calc((100% - 10px) / 2.2)}
	#main-card .mc-scrollbar {margin-top:20px}
}
/*카드배너*/

/*con1 : 왼쪽(con1_l) 바로가기 3개 + 대표번호 / 오른쪽(con1_r) 메가스터디 소식 탭 (index.php)*/
.con1 {display:flex; gap:32px; max-width:1200px; margin:0 auto; padding:80px 20px; box-sizing:content-box}
.con1_l {display:flex; flex-direction:column; width:502px; flex-shrink:0}
.con1_l_top {padding:0 30px; border:1px solid #efefef; border-radius:16px}
.con1_l_top li + li {border-top:1px solid #efefef}
.con1_l_top a {display:flex; align-items:center; gap:22px; padding:19px 0}
.con1_l_icon {display:flex; align-items:center; justify-content:center; flex-shrink:0; width:52px; height:52px; border-radius:50%; background-color:#efefef}
.con1_l_icon img {display:block; max-width:24px; max-height:24px}
.con1_l_txt {flex:1; min-width:0; font-size:14px; line-height:1.4; color:#666}
.con1_l_txt strong {display:block; margin-bottom:3px; font-size:16px; font-weight:700; color:#111}
.con1_l_top a i {margin-right:10px; font-size:24px; color:#333; transition:transform .2s}
.con1_l_top a:hover i {transform:translateX(3px)}
.con1_l_bottom {position:relative; display:flex; flex-direction:column; margin-top:34px; padding:28px 0 28px 155px; border-radius:8px; background-color:#1a6874; color:#fff}
.con1_l_bubble {position:absolute; left:34px; top:-20px; width:80px; height:auto}
.con1_l_bottom p {margin:0; font-size:15px}
.con1_l_bottom p b {font-weight:800}
.con1_l_bottom a {margin-top:4px; font-size:26px; font-weight:800; letter-spacing:.02em; color:#fff}
.con1_r {flex:1; min-width:0}
.con1_r_tit {margin:0 0 22px; font-size:28px; font-weight:500; line-height:1.2; color:#111}
.con1_r_tit b {font-weight:800}
.con1_r_top {display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px}
.con1_r_tab {display:flex; gap:8px}
.con1_r_more {flex-shrink:0; display:flex; align-items:center; gap:4px; font-size:14px; font-weight:600; color:#555}
.con1_r_more:hover {color:#111}
.con1_r_tab button {padding:9px 20px; border:0; border-radius:18px; background-color:#eee; font-size:14px; color:#999; transition:background-color .2s, color .2s}
.con1_r_tab button:hover {color:#555}
.con1_r_tab button.on {background-color:#f26a2e; font-weight:600; color:#fff}
.con1_r_list {display:none}
.con1_r_list.on {display:block}
.con1_r_list li + li {margin-top:6px}
.con1_r_list a {display:flex; align-items:center; padding:19px 20px; border:1px solid #eee; border-radius:4px; background-color:#fff}
.con1_r_list li.notice a {border-color:#f6f5fa; background-color:#f6f5fa}
.con1_r_list a:hover {background-color:#f5f5f5}
.con1_r_list li.notice a:hover {border-color:#eeedf4; background-color:#eeedf4}
.con1_r_badge {flex-shrink: 0; margin: -4px 17px -4px 0; /* 위아래 -4px : 배지 있는 줄도 높이 같게 */ padding: 7px 11px; border-radius: 5px; background-color: #0c2c4a; font-size: 12px; font-weight: 500; line-height: 1; color: #fff;}
.con1_r_ca {flex-shrink:0; margin:-4px 17px -4px 0; padding:6px 10px; border:1px solid #f26a2e; border-radius:5px; font-size:12px; font-weight:600; line-height:1; color:#f26a2e} /* 분류 : 주황 테두리 배지 (게시판 스킨 분류와 같은 색 / 공지 = 남색 채운 배지) */
.con1_r_badge + .con1_r_ca {margin-left:-11px} /* 공지 + 분류 같이 있을 때 둘 사이 6px */
.con1_r_state {flex-shrink:0; margin:-4px 17px -4px 0; padding:6px 10px; border:1px solid #ccc; border-radius:5px; font-size:12px; font-weight:600; line-height:1; color:#888} /* Q&A 답변대기 (Q&A 게시판 목록과 같은 모양) */
.con1_r_state.on {border-color:#2ca688; background-color:#2ca688; color:#fff} /* 답변완료 : 초록 (Q&A 게시판과 같은 색) */
.con1_r_state + .con1_r_ca {margin-left:-11px}
.con1_r_subject {flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:15px; font-weight: 500;}
.con1_r_subject i {font-size:13px; color:#999}
.con1_r_date {flex-shrink:0; margin-left:20px; font-size:14px; color:#999}
.con1_r_list li.empty {padding:40px 0; border:1px solid #eee; border-radius:4px; font-size:15px; color:#999; text-align:center}

@media screen and (max-width:1100px) {
	.con1 {flex-direction:column; gap:50px}
	.con1_l {width:auto}
}
@media screen and (max-width:768px) {
	.con1 {padding:60px 16px; gap:48px}
	.con1_l_top {padding:0 20px}
	.con1_l_top a {gap:16px; padding:16px 0}
	.con1_l_top a i {font-size: 20px;}
	.con1_l_icon {width:44px; height:44px}
	.con1_l_txt {font-size:13px}
	.con1_l_txt strong {font-size:15px}
	.con1_l_bottom {padding:25px 0 25px 120px}
	.con1_l_bubble {left:22px; width:68px}
	.con1_l_bottom p {font-size:14px}
	.con1_l_bottom a {font-size:22px}
	.con1_r_tit {margin-bottom:16px; font-size:22px}
	.con1_r_tab {gap:6px}
	.con1_r_more {font-size:13px}
	.con1_r_tab button {padding:8px 16px; font-size:13px}
	.con1_r_list a {padding:16px 14px}
	.con1_r_badge {margin-right:10px}
	.con1_r_ca, .con1_r_state {margin-right:10px}
	.con1_r_badge + .con1_r_ca, .con1_r_state + .con1_r_ca {margin-left:-4px}
	.con1_r_subject {font-size:13px}
	.con1_r_date {margin-left:10px; font-size:12px}
}
/*con1*/

/*con2 : 합격자 명단 (k1 게시판), 한 칸 200px 이 오른쪽→왼쪽으로 계속 흐름 (index.php)*/
.con2 {padding:80px 0; background:#222 url(../img/con2_bg.jpg) center / cover no-repeat; color:#fff; text-align:center; overflow:hidden}
.con2_tit h2 {margin:0; font-size:28px; font-weight:600}
.con2_tit_sub {margin:10px 0 0; font-size:20px; font-weight:600; color:#d6b25e}
.con2_tit_txt {margin:22px 0 0; font-size:16px}
.con2_tit_txt b {font-weight:800}
.con2_list {margin-top:80px; overflow:hidden}
.con2_track {display:flex; width:max-content; animation:con2_flow linear infinite} /* animation-duration 은 index.php 에서 인원수로 계산 */
.con2_list:hover .con2_track {animation-play-state:paused}
.con2_track li {flex-shrink:0; width:200px; border-left:1px solid rgba(255,255,255,.12)}
.con2_track a {display:block; color:#fff}
.con2_univ {margin:0; font-size:17px; font-weight:700; color:#d6b25e}
.con2_major {margin:4px 0 0; font-size:14px; font-weight:500}
.con2_icon {display:block; width:60px; height:auto; margin:20px auto 0}
.con2_name {margin:16px 0 0; font-size:16px; font-weight:700}
.con2_school {margin:6px 0 0; font-size:12px; color:#bbb}
@keyframes con2_flow {
	from {transform:translateX(0)}
	to {transform:translateX(-50%)} /* 같은 목록을 두 번 붙였으므로 절반 이동하면 처음과 같은 모습 */
}

@media screen and (max-width:768px) {
	.con2 {padding:60px 0}
	.con2_tit h2 {font-size:22px}
	.con2_tit_sub {font-size:15px}
	.con2_tit_txt {margin-top:14px; padding:0 16px; font-size:13px}
	.con2_list {margin-top:40px}
	.con2_track li {width:150px}
	.con2_univ {font-size:14px}
	.con2_major {font-size:12px}
	.con2_icon {width:48px; margin-top:14px}
	.con2_name {margin-top:12px; font-size:15px}
}
/*con2*/

/*con3 : 홍보영상 — 왼쪽 큰 영상(772x436) + 오른쪽 목록(409px, 왼쪽 높이만큼 위아래 스크롤) (index.php / 관리자 홍보영상 관리)*/
.con3 {position:relative; max-width:1200px; margin:0 auto; padding:80px 20px; box-sizing:content-box}
.con3_head {display:flex; align-items:flex-end; justify-content:space-between; gap:20px} /* 제목 + 오른쪽 MORE */
.con3_more {flex-shrink:0; display:flex; align-items:center; gap:4px; font-size:14px; font-weight:600; color:#555} /* 메가스터디 소식 MORE 와 같은 모양 */
.con3_more:hover {color:#111}
.con3_tit {margin:0; font-size:26px; font-weight:700; color:#111}
.con3_txt {margin:8px 0 0; font-size:16px; color:#555}
.con3_box {display:flex; gap:18px; margin-top:33px}
.con3_play {position:relative; flex:1; min-width:0; aspect-ratio:772/436; border-radius:8px; overflow:hidden; background-color:#000}
.con3_poster {display:block; width:100%; height:100%; object-fit:cover}
.con3_btn {position:absolute; top:50%; left:50%; padding:0; border:0; background:none; cursor:pointer; opacity:.9; transform:translate(-50%, -50%); transition:opacity .2s}
.con3_btn:hover {opacity:1}
.con3_btn svg {display:block}
.con3_play.playing .con3_poster, .con3_play.playing .con3_btn {display:none}
.con3_play iframe {position:absolute; top:0; left:0; width:100%; height:100%; border:0}
.con3_list {flex-shrink:0; width:409px; contain:size; overflow-y:auto} /* contain:size → 목록 높이를 왼쪽 영상 높이에 맞추고 넘치면 스크롤 */
.con3_list li + li {margin-top:5px}
.con3_list button {display:flex; align-items:center; gap:11px; width:100%; padding:7px; border:0; border-radius:8px; background:none; text-align:left; cursor:pointer}
.con3_list button:hover {background-color:#f7f7f7}
.con3_list li.on button {background-color:#f1f4f7}
.con3_list img {flex-shrink:0; width:140px; aspect-ratio:16/9; border-radius:6px; object-fit:cover}
.con3_list_txt {min-width:0}
.con3_list_txt strong {display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; font-size:15px; font-weight:500; color:#111; line-height: 1.4;}
.con3_list_txt em {display:block; margin-top:6px; font-size:12px; font-style:normal; color:#999}
.con3_list::-webkit-scrollbar {width:4px}
.con3_list::-webkit-scrollbar-thumb {border-radius:2px; background-color:#ddd}

@media screen and (max-width:960px) {
	.con3_box {flex-direction:column}
	.con3_list {width:auto; max-height:340px; contain:none}
}
@media screen and (max-width:768px) {
	.con3 {padding:60px 16px}
	.con3_tit {font-size:22px}
	.con3_more {font-size:13px}
	.con3_txt {font-size:13px}
	.con3_box {margin-top:20px}
	.con3_list {max-height:200px;}
	.con3_list img {width:120px}
	.con3_list_txt strong {font-size:13px}
	.con3_btn svg {width:52px; height:37px}
}
/*con3*/

/*con4 : 학원행사 / 학원시설 — 제목 탭 + 290x190 사진 4장씩 넘김 + 아래 점 (index.php)*/
.con4 {max-width:1200px; margin:0 auto; padding:0 20px 80px; box-sizing:content-box}
.con4_top {display:flex; align-items:center; justify-content:space-between}
.con4_tab {display:flex; gap:12px}
.con4_more {display:none; align-items:center; gap:4px; font-size:14px; font-weight:600; color:#555} /* MORE 더보기 (선택된 탭 것만 보임 / 메가스터디 소식 MORE 와 같은 모양) */
.con4_more.on {display:flex}
.con4_more:hover {color:#111}
.con4_tab button {padding:0; border:0; background:none; font-size:24px; font-weight:700; color:#ccc; cursor:pointer; transition:color .2s}
.con4_tab button:hover {color:#999}
.con4_tab button.on {color:#111}
.con4_panel {display:none; margin-top:22px}
.con4_panel.on {display:block}
.con4_swiper a {display:block}
.con4_img {display:block; aspect-ratio:290/190; border-radius:8px; overflow:hidden; background-color:#f1f3f6}
.con4_img img {display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s}
.con4_swiper a:hover .con4_img img {transform:scale(1.04)}
.con4_subject {display:block; margin-top:12px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:15px; color:#111}
.con4_empty {padding:60px 0; border:1px solid #eee; border-radius:8px; font-size:14px; color:#999; text-align:center}
.con4_dots {display:flex; justify-content:center; gap:4px; margin-top:28px}
.con4_dots .swiper-pagination-bullet {width:8px; height:8px; margin:0 !important; background-color:#ccc; opacity:1}
.con4_dots .swiper-pagination-bullet-active {background-color:#111}
.con4_dots.swiper-pagination-lock {display:none} /* 한 페이지면 점 숨김 */

@media screen and (max-width:768px) {
	.con4 {padding:0 16px 60px}
	.con4_tab button {font-size:22px} /* 모바일 섹션 제목 22px 통일 */
	.con4_more {font-size:13px}
	.con4_panel {margin-top:16px}
	.con4_subject {margin-top:8px; font-size:13px}
	.con4_dots {gap:6px; margin-top:20px}
	.con4_dots .swiper-pagination-bullet {width:6px; height:6px} /* 메인슬라이드 점과 같은 크기 */
}
/*con4*/

/*con5 : Q&A 배너(1200x178, 학생 이미지가 위로 80px 튀어나옴) + 카드 3개(390x109) (index.php)*/
.con5 {max-width:1200px; margin:0 auto; padding:40px 20px 80px; box-sizing:content-box}
.con5_banner {position:relative; display:flex; align-items:center; justify-content:space-between; min-height:178px; padding:0 57px 0 360px; border-radius:8px; background:radial-gradient(ellipse 54.6% 78.7% at 50% 0, #377ef0 calc(100% - 1px), #1f6fea 100%); box-sizing:border-box} /* 위쪽 하늘색 반달 + 아래 파랑 (시안 경계를 측정해 맞춘 타원, 이미지 없음) */
.con5_img {position:absolute; left:30px; bottom:0; width:284px; height:auto}
.con5_txt h2 {margin:0; font-size:24px; font-weight:700; color:#fff}
.con5_txt p {margin:14px 0 0; font-size:14px; color:rgba(255,255,255,.85)}
.con5_btn {flex-shrink:0; display:flex; align-items:center; gap:6px; padding:12px 26px; border-radius:22px; background-color:#fff; font-size:15px; font-weight:700; color:#1f5fd6}
.con5_btn i {font-size:16px; transition:transform .2s}
.con5_btn:hover i {transform:translateX(4px)}
.con5_card {display:flex; gap:15px; margin-top:13px}
.con5_card li {flex:1}
.con5_card li > a, .con5_card_box {display:flex; align-items:center; gap:18px; height:100%; padding:26px 33px; border-radius:8px; box-sizing:border-box; transition:filter .2s}
.con5_card li > a:hover {filter:brightness(.97)}
.con5_card1 a {background-color:#e2f1e6}
.con5_card2 .con5_card_box {background-color:#e0ddf1}
.con5_card3 a {background-color:#dfe6f2}
.con5_scholar {display:flex; flex-wrap:wrap; gap:4px; margin-top:8px} /* 장학제도 반별 버튼 (카드 연보라와 같은 계열의 진한 보라) */
.con5_scholar a {padding:3px 8px; border-radius:6px; background-color:#3d30a5; font-size:13px; color:#fff; transition:background-color .2s}
.con5_scholar a:hover {background-color:rgb(126, 116, 194)}
.con5_icon {display:flex; align-items:center; justify-content:center; flex-shrink:0; width:56px; height:56px; border-radius:50%; background-color:#fff}
.con5_icon img {display:block; max-width:28px; max-height:28px}
.con5_card_txt {font-size:14px; color:#555}
.con5_card_txt strong {display:block; margin-bottom:4px; font-size:18px; font-weight:700; color:#111}

@media screen and (max-width:1100px) {
	.con5_banner {padding-left:270px; padding-right:30px}
	.con5_img {left:16px; width:230px}
}
@media screen and (max-width:768px) {
	.con5 {padding:0 16px 60px} /* 학생 이미지를 숨기므로 위 여백 없음 (학원행사 아래 60px 이 간격) */
	.con5_banner {flex-direction:column; align-items:flex-start; gap:18px; min-height:0; padding:28px 24px}
	.con5_img {display:none}
	.con5_txt h2 {font-size:18px}
	.con5_txt p {margin-top:8px; font-size:12px}
	.con5_btn {padding:10px 20px; font-size:14px}
	.con5_card {flex-direction:column; gap:10px; margin-top:10px}
	.con5_card li > a, .con5_card_box {gap:14px; padding:18px 20px}
	.con5_scholar a {font-size: 12px;}
	.con5_icon {width:46px; height:46px}
	.con5_icon img {max-width:24px; max-height:24px}
	.con5_card_txt strong {font-size:15px}
}
/*con5*/


















/*관리자 전용 : 메인 영역별 [수정] 버튼 / 등록된 항목이 없을 때 등록 안내 (최고관리자 로그인 시에만 출력)*/
.adm_edit {position:absolute; z-index:5; padding:7px 12px; border-radius:4px; background-color:rgba(0,0,0,.75); font-size:12px; color:#fff}
.adm_edit:hover {background-color:#000}
#main-visual .adm_edit {top:72px; right:calc(50% - min(600px, (100% - 80px) / 2) + 12px)} /* 가운데 슬라이드 오른쪽 위 */
#main-card .adm_edit {top:-42px; right:20px}
.adm_empty {max-width:1200px; margin:30px auto 0; padding:0 20px; box-sizing:content-box}
.adm_empty a {display:block; padding:18px; border:1px dashed #ccc; border-radius:8px; font-size:14px; color:#666; text-align:center}
.adm_empty a:hover {background-color:#f7f7f7}

@media screen and (max-width:768px) {
	#main-visual .adm_edit {top:32px; right:36px}
	#main-card .adm_edit {top:-34px; right:16px}
}
/*관리자 전용*/




/*상단 바로가기 아이콘*/
.tl_company_box_wrap{ width:100%; padding:0px;  position:relative;  z-index:2}
.tl_company_box_wrap .company_inner { width:100%!important;background-color:#fff}
.tl_company_box_wrap h2 {text-align:center; font-size:35px; color:#333}
.tl_company_box_wrap h2 span{ display:block; padding:20px 0; color:#555; font-size:15px; letter-spacing:-0.02em; font-weight:300}
.tl_company_box_wrap ul {overflow:hidden; background-color:#fff}
.tl_company_box_wrap ul li{ width:33.3333%; text-align:center; float:left; display:block}
.tl_company_box_wrap ul li .icon { display:inline-block; padding:24px; border: 1px solid #222; border-radius: 50%; margin-right: 30px; vertical-align: top; margin-bottom: 10px;}
.tl_company_box_wrap ul li .icon i { color:#222; font-size:28px}
.tl_company_box_wrap ul li img {vertical-align:middle; transition:transform 500ms}
.tl_company_box_wrap ul li:hover .icon {transform:rotateY(180deg); transition:transform 500ms; color:#74314f; cursor: pointer; }
.tl_company_box_wrap ul li .box {border-right:1px  #eaeaea solid; padding:40px; display:block}
.tl_company_box_wrap ul li:last-child .box {border-right:0px}
.tl_company_box_wrap .tit_box {display: inline-block} 
.tl_company_box_wrap .tit_box h5 {font-weight:bold; padding-bottom:15px; line-height:20px; color:#222; font-size:17px; text-align: left; letter-spacing: 3px;}
.tl_company_box_wrap .tit_box p {color:#555; font-size:14px; font-weight:300; line-height:1.6; text-align: left;}

/*.tl_company_box_wrap ul li dl dt {font-weight:bold; padding-bottom:15px; line-height:20px; color:#222; font-size:20px}


.tl_company_box_wrap ul li dl dd {color:#555; font-size:15px; font-weight:300; line-height:1.6}*/
.tl_company_box_wrap ul li a {display:inline-block; margin-top:20px; border:1px #ddd solid; padding:0 20px; line-height:30px; color:#333;  transition: all .2s}
.tl_company_box_wrap ul li:hover a {background:#2253b8; color:#fff; transition: all .3s}

@media screen and (max-width:960px) {
	.tl_company_box_wrap ul li { width:100%; clear:both; float:none; text-align: left;}
	.tl_company_box_wrap ul li .box { border-left:0; border-bottom:1px solid #ddd; padding-bottom:10%}
}

@media screen and (max-width:640px) {

   	.tl_company_box_wrap { margin-top:0}
	.tl_company_box_wrap ul { margin-top:0}
	.tl_company_box_wrap ul li .box {padding:40px 20px;}
	.tl_company_box_wrap ul li .icon {padding:14px; margin-right: 20px;}
}
/*상단 바로가기 아이콘*/




/*회사소개*/
.tl_about_box_wrap  {width:100%; padding: 100px 0;  clear:both}
.tl_about_box_wrap .photo_box { width:50%; float:left; position: relative;}
.tl_about_box_wrap .photo_box .photo_01 { width: 500px; height:400px; background-image:url(../img/tl_about_box_wrap.jpg); background-repeat:no-repeat; background-position:top center; background-size:cover; position: relative; }
.tl_about_box_wrap .photo_box .photo_02 {width: 350px; height:450px; background-image:url(../img/tl_about_box_wrap_01.jpg); background-repeat:no-repeat; background-position:center center; background-size:cover; position: absolute; z-index: 2; border: 20px solid #fff; top: 100px; right: 0;}

.tl_about_box_wrap .txt { width:50%; min-height:502px; padding:65px; float:left;  box-sizing:border-box}
.tl_about_box_wrap .txt h2 { font-size:35px; letter-spacing:3px; font-weight:bold}
.tl_about_box_wrap .txt p { display:block; padding:20px 0; color:#555; font-size:15px; line-height:1.75; letter-spacing:-0.02em; font-weight:300}
.tl_about_box_wrap .txt i { font-size:10px}
/*.tl_about_box_wrap a  {display:inline-block; font-size:14px;  margin-top:40px; border:1px solid #ddd; color:#333; font-weight:300; line-height:40px; padding:0 30px; transition: all 0.2s}*/
/*.tl_about_box_wrap a:hover {padding:0 40px; transition: all 0.3s; background-color:#2253b8; color:#fff}*/


@media screen and (max-width:1200px) {
	.tl_about_box_wrap  { padding:0;}
	.tl_about_box_wrap .photo_box { width:100%;clear:both; float:none}
	.tl_about_box_wrap .txt  { width:100%;min-height:300px; margin-top: 100px; clear:both; float:none}
}


@media screen and (max-width: 640px) {
	.tl_about_box_wrap  { padding:0;}
    .tl_about_box_wrap .txt { padding:45px;min-height:300px; margin-top: 100px;}
	.tl_about_box_wrap .txt h2 { font-size:33px;}
}
 /*회사소개*/
 

 /*FIELD*/
	.tl_biz_area_wrap {display:flex; width: 100%; padding: 200px 50px 50px 50px; flex-wrap: wrap;}
	.tl_biz_area_wrap .box_item_01 {width: 60%;}
	.tl_biz_area_wrap .box_item_02 {width: 40%; background-color: #282e0f;height: 350px; margin-top: -50px; padding: 80px; }
	.tl_biz_area_wrap .box_item_02 h2{ font-size: 35px;    letter-spacing: 3px;    font-weight: bold; color: #fff;}
	.tl_biz_area_wrap .box_item_02 p{ display: block;    padding: 20px 0;    color: #fff;    font-size: 14px;    line-height: 1.75;  font-weight: 100;}
	.tl_biz_area_wrap .box_item_01 .item_img {width: 100%; height: 400px; background-image: url("../img/tl_about_box_wrap_03.jpg") ; background-position: center;  background-size:cover;}
	@media all and (max-width:960px) {
	.tl_biz_area_wrap {padding: 50px 20px;}
    .tl_biz_area_wrap .box_item_01 {width: 100%;}
	.tl_biz_area_wrap .box_item_02 {width: 100%;height: 350px;}				
	}	
	@media all and (max-width:640px) {
	.tl_biz_area_wrap {padding: 50px 20px;}
    .tl_biz_area_wrap .box_item_01 {width: 100%;}
	.tl_biz_area_wrap .box_item_02 {width: 100%;height: 450px;}		
	}
	
.video_area {height:400px;position:relative;z-index:1;display:flex;align-items:center;}
.video_area .intro_video_iner {width: 100%;height: 100%; padding: 50px;}
	
.video_area h2 { text-align:center; font-size:16px; color:#f5f5f5; font-weight:600; padding-bottom:20px; letter-spacing:15px; margin-top:40px; position:relative}

.video_area .intro_video_icon { margin-top: 70px;}
.video_area .video-play-button{position:absolute;z-index:10;left:50%;transform:translateX(-50%) translateY(-50%);box-sizing:content-box;display:block;width:32px;height:44px; float: left;;border-radius:50%;padding:18px 20px 18px 28px; border:1px solid #fff;}
.video_area .video-play-button:before{content:"";position:absolute;z-index:0;left:50%;top:50%;transform:translateX(-50%) translateY(-50%);display:block;width:80px;height:80px;background:rgba(255,255,255,.3);border-radius:50%;animation:pulse-border 1.5s ease-out infinite}
.video_area .video-play-button:after{content:"";position:absolute;z-index:1;left:50%;top:50%;transform:translateX(-50%) translateY(-50%);display:block;width:80px;height:80px;background:rgba(255,255,255,.2);border-radius:50%;transition:all .2s}
.video_area .video-play-button:hover:after {background: rgba(255, 255, 255, 0.3);}
.video_area .video-play-button img{position:relative;z-index:3;max-width:100%;width:auto;height:auto}
.video_area .video-play-button span { display: inline-block; position: relative; z-index: 3; top: 8px; cursor: pointer;}
.video_area .ti-control-play:before { content: "\e6ad";font-size: 28px;color: #fff;}

@keyframes pulse-border {
  0% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);opacity: 1;}
  100% {transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);opacity: 0;}
}

	
 /*FIELD*/



 
 
/* 업무분야*/
.tl_business_area_wrap  {width:100%; min-height:900px; padding:150px 0px; background-image:url(../img/business_area.jpg); background-repeat:no-repeat; background-position:top center; background-size:cover; clear:both}
.tl_business_area_wrap h2 { max-width:1200px; margin:0 auto; overflow:hidden; font-size:35px; color:#fff; text-align:center; font-weight:bold}
.tl_business_area_wrap span {max-width:1200px; margin:0 auto; overflow:hidden; display:block; padding:30px 10px 100px 10px; color:#f5f5f5; text-align:center; font-size:15px; letter-spacing:-0.02em; line-height:1.75; font-weight:300}
.tl_business_area_wrap ul { max-width:1798px; margin:0 auto}
.tl_business_area_wrap ul li { float:left; display:inline-block; width:15%; margin-left:2.0%; text-align:center}
.tl_business_area_wrap ul li a { height:415px}
@media screen and (min-width:1201px) {
   .tl_business_area_wrap ul li:nth-child(6n+1) { margin-left:0}
}
.tl_business_area_wrap ul li h2 { display:block; font-size:15px; font-weight:400; padding-top:10px; text-align:center; color:#fff}
.tl_business_area_wrap ul .down {margin-top:40px}
.tl_business_area_wrap ul li .img { width:100%; height:415px; background-repeat:no-repeat; background-position:top center; background-size:cover;   -webkit-transform: scale(1);transform: scale(1);transition: all 1s ease;-webkit-transition: all 1s ease;}
.tl_business_area_wrap ul li .img01 { background-image:url(../img/business_area_img01.jpg)}
.tl_business_area_wrap ul li .img02 { background-image:url(../img/business_area_img02.jpg)}
.tl_business_area_wrap ul li .img03 { background-image:url(../img/business_area_img03.jpg)}
.tl_business_area_wrap ul li .img04 { background-image:url(../img/business_area_img04.jpg)}
.tl_business_area_wrap ul li .img05 { background-image:url(../img/business_area_img05.jpg)}
.tl_business_area_wrap ul li .img06 { background-image:url(../img/business_area_img06.jpg)}
.tl_business_area_wrap ul li a:hover .img {-webkit-transform: scale(1.1);transform: scale(1.1)}
 
 @media screen and (max-width:1200px) {
	.tl_business_area_wrap ul li { width:31.3333%; margin-left:3.0%; margin-bottom:3%}
	.tl_business_area_wrap ul .down { margin-top:0}
}



@media all and (max-width:1200px) and (min-width:961px) {
    .tl_business_area_wrap ul li:nth-child(3n+1) { margin-left:0}
}

@media all and (max-width:960px) {
	.tl_business_area_wrap ul li { width:48.5%; margin-left:3.0%; margin-bottom:5%}
	.tl_business_area_wrap ul li:nth-child(2n+1) { margin-left:0}
}
 
@media all and (max-width:640px) { 
	.tl_business_area_wrap { padding:80px 0}
	.tl_business_area_wrap ul li .img { height:310px} 
}
 /* 업무분야*/
 
 
 
 
 
 
/*Our Business*/
.tl_colum_wrap {width:100%; max-width:1400px; margin:0 auto; overflow:hidden; min-height:600px; padding:150px 0px; clear:both}
.tl_colum_wrap h2 { font-size: 35px;   letter-spacing: 3px;    font-weight: bold; text-align:center}
.tl_colum_wrap p { display:block; padding:30px 10px 100px 10px; font-size:15px; color:#555; font-weight:300; line-height:1.75; letter-spacing:-0.02em; text-align:center}
.tl_colum_wrap li {position:relative; width:47.5%; margin-left:5%; float:left; cursor:pointer;  -webkit-transition: all 0.4s; transition: all 0.4s; margin-bottom: 5%;}
.tl_colum_wrap li .bg { background-color:#74314f; opacity:0; position:absolute; width:100%; height:100%; top:0;left:0; z-index:1}

.tl_colum_wrap li:hover .bg {opacity: 0.7; -webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-ms-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out; }
.tl_colum_wrap li:hover {-webkit-box-shadow:4px 4px 9px 0 rgba(0,0,0,.15);-ms-box-shadow:4px 4px 9px 0 rgba(0,0,0,.15);box-shadow:4px 4px 9px 0 rgba(0,0,0,.15);-webkit-transform:translateY(-25px);transform:translateY(-25px)}
.tl_colum_wrap li .txt_wrap{width:100%;height:100%; position:absolute; top:0; left:0; box-sizing:border-box;overflow:hidden;padding:40px;color:#fff;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-ms-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out; opacity:0; z-index:2;}
.tl_colum_wrap li:hover .txt_wrap { opacity:1}
.tl_colum_wrap li .txt_wrap .cell { text-align:center;width:100%;margin-left:50%; margin:25% 50%; transform: translate(-50%,-50%);}
.tl_colum_wrap li .txt_wrap .cell h2 { font-size:34px; color:#fff; margin:0;  font-weight:bold;}
.tl_colum_wrap li .txt_wrap .cell p { font-size:15px; padding: 20px; color:#fff; opacity:0.8; line-height:1.6; word-break:keep-all;}
.tl_colum_wrap li:nth-child(2n+1) { margin-left:0}


@media all and (max-width:640px) {
	.tl_colum_wrap h2 { font-size:24px}
	.tl_colum_wrap li { width:100%; margin-left:0; margin-bottom:5%}
	.tl_colum_wrap li .txt_wrap .cell h2 { font-size:20px}
}
/* Our Business*/

 
 
/*백그라운드 탭*/
.tl_background_change_wrap{position:relative;padding:150px 0}
.change_02{background-color:#fff;background-image:url(../img/business_home.jpg);background-repeat:no-repeat;background-position:center center;background-size:cover;-webkit-transition:background .25s linear;transition:background .25s linear}
.tl_background_change_wrap ul { position: relative;}
.tl_background_change_wrap ul > li { float: right;width: 25%}
.tl_background_change_wrap ul > li > .wrapper{position:relative;display:table;width:100%; background-color: rgba(255,255,255,0.6); padding:40px;border:1px solid #f5f5f5;border-left-width:0;-webkit-transition:background .26s linear,border .26s linear;transition:background .26s linear,border .26s linear}
.tl_background_change_wrap ul > li:last-child>.wrapper {border-left-width: 1px}
.tl_background_change_wrap ul > li >.wrapper > .box { vertical-align: middle; display:table-cell}
.tl_background_change_wrap ul i {display:block;width:62px;height:60px; font-size:52px; margin:0 auto}

.tl_background_change_wrap ul h5{font-size:18px;margin:25px 0;text-align:center; font-weight:500; letter-spacing: 3px;}
.tl_background_change_wrap ul p{font-size:15px;line-height:1.6;text-align:left;opacity:.5}
.tl_background_change_wrap ul .arrow{position:relative;width:40px;height:14px;margin:33px auto 0;opacity:0}
.tl_background_change_wrap ul .arrow:before{content:"";display:block;position:absolute;left:0;top:4px;width:39px;height:2px;background:#fff}
.tl_background_change_wrap ul .arrow:after{content:"";display:block;position:absolute;right:0;width:7px;height:7px;border-right:2px solid #fff;border-bottom:2px solid #fff;-ms-transform:rotate(-45deg);transform:rotate(-45deg)}
.tl_background_change_wrap ul>li>.wrapper:hover{background:#282e0f;border-color:#282e0f; color: #fff}
.tl_background_change_wrap ul>li>.wrapper:hover .arrow,.tl_background_change_wrap ul>li>.wrapper:hover p{opacity:1}
.tl_background_change_wrap ul h5:hover{color:#fff}
.tl_background_change_wrap ul p:hover{color:#fff}

.tl_row{padding-bottom:50px; position: absolute}
.tl_row .col-12{float:left;position:relative;width:100%}
.tl_row .col-12:last-child { padding-left: 90px;padding-top: 10px}
.tl_row h2{ max-width:400px; font-size:36px;font-weight:600;line-height:59px;letter-spacing:3px;color: #fff}
.tl_row p{font-size:15px;line-height:1.6;color:#fff;font-weight:400; max-width:400px; word-break:keep-all}
.tl_row p:before{content:"";display:block;position:absolute;top:36px;left:-20px;width:60px;height:3px;background:#fff}



/* 가로모드 모바일 디바이스 (가로 해상도가 576px 이하인 화면에 적용) */
@media all and (max-width: 576px) { 
    .tl_background_change_wrap{padding:70px 0}
	.tl_background_change_wrap ul h2 { font-size: 19px}
    .tl_background_change_wrap ul p { font-size: 13px; line-height: 20px }
	.tl_background_change_wrap ul > li {width: 100% }
    .tl_background_change_wrap ul > li >.wrapper { height: auto; padding: 30px 25px }
	.tl_row{padding-bottom:50px; position: relative}
    .tl_row .col-12{width:100%}
	.tl_row .col-12:last-child{padding:0 20px}
	.tl_row h2{font-size:28px;line-height:34px;text-align:center; max-width:none}
	.tl_row p{font-size:15px;padding:10px; text-align: center;  max-width:none}
	.tl_row p:before{display:none}
}


/* 태블릿 디바이스 (가로 해상도가 576px 보다 큰 화면에 적용) */
@media all and (min-width: 577px) and (max-width:992px) {  
	.tl_row{padding-bottom:50px; position: relative}
    .tl_row .col-12{width:100%}
	.tl_row .col-12:last-child{padding:0 20px}
	.tl_row h2{font-size:28px;line-height:34px;text-align:center; max-width:none}
	.tl_row p{font-size:15px;padding:10px; text-align: center; max-width:none}
	.tl_row p:before{display:none}
	
	.tl_background_change_wrap { padding: 80px 0}
	.tl_background_change_wrap ul { border-top: 1px solid #6a6865;border-left: 1px solid #6a6865}
	.tl_background_change_wrap ul > li { width: 50%}
	.tl_background_change_wrap ul > li:nth-child(2n+1) {clear: both;}
	.tl_background_change_wrap ul > li >.wrapper{height:300px;border-top:0;border-left:0;padding:20px 25px}
	.tl_background_change_wrap ul .arrow {display: none }
	.tl_background_change_wrap ul .ic { -ms-transform: scale(0.75);transform: scale(0.75);}
	.tl_background_change_wrap ul h2 { font-size: 21px;margin: 2px 0 15px}
	.tl_background_change_wrap ul p { font-size: 13.5px;line-height: 21px}
	
	
}

/* 테스크탑 (가로 해상도가 992px 보다 큰 화면에 적용) */
@media all and (min-width: 993px) and (max-width:1200px) {  
	.tl_background_change_wrap{padding:90px 0}
	.tl_background_change_wrap ul > li >.wrapper{height:430px;padding:30px}
	.tl_background_change_wrap ul h2{font-size:24px;margin:18px 0}
	.tl_background_change_wrap ul p{font-size:14px;line-height:23px}
	.tl_row h3{font-size:36px;line-height:48px}
	.tl_row p{font-size:16.5px}
	.tl_row .col-6:last-child{padding-left:80px;padding-top:26px}
	.tl_row p.bar:before{top:8px;left:-75px;width:50px;height:3px}
}
/*백그라운드 탭*/








 
/*티로그 사람들*/
.tl_profile_box_wrap {width:100%; min-height:600px; background-attachment:fixed; background-image:url(../img/profile_box_img.jpg); background-position:center center; background-size:cover;  padding:150px 0px; clear:both}
.tl_profile_box_wrap .inner { max-width:1400px; margin:0 auto;}
.tl_profile_box_wrap h2 { max-width:1200px; margin:0 auto; overflow:hidden; font-size:35px; color:#fff; text-align:center; font-weight:bold; letter-spacing: 3px;}
.tl_profile_box_wrap span {max-width:1200px; margin:0 auto; overflow:hidden;  display:block; padding:30px 10px 100px 10px; color:#f5f5f5; text-align:center; font-size:15px; line-height:1.75; letter-spacing:-0.02em; font-weight:300}
.tl_profile_box_wrap .profile_area{cursor: pointer; list-style:none}
.tl_profile_box_wrap .profile_area img{margin: 0 auto; max-width:180px}
.tl_profile_box_wrap .profile_area h2 { text-align:center; color:#f2f2f2; font-size:15px; padding:10px 0}
.tl_profile_box_wrap .profile_area span { display:block; text-align:center; color:#f2f2f2; padding:0}
.tl_profile_box_wrap .owl-nav{position:absolute;width:100%;bottom:50%}
.tl_profile_box_wrap .owl-nav .owl-prev{width:45px; height:45px; line-height:45px; left:-25px; background-color: transparent; margin:0; position:absolute; cursor:pointer; color:#fff; padding:0}
.tl_profile_box_wrap .owl-nav .owl-next{width:45px; height:45px; line-height:45px; right:-25px; background-color:transparent; margin:0; position:absolute; cursor:pointer; color:#fff; padding:0}
.tl_profile_box_wrap .owl-nav i{ font-size:36px}
.tl_profile_box_wrap .owl-dots{ display:none}


@media all and (max-width:640px) {
	.tl_profile_box_wrap h2 { font-size:24px}
	.tl_profile_box_wrap .owl-nav .owl-prev { left:0}
	.tl_profile_box_wrap .owl-nav .owl-next { right:0}
}
 /*티로그 사람들*/
 
 
 
 
 
/* 주요 계약실적*/
.tl_business_now_box_warp { max-width:1400px; padding:150px 0; margin:0 auto; clear:both}
.tl_business_now_box_warp h2 {font-size: 35px;   letter-spacing: 3px;    font-weight: bold; text-align:center}
.tl_business_now_box_warp p { margin:0 auto; overflow:hidden; padding:30px 10px 100px 10px;text-align:center;  font-size:15px; display:block; color:#555; font-weight:100}
.tl_business_now_box_warp .latest-carousel .owl-nav {position: absolute;top: 50%;margin-top: -25px; width:100%; display:block}
.tl_business_now_box_warp .latest-carousel .owl-nav .owl-prev {width:45px; height:45px; line-height:45px; left:-25px; background-color:#32373a; margin:0; position:absolute; cursor:pointer; color:#fff; padding:0}
.tl_business_now_box_warp .latest-carousel .owl-nav .owl-next {width:45px; height:45px; line-height:45px; right:-25px; background-color:#32373a; margin:0; position:absolute; cursor:pointer; color:#fff; padding:0}
.tl_business_now_box_warp .latest-carousel .owl-nav .owl-prev:hover { background-color:#4a78bc; color:#fff}
.tl_business_now_box_warp .latest-carousel .owl-nav .owl-next:hover { background-color:#4a78bc; color:#fff}
.tl_business_now_box_warp .latest-carousel .owl-nav .owl-prev .material-icons { font-size:35px; padding-top:5px}
.tl_business_now_box_warp .latest-carousel .owl-nav .owl-next .material-icons { font-size:35px; padding-top:5px}
.tl_business_now_box_warp .latest-carousel .owl-dots { display:none}


@media screen and (max-width:1300px) {
	.tl_business_now_box_warp .latest-carousel .owl-nav .owl-prev {left: 0px;}
	.tl_business_now_box_warp .latest-carousel .owl-nav .owl-next {right:0px;}
}


@media all and (max-width:960px) {
	 .tl_business_now_box_warp .latest-carousel .owl-nav { display:none}
}

@media all and (max-width:640px) {
	.tl_business_now_box_warp { padding:80px 0}
	.tl_business_now_box_warp h2 { font-size:24px}
}
	
/* 주요 계약실적*/
 
 
 
 

/*하단 상담신청*/
.tl_contact_box_wrap  { width:100%; min-height:600px; padding:100px 0; /*background-attachment:fixed; background:url(../img/main_contact_bg.jpg) center center no-repeat; background-size:cover*/}
.tl_contact_box_wrap .inner { max-width:1400px; margin:0 auto; padding:0px; overflow:hidden; display: flex; flex-flow: wrap } 

.tl_contact_box_wrap .contact_img { width:50%; height: auto; background-attachment:fixed; background:url(../img/main_contact_bg.jpg) center bottom no-repeat; background-size:cover} 
.tl_contact_box_wrap .contact_wrap { width:50%; padding:80px;} 
.tl_contact_box_wrap .contact_wrap:hover {background-color: #f5f5f5;} 

.tl_contact_box_wrap h2 {font-size: 35px;  letter-spacing: 3px; font-weight: bold;}
.tl_contact_box_wrap p {padding:10px 0px 30px 0; font-size:15px; display:block; font-weight:300}
.tl_contact_box_wrap .input_page #co_name { width:48%; height:60px; font-size:15px; color:#6e6e6e; padding-left:10px; float:left}
.tl_contact_box_wrap .input_page #co_email { width:48%; height:60px; font-size:15px; color:#6e6e6e; padding-left:10px; float:right}
.tl_contact_box_wrap .txtarea_page  #co_message { margin-top:20px; width:100%; height:120px;  font-size:15px; color:#6e6e6e; padding:10px 0 0 10px;}
.tl_contact_box_wrap .send_page { text-align:center; padding: 20px;}
.tl_contact_box_wrap .send_page .send {margin:50px 0 0;  max-width:142px; height:41px; line-height:41px; padding:0px 40px;background-color: #3949a3; font-size:15px; font-weight:bold; color:#fff; border:0; border-radius:20px}
.tl_contact_box_wrap #x_message{position:absolute;width:300px;border-radius:10px;height:50px;text-align:center;line-height:50px;top:50px;left:50%;margin-left:-150px;background-color:#FDD;border:2px solid #C00;font-weight:700;color:#666;z-index:1000}
.tl_contact_box_wrap #x_loading{position:absolute;display:none;width:200px;height:200px;top:50px;left:50%;margin-left:-100px;z-index:1;font-size:100px;line-height:200px}
.tl_contact_box_wrap #x_message.x-msg1 {background-color: #FDD;}
.tl_contact_box_wrap #x_message.x-msg2 {background-color: #9C6;border:2px solid #096}

@media screen and (max-width:1200px) {
	.tl_contact_box_wrap .inner { padding:0 20px 0;} 
	.tl_contact_box_wrap .contact_img { width:100%; height: 400px; } 
    .tl_contact_box_wrap .contact_wrap { width:100%; padding:30px;} 	
}
@media all and (max-width:640px) {
	.tl_contact_box_wrap .inner { padding:0 20px 0;} 
	.tl_contact_box_wrap .contact_img { width:100%; height: 400px; } 
    .tl_contact_box_wrap .contact_wrap { width:100%; padding:30px;} 
    .tl_contact_box_wrap h2 { font-size:24px}
}
/*하단 상담신청*/ 
 







/*서브상단 : 이미지 없이 제목 + 경로 / 2차 메뉴 탭 / 3차 메뉴 탭 (head.php .sub_top .sub_tab) / 모바일은 드롭다운 2칸 (.sub_drop)*/
.sub_top {padding:70px 20px 40px; text-align:center}
.sub_inner {position:relative; max-width:1200px; margin:0 auto}
.sub_tit {margin:0; font-size:34px; font-weight:700; color:#111}
.sub_path {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; margin:14px 0 0; font-size:14px; color:#888}
.sub_path a, .sub_path span {color:#888}
.sub_path a:hover {color:#111}
.sub_path > :last-child {font-weight:600; color:#111} /* 지금 페이지 */
.sub_path i {font-size:12px; color:#bbb}
.sub_tab {border-bottom:1px solid #e5e5e5}
.sub_tab2, .sub_tab3 {display:flex; justify-content:center; flex-wrap:wrap; margin:0; padding:0 20px; list-style:none}
.sub_tab2 {border-top:1px solid #e5e5e5}
.sub_tab2 a {display:block; padding:18px 24px; font-size:16px; color:#888; transition:color .2s}
.sub_tab2 a:hover {color:#111}
.sub_tab2 li.on a {background-color:#173f8a; font-weight:700; color:#fff} /* 현재 메뉴 : 짙은 남색 바탕 */
.sub_tab3 {display:none; gap:6px; padding-top:12px; padding-bottom:12px; border-top:1px solid #e5e5e5; background-color:#f7f8fa}
.sub_tab3.on {display:flex}
.sub_tab3 a {display:block; padding:6px 4px; margin:0 10px; border-bottom:2px solid transparent; font-size:14px; color:#777; transition:color .2s}
.sub_tab3 a:hover {color:#111}
.sub_tab3 li.on a {border-bottom-color:#173f8a; font-weight:700; color:#173f8a} /* 현재 3차 메뉴 : 남색 글씨 + 밑줄 */
.sub_drop {display:none} /* 모바일 전용 드롭다운 (PC 는 위 탭) */

@media screen and (max-width:768px) {
	.sub_top {padding:40px 16px 24px}
	.sub_tit {font-size:24px}
	.sub_path {gap:6px; margin-top:10px; font-size:12px}
	.sub_path i {font-size:10px}

	/* 모바일 : 탭 대신 드롭다운 2칸 (2차 | 3차) 한 줄 — 메뉴가 많아도 높이 그대로 */
	.sub_tab {display:none}
	.sub_drop {display:flex; gap:6px; padding:0 16px}
	.sub_drop_box {position:relative; flex:1; min-width:0}
	.sub_drop_btn {display:flex; align-items:center; justify-content:space-between; gap:6px; width:100%; padding:13px 14px; border:1px solid #ccc; border-radius:4px; background-color:#fff; font-size:14px; font-weight:600; color:#111; text-align:left; cursor:pointer}
	.sub_drop_btn span {overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
	.sub_drop_btn i {flex-shrink:0; font-size:18px; color:#555; transition:transform .2s}
	.sub_drop_box.open .sub_drop_btn {border-color:#111}
	.sub_drop_box.open .sub_drop_btn i {transform:rotate(180deg)}
	.sub_drop_box ul {display:none; position:absolute; top:100%; right:0; left:0; z-index:50; max-height:60vh; margin:4px 0 0; padding:6px 0; border:1px solid #ccc; border-radius:4px; background-color:#fff; list-style:none; overflow-y:auto; box-shadow:0 6px 16px rgba(0,0,0,.12)}
	.sub_drop_box.open ul {display:block}
	.sub_drop_box a {display:block; padding:11px 14px; font-size:14px; color:#333; word-break:keep-all}
	.sub_drop_box li.on a {background-color:#f5f7fa; font-weight:700; color:#173f8a} /* 지금 메뉴 */
}
/*서브상단*/




.share-area {float: right; display:block; padding-top:16px;box-sizing: border-box;}
.share-area .hide-wrap{width:151px;height:34px;overflow:hidden;float:left}
.share-area .hide-wrap .hide-area{width:151px;height:34px;position:relative;left:200px}
.share-area .hide-wrap .hide-area ul {overflow: hidden; padding:0; margin:0}
.share-area .hide-wrap .hide-area ul li {float: left;margin-left: 13px; cursor:pointer}
.share-area .hide-wrap .hide-area ul li:first-child {margin-left: 0;}
.share-area .share-btn{width:34px;height:34px;background-image:url(../img/share_open_bt.png);float:right;text-indent:-9999px;padding-left:18px;box-sizing:unset;background-repeat:no-repeat;background-position-x:right;transition:all .5s ease;     background-color: inherit; border:0; margin-right:20px}
.share-area .share-btn.active {background-image: url(../img/share_close_bt.png);border-left: 1px solid #fff;}

@media screen and (max-width: 640px) {
    .share-area{ display:none}
}



/*서브 제목*/
.content_wrap { width:100%;}
.content_wrap .txtCon { max-width:1400px; margin:0 auto; padding:20px 20px 50px 20px; clear:both}
.content_wrap .txtCon .sub_title{margin:80px 0; padding:0; text-align:center;}
.content_wrap .txtCon .sub_title h2 {font-size:42px; color:#000;}
.content_wrap .txtCon .sub_title p {font-size: 16px; color:#555; font-weight:300; word-break:keep-all;}
.content_wrap .txtCon .content_area { width:100%;}
.content_wrap .txtboard { max-width:1400px; margin:0 auto; padding:20px 20px 50px 20px; font-size:12px; line-height:1.75; letter-spacing:-0.02em; clear:both}
/* .content_wrap .txtboard span { font-size:1px} */

@media screen and (max-width:640px) {
	.content_wrap .txtCon .sub_title{margin:50px 0 50px}
	.content_wrap .txtCon .sub_title h2 { font-size:32px}
}
/*서브 제목*/






/*푸터 : 로고 + 오른쪽 링크 / 회사정보 2줄(기본환경설정 여분필드 1~6) / 구분선 + 저작권, 오른쪽 큰 로고 footer_bg.png (tail.php)*/
#footer {clear:both; overflow:hidden; background-color:#eef3f9}
.ft_inner {position:relative; max-width:1200px; margin:0 auto; padding:50px 20px 36px; box-sizing:content-box; background:url(../img/footer_bg.png) right 90px top 0 no-repeat}
.ft_top {display:flex; align-items:center; justify-content:space-between}
.ft_logo img {display:block; width:auto; height:28px}
.ft_link {display:flex; gap:30px}
.ft_link a {font-size:13px; color:#555}
.ft_link a:hover {color:#111}
.ft_link .ft_privacy {font-weight:700; color:#111}
.ft_link .ft_adm {padding:6px 12px; border-radius:4px; background-color:#222; font-weight:600; color:#fff} /* 관리자만 : 합격자 명단 추가 */
.ft_link .ft_adm:hover {background-color:#000; color:#fff}
.ft_info {margin-top:28px}
.ft_info p {margin:0; font-size:13px; color:#555}
.ft_info p + p {margin-top:8px}
.ft_info span + span:before {content:"|"; margin:0 14px; color:#999}
.ft_copy {margin:36px 0 0; padding-top:16px; border-top:1px solid #d8dde3; font-size:13px; color:#999}

@media screen and (max-width:768px) {
	.ft_inner {padding:40px 16px 30px; background-position:right 16px top 0; background-size:160px auto}
	.ft_top {flex-direction:column; align-items:flex-start; gap:18px}
	.ft_logo img {height:24px}
	.ft_link {flex-wrap:wrap; align-items:center; gap:10px 16px} /* 관리자 버튼까지 4개 : 좁으면 다음 줄로 */
	.ft_link a {font-size:12px}
	.ft_info {margin-top:20px}
	.ft_info p {font-size:12px}
	.ft_info span {display:block} /* 모바일 : 항목마다 한 줄 */
	.ft_info span + span {margin-top:4px}
	.ft_info span + span:before {display:none}
	.ft_info p + p {margin-top:4px}
	.ft_copy {margin-top:24px; padding-top:14px; font-size:11px}
}
/*푸터*/


/*퀵메뉴 : PC 오른쪽 아래 고정 동그란 버튼 (tail.php #quick) / 시안 : 본문(1200) 오른쪽 바깥, 1920 화면에서 오른쪽 끝 180px / 마우스 올리면 왼쪽에 이름 말풍선 / 모바일은 맨 아래 가로 한 줄*/
#quick {position:fixed; right:max(20px, calc(50% - 780px)); bottom:40px; z-index:90; display:flex; flex-direction:column; gap:8px} /* 화면 아래쪽에 붙음 */
#quick a, #quick button {position:relative; display:flex; align-items:center; justify-content:center; width:56px; height:56px; padding:0; border:0; border-radius:50%; font-size:26px; color:#fff; cursor:pointer; transition:background-color .2s}
#quick .qk_bus {background-color:#3f6db3}
#quick .qk_meal {background-color:#f09243}
#quick .qk_fee {background-color:#2ca688}
#quick .qk_top {border:1px solid #ccc; background-color:#fff; font-size:22px; color:#111}
/* 마우스 올리면 배경만 살짝 진하게 (filter 를 쓰면 안의 말풍선까지 어두워져서 배경색으로만) */
#quick .qk_bus:hover {background-color:#365f9e}
#quick .qk_meal:hover {background-color:#e5823a}
#quick .qk_fee:hover {background-color:#25957a}
#quick .qk_top:hover {background-color:#f3f3f3}
#quick .qk_top span {display:none} /* 맨 위로 : PC 는 말풍선 없음 (모바일 하단 바에서는 이름 보임) */
#quick span {position:absolute; top:50%; right:100%; margin-right:12px; padding:8px 12px; border:1px solid #ddd; border-radius:6px; background-color:#fff; box-shadow:none; font-size:13px; font-weight:500; color:#111; white-space:nowrap; opacity:0; visibility:hidden; transform:translate(6px, -50%); transition:opacity .2s, transform .2s, visibility .2s; pointer-events:none} /* 말풍선 */
#quick span:before, #quick span:after {content:""; position:absolute; top:50%; left:100%; margin-top:-6px; border:6px solid transparent; border-left-color:#ddd} /* 말풍선 꼬리 : 회색 테두리(before) 위에 흰색(after)을 1px 안쪽으로 겹침 */
#quick span:after {margin-left:-1px; border-left-color:#fff}
#quick a:hover span, #quick button:hover span, #quick a:focus-visible span, #quick button:focus-visible span {opacity:1; visibility:visible; transform:translate(0, -50%)}

@media screen and (max-width:768px) {
	/* 모바일 : 화면 맨 아래 가로 한 줄 네모 4칸 (아이콘 + 이름), 내용을 가리지 않게 본문 아래 여백 */
	#footer .ft_inner {padding-bottom:calc(58px + 16px + env(safe-area-inset-bottom))} /* 하단 퀵바(58px)에 카피라이트가 가리지 않게 : 푸터 안쪽 아래 여백 = 퀵바 58 + 16 (푸터 배경색이 퀵바 밑까지 이어짐) */
	#quick {right:0; bottom:0; left:0; flex-direction:row; gap:0; padding-bottom:env(safe-area-inset-bottom); background-color:#fff; box-shadow:0 -1px 0 #e5e8ec}
	#quick a, #quick button {flex:1; flex-direction:column; gap:3px; width:auto; height:58px; border-radius:0; font-size:20px}
	#quick .qk_top {border:0; border-left:1px solid #e5e8ec; font-size:18px}
	#quick span, #quick a:hover span, #quick button:hover span, #quick a:focus-visible span, #quick button:focus-visible span {position:static; margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; font-size:12px; font-weight:500; color:inherit; opacity:1; visibility:visible; transform:none} /* 말풍선 대신 아이콘 아래 이름 */
	#quick span:before, #quick span:after {display:none}
	#quick .qk_top span {display:inline}
}
/*퀵메뉴*/







@media screen and (max-width: 960px) {
    
	/*버튼*/
    #open-button{position:fixed;z-index:10000;right:15px;padding-top:18px;width:75px; height:80px;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out;cursor:pointer;display:block; }
	#open-button .navicon-line{position:absolute;width:20px;height:2px;border-radius:1px;background:#fff;-webkit-transition:all .7s ease-out;-moz-transition:all .7s ease-out;-o-transition:all .7s ease-out;transition:all .7s ease-out}
	#open-button .nl1 {top: 11px;right: 10px; width:30px;}
	#open-button .nl2 {top: 19px;right: 10px; width:24px;}
	#open-button .nl3 {top: 27px;right: 10px; width:30px;}
	#open-button.on>div>div{transform:rotate(225deg);-ms-transform:rotate(225deg);-webkit-transform:rotate(225deg);width:25px;position:absolute;top:15px;right:10px;margin:0;padding:0;background-color:#fff;}
	#open-button.on>div>div:first-child{transform:rotate(135deg);-ms-transform:rotate(135deg);-webkit-transform:rotate(135deg)}
	#open-button.scrolled .navicon-line {background-color: #333;}
	#open-button.on.scrolled >div>div{background-color:#fff;}
    /*버튼*/
	
}


/*기타*/
.tl_btns { display: inline-block; font-weight: 400;  text-align: center; white-space: nowrap; vertical-align: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;
    user-select: none;  font-size: 0.75rem;  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    margin-bottom:10px; }

.d_gray-btn { position: relative; z-index: 1; min-width: 140px; height: 50px; border: 1px solid #2f2f2f; text-transform: uppercase; color: #2f2f2f;letter-spacing: 1px;border-radius: 0; line-height: 50px; padding: 0;background-color: #ffffff;}
.d_gray-btn:hover, .d_gray-btn:focus { background-color: #2f2f2f; color: #ffffff;}

/*기타*/



