@charset "utf-8";

:root{
  --blue_color:#00a1ff;
  --navy_color:#061737;
  --deep_blue:#416EFF;
  --red_color:#f00;
  --btn_border:#495e7a;
}
    @keyframes fadeIn {
      from {
        opacity: 0;
        transform: translateY(20px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }
    @keyframes ripple {
  0%{
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.6;
  }
  100%{
    transform: translate(-50%, -50%) scale(1.25);
    opacity: 0;
  }
}
/* CONSULTING */

/* PORTFOLIO */
.pofol_main{background:#000; background-repeat: no-repeat; /*background-size: cover;*/ background-position:top center; width:100%; /*height: 100%;*/ padding-bottom: 100px;}
.pofol_bg{background: transparent; height:450px; position: relative; max-width: 1400px; margin: 0 auto;}
.pofol_inner { max-width: 1600px; margin: 0 auto; padding: 0 20px;}
.pofol_bg .sub01_content{text-align: center; left: 50%; top: 50%;}
.pofol_bg .sub01_content p.blue{padding: 10px 0;}
.tab_content {display: none;} 
.tab_content.active {display: block; animation: fadeIn 0.4s;}
.tab_menu {margin-bottom: 60px;}
.main_tabs {display: flex; justify-content: center; gap: 15px; margin-bottom: 30px;}
.sub01_inner .pofol_title{font-size: 15px;}

.main_tab_btn {padding: 12px 40px; background: transparent; border: 2px solid var(--btn_border); border-radius: 30px; cursor: pointer; font-size: 16px; font-weight: 600; color: rgba(255, 255, 255, 0.6); transition: all 0.3s; white-space: nowrap;}
.main_tab_btn:hover {background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.5); color: rgba(255, 255, 255, 0.9);}
.main_tab_btn.active {background: var(--blue_color); border-color: var(--blue_color); color: #fff;}

.sub_tabs_wrapper {width: 100%; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; margin-bottom: 20px; position: relative;
  scrollbar-width: none;-ms-overflow-style: none; }
.scroll_guide{display: none;}
.sub_tabs_wrapper::-webkit-scrollbar {display: none;}
.sub_tabs {display: inline-flex; gap: 10px; min-width: 100%; justify-content: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.sub_tabs::-webkit-scrollbar {height: 6px;}
.sub_tabs::-webkit-scrollbar-track {background: transparent;}
.sub_tabs::-webkit-scrollbar-thumb {background: rgba(255, 255, 255, 0.3); border-radius: 3px;}
.sub_tabs::-webkit-scrollbar-thumb:hover {background: rgba(255, 255, 255, 0.5);}

.sub_tab_btn {padding: 10px 24px; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 20px; cursor: pointer; font-size: 14px; color: rgba(255, 255, 255, 0.8); transition: all 0.3s; white-space: nowrap; flex-shrink: 0;}
.sub_tab_btn:hover {background: rgba(255, 255, 255, 0.2); border-color: rgba(255, 255, 255, 0.4); color: #fff;}
.sub_tab_btn.active {background: #fff; border-color: #fff; color: var(--navy_color); font-weight: 600;}

.image_grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.image_item { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 8px; cursor: pointer; background: rgba(255, 255, 255, 0.05); }
.image_item img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
.image_item:hover img { transform: scale(1.05); }
.image_overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.8); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity 0.3s; flex-direction: column; text-align: center; color: #333;}
.image_item:hover .image_overlay { opacity: 1; }
 .overlay_text { font-size: 1.25rem; font-weight: bold; padding-bottom: 10px; }
 .overlay_category{font-size: 1rem;}
 /* 더보기 버튼 */
  .more_btn_wrap {text-align: center; margin: 40px 0 20px; }
 .more_btn { display: inline-flex;  align-items: center;  gap: 8px;   padding: 14px 40px;   background: #fff; color: #1a6de0;   font-size: 15px;  font-weight: 600; border-radius: 4px; cursor: pointer; transition: background 0.2s, color 0.2s;}
.more_btn:hover {background: #1a6de0; color: #fff;}
.image_item.hidden {display: none;}

/* PORTFLIO DETAIL */
.detail{max-width: 1400px; margin: 0 auto; padding: 0 20px; overflow: unset;}
.detail_inner{display: flex; justify-content: space-between; gap: 30px; padding-top: 30px; align-items: flex-start;}
.detail_l{flex: 0 0 40%; top: 15%; position: -webkit-sticky;  position: sticky;  height: auto; z-index: 10;}
.detail_l .control{display: flex; justify-content: space-between; align-items: center;}
.detail_l .control .back a{padding: 15px 20px; border: 2px solid var(--btn_border); border-radius: 50%; text-align: center; transition: 0.3s;}
.detail_l .control .back a img{width: 15px; height: 15px;}
.detail_l .control .arrows button{border: 2px solid var(--btn_border); background: none; color: rgba(255, 255, 255, 0.8); font-size: 1.25rem; border-radius: 50%; padding: 15px 13px; cursor: pointer; text-align: center; transition: 0.3s;} 
.detail_l .control .arrows button:hover, .detail_l .control .back a:hover{background: rgba(255, 255, 255, 0.2); border-color: rgba(255, 255, 255, 0.4); color: #fff;}
.detail_l .pofol_title{color: #fff; padding-top: 30px;}
.detail_l .pofol_title h3{ font-size: 2.5rem; font-weight: bold; padding-bottom: 20px;}
.detail_l .pofol_title p{padding: 10px 30px; border: 1px solid var(--btn_border); display: inline-block;}

.detail_r{flex: 0 0 60%;}
.detail_r img{margin-bottom: 20px; max-width: 100%;}

/* CONTACT */
.con_main{background:#fff; width:100%; padding-bottom: 100px;}
.sub01.con_bg{background: transparent !important; height:450px;}
.sub01.con_bg .sub01_content{top: 50%;}
.contact{width: 100%; height: 100%; } 
.con_inner{max-width: 1000px; height: 100%; margin: 0 auto; padding-bottom: 50px;}
.con_inner form{width: 100%;}
.con_inner form .red{color: var(--red_color); margin-left: 3px;}
.con_inner form h4{font-weight: bold; color: #333; font-size: 1rem;}
.con_inner form .contact_back{background: #fff; padding: 0 20px; border-radius: 10px;}
/* 탭 메뉴 스타일 */
.inquiry_tabs {display: flex;gap: 10px; overflow-x: auto; -webkit-overflow-scrolling: touch; background: #fff; padding:10px 20px; border-radius:10px;}
.inquiry_tabs::-webkit-scrollbar {height: 6px;}
.inquiry_tabs::-webkit-scrollbar-track {background: #f1f1f1;}
.inquiry_tabs::-webkit-scrollbar-thumb {background: #888;border-radius: 3px;}
.inquiry_tab_btn {padding: 12px 24px; background: #fff; cursor: pointer; font-size: 1rem; font-weight: 600; color: #666; transition: all 0.3s; white-space: nowrap; position: relative; border-radius: 10px; border: 1px solid #e0e0e0; background: #fff;}
.inquiry_tab_btn:hover {color: var(--blue_color);}
.inquiry_tab_btn.active {color: #fff; background: var(--blue_color); border: none;}

/* 탭 컨텐츠 영역 */
.inquiry_tab_content {display: none; animation: fadeIn 0.4s;}
.inquiry_tab_content.active {display: block;}
/* 라디오 버튼 영역 */
.radio_box {display: flex; flex-wrap: wrap; gap: 15px; align-items: center; padding: 15px 20px; background: #fff; border-radius: 10px;}
.radio_item{ display: inline-flex; align-items: center; gap: 8px;}.radio_item input[type="radio"] {width: 18px; height: 18px; cursor: pointer; accent-color: var(--blue_color); }
.radio_item label {font-size: 0.938rem; color: #333; cursor: pointer; }

/* 문의유형 체크버튼서식 */
.radio_item01, .radio_item{display: inline-flex; align-items: center;position: relative;}
.radio_item01 input[type="checkbox"], .radio_item input[type="radio"] {position: absolute;opacity: 0; width: 0; height: 0;}
.radio_item01 label, .radio_item label {font-size: 0.938rem; color: #333; cursor: pointer;  padding: 10px; border: 2px solid #ddd;border-radius: 10px;background: #fff;transition: all 0.3s ease;user-select: none;  display: inline-block; min-width: 120px; text-align: center;}
.radio_item01 label:hover, .radio_item label:hover { border-color: var(--blue_color); background: rgba(0, 161, 255, 0.05);}
.radio_item01 input[type="checkbox"]:checked + label, .radio_item input[type="radio"]:checked + label {  background: var(--blue_color); color: #fff; border-color: var(--blue_color); font-weight: 600;}
.radio_box h5 {width: 100%; border-right: none;border-bottom: 1px solid #e0e0e0; padding-bottom: 10px; margin-bottom: 10px; padding-right: 0; font-weight: bold; font-size: 1rem;}

/* 폼 입력 영역 */
.con_inner .form_txt{display: flex; justify-content: space-between; gap: 20px;}
.con_inner .form_txt .form_group{width: 100%; margin-bottom: 15px;}
.con_inner .form_txt .form_group label.bold{font-weight: bold; margin-bottom: 5px; display: inline-block; color:#333; font-size: 1rem;}
.con_inner .form_txt .form_group .red{color: var(--red_color); margin-left: 3px;}
.con_inner .form_txt input[type="text"],
.con_inner .form_txt input[type="email"],
.con_inner .form_txt input[type="file"]{width: 100%; padding:10px 20px; margin-top: 10px; border-radius: 10px; border: 1px solid #ddd; box-sizing: border-box; background: #fff;}
.con_inner .form_file{width: 49%;}
.con_inner .form_txt textarea{width: 100%; margin-top: 10px; padding: 15px 20px; border: 1px solid #ddd; height: 200px; font-size: 1rem; border-radius: 10px; box-sizing: border-box; resize: vertical;}

/* 파일 업로드 */
.file_guide { font-size: 0.875rem; color: #999; margin-top: 8px; }
#file_list { margin-top: 10px; }
.file_item { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; background: #f5f5f5; border-radius: 8px; margin-bottom: 5px; font-size: 0.875rem; }
.file_item .del_btn { cursor: pointer; color: #999; border: none; background: none; font-size: 1rem; }
.file_item .del_btn:hover { color: var(--red_color); }

/* 개인정보 동의 영역 */
.privacy-section{margin: 30px 0;}
.privacy-title{margin-bottom: 15px; font-weight: bold; color:#333;}
.privacy-scroll{max-height: 100px; overflow-y: auto; padding: 16px; border: 1px solid #ddd; background: #fafafa; font-size: 1rem; line-height: 1.6; margin-bottom: 15px;}
.privacy-content{margin-bottom: 15px;}
.privacy-details p{margin-bottom: 10px; line-height: 1.5;}
.con_inner .checkbox-wrapper{margin: 15px 0; font-size: 1rem; display: flex; justify-content: flex-start; align-items: center; gap: 8px;}
.con_inner .checkbox-wrapper input[type="checkbox"]{width: 18px; height: 18px; cursor: pointer;}
.con_inner .checkbox-wrapper label{cursor: pointer; margin: 0; color:#333;}

/* 제출 버튼 */
.con_inner .form_btn{border: none; background: var(--blue_color); color: #fff; padding: 15px 30px 17px 30px; font-size: 1.5rem; margin: 30px auto 0; border-radius: 10px; display: block; cursor: pointer; transition: 0.3s;}
.con_inner .form_btn:hover{background: var(--deep_blue); box-shadow: inset 0 3px 6px rgba(0,0,0,0.5),  0 1px 0 #000;}
.con_inner .form_btn i{margin-left: 8px;}

/* select 부분 수정 (26.02.24) */
.con_inner .form_txt select {width: 100%; padding: 10px 20px; margin-top: 10px;  border-radius: 10px; border: 1px solid #ddd;  box-sizing: border-box;  background: #fff;  font-size: 1rem;  cursor: pointer;}

/* ABOUT */
.about_main{width: 100%; height: 100%; background: #000; padding-top: 91px;}
.about_main section{width:100%; margin: 0 auto;}

.about00{background: linear-gradient(to bottom, #ffffff, #EBEBE9); text-align: center; position: relative; height: 359px !important; width: 100%;}
.about00 .about00_inner{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
.about00 .about00_inner h1{font-size: 3rem; padding-bottom: 50px;}
.about00 .about00_inner .sub_title{font-size: 2rem; padding-bottom: 30px;}
.about00 .about00_inner .sub_title02 p{line-height: 1.3; font-weight: 400;}

.about01{height: 100dvh; background:#151B26;}
.about01_inner{max-width: 1400px; margin: 0 auto; color: #fff; height: 100%; position:relative;}
.about01_inner .title_txt{font-size: 6rem; font-family: "inter"; font-weight: bold; position: absolute; top: 44%; left: 50%; transform: translate(-50%, -50%); letter-spacing: 0.3em; width: 100%; text-align: center;}
.about01_inner .title_txt span { transition: opacity 0.5s ease;}
.about01_inner .title_txt span.active {opacity: 1;}
.about01_inner .center_txt {position: absolute;top: 47%;  left: 50%; transform: translate(-50%, -50%); width: 100%; text-align: center; font-size: 6rem; font-family: "inter";  font-weight: bold; color: #fff; letter-spacing: 0.3em;  opacity: 1;  pointer-events: none; }
.about01_inner .content_txt{width: 100%;}
.about01_inner .content_txt ul li{position: absolute; text-align: center; line-height: 1.3; transition: opacity 0.5s ease;}
.about01_inner .content_txt ul li.active {opacity: 1;}
.about01_inner .content_txt ul li img{padding: 10px 0;}
.about01_inner .content_txt ul li p.tit{font-size: 1.5rem; font-weight: bold; padding-bottom: 10px;}
.about01_inner .content_txt ul li p{font-size: 1rem;}

/* li 위치는 JS(positionContentItems)가 자동 계산해서 주입 */
.about01_inner .detail_txt{position: absolute; bottom: 14%; left: 50%; transform: translateX(-50%); font-size: 2rem; font-weight: 400;}
.about01_inner .detail_txt span{background: #fff; color: #333;padding: 0 5px 2px 5px; font-weight: 900;}

.about02{ min-height: 100vh; background:linear-gradient(to top, #000000, #202020); padding-bottom: 150px;}
.about02_inner{max-width: 1400px; margin: 0 auto; padding: 100px 0;}
.about02_inner h3{text-align: center; font-size: 2.5rem; color: #fff; line-height: 1.3; font-weight: 300;}

.content .img_wrap { position: relative; display: inline-block; width: 100%; max-width: 500px; top: 50%; left: 50%; transform:translateX(-50%); font-size: 2rem;}
.content .img_wrap > img:first-child { width: 100%; height: auto; display: block; }
.content .img_wrap .co1 { position: absolute; top: 25%; left: 50%; transform: translateX(-50%); color: #fff; font-weight: bold; }
.content .img_wrap .co2 { position: absolute; top: 68%; left: 30%; transform: translateX(-50%); color: #fff; font-weight: bold; }
.content .img_wrap .co3 { position: absolute; top: 65%; left: 78%; transform: translateX(-50%); color: #fff; font-weight: bold; }

.line_red { position: absolute; top: 3%; left: 11%; width: 20%; }
.label_tit01{color: #DC2525; font-weight: bold; padding-bottom: 10px; font-size: 1.5rem;}
.txt_co1 { position: absolute; top: 0%; left: -33%; font-size: 1.125rem; color: #fff; text-align: right; line-height: 1.3;}

.line_yellow { position: absolute; top: 39%; right: -1%; width: 20%; }
.label_tit03{color:#FFB300; font-weight: bold; padding-bottom: 10px; font-size: 1.5rem;}
.txt_co3 { position: absolute; top: 37%; right: -57%; font-size: 1.25rem; color: #fff; text-align: left; line-height: 1.3; font-size: 1.125rem;}

.line_blue { position: absolute; bottom: -3%; left: 10%; width: 10%; }
.label_tit02{color:#03A0FD;  font-weight: bold; padding-bottom: 10px; font-size: 1.5rem;}
.txt_co2 { position: absolute; bottom: -18%; left: -45%; text-align: right; line-height: 1.3; font-size: 1.125rem; color: #fff;}

.about03{ height: 100% ; background: #0b3564;}
.about03_inner{max-width: 1400px; margin: 0 auto; padding: 100px 0 150px 0; height: 100%;}
.about03_inner h3{display: flex; justify-content: center; align-items: center; font-size: 3.5rem; gap: 20px; color: #fff; font-weight: bold;}
.about03_inner h3 img{width: 80px;}
.about03_inner h3 img:last-child{width: 40px;}
.about03_inner .sub_title{margin: 40px auto 50px auto; color: #fff; padding:10px 5px; background: #03A0FD; width: 400px; font-size: 1.5rem; text-align: center; font-weight: 500;}
.about03_inner .content_box ul{display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; max-width: 1000px; margin: 0 auto;}
.about03_inner .content_box ul li{text-align: center; padding: 50px 0; background: #fff; width: 500px; border-radius: 20px;}
.about03_inner .content_box ul li h4{font-size: 3rem; color: #0b3564; font-weight: bold; padding-bottom: 30px;}
.about03_inner .content_box ul li p{font-size: 1.25rem; line-height: 1.3;}
.about03_inner .content_box ul li:nth-child(even){transform: translateY(50px);}

.about04{width: 100%; height: 100vh !important; background: #000; background: url(../mn05/images/about04_bg.png) no-repeat; }
.about04_inner{max-width: 1400px; margin: 0 auto; height: 100%; position: relative;  padding: 100px 0;}
.about04 .puzzle{position: absolute; right: 10%; top: 11%;}
.about04 .puzzle img{max-width: 700px; }
.about04 .main_txt{position: absolute; bottom: 30%; left: 10%;}
.about04 .main_txt h3{color: #fff; font-size: 2.5rem; font-weight: bold; line-height: 1.3;}
.about04 .main_txt h3{color: #fff; font-size: 2.5rem; font-weight: bold; line-height: 1.3; padding-bottom: 30px;}
.about04 .main_txt .sub_txt{color: #979797; line-height: 1.3;}

.about05{width: 100%; height: 100% !important; background: url(../mn05/images/about05_bg.png) no-repeat; background-position: center; background-size: cover;}
.about05_inner{max-width: 1400px; margin: 0 auto; padding: 100px 0;}
.about05_inner .star{color: #002079; font-size: 1.5rem; text-align: center;}
.about05_inner h3{display: flex; font-size: 2.5rem; justify-content: space-around; padding: 20px 0 50px 0; font-weight: 400;}
.about05_inner h3 span{color: #002079; font-weight: bold;}
.about05_inner .about05_con{width: 100%; background: #fff; display: flex; justify-content: center;gap: 10px;  padding: 50px 20px; margin-bottom: 20px; text-align: center; border-radius: 20px; box-shadow: 10px 10px 10px rgba(0,0,0,0.1); border: 1px solid #e0e0e0;}
.about05_inner .about05_con h4{padding: 10px 15px; color: #646464; margin-top: 10px; border-radius: 30px; font-size: 0.875rem; font-weight: bold;}
.about05_inner .about05_con01 .con01_l ul{display: flex; gap: 1px;}
.about05_inner .about05_con01 .con01_l ul li img{border: 4px solid #646464; padding: 11px; background: #EFECE9; box-sizing: border-box;}
.about05_inner .about05_con01 .con01_l h4{display: inline-block;}
.about05_inner .about05_con01 .con01_r{display: flex; gap: 10px;}
.about05_inner .about05_con01 .con01_r div img{border: 4px solid #646464; padding: 11px; background: #EFECE9; box-sizing: border-box;}
.about05_inner .about05_con02 ul{display: flex; gap: 10px; height: 360px;}
.about05_inner .about05_con02 ul li img{border: 4px solid #646464; padding: 10px; background: #EFECE9;}
.about05_inner .about05_con02 ul li:last-child .ISO01{transform: translateX(-35px);}
.about05_inner .about05_con02 ul li:last-child .ISO02{transform: translate(34px, -182px);}
.about05_inner .about05_con02 ul li:last-child h4{transform: translateY(-183px);}

.about06{width: 100%; height: 100% !important; background: url(../mn05/images/about06_bg.png)no-repeat; background-position: center; background-size: cover;}
.about06_inner{max-width: 1400px; margin: 0 auto; padding: 100px 0;}
.about06_inner .about_line{display: block; margin: 30px auto; width: 87%; }
.about06_inner .bg03{background: #5686d1; display: flex; flex-direction: column; width: fit-content; width: 180px; height: 80px; text-align: center; line-height: 1.3; font-size: 1.5rem; border-radius: 20px; justify-content: center; color: #fff;} 
.about06_inner .bg02{background: #fff;  display: flex; flex-direction: column; width: fit-content; width: 180px; height: 80px; text-align: center; line-height: 1.3; font-size: 1.5rem; border-radius: 20px; justify-content: center;}
.about06_inner .ceo{margin: 0 auto; width: fit-content;}
.about06_inner .ceo img{display:block; margin: 0 auto; margin-bottom: -10px; width: 60px;}
.about06_inner .dept ul{display: flex; justify-content: space-between;}
.about06_inner .dept ul li{display: flex; flex-direction: column; align-items: center;}
.about06_inner .dept ul li img{width: 35px;}
.about06_inner .dept ul li div{margin-top: -10px; font-weight: 400;}


.about07{width: 100%; background: #151B26;}
.about07_inner{max-width: 1400px; margin: 0 auto; display: flex; justify-content: space-around; padding: 100px 0;}
.about07 .about07_l .map{width: 700px;}
.about07 .about07_r{color: #fff; padding-top: 30px;}
.about07 .about07_r h3{font-size: 2.5rem; font-weight: bold; padding-bottom: 30px; text-align: center;}
.about07 .about07_r .com_address{padding: 40px 0 20px 0; line-height: 1.3;}
.about07 .about07_r .com_address p{padding-bottom: 10px; font-size: 1.25rem; font-weight: 700;}
.about07 .about07_r .com_address p span{padding: 5px 15px; border: 2px solid #e0e0e0; border-radius: 30px; width: 100px; display: inline-block; text-align: center; margin-right: 10px; font-weight: 300; opacity: 0.9; font-size: 18px;}
.about07 .about07_r .call{ display: flex; align-items: center; }
.about07 .about07_r .call h4{ background: #03A0FD; padding: 5px 12px 7px 12px; margin-right: 10px; border-radius: 10px; transform: translateY(3px);}
.about07 .about07_r .call p{font-size: 1.125rem;}
.about07 .about07_r .call p span{font-size: 3rem; font-weight: 700;}
.about07 .about07_r .consult{display: flex; justify-content: space-between; gap: 10px; padding-top: 30px;}
.about07 .about07_r .consult a{padding:5px 30px; background: #FFDE00;  font-size: 1.25rem; font-weight: 500; color: #4D2005; display: flex; align-items: center; justify-content: center; gap: 5px; transition: 0.3s;}
.about07 .about07_r .consult a img{margin-right: 5px;}
.about07 .about07_r .consult a:last-child img{width: 30px;}
.about07 .about07_r .consult a:hover{box-shadow: inset 0 3px 6px rgba(0,0,0,0.5),  0 1px 0 #000;}

@media (max-width:1499px){

  .con_inner form{width: 95%; margin: 0 auto;}
  .sub_tabs {justify-content: flex-start;}
}
@media (max-width:1279px){

  .pofol_main{overflow-x: hidden;}
  .detail_inner {width: 97%; margin: 0 auto;}
}
@media (max-width:1024px){
/* 포트폴리오 */
.image_grid {grid-template-columns: repeat(3, 1fr); gap: 15px;}
.scroll_guide{color: rgba(255,255,255,0.5); font-size: 0.75rem; text-align: right; padding-right: 20px; padding-bottom: 5px; pointer-events: none;}

/* 회사소개 */
.about_main{padding-top: 80px;}
.about01{ height: 100dvh; }
.about01_inner{ height: 100%; }
.about01_inner .title_txt{font-size: 5rem; top: 44%; letter-spacing: 0.2em;}
.about01_inner .content_txt ul li p.tit{font-size: 1.25rem;}
.about01_inner .content_txt ul li p{font-size: 0.9rem;}
.about01_inner .detail_txt{font-size: 1.6rem;}

.about02{ height: 100% !important; min-height: auto;}
.content .img_wrap > img:first-child { width: 80%; }
.line_yellow {top: 39%; right: 15%;}
.txt_co3 { top: 37%; right: -41%;}
.line_blue {bottom: -10%; left: 10%;}
.txt_co2 { bottom: -25%; left: -45%;}
.content .img_wrap .co1 { left: 40%;}
.content .img_wrap .co2 { left: 25%;}
.content .img_wrap .co3 { left: 64%;}

.about03{height: 70vh !important;}
.about03_inner .content_box ul {max-width: 835px;}
.about03_inner .content_box ul li{text-align: center; padding: 50px 0; background: #fff; max-width: 400px; border-radius: 20px;}

.about04{height: 70vh !important; }
.about04 .puzzle{ right: 10%; top: 20%;}
.about04 .puzzle img{max-width: 500px; }
.about04 .main_txt{position: absolute; bottom: 30%;}

.about05{width: 100%; height: 100% !important;}
.about05_inner .star{font-size: 2rem;}
.about05_inner .about05_con{flex-direction: column; width: 90%; margin: 0 auto; margin-bottom: 10px; height: 100%;}
.about05_inner .about05_con01 .con01_l ul{justify-content: center; gap: 10px;}
.about05_inner .about05_con01 .con01_l ul li{padding: 0;} 
.about05_inner .about05_con01 .con01_r{justify-content: center; margin-top: 20px;}
.about05_inner .about05_con02 ul{display: grid; grid-template-columns: repeat(3, 1fr); height: 700px;}

.about06_inner .bg03{ width: 140px; font-size: 1rem;} 
.about06_inner .bg02{width: 140px; font-size: 1rem;}

.about07_inner{flex-direction: column;}
.about07 .about07_l .map{width: 700px; margin: 0 auto;}
.about07 .about07_r {margin: 0 auto;}
}
@media (max-width:820px){
.about_main{padding-top: 76px;}
.about01{ height: 100dvh; }
.about01_inner{ height: 100%; }
.about01_inner .title_txt{font-size: 4rem; top: 44%; letter-spacing: 0.18em;}
.about01_inner .content_txt ul li p.tit{font-size: 1.1rem;}
.about01_inner .content_txt ul li p{font-size: 0.8rem;}
.about01_inner .detail_txt{font-size: 1.4rem;}

.content .img_wrap {left: 60%; font-size: 1.25rem;}
.content .img_wrap > img:first-child { width: 60%; }
.line_red {top: -8%; left: 9%;}
.txt_co1{top: -12%; left: -28%; font-size: 1rem;}
.line_yellow {top: 37%; right: 35%;}
.txt_co3 { top: 33%; right: -10%; font-size: 1rem;}
.line_blue {bottom: -10%; left: 13%;}
.txt_co2 { bottom: -42%; left: -35%; font-size: 1rem;}
.content .img_wrap .co1 { left: 31%;}
.content .img_wrap .co2 { left: 18%;}
.content .img_wrap .co3 { left: 47%;}

.about03{height: 80vh !important;}
.about03_inner .content_box ul {max-width: 733px;}
.about03_inner .content_box ul li{max-width: 350px; }

.about04 .puzzle{ right: 5%; top: 13%;}

.about05_inner .about05_con02 ul li:last-child img{width: 120px;}
.about05_inner .about05_con02 ul li:last-child .ISO02 {transform: translate(30px, -130px);}
.about05_inner .about05_con02 ul li:last-child h4 {transform: translateY(-98px);}

.about06_inner .ceo img{width: 40px;}
.about06_inner .bg03{ width: 100px; font-size: 1rem;} 
.about06_inner .bg02{width: 100px; font-size: 1rem;}

}
@media (max-width:768px){
.about01{ height: 100dvh; }
.about01_inner{ height: 100%; }
.about01_inner .title_txt{font-size: 3.2rem; top: 44%; letter-spacing: 0.15em;}
.about01_inner .content_txt ul li p.tit{font-size: 0.95rem;}
.about01_inner .content_txt ul li p{font-size: 0.72rem;}
.about01_inner .detail_txt{font-size: 1.2rem;}

.about03{height: 90vh !important;}
}

@media (max-width:767px){
  /* 콘택트 */
  .inquiry_tabs {gap: 5px;}
  .inquiry_tab_btn {padding: 10px 18px;  font-size: 0.875rem;}
  .radio_box {gap: 10px; padding: 15px;}
  .radio_item{width: auto;}
  .radio_item label {font-size: 0.875rem; padding: 8px 16px; width: auto; min-width: 100px;}
  .sub01.con_bg {height: 350px;}
  .con_inner{padding:0 0 50px 0;}
  .con_inner .form_txt{flex-direction: column; gap: 0;}
  .con_inner .form_txt textarea{width: 100%;}

  /* 포트폴리오 */
  .portfolio { padding:0; }
  .pofol_bg {height: 350px;}
  .pofol_bg .sub01_content{text-align: center;}
  .tab_menu { gap: 6px; margin-bottom: 30px; justify-content: center;}
  .tab_btn { padding: 10px 18px; font-size: 0.875rem;}
  .image_grid {grid-template-columns: repeat(2, 1fr); gap: 12px;}
  .main_tab_btn{padding: 10px 30px; font-size: 0.875rem;}
  .sub_tab_btn{padding: 8px 20px; font-size: 0.75rem;}
  .overlay_text {font-size: 1rem;}
  .overlay_category {font-size: 0.875rem;}
  /* 포트폴리오 디테일 */
  .detail_inner {flex-direction: column;}
  .detail_l {position: static; width: 100%; margin-bottom: 30px;}
  
  /* 회사소개 */
.about00 .about00_inner h1{font-size: 1.5rem;}
.about00 .about00_inner .sub_title{font-size: 1.25rem;}
.about00 .about00_inner .sub_title02{font-size: 1rem;}

.about01{height: auto !important; background: #151B26; padding: 60px 0;}
.about01_inner{max-width: 1400px; margin: 0 auto; color: #fff; height: auto; position: static; display: flex; flex-direction: column; align-items: center; padding: 0 20px;}
.about01_inner .title_txt{display: none;}
.about01_inner .center_txt{display: none;}
.about01_inner .content_txt{width: 100%;}
.about01_inner .content_txt ul{display: flex; flex-direction: column; position: static;}
.about01_inner .content_txt ul li{position: static; opacity: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,0.1); line-height: 1.5; margin: 0 auto;width: 210px;}
.about01_inner .content_txt ul li:last-child{border-bottom: none;}
.about01_inner .content_txt ul li img{display: none;}
.about01_inner .content_txt ul li p.tit{font-size: 1.5rem; font-weight: bold; padding-bottom: 0; padding-right: 0;}
.about01_inner .content_txt ul li p.tit .blue{font-size: 2rem; padding-right: 5px;}
.about01_inner .content_txt ul li p{font-size: 0.875rem; color: rgba(255,255,255,0.75); display: block;}
.about01_inner .detail_txt{position: static; transform: none; font-size: 1.5rem; font-weight: bold; margin-top: 40px; text-align: center;}
.about01_inner .detail_txt span{background: #fff; color: #333; padding: 0 5px;}

.about02{height: auto !important; padding: 60px 0;}
.about02_inner{padding: 0 20px 30px 20px;}
.about02_inner h3{font-size: 1.5rem !important;}
.content .img_wrap{position: relative; transform: none; display: block; width: 100%; max-width: 100%; top: auto; left: auto;}
.content .img_wrap .main_img{width: 100%; display: block; margin: 0 auto;}
.line_red, .line_yellow, .line_blue{display: none;}
.content .img_wrap .co1{position: absolute;  left: 38%; top: 24%;}
.content .img_wrap .co2{position: absolute; left:50%; top: 8%;}
.content .img_wrap .co3{position: absolute;  left: 67%; top: 24%;}
.txt_co1, .txt_co2, .txt_co3{position: static; transform: none; text-align: left; padding: 20px;}
.txt_co3{border-bottom: none;}
.label_tit01, .label_tit02, .label_tit03{font-size: 1.25rem !important; padding-bottom: 8px; text-align: center;}
.txt_co1 p, .txt_co2 p, .txt_co3 p{font-size: 0.875rem; line-height: 1.6; text-align: center;}

.about03{height: 100% !important;}
.about03_inner h3{font-size: 2rem !important;}
.about03_inner h3 img:first-child{width: 60px;}
.about03_inner h3 img:last-child{width: 30px;}
.about03_inner .sub_title{ width: 300px; font-size: 1.125rem; }
.about03_inner .content_box ul{display: flex; flex-direction: column; max-width:300px; justify-content: center;}
.about03_inner .content_box ul li{width: 300px; margin-bottom: 20px;}
.about03_inner .content_box ul li h4{font-size: 2rem;}
.about03_inner .content_box ul li p{font-size: 1rem;}
.about03_inner .content_box ul li:nth-child(even){transform: translateY(0px);}

/* about04 */
.about04 { height: auto !important; min-height: 100%; }
.about04_inner { position: relative; padding: 60px 20px; }
.about04 .puzzle { position: relative; right: auto; top: auto; text-align: center; }
.about04 .puzzle img { max-width: 280px; }
.about04 .main_txt { position: relative; bottom: auto; left: auto; padding: 30px 20px 0 20px; }

.about05_inner .star{font-size: 1.25rem;}
.about05_inner h3{font-size: 1.5rem !important; line-height: 1.5; text-align: center;}
.about05_inner .about05_con {display: flex; flex-direction: column; width: 95%; margin: 0 auto; gap: 50px; padding: 80px 0;}

.about05_inner .about05_con01 {display: flex; flex-direction: column; align-items: center; gap: 0px;}
.about05_inner .about05_con01 .con01_l {width: 100%; display: flex; flex-direction: column; align-items: center;}
.about05_inner .about05_con01 .con01_l h4 {display: table; width: auto; max-width: max-content; margin: 8px auto 5px; text-align: center; font-size: 0.8rem;}
.about05_inner .about05_con01 .con01_l ul {display: flex; gap: 15px; justify-content: center; flex-wrap: wrap;}
.about05_inner .about05_con01 .con01_l ul li {max-width: 100px; padding: 0px; height: auto; flex: 0 0 calc(33.333% - 10px); display: flex; flex-direction: column; align-items: center;}
.about05_inner .about05_con01 .con01_l ul li img {width: 100%; height: auto; border: 4px solid #646464; padding: 5px; background: #EFECE9; box-sizing: border-box;}
.about05_inner .about05_con01 .con01_l ul li:nth-child(2) img{ height: 133px;}
.about05_inner .about05_con01 .con01_r {width: 100%; display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; align-items: flex-start; transform: none;}
.about05_inner .about05_con01 .con01_r h4 {display: table; width: auto; max-width: max-content; margin: 8px auto 5px; text-align: center; font-size: 0.8rem;}
.about05_inner .about05_con01 .con01_r div {max-width: 100px; padding: 5px; height: auto; flex: 0 0 calc(33.333% - 10px); display: flex; flex-direction: column; align-items: center;}
.about05_inner .about05_con01 .con01_r div img {width: 100%; height: auto; border: 4px solid #646464; padding: 5px; background: #EFECE9; box-sizing: border-box;}
.about05_inner .about05_con02 {margin-top: 20px; display: flex; flex-direction: column; align-items: center; width: 95%;}
.about05_inner .about05_con02 ul {display: flex;flex-wrap: wrap;justify-content: center;align-items: flex-start;gap: 5px;height: auto;padding: 0;
  width: 100%; box-sizing: border-box;}
.about05_inner .about05_con02 ul li {position: relative; max-width: 100px; padding: 5px; flex: 0 0 calc(50% - 10px); height: auto; text-align: center; display: flex; flex-direction: column; align-items: center; overflow: hidden;}
.about05_inner .about05_con02 ul li h4 {display: table; width: auto; max-width: max-content; margin: 8px auto 5px; text-align: center; font-size: 0.8rem; color: #646464; font-weight: bold;}
.about05_inner .about05_con02 ul li img {width: 100%; height: auto; border: 4px solid #646464; padding: 5px; background: #EFECE9; object-fit: contain; display: block; box-sizing: border-box;}
/* .about05_inner .about05_con02 ul li h4 span{display: none;} */

.about05_inner .about05_con h4{padding: 10px 0;}
.about05_inner .about05_con02 ul li:last-child {overflow: hidden;  position: relative;  min-height: 185px;}
.about05_inner .about05_con02 ul li:last-child .ISO01,
.about05_inner .about05_con02 ul li:last-child .ISO02 {position: absolute;width: 62%; height: auto; border: 4px solid #646464; padding: 5px;  background: #EFECE9; object-fit: contain; box-sizing: border-box; margin: 0; display: block;}
.about05_inner .about05_con02 ul li:last-child .ISO01 {top: 6px;  left: 35px;}
.about05_inner .about05_con02 ul li:last-child .ISO02 {top: 175px; right: 33px;}
.about05_inner .about05_con02 ul li:last-child h4 {position: absolute; bottom: 16px; left: 0; right: 0; margin: 0; font-size: 0.7rem; color: #646464; font-weight: bold; transform: none;}

.about06_inner .ceo img{width: 30px;}
.about06_inner .about_line{margin: 10px auto;}
.about06_inner .dept ul li img{width: 30px;}
.about06_inner .bg03{ width: 55px; font-size: 0.75rem; height: 45px; border-radius: 10px;} 
.about06_inner .bg02{width: 55px; font-size: 0.75rem; height: 45px; border-radius: 10px;}

.about07 .about07_l .map{width: 100%;}
.about07 .about07_r .com_address p{font-size: 1rem;}
.about07 .about07_r .com_address p span{padding: 5px; font-size: 16px;}
.about07 .about07_r .consult{justify-content: space-around;}
.about07 .about07_r .consult a{padding:5px 10px;font-size: 1rem;}
}
@media (max-width:460px){
  .con_inner .form_btn{margin-top: 30px;}
  .radio_item01 label {font-size: 0.813rem;  padding: 7px 14px;}
}

@media (max-width:390px){
  .tab_btn {width: 160px; font-size: 0.75rem;}

.content .img_wrap .co1{ left: 38%; top: 22%; font-size: 0.875rem;}
.content .img_wrap .co2{left:50%; top: 8%; font-size: 0.875rem;}
.content .img_wrap .co3{ left: 67%; top: 22%; font-size: 0.875rem;}

.about04 .main_txt h3{font-size: 1.25rem !important;}
.about04 .puzzle{top: 10%; right: 2%;}
.about04 .main_txt .sub_txt {font-size: 0.875rem;}

.about06_inner .ceo img{width: 30px;}
.about06_inner .about_line{margin: 10px auto;}
.about06_inner .dept ul li img{width: 25px;}
.about06_inner .bg03{ width: 50px; font-size: 0.65rem; height: 40px; border-radius: 10px;} 
.about06_inner .bg02{width: 50px; font-size: 0.65rem; height: 40px; border-radius: 10px;}

.about07 .about07_r .com_address p{font-size: 0.875rem;}
.about07 .about07_r .com_address p span{padding: 5px 0; width: 85px;}
.about07 .about07_r .call p span{font-size: 2.5rem;}

}
@media (max-width:360px){
  .tab_btn {width: 140px;}
  .about00 .about00_inner h1{line-height: 1.3; padding-bottom: 30px; font-size: 1.25rem;}
  .about00 .about00_inner .sub_title{line-height: 1.3; padding-bottom: 10px; font-size: 1.125;}

.content .img_wrap .co1{ top: 20%;}
.content .img_wrap .co2{ top: 8%;}
.content .img_wrap .co3{ top: 20%; left: 68%;}

.about03_inner h3 img:first-child{width: 50px;}
}
@media (max-width:340px){
  .main_tabs{gap: 5px;}
.about00 .about00_inner .sub_title02 p{font-size: 0.875rem;}
 
.content .img_wrap .co1{ top: 20%;}
.content .img_wrap .co2{ top: 8%;}
.content .img_wrap .co3{ top: 20%;}
.about04 .main_txt h3{font-size: 1.125rem !important;}
.about04 .main_txt {bottom: 32%;}
.about04 .puzzle{right: 2%;}
.about04 .puzzle img{max-width: 250px;}
.about04 .main_txt .sub_txt {font-size: 0.875rem;}
}

/* LG 그램 등 세로 해상도가 높은 노트북 대응 */
@media (min-width: 1280px) and (max-height: 900px) {
  .about01_inner .title_txt {
    top: 42%;
  }
  .about01_inner .content_txt ul li:first-child { top: 48%; }
  .about01_inner .content_txt ul li:nth-child(2) { top: 14%; }
  .about01_inner .content_txt ul li:nth-child(3) { top: 48%; }
  .about01_inner .content_txt ul li:nth-child(4) { top: 18%; }
  .about01_inner .content_txt ul li:nth-child(5) { top: 48%; }
  .about01_inner .content_txt ul li:nth-child(6) { top: 13%; }
  .about01_inner .content_txt ul li:last-child   { top: 48%; }
  .about01_inner .detail_txt { bottom: 10%; }
}