@charset "utf-8";
/* 분관서브 */

#container:after{display:block; content:''; clear:both}
#lmenu>p{display:flex; align-items:center; justify-content:center; padding-right:2rem; font-family:'SBaggro'; font-weight:300; font-size:3rem; background:var(--color); color:#fff; border-radius:20px 20px 150px 20px; height:17.8rem; width:116%}
#childengLibrary #lmenu>p{text-shadow: 0px 0px 2px rgba(150,40,60,.8)}
#lmenu>ul{margin-top:.8rem}
#lmenu>ul>li{border-top:1px solid #eee; color: #222;}
#lmenu>ul>li:last-child{border-bottom:1px solid #eee}
#lmenu>ul>li:first-child{border-top:0px; border-top-left-radius:1rem; border-top-right-radius:3rem; overflow:hidden}
#lmenu>ul>li>a{display:block; position: relative; padding:1.6rem 10%; font-size:1.6rem; border-radius:.5rem; overflow:hidden}
#lmenu>ul>li:has(ul)>a:before{content: ''; position: absolute; right: 8%; top:2.3rem; width: 8px; height: 8px; border:0px solid rgba(0,0,0,.5); border-width: 0px 2px 2px 0px; transform: rotate(45deg); transition: all ease .5s}
#lmenu>ul>li ul{display:none; padding:10%; border-radius:.5rem; border:1px solid rgba(0,0,0,.07)}
#lmenu>ul>li.on ul{background:var(--subbg)}
#lmenu>ul>li ul>li{margin:1rem 0px; font-family:'SCDream-regular'; }
#lmenu>ul>li ul>li>a{display: inline-block; position: relative; padding-left: 15px;}
#lmenu>ul>li ul>li>a:before{content: ''; opacity: .2; position: absolute; left: 0px; top: .2rem; margin: 5px auto; width: 8px; height: 8px; background-color: var(--color-txt);  -webkit-mask: url(/annex/img/sub/lmenu_bl.svg) no-repeat 50% 50%;  mask: url(/annex/img/sub/lmenu_bl) no-repeat 50% 50%; -webkit-mask-size: cover; mask-size: cover;}
#lmenu>ul>li.on,
#lmenu>ul>li.on+li{border:0px}
#lmenu>ul>li.on>a{background:var(--color-txt); color:#fff}
#lmenu>ul>li.on>a:before{border-color:rgba(255,255,255,.5)}
#lmenu>ul>li.on>ul{display: block;}
#lmenu>ul>li.on>ul li.on>a{color:var(--color-txt); font-weight:bold;}
#lmenu>ul>li.on>ul li.on>a:before{opacity:1}
#lmenu>ul>li:not(.on).select,
#lmenu>ul>li:not(.on).select+li{border:0px}
#lmenu>ul>li:not(.on).select>a{background:#f0f0f0; font-weight:600;}
#lmenu>ul>li a[target=_blank]:after,
#lmenu>ul>li.on>a[target=_blank]:after{display: inline-block; content:''; position: relative; top: -.2rem; vertical-align: middle; margin-left: .7rem; width: 1.5rem; height: 1rem; background:url(/annex/img/sub/ic_link.png) no-repeat left center / 3rem; opacity: .5;}
#lmenu>ul>li.on>a[target=_blank]:after{background-position-x:right}
#con_tit{position:relative; padding:5rem; padding-left:9rem; left: -8%; width:108%; background:var(--subbg); border-radius:120px 20px 20px 20px}
#con_tit h3{font-family:'SBaggro'; font-weight:normal; font-size:3rem; color: #252525;}
#con_tit #location{margin-top:1rem;}
#con_tit #location>li{display:inline-block; vertical-align:middle; position:relative; color:#888; font-family:'SCDream-regular'; font-size:1.3rem;}
#con_tit #location>li:not(:first-child):before{display: inline-block; content:''; position:relative; top:-.1rem; margin:0px 1.1rem 0px .4rem; width:.7rem; height:.7rem; border:1px solid #888; border-width:1px 1px 0px 0px; transform:rotate(45deg)}
#con_tit #location>li:first-child{width:1.3rem; height:1.3rem; font-size:0px; background:url(/annex/img/sub/ic_home.png) left center / COVER}
#shareSns{position:absolute; right:5rem; top:50%; margin-top:-2rem; line-height:0px; z-index: 1;}
#shareSns li{display:inline-block}
#shareSns li>a{display:block; width:3.4rem; height:3.4rem; border-radius:1.4rem; background:#fff; font-size:0px; background:#fff url(/annex/img/sub/ic_shareSns.png) left top / 300%}
#shareSns li>a.on{background-color:var(--color-txt); background-position-y:-3.4rem}
#shareSns>li:nth-child(1)>a{background-position-x:0rem}
#shareSns>li:nth-child(2)>a{background-position-x:-3.4rem}
#shareSns>li:nth-child(3)>a{background-position-x:-6.8rem}
#shareSns div{display:flex; flex-wrap: wrap; justify-content:space-between; align-items:center; visibility:hidden; opacity:0; position:absolute; top:120%; right:0px; padding:0px 3rem; width:25rem; background:var(--color); line-height:1.5; border-radius: 10px; box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.25); color: #fff; white-space:nowrap; transition:all ease .3s}
#shareSns div.openSns{visibility:visible; opacity:1; padding:3rem 3rem}
#shareSns div>p{font-size:1.8rem; font-family:'SCDream-regular';}
#shareSns div ul{order:2; margin-top:1rem; font-size:0px}
#shareSns div ul>li{margin:.2rem}
#shareSns div ul>li.sns01>a{background-position-y:-3.4rem}
#shareSns div ul>li.sns02>a{background-position-y:-6.8rem}
#shareSns div ul>li.sns03>a{background-position-y:-10.2rem}
#shareSns div ul>li.sns04>a{background-position-y:-13.6rem}
#shareSns div ul>li.sns05>a{background-position-y:-17rem}
#shareSns .closeSns{display: block; position: relative; top: -.3rem; width:2rem; height:2rem; font-size:0px; overflow:hidden}
#shareSns .closeSns:before,
#shareSns .closeSns:after{display:block; content:''; position: absolute; left:0%; top: 50%; width:2rem; height:1px; background:#fff; transform:rotate(45deg)}
#shareSns .closeSns:after{transform:rotate(-45deg)}
/* #tab{position:relative; width: 104%; left: -4%; margin:1rem 0px 0px; padding:.6rem; padding-left: 4%; background:var(--color); border-radius:.8rem .8rem .8rem 5rem}
#tab ul{display:flex; flex-wrap:wrap; }
#tab ul>li{position: relative; }
#tab ul>li a{position: relative; display: block; padding: .8rem 2rem; border-radius:.5rem; color: #fff; letter-spacing: -.5px;}
#tab ul>li.on a{font-weight:bold; color: var(--color-txt); background: #fff; box-shadow:0px 1px 5px rgba(0,0,0,.3) } */

