/* 의료인 전용 - Implant solution - 서브머지드 */
#submerged{ overflow-x: auto; overflow-y: clip; }
#submerged .scroll-content{ min-width: 1900px; }
#submerged .title h3{ font-family: var(--Red); font-size: 80px; font-weight: 800; color: #FFF; }
#submerged .title p{ font-size: 20px; font-weight: 300; color: #FFF; letter-spacing: -0.02em; margin-top: 25px; }
#submerged .dlBox{ letter-spacing: -0.02em; }
#submerged .dlBox > div{ background: rgba(255, 255, 255, 0.03); border-radius: inherit; }
#submerged .dlBox strong{ display: block; font-family: var(--Red); font-size: 23px; font-weight: 500; color: #2CBDB4; margin-bottom: 15px; }
#submerged .arrowList{ font-size: 17px; font-weight: 300; color: #FFF; line-height: 1.6; }
#submerged .arrowList li{ line-height: inherit; position: relative; padding-left: 21px; }
#submerged .arrowList li:not(:last-of-type){ margin-bottom: 5px; }
#submerged .arrowList li::before{ content: ""; width: 16px; height: 16px; background: #1ABCB9; mask: url("/img/sub/submerged_list_arrow.svg") no-repeat center center / contain; -webkit-mask: url("/img/sub/submerged_list_arrow.svg") no-repeat center center / contain; position: absolute; top: calc(1.6em / 2); left: 0; transform: translateY(-50%); }


/* con01 */
#submerged .con01{ padding-bottom: 120px; }
#submerged .con01 .bg{ background: url("/img/sub/submerged_img01.png") no-repeat center center / cover; padding:  160px 0 110px; }
#submerged .con01 .bg .title p{ font-family: var(--Red); font-size: 30px; font-weight: 500; margin-top: 0; }
#submerged .con01 .bg .top{ margin-bottom: 290px; }
#submerged .con01 .bg .top .title p{ color: #21DACB; margin-top: 30px; }
#submerged .con01 .bg .bottom{ text-align: right; }
#submerged .con01 .bg .bottom .title h3{ color: #78A7D9; margin-bottom: 20px; }
#submerged .con01 .dl{ margin-top: 100px; }
#submerged .con01 .dl dl{ background: rgba(255, 255, 255, 0.03); border-radius: inherit; padding: 65px 45px; }
#submerged .con01 .dl dl dt{ font-family: var(--Red); font-size: 40px; font-weight: 700; color: #21DACB; }
#submerged .con01 .dl dl dd{ font-size: 20px; font-weight: 300; color: #FFF; letter-spacing: -0.02em; margin-top: 25px; }


