@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.overview .row{display:flex;align-items:center;margin-bottom:10px;border:1px solid #ccc;line-height:1.5em;}
.overview .row:last-child{margin-bottom:0;}
.overview .row .tit{width:275px;padding:0 10px;text-align:center;color: #333;font-weight:700;}
.overview .row .txt{position:relative;padding:20px 70px;min-width:0;width:1%;flex:1 1 auto;}
.overview .row .txt:before{content:'';width:1px;height:50%;background-color: #ccc;position: absolute;left:0;top:50%;transform:translateY(-50%);}

.greeting{display:flex;padding:0 75px;}
.greeting .tt-wrap{min-width:0;width:1%;flex:1 1 auto;margin-right:170px;}
.greeting .tt-wrap .tit{position:relative;padding-top:15px;margin-bottom:90px;font-size:var(--fz24);font-weight:800;line-height:1.42em;}
[lang = en] .greeting .tt-wrap .tit{margin-bottom:20px;}
.greeting .tt-wrap .tit:before{content:'';width:30px;height:4px;background-color:var(--pri);position: absolute;left:0;top:0;}
.greeting .tt-wrap .wrap p{margin-bottom:25px;letter-spacing:0;}
.greeting .tt-wrap .wrap p:last-child{margin-bottom:0;}
.greeting .tt-wrap .ceo{margin-top:25px;color: #333;font-weight:700;font-size:var(--fz18);text-align:right;}
.greeting .img img{border-radius:var(--bd30);}

.history{display:flex;}
.history .con{position:relative;min-width:0;width:1%;flex:1 1 auto;margin-right:60px;padding-top:40px;}
[lang = en] .history .con{margin-right:20px;}
[lang = en] .history .con:before{left:185px;height:94%;}
[lang = en] .history .con .row .year{width:185px;}
.history .con:before{content:'';width:1px;height:92%;background-color: #ccc;position: absolute;left:225px;top:60px;}
.history .con .row{display:flex;margin-bottom:60px;}
.history .con .row:last-child{margin-bottom:0;}
.history .con .row .year{position:relative;padding-left:40px;color:var(--pri);font-size:var(--fz40);font-weight:800;line-height:1.2em;width:225px;}
.history .con .row .year:before{content:'';width:20px;height:4px;background-color:var(--pri);position: absolute;left:0;top:.3em;}
.history .con .row .info{position:relative;padding-top:12px;padding-left:40px;min-width:0;width:1%;flex:1 1 auto;}
.history .con .row .info:before{content:'';width:16px;height:16px;background:url('/images/sub/history-bullet.png')no-repeat 50% 50%/contain;position: absolute;left:-8px;top:1.1em;}
.history .con .row .info ul li{display:flex;line-height:1.75em;margin-bottom:3px;}
.history .con .row .info ul li:last-child{margin-bottom:0;}
.history .con .row .info ul li .month{width:45px;font-size:var(--fz18);font-weight:800;color: #333;}
.history .con .row .info ul li .txt{min-width:0;width:1%;flex:1 1 auto;}
.history .img-wrap{text-align:right;}
.history .img-wrap .img{margin-bottom:55px;}
.history .img-wrap .img:last-child{margin-bottom:0;}

.ide ul{display:flex;justify-content:center;margin:0 -25px;}
.ide ul li{padding:0 25px;text-align:center;}
.ide ul li .cc{position:relative;}
.ide ul li .cc p{color: #fff;font-size: clamp(1rem, 0.4737rem + 2.1053vw, 3rem);position: absolute;left:0;top:50%;width:100%;transform:translateY(-50%);font-weight:800;line-height:1.2em;text-align:center;}
[lang = en] .ide ul li .cc p{font-size: clamp(0.875rem, 0.3816rem + 1.9737vw, 2.75rem);line-height:1.05em;}
.ide ul li .tt{margin-top:40px;font-size: clamp(0.875rem, 0.5132rem + 1.4474vw, 2.25rem);font-weight:700;color: #333;line-height:1.3em;}
.ide ul li .tt strong{font-size: clamp(1rem, 0.4737rem + 2.1053vw, 3rem);}
.ide ul li .tt .noto{font-size: clamp(0.8125rem, 0.5rem + 1.25vw, 2rem);font-weight:500;}

.ide-btm{margin-top:70px;}
.ide-btm .title{margin-bottom:45px;text-align:center;font-size:var(--fz36);color: #333;line-height:1.2em;}

.ideal{max-width:1000px;margin:0 auto;}
.ideal ul{display:flex;justify-content:center;margin:0 -20px;}
.ideal ul li{width:25%;text-align:center;padding:0 20px;}
.ideal ul li .ic{display:flex;justify-content:center;align-items:center;width:180px;height:180px;margin:0 auto 25px;border-radius:50%;background-color:var(--pri);}
.ideal ul li .wrap{position:relative;padding-bottom:25px;margin-bottom:15px;}
.ideal ul li .wrap:after{content:'';width:3px;height:10px;background-color:var(--pri);position: absolute;left:50%;margin-left:-1.5px;bottom:0;}
.ideal ul li .wrap .tit{margin-bottom:3px;font-size:var(--fz24);font-weight:800;color: #333;line-height:1.3em;}
.ideal ul li p{line-height:1.5em;}

.recruit .content{margin-bottom:80px;}
.recruit .content:last-child{margin-bottom:0;}
.doc-tit{margin-bottom:35px;}
.doc-tit .tit{position:relative;padding-left:30px;color: #333;font-size:var(--fz24);font-weight:800;line-height:1.3em;}
.doc-tit .tit:before{content:'';position: absolute;left:0;top:.2em;width:22px;height:22px;background:url('/images/sub/ic-tit.png')no-repeat 0 50%/contain;}
.table01 table{width:100%;border-spacing:0;text-align:center;border-top:1px solid var(--thr);line-height:1.6em;}
.table01 table thead th{height:60px;background-color: #f4fffa;color: #333;font-weight:700;}
.table01 table tbody td{height:110px;}
.table01 table th,
.table01 table td{padding:10px;border-right:1px solid #ccc;border-bottom:1px solid #ccc;}
.table01 table th:last-child,
.table01 table td:last-child{border-right:none;}

.recruit .content.cont2 .process ul{display:flex;flex-wrap:wrap;justify-content:center;margin:0 -32px -40px;}
.recruit .content.cont2 .process ul li{position:relative;text-align:center;padding:0 32px;margin-bottom:40px;}
.recruit .content.cont2 .process ul li:after{content:'';width:14px;height:22px;background:url('/images/sub/rec-arr.png')no-repeat 50% 50%/contain;position: absolute;right:-7px;top:70px;}
.recruit .content.cont2 .process ul li:last-child:after{display:none;}
.recruit .content.cont2 .process ul li .ic{display:flex;justify-content:center;align-items:center;width:160px;height:160px;margin:0 auto 15px;border-radius:50%;border:1px solid var(--thr);}
.recruit .content.cont2 .process ul li p{color: #333;font-weight:700;}

.recruit .content.cont3 .flex{display:flex;}
.recruit .content.cont3 .flex .col{display:flex;width:50%;padding-right:40px;}
.recruit .content.cont3 .flex .col .img{margin-right:55px;}
.recruit .content.cont3 .flex .col .tt-wrap{padding-top:5px;min-width:0;width:1%;flex:1 1 auto;letter-spacing:0;}
.recruit .content.cont3 .flex .col .tt-wrap .tit{position:relative;margin-bottom:10px;font-size:var(--fz18);font-weight:700;color: #333;line-height:1.4em;}
.recruit .content.cont3 .flex .col .tt-wrap .tit:before{content:'';width:6px;height:2px;background-color: #333;position: absolute;left:-16px;top:.6em;}
.recruit .content.cont3 .flex .col .tt-wrap p{margin-bottom:15px;}
.dot-list>li{position:relative;padding-left:10px;line-height:1.75em;}
.dot-list>li:before{content:'';width:4px;height:4px;border-radius:50%;background-color: #555;position: absolute;left:0;top:.6em;}

.facility .content{margin-bottom:70px;}
.facility .content:last-child{margin-bottom:0;}
.facility .content .imgs ul{display:flex;margin:0 -35px;}
.facility .content .imgs ul li{width:33.3333%;padding:0 35px;text-align:center;letter-spacing:0;}
.facility .content .imgs ul li .img img{border-radius:var(--bd16);}
.facility .content .imgs ul li .tit{margin-top:20px;color: #333;}
.facility .content .imgs.x2 ul{margin:0 -20px;}
.facility .content .imgs.x2 ul li{width:50%;padding:0 20px;}
.facility .content .imgs ul li .txt{margin:20px auto 0;max-width:150px;width:100%;}
.facility .content .imgs ul li .txt .tit2{position:relative;padding-bottom:15px;margin-bottom:15px;border-bottom:1px solid #ccc;font-weight:700;color: #333;}
.facility .content .imgs ul li .txt .wrap p{line-height:1.875em;}

.quality .flex{display:flex;margin:0 -20px;}
.quality .flex .col{width:50%;padding:0 20px;}
.quality .flex .col .img{margin-bottom:25px;}
.quality .flex .col .doc-tit{margin-bottom:15px;}

.quality .btm-content{margin-top:120px;}
.quality .btm-content .con{display:flex;margin:0 -20px;}
.quality .btm-content .con .col{width:50%;padding:0 20px;}
.quality .btm-content .con .col.right .row{margin-bottom:85px;}
.quality .btm-content .con .col.right .row:last-child{margin-bottom:0;}
.quality .btm-content .con .col.right .row .row-tit{display:flex;justify-content:center;align-items:center;width:100px;height:40px;border-radius:20px;margin:0 auto 50px;background-color:var(--pri);font-size:var(--fz20);font-weight:800;letter-spacing:0;line-height:1.2em;color: #fff;}
.quality .btm-content .con .col.right .row .list1 ul{display:flex;margin:0 -15px;}
.quality .btm-content .con .col.right .row .list1 ul li{width:33.3333%;padding:0 15px;text-align:center;}
.quality .btm-content .con .col.right .row .list1 ul li .cc{display:flex;justify-content:center;align-items:center;width:102px;height:102px;margin:0 auto 20px;border:2px solid var(--pri);border-radius:50%;}
.quality .btm-content .con .col.right .row .list1 ul li .circle{margin-bottom:clamp(0.625rem, 0.3783rem + 0.9868vw, 1.5625rem);text-align:center;}
.quality .btm-content .con .col.right .row .list1 ul li .cc p{font-size:var(--fz20);line-height:1.3em;font-weight:700;color: #333;}
.quality .btm-content .con .col.right .row .list1 ul li .cc p .noto{font-weight:600;}
.quality .btm-content .con .col.right .row .list1 ul li .tt{line-height:1.5em;}
.quality .btm-content .con .col.right .row .list2 ul li{display:flex;align-items:center;margin-bottom:25px;}
.quality .btm-content .con .col.right .row .list2 ul li .tit{display:flex;justify-content:center;align-items:center;width:90px;height:60px;margin-right:20px;border:2px solid var(--pri);border-radius:12px;text-align:center;}
.quality .btm-content .con .col.right .row .list2 ul li .tit p{color: #333;font-weight:700;line-height:1.25em;}
.quality .btm-content .con .col.right .row .list2 ul li .tit p small{font-size:var(--fz14);}
.quality .btm-content .con .col.right .row .list2 ul li .tt{min-width:0;width:1%;flex:1 1 auto;}
.quality .btm-content .con .col.right .row .list2 ul li:last-child{margin-bottom:0;}

.doc-list ul{display:flex;flex-wrap:wrap;margin:0 -13px -60px;}
.doc-list ul li{width:25%;padding:0 13px;margin-bottom:60px;text-align:center;}
.doc-list.radi ul li .img img{border-radius:var(--bd16);}
.doc-list ul li .tit{margin-top:20px;}

.esg .content{margin-bottom:70px;}
.esg .content.cont1{margin-bottom:90px;}
.esg .content:last-child{margin-bottom:0;}
.esg .content.cont1 .tt-wrap{text-align:center;margin-bottom:70px;color:#333;letter-spacing:0;}
.esg .content.cont1 .tt-wrap .tit{margin-bottom:15px;font-size:var(--fz24);font-weight:700;line-height:1.5em;}
.esg .content.cont1 .tt-wrap .tt{font-size:var(--fz18);font-weight:500;line-height:1.56em;}
.esg .content.cont1 .bg-cnt{padding:70px 100px 50px;background-color: #effff7;border-radius:var(--bd24);}
.esg .content.cont1 .bg-cnt .flex{display:flex;margin:0 -20px;}
.esg .content.cont1 .bg-cnt .flex .col{width:33.3333%;text-align:center;padding:0 20px;}
.esg .content.cont1 .bg-cnt .flex .col .tit{margin:20px 0 10px;font-size:var(--fz20);font-weight:700;line-height:1.4em;color: #309d00;}
.esg .content.cont1 .bg-cnt .flex .col p{line-height:1.5em;}

.esg .content.cont2 .tt{line-height:1.5em;}
.esg .content.cont3 ol li{display:flex;margin-bottom:7px;}
.esg .content.cont3 ol li:last-child{margin-bottom:0;}
.esg .content.cont3 ol li .num{display:flex;justify-content:center;align-items:center;margin-top:2px;width:20px;height:20px;border-radius:50%;margin-right:10px;color: #006835;line-height:1em;font-weight:800;background-color: #f2f2f2;}
.esg .content.cont3 ol li p{min-width:0;width:1%;flex:1 1 auto;}
.esg .content.cont4 .flex{display:flex;margin:0 -20px;}
.esg .content.cont4 .flex .col{width:33.3333%;padding:0 20px;}
.esg .content.cont4 .flex .col .box{display:flex;padding:40px;border:1px solid #ccc;border-radius:var(--bd24);height:100%;}
.esg .content.cont4 .flex .col .box .ic{margin-right:35px;}
.esg .content.cont4 .flex .col .box .wrap{min-width:0;width:1%;flex:1 1 auto;}
.esg .content.cont4 .flex .col .box .wrap .tit{margin-bottom:10px;font-size:var(--fz18);color: #333;line-height:1.4em;font-weight:800;}
.esg .content.cont4 .flex .col .box .wrap p{line-height:1.5em;}

.loc1 .content{margin-bottom:60px;}
.loc1 .content:last-child{margin-bottom:0;}
.loc1 .content .doc-tit dl{display:flex;margin-top:10px;}
.loc1 .content .doc-tit dl dt{color: #333;font-weight:700;margin-right:14px;}
.loc1 .content .con{display:flex;}
.loc1 .content .con .maps{margin-right:10px;min-width:0;width:1%;flex:1 1 auto;}
.loc1 .content .con .maps .root_daum_roughmap {width:100% !important; height:100% !important;}
.loc1 .content .con .maps .root_daum_roughmap .wrap_map {height:100% !important;}
.loc1 .content .con .maps .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.loc1 .content .con .maps .map_border{display:none;}
.loc1 .content .con .maps .roughmap_lebel_text:after {content:"본사"; font-size:12px; line-height:15px;}
.loc1 .content .con .maps.type2 .roughmap_lebel_text:after {content:"하이드로태커스";}
.loc1 .content .con .maps.type3 .roughmap_lebel_text:after {content:"(주)창인";}

[lang = en] .loc1 .content .con .maps .roughmap_lebel_text:after {content:"Headquarters";}
[lang = en] .loc1 .content .con .maps.type2 .roughmap_lebel_text:after {content:"HydroTechUS";}
[lang = en] .loc1 .content .con .maps.type3 .roughmap_lebel_text:after {content:"Changin Co., Ltd.";}

.loc2 .info{display:flex;margin-bottom:30px;}
.loc2 .info .col{display:flex;align-items:center;width:50%;padding-right:40px;letter-spacing:0;line-height:1.5em;}
.loc2 .info .col .ic{margin-right:20px;}
.loc2 .info .col dl dt{margin-bottom:3px;font-weight:700;color: #333;}
.loc2 .maps .root_daum_roughmap {width:100% !important; height:600px !important;}
.loc2 .maps .root_daum_roughmap .wrap_map {height:600px !important;}
.loc2 .maps .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.loc2 .maps .map_border{display:none;}
.loc2 .maps .roughmap_lebel_text:after {content:"보국강업"; font-size:12px; line-height:15px;}
[lang = en] .loc2 .maps .roughmap_lebel_text:after {content:"Bokuk Metal";}

.tech .content{margin-bottom:clamp(3.75rem, 2.7632rem + 3.9474vw, 7.5rem);}
.tech .content:last-child{margin-bottom:0;}