@charset "utf-8";
/* CSS Document */

/*기관소개 부분*/
#conts {
	width: 100%; 
    max-width: 100%; /* 전체 최대 너비 */
    margin: 0 auto; 
    aspect-ratio: 16 / 7; 
    box-sizing: border-box;
}
.con {
	padding-top: 100px;
	display: flex;
	
}
.dit img{
    width: 20px;
    height: 180px;
   }
.dit {
	padding-left: 30px;
	width: 20px;
	
}

.dit2 {
	margin: 0 auto;
	display: flex;
	padding-bottom: 90px;
	
}
.dit2 .ed {
	color: #9a1017;
	font-size: 10pt;
	
}
.dit2 h1 {
	font-size: 27pt;
	padding-top: 6px;
}
.diot p {
	padding-top:40px;
	font-size: 12pt;

}

.diot {
	width: 780px;
}
.ed {
	padding-top: 2px;
}
.bt {
	border: 1px solid #000;
	width: 130px;
	height: 52px;
	text-align: center;
	line-height: 50px; /* height와 동일한 값을 입력 */
	font-size: 12pt;
	margin-top: 45px;
	font-weight: 600;
	text-decoration: none;
}

.bt1 {
	border: 1px solid #000;
	width: 130px;
	height: 52px;
	text-align: center;
	line-height: 50px; /* height와 동일한 값을 입력 */
	font-size: 12pt;
	margin-top: 100px;
	font-weight: 600;
	text-decoration: none;
}

.bt:hover {
	background-color: #D94C00;
}

.bt:hover a {
	color: #fff;
}

.bt1:hover {
	background-color: #D94C00;
}

.bt1:hover a {
	color: #fff;
}

.ditz img {
    width: 512px;
    margin-left: 120px;
}

.busi {
	width: 100%;
	display: flex;
	background-color: #f0f1f3;
	padding-top: 87px;
}
.ditqa {
    margin: 0 auto;
	width: 1421px;
	margin-bottom: 100px;
}

.ed {
     font-size: 12pt;
    color: #9a1017;
    padding-bottom: 5px;
	text-align: center;

}

.d {
   font-size: 27pt;
   text-align: center;
}

.imgco {
     width: 1260px;
     display: flex;
	padding-top: 60px;

}
.my-content-box1 {
     background-image: url('https://jh1330.or.kr/jh1330/theme/basic/img/main-business1.jpg');
	background-size: 100% 100%;
    background-repeat: no-repeat;
	width: 663px;
	height: 261px;
	margin-bottom: 10px;
}

.my-content-box2 {
     background-image: url('https://jh1330.or.kr/jh1330/theme/basic/img/main-business2.jpg');
	background-size: 100% 100%;
    background-repeat: no-repeat;
	width: 663px;
	height: 261px;
    margin-top: 15px;

}

.my-content-box3 {
     background-image: url('https://jh1330.or.kr/jh1330/theme/basic/img/main-business3.jpg');
	background-size: 100% 100%;
    background-repeat: no-repeat;
	width: 315px;
	height: 536px;
	margin: 0;
    margin-left: 15px;
	margin-right: 15px;
}

.my-content-box4 {
     background-image: url('https://jh1330.or.kr/jh1330/theme/basic/img/main-business4.jpg');
	background-size: 100% 100%;
    background-repeat: no-repeat;
	width: 380px;
	height: 261px;
	margin-bottom: 15px;
}

.my-content-box5 {
     background-image: url('https://jh1330.or.kr/jh1330/theme/basic/img/main-business5.jpg');
	background-size: 100% 100%;
    background-repeat: no-repeat;
	width: 380px;
	height: 261px;
	
  }

.full-link-box1 h3, .full-link-box2 h3 {
	padding-top: 45px;
	font-size: 18pt;
	color: white;
	padding-left: 63px;
	
}

.full-link-box1 p, .full-link-box2 p {
	font-size: 11pt;
	color: white;
	padding-left: 63px;
	padding-top: 18px;
}

.full-link-box4 h3, .full-link-box5 h3, .full-link-box3 h3 {
	padding-top: 45px;
	font-size: 18pt;
	color: white;
	text-align: center;
	
}

.full-link-box4 p, .full-link-box5 p, .full-link-box3 p {
	font-size: 11pt;
	color: white;
	padding-left: 63px;
	padding-top: 18px;
}

.full-link-box3 h3 {
	padding-top: 45px;
	font-size: 18pt;
	color: white;

}

.full-link-box3 p {
	font-size: 11pt;
	color: white;
	padding-top: 18px;
	margin: 0 auto;
}
/*공지사항 부분*/
.notes {
	margin-top: 100px;
	margin-bottom: 100px;
	display: flex;
}

.eh {
	width: 331px;
	margin-right: 53px;
}