/* con02 */
#submerged .con02 .title{ padding-bottom: 100px; }
#submerged .con02 .diagram01 .img{ position: relative; z-index: 10; }
#submerged .con02 .diagram01 .img .flex-box{ max-width: 1130px; display: flex; margin: 0 auto; position: relative; }
#submerged .con02 .diagram01 .img .flex-box::before,
#submerged .con02 .diagram01 .img .flex-box::after{ content: ""; left: calc(((100% - 200px) / 3) + 50px); }
#submerged .con02 .diagram01 .img .flex-box::before{ width: 3px; height: calc(50% + 70px); background: var(--mainC); position: absolute; top: 50%; transform: translateX(-50%); }
#submerged .con02 .diagram01 .img .flex-box::after{ width: 16px; height: 16px; background: var(--mainC); border-radius: 50%; position: absolute; bottom: -70px; transform: translate(-50%, 50%); } 
#submerged .con02 .diagram01 .img .flex-box > *{ width: calc((100% - 200px) / 3); margin-right: 100px; }
#submerged .con02 .diagram01 .img .flex-box > *:last-child{ margin-right: 0; }
#submerged .con02 .diagram01 .img figure{ position: relative; }
#submerged .con02 .diagram01 .img figure::before{ content: ""; width: 100px; height: 1px; border-bottom: 3px dashed #1EB6B7; position: absolute; top: 50%; left: 0; transform: translate(-100%, -50%); } 
#submerged .con02 .diagram01 .img figure:first-of-type::before{ display: none; }
#submerged .con02 .diagram01 .img figure:nth-of-type(2)::before{ width: calc(25% + 100px); }
#submerged .con02 .diagram01 .img figure::after{ content: ""; width: 16px; height: 16px; background: #1EB6B7; border-radius: 50%; position: absolute; top: 50%; right: 25%; transform: translate(50%, -50%); }
#submerged .con02 .diagram01 .img figure:not(:first-of-type)::after{ display: none; }
#submerged .con02 .diagram01 .dlBox{ max-width: 615px; margin: 0 auto; margin-top: 70px; }
#submerged .con02 .diagram01 .dlBox > div{ padding: 50px; }
#submerged .con02 .diagram02{ border-bottom: 1px solid rgba(255, 255, 255, 0.9); padding: 200px 0; }
#submerged .con02 .diagram02 .dlBox > div{ padding: 30px 40px; }
#submerged .con02 .diagram02 .question{ width: 700px; display: flex; align-items: center; margin-left: auto; margin-bottom: 40px; }
#submerged .con02 .diagram02 .question i{ flex-shrink: 0; display: inline-block; width: 46px; height: 46px; background: url("/img/sub/submerged_question_mark.svg") no-repeat center center / contain; margin-right: 40px; cursor: pointer; }  
#submerged .con02 .diagram02 .question .dlBox{ flex: 1 1 auto; min-width: 0; background: #1ABCB9; border-radius: 20px; opacity: 0; transform: translateX(-20px); transition: all 0.5s; }
#submerged .con02 .diagram02 .question i:hover + .dlBox{ opacity: 1; transform: translateX(0); }
#submerged .con02 .diagram02 .question .arrowList li::before{ background: #FFF; }
#submerged .con02 .diagram02 .grid-box{ max-width: 1355px; margin: 0 auto; display: grid; grid-template-columns: 485px auto 545px; }
#submerged .con02 .diagram02 figure{ margin-top: 72px; position: relative; cursor: pointer; }
#submerged .con02 .diagram02 figure img.over{  position: absolute; top: 0; right: 0; bottom: 0; left: 0; transition: filter 0.5s; }
#submerged .con02 .diagram02 figure:hover img.over{ filter: drop-shadow(0 0 50px rgba(44, 189, 180, 0.8)); -webkit-filter: drop-shadow(0 0 50px rgba(44, 189, 180, 0.8)); }
#submerged .con02 .diagram02 .item{ display: flex; }
#submerged .con02 .diagram02 .item:not(:last-of-type){ margin-bottom: 30px; }
#submerged .con02 .diagram02 .item .line{ flex: 1 1 auto; min-width: 0; display: block; position: relative; z-index: 10; }
#submerged .con02 .diagram02 .item .line::before,
#submerged .con02 .diagram02 .item .line::after{ content: ""; position: absolute; }
#submerged .con02 .diagram02 .item .line i:first-of-type{ width: 5px; height: 5px; background: var(--mainC); border-radius: 50%; position: absolute; top: 50%; }
#submerged .con02 .diagram02 .item .line i:last-of-type{ width: 10px; height: 10px; background: var(--mainC); box-shadow: 0 0 0 4px rgba(30, 182, 183, 0.51); border-radius: 50%; position: absolute; }
#submerged .con02 .diagram02 .item .dlBox{ flex-shrink: 0; }
#submerged .con02 .diagram02 .item .img{ margin-bottom: 20px; }

#submerged .con02 .diagram02 .left{ padding-top: 57px; }
#submerged .con02 .diagram02 .left .item{ flex-direction: row-reverse; }
#submerged .con02 .diagram02 .left .line::before{ left: 0; }
#submerged .con02 .diagram02 .left .line i:first-of-type{ left: 0; transform: translate(-50%, -50%); }
#submerged .con02 .diagram02 .right .line{ right: 0; }
#submerged .con02 .diagram02 .right .line::before{ right: 0; }
#submerged .con02 .diagram02 .right .line i:first-of-type{ right: 0; transform: translate(50%, -50%); }

#submerged .con02 .diagram02 .item01 .line::before{ width: 170%; height: 1px; border-bottom: 1px dashed var(--mainC); bottom: 50%; }
#submerged .con02 .diagram02 .item01 .line i:last-of-type{ top: 50%; right: -70%; transform: translate(50%, -50%); }

#submerged .con02 .diagram02 .item02{ flex: 1 0 auto; }
#submerged .con02 .diagram02  .item02 .line::before{ width: 300%; height: 1px; border-bottom: 1px dashed var(--mainC); bottom: 50%; }
#submerged .con02 .diagram02 .item02 .line i:last-of-type{ top: 50%; right: -200%; transform: translate(50%, -50%); }

#submerged .con02 .diagram02 .item03{ margin-right: -35px; }

