.page_content {
position:relative;
}	
.historysection {
	background:#fffef2;
	border:0px solid #f5f3dc;
}

.selpo_bg {
	background:#265a44;
	color:#fff;
	border:0px solid #f5f3dc;
}

.history_logo svg{
fill:#fff;
width:100px;
height:100px;
}

	.page_content .history_box2{
	padding:50px 50px;
}

	.page_content .history_box3{
	padding:50px 50px 0;
}

.pc_padding {
padding:50px 0;
}
@media (max-width: 768px) {
.pc_padding {
padding:0;
}
	.page_content .history_box{
	font-size:1em;
	line-height:1.5em;
	padding:50px 30px;
	}
	.page_content .history_box2{
	font-size:1em;
	line-height:1.5em;
	padding:50px 30px;
	}

	.page_content .history_box3{
	font-size:1em;
	line-height:1.5em;
	padding:20px 10px;
	}

	.txtlogo {
	font-size:1.4em;
	}
}
.sub_menubox {
  display: flex; /* Flexbox 사용 */
  overflow-x: auto; /* 가로 스크롤 활성화 */
  gap: 10px; /* 메뉴 간 간격 */
  width: 100%; /* 부모 요소의 너비를 전체로 설정 */
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch; /* 모바일에서 부드러운 스크롤 */
}

.menubox {
  flex: 0 0 auto; /* 각 항목이 고정 크기로 줄내림되지 않도록 설정 */
  width: auto; /* 각 항목의 최소 너비 설정 */
}

.submenu_on, .submenu_off {

  font-size: 0.9em;
  padding: 5px 20px;
  border: solid 1px #9dbbae;
  text-align: center; /* 텍스트 중앙 정렬 */
  box-sizing: border-box; /* 패딩과 테두리 포함한 크기 계산 */
}

.submenu_on {
  background: #265a44;
  color: #fff;
  border-color: #265a44;
}

.submenu_off {
  background: #fff;
  color: #265a44;
}

.history_gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3열 그리드 */
  grid-gap: 10px; /* 이미지 간 10px 간격 */
}

.history_gallery div {
  display: block;
  width: 100%;
  height: auto;
}
@media (max-width: 768px) {
.history_gallery {
  box-sizing: border-box;
  width:100%;
  grid-gap: 5px; /* 이미지 간 10px 간격 */
}
.history_gallery div img {
  display: block;
  width: 100%;
  height: auto;
}
}
.servicebox {
padding:10px;
border:1px solid #eee;
background: #fff;
/*filter: drop-shadow(0px 0px 7px rgba(0,0,0,.1));*/
}
.contentbox {
	font-size:0.9em;
	padding:5px 10px;
	background: #265a44;
	color:#fff;
}
.col-6s {
    flex: 0 0 auto;
    width: 50%;
}
@media (max-width: 768px) {
.col-6s {
    flex: 0 0 auto;
    width: 100%;
}
.history_gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 3열 그리드 */
  grid-gap: 10px; /* 이미지 간 10px 간격 */
}

.servicebox {
padding:0px;
border:0px solid #eee;
background: #fff;
/*filter: drop-shadow(0px 0px 7px rgba(0,0,0,.1));*/
}
.contentbox {
	font-size:0.85em;
}
.section_title {
padding:30px 20px 30px;
}
.section_title .main_title{
font-size:1.5em;
transition: all 0.5s ease-out;
}

.mmt-10 {
margin-top:10px !important;
}
}

/* 기본 레이아웃 설정 */
.content-box {
  display: flex;
  align-items: center; /* 세로 가운데 정렬 */
  gap: 40px; /* 이미지와 글 사이 간격 */
  padding: 20px 30px;
  background-color: #fefff0; /* 배경 색 */
  border-radius: 15px; /* 사각형을 둥글게 */
/*  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);*/  /* 그림자 효과 */
  margin: 30px 0; /* 상하 간격 */
}

.image-box {
  flex: 1; /* 이미지가 일정 부분 차지하도록 설정 */
}

.image-box img {
  width: 100%; /* 이미지가 부모 요소의 너비를 채우도록 */
  border-radius: 15px; /* 이미지도 둥글게 */
}
.rounded-image {
  width: 100%; /* 이미지가 부모 요소의 너비를 채우도록 */
  border-radius: 15px; /* 이미지도 둥글게 */
}
.text-box {
  flex: 1; /* 텍스트가 더 넓게 표시되도록 설정 */
}

.content-box h3 {
  margin-top: 0;
  font-size:1.4em;
  line-height:1.8em;
}

/* 모바일 화면일 때 */
@media (max-width: 768px) {
  .content-box {
  margin:20px 10px;
  padding:30px 25px;
    flex-direction: column; /* 위아래 배치 */
    text-align: left; /* 가운데 정렬 */
  }

  .image-box, .text-box {
    width: 100%; /* 너비를 100%로 설정 */
  }

  .image-box img {
    width: 100%; /* 이미지가 화면을 채우도록 설정 */
  }

  /* 'reverse' 클래스를 가진 요소에만 이미지가 위로 오도록 */
  .content-box.reverse .image-box {
    order: -1;
  }
.nogap {
gap:0 !important;
}

.form-box {
padding:0 10px;
clear:both;
}

}
@media (max-width: 768px) {
	  .content-box {
	  margin:20px 10px;
	  padding:20px 10px;
		flex-direction: column; /* 위아래 배치 */
		text-align: left; /* 가운데 정렬 */
	  }
}
.odbox {
display:inline-block;
padding:3px 15px;
background:#aecd53;
color:#fff;
border-radius: 5px;
}
.odinbox {
padding:3px 15px;
margin:2px 0 15px;
}
.odbox_outline {
display:inline-block;
padding:3px 15px;

border:1px solid #333;
color:#333;
border-radius: 20px;
}
.vscroll {
overflow: hidden;
    height: 200px;
    overflow-y: auto;
}
.fagree {
font-size:0.9em;
line-height:25px;
}

.page_content input[type="checkbox"] + label {
    padding-left: 30px !important;
}
.page_content input[type="checkbox"] + label {
    position: relative;
    padding-left: 30px;
    margin-right: 0px;
    cursor: pointer;
    vertical-align: middle;
   /* padding-top: 4px;*/
    padding-bottom: 4px;
    line-height: 20px;
}

.page_content input[type="checkbox"]:checked + label:before {
    border: 1px solid #25282B;
    background: #fff;
}
.page_content input[type="radio"]:checked + label:before, input[type="checkbox"]:checked + label:before {
    animation-name: none;
}
.page_content input[type="radio"] + label:hover:before, input[type="checkbox"] + label:hover:before {
    animation-duration: 0.4s;
    animation-fill-mode: both;
    animation-name: hover-color;
}
.page_content input[type="checkbox"] + label:before {
}
.page_content input[type="checkbox"] + label:before {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 25px;
    height: 25px;
    content: '';
    border: 1px solid #ddd;
    border-radius: 6px;
    background-color: #fff;
}

.page_content input[type="radio"]:checked + label:after, input[type="checkbox"]:checked + label:after {
    display: block;
}
.page_content input[type="checkbox"] + label:after {
    top: 5px;
    left: 10px;
    box-sizing: border-box;
    width: 6px;
    height: 11px;
    transform: rotate(45deg);
    border-width: 1.7px;
    border-style: solid;
    border-color: #25282B;
    border-top: 0;
    border-left: 0;
}
.page_content input[type="radio"] + label:after, input[type="checkbox"] + label:after {
    position: absolute;
    display: none;
    content: '';
}
.submit_btn{
padding:8px 30px ;
}