@charset "utf-8";

body,html { min-height:100% }
html.body_hidden,
body.body_hidden { overflow:hidden; }
#wrap { min-height:calc(100vh - 223px); }
@media screen and (max-width:960px){
	#wrap { min-height:100%; }
}


/* header */
header { position:fixed; width:100%; z-index:9999; transition:all 0.3s ease-in-out; }
header h1 { position:absolute; left:0; top:0; text-align:left; padding:40px 0 0 80px; z-index:999; transition:all 0.3s ease-in-out; }
header h1 a { display:inline-block; overflow:hidden; text-indent:-9999em; width:174px; height:45px; background:url(/img/common/img_logo.png) left center no-repeat; }
header #navi { z-index:9; transition:all 0.3s ease-in-out; }
header #navi #gnb { position:relative; text-align:right; margin:0 202px 0 0;}
header #navi #gnb > ul { display:inline-block; margin:0 auto; }
header #navi #gnb > ul > li { position:relative; display:inline-block; margin:0 -2px; vertical-align:top; text-align:center; padding:62px 36px 0 36px; height:60px; }
header #navi #gnb > ul > li > a { position:relative; z-index:1; font-weight:500; font-size:16px; color:#fff; line-height:16px; padding:0; display:block; text-transform:uppercase; }
header #navi.over #gnb > ul > li.on {}
header #navi.over #gnb > ul > li.on:after { content:""; display:block; transform:translateX(-50%); width:140px; height:100%; background-color:#b50b14; position:absolute; left:50%;  top:0; transition:all 0.3s ease-in-out; }
header #navi.over #gnb > ul > li.on  > a { color:#fff; }
header #navi #gnb > ul > li.on > a,
header #navi #gnb > ul > li > a:hover { color:#fff; }
header #navi #gnb > ul > li > .subDepth { display:none; position:absolute; left:50%; padding:35px 0 25px 0; top:80px; transform:translateX(-50%); width:140px; text-align:center;  z-index:3; background-color:#b50b14; transition:all 0.3s ease-in-out; }
header #navi.over  #gnb > ul > li.on > .subDepth  { display:block; }
header #navi #gnb > ul > li .subDepth > ul > li { margin:18px 0 0 0;  }
header #navi #gnb > ul > li .subDepth > ul > li:first-child { margin:0; }
header #navi #gnb > ul > li .subDepth > ul > li a { opacity:0; position:relative; display:block; font-size:15px; line-height:14px; font-weight:300; color:rgba(255,255,255,0.3); transition:all 0.3s ease-in-out;  }
header #navi #gnb > ul > li .subDepth > ul > li a:after { content:""; display:block; width:0; height:4px; background-color:#fff; background:linear-gradient(-45deg, transparent 4px, white 0); position:absolute; left:0; top:50%; margin-top:-2px; transition:all 0.3s ease-in-out; }
header #navi #gnb > ul > li .subDepth > ul > li a:hover { color:#fff; font-weight:500; }
header #navi #gnb > ul > li .subDepth > ul > li a { animation:gnbSub 0.2s 0.1s; animation-fill-mode:forwards;}
header #navi #gnb > ul > li .subDepth > ul > li span { display:none; }
header #navi #gnb .btnBox { display:none; }