#submerged .con02 .diagram02 .item04 .line::before{ width: 165%; border-bottom: 1px dashed var(--mainC); bottom: 50%; }
#submerged .con02 .diagram02 .item04 .line i:last-of-type{ top: 50%; left: -65px; transform: translate(-50%, -50%); }

#submerged .con02 .diagram02 .item05 .line::before{ width: 60%; height: 62%; border-left: 1px dashed var(--mainC); border-bottom: 1px dashed var(--mainC); bottom: 50%; }
#submerged .con02 .diagram02 .item05 .line::after{ width: 45%; height: 1px; border-bottom: 1px dashed var(--mainC); top: -13%; left: -5%; }
#submerged .con02 .diagram02 .item05 i:last-of-type{ top: -15%; left: -5%; }

#submerged .con02 .diagram02 .item06 .line::before{ width: 115%; border-bottom: 1px dashed var(--mainC); bottom: 67%;  }
#submerged .con02 .diagram02 .item06 .line i:first-of-type{ top: 33%; }
#submerged .con02 .diagram02 .item06 .line i:last-of-type{ top: 33%; left: -15%; transform: translate(-50%, -50%); }

#submerged .con02 .diagram02 .item07 .line::before{ width: 249%; height: 50%; border-bottom: 1px dashed var(--mainC); border-left: 1px dashed var(--mainC); }
#submerged .con02 .diagram02 .item07 .line i:first-of-type{ top: 50%; }
#submerged .con02 .diagram02 .item07 .line i:last-of-type{ top: 0; left: -150%; transform: translate(-50%, -50%); }


/* con03 */
#submerged .con03 .title > em{ display: block; font-family: var(--Red); font-size: 200px; font-weight: 900; color: #2CBDB4; opacity: 0.15; position: relative; z-index: -1; margin-bottom: -0.6em; }
#submerged .con03 .diagram{ max-width: 1155px; height: 591px; text-align: center; margin: 0 auto 200px; position: relative; }
#submerged .con03 .diagram .text{ position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); }
#submerged .con03 .diagram .text .flex{ display: flex; justify-content: center; align-items: flex-start; } 
#submerged .con03 .diagram .text .flex:not(:last-of-type){ margin-bottom: 40px; }
#submerged .con03 .diagram .text .item{ position: relative; padding: 0 150px; }
#submerged .con03 .diagram .text .line{ width: 150px; height: 1px; border-bottom: 1px dashed var(--mainC); position: absolute; top: 50%; }
#submerged .con03 .diagram .text .line i{ border-radius: 50%; position: absolute; z-index: 10; }
#submerged .con03 .diagram .text .line i:first-of-type{ width: 6px; height: 6px; background: var(--mainC); top: 50%; }
#submerged .con03 .diagram .text .line i:last-of-type{ width: 10px; height: 10px; background: var(--mainC); box-shadow: 0 0 0 4px rgba(30, 182, 183, 0.51); }
#submerged .con03 .diagram .text .lineBg > div{ padding: 30px 40px; }
#submerged .con03 .diagram .text .lineBg p{ font-size: 17px; font-weight: 300; color: #FFF; line-height: 1.6; letter-spacing: -0.02em; }

#submerged .con03 .diagram .text .item:nth-of-type(odd){ padding-left: 0; }
#submerged .con03 .diagram .text .item:nth-of-type(odd) .line{ right: 0; }
#submerged .con03 .diagram .text .item:nth-of-type(odd) .line i:first-of-type{ left: 0; transform: translate(-50%, -50%); }
#submerged .con03 .diagram .text .item:nth-of-type(odd) .line i:last-of-type{ right: 0; transform: translate(50%, -50%); }
#submerged .con03 .diagram .text .item:nth-of-type(even){ padding-right: 0; }
#submerged .con03 .diagram .text .item:nth-of-type(even) .line{ left: 0; }
#submerged .con03 .diagram .text .item:nth-of-type(even) .line i:first-of-type{ right: 0; transform: translate(50%, -50%); }
#submerged .con03 .diagram .text .item:nth-of-type(even) .line i:last-of-type{ left: 0; transform: translate(-50%, -50%); }

#submerged .con03 .diagram .item01{ margin-right: 272px; }
#submerged .con03 .diagram .item02{ margin-right: 5%; }
#submerged .con03 .diagram .item03{ margin-top: 90px; margin-right: 230px; margin-left: 3%; }

