@charset "utf-8";
/*  font-size: calc([minimum size] + ([maximum size] - [minimum size]) * ((100vw - [minimum viewport width]) / ([maximum viewport width] - [minimum viewport width])));*/
/*------
공통 
-------*/
.pageContent .sorry{background:#f0f0f0 ;border-radius:50px;height:600px;position: relative;margin-bottom:50px;}
.pageContent .sorry::after{display: block;content: '';background: url(../img/cont/slogan.png) center  no-repeat;position: absolute;top: 0;right: 0;left: 0;bottom: 0;opacity:.8;z-index: 0;filter: brightness(0) saturate(100%) invert(66%) sepia(5%) saturate(0%) hue-rotate(87deg) brightness(92%) contrast(92%);}

a.blueBtn{display: inline-flex;color: #fff;font-size:1.628rem;padding: 1.36rem 2.5rem;background-color: #3581fb;border-radius:2.5em;font-weight:600;justify-content: space-between;align-items: center;max-width: 540px;width: 100%;letter-spacing: -1px;}
a.blueBtn::after{content: '\f178';font-size: 18px;font-family: 'Font Awesome 6 Free';font-weight: 900;}
a.blueBtn span{margin:0 auto 0 3px;}

@media screen and (max-width:600px) {
a.blueBtn{font-size: 1.3rem;padding: 1.2rem 2.1rem;}
a.blueBtn span{display: none;}
}

.rbx>.sTle{margin-bottom: 60px;font-size: 1.25em;text-align: center;line-height: 1.2;}
.rbx>.sTle b{display: block;font-size: 2.4em;}
.rbx>.sTle em{font-style: normal;display: block;padding-top: 10px;}

.rbx .visionList h3 em{border-radius:7px;font-size: 0.81em;font-style: normal;width: 40px;height: 40px;padding: 0;line-height: 40px;}
.rbx .visionList h3{font-size: 2.0em;margin-bottom: 10px;letter-spacing: -1px;}
@media screen and (min-width:1025px) {
.rbx{background-color: #F8F8F8;border-radius:60px;padding: 80px;}

.rbx .vbarBx,
.rbx .barBxWrap{background-color:#fff;border: none;border-radius:40px;}
.rbx .rules *,
.rbx .vbarBx *,
.rbx .barBxWrap *{box-sizing: content-box !important;}
.rbx .sotong,
.rbx .rules,
.rbx .visStep{background-color:#fff;border-radius:40px;padding: 60px 70px;}
.rbx .visStep li:nth-child(even)::after{display: none;}
}
@media screen and (max-width:1024px) {
.rbx>.sTle{margin-bottom:40px;font-size: 1.15em;}
.rbx .visionList h3{font-size: 1.45em;margin-bottom: 0;}
.rbx .visionList h3 em{width: 30px;height: 30px;line-height: 30px;margin-bottom: 0;}
}
.depth_3{margin-bottom: 60px;text-align: center;}
.depth_3 ul{border-radius:10px;display: inline-flex;  justify-content: center;  gap:4px;margin-top: 15px;padding:9px;background-color: #fff;box-shadow: 0 2px 15px rgba(0, 0, 0, 0.13);}
.depth_3 li a{ display: flex; position: relative; height: auto; padding: 13px 19px; font-size: 1.13em; font-weight: 500; color: #666;-webkit-transition: all 0.2s linear; transition: all 0.2s linear; background: #f9f9f9; border-radius: 8px;}
.depth_3 li.on a,
.depth_3 li a:hover{color: #fff; font-weight: 700; background:#0758a7 ;}
@media screen and (max-width:680px) {
.depth_3 ul{display: flex;flex-wrap: wrap;}
.depth_3 li {flex: 0 0 calc((100% - 4px) / 2);}
.depth_3 li a{text-align: center;padding: 13px 0;justify-content: center;}
}

/*------
인사말
-------*/
.grTop{background-color: #edf1f5;border-radius:60px;overflow: hidden;height: 500px;position: relative;margin-bottom: 70px;}
.grTop::before{content: '';position: absolute;top: 0;bottom: 0;right: 0;width: 666px;background-color: #f00;background:  url(../img/cont/mayor.png) right -20px no-repeat;}
.grTop p{text-indent: -999em;}
.grTop p::before{content: '';position: absolute;top: 0;bottom: 0;width: 501px;left: 212px;background:  url(../img/cont/slogan.png) 0 center no-repeat;}

.grTxt{font-size: 1.5em/* 24px */;max-width: 1200px;margin: 0 auto;width: 95%;}
.grTxt p{line-height: 1.4;margin-bottom: 20px;word-break: keep-all;font-weight: 300;}
.grTxt .hd{font-size:/* 34px */ 1.42em;font-weight: 800;line-height: 1.2;letter-spacing: -1.2px;}


@media screen and (max-width:1440px) {
.grTop p::before{left: 5%;}
}
@media screen and (max-width:1200px) {
.grTop::before{width: 500px;background-position: 0 -20px;}
}
@media screen and (max-width:1024px) {
.grTop{height: 400px;}
.grTop p::before{width: 350px;background-size:100% auto;left: 9%;}
.grTop::before{width: 450px;background-position: 0 0;background-size:auto 120%;}
}
@media screen and (max-width:900px) {
.grTop{height: 370px;}
.grTop p::before{width:calc(340/900 * 100vw);background-size:100% auto;left: 8%;}
.grTop::before{width:calc(400/900 * 100vw);background-size:auto 100%;background-position: 0 0;}
}
@media screen and (max-width:600px) {
.grTop{height:280px;border-radius:30px}
.grTop::before{width:212px;background-size:auto 100%;background-position: 0 15px;}
.grTop p::before{width:230px}
.grTxt .hd{font-size:1.17em}
}
@media screen and (max-width:450px) {
.grTop{height:calc(280/450 * 100vw);}
.grTop p::before{width:calc(220/450 * 100vw);}
.grTop::before{background-position: 0 calc(10/450 * 100vw);width:calc(200/450 * 100vw);}
.grTxt{font-size: calc(18px + (22 - 18) * ((100vw - 300px) / (450 - 300)));}
}
/*------
걸어온길
-------*/
.storyGrid *{box-sizing: border-box;}
.storyGrid {display: grid;grid-template-columns: 1fr 1fr;gap: calc(40/1400 * 100%);width: 100%;margin-top: 2px;}
.leftColumn {display: flex;flex-direction: column;gap: 20px;}
.box {/* background-color: #fff; */border-radius: 50px;box-shadow: 0 0px 2px rgba(0, 0, 0, 0.3);display: flex;flex-direction: column;padding: 80px 20px 20px calc(80/680 * 100%);font-size: 1.5em;width: 100%;}
.storyGrid .box h3{font-size: 1.42em;font-weight: 700;margin-bottom: 25px;}
.storyGrid .box ul,.storyGrid .box li{list-style-type: none;margin: 0;padding: 0;}
.storyGrid .box li{margin-bottom: 15px;line-height: 1.25;}
.box-top-left {height: 500px;}
.box.box-bottom-left {height: 240px;box-shadow: none;background:url(../img/cont/story_cut.jpg) 0 0 no-repeat;background-size:cover;}
.box.box-right {height: 760px;box-shadow: none;background-color: #f8f8f8;}

@media (max-width: 1024px) {
.storyGrid {gap:20px}
.box {font-size: 1.25em;padding: 60px 20px 20px calc(60/600 * 100%);}

}
@media (max-width: 780px) {
.storyGrid {grid-template-columns: 1fr;}
.box.box-top-left,
.box.box-bottom-left,
.box.box-right {height: auto;min-height: 200px;}
.box {border-radius: 30px;padding: 40px 20px 25px calc(40/780 * 100vw);}
.storyGrid .box li{margin-bottom: 10px;}
 }
 @media (max-width:500px) {
 .box.box-bottom-left{height: calc(200/500 * 100vw);}
 .box{padding-left: calc(40/500 * 100vw);;}
 }
 
/*------
비전과목표
-------*/
.visionTop{background-color: #ccc;border-radius:60px;overflow: hidden;position: relative;margin-bottom: 69px;}
/*------
manifesto
-------*/
.visionTop:has(.manifestoTxt){}
.manifestoTxt{position: absolute;color: #fff;top: 0;bottom: 0;right: 0;width: 620px;display: flex;align-items: center;}
.manifestoTxt p{font-size: 3.37em;font-weight: 700;line-height: 1.2;}
.manifestoTxt em{display: block;font-size: 0.52em;font-style: normal;font-weight: normal;margin-bottom: 10px;}

@media (max-width:1400px) {
.manifestoTxt{width: 47%;}
.manifestoTxt{font-size: calc(11px + (16 - 11) * ((100vw - 900px) / (1400 - 900)));}
}
@media (max-width:800px) {
.visionTop:has(.manifestoTxt){border-radius:30px;margin-bottom: 35px;}
.manifestoTxt{width: 50%;}
}
@media (max-width:440px) {
.visionTop:has(.manifestoTxt){aspect-ratio:4 / 2;}
.visionTop:has(.manifestoTxt) img{height: 100%;position: relative;object-fit: cover;}
.manifestoTxt em{font-size: 0.7em;margin-bottom: 5px;}
.manifestoTxt{width: 57%;}
}

@media print {
.sb-slide,.sb-slidebar,.subNavWrap, .subTopTxtFade,.footer,.goTop,.tabNavWrap {display: none}
.pageDr{padding: 0;}
.pageContent{padding: 0;}
#sb-site.top-padding{padding: 0;box-shadow:none}
body{background-color: #fff;min-height: inherit;}
.conTit{padding: 0;font-size: 25px;}
table{margin: 0;}
td,th{font-size: 10pt;}
colgroup{display: none;}
}




