@charset "utf-8";

/***********************/
/*인사말*/
.intro_wrap .titl-st01{padding-bottom:0;}
.intro_wrap .titl-st01 .box{align-items:flex-start;padding-left:0; padding-right:280px; }
.intro_wrap .titl-st01 .box:before{display:none; }
.intro_wrap .titl-st01 .box:after{width: 220px; height: 220px; border:0; border-radius: unset;background:url(/resources/_Img/Templet/tmpl/uc_g.png) no-repeat;background-position: center center; bottom: unset; top:0; background-size: contain;opacity: 0.05 }
.intro_wrap .titl-st01 .box .titl,
.intro_wrap .titl-st01 .box .subs{text-align:start; }
.intro_wrap .titl-st01 .box .titl:before{left:0; }
.intro_wrap .titl-st01 .box .titl:after{right:unset; left:30px;}

.intro_wrap .img_box{width: 100%; height: 350px; border-radius: 30px; overflow: hidden;margin-bottom: 70px;  }
.intro_wrap .img_box img{width: 100%; height: 100%; object-fit:cover; }

.intro_wrap .intro_box{display: flex; flex-direction: row; gap: clamp(34px,3vw,52px); box-sizing:border-box;margin-bottom:70px }
.intro_wrap .intro_box .item{border: 3px dashed #ddd; border-radius: 30px;  padding:68px clamp(36px,3vw,50px) 40px clamp(36px,3vw,50px); position:relative; width: 33.3%; box-sizing: border-box; }
.intro_wrap .intro_box .item h4{color:#fff; font-family: 'oneMobileT'; font-weight: 300; font-size: 24px; width: 74px; height: 74px; border-radius:26px; display:flex; justify-content:center; align-items:center; position: absolute; top: -37px; left: clamp(36px,3vw,50px)}
.intro_wrap .intro_box .item p{font-family: 'oneMobileT';font-size: clamp(26px,2.6vw ,30px); font-weight: 300; line-height: 1.2;}
.intro_wrap .intro_box .item span{font-size: 18px; color:#666; margin-top: 28px; line-height: 1.2; display: block; }
.intro_wrap .intro_box .item1 h4{background: #0EA2A4; }
.intro_wrap .intro_box .item1 p{color:#0EA2A4; }
.intro_wrap .intro_box .item2 h4{background: #0EA063; }
.intro_wrap .intro_box .item2 p{color:#0EA063; }
.intro_wrap .intro_box .item3 h4{background:#005767; }
.intro_wrap .intro_box .item3 p{color:#005767; }

.intro_wrap .slog_box{width: 100%;padding: 76px 30px; border:10px solid transparent; border-radius: 30px; background:linear-gradient(#ffffff, #ffffff) padding-box,linear-gradient(to right, #0EA2A4, #ABCD05) border-box;display: flex; flex-direction: column; justify-content: center; align-items: center; font-family: 'oneMobileT' ;row-gap: 12px; box-sizing:border-box; text-align: center; line-height: 1.22;  margin-bottom: 120px; }
.intro_wrap .slog_box span{color: #005767; font-size: 26px; font-weight: 100;}
.intro_wrap .slog_box h4{color: #0EA2A4; font-size: 40px; font-weight: 100; }

.intro_wrap .goal_box{}
.intro_wrap .goal_box dl{display:flex; flex-direction: row; align-items: stretch; }
.intro_wrap .goal_box dl:not(:last-child){border-bottom: 1px dashed #ddd; }
.intro_wrap .goal_box dl dt{width: 30%;border-right: 1px solid #ddd; padding: 30px 8px; }
.intro_wrap .goal_box dl dt h6{font-size: 24px; font-family:'oneMobileT';margin-bottom: 8px; }
.intro_wrap .goal_box dl dt span{display:block; text-transform: uppercase; font-size: 16px; font-family: 'pretendard';}
.intro_wrap .goal_box dl dd{width: 70%; padding: 30px 24px; }
.intro_wrap .goal_box dl dd p{font-size: 18px; position: relative; padding-left: 28px; }
.intro_wrap .goal_box dl dd p:before{content:''; display:block; width:5px; height: 5px; border-radius: 50%; background: #0fa3a3; position:absolute; top: 7px; left: 0; }
.intro_wrap .goal_box dl dd p:not(:last-child){margin-bottom: 12px; }
.intro_wrap .goal_box dl.item1 dt h6{color:#0EA2A4}
.intro_wrap .goal_box dl.item2 dt h6{color:#0EA063}
.intro_wrap .goal_box dl.item3 dt h6{color:#005767}

/*조직도*/
.org_wrap .org1{border:10px solid transparent; border-radius: 30px; background:linear-gradient(#ffffff, #ffffff) padding-box,linear-gradient(to right, #0EA2A4, #ABCD05) border-box;width: 100%; max-width: 400px;padding:36px 20px; display:flex; flex-direction:column ;font-family: 'oneMobileT';margin: 0 auto 70px auto; position:relative; }
.org_wrap .org1:after{content:''; display: block; width: 1px; height: 80px; background:#ddd; position: absolute; top:100%; left:50%; transform: translateX(-50%); z-index: -1; }
.org_wrap .org1 p{color:#0EA2A4; font-size: 34px; width: fit-content; margin: auto; }
.org_wrap .org1 p span{display:block; color:#005767; font-size:30px; margin-bottom: 4px; }
.org_wrap .org2{display:flex; flex-direction: row; gap: 20px; position:relative; align-items:stretch;padding-top: 60px; margin-bottom: 120px;}
.org_wrap .org2:before{content:''; display:block; width: calc(75% + 16px ); height: 1px; background:#ddd; position: absolute; top:0; left:50%; transform: translateX(-50%)}
.org_wrap .org2 .item{position: relative; width: 25%; }
.org_wrap .org2 .item:before{content:''; display: block; width: 1px; height: 60px; background:#ddd; position: absolute; top: -60px; left: 50%; transform: translateX(-50%)}
.org_wrap .org2 .item .team{border: 2px dashed #ddd; border-radius: 20px; position:relative; }
.org_wrap .org2 .item .team h4{font-family:'oneMobileT';font-weight: 100;  color:#333; font-size: clamp(22px, 2vw, 28px);width: 100%; display: flex; justify-content:center; align-items:center;padding: 60px 10px 32px 10px; border-top-left-radius: 20px; border-top-right-radius: 20px; }
.org_wrap .org2 .item .team h4 span{font-family:'oneMobileT';font-weight: 100; color:#fff; font-size: 22px; display:flex; justify-content:center; align-items:center; width:76px; height: 76px; border-radius: 30px;position:absolute; top:-38px; left: 30px; }
.org_wrap .org2 .item1 .team h4{background:rgba(14, 162, 164, 0.1) }
.org_wrap .org2 .item1 .team h4 span{background:#0EA2A4; }
.org_wrap .org2 .item2 .team h4{background:rgba(14, 160, 99, 0.1)}
.org_wrap .org2 .item2 .team h4 span{background:#0EA063; }
.org_wrap .org2 .item3 .team h4{background:rgba(0, 87, 103, 0.1)}
.org_wrap .org2 .item3 .team h4 span{background:#005767; }
.org_wrap .org2 .item .team ol{display:flex; flex-direction: column; justify-content:flex-start; align-items:center; gap: 12px;padding: 20px 12px;min-height: 88px; }
.org_wrap .org2 .item .team ol li{font-family: 'oneMobile'; font-size:18px; }
.org_wrap .org2 .item .team:after{content:''; display: block; width: 1px; height: 22px; background: #888; position: absolute; left:50%; transform: translateX(-50%); }
.org_wrap .org2 .item .part{background: #fafafa; padding: 30px 28px; border-radius: 30px;margin-top: 22px;position: relative; }
.org_wrap .org2 .item .part:before,
.org_wrap .org2 .item .part:after{content:''; display:block; width: 7px; height: 7px; background:#888;position:absolute; top: -25px; left: 50%; transform: translateX(-50%); border-radius: 50%; }
.org_wrap .org2 .item .part:after{top: -4px}
.org_wrap .org2 .item .part p{color:#333; font-family: 'pretendard'; padding-left: 14px;position: relative; font-size: 20px; line-height: 1.2; }
.org_wrap .org2 .item .part p:not(:last-child){margin-bottom: 12px;}
.org_wrap .org2 .item .part p:before{content:''; display:block;width: 4px; height: 4px; background:#999; border-radius: 50%; position: absolute; top:9px; left:0; }
.org_wrap .tbl-type01 tbody tr td:nth-child(1){font-weight: 600; }


/*비전*/
.vision_wrap .list{display:flex; flex-direction: row; gap: 20px;margin-bottom: 50px;padding-bottom: 50px; border-bottom: 1px dashed #ddd; }
.vision_wrap .list .item{width: calc(33.3%); background: #f9f9f9; border-radius: 20px; padding:clamp(32px, 3vw,52px) clamp(40px, 3vw,60px); line-height: 1.2; }
.vision_wrap .list .item .img_box{width:120px; height: 110px; margin: 0 auto 30px auto;  }
.vision_wrap .list .item .img_box img{width: 100%; height: 100%; object-fit:contain; object-position:center center; display:block; }
.vision_wrap .list .item span{font-family: 'oneMobileT'; font-size: clamp(22px,2vw,26px); font-weight: 100; margin-bottom: 4px; }
.vision_wrap .list .item1 span{color: #0EA2A4}
.vision_wrap .list .item2 span{color: #0EA063}
.vision_wrap .list .item3 span{color: #005767}
.vision_wrap .list .item h3{font-family:'oneMobileT'; font-size: clamp(22px,2vw,26px); font-weight: 100;  color:#333; margin-bottom: 30px; }
.vision_wrap .list .item p{font-family: 'oneMobile'; font-size: clamp(18px,1.8vw,20px); }

.vision_wrap .str_list{display:grid; column-gap: 60px; row-gap: 20px;  grid-template-columns: clamp(280px, 20vw, 320px) 1fr}
.vision_wrap .str_list .titl{font-size:34px; font-family: 'oneMobileT'; text-align:center; display:flex; justify-content:center; align-items:center; height: 100%; border-radius: 30px; background: #fafafa; position:relative;  grid-row: 1/4; line-height: 1.3; }
.vision_wrap .str_list .titl:after{content:''; display:block;width: 200px; height: 200px; position: absolute; top:0; right:0; background: url(/resources/_Img/Templet/tmpl/uc_g.png); background-repeat: no-repeat; background-size: contain; background-position: center center; opacity:0.03 }
.vision_wrap .str_list .item{position: relative; background-origin: border-box; background-clip: content-box, border-box;border:1px solid transparent; border-top:0; border-radius:30px; background-image:linear-gradient(#fff, #fff),linear-gradient(to bottom, #ddd 0, #ddd 100%);}
.vision_wrap .str_list .item:before,
.vision_wrap .str_list .item:after{content:''; display:block; width:16px; height: 4px; border-radius: 25rem; background:#00f; position: absolute; top:50%; left: -40px;  }
.vision_wrap .str_list .item:before{transform:translateY(calc(-50% - 10px)) rotate(45deg)}
.vision_wrap .str_list .item:after{transform:translateY(-50%) rotate(-45deg)}
.vision_wrap .str_list .item h3{padding:26px 30px 22px 30px;  width: 100%; color: #fff; font-family:'oneMobileT'; font-size: 32px; font-weight: 100; text-align:center; border-top-left-radius: 30px; border-top-right-radius: 30px;}
.vision_wrap .str_list .item .box{max-width: 660px; margin:40px auto;  }
.vision_wrap .str_list .item .box ul{counter-reset: rounded;padding: 0 30px}
.vision_wrap .str_list .item .box ul li{font-size: 22px; color:#666;display:flex; flex-direction:row; line-height: 1.2; }
.vision_wrap .str_list .item .box ul li:not(:last-child){margin-bottom: 12px; }
.vision_wrap .str_list .item .box ul li:before{content:counter(rounded, decimal-leading-zero); counter-increment:rounded; font-family:'oneMobileT'; font-size: 18px; font-weight: 100;  border-radius: 25rem; margin-right: 20px;display:inline-flex;  justify-content:center; align-items:center; color:#fff; min-width: 56px; height:30px; margin-top: -1px;}

.vision_wrap .str_list .item1 h3,
.vision_wrap .str_list .item1 .box ul li:before,
.vision_wrap .str_list .item1:before,
.vision_wrap .str_list .item1:after{background:#0EA2A4}
.vision_wrap .str_list .item2 h3,
.vision_wrap .str_list .item2 .box ul li:before,
.vision_wrap .str_list .item2:before,
.vision_wrap .str_list .item2:after{background:#0EA063}
.vision_wrap .str_list .item3 h3,
.vision_wrap .str_list .item3 .box ul li:before,
.vision_wrap .str_list .item3:before,
.vision_wrap .str_list .item3:after{background:#005767}


@media screen and (max-width: 991px){
	/*인사말*/
	.intro_wrap .titl-st01 .box{padding-right: 180px; }
	.intro_wrap .img_box{height: 300px; }
	.intro_wrap .intro_box{ gap:20px ;  }
	.intro_wrap .intro_box .item{padding: 48px 28px 32px 28px;}
	.intro_wrap .intro_box .item h4{left: 28px; font-size: 20px; width: 64px; height: 64px; border-radius: 20px }
	.intro_wrap .intro_box .item p{font-size: 22px; }
	.intro_wrap .intro_box .item p br{display:none;}
	.intro_wrap .intro_box .item span{margin-top: 18px; font-size: 16px; }
	.intro_wrap .slog_box span{font-size:20px  }
	.intro_wrap .slog_box h4{font-size:clamp(34px,4vw,40px); }

	/*조직도*/
	.org_wrap .org1{padding: 24px 20px; max-width: 340px; margin-bottom: 50px; }
	.org_wrap .org1 p{font-size: 28px; }
	.org_wrap .org1 p span{font-size: 22px;}
	.org_wrap .org1:after{height: 60px; }
	.org_wrap .org2 .item .team h4 span{height: 36px; top: -18px; left: 50%; transform:translateX(-50%); font-size: 18px; }
	.org_wrap .org2 .item .team h4{padding:34px 10px 20px 10px; font-size: 20px; }	
	.org_wrap .org2 .item .team ol{gap: 4px;padding: 15px 12px; }
	.org_wrap .org2 .item .team ol li,
	.org_wrap .org2 .item .part p{font-size: 16px; }
	.org_wrap .org2 .item .part{padding: 26px; border-radius: 15px; }

	/*비전*/
	.vision_wrap .list .item{padding:26px }
	.vision_wrap .list .item .img_box{width: 80px; height: 80px; }
	.vision_wrap .list .item h3{font-size: 20px; }
	.vision_wrap .list .item p{font-size: 17px; }
	.vision_wrap .str_list{grid-template-columns: 200px 1fr; }
	.vision_wrap .str_list .titl:after{width: 120px; height: 120px}
	.vision_wrap .str_list .titl,
	.vision_wrap .str_list .item h3{font-size: 26px; }
	.vision_wrap .str_list .item .box ul li{font-size: 18px }
	.vision_wrap .str_list .item .box ul li:before{font-size: 14px; min-width: 44px; height: 24px;margin-top:0; }


	
}

/***************************************/
/***************************************
768px == 2제목사이즈 20px & 본문사이즈 16px & gap 20px
****************************************/
/***************************************/

@media screen and (max-width: 768px){
	/*인사말*/
	.intro_wrap .titl-st01 .box{padding-right: 30px; }
	.intro_wrap .intro_box{flex-direction: column; gap: 46px; margin-bottom: 50px}
	.intro_wrap .intro_box .item{width: 100%; padding-top: 44px; }
	.intro_wrap .intro_box .item span{margin-top: 8px; }
	.intro_wrap .slog_box{padding-top: 56px; padding-bottom: 56px;  margin-bottom: 80px;}
	.intro_wrap .goal_box dl{flex-direction: column; }
	.intro_wrap .goal_box dl dt{width: 100%; border-right:0; display:flex; flex-direction: row; align-items: baseline; gap: 8px; padding:16px 0 8px 0}
	.intro_wrap .goal_box dl dt h6{margin-bottom:0; }
	.intro_wrap .goal_box dl dt span{color:#9a9a9a; }
	.intro_wrap .goal_box dl dd{width:100%; padding:0 0 24px 12px;  }
	.intro_wrap .goal_box dl dd p{font-size: 16px; padding-left: 18px; }
	.intro_wrap .goal_box dl dd p:not(:last-child){margin-bottom: 6px; }
	.intro_wrap .goal_box dl dd p:before{top: 12px; }

	/*조직도*/
	.org_wrap .org1 p span{margin-bottom: -5px; }
	.org_wrap .org2{flex-wrap: wrap; gap: 40px 20px;margin-bottom: 80px}
	.org_wrap .org2:before{width: calc(50% + 8px); }
	.org_wrap .org2 .item{width: calc(50% - 10px); }
	.org_wrap .org2 .item:nth-child(n+3):before{display:none;}

	/*비전*/
	.vision_wrap .list{flex-direction: column; }
	.vision_wrap .list .item{width: 100%; display:grid; grid-template-columns:80px 1fr; column-gap: 40px;}
	.vision_wrap .list .item .img_box{grid-row: 1/ 4 ; margin: auto;}
	.vision_wrap .list .item span{margin-bottom:0; }
	.vision_wrap .list .item h3{margin-bottom: 12px; }
	.vision_wrap .list .item p{grid-column: 2/3}
	.vision_wrap .str_list{grid-template-columns: 1fr;gap:20px 0; }
	.vision_wrap .str_list .titl{grid-row: 1/1 ; grid-column: 1/3;  padding: 30px;}
	.vision_wrap .str_list .item{grid-column: 1/3;}
	.vision_wrap .str_list .item h3{padding-top: 12px; padding-bottom: 10px; }
	.vision_wrap .str_list .item .box{margin-top: 26px; margin-bottom: 26px; }
	.vision_wrap .str_list .item:before,
	.vision_wrap .str_list .item:after{display: none; }


}

@media screen and (max-width: 575px){
	
	/*인사말*/
	.intro_wrap .intro_box{margin-bottom: 30px; }
	.intro_wrap .img_box{height: 260px; }
	.intro_wrap .slog_box{border:0; border-radius: 0; background:linear-gradient(to right, #0EA2A4, #ABCD05); width: calc(100% + 60px); margin-left: -30px; margin-right: -30px ; 
	margin-bottom: 60px;padding: 40px 26px;}
	.intro_wrap .slog_box span{color:#fff; font-family: 'oneMobile'; font-weight: 400; font-size: 18px} 
	.intro_wrap .slog_box h4{color:#fff; font-size: 28px; }

	/*조직도*/
	.org_wrap .org2:before,
	.org_wrap .org2 .item:before{display:none; }
	.org_wrap .org2{padding-top:0; }
	.org_wrap .org2 .item{width: 100%; }
	.org_wrap .org2 .item .team h4{font-size: 18px; padding: 30px 10px 12px 10px; }
	.org_wrap .org2 .item .team ol{min-height: unset; }

	/*비전*/
	.vision_wrap .list .item .img_box{margin-top:0; }
	.vision_wrap .list .item p{margin-top: 20px; grid-column: 1/ 3; }

}


@media screen and (max-width: 425px){
	
	/*비전*/
	.vision_wrap .list .item{display:flex; column-gap:0; position:relative;flex-direction: column; }
	.vision_wrap .list .item .img_box{display:none; }
	.vision_wrap .list .item span{width: 40px; height:30px;border-radius: 8px; color:#fff;display:flex; justify-content:center; align-items:center; font-size: 18px; }
	.vision_wrap .list .item1 span{background: #0EA2A4;}
	.vision_wrap .list .item2 span{background: #0EA063;}
	.vision_wrap .list .item3 span{background: #005767;}
	.vision_wrap .list .item h3{margin-top: 8px; margin-bottom: 0; }
	.vision_wrap .str_list .item .box ul li{flex-direction: column; align-items:flex-start;gap:4px; }
	.vision_wrap .str_list .item .box ul li:not(:last-child){margin-bottom: 16px; }
}