#submerged .con03 .dl-box .item{ max-width: 1360px; display: flex; align-items: center; margin: 0 auto; }
#submerged .con03 .dl-box .item:not(:last-of-type){ margin-bottom: 110px; }
#submerged .con03 .dl-box .item .img{ flex-shrink: 0; width: 620px; position: relative; }
#submerged .con03 .dl-box .item .img .delay{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 1s 1s; }
#submerged .con03 .dl-box .item.aos-animate .img .delay{ opacity: 1; }
#submerged .con03 .dl-box .item .text{ flex: 1 1 auto; min-width: 0; padding: 0 50px; }
#submerged .con03 .dl-box .item .text dl dt{ font-size: 50px; font-weight: 700; color: #FFF; line-height: 1.4; margin-bottom: 50px; position: relative; }
#submerged .con03 .dl-box .item .text dl dt em{ font-family: var(--Island); font-size: 128px; font-weight: 400; color: #2CBDB4; white-space: nowrap; opacity: 0.5; position: absolute; top: 0.2em; left: 121px; z-index: -1; transform: translateY(-50%); }
#submerged .con03 .dl-box .item .text dl dt em.left01{ left: 38px; }
#submerged .con03 .dl-box .item .text dl dd .arrowList{ font-size: 20px; }

#submerged .con03 .dl-box .item:nth-of-type(odd) .text{ padding-left: 0; }
#submerged .con03 .dl-box .item:nth-of-type(even){ flex-direction: row-reverse; }
#submerged .con03 .dl-box .item:nth-of-type(even) .text{ padding-right: 0; }


/* con04 */
#submerged .con04{ padding-bottom: 140px; }
#submerged .con04 .bigLetter{ text-align: center; margin-top: -100px; } 
#submerged .con04 .bigLetter .ptb:last-of-type{ margin-top: -7px; padding-bottom: 200px; }
#submerged .con04 .bigLetter .bg{ height: 800px; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; background: linear-gradient(180deg, rgba(33, 218, 203, 0.00) 0%, rgba(44, 189, 180, 0.90) 100%); padding-top: 195px; }
#submerged .con04 .bigLetter img{ width: auto; height: auto; }

#submerged .con04 .point-box .item:not(:last-of-type){ margin-bottom: 145px; }
#submerged .con04 .point-box .arrowList li{ font-size: 20px; }
#submerged .con04 .point-box .title{ margin-bottom: 60px; }
#submerged .con04 .point-box .title span{ display: inline-block; border: 2px solid var(--mainC); border-radius: 100px; font-family: var(--Red); font-weight: 700; color: #2CBDB4; padding: 10px 30px; margin-bottom: 30px; }
#submerged .con04 .point-box .title h4{ font-size: 50px; font-weight: 600; color: #FFF; }
#submerged .con04 .point-box .title .arrowList{ margin-top: 30px; }  
#submerged .con04 .point-box .flex{ display: flex; justify-content: space-between; position: relative; }
#submerged .con04 .point-box .flex > *{ width: calc((100% - 20px) / 2); transition: transform 1s; }
#submerged .con04 .point-box .flex .left{ transform: translateX(100px); }
#submerged .con04 .point-box .flex .right{ transform: translateX(-100px); }
#submerged .con04 .point-box .list{ width: unset; padding-top: 132px; position: absolute; top: 0; left: 50%; transform: translate(-50%) !important; }
#submerged .con04 .point-box .arrow{ display: flex; align-items: center; }
#submerged .con04 .point-box .arrow::before,
#submerged .con04 .point-box .arrow::after{ content: ""; display: inline-block; flex-shrink: 0; width: 73px; height: 112px; background: #2AB9B0; }
#submerged .con04 .point-box .arrow::before{ clip-path: polygon(0 50%, 100% 100%, 100% 0); -webkit-clip-path: polygon(0 50%, 100% 100%, 100% 0); }
#submerged .con04 .point-box .arrow::after{ clip-path: polygon(100% 50%, 0 0, 0 100%); -webkit-clip-path: polygon(100% 50%, 0 0, 0 100%); display: none; }
#submerged .con04 .point-box .arrow p{ flex: 1 1 auto; min-width: 0; background: linear-gradient(to right, rgba(44, 189, 180, 1), rgba(33, 218, 203, 0)); font-family: var(--Red); font-size: 24px; font-weight: 800; color: #000; padding: 13px 15px; margin: 0 -1px; }
#submerged .con04 .half-circle{ margin-top: 20px; text-align: center; }
#submerged .con04 .half-circle span{ display: inline-block; border: 2px solid var(--mainC); border-radius: 100px; font-size: 24px; font-weight: 500; color: #2CBDB4; padding: 15px 40px; }
#submerged .con04 .half-circle figure{ margin: 40px 0; }
#submerged .con04 .half-circle .box{ display: flex; flex-direction: column; justify-content: flex-end; width: 245px; height: 110px; border-radius: 50% 50% 0 0; margin: 0 auto; position: relative; }
#submerged .con04 .half-circle .box .line{ width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; transform: scaleX(-1); }
#submerged .con04 .half-circle .box .line svg{ width: 100%; height: auto; }
#submerged .con04 .half-circle .box .line svg path{ stroke-dasharray: 325; stroke-dashoffset: -325; }
#submerged .con04 .half-circle .box p{ font-family: var(--Red); font-size: 24px; font-weight: 500; color: #808080; line-height: 1; letter-spacing: -0.02em; }
#submerged .con04 .half-circle .box p strong{ font-size: 64px; font-weight: 800; line-height: 1; margin: 0 3px; }

