@charset "utf-8";
/*common*/
.sub-contents{margin-top:80px;margin-bottom:50px;}
.sub-page-content{float:right; width:calc(100% - 280px); padding-left:70px; }

.sub-top-bg {max-width:2000px; position: relative; background-repeat: no-repeat; width: 100%; height: 470px; margin: 0 auto; background:url(/resources/custom/images/rnd/sub/sub-top-bg.jpg) no-repeat;
background-size: cover; padding-top:260px; background-position: center;;}
.sub-top-bg .sub-top-ttl{display:flex; align-items:center; gap:40px; padding-left:80px;}
.sub-top-bg .sub-top-ttl h3{font-size:50px; color:#fff; transform:translateY(100px); opacity:0; transition:.5s;}
.sub-top-bg .sub-top-ttl p{color:#fff; font-size:18px; transform:translateY(100px); opacity:0; transition:.5s; transition-delay: .5s;}
.sub-top-bg .sub-top-ttl.active h3{transform:translateY(0); opacity:1; }
.sub-top-bg .sub-top-ttl.active p{transform:translateY(0); opacity:1; }

/*page_nav*/
.page_nav .fix-layout{background:#1c3e70; border-radius:0 0 24px 24px; padding-left: 30px; padding-right:0; display:flex; justify-content:space-between; align-items:center;}
.page_nav .pager-box{height:80px;}
.page_nav .pager-box:after{content:""; display:block; clear:both;}
.page_nav .pager-box .home{float:left; width:50px; height:80px; background:url(/resources/custom/images/rnd/sub/sub_nav_home.png)no-repeat center; text-indent:-9999px; position:relative; margin-right:20px;}
.page_nav .pager-box .home:after{content:""; display:block; width:1px; height:27px; background:#ffffff; position:absolute; right:-20px; top:50%; transform:translateY(-50%);}
.page_nav .lnb-item > ul > li > a{display:block; width:160px; height:80px; float:left; color:#fff; line-height:80px;  padding:0 12px;}
.page_nav .pager-box .sub-menu{position:relative; padding-top:80px; float:left; height:0px; overflow:hidden; float:left; width:100%; }
.page_nav .pager-box .sub-menu{height:80px;}
.page_nav .pager-box .sub-menu a{color:#fff; line-height:80px; display:block; width:100%; height:100%; padding:0 12px;}
.page_nav .pager-box .sub-menu .active{position:absolute; height:80px; top:0; left:0; }

.page_nav .lnb-item{margin-left:16px; position: relative; float: left; width: 200px; height: 80px; font-size: 16px; font-weight: 600; background: url(/resources/custom/images/rnd/sub/sub_nav_arrow.png)no-repeat 95% center / 16px auto;}
.page_nav .lnb-item > ul              { position: absolute; top: 0; left: 0; right: 0; padding-top: 80px; height: 0px; overflow: hidden;}
.page_nav .lnb-item > ul .active      { position: absolute; top: 0; left: 0; right: 0; height: 80px; background: rgba(0, 0, 0, 0);}
.page_nav .lnb-item > ul .active.open a {font-weight: 400; background:#1f1f1f; }
.page_nav .lnb-item > ul .active.open a:active, .lnb-item > ul .active.open a:focus {color: #fff;}
.page_nav .lnb-item > ul:hover            { background:rgba(0, 0, 0, 0.26); }
.page_nav .lnb-item .active > a           { border-left-width: 0; margin-left: 0; border-top-width: 1px; padding-right: 0; bottom: 0;}
.page_nav .lnb-item ul > li.active{border-left:none;}


.page_nav .contentsUtill{display:flex; gap:40px; background:#df6d1b; padding:0 30px; height:80px; align-items:center; border-radius:50px 0 0 50px;} 
.page_nav .contentsUtill li{position: relative;}
.page_nav .contentsUtill button{width:40px; height:40px; background-position:center; text-indent:-9999px; border:none;}
.page_nav .contentsUtill .bookmark{background:url(/resources/custom/images/rnd/sub/ico-bookmark.png) no-repeat center;}
.page_nav .contentsUtill .print{background:url(/resources/custom/images/rnd/sub/ico-print.png) no-repeat center; position:relative;}
.page_nav .contentsUtill .print:after{content:""; display:block; width:1px; height:27px; background:rgba(255,255,255,.5); left:-20px; top:50%; transform:translateY(-50%); position:absolute;}
.page_nav .svMenu{position:absolute; top:50px; right:0; width:300px; border-radius: 16px; background:#fff; padding:20px; z-index:5; box-shadow:0px 0px 8px rgba(0,0,0,.15); display:none; opacity:0}
.page_nav .svMenu h6{text-align:left; padding-left:0; margin:0; background:none; font-size:16px; font-weight:600; color:#222;}
.page_nav .svMenu .svClose{position:absolute; right:20px; top:20px; width:20px; height:20px; background:url(/resources/custom/images/enter/sub/ico_svmClo.png) no-repeat center; background-size:cover;}
/* #sub_visual .svMenu .func{display:flex; justify-content:space-between;} */
.sub-page-top .page_nav .sub-page-top .svMenu .func a i{display:inline-block; width:14px; height:14px; margin-right:4px; vertical-align:middle;}
.page_nav .svMenu .func .adMenu{background:#222; color:#fff; float:left;}
.page_nav .svMenu .func .adMenu i{background:url(/resources/custom/images/enter/sub/ico_svmAdd.png) no-repeat center; background-size:cover;}
.page_nav .svMenu .func .svReset{border:1px solid #222; color:#222; float:right;}
.page_nav .svMenu .func .svReset i{background:url(/resources/custom/images/enter/sub/ico_svmRes.png) no-repeat center; background-size:cover;}
.page_nav .svMenuList{background:#f8f8f8; padding:10px; text-align:left; border-radius: 4px; max-height:120px; overflow-y:auto; margin:20px 0 10px 0;}
.page_nav .svMenuList li{border-bottom:1px solid #e5e5e5; display:flex; flex-wrap:wrap; justify-content:space-between; padding:4px; color:#161616; font-size:14px; align-items:center;}
.page_nav .svMenuList li a{width:calc(100% - 30px); color:#161616; font-size:14px;}
.page_nav .svMenuList li a:focus, #sub_visual .page-role .svMenuList li a:active{color:inherit;}
.page_nav .svMenuList li i{width:20px; color:#023f8f; text-align:center; font-size:24px; cursor:pointer; }

.sub-contents .contentsTitle{text-align:center; padding-bottom:40px; margin-bottom:40px; font-size:48px; border-bottom:2px solid #000000; font-weight:600;}

.left-navi{width:280px; float:left;  z-index:10; position:relative;}
.left-navi .title{border-radius:24px 24px 0 0; padding:0 10px 40px; color:#313131; font-size:25px; border-bottom:1px solid #cccccc; font-family:'Gmarket'}
.left-navi .home{display:none;}
.left-navi .lnb > ul > li{display:none;}
.left-navi .lnb > ul > li.active{display:block;}
.left-navi .lnb > ul > li.active > a{display:none;}
.left-navi .lnb > ul > li > ul > li  > a{background-color:#fff; position:relative; padding:22px 10px; border-bottom:1px solid #cccccc; display:block; font-family:'Gmarket' ;font-weight:300; color:#313131; font-size:18px;}
.left-navi .lnb > ul > li > ul > li.active  > a{color:#0725bc;} 

/*left-navi 3depth*/
.left-navi .lnb > ul > li > ul > li > ul{ background-color:#f4f4f4;}
.left-navi .lnb > ul > li > ul > li.active > ul{display:block;}
.left-navi .lnb > ul > li > ul > li > ul > li{padding:12px 20px; border-bottom:1px solid #ccc;}
.left-navi .lnb > ul > li > ul > li.active > ul > .active a{color: #0725bc; }
.left-navi .lnb > ul > li > ul > li > ul > li a{padding-left:10px; position:relative; font-family:'Gmarket'; font-weight:300;}
.left-navi .lnb > ul > li > ul > li > ul > li a::before{display:block; content:''; width:4px; height:4px; background:#acacac; position:absolute; top:8px; left:0;}

@media all and (max-width:1644px){
	.sub-top-bg .sub-top-ttl{padding-left:12px;}
	.sub-page-content{padding-left:40px;}
	
}
@media all and (max-width:1500px){
		.left-navi .lnb > ul > li > ul > li > a{font-size:16px; padding:16px 12px;}
}
@media all and (max-width:1300px){
		.sub-page-content{width:calc(100% - 250px);}
        .left-navi{width:250px;}
}
@media all and (max-width:1000px){
		.sub-page-content{float:none; width:100%; padding-left:0;}
		.left-navi{display:none;}
}
@media all and (max-width:767px){
	.page_nav{display:none;}
	.sub-top-bg{height:350px; padding-top:200px;}
	.sub-top-bg .sub-top-ttl{flex-direction: column;gap: 12px;}
	.sub-top-bg .sub-top-ttl h3{font-size:32px;}
	.sub-top-bg .sub-top-ttl p{font-size:16px;}
	.sub-contents{margin-top:30px;}
	.sub-contents .contentsTitle{margin-bottom:20px; padding-bottom:20px; font-size:24px;}
}