@charset "utf-8";

/* 기본정렬 */
.contents_wrap .substory_wrap .storyView .content > p {margin-bottom:10px;}
.contents_wrap .substory_wrap .storyView .content img {margin-bottom:20px;}
#subPage {position:absolute; left:100%; top:0px; width:100%; height:100%; display:none; z-index:900;}
#main_header {}
#main_location {width:100%; min-height:500px; margin:0 auto; text-align: center;}
#footer {width:100%; min-height:70px; margin:30px auto 0; text-align:center;}

table th {font-weight:normal;}

/* 전체보기 +버튼 */
.plus_btn {display:inline-block; float:right; margin-top:-43px;}
.plus_btn a {display:block; width:35px; height:35px; background:url(/resources/images/common/plus.png) no-repeat; transition:all .3s ease; cursor:pointer;}
.plus_btn a:hover {transform:rotate(180deg);}

/* 버튼공통 */
.btn {overflow:hidden; width:100%; height:50px; border-radius:5px; background:#222; color:#fff; font-family:'CoreGothic4'; font-size:16px; text-align:center; line-height:3.1; cursor:pointer;}
.btn_common_point {background:var(--common-point);}
.btn a {display:inline-block; width:100%; height:100%;}

/* 탭 */
.tab {overflow:hidden; width:var(--page-width); margin:0 auto; padding-bottom:40px; text-align:center;}
.tab button, .tab a {transition:all 0.2s ease-out; box-sizing:border-box; display:inline-block; height:36px; padding:0 22px; border-radius:20px 0 20px 0; border:1px solid #999; outline:none; background:transparent; font-family:'CoreGothic4'; line-height:2.2; white-space:nowrap; cursor:pointer;}
.tab button:hover, .tab a:hover {border-color:var(--common-point); background:var(--common-point); color:#fff;}
.tab button:not(:last-child), .tab a:not(:last-child) {margin-right:6px;}
.tab .active {border-color:var(--common-point); background:var(--common-point); color:#fff; font-family:'CoreGothic5';}

.main_section .tabcontent {display:none;}

/* 슬라이드 좌우 화살표 */
.slide_img_wrap .slick-arrow {opacity:0;}
.slide_img_wrap:hover .slick-arrow {opacity:1; transition:.4s;}

/* 체크마크 커스텀 20px #333 */
	/* input이 label 내 첫번째에 위치 */
.label_check {display:inline-block; position:relative; height:20px; padding-left:25px; font-size:15px; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;}
.label_check input {position:absolute; opacity:0; cursor:pointer; height:0; width:0;}
.checkmark {position:absolute; left:0; height:20px; width:20px; background-color:#fff; border:1px solid #333;}
.checkmark::after {content:""; position:absolute; display:none;}
.label_check input:checked ~ .checkmark {background-color:#333;}
.label_check input:checked ~ .checkmark::after {display:block;}
.label_check .checkmark::after {left:6px; top:1px; width:6px; height:12px; border:solid white; border-width: 0 1px 1px 0; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg);}
.label_check + .label_check_p {display:inline-block; font-family:'CoreGothic4'; font-size:15px; vertical-align:top;}
.label_check + .label_check_p span {font-family:'CoreGothic5'; text-decoration:underline; cursor:pointer;}

/* 체크마크 커스텀 16px, point color */
	/* input이 label 내 첫번째에 위치 */
/* .checkmark_point {position:absolute; top:3px; left:0; height:16px; width:16px; background-color:#fff; border:1px solid var(--border-gray); border-radius:3px;} */
/* .checkmark_point::after {content:""; position:absolute; display:none;} */
/* .label_check input:checked ~ .checkmark_point {border-color:var(--common-point); background-color:var(--common-point);} */
/* .label_check input:checked ~ .checkmark_point::after {display:block;} */
/* .label_check .checkmark_point::after {left:5px; top:0; width:5px; height:10px; border:solid white; border-width: 0 1px 1px 0; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg);} */
	/* input이 label 전에 위치 */
.checkmark_point {position:absolute; top:3px; left:0; height:16px; width:16px; background-color:#fff; border:1px solid var(--border-gray); border-radius:3px;}
.checkmark_point::after {content:""; position:absolute; display:none;}
input:checked + .label_check .checkmark_point {border-color:var(--common-point); background-color:var(--common-point);}
input:checked + .label_check .checkmark_point::after {display:block;}
.label_check .checkmark_point::after {left:5px; top:0; width:5px; height:10px; border:solid white; border-width: 0 1px 1px 0; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg); transform:rotate(45deg);}

/* 라디오 커스텀 */
.label_radio {margin-right:6px; cursor:pointer;}
.label_radio input {position:absolute; opacity:0; margin-top:5px; cursor:pointer;}
.label_radio .radio {display:inline-block; width:13px; height:13px; border-radius:50%; border:1px solid #999; margin-bottom:3px;}
.label_radio input:checked ~ .radio {border-color:var(--common-point);}
.label_radio input:checked ~ .radio::after {content:""; display:block; width:7px; height:7px; border-radius:50%; margin:2px 0 0 2px; background:#ffcc00;}


/* 메인 */
.strip_banner {width:100%; height:128px; margin:0 auto; background-position:center; cursor:pointer;}
.bx-wrapper{position:absolute;top:19px;}

	/* .sec_wrap = 메인 그리드 타이틀 */
.main_section {width:100%; padding-bottom:75px;}
.main_section .sec_wrap {width:var(--page-width); padding:75px 0 40px; margin:0 auto;}
.main_section .sec_wrap .sec_content div img {cursor:pointer;}
.main_section .sec_wrap .sec_content {width:100%; margin:0 auto; overflow:hidden; position:relative;}
.main_section .sec_wrap .sec_content .title {width:100%;}
.main_section .sec_wrap .sec_content .first_section {margin-top:76px;}
.main_section .sec_wrap .sec_content .title_main {color:var(--common-point-font); /* font-weight:800; font-family:'Pretendard'; font-size:50px; */font-family:'CoreGothic7'; font-size:40px; line-height:1; text-align:center; text-transform:uppercase;}
.main_section .sec_wrap .sec_content .onlinepay {font-size:50px; font-weight:500; font-family:"Noto Sans KR",sans-serif, NanumGothic, Arial, Helvetica, "굴림체"; }

	/* .main_slider = 메인 그리드 게시물 썸네일, 제목 등 */
.main_section .main_slider {/* overflow:hidden; */ width:var(--page-width); margin:0 auto; /* margin-top:40px; */}
.main_section .slick-list {margin-left:-20px;}
.main_section .slick-slide {max-width:275px; margin-left:20px;}
.main_section .img_box {display:inline-block; position:relative; width:100%; max-width:275px; height:322px; cursor:pointer;}
.main_section .img_box .thumb {overflow:hidden; height:243px; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -moz-box-justify-content:center; -ms-flex-pack:center; justify-content:center; -webkit-box-align:center; -moz-align-items:center; -ms-flex-align:center; align-items:center;}
.main_section .img_box .thumb:hover img {transform:scale(1.1);}
.main_section .img_box .thumb img {transition:all .3s ease; width:auto; height:100%;}
.main_section .img_box .thumb_title {padding-top:15px;}
.main_section .img_box .thumb_title p.part {height:25px; padding-bottom:5px; color:#999;}
.main_section .img_box .thumb_title p.title {font-size:16px;}

.main_section .slick-prev {position:absolute; top:115px; left:-40px; z-index:1; width:83px; height:83px; background:url(/resources/images/common/slide_prev.png) no-repeat;}
.main_section .slick-next {position:absolute; top:115px; right:-40px; z-index:1; width:83px; height:83px; background:url(/resources/images/common/slide_next.png) no-repeat;}

.main_section .slick-dots {bottom:-40px;}
.main_section .slick-dots li.slick-active {background:var(--common-point);}
.main_section .slick-dots li.slick-active button {background:var(--common-point);}

	/* 메인 - 포트폴리오 */
.main_section.sec_button_portfolio {background:#f5f5f5;}


/*****패밀리사이트 띠배너 **********/"WebContent/resources/css/khcss.css"

.main_wrap{height:306px;}

.main_direction_section {overflow: hidden; /* z-index: 1; */ width: 100%; height: 306px; color: #fff; text-align: left; text-align: center; position:relative;}
.main_direction_section .section_title {padding: 50px 0 38px; color: #fff; font-size: 40px; }
/*.direction_bg {position: absolute; top: 0; left: 0; z-index: -1; width: 100%; height: 100%; background: url(/resources/images/main/main_direction_bg.jpg) no-repeat center/cover;}*/
.main_direction .direction_item p {line-height: 1.5; font-size: 21px; margin: -15px 15px; letter-spacing: 0em; font-family: 'CoreGothic3';}

.main_direction_section .swiper-direction_swiper_pagination {z-index: 0;}
.direction_swiper_pagination{width: 100%; height:104px; position:absolute; bottom:10px; left:-14px;}
.main_direction_section .swiper-pagination-bullet:nth-child(2) {border-radius: 0 !important; width: 170px; height: 95px; margin-right: 21px !important; background: url(/resources/images/main/main_family/banner_video.svg) no-repeat center/contain; opacity: 0.5; transition: opacity 0.3s;}
.main_direction_section .swiper-pagination-bullet:nth-child(3) {border-radius: 0 !important; width: 120px; height: 96px; margin:0 15px 0 15px !important; background: url(/resources/images/main/main_family/banner_atents.svg) no-repeat center/contain; opacity: 0.5; transition: opacity 0.3s;}
.main_direction_section .swiper-pagination-bullet:last-child {border-radius: 0 !important; width: 150px; height: 100px; margin-left: 11px !important; background: url(/resources/images/main/main_family/logo_white.svg) no-repeat center/contain; opacity: 0.5; transition: opacity 0.3s;}
.main_direction_section .swiper-pagination-bullet:first-child {width: 0; height: 0; margin:0;}

.main_direction_section .swiper-pagination-bullet-active:first-child ~ .swiper-pagination-bullet {opacity: 1; transition:0.3s linear;}
.main_direction_section .swiper-pagination-bullet-active:nth-child(2){opacity:1;}
.main_direction_section .swiper-pagination-bullet-active:nth-child(3){opacity:1;}
.main_direction_section .swiper-pagination-bullet-active:last-child{opacity:1;}

/**취업현황**/
.sec_content .employ_logo{margin-top:33px; display:grid; grid-template-rows:repeat(5, 1fr); grid-template-columns:repeat(5, 1fr); gap:15px;}
.sec_content .employ_logo li{border:1px solid #e8ebf0; display:flex; justify-content:center; align-items:center; height:96px; overflow:hidden;}
.sec_content .employ_logo li img{width:100%; height:auto;}
.sec_content .employ_congrats{width:100%; margin-top:64px; display:flex; justify-content:space-between; gap:100px;}
.sec_content .employ_congrats .congrats{width:50%;}
.sec_content .employ_congrats .congrats div{font-size:16px; border-bottom:1px solid #e8ebf0; padding: 28px 0; display:flex; justify-content:space-between;}
.sec_content .employ_congrats .congrats div:last-child{border-bottom:0;}
.sec_content .employ_congrats .congrats div .congrats-title{font-family:'CoreGothic4';  color:#222;}
.sec_content .employ_congrats .congrats div p{font-family:'CoreGothic4';  color:#999;}



/* 메인 컨텐츠 모션 */
.scrollsections {}

/* 영상소개, 국비지원, 취업센터 모션 */
.main_ani {}
.main_ani div[class*="main_ani"] {animation-name:main_ani;}
.main_ani1 {
	animation-duration:0.9s;
    animation-delay:0s;
    -webkit-animation-duration:0.9s;
    -moz-animation-duration:0.9s;
    -o-animation-duration:0.9s;
    -ms-animation-duration:0.9s; 
}
.main_ani2 {
	animation-duration:1.3s;
    animation-delay:0s;
    -webkit-animation-duration:1.3s;
    -moz-animation-duration:1.3s;
    -o-animation-duration:1.3s;
    -ms-animation-duration:1.3s;
}
.main_ani3 {
	animation-duration:1.5s;
    animation-delay:0s;
    -webkit-animation-duration:1.5s;
    -moz-animation-duration:1.5s;
    -o-animation-duration:1.5s;
    -ms-animation-duration:1.5s;
}

@keyframes main_ani { 
    0% {opacity:0; transform:translateY(50px);}
    50% {opacity:0.5;}
    100% {opacity:1; transform:translateY(0);}
}