header.fix { height:90px; background-color:#fff; } 
header.fix h1 { padding:27px 0 0 80px; }
header.fix h1 a { width:174px; height:45px; background:url(/img/common/img_logo_on.png) left center no-repeat; }
header.fix #navi #gnb > ul > li { padding:37px 36px 0 36px; }
header.fix #navi #gnb > ul > li a { color:#333; }
header.fix #navi.over #gnb > ul > li.on {}
header.fix #navi.over #gnb > ul > li.on  > a { color:#fff; }

@keyframes gnbSub {
	0% { transform:translateY(30px); opacity:0; }
	100% { transform:translateY(0); opacity:1; }
}
@media screen and (max-width:1280px){
	header h1 { padding:40px 0 0 50px }
	header.fix h1 { padding:27px 0 0 50px; }
	header #navi #gnb { margin:0 170px 0 0;}
	header #navi #gnb > ul > li { padding:62px 36px 0 36px; }
}
@media screen and (max-width:960px){
	header #navi { display:none; }
	header h1 { padding:40px 0 0 20px }
	header.fix h1 { padding:27px 0 0 20px; }
} 

.allBox { position:absolute; right:80px; top:66px; z-index:7; transition:all 0.3s ease-in-out; }
.allBox.on { background-color:#0a3d84; z-index:9999; right:630px; }
.allmenu { position:relative; width:18px; height:18px; margin:auto;  }
.allmenu a { display:block; height:18px; }
.allmenu span { position:relative; width:20px; height:2px; background-color:#fff; display:block; }
.allmenu span:before { content:""; display:block; width:20px; height:2px; background-color:#fff; position:absolute; left:0; top:6px; }
header.fix .allBox { top:41px; }
header.fix .allmenu span,
header.fix .allmenu span:before { background-color:#222; }
@media screen and (max-width:1280px){
	.allBox { right:50px; }
}
@media screen and (max-width:960px){
	.allBox { top:54px; right:30px; }
}

.language { position:absolute; right:130px; top:48px; transition:all 0.3s ease-in-out; }
.language > a { position:relative; z-index:9; text-align:center; margin-top:14px; display:block; overflow:hidden; text-indent:-9999em; width:18px; height:18px; background:url(/img/common/img_lang.png) left center no-repeat; transition:all 0.3s ease-in-out; }
.language > a.on {  background:url(/img/common/img_lang_on.png) left center no-repeat; }
.language .btn {  }
.language .listbox { position:absolute; top:0; left:50%; display:none; width:46px; margin-left:-23px; text-align:center; padding:35px 0 16px 0; background-color:#fff; border-radius:12px; }
.language .listbox a { color:#777; font-weight:300; font-size:15px; margin:20px 0 0 0; display:block; }
.language .listbox a.on { color:#222; font-weight:500; }
header.fix .language { top:24px; }
header.fix .language > a { background:url(/img/common/img_lang_on.png) left center no-repeat; transition:all 0.3s ease-in-out; }
header.fix .language .listbox { border:1px solid #ddd; }
@media screen and (max-width:1280px){
	.language { right:100px; }
}
@media screen and (max-width:960px){
	.language { top:36px; right:60px; }
}

#allmenuBox { position:fixed; right:-100%; top:0; width:100%; height:100%; background-color:#292a31; z-index:999; }
#allmenuBox .menuBox { position:relative; z-index:999; }
#allmenuBox #gnb { position:absolute; left:calc(50% - 100px); top:50%; transform:translateY(-50%); width:calc(50% + 100px); }
#allmenuBox #gnb > ul { text-align:left; display:block;}
#allmenuBox #gnb > ul > li { position:relative; margin:75px 0 0 0; padding:0; width:auto; opacity:0; }
#allmenuBox #gnb > ul > li:first-child { margin:0; }
#allmenuBox #gnb > ul > li:before { content:""; display:block; width:0; height:1px; background-color:rgba(255,255,255,0.1); position:absolute; left:0; bottom:-1px; transition:all 0.3s ease-in-out; }
#allmenuBox #gnb > ul > li.hover:before { width:100%; }
#allmenuBox #gnb > ul > li > a { font-weight:500; font-size:45px; color:rgba(255,255,255,0.5); line-height:40px; text-transform:uppercase; }
#allmenuBox #gnb > ul > li.hover > a,
#allmenuBox #gnb > ul > li > a:hover { color:#fff; }
#allmenuBox #gnb > ul > li .subDepth { visibility:hidden; z-index:-25; opacity:0; transition:all 0.3s ease-in-out; position:absolute; left:200px; padding:0 60px 0 0; width:calc(100% - 260px); top:21px; overflow:hidden !important; height:22px; clear:both; }
#allmenuBox #gnb > ul > li .subDepth:after {content:""; display:block; visibility:hidden; clear:both; height:0; }
#allmenuBox #gnb > ul > li.hover .subDepth { visibility:visible; z-index:1; opacity:1; }
#allmenuBox #gnb > ul > li ul  { float:left !important; display:block; white-space:nowrap; position:relative; }
#allmenuBox #gnb > ul > li ul li { opacity:0; display:inline-block; box-sizing:border-box; }
#allmenuBox #gnb > ul > li ul li:first-child { margin:0; }
#allmenuBox #gnb > ul > li ul li a { position:relative; font-size:22px; line-height:20px; padding:0; font-weight:300; color:rgba(255,255,255,0.3); margin:0 0 0 45px; }
#allmenuBox #gnb > ul > li ul li a:hover { color:#fff; }
#allmenuBox #gnb > ul > li ul li:first-child a { margin:0; }
#allmenuBox #gnb .btnBox { display:none; position:absolute; right:50px; top:50px; }
#allmenuBox #gnb .btnBox:before { content:""; display:block; width:1px; height:1px; position:absolute; left:50%; margin:-2px 0 0 -1px; top:50%; transform:translateX(-4px); border:1px solid rgba(255,255,255,0.5); border-radius:50%; animation: scroll 1.5s 0.5s linear 9999 normal forwards; }
#allmenuBox #gnb .btnBox a { width:20px; height:20px; margin:0; display:inline-block; overflow:hidden; text-indent:-9999em; }
#allmenuBox #gnb .btnBox a.btn_first { background:url(/img/common/btn_gnb_arr_f.png) center center no-repeat; }
#allmenuBox #gnb .btnBox a.btn_last { background:url(/img/common/btn_gnb_arr_l.png) center center no-repeat; }
#allmenuBox #gnb > ul > li.hover.on .btnBox { display:block; opacity:0; }

#allmenuBox .btn_close { position:absolute; top:50px; right:80px; width:16px; height:16px; z-index:99; cursor:pointer; }
#allmenuBox .btn_close:before { content:""; display:block; width:20px; height:2px; background-color:#fff; position:absolute; left:0; top:10px; transform:translateY(5px) rotate(-45deg);}
#allmenuBox .btn_close:after { content:""; display:block; width:20px; height:2px; background-color:#fff; position:absolute; left:0; top:20px; transform:translateY(-5px) rotate(45deg);}
#allmenuBox .menuBox { position:relative; z-index:9; background-color:#292a31 !important; height:100%; width:100%; }
#allmenuBox .mLogo { background:url(/img/common/icon_all_logo.png) center center no-repeat; width:512px; height:369px; position:absolute; left:0; bottom:0; z-index:10; }

#allmenuBox .infobox { position:absolute; left:80px; top:50%; transform:translateY(-50%); z-index:99; }
#allmenuBox .infobox .logoA { opacity:0; background:url(/img/common/img_logo_a.png) center center no-repeat; width:420px; height:109px; }
#allmenuBox .infobox .fbox { opacity:0; margin:30px 0 0 0; }
#allmenuBox .infobox .fbox p { margin:12px 0 0 0; color:rgba(255,255,255,0.5); font-size:16px; }
#allmenuBox .infobox .fbox p strong { color:#fff; font-size:18px; font-weight:500; font-family: 'Lexend', 'Noto Sans KR', sans-serif; margin:0 18px 0 0; }
#allmenuBox .infobox .fbox p span.bar { display:inline-block; width:45px; }

#allmenuBox .infobox .logoA { animation:ani_5 0.7s 0.3s; animation-fill-mode:forwards;}
#allmenuBox .infobox .fbox { animation:ani_1 0.7s 0.5s; animation-fill-mode:forwards;}

#allmenuBox #gnb > ul > li:nth-child(1) { animation:ani_3 0.7s 0.3s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li:nth-child(2) { animation:ani_3 0.7s 0.4s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li:nth-child(3) { animation:ani_3 0.7s 0.5s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li:nth-child(4) { animation:ani_3 0.7s 0.6s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li:nth-child(5) { animation:ani_3 0.7s 0.7s; animation-fill-mode:forwards;}

#allmenuBox #gnb > ul > li.hover ul li:nth-child(1) { animation:ani_2 0.7s 0.3s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(2) { animation:ani_2 0.7s 0.4s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(3) { animation:ani_2 0.7s 0.5s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(4) { animation:ani_2 0.7s 0.6s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(5) { animation:ani_2 0.7s 0.7s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(6) { animation:ani_2 0.7s 0.8s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(7) { animation:ani_2 0.7s 0.9s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(8) { animation:ani_2 0.7s 0.10s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(9) { animation:ani_2 0.7s 0.11s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(10) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(11) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(12) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(13) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(14) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(15) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(16) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(17) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(18) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(19) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}
#allmenuBox #gnb > ul > li.hover ul li:nth-child(20) { animation:ani_2 0.7s 0.12s; animation-fill-mode:forwards;}

#allmenuBox #gnb > ul > li.hover.on .btnBox { animation:ani_2 0.7s 1.0s; animation-fill-mode:forwards;}
@media screen and (max-width:1400px){
	#allmenuBox #gnb { left:calc(60% - 100px); width:calc(40% + 100px); }
	#allmenuBox #gnb > ul > li { margin:60px 0 0 0; }
	#allmenuBox #gnb > ul > li > a { font-size:35px; line-height:30px; }
	#allmenuBox #gnb > ul > li .subDepth { left:190px; padding:0 60px 0 0; width:calc(100% - 250px); top:14px; }
	#allmenuBox #gnb > ul > li ul li a { font-size:18px; line-height:18px; }
	#allmenuBox #gnb .btnBox { right:20px; }
	#allmenuBox .infobox { left:50px; }
}

@media screen and (max-width:1024px){
	#allmenuBox #gnb { left:50px; width:calc(100% - 50px); top:150px; transform:translateY(0);}
	#allmenuBox #gnb > ul > li { margin:50px 0 0 0; }
	#allmenuBox #gnb > ul > li > a { font-size:30px; line-height:25px; }
	#allmenuBox #gnb > ul > li .subDepth { left:170px; padding:0 60px 0 0; width:calc(100% - 230px); top:12px; }
	#allmenuBox #gnb > ul > li ul li a { font-size:16px; line-height:15px; }
	#allmenuBox #gnb .btnBox { right:20px; }
	#allmenuBox .infobox { left:50px; top:auto; bottom:50px; transform:translateY(0); }
	#allmenuBox .infobox .fbox { margin:20px 0 0 0; }
	#allmenuBox .infobox .fbox p { margin:10px 0 0 0; font-size:15px; }
	#allmenuBox .infobox .fbox p strong { font-size:16px; margin:0 15px 0 0; }
	#allmenuBox .infobox .fbox p span.bar { width:40px; }
	#allmenuBox .infobox .logoA { background-size:250px auto; width:250px; height:65px; }
	#allmenuBox .mLogo { background-size:300px auto; width:300px; height:216px; }
	#allmenuBox .btn_close { top:40px; right:40px; }
}
@media screen and (max-width:640px){
	#allmenuBox #gnb { left:0; width:calc(100% - 60px); top:100px; padding:0 30px; }
	#allmenuBox #gnb > ul > li { margin:60px 0 0 0; }
	#allmenuBox #gnb > ul > li > a { font-size:26px; line-height:22px; }
	#allmenuBox #gnb > ul > li .subDepth { left:0; padding:0 60px 0 0; width:calc(100% - 60px); top:35px; }
	#allmenuBox #gnb > ul > li ul li a { font-size:16px; line-height:15px; }
	#allmenuBox #gnb .btnBox { right:0; top:0; }
	#allmenuBox .infobox { left:30px; bottom:20px; }
	#allmenuBox .infobox .logoA { background-size:180px auto; width:180px; height:47px; }
	#allmenuBox .infobox .fbox { margin:10px 0 0 0; }
	#allmenuBox .infobox .fbox p { margin:10px 0 0 0; font-size:14px; }
	#allmenuBox .infobox .fbox p strong { font-size:14px; margin:0 10px 0 0; }
	#allmenuBox .infobox .fbox p span.bar { width:30px; }
	#allmenuBox .mLogo { background-size:240px auto; width:240px; height:173px; }
}


#container { padding:0 0 230px 0; overflow:hidden; }
@media screen and (max-width:960px){
	#container { padding:0 0 100px 0; }
}

#quickMenu { transition:all .3s ease-in-out; opacity:0; z-index:-5; position:fixed; right:108px; top:50%; transform:translateY(calc(-50% -  0.5px)); width:100px; background-color:#fff; box-shadow:5px 3px 3px 0 rgba(0,0,0,.05), -3px 0 3px 0 rgba(0,0,0,.05); }
header.fix #quickMenu { opacity:1; z-index:5; }
#quickMenu p { padding:18px 0; background-color:#192f8f; text-align:center; font-size:12px; line-height:11px; color:#fff; font-weight:400; text-transform:uppercase;}
#quickMenu ul { text-align:center; background-color:#fff;}
#quickMenu ul:after {content:""; display:block; visibility:hidden; clear:both; height:0; } 
#quickMenu li { width:100%; height:90px; border-top:1px solid #ccc; display:table; }
#quickMenu li:first-child { border-top:none; }
#quickMenu li a { display:table-cell; width:100%; height:100%; vertical-align:middle; transition:all .3s ease-in-out; }
#quickMenu li a strong { display:block; margin:8px 0 0 0; font-weight:400; font-size:12px; color:#555; }
#quickMenu .btn_top { display:block; padding:14px 0; background-color:#333; text-align:center; }
#quickMenu .btn_top span { display:inline-block; color:#fff; font-weight:400; font-size:12px; padding:0 0 0 18px; background:url(/img/common/btn_top.png) left center no-repeat } 

@media screen and (max-width:1440px){
	#quickMenu { right:20px; }
}
@media screen and (max-width:960px){
	#quickMenu p,
	#quickMenu .btn_top { display:none; }
	#quickMenu { right:auto; top:auto; left:0; bottom:0; transform:translateY(0); width:100%; border-top:3px solid #1f2b5e; }
	#quickMenu li { float:left; width:33.33%; border:none; border-left:1px solid #ccc; box-sizing:border-box; }
	#quickMenu li:first-child { border-left:none; }
}

/* footer */
footer { position:relative; background-color:#f1f1f1; z-index:3; margin-top:0; }
footer .f_infobox { position:relative; padding:5px 80px 0 80px; height:218px; }
footer .f_infobox:after{ display: block; content:''; clear:both;}
footer .f_infobox .f_left { position:relative; float:left; }
footer .f_infobox .f_left .flogo { margin:65px 0 0 0; width:174px; height:45px; background:url(/img/common/img_flogo_n.png) left center no-repeat; } 
footer .f_infobox .f_left .copyright { margin:30px 0 0 0; font-size:15px; font-weight:300; color:#666; }
footer .f_infobox .f_info { position:relative; float:right; text-align:right; }
footer .f_infobox .f_info > ul { padding:30px 25px 0 0; background:url(/img/common/icon_p.png) right 36px no-repeat; display:inline-block; }
footer .f_infobox .f_info > ul > li { position:relative; display:inline-block; font-size:15px; font-weight:400; margin:0 0 0 32px;  }
footer .f_infobox .f_info > ul > li:first-child{ margin:0; }
footer .f_infobox .f_info > ul > li:after { content:""; display:block; height:10px; width:1px; background-color:#aaa; position:absolute; left:-16px; top:3px; } 
footer .f_infobox .f_info > ul > li:first-child:after { display:none; }
footer .f_infobox .f_info > ul > li a { color:#444; font-weight:400; font-size:16px; }
footer .f_infobox .f_info > ul > li a B { color:#444; font-weight:500; font-size:16px; }
footer .f_infobox .f_info > ul > li .sbox { display:none; position:absolute; bottom:38px; right:-25px; padding:3px 20px 22px 20px; text-align:left; background:#292a31 url(/img/common/bg_family_s.png) left bottom no-repeat; }
footer .f_infobox .f_info > ul > li .sbox.on { }
footer .f_infobox .f_info > ul > li .sbox li { opacity:0; margin:22px 0 0 0; white-space:nowrap; }
footer .f_infobox .f_info > ul > li .sbox li a { position:relative; color:rgba(255,255,255,0.5); font-size:14px; font-weight:300; min-width:140px; display:block; }
footer .f_infobox .f_info > ul > li .sbox li a:hover { color:rgba(255,255,255,1); }
footer .f_infobox .f_info > ul > li .sbox li a:after { content:""; display:block; opacity:0; position:absolute; right:10px; top:50%; width:11px; height:9px; margin-top:-4px; background:url(/img/common/icon_arr_p.png) left bottom no-repeat; transition:all .3s ease-in-out; }
footer .f_infobox .f_info > ul > li .sbox li a:hover:after { right:0; opacity:1; }
footer .f_infobox .f_info >  p { margin:45px 0 0 0; font-size:16px; font-weight:600; color:#444;  }
footer .f_infobox .f_info .fbox { padding:13px 0 0 0; }
footer .f_infobox .f_info .fbox p { margin:8px 0 0 0; font-size:15px; font-weight:300; color:#777;  }
footer .f_infobox .f_info .fbox p strong { font-weight:500; margin:0 5px 0 0; }
footer .f_infobox .f_info .fbox p span.bar { position:relative; display:inline-block; width:30px; }
footer .f_infobox .f_info .fbox p span.bar:after { content:""; display:block; height:10px; width:1px; background-color:#aaa; position:absolute; left:14px; top:-10px; } 
footer .f_infobox .btnTop { position:absolute; left:80px; top:-60px; width:100px; height:100px; background-color:#b50b14; }
footer .f_infobox .btnTop a { position:relative; display:block; width:100%; height:100%; overflow:hidden; text-indent:-9999em; }
footer .f_infobox .btnTop a:after { content:""; display:block; height:24px; width:25px; margin:-12px 0 0 -12px; transform:translateY(-6px); animation: top_scroll 1.5s 0.3s linear 9999 normal forwards; background:url(/img/common/icon_arr_2.png) left center no-repeat; position:absolute; left:50%; top:50%; transition:all .3s ease-in-out; } 
footer .f_infobox .btnTop a:hover:after {  }
footer .f_infobox .f_info > ul > li .sbox.on li:nth-child(1) {  animation:ani_2 0.5s 0.1s; animation-fill-mode:both; }
footer .f_infobox .f_info > ul > li .sbox.on li:nth-child(2) {  animation:ani_2 0.5s 0.2s; animation-fill-mode:both; }
footer .f_infobox .f_info > ul > li .sbox.on li:nth-child(3) {  animation:ani_2 0.5s 0.3s; animation-fill-mode:both; }
footer .f_infobox .f_info > ul > li .sbox.on li:nth-child(4) {  animation:ani_2 0.5s 0.4s; animation-fill-mode:both; }
footer .f_infobox .f_info > ul > li .sbox.on li:nth-child(5) {  animation:ani_2 0.5s 0.5s; animation-fill-mode:both; }
footer .f_infobox .f_info > ul > li .sbox.on li:nth-child(6) {  animation:ani_2 0.5s 0.6s; animation-fill-mode:both; }
footer .f_infobox .f_info > ul > li .sbox.on li:nth-child(7) {  animation:ani_2 0.5s 0.7s; animation-fill-mode:both; }
footer .f_infobox .f_info > ul > li .sbox.on li:nth-child(8) {  animation:ani_2 0.5s 0.8s; animation-fill-mode:both; }
footer .f_infobox .f_info > ul > li .sbox.on li:nth-child(9) {  animation:ani_2 0.5s 0.9s; animation-fill-mode:both; }

@media screen and (max-width:1280px){
	footer .f_infobox { padding:38px 50px 0 50px; height:218px; }
	footer .f_infobox .btnTop { left:50px; }
}
@media screen and (max-width:960px){
	footer .f_infobox .btnTop { top:-40px; width:80px; height:80px; }
	footer .f_infobox { padding:50px 50px; height:auto; }
	footer .f_infobox .f_left {width:100%; text-align:center; }
	footer .f_infobox .f_left .flogo { margin:50px auto 0 auto; }
	footer .f_infobox .f_info {width:100%; text-align:center; }
}

@media screen and (max-width:640px){
	footer .f_infobox { padding:30px 0 50px 0; height:auto; }
	footer .f_infobox .f_left .flogo { margin:30px auto 0 auto; }
	footer .f_infobox .btnTop { top:-30px; width:50px; height:50px; left:20px; }
	footer .f_infobox .btnTop a:after { background-size:14px auto; margin:-7px 0 0 -7px; }
	footer .f_infobox .f_info > ul > li { font-size:15px; margin:0 0 0 22px;  }
	footer .f_infobox .f_info > ul > li:after { left:-12px; top:3px; } 
	footer .f_infobox .f_info > ul > li a { font-size:15px; }
	footer .f_infobox .f_info >  p { margin:35px 0 0 0; font-size:15px; }
	footer .f_infobox .f_info .fbox { padding:10px 0 0 0; }
	footer .f_infobox .f_info .fbox p { margin:8px 0 0 0; font-size:14px; }
	footer .f_infobox .f_info .fbox p span.bar { position:relative; display:inline-block; width:20px; }
	footer .f_infobox .f_info .fbox p span.bar:after { left:8px; } 
	footer .f_infobox .f_left .copyright { margin:20px 0 0 0; font-size:14px; }
}





/* keyframes animation */
@keyframes scroll {
	0% { transform:translateX(-4px);}
	50% { transform:translateX(4px);}
	100% { transform:translateX(-4px);}
}
@keyframes top_scroll {
	0% { transform:translateY(-6px);}
	50% { transform:translateY(6px);}
	100% { transform:translateY(-6px);}
}
@keyframes vsImg {
	0% { -webkit-transform:scale(1.15); -ms-transform:scale(1.15); transform:scale(1.15); }
	100% { -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); }
}
@keyframes scaleY_bar {
	0% { -webkit-transform:scaleY(0); -ms-transform:scaleY(0); transform:scaleY(0); opacity:0; }
	100% { -webkit-transform:scaleY(1); -ms-transform:scaleY(1); transform:scaleY(1); opacity:1; }
}

@keyframes ani_1 {
	0% { -webkit-transform:translateX(-100px); -ms-transform:translateX(-100px); transform:translateX(-100px); opacity: 0; }
	100% { -webkit-transform:translateX(0); -ms-transform:translateX(0); transform:translateX(0); opacity: 1;}
}

@keyframes ani_2 {
	0% { -webkit-transform:translateX(100px); -ms-transform:translateX(100px); transform:translateX(100px); opacity: 0;}
	100% { -webkit-transform:translateX(0); -ms-transform:translateX(0); transform:translateX(0); opacity: 1;}
}

@keyframes ani_3 {
	0% { -webkit-transform:translateY(50px); -ms-transform:translateY(50px); transform:translateY(50px); opacity: 0;}
	100% { -webkit-transform:translateY(0) rotate(0.001deg); -ms-transform:translateY(0) rotate(0.001deg); transform:translateY(0) rotate(0.001deg); opacity: 1;}
}

@keyframes ani_4 {
	0% { -webkit-transform:translateY(-50px); -ms-transform:translateY(-50px); transform:translateY(-50px); opacity: 0;}
	100% { -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); opacity: 1;}
}
@keyframes ani_5 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}


@keyframes ani_over {
	0% {opacity: 0;}
	99% {opacity: 1;}
	100% {opacity: 0;}
}
@keyframes line_over {
	0% {  opacity:0; }
	80% {  opacity:0.3; }
	99% {  opacity:0.3; }
	100% {  opacity:0; }
}

@keyframes txt_big {
	0% {  opacity:0; }
	40% { opacity:0; }
	100% {  opacity:1; }
}
@-webkit-keyframes txt_big {
	0% {  opacity:0; }
	40% { opacity:0; }
	100% {  opacity:1; }
}

@keyframes vsImg {
	0% { transform:scale(1); }
	100% { transform:scale(1.1); }
}
@-webkit-keyframes vsImg {
	0% { transform:scale(1); }
	100% { transform:scale(1.1); }
}


@keyframes txt_op {
	0% { opacity:0; }
	100% {opacity:1; }
}
@-webkit-keyframes txt_op {
	0% { opacity:0; }
	100% { opacity:1; }
}

@keyframes img_b {
	0% { transform:scale(1.2); opacity:0; }
	100% { transform:scale(1); opacity:1; }
}
@-webkit-keyframes img_b {
	0% { transform:scale(1.2); opacity:0; }
	100% { transform:scale(1); opacity:1; }
}

/* privacy */
.privacy { color:#666; margin:0 auto; max-width:1540px; overflow:hidden; box-sizing:border-box; padding:50px 20px; font-size:15px;	line-height:140%; word-break:break-all; }
.privacy h2 { font-size:18px; font-weight:bold; color:#333; 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:15px;color:#cb0f19;font-weight:700;padding-bottom:5px;}
.privacy > dl > dd{ padding-bottom:10px;text-align:justify; font-size:15px; line-height:140%;}
.privacy > dl > dd ul{ padding:10px; }
.privacy > dl > dd ul li{ line-height:120%; margin-top:10px; }
.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;}
.sTxt h3 { font-size:16px; color:#333; font-weight:700; margin:20px 0 10px; }
.sTxt p { margin-top:10px; }
.sTxt dt { margin-top:10px; }
.sTxt dd { margin:0 8px; }