@charset "UTF-8";


body.mobile-gnb-open,
body.sitemap-open{overflow:hidden}

/* **************************************** *
 * layout
 * **************************************** */
 .ply-layout{display:flex; flex-direction:column; position:relative; height:100%; box-sizing:border-box}


 /* **************************************** *
 * header
 * **************************************** */
#ply-header{position:absolute; top:0; left:0; right:0; height:10rem; background-color:var(--ply-color-light-gray-0);  z-index:9; box-sizing:border-box}
#ply-header .header-inner{display:flex; align-items:center; width:140rem; height:10rem; margin:0 auto; box-sizing:border-box}
#ply-header #logo{display:inline-flex; align-items:center; z-index:9}
#ply-header #logo a{display:block; width:15.6rem; height:4.4rem; background:url("../img/layout/logo-top.svg") no-repeat 50% 50%; background-size:15.6rem 4.4rem}

/* gnb */
#gnb{position:absolute; top:0; right:0; left:0; background-color:var(--ply-color-light-gray-0); overflow:hidden}
#gnb .gnb-inner{display:flex; align-items:center; justify-content:center; position:relative; width:140rem; margin:0 auto; box-sizing:border-box}
#gnb .gnb-inner .gnb-menu{display:flex; align-items:center}
#gnb .gnb-inner .gnb-menu > li > a{display:flex; align-items:center; justify-content:center; position:relative; height:10rem; margin:0 2.8rem; box-sizing:border-box}
#gnb .gnb-inner .gnb-menu > li > a:before{content:''; position:absolute; left:50%; bottom:1rem; width:0; height:0.4rem; background-color:#00664f; transition:all .10s ease}
#gnb .gnb-inner .gnb-menu > li > a > span{color:var(--ply-color-light-gray-95); font-family:'FlightSans','PretendardGOV'; font-size:1.9rem; font-weight:300; letter-spacing:-0.05rem; transition:all .35s ease}
#gnb .gnb-inner .gnb-menu > li.active > a:before{width:100%; margin-left:-50%}
#gnb .gnb-inner .gnb-menu > li.active > a span{color:#0f5747}

#gnb .gnb-depth{display:none; flex-direction:column; position:absolute; left:0; right:0; top:100%; padding-top:4rem; background-color:var(--ply-color-light-gray-0); box-sizing:border-box}
#gnb .gnb-depth.active{display:flex}
#gnb .gnb-depth .depth-fx{display:flex; align-items:center; justify-content:center; position:relative}
#gnb .gnb-depth .depth-fx:before{content:''; position:absolute; top:50%; left:0; right:0; height:1px; background-color:var(--ply-color-light-gray-10);}
#gnb .gnb-depth .depth-fx .depth1-tit{display:flex; flex-direction:column; position:relative; padding:0 6rem; background-color:var(--ply-color-light-gray-0)}
#gnb .gnb-depth .depth-fx .depth1-tit .tit{line-height:4.1rem; color:#202020; font-family:'FlightSans','PretendardGOV'; font-size:3.5rem; font-weight:300; letter-spacing:-0.2rem}

#gnb .gnb-depth .depth-menu{flex:1; padding:4rem 4rem 8rem; box-sizing:border-box}
#gnb .gnb-depth .depth-menu .depth-list{display:flex; flex-wrap:wrap; justify-content:center; margin-left:-2.5rem; margin-top:-3rem}
#gnb .gnb-depth .depth-menu .depth-list .depth-align{width:20%}

#gnb .gnb-depth .depth-menu .depth-box{display:flex; flex-direction:column; margin-left:2.5rem; margin-top:3rem}
#gnb .gnb-depth .depth-menu .depth-box .depth2-box{display:flex; align-items:center; justify-content:center; position:relative; height:6.8rem; padding:0 2rem; background-color:#f2f7f6; border:1px solid #f2f7f6; border-radius:1.2rem; overflow:hidden; transition:all .15s ease; box-sizing:border-box}
#gnb .gnb-depth .depth-menu .depth-box .depth2-box.blank:after{content:'\f0f4'; position:relative; top:-1px; margin-left:0.5rem; color:#0f5747; font-family:remixicon; font-size:1.5rem; font-weight:normal; transition:all .15s ease}
#gnb .gnb-depth .depth-menu .depth-box .depth2-box strong{display:inline-flex; flex-direction:column; align-items:center; color:var(--ply-color-light-gray-90); font-size:1.6rem; font-weight:300; transition:all .15s ease}
#gnb .gnb-depth .depth-menu .depth-box .depth2-box span{color:var(--ply-color-light-gray-60); font-size:1.6rem; font-weight:normal}
#gnb .gnb-depth .depth-menu .depth-box .depth2-box strong,
#gnb .gnb-depth .depth-menu .depth-box .depth2-box span{display:inline-flex; position:relative; line-height:1.5em; letter-spacing:-0.06rem}
#gnb .gnb-depth .depth-menu .depth-box .depth2-box:hover{background:#00664f}
#gnb .gnb-depth .depth-menu .depth-box .depth2-box:hover.blank:after{color:#8fe7c8}
#gnb .gnb-depth .depth-menu .depth-box .depth2-box:hover strong{color:#fff}

#gnb .gnb-depth .depth-menu .depth3-box{display:flex; flex-direction:column; padding:2rem 1rem}
#gnb .gnb-depth .depth-menu .depth3-box a{display:flex; align-items:center; position:relative; padding:0.8rem 0; padding-left:1.2rem}
#gnb .gnb-depth .depth-menu .depth3-box a:before{content:''; position:absolute; left:0; top:1.5rem; width:0.4rem; height:2px; background-color:var(--ply-color-light-gray-95)}
#gnb .gnb-depth .depth-menu .depth3-box a.blank:after{content:'\f0f4'; position:relative; top:-1px; margin-left:0.5rem;  color:#0f5747; font-family:remixicon; font-size:1.5rem; font-weight:normal}
#gnb .gnb-depth .depth-menu .depth3-box a span{line-height:1.6rem; color: var(--ply-color-light-gray-95); font-size:1.6rem; font-weight:300; letter-spacing:-0.02rem}
#gnb .gnb-depth .depth-menu .depth3-box a:hover span{color:#a47e4f}

#gnb .gnb-inner .gnb-menu > li:nth-child(3) .gnb-depth .depth-menu .depth-list .depth-align{width:16.666666%}

.gnb-overlay{display:none; position:fixed; top:0; right:0; bottom:0; left:0; background-color:rgba(0,0,0,.5); z-index:1}
.gnb-overlay.active{display:block}


/* 전체메뉴, 모바일메뉴 */
.allgnb-handle{position:absolute; right:50%; top:2.5rem; margin-right:-70rem}

.allgnb-handle .sitemap-open{display:flex; flex-direction:column; justify-content:center; align-items:flex-end; gap:0.7rem; position:relative; width:5rem; height:5rem; background:none; border:0; cursor:pointer; box-sizing:border-box}
.allgnb-handle .sitemap-open:before,
.allgnb-handle .sitemap-open:after{content:''; width:3rem; height:0.3rem; background:#00664f}
.allgnb-handle .sitemap-open strong{width:2.2rem; height:0.3rem; background:var(--ply-color-light-gray-95)}
.allgnb-handle .sitemap-open:hover:before,
.allgnb-handle .sitemap-open:hover:after{width:2.2rem}
.allgnb-handle .sitemap-open:hover strong{width:3rem}

.allgnb-handle .allgnb-open{display:none; flex-direction:column; justify-content:center; align-items:flex-end; gap:0.7rem; position:relative; width:5rem; height:5rem; background:none; border:0; cursor:pointer; box-sizing:border-box}
.allgnb-handle .allgnb-open:before,
.allgnb-handle .allgnb-open:after{content:''; width:3rem; height:0.3rem; background:var(--ply-color-light-gray-95)}
.allgnb-handle .allgnb-open strong{width:2.2rem; height:0.3rem; background:var(--ply-color-light-gray-95)}
.allgnb-handle .allgnb-open:hover:before,
.allgnb-handle .allgnb-open:hover:after{width:2.2rem}
.allgnb-handle .allgnb-open:hover strong{width:3rem}

.allgnb-handle .allgnb-close{display:none}

.allgnb-handle .sitemap-open:before,
.allgnb-handle .sitemap-open:after,
.allgnb-handle .sitemap-open strong,
.allgnb-handle .allgnb-open:after,
.allgnb-handle .allgnb-open strong{transition:all .20s ease}


/* sitemap-layer */
.sitemap-layer{display:none; position:absolute; top:0; left:0; right:0; height:100vh; background:#fff; overflow:auto; z-index:99}
.sitemap-layer.active{display:block}
.sitemap-layer .sitemap-wrap{display:flex; flex-direction:column; position:relative; width:140rem; margin:0 auto; padding:8rem 0; box-sizing:border-box}

.sitemap-layer .sitemap-top{display:flex; flex-direction:column; margin-bottom:3rem; box-sizing:border-box}
.sitemap-layer .sitemap-top .top-logo{display:inline-flex; position:relative; width:18rem; height:5.1rem; margin:0 auto; background:url("../img/layout/logo-top.svg") no-repeat 50% 50%; background-size:18rem 5.1rem}
.sitemap-layer .sitemap-top .top-tit{margin-top:6rem}
.sitemap-layer .sitemap-top .top-tit .tit{display:flex; align-items:center; gap:0.4rem; line-height:1.2em; color:var(--ply-color-light-gray-90); font-family:FlightSans; font-size:3.5rem; font-weight:300; letter-spacing:-0.08rem}
.sitemap-layer .sitemap-top .top-tit .tit:before{content:'\f3d1'; position:relative; margin-left:0.5rem; color:var(--ply-color-light-gray-90); font-family:remixicon; font-size:4.2rem}

.sitemap-layer .sitemap-depth{display:flex; gap:2rem}
.sitemap-layer .sitemap-depth .depth-group{display:flex; flex-direction:column; flex:1; padding:2rem; background-color:var(--ply-color-light-gray-0); border:1px solid var(--ply-color-light-gray-10); border-radius:2.2rem; box-sizing:border-box}
.sitemap-layer .sitemap-depth:has(> .depth-group:nth-child(1):last-child) .depth-align{width:33.333333%}
.sitemap-layer .sitemap-depth:has(> .depth-group:nth-child(2):last-child) .depth-align{width:50%}

.sitemap-layer .sitemap-depth .depth-fx{display:flex; justify-content:center; position:relative; margin-top:1rem}
.sitemap-layer .sitemap-depth .depth-fx .depth1-tit{display:flex}
.sitemap-layer .sitemap-depth .depth-fx .depth1-tit .tit{line-height:1.2em; color:var(--ply-color-light-gray-90); font-family:FlightSans; font-size:2.8rem; font-weight:300; letter-spacing:-0.1rem; text-align:center}
.sitemap-layer .sitemap-depth .depth-group:hover{background-color:#f2f7f6; border:1px solid #c7e3dd}
.sitemap-layer .sitemap-depth .depth-group:hover .depth1-tit .tit{color:#0f5747}

.sitemap-layer .sitemap-depth .depth-container{flex:1; padding:5rem 0 0}
.sitemap-layer .sitemap-depth .depth-container .container-inner{display:flex; flex-wrap:wrap; margin-left:-3rem; margin-top:-1rem}
.sitemap-layer .sitemap-depth .depth-align{width:100%}
.sitemap-layer .sitemap-depth .depth-box{display:flex; flex-direction:column; margin-left:3rem; margin-top:1rem}
.sitemap-layer .sitemap-depth .depth-box .depth2-box{display:flex; align-items:center; justify-content:center; position:relative; height:6.5rem; padding:0 2.2rem; background-color:var(--ply-color-light-gray-0); border:1px solid var(--ply-color-light-gray-10); border-radius:1.2rem; overflow:hidden; box-sizing:border-box}
.sitemap-layer .sitemap-depth .depth-box .depth2-box.blank:after{content:'\f0f4'; position:relative; top:-1px; margin-left:0.5rem; color:#0f5747; font-family:remixicon; font-size:1.5rem; font-weight:normal}
.sitemap-layer .sitemap-depth .depth-box .depth2-box strong,
.sitemap-layer .sitemap-depth .depth-box .depth2-box span{display:inline-flex; position:relative; line-height:1.5em; letter-spacing:-0.05rem}
.sitemap-layer .sitemap-depth .depth-box .depth2-box strong{color:var(--ply-color-light-gray-95); font-size:1.7rem; font-weight:300; letter-spacing:-0.05rem}
.sitemap-layer .sitemap-depth .depth-box:hover .depth2-box{background-color:#00664f; border:1px solid #00664f}
.sitemap-layer .sitemap-depth .depth-box:hover .depth2-box strong{color:#fff}
.sitemap-layer .sitemap-depth .depth-box:hover .depth2-box.blank:after{color:var(--ply-color-light-gray-0)}

.sitemap-layer .sitemap-close{display:flex; align-items:center; justify-content:center; position:absolute; top:7rem; right:0; width:6.4rem; height:6.4rem; margin:0; padding:0; background-color:#8f8f8f; border:0; border-radius:50%; cursor:pointer; overflow:hidden; box-sizing:border-box}
.sitemap-layer .sitemap-close:before,
.sitemap-layer .sitemap-close:after{content:''; position:absolute; border-radius:1000rem; filter:blur(1rem)}
.sitemap-layer .sitemap-close:before{left:-1rem; top:-1rem; width:6rem; height:6rem; background-color:#00664f; opacity:0.9}
.sitemap-layer .sitemap-close:after{right:-1rem; bottom:-1rem; width:6rem; height:6rem; background-color:#b76541; opacity:0.6}

.sitemap-layer .sitemap-close .more-ico{position:relative; width:100%; height:100%; transform:rotate(225deg); transition: all .35s ease; z-index:1}
.sitemap-layer .sitemap-close .more-ico:hover{transform:rotate(130deg)}
.sitemap-layer .sitemap-close .more-ico:before,
.sitemap-layer .sitemap-close .more-ico:after{content:''; position:absolute; left:50%; top:50%; background-color:#fff; transition: all .35s ease}
.sitemap-layer .sitemap-close .more-ico:before{width:2.4rem; height:2px; margin-left:-1.2rem; margin-top:-1px}
.sitemap-layer .sitemap-close .more-ico:after{width:2px; height:2.4rem; margin-left:-1px; margin-top:-1.2rem}



/* mobile-gnb */
.mobile-gnb-layer{display:none; position:fixed; top:0; right:0; bottom:0; left:0; background-color:var(--ply-color-light-gray-0); z-index:90}
.mobile-gnb-layer.active{display:block}
.mobile-gnb-layer .mobile-gnb-wrap{display:flex; flex-direction:column; height:100%; box-sizing:border-box}

.mobile-gnb-layer .mobile-gnb-top{display:flex; align-items:center; height:8rem; padding:0 2rem; background-color:var(--ply-color-light-gray-0); box-sizing:border-box}
.mobile-gnb-layer .mobile-gnb-top #mobile-logo{display:inline-flex; align-items:center; z-index:9}
.mobile-gnb-layer .mobile-gnb-top #mobile-logo a{display:block; width:14rem; height:3.7rem; background:url("../img/layout/logo-top.svg") no-repeat 50% 50%; background-size:13rem 3.7rem}

.mobile-gnb-layer .top-sns .sns-item{display:flex; gap:2.2rem; overflow:hidden}
.mobile-gnb-layer .top-sns .sns-item a{display:flex; align-items:center; height:7rem; border-radius:0.4rem 0 0 0.4rem; box-sizing:border-box}
.mobile-gnb-layer .top-sns .sns-item a:after{font-family:remixicon; font-size:3.1rem}
.mobile-gnb-layer .top-sns .sns-item a.facebook:after{content:'\ecbc'; color:#2b66ff}
.mobile-gnb-layer .top-sns .sns-item a.twitter:after{content:'\f3e6'; color:#101010}
.mobile-gnb-layer .top-sns .sns-item a.instagram:after{content:'\ee66'; color:#101010; background:linear-gradient(120deg, #f9ce34, #f8416b, #8428c2); -webkit-background-clip:text; -webkit-text-fill-color:transparent}
.mobile-gnb-layer .top-sns .sns-item a.youtube:after{content:'\f2d4'; color:#f40633}
.mobile-gnb-layer .top-sns .sns-item a.blog:after{content:''; width:3rem; height:2.5rem; background:url('../img/layout/floating-sns-blog.png') 50% 50% no-repeat; background-size:3rem 2.5rem}

.mobile-gnb-layer .top-link{display:flex; align-items:center; justify-content:space-between; padding:2rem 0; border-top:1px solid var(--ply-color-light-gray-10)}
.mobile-gnb-layer .top-link .link-eum{display:inline-flex; align-items:center; margin:0; padding:0; border:0; cursor:pointer; box-sizing:border-box}
.mobile-gnb-layer .top-link .link-eum span{line-height:1.5em; color:var(--ply-color-light-gray-60); font-size:2.1rem; font-weight:normal; letter-spacing:-0.05rem}
.mobile-gnb-layer .top-link .link-eum:before{content:''; position:relative; top:-0.1rem; min-width:5.2rem; min-height:5.2rem; margin-right:0.5rem; background:var(--ply-color-light-gray-0) url("../img/main/quick-eum.svg") no-repeat 50% .2rem; background-size:5.2rem; border:.2rem solid #000; border-radius:50%; overflow:hidden; box-sizing:border-box}

.mobile-gnb-layer .top-link .link-archive{display:inline-flex; align-items:center; min-width:18rem; min-height:3.6rem; margin:0; padding:0; background:url("../img/layout/ico-nrich-archive.svg") no-repeat 50% 50%; background-size:18rem 2.6rem; border:0; border-radius:0; cursor:pointer}

.mobile-gnb-layer .top-link .link-eng{display:inline-flex; align-items:center; margin:0; padding:0; background:none; border:0; border-radius:0; cursor:pointer}
.mobile-gnb-layer .top-link .link-eng span{line-height:1.5em; color:var(--ply-color-light-gray-60); font-size:2.1rem; font-weight:normal; letter-spacing:-0.05rem}
.mobile-gnb-layer .top-link .link-eng:before{content:'\edcf'; position:relative; margin-right:0.2rem; color:var(--ply-color-light-gray-60); font-family:remixicon; font-size:2.2rem; font-weight:normal}

.mobile-gnb-layer .mobile-gnb-container{flex:1; padding:2rem; overflow:hidden; overflow-y:auto}
.mobile-gnb-layer #mobile-gnb{display:flex; flex-direction:column; gap:1rem}
.mobile-gnb-layer #mobile-gnb .mobile-gnb-box{overflow:hidden}
.mobile-gnb-layer #mobile-gnb .depth1-tit{display:flex; align-items:center; position:relative; width:100%; margin:0; padding:2.2rem 1.6rem; padding-right:10rem; background:#f2f7f6; border:0; border-radius:1.2rem; cursor:pointer; outline:none; box-sizing:border-box}
.mobile-gnb-layer #mobile-gnb .depth1-tit:before{content:'\ea13'; margin-right:0.5rem; color:var(--ply-color-light-gray-90); font-family:remixicon; font-size:2.2rem}
.mobile-gnb-layer #mobile-gnb .depth1-tit:after{content:'\ea4e'; display:flex; align-items:center; justify-content:center; position:absolute; right:1.5rem; top:2.2rem; width:3.6rem; height:3.6rem; color:#202020; font-family:remixicon; font-size:2.4rem; background-color:transparent; border-radius:50%; box-sizing:border-box}
.mobile-gnb-layer #mobile-gnb .depth1-tit span{position:relative; line-height:1.6em; color:var(--ply-color-light-gray-90); font-size:2.3rem; font-weight:300; text-align:left; letter-spacing:-0.05rem}
.mobile-gnb-layer #mobile-gnb .depth1-tit.active{background:#00664f}

.mobile-gnb-layer #mobile-gnb .depth1-tit.active:before{content:'\f1af'; color:var(--ply-color-light-gray-0)}
.mobile-gnb-layer #mobile-gnb .depth1-tit.active:after{top:2rem; color:#fff; transform:rotate(-180deg)}
.mobile-gnb-layer #mobile-gnb .depth1-tit.active span{color:var(--ply-color-light-gray-0)}

.mobile-gnb-layer #mobile-gnb .mobile-gnb-depth{display:none; position:relative; background-color:#fff; box-sizing:border-box}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth-box{display:flex; flex-direction:column; position:relative; border-bottom:1px solid var(--ply-color-light-secondary-5)}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth-box:last-child{border-bottom:none}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth-box.active:before{content:''; position:absolute; left:0; top:2.2rem; bottom:2.2rem; width:0.3rem; background-color:#00664f}

.mobile-gnb-layer #mobile-gnb .depth-menu .depth2-box{display:flex; align-items:center; position:relative; padding:2.2rem 2.2rem; padding-left:4.4rem; box-sizing:border-box}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth2-box.blank:after{content:'\f0f4'; position:relative; top:-1px; margin-left:0.5rem;  color:#00664f; font-family:remixicon; font-size:1.7rem; font-weight:normal}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth2-box span{display:inline-flex; position:relative; line-height:1.6em; color:var(--ply-color-light-gray-95); font-size:2.1rem; font-weight:normal; letter-spacing:-0.05rem}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth2-box.active span{color:#00664f; font-weight:300}

.mobile-gnb-layer #mobile-gnb .depth-menu .depth3-box{display:flex; flex-direction:column; padding:0 2.2rem; padding-bottom:2.2rem}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth3-box a{display:flex; align-items:center; position:relative; padding:0.8rem 0; padding-left:1.2rem}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth3-box a:before{content:''; position:absolute; left:0; top:1.5rem; width:0.4rem; height:0.2rem; background-color:var(--ply-color-light-gray-95)}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth3-box a.blank:after{content:'\f0f4'; position:relative; top:-1px; margin-left:0.5rem; color:#00664f; font-family:remixicon; font-size:1.7rem; font-weight:normal}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth3-box a span{line-height:1.6rem; color: var(--ply-color-light-gray-95); font-size:1.9rem; font-weight:normal; letter-spacing:-0.02rem}
.mobile-gnb-layer #mobile-gnb .depth-menu .depth3-box a.active span{color:#00664f; font-weight:300}


.mobile-gnb-layer .mobile-gnb-close{display:flex; align-items:center; justify-content:center; position:absolute; top:1.5rem; right:1rem; width:5rem; height:5rem; margin:0; padding:0; background-color:transparent; border:0; cursor:pointer; box-sizing:border-box}
.mobile-gnb-layer .mobile-gnb-close .more-ico{position:relative; width:100%; height:100%; transform: rotate(225deg)}
.mobile-gnb-layer .mobile-gnb-close .more-ico:before,
.mobile-gnb-layer .mobile-gnb-close .more-ico:after{content:''; position:absolute; left:50%; top:50%; background-color:var(--ply-color-light-gray-95); transition: all .35s ease}
.mobile-gnb-layer .mobile-gnb-close .more-ico:before{width:2.4rem; height:2px; margin-left:-1.2rem; margin-top:-1px}
.mobile-gnb-layer .mobile-gnb-close .more-ico:after{width:2px; height:2.4rem; margin-left:-1px; margin-top:-1.2rem}



/* **************************************** *
 * container
 * **************************************** */
#ply-mcontainer{flex:1; padding-top:10rem; box-sizing:border-box}
#ply-mcontainer .page-content{}

#ply-container{flex:1; padding-top:10rem; box-sizing:border-box}
#ply-container .page-content{position:relative; width:140rem; /* min-height:40rem;*/ margin:0 auto; padding:8rem 0 12rem; box-sizing:border-box}
#ply-container .dev-content{}


/* **************************************** *
 * ply-footer
 * **************************************** */
#ply-footer{position:relative; background-color:var(--ply-color-light-gray-90)}
#ply-footer .footer-inner{display:flex; position:relative; width:140rem; margin:0 auto; padding:3.5rem 0 4.5rem; box-sizing:border-box}
#ply-footer .footer-l{display:flex; flex-direction:column; min-width:30rem; max-width:30rem}
#ply-footer .footer-r{flex:1; display:flex; flex-direction:column}

#ply-footer .local-logo{width:12.7rem; height:3.6rem; background:url("../img/layout/logo-foot.svg") no-repeat 50% 50%; background-size:12.7rem 3.6rem}
#ply-footer .local-cs{display:flex; flex-direction:column; margin-top:3.8rem}
#ply-footer .local-cs .cs-tit,
#ply-footer .local-cs .cs-tel,
#ply-footer .local-cs .cs-info{line-height:1.2em; letter-spacing:-0.05rem}
#ply-footer .local-cs .cs-tit{font-size:1.5rem; color:var(--ply-color-light-gray-0)}
#ply-footer .local-cs .cs-tel{margin-top:1.2rem; font-family:Poppins; font-size:2.6rem; font-weight:600; color:var(--ply-color-light-gray-0)}
#ply-footer .local-cs .cs-info{margin-top:2rem; font-size:1.4rem; color:var(--ply-color-light-gray-40)}

#ply-footer .local-info{display:flex; flex-direction:column; gap:1rem}
#ply-footer .local-info .info-item{display:flex; align-items:center; gap:2rem; line-height:1.5em; color:var(--ply-color-light-gray-40); font-size:1.5rem; font-weight:normal; letter-spacing:-0.05rem}
#ply-footer .local-info .info-item:first-child{color:var(--ply-color-light-gray-0)}

#ply-footer .local-fnb{display:flex; gap:3rem; margin-top:4.5rem}
#ply-footer .local-fnb a{display:inline-flex}
#ply-footer .local-fnb a span{line-height:1.5em; color:var(--ply-color-light-gray-0); font-size:1.5rem; font-weight:normal; letter-spacing:-0.05rem}
#ply-footer .local-fnb a.fnb-privacy span{color:#8fe7c8; text-decoration:underline; text-underline-offset:0.5rem}
#ply-footer .local-fnb a.fnb-login span{color:var(--ply-color-light-gray-30)}
#ply-footer .local-fnb a.fnb-logout span{color:var(--ply-color-light-gray-0)}

#ply-footer .local-copyright{display:flex; align-items:center; gap:0.5rem; margin-top:2.5rem; line-height:1.2em; color:var(--ply-color-light-gray-40); font-size:1.4rem; font-weight:normal; letter-spacing:normal}

#ply-footer .footer-link{display:flex; align-items:center; gap:1rem; position:absolute; right:0; top:3.8rem}
#ply-footer .footer-link .link-item{position:relative; width:22rem}
#ply-footer .footer-link .link-item .item-toggle{display:flex; align-items:center; justify-content:space-between; height:6rem; padding:0 2.4rem; background-color:transparent; border:1px solid var(--ply-color-light-alpha-white25); border-radius:1.2rem; box-sizing:border-box}
#ply-footer .footer-link .link-item .item-toggle span{line-height:1em; color:var(--ply-color-light-gray-0); font-size:1.5rem; font-weight:300; letter-spacing:0.1rem}
#ply-footer .footer-link .link-item .item-toggle:after{content:'\ea78'; color:var(--ply-color-light-gray-0); font-family:remixicon; font-size:2.2rem}
#ply-footer .footer-link .link-item.active .item-toggle:after{transform:rotate(-180deg)}
#ply-footer .footer-link .link-item .item-layer{display:none; flex-direction:column; position:absolute; left:0; bottom:6.5rem; width:100%; padding:1.1rem 0; max-height:42.5rem; background-color:var(--ply-color-light-gray-90); border:1px solid var(--ply-color-light-alpha-white25); border-radius:1.2rem; overflow-y:auto; z-index:1; box-sizing:border-box}
#ply-footer .footer-link .link-item.active .item-layer{display:flex}
#ply-footer .footer-link .link-item .item-layer .gov-list{display:flex; flex-direction:column}
#ply-footer .footer-link .link-item .item-layer a{position:relative; padding:0.8rem 2.4rem}
#ply-footer .footer-link .link-item .item-layer a span{line-height:1em; color:var(--ply-color-light-gray-0); font-size:1.5rem; letter-spacing:-0.-05rem}
#ply-footer .footer-link .link-item .item-layer a:hover span{color:#8fe7c8; text-decoration:underline; text-underline-offset:0.5rem}
#ply-footer .footer-link .link-item .item-toggle:after,
#ply-footer .footer-link .link-item .item-layer a,
#ply-footer .footer-link .link-item .item-layer a span{transition:all .15s ease}


/* **************************************** *
 * svisual
 * **************************************** */
.svisual{position:relative; height:40rem; background-repeat:no-repeat; background-position:center; background-size:cover}
.svisual.svisual-roadinfo{background-image:url("../img/layout/svisual-roadinfo.jpg")}
.svisual.svisual-tollpayment{background-image:url("../img/layout/svisual-tollpayment.jpg")}
.svisual.svisual-customer{background-image:url("../img/layout/svisual-customer.jpg")}
.svisual.svisual-company{background-image:url("../img/layout/svisual-company.jpg")}
.svisual.svisual-term{background-image:url("../img/layout/svisual-term.jpg")}


.svisual .svisual-container{display:flex; align-items:center; position:relative; width:140rem; height:40rem; margin:0 auto; box-sizing:border-box}
.svisual .page-tit{display:flex; flex-direction:column; gap:2rem; overflow:hidden}
.svisual .page-tit .current-tit,
.svisual .page-tit .parent_tit{position:relative; line-height:1.2em; color:var(--ply-color-light-gray-0); font-family:'TheJamsil','PretendardGOV'; opacity:0; word-break:keep-all}
.svisual .page-tit .parent_tit{font-size:2.5rem; font-weight:normal; letter-spacing:-0.12rem; animation:parent-tit 1s ease 0.4s 1 forwards}
.svisual .page-tit .current-tit{font-size:5.4rem; font-weight:300; letter-spacing:-0.2rem; animation:current-tit 1s ease 1s 1 forwards}
@keyframes parent-tit{0%{top:-6rem; opacity:0;} 100%{top:0; opacity:1}}
@keyframes current-tit{0%{bottom:-6rem; opacity:0;} 100%{bottom:0; opacity:1}}


/* **************************************** *
* breadclumb
* **************************************** */
.breadclumb{display:flex; align-items:center; position:relative; margin-top:-7rem; height:7rem; background-color:rgba(0,0,0,.4); box-sizing:border-box}
.breadclumb .breadclumb-container{display:flex; align-items:center; width:140rem; height:7rem; margin:0 auto}
.breadclumb .home{position:relative; top:-1px; box-sizing:border-box}
.breadclumb .home:after{content:"\ee1a"; font-family:"remixicon"; color:var(--ply-color-light-gray-0); font-size:1.8rem}
.breadclumb ul{display:flex; align-items:center}
.breadclumb ul li .depth{display:inline-flex; position:relative; margin-left:1.5rem; padding-left:1.7rem; line-height:135%; color:rgba(255,255,255,.7); letter-spacing:-0.02rem; font-size:1.6rem; font-weight:normal; text-align:left; overflow:hidden; white-space:nowrap; text-overflow:ellipsis}
.breadclumb ul li .depth:after{content:"\ea6e"; position:absolute; left:-0.8rem; top:0; color:var(--ply-color-light-gray-0); font-family:"remixicon"; font-size:2rem}
.breadclumb ul li:last-child .depth{color:rgba(255,255,255,1)}
.breadclumb ul li:first-child .depth:after{display:none}
.breadclumb ul li:first-child .depth:before{content:''; position:absolute; left:0; top:50%; width:0.1rem; height:3rem; margin-top:-1.5rem; background-color:var(--ply-color-light-alpha-white25)}


/* **************************************** *
* 메인 팝업
* **************************************** */
#hd_pop {position:relative; width:100%; height:0; margin:0; z-index:1000}
#hd_pop h2{position:absolute; font-size:0; line-height:0; overflow:hidden}
.hd_pops{position:absolute; border:1px solid var(--ply-color-light-gray-90); background:var(--ply-color-light-gray-0)}
.hd_pops_con{margin:0; padding:0}
.hd_pops_footer{display:flex; justify-content:flex-end; gap:0.4rem; padding:1rem; background:var(--ply-color-light-gray-90)}


/* **************************************** *
 * login
 * **************************************** */
.login-wrap{display:flex; flex-direction:column; gap:4rem; position:relative; width:44rem; margin:-4rem auto 0; border-radius:2.2rem; overflow:hidden; box-sizing:border-box}

.login-wrap .intro-dsption{display:flex; flex-direction:column; position:relative; padding:6rem 2rem 4rem; background:#e6eeec; border-radius:2.2rem 2.2rem 2.2rem 2.2rem; overflow:hidden; z-index:1; box-sizing:border-box}

.login-wrap .intro-dsption .dsption-ico{display:flex; align-items:center; justify-content:center; width:8rem; height:8rem; margin:0 auto 2rem; background-color:var(--ply-color-light-gray-0); border-radius:50%; z-index:1}
.login-wrap .intro-dsption .dsption-ico i{color:var(--ply-color-light-gray-95); font-size:3.2rem}
.login-wrap .intro-dsption .dsption-ply{display:flex; align-items:center; justify-content:center; position:relative; width:10rem; height:10rem; margin:0 auto 2rem; background:var(--ply-color-light-gray-0) url('../img/common/ply-symbol.svg') 50% 50% no-repeat; background-size:60%; border-radius:50%; z-index:1}
.login-wrap .intro-dsption .dsption-info{display:flex; flex-direction:column; position:relative; text-align:center; gap:2rem; z-index:1}
.login-wrap .intro-dsption .dsption-info .tit{line-height:1.4em; color:var(--ply-color-light-gray-90); font-family:'FlightSans', 'PretendardGOV'; font-size:2.9rem; font-weight:300; letter-spacing:-0.08rem}
.login-wrap .intro-dsption .dsption-info .info li{position:relative; margin-bottom:0.2rem; line-height:1.4em; color:var(--ply-color-light-gray-60); font-size:1.8rem; font-weight:normal; letter-spacing:-0.02rem; word-break:keep-all}
.login-wrap .intro-dsption .dsption-btn{display:flex; justify-content:center; margin-top:2rem}
.login-wrap .intro-dsption .dsption-btn .btn{min-width:17rem}

.login-form{position:relative; box-sizing:border-box; z-index:1}
.login-form .login-input{position:relative; margin-bottom:10px}
.login-form .login-input:last-child{margin-bottom:0}
.login-form .login-input label{display:flex; align-items:center; justify-content:center; position:absolute; left:10px; top:0; width:44px; height:100%; font-size:20px; color:#0f5747; box-sizing:border-box}
.login-form .login-input input{width:100%; height:75px; line-height:65px; margin:0; padding:1px 0; text-align:left; font-size:18px; color:#202020; letter-spacing:-0.5px; font-weight:normal; background:#fff; border:1px solid #dadada; text-indent:58px; border-radius:1.6rem; outline:none; transition:all .35s ease;  box-sizing:border-box; -webkit-appearance:none}
.login-form .login-input:hover input{border:1px solid #00664f ; background:#fff}
.login-form .login-input input:focus{border:1px solid #00664f ; background:#fff}
.login-form .login-input input::-webkit-input-placeholder{color:#a4a4a4; font-size:18px; font-weight:normal; letter-spacing:-1px}
.login-form .login-input input::-moz-placeholder{color:#a4a4a4; font-size:18px; font-weight:normal; letter-spacing:-1px}
.login-form .login-input input[disabled]{background:#f2f4f5}
.login-form .login-input input[readonly]{background:#f2f4f5}

.login-confirm{display:flex; align-items:center; justify-content:center; position:relative; width:100%; margin-top:25px; padding:0; border:0; height:75px; background:var(--ply-color-light-gray-95); cursor:pointer; border-radius:20rem; z-index:1; box-sizing:border-box}
.login-confirm span{color:#fff; font-size:18px; font-weight:300; letter-spacing:-0.8px}

.login_captcha{margin-top:20px; margin-bottom:20px}

.login-help{position:relative; margin-top:50px; box-sizing:border-box}
.login-help .info{margin-bottom:15px; line-height:135%; letter-spacing:-0.8px; font-size:16px; color:#505050}
.login-help .help-list{margin-left:-5px; margin-top:-5px}
.login-help .help-list:after{content:''; display:block; clear:both}
.login-help .help-list li{float:left; width:50%}
.login-help .help-list li a{display:flex; align-items:center; justify-content:center; height:52px; margin-left:5px; margin-top:5px; color:#505050; letter-spacing:-1px; background:#fff; border:1px solid #ebebeb; font-size:16px; font-weight:normal; text-align:center; border-radius:8px; box-sizing:border-box}

