.lens-section {
    display: flex;
    flex-direction: column;
    align-items: center; /* 중앙 정렬 */
    width: 100vw; /* 전체 화면 너비 */
    min-height: 100vh;
    background-color: rgba(255, 255, 255, 0.1); /* 투명한 흰색 배경 */
    text-align: center;
    padding: 20px 40px; /* 패딩 */
    box-sizing: border-box;
}

.icon-text-container {
    display: flex;
    align-items: center; /* 아이콘과 텍스트 정렬 */
}

.lens-icon {
    height: 4em; /* 아이콘 크기를 텍스트 높이에 맞춤 */
    margin-right: 10px; /* 텍스트와의 간격 */
}

.lens-section h2 {
    font-size: 6vw; /* 큰 글씨 */
    font-weight: bold;
    color: white;
}

.lens-section p:first-of-type {
    font-size: 4vw; /* 조금 작은 글씨 */
    font-weight: bold;
    color: white;
    margin: 0 0 10px 0; /* 아래쪽 여백 */
    padding-right: 10%; /* 중앙으로부터 오른쪽으로 기울임 */
}

.lens-section p:last-of-type {
    font-size: 3.5vw; /* 조금 작은 글씨 */
    font-weight: bold;
    color: white;
    margin: 0 0 20px 0; /* 아래쪽 여백 */
    padding-left: 10%; /* 중앙으로부터 왼쪽으로 기울임 */
}


#lens {
    color: white;
}

#lens .img-container {
    width: 100%;
    display: flex;
    justify-content: center;
}



/* */

.container {
    width: 100%;
    padding: 20px;
}

.collapse {
    margin-bottom: 10px;
    background-color: #f9f9f9;
}

.collapse button {
    font-size: 16pt;
}

.collapse-toggle {
    width: 100%;
    padding: 10px 20px;
    text-align: left;
    background: #eee;
    border: none;
    cursor: pointer;
    outline: none;
    transition: background-color 0.3s ease; /* 배경색 변경 애니메이션 */
}

.collapse-toggle:hover, .collapse-toggle:focus {
    background-color: #ddd; /* 호버 및 포커스 상태의 배경색 변경 */
}

.collapse-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out; /* 펼치기/접기 애니메이션 */
    padding: 0 20px;
    background-color: #f9f9f9;
}

/* 확장된 컨텐츠 스타일 */
.collapse-content.expanded {
    padding: 20px;
    max-height: 1000px; /* 충분히 큰 값으로 설정하여 모든 내용이 보이도록 함 */
}


.collapse-content p {
    font-size: 14pt !important;
    text-align: left;
    padding-left: 0 !important;
}

.list .kr {
    display: flex;
    align-items: center;
    background-color: #f0f0f0; /* 배경색은 필요에 따라 조정하세요 */
    color: black;
    border: 1px solid #ccc;
    position: relative;
}

.lens-icon {
    width: 100%;  /* 이미지의 가로 길이를 버튼의 전체 너비로 설정 */
    max-width: 64px;  /* 이미지의 최대 너비를 설정하여 크기를 제한 */
    height: auto;  /* 높이를 자동으로 설정하여 비율 유지 */
    object-fit: cover;  /* 이미지를 버튼에 꽉 차게 하되, 비율을 유지 */
    margin-right: 20px;
}


/* LENS */
.text_banner {padding:40px 0 80px;border-bottom:1px solid #ccc;}
.text_banner .icon {display:flex;align-items:center;justify-content:center;font-size:3.556vw;font-weight:700;
    margin-bottom:60px;}
.text_banner .icon::before {content:'';display:block;width:84px;height:84px;margin:6px 12px 0 0;
    background:url('/resource/image/icon-lens.png')no-repeat center/100%}
.text_banner p {text-align:center;font-size:4vw;font-weight:600;margin-bottom:20px;}
.text_banner span {display:block;text-align:center;font-size:2vw;}
section.list { display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;}
section.list>ul {width:calc(85%);padding-top:60px;}
section.list>ul li {border-bottom:1px solid #ccc;}
section.list>ul li:first-child {border-top:1px solid #ccc;}
section.list>ul button { width:100%;text-align:left;background:none;border:0;font-size:1.6vw;padding:0 14px;
    line-height:5.556vw;font-weight:500;cursor:pointer;position:relative;}
section.list>ul button .numb {margin-right:14px;}
section.list>ul .acd_icon {position:absolute;top:50%;right:14px;margin-top:-14px;width:28px;height:28px;
    transition:all .3s ease;}
section.list>ul .col {display:block;width:2px;height:100%;background:#ccc;position:absolute;top:50%;left:50%;
    transform:translate(-50%,-50%);transition:all .2s ease;}
section.list>ul .row {display:block;width:100%;height:2px;background:#ccc;position:absolute;top:50%;left:50%;
    transform:translate(-50%,-50%);transition:all .2s ease;}
section.list>ul li.active .acd_icon {transform:rotateZ(45deg);}
section.list>ul button:hover .acd_icon span {background:#999;}
section.list>ul li.active .acd_icon span {background:white;}
section.list>ul .acd_cont {font-size:1vw;padding:42px 0 42px 4.5vw;display:flex; justify-content: space-between;}

section.list .list_img {width:100%;display:flex;justify-content:right;margin:40px 0;}
section.list .list_img div {width:calc(100%);}
section.list .list_img img {width:100%;height:100%;object-fit:cover;}

section.list .slide_banner {width:100%;overflow:hidden;position:relative;white-space:nowrap;margin:120px 0 0;
    border-top:1px solid #ccc;padding-top:20px;}
section.list .marquee {display:inline-block;animation:slide_banner 40s linear infinite;}    
section.list .slide_banner p {color:white; display:inline-block;font-size:7vw;font-weight:600;}
section.list .slide_banner p span {color:#ccc;}
@keyframes slide_banner {
    0% {transform:translateX(0%);}
    100% {transform:translateX(-50%);}
}