#tab{position:relative; margin:1rem 0px 0px; padding:.6rem; width: 104%; left: -4%; padding-left: 4%; background:#f0f0f0; border-radius:.8rem .8rem .8rem 5rem}
#tab ul{display:flex}
#tab ul>li{position: relative; }
#tab ul>li a{position: relative; display: block; padding: .8rem 2rem; border-radius:.5rem; color: #333; letter-spacing: -.5px;}
#tab ul>li.on a{color: #fff; background:var(--color); box-shadow:0px 1px 5px rgba(0,0,0,.3); text-shadow: 0px 0px 2px var(--color-txt); }
#childengLibrary #tab ul>li.on a{background:var(--color-txt02); text-shadow:none}
#tab ul>li.mypage{flex-grow:1; text-align: right; }
#tab ul>li.mypage a{display: inline-block; color: #fff; background:#d43838; box-shadow:0px 1px 5px rgba(0,0,0,.3); text-shadow: 0px 0px 2px var(--color-txt); }
#stab{display: flex; flex-wrap:wrap; gap:5px}
#detail_con>#stab:first-of-type{margin-top: -30px;}
#stab>li a{display:block; padding: .8rem 3rem; border:1px solid rgba(0,0,0,.1); border-radius:100px}
#stab>li.on a{background:var(--color01); color: #fff; box-shadow:0px 1px 3px rgba(0,0,0,.2); text-shadow: 0px 0px 1px rgba(0,0,0,.7)}
#childengLibrary #stab>li.on a{background:var(--color-txt);}
#stab>li a[target=_blank]{padding-right:2rem;}
:where(#tab, #stab) a[target=_blank]:after,
:where(#tab, #stab) li.on>a[target=_blank]:after{display: inline-block; content:''; position: relative; top: -.21rem; vertical-align: middle; margin-left: .3rem; width: 1.5rem; height: 1rem; background:url(/annex/img/sub/ic_link.png) no-repeat left center / 3rem; opacity: .8;}
:where(#tab, #stab) li.on>a[target=_blank]:after{background-position-x:right}

#detail_con{margin-top: 6rem; min-height: 50vh; letter-spacing: -.05rem;}
h4{position: relative; margin-top:6rem; margin-bottom: 1rem; padding-bottom:.2rem; padding-left:4.5rem; font-size:2.4rem; color:#222; }
/* h4:before{display: block; content:''; position: absolute; left: -.5rem; top: 0rem; width:4.2rem; height: 4.2rem; background:url(/annex/img/sub/bl01.png) no-repeat left center/contain} */
h4:before,
h4:after{display: block; content:''; position: absolute; left:0px; top: .4rem; width:2.7rem; height: 2.7rem; background:var(--color); border-radius:50px; opacity: .9; ;}
h4:before{box-shadow: 0px 3.27273px 6.54545px 0px rgba(0, 0, 0, 0.25), 1.63636px 0px 0px 0px rgba(0, 0, 0, 0.25)}
h4:after{margin-left: 1rem; transform:scale(.85); background:var(--color-txt); z-index: -1;}
.tbox{position: relative; padding:max(25px, 4.5%) max(25px, 5%); border:4px solid var(--subbg); border-radius:1rem; /* font-size: 1.06em;  */line-height:150%;}
.tbox:before,
.tbox:after{content: ''; position: absolute; }
.tbox:before{right: -.8rem; top:calc(50% - 2.6rem); width: 1.4rem; height: 1.4rem; background: var(--color01); box-shadow:0px 4rem 0px var(--color01); border-radius:5rem; z-index: 1;}
.tbox:after{right: -5px; top: calc(50% - 2rem); width: 5px; background: #fff; height:4.5rem;}
.tbox .tbox_tit{font-weight:600; margin-bottom: 1rem; color: var(--color-txt);; font-size: 1.6rem;}
.tbox span.tbox_tit{margin-bottom: 0rem; margin-right: .5rem;}
.bl02{position: relative; margin-bottom:10px; padding-left:2rem; font-weight:bold; color:var(--color-txt); font-size:1.6rem}
.bl02:before{display: block; content:''; position: absolute; left: 0px; top: .5rem; width:1.4rem; height: 1.4rem; border-radius:2rem; border:4px solid  var(--color-txt); opacity:.8;}
.bl02_txt{margin-left: 2rem; margin-bottom: 1rem;}
.bl03:not(ul, ol),
.bl03>li{position:relative; margin:.7rem 0px; padding-left:11px; word-break:keep-all}
.bl03:not(ul, ol):before,
.bl03>li:before{display:block; content:''; position:absolute; left:0px; top:.9rem; width:.4rem; height:.4rem; background:var(--color-txt); opacity: .5;}
.bl03+.bl04{margin-top:.5rem; margin-left:1.5rem;}
.bl03 .bl04{margin-top: .8rem; margin-bottom: 1.5rem;}
.bl03 .data .bl04{margin-top: 0rem;}
.bl04+.bl03{margin-top:1rem;}
p.bl03{margin-top:2rem}
.bl04:not(ul),
.bl04>li{position:relative; padding-left:1.5rem; word-break:keep-all; font-family: 'SCDream-regular';}
.bl04:not(ul):before,
.bl04>li:before{display:block; content:''; position:absolute; left:0px; top:1.2rem; width:.6rem; height:1px; background:#aaa; }
ul.bl05{padding:3% 4%; background: #fafafa; border-radius:1rem}
.bl05:not(ul, ol),
.bl05>li{position:relative; margin:.5rem 0px; padding-left:1rem; word-break:keep-all; font-family: 'SCDream-regular'; font-size: .95em;}
.bl05:not(ul, ol):before,
.bl05>li:before{display:block; content:''; position:absolute; left:0px; top:1rem; width:3px; height:2px; background:#aaa; }
.para02 .bl05{margin-top: 1rem;}
.bl04 .bl05{margin-bottom: 1rem;}
.nobl{padding-left: 0px !important}
.nobl:before,
.nobl>li:before{display:none !important;}
.nobl .nobl:not(li){margin-left: 1rem; margin-bottom: 1rem;}
.nobl .nobl>li{margin: .5rem 0px}
.para01{margin-top:4rem; margin-left:2rem;}
.para02, .bl03.para02{margin-left:2rem}
h4+.para02{margin-top:1.5rem; margin-left: 3rem;}
.bl03+.bl04.para02{margin-left: 1rem;}
.dashList{border-top:2px solid #333}
.dashList>li{padding: 2rem 1rem; border-bottom: 1px dashed #ddd;}
h4+.dashList{margin-top: 2rem; margin-left: .5rem;}
h4+.step{margin-top: 2rem;}
.dashList.bl03>li{margin:0px; padding-left:2.3rem;}
.dashList.bl03>li:before{top: 3rem; left: 1rem;}

.step>li{position: relative; padding-left: 5rem; padding-top: 2rem; min-height: 6rem;  }
.step>li:before{content: ''; position: absolute; top:2rem; left: 1.6rem; width:.3rem; height: 100%; background: #f0f0f0;}
.step>li:last-child::before{display: none;}
.step>li:after{display: block; content: ''; clear: both;}
.step>li>.num{position: absolute; left: 0px; top: 1.5rem;  width:2.8rem; height:2.8rem; line-height: 2.8rem; text-align: center; border:3px solid #eee; background:#eee; border-radius:5rem; box-sizing:content-box}
.step>li:first-child>.num{border-color:var(--color); color: var(--color); font-weight: bold; background: #fff;}
.step>li>div{float:left; padding: max(2.5%, 20px) max(3%, 20px); max-width: calc(100% - 5rem); border:1px solid #ddd; border-radius:1rem}
.step>li>.tit+div{float:none; max-width: 100%;}
.step>li>.tit{margin-bottom: 1rem; font-size: 1.2em; color: var(--color-txt); ;}
.step>li>dl{display:flex; }
.step>li>dl>dt{flex:0 0 25%; padding:max(2.5%, 20px) ;background:var(--color); border-radius:1rem}
.step>li>dl>dd{flex-grow:1; padding:max(2.5%, 20px); border:1px solid #ddd; border-radius:1rem}
.step2{display:flex; flex-wrap:wrap; gap:5px 2rem; overflow:hidden}
.step2>li{flex-grow:1; text-align: center; position: relative; padding: 1rem 2rem;  border: 1px solid #666; border-radius:.5rem;}
.step2>li:before{content: ''; position: absolute; left: -2rem; top: 50%; margin-top: -.5rem; width: 1rem; height: 1rem; border:1px solid #333; border-width:1px 1px 0px 0px; transform:scale(.8)  rotate(45deg);}

.data{text-align:center; width:100%}
.data thead th{padding:1.5rem max(5px, 1%); background:#eee; overflow:hidden; border-left:1px solid #d9d9d9}
.data thead tr th:first-child{border-left-width:0px}
.data thead tr:first-child th:first-child{border-top-left-radius:8px}
.data thead tr:first-child th[rowspan]:first-child{border-bottom-left-radius:8px}
.data thead tr:first-child th:last-child{border-top-right-radius:8px}
.data thead tr:not(.nofirst):last-child th:first-child{border-bottom-left-radius:8px}
.data thead tr:last-child th:last-child{border-bottom-right-radius:8px}
.data thead tr.nofirst th{border-radius:0px; border-left-width:1px}
.data tr{border-top:1px solid #ddd}
.data :where(tbody, tfoot) tr:last-child{border-bottom:1px solid #ddd}
.data tr:first-child{border-top:0px}
.data :where(tbody, tfoot) td,
.data :where(tbody, tfoot) th{padding:1.5rem max(5px, 1%); font-weight:normal; }
.data :where(tbody, tfoot):first-child tr{border-top:1px solid #ddd}
.data :where(tbody, tfoot):first-child th{background: #f0f0f0; }

.data.isbdL :where(tbody, tfoot) tr{border-color:#e5e5e5}
.data.isbdL :where(tbody, tfoot) td,
.data.isbdL :where(tbody, tfoot) th{padding:1rem max(5px, 2%); border-left:1px solid #e5e5e5}
.data.isbdL :where(tbody, tfoot) th:first-child,
.data.isbdL :where(tbody, tfoot) td:first-child{border-left:0px}
.data.isbdL :where(tbody, tfoot) td li{font-size: 1.4rem;}
.data.isbdL :where(tbody, tfoot) td .bl03>li{margin:.5rem 0px}
.data.isbdL th[rowspan]:not(:last-child),
.data.isbdL td[rowspan]:not(:last-child){border-right:1px solid #e5e5e5}

.asof{text-align: right; margin-bottom: 5px; font-size: 1.3rem; color: #666;}
table .tableIn{padding: 0px !important}
table .tableIn>div{display:flex}
table th.tableIn>div>*{padding:1.5rem max(5px, 2%); }
table td.tableIn>div>*{text-align: left; padding:1rem max(5px, 2%); }
table .tableIn>div>*+*{border-left:1px solid #e5e5e5}
table th.tableIn>div>*+*{border-left-color:#d9d9d9}
table .tableIn .smalltable>*{flex-grow:1}
table .tableIn .smalltable>*:first-child{flex:0 0 60%;}

/***************************************************************************************************************************/

@media screen and (min-width:1081px){
	#lmenu{position:relative; float:left; width:19.0973%; z-index:1;}
	#container #lmenu+#contents{float:right ; width:75%;}
	#container:has(#lmenu) #contents{float:right ; width:75%;}
	/*#container #lmenu+#contents #con_tit */
	#container:not(:has(#lmenu)) #contents #con_tit{left: 0px; width: 100%; border-radius:8px}

}

@media screen and (max-width:1080px){
	#lmenu{display:none;}
	#con_tit{text-align:center; margin-top:2rem; padding:3rem 2%; left:0%; width:100%; border-radius:15px}
	#con_tit h3{font-size:2.8rem;}
	#con_tit #location{display:none;}
	#shareSns{position:relative; right:auto; margin-top: .5rem;}
	#shareSns div{z-index:1; left: 50%; transform:translateX(-50%)}
}

@media screen and (max-width:820px){
	h4{letter-spacing:-.1rem; font-size:2.3rem}
	h4:before, h4:after{top: .2rem;}
	.bl02:before{top:0.4rem;}
	.bl03:not(ul):before, .bl03>li:before{top: .6rem;}
	.bl04:not(ul):before, .bl04>li:before{top: .9rem;}
	.tbox{font-size: 1.5rem;}
	#tab{width: 100%; left: 0%; padding: .6rem; border-radius:.8rem; overflow-x:auto}
	#tab ul{white-space: nowrap;}
	#tab ul>li.on a{font-weight:bold}

 	.tableBox{position: relative; overflow-x:auto}
	.tableBox:before{display: block; content: ''; ; opacity: 1; position: absolute; top:max(20%, 50px); left: 50%; margin-left: -50px; width: 100px; height: 100px; background:url(/annex/img/sub/ic_scroll.png) no-repeat center 10%/50%, rgba(0,0,0,.8); border-radius:600px; animation:tableBox 2s linear infinite alternate; transition:opacity linear .5s }
	.tableBox.on:before{opacity: 0; z-index: -1;}
	@keyframes tableBox{
	 0%{background-position: 10% center}
	 100%{background-position:right 10% center}
	}
	.tableBox table{min-width: 800px}
	.data td, .data th{font-size:clamp(11px, 3vw, 14px)}
	table .tableIn>div{flex-direction:column}
	table .tableIn>div>*+*{border-left:0px; border-top:1px solid #e5e5e5}
}