@charset "utf-8";

/* PC */
.web		{display:block !important}
.tablet		{display:none}
.mobile		{display:none}

body.fixed,
html.lock,
html.lock body	{overflow: hidden; height: 100%;}

/* GNB 본문바로가기 */
#quick_Index									{height:0; z-index:1000000000;}
#quick_Index a									{display: block; position: absolute; left: 0; top: -100px; width: 100%; height: 1px; text-align: center}
#quick_Index a:focus,#quick_Index a:active		{position: absolute; top: 0; z-index: 120; height: 45px; padding: 10px 0; font-size: 1.4em; font-weight: 700; color: var(--Primary); background: #fff;}
.all_top	{position:fixed; right:27px; bottom:27px; z-index:999;}
.all_top a	{display:block; width:70px; height:70px; border-radius:50%; text-align:center; background:var(--Primary); color:#fff; font-weight:400; padding-top:35px; box-shadow:4px 4px 6px rgba(0, 0, 0, 0.25)}
.all_top a:before{position:absolute; content:''; background:#fff; width:9px; height:9px;border-radius:50%; left:50%; margin-left:-5px; animation: bounce 0.6s 0.1s cubic-bezier(0, 0, 0.18, 0.99) infinite alternate;}
/* .all_top .allTop{display:none; } */

a.inquiry_form 			{display:block; width:70px; height:70px; font-size: 15px; border-radius:50%; text-align:center; background:#172E55; color:#fff; font-weight:400; padding-top:35px; margin-bottom: 6px; box-shadow:4px 4px 6px rgba(0, 0, 0, 0.25)}
a.inquiry_form:before	{position:absolute; content:''; background:url('/kpc/_img/comn/contact_w.svg') no-repeat 50% 50% / 20px; width:24px; height:24px; left:39%; bottom: 113px; margin-left:-5px; animation: none;}


@keyframes bounce{  
  0% {
        transform: translateY(-10px) scaleX(1.03) scaleY(0.6);
  }
    to{
        transform: translateY(-22px) scaleX(1) scaleY(1);
    }
}

/* 헤더 */
.gnb-backdrop					{display:none;}
body.is-gnb-web .gnb-backdrop	{position:fixed; z-index:0; display:block; top:0; left:0; width:100dvw; height:100vh; background:rgba(0, 0, 0, 0.5)}

nav						{/* position:sticky; */ position:relative; z-index:10;  top: 0; left:0; }
header					{position:fixed; z-index:1; width:100%; display:flex; justify-content: space-between; padding:0 40px; background:#fff; transition:0.65s;}
nav,
header					{min-height:80px;}

header.open				{box-shadow:3px 8px 8px rgba(0, 0, 0, 0.1); background:#fff !important;}
header .default			{display:block}
header .white			{display:none}
header a				{transition:0.2s;}
header .gnb				{display:flex; align-items:center; gap:150px;}
header .tmn				{display:flex; align-items:center; height:100%;}
header .tmn a:hover		{color:var(--Primary);}
header .tmn .dep01		{color:#222; font-size:21px; font-weight:600; padding:6px 25px; border-radius:30px;}
header .tmn .on .dep01	{color:var(--Primary);}
header .tmn > li		{display: flex; align-items: center; height:80px; padding:0 7px;}

header .tmn:has(.is-active) .on .dep01		{color:#222}
header .tmn > li.is-active .dep01			{color:#fff !important; background:#444;}
header .tmn > li div.openMenu				{display:none; overflow:hidden; border-top:1px solid #eee; position:absolute; top:80px; left:300px; z-index:10; width:fit-content; background:#fff; padding:35px 45px; border-radius:0 0 10px 10px; gap:30px; transition:0.65s;}
header .tmn > li.is-active div.openMenu		{display:block;}
header .tmn > li div.openMenu .flex			{display:flex; gap:30px}
header .tmn > li div.openMenu .menu			{background:#fff; position:relative; z-index:1; min-width:150px;}
header .tmn .dep02				{color:#222; font-size:21px; font-weight:600; margin-bottom:15px;}
header .tmn .dep02 a			{display:block; color:#222;}
header .tmn .dep03				{display:flex; flex-direction: column; gap:10px;}
header .tmn .dep03 a			{color:#777; font-size:16px; font-weight:500}
header .tmn .dep02 a:hover,
header .tmn .dep02 a:focus,
header .tmn .dep03 a:hover,
header .tmn .dep03 a:focus		{color:var(--Primary)}

header .tmn .etc						{display:flex; gap:30px; min-width:fit-content; background:#fff; position:relative; border-left:solid 1px #eee; padding-left:30px;}
header .tmn .out_link					{position:relative; min-width:180px; background:#f5f5f5; position:relative; border-left:solid 1px #eee; padding:35px 40px; margin:-35px -45px 0 0}
header .tmn .out_link:after				{position:absolute; content:''; width:100%; height:45px; bottom:-35px; left:-1px; background:#f5f5f5; border-left:solid 1px #eee;}
header .tmn .out_link a					{display:block; color:#333; font-size:18px; font-weight:600; padding-right:40px; position:relative; }
header .tmn .out_link a + a				{margin-top:15px;}
header .tmn .out_link a:after			{position:absolute; content:''; width:24px; height:24px; border-radius:50%; right:0; top:50%; margin-top:-12px; background:url('/kpc/_img/comn/link.svg') no-repeat 100% 50%}
header .tmn .out_link a:hover			{color:var(--Primary);}

header .tmn .etc .video	a.img		{position:relative; width:100%; display:block; border-radius:10px; overflow:hidden;}
header .tmn .etc .video a.img::after{position:absolute; content:''; z-index:1; width:60px; height:60px; border-radius:50%; background:#000 url('/kpc/_img/main/play.svg') no-repeat 55% 50% / 20px; top:50%; left:50%; transform:translate(-50%, -50%)}
header .tmn .etc .video	a.img img	{width:100%;}

.hidden_list			{display:none;}
.hidden_list.active		{display:block;}
.tema_gnb .flex			{min-height:300px;}
.tema_gnb .etc			{min-width:330px !important;}
.tema_gnb_slider		{position:absolute; top:0; left:calc(100% + 60px); overflow:hidden; width:300px; border-radius:10px; padding-bottom:30px;}
.tema_gnb_slider img	{width:100%;}
.tema_gnb_slider .info	{background:#EFEFEF; padding:20px; color:#222; border-radius:0 0 10px 10px}
.tema_gnb_slider .cate	{display:inline-block; background:#fff; padding:4px 10px; border-radius:30px; font-weight:500; font-size:14px; margin-bottom:10px;}
.tema_gnb_slider .txt	{font-weight:400}	

.tema_gnb_slider .swiper-pagination					{bottom:0 !important;}
.tema_gnb_slider .swiper-pagination-bullet-active	{background:#222; width:18px; border-radius:10px;}

.board_gnb .flex		{min-height:200px;}
.board_gnb .etc			{min-width:370px !important;}
.board_gnb_noti			{width:340px;}
.board_gnb_noti a		{display:block; background:#EFEFEF; border-radius:10px; padding:20px; position:relative;}
.board_gnb_noti a::after{position:absolute; content:''; width:24px; height:24px; border-radius:50%; background:#222 url('/kpc/_img/comn/link_w.svg') no-repeat 50% 50%; right:20px; top:20px; transition:0.2s;}
.board_gnb_noti a + a	{margin-top:10px}
.board_gnb_noti a .tit	{color:#222; font-weight:500; font-size:17px; text-overflow: ellipsis; -o-text-overflow: ellipsis; max-width:calc(100% - 30px); overflow: hidden; white-space: nowrap; word-wrap: normal !important; transition:0.2s;}
.board_gnb_noti a .date	{color:#777; font-size:16px; margin-top:5px;}
.board_gnb_noti a:hover:after,
.board_gnb_noti a:focus:after{background-color:var(--Primary)}
.board_gnb_noti a:hover .tit,
.board_gnb_noti a:focus .tit{color:var(--Primary)}

header .tmn .video video{width:270px; border-radius:10px;}
header .tmn .video .tt	{font-weight:500; color:#222; text-align:center; margin-top:10px;}
header .tmn .video .tt a{color:#222;}



/* 1. 툴팁이  */
[data-tooltip], 
#search_Button 				{position: relative !important;  cursor: pointer; overflow: visible !important; /* 부모 요소에 의해 툴팁이 잘리는 것 방지 */}

/* 2. 툴팁 박스 디자인 (아이콘 아래로 노출) */
[data-tooltip]::before 		{content: attr(data-tooltip); position: absolute; top: 110%; left: 50%; transform: translateX(-50%); padding: 6px 10px; background-color: #333; color: #fff; font-size: 17px; line-height: 1.2; border-radius: 4px; white-space: nowrap; /* 기본 상태: 숨김 */ opacity: 0; visibility: hidden; transition: 0.2s ease-in-out; z-index: 999999;}

/* 3. 말풍선 꼬리표 (위쪽을 향하는 삼각형) */
[data-tooltip]::after 		{content: ""; position: absolute; top: 85%; /* 박스 바로 위, 아이콘 바로 아래 */ left: 50%; transform: translateX(-50%); border: 5px solid transparent; border-bottom-color: #333; /* 삼각형 방향: 위쪽 */  /* 기본 상태: 숨김 */ opacity: 0; visibility: hidden; transition: 0.2s ease-in-out; z-index: 999999;}

/* 4. 마우스 올렸을 때 보여주기 */
[data-tooltip]:hover::before,
[data-tooltip]:hover::after {opacity: 1; visibility: visible;}


header .util			{display:flex; align-items:center; gap:25px; min-height:45px;}
header .util > a		{color:#222; font-size:16px;}
header .util > a:hover	{color:var(--Primary) !important;}
header .util a.contact	{margin-right:5px; font-size:0; display:inline-block; width:40px; height:40px; background:url('/kpc/_img/comn/contact.svg') no-repeat 50% 50%;}
header .util a.contact:hover,
header .util a.contact:focus{background-image:url('/kpc/_img/comn/contact_on.svg') !important}

header .util a.tell			{margin-right:5px; font-size:0; display:inline-block; width:40px; height:40px; background:url('/kpc/_img/comn/tell.svg') no-repeat 50% 50%;}
header .util a.tell:hover,
header .util a.tell:focus	{background-image:url('/kpc/_img/comn/tell_on.svg') !important}

/* 검색 */
header div.n_search							{position:relative; display:flex; align-items:center; justify-content: flex-end; width:40px; height:55px; padding:0; border-radius: 100px; transition-duration: 0.5s; }
header div.n_search p.txt					{display:none;}
header div.n_search input					{display:block; height:38px; width: calc(100% - 80px); font-size:16px; color:#333; border:0; background:transparent;}
header div.n_search input:focus				{outline: none;}
header div.n_search input::placeholder				{color: #666b76;}
header div.n_search input::-webkit-input-placeholder{color: #666b76;  opacity: 1 !important; /* for chrome */	}
header div.n_search input:-moz-placeholder			{color: #666b76; /* Firefox 18- */}
header div.n_search input::-moz-placeholder			{color: #666b76; /* Firefox 19+ */}
header div.n_search input:-ms-input-placeholder		{color: #666b76 !important;  /* Internet Explorer 10+ */}
header div.n_search button							{border:0; padding:0; background:transparent; cursor:pointer; width:40px; height:40px; font-size:0; transition: 0.2s;}
header div.n_search button#search_open				{position:absolute; background:url('/kpc/_img/comn/gnb_search.svg') no-repeat 50% 50% ;}
header div.n_search button#search_open:hover,
header div.n_search button#search_open:focus		{background-image:url('/kpc/_img/comn/gnb_search_on.svg') !important}
header div.n_search button.search_close				{display:none; width:30px; height:40px;  background:url('/kpc/_img/comn/tclose.svg') no-repeat 50% 50% ;}

header div.n_search.on button#search_open		{display:none;}
header div.n_search.on button#search_Button		{display:block; background:url('/kpc/_img/comn/gnb_search.svg') no-repeat 50% 50% ;}

header div.n_search.on							{justify-content: flex-start; width:300px; background:#f5f5f5}
header div.n_search.on p.txt					{display:flex; align-items: center; width:100%; padding-left:20px;}
header div.n_search.on button.search_close		{display:block;}


#open_full_menu button.ham_close,
header .util .ham		{display:block; transform: rotate(0) scale(1); transition: all 0.4s;}
#open_full_menu button.ham_close:hover,
header .util .ham:hover	{transform: rotate(360deg) scale(1);}
#open_full_menu button.ham_close.off,
header .util .ham.on	{transform: rotate(360deg) scale(0);}


.Main nav						{position:absolute; width:100%;}
.Main header					{background:none; border-bottom:solid 1px rgba(255, 255, 255, 0.15)}
.Main header .util a.contact	{background-image:url('/kpc/_img/comn/contact_w.svg')}
.Main header .util a.tell	{background-image:url('/kpc/_img/comn/tell_w.svg')}
.Main header div.n_search button#search_open	{background-image:url('/kpc/_img/comn/gnb_search_w.svg')}

.Main[class*="scroll-"] header,
.Main header:has(*:focus),
.Main header:hover,
body.is-gnb-web .Main header					{background:#fff}

.Main[class*="scroll-"] header .util a.contact,
.Main header:has(*:focus) .util a.contact,
.Main header:hover .util a.contact,
body.is-gnb-web .Main header .util a.contact	{background-image:url('/kpc/_img/comn/contact.svg')}

.Main[class*="scroll-"] header .util a.tell,
.Main header:has(*:focus) .util a.tell,
.Main header:hover .util a.tell,
body.is-gnb-web .Main header .util a.tell	{background-image:url('/kpc/_img/comn/tell.svg')}

.Main[class*="scroll-"] header div.n_search button#search_open,
.Main header:has(*:focus) div.n_search button#search_open,
.Main header:hover div.n_search button#search_open,
body.is-gnb-web .Main header div.n_search button#search_open{background-image:url('/kpc/_img/comn/gnb_search.svg')}


.Main header:has(*:focus) .tmn .dep01,
.Main header .tmn .dep01,
.Main header .util > a		{color:#fff}

.Main[class*="scroll-"] header .tmn .dep01,
.Main header:has(*:focus) .tmn .dep01,
.Main header:hover .tmn .dep01,
body.is-gnb-web header .tmn .dep01,
.Main[class*="scroll-"] header .util > a,
body.is-gnb-web .Main header .util > a,
.Main header:has(*:focus) .util > a,
.Main header:hover .util > a{color:#222} 

.Main header .default,
.Main[class*="scroll-"] header .white,
.Main header:has(*:focus) .white,
.Main header:hover .white,
body.is-gnb-web .Main header .white{display:none }


.Main header .white,
.Main[class*="scroll-"] header .default,
.Main header:has(*:focus) .default,
.Main header:hover .default,
body.is-gnb-web .Main header .default{display:block}

/* #wrap[class ^= scroll] nav				{position: relative;}
#wrap[class ^= scroll] header			{position: fixed; top:0; z-index:10;width:100%;}
.scroll-up header						{transform: translateY(0);}
.scroll-down header						{transform: translateY(-100%);} */

.about-nav.active,
.manage .page_tab.fixed,
.Main header .tmn > li div.openMenu,
.scroll-up .sub_visual .page_tab.fixed,
.sub_visual .page_tab.fixed				{top:80px; margin-bottom:0; transform:translateY(0);}

.scroll-down .about-nav.active .page_tab{transform:translateY(-100%);}
.scroll-up .about-nav.active .page_tab	{transform:translateY(80px) !important;}

.history .about-nav.active				{margin:0;}
/* .history .about-nav.active .page_tab	{margin:0; transform:translateY(80px) !important;} */




/* 햄버거 */
#open_full_menu							{display:none; position:fixed; top:0; left:0; z-index:15; width:100%; background:#f9f9f9; text-align:left; table-layout:fixed; min-height:100dvh;}
#open_full_menu	.ham_h1					{border-bottom:solid 1px #eee; flex-wrap:nowrap; display:flex; align-content: center; justify-content: space-between; align-items: center; height:80px; padding:0 40px}
#open_full_menu	.ham_h1 span			{/* margin-top:4px;  */display:block}
#open_full_menu .util 					{}
#open_full_menu .util button.ham_close	{font-size:0; margin-right:15px; width:24px; height:24px; display:block; border:none; cursor:pointer; background:url('/kpc/_img/comn/ham_x.svg')no-repeat 50% 50%; font-size:0;}
#open_full_menu .util a.contact			{margin-right:5px; font-size:0; display:inline-block; width:40px; height:40px; background:url('/kpc/_img/comn/contact.svg') no-repeat 50% 50%;}	
#open_full_menu .util a.tell			{margin-right:5px; font-size:0; display:inline-block; width:40px; height:40px; background:url('/kpc/_img/comn/tell.svg') no-repeat 50% 50%;}
#open_full_menu .ham_body				{width:100%; padding:50px 30px; height:calc(100dvh - 79px); overflow-y:auto; overscroll-behavior: contain;}
#open_full_menu .ham_nav				{margin:0 auto; width:100%; max-width:1350px;}
#open_full_menu ul.menulist				{display:grid; grid-template-columns: repeat(4, minmax(0, 1fr)); flex-wrap:wrap; gap:30px;}
#open_full_menu ul.menulist .dep01,
#open_full_menu ul.menulist .dep01 a	{color:#222; font-size:clamp(18px, 30px, 3vw); font-weight:700;}

#open_full_menu ul.menulist ul.dep02,
#open_full_menu ul.menulist ul.dep02 > li + li	{margin-top:20px}
#open_full_menu ul.menulist ul.dep02 p,
#open_full_menu ul.menulist ul.dep02 p a		{color:#222; font-size:20px; font-weight:700;}

#open_full_menu ul.menulist ul.dep03			{margin-top:10px; font-size:16px;}
#open_full_menu ul.menulist ul.dep03 ol + ol	{margin-top:7px;}
#open_full_menu ul.menulist ul.dep03 ol a		{color:#777; font-weight:500}

#open_full_menu ul.menulist ul.dep02 p a:hover,
#open_full_menu ul.menulist ul.dep03 ol a:hover	{color:var(--Primary)}

#open_full_menu .out_link			{margin-top:50px;}
#open_full_menu .out_link a			{position:relative; max-width:200px; display:block; padding:15px 24px; border-radius:10px; background:#F2F3F5; font-size:18px; font-weight:600; color:#222;}	
#open_full_menu .out_link a + a		{margin-top:8px;}
#open_full_menu .out_link a:after	{position:absolute; content:''; width:24px; height:24px; border-radius:50%; right:24px; top:50%; margin-top:-12px; background:url('/kpc/_img/comn/link.svg') no-repeat 100% 50%}
#open_full_menu .out_link a:hover	{color:#fff; background:#444}
#open_full_menu .out_link a:hover:after{background-image:url('/kpc/_img/comn/link_w.svg')}

/* 푸터 */
footer					{background:#222; padding:0 50px; position:relative; z-index:1;}
footer .foot			{max-width:1760px}
footer .f_menu			{display:flex; justify-content: space-between; padding:50px 0;}
footer .f_menu ul		{display:flex; gap:30px;}
footer .f_menu a		{color:#fff; font-weight:200; font-size:17px; transition:0.2s;}
footer .f_menu a:hover	{text-decoration:underline}
footer .f_menu a.mbragr	{color:#ffc375; font-weight: 600;}
footer .f_bottom		{display:flex; justify-content: space-between; padding:20px 0 50px; color:#ffffffCC;}
footer .f_bottom .f_logo{margin-bottom:20px;}
footer .f_bottom .f_logo img{width:250px;}
footer .f_bottom p		{display:flex; gap:30px; font-weight:200; margin-top:10px;}
footer .f_bottom .r p	{justify-content: flex-end; margin-top:20px;}
footer .f_bottom .sns	{gap:40px;}
footer .f_bottom .sns img{transform:scale(1.25)}
footer .f_bottom .copy	{color:#ffffff66}

/* 모션 */ 
.active_action .action			{opacity: 0; transform: translateY(50px); transition: all 0.8s ease;}
.active_action.active .action	{opacity: 1; transform: translateY(0);}

.active_action .action:nth-child(1) { transition-delay: 0.3s; }
.active_action .action:nth-child(2) { transition-delay: 0.5s; }
.active_action .action:nth-child(3) { transition-delay: 0.7s; }
.active_action .action:nth-child(4) { transition-delay: 0.9s; }
.active_action .action:nth-child(5) { transition-delay: 1.1s; }
.active_action .action:nth-child(6) { transition-delay: 1.3s; }
.active_action .action:nth-child(7) { transition-delay: 1.5s; }
.active_action .action:nth-child(8) { transition-delay: 1.7s; }
.active_action .action:nth-child(9) { transition-delay: 1.9s; }
.active_action .action:nth-child(10) { transition-delay: 2.1s; }


.edu01 .active_action .action:nth-child(1) { transition-delay: 0.1s; }
.edu01 .active_action .action:nth-child(2) { transition-delay: 0.4s; }
.edu01 .active_action .action:nth-child(3) { transition-delay: 0.6s; }
.edu01 .active_action .action:nth-child(4) { transition-delay: 0.8s; }

@media only screen and (max-width: 1350px) {
	header .gnb						{gap:100px;}
	header .tmn > li				{padding:0;}
	header .tmn > li div.openMenu	{left:10%;}
	header .util					{gap:15px;}
}

@media only screen and (max-width: 1250px) {
	header .tmn	{display:none;}
	header .util > a	{font-size:15px;}
	header .util .ham	{margin-left:10px;}
}

@media only screen and (max-width: 1150px) {
	header .tmn > li div.openMenu	{left:50%; transform:translateX(-50%);}
}
/* Tablet */
@media only screen and (max-width: 1024px) {
	.web			{display:none !important;}
	.tablet		{display:block !important;}
	.mobile		{display:none}

	.all_top a	{font-size:15px; width:64px; height:64px;}
	.all_top a:before{width:8px; height:8px; margin-left:-4px;}
	
	a.inquiry_form 			{display:block; width:64px; height:64px; font-size: 14px; border-radius:50%; text-align:center; background:#172E55; color:#fff; font-weight:400; padding-top:32px; margin-bottom: 6px; box-shadow:4px 4px 6px rgba(0, 0, 0, 0.25)}
	a.inquiry_form:before	{position:absolute; content:''; background:url('/kpc/_img/comn/contact_w.svg') no-repeat 50% 50% / 20px; width:24px; height:24px; left:39%; bottom: 103px; margin-left:-5px; animation: none;}
	
	
	header		{padding:15px 25px;}
	header h1 img{height:40px;}

	nav,
	header						{min-height:75px;}
	
	.about-nav.active,
	.manage .page_tab.fixed,
	.scroll-up .sub_visual .page_tab.fixed, 
	.sub_visual .page_tab.fixed	{top:75px; min-height: 50px;}
	.history .about-nav.active	{overflow-x:revert;}
/* 	.scroll-up .about-nav.active .page_tab,
	.history .about-nav.active .page_tab	{transform:translateY(75px) !important;} */
	
	header .util > a.contact{margin-right:0;}
	
	header div.n_search	{height:45px;}
	
	[data-tooltip]::before,
    [data-tooltip]::after	 {display: none !important;}
	
	footer	{padding:0 30px;}
	footer .f_menu		{flex-direction: column; gap:15px;}
	footer .f_bottom		{padding:0; }
	footer .f_bottom .f_logo img{width:200px;}
	footer .f_bottom p		{flex-wrap:wrap;  gap:10px 20px;}
	
	#open_full_menu	.ham_h1					{height:76px; padding:0 25px}
	#open_full_menu .ham_h1 img				{height:40px;}
	#open_full_menu button.ham_close		{margin-right:0;}
	
	
	#open_full_menu .ham_body				{height:calc(100dvh - 75px);}
	#open_full_menu ul.menulist				{gap:20px;}

	#open_full_menu .out_link	{margin-left:-20px;}
	#open_full_menu .out_link a	{max-width:revert; font-size:17px;}
}

/* Mobile */
@media only screen and (max-width: 720px) {	
	.web		{display:none}
	.tablet		{display:none !important;}
	.mobile		{display:block !important;}
	
	.all_top	{right:15px; bottom:15px;}
	.all_top a	{font-size:14px; width:54px; height:54px; padding-top:28px;}
	.all_top a::before{width:7px; height:7px; /* top:30px; */}
	
	a.inquiry_form 			{display:block; width:54px; height:54px; font-size: 0px; border-radius:50%; text-align:center; background:#172E55; color:#fff; font-weight:400; padding-top:32px; margin-bottom: 6px; box-shadow:4px 4px 6px rgba(0, 0, 0, 0.25)}
	a.inquiry_form:before	{position:absolute; content:''; background:url('/kpc/_img/comn/contact_w.svg') no-repeat 50% 50% / 20px; width:24px; height:24px; left:39%; bottom: 76px; margin-left:-5px; animation: none;}
	

	header				{padding:10px 15px; min-height:64px; height:64px;}
	header h1 img		{height:36px;}
	header .util		{gap:5px; min-height:40px;}
 	header .util > a,	
	header .util > a.contact,
	header .util > a.tell	{display:none;}
	
	nav					{min-height:64px;}
	
	.about-nav.active,
	.manage .page_tab.fixed,
	.scroll-up .sub_visual .page_tab.fixed, 
	.sub_visual .page_tab.fixed	{top:64px; overflow-x: auto;}
/* 	.scroll-up .about-nav.active .page_tab,
	.history .about-nav.active .page_tab{transform:translateY(64px) !important; } */

	header div.n_search			{height:45px; right: 50px; position: absolute; top: 10px;}
	header div.n_search.on		{position:absolute; width:calc(100% - 60px); max-width:320px; right:50px; top:10px}
	header div.n_search input	{font-size:15px;}
	
	footer				{padding:40px 15px}
	footer .f_menu		{align-items: center; padding:0; margin-bottom:30px;}
	footer .f_menu ul	{flex-wrap:wrap; justify-content: center; gap:10px 20px}
	footer .f_menu a	{font-size:15px;}

	footer .f_bottom		{flex-direction: column; padding:0; }
	footer .f_bottom p		{flex-wrap:wrap; justify-content: center; gap:10px 20px; text-align:center; font-size:15px;}
	footer .f_bottom .f_logo{display:none;}
	footer .f_bottom .r		{text-align:center}
	footer .f_bottom .r p	{justify-content:center;}

	
	#open_full_menu	.ham_h1					{height:65px; padding:10px 15px; background:#fff}
	#open_full_menu .ham_h1 img				{height:36px;}

	#open_full_menu .ham_body				{height:calc(100dvh - 65px); padding:0; background:#E8E9EB}
	#open_full_menu ul.menulist				{display:block;}
	#open_full_menu ul.menulist .dep01, 
	#open_full_menu ul.menulist .dep01 a	{font-size:16px; font-weight:400; color:#686C70}
	#open_full_menu ul.menulist .dep01 a	{padding:18px; display:block; border-bottom:solid 1px #E8E9EB}
	#open_full_menu ul.menulist .dep01.on a	{background:#fff; position:relative; color:#222; font-weight:600}
	#open_full_menu ul.menulist .dep01.on a:after{position:absolute; content:''; width:1px; height:100%; background:#fff; right:-1px; top:0; z-index:1;}

	#open_full_menu ul.menulist .dep01			{width:130px;}
	#open_full_menu ul.menulist ul.dep02		{width:calc(100% - 130px); height:calc(100dvh - 65px); top:65px; right:0; overflow-y:auto; position:absolute;  padding:3px 20px 20px; background:#fff; border-left:solid 1px #E8E9EB}
	#open_full_menu ul.menulist ul.dep02, 
	#open_full_menu ul.menulist ul.dep02 > li + li	{margin:0;}

	#open_full_menu ul.menulist ul.dep02 p,
	#open_full_menu ul.menulist ul.dep02 p a		{font-size:16px; font-weight:400; color:#707377; transition:none;}
	#open_full_menu ul.menulist ul.dep02 p a		{display:block; padding:15px 0}
	#open_full_menu ul.menulist ul.dep02 p a.more	{position:relative;}
	#open_full_menu ul.menulist ul.dep02 p a.more::after		{position:absolute; content:''; width:20px; height:20px; background:url('/kpc/_img/comn/sel_arrow.svg') no-repeat 50% 50%/100%; right:0; top:50%; margin-top:-12px; transition:0.2s;}
	#open_full_menu ul.menulist ul.dep02 > li.on p a.more::after	{transform:rotate(180deg)}
	#open_full_menu ul.menulist ul.dep02 > li.on p a				{font-size:18px; font-weight:600; color:#222;  border-bottom:solid 1px #E6E6E6;}

	#open_full_menu ul.menulist ul.dep03			{padding-left:15px; margin:3px 0 10px 0}
	#open_full_menu ul.menulist ul.dep03 ol			{border-bottom:solid 1px #E9E9E9;}
	#open_full_menu ul.menulist ul.dep03 ol + ol	{margin-top:0;}
	#open_full_menu ul.menulist ul.dep03 ol a		{padding:12px 12px 12px 0; display:block; font-size:16.5px; font-weight:400}

	#open_full_menu .out_link			{margin:30px 0 0 0;}
	#open_full_menu .out_link a			{max-width:revert; font-size:15px; padding:12px 15px;}
	#open_full_menu .out_link a:after	{right:15px;}
}