/* Custom styles here */

body {
    background-color: #f5f5f5;
    font-family: 'Poppins', sans-serif;
}

.logo {
    max-height: 40px;
    margin-right: 10px;
  }

  .larger-text {
    font-size: xx-large;
    font-weight: bold;
    color: #33cccc;
}  

.navbar-brand.larger-text {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); /* 텍스트에 섀도우 효과 추가 */
}

.navbar-nav .nav-link:hover {
    color: #33cccc; /* 호버 시 글자 색상 변경 */
}

h5 {
    color: #1B75BB;
}
  
a {
    text-decoration: none;
    color: #ffffff;
}
  
.navbar {
    background-color: #1B75BB;
}
  
.navbar-brand, .navbar-nav .nav-link {
    color: #ffffff;
}
 
.section {
    padding: 80px 0;
}
  
.section-heading {
    color: #1B75BB;
    
}
  
.section-content {
    color: #555555;
}

.img-fit {
    width: 100%; /* 이미지가 부모 요소의 100%의 너비를 차지하도록 설정 */
    height: 100%; /* 이미지가 부모 요소의 100%의 높이를 차지하도록 설정 */
    object-fit: cover; /* 이미지를 부모 요소에 맞게 조정하고, 가로세로 비율을 유지한 채로 잘라냄 */
}

.carousel-caption {
    left: 10%; /* 왼쪽으로 이동 */
    padding-right: 10%; /* 버튼 오른쪽 여백 추가 */
}

.carousel-caption .btn-primary {
    width: calc(28% - 10%); /* 버튼 전체 너비 조정 */
}

.carousel-caption .btn-primary:hover {
    color: #fff; /* 버튼 텍스트 색상 변경 */
    background-color: #33cccc; /* 배경색 변경 */
    border-color: #33cccc; /* 테두리 색상 변경 */
}

.text-with-shadow {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.9); /* 그림자 효과 설정 */
    margin-bottom: 30px; /* 여백을 조정합니다. */
}


.btn-primary {
    background-color: #00A8DE;
    border-color: #00A8DE;
}

  .btn-primary:hover {
    background-color: #33cccc;
    border-color: #33cccc;
}

.icon-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 80px;
}

.icon-container i {
    font-size: 36px;
    color: #00A8DE; /* Adjust the color as needed */
    margin-bottom: 10px;
}

/* Service Section - Rounded Image Borders */
#services img {
    border-radius: 10px; /* Adjust the radius value as needed */
}

footer a:hover {
	color: #33cccc;
}

/* Scroll btn */

.scroll-to-top-btn {
    position: fixed;
    bottom: 20px; 
    right: 20px; 
    background-color: #00A8DE;
    color: #fff;	
    border: none;
    border-radius: 50%;
    padding: 10px; 
    font-size: 14px; 
    font-weight: bold; 
    cursor: pointer;
    transition: opacity 0.3s ease;
    opacity: 0;
    z-index: 9999; /* Float on other elements */
    text-align: center; 
    line-height: 20px; 
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2); 
  }
  
  /* Scroll in the middle */
  .show-scroll-btn {
    opacity: 1; 
  }
  
  .scroll-to-top-btn:hover {
    background-color: #33cccc; 
  }
  
  .scroll-to-top-btn:focus {
    outline: none; 
  }

/* 모바일 화면에서 이미지 높이 조정 */
@media only screen and (max-width: 768px) {
    .carousel-item img {
        height: 50vh;
    }
}