@charset "utf-8";

/* [S]인사말 */
.greeting {margin-bottom: 15rem;}
.greeting .area {display: flex;gap: 5rem;padding: 0 6rem 0 0;}
.greeting .left {padding-top: 2rem;}
.greeting .tit {display: block;margin-bottom: 3rem;font-size: 4rem;font-family: pb;color: #003691;line-height: 1.25;}
.greeting .desc {font-size: 1.7rem;font-family: pm;color: #545454;}
.greeting .desc i {display: block;height: 3rem;}
.greeting .author {display: block;margin-top: 3rem;font-size: 2.5rem;font-family: pb;color: #1c1c1c;}
.greeting .right {flex-shrink: 0;}
.greeting .photo-wrap {position: relative;padding: 10rem 19.2rem 0 0;text-align: center;}
.greeting .photo-wrap::before {content: "";position: absolute;right: 0;top: 0;width: 51rem;height: 77rem;border-radius: 5rem;background: #0059b0 url(../../images/sub/bg-greeting-deco.png) no-repeat right -45% top 80% / 38rem;}
.greeting .photo-wrap .img-box {position: relative;width: 38rem;}
.greeting .photo-wrap .img-box img {position: relative;width: 100%;border-radius: 1rem;z-index: 1;box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.10);}
.greeting .photo-wrap .deco-txt {position: absolute;right: -4rem;top: 2.5rem;width: 100%;height: 43rem;border: 5px solid #00b3f2;}
.greeting .photo-wrap .deco-txt p {position: absolute;right: -42%;top: 45%;transform: rotate(90deg);color: #00b3f2;font-size: 1.8rem;font-family: pb;}
.greeting .photo-wrap .name {display: block;position: relative;margin-top: 1.5rem;font-size: 2rem;color: #fff;font-family: pb;}


@media screen and (max-width:1380px) {
  .greeting  {padding-bottom: 0;}
  .greeting .tit {font-size: 3.7rem;}
  .greeting .desc i {height: 2.5rem;}
  .greeting .photo-wrap {padding: 7rem 12rem 0 0;}
  .greeting .photo-wrap::before {width: 41rem;height: 65rem;border-radius: 4rem;background-position: right -220% top 80%;}
  .greeting .photo-wrap .img-box {width: 33rem;}
  .greeting .photo-wrap .deco-txt {height: 35rem;}
  .greeting .photo-wrap .deco-txt p {right: -42.5%;font-size: 1.6rem;}
  .greeting .photo-wrap .name {margin-top: 1.5rem;}
}

@media screen and (max-width:1024px) {
  .greeting {margin-bottom: 3rem;}
  .greeting .area {flex-direction: column-reverse;padding: 0;}
  .greeting .right {margin-bottom: 4.5rem;}
  .greeting .photo-wrap {max-width: 100%;margin: 0 auto;padding: 6rem 0 0;text-align: center;}
  .greeting .photo-wrap::before {height: 58rem;width: 100%;background-size: 40rem;background-position: right -5rem bottom -10rem;}
  .greeting .photo-wrap .img-box {display: inline-block;}
}

@media screen and (max-width:600px) {
  .greeting .left {padding-top: .8rem;}
  .greeting .tit {font-size: 3rem;}
  .greeting .desc i {height: 2rem;}
  .greeting .right {margin-bottom: 1vw;}
  .greeting .photo-wrap {max-width: 89vw;padding: 8vw 10vw 0 0;}
  .greeting .photo-wrap::before {width: 78vw;height: 112vw;right: 0;border-radius: 4vw;background-size: 70vw;background-position: right -130% top 154%;}
  .greeting .photo-wrap .img-box {width:70vw;}
  .greeting .photo-wrap .img-box img {width: 100%;}
  .greeting .photo-wrap .deco-txt {width: 59%;height: 73vw;top: 6.2vw;right: -8vw;}
  .greeting .photo-wrap .deco-txt p {right: -69%;top: 45%;font-size: 3.2vw;}
  .greeting .photo-wrap .name {margin-top: 1.5rem;}
}
/* [E]인사말 */

/* [S]원장약력 */
.profile {position: relative;padding: 5rem;background: #f2f4f8 url(../../images/sub/bg-profile.jpg) no-repeat right bottom / 150rem;border-radius: 1rem;}
.profile::before {content: '';position: absolute;width: 34rem;height: 27rem;right: 2rem;top: 1.4rem;background: url(../../images/sub/bg-profile-logo.png) no-repeat center / contain;}
.profile .area {position: relative;display: flex;}
.profile .left {flex-shrink: 0;}
.profile .img-box {text-align: center;}
.profile .img-box img {border-radius: 1rem;}
.profile .img-box .name {display: block;margin-top: 2rem;font-size: 2rem;color: #1c1c1c;font-family: pb;}
.profile .right {flex: 1;}
.profile .right .top {display: flex;gap: 6rem;width: 100%;max-width: 71.5rem;padding: 2rem 0 4rem 8rem;border-bottom: 1px solid #cccdce;}
.profile .right .top em {display: flex;justify-content: center;align-items: center;width: 10rem;height: 4rem;;background: #405379;border-radius: .5rem;font-size: 2rem;color: #fff;font-family: pb;}
.profile .right .top span {color: #1c1c1c;font-size: 2.2rem;font-family: pm;}
.profile .right .top > div {display: flex;align-items: center;gap: 1.5rem;}
.profile .info {padding: 4rem 0 0 8rem;}
.profile .info-list > li:first-child {margin-bottom: 2rem;}
.profile .info-list > li:nth-child(2) {margin-bottom: 4.5rem;}
.profile .info-list > li:last-child {margin-bottom: 0;}
.profile .info-list .tit {position: relative;display: block;margin-bottom: 2rem;padding-left: 1.4rem;font-size: 2.6rem;color: #0059b0;font-family: pb;}
.profile .info-list .tit::before {content: '';position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: .5rem;height: 2.4rem;background: #0059b0;border-radius: .2rem;}
.profile .dot-list li {display: flex;position: relative;padding-left: 1.5rem;margin-bottom: .8rem;}
.profile .dot-list li:last-child {margin-bottom: 0;}
.profile .dot-list li::before {content: '';position: absolute;left: 0;top: .9rem;width: .6rem;height: .6rem;background: #4c4c4c;border-radius: 50%;}
.profile .dot-list span {display: block;min-width: 10rem;font-size: 1.7rem;color: #1c1c1c;font-family: pm;}
.profile .info-list > li:first-child .dot-list span {min-width: 5rem;}
.profile .dot-list p {font-size: 1.7rem;color: #545454;font-family: pm;}

@media screen and (max-width: 1480px) {
  .profile::before {width: 30rem;height: 30rem;}
}

@media screen and (max-width: 1300px) {
  .profile .left  {width: 34rem;}
  .profile .right .top {max-width: 100%;padding: 2rem 0 4rem 6rem;gap: 4rem;}
  .profile .info {padding: 4rem 0 0 6rem;}
}

@media screen and (max-width: 1024px) {
  .profile {background-position: right bottom 10rem;}
  .profile .area {flex-direction: column;align-items: center;gap: 0;}
  .profile .right {width: 100%;}
  .profile .right .top {padding: 3rem 0 4rem;flex-direction: column;gap: 2rem;}
  .profile .info {padding: 4rem 0 0 0;}
}

@media screen and (max-width: 768px) {
  .profile .area {padding: 1.5rem 0 2rem}
}

@media screen and (max-width: 500px) {
  .profile {padding: 3rem;background-position: bottom 15rem right;background-size: 135rem;}
  .profile::before {top: 0;right: 2rem;} 
  .profile .area {flex-direction: column;align-items: center;}
  .profile .left {width: 100%;}
  .profile .img-box .name {margin-top: 1.7rem;font-size: 1.8rem;}
  .profile .right .top {padding: 3rem 0 3.5rem;flex-direction: column;}
  .profile .right .top em {width: 9rem;height: 3.8rem;border-radius: .5rem;font-size: 1.8rem;}
  .profile .right .top span {font-size: 2rem;}
  .profile .info {padding: 3rem 0 0;}
  .profile .info-list > li {margin-bottom: 4rem;}
  .profile .info-list .tit {margin-bottom: 1.2rem;padding-left: 1.2rem;font-size: 2.3rem;}
  .profile .info-list .tit::before {height: 2rem;border-radius: .4rem;}
}
/* [E]원장약력 */

/* [S]안보대 연혁 */
.trace .info-list {padding: 2.5rem 3rem;background: #ebf5ff;border-radius: 2rem;}
.trace .info-list > li {position: relative;display: flex;align-items: flex-start;padding-left: 2rem;margin-bottom: 2rem;}
.trace .info-list > li:last-child {margin-bottom: 0;}
.trace .info-list > li::before {content: '';position: absolute;left: 0;top: .9rem;width: .6rem;height: .6rem;border-radius: 50%;background: #04163b;}
.trace .info-list strong {position: relative;display: inline-block;width: 12.8rem;margin-right: 2rem;font-size: 1.7rem;font-family: psb;color: #05173c;flex-shrink: 0;}
.trace .info-list strong::after {content: '';position: absolute;right: 0;top: 50%;width: .2rem;height: 1rem;margin-top: -.5rem;background: #9abde0;}
.trace .info-list p {font-size: 1.7rem;font-family: pm;color: #545454;}
.trace .info-list .dep2 {padding-left: 1rem;margin-top: .8rem;}
.trace .info-list .dep2 li {position: relative;margin-bottom: .5rem;padding-left: 2rem;color: #777;font-family: pm;font-size: 1.7rem;}
.trace .info-list .dep2 li:last-child {margin-bottom: 0;}
.trace .info-list .dep2 li::before {content: '';position: absolute;left: 0;top: 1.1rem;width: .8rem;height: .2rem;background: #404040;}
.trace .info-list .noti {display: block;margin-top: .7rem;padding-left: 3.2rem;font-family: pm;font-size: 1.5rem;color: #0059b0;}

@media screen and (max-width:600px) {
  .trace .info-list > li {flex-direction: column;}
  .trace .info-list strong {margin-bottom: .8rem;}
  .trace .info-list strong::after {display: none;}
}
/* [E]안보대 연혁 */

/* [S]조직도 */
.org {padding: 9.7rem 15.8rem;font-family: pb;background: #f3f5f9;border-radius: 1rem;color: #fff;;}
.org .area {padding: 0 !important;}
.org .dep1 {position: relative;z-index: 2;}
.org .dep1::before {content: "";position: absolute;left: -.5px;bottom: -25rem;width: 50%;height: 25rem;background: #f3f5f9;}
.org .dep1 .box {position: relative;}
.org .dep1 .box strong {display: block;text-align: center;max-width: 80rem;margin: 0 auto;padding: 2.75rem 3rem;font-size: 3rem;background: url(../../images/sub/bg-org-box.jpg) repeat center / cover;border-radius: 1rem;}

.org .dep2 {position: relative;max-width: 80rem;padding: 4rem 0 3rem;z-index: 1;margin: 0 auto;}
.org .dep2::before {content: '';position: absolute;left: 50%;margin-left: -.5px;top: 0;height: 12.7rem;width: 1px;background: #aaa;}
.org .dep2::after {content: '';display: block;clear: both;}
.org .dep2 .box {position: relative;width: 100%;max-width: 30rem;float: right;}
.org .dep2 .box::before {content: '';position: absolute;left: -100%;top: 50%;width: 100%;height: 1px;margin-top: -.5px;background: #aaa;}
.org .dep2 .box strong {position: relative;display: block;width: 100%;padding: 1.3rem 2rem;color: #fff;font-family: pm;font-size: 2rem;border-radius: 1rem;background: #8691af;text-align: center;z-index: 1;}

.org .dep3 {position: relative;z-index: 3;}
.org .dep3::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 1px;background: #aaa;}
.org .dep3 > ul {display: flex;justify-content: space-between;gap: 4rem;}
.org .dep3 .box {position: relative;padding-top: 3rem;width: 100%;;max-width: 30rem;}
.org .dep3 .box::before{content: '';position: absolute;left: 50%;top: 0;width: 1px;height: 4rem;margin-left: -.5px;background: #aaa;}
.org .dep3 .box:first-child::after {content: '';position: absolute;left: 0;top: -1rem;width: 50%;height: 12rem;margin-left: -.5px;background: #f3f5f9;}
.org .dep3 .box:last-child::after {content: '';position: absolute;right: 0;;top: -1rem;width: 50%;height: 12rem;margin-right: -.5px;background: #f3f5f9;}
.org .dep3 .box strong {position: relative;display: block;width: 100%;padding: 1.3rem 2rem;color: #0055ac;font-family: pm;font-size: 2rem;border: 2px solid #0055ac;border-radius: 1rem;background: #fff;text-align: center;z-index: 1;}

@media screen and (max-width:1400px) {
  .org {padding: 9.7rem 10rem;}
  .org .dep2 .box {max-width: 28rem;}
}

@media screen and (max-width:1024px) {
  .org {padding: 9.7rem 10rem;}
  .org .dep2 .box {max-width: 22rem;}
}

@media screen and (max-width:768px) {
  .org {padding: 7.7rem 4rem;}
  .org .dep1 .box strong {padding: 1.9rem;font-size:  2.4rem;}
  .org .dep2::before {height: 12rem;}
  .org .dep2 .box {width: 40%;}
  .org .dep2 .box strong {padding: 1.1rem;font-size: 1.8rem;}
  .org .dep3 > ul {gap: 3rem;}
  .org .dep3 .box strong {padding: 1.1rem;font-size: 1.8rem;}
}
/* [E]조직도 */

/* [S] 찾아오시는 길 */
.location-map {position: relative;}
.location-map .img-box {overflow:hidden; border-radius:1rem;}
.location-map .img-box img {width:100%;}
.location-map .text-box {position: relative; margin: -5rem 5rem 0 5rem; padding:1.5rem 5rem; background:#1d398d url('../../images/sub/bg-pattern.png') repeat; border-radius:1rem;}
.location-map .box-inner {display: flex; justify-content: space-between; flex-wrap:wrap;}
.location-map ul {display: flex; align-items: center; margin:1.5rem 0;}
.location-map li {margin-right: 6rem;}
.location-map li:last-child {margin-right: 2rem;}
.location-map li p {position: relative; display: flex; align-items: center; font-family: pm; font-size: 2rem; color:#fff;}
.location-map li p::before {content:''; display: inline-block; flex-shrink: 0; margin-right:1.5rem;}
.location-map li.icon1 p::before {width:3rem; height:3.4rem; background:url('../../images/sub/ic-location1.png') no-repeat center / cover;}
.location-map li.icon2 p::before {width:3.5rem; height:3.5rem; background:url('../../images/sub/ic-location2.png') no-repeat center / cover;}
.location-map li strong {position: relative; padding-left: 1.7rem;}
.location-map li strong::before {content:''; position: absolute; left:0; top:50%; width:0.2rem; height:1.5rem; margin-top:-0.7rem; background:#271d1f;}
.location-map .link {position: relative; display: flex; gap:0 1rem; margin:1.5rem 0;}
.location-map .link a {display: flex; align-items: center; min-width:13rem; height:4rem; padding:0.9rem 3rem 0.9rem 1.2rem; background:#fff url('../../images/sub/ic-location-arrw.png') no-repeat right 1.6rem center; border-radius:0.5rem;}
.location-map .link a span {display: inline-block; text-indent: -9999rem; flex-shrink:0;}
.location-map .link a:first-child span{width: 7.6rem; height:2.1rem; background:url('../../images/sub/ic-naver.png') no-repeat center / contain;}
.location-map .link a:last-child span{width: 8.4rem; height:2.2rem; background:url('../../images/sub/ic-kakao.png') no-repeat center / cover;}
.location-map .link a:hover {background:#36c0c9 url('../../images/sub/ic-location-arrw-on.png') no-repeat right 1.6rem center;}
.location-map .link a:first-child:hover span {background:url('../../images/sub/ic-naver-on.png') no-repeat center / cover;}
.location-map .link a:last-child:hover span {background:url('../../images/sub/ic-kakao-on.png') no-repeat center / cover;}
@media screen and (max-width:1200px) {
  .location-map .text-box {padding:2rem 3rem;}
  .location-map ul {flex-wrap:wrap;}
  .location-map li {margin-right: 2rem;}
  .location-map li strong {font-size: 1.6rem;}
}
/* @media screen and (max-width:1100px) {
.location-map .box-inner {flex-direction: column;}
.location-map li {margin-bottom: 2rem;}
} */
@media screen and (max-width:850px) {
  .location-map .text-box {margin:-3rem 2rem 0 2rem;}
}
@media screen and (max-width:768px) {
  .location-map ul {flex-direction: column; align-items: start; margin:1rem 0;}
  .location-map ul li {margin-bottom: 2rem;}
  .location-map ul li:last-child {margin-bottom: 0;}
  .location-map .link {margin: 1rem 0;}
  .location-map li.icon1 p::before {width:3.5rem; background-size:contain;}
}
/* [E] 찾아오시는 길 */