@charset "utf-8";

.body_hidden {height:100%; min-height:100%; overflow:hidden; touch-action:none;}
#wrap { position:relative; background-color:#fff; }


body,html { min-height:100% }

.fontSc { font-family:'Noto Sans SC', sans-serif; }

.inner1760 { position:relative; max-width:1760px; margin:0 auto; }
@media screen and (max-width:1800px){
	.inner1760 { padding:0 40px; }
}
@media screen and (max-width:1640px){
	.inner1760 { padding:0 20px; }
}
.inner1600 { position:relative; max-width:1600px; margin:0 auto; }
@media screen and (max-width:1640px){
	.inner1600 { padding:0 20px; }
}
:root { 
    --mainFont:Ubuntu;
	--subFont:;
    --mainColor:#004bd0; 
    --subColor:#df2a23; 
}

.smTxt_ju { font-size:90%; vertical-align:text-top }

.en-f { font-family: "Ubuntu", sans-serif !important; }
.ch-f { font-family: "Noto Sans SC", sans-serif !important; }

/* header */
header { position:fixed; top:0; left:0; width:100%; z-index:999; }
header { animation:headerT 1.0s 0.5s; animation-fill-mode:both; }
header:before { content:""; opacity:0; display:block; position:absolute; left:0; top:100px; background:rgba(255,255,255,0.1); width:100%; height:1px; z-index:4; transition:all 0.3s }
header.over:before { opacity:1; }
header h1 { position:relative; z-index:4; display:flex; align-items:center; height:100px; }
header h1 a { display:block; }
header h1 a svg { width:154px; height:auto }
header h1 a svg path { transition:all 0.4s; }
header svg .logo-1,
header svg .logo-2,
header svg .logo-3 { fill:#fff }
.intro svg .logo-1 { fill:#003F8B }
.intro svg .logo-2 { fill:#000008 }
.intro svg .logo-3 { fill:#000008 }
.intro svg .logo-1 { animation:ani_logo_1 1.0s 3.0s; animation-fill-mode:both; }
.intro svg .logo-2 { animation:ani_logo_2 1.0s 3.0s; animation-fill-mode:both; }
.intro svg .logo-3 { animation:ani_logo_3 1.0s 3.0s; animation-fill-mode:both; }
.intro header.fix svg .logo-1,
.intro header.fix svg .logo-2,
.intro header.fix svg .logo-3 { animation:none; }

header.fix svg .logo-1 { fill:#003F8B }
header.fix svg .logo-2 { fill:#000008 }
header.fix svg .logo-3 { fill:#000008 }
header.over svg .logo-1,
header.over svg .logo-2,
header.over svg .logo-3 { fill:#fff }
header:after { content:""; opacity:0; display:block; position:absolute; left:0; top:0; background:rgba(255,255,255,1); width:100%; height:100%; transition:all 0.3s }
header.fix:after { opacity:1;  }
@keyframes headerT {
	0% { top:-100px }
	100% { top:0}
}


header #navi { position:absolute; left:50%; top:0; transform:translate(-50%); z-index:5; display:flex; justify-content:center; }
header #navi #gnb > ul { display:flex; text-align:center; }
header #navi #gnb > ul > li { position:relative; transition:all 0.5s; }
header #navi #gnb > ul > li > a { position:relative; display:block; width:150px; height:100px; text-wrap:nowrap; display:flex; justify-content:center; align-items:center; color:#fff; font-size:21px; font-weight:600; transition:all 0.3s; }
header #navi #gnb > ul > li > a:before { content:""; display:block; position:absolute; left:50%; bottom:0; transform:translateX(-50%); background:#fff; width:0; height:2px; transition:all 0.3s 0.15s; }
header #navi #gnb > ul > li.on > a:before { width:100%; }
header.over #navi #gnb > ul > li > a { width:200px }
header #navi #gnb > ul > li > .subDepth { z-index:-11; opacity:0; visibility:hidden; position:absolute; left:50%; transform:translateX(-50%); top:100px; padding-top:30px; padding-bottom:80px; width:100%; }
header.over #navi #gnb > ul > li > .subDepth { opacity:1; visibility:visible; z-index:2; } 
header #navi #gnb > ul > li > .subDepth > ul { position:relative; }
header #navi #gnb > ul > li > .subDepth > ul > li { opacity:0; padding:0 5px;  }
header #navi #gnb > ul > li > .subDepth > ul > li.esg { display:none }
header #navi #gnb > ul > li > .subDepth > ul > li:not(:last-child) { padding-bottom:15px; }
header #navi #gnb > ul > li > .subDepth > ul > li > a { position:relative; text-wrap:nowrap; font-size:18px; color:rgba(255,255,255,0.3); font-weight:600; line-height:1.3; display:inline-block; transition:all 0.3s; }
header #navi #gnb > ul > li > .subDepth > ul > li.sm > a { padding-right:18px; }
header #navi #gnb > ul > li > .subDepth > ul > li.sm > a:before { content:""; display:block; opacity:0.3; width:8px; height:5px; position:absolute; right:0; top:50%; transform:translateY(-50%); transition:all 0.3s; background:url(/img/common/gnb_arr.svg) center center no-repeat; }
header #navi #gnb > ul > li > .subDepth > ul > li.active > a:before,
header #navi #gnb > ul > li > .subDepth > ul > li.over > a:before { transform:translateY(-50%) rotate(180deg); opacity:1; }
header #navi #gnb > ul > li > .subDepth > ul > li.over.off > a:before { opacity:0.3; }
header #navi #gnb > ul > li > .subDepth > ul > li > a:hover,
header #navi #gnb > ul > li > .subDepth > ul > li.over > a,
header #navi #gnb > ul > li > .subDepth > ul > li.active > a { color:rgba(255,255,255,1); }
header #navi #gnb > ul > li > .subDepth > ul > li.over.off > a { color:rgba(255,255,255,0.3); }
header.over #navi #gnb > ul > li > .subDepth > ul > li { animation:ani_5 0.5s 0.3s; animation-fill-mode:forwards; }
header #navi #gnb > ul > li > .subDepth > ul > li > .depth3 { display:none; padding:10px 0 5px; }
header #navi #gnb > ul > li > .subDepth > ul > li.over > .depth3 { display:block; }
header #navi #gnb > ul > li > .subDepth > ul > li.active > .depth3 { display:block; }
header #navi #gnb > ul > li > .subDepth > ul > li > .depth3 li:not(:last-child) { margin-bottom:10px; }
header #navi #gnb > ul > li > .subDepth > ul > li > .depth3 li a { color:rgba(255,255,255,0.3); font-size:16px; font-weight:600; line-height:1.3; transition:all 0.3s; }
header #navi #gnb > ul > li > .subDepth > ul > li > .depth3 li a:hover { color:rgba(255,255,255,1); }
header #navi #gnb > ul > li > .subDepth > ul > li.over > .depth3 li a:hover { color:rgba(255,255,255,1); }
header .gnb_bg {z-index:-11; opacity:0; visibility:hidden; min-height:0; position:absolute; top:0; left:0; width:100%; backdrop-filter:blur(7.5px); background:rgba(0, 0, 0, 0.60); transition:all 0.3s ease-in-out; z-index:1; }
header.over .gnb_bg { opacity:1; opacity:1; visibility:visible; z-index:1 }
header.over #navi #gnb > ul > li > a { color:#fff; }
header.fix #navi #gnb > ul > li > a { color:#111; }
header.over.fix #navi #gnb > ul > li > a { color:#fff; }
.intro #navi #gnb > ul > li > a { color:#111; animation:ani_nav 1.0s 3.0s; animation-fill-mode:both; }
.intro header.fix #navi #gnb > ul > li > a { animation:none; }
@media screen and (max-width:1560px){
	header #navi #gnb > ul > li > a { width:140px; font-size:19px; }
	header.over #navi #gnb > ul > li > a  { width:180px }
	header #navi #gnb > ul > li > .subDepth > ul > li > a { font-size:17px; }
}
@media screen and (max-width:1360px){
	header h1 a svg { width:140px; }
	header #navi #gnb { padding-left:7% }
	header #navi #gnb > ul > li > a { width:120px; font-size:18px; }
	header.over #navi #gnb > ul > li > a  { width:150px }
	header #navi #gnb > ul > li > .subDepth > ul > li > a { font-size:16px; }
	header #navi #gnb > ul > li > .subDepth > ul > li:not(:last-child) { padding-bottom:12px; }
}
@media screen and (max-width:1200px){
	header { position:fixed; border-bottom:1px solid rgba(0,0,0,0.05) }
	header:before { top:0; height:80px; opacity:1; background:rgba(255,255,255,1); backdrop-filter:blur(7.5px); }
	header h1 { height:80px; }
	header h1 a svg { width:120px; }
	header svg .logo-1 { fill:#003F8B }
	header svg .logo-2 { fill:#000008 }
	header svg .logo-3 { fill:#000008 }
	header #navi { display:none }
}
@media screen and (max-width:640px){
	header:before,
	header h1 { height:70px; }
	header h1 a svg { width:100px; }
}

header .top-menu { position:absolute; right:0; top:0; display:flex; align-items:center; gap:20px; height:100px; }
@media screen and (max-width:1800px){
	header .top-menu { right:20px; }
}
@media screen and (max-width:1200px){
	header .top-menu { height:80px; }
}
@media screen and (max-width:640px){
	header .top-menu { height:70px; }
}

header .language { position:relative; z-index:10 } 
header .language > a svg path { transition:all 0.4s; fill:#fff }
header .language .box { position:absolute; top:30px; left:50%; transform:translateX(-50%); width:40px; display:none }
header .language ul { width:100%; background:var(--mainColor); text-align:center; padding:10px 0; }
header .language ul li:not(:last-child) { margin-bottom:5px; }
header .language ul li a { font-family:var(--mainFont); font-size:14px; color:rgba(255,255,255,0.3); font-weight:700; line-height:1.3; transition:all 0.3s; }
header .language ul li.on a,
header .language ul li a:hover { color:rgba(255,255,255,1); }
.intro .language > a svg path { fill:#000; animation:ani_lang 1.0s 3.0s; animation-fill-mode:both; }
.intro header.fix .language > a svg path { animation:none; }
header.fix .language > a svg path { fill:#000 }
header.over .language > a svg path { fill:#fff }
@media screen and (max-width:1200px){
	header .language > a svg path { fill:#000 }
}
@media screen and (max-width:1024px){
	header .language { display:none }
}


header .allmenu { position:relative; z-index:100; }
header .allmenu a { position:relative; width:18px; height:14px; display:block; }
header .allmenu span { position:relative; display:block; width:100%; height:2px; background-color:#fff; transition:all 0.2s ease-in-out; }
header .allmenu a:before { content:""; display:block; width:100%; height:2px; background-color:#fff; position:absolute; left:0; top:50%; transform:translateY(-50%); border-radius:2px; transition:all 0.2s ease-in-out; }
header .allmenu a:after { content:""; display:block; width:100%; height:2px; background-color:#fff; position:absolute; left:0; bottom:0; border-radius:2px; transition:all 0.2s ease-in-out; }
.intro .allmenu span,
.intro .allmenu a:before,
.intro .allmenu a:after { background-color:#000; animation:ani_all 1.0s 3.0s; animation-fill-mode:both; }
.intro header.fix .allmenu span,
.intro header.fix .allmenu a:before,
.intro header.fix .allmenu a:after { animation:none; }
header.fix .allmenu span,
header.fix .allmenu a:before,
header.fix .allmenu a:after { background-color:#000; }
header.over .allmenu span,
header.over .allmenu a:before,
header.over .allmenu a:after { background-color:#fff; }
@media screen and (max-width:1200px){
	header .allmenu span,
	header .allmenu a:before,
	header .allmenu a:after { background-color:#000; }
}

#allmenuBox .lang { display:none }
.web #allmenuBox { z-index:-11; opacity:0; visibility:hidden; position:fixed; top:0; left:0; width:100%; height:100vh; transition:all 0.3s; }
.web #allmenuBox.on { opacity:1; visibility:visible; z-index:9999; background:rgba(0, 0, 0, 0.80); backdrop-filter:blur(10px); }
.web #allmenuBox .menuBox { position:relative; padding-left:80px; display:none }
.web #allmenuBox.on .menuBox { display:block }
.web #allmenuBox .menuBox:before { content:""; display:block; width:1px; height:100%; background-color:rgba(255, 255, 255, 0.10); position:absolute; left:80px; top:0; }
.web #allmenuBox .menuBox > ul { height:100vh; display:flex; flex-direction:column; justify-content:center; }
.web #allmenuBox .menuBox > ul > li { position:relative; padding-left:60px; height:120px; display:flex; align-items:center; }
.web #allmenuBox .menuBox > ul > li:before { content:""; display:block; transition:all 0.5s; width:5px; height:0; background-color:var(--mainColor); position:absolute; left:0; top:50%; transform:translateY(-50%); }
.web #allmenuBox .menuBox > ul > li.hover:before { height:100%; }
.web #allmenuBox .menuBox > ul > li.hover { z-index:7; }
.web #allmenuBox .menuBox > ul > li > a { position:relative; color:rgba(255,255,255,0.3); font-weight:600; font-size:48px; line-height:1.1; letter-spacing:-0.05em; transition:all 0.5s; }
.web #allmenuBox .menuBox > ul > li:hover > a,
.web #allmenuBox .menuBox > ul > li.hover > a { color:var(--mainColor); }
.web #allmenuBox .menuBox > ul > li .subDepth { display:none; position:absolute; top:52px; left:400px; z-index:7; }
.web #allmenuBox .menuBox > ul > li.hover .subDepth { display:block; }
.web #allmenuBox .menuBox > ul > li .subDepth> ul { display:flex; }
.web #allmenuBox .menuBox > ul > li .subDepth> ul > li:not(:last-child) { margin-right:80px; }
.web #allmenuBox .menuBox > ul > li:nth-child(2) .subDepth> ul > li:not(:last-child) { margin-right:0; width:240px; }
.web #allmenuBox .menuBox > ul > li .subDepth> ul > li > a { color:#fff; font-weight:600; font-size:20px; }
.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 { padding-top:45px; }
.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li:not(:last-child) { margin-bottom:15px; }
.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li > a { color:rgba(255, 255, 255, 0.3); font-weight:600; font-size:19px; line-height:1.3; }
.web #allmenuBox .btnClose { opacity:0; transition:all 0.7s; }
.web #allmenuBox.on .btnClose { opacity:1; position:absolute; top:40px; right:80px; width:40px; height:40px; cursor:pointer; z-index:2; }
.web #allmenuBox.on .btnClose:hover { transform:rotate(-180deg);}
.web #allmenuBox.on .btnClose:before { content:""; display:block; width:26px; height:3px; background-color:#fff; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(45deg); border-radius:0; }
.web #allmenuBox.on .btnClose:after { content:""; display:block; width:26px; height:3px; background-color:#fff; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(-45deg); border-radius:0; }
#allmenuBox .copybox { position:absolute; left:140px; bottom:30px; }
#allmenuBox .copybox .copyright { font-family:var(--mainFont); font-size:17px; color:#888; font-weight:500; line-height:1.3; }
@media screen and (max-width:1800px){
	.web #allmenuBox.on .btnClose { top:30px; right:20px; }
}
@media screen and (max-width:1560px){
	.web #allmenuBox .menuBox { padding-left:60px; }
	.web #allmenuBox .menuBox:before { left:60px; }
	.web #allmenuBox .menuBox > ul > li { padding-left:50px; height:100px; }
	.web #allmenuBox .menuBox > ul > li:before { width:4px; }
	.web #allmenuBox .menuBox > ul > li > a { font-size:40px; }
	.web #allmenuBox .menuBox > ul > li .subDepth { top:42px; left:280px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li:not(:last-child) { margin-right:50px; }
	.web #allmenuBox .menuBox > ul > li:nth-child(2) .subDepth> ul > li:not(:last-child) { width:220px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li > a { font-size:18px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 { padding-top:30px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li:not(:last-child) { margin-bottom:12px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li > a { font-size:17px; }
	.web #allmenuBox .copybox { left:110px; }
}
@media screen and (max-width:1200px){
	.web #allmenuBox .menuBox { padding-left:40px; }
	.web #allmenuBox .menuBox:before { left:40px; }
	.web #allmenuBox .menuBox > ul > li { padding-left:30px; height:90px; }
	.web #allmenuBox .menuBox > ul > li:before { width:3px; }
	.web #allmenuBox .menuBox > ul > li > a { font-size:35px; }
	.web #allmenuBox .menuBox > ul > li .subDepth { top:38px; left:210px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li:not(:last-child) { margin-right:40px; }
	.web #allmenuBox .menuBox > ul > li:nth-child(2) .subDepth> ul > li:not(:last-child) { width:200px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li > a { font-size:17px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 { padding-top:20px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li:not(:last-child) { margin-bottom:10px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li > a { font-size:16px; }
	.web #allmenuBox .copybox { left:70px; font-size:16px; }
}
@media screen and (max-height:860px){
	.web #allmenuBox .menuBox { padding-left:60px; }
	.web #allmenuBox .menuBox:before { left:60px; }
	.web #allmenuBox .menuBox > ul > li { padding-left:50px; height:100px; }
	.web #allmenuBox .menuBox > ul > li:before { width:4px; }
	.web #allmenuBox .menuBox > ul > li > a { font-size:40px; }
	.web #allmenuBox .menuBox > ul > li .subDepth { top:42px; left:280px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li:not(:last-child) { margin-right:50px; }
	.web #allmenuBox .menuBox > ul > li:nth-child(2) .subDepth> ul > li:not(:last-child) { width:220px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li > a { font-size:18px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 { padding-top:30px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li:not(:last-child) { margin-bottom:12px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li > a { font-size:17px; }
	.web #allmenuBox .copybox { left:110px; }
}
@media screen and (max-height:760px){
	.web #allmenuBox .menuBox { padding-left:40px; }
	.web #allmenuBox .menuBox:before { left:40px; }
	.web #allmenuBox .menuBox > ul > li { padding-left:30px; height:90px; }
	.web #allmenuBox .menuBox > ul > li:before { width:3px; }
	.web #allmenuBox .menuBox > ul > li > a { font-size:35px; }
	.web #allmenuBox .menuBox > ul > li .subDepth { top:38px; left:210px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li:not(:last-child) { margin-right:40px; }
	.web #allmenuBox .menuBox > ul > li:nth-child(2) .subDepth> ul > li:not(:last-child) { width:200px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li > a { font-size:17px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 { padding-top:20px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li:not(:last-child) { margin-bottom:10px; }
	.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 > li > a { font-size:16px; }
	.web #allmenuBox .copybox { left:70px; font-size:16px; }
}
@media screen and (max-height:620px){
	.web #allmenuBox .menuBox > ul > li { height:80px; }
}

/* animation  */
.web #allmenuBox .menuBox > ul > li { opacity:0; }
.web #allmenuBox.on .menuBox > ul > li:nth-child(1) { animation:ani_3 0.5s 0.3s; animation-fill-mode:both; }
.web #allmenuBox.on .menuBox > ul > li:nth-child(2) { animation:ani_3 0.5s 0.5s; animation-fill-mode:both; }
.web #allmenuBox.on .menuBox > ul > li:nth-child(3) { animation:ani_3 0.5s 0.7s; animation-fill-mode:both; }
.web #allmenuBox.on .menuBox > ul > li:nth-child(4) { animation:ani_3 0.5s 0.9s; animation-fill-mode:both; }
.web #allmenuBox.on .menuBox > ul > li:nth-child(5) { animation:ani_3 0.5s 1.1s; animation-fill-mode:both; }
.web #allmenuBox.on .menuBox > ul > li:nth-child(6) { animation:ani_3 0.5s 1.3s; animation-fill-mode:both; }
.web #allmenuBox .menuBox > ul > li .subDepth> ul > li .depth3 { opacity:0; } 
.web #allmenuBox .menuBox > ul > li.hover .subDepth> ul > li .depth3 { animation:ani_4 0.5s 0.1s; animation-fill-mode:both; }
.web #allmenuBox .copybox { opacity:0; }
.web #allmenuBox.on .copybox { animation:ani_5 1.0s 1.5s; animation-fill-mode:both; }

@media screen and (max-width:1024px){
    #allmenuBox { position:fixed; top:0; right:-520px; max-width:520px; width:100%; height:100vh; transition:all 0.3s 0.1s ease-in-out; z-index:10000; }
	#allmenuBox.on:before { content:""; display:block; width:100%; height:100vh; background-color:rgba(0, 0, 0, 0.50); position:fixed; left:0; top:0; }
    #allmenuBox.on { right:0; z-index:10000; opacity:1; visibility:visible; transition:all 0.3s 0.1s ease-in-out; }
    #allmenuBox .menuCont { position:relative; z-index:5; height:100vh; justify-content:flex-start; } 
    #allmenuBox .menuBox { height:100%; background:rgba(0, 0, 0, 0.80); backdrop-filter:blur(10px); }
    #allmenuBox .menuBox { position:absolute; top:0; left:0; width:100%; }
    #allmenuBox .menuBox > ul { position:relative; top:80px; padding:20px 0 0; height:calc(100% - 140px); overflow:auto; }
    #allmenuBox .menuBox > ul > li { position:relative; text-align:left; margin-top:0; }
    #allmenuBox .menuBox > ul > li > a { position:relative; color:rgba(255,255,255,0.3); font-weight:500; font-size:28px; line-height:1.3; padding:25px 35px; display:block }
	#allmenuBox .menuBox > ul > li.hover > a { color:var(--mainColor); }
	#allmenuBox .menuBox > ul > li > a:before { content:""; display:block; width:25px; height:25px; position:absolute; right:35px; top:50%; transform:translateY(-50%); transition:all 0.5s; background:url(/img/common/gnb_m_arr.svg) center center no-repeat; opacity:0.5 }
	#allmenuBox .menuBox > ul > li.hover > a:before { transform:translateY(-50%) rotate(180deg); }
    #allmenuBox .menuBox > ul > li > .subDepth { position:relative; display:none; }
	#allmenuBox .menuBox > ul > li.hover .subDepth { display:block; }
    #allmenuBox .menuBox > ul > li > .subDepth > ul { padding:40px 0 40px; display:block; background:rgba(0,0,0,0.3); backdrop-filter:blur(10px); display:flex; flex-wrap:wrap; gap:30px 20px; }
    #allmenuBox .menuBox > ul > li > .subDepth > ul > li { padding:0 0 0 37px; width:calc((100% - 20px) / 2) }
    #allmenuBox .menuBox > ul > li > .subDepth > ul > li > a { position:relative; color:#fff; font-weight:500; font-size:22px; line-height:1.3 }
	#allmenuBox .menuBox > ul > li > .subDepth > ul > li .depth3 { padding-top:20px; }
	#allmenuBox .menuBox > ul > li > .subDepth > ul > li .depth3 > li:not(:last-child) { margin-bottom:10px; }
	#allmenuBox .menuBox > ul > li > .subDepth > ul > li .depth3 > li > a { color:rgba(255, 255, 255, 0.3); font-weight:600; font-size:19px; line-height:1.3; }
	#allmenuBox .lang { position:relative; z-index:5; display:block }
	#allmenuBox .lang ul { height:80px; display:flex; align-items:center; padding-left:35px; }
	#allmenuBox .lang ul li:not(:last-child) { margin-right:40px; }
	#allmenuBox .lang ul li { position:relative; }
	#allmenuBox .lang ul li:not(:last-child):before { content:""; display:block; width:4px; height:4px; background-color:#aaa; position:absolute; right:-22px; top:50%; transform:translateY(-50%); border-radius:5px; }
	#allmenuBox .lang ul li a { font-family:var(--subFont); color:#9d9d9d; font-size:20px; font-weight:500; line-height:1.3; }
	#allmenuBox .lang ul li.on a { color:var(--mainColor); }
	#allmenuBox .btnClose { position:absolute; top:0; right:0; z-index:5; width:80px; height:80px; cursor:pointer; background:var(--mainColor1); }
	#allmenuBox .btnClose:before { content:""; display:block; width:26px; height:1px; background-color:#fff; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(45deg); }
	#allmenuBox .btnClose:after { content:""; display:block; width:26px; height:1px; background-color:#fff; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%) rotate(-45deg); }
	#allmenuBox .copybox { left:0; bottom:0; width:100%; height:60px; display:flex; align-items:center; justify-content:center; text-align:center }
	#allmenuBox .copybox .copyright { font-size:15px; }
}
@media screen and (max-width:640px){
	#allmenuBox .menuBox > ul > li > a:before { right:20px; }
    #allmenuBox .menuBox > ul > li > a { font-size:26px; padding:20px; }
    #allmenuBox .menuBox > ul > li > .subDepth > ul { padding:20px 0 20px; gap:20px 15px; }
    #allmenuBox .menuBox > ul > li > .subDepth > ul > li { padding:0 0 0 22px; width:calc((100% - 15px) / 2) }
    #allmenuBox .menuBox > ul > li > .subDepth > ul > li > a { font-size:18px; }
	#allmenuBox .menuBox > ul > li > .subDepth > ul > li .depth3 { padding-top:15px; }
	#allmenuBox .menuBox > ul > li > .subDepth > ul > li .depth3 > li:not(:last-child) { margin-bottom:8px; }
	#allmenuBox .menuBox > ul > li > .subDepth > ul > li .depth3 > li > a { font-size:17px; }
	#allmenuBox .lang ul { padding-left:20px; }
	#allmenuBox .lang ul li:not(:last-child) { margin-right:30px; }
	#allmenuBox .lang ul li:not(:last-child):before { width:2px; height:2px; right:-15px; }
	#allmenuBox .lang ul li a { font-size:16px; }
}



footer { padding:120px 0 60px; background:#222; }
footer .footer_box { position:relative; }
footer .footer_box .f-box { display:flex; flex-wrap:wrap; }
footer .footer_box .logo { width:500px; }
footer .footer_box .logo svg { width:180px; height:auto }
footer .footer_box .logo svg .logo-1,
footer .footer_box .logo svg .logo-2,
footer .footer_box .logo svg .logo-3 { fill:#fff }
footer .footer_box .infobox { width:calc(100% - 500px); display:flex; flex-wrap:wrap; gap:60px 20px; }
footer .footer_box .infobox > div { width:calc((100% - 40px) / 3); }
footer .footer_box .infobox h4 { position:relative; font-size:18px; font-weight:700; color:#fff; line-height:1.3; padding-left:22px; }
footer .footer_box .infobox h4:before { content:""; display:block; width:2px; height:15px; background-color:#fff; position:absolute; left:0; top:50%; transform:translateY(-50%); }
footer .footer_box .infobox ul { display:flex; flex-wrap:wrap; gap:10px 30px; margin-top:20px; }
footer .footer_box .infobox li { position:relative; font-size:17px; font-weight:300; color:#aaa; line-height:1.3; }
footer .footer_box .infobox li a { color:#aaa; }
footer .footer_box .infobox li:before { content:""; display:block; width:1px; height:15px; background-color:#fff; opacity:0.1; position:absolute; left:-15px; top:5px; }
footer .footer_box .infobox li.full { width:100%; }
footer .footer_box .infobox li.full:before,
footer .footer_box .infobox li:nth-child(2):before { display:none; }
footer .fb-box { display:flex; justify-content:space-between; margin-top:120px; }
footer .fb-box .fmenu ul { display:flex; }
footer .fb-box .fmenu li { position:relative; }
footer .fb-box .fmenu li:not(:last-child) { margin-right:20px; padding-right:20px; }
footer .fb-box .fmenu li:not(:last-child):before { content:""; display:block; width:1px; height:15px; background-color:#fff; opacity:0.1; position:absolute; right:0; top:5px; }
footer .fb-box .fmenu li a { font-size:18px; font-weight:600; color:#aaa; line-height:1.3;  }
footer .fb-box .copyright { font-family:var(--mainFont); font-size:18px; color:#aaa; font-weight:400; line-height:1.3; }
@media screen and (max-width:1700px){
	footer .footer_box .logo { width:350px; }
	footer .footer_box .logo svg { width:160px; }
	footer .footer_box .infobox { width:calc(100% - 350px); }
}
@media screen and (max-width:1500px){
	footer { padding:100px 0 60px; }
	footer .footer_box .logo { width:220px; }
	footer .footer_box .logo svg { width:140px; }
	footer .footer_box .infobox { width:calc(100% - 220px); }
}
@media screen and (max-width:1200px){
	footer .footer_box .logo { width:100%; text-align:center; }
	footer .footer_box .logo svg { width:120px; }
	footer .footer_box .infobox { width:100%; margin-top:40px; gap:40px 20px; }
	footer .footer_box .infobox > div { width:calc((100% - 20px) / 2); }
}
@media screen and (max-width:1024px){
	footer .footer_box .infobox h4 { font-size:16px; padding-left:16px; }
	footer .footer_box .infobox h4:before { width:1px; height:13px; }
	footer .footer_box .infobox ul { gap:5px 20px; margin-top:10px; }
	footer .footer_box .infobox li { font-size:15px; }
	footer .footer_box .infobox li:before { height:13px; left:-10px; top:4px; }
	footer .fb-box { margin-top:60px; flex-wrap:wrap; align-items:center; flex-direction:column-reverse; text-align:center; }
	footer .fb-box .fmenu,
	footer .fb-box .copyright { width:100%; }
	footer .fb-box .fmenu ul { justify-content:center; }
	footer .fb-box .fmenu li:not(:last-child) { margin-right:14px; padding-right:14px; }
	footer .fb-box .fmenu li:not(:last-child):before { height:13px; top:4px; }
	footer .fb-box .fmenu li a { font-size:16px; }
	footer .fb-box .copyright { margin-top:20px; font-size:16px; }
}
@media screen and (max-width:760px){
	footer .footer_box .infobox { margin-top:40px; gap:20px; }
	footer .footer_box .infobox > div { margin:0 auto; max-width:500px; width:100%; }
}
@media screen and (max-width:640px){
	footer { padding:60px 0 40px; }
	footer .fb-box .fmenu li:not(:last-child) { margin-right:8px; padding-right:8px; }
}


.quickMenu { position:fixed; right:30px; bottom:85px; z-index:10 }
.quickMenu .inquiry { width:70px; height:70px; }
.quickMenu .inquiry a { width:100%; height:100%; position:relative; display:flex; justify-content:center; align-items:center; border-radius:10px; background:var(--mainColor); }
.quickMenu .inquiry span.p { position:relative; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); }
.quickMenu .inquiry span.p:after { content:""; display:block; position:absolute; left:50%; top:50%; margin-left:-6px; transform:translate(-50%, -50%); width:3px; height:3px; border-radius:3px; background:var(--mainColor); }
.quickMenu .inquiry span.p:before { content:""; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:3px; height:3px; border-radius:3px; background:var(--mainColor); }
.quickMenu .inquiry span.p span:before { content:""; display:block; position:absolute; left:50%; top:50%; margin-left:6px; transform:translate(-50%, -50%); z-index:1; width:3px; height:3px; border-radius:3px; background:var(--mainColor); }
.quickMenu .inquiry a:hover span.p:after { animation:m_over1 0.8s linear infinite; }
.quickMenu .inquiry a:hover span.p:before { animation:m_over2 0.8s linear infinite; }
.quickMenu .inquiry a:hover span.p span:before { animation:m_over3 0.8s linear infinite; }
.quickMenu .btn_top { cursor:pointer; margin-top:10px; text-align:center; display:flex; justify-content:center; }
.quickMenu .btn_top span { position:relative; transition:all 0.3s; font-family:var(--mainFont); color:#fff; font-size:15px; font-weight:500; line-height:1.3; padding-right:13px; display:inline-block }
.quickMenu .btn_top span:before { content:""; display:block; transition:all 0.3s; position:absolute; right:0; top:50%; transform:translate(0, -50%); width:8px; height:8px; background:url(/img/common/icon_top.svg) center center no-repeat; }
.quickMenu.active .btn_top span { color:#111; }
.quickMenu.active .btn_top span:before { filter:brightness(0) invert(0.05); }
.quickMenu.active .btn_top.active span { color:#fff; }
.quickMenu.active .btn_top.active span:before { filter:brightness(0) invert(1); }
@media screen and (max-width:1500px){
	.quickMenu .inquiry { width:60px; height:60px; }
}
@media screen and (max-width:1200px){
	.quickMenu { right:20px; bottom:30px; }
	.quickMenu .inquiry { width:50px; height:50px; }
	.quickMenu .inquiry a {border-radius:5px; } 
	.quickMenu .btn_top span { font-size:13px; }
}
@media screen and (max-width:640px){
	.quickMenu { right:10px; bottom:20px; }
}

/* animation */
.quickMenu { opacity:0; }
.quickMenu { animation:ani_3 1.0s 0.5s; animation-fill-mode:both; }

/* privacy */
.privacy { color:#666; width:100%; overflow:hidden; box-sizing:border-box; font-size:18px;line-height:1.4; word-break:break-all; }
.privacy h2 { font-size:20px; font-weight:bold; color:#222; text-align:left; margin:50px 0 30px; }
.privacy h2:first-child { margin-top:0; }
.privacy > p { margin:15px 0; }
.privacy > p+dl { margin-top:30px; }
.privacy > dl { padding-bottom:20px;}
.privacy > dl > dt{ font-size:20px; color:#222;font-weight:700;padding-bottom:10px;}
.privacy > dl > dd{ padding-bottom:10px;text-align:justify; font-size:18px; line-height:1.4;}
.privacy > dl > dd ul{ padding:10px; }
.privacy > dl > dd ul li{ line-height:1.2; margin-top:10px; }
.privacy > dl > dd ul li ul { padding-left:18px; }
.privacy > dl > dd ul li:first-child { margin-top:0; }
.privacy > dl > dd ul li p { margin:0 10px 5px; line-height:140%; margin-top:8px;}
.privacy table { margin-top:10px; border-top:2px solid #000; background: #fff; }
.privacy thead th { text-align:center; height:50px; border-top:2px solid #000; border:1px solid #e5e5e5; border-width:0 0 1px 1px; background:#f8f8f8; color:#111; font-size:18px; font-weight:600; line-height:1.3; }
.privacy thead th:first-child { border-left:none }
.privacy tbody td { text-align:center; padding:10px 20px; border:1px solid #e5e5e5; border-width:0 0 1px 1px; background:#fff; color:#333; font-size:18px; font-weight:400; line-height:1.4; }
.privacy tbody td.lineNo { border-left:none }
.privacy tbody td.td_left { text-align:left }
.sTxt { margin:10px 0 10px 0; padding:20px; border:1px solid #ddd; }
.sTxt h3 { font-size:20px; color:#222; font-weight:700; margin:20px 0 10px; }
.sTxt p { margin-top:10px; }
.sTxt dt { margin-top:10px; }
.sTxt dd { margin:0 8px; }

@media screen and (max-width:1024px){
	.privacy { font-size:16px; }
	.privacy h2,
	.privacy > dl > dt { font-size:18px; }
	.privacy > dl > dd{ font-size:16px; }
	.privacy thead th { font-size:16px; }
	.privacy tbody td { padding:10px 15px; font-size:16px; }
	.sTxt { padding:15px; }
	.sTxt h3 { font-size:18px; }
}


/* 게시글 동영상 반응형 */
.video-container { position:relative; overflow:hidden; max-width:1000px; margin:0 auto; }
.video-container:before { content:''; display:block; padding-bottom:56.25%; /* 16:9 비율 */ }
.video-container video,
.video-container iframe { position:absolute; top:0; left:0; width:100%; height:100%; border:0; }


/* keyframes animation */
@keyframes ani_logo_1 {
	0% { fill:#003F8B }
	100% { fill:#fff }
}
@keyframes ani_logo_2 {
	0% { fill:#000 }
	100% { fill:#fff }
}
@keyframes ani_logo_3 {
	0% { fill:#000008 }
	100% { fill:#fff }
}
@keyframes ani_nav {
	0% { color:#111; }
	100% { color:#fff; }
}
@keyframes ani_lang {
	0% { fill:#000; }
	100% { fill:#fff; }
}
@keyframes ani_all {
	0% { background-color:#111; }
	100% { background-color:#fff; }
}
@keyframes m_over1 {
    0% { opacity: 0; }
    10% { opacity: 0; }
    20% { opacity: 1; }
    60% { opacity: 1; }
    80% { opacity: 1; }
    100% { opacity: 1; }
}
@keyframes m_over2 {
    0% { opacity: 0; }
    20% { opacity: 0; }
    40% { opacity: 0; }
    60% { opacity: 1; }
    80% { opacity: 1; }
    100% { opacity: 1; }
}
@keyframes m_over3 {
    0% { opacity: 0; }
    20% { opacity: 0; }
    40% { opacity: 0; }
    60% { opacity: 0; }
    80% { opacity: 1; }
    100% { opacity: 1; }
}