.eh1 {
   width: 1006px;
}

.eh h1 {
	font-size: 27px;
}

.hj {
	width: 1389px;
}
.rrrt {
	display: flex;
	margin: 0 auto;
}
.ed1 {
     font-size: 12pt;
    color: #9a1017;
    padding-bottom: 5px;
}

.bt1 {
	border: 1px solid #000;
	width: 130px;
	height: 52px;
	text-align: center;
	line-height: 50px; /* height와 동일한 값을 입력 */
	font-size: 12pt;
	margin-top: 100px;
	font-weight: 600;
	text-decoration: none;
}

.bt1:hover {
	background-color: #D94C00;
}

.bt1:hover a {
	color: #fff;
}

/*포토 이미지나오는 부분*/

#imgn {
	padding-top: 100px;
	padding-bottom: 100px;
	display: flex;
	background-color: #F0EFD9;
}

.wwo {
	width: 1370px;
	margin: 0 auto;
}
.eh4 {
   text-align: center;
}

.eh4 h1 {
	font-size: 27px;
}
.ed4 {
	font-size: 12pt;
    color: #9a1017;
}

.sdv {
	padding-top: 40px;
	padding-bottom: 40px;
}

.bt4 {
	border: 1px solid #000;
	width: 130px;
	height: 52px;
	text-align: center;
	line-height: 50px; /* height와 동일한 값을 입력 */
	font-size: 12pt;
	margin-top: 100px;
	font-weight: 600;
	text-decoration: none;
	margin: 0 auto;
}

.bt4:hover {
	background-color: #D94C00;
}

.bt4:hover a {
	color: #fff;
}

/*상담신청하는 부분*/

#last1 {
	display: flex;
	padding-top: 100px;
	
}

.dov1 {
	margin: 0 auto;
	width: 1370px;
}

.scdv {
	background-color: aquamarine;
}

.eh4 {
	width: 1344px;
	margin: 0 auto;
	
}

/* 전체 외곽 감싸는 영역 */
.consult-wrapper {
    width: 100%;
    max-width: 1370px; /* 요청하신 가로 크기 */
    margin: 0 auto;    /* 중앙 정렬 */
    padding: 50px 0;   /* 위아래 여백 */
}

/* 실제 아이템들이 배치되는 컨테이너 */
.consult-container {
    display: flex;
    gap: 25px;         /* 아이템 사이 간격 */
    justify-content: space-between;
}

/* 개별 아이템 박스 */
.consult-item {
    flex: 1;           /* 3개가 동일한 너비를 가짐 */
    display: block;
    text-decoration: none;
    position: relative;
    height: 380px;     /* 가로가 넓어진 만큼 높이도 조절 (수정 가능) */
    overflow: hidden;
    border-radius: 12px;
    color: #fff;
}

/* 이미지 설정 */
.image-box {
    width: 100%;
    height: 100%;
    position: relative;
    background-color: #000; /* 이미지 로딩 전 배경색 */
}

.image-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease-in-out;
   
}

/* 오버레이 (텍스트 박스) */
.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4); /* 기본 어두움 */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 40px;
    box-sizing: border-box;
    text-align: center;
    transition: background 0.4s ease;
}

/* 제목: 서서히 나타남 */
.overlay .title {
    font-size: 1.8rem; /* 크게 조절 */
    font-weight: 800;
    margin: 0 0 20px 0;
    opacity: 0;
    transition: opacity 0.5s ease;
}

/* 내용: 밑에서 위로 슬라이드 */
.overlay .content {
    font-size: 1.1rem;
    line-height: 1.6;
    word-break: keep-all; /* 한글 단어 끊김 방지 */
    opacity: 0;
    transform: translateY(50px); /* 더 아래에서 시작 */
    transition: transform 0.6s cubic-bezier(0.2, 1, 0.3, 1), opacity 0.6s ease;
}

/* 마우스 호버 효과 */
.consult-item:hover .image-box img {
    transform: scale(1.1);
    opacity: 1;
}

.consult-item:hover .overlay {
    background: rgba(0, 0, 0, 0.6);
}

.consult-item:hover .title {
    opacity: 1;
}

.consult-item:hover .content {
    opacity: 1;
    transform: translateY(0);
}

/* 반응형: 화면이 1370px보다 작아질 때 */
@media (max-width: 1024px) {
    .consult-container {
        flex-direction: column; /* 세로로 나열 */
        align-items: center;
    }
    .consult-item {
        width: 90%; /* 모바일/태블릿에선 가로 90% */
        height: 300px;
    }
}

/*타 사이트 링크 부분*/

#tit {
	background-color: #E8E8E8;
	margin-top: 40px;
	margin-bottom: 30px;
	height: 134px;
	width: 100%;
}

.maim {
	margin: 0 auto;
	width: 1400px;
}