#submerged .con04 .half-circle.on .box .line svg path{ stroke: #21DACB; }
#submerged .con04 .half-circle.on .box .line svg circle{ fill: #21DACB; }
#submerged .con04 .half-circle.on .box p{ color: #21DACB;} 


#submerged .con04 .point-box .flex.aos-animate .left,
#submerged .con04 .point-box .flex.aos-animate .right{ transform: translate(0, 0) !important; }
#submerged .con04 .point-box .flex.aos-animate .half-circle svg path{ animation: halfCircle 1s 1s both; }


#submerged .con04 .point-box .flex > *:last-of-type .arrow::before{ display: none; }
#submerged .con04 .point-box .flex > *:last-of-type .arrow::after{ display: block; }
#submerged .con04 .point-box .flex > *:last-of-type .arrow p{ background: linear-gradient(to left, rgba(44, 189, 180, 1), rgba(33, 218, 203, 0)); text-align: right; }

#submerged .con04 .item03 .grid-box{ display: grid; grid-template-columns: repeat(5, 1fr); gap: 0 30px; text-align: center; padding: 0 78px; margin-bottom: -125px; }
#submerged .con04 .item03 .grid-box span{ display: inline-flex; justify-content: center; align-items: center; width: 220px; height: 53px; background: linear-gradient(to bottom, #195551, #061A19); border-radius: 8px; font-family: var(--Red); font-size: 25px; font-weight: 500; color: #FFF; margin-bottom: 16px; }
#submerged .con04 .item03 .p-box{ margin-top: 10px; }
#submerged .con04 .item03 .p-box p{ font-size: 18px; font-weight: 200; color: #FFF; line-height: 1.5; padding: 0 115px; }
#submerged .con04 .item03 .p-box p:not(:last-of-type){ margin-bottom: 5px; }
#submerged .con04 .item03 .p-box p strong{ font-size: 46px; font-weight: 600; color: #21DACB; }
#submerged .con04 .item03 .left .p-box{ padding-right: 0; }
#submerged .con04 .item03 .right .p-box{ text-align: right; padding-left: 0; }


/* con05 */
#submerged .con05{ margin-bottom: 140px; }
#submerged .con05 > *{ border-top: 1px solid rgba(255, 255, 255, 0.9); border-bottom: 1px solid rgba(255, 255, 255, 0.9); padding-block: 140px 225px; }
#submerged .con05 .inner{ max-width: 1324px; width: 100%; margin: 0 auto; }
#submerged .con05 h5{ font-size: 40px; font-weight: 500; color: #FFF; margin-bottom: 28px; }
#submerged .con05 .flex-box{ display: flex; } 
#submerged .con05 .left{ flex: 1 1 auto; min-width: 0; padding-right: 28px; }
#submerged .con05 .right{ flex-shrink: 0; display: flex; flex-direction: column; width: 468px; }
#submerged .con05 .right .top{ flex: 1 0 auto; }
#submerged .con05 .right .bottom a{ display: flex; justify-content: center; align-items: center; height: 90px; background: rgba(0, 0, 0, 0.3); border: 1px solid rgba(26, 188, 185, 0.7); border-radius: 100px; font-size: 24px; font-weight: 500; color: #FFF; transition: all 0.5s; }
#submerged .con05 .right .bottom a i{ display: inline-block; width: 30px; height: 30px; background: #FFF; mask: url("/img/sub/submerged_download_icon.svg") no-repeat center center / contain; -webkit-mask: url("/img/sub/submerged_download_icon.svg") no-repeat center center / contain; margin-left: 20px; transition: all 0.5s; }
#submerged .con05 .right .bottom a:hover{ background: #1ABCB9; font-weight: 600; color: #222; }
#submerged .con05 .right .bottom a:hover i{ background: #222; }

