@import url('/sites/minwon/masterSkin/minwon_ms_M/css/master.css');

/**[Layout]********************************************************/
.menuUItop ul.ul_1 li.li_1:after {background-color: #e7e7e7;}
.menuUItop .div_2 .ul_2 li a {color: #7b7b7b;}
.menuUItop .div_3 .ul_3 li.li_3 a._active {text-decoration:underline; font-weight:500; color: #147ACA;}

#_wrap #_wrapArticle #_container {position: relative; display:flex; max-width: 1220px; padding:0 10px; margin: 0 auto; z-index: 1;}
#_wrap #_wrapArticle #_container:before ,
#_wrap #_wrapArticle #_container:after {content: ""; display: block; clear: both;}
#_wrap #_wrapArticle #_container #_content {position: relative; width:100%; padding: 20px 4px 80px; overflow:hidden;}
@media screen and (max-width : 1024px){ /* tablet, mobile */
  #_wrap #_wrapArticle #_container #_content {margin:0; padding: 24px 0 60px;}
}

/* 서브페이지 책갈피기능 관련 추가 */
 #_wrap #_wrapArticle #_container #_content,
._contentBuilder ._obj{overflow: visible;} 


/** 사이드메뉴 ******************************************************/
#_aside{flex:none; width:250px; margin-right:60px; padding:20px 0; overflow:hidden;} /* 기존 width:276px */
.menuSubTitleUI{display: flex; justify-content: center; align-items: center; width:100%; height:110px; margin-bottom:20px; background:url('../images/aside_bg_02.png') center no-repeat; background-size:contain;}
.menuSubTitleUI strong{font-size:25px; font-weight:bold; color:#fff;}

.menuUIsub a:focus{outline-offset: -4px;}

.menuUIsub .div_2 {position: relative;}
.menuUIsub .div_2 .li_2{border-bottom:1px solid #cdd1d5;}
.menuUIsub .div_2 .li_2 + .li_2{margin-top:2px;}
.menuUIsub .div_2 .li_2 .a_2{position:relative; display:block; padding:16px 32px 16px 8px; font-size:17px; font-weight:bold;}
.menuUIsub .div_2 .li_2 .a_2:before {content: ""; display: inline-flex; position: absolute; bottom: -1px; left: 0; width: 0; height: 3px; background-color: #063a74; transition: 0.4s ease-in-out;}
.menuUIsub .div_2 .li_2 .a_2:after{content: ""; display:block; position:absolute; right:8px; top:16px; width:20px; height:20px; vertical-align: middle; background: url(../images/gnb_ico.png) center no-repeat; transition: transform 0.3s ease;}
.menuUIsub .div_2 .li_2:not(._useChildDiv) .a_2:after{display:none;}
.menuUIsub .div_2 .li_2 .a_2:hover{background-color:#eef2f7;}
.menuUIsub .div_2 .li_2 .a_2:hover:before {width: 100%;}

.menuUIsub .div_2 .li_2._active .a_2{color:#052b57;}
.menuUIsub .div_2 .li_2._active .a_2:before{width: 100%;}
.menuUIsub .div_2 .li_2._active .a_2:after { background-image: url(../images/gnb_ico_on.png); transform: rotate(180deg);}

.menuUIsub .div_3 {display:none; padding:8px 0;}
.menuUIsub .div_3 .tit_3{display:none;}
.menuUIsub .div_3 .li_3 + .li_3{margin-top:2px;}
.menuUIsub .div_3 .li_3 .a_3{position:relative; display:block; padding:8px 32px; border-radius:6px;}
.menuUIsub .div_3 .li_3 .a_3:before{content:''; position:absolute; left:16px; top:17px; width:3px; height:3px; border-radius:100%; background-color:#1e2124;}
.menuUIsub .div_3 .li_3._useChildDiv .a_3:after {content: ""; position: absolute; top: 10px; right: 8px; width: 20px; height: 20px; vertical-align: middle; background: url(../images/gnb_ico.png) center no-repeat; transition: transform 0.3s ease;}
.menuUIsub .div_3 .li_3 .a_3:hover{background-color:#eef2f7;}

.menuUIsub .div_2 .li_2._active .div_3{display:block;}
.menuUIsub .div_3 .li_3._active .a_3{background-color:#eef2f7; font-weight:bold; color:#052b57;}

.menuUIsub .div_2 .li_2 .a_2.on{color:#052b57;}
.menuUIsub .div_2 .li_2 .a_2.on:before{width: 100%;}
.menuUIsub .div_2 .li_2 .a_2.on:after { background-image: url(../images/gnb_ico_on.png); transform: rotate(180deg);}
.menuUIsub .div_2 .li_2 .a_2.on .div_3{display:block;}

.menuUIsub .div_4{position:absolute; top:0; right:-100%; width:100%; height:100%; background-color:#fff; z-index:2; transition: .4s ease-in-out;}
.menuUIsub .div_4.on{display:block; right:0;}

.menuUIsub .div_4 .tit_4{display: block; padding-left: 30px; font-size: 19px;}
.menuUIsub .div_4 .ul_4{margin-top:16px; padding:16px 0; border-top:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; }
.menuUIsub .div_4 .li_4 + .li_4 {margin-top: 2px;}
.menuUIsub .div_4 .li_4 .a_4 {position: relative; display: block; padding: 8px 32px; border-radius: 6px;}
.menuUIsub .div_4 .li_4 .a_4:before{content: ''; position: absolute; left: 16px; top: 17px; width: 3px; height: 3px; border-radius: 100%; background-color: #1e2124;}
.menuUIsub .div_4 .li_4._active .a_4 {background-color: #eef2f7; font-weight: bold; color: #052b57; outline-offset: -2px;}

.menuUIsub .div_4 .back-btn{position: absolute;  top: 4px; left: 0; width:20px; height:20px; background: url(../images/gnb_ico.png) center no-repeat; transform: rotate(90deg);}

@media screen and (max-width : 1024px){ /* tablet 이하 */
  #_aside{display:none;}
}

/**페이지네비게이션********************************************************/
#masterNavigation {position: relative; width: 100%;}
#masterNavigation .navi_cont {display: flex; justify-content: space-between; align-items: center;}
#_pageNavigation{display:flex; align-items:center;}
#_pageNavigation > li {position: relative; display:flex; align-items: center; float: none; margin-left: 0;}
#_pageNavigation > li:after {content: ''; display:block; width: 16px; height: 16px; background: url('../images/ico_angle.png') right center no-repeat;}
#_pageNavigation > li a {display: block; padding: 2px 6px; font-size: 15px; text-decoration:underline; text-underline-position: under; color:#1e2124;}
#_pageNavigation > li:last-child{margin-right:0;}
#_pageNavigation > li:last-child:after {display:none;}

#_pageNavigation > li.home{padding-left:20px;}
#_pageNavigation > li.home:before {content:''; position:absolute; left:0; top:5px; width:16px; height:16px; background: url('../images/ico_bread_home.png') center no-repeat;}

@media screen and (max-width : 768px){ /*** mobile***/
  #_pageNavigation > li:not(.home):not(:last-child) {display: none;}
  #_pageNavigation > li:last-child:before{content:'···'; display:inline-block;}
  #_pageNavigation > li:last-child .navTitle a{display:flex; align-items:center;}
  #_pageNavigation > li:last-child .navTitle a:before{content:''; display:block; width: 16px; height: 16px; background: url('../images/ico_angle.png') right center no-repeat;}
  
  #_pageNavigation > li a{padding:2px 4px; font-size:13px;}
  
  #_pageNavigation > li.home:before{top:4px;}
}

/* 화면크기, 프린트 기능 */
#NaviBtn{display:flex;}
#_globalNavi #_globalUl li._zoom{display:none;}
#_globalNavi #_globalUl li._zoom ._zoomReset{font-size:17px  !important;}
#_globalNavi #_globalUl li._zoom ._zoomOut, #_globalNavi #_globalUl li._zoom ._zoomReset, #_globalNavi #_globalUl li._zoom ._zoomIn, #_globalNavi #_globalUl li._print ._printPage{color:#1e2124 !important;}
#_globalNavi #_globalUl li._print ._printPage{height:40px !important; background: #fff url('../images/ico_printer.png') center no-repeat !important; border: 1px solid #D8D8D8 !important; border-radius: 8px;}
@media screen and (max-width : 1024px){ /* tablet 이하 */
  #_globalNavi{display: none;}
}

/* sub page SNS공유, 즐겨찾기 기능 */
#shareBox {margin-left:8px; z-index: 2;}
#shareBox ul > li{position: relative; margin-left: -3px;}
#shareBox ul > li > button {width: 40px; height: 40px; background: #fff url('../images/ico_share.png') center no-repeat; border: 1px solid #D8D8D8; border-radius: 8px;}
#shareBox > ul > li > button.share.on {background-color: #d6e0eb;}
#shareBox .box_sns {display: none; position: absolute; right: 0px; top: 50px; width: 320px; padding: 10px 0 0 15px; border: 1px solid #cecece; background: #fff; text-indent: 0; z-index: 990;}
#shareBox .box_sns button.close {position: absolute;  top: 10px;  right: 10px;  width: 24px;  height: 24px; background: url('../images/icon_close.png') center center no-repeat; background-size: cover;}
#shareBox .list_sns,
#shareBox .list_share {display: inline-block; width: 100%; text-indent: 0;}
#shareBox dt {width: 20%; font-size: 0.85em; color: #353535;}
#shareBox dd {width: 77%;}
#shareBox .list_sns dt {margin-top: 3px;}
#shareBox .list_sns dt,
#shareBox .list_sns dd {float: left;}
#shareBox .list_sns ul {display: inline-block;}
#shareBox .list_sns ul li {display: inline-block; width: 25px; height: 25px; margin-right: 8px; vertical-align: middle;
  background: url('../images/btn_sns.png') 0 0 no-repeat; cursor: pointer;
}
#shareBox .list_sns ul li a {display: block; width: 25px; height: 25px; overflow: hidden;}
#shareBox .list_sns ul li.btn_fb { background-position: 0 0; }
#shareBox .list_sns ul li.btn_tw { background-position: -30px 0; }
#shareBox .list_sns ul li.btn_ks { background-position: -60px 0; }
#shareBox .list_sns ul li.btn_pr { background-position: -90px 0; }

#shareBox .list_share dt,
#shareBox .list_share dd,
#shareBox .list_share dd ul li {float: left;}
#shareBox .list_share dt {padding: 5px 0;}
#shareBox .list_share ul {display: inline-block; width: 100%;}
#shareBox .list_share ul li.first {width: 80%; min-width: 180px; height: 30px;}
#shareBox .list_share ul li.last {float: right; width: 20%;}
#shareBox .list_share label.labelH {position: absolute; top: 0; left: 0; text-indent: -5000px; width: 1px; height: 1px;}
#shareBox .list_share input {width: 100%; height: 27px; line-height: 27px; border: 1px solid #cecece; text-indent: 5px;}
#shareBox .list_share a {display: block; width: auto; height: 29px; margin-left: 5px; padding: 0 5px; background: #707070; line-height: 29px; text-align: center; font-size:14px; color: #fff;}
#shareBox .list_share a:hover {color: #ffcc00 !important;}

.ft_sns{display:none}

@media screen and (max-width : 1024px){
 	#shareBox {margin-left:0;}
	#shareBox .box_sns{top: 35px}
  
	.ft_sns{position: relative;display: block;}
	.ft_sns img{position:absolute; bottom: 30px; right: 22%; z-index: 99;}
}
/******************* containerHeader  *****************************************************************/
#_containerHeader {position: relative; margin: 20px auto 24px;}
#_containerHeader .depth2H {font-size: 40px; letter-spacing: -1px; color: #053863;}

@media screen and (max-width : 1024px){ /*** mobile***/
	#_containerHeader {margin: 12px 4px 20px;}
	#_containerHeader .depth2H {font-size: 28px;}
}

/**[탭메뉴]********************************************************/
/* 4차메뉴 */
.menuUItab .div_4 {margin-bottom: 20px;}
.menuUItab .div_4 > .ul_4.noline {border-top: 0;}
.menuUItab .div_4 > .ul_4 {display: flex; margin-bottom: 30px;position: relative; width: 100%;}
.menuUItab .div_4 > .ul_4 > li {flex:1; display:flex; background-color: #f6f6f6; border-top:1px solid #dbdbdb; border-right: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb;}
.menuUItab .div_4 > .ul_4 > li:first-child{border-left: 1px solid #dbdbdb; border-top-left-radius: 8px; border-bottom-left-radius: 8px;}
.menuUItab .div_4 > .ul_4 > li:last-child {border-right: 1px solid #dbdbdb; border-top-right-radius: 8px; border-bottom-right-radius: 8px;}
.menuUItab .div_4 > .ul_4 > li:hover{background-color:#eef2f7;}
.menuUItab .div_4 > .ul_4 > li > a {position: relative; overflow: hidden; width:100%; padding:16px 20px 16px 16px; font-size: 19px; font-weight:bold; color:#464c53;}

.menuUItab .div_4 .mt_1, .menuUItab .tab_div_5 .mt_2, .div_5 {display: none;}
.menuUItab .div_4 .mt_1,
.menuUItab .div_4 > .ul_4 > li._active,
.menuUItab .div_4 > .ul_4 > li._active._useChildDiv._on {background: #063a74 url('../images/tab_4_active.png') right bottom no-repeat !important;}
.menuUItab .div_4 > .ul_4 > li._active._useChildDiv > a:after {display: none;}
.menuUItab .div_4 > .ul_4 > li._active > a,
.menuUItab .div_4 > .ul_4 > li._active._on > a {color: #fff !important; border-right: 0; outline-offset:2px;}

@media screen and (max-width : 768px){ /*** mobile***/
	.menuUItab .div_4 {position: relative;}
	.menuUItab .div_4 .mt_1 {display: block; width: 100%; text-align: left; font-size:19px; color: #fff !important; padding: 16px 40px 16px 20px; border-radius:8px; box-sizing: border-box; margin-bottom: 20px; background-image: url('../images/tab_4_active_mobile.png') !important;}
  	.menuUItab .div_4 .mt_1:focus{outline: 2px solid #fff; outline-offset: -5px;}
	.menuUItab .div_4 > .ul_4 {display: none;}
	.menuUItab .div_4 .ul_4._on {display: block; position: absolute; top: 55px; z-index: 2; background: #fff;}
	.menuUItab .div_4 .ul_4 .li_4 {float: none;	width: 100%; margin: 0 auto;}
	.menuUItab .div_4 .ul_4 .li_4 .a_4 {border-top: 0 !important; border: 0;}
	.menuUItab .div_4 .ul_4._on {border: 2px solid #054780; border-radius:8px; overflow:hidden;}
	.menuUItab .div_4 > .ul_4 > li {width: 100% !important; background: #fff; border: 0;}
	.menuUItab .div_4 > .ul_4 > li > a {color: #464646; font-weight: 200; padding: 9px 0 9px 20px;}
	.menuUItab .div_4 > .ul_4 > li._active {background: #587186 !important; border: 0; border-radius:0;}
}

/* 5차메뉴 */
.menuUItab .tab_div_5		{width: 100%;}
.menuUItab .tab_div_5 ul {position: relative; margin-top:20px; overflow:hidden;}
.menuUItab .tab_div_5 ul:after		{content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background-color: #d6d6d6; z-index: -1;}
.menuUItab .tab_div_5 .ul_5 li		{display: inline-table; vertical-align: bottom; position: relative;}
.menuUItab .tab_div_5 .ul_5 li > a		{display: table-cell; vertical-align: top; border-bottom: 2px solid #d6d6d6; color: #585858; font-size: 16px; /*padding: 20px 20px 25px 20px;*/ padding: 10px 20px 15px 20px; position: relative;}
.menuUItab .tab_div_5 .ul_5 li > a:after	{content: ""; position: absolute; top: 26px; right: 0; background-color: #d6d6d6; width: 1px; height: 13px;}
.menuUItab .tab_div_5 .ul_5 li._active > a		{border-bottom: 2px solid #002e8d; color: #002e8d; font-weight: 400;}
.menuUItab .top_div_5 .ul_5 li._active:after	{content: ""; position: absolute; bottom: 10px; left: 50%; margin-left: -4px;  background: url('../images/contents/tab_4_over.png') left top no-repeat; width: 9px; height: 5px;}
.menuUItab .tab_div_5 .ul_5 li:last-child > a:after 	{display: none;}
.menuUItab .tab_div_5 .ul_5 li._active:after	{content: "";position: absolute;bottom: 10px;left: 50%;margin-left: -4px;background: url('/sites/moj/images/contents/tab_4_over.png') left top no-repeat;width: 9px;height: 5px;}


/* 스피너 */
.overlay {position: fixed; top: 0; left: 0; display:flex; justify-content: center; align-items: center; width: 100vw; height: 100vh; overflow: hidden; background-color: rgba(0, 0, 0, 0.75); z-index: 1000;}
.krds-sch-spinner {position: absolute; top: 50%; left: 50%; width: 80px; height: 80px; border: 6px solid #cdd1d5; border-top: 6px solid #256ef4; border-radius: 48px; animation: spin 0.7s linear infinite; transform: translate(-50%, -50%); box-sizing: border-box;}
@keyframes spin {
    0% {transform: translate(-50%, -50%) rotate(0deg);}
    100% {transform: translate(-50%, -50%) rotate(360deg);}
}
.spinner-txt{position: absolute; top: calc(50% + 60px); text-align: center; font-size: 17px; color: #fff;}