/* #wrap {min-width: 360px;} */
/* #container {margin-top: 12rem;} */

/* header */
.headerWrap { width:100%; height: 4.8em; /*min-width: 360px;*/ transition: background-color .3s; position: fixed; top: 0; left: 0; z-index: 102; background-color: #fff;}
.headerWrap .overBg { content:""; position:absolute; top: 4.8em; left:0; z-index: -1; width:100%; height:0; background: #ccc; border-top: 1px solid #cbcbcb;}
.header { width:100%; max-width: var(--contents-wrap-size); margin:0 auto; }
.header .btn-consulting {display: block; padding: .5em 1.6em; background-color: #d65702; color: #fff; border-radius: 5rem; font-weight: var(--fontBold); font-size: var(--fz-body-md); text-transform: uppercase;}
.header .btn-consulting:hover {text-decoration: none;}

.headBottom { width:100%; display:flex; justify-content: center; position: relative; align-items: center;}
.headBottom h1.logo { position: absolute; top: 1em; left:0; }
.headBottom h1.logo a { width: 13.2em; height: 2.6em; display:block; background: url(../img/logo_b.svg) no-repeat center center; }
.headBottom nav .gnb { position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.headBottom .gnb a.gnb__btn__sitemap { width: 2em; height: 1.8em; position: relative; display: flex; align-items: center; justify-content: flex-end; }
.headBottom .gnb a.gnb__btn__sitemap em { width: 1.6em; height: 1px; background-color: #222;}
.headBottom .gnb a.gnb__btn__sitemap em::before { content:""; position:absolute; top:5px; left:0; width: 2em; height: inherit; background-color: #222;}
.headBottom .gnb a.gnb__btn__sitemap em::after { content:""; position:absolute; bottom:5px; right:0; width: 2em; height: inherit; background-color: #222;}
.headBottom .gnb a.mobMenuBt { display: none; }

/* PC : NAVI */
.headBottom nav {}
.headBottom nav .lnb { display: flex; gap: 6rem; transition: all .3s ease;}
.headBottom nav .lnb .lnbDepth1__wrap {position: relative;}
.headBottom nav .lnb .lnbDepth1__wrap .lnbDepth1 {width: auto; height: 9.6rem; font-size: 2.4rem; font-weight: var(--fontSemiBold); letter-spacing: 0; color:#222; position: relative; display: flex; align-items: center; text-decoration: none; justify-content: center;}
.headBottom nav .lnb .lnbDepth1__wrap .lnbDepth1:after { content:""; position:absolute; left:50%; bottom:0; transform: translateX(-50%); width:0; height:5px; background:#cc5621; transition: all .3s; }
.headBottom nav .lnb .lnbDepth1__wrap .lnbDepth1.active:after,
.headBottom nav .lnb .lnbDepth1__wrap .lnbDepth1:hover::after { width:100%; }
/* 2depth bg + title */
.headBottom nav .lnb .desktop__fullmenu { width: 100%; height: 0; position: absolute; top: 9.6rem; left:0; overflow: hidden; }
.headBottom nav .lnb .desktop__fullmenu > div { display: flex; width:100%; min-height:24rem; }
.headBottom nav .lnb .desktop__fullmenu > div .menuTit { display: none; }
.headBottom nav .lnb .desktop__fullmenu > div section {flex:1;}
/* 2depth menu */
.headBottom nav .lnb .fullDepth1__items {padding-top: 3rem; display: grid; row-gap: 1rem; text-align: center;}
.headBottom nav .lnb .fullDepth1__items .fullDepth1__item { height: auto; }
.headBottom nav .lnb .fullDepth1__items .fullDepth1__btn { color:#222; font-size: 2rem; font-weight: var(--fontMedium); text-decoration: none; }
.headBottom nav .lnb .fullDepth1__items .fullDepth1__btn:hover,
.headBottom nav .lnb .fullDepth1__items .fullDepth1__btn:focus { color: #d65702; text-decoration: underline;}
/* hover + active */
.headerWrap .menu-active .overBg {background-color: #fff; box-shadow: 0 10px 8px rgba(0,0,0,.52); height: 24rem;}
.headerWrap .menu-active .headBottom nav .lnb {gap: 4rem;}
.headerWrap .menu-active .headBottom nav .lnb .lnbDepth1__wrap {width: 200px;}
.headerWrap .menu-active .headBottom nav .lnb .desktop__fullmenu {overflow: visible;}

/* Mobile NAVI */
.mobileLnb {position: fixed; top: 0; right: -100%; width: 50%; height: 100vh; z-index: 100; background-color: #fff;  color: #292929; transition: right 0.3s ease-in-out; overflow-y: auto; display: none; backdrop-filter: blur(3px);}
.mobileLnb .mlnbClose { width:100%; height: 4.9em; padding: 0 4rem; display:flex; justify-content: space-between; align-items: center; position: relative; border-bottom: 1px solid #c3c3c3;}
.mobileLnb .mlnbClose .mlnbCloseBt { position: absolute; top: 50%; right: 2rem; transform: translateY(-50%); width: 32px; height: 32px; padding: 0; background: none; border: none; cursor: pointer; }
.mobileLnb .mlnbClose .mlnbCloseBt::before,
.mobileLnb .mlnbClose .mlnbCloseBt::after { content: ''; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background-color: #8c8c8c; transform-origin: center; }
.mobileLnb .mlnbClose .mlnbCloseBt::before { transform: translateY(-50%) rotate(45deg); }
.mobileLnb .mlnbClose .mlnbCloseBt::after { transform: translateY(-50%) rotate(-45deg); }

.mlnb { display:flex; flex-direction: column; padding: 4rem; gap: 1rem;}
.mlnb > li { width:100%; }
.mlnb > li > a.mlnbDepth1 { display:flex; width:100%; height: 6rem; font-size: 2.6rem; font-weight: var(--fontBold); text-decoration: none; align-items: center; border-bottom: 1px solid #e6e6e6;}
.mlnb > li > .mlnbSub { display:none; }
.mlnb .mlnbSubTit {display: none;}

.mlnb .mlnbSub > ul { display:flex; flex-direction: column; gap: 2rem; padding: 1.5rem 0; border-bottom: 1px solid #e6e6e6;}
.mlnb .mlnbSub > ul > li { width:100%; }
.mlnb .mlnbSub > ul > li a { display: flex; width:100%; align-items: center; font-size: 2.2rem; font-weight: var(--fontSemiBold); padding: 0 1rem;}
.mlnb .mlnbSub > ul > li > ul {margin-top: 16px; display: none;}
.mlnb .mlnbSub > ul > li > ul > li {margin-top: 5px;}
.mlnb .mlnbSub > ul > li > ul > li a {display: flex; align-items: center; gap: 0 5px; padding: 0 1.6rem; border-radius: 5px; font-weight: var(--fontSemiBold);}
.mlnb .mlnbSub > ul > li > ul > li a::before  {content: ''; flex-shrink: 0; display: block; width: 5px; height: 5px; background-color: #ad988e; border-radius: 100%;}
.mlnb .mlnbSub > ul > li a.active, 
.mlnb .mlnbSub > ul > li a:hover	{color:#d65702; text-decoration: none;}

.mlnb > li > a.mlnbDepth1 {background: url(../img/mob_open.svg) 96.66% center no-repeat;}
.mlnb > li > a.mlnbDepth1.active { color:#d65702; background: url(../img/mob_close.svg) 96.66% center no-repeat;}
.mlnb > li > a.mlnbDepth1.active + .mlnbSub	{ display:block; }
.mlnb > li a.mlnbDepth3 {  }
.mlnb > li a.mlnbDepth3.active {  }
.mlnb .mlnbSub > ul > li > ul > li a.active {text-decoration: underline;}
.mlnb .mlnbSub > ul > li > ul > li a.active::before {background-color: #ff6c18;}

@media (max-width: 1660px) {
	.header {padding: 0 2em;}
}
@media (max-width: 1440px) {
	.headBottom nav .lnb,
	.headBottom nav .gnb .btn-consulting {display: none;}
	.headBottom nav .gnb {top: 1.5em; transform: unset;}
	.headBottom .gnb a.mobMenuBt { display: flex; }
	.mobileLnb {display: block;}
}
@media (max-width: 1024px) {
	.headerWrap {height: 7.2rem;}
	.headerWrap .overBg {top: 7.2rem;}
	.header {padding: 0 1em;}
	.headBottom h1.logo a {width: 20rem; height: 4.1rem;}
	.headBottom .gnb a.gnb__btn__sitemap { width:3.3rem; height:2.0rem; }
	.headBottom .gnb a.gnb__btn__sitemap em { width:2.6rem;}
	.headBottom .gnb a.gnb__btn__sitemap em::before	{ top:0; width:3.3rem;}
	.headBottom .gnb a.gnb__btn__sitemap em::after	{ bottom:0; width:3.3rem;}

	.mobileLnb .mlnbClose {height: 7.2rem; padding: 0 2rem;}
	.mlnb > li > a.mlnbDepth1 {font-size: 2.4rem;}
	.mlnb .mlnbSub > ul > li a {font-size: 1.8rem;}
}
@media (max-width: 768px) {
	.headerWrap {height: 6.4rem;}
	.headerWrap .overBg {top: 6.4rem;}
	.headBottom h1.logo a {width: 16rem; height: 3.2rem;}
	.headBottom nav .gnb {top: 1.25em;}
	.mobileLnb {width: 100%;}
}

/* sitemap */
.sitemap {width: 100%; max-width: var(--contents-inner); padding: 3.75em 0; margin: 0 auto;}
.sitemap > ul {display: flex; justify-content: space-between;}
.sitemap > ul > li > span {font-weight: var(--fontBold);}
.sitemap > ul > li > ul {margin-top: 1.6rem; display: flex; flex-direction: column; gap: 1rem;}

@media (max-width: 1660px) {
	.sitemap {padding-inline: 4rem;}
}
@media (max-width: 1440px) {
	.sitemap {padding-block: 3em;}
}
@media (max-width: 1024px) {
	.sitemap {padding-inline: 1em;}
}
@media (max-width: 768px) {
	.sitemap {display: none;}
}

/* footer */
#footer {width:100%; max-width: var(--contents-wrap-size); padding: 3.4em 0; margin: 0 auto;}
#footer .inner {display: flex; gap: 5em; position: relative;}
#footer .inner .ft-logo {width: 12em; height: 2.35em; display:block; background: url(../img/logo_b.svg) no-repeat center center;}
#footer .inner .addr-info {padding-top: 1rem;}
#footer .inner .addr-info cite {display: block; margin-top: .5rem;}
#footer .inner .social-link {display: inline-flex; gap: 1.2rem; position: absolute; bottom: 0; right: 0;}
#footer .inner .social-link a {display: block; width: 2.25em; height: 2.25em;}

.topBtn { position:fixed; bottom: 10rem; right:1rem; width: 5.6rem; height: 5.6rem; background-color:#222; color: #ff6c00; font-weight: 600; font-size: 2.4rem; border-radius:50%; display:flex; align-items: center; justify-content: center; z-index: 101; }
.topBtn:hover, .topBtn:focus { text-decoration: none; }

@media (max-width: 1660px) {
	#footer {padding: 3.4em 2em;}
}
@media (max-width: 1440px) {
	#footer .inner {flex-direction: column; gap: 1rem;}
}
@media (max-width: 1024px) {
	#footer {padding: 2em 1em;}
	#footer .inner .ft-logo {width: 20rem; height: 4.1rem;}
	#footer .inner .social-link {position: static;}
	.topBtn	 { bottom:4rem; right:1rem; width:4.5rem; height:4.5rem; }
}
@media (max-width: 768px) {
	#footer .inner .ft-logo {width: 16rem; height: 3.2rem;}
}

/* sub layout */
#container {--lnbTitle-fs: 3.8rem; --lnbDepth2-fs: 2.2rem; --lnbDepth-color: #222; --lnbDepth-color1: #d65702; --lnbDepth-color2: #cf4000; --pageHead-title: 4.8rem; --page-title-color: #111;}

#container div[class^="sub-visual"] {width: 100%; height: 100vh; display: flex; align-items: flex-end; background-position: bottom center !important; background-size: cover; background-repeat: no-repeat; background-attachment: fixed;}
#container div[class^="sub-visual"] .inner {width: inherit; height: calc(100vh - 4.8em); display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff;}
#container div[class^="sub-visual"] h2 {font-weight: var(--fontExtraBold); font-size: 3em;}
#container div[class^="sub-visual"] p {font-weight: var(--fontExtraBold); font-size: 1.2em; color: #e95200; letter-spacing: 0;}

#container .sub-visual1 {background-image: url("../img/sub_visual1.jpg");}
#container .sub-visual0201 {background-image: url("../img/sub_visual0201.jpg");}
#container .sub-visual0202 {background-image: url("../img/sub_visual0202.jpg");}
#container .sub-visual0203 {background-image: url("../img/sub_visual0203.jpg");}
#container .sub-visual0204 {background-image: url("../img/sub_visual0204.jpg");}
#container .sub-visual030100 {background-image: url("../img/sub_visual030100.jpg");}
#container .sub-visual030101 {background-image: url("../img/sub_visual030101.jpg");}
#container .sub-visual030102 {background-image: url("../img/sub_visual030102.jpg");}
#container .sub-visual030103 {background-image: url("../img/sub_visual030103.jpg");}
#container .sub-visual030104 {background-image: url("../img/sub_visual030104.jpg");}
#container .sub-visual030105 {background-image: url("../img/sub_visual030105.jpg");}
#container .sub-visual030106 {background-image: url("../img/sub_visual030106.jpg");}
#container .sub-visual0302 {background-image: url("../img/sub_visual0302.jpg");}
#container .sub-visual0303 {background-image: url("../img/sub_visual0303.jpg");}
#container .sub-visual0401 {background-image: url("../img/sub_visual0401.jpg");}
#container .sub-visual0402 {background-image: url("../img/sub_visual0402.jpg");}
#container .sub-visual0403 {background-image: url("../img/sub_visual0403.jpg");}

#container .s-inner, #container .bo-inner {width: 100%; max-width: var(--contents-wrap-size); padding: 5.4rem 0 10rem; margin: 0 auto;}
#container .bo-inner {padding: 15rem 0 10rem;}
#container .s-inner::after, #container .bo-inner::after {content: ''; display: block; clear: both;}
#container .lnb {float: left; width: 30rem;}
#container .contents {float: right; width: calc(100% - 37rem); height: auto; position: relative;}

/* sub : side menu */
#container .lnb h2 {padding: 0 1rem 1.2rem; font-weight: var(--fontBold); font-size: var(--lnbTitle-fs); color: #362923; border-bottom: 2px solid #f17931; background-position: top right; background-repeat: no-repeat;}
#container .lnb > ul {margin-top: 1rem;}
#container .lnb > ul > li {font-weight: var(--fontBold); font-size: var(--lnbDepth2-fs); border-bottom: 1px solid #e2e5eb;}
#container .lnb > ul > li > a {width: 100%; padding: 1.2rem 2.4rem; padding-right: 8px; display: flex; justify-content: space-between; align-items: center; color: var(--lnbDepth-color);}
#container .lnb > ul > li > a i.ph-caret-down {font-size: 1.6rem; transition: 0.3s ease;}
#container .lnb > ul > li > a:hover {text-decoration: none;}
#container .lnb > ul > li > a:hover span {text-decoration: underline;}

#container .lnb > ul > li > ul {padding: 2rem 2.4rem; display: flex; flex-direction: column; gap: 8px 0;}
#container .lnb > ul > li > ul > li > a {display: flex; align-items: center; gap: 6px; font-weight: var(--fontSemiBold); color: var(--lnbDepth-color);}
#container .lnb > ul > li > ul > li > a::before {content: ''; display: block; width: 5px; height: 5px; border-radius: 5px; background-color: #ad988e;}

#container .lnb > ul > li.active {border-bottom: 0;}
#container .lnb > ul > li.active > a {background-color: var(--lnbDepth-color1); color: white; border-radius: 4px;}
#container .lnb > ul > li.active > a i.ph-caret-down {transform: rotate(-180deg);}
#container .lnb > ul > li.active > ul > li.active a {color: var(--lnbDepth-color2);}
#container .lnb > ul > li.active > ul > li.active a::before {background-color: #ff6c18;}

/* sub : breadcrumb */
.doc-info ol {width: 100%; display: flex; align-items: center;}
.doc-info ol li {display: inline-flex; align-items: center; font-size: 1.8rem;}
.doc-info ol li:not(:last-child)::after {content: '>'; display: inline-flex; align-items: center; justify-content: center; width: 2.4rem; height: 2.4rem; color: #9eaae7; font-size: 12px; font-family: 'Gulim';}
.doc-info ol li a {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; word-wrap: break-word; -webkit-line-clamp: 1; line-height: 1.6;}
.doc-info ol li.home a {width: 1.5em; height: 1.5em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23000' d='M14.5 15.5a.5.5 0 0 1 0 1H9.3a.5.5 0 0 1 0-1z'/%3E%3Cpath fill='%23000' fill-rule='evenodd' d='M21.7 11.4q.3.3 0 .7l-.5.3-.3-.2-1.3-1.2v7c0 1.5-1.2 2.7-2.6 2.7H6.8A2.6 2.6 0 0 1 4 18v-6.8l-1.1 1q-.4.3-.8 0v-.7l2-1.7.1-.2 7.2-6.5.2-.1h.7zM7.4 8.2l-2.2 2v7.9q0 1.4 1.6 1.5H17q1.4 0 1.5-1.5v-7.9l-6.7-6z' clip-rule='evenodd'/%3E%3C/svg%3E") center / cover no-repeat;}

/* sub : page title */
.page-title-wrap {padding: 4rem 0 2rem;}
.page-title-wrap .h-tit {font-weight: var(--fontBold); font-size: var(--pageHead-title); color: var(--page-title-color);}

@media (max-width: 1660px) {
	#container .s-inner, #container .bo-inner {padding-inline: 4rem;}
	#container .contents {width: calc(100% - 35rem);}
}
@media (max-width: 1440px) {
	#container {--pageHead-title: 4.2rem;}
	/* #container div[class^="sub-visual"] {height: 32rem;} */
    #container .lnb {display: none;}
	#container .contents {width: 100%;}
	.page-title-wrap {padding-top: 3.2rem;}
}
@media (max-width: 1024px) {
	#container { --pageHead-title: 3.6rem; }
	#container .s-inner, #container .bo-inner {padding-inline: 1em;}
	#container .s-inner {padding-top: 3rem;}
	#container .bo-inner {padding-top: 12.8rem;}
	#container div[class^="sub-visual"] {height: 32rem; background-position: top center !important; background-attachment: local;}
	#container div[class^="sub-visual"] .inner {height: calc(100% - 7.2rem);}
	#container div[class^="sub-visual"] h2 {font-size: 3.2rem;}
	#container div[class^="sub-visual"] p {font-size: 2rem;}
	.page-title-wrap {padding: 2.4rem 0 1.4rem;}
}
@media (max-width: 768px) {
	#container div[class^="sub-visual"] .inner {height: calc(100% - 6.4rem);}
	#container .bo-inner {padding-top: 9.4rem;}
}
@media (max-width: 568px) {
	#container div[class^="sub-visual"] h2 {font-size: 2.8rem;}
	#container div[class^="sub-visual"] p {font-size: 1.6rem;}
	.doc-info ol li {font-size: 1.4rem;}
}
