@charset "utf-8";
/* 포털사이트 */
.gray-noti { background: #f5f5f5; padding: 30px; margin-bottom: 30px; }
.gray-noti p { position: relative; font-weight: 300; line-height: 1.4em; letter-spacing: -.03em; color: #505050; padding-left: 33px;}
.gray-noti p::before { content: ""; position: absolute; left: 0; width: 23px; height: 23px; background: url(../images/sub/sub4-1-1-noti.png) center no-repeat; background-size: contain; top: 0;}

/* 개인정보처리방침 */
.privacy-wrap .group { margin-bottom: 35px; }
.privacy-wrap .group:last-child { margin-bottom: 0; }
.privacy-wrap h3 { font-size: 20px; font-weight: 600; color: #203a7b; line-height: 1.4em; margin-bottom: 16px; }
.privacy-wrap h3.clr { color: #505050;}
.privacy-wrap p { line-height: 1.8em; display: flex; gap: 5px;}
.privacy-wrap .pl { padding-left: 30px; margin-top: 35px; }
.privacy-wrap h4 { font-weight: 600; line-height: 1.3em; color: #505050; margin-bottom: 14px; }
.privacy-tbl-wrap { overflow: auto; margin: 15px 0;}
.privacy-tbl-wrap table { border-collapse: collapse; width: 100%; border-top: 1px solid #ddd;}
.privacy-tbl-wrap table tr { border-bottom: 1px solid #ddd;}
.privacy-tbl-wrap table tr th { background: #efefef; border-right: 1px solid #ddd; line-height: 1em; font-weight: 500; color: #505050; padding: 12px 5px;}
.privacy-tbl-wrap table tr th:last-child { border: none; }
.privacy-tbl-wrap table tr td { border-right: 1px solid #ddd; line-height: 1.6em; font-weight: 300; color: #505050; padding: 18px 5px; text-align: center;}
.privacy-tbl-wrap table tr td:last-child { border: none; }
.privacy-wrap .date { text-align: right; display: flex; justify-content: flex-end;}
.privacy-wrap .date span { display: block; text-align: left; line-height: 1.9em;}
.privacy-wrap .group ul { padding: 10px 0; padding-left: 20px; }
.privacy-wrap .group ul li { margin-bottom: 10px; }
.privacy-wrap .group ul li:last-child { margin-bottom: 0; }
.privacy-wrap p strong { font-weight: 600; padding-left: 20px;}
.privacy-wrap .primary {color: #203a7b;}
.privacy-wrap strong.primary {padding-left: 0;}

/* 공통 */
.sub-tab { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; margin-bottom: 80px; }
.sub-tab li { width: 180px; height: 56px; text-align: center;}
.sub-tab li a { display: flex; align-items: center; justify-content: center; line-height: 1.2em; font-size: 16px; font-weight: 500; letter-spacing: -.03em; color: #787878; height: 100%; border: 1px solid #ddd; border-radius: 12px;}
.sub-tab li.active a { color: #fff; background: #203a7b; border: 1px solid #203a7b;}
.sub-tab li a:hover{ background: #203a7b; border: 1px solid #203a7b; color: #fff;}
.subtit { line-height: 1em; font-size: 30px; font-weight: 600; color: #222; margin-bottom: 35px; }
.subtit.fx { display: flex; justify-content: space-between; align-items: center;}
.subtit.fx.bd { border-bottom: 1px solid #ddd; padding-bottom: 20px;}
.subtit.fx a { width: 180px; height: 48px; display: flex; align-items: center; border: 1px solid #ddd; border-radius: 24px; position: relative; font-weight: 500; line-height: 1.2em; color: #505050; padding-left: 20px; font-size: 16px; } 
.subtit.fx a::after { content: ""; position: absolute; right: 20px; top: 0; bottom: 0; margin: auto; background: url(../images/sub/download.png) center no-repeat; width: 13px; height: 16px; background-size: contain;}
.subbox { margin-bottom: 110px; }
.subbox.mg { margin-bottom: 0; }
.subtxt { font-size: 18px; font-weight: 400; line-height: 1.556em;}
.subtxt.clr { color: #222; font-weight: 500; }

/* 회장 인사말 */
.gt { display: flex; }
.gt .left { flex: 1 1 auto; min-width: 0; width: 1%; }
.gt .left h2 { font-size: 40px; font-weight: 700; line-height: 1.2em; color: #222; white-space: nowrap; margin-bottom: 40px;}
.gt .left p { margin-top: 30px; }
.gt .left h3 { font-size: 20px; font-weight: 300;  margin-top: 35px; color: #505050; }
.gt .left h3 strong { font-weight: 600; color: #222; padding-left: 20px; }

/* 역대회장 */
.person-wrap { display: flex; flex-wrap: wrap; gap: 30px; }
.person-wrap .box { width: calc(100%/3 - 20px); overflow: hidden;}
.person-wrap .box a { padding: 30px; display: flex; position: relative; }
.person-wrap .box a::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #ddd; border-radius: 12px; transition: .2s;}
.person-wrap .box a:hover::after { border-color: #203a7b;}
.person-wrap .box a:hover .view { background: #203a7b; border: 1px solid #203a7b; color: #fff; opacity: 1;}
.person-wrap .box .thumb { width: 49%; margin-right: 30px; }
.person-wrap .box .thumb>div {position:relative; padding-bottom:130%; overflow:hidden; border-radius: 12px; }
/* .person-wrap .box .thumb img {position:absolute; top:50%; left:50%; transition:.4s ease-in-out; transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -webkit-transform:translate(-50% , -50%); width:auto; height:auto !important; object-fit:contain;} */
.person-wrap .box .thumb img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.person-wrap .box .thumb>div::after { content:""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border-radius: 12px; border: 1px solid #ddd;}
.person-wrap .box .info {width: 51%; padding-top: 10px; }
.person-wrap .box .info h4 { line-height: 1em; font-weight: 600; color: #203a7b; margin-bottom: 12px; }
.person-wrap .box .info h3 { font-size: 18px; font-weight: 500; color: #222; line-height: 1.2em; margin-bottom: 6px; }
.person-wrap .box .info p { line-height: 1.8em; }
.person-wrap .box .view { position: absolute; width: 120px; height: 40px; right: 0; bottom: 0; border: 1px solid #ddd; border-radius: 12px 0 12px 0; display: flex; align-items: center; padding-left: 20px; font-size: 15px; font-weight: 400; color: #888; line-height: 1em; background: #f5f5f5; transition: .2s;}
.person-wrap .box .view span { font-size: 16px; font-weight: 700; display: inline-block; padding-left: 22px;}
.person-wrap .box .view2 { width: 40px; padding: 0; justify-content: center; opacity: 0; }

/* 설립목적 및 연혁 */
.hst-tab { display: flex; border: 1px solid #ddd; margin-bottom: 50px; }
.hst-tab li { flex: 1; border-right: 1px solid #ddd; position: relative;}
.hst-tab li::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 2px; background: #f9b40e; display: none;}
.hst-tab li a { height: 60px; display: flex; align-items: center; justify-content: center; font-size: 17px; font-weight: 500; color: #787878; text-align: center; padding: 0 4px; line-height: 1.2em;}
.hst-tab li.active::after { display: block;}
.hst-tab li.active a { color: #f9b40e;}
.hst-tab li:last-child { border-right: none;}
.hst-box li { display: flex; text-align: center; gap: 40px; }
.hst-left { width: 22%; font-size: 22px; font-weight: 700; letter-spacing: -.03em; line-height: 1em; color: #222222; border-bottom: 1px solid #ddd; padding: 30px 0; display: flex; align-items: center; justify-content: center;}
.hst-left.bdt { border-top: 2px solid #ddd;}
.hst-right { border-bottom: 1px solid #ddd; position: relative; padding: 30px 0; width: 78%;}
.hst-right.bdt { border-top: 2px solid #ddd;}
.hst-txtbox { position: relative; margin-bottom: 20px;}
.hst-txtbox:last-child { margin-bottom: 0;}
.hst-right .month { font-size: 16px; font-weight: 500; letter-spacing: -.03em; line-height: 1em; color: #222; padding-left: 30px; position: absolute; left: 0; top: 2px;}
.hst-right .month::before { content: ""; position: absolute; left: 0; top: 4px; width: 6px; height: 6px; border-radius: 100%; background: #ff8000;}
.hst-right .txt { font-size: 16px; font-weight: 300; letter-spacing: -.03em; line-height: 1.2em; color: #454545; padding-left: 90px; text-align: left;}
.hst-right .txt .img-fx { display: flex; gap: 21px; margin-top: 23px; flex-wrap: wrap;}
.hst-right .txt .img-fx .thumb { width: calc(100%/3 - 14px); }
.hst-right .txt .img-fx .thumb>div {position:relative; padding-bottom:65%; overflow:hidden; border-radius: 12px; }
.hst-right .txt .img-fx .thumb img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}

/* 일반회원사 */
.pt-tab { display: flex; justify-content: center; gap: 10px; margin-bottom: 80px; }
.pt-tab li { width: 120px; height: 48px; }
.pt-tab li a { display: flex; align-items: center; justify-content: center; line-height: 1em; font-size: 16px; font-weight: 500; letter-spacing: -.03em; color: #787878; height: 100%; border: 1px solid #ddd; border-radius:24px;}
.pt-tab li.active a { color: #fff; background: #203a7b; border: 1px solid #203a7b;}
.pt-tab li a:hover{ background: #203a7b; border: 1px solid #203a7b; color: #fff;}
.pt-list ul { display: flex; flex-wrap: wrap; gap: 40px 24px; }
.pt-list ul li { width: calc(100%/4 - 18px); }
.pt-list ul li a { border: 1px solid #ddd; border-radius: 12px; display: block; overflow: hidden;}
.pt-list ul li .thumb {position:relative; padding-bottom:53%; overflow:hidden;}
/* .pt-list ul li .thumb img {position:absolute; top:50%; left:50%; transition:.4s ease-in-out; transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -webkit-transform:translate(-50% , -50%); width:auto; height:auto !important; object-fit:contain;} */
.pt-list ul li .thumb img {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -webkit-transform:translateX(-50%, -50%); width:auto; height:auto !important; object-fit:contain;}
.pt-list ul li .tit { border-top: 1px solid #ddd; padding: 18px; line-height: 1.2em; font-size: 17px; font-weight: 500; color: #222; position: relative; background: #f5f5f5; transition: .2s;}
.pt-list ul li a:hover { border: 1px solid #203a7b;}
.pt-list ul li a:hover .tit { background: #203a7b; border-top: 1px solid #203a7b; color: #fff;}
.pt-list ul li a:hover .tit::after { content: ">"; position: absolute; right: 18px; top: 50%; font-weight: 700; font-size: 16px; color: #fff; line-height: 1em; transform: translateY(-50%);}

/* 회원가입 절차 */
.jn-list { display: flex; flex-wrap: wrap; margin-top: 70px;}
.jn-list li {position: relative; width: calc(100%/5); text-align: center; }
.jn-list li .tit { font-size: 18px; font-weight: 500; line-height: 1.2em; color: #222; margin-top: 23px;}
.jn-list li::after { content: ""; position: absolute; width: 8px; height: 14px; top: 0; bottom: 0; margin: auto; right: -4px; background: url(../images/sub/sub1-4-right.png) center no-repeat; background-size: contain;}
.jn-list li:last-child::after { display: none; }
.jn-txtbox>div { display: flex; margin-bottom: 8px;}
.jn-txtbox>div:last-child { margin-bottom: 0; }
.jn-txtbox>div strong { width: 105px; display: inline-block; position: relative; padding-left: 14px; line-height: 1.5em; font-size: 18px; font-weight: 500; color: #222; }
.jn-txtbox>div strong::before { content: ""; position: absolute; left: 0; top: 11px; width: 4px; height: 4px; border-radius: 4px; background: #aaa; }
.jn-txtbox>div span { flex: 1 1 auto; min-width: 0; width: 1%; font-size: 16px; line-height: 1.666em; font-weight: 400; }
.jn-txtbox p { font-weight: 400; position: relative; padding-left: 14px; margin-bottom: 10px;}
.jn-txtbox p:last-child { margin-bottom: 0; }
.jn-txtbox p::before {content: ""; position: absolute; left: 0; top: 10px; width: 4px; height: 4px; border-radius: 4px; background: #aaa; }
.jn-fx { display: flex; flex-wrap: wrap; gap: 30px; margin-top: 40px;}
.jn-fx .box { width: calc(100%/2 - 15px); border-radius: 12px; overflow: hidden; border: 1px solid #ddd;}
.jn-fx .box h3 { line-height: 1.3em; font-size: 24px; font-weight: 700; padding: 19px 40px; background: #f5f5f5; color: #222;}
.jn-fx .box .txtbox { padding: 27px 40px; }
.jn-fx .box .txtbox h4 { line-height: 1.5em; font-size: 18px; font-weight: 500; color: #222; margin-bottom: 18px; }
.jn-fx .box .txtbox p { margin-bottom: 6px; position: relative; padding-left: 28px; }
.jn-fx .box .txtbox p:last-child { margin-bottom: 0; }
.jn-fx .box .txtbox p::before { content: ""; position: absolute; left: 0; width: 16px; height: 11px; background: url(../images/sub/chk1.png) center no-repeat; background-size: contain; top: 7px;}
.jn-fx .box.clr2 { border-color: #24b1e6;}
.jn-fx .box.clr2 h3 { color: #fff; background: #24b1e6;}
.jn-fx .box.clr2 .txtbox p::before { background-image: url(../images/sub/chk2.png);}
.jn-fx .box.clr3 { border-color: #203a7b;}
.jn-fx .box.clr3 h3 { color: #fff; background: #203a7b;}
.jn-fx .box.clr3 .txtbox p::before { background-image: url(../images/sub/chk3.png);}
.jn-fx .box.clr4 { border-color: #f9b40e;}
.jn-fx .box.clr4 h3 { color: #fff; background: #f9b40e;}
.jn-fx .box.clr4 .txtbox p::before { background-image: url(../images/sub/chk4.png);}
.jn-tbl-wrap { overflow: auto;}
.jn-tbl { border-collapse: collapse; width: 100%; border-top: 1px solid #ddd;}
.jn-tbl tr { border-bottom: 1px solid #ddd;}
.jn-tbl tr th { background: #f5f5f5; text-align: left; line-height: 1em; padding: 21px 30px; font-size: 16px; font-weight: 500; line-height: 1em; color: #222; }
.jn-tbl.tc tr th { text-align: center; padding: 20px 10px; border-right: 1px solid #ddd;}
.jn-tbl.tc tr th:last-child {border: none;}
.jn-tbl tr td { padding-left: 30px; }
.jn-tbl.tc tr td { text-align: center; padding: 17px 10px; border-right: 1px solid #ddd;}
.jn-tbl.tc tr td:last-child { border: none;}
.jn-list2 { display: flex; border-radius: 12px; border: 1px solid #ddd; padding: 30px 0; margin-top: 20px;}
.jn-list2 li { text-align: center; width: calc(100%/3); border-right: 1px solid #ddd; padding: 18px 0;}
.jn-list2 li:last-child { border: none; }
.jn-list2 li .ctr { font-weight: 700; color: #24b1e6; margin-bottom: 7px; }
.jn-list2 li .tit { font-size: 18px; font-weight: 600; color: #222;}

/* 윤리헌장 */
.ethics h3 { text-align: center; font-size: 20px; font-weight: 500; line-height: 1.6em; color: #222; letter-spacing: -.04em; margin-bottom: 45px; }
.ethics .box { background: url(../images/sub/sub1-5-2-bg.jpg) center no-repeat; background-size: contain; padding: 6%; border: 2px solid #f9b40e;}
.ethics .box p { font-size: 17px; font-weight: 400; color: #222; letter-spacing: -.04em; line-height: 1.5em; margin-bottom: 30px;}
.ethics .box p strong { font-weight: 600; }
.ethics .box p:last-child { margin-bottom: 0; }

/* 주요활동 */
.ac-txtbox { text-align: center; border: 4px solid #203a7b; border-radius: 12px; padding: 60px 15px 55px; margin-bottom: 80px; }
.ac-txtbox h2 { line-height: 1.2em; font-size: 30px; font-weight: 600; letter-spacing: -.03em; color: #203a7b; margin-bottom: 20px; }
.ac-txtbox p { font-size: 17px; font-weight: 400; line-height: 1.8em;}
.ac-fx { display: flex; margin-bottom: 30px; }
.ac-fx:last-child { margin-bottom: 0; }
.ac-fx .left { width: 33.3333%; border-radius: 12px; overflow: hidden;}
.ac-fx .left.bd { border: 1px solid #ddd;}
.ac-fx .right { width: 66.6667%; padding-left: 80px; }
.ac-fx .right h3 { font-size: 24px; font-weight: 500; color: #222; line-height: 1.2em; margin-bottom: 22px;}
.ac-fx .right h3 .num { width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; color: #fff; line-height: 1em; background: #203a7b; border-radius: 8px 0 8px 0; margin-right: 15px; }
.ac-fx .right p { margin-bottom: 7px; position: relative; padding-left: 20px; }
.ac-fx .right p::before { content: ""; position: absolute; left: 0; top: 9px; width: 4px; height: 4px; border-radius: 4px; background: #aaa;}
.ac-fx .right p:last-child { margin-bottom: 0; }
.organ { text-align: center; }

/* CI 소개 */
.ci-big { border-radius: 12px; border: 1px solid #ddd; height: 300px; display: flex; align-items: center; justify-content: center; background: url(../images/sub/ci-bg.jpg) center no-repeat; background-size: cover;}
.ci-fx { display: flex; gap: 20px; margin-top: 20px;}
.ci-fx .ci-gray { flex: 1; padding: 50px 10px; text-align: center; border-radius: 12px; background: #f5f5f5;}
.ci-list { display: flex; border-radius: 12px; flex-wrap: wrap; overflow: hidden; margin-top: 30px;}
.ci-list.pd li { padding: 50px 10px;}
.ci-list li { width: calc(100%/3); text-align: center; color: #fff; padding: 28px 10px;}
.ci-list li.clr1 { background: #224795;}
.ci-list li.clr2 { background: #24b1e6;}
.ci-list li.clr3 { background: #fdbe19;}
.ci-list li .tit { font-size: 18px; font-weight: 700; letter-spacing: -.04em; line-height: 1.2em; margin-bottom: 12px; }
.ci-list li .txt { font-weight: 700; letter-spacing: -.04em; line-height: 1.2em; }

/* 찾아오시는 길 */
.mapbox { border-radius: 12px; overflow: hidden; margin-bottom: 50px; }
.lct { display: flex; align-items: flex-start;}
.lct-logo { width: 46%; padding-right: 25px;}
.lct .info { width: 64%; }
.lct .info .group { display: flex; margin-bottom: 24px; }
.lct .info .group:last-child { margin-bottom: 0; }
.lct .info .group .tit { display: flex; width: 150px; align-items: center; font-size: 20px; font-weight: 600; letter-spacing: -.03em; color: #222; line-height: 1.5em; gap: 20px;}
.lct .info .group .txt { flex: 1 1 auto; min-width: 0; width: 1%; font-size: 17px; line-height: 1.666em; font-weight: 400; color: #505050; }

/* 기술제품 리스트 */
.pd-tab { display: flex; border: 1px solid #ddd; border-bottom: none; flex-wrap: wrap; border-right: none; border-radius: 12px 0 0 0; margin-bottom: 40px; overflow: hidden;}
.pd-tab li { border-right: 1px solid #ddd; width: calc(100%/7); border-bottom: 1px solid #ddd; overflow: hidden;}
.pd-tab li a { height: 56px; display: flex; align-items: center; justify-content: center; line-height: 1.2em; font-size: 16px; font-weight: 500; color: #787878; overflow: hidden;}
.pd-tab li a:hover { color: #fff; background: #224795;}
.pd-tab li.active a { color: #fff; background: #224795;}
.pd-tab li:last-child { border-radius: 0 0 12px 0; }
.pd-schbox { padding: 27px 30px; background: #f5f5f5; border-radius: 12px; margin-bottom: 50px; }
.pd-schbox .group { display: flex; margin-bottom: 25px;}
.pd-schbox .group:last-child { margin-bottom: 0; }
.pd-schbox .group strong { width: 105px; line-height: 1.3em; font-weight: 500; color: #222; letter-spacing: -.03em; display: inline-block; padding-top: 2px;}
.pd-schbox .group .chk { flex: 1 1 auto; min-width: 0; width: 1%; }
.pd-schbox .group .chk .item { padding-right: 40px; }
.pd-schbox .group .chk .item:last-child { padding-right: 0; }
.pd-schbox .group .chk .item .checkbox label:before { background-color: #fff;}
.pd-schbox .group .chk .item .checkbox input:checked + label:before { background-color: #224795; border-color: #224795;}
.pd-section { padding: 30px 0; background: #203a7b; }
.pd-section .pd-swp { position: relative; width: 100%;}
.pd-swiper { width: 100%; position: relative; overflow: hidden; }
.pd-swp .swiper-wrapper {align-items: stretch;}
.pd-box { border-radius: 12px; overflow: hidden; position: relative; display: flex; flex-direction: column; height: auto; align-self: stretch;}
.pd-box a {position: relative; display: flex; flex-direction: column; height: 100%; flex: 1;}
.pd-box.bd a::after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; border: 1px solid #ddd; border-radius: 12px;}
.pd-box .thumb {position:relative; padding-bottom:65%; overflow:hidden;}
.pd-box .thumb img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.pd-box .txtbox { background: #fff; padding: 18px; position: relative; display: flex; flex-direction: column; padding-bottom: 20px; flex: 1;}
.pd-box .txtbox .logo { width: 48px; height: 48px; border-radius: 100%; border: 1px solid #ddd; position: absolute; right: 18px; top: -24px; overflow: hidden;}
.pd-box .txtbox .tit { line-height: 1.2em; font-size: 17px; font-weight: 600; color: #222; margin-bottom: 15px; }
.pd-box .txtbox .ctr { display: flex; gap: 5px; flex-wrap: wrap;}
.pd-box .txtbox .ctr span { width: 80px; height: 24px; border-radius: 12px; display: flex; align-items: center; justify-content: center; border: 1px solid #ddd; line-height: 1em; font-size: 14px; font-weight: 600; color: #787878; }
.pd-box .txtbox .name { text-align: right; font-size: 12px; font-weight: 600; color: #787878; position: absolute; right: 18px; bottom: 18px; line-height: 1em;}
.pd-prev::after, .pd-next::after { display: none; }
.pd-prev, .pd-next { margin-top: -11px; width: 12px; height: 22px; background-repeat: no-repeat; background-position: center; background-size: contain; }
.pd-prev { background-image: url(../images/sub/sub3-1-left.png); left: -70px;}
.pd-next { background-image: url(../images/sub/sub3-1-right.png); right: -70px; left: auto;}
.pd-list { display: flex; flex-wrap: wrap; gap: 28px;margin-top: 30px; align-items: stretch;}
.pd-list li { width: calc(100%/4 - 21px);}

/* 기술제품 상세리스트 */
.pd-list-fx { display: flex; background: #f5f5f5; align-items: center;}
.pd-list-fx .thumb { width: 61%; }
.pd-list-fx .thumb>div {position:relative; padding-bottom:40%; overflow:hidden;}
.pd-list-fx .thumb img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.pd-list-fx .info { width: 39%; padding: 0 60px;}
.pd-list-fx .info .tit-fx { display: flex; align-items: center; margin-bottom: 30px; }
.pd-list-fx .info .tit-fx .icon-area { width: 80px; height: 80px; border-radius: 100%; border: 1px solid #ddd; overflow: hidden;}
.pd-list-fx .info .tit-fx h2 { flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 15px; line-height: 1.2em; font-size: 40px; font-weight: 600; letter-spacing: -.03em; color: #222; }
.pd-list-fx .info .whitebox { background: #fff; border-radius: 12px; padding: 30px; }
.pd-list-fx .info .whitebox ul li { display: flex; margin-bottom: 10px;}
.pd-list-fx .info .whitebox ul li:last-child { margin-bottom: 0;}
.pd-list-fx .info .whitebox ul li .tit { width: 100px; line-height: 1.5em; font-weight: 600; color: #222; }
.pd-list-fx .info .whitebox ul li .txt { flex: 1 1 auto; min-width: 0; width: 1%; line-height: 1.556em; }
.pd-list-fx .info .whitebox ul li .txt a { text-decoration: underline; text-underline-position: under;}

/* 기술제품 상세페이지 */
.pd-view-tab { display: flex; padding: 50px 0; gap: 50px; flex-wrap: wrap;}
.pd-view-tab li { width: auto; display: inline-block; }
.pd-view-tab li a { display: inline-block; padding-bottom: 2px; line-height: 1.2em; font-size: 30px; font-weight: 700; color: #222; position: relative;}
.pd-view-tab li a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px; background: #222; display: none;}
.pd-view-tab li.active a::after { display: block;}
.pd-view-tab li .num { font-size: 18px;}
[data-tab-content] { display: none; }
[data-tab-content].active { display: block; }
.pd-project-fx { display: flex; align-items: flex-start;}
.pd-project-fx .left { width: 66.6666%;}
.pd-project-fx .right { width: 33.3334%; padding-left: 60px; }
.pd-project-fx .right h3 { border-bottom: 1px solid #888888; font-size: 24px; font-weight: 600; line-height: 1.2em; padding-bottom: 12px; margin-bottom: 25px; }
.pd-project-fx .right ul li { display: flex; margin-bottom: 10px; }
.pd-project-fx .right ul li:last-child { margin-bottom: 0; }
.pd-project-fx .right ul li .tit { width: 100px; line-height: 1.5em; font-weight: 600; color: #222; }
.pd-project-fx .right ul li .txt { flex: 1 1 auto; min-width: 0; width: 1%; line-height: 1.556em; }
.pd-project-fx .right ul li .ctr { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 20px;}
.pd-project-fx .right ul li .ctr span { width: 80px; height: 24px; border-radius: 12px; display: flex; align-items: center; justify-content: center; border: 1px solid #ddd; line-height: 1em; font-size: 14px; font-weight: 600; color: #787878; }
.pd-introduce { width: 100%; }

/* 기상기술인 */
.tn-fx { display: flex; align-items: center; background: #f8f8f8; border-radius: 12px; overflow: hidden; margin-bottom: 100px; }
.tn-fx .left { width: 46%; }
.tn-fx .right { width: 54%; padding-left: 60px; }
.tn-fx .right h3 { font-size: 24px; font-weight: 600; color: #222; line-height: 1.2em; margin-bottom: 18px; }
.tn-process { display: flex; flex-wrap: wrap; }
.tn-process li { width: calc(100%/4); text-align: center; }
.tn-process li .tit { font-size: 18px; line-height: 1.5em; color: #222; letter-spacing: -.04em; margin-top: 25px; font-weight: 600;}
.tn-process li .tit span { color: #24b1e6;}
.tn-graybox { padding: 35px 15px; border-radius: 12px; background: #f8f8f8; margin-top: 35px;}
.tn-graybox ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px 80px;}
.tn-graybox ul li { text-align: center; }
.tn-graybox ul li .tit { line-height: 1.3em; font-weight: 600; color: #222; font-size: 18px; margin-top: 20px; }
.tn-way { text-align: center; margin: 20px auto;}
.tn-field { display: flex; gap: 15px; }
.tn-field .tit { border-radius: 12px; background: #224795; color: #fff; text-align: center; padding: 20px 5px; line-height: 1.2em; font-size: 18px; font-weight: 700; letter-spacing: -.04em; margin-bottom: 10px; }
.tn-field .left { width: 24%;}
.tn-field .center { width: 44%;}
.tn-field .right { width: 32%;}
.tn-field .txtbox { border-radius: 12px; background: #f8f8f8; padding: 35px 15px; min-height: 365px;}
.tn-field .txtbox ul { display: flex; flex-wrap: wrap; gap: 9px 12px;}
.tn-field .txtbox ul li { text-align: center; width: 100%; }
.tn-field .center .txtbox ul li { width: calc(100%/3 - 8px);}
.tn-field .right .txtbox ul li { width: calc(100%/2 - 6px);}
.tn-list { display: flex; gap: 16px; flex-wrap: wrap; }
.tn-list li { width: calc(100%/2 - 8px); border-radius: 12px; overflow: hidden;}
.tn-list li .titbox { background: #224795; text-align: center; padding: 20px 15px 18px; color: #fff;}
.tn-list li .titbox .tit { line-height: 1.3em; font-size: 18px; font-weight: 700; margin-bottom: 10px;}
.tn-list li .titbox .tit2 { font-weight: 400; line-height: 1.3em;}
.tn-list li .txtbox { border: 1px solid #ddd; border-top: none; padding: 35px 40px; border-radius: 0 0 12px 12px; min-height: 315px;}
.tn-list li .txtbox strong { display: block; font-weight: 500; margin-bottom: 15px; }
.tn-list li .txtbox p { margin-bottom: 10px; }
.tn-list li .txtbox p:last-child { margin-bottom: 0; }
.tn-txt { margin-top: 15px; padding-left: 10px; }