#submerged .con05 .slide{ position: relative; }
#submerged .con05 .slide .swiper-slide{ border: 1px solid #2CBDB4; border-radius: 20px; overflow: hidden; position: relative; }
#submerged .con05 .slide .swiper-slide figure,
#submerged .con05 .slide .swiper-slide figure img{ width: 100%; }
#submerged .con05 .slide .swiper-slide .text{ display: flex; flex-direction: column; position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 30px; }
#submerged .con05 .slide .swiper-slide .text > div{ flex: 1 0 auto; }
#submerged .con05 .slide .swiper-slide .text figcaption{ display: inline-block; background: rgba(0, 0, 0, 0.3); border: 1px solid rgba(26, 188, 185, 0.7); border-radius: 100px; font-size: 16px; font-weight: 400; color: #FFF; padding: 10px 30px; }
#submerged .con05 .slide .swiper-slide .text p{ font-size: 20px; font-weight: 600; color: #FFC300; text-align: right; }
#submerged .con05 .slide .img{ position: absolute; bottom: -85px; left: -44px; z-index: 100; }
#submerged .con05 .slide .btn{ display: flex; justify-content: space-between; padding: 0 1px; position: absolute; top: 50%; left: 0; right: 0; z-index: 99; transform: translateY(-50%); }
#submerged .con05 .slide .btn button{ width: 65px; height: 66px; background: rgba(0, 0, 0, 0.7); border-radius: 5px; padding: 0; }
#submerged .con05 .slide .btn button i{ display: block; height: 100%; background: url("/img/sub/submerged_slide_arrow.svg") no-repeat center center / contain; }
#submerged .con05 .slide .btn button.next i{ transform: scaleX(-1); }

#submerged .con05 .video{ position: relative; }
#submerged .con05 .video figure{ display: block;border: 1px solid #2CBDB4; border-radius: 20px; padding-bottom: 56%; position: relative; overflow: hidden; }
#submerged .con05 .video figure img{ width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#submerged .con05 .video button{ display: inline-flex; background: rgba(0, 255, 234, 0.2); border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden; }
#submerged .con05 .video button i{ display: block; width: 80px; height: 80px; background: url("/img/sub/submerged_play_icon.png") no-repeat center center / contain; }


/* con06 */
#submerged .con06 .title{ margin-bottom: 60px; }
#submerged .con06 .tabMenu{ margin-bottom: 40px; }
#submerged .con06 .tabMenu ul{ display: grid; grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); background: #D9D9D9; }  
#submerged .con06 .tabMenu li button{ background: none; border: none; width: 100%; min-height: 70px; height: 100%; font-size: 24px; font-weight: 600; color: #222; padding: 10px; }
#submerged .con06 .tabMenu li.on button{ background: #2CBDB4; font-weight: 500; color: #FFF; }
#submerged .con06 .tabContent .tab:not(:first-of-type){ display: none; }


@keyframes halfCircle{
	0%{ stroke-dashoffset: -325; }
	100%{ stroke-dashoffset: 0; }
}


/* 팝업 */
.popup{ width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(3px); position: fixed; top: 0; left: 0; z-index: 1000; display: none; }
.popup .blank{ width: 100%; height: 100%; }
.popup .close{ padding: 0; position: absolute; top: -3px; right: 0; transform: translateX(100%); }
.popup .close i{ display: inline-flex; width: 40px; height: 40px; background: url("/img/sub/submerged_close_icon.svg") no-repeat center center / contain; }
.popup .inner{ max-width: 90%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.popup .inner figure{ border: 1px solid var(--mainC); border-radius: 20px; overflow: hidden; }
.popup .inner img{ width: 100%; }


/* 이미지 팝업 */
.popup.img .inner{ width: 732px; }


/* 비디오 팝업 */
.popup.video .inner{ max-width: 80%; width: 1200px; }
.popup.video iframe{ width: 100%; aspect-ratio: 16 / 9;  }


@media screen and (max-width: 1280px){
	/* 이미지 팝업 */
	.popup.img .inner{ width: 500px; }
}

@media screen and (max-width: 768px){
	.popup .close{ top: 0; transform: translateY(-100%); }
	
	/* 비디오 팝업 */
	.popup.video .inner{ max-width: 90%; }
}