@charset "utf-8";
.sub-top-bg {max-width:1700px; position: relative; background-repeat: no-repeat; width: 95%; height: 400px; margin: 0 auto; overflow:hidden;
display: flex;flex-direction: column;align-items: center;justify-content: center; padding:0 12px;}
.sub-top-bg:before{animation-name:subVisual;animation-duration:2s;animation-fill-mode:forwards; width:100%; height:100%; content:""; display:block; top:0; left:0; position:absolute;
 background-position:center; background:url(/resources/custom/images/kreon/sub/sub-top-bg.jpg); background-size:cover;     z-index: -1;}
@keyframes subVisual{
  0%{filter:blur(10px);transform:scale(1.1);}
  100%{filter:blur(0);transform:scale(1);}
}
.sub-top-bg  .page_location{display:flex;}
.sub-top-bg  .page_location p{color:#fff; position:relative; display:flex; align-items:center;}
.sub-top-bg  .page_location p:after{content:""; display:inline-block; width:6px; height:6px; border-radius:30px; background:#fff; margin:0 13px; vertical-align: middle;}
.sub-top-bg  .page_location p:last-child:after{display:none;}
.sub-top-bg h3{font-size:32px; font-weight:bold; margin-top:20px; margin-bottom:70px; color:#fff;}

/*page_nav*/
#lnb{padding:8px 14px; background:rgba(255,255,255,.1); margin:0 auto; border-radius:30px;}
#lnb .lnb-item.first{display:none;}
#lnb .lnb-item > ul > li{display:none;}
#lnb .lnb-item > ul > li > a{display:none;}
#lnb .lnb-item > ul > .active{display:block;}
#lnb .lnb-item .sub-menu{    display: flex;justify-content: center; }
#lnb .lnb-item .sub-menu > li > a{display:block; padding:10px 20px; border-radius:30px; color:#fff; font-size:16px; font-family:'Gmarket'; font-weight:300; text-align: center; text-align:center;}
#lnb .lnb-item .sub-menu > .active > a{background:#135ed0; color:#fff;}
/*3뎁스 숨김 ..*/
#lnb .lnb-item .sub-menu > li > .sub-menu{display:none;}

.sub-contents{margin-bottom:100px; margin-top:70px;}
.contentsTitle{font-size:24px; }
@media all and (max-width:1024px){
		.sub-top-bg{height:300px;}
		.sub-top-bg h3{margin:20px 0;}
		.sub-contents{margin-top:50px;}
}
@media all and (max-width:767px){
		.sub-top-bg{height:250px;}
		.page_nav{display:none;}
}

.sub-contents{opacity:0;transform:translateY(50px);}
.sub-contents{animation-name:bContents;animation-duration:1s;animation-fill-mode:forwards;animation-delay:0.75s;}
@keyframes bContents{
  0%{}
  100%{opacity:1;transform:translateY